diff --git a/x-pack/plugins/monitoring/public/components/chart/info_tooltip.js b/x-pack/plugins/monitoring/public/components/chart/info_tooltip.js index 1e964daf12a7..6eac1fc79fa6 100644 --- a/x-pack/plugins/monitoring/public/components/chart/info_tooltip.js +++ b/x-pack/plugins/monitoring/public/components/chart/info_tooltip.js @@ -5,11 +5,8 @@ */ import React from 'react'; -import { first, get } from 'lodash'; -export function InfoTooltip({ series }) { - - const bucketSize = get(first(series), 'bucket_size'); // bucket size will be the same for all metrics in all series +export function InfoTooltip({ series, bucketSize }) { const tableRows = series.map((item, index) => { return ( `${item.metric.label}: ${item.metric.description}`)); return ( - -

- { getTitle(series) }{ units ? ` (${units})` : '' } -

+ + + This chart is not screen reader accessible +

+ { getTitle(series) }{ units ? ` (${units})` : '' } +

+
- } - /> + + } + /> + + + {seriesScreenReaderTextList.join('. ')} + + +
diff --git a/x-pack/plugins/monitoring/public/components/elasticsearch/overview/overview.js b/x-pack/plugins/monitoring/public/components/elasticsearch/overview/overview.js index c477de20d799..55020955d00f 100644 --- a/x-pack/plugins/monitoring/public/components/elasticsearch/overview/overview.js +++ b/x-pack/plugins/monitoring/public/components/elasticsearch/overview/overview.js @@ -4,7 +4,7 @@ * you may not use this file except in compliance with the Elastic License. */ -import React from 'react'; +import React, { Fragment } from 'react'; import { ClusterStatus } from '../cluster_status'; import { ShardActivity } from '../shard_activity'; import { MonitoringTimeseriesContainer } from '../../chart'; @@ -24,24 +24,24 @@ export function ElasticsearchOverview({ ]; return ( - - - - - - {metricsToShow.map((metric, index) => ( - - - - - ))} - - - - - + + + + + + {metricsToShow.map((metric, index) => ( + + + + + ))} + + + + + ); } diff --git a/x-pack/plugins/monitoring/public/components/elasticsearch/shard_activity/shard_activity.js b/x-pack/plugins/monitoring/public/components/elasticsearch/shard_activity/shard_activity.js index e08237af5c85..eec1e8ec4954 100644 --- a/x-pack/plugins/monitoring/public/components/elasticsearch/shard_activity/shard_activity.js +++ b/x-pack/plugins/monitoring/public/components/elasticsearch/shard_activity/shard_activity.js @@ -56,6 +56,7 @@ const ToggleCompletedSwitch = ({ toggleHistory, showHistory }) => ( + {props.totalRows} in total +

+ ) + : null; + return ( { searchBox } + { totalRows } { props.renderToolBarSections(props) } { paginationSection } @@ -47,5 +56,6 @@ export function MonitoringTableToolBar(props) { } MonitoringTableToolBar.defaultProps = { renderToolBarSections: noop, - showSearchBox: true + showSearchBox: true, + showTotalRows: true }; diff --git a/x-pack/plugins/monitoring/public/directives/alerts/index.js b/x-pack/plugins/monitoring/public/directives/alerts/index.js index d9666edc7e1a..89b95d0b57c8 100644 --- a/x-pack/plugins/monitoring/public/directives/alerts/index.js +++ b/x-pack/plugins/monitoring/public/directives/alerts/index.js @@ -54,17 +54,17 @@ const alertRowFactory = (scope, kbnUrl) => { return ( - + { capitalize(severityIcon.value) } - + { resolution.icon } { resolution.text } - + { changeUrl={changeUrl} /> - + { linkToCategories[props.metadata.link] ? linkToCategories[props.metadata.link] : 'General' } - + { formatDateTimeLocal(props.update_timestamp) } - + { formatTimestampToDuration(props.timestamp, CALCULATE_DURATION_SINCE) } ago diff --git a/x-pack/plugins/monitoring/public/less/components/table.less b/x-pack/plugins/monitoring/public/less/components/table.less index 349247fc5bb2..b4a447081f89 100644 --- a/x-pack/plugins/monitoring/public/less/components/table.less +++ b/x-pack/plugins/monitoring/public/less/components/table.less @@ -60,3 +60,7 @@ color: #666977; font-size: 12px; } + +.monitoringTableToolbarTotalRows { + flex: 2; /* This is to ensure this shows directly next to the search bar in the table toolbar */ +}