dm_headers: Show bot icon after bot name.

Fixes #32990.

web/src/message_list_view.ts

@@ -255,6 +255,7 @@ function get_users_for_recipient_row(message: Message): RecipientRowUser[] {
     assert(user_ids !== undefined);
     const users = user_ids.map((user_id) => {
         let full_name;
+        const is_bot = people.is_valid_bot_user(user_id);
         if (muted_users.is_user_muted(user_id)) {
             full_name = $t({defaultMessage: "Muted user"});
         } else {
@@ -263,6 +264,7 @@ function get_users_for_recipient_row(message: Message): RecipientRowUser[] {
         return {
             full_name,
             should_add_guest_user_indicator: people.should_add_guest_user_indicator(user_id),
+            is_bot,
         };
     });
 

web/styles/message_header.css

@@ -142,6 +142,13 @@
         .private_message_header_name {
             overflow: hidden;
             text-overflow: ellipsis;
+
+            i.zulip-icon-bot {
+                vertical-align: middle;
+                position: relative;
+                top: -1px;
+                padding-left: 0.3em;
+            }
         }
     }
 }

web/templates/recipient_row.hbs

@@ -94,7 +94,8 @@
             {{~#tr}}You and <z-user-names></z-user-names>
             {{#*inline "z-user-names"}}
                 {{#each recipient_users}}
-                    {{~full_name}}{{#if should_add_guest_user_indicator}}&nbsp;<i>({{t 'guest'}})</i>{{/if}}{{#unless @last}}, {{/unless~}}
+                    {{~full_name}}{{#if is_bot}}<i class="zulip-icon zulip-icon-bot" aria-label="{{t 'Bot' }}"></i>{{/if}}
+                    {{~#if should_add_guest_user_indicator}}&nbsp;<i>({{t 'guest'}})</i>{{/if}}{{#unless @last}}, {{/unless~}}
                 {{/each}}
             {{/inline}}
             {{/tr~}}