diff --git a/public/app/core/components/NestedFolderPicker/FolderParent.tsx b/public/app/core/components/NestedFolderPicker/FolderParent.tsx new file mode 100644 index 00000000000..6e2b3842646 --- /dev/null +++ b/public/app/core/components/NestedFolderPicker/FolderParent.tsx @@ -0,0 +1,53 @@ +import { memo } from 'react'; +import Skeleton from 'react-loading-skeleton'; + +import { Box, Text } from '@grafana/ui'; + +import { useGetFolderQueryFacade } from '../../../api/clients/folder/v1beta1/hooks'; +import { DashboardsTreeItem } from '../../../features/browse-dashboards/types'; + +interface ParentTextProps { + folder: string; +} + +function ParentText({ folder }: ParentTextProps) { + return ( + + + /{folder} + + + ); +} + +export const FolderParent = memo(function FolderParent({ item }: { item: DashboardsTreeItem }) { + if (item.item.kind !== 'folder') { + return null; + } + + if (item.item.parentTitle) { + return ; + } + + const parentUID = item.item.parentUID || item.parentUID; + + if (parentUID) { + return ; + } + + return null; +}); + +function NetworkFolderParent({ uid }: { uid: string }) { + const result = useGetFolderQueryFacade(uid); + + if (result.isLoading) { + return ; + } + + if (result.data) { + return ; + } + + return null; +} diff --git a/public/app/core/components/NestedFolderPicker/NestedFolderList.tsx b/public/app/core/components/NestedFolderPicker/NestedFolderList.tsx index 46ef137c53f..aa099cff928 100644 --- a/public/app/core/components/NestedFolderPicker/NestedFolderList.tsx +++ b/public/app/core/components/NestedFolderPicker/NestedFolderList.tsx @@ -14,6 +14,7 @@ import { DashboardsTreeItem } from 'app/features/browse-dashboards/types'; import { DashboardViewItem } from 'app/features/search/types'; import { useSelector } from 'app/types/store'; +import { FolderParent } from './FolderParent'; import { FolderRepo } from './FolderRepo'; const ROW_HEIGHT = 40; @@ -216,6 +217,7 @@ function Row({ index, style: virtualStyles, data }: RowProps) { {item.title} + ); @@ -282,7 +284,6 @@ const getStyles = (theme: GrafanaTheme2) => { alignItems: 'center', gap: theme.spacing(1), lineHeight: ROW_HEIGHT + 'px', - flexGrow: 1, minWidth: 0, overflow: 'hidden', textOverflow: 'ellipsis', diff --git a/public/app/core/components/NestedFolderPicker/NestedFolderPicker.tsx b/public/app/core/components/NestedFolderPicker/NestedFolderPicker.tsx index 3fca40f809e..826f8ec5002 100644 --- a/public/app/core/components/NestedFolderPicker/NestedFolderPicker.tsx +++ b/public/app/core/components/NestedFolderPicker/NestedFolderPicker.tsx @@ -234,6 +234,7 @@ export function NestedFolderPicker({ title: item.title, uid: item.uid, parentUID: item.parentUID, + parentTitle: item.parentTitle, }, })) ?? []; }