chore: fix some bugs

RabbyHub · Dec 5, 2024 · a5d5b00 · a5d5b00
1 parent 51324ba
commit a5d5b00
Show file tree

Hide file tree

Showing 7 changed files with 42 additions and 26 deletions.
diff --git a/src/background/controller/wallet.ts b/src/background/controller/wallet.ts
@@ -4816,7 +4816,7 @@ export class WalletController extends BaseController {
   isAddedCustomTestnetToken = customTestnetService.hasToken;
   getCustomTestnetTx = customTestnetService.getTx;
   getCustomTestnetTxReceipt = customTestnetService.getTransactionReceipt;
-  getCustomTestnetLogos = () => customTestnetService.fetchLogos;
+  getCustomTestnetLogos = customTestnetService.fetchLogos;
   // getCustomTestnetTokenListWithBalance = customTestnetService.getTokenListWithBalance;
 
   getUsedCustomTestnetChainList = async () => {

diff --git a/src/background/service/customTestnet.ts b/src/background/service/customTestnet.ts
@@ -481,7 +481,7 @@ class CustomTestnetService {
       amount: new BigNumber(balance.toString()).div(10 ** decimals).toNumber(),
       rawAmount: balance.toString(),
       logo:
-        tokenId?.replace('custom_', '') === String(chainId)
+        !tokenId || tokenId?.replace('custom_', '') === String(chainId)
           ? this.logos?.[chainId]?.token_logo_url
           : undefined,
     };
@@ -594,6 +594,7 @@ class CustomTestnetService {
           id: null,
           chainId: item.id,
           symbol: item.nativeTokenSymbol,
+          logo: this.logos?.[item.id]?.token_logo_url,
         };
       }
     );
@@ -711,7 +712,7 @@ export const createTestnetChain = (chain: TestnetChainBase): TestnetChain => {
     nativeTokenDecimals: 18,
     nativeTokenLogo: '',
     scanLink: chain.scanLink || '',
-    logo: `data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><circle cx='16' cy='16' r='16' fill='%236A7587'></circle><text x='16' y='17' dominant-baseline='middle' text-anchor='middle' fill='white' font-size='11' font-weight='500'>${encodeURIComponent(
+    logo: `data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 28 28'><circle cx='14' cy='14' r='14' fill='%236A7587'></circle><text x='14' y='15' dominant-baseline='middle' text-anchor='middle' fill='white' font-size='16' font-weight='500'>${encodeURIComponent(
       chain.name.trim().substring(0, 1)
     )}</text></svg>`,
     eip: {

diff --git a/src/ui/component/TokenSelector/style.less b/src/ui/component/TokenSelector/style.less
@@ -14,7 +14,7 @@
     }
   }
   .ant-drawer-close .anticon.anticon-close > svg {
-    color: var(--r-neutral-foot, #6A7587);
+    color: var(--r-neutral-foot, #6a7587);
   }
   .header {
     font-weight: 500;
@@ -51,7 +51,7 @@
     padding: 0 @token-selector-px;
     justify-content: flex-end;
     align-items: center;
-    color: var(--r-neutral-foot, #6A7587);
+    color: var(--r-neutral-foot, #6a7587);
     font-size: 12px;
     line-height: 14px;
     span {
@@ -94,7 +94,7 @@
             white-space: nowrap;
             font-size: 12px;
             line-height: 15px;
-            color: var(--r-neutral-body, #3E495E);
+            color: var(--r-neutral-body, #3e495e);
             margin-left: 12px;
             max-width: 100%;
           }
@@ -104,7 +104,7 @@
           text-align: left;
           font-size: 12px;
           line-height: 14px;
-          color: var(--r-neutral-body, #3E495E);
+          color: var(--r-neutral-body, #3e495e);
         }
         &:nth-child(3) {
           width: 100px;
@@ -125,7 +125,7 @@
       cursor: initial;
       font-size: 12px;
       line-height: 14px;
-      color: var(--r-neutral-foot, #6A7587);
+      color: var(--r-neutral-foot, #6a7587);
       height: 35px;
       align-items: center;
       margin-bottom: 8px;
@@ -139,7 +139,7 @@
       & > div {
         font-size: 12px;
         line-height: 14px;
-        color: var(--r-neutral-foot, #6A7587);
+        color: var(--r-neutral-foot, #6a7587);
         font-weight: normal;
         &:nth-last-child(1) {
           flex: 1;
@@ -191,13 +191,14 @@
       align-items: center;
 
       border-radius: 4px;
-      color: var(--r-neutral-body, #D3D8E0);
+      color: var(--r-neutral-body, #d3d8e0);
       background: var(--r-neutral-card-2, rgba(255, 255, 255, 0.06));
     }
 
     img.filter-item__chain-logo {
       width: 14px;
       height: 14px;
+      border-radius: 1000px;
     }
 
     .filter-item__chain-close {

diff --git a/src/ui/views/CommonPopup/AssetList/CustomTestnetAssetList/CustomTestnetTokenItem.tsx b/src/ui/views/CommonPopup/AssetList/CustomTestnetAssetList/CustomTestnetTokenItem.tsx
@@ -19,7 +19,7 @@ const TokenItemAsset: React.FC<Props> = ({ item }) => {
     id: item.chainId,
   });
   return (
-    <TCell className="py-[13px] flex gap-12 w-[160px] items-center">
+    <TCell className="py-[13px] flex gap-12 flex-1 items-center">
       <div className="relative h-[24px]">
         <Image
           className="w-24 h-24 rounded-full"
@@ -43,7 +43,7 @@ const TokenItemAsset: React.FC<Props> = ({ item }) => {
         <div className="text-r-neutral-title-1 text-13 font-medium leading-[16px] mb-[1px]">
           {item.symbol}
         </div>
-        <div className="text-r-neutral-foot text-12 font-normal leading-[14px]">
+        <div className="text-r-neutral-foot text-12 font-normal leading-[14px] truncate">
           {chain?.name}
         </div>
       </div>

diff --git a/...ui/views/CommonPopup/AssetList/CustomTestnetTokenDetailPopup/CustomTestnetTokenDetail.tsx b/...ui/views/CommonPopup/AssetList/CustomTestnetTokenDetailPopup/CustomTestnetTokenDetail.tsx
@@ -90,7 +90,7 @@ export const CustomTestnetTokenDetail = ({
         <div className={clsx('flex items-center', 'mb-20')}>
           <div className="flex items-center mr-8">
             <img
-              src={IconUnknown}
+              src={token.logo || IconUnknown}
               alt=""
               className="rounded-full w-[24px] h-[24px]"
             />
@@ -101,7 +101,7 @@ export const CustomTestnetTokenDetail = ({
           <div className="address">
             <img
               src={chain?.logo || IconUnknown}
-              className="w-[14px] h-[14px]"
+              className="w-[14px] h-[14px] rounded-full"
               alt=""
             />
             {!isNativeToken ? (

diff --git a/src/ui/views/CustomTestnet/components/AddFromChainList.tsx b/src/ui/views/CustomTestnet/components/AddFromChainList.tsx
@@ -99,7 +99,6 @@ export const AddFromChainList = ({
 
   const { loading, data, loadingMore } = useInfiniteScroll(
     async (data) => {
-      // const logos = await runFetchLogos().catch(() => ({}));
       const res = await wallet.openapi.searchChainList({
         start: data?.start || 0,
         limit: 50,
@@ -115,9 +114,6 @@ export const AddFromChainList = ({
             rpcUrl: item.rpc || '',
             scanLink: item.explorer || '',
           });
-          if (logos?.[res.id]) {
-            res.logo = logos?.[res.id].chain_logo_url;
-          }
           return res;
         }),
         start: res.page.start + res.page.limit,
@@ -135,7 +131,6 @@ export const AddFromChainList = ({
   );
 
   const { data: usedList, loading: isLoadingUsed } = useRequest(async () => {
-    // const logos = await runFetchLogos().catch(() => ({}));
     return wallet.getUsedCustomTestnetChainList().then((list) => {
       return sortBy(
         list.map((item) => {
@@ -146,9 +141,6 @@ export const AddFromChainList = ({
             rpcUrl: item.rpc || '',
             scanLink: item.explorer || '',
           });
-          if (logos?.[res.id]) {
-            res.logo = logos?.[res.id].chain_logo_url;
-          }
           return res;
         }),
         'name'
@@ -157,7 +149,8 @@ export const AddFromChainList = ({
   });
 
   const isLoading = loading || isLoadingUsed;
-  const list = useMemo(() => {
+
+  const _list = useMemo(() => {
     if (search) {
       return data?.list || [];
     }
@@ -166,6 +159,24 @@ export const AddFromChainList = ({
     });
   }, [data?.list, usedList, search]);
 
+  const list = useMemo(() => {
+    return _list.map((item) => {
+      if (logos?.[item.id]) {
+        item.logo = logos?.[item.id].chain_logo_url;
+      }
+      return item;
+    });
+  }, [_list, logos]);
+
+  const realUsedList = useMemo(() => {
+    return usedList?.map((item) => {
+      if (logos?.[item.id]) {
+        item.logo = logos?.[item.id].chain_logo_url;
+      }
+      return item;
+    });
+  }, [usedList, logos]);
+
   const isEmpty = useMemo(() => {
     if (isLoading) {
       return false;
@@ -207,9 +218,12 @@ export const AddFromChainList = ({
         </div>
       ) : (
         <div ref={ref} className="flex-1 overflow-auto px-[20px]">
-          {usedList?.length && !search ? (
+          {realUsedList?.length && !search ? (
             <div className="mb-[20px]">
-              <CustomTestnetList list={usedList || []} onSelect={onSelect} />
+              <CustomTestnetList
+                list={realUsedList || []}
+                onSelect={onSelect}
+              />
             </div>
           ) : null}
           <CustomTestnetList

diff --git a/src/ui/views/CustomTestnet/components/CustomTestnetItem.tsx b/src/ui/views/CustomTestnet/components/CustomTestnetItem.tsx
@@ -50,7 +50,7 @@ export const CustomTestnetItem = ({
         <img
           src={item.logo}
           alt=""
-          className="flex-shrink-0 w-[28px] h-[28px]"
+          className="flex-shrink-0 w-[28px] h-[28px] rounded-full"
         />
       ) : (
         <TestnetChainLogo name={item.name} className="flex-shrink-0" />