From 69a08c0f6c01813f2f68ffc478ecdf55722506ea Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Bar=C4=B1=C5=9F=20Soner=20U=C5=9Fakl=C4=B1?=
 <barisusakli@gmail.com>
Date: Mon, 2 Dec 2024 10:38:21 -0500
Subject: [PATCH] feat: use displayname in chat teasers/userlist, in digest
 email

#12945
---
 public/src/client/chats/messages.js      | 2 +-
 src/messaging/index.js                   | 4 ++--
 src/views/emails/digest.tpl              | 8 ++++----
 src/views/partials/chats/message.tpl     | 2 +-
 src/views/partials/chats/room-teaser.tpl | 2 +-
 src/views/partials/chats/user-list.tpl   | 2 +-
 6 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/public/src/client/chats/messages.js b/public/src/client/chats/messages.js
index f1339c7562..8726f78914 100644
--- a/public/src/client/chats/messages.js
+++ b/public/src/client/chats/messages.js
@@ -181,7 +181,7 @@ define('forum/chats/messages', [
 		const replyToEl = composerEl.find('[component="chat/composer/replying-to"]');
 		replyToEl.attr('data-tomid', mid)
 			.find('[component="chat/composer/replying-to-text"]')
-			.translateText(`[[modules:chat.replying-to, ${msgEl.attr('data-username')}]]`);
+			.translateText(`[[modules:chat.replying-to, ${msgEl.attr('data-displayname')}]]`);
 		replyToEl.removeClass('hidden');
 		replyToEl.find('[component="chat/composer/replying-to-cancel"]').off('click')
 			.on('click', () => {
diff --git a/src/messaging/index.js b/src/messaging/index.js
index eda2bd4ac0..5bcda1c25a 100644
--- a/src/messaging/index.js
+++ b/src/messaging/index.js
@@ -233,7 +233,7 @@ Messaging.getRecentChats = async (callerUid, uid, start, stop) => {
 
 Messaging.generateUsernames = function (room, excludeUid) {
 	const users = room.users.filter(u => u && parseInt(u.uid, 10) !== excludeUid);
-	const usernames = users.map(u => u.username);
+	const usernames = users.map(u => u.displayname);
 	if (users.length > 3) {
 		return translator.compile(
 			'modules:chat.usernames-and-x-others',
@@ -246,7 +246,7 @@ Messaging.generateUsernames = function (room, excludeUid) {
 
 Messaging.generateChatWithMessage = async function (room, callerUid, userLang) {
 	const users = room.users.filter(u => u && parseInt(u.uid, 10) !== callerUid);
-	const usernames = users.map(u => `<a href="${relative_path}/uid/${u.uid}">${u.username}</a>`);
+	const usernames = users.map(u => `<a href="${relative_path}/uid/${u.uid}">${u.displayname}</a>`);
 	let compiled = '';
 	if (!users.length) {
 		return '[[modules:chat.no-users-in-room]]';
diff --git a/src/views/emails/digest.tpl b/src/views/emails/digest.tpl
index 849c112b7e..3cc21af00a 100644
--- a/src/views/emails/digest.tpl
+++ b/src/views/emails/digest.tpl
@@ -9,7 +9,7 @@
 			<table role="presentation" cellspacing="0" cellpadding="0" border="0" width="100%">
 				<tr>
 					<td style="padding: 40px 40px 6px 40px; font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol; font-size: 15px; line-height: 20px; color: #555555;">
-						<h1 style="margin: 0; font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol; font-size: 24px; line-height: 27px; color: #333333; font-weight: normal;">[[email:greeting-with-name, {username}]]</h1>
+						<h1 style="margin: 0; font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol; font-size: 24px; line-height: 27px; color: #333333; font-weight: normal;">[[email:greeting-with-name, {displayname}]]</h1>
 					</td>
 				</tr>
 				<tr>
@@ -75,7 +75,7 @@
 										<td style="padding: 6px 16px; font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol; width: 32px; vertical-align: middle;">{function.renderDigestAvatar}</td>
 										<td style="padding: 6px 16px; font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol; line-height: 16px; color: #333333;">
 											<p style="margin: 0;"><a style="text-decoration:none !important; text-decoration:none; color: #333333;" href="{url}/topic/{topTopics.slug}"><strong>{topTopics.title}</strong></a></p>
-											<p style="margin: 0; font-size: 12px;"><a style="text-decoration:none !important; text-decoration:none; color: #aaaaaa; line-height: 16px;" href="{url}/uid/{topTopics.teaser.user.uid}"><strong>{topTopics.teaser.user.username}</strong></a></p>
+											<p style="margin: 0; font-size: 12px;"><a style="text-decoration:none !important; text-decoration:none; color: #aaaaaa; line-height: 16px;" href="{url}/uid/{topTopics.teaser.user.uid}"><strong>{topTopics.teaser.user.displayname}</strong></a></p>
 										</td>
 									</tr>
 									<tr>
@@ -110,7 +110,7 @@
 										<td style="padding: 6px 16px; font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol; width: 32px; vertical-align: middle;">{function.renderDigestAvatar}</td>
 										<td style="padding: 6px 16px; font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol; line-height: 16px; color: #333333;">
 											<p style="margin: 0;"><a style="text-decoration:none !important; text-decoration:none; color: #333333;" href="{url}/topic/{popularTopics.slug}"><strong>{popularTopics.title}</strong></a></p>
-											<p style="margin: 0; font-size: 12px;"><a style="text-decoration:none !important; text-decoration:none; color: #aaaaaa; line-height: 16px;" href="{url}/uid/{popularTopics.teaser.user.uid}"><strong>{popularTopics.teaser.user.username}</strong></a></p>
+											<p style="margin: 0; font-size: 12px;"><a style="text-decoration:none !important; text-decoration:none; color: #aaaaaa; line-height: 16px;" href="{url}/uid/{popularTopics.teaser.user.uid}"><strong>{popularTopics.teaser.user.displayname}</strong></a></p>
 										</td>
 									</tr>
 									<tr>
@@ -145,7 +145,7 @@
 										<td style="padding: 6px 16px; font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol; width: 32px; vertical-align: middle;">{function.renderDigestAvatar}</td>
 										<td style="padding: 6px 16px; font-family: -apple-system,BlinkMacSystemFont,Segoe UI,Helvetica,Arial,sans-serif,Apple Color Emoji,Segoe UI Emoji,Segoe UI Symbol; line-height: 16px; color: #333333;">
 											<p style="margin: 0;"><a style="text-decoration:none !important; text-decoration:none; color: #333333;" href="{url}/topic/{recent.slug}"><strong>{recent.title}</strong></a></p>
-											<p style="margin: 0; font-size: 12px;"><a style="text-decoration:none !important; text-decoration:none; color: #aaaaaa; line-height: 16px;" href="{url}/uid/{recent.teaser.user.uid}"><strong>{recent.teaser.user.username}</strong></a></p>
+											<p style="margin: 0; font-size: 12px;"><a style="text-decoration:none !important; text-decoration:none; color: #aaaaaa; line-height: 16px;" href="{url}/uid/{recent.teaser.user.uid}"><strong>{recent.teaser.user.displayname}</strong></a></p>
 										</td>
 									</tr>
 									<tr>
diff --git a/src/views/partials/chats/message.tpl b/src/views/partials/chats/message.tpl
index 527a055f17..3d2e0ce122 100644
--- a/src/views/partials/chats/message.tpl
+++ b/src/views/partials/chats/message.tpl
@@ -1,4 +1,4 @@
-<li component="chat/message" class="chat-message mx-2 pe-2 {{{ if messages.deleted }}} deleted{{{ end }}} {{{ if messages.pinned}}} pinned{{{ end }}} {{{ if messages.newSet }}}border-top pt-3{{{ end }}}" data-mid="{messages.messageId}" data-uid="{messages.fromuid}" data-index="{messages.index}" data-self="{messages.self}" data-break="{messages.newSet}" data-timestamp="{messages.timestamp}" data-username="{messages.fromUser.username}">
+<li component="chat/message" class="chat-message mx-2 pe-2 {{{ if messages.deleted }}} deleted{{{ end }}} {{{ if messages.pinned}}} pinned{{{ end }}} {{{ if messages.newSet }}}border-top pt-3{{{ end }}}" data-mid="{messages.messageId}" data-uid="{messages.fromuid}" data-index="{messages.index}" data-self="{messages.self}" data-break="{messages.newSet}" data-timestamp="{messages.timestamp}" data-username="{messages.fromUser.username}" data-displayname="{messages.fromUser.displayname}">
 
 	{{{ if messages.parent }}}
 	<!-- IMPORT partials/chats/parent.tpl -->
diff --git a/src/views/partials/chats/room-teaser.tpl b/src/views/partials/chats/room-teaser.tpl
index ae7f53f251..ee5aa856d8 100644
--- a/src/views/partials/chats/room-teaser.tpl
+++ b/src/views/partials/chats/room-teaser.tpl
@@ -2,7 +2,7 @@
 	{{{ if ./teaser }}}
 	<div class="teaser-content text-sm line-clamp-3 text-break">
 		{buildAvatar(./teaser.user, "14px", true, "align-middle")}
-		<strong class="text-xs fw-semibold teaser-username">{./teaser.user.username}:</strong>
+		<strong class="text-xs fw-semibold teaser-username">{./teaser.user.displayname}:</strong>
 		{./teaser.content}
 	</div>
 	<div class="teaser-timestamp text-muted text-xs">{{{ if ./teaser.timeagoLong }}}{./teaser.timeagoLong}{{{ else }}}<span class="timeago" title="{./teaser.timestampISO}"></span>{{{ end }}}</div>
diff --git a/src/views/partials/chats/user-list.tpl b/src/views/partials/chats/user-list.tpl
index 306a625290..5825ab7874 100644
--- a/src/views/partials/chats/user-list.tpl
+++ b/src/views/partials/chats/user-list.tpl
@@ -3,7 +3,7 @@
 	<a data-index="{./index}" data-uid="{./uid}" class="btn btn-ghost btn-sm d-flex ff-secondary d-flex justify-content-start align-items-center gap-2 {{{ if ./online }}}online{{{ end}}}" href="{config.relative_path}/uid/{./uid}">
 		<div>{buildAvatar(users, "24px", true)}</div>
 		<div class="d-flex gap-1 flex-grow-1 text-nowrap text-truncate">
-			<span component="chat/user/list/username" class="text-truncate">{./username}</span>
+			<span component="chat/user/list/username" class="text-truncate">{./displayname}</span>
 			{{{ if ./isOwner }}}<span><i class="fa fa-star text-warning" data-bs-toggle="tooltip" title="[[modules:chat.owner]]"></i></span>{{{ end }}}
 		</div>
 	</a>