diff --git a/frontend/src/pages/Offers/List/hooks/useFilters.test.tsx b/frontend/src/pages/Offers/List/hooks/useFilters.test.tsx index a011a2a9f..9de7150e5 100644 --- a/frontend/src/pages/Offers/List/hooks/useFilters.test.tsx +++ b/frontend/src/pages/Offers/List/hooks/useFilters.test.tsx @@ -9,14 +9,21 @@ let mockRememberedProject: string | null; const mockSetRememberedProject = jest.fn(); let mockProjectsData: { data: { project_name: string }[] } | undefined; const mockGetProject = jest.fn(); +const mockGetProjects = jest.fn(); +const mockUseGetProjectsQuery = jest.fn(); jest.mock('hooks/useLocalStorageState', () => ({ useLocalStorageState: () => [mockRememberedProject, mockSetRememberedProject], })); jest.mock('services/fleet', () => ({ useLazyGetProjectFleetsQuery: () => [jest.fn()] })); +jest.mock('App/slice', () => ({ selectUserName: jest.fn() })); +jest.mock('hooks/useAppSelector', () => ({ __esModule: true, default: () => 'alice' })); jest.mock('services/project', () => ({ - useLazyGetProjectsQuery: () => [jest.fn()], - useGetProjectsQuery: () => ({ data: mockProjectsData }), + useLazyGetProjectsQuery: () => [mockGetProjects], + useGetProjectsQuery: (...args: unknown[]) => { + mockUseGetProjectsQuery(...args); + return { data: mockProjectsData }; + }, useLazyGetProjectQuery: () => [mockGetProject], })); let filters: ReturnType; @@ -43,11 +50,26 @@ beforeEach(() => { mockRememberedProject = null; mockProjectsData = undefined; mockGetProject.mockReset(); + mockGetProjects.mockReset(); + mockUseGetProjectsQuery.mockReset(); }); afterEach(() => act(() => renderer.unmount())); describe('Offer filters', () => { + test("auto-selects and suggests only the user's projects", async () => { + mockGetProjects.mockReturnValue({ unwrap: () => Promise.resolve({ data: [{ project_name: 'main' }] }) }); + renderFilters('/'); + expect(mockUseGetProjectsQuery).toHaveBeenCalledWith({ username: 'alice', limit: 2 }, { skip: false }); + + await act(async () => { + await filters.handleLoadItems!({ + detail: { filteringProperty: { key: 'project_name' }, filteringText: 'ma' }, + } as never); + }); + expect(mockGetProjects).toHaveBeenCalledWith(expect.objectContaining({ username: 'alice', name_pattern: 'ma' })); + }); + test('remembers the selected project', () => { renderFilters('/?project_name=main'); expect(mockSetRememberedProject).toHaveBeenCalledWith('main'); diff --git a/frontend/src/pages/Offers/List/hooks/useFilters.ts b/frontend/src/pages/Offers/List/hooks/useFilters.ts index dd4342b5a..bd810059b 100644 --- a/frontend/src/pages/Offers/List/hooks/useFilters.ts +++ b/frontend/src/pages/Offers/List/hooks/useFilters.ts @@ -3,6 +3,7 @@ import { useSearchParams } from 'react-router-dom'; import type { MultiselectProps, PropertyFilterProps } from 'components'; +import useAppSelector from 'hooks/useAppSelector'; import { useLocalStorageState } from 'hooks/useLocalStorageState'; import { EMPTY_QUERY, @@ -15,6 +16,8 @@ import { import { useLazyGetProjectFleetsQuery } from 'services/fleet'; import { useGetProjectsQuery, useLazyGetProjectQuery, useLazyGetProjectsQuery } from 'services/project'; +import { selectUserName } from 'App/slice'; + import { formatGpuVendor, getFleetFilterValue, getPropertyFilterOptions, rangeToObject } from '../helpers'; type RequestParamsKeys = @@ -203,7 +206,8 @@ export const useFilters = ({ const [getProjects] = useLazyGetProjectsQuery(); const [getProject] = useLazyGetProjectQuery(); const [getProjectFleets] = useLazyGetProjectFleetsQuery(); - const { data: projectsData } = useGetProjectsQuery({ limit: 2 }); + const userName = useAppSelector(selectUserName); + const { data: projectsData } = useGetProjectsQuery({ username: userName ?? '', limit: 2 }, { skip: !userName }); const propertyFilterRef = useRef(null); const projectNameIsChecked = useRef(false); const prevSelectedProjectName = useRef(); @@ -469,15 +473,16 @@ export const useFilters = ({ setFilteringStatusType('loading'); - if (filteringProperty?.key === filterKeys.PROJECT_NAME) { - await getProjects( - getTokenAwareNamePatternFilterRequestParams({ + if (filteringProperty?.key === filterKeys.PROJECT_NAME && userName) { + await getProjects({ + username: userName, + ...getTokenAwareNamePatternFilterRequestParams({ filteringText, limit, propertyKey: filterKeys.PROJECT_NAME, tokens: propertyFilterQuery.tokens, }), - ) + }) .unwrap() .then(({ data }) => data.map(({ project_name }) => ({