Narrow confirmation leaves with selectors#90321
Conversation
OlimpiaZurek
force-pushed
the
narrow-confirmation-leaves-with-selectors
branch
from
0a208b4 to
f9e8600
Compare
Codecov Report✅ Changes either increased or maintained existing code coverage, great job!
|
![chatgpt-codex-connector[bot]](https://avatars.githubusercontent.com/in/1144995?s=60&v=4){kind=small}
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 3975619b2c
ℹ️ About Codex in GitHub
Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".
| function useTransactionSelector<TReturn>(transactionID: string | undefined, selector: (t: OnyxEntry<OnyxTypes.Transaction>) => TReturn): TReturn | undefined { | ||
| const [draft] = useOnyx(`${ONYXKEYS.COLLECTION.TRANSACTION_DRAFT}${transactionID}`, {selector}); | ||
| const [existing] = useOnyx(`${ONYXKEYS.COLLECTION.TRANSACTION}${transactionID}`, {selector}); | ||
| return draft ?? existing; |
There was a problem hiding this comment.
When there is no TRANSACTION_DRAFT entry, this still can return the draft selector result instead of the real transaction because several selectors added in this patch return truthy default objects for undefined input (for example dateStateSelector, merchantStateSelector, categoryStateSelector, toggleStateSelector). In the existing-expense/read-only paths where only TRANSACTION_${id} exists, those fields will render blanks/defaults and ignore the saved transaction values. The hook needs to distinguish “draft key exists” from “selector returned a default value” before preferring the draft.
Useful? React with 👍 / 👎.
There was a problem hiding this comment.
Fixed by guarding each selector to return undefined when the transaction is absent, so draft ?? existing correctly falls back to the existing transaction when only TRANSACTION_${id} exists.
melvin-bot
Bot
requested review from
ShridharGoel and
flaviadefaria
and removed request for
a team and
flaviadefaria
|
@ShridharGoel Please copy/paste the Reviewer Checklist from here into a new comment on this PR and complete it. If you have the K2 extension, you can simply click: [this button] |
There was a problem hiding this comment.
💡 Codex Review
Here are some automated review suggestions for this pull request.
Reviewed commit: 4312c9215b
ℹ️ About Codex in GitHub
Codex has been enabled to automatically review pull requests in this repo. Reviews are triggered when you
- Open a pull request for review
- Mark a draft as ready
- Comment "@codex review".
If Codex has suggestions, it will comment; otherwise it will react with 👍.
When you sign up for Codex through ChatGPT, Codex can also answer questions or update the PR, like "@codex address that feedback".
| <CategoryField | ||
| isCategoryRequired={isCategoryRequired} | ||
| didConfirm={didConfirm} | ||
| isReadOnly={isReadOnly} | ||
| transactionID={transactionID} | ||
| action={action} | ||
| iouType={iouType} | ||
| reportID={reportID} | ||
| reportActionID={reportActionID} | ||
| policy={policy} | ||
| transaction={transaction} | ||
| formError={formError} | ||
| shouldNavigateToUpgradePath={shouldNavigateToUpgradePath} | ||
| shouldSelectPolicy={shouldSelectPolicy} | ||
| /> |
There was a problem hiding this comment.
This isn't passing isEditingSplitBill
| <DateField | ||
| shouldDisplayFieldError={shouldDisplayFieldError} | ||
| didConfirm={didConfirm} | ||
| isReadOnly={isReadOnly} | ||
| transactionID={transactionID} | ||
| action={action} | ||
| iouType={iouType} | ||
| reportID={reportID} | ||
| reportActionID={reportActionID} | ||
| transaction={transaction} | ||
| /> |
There was a problem hiding this comment.
This isn't passing isEditingSplitBill
| <TaxFields | ||
| policy={policy} | ||
| policyForMovingExpenses={policyForMovingExpenses} | ||
| transaction={transaction} | ||
| iouCurrencyCode={iouCurrencyCode} | ||
| canModifyTaxFields={canModifyTaxFields} | ||
| didConfirm={didConfirm} | ||
| transactionID={transactionID} | ||
| action={action} | ||
| iouType={iouType} | ||
| reportID={reportID} | ||
| formError={formError} | ||
| /> |
| <TagFieldRow | ||
| key={`tag_${entry.name}`} | ||
| entry={entry} | ||
| policyTagLists={tagRowSharedProps.policyTagLists} | ||
| previousTagsVisibility={tagRowSharedProps.previousTagsVisibility} | ||
| didConfirm={tagRowSharedProps.didConfirm} | ||
| isReadOnly={tagRowSharedProps.isReadOnly} | ||
| transactionID={tagRowSharedProps.transactionID} | ||
| action={tagRowSharedProps.action} | ||
| iouType={tagRowSharedProps.iouType} | ||
| reportID={tagRowSharedProps.reportID} | ||
| reportActionID={tagRowSharedProps.reportActionID} | ||
| transaction={tagRowSharedProps.transaction} | ||
| formError={tagRowSharedProps.formError} | ||
| /> |
|
🚧 @Julesssss has triggered a test Expensify/App build. You can view the workflow run here. |
Reviewer Checklist
Screenshots/VideosAndroid: HybridAppScreen.Recording.2026-05-21.at.3.25.44.AM.movAndroid: mWeb ChromeScreen.Recording.2026-05-21.at.3.29.14.AM.moviOS: HybridAppScreen.Recording.2026-05-21.at.3.17.43.AM.moviOS: mWeb SafariScreen.Recording.2026-05-21.at.3.19.56.AM.movMacOS: Chrome / SafariScreen.Recording.2026-05-21.at.3.15.31.AM.mov |
This comment has been minimized.
This comment has been minimized.
|
Ready for your final review @cristipaval |
|
🚧 @cristipaval has triggered a test Expensify/App build. You can view the workflow run here. |
|
✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release. |
|
🧪🧪 Use the links below to test this adhoc build on Android, iOS, and Web. Happy testing! 🧪🧪
|
|
🚀 Deployed to staging by https://github.com/cristipaval in version: 9.3.80-0 🚀
Bundle Size Analysis (Sentry): |
|
I reviewed all changes in this PR. This is a purely internal React refactoring that narrows Onyx subscriptions in No help site changes are required — there are no user-facing behavior changes, no new features, no UI changes, and no terminology updates. |
|
🚀 Deployed to production by https://github.com/luacmartins in version: 9.3.81-2 🚀
|
6 participants
Explanation of Change
Follow-up to #90208. Narrows the remaining 10 leaf fields in
MoneyRequestConfirmationList/sections/from full-Transactionsubscriptions to selector-scoped slices, so each leaf only re-renders when the specific fields it reads actually change.selectors.tswith one selector per leaf (and factories likecreateTagDisplaySelector(tagIndex)for index-keyed fields)useTransactionSelector— applies the same selector to bothTRANSACTION_DRAFT_${id}andTRANSACTION_${id}, preserving the existing draft-then-existing fallback in a single hookAmountField,AttendeeField,CategoryField,DateField,DescriptionField,MerchantField,TagFields,TaxFields,TimeFields,ToggleFieldsto read narrowed slices via the new hooktransactionprop pass-through fromConfirmationFieldList→TransactionDetailsFields/ClassificationFields(no longer needed since leaves read their own slices).SettingsFieldsstill receivestransactionbecauseReportFieldreads it directly — that one will be addressed in a follow-up.PR 3 of 4. Base: Refactor: extract sections from MoneyRequestConfirmationListFooter #90208 (decomposition). Stacks on PR 2's structural changes. Next: add a
ConfirmationFieldsProviderto remove remaining prop drilling.Fixed Issues
$ #90385
Tests
transactiondirectly — unchanged behavior expected)Offline tests
QA Steps
// TODO: These must be filled out, or the issue title must include "[No QA]."
Same as tests
PR Author Checklist
### Fixed Issuessection aboveTestssectionOffline stepssectionQA stepssectiontoggleReportand 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
Android: mWeb Chrome
iOS: Native
iOS: mWeb Safari
MacOS: Chrome / Safari