From 081c845c5656232e5058f1673adfe24d6cec3162 Mon Sep 17 00:00:00 2001
From: Shivam Mishra <scm.mymail@gmail.com>
Date: Tue, 10 Oct 2023 16:48:58 +0530
Subject: [PATCH] chore: Remove twitter actions (#8079)

---
 .../widgets/conversation/Message.vue          |  4 ++
 .../widgets/conversation/MessagesView.vue     | 44 +------------------
 .../widgets/conversation/ReplyBox.vue         | 35 +--------------
 .../widgets/conversation/bubble/Actions.vue   | 19 +-------
 .../i18n/locale/en/conversation.json          |  2 -
 .../dashboard/settings/inbox/Settings.vue     | 33 ++++----------
 app/javascript/shared/constants/busEvents.js  |  1 -
 .../shared/helpers/MessageTypeHelper.js       |  1 -
 8 files changed, 17 insertions(+), 122 deletions(-)

diff --git a/app/javascript/dashboard/components/widgets/conversation/Message.vue b/app/javascript/dashboard/components/widgets/conversation/Message.vue
index 4b374c16d..32ad10bd4 100644
--- a/app/javascript/dashboard/components/widgets/conversation/Message.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/Message.vue
@@ -324,6 +324,8 @@ export default {
         left: isLeftAligned,
         right: isRightAligned,
         'has-context-menu': this.showContextMenu,
+        // this handles the offset required to align the context menu button
+        // extra alignment is required since a tweet message has a the user name and avatar below it
         'has-tweet-menu': this.isATweet,
         'has-bg': this.showBackgroundHighlight,
       };
@@ -620,6 +622,8 @@ li.right {
 }
 
 li.left.has-tweet-menu .context-menu {
+  // this handles the offset required to align the context menu button
+  // extra alignment is required since a tweet message has a the user name and avatar below it
   @apply mb-6;
 }
 
diff --git a/app/javascript/dashboard/components/widgets/conversation/MessagesView.vue b/app/javascript/dashboard/components/widgets/conversation/MessagesView.vue
index d58742401..5da5408e4 100644
--- a/app/javascript/dashboard/components/widgets/conversation/MessagesView.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/MessagesView.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="m-0 flex flex-col justify-between h-full flex-grow min-w-0">
+  <div class="flex flex-col justify-between flex-grow h-full min-w-0 m-0">
     <banner
       v-if="!currentChat.can_reply"
       color-scheme="alert"
@@ -7,15 +7,6 @@
       :href-link="replyWindowLink"
       :href-link-text="replyWindowLinkText"
     />
-
-    <banner
-      v-if="isATweet"
-      color-scheme="gray"
-      :banner-message="tweetBannerText"
-      :has-close-button="hasSelectedTweetId"
-      @close="removeTweetSelection"
-    />
-
     <div class="flex justify-end">
       <woot-button
         variant="smooth"
@@ -88,8 +79,6 @@
       </div>
       <reply-box
         :conversation-id="currentChat.id"
-        :is-a-tweet="isATweet"
-        :selected-tweet="selectedTweet"
         :popout-reply-box.sync="isPopoutReplyBox"
         @click="showPopoutReplyBox"
       />
@@ -155,7 +144,6 @@ export default {
       isLoadingPrevious: true,
       heightBeforeLoad: null,
       conversationPanel: null,
-      selectedTweetId: null,
       hasUserScrolled: false,
       isProgrammaticScroll: false,
       isPopoutReplyBox: false,
@@ -193,16 +181,6 @@ export default {
     inbox() {
       return this.$store.getters['inboxes/getInbox'](this.inboxId);
     },
-    hasSelectedTweetId() {
-      return !!this.selectedTweetId;
-    },
-    tweetBannerText() {
-      return !this.selectedTweetId
-        ? this.$t('CONVERSATION.SELECT_A_TWEET_TO_REPLY')
-        : `
-          ${this.$t('CONVERSATION.REPLYING_TO')}
-          ${this.selectedTweet.content}` || '';
-    },
     typingUsersList() {
       const userList = this.$store.getters[
         'conversationTypingStatus/getUserList'
@@ -261,17 +239,6 @@ export default {
     hasInstagramStory() {
       return this.conversationType === 'instagram_direct_message';
     },
-
-    selectedTweet() {
-      if (this.selectedTweetId) {
-        const { messages = [] } = this.currentChat;
-        const [selectedMessage] = messages.filter(
-          message => message.id === this.selectedTweetId
-        );
-        return selectedMessage || {};
-      }
-      return '';
-    },
     isRightOrLeftIcon() {
       if (this.isContactPanelOpen) {
         return 'arrow-chevron-right';
@@ -339,7 +306,6 @@ export default {
       this.fetchAllAttachmentsFromCurrentChat();
       this.fetchSuggestions();
       this.messageSentSinceOpened = false;
-      this.selectedTweetId = null;
     },
   },
 
@@ -347,7 +313,6 @@ export default {
     bus.$on(BUS_EVENTS.SCROLL_TO_MESSAGE, this.onScrollToMessage);
     // when a new message comes in, we refetch the label suggestions
     bus.$on(BUS_EVENTS.FETCH_LABEL_SUGGESTIONS, this.fetchSuggestions);
-    bus.$on(BUS_EVENTS.SET_TWEET_REPLY, this.setSelectedTweet);
     // when a message is sent we set the flag to true this hides the label suggestions,
     // until the chat is changed and the flag is reset in the watch for currentChat
     bus.$on(BUS_EVENTS.MESSAGE_SENT, () => {
@@ -418,10 +383,6 @@ export default {
     },
     removeBusListeners() {
       bus.$off(BUS_EVENTS.SCROLL_TO_MESSAGE, this.onScrollToMessage);
-      bus.$off(BUS_EVENTS.SET_TWEET_REPLY, this.setSelectedTweet);
-    },
-    setSelectedTweet(tweetId) {
-      this.selectedTweetId = tweetId;
     },
     onScrollToMessage({ messageId = '' } = {}) {
       this.$nextTick(() => {
@@ -544,9 +505,6 @@ export default {
     makeMessagesRead() {
       this.$store.dispatch('markMessagesRead', { id: this.currentChat.id });
     },
-    removeTweetSelection() {
-      this.selectedTweetId = null;
-    },
   },
 };
 </script>
diff --git a/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue b/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue
index 1e5364070..864f9b805 100644
--- a/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue
@@ -86,7 +86,7 @@
     </div>
     <div v-if="hasAttachments" class="attachment-preview-box" @paste="onPaste">
       <attachment-preview
-        class="mt-4 flex-col"
+        class="flex-col mt-4"
         :attachments="attachedFiles"
         :remove-attachment="removeAttachment"
       />
@@ -206,14 +206,6 @@ export default {
     fileUploadMixin,
   ],
   props: {
-    selectedTweet: {
-      type: [Object, String],
-      default: () => ({}),
-    },
-    isATweet: {
-      type: Boolean,
-      default: false,
-    },
     popoutReplyBox: {
       type: Boolean,
       default: false,
@@ -326,10 +318,7 @@ export default {
       return this.maxLength - this.message.length;
     },
     isReplyButtonDisabled() {
-      if (this.isATweet && !this.inReplyTo && !this.isOnPrivateNote) {
-        return true;
-      }
-
+      if (this.isATwitterInbox) return true;
       if (this.hasAttachments || this.hasRecordedAudio) return false;
 
       return (
@@ -362,11 +351,6 @@ export default {
       if (this.isASmsInbox) {
         return MESSAGE_MAX_LENGTH.TWILIO_SMS;
       }
-      if (this.isATwitterInbox) {
-        if (this.conversationType === 'tweet') {
-          return MESSAGE_MAX_LENGTH.TWEET - this.replyToUserLength - 2;
-        }
-      }
       return MESSAGE_MAX_LENGTH.GENERAL;
     },
     showFileUpload() {
@@ -384,8 +368,6 @@ export default {
       let sendMessageText = this.$t('CONVERSATION.REPLYBOX.SEND');
       if (this.isPrivate) {
         sendMessageText = this.$t('CONVERSATION.REPLYBOX.CREATE');
-      } else if (this.conversationType === 'tweet') {
-        sendMessageText = this.$t('CONVERSATION.REPLYBOX.TWEET');
       }
       const keyLabel = isEditorHotKeyEnabled(this.uiSettings, 'cmd_enter')
         ? '(⌘ + ↵)'
@@ -419,10 +401,6 @@ export default {
     isOnPrivateNote() {
       return this.replyType === REPLY_EDITOR_MODES.NOTE;
     },
-    inReplyTo() {
-      const selectedTweet = this.selectedTweet || {};
-      return selectedTweet.id;
-    },
     isOnExpandedLayout() {
       const {
         LAYOUT_TYPES: { CONDENSED },
@@ -440,15 +418,6 @@ export default {
       }
       return '';
     },
-    replyToUserLength() {
-      const selectedTweet = this.selectedTweet || {};
-      const {
-        sender: {
-          additional_attributes: { screen_name: screenName = '' } = {},
-        } = {},
-      } = selectedTweet;
-      return screenName ? screenName.length : 0;
-    },
     isMessageEmpty() {
       if (!this.message) {
         return true;
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/Actions.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/Actions.vue
index 71f6c9ec0..58a0ee0a7 100644
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/Actions.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/bubble/Actions.vue
@@ -57,17 +57,6 @@
       @mouseenter="isHovered = true"
       @mouseleave="isHovered = false"
     />
-    <button
-      v-if="isATweet && (isIncoming || isOutgoing) && sourceId"
-      @click="onTweetReply"
-    >
-      <fluent-icon
-        v-tooltip.top-start="$t('CHAT_LIST.REPLY_TO_TWEET')"
-        icon="arrow-reply"
-        class="action--icon cursor-pointer"
-        size="16"
-      />
-    </button>
     <a
       v-if="isATweet && (isOutgoing || isIncoming) && linkToTweet"
       :href="linkToTweet"
@@ -77,7 +66,7 @@
       <fluent-icon
         v-tooltip.top-start="$t('CHAT_LIST.VIEW_TWEET_IN_TWITTER')"
         icon="open"
-        class="action--icon cursor-pointer"
+        class="cursor-pointer action--icon"
         size="16"
       />
     </a>
@@ -86,7 +75,6 @@
 
 <script>
 import { MESSAGE_TYPE, MESSAGE_STATUS } from 'shared/constants/messages';
-import { BUS_EVENTS } from 'shared/constants/busEvents';
 import inboxMixin from 'shared/mixins/inboxMixin';
 import { mapGetters } from 'vuex';
 import timeMixin from '../../../../mixins/time';
@@ -246,11 +234,6 @@ export default {
       return false;
     },
   },
-  methods: {
-    onTweetReply() {
-      bus.$emit(BUS_EVENTS.SET_TWEET_REPLY, this.id);
-    },
-  },
 };
 </script>
 
diff --git a/app/javascript/dashboard/i18n/locale/en/conversation.json b/app/javascript/dashboard/i18n/locale/en/conversation.json
index e6732e78c..ff50b1240 100644
--- a/app/javascript/dashboard/i18n/locale/en/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/en/conversation.json
@@ -34,7 +34,6 @@
     "ASSIGN_TO_ME": "Assign to me",
     "TWILIO_WHATSAPP_CAN_REPLY": "You can only reply to this conversation using a template message due to",
     "TWILIO_WHATSAPP_24_HOURS_WINDOW": "24 hour message window restriction",
-    "SELECT_A_TWEET_TO_REPLY": "Please select a tweet to reply to.",
     "REPLYING_TO": "You are replying to:",
     "REMOVE_SELECTION": "Remove Selection",
     "DOWNLOAD": "Download",
@@ -139,7 +138,6 @@
       "PRIVATE_NOTE": "Private Note",
       "SEND": "Send",
       "CREATE": "Add Note",
-      "TWEET": "Tweet",
       "TIP_FORMAT_ICON": "Show rich text editor",
       "TIP_EMOJI_ICON": "Show emoji selector",
       "TIP_ATTACH_ICON": "Attach files",
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/Settings.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/Settings.vue
index 1fa79d0e2..7c92674a8 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/Settings.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/Settings.vue
@@ -1,6 +1,6 @@
 <template>
   <div
-    class="settings bg-white dark:bg-slate-800 flex-grow flex-shrink pr-0 pl-0 overflow-auto min-w-0 w-full"
+    class="flex-grow flex-shrink w-full min-w-0 pl-0 pr-0 overflow-auto bg-white settings dark:bg-slate-800"
   >
     <setting-intro-banner
       :header-image="inbox.avatarUrl"
@@ -48,18 +48,6 @@
           "
           @blur="$v.selectedInboxName.$touch"
         />
-        <label
-          v-if="isATwitterInbox"
-          for="toggle-business-hours"
-          class="toggle-input-wrap"
-        >
-          <input
-            v-model="tweetsEnabled"
-            type="checkbox"
-            name="toggle-business-hours"
-          />
-          {{ $t('INBOX_MGMT.ADD.TWITTER.TWEETS.ENABLE') }}
-        </label>
         <woot-input
           v-if="isAPIInbox"
           v-model.trim="webhookUrl"
@@ -145,7 +133,7 @@
               }}
             </option>
           </select>
-          <p class="text-slate-600 dark:text-slate-400 pb-1 text-sm not-italic">
+          <p class="pb-1 text-sm not-italic text-slate-600 dark:text-slate-400">
             {{
               $t(
                 'INBOX_MGMT.ADD.WEBSITE_CHANNEL.CHANNEL_GREETING_TOGGLE.HELP_TEXT'
@@ -187,7 +175,7 @@
             </option>
           </select>
 
-          <p class="text-slate-600 dark:text-slate-400 pb-1 text-sm not-italic">
+          <p class="pb-1 text-sm not-italic text-slate-600 dark:text-slate-400">
             {{ $t('INBOX_MGMT.ADD.WEBSITE_CHANNEL.REPLY_TIME.HELP_TEXT') }}
           </p>
         </label>
@@ -202,7 +190,7 @@
               {{ $t('INBOX_MGMT.EDIT.EMAIL_COLLECT_BOX.DISABLED') }}
             </option>
           </select>
-          <p class="text-slate-600 dark:text-slate-400 pb-1 text-sm not-italic">
+          <p class="pb-1 text-sm not-italic text-slate-600 dark:text-slate-400">
             {{
               $t('INBOX_MGMT.SETTINGS_POPUP.ENABLE_EMAIL_COLLECT_BOX_SUB_TEXT')
             }}
@@ -219,7 +207,7 @@
               {{ $t('INBOX_MGMT.EDIT.ENABLE_CSAT.DISABLED') }}
             </option>
           </select>
-          <p class="text-slate-600 dark:text-slate-400 pb-1 text-sm not-italic">
+          <p class="pb-1 text-sm not-italic text-slate-600 dark:text-slate-400">
             {{ $t('INBOX_MGMT.SETTINGS_POPUP.ENABLE_CSAT_SUB_TEXT') }}
           </p>
         </label>
@@ -234,7 +222,7 @@
               {{ $t('INBOX_MGMT.EDIT.ALLOW_MESSAGES_AFTER_RESOLVED.DISABLED') }}
             </option>
           </select>
-          <p class="text-slate-600 dark:text-slate-400 pb-1 text-sm not-italic">
+          <p class="pb-1 text-sm not-italic text-slate-600 dark:text-slate-400">
             {{
               $t(
                 'INBOX_MGMT.SETTINGS_POPUP.ALLOW_MESSAGES_AFTER_RESOLVED_SUB_TEXT'
@@ -253,7 +241,7 @@
               {{ $t('INBOX_MGMT.EDIT.ENABLE_CONTINUITY_VIA_EMAIL.DISABLED') }}
             </option>
           </select>
-          <p class="text-slate-600 dark:text-slate-400 pb-1 text-sm not-italic">
+          <p class="pb-1 text-sm not-italic text-slate-600 dark:text-slate-400">
             {{
               $t(
                 'INBOX_MGMT.SETTINGS_POPUP.ENABLE_CONTINUITY_VIA_EMAIL_SUB_TEXT'
@@ -273,7 +261,7 @@
               {{ p.name }}
             </option>
           </select>
-          <p class="text-slate-600 dark:text-slate-400 pb-1 text-sm not-italic">
+          <p class="pb-1 text-sm not-italic text-slate-600 dark:text-slate-400">
             {{ $t('INBOX_MGMT.HELP_CENTER.SUB_TEXT') }}
           </p>
         </div>
@@ -287,7 +275,7 @@
               {{ $t('INBOX_MGMT.EDIT.LOCK_TO_SINGLE_CONVERSATION.DISABLED') }}
             </option>
           </select>
-          <p class="text-slate-600 dark:text-slate-400 pb-1 text-sm not-italic">
+          <p class="pb-1 text-sm not-italic text-slate-600 dark:text-slate-400">
             {{
               $t(
                 'INBOX_MGMT.SETTINGS_POPUP.LOCK_TO_SINGLE_CONVERSATION_SUB_TEXT'
@@ -472,7 +460,6 @@ export default {
       avatarFile: null,
       avatarUrl: '',
       greetingEnabled: true,
-      tweetsEnabled: true,
       greetingMessage: '',
       emailCollectEnabled: false,
       csatSurveyEnabled: false,
@@ -668,7 +655,6 @@ export default {
         this.selectedInboxName = this.inbox.name;
         this.webhookUrl = this.inbox.webhook_url;
         this.greetingEnabled = this.inbox.greeting_enabled || false;
-        this.tweetsEnabled = this.inbox.tweets_enabled || false;
         this.greetingMessage = this.inbox.greeting_message || '';
         this.emailCollectEnabled = this.inbox.enable_email_collect;
         this.csatSurveyEnabled = this.inbox.csat_survey_enabled;
@@ -714,7 +700,6 @@ export default {
             welcome_tagline: this.channelWelcomeTagline || '',
             selectedFeatureFlags: this.selectedFeatureFlags,
             reply_time: this.replyTime || 'in_a_few_minutes',
-            tweets_enabled: this.tweetsEnabled,
             continuity_via_email: this.continuityViaEmail,
           },
         };
diff --git a/app/javascript/shared/constants/busEvents.js b/app/javascript/shared/constants/busEvents.js
index 6edf96fcd..b75b605dc 100644
--- a/app/javascript/shared/constants/busEvents.js
+++ b/app/javascript/shared/constants/busEvents.js
@@ -1,5 +1,4 @@
 export const BUS_EVENTS = {
-  SET_TWEET_REPLY: 'SET_TWEET_REPLY',
   SHOW_ALERT: 'SHOW_ALERT',
   START_NEW_CONVERSATION: 'START_NEW_CONVERSATION',
   FOCUS_CUSTOM_ATTRIBUTE: 'FOCUS_CUSTOM_ATTRIBUTE',
diff --git a/app/javascript/shared/helpers/MessageTypeHelper.js b/app/javascript/shared/helpers/MessageTypeHelper.js
index f5b00827a..29bfaed60 100644
--- a/app/javascript/shared/helpers/MessageTypeHelper.js
+++ b/app/javascript/shared/helpers/MessageTypeHelper.js
@@ -7,5 +7,4 @@ export const MESSAGE_MAX_LENGTH = {
   FACEBOOK: 1000,
   TWILIO_SMS: 320,
   TWILIO_WHATSAPP: 1600,
-  TWEET: 280,
 };