feat: parse GRC20 information from Realm file contents as well

Author: jinoosss

packages/adena-extension/src/common/utils/parse-utils.ts

@@ -7,12 +7,16 @@ export const parseGRC20ByABCIRender = (
   totalSupply: bigint;
   knownAccounts: bigint;
 } => {
+  if (!response) {
+    throw new Error('failed parse grc20 token render');
+  }
+
   const regex =
     /#\s(?<tokenName>.+)\s\(\$(?<tokenSymbol>.+)\)\s*\* \*\*Decimals\*\*: (?<tokenDecimals>\d+)\s*\* \*\*Total supply\*\*: (?<totalSupply>\d+)\s*\* \*\*Known accounts\*\*: (?<knownAccounts>\d+)/;
 
   const match = response.match(regex);
 
-  if (!match || !match.groups) {
+  if (!match || !match?.groups) {
     throw new Error('failed parse grc20 token render');
   }
 
@@ -60,3 +64,34 @@ export const parseReamPathItemsByPath = (
     remainPath: remainPathItems.join('/'),
   };
 };
+
+export const parseGRC20ByFileContents = (
+  contents: string,
+): {
+  tokenName: string;
+  tokenSymbol: string;
+  tokenDecimals: number;
+} | null => {
+  const newBankerRegex = /grc20\.NewBanker\(([^)]+)\)/;
+  const match = contents.match(newBankerRegex);
+  const matchLine = match?.[1] || null;
+
+  if (!matchLine) {
+    return null;
+  }
+
+  const args = matchLine.split(',').map((arg) => arg.trim());
+  if (args.length < 3) {
+    return null;
+  }
+
+  const tokenName = args[0].startsWith('"') ? args[0].slice(1, -1) : args[0];
+  const tokenSymbol = args[1].startsWith('"') ? args[1].slice(1, -1) : args[1];
+  const tokenDecimals = isNaN(Number(args[2])) ? 0 : Number(args[2]);
+
+  return {
+    tokenName,
+    tokenSymbol,
+    tokenDecimals,
+  };
+};

packages/adena-extension/src/pages/popup/wallet/manage-token-added/index.tsx

@@ -1,10 +1,13 @@
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 
+import { TokenValidationError } from '@common/errors';
 import { parseReamPathItemsByPath } from '@common/utils/parse-utils';
+import { isGRC20TokenModel } from '@common/validation';
 import AdditionalToken from '@components/pages/additional-token/additional-token';
 import { AddingType } from '@components/pages/additional-token/additional-token-type-selector';
 import { ManageTokenLayout } from '@components/pages/manage-token-layout';
 import useAppNavigate from '@hooks/use-app-navigate';
+import { useDebounce } from '@hooks/use-debounce';
 import { useGRC20Token } from '@hooks/use-grc20-token';
 import { useGRC20Tokens } from '@hooks/use-grc20-tokens';
 import { useNetwork } from '@hooks/use-network';
@@ -23,50 +26,63 @@ const ManageTokenAddedContainer: React.FC = () => {
   const [addingType, setAddingType] = useState(AddingType.SEARCH);
   const [manualTokenPath, setManualTokenPath] = useState('');
 
-  useEffect(() => {
-    document.body.addEventListener('click', closeSelectBox);
-    return () => document.body.removeEventListener('click', closeSelectBox);
-  }, [document.body]);
-
-  useEffect(() => {
-    if (finished) {
-      goBack();
-    }
-  }, [finished]);
-
   const { data: grc20Tokens } = useGRC20Tokens();
 
+  const {
+    debouncedValue: debouncedManualTokenPath,
+    setDebouncedValue: setDebouncedManualTokenPath,
+    isLoading: isLoadingDebounce,
+  } = useDebounce(manualTokenPath, 500);
   const { data: manualGRC20Token, isFetching: isFetchingManualGRC20Token } =
-    useGRC20Token(manualTokenPath);
+    useGRC20Token(debouncedManualTokenPath);
+
+  const isValidManualGRC20Token = useMemo(() => {
+    if (manualTokenPath === '') {
+      return true;
+    }
 
-  const isValidManualGRC20TokenPath = useMemo(() => {
     try {
       parseReamPathItemsByPath(manualTokenPath);
+      return true;
     } catch {
       return false;
     }
-    return true;
   }, [manualTokenPath]);
 
-  const isLoadingManualGRC20Token = useMemo(() => {
-    if (!isValidManualGRC20TokenPath) {
-      return false;
+  const errorManualGRC20Token = useMemo(() => {
+    if (manualTokenPath === '') {
+      return null;
     }
 
-    return isFetchingManualGRC20Token;
-  }, [isValidManualGRC20TokenPath, isFetchingManualGRC20Token]);
+    if (!isValidManualGRC20Token || !manualGRC20Token) {
+      return new TokenValidationError('INVALID_REALM_PATH');
+    }
+
+    const isRegistered = tokenMetainfos.some((tokenMetaInfo) => {
+      if (tokenMetaInfo.tokenId === manualTokenPath) {
+        return true;
+      }
+
+      if (isGRC20TokenModel(tokenMetaInfo)) {
+        return tokenMetaInfo.pkgPath === manualTokenPath;
+      }
 
-  const isErrorManualGRC20Token = useMemo(() => {
-    if (manualTokenPath === '') {
       return false;
+    });
+    if (isRegistered) {
+      return new TokenValidationError('ALREADY_ADDED');
     }
 
-    if (isLoadingManualGRC20Token) {
+    return null;
+  }, [tokenMetainfos, isLoadingDebounce, manualGRC20Token, manualTokenPath]);
+
+  const isLoadingManualGRC20Token = useMemo(() => {
+    if (!isValidManualGRC20Token) {
       return false;
     }
 
-    return manualGRC20Token === null;
-  }, [isLoadingManualGRC20Token, manualTokenPath, manualGRC20Token]);
+    return isLoadingDebounce || isFetchingManualGRC20Token;
+  }, [isValidManualGRC20Token, isLoadingDebounce, isFetchingManualGRC20Token]);
 
   const tokenInfos: TokenInfo[] = useMemo(() => {
     if (!grc20Tokens) {
@@ -120,6 +136,7 @@ const ManageTokenAddedContainer: React.FC = () => {
     setAddingType(addingType);
     setKeyword('');
     setManualTokenPath('');
+    setDebouncedManualTokenPath('');
     setSelectedTokenInfo(null);
     setOpened(false);
     setSelected(false);
@@ -144,6 +161,10 @@ const ManageTokenAddedContainer: React.FC = () => {
   }, []);
 
   const onClickAdd = useCallback(async () => {
+    if (errorManualGRC20Token) {
+      return;
+    }
+
     if (!selected || !selectedTokenInfo || finished) {
       return;
     }
@@ -152,6 +173,17 @@ const ManageTokenAddedContainer: React.FC = () => {
     setFinished(true);
   }, [selected, selectedTokenInfo, finished]);
 
+  useEffect(() => {
+    document.body.addEventListener('click', closeSelectBox);
+    return () => document.body.removeEventListener('click', closeSelectBox);
+  }, [document.body]);
+
+  useEffect(() => {
+    if (finished) {
+      goBack();
+    }
+  }, [finished]);
+
   useEffect(() => {
     if (addingType === AddingType.SEARCH) {
       return;
@@ -189,7 +221,7 @@ const ManageTokenAddedContainer: React.FC = () => {
         tokenInfos={tokenInfos ?? []}
         manualTokenPath={manualTokenPath}
         isLoadingManualGRC20Token={isLoadingManualGRC20Token}
-        isErrorManualGRC20Token={isErrorManualGRC20Token}
+        errorManualGRC20Token={errorManualGRC20Token}
         selectedTokenInfo={selectedTokenInfo}
         selectAddingType={selectAddingType}
         onChangeKeyword={onChangeKeyword}

packages/adena-extension/src/repositories/common/token.ts

@@ -11,7 +11,7 @@ import {
 
 import { GnoProvider } from '@common/provider/gno/gno-provider';
 import { makeRPCRequest } from '@common/utils/fetch-utils';
-import { parseGRC20ByABCIRender } from '@common/utils/parse-utils';
+import { parseGRC20ByABCIRender, parseGRC20ByFileContents } from '@common/utils/parse-utils';
 import {
   GRC20TokenModel,
   IBCNativeTokenModel,
@@ -180,22 +180,28 @@ export class TokenRepository {
       throw new Error('Gno provider not initialized.');
     }
 
-    const { tokenName, tokenSymbol, tokenDecimals } = await this.gnoProvider
-      .getRenderOutput(packagePath, '')
-      .then(parseGRC20ByABCIRender);
+    const fileContents = await this.gnoProvider.getFileContent(packagePath).catch(() => null);
+    const fileNames = fileContents?.split('\n') || [];
 
-    return {
-      main: false,
-      tokenId: packagePath,
-      pkgPath: packagePath,
-      networkId: this.networkId,
-      display: false,
-      type: 'grc20',
-      name: tokenName,
-      symbol: tokenSymbol,
-      decimals: tokenDecimals,
-      image: '',
-    };
+    if (fileContents === null || fileNames.length === 0) {
+      throw new Error('Not available realm');
+    }
+
+    const renderTokenInfo = await this.fetchGRC20TokenInfoQueryRender(packagePath).catch(
+      () => null,
+    );
+    if (renderTokenInfo) {
+      return renderTokenInfo;
+    }
+
+    const fileTokenInfo = await this.fetchGRC20TokenInfoQueryFiles(packagePath, fileNames).catch(
+      () => null,
+    );
+    if (fileTokenInfo) {
+      return fileTokenInfo;
+    }
+
+    throw new Error('Realm is not GRC20');
   }
 
   public fetchAllGRC20Tokens = async (): Promise<GRC20TokenModel[]> => {
@@ -284,6 +290,67 @@ export class TokenRepository {
       .catch(() => []);
   };
 
+  private async fetchGRC20TokenInfoQueryRender(
+    packagePath: string,
+  ): Promise<GRC20TokenModel | null> {
+    if (!this.gnoProvider) {
+      throw new Error('Gno provider not initialized.');
+    }
+
+    const { tokenName, tokenSymbol, tokenDecimals } = await this.gnoProvider
+      .getRenderOutput(packagePath, '')
+      .then(parseGRC20ByABCIRender);
+
+    return {
+      main: false,
+      tokenId: packagePath,
+      pkgPath: packagePath,
+      networkId: this.networkId,
+      display: false,
+      type: 'grc20',
+      name: tokenName,
+      symbol: tokenSymbol,
+      decimals: tokenDecimals,
+      image: '',
+    };
+  }
+
+  private async fetchGRC20TokenInfoQueryFiles(
+    packagePath: string,
+    fileNames: string[],
+  ): Promise<GRC20TokenModel | null> {
+    if (!this.gnoProvider) {
+      throw new Error('Gno provider not initialized.');
+    }
+
+    for (const fileName of fileNames) {
+      const filePath = [packagePath, fileName].join('/');
+      const contents = await this.gnoProvider.getFileContent(filePath).catch(() => null);
+      if (!contents) {
+        continue;
+      }
+
+      const tokenInfo = parseGRC20ByFileContents(contents);
+
+      if (tokenInfo) {
+        return {
+          main: false,
+          tokenId: packagePath,
+          pkgPath: packagePath,
+          networkId: this.networkId,
+          display: false,
+          type: 'grc20',
+          name: tokenInfo.tokenName,
+          symbol: tokenInfo.tokenSymbol,
+          decimals: tokenInfo.tokenDecimals,
+          image: '',
+        };
+      }
+    }
+
+    return null;
+  }
+
   private static postRPCRequest = <T = any>(
     axiosInstance: AxiosInstance,
     url: string,