fix: close modal once navigate to share flow#82474
Conversation
| // eslint-disable-next-line react-hooks/exhaustive-deps | ||
| }, []); | ||
|
|
||
| useEffect(() => { |
There was a problem hiding this comment.
❌ CLEAN-REACT-PATTERNS-4 (docs)
This component now has multiple useEffect hooks handling unrelated concerns (error alerts, app state management, file processing, and modal closing), making it difficult to modify one concern without touching others.
Suggested fix: Extract the modal closing logic into a focused custom hook to improve separation of concerns:
// useCloseModalOnMount.ts
function useCloseModalOnMount() {
useEffect(() => {
closeModal();
}, []);
}
// In ShareRootPage.tsx
function ShareRootPage() {
useCloseModalOnMount();
// ... rest of component
}This makes the intent clear and isolates the modal closing concern from other initialization logic.
Please rate this suggestion with 👍 or 👎 to help us improve! Reactions are used to monitor reviewer efficiency.
There was a problem hiding this comment.
This is definitely too strict for a one-liner.
| // eslint-disable-next-line react-hooks/exhaustive-deps | ||
| }, []); | ||
|
|
||
| useEffect(() => { |
There was a problem hiding this comment.
❌ PERF-16 (docs)
The closeModal() call is not idempotent and lacks a guard mechanism. In React Strict Mode (development), this Effect will execute twice, potentially closing two modals instead of one. While close() has a guard for when no modals exist (closeModals.length === 0), it would still attempt to close two modals if both are present during initialization.
Suggested fix: Add a module-level guard to ensure this runs only once:
let didCloseModal = false;
function ShareRootPage() {
useEffect(() => {
if (didCloseModal) {
return;
}
didCloseModal = true;
closeModal();
}, []);
// ... rest of component
}Alternatively, if this is truly idempotent (safe to call twice), please add a comment explaining why.
Please rate this suggestion with 👍 or 👎 to help us improve! Reactions are used to monitor reviewer efficiency.
Codecov Report✅ Changes either increased or maintained existing code coverage, great job!
|
Reviewer Checklist
Screenshots/VideosAndroid: HybridAppAndroid: mWeb ChromeiOS: HybridAppios.moviOS: mWeb SafariMacOS: Chrome / Safari |
|
✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release. |
|
🚧 @lakchote has triggered a test Expensify/App build. You can view the workflow run here. |
|
🧪🧪 Use the links below to test this adhoc build on Android, iOS, and Web. Happy testing! 🧪🧪
|
|
🚀 Deployed to staging by https://github.com/lakchote in version: 9.3.22-0 🚀
|
|
🚀 Deployed to production by https://github.com/mountiny in version: 9.3.22-4 🚀
|
|
🚀 Deployed to production by https://github.com/mountiny in version: 9.3.22-4 🚀
|
Explanation of Change
Fixed Issues
$ #76763
PROPOSAL: #76763 (comment)
Tests
Offline tests
QA Steps
// TODO: These must be filled out, or the issue title must include ""[No QA].""
PR Author Checklist
### Fixed Issuessection aboveTestssectionOffline stepssectionQA stepssectioncanBeMissingparam foruseOnyxtoggleReportand notonIconClick)src/languages/*files and using the translation methodSTYLE.md) were followedAvatar, I verified the components usingAvatarare working as expected)StyleUtils.getBackgroundAndBorderStyle(theme.componentBG))npm run compress-svg)Avataris modified, I verified thatAvataris working as expected in all cases)Designlabel and/or tagged@Expensify/designso the design team can review the changes.ScrollViewcomponent to make it scrollable when more elements are added to the page.mainbranch was merged into this PR after a review, I tested again and verified the outcome was still expected according to theTeststeps.Screenshots/Videos
Android: Native
I am unable to login in this platform. I will update video later
Android: mWeb Chrome
This feature isn't available in this platform
iOS: Native
Screen.Recording.2026-02-14.at.06.21.04.mov
iOS: mWeb Safari
This feature isn't available in this platform
MacOS: Chrome / Safari
This feature isn't available in this platform