Skip to content

Instantly share code, notes, and snippets.

  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
Star You must be signed in to star a gist
Save hesan-aminiloo/46ac77b14f518baba5860608e3c884b3 to your computer and use it in GitHub Desktop.
const BrandItem = ({ brand }) => (
<li>
<input type="checkbox" name='brands' id={brand.id} value={brand.name} />
<span>{brand.name}</span>
</li>
)
const BrandsSidebar = () => {
const [brands] = useBrands();
const [filter, setFilter] = useState('');
return (
<div>
<input type="text" value={filter} onChange={({ target }) => setFilter(target.value)} />
{
brands
.filter(({ name }) => name.toLowerCase().includes(filter.toLowerCase()))
.map((brand) => (
<BrandItem key={brand.id} brand={brand} />
))
}
</div>
)
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment