Merge branch 'develop' into feat/ui-lib

app/javascript/dashboard/helper/AnalyticsHelper/events.js

@@ -131,3 +131,9 @@ export const LINEAR_EVENTS = Object.freeze({
   LINK_ISSUE: 'Linked a linear issue',
   UNLINK_ISSUE: 'Unlinked a linear issue',
 });
+
+export const YEAR_IN_REVIEW_EVENTS = Object.freeze({
+  MODAL_OPENED: 'Year in Review: Modal opened',
+  NEXT_CLICKED: 'Year in Review: Next clicked',
+  SHARE_CLICKED: 'Year in Review: Share clicked',
+});

app/javascript/dashboard/helper/Timer.js

@@ -0,0 +1,28 @@
+export default class Timer {
+  constructor(onTick = null) {
+    this.elapsed = 0;
+    this.intervalId = null;
+    this.onTick = onTick;
+  }
+
+  start() {
+    if (this.intervalId) {
+      clearInterval(this.intervalId);
+    }
+    this.elapsed = 0;
+    this.intervalId = setInterval(() => {
+      this.elapsed += 1;
+      if (this.onTick) {
+        this.onTick(this.elapsed);
+      }
+    }, 1000);
+  }
+
+  stop() {
+    if (this.intervalId) {
+      clearInterval(this.intervalId);
+      this.intervalId = null;
+    }
+    this.elapsed = 0;
+  }
+}

app/javascript/dashboard/helper/editorHelper.js

@@ -5,11 +5,8 @@ import {
 } from '@chatwoot/prosemirror-schema';
 import { replaceVariablesInMessage } from '@chatwoot/utils';
 import * as Sentry from '@sentry/vue';
-import {
-  FORMATTING,
-  MARKDOWN_PATTERNS,
-  CHANNEL_WITH_RICH_SIGNATURE,
-} from 'dashboard/constants/editor';
+import { FORMATTING, MARKDOWN_PATTERNS } from 'dashboard/constants/editor';
+import { INBOX_TYPES, TWILIO_CHANNEL_MEDIUM } from 'dashboard/helper/inbox';
 import camelcaseKeys from 'camelcase-keys';
 
 /**
@@ -35,6 +32,56 @@ export function extractTextFromMarkdown(markdown) {
     .trim(); // Trim any extra space
 }
 
+/**
+ * Strip unsupported markdown formatting based on channel capabilities.
+ *
+ * @param {string} markdown - markdown text to process
+ * @param {string} channelType - The channel type to check supported formatting
+ * @returns {string} - The markdown with unsupported formatting removed
+ */
+export function stripUnsupportedSignatureMarkdown(markdown, channelType) {
+  if (!markdown) return '';
+
+  const { marks = [], nodes = [] } = FORMATTING[channelType] || {};
+  const has = (arr, key) => arr.includes(key);
+
+  // Define stripping rules: [condition, pattern, replacement]
+  const rules = [
+    [!has(nodes, 'image'), /!\[.*?\]\(.*?\)/g, ''],
+    [!has(marks, 'link'), /\[([^\]]+)\]\([^)]+\)/g, '$1'],
+    [!has(nodes, 'codeBlock'), /```[\s\S]*?```/g, ''],
+    [!has(marks, 'code'), /`([^`]+)`/g, '$1'],
+    [!has(marks, 'strong'), /\*\*([^*]+)\*\*/g, '$1'],
+    [!has(marks, 'strong'), /__([^_]+)__/g, '$1'],
+    [!has(marks, 'em'), /\*([^*]+)\*/g, '$1'],
+    // Match _text_ only at word boundaries (whitespace/string start/end)
+    // Preserves underscores in URLs (e.g., https://example.com/path_name) and variable names
+    [
+      !has(marks, 'em'),
+      /(?<=^|[\s])_([^_\s][^_]*[^_\s]|[^_\s])_(?=$|[\s])/g,
+      '$1',
+    ],
+    [!has(marks, 'strike'), /~~([^~]+)~~/g, '$1'],
+    [!has(nodes, 'blockquote'), /^>\s?/gm, ''],
+    [!has(nodes, 'bulletList'), /^[-*+]\s+/gm, ''],
+    [!has(nodes, 'orderedList'), /^\d+\.\s+/gm, ''],
+  ];
+
+  const result = rules.reduce(
+    (text, [shouldStrip, pattern, replacement]) =>
+      shouldStrip ? text.replace(pattern, replacement) : text,
+    markdown
+  );
+
+  return result
+    .split('\n')
+    .map(line => line.trim())
+    .filter(Boolean)
+    .join('\n')
+    .replace(/\n{2,}/g, '\n')
+    .trim();
+}
+
 /**
  * The delimiter used to separate the signature from the rest of the body.
  * @type {string}
@@ -97,29 +144,36 @@ export function findSignatureInBody(body, signature) {
 }
 
 /**
- * Checks if the channel supports image signatures.
+ * Gets the effective channel type for formatting purposes.
+ * For Twilio channels, returns WhatsApp or Twilio based on medium.
  *
- * @param {string} channelType - The channel type.
- * @returns {boolean} - True if the channel supports image signatures.
+ * @param {string} channelType - The channel type
+ * @param {string} medium - Optional. The medium for Twilio channels (sms/whatsapp)
+ * @returns {string} - The effective channel type for formatting
  */
-export function supportsImageSignature(channelType) {
-  return CHANNEL_WITH_RICH_SIGNATURE.includes(channelType);
+export function getEffectiveChannelType(channelType, medium) {
+  if (channelType === INBOX_TYPES.TWILIO) {
+    return medium === TWILIO_CHANNEL_MEDIUM.WHATSAPP
+      ? INBOX_TYPES.WHATSAPP
+      : INBOX_TYPES.TWILIO;
+  }
+  return channelType;
 }
 
 /**
  * Appends the signature to the body, separated by the signature delimiter.
- * Automatically strips images for channels that don't support image signatures.
+ * Automatically strips unsupported formatting based on channel capabilities.
  *
  * @param {string} body - The body to append the signature to.
  * @param {string} signature - The signature to append.
- * @param {string} channelType - Optional. The channel type to determine if images should be stripped.
+ * @param {string} channelType - Optional. The effective channel type to determine supported formatting.
+ *                               For Twilio channels, pass the result of getEffectiveChannelType().
  * @returns {string} - The body with the signature appended.
  */
 export function appendSignature(body, signature, channelType) {
-  // For channels that don't support images, strip markdown formatting
-  const shouldStripImages = channelType && !supportsImageSignature(channelType);
-  const preparedSignature = shouldStripImages
-    ? extractTextFromMarkdown(signature)
+  // Strip only unsupported formatting based on channel capabilities
+  const preparedSignature = channelType
+    ? stripUnsupportedSignatureMarkdown(signature, channelType)
     : signature;
   const cleanedSignature = cleanSignature(preparedSignature);
   // if signature is already present, return body
@@ -132,21 +186,28 @@ export function appendSignature(body, signature, channelType) {
 
 /**
  * Removes the signature from the body, along with the signature delimiter.
- * Tries to find both the original signature and the stripped version (for non-image channels).
+ * Tries to find both the original signature and the stripped version.
  *
  * @param {string} body - The body to remove the signature from.
  * @param {string} signature - The signature to remove.
+ * @param {string} channelType - Optional. The effective channel type for channel-specific stripping.
+ *                               For Twilio channels, pass the result of getEffectiveChannelType().
  * @returns {string} - The body with the signature removed.
  */
-export function removeSignature(body, signature) {
-  // Build list of signatures to try: original first, then stripped version
-  // Always try both to handle cases where channelType is unknown or inbox is being removed
+export function removeSignature(body, signature, channelType) {
+  // Build list of signatures to try: original, channel-stripped, and fully stripped
   const cleanedSignature = cleanSignature(signature);
-  const strippedSignature = cleanSignature(extractTextFromMarkdown(signature));
-  const signaturesToTry =
-    cleanedSignature === strippedSignature
-      ? [cleanedSignature]
-      : [cleanedSignature, strippedSignature];
+  const channelStripped = channelType
+    ? cleanSignature(stripUnsupportedSignatureMarkdown(signature, channelType))
+    : null;
+  const fullyStripped = cleanSignature(extractTextFromMarkdown(signature));
+
+  // Try signatures in order: original → channel-specific → fully stripped
+  const signaturesToTry = [
+    cleanedSignature,
+    channelStripped,
+    fullyStripped,
+  ].filter((sig, i, arr) => sig && arr.indexOf(sig) === i); // Remove nulls and duplicates
 
   // Find the first matching signature
   const signatureIndex = signaturesToTry.reduce(

app/javascript/dashboard/helper/inbox.js

@@ -10,9 +10,15 @@ export const INBOX_TYPES = {
   LINE: 'Channel::Line',
   SMS: 'Channel::Sms',
   INSTAGRAM: 'Channel::Instagram',
+  TIKTOK: 'Channel::Tiktok',
   VOICE: 'Channel::Voice',
 };
 
+export const TWILIO_CHANNEL_MEDIUM = {
+  WHATSAPP: 'whatsapp',
+  SMS: 'sms',
+};
+
 const INBOX_ICON_MAP_FILL = {
   [INBOX_TYPES.WEB]: 'i-ri-global-fill',
   [INBOX_TYPES.FB]: 'i-ri-messenger-fill',
@@ -23,6 +29,7 @@ const INBOX_ICON_MAP_FILL = {
   [INBOX_TYPES.TELEGRAM]: 'i-ri-telegram-fill',
   [INBOX_TYPES.LINE]: 'i-ri-line-fill',
   [INBOX_TYPES.INSTAGRAM]: 'i-ri-instagram-fill',
+  [INBOX_TYPES.TIKTOK]: 'i-ri-tiktok-fill',
   [INBOX_TYPES.VOICE]: 'i-ri-phone-fill',
 };
 
@@ -38,6 +45,7 @@ const INBOX_ICON_MAP_LINE = {
   [INBOX_TYPES.TELEGRAM]: 'i-ri-telegram-line',
   [INBOX_TYPES.LINE]: 'i-ri-line-line',
   [INBOX_TYPES.INSTAGRAM]: 'i-ri-instagram-line',
+  [INBOX_TYPES.TIKTOK]: 'i-ri-tiktok-line',
   [INBOX_TYPES.VOICE]: 'i-ri-phone-line',
 };
 
@@ -131,6 +139,9 @@ export const getInboxClassByType = (type, phoneNumber) => {
     case INBOX_TYPES.INSTAGRAM:
       return 'brand-instagram';
 
+    case INBOX_TYPES.TIKTOK:
+      return 'brand-tiktok';
+
     case INBOX_TYPES.VOICE:
       return 'phone';
 

app/javascript/dashboard/helper/specs/Timer.spec.js

@@ -0,0 +1,113 @@
+import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
+import Timer from '../Timer';
+
+describe('Timer', () => {
+  beforeEach(() => {
+    vi.useFakeTimers();
+  });
+
+  afterEach(() => {
+    vi.restoreAllMocks();
+    vi.useRealTimers();
+  });
+
+  describe('constructor', () => {
+    it('initializes with elapsed 0 and no interval', () => {
+      const timer = new Timer();
+      expect(timer.elapsed).toBe(0);
+      expect(timer.intervalId).toBeNull();
+    });
+
+    it('accepts an onTick callback', () => {
+      const onTick = vi.fn();
+      const timer = new Timer(onTick);
+      expect(timer.onTick).toBe(onTick);
+    });
+  });
+
+  describe('start', () => {
+    it('starts the timer and increments elapsed every second', () => {
+      const timer = new Timer();
+      timer.start();
+
+      expect(timer.elapsed).toBe(0);
+
+      vi.advanceTimersByTime(1000);
+      expect(timer.elapsed).toBe(1);
+
+      vi.advanceTimersByTime(1000);
+      expect(timer.elapsed).toBe(2);
+
+      vi.advanceTimersByTime(3000);
+      expect(timer.elapsed).toBe(5);
+    });
+
+    it('calls onTick callback with elapsed value', () => {
+      const onTick = vi.fn();
+      const timer = new Timer(onTick);
+      timer.start();
+
+      vi.advanceTimersByTime(1000);
+      expect(onTick).toHaveBeenCalledWith(1);
+
+      vi.advanceTimersByTime(1000);
+      expect(onTick).toHaveBeenCalledWith(2);
+
+      expect(onTick).toHaveBeenCalledTimes(2);
+    });
+
+    it('resets elapsed to 0 when restarted', () => {
+      const timer = new Timer();
+      timer.start();
+
+      vi.advanceTimersByTime(5000);
+      expect(timer.elapsed).toBe(5);
+
+      timer.start();
+      expect(timer.elapsed).toBe(0);
+
+      vi.advanceTimersByTime(2000);
+      expect(timer.elapsed).toBe(2);
+    });
+
+    it('clears previous interval when restarted', () => {
+      const timer = new Timer();
+      timer.start();
+      const firstIntervalId = timer.intervalId;
+
+      timer.start();
+      expect(timer.intervalId).not.toBe(firstIntervalId);
+    });
+  });
+
+  describe('stop', () => {
+    it('stops the timer and resets elapsed to 0', () => {
+      const timer = new Timer();
+      timer.start();
+
+      vi.advanceTimersByTime(3000);
+      expect(timer.elapsed).toBe(3);
+
+      timer.stop();
+      expect(timer.elapsed).toBe(0);
+      expect(timer.intervalId).toBeNull();
+    });
+
+    it('prevents further increments after stopping', () => {
+      const timer = new Timer();
+      timer.start();
+
+      vi.advanceTimersByTime(2000);
+      timer.stop();
+
+      vi.advanceTimersByTime(5000);
+      expect(timer.elapsed).toBe(0);
+    });
+
+    it('handles stop when timer is not running', () => {
+      const timer = new Timer();
+      expect(() => timer.stop()).not.toThrow();
+      expect(timer.elapsed).toBe(0);
+    });
+  });
+});

app/javascript/dashboard/helper/specs/editorHelper.spec.js

@@ -5,7 +5,7 @@ import {
   replaceSignature,
   cleanSignature,
   extractTextFromMarkdown,
-  supportsImageSignature,
+  stripUnsupportedSignatureMarkdown,
   insertAtCursor,
   findNodeToInsertImage,
   setURLWithQueryAndSize,
@@ -145,10 +145,63 @@ describe('appendSignature', () => {
   });
 });
 
+describe('stripUnsupportedSignatureMarkdown', () => {
+  const richSignature =
+    '**Bold** _italic_ [link](http://example.com) ![](http://localhost:3000/image.png)';
+
+  it('keeps all formatting for Email channel (supports image, link, strong, em)', () => {
+    const result = stripUnsupportedSignatureMarkdown(
+      richSignature,
+      'Channel::Email'
+    );
+    expect(result).toContain('**Bold**');
+    expect(result).toContain('_italic_');
+    expect(result).toContain('[link](http://example.com)');
+    expect(result).toContain('![](http://localhost:3000/image.png)');
+  });
+  it('strips images but keeps bold/italic for Api channel', () => {
+    const result = stripUnsupportedSignatureMarkdown(
+      richSignature,
+      'Channel::Api'
+    );
+    expect(result).toContain('**Bold**');
+    expect(result).toContain('_italic_');
+    expect(result).toContain('link'); // link text kept
+    expect(result).not.toContain('[link]('); // link syntax removed
+    expect(result).not.toContain('![]('); // image removed
+  });
+  it('strips images but keeps bold/italic/link for Telegram channel', () => {
+    const result = stripUnsupportedSignatureMarkdown(
+      richSignature,
+      'Channel::Telegram'
+    );
+    expect(result).toContain('**Bold**');
+    expect(result).toContain('_italic_');
+    expect(result).toContain('[link](http://example.com)');
+    expect(result).not.toContain('![](');
+  });
+  it('strips all formatting for SMS channel', () => {
+    const result = stripUnsupportedSignatureMarkdown(
+      richSignature,
+      'Channel::Sms'
+    );
+    expect(result).toContain('Bold');
+    expect(result).toContain('italic');
+    expect(result).toContain('link');
+    expect(result).not.toContain('**');
+    expect(result).not.toContain('_');
+    expect(result).not.toContain('[');
+    expect(result).not.toContain('![](');
+  });
+  it('returns empty string for empty input', () => {
+    expect(stripUnsupportedSignatureMarkdown('', 'Channel::Api')).toBe('');
+    expect(stripUnsupportedSignatureMarkdown(null, 'Channel::Api')).toBe('');
+  });
+});
+
 describe('appendSignature with channelType', () => {
   const signatureWithImage =
     'Thanks\n![](http://localhost:3000/image.png?cw_image_height=24px)';
-  const strippedSignature = 'Thanks';
 
   it('keeps images for Email channel', () => {
     const result = appendSignature(
@@ -166,24 +219,31 @@ describe('appendSignature with channelType', () => {
     );
     expect(result).toContain('![](http://localhost:3000/image.png');
   });
-  it('strips images for Api channel', () => {
+  it('strips images but keeps text for Api channel', () => {
     const result = appendSignature('Hello', signatureWithImage, 'Channel::Api');
     expect(result).not.toContain('![](');
-    expect(result).toContain(strippedSignature);
+    expect(result).toContain('Thanks');
   });
-  it('strips images for WhatsApp channel', () => {
+  it('strips images but keeps text for WhatsApp channel', () => {
     const result = appendSignature(
       'Hello',
       signatureWithImage,
       'Channel::Whatsapp'
     );
     expect(result).not.toContain('![](');
-    expect(result).toContain(strippedSignature);
+    expect(result).toContain('Thanks');
   });
   it('keeps images when channelType is not provided', () => {
     const result = appendSignature('Hello', signatureWithImage);
     expect(result).toContain('![](http://localhost:3000/image.png');
   });
+  it('keeps bold/italic for channels that support them', () => {
+    const boldSignature = '**Bold** *italic* Thanks';
+    const result = appendSignature('Hello', boldSignature, 'Channel::Api');
+    // Api supports strong and em
+    expect(result).toContain('**Bold**');
+    expect(result).toContain('*italic*');
+  });
 });
 
 describe('cleanSignature', () => {
@@ -331,24 +391,6 @@ describe('extractTextFromMarkdown', () => {
   });
 });
 
-describe('supportsImageSignature', () => {
-  it('returns true for Email channel', () => {
-    expect(supportsImageSignature('Channel::Email')).toBe(true);
-  });
-  it('returns true for WebWidget channel', () => {
-    expect(supportsImageSignature('Channel::WebWidget')).toBe(true);
-  });
-  it('returns false for Api channel', () => {
-    expect(supportsImageSignature('Channel::Api')).toBe(false);
-  });
-  it('returns false for WhatsApp channel', () => {
-    expect(supportsImageSignature('Channel::Whatsapp')).toBe(false);
-  });
-  it('returns false for Telegram channel', () => {
-    expect(supportsImageSignature('Channel::Telegram')).toBe(false);
-  });
-});
-
 describe('insertAtCursor', () => {
   it('should return undefined if editorView is not provided', () => {
     const result = insertAtCursor(undefined, schema.text('Hello'), 0);
@@ -884,6 +926,26 @@ describe('stripUnsupportedFormatting', () => {
       );
     });
 
+    it('preserves underscores in URLs and mid-word positions', () => {
+      // Underscores in URLs should not be stripped as italic formatting
+      expect(
+        stripUnsupportedFormatting(
+          'https://www.chatwoot.com/new_first_second-third/ssd',
+          emptySchema
+        )
+      ).toBe('https://www.chatwoot.com/new_first_second-third/ssd');
+
+      // Underscores in variable names should not be stripped
+      expect(
+        stripUnsupportedFormatting('some_variable_name', emptySchema)
+      ).toBe('some_variable_name');
+
+      // But actual italic formatting with spaces should still be stripped
+      expect(
+        stripUnsupportedFormatting('hello _world_ there', emptySchema)
+      ).toBe('hello world there');
+    });
+
     it('strips inline code formatting', () => {
       expect(stripUnsupportedFormatting('`inline code`', emptySchema)).toBe(
         'inline code'

app/javascript/dashboard/helper/specs/inbox.spec.js

@@ -38,6 +38,9 @@ describe('#Inbox Helpers', () => {
     it('should return correct class for Email', () => {
       expect(getInboxClassByType('Channel::Email')).toEqual('mail');
     });
+    it('should return correct class for TikTok', () => {
+      expect(getInboxClassByType(INBOX_TYPES.TIKTOK)).toEqual('brand-tiktok');
+    });
   });
 
   describe('getInboxIconByType', () => {
@@ -80,6 +83,10 @@ describe('#Inbox Helpers', () => {
         expect(getInboxIconByType(INBOX_TYPES.LINE)).toBe('i-ri-line-fill');
       });
 
+      it('returns correct icon for TikTok', () => {
+        expect(getInboxIconByType(INBOX_TYPES.TIKTOK)).toBe('i-ri-tiktok-fill');
+      });
+
       it('returns default icon for unknown type', () => {
         expect(getInboxIconByType('UNKNOWN_TYPE')).toBe('i-ri-chat-1-fill');
       });
@@ -102,6 +109,12 @@ describe('#Inbox Helpers', () => {
         );
       });
 
+      it('returns correct line icon for TikTok', () => {
+        expect(getInboxIconByType(INBOX_TYPES.TIKTOK, null, 'line')).toBe(
+          'i-ri-tiktok-line'
+        );
+      });
+
       it('returns correct line icon for unknown type', () => {
         expect(getInboxIconByType('UNKNOWN_TYPE', null, 'line')).toBe(
           'i-ri-chat-1-line'

app/javascript/dashboard/helper/voice.js

@@ -0,0 +1,79 @@
+import { CONTENT_TYPES } from 'dashboard/components-next/message/constants';
+import { useCallsStore } from 'dashboard/stores/calls';
+import types from 'dashboard/store/mutation-types';
+
+export const TERMINAL_STATUSES = [
+  'completed',
+  'busy',
+  'failed',
+  'no-answer',
+  'canceled',
+  'missed',
+  'ended',
+];
+
+export const isInbound = direction => direction === 'inbound';
+
+const isVoiceCallMessage = message => {
+  return CONTENT_TYPES.VOICE_CALL === message?.content_type;
+};
+
+const shouldSkipCall = (callDirection, senderId, currentUserId) => {
+  return callDirection === 'outbound' && senderId !== currentUserId;
+};
+
+function extractCallData(message) {
+  const contentData = message?.content_attributes?.data || {};
+  return {
+    callSid: contentData.call_sid,
+    status: contentData.status,
+    callDirection: contentData.call_direction,
+    conversationId: message?.conversation_id,
+    senderId: message?.sender?.id,
+  };
+}
+
+export function handleVoiceCallCreated(message, currentUserId) {
+  if (!isVoiceCallMessage(message)) return;
+
+  const { callSid, callDirection, conversationId, senderId } =
+    extractCallData(message);
+
+  if (shouldSkipCall(callDirection, senderId, currentUserId)) return;
+
+  const callsStore = useCallsStore();
+  callsStore.addCall({
+    callSid,
+    conversationId,
+    callDirection,
+    senderId,
+  });
+}
+
+export function handleVoiceCallUpdated(commit, message, currentUserId) {
+  if (!isVoiceCallMessage(message)) return;
+
+  const { callSid, status, callDirection, conversationId, senderId } =
+    extractCallData(message);
+
+  const callsStore = useCallsStore();
+
+  callsStore.handleCallStatusChanged({ callSid, status, conversationId });
+
+  const callInfo = { conversationId, callStatus: status };
+  commit(types.UPDATE_CONVERSATION_CALL_STATUS, callInfo);
+  commit(types.UPDATE_MESSAGE_CALL_STATUS, callInfo);
+
+  const isNewCall =
+    status === 'ringing' &&
+    !shouldSkipCall(callDirection, senderId, currentUserId);
+
+  if (isNewCall) {
+    callsStore.addCall({
+      callSid,
+      conversationId,
+      callDirection,
+      senderId,
+    });
+  }
+}