IntenseWebs/grafana
3
0
Fork 0
mirror of https://github.com/grafana/grafana.git synced 2026-09-05 04:40:13 -05:00
Code Issues Packages Projects Releases Wiki Activity

PageLayouts: Updates dashboard section routes with navId (#52175)

Browse Source 
* First stab at new page layouts behind feature toggle

* Simplifying PageHeader

* Progress on a new model that can more easily support new and old page layouts

* Progress

* rename folder

* Progress

* Minor change

* fixes

* Fixing tests

* Make breadcrumbs work

* Add tests for old Page component

* Adding tests for new Page component and behavior

* fixing page header test

* Fixed test

* Moving user profile routes to navId

* PageLayouts: Updates dashboards routes with navId

* added missing navId

* AppChrome outside route

* Renaming folder

* Minor fix

* Updated

* Fixing StoragePage

* Updated

* Updating translation ids

* Updated snapshot

* update nav translation ids (yes this is confusing)

Co-authored-by: Ashley Harrison <ashley.harrison@grafana.com>
Co-authored-by: joshhunt <josh@trtr.co>
This commit is contained in:
Torkel Ödegaard
2022-07-20 17:26:52 +02:00
committed by GitHub
co-authored by Ashley Harrison joshhunt
parent 320262c3db
commit 77f7e8dafc
23 changed files with 80 additions and 218 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/app/features/folders/AccessControlFolderPermissions.tsx
+3 -3
View File
@@ -17,7 +17,7 @@ function mapStateToProps(state: StoreState, props: RouteProps) {
const uid = props.match.params.uid;
return {
uid: uid,
navModel: getNavModel(state.navIndex, `folder-permissions-${uid}`, getLoadingNav(1)),
pageNav: getNavModel(state.navIndex, `folder-permissions-${uid}`, getLoadingNav(1)),
};
}
@@ -28,7 +28,7 @@ const mapDispatchToProps = {
const connector = connect(mapStateToProps, mapDispatchToProps);
export type Props = ConnectedProps<typeof connector>;
export const AccessControlFolderPermissions = ({ uid, getFolderByUid, navModel }: Props) => {
export const AccessControlFolderPermissions = ({ uid, getFolderByUid, pageNav }: Props) => {
useEffect(() => {
getFolderByUid(uid);
}, [getFolderByUid, uid]);
@@ -36,7 +36,7 @@ export const AccessControlFolderPermissions = ({ uid, getFolderByUid, navModel }
const canSetPermissions = contextSrv.hasPermission(AccessControlAction.FoldersPermissionsWrite);
return (
<Page navModel={navModel}>
<Page navId="dashboards/browse" pageNav={pageNav.main}>
<Page.Contents>
<Permissions resource="folders" resourceId={uid} canSetPermissions={canSetPermissions} />
</Page.Contents>
public/app/features/folders/FolderAlerting.tsx
+2 -2
View File
@@ -20,12 +20,12 @@ const FolderAlerting = ({ match }: OwnProps) => {
const folder = useSelector((state: StoreState) => state.folder);
const uid = match.params.uid;
const navModel = getNavModel(navIndex, `folder-alerting-${uid}`, getLoadingNav(1));
const pageNav = getNavModel(navIndex, `folder-alerting-${uid}`, getLoadingNav(1));
const { loading } = useAsync(async () => dispatch(getFolderByUid(uid)), [getFolderByUid, uid]);
return (
<Page navModel={navModel}>
<Page navId="dashboards/browse" pageNav={pageNav.main}>
<Page.Contents isLoading={loading}>
<AlertsFolderView folder={folder} />
</Page.Contents>
public/app/features/folders/FolderLibraryPanelsPage.tsx
+3 -3
View File
@@ -19,7 +19,7 @@ export interface OwnProps extends GrafanaRouteComponentProps<{ uid: string }> {}
const mapStateToProps = (state: StoreState, props: OwnProps) => {
const uid = props.match.params.uid;
return {
navModel: getNavModel(state.navIndex, `folder-library-panels-${uid}`, getLoadingNav(1)),
pageNav: getNavModel(state.navIndex, `folder-library-panels-${uid}`, getLoadingNav(1)),
folderUid: uid,
folder: state.folder,
};
@@ -33,12 +33,12 @@ const connector = connect(mapStateToProps, mapDispatchToProps);
export type Props = OwnProps & ConnectedProps<typeof connector>;
export function FolderLibraryPanelsPage({ navModel, getFolderByUid, folderUid, folder }: Props): JSX.Element {
export function FolderLibraryPanelsPage({ pageNav, getFolderByUid, folderUid, folder }: Props): JSX.Element {
const { loading } = useAsync(async () => await getFolderByUid(folderUid), [getFolderByUid, folderUid]);
const [selected, setSelected] = useState<LibraryElementDTO | undefined>(undefined);
return (
<Page navModel={navModel}>
<Page navId="dashboards/browse" pageNav={pageNav.main}>
<Page.Contents isLoading={loading}>
<LibraryPanelsSearch
onClick={setSelected}
public/app/features/folders/FolderPermissions.tsx
+4 -4
View File
@@ -26,7 +26,7 @@ export interface OwnProps extends GrafanaRouteComponentProps<{ uid: string }> {}
const mapStateToProps = (state: StoreState, props: OwnProps) => {
const uid = props.match.params.uid;
return {
navModel: getNavModel(state.navIndex, `folder-permissions-${uid}`, getLoadingNav(1)),
pageNav: getNavModel(state.navIndex, `folder-permissions-${uid}`, getLoadingNav(1)),
folderUid: uid,
folder: state.folder,
};
@@ -83,12 +83,12 @@ export class FolderPermissions extends PureComponent<Props, State> {
};
render() {
const { navModel, folder } = this.props;
const { pageNav, folder } = this.props;
const { isAdding } = this.state;
if (folder.id === 0) {
return (
<Page navModel={navModel}>
<Page navId="dashboards/browse" pageNav={pageNav.main}>
<Page.Contents isLoading={true}>
<span />
</Page.Contents>
@@ -99,7 +99,7 @@ export class FolderPermissions extends PureComponent<Props, State> {
const folderInfo = { title: folder.title, url: folder.url, id: folder.id };
return (
<Page navModel={navModel}>
<Page navId="browse" pageNav={pageNav.main}>
<Page.Contents>
<div className="page-action-bar">
<h3 className="page-sub-heading">Folder Permissions</h3>
public/app/features/folders/FolderSettingsPage.test.tsx
+1 -1
View File
@@ -11,7 +11,7 @@ import { setFolderTitle } from './state/reducers';
const setup = (propOverrides?: object) => {
const props: Props = {
...getRouteComponentProps(),
navModel: {} as NavModel,
pageNav: {} as NavModel,
folderUid: '1234',
folder: {
id: 0,
public/app/features/folders/FolderSettingsPage.tsx
+3 -3
View File
@@ -20,7 +20,7 @@ export interface OwnProps extends GrafanaRouteComponentProps<{ uid: string }> {}
const mapStateToProps = (state: StoreState, props: OwnProps) => {
const uid = props.match.params.uid;
return {
navModel: getNavModel(state.navIndex, `folder-settings-${uid}`, getLoadingNav(2)),
pageNav: getNavModel(state.navIndex, `folder-settings-${uid}`, getLoadingNav(2)),
folderUid: uid,
folder: state.folder,
};
@@ -84,10 +84,10 @@ export class FolderSettingsPage extends PureComponent<Props, State> {
};
render() {
const { navModel, folder } = this.props;
const { pageNav, folder } = this.props;
return (
<Page navModel={navModel}>
<Page navId="dashboards/browse" pageNav={pageNav.main}>
<Page.Contents isLoading={this.state.isLoading}>
<h3 className="page-sub-heading">Folder settings</h3>
public/app/features/folders/__snapshots__/FolderSettingsPage.test.tsx.snap
+2 -2
View File
@@ -2,7 +2,7 @@
exports[`Render should enable save button 1`] = `
<OldPage
navModel={Object {}}
navId="dashboards/browse"
>
<PageContents
isLoading={false}
@@ -59,7 +59,7 @@ exports[`Render should enable save button 1`] = `
exports[`Render should render component 1`] = `
<OldPage
navModel={Object {}}
navId="dashboards/browse"
>
<PageContents
isLoading={false}
public/app/features/folders/components/NewDashboardsFolder.tsx
+2 -8
View File
@@ -3,21 +3,15 @@ import { connect, ConnectedProps } from 'react-redux';
import { Button, Input, Form, Field } from '@grafana/ui';
import { Page } from 'app/core/components/Page/Page';
import { getNavModel } from 'app/core/selectors/navModel';
import { StoreState } from 'app/types';
import { validationSrv } from '../../manage-dashboards/services/ValidationSrv';
import { createNewFolder } from '../state/actions';
const mapStateToProps = (state: StoreState) => ({
navModel: getNavModel(state.navIndex, 'manage-dashboards'),
});
const mapDispatchToProps = {
createNewFolder,
};
const connector = connect(mapStateToProps, mapDispatchToProps);
const connector = connect(null, mapDispatchToProps);
interface OwnProps {}
@@ -47,7 +41,7 @@ export class NewDashboardsFolder extends PureComponent<Props> {
render() {
return (
<Page navModel={this.props.navModel}>
<Page navId="dashboards/folder/new">
<Page.Contents>
<h3>New dashboard folder</h3>
<Form defaultValues={initialFormModel} onSubmit={this.onSubmit}>