diff --git a/apps/portal/src/components/questions/QuestionSearchBar.tsx b/apps/portal/src/components/questions/QuestionSearchBar.tsx index 917c342d..bafcb3cb 100644 --- a/apps/portal/src/components/questions/QuestionSearchBar.tsx +++ b/apps/portal/src/components/questions/QuestionSearchBar.tsx @@ -9,10 +9,14 @@ import SortOptionsSelect from './SortOptionsSelect'; export type QuestionSearchBarProps = SortOptionsSelectProps & { onFilterOptionsToggle: () => void; + onQueryChange: (query: string) => void; + query: string; }; export default function QuestionSearchBar({ onFilterOptionsToggle, + onQueryChange, + query, ...sortOptionsSelectProps }: QuestionSearchBarProps) { return ( @@ -24,6 +28,10 @@ export default function QuestionSearchBar({ placeholder="Search by content" startAddOn={MagnifyingGlassIcon} startAddOnType="icon" + value={query} + onChange={(value) => { + onQueryChange(value); + }} />
diff --git a/apps/portal/src/pages/questions/browse.tsx b/apps/portal/src/pages/questions/browse.tsx index 9a974f5d..36bcc2a2 100644 --- a/apps/portal/src/pages/questions/browse.tsx +++ b/apps/portal/src/pages/questions/browse.tsx @@ -47,6 +47,8 @@ function locationToSlug(value: Location & TypeaheadOption): string { export default function QuestionsBrowsePage() { const router = useRouter(); + const [query, setQuery] = useState(''); + const [ selectedCompanySlugs, setSelectedCompanySlugs, @@ -170,13 +172,14 @@ export default function QuestionsBrowsePage() { const questionsInfiniteQuery = trpc.useInfiniteQuery( [ - 'questions.questions.getQuestionsByFilter', + 'questions.questions.getQuestionsByFilterAndContent', { // TODO: Enable filtering by countryIds and stateIds cityIds: selectedLocations .map(({ cityId }) => cityId) .filter((id) => id !== undefined) as Array, companyIds: selectedCompanySlugs.map((slug) => slug.split('_')[0]), + content: query, countryIds: [], endDate: today, limit: 10, @@ -505,11 +508,15 @@ export default function QuestionsBrowsePage() {
{ setFilterDrawerOpen(!filterDrawerOpen); }} + onQueryChange={(newQuery) => { + setQuery(newQuery); + }} onSortOrderChange={setSortOrder} onSortTypeChange={setSortType} />