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.

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

Fix issue with reused blockers on subsequent navigations #10656

Merged
merged 3 commits into from Jun 30, 2023

Conversation

brophdawg11
Copy link
Contributor

Our approach for clearing blockers after a successful navigation was incorrect for blockers that were reused in a layout route.

Closes #10649

@changeset-bot
Copy link

changeset-bot bot commented Jun 30, 2023

🦋 Changeset detected

Latest commit: 599d2fc

The changes in this PR will be included in the next version bump.

This PR includes changesets to release 5 packages
Name Type
react-router Patch
@remix-run/router Patch
react-router-dom Patch
react-router-dom-v5-compat Patch
react-router-native Patch

Not sure what this means? Click here to learn what changesets are.

Click here if you're a maintainer who wants to add another changeset to this PR

@@ -939,7 +939,6 @@ export function useBlocker(shouldBlock: boolean | BlockerFunction): Blocker {
let state = useDataRouterState(DataRouterStateHook.UseBlocker);

let [blockerKey, setBlockerKey] = React.useState("");
let [blocker, setBlocker] = React.useState<Blocker>(IDLE_BLOCKER);
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Per remix-run/remix#6704 (comment), it was pointed out that we don't even need the blocker in local state anymore. We prefer the state.blockers value anyway as the source of truth that updates via DataRouterStateContext and we can just fallback on IDLE_BLOCKER instead of syncing router state into local state.

Comment on lines +1029 to +1033
let blockers = state.blockers;
if (blockers.size > 0) {
blockers = new Map(blockers);
blockers.forEach((_, k) => blockers.set(k, IDLE_BLOCKER));
}
Copy link
Contributor Author

Choose a reason for hiding this comment

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

Deleting the blockers here was incorrect if they existed in a reused layout route. Instead we just want to set them back to IDLE_BLOCKER and let the useBlocker useEffect handle deletion on unmount

@brophdawg11 brophdawg11 merged commit cbda9cf into release-next Jun 30, 2023
3 checks passed
@brophdawg11 brophdawg11 deleted the brophdawg11/reused-blocker branch June 30, 2023 17:34
@github-actions
Copy link
Contributor

🤖 Hello there,

We just published version 6.14.1-pre.1 which includes this pull request. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!

@github-actions
Copy link
Contributor

🤖 Hello there,

We just published version 6.14.1 which includes this pull request. If you'd like to take it for a test run please try it out and let us know what you think!

Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

None yet

2 participants