NestedFolderPicker: Allow for excluding certain uids (#72019)

* exclude some uids from nested folder picker so you can't move a folder to itself

* rename excludedUids to excludeUIDs
pull/72109/head
Ashley Harrison 2 years ago committed by GitHub
parent 8f464ac66e
commit f078a0bb40
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
  1. 17
      public/app/core/components/NestedFolderPicker/NestedFolderPicker.tsx
  2. 2
      public/app/features/browse-dashboards/components/BrowseActions/MoveModal.tsx
  3. 8
      public/app/features/browse-dashboards/state/hooks.ts

@ -33,11 +33,12 @@ interface NestedFolderPickerProps {
// TODO: think properly (and pragmatically) about how to communicate moving to general folder, // TODO: think properly (and pragmatically) about how to communicate moving to general folder,
// vs removing selection (if possible?) // vs removing selection (if possible?)
onChange?: (folder: FolderChange) => void; onChange?: (folder: FolderChange) => void;
excludeUIDs?: string[];
} }
const EXCLUDED_KINDS = ['empty-folder' as const, 'dashboard' as const]; const EXCLUDED_KINDS = ['empty-folder' as const, 'dashboard' as const];
export function NestedFolderPicker({ value, onChange }: NestedFolderPickerProps) { export function NestedFolderPicker({ value, onChange, excludeUIDs = [] }: NestedFolderPickerProps) {
const styles = useStyles2(getStyles); const styles = useStyles2(getStyles);
const dispatch = useDispatch(); const dispatch = useDispatch();
const selectedFolder = useGetFolderQuery(value || skipToken); const selectedFolder = useGetFolderQuery(value || skipToken);
@ -136,10 +137,18 @@ export function NestedFolderPicker({ value, onChange }: NestedFolderPickerProps)
items: searchResults.items ?? [], items: searchResults.items ?? [],
}; };
return createFlatTree(undefined, searchCollection, childrenCollections, {}, 0, EXCLUDED_KINDS); return createFlatTree(undefined, searchCollection, childrenCollections, {}, 0, EXCLUDED_KINDS, excludeUIDs);
} }
let flatTree = createFlatTree(undefined, rootCollection, childrenCollections, folderOpenState, 0, EXCLUDED_KINDS); let flatTree = createFlatTree(
undefined,
rootCollection,
childrenCollections,
folderOpenState,
0,
EXCLUDED_KINDS,
excludeUIDs
);
// Increase the level of each item to 'make way' for the fake root Dashboards item // Increase the level of each item to 'make way' for the fake root Dashboards item
for (const item of flatTree) { for (const item of flatTree) {
@ -162,7 +171,7 @@ export function NestedFolderPicker({ value, onChange }: NestedFolderPickerProps)
} }
return flatTree; return flatTree;
}, [search, searchState.value, rootCollection, childrenCollections, folderOpenState]); }, [search, searchState.value, rootCollection, childrenCollections, folderOpenState, excludeUIDs]);
const isItemLoaded = useCallback( const isItemLoaded = useCallback(
(itemIndex: number) => { (itemIndex: number) => {

@ -61,7 +61,7 @@ export const MoveModal = ({ onConfirm, onDismiss, selectedItems, ...props }: Pro
<Field label={t('browse-dashboards.action.move-modal-field-label', 'Folder name')}> <Field label={t('browse-dashboards.action.move-modal-field-label', 'Folder name')}>
{config.featureToggles.nestedFolderPicker ? ( {config.featureToggles.nestedFolderPicker ? (
<NestedFolderPicker value={moveTarget} onChange={handleFolderChange} /> <NestedFolderPicker value={moveTarget} onChange={handleFolderChange} excludeUIDs={selectedFolders} />
) : ( ) : (
<FolderPicker allowEmpty onChange={handleFolderChange} /> <FolderPicker allowEmpty onChange={handleFolderChange} />
)} )}

@ -144,10 +144,11 @@ export function createFlatTree(
childrenByUID: BrowseDashboardsState['childrenByParentUID'], childrenByUID: BrowseDashboardsState['childrenByParentUID'],
openFolders: Record<string, boolean>, openFolders: Record<string, boolean>,
level = 0, level = 0,
excludeKinds: Array<DashboardViewItemWithUIItems['kind'] | UIDashboardViewItem['uiKind']> = [] excludeKinds: Array<DashboardViewItemWithUIItems['kind'] | UIDashboardViewItem['uiKind']> = [],
excludeUIDs: string[] = []
): DashboardsTreeItem[] { ): DashboardsTreeItem[] {
function mapItem(item: DashboardViewItem, parentUID: string | undefined, level: number): DashboardsTreeItem[] { function mapItem(item: DashboardViewItem, parentUID: string | undefined, level: number): DashboardsTreeItem[] {
if (excludeKinds.includes(item.kind)) { if (excludeKinds.includes(item.kind) || excludeUIDs.includes(item.uid)) {
return []; return [];
} }
@ -157,7 +158,8 @@ export function createFlatTree(
childrenByUID, childrenByUID,
openFolders, openFolders,
level + 1, level + 1,
excludeKinds excludeKinds,
excludeUIDs
); );
const isOpen = Boolean(openFolders[item.uid]); const isOpen = Boolean(openFolders[item.uid]);

Loading…
Cancel
Save