1
0
mirror of https://github.com/Unleash/unleash.git synced 2025-02-04 00:18:01 +01:00

feat: menubar is not dependant on query params anymroe (#7399)

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.
This commit is contained in:
Jaanus Sellin 2024-06-14 12:26:52 +03:00 committed by GitHub
parent 9b789ea5ef
commit 10d2a295c7
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -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,
@ -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',
@ -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[]
>([]);
@ -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()),