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

Jump to bottom

Modal: fix closing when contained iframe is focused #51602

Merged
merged 16 commits into from
Oct 5, 2023
Merged

Modal: fix closing when contained iframe is focused #51602

Changes from 1 commit
Commits
Show all changes
16 commits
Select commit Hold shift + click to select a range
35ab7cc
Fix modal closing when a contained iframe is focused
stokesman Jun 16, 2023
6502514
Test: add iframe to Modal component
t-hamano Oct 25, 2022
22d4171
Monopolize open modal
stokesman Sep 5, 2023
40ae7fe
Revise comment
stokesman Sep 5, 2023
8eae8b3
Remove needless condition
stokesman Sep 5, 2023
e76f873
Avoid running effect due to unstable prop
stokesman Sep 12, 2023
517cdb1
Permit nested Modals
stokesman Sep 12, 2023
1bf1f02
Robustly support nested Modals
stokesman Sep 14, 2023
f4344d3
Preserve current behavior for nested modals
stokesman Sep 21, 2023
795d2c5
Split effect to separate concerns
stokesman Sep 22, 2023
49f95b3
Add unit test for request closing of nested modals
stokesman Sep 29, 2023
183b9a3
Call onRequestClose for nested modal when outer modal unmounts
stokesman Sep 22, 2023
145dc0e
Comment and rename per feedback
stokesman Oct 5, 2023
04a1194
Add changelog entry
stokesman Oct 5, 2023
3c18cfe
Revert "Test: add iframe to Modal component"
stokesman Oct 5, 2023
c7824d6
Fix changelog
stokesman Oct 5, 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
Prev Previous commit
Next Next commit
Call onRequestClose for nested modal when outer modal unmounts
  • Loading branch information
@stokesman
stokesman committed Oct 5, 2023
commit 183b9a3659671e540e589e96e72c18e678cdaaab
14 changes: 9 additions & 5 deletions packages/components/src/modal/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -144,14 +144,20 @@ function UnforwardedModal(

const dismissers = useContext( context );
const isLevel0 = dismissers === level0Dismissers;
const nestedDismissers = useRef< typeof level0Dismissers >( [] );

// Updates the stack tracking open modals at this level and calls
// onRequestClose for the prior modal if applicable.
// onRequestClose for any prior and/or nested modals as applicable.
useEffect( () => {
dismissers.push( refOnRequestClose );
const [ first, second ] = dismissers;
if ( second ) first?.current?.();
return () => void dismissers.shift();

const nested = nestedDismissers.current;
return () => {
nested[ 0 ]?.current?.();
dismissers.shift();
};
}, [ dismissers ] );

// Adds/removes the value of bodyOpenClassName to body element.
Expand Down Expand Up @@ -344,10 +350,8 @@ function UnforwardedModal(
</div>
);

const nextLevelDismissers = useRef( [] );

return createPortal(
<context.Provider value={ nextLevelDismissers.current }>
<context.Provider value={ nestedDismissers.current }>
{ modal }
</context.Provider>,
document.body
Expand Down