From f9bf688c9e3fb80466e2a60600b4ed1b58550072 Mon Sep 17 00:00:00 2001
From: evykassirer <evy.kassirer@gmail.com>
Date: Mon, 24 Apr 2023 16:24:50 -0700
Subject: [PATCH] compose: Add DM icon to the recipient dropdown.

This commit adds the new users icon and uses it in the
recipient dropdown, both in the selection options and
the selected option displayed on the button.
---
 web/images/icons/users.svg               | Bin 0 -> 2302 bytes
 web/src/compose_actions.js               |   5 ++++-
 web/src/compose_recipient.js             |   1 +
 web/styles/app_components.css            |   4 +++-
 web/templates/settings/dropdown_list.hbs |   2 ++
 5 files changed, 10 insertions(+), 2 deletions(-)
 create mode 100644 web/images/icons/users.svg

diff --git a/web/images/icons/users.svg b/web/images/icons/users.svg
new file mode 100644
index 0000000000000000000000000000000000000000..b54475b48c6a6e278552ff746a0618ae2772db45
GIT binary patch
literal 2302
zcmaKuyKWpu5Jhu+#b9zZyQ|-ZR)Hr`qEvx0SzK`!UXg^f=IZl(svqRiFhmd--kEyd
zx?Rn8KcDWF%klPn*sU(D%VB@KJDmI9Psjb`&xc>T)h>2%iQjekc08SS>;1$1eqDZj
zKi&V_t%vjZ@sFFE%jIG&-aP!cyAf;c4T0D9Z{9tAIUkzW+aLd&_Pcfew7-A2y<L~D
zr{m*)-`(!kkI~dxQ&^nwKGv`W<6=#2;zdkKxn`b4a@1$XL7!=xFqvp`^2>D38dmZ$
z!w<Y=Q+!QnncpjEonNN=fFt-oGxhWxr9Q_V`140kQmu8kPv}id;vBC_4KB78X!Y4&
zd(hUiaW+!Sz)LaK0;l_cBltkk<m_#wpYEH8b=~*C(Asm)@3Xe)KXH%#c~1VX)0eM*
zuQzkBIxr7oKFOlwXw_muq|S*MT(S}iIF(f6VolBbpeJj*b7kWZrKYSes%I8f`>fGB
zS)4Pugja9cgwrP%u(B2J7vo@jDuT5jA>6Q0CV7!yA^Q1ZbH@50gdYYvF)}J{5w5T%
z`Q&<1{Dz$v=e1%JgJ>d}6m7{=SA;yyNECq!p(Dg=P06XKXf3K$+zOlA4g8_>LbqyM
z&4oC_u9|F9ZIrb*ytmhRz#(SpnRTdN!G6~Hg7uU<lh@*_-RzqQBt3kS7j4+L?^^Gs
z<A9Ir@3mh0L%_hVd7JP1IJL~s70?C_wjxE_ZHmxmeNjv`F<OrLP#EW+jdS7;gT>#8
zR0mk9inNN&G$QDVBS`2J9htpx!D~v-iGu)dLgh$S6M}bfgAj2+?U^$?b9_R^j5&nB
zGd9V!c}XrCI7bIh=)kFrb?s=w@E|%@#RXlcu2LNH2<q40>paw+IM&X2v^>lMzcwH2
z1M@=Q1NW!Ko&IXqG4lvR$D)4dfIbkY&^9;<XO{YM?eQfPbn56|@&+B0-}GgxV8;%s
zY*+d(VbI43Q>@!Z>4n{{Uth5o>^ol^6Z&{Pj^9p>6kbzmC56(Fx-NE<8C`~2Yn&q@
zgX{&NBnp9Np%CWnsgE{uE=^!Ake~Fy>Xl}>CfEb0fo;Q>bpvrrP`)l^+V_s}dSh#!
zW@Lo{5rv+GqFdWT8Oop~YqMTBBC)qTaLU$0;rJf4T$a>ykF1b(<mf<yM;0?HT*J5A
z$uNn&3R-DNg();VN@s!F8ju`3XlqFo)7EY4JR6%tPbf-NVzOagsdcKfWv+`R;K3@_
zV5zpT+F0j`;|7Cu-E<|ZJ%qqMi-n65EC{0y)U(*g?z|G&D05&Z1wXL&uoFpdbzB3Z
x!_LmY=*(NH9qwL_Pv2un!!tL@+U!UVryNh^vQ?+sFDZVlng5ZO{(JKN&A*Uf-Ae!f

literal 0
HcmV?d00001

diff --git a/web/src/compose_actions.js b/web/src/compose_actions.js
index 75d5263222..b759ccf5ce 100644
--- a/web/src/compose_actions.js
+++ b/web/src/compose_actions.js
@@ -96,7 +96,10 @@ export function show_compose_box(msg_type, opts) {
         // button. It would be nice if the dropdown supported a way to attach
         // the "DM" button display string so we wouldn't have to manually change
         // it here.
-        $("#compose_select_recipient_name").text($t({defaultMessage: "DM"}));
+        const direct_message_label = $t({defaultMessage: "DM"});
+        $("#compose_select_recipient_name").html(
+            `<i class="zulip-icon zulip-icon-users stream-privacy-type-icon"></i> ${direct_message_label}`,
+        );
     }
     compose_banner.clear_errors();
     compose_banner.clear_warnings();
diff --git a/web/src/compose_recipient.js b/web/src/compose_recipient.js
index 5da787640a..f6f5dd3156 100644
--- a/web/src/compose_recipient.js
+++ b/web/src/compose_recipient.js
@@ -202,6 +202,7 @@ function get_options_for_recipient_widget() {
     const direct_messages_option = {
         name: $t({defaultMessage: "Direct message"}),
         value: DIRECT_MESSAGE,
+        is_direct_message: true,
     };
     if (
         page_params.realm_private_message_policy ===
diff --git a/web/styles/app_components.css b/web/styles/app_components.css
index 4b704bf1aa..95b93d265d 100644
--- a/web/styles/app_components.css
+++ b/web/styles/app_components.css
@@ -829,13 +829,15 @@ div.overlay {
     position: relative;
     top: 0.06rem;
     padding-right: 1px;
+    width: 12px;
 
     &.zulip-icon-globe,
     &.zulip-icon-hashtag {
         font-size: 0.75em;
     }
 
-    &.zulip-icon-lock {
+    &.zulip-icon-lock,
+    &.zulip-icon-users {
         font-size: 0.8em;
     }
 }
diff --git a/web/templates/settings/dropdown_list.hbs b/web/templates/settings/dropdown_list.hbs
index 58cc715cd5..39303e4d19 100644
--- a/web/templates/settings/dropdown_list.hbs
+++ b/web/templates/settings/dropdown_list.hbs
@@ -3,6 +3,8 @@
     <a role="menuitem" tabindex="0">
         {{#if stream}}
             {{> ../inline_decorated_stream_name stream=stream show_colored_icon=true}}
+        {{else if is_direct_message}}
+            <i class="zulip-icon zulip-icon-users stream-privacy-type-icon"></i> {{name}}
         {{else}}
             {{name}}
         {{/if}}