From 1e5ad9d5cda7f15c6f391ed4d44b1cd66ae1b38b Mon Sep 17 00:00:00 2001
From: Rostislav Wolny <rosta@mailpoet.com>
Date: Mon, 3 Sep 2018 16:58:46 +0200
Subject: [PATCH 1/2] Refactor key value table to accept data content as a
 property

[MAILPOET-1517]
---
 assets/js/src/common/key_value_table.jsx |  4 +-
 assets/js/src/help/cron_status.jsx       | 55 ++++++++++---------
 assets/js/src/help/queue_status.jsx      | 70 ++++++++++++------------
 3 files changed, 67 insertions(+), 62 deletions(-)

diff --git a/assets/js/src/common/key_value_table.jsx b/assets/js/src/common/key_value_table.jsx
index bcda7fee7e..3293dd4a41 100644
--- a/assets/js/src/common/key_value_table.jsx
+++ b/assets/js/src/common/key_value_table.jsx
@@ -3,7 +3,7 @@ import React from 'react';
 const KeyValueTable = props => (
   <table className={'widefat fixed'} style={{ maxWidth: props.max_width }}>
     <tbody>
-      {props.children.map(row => (
+      {props.rows.map(row => (
         <tr key={`row_${row.key}`}>
           <td className={'row-title'}>{ row.key }</td><td>{ row.value }</td>
         </tr>
@@ -14,7 +14,7 @@ const KeyValueTable = props => (
 
 KeyValueTable.propTypes = {
   max_width: React.PropTypes.string,
-  children: React.PropTypes.arrayOf(React.PropTypes.shape({
+  rows: React.PropTypes.arrayOf(React.PropTypes.shape({
     key: React.PropTypes.string.isRequired,
     value: React.PropTypes.oneOfType([
       React.PropTypes.string,
diff --git a/assets/js/src/help/cron_status.jsx b/assets/js/src/help/cron_status.jsx
index e399302560..04b446cdde 100644
--- a/assets/js/src/help/cron_status.jsx
+++ b/assets/js/src/help/cron_status.jsx
@@ -12,32 +12,35 @@ const CronStatus = (props) => {
   return (
     <div>
       <h2>{MailPoet.I18n.t('systemStatusCronStatusTitle')}</h2>
-      <KeyValueTable max_width={'400px'}>{[
-        {
-          key: MailPoet.I18n.t('accessible'),
-          value: <PrintBoolean>{status.accessible}</PrintBoolean>,
-        },
-        {
-          key: MailPoet.I18n.t('status'),
-          value: activeStatusMapping[status.status] ? activeStatusMapping[status.status] : MailPoet.I18n.t('unknown'),
-        },
-        {
-          key: MailPoet.I18n.t('lastUpdated'),
-          value: status.updated_at ? MailPoet.Date.full(status.updated_at * 1000) : MailPoet.I18n.t('unknown'),
-        },
-        {
-          key: MailPoet.I18n.t('lastRunStarted'),
-          value: status.run_accessed_at ? MailPoet.Date.full(status.run_started_at * 1000) : MailPoet.I18n.t('unknown'),
-        },
-        {
-          key: MailPoet.I18n.t('lastRunCompleted'),
-          value: status.run_completed_at ? MailPoet.Date.full(status.run_completed_at * 1000) : MailPoet.I18n.t('unknown'),
-        },
-        {
-          key: MailPoet.I18n.t('lastSeenError'),
-          value: status.last_error || MailPoet.I18n.t('none'),
-        }]}
-      </KeyValueTable>
+      <KeyValueTable
+        max_width={'400px'}
+        rows={[
+          {
+            key: MailPoet.I18n.t('accessible'),
+            value: <PrintBoolean>{status.accessible}</PrintBoolean>,
+          },
+          {
+            key: MailPoet.I18n.t('status'),
+            value: activeStatusMapping[status.status] ? activeStatusMapping[status.status] : MailPoet.I18n.t('unknown'),
+          },
+          {
+            key: MailPoet.I18n.t('lastUpdated'),
+            value: status.updated_at ? MailPoet.Date.full(status.updated_at * 1000) : MailPoet.I18n.t('unknown'),
+          },
+          {
+            key: MailPoet.I18n.t('lastRunStarted'),
+            value: status.run_accessed_at ? MailPoet.Date.full(status.run_started_at * 1000) : MailPoet.I18n.t('unknown'),
+          },
+          {
+            key: MailPoet.I18n.t('lastRunCompleted'),
+            value: status.run_completed_at ? MailPoet.Date.full(status.run_completed_at * 1000) : MailPoet.I18n.t('unknown'),
+          },
+          {
+            key: MailPoet.I18n.t('lastSeenError'),
+            value: status.last_error || MailPoet.I18n.t('none'),
+          },
+        ]}
+      />
     </div>
   );
 };
diff --git a/assets/js/src/help/queue_status.jsx b/assets/js/src/help/queue_status.jsx
index 3014573993..1e91893917 100644
--- a/assets/js/src/help/queue_status.jsx
+++ b/assets/js/src/help/queue_status.jsx
@@ -9,40 +9,42 @@ const QueueStatus = (props) => {
   return (
     <div>
       <h2>{MailPoet.I18n.t('systemStatusQueueTitle')}</h2>
-      <KeyValueTable max_width={'400px'}>{
-        [{
-          key: MailPoet.I18n.t('status'),
-          value: status.status === 'paused' ? MailPoet.I18n.t('paused') : MailPoet.I18n.t('running'),
-        }, {
-          key: MailPoet.I18n.t('startedAt'),
-          value: status.started ? MailPoet.Date.full(status.started * 1000) : MailPoet.I18n.t('unknown'),
-        }, {
-          key: MailPoet.I18n.t('sentEmails'),
-          value: status.sent || 0,
-        }, {
-          key: MailPoet.I18n.t('retryAttempt'),
-          value: status.retry_attempt || MailPoet.I18n.t('none'),
-        }, {
-          key: MailPoet.I18n.t('retryAt'),
-          value: status.retry_at ? MailPoet.Date.full(status.retry_at * 1000) : MailPoet.I18n.t('none'),
-        }, {
-          key: MailPoet.I18n.t('error'),
-          value: status.error || MailPoet.I18n.t('none'),
-        }, {
-          key: MailPoet.I18n.t('totalCompletedTasks'),
-          value: status.tasksStatusCounts.completed,
-        }, {
-          key: MailPoet.I18n.t('totalRunningTasks'),
-          value: status.tasksStatusCounts.running,
-        }, {
-          key: MailPoet.I18n.t('totalPausedTasks'),
-          value: status.tasksStatusCounts.paused,
-        }, {
-          key: MailPoet.I18n.t('totalScheduledTasks'),
-          value: status.tasksStatusCounts.scheduled,
-        }]}
-      </KeyValueTable>
-
+      <KeyValueTable
+        max_width={'400px'}
+        rows={[
+          {
+            key: MailPoet.I18n.t('status'),
+            value: status.status === 'paused' ? MailPoet.I18n.t('paused') : MailPoet.I18n.t('running'),
+          }, {
+            key: MailPoet.I18n.t('startedAt'),
+            value: status.started ? MailPoet.Date.full(status.started * 1000) : MailPoet.I18n.t('unknown'),
+          }, {
+            key: MailPoet.I18n.t('sentEmails'),
+            value: status.sent || 0,
+          }, {
+            key: MailPoet.I18n.t('retryAttempt'),
+            value: status.retry_attempt || MailPoet.I18n.t('none'),
+          }, {
+            key: MailPoet.I18n.t('retryAt'),
+            value: status.retry_at ? MailPoet.Date.full(status.retry_at * 1000) : MailPoet.I18n.t('none'),
+          }, {
+            key: MailPoet.I18n.t('error'),
+            value: status.error || MailPoet.I18n.t('none'),
+          }, {
+            key: MailPoet.I18n.t('totalCompletedTasks'),
+            value: status.tasksStatusCounts.completed,
+          }, {
+            key: MailPoet.I18n.t('totalRunningTasks'),
+            value: status.tasksStatusCounts.running,
+          }, {
+            key: MailPoet.I18n.t('totalPausedTasks'),
+            value: status.tasksStatusCounts.paused,
+          }, {
+            key: MailPoet.I18n.t('totalScheduledTasks'),
+            value: status.tasksStatusCounts.scheduled,
+          },
+        ]}
+      />
       <h4>{MailPoet.I18n.t('scheduledTasks')}</h4>
       <TasksList show_scheduled_at tasks={status.latestTasks.filter(task => (task.status === 'scheduled'))} />
 

From e17cbee3630ca71a5450ed86736cb28531a05227 Mon Sep 17 00:00:00 2001
From: Rostislav Wolny <rosta@mailpoet.com>
Date: Mon, 3 Sep 2018 16:59:47 +0200
Subject: [PATCH 2/2] Fix displaying of an error message in sending queue table
 and paused translation

[MAILPOET-1517]
---
 assets/js/src/help/queue_status.jsx | 7 ++++++-
 views/help.html                     | 1 +
 2 files changed, 7 insertions(+), 1 deletion(-)

diff --git a/assets/js/src/help/queue_status.jsx b/assets/js/src/help/queue_status.jsx
index 1e91893917..649849cf48 100644
--- a/assets/js/src/help/queue_status.jsx
+++ b/assets/js/src/help/queue_status.jsx
@@ -29,7 +29,7 @@ const QueueStatus = (props) => {
             value: status.retry_at ? MailPoet.Date.full(status.retry_at * 1000) : MailPoet.I18n.t('none'),
           }, {
             key: MailPoet.I18n.t('error'),
-            value: status.error || MailPoet.I18n.t('none'),
+            value: status.error ? status.error.error_message : MailPoet.I18n.t('none'),
           }, {
             key: MailPoet.I18n.t('totalCompletedTasks'),
             value: status.tasksStatusCounts.completed,
@@ -64,6 +64,10 @@ QueueStatus.propTypes = {
     sent: React.PropTypes.number,
     retry_attempt: React.PropTypes.number,
     retry_at: React.PropTypes.number,
+    error: React.PropTypes.shape({
+      operation: React.PropTypes.string,
+      error_message: React.PropTypes.string,
+    }),
     tasksStatusCounts: React.PropTypes.shape({
       completed: React.PropTypes.number.isRequired,
       running: React.PropTypes.number.isRequired,
@@ -81,6 +85,7 @@ QueueStatus.defaultProps = {
     sent: null,
     retry_attempt: null,
     retry_at: null,
+    error: null,
   },
 };
 
diff --git a/views/help.html b/views/help.html
index 38d2e062fb..0f5a8725f3 100644
--- a/views/help.html
+++ b/views/help.html
@@ -46,6 +46,7 @@
   'no': __('no'),
   'none': _x('none', 'An empty state is a status table e.g. Error: none'),
   'running': _x('running', 'A state of a process.'),
+  'paused': _x('paused', 'A state of a process.'),
   'cronWaiting': _x('waiting for the next run', 'A state of a process.'),
   'startedAt': _x('Started at', 'A label in a status table e.g. Started at: 2018-10-18 18:50'),
   'sentEmails': _x('Sent emails', 'A label in a status table e.g. Sent emails: 50'),