Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update @react-navigation/native version #32087

Merged
merged 4 commits into from
Dec 13, 2023
Merged

Update @react-navigation/native version #32087

Show file tree
Hide file tree
Changes from 2 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
f14b9b4
update @react-navigation/native version
dukenv0307 Nov 28, 2023
0ea03d2
add new patch
dukenv0307 Nov 30, 2023
d715be7
Merge branch 'main' into fix/31487
dukenv0307 Dec 11, 2023
4b24778
update patch
dukenv0307 Dec 11, 2023
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
62 changes: 31 additions & 31 deletions package-lock.json
View file
Open in desktop

Some generated files are not rendered by default. Learn more about how customized files appear on GitHub.

2 changes: 1 addition & 1 deletion package.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -83,7 +83,7 @@
"@react-native-google-signin/google-signin": "^10.0.1",
"@react-native-picker/picker": "^2.4.3",
"@react-navigation/material-top-tabs": "^6.6.3",
"@react-navigation/native": "6.1.6",
"@react-navigation/native": "6.1.8",
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@dukenv0307, have you encountered this prompt?
image

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Do I need to create a new patch?

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Ah, I think so, and we should avoid introducing regressions. :)

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ntdiary Updated with new patch.

"@react-navigation/stack": "6.3.16",
"@react-ng/bounds-observer": "^0.2.1",
"@rnmapbox/maps": "^10.0.11",
Expand Down
113 changes: 36 additions & 77 deletions patches/@react-navigation+native+6.1.6.patch → patches/@react-navigation+native+6.1.8.patch
View file
Open in desktop
Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@dukenv0307, curious how you recreated this patch. I applied the two patches separately, and it seems they have some significant differences compared to the previous ones. 😂

createMemoryHistory.js:
image

useLinking.js:
image

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ntdiary I will go to the node_module file of the lib and compare it with the old patch. Some code in useLinking.js is added in the new version of the lib which is the same as old patch so we don't need it in the new patch file.

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@dukenv0307, I thought you would check the patch again to make sure it is correct. Based on the two images I provided above, it is clear that the changes were not correctly synchronized to the new version. Can you please check that again? 😅

For example, in the old patch, the line index = this.index; was placed inside the onPopState() function, but in the new patch, it was placed above the onPopState() function.
In the old patch, the comment // and remove any entries was added after the comment // If history length, but in the new patch, it was placed after the comment // Store the updated. These differences will cause the function logic to change.

Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@ntdiary Thanks for your review, updated.

Original file line number Diff line number Diff line change
@@ -1,14 +1,15 @@
diff --git a/node_modules/@react-navigation/native/lib/module/createMemoryHistory.js b/node_modules/@react-navigation/native/lib/module/createMemoryHistory.js
index 16fdbef..bc2c96a 100644
index 16fdbef..7cc5da8 100644
--- a/node_modules/@react-navigation/native/lib/module/createMemoryHistory.js
+++ b/node_modules/@react-navigation/native/lib/module/createMemoryHistory.js
@@ -1,8 +1,23 @@
@@ -1,8 +1,25 @@
import { nanoid } from 'nanoid/non-secure';
+import { findFocusedRouteKey } from './findFocusedRouteKey';
+
export default function createMemoryHistory() {
let index = 0;
let items = [];
-
+ const log = () => {
+ console.log(JSON.stringify({
+ index,
Expand All @@ -27,7 +28,7 @@ index 16fdbef..bc2c96a 100644
// Pending callbacks for `history.go(n)`
// We might modify the callback stored if it was interrupted, so we have a ref to identify it
const pending = [];
@@ -16,6 +31,9 @@ export default function createMemoryHistory() {
@@ -16,6 +33,9 @@ export default function createMemoryHistory() {
});
};
const history = {
Expand All @@ -37,7 +38,7 @@ index 16fdbef..bc2c96a 100644
get index() {
var _window$history$state;
// We store an id in the state instead of an index
@@ -32,12 +50,13 @@ export default function createMemoryHistory() {
@@ -32,12 +52,13 @@ export default function createMemoryHistory() {
},
backIndex(_ref) {
let {
Expand All @@ -53,26 +54,22 @@ index 16fdbef..bc2c96a 100644
return i;
}
}
@@ -68,7 +87,9 @@ export default function createMemoryHistory() {
@@ -68,6 +89,7 @@ export default function createMemoryHistory() {
window.history.pushState({
id
}, '', path);
+ // log();
},
+
replace(_ref3) {
var _window$history$state2;
let {
@@ -108,7 +129,9 @@ export default function createMemoryHistory() {
@@ -108,6 +130,7 @@ export default function createMemoryHistory() {
window.history.replaceState({
id
}, '', pathWithHash);
+ // log();
},
+
// `history.go(n)` is asynchronous, there are couple of things to keep in mind:
// - it won't do anything if we can't go `n` steps, the `popstate` event won't fire.
// - each `history.go(n)` call will trigger a separate `popstate` event with correct location.
@@ -175,20 +198,17 @@ export default function createMemoryHistory() {
// But on Firefox, it seems to take much longer, around 50ms from our testing
// We're using a hacky timeout since there doesn't seem to be way to know for sure
Expand Down Expand Up @@ -100,21 +97,22 @@ index 16fdbef..bc2c96a 100644
const last = pending.pop();
window.removeEventListener('popstate', onPopState);
last === null || last === void 0 ? void 0 : last.cb();
@@ -202,12 +222,17 @@ export default function createMemoryHistory() {
@@ -201,13 +221,18 @@ export default function createMemoryHistory() {
// If we call `history.go(n)` ourselves, we don't want it to trigger the listener
// Here we normalize it so that only external changes (e.g. user pressing back/forward) trigger the listener
listen(listener) {
+ // Fix createMemoryHistory.index variable's value
+ // as it may go out of sync when navigating in the browser.
+ index = this.index;
const onPopState = () => {
+ // Fix createMemoryHistory.index variable's value
+ // as it may go out of sync when navigating in the browser.
+ index = this.index;
if (pending.length) {
// This was triggered by `history.go(n)`, we shouldn't call the listener
return;
}
listener();
+ // log();
};
+
+
window.addEventListener('popstate', onPopState);
return () => window.removeEventListener('popstate', onPopState);
}
Expand All @@ -133,7 +131,7 @@ index 0000000..16da117
+//# sourceMappingURL=findFocusedRouteKey.js.map
\ No newline at end of file
diff --git a/node_modules/@react-navigation/native/lib/module/useLinking.js b/node_modules/@react-navigation/native/lib/module/useLinking.js
index 5bf2a88..a4318ef 100644
index 6f0ac51..42f1c31 100644
--- a/node_modules/@react-navigation/native/lib/module/useLinking.js
+++ b/node_modules/@react-navigation/native/lib/module/useLinking.js
@@ -2,6 +2,7 @@ import { findFocusedRoute, getActionFromState as getActionFromStateDefault, getP
Expand All @@ -144,37 +142,7 @@ index 5bf2a88..a4318ef 100644
import ServerContext from './ServerContext';
/**
* Find the matching navigation state that changed between 2 navigation states
@@ -34,32 +35,52 @@ const findMatchingState = (a, b) => {
/**
* Run async function in series as it's called.
*/
-const series = cb => {
- // Whether we're currently handling a callback
- let handling = false;
- let queue = [];
- const callback = async () => {
- try {
- if (handling) {
- // If we're currently handling a previous event, wait before handling this one
- // Add the callback to the beginning of the queue
- queue.unshift(callback);
- return;
- }
- handling = true;
- await cb();
- } finally {
- handling = false;
- if (queue.length) {
- // If we have queued items, handle the last one
- const last = queue.pop();
- last === null || last === void 0 ? void 0 : last();
- }
- }
+const series = (cb) => {
+ let queue = Promise.resolve();
+ const callback = () => {
+ queue = queue.then(cb);
};
@@ -42,6 +43,44 @@ export const series = cb => {
return callback;
};
let linkingHandlers = [];
Expand Down Expand Up @@ -219,17 +187,17 @@ index 5bf2a88..a4318ef 100644
export default function useLinking(ref, _ref) {
let {
independent,
@@ -251,6 +272,9 @@ export default function useLinking(ref, _ref) {
@@ -231,6 +270,9 @@ export default function useLinking(ref, _ref) {
// Otherwise it's likely a change triggered by `popstate`
path !== pendingPath) {
const historyDelta = (focusedState.history ? focusedState.history.length : focusedState.routes.length) - (previousFocusedState.history ? previousFocusedState.history.length : previousFocusedState.routes.length);
+
+
+ // The historyDelta and historyDeltaByKeys may differ if the new state has an entry that didn't exist in previous state
+ const historyDeltaByKeys = getHistoryDeltaByKeys(focusedState, previousFocusedState);
if (historyDelta > 0) {
// If history length is increased, we should pushState
// Note that path might not actually change here, for example, drawer open should pushState
@@ -262,34 +286,55 @@ export default function useLinking(ref, _ref) {
@@ -242,25 +284,52 @@ export default function useLinking(ref, _ref) {
// If history length is decreased, i.e. entries were removed, we want to go back

const nextIndex = history.backIndex({
Expand Down Expand Up @@ -264,36 +232,27 @@ index 5bf2a88..a4318ef 100644
+ });
+ }
}
-
- // Store the updated state as well as fix the path if incorrect
// Store the updated state as well as fix the path if incorrect
- history.replace({
- path,
- state
- });
+ // and remove any entries from history which focued route no longer exists in state
+ // That may happen if we replace a whole navigator.
+ const staleHistoryDiff = getStaleHistoryDiff(history.items.slice(0, history.index + 1), state);
+ if (staleHistoryDiff <= 0) {
+ history.replace({
+ path,
+ state
+ });
+ } else {
+ await history.go(-staleHistoryDiff);
+ history.push({
+ path,
+ state
+ });
+ }
} catch (e) {
// The navigation was interrupted
}
} else {
// If history length is unchanged, we want to replaceState
- history.replace({
- path,
- state
- });
+ // and remove any entries from history which focued route no longer exists in state
+ // That may happen if we replace a whole navigator.
+ const staleHistoryDiff = getStaleHistoryDiff(history.items.slice(0, history.index + 1), state);
+ if (staleHistoryDiff <= 0) {
+ history.replace({
+ path,
+ state
+ });
+ } else {
+ await history.go(-staleHistoryDiff);
+ history.push({
+ path,
+ state
+ });
+ }
}
} else {
// If no common navigation state was found, assume it's a replace
Loading