Skip to content

Add tax rate #77836

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
luacmartins merged 8 commits into from
Dec 17, 2025
Merged

Add tax rate #77836

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
8 commits
Select commit Hold shift + click to select a range
685d6a0
add tax and taxRate
luacmartins Dec 17, 2025
5583edd
fix sorting for tax amount
luacmartins Dec 17, 2025
8d51900
fix order
luacmartins Dec 17, 2025
6fb1848
use method
luacmartins Dec 17, 2025
a9582a4
add to dependency array
luacmartins Dec 17, 2025
de7ed8d
resolve conflicts
luacmartins Dec 17, 2025
d0cb0ed
use textcell, fix style
luacmartins Dec 17, 2025
305da9f
fix prettier
luacmartins Dec 17, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
3 changes: 3 additions & 0 deletions src/CONST/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6705,6 +6705,8 @@ const CONST = {
BASE_62_REPORT_ID: this.TABLE_COLUMNS.BASE_62_REPORT_ID,
REIMBURSABLE: this.TABLE_COLUMNS.REIMBURSABLE,
BILLABLE: this.TABLE_COLUMNS.BILLABLE,
TAX_RATE: this.TABLE_COLUMNS.TAX_RATE,
TAX_AMOUNT: this.TABLE_COLUMNS.TAX_AMOUNT,
STATUS: this.TABLE_COLUMNS.STATUS,
TITLE: this.TABLE_COLUMNS.TITLE,
ACTION: this.TABLE_COLUMNS.ACTION,
Expand Down Expand Up @@ -6804,6 +6806,7 @@ const CONST = {
ORIGINAL_AMOUNT: 'originalamount',
REIMBURSABLE: 'reimbursable',
BILLABLE: 'billable',
TAX_RATE: 'taxrate',
TOTAL_AMOUNT: 'amount',
TOTAL: 'total',
TYPE: 'type',
Expand Down
6 changes: 5 additions & 1 deletion src/components/SelectionListWithSections/SearchTableHeader.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -98,10 +98,14 @@ const getExpenseHeaders = (groupBy?: SearchGroupBy): SearchColumnConfig[] => [
columnName: CONST.SEARCH.TABLE_COLUMNS.WITHDRAWAL_ID,
translationKey: 'common.withdrawalID',
},
{
columnName: CONST.SEARCH.TABLE_COLUMNS.TAX_RATE,
translationKey: 'iou.taxRate',
canBeMissing: true,
},
{
columnName: CONST.SEARCH.TABLE_COLUMNS.TAX_AMOUNT,
translationKey: 'common.tax',
isColumnSortable: false,
canBeMissing: true,
},
{
Expand Down
3 changes: 3 additions & 0 deletions src/components/SelectionListWithSections/types.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -338,6 +338,9 @@ type TransactionListItemType = ListItem &

/** The main action that can be performed for the transaction */
action: SearchTransactionAction;

/** The tax code of the transaction */
taxCode?: string;
};

type ReportActionListItemType = ListItem &
Expand Down
33 changes: 30 additions & 3 deletions src/components/TransactionItemRow/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -38,7 +38,7 @@ import {
} from '@libs/TransactionUtils';
import CONST from '@src/CONST';
import type {TranslationPaths} from '@src/languages/types';
import type {PersonalDetails, Report, TransactionViolation} from '@src/types/onyx';
import type {PersonalDetails, Policy, Report, TransactionViolation} from '@src/types/onyx';
import type {SearchTransactionAction} from '@src/types/onyx/SearchResults';
import CategoryCell from './DataCells/CategoryCell';
import ChatBubbleCell from './DataCells/ChatBubbleCell';
Expand Down Expand Up @@ -86,6 +86,9 @@ type TransactionWithOptionalSearchFields = TransactionWithOptionalHighlight & {

/** Report to which the transaction belongs */
report?: Report;

/** Policy to which the transaction belongs */
policy?: Policy;
};

type TransactionItemRowProps = {
Expand Down Expand Up @@ -190,6 +193,21 @@ function TransactionItemRow({
const merchant = useMemo(() => getMerchantName(transactionItem, translate), [transactionItem, translate]);
const description = getDescription(transactionItem);

const formattedTaxRate = useMemo(() => {
const taxRateName = transactionItem?.policy?.taxRates?.taxes?.[transactionItem.taxCode ?? '']?.name ?? '';
const taxRateValue = transactionItem?.policy?.taxRates?.taxes?.[transactionItem.taxCode ?? '']?.value ?? '';

if (!taxRateName && !taxRateValue) {
return '';
}

if (!taxRateValue) {
return taxRateName;
}

return `${taxRateName} (${taxRateValue})`;
}, [transactionItem?.policy?.taxRates?.taxes, transactionItem.taxCode]);

// eslint-disable-next-line @typescript-eslint/prefer-nullish-coalescing
const merchantOrDescription = merchant || description;

Expand Down Expand Up @@ -454,9 +472,17 @@ function TransactionItemRow({
<TextCell text={transactionItem.reportID === CONST.REPORT.UNREPORTED_REPORT_ID ? '' : getBase62ReportID(Number(transactionItem.reportID))} />
</View>
),
[CONST.SEARCH.TABLE_COLUMNS.TAX]: (
[CONST.SEARCH.TABLE_COLUMNS.TAX_RATE]: (
<View
key={CONST.SEARCH.TABLE_COLUMNS.TAX_RATE}
style={[StyleUtils.getReportTableColumnStyles(CONST.SEARCH.TABLE_COLUMNS.TAX_RATE)]}
>
<TextCell text={formattedTaxRate} />
</View>
),
[CONST.SEARCH.TABLE_COLUMNS.TAX_AMOUNT]: (
<View
key={CONST.SEARCH.TABLE_COLUMNS.TAX}
key={CONST.SEARCH.TABLE_COLUMNS.TAX_AMOUNT}
style={[StyleUtils.getReportTableColumnStyles(CONST.SEARCH.TABLE_COLUMNS.TAX_AMOUNT, undefined, undefined, isTaxAmountColumnWide)]}
>
<TaxCell
Expand Down Expand Up @@ -508,6 +534,7 @@ function TransactionItemRow({
isAmountColumnWide,
isTaxAmountColumnWide,
isLargeScreenWidth,
formattedTaxRate,
],
);
const shouldRenderChatBubbleCell = useMemo(() => {
Expand Down
15 changes: 14 additions & 1 deletion src/libs/SearchUIUtils.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -151,7 +151,7 @@ const transactionColumnNamesToSortingProperty: TransactionSorting = {
[CONST.SEARCH.TABLE_COLUMNS.TYPE]: null,
[CONST.SEARCH.TABLE_COLUMNS.ACTION]: 'action' as const,
[CONST.SEARCH.TABLE_COLUMNS.DESCRIPTION]: 'comment' as const,
[CONST.SEARCH.TABLE_COLUMNS.TAX_AMOUNT]: null,
[CONST.SEARCH.TABLE_COLUMNS.TAX_AMOUNT]: 'taxAmount' as const,

@JS00001 JS00001 Dec 17, 2025

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

NAB but we dont need this since we're handling this with a if statemnet

@luacmartins luacmartins Dec 17, 2025

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cool, I'll clean it up in a separate PR

@luacmartins luacmartins Dec 17, 2025

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Handling here #77921

@luacmartins luacmartins Dec 17, 2025

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

hmm actually, this one is needed because we do sort just on the amount we get from the BE. What's handled separately is tax rate

[CONST.SEARCH.TABLE_COLUMNS.RECEIPT]: null,
};

Expand Down Expand Up @@ -2076,6 +2076,14 @@ function getSortedTransactionData(
});
}

if (sortBy === CONST.SEARCH.TABLE_COLUMNS.TAX_RATE) {
return data.sort((a, b) => {
const aValue = `${a.policy?.taxRates?.taxes?.[a.taxCode ?? '']?.name ?? ''} (${a.policy?.taxRates?.taxes?.[a.taxCode ?? '']?.value ?? ''})`;
const bValue = `${b.policy?.taxRates?.taxes?.[b.taxCode ?? '']?.name ?? ''} (${b.policy?.taxRates?.taxes?.[b.taxCode ?? '']?.value ?? ''})`;
return compareValues(aValue, bValue, sortOrder, sortBy, localeCompare);
});
}

if (!sortingProperty) {
return data;
}
Expand Down Expand Up @@ -2318,6 +2326,10 @@ function getSearchColumnTranslationKey(columnId: SearchCustomColumnIds): Transla
return 'common.title';
case CONST.SEARCH.TABLE_COLUMNS.STATUS:
return 'common.status';
case CONST.SEARCH.TABLE_COLUMNS.TAX_AMOUNT:
return 'common.tax';
case CONST.SEARCH.TABLE_COLUMNS.TAX_RATE:
return 'iou.taxRate';
case CONST.SEARCH.TABLE_COLUMNS.REPORT_ID:
return 'common.longID';
case CONST.SEARCH.TABLE_COLUMNS.BASE_62_REPORT_ID:
Expand Down Expand Up @@ -2785,6 +2797,7 @@ function getColumnsToShow(
[CONST.SEARCH.TABLE_COLUMNS.TAG]: false,
[CONST.SEARCH.TABLE_COLUMNS.REIMBURSABLE]: false,
[CONST.SEARCH.TABLE_COLUMNS.BILLABLE]: false,
[CONST.SEARCH.TABLE_COLUMNS.TAX_RATE]: false,
[CONST.SEARCH.TABLE_COLUMNS.TAX_AMOUNT]: false,
[CONST.SEARCH.TABLE_COLUMNS.ORIGINAL_AMOUNT]: false,
[CONST.SEARCH.TABLE_COLUMNS.TOTAL_AMOUNT]: true,
Expand Down
3 changes: 3 additions & 0 deletions src/styles/utils/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1776,6 +1776,9 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({
case CONST.SEARCH.TABLE_COLUMNS.BILLABLE:
columnWidth = {...getWidthStyle(variables.w92)};
break;
case CONST.SEARCH.TABLE_COLUMNS.TAX_RATE:
columnWidth = {...getWidthStyle(variables.w92), ...styles.flex1};
break;
case CONST.SEARCH.TABLE_COLUMNS.ACTION:
columnWidth = {...getWidthStyle(variables.w80), ...styles.alignItemsCenter};
break;
Expand Down
Loading