Mirrors/unleash.unleash
1
0
Fork 0
mirror of https://github.com/Unleash/unleash.git synced 2025-02-04 00:18:01 +01:00
Code Issues Projects Releases Wiki Activity

fix: add pagination filter (#631)

Browse Source
This commit is contained in:
Fredrik Strand Oseberg 2022-01-26 12:27:34 +01:00 committed by GitHub
parent 1d2bd717ee
commit 8462b00d5c
2 changed files with 31 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

11
frontend/src/component/admin/project-roles/ProjectRoles/ProjectRoleList/ProjectRoleList.tsx
View File

@ -12,7 +12,7 @@ import { ADMIN } from '../../../../providers/AccessProvider/permissions';
import PaginateUI from '../../../../common/PaginateUI/PaginateUI'; import PaginateUI from '../../../../common/PaginateUI/PaginateUI';
import ProjectRoleListItem from './ProjectRoleListItem/ProjectRoleListItem'; import ProjectRoleListItem from './ProjectRoleListItem/ProjectRoleListItem';
import useProjectRoles from '../../../../../hooks/api/getters/useProjectRoles/useProjectRoles'; import useProjectRoles from '../../../../../hooks/api/getters/useProjectRoles/useProjectRoles';
import { IProjectRole } from '../../../../../interfaces/role'; import IRole, { IProjectRole } from '../../../../../interfaces/role';
import useProjectRolesApi from '../../../../../hooks/api/actions/useProjectRolesApi/useProjectRolesApi'; import useProjectRolesApi from '../../../../../hooks/api/actions/useProjectRolesApi/useProjectRolesApi';
import useToast from '../../../../../hooks/useToast'; import useToast from '../../../../../hooks/useToast';
import ProjectRoleDeleteConfirm from '../ProjectRoleDeleteConfirm/ProjectRoleDeleteConfirm'; import ProjectRoleDeleteConfirm from '../ProjectRoleDeleteConfirm/ProjectRoleDeleteConfirm';
@ -22,8 +22,11 @@ const ROOTROLE = 'root';
const ProjectRoleList = () => { const ProjectRoleList = () => {
const { hasAccess } = useContext(AccessContext); const { hasAccess } = useContext(AccessContext);
const { roles } = useProjectRoles(); const { roles } = useProjectRoles();
const paginationFilter = (role: IRole) => role?.type !== ROOTROLE;
const { page, pages, nextPage, prevPage, setPageIndex, pageIndex } = const { page, pages, nextPage, prevPage, setPageIndex, pageIndex } =
usePagination(roles, 10); usePagination(roles, 10, paginationFilter);
const { deleteRole } = useProjectRolesApi(); const { deleteRole } = useProjectRolesApi();
const { refetch } = useProjectRoles(); const { refetch } = useProjectRoles();
const [currentRole, setCurrentRole] = useState<IProjectRole | null>(null); const [currentRole, setCurrentRole] = useState<IProjectRole | null>(null);
@ -49,9 +52,7 @@ const ProjectRoleList = () => {
}; };
const renderRoles = () => { const renderRoles = () => {
return page return page.map((role: IProjectRole) => {
.filter(role => role?.type !== ROOTROLE)
.map((role: IProjectRole) => {
return ( return (
<ProjectRoleListItem <ProjectRoleListItem
key={role.id} key={role.id}

15
frontend/src/hooks/usePagination.ts
View File

@ -1,13 +1,24 @@
import { useEffect, useState } from 'react'; import { useEffect, useState } from 'react';
import { paginate } from '../utils/paginate'; import { paginate } from '../utils/paginate';
const usePagination = (data: any[], limit: number) => { const usePagination = (
data: any[],
limit: number,
filterFunc?: (item: any) => boolean
) => {
const [paginatedData, setPaginatedData] = useState([[]]); const [paginatedData, setPaginatedData] = useState([[]]);
const [pageIndex, setPageIndex] = useState(0); const [pageIndex, setPageIndex] = useState(0);
useEffect(() => { useEffect(() => {
const result = paginate(data, limit); let dataToPaginate = data;
if (filterFunc) {
dataToPaginate = data.filter(filterFunc);
}
const result = paginate(dataToPaginate, limit);
setPaginatedData(result); setPaginatedData(result);
/* eslint-disable-next-line */
}, [data, limit]); }, [data, limit]);
const nextPage = () => { const nextPage = () => {