[Due for payment 2026-04-14] Expense report chat appears empty when report has 50+ IOU actions with newer comments

[mountiny]

Description

When an expense report has 50+ IOU report actions (oldest) followed by comments/other report actions (newest), the chat area below the transaction table appears empty. The comments and other non-IOU actions exist but are never loaded because pagination fails.

Root Cause

1. For money request reports, OpenReport explicitly uses ASC sort order (oldest first) — see Auth/auth/command/OpenReport.cpp line 278: reportActionSortOrder = ReportAction::SORT_ORDER_ASC
2. The first page of 50 actions therefore contains the oldest actions: the CREATED action + IOU CREATE actions
3. MoneyRequestReportActionsList filters ALL of these out via isActionVisibleOnMoneyRequestReport():
   • IOU actions with type === CREATE or TRACK are filtered out (they are shown in the transaction table at the top instead)
   • The CREATED report action is also filtered out by default
4. visibleReportActions ends up empty — the FlatList's data array has zero items
5. The newer comment/non-IOU actions exist on subsequent pages but onStartReached/onEndReached never fire because there are no data items to scroll through
6. loadNewerChats() (which would fetch the newer comments) is never triggered

The pagination system relies entirely on scroll events from the FlatList. When the FlatList's data array is empty (because all fetched actions were filtered out), no scroll events fire, breaking the pagination loop. There is no fallback mechanism to detect this state and trigger additional page fetches.

Key Files

• Auth/auth/command/OpenReport.cpp — line 278: explicitly sets SORT_ORDER_ASC for money request reports
• src/libs/MoneyRequestReportUtils.ts — isActionVisibleOnMoneyRequestReport() filters out IOU CREATE/TRACK actions and CREATED action (lines 34-53)
• src/components/MoneyRequestReportView/MoneyRequestReportActionsList.tsx — visibleReportActions filter (lines 320-345), FlatList with data={visibleReportActions} (line 862)
• src/hooks/useLoadReportActions.ts — loadNewerChats() / loadOlderChats() are only triggered by scroll events (lines 90-151)
• Auth/auth/lib/Report.cpp — page limit of 50 at line 616

Steps to Reproduce

1. Create an expense report with 50+ individual expenses
2. Add a few comments to the expense report (these will be chronologically newer than the IOU actions)
3. Open the expense report in NewDot
4. Observe that the transaction table shows expenses at the top, but the chat area below is completely empty — the comments are not loaded
5. The comments exist on subsequent pages but pagination never triggers to fetch them

Expected Behavior

The chat area should show comments and other non-IOU report actions. The app should automatically paginate to load them even if the first page(s) contain only filtered-out IOU actions.

Actual Behavior

The chat area below the transaction table is completely empty. Comments and other report actions that exist on the report are not displayed.

Proposed Solution

Add a useEffect in MoneyRequestReportActionsList that detects when visibleReportActions is empty (or has too few items to fill the screen) while hasNewerActions is true, and automatically calls loadNewerChats(true) to fetch the next page. This should loop until visible actions appear or all pages are exhausted.

Platform

• Web
• iOS
• Android
• Desktop

All platforms are affected since this is a data loading issue in shared React code.

Issue Owner

Current Issue Owner: @mallenexpensify

[MelvinBot]

I have failed to help you. I let you down and for that I am sorry. Please try again later. This may be due to a Claude outage (check here).

Failure details: https://github.com/Expensify/Expensify/actions/runs/23245863086

[mountiny]

Proposal

Root Cause Analysis

Money request reports use ASC sort order in OpenReport (see Auth/auth/command/OpenReport.cpp line 278), so the first page of 50 report actions contains the oldest actions. For a report with 50+ IOU actions followed by comments, this first page is entirely IOU CREATE actions + the CREATED action.

MoneyRequestReportActionsList filters all of these out via isActionVisibleOnMoneyRequestReport() (IOU CREATE/TRACK go to the transaction table, CREATED is hidden by default). This leaves visibleReportActions empty.

The pagination system relies on FlatList scroll events (onStartReached/onEndReached), but with an empty data array, no scroll events fire. Additionally, loadNewerChats(false) always returns early because MoneyRequestReportActionsList doesn't pass reportActionID to useLoadReportActions — and without it, the !reportActionID guard blocks the call. This means even scroll-based newer pagination would never work.

There are two problems to fix:

1. Initial empty state: The first page(s) are all filtered-out IOU actions, so the chat appears empty and auto-pagination never triggers.
2. Scroll-based newer pagination: Even after the initial problem is solved, scrolling down to load more newer actions (comments) would never work because loadNewerChats(false) is gated on reportActionID.

Solution

Change 1: Add enableNewerPagination to useLoadReportActions (src/hooks/useLoadReportActions.ts)

Add a new optional parameter enableNewerPagination that, when true:

• Allows loadNewerChats(false) to work without a linked reportActionID
• Skips the didLoadNewerChats one-shot guard (so scroll-based pagination can fire repeatedly, like loadOlderChats already does)

type UseLoadReportActionsArguments = {
    // ... existing fields ...

    /** When true, loadNewerChats works without a linked reportActionID and can be called
     *  repeatedly via scroll. Used by money request reports whose initial page is loaded
     *  in ASC order (oldest first). */
    enableNewerPagination?: boolean;
};

function useLoadReportActions({
    reportID, reportActionID, reportActions, allReportActionIDs,
    transactionThreadReport, hasOlderActions, hasNewerActions,
    enableNewerPagination = false,
}: UseLoadReportActionsArguments) {
    // ... existing code ...

    const loadNewerChats = useCallback(
        (force = false) => {
            if (
                !force &&
                ((!reportActionID && !enableNewerPagination) ||
                    !isFocused ||
                    !newestReportAction ||
                    !hasNewerActions ||
                    isOffline ||
                    (!enableNewerPagination && didLoadNewerChats.current) ||
                    newestReportAction.pendingAction === CONST.RED_BRICK_ROAD_PENDING_ACTION.DELETE)
            ) {
                return;
            }

            didLoadNewerChats.current = true;

            if (!isEmptyObject(transactionThreadReport)) {
                getNewerActions(reportID, currentReportNewest?.reportActionID);
                getNewerActions(transactionThreadReport.reportID, transactionThreadNewest?.reportActionID);
            } else if (newestReportAction) {
                getNewerActions(reportID, newestReportAction.reportActionID);
            }
        },
        [
            reportActionID,
            enableNewerPagination,
            isFocused,
            newestReportAction,
            hasNewerActions,
            isOffline,
            transactionThreadReport,
            reportID,
            currentReportNewest?.reportActionID,
            transactionThreadNewest?.reportActionID,
        ],
    );

    // ... rest unchanged ...
}

Key changes in the guard:

• (!reportActionID && !enableNewerPagination) — when enableNewerPagination is true, reportActionID is no longer required
• (!enableNewerPagination && didLoadNewerChats.current) — the one-shot guard is skipped, allowing repeated scroll-based calls (matching loadOlderChats behavior)

Change 2: Auto-pagination useEffect in MoneyRequestReportActionsList (src/components/MoneyRequestReportView/MoneyRequestReportActionsList.tsx)

Pass enableNewerPagination: true and add a useEffect that auto-loads newer pages when the visible list is empty:

const {loadOlderChats, loadNewerChats} = useLoadReportActions({
    reportID,
    reportActions,
    allReportActionIDs: reportActionIDs,
    transactionThreadReport,
    hasOlderActions,
    hasNewerActions,
    enableNewerPagination: true,
});

// Auto-paginate to load newer actions when all fetched actions are filtered out.
// Money request reports load oldest-first (ASC), so the first page(s) may contain
// only IOU CREATE actions that are displayed in the transaction table, not in the
// chat list. We keep loading newer pages until visible chat actions appear or there
// are no more pages.
useEffect(() => {
    if (
        visibleReportActions.length === 0 &&
        reportActions.length > 0 &&
        hasNewerActions &&
        !isOffline &&
        !reportMetadata?.isLoadingNewerReportActions
    ) {
        loadNewerChats(true);
    }
}, [
    visibleReportActions.length,
    reportActions.length,
    hasNewerActions,
    isOffline,
    reportMetadata?.isLoadingNewerReportActions,
    loadNewerChats,
]);

How the auto-pagination loop works

1. Initial render: visibleReportActions.length === 0 (all 50 IOU actions filtered), reportActions.length === 50, hasNewerActions === true, isLoadingNewerReportActions === false → effect fires loadNewerChats(true)
2. Loading: getNewerActions optimistically sets isLoadingNewerReportActions = true → effect re-evaluates but guard prevents duplicate call
3. Response arrives: New actions merge into Onyx, isLoadingNewerReportActions = false, reportActions.length increases → effect re-evaluates
4. If still empty: visibleReportActions.length is still 0 but reportActions.length changed → effect fires again
5. Termination: Loop stops when either visibleReportActions.length > 0 (comments found) or hasNewerActions === false (all pages exhausted)

Edge cases addressed

Edge case	How it's handled
Multiple pages of filtered IOU actions	reportActions.length changes after each page load, re-triggering the effect even when visibleReportActions.length stays at 0
Duplicate API requests	reportMetadata.isLoadingNewerReportActions guard prevents firing while a request is in-flight
Report with zero comments (only IOU actions)	Loop continues until hasNewerActions === false, then stops naturally
Offline	isOffline guard prevents API calls; auto-pagination resumes when back online
Scroll-based newer pagination after auto-fill	enableNewerPagination allows loadNewerChats(false) to work from onEndReached without reportActionID, and skips the didLoadNewerChats one-shot guard
loadOlderChats unchanged	No changes to older pagination — it already works correctly
Other callers of useLoadReportActions	enableNewerPagination defaults to false, so existing behavior in ReportActionsView is unchanged

Unit tests to add (tests/unit/useLoadReportActionsTest.tsx)

describe('enableNewerPagination', () => {
    test('loadNewerChats(false) works without reportActionID when enableNewerPagination is true', () => {
        const mockGetNewerActions = jest.fn();
        jest.doMock('@userActions/Report', () => ({
            getNewerActions: mockGetNewerActions,
            getOlderActions: jest.fn(),
        }));
        const props = {
            ...baseProps,
            hasNewerActions: true,
            enableNewerPagination: true,
            // reportActionID is NOT set
        };
        const {result} = renderHook(() => useLoadReportActions(props));
        result.current.loadNewerChats(false);
        expect(mockGetNewerActions).toHaveBeenCalled();
    });

    test('loadNewerChats(false) still bails without reportActionID when enableNewerPagination is false', () => {
        const mockGetNewerActions = jest.fn();
        jest.doMock('@userActions/Report', () => ({
            getNewerActions: mockGetNewerActions,
            getOlderActions: jest.fn(),
        }));
        const props = {
            ...baseProps,
            hasNewerActions: true,
            enableNewerPagination: false,
            // reportActionID is NOT set
        };
        const {result} = renderHook(() => useLoadReportActions(props));
        result.current.loadNewerChats(false);
        expect(mockGetNewerActions).not.toHaveBeenCalled();
    });

    test('loadNewerChats(false) can be called multiple times when enableNewerPagination is true', () => {
        const mockGetNewerActions = jest.fn();
        jest.doMock('@userActions/Report', () => ({
            getNewerActions: mockGetNewerActions,
            getOlderActions: jest.fn(),
        }));
        const props = {
            ...baseProps,
            hasNewerActions: true,
            enableNewerPagination: true,
        };
        const {result} = renderHook(() => useLoadReportActions(props));
        result.current.loadNewerChats(false);
        result.current.loadNewerChats(false);
        expect(mockGetNewerActions).toHaveBeenCalledTimes(2);
    });

    test('loadNewerChats(false) respects hasNewerActions guard even with enableNewerPagination', () => {
        const mockGetNewerActions = jest.fn();
        jest.doMock('@userActions/Report', () => ({
            getNewerActions: mockGetNewerActions,
            getOlderActions: jest.fn(),
        }));
        const props = {
            ...baseProps,
            hasNewerActions: false,
            enableNewerPagination: true,
        };
        const {result} = renderHook(() => useLoadReportActions(props));
        result.current.loadNewerChats(false);
        expect(mockGetNewerActions).not.toHaveBeenCalled();
    });

    test('loadNewerChats(false) respects offline guard even with enableNewerPagination', () => {
        jest.mocked(require('@hooks/useNetwork')).mockReturnValue({isOffline: true});
        const mockGetNewerActions = jest.fn();
        jest.doMock('@userActions/Report', () => ({
            getNewerActions: mockGetNewerActions,
            getOlderActions: jest.fn(),
        }));
        const props = {
            ...baseProps,
            hasNewerActions: true,
            enableNewerPagination: true,
        };
        const {result} = renderHook(() => useLoadReportActions(props));
        result.current.loadNewerChats(false);
        expect(mockGetNewerActions).not.toHaveBeenCalled();
    });
});

Manual test steps

Setup (requires a report with 50+ expenses — use a staging account or create via API):

1. Create a workspace with a policy
2. Create an expense report and add 55+ individual expenses to it
3. Add 2-3 comments on the expense report after all expenses are created
4. Note the report ID

Test 1 — Auto-pagination loads comments on initial open:

1. Open NewDot and navigate to the expense report
2. Expected: The transaction table at the top shows all expenses, and the chat area below shows the comments
3. Previously: The chat area would be empty

Test 2 — Scroll-based newer pagination:

1. Open a expense report with 55+ expenses AND 60+ comments
2. Expected: Initial auto-pagination loads the first batch of comments. Scrolling down in the chat area loads additional comments.
3. Previously: Only the auto-paginated batch would show; scrolling would not load more.

Test 3 — Report with zero comments (only expenses):

1. Open an expense report with 55+ expenses and NO comments
2. Expected: Transaction table shows expenses, chat area is empty (no comments to show). No infinite loading spinner or errors.

Test 4 — Offline behavior:

1. Go offline
2. Open an expense report with 55+ expenses and comments
3. Expected: No API calls are attempted. The chat area shows whatever is cached (may be empty).
4. Go back online
5. Expected: Auto-pagination kicks in and loads the comments.

Test 5 — No regression on normal reports:

1. Open a regular chat report (not a money request report)
2. Expected: Pagination works exactly as before — no behavioral changes.

[mountiny]

@MelvinBot If there is lets say CREATED report action followed with 115 IOU report actions in the chronological order followed by one ADDCOMMENT, how does the pagination of the Expense report actions work in this case when OpenReport is called?

[MelvinBot]

Great question. Here's how pagination plays out for your scenario (1 CREATED + 115 IOU + 1 ADDCOMMENT = 117 actions total):

Backend behavior (OpenReport)

For money request reports, OpenReport uses ASC sort order (oldest first) with a page size of 50. So when OpenReport is called without a reportActionID cursor (i.e., normal navigation, not a deep link):

Page	Actions returned	Contents
Page 1 (initial OpenReport)	50	CREATED + 49 IOU actions (the oldest)
Page 2 (would need GetNewerActions)	50	IOU actions #50–99
Page 3 (would need GetNewerActions)	17	IOU actions #100–115 + the 1 ADDCOMMENT

The initial response sets hasOlderActions = false (these are the oldest) and hasNewerActions = true (67 more actions exist).

Frontend pagination markers

The Pagination middleware (Pagination.ts:112-117) processes the response:

• Since hasOlderActions = false, it appends PAGINATION_END_ID ("-2") — marking the beginning of history
• Since this is an initial type call with no cursor, it also prepends PAGINATION_START_ID ("-1") — marking "no newer actions than these" from the perspective of the initial fetch

This is the key problem: the frontend marks the initial page as having "no newer actions" based on the (type === 'initial' && !cursorID) condition, even though hasNewerActions = true in the server response. However, hasNewerActions from the server is still stored separately and used by usePaginatedReportActions to set the hasNewerActions boolean that drives the hook.

Where it breaks

1. Page 1 arrives with 50 actions (CREATED + 49 IOUs)
2. MoneyRequestReportActionsList filters all of them out via isActionVisibleOnMoneyRequestReport() — IOU CREATE actions go to the transaction table, CREATED is hidden
3. visibleReportActions is empty → the FlatList renders nothing
4. With no items in the FlatList, onEndReached (which calls loadNewerChats) never fires — there's nothing to scroll through
5. Even if it did fire, loadNewerChats(false) has a guard at line 118: !reportActionID — since MoneyRequestReportActionsList doesn't pass a reportActionID to useLoadReportActions, the non-forced call always bails out
6. Additionally, didLoadNewerChats is a one-shot ref — even if loadNewerChats runs once, it won't run again on subsequent scroll events

Result: Pages 2 and 3 are never fetched. The ADDCOMMENT sitting on page 3 is unreachable. The chat area appears empty.

Summary

The pagination would work in 3 pages of 50/50/17, but the frontend never requests pages 2 and 3 because the initial page produces zero visible items in the FlatList, so scroll-based pagination never triggers. This is exactly the bug described in this issue.

[koko57]

(visibleReportActionsLength: 1)

@mountiny I tested your solution, but I guess we need to adjust the conditions there. I have 49 IOUs and 6 replies - 5 mine and the last one from Concierge. Only the last one (Concierge message) is shown.

Earlier I had a report with 47 IOUs and only the first and the last messages were shown. What's interesting for other report - 118 IOUs and 6 comments I was getting all the messages every time (recording).

Screen.Recording.2026-03-19.at.16.47.36.mp4

[mountiny]

@koko57 thank you! I will be ooo, I think @luacmartins should be a good resource for this flow as well

[koko57]

@koko57 thank you! I will be ooo, I think @luacmartins should be a good resource for this flow as well

ok, thanks!

[koko57]

Melvin was right about the hasNewerActions - although we get hasNewerActions true from the backend the middleware and the hooks change the value to false - we get false from getContinuousChain in usePaginatedReportActions. So I guess we need to fix the middleware/hook to get the correct value.