LHN - #admin room LHN displays ["] instead of ["] after changing WS name

[mitarachim]

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.2.96-1
Reproducible in staging?: Yes
Reproducible in production?: Yes
If this was caught during regression testing, add the test name, ID and link from BrowserStack: #78467
Email or phone of affected tester (no customers): bawhah@gmail.com
Issue reported by: Applause Internal Team
Bug source: Pull Request QA execution
Device used: iPhone 13 / iOS 18.5
App Component: Left Hand Navigation (LHN)

Action Performed:

Preconditions: logged in to any account

1. Create a new workspace or use an existing one
2. Change the workspace name 2 or 3 times (it's recommended to change the workspace to only 1 letter to make the changelog message text preview of #admin room displayed in LHN
3. Navigate to LHN and observe the message displayed in #admin room
4. Note that the quotation mark ["] displayed as ["]
5. Open the #admin room, the message displays the correct quotation mark (")

Expected Result:

in step 4, the #admin room LHN displays the correct quotation mark ["] just like the actual of the message

Actual Result:

in step 4, #admin room LHN displays ["] instead of ["] after changing WS name

Workaround:

Unknown

Platforms:

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

Screenshots/Videos

Bug7043947_1767901516322.lhn_admin.mp4

View all open jobs on GitHub

[melvin-bot]

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

[daledah]

Proposal

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

in step 4, #admin room LHN displays ["] instead of ["] after changing WS name

What is the root cause of that problem?

The getWorkspaceNameUpdatedMessage() function in ReportUtils.ts encodes the message using Str.htmlEncode(), converting " to ". When displayed in the full chat view, ReportActionItemBasicMessage component properly decodes it using Str.htmlDecode(). However, in the LHN preview, the message goes through getTextFromHtml() which only calls Parser.htmlToText() but doesn't decode HTML entities, leaving " as-is

App/src/libs/ReportActionsUtils.ts

Lines 1729 to 1731 in 1769b5d

	function getTextFromHtml(html?: string): string {
	return html ? Parser.htmlToText(html) : '';
	}

App/src/libs/ReportUtils.ts

Lines 6865 to 6870 in 1769b5d

	function getWorkspaceNameUpdatedMessage(action: ReportAction) {
	const {oldName, newName} = getOriginalMessage(action as ReportAction<typeof CONST.REPORT.ACTIONS.TYPE.POLICY_CHANGE_LOG.UPDATE_NAME>) ?? {};
	// eslint-disable-next-line @typescript-eslint/no-deprecated
	const message = oldName && newName ? translateLocal('workspaceActions.renamedWorkspaceNameAction', {oldName, newName}) : getReportActionText(action);
	return Str.htmlEncode(message);
	}

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

Update the getTextFromHtml function to

  function getTextFromHtml(html?: string): string {
      return html ? Str.htmlDecode(Parser.htmlToText(html)) : '';
  }

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.

[nkdengineer]

Proposal

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

in step 4, #admin room LHN displays ["] instead of ["] after changing WS name

What is the root cause of that problem?

We don't decode the workspace name message here

App/src/libs/SidebarUtils.ts

Line 847 in 1769b5d

result.alternateText = getWorkspaceNameUpdatedMessage(lastAction);

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

We should decode this message and check other places use getWorkspaceNameUpdatedMessage if it has the same problem

result.alternateText = Str.htmlDecode(getWorkspaceNameUpdatedMessage(lastAction));

App/src/libs/SidebarUtils.ts

Line 847 in 1769b5d

result.alternateText = getWorkspaceNameUpdatedMessage(lastAction);

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.

[samranahm]

Proposal

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

When a workspace name is changed, the #admin room displays a changelog message. In the LHN (Left Hand Navigation), the preview of this message shows HTML entities like " instead of the actual quotation mark ". However, when the #admin room is opened, the message displays correctly with proper quotation marks.

What is the root cause of that problem?

When workspace names are renamed, the backend sends the RENAMED report action with oldName and newName fields in the originalMessage that contain HTML-encoded entities (e.g., " instead of ").

The flow is as follows:

1. When the workspace is renamed, a RENAMED report action is created with originalMessage.oldName and originalMessage.newName containing the workspace names
2. In getRenamedAction, these values are used directly in the translation:

   function getRenamedAction(...) {
       const originalMessage = getOriginalMessage(reportAction);
       return translate('newRoomPage.renamedRoomAction', {
           actorName,
           isExpenseReport,
           oldName: originalMessage?.oldName ?? '',  // contain "
           newName: originalMessage?.newName ?? '',  // contain "
       });
   }

3. This creates a string like: renamed to ""New Name"" (previously ""Old Name"")
4. In SidebarUtils, this string is assigned to result.alternateText
5. In OptionRowLHN, optionItem.alternateText is rendered directly in a <Text> component without decoding HTML entities

The actual room message displays correctly because it goes through different rendering logic that properly decodes HTML.

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

We should decode HTML entities from oldName and newName in the getRenamedAction function before using them in the translation.

In src/libs/ReportActionsUtils.ts, update the getRenamedAction function to decode HTML entities:

function getRenamedAction(translate: LocalizedTranslate, reportAction: OnyxEntry<ReportAction<typeof CONST.REPORT.ACTIONS.TYPE.RENAMED>>, isExpenseReport: boolean, actorName?: string) {
    const originalMessage = getOriginalMessage(reportAction);
    return translate('newRoomPage.renamedRoomAction', {
        actorName,
        isExpenseReport,
        oldName: Parser.htmlToText(originalMessage?.oldName ?? ''),
        newName: Parser.htmlToText(originalMessage?.newName ?? ''),
    });
}

This will ensure that HTML entities like " are properly decoded to " before being displayed in the LHN.

What alternative solutions did you explore? (Optional)

N/A

[melvin-bot]

@CortneyOfstad Whoops! This issue is 2 days overdue. Let's get this updated quick!

[CortneyOfstad]

Based on step 2 alone – this is an edge case. Customers are not changing the name of the workspace name multiple times in such a short amount of time, so closing this out.