feat(notifications): add pending actions to the UI

kleros · Feb 26, 2018 · a340d7d · a340d7d
1 parent 560dc95
commit a340d7d
Show file tree

Hide file tree

Showing 4 changed files with 27 additions and 43 deletions.
diff --git a/src/containers/disputes/components/disputes-table/index.js b/src/containers/disputes/components/disputes-table/index.js
@@ -16,7 +16,7 @@ const columns = [
   {
     id: 'subcourt',
     Header: 'Subcourt',
-    accessor: () => 'Unknown subcourt'
+    accessor: () => 'General Court'
   },
   {
     Header: 'Deadline',

diff --git a/src/containers/home/index.js b/src/containers/home/index.js
@@ -32,6 +32,7 @@ class Home extends PureComponent {
     accounts: walletSelectors.accountsShape.isRequired,
     balance: walletSelectors.balanceShape.isRequired,
     notifications: notificationSelectors.notificationsShape.isRequired,
+    pendingActions: notificationSelectors.pendingActionsShape.isRequired,
     PNKBalance: arbitratorSelectors.PNKBalanceShape.isRequired,
     arbitratorData: arbitratorSelectors.arbitratorDataShape.isRequired,
 
@@ -106,6 +107,7 @@ class Home extends PureComponent {
       accounts,
       balance,
       notifications,
+      pendingActions,
       PNKBalance,
       arbitratorData
     } = this.props
@@ -237,46 +239,27 @@ class Home extends PureComponent {
           <h4>Pending Actions</h4>
         </div>
         <div className="Home-cardList">
-          <div className="Home-cardList-card">
-            <DisputeCard
-              status={0}
-              subcourt="SUBCOURT"
-              date={new Date(Date.now() - 1e10)}
-              title="Unknown Website Owner Claims Services Were Not Delivered"
-            />
-          </div>
-          <div className="Home-cardList-card">
-            <DisputeCard
-              status={0}
-              subcourt="SUBCOURT"
-              date={new Date(Date.now() - 1e10)}
-              title="Unknown Website Owner Claims Services Were Not Delivered"
-            />
-          </div>
-          <div className="Home-cardList-card">
-            <DisputeCard
-              status={0}
-              subcourt="SUBCOURT"
-              date={new Date(Date.now() - 1e10)}
-              title="Unknown Website Owner Claims Services Were Not Delivered"
-            />
-          </div>
-          <div className="Home-cardList-card">
-            <DisputeCard
-              status={0}
-              subcourt="SUBCOURT"
-              date={new Date(Date.now() - 1e10)}
-              title="Unknown Website Owner Claims Services Were Not Delivered"
-            />
-          </div>
-          <div className="Home-cardList-card">
-            <DisputeCard
-              status={0}
-              subcourt="SUBCOURT"
-              date={new Date(Date.now() - 1e10)}
-              title="Unknown Website Owner Claims Services Were Not Delivered"
-            />
-          </div>
+          <RenderIf
+            resource={pendingActions}
+            loading={<Icosahedron />}
+            done={
+              pendingActions.data &&
+              pendingActions.data.map(p => (
+                <div
+                  key={p.message + p.data.disputeId}
+                  className="Home-cardList-card"
+                >
+                  <DisputeCard
+                    status={0}
+                    subcourt="GENERAL COURT"
+                    date={new Date()}
+                    title={p.message}
+                  />
+                </div>
+              ))
+            }
+            failedLoading="There was an error fetching your notifications..."
+          />
         </div>
       </div>
     )
@@ -288,6 +271,7 @@ export default connect(
     accounts: state.wallet.accounts,
     balance: state.wallet.balance,
     notifications: notificationSelectors.getNotifications(state),
+    pendingActions: state.notification.pendingActions,
     PNKBalance: state.arbitrator.PNKBalance,
     arbitratorData: state.arbitrator.arbitratorData,
     activatePNKFormIsInvalid: getActivatePNKFormIsInvalid(state)

diff --git a/src/sagas/notification.js b/src/sagas/notification.js
@@ -111,7 +111,7 @@ function* fetchPendingActions() {
       ARBITRATOR_ADDRESS,
       account
     )
-    console.log(pendingActions)
+
     yield put(
       action(notificationActions.pendingActions.RECEIVE, { pendingActions })
     )

diff --git a/src/utils/date.js b/src/utils/date.js
@@ -28,7 +28,7 @@ export function dateToString(
   if (!withTime) return dateString
 
   let hours = date.getHours()
-  const minutes = date.getMinutes()
+  const minutes = String(date.getMinutes()).padStart(2, '0')
   const amOrPm = hours >= 12 ? 'pm' : 'am'
   hours = amOrPm === 'pm' ? hours % 12 || 12 : hours