[HOLD for payment 2024-07-10] [$250] [Track tax] Disabled tax rate can be selected

[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.82-0
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/4623265
Issue reported by: Applause - Internal Team

Action Performed:

Precondition:

• Distance rates and Taxes are enabled
• Track tax is enabled

1. Go to staging.new.expensify.com
2. Go to workspace settings > Taxes
3. Disable a tax rate
4. Go to Distance rates
5. Click on any distance rate > Tax rate
6. Select the disabled tax rate from Step 3
7. Go to workspace chat and submit a distance expense
8. Go to transaction thread

Expected Result:

In Step 6, app should prevent the disabled tax rate to be selected, which is the Old Dot behavior

Actual Result:

In Step 6, app allows the disabled tax rate to be selected
After submitting distance expense, it shows the "Tax no longer valid" violation

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

Bug6511235_1718218613507.20240613_025108.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~01b142f41c7ec7f0fd
• Upwork Job ID: 1801464706663931905
• Last Price Increase: 2024-06-14
• Automatic offers:
• hungvu193 | Reviewer | 102762156
• Krishna2323 | Contributor | 102762157

Issue Owner

Current Issue Owner: @twisterdotcom / @stephanieelliott

[melvin-bot]

Triggered auto assignment to @stephanieelliott (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]

@stephanieelliott 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 #wave-collect - Release 2

[Krishna2323]

Proposal

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

Track tax - Disabled tax rate can be selected

What is the root cause of that problem?

Tax rates are not filtered based on the enabled state.

App/src/pages/workspace/distanceRates/PolicyDistanceRateTaxRateEditPage.tsx

Lines 39 to 51 in d0b3552

	const taxRateItems: ListItemType[] = useMemo(() => {
	const taxes = policy?.taxRates?.taxes;
	const result = Object.entries(taxes ?? {}).map(([key, value]) => ({
	value: key,
	text: `${value.name} (${value.value})`,
	isSelected: taxRateExternalID === key,
	keyForList: key,
	pendingAction: value.pendingAction,
	isDisabled: value.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE,
	}));
	return result;
	}, [policy, taxRateExternalID]);

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

Filter out disabled tax rates using isDisabled property.

    const taxRateItems: ListItemType[] = useMemo(
        () =>
            Object.entries(policy?.taxRates?.taxes ?? {})
                .filter(([, value]) => !value.isDisabled)
                .map(([key, value]) => ({
                    value: key,
                    text: `${value.name} (${value.value})`,
                    isSelected: taxRateExternalID === key,
                    keyForList: key,
                    pendingAction: value.pendingAction,
                    isDisabled: value.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE,
                })),
        [policy, taxRateExternalID],
    );

What alternative solutions did you explore? (Optional)

We can disable the option instead of filtering, in that case we just need to modify the isDisabled property.

isDisabled: value.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE || value.isDisabled,

What alternative solutions did you explore? (Optional 2)

We can use TaxPicker component instead of SelectionList like we do in WorkspaceTaxesSettingsForeignCurrency .

App/src/pages/workspace/taxes/WorkspaceTaxesSettingsForeignCurrency.tsx

Lines 53 to 66 in d0b3552

	{({insets}) => (
	<>
	<HeaderWithBackButton title={translate('workspace.taxes.foreignDefault')} />
	<View style={[styles.mb4, styles.flex1]}>
	<TaxPicker
	selectedTaxRate={selectedTaxRate}
	policyID={policyID}
	insets={insets}
	onSubmit={submit}
	/>
	</View>
	</>
	)}

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~01b142f41c7ec7f0fd

[melvin-bot]

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

[cretadn22]

Proposal

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

Track tax - Disabled tax rate can be selected

What is the root cause of that problem?

In PolicyDistanceRateTaxRateEditPage.tsx, we refrain from utilizing TaxPicker, which includes the logic to exclude disabled rates

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

In PolicyDistanceRateTaxRateEditPage.tsx, it's advisable to reuse TaxPicker

<TaxPicker
  selectedTaxRate={selectedTaxRate}
  policyID={policyID}
  insets={insets}
  onSubmit={onTaxRateChange}
/>

We should also hide the selected tax rate if it's disabled (This will require updates in the WORKSPACE_DISTANCE_RATE_DETAILS page, which will be detailed in the pull request)

    const taxRateExternal = Object.values(TransactionUtils.transformedTaxRates(policy)).find((taxRate) => taxRate.code === taxRateExternalID);
    const selectedTaxRate = taxRateExternal?.isDisabled ? '' : TransactionUtils.getWorkspaceTaxesSettingsName(policy, taxRateExternalID);

We need to update onTaxRateChange function and eliminate any unused elements.

const onTaxRateChange = (newTaxRate: OptionsListUtils.TaxRatesOption) => {
        if (taxRateExternalID === newTaxRate.code) {
            Navigation.goBack();
            return;
        }
        DistanceRate.updateDistanceTaxRate(policyID, customUnit, [
            {
                ...rate,
                attributes: {
                    ...rate.attributes,
                    taxRateExternalID: newTaxRate.code,
                },
            },
        ]);
        Navigation.navigate(ROUTES.WORKSPACE_DISTANCE_RATE_DETAILS.getRoute(policyID, rateID));
    };

With this approach, after this PR is merged, we need to incorporate the onDismiss function and eliminate the existing logic to check duplicated tax in onTaxRateChange function

What alternative solutions did you explore? (Optional)