mirror of
https://github.com/datahub-project/datahub.git
synced 2025-12-15 20:16:52 +00:00
feat(search) Allow users to update the number of search results per page (#5212)
Co-authored-by: Chris Collins <chriscollins@Chriss-MBP-2-3.lan>
This commit is contained in:
parent
68762a2f95
commit
4c9554e9d2
@ -1,4 +1,4 @@
|
||||
import React, { useEffect } from 'react';
|
||||
import React, { useEffect, useState } from 'react';
|
||||
import * as QueryString from 'query-string';
|
||||
import { useHistory, useLocation, useParams } from 'react-router';
|
||||
import { Alert } from 'antd';
|
||||
@ -39,13 +39,15 @@ export const SearchPage = () => {
|
||||
.filter((filter) => filter.field === ENTITY_FILTER_NAME)
|
||||
.map((filter) => filter.value.toUpperCase() as EntityType);
|
||||
|
||||
const [numResultsPerPage, setNumResultsPerPage] = useState(SearchCfg.RESULTS_PER_PAGE);
|
||||
|
||||
const { data, loading, error } = useGetSearchResultsForMultipleQuery({
|
||||
variables: {
|
||||
input: {
|
||||
types: entityFilters,
|
||||
query,
|
||||
start: (page - 1) * SearchCfg.RESULTS_PER_PAGE,
|
||||
count: SearchCfg.RESULTS_PER_PAGE,
|
||||
start: (page - 1) * numResultsPerPage,
|
||||
count: numResultsPerPage,
|
||||
filters: filtersWithoutEntities,
|
||||
},
|
||||
},
|
||||
@ -118,6 +120,8 @@ export const SearchPage = () => {
|
||||
loading={loading}
|
||||
onChangeFilters={onChangeFilters}
|
||||
onChangePage={onChangePage}
|
||||
numResultsPerPage={numResultsPerPage}
|
||||
setNumResultsPerPage={setNumResultsPerPage}
|
||||
/>
|
||||
</SearchablePage>
|
||||
);
|
||||
|
||||
@ -137,6 +137,8 @@ interface Props {
|
||||
}) => Promise<SearchResultsInterface | null | undefined>;
|
||||
entityFilters: EntityType[];
|
||||
filtersWithoutEntities: FacetFilterInput[];
|
||||
numResultsPerPage: number;
|
||||
setNumResultsPerPage: (numResults: number) => void;
|
||||
}
|
||||
|
||||
export const SearchResults = ({
|
||||
@ -151,6 +153,8 @@ export const SearchResults = ({
|
||||
callSearchOnVariables,
|
||||
entityFilters,
|
||||
filtersWithoutEntities,
|
||||
numResultsPerPage,
|
||||
setNumResultsPerPage,
|
||||
}: Props) => {
|
||||
const pageStart = searchResponse?.start || 0;
|
||||
const pageSize = searchResponse?.count || 0;
|
||||
@ -175,6 +179,10 @@ export const SearchResults = ({
|
||||
onChangeFilters(newFilters);
|
||||
};
|
||||
|
||||
const updateNumResults = (_currentNum: number, newNum: number) => {
|
||||
setNumResultsPerPage(newNum);
|
||||
};
|
||||
|
||||
const history = useHistory();
|
||||
|
||||
const combinedSiblingSearchResults = combineSiblingsInSearchResults(searchResponse?.searchResults);
|
||||
@ -257,11 +265,13 @@ export const SearchResults = ({
|
||||
<PaginationControlContainer>
|
||||
<Pagination
|
||||
current={page}
|
||||
pageSize={SearchCfg.RESULTS_PER_PAGE}
|
||||
pageSize={numResultsPerPage}
|
||||
total={totalResults}
|
||||
showLessItems
|
||||
onChange={onChangePage}
|
||||
showSizeChanger={false}
|
||||
showSizeChanger={totalResults > SearchCfg.RESULTS_PER_PAGE}
|
||||
onShowSizeChange={updateNumResults}
|
||||
pageSizeOptions={['10', '20', '50']}
|
||||
/>
|
||||
</PaginationControlContainer>
|
||||
{authenticatedUserUrn && (
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user