[PAY 15th SEP][$250] Member names in member selection views are not bold or using correct text color and styles

[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:
Reproducible in staging?: Needs reproduction
Reproducible in production?: Needs reproduction
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: @shawnborton
Slack conversation: https://expensify.slack.com/archives/C049HHMV9SM/p1724943353451769

Action Performed:

1. Go to staging.new.expensify.com
2. Initiate an IOU

Expected Result:

Member names in member selection views are bold and using correct text color and styles

Actual Result:

Member names in member selection views are not bold or using correct text color and styles

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

View all open jobs on GitHub

Upwork Automation - Do Not Edit

• Upwork Job URL: https://www.upwork.com/jobs/~0159f84c9f700169cc
• Upwork Job ID: 1830998979182407156
• Last Price Increase: 2024-09-03

Issue Owner

Current Issue Owner: @jayeshmangwani

[melvin-bot]

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

[MelvinBot]

This has been labelled "Needs Reproduction". Follow the steps here: https://stackoverflowteams.com/c/expensify/questions/16989

[FitseTLT]

@shawnborton the option will be bold when the report linked to it is unread. This is intentional. If I have understood the issue. 🤷

[bernhardoj]

Proposal

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

The money request participant title isn't using bold style.

What is the root cause of that problem?

The title text will be bold if the isBold property of the item is not false.

App/src/components/SelectionList/InviteMemberListItem.tsx

Line 101 in 117b961

item.isBold !== false && styles.sidebarLinkTextBold,

The isBold logic was first added in #37306 and we want all list by default has a bold text, except for LHN and chat finder page where it will be bold based on the unread status.

Previously, isBold was only added to ChatFinderPage list, but now, we added it to all lists by adding it in getOptions.

App/src/libs/OptionsListUtils.ts

Line 1968 in 117b961

reportOption.isBold = shouldUseBoldText(reportOption);

So, all user lists will follow the LHN unread logic to bold the title, including personal details which don't have an unread status, so it will always be false.

App/src/libs/OptionsListUtils.ts

Line 1992 in 117b961

personalDetailOption.isBold = shouldUseBoldText(personalDetailOption);

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

We can add a new param to getOptions called shouldBoldTitleByDefault which has a default value of true. Then, pass it as false from getSearchOptions.

The new isBold condition will be.

reportOption.isBold = shouldBoldTitleByDefault || shouldUseBoldText(reportOption);

We can do the same for the personal details, but since shouldUseBoldText is always false for personal detail, we can just simplify the condition to:

App/src/libs/OptionsListUtils.ts

Line 1992 in 117b961

personalDetailOption.isBold = shouldUseBoldText(personalDetailOption);

personalDetailOption.isBold = shouldBoldTitleByDefault;

Or just remove it so personal detail will always be in bold just like before in #37306, even in chat finder page.

[shawnborton]

the option will be bold when the report linked to it is unread. This is intentional. If I have understood the issue. 🤷

I think this is a bug. We only want the read/unread styles to be applied when you use the Find chat page. Otherwise any time we just list out members/contacts, the names should be bold and in our normal text color. cc @Expensify/design @trjExpensify @JmillsExpensify for the gut check there.

[dannymcclain]

@shawnborton definitely agree.

[trjExpensify]

We only want the read/unread styles to be applied when you use the Find chat page

why do I have a recollection that we decided to not use bold for unread at all on this page, did we walk back from that? 🤔

[shawnborton]

I feel like I recall a similar conversation but I had the same exact opinion/feedback as I do today and I could have sworn we implemented it correctly, hence why I was pretty convinced this was a regression.