Fix/wallet issues OK-33767 (#6356)

* chore: temp * Update Dialog.tsx * Update Dialog.tsx * fix: fix focus hooks * Update index.tsx * fix: lint * fix: lint --------- Co-authored-by: huhuanming <[email protected]>
OneKeyHQ · Dec 17, 2024 · 513ca95 · 513ca95
1 parent be5c275
commit 513ca95
Show file tree

Hide file tree

Showing 4 changed files with 36 additions and 16 deletions.
diff --git a/packages/kit/src/views/AssetDetails/pages/TokenDetails/TokenDetailsHeader.tsx b/packages/kit/src/views/AssetDetails/pages/TokenDetails/TokenDetailsHeader.tsx
@@ -9,6 +9,7 @@ import {
   Stack,
   XStack,
   YStack,
+  useTabIsRefreshingFocused,
 } from '@onekeyhq/components';
 import backgroundApiProxy from '@onekeyhq/kit/src/background/instance/backgroundApiProxy';
 import NumberSizeableTextWrapper from '@onekeyhq/kit/src/components/NumberSizeableTextWrapper';
@@ -58,6 +59,7 @@ function TokenDetailsHeader(props: IProps) {
     tokenInfo,
     isAllNetworks,
     indexedAccountId,
+    isTabView,
   } = props;
   const navigation = useAppNavigation();
 
@@ -77,6 +79,8 @@ function TokenDetailsHeader(props: IProps) {
     deriveType,
   });
 
+  const { isFocused } = useTabIsRefreshingFocused();
+
   const { result: tokenDetails, isLoading: isLoadingTokenDetails } =
     usePromiseResult(
       async () => {
@@ -91,6 +95,8 @@ function TokenDetailsHeader(props: IProps) {
       [accountId, networkId, tokenInfo.address],
       {
         watchLoading: true,
+        overrideIsFocused: (isPageFocused) =>
+          isPageFocused && (isTabView ? isFocused : true),
       },
     );
 

diff --git a/packages/kit/src/views/AssetDetails/pages/TokenDetails/TokenDetailsHistory.tsx b/packages/kit/src/views/AssetDetails/pages/TokenDetails/TokenDetailsHistory.tsx
@@ -1,5 +1,6 @@
 import { memo, useCallback, useEffect, useState } from 'react';
 
+import { useTabIsRefreshingFocused } from '@onekeyhq/components';
 import backgroundApiProxy from '@onekeyhq/kit/src/background/instance/backgroundApiProxy';
 import { TxHistoryListView } from '@onekeyhq/kit/src/components/TxHistoryListView';
 import useAppNavigation from '@onekeyhq/kit/src/hooks/useAppNavigation';
@@ -19,9 +20,11 @@ import type { IProps } from '.';
 function TokenDetailsHistory(props: IProps) {
   const navigation = useAppNavigation();
 
-  const { accountId, networkId, tokenInfo, ListHeaderComponent } = props;
+  const { accountId, networkId, tokenInfo, ListHeaderComponent, isTabView } =
+    props;
 
   const [historyInit, setHistoryInit] = useState(false);
+  const { isFocused } = useTabIsRefreshingFocused();
 
   /**
    * since some tokens are slow to load history,
@@ -46,6 +49,8 @@ function TokenDetailsHistory(props: IProps) {
     {
       watchLoading: true,
       pollingInterval: POLLING_INTERVAL_FOR_HISTORY,
+      overrideIsFocused: (isPageFocused) =>
+        isPageFocused && (isTabView ? isFocused : true),
     },
   );
 

diff --git a/packages/kit/src/views/AssetDetails/pages/TokenDetails/index.tsx b/packages/kit/src/views/AssetDetails/pages/TokenDetails/index.tsx
@@ -4,6 +4,7 @@ import { memo, useCallback, useMemo } from 'react';
 import { useRoute } from '@react-navigation/core';
 import { isEmpty } from 'lodash';
 import { useIntl } from 'react-intl';
+import { useWindowDimensions } from 'react-native';
 
 import type {
   IActionListSection,
@@ -18,6 +19,7 @@ import {
   Tab,
   getFontToken,
   useClipboard,
+  useMedia,
   useThemeValue,
 } from '@onekeyhq/components';
 import { HeaderIconButton } from '@onekeyhq/components/src/layouts/Navigation/Header';
@@ -165,6 +167,16 @@ function TokenDetailsView() {
     [fontColor],
   );
 
+  const { gtMd } = useMedia();
+  const { width } = useWindowDimensions();
+
+  const contentItemWidth = useMemo(() => {
+    if (platformEnv.isNative) {
+      return undefined;
+    }
+    return gtMd ? 640 : width;
+  }, [gtMd, width]);
+
   const listViewContentContainerStyle = useMemo(() => ({ pt: '$5' }), []);
   const tabs = useMemo(() => {
     if (accountId && networkId && walletId) {
@@ -221,13 +233,12 @@ function TokenDetailsView() {
     ) {
       if (tabs && !isEmpty(tabs)) {
         return (
-          <Tab.Page
+          <Tab
+            disableRefresh
             data={tabs}
-            contentItemWidth={platformEnv.isNative ? undefined : (640 as any)}
+            contentItemWidth={contentItemWidth as any}
             initialScrollIndex={0}
-            focusable
             showsVerticalScrollIndicator={false}
-            windowSize={tabs.length}
           />
         );
       }
@@ -248,18 +259,19 @@ function TokenDetailsView() {
       />
     );
   }, [
-    listViewContentContainerStyle,
+    isLoading,
+    vaultSettings?.mergeDeriveAssetsEnabled,
+    isAllNetworks,
+    walletId,
     accountId,
+    networkId,
     deriveInfo,
     deriveType,
-    isAllNetworks,
-    isLoading,
-    networkId,
-    tabs,
     tokenInfo,
-    vaultSettings?.mergeDeriveAssetsEnabled,
-    walletId,
-    account,
+    account?.indexedAccountId,
+    listViewContentContainerStyle,
+    tabs,
+    contentItemWidth,
   ]);
 
   return (

diff --git a/packages/kit/src/views/Developer/pages/Gallery/Components/stories/Dialog.tsx b/packages/kit/src/views/Developer/pages/Gallery/Components/stories/Dialog.tsx
@@ -44,9 +44,6 @@ const CustomFooter = ({
   index: number;
   form: UseFormReturn<any>;
 }) => {
-  // test Navigation Container hooks
-  const isFocused = useIsFocused();
-  console.log('isFocused', isFocused);
   const dialog = useDialogInstance();
   return (
     <XStack gap="$4" justifyContent="center">