diff --git a/src/shared/components/MMatchLeaderboard/index.jsx b/src/shared/components/MMatchLeaderboard/index.jsx
index 8ab8ef2d99..6ed9c4a95b 100644
--- a/src/shared/components/MMatchLeaderboard/index.jsx
+++ b/src/shared/components/MMatchLeaderboard/index.jsx
@@ -68,7 +68,10 @@ export default class MMLeaderboard extends Component {
 
     if (sortParam.field) {
       // Use Lodash to sort array
-      data = _.orderBy(data, [d => (typeof d[sortParam.field] === 'string' ? d[sortParam.field].toLowerCase() : d[sortParam.field])], [sortParam.order]);
+      data = _.orderBy(
+        data,
+        [d => String(d[sortParam.field]).toLowerCase()], [sortParam.order],
+      );
     }
 
     const renderData = () => {
@@ -217,7 +220,7 @@ export default class MMLeaderboard extends Component {
     };
     return (
       <React.Fragment>
-        { data.length ? renderData() : <h4>No data available yet.</h4> }
+        { data.length ? renderData() : <h4 styleName="no-data-title">No data available yet.</h4> }
       </React.Fragment>
     );
   }
diff --git a/src/shared/components/MMatchLeaderboard/style.scss b/src/shared/components/MMatchLeaderboard/style.scss
index aac4794432..97ef6ffada 100644
--- a/src/shared/components/MMatchLeaderboard/style.scss
+++ b/src/shared/components/MMatchLeaderboard/style.scss
@@ -2,7 +2,7 @@
 
 $light-gray: #d4d4d4;
 
-h4 {
+.no-data-title {
   text-align: center;
 }