[AWAITING CHECKLIST] [HOLD for payment 2024-12-12] [$250] Search-Order of the words is reversed when the query is submitted

[IuliiaHerets]

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: v9.0.58-2
Reproducible in staging?: Y
Reproducible in production?: Y
Issue reported by: Applause Internal Team

Action Performed:

1. Navigate to the Search page.
2. Click on the search bar icon to open the search field.
3. Enter any search query and press the Enter key to submit the query.

Expected Result:

The order of the words remains without changes when the query is submitted.

Actual Result:

The order of the words is reversed when the query is submitted.

Workaround:

Unknown

Platforms:

• Android: Standalone
• Android: HybridApp
• Android: mWeb Chrome
• iOS: Standalone
• iOS: HybridApp
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Bug6656086_1730861572948.51314-Web.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021854577953623256419
• Upwork Job ID: 1854577953623256419
• Last Price Increase: 2024-11-21
• Automatic offers:
• Tony-MK | Contributor | 105099831

Issue Owner

Current Issue Owner: @garrettmknight

[melvin-bot]

Triggered auto assignment to @garrettmknight (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.

[melvin-bot]

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

[melvin-bot]

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

[Tony-MK]

Edited by proposal-police: This proposal was edited at 2024-11-13 10:36:52 UTC.

Proposal

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

Search-Order of the words is reversed when the query is submitted.

What is the root cause of that problem?

The SearchPage uses the SearchQueryUtils.buildSearchQueryJSON function to build a query.

App/src/pages/Search/SearchPage.tsx

Lines 21 to 23 in b5c2c73

	const {q} = route.params;
	const queryJSON = useMemo(() => SearchQueryUtils.buildSearchQueryJSON(q), [q]);

However, we end up sorting the query.flatFilters which are the keywords by alphabetical order when calling the getQueryHashes function.

This is because a consistent hash function is needed.

App/src/libs/SearchQueryUtils.ts

Lines 272 to 274 in 494211d

	result.flatFilters = flatFilters;
	const {primaryHash, recentSearchHash} = getQueryHashes(result);
	result.hash = primaryHash;

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

Instead of sorting the original query.flatFilters array inplace, we should create a new array where we sort the query.flatFilters.

Also, instead of using forEach we can map the query.flatFilters to a function so the original array is not mutated and orderedQuery parsed.

Optionally, I believe it is unnecessary to have two code snippets where we modify the query.flatFilters, seen below, to make orderedQuery so let's join the two code snippets into one.

App/src/libs/SearchQueryUtils.ts

Lines 238 to 240 in 494211d

	query.flatFilters.forEach((filter) => {
	filter.filters.sort((a, b) => localeCompare(a.value.toString(), b.value.toString()));
	});

App/src/libs/SearchQueryUtils.ts

Lines 242 to 245 in c24d217

	query.flatFilters
	.map((filter) => buildFilterValuesString(filter.key, filter.filters))
	.sort()
	.forEach((filterString) => (orderedQuery += ` ${filterString}`));

[nkdengineer]

Proposal

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

The order of the words is reversed when the query is submitted.

What is the root cause of that problem?

Here is the function that we use to get the hash query. We have two sort functions here

App/src/libs/SearchQueryUtils.ts

Line 233 in 494211d

function getQueryHashes(query: SearchQueryJSON): {primaryHash: number; recentSearchHash: number} {

The first one is used to sort all values in a filters of a filter

App/src/libs/SearchQueryUtils.ts

Lines 238 to 241 in 494211d

	query.flatFilters.forEach((filter) => {
	filter.filters.sort((a, b) => localeCompare(a.value.toString(), b.value.toString()));
	});

The second one is used to sort all filters by key

App/src/libs/SearchQueryUtils.ts

Lines 242 to 245 in 494211d

	query.flatFilters
	.map((filter) => buildFilterValuesString(filter.key, filter.filters))
	.sort()
	.forEach((filterString) => (orderedQuery += ` ${filterString}`));

For the case of this issue Test and G are in the same filter with the key being keyword then it's sorted by the first function

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

I think for the keyword key filter, we should keep the order of all values. We can skip the sort function here if the key is keyword

query.flatFilters.forEach((filter) => {
    if (filter.key === 'keyword') {
        return;
    }
    filter.filters.sort((a, b) => localeCompare(a.value.toString(), b.value.toString()));
});

App/src/libs/SearchQueryUtils.ts

Lines 238 to 241 in 494211d

	query.flatFilters.forEach((filter) => {
	filter.filters.sort((a, b) => localeCompare(a.value.toString(), b.value.toString()));
	});

What alternative solutions did you explore? (Optional)

If we want to keep the order of all filters and all values of the filter we can remove these lines and the sort function here

[melvin-bot]

@garrettmknight, @rushatgabhane Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!