From 9ba13dd3092a3a9ff26b208181cbbc98beec0a60 Mon Sep 17 00:00:00 2001 From: Sergej-Vlasov <37613182+Sergej-Vlasov@users.noreply.github.com> Date: Thu, 25 Jan 2024 14:04:29 +0000 Subject: [PATCH] Dashboards: Remove emptyDashboardPage feature flag (#81188) * remove emptyDashboardPage feature toggle from DashNav * remove emptyDashboardPage feature toggle from NewDashboardWithDS * remove emptyDashboardPage feature toggle from DashboardGrid * remove emptyDashboardPage feature toggle from DashboardModel * remove emptyDashboardPage feature toggle from initDashboard * remove unused AddPanelWidged component * remove add-panel type from test * remove emptyDashboardPage feature flag from registry.go --- .betterer.results | 16 - .../feature-toggles/index.md | 1 - .../src/types/featureToggles.gen.ts | 1 - pkg/services/featuremgmt/registry.go | 11 - pkg/services/featuremgmt/toggles_gen.csv | 1 - pkg/services/featuremgmt/toggles_gen.go | 4 - .../AddPanelWidget/AddPanelWidget.test.tsx | 32 -- .../AddPanelWidget/AddPanelWidget.tsx | 299 ------------------ .../AddPanelWidget/_AddPanelWidget.scss | 78 ----- .../components/AddPanelWidget/index.ts | 1 - .../dashboard/components/DashNav/DashNav.tsx | 29 +- .../dashboard/containers/DashboardPage.tsx | 25 -- .../containers/NewDashboardWithDS.tsx | 19 +- .../dashboard/dashgrid/DashboardGrid.tsx | 8 +- .../dashboard/state/DashboardModel.test.ts | 8 +- .../dashboard/state/DashboardModel.ts | 6 +- .../dashboard/state/initDashboard.test.ts | 2 +- .../features/dashboard/state/initDashboard.ts | 19 +- .../AddToDashboard/addToDashboard.ts | 11 +- public/sass/_grafana.scss | 1 - 20 files changed, 18 insertions(+), 554 deletions(-) delete mode 100644 public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.test.tsx delete mode 100644 public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.tsx delete mode 100644 public/app/features/dashboard/components/AddPanelWidget/_AddPanelWidget.scss delete mode 100644 public/app/features/dashboard/components/AddPanelWidget/index.ts diff --git a/.betterer.results b/.betterer.results index a674fef10e2..825dae54803 100644 --- a/.betterer.results +++ b/.betterer.results @@ -2434,22 +2434,6 @@ exports[`better eslint`] = { [0, 0, 0, "Do not use any type assertions.", "1"], [0, 0, 0, "Do not use any type assertions.", "2"] ], - "public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.test.tsx:5381": [ - [0, 0, 0, "Unexpected any. Specify a different type.", "0"] - ], - "public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.tsx:5381": [ - [0, 0, 0, "Unexpected any. Specify a different type.", "0"], - [0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "1"], - [0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "2"], - [0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "3"], - [0, 0, 0, "Use data-testid for E2E selectors instead of aria-label", "4"], - [0, 0, 0, "Styles should be written using objects.", "5"], - [0, 0, 0, "Styles should be written using objects.", "6"], - [0, 0, 0, "Styles should be written using objects.", "7"], - [0, 0, 0, "Styles should be written using objects.", "8"], - [0, 0, 0, "Styles should be written using objects.", "9"], - [0, 0, 0, "Styles should be written using objects.", "10"] - ], "public/app/features/dashboard/components/AddWidgetModal/AddWidgetModal.tsx:5381": [ [0, 0, 0, "Styles should be written using objects.", "0"], [0, 0, 0, "Styles should be written using objects.", "1"], diff --git a/docs/sources/setup-grafana/configure-grafana/feature-toggles/index.md b/docs/sources/setup-grafana/configure-grafana/feature-toggles/index.md index e12e5734e8e..795c3d835be 100644 --- a/docs/sources/setup-grafana/configure-grafana/feature-toggles/index.md +++ b/docs/sources/setup-grafana/configure-grafana/feature-toggles/index.md @@ -32,7 +32,6 @@ Some features are enabled by default. You can disable these feature by setting t | `athenaAsyncQueryDataSupport` | Enable async query data support for Athena | Yes | | `cloudwatchNewRegionsHandler` | Refactor of /regions endpoint, no user-facing changes | Yes | | `nestedFolderPicker` | Enables the new folder picker to work with nested folders. Requires the nestedFolders feature toggle | Yes | -| `emptyDashboardPage` | Enable the redesigned user interface of a dashboard page that includes no panels | Yes | | `disablePrometheusExemplarSampling` | Disable Prometheus exemplar sampling | | | `logsContextDatasourceUi` | Allow datasource to provide custom UI for context view | Yes | | `lokiQuerySplitting` | Split large interval queries into subqueries with smaller time intervals | Yes | diff --git a/packages/grafana-data/src/types/featureToggles.gen.ts b/packages/grafana-data/src/types/featureToggles.gen.ts index 5a916c02e11..a269d5b6718 100644 --- a/packages/grafana-data/src/types/featureToggles.gen.ts +++ b/packages/grafana-data/src/types/featureToggles.gen.ts @@ -54,7 +54,6 @@ export interface FeatureToggles { accessControlOnCall?: boolean; nestedFolders?: boolean; nestedFolderPicker?: boolean; - emptyDashboardPage?: boolean; disablePrometheusExemplarSampling?: boolean; alertingBacktesting?: boolean; editPanelCSVDragAndDrop?: boolean; diff --git a/pkg/services/featuremgmt/registry.go b/pkg/services/featuremgmt/registry.go index 442fc1cddb1..5221d50ca86 100644 --- a/pkg/services/featuremgmt/registry.go +++ b/pkg/services/featuremgmt/registry.go @@ -313,17 +313,6 @@ var ( AllowSelfServe: true, Created: time.Date(2023, time.July, 24, 12, 0, 0, 0, time.UTC), }, - { - Name: "emptyDashboardPage", - Description: "Enable the redesigned user interface of a dashboard page that includes no panels", - Stage: FeatureStageGeneralAvailability, - FrontendOnly: true, - Expression: "true", // enabled by default - Owner: grafanaDashboardsSquad, - AllowSelfServe: false, - HideFromAdminPage: true, - Created: time.Date(2023, time.March, 28, 12, 0, 0, 0, time.UTC), - }, { Name: "disablePrometheusExemplarSampling", Description: "Disable Prometheus exemplar sampling", diff --git a/pkg/services/featuremgmt/toggles_gen.csv b/pkg/services/featuremgmt/toggles_gen.csv index 9cccd0855c9..e531d86e62b 100644 --- a/pkg/services/featuremgmt/toggles_gen.csv +++ b/pkg/services/featuremgmt/toggles_gen.csv @@ -35,7 +35,6 @@ mysqlAnsiQuotes,experimental,@grafana/backend-platform,2022-10-12,false,false,fa accessControlOnCall,preview,@grafana/identity-access-team,2022-10-19,false,false,false,false nestedFolders,preview,@grafana/backend-platform,2022-10-22,false,false,false,false nestedFolderPicker,GA,@grafana/grafana-frontend-platform,2023-07-24,false,false,false,true -emptyDashboardPage,GA,@grafana/dashboards-squad,2023-03-28,false,false,false,true disablePrometheusExemplarSampling,GA,@grafana/observability-metrics,2022-12-19,false,false,false,false alertingBacktesting,experimental,@grafana/alerting-squad,2022-10-20,false,false,false,false editPanelCSVDragAndDrop,experimental,@grafana/grafana-bi-squad,2022-12-20,false,false,false,true diff --git a/pkg/services/featuremgmt/toggles_gen.go b/pkg/services/featuremgmt/toggles_gen.go index 5d700972f8a..a9fe7957842 100644 --- a/pkg/services/featuremgmt/toggles_gen.go +++ b/pkg/services/featuremgmt/toggles_gen.go @@ -151,10 +151,6 @@ const ( // Enables the new folder picker to work with nested folders. Requires the nestedFolders feature toggle FlagNestedFolderPicker = "nestedFolderPicker" - // FlagEmptyDashboardPage - // Enable the redesigned user interface of a dashboard page that includes no panels - FlagEmptyDashboardPage = "emptyDashboardPage" - // FlagDisablePrometheusExemplarSampling // Disable Prometheus exemplar sampling FlagDisablePrometheusExemplarSampling = "disablePrometheusExemplarSampling" diff --git a/public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.test.tsx b/public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.test.tsx deleted file mode 100644 index d0f0690cd4a..00000000000 --- a/public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.test.tsx +++ /dev/null @@ -1,32 +0,0 @@ -import { render, screen } from '@testing-library/react'; -import React from 'react'; - -import { PanelModel } from '../../state'; -import { createDashboardModelFixture } from '../../state/__fixtures__/dashboardFixtures'; - -import { AddPanelWidgetUnconnected as AddPanelWidget, Props } from './AddPanelWidget'; - -const getTestContext = (propOverrides?: object) => { - const props: Props = { - dashboard: createDashboardModelFixture(), - panel: new PanelModel({}), - addPanel: jest.fn() as any, - }; - Object.assign(props, propOverrides); - return render(); -}; - -describe('AddPanelWidget', () => { - it('should render component without error', () => { - expect(() => { - getTestContext(); - }); - }); - - it('should render the add panel actions', () => { - getTestContext(); - expect(screen.getByText(/Add a new panel/i)).toBeInTheDocument(); - expect(screen.getByText(/Add a new row/i)).toBeInTheDocument(); - expect(screen.getByText(/Add a panel from the panel library/i)).toBeInTheDocument(); - }); -}); diff --git a/public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.tsx b/public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.tsx deleted file mode 100644 index a1020e1a613..00000000000 --- a/public/app/features/dashboard/components/AddPanelWidget/AddPanelWidget.tsx +++ /dev/null @@ -1,299 +0,0 @@ -import { css, cx, keyframes } from '@emotion/css'; -import { chain, cloneDeep, defaults, find, sortBy } from 'lodash'; -import React, { useMemo, useState } from 'react'; -import { connect, MapDispatchToProps } from 'react-redux'; -import tinycolor from 'tinycolor2'; - -import { GrafanaTheme2 } from '@grafana/data'; -import { selectors } from '@grafana/e2e-selectors'; -import { locationService, reportInteraction } from '@grafana/runtime'; -import { Icon, IconButton, useStyles2 } from '@grafana/ui'; -import { CardButton } from 'app/core/components/CardButton'; -import config from 'app/core/config'; -import { LS_PANEL_COPY_KEY } from 'app/core/constants'; -import store from 'app/core/store'; -import { addPanel } from 'app/features/dashboard/state/reducers'; - -import { - LibraryPanelsSearch, - LibraryPanelsSearchVariant, -} from '../../../library-panels/components/LibraryPanelsSearch/LibraryPanelsSearch'; -import { LibraryElementDTO } from '../../../library-panels/types'; -import { DashboardModel, PanelModel } from '../../state'; - -export type PanelPluginInfo = { id: number; defaults: { gridPos: { w: number; h: number }; title: string } }; - -export interface OwnProps { - panel: PanelModel; - dashboard: DashboardModel; -} - -export interface DispatchProps { - addPanel: typeof addPanel; -} - -export type Props = OwnProps & DispatchProps; - -const getCopiedPanelPlugins = () => { - const panels = chain(config.panels) - .filter({ hideFromList: false }) - .map((item) => item) - .value(); - const copiedPanels = []; - - const copiedPanelJson = store.get(LS_PANEL_COPY_KEY); - if (copiedPanelJson) { - const copiedPanel = JSON.parse(copiedPanelJson); - const pluginInfo: any = find(panels, { id: copiedPanel.type }); - if (pluginInfo) { - const pluginCopy = cloneDeep(pluginInfo); - pluginCopy.name = copiedPanel.title; - pluginCopy.sort = -1; - pluginCopy.defaults = copiedPanel; - copiedPanels.push(pluginCopy); - } - } - - return sortBy(copiedPanels, 'sort'); -}; - -export const AddPanelWidgetUnconnected = ({ panel, dashboard }: Props) => { - const [addPanelView, setAddPanelView] = useState(false); - - const onCancelAddPanel = (evt: React.MouseEvent) => { - evt.preventDefault(); - dashboard.removePanel(panel); - }; - - const onBack = () => { - setAddPanelView(false); - }; - - const onCreateNewPanel = () => { - const { gridPos } = panel; - - const newPanel: Partial = { - type: 'timeseries', - title: 'Panel Title', - datasource: panel.datasource, - gridPos: { x: gridPos.x, y: gridPos.y, w: gridPos.w, h: gridPos.h }, - isNew: true, - }; - - dashboard.addPanel(newPanel); - dashboard.removePanel(panel); - - locationService.partial({ editPanel: newPanel.id }); - }; - - const onPasteCopiedPanel = (panelPluginInfo: PanelPluginInfo) => { - const { gridPos } = panel; - - const newPanel = { - type: panelPluginInfo.id, - title: 'Panel Title', - gridPos: { - x: gridPos.x, - y: gridPos.y, - w: panelPluginInfo.defaults.gridPos.w, - h: panelPluginInfo.defaults.gridPos.h, - }, - }; - - // apply panel template / defaults - if (panelPluginInfo.defaults) { - defaults(newPanel, panelPluginInfo.defaults); - newPanel.title = panelPluginInfo.defaults.title; - store.delete(LS_PANEL_COPY_KEY); - } - - dashboard.addPanel(newPanel); - dashboard.removePanel(panel); - }; - - const onAddLibraryPanel = (panelInfo: LibraryElementDTO) => { - const { gridPos } = panel; - - const newPanel = { - ...panelInfo.model, - gridPos, - libraryPanel: panelInfo, - }; - - dashboard.addPanel(newPanel); - dashboard.removePanel(panel); - }; - - const onCreateNewRow = () => { - const newRow = { - type: 'row', - title: 'Row title', - gridPos: { x: 0, y: 0 }, - }; - - dashboard.addPanel(newRow); - dashboard.removePanel(panel); - }; - - const styles = useStyles2(getStyles); - const copiedPanelPlugins = useMemo(() => getCopiedPanelPlugins(), []); - - return ( -
-
- - {addPanelView ? 'Add panel from panel library' : 'Add panel'} - - {addPanelView ? ( - - ) : ( -
- { - reportInteraction('Create new panel'); - onCreateNewPanel(); - }} - > - Add a new panel - - { - reportInteraction('Create new row'); - onCreateNewRow(); - }} - > - Add a new row - - { - reportInteraction('Add a panel from the panel library'); - setAddPanelView(true); - }} - > - Add a panel from the panel library - - {copiedPanelPlugins.length === 1 && ( - { - reportInteraction('Paste panel from clipboard'); - onPasteCopiedPanel(copiedPanelPlugins[0]); - }} - > - Paste panel from clipboard - - )} -
- )} -
-
- ); -}; - -const mapDispatchToProps: MapDispatchToProps = { addPanel }; - -export const AddPanelWidget = connect(undefined, mapDispatchToProps)(AddPanelWidgetUnconnected); - -interface AddPanelWidgetHandleProps { - onCancel: (e: React.MouseEvent) => void; - onBack?: () => void; - children?: string; - styles: AddPanelStyles; -} - -const AddPanelWidgetHandle = ({ children, onBack, onCancel, styles }: AddPanelWidgetHandleProps) => { - return ( -
- {onBack && ( -
- -
- )} - {!onBack && ( -
- -
- )} - {children && {children}} -
- -
- ); -}; - -const getStyles = (theme: GrafanaTheme2) => { - const pulsate = keyframes` - 0% {box-shadow: 0 0 0 2px ${theme.colors.background.canvas}, 0 0 0px 4px ${theme.colors.primary.main};} - 50% {box-shadow: 0 0 0 2px ${theme.components.dashboard.background}, 0 0 0px 4px ${tinycolor( - theme.colors.primary.main - ) - .darken(20) - .toHexString()};} - 100% {box-shadow: 0 0 0 2px ${theme.components.dashboard.background}, 0 0 0px 4px ${theme.colors.primary.main};} - `; - - return { - // wrapper is used to make sure box-shadow animation isn't cut off in dashboard page - wrapper: css` - height: 100%; - padding-top: ${theme.spacing(0.5)}; - `, - callToAction: css` - overflow: hidden; - outline: 2px dotted transparent; - outline-offset: 2px; - box-shadow: - 0 0 0 2px black, - 0 0 0px 4px #1f60c4; - animation: ${pulsate} 2s ease infinite; - `, - actionsWrapper: css` - height: 100%; - display: grid; - grid-template-columns: repeat(2, 1fr); - column-gap: ${theme.spacing(1)}; - row-gap: ${theme.spacing(1)}; - padding: ${theme.spacing(0, 1, 1, 1)}; - - // This is to make the last action full width (if by itself) - & > div:nth-child(2n-1):nth-last-of-type(1) { - grid-column: span 2; - } - `, - headerRow: css` - display: flex; - align-items: center; - height: 38px; - flex-shrink: 0; - width: 100%; - font-size: ${theme.typography.fontSize}; - font-weight: ${theme.typography.fontWeightMedium}; - padding-left: ${theme.spacing(1)}; - transition: background-color 0.1s ease-in-out; - cursor: move; - - &:hover { - background: ${theme.colors.background.secondary}; - } - `, - backButton: css` - display: flex; - align-items: center; - cursor: pointer; - padding-left: ${theme.spacing(0.5)}; - width: ${theme.spacing(4)}; - `, - noMargin: css` - margin: 0; - `, - }; -}; - -type AddPanelStyles = ReturnType; diff --git a/public/app/features/dashboard/components/AddPanelWidget/_AddPanelWidget.scss b/public/app/features/dashboard/components/AddPanelWidget/_AddPanelWidget.scss deleted file mode 100644 index ccb5d7fe667..00000000000 --- a/public/app/features/dashboard/components/AddPanelWidget/_AddPanelWidget.scss +++ /dev/null @@ -1,78 +0,0 @@ -.add-panel-widget-container { - height: 100%; -} - -.add-panel-widget { - height: 100%; -} - -.add-panel-widget__header { - top: 0; - position: absolute; - padding: 0 8px; - display: flex; - align-items: center; - width: 100%; - cursor: move; - background: $page-header-bg; - box-shadow: $page-header-shadow; - border-bottom: 1px solid $page-header-border-color; - - .gicon { - font-size: 30px; - margin-right: $space-md; - } - - &:hover { - transition: background-color 0.1s ease-in-out; - background-color: $panel-header-hover-bg; - } -} - -.add-panel-widget__title { - font-size: $font-size-md; - font-weight: $font-weight-semi-bold; - margin-right: $space-xl; -} - -.add-panel-widget__link { - margin: 0 $space-sm; - width: 170px; - height: 88px !important; - flex-direction: column !important; -} - -.add-panel-widget__icon { - margin-bottom: $space-sm; - - .gicon { - color: white; - height: 44px; - width: 53px; - position: relative; - left: 5px; - } -} - -.add-panel-widget__create { - display: inherit; - margin-bottom: $space-lg; - // this is to have the big button appear centered - margin-top: 55px; -} - -.add-panel-widget__actions { - display: inherit; -} - -.add-panel-widget__action { - margin: 0 $space-xs; -} - -.add-panel-widget__btn-container { - height: 100%; - display: flex; - justify-content: center; - align-items: center; - flex-direction: column; -} diff --git a/public/app/features/dashboard/components/AddPanelWidget/index.ts b/public/app/features/dashboard/components/AddPanelWidget/index.ts deleted file mode 100644 index b96948ab1c0..00000000000 --- a/public/app/features/dashboard/components/AddPanelWidget/index.ts +++ /dev/null @@ -1 +0,0 @@ -export { AddPanelWidget } from './AddPanelWidget'; diff --git a/public/app/features/dashboard/components/DashNav/DashNav.tsx b/public/app/features/dashboard/components/DashNav/DashNav.tsx index c5629a17980..52ced1ac177 100644 --- a/public/app/features/dashboard/components/DashNav/DashNav.tsx +++ b/public/app/features/dashboard/components/DashNav/DashNav.tsx @@ -59,7 +59,6 @@ export interface OwnProps { hideTimePicker: boolean; folderTitle?: string; title: string; - onAddPanel: () => void; } export function addCustomLeftAction(content: DynamicDashNavButtonModel) { @@ -251,7 +250,7 @@ export const DashNav = React.memo((props) => { }; const renderRightActions = () => { - const { dashboard, onAddPanel, isFullscreen, kioskMode, hideTimePicker } = props; + const { dashboard, isFullscreen, kioskMode, hideTimePicker } = props; const { canSave, canEdit, showSettings, canShare } = dashboard.meta; const { snapshot } = dashboard; const snapshotUrl = snapshot && snapshot.originalUrl; @@ -310,25 +309,13 @@ export const DashNav = React.memo((props) => { } if (canEdit && !isFullscreen) { - if (config.featureToggles.emptyDashboardPage) { - buttons.push( - - ); - } else { - buttons.push( - - ); - } + buttons.push( + + ); } if (canShare) { diff --git a/public/app/features/dashboard/containers/DashboardPage.tsx b/public/app/features/dashboard/containers/DashboardPage.tsx index 8770bdec767..cc4b571742f 100644 --- a/public/app/features/dashboard/containers/DashboardPage.tsx +++ b/public/app/features/dashboard/containers/DashboardPage.tsx @@ -37,7 +37,6 @@ import { liveTimer } from '../dashgrid/liveTimer'; import { getTimeSrv } from '../services/TimeSrv'; import { cleanUpDashboardAndVariables } from '../state/actions'; import { initDashboard } from '../state/initDashboard'; -import { calculateNewPanelGridPos } from '../utils/panel'; import { DashboardPageRouteParams, DashboardPageRouteSearchParams } from './types'; @@ -265,29 +264,6 @@ export class UnthemedDashboardPage extends PureComponent { return updateStatePageNavFromProps(props, updatedState); } - // Todo: Remove this when we remove the emptyDashboardPage toggle - onAddPanel = () => { - const { dashboard } = this.props; - - if (!dashboard) { - return; - } - - // Return if the "Add panel" exists already - if (dashboard.panels.length > 0 && dashboard.panels[0].type === 'add-panel') { - return; - } - - dashboard.addPanel({ - type: 'add-panel', - gridPos: calculateNewPanelGridPos(dashboard), - title: 'Panel Title', - }); - - // scroll to top after adding panel - this.setState({ updateScrollTop: 0 }); - }; - setScrollRef = (scrollElement: HTMLDivElement): void => { this.setState({ scrollElement }); }; @@ -355,7 +331,6 @@ export class UnthemedDashboardPage extends PureComponent { title={dashboard.title} folderTitle={dashboard.meta.folderTitle} isFullscreen={!!viewPanel} - onAddPanel={this.onAddPanel} kioskMode={kioskMode} hideTimePicker={dashboard.timepicker.hidden} /> diff --git a/public/app/features/dashboard/containers/NewDashboardWithDS.tsx b/public/app/features/dashboard/containers/NewDashboardWithDS.tsx index 56eddbcea30..b1a7aa041e4 100644 --- a/public/app/features/dashboard/containers/NewDashboardWithDS.tsx +++ b/public/app/features/dashboard/containers/NewDashboardWithDS.tsx @@ -1,11 +1,10 @@ import React, { useEffect, useState } from 'react'; -import { config, getDataSourceSrv, locationService } from '@grafana/runtime'; +import { getDataSourceSrv, locationService } from '@grafana/runtime'; import { Page } from 'app/core/components/Page/Page'; import { GrafanaRouteComponentProps } from 'app/core/navigation/types'; import { useDispatch } from 'app/types'; -import { getNewDashboardModelData, setDashboardToFetchFromLocalStorage } from '../state/initDashboard'; import { setInitialDatasource } from '../state/reducers'; export default function NewDashboardWithDS(props: GrafanaRouteComponentProps<{ datasourceUid: string }>) { @@ -20,21 +19,7 @@ export default function NewDashboardWithDS(props: GrafanaRouteComponentProps<{ d return; } - if (!config.featureToggles.emptyDashboardPage) { - const newDashboard = getNewDashboardModelData(); - const { dashboard } = newDashboard; - dashboard.panels[0] = { - ...dashboard.panels[0], - datasource: { - uid: ds.uid, - type: ds.type, - }, - }; - - setDashboardToFetchFromLocalStorage(newDashboard); - } else { - dispatch(setInitialDatasource(datasourceUid)); - } + dispatch(setInitialDatasource(datasourceUid)); locationService.replace('/dashboard/new'); }, [datasourceUid, dispatch]); diff --git a/public/app/features/dashboard/dashgrid/DashboardGrid.tsx b/public/app/features/dashboard/dashgrid/DashboardGrid.tsx index 8fba7295ca9..02969867235 100644 --- a/public/app/features/dashboard/dashgrid/DashboardGrid.tsx +++ b/public/app/features/dashboard/dashgrid/DashboardGrid.tsx @@ -14,7 +14,6 @@ import { VariablesChanged } from 'app/features/variables/types'; import { DashboardPanelsChangedEvent } from 'app/types/events'; import { AddLibraryPanelWidget } from '../components/AddLibraryPanelWidget'; -import { AddPanelWidget } from '../components/AddPanelWidget'; import { DashboardRow } from '../components/DashboardRow'; import { DashboardModel, PanelModel } from '../state'; import { GridPos } from '../state/PanelModel'; @@ -262,11 +261,6 @@ export class DashboardGrid extends PureComponent { return ; } - // Todo: Remove this when we remove the emptyDashboardPage toggle - if (panel.type === 'add-panel') { - return ; - } - if (panel.type === 'add-library-panel') { return ; } @@ -302,7 +296,7 @@ export class DashboardGrid extends PureComponent { render() { const { isEditable, dashboard } = this.props; - if (config.featureToggles.emptyDashboardPage && dashboard.panels.length === 0) { + if (dashboard.panels.length === 0) { return ; } diff --git a/public/app/features/dashboard/state/DashboardModel.test.ts b/public/app/features/dashboard/state/DashboardModel.test.ts index 99a1df997dd..3f52eda79af 100644 --- a/public/app/features/dashboard/state/DashboardModel.test.ts +++ b/public/app/features/dashboard/state/DashboardModel.test.ts @@ -116,17 +116,11 @@ describe('DashboardModel', () => { expect(keys[1]).toBe('editable'); }); - it('should remove add panel panels', () => { + it('should have only 1 panel after adding panel to a new dashboard', () => { const model = createDashboardModelFixture(); - model.addPanel({ - type: 'add-panel', - }); model.addPanel({ type: 'graph', }); - model.addPanel({ - type: 'add-panel', - }); const saveModel = model.getSaveModelClone(); const panels = saveModel.panels; diff --git a/public/app/features/dashboard/state/DashboardModel.ts b/public/app/features/dashboard/state/DashboardModel.ts index b974f0f11e7..3ab1e476b02 100644 --- a/public/app/features/dashboard/state/DashboardModel.ts +++ b/public/app/features/dashboard/state/DashboardModel.ts @@ -302,12 +302,8 @@ export class DashboardModel implements TimeModel { } private getPanelSaveModels() { - // Todo: Remove panel.type === 'add-panel' when we remove the emptyDashboardPage toggle return this.panels - .filter( - (panel) => - this.isSnapshotTruthy() || !(panel.type === 'add-panel' || panel.repeatPanelId || panel.repeatedByRow) - ) + .filter((panel) => this.isSnapshotTruthy() || !(panel.repeatPanelId || panel.repeatedByRow)) .map((panel) => { // Clean libarary panels on save if (panel.libraryPanel) { diff --git a/public/app/features/dashboard/state/initDashboard.test.ts b/public/app/features/dashboard/state/initDashboard.test.ts index 381562b4c2a..56b788a53b6 100644 --- a/public/app/features/dashboard/state/initDashboard.test.ts +++ b/public/app/features/dashboard/state/initDashboard.test.ts @@ -91,7 +91,7 @@ function describeInitScenario(description: string, scenarioFn: ScenarioFn) { title: 'My cool dashboard', panels: [ { - type: 'add-panel', + type: 'stat', gridPos: { x: 0, y: 0, w: 12, h: 9 }, title: 'Panel Title', id: 2, diff --git a/public/app/features/dashboard/state/initDashboard.ts b/public/app/features/dashboard/state/initDashboard.ts index e657299c681..43331146104 100644 --- a/public/app/features/dashboard/state/initDashboard.ts +++ b/public/app/features/dashboard/state/initDashboard.ts @@ -130,7 +130,7 @@ async function fetchDashboard( if (args.urlFolderUid) { await dispatch(getFolderByUid(args.urlFolderUid)); } - return getNewDashboardModelData(args.urlFolderUid, args.panelType); + return getNewDashboardModelData(args.urlFolderUid); } case DashboardRoutes.Path: { const path = args.urlSlug ?? ''; @@ -300,20 +300,7 @@ export function initDashboard(args: InitDashboardArgs): ThunkResult { }; } -export function getNewDashboardModelData( - urlFolderUid?: string, - panelType?: string -): { dashboard: any; meta: DashboardMeta } { - const panels = config.featureToggles.emptyDashboardPage - ? [] - : [ - { - type: panelType ?? 'add-panel', - gridPos: { x: 0, y: 0, w: 12, h: 9 }, - title: 'Panel Title', - }, - ]; - +export function getNewDashboardModelData(urlFolderUid?: string): { dashboard: any; meta: DashboardMeta } { const data = { meta: { canStar: false, @@ -324,7 +311,7 @@ export function getNewDashboardModelData( }, dashboard: { title: 'New dashboard', - panels, + panels: [], }, }; diff --git a/public/app/features/explore/extensions/AddToDashboard/addToDashboard.ts b/public/app/features/explore/extensions/AddToDashboard/addToDashboard.ts index 2e3b6501796..7c5a2cb72ae 100644 --- a/public/app/features/explore/extensions/AddToDashboard/addToDashboard.ts +++ b/public/app/features/explore/extensions/AddToDashboard/addToDashboard.ts @@ -22,15 +22,6 @@ interface AddPanelToDashboardOptions { time: Dashboard['time']; } -function createDashboard(): DashboardDTO { - const dto = getNewDashboardModelData(); - - // getNewDashboardModelData adds by default the "add-panel" panel. We don't want that. - dto.dashboard.panels = []; - - return dto; -} - /** * Returns transformations for the logs table visualisation in explore. * If the logs table supports a labels column, we need to extract the fields. @@ -96,7 +87,7 @@ export async function setDashboardInLocalStorage(options: AddPanelToDashboardOpt throw AddToDashboardError.FETCH_DASHBOARD; } } else { - dto = createDashboard(); + dto = getNewDashboardModelData(); } dto.dashboard.panels = [panel, ...(dto.dashboard.panels ?? [])]; diff --git a/public/sass/_grafana.scss b/public/sass/_grafana.scss index b21905e838d..9a7ad2a5ef8 100644 --- a/public/sass/_grafana.scss +++ b/public/sass/_grafana.scss @@ -31,7 +31,6 @@ @import 'layout/lists'; // COMPONENTS -@import '../app/features/dashboard/components/AddPanelWidget/AddPanelWidget'; @import 'components/scrollbar'; @import 'components/buttons'; @import 'components/navs';