fix(ui): pagination with search on service page (#18211)

This commit is contained in:
Chirag Madlani 2024-10-10 18:10:17 +05:30 committed by GitHub
parent 3dc9abef45
commit 6b830f98bb
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194

View File

@ -23,6 +23,7 @@ import { Link, useHistory } from 'react-router-dom';
import {
DISABLED,
getServiceDetailsPath,
INITIAL_PAGING_VALUE,
pagingObject,
} from '../../../constants/constants';
import { CONNECTORS_DOCS } from '../../../constants/docs.constants';
@ -194,15 +195,27 @@ const Services = ({ serviceName }: ServicesProps) => {
[searchIndex, serviceName, deleted]
);
const handleServicePageChange = ({
cursorType,
const handleServicePageChange = useCallback(
({ cursorType, currentPage }: PagingHandlerParams) => {
if (searchTerm) {
handlePageChange(currentPage);
getServiceDetails({
currentPage,
}: PagingHandlerParams) => {
if (cursorType) {
search: searchTerm,
limit: pageSize,
filters: serviceTypeFilter?.length
? `(${serviceTypeFilter
.map((type) => `serviceType:${type}`)
.join(' ')})`
: undefined,
});
} else if (cursorType) {
handlePageChange(currentPage);
getServiceDetails({ [cursorType]: paging[cursorType] });
}
handlePageChange(currentPage);
};
},
[getServiceDetails, searchTerm, serviceTypeFilter, paging, pageSize]
);
const addServicePermission = useMemo(
() =>
@ -414,6 +427,7 @@ const Services = ({ serviceName }: ServicesProps) => {
const handleServiceSearch = useCallback(
async (search: string) => {
handlePageChange(INITIAL_PAGING_VALUE);
setSearchTerm(search);
},
[getServiceDetails]
@ -511,6 +525,7 @@ const Services = ({ serviceName }: ServicesProps) => {
{showPagination && (
<NextPrevious
currentPage={currentPage}
isNumberBased={!isEmpty(searchTerm)}
pageSize={pageSize}
paging={paging}
pagingHandler={handleServicePageChange}