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

@remix-run/router: Add support for navigation blocking #9709

Merged
merged 54 commits into from
Jan 13, 2023
Merged
Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
54 commits
Select commit Hold shift + click to select a range
0cc6142
history: allow multiple listeners
chaance Dec 2, 2022
3c8606c
bump UMD filesize limit
chaance Dec 7, 2022
04a8c8f
feat(router): add support for history blocking APIs
chaance Dec 8, 2022
2497c02
Merge branch 'dev' into history-blocking
chaance Dec 8, 2022
cbad7dc
chore: add changeset
chaance Dec 8, 2022
5d98596
Tweak changeset
chaance Dec 8, 2022
8e0a8d0
revert unrelated history changes
chaance Dec 8, 2022
0eedecf
fix tests
chaance Dec 8, 2022
8c4ef44
add missing blockers obj
chaance Dec 8, 2022
82a8267
add missing functions for router
chaance Dec 8, 2022
226eb08
implement useBlocker
chaance Dec 9, 2022
0b24b3c
add useBlocker to example
chaance Dec 9, 2022
c5f0384
fix issues with POP blocking
chaance Dec 20, 2022
12d8860
don't recreate existing blockers
chaance Dec 21, 2022
5d04b58
add support for option
chaance Dec 21, 2022
4a5ce97
usePrompt implementation
chaance Dec 21, 2022
70c4e86
fix subtle bugs when navigating to the same route
chaance Dec 21, 2022
f2ff193
implement beforeunload handler
chaance Dec 21, 2022
6823f58
patch fix for async tests
chaance Dec 21, 2022
3545cdc
Merge branch 'dev' into history-blocking
chaance Dec 21, 2022
f56ab7d
Fix history index issue and wire up singleton blocking
brophdawg11 Dec 22, 2022
e34bde0
Merge branch 'dev' into history-blocking
chaance Dec 23, 2022
5a81d17
fix some blocking tests
chaance Jan 2, 2023
934692f
Merge branch 'dev' into history-blocking
chaance Jan 2, 2023
7285473
Add beforeUnload flag to useBlocker
brophdawg11 Jan 9, 2023
8cfc7d3
Add navigation blocking example
brophdawg11 Jan 9, 2023
d2f05a1
Updates
brophdawg11 Jan 10, 2023
12f6daa
Remove manual back button
brophdawg11 Jan 10, 2023
bb1bb0a
update router blocking tests
chaance Jan 11, 2023
50d7c80
add missing method in server
chaance Jan 11, 2023
139974d
revert changes in data router example
chaance Jan 11, 2023
e6cbdbb
update hook name in logs
chaance Jan 11, 2023
a943da9
update tests
chaance Jan 11, 2023
65bba99
add use-blocker tests
chaance Jan 13, 2023
23d3aac
Merge branch 'history-blocking' of github.com:remix-run/react-router …
chaance Jan 13, 2023
2859b13
Merge branch 'dev' into history-blocking
chaance Jan 13, 2023
ba5c76d
update tests
chaance Jan 13, 2023
6fba7e5
bump umd bundle size limit
chaance Jan 13, 2023
f4d6b00
update blocker and shouldBlock function interface
chaance Jan 13, 2023
e25325e
update example
chaance Jan 13, 2023
27568f7
update example and mark exports as unstable
chaance Jan 13, 2023
fa00b37
add changeset
chaance Jan 13, 2023
546e3ac
update changeset
chaance Jan 13, 2023
76e7fde
update readme
chaance Jan 13, 2023
2334a5b
relax reliance on boolean type for blocker function
chaance Jan 13, 2023
b507993
update tests
chaance Jan 13, 2023
e1426d0
Revert to prior usePrompt example
brophdawg11 Jan 13, 2023
16e464f
Move useBlocker to react-router, remove getBlockerState
brophdawg11 Jan 13, 2023
b9739ba
Minor updates
brophdawg11 Jan 13, 2023
28da8cb
update build script
chaance Jan 13, 2023
b29b5e0
Bump bundle
brophdawg11 Jan 13, 2023
887314a
export from react-router-native
chaance Jan 13, 2023
6f15186
Merge branch 'history-blocking' of github.com:remix-run/react-router …
chaance Jan 13, 2023
7749172
rm prompt from example
chaance Jan 13, 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
5 changes: 5 additions & 0 deletions .changeset/lazy-needles-shout.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"react-router-dom": patch
---

Added pass-through event listener options argument to `useBeforeUnload`
5 changes: 5 additions & 0 deletions .changeset/light-phones-impress.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"@remix-run/router": minor
---

Added support for navigation blocking APIs
5 changes: 5 additions & 0 deletions .changeset/violet-timers-type.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
"react-router-dom": minor
---

Add `unstable_useBlocker` hook for blocking navigations within the app's location origin
3 changes: 2 additions & 1 deletion .gitignore
Original file line number Diff line number Diff line change
Expand Up @@ -22,4 +22,5 @@ node_modules/
/packages/react-router-dom-v5-compat/react-router-dom

.eslintcache
/.env
/.env
/NOTES.md
Copy link
Collaborator Author

Choose a reason for hiding this comment

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

Needed somewhere to keep notes because this was getting confusing 😅

5 changes: 5 additions & 0 deletions examples/navigation-blocking/.gitignore
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
node_modules
.DS_Store
dist
dist-ssr
*.local
4 changes: 4 additions & 0 deletions examples/navigation-blocking/.stackblitzrc
Original file line number Diff line number Diff line change
@@ -0,0 +1,4 @@
{
"installDependencies": true,
"startCommand": "npm run dev"
}
15 changes: 15 additions & 0 deletions examples/navigation-blocking/README.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,15 @@
---
title: Navigation Blocking
toc: false
order: 1
---

# Navigation Blocking

This example demonstrates using `unstable_useBlocker` to prevent navigating away from a page where you might lose user-entered form data. A potentially better UX for this is storing user-entered information in `sessionStorage` and pre-populating the form on return.

## Preview

Open this example on [StackBlitz](https://stackblitz.com):

[![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/remix-run/react-router/tree/main/examples/navigation-blocking?file=src/App.tsx)
12 changes: 12 additions & 0 deletions examples/navigation-blocking/index.html
Original file line number Diff line number Diff line change
@@ -0,0 +1,12 @@
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<title>React Router - Navigation Blocking</title>
</head>
<body>
<div id="root"></div>
<script type="module" src="/src/main.tsx"></script>
</body>
</html>
Loading