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: project features batch actions refetch (#5680)

Browse Source 
Reload paginated features on project overview after batch action.
This commit is contained in:
Tymoteusz Czech 2023-12-19 13:46:06 +01:00 committed by GitHub
parent 42943ada75
commit 8388700f76
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
5 changed files with 44 additions and 19 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

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

@ -481,6 +481,7 @@ export const PaginatedProjectFeatureToggles = ({
data={features} data={features}
projectId={projectId} projectId={projectId}
onResetSelection={table.resetRowSelection} onResetSelection={table.resetRowSelection}
onChange={refetch}
/> />
</BatchSelectionActionsBar> </BatchSelectionActionsBar>
</> </>

1
frontend/src/component/project/Project/ProjectFeatureToggles/ProjectFeatureToggles.tsx
View File

@ -693,6 +693,7 @@ export const ProjectFeatureToggles = ({
data={features} data={features}
projectId={projectId} projectId={projectId}
onResetSelection={() => toggleAllRowsSelected(false)} onResetSelection={() => toggleAllRowsSelected(false)}
onChange={onChange}
/> />
</BatchSelectionActionsBar> </BatchSelectionActionsBar>
</> </>

11
frontend/src/component/project/Project/ProjectFeatureToggles/ProjectFeaturesBatchActions/ManageTags.tsx
View File

@ -6,7 +6,6 @@ import { ITag } from 'interfaces/tags';
import useTagApi from 'hooks/api/actions/useTagApi/useTagApi'; import useTagApi from 'hooks/api/actions/useTagApi/useTagApi';
import useToast from 'hooks/useToast'; import useToast from 'hooks/useToast';
import { formatUnknownError } from 'utils/formatUnknownError'; import { formatUnknownError } from 'utils/formatUnknownError';
import useProject from 'hooks/api/getters/useProject/useProject';
import { PermissionHOC } from 'component/common/PermissionHOC/PermissionHOC'; import { PermissionHOC } from 'component/common/PermissionHOC/PermissionHOC';
import { UPDATE_FEATURE } from 'component/providers/AccessProvider/permissions'; import { UPDATE_FEATURE } from 'component/providers/AccessProvider/permissions';
import { usePlausibleTracker } from 'hooks/usePlausibleTracker'; import { usePlausibleTracker } from 'hooks/usePlausibleTracker';
@ -14,11 +13,15 @@ import { usePlausibleTracker } from 'hooks/usePlausibleTracker';
interface IManageTagsProps { interface IManageTagsProps {
data: FeatureSchema[]; data: FeatureSchema[];
projectId: string; projectId: string;
onChange?: () => void;
} }
export const ManageTags: VFC<IManageTagsProps> = ({ projectId, data }) => { export const ManageTags: VFC<IManageTagsProps> = ({
projectId,
data,
onChange,
}) => {
const { bulkUpdateTags } = useTagApi(); const { bulkUpdateTags } = useTagApi();
const { refetch } = useProject(projectId);
const { setToastData, setToastApiError } = useToast(); const { setToastData, setToastApiError } = useToast();
const { trackEvent } = usePlausibleTracker(); const { trackEvent } = usePlausibleTracker();
const [isOpen, setIsOpen] = useState(false); const [isOpen, setIsOpen] = useState(false);
@ -60,7 +63,6 @@ export const ManageTags: VFC<IManageTagsProps> = ({ projectId, data }) => {
const payload = { features, tags: { addedTags, removedTags } }; const payload = { features, tags: { addedTags, removedTags } };
try { try {
await bulkUpdateTags(payload, projectId); await bulkUpdateTags(payload, projectId);
refetch();
const added = addedTags.length const added = addedTags.length
? `Added tags: ${addedTags ? `Added tags: ${addedTags
.map(({ type, value }) => `${type}:${value}`) .map(({ type, value }) => `${type}:${value}`)
@ -86,6 +88,7 @@ export const ManageTags: VFC<IManageTagsProps> = ({ projectId, data }) => {
} catch (error: unknown) { } catch (error: unknown) {
setToastApiError(formatUnknownError(error)); setToastApiError(formatUnknownError(error));
} }
onChange?.();
setIsOpen(false); setIsOpen(false);
}; };

13
frontend/src/component/project/Project/ProjectFeatureToggles/ProjectFeaturesBatchActions/MoreActions.tsx
View File

@ -15,7 +15,6 @@ import { MoreVert, WatchLater } from '@mui/icons-material';
import type { FeatureSchema } from 'openapi'; import type { FeatureSchema } from 'openapi';
import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender'; import { ConditionallyRender } from 'component/common/ConditionallyRender/ConditionallyRender';
import useProjectApi from 'hooks/api/actions/useProjectApi/useProjectApi'; import useProjectApi from 'hooks/api/actions/useProjectApi/useProjectApi';
import useProject from 'hooks/api/getters/useProject/useProject';
import useToast from 'hooks/useToast'; import useToast from 'hooks/useToast';
import { formatUnknownError } from 'utils/formatUnknownError'; import { formatUnknownError } from 'utils/formatUnknownError';
import { usePlausibleTracker } from 'hooks/usePlausibleTracker'; import { usePlausibleTracker } from 'hooks/usePlausibleTracker';
@ -24,12 +23,16 @@ import { MORE_BATCH_ACTIONS } from 'utils/testIds';
interface IMoreActionsProps { interface IMoreActionsProps {
projectId: string; projectId: string;
data: FeatureSchema[]; data: FeatureSchema[];
onChange?: () => void;
} }
const menuId = 'selection-actions-menu'; const menuId = 'selection-actions-menu';
export const MoreActions: VFC<IMoreActionsProps> = ({ projectId, data }) => { export const MoreActions: VFC<IMoreActionsProps> = ({
const { refetch } = useProject(projectId); projectId,
data,
onChange,
}) => {
const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null); const [anchorEl, setAnchorEl] = useState<null | HTMLElement>(null);
const { staleFeatures } = useProjectApi(); const { staleFeatures } = useProjectApi();
const { setToastData, setToastApiError } = useToast(); const { setToastData, setToastApiError } = useToast();
@ -52,7 +55,7 @@ export const MoreActions: VFC<IMoreActionsProps> = ({ projectId, data }) => {
try { try {
handleClose(); handleClose();
await staleFeatures(projectId, selectedIds); await staleFeatures(projectId, selectedIds);
await refetch(); onChange?.();
setToastData({ setToastData({
title: 'State updated', title: 'State updated',
text: 'Feature toggles marked as stale', text: 'Feature toggles marked as stale',
@ -72,7 +75,7 @@ export const MoreActions: VFC<IMoreActionsProps> = ({ projectId, data }) => {
try { try {
handleClose(); handleClose();
await staleFeatures(projectId, selectedIds, false); await staleFeatures(projectId, selectedIds, false);
await refetch(); onChange?.();
setToastData({ setToastData({
title: 'State updated', title: 'State updated',
text: 'Feature toggles unmarked as stale', text: 'Feature toggles unmarked as stale',

37
frontend/src/component/project/Project/ProjectFeatureToggles/ProjectFeaturesBatchActions/ProjectFeaturesBatchActions.tsx
View File

@ -16,11 +16,12 @@ interface IProjectFeaturesBatchActionsProps {
data: FeatureSchema[]; data: FeatureSchema[];
projectId: string; projectId: string;
onResetSelection: () => void; onResetSelection: () => void;
onChange?: () => void;
} }
export const ProjectFeaturesBatchActions: FC< export const ProjectFeaturesBatchActions: FC<
IProjectFeaturesBatchActionsProps IProjectFeaturesBatchActionsProps
> = ({ selectedIds, data, projectId, onResetSelection }) => { > = ({ selectedIds, data, projectId, onResetSelection, onChange }) => {
const { uiConfig } = useUiConfig(); const { uiConfig } = useUiConfig();
const [showExportDialog, setShowExportDialog] = useState(false); const [showExportDialog, setShowExportDialog] = useState(false);
const [showBulkEnableDialog, setShowBulkEnableDialog] = useState(false); const [showBulkEnableDialog, setShowBulkEnableDialog] = useState(false);
@ -39,21 +40,24 @@ export const ProjectFeaturesBatchActions: FC<
return Array.from(new Set(envs)); return Array.from(new Set(envs));
}, [selectedData]); }, [selectedData]);
const trackExport = () => { const confirmExport = () => {
onChange?.();
trackEvent('batch_operations', { trackEvent('batch_operations', {
props: { props: {
eventType: 'features exported', eventType: 'features exported',
}, },
}); });
}; };
const trackBulkEnabled = () => { const confirmBulkEnabled = () => {
onChange?.();
trackEvent('batch_operations', { trackEvent('batch_operations', {
props: { props: {
eventType: 'features enabled', eventType: 'features enabled',
}, },
}); });
}; };
const trackBulkDisabled = () => { const confirmBulkDisabled = () => {
onChange?.();
trackEvent('batch_operations', { trackEvent('batch_operations', {
props: { props: {
eventType: 'features disabled', eventType: 'features disabled',
@ -61,6 +65,11 @@ export const ProjectFeaturesBatchActions: FC<
}); });
}; };
const confirmArchive = () => {
onChange?.();
onResetSelection();
};
return ( return (
<> <>
<ConditionallyRender <ConditionallyRender
@ -93,7 +102,7 @@ export const ProjectFeaturesBatchActions: FC<
projectId={projectId} projectId={projectId}
featureIds={selectedIds} featureIds={selectedIds}
features={data} features={data}
onConfirm={onResetSelection} onConfirm={confirmArchive}
/> />
<Button <Button
variant='outlined' variant='outlined'
@ -102,14 +111,22 @@ export const ProjectFeaturesBatchActions: FC<
> >
Export Export
</Button> </Button>
<ManageTags projectId={projectId} data={selectedData} /> <ManageTags
<MoreActions projectId={projectId} data={selectedData} /> projectId={projectId}
data={selectedData}
onChange={onChange}
/>
<MoreActions
projectId={projectId}
data={selectedData}
onChange={onChange}
/>
<ExportDialog <ExportDialog
showExportDialog={showExportDialog} showExportDialog={showExportDialog}
data={selectedData} data={selectedData}
onClose={() => setShowExportDialog(false)} onClose={() => setShowExportDialog(false)}
environments={environments} environments={environments}
onConfirm={trackExport} onConfirm={confirmExport}
/> />
<BulkEnableDialog <BulkEnableDialog
showExportDialog={showBulkEnableDialog} showExportDialog={showBulkEnableDialog}
@ -117,7 +134,7 @@ export const ProjectFeaturesBatchActions: FC<
onClose={() => setShowBulkEnableDialog(false)} onClose={() => setShowBulkEnableDialog(false)}
environments={environments} environments={environments}
projectId={projectId} projectId={projectId}
onConfirm={trackBulkEnabled} onConfirm={confirmBulkEnabled}
/> />
<BulkDisableDialog <BulkDisableDialog
showExportDialog={showBulkDisableDialog} showExportDialog={showBulkDisableDialog}
@ -125,7 +142,7 @@ export const ProjectFeaturesBatchActions: FC<
onClose={() => setShowBulkDisableDialog(false)} onClose={() => setShowBulkDisableDialog(false)}
environments={environments} environments={environments}
projectId={projectId} projectId={projectId}
onConfirm={trackBulkDisabled} onConfirm={confirmBulkDisabled}
/> />
</> </>
); );