Skip to content

N
nexpie-grafana-theme
Commit ab62a09f by Johannes Schill
Options

chore: Fix typings and add Page-component to ServerStats #14762

parent d54c4173
Showing with 242 additions and 101 deletions
public/app/features/admin/ServerStats.tsx
......@@ -4,7 +4,7 @@ import { connect } from 'react-redux';
import { NavModel, StoreState } from 'app/types';
import { getNavModel } from 'app/core/selectors/navModel';
import { getServerStats, ServerStat } from './state/apis';
import PageHeader from 'app/core/components/PageHeader/PageHeader';
import Page from 'app/core/components/Page/Page';
interface Props {
navModel: NavModel;
......@@ -13,21 +13,24 @@ interface Props {
interface State {
stats: ServerStat[];
isLoading: boolean;
}
export class ServerStats extends PureComponent<Props, State> {
constructor(props) {
constructor(props: Props) {
super(props);
this.state = {
stats: [],
isLoading: false
};
}
async componentDidMount() {
try {
this.setState({ isLoading: true });
const stats = await this.props.getServerStats();
this.setState({ stats });
this.setState({ stats, isLoading: false });
} catch (error) {
console.error(error);
}
......@@ -35,12 +38,11 @@ export class ServerStats extends PureComponent<Props, State> {
render() {
const { navModel } = this.props;
const { stats } = this.state;
const { stats, isLoading } = this.state;
return (
<div>
<PageHeader model={navModel} />
<div className="page-container page-body">
<Page navModel={navModel}>
<Page.Contents isLoading={isLoading}>
<table className="filter-table form-inline">
<thead>
<tr>
......@@ -50,8 +52,8 @@ export class ServerStats extends PureComponent<Props, State> {
</thead>
<tbody>{stats.map(StatItem)}</tbody>
</table>
</div>
</div>
</Page.Contents>
</Page>
);
}
}
......
public/app/features/admin/__snapshots__/ServerStats.test.tsx.snap
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`ServerStats Should render table with stats 1`] = `
<div>
<div
className="page-scrollbar-wrapper"
>
<div
className="page-header-canvas"
className="custom-scrollbars"
style={
Object {
"height": "auto",
"maxHeight": "100%",
"minHeight": "100%",
"overflow": "hidden",
"position": "relative",
"width": "100%",
}
}
>
<div
className="page-container"
className="view"
style={
Object {
"WebkitOverflowScrolling": "touch",
"bottom": undefined,
"left": undefined,
"marginBottom": 0,
"marginRight": 0,
"maxHeight": "calc(100% + 0px)",
"minHeight": "calc(100% + 0px)",
"overflow": "scroll",
"position": "relative",
"right": undefined,
"top": undefined,
}
}
>
<div
className="page-header"
className="page-scrollbar-content"
>
<div
className="page-header__inner"
className="page-header-canvas"
>
<span
className="page-header__logo"
>
<i
className="page-header__icon fa fa-fw fa-warning"
/>
</span>
<div
className="page-header__info-block"
className="page-container"
>
<h1
className="page-header__title"
>
Admin
</h1>
<div
className="page-header__sub-title"
className="page-header"
>
subTitle
<div
className="page-header__inner"
>
<span
className="page-header__logo"
>
<i
className="page-header__icon fa fa-fw fa-warning"
/>
</span>
<div
className="page-header__info-block"
>
<h1
className="page-header__title"
>
Admin
</h1>
<div
className="page-header__sub-title"
>
subTitle
</div>
</div>
</div>
<nav>
<div
className="gf-form-select-wrapper width-20 page-header__select-nav"
>
<label
className="gf-form-select-icon icon"
htmlFor="page-header-select-nav"
/>
<select
className="gf-select-nav gf-form-input"
id="page-header-select-nav"
onChange={[Function]}
value="Admin"
>
<option
value="Admin"
>
Admin
</option>
</select>
</div>
<ul
className="gf-tabs page-header__tabs"
>
<li
className="gf-tabs-item"
>
<a
className="gf-tabs-link active"
href="Admin"
>
<i
className="icon"
/>
Admin
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<nav>
<div
className="page-container page-body"
>
<table
className="filter-table form-inline"
>
<thead>
<tr>
<th>
Name
</th>
<th>
Value
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
Total dashboards
</td>
<td>
10
</td>
</tr>
<tr>
<td>
Total Users
</td>
<td>
1
</td>
</tr>
</tbody>
</table>
</div>
<footer
className="footer"
>
<div
className="gf-form-select-wrapper width-20 page-header__select-nav"
className="text-center"
>
<label
className="gf-form-select-icon icon"
htmlFor="page-header-select-nav"
/>
<select
className="gf-select-nav gf-form-input"
id="page-header-select-nav"
onChange={[Function]}
value="Admin"
>
<option
value="Admin"
>
Admin
</option>
</select>
<ul>
<li>
<a
href="http://docs.grafana.org"
target="_blank"
>
<i
className="fa fa-file-code-o"
/>
Docs
</a>
</li>
<li>
<a
href="https://grafana.com/services/support"
target="_blank"
>
<i
className="fa fa-support"
/>
Support Plans
</a>
</li>
<li>
<a
href="https://community.grafana.com/"
target="_blank"
>
<i
className="fa fa-comments-o"
/>
Community
</a>
</li>
<li>
<a
href="https://grafana.com"
target="_blank"
>
Grafana
</a>
<span>
v
v1.0
(commit:
1
)
</span>
</li>
</ul>
</div>
<ul
className="gf-tabs page-header__tabs"
>
<li
className="gf-tabs-item"
>
<a
className="gf-tabs-link active"
href="Admin"
>
<i
className="icon"
/>
Admin
</a>
</li>
</ul>
</nav>
</footer>
</div>
</div>
</div>
<div
className="page-container page-body"
>
<table
className="filter-table form-inline"
<div
className="track-horizontal"
style={
Object {
"display": "none",
"height": 6,
"position": "absolute",
}
}
>
<thead>
<tr>
<th>
Name
</th>
<th>
Value
</th>
</tr>
</thead>
<tbody>
<tr>
<td>
Total dashboards
</td>
<td>
10
</td>
</tr>
<tr>
<td>
Total Users
</td>
<td>
1
</td>
</tr>
</tbody>
</table>
<div
className="thumb-horizontal"
style={
Object {
"display": "block",
"height": "100%",
"position": "relative",
}
}
/>
</div>
<div
className="track-vertical"
style={
Object {
"display": "none",
"position": "absolute",
"width": 6,
}
}
>
<div
className="thumb-vertical"
style={
Object {
"display": "block",
"position": "relative",
"width": "100%",
}
}
/>
</div>
</div>
</div>
`;
public/app/features/alerting/AlertRuleList.tsx
......@@ -2,7 +2,6 @@ import React, { PureComponent } from 'react';
import { hot } from 'react-hot-loader';
import { connect } from 'react-redux';
import Page from 'app/core/components/Page/Page';
// import PageHeader from 'app/core/components/PageHeader/PageHeader';
import AlertRuleItem from './AlertRuleItem';
import appEvents from 'app/core/app_events';
import { updateLocation } from 'app/core/actions';
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment