mirror of
https://github.com/grafana/grafana.git
synced 2025-02-25 18:55:37 -06:00
Dashboard: Migration - Add public dashboard tag in the nav bar (#86204)
Migrate public dashboard badge to scenes dashboard
This commit is contained in:
parent
9015bfa3f4
commit
40f1b2c92c
@ -4,7 +4,17 @@ import React, { useEffect, useState } from 'react';
|
||||
import { GrafanaTheme2 } from '@grafana/data';
|
||||
import { selectors } from '@grafana/e2e-selectors';
|
||||
import { config, locationService } from '@grafana/runtime';
|
||||
import { Button, ButtonGroup, Dropdown, Icon, Menu, ToolbarButton, ToolbarButtonRow, useStyles2 } from '@grafana/ui';
|
||||
import {
|
||||
Badge,
|
||||
Button,
|
||||
ButtonGroup,
|
||||
Dropdown,
|
||||
Icon,
|
||||
Menu,
|
||||
ToolbarButton,
|
||||
ToolbarButtonRow,
|
||||
useStyles2,
|
||||
} from '@grafana/ui';
|
||||
import { AppChromeUpdate } from 'app/core/components/AppChrome/AppChromeUpdate';
|
||||
import { NavToolbarSeparator } from 'app/core/components/AppChrome/NavToolbar/NavToolbarSeparator';
|
||||
import { contextSrv } from 'app/core/core';
|
||||
@ -51,7 +61,7 @@ export function ToolbarActions({ dashboard }: Props) {
|
||||
|
||||
const canSaveAs = contextSrv.hasEditPermissionInFolders;
|
||||
const toolbarActions: ToolbarAction[] = [];
|
||||
const buttonWithExtraMargin = useStyles2(getStyles);
|
||||
const styles = useStyles2(getStyles);
|
||||
const isEditingPanel = Boolean(editPanel);
|
||||
const isViewingPanel = Boolean(viewPanelScene);
|
||||
const isEditingLibraryPanel = useEditingLibraryPanel(editPanel);
|
||||
@ -88,6 +98,24 @@ export function ToolbarActions({ dashboard }: Props) {
|
||||
},
|
||||
});
|
||||
|
||||
if (meta.publicDashboardEnabled) {
|
||||
toolbarActions.push({
|
||||
group: 'icon-actions',
|
||||
condition: uid && Boolean(meta.canStar) && isShowingDashboard && !isEditing,
|
||||
render: () => {
|
||||
return (
|
||||
<Badge
|
||||
color="blue"
|
||||
text="Public"
|
||||
key="public-dashboard-button-badge"
|
||||
className={styles.publicBadge}
|
||||
data-testid={selectors.pages.Dashboard.DashNav.publicDashboardTag}
|
||||
/>
|
||||
);
|
||||
},
|
||||
});
|
||||
}
|
||||
|
||||
const isDevEnv = config.buildInfo.env === 'development';
|
||||
|
||||
toolbarActions.push({
|
||||
@ -280,7 +308,7 @@ export function ToolbarActions({ dashboard }: Props) {
|
||||
key="share-dashboard-button"
|
||||
tooltip={t('dashboard.toolbar.share', 'Share dashboard')}
|
||||
size="sm"
|
||||
className={buttonWithExtraMargin}
|
||||
className={styles.buttonWithExtraMargin}
|
||||
fill="outline"
|
||||
onClick={() => {
|
||||
DashboardInteractions.toolbarShareClick();
|
||||
@ -302,7 +330,7 @@ export function ToolbarActions({ dashboard }: Props) {
|
||||
}}
|
||||
tooltip="Enter edit mode"
|
||||
key="edit"
|
||||
className={buttonWithExtraMargin}
|
||||
className={styles.buttonWithExtraMargin}
|
||||
variant="primary"
|
||||
size="sm"
|
||||
>
|
||||
@ -427,7 +455,7 @@ export function ToolbarActions({ dashboard }: Props) {
|
||||
DashboardInteractions.toolbarSaveClick();
|
||||
dashboard.openSaveDrawer({});
|
||||
}}
|
||||
className={buttonWithExtraMargin}
|
||||
className={styles.buttonWithExtraMargin}
|
||||
tooltip="Save changes"
|
||||
key="save"
|
||||
size="sm"
|
||||
@ -446,7 +474,7 @@ export function ToolbarActions({ dashboard }: Props) {
|
||||
DashboardInteractions.toolbarSaveClick();
|
||||
dashboard.openSaveDrawer({ saveAsCopy: true });
|
||||
}}
|
||||
className={buttonWithExtraMargin}
|
||||
className={styles.buttonWithExtraMargin}
|
||||
tooltip="Save as copy"
|
||||
key="save"
|
||||
size="sm"
|
||||
@ -480,7 +508,7 @@ export function ToolbarActions({ dashboard }: Props) {
|
||||
);
|
||||
|
||||
return (
|
||||
<ButtonGroup className={buttonWithExtraMargin} key="save">
|
||||
<ButtonGroup className={styles.buttonWithExtraMargin} key="save">
|
||||
<Button
|
||||
onClick={() => {
|
||||
DashboardInteractions.toolbarSaveClick();
|
||||
@ -565,5 +593,14 @@ interface ToolbarAction {
|
||||
}
|
||||
|
||||
function getStyles(theme: GrafanaTheme2) {
|
||||
return css({ margin: theme.spacing(0, 0.5) });
|
||||
return {
|
||||
buttonWithExtraMargin: css({
|
||||
margin: theme.spacing(0, 0.5),
|
||||
}),
|
||||
publicBadge: css({
|
||||
color: 'grey',
|
||||
backgroundColor: 'transparent',
|
||||
border: '1px solid',
|
||||
}),
|
||||
};
|
||||
}
|
||||
|
Loading…
Reference in New Issue
Block a user