Skip to content

Commit d781446

Browse files
committed
fix: some display/interactions issues.
1 parent cbfdfee commit d781446

Some content is hidden

Large Commits have some content hidden by default. Use the searchbox below for content that may be hidden.

42 files changed

+492
-261
lines changed
Lines changed: 13 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,13 @@
1+
diff --git a/src/platform-specific/findHostInstance.ts b/src/platform-specific/findHostInstance.ts
2+
index da56c8eb67f4be89ac42ad22bc38f27500247f82..32f5baa54420800a31ce64441eb1acedaf68c43c 100644
3+
--- a/src/platform-specific/findHostInstance.ts
4+
+++ b/src/platform-specific/findHostInstance.ts
5+
@@ -86,7 +86,7 @@ export function findHostInstance(
6+
a valid React ref.
7+
*/
8+
return findHostInstance_DEPRECATED(
9+
- !isFabric() || (component as IAnimatedComponentInternal).hasAnimatedRef()
10+
+ !isFabric() || (typeof (component as IAnimatedComponentInternal).hasAnimatedRef === 'function' && (component as IAnimatedComponentInternal).hasAnimatedRef())
11+
? (component as IAnimatedComponentInternal)._componentRef
12+
: component
13+
);

apps/mobile/android/app/src/newarch/com/debank/rabbymobile/RNScreenshotPreventModule.java

Lines changed: 7 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -11,6 +11,7 @@
1111
import android.widget.RelativeLayout;
1212
import android.widget.ImageView;
1313

14+
import com.facebook.proguard.annotations.DoNotStrip;
1415
import com.facebook.react.module.annotations.ReactModule;
1516
import com.facebook.react.modules.core.DeviceEventManagerModule;
1617
import com.facebook.react.bridge.Promise;
@@ -46,6 +47,12 @@ public String getName() {
4647
return RNScreenshotPreventImpl.NAME;
4748
}
4849

50+
@Override
51+
public void addListener(String eventType) {};
52+
53+
@Override
54+
public void removeListeners(double count) {};
55+
4956
@Override
5057
public void togglePreventScreenshot(boolean isPrevent) {
5158
if (this.reactContext.hasCurrentActivity()) {

apps/mobile/android/app/src/newarch/com/debank/rabbymobile/RNTimeChangedModule.java

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -37,6 +37,12 @@ public String getName() {
3737
return RNTimeChangedImpl.NAME;
3838
}
3939

40+
@Override
41+
public void addListener(String eventType) {};
42+
43+
@Override
44+
public void removeListeners(double count) {};
45+
4046

4147
@ReactMethod
4248
public void exitAppForSecurity() {

apps/mobile/babel.config.js

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -93,7 +93,7 @@ module.exports = {
9393
['module:react-native-dotenv', { moduleName: '@env' }],
9494
['nativewind/babel', {}],
9595
['@babel/plugin-proposal-decorators', { legacy: true }],
96-
['react-native-reanimated/plugin'],
96+
['react-native-reanimated/plugin', { processNestedWorklets: true }],
9797
],
9898
env: {
9999
production: {

apps/mobile/package.json

Lines changed: 6 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -53,7 +53,7 @@
5353
"@ethereumjs/common": "4.2.0",
5454
"@ethereumjs/tx": "5.1.0",
5555
"@ethereumjs/util": "^9.0.1",
56-
"@gorhom/bottom-sheet": "5.0.0-alpha.9",
56+
"@gorhom/bottom-sheet": "5.1.8",
5757
"@ledgerhq/react-native-hw-transport-ble": "6.33.4",
5858
"@metamask/abi-utils": "3.0.0",
5959
"@metamask/browser-passworder": "6.0.0",
@@ -88,9 +88,9 @@
8888
"@react-native-google-signin/google-signin": "13.2.0",
8989
"@react-native-masked-view/masked-view": "^0.3.1",
9090
"@react-native-menu/menu": "1.2.3",
91-
"@react-navigation/bottom-tabs": "^6.5.11",
92-
"@react-navigation/native": "^6.1.9",
93-
"@react-navigation/native-stack": "^6.9.17",
91+
"@react-navigation/bottom-tabs": "7.4.7",
92+
"@react-navigation/native": "7.1.17",
93+
"@react-navigation/native-stack": "7.3.26",
9494
"@rematch/core": "^2.2.0",
9595
"@rneui/base": "^4.0.0-rc.8",
9696
"@rneui/themed": "^4.0.0-rc.8",
@@ -144,7 +144,7 @@
144144
"react-native-ble-plx": "3.1.2",
145145
"react-native-bundle-splitter": "^3.0.1",
146146
"react-native-cloud-storage": "^1.4.1",
147-
"react-native-collapsible-tab-view": "^6.2.1",
147+
"react-native-collapsible-tab-view": "7.0.1",
148148
"react-native-crypto-js": "^1.0.0",
149149
"react-native-device-info": "14.0.4",
150150
"react-native-dotenv": "^3.4.9",
@@ -165,7 +165,7 @@
165165
"react-native-linear-gradient": "^2.8.3",
166166
"react-native-localize": "3.3.0",
167167
"react-native-mmkv": "3.3.1",
168-
"react-native-pager-view": "6.7.0",
168+
"react-native-pager-view": "6.9.0",
169169
"react-native-permissions": "5.3.0",
170170
"react-native-qrcode-svg": "^6.2.0",
171171
"react-native-quick-crypto": "0.7.13",

apps/mobile/src/AppNavigation.tsx

Lines changed: 49 additions & 45 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,10 @@
11
import { createCustomNativeStackNavigator as createNativeStackNavigator } from '@/utils/CustomNativeStackNavigator';
2+
// import { createNativeStackNavigator } from '@react-navigation/native-stack';
23
import {
34
DarkTheme,
45
DefaultTheme,
56
NavigationContainer,
7+
NavigationIndependentTree,
68
} from '@react-navigation/native';
79
import React, { useCallback, useMemo, useRef } from 'react';
810
import { Appearance, BackHandler, ColorSchemeName } from 'react-native';
@@ -476,46 +478,47 @@ export default function AppNavigation({
476478
<GlobalBottomSheetModal />
477479
<GlobalBottomSheetModal2024 />
478480
{/* <GlobalAccountSwitcherStub /> */}
479-
<NavigationContainer
480-
linking={linking}
481-
ref={navigationRef}
482-
// key={userId}
483-
onReady={onReady}
484-
onStateChange={onStateChange}
485-
independent
486-
// linking={LinkingConfiguration}
487-
theme={colorScheme === 'dark' ? DarkTheme : DefaultTheme}>
488-
<DuplicateAddressModal />
489-
<AliasNameEditModal />
490-
<QrCodeModal />
491-
<HomeHiddenTabStack.Navigator
492-
screenOptions={
493-
/* mergeScreenOptions */ {
494-
// gestureEnabled: false,
495-
headerTitleAlign: 'center',
496-
headerStyle: {
497-
backgroundColor: 'transparent',
498-
},
499-
// headerShadowVisible: true,
500-
headerTintColor: colors['neutral-title-1'],
501-
headerTitleStyle: {
502-
color: colors['neutral-title-1'],
503-
fontWeight: '500',
504-
fontSize: DEFAULT_NAVBAR_FONT_SIZE,
505-
},
506-
// headerTransparent: true,
481+
<NavigationIndependentTree>
482+
<NavigationContainer
483+
linking={linking}
484+
ref={navigationRef}
485+
// key={userId}
486+
onReady={onReady}
487+
onStateChange={onStateChange}
488+
navigationInChildEnabled
489+
// linking={LinkingConfiguration}
490+
theme={colorScheme === 'dark' ? DarkTheme : DefaultTheme}>
491+
<DuplicateAddressModal />
492+
<AliasNameEditModal />
493+
<QrCodeModal />
494+
<HomeHiddenTabStack.Navigator
495+
screenOptions={
496+
/* mergeScreenOptions */ {
497+
// gestureEnabled: false,
498+
headerTitleAlign: 'center',
499+
headerStyle: {
500+
backgroundColor: 'transparent',
501+
},
502+
// headerShadowVisible: true,
503+
headerTintColor: colors['neutral-title-1'],
504+
headerTitleStyle: {
505+
color: colors['neutral-title-1'],
506+
fontWeight: '500',
507+
fontSize: DEFAULT_NAVBAR_FONT_SIZE,
508+
},
509+
// headerTransparent: true,
510+
}
507511
}
508-
}
509-
tabBar={() => null}>
510-
<HomeHiddenTabStack.Screen
511-
name={RootNames.StackMain}
512-
component={StackMain}
513-
options={{
514-
headerShown: false,
515-
}}
516-
/>
517-
518-
{/* <HomeHiddenTabStack.Screen
512+
tabBar={() => null}>
513+
<HomeHiddenTabStack.Screen
514+
name={RootNames.StackMain}
515+
component={StackMain}
516+
options={{
517+
headerShown: false,
518+
}}
519+
/>
520+
521+
{/* <HomeHiddenTabStack.Screen
519522
name={RootNames.StackBrowser}
520523
component={BrowserNavigator}
521524
options={{
@@ -524,12 +527,13 @@ export default function AppNavigation({
524527
headerShown: false,
525528
}}
526529
/> */}
527-
</HomeHiddenTabStack.Navigator>
528-
<BiometricsStubModal />
529-
<ApprovalTokenDetailSheetModalStub />
530-
<BottomSheetBrowser />
531-
<BrowserManagePopup />
532-
</NavigationContainer>
530+
</HomeHiddenTabStack.Navigator>
531+
<BiometricsStubModal />
532+
<ApprovalTokenDetailSheetModalStub />
533+
<BottomSheetBrowser />
534+
<BrowserManagePopup />
535+
</NavigationContainer>
536+
</NavigationIndependentTree>
533537
<ModalsSubmitFeedbackByScreenshotStub />
534538

535539
{/** @warning put all business stub components before this modal */}

apps/mobile/src/components/CustomTouchableOpacity.tsx

Lines changed: 56 additions & 19 deletions
Original file line numberDiff line numberDiff line change
@@ -1,49 +1,83 @@
1-
import { useCallback, useRef } from 'react';
2-
import { TouchableOpacity, TouchableOpacityProps } from 'react-native';
1+
import { useCallback, useMemo, useRef } from 'react';
2+
import { TouchableOpacity } from 'react-native';
3+
import {
4+
TouchableOpacity as RNGHTouchableOpacity,
5+
Pressable as RNGHPressable,
6+
} from 'react-native-gesture-handler';
37

48
const DefaultOpacity = 0.8;
59

10+
type ViewAsMap = {
11+
TouchableOpacity: typeof TouchableOpacity;
12+
RNGHTouchableOpacity: typeof RNGHTouchableOpacity;
13+
// RNGHPressable: typeof RNGHPressable;
14+
};
15+
export type NativeViewAs = keyof ViewAsMap;
16+
17+
export function getViewComponentByAs<T extends NativeViewAs>(
18+
as: T = 'TouchableOpacity' as T,
19+
) {
20+
switch (as) {
21+
case 'RNGHTouchableOpacity':
22+
return RNGHTouchableOpacity;
23+
// case 'RNGHPressable':
24+
// return RNGHPressable;
25+
case 'TouchableOpacity':
26+
default:
27+
return TouchableOpacity;
28+
}
29+
}
30+
31+
type Props<T extends NativeViewAs> = {
32+
as?: T;
33+
} & React.ComponentProps<ViewAsMap[T]>;
34+
635
/**
736
* @see https://stackoverflow.com/questions/47979866/dynamic-opacity-not-changing-when-component-rerenders-in-react-native
837
*/
9-
export const CustomTouchableOpacity = ({
38+
export const CustomTouchableOpacity = <T extends NativeViewAs>({
39+
as = 'TouchableOpacity' as T,
1040
onPress: _onPress,
1141
onPressIn: _onPressIn,
1242
onPressOut: _onPressOut,
1343
...rest
14-
}: TouchableOpacityProps) => {
44+
}: Props<T>) => {
1545
const pressInPagePointRef = useRef({ x: 0, y: 0 });
1646

1747
const handlePressIn = useCallback(
18-
(e: any) => {
19-
pressInPagePointRef.current = {
20-
x: e.nativeEvent.pageX,
21-
y: e.nativeEvent.pageY,
22-
};
48+
(e?: any) => {
49+
if (e) {
50+
pressInPagePointRef.current = {
51+
x: e.nativeEvent.pageX,
52+
y: e.nativeEvent.pageY,
53+
};
54+
}
2355

2456
_onPressIn?.(e);
2557
},
2658
[_onPressIn],
2759
);
2860

2961
const handlePressOut = useCallback(
30-
(e: any) => {
62+
(e?: any) => {
3163
_onPressOut?.(e);
3264

33-
const [x, y] = [e.nativeEvent.pageX, e.nativeEvent.pageY];
34-
if (
35-
Math.abs(pressInPagePointRef.current.x - x) > 10 ||
36-
Math.abs(pressInPagePointRef.current.y - y) > 10
37-
) {
38-
e.preventDefault();
65+
if (e) {
66+
const [x, y] = [e.nativeEvent.pageX, e.nativeEvent.pageY];
67+
if (
68+
Math.abs(pressInPagePointRef.current.x - x) > 10 ||
69+
Math.abs(pressInPagePointRef.current.y - y) > 10
70+
) {
71+
e.preventDefault();
72+
}
3973
}
4074
},
4175
[_onPressOut],
4276
);
4377

4478
const onPress = useCallback(
45-
(e: any) => {
46-
if (e.isDefaultPrevented()) {
79+
(e?: any) => {
80+
if (e?.isDefaultPrevented()) {
4781
return;
4882
}
4983

@@ -52,8 +86,11 @@ export const CustomTouchableOpacity = ({
5286
[_onPress],
5387
);
5488

89+
const TouchableOpacityComp = useMemo(() => getViewComponentByAs(as), [as]);
90+
5591
return (
56-
<TouchableOpacity
92+
// @ts-expect-error
93+
<TouchableOpacityComp
5794
activeOpacity={DefaultOpacity}
5895
{...rest}
5996
onPressIn={handlePressIn}

apps/mobile/src/components/GlobalBottomSheetModal/GlobalBottomSheetModal.tsx

Lines changed: 7 additions & 5 deletions
Original file line numberDiff line numberDiff line change
@@ -82,9 +82,8 @@ export const GlobalBottomSheetModal = () => {
8282
APPROVAL_MODAL_NAMES.PrivatekeyWaiting,
8383
].includes(approvalComponent);
8484

85-
setModals(prev => [
86-
...prev,
87-
{
85+
setModals(prev => {
86+
const newModal = {
8887
id,
8988
params: {
9089
...params,
@@ -103,8 +102,11 @@ export const GlobalBottomSheetModal = () => {
103102
APPROVAL_SNAP_POINTS.Unknown
104103
: SNAP_POINTS[params.name],
105104
ref: React.createRef<AppBottomSheetModal>(),
106-
},
107-
]);
105+
};
106+
modalRefs.current[id] = newModal.ref;
107+
108+
return [...prev, newModal];
109+
});
108110
setTimeout(() => {
109111
handlePresent(id);
110112
}, 0);

apps/mobile/src/components/Toast.tsx

Lines changed: 3 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -5,6 +5,7 @@ import {
55
ActivityIndicator,
66
StyleProp,
77
TextStyle,
8+
Dimensions,
89
} from 'react-native';
910
import Toast, { ToastOptions } from 'react-native-root-toast';
1011
import { SvgProps } from 'react-native-svg';
@@ -17,6 +18,7 @@ import {
1718
} from '@/assets/icons/common';
1819
import React from 'react';
1920
import { ThemeColors } from '@/constant/theme';
21+
import { makeDebugBorder } from '@/utils/styles';
2022

2123
const config: ToastOptions = {
2224
position: Toast.positions.TOP + 80,
@@ -190,6 +192,7 @@ const styles = StyleSheet.create({
190192
container: {
191193
flexDirection: 'row',
192194
alignItems: 'center',
195+
maxWidth: Dimensions.get('window').width - 32,
193196
},
194197
icon: {
195198
marginRight: 8,

0 commit comments

Comments
 (0)