SaveDashboard: remove feature flag for save drawer (#48462)

This commit is contained in:
Ryan McKinley 2022-05-02 09:29:22 -07:00 committed by GitHub
parent da1d34e83d
commit a8f3b17262
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
13 changed files with 19 additions and 198 deletions

View File

@ -47,7 +47,6 @@ export interface FeatureToggles {
dashboardComments?: boolean;
annotationComments?: boolean;
migrationLocking?: boolean;
saveDashboardDrawer?: boolean;
storage?: boolean;
alertProvisioning?: boolean;
export?: boolean;

View File

@ -175,11 +175,6 @@ var (
Description: "Lock database during migrations",
State: FeatureStateBeta,
},
{
Name: "saveDashboardDrawer",
Description: "Use a drawer to show save dashboard dialog",
State: FeatureStateBeta,
},
{
Name: "storage",
Description: "Configurable storage for dashboards, datasources, and resources",

View File

@ -131,10 +131,6 @@ const (
// Lock database during migrations
FlagMigrationLocking = "migrationLocking"
// FlagSaveDashboardDrawer
// Use a drawer to show save dashboard dialog
FlagSaveDashboardDrawer = "saveDashboardDrawer"
// FlagStorage
// Configurable storage for dashboards, datasources, and resources
FlagStorage = "storage"

View File

@ -6,7 +6,7 @@ import { LegacyGraphHoverClearEvent, locationUtil } from '@grafana/data';
import { locationService } from '@grafana/runtime';
import appEvents from 'app/core/app_events';
import { getExploreUrl } from 'app/core/utils/explore';
import { SaveDashboardProxy } from 'app/features/dashboard/components/SaveDashboard/SaveDashboardProxy';
import { SaveDashboardDrawer } from 'app/features/dashboard/components/SaveDashboard/SaveDashboardDrawer';
import { ShareModal } from 'app/features/dashboard/components/ShareModal';
import { DashboardModel } from 'app/features/dashboard/state';
@ -204,7 +204,7 @@ export class KeybindingSrv {
if (dashboard.meta.canSave) {
appEvents.publish(
new ShowModalReactEvent({
component: SaveDashboardProxy,
component: SaveDashboardDrawer,
props: {
dashboard,
},

View File

@ -8,7 +8,7 @@ import { ButtonGroup, ModalsController, ToolbarButton, PageToolbar, useForceUpda
import config from 'app/core/config';
import { toggleKioskMode } from 'app/core/navigation/kiosk';
import { DashboardCommentsModal } from 'app/features/dashboard/components/DashboardComments/DashboardCommentsModal';
import { SaveDashboardProxy } from 'app/features/dashboard/components/SaveDashboard/SaveDashboardProxy';
import { SaveDashboardDrawer } from 'app/features/dashboard/components/SaveDashboard/SaveDashboardDrawer';
import { ShareModal } from 'app/features/dashboard/components/ShareModal';
import { playlistSrv } from 'app/features/playlist/PlaylistSrv';
import { updateTimeZoneForSession } from 'app/features/profile/state/reducers';
@ -225,7 +225,7 @@ export const DashNav = React.memo<Props>((props) => {
tooltip="Save dashboard"
icon="save"
onClick={() => {
showModal(SaveDashboardProxy, {
showModal(SaveDashboardDrawer, {
dashboard,
onDismiss: hideModal,
});

View File

@ -40,7 +40,7 @@ import { getVariablesByKey } from '../../../variables/state/selectors';
import { DashboardPanel } from '../../dashgrid/DashboardPanel';
import { DashboardModel, PanelModel } from '../../state';
import { DashNavTimeControls } from '../DashNav/DashNavTimeControls';
import { SaveDashboardProxy } from '../SaveDashboard/SaveDashboardProxy';
import { SaveDashboardDrawer } from '../SaveDashboard/SaveDashboardDrawer';
import { OptionsPane } from './OptionsPane';
import { PanelEditorTableView } from './PanelEditorTableView';
@ -141,7 +141,7 @@ export class PanelEditorUnconnected extends PureComponent<Props> {
onSaveDashboard = () => {
appEvents.publish(
new ShowModalReactEvent({
component: SaveDashboardProxy,
component: SaveDashboardDrawer,
props: { dashboard: this.props.dashboard },
})
);

View File

@ -1,52 +0,0 @@
import { css } from '@emotion/css';
import React, { useState } from 'react';
import { Modal } from '@grafana/ui';
import { SaveDashboardErrorProxy } from './SaveDashboardErrorProxy';
import { SaveDashboardAsForm } from './forms/SaveDashboardAsForm';
import { SaveDashboardModalProps } from './types';
import { useDashboardSave } from './useDashboardSave';
export const SaveDashboardAsModal: React.FC<
SaveDashboardModalProps & {
isNew?: boolean;
}
> = ({ dashboard, onDismiss, isNew }) => {
const { state, onDashboardSave } = useDashboardSave(dashboard);
const [dashboardSaveModelClone, setDashboardSaveModelClone] = useState();
return (
<>
{state.error && (
<SaveDashboardErrorProxy
error={state.error}
dashboard={dashboard}
dashboardSaveModel={dashboardSaveModelClone}
onDismiss={onDismiss}
/>
)}
{!state.error && (
<Modal
isOpen={true}
title="Save dashboard as..."
icon="copy"
onDismiss={onDismiss}
className={css`
width: 500px;
`}
>
<SaveDashboardAsForm
dashboard={dashboard}
onCancel={onDismiss}
onSuccess={onDismiss}
onSubmit={(clone, options, dashboard) => {
setDashboardSaveModelClone(clone);
return onDashboardSave(clone, options, dashboard);
}}
isNew={isNew}
/>
</Modal>
)}
</>
);
};

View File

@ -4,7 +4,7 @@ import { selectors } from '@grafana/e2e-selectors';
import { Button, ButtonVariant, ModalsController, FullWidthButtonContainer } from '@grafana/ui';
import { DashboardModel } from 'app/features/dashboard/state';
import { SaveDashboardProxy } from './SaveDashboardProxy';
import { SaveDashboardDrawer } from './SaveDashboardDrawer';
interface SaveDashboardButtonProps {
dashboard: DashboardModel;
@ -18,7 +18,7 @@ export const SaveDashboardButton: React.FC<SaveDashboardButtonProps> = ({ dashbo
return (
<Button
onClick={() => {
showModal(SaveDashboardProxy, {
showModal(SaveDashboardDrawer, {
dashboard,
onSaveSuccess,
onDismiss: hideModal,
@ -46,7 +46,7 @@ export const SaveDashboardAsButton: React.FC<SaveDashboardButtonProps & { varian
<FullWidthButtonContainer>
<Button
onClick={() => {
showModal(SaveDashboardProxy, {
showModal(SaveDashboardDrawer, {
dashboard,
onSaveSuccess,
onDismiss: hideModal,

View File

@ -40,12 +40,11 @@ export const SaveDashboardDiff = ({ diff, oldValue, newValue }: SaveDashboardDif
}
}
return {
oldJSON,
newJSON,
schemaChange,
diffs,
count,
showDiffs: count < 15, // overwhelming if too many changes
jsonView: <DiffViewer oldValue={oldJSON} newValue={newJSON} />,
};
}, [diff, oldValue, newValue]);
@ -65,7 +64,7 @@ export const SaveDashboardDiff = ({ diff, oldValue, newValue }: SaveDashboardDif
{value.showDiffs && <div className={styles.spacer}>{value.diffs}</div>}
<h4>JSON Model</h4>
<DiffViewer oldValue={value.oldJSON} newValue={value.newJSON} />
{value.jsonView}
</div>
);
};

View File

@ -110,9 +110,16 @@ export const SaveDashboardDrawer = ({ dashboard, onDismiss, onSaveSuccess, isCop
);
}
let title = 'Save dashboard';
if (isCopy) {
title = 'Save dashboard copy';
} else if (isProvisioned) {
title = 'Provisioned dashboard';
}
return (
<Drawer
title={isCopy ? 'Save dashboard copy' : 'Save dashboard'}
title={title}
onClose={onDismiss}
width={'40%'}
subtitle={dashboard.title}

View File

@ -1,66 +0,0 @@
import { css } from '@emotion/css';
import React, { useMemo, useState } from 'react';
import { Modal } from '@grafana/ui';
import { SaveDashboardErrorProxy } from './SaveDashboardErrorProxy';
import { SaveDashboardForm } from './forms/SaveDashboardForm';
import { SaveDashboardModalProps, SaveDashboardOptions, SaveDashboardData } from './types';
import { useDashboardSave } from './useDashboardSave';
export const SaveDashboardModal: React.FC<SaveDashboardModalProps> = ({ dashboard, onDismiss, onSaveSuccess }) => {
const { state, onDashboardSave } = useDashboardSave(dashboard);
const [dashboardSaveModelClone, setDashboardSaveModelClone] = useState();
const [options, setOptions] = useState<SaveDashboardOptions>({});
const data = useMemo<SaveDashboardData>(() => {
const clone = dashboard.getSaveModelClone({
saveTimerange: Boolean(options.saveTimerange),
saveVariables: Boolean(options.saveVariables),
});
return { clone, diff: {}, diffCount: 0, hasChanges: true };
}, [dashboard, options]);
return (
<>
{state.error && (
<SaveDashboardErrorProxy
error={state.error}
dashboard={dashboard}
dashboardSaveModel={dashboardSaveModelClone}
onDismiss={onDismiss}
/>
)}
{!state.error && (
<Modal
isOpen={true}
title="Save dashboard"
icon="copy"
onDismiss={onDismiss}
className={css`
width: 500px;
`}
>
<SaveDashboardForm
dashboard={dashboard}
onCancel={onDismiss}
saveModel={data}
options={options}
onSuccess={() => {
onDismiss();
if (onSaveSuccess) {
onSaveSuccess();
}
}}
onSubmit={(clone, options, dashboard) => {
setDashboardSaveModelClone(clone);
return onDashboardSave(clone, options, dashboard);
}}
onOptionsChange={setOptions}
/>
</Modal>
)}
</>
);
};

View File

@ -1,43 +0,0 @@
import React from 'react';
import { config } from '@grafana/runtime';
import { SaveDashboardAsModal } from './SaveDashboardAsModal';
import { SaveDashboardDrawer } from './SaveDashboardDrawer';
import { SaveDashboardModal } from './SaveDashboardModal';
import { SaveProvisionedDashboard } from './SaveProvisionedDashboard';
import { SaveDashboardModalProps } from './types';
export const SaveDashboardProxy: React.FC<SaveDashboardModalProps> = ({
dashboard,
onDismiss,
onSaveSuccess,
isCopy,
}) => {
if (config.featureToggles.saveDashboardDrawer) {
return (
<SaveDashboardDrawer dashboard={dashboard} onDismiss={onDismiss} onSaveSuccess={onSaveSuccess} isCopy={isCopy} />
);
}
const isProvisioned = dashboard.meta.provisioned;
const isNew = dashboard.version === 0;
const isChanged = dashboard.version > 0;
const modalProps = {
dashboard,
onDismiss,
onSaveSuccess,
isCopy,
};
if (isNew || isCopy) {
return <SaveDashboardAsModal {...modalProps} isNew />;
}
return (
<>
{isChanged && !isProvisioned && <SaveDashboardModal {...modalProps} />}
{isProvisioned && <SaveProvisionedDashboard {...modalProps} />}
</>
);
};

View File

@ -1,14 +0,0 @@
import React from 'react';
import { Modal } from '@grafana/ui';
import { SaveProvisionedDashboardForm } from './forms/SaveProvisionedDashboardForm';
import { SaveDashboardModalProps } from './types';
export const SaveProvisionedDashboard: React.FC<SaveDashboardModalProps> = ({ dashboard, onDismiss }) => {
return (
<Modal isOpen={true} title="Cannot save provisioned dashboard" icon="copy" onDismiss={onDismiss}>
<SaveProvisionedDashboardForm dashboard={dashboard} onCancel={onDismiss} onSuccess={onDismiss} />
</Modal>
);
};