feat: support SheetModal of TokenDetail.

.github/workflows/feature_test.yml

@@ -11,6 +11,10 @@ on:
         required: true
         type: boolean
         default: true
+      SENTRY_DISABLE_AUTO_UPLOAD:
+        required: false
+        type: boolean
+        default: false
 
 defaults:
   run:
@@ -83,6 +87,7 @@ jobs:
           RABBY_MOBILE_SENTRY_AUTH_TOKEN2: ${{ secrets.RABBY_MOBILE_SENTRY_AUTH_TOKEN2 }}
           SENTRY_AUTH_TOKEN: ${{ secrets.RABBY_MOBILE_SENTRY_AUTH_TOKEN2 }}
           REALLY_UPLOAD: ${{ inputs.REALLY_UPLOAD }}
+          SENTRY_DISABLE_AUTO_UPLOAD: ${{ inputs.SENTRY_DISABLE_AUTO_UPLOAD }}
           CONFIGURATION: release
           TYPE: adhoc
           BUILD_ENV: alpha

.husky/pre-commit

@@ -1,4 +1,4 @@
-#!/usr/bin/env sh
+#!/bin/bash -l
 . "$(dirname -- "$0")/_/husky.sh"
 
 yarn lint-staged

apps/mobile/android/app/build.gradle

@@ -70,6 +70,7 @@ def enableProguardInReleaseBuilds = false
 def jscFlavor = 'org.webkit:android-jsc:+'
 
 apply from: new File(["node", "--print", "require.resolve('@sentry/react-native/package.json')"].execute().text.trim(), "../sentry.gradle")
+
 android {
     ndkVersion rootProject.ext.ndkVersion
 

apps/mobile/android/sentry.properties

@@ -1,5 +1,5 @@
 defaults.url=https://sentry.io/
-defaults.org=debank
+defaults.org=rabby-wallet
 defaults.project=rabby-mobile
 # use environment variable SENTRY_AUTH_TOKEN
 # auth.token=

apps/mobile/ios/RabbyMobile/Info.plist

@@ -36,7 +36,7 @@
 	<key>CFBundleVersion</key>
 	<string>$(CURRENT_PROJECT_VERSION)</string>
 	<key>ITSAppUsesNonExemptEncryption</key>
-	<false/>
+	<false />
 	<key>LSApplicationQueriesSchemes</key>
 	<array>
 		<string>imtokenv2</string>
@@ -52,15 +52,15 @@
 		<string>blob</string>
 	</array>
 	<key>LSRequiresIPhoneOS</key>
-	<true/>
+	<true />
 	<key>NSAppTransportSecurity</key>
 	<dict>
 		<key>NSExceptionDomains</key>
 		<dict>
 			<key>localhost</key>
 			<dict>
 				<key>NSExceptionAllowsInsecureHTTPLoads</key>
-				<true/>
+				<true />
 			</dict>
 		</dict>
 	</dict>
@@ -71,7 +71,7 @@
 	<key>NSCameraUsageDescription</key>
 	<string>$(PRODUCT_NAME) needs camera access to scan QR codes.</string>
 	<key>NSLocationWhenInUseUsageDescription</key>
-	<string></string>
+	<string />
 	<key>UIAppFonts</key>
 	<array>
 		<string>Anton-Regular.ttf</string>
@@ -95,6 +95,6 @@
 	<key>UIUserInterfaceStyle</key>
 	<string>Automatic</string>
 	<key>UIViewControllerBasedStatusBarAppearance</key>
-	<false/>
+	<false />
 </dict>
 </plist>

apps/mobile/ios/sentry.properties

@@ -1,5 +1,5 @@
 defaults.url=https://sentry.io/
-defaults.org=debank
+defaults.org=rabby-wallet
 defaults.project=rabby-mobile
 # use environment variable SENTRY_AUTH_TOKEN
 # auth.token=

apps/mobile/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rabby-mobile",
-  "version": "0.1.9",
+  "version": "0.1.8",
   "private": true,
   "repository": {
     "type": "git",

apps/mobile/src/AppNavigation.tsx

@@ -201,17 +201,6 @@ export default function AppNavigation({
               },
             }}
           />
-          <RootStack.Screen
-            name={RootNames.Receive}
-            component={ReceiveScreen}
-            options={{
-              ...screenOptions,
-              title: '',
-              headerShadowVisible: false,
-              headerShown: true,
-              headerTransparent: true,
-            }}
-          />
           <RootStack.Screen
             name={RootNames.AccountTransaction}
             component={AccountNavigator}

apps/mobile/src/assets/icons/common/index.tsx

@@ -21,3 +21,5 @@ export { default as RcWalletCC } from './wallet-cc.svg';
 export { default as RcIconCheckmarkCC } from './icon-checkmark-cc.svg';
 
 export { default as RcIconCloseCC } from './icon-close-cc.svg';
+
+export { default as RcIconNotMatchedCC } from './not-matched-cc.svg';

apps/mobile/src/assets/locales/en/messages.json

@@ -518,7 +518,7 @@
       }
     },
     "receive": {
-      "title": "Receive assets on {{chain}}",
+      "title": "Receive {{token}} on {{chain}}",
       "watchModeAlert": "This is a watch-only address. Are you sure to use it to receive?"
     },
     "sendToken": {

apps/mobile/src/components/AddressViewer/CopyAddress.tsx

@@ -1,5 +1,5 @@
-import { useCallback } from 'react';
-import { TouchableOpacity } from 'react-native';
+import React, { useCallback, useImperativeHandle } from 'react';
+import { TouchableOpacity, View, Text } from 'react-native';
 import Clipboard from '@react-native-clipboard/clipboard';
 import { SvgProps } from 'react-native-svg';
 
@@ -8,38 +8,85 @@ import { useThemeStyles } from '@/hooks/theme';
 import { createGetStyles } from '@/utils/styles';
 import { toast } from '../Toast';
 
-type ContainerProps = React.ComponentProps<typeof TouchableOpacity>;
+type ContainerOnPressProp = React.ComponentProps<
+  typeof TouchableOpacity
+>['onPress'] &
+  object;
+type CopyHandler = (evt?: Parameters<ContainerOnPressProp>[0]) => void;
 
 type Props = {
   address?: string | null;
-  // containerStyle?: ContainerProps['style'];
   style?: SvgProps['style'];
   color?: string;
+  onToastSucess?: (ctx: { address: string }) => void;
 };
-export function CopyAddressIcon({
-  style,
-  // containerStyle,
-  address,
-  color,
-}: Props) {
-  const { colors } = useThemeStyles(getStyles);
-
-  const handleCopyAddress = useCallback<ContainerProps['onPress'] & object>(
-    evt => {
-      if (!address) return null;
-
-      evt.stopPropagation();
-      Clipboard.setString(address);
-      toast.success('Copied');
+export type CopyAddressIconType = {
+  doCopy: CopyHandler;
+};
+export const CopyAddressIcon = React.forwardRef<CopyAddressIconType, Props>(
+  function (
+    {
+      onToastSucess: propOnToastSucess,
+      style,
+      // containerStyle,
+      address,
+      color,
     },
-    [address],
-  );
-
-  return (
-    <TouchableOpacity style={style} onPress={handleCopyAddress}>
-      <RcIconCopyCC color={color || colors['neutral-foot']} style={style} />
-    </TouchableOpacity>
-  );
+    ref,
+  ) {
+    const { colors } = useThemeStyles(getStyles);
+
+    const onToastSucess = useCallback<Props['onToastSucess'] & object>(
+      ({ address }) => {
+        if (propOnToastSucess) propOnToastSucess({ address });
+        else {
+          toastCopyAddressSuccess(address);
+        }
+      },
+      [propOnToastSucess],
+    );
+
+    const handleCopyAddress = useCallback<CopyHandler>(
+      (evt?) => {
+        if (!address) return null;
+
+        evt?.stopPropagation();
+        Clipboard.setString(address);
+        onToastSucess({ address });
+      },
+      [address, onToastSucess],
+    );
+
+    useImperativeHandle(ref, () => ({
+      doCopy: handleCopyAddress,
+    }));
+
+    return (
+      <TouchableOpacity style={style} onPress={handleCopyAddress}>
+        <RcIconCopyCC color={color || colors['neutral-foot']} style={style} />
+      </TouchableOpacity>
+    );
+  },
+);
+
+export function toastCopyAddressSuccess(address?: string) {
+  if (!address) {
+    toast.success('Copied');
+    return;
+  }
+
+  toast.success(tctx => {
+    return (
+      <View
+        style={{
+          flexDirection: 'column',
+          justifyContent: 'flex-start',
+        }}>
+        <Text style={tctx.textStyle}>Copied</Text>
+        <Text style={tctx.textStyle}>{address}</Text>
+      </View>
+    );
+  });
 }
 
 const getStyles = createGetStyles(colors => {

apps/mobile/src/components/Approval/components/Actions/components/Values.tsx

@@ -1,4 +1,10 @@
-import React, { useMemo, ReactNode, useState, useEffect } from 'react';
+import React, {
+  useMemo,
+  ReactNode,
+  useState,
+  useEffect,
+  useCallback,
+} from 'react';
 import {
   View,
   StyleSheet,
@@ -43,6 +49,7 @@ import { keyringService } from '@/core/services';
 import { useApprovalSecurityEngine } from '../../../hooks/useApprovalSecurityEngine';
 import useCommonStyle from '@/components/Approval/hooks/useCommonStyle';
 import { useThemeColors } from '@/hooks/theme';
+import { useTokenDetailSheetModalOnApprovals } from '@/components/TokenDetailPopup/ApprovalTokenDetailSheetModalStub';
 
 const { isSameAddress } = addressUtils;
 
@@ -479,10 +486,11 @@ const TokenSymbol = ({
   token: TokenItem;
   style?: TextStyle;
 }) => {
-  const handleClickTokenSymbol = () => {
-    // TODO
-    // dispatch.sign.openTokenDetailPopup(token);
-  };
+  const { openTokenDetailPopup } = useTokenDetailSheetModalOnApprovals();
+  const handleClickTokenSymbol = useCallback(() => {
+    openTokenDetailPopup(token);
+  }, [openTokenDetailPopup, token]);
+
   return (
     <Text
       onPress={handleClickTokenSymbol}

apps/mobile/src/components/Approval/components/TxComponents/BalanceChange.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useCallback } from 'react';
 import { View, Text, StyleSheet } from 'react-native';
 import { useTranslation } from 'react-i18next';
 import BigNumber from 'bignumber.js';
@@ -19,6 +19,7 @@ import DescItem from '../Actions/components/DescItem';
 import { useThemeColors } from '@/hooks/theme';
 import { AppColorsVariants } from '@/constant/theme';
 import useCommonStyle from '../../hooks/useCommonStyle';
+import { useTokenDetailSheetModalOnApprovals } from '@/components/TokenDetailPopup/ApprovalTokenDetailSheetModalStub';
 
 const getStyle = (colors: AppColorsVariants) =>
   StyleSheet.create({
@@ -214,10 +215,13 @@ const BalanceChange = ({
       };
     }, [data]);
 
-  const handleClickToken = (t: TokenItem) => {
-    // TODO
-    // dispatch.sign.openTokenDetailPopup(t);
-  };
+  const { openTokenDetailPopup } = useTokenDetailSheetModalOnApprovals();
+  const handleClickToken = useCallback(
+    (t: TokenItem) => {
+      openTokenDetailPopup(t);
+    },
+    [openTokenDetailPopup],
+  );
 
   if (version === 'v0') {
     return (

apps/mobile/src/components/AssetAvatar.tsx

@@ -14,7 +14,7 @@ type AssetAvatarProps = {
   chainIconPosition?: 'tr' | 'br' | 'tl' | 'bl';
   chainSize?: number;
   failedPlaceholder?: ReactNode;
-  style?: ViewStyle;
+  style?: RNViewProps['style'];
   logoStyle?: ViewStyle;
 };