[HOLD for Payment 2024-10-04][$250] [Search v2.3] - Default name in name field displays user/report ID instead of user/report name

[lanitochka17]

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.40-0
Reproducible in staging?: Y
Reproducible in production?: N
If this was caught during regression testing, add the test name, ID and link from TestRail: N/A
Email or phone of affected tester (no customers): applausetester+kh230901@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 To
5. Select a user and save it
6. Click Save search
7. Click 3-dot menu next to the saved search
8. Click Rename

Expected Result:

The default name in search name field will display user name instead of user ID

Actual Result:

The default name in search name field displays user ID instead of user name
The same goes for report ID when In filter is used for chat

Workaround:

Unknown

Platforms:

Which of our officially supported platforms is this issue occurring on?

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

Screenshots/Videos

Add any screenshot/video evidence

Bug6615159_1727291077447.ID.mp4

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~021839048305434680628
• Upwork Job ID: 1839048305434680628
• Last Price Increase: 2024-09-25
• Automatic offers:
• rayane-djouah | Reviewer | 104132486
• Nodebrute | Contributor | 104132487

Issue Owner

Current Issue Owner: @rayane-djouah

[melvin-bot]

Triggered auto assignment to @stitesExpensify (DeployBlockerCash), see https://stackoverflowteams.com/c/expensify/questions/9980/ for more details.

[github-actions]

👋 Friendly reminder that deploy blockers are time-sensitive ⏱ issues! Check out the open `StagingDeployCash` deploy checklist to see the list of PRs included in this release, then work quickly to do one of the following:

1. Identify the pull request that introduced this issue and revert it.
2. Find someone who can quickly fix the issue.
3. Fix the issue yourself.

[lanitochka17]

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

[Nodebrute]

Edited by proposal-police: This proposal was edited at 2024-09-25 21:41:18 UTC.

Proposal

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

Default name in name field displays user/report ID instead of user/report name

What is the root cause of that problem?

Here we are using title to convert reportID/userID to their names

App/src/pages/Search/SearchTypeMenu.tsx

Lines 103 to 108 in 55b1e32

	let title = item.name;
	if (title === item.query) {
	const jsonQuery = SearchUtils.buildSearchQueryJSON(item.query) ?? ({} as SearchQueryJSON);
	title = SearchUtils.getSearchHeaderTitle(jsonQuery, personalDetails, cardList, reports, taxRates);
	}

But here we are passing item.name without updating it

App/src/pages/Search/SearchTypeMenu.tsx

Line 120 in 55b1e32

rightComponent: <SavedSearchItemThreeDotMenu menuItems={getOverflowMenu(item.name, Number(key), item.query)} />,

We then use this item.name here to navigate to rename page

App/src/libs/SearchUtils.ts

Line 787 in 6a9ba21

Navigation.navigate(ROUTES.SEARCH_SAVED_SEARCH_RENAME.getRoute({name: itemName, jsonQuery: inputQuery}));

and Then, on the Rename page, we get this name from the route. Since we haven't passed the updated title, we’ll see userID/ReportID instead of their names.

App/src/pages/Search/SavedSearchRenamePage.tsx

Line 19 in 6a9ba21

function SavedSearchRenamePage({route}: {route: {params: {q: string; name: string}}}) {

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

We should pass title here instead of item.name

App/src/pages/Search/SearchTypeMenu.tsx

Line 120 in 55b1e32

rightComponent: <SavedSearchItemThreeDotMenu menuItems={getOverflowMenu(item.name, Number(key), item.query)} />,

We should check for other places too where we have this issue

What alternative solutions did you explore? (Optional)

[daledah]

Proposal

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

The default name in search name field displays user ID instead of user name
The same goes for report ID when In filter is used for chat

What is the root cause of that problem?

Currently we are getting name directly from query when there is no name here

App/src/pages/Search/SavedSearchRenamePage.tsx

Lines 22 to 23 in 912c330

	const {q, name} = route.params;
	const [newName, setNewName] = useState(name);

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

We should convert from query to name like we did here

    useEffect(()=>{
        if(name === q){
            const jsonQuery = SearchUtils.buildSearchQueryJSON(q) ?? ({} as SearchQueryJSON);
            const title = SearchUtils.getSearchHeaderTitle(jsonQuery, personalDetails, cardList, reports, taxRates);
            setNewName(title)
        }
    },[name])

and need to update the default value to newName

  defaultValue={newName}

App/src/pages/Search/SavedSearchRenamePage.tsx

Line 68 in 912c330

defaultValue={name}

What alternative solutions did you explore? (Optional)

NA

[Nodebrute]

Proposal Updated
Fixed link previews

[neonbhai]

Proposal

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

Default name in name field displays user/report ID instead of user/report name

What is the root cause of that problem?

We don't pass the updated item title for getOverflowMenu here:

App/src/pages/Search/SearchTypeMenu.tsx

Line 120 in a4a344b

rightComponent: <SavedSearchItemThreeDotMenu menuItems={getOverflowMenu(item.name, Number(key), item.query)} />,

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

We should pass the updated title to :

rightComponent: <SavedSearchItemThreeDotMenu menuItems={getOverflowMenu(title, Number(key), item.query)} />,\

Note: This bug does not occur for small screen devices as we pass it correctly here.

Result

This works perfectly:

Screen.Recording.2024-09-26.at.1.50.57.AM.mov