From c69af9af83e1df54e420b3ed6be4a868dd460666 Mon Sep 17 00:00:00 2001
From: poomthiti <poom.thitipatt@gmail.com>
Date: Fri, 20 Jan 2023 18:17:30 +0700
Subject: [PATCH 1/6] fix: show no admin and correctly handle explorer link by
 address type

---
 CHANGELOG.md                                     |  1 +
 .../components/InstantiateInfo.tsx               | 16 ++++++++++------
 2 files changed, 11 insertions(+), 6 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 9f43cf949..366711c41 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -99,6 +99,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Improvements
 
+- [#115](https://github.com/alleslabs/celatone-frontend/pull/115) (Contract Details Page) Show no admin and correctly handle explorer link by address type
 - [#64](https://github.com/alleslabs/celatone-frontend/pull/64) Add address validation functions for contract and user addresses
 - [#52](https://github.com/alleslabs/celatone-frontend/pull/52) Create a component for disconnected State and apply to contract, code, past tx
 - [#56](https://github.com/alleslabs/celatone-frontend/pull/56) Refactor offchain form component by not receiving nameField and descriptionField
diff --git a/src/lib/pages/contract-details/components/InstantiateInfo.tsx b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
index c1537da55..a7f54d795 100644
--- a/src/lib/pages/contract-details/components/InstantiateInfo.tsx
+++ b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
@@ -36,15 +36,19 @@ export const InstantiateInfo = ({ contractData }: InstantiateInfoProps) => {
             />
           </LabelText>
 
-          {contractData.instantiateInfo.admin && (
-            <LabelText label="Admin Address">
+          <LabelText label="Admin Address">
+            {contractData.instantiateInfo.admin ? (
               <ExplorerLink
-                type="user_address"
+                type={getAddressType(contractData.instantiateInfo.admin)}
                 value={contractData.instantiateInfo.admin}
                 canCopyWithHover
               />
-            </LabelText>
-          )}
+            ) : (
+              <Text variant="body2" color="text.dark">
+                No Admin
+              </Text>
+            )}
+          </LabelText>
 
           <Divider border="1px solid" borderColor="divider.main" />
 
@@ -78,7 +82,7 @@ export const InstantiateInfo = ({ contractData }: InstantiateInfoProps) => {
             helperText1={getAddressTypeText(instantiatorType)}
           >
             <ExplorerLink
-              type="user_address"
+              type={instantiatorType}
               value={contractData.instantiateInfo.instantiator}
               canCopyWithHover
             />

From 9fcbb08f6e98487821a3304a3ca7e997cb0580d8 Mon Sep 17 00:00:00 2001
From: poomthiti <poom.thitipatt@gmail.com>
Date: Mon, 23 Jan 2023 12:07:30 +0700
Subject: [PATCH 2/6] feat: show address type helpertext for admin

---
 .../contract-details/components/InstantiateInfo.tsx    | 10 ++++++++--
 1 file changed, 8 insertions(+), 2 deletions(-)

diff --git a/src/lib/pages/contract-details/components/InstantiateInfo.tsx b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
index a7f54d795..06403eb77 100644
--- a/src/lib/pages/contract-details/components/InstantiateInfo.tsx
+++ b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
@@ -21,6 +21,9 @@ export const InstantiateInfo = ({ contractData }: InstantiateInfoProps) => {
       const instantiatorType = getAddressType(
         contractData.instantiateInfo.instantiator
       );
+      const adminType = getAddressType(
+        contractData.instantiateInfo.admin ?? ""
+      );
       return (
         <>
           <LabelText label="Network">{contractData.chainId}</LabelText>
@@ -36,10 +39,13 @@ export const InstantiateInfo = ({ contractData }: InstantiateInfoProps) => {
             />
           </LabelText>
 
-          <LabelText label="Admin Address">
+          <LabelText
+            label="Admin Address"
+            helperText1={getAddressTypeText(adminType)}
+          >
             {contractData.instantiateInfo.admin ? (
               <ExplorerLink
-                type={getAddressType(contractData.instantiateInfo.admin)}
+                type={adminType}
                 value={contractData.instantiateInfo.admin}
                 canCopyWithHover
               />

From 5924deadd9e99cf5eda5a701d8bc70d33318ba37 Mon Sep 17 00:00:00 2001
From: poomthiti <poom.thitipatt@gmail.com>
Date: Mon, 23 Jan 2023 12:13:49 +0700
Subject: [PATCH 3/6] fix: remove address type on no admin case

---
 .../pages/contract-details/components/InstantiateInfo.tsx   | 6 +++++-
 1 file changed, 5 insertions(+), 1 deletion(-)

diff --git a/src/lib/pages/contract-details/components/InstantiateInfo.tsx b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
index 06403eb77..7fa8d1230 100644
--- a/src/lib/pages/contract-details/components/InstantiateInfo.tsx
+++ b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
@@ -41,7 +41,11 @@ export const InstantiateInfo = ({ contractData }: InstantiateInfoProps) => {
 
           <LabelText
             label="Admin Address"
-            helperText1={getAddressTypeText(adminType)}
+            helperText1={
+              contractData.instantiateInfo.admin
+                ? getAddressTypeText(adminType)
+                : undefined
+            }
           >
             {contractData.instantiateInfo.admin ? (
               <ExplorerLink

From dff51dea7e8b001e5a3bf31ad677e6c16e7e14c5 Mon Sep 17 00:00:00 2001
From: poomthiti <poom.thitipatt@gmail.com>
Date: Tue, 24 Jan 2023 10:53:38 +0700
Subject: [PATCH 4/6] refactor: refactor instantiate info

---
 .../components/InstantiateInfo.tsx            | 231 +++++++++---------
 1 file changed, 114 insertions(+), 117 deletions(-)

diff --git a/src/lib/pages/contract-details/components/InstantiateInfo.tsx b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
index 7fa8d1230..2ffaf6343 100644
--- a/src/lib/pages/contract-details/components/InstantiateInfo.tsx
+++ b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
@@ -1,4 +1,4 @@
-import { Divider, Flex, Text } from "@chakra-ui/react";
+import { chakra, Divider, Flex, Text } from "@chakra-ui/react";
 
 import { ExplorerLink } from "lib/components/ExplorerLink";
 import { LabelText } from "lib/components/LabelText";
@@ -11,137 +11,134 @@ interface InstantiateInfoProps {
   contractData: ContractData;
 }
 
-export const InstantiateInfo = ({ contractData }: InstantiateInfoProps) => {
+const Container = chakra(Flex, {
+  baseStyle: {
+    direction: "column",
+    gap: 6,
+    w: "250px",
+  },
+});
+
+export const InstantiateInfo = ({
+  contractData: {
+    instantiateInfo,
+    chainId,
+    codeInfo,
+    initTxHash,
+    initProposalId,
+    initProposalTitle,
+  },
+}: InstantiateInfoProps) => {
   const getAddressType = useGetAddressType();
 
-  // TODO: fix eslint
-  // eslint-disable-next-line sonarjs/cognitive-complexity
-  const renderDataFound = () => {
-    if (contractData.instantiateInfo) {
-      const instantiatorType = getAddressType(
-        contractData.instantiateInfo.instantiator
-      );
-      const adminType = getAddressType(
-        contractData.instantiateInfo.admin ?? ""
-      );
-      return (
-        <>
-          <LabelText label="Network">{contractData.chainId}</LabelText>
+  if (!instantiateInfo) {
+    return (
+      <Container>
+        <Text variant="body2" color="text.dark">
+          Error fetching data
+        </Text>
+      </Container>
+    );
+  }
 
-          <LabelText
-            label="From Code"
-            helperText1={contractData.codeInfo?.description}
-          >
-            <ExplorerLink
-              type="code_id"
-              value={contractData.instantiateInfo.codeId}
-              canCopyWithHover
-            />
-          </LabelText>
+  const instantiatorType = getAddressType(instantiateInfo.instantiator);
+  const adminTypeOpt = instantiateInfo.admin
+    ? getAddressType(instantiateInfo.admin)
+    : undefined;
 
-          <LabelText
-            label="Admin Address"
-            helperText1={
-              contractData.instantiateInfo.admin
-                ? getAddressTypeText(adminType)
-                : undefined
-            }
-          >
-            {contractData.instantiateInfo.admin ? (
-              <ExplorerLink
-                type={adminType}
-                value={contractData.instantiateInfo.admin}
-                canCopyWithHover
-              />
-            ) : (
-              <Text variant="body2" color="text.dark">
-                No Admin
-              </Text>
-            )}
-          </LabelText>
+  return (
+    <Container>
+      <LabelText label="Network">{chainId}</LabelText>
+
+      <LabelText label="From Code" helperText1={codeInfo?.description}>
+        <ExplorerLink
+          type="code_id"
+          value={instantiateInfo.codeId}
+          canCopyWithHover
+        />
+      </LabelText>
 
-          <Divider border="1px solid" borderColor="divider.main" />
+      <LabelText
+        label="Admin Address"
+        helperText1={
+          adminTypeOpt ? getAddressTypeText(adminTypeOpt) : undefined
+        }
+      >
+        {instantiateInfo.admin ? (
+          <ExplorerLink
+            type={adminTypeOpt}
+            value={instantiateInfo.admin}
+            canCopyWithHover
+          />
+        ) : (
+          <Text variant="body2" color="text.dark">
+            No Admin
+          </Text>
+        )}
+      </LabelText>
 
-          {contractData.instantiateInfo &&
-            (contractData.instantiateInfo.createdHeight !== -1 ? (
-              <LabelText
-                label="Instantiated Block Height"
-                helperText1={
-                  contractData.instantiateInfo.createdTime
-                    ? formatUTC(contractData.instantiateInfo.createdTime)
-                    : undefined
-                }
-                helperText2={
-                  contractData.instantiateInfo.createdTime
-                    ? dateFromNow(contractData.instantiateInfo.createdTime)
-                    : undefined
-                }
-              >
-                <ExplorerLink
-                  type="block_height"
-                  value={contractData.instantiateInfo.createdHeight.toString()}
-                  canCopyWithHover
-                />
-              </LabelText>
-            ) : (
-              <LabelText label="Instantiated Block Height">N/A</LabelText>
-            ))}
+      <Divider border="1px solid" borderColor="divider.main" />
 
+      {instantiateInfo &&
+        (instantiateInfo.createdHeight !== -1 ? (
           <LabelText
-            label="Instantiated by"
-            helperText1={getAddressTypeText(instantiatorType)}
+            label="Instantiated Block Height"
+            helperText1={
+              instantiateInfo.createdTime
+                ? formatUTC(instantiateInfo.createdTime)
+                : undefined
+            }
+            helperText2={
+              instantiateInfo.createdTime
+                ? dateFromNow(instantiateInfo.createdTime)
+                : undefined
+            }
           >
             <ExplorerLink
-              type={instantiatorType}
-              value={contractData.instantiateInfo.instantiator}
+              type="block_height"
+              value={instantiateInfo.createdHeight.toString()}
               canCopyWithHover
             />
           </LabelText>
+        ) : (
+          <LabelText label="Instantiated Block Height">N/A</LabelText>
+        ))}
 
-          {contractData.initTxHash ? (
-            <LabelText label="Instantiate Transaction">
-              <ExplorerLink
-                type="tx_hash"
-                value={contractData.initTxHash.toUpperCase()}
-                canCopyWithHover
-              />
-            </LabelText>
-          ) : (
-            <LabelText
-              label="Instantiate Proposal ID"
-              helperText1={contractData.initProposalTitle}
-            >
-              <ExplorerLink
-                value={
-                  contractData.initProposalId
-                    ? `#${contractData.initProposalId}`
-                    : "Genesis"
-                }
-                canCopyWithHover
-                isReadOnly={!contractData.initProposalId}
-              />
-            </LabelText>
-          )}
-
-          {contractData.instantiateInfo.ibcPortId && (
-            <LabelText label="IBC Port ID">
-              {contractData.instantiateInfo.ibcPortId}
-            </LabelText>
-          )}
-        </>
-      );
-    }
+      <LabelText
+        label="Instantiated by"
+        helperText1={getAddressTypeText(instantiatorType)}
+      >
+        <ExplorerLink
+          type={instantiatorType}
+          value={instantiateInfo.instantiator}
+          canCopyWithHover
+        />
+      </LabelText>
 
-    return (
-      <Text variant="body2" color="text.dark">
-        Error fetching data
-      </Text>
-    );
-  };
+      {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>
+      )}
 
-  return (
-    <Flex direction="column" gap={6} w="250px">
-      {renderDataFound()}
-    </Flex>
+      {instantiateInfo.ibcPortId && (
+        <LabelText label="IBC Port ID">{instantiateInfo.ibcPortId}</LabelText>
+      )}
+    </Container>
   );
 };

From e149c6c4a59c502211fe42af479b6abd0759ef91 Mon Sep 17 00:00:00 2001
From: poomthiti <poom.thitipatt@gmail.com>
Date: Tue, 24 Jan 2023 10:55:30 +0700
Subject: [PATCH 5/6] chore: add todos in useAddress

---
 src/lib/hooks/useAddress.ts | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/src/lib/hooks/useAddress.ts b/src/lib/hooks/useAddress.ts
index 2f09faefd..62126b218 100644
--- a/src/lib/hooks/useAddress.ts
+++ b/src/lib/hooks/useAddress.ts
@@ -19,6 +19,9 @@ const addressLengthMap: {
     43: "user_address",
     63: "contract_address",
   },
+  /**
+   * @todos Add terra cases
+   */
 };
 
 export const getAddressTypeByLength = (

From fd8882f8a7dfaf121a76dccb94508650a085c1d0 Mon Sep 17 00:00:00 2001
From: poomthiti <poom.thitipatt@gmail.com>
Date: Tue, 24 Jan 2023 11:28:46 +0700
Subject: [PATCH 6/6] fix: flex direction

---
 src/lib/pages/contract-details/components/InstantiateInfo.tsx | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/src/lib/pages/contract-details/components/InstantiateInfo.tsx b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
index 2ffaf6343..364a8f461 100644
--- a/src/lib/pages/contract-details/components/InstantiateInfo.tsx
+++ b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
@@ -13,7 +13,7 @@ interface InstantiateInfoProps {
 
 const Container = chakra(Flex, {
   baseStyle: {
-    direction: "column",
+    flexDir: "column",
     gap: 6,
     w: "250px",
   },
@@ -45,7 +45,6 @@ export const InstantiateInfo = ({
   const adminTypeOpt = instantiateInfo.admin
     ? getAddressType(instantiateInfo.admin)
     : undefined;
-
   return (
     <Container>
       <LabelText label="Network">{chainId}</LabelText>