diff --git a/frontend/pages/Home/components/DefinitionList/ConfigureSearchOptionsDialog.tsx b/frontend/pages/Home/components/DefinitionList/ConfigureSearchOptionsDialog.tsx index 92d3262..40a00e0 100644 --- a/frontend/pages/Home/components/DefinitionList/ConfigureSearchOptionsDialog.tsx +++ b/frontend/pages/Home/components/DefinitionList/ConfigureSearchOptionsDialog.tsx @@ -8,6 +8,7 @@ export type SearchDefinitionsOptions = { title: string source: string folding: boolean + definitionGroup: string } type Props = { @@ -38,6 +39,13 @@ export const ConfigureSearchOptionsDialog: React.FC = ({ onClickClose() } + const onChangeDefinitionGroup = useCallback( + (event: React.ChangeEvent) => { + setTemporarySearchDefinitionsOptions((prev) => ({ ...prev, definitionGroup: event.target.value })) + }, + [setTemporarySearchDefinitionsOptions], + ) + const onChangeTitle = useCallback( (event: React.ChangeEvent) => { setTemporarySearchDefinitionsOptions((prev) => ({ ...prev, title: event.target.value })) @@ -77,6 +85,15 @@ export const ConfigureSearchOptionsDialog: React.FC = ({

Configure settings related to the display of definitions.

+ + + + diff --git a/frontend/pages/Home/components/DefinitionList/DefinitionList.tsx b/frontend/pages/Home/components/DefinitionList/DefinitionList.tsx index 2c7b906..5962197 100644 --- a/frontend/pages/Home/components/DefinitionList/DefinitionList.tsx +++ b/frontend/pages/Home/components/DefinitionList/DefinitionList.tsx @@ -20,12 +20,13 @@ type DialogType = 'configureSearchOptionsDiaglog' export const DefinitionList: FC = ({ selectedDefinitionIds, setSelectedDefinitionIds }) => { const [visibleDialog, setVisibleDialog] = useState(null) const [searchDefinitionsOptions, setSearchDefinitionsOptions] = useLocalStorage( - 'Home-DefinitionList-SearchDefinitionOptions', - { title: '', source: '', folding: false }, + 'Home-DefinitionList-SearchDefinitionOptions-v1', + { definitionGroup: '', title: '', source: '', folding: false }, ) const [foldingSection, setFoldingSection] = useState(false) const { isLoading, definitions, isValidating, setSize, isReachingEnd } = useDefinitionList({ + definitionGroup: searchDefinitionsOptions.definitionGroup, title: searchDefinitionsOptions.title, source: searchDefinitionsOptions.source, }) diff --git a/frontend/repositories/definitionListRepository.ts b/frontend/repositories/definitionListRepository.ts index 5783d7f..90d661e 100644 --- a/frontend/repositories/definitionListRepository.ts +++ b/frontend/repositories/definitionListRepository.ts @@ -21,7 +21,10 @@ type DefinitionsResponse = { export const PER = 100 -export const useDefinitionList = (query: { title: string; source: string }, keepPreviousData: boolean = false) => { +export const useDefinitionList = ( + query: { definitionGroup: string; title: string; source: string }, + keepPreviousData: boolean = false, +) => { const getKey = (pageIndex: number, previousPageData: DefinitionReponse[] | null) => { if (previousPageData && previousPageData.length === 0) { return null @@ -29,7 +32,9 @@ export const useDefinitionList = (query: { title: string; source: string }, keep const params = { per: PER, page: pageIndex + 1, - ...query, + definition_group: query.definitionGroup, + title: query.title, + source: query.source, } return `${path.api.definitions.index()}?${stringify(params)}`