Skip to content

Fix last message text in LHN is not shown correctly #70777

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
pecanoro merged 3 commits into from
Sep 25, 2025
Merged

Fix last message text in LHN is not shown correctly #70777

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
806a0ad
show last message text as it is
bernhardoj Sep 18, 2025
bf18b35
fix some last message shows in html tag when it shouldn't be
bernhardoj Sep 18, 2025
e4736d9
Merge branch 'main' into fix/60746-msg-is-not-shown-correctly
bernhardoj Sep 23, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 2 additions & 3 deletions src/components/LHNOptionsList/OptionRowLHN.tsx
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,6 @@ import DateUtils from '@libs/DateUtils';
import DomUtils from '@libs/DomUtils';
import {containsCustomEmoji as containsCustomEmojiUtils, containsOnlyCustomEmoji} from '@libs/EmojiUtils';
import {shouldOptionShowTooltip, shouldUseBoldText} from '@libs/OptionsListUtils';
import Parser from '@libs/Parser';
import Performance from '@libs/Performance';
import ReportActionComposeFocusManager from '@libs/ReportActionComposeFocusManager';
import {isAdminRoom, isChatUsedForOnboarding as isChatUsedForOnboardingReportUtils, isConciergeChatReport, isGroupChat, isOneOnOneChat, isSystemChat} from '@libs/ReportUtils';
Expand Down Expand Up @@ -296,12 +295,12 @@ function OptionRowLHN({
>
{alternateTextContainsCustomEmojiWithText ? (
<TextWithEmojiFragment
message={Parser.htmlToText(optionItem.alternateText)}
message={optionItem.alternateText}
style={[alternateTextStyle, styles.mh0]}
alignCustomEmoji
/>
) : (
Parser.htmlToText(optionItem.alternateText)
optionItem.alternateText
)}
</Text>
)}
Expand Down
14 changes: 7 additions & 7 deletions src/libs/OptionsListUtils/index.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -183,7 +183,7 @@
*/
let currentUserLogin: string | undefined;
let currentUserAccountID: number | undefined;
Onyx.connect({

Check warning on line 186 in src/libs/OptionsListUtils/index.ts

View workflow job for this annotation

GitHub Actions / Changed files ESLint check 

Onyx.connect() is deprecated. Use useOnyx() hook instead and pass the data as parameters to a pure function
key: ONYXKEYS.SESSION,
callback: (value) => {
currentUserLogin = value?.email;
Expand All @@ -192,19 +192,19 @@
});

let loginList: OnyxEntry<Login>;
Onyx.connect({

Check warning on line 195 in src/libs/OptionsListUtils/index.ts

View workflow job for this annotation

GitHub Actions / Changed files ESLint check 

Onyx.connect() is deprecated. Use useOnyx() hook instead and pass the data as parameters to a pure function
key: ONYXKEYS.LOGIN_LIST,
callback: (value) => (loginList = isEmptyObject(value) ? {} : value),
});

let allPersonalDetails: OnyxEntry<PersonalDetailsList>;
Onyx.connect({

Check warning on line 201 in src/libs/OptionsListUtils/index.ts

View workflow job for this annotation

GitHub Actions / Changed files ESLint check 

Onyx.connect() is deprecated. Use useOnyx() hook instead and pass the data as parameters to a pure function
key: ONYXKEYS.PERSONAL_DETAILS_LIST,
callback: (value) => (allPersonalDetails = isEmptyObject(value) ? {} : value),
});

const policies: OnyxCollection<Policy> = {};
Onyx.connect({

Check warning on line 207 in src/libs/OptionsListUtils/index.ts

View workflow job for this annotation

GitHub Actions / Changed files ESLint check 

Onyx.connect() is deprecated. Use useOnyx() hook instead and pass the data as parameters to a pure function
key: ONYXKEYS.COLLECTION.POLICY,
callback: (policy, key) => {
if (!policy || !key || !policy.name) {
Expand All @@ -216,14 +216,14 @@
});

let allPolicies: OnyxCollection<Policy> = {};
Onyx.connect({

Check warning on line 219 in src/libs/OptionsListUtils/index.ts

View workflow job for this annotation

GitHub Actions / Changed files ESLint check 

Onyx.connect() is deprecated. Use useOnyx() hook instead and pass the data as parameters to a pure function
key: ONYXKEYS.COLLECTION.POLICY,
waitForCollectionCallback: true,
callback: (val) => (allPolicies = val),
});

let allReports: OnyxCollection<Report>;
Onyx.connect({

Check warning on line 226 in src/libs/OptionsListUtils/index.ts

View workflow job for this annotation

GitHub Actions / Changed files ESLint check 

Onyx.connect() is deprecated. Use useOnyx() hook instead and pass the data as parameters to a pure function
key: ONYXKEYS.COLLECTION.REPORT,
waitForCollectionCallback: true,
callback: (value) => {
Expand All @@ -232,7 +232,7 @@
});

let allReportNameValuePairs: OnyxCollection<ReportNameValuePairs>;
Onyx.connect({

Check warning on line 235 in src/libs/OptionsListUtils/index.ts

View workflow job for this annotation

GitHub Actions / Changed files ESLint check 

Onyx.connect() is deprecated. Use useOnyx() hook instead and pass the data as parameters to a pure function
key: ONYXKEYS.COLLECTION.REPORT_NAME_VALUE_PAIRS,
waitForCollectionCallback: true,
callback: (value) => {
Expand All @@ -244,7 +244,7 @@
const allSortedReportActions: Record<string, ReportAction[]> = {};
let allReportActions: OnyxCollection<ReportActions>;
const lastVisibleReportActions: ReportActions = {};
Onyx.connect({

Check warning on line 247 in src/libs/OptionsListUtils/index.ts

View workflow job for this annotation

GitHub Actions / Changed files ESLint check 

Onyx.connect() is deprecated. Use useOnyx() hook instead and pass the data as parameters to a pure function
key: ONYXKEYS.COLLECTION.REPORT_ACTIONS,
waitForCollectionCallback: true,
callback: (actions) => {
Expand Down Expand Up @@ -303,13 +303,13 @@
});

let activePolicyID: OnyxEntry<string>;
Onyx.connect({

Check warning on line 306 in src/libs/OptionsListUtils/index.ts

View workflow job for this annotation

GitHub Actions / Changed files ESLint check 

Onyx.connect() is deprecated. Use useOnyx() hook instead and pass the data as parameters to a pure function
key: ONYXKEYS.NVP_ACTIVE_POLICY_ID,
callback: (value) => (activePolicyID = value),
});

let nvpDismissedProductTraining: OnyxEntry<DismissedProductTraining>;
Onyx.connect({

Check warning on line 312 in src/libs/OptionsListUtils/index.ts

View workflow job for this annotation

GitHub Actions / Changed files ESLint check 

Onyx.connect() is deprecated. Use useOnyx() hook instead and pass the data as parameters to a pure function
key: ONYXKEYS.NVP_DISMISSED_PRODUCT_TRAINING,
callback: (value) => (nvpDismissedProductTraining = value),
});
Expand Down Expand Up @@ -454,7 +454,7 @@
const isAnnounceRoom = reportUtilsIsAnnounceRoom(report);
const isGroupChat = reportUtilsIsGroupChat(report);
const isExpenseThread = isMoneyRequest(report);
const formattedLastMessageText = formatReportLastMessageText(Parser.htmlToText(option.lastMessageText ?? ''));
const formattedLastMessageText = formatReportLastMessageText(option.lastMessageText ?? '');
const reportPrefix = getReportSubtitlePrefix(report);
const formattedLastMessageTextWithPrefix = reportPrefix + formattedLastMessageText;

Expand Down Expand Up @@ -636,7 +636,7 @@
const movedTransactionOriginalMessage = getOriginalMessage(lastReportAction) ?? {};
const {toReportID} = movedTransactionOriginalMessage as OriginalMessageMovedTransaction;
const toReport = allReports?.[`${ONYXKEYS.COLLECTION.REPORT}${toReportID}`];
lastMessageTextFromReport = getMovedTransactionMessage(toReport);
lastMessageTextFromReport = Parser.htmlToText(getMovedTransactionMessage(toReport));
} else if (isTaskAction(lastReportAction)) {
lastMessageTextFromReport = formatReportLastMessageText(getTaskReportActionMessage(lastReportAction).text);
} else if (isCreatedTaskReportAction(lastReportAction)) {
Expand All @@ -648,14 +648,14 @@
) {
const wasSubmittedViaHarvesting = !isMarkAsClosedAction(lastReportAction) ? (getOriginalMessage(lastReportAction)?.harvesting ?? false) : false;
if (wasSubmittedViaHarvesting) {
lastMessageTextFromReport = translateLocal('iou.automaticallySubmitted');
lastMessageTextFromReport = Parser.htmlToText(translateLocal('iou.automaticallySubmitted'));
} else {
lastMessageTextFromReport = translateLocal('iou.submitted', {memo: getOriginalMessage(lastReportAction)?.message});
}
} else if (isActionOfType(lastReportAction, CONST.REPORT.ACTIONS.TYPE.APPROVED)) {
const {automaticAction} = getOriginalMessage(lastReportAction) ?? {};
if (automaticAction) {
lastMessageTextFromReport = translateLocal('iou.automaticallyApproved');
lastMessageTextFromReport = Parser.htmlToText(translateLocal('iou.automaticallyApproved'));
} else {
lastMessageTextFromReport = translateLocal('iou.approvedMessage');
}
Expand All @@ -664,7 +664,7 @@
} else if (isActionOfType(lastReportAction, CONST.REPORT.ACTIONS.TYPE.FORWARDED)) {
const {automaticAction} = getOriginalMessage(lastReportAction) ?? {};
if (automaticAction) {
lastMessageTextFromReport = translateLocal('iou.automaticallyForwarded');
lastMessageTextFromReport = Parser.htmlToText(translateLocal('iou.automaticallyForwarded'));
} else {
lastMessageTextFromReport = translateLocal('iou.forwarded');
}
Expand Down Expand Up @@ -705,9 +705,9 @@
} else if (isActionOfType(lastReportAction, CONST.REPORT.ACTIONS.TYPE.DELETED_TRANSACTION)) {
lastMessageTextFromReport = getDeletedTransactionMessage(lastReportAction);
} else if (isActionOfType(lastReportAction, CONST.REPORT.ACTIONS.TYPE.TAKE_CONTROL) || isActionOfType(lastReportAction, CONST.REPORT.ACTIONS.TYPE.REROUTE)) {
lastMessageTextFromReport = getChangedApproverActionMessage(lastReportAction);
lastMessageTextFromReport = Parser.htmlToText(getChangedApproverActionMessage(lastReportAction));
} else if (isMovedAction(lastReportAction)) {
lastMessageTextFromReport = getMovedActionMessage(lastReportAction, report);
lastMessageTextFromReport = Parser.htmlToText(getMovedActionMessage(lastReportAction, report));
}

// we do not want to show report closed in LHN for non archived report so use getReportLastMessage as fallback instead of lastMessageText from report
Expand Down
12 changes: 6 additions & 6 deletions src/libs/SidebarUtils.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -793,7 +793,7 @@ function getOptionData({
} else if (isActionOfType(lastAction, CONST.REPORT.ACTIONS.TYPE.POLICY_CHANGE_LOG.TEAM_DOWNGRADE)) {
result.alternateText = translateLocal('workspaceActions.downgradedWorkspace');
} else if (isActionOfType(lastAction, CONST.REPORT.ACTIONS.TYPE.INTEGRATION_SYNC_FAILED)) {
result.alternateText = getIntegrationSyncFailedMessage(lastAction, report?.policyID);
result.alternateText = Parser.htmlToText(getIntegrationSyncFailedMessage(lastAction, report?.policyID));

@QichenZhu QichenZhu Sep 22, 2025

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

How can we be confident that we've handled all branches that can produce HTML entities?

@bernhardoj bernhardoj Sep 22, 2025

Copy link
Copy Markdown
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

That's the thing that I can't guarantee 100%, but I've tried to look at all cases, translation that is being use,d and add Parser.htmlToText if it contains HTML markdown. If there is a case missed, we can quickly raise another PR to fix it. (I don't think it's a severe issue though when it happens)

} else if (
isActionOfType(lastAction, CONST.REPORT.ACTIONS.TYPE.POLICY_CHANGE_LOG.ADD_CATEGORY) ||
isActionOfType(lastAction, CONST.REPORT.ACTIONS.TYPE.POLICY_CHANGE_LOG.DELETE_CATEGORY) ||
Expand Down Expand Up @@ -836,7 +836,7 @@ function getOptionData({
} else if (isCardIssuedAction(lastAction)) {
result.alternateText = getCardIssuedMessage({reportAction: lastAction, expensifyCard: card});
} else if (lastAction?.actionName !== CONST.REPORT.ACTIONS.TYPE.REPORT_PREVIEW && lastActorDisplayName && lastMessageTextFromReport) {
result.alternateText = formatReportLastMessageText(Parser.htmlToText(`${lastActorDisplayName}: ${lastMessageText}`));
result.alternateText = formatReportLastMessageText(`${lastActorDisplayName}: ${lastMessageText}`);
} else if (lastAction && isOldDotReportAction(lastAction)) {
result.alternateText = getMessageOfOldDotReportAction(lastAction);
} else if (lastAction?.actionName === CONST.REPORT.ACTIONS.TYPE.ROOM_CHANGE_LOG.UPDATE_ROOM_DESCRIPTION) {
Expand All @@ -848,7 +848,7 @@ function getOptionData({
} else if (lastAction?.actionName === CONST.REPORT.ACTIONS.TYPE.POLICY_CHANGE_LOG.DELETE_EMPLOYEE) {
result.alternateText = getPolicyChangeLogDeleteMemberMessage(lastAction);
} else if (isActionOfType(lastAction, CONST.REPORT.ACTIONS.TYPE.UNREPORTED_TRANSACTION)) {
result.alternateText = getUnreportedTransactionMessage();
result.alternateText = Parser.htmlToText(getUnreportedTransactionMessage());
} else if (lastAction?.actionName === CONST.REPORT.ACTIONS.TYPE.POLICY_CHANGE_LOG.DELETE_CUSTOM_UNIT_RATE) {
result.alternateText = getReportActionMessageText(lastAction) ?? '';
} else if (lastAction?.actionName === CONST.REPORT.ACTIONS.TYPE.POLICY_CHANGE_LOG.ADD_INTEGRATION) {
Expand All @@ -872,7 +872,7 @@ function getOptionData({
} else if (isActionOfType(lastAction, CONST.REPORT.ACTIONS.TYPE.TRAVEL_UPDATE)) {
result.alternateText = getTravelUpdateMessage(lastAction);
} else if (isActionOfType(lastAction, CONST.REPORT.ACTIONS.TYPE.TAKE_CONTROL) || isActionOfType(lastAction, CONST.REPORT.ACTIONS.TYPE.REROUTE)) {
result.alternateText = getChangedApproverActionMessage(lastAction);
result.alternateText = Parser.htmlToText(getChangedApproverActionMessage(lastAction));
} else {
result.alternateText =
lastMessageTextFromReport.length > 0
Expand All @@ -894,9 +894,9 @@ function getOptionData({
);
}
if (shouldShowLastActorDisplayName(report, lastActorDetails, lastAction) && !isReportArchived) {
result.alternateText = `${lastActorDisplayName}: ${formatReportLastMessageText(Parser.htmlToText(lastMessageText))}`;
result.alternateText = `${lastActorDisplayName}: ${formatReportLastMessageText(lastMessageText)}`;
} else {
result.alternateText = formatReportLastMessageText(Parser.htmlToText(lastMessageText));
result.alternateText = formatReportLastMessageText(lastMessageText);
}
}

Expand Down
Loading