Merge branch 'develop' into feat/placeholder-upload-init

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
@@ -103,6 +104,8 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Improvements
 
 - [#140](https://github.com/alleslabs/celatone-frontend/pull/140) Add placeholder texts to upload&instantiate, save code, and save&edit contract
+- [#139](https://github.com/alleslabs/celatone-frontend/pull/139) Fix Date to Dayjs
+- [#135](https://github.com/alleslabs/celatone-frontend/pull/135) Invalidate queries after update/clear admin tx
 - [#123](https://github.com/alleslabs/celatone-frontend/pull/123) Refactor tables to use custom components
 - [#128](https://github.com/alleslabs/celatone-frontend/pull/128) Rewrite add to other list state and add default list to save to
 - [#114](https://github.com/alleslabs/celatone-frontend/pull/114) Handle wallet connection cases in instantiate button
@@ -115,6 +118,9 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Bug fixes
 
+- [#142](https://github.com/alleslabs/celatone-frontend/pull/142) Fix migration table row duplicate and add key to port id render
+- [#138](https://github.com/alleslabs/celatone-frontend/pull/138) Remove execute table in contract details page (due to data issue)
+- [#136](https://github.com/alleslabs/celatone-frontend/pull/136) Fix decode message from query param in execute page
 - [#132](https://github.com/alleslabs/celatone-frontend/pull/132) Fix permission field in upload simulation
 - [#121](https://github.com/alleslabs/celatone-frontend/pull/121) Fix code snippet for query axios
 - [#129](https://github.com/alleslabs/celatone-frontend/pull/129) Fix wallet disconnection on network query change

src/lib/app-fns/tx/clearAdmin.tsx

@@ -23,7 +23,7 @@ interface ClearAdminTxParams {
   fee: StdFee;
   memo?: string;
   client: SigningCosmWasmClient;
-  onTxSucceed?: (txHash: string) => void;
+  onTxSucceed?: () => void;
 }
 
 export const clearAdminTx = ({
@@ -40,7 +40,7 @@ export const clearAdminTx = ({
       postFn: () => client.clearAdmin(address, contractAddress, fee, memo),
     }),
     ({ value: txInfo }) => {
-      onTxSucceed?.(txInfo.transactionHash);
+      onTxSucceed?.();
       return {
         value: null,
         phase: TxStreamPhase.SUCCEED,

src/lib/app-fns/tx/execute.tsx

@@ -5,6 +5,7 @@ import type {
 } from "@cosmjs/cosmwasm-stargate";
 import type { Coin, StdFee } from "@cosmjs/stargate";
 import { pipe } from "@rx-stream/pipe";
+import dayjs from "dayjs";
 import { MdCheckCircle } from "react-icons/md";
 import type { Observable } from "rxjs";
 
@@ -52,7 +53,7 @@ export const executeContractTx = ({
         sender: address,
         contractAddress,
         msg: encode(JSON.stringify(msg)), // base64
-        timestamp: new Date(),
+        timestamp: dayjs(),
       });
       return {
         value: null,

src/lib/app-provider/tx/clearAdmin.ts

@@ -1,4 +1,5 @@
 import { useWallet } from "@cosmos-kit/react";
+import { useQueryClient } from "@tanstack/react-query";
 import { useCallback } from "react";
 
 import { useFabricateFee } from "../hooks";
@@ -7,11 +8,12 @@ import { CLEAR_ADMIN_GAS } from "lib/data";
 import type { ContractAddr } from "lib/types";
 
 export interface ClearAdminStreamParams {
-  onTxSucceed?: (txHash: string) => void;
+  onTxSucceed?: () => void;
 }
 
 export const useClearAdminTx = (contractAddress: ContractAddr) => {
   const { address, getCosmWasmClient } = useWallet();
+  const queryClient = useQueryClient();
   const fabricateFee = useFabricateFee();
   const clearAdminFee = fabricateFee(CLEAR_ADMIN_GAS);
 
@@ -26,9 +28,19 @@ export const useClearAdminTx = (contractAddress: ContractAddr) => {
         contractAddress,
         fee: clearAdminFee,
         client,
-        onTxSucceed,
+        onTxSucceed: () => {
+          onTxSucceed?.();
+          Promise.all([
+            queryClient.invalidateQueries({
+              queryKey: ["admin_by_contracts"],
+            }),
+            queryClient.invalidateQueries({
+              queryKey: ["query", "instantiate_info"],
+            }),
+          ]);
+        },
       });
     },
-    [address, clearAdminFee, contractAddress, getCosmWasmClient]
+    [address, clearAdminFee, queryClient, contractAddress, getCosmWasmClient]
   );
 };

src/lib/components/ContractSelectSection.tsx

@@ -123,7 +123,7 @@ export const ContractSelectSection = observer(
     });
 
     const { refetch } = useQuery(
-      ["query", "instantiateInfo", endpoint, contractAddress],
+      ["query", "instantiate_info", endpoint, contractAddress],
       async () =>
         queryInstantiateInfo(endpoint, indexerGraphClient, contractAddress),
       {

src/lib/components/modal/contract/ClearAdminContract.tsx

@@ -20,7 +20,7 @@ export const ClearAdminContract = ({
   const clearAdminTx = useClearAdminTx(contractAddress);
 
   const proceed = useCallback(async () => {
-    const stream = await clearAdminTx({ onTxSucceed: () => {} });
+    const stream = await clearAdminTx({});
     if (stream) broadcast(stream);
   }, [broadcast, clearAdminTx]);
 

src/lib/components/modal/contract/SaveNewContract.tsx

@@ -95,7 +95,7 @@ export function SaveNewContract({ list, buttonProps }: SaveNewContractProps) {
 
   // TODO: Abstract query
   const { refetch } = useQuery(
-    ["query", "instantiateInfo", endpoint, contractAddressState],
+    ["query", "instantiate_info", endpoint, contractAddressState],
     async () =>
       queryInstantiateInfo(
         endpoint,

src/lib/components/modal/select-contract/SelectContractAdmin.tsx

@@ -11,6 +11,7 @@ import {
   Heading,
 } from "@chakra-ui/react";
 import { useWallet } from "@cosmos-kit/react";
+import dayjs from "dayjs";
 import { MdList, MdSwapHoriz } from "react-icons/md";
 
 import { ADMIN_SPECIAL_SLUG } from "lib/data";
@@ -42,7 +43,7 @@ export const SelectContractAdmin = ({
       ...contract,
       ...getContractLocalInfo(contract.contractAddress),
     })),
-    lastUpdated: new Date(),
+    lastUpdated: dayjs(),
     isInfoEditable: false,
     isContractRemovable: false,
   };

src/lib/model/contract.ts

@@ -1,17 +1,18 @@
 import { useWallet } from "@cosmos-kit/react";
 import { useQuery } from "@tanstack/react-query";
+import dayjs from "dayjs";
 
 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 { ContractCw2Info, InstantiateInfo } from "lib/services/contract";
 import {
+  queryContractCw2Info,
   queryContractBalances,
   queryInstantiateInfo,
 } from "lib/services/contract";
 import {
-  useExecuteTxsCountByContractAddress,
   useInstantiatedCountByUserQuery,
   useInstantiateDetailByContractQuery,
   useInstantiatedListByUserQuery,
@@ -39,6 +40,7 @@ export interface ContractData {
   chainId: string;
   codeInfo: Option<CodeLocalInfo>;
   contractLocalInfo: Option<ContractLocalInfo>;
+  contractCw2Info: Option<ContractCw2Info>;
   instantiateInfo: Option<InstantiateInfo>;
   publicProject: {
     publicInfo: Option<PublicInfo>;
@@ -66,7 +68,7 @@ export const useInstantiatedByMe = (enable: boolean): ContractListInfo => {
     })),
     name: INSTANTIATED_LIST_NAME,
     slug: formatSlugName(INSTANTIATED_LIST_NAME),
-    lastUpdated: new Date(),
+    lastUpdated: dayjs(),
     isInfoEditable: false,
     isContractRemovable: false,
   };
@@ -83,11 +85,11 @@ export const useInstantiatedMockInfoByMe = (): ContractListInfo => {
       contractAddress: "" as ContractAddr,
       instantiator: "",
       label: "",
-      created: new Date(0),
+      created: dayjs(0),
     })),
     name: INSTANTIATED_LIST_NAME,
     slug: formatSlugName(INSTANTIATED_LIST_NAME),
-    lastUpdated: new Date(),
+    lastUpdated: dayjs(),
     isInfoEditable: false,
     isContractRemovable: false,
   };
@@ -107,11 +109,18 @@ export const useContractData = (
   const { data: publicInfoBySlug } = usePublicProjectBySlug(publicInfo?.slug);
 
   const { data: instantiateInfo } = useQuery(
-    ["query", "instantiateInfo", endpoint, contractAddress],
+    ["query", "instantiate_info", endpoint, contractAddress],
     async () =>
       queryInstantiateInfo(endpoint, indexerGraphClient, contractAddress),
     { enabled: !!currentChainRecord }
   );
+
+  const { data: contractCw2Info } = useQuery(
+    ["query", "contract_cw2_info", endpoint, contractAddress],
+    async () => queryContractCw2Info(endpoint, contractAddress),
+    { enabled: !!currentChainRecord }
+  );
+
   const { data: contractBalances } = useQuery(
     ["query", "contractBalances", contractAddress],
     async () =>
@@ -154,6 +163,7 @@ export const useContractData = (
     chainId: currentChainRecord.chain.chain_id,
     codeInfo,
     contractLocalInfo,
+    contractCw2Info,
     instantiateInfo,
     publicProject: {
       publicInfo,
@@ -167,26 +177,31 @@ export const useContractData = (
   };
 };
 
+/**
+ * @remark
+ * Remove execute table for now
+ *
+ */
 export const useContractDetailsTableCounts = (
   contractAddress: ContractAddr
 ) => {
-  const { data: executeCount = 0, refetch: refetchExecute } =
-    useExecuteTxsCountByContractAddress(contractAddress);
+  // const { data: executeCount = 0, refetch: refetchExecute } =
+  //   useExecuteTxsCountByContractAddress(contractAddress);
   const { data: migrationCount = 0, refetch: refetchMigration } =
     useMigrationHistoriesCountByContractAddress(contractAddress);
   const { data: transactionsCount = 0, refetch: refetchTransactions } =
     useTxsCountByContractAddress(contractAddress);
-
   const { data: relatedProposalsCount = 0, refetch: refetchRelatedProposals } =
     useRelatedProposalsCountByContractAddress(contractAddress);
+
   return {
     tableCounts: {
-      executeCount,
+      // executeCount,
       migrationCount,
       transactionsCount,
       relatedProposalsCount,
     },
-    refetchExecute,
+    // refetchExecute,
     refetchMigration,
     refetchTransactions,
     refetchRelatedProposals,

src/lib/pages/admin/index.tsx

@@ -109,7 +109,7 @@ const UpdateAdmin = () => {
    * @remarks Contract admin validation
    */
   useQuery(
-    ["query", "instantiateInfo", endpoint, contractAddressParam],
+    ["query", "instantiate_info", endpoint, contractAddressParam],
     async () =>
       queryInstantiateInfo(endpoint, indexerGraphClient, contractAddressParam),
     {

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

@@ -34,7 +34,7 @@ const RenderPortId = ({ portId }: { portId: string }) => {
     >
       {charArray?.map((line, idx) =>
         idx === charArray.length - 1 ? (
-          <Flex align="center">
+          <Flex align="center" key={line}>
             {line}
             <Copier value={portId} className="ibc-port-copy" display="none" />
           </Flex>
@@ -48,6 +48,7 @@ const RenderPortId = ({ portId }: { portId: string }) => {
 
 export const InstantiateInfo = ({
   contractData: {
+    contractCw2Info,
     instantiateInfo,
     chainId,
     codeInfo,
@@ -84,6 +85,18 @@ export const InstantiateInfo = ({
         />
       </LabelText>
 
+      <LabelText label="CW2 Info">
+        {contractCw2Info ? (
+          <Text variant="body2">
+            {contractCw2Info.contract} ({contractCw2Info.version})
+          </Text>
+        ) : (
+          <Text variant="body2" color="text.dark">
+            No Info
+          </Text>
+        )}
+      </LabelText>
+
       <LabelText
         label="Admin Address"
         helperText1={

src/lib/pages/contract-details/components/tables/migration/index.tsx

@@ -68,9 +68,15 @@ export const MigrationTable = ({
   return (
     <TableContainer>
       <MigrationHeader templateColumns={templateColumns} />
-      {migrationHistories.map((history) => (
+      {migrationHistories.map((history, idx) => (
         <MigrationRow
-          key={history.codeId}
+          key={
+            history.codeId +
+            history.remark.operation +
+            history.remark.type +
+            history.remark.value +
+            idx.toString()
+          }
           history={history}
           templateColumns={templateColumns}
         />

src/lib/pages/contract-details/index.tsx

@@ -26,7 +26,6 @@ import { ContractDesc } from "./components/contract-description";
 import { ContractTop } from "./components/ContractTop";
 import { InstantiateInfo } from "./components/InstantiateInfo";
 import { JsonInfo } from "./components/JsonInfo";
-import { ExecuteTable } from "./components/tables/execute";
 import { MigrationTable } from "./components/tables/migration";
 import { RelatedProposalsTable } from "./components/tables/related-proposals";
 import { TransactionsTable } from "./components/tables/transactions";
@@ -44,7 +43,6 @@ const ContractDetailsBody = observer(
     const tableHeaderId = "contractDetailTableHeader";
     const {
       tableCounts,
-      refetchExecute,
       refetchMigration,
       refetchTransactions,
       refetchRelatedProposals,
@@ -79,7 +77,7 @@ const ContractDetailsBody = observer(
               jsonAreaHeight="180px"
             />
             <JsonInfo
-              header="Instantiate Messages"
+              header="Instantiate Message"
               jsonString={jsonPrettify(contractData.initMsg ?? "")}
               showViewFullButton
               defaultExpand
@@ -95,7 +93,7 @@ const ContractDetailsBody = observer(
             <CustomTab count={tableCounts.transactionsCount}>
               Transactions
             </CustomTab>
-            <CustomTab count={tableCounts.executeCount}>Executes</CustomTab>
+            {/* <CustomTab count={tableCounts.executeCount}>Executes</CustomTab> */}
             <CustomTab count={tableCounts.migrationCount}>Migration</CustomTab>
             <CustomTab count={tableCounts.relatedProposalsCount}>
               Related Proposals
@@ -110,14 +108,15 @@ const ContractDetailsBody = observer(
                 refetchCount={refetchTransactions}
               />
             </TabPanel>
-            <TabPanel p={0}>
+            {/* Remove execute table for now */}
+            {/* <TabPanel p={0}>
               <ExecuteTable
                 contractAddress={contractAddress}
                 scrollComponentId={tableHeaderId}
                 totalData={tableCounts.executeCount}
                 refetchCount={refetchExecute}
               />
-            </TabPanel>
+            </TabPanel> */}
             <TabPanel p={0}>
               <MigrationTable
                 contractAddress={contractAddress}

src/lib/pages/execute/index.tsx

@@ -12,9 +12,9 @@ import PageContainer from "lib/components/PageContainer";
 import type { ContractAddr } from "lib/types";
 import {
   getFirstQueryParam,
-  decode,
   jsonPrettify,
   jsonValidate,
+  libDecode,
 } from "lib/utils";
 
 import { ExecuteArea } from "./components/ExecuteArea";
@@ -61,7 +61,7 @@ const Execute = () => {
         router.query.contract
       ) as ContractAddr;
 
-      let decodeMsg = decode(getFirstQueryParam(router.query.msg));
+      let decodeMsg = libDecode(getFirstQueryParam(router.query.msg));
       if (decodeMsg && jsonValidate(decodeMsg) !== null) {
         onContractSelect(contractAddressParam);
         decodeMsg = "";