Patch Search snapshot when submitting a tracked expense (offline Spend > Expenses)

src/libs/actions/IOU/SearchUpdate.ts

@@ -1,7 +1,7 @@
 import type {SearchQueryJSON} from '@components/Search/types';
 
 import {isExpenseReport, isOptimisticPersonalDetail} from '@libs/ReportUtils';
-import {buildSearchQueryJSON, buildSearchQueryString, getCurrentSearchQueryJSON, getFilterFromQuery} from '@libs/SearchQueryUtils';
+import {buildCannedSearchQuery, buildSearchQueryJSON, buildSearchQueryString, getCurrentSearchQueryJSON, getFilterFromQuery} from '@libs/SearchQueryUtils';
 import {getSuggestedSearches, isEligibleForStatus} from '@libs/SearchUIUtils';
 
 import CONST from '@src/CONST';
@@ -113,6 +113,30 @@ function shouldOptimisticallyUpdateSearch(
     return shouldOptimisticallyUpdateByStatus && validSearchTypes && matchesFilterQuery;
 }
 
+/**
+ * The default Spend > Expenses and Reports pages render from the canned suggested-search snapshots
+ * (`type:expense` / `type:expense_report`). Those hashes are normally added to SEARCH_QUERY_BY_HASH
+ * only as a side effect of the `search()` action when the page is actually opened (see Search.ts).
+ * If the user never opened the page before going offline, that hash is absent from the map, so the
+ * fan-out loop in `getSearchOnyxUpdate` never patches the snapshot the page reads and it stays empty.
+ *
+ * These canned queries are deterministic and don't depend on a visit, so we register their hashes here
+ * and let the existing loop patch them exactly as it would after a visit. This is cheap: the query
+ * strings are trivial to build and `buildSearchQueryJSON` is internally cached.
+ */
+function getDefaultSearchQueriesByHash(): Record<string, string> {
+    const defaultQueryStrings = [buildCannedSearchQuery(), buildCannedSearchQuery({type: CONST.SEARCH.DATA_TYPES.EXPENSE_REPORT})];
+    const queriesByHash: Record<string, string> = {};
+    for (const queryString of defaultQueryStrings) {
+        const queryJSON = buildSearchQueryJSON(queryString);
+        if (!queryJSON) {
+            continue;
+        }
+        queriesByHash[queryJSON.hash] = queryString;
+    }
+    return queriesByHash;
+}
+
 function getSearchOnyxUpdate({
     participant,
     transaction,
@@ -193,6 +217,12 @@ function getSearchOnyxUpdate({
             key: `${ONYXKEYS.COLLECTION.SNAPSHOT}${queryJSON.hash}` as const,
             value: {
                 search: {
+                    // `hash` is what makes an optimistically-created snapshot renderable. The Search page gates
+                    // rendering on `isSearchDataLoaded`, which requires `snapshot.search.hash === queryJSON.hash`.
+                    // When the page was visited before, `search()` already stamped this hash on the snapshot, so a
+                    // partial MERGE renders; on a never-visited page the snapshot is created by this MERGE, so it
+                    // must carry the hash itself or `isSearchDataLoaded` stays false and the page shows "Nothing to show".
+                    hash: queryJSON.hash,
                     type: queryJSON.type,
                     hasResults: true,
                     isLoading: false,
@@ -252,6 +282,8 @@ function getSearchOnyxUpdate({
                     key: `${ONYXKEYS.COLLECTION.SNAPSHOT}${groupTransactionsQueryJSON.hash}` as const,
                     value: {
                         search: {
+                            // See the note above: the per-member snapshot must carry its own hash to be renderable when created optimistically.
+                            hash: groupTransactionsQueryJSON.hash,
                             type: groupTransactionsQueryJSON.type,
                             offset: 0,
                             hasMoreResults: false,
@@ -277,7 +309,10 @@ function getSearchOnyxUpdate({
     //    This catches cases like creating an expense from a chat while a `from:<me>` filter or
     //    `groupBy:from` view is loaded but not the currently active search. The hash→query map is
     //    stored in a dedicated Onyx key (not on the snapshot) so SEARCH API responses can't wipe it.
-    const queryByHash = getSearchQueryByHash();
+    //    The deterministic default canned hashes (see getDefaultSearchQueriesByHash) are merged in so the
+    //    default Spend > Expenses / Reports pages are patched even when they were never visited. Onyx-recorded
+    //    queries take precedence so a real visited entry is never shadowed by the canned default.
+    const queryByHash = {...getDefaultSearchQueriesByHash(), ...getSearchQueryByHash()};
     for (const [hashString, queryString] of Object.entries(queryByHash)) {
         if (!queryString) {
             continue;

tests/actions/IOU/SearchUpdateTest.ts

@@ -4,10 +4,12 @@ import {getSearchOnyxUpdate, shouldOptimisticallyUpdateSearch} from '@libs/actio
 import initOnyxDerivedValues from '@libs/actions/OnyxDerived';
 import '@libs/actions/IOU/MoneyRequest';
 import type * as PolicyUtils from '@libs/PolicyUtils';
+import type * as SearchQueryUtils from '@libs/SearchQueryUtils';
 
 import CONST from '@src/CONST';
 import IntlStore from '@src/languages/IntlStore';
 import OnyxUpdateManager from '@src/libs/actions/OnyxUpdateManager';
+import {buildCannedSearchQuery} from '@src/libs/SearchQueryUtils';
 import ONYXKEYS from '@src/ONYXKEYS';
 import type {Policy, Report} from '@src/types/onyx';
 
@@ -546,5 +548,47 @@ describe('actions/IOU', () => {
             });
             expect(result).toBeUndefined();
         });
+
+        it('patches the default Spend > Expenses snapshot even when the page was never visited', async () => {
+            // Compute the real canned Expenses hash from the unmocked helpers.
+            const actualSearchQueryUtils = jest.requireActual<typeof SearchQueryUtils>('@src/libs/SearchQueryUtils');
+            const cannedExpensesQuery = actualSearchQueryUtils.buildCannedSearchQuery();
+            const cannedExpensesHash = actualSearchQueryUtils.buildSearchQueryJSON(cannedExpensesQuery)?.hash;
+
+            // Feed the real canned query strings through the mocked builder so getSearchOnyxUpdate can
+            // register the canned hashes (the mock returns undefined by default).
+            jest.mocked(buildCannedSearchQuery).mockImplementation(actualSearchQueryUtils.buildCannedSearchQuery);
+
+            // Simulate a never-visited Spend > Expenses page: SEARCH_QUERY_BY_HASH holds no entry for the
+            // canned hash and the active search (mocked) is a different hash.
+            await Onyx.set(ONYXKEYS.SEARCH_QUERY_BY_HASH, {});
+            await waitForBatchedUpdates();
+
+            const iouReport: Report = {
+                ...createRandomReport(2, undefined),
+                type: CONST.REPORT.TYPE.EXPENSE,
+                stateNum: CONST.REPORT.STATE_NUM.OPEN,
+                statusNum: CONST.REPORT.STATUS_NUM.OPEN,
+            };
+
+            const result = getSearchOnyxUpdate({
+                transaction: {...createRandomTransaction(1)},
+                participant: {accountID: 42, login: 'test@test.com'},
+                iouReport,
+                iouAction: undefined,
+                policy: undefined,
+                transactionThreadReportID: undefined,
+                isFromOneTransactionReport: false,
+                isInvoice: false,
+            });
+
+            const cannedSnapshotKey = `${ONYXKEYS.COLLECTION.SNAPSHOT}${cannedExpensesHash}`;
+            const cannedUpdate = result?.optimisticData?.find((update) => update.key === cannedSnapshotKey);
+            expect(cannedUpdate).toBeDefined();
+
+            // The snapshot must carry its own `hash` or the never-visited page's `isSearchDataLoaded` gate stays
+            // false and the page renders "Nothing to show" even though the transaction data was merged in.
+            expect(cannedUpdate?.value).toHaveProperty('search.hash', cannedExpensesHash);
+        });
     });
 });