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

PageNotFound: G10 Redesign (#66909)

Browse Source 
* PageNotFound: G10 Redesign

* Make into a reusable component so we can have a more specific version for dashboards

* Make graphic abit smaller
This commit is contained in:
Torkel Ödegaard
2023-04-28 08:18:14 +02:00
committed by GitHub
parent ea536411f1
commit 43def489f4
7 changed files with 248 additions and 129 deletions
Download Patch File Download Diff File Expand all files Collapse all files
public/app/features/dashboard/containers/DashboardPage.tsx
+49 -47
View File
@@ -19,8 +19,8 @@ import { selectors } from '@grafana/e2e-selectors';
import { config, locationService } from '@grafana/runtime';
import { Icon, Themeable2, withTheme2 } from '@grafana/ui';
import { notifyApp } from 'app/core/actions';
import { ErrorPage } from 'app/core/components/ErrorPage/ErrorPage';
import { Page } from 'app/core/components/Page/Page';
import { EntityNotFound } from 'app/core/components/PageNotFound/EntityNotFound';
import { GrafanaContext, GrafanaContextType } from 'app/core/context/GrafanaContext';
import { createErrorNotification } from 'app/core/copy/appNotification';
import { getKioskMode } from 'app/core/navigation/kiosk';
@@ -429,6 +429,14 @@ export class UnthemedDashboardPage extends PureComponent<Props, State> {
'page-hidden': Boolean(queryParams.editview || editPanel),
});
if (dashboard.meta.dashboardNotFound) {
return (
<Page navId="dashboards/browse" layout={PageLayoutType.Canvas} pageNav={{ text: 'Not found' }}>
<EntityNotFound entity="Dashboard" />
</Page>
);
}
return (
<>
<Page
@@ -442,53 +450,47 @@ export class UnthemedDashboardPage extends PureComponent<Props, State> {
>
<DashboardPrompt dashboard={dashboard} />
{initError && <DashboardFailed />}
{dashboard.meta.dashboardNotFound ? (
<ErrorPage />
) : (
<>
{showSubMenu && (
<section aria-label={selectors.pages.Dashboard.SubMenu.submenu}>
<SubMenu dashboard={dashboard} annotations={dashboard.annotations.list} links={dashboard.links} />
</section>
)}
{config.featureToggles.editPanelCSVDragAndDrop ? (
<DropZone
onDrop={this.onFileDrop}
accept={DFImport.acceptedFiles}
maxSize={DFImport.maxFileSize}
noClick={true}
>
{({ getRootProps, isDragActive }) => {
const styles = getStyles(this.props.theme, isDragActive);
return (
<div {...getRootProps({ className: styles.dropZone })}>
<div className={styles.dropOverlay}>
<div className={styles.dropHint}>
<Icon name="upload" size="xxxl"></Icon>
<h3>Create tables from spreadsheets</h3>
</div>
</div>
<DashboardGrid
dashboard={dashboard}
isEditable={!!dashboard.meta.canEdit}
viewPanel={viewPanel}
editPanel={editPanel}
/>
</div>
);
}}
</DropZone>
) : (
<DashboardGrid
dashboard={dashboard}
isEditable={!!dashboard.meta.canEdit}
viewPanel={viewPanel}
editPanel={editPanel}
/>
)}
{inspectPanel && <PanelInspector dashboard={dashboard} panel={inspectPanel} />}
</>
{showSubMenu && (
<section aria-label={selectors.pages.Dashboard.SubMenu.submenu}>
<SubMenu dashboard={dashboard} annotations={dashboard.annotations.list} links={dashboard.links} />
</section>
)}
{config.featureToggles.editPanelCSVDragAndDrop ? (
<DropZone
onDrop={this.onFileDrop}
accept={DFImport.acceptedFiles}
maxSize={DFImport.maxFileSize}
noClick={true}
>
{({ getRootProps, isDragActive }) => {
const styles = getStyles(this.props.theme, isDragActive);
return (
<div {...getRootProps({ className: styles.dropZone })}>
<div className={styles.dropOverlay}>
<div className={styles.dropHint}>
<Icon name="upload" size="xxxl"></Icon>
<h3>Create tables from spreadsheets</h3>
</div>
</div>
<DashboardGrid
dashboard={dashboard}
isEditable={!!dashboard.meta.canEdit}
viewPanel={viewPanel}
editPanel={editPanel}
/>
</div>
);
}}
</DropZone>
) : (
<DashboardGrid
dashboard={dashboard}
isEditable={!!dashboard.meta.canEdit}
viewPanel={viewPanel}
editPanel={editPanel}
/>
)}
{inspectPanel && <PanelInspector dashboard={dashboard} panel={inspectPanel} />}
</Page>
{editPanel && (
<PanelEditor