From 44126d6eedf75d8b8343fcaa7ff3b838b0589e71 Mon Sep 17 00:00:00 2001 From: huhuanming Date: Mon, 23 Dec 2024 11:58:33 +0800 Subject: [PATCH] fix: resolved the issue where headerShown: false was not working after the interface rendering & added the AnchorSizableText component & fixed the issue of the Loading indicator showing twice on the market detail page. (OK-32345) (#6395) --- .../components/src/actions/Toast/index.tsx | 69 +++----------- .../src/content/AnchorSizableText/index.tsx | 46 +++++++++ packages/components/src/content/index.ts | 1 + .../Navigator/TabStackNavigator.tsx | 2 +- .../kit/src/components/TradingView/index.tsx | 34 +------ .../kit/src/routes/Tab/Discovery/router.ts | 1 + packages/kit/src/routes/Tab/Earn/router.ts | 2 + packages/kit/src/routes/Tab/Marktet/router.ts | 2 + packages/kit/src/routes/Tab/Swap/router.ts | 3 +- packages/kit/src/routes/Tab/router.ts | 2 - .../Gallery/Components/stories/Toast.tsx | 10 ++ .../Components/stories/TradingView.tsx | 1 + packages/kit/src/views/Home/router/index.ts | 3 +- .../Market/components/TokenPriceChart.tsx | 93 +++++++++++++------ 14 files changed, 149 insertions(+), 120 deletions(-) create mode 100644 packages/components/src/content/AnchorSizableText/index.tsx diff --git a/packages/components/src/actions/Toast/index.tsx b/packages/components/src/actions/Toast/index.tsx index a243e2038ca..6c3bf9edc4f 100644 --- a/packages/components/src/actions/Toast/index.tsx +++ b/packages/components/src/actions/Toast/index.tsx @@ -8,15 +8,9 @@ import { useMedia } from 'tamagui'; import { dismissKeyboard } from '@onekeyhq/shared/src/keyboard'; import platformEnv from '@onekeyhq/shared/src/platformEnv'; +import { AnchorSizableText } from '../../content/AnchorSizableText'; import { Portal } from '../../hocs'; -import { - Anchor, - Icon, - SizableText, - View, - XStack, - YStack, -} from '../../primitives'; +import { Icon, View, XStack, YStack } from '../../primitives'; import { ShowCustom, ShowToasterClose } from './ShowCustom'; import { showMessage } from './showMessage'; @@ -48,7 +42,6 @@ const iconMap = { warning: , }; -const urlRegex = /]*?)?>(.*?)<\/url>/g; const RenderLines = ({ size, children: text, @@ -69,52 +62,18 @@ const RenderLines = ({ return ( - {lines.map((line, index) => { - const hasUrl = urlRegex.test(line); - if (!hasUrl) { - return ( - - {line} - - ); - } - const parts = line.split(urlRegex); - const hrefMatch = line.match(/href="(.*?)"/); - return ( - - {parts.map((part, partIndex) => { - if (partIndex % 2 === 1) { - return ( - - {part} - - ); - } - return part; - })} - - ); - })} + {lines.map((line, index) => ( + + {line} + + ))} ); }; diff --git a/packages/components/src/content/AnchorSizableText/index.tsx b/packages/components/src/content/AnchorSizableText/index.tsx new file mode 100644 index 00000000000..ce00fb6905f --- /dev/null +++ b/packages/components/src/content/AnchorSizableText/index.tsx @@ -0,0 +1,46 @@ +import { Anchor, SizableText } from '../../primitives'; + +import type { IAnchorProps, ISizableTextProps } from '../../primitives'; + +export interface IAnchorSizableTextProps extends ISizableTextProps { + anchorRegExp?: RegExp; + hrefRegExp?: RegExp; + anchorProps?: IAnchorProps; +} + +export function AnchorSizableText({ + anchorRegExp = /]*?)?>(.*?)<\/url>/g, + hrefRegExp = /href="(.*?)"/, + children, + anchorProps, + ...props +}: IAnchorSizableTextProps) { + const line = children as string; + const isAnchor = anchorRegExp.test(line); + if (isAnchor) { + const parts = line.split(anchorRegExp); + const hrefMatch = line.match(/href="(.*?)"/); + return ( + + {parts.map((part, partIndex) => { + if (partIndex === 1) { + return ( + + {part} + + ); + } + return part; + })} + + ); + } + return {line}; +} diff --git a/packages/components/src/content/index.ts b/packages/components/src/content/index.ts index a4aed8eb613..b0b593328c9 100644 --- a/packages/components/src/content/index.ts +++ b/packages/components/src/content/index.ts @@ -1,3 +1,4 @@ +export * from './AnchorSizableText'; export * from './Badge'; export * from './HeightTransition'; export * from './LinearGradient'; diff --git a/packages/components/src/layouts/Navigation/Navigator/TabStackNavigator.tsx b/packages/components/src/layouts/Navigation/Navigator/TabStackNavigator.tsx index 8007b8e302e..fa979359543 100644 --- a/packages/components/src/layouts/Navigation/Navigator/TabStackNavigator.tsx +++ b/packages/components/src/layouts/Navigation/Navigator/TabStackNavigator.tsx @@ -34,13 +34,13 @@ function TabSubStackNavigator({ component={component} options={({ navigation }: { navigation: any }) => ({ freezeOnBlur: true, - headerShown, title: translationId ? intl.formatMessage({ id: translationId, }) : '', ...makeTabScreenOptions({ navigation, bgColor, titleColor }), + headerShown, })} /> ))} diff --git a/packages/kit/src/components/TradingView/index.tsx b/packages/kit/src/components/TradingView/index.tsx index 6fa042b89de..798d0975223 100644 --- a/packages/kit/src/components/TradingView/index.tsx +++ b/packages/kit/src/components/TradingView/index.tsx @@ -19,59 +19,27 @@ interface IBaseTradingViewProps { identifier: string; baseToken: string; targetToken: string; + onLoadEnd: () => void; } export type ITradingViewProps = IBaseTradingViewProps & IStackStyle; -function Loading() { - return ( - - - - ); -} - export function TradingView(props: ITradingViewProps & WebViewProps) { const [restProps, style] = usePropsAndStyle(props); const { targetToken, identifier, baseToken, ...otherProps } = restProps as IBaseTradingViewProps; - const [showLoading, changeShowLoading] = useState(true); const tradingViewProps = useTradingViewProps({ targetToken, identifier, baseToken, }); - const onLoadEnd = useCallback(() => { - changeShowLoading(false); - }, []); return ( - - {showLoading ? ( - - - - ) : null} - ); } diff --git a/packages/kit/src/routes/Tab/Discovery/router.ts b/packages/kit/src/routes/Tab/Discovery/router.ts index 5c03dbc8dcb..557af131bff 100644 --- a/packages/kit/src/routes/Tab/Discovery/router.ts +++ b/packages/kit/src/routes/Tab/Discovery/router.ts @@ -15,6 +15,7 @@ export const discoveryRouters: ITabSubNavigatorConfig[] = [ { name: ETabDiscoveryRoutes.TabDiscovery, rewrite: '/', + headerShown: !platformEnv.isNative, component: platformEnv.isNative && !platformEnv.isNativeIOSPad ? Browser diff --git a/packages/kit/src/routes/Tab/Earn/router.ts b/packages/kit/src/routes/Tab/Earn/router.ts index c9f67b26b9c..767da079c99 100644 --- a/packages/kit/src/routes/Tab/Earn/router.ts +++ b/packages/kit/src/routes/Tab/Earn/router.ts @@ -1,4 +1,5 @@ import type { ITabSubNavigatorConfig } from '@onekeyhq/components'; +import platformEnv from '@onekeyhq/shared/src/platformEnv'; import { ETabEarnRoutes } from '@onekeyhq/shared/src/routes'; import { LazyLoadRootTabPage } from '../../../components/LazyLoadPage'; @@ -12,5 +13,6 @@ export const earnRouters: ITabSubNavigatorConfig[] = [ rewrite: '/', name: ETabEarnRoutes.EarnHome, component: EarnHome, + headerShown: !platformEnv.isNative, }, ]; diff --git a/packages/kit/src/routes/Tab/Marktet/router.ts b/packages/kit/src/routes/Tab/Marktet/router.ts index 5fc51e88b55..2ffb02d8692 100644 --- a/packages/kit/src/routes/Tab/Marktet/router.ts +++ b/packages/kit/src/routes/Tab/Marktet/router.ts @@ -1,4 +1,5 @@ import type { ITabSubNavigatorConfig } from '@onekeyhq/components'; +import platformEnv from '@onekeyhq/shared/src/platformEnv'; import { ETabMarketRoutes } from '@onekeyhq/shared/src/routes'; import { @@ -18,6 +19,7 @@ export const marketRouters: ITabSubNavigatorConfig[] = [ { rewrite: '/', name: ETabMarketRoutes.TabMarket, + headerShown: !platformEnv.isNative, component: MarketHome, }, { diff --git a/packages/kit/src/routes/Tab/Swap/router.ts b/packages/kit/src/routes/Tab/Swap/router.ts index baf849d1749..ff796d75500 100644 --- a/packages/kit/src/routes/Tab/Swap/router.ts +++ b/packages/kit/src/routes/Tab/Swap/router.ts @@ -1,5 +1,5 @@ import type { ITabSubNavigatorConfig } from '@onekeyhq/components'; -import { ETranslations } from '@onekeyhq/shared/src/locale'; +import platformEnv from '@onekeyhq/shared/src/platformEnv'; import { ETabSwapRoutes } from '@onekeyhq/shared/src/routes'; import { LazyLoadRootTabPage } from '../../../components/LazyLoadPage'; @@ -11,6 +11,7 @@ export const swapRouters: ITabSubNavigatorConfig[] = [ name: ETabSwapRoutes.TabSwap, component: Swap, rewrite: '/', + headerShown: !platformEnv.isNative, // translationId: ETranslations.global_swap, }, ]; diff --git a/packages/kit/src/routes/Tab/router.ts b/packages/kit/src/routes/Tab/router.ts index 4aba38a48e9..afa43f67ae1 100644 --- a/packages/kit/src/routes/Tab/router.ts +++ b/packages/kit/src/routes/Tab/router.ts @@ -5,11 +5,9 @@ import type { ITabNavigatorConfig, ITabNavigatorExtraConfig, } from '@onekeyhq/components/src/layouts/Navigation/Navigator/types'; -import { useDevSettingsPersistAtom } from '@onekeyhq/kit-bg/src/states/jotai/atoms'; import { ETranslations } from '@onekeyhq/shared/src/locale'; import platformEnv from '@onekeyhq/shared/src/platformEnv'; import { ETabRoutes } from '@onekeyhq/shared/src/routes'; -import { EShortcutEvents } from '@onekeyhq/shared/src/shortcuts/shortcuts.enum'; import { developerRouters } from '../../views/Developer/router'; import { homeRouters } from '../../views/Home/router'; diff --git a/packages/kit/src/views/Developer/pages/Gallery/Components/stories/Toast.tsx b/packages/kit/src/views/Developer/pages/Gallery/Components/stories/Toast.tsx index 9921abf1086..c1f498b2703 100644 --- a/packages/kit/src/views/Developer/pages/Gallery/Components/stories/Toast.tsx +++ b/packages/kit/src/views/Developer/pages/Gallery/Components/stories/Toast.tsx @@ -37,6 +37,16 @@ const ToastGallery = () => ( > All Types +