[HOLD for payment 2024-09-27][$125] [Search v2.1] - Selected categories are not arranged alphabetically in Category field

[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: 9.0.28-0
Reproducible in staging?: Y
Reproducible in production?: Y
Email or phone of affected tester (no customers): applausetester+kh010901@applause.expensifail.com
Issue reported by: Applause Internal Team

Action Performed:

1. Go to staging.new.expensify.com
2. Go to Search.
3. Click Filters.
4. Click Category.
5. Randomly select a few categories.
6. Click Save.

Expected Result:

The selected categories will be arranged alphabetically in Category field.

Actual Result:

The selected categories are not arranged alphabetically in Category field.

Workaround:

Unknown

Platforms:

• Android: Native
• Android: mWeb Chrome
• iOS: Native
• iOS: mWeb Safari
• MacOS: Chrome / Safari
• MacOS: Desktop

Screenshots/Videos

Bug6591710_1725368473798.20240903_205902.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~016ce9ccc4019cea35
• Upwork Job ID: 1831045716418683547
• Last Price Increase: 2024-09-03
• Automatic offers:
• shubham1206agra | Reviewer | 103872397
• Tony-MK | Contributor | 103872399

Issue Owner

Current Issue Owner: @shubham1206agra

[melvin-bot]

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

[IuliiaHerets]

We think that this bug might be related to #wave-control

[IuliiaHerets]

@puneetlath FYI I haven't added the External label as I wasn't 100% sure about this issue. Please take a look and add the label if you agree it's a bug and can be handled by external contributors

[etCoderDysto]

Proposal

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

Search filters - Selected categories are not arranged alphabetically in Category field

What is the root cause of that problem?

On saving selected items, we are not sorting selected items before updating filter form with the selected items

App/src/pages/Search/SearchAdvancedFiltersPage/SearchFiltersCategoryPage.tsx

Line 34 in 2d1f8cd

const onSaveSelection = useCallback((values: string[]) => SearchActions.updateAdvancedFilters({category: values}), []);

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

We should sort the selected items first before updating filter form with the selected items

const onSaveSelection = useCallback((values: string[]) => SearchActions.updateAdvancedFilters({category: values.sort(localeCompare)}), [])

What alternative solutions did you explore? (Optional)

We can sort the selected items in SearchMultipleSelectionPicker, if we want to sort all fields on the filter page

onSaveSelection(
    selectedItems
           .sort((a, b) => localeCompare(a.name, b.name))
           .map((item) => item.value)
           .flat(),

App/src/components/Search/SearchMultipleSelectionPicker.tsx

Lines 88 to 90 in 2d1f8cd

	const handleConfirmSelection = useCallback(() => {
	onSaveSelection(selectedItems.map((item) => item.value).flat());
	Navigation.goBack(ROUTES.SEARCH_ADVANCED_FILTERS);

[Tony-MK]

Proposal

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

Search filters - Selected categories are not arranged alphabetically in Category field

What is the root cause of that problem?

We don't sort the filterArray in the getFilterDisplayTitle function.

App/src/pages/Search/AdvancedSearchFilters.tsx

Lines 175 to 180 in c885f96

	if (
	(fieldName === CONST.SEARCH.SYNTAX_FILTER_KEYS.CATEGORY || fieldName === CONST.SEARCH.SYNTAX_FILTER_KEYS.CURRENCY || fieldName === CONST.SEARCH.SYNTAX_FILTER_KEYS.TAG) &&
	filters[fieldName]
	) {
	const filterArray = filters[fieldName] ?? [];
	return filterArray.join(', ');

So, the text created from the categories will not be ordered

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

We should sort the categories in filterArray so the text will be sorted.

App/src/pages/Search/AdvancedSearchFilters.tsx

Line 180 in c885f96

return filterArray.join(', ');

return filterArray.sort(localeCompare).join(', ');

This change will also sort the currency and tag fields.

[melvin-bot]

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

[melvin-bot]

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

[puneetlath]

It's not really a bug, more of an improvement request. But we can go ahead and do it for $125.

[melvin-bot]

Upwork job price has been updated to $125

[shubham1206agra]

@puneetlath Do you also want to sort the currencies similarly?

[puneetlath]

Yes, I'd think we'd do it for any of the multi-select fields.

[shubham1206agra]

@Tony-MK Please update your proposal

[etCoderDysto]

@shubham1206agra can you please comment on my proposal #48496 (comment). My alternative solution covers sorting currency, and other fields. We can also repeat my main solution on currency pages and others.

[Tony-MK]

Proposal

Hi @shubham1206agra, I updated my proposal.

[shubham1206agra]

Let's go with @Tony-MK's proposal.

🎀👀🎀 C+ reviewed

[melvin-bot]

Current assignee @puneetlath is eligible for the choreEngineerContributorManagement assigner, not assigning anyone new.

[melvin-bot]

📣 @shubham1206agra 🎉 An offer has been automatically sent to your Upwork account for the Reviewer role 🎉 Thanks for contributing to the Expensify app!

Offer link
Upwork job

[melvin-bot]

📣 @Tony-MK 🎉 An offer has been automatically sent to your Upwork account for the Contributor role 🎉 Thanks for contributing to the Expensify app!

Offer link
Upwork job
Please accept the offer and leave a comment on the Github issue letting us know when we can expect a PR to be ready for review 🧑‍💻
Keep in mind: Code of Conduct | Contributing 📖

[melvin-bot]

@puneetlath, @Tony-MK, @shubham1206agra Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[shubham1206agra]

The PR was merged

[melvin-bot]

@puneetlath, @Tony-MK, @shubham1206agra Uh oh! This issue is overdue by 2 days. Don't forget to update your issues!

[puneetlath]

I've paid @Tony-MK. @shubham1206agra can you please complete the checklist?

[Tony-MK]

Hey @puneetlath, I believe you ended the Upwork contract but have not paid me yet.

Could you check on that, please?

[puneetlath]

Seems like a bug on Upwork's side as this has been reported multiple times now on contracts I closed yesterday. Very strange. Will report it to them.

In the meantime, I've add the payment as a bonus. Sorry about that!

[Tony-MK]

Thanks

[melvin-bot]

@puneetlath, @Tony-MK, @shubham1206agra 6 days overdue. This is scarier than being forced to listen to Vogon poetry!

[puneetlath]

@shubham1206agra just waiting on the checklist from you now so that I can pay you out.

[shubham1206agra]

BugZero Checklist: The PR fixing this issue has been merged! The following checklist (instructions) will need to be completed before the issue can be closed:

• [@shubham1206agra] The PR that introduced the bug has been identified. Link to the PR: advanced filters category #46197
• [@shubham1206agra] The offending PR has been commented on, pointing out the bug it caused and why, so the author and reviewers can learn from the mistake. Link to comment: https://github.com/Expensify/App/pull/46197/files#r1791537503
• [@shubham1206agra] A discussion in #expensify-bugs has been started about whether any other steps should be taken (e.g. updating the PR review checklist) in order to catch this type of bug sooner. Link to discussion: Not Required
• [@shubham1206agra] Determine if we should create a regression test for this bug. No
• [@shubham1206agra] If we decide to create a regression test for the bug, please propose the regression test steps to ensure the same bug will not reach production again.
• [@puneetlath] Link the GH issue for creating/updating the regression test once above steps have been agreed upon:

[puneetlath]

Why no regression test @shubham1206agra?

[shubham1206agra]

Since it was covered by other filters.

[puneetlath]

Ok cool. All paid. Thanks y'all!