Skip to content

Commit c02d7b5

Browse files
MounirDhahriMounirDhahri
authored
chore: upgrade react-navigation to latest (#12821)
* chore: upgrade react-navigation to latest * chore: update patch * chore: address review comments * chore: upgrade podfile.lock again * chore: patch src and types
1 parent da499f0 commit c02d7b5

File tree

4 files changed

+121
-150
lines changed

4 files changed

+121
-150
lines changed

‎ios/Podfile.lock‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -2524,7 +2524,7 @@ PODS:
25242524
- ReactCommon/turbomodule/bridging
25252525
- ReactCommon/turbomodule/core
25262526
- Yoga
2527-
- RNScreens (4.11.1):
2527+
- RNScreens (4.16.0):
25282528
- DoubleConversion
25292529
- glog
25302530
- hermes-engine
@@ -3416,7 +3416,7 @@ SPEC CHECKSUMS:
34163416
RNPermissions: 92430517fd4353d5b2b7217cd1ca48ddd2875245
34173417
RNReactNativeHapticFeedback: 7601768ee65ffc86fc93d7c30dd917031144ed3d
34183418
RNReanimated: 7fe194cef376e772f1efbad325cb5d26ea3930df
3419-
RNScreens: 62fdbbc4c984150b34c36f095c6ba2510ca9b6a5
3419+
RNScreens: 0cba9551497bcf6ceaa75878c08f5cb9a2fac6a4
34203420
RNSentry: 892426b4ab3a4259e7e30bf14c5b231ba3c774a2
34213421
RNShare: ef61d9be34bf9881d515851d0710a023cdc4f0f4
34223422
RNSVG: 4d6e9f0087980e36e14e1739b9c1760e63de5b8c

‎package.json‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -128,12 +128,12 @@
128128
"@react-native-firebase/app": "23.1.0",
129129
"@react-native-firebase/messaging": "23.1.0",
130130
"@react-native-google-signin/google-signin": "11.0.1",
131-
"@react-navigation/bottom-tabs": "7.3.3",
132-
"@react-navigation/elements": "2.3.1",
133-
"@react-navigation/material-top-tabs": "7.2.10",
134-
"@react-navigation/native": "7.1.17",
135-
"@react-navigation/native-stack": "7.3.3",
136-
"@react-navigation/stack": "7.3.3",
131+
"@react-navigation/bottom-tabs": "7.4.8",
132+
"@react-navigation/elements": "2.6.5",
133+
"@react-navigation/material-top-tabs": "7.3.8",
134+
"@react-navigation/native": "7.1.18",
135+
"@react-navigation/native-stack": "7.3.27",
136+
"@react-navigation/stack": "7.4.9",
137137
"@rnmapbox/maps": "10.1.44",
138138
"@segment/analytics-react-native": "2.20.3",
139139
"@segment/analytics-react-native-plugin-braze": "0.6.1",
@@ -186,7 +186,7 @@
186186
"react-native-reanimated-zoom": "0.3.3",
187187
"react-native-render-html": "6.3.4",
188188
"react-native-safe-area-context": "5.4.1",
189-
"react-native-screens": "4.11.1",
189+
"react-native-screens": "4.16.0",
190190
"react-native-shake": "6.7.8",
191191
"react-native-share": "12.0.9",
192192
"react-native-svg": "15.12.0",

‎patches/@react-navigation+bottom-tabs+7.3.3.patch‎ renamed to ‎patches/@react-navigation+bottom-tabs+7.4.8.patch‎

Lines changed: 46 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -1,80 +1,83 @@
1-
diff --git a/node_modules/@react-navigation/bottom-tabs/lib/commonjs/views/BottomTabBar.js b/node_modules/@react-navigation/bottom-tabs/lib/commonjs/views/BottomTabBar.js
2-
index 8f0fb1c..bfc1cfc 100644
3-
--- a/node_modules/@react-navigation/bottom-tabs/lib/commonjs/views/BottomTabBar.js
4-
+++ b/node_modules/@react-navigation/bottom-tabs/lib/commonjs/views/BottomTabBar.js
5-
@@ -131,6 +131,7 @@ function BottomTabBar({
6-
tabBarShowLabel,
7-
tabBarLabelPosition,
8-
tabBarHideOnKeyboard = false,
9-
+ tabBarVisible = false,
10-
tabBarVisibilityAnimationConfig,
11-
tabBarVariant = 'uikit',
12-
tabBarStyle,
13-
@@ -149,7 +150,7 @@ function BottomTabBar({
14-
const dimensions = (0, _reactNativeSafeAreaContext.useSafeAreaFrame)();
15-
const isKeyboardShown = (0, _useIsKeyboardShown.useIsKeyboardShown)();
16-
const onHeightChange = _react.default.useContext(_BottomTabBarHeightCallbackContext.BottomTabBarHeightCallbackContext);
17-
- const shouldShowTabBar = !(tabBarHideOnKeyboard && isKeyboardShown);
18-
+ const shouldShowTabBar = !(tabBarHideOnKeyboard && isKeyboardShown) && !tabBarVisible;
19-
const visibilityAnimationConfigRef = _react.default.useRef(tabBarVisibilityAnimationConfig);
20-
_react.default.useEffect(() => {
21-
visibilityAnimationConfigRef.current = tabBarVisibilityAnimationConfig;
22-
@@ -251,6 +252,10 @@ function BottomTabBar({
23-
outputRange: [layout.height + insets[tabBarPosition === 'top' ? 'top' : 'bottom'] + _reactNative.StyleSheet.hairlineWidth, 0]
24-
})
25-
}],
26-
+ opacity: visible.interpolate({
27-
+ inputRange: [0, 1],
28-
+ outputRange: [0, 1]
29-
+ }),
30-
// Absolutely position the tab bar so that the content is below it
31-
// This is needed to avoid gap at bottom when the tab bar is hidden
32-
position: isTabBarHidden ? 'absolute' : undefined
331
diff --git a/node_modules/@react-navigation/bottom-tabs/lib/module/views/BottomTabBar.js b/node_modules/@react-navigation/bottom-tabs/lib/module/views/BottomTabBar.js
34-
index dbde384..ec63cde 100644
2+
index cb4e310..ecacb80 100644
353
--- a/node_modules/@react-navigation/bottom-tabs/lib/module/views/BottomTabBar.js
364
+++ b/node_modules/@react-navigation/bottom-tabs/lib/module/views/BottomTabBar.js
37-
@@ -124,6 +124,7 @@ export function BottomTabBar({
5+
@@ -123,6 +123,7 @@ export function BottomTabBar({
386
tabBarShowLabel,
397
tabBarLabelPosition,
408
tabBarHideOnKeyboard = false,
419
+ tabBarVisible = false,
4210
tabBarVisibilityAnimationConfig,
4311
tabBarVariant = 'uikit',
4412
tabBarStyle,
45-
@@ -142,7 +143,7 @@ export function BottomTabBar({
46-
const dimensions = useSafeAreaFrame();
13+
@@ -140,7 +141,7 @@ export function BottomTabBar({
14+
}
4715
const isKeyboardShown = useIsKeyboardShown();
4816
const onHeightChange = React.useContext(BottomTabBarHeightCallbackContext);
4917
- const shouldShowTabBar = !(tabBarHideOnKeyboard && isKeyboardShown);
5018
+ const shouldShowTabBar = !(tabBarHideOnKeyboard && isKeyboardShown) && !tabBarVisible;
5119
const visibilityAnimationConfigRef = React.useRef(tabBarVisibilityAnimationConfig);
5220
React.useEffect(() => {
5321
visibilityAnimationConfigRef.current = tabBarVisibilityAnimationConfig;
54-
@@ -244,6 +245,10 @@ export function BottomTabBar({
22+
@@ -241,8 +242,12 @@ export function BottomTabBar({
23+
translateY: visible.interpolate({
24+
inputRange: [0, 1],
5525
outputRange: [layout.height + insets[tabBarPosition === 'top' ? 'top' : 'bottom'] + StyleSheet.hairlineWidth, 0]
56-
})
26+
- })
27+
+ }),
5728
}],
5829
+ opacity: visible.interpolate({
5930
+ inputRange: [0, 1],
6031
+ outputRange: [0, 1]
61-
+ }),
32+
+ }),
6233
// Absolutely position the tab bar so that the content is below it
6334
// This is needed to avoid gap at bottom when the tab bar is hidden
6435
position: isTabBarHidden ? 'absolute' : undefined
6536
diff --git a/node_modules/@react-navigation/bottom-tabs/src/types.tsx b/node_modules/@react-navigation/bottom-tabs/src/types.tsx
66-
index 02f7119..01dfabc 100644
37+
index 2438b03..eaa6d4b 100644
6738
--- a/node_modules/@react-navigation/bottom-tabs/src/types.tsx
6839
+++ b/node_modules/@react-navigation/bottom-tabs/src/types.tsx
69-
@@ -224,6 +224,11 @@ export type BottomTabNavigationOptions = HeaderOptions & {
40+
@@ -239,6 +239,11 @@ export type BottomTabNavigationOptions = HeaderOptions & {
7041
*/
71-
tabBarHideOnKeyboard?: boolean;
42+
tabBarVariant?: Variant;
7243

7344
+ /**
7445
+ * Whether the tab bar gets hidden when the screen is focused. Defaults to `false`.
7546
+ */
7647
+ tabBarVisible?: boolean;
7748
+
7849
/**
79-
* Animation config for showing and hiding the tab bar when the keyboard is shown/hidden.
50+
* Style object for the tab bar container.
8051
*/
52+
diff --git a/node_modules/@react-navigation/bottom-tabs/src/views/BottomTabBar.tsx b/node_modules/@react-navigation/bottom-tabs/src/views/BottomTabBar.tsx
53+
index 55b9c8f..816b028 100644
54+
--- a/node_modules/@react-navigation/bottom-tabs/src/views/BottomTabBar.tsx
55+
+++ b/node_modules/@react-navigation/bottom-tabs/src/views/BottomTabBar.tsx
56+
@@ -175,6 +175,7 @@ export function BottomTabBar({
57+
tabBarVariant = 'uikit',
58+
tabBarStyle,
59+
tabBarBackground,
60+
+ tabBarVisible = false,
61+
tabBarActiveTintColor,
62+
tabBarInactiveTintColor,
63+
tabBarActiveBackgroundColor,
64+
@@ -205,7 +206,7 @@ export function BottomTabBar({
65+
66+
const onHeightChange = React.useContext(BottomTabBarHeightCallbackContext);
67+
68+
- const shouldShowTabBar = !(tabBarHideOnKeyboard && isKeyboardShown);
69+
+ const shouldShowTabBar = !(tabBarHideOnKeyboard && isKeyboardShown) && !tabBarVisible
70+
71+
const visibilityAnimationConfigRef = React.useRef(
72+
tabBarVisibilityAnimationConfig
73+
@@ -367,6 +368,10 @@ export function BottomTabBar({
74+
0,
75+
],
76+
}),
77+
+ opacity: visible.interpolate({
78+
+ inputRange: [0, 1],
79+
+ outputRange: [0, 1],
80+
+ }),
81+
},
82+
],
83+
// Absolutely position the tab bar so that the content is below it

0 commit comments

Comments
 (0)