From 46c0a51365767f513c0649eafe0d416fa8e803fa Mon Sep 17 00:00:00 2001 From: Krishna Gupta <belivethatkg@gmail.com> Date: Thu, 20 Jun 2024 02:36:59 +0530 Subject: [PATCH] fix: [Track tax] Disabled tax rate can be selected. Signed-off-by: Krishna Gupta <belivethatkg@gmail.com> --- .../PolicyDistanceRateTaxRateEditPage.tsx | 64 ++++++++----------- 1 file changed, 27 insertions(+), 37 deletions(-) diff --git a/src/pages/workspace/distanceRates/PolicyDistanceRateTaxRateEditPage.tsx b/src/pages/workspace/distanceRates/PolicyDistanceRateTaxRateEditPage.tsx index d0601f557a7f..9fe090222691 100644 --- a/src/pages/workspace/distanceRates/PolicyDistanceRateTaxRateEditPage.tsx +++ b/src/pages/workspace/distanceRates/PolicyDistanceRateTaxRateEditPage.tsx @@ -1,12 +1,13 @@ import type {StackScreenProps} from '@react-navigation/stack'; -import React, {useMemo} from 'react'; +import React from 'react'; import HeaderWithBackButton from '@components/HeaderWithBackButton'; import ScreenWrapper from '@components/ScreenWrapper'; -import SelectionList from '@components/SelectionList'; -import RadioListItem from '@components/SelectionList/RadioListItem'; +import TaxPicker from '@components/TaxPicker'; import useLocalize from '@hooks/useLocalize'; import useThemeStyles from '@hooks/useThemeStyles'; import Navigation from '@libs/Navigation/Navigation'; +import type * as OptionsListUtils from '@libs/OptionsListUtils'; +import * as TransactionUtils from '@libs/TransactionUtils'; import type {SettingsNavigatorParamList} from '@navigation/types'; import AccessOrNotFoundWrapper from '@pages/workspace/AccessOrNotFoundWrapper'; import type {WithPolicyOnyxProps} from '@pages/workspace/withPolicy'; @@ -15,15 +16,6 @@ import * as DistanceRate from '@userActions/Policy/DistanceRate'; import CONST from '@src/CONST'; import ROUTES from '@src/ROUTES'; import type SCREENS from '@src/SCREENS'; -import type {PendingAction} from '@src/types/onyx/OnyxCommon'; - -type ListItemType = { - value: string; - text: string; - isSelected: boolean; - keyForList: string; - pendingAction?: PendingAction; -}; type PolicyDistanceRateTaxRateEditPageProps = WithPolicyOnyxProps & StackScreenProps<SettingsNavigatorParamList, typeof SCREENS.WORKSPACE.DISTANCE_RATE_TAX_RATE_EDIT>; @@ -36,21 +28,10 @@ function PolicyDistanceRateTaxRateEditPage({route, policy}: PolicyDistanceRateTa const customUnit = customUnits[Object.keys(customUnits)[0]]; const rate = customUnit?.rates[rateID]; const taxRateExternalID = rate.attributes?.taxRateExternalID; - 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]); + const selectedTaxRate = TransactionUtils.getWorkspaceTaxesSettingsName(policy, taxRateExternalID ?? ''); - const onTaxRateChange = (newTaxRate: ListItemType) => { - if (taxRateExternalID === newTaxRate.value) { + const onTaxRateChange = (newTaxRate: OptionsListUtils.TaxRatesOption) => { + if (taxRateExternalID === newTaxRate.code) { Navigation.goBack(); return; } @@ -59,13 +40,17 @@ function PolicyDistanceRateTaxRateEditPage({route, policy}: PolicyDistanceRateTa ...rate, attributes: { ...rate.attributes, - taxRateExternalID: newTaxRate.value, + taxRateExternalID: newTaxRate.code, }, }, ]); Navigation.navigate(ROUTES.WORKSPACE_DISTANCE_RATE_DETAILS.getRoute(policyID, rateID)); }; + const dismiss = () => { + Navigation.goBack(ROUTES.WORKSPACE_TAXES_SETTINGS.getRoute(policyID)); + }; + return ( <AccessOrNotFoundWrapper accessVariants={[CONST.POLICY.ACCESS_VARIANTS.ADMIN, CONST.POLICY.ACCESS_VARIANTS.PAID]} @@ -78,16 +63,21 @@ function PolicyDistanceRateTaxRateEditPage({route, policy}: PolicyDistanceRateTa shouldEnableMaxHeight testID={PolicyDistanceRateTaxRateEditPage.displayName} > - <HeaderWithBackButton - title={translate('workspace.taxes.taxRate')} - shouldShowBackButton - /> - <SelectionList - sections={[{data: taxRateItems}]} - ListItem={RadioListItem} - onSelectRow={onTaxRateChange} - initiallyFocusedOptionKey={taxRateItems.find((item) => item.isSelected)?.keyForList} - /> + {({insets}) => ( + <> + <HeaderWithBackButton + title={translate('workspace.taxes.taxRate')} + shouldShowBackButton + /> + <TaxPicker + selectedTaxRate={selectedTaxRate} + policyID={policyID} + insets={insets} + onSubmit={onTaxRateChange} + onDismiss={dismiss} + /> + </> + )} </ScreenWrapper> </AccessOrNotFoundWrapper> );