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

Update a few more pages to use navId instead of navModel from store (#55342)

Browse Source
This commit is contained in:
Torkel Ödegaard 2022-09-19 13:21:41 +02:00 committed by GitHub
parent 5efeff4890
commit 2916b483eb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 60 additions and 97 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

131
public/app/core/components/ErrorPage/ErrorPage.tsx
View File

@ -1,92 +1,71 @@
import React, { PureComponent } from 'react'; import React from 'react';
import { connect, MapStateToProps } from 'react-redux';
import { NavModel } from '@grafana/data';
import { config } from '@grafana/runtime'; import { config } from '@grafana/runtime';
import { Icon } from '@grafana/ui'; import { Icon } from '@grafana/ui';
import { getNavModel } from 'app/core/selectors/navModel';
import { StoreState } from 'app/types';
import { Page } from '../Page/Page'; import { Page } from '../Page/Page';
interface ConnectedProps { export function ErrorPage() {
navModel: NavModel; return (
} <Page navId="not-found">
<Page.Contents>
interface OwnProps {} <div className="page-container page-body">
<div className="panel-container error-container">
type Props = ConnectedProps; <div className="error-column graph-box">
<div className="error-row">
export class ErrorPage extends PureComponent<Props> { <div className="error-column error-space-between graph-percentage">
render() { <p>100%</p>
const { navModel } = this.props; <p>80%</p>
return ( <p>60%</p>
<Page navModel={navModel}> <p>40%</p>
<Page.Contents> <p>20%</p>
<div className="page-container page-body"> <p>0%</p>
<div className="panel-container error-container"> </div>
<div className="error-column graph-box"> <div className="error-column image-box">
<div className="error-row"> <img src="public/img/graph404.svg" width="100%" alt="graph" />
<div className="error-column error-space-between graph-percentage"> <div className="error-row error-space-between">
<p>100%</p> <p className="graph-text">Then</p>
<p>80%</p> <p className="graph-text">Now</p>
<p>60%</p>
<p>40%</p>
<p>20%</p>
<p>0%</p>
</div>
<div className="error-column image-box">
<img src="public/img/graph404.svg" width="100%" alt="graph" />
<div className="error-row error-space-between">
<p className="graph-text">Then</p>
<p className="graph-text">Now</p>
</div>
</div> </div>
</div> </div>
</div> </div>
<div className="error-column info-box"> </div>
<div className="error-row current-box"> <div className="error-column info-box">
<p className="current-text">current</p> <div className="error-row current-box">
</div> <p className="current-text">current</p>
<div className="error-row" style={{ flex: 1 }}> </div>
<Icon name="minus-circle" className="error-minus" /> <div className="error-row" style={{ flex: 1 }}>
<div className="error-column error-space-between error-full-width"> <Icon name="minus-circle" className="error-minus" />
<div className="error-row error-space-between"> <div className="error-column error-space-between error-full-width">
<p>Chances you are on the page you are looking for.</p> <div className="error-row error-space-between">
<p className="left-margin">0%</p> <p>Chances you are on the page you are looking for.</p>
</div> <p className="left-margin">0%</p>
<div> </div>
<h3>Sorry for the inconvenience</h3> <div>
<p> <h3>Sorry for the inconvenience</h3>
Please go back to your{' '} <p>
<a href={config.appSubUrl} className="error-link"> Please go back to your{' '}
home dashboard <a href={config.appSubUrl} className="error-link">
</a>{' '} home dashboard
and try again. </a>{' '}
</p> and try again.
<p> </p>
If the error persists, seek help on the{' '} <p>
<a href="https://community.grafana.com" target="_blank" rel="noreferrer" className="error-link"> If the error persists, seek help on the{' '}
community site <a href="https://community.grafana.com" target="_blank" rel="noreferrer" className="error-link">
</a> community site
. </a>
</p> .
</div> </p>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</div> </div>
</Page.Contents> </div>
</Page> </Page.Contents>
); </Page>
} );
} }
const mapStateToProps: MapStateToProps<ConnectedProps, OwnProps, StoreState> = (state) => { export default ErrorPage;
return {
navModel: getNavModel(state.navIndex, 'not-found'),
};
};
export default connect(mapStateToProps)(ErrorPage);

18
public/app/features/admin/AdminSettings.tsx
View File

@ -1,27 +1,19 @@
import React from 'react'; import React from 'react';
import { connect } from 'react-redux';
import { useAsync } from 'react-use'; import { useAsync } from 'react-use';
import { NavModel } from '@grafana/data';
import { getBackendSrv } from '@grafana/runtime'; import { getBackendSrv } from '@grafana/runtime';
import { Page } from 'app/core/components/Page/Page'; import { Page } from 'app/core/components/Page/Page';
import { getNavModel } from 'app/core/selectors/navModel';
import { StoreState } from 'app/types';
type Settings = { [key: string]: { [key: string]: string } }; type Settings = { [key: string]: { [key: string]: string } };
interface Props { function AdminSettings() {
navModel: NavModel;
}
function AdminSettings({ navModel }: Props) {
const { loading, value: settings } = useAsync( const { loading, value: settings } = useAsync(
() => getBackendSrv().get('/api/admin/settings') as Promise<Settings>, () => getBackendSrv().get('/api/admin/settings') as Promise<Settings>,
[] []
); );
return ( return (
<Page navModel={navModel}> <Page navId="server-settings">
<Page.Contents isLoading={loading}> <Page.Contents isLoading={loading}>
<div className="grafana-info-box span8" style={{ margin: '20px 0 25px 0' }}> <div className="grafana-info-box span8" style={{ margin: '20px 0 25px 0' }}>
These system settings are defined in grafana.ini or custom.ini (or overridden in ENV variables). To change These system settings are defined in grafana.ini or custom.ini (or overridden in ENV variables). To change
@ -53,8 +45,4 @@ function AdminSettings({ navModel }: Props) {
); );
} }
const mapStateToProps = (state: StoreState) => ({ export default AdminSettings;
navModel: getNavModel(state.navIndex, 'server-settings'),
});
export default connect(mapStateToProps)(AdminSettings);

8
public/app/features/alerting/EditNotificationChannelPage.tsx
View File

@ -1,13 +1,11 @@
import React, { PureComponent } from 'react'; import React, { PureComponent } from 'react';
import { MapDispatchToProps, MapStateToProps } from 'react-redux'; import { MapDispatchToProps, MapStateToProps } from 'react-redux';
import { NavModel } from '@grafana/data';
import { config } from '@grafana/runtime'; import { config } from '@grafana/runtime';
import { Form, Spinner } from '@grafana/ui'; import { Form, Spinner } from '@grafana/ui';
import { Page } from 'app/core/components/Page/Page'; import { Page } from 'app/core/components/Page/Page';
import { connectWithCleanUp } from 'app/core/components/connectWithCleanUp'; import { connectWithCleanUp } from 'app/core/components/connectWithCleanUp';
import { GrafanaRouteComponentProps } from 'app/core/navigation/types'; import { GrafanaRouteComponentProps } from 'app/core/navigation/types';
import { getNavModel } from 'app/core/selectors/navModel';
import { NotificationChannelType, NotificationChannelDTO, StoreState } from 'app/types'; import { NotificationChannelType, NotificationChannelDTO, StoreState } from 'app/types';
import { NotificationChannelForm } from './components/NotificationChannelForm'; import { NotificationChannelForm } from './components/NotificationChannelForm';
@ -18,7 +16,6 @@ import { mapChannelsToSelectableValue, transformSubmitData, transformTestData }
interface OwnProps extends GrafanaRouteComponentProps<{ id: string }> {} interface OwnProps extends GrafanaRouteComponentProps<{ id: string }> {}
interface ConnectedProps { interface ConnectedProps {
navModel: NavModel;
notificationChannel: any; notificationChannel: any;
notificationChannelTypes: NotificationChannelType[]; notificationChannelTypes: NotificationChannelType[];
} }
@ -70,10 +67,10 @@ export class EditNotificationChannelPage extends PureComponent<Props> {
}; };
render() { render() {
const { navModel, notificationChannel, notificationChannelTypes } = this.props; const { notificationChannel, notificationChannelTypes } = this.props;
return ( return (
<Page navModel={navModel}> <Page navId="channels">
<Page.Contents> <Page.Contents>
<h2 className="page-sub-heading">Edit notification channel</h2> <h2 className="page-sub-heading">Edit notification channel</h2>
{notificationChannel && notificationChannel.id > 0 ? ( {notificationChannel && notificationChannel.id > 0 ? (
@ -119,7 +116,6 @@ export class EditNotificationChannelPage extends PureComponent<Props> {
const mapStateToProps: MapStateToProps<ConnectedProps, OwnProps, StoreState> = (state) => { const mapStateToProps: MapStateToProps<ConnectedProps, OwnProps, StoreState> = (state) => {
return { return {
navModel: getNavModel(state.navIndex, 'channels'),
notificationChannel: state.notificationChannel.notificationChannel, notificationChannel: state.notificationChannel.notificationChannel,
notificationChannelTypes: state.notificationChannel.notificationChannelTypes, notificationChannelTypes: state.notificationChannel.notificationChannelTypes,
}; };