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

CHANGELOG.md

@@ -110,6 +110,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
 - [#174](https://github.com/alleslabs/celatone-frontend/pull/174) Change "code description" to "code name" and wireup public code name in code detail page
 - [#173](https://github.com/alleslabs/celatone-frontend/pull/173) Add connect wallet alert to migrate page
 - [#161](https://github.com/alleslabs/celatone-frontend/pull/161) Fix editable cell, no wrap when hover and click outside to close the editable cell

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) {