Merge pull request #336 from alleslabs/refactor/config-example-addr

Use address type length from example addresses instead of hardcode
alleslabs · May 25, 2023 · 1ad3bc0 · 1ad3bc0
2 parents cd0d606 + 0cf20e0
commit 1ad3bc0
Show file tree

Hide file tree

Showing 6 changed files with 124 additions and 107 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -65,6 +65,7 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
 
 ### Improvements
 
+- [#336](https://github.com/alleslabs/celatone-frontend/pull/336) Get address type length from example addresses instead of hardcode
 - [#354](https://github.com/alleslabs/celatone-frontend/pull/354) Remove useChainId and use currentChainId from config
 - [#338](https://github.com/alleslabs/celatone-frontend/pull/338) Use gas from chain config
 - [#333](https://github.com/alleslabs/celatone-frontend/pull/333) Update endpoints including LCD, RPC, Graphql

diff --git a/src/lib/app-provider/hooks/useAddress.ts b/src/lib/app-provider/hooks/useAddress.ts
@@ -1,8 +1,9 @@
 import { fromBech32 } from "@cosmjs/encoding";
 import type { ChainRecord } from "@cosmos-kit/core";
 import { useWallet } from "@cosmos-kit/react";
-import { useCallback } from "react";
+import { useCallback, useMemo } from "react";
 
+import { useCelatoneApp } from "../contexts";
 import type { Option } from "lib/types";
 
 export type AddressReturnType =
@@ -11,38 +12,35 @@ export type AddressReturnType =
   | "validator_address"
   | "invalid_address";
 
-const addressLengthMap: {
-  [key: string]: { [length: number]: AddressReturnType };
-} = {
-  osmosis: {
-    43: "user_address",
-    50: "validator_address",
-    63: "contract_address",
-  },
-  osmosistestnet: {
-    43: "user_address",
-    50: "validator_address",
-    63: "contract_address",
-  },
-  terra2: {
-    44: "user_address",
-    51: "validator_address",
-    64: "contract_address",
-  },
-  terra2testnet: {
-    44: "user_address",
-    51: "validator_address",
-    64: "contract_address",
-  },
+export const useGetAddressTypeByLength = () => {
+  const {
+    chainConfig: { exampleAddresses },
+  } = useCelatoneApp();
+  const addressLengthMap = useMemo(
+    () =>
+      Object.entries(exampleAddresses).reduce<{
+        [key: number]: AddressReturnType;
+      }>(
+        (acc, curr) => ({
+          ...acc,
+          [curr[1].length]: `${curr[0]}_address` as AddressReturnType,
+        }),
+        {}
+      ),
+    [exampleAddresses]
+  );
+  return useCallback(
+    (address: Option<string>): AddressReturnType =>
+      address
+        ? addressLengthMap[address.length] ?? "invalid_address"
+        : "invalid_address",
+    [addressLengthMap]
+  );
 };
 
-export const getAddressTypeByLength = (
-  chainName: string,
-  address: Option<string>
-): AddressReturnType =>
-  address
-    ? addressLengthMap[chainName]?.[address.length] ?? "invalid_address"
-    : "invalid_address";
+export type GetAddressTypeByLengthFn = ReturnType<
+  typeof useGetAddressTypeByLength
+>;
 
 const getPrefix = (basePrefix: string, addressType: AddressReturnType) => {
   if (addressType === "validator_address") return `${basePrefix}valoper`;
@@ -52,7 +50,8 @@ const getPrefix = (basePrefix: string, addressType: AddressReturnType) => {
 const validateAddress = (
   currentChainRecord: ChainRecord | undefined,
   address: string,
-  addressType: AddressReturnType
+  addressType: AddressReturnType,
+  getAddressTypeByLength: GetAddressTypeByLengthFn
 ) => {
   if (!currentChainRecord) return "Invalid network";
 
@@ -61,7 +60,7 @@ const validateAddress = (
   if (!address.startsWith(prefix))
     return `Invalid prefix (expected "${prefix}")`;
 
-  if (getAddressTypeByLength(currentChainRecord.name, address) !== addressType)
+  if (getAddressTypeByLength(address) !== addressType)
     return "Invalid address length";
 
   try {
@@ -73,41 +72,63 @@ const validateAddress = (
 };
 
 export const useGetAddressType = () => {
-  const { currentChainName, currentChainRecord } = useWallet();
+  const { currentChainRecord } = useWallet();
+  const getAddressTypeByLength = useGetAddressTypeByLength();
   return useCallback(
     (address: Option<string>): AddressReturnType => {
-      const addressType = getAddressTypeByLength(currentChainName, address);
+      const addressType = getAddressTypeByLength(address);
       if (
         !address ||
         addressType === "invalid_address" ||
-        validateAddress(currentChainRecord, address, addressType)
+        validateAddress(
+          currentChainRecord,
+          address,
+          addressType,
+          getAddressTypeByLength
+        )
       )
         return "invalid_address";
       return addressType;
     },
-    [currentChainName, currentChainRecord]
+    [currentChainRecord, getAddressTypeByLength]
   );
 };
 
 // TODO: refactor
 export const useValidateAddress = () => {
   const { currentChainRecord } = useWallet();
+  const getAddressTypeByLength = useGetAddressTypeByLength();
 
   return {
     validateContractAddress: useCallback(
       (address: string) =>
-        validateAddress(currentChainRecord, address, "contract_address"),
-      [currentChainRecord]
+        validateAddress(
+          currentChainRecord,
+          address,
+          "contract_address",
+          getAddressTypeByLength
+        ),
+      [currentChainRecord, getAddressTypeByLength]
     ),
     validateUserAddress: useCallback(
       (address: string) =>
-        validateAddress(currentChainRecord, address, "user_address"),
-      [currentChainRecord]
+        validateAddress(
+          currentChainRecord,
+          address,
+          "user_address",
+          getAddressTypeByLength
+        ),
+      [currentChainRecord, getAddressTypeByLength]
     ),
     validateValidatorAddress: useCallback(
       (address: string) =>
-        validateAddress(currentChainRecord, address, "validator_address"),
-      [currentChainRecord]
+        validateAddress(
+          currentChainRecord,
+          address,
+          "validator_address",
+          getAddressTypeByLength
+        ),
+      [currentChainRecord, getAddressTypeByLength]
     ),
   };
 };
diff --git a/src/lib/components/modal/UnsupportedTokensModal.tsx b/src/lib/components/modal/UnsupportedTokensModal.tsx
@@ -13,13 +13,12 @@ import {
   Heading,
   Tooltip,
 } from "@chakra-ui/react";
-import { useWallet } from "@cosmos-kit/react";
 import { useMemo } from "react";
 
 import { ExplorerLink } from "../ExplorerLink";
 import type { IconKeys } from "../icon";
 import { CustomIcon } from "../icon";
-import { useGetAddressType, getAddressTypeByLength } from "lib/app-provider";
+import { useGetAddressType, useGetAddressTypeByLength } from "lib/app-provider";
 import type { AddressReturnType } from "lib/app-provider";
 import { Copier } from "lib/components/copy";
 import { AmpTrackUnsupportedToken } from "lib/services/amplitude";
@@ -152,12 +151,12 @@ export const UnsupportedTokensModal = ({
   buttonProps,
   amptrackSection,
 }: UnsupportedTokensModalProps) => {
-  const { currentChainName } = useWallet();
   const { isOpen, onOpen, onClose } = useDisclosure();
+  const getAddressTypeByLength = useGetAddressTypeByLength();
 
   if (unsupportedAssets.length === 0) return null;
 
-  const addressType = getAddressTypeByLength(currentChainName, address);
+  const addressType = getAddressTypeByLength(address);
   const content = unsupportedTokensContent(addressType);
 
   return (