From 252eda14c6e62cb8f91a8f7337d2dc05dc550bdf Mon Sep 17 00:00:00 2001
From: Nithin David Thomas <1277421+nithindavid@users.noreply.github.com>
Date: Mon, 17 Oct 2022 05:18:32 +0530
Subject: [PATCH] chore: Add woot button to message context menu (#5638)

---
 .../components/widgets/conversation/Message.vue      |  2 ++
 .../conversations/components/MessageContextMenu.vue  | 12 +++++++-----
 .../shared/components/ui/dropdown/DropdownItem.vue   |  1 +
 3 files changed, 10 insertions(+), 5 deletions(-)

diff --git a/app/javascript/dashboard/components/widgets/conversation/Message.vue b/app/javascript/dashboard/components/widgets/conversation/Message.vue
index 3481125ca..7fb24301b 100644
--- a/app/javascript/dashboard/components/widgets/conversation/Message.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/Message.vue
@@ -420,6 +420,8 @@ export default {
 <style lang="scss">
 .wrap {
   > .bubble {
+    min-width: 128px;
+
     &.is-image,
     &.is-video {
       padding: 0;
diff --git a/app/javascript/dashboard/modules/conversations/components/MessageContextMenu.vue b/app/javascript/dashboard/modules/conversations/components/MessageContextMenu.vue
index a50e6bb0d..d23b11dae 100644
--- a/app/javascript/dashboard/modules/conversations/components/MessageContextMenu.vue
+++ b/app/javascript/dashboard/modules/conversations/components/MessageContextMenu.vue
@@ -12,9 +12,9 @@
     </woot-modal>
     <woot-button
       icon="more-vertical"
-      class="button--delete-message"
       color-scheme="secondary"
-      variant="link"
+      variant="clear"
+      size="small"
       @click="handleContextMenuClick"
     />
     <div
@@ -40,6 +40,7 @@
             variant="clear"
             size="small"
             icon="clipboard"
+            color-scheme="secondary"
             @click="handleCopy"
           >
             {{ $t('CONVERSATION.CONTEXT_MENU.COPY') }}
@@ -52,6 +53,7 @@
             variant="clear"
             size="small"
             icon="comment-add"
+            color-scheme="secondary"
             @click="showCannedResponseModal"
           >
             {{ $t('CONVERSATION.CONTEXT_MENU.CREATE_A_CANNED_RESPONSE') }}
@@ -132,12 +134,12 @@ export default {
 </script>
 <style lang="scss" scoped>
 .dropdown-pane {
-  bottom: var(--space-medium);
+  bottom: var(--space-large);
 }
 .dropdown-pane--left {
-  right: var(--space-small);
+  right: var(--space-minus-small);
 }
 .dropdown-pane--right {
-  left: var(--space-small);
+  left: var(--space-minus-small);
 }
 </style>
diff --git a/app/javascript/shared/components/ui/dropdown/DropdownItem.vue b/app/javascript/shared/components/ui/dropdown/DropdownItem.vue
index c4da84234..893026451 100644
--- a/app/javascript/shared/components/ui/dropdown/DropdownItem.vue
+++ b/app/javascript/shared/components/ui/dropdown/DropdownItem.vue
@@ -35,6 +35,7 @@ export default {
     a,
     .button {
       display: inline-flex;
+      white-space: nowrap;
       width: 100%;
       text-align: left;
       color: var(--s-700);