Merge branch '0-dashcounter' into 'develop'

Admin: fix display of 0% retention

See merge request soapbox-pub/soapbox-fe!877

app/soapbox/features/admin/index.js

@@ -12,6 +12,7 @@ import sourceCode from 'soapbox/utils/code';
 import { getSubscribersCsv, getUnsubscribersCsv, getCombinedCsv } from 'soapbox/actions/email_list';
 import { getFeatures } from 'soapbox/utils/features';
 import { isAdmin } from 'soapbox/utils/accounts';
+import { isNumber } from 'soapbox/utils/numbers';
 
 // https://stackoverflow.com/a/53230807
 const download = (response, filename) => {
@@ -102,16 +103,18 @@ class Dashboard extends ImmutablePureComponent {
               </div>
             </Link>
           </div>
-          {retention && <div className='dashcounter'>
-            <div>
-              <div className='dashcounter__num'>
-                {retention}%
-              </div>
-              <div className='dashcounter__label'>
-                <FormattedMessage id='admin.dashcounters.retention_label' defaultMessage='user retention' />
+          {isNumber(retention) && (
+            <div className='dashcounter'>
+              <div>
+                <div className='dashcounter__num'>
+                  {retention}%
+                </div>
+                <div className='dashcounter__label'>
+                  <FormattedMessage id='admin.dashcounters.retention_label' defaultMessage='user retention' />
+                </div>
               </div>
             </div>
-          </div>}
+          )}
           <div className='dashcounter'>
             <Link to='/timeline/local'>
               <div className='dashcounter__num'>

app/soapbox/utils/numbers.js

@@ -1,7 +1,7 @@
 import React from 'react';
 import { FormattedNumber } from 'react-intl';
 
-const isNumber = number => typeof number === 'number' && !isNaN(number);
+export const isNumber = number => typeof number === 'number' && !isNaN(number);
 
 export const shortNumberFormat = number => {
   if (!isNumber(number)) return '•';