diff --git a/packages/xo-web/src/common/intl/messages.js b/packages/xo-web/src/common/intl/messages.js index e1e7edd8e81..f4ae07ccff5 100644 --- a/packages/xo-web/src/common/intl/messages.js +++ b/packages/xo-web/src/common/intl/messages.js @@ -1381,7 +1381,7 @@ const messages = { metricsLoading: 'Loading…', // ----- Health ----- - length: 'Length {length}', + length: 'Length: {length}', deleteBackups: 'Delete backup{nBackups, plural, one {} other {s}}', deleteBackupsMessage: 'Are you sure you want to delete {nBackups, number} backup{nBackups, plural, one {} other {s}}?', diff --git a/packages/xo-web/src/xo-app/dashboard/health/vdisToCoalesce.js b/packages/xo-web/src/xo-app/dashboard/health/vdisToCoalesce.js index 822af7fcecf..2710ce85c3d 100644 --- a/packages/xo-web/src/xo-app/dashboard/health/vdisToCoalesce.js +++ b/packages/xo-web/src/xo-app/dashboard/health/vdisToCoalesce.js @@ -2,6 +2,7 @@ import _ from 'intl' import decorate from 'apply-decorators' import Icon from 'icon' import React from 'react' +import SingleLineRow from 'single-line-row' import SortedTable from 'sorted-table' import Tooltip from 'tooltip' import { Card, CardHeader, CardBlock } from 'card' @@ -13,18 +14,18 @@ import { Sr, Vdi } from 'render-xo-item' const VDIS_TO_COALESCE_LIMIT = 10 -const UNHEALTHY_VDI_CHAINS = [ +const COLUMNS = [ { itemRenderer: (srId, { unhealthyVdiChainsLengthBySr }) => (
+ {' '} {size(unhealthyVdiChainsLengthBySr[srId]) >= VDIS_TO_COALESCE_LIMIT && ( - {' '} + )} -
), name: _('sr'), @@ -34,14 +35,14 @@ const UNHEALTHY_VDI_CHAINS = [ itemRenderer: (srId, { unhealthyVdiChainsLengthBySr }) => (
{map(unhealthyVdiChainsLengthBySr[srId], (chainLength, vdiId) => ( - + {_('length', { length: chainLength })} - + ))}
), @@ -51,32 +52,33 @@ const UNHEALTHY_VDI_CHAINS = [ const VdisToCoalesce = decorate([ provideState({ - initialize({ fetchUnhealthyVdiChainsLength }) { - return fetchUnhealthyVdiChainsLength(this.props.srs.map(({ id }) => id)) - }, + initialState: () => ({ + unhealthyVdiChainsLengthBySr: {}, + }), effects: { - initialState: () => ({ - unhealthyVdiChainsLengthBySr: {}, - }), - async fetchUnhealthyVdiChainsLength(effects, srs) { + initialize({ fetchUnhealthyVdiChainsLength }) { + return fetchUnhealthyVdiChainsLength(map(this.props.srs, 'id')) + }, + async fetchUnhealthyVdiChainsLength(effects, srIds) { const unhealthyVdiChainsLengthBySr = { ...this.state.unhealthyVdiChainsLengthBySr } await Promise.all( - srs.map(async srId => { + srIds.map(async srId => { const unhealthyVdiChainsLength = await getUnhealthyVdiChainsLength(srId) if (size(unhealthyVdiChainsLength) > 0) { unhealthyVdiChainsLengthBySr[srId] = unhealthyVdiChainsLength } }) ) + this.state.unhealthyVdiChainsLengthBySr = unhealthyVdiChainsLengthBySr }, }, computed: { - srIds: ({ unhealthyVdiChainsLengthBySr }) => Object.keys(unhealthyVdiChainsLengthBySr), + srIds: ({ unhealthyVdiChainsLengthBySr = {} }) => Object.keys(unhealthyVdiChainsLengthBySr), }, }), injectState, - ({ state: { srIds, unhealthyVdiChainsLengthBySr } }) => ( + ({ state: { srIds, unhealthyVdiChainsLengthBySr }, srs }) => ( @@ -89,7 +91,8 @@ const VdisToCoalesce = decorate([