Merge pull request #177 from alleslabs/fix/render-init

fix: properly handle instantiate hash/proposal/genesis/data n/a case

CHANGELOG.md

@@ -112,6 +112,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Improvements
 
+- [#177](https://github.com/alleslabs/celatone-frontend/pull/177) Handle instantiate render: tx hash, proposal, genesis, and data not available case
 - [#176](https://github.com/alleslabs/celatone-frontend/pull/176) Adjust contract table fraction, limit tag render, full ellipsis contract desc/name length
 - [#168](https://github.com/alleslabs/celatone-frontend/pull/168) Past tx: Long messages should wrap to new line, clear text input when click on action in filter by actions, fail transaction should not show resend button, header table from "tx hash" to "transaction hash", send message should count unique address, contract details page transaction header (from "actions" to "messages"), hover row should display copy button
 - [#174](https://github.com/alleslabs/celatone-frontend/pull/174) Change "code description" to "code name" and wireup public code name in code detail page

src/lib/pages/contract-details/components/InstantiateInfo.tsx

@@ -20,7 +20,7 @@ const Container = chakra(Flex, {
   },
 });
 
-const RenderPortId = ({ portId }: { portId: string }) => {
+const PortIdRender = ({ portId }: { portId: string }) => {
   const charArray = portId.match(/.{1,28}/g);
 
   return (
@@ -47,6 +47,55 @@ const RenderPortId = ({ portId }: { portId: string }) => {
   );
 };
 
+const InitRender = ({
+  initTxHash,
+  initProposalTitle,
+  initProposalId,
+  createdHeight,
+}: {
+  initTxHash: ContractData["initTxHash"];
+  initProposalTitle: ContractData["initProposalTitle"];
+  initProposalId: ContractData["initProposalId"];
+  createdHeight: number;
+}) => {
+  if (initTxHash) {
+    return (
+      <LabelText label="Instantiate Transaction">
+        <ExplorerLink
+          type="tx_hash"
+          value={initTxHash.toUpperCase()}
+          canCopyWithHover
+        />
+      </LabelText>
+    );
+  }
+
+  if (initProposalTitle && initProposalId) {
+    return (
+      <LabelText
+        label="Instantiate Proposal ID"
+        helperText1={initProposalTitle}
+      >
+        <ExplorerLink
+          type="proposal_id"
+          value={initProposalId.toString()}
+          canCopyWithHover
+        />
+      </LabelText>
+    );
+  }
+
+  return createdHeight === 0 ? (
+    <LabelText label="Created by">
+      <Text variant="body2">Genesis</Text>
+    </LabelText>
+  ) : (
+    <LabelText label="Instantiate Transaction">
+      <Text variant="body2">N/A</Text>
+    </LabelText>
+  );
+};
+
 export const InstantiateInfo = ({
   contractData: {
     contractCw2Info,
@@ -155,30 +204,16 @@ export const InstantiateInfo = ({
         />
       </LabelText>
 
-      {initTxHash ? (
-        <LabelText label="Instantiate Transaction">
-          <ExplorerLink
-            type="tx_hash"
-            value={initTxHash.toUpperCase()}
-            canCopyWithHover
-          />
-        </LabelText>
-      ) : (
-        <LabelText
-          label="Instantiate Proposal ID"
-          helperText1={initProposalTitle}
-        >
-          <ExplorerLink
-            value={initProposalId ? `#${initProposalId}` : "Genesis"}
-            canCopyWithHover
-            isReadOnly={!initProposalId}
-          />
-        </LabelText>
-      )}
+      <InitRender
+        initTxHash={initTxHash}
+        initProposalId={initProposalId}
+        initProposalTitle={initProposalTitle}
+        createdHeight={instantiateInfo.createdHeight}
+      />
 
       {instantiateInfo.ibcPortId && (
         <LabelText label="IBC Port ID">
-          <RenderPortId portId={instantiateInfo.ibcPortId} />
+          <PortIdRender portId={instantiateInfo.ibcPortId} />
         </LabelText>
       )}
     </Container>

src/lib/services/contract.ts

@@ -95,7 +95,7 @@ export const queryInstantiateInfo = async (
 ): Promise<InstantiateInfo> => {
   const res = await queryContract(endpoint, contractAddress);
 
-  // TODO: check `created` field for contracts created with proposals
+  // TODO: query height from gql instead when supporting Terra
   let createdHeight = -1;
   let createdTime;
   if (res.contract_info.created) {