IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2025-02-13 00:55:47 -06:00
Code Issues Packages Projects Releases Wiki Activity

NestedFolders: Folder view move folder (#65661)

Browse Source
This commit is contained in:
Josh Hunt 2023-03-31 12:32:23 +01:00 committed by GitHub
parent 9f4ab1b6dd
commit 3e8f29404e
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 45 additions and 16 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

59
public/app/features/search/components/DashboardActions.tsx
View File

@ -1,16 +1,27 @@
import React from 'react'; import React, { useMemo, useState } from 'react';
import { config, reportInteraction } from '@grafana/runtime'; import { config, reportInteraction } from '@grafana/runtime';
import { Menu, Dropdown, Button, Icon } from '@grafana/ui'; import { Menu, Dropdown, Button, Icon, HorizontalGroup } from '@grafana/ui';
import { t } from 'app/core/internationalization'; import { t } from 'app/core/internationalization';
import { FolderDTO } from 'app/types';
import { MoveToFolderModal } from '../page/components/MoveToFolderModal';
export interface Props { export interface Props {
folderUid?: string; folder: FolderDTO | undefined;
canCreateFolders?: boolean; canCreateFolders?: boolean;
canCreateDashboards?: boolean; canCreateDashboards?: boolean;
} }
export const DashboardActions = ({ folderUid, canCreateFolders = false, canCreateDashboards = false }: Props) => { export const DashboardActions = ({ folder, canCreateFolders = false, canCreateDashboards = false }: Props) => {
const [isMoveModalOpen, setIsMoveModalOpen] = useState(false);
const canMove = config.featureToggles.nestedFolders && (folder?.canSave ?? false);
const moveSelection = useMemo(
() => new Map<string, Set<string>>([['folder', new Set(folder?.uid ? [folder.uid] : [])]]),
[folder]
);
const actionUrl = (type: string) => { const actionUrl = (type: string) => {
let url = `dashboard/${type}`; let url = `dashboard/${type}`;
const isTypeNewFolder = type === 'new_folder'; const isTypeNewFolder = type === 'new_folder';
@ -19,8 +30,8 @@ export const DashboardActions = ({ folderUid, canCreateFolders = false, canCreat
url = `dashboards/folder/new/`; url = `dashboards/folder/new/`;
} }
if (folderUid) { if (folder?.uid) {
url += `?folderUid=${folderUid}`; url += `?folderUid=${folder.uid}`;
} }
return url; return url;
@ -38,7 +49,7 @@ export const DashboardActions = ({ folderUid, canCreateFolders = false, canCreat
} }
/> />
)} )}
{canCreateFolders && (config.featureToggles.nestedFolders || !folderUid) && ( {canCreateFolders && (config.featureToggles.nestedFolders || !folder?.uid) && (
<Menu.Item <Menu.Item
url={actionUrl('new_folder')} url={actionUrl('new_folder')}
label={t('search.dashboard-actions.new-folder', 'New Folder')} label={t('search.dashboard-actions.new-folder', 'New Folder')}
@ -61,13 +72,31 @@ export const DashboardActions = ({ folderUid, canCreateFolders = false, canCreat
}; };
return ( return (
<div> <>
<Dropdown overlay={MenuActions} placement="bottom-start"> <div>
<Button variant="primary"> <HorizontalGroup>
{t('search.dashboard-actions.new', 'New')} {canMove && (
<Icon name="angle-down" /> <Button onClick={() => setIsMoveModalOpen(true)} icon="exchange-alt" variant="secondary">
</Button> Move
</Dropdown> </Button>
</div> )}
<Dropdown overlay={MenuActions} placement="bottom-start">
<Button variant="primary">
{t('search.dashboard-actions.new', 'New')}
<Icon name="angle-down" />
</Button>
</Dropdown>
</HorizontalGroup>
</div>
{canMove && isMoveModalOpen && (
<MoveToFolderModal
onMoveItems={() => {}}
results={moveSelection}
isOpen={isMoveModalOpen}
onDismiss={() => setIsMoveModalOpen(false)}
/>
)}
</>
); );
}; };

2
public/app/features/search/components/ManageDashboardsNew.tsx
View File

@ -61,7 +61,7 @@ export const ManageDashboardsNew = React.memo(({ folder }: Props) => {
</div> </div>
{viewActions && ( {viewActions && (
<DashboardActions <DashboardActions
folderUid={folderUid} folder={folder}
canCreateFolders={canCreateFolders} canCreateFolders={canCreateFolders}
canCreateDashboards={canCreateDashboards} canCreateDashboards={canCreateDashboards}
/> />