compose: Show bot icon after bot name in recipient picker.

Bot icon shown in the typeahead recipient list which pops up
in the compose box while typing.
On typeahead hover, bot icon takes the color of the font
for better contrast.

web/src/typeahead_helper.ts

@@ -145,6 +145,7 @@ export function render_person(person: UserPillData | UserOrMentionPillData): str
         img_src: avatar_url,
         user_circle_class,
         is_person: true,
+        is_bot: person.user.is_bot,
         status_emoji_info,
         should_add_guest_user_indicator: people.should_add_guest_user_indicator(
             person.user.user_id,

web/styles/typeahead.css

@@ -179,3 +179,9 @@
         margin-left: 14px;
     }
 }
+
+.typeahead-text-container {
+    i.zulip-icon-bot {
+        align-self: center;
+    }
+}

web/templates/typeahead_list_item.hbs

@@ -25,6 +25,9 @@
             {{~ primary ~}}
         {{~/if~}}
     </strong>
+    {{~#if is_bot}}
+        <i class="zulip-icon zulip-icon-bot" aria-label="{{t 'Bot' }}"></i>
+    {{/if}}
     {{~#if has_pronouns}}
         <span class="pronouns">{{pronouns}}{{#if (or has_secondary_html has_secondary)}},{{/if}}</span>
     {{~/if}}