feature: display only 5 results in filter search (#96)

* feature: display only 5 results in filter search

* feature: Display laoding in a dropdown item

* test: use testid insread of text
This commit is contained in:
Sammy Teillet
2023-05-04 14:58:43 +02:00
committed by GitHub
parent 6a8a8f0728
commit 3605c0034c
4 changed files with 10 additions and 3 deletions

View File

@ -65,7 +65,11 @@ export function FilterDropdownButton<FilterProperties>({
selectedFilter: FilterType<FilterProperties>, selectedFilter: FilterType<FilterProperties>,
) => { ) => {
if (filterSearchResults.loading) { if (filterSearchResults.loading) {
return 'LOADING'; return (
<DropdownButton.StyledDropdownItem data-testid="loading-search-results">
Loading
</DropdownButton.StyledDropdownItem>
);
} }
return filterSearchResults.results.map((value, index) => ( return filterSearchResults.results.map((value, index) => (
<DropdownButton.StyledDropdownItem <DropdownButton.StyledDropdownItem

View File

@ -48,6 +48,7 @@ const mocks = [
{ lastname: { _ilike: '%%' } }, { lastname: { _ilike: '%%' } },
], ],
}, },
limit: 5,
}, },
}, },
result: { result: {
@ -66,6 +67,7 @@ const mocks = [
{ lastname: { _ilike: '%Jane%' } }, { lastname: { _ilike: '%Jane%' } },
], ],
}, },
limit: 5,
}, },
}, },
result: { result: {

View File

@ -84,7 +84,7 @@ it('Checks the selection of top option for Doesnot include', async () => {
it('Calls the filters when typing a new name', async () => { it('Calls the filters when typing a new name', async () => {
const setFilters = jest.fn(); const setFilters = jest.fn();
const { getByText, getByPlaceholderText, queryByText } = render( const { getByText, getByPlaceholderText, queryByText, getByTestId } = render(
<RegularFilterDropdownButton setFilter={setFilters} />, <RegularFilterDropdownButton setFilter={setFilters} />,
); );
@ -100,7 +100,7 @@ it('Calls the filters when typing a new name', async () => {
fireEvent.change(filterSearch, { target: { value: 'Jane' } }); fireEvent.change(filterSearch, { target: { value: 'Jane' } });
await waitFor(() => { await waitFor(() => {
const loadingDiv = getByText('LOADING'); const loadingDiv = getByTestId('loading-search-results');
expect(loadingDiv).toBeDefined(); expect(loadingDiv).toBeDefined();
}); });

View File

@ -72,6 +72,7 @@ export const useSearch = (): [
{ {
variables: { variables: {
where, where,
limit: 5,
}, },
skip: !filter, skip: !filter,
}, },