fix(xo-web/FormattedDuration): handle duration < 0 seconds (#2964)

packages/xo-web/src/common/intl/index.js

@@ -1,10 +1,9 @@
-import isFunction from 'lodash/isFunction'
-import isString from 'lodash/isString'
 import moment from 'moment'
 import PropTypes from 'prop-types'
 import React, { Component } from 'react'
 import { connect } from 'react-redux'
 import { FormattedMessage, IntlProvider as IntlProvider_ } from 'react-intl'
+import { every, isFunction, isString } from 'lodash'
 
 import locales from './locales'
 import messages from './messages'
@@ -102,8 +101,16 @@ export class FormattedDuration extends Component {
   )
 
   render () {
+    const parsedDuration = this._parseDuration()
     return (
-      <Tooltip content={getMessage('durationFormat', this._parseDuration())}>
+      <Tooltip
+        content={getMessage(
+          every(parsedDuration, n => n === 0)
+            ? 'secondsFormat'
+            : 'durationFormat',
+          parsedDuration
+        )}
+      >
         <span>{this._humanizeDuration()}</span>
       </Tooltip>
     )

packages/xo-web/src/common/intl/messages.js

@@ -1905,6 +1905,7 @@ const messages = {
   xosanLoadXoaPlugin: 'Load XOA plugin first',
 
   // ----- Utils -----
+  secondsFormat: '{seconds, plural, one {# second} other {# seconds}}',
   durationFormat:
     '{days, plural, =0 {} one {# day } other {# days }}{hours, plural, =0 {} one {# hour } other {# hours }}{minutes, plural, =0 {} one {# minute } other {# minutes }}{seconds, plural, =0 {} one {# second} other {# seconds}}',
 }