[HOLD for payment 2024-07-10] [$250] Track - Unable to save merchant on confirmation page after manually removing merchant

[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: 1.4.85-1
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught during regression testing, add the test name, ID and link from TestRail: https://expensify.testrail.io/index.php?/tests/view/4646137
Issue reported by: Applause - Internal Team

Action Performed:

1. Go to staging.new.expensify.com
2. Go to self DM
3. Track a manual expense with a merchant
4. Go to transaction thread
5. Remove the merchant and save it
6. Return to main chat
7. Click Categorize it > Select any category
8. Click Merchant on confirmation page
9. Enter a merchant and save it

Expected Result:

The entered merchant will be saved

Actual Result:

The entered merchant is not saved. This happens when merchant is removed after tracking the expense

Workaround:

Unknown

Platforms:

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

• Android: Native
• Android: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

Bug6517606_1718736923323.bandicam_2024-06-19_02-16-01-094.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~0160c2ec38746d74db
• Upwork Job ID: 1805655647700595194
• Last Price Increase: 2024-06-25
• Automatic offers:
• c3024 | Reviewer | 102888832
• bernhardoj | Contributor | 102888835

Issue Owner

Current Issue Owner: @miljakljajic

[melvin-bot]

Triggered auto assignment to @miljakljajic (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[lanitochka17]

@miljakljajic FYI I haven't added the External label as I wasn't 100% sure about this issue. Please take a look and add the label if you agree it's a bug and can be handled by external contributors

[lanitochka17]

We think that this bug might be related to #vip-vsb

[cretadn22]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Unable to save merchant on confirmation page after manually removing merchant

What is the root cause of that problem?

The app shows an empty merchant because the function isMerchantMissing returns true

App/src/components/MoneyRequestConfirmationList.tsx

Line 345 in 6b2817b

const isMerchantEmpty = useMemo(() => !iouMerchant || TransactionUtils.isMerchantMissing(transaction), [transaction, iouMerchant]);

In this scenario, the modifiedMerchant is "(none)". Therefore, this function returns true.

App/src/libs/TransactionUtils.ts

Lines 172 to 175 in 6b2817b

	function isMerchantMissing(transaction: OnyxEntry<Transaction>) {
	if (transaction?.modifiedMerchant && transaction.modifiedMerchant !== '') {
	return transaction.modifiedMerchant === CONST.TRANSACTION.PARTIAL_TRANSACTION_MERCHANT;
	}

What changes do you think we should make in order to solve the problem?

If modifiedMerchant has a value, the function should return false; if modifiedMerchant is empty or has a default value, then the function should check the merchant field instead.

App/src/libs/TransactionUtils.ts

Lines 172 to 175 in 6b2817b

	function isMerchantMissing(transaction: OnyxEntry<Transaction>) {
	if (transaction?.modifiedMerchant && transaction.modifiedMerchant !== '') {
	return transaction.modifiedMerchant === CONST.TRANSACTION.PARTIAL_TRANSACTION_MERCHANT;
	}

if (transaction?.modifiedMerchant && transaction.modifiedMerchant !== '' && transaction.modifiedMerchant !== CONST.TRANSACTION.PARTIAL_TRANSACTION_MERCHANT) {
   return false
}

What alternative solutions did you explore? (Optional)

[bernhardoj]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Can't save merchant in confirmation page from categorize track expense that has the merchant added and rmeoved.

What is the root cause of that problem?

When we do a track expense with merchant A then later remove it, the transaction data will have following attributes:

merchant: A,
modifiedMerchant: '(none)',

When we select categorize it, it will create a transaction draft. This transaction draft merchant and modifiedMerchant will be the same, that is (none).

App/src/libs/ReportUtils.ts

Lines 6878 to 6892 in 340f221

	const {created, amount, currency, merchant, mccGroup} = getTransactionDetails(transaction) ?? {};
	const comment = getTransactionCommentObject(transaction);
	IOU.createDraftTransaction({
	...transaction,
	actionableWhisperReportActionID: reportActionID,
	linkedTrackedExpenseReportAction,
	linkedTrackedExpenseReportID: reportID,
	created,
	amount,
	currency,
	comment,
	merchant,
	mccGroup,
	} as Transaction);

If the merchant is empty, we won't show it. In our case, isMerchantMissing returns true.

App/src/components/MoneyRequestConfirmationList.tsx

Line 345 in 340f221

const isMerchantEmpty = useMemo(() => !iouMerchant || TransactionUtils.isMerchantMissing(transaction), [transaction, iouMerchant]);

It first checks if there is a modifiedMerchant exists, then it compares the value whether it's empty or (none) which is true for our case.

App/src/libs/TransactionUtils.ts

Lines 172 to 178 in 340f221

	function isMerchantMissing(transaction: OnyxEntry<Transaction>) {
	if (transaction?.modifiedMerchant && transaction.modifiedMerchant !== '') {
	return transaction.modifiedMerchant === CONST.TRANSACTION.PARTIAL_TRANSACTION_MERCHANT;
	}
	const isMerchantEmpty = transaction?.merchant === CONST.TRANSACTION.PARTIAL_TRANSACTION_MERCHANT || transaction?.merchant === '';
	return isMerchantEmpty;

What changes do you think we should make in order to solve the problem?

When we are creating a new transaction draft, a modifiedMerchant shouldn't be there. merchant is the initial value of the merchant when we create the transaction/expense and modifiedMerchant is the modified merchant value. If the merchant is modified/updated, then we will always use that as comparison.

But in our case, we are trying to create a new transaction to submit to a workspace (isEditing false), so any edit to merchant will update the merchant property, not the modifiedMerchant.

App/src/pages/iou/request/step/IOURequestStepMerchant.tsx

Lines 103 to 105 in 340f221

	IOU.setMoneyRequestMerchant(transactionID, newMerchant || CONST.TRANSACTION.PARTIAL_TRANSACTION_MERCHANT, !isEditing);
	if (isEditing) {
	IOU.updateMoneyRequestMerchant(transactionID, reportID, newMerchant || CONST.TRANSACTION.PARTIAL_TRANSACTION_MERCHANT, policy, policyTags, policyCategories);

and when we submit it, we pass the merchant value to the API, so using modifiedMerchant here doesn't make sense.

So, I suggest that when we create the transaction draft, set the modifiedMerchant to an empty value.

IOU.createDraftTransaction({
    ...,
    merchant,
    modifiedMerchant: '',
} as Transaction);

and potentially any other modified* value.

[melvin-bot]

@miljakljajic Huh... This is 4 days overdue. Who can take care of this?

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~0160c2ec38746d74db

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @c3024 (External)