Folder: Replace folderId with folderUid (#58393)

* support folderuid in FolderPicker

* support folderuid in unified alerting

* support folderuid when returning to view mode after editing a panel

* support folderuid when preselecting the folderpicker in dashboard general settings

* support folderuid when saving dashboard

* support folderuid when pre-selecting folderpicker in dashboard form

* support folderuid in routes when loading a dashboard

* support folderuid when saving dashboard json

* support folderuid when validating new dashboard name

* support folderuid when moving dashboard to another folder

* support folderuid on dashboard action buttons

* support folderuid when creating a new dashboard on an empty folder

* support folderuid when showing library panel modal

* support folderuid when saving library panel

* support folderuid when importing dashboard

* fixed broken tests

* use folderuid when importing dashboards

* remove commented line

* fix typo when comparing uid values

public/app/features/dashboard/components/DashboardPrompt/DashboardPrompt.tsx

@@ -76,7 +76,7 @@ export const DashboardPrompt = React.memo(({ dashboard }: Props) => {
       showModal(SaveLibraryPanelModal, {
         isUnsavedPrompt: true,
         panel: dashboard.panelInEdit as PanelModelWithLibraryPanel,
-        folderId: dashboard.meta.folderId as number,
+        folderUid: dashboard.meta.folderUid ?? '',
         onConfirm: () => {
           hideModal();
           moveToBlockedLocationAfterReactStateUpdate(location);

public/app/features/dashboard/components/DashboardSettings/GeneralSettings.tsx

@@ -30,8 +30,8 @@ export function GeneralSettingsUnconnected({
 }: Props): JSX.Element {
   const [renderCounter, setRenderCounter] = useState(0);
 
-  const onFolderChange = (folder: { id: number; title: string }) => {
-    dashboard.meta.folderId = folder.id;
+  const onFolderChange = (folder: { uid: string; title: string }) => {
+    dashboard.meta.folderUid = folder.uid;
     dashboard.meta.folderTitle = folder.title;
     dashboard.meta.hasUnsavedFolderChange = true;
   };
@@ -109,7 +109,7 @@ export function GeneralSettingsUnconnected({
             <FolderPicker
               inputId="dashboard-folder-input"
               initialTitle={dashboard.meta.folderTitle}
-              initialFolderId={dashboard.meta.folderId}
+              initialFolderUid={dashboard.meta.folderUid}
               onChange={onFolderChange}
               enableCreateNew={true}
               dashboardId={dashboard.id}

public/app/features/dashboard/components/PanelEditor/PanelEditor.tsx

@@ -498,7 +498,7 @@ export class PanelEditorUnconnected extends PureComponent<Props> {
           {this.state.showSaveLibraryPanelModal && (
             <SaveLibraryPanelModal
               panel={this.props.panel as PanelModelWithLibraryPanel}
-              folderId={this.props.dashboard.meta.folderId as number}
+              folderUid={this.props.dashboard.meta.folderUid ?? ''}
               onConfirm={this.onConfirmAndDismissLibarayPanelModel}
               onDiscard={this.onDiscard}
               onDismiss={this.onConfirmAndDismissLibarayPanelModel}

public/app/features/dashboard/components/SaveDashboard/forms/SaveDashboardAsForm.tsx

@@ -9,7 +9,7 @@ import { SaveDashboardFormProps } from '../types';
 
 interface SaveDashboardAsFormDTO {
   title: string;
-  $folder: { id?: number; title?: string };
+  $folder: { uid?: string; title?: string };
   copyTags: boolean;
 }
 
@@ -49,7 +49,7 @@ export const SaveDashboardAsForm: React.FC<SaveDashboardAsFormProps> = ({
   const defaultValues: SaveDashboardAsFormDTO = {
     title: isNew ? dashboard.title : `${dashboard.title} Copy`,
     $folder: {
-      id: dashboard.meta.folderId,
+      uid: dashboard.meta.folderUid,
       title: dashboard.meta.folderTitle,
     },
     copyTags: false,
@@ -60,7 +60,7 @@ export const SaveDashboardAsForm: React.FC<SaveDashboardAsFormProps> = ({
       return 'Dashboard name cannot be the same as folder name';
     }
     try {
-      await validationSrv.validateNewDashboardName(getFormValues().$folder.id, dashboardName);
+      await validationSrv.validateNewDashboardName(getFormValues().$folder.uid, dashboardName);
       return true;
     } catch (e) {
       return e instanceof Error ? e.message : 'Dashboard name is invalid';
@@ -84,7 +84,7 @@ export const SaveDashboardAsForm: React.FC<SaveDashboardAsFormProps> = ({
         const result = await onSubmit(
           clone,
           {
-            folderId: data.$folder.id,
+            folderUid: data.$folder.uid,
           },
           dashboard
         );
@@ -111,7 +111,7 @@ export const SaveDashboardAsForm: React.FC<SaveDashboardAsFormProps> = ({
                 <FolderPicker
                   {...field}
                   dashboardId={dashboard.id}
-                  initialFolderId={dashboard.meta.folderId}
+                  initialFolderUid={dashboard.meta.folderUid}
                   initialTitle={dashboard.meta.folderTitle}
                   enableCreateNew
                 />

public/app/features/dashboard/components/SaveDashboard/types.ts

@@ -11,7 +11,7 @@ export interface SaveDashboardData {
 }
 
 export interface SaveDashboardOptions extends CloneOptions {
-  folderId?: number;
+  folderUid?: string;
   overwrite?: boolean;
   message?: string;
   makeEditable?: boolean;
@@ -20,7 +20,7 @@ export interface SaveDashboardOptions extends CloneOptions {
 export interface SaveDashboardCommand {
   dashboard: DashboardDataDTO;
   message?: string;
-  folderId?: number;
+  folderUid?: string;
   overwrite?: boolean;
 }
 

public/app/features/dashboard/components/SaveDashboard/useDashboardSave.tsx

@@ -15,12 +15,12 @@ import { DashboardSavedEvent } from 'app/types/events';
 import { SaveDashboardOptions } from './types';
 
 const saveDashboard = async (saveModel: any, options: SaveDashboardOptions, dashboard: DashboardModel) => {
-  let folderId = options.folderId;
-  if (folderId === undefined) {
-    folderId = dashboard.meta.folderId ?? saveModel.folderId;
+  let folderUid = options.folderUid;
+  if (folderUid === undefined) {
+    folderUid = dashboard.meta.folderUid ?? saveModel.folderUid;
   }
 
-  const result = await saveDashboardApiCall({ ...options, folderId, dashboard: saveModel });
+  const result = await saveDashboardApiCall({ ...options, folderUid, dashboard: saveModel });
   // fetch updated access control permissions
   await contextSrv.fetchUserPermissions();
   return result;

public/app/features/dashboard/components/ShareModal/ShareLibraryPanel.tsx

@@ -7,10 +7,10 @@ import { AddLibraryPanelContents } from 'app/features/library-panels/components/
 import { ShareModalTabProps } from './types';
 
 interface Props extends ShareModalTabProps {
-  initialFolderId?: number;
+  initialFolderUid?: string;
 }
 
-export const ShareLibraryPanel = ({ panel, initialFolderId, onDismiss }: Props) => {
+export const ShareLibraryPanel = ({ panel, initialFolderUid, onDismiss }: Props) => {
   useEffect(() => {
     reportInteraction('grafana_dashboards_library_panel_share_viewed');
   }, []);
@@ -24,7 +24,7 @@ export const ShareLibraryPanel = ({ panel, initialFolderId, onDismiss }: Props)
       <p className="share-modal-info-text">
         <Trans i18nKey="share-modal.library.info">Create library panel.</Trans>
       </p>
-      <AddLibraryPanelContents panel={panel} initialFolderId={initialFolderId} onDismiss={onDismiss!} />
+      <AddLibraryPanelContents panel={panel} initialFolderUid={initialFolderUid} onDismiss={onDismiss!} />
     </>
   );
 };