fix(@cockpit/dashboard): "Deployed Contracts" should auto-update afte…

…r deployment (#2020)
embarklabs · Nov 5, 2019 · 1a43dca · 1a43dca
1 parent c320dcf
commit 1a43dca
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 16 deletions.
diff --git 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
@@ -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
@@ -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) {