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

Fix row selection on paginated pages (#5706)

Browse Source
This commit is contained in:
Tymoteusz Czech 2023-12-21 10:01:10 +01:00 committed by GitHub
parent 4e56d1d8d5
commit 9b7981047d
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 32 additions and 2 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

7
frontend/src/component/project/Project/PaginatedProjectFeatureToggles/PaginatedProjectFeatureToggles.tsx
View File

@ -50,6 +50,7 @@ import { TableEmptyState } from './TableEmptyState/TableEmptyState';
import { useRowActions } from './hooks/useRowActions';
import { useUiFlag } from 'hooks/useUiFlag';
import { FeatureTagCell } from 'component/common/Table/cells/FeatureTagCell/FeatureTagCell';
import { useSelectedData } from './hooks/useSelectedData';
interface IPaginatedProjectFeatureTogglesProps {
environments: IProject['environments'];
@ -372,6 +373,8 @@ export const PaginatedProjectFeatureToggles = ({
[columnVisibility, setTableState],
);
const selectedData = useSelectedData(features, rowSelection);
return (
<>
<PageContent
@ -482,10 +485,10 @@ export const PaginatedProjectFeatureToggles = ({
{featureToggleModals}
</div>
</PageContent>
<BatchSelectionActionsBar count={Object.keys(rowSelection).length}>
<BatchSelectionActionsBar count={selectedData.length}>
<ProjectFeaturesBatchActions
selectedIds={Object.keys(rowSelection)}
data={features}
data={selectedData}
projectId={projectId}
onResetSelection={table.resetRowSelection}
onChange={refetch}

27
frontend/src/component/project/Project/PaginatedProjectFeatureToggles/hooks/useSelectedData.ts Normal file
View File

@ -0,0 +1,27 @@
import { useState, useEffect } from 'react';
export const useSelectedData = <T extends { name: string }>(
data: T[],
selection: Record<string, boolean>,
): T[] => {
const [selectedData, setSelectedData] = useState<T[]>([]);
useEffect(() => {
setSelectedData((prevSelectedData) => {
const combinedData = [...data];
prevSelectedData.forEach((item) => {
if (
!combinedData.find(
(dataItem) => dataItem.name === item.name,
)
) {
combinedData.push(item);
}
});
return combinedData.filter((item) => selection[item.name]);
});
}, [data, selection]);
return selectedData;
};