From 1a43dcaa79a8bde9af3699ed8d4f07d0fb0fbb4e Mon Sep 17 00:00:00 2001
From: Michael Bradley <michaelsbradleyjr@gmail.com>
Date: Tue, 5 Nov 2019 11:07:59 -0600
Subject: [PATCH] fix(@cockpit/dashboard): "Deployed Contracts" should
 auto-update after deployment (#2020)

---
 packages/cockpit/ui/src/components/Contracts.js | 17 ++++++++---------
 .../cockpit/ui/src/components/ContractsList.js  | 10 +++++-----
 packages/cockpit/ui/src/utils/presentation.js   |  5 +++--
 3 files changed, 16 insertions(+), 16 deletions(-)

diff --git a/packages/cockpit/ui/src/components/Contracts.js b/packages/cockpit/ui/src/components/Contracts.js
index 71ad8b8a3..50fc7e756 100644
--- a/packages/cockpit/ui/src/components/Contracts.js
+++ b/packages/cockpit/ui/src/components/Contracts.js
@@ -17,23 +17,22 @@ const Contracts = ({contracts, changePage, currentPage, numberOfPages, title = "
         <CardBody>
           {!contracts.length && "No contracts to display"}
           {contracts
-            .map((contract, key) => {
-              const contractDisplay = formatContractForDisplay(contract);
-              if (!contractDisplay) {
-                return '';
+           .map((contract, key) => {
+              if (!contract) {
+                return null;
               }
-
+              const contractDisplay = formatContractForDisplay(contract);
               return (
                 <div className="explorer-row border-top" key={`contract-${key}`}>
-                  <CardTitleIdenticon id={contract.className}>
-                    <Link to={`/explorer/contracts/${contract.className}`}>
-                      {contract.className}
+                  <CardTitleIdenticon id={contractDisplay.name}>
+                    <Link to={`/explorer/contracts/${contractDisplay.name}`}>
+                      {contractDisplay.name}
                     </Link>
                   </CardTitleIdenticon>
                   <Row>
                     <Col>
                       <strong>Address</strong>
-                      <div>{contract.deployedAddress}</div>
+                      <div>{contractDisplay.address}</div>
                     </Col>
                     <Col>
                       <strong>State</strong>
diff --git a/packages/cockpit/ui/src/components/ContractsList.js b/packages/cockpit/ui/src/components/ContractsList.js
index 86356f7ea..4518b8492 100644
--- a/packages/cockpit/ui/src/components/ContractsList.js
+++ b/packages/cockpit/ui/src/components/ContractsList.js
@@ -20,14 +20,14 @@ const ContractsList = ({contracts, changePage, currentPage, numberOfPages}) => (
         {
           contracts
             .map((contract) => {
-              const contractDisplay = formatContractForDisplay(contract);
-              if (!contractDisplay) {
+              if (!contract) {
                 return null;
               }
+              const contractDisplay = formatContractForDisplay(contract);
               return (
-                <tr key={contract.className} className={contractDisplay.stateColor}>
-                  <td><Link to={`/explorer/contracts/${contract.className}`}>{contract.className}</Link></td>
-                  <td>{contractDisplay.deployedAddress}</td>
+                <tr key={contractDisplay.name} className={contractDisplay.stateColor}>
+                  <td><Link to={`/explorer/contracts/${contractDisplay.name}`}>{contractDisplay.name}</Link></td>
+                  <td>{contractDisplay.address}</td>
                   <td>{contractDisplay.state}</td>
                 </tr>
               );
diff --git a/packages/cockpit/ui/src/utils/presentation.js b/packages/cockpit/ui/src/utils/presentation.js
index a24aed774..41bac7eb4 100644
--- a/packages/cockpit/ui/src/utils/presentation.js
+++ b/packages/cockpit/ui/src/utils/presentation.js
@@ -2,7 +2,8 @@ import isToday from 'date-fns/isToday';
 import formatDistanceToNow from 'date-fns/formatDistanceToNow';
 
 export function formatContractForDisplay(contract) {
-  let address = (contract.deployedAddress || contract.deployedAddress);
+  let address = contract.deployedAddress;
+  let name = contract.className;
   let state = 'Deployed';
   let stateColor = 'success';
   if (contract.deploy === false) {
@@ -18,7 +19,7 @@ export function formatContractForDisplay(contract) {
     state = 'Pending';
     stateColor = 'warning';
   }
-  return {address, state, stateColor};
+  return {address, name, state, stateColor};
 }
 
 export function formatTimestampForDisplay(timestamp) {