\n {/* Search input */}\n

\n \n Search Books\n \n setSearch(e.target.value)}\n className=\"search-input w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent\"\n />\n

\n\n {/* Status filter */}\n

\n \n Reading Status\n \n setStatus(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent\"\n >\n \n \n \n \n \n

\n\n {/* Genre filter */}\n

\n \n Genre\n \n setGenre(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent\"\n >\n \n {genres.map((g) => (\n \n ))}\n \n

\n\n {/* Rating filter */}\n

\n \n Rating\n \n setRating(e.target.value)}\n className=\"w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent\"\n >\n \n \n \n \n \n \n \n

\n\n {/* Clear filters button */}\n {hasActiveFilters && (\n

\n \n Clear all filters\n \n

\n )}\n

\n );\n}","deleted","label",[170,171,153],"frontend","components","permalink","https://www.val.town/x/lilac/simanon/code/frontend/components/SearchBar.tsx","extension","actionData","errors"]