diff --git a/frontend/src/Components/Chart/BarChart.js b/frontend/src/Components/Chart/BarChart.js index ca225952b..264c7607d 100644 --- a/frontend/src/Components/Chart/BarChart.js +++ b/frontend/src/Components/Chart/BarChart.js @@ -1,8 +1,18 @@ import Chart from 'chart.js/auto'; import PropTypes from 'prop-types'; import React, { Component } from 'react'; +import { kinds } from 'Helpers/Props'; import colors from 'Styles/Variables/colors'; +function getColors(kind) { + + if (kind === kinds.WARNING) { + return colors.failedColors.reverse(); + } + + return colors.chartColors; +} + class BarChart extends Component { constructor(props) { super(props); @@ -30,7 +40,7 @@ class BarChart extends Component { datasets: [{ label: this.props.title, data: this.props.data.map((d) => d.value), - backgroundColor: colors.chartColors + backgroundColor: getColors(this.props.kind) }] } }); @@ -53,14 +63,16 @@ BarChart.propTypes = { data: PropTypes.arrayOf(PropTypes.object).isRequired, horizontal: PropTypes.bool, legend: PropTypes.bool, - title: PropTypes.string.isRequired + title: PropTypes.string.isRequired, + kind: PropTypes.oneOf(kinds.all).isRequired }; BarChart.defaultProps = { data: [], horizontal: false, legend: false, - title: '' + title: '', + kind: kinds.INFO }; export default BarChart; diff --git a/frontend/src/Indexer/Stats/Stats.js b/frontend/src/Indexer/Stats/Stats.js index 46775f55a..9a4aa54a9 100644 --- a/frontend/src/Indexer/Stats/Stats.js +++ b/frontend/src/Indexer/Stats/Stats.js @@ -7,6 +7,7 @@ import LoadingIndicator from 'Components/Loading/LoadingIndicator'; import PageContent from 'Components/Page/PageContent'; import PageContentBody from 'Components/Page/PageContentBody'; import PageToolbar from 'Components/Page/Toolbar/PageToolbar'; +import { kinds } from 'Helpers/Props'; import getErrorMessage from 'Utilities/Object/getErrorMessage'; import styles from './Stats.css'; @@ -21,6 +22,22 @@ function getAverageResponseTimeData(indexerStats) { return data; } +function getFailureRateData(indexerStats) { + const data = indexerStats.map((indexer) => { + return { + label: indexer.indexerName, + value: (indexer.numberOfFailedQueries + indexer.numberOfFailedRssQueries + indexer.numberOfFailedAuthQueries + indexer.numberOfFailedGrabs) / + (indexer.numberOfQueries + indexer.numberOfRssQueries + indexer.numberOfAuthQueries + indexer.numberOfGrabs) + }; + }); + + data.sort((a, b) => { + return b.value - a.value; + }); + + return data; +} + function getTotalRequestsData(indexerStats) { const data = { labels: indexerStats.map((indexer) => indexer.indexerName), @@ -47,7 +64,7 @@ function getNumberGrabsData(indexerStats) { const data = indexerStats.map((indexer) => { return { label: indexer.indexerName, - value: indexer.numberOfGrabs + value: indexer.numberOfGrabs - indexer.numberOfFailedGrabs }; }); @@ -153,6 +170,13 @@ function Stats(props) { title='Average Response Times (ms)' /> +