Merge branch 'develop' into chore/improve-conversation-snooze

2026-02-26 21:43:42 +05:30
parent 193933be46 bdcc62f1b0
commit 30443ca132
61 changed files with 895 additions and 145 deletions
@@ -129,6 +129,7 @@ const props = defineProps({
  inReplyTo: { type: Object, default: null }, // eslint-disable-line vue/no-unused-properties
  isEmailInbox: { type: Boolean, default: false },
  private: { type: Boolean, default: false },
+  additionalAttributes: { type: Object, default: () => ({}) }, // eslint-disable-line vue/no-unused-properties
  sender: { type: Object, default: null },
  senderId: { type: Number, default: null },
  senderType: { type: String, default: null },
@@ -172,7 +173,10 @@ const variant = computed(() => {
    return MESSAGE_VARIANTS.AGENT;
  }

-  const isBot = !props.sender || props.sender.type === SENDER_TYPES.AGENT_BOT;
+  const isBot =
+    props.sender?.type === SENDER_TYPES.AGENT_BOT ||
+    props.senderType === SENDER_TYPES.AGENT_BOT ||
+    (!props.sender && !props.additionalAttributes?.senderName);
  if (isBot && props.messageType === MESSAGE_TYPES.OUTGOING) {
    return MESSAGE_VARIANTS.BOT;
  }
@@ -450,12 +454,13 @@ const avatarInfo = computed(() => {
    };
  }

-  // If no sender, return bot info
+  // If no sender, check for Slack (or other integration) sender info
  if (!props.sender) {
-    return {
-      name: t('CONVERSATION.BOT'),
-      src: '',
-    };
+    const { senderName, senderAvatarUrl } = props.additionalAttributes || {};
+    if (senderName) {
+      return { name: senderName, src: senderAvatarUrl ?? '' };
+    }
+    return { name: t('CONVERSATION.BOT'), src: '' };
  }

  const { sender } = props;
@@ -380,7 +380,11 @@ export default {
        @click="$emit('selectContentTemplate')"
      />
      <VideoCallButton
-        v-if="(isAWebWidgetInbox || isAPIInbox) && !isOnPrivateNote"
+        v-if="
+          (isAWebWidgetInbox || isAPIInbox) &&
+          !isOnPrivateNote &&
+          !isEditorDisabled
+        "
        :conversation-id="conversationId"
      />
      <transition name="modal-fade">
@@ -86,6 +86,10 @@ const chatSortOptions = computed(() => [
    label: t('CHAT_LIST.SORT_ORDER_ITEMS.priority_asc.TEXT'),
    value: 'priority_asc',
  },
+  {
+    label: t('CHAT_LIST.SORT_ORDER_ITEMS.priority_desc_created_at_asc.TEXT'),
+    value: 'priority_desc_created_at_asc',
+  },
  {
    label: t('CHAT_LIST.SORT_ORDER_ITEMS.waiting_since_asc.TEXT'),
    value: 'waiting_since_asc',
@@ -85,7 +85,12 @@ export default {
        useAlert(this.$t('EMAIL_TRANSCRIPT.SEND_EMAIL_SUCCESS'));
        this.onCancel();
      } catch (error) {
-        useAlert(this.$t('EMAIL_TRANSCRIPT.SEND_EMAIL_ERROR'));
+        const status = error?.response?.status;
+        if (status === 402) {
+          useAlert(this.$t('EMAIL_TRANSCRIPT.SEND_EMAIL_PAYMENT_REQUIRED'));
+        } else {
+          useAlert(this.$t('EMAIL_TRANSCRIPT.SEND_EMAIL_ERROR'));
+        }
      } finally {
        this.isSubmitting = false;
      }
@@ -200,9 +200,13 @@ export default {
    },
    messagePlaceHolder() {
      if (this.isEditorDisabled) {
-        return this.isAWhatsAppChannel
-          ? this.$t('CONVERSATION.FOOTER.MESSAGING_RESTRICTED_WHATSAPP')
-          : this.$t('CONVERSATION.FOOTER.MESSAGING_RESTRICTED');
+        if (this.isAWhatsAppChannel) {
+          return this.$t('CONVERSATION.FOOTER.MESSAGING_RESTRICTED_WHATSAPP');
+        }
+        if (this.isAPIInbox) {
+          return this.$t('CONVERSATION.FOOTER.MESSAGING_RESTRICTED_API');
+        }
+        return this.$t('CONVERSATION.FOOTER.MESSAGING_RESTRICTED');
      }
      return this.isPrivate
        ? this.$t('CONVERSATION.FOOTER.PRIVATE_MSG_INPUT')
@@ -427,7 +431,7 @@ export default {
    },
    isEditorDisabled() {
      return (
-        this.isAWhatsAppChannel &&
+        (this.isAWhatsAppChannel || this.isAPIInbox) &&
        !this.isOnPrivateNote &&
        !this.currentChat.can_reply
      );
@@ -21,6 +21,7 @@ export default {
    PRIORITY_DESC: 'priority_desc',
    WAITING_SINCE_ASC: 'waiting_since_asc',
    WAITING_SINCE_DESC: 'waiting_since_desc',
+    PRIORITY_DESC_CREATED_AT_ASC: 'priority_desc_created_at_asc',
  },
  ARTICLE_STATUS_TYPES: {
    DRAFT: 0,
@@ -21,10 +21,8 @@ export const FEATURE_FLAGS = {
  AUDIT_LOGS: 'audit_logs',
  INBOX_VIEW: 'inbox_view',
  SLA: 'sla',
-  RESPONSE_BOT: 'response_bot',
  CHANNEL_EMAIL: 'channel_email',
  CHANNEL_FACEBOOK: 'channel_facebook',
-  CHANNEL_TWITTER: 'channel_twitter',
  CHANNEL_WEBSITE: 'channel_website',
  CUSTOM_REPLY_DOMAIN: 'custom_reply_domain',
  CUSTOM_REPLY_EMAIL: 'custom_reply_email',
@@ -36,7 +34,6 @@ export const FEATURE_FLAGS = {
  CAPTAIN: 'captain_integration',
  CUSTOM_ROLES: 'custom_roles',
  CHATWOOT_V4: 'chatwoot_v4',
-  REPORT_V4: 'report_v4',
  CHANNEL_INSTAGRAM: 'channel_instagram',
  CHANNEL_TIKTOK: 'channel_tiktok',
  CONTACT_CHATWOOT_SUPPORT_TEAM: 'contact_chatwoot_support_team',
@@ -13,7 +13,6 @@ const FEATURE_HELP_URLS = {
  integrations: 'https://chwt.app/hc/integrations',
  labels: 'https://chwt.app/hc/labels',
  macros: 'https://chwt.app/hc/macros',
-  message_reply_to: 'https://chwt.app/hc/reply-to',
  reports: 'https://chwt.app/hc/reports',
  sla: 'https://chwt.app/hc/sla',
  team_management: 'https://chwt.app/hc/teams',
@@ -76,6 +76,9 @@
      },
      "waiting_since_desc": {
        "TEXT": "Pending Response: Shortest first"
+      },
+      "priority_desc_created_at_asc": {
+        "TEXT": "Priority: Highest first, Created: Oldest first"
      }
    },
    "ATTACHMENTS": {
@@ -192,6 +192,7 @@
      "PRIVATE_MSG_INPUT": "Shift + enter for new line. This will be visible only to Agents",
      "MESSAGING_RESTRICTED": "You cannot reply to this conversation",
      "MESSAGING_RESTRICTED_WHATSAPP": "You can only reply using a template message due to 24-hour message window restriction",
+      "MESSAGING_RESTRICTED_API": "You can only reply using a template message due to message window restriction",
      "MESSAGE_SIGNATURE_NOT_CONFIGURED": "Message signature is not configured, please configure it in profile settings.",
      "COPILOT_MSG_INPUT": "Give copilot additional prompts, or ask anything else... Press enter to send follow-up",
      "CLICK_HERE": "Click here to update",
@@ -305,6 +306,7 @@
    "CANCEL": "Cancel",
    "SEND_EMAIL_SUCCESS": "The chat transcript was sent successfully",
    "SEND_EMAIL_ERROR": "There was an error, please try again",
+    "SEND_EMAIL_PAYMENT_REQUIRED": "Email transcript is not available on your current plan. Please upgrade to use this feature.",
    "FORM": {
      "SEND_TO_CONTACT": "Send the transcript to the customer",
      "SEND_TO_AGENT": "Send the transcript to the assigned agent",
@@ -31,6 +31,14 @@
    "WEBHOOK": {
      "SUBSCRIBED_EVENTS": "Subscribed Events",
      "LEARN_MORE": "Learn more about webhooks",
+      "SECRET": {
+        "LABEL": "Secret",
+        "COPY": "Copy secret to clipboard",
+        "COPY_SUCCESS": "Secret copied to clipboard",
+        "TOGGLE": "Toggle secret visibility",
+        "CREATED_DESC": "Your webhook has been created. Use the secret below to verify webhook signatures. Please copy it now — you can also find it later in the webhook edit form.",
+        "DONE": "Done"
+      },
      "COUNT": "{n} webhook | {n} webhooks",
      "SEARCH_PLACEHOLDER": "Search webhooks...",
      "NO_RESULTS": "No webhooks found matching your search",
@@ -58,6 +58,7 @@ export default {
    },
  },
  mounted() {
+    this.$store.dispatch('integrations/get', 'webhook');
    this.$store.dispatch('webhooks/get');
  },
  methods: {
@@ -1,60 +1,98 @@
-<script>
+<script setup>
+import { ref, computed } from 'vue';
+import { useI18n } from 'vue-i18n';
+import { useStore } from 'vuex';
 import { useAlert } from 'dashboard/composables';
 import { useBranding } from 'shared/composables/useBranding';
-import { mapGetters } from 'vuex';
+import { copyTextToClipboard } from 'shared/helpers/clipboard';
 import WebhookForm from './WebhookForm.vue';
+import NextButton from 'dashboard/components-next/button/Button.vue';

-export default {
-  components: { WebhookForm },
-  props: {
-    onClose: {
-      type: Function,
-      required: true,
-    },
-  },
-  setup() {
-    const { replaceInstallationName } = useBranding();
-    return {
-      replaceInstallationName,
-    };
-  },
-  computed: {
-    ...mapGetters({
-      uiFlags: 'webhooks/getUIFlags',
-    }),
-  },
-  methods: {
-    async onSubmit(webhook) {
-      try {
-        await this.$store.dispatch('webhooks/create', { webhook });
-        useAlert(
-          this.$t('INTEGRATION_SETTINGS.WEBHOOK.ADD.API.SUCCESS_MESSAGE')
-        );
-        this.onClose();
-      } catch (error) {
-        const message =
-          error.response.data.message ||
-          this.$t('INTEGRATION_SETTINGS.WEBHOOK.EDIT.API.ERROR_MESSAGE');
-        useAlert(message);
-      }
-    },
+const props = defineProps({
+  onClose: {
+    type: Function,
+    required: true,
  },
+});
+
+const { t } = useI18n();
+const store = useStore();
+const { replaceInstallationName } = useBranding();
+
+const createdWebhook = ref(null);
+
+const uiFlags = computed(() => store.getters['webhooks/getUIFlags']);
+
+const onSubmit = async webhook => {
+  try {
+    const result = await store.dispatch('webhooks/create', { webhook });
+    createdWebhook.value = result;
+  } catch (error) {
+    const message =
+      error.response.data.message ||
+      t('INTEGRATION_SETTINGS.WEBHOOK.EDIT.API.ERROR_MESSAGE');
+    useAlert(message);
+  }
+};
+
+const handleCopySecret = async () => {
+  await copyTextToClipboard(createdWebhook.value.secret);
+  useAlert(t('INTEGRATION_SETTINGS.WEBHOOK.SECRET.COPY_SUCCESS'));
 };
 </script>

 <template>
  <div class="h-auto overflow-auto flex flex-col">
-    <woot-modal-header
-      :header-title="$t('INTEGRATION_SETTINGS.WEBHOOK.ADD.TITLE')"
-      :header-content="
-        replaceInstallationName($t('INTEGRATION_SETTINGS.WEBHOOK.FORM.DESC'))
-      "
-    />
-    <WebhookForm
-      :is-submitting="uiFlags.creatingItem"
-      :submit-label="$t('INTEGRATION_SETTINGS.WEBHOOK.FORM.ADD_SUBMIT')"
-      @submit="onSubmit"
-      @cancel="onClose"
-    />
+    <template v-if="createdWebhook">
+      <woot-modal-header
+        :header-title="
+          t('INTEGRATION_SETTINGS.WEBHOOK.ADD.API.SUCCESS_MESSAGE')
+        "
+      />
+      <div class="px-8 pb-6">
+        <p class="text-sm text-n-slate-11 mb-4">
+          {{ t('INTEGRATION_SETTINGS.WEBHOOK.SECRET.CREATED_DESC') }}
+        </p>
+        <label>
+          {{ t('INTEGRATION_SETTINGS.WEBHOOK.SECRET.LABEL') }}
+          <div class="flex items-center gap-2">
+            <input
+              :value="createdWebhook.secret"
+              type="text"
+              readonly
+              class="!mb-0 font-mono"
+            />
+            <NextButton
+              v-tooltip.top="t('INTEGRATION_SETTINGS.WEBHOOK.SECRET.COPY')"
+              icon="i-lucide-copy"
+              slate
+              faded
+              @click="handleCopySecret"
+            />
+          </div>
+        </label>
+        <div class="flex justify-end mt-4">
+          <NextButton
+            blue
+            :label="t('INTEGRATION_SETTINGS.WEBHOOK.SECRET.DONE')"
+            @click="props.onClose()"
+          />
+        </div>
+      </div>
+    </template>
+    <template v-else>
+      <woot-modal-header
+        :header-title="t('INTEGRATION_SETTINGS.WEBHOOK.ADD.TITLE')"
+        :header-content="
+          replaceInstallationName(t('INTEGRATION_SETTINGS.WEBHOOK.FORM.DESC'))
+        "
+      />
+      <WebhookForm
+        :is-submitting="uiFlags.creatingItem"
+        :submit-label="t('INTEGRATION_SETTINGS.WEBHOOK.FORM.ADD_SUBMIT')"
+        @submit="onSubmit"
+        @cancel="props.onClose()"
+      />
+    </template>
  </div>
 </template>
@@ -3,6 +3,8 @@ import { useVuelidate } from '@vuelidate/core';
 import { required, url, minLength } from '@vuelidate/validators';
 import wootConstants from 'dashboard/constants/globals';
 import { getI18nKey } from 'dashboard/routes/dashboard/settings/helper/settingsHelper';
+import { copyTextToClipboard } from 'shared/helpers/clipboard';
+import { useAlert } from 'dashboard/composables';
 import NextButton from 'dashboard/components-next/button/Button.vue';

 const { EXAMPLE_WEBHOOK_URL } = wootConstants;
@@ -57,10 +59,14 @@ export default {
      url: this.value.url || '',
      name: this.value.name || '',
      subscriptions: this.value.subscriptions || [],
+      secretVisible: false,
      supportedWebhookEvents: SUPPORTED_WEBHOOK_EVENTS,
    };
  },
  computed: {
+    hasSecret() {
+      return !!this.value.secret;
+    },
    webhookURLInputPlaceholder() {
      return this.$t(
        'INTEGRATION_SETTINGS.WEBHOOK.FORM.END_POINT.PLACEHOLDER',
@@ -81,6 +87,10 @@ export default {
        subscriptions: this.subscriptions,
      });
    },
+    async copySecret() {
+      await copyTextToClipboard(this.value.secret);
+      useAlert(this.$t('INTEGRATION_SETTINGS.WEBHOOK.SECRET.COPY_SUCCESS'));
+    },
    getI18nKey,
  },
 };
@@ -111,6 +121,35 @@ export default {
          :placeholder="webhookNameInputPlaceholder"
        />
      </label>
+      <label v-if="hasSecret" class="mb-4">
+        {{ $t('INTEGRATION_SETTINGS.WEBHOOK.SECRET.LABEL') }}
+        <div class="flex items-center gap-2">
+          <input
+            :value="
+              secretVisible ? value.secret : '••••••••••••••••••••••••••••••••'
+            "
+            type="text"
+            readonly
+            class="!mb-0 font-mono"
+          />
+          <NextButton
+            v-tooltip.top="$t('INTEGRATION_SETTINGS.WEBHOOK.SECRET.TOGGLE')"
+            type="button"
+            :icon="secretVisible ? 'i-lucide-eye-off' : 'i-lucide-eye'"
+            slate
+            faded
+            @click="secretVisible = !secretVisible"
+          />
+          <NextButton
+            v-tooltip.top="$t('INTEGRATION_SETTINGS.WEBHOOK.SECRET.COPY')"
+            type="button"
+            icon="i-lucide-copy"
+            slate
+            faded
+            @click="copySecret"
+          />
+        </div>
+      </label>
      <label :class="{ error: v$.url.$error }" class="mb-2">
        {{ $t('INTEGRATION_SETTINGS.WEBHOOK.FORM.SUBSCRIPTIONS.LABEL') }}
      </label>
@@ -457,11 +457,7 @@ const actions = {
  },

  sendEmailTranscript: async (_, { conversationId, email }) => {
-    try {
-      await ConversationApi.sendEmailTranscript({ conversationId, email });
-    } catch (error) {
-      throw new Error(error);
-    }
+    await ConversationApi.sendEmailTranscript({ conversationId, email });
  },

  updateCustomAttributes: async (
@@ -116,6 +116,7 @@ const SORT_OPTIONS = {
  priority_desc: ['sortOnPriority', 'desc'],
  waiting_since_asc: ['sortOnWaitingSince', 'asc'],
  waiting_since_desc: ['sortOnWaitingSince', 'desc'],
+  priority_desc_created_at_asc: ['sortOnPriorityCreatedAt', 'desc'],
 };
 const sortAscending = (valueA, valueB) => valueA - valueB;
 const sortDescending = (valueA, valueB) => valueB - valueA;
@@ -139,6 +140,14 @@ const sortConfig = {
    return getSortOrderFunction(sortDirection)(p1, p2);
  },

+  sortOnPriorityCreatedAt: (a, b) => {
+    const DEFAULT_FOR_NULL = 0;
+    const p1 = CONVERSATION_PRIORITY_ORDER[a.priority] || DEFAULT_FOR_NULL;
+    const p2 = CONVERSATION_PRIORITY_ORDER[b.priority] || DEFAULT_FOR_NULL;
+    if (p1 !== p2) return p2 - p1;
+    return a.created_at - b.created_at;
+  },
+
  sortOnWaitingSince: (a, b, sortDirection) => {
    const sortFunc = getSortOrderFunction(sortDirection);
    if (!a.waiting_since || !b.waiting_since) {
@@ -42,6 +42,7 @@ export const actions = {
      } = response.data;
      commit(types.default.ADD_WEBHOOK, webhook);
      commit(types.default.SET_WEBHOOK_UI_FLAG, { creatingItem: false });
+      return webhook;
    } catch (error) {
      commit(types.default.SET_WEBHOOK_UI_FLAG, { creatingItem: false });
      throw error;
@@ -72,6 +72,10 @@ export default {
        return this.message.sender.available_name || this.message.sender.name;
      }

+      if (this.message.additional_attributes?.sender_name) {
+        return this.message.additional_attributes.sender_name;
+      }
+
      if (this.useInboxAvatarForBot) {
        return this.channelConfig.websiteName;
      }
@@ -87,9 +91,13 @@ export default {
        return displayImage;
      }

-      return this.message.sender
-        ? this.message.sender.avatar_url
-        : displayImage;
+      if (this.message.sender) {
+        return this.message.sender.avatar_url;
+      }
+
+      return (
+        this.message.additional_attributes?.sender_avatar_url || displayImage
+      );
    },
    hasRecordedResponse() {
      return (