[Due for payment 2025-06-11] [$250] Adding filter in the middle of a query invalidates the query

[m-natarajan]

If you haven’t already, check out our contributing guidelines for onboarding and email contributors@expensify.com to request to join our Slack channel!

---

Version Number: 9.1.49-6
Reproducible in staging?: Y
Reproducible in production?: Y
If this was caught during regression testing, add the test name, ID and link from TestRail:
Email or phone of affected tester (no customers):
Logs: https://stackoverflow.com/c/expensify/questions/4856
Expensify/Expensify Issue URL:
Issue reported by: @dominictb
Slack conversation (hyperlinked to channel name): #Expensify Bugs

Action Performed:

1. Go to Reports
2. Press the filter icon
3. Select From > "You"
4. Type in group-by:reports at THE END of the query > Enter to search
5. Observe the results
6. Remove group-by:reports
7. Place the cursor before from:...
8. Type in group-by:reports
9. See that the name in from: loses highlight
10. Press Enter to search
11. See that Nothing to show appears

Expected Result:

In step 9, the name should keep the highlight
The queries in step 11 and step 5 are the same, just change order, so the results should be the same

Actual Result:

In step 9, the name loses highlight
The queries in step 11 and step 5 are the same but yield different results

Workaround:

Can the user still use Expensify without this being fixed? Have you informed them of the workaround?

Platforms:

Select the officially supported platforms where the issue was reproduced:

• Android: App
• Android: mWeb Chrome
• iOS: App
• iOS: mWeb Safari
• iOS: mWeb Chrome
• Windows: Chrome
• MacOS: Chrome / Safari
• MacOS: Desktop

Platforms Tested:

On which of our officially supported platforms was this issue tested:

• Android: App
• Android: mWeb Chrome
• iOS: App
• iOS: mWeb Safari
• iOS: mWeb Chrome
• Windows: Chrome
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Add any screenshot/video evidence

Screen.Recording.2025-05-22.at.16.29.06.mov

Recording.1260.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021928080421938997312
• Upwork Job ID: 1928080421938997312
• Last Price Increase: 2025-05-29

Issue Owner

Current Issue Owner: @zanyrenney

[melvin-bot]

Triggered auto assignment to @zanyrenney (Bug), see https://stackoverflow.com/c/expensify/questions/14418 for more details. Please add this bug to a GH project, as outlined in the SO.

[dominictb]

Just a note here that in step 8, you need to manually type in the group-by:reports filter, instead of copy paste.

[Burhan-Rashid]

Proposal

Please re-state the problem that we are trying to solve in this issue.

Adding filter in the middle of a query invalidates the query

What is the root cause of that problem?

The root cause of the issue is that the query already contains from:'user display name' and we need to send the actual userId in the query to backend to get the correct result, instead when we edit the query in the middle and search again, the user display name is sent in the query and not the userId.
This happens because our autocomplete substitution map gets set to empty object when we edit the query in the middle because the query parsing of incomplete queries (while editing in middle) will mess up all the other fields which are present after the position where the edit is being done until user finishes writing whole of the query. Due to this when the user tries to search for the same query again after editing, the substitution of displayName to userId is not done and displayName is sent to backend which gives no results for that displayName.

App/src/components/Search/SearchPageHeader/SearchPageHeaderInput.tsx

Lines 158 to 160 in 409e68e

	if (!isEqual(autocompleteSubstitutions, updatedSubstitutionsMap)) {
	setAutocompleteSubstitutions(updatedSubstitutionsMap);
	}

Query payload which is sent to backend after editing the query group-by:
{"type":"expense","status":"all","sortBy":"date","sortOrder":"desc","groupBy":"reports","filters":{"operator":"eq","left":"from","right":"burhan rashid 20"},"inputQuery":"type:expense status:all sortBy:date sortOrder:desc groupBy:reports from:\"burhan rashid 20\"","hash":730430958,"recentSearchHash":335810426,"offset":0}

Query payload send to backend which contains actual from:userID.
{"type":"expense","status":"all","sortBy":"date","sortOrder":"desc","groupBy":"reports","filters":{"operator":"eq","left":"from","right":"19885543"},"inputQuery":"type:expense status:all sortBy:date sortOrder:desc groupBy:reports from:19885543","hash":75650286,"recentSearchHash":875489494,"offset":0}

App/src/pages/Search/AdvancedSearchFilters.tsx

Lines 312 to 325 in 409e68e

	function getFilterParticipantDisplayTitle(accountIDs: string[], personalDetails: PersonalDetailsList | undefined) {
	const selectedPersonalDetails = accountIDs.map((id) => personalDetails?.[id]);
	return selectedPersonalDetails
	.map((personalDetail) => {
	if (!personalDetail) {
	return '';
	}
	return createDisplayName(personalDetail.login ?? '', personalDetail);
	})
	.filter(Boolean)
	.join(', ');
	}

App/src/libs/SearchQueryUtils.ts

Lines 220 to 231 in 409e68e

	if (
	filterName === CONST.SEARCH.SYNTAX_FILTER_KEYS.FROM ||
	filterName === CONST.SEARCH.SYNTAX_FILTER_KEYS.TO ||
	filterName === CONST.SEARCH.SYNTAX_FILTER_KEYS.PAYER ||
	filterName === CONST.SEARCH.SYNTAX_FILTER_KEYS.EXPORTER
	) {
	if (typeof filterValue === 'string') {
	return getPersonalDetailByEmail(filterValue)?.accountID.toString() ?? filterValue;
	}
	return filterValue.map((email) => getPersonalDetailByEmail(email)?.accountID.toString() ?? email);
	}

What changes do you think we should make in order to solve the problem?

We need to only setAutocompleteSubstitutions when the updatedSubstitutionsMap is not empty.
We need to make the changes here:

App/src/components/Search/SearchPageHeader/SearchPageHeaderInput.tsx

Lines 158 to 160 in 409e68e

	if (!isEqual(autocompleteSubstitutions, updatedSubstitutionsMap)) {
	setAutocompleteSubstitutions(updatedSubstitutionsMap);
	}

import isEmpty from 'lodash/isEmpty';

if (!isEqual(autocompleteSubstitutions, updatedSubstitutionsMap) && !isEmpty(updatedSubstitutionsMap)) {
                setAutocompleteSubstitutions(updatedSubstitutionsMap);
            }

What specific scenarios should we cover in automated tests to prevent reintroducing this issue in the future?

N/A UI issue

What alternative solutions did you explore? (Optional)

Reminder: Please use plain English, be brief and avoid jargon. Feel free to use images, charts or pseudo-code if necessary. Do not post large multi-line diffs or write walls of text. Do not create PRs unless you have been hired for this job.

[melvin-bot]

@zanyrenney Huh... This is 4 days overdue. Who can take care of this?

[melvin-bot]

Job added to Upwork: https://www.upwork.com/jobs/~021928080421938997312

[melvin-bot]

Triggered auto assignment to Contributor-plus team member for initial proposal review - @ikevin127 (External)