[HOLD for payment 2024-11-11] [HOLD for payment 2024-11-07] [$125] Expensify Card - Unable to proceed with empty Address line 2 field when adding missing details

[lanitochka17]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Version Number: 9.0.55-1
Reproducible in staging?: Y
Reproducible in production?: N
If this was caught on HybridApp, is this reproducible on New Expensify Standalone?: N/A
If this was caught during regression testing, add the test name, ID and link from TestRail: applausetester+khcategory17@applause.expensifail.com
Issue reported by: Applause - Internal Team

Action Performed:

Precondition:

• User has assigned themselves a physical card
• User personal details have not been added

1. Go to staging.new.expensify.com
2. Go to workspace chat
3. Click Add missing details
4. Proceed to address step
5. Enter address while leaving Address line 2 field empty
6. Click Next

Expected Result:

User should be able to proceed when Address line 2 field is empty (production behavior)

Actual Result:

User is unable to proceed when Address line 2 field is empty

Workaround:

Unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

• Android: Standalone
• Android: HybridApp
• Android: mWeb Chrome
• iOS: Standalone
• iOS: HybridApp
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

Bug6649174_1730198790308.20241029_184246.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021851264059586500401
• Upwork Job ID: 1851264059586500401
• Last Price Increase: 2024-10-29

Issue Owner

Current Issue Owner: @

Issue Owner

Current Issue Owner: @garrettmknight

[melvin-bot]

Triggered auto assignment to @Beamanator (DeployBlockerCash), see https://stackoverflowteams.com/c/expensify/questions/9980/ for more details.

[melvin-bot]

💬 A slack conversation has been started in #expensify-open-source

[github-actions]

👋 Friendly reminder that deploy blockers are time-sensitive ⏱ issues! Check out the open `StagingDeployCash` deploy checklist to see the list of PRs included in this release, then work quickly to do one of the following:

1. Identify the pull request that introduced this issue and revert it.
2. Find someone who can quickly fix the issue.
3. Fix the issue yourself.

[lanitochka17]

We think that this bug might be related to #wave-collect - Release 2

[NJ-2020]

Regression PR: #51231

It's because we will show the field required error for all step fields

App/src/pages/MissingPersonalDetails/substeps/Address.tsx

Lines 40 to 42 in e819340

	const validate = useCallback(
	(values: FormOnyxValues<typeof ONYXKEYS.FORMS.PERSONAL_DETAILS_FORM>): FormInputErrors<typeof ONYXKEYS.FORMS.PERSONAL_DETAILS_FORM> => {
	const errors = ValidationUtils.getFieldRequiredErrors(values, STEP_FIELDS);

App/src/pages/MissingPersonalDetails/substeps/Address.tsx

Line 23 in e819340

const STEP_FIELDS = [INPUT_IDS.ADDRESS_LINE_1, INPUT_IDS.ADDRESS_LINE_2, INPUT_IDS.CITY, INPUT_IDS.STATE, INPUT_IDS.ZIP_POST_CODE, INPUT_IDS.COUNTRY];

And we also check it again for the required fields here

App/src/pages/MissingPersonalDetails/substeps/Address.tsx

Lines 43 to 50 in 9d6db1e

	const addressRequiredFields = [INPUT_IDS.ADDRESS_LINE_1, INPUT_IDS.CITY, INPUT_IDS.COUNTRY, INPUT_IDS.STATE] as const;
	addressRequiredFields.forEach((fieldKey) => {
	const fieldValue = values[fieldKey] ?? '';
	if (ValidationUtils.isRequiredFulfilled(fieldValue)) {
	return;
	}
	errors[fieldKey] = translate('common.error.fieldRequired');
	});

Instead of passing STEP_FIELDS we can pass addressRequiredFields here

App/src/pages/MissingPersonalDetails/substeps/Address.tsx

Lines 42 to 43 in 9d6db1e

	const errors = ValidationUtils.getFieldRequiredErrors(values, STEP_FIELDS);
	const addressRequiredFields = [INPUT_IDS.ADDRESS_LINE_1, INPUT_IDS.CITY, INPUT_IDS.COUNTRY, INPUT_IDS.STATE] as const;

Alternatively, we can revert this variable to the old one to fix this issue

App/src/pages/MissingPersonalDetails/substeps/Address.tsx

Lines 40 to 42 in e819340

	const validate = useCallback(
	(values: FormOnyxValues<typeof ONYXKEYS.FORMS.PERSONAL_DETAILS_FORM>): FormInputErrors<typeof ONYXKEYS.FORMS.PERSONAL_DETAILS_FORM> => {
	const errors = ValidationUtils.getFieldRequiredErrors(values, STEP_FIELDS);

const errors: FormInputErrors<typeof ONYXKEYS.FORMS.PERSONAL_DETAILS_FORM> = {};

[hungvu193]

cc @burczu it look like it came from our PR

[Beamanator]

Ping'd @burczu in slack, when they comment here I can assign them 👍

[burczu]

Ok, I confirm this is regression from #51231 and as @NJ-2020 pointed out, this line should just not be changed:

const errors = ValidationUtils.getFieldRequiredErrors(values, STEP_FIELDS); 

Please assign me and I'll prepare a fix.

[hungvu193]

Thank you @burczu