Dashboard: Clean up state after deletion (#50316)

* Dashboard: Clean up after deletion

* cleanup

* rename cleanUp function
This commit is contained in:
Agnès Toulet 2022-06-10 17:08:09 +02:00 committed by GitHub
parent 32d4f6ac60
commit a832b92988
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 18 additions and 6 deletions

View File

@ -1,12 +1,13 @@
import { css } from '@emotion/css';
import { sumBy } from 'lodash';
import React from 'react';
import { connect, ConnectedProps } from 'react-redux';
import useAsyncFn from 'react-use/lib/useAsyncFn';
import { Modal, ConfirmModal, Button } from '@grafana/ui';
import { config } from 'app/core/config';
import { DashboardModel, PanelModel } from '../../state';
import { DashboardModel, PanelModel } from 'app/features/dashboard/state';
import { cleanUpDashboardAndVariables } from 'app/features/dashboard/state/actions';
import { useDashboardDelete } from './useDashboardDelete';
@ -15,9 +16,17 @@ type DeleteDashboardModalProps = {
dashboard: DashboardModel;
};
export const DeleteDashboardModal: React.FC<DeleteDashboardModalProps> = ({ hideModal, dashboard }) => {
const mapDispatchToProps = {
cleanUpDashboardAndVariables,
};
const connector = connect(null, mapDispatchToProps);
type Props = DeleteDashboardModalProps & ConnectedProps<typeof connector>;
const DeleteDashboardModalUnconnected: React.FC<Props> = ({ hideModal, cleanUpDashboardAndVariables, dashboard }) => {
const isProvisioned = dashboard.meta.provisioned;
const { onDeleteDashboard } = useDashboardDelete(dashboard.uid);
const { onDeleteDashboard } = useDashboardDelete(dashboard.uid, cleanUpDashboardAndVariables);
const [, onConfirm] = useAsyncFn(async () => {
await onDeleteDashboard();
@ -98,3 +107,5 @@ const ProvisionedDeleteModal = ({ hideModal, provisionedId }: { hideModal(): voi
</Modal.ButtonRow>
</Modal>
);
export const DeleteDashboardModal = connector(DeleteDashboardModalUnconnected);

View File

@ -5,16 +5,17 @@ import { locationService } from '@grafana/runtime';
import { useAppNotification } from 'app/core/copy/appNotification';
import { deleteDashboard } from 'app/features/manage-dashboards/state/actions';
export const useDashboardDelete = (uid: string) => {
export const useDashboardDelete = (uid: string, cleanUpDashboardAndVariables: () => void) => {
const [state, onDeleteDashboard] = useAsyncFn(() => deleteDashboard(uid, false), []);
const notifyApp = useAppNotification();
useEffect(() => {
if (state.value) {
cleanUpDashboardAndVariables();
locationService.replace('/');
notifyApp.success('Dashboard Deleted', `${state.value.title} has been deleted`);
}
}, [state, notifyApp]);
}, [state, notifyApp, cleanUpDashboardAndVariables]);
return { state, onDeleteDashboard };
};