Rev 5084 | Ir a la última revisión | Autoría | Comparar con el anterior | Ultima modificación | Ver Log |
/* eslint-disable react/prop-types */
import React from 'react'
import { useForm } from 'react-hook-form'
export default function SearchList({
title,
fetchCallback,
addTitle = '',
addCallback = ''
}) {
const { register, getValues } = useForm()
const handleSearch = () => {
const searchValue = getValues('search')
if (fetchCallback) setTimeout(() => fetchCallback(searchValue), [500])
}
return (
<>
{!!title &&
<div className="company-title">
<div className="section_admin_title_buttons" style={!addTitle ? { width: '100%' } : {}}>
<h1
className="title"
style={!addTitle ? { flex: '1', textAlign: 'center' } : {}}
>{title}</h1>
{(!!addTitle && !!addCallback) &&
<h2 className="title" onClick={addCallback}>
{addTitle}
</h2>
}
</div>
</div>
}
<div className="search-box">
<input
type="text"
name="search"
className="form-control"
ref={register}
onKeyUp={handleSearch}
/>
<button className='btn btn-search'>
{LABELS.SEARCH}
</button>
</div>
</>
)
}