[Stack Monitoring] ES Overview fix completed recoveries section (#114179)
* fix completed recoveries section * fix type * fix type Co-authored-by: Kibana Machine <42973632+kibanamachine@users.noreply.github.com>
This commit is contained in:
parent
c9e3e0e9b5
commit
a054749c7a
|
@ -10,7 +10,8 @@ import { find } from 'lodash';
|
|||
import { ElasticsearchTemplate } from './elasticsearch_template';
|
||||
import { useKibana } from '../../../../../../../src/plugins/kibana_react/public';
|
||||
import { GlobalStateContext } from '../../contexts/global_state_context';
|
||||
import { ElasticsearchOverview } from '../../../components/elasticsearch';
|
||||
// @ts-ignore
|
||||
import { ElasticsearchOverviewReact } from '../../../components/elasticsearch';
|
||||
import { ComponentProps } from '../../route_init';
|
||||
import { useCharts } from '../../hooks/use_charts';
|
||||
import { BreadcrumbContainer } from '../../hooks/use_breadcrumbs';
|
||||
|
@ -78,7 +79,7 @@ export const ElasticsearchOverviewPage: React.FC<ComponentProps> = ({ clusters }
|
|||
const shardActivityData = shardActivity && filterShardActivityData(shardActivity); // no filter on data = null
|
||||
|
||||
return (
|
||||
<ElasticsearchOverview
|
||||
<ElasticsearchOverviewReact
|
||||
clusterStatus={clusterStatus}
|
||||
metrics={metrics}
|
||||
logs={logs}
|
||||
|
|
|
@ -6,6 +6,7 @@
|
|||
*/
|
||||
|
||||
export { ElasticsearchOverview } from './overview';
|
||||
export { ElasticsearchOverviewReact } from './overview';
|
||||
export { ElasticsearchNodes } from './nodes';
|
||||
export { NodeReact } from './node';
|
||||
export { ElasticsearchIndices } from './indices';
|
||||
|
|
|
@ -6,3 +6,5 @@
|
|||
*/
|
||||
|
||||
export { ElasticsearchOverview } from './overview';
|
||||
// @ts-ignore
|
||||
export { ElasticsearchOverviewReact } from './overview_react';
|
||||
|
|
|
@ -0,0 +1,66 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License
|
||||
* 2.0; you may not use this file except in compliance with the Elastic License
|
||||
* 2.0.
|
||||
*/
|
||||
|
||||
import React from 'react';
|
||||
import { ClusterStatus } from '../cluster_status';
|
||||
import { ShardActivityReact } from '../shard_activity';
|
||||
import { MonitoringTimeseriesContainer } from '../../chart';
|
||||
import {
|
||||
EuiPage,
|
||||
EuiFlexGrid,
|
||||
EuiFlexItem,
|
||||
EuiPanel,
|
||||
EuiSpacer,
|
||||
EuiPageBody,
|
||||
EuiPageContent,
|
||||
} from '@elastic/eui';
|
||||
import { Logs } from '../../logs/logs';
|
||||
|
||||
export function ElasticsearchOverviewReact({
|
||||
clusterStatus,
|
||||
metrics,
|
||||
logs,
|
||||
cluster,
|
||||
shardActivity,
|
||||
...props
|
||||
}) {
|
||||
const metricsToShow = [
|
||||
metrics.cluster_search_request_rate,
|
||||
metrics.cluster_query_latency,
|
||||
metrics.cluster_index_request_rate,
|
||||
metrics.cluster_index_latency,
|
||||
];
|
||||
|
||||
return (
|
||||
<EuiPage>
|
||||
<EuiPageBody>
|
||||
<EuiPanel>
|
||||
<ClusterStatus stats={clusterStatus} />
|
||||
</EuiPanel>
|
||||
<EuiSpacer size="m" />
|
||||
<EuiPageContent>
|
||||
<EuiFlexGrid columns={2} gutterSize="s">
|
||||
{metricsToShow.map((metric, index) => (
|
||||
<EuiFlexItem key={index}>
|
||||
<MonitoringTimeseriesContainer series={metric} {...props} />
|
||||
<EuiSpacer />
|
||||
</EuiFlexItem>
|
||||
))}
|
||||
</EuiFlexGrid>
|
||||
</EuiPageContent>
|
||||
<EuiSpacer size="m" />
|
||||
<EuiPanel>
|
||||
<Logs logs={logs} clusterUuid={cluster.cluster_uuid} />
|
||||
</EuiPanel>
|
||||
<EuiSpacer size="m" />
|
||||
<EuiPanel>
|
||||
<ShardActivityReact data={shardActivity} {...props} />
|
||||
</EuiPanel>
|
||||
</EuiPageBody>
|
||||
</EuiPage>
|
||||
);
|
||||
}
|
|
@ -6,3 +6,4 @@
|
|||
*/
|
||||
|
||||
export { ShardActivity } from './shard_activity';
|
||||
export { ShardActivityReact } from './shard_activity_react';
|
||||
|
|
|
@ -37,18 +37,26 @@ export const parseProps = (props) => {
|
|||
target,
|
||||
translog,
|
||||
type,
|
||||
timezone,
|
||||
} = props;
|
||||
|
||||
const { files, size } = index;
|
||||
const injector = Legacy.shims.getAngularInjector();
|
||||
const timezone = injector.get('config').get('dateFormat:tz');
|
||||
|
||||
let thisTimezone;
|
||||
// react version passes timezone while Angular uses injector
|
||||
if (!timezone) {
|
||||
const injector = Legacy.shims.getAngularInjector();
|
||||
thisTimezone = injector.get('config').get('dateFormat:tz');
|
||||
} else {
|
||||
thisTimezone = timezone;
|
||||
}
|
||||
|
||||
return {
|
||||
name: indexName || index.name,
|
||||
shard: `${id} / ${isPrimary ? 'Primary' : 'Replica'}`,
|
||||
relocationType: type === 'PRIMARY_RELOCATION' ? 'Primary Relocation' : normalizeString(type),
|
||||
stage: normalizeString(stage),
|
||||
startTime: formatDateTimeLocal(startTimeInMillis, timezone),
|
||||
startTime: formatDateTimeLocal(startTimeInMillis, thisTimezone),
|
||||
totalTime: formatMetric(Math.floor(totalTimeInMillis / 1000), '00:00:00'),
|
||||
isCopiedFromPrimary: !isPrimary || type === 'PRIMARY_RELOCATION',
|
||||
sourceName: source.name === undefined ? 'n/a' : source.name,
|
||||
|
|
|
@ -0,0 +1,156 @@
|
|||
/*
|
||||
* Copyright Elasticsearch B.V. and/or licensed to Elasticsearch B.V. under one
|
||||
* or more contributor license agreements. Licensed under the Elastic License
|
||||
* 2.0; you may not use this file except in compliance with the Elastic License
|
||||
* 2.0.
|
||||
*/
|
||||
|
||||
import React, { Fragment } from 'react';
|
||||
import { EuiText, EuiTitle, EuiLink, EuiSpacer, EuiSwitch } from '@elastic/eui';
|
||||
import { EuiMonitoringTable } from '../../table';
|
||||
import { RecoveryIndex } from './recovery_index';
|
||||
import { TotalTime } from './total_time';
|
||||
import { SourceDestination } from './source_destination';
|
||||
import { FilesProgress, BytesProgress, TranslogProgress } from './progress';
|
||||
import { parseProps } from './parse_props';
|
||||
import { i18n } from '@kbn/i18n';
|
||||
import { FormattedMessage } from '@kbn/i18n/react';
|
||||
import { useKibana } from '../../../../../../../src/plugins/kibana_react/public';
|
||||
|
||||
const columns = [
|
||||
{
|
||||
name: i18n.translate('xpack.monitoring.kibana.shardActivity.indexTitle', {
|
||||
defaultMessage: 'Index',
|
||||
}),
|
||||
field: 'name',
|
||||
render: (_name, shard) => <RecoveryIndex {...shard} />,
|
||||
},
|
||||
{
|
||||
name: i18n.translate('xpack.monitoring.kibana.shardActivity.stageTitle', {
|
||||
defaultMessage: 'Stage',
|
||||
}),
|
||||
field: 'stage',
|
||||
},
|
||||
{
|
||||
name: i18n.translate('xpack.monitoring.kibana.shardActivity.totalTimeTitle', {
|
||||
defaultMessage: 'Total Time',
|
||||
}),
|
||||
field: null,
|
||||
render: (shard) => <TotalTime {...shard} />,
|
||||
},
|
||||
{
|
||||
name: i18n.translate('xpack.monitoring.kibana.shardActivity.sourceDestinationTitle', {
|
||||
defaultMessage: 'Source / Destination',
|
||||
}),
|
||||
field: null,
|
||||
render: (shard) => <SourceDestination {...shard} />,
|
||||
},
|
||||
{
|
||||
name: i18n.translate('xpack.monitoring.kibana.shardActivity.filesTitle', {
|
||||
defaultMessage: 'Files',
|
||||
}),
|
||||
field: null,
|
||||
render: (shard) => <FilesProgress {...shard} />,
|
||||
},
|
||||
{
|
||||
name: i18n.translate('xpack.monitoring.kibana.shardActivity.bytesTitle', {
|
||||
defaultMessage: 'Bytes',
|
||||
}),
|
||||
field: null,
|
||||
render: (shard) => <BytesProgress {...shard} />,
|
||||
},
|
||||
{
|
||||
name: i18n.translate('xpack.monitoring.kibana.shardActivity.translogTitle', {
|
||||
defaultMessage: 'Translog',
|
||||
}),
|
||||
field: null,
|
||||
render: (shard) => <TranslogProgress {...shard} />,
|
||||
},
|
||||
];
|
||||
|
||||
export const ShardActivityReact = (props) => {
|
||||
const {
|
||||
data: rawData,
|
||||
sorting,
|
||||
pagination,
|
||||
onTableChange,
|
||||
toggleShardActivityHistory,
|
||||
showShardActivityHistory,
|
||||
} = props;
|
||||
const { services } = useKibana();
|
||||
const timezone = services.uiSettings?.get('dateFormat:tz');
|
||||
const getNoDataMessage = () => {
|
||||
if (showShardActivityHistory) {
|
||||
return i18n.translate('xpack.monitoring.elasticsearch.shardActivity.noDataMessage', {
|
||||
defaultMessage:
|
||||
'There are no historical shard activity records for the selected time range.',
|
||||
});
|
||||
}
|
||||
return (
|
||||
<Fragment>
|
||||
<FormattedMessage
|
||||
id="xpack.monitoring.elasticsearch.shardActivity.noActiveShardRecoveriesMessage.completedRecoveriesLinkTextProblem"
|
||||
defaultMessage="There are no active shard recoveries for this cluster."
|
||||
/>
|
||||
<br />
|
||||
<FormattedMessage
|
||||
id="xpack.monitoring.elasticsearch.shardActivity.noActiveShardRecoveriesMessage.completedRecoveriesLinkTextSolution"
|
||||
defaultMessage="Try viewing {shardActivityHistoryLink}."
|
||||
values={{
|
||||
shardActivityHistoryLink: (
|
||||
<EuiLink onClick={toggleShardActivityHistory}>
|
||||
<FormattedMessage
|
||||
id="xpack.monitoring.elasticsearch.shardActivity.noActiveShardRecoveriesMessage.completedRecoveriesLinkText"
|
||||
defaultMessage="completed recoveries"
|
||||
/>
|
||||
</EuiLink>
|
||||
),
|
||||
}}
|
||||
/>
|
||||
</Fragment>
|
||||
);
|
||||
};
|
||||
|
||||
const rows = rawData.map((data) => parseProps({ ...data, timezone }));
|
||||
|
||||
return (
|
||||
<Fragment>
|
||||
<EuiText>
|
||||
<EuiTitle size="s">
|
||||
<h2>
|
||||
<FormattedMessage
|
||||
id="xpack.monitoring.elasticsearch.shardActivityTitle"
|
||||
defaultMessage="Shard Activity"
|
||||
/>
|
||||
</h2>
|
||||
</EuiTitle>
|
||||
</EuiText>
|
||||
<EuiSpacer />
|
||||
<EuiSwitch
|
||||
id="monitoring_completed_recoveries"
|
||||
label={
|
||||
<FormattedMessage
|
||||
id="xpack.monitoring.elasticsearch.shardActivity.completedRecoveriesLabel"
|
||||
defaultMessage="Completed recoveries"
|
||||
/>
|
||||
}
|
||||
onChange={toggleShardActivityHistory}
|
||||
checked={showShardActivityHistory}
|
||||
/>
|
||||
<EuiSpacer />
|
||||
<EuiMonitoringTable
|
||||
className="esShardActivityTable"
|
||||
rows={rows}
|
||||
columns={columns}
|
||||
message={getNoDataMessage()}
|
||||
sorting={sorting}
|
||||
search={false}
|
||||
pagination={pagination}
|
||||
onTableChange={onTableChange}
|
||||
executeQueryOptions={{
|
||||
defaultFields: ['name'],
|
||||
}}
|
||||
/>
|
||||
</Fragment>
|
||||
);
|
||||
};
|
Loading…
Reference in a new issue