From 0527d0ccbe92c08164b69aae274c2032d5b78f2a Mon Sep 17 00:00:00 2001 From: Ryan McKinley Date: Mon, 25 Nov 2024 14:15:29 +0300 Subject: [PATCH] POC/Provisioning: Move the save UI to its own file (#96966) Co-authored-by: Clarity-89 --- pkg/registry/apis/provisioning/utils.go | 1 + .../saving/SaveDashboardDrawer.tsx | 48 ++----- .../saving/SaveProvisionedDashboard.tsx | 134 ++++++++++++++++++ .../app/features/provisioning/api/baseAPI.ts | 4 +- public/app/features/provisioning/dashboard.ts | 22 ++- 5 files changed, 164 insertions(+), 45 deletions(-) create mode 100644 public/app/features/dashboard-scene/saving/SaveProvisionedDashboard.tsx diff --git a/pkg/registry/apis/provisioning/utils.go b/pkg/registry/apis/provisioning/utils.go index a430c9fb5a2..eabd6354433 100644 --- a/pkg/registry/apis/provisioning/utils.go +++ b/pkg/registry/apis/provisioning/utils.go @@ -44,6 +44,7 @@ func FallbackResourceLoader(data []byte) (*unstructured.Unstructured, *schema.Gr return &unstructured.Unstructured{ Object: map[string]interface{}{ "apiVersion": gvk.GroupVersion().String(), + "kind": "Dashboard", "metadata": map[string]any{ "name": value["uid"], }, diff --git a/public/app/features/dashboard-scene/saving/SaveDashboardDrawer.tsx b/public/app/features/dashboard-scene/saving/SaveDashboardDrawer.tsx index d9baec0db40..ab6a23e0285 100644 --- a/public/app/features/dashboard-scene/saving/SaveDashboardDrawer.tsx +++ b/public/app/features/dashboard-scene/saving/SaveDashboardDrawer.tsx @@ -1,6 +1,5 @@ -import { getBackendSrv } from '@grafana/runtime'; import { SceneComponentProps, SceneObjectBase, SceneObjectState, SceneObjectRef } from '@grafana/scenes'; -import { Button, Drawer, Tab, TabsBar } from '@grafana/ui'; +import { Drawer, Tab, TabsBar } from '@grafana/ui'; import { AnnoKeyRepoName } from 'app/features/apiserver/types'; import { SaveDashboardDiff } from 'app/features/dashboard/components/SaveDashboard/SaveDashboardDiff'; @@ -8,6 +7,7 @@ import { DashboardScene } from '../scene/DashboardScene'; import { SaveDashboardAsForm } from './SaveDashboardAsForm'; import { SaveDashboardForm } from './SaveDashboardForm'; +import { SaveProvisionedDashboard } from './SaveProvisionedDashboard'; import { SaveProvisionedDashboardForm } from './SaveProvisionedDashboardForm'; import { getDashboardChangesFromScene } from './getDashboardChangesFromScene'; @@ -50,7 +50,10 @@ export class SaveDashboardDrawer extends SceneObjectBase @@ -69,7 +72,7 @@ export class SaveDashboardDrawer extends SceneObjectBase -

Loaded from external repository

-

{provisioning.repo}

- {provisioning.file} -
- -
- - ); - } - - // Saved in grafana database, BUT must write to a remote repo for edit - if (meta.k8s?.annotations?.[AnnoKeyRepoName]) { - return ( -
-

Saved from external repository

- 
{JSON.stringify(meta.k8s.annotations, null, '  ')}
-
- ); + if (isProvisionedNG) { + return ; } if (saveAsCopy || changeInfo.isNew) { diff --git a/public/app/features/dashboard-scene/saving/SaveProvisionedDashboard.tsx b/public/app/features/dashboard-scene/saving/SaveProvisionedDashboard.tsx new file mode 100644 index 00000000000..9084c635d15 --- /dev/null +++ b/public/app/features/dashboard-scene/saving/SaveProvisionedDashboard.tsx @@ -0,0 +1,134 @@ +import { css } from '@emotion/css'; +import { useEffect, useMemo, useState } from 'react'; + +import { config, getBackendSrv } from '@grafana/runtime'; +import { Button, Stack, Box, TextArea, Field, Input, Alert } from '@grafana/ui'; +import { AnnoKeyRepoName, AnnoKeyRepoPath } from 'app/features/apiserver/types'; +import { DashboardMeta } from 'app/types'; + +import { DashboardScene } from '../scene/DashboardScene'; + +import { SaveDashboardDrawer } from './SaveDashboardDrawer'; +import { SaveDashboardFormCommonOptions } from './SaveDashboardForm'; +import { DashboardChangeInfo } from './shared'; + +export interface Props { + meta: DashboardMeta; + dashboard: DashboardScene; + drawer: SaveDashboardDrawer; + changeInfo: DashboardChangeInfo; +} + +export function SaveProvisionedDashboard({ meta, drawer, changeInfo }: Props) { + const dashboardJSON = useMemo(() => JSON.stringify(changeInfo.changedSaveModel, null, 2), [changeInfo]); + + const [repo, setRepo] = useState(); + const [path, setPath] = useState(); + const [ref, setRef] = useState(); + const [comment, setComment] = useState(); + + useEffect(() => { + const anno = meta.k8s?.annotations; + if (!anno) { + setRepo(''); + setPath(''); + setRef(''); + return; + } + let ref = ''; + let path = anno[AnnoKeyRepoPath] ?? ''; + const idx = path.indexOf('#'); + if (idx > 0) { + ref = path.substring(idx + 1); + path = path.substring(0, idx); + } + setRepo(anno[AnnoKeyRepoName]); + setPath(path); + setRef(ref); + }, [meta]); + + const doSave = () => { + const url = `apis/provisioning.grafana.app/v0alpha1/namespaces/${config.namespace}/repositories/${repo}/files/${path}`; + const params: Record = {}; + if (ref) { + params['ref'] = ref; + } + if (comment) { + params['comment'] = comment; + } + + getBackendSrv() + .put(url, dashboardJSON, { params }) + .then((v) => { + console.log('WROTE', v); + alert('WROTE value'); + }); + }; + + return ( +
+ +
+ + More warnings here... mostly exploratory interfaces. + +
+ + + + +
{repo}
+ + + + { + setPath(e.currentTarget.value); + }} + /> + + + + { + setRef(e.currentTarget.value); + }} + /> + + + +