recent_conversations: Show unread @-mention indicator for DMs.

Earlier, in recent conversation, only streams had unread @-mention
indicators and DMs in recent conversation lacked them.

This commit introduces unread @-mention indicators for DM rows in recent
conversations using `unread_mention_dms` which stores `user_ids_string`
mapped to `message_id`s having mention.

Fixes: zulip#28849.

web/src/recent_view_ui.ts

@@ -606,6 +606,7 @@ type ConversationContext = {
           is_group: boolean;
           is_bot: boolean;
           user_circle_class: string | undefined;
+          has_unread_mention: boolean;
       }
     | {
           is_private: false;
@@ -710,6 +711,8 @@ function format_conversation(conversation_data: ConversationData): ConversationC
         const recipient_id = last_msg.recipient_id;
         const pm_url = last_msg.pm_with_url;
         const is_group = last_msg.display_recipient.length > 2;
+        const has_unread_mention =
+            unread.num_unread_mentions_for_user_ids_strings(user_ids_string) > 0;
 
         let is_bot = false;
         let user_circle_class;
@@ -742,6 +745,7 @@ function format_conversation(conversation_data: ConversationData): ConversationC
             is_group,
             is_bot,
             user_circle_class,
+            has_unread_mention,
         };
     }
 

web/templates/recent_view_row.hbs

@@ -39,6 +39,8 @@
             </div>
             <div class="right_part">
                 {{#if is_private}}
+                <span class="unread_mention_info tippy-zulip-tooltip {{#unless has_unread_mention}}unread_hidden{{/unless}}"
+                  data-tippy-content="{{t 'You have unread mentions' }}">@</span>
                 <div class="recent_topic_actions">
                     <div class="recent_view_focusable" data-col-index="{{ column_indexes.read }}">
                         <span class="unread_count unread_count_pm recent-view-table-unread-count {{#unless unread_count}}unread_hidden{{/unless}} tippy-zulip-tooltip on_hover_topic_read" data-user-ids-string="{{user_ids_string}}" data-tippy-content="{{t 'Mark as read' }}" role="button" tabindex="0" aria-label="{{t 'Mark as read' }}">{{unread_count}}</span>

web/tests/recent_view.test.cjs

@@ -185,6 +185,12 @@ mock_esm("../src/unread", {
         return 0;
     },
     topic_has_any_unread_mentions: () => false,
+    num_unread_mentions_for_user_ids_strings(user_ids_string) {
+        if (user_ids_string === "2,3") {
+            return false;
+        }
+        return true;
+    },
 });
 mock_esm("../src/resize", {
     update_recent_view: noop,