Recibo este error: Uncaught TypeError: setSearchQuery is not a function en la aplicación Next.js / Typescript donde estoy escribiendo una consulta de búsqueda dentro del cuadro de búsqueda. Creé una función de búsqueda genérica en TypeScript y todo mi código funciona bien, espero recibir este pequeño error... ¿Alguna idea de lo que estoy haciendo mal?

TopPanel.tsx

 export interface ISearchInputProps { setSearchQuery: (searchQuery: string) => void; export const TopPanel = (props: ISearchInputProps) => { const { setSearchQuery } = props; return ( <div> <input type="text" placeholder="Search Assets..." onChange={(event) => setSearchQuery(event.target.value)} /> </div> ); }

AssetsList.tsx

 import generiSearch from 'src/utils/genericSearch' const [query] = useState<string>('');```` const filteredData = reserves .filter((res) => genericSearch(res, ['symbol'], query, false)) .map((reserve) => ({ ...rest of the code... })); return ( ... ); }

genericSearch.ts

 export default function genericSearch<T>( object: T, properties: Array<keyof T>, query: string, shouldBeCaseSensitive: boolean ): boolean { if (query === '') { return true; } const expression = properties.map((property) => { const value = object[property]; if (typeof value === 'string' || typeof value === 'number') { if (shouldBeCaseSensitive) { return value.toString().includes(query); } else { return value.toString().toLowerCase().includes(query.toLowerCase()); } } return false; }); return expression.some((expression) => expression); }