Skip to content

Add reportID and longReportID to custom columns #77799

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 18 commits into from
Dec 17, 2025
Merged

Add reportID and longReportID to custom columns #77799

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
18 commits
Select commit Hold shift + click to select a range
43ddae3
add to consts
JS00001 Dec 16, 2025
b889544
update viz of columns
JS00001 Dec 16, 2025
788101e
Merge branch 'main' of github.com:Expensify/App into jsenyitko-releas…
JS00001 Dec 16, 2025
cf3c9d7
add text cell component and sizing
JS00001 Dec 16, 2025
79c556a
create cells for expenses
JS00001 Dec 16, 2025
e25b915
add cells to e xpense reports
JS00001 Dec 16, 2025
14e8bfa
add to header
JS00001 Dec 16, 2025
dccf0b4
update to not show by default
JS00001 Dec 16, 2025
c1016b9
dont default ids
JS00001 Dec 16, 2025
be24c41
update to base62 report ID
JS00001 Dec 16, 2025
eadf4ce
sort by report IDS on the FE
JS00001 Dec 16, 2025
e9a9b50
fix tests
JS00001 Dec 16, 2025
a6486f4
Merge branch 'main' of github.com:Expensify/App into jsenyitko-releas…
JS00001 Dec 16, 2025
661f97f
Merge branch 'main' of github.com:Expensify/App into jsenyitko-releas…
JS00001 Dec 16, 2025
6739810
update title cell to be text cell
JS00001 Dec 16, 2025
48704fa
invert names
luacmartins Dec 17, 2025
da317eb
resolve conflicts
luacmartins Dec 17, 2025
aa1a6d5
fix unreported case
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
6 changes: 6 additions & 0 deletions src/CONST/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -6696,6 +6696,8 @@ const CONST = {
TO: this.TABLE_COLUMNS.TO,
CATEGORY: this.TABLE_COLUMNS.CATEGORY,
TAG: this.TABLE_COLUMNS.TAG,
REPORT_ID: this.TABLE_COLUMNS.REPORT_ID,
BASE_62_REPORT_ID: this.TABLE_COLUMNS.BASE_62_REPORT_ID,
REIMBURSABLE: this.TABLE_COLUMNS.REIMBURSABLE,
BILLABLE: this.TABLE_COLUMNS.BILLABLE,
STATUS: this.TABLE_COLUMNS.STATUS,
Expand All @@ -6710,6 +6712,8 @@ const CONST = {
TITLE: this.TABLE_COLUMNS.TITLE,
FROM: this.TABLE_COLUMNS.FROM,
TO: this.TABLE_COLUMNS.TO,
REPORT_ID: this.TABLE_COLUMNS.REPORT_ID,
BASE_62_REPORT_ID: this.TABLE_COLUMNS.BASE_62_REPORT_ID,
ACTION: this.TABLE_COLUMNS.ACTION,
},
INVOICE: {},
Expand Down Expand Up @@ -6807,6 +6811,8 @@ const CONST = {
WITHDRAWAL_ID: 'withdrawalID',
AVATAR: 'avatar',
STATUS: 'status',
REPORT_ID: 'reportID',
BASE_62_REPORT_ID: 'base62ReportID',
Comment thread
luacmartins marked this conversation as resolved.
TAX: 'tax',
},
SYNTAX_OPERATORS: {
Expand Down
15 changes: 13 additions & 2 deletions src/components/SelectionListWithSections/Search/ExpenseReportListItemRow.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -12,13 +12,14 @@ import useResponsiveLayout from '@hooks/useResponsiveLayout';
import useStyleUtils from '@hooks/useStyleUtils';
import useTheme from '@hooks/useTheme';
import useThemeStyles from '@hooks/useThemeStyles';
import getBase62ReportID from '@libs/getBase62ReportID';
import variables from '@styles/variables';
import CONST from '@src/CONST';
import type {Policy} from '@src/types/onyx';
import ActionCell from './ActionCell';
import DateCell from './DateCell';
import StatusCell from './StatusCell';
import TitleCell from './TitleCell';
import TextCell from './TextCell';
import TotalCell from './TotalCell';
import UserInfoAndActionButtonRow from './UserInfoAndActionButtonRow';
import UserInfoCell from './UserInfoCell';
Expand Down Expand Up @@ -116,7 +117,7 @@ function ExpenseReportListItemRow({
),
[CONST.SEARCH.TABLE_COLUMNS.TITLE]: (
<View style={[StyleUtils.getReportTableColumnStyles(CONST.SEARCH.TABLE_COLUMNS.TITLE)]}>
<TitleCell
<TextCell
text={item.reportName ?? ''}
isLargeScreenWidth={isLargeScreenWidth}
/>
Expand Down Expand Up @@ -152,6 +153,16 @@ function ExpenseReportListItemRow({
/>
</View>
),
[CONST.SEARCH.TABLE_COLUMNS.REPORT_ID]: (
<View style={[StyleUtils.getReportTableColumnStyles(CONST.SEARCH.TABLE_COLUMNS.REPORT_ID)]}>
<TextCell text={item.reportID === CONST.REPORT.UNREPORTED_REPORT_ID ? '' : item.reportID} />
</View>
),
[CONST.SEARCH.TABLE_COLUMNS.BASE_62_REPORT_ID]: (
<View style={[StyleUtils.getReportTableColumnStyles(CONST.SEARCH.TABLE_COLUMNS.BASE_62_REPORT_ID)]}>
<TextCell text={item.reportID === CONST.REPORT.UNREPORTED_REPORT_ID ? '' : getBase62ReportID(Number(item.reportID))} />
</View>
),
[CONST.SEARCH.TABLE_COLUMNS.ACTION]: (
<View style={[StyleUtils.getReportTableColumnStyles(CONST.SEARCH.TABLE_COLUMNS.ACTION)]}>
<ActionCell
Expand Down
10 changes: 5 additions & 5 deletions ...tionListWithSections/Search/TitleCell.tsx → ...ctionListWithSections/Search/TextCell.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,12 +2,12 @@ import React from 'react';
import TextWithTooltip from '@components/TextWithTooltip';
import useThemeStyles from '@hooks/useThemeStyles';

type TitleCellProps = {
text: string;
isLargeScreenWidth: boolean;
type TextCellProps = {
text?: string;
isLargeScreenWidth?: boolean;
};

function TitleCell({text, isLargeScreenWidth}: TitleCellProps) {
function TextCell({text = '', isLargeScreenWidth = true}: TextCellProps) {
const styles = useThemeStyles();

return (
Expand All @@ -19,4 +19,4 @@ function TitleCell({text, isLargeScreenWidth}: TitleCellProps) {
);
}

export default TitleCell;
export default TextCell;
16 changes: 16 additions & 0 deletions src/components/SelectionListWithSections/SearchTableHeader.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -104,6 +104,14 @@ const getExpenseHeaders = (groupBy?: SearchGroupBy): SearchColumnConfig[] => [
columnName: CONST.SEARCH.TABLE_COLUMNS.TOTAL_AMOUNT,
translationKey: groupBy ? 'common.total' : 'iou.amount',
},
{
columnName: CONST.SEARCH.TABLE_COLUMNS.BASE_62_REPORT_ID,
translationKey: 'common.reportID',
},
{
columnName: CONST.SEARCH.TABLE_COLUMNS.REPORT_ID,
translationKey: 'common.longID',
},
{
columnName: CONST.SEARCH.TABLE_COLUMNS.TITLE,
translationKey: 'common.title',
Expand Down Expand Up @@ -200,6 +208,14 @@ const getExpenseReportHeaders = (profileIcon?: IconAsset): SearchColumnConfig[]
columnName: CONST.SEARCH.TABLE_COLUMNS.TOTAL,
translationKey: 'common.total',
},
{
columnName: CONST.SEARCH.TABLE_COLUMNS.BASE_62_REPORT_ID,
translationKey: 'common.reportID',
},
{
columnName: CONST.SEARCH.TABLE_COLUMNS.REPORT_ID,
translationKey: 'common.longID',
},
{
columnName: CONST.SEARCH.TABLE_COLUMNS.ACTION,
translationKey: 'common.action',
Expand Down
15 changes: 13 additions & 2 deletions src/components/TransactionItemRow/index.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,7 @@ import type {SearchColumnType, TableColumnSize} from '@components/Search/types';
import ActionCell from '@components/SelectionListWithSections/Search/ActionCell';
import DateCell from '@components/SelectionListWithSections/Search/DateCell';
import StatusCell from '@components/SelectionListWithSections/Search/StatusCell';
import TitleCell from '@components/SelectionListWithSections/Search/TitleCell';
import TextCell from '@components/SelectionListWithSections/Search/TextCell';
import UserInfoCell from '@components/SelectionListWithSections/Search/UserInfoCell';
import Text from '@components/Text';
import {useMemoizedLazyExpensifyIcons} from '@hooks/useLazyAsset';
Expand All @@ -20,6 +20,7 @@ import useStyleUtils from '@hooks/useStyleUtils';
import useTheme from '@hooks/useTheme';
import useThemeStyles from '@hooks/useThemeStyles';
import {isCategoryMissing} from '@libs/CategoryUtils';
import getBase62ReportID from '@libs/getBase62ReportID';
import {isSettled} from '@libs/ReportUtils';
import StringUtils from '@libs/StringUtils';
import {
Expand Down Expand Up @@ -429,6 +430,16 @@ function TransactionItemRow({
/>
</View>
),
[CONST.SEARCH.TABLE_COLUMNS.REPORT_ID]: (
<View style={[StyleUtils.getReportTableColumnStyles(CONST.SEARCH.TABLE_COLUMNS.REPORT_ID)]}>
<TextCell text={transactionItem.reportID === CONST.REPORT.UNREPORTED_REPORT_ID ? '' : transactionItem.reportID} />
</View>
),
[CONST.SEARCH.TABLE_COLUMNS.BASE_62_REPORT_ID]: (
<View style={[StyleUtils.getReportTableColumnStyles(CONST.SEARCH.TABLE_COLUMNS.BASE_62_REPORT_ID)]}>
<TextCell text={transactionItem.reportID === CONST.REPORT.UNREPORTED_REPORT_ID ? '' : getBase62ReportID(Number(transactionItem.reportID))} />
</View>
),
[CONST.SEARCH.TABLE_COLUMNS.TAX]: (
<View
key={CONST.SEARCH.TABLE_COLUMNS.TAX}
Expand All @@ -442,7 +453,7 @@ function TransactionItemRow({
),
[CONST.SEARCH.TABLE_COLUMNS.TITLE]: (
<View style={[StyleUtils.getReportTableColumnStyles(CONST.SEARCH.TABLE_COLUMNS.TITLE)]}>
<TitleCell
<TextCell
text={transactionItem.report?.reportName ?? ''}
isLargeScreenWidth={isLargeScreenWidth}
/>
Expand Down
24 changes: 24 additions & 0 deletions src/libs/SearchUIUtils.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2040,6 +2040,14 @@ function getSortedTransactionData(
return data;
}

if (sortBy === CONST.SEARCH.TABLE_COLUMNS.REPORT_ID || sortBy === CONST.SEARCH.TABLE_COLUMNS.BASE_62_REPORT_ID) {
return data.sort((a, b) => {
const aValue = a.reportID;
const bValue = b.reportID;
return compareValues(aValue, bValue, sortOrder, sortBy, localeCompare, true);
});
}

const sortingProperty = transactionColumnNamesToSortingProperty[sortBy];

if (sortBy === CONST.SEARCH.TABLE_COLUMNS.TITLE) {
Expand Down Expand Up @@ -2134,6 +2142,14 @@ function getSortedReportData(
});
}

if (sortBy === CONST.SEARCH.TABLE_COLUMNS.REPORT_ID || sortBy === CONST.SEARCH.TABLE_COLUMNS.BASE_62_REPORT_ID) {
return data.sort((a, b) => {
const aValue = a.reportID;
const bValue = b.reportID;
return compareValues(aValue, bValue, sortOrder, sortBy, localeCompare, true);
});
}

const sortingProperty = expenseReportColumnNamesToSortingProperty[sortBy];

if (!sortingProperty) {
Expand Down Expand Up @@ -2297,6 +2313,10 @@ function getSearchColumnTranslationKey(columnId: SearchCustomColumnIds): Transla
return 'common.title';
case CONST.SEARCH.TABLE_COLUMNS.STATUS:
return 'common.status';
case CONST.SEARCH.TABLE_COLUMNS.REPORT_ID:
return 'common.longID';
case CONST.SEARCH.TABLE_COLUMNS.BASE_62_REPORT_ID:
return 'common.reportID';
}
}

Expand Down Expand Up @@ -2684,6 +2704,8 @@ function getColumnsToShow(
[CONST.SEARCH.TABLE_COLUMNS.FROM]: true,
[CONST.SEARCH.TABLE_COLUMNS.TO]: true,
[CONST.SEARCH.TABLE_COLUMNS.TOTAL]: true,
[CONST.SEARCH.TABLE_COLUMNS.BASE_62_REPORT_ID]: false,
[CONST.SEARCH.TABLE_COLUMNS.REPORT_ID]: false,
[CONST.SEARCH.TABLE_COLUMNS.ACTION]: true,
};

Expand Down Expand Up @@ -2760,6 +2782,8 @@ function getColumnsToShow(
[CONST.SEARCH.TABLE_COLUMNS.BILLABLE]: false,
[CONST.SEARCH.TABLE_COLUMNS.TAX_AMOUNT]: false,
[CONST.SEARCH.TABLE_COLUMNS.TOTAL_AMOUNT]: true,
[CONST.SEARCH.TABLE_COLUMNS.BASE_62_REPORT_ID]: false,
[CONST.SEARCH.TABLE_COLUMNS.REPORT_ID]: false,
[CONST.SEARCH.TABLE_COLUMNS.TITLE]: false,
[CONST.SEARCH.TABLE_COLUMNS.STATUS]: false,
[CONST.SEARCH.TABLE_COLUMNS.ACTION]: true,
Expand Down
2 changes: 2 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 @@ -1778,6 +1778,8 @@ const createStyleUtils = (theme: ThemeColors, styles: ThemeStyles) => ({
case CONST.SEARCH.TABLE_COLUMNS.ACTION:
columnWidth = {...getWidthStyle(variables.w80), ...styles.alignItemsCenter};
break;
case CONST.SEARCH.TABLE_COLUMNS.REPORT_ID:
case CONST.SEARCH.TABLE_COLUMNS.BASE_62_REPORT_ID:
case CONST.SEARCH.TABLE_COLUMNS.MERCHANT:
case CONST.SEARCH.TABLE_COLUMNS.FROM:
case CONST.SEARCH.TABLE_COLUMNS.TO:
Expand Down
4 changes: 4 additions & 0 deletions tests/unit/Search/SearchUIUtilsTest.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2770,6 +2770,8 @@ describe('SearchUIUtils', () => {
[CONST.SEARCH.TABLE_COLUMNS.TO]: true,
[CONST.SEARCH.TABLE_COLUMNS.TOTAL]: true,
[CONST.SEARCH.TABLE_COLUMNS.ACTION]: true,
[CONST.SEARCH.TABLE_COLUMNS.BASE_62_REPORT_ID]: false,
[CONST.SEARCH.TABLE_COLUMNS.REPORT_ID]: false,
});
});

Expand All @@ -2789,6 +2791,8 @@ describe('SearchUIUtils', () => {
// Total should always be visible
[CONST.SEARCH.TABLE_COLUMNS.TOTAL]: true,
[CONST.SEARCH.TABLE_COLUMNS.ACTION]: false,
[CONST.SEARCH.TABLE_COLUMNS.BASE_62_REPORT_ID]: false,
[CONST.SEARCH.TABLE_COLUMNS.REPORT_ID]: false,
});
});

Expand Down
Loading