Skip to content

Commit

Permalink
feat: menubar is not dependant on query params anymroe (#7399)
Browse files Browse the repository at this point in the history
Previously since query params were changing by global search, and
menubar was also altering them, they were conflicting. Menubar does not
need query params as state. So using search hook directly.
  • Loading branch information
sjaanus committed Jun 14, 2024
1 parent 9b789ea commit 10d2a29
Showing 1 changed file with 7 additions and 3 deletions.
10 changes: 7 additions & 3 deletions frontend/src/component/commandBar/CommandBar.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,7 +16,6 @@ import { useOnClickOutside } from 'hooks/useOnClickOutside';
import { useOnBlur } from 'hooks/useOnBlur';
import { RecentlyVisited } from './RecentlyVisited/RecentlyVisited';
import { useRecentlyVisited } from 'hooks/useRecentlyVisited';
import { useGlobalFeatureSearch } from '../feature/FeatureToggleList/useGlobalFeatureSearch';
import {
CommandResultGroup,
type CommandResultGroupItem,
Expand All @@ -25,6 +24,7 @@ import { PageSuggestions } from './PageSuggestions';
import { useRoutes } from 'component/layout/MainLayout/NavigationSidebar/useRoutes';
import { useAsyncDebounce } from 'react-table';
import useProjects from 'hooks/api/getters/useProjects/useProjects';
import { useFeatureSearch } from 'hooks/api/getters/useFeatureSearch/useFeatureSearch';

export const CommandResultsPaper = styled(Paper)(({ theme }) => ({
position: 'absolute',
Expand Down Expand Up @@ -87,6 +87,7 @@ export const CommandBar = () => {
const searchInputRef = useRef<HTMLInputElement>(null);
const searchContainerRef = useRef<HTMLInputElement>(null);
const [showSuggestions, setShowSuggestions] = useState(false);
const [searchString, setSearchString] = useState(undefined);
const [searchedProjects, setSearchedProjects] = useState<
CommandResultGroupItem[]
>([]);
Expand Down Expand Up @@ -114,11 +115,14 @@ export const CommandBar = () => {

const [value, setValue] = useState<string>('');

const { features, setTableState } = useGlobalFeatureSearch(3);
const { features = [] } = useFeatureSearch({
query: searchString,
limit: '3',
});
const { projects } = useProjects();

const debouncedSetSearchState = useAsyncDebounce((query) => {
setTableState({ query });
setSearchString(query);

const filteredProjects = projects.filter((project) =>
project.name.toLowerCase().includes(query.toLowerCase()),
Expand Down

0 comments on commit 10d2a29

Please sign in to comment.