diff --git a/web/src/components/community-icon-search.tsx b/web/src/components/community-icon-search.tsx index 29c5d142..a49c003e 100644 --- a/web/src/components/community-icon-search.tsx +++ b/web/src/components/community-icon-search.tsx @@ -84,7 +84,7 @@ export function CommunityIconSearch({ icons }: CommunityIconSearchProps) { const categories = new Set() for (const icon of icons) { for (const category of icon.data.categories) { - categories.add(category.toLowerCase()); + categories.add(category.toLowerCase()) } } return Array.from(categories).sort() @@ -175,17 +175,13 @@ export function CommunityIconSearch({ icons }: CommunityIconSearchProps) { const handleCategoryChange = useCallback( (category: string) => { - const normalizedCategory = category.toLowerCase(); + const normalizedCategory = category.toLowerCase() let newCategories: string[] - if ( - selectedCategories.some((c) => c.toLowerCase() === normalizedCategory) - ) { - newCategories = selectedCategories.filter( - (c) => c.toLowerCase() !== normalizedCategory, - ); + if (selectedCategories.some((c) => c.toLowerCase() === normalizedCategory)) { + newCategories = selectedCategories.filter((c) => c.toLowerCase() !== normalizedCategory) } else { - newCategories = [...selectedCategories, normalizedCategory]; + newCategories = [...selectedCategories, normalizedCategory] } setSelectedCategories(newCategories) @@ -268,11 +264,7 @@ export function CommunityIconSearch({ icons }: CommunityIconSearchProps) {
- - - Select Categories - + Select Categories
{allCategories.map((category) => ( c.toLowerCase() === category.toLowerCase(), - )} + checked={selectedCategories.some((c) => c.toLowerCase() === category.toLowerCase())} onCheckedChange={() => handleCategoryChange(category)} className="cursor-pointer capitalize" > - {category - .replace(/-/g, " ") - .replace(/\b\w/g, (c) => c.toUpperCase())} + {category.replace(/-/g, " ").replace(/\b\w/g, (c) => c.toUpperCase())} ))}
@@ -310,8 +296,8 @@ export function CommunityIconSearch({ icons }: CommunityIconSearchProps) { { - setSelectedCategories([]); - updateResults(searchQuery, [], sortOption); + setSelectedCategories([]) + updateResults(searchQuery, [], sortOption) }} className="cursor-pointer focus:bg-rose-50 dark:focus:bg-rose-950/20" > @@ -324,49 +310,28 @@ export function CommunityIconSearch({ icons }: CommunityIconSearchProps) { - - - Sort By - + Sort By - handleSortChange(value as SortOption)} - > - + handleSortChange(value as SortOption)}> + Relevance - + Name (A-Z) - + Name (Z-A) - + Newest first @@ -374,15 +339,8 @@ export function CommunityIconSearch({ icons }: CommunityIconSearchProps) { - {(searchQuery || - selectedCategories.length > 0 || - sortOption !== "relevance") && ( - @@ -394,14 +352,8 @@ export function CommunityIconSearch({ icons }: CommunityIconSearchProps) { Selected:
{selectedCategories.map((category) => ( - - {category - .replace(/-/g, " ") - .replace(/\b\w/g, (c) => c.toUpperCase())} + + {category.replace(/-/g, " ").replace(/\b\w/g, (c) => c.toUpperCase())}
- + @@ -478,5 +423,5 @@ export function CommunityIconSearch({ icons }: CommunityIconSearchProps) {
)} - ); + ) }