diff --git a/public/app/features/library-panels/utils.ts b/public/app/features/library-panels/utils.ts index 360f809c494..533f488ff04 100644 --- a/public/app/features/library-panels/utils.ts +++ b/public/app/features/library-panels/utils.ts @@ -1,18 +1,8 @@ -import { createErrorNotification, createSuccessNotification } from '../../core/copy/appNotification'; -import { AppNotification } from '../../types'; import { PanelModel } from '../dashboard/state'; import { addLibraryPanel, updateLibraryPanel } from './state/api'; import { LibraryElementDTO } from './types'; -export function createPanelLibraryErrorNotification(message: string): AppNotification { - return createErrorNotification(message); -} - -export function createPanelLibrarySuccessNotification(message: string): AppNotification { - return createSuccessNotification(message); -} - export async function saveAndRefreshLibraryPanel(panel: PanelModel, folderUid: string): Promise { const panelSaveModel = toPanelSaveModel(panel); const savedPanel = await saveOrUpdateLibraryPanel(panelSaveModel, folderUid); diff --git a/public/app/features/library-panels/utils/usePanelSave.ts b/public/app/features/library-panels/utils/usePanelSave.ts index 5527d2d89c0..85ac7ba1bfd 100644 --- a/public/app/features/library-panels/utils/usePanelSave.ts +++ b/public/app/features/library-panels/utils/usePanelSave.ts @@ -1,50 +1,31 @@ -import { useEffect } from 'react'; import useAsyncFn from 'react-use/lib/useAsyncFn'; import { isFetchError } from '@grafana/runtime'; -import { notifyApp } from 'app/core/actions'; +import { useAppNotification } from 'app/core/copy/appNotification'; import { t } from 'app/core/internationalization'; import { PanelModel } from 'app/features/dashboard/state'; -import { useDispatch } from 'app/types'; -import { - createPanelLibraryErrorNotification, - createPanelLibrarySuccessNotification, - saveAndRefreshLibraryPanel, -} from '../utils'; +import { saveAndRefreshLibraryPanel } from '../utils'; export const usePanelSave = () => { - const dispatch = useDispatch(); + const notifyApp = useAppNotification(); const [state, saveLibraryPanel] = useAsyncFn(async (panel: PanelModel, folderUid: string) => { try { - return await saveAndRefreshLibraryPanel(panel, folderUid); + const libEl = await saveAndRefreshLibraryPanel(panel, folderUid); + notifyApp.success(t('library-panels.save.success', 'Library panel saved')); + return libEl; } catch (err) { if (isFetchError(err)) { err.isHandled = true; - throw new Error(err.data.message); + notifyApp.error( + t('library-panels.save.error', 'Error saving library panel: "{{errorMsg}}"', { + errorMsg: err.message ?? err.data.message, + }) + ); } throw err; } }, []); - useEffect(() => { - if (state.error) { - const errorMsg = state.error.message; - - dispatch( - notifyApp( - createPanelLibraryErrorNotification( - t('library-panels.save.error', 'Error saving library panel: "{{errorMsg}}"', { errorMsg }) - ) - ) - ); - } - if (state.value) { - dispatch( - notifyApp(createPanelLibrarySuccessNotification(t('library-panels.save.success', 'Library panel saved'))) - ); - } - }, [dispatch, state]); - return { state, saveLibraryPanel }; };