From fe23c76250b586b9ccb8ac96807834d413a40491 Mon Sep 17 00:00:00 2001 From: Polina Boneva <13227501+polibb@users.noreply.github.com> Date: Tue, 25 Apr 2023 17:18:58 +0300 Subject: [PATCH] Dashboard: New panel in a dashboard is not deleted after "Discard"-ing changes in Panel Edit (#66476) * add isNew notPersistedProperty to PanelModel * if panel is newly created and user "Discard"s it, the panel is removed entirely * add Todo's for when we remove the emptyDashboardPage FF * add isNew to new panel after file dropping on dashboard page * handle the "Apply" case * CSV file dropping is not relevant to a new panel bc it doesnt open edit page --- .../components/AddPanelWidget/AddPanelWidget.tsx | 1 + .../components/PanelEditor/state/actions.ts | 12 +++++++++++- .../features/dashboard/containers/DashboardPage.tsx | 1 + .../features/dashboard/dashgrid/DashboardGrid.tsx | 1 + .../app/features/dashboard/state/DashboardModel.ts | 1 + public/app/features/dashboard/state/PanelModel.ts | 2 ++ public/app/features/dashboard/utils/dashboard.ts | 1 + 7 files changed, 18 insertions(+), 1 deletion(-) diff --git a/public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.tsx b/public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.tsx index becd09aa7d7..06803d80127 100644 --- a/public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.tsx +++ b/public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.tsx @@ -77,6 +77,7 @@ export const AddPanelWidgetUnconnected = ({ panel, dashboard }: Props) => { title: 'Panel Title', datasource: panel.datasource, gridPos: { x: gridPos.x, y: gridPos.y, w: gridPos.w, h: gridPos.h }, + isNew: true, }; dashboard.addPanel(newPanel); diff --git a/public/app/features/dashboard/components/PanelEditor/state/actions.ts b/public/app/features/dashboard/components/PanelEditor/state/actions.ts index 2a2bbff694c..e01fda2c028 100644 --- a/public/app/features/dashboard/components/PanelEditor/state/actions.ts +++ b/public/app/features/dashboard/components/PanelEditor/state/actions.ts @@ -1,6 +1,7 @@ import { pick } from 'lodash'; import store from 'app/core/store'; +import { removePanel } from 'app/features/dashboard/utils/panel'; import { cleanUpPanelState } from 'app/features/panel/state/actions'; import { panelModelAndPluginReady } from 'app/features/panel/state/reducers'; import { ThunkResult } from 'app/types'; @@ -113,9 +114,9 @@ export function exitPanelEditor(): ThunkResult { dashboard.exitPanelEditor(); } + const sourcePanel = getSourcePanel(); if (hasPanelChangedInPanelEdit(panel) && !shouldDiscardChanges) { const modifiedSaveModel = panel.getSaveModel(); - const sourcePanel = getSourcePanel(); const panelTypeChanged = sourcePanel.type !== panel.type; dispatch(updateDuplicateLibraryPanels(panel, dashboard)); @@ -144,6 +145,15 @@ export function exitPanelEditor(): ThunkResult { }, 20); } + // A new panel is only new until the first time we exit the panel editor + if (sourcePanel.isNew) { + if (!shouldDiscardChanges) { + delete sourcePanel.isNew; + } else { + dashboard && removePanel(dashboard, sourcePanel, true); + } + } + dispatch(cleanUpPanelState(panel.key)); dispatch(closeEditor()); }; diff --git a/public/app/features/dashboard/containers/DashboardPage.tsx b/public/app/features/dashboard/containers/DashboardPage.tsx index febdac4d4b6..d05e2bcac58 100644 --- a/public/app/features/dashboard/containers/DashboardPage.tsx +++ b/public/app/features/dashboard/containers/DashboardPage.tsx @@ -351,6 +351,7 @@ export class UnthemedDashboardPage extends PureComponent { return updateStatePageNavFromProps(props, updatedState); } + // Todo: Remove this when we remove the emptyDashboardPage toggle onAddPanel = () => { const { dashboard } = this.props; diff --git a/public/app/features/dashboard/dashgrid/DashboardGrid.tsx b/public/app/features/dashboard/dashgrid/DashboardGrid.tsx index f1c7ced4404..efdfc481df9 100644 --- a/public/app/features/dashboard/dashgrid/DashboardGrid.tsx +++ b/public/app/features/dashboard/dashgrid/DashboardGrid.tsx @@ -185,6 +185,7 @@ export class DashboardGrid extends PureComponent { return ; } + // Todo: Remove this when we remove the emptyDashboardPage toggle if (panel.type === 'add-panel') { return ; } diff --git a/public/app/features/dashboard/state/DashboardModel.ts b/public/app/features/dashboard/state/DashboardModel.ts index 16067227c18..588b42dfb6b 100644 --- a/public/app/features/dashboard/state/DashboardModel.ts +++ b/public/app/features/dashboard/state/DashboardModel.ts @@ -293,6 +293,7 @@ export class DashboardModel implements TimeModel { } private getPanelSaveModels() { + // Todo: Remove panel.type === 'add-panel' when we remove the emptyDashboardPage toggle return this.panels .filter( (panel) => diff --git a/public/app/features/dashboard/state/PanelModel.ts b/public/app/features/dashboard/state/PanelModel.ts index a38cafe238d..dff99dbd546 100644 --- a/public/app/features/dashboard/state/PanelModel.ts +++ b/public/app/features/dashboard/state/PanelModel.ts @@ -66,6 +66,7 @@ const notPersistedProperties: { [str: string]: boolean } = { getDisplayTitle: true, dataSupport: true, key: true, + isNew: true, }; // For angular panels we need to clean up properties when changing type @@ -189,6 +190,7 @@ export class PanelModel implements DataConfigSource, IPanelModel { hasRefreshed?: boolean; cacheTimeout?: string | null; queryCachingTTL?: number | null; + isNew?: boolean; cachedPluginOptions: Record = {}; legend?: { show: boolean; sort?: string; sortDesc?: boolean }; diff --git a/public/app/features/dashboard/utils/dashboard.ts b/public/app/features/dashboard/utils/dashboard.ts index 13fe36eecaa..3b31aec7c09 100644 --- a/public/app/features/dashboard/utils/dashboard.ts +++ b/public/app/features/dashboard/utils/dashboard.ts @@ -12,6 +12,7 @@ export function onCreateNewPanel(dashboard: DashboardModel): number | undefined type: 'timeseries', title: 'Panel Title', gridPos: calculateNewPanelGridPos(dashboard), + isNew: true, }; dashboard.addPanel(newPanel);