mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Alerting: Add confirmation modals for deleting notifier (#25303)
* Add confirm modals for deleting notifier * Update public/app/features/alerting/NotificationsListPage.tsx Co-authored-by: Marcus Andersson <marcus.andersson@grafana.com>
This commit is contained in:
parent
17d3bb4287
commit
d040daa1cd
@ -5,6 +5,7 @@ import { AppEvents } from '@grafana/data';
|
||||
import { IScope } from 'angular';
|
||||
import { promiseToDigest } from '../../core/utils/promiseToDigest';
|
||||
import config from 'app/core/config';
|
||||
import { CoreEvents } from 'app/types';
|
||||
|
||||
export class AlertNotificationEditCtrl {
|
||||
theForm: any;
|
||||
@ -118,6 +119,20 @@ export class AlertNotificationEditCtrl {
|
||||
}
|
||||
|
||||
deleteNotification() {
|
||||
appEvents.emit(CoreEvents.showConfirmModal, {
|
||||
title: 'Delete',
|
||||
text: 'Do you want to delete this notification channel?',
|
||||
text2: `Deleting this notification channel will not delete from alerts any references to it`,
|
||||
icon: 'trash-alt',
|
||||
confirmText: 'Delete',
|
||||
yesText: 'Delete',
|
||||
onConfirm: () => {
|
||||
this.deleteNotificationConfirmed();
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
deleteNotificationConfirmed() {
|
||||
promiseToDigest(this.$scope)(
|
||||
getBackendSrv()
|
||||
.delete(`/api/alert-notifications/${this.model.id}`)
|
||||
|
@ -3,22 +3,21 @@ import EmptyListCTA from 'app/core/components/EmptyListCTA/EmptyListCTA';
|
||||
import Page from 'app/core/components/Page/Page';
|
||||
import { getBackendSrv } from '@grafana/runtime';
|
||||
import { useAsyncFn } from 'react-use';
|
||||
import { appEvents } from 'app/core/core';
|
||||
import { useNavModel } from 'app/core/hooks/useNavModel';
|
||||
import { HorizontalGroup, Button, LinkButton } from '@grafana/ui';
|
||||
import { CoreEvents } from 'app/types';
|
||||
import { AlertNotification } from 'app/types/alerting';
|
||||
|
||||
const deleteNotification = async (id: number) => {
|
||||
return await getBackendSrv().delete(`/api/alert-notifications/${id}`);
|
||||
};
|
||||
|
||||
const getNotifications = async () => {
|
||||
return await getBackendSrv().get(`/api/alert-notifications`);
|
||||
};
|
||||
|
||||
const NotificationsListPage: FC = () => {
|
||||
const navModel = useNavModel('channels');
|
||||
|
||||
const [notifications, setNotifications] = useState<AlertNotification[]>([]);
|
||||
|
||||
const getNotifications = async () => {
|
||||
return await getBackendSrv().get(`/api/alert-notifications`);
|
||||
};
|
||||
|
||||
const [state, fetchNotifications] = useAsyncFn(getNotifications);
|
||||
useEffect(() => {
|
||||
fetchNotifications().then(res => {
|
||||
@ -26,6 +25,26 @@ const NotificationsListPage: FC = () => {
|
||||
});
|
||||
}, []);
|
||||
|
||||
const deleteNotification = (id: number) => {
|
||||
appEvents.emit(CoreEvents.showConfirmModal, {
|
||||
title: 'Delete',
|
||||
text: 'Do you want to delete this notification channel?',
|
||||
text2: `Deleting this notification channel will not delete from alerts any references to it`,
|
||||
icon: 'trash-alt',
|
||||
confirmText: 'Delete',
|
||||
yesText: 'Delete',
|
||||
onConfirm: async () => {
|
||||
deleteNotificationConfirmed(id);
|
||||
},
|
||||
});
|
||||
};
|
||||
|
||||
const deleteNotificationConfirmed = async (id: number) => {
|
||||
await getBackendSrv().delete(`/api/alert-notifications/${id}`);
|
||||
const notifications = await fetchNotifications();
|
||||
setNotifications(notifications);
|
||||
};
|
||||
|
||||
return (
|
||||
<Page navModel={navModel}>
|
||||
<Page.Contents>
|
||||
@ -70,8 +89,6 @@ const NotificationsListPage: FC = () => {
|
||||
size="sm"
|
||||
onClick={() => {
|
||||
deleteNotification(notification.id);
|
||||
setNotifications(notifications.filter(notify => notify.id !== notification.id));
|
||||
fetchNotifications();
|
||||
}}
|
||||
/>
|
||||
</HorizontalGroup>
|
||||
|
Loading…
Reference in New Issue
Block a user