Comment Count Component

client/coral-admin/src/containers/ModerationQueue/components/CommentCount.js

@@ -2,11 +2,11 @@ import React, {PropTypes} from 'react';
 import styles from './CommentCount.css';
 
 const CommentCount = props => (
-  <span className={styles.count}>{props.children}</span>
+  <span className={styles.count}>{props.count}</span>
 );
 
 CommentCount.propTypes = {
-  children: PropTypes.node
+  count: PropTypes.number.isRequired
 };
 
 export default CommentCount;

client/coral-admin/src/containers/ModerationQueue/components/ModerationMenu.js

@@ -16,14 +16,14 @@ const ModerationMenu = ({asset, premodCount, rejectedCount, flaggedCount}) => {
       <div className={`mdl-tabs__tab-bar ${styles.tabBar}`}>
         <div>
           <Link to={premodPath} className={`mdl-tabs__tab ${styles.tab}`} activeClassName={styles.active}>
-            {lang.t('modqueue.premod')}<CommentCount>{premodCount}</CommentCount>
+            {lang.t('modqueue.premod')} <CommentCount count={premodCount} />
           </Link>
           <Link to={rejectPath} className={`mdl-tabs__tab ${styles.tab}`} activeClassName={styles.active}>
-            {lang.t('modqueue.rejected')}<CommentCount>{rejectedCount}</CommentCount>
+            {lang.t('modqueue.rejected')} <CommentCount count={rejectedCount} />
           </Link>
           <Link to={flagPath} className={`mdl-tabs__tab ${styles.tab}`} activeClassName={styles.active}>
-            {lang.t('modqueue.flagged')}<CommentCount>{flaggedCount}</CommentCount>
-          </Link>
+            {lang.t('modqueue.flagged')} <CommentCount count={flaggedCount} />
+        </Link>
         </div>
       </div>
     </div>