Merge branch 'develop' into feat/overview-new-action

CHANGELOG.md

@@ -40,21 +40,18 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 ### Features
 
 - [#102](https://github.com/alleslabs/celatone-frontend/pull/102) Add quick menu in overview and add highlighted in left sidebar
+- [#125](https://github.com/alleslabs/celatone-frontend/pull/125) Add connect wallet alert in instantiate page
+- [#126](https://github.com/alleslabs/celatone-frontend/pull/126) Add port id copier for IBC port id
+- [#76](https://github.com/alleslabs/celatone-frontend/pull/76) Add Public projects page
 - [#116](https://github.com/alleslabs/celatone-frontend/pull/116) Support Terra2.0 mainnet and testnet
 - [#94](https://github.com/alleslabs/celatone-frontend/pull/94) Add unsupported assets in contract details page
-- [#72](https://github.com/alleslabs/celatone-frontend/pull/72) Fix general wording and grammar
-- [#110](https://github.com/alleslabs/celatone-frontend/pull/110) Fix proposal detail rendering
-- [#109](https://github.com/alleslabs/celatone-frontend/pull/109) Fix incorrect rendering of zero value badges
 - [#106](https://github.com/alleslabs/celatone-frontend/pull/106) Add sort alphabetically to query and execute shortcuts
 - [#88](https://github.com/alleslabs/celatone-frontend/pull/88) Add code snippet for query and execute
 - [#107](https://github.com/alleslabs/celatone-frontend/pull/107) Remove osmosis mainnet from chain list
 - [#99](https://github.com/alleslabs/celatone-frontend/pull/99) Validate label and codeId field in instantiate page
 - [#103](https://github.com/alleslabs/celatone-frontend/pull/103) Add check mark to selected network
 - [#92](https://github.com/alleslabs/celatone-frontend/pull/92) Create select contract component for admin and migrate pages
-- [#101](https://github.com/alleslabs/celatone-frontend/pull/101) Fix incorrect truncating of proposal id in contract detail's migration table
-- [#100](https://github.com/alleslabs/celatone-frontend/pull/100) Fix contract instantiated time parsing
 - [#97](https://github.com/alleslabs/celatone-frontend/pull/97) Change label style to always afloat
-- [#96](https://github.com/alleslabs/celatone-frontend/pull/96) Fix incorrect instantiated block height explorer link
 - [#95](https://github.com/alleslabs/celatone-frontend/pull/95) Add network to url path
 - [#89](https://github.com/alleslabs/celatone-frontend/pull/89) Update feedback link
 - [#90](https://github.com/alleslabs/celatone-frontend/pull/90) Add update admin (`/admin`) and migrate (`/migrate`) page routes
@@ -63,20 +60,17 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 - [#81](https://github.com/alleslabs/celatone-frontend/pull/81) Can scroll on side bar with fix deploy new contract button
 - [#86](https://github.com/alleslabs/celatone-frontend/pull/86) Add transactions table in contract details page
 - [#74](https://github.com/alleslabs/celatone-frontend/pull/74) Add tokens rendering for contract details page
-- [#87](https://github.com/alleslabs/celatone-frontend/pull/87) Fix funds didn't microfy before sending tx
 - [#85](https://github.com/alleslabs/celatone-frontend/pull/85) Add sending asset in execute contract page
 - [#84](https://github.com/alleslabs/celatone-frontend/pull/84) Contract proposals table ui and wireup
 - [#82](https://github.com/alleslabs/celatone-frontend/pull/82) Add all codes page
 - [#83](https://github.com/alleslabs/celatone-frontend/pull/83) Add invalid code state
 - [#73](https://github.com/alleslabs/celatone-frontend/pull/73) Wireup migration table
 - [#77](https://github.com/alleslabs/celatone-frontend/pull/77) Wireup code info section in code details page
-- [#80](https://github.com/alleslabs/celatone-frontend/pull/80) Fix the misalignment of state in the PastTx page
 - [#70](https://github.com/alleslabs/celatone-frontend/pull/70) Change default token denom on contract detail
 - [#78](https://github.com/alleslabs/celatone-frontend/pull/78) Ignore building step when branch is not main
 - [#62](https://github.com/alleslabs/celatone-frontend/pull/62) Add footer
 - [#71](https://github.com/alleslabs/celatone-frontend/pull/71) Add search bar at the top (currently support only contract address and code id)
 - [#69](https://github.com/alleslabs/celatone-frontend/pull/69) Add execute table in contract details page
-- [#68](https://github.com/alleslabs/celatone-frontend/pull/63) Refactor past txs link props and make sure navigation works
 - [#65](https://github.com/alleslabs/celatone-frontend/pull/60) Create instantiate button component
 - [#64](https://github.com/alleslabs/celatone-frontend/pull/64) Add contract not exist page
 - [#63](https://github.com/alleslabs/celatone-frontend/pull/63) Add code id explorer link and code table row navigation
@@ -102,15 +96,30 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Improvements
 
+- [#114](https://github.com/alleslabs/celatone-frontend/pull/114) Handle wallet connection cases in instantiate button
+- [#115](https://github.com/alleslabs/celatone-frontend/pull/115) (Contract Details Page) Show no admin and correctly handle explorer link by address type
+- [#68](https://github.com/alleslabs/celatone-frontend/pull/68) Refactor past txs link props and make sure navigation works
 - [#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
 - [#50](https://github.com/alleslabs/celatone-frontend/pull/50) Refactor offchain component to use react-form and remove redundant offchain components, and refactor edit contract details modal
 
 ### Bug fixes
 
+- [#122](https://github.com/alleslabs/celatone-frontend/pull/122) Fix unknown code upload block height
+- [#121](https://github.com/alleslabs/celatone-frontend/pull/121) Fix code snippet for query axios
+- [#119](https://github.com/alleslabs/celatone-frontend/pull/119) Fix searching and project ordering in public projects page
+- [#118](https://github.com/alleslabs/celatone-frontend/pull/118) Fix floating tooltip when scrolling out of copy button
 - [#111](https://github.com/alleslabs/celatone-frontend/pull/111) Fix recent activities navigation and instantiate encode/decode
 - [#105](https://github.com/alleslabs/celatone-frontend/pull/105) Propoerly show instantiator of code contracts and contract in the instantiated list
+- [#72](https://github.com/alleslabs/celatone-frontend/pull/72) Fix general wording and grammar
+- [#110](https://github.com/alleslabs/celatone-frontend/pull/110) Fix proposal detail rendering
+- [#109](https://github.com/alleslabs/celatone-frontend/pull/109) Fix incorrect rendering of zero value badges
+- [#101](https://github.com/alleslabs/celatone-frontend/pull/101) Fix incorrect truncating of proposal id in contract detail's migration table
+- [#100](https://github.com/alleslabs/celatone-frontend/pull/100) Fix contract instantiated time parsing
+- [#96](https://github.com/alleslabs/celatone-frontend/pull/96) Fix incorrect instantiated block height explorer link
+- [#87](https://github.com/alleslabs/celatone-frontend/pull/87) Fix funds didn't microfy before sending tx
+- [#80](https://github.com/alleslabs/celatone-frontend/pull/80) Fix the misalignment of state in the PastTx page
 - [#42](https://github.com/alleslabs/celatone-frontend/pull/42) Properly show CTAs on contract-list page and edit zero/disconnected state
 - [#45](https://github.com/alleslabs/celatone-frontend/pull/45) Add chain ID and code details to contract detail data loader
 

src/env.ts

@@ -79,3 +79,13 @@ export const getChainApiPath = (chainName: string) => {
       return undefined;
   }
 };
+// TODO to handle testnet separately later
+export const getMainnetApiPath = (chainId: string) => {
+  switch (chainId) {
+    case "osmo-test-4":
+    case "osmosis":
+      return "osmosis-1";
+    default:
+      return undefined;
+  }
+};

src/lib/app-provider/contexts/app.tsx

@@ -14,7 +14,11 @@ import {
 } from "lib/app-fns/explorer";
 import { LoadingOverlay } from "lib/components/LoadingOverlay";
 import { DEFAULT_ADDRESS, getChainNameByNetwork } from "lib/data";
-import { useCodeStore, useContractStore } from "lib/hooks";
+import {
+  useCodeStore,
+  useContractStore,
+  usePublicProjectStore,
+} from "lib/hooks";
 import type { ChainGasPrice, Token, U } from "lib/types";
 import { formatUserKey } from "lib/utils";
 
@@ -64,6 +68,7 @@ export const AppProvider = <ContractAddress, Constants extends AppConstants>({
   const { currentChainName, currentChainRecord, setCurrentChain } = useWallet();
   const { setCodeUserKey, isCodeUserKeyExist } = useCodeStore();
   const { setContractUserKey, isContractUserKeyExist } = useContractStore();
+  const { setProjectUserKey, isProjectUserKeyExist } = usePublicProjectStore();
 
   const chainGasPrice = useMemo(() => {
     if (
@@ -111,8 +116,9 @@ export const AppProvider = <ContractAddress, Constants extends AppConstants>({
       const userKey = formatUserKey(currentChainName, DEFAULT_ADDRESS);
       setCodeUserKey(userKey);
       setContractUserKey(userKey);
+      setProjectUserKey(userKey);
     }
-  }, [currentChainName, setCodeUserKey, setContractUserKey]);
+  }, [currentChainName, setCodeUserKey, setContractUserKey, setProjectUserKey]);
 
   useEffect(() => {
     /**
@@ -128,7 +134,11 @@ export const AppProvider = <ContractAddress, Constants extends AppConstants>({
   }, [router.query.network, setCurrentChain]);
 
   const AppContent = observer(() => {
-    if (isCodeUserKeyExist() && isContractUserKeyExist())
+    if (
+      isCodeUserKeyExist() &&
+      isContractUserKeyExist() &&
+      isProjectUserKeyExist()
+    )
       return (
         <AppContext.Provider value={states}>{children}</AppContext.Provider>
       );

src/lib/components/AppLink.tsx

@@ -18,7 +18,9 @@ export const AppLink = ({
       }
     >
       {typeof children === "string" ? (
-        <Text color={linkProps.color}>{children}</Text>
+        <Text variant="body2" color={linkProps.color}>
+          {children}
+        </Text>
       ) : (
         children
       )}

src/lib/components/Copier.tsx

@@ -1,13 +1,21 @@
 import { CopyIcon } from "@chakra-ui/icons";
+import type { LayoutProps } from "@chakra-ui/react";
 import { Tooltip, useClipboard } from "@chakra-ui/react";
 import { useEffect } from "react";
 
 interface CopierProps {
   value: string;
   ml?: string;
+  className?: string;
+  display?: LayoutProps["display"];
 }
 
-export const Copier = ({ value, ml = "8px" }: CopierProps) => {
+export const Copier = ({
+  value,
+  ml = "8px",
+  className,
+  display = "flex",
+}: CopierProps) => {
   const { onCopy, hasCopied, setValue } = useClipboard(value);
 
   useEffect(() => setValue(value), [value, setValue]);
@@ -21,17 +29,20 @@ export const Copier = ({ value, ml = "8px" }: CopierProps) => {
       arrowSize={8}
       bg="primary.dark"
     >
-      <CopyIcon
-        display="flex"
-        boxSize="16px"
-        color="text.dark"
-        cursor="pointer"
-        marginLeft={ml}
-        onClick={(e) => {
-          e.stopPropagation();
-          onCopy();
-        }}
-      />
+      <div>
+        <CopyIcon
+          className={className}
+          display={display}
+          boxSize="16px"
+          color="text.dark"
+          cursor="pointer"
+          marginLeft={ml}
+          onClick={(e) => {
+            e.stopPropagation();
+            onCopy();
+          }}
+        />
+      </div>
     </Tooltip>
   );
 };

src/lib/components/ExplorerLink.tsx

@@ -139,14 +139,16 @@ export const ExplorerLink = ({
 
   return (
     <Box
-      role="group"
       display="inline-flex"
       alignItems="center"
       _hover={{
         ...(!readOnly && {
           textDecoration: "underline",
           textDecorationColor: "primary.main",
         }),
+        "& .copy-button": {
+          display: "flex",
+        },
       }}
       {...componentProps}
     >
@@ -161,13 +163,12 @@ export const ExplorerLink = ({
             isEllipsis={textFormat === "ellipsis"}
             maxWidth={maxWidth}
           />
-          <Box
-            alignItems="center"
-            display={canCopyWithHover ? "none" : undefined}
-            _groupHover={canCopyWithHover ? { display: "flex" } : undefined}
-          >
-            <Copier value={copyValue || value} ml="8px" />
-          </Box>
+          <Copier
+            value={copyValue || value}
+            ml="8px"
+            className="copy-button"
+            display={canCopyWithHover ? "none" : "flex"}
+          />
         </>
       )}
     </Box>

src/lib/components/button/InstantiateButton.tsx

@@ -23,27 +23,35 @@ const StyledIcon = chakra(Icon, {
 
 const getInstantiateButtonProps = (
   isAllowed: boolean,
-  isDisabled: boolean
+  isUnknown: boolean,
+  isWalletConnected: boolean
 ): {
   tooltipLabel: string;
   variant: string;
   icon: JSX.Element | undefined;
 } => {
+  if (isUnknown) {
+    return {
+      tooltipLabel: "",
+      variant: "outline-gray",
+      icon: undefined,
+    };
+  }
   if (isAllowed) {
     return {
-      tooltipLabel: isDisabled
-        ? "You need to connect wallet to instantiate"
-        : "You can instantiate without opening proposal",
+      tooltipLabel: isWalletConnected
+        ? "You can instantiate without opening proposal"
+        : "You need to connect wallet to instantiate contract",
       variant: "outline-primary",
       icon: <StyledIcon as={MdPerson} />,
     };
   }
   return {
-    tooltipLabel: isDisabled
-      ? ""
-      : "Instantiate through proposal only (Coming Soon)",
+    tooltipLabel: isWalletConnected
+      ? "Instantiate through proposal only (Coming Soon)"
+      : "You need to connect wallet to open instantiate proposal",
     variant: "outline-gray",
-    icon: isDisabled ? undefined : <StyledIcon as={MdHowToVote} />,
+    icon: <StyledIcon as={MdHowToVote} />,
   };
 };
 
@@ -53,20 +61,26 @@ export const InstantiateButton = ({
   codeId,
   ...buttonProps
 }: InstantiateButtonProps) => {
-  const { address } = useWallet();
+  const { address, isWalletConnected } = useWallet();
   const navigate = useInternalNavigate();
   const goToInstantiate = () =>
     navigate({ pathname: "/instantiate", query: { "code-id": codeId } });
 
   const isAllowed =
     permissionAddresses.includes(address as HumanAddr) ||
     instantiatePermission === InstantiatePermission.EVERYBODY;
-  const isDisabled =
-    instantiatePermission === InstantiatePermission.UNKNOWN || !address;
+
+  /**
+   * @todos use isDisabled when proposal flow is done
+   */
+  // const isDisabled =
+  //   instantiatePermission === InstantiatePermission.UNKNOWN ||
+  //   !isWalletConnected;
 
   const { tooltipLabel, variant, icon } = getInstantiateButtonProps(
     isAllowed,
-    isDisabled
+    instantiatePermission === InstantiatePermission.UNKNOWN,
+    isWalletConnected
   );
 
   return (
@@ -79,7 +93,7 @@ export const InstantiateButton = ({
     >
       <Button
         // Change to isDisabled when create proposal flow is done
-        disabled={!isAllowed}
+        disabled={!isAllowed || !isWalletConnected}
         // disabled={isDisabled}
         variant={variant}
         leftIcon={icon}

src/lib/components/modal/CodeSnippet.tsx

@@ -120,9 +120,10 @@ queryContract(rpcURL, contractAddress, queryMsg);`,
 const lcdURL = '${endpoint}';
 const contractAddress =
 "${contractAddress}";
-const queryMsg = \`${message}\`;\n
+const queryMsg = ${message};\n
 const queryContract = async () => {
   const queryB64Encoded = Buffer.from(JSON.stringify(queryMsg)).toString('base64');
+  const res = await axios.get(\`$\{lcdURL}/cosmwasm/wasm/v1/contract/$\{contractAddress}/smart/$\{queryB64Encoded}\`);
   console.log(res.data);
 };\n
 queryContract();`,

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

@@ -201,7 +201,7 @@ export function SaveNewContract({ list, buttonProps }: SaveNewContractProps) {
         <ControllerInput
           name="instantiator"
           control={control}
-          label="Instantiator"
+          label="Instantiated by"
           variant="floating"
           isDisabled
           labelBgColor="gray.800"

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

@@ -1,5 +1,6 @@
 import { Box, SimpleGrid } from "@chakra-ui/react";
 import { useMemo, useState } from "react";
+import { MdSearchOff } from "react-icons/md";
 
 import { TextInput } from "lib/components/forms";
 import { EmptyState } from "lib/components/state/EmptyState";
@@ -42,7 +43,10 @@ export const AllContractLists = ({
         mb={isReadOnly ? 4 : 12}
       />
       {filteredContractLists.length === 0 ? (
-        <EmptyState message="None of your lists matches this search." />
+        <EmptyState
+          message="None of your lists matches this search."
+          icon={MdSearchOff}
+        />
       ) : (
         <SimpleGrid columns={{ sm: 1, md: 2, lg: 3 }} spacing={4} w="full">
           {filteredContractLists.map((item) => (

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

@@ -1,6 +1,7 @@
 import { Box, Flex } from "@chakra-ui/react";
 import { matchSorter } from "match-sorter";
 import { useMemo, useState } from "react";
+import { MdSearchOff } from "react-icons/md";
 
 import { TagSelection, TextInput } from "lib/components/forms";
 import { EmptyState } from "lib/components/state/EmptyState";
@@ -26,6 +27,7 @@ const FilteredListDetail = ({
   if (contracts.length === 0)
     return (
       <EmptyState
+        icon={MdSearchOff}
         message="No contracts match found. 
         Make sure you are searching with contract address, name, or description."
       />