maxmustermann/kibana
1
0
Fork 0
Code Issues Pull requests Projects Releases Wiki Activity

status_page translations (#21918)

Browse source
This commit is contained in:
Aliaksandr Yankouski 2018-08-16 18:26:49 +03:00 committed by GitHub
parent e726a8d463
commit 994b00a8a8
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
8 changed files with 154 additions and 42 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

21
src/core_plugins/status_page/public/components/__snapshots__/server_status.test.js.snap
View file

@ -23,13 +23,20 @@ exports[`render 1`] = `
size="m"
>
<h2>
Kibana status is
<EuiBadge
color="secondary"
iconSide="left"
>
Green
</EuiBadge>
<FormattedMessage
defaultMessage="Kibana status is {kibanaStatus}"
id="statusPage.serverStatus.statusTitle"
values={
Object {
"kibanaStatus": <EuiBadge
color="secondary"
iconSide="left"
>
Green
</EuiBadge>,
}
}
/>
</h2>
</EuiTitle>
</EuiFlexItem>

49
src/core_plugins/status_page/public/components/render.js Normal file
View file

@ -0,0 +1,49 @@
/*
* Licensed to Elasticsearch B.V. under one or more contributor
* license agreements. See the NOTICE file distributed with
* this work for additional information regarding copyright
* ownership. Elasticsearch B.V. licenses this file to you under
* the Apache License, Version 2.0 (the "License"); you may
* not use this file except in compliance with the License.
* You may obtain a copy of the License at
*
* http://www.apache.org/licenses/LICENSE-2.0
*
* Unless required by applicable law or agreed to in writing,
* software distributed under the License is distributed on an
* "AS IS" BASIS, WITHOUT WARRANTIES OR CONDITIONS OF ANY
* KIND, either express or implied. See the License for the
* specific language governing permissions and limitations
* under the License.
*/
import React from 'react';
import { render, unmountComponentAtNode } from 'react-dom';
import { I18nProvider } from '@kbn/i18n/react';
import StatusApp from './status_app';
const STATUS_PAGE_DOM_NODE_ID = 'createStatusPageReact';
export function renderStatusPage(buildNum, buildSha) {
const node = document.getElementById(STATUS_PAGE_DOM_NODE_ID);
if (!node) {
return;
}
render(
<I18nProvider>
<StatusApp
buildNum={buildNum}
buildSha={buildSha}
/>
</I18nProvider>,
node,
);
}
export function destroyStatusPage() {
const node = document.getElementById(STATUS_PAGE_DOM_NODE_ID);
node && unmountComponentAtNode(node);
}

18
src/core_plugins/status_page/public/components/server_status.js
View file

@ -27,6 +27,7 @@ import {
EuiTitle,
EuiBadge,
} from '@elastic/eui';
import { FormattedMessage } from '@kbn/i18n/react';
const ServerState = ({
name,
@ -40,10 +41,17 @@ const ServerState = ({
<EuiFlexItem grow={false}>
<EuiTitle>
<h2>
{'Kibana status is '}
<EuiBadge color={serverState.uiColor}>
{serverState.title }
</EuiBadge>
<FormattedMessage
id="statusPage.serverStatus.statusTitle"
defaultMessage="Kibana status is {kibanaStatus}"
values={{
kibanaStatus: (
<EuiBadge color={serverState.uiColor}>
{serverState.title}
</EuiBadge>
),
}}
/>
</h2>
</EuiTitle>
</EuiFlexItem>
@ -62,4 +70,4 @@ ServerState.propTypes = {
serverState: StatePropType.isRequired
};
export default ServerState;
export default ServerState;

31
src/core_plugins/status_page/public/components/status_app.js
View file

@ -32,6 +32,7 @@ import {
EuiFlexGroup,
EuiFlexItem,
} from '@elastic/eui';
import { FormattedMessage } from '@kbn/i18n/react';
import MetricTiles from './metric_tiles';
import StatusTable from './status_table';
@ -75,7 +76,12 @@ class StatusApp extends Component {
if (fetchError) {
return (
<EuiText color="danger">An error occurred loading the status</EuiText>
<EuiText color="danger">
<FormattedMessage
id="statusPage.statusApp.loadingErrorText"
defaultMessage="An error occurred loading the status"
/>
</EuiText>
);
}
@ -101,7 +107,12 @@ class StatusApp extends Component {
<EuiFlexGroup alignItems="center" justifyContent="spaceBetween">
<EuiFlexItem grow={false}>
<EuiTitle size="s">
<h2>Plugin status</h2>
<h2>
<FormattedMessage
id="statusPage.statusApp.statusTitle"
defaultMessage="Plugin status"
/>
</h2>
</EuiTitle>
</EuiFlexItem>
<EuiFlexItem grow={false}>
@ -109,14 +120,26 @@ class StatusApp extends Component {
<EuiFlexItem grow={false}>
<EuiText size="s">
<p>
BUILD <strong>{ buildNum }</strong>
<FormattedMessage
id="statusPage.statusApp.statusActions.buildText"
defaultMessage="BUILD {buildNum}"
values={{
buildNum: (<strong>{ buildNum }</strong>),
}}
/>
</p>
</EuiText>
</EuiFlexItem>
<EuiFlexItem grow={false}>
<EuiText size="s">
<p>
COMMIT <strong>{ buildSha }</strong>
<FormattedMessage
id="statusPage.statusApp.statusActions.commitText"
defaultMessage="COMMIT {buildSha}"
values={{
buildSha: (<strong>{ buildSha }</strong>),
}}
/>
</p>
</EuiText>
</EuiFlexItem>

9
src/core_plugins/status_page/public/components/status_table.js
View file

@ -24,6 +24,7 @@ import {
EuiBasicTable,
EuiIcon,
} from '@elastic/eui';
import { i18n } from '@kbn/i18n';
class StatusTable extends Component {
@ -41,10 +42,14 @@ class StatusTable extends Component {
width: '32px'
}, {
field: 'id',
name: 'ID',
name: i18n.translate('statusPage.statusTable.columns.idHeader', {
defaultMessage: 'ID',
}),
}, {
field: 'state',
name: 'Status',
name: i18n.translate('statusPage.statusTable.columns.statusHeader', {
defaultMessage: 'Status',
}),
render: state => <span>{ state.message }</span>
}];

46
src/core_plugins/status_page/public/lib/load_status.js
View file

@ -21,6 +21,7 @@ import _ from 'lodash';
import chrome from 'ui/chrome';
import { notify } from 'ui/notify';
import { i18n } from '@kbn/i18n';
// Module-level error returned by notify.error
let errorNotif;
@ -35,15 +36,21 @@ function formatMetrics(data) {
return [
{
name: 'Heap total',
name: i18n.translate('statusPage.metricsTiles.columns.heapTotalHeader', {
defaultMessage: 'Heap total',
}),
value: _.get(data.metrics, 'process.memory.heap.size_limit'),
type: 'byte'
}, {
name: 'Heap used',
name: i18n.translate('statusPage.metricsTiles.columns.heapUsedHeader', {
defaultMessage: 'Heap used',
}),
value: _.get(data.metrics, 'process.memory.heap.used_in_bytes'),
type: 'byte'
}, {
name: 'Load',
name: i18n.translate('statusPage.metricsTiles.columns.loadHeader', {
defaultMessage: 'Load',
}),
value: [
_.get(data.metrics, 'os.load.1m'),
_.get(data.metrics, 'os.load.5m'),
@ -51,15 +58,21 @@ function formatMetrics(data) {
],
type: 'float'
}, {
name: 'Response time avg',
name: i18n.translate('statusPage.metricsTiles.columns.resTimeAvgHeader', {
defaultMessage: 'Response time avg',
}),
value: _.get(data.metrics, 'response_times.avg_in_millis'),
type: 'ms'
}, {
name: 'Response time max',
name: i18n.translate('statusPage.metricsTiles.columns.resTimeMaxHeader', {
defaultMessage: 'Response time max',
}),
value: _.get(data.metrics, 'response_times.max_in_millis'),
type: 'ms'
}, {
name: 'Requests per second',
name: i18n.translate('statusPage.metricsTiles.columns.requestsPerSecHeader', {
defaultMessage: 'Requests per second',
}),
value: _.get(data.metrics, 'requests.total') * 1000 / _.get(data.metrics, 'collection_interval_in_millis')
}
];
@ -110,13 +123,28 @@ async function loadStatus(fetchFn = fetchData) {
response = await fetchFn();
} catch (e) {
// If the fetch failed to connect, display an error and bail.
errorNotif = notify.error('Failed to request server status. Perhaps your server is down?');
const serverIsDownErrorMessage = i18n.translate(
'statusPage.loadStatus.serverIsDownErrorMessage',
{
defaultMessage: 'Failed to request server status. Perhaps your server is down?',
},
);
errorNotif = notify.error(serverIsDownErrorMessage);
return e;
}
if (response.status >= 400) {
// If the server does not respond with a successful status, display an error and bail.
errorNotif = notify.error(`Failed to request server status with status code ${response.status}`);
const serverStatusCodeErrorMessage = i18n.translate(
'statusPage.loadStatus.serverStatusCodeErrorMessage',
{
defaultMessage: 'Failed to request server status with status code {responseStatus}',
values: { responseStatus: response.status },
},
);
errorNotif = notify.error(serverStatusCodeErrorMessage);
return;
}
@ -130,4 +158,4 @@ async function loadStatus(fetchFn = fetchData) {
};
}
export default loadStatus;
export default loadStatus;

2
src/core_plugins/status_page/public/status_page.html
View file

@ -1 +1 @@
<status-app build-num="{{ui.buildInfo.num}}" build-sha="'{{ui.buildInfo.sha}}'" />
<div id="createStatusPageReact"></div>

20
src/core_plugins/status_page/public/status_page.js
View file

@ -20,23 +20,15 @@
import 'ui/autoload/styles';
import { uiModules } from 'ui/modules';
import chrome from 'ui/chrome';
import StatusApp from './components/status_app';
const app = uiModules.get('apps/status', []);
app.directive('statusApp', function (reactDirective) {
return reactDirective(StatusApp);
});
import { destroyStatusPage, renderStatusPage } from './components/render';
chrome
.setRootTemplate(require('plugins/status_page/status_page.html'))
.setRootController('ui', function ($http, buildNum, buildSha) {
const ui = this;
ui.buildInfo = {
num: buildNum,
sha: buildSha.substr(0, 8)
};
.setRootController('ui', function ($scope, buildNum, buildSha) {
$scope.$$postDigest(() => {
renderStatusPage(buildNum, buildSha.substr(0, 8));
$scope.$on('$destroy', destroyStatusPage);
});
});
uiModules.get('kibana')