Merge branch 'master' into plugin-google-auth

client/coral-admin/src/components/AccountHistory.js

@@ -19,14 +19,30 @@ const buildUserHistory = (userState = {}) => {
   );
 };
 
-const buildActionResponse = (typename, until, status) => {
+/** readableDuration returns a readable duration of the suspension/ban in hours or days
+ * @param  {} startDate
+ * @param  {} endDate
+ */
+const readableDuration = (startDate, endDate) => {
+  const dur = moment.duration(moment(endDate).diff(moment(startDate)));
+  const durAsDays = dur.asDays().toFixed(0);
+  const durAsHours = dur.asHours().toFixed(0);
+
+  return durAsHours > 23
+    ? `${durAsDays} ${durAsDays > 1 ? 'days' : 'day'}`
+    : `${durAsHours} ${durAsHours > 1 ? 'hours' : 'hour'}`;
+};
+
+const buildActionResponse = (typename, created_at, until, status) => {
   switch (typename) {
     case 'UsernameStatusHistory':
       return `Username ${status}`;
     case 'BannedStatusHistory':
       return status ? 'User banned' : 'Ban removed';
     case 'SuspensionStatusHistory':
-      return until ? 'Account Suspended' : 'Suspension removed';
+      return until
+        ? `Suspended, ${readableDuration(created_at, until)}`
+        : 'Suspension removed';
     default:
       return '-';
   }
@@ -77,7 +93,7 @@ class AccountHistory extends React.Component {
                     'talk-admin-account-history-row-status'
                   )}
                 >
-                  {buildActionResponse(__typename, until, status)}
+                  {buildActionResponse(__typename, created_at, until, status)}
                 </div>
                 <div
                   className={cn(

client/coral-admin/src/components/UserInfoTooltip.css

@@ -28,8 +28,8 @@
   box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 1px 5px 0 rgba(0,0,0,0.12), 0 3px 1px -2px rgba(0,0,0,0.2);
   z-index: 10;
   top: 32px;
-  right: 0px;
-  width: 140px;
+  left: -100px;
+  width: 200px;
   text-align: left;
   color: #616161;
 }
@@ -39,7 +39,7 @@
   border: 10px solid transparent;
   border-top-color: #999;
   position: absolute;
-  right: 0px;
+  left: 96px;
   top: -20px;
   transform: rotate(180deg);
 }
@@ -49,7 +49,7 @@
   border: 10px solid transparent;
   border-top-color: white;
   position: absolute;
-  right: 0px;
+  left: 96px;
   top: -19px;
   transform: rotate(180deg);
 }

client/coral-admin/src/components/UserInfoTooltip.js

@@ -67,7 +67,7 @@ class UserInfoTooltip extends React.Component {
                           new Date(
                             this.getLastHistoryItem(user, 'banned').created_at
                           )
-                        ).format('MMMM Do YYYY, h:mm:ss a')}
+                        ).format('MMM Do YYYY, h:mm:ss a')}
                       </span>
                     </li>
                     <li
@@ -139,7 +139,7 @@ class UserInfoTooltip extends React.Component {
                               'suspension'
                             ).created_at
                           )
-                        ).format('MMMM Do YYYY, h:mm:ss a')}
+                        ).format('MMM Do YYYY, h:mm:ss a')}
                       </span>
                     </li>
                     <li
@@ -154,7 +154,7 @@ class UserInfoTooltip extends React.Component {
                           new Date(
                             this.getLastHistoryItem(user, 'suspension').until
                           )
-                        ).format('MMMM Do YYYY, h:mm:ss a')}
+                        ).format('MMM Do YYYY, h:mm:ss a')}
                       </span>
                     </li>
                   </ul>

graph/loaders/actions.js

@@ -1,6 +1,6 @@
 const DataLoader = require('dataloader');
 const util = require('./util');
-const { first, get, merge, remove, groupBy, reduce } = require('lodash');
+const { first, get, merge, remove, groupBy, reduce, isNil } = require('lodash');
 
 /**
  * Gets actions based on their item id's.
@@ -35,10 +35,12 @@ const genActionsAuthoredWithID = (
  * @param {Object} action_counts the action count object
  */
 const iterateActionCounts = action_counts =>
-  Object.keys(action_counts).map(action_type => ({
-    count: action_counts[action_type],
-    action_type: action_type.toUpperCase(),
-  }));
+  !isNil(action_counts)
+    ? Object.keys(action_counts).map(action_type => ({
+        count: action_counts[action_type],
+        action_type: action_type.toUpperCase(),
+      }))
+    : [];
 
 /**
  * getUserActions will get the actions made by the user for this specific

package.json

@@ -1,6 +1,6 @@
 {
   "name": "talk",
-  "version": "4.2.1",
+  "version": "4.2.2",
   "description": "A better commenting experience from Mozilla, The New York Times, and the Washington Post. https://coralproject.net",
   "main": "app.js",
   "private": true,

plugins/talk-plugin-facebook-auth/client/translations.yml

@@ -4,17 +4,21 @@ en:
     sign_up: "Sign up with Facebook"
 es:
   talk-plugin-facebook-auth:
-    facebook_sign_in: "Entrar con Facebook"
-    facebook_sign_up: "Registrarse con Facebook"
+    sign_in: "Entrar con Facebook"
+    sign_up: "Registrarse con Facebook"
 fr:
   talk-plugin-facebook-auth:
-    facebook_sign_in: "Connectez-vous avec Facebook"
-    facebook_sign_up: "Inscrivez-vous avec Facebook"
+    sign_in: "Connectez-vous avec Facebook"
+    sign_up: "Inscrivez-vous avec Facebook"
 zh_CN:
   talk-plugin-facebook-auth:
-    facebook_sign_in: "使用 Facebook 帐号"
-    facebook_sign_up: "使用 Facebook 帐号"
+    sign_in: "使用 Facebook 帐号"
+    sign_up: "使用 Facebook 帐号"
 zh_TW:
   talk-plugin-facebook-auth:
-    facebook_sign_in: "使用 Facebook 帳號"
-    facebook_sign_up: "使用 Facebook 帳號"
+    sign_in: "使用 Facebook 帳號"
+    sign_up: "使用 Facebook 帳號"
+de:
+  talk-plugin-facebook-auth:
+    sign_in: "Mit Facebook anmelden"
+    sign_up: "Mit Facebook registrieren"