[Payment due @dukenv0307] Show field-specific SmartScan failure messages#89454
Conversation
When a receipt SmartScan fails, the violation message now specifies which fields are missing (e.g., "Receipt scanning failed — missing date") instead of the generic "Receipt scanning failed" message. The violation data from the backend now includes a missingFields array (e.g., ["date"], ["merchant", "amount"]) which the frontend uses to build the field-specific message. Falls back to the generic message when missingFields is absent for backward compatibility. Updated all 10 language files with the new message format. Co-authored-by: David Barrett <quinthar@users.noreply.github.com>
Codecov Report❌ Looks like you've decreased code coverage for some files. Please write tests to increase, or at least maintain, the existing level of code coverage. See our documentation here for how to interpret this table.
|
The smartscanFailed function in fr.ts used Unicode curly quotes (U+2018/U+2019) as JavaScript string delimiters, which are not valid JS syntax. Replaced them with regular apostrophes (U+0027) while preserving the French apostrophe (U+2019) in template literal content like L'analyse. Co-authored-by: David Barrett <quinthar@users.noreply.github.com>
|
Fixed the failing checks. The |
Co-authored-by: David Barrett <quinthar@users.noreply.github.com>
|
Fixed the failing typecheck: added |
This comment has been minimized.
This comment has been minimized.
The backend sends English field keys (merchant, date, amount) in the violation data. Translate them to each language's word via a fieldNames map so non-English locales no longer render English keys mid-sentence.
Replace the hardcoded English " and " between the last two missing-field items with each language's equivalent: und, y, et, e, en, i, e.
Japanese and Chinese join enumerated items with the ideographic comma (、) and don't insert an "and" before the last item. Replace the length-based ', ' / ' and ' join with a uniform '、' separator. Also drop the ASCII space before the field list in Chinese, which isn't needed between Chinese characters.
Languages with verb conjugation use the wrong form when the count is greater than one. Pick singular vs plural based on missingFields.length in de (fehlt/fehlen), es (falta/faltan), it (mancante/mancanti), and nl (ontbreekt/ontbreken). Switch the French phrasing from "X manquant" to "il manque X", which avoids gender and number agreement entirely.
Receipt::buildScanFailedMessage in Auth uses ", and " before the last
item when listing 3+ missing fields ("merchant, date, and amount").
Match that style in en.ts so the violation message and the report
action that fires on scan failure read the same way.
justinpersaud
force-pushed
the
claude-smartscanFieldSpecificMessages
branch
from
2ecc112 to
c238675
Compare
melvin-bot
Bot
requested review from
dukenv0307 and
trjExpensify
and removed request for
a team
|
@dukenv0307 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] |
|
🚧 @trjExpensify has triggered a test Expensify/App build. You can view the workflow run here. |
This comment has been minimized.
This comment has been minimized.
trjExpensify
left a comment
trjExpensify
left a comment
There was a problem hiding this comment.
Shouldn't this PR be updating the Concierge message here?
... because looking at the expense David flagged this on, it's highlighting a gap in the current solution.
- User uploaded a receipt, the SmartScan failed.
- User enters the details manually to clear the missing details violation.
- The SmartScanEverything receipt audit check flags the expense to the approver as the details were not read by SmartScan:
- So if part of the point for this change is to allow the approver to see with ease what wasn't read by SmartScan, without the Concierge message copy update, they still won't gain that insight.
|
@trjExpensify The concierge message is a separate bug unrelated to this. It is being caused by regressions introduced by this PR #86896 @grgia and @MonilBhavsar were looking into that one. |
|
@codex review |
|
🎯 @dukenv0307, thanks for reviewing and testing this PR! 🎉 A payment issue will be created for your review once this PR is deployed to production. If payment is not needed (e.g., regression PR review fix etc), react with 👎 to this comment to prevent the payment issue from being created. |
![github-actions[bot]](https://avatars.githubusercontent.com/in/15368?s=60&v=4){kind=small}
| const actionReportID = action.reportID; | ||
| // Prefer parentReportActionID (specific IOU action when `report` is a transaction thread). | ||
| // Fall back to childReportID match, then to the only IOU action for one-transaction reports. | ||
| const getIouActionSelector = useCallback( |
There was a problem hiding this comment.
❌ CLEAN-REACT-PATTERNS-0 (docs)
React Compiler is enabled and this file compiles successfully. The useCallback wrapping getIouActionSelector is redundant because the compiler automatically memoizes closures based on their captured variables.
Remove the useCallback wrapper and define getIouActionSelector as a plain function:
const getIouActionSelector = (reportActions: OnyxEntry<OnyxTypes.ReportActions>): OnyxTypes.ReportAction | undefined => {
if (!isIouReport && parentReportActionID) {
const candidate = reportActions?.[parentReportActionID];
if (isActionOfType(candidate, CONST.REPORT.ACTIONS.TYPE.IOU)) {
return candidate;
}
}
const iouActions = Object.values(reportActions ?? {}).filter((a): a is OnyxTypes.ReportAction<typeof CONST.REPORT.ACTIONS.TYPE.IOU> =>
isActionOfType(a, CONST.REPORT.ACTIONS.TYPE.IOU),
);
if (actionReportID) {
const match = iouActions.find((a) => a.childReportID === actionReportID);
if (match) {
return match;
}
}
return iouActions.length === 1 ? iouActions.at(0) : undefined;
};Reviewed at: 96e01d4 | Please rate this suggestion with 👍 or 👎 to help us improve! Reactions are used to monitor reviewer efficiency.
There was a problem hiding this comment.
The Codex suggestion is valid. React Compiler is enabled in this repo (babel-plugin-react-compiler) and automatically memoizes closures based on captured variables. The useCallback wrapping getIouActionSelector is redundant — it should be replaced with a plain function assignment.
This aligns with the CLEAN-REACT-PATTERNS-0 coding standard enforced in this codebase.
There was a problem hiding this comment.
Done — removed the useCallback wrapper and converted getIouActionSelector to a plain function. React Compiler handles memoization automatically. Pushed in 1c7073e.
Co-authored-by: dukenv0307 <dukenv0307@users.noreply.github.com>
| smartscanFailed: ({canEdit = true, missingFields = []}: {canEdit?: boolean; missingFields?: string[]}) => { | ||
| if (missingFields.length > 0) { | ||
| const fieldNames: Record<string, string> = {merchant: 'comerciante', date: 'fecha', amount: 'importe'}; | ||
| const translated = missingFields.map((f) => fieldNames[f] ?? f); |
There was a problem hiding this comment.
Some concerns about maintaining translations here with this default and extending this method in the future sending them from Auth
grgia
left a comment
grgia
left a comment
There was a problem hiding this comment.
NAB, missing unit tests, one comment that could be a concern
|
🚧 @grgia 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! 🧪🧪
|
|
@dukenv0307 @justinpersaud are we good to merge this one? |
|
I think so, @dukenv0307 do you agree? I had a backend PR to simplify this a bit more but I can always just do that as a follow up |
|
Yes, we're good to merge |
|
@MelvinBot we changed the BE to include missingFields Please assess this plan:
|
Plan AssessmentThe plan is mostly sound with a few concerns worth addressing before implementation. What's correct
ConcernsStep 2 — Reactivity of IOU lookup in the component: The plan proposes replacing the current reactive The current implementation's Step 2 — Scope of simplification: The plan drops the Suggested revision to Step 2Keep the existing - const transactionID = getLinkedTransactionID(iouAction);
- const [transactionViolations] = useOnyx(`${ONYXKEYS.COLLECTION.TRANSACTION_VIOLATIONS}${getNonEmptyStringOnyxID(transactionID)}`);
- const smartscanFailedViolation = transactionViolations?.find((violation) => violation.name === CONST.VIOLATIONS.SMARTSCAN_FAILED);
- const missingFields = smartscanFailedViolation?.data?.missingFields ?? [];
+ const missingFields = getOriginalMessage(action)?.missingFields ?? [];This removes the 3-hop chain (IOU → transactionID → violations → missingFields) while keeping the IOU lookup reactive. Summary
|
|
@grgia you wanting to handle that here or separately? |
|
@justinpersaud fine to merge this and follow up or not. It would be better to have a contributor take that change moving forward as I'm focused on the merge HR sprint. I've already assessed the changes needed above |
|
ok lets do it, @dukenv0307 are you interested in the follow up? #89454 (comment) |
|
🚧 @justinpersaud 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! 🧪🧪
|
|
✋ This PR was not deployed to staging yet because QA is ongoing. It will be automatically deployed to staging after the next production release. |
|
🚀 Deployed to staging by https://github.com/justinpersaud in version: 9.3.78-0 🚀
Bundle Size Analysis (Sentry): |
|
Yes, help site changes are needed. The New Expensify Troubleshoot SmartScan Issues article references the old generic message "Receipt scanning failed. Enter details manually." in two places. I've created a draft PR with the updates: #91129 Changes made:
Note: The Expensify Classic version of the same article was not updated since this PR only changes New Expensify frontend code. If the classic app also picks up the backend |
|
🚀 Deployed to production by https://github.com/roryabraham in version: 9.3.78-1 🚀
|
|
🤖 Payment issue created: #91352 |
8 participants
Explanation of Change
When a receipt SmartScan fails, the violation message now specifies which fields are missing (e.g., "Receipt scanning failed — missing date. Enter details manually.") instead of the generic "Receipt scanning failed. Enter details manually."
The backend (Auth PR: https://github.com/Expensify/Auth/pull/21383) now includes a
missingFieldsarray in thesmartscanFailedviolation data. This PR updates the frontend to read that data and display field-specific messages.Fixed Issues
$ https://github.com/Expensify/Expensify/issues/632549
Tests
I manually inserted failures to the db to get the message to showing different failure cases
Offline tests
N/A — This change only affects how existing violation data is displayed, not how it's fetched or stored.
QA Steps
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.AI Tests
Could not run App tests locally due to Node.js version mismatch in the CI environment (requires 20.20.0, had 22.20.0). CI will validate.