From 5e5d63d18125231fa17e7c4b8964015c8adc0d20 Mon Sep 17 00:00:00 2001
From: Sawit Trisirisatayawong <sawit.tr@gmail.com>
Date: Mon, 30 Jan 2023 15:04:41 +0700
Subject: [PATCH 1/5] feat: add cw2 info data

---
 src/lib/model/contract.ts                     | 15 ++++++++++++-
 .../components/InstantiateInfo.tsx            | 13 ++++++++++++
 src/lib/pages/contract-details/index.tsx      |  2 +-
 src/lib/services/contract.ts                  | 21 +++++++++++++++++++
 4 files changed, 49 insertions(+), 2 deletions(-)

diff --git a/src/lib/model/contract.ts b/src/lib/model/contract.ts
index 773eaf1a2..5a21c1ea7 100644
--- a/src/lib/model/contract.ts
+++ b/src/lib/model/contract.ts
@@ -5,8 +5,12 @@ import { useCelatoneApp } from "lib/app-provider";
 import { INSTANTIATED_LIST_NAME } from "lib/data";
 import { useCodeStore, useContractStore, useLCDEndpoint } from "lib/hooks";
 import { useAssetInfos } from "lib/services/assetService";
-import type { InstantiateInfo } from "lib/services/contract";
+import type {
+  ContractVersionInfo,
+  InstantiateInfo,
+} from "lib/services/contract";
 import {
+  queryContractInfo,
   queryContractBalances,
   queryInstantiateInfo,
 } from "lib/services/contract";
@@ -39,6 +43,7 @@ export interface ContractData {
   chainId: string;
   codeInfo: Option<CodeLocalInfo>;
   contractLocalInfo: Option<ContractLocalInfo>;
+  contractInfo: Option<ContractVersionInfo>;
   instantiateInfo: Option<InstantiateInfo>;
   publicProject: {
     publicInfo: Option<PublicInfo>;
@@ -112,6 +117,13 @@ export const useContractData = (
       queryInstantiateInfo(endpoint, indexerGraphClient, contractAddress),
     { enabled: !!currentChainRecord }
   );
+
+  const { data: contractInfo } = useQuery(
+    ["query", "contractInfo", endpoint, contractAddress],
+    async () => queryContractInfo(endpoint, contractAddress),
+    { enabled: !!currentChainRecord }
+  );
+
   const { data: contractBalances } = useQuery(
     ["query", "contractBalances", contractAddress],
     async () =>
@@ -154,6 +166,7 @@ export const useContractData = (
     chainId: currentChainRecord.chain.chain_id,
     codeInfo,
     contractLocalInfo,
+    contractInfo,
     instantiateInfo,
     publicProject: {
       publicInfo,
diff --git a/src/lib/pages/contract-details/components/InstantiateInfo.tsx b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
index 1bf24d52c..336536dde 100644
--- a/src/lib/pages/contract-details/components/InstantiateInfo.tsx
+++ b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
@@ -48,6 +48,7 @@ const RenderPortId = ({ portId }: { portId: string }) => {
 
 export const InstantiateInfo = ({
   contractData: {
+    contractInfo,
     instantiateInfo,
     chainId,
     codeInfo,
@@ -84,6 +85,18 @@ export const InstantiateInfo = ({
         />
       </LabelText>
 
+      <LabelText label="CW2 Info">
+        {contractInfo ? (
+          <Text variant="body2">
+            {contractInfo?.contract} ({contractInfo?.version})
+          </Text>
+        ) : (
+          <Text variant="body2" color="text.dark">
+            No Info
+          </Text>
+        )}
+      </LabelText>
+
       <LabelText
         label="Admin Address"
         helperText1={
diff --git a/src/lib/pages/contract-details/index.tsx b/src/lib/pages/contract-details/index.tsx
index 44d2984f7..5f9e74c33 100644
--- a/src/lib/pages/contract-details/index.tsx
+++ b/src/lib/pages/contract-details/index.tsx
@@ -79,7 +79,7 @@ const ContractDetailsBody = observer(
               jsonAreaHeight="180px"
             />
             <JsonInfo
-              header="Instantiate Messages"
+              header="Instantiate Message"
               jsonString={jsonPrettify(contractData.initMsg ?? "")}
               showViewFullButton
               defaultExpand
diff --git a/src/lib/services/contract.ts b/src/lib/services/contract.ts
index bddb77143..57ec8c89f 100644
--- a/src/lib/services/contract.ts
+++ b/src/lib/services/contract.ts
@@ -12,6 +12,15 @@ import type {
 } from "lib/types";
 import { encode, parseDateDefault } from "lib/utils";
 
+export interface ContractVersionInfoRaw {
+  data: string;
+}
+
+export interface ContractVersionInfo {
+  contract: string;
+  version: string;
+}
+
 interface ContractResponse {
   address: ContractAddr;
   contract_info: {
@@ -69,6 +78,18 @@ export const queryContract = async (
   return data;
 };
 
+export const queryContractInfo = async (
+  endpoint: string,
+  contractAddress: ContractAddr
+) => {
+  const { data } = await axios.get<ContractVersionInfoRaw>(
+    `${endpoint}/cosmwasm/wasm/v1/contract/${contractAddress}/raw/Y29udHJhY3RfaW5mbw%3D%3D`
+  );
+  return JSON.parse(
+    Buffer.from(data.data, "base64").toString("binary")
+  ) as ContractVersionInfo;
+};
+
 export const queryInstantiateInfo = async (
   endpoint: string,
   indexerGraphClient: GraphQLClient,

From 42188c5fdd5e4704254a452ea76c66742bbabda0 Mon Sep 17 00:00:00 2001
From: Sawit Trisirisatayawong <sawit.tr@gmail.com>
Date: Mon, 30 Jan 2023 15:08:26 +0700
Subject: [PATCH 2/5] docs: update changelog

---
 CHANGELOG.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index b89cf6c9e..d9f9d3e47 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -39,6 +39,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Features
 
+- [#131](https://github.com/alleslabs/celatone-frontend/pull/131) Add CW2-related information to contract details page
 - [#120](https://github.com/alleslabs/celatone-frontend/pull/120) Add simulate migrate fee and the final migration step
 - [#108](https://github.com/alleslabs/celatone-frontend/pull/108) Add migrate options on migrate page and upload new code for migration
 - [#130](https://github.com/alleslabs/celatone-frontend/pull/130) Add support for Terra public projects

From 98639bafefa7057ac741ecbd848136eb73c492c3 Mon Sep 17 00:00:00 2001
From: Sawit Trisirisatayawong <sawit.tr@gmail.com>
Date: Wed, 1 Feb 2023 09:17:29 +0700
Subject: [PATCH 3/5] fix: fix comments

---
 src/lib/model/contract.ts                           | 13 +++++--------
 .../contract-details/components/InstantiateInfo.tsx |  6 +++---
 src/lib/services/contract.ts                        |  8 ++++----
 3 files changed, 12 insertions(+), 15 deletions(-)

diff --git a/src/lib/model/contract.ts b/src/lib/model/contract.ts
index 5a21c1ea7..e141468ce 100644
--- a/src/lib/model/contract.ts
+++ b/src/lib/model/contract.ts
@@ -5,10 +5,7 @@ import { useCelatoneApp } from "lib/app-provider";
 import { INSTANTIATED_LIST_NAME } from "lib/data";
 import { useCodeStore, useContractStore, useLCDEndpoint } from "lib/hooks";
 import { useAssetInfos } from "lib/services/assetService";
-import type {
-  ContractVersionInfo,
-  InstantiateInfo,
-} from "lib/services/contract";
+import type { ContractCw2Info, InstantiateInfo } from "lib/services/contract";
 import {
   queryContractInfo,
   queryContractBalances,
@@ -43,7 +40,7 @@ export interface ContractData {
   chainId: string;
   codeInfo: Option<CodeLocalInfo>;
   contractLocalInfo: Option<ContractLocalInfo>;
-  contractInfo: Option<ContractVersionInfo>;
+  contractCw2Info: Option<ContractCw2Info>;
   instantiateInfo: Option<InstantiateInfo>;
   publicProject: {
     publicInfo: Option<PublicInfo>;
@@ -118,8 +115,8 @@ export const useContractData = (
     { enabled: !!currentChainRecord }
   );
 
-  const { data: contractInfo } = useQuery(
-    ["query", "contractInfo", endpoint, contractAddress],
+  const { data: contractCw2Info } = useQuery(
+    ["query", "contractCw2Info", endpoint, contractAddress],
     async () => queryContractInfo(endpoint, contractAddress),
     { enabled: !!currentChainRecord }
   );
@@ -166,7 +163,7 @@ export const useContractData = (
     chainId: currentChainRecord.chain.chain_id,
     codeInfo,
     contractLocalInfo,
-    contractInfo,
+    contractCw2Info,
     instantiateInfo,
     publicProject: {
       publicInfo,
diff --git a/src/lib/pages/contract-details/components/InstantiateInfo.tsx b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
index 336536dde..7a77e84a0 100644
--- a/src/lib/pages/contract-details/components/InstantiateInfo.tsx
+++ b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
@@ -48,7 +48,7 @@ const RenderPortId = ({ portId }: { portId: string }) => {
 
 export const InstantiateInfo = ({
   contractData: {
-    contractInfo,
+    contractCw2Info,
     instantiateInfo,
     chainId,
     codeInfo,
@@ -86,9 +86,9 @@ export const InstantiateInfo = ({
       </LabelText>
 
       <LabelText label="CW2 Info">
-        {contractInfo ? (
+        {contractCw2Info ? (
           <Text variant="body2">
-            {contractInfo?.contract} ({contractInfo?.version})
+            {contractCw2Info?.contract} ({contractCw2Info?.version})
           </Text>
         ) : (
           <Text variant="body2" color="text.dark">
diff --git a/src/lib/services/contract.ts b/src/lib/services/contract.ts
index 57ec8c89f..8d4bb1b55 100644
--- a/src/lib/services/contract.ts
+++ b/src/lib/services/contract.ts
@@ -12,11 +12,11 @@ import type {
 } from "lib/types";
 import { encode, parseDateDefault } from "lib/utils";
 
-export interface ContractVersionInfoRaw {
+export interface ContractCw2InfoRaw {
   data: string;
 }
 
-export interface ContractVersionInfo {
+export interface ContractCw2Info {
   contract: string;
   version: string;
 }
@@ -82,12 +82,12 @@ export const queryContractInfo = async (
   endpoint: string,
   contractAddress: ContractAddr
 ) => {
-  const { data } = await axios.get<ContractVersionInfoRaw>(
+  const { data } = await axios.get<ContractCw2InfoRaw>(
     `${endpoint}/cosmwasm/wasm/v1/contract/${contractAddress}/raw/Y29udHJhY3RfaW5mbw%3D%3D`
   );
   return JSON.parse(
     Buffer.from(data.data, "base64").toString("binary")
-  ) as ContractVersionInfo;
+  ) as ContractCw2Info;
 };
 
 export const queryInstantiateInfo = async (

From 355e3801b7183697eff0e2554e20716f15e0263e Mon Sep 17 00:00:00 2001
From: songwongtp <16089160+songwongtp@users.noreply.github.com>
Date: Wed, 1 Feb 2023 10:38:13 +0700
Subject: [PATCH 4/5] fix: change query fn name

---
 src/lib/model/contract.ts    | 4 ++--
 src/lib/services/contract.ts | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/lib/model/contract.ts b/src/lib/model/contract.ts
index e141468ce..a98fb8c3a 100644
--- a/src/lib/model/contract.ts
+++ b/src/lib/model/contract.ts
@@ -7,7 +7,7 @@ import { useCodeStore, useContractStore, useLCDEndpoint } from "lib/hooks";
 import { useAssetInfos } from "lib/services/assetService";
 import type { ContractCw2Info, InstantiateInfo } from "lib/services/contract";
 import {
-  queryContractInfo,
+  queryContractCw2Info,
   queryContractBalances,
   queryInstantiateInfo,
 } from "lib/services/contract";
@@ -117,7 +117,7 @@ export const useContractData = (
 
   const { data: contractCw2Info } = useQuery(
     ["query", "contractCw2Info", endpoint, contractAddress],
-    async () => queryContractInfo(endpoint, contractAddress),
+    async () => queryContractCw2Info(endpoint, contractAddress),
     { enabled: !!currentChainRecord }
   );
 
diff --git a/src/lib/services/contract.ts b/src/lib/services/contract.ts
index 8d4bb1b55..d40f3da3c 100644
--- a/src/lib/services/contract.ts
+++ b/src/lib/services/contract.ts
@@ -78,7 +78,7 @@ export const queryContract = async (
   return data;
 };
 
-export const queryContractInfo = async (
+export const queryContractCw2Info = async (
   endpoint: string,
   contractAddress: ContractAddr
 ) => {

From 748ed9f3e80879b0b182199180816b1f8794ec4b Mon Sep 17 00:00:00 2001
From: songwongtp <16089160+songwongtp@users.noreply.github.com>
Date: Wed, 1 Feb 2023 10:44:01 +0700
Subject: [PATCH 5/5] fix: comments

---
 src/lib/model/contract.ts                                   | 2 +-
 .../pages/contract-details/components/InstantiateInfo.tsx   | 2 +-
 src/lib/services/contract.ts                                | 6 ++----
 3 files changed, 4 insertions(+), 6 deletions(-)

diff --git a/src/lib/model/contract.ts b/src/lib/model/contract.ts
index a98fb8c3a..7d8a9764f 100644
--- a/src/lib/model/contract.ts
+++ b/src/lib/model/contract.ts
@@ -116,7 +116,7 @@ export const useContractData = (
   );
 
   const { data: contractCw2Info } = useQuery(
-    ["query", "contractCw2Info", endpoint, contractAddress],
+    ["query", "contract_cw2_info", endpoint, contractAddress],
     async () => queryContractCw2Info(endpoint, contractAddress),
     { enabled: !!currentChainRecord }
   );
diff --git a/src/lib/pages/contract-details/components/InstantiateInfo.tsx b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
index 7a77e84a0..871f029b7 100644
--- a/src/lib/pages/contract-details/components/InstantiateInfo.tsx
+++ b/src/lib/pages/contract-details/components/InstantiateInfo.tsx
@@ -88,7 +88,7 @@ export const InstantiateInfo = ({
       <LabelText label="CW2 Info">
         {contractCw2Info ? (
           <Text variant="body2">
-            {contractCw2Info?.contract} ({contractCw2Info?.version})
+            {contractCw2Info.contract} ({contractCw2Info.version})
           </Text>
         ) : (
           <Text variant="body2" color="text.dark">
diff --git a/src/lib/services/contract.ts b/src/lib/services/contract.ts
index d40f3da3c..2a10ad9ca 100644
--- a/src/lib/services/contract.ts
+++ b/src/lib/services/contract.ts
@@ -10,7 +10,7 @@ import type {
   Option,
   PublicInfo,
 } from "lib/types";
-import { encode, parseDateDefault } from "lib/utils";
+import { encode, libDecode, parseDateDefault } from "lib/utils";
 
 export interface ContractCw2InfoRaw {
   data: string;
@@ -85,9 +85,7 @@ export const queryContractCw2Info = async (
   const { data } = await axios.get<ContractCw2InfoRaw>(
     `${endpoint}/cosmwasm/wasm/v1/contract/${contractAddress}/raw/Y29udHJhY3RfaW5mbw%3D%3D`
   );
-  return JSON.parse(
-    Buffer.from(data.data, "base64").toString("binary")
-  ) as ContractCw2Info;
+  return JSON.parse(libDecode(data.data)) as ContractCw2Info;
 };
 
 export const queryInstantiateInfo = async (