Dashboard-Scenes: JSON Model and Version tabs don't hide edit mode on refresh (#81219)

* Add NavToolbarActions to fix the bug

* Update public/app/features/dashboard-scene/settings/VersionsEditView.tsx

Co-authored-by: Victor Marin <36818606+mdvictor@users.noreply.github.com>

* Fix compared view

---------

Co-authored-by: Victor Marin <36818606+mdvictor@users.noreply.github.com>
This commit is contained in:
Haris Rozajac
2024-01-25 14:27:11 -07:00
committed by GitHub
parent b1eec36df3
commit 7ab710daa7
2 changed files with 32 additions and 24 deletions

View File

@@ -10,6 +10,7 @@ import { getPrettyJSON } from 'app/features/inspector/utils/utils';
import { DashboardDTO } from 'app/types'; import { DashboardDTO } from 'app/types';
import { DashboardScene } from '../scene/DashboardScene'; import { DashboardScene } from '../scene/DashboardScene';
import { NavToolbarActions } from '../scene/NavToolbarActions';
import { transformSaveModelToScene } from '../serialization/transformSaveModelToScene'; import { transformSaveModelToScene } from '../serialization/transformSaveModelToScene';
import { transformSceneToSaveModel } from '../serialization/transformSceneToSaveModel'; import { transformSceneToSaveModel } from '../serialization/transformSceneToSaveModel';
import { getDashboardSceneFor } from '../utils/utils'; import { getDashboardSceneFor } from '../utils/utils';
@@ -69,6 +70,7 @@ export class JsonModelEditView extends SceneObjectBase<JsonModelEditViewState> i
return ( return (
<Page navModel={navModel} pageNav={pageNav} layout={PageLayoutType.Standard}> <Page navModel={navModel} pageNav={pageNav} layout={PageLayoutType.Standard}>
<NavToolbarActions dashboard={dashboard} />
<div className={styles.wrapper}> <div className={styles.wrapper}>
<Trans i18nKey="dashboard-settings.json-editor.subtitle"> <Trans i18nKey="dashboard-settings.json-editor.subtitle">
The JSON model below is the data structure that defines the dashboard. This includes dashboard settings, The JSON model below is the data structure that defines the dashboard. This includes dashboard settings,

View File

@@ -6,6 +6,7 @@ import { HorizontalGroup, Spinner } from '@grafana/ui';
import { Page } from 'app/core/components/Page/Page'; import { Page } from 'app/core/components/Page/Page';
import { DashboardScene } from '../scene/DashboardScene'; import { DashboardScene } from '../scene/DashboardScene';
import { NavToolbarActions } from '../scene/NavToolbarActions';
import { getDashboardSceneFor } from '../utils/utils'; import { getDashboardSceneFor } from '../utils/utils';
import { DashboardEditView, DashboardEditViewState, useDashboardEditPageNav } from './utils'; import { DashboardEditView, DashboardEditViewState, useDashboardEditPageNav } from './utils';
@@ -188,9 +189,8 @@ function VersionsEditorSettingsListView({ model }: SceneComponentProps<VersionsE
const hasMore = model.versions.length >= model.limit; const hasMore = model.versions.length >= model.limit;
const isLastPage = model.versions.find((rev) => rev.version === 1); const isLastPage = model.versions.find((rev) => rev.version === 1);
if (viewMode === 'compare') { const viewModeCompare = (
return ( <>
<Page navModel={navModel} pageNav={pageNav} layout={PageLayoutType.Standard}>
<VersionHistoryHeader <VersionHistoryHeader
onClick={model.reset} onClick={model.reset}
baseVersion={baseInfo?.version} baseVersion={baseInfo?.version}
@@ -208,12 +208,11 @@ function VersionsEditorSettingsListView({ model }: SceneComponentProps<VersionsE
onRestore={dashboard.onRestore} onRestore={dashboard.onRestore}
/> />
)} )}
</Page> </>
); );
}
return ( const viewModeList = (
<Page navModel={navModel} pageNav={pageNav} layout={PageLayoutType.Standard}> <>
{isLoading ? ( {isLoading ? (
<VersionsHistorySpinner msg="Fetching history list&hellip;" /> <VersionsHistorySpinner msg="Fetching history list&hellip;" />
) : ( ) : (
@@ -234,6 +233,13 @@ function VersionsEditorSettingsListView({ model }: SceneComponentProps<VersionsE
isLastPage={!!isLastPage} isLastPage={!!isLastPage}
/> />
)} )}
</>
);
return (
<Page navModel={navModel} pageNav={pageNav} layout={PageLayoutType.Standard}>
<NavToolbarActions dashboard={dashboard} />
{viewMode === 'compare' ? viewModeCompare : viewModeList}
</Page> </Page>
); );
} }