diff --git a/public/app/core/components/Select/FolderPicker.tsx b/public/app/core/components/Select/FolderPicker.tsx
index f6c8474a787..d86d873e2c7 100644
--- a/public/app/core/components/Select/FolderPicker.tsx
+++ b/public/app/core/components/Select/FolderPicker.tsx
@@ -6,17 +6,40 @@ import { NestedFolderPicker, NestedFolderPickerProps } from '../NestedFolderPick
import { OldFolderPicker } from './OldFolderPicker';
+interface FolderPickerProps extends NestedFolderPickerProps {
+ // These props are only used by the old folder picker, and should be removed when old picker is removed
+
+ /** @deprecated */
+ initialTitle?: string;
+
+ /** @deprecated */
+ dashboardId?: number | string;
+
+ /** @deprecated */
+ enableCreateNew?: boolean;
+}
+
// Temporary wrapper component to switch between the NestedFolderPicker and the old flat
// FolderPicker depending on feature flags
-export function FolderPicker(props: NestedFolderPickerProps) {
+export function FolderPicker(props: FolderPickerProps) {
const nestedEnabled = config.featureToggles.nestedFolders && config.featureToggles.nestedFolderPicker;
- return nestedEnabled ? : ;
+ const { initialTitle, dashboardId, enableCreateNew, ...newFolderPickerProps } = props;
+
+ return nestedEnabled ? : ;
}
// Converts new NestedFolderPicker props to old non-nested folder picker props
// Seperate component so the hooks aren't created if not used
-function OldFolderPickerWrapper({ value, showRootFolder, onChange }: NestedFolderPickerProps) {
+function OldFolderPickerWrapper({
+ value,
+ showRootFolder,
+ onChange,
+ initialTitle,
+ dashboardId,
+ enableCreateNew,
+}: FolderPickerProps) {
const [initialFolderUID] = useState(value);
+
const handleOnChange = useCallback(
(newFolder: { title: string; uid: string }) => {
if (onChange) {
@@ -26,5 +49,14 @@ function OldFolderPickerWrapper({ value, showRootFolder, onChange }: NestedFolde
[onChange]
);
- return ;
+ return (
+
+ );
}
diff --git a/public/app/features/dashboard/components/SaveDashboard/forms/SaveDashboardAsForm.tsx b/public/app/features/dashboard/components/SaveDashboard/forms/SaveDashboardAsForm.tsx
index 9c9eb052399..29f77c3dda2 100644
--- a/public/app/features/dashboard/components/SaveDashboard/forms/SaveDashboardAsForm.tsx
+++ b/public/app/features/dashboard/components/SaveDashboard/forms/SaveDashboardAsForm.tsx
@@ -1,9 +1,7 @@
import React from 'react';
-import { config } from '@grafana/runtime';
import { Button, Input, Switch, Form, Field, InputControl, HorizontalGroup } from '@grafana/ui';
-import { NestedFolderPicker } from 'app/core/components/NestedFolderPicker/NestedFolderPicker';
-import { OldFolderPicker } from 'app/core/components/Select/OldFolderPicker';
+import { FolderPicker } from 'app/core/components/Select/FolderPicker';
import { DashboardModel, PanelModel } from 'app/features/dashboard/state';
import { validationSrv } from 'app/features/manage-dashboards/services/ValidationSrv';
@@ -110,23 +108,17 @@ export const SaveDashboardAsForm = ({
- config.featureToggles.nestedFolderPicker ? (
- field.onChange({ uid, title })}
- value={field.value?.uid}
- />
- ) : (
-
- )
- }
+ render={({ field: { ref, ...field } }) => (
+ field.onChange({ uid, title })}
+ value={field.value?.uid}
+ // Old folder picker fields
+ initialTitle={dashboard.meta.folderTitle}
+ dashboardId={dashboard.id}
+ enableCreateNew
+ />
+ )}
control={control}
name="$folder"
/>