From b7f3f72b9c2e171f37af252c30a19d29a80a03f0 Mon Sep 17 00:00:00 2001
From: Shivam Mishra <scm.mymail@gmail.com>
Date: Fri, 27 Jun 2025 10:48:07 +0530
Subject: [PATCH 01/31] fix: Reply time calculation for re-opened conversations
 (#11787)

This PR fixes the reply time calculation for reopened conversations.
Previously, when a customer sent a message to reopen a resolved
conversation, the reply time metric would be calculated incorrectly
because the `waiting_since` timestamp was not properly set before the
reply event was dispatched. This would create a case where you'd have
reporting events like the following

```
[[33955732, "reply_time", 19.0],
 [33955847, "reply_time", 24.0],
 [33955666, "reply_time", 89.0],
 [33955530, "conversation_bot_handoff", 4.0],
 [33955567, "first_response", 42.0],
 [33955745, "reply_time", 21.0],
 [33955934, "reply_time", 49.0],
 [33955906, "reply_time", 121.0],
 [33987938, "conversation_resolved", 26285.0],
 [35571005, "reply_time", 985492.0]]
```
Note the `reply_time` after `conversation_resolved`

The fix ensures that `waiting_since` is correctly updated when
conversations are reopened, either through incoming messages or manual
status changes, resulting in accurate reply time metrics that measure
only the time from the customer's new message to the agent's response.

## Type of change

Please delete options that are not relevant.

- [x] Bug fix (non-breaking change which fixes an issue)

## How Has This Been Tested?

The changes have been tested with comprehensive specs that verify:

1. **Reply time calculation after conversation reopening** - Ensures
correct timestamps are used when calculating reply times for reopened
conversations
2. **Waiting since updates on status changes** - Verifies that
`waiting_since` is properly set when conversation status changes from
resolved to open
3. **Test the happy path** - Happy path is tested to ensure the
`reply_time` and `first_response_time` is correctly calculated

Test instructions:
1. Create a conversation with the last message from a customer and
resolve it
2. Have an agent reopen it and reply to it
4. When an agent replies, verify that the agent reply_time event is not
created for this message

To fix any existing data, I've written a small script:
https://gist.github.com/scmmishra/fdf458863f2d971978327bbfd5232d0c

---------

Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com>
---
 app/listeners/reporting_event_listener.rb     |   4 +
 app/models/conversation.rb                    |  10 ++
 .../reporting_event_listener_spec.rb          | 110 +++++++++++++++++
 spec/models/conversation_spec.rb              | 113 ++++++++++++++++++
 4 files changed, 237 insertions(+)

diff --git a/app/listeners/reporting_event_listener.rb b/app/listeners/reporting_event_listener.rb
index b31d899bb..9f22fe8de 100644
--- a/app/listeners/reporting_event_listener.rb
+++ b/app/listeners/reporting_event_listener.rb
@@ -47,6 +47,10 @@ class ReportingEventListener < BaseListener
     message = extract_message_and_account(event)[0]
     conversation = message.conversation
     waiting_since = event.data[:waiting_since]
+
+    return if waiting_since.blank?
+
+    # When waiting_since is nil, set reply_time to 0
     reply_time = message.created_at.to_i - waiting_since.to_i
 
     reporting_event = ReportingEvent.new(
diff --git a/app/models/conversation.rb b/app/models/conversation.rb
index 922118b09..d6c5d0e4a 100644
--- a/app/models/conversation.rb
+++ b/app/models/conversation.rb
@@ -198,11 +198,21 @@ class Conversation < ApplicationRecord
   private
 
   def execute_after_update_commit_callbacks
+    handle_resolved_status_change
     notify_status_change
     create_activity
     notify_conversation_updation
   end
 
+  def handle_resolved_status_change
+    # When conversation is resolved, clear waiting_since using update_column to avoid callbacks
+    return unless saved_change_to_status? && status == 'resolved'
+
+    # rubocop:disable Rails/SkipsModelValidations
+    update_column(:waiting_since, nil)
+    # rubocop:enable Rails/SkipsModelValidations
+  end
+
   def ensure_snooze_until_reset
     self.snoozed_until = nil unless snoozed?
   end
diff --git a/spec/listeners/reporting_event_listener_spec.rb b/spec/listeners/reporting_event_listener_spec.rb
index 9a6b8d123..0edf79556 100644
--- a/spec/listeners/reporting_event_listener_spec.rb
+++ b/spec/listeners/reporting_event_listener_spec.rb
@@ -66,6 +66,34 @@ describe ReportingEventListener do
   end
 
   describe '#reply_created' do
+    let(:contact) { create(:contact, account: account) }
+
+    def create_customer_message(conversation, created_at: Time.current)
+      create(:message,
+             message_type: 'incoming',
+             account: account,
+             inbox: inbox,
+             conversation: conversation,
+             sender: contact,
+             created_at: created_at)
+    end
+
+    def create_agent_message(conversation, created_at: Time.current, sender: user)
+      create(:message,
+             message_type: 'outgoing',
+             account: account,
+             inbox: inbox,
+             conversation: conversation,
+             sender: sender,
+             created_at: created_at)
+    end
+
+    def create_reply_event(agent_message, waiting_since, event_time = nil)
+      Events::Base.new('reply.created', event_time || agent_message.created_at,
+                       waiting_since: waiting_since,
+                       message: agent_message)
+    end
+
     it 'creates reply created event' do
       event = Events::Base.new('reply.created', Time.zone.now, waiting_since: 2.hours.ago, message: message)
       listener.reply_created(event)
@@ -74,6 +102,88 @@ describe ReportingEventListener do
       expect(events.length).to be 1
       expect(events.first.value).to be_within(1).of(7200)
     end
+
+    context 'when conversation is reopened' do
+      let(:resolved_conversation) do
+        create(:conversation, account: account, inbox: inbox, assignee: user,
+                              status: 'resolved', contact: contact)
+      end
+
+      context 'when customer sends message after resolution' do
+        it 'calculates reply time from the reopening message' do
+          customer_message_time = 3.hours.ago
+          create_customer_message(resolved_conversation, created_at: customer_message_time)
+
+          resolved_conversation.reload
+          expect(resolved_conversation.status).to eq('open')
+
+          agent_reply_time = 1.hour.ago
+          agent_message = create_agent_message(resolved_conversation, created_at: agent_reply_time)
+
+          event = create_reply_event(agent_message, customer_message_time)
+          listener.reply_created(event)
+
+          events = account.reporting_events.where(name: 'reply_time', conversation_id: resolved_conversation.id)
+          expect(events.length).to be 1
+          expect(events.first.value).to be_within(60).of(7200)
+        end
+      end
+
+      context 'when conversation has multiple reopenings' do
+        it 'tracks reply time correctly for each reopening' do
+          create_customer_message(resolved_conversation, created_at: 5.hours.ago)
+          first_agent_reply = create_agent_message(resolved_conversation, created_at: 4.hours.ago)
+
+          event = create_reply_event(first_agent_reply, 5.hours.ago)
+          listener.reply_created(event)
+
+          resolved_conversation.update!(status: 'resolved')
+
+          create_customer_message(resolved_conversation, created_at: 2.hours.ago)
+          second_agent_reply = create_agent_message(resolved_conversation, created_at: 1.5.hours.ago)
+
+          event = create_reply_event(second_agent_reply, 2.hours.ago)
+          listener.reply_created(event)
+
+          events = account.reporting_events.where(name: 'reply_time', conversation_id: resolved_conversation.id)
+                          .order(created_at: :asc)
+          expect(events.length).to be 2
+          expect(events.first.value).to be_within(60).of(3600)
+          expect(events.second.value).to be_within(60).of(1800)
+        end
+      end
+
+      context 'when conversation is manually reopened' do
+        it 'sets waiting_since when first customer message arrives after manual reopening' do
+          resolved_conversation.update!(status: 'open')
+
+          customer_message_time = 1.hour.ago
+          create_customer_message(resolved_conversation, created_at: customer_message_time)
+
+          agent_reply_time = 15.minutes.ago
+          agent_message = create_agent_message(resolved_conversation, created_at: agent_reply_time)
+
+          event = create_reply_event(agent_message, customer_message_time)
+          listener.reply_created(event)
+
+          events = account.reporting_events.where(name: 'reply_time', conversation_id: resolved_conversation.id)
+          expect(events.length).to be 1
+          expect(events.first.value).to be_within(60).of(2700)
+        end
+      end
+
+      context 'when waiting_since is nil' do
+        it 'does not creates reply time events' do
+          agent_message = create_agent_message(resolved_conversation)
+
+          event = create_reply_event(agent_message, nil)
+          listener.reply_created(event)
+
+          events = account.reporting_events.where(name: 'reply_time', conversation_id: resolved_conversation.id)
+          expect(events.length).to be 0
+        end
+      end
+    end
   end
 
   describe '#first_reply_created' do
diff --git a/spec/models/conversation_spec.rb b/spec/models/conversation_spec.rb
index aef91603d..a29359528 100644
--- a/spec/models/conversation_spec.rb
+++ b/spec/models/conversation_spec.rb
@@ -836,4 +836,117 @@ RSpec.describe Conversation do
       expect(message_window_service).to have_received(:can_reply?)
     end
   end
+
+  describe 'reply time calculation flows' do
+    include ActiveJob::TestHelper
+
+    let(:account) { create(:account) }
+    let(:inbox) { create(:inbox, account: account) }
+    let(:contact) { create(:contact, account: account) }
+    let(:agent) { create(:user, account: account, role: :agent) }
+    let(:conversation) { create(:conversation, account: account, inbox: inbox, contact: contact, assignee: agent, waiting_since: nil) }
+    let(:conversation_start_time) { 5.hours.ago }
+
+    before do
+      create(:inbox_member, user: agent, inbox: inbox)
+      # rubocop:disable Rails/SkipsModelValidations
+      conversation.update_column(:waiting_since, nil)
+      conversation.update_column(:created_at, conversation_start_time)
+      # rubocop:enable Rails/SkipsModelValidations
+      conversation.messages.destroy_all
+      conversation.reporting_events.destroy_all
+      conversation.reload
+    end
+
+    def create_customer_message(conversation, created_at: Time.current)
+      message = nil
+      perform_enqueued_jobs do
+        message = create(:message,
+                         message_type: 'incoming',
+                         account: conversation.account,
+                         inbox: conversation.inbox,
+                         conversation: conversation,
+                         sender: conversation.contact,
+                         created_at: created_at)
+      end
+      message
+    end
+
+    def create_agent_message(conversation, created_at: Time.current)
+      message = nil
+      perform_enqueued_jobs do
+        message = create(:message,
+                         message_type: 'outgoing',
+                         account: conversation.account,
+                         inbox: conversation.inbox,
+                         conversation: conversation,
+                         sender: conversation.assignee,
+                         created_at: created_at)
+      end
+      message
+    end
+
+    it 'correctly tracks waiting_since and creates first response time events' do
+      create_customer_message(conversation, created_at: conversation_start_time)
+      conversation.reload
+      expect(conversation.waiting_since).to be_within(1.second).of(conversation_start_time)
+
+      # Agent replies - this should create first response event
+      agent_reply1_time = 4.hours.ago
+      create_agent_message(conversation, created_at: agent_reply1_time)
+
+      first_response_events = account.reporting_events.where(name: 'first_response', conversation_id: conversation.id)
+      expect(first_response_events.count).to eq(1)
+      expect(first_response_events.first.value).to be_within(1.second).of(1.hour)
+
+      # the first response should also clear the waiting_since
+      conversation.reload
+      expect(conversation.waiting_since).to be_nil
+    end
+
+    it 'does not reset waiting_since if customer sends another message' do
+      create_customer_message(conversation, created_at: conversation_start_time)
+      conversation.reload
+      expect(conversation.waiting_since).to be_within(1.second).of(conversation_start_time)
+
+      create_customer_message(conversation, created_at: 3.hours.ago)
+      conversation.reload
+      expect(conversation.waiting_since).to be_within(1.second).of(conversation_start_time)
+    end
+
+    it 'records the correct reply_time for subsequent messages' do
+      create_customer_message(conversation, created_at: conversation_start_time)
+      create_agent_message(conversation, created_at: 4.hours.ago)
+      create_customer_message(conversation, created_at: 3.hours.ago)
+
+      create_agent_message(conversation, created_at: 2.hours.ago)
+      reply_events = account.reporting_events.where(name: 'reply_time', conversation_id: conversation.id)
+      expect(reply_events.count).to eq(1)
+      expect(reply_events.first.value).to be_within(1.second).of(1.hour)
+
+      conversation.reload
+      expect(conversation.waiting_since).to be_nil
+    end
+
+    it 'records zero reply time if an agent sends a message after resolution' do
+      create_customer_message(conversation, created_at: conversation_start_time)
+      create_agent_message(conversation, created_at: 4.hours.ago)
+      create_customer_message(conversation, created_at: 3.hours.ago)
+
+      conversation.toggle_status
+      expect(conversation.status).to eq('resolved')
+
+      conversation.toggle_status
+      expect(conversation.status).to eq('open')
+
+      conversation.reload
+      expect(conversation.waiting_since).to be_nil
+
+      create_agent_message(conversation, created_at: 1.hour.ago)
+      # update_waiting_since will ensure that no events were created since the waiting_since was nil
+      # if the event is created it should log zero value, we have handled that in the reporting_event_listener
+      reply_events = account.reporting_events.where(name: 'reply_time', conversation_id: conversation.id)
+      expect(reply_events.count).to eq(0)
+    end
+  end
 end

From eea1ab3002760077fde6494a516e7482bf00aa6d Mon Sep 17 00:00:00 2001
From: Pranav <pranav@chatwoot.com>
Date: Fri, 27 Jun 2025 15:48:04 -0700
Subject: [PATCH 02/31] fix: Add composite index on messages for csat_metrics
 API performance (#11831)

This PR adds a composite index (:account_id, :content_type, :created_at)
on the table messages.

This index is added as a temporary fix for performance issues in the
CSAT responses controller where we query messages with account_id,
content_type and created_at. The current implementation
(account.message.input_csat.count) times out with millions of messages.

TODO: Create a dedicated csat_survey table and add entries when surveys
are sent, then query this table instead of the entire messages table for
better performance.
---
 app/models/message.rb                         |  1 +
 .../20250627195529_add_index_to_messages.rb   | 20 +++++++++++++++++++
 db/schema.rb                                  |  3 ++-
 3 files changed, 23 insertions(+), 1 deletion(-)
 create mode 100644 db/migrate/20250627195529_add_index_to_messages.rb

diff --git a/app/models/message.rb b/app/models/message.rb
index e7c4e9b6c..d4036416e 100644
--- a/app/models/message.rb
+++ b/app/models/message.rb
@@ -24,6 +24,7 @@
 #
 # Indexes
 #
+#  idx_messages_account_content_created                 (account_id,content_type,created_at)
 #  index_messages_on_account_created_type               (account_id,created_at,message_type)
 #  index_messages_on_account_id                         (account_id)
 #  index_messages_on_account_id_and_inbox_id            (account_id,inbox_id)
diff --git a/db/migrate/20250627195529_add_index_to_messages.rb b/db/migrate/20250627195529_add_index_to_messages.rb
new file mode 100644
index 000000000..ff58c31d4
--- /dev/null
+++ b/db/migrate/20250627195529_add_index_to_messages.rb
@@ -0,0 +1,20 @@
+class AddIndexToMessages < ActiveRecord::Migration[7.0]
+  def change
+    # This index is added as a temporary fix for performance issues in the CSAT
+    # responses controller where we query messages with account_id, content_type
+    # and created_at. The current implementation (account.message.input_csat.count)
+    # times out with millions of messages.
+    #
+    # TODO: Create a dedicated csat_survey table and add entries when surveys are
+    # sent, then query this table instead of the entire messages table for better
+    # performance.
+    return if index_exists?(
+      :messages,
+      [:account_id, :content_type, :created_at],
+      name: 'idx_messages_account_content_created'
+    )
+
+    add_index :messages, [:account_id, :content_type, :created_at],
+              name: 'idx_messages_account_content_created', algorithm: :concurrently
+  end
+end
diff --git a/db/schema.rb b/db/schema.rb
index fdd0cce82..af0c89086 100644
--- a/db/schema.rb
+++ b/db/schema.rb
@@ -10,7 +10,7 @@
 #
 # It's strongly recommended that you check this file into your version control system.
 
-ActiveRecord::Schema[7.1].define(version: 2025_06_20_120000) do
+ActiveRecord::Schema[7.1].define(version: 2025_06_27_195529) do
   # These extensions should be enabled to support this database
   enable_extension "pg_stat_statements"
   enable_extension "pg_trgm"
@@ -825,6 +825,7 @@ ActiveRecord::Schema[7.1].define(version: 2025_06_20_120000) do
     t.text "processed_message_content"
     t.jsonb "sentiment", default: {}
     t.index "((additional_attributes -> 'campaign_id'::text))", name: "index_messages_on_additional_attributes_campaign_id", using: :gin
+    t.index ["account_id", "content_type", "created_at"], name: "idx_messages_account_content_created"
     t.index ["account_id", "created_at", "message_type"], name: "index_messages_on_account_created_type"
     t.index ["account_id", "inbox_id"], name: "index_messages_on_account_id_and_inbox_id"
     t.index ["account_id"], name: "index_messages_on_account_id"

From ee4a0d448622e9cf552e3cc6477723ff3157cc6a Mon Sep 17 00:00:00 2001
From: Pranav <pranav@chatwoot.com>
Date: Fri, 27 Jun 2025 16:58:50 -0700
Subject: [PATCH 03/31] fix: disable_ddl_transaction! on add_index action
 (#11833)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

All migrations will automatically be wrapped in a transaction. There are
queries that you can’t execute inside a transaction. Adding index
concurrently is one of them, we have to disable the transaction. I
missed this in the earlier PR. #11831
---
 db/migrate/20250627195529_add_index_to_messages.rb | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/db/migrate/20250627195529_add_index_to_messages.rb b/db/migrate/20250627195529_add_index_to_messages.rb
index ff58c31d4..eb6b95cdd 100644
--- a/db/migrate/20250627195529_add_index_to_messages.rb
+++ b/db/migrate/20250627195529_add_index_to_messages.rb
@@ -1,4 +1,6 @@
 class AddIndexToMessages < ActiveRecord::Migration[7.0]
+  disable_ddl_transaction!
+
   def change
     # This index is added as a temporary fix for performance issues in the CSAT
     # responses controller where we query messages with account_id, content_type

From b1893c7d96c41485b7b6af45609983e9d131c6a8 Mon Sep 17 00:00:00 2001
From: Muhsin Keloth <muhsinkeramam@gmail.com>
Date: Mon, 30 Jun 2025 11:35:32 +0530
Subject: [PATCH 04/31] fix: Support location messages in Twilio WhatsApp
 integration (#11830)

Fixes location messages not appearing in conversations when sent via
Twilio. Location messages were being filtered out due to empty body
content and missing parameter handling.

![CleanShot 2025-06-27 at 20 48
12](https://github.com/user-attachments/assets/b5a75796-6937-49bc-b689-7d04f4ea5d09)
---
 app/controllers/twilio/callback_controller.rb |  5 ++++-
 app/jobs/webhooks/twilio_events_job.rb        | 10 +++++++--
 .../twilio/incoming_message_service.rb        | 14 ++++++++++++
 spec/jobs/webhooks/twilio_events_job_spec.rb  | 21 ++++++++++++++++++
 .../twilio/incoming_message_service_spec.rb   | 22 +++++++++++++++++++
 5 files changed, 69 insertions(+), 3 deletions(-)

diff --git a/app/controllers/twilio/callback_controller.rb b/app/controllers/twilio/callback_controller.rb
index ff16e9386..455828228 100644
--- a/app/controllers/twilio/callback_controller.rb
+++ b/app/controllers/twilio/callback_controller.rb
@@ -27,7 +27,10 @@ class Twilio::CallbackController < ApplicationController
       *Array.new(10) { |i| :"MediaUrl#{i}" },
       *Array.new(10) { |i| :"MediaContentType#{i}" },
       :MessagingServiceSid,
-      :NumMedia
+      :NumMedia,
+      :Latitude,
+      :Longitude,
+      :MessageType
     )
   end
 end
diff --git a/app/jobs/webhooks/twilio_events_job.rb b/app/jobs/webhooks/twilio_events_job.rb
index 5f44d981b..87fdfadfb 100644
--- a/app/jobs/webhooks/twilio_events_job.rb
+++ b/app/jobs/webhooks/twilio_events_job.rb
@@ -2,10 +2,16 @@ class Webhooks::TwilioEventsJob < ApplicationJob
   queue_as :low
 
   def perform(params = {})
-    # Skip processing if Body parameter or MediaUrl0 is not present
+    # Skip processing if Body parameter, MediaUrl0, or location data is not present
     # This is to skip processing delivery events being delivered to this endpoint
-    return if params[:Body].blank? && params[:MediaUrl0].blank?
+    return if params[:Body].blank? && params[:MediaUrl0].blank? && !valid_location_message?(params)
 
     ::Twilio::IncomingMessageService.new(params: params).perform
   end
+
+  private
+
+  def valid_location_message?(params)
+    params[:MessageType] == 'location' && params[:Latitude].present? && params[:Longitude].present?
+  end
 end
diff --git a/app/services/twilio/incoming_message_service.rb b/app/services/twilio/incoming_message_service.rb
index c38577599..a11b99744 100644
--- a/app/services/twilio/incoming_message_service.rb
+++ b/app/services/twilio/incoming_message_service.rb
@@ -17,6 +17,7 @@ class Twilio::IncomingMessageService
       source_id: params[:SmsSid]
     )
     attach_files
+    attach_location if location_message?
     @message.save!
   end
 
@@ -155,4 +156,17 @@ class Twilio::IncomingMessageService
     Rails.logger.info "Error downloading attachment from Twilio: #{e.message}: Skipping"
     nil
   end
+
+  def location_message?
+    params[:MessageType] == 'location' && params[:Latitude].present? && params[:Longitude].present?
+  end
+
+  def attach_location
+    @message.attachments.new(
+      account_id: @message.account_id,
+      file_type: :location,
+      coordinates_lat: params[:Latitude].to_f,
+      coordinates_long: params[:Longitude].to_f
+    )
+  end
 end
diff --git a/spec/jobs/webhooks/twilio_events_job_spec.rb b/spec/jobs/webhooks/twilio_events_job_spec.rb
index f42caf675..aad70c68b 100644
--- a/spec/jobs/webhooks/twilio_events_job_spec.rb
+++ b/spec/jobs/webhooks/twilio_events_job_spec.rb
@@ -79,4 +79,25 @@ RSpec.describe Webhooks::TwilioEventsJob do
       described_class.perform_now(params_with_media)
     end
   end
+
+  context 'when location message is present' do
+    let(:params_with_location) do
+      {
+        From: 'whatsapp:+1234567890',
+        To: 'whatsapp:+0987654321',
+        MessageType: 'location',
+        Latitude: '12.160894393921',
+        Longitude: '75.265205383301',
+        AccountSid: 'AC123',
+        SmsSid: 'SM123'
+      }
+    end
+
+    it 'processes the location message' do
+      service = double
+      expect(Twilio::IncomingMessageService).to receive(:new).with(params: params_with_location).and_return(service)
+      expect(service).to receive(:perform)
+      described_class.perform_now(params_with_location)
+    end
+  end
 end
diff --git a/spec/services/twilio/incoming_message_service_spec.rb b/spec/services/twilio/incoming_message_service_spec.rb
index c8812e45d..94fc3fdbf 100644
--- a/spec/services/twilio/incoming_message_service_spec.rb
+++ b/spec/services/twilio/incoming_message_service_spec.rb
@@ -260,5 +260,27 @@ describe Twilio::IncomingMessageService do
         expect(conversation.reload.messages.last.attachments.map(&:file_type)).to contain_exactly('image', 'image')
       end
     end
+
+    context 'when a location message is received' do
+      let(:params_with_location) do
+        {
+          SmsSid: 'SMxx',
+          From: '+12345',
+          AccountSid: 'ACxxx',
+          MessagingServiceSid: twilio_channel.messaging_service_sid,
+          MessageType: 'location',
+          Latitude: '12.160894393921',
+          Longitude: '75.265205383301'
+        }
+      end
+
+      it 'creates a message with location attachment' do
+        described_class.new(params: params_with_location).perform
+
+        message = conversation.reload.messages.last
+        expect(message.attachments.count).to eq(1)
+        expect(message.attachments.first.file_type).to eq('location')
+      end
+    end
   end
 end

From d7c10b4f2af568857d25e730a267c0ca352abb66 Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Mon, 30 Jun 2025 14:30:09 +0530
Subject: [PATCH 05/31] chore: Add "Coming Soon" overlay to voice channel
 selector (#11835)

# Pull Request Template

###  Screenshots

**Dark**
<img width="867" alt="image"
src="https://github.com/user-attachments/assets/74f6da33-1fa1-4472-84b8-5d097f4a00e1"
/>

**Light**
<img width="867" alt="image"
src="https://github.com/user-attachments/assets/5e6d5a4c-cd95-462b-baea-ff3ac333153c"
/>

---------

Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com>
---
 .eslintrc.js                                  |  1 +
 .../dashboard/components/ChannelSelector.vue  | 21 ++++++++++++++-----
 .../components/widgets/ChannelItem.vue        |  7 +++++++
 .../dashboard/i18n/locale/en/components.json  |  3 +++
 4 files changed, 27 insertions(+), 5 deletions(-)

diff --git a/.eslintrc.js b/.eslintrc.js
index 6c867f557..6b5205ad7 100644
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -103,6 +103,7 @@ module.exports = {
           '⌘',
           '📄',
           '🎉',
+          '🚀',
           '💬',
           '👥',
           '📥',
diff --git a/app/javascript/dashboard/components/ChannelSelector.vue b/app/javascript/dashboard/components/ChannelSelector.vue
index 1e09f5363..236ae3ded 100644
--- a/app/javascript/dashboard/components/ChannelSelector.vue
+++ b/app/javascript/dashboard/components/ChannelSelector.vue
@@ -9,20 +9,31 @@ export default {
       type: String,
       required: true,
     },
+    isComingSoon: {
+      type: Boolean,
+      default: false,
+    },
   },
 };
 </script>
 
 <template>
   <button
-    class="bg-white dark:bg-slate-900 cursor-pointer flex flex-col justify-end transition-all duration-200 ease-in -m-px py-4 px-0 items-center border border-solid border-slate-25 dark:border-slate-800 hover:border-woot-500 dark:hover:border-woot-500 hover:shadow-md hover:z-50 disabled:opacity-60"
+    class="relative bg-n-background cursor-pointer flex flex-col justify-end transition-all duration-200 ease-in -m-px py-4 px-0 items-center border border-solid border-n-weak hover:border-n-brand hover:shadow-md hover:z-50 disabled:opacity-60"
   >
     <img :src="src" :alt="title" draggable="false" class="w-1/2 my-4 mx-auto" />
-    <h3
-      class="text-slate-800 dark:text-slate-100 text-base text-center capitalize"
-    >
+    <h3 class="text-n-slate-12 text-base text-center capitalize">
       {{ title }}
     </h3>
+
+    <div
+      v-if="isComingSoon"
+      class="absolute inset-0 flex items-center justify-center backdrop-blur-[2px] rounded-md bg-gradient-to-br from-n-background/90 via-n-background/70 to-n-background/95"
+    >
+      <span class="text-n-slate-12 font-medium text-base">
+        {{ $t('CHANNEL_SELECTOR.COMING_SOON') }} 🚀
+      </span>
+    </div>
   </button>
 </template>
 
@@ -33,7 +44,7 @@ export default {
   }
 
   &:hover {
-    @apply border-transparent shadow-none cursor-not-allowed;
+    @apply border-n-strong shadow-none cursor-not-allowed;
   }
 }
 </style>
diff --git a/app/javascript/dashboard/components/widgets/ChannelItem.vue b/app/javascript/dashboard/components/widgets/ChannelItem.vue
index 933e117a9..5bc96d2b5 100644
--- a/app/javascript/dashboard/components/widgets/ChannelItem.vue
+++ b/app/javascript/dashboard/components/widgets/ChannelItem.vue
@@ -57,6 +57,12 @@ export default {
         'voice',
       ].includes(key);
     },
+    isComingSoon() {
+      const { key } = this.channel;
+      // Show "Coming Soon" only if the channel is marked as coming soon
+      // and the corresponding feature flag is not enabled yet.
+      return ['voice'].includes(key) && !this.isActive;
+    },
   },
   methods: {
     getChannelThumbnail() {
@@ -79,6 +85,7 @@ export default {
     :class="{ inactive: !isActive }"
     :title="channel.name"
     :src="getChannelThumbnail()"
+    :is-coming-soon="isComingSoon"
     @click="onItemClick"
   />
 </template>
diff --git a/app/javascript/dashboard/i18n/locale/en/components.json b/app/javascript/dashboard/i18n/locale/en/components.json
index e44c6e039..0a2542a84 100644
--- a/app/javascript/dashboard/i18n/locale/en/components.json
+++ b/app/javascript/dashboard/i18n/locale/en/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }

From 6e207acb5aee4971b320737b12bea5ee7914b046 Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Mon, 30 Jun 2025 20:54:19 +0530
Subject: [PATCH 06/31] fix: CSAT table header and date range translation issue
 on reload (#11836)

# Pull Request Template

## Description

This PR fixes the translation issue in the CSAT reports table header and
date range filter, where labels reverted to English after a page reload.

Fixes
https://linear.app/chatwoot/issue/CW-4557/language-switching-on-page-reload

## Type of change

- [x] Bug fix (non-breaking change which fixes an issue)

## How Has This Been Tested?


https://github.com/user-attachments/assets/c68da978-1f17-44b5-bb21-5ea2668563fb





## Checklist:

- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my code
- [ ] I have commented on my code, particularly in hard-to-understand
areas
- [ ] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [x] New and existing unit tests pass locally with my changes
- [ ] Any dependent changes have been merged and published in downstream
modules
---
 .../settings/reports/components/CsatTable.vue |  8 ++--
 .../reports/components/Filters/DateRange.vue  | 45 ++++++++++---------
 .../specs/Filters/FiltersDateRange.spec.js    | 23 +++++-----
 3 files changed, 40 insertions(+), 36 deletions(-)

diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/CsatTable.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/CsatTable.vue
index 8beeafd70..76a3e3079 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/CsatTable.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/CsatTable.vue
@@ -61,7 +61,7 @@ const defaultSpanRender = cellProps => {
 
 const columnHelper = createColumnHelper();
 
-const columns = [
+const columns = computed(() => [
   columnHelper.accessor('contact', {
     header: t('CSAT_REPORTS.TABLE.HEADER.CONTACT_NAME'),
     width: 200,
@@ -121,7 +121,7 @@ const columns = [
     width: 100,
     cell: cellProps => h(ConversationCell, cellProps),
   }),
-];
+]);
 
 const paginationParams = computed(() => {
   return {
@@ -134,7 +134,9 @@ const table = useVueTable({
   get data() {
     return tableData.value;
   },
-  columns,
+  get columns() {
+    return columns.value;
+  },
   manualPagination: true,
   enableSorting: false,
   getCoreRowModel: getCoreRowModel(),
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/DateRange.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/DateRange.vue
index 4d1cc340f..9caab26dd 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/DateRange.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/DateRange.vue
@@ -1,28 +1,33 @@
-<script>
+<script setup>
+import { ref, computed } from 'vue';
+import { useI18n } from 'vue-i18n';
 import { DATE_RANGE_OPTIONS } from '../../constants';
 
-const EVENT_NAME = 'on-range-change';
+const emit = defineEmits(['onRangeChange']);
 
-export default {
-  name: 'ReportFiltersDateRange',
-  data() {
-    const translatedOptions = Object.values(DATE_RANGE_OPTIONS).map(option => ({
-      ...option,
-      name: this.$t(option.translationKey),
-    }));
+const { t } = useI18n();
 
-    return {
-      // relies on translations, need to move it to constants
-      selectedOption: translatedOptions[0],
-      options: translatedOptions,
-    };
+const options = computed(() =>
+  Object.values(DATE_RANGE_OPTIONS).map(option => ({
+    ...option,
+    name: t(option.translationKey),
+  }))
+);
+
+const selectedId = ref(Object.values(DATE_RANGE_OPTIONS)[0].id);
+
+const selectedOption = computed({
+  get() {
+    return options.value.find(o => o.id === selectedId.value);
   },
-  methods: {
-    updateRange(selectedRange) {
-      this.selectedOption = selectedRange;
-      this.$emit(EVENT_NAME, selectedRange);
-    },
+  set(val) {
+    selectedId.value = val.id;
   },
+});
+
+const updateRange = range => {
+  selectedOption.value = range;
+  emit('onRangeChange', range);
 };
 </script>
 
@@ -31,7 +36,7 @@ export default {
     <multiselect
       v-model="selectedOption"
       class="no-margin"
-      track-by="name"
+      track-by="id"
       label="name"
       :placeholder="$t('FORMS.MULTISELECT.SELECT_ONE')"
       selected-label
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersDateRange.spec.js b/app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersDateRange.spec.js
index e6253186b..c863029fe 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersDateRange.spec.js
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/specs/Filters/FiltersDateRange.spec.js
@@ -12,33 +12,30 @@ const mountParams = {
 };
 
 describe('ReportFiltersDateRange.vue', () => {
-  it('emits "on-range-change" event when updateRange is called', () => {
+  it('emits "onRangeChange" event when updateRange is called', () => {
     const wrapper = shallowMount(ReportFiltersDateRange, mountParams);
 
     const selectedRange = DATE_RANGE_OPTIONS.LAST_7_DAYS;
     wrapper.vm.updateRange(selectedRange);
 
-    expect(wrapper.emitted('on-range-change')).toBeTruthy();
-    expect(wrapper.emitted('on-range-change')[0]).toEqual([selectedRange]);
+    expect(wrapper.emitted('onRangeChange')).toBeTruthy();
+    expect(wrapper.emitted('onRangeChange')[0]).toEqual([selectedRange]);
   });
 
   it('initializes options correctly', () => {
     const wrapper = shallowMount(ReportFiltersDateRange, mountParams);
 
-    const expectedOptions = Object.values(DATE_RANGE_OPTIONS).map(option => ({
-      ...option,
-      name: option.translationKey,
-    }));
+    const expectedIds = Object.values(DATE_RANGE_OPTIONS).map(
+      option => option.id
+    );
+    const receivedIds = wrapper.vm.options.map(option => option.id);
 
-    expect(wrapper.vm.options).toEqual(expectedOptions);
+    expect(receivedIds).toEqual(expectedIds);
   });
 
   it('initializes selectedOption correctly', () => {
     const wrapper = shallowMount(ReportFiltersDateRange, mountParams);
-    const expectedSelectedOption = Object.values(DATE_RANGE_OPTIONS)[0];
-    expect(wrapper.vm.selectedOption).toEqual({
-      ...expectedSelectedOption,
-      name: expectedSelectedOption.translationKey,
-    });
+    const expectedId = Object.values(DATE_RANGE_OPTIONS)[0].id;
+    expect(wrapper.vm.selectedOption.id).toBe(expectedId);
   });
 });

From a657b45bd1bb9e8ced580ad4a0de4adc77f9510e Mon Sep 17 00:00:00 2001
From: Muhsin Keloth <muhsinkeramam@gmail.com>
Date: Tue, 1 Jul 2025 00:12:07 +0530
Subject: [PATCH 07/31] feat(revert): "feat: captain image support" (#11841)

Reverts chatwoot/chatwoot#11730
---
 .../accounts/captain/assistants_controller.rb |   4 +-
 .../conversation/response_builder_job.rb      |  37 ++-
 .../captain/llm/assistant_chat_service.rb     |  13 +-
 .../open_ai_message_builder_service.rb        |  59 ----
 .../captain/assistants_controller_spec.rb     |   8 +-
 .../conversation/response_builder_job_spec.rb |  25 --
 .../open_ai_message_builder_service_spec.rb   | 309 ------------------
 7 files changed, 37 insertions(+), 418 deletions(-)
 delete mode 100644 enterprise/app/services/captain/open_ai_message_builder_service.rb
 delete mode 100644 spec/enterprise/services/captain/open_ai_message_builder_service_spec.rb

diff --git a/enterprise/app/controllers/api/v1/accounts/captain/assistants_controller.rb b/enterprise/app/controllers/api/v1/accounts/captain/assistants_controller.rb
index ec8e8e653..e5a055836 100644
--- a/enterprise/app/controllers/api/v1/accounts/captain/assistants_controller.rb
+++ b/enterprise/app/controllers/api/v1/accounts/captain/assistants_controller.rb
@@ -25,8 +25,8 @@ class Api::V1::Accounts::Captain::AssistantsController < Api::V1::Accounts::Base
 
   def playground
     response = Captain::Llm::AssistantChatService.new(assistant: @assistant).generate_response(
-      additional_message: params[:message_content],
-      message_history: message_history
+      params[:message_content],
+      message_history
     )
 
     render json: response
diff --git a/enterprise/app/jobs/captain/conversation/response_builder_job.rb b/enterprise/app/jobs/captain/conversation/response_builder_job.rb
index 431945896..f341a6e98 100644
--- a/enterprise/app/jobs/captain/conversation/response_builder_job.rb
+++ b/enterprise/app/jobs/captain/conversation/response_builder_job.rb
@@ -26,7 +26,8 @@ class Captain::Conversation::ResponseBuilderJob < ApplicationJob
 
   def generate_and_process_response
     @response = Captain::Llm::AssistantChatService.new(assistant: @assistant).generate_response(
-      message_history: collect_previous_messages
+      @conversation.messages.incoming.last.content,
+      collect_previous_messages
     )
 
     return process_action('handoff') if handoff_requested?
@@ -42,11 +43,33 @@ class Captain::Conversation::ResponseBuilderJob < ApplicationJob
       .where(message_type: [:incoming, :outgoing])
       .where(private: false)
       .map do |message|
-      {
-        content: prepare_multimodal_message_content(message),
-        role: determine_role(message)
-      }
+        {
+          content: message_content(message),
+          role: determine_role(message)
+        }
+      end
+  end
+
+  def message_content(message)
+    return message.content if message.content.present?
+    return 'User has shared a message without content' unless message.attachments.any?
+
+    audio_transcriptions = extract_audio_transcriptions(message.attachments)
+    return audio_transcriptions if audio_transcriptions.present?
+
+    'User has shared an attachment'
+  end
+
+  def extract_audio_transcriptions(attachments)
+    audio_attachments = attachments.where(file_type: :audio)
+    return '' if audio_attachments.blank?
+
+    transcriptions = ''
+    audio_attachments.each do |attachment|
+      result = Messages::AudioTranscriptionService.new(attachment).perform
+      transcriptions += result[:transcriptions] if result[:success]
     end
+    transcriptions
   end
 
   def determine_role(message)
@@ -55,10 +78,6 @@ class Captain::Conversation::ResponseBuilderJob < ApplicationJob
     message.message_type == 'incoming' ? 'user' : 'system'
   end
 
-  def prepare_multimodal_message_content(message)
-    Captain::OpenAiMessageBuilderService.new(message: message).generate_content
-  end
-
   def handoff_requested?
     @response['response'] == 'conversation_handoff'
   end
diff --git a/enterprise/app/services/captain/llm/assistant_chat_service.rb b/enterprise/app/services/captain/llm/assistant_chat_service.rb
index ca8fafaa0..569931d44 100644
--- a/enterprise/app/services/captain/llm/assistant_chat_service.rb
+++ b/enterprise/app/services/captain/llm/assistant_chat_service.rb
@@ -12,16 +12,9 @@ class Captain::Llm::AssistantChatService < Llm::BaseOpenAiService
     register_tools
   end
 
-  # additional_message: A single message (String) from the user that should be appended to the chat.
-  #                    It can be an empty String or nil when you only want to supply historical messages.
-  # message_history:   An Array of already formatted messages that provide the previous context.
-  # role:              The role for the additional_message (defaults to `user`).
-  #
-  # NOTE: Parameters are provided as keyword arguments to improve clarity and avoid relying on
-  # positional ordering.
-  def generate_response(additional_message: nil, message_history: [], role: 'user')
-    @messages += message_history
-    @messages << { role: role, content: additional_message } if additional_message.present?
+  def generate_response(input, previous_messages = [], role = 'user')
+    @messages += previous_messages
+    @messages << { role: role, content: input } if input.present?
     request_chat_completion
   end
 
diff --git a/enterprise/app/services/captain/open_ai_message_builder_service.rb b/enterprise/app/services/captain/open_ai_message_builder_service.rb
deleted file mode 100644
index 3320ad537..000000000
--- a/enterprise/app/services/captain/open_ai_message_builder_service.rb
+++ /dev/null
@@ -1,59 +0,0 @@
-class Captain::OpenAiMessageBuilderService
-  pattr_initialize [:message!]
-
-  def generate_content
-    parts = []
-    parts << text_part(@message.content) if @message.content.present?
-    parts.concat(attachment_parts(@message.attachments)) if @message.attachments.any?
-
-    return 'Message without content' if parts.blank?
-    return parts.first[:text] if parts.one? && parts.first[:type] == 'text'
-
-    parts
-  end
-
-  private
-
-  def text_part(text)
-    { type: 'text', text: text }
-  end
-
-  def image_part(image_url)
-    { type: 'image_url', image_url: { url: image_url } }
-  end
-
-  def attachment_parts(attachments)
-    image_attachments = attachments.where(file_type: :image)
-    image_content = image_parts(image_attachments)
-
-    transcription = extract_audio_transcriptions(attachments)
-    transcription_part = text_part(transcription) if transcription.present?
-
-    attachment_part = text_part('User has shared an attachment') if attachments.where.not(file_type: %i[image audio]).exists?
-
-    [image_content, transcription_part, attachment_part].flatten.compact
-  end
-
-  def image_parts(image_attachments)
-    image_attachments.each_with_object([]) do |attachment, parts|
-      url = get_attachment_url(attachment)
-      parts << image_part(url) if url.present?
-    end
-  end
-
-  def get_attachment_url(attachment)
-    return attachment.external_url if attachment.external_url.present?
-
-    attachment.file.attached? ? attachment.file_url : nil
-  end
-
-  def extract_audio_transcriptions(attachments)
-    audio_attachments = attachments.where(file_type: :audio)
-    return '' if audio_attachments.blank?
-
-    audio_attachments.map do |attachment|
-      result = Messages::AudioTranscriptionService.new(attachment).perform
-      result[:success] ? result[:transcriptions] : ''
-    end.join
-  end
-end
\ No newline at end of file
diff --git a/spec/enterprise/controllers/api/v1/accounts/captain/assistants_controller_spec.rb b/spec/enterprise/controllers/api/v1/accounts/captain/assistants_controller_spec.rb
index 80be6f30f..1f6d83d80 100644
--- a/spec/enterprise/controllers/api/v1/accounts/captain/assistants_controller_spec.rb
+++ b/spec/enterprise/controllers/api/v1/accounts/captain/assistants_controller_spec.rb
@@ -211,8 +211,8 @@ RSpec.describe 'Api::V1::Accounts::Captain::Assistants', type: :request do
 
         expect(response).to have_http_status(:success)
         expect(chat_service).to have_received(:generate_response).with(
-          additional_message: valid_params[:message_content],
-          message_history: valid_params[:message_history]
+          valid_params[:message_content],
+          valid_params[:message_history]
         )
         expect(json_response[:content]).to eq('Assistant response')
       end
@@ -232,8 +232,8 @@ RSpec.describe 'Api::V1::Accounts::Captain::Assistants', type: :request do
 
         expect(response).to have_http_status(:success)
         expect(chat_service).to have_received(:generate_response).with(
-          additional_message: params_without_history[:message_content],
-          message_history: []
+          params_without_history[:message_content],
+          []
         )
       end
     end
diff --git a/spec/enterprise/jobs/captain/conversation/response_builder_job_spec.rb b/spec/enterprise/jobs/captain/conversation/response_builder_job_spec.rb
index ca8d4a6c0..1e4a6e824 100644
--- a/spec/enterprise/jobs/captain/conversation/response_builder_job_spec.rb
+++ b/spec/enterprise/jobs/captain/conversation/response_builder_job_spec.rb
@@ -30,30 +30,5 @@ RSpec.describe Captain::Conversation::ResponseBuilderJob, type: :job do
       account.reload
       expect(account.usage_limits[:captain][:responses][:consumed]).to eq(1)
     end
-
-    context 'when message contains an image' do
-      let(:message_with_image) { create(:message, conversation: conversation, message_type: :incoming, content: 'Can you help with this error?') }
-      let(:image_attachment) { message_with_image.attachments.create!(account: account, file_type: :image, external_url: 'https://example.com/error.jpg') }
-
-      before do
-        image_attachment
-      end
-
-      it 'includes image URL directly in the message content for OpenAI vision analysis' do
-        # Expect the generate_response to receive multimodal content with image URL
-        expect(mock_llm_chat_service).to receive(:generate_response) do |**kwargs|
-          history = kwargs[:message_history]
-          last_entry = history.last
-          expect(last_entry[:content]).to be_an(Array)
-          expect(last_entry[:content].any? { |part| part[:type] == 'text' && part[:text] == 'Can you help with this error?' }).to be true
-          expect(last_entry[:content].any? do |part|
-            part[:type] == 'image_url' && part[:image_url][:url] == 'https://example.com/error.jpg'
-          end).to be true
-          { 'response' => 'I can see the error in your image. It appears to be a database connection issue.' }
-        end
-
-        described_class.perform_now(conversation, assistant)
-      end
-    end
   end
 end
diff --git a/spec/enterprise/services/captain/open_ai_message_builder_service_spec.rb b/spec/enterprise/services/captain/open_ai_message_builder_service_spec.rb
deleted file mode 100644
index 13c29f756..000000000
--- a/spec/enterprise/services/captain/open_ai_message_builder_service_spec.rb
+++ /dev/null
@@ -1,309 +0,0 @@
-require 'rails_helper'
-
-RSpec.describe Captain::OpenAiMessageBuilderService do
-  subject(:service) { described_class.new(message: message) }
-
-  let(:message) { create(:message, content: 'Hello world') }
-
-  describe '#generate_content' do
-    context 'when message has only text content' do
-      it 'returns the text content directly' do
-        expect(service.generate_content).to eq('Hello world')
-      end
-    end
-
-    context 'when message has no content and no attachments' do
-      let(:message) { create(:message, content: nil) }
-
-      it 'returns default message' do
-        expect(service.generate_content).to eq('Message without content')
-      end
-    end
-
-    context 'when message has text content and attachments' do
-      before do
-        attachment = message.attachments.build(account_id: message.account_id, file_type: :image, external_url: 'https://example.com/image.jpg')
-        attachment.save!
-      end
-
-      it 'returns an array of content parts' do
-        result = service.generate_content
-        expect(result).to be_an(Array)
-        expect(result).to include({ type: 'text', text: 'Hello world' })
-        expect(result).to include({ type: 'image_url', image_url: { url: 'https://example.com/image.jpg' } })
-      end
-    end
-
-    context 'when message has only non-text attachments' do
-      let(:message) { create(:message, content: nil) }
-
-      before do
-        attachment = message.attachments.build(account_id: message.account_id, file_type: :image, external_url: 'https://example.com/image.jpg')
-        attachment.save!
-      end
-
-      it 'returns an array of content parts without text' do
-        result = service.generate_content
-        expect(result).to be_an(Array)
-        expect(result).to include({ type: 'image_url', image_url: { url: 'https://example.com/image.jpg' } })
-        expect(result).not_to include(hash_including(type: 'text', text: 'Hello world'))
-      end
-    end
-  end
-
-  describe '#attachment_parts' do
-    let(:message) { create(:message, content: nil) }
-    let(:attachments) { message.attachments }
-
-    context 'with image attachments' do
-      before do
-        attachment = message.attachments.build(account_id: message.account_id, file_type: :image, external_url: 'https://example.com/image.jpg')
-        attachment.save!
-      end
-
-      it 'includes image parts' do
-        result = service.send(:attachment_parts, attachments)
-        expect(result).to include({ type: 'image_url', image_url: { url: 'https://example.com/image.jpg' } })
-      end
-    end
-
-    context 'with audio attachments' do
-      let(:audio_attachment) do
-        attachment = message.attachments.build(account_id: message.account_id, file_type: :audio)
-        attachment.save!
-        attachment
-      end
-
-      before do
-        allow(Messages::AudioTranscriptionService).to receive(:new).with(audio_attachment).and_return(
-          instance_double(Messages::AudioTranscriptionService, perform: { success: true, transcriptions: 'Audio transcription text' })
-        )
-      end
-
-      it 'includes transcription text part' do
-        audio_attachment # trigger creation
-        result = service.send(:attachment_parts, attachments)
-        expect(result).to include({ type: 'text', text: 'Audio transcription text' })
-      end
-    end
-
-    context 'with other file types' do
-      before do
-        attachment = message.attachments.build(account_id: message.account_id, file_type: :file)
-        attachment.save!
-      end
-
-      it 'includes generic attachment message' do
-        result = service.send(:attachment_parts, attachments)
-        expect(result).to include({ type: 'text', text: 'User has shared an attachment' })
-      end
-    end
-
-    context 'with mixed attachment types' do
-      let(:image_attachment) do
-        attachment = message.attachments.build(account_id: message.account_id, file_type: :image, external_url: 'https://example.com/image.jpg')
-        attachment.save!
-        attachment
-      end
-
-      let(:audio_attachment) do
-        attachment = message.attachments.build(account_id: message.account_id, file_type: :audio)
-        attachment.save!
-        attachment
-      end
-
-      let(:document_attachment) do
-        attachment = message.attachments.build(account_id: message.account_id, file_type: :file)
-        attachment.save!
-        attachment
-      end
-
-      before do
-        allow(Messages::AudioTranscriptionService).to receive(:new).with(audio_attachment).and_return(
-          instance_double(Messages::AudioTranscriptionService, perform: { success: true, transcriptions: 'Audio text' })
-        )
-      end
-
-      it 'includes all relevant parts' do
-        image_attachment    # trigger creation
-        audio_attachment    # trigger creation
-        document_attachment # trigger creation
-
-        result = service.send(:attachment_parts, attachments)
-        expect(result).to include({ type: 'image_url', image_url: { url: 'https://example.com/image.jpg' } })
-        expect(result).to include({ type: 'text', text: 'Audio text' })
-        expect(result).to include({ type: 'text', text: 'User has shared an attachment' })
-      end
-    end
-  end
-
-  describe '#image_parts' do
-    let(:message) { create(:message, content: nil) }
-
-    context 'with valid image attachments' do
-      let(:image1) do
-        attachment = message.attachments.build(account_id: message.account_id, file_type: :image, external_url: 'https://example.com/image1.jpg')
-        attachment.save!
-        attachment
-      end
-
-      let(:image2) do
-        attachment = message.attachments.build(account_id: message.account_id, file_type: :image, external_url: 'https://example.com/image2.jpg')
-        attachment.save!
-        attachment
-      end
-
-      it 'returns image parts for all valid images' do
-        image1 # trigger creation
-        image2 # trigger creation
-
-        image_attachments = message.attachments.where(file_type: :image)
-        result = service.send(:image_parts, image_attachments)
-
-        expect(result).to include({ type: 'image_url', image_url: { url: 'https://example.com/image1.jpg' } })
-        expect(result).to include({ type: 'image_url', image_url: { url: 'https://example.com/image2.jpg' } })
-      end
-    end
-
-    context 'with image attachments without URLs' do
-      let(:image_attachment) do
-        attachment = message.attachments.build(account_id: message.account_id, file_type: :image, external_url: nil)
-        attachment.save!
-        attachment
-      end
-
-      before do
-        allow(image_attachment).to receive(:file).and_return(instance_double(ActiveStorage::Attached::One, attached?: false))
-      end
-
-      it 'skips images without valid URLs' do
-        image_attachment # trigger creation
-
-        image_attachments = message.attachments.where(file_type: :image)
-        result = service.send(:image_parts, image_attachments)
-
-        expect(result).to be_empty
-      end
-    end
-  end
-
-  describe '#get_attachment_url' do
-    let(:attachment) do
-      attachment = message.attachments.build(account_id: message.account_id, file_type: :image)
-      attachment.save!
-      attachment
-    end
-
-    context 'when attachment has external_url' do
-      before { attachment.update(external_url: 'https://example.com/image.jpg') }
-
-      it 'returns external_url' do
-        expect(service.send(:get_attachment_url, attachment)).to eq('https://example.com/image.jpg')
-      end
-    end
-
-    context 'when attachment has attached file' do
-      before do
-        attachment.update(external_url: nil)
-        allow(attachment).to receive(:file).and_return(instance_double(ActiveStorage::Attached::One, attached?: true))
-        allow(attachment).to receive(:file_url).and_return('https://local.com/file.jpg')
-      end
-
-      it 'returns file_url' do
-        expect(service.send(:get_attachment_url, attachment)).to eq('https://local.com/file.jpg')
-      end
-    end
-
-    context 'when attachment has no URL or file' do
-      before do
-        attachment.update(external_url: nil)
-        allow(attachment).to receive(:file).and_return(instance_double(ActiveStorage::Attached::One, attached?: false))
-      end
-
-      it 'returns nil' do
-        expect(service.send(:get_attachment_url, attachment)).to be_nil
-      end
-    end
-  end
-
-  describe '#extract_audio_transcriptions' do
-    let(:message) { create(:message, content: nil) }
-
-    context 'with no audio attachments' do
-      it 'returns empty string' do
-        result = service.send(:extract_audio_transcriptions, message.attachments)
-        expect(result).to eq('')
-      end
-    end
-
-    context 'with successful audio transcriptions' do
-      let(:audio1) do
-        attachment = message.attachments.build(account_id: message.account_id, file_type: :audio)
-        attachment.save!
-        attachment
-      end
-
-      let(:audio2) do
-        attachment = message.attachments.build(account_id: message.account_id, file_type: :audio)
-        attachment.save!
-        attachment
-      end
-
-      before do
-        allow(Messages::AudioTranscriptionService).to receive(:new).with(audio1).and_return(
-          instance_double(Messages::AudioTranscriptionService, perform: { success: true, transcriptions: 'First audio text. ' })
-        )
-        allow(Messages::AudioTranscriptionService).to receive(:new).with(audio2).and_return(
-          instance_double(Messages::AudioTranscriptionService, perform: { success: true, transcriptions: 'Second audio text.' })
-        )
-      end
-
-      it 'concatenates all successful transcriptions' do
-        audio1 # trigger creation
-        audio2 # trigger creation
-
-        attachments = message.attachments
-        result = service.send(:extract_audio_transcriptions, attachments)
-        expect(result).to eq('First audio text. Second audio text.')
-      end
-    end
-
-    context 'with failed audio transcriptions' do
-      let(:audio_attachment) do
-        attachment = message.attachments.build(account_id: message.account_id, file_type: :audio)
-        attachment.save!
-        attachment
-      end
-
-      before do
-        allow(Messages::AudioTranscriptionService).to receive(:new).with(audio_attachment).and_return(
-          instance_double(Messages::AudioTranscriptionService, perform: { success: false, transcriptions: nil })
-        )
-      end
-
-      it 'returns empty string for failed transcriptions' do
-        audio_attachment # trigger creation
-
-        attachments = message.attachments
-        result = service.send(:extract_audio_transcriptions, attachments)
-        expect(result).to eq('')
-      end
-    end
-  end
-
-  describe 'private helper methods' do
-    describe '#text_part' do
-      it 'returns correct text part format' do
-        result = service.send(:text_part, 'Hello world')
-        expect(result).to eq({ type: 'text', text: 'Hello world' })
-      end
-    end
-
-    describe '#image_part' do
-      it 'returns correct image part format' do
-        result = service.send(:image_part, 'https://example.com/image.jpg')
-        expect(result).to eq({ type: 'image_url', image_url: { url: 'https://example.com/image.jpg' } })
-      end
-    end
-  end
-end

From 58da92a252bd03437b42b1c2d281bb4cb0b2164e Mon Sep 17 00:00:00 2001
From: Pranav <pranav@chatwoot.com>
Date: Mon, 30 Jun 2025 19:06:25 -0700
Subject: [PATCH 08/31] chore: Disable copilot usage after the response count
 is over (#11845)

Disable copilot if the response usage is over.
---
 config/locales/en.yml                         |  1 +
 .../captain/copilot_threads_controller.rb     | 15 ++++++++--
 .../copilot_threads_controller_spec.rb        | 30 ++++++++++++++++++-
 3 files changed, 43 insertions(+), 3 deletions(-)

diff --git a/config/locales/en.yml b/config/locales/en.yml
index a41a009cf..221f83472 100644
--- a/config/locales/en.yml
+++ b/config/locales/en.yml
@@ -270,6 +270,7 @@ en:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/enterprise/app/controllers/api/v1/accounts/captain/copilot_threads_controller.rb b/enterprise/app/controllers/api/v1/accounts/captain/copilot_threads_controller.rb
index 533859b95..8ea85145e 100644
--- a/enterprise/app/controllers/api/v1/accounts/captain/copilot_threads_controller.rb
+++ b/enterprise/app/controllers/api/v1/accounts/captain/copilot_threads_controller.rb
@@ -23,14 +23,25 @@ class Api::V1::Accounts::Captain::CopilotThreadsController < Api::V1::Accounts::
         message: { content: copilot_thread_params[:message] }
       )
 
-      copilot_message.enqueue_response_job(copilot_thread_params[:conversation_id], Current.user.id)
+      build_copilot_response(copilot_message)
     end
   end
 
   private
 
+  def build_copilot_response(copilot_message)
+    if Current.account.usage_limits[:captain][:responses][:current_available].positive?
+      copilot_message.enqueue_response_job(copilot_thread_params[:conversation_id], Current.user.id)
+    else
+      copilot_message.copilot_thread.copilot_messages.create!(
+        message_type: :assistant,
+        message: { content: I18n.t('captain.copilot_limit') }
+      )
+    end
+  end
+
   def ensure_message
-    return render_could_not_create_error('Message is required') if copilot_thread_params[:message].blank?
+    return render_could_not_create_error(I18n.t('captain.copilot_message_required')) if copilot_thread_params[:message].blank?
   end
 
   def assistant
diff --git a/spec/enterprise/controllers/api/v1/accounts/captain/copilot_threads_controller_spec.rb b/spec/enterprise/controllers/api/v1/accounts/captain/copilot_threads_controller_spec.rb
index b8fc628d1..8b561f22a 100644
--- a/spec/enterprise/controllers/api/v1/accounts/captain/copilot_threads_controller_spec.rb
+++ b/spec/enterprise/controllers/api/v1/accounts/captain/copilot_threads_controller_spec.rb
@@ -86,7 +86,28 @@ RSpec.describe 'Api::V1::Accounts::Captain::CopilotThreads', type: :request do
       end
 
       context 'with valid params' do
+        it 'returns error when usage limit is exceeded' do
+          account.limits = { captain_responses: 2 }
+          account.custom_attributes = { captain_responses_usage: 2 }
+          account.save!
+
+          post "/api/v1/accounts/#{account.id}/captain/copilot_threads",
+               params: valid_params,
+               headers: agent.create_new_auth_token,
+               as: :json
+
+          expect(response).to have_http_status(:success)
+
+          expect(CopilotMessage.last.message['content']).to eq(
+            'You are out of Copilot credits. You can buy more credits from the billing section.'
+          )
+        end
+
         it 'creates a new copilot thread with initial message' do
+          account.limits = { captain_responses: 2 }
+          account.custom_attributes = { captain_responses_usage: 0 }
+          account.save!
+
           expect do
             post "/api/v1/accounts/#{account.id}/captain/copilot_threads",
                  params: valid_params,
@@ -103,8 +124,15 @@ RSpec.describe 'Api::V1::Accounts::Captain::CopilotThreads', type: :request do
           expect(thread.assistant_id).to eq(assistant.id)
 
           message = thread.copilot_messages.last
-          expect(message.message_type).to eq('user')
           expect(message.message).to eq({ 'content' => valid_params[:message] })
+
+          expect(Captain::Copilot::ResponseJob).to have_been_enqueued.with(
+            assistant: assistant,
+            conversation_id: valid_params[:conversation_id],
+            user_id: agent.id,
+            copilot_thread_id: thread.id,
+            message: valid_params[:message]
+          )
         end
       end
     end

From 24ea968b00eacde7de7173aab959e7ae8a97d08b Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Tue, 1 Jul 2025 09:43:44 +0530
Subject: [PATCH 09/31] chore: Remove older UI (#11720)

---
 app/javascript/dashboard/App.vue              |   2 +-
 .../dashboard/assets/scss/_animations.scss    | 101 ---
 .../assets/scss/{widgets => }/_base.scss      |   5 +
 .../dashboard/assets/scss/_formulate.scss     |  38 -
 .../assets/scss/_helper-classes.scss          |  21 -
 .../dashboard/assets/scss/_layout.scss        |  48 --
 .../dashboard/assets/scss/_mixins.scss        | 101 ---
 .../dashboard/assets/scss/_rtl.scss           | 204 -----
 .../dashboard/assets/scss/_variables.scss     |  97 ---
 .../dashboard/assets/scss/_woot.scss          | 434 ++--------
 .../scss/{ => plugins}/_date-picker.scss      |  16 +-
 .../assets/scss/plugins/_dropdown.scss        |   7 -
 .../assets/scss/plugins/_multiselect.scss     |   7 +-
 .../assets/scss/views/settings/inbox.scss     |   1 -
 .../scss/views/settings/integrations.scss     |   1 -
 .../scss/widgets/_conversation-view.scss      | 261 ------
 .../dashboard/assets/scss/widgets/_tabs.scss  |  77 --
 .../assets/scss/widgets/_woot-tables.scss     |  90 --
 .../LiveChatCampaignDialog.vue                |   4 +-
 .../LiveChatCampaign/LiveChatCampaignForm.vue |   2 +-
 .../SMSCampaign/SMSCampaignDialog.vue         |   4 +-
 .../SMSCampaign/SMSCampaignForm.vue           |   2 +-
 .../Contacts/ContactsSidebar/ContactMerge.vue |   2 +-
 .../components-next/Editor/Editor.vue         |   2 +-
 .../components-next/EmptyStateLayout.vue      |   4 +-
 .../ArticleCard/ArticleCard.story.vue         |   2 +-
 .../CategoryCard/CategoryCard.story.vue       |   2 +-
 .../HelpCenter/CategoryCard/CategoryCard.vue  |   6 +-
 .../Article/ArticleEmptyState.story.vue       |   2 +-
 .../Portal/PortalEmptyState.story.vue         |   2 +-
 .../LocaleCard/LocaleCard.story.vue           |   2 +-
 .../HelpCenter/LocaleCard/LocaleCard.vue      |  14 +-
 .../Pages/ArticleEditorPage/ArticleEditor.vue |   8 +-
 .../ArticleEditorControls.vue                 |   4 +-
 .../ArticleEditorPage/ArticleEditorHeader.vue |   2 +-
 .../Pages/ArticlePage/ArticlesPage.story.vue  |   2 +-
 .../CategoryPage/CategoriesPage.story.vue     |   2 +-
 .../Pages/CategoryPage/CategoryDialog.vue     |   4 +-
 .../Pages/CategoryPage/CategoryForm.vue       |   2 +-
 .../CategoryPage/CategoryHeaderControls.vue   |   6 +-
 .../Pages/LocalePage/LocalesPage.story.vue    |   2 +-
 .../Pages/LocalePage/LocalesPage.vue          |   2 +-
 .../PortalSettingsPage/PortalBaseSettings.vue |  14 +-
 .../PortalSettings.story.vue                  |   2 +-
 .../PortalSettingsPage/PortalSettings.vue     |   4 +-
 .../PortalSwitcher/PortalSwitcher.story.vue   |   2 +-
 .../PortalSwitcher/PortalSwitcher.vue         |   4 +-
 .../components-next/avatar/Avatar.story.vue   |  14 +-
 .../breadcrumb/Breadcrumb.story.vue           |  10 +-
 .../components-next/breadcrumb/Breadcrumb.vue |   4 +-
 .../components-next/button/Button.story.vue   |  20 +-
 .../button/ConfirmButton.story.vue            |   4 +-
 .../captain/assistant/AssistantCard.story.vue |   2 +-
 .../captain/assistant/DocumentCard.story.vue  |   2 +-
 .../captain/assistant/InboxCard.story.vue     |   2 +-
 .../captain/assistant/ResponseCard.story.vue  |   2 +-
 .../assistant/AssistantForm.vue               |   2 +-
 .../pageComponents/document/DocumentForm.vue  |   2 +-
 .../pageComponents/inbox/ConnectInboxForm.vue |   2 +-
 .../pageComponents/response/ResponseForm.vue  |   2 +-
 .../colorpicker/ColorPicker.vue               |   2 +-
 .../combobox/ComboBox.story.vue               |   4 +-
 .../combobox/ComboBoxDropdown.vue             |   7 +-
 .../TagMultiSelectComboxBox.story.vue         |   8 +-
 .../copilot/CopilotLauncher.vue               |   5 +-
 .../dropdown-menu/DropdownMenu.story.vue      |   8 +-
 .../DropdownPrimitives.story.vue              |   2 +-
 .../inline-input/InlineInput.story.vue        |  14 +-
 .../components-next/input/Input.story.vue     |  14 +-
 .../dashboard/components-next/input/Input.vue |   2 +-
 .../components-next/message/bubbles/Dyte.vue  |  10 +-
 .../components-next/message/chips/File.vue    |   2 +-
 .../pagination/PaginationFooter.story.vue     |  10 +-
 .../sidebar/SidebarGroupHeader.vue            |   3 +-
 .../sidebar/SidebarGroupLeaf.vue              |   2 +-
 .../sidebar/SidebarProfileMenu.vue            |   6 +-
 .../components-next/switch/Switch.vue         |   6 +-
 .../components-next/tabbar/TabBar.story.vue   |   8 +-
 .../textarea/TextArea.story.vue               |  14 +-
 .../components-next/textarea/TextArea.vue     |   4 +-
 .../dashboard/components/ChatList.vue         |   7 +-
 .../dashboard/components/ChatListHeader.vue   |  15 -
 .../dashboard/components/FormSection.vue      |   6 +-
 .../dashboard/components/ModalHeader.vue      |   6 +-
 .../dashboard/components/SettingsSection.vue  |   9 +-
 .../dashboard/components/SidemenuIcon.vue     |  49 --
 .../AddAccountModal.vue                       |   0
 .../components/buttons/ResolveAction.vue      |  10 +-
 .../components/copilot/CopilotContainer.vue   |   2 +-
 app/javascript/dashboard/components/index.js  |   2 -
 .../components/layout/AvailabilityStatus.vue  | 157 ----
 .../dashboard/components/layout/Sidebar.vue   | 246 ------
 .../layout/config/default-sidebar.js          |  19 -
 .../layout/config/sidebarItems/campaigns.js   |  26 -
 .../layout/config/sidebarItems/contacts.js    |  32 -
 .../config/sidebarItems/conversations.js      |  50 --
 .../config/sidebarItems/notifications.js      |   7 -
 .../layout/config/sidebarItems/primaryMenu.js |  70 --
 .../config/sidebarItems/profileSettings.js    |   7 -
 .../layout/config/sidebarItems/reports.js     |  87 --
 .../layout/config/sidebarItems/settings.js    | 220 -----
 .../sidebarComponents/AccountContext.vue      | 110 ---
 .../sidebarComponents/AccountSelector.vue     |  88 --
 .../layout/sidebarComponents/AgentDetails.vue |  45 -
 .../layout/sidebarComponents/Logo.vue         |  33 -
 .../sidebarComponents/NotificationBell.vue    |  58 --
 .../layout/sidebarComponents/OptionsMenu.vue  | 204 -----
 .../layout/sidebarComponents/Primary.vue      | 116 ---
 .../sidebarComponents/PrimaryNavItem.vue      | 148 ----
 .../layout/sidebarComponents/Secondary.vue    | 265 ------
 .../SecondaryChildNavItem.vue                 | 132 ---
 .../sidebarComponents/SecondaryNavItem.vue    | 277 ------
 .../specs/AccountSelector.spec.js             |  73 --
 .../specs/AgentDetails.spec.js                |  61 --
 .../specs/NotificationBell.spec.js            |  88 --
 .../layout/specs/AvailabilityStatus.spec.js   |  71 --
 .../components/specs/SidemenuIcon.spec.js     |  31 -
 .../__snapshots__/SidemenuIcon.spec.js.snap   |  14 -
 .../dashboard/components/table/BaseCell.vue   |   2 +-
 .../dashboard/components/ui/Banner.vue        |  12 +-
 .../components/CalendarDateInput.vue          |   2 +-
 .../components/DatePickerButton.vue           |  16 +-
 .../components/ui/HelperTextPopup.vue         |   6 +-
 .../dashboard/components/ui/Label.vue         |  42 +-
 .../dashboard/components/ui/PreviewCard.vue   |  23 +-
 .../dashboard/components/ui/Switch.vue        |  21 +-
 .../dashboard/components/ui/Tabs/Tabs.vue     |  23 +-
 .../dashboard/components/ui/Tabs/TabsItem.vue |  30 +-
 .../dashboard/components/ui/TimeAgo.vue       |   2 +-
 .../dashboard/components/ui/Wizard.vue        |  13 +-
 .../widgets/AIAssistanceCTAButton.vue         |   4 +-
 .../components/widgets/AIAssistanceModal.vue  |   4 +-
 .../dashboard/components/widgets/AILoader.vue |  14 +-
 .../components/widgets/AttachmentsPreview.vue |   2 +-
 .../widgets/AutomationActionInput.vue         |   4 +-
 .../AutomationActionTeamMessageInput.vue      |   4 +-
 .../widgets/AutomationFileInput.vue           |   6 +-
 .../dashboard/components/widgets/Avatar.vue   |   2 +-
 .../components/widgets/ChatTypeTabs.vue       |  15 +-
 .../components/widgets/ColorPicker.vue        |   7 +-
 .../components/widgets/EmptyState.vue         |   2 +-
 .../components/widgets/FilterInput/Index.vue  |   8 +-
 .../components/widgets/LoadingState.vue       |  18 +-
 .../components/widgets/SettingIntroBanner.vue |   7 +-
 .../dashboard/components/widgets/ShowMore.vue |   2 +-
 .../components/widgets/TableFooterResults.vue |   2 +-
 .../components/widgets/Thumbnail.vue          |  24 +-
 .../components/widgets/ThumbnailGroup.vue     |  22 +-
 .../components/widgets/WootWriter/Editor.vue  |  18 +-
 .../widgets/WootWriter/ReplyBottomPanel.vue   |   6 +-
 .../widgets/WootWriter/ReplyTopPanel.vue      |   2 +-
 .../WootWriter/keyboardEmojiSelector.vue      |   4 +-
 .../conversation/AvailabilityStatusBadge.vue  |  27 -
 .../widgets/conversation/ChatFilter.vue       |   1 -
 .../widgets/conversation/ConversationBox.vue  |  22 +-
 .../widgets/conversation/ConversationCard.vue |   6 +-
 .../EmptyState/EmptyStateMessage.vue          |   4 +-
 .../widgets/conversation/Message.vue          | 800 ------------------
 .../widgets/conversation/MessagePreview.vue   |  10 +-
 .../MessageSignatureMissingAlert.vue          |   2 +-
 .../widgets/conversation/MessagesView.vue     | 150 +---
 .../conversation/OnboardingFeatureCard.vue    |   8 +-
 .../widgets/conversation/OnboardingView.vue   |   4 +-
 .../widgets/conversation/ReplyBox.vue         |  60 +-
 .../widgets/conversation/ShopifyOrderItem.vue |  10 +-
 .../widgets/conversation/TagAgents.vue        |   2 +-
 .../widgets/conversation/VariableList.vue     |   2 +-
 .../widgets/conversation/bubble/Actions.vue   | 357 --------
 .../widgets/conversation/bubble/Contact.vue   | 123 ---
 .../widgets/conversation/bubble/File.vue      |  86 --
 .../widgets/conversation/bubble/Image.vue     |  34 -
 .../conversation/bubble/ImageAudioVideo.vue   | 127 ---
 .../conversation/bubble/InstagramStory.vue    |  53 --
 .../bubble/InstagramStoryErrorPlaceHolder.vue |  14 -
 .../bubble/InstagramStoryReply.vue            |  36 -
 .../conversation/bubble/Integration.vue       |  41 -
 .../widgets/conversation/bubble/Location.vue  |  52 --
 .../widgets/conversation/bubble/MailHead.vue  | 100 ---
 .../widgets/conversation/bubble/ReplyTo.vue   |  57 --
 .../widgets/conversation/bubble/Text.vue      | 162 ----
 .../widgets/conversation/bubble/Video.vue     |  43 -
 .../conversation/bubble/integrations/Dyte.vue |  98 ---
 .../contextMenu/agentLoadingPlaceholder.vue   |   6 +-
 .../conversation/contextMenu/menuItem.vue     |   9 +-
 .../contextMenu/menuItemWithSubmenu.vue       |   2 +-
 .../conversation/LabelSuggestion.vue          |  21 +-
 .../conversationBulkActions/AgentSelector.vue |  11 +-
 .../conversationBulkActions/Index.vue         |  11 +-
 .../conversationBulkActions/LabelActions.vue  |  21 +-
 .../conversationBulkActions/TeamActions.vue   |  15 +-
 .../conversationBulkActions/UpdateActions.vue |   6 +-
 .../conversationCardComponents/CardLabels.vue |   2 +-
 .../helpers/botMessageContentHelper.js        |  87 --
 .../specs/botMessageContentHelper.spec.js     |  66 --
 .../conversation/linear/CreateOrLinkIssue.vue |   3 +-
 .../widgets/forms/AvatarUploader.vue          |   9 +-
 .../components/widgets/forms/PhoneInput.vue   |   2 +-
 .../widgets/mentions/MentionBox.vue           |   4 +-
 .../widgets/modal/WootKeyShortcutModal.vue    |   8 +-
 .../dashboard/helper/permissionsHelper.js     |  26 -
 .../dashboard/helper/portalHelper.js          |  36 -
 .../helper/specs/permissionsHelper.spec.js    |  65 --
 .../components/ContactDropdownItem.vue        |   6 +-
 .../contact/components/MergeContact.vue       |   2 +-
 .../components/MergeContactSummary.vue        |   4 +-
 .../components/MessageContextMenu.vue         |   6 +-
 .../modules/search/components/SearchTabs.vue  |   1 +
 .../widget-preview/components/Widget.vue      |   4 +-
 .../widget-preview/components/WidgetBody.vue  |   2 +-
 .../components/WidgetFooter.vue               |  14 +-
 .../widget-preview/components/WidgetHead.vue  |  12 +-
 .../dashboard/routes/dashboard/Dashboard.vue  |  92 +-
 .../routes/dashboard/commands/commandbar.vue  |   2 +-
 .../conversation/ContactConversations.vue     |   2 +-
 .../conversation/ContactDetailsItem.vue       |   2 +-
 .../dashboard/conversation/ContactPanel.vue   |   2 +-
 .../conversation/ConversationAction.vue       |   2 +-
 .../conversation/ConversationParticipant.vue  |  24 +-
 .../conversation/ConversationView.vue         |  18 +-
 .../conversation/Macros/MacroPreview.vue      |   4 +-
 .../conversation/contact/ContactForm.vue      |   6 +-
 .../conversation/contact/SocialIcons.vue      |   2 +-
 .../conversation/labels/LabelBox.vue          |  51 +-
 .../conversation/search/PopOverSearch.vue     |  78 --
 .../ArticleSearch/ArticleSearchResultItem.vue |   6 +-
 .../components/ArticleSearch/Header.vue       |   4 +-
 .../ArticleSearch/SearchPopover.vue           |   2 +-
 .../ArticleSearch/SearchResults.vue           |  18 +-
 .../helpcenter/components/UpgradePage.vue     |  12 +-
 .../pages/HelpCenterPageRouteView.vue         |   2 +-
 .../helpcenter/pages/PortalsIndexPage.vue     |   2 +-
 .../dashboard/inbox/InboxEmptyState.vue       |  17 +-
 .../routes/dashboard/inbox/InboxList.vue      |   8 +-
 .../routes/dashboard/inbox/InboxView.vue      |   6 +-
 .../inbox/components/InboxDisplayMenu.vue     |   4 +-
 .../routes/dashboard/inbox/routes.js          |   4 -
 .../components/NotificationPanel.vue          | 230 -----
 .../components/NotificationPanelItem.vue      | 106 ---
 .../components/NotificationPanelList.vue      |  81 --
 .../components/NotificationTable.vue          |  23 +-
 .../components/NotificationsView.vue          |  16 +-
 .../routes/dashboard/notifications/routes.js  |   1 -
 .../dashboard/settings/SettingsHeader.vue     |   7 +-
 .../dashboard/settings/SettingsLayout.vue     |   2 +-
 .../settings/SettingsSubPageHeader.vue        |   6 +-
 .../routes/dashboard/settings/Wrapper.vue     |   2 -
 .../account/components/AccountDelete.vue      |   4 +-
 .../dashboard/settings/agents/Index.vue       |   4 +-
 .../settings/attributes/AddAttribute.vue      |  25 +-
 .../settings/attributes/CustomAttribute.vue   |   4 +-
 .../settings/attributes/EditAttribute.vue     |  25 +-
 .../dashboard/settings/attributes/Index.vue   |   3 +-
 .../dashboard/settings/auditlogs/Index.vue    |   6 +-
 .../settings/automation/AddAutomationRule.vue |   2 +-
 .../automation/EditAutomationRule.vue         |   2 +-
 .../dashboard/settings/automation/Index.vue   |   2 +-
 .../dashboard/settings/canned/Index.vue       |   7 +-
 .../components/BaseSettingsHeader.vue         |   4 +-
 .../components/BaseSettingsListItem.vue       |   6 +-
 .../dashboard/settings/customRoles/Index.vue  |   7 +-
 .../customRoles/component/CustomRoleModal.vue |   2 +-
 .../component/CustomRolePaywall.vue           |   2 +-
 .../dashboard/settings/inbox/FinishSetup.vue  |   4 +-
 .../routes/dashboard/settings/inbox/Index.vue |   4 +-
 .../inbox/PreChatForm/PreChatFields.vue       |   6 +-
 .../settings/inbox/PreChatForm/Settings.vue   |   6 +-
 .../dashboard/settings/inbox/Settings.vue     |  11 +-
 .../settings/inbox/WidgetBuilder.vue          |   2 +-
 .../settings/inbox/channels/Instagram.vue     |   2 +-
 .../settings/inbox/components/BusinessDay.vue |   4 +-
 .../inbox/components/InputRadioGroup.vue      |   8 +-
 .../components/SenderNameExamplePreview.vue   |   2 +-
 .../inbox/components/WeeklyAvailability.vue   |   2 +-
 .../settings/inbox/facebook/Reauthorize.vue   |   4 +-
 .../inbox/settingsPage/CollaboratorsPage.vue  |  15 +-
 .../integrations/DashboardApps/Index.vue      |   8 +-
 .../integrations/MultipleIntegrationHooks.vue |  12 +-
 .../settings/integrations/NewHook.vue         |   2 +-
 .../settings/integrations/Shopify.vue         |   2 +-
 .../Slack/SelectChannelWarning.vue            |   2 +-
 .../settings/integrations/Webhooks/Index.vue  |   6 +-
 .../integrations/Webhooks/WebhookRow.vue      |   4 +-
 .../dashboard/settings/labels/Index.vue       |  16 +-
 .../dashboard/settings/macros/Index.vue       |   2 +-
 .../dashboard/settings/macros/MacroNode.vue   |   4 +-
 .../dashboard/settings/macros/MacroNodes.vue  |  17 +-
 .../settings/macros/MacroProperties.vue       |  24 +-
 .../settings/profile/AccessToken.vue          |   2 +-
 .../settings/profile/AudioAlertCondition.vue  |   4 +-
 .../settings/profile/AudioAlertEvent.vue      |   4 +-
 .../settings/profile/AudioAlertTone.vue       |   2 +-
 .../settings/profile/ChangePassword.vue       |  20 +-
 .../dashboard/settings/profile/HotKeyCard.vue |  10 +-
 .../dashboard/settings/profile/Index.vue      |   2 +-
 .../settings/profile/MessageSignature.vue     |  16 +-
 .../settings/profile/NotificationCheckBox.vue |   2 +-
 .../profile/NotificationPreferences.vue       |  26 +-
 .../settings/profile/UserBasicDetails.vue     |  15 +-
 .../settings/profile/UserProfilePicture.vue   |   2 +-
 .../dashboard/settings/profile/Wrapper.vue    |   2 +-
 .../settings/reports/ReportContainer.vue      |   2 +-
 .../components/ChartElements/ChartStats.vue   |   8 +-
 .../reports/components/ConversationCell.vue   |   5 +-
 .../settings/reports/components/CsatTable.vue |   2 +-
 .../components/Filters/DateGroupBy.vue        |   2 +-
 .../reports/components/Filters/Labels.vue     |   6 +-
 .../settings/reports/components/Heatmap.vue   |  30 +-
 .../reports/components/ReportFilters.vue      |  10 +-
 .../reports/components/SLA/SLAFilter.vue      |   7 +-
 .../reports/components/SLA/SLAReportItem.vue  |   6 +-
 .../reports/components/SLA/SLAViewDetails.vue |   2 +-
 .../reports/components/overview/AgentCell.vue |   4 +-
 .../routes/dashboard/settings/sla/SlaForm.vue |   2 +-
 .../sla/components/SLABusinessHoursLabel.vue  |  14 +-
 .../settings/sla/components/SLAListItem.vue   |   4 +-
 .../sla/components/SLAListItemLoading.vue     |  12 +-
 .../sla/components/SLAResponseTime.vue        |   6 +-
 .../settings/teams/AgentSelector.vue          |  13 +-
 .../settings/teams/Create/AddAgents.vue       |   2 +-
 .../settings/teams/Edit/EditAgents.vue        |   2 +-
 .../routes/dashboard/settings/teams/Index.vue |   9 +-
 .../routes/dashboard/suspended/Index.vue      |   2 +-
 app/javascript/dashboard/routes/index.js      |   2 -
 .../shared/assets/stylesheets/animations.scss |  11 -
 .../assets/stylesheets/border-radius.scss     |   8 -
 .../shared/assets/stylesheets/colors.scss     | 109 ---
 .../shared/assets/stylesheets/font-size.scss  |  14 -
 .../assets/stylesheets/font-weights.scss      |   8 -
 .../shared/assets/stylesheets/shadows.scss    |  19 -
 .../shared/assets/stylesheets/spacing.scss    |  33 -
 .../shared/assets/stylesheets/z-index.scss    |  14 -
 .../components/ArticleSkeletonLoader.vue      |  30 +-
 app/javascript/shared/components/Button.vue   |   4 +-
 app/javascript/shared/components/Spinner.vue  |   6 +-
 app/javascript/shared/components/TextArea.vue |  13 +-
 .../shared/components/emoji/EmojiInput.vue    |  17 +-
 .../components/ui/MultiselectDropdown.vue     |  13 +-
 .../ui/MultiselectDropdownItems.vue           |   4 +-
 .../ui/dropdown/DropdownDivider.vue           |   2 +-
 .../components/ui/dropdown/DropdownHeader.vue |   2 +-
 .../ui/dropdown/DropdownSubMenu.vue           |  14 +-
 .../components/ui/label/LabelDropdown.vue     |   8 +-
 app/javascript/shared/constants/busEvents.js  |   1 -
 app/javascript/shared/helpers/DateHelper.js   |  11 +-
 .../shared/helpers/specs/DateHelper.spec.js   |  32 -
 app/javascript/v3/App.vue                     |   6 +-
 .../v3/components/Button/SubmitButton.vue     |  65 --
 app/javascript/v3/components/Form/Button.vue  | 101 ---
 .../v3/components/Form/CheckBox.vue           |   2 +-
 .../v3/components/Form/InitialsAvatar.vue     |  43 -
 app/javascript/v3/components/Form/Switch.vue  |   6 +-
 .../v3/components/Form/Textarea.vue           |  85 --
 .../v3/components/SnackBar/Item.vue           |   2 +-
 .../v3/views/auth/password/Edit.vue           |  14 +-
 .../v3/views/auth/reset/password/Index.vue    |  14 +-
 .../auth/signup/components/Signup/Form.vue    |  24 +-
 .../signup/components/Testimonials/Index.vue  |   2 +-
 app/javascript/v3/views/login/Index.vue       |  16 +-
 .../v3/views/onboarding/OnboardingStep.vue    |  14 +-
 app/javascript/widget/assets/scss/woot.scss   |   3 -
 .../widget/components/ChatHeader.vue          |   2 +-
 .../widget/components/FooterReplyTo.vue       |   4 +-
 .../widget/components/MessageReplyButton.vue  |   2 +-
 .../widget/components/ReplyToChip.vue         |   6 +-
 .../widget/components/UnreadMessageList.vue   |   4 +-
 .../widget/components/template/Article.vue    |   2 +-
 .../account_features_field/_form.html.erb     |   4 +-
 .../_form.html.erb                            |   2 +-
 theme/colors.js                               | 182 +---
 369 files changed, 974 insertions(+), 9363 deletions(-)
 delete mode 100644 app/javascript/dashboard/assets/scss/_animations.scss
 rename app/javascript/dashboard/assets/scss/{widgets => }/_base.scss (98%)
 delete mode 100644 app/javascript/dashboard/assets/scss/_formulate.scss
 delete mode 100644 app/javascript/dashboard/assets/scss/_helper-classes.scss
 delete mode 100644 app/javascript/dashboard/assets/scss/_layout.scss
 delete mode 100644 app/javascript/dashboard/assets/scss/_mixins.scss
 delete mode 100644 app/javascript/dashboard/assets/scss/_rtl.scss
 delete mode 100644 app/javascript/dashboard/assets/scss/_variables.scss
 rename app/javascript/dashboard/assets/scss/{ => plugins}/_date-picker.scss (73%)
 delete mode 100644 app/javascript/dashboard/assets/scss/plugins/_dropdown.scss
 delete mode 100644 app/javascript/dashboard/assets/scss/views/settings/inbox.scss
 delete mode 100644 app/javascript/dashboard/assets/scss/views/settings/integrations.scss
 delete mode 100644 app/javascript/dashboard/assets/scss/widgets/_conversation-view.scss
 delete mode 100644 app/javascript/dashboard/assets/scss/widgets/_tabs.scss
 delete mode 100644 app/javascript/dashboard/assets/scss/widgets/_woot-tables.scss
 delete mode 100644 app/javascript/dashboard/components/SidemenuIcon.vue
 rename app/javascript/dashboard/components/{layout/sidebarComponents => app}/AddAccountModal.vue (100%)
 delete mode 100644 app/javascript/dashboard/components/layout/AvailabilityStatus.vue
 delete mode 100644 app/javascript/dashboard/components/layout/Sidebar.vue
 delete mode 100644 app/javascript/dashboard/components/layout/config/default-sidebar.js
 delete mode 100644 app/javascript/dashboard/components/layout/config/sidebarItems/campaigns.js
 delete mode 100644 app/javascript/dashboard/components/layout/config/sidebarItems/contacts.js
 delete mode 100644 app/javascript/dashboard/components/layout/config/sidebarItems/conversations.js
 delete mode 100644 app/javascript/dashboard/components/layout/config/sidebarItems/notifications.js
 delete mode 100644 app/javascript/dashboard/components/layout/config/sidebarItems/primaryMenu.js
 delete mode 100644 app/javascript/dashboard/components/layout/config/sidebarItems/profileSettings.js
 delete mode 100644 app/javascript/dashboard/components/layout/config/sidebarItems/reports.js
 delete mode 100644 app/javascript/dashboard/components/layout/config/sidebarItems/settings.js
 delete mode 100644 app/javascript/dashboard/components/layout/sidebarComponents/AccountContext.vue
 delete mode 100644 app/javascript/dashboard/components/layout/sidebarComponents/AccountSelector.vue
 delete mode 100644 app/javascript/dashboard/components/layout/sidebarComponents/AgentDetails.vue
 delete mode 100644 app/javascript/dashboard/components/layout/sidebarComponents/Logo.vue
 delete mode 100644 app/javascript/dashboard/components/layout/sidebarComponents/NotificationBell.vue
 delete mode 100644 app/javascript/dashboard/components/layout/sidebarComponents/OptionsMenu.vue
 delete mode 100644 app/javascript/dashboard/components/layout/sidebarComponents/Primary.vue
 delete mode 100644 app/javascript/dashboard/components/layout/sidebarComponents/PrimaryNavItem.vue
 delete mode 100644 app/javascript/dashboard/components/layout/sidebarComponents/Secondary.vue
 delete mode 100644 app/javascript/dashboard/components/layout/sidebarComponents/SecondaryChildNavItem.vue
 delete mode 100644 app/javascript/dashboard/components/layout/sidebarComponents/SecondaryNavItem.vue
 delete mode 100644 app/javascript/dashboard/components/layout/sidebarComponents/specs/AccountSelector.spec.js
 delete mode 100644 app/javascript/dashboard/components/layout/sidebarComponents/specs/AgentDetails.spec.js
 delete mode 100644 app/javascript/dashboard/components/layout/sidebarComponents/specs/NotificationBell.spec.js
 delete mode 100644 app/javascript/dashboard/components/layout/specs/AvailabilityStatus.spec.js
 delete mode 100644 app/javascript/dashboard/components/specs/SidemenuIcon.spec.js
 delete mode 100644 app/javascript/dashboard/components/specs/__snapshots__/SidemenuIcon.spec.js.snap
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/AvailabilityStatusBadge.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/ChatFilter.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/Message.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/bubble/Actions.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/bubble/Contact.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/bubble/File.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/bubble/Image.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/bubble/ImageAudioVideo.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/bubble/InstagramStory.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/bubble/InstagramStoryErrorPlaceHolder.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/bubble/InstagramStoryReply.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/bubble/Integration.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/bubble/Location.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/bubble/MailHead.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/bubble/ReplyTo.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/bubble/Text.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/bubble/Video.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/bubble/integrations/Dyte.vue
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/helpers/botMessageContentHelper.js
 delete mode 100644 app/javascript/dashboard/components/widgets/conversation/helpers/specs/botMessageContentHelper.spec.js
 delete mode 100644 app/javascript/dashboard/routes/dashboard/conversation/search/PopOverSearch.vue
 delete mode 100644 app/javascript/dashboard/routes/dashboard/notifications/components/NotificationPanel.vue
 delete mode 100644 app/javascript/dashboard/routes/dashboard/notifications/components/NotificationPanelItem.vue
 delete mode 100644 app/javascript/dashboard/routes/dashboard/notifications/components/NotificationPanelList.vue
 delete mode 100644 app/javascript/shared/assets/stylesheets/animations.scss
 delete mode 100644 app/javascript/shared/assets/stylesheets/border-radius.scss
 delete mode 100644 app/javascript/shared/assets/stylesheets/colors.scss
 delete mode 100644 app/javascript/shared/assets/stylesheets/font-size.scss
 delete mode 100644 app/javascript/shared/assets/stylesheets/font-weights.scss
 delete mode 100644 app/javascript/shared/assets/stylesheets/shadows.scss
 delete mode 100644 app/javascript/shared/assets/stylesheets/spacing.scss
 delete mode 100644 app/javascript/shared/assets/stylesheets/z-index.scss
 delete mode 100644 app/javascript/v3/components/Button/SubmitButton.vue
 delete mode 100644 app/javascript/v3/components/Form/Button.vue
 delete mode 100644 app/javascript/v3/components/Form/InitialsAvatar.vue
 delete mode 100644 app/javascript/v3/components/Form/Textarea.vue

diff --git a/app/javascript/dashboard/App.vue b/app/javascript/dashboard/App.vue
index e51958e9e..675f6ea67 100644
--- a/app/javascript/dashboard/App.vue
+++ b/app/javascript/dashboard/App.vue
@@ -1,6 +1,6 @@
 <script>
 import { mapGetters } from 'vuex';
-import AddAccountModal from '../dashboard/components/layout/sidebarComponents/AddAccountModal.vue';
+import AddAccountModal from './components/app/AddAccountModal.vue';
 import LoadingState from './components/widgets/LoadingState.vue';
 import NetworkNotification from './components/NetworkNotification.vue';
 import UpdateBanner from './components/app/UpdateBanner.vue';
diff --git a/app/javascript/dashboard/assets/scss/_animations.scss b/app/javascript/dashboard/assets/scss/_animations.scss
deleted file mode 100644
index da162951b..000000000
--- a/app/javascript/dashboard/assets/scss/_animations.scss
+++ /dev/null
@@ -1,101 +0,0 @@
-.slide-fade-enter-active {
-  transition: all 0.3s var(--ease-in-cubic);
-}
-
-.slide-fade-leave-active {
-  transition: all 0.3s var(--ease-out-cubic);
-}
-
-.slide-fade-enter,
-.slide-fade-leave-to {
-  opacity: 0;
-  transform: translateX(10px);
-}
-
-.slide-fade-enter {
-  transform: translateX($space-micro);
-}
-
-.slide-fade-leave-to {
-  transform: translateX($space-medium);
-}
-
-.conversations-list-enter-active,
-.conversations-list-leave-active {
-  transition: all 0.25s var(--ease-out-cubic);
-}
-
-.conversations-list-enter,
-.conversations-list-leave-to {
-  opacity: 0;
-  transform: translateX($space-medium);
-}
-
-.slide-up-enter-active {
-  transition: all 0.3s var(--ease-in-cubic);
-}
-
-.slide-up-leave-active {
-  transition: all 0.3s var(--ease-out-cubic);
-}
-
-.slide-up-enter,
-.slide-up-leave-to {
-  opacity: 0;
-  transform: translateY(-$space-medium);
-}
-
-.menu-slide-enter-active,
-.menu-slide-leave-active {
-  transform: translateY(0);
-  transition:
-    transform 0.25s var(--ease-in-cubic),
-    opacity 0.15s var(--ease-in-cubic);
-}
-
-.menu-slide-enter,
-.menu-slide-leave-to {
-  opacity: 0;
-  transform: translateY($space-small);
-}
-
-.toast-fade-enter-active {
-  transition: all 0.3s var(--ease-in-sine);
-}
-
-.toast-fade-leave-active {
-  transition: all 0.1s var(--ease-out-sine);
-}
-
-.toast-fade-enter,
-.toast-fade-leave-to {
-  opacity: 0;
-  transform: translateY(-$space-small);
-}
-
-.modal-fade-enter-active {
-  transition: all 0.3s var(--ease-in-sine);
-}
-
-.modal-fade-leave-active {
-  transition: all 0.1s var(--ease-out-sine);
-}
-
-.modal-fade-enter,
-.modal-fade-leave-to {
-  opacity: 0;
-}
-
-.network-notification-fade-enter-active {
-  transition: all 0.1s var(--ease-in-sine);
-}
-
-.network-notification-fade-leave-active {
-  transition: all 0.1s var(--ease-out-sine);
-}
-
-.network-notification-fade-enter,
-.network-notification-fade-leave-to {
-  opacity: 0;
-  transform: translateY(-$space-small);
-}
diff --git a/app/javascript/dashboard/assets/scss/widgets/_base.scss b/app/javascript/dashboard/assets/scss/_base.scss
similarity index 98%
rename from app/javascript/dashboard/assets/scss/widgets/_base.scss
rename to app/javascript/dashboard/assets/scss/_base.scss
index afaaf91c8..14ae2a9d4 100644
--- a/app/javascript/dashboard/assets/scss/widgets/_base.scss
+++ b/app/javascript/dashboard/assets/scss/_base.scss
@@ -201,3 +201,8 @@ code {
     }
   }
 }
+
+// Table
+table {
+  @apply border-spacing-0 text-sm w-full;
+}
diff --git a/app/javascript/dashboard/assets/scss/_formulate.scss b/app/javascript/dashboard/assets/scss/_formulate.scss
deleted file mode 100644
index 37690a8de..000000000
--- a/app/javascript/dashboard/assets/scss/_formulate.scss
+++ /dev/null
@@ -1,38 +0,0 @@
-@import 'dashboard/assets/scss/variables';
-
-.formulate-input {
-  .formulate-input-errors {
-    list-style-type: none;
-    margin: 0;
-    padding: 0;
-  }
-
-  .formulate-input-error {
-    color: var(--r-400);
-    display: block;
-    font-size: var(--font-size-small);
-    font-weight: $font-weight-normal;
-    margin-bottom: $space-one;
-    width: 100%;
-  }
-}
-
-.integration-hooks {
-  .formulate-input[data-type='checkbox'] {
-    .formulate-input-wrapper {
-      @apply flex;
-
-      .formulate-input-element {
-        @apply pr-2;
-
-        input {
-          @apply mb-0;
-        }
-      }
-    }
-
-    .formulate-input-element-decorator {
-      @apply hidden;
-    }
-  }
-}
diff --git a/app/javascript/dashboard/assets/scss/_helper-classes.scss b/app/javascript/dashboard/assets/scss/_helper-classes.scss
deleted file mode 100644
index 229606254..000000000
--- a/app/javascript/dashboard/assets/scss/_helper-classes.scss
+++ /dev/null
@@ -1,21 +0,0 @@
-// loader class
-.spinner {
-  @include color-spinner();
-  @apply inline-block h-6 py-0 px-6 relative align-middle w-6;
-
-  &.message {
-    @apply bg-white dark:bg-slate-800 rounded-full left-0 my-3 mx-auto p-4 top-0;
-
-    &::before {
-      @apply -ml-3 -mt-3;
-    }
-  }
-
-  &.small {
-    @apply h-4 w-4;
-
-    &::before {
-      @apply h-4 -mt-2 w-4;
-    }
-  }
-}
diff --git a/app/javascript/dashboard/assets/scss/_layout.scss b/app/javascript/dashboard/assets/scss/_layout.scss
deleted file mode 100644
index 825b1e2bc..000000000
--- a/app/javascript/dashboard/assets/scss/_layout.scss
+++ /dev/null
@@ -1,48 +0,0 @@
-// scss-lint:disable SpaceAfterPropertyColon
-@import 'shared/assets/fonts/inter';
-
-// Inter,
-html,
-body {
-  font-family:
-    'Inter',
-    -apple-system,
-    system-ui,
-    BlinkMacSystemFont,
-    'Segoe UI',
-    Roboto,
-    'Helvetica Neue',
-    Tahoma,
-    Arial,
-    sans-serif !important;
-  -moz-osx-font-smoothing: grayscale;
-  -webkit-font-smoothing: antialiased;
-  height: 100%;
-  margin: 0;
-  padding: 0;
-  width: 100%;
-}
-
-.app-wrapper {
-  @apply h-screen flex-grow-0 min-h-0 w-full;
-
-  .button--fixed-top {
-    @apply fixed ltr:right-2 rtl:left-2 top-2 flex flex-row;
-  }
-}
-
-.banner + .app-wrapper {
-  // Reduce the height of the dashboard to make room for the banner.
-  // And causing the top right green-action button to be pushed down when scrolling.
-  @apply h-[calc(100%-48px)];
-
-  .button--fixed-top {
-    @apply top-14;
-  }
-
-  .off-canvas-content {
-    .button--fixed-top {
-      @apply top-2;
-    }
-  }
-}
diff --git a/app/javascript/dashboard/assets/scss/_mixins.scss b/app/javascript/dashboard/assets/scss/_mixins.scss
deleted file mode 100644
index fc742d24f..000000000
--- a/app/javascript/dashboard/assets/scss/_mixins.scss
+++ /dev/null
@@ -1,101 +0,0 @@
-@import 'dashboard/assets/scss/variables';
-
-$spinner-before-border-color: rgba(255, 255, 255, 0.7);
-
-// input form
-@mixin ghost-input() {
-  box-shadow: none;
-  border-color: transparent;
-
-  &:active,
-  &:hover,
-  &:focus {
-    border-color: transparent;
-    box-shadow: none;
-  }
-}
-
-@mixin color-spinner() {
-  @keyframes spinner {
-    to {
-      transform: rotate(360deg);
-    }
-  }
-
-  &::before {
-    animation: spinner .9s linear infinite;
-    border: 2px solid $spinner-before-border-color;
-    border-radius: 50%;
-    border-top-color: lighten($color-woot, 10%);
-    box-sizing: border-box;
-    content: '';
-    height: $space-medium;
-    left: 50%;
-    margin-left: -$space-one;
-    margin-top: -$space-one;
-    position: absolute;
-    top: 50%;
-    width: $space-medium;
-  }
-}
-
-// --------------------------------------------------------
-// arrows
-// --------------------------------------------------------
-// $direction: top, left, right, bottom, top-left, top-right, bottom-left, bottom-right
-// $color: hex, rgb or rbga
-// $size: px or em
-// @example
-// .element{
-//     @include arrow(top, #000, 50px);
-// }
-@mixin arrow($direction, $color, $size) {
-  display: block;
-  height: 0;
-  width: 0;
-  content: '';
-
-  @if $direction == 'top' {
-    border-bottom: $size solid $color;
-    border-left: $size solid transparent;
-    border-right: $size solid transparent;
-  }
-
-  @else if $direction == 'right' {
-    border-bottom: $size solid transparent;
-    border-left: $size solid $color;
-    border-top: $size solid transparent;
-  }
-
-  @else if $direction == 'bottom' {
-    border-left: $size solid transparent;
-    border-right: $size solid transparent;
-    border-top: $size solid $color;
-  }
-
-  @else if $direction == 'left' {
-    border-bottom: $size solid transparent;
-    border-right: $size solid $color;
-    border-top: $size solid transparent;
-  }
-
-  @else if $direction == 'top-left' {
-    border-right: $size solid transparent;
-    border-top: $size solid $color;
-  }
-
-  @else if $direction == 'top-right' {
-    border-left: $size solid transparent;
-    border-top: $size solid $color;
-  }
-
-  @else if $direction == 'bottom-left' {
-    border-bottom: $size solid $color;
-    border-right: $size solid transparent;
-  }
-
-  @else if $direction == 'bottom-right' {
-    border-bottom: $size solid $color;
-    border-left: $size solid transparent;
-  }
-}
diff --git a/app/javascript/dashboard/assets/scss/_rtl.scss b/app/javascript/dashboard/assets/scss/_rtl.scss
deleted file mode 100644
index 4f5f4b843..000000000
--- a/app/javascript/dashboard/assets/scss/_rtl.scss
+++ /dev/null
@@ -1,204 +0,0 @@
-.app-rtl--wrapper {
-  direction: rtl;
-
-  // Woot Tabs
-  .tabs-title {
-    &:first-child {
-      margin-left: var(--space-small);
-      margin-right: unset;
-    }
-
-    &:last-child {
-      margin-left: unset;
-      margin-right: var(--space-small);
-    }
-  }
-
-  // woot tables
-  table,
-  thead,
-  th {
-    text-align: right;
-  }
-
-  // Table footer
-  .footer {
-    .page-meta {
-      direction: initial;
-    }
-  }
-
-  // Wizard box
-  .wizard-box {
-    direction: initial;
-  }
-
-  // Conversation details
-  .conversation-details-wrap {
-    .conversation-panel {
-      // Message text
-      .text-content {
-        p {
-          unicode-bidi: plaintext;
-        }
-
-        ul {
-          padding-left: unset;
-          padding-right: var(--space-two);
-        }
-
-        li {
-          text-align: right;
-        }
-      }
-
-      // Message items and actions
-      li {
-        &.right {
-          .sender--info {
-            padding: var(--space-small) var(--space-smaller)
-              var(--space-smaller) 0;
-          }
-
-          .context-menu-wrap {
-            margin-left: 0;
-            margin-right: auto;
-          }
-        }
-      }
-    }
-
-    // Conversation footer
-    .conversation-footer {
-      .preview-item {
-        direction: initial;
-      }
-    }
-
-    // Custom attributes section in conversation sidebar
-    .conversation-sidebar-wrap .checkbox-wrap {
-      .checkbox {
-        margin-left: var(--space-small);
-      }
-    }
-  }
-
-  // Conversation list
-  .conversations-list-wrap {
-    border-right: 0;
-
-    .conversation {
-      .conversation--meta {
-        left: $space-normal;
-        right: unset;
-
-        .unread {
-          margin-left: unset;
-          margin-right: auto;
-        }
-      }
-
-      .assignee-label {
-        margin-left: 0;
-        margin-right: var(--space-one);
-      }
-
-      .show-more--button {
-        margin: unset;
-        transform: rotate(180deg);
-      }
-    }
-
-    // Basic filter dropdown
-    .basic-filter {
-      left: 0;
-      right: unset;
-    }
-
-    // Bulk actions
-    .bulk-action__container {
-      .triangle {
-        left: var(--triangle-position);
-        right: unset;
-      }
-
-      .bulk-action__agents {
-        left: var(--space-small);
-        right: unset;
-      }
-
-      .labels-container {
-        left: var(--space-small);
-        right: unset;
-
-        .label-checkbox {
-          margin: 0 0 0 var(--space-one);
-        }
-      }
-
-      .actions-container {
-        left: var(--space-small);
-        right: unset;
-      }
-
-      .bulk-action__teams {
-        left: var(--space-small);
-        right: unset;
-      }
-    }
-  }
-
-  // Contact notes
-  .card.note-wrap {
-    .time-stamp {
-      unicode-bidi: plaintext;
-    }
-  }
-
-  // Toggle switch
-  .toggle-button {
-    &.small {
-      span {
-        &.active {
-          transform: translate(var(--space-minus-small), var(--space-zero));
-        }
-      }
-    }
-
-    span {
-      --minus-space-one-point-five: -0.9375rem;
-
-      &.active {
-        transform: translate(
-          var(--minus-space-one-point-five),
-          var(--space-zero)
-        );
-      }
-    }
-  }
-
-  // Modal
-  .modal-container {
-    text-align: right;
-
-    .modal-footer {
-      button {
-        margin-left: 0;
-        margin-right: var(--space-small);
-      }
-    }
-  }
-
-  // Other changes
-  .colorpicker--chrome {
-    direction: initial;
-  }
-
-  .mention--box {
-    direction: initial;
-  }
-
-  .contact--form .input-group {
-    direction: initial;
-  }
-}
diff --git a/app/javascript/dashboard/assets/scss/_variables.scss b/app/javascript/dashboard/assets/scss/_variables.scss
deleted file mode 100644
index 063c6383b..000000000
--- a/app/javascript/dashboard/assets/scss/_variables.scss
+++ /dev/null
@@ -1,97 +0,0 @@
-// Font sizes
-$font-size-nano: 0.5rem;
-$font-size-micro: 0.675rem;
-$font-size-mini: 0.75rem;
-$font-size-small: 0.875rem;
-$font-size-default: 1rem;
-$font-size-medium: 1.125rem;
-$font-size-large: 1.375rem;
-$font-size-big: 1.5rem;
-$font-size-bigger: 1.75rem;
-$font-size-mega: 2.125rem;
-$font-size-giga: 2.5rem;
-
-// spaces
-$zero: 0;
-$space-micro: 0.125rem;
-$space-smaller: 0.25rem;
-$space-small: 0.5rem;
-$space-one: 0.675rem;
-$space-slab: 0.75rem;
-$space-normal: 1rem;
-$space-two: 1.25rem;
-$space-medium: 1.5rem;
-$space-large: 2rem;
-$space-larger: 3rem;
-$space-jumbo: 4rem;
-$space-mega: 6.25rem;
-
-// font-weight
-$font-weight-feather: 100;
-$font-weight-light: 300;
-$font-weight-normal: 400;
-$font-weight-medium: 500;
-$font-weight-bold: 600;
-$font-weight-black: 700;
-
-//Navbar
-$nav-bar-width: 14.375rem;
-$header-height: 3.5rem;
-
-$woot-logo-padding: $space-large $space-two;
-
-// Colors
-$color-woot: #1f93ff;
-$color-gray: #6e6f73;
-$color-light-gray: #999a9b;
-
-$color-border: var(--s-75);
-$color-border-light: var(--s-50);
-$color-border-dark: var(--s-100);
-
-$color-background: var(--s-50);
-$color-background-light: var(--s-25);
-
-$color-white: #fff;
-$color-body: #3c4858;
-$color-heading: #1f2d3d;
-$color-extra-light-blue: #f5f7f9;
-
-$primary-color: $color-woot;
-$secondary-color: #5d7592;
-$success-color: #44ce4b;
-$warning-color: #ffc532;
-$alert-color: #ff382d;
-
-$masked-bg: rgba(0, 0, 0, .4);
-
-// Color-palettes
-
-$color-primary-light: #c7e3ff;
-$color-primary-dark: darken($color-woot, 20%);
-
-// Thumbnail
-$thumbnail-radius: 2.5rem;
-
-// chat-header
-$conv-header-height: 2.5rem;
-
-// Inbox List
-
-$inbox-thumb-size: 3rem;
-
-
-// Snackbar default
-$woot-snackbar-bg: #323232;
-$woot-snackbar-button: #ffeb3b;
-
-$swift-ease-out-duration: .4s !default;
-$swift-ease-out-function: cubic-bezier(0.37, 0, 0.63, 1) !default;
-$swift-ease-out: all $swift-ease-out-duration $swift-ease-out-function !default;
-
-// Transitions
-$transition-ease-in: all 0.250s ease-in;
-
-:root {
-  --dashboard-app-tabs-height: 2.4375rem;
-}
diff --git a/app/javascript/dashboard/assets/scss/_woot.scss b/app/javascript/dashboard/assets/scss/_woot.scss
index 622eb4085..66416c64c 100644
--- a/app/javascript/dashboard/assets/scss/_woot.scss
+++ b/app/javascript/dashboard/assets/scss/_woot.scss
@@ -1,3 +1,4 @@
+// scss-lint:disable SpaceAfterPropertyColon
 @import 'tailwindcss/base';
 @import 'tailwindcss/components';
 @import 'tailwindcss/utilities';
@@ -8,54 +9,66 @@
 // Next Colors
 @import 'next-colors';
 
-@import 'shared/assets/stylesheets/animations';
-@import 'shared/assets/stylesheets/colors';
-@import 'shared/assets/stylesheets/spacing';
-@import 'shared/assets/stylesheets/font-size';
-@import 'shared/assets/stylesheets/font-weights';
-@import 'shared/assets/stylesheets/shadows';
-@import 'shared/assets/stylesheets/border-radius';
-@import 'shared/assets/stylesheets/z-index';
-
-@import 'variables';
-
-@import 'mixins';
-@import 'helper-classes';
-@import 'formulate';
-@import 'date-picker';
-
-@import 'layout';
-@import 'animations';
-@import 'rtl';
-
-@import 'widgets/base';
-@import 'widgets/conversation-view';
-@import 'widgets/tabs';
-@import 'widgets/woot-tables';
+// Base styles for elements
+@import 'base';
 
+// Plugins
 @import 'plugins/multiselect';
-@import 'plugins/dropdown';
+@import 'plugins/date-picker';
+
+html,
+body {
+  font-family:
+    'Inter',
+    -apple-system,
+    system-ui,
+    BlinkMacSystemFont,
+    'Segoe UI',
+    Roboto,
+    'Helvetica Neue',
+    Tahoma,
+    Arial,
+    sans-serif !important;
+  -moz-osx-font-smoothing: grayscale;
+  -webkit-font-smoothing: antialiased;
+  height: 100%;
+  margin: 0;
+  padding: 0;
+  width: 100%;
+}
+
+.app-wrapper {
+  @apply h-screen flex-grow-0 min-h-0 w-full;
+
+  .button--fixed-top {
+    @apply fixed ltr:right-2 rtl:left-2 top-2 flex flex-row;
+  }
+}
+
+.banner + .app-wrapper {
+  // Reduce the height of the dashboard to make room for the banner.
+  // And causing the top right green-action button to be pushed down when scrolling.
+  @apply h-[calc(100%-48px)];
+
+  .button--fixed-top {
+    @apply top-14;
+  }
+
+  .off-canvas-content {
+    .button--fixed-top {
+      @apply top-2;
+    }
+  }
+}
 
 .tooltip {
-  @apply bg-slate-900 text-white py-1 px-2 z-40 text-xs rounded-md dark:bg-slate-200 dark:text-slate-900 max-w-96;
+  @apply bg-n-solid-2 text-n-slate-12 py-1 px-2 z-40 text-xs rounded-md max-w-96;
 }
 
 #app {
   @apply h-full w-full;
 }
 
-.hide {
-  @apply hidden;
-}
-
-.n-blue-border {
-  @apply border-n-blue-border;
-}
-
-.n-blue-text {
-  @apply text-n-blue-text;
-}
-
 .custom-dashed-border {
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25'%3E%3Crect x='0' y='0' width='100%25' height='100%25' fill='none' rx='16' ry='16' stroke='%23E2E3E7' stroke-width='2' stroke-dasharray='6, 8' stroke-dashoffset='0' stroke-linecap='round'/%3E%3C/svg%3E");
   background-position: center;
@@ -67,351 +80,6 @@
   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='100%25' height='100%25'%3E%3Crect x='0' y='0' width='100%25' height='100%25' fill='none' rx='16' ry='16' stroke='%23343434' stroke-width='2' stroke-dasharray='6, 8' stroke-dashoffset='0' stroke-linecap='round'/%3E%3C/svg%3E");
 }
 
-// scss-lint:disable PropertySortOrder
-@layer base {
-  :root {
-    --color-amber-25: 254 253 251;
-    --color-amber-50: 255 249 237;
-    --color-amber-75: 255 243 208;
-    --color-amber-100: 255 236 183;
-    --color-amber-200: 255 224 161;
-    --color-amber-300: 245 208 140;
-    --color-amber-400: 228 187 120;
-    --color-amber-500: 214 163 92;
-    --color-amber-600: 214 163 92;
-    --color-amber-700: 255 186 26;
-    --color-amber-800: 145 89 48;
-    --color-amber-900: 79 52 34;
-
-    --color-ash-100: 235 235 239;
-    --color-ash-200: 228 228 233;
-    --color-ash-25: 252 252 253;
-    --color-ash-300: 221 221 227;
-    --color-ash-400: 211 212 219;
-    --color-ash-50: 249 249 251;
-    --color-ash-500: 185 187 198;
-    --color-ash-600: 139 141 152;
-    --color-ash-700: 126 128 138;
-    --color-ash-75: 242 242 245;
-    --color-ash-800: 96 100 108;
-    --color-ash-900: 28 32 36;
-
-    --color-primary-25: 251 253 255;
-    --color-primary-50: 245 249 255;
-    --color-primary-75: 233 243 255;
-    --color-primary-100: 218 236 255;
-    --color-primary-200: 201 226 255;
-    --color-primary-300: 181 213 255;
-    --color-primary-400: 155 195 252;
-    --color-primary-500: 117 171 247;
-    --color-primary-600: 39 129 246;
-    --color-primary-700: 16 115 233;
-    --color-primary-800: 8 109 224;
-    --color-primary-900: 11 50 101;
-
-    --color-ruby-100: 255 220 225;
-    --color-ruby-200: 255 206 214;
-    --color-ruby-25: 255 252 253;
-    --color-ruby-300: 248 191 200;
-    --color-ruby-400: 239 172 184;
-    --color-ruby-50: 255 247 248;
-    --color-ruby-500: 229 146 163;
-    --color-ruby-600: 229 70 102;
-    --color-ruby-700: 220 59 93;
-    --color-ruby-75: 254 234 237;
-    --color-ruby-800: 202 36 77;
-    --color-ruby-900: 100 23 43;
-
-    --color-teal-100: 224 248 243;
-    --color-teal-200: 204 243 234;
-    --color-teal-25: 250 254 253;
-    --color-teal-300: 184 234 224;
-    --color-teal-400: 161 222 210;
-    --color-teal-50: 243 251 249;
-    --color-teal-500: 83 185 171;
-    --color-teal-600: 18 165 148;
-    --color-teal-700: 13 155 138;
-    --color-teal-75: 236 249 255;
-    --color-teal-800: 0 133 115;
-    --color-teal-900: 13 61 56;
-
-    --color-green-25: 251 254 252;
-    --color-green-50: 244 251 246;
-    --color-green-75: 230 246 235;
-    --color-green-100: 214 241 223;
-    --color-green-200: 196 232 209;
-    --color-green-300: 173 221 192;
-    --color-green-400: 142 206 170;
-    --color-green-500: 91 185 139;
-    --color-green-600: 48 164 108;
-    --color-green-700: 43 154 102;
-    --color-green-800: 33 131 88;
-    --color-green-900: 25 59 45;
-
-    --color-mint-25: 249 254 253;
-    --color-mint-50: 242 251 249;
-    --color-mint-75: 221 249 242;
-    --color-mint-100: 200 244 233;
-    --color-mint-200: 179 236 222;
-    --color-mint-300: 156 224 208;
-    --color-mint-400: 126 207 189;
-    --color-mint-500: 76 187 165;
-    --color-mint-600: 134 234 212;
-    --color-mint-700: 125 224 203;
-    --color-mint-800: 2 120 100;
-    --color-mint-900: 22 67 60;
-
-    --color-sky-25: 249 254 255;
-    --color-sky-50: 241 250 253;
-    --color-sky-75: 225 246 253;
-    --color-sky-100: 209 240 250;
-    --color-sky-200: 190 231 245;
-    --color-sky-300: 169 218 237;
-    --color-sky-400: 141 202 227;
-    --color-sky-500: 96 179 215;
-    --color-sky-600: 124 226 254;
-    --color-sky-700: 116 218 248;
-    --color-sky-800: 0 116 158;
-    --color-sky-900: 29 62 86;
-
-    --color-indigo-25: 253 253 254;
-    --color-indigo-50: 247 249 255;
-    --color-indigo-75: 237 242 254;
-    --color-indigo-100: 225 233 255;
-    --color-indigo-200: 210 222 255;
-    --color-indigo-300: 193 208 255;
-    --color-indigo-400: 171 189 249;
-    --color-indigo-500: 141 164 239;
-    --color-indigo-600: 62 99 221;
-    --color-indigo-700: 51 88 212;
-    --color-indigo-800: 58 91 199;
-    --color-indigo-900: 31 45 92;
-
-    --color-iris-25: 253 253 255;
-    --color-iris-50: 248 248 255;
-    --color-iris-75: 240 241 254;
-    --color-iris-100: 230 231 255;
-    --color-iris-200: 218 220 255;
-    --color-iris-300: 203 205 255;
-    --color-iris-400: 184 186 248;
-    --color-iris-500: 155 158 240;
-    --color-iris-600: 91 91 214;
-    --color-iris-700: 81 81 205;
-    --color-iris-800: 87 83 198;
-    --color-iris-900: 39 41 98;
-
-    --color-violet-25: 253 252 254;
-    --color-violet-50: 250 248 255;
-    --color-violet-75: 244 240 254;
-    --color-violet-100: 235 228 255;
-    --color-violet-200: 225 217 255;
-    --color-violet-300: 212 202 254;
-    --color-violet-400: 194 181 245;
-    --color-violet-500: 170 153 236;
-    --color-violet-600: 110 86 207;
-    --color-violet-700: 101 77 196;
-    --color-violet-800: 101 80 185;
-    --color-violet-900: 47 38 95;
-
-    --color-pink-25: 255 252 254;
-    --color-pink-50: 254 247 251;
-    --color-pink-75: 254 233 245;
-    --color-pink-100: 251 220 239;
-    --color-pink-200: 246 206 231;
-    --color-pink-300: 239 191 221;
-    --color-pink-400: 231 172 208;
-    --color-pink-500: 221 147 194;
-    --color-pink-600: 214 64 159;
-    --color-pink-700: 207 56 151;
-    --color-pink-800: 194 41 138;
-    --color-pink-900: 101 18 73;
-
-    --color-orange-25: 254 252 251;
-    --color-orange-50: 255 247 237;
-    --color-orange-75: 255 239 214;
-    --color-orange-100: 255 223 181;
-    --color-orange-200: 255 209 154;
-    --color-orange-300: 255 193 130;
-    --color-orange-400: 245 174 115;
-    --color-orange-500: 236 148 85;
-    --color-orange-600: 247 107 21;
-    --color-orange-700: 239 95 0;
-    --color-orange-800: 204 78 0;
-    --color-orange-900: 88 45 29;
-  }
-
-  // scss-lint:disable QualifyingElement
-  body.dark {
-    --color-amber-25: 31 19 0;
-    --color-amber-50: 37 24 4;
-    --color-amber-75: 48 32 11;
-    --color-amber-100: 57 39 15;
-    --color-amber-200: 67 46 18;
-    --color-amber-300: 83 57 22;
-    --color-amber-400: 111 77 29;
-    --color-amber-500: 169 118 42;
-    --color-amber-600: 169 118 42;
-    --color-amber-700: 255 203 71;
-    --color-amber-800: 255 204 77;
-    --color-amber-900: 255 231 179;
-
-    --color-ash-100: 46 48 53;
-    --color-ash-200: 53 55 60;
-    --color-ash-25: 24 24 26;
-    --color-ash-300: 60 63 68;
-    --color-ash-400: 70 75 80;
-    --color-ash-50: 27 27 31;
-    --color-ash-500: 90 97 101;
-    --color-ash-600: 105 110 119;
-    --color-ash-700: 120 127 133;
-    --color-ash-75: 39 40 45;
-    --color-ash-800: 173 177 184;
-    --color-ash-900: 237 238 240;
-
-    --color-primary-25: 10 17 28;
-    --color-primary-50: 15 24 38;
-    --color-primary-75: 15 39 72;
-    --color-primary-100: 10 49 99;
-    --color-primary-200: 18 61 117;
-    --color-primary-300: 29 74 134;
-    --color-primary-400: 40 89 156;
-    --color-primary-500: 48 106 186;
-    --color-primary-600: 39 129 246;
-    --color-primary-700: 21 116 231;
-    --color-primary-800: 126 182 255;
-    --color-primary-900: 205 227 255;
-
-    --color-ruby-100: 78 19 37;
-    --color-ruby-200: 94 26 46;
-    --color-ruby-25: 25 17 19;
-    --color-ruby-300: 111 37 57;
-    --color-ruby-400: 136 52 71;
-    --color-ruby-50: 30 21 23;
-    --color-ruby-500: 179 68 90;
-    --color-ruby-600: 229 70 102;
-    --color-ruby-700: 236 90 114;
-    --color-ruby-75: 58 20 30;
-    --color-ruby-800: 255 148 157;
-    --color-ruby-900: 254 210 225;
-
-    --color-teal-100: 2 59 55;
-    --color-teal-200: 8 72 67;
-    --color-teal-25: 13 21 20;
-    --color-teal-300: 28 105 97;
-    --color-teal-400: 28 105 97;
-    --color-teal-50: 17 28 27;
-    --color-teal-500: 32 126 115;
-    --color-teal-600: 41 163 131;
-    --color-teal-700: 14 179 158;
-    --color-teal-75: 13 45 42;
-    --color-teal-800: 11 216 182;
-    --color-teal-900: 173 240 221;
-
-    --color-green-25: 14 21 18;
-    --color-green-50: 18 27 23;
-    --color-green-75: 19 45 33;
-    --color-green-100: 17 59 41;
-    --color-green-200: 23 73 51;
-    --color-green-300: 32 87 62;
-    --color-green-400: 40 104 74;
-    --color-green-500: 47 124 87;
-    --color-green-600: 48 164 108;
-    --color-green-700: 51 176 116;
-    --color-green-800: 61 214 140;
-    --color-green-900: 177 241 203;
-
-    --color-mint-25: 14 21 21;
-    --color-mint-50: 15 27 27;
-    --color-mint-75: 9 44 43;
-    --color-mint-100: 0 58 56;
-    --color-mint-200: 0 71 68;
-    --color-mint-300: 16 86 80;
-    --color-mint-400: 30 104 95;
-    --color-mint-500: 39 127 112;
-    --color-mint-600: 134 234 212;
-    --color-mint-700: 168 245 229;
-    --color-mint-800: 88 213 186;
-    --color-mint-900: 196 245 225;
-
-    --color-sky-25: 14 21 21;
-    --color-sky-50: 15 27 27;
-    --color-sky-75: 9 44 43;
-    --color-sky-100: 0 58 56;
-    --color-sky-200: 0 71 68;
-    --color-sky-300: 16 86 80;
-    --color-sky-400: 30 104 95;
-    --color-sky-500: 39 127 112;
-    --color-sky-600: 134 234 212;
-    --color-sky-700: 168 245 229;
-    --color-sky-800: 88 213 186;
-    --color-sky-900: 196 245 225;
-
-    --color-indigo-25: 17 19 31;
-    --color-indigo-50: 20 23 38;
-    --color-indigo-75: 24 36 73;
-    --color-indigo-100: 29 46 98;
-    --color-indigo-200: 37 57 116;
-    --color-indigo-300: 48 67 132;
-    --color-indigo-400: 58 79 151;
-    --color-indigo-500: 67 93 177;
-    --color-indigo-600: 62 99 221;
-    --color-indigo-700: 84 114 228;
-    --color-indigo-800: 158 177 255;
-    --color-indigo-900: 214 225 255;
-
-    --color-iris-25: 19 19 30;
-    --color-iris-50: 23 22 37;
-    --color-iris-75: 32 34 72;
-    --color-iris-100: 38 42 101;
-    --color-iris-200: 48 51 116;
-    --color-iris-300: 61 62 130;
-    --color-iris-400: 74 74 149;
-    --color-iris-500: 89 88 177;
-    --color-iris-600: 91 91 214;
-    --color-iris-700: 110 106 222;
-    --color-iris-800: 177 169 255;
-    --color-iris-900: 224 223 254;
-
-    --color-violet-25: 20 18 31;
-    --color-violet-50: 27 21 37;
-    --color-violet-75: 41 31 67;
-    --color-violet-100: 51 37 91;
-    --color-violet-200: 60 46 105;
-    --color-violet-300: 71 56 118;
-    --color-violet-400: 86 70 139;
-    --color-violet-500: 105 88 173;
-    --color-violet-600: 110 86 207;
-    --color-violet-700: 125 102 217;
-    --color-violet-800: 186 167 255;
-    --color-violet-900: 226 221 254;
-
-    --color-pink-25: 25 17 23;
-    --color-pink-50: 33 18 29;
-    --color-pink-75: 55 23 47;
-    --color-pink-100: 75 20 61;
-    --color-pink-200: 89 28 71;
-    --color-pink-300: 105 41 85;
-    --color-pink-400: 131 56 105;
-    --color-pink-500: 168 72 133;
-    --color-pink-600: 214 64 159;
-    --color-pink-700: 222 81 168;
-    --color-pink-800: 255 141 204;
-    --color-pink-900: 253 209 234;
-    --color-orange-25: 23 18 14;
-    --color-orange-50: 30 22 15;
-    --color-orange-75: 51 30 11;
-    --color-orange-100: 70 33 0;
-    --color-orange-200: 86 40 0;
-    --color-orange-300: 102 53 12;
-    --color-orange-400: 126 69 29;
-    --color-orange-500: 163 88 41;
-    --color-orange-600: 247 107 21;
-    --color-orange-700: 255 128 31;
-    --color-orange-800: 255 160 87;
-    --color-orange-900: 255 224 194;
-  }
-}
-
 @layer utilities {
   /* Hide scrollbar for Chrome, Safari and Opera */
   .no-scrollbar::-webkit-scrollbar {
diff --git a/app/javascript/dashboard/assets/scss/_date-picker.scss b/app/javascript/dashboard/assets/scss/plugins/_date-picker.scss
similarity index 73%
rename from app/javascript/dashboard/assets/scss/_date-picker.scss
rename to app/javascript/dashboard/assets/scss/plugins/_date-picker.scss
index b22381ea0..353e696d4 100644
--- a/app/javascript/dashboard/assets/scss/_date-picker.scss
+++ b/app/javascript/dashboard/assets/scss/plugins/_date-picker.scss
@@ -30,11 +30,11 @@
 
   .mx-input:disabled,
   .mx-input[readonly] {
-    @apply bg-white dark:bg-slate-900 cursor-pointer;
+    @apply bg-n-background cursor-pointer;
   }
 
   .mx-icon-calendar {
-    @apply dark:text-slate-500;
+    @apply text-n-slate-10;
   }
 }
 
@@ -43,17 +43,17 @@
 
   .cell {
     &.disabled {
-      @apply bg-slate-25 dark:bg-slate-900 text-slate-200 dark:text-slate-300;
+      @apply bg-n-slate-2 dark:bg-n-background text-n-slate-10;
     }
 
     &:hover,
     &.hover-in-range,
     &.in-range {
-      @apply bg-slate-75 dark:bg-slate-700 text-slate-900 dark:text-slate-100;
+      @apply bg-n-slate-3 dark:bg-n-solid-3 text-n-slate-12;
     }
   }
 
-  .mx-calendar+.mx-calendar {
+  .mx-calendar + .mx-calendar {
     @apply border-l border-n-weak;
   }
 
@@ -62,7 +62,7 @@
   }
 
   .mx-time {
-    @apply border-0 bg-white dark:bg-slate-800;
+    @apply border-0 bg-n-background dark:bg-n-solid-2;
 
     .mx-time-header {
       @apply border-0;
@@ -70,11 +70,11 @@
 
     .mx-time-item {
       &.disabled {
-        @apply bg-slate-25 dark:bg-slate-900;
+        @apply bg-n-slate-2 dark:bg-n-background;
       }
 
       &:hover {
-        @apply bg-slate-75 dark:bg-slate-700;
+        @apply bg-n-slate-3 dark:bg-n-solid-3;
       }
     }
   }
diff --git a/app/javascript/dashboard/assets/scss/plugins/_dropdown.scss b/app/javascript/dashboard/assets/scss/plugins/_dropdown.scss
deleted file mode 100644
index 9ab51d12a..000000000
--- a/app/javascript/dashboard/assets/scss/plugins/_dropdown.scss
+++ /dev/null
@@ -1,7 +0,0 @@
-.dropdown-pane {
-  @apply border rounded-lg hidden relative invisible shadow-lg border-n-strong dark:border-n-strong box-content p-2 w-fit z-[9999];
-
-  &.dropdown-pane--open {
-    @apply bg-n-alpha-3 backdrop-blur-[100px] absolute  block visible;
-  }
-}
diff --git a/app/javascript/dashboard/assets/scss/plugins/_multiselect.scss b/app/javascript/dashboard/assets/scss/plugins/_multiselect.scss
index 1280eb069..b4154e4d8 100644
--- a/app/javascript/dashboard/assets/scss/plugins/_multiselect.scss
+++ b/app/javascript/dashboard/assets/scss/plugins/_multiselect.scss
@@ -17,6 +17,10 @@
     @apply mb-4;
   }
 
+  &.invalid .multiselect__tags {
+    @apply border-0 outline outline-1 outline-n-ruby-8 dark:outline-n-ruby-8 hover:outline-n-ruby-9 dark:hover:outline-n-ruby-9 disabled:outline-n-ruby-8 dark:disabled:outline-n-ruby-8;
+  }
+
   &.multiselect--disabled {
     @apply opacity-50  rounded-lg cursor-not-allowed pointer-events-auto;
 
@@ -124,8 +128,7 @@
   }
 
   .multiselect__input {
-    @include ghost-input;
-    @apply text-sm h-[2.875rem] mb-0 p-0;
+    @apply text-sm h-[2.875rem] mb-0 p-0 shadow-none border-transparent hover:border-transparent hover:shadow-none focus:border-transparent focus:shadow-none active:border-transparent active:shadow-none;
   }
 
   .multiselect__single {
diff --git a/app/javascript/dashboard/assets/scss/views/settings/inbox.scss b/app/javascript/dashboard/assets/scss/views/settings/inbox.scss
deleted file mode 100644
index 8a118b906..000000000
--- a/app/javascript/dashboard/assets/scss/views/settings/inbox.scss
+++ /dev/null
@@ -1 +0,0 @@
-// to be removed
diff --git a/app/javascript/dashboard/assets/scss/views/settings/integrations.scss b/app/javascript/dashboard/assets/scss/views/settings/integrations.scss
deleted file mode 100644
index 8a118b906..000000000
--- a/app/javascript/dashboard/assets/scss/views/settings/integrations.scss
+++ /dev/null
@@ -1 +0,0 @@
-// to be removed
diff --git a/app/javascript/dashboard/assets/scss/widgets/_conversation-view.scss b/app/javascript/dashboard/assets/scss/widgets/_conversation-view.scss
deleted file mode 100644
index b51cbe07d..000000000
--- a/app/javascript/dashboard/assets/scss/widgets/_conversation-view.scss
+++ /dev/null
@@ -1,261 +0,0 @@
-// scss-lint:disable MergeableSelector
-
-@tailwind utilities;
-@layer utilities {
-  .custom-gradient {
-    background-image: linear-gradient(
-      -180deg,
-      transparent 3%,
-      rgb(76 81 85) 130%
-    );
-  }
-
-  .bubble-with-types {
-    @apply py-2 text-sm font-normal bg-woot-500 dark:bg-woot-500 relative px-4 m-0 text-white dark:text-white;
-
-    .message-text__wrap {
-      @apply relative;
-
-      .link {
-        @apply text-white dark:text-white underline;
-      }
-    }
-
-    .image,
-    .video {
-      @apply cursor-pointer relative;
-
-      .modal-container {
-        @apply text-center;
-      }
-
-      .modal-image {
-        @apply max-h-[76vh] max-w-[76vw];
-      }
-
-      .modal-video {
-        @apply max-h-[76vh] max-w-[76vw];
-      }
-
-      &::before {
-        @apply custom-gradient bottom-0 h-[20%] content-[''] left-0 absolute w-full opacity-80;
-      }
-    }
-  }
-}
-
-.conversation-panel {
-  @apply flex-shrink flex-grow basis-px flex flex-col overflow-y-auto relative h-full m-0 pb-4;
-}
-
-.conversation-panel > li {
-  @apply flex flex-shrink-0 flex-grow-0 flex-auto max-w-full mt-0 mr-0 mb-1 ml-0 relative first:mt-auto last:mb-0;
-
-  &.unread--toast {
-    + .right {
-      @apply mb-1;
-    }
-
-    + .left {
-      @apply mb-0;
-    }
-
-    span {
-      @apply shadow-lg rounded-full bg-woot-500 dark:bg-woot-500 text-white dark:text-white text-xs font-medium my-2.5 mx-auto px-2.5 py-1.5;
-    }
-  }
-
-  .bubble {
-    @apply bubble-with-types text-left break-words;
-
-    .aplayer {
-      @apply shadow-none;
-      font-family: inherit;
-    }
-  }
-
-  &.left {
-    .bubble {
-      @apply rounded-r-lg rounded-l mr-auto break-words;
-
-      &:not(.is-unsupported) {
-        @apply border border-slate-50 dark:border-slate-700 bg-white dark:bg-slate-700 text-black-900 dark:text-slate-50;
-      }
-
-      &.is-image {
-        @apply rounded-lg;
-      }
-
-      .link {
-        @apply text-woot-600 dark:text-woot-600;
-      }
-
-      .file {
-        .attachment-name {
-          @apply text-slate-700 dark:text-woot-300;
-        }
-
-        .icon-wrap {
-          @apply text-woot-600 dark:text-woot-600;
-        }
-
-        .download {
-          @apply text-woot-600 dark:text-woot-600;
-        }
-      }
-    }
-
-    + .right {
-      @apply mt-2.5;
-
-      .bubble {
-        @apply rounded-tr-lg;
-      }
-    }
-
-    + .unread--toast {
-      + .right {
-        @apply mt-2.5;
-
-        .bubble {
-          @apply rounded-tr-lg;
-        }
-      }
-
-      + .left {
-        @apply mt-0;
-      }
-    }
-  }
-
-  &.right {
-    @apply justify-end;
-
-    .wrap {
-      @apply flex items-end mr-4 text-right;
-
-      .sender--info {
-        @apply pt-2 pb-1 pr-0 pl-2;
-      }
-    }
-
-    .bubble {
-      @apply ml-auto break-words rounded-l-lg rounded-r;
-
-      &.is-private {
-        @apply text-black-900 dark:text-white relative border border-solid bg-yellow-100 dark:bg-yellow-700 border-yellow-200 dark:border-yellow-600/25;
-
-        blockquote {
-          @apply border-slate-400 dark:border-slate-400 text-slate-800 dark:text-slate-300;
-
-          p {
-            @apply text-slate-600 dark:text-slate-300;
-          }
-        }
-      }
-
-      &.is-image {
-        @apply rounded-lg;
-
-        .message__mail-head {
-          @apply px-4 py-2;
-        }
-      }
-    }
-
-    + .left {
-      @apply mt-2.5;
-
-      .bubble {
-        @apply rounded-tl-lg;
-      }
-    }
-
-    + .unread--toast {
-      + .left {
-        @apply rounded-lg;
-
-        .bubble {
-          @apply rounded-tl-lg;
-        }
-      }
-
-      + .right {
-        @apply mt-0;
-      }
-    }
-  }
-
-  &.center {
-    @apply items-center justify-center;
-  }
-
-  .wrap {
-    max-width: Min(31rem, 84%);
-    @apply my-0 mx-4;
-
-    .sender--name {
-      @apply text-xs mb-1;
-    }
-  }
-
-  .sender--thumbnail {
-    @apply h-3 mr-3 mt-0.5 w-3 rounded-full;
-  }
-
-  .activity-wrap {
-    @apply flex justify-center text-sm my-1 mx-0 py-1 pr-0.5 pl-2.5 bg-slate-50 dark:bg-slate-600 text-slate-800 dark:text-slate-100 rounded-md border border-slate-100 dark:border-slate-600 border-solid;
-
-    .is-text {
-      @apply inline-flex items-center text-start 2xl:flex;
-    }
-  }
-}
-
-.activity-wrap .message-text__wrap {
-  .text-content p {
-    @apply mb-0;
-  }
-}
-
-.conversation-footer {
-  @apply flex relative flex-col;
-}
-
-.left .bubble .text-content {
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6 {
-    @apply text-slate-800 dark:text-slate-100;
-  }
-
-  a {
-    @apply text-woot-500 dark:text-woot-500 underline;
-  }
-
-  p:last-child {
-    @apply mb-0;
-  }
-}
-
-.right .bubble .text-content {
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6 {
-    @apply text-white dark:text-white;
-  }
-
-  a {
-    @apply text-white dark:text-white underline;
-  }
-
-  p:last-child {
-    @apply mb-0;
-  }
-}
diff --git a/app/javascript/dashboard/assets/scss/widgets/_tabs.scss b/app/javascript/dashboard/assets/scss/widgets/_tabs.scss
deleted file mode 100644
index 72773de7f..000000000
--- a/app/javascript/dashboard/assets/scss/widgets/_tabs.scss
+++ /dev/null
@@ -1,77 +0,0 @@
-.tabs--container {
-  @apply flex;
-}
-
-.tabs--container--with-border {
-  @apply border-b border-b-n-weak;
-}
-
-.tabs--container--compact.tab--chat-type {
-  .tabs-title {
-    a {
-      @apply py-2 text-sm;
-    }
-  }
-}
-
-.tabs {
-  @apply border-r-0 border-l-0 border-t-0 flex min-w-[6.25rem] py-0 px-4 list-none mb-0;
-}
-
-.tabs--with-scroll {
-  @apply overflow-hidden py-0 px-1;
-  max-width: calc(100% - 64px);
-}
-
-.tabs--scroll-button {
-  @apply items-center rounded-none cursor-pointer flex h-auto justify-center min-w-[2rem];
-}
-
-// Tab chat type
-.tab--chat-type {
-  @apply flex;
-
-  .tabs-title {
-    a {
-      @apply text-base font-medium py-3;
-    }
-  }
-}
-
-.tabs-title {
-  @apply flex-shrink-0 my-0 mx-2;
-
-  .badge {
-    @apply bg-n-alpha-black2 dark:bg-n-solid-3 rounded-md text-n-slate-11 h-5 flex items-center justify-center text-xxs font-semibold my-0 mx-1 px-1 py-0;
-  }
-
-  &:first-child {
-    @apply ml-0;
-  }
-
-  &:last-child {
-    @apply mr-0;
-  }
-
-  &:hover,
-  &:focus {
-    a {
-      @apply text-n-slate-12;
-    }
-  }
-
-  a {
-    @apply flex items-center flex-row border-b py-2.5 select-none cursor-pointer border-transparent text-n-slate-11 text-sm top-[1px] relative;
-    transition: border-color 0.15s $swift-ease-out-function;
-  }
-
-  &.is-active {
-    a {
-      @apply border-b border-n-brand text-n-blue-text;
-    }
-
-    .badge {
-      @apply bg-n-brand/10 dark:bg-n-brand/20 text-n-blue-text;
-    }
-  }
-}
diff --git a/app/javascript/dashboard/assets/scss/widgets/_woot-tables.scss b/app/javascript/dashboard/assets/scss/widgets/_woot-tables.scss
deleted file mode 100644
index b5182bf87..000000000
--- a/app/javascript/dashboard/assets/scss/widgets/_woot-tables.scss
+++ /dev/null
@@ -1,90 +0,0 @@
-table {
-  @apply border-spacing-0 text-sm w-full;
-
-
-}
-
-.woot-table {
-  thead {
-    th {
-      @apply font-semibold tracking-[1px] text-left px-2.5 uppercase text-slate-900 dark:text-slate-200;
-    }
-  }
-
-  tbody {
-    tr {
-      @apply border-b border-slate-50 dark:border-slate-800/30;
-    }
-
-    td {
-      @apply p-2.5 text-slate-700 dark:text-slate-100;
-    }
-  }
-
-  tr {
-    .show-if-hover {
-      transition: opacity 0.2s $swift-ease-out-function;
-      @apply opacity-0;
-    }
-
-    &:hover {
-      .show-if-hover {
-        @apply opacity-100;
-      }
-    }
-  }
-
-  .agent-name {
-    @apply block font-medium capitalize;
-  }
-
-  .woot-thumbnail {
-    @apply rounded-full h-[3.125rem] w-[3.125rem];
-  }
-
-  .button-wrapper {
-    @apply flex justify-start flex-row min-w-[12.5rem] gap-1;
-  }
-
-  .button {
-    margin: 0;
-  }
-}
-
-.ve-table {
-  .ve-table-container.ve-table-border-around {
-    @apply border-slate-200 dark:border-slate-700;
-  }
-
-  .ve-table-content {
-    .ve-table-header .ve-table-header-tr .ve-table-header-th {
-      @apply bg-slate-50 dark:bg-slate-800 text-slate-800 dark:text-slate-100 border-slate-100 dark:border-slate-700/50;
-    }
-
-    .ve-table-body .ve-table-body-tr .ve-table-body-td {
-      @apply bg-white dark:bg-slate-900 text-slate-900 dark:text-slate-100 border-slate-75 dark:border-slate-800;
-    }
-
-    .ve-table-body.ve-table-row-hover .ve-table-body-tr:hover td {
-      @apply bg-slate-50 dark:bg-slate-700 text-slate-800 dark:text-slate-100;
-    }
-  }
-}
-
-.table-pagination {
-  .ve-pagination-total {
-    @apply text-slate-600 dark:text-slate-200;
-  }
-
-  .ve-pagination-goto {
-    @apply text-slate-600 dark:text-slate-200;
-
-    .ve-pagination-goto-input {
-      @apply bg-white dark:bg-slate-900 text-slate-600 dark:text-slate-200;
-    }
-  }
-
-  .ve-pagination-li {
-    @apply bg-white dark:bg-slate-900 text-slate-600 dark:text-slate-200 border-slate-75 dark:border-slate-700;
-  }
-}
diff --git a/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/LiveChatCampaign/LiveChatCampaignDialog.vue b/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/LiveChatCampaign/LiveChatCampaignDialog.vue
index 574b06125..36cb7c7e2 100644
--- a/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/LiveChatCampaign/LiveChatCampaignDialog.vue
+++ b/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/LiveChatCampaign/LiveChatCampaignDialog.vue
@@ -40,9 +40,9 @@ const handleSubmit = campaignDetails => {
 
 <template>
   <div
-    class="w-[25rem] z-50 min-w-0 absolute top-10 ltr:right-0 rtl:left-0 bg-n-alpha-3 backdrop-blur-[100px] p-6 rounded-xl border border-slate-50 dark:border-slate-900 shadow-md flex flex-col gap-6 max-h-[85vh] overflow-y-auto"
+    class="w-[25rem] z-50 min-w-0 absolute top-10 ltr:right-0 rtl:left-0 bg-n-alpha-3 backdrop-blur-[100px] p-6 rounded-xl border border-n-weak shadow-md flex flex-col gap-6 max-h-[85vh] overflow-y-auto"
   >
-    <h3 class="text-base font-medium text-slate-900 dark:text-slate-50">
+    <h3 class="text-base font-medium text-n-slate-12">
       {{ t(`CAMPAIGN.LIVE_CHAT.CREATE.TITLE`) }}
     </h3>
     <LiveChatCampaignForm
diff --git a/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/LiveChatCampaign/LiveChatCampaignForm.vue b/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/LiveChatCampaign/LiveChatCampaignForm.vue
index 1a9bc8cdf..7e5ca21b9 100644
--- a/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/LiveChatCampaign/LiveChatCampaignForm.vue
+++ b/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/LiveChatCampaign/LiveChatCampaignForm.vue
@@ -306,7 +306,7 @@ defineExpose({ prepareCampaignDetails, isSubmitDisabled });
         variant="faded"
         color="slate"
         :label="t('CAMPAIGN.LIVE_CHAT.CREATE.FORM.BUTTONS.CANCEL')"
-        class="w-full bg-n-alpha-2 n-blue-text hover:bg-n-alpha-3"
+        class="w-full bg-n-alpha-2 text-n-blue-text hover:bg-n-alpha-3"
         @click="handleCancel"
       />
       <Button
diff --git a/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/SMSCampaign/SMSCampaignDialog.vue b/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/SMSCampaign/SMSCampaignDialog.vue
index d959499ee..74ec98c2c 100644
--- a/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/SMSCampaign/SMSCampaignDialog.vue
+++ b/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/SMSCampaign/SMSCampaignDialog.vue
@@ -39,9 +39,9 @@ const handleClose = () => emit('close');
 
 <template>
   <div
-    class="w-[25rem] z-50 min-w-0 absolute top-10 ltr:right-0 rtl:left-0 bg-n-alpha-3 backdrop-blur-[100px] p-6 rounded-xl border border-slate-50 dark:border-slate-900 shadow-md flex flex-col gap-6"
+    class="w-[25rem] z-50 min-w-0 absolute top-10 ltr:right-0 rtl:left-0 bg-n-alpha-3 backdrop-blur-[100px] p-6 rounded-xl border border-n-weak shadow-md flex flex-col gap-6"
   >
-    <h3 class="text-base font-medium text-slate-900 dark:text-slate-50">
+    <h3 class="text-base font-medium text-n-slate-12">
       {{ t(`CAMPAIGN.SMS.CREATE.TITLE`) }}
     </h3>
     <SMSCampaignForm @submit="handleSubmit" @cancel="handleClose" />
diff --git a/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/SMSCampaign/SMSCampaignForm.vue b/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/SMSCampaign/SMSCampaignForm.vue
index 653e58a9a..f41e1ae98 100644
--- a/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/SMSCampaign/SMSCampaignForm.vue
+++ b/app/javascript/dashboard/components-next/Campaigns/Pages/CampaignPage/SMSCampaign/SMSCampaignForm.vue
@@ -174,7 +174,7 @@ const handleSubmit = async () => {
         color="slate"
         type="button"
         :label="t('CAMPAIGN.SMS.CREATE.FORM.BUTTONS.CANCEL')"
-        class="w-full bg-n-alpha-2 n-blue-text hover:bg-n-alpha-3"
+        class="w-full bg-n-alpha-2 text-n-blue-text hover:bg-n-alpha-3"
         @click="handleCancel"
       />
       <Button
diff --git a/app/javascript/dashboard/components-next/Contacts/ContactsSidebar/ContactMerge.vue b/app/javascript/dashboard/components-next/Contacts/ContactsSidebar/ContactMerge.vue
index 2a0e79931..eed5a0f52 100644
--- a/app/javascript/dashboard/components-next/Contacts/ContactsSidebar/ContactMerge.vue
+++ b/app/javascript/dashboard/components-next/Contacts/ContactsSidebar/ContactMerge.vue
@@ -130,7 +130,7 @@ const onMergeContacts = async () => {
         variant="faded"
         color="slate"
         :label="t('CONTACTS_LAYOUT.SIDEBAR.MERGE.BUTTONS.CANCEL')"
-        class="w-full bg-n-alpha-2 n-blue-text hover:bg-n-alpha-3"
+        class="w-full bg-n-alpha-2 text-n-blue-text hover:bg-n-alpha-3"
         @click="resetState"
       />
       <Button
diff --git a/app/javascript/dashboard/components-next/Editor/Editor.vue b/app/javascript/dashboard/components-next/Editor/Editor.vue
index 510ae67e2..9e5ff6ab5 100644
--- a/app/javascript/dashboard/components-next/Editor/Editor.vue
+++ b/app/javascript/dashboard/components-next/Editor/Editor.vue
@@ -35,7 +35,7 @@ const messageClass = computed(() => {
     case 'error':
       return 'text-n-ruby-9 dark:text-n-ruby-9';
     case 'success':
-      return 'text-green-500 dark:text-green-400';
+      return 'text-n-teal-10 dark:text-n-teal-10';
     default:
       return 'text-n-slate-11 dark:text-n-slate-11';
   }
diff --git a/app/javascript/dashboard/components-next/EmptyStateLayout.vue b/app/javascript/dashboard/components-next/EmptyStateLayout.vue
index 09b8afee5..f2744dde5 100644
--- a/app/javascript/dashboard/components-next/EmptyStateLayout.vue
+++ b/app/javascript/dashboard/components-next/EmptyStateLayout.vue
@@ -35,12 +35,12 @@ defineProps({
         <div class="flex flex-col items-center justify-center gap-6">
           <div class="flex flex-col items-center justify-center gap-3">
             <h2
-              class="text-3xl font-medium text-center text-slate-900 dark:text-white font-interDisplay"
+              class="text-3xl font-medium text-center text-n-slate-12 font-interDisplay"
             >
               {{ title }}
             </h2>
             <p
-              class="max-w-xl text-base text-center text-slate-600 dark:text-slate-300 font-interDisplay tracking-[0.3px]"
+              class="max-w-xl text-base text-center text-n-slate-11 font-interDisplay tracking-[0.3px]"
             >
               {{ subtitle }}
             </p>
diff --git a/app/javascript/dashboard/components-next/HelpCenter/ArticleCard/ArticleCard.story.vue b/app/javascript/dashboard/components-next/HelpCenter/ArticleCard/ArticleCard.story.vue
index be0c41163..ec5fca38c 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/ArticleCard/ArticleCard.story.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/ArticleCard/ArticleCard.story.vue
@@ -70,7 +70,7 @@ const category = {
       <div
         v-for="(article, index) in articles"
         :key="index"
-        class="px-20 py-4 bg-white dark:bg-slate-900"
+        class="px-20 py-4 bg-n-background"
       >
         <ArticleCard
           :id="article.id"
diff --git a/app/javascript/dashboard/components-next/HelpCenter/CategoryCard/CategoryCard.story.vue b/app/javascript/dashboard/components-next/HelpCenter/CategoryCard/CategoryCard.story.vue
index e279c8dfc..15b658b7d 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/CategoryCard/CategoryCard.story.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/CategoryCard/CategoryCard.story.vue
@@ -32,7 +32,7 @@ const categories = [
       <div
         v-for="(category, index) in categories"
         :key="index"
-        class="px-20 py-4 bg-white dark:bg-slate-900"
+        class="px-20 py-4 bg-n-background"
       >
         <CategoryCard
           :id="category.id"
diff --git a/app/javascript/dashboard/components-next/HelpCenter/CategoryCard/CategoryCard.vue b/app/javascript/dashboard/components-next/HelpCenter/CategoryCard/CategoryCard.vue
index d9a82fde5..ff5b21ae2 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/CategoryCard/CategoryCard.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/CategoryCard/CategoryCard.vue
@@ -121,11 +121,7 @@ const handleAction = ({ action, value }) => {
     </div>
     <span
       class="text-sm line-clamp-3"
-      :class="
-        hasDescription
-          ? 'text-slate-500 dark:text-slate-400'
-          : 'text-slate-400 dark:text-slate-700'
-      "
+      :class="hasDescription ? 'text-n-slate-11' : 'text-n-slate-9'"
     >
       {{ description }}
     </span>
diff --git a/app/javascript/dashboard/components-next/HelpCenter/EmptyState/Article/ArticleEmptyState.story.vue b/app/javascript/dashboard/components-next/HelpCenter/EmptyState/Article/ArticleEmptyState.story.vue
index 4a3cb8135..9a9745cf3 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/EmptyState/Article/ArticleEmptyState.story.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/EmptyState/Article/ArticleEmptyState.story.vue
@@ -8,7 +8,7 @@ import ArticleEmptyState from './ArticleEmptyState.vue';
     :layout="{ type: 'single', width: '1100px' }"
   >
     <Variant title="Article Empty State">
-      <div class="w-full h-full px-20 mx-auto bg-white dark:bg-slate-900">
+      <div class="w-full h-full px-20 mx-auto bg-n-background">
         <ArticleEmptyState />
       </div>
     </Variant>
diff --git a/app/javascript/dashboard/components-next/HelpCenter/EmptyState/Portal/PortalEmptyState.story.vue b/app/javascript/dashboard/components-next/HelpCenter/EmptyState/Portal/PortalEmptyState.story.vue
index 56ab5edc3..72a819be6 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/EmptyState/Portal/PortalEmptyState.story.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/EmptyState/Portal/PortalEmptyState.story.vue
@@ -8,7 +8,7 @@ import PortalEmptyState from './PortalEmptyState.vue';
     :layout="{ type: 'single', width: '1100px' }"
   >
     <Variant title="Portal Empty State">
-      <div class="w-full h-full px-20 mx-auto bg-white dark:bg-slate-900">
+      <div class="w-full h-full px-20 mx-auto bg-n-background">
         <PortalEmptyState />
       </div>
     </Variant>
diff --git a/app/javascript/dashboard/components-next/HelpCenter/LocaleCard/LocaleCard.story.vue b/app/javascript/dashboard/components-next/HelpCenter/LocaleCard/LocaleCard.story.vue
index 2bc5facbb..d51d3dc71 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/LocaleCard/LocaleCard.story.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/LocaleCard/LocaleCard.story.vue
@@ -14,7 +14,7 @@ const locales = [
     :layout="{ type: 'grid', width: '800px' }"
   >
     <Variant title="Locale Card">
-      <div class="px-10 py-4 bg-white dark:bg-slate-900">
+      <div class="px-10 py-4 bg-n-background">
         <div v-for="(locale, index) in locales" :key="index" class="px-20 py-2">
           <LocaleCard
             :locale="locale.name"
diff --git a/app/javascript/dashboard/components-next/HelpCenter/LocaleCard/LocaleCard.vue b/app/javascript/dashboard/components-next/HelpCenter/LocaleCard/LocaleCard.vue
index 0f148fd7b..04e0ab9b1 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/LocaleCard/LocaleCard.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/LocaleCard/LocaleCard.vue
@@ -55,9 +55,7 @@ const handleAction = ({ action, value }) => {
   <CardLayout>
     <div class="flex justify-between gap-2">
       <div class="flex items-center justify-start gap-2">
-        <span
-          class="text-sm font-medium text-slate-900 dark:text-slate-50 line-clamp-1"
-        >
+        <span class="text-sm font-medium text-n-slate-12 line-clamp-1">
           {{ locale }} ({{ localeCode }})
         </span>
         <span
@@ -69,9 +67,7 @@ const handleAction = ({ action, value }) => {
       </div>
       <div class="flex items-center justify-end gap-4">
         <div class="flex items-center gap-4">
-          <span
-            class="text-sm text-slate-500 dark:text-slate-400 whitespace-nowrap"
-          >
+          <span class="text-sm text-n-slate-11 whitespace-nowrap">
             {{
               $t(
                 'HELP_CENTER.LOCALES_PAGE.LOCALE_CARD.ARTICLES_COUNT',
@@ -79,10 +75,8 @@ const handleAction = ({ action, value }) => {
               )
             }}
           </span>
-          <div class="w-px h-3 bg-slate-75 dark:bg-slate-800" />
-          <span
-            class="text-sm text-slate-500 dark:text-slate-400 whitespace-nowrap"
-          >
+          <div class="w-px h-3 bg-n-weak" />
+          <span class="text-sm text-n-slate-11 whitespace-nowrap">
             {{
               $t(
                 'HELP_CENTER.LOCALES_PAGE.LOCALE_CARD.CATEGORIES_COUNT',
diff --git a/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticleEditorPage/ArticleEditor.vue b/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticleEditorPage/ArticleEditor.vue
index 1709d0f5f..7beff200e 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticleEditorPage/ArticleEditor.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticleEditorPage/ArticleEditor.vue
@@ -146,7 +146,7 @@ const previewArticle = () => {
 <style lang="scss" scoped>
 ::v-deep {
   .ProseMirror .empty-node::before {
-    @apply text-slate-200 dark:text-slate-500 text-base;
+    @apply text-n-slate-10 text-base;
   }
 
   .ProseMirror-menubar-wrapper {
@@ -161,7 +161,7 @@ const previewArticle = () => {
 
   .editor-root .has-selection {
     .ProseMirror-menubar {
-      @apply h-8 rounded-lg !px-2 z-50 bg-slate-50 dark:bg-slate-800 items-center gap-4 ml-0 mb-0 shadow-md border border-slate-75 dark:border-slate-700/50;
+      @apply h-8 rounded-lg !px-2 z-50 bg-n-solid-3 items-center gap-4 ml-0 mb-0 shadow-md outline outline-1 outline-n-weak;
       display: flex;
       top: var(--selection-top, auto) !important;
       left: var(--selection-left, 0) !important;
@@ -180,6 +180,10 @@ const previewArticle = () => {
           }
         }
       }
+
+      .ProseMirror-menu-active {
+        @apply bg-n-slate-3;
+      }
     }
   }
 }
diff --git a/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticleEditorPage/ArticleEditorControls.vue b/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticleEditorPage/ArticleEditorControls.vue
index a910f4d8d..c93aa1afd 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticleEditorPage/ArticleEditorControls.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticleEditorPage/ArticleEditorControls.vue
@@ -206,7 +206,7 @@ onMounted(() => {
         />
       </OnClickOutside>
     </div>
-    <div class="w-px h-3 bg-slate-50 dark:bg-slate-800" />
+    <div class="w-px h-3 bg-n-weak" />
     <div class="relative">
       <OnClickOutside @trigger="openCategoryList = false">
         <Button
@@ -239,7 +239,7 @@ onMounted(() => {
       </OnClickOutside>
     </div>
 
-    <div class="w-px h-3 bg-slate-50 dark:bg-slate-800" />
+    <div class="w-px h-3 bg-n-weak" />
     <div class="relative">
       <OnClickOutside @trigger="openProperties = false">
         <Button
diff --git a/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticleEditorPage/ArticleEditorHeader.vue b/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticleEditorPage/ArticleEditorHeader.vue
index cfaa4ce11..2d8b219f7 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticleEditorPage/ArticleEditorHeader.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticleEditorPage/ArticleEditorHeader.vue
@@ -128,7 +128,7 @@ const updateArticleStatus = async ({ value }) => {
     <div class="flex items-center gap-4">
       <span
         v-if="isUpdating || isSaved"
-        class="text-xs font-medium transition-all duration-300 text-slate-500 dark:text-slate-400"
+        class="text-xs font-medium transition-all duration-300 text-n-slate-11"
       >
         {{ statusText }}
       </span>
diff --git a/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticlePage/ArticlesPage.story.vue b/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticlePage/ArticlesPage.story.vue
index cfb353200..58c7acee9 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticlePage/ArticlesPage.story.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/Pages/ArticlePage/ArticlesPage.story.vue
@@ -64,7 +64,7 @@ const articles = [
 <template>
   <Story title="Pages/HelpCenter/ArticlesPage" :layout="{ type: 'single' }">
     <Variant title="All Articles">
-      <div class="w-full min-h-screen bg-white dark:bg-slate-900">
+      <div class="w-full min-h-screen bg-n-background">
         <ArticlesPage :articles="articles" />
       </div>
     </Variant>
diff --git a/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoriesPage.story.vue b/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoriesPage.story.vue
index 8fdafd86a..6165949ba 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoriesPage.story.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoriesPage.story.vue
@@ -201,7 +201,7 @@ const categories = [
 <template>
   <Story title="Pages/HelpCenter/CategoryPage" :layout="{ type: 'single' }">
     <Variant title="All Categories">
-      <div class="w-full min-h-screen bg-white dark:bg-slate-900">
+      <div class="w-full min-h-screen bg-n-background">
         <CategoriesPage :categories="categories" />
       </div>
     </Variant>
diff --git a/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoryDialog.vue b/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoryDialog.vue
index 62c893971..d71c17260 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoryDialog.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoryDialog.vue
@@ -90,9 +90,9 @@ const handleCategory = async formData => {
 
 <template>
   <div
-    class="w-[25rem] absolute top-10 ltr:right-0 rtl:left-0 bg-n-alpha-3 backdrop-blur-[100px] p-6 rounded-xl border border-slate-50 dark:border-slate-900 shadow-md flex flex-col gap-6"
+    class="w-[25rem] absolute top-10 ltr:right-0 rtl:left-0 bg-n-alpha-3 backdrop-blur-[100px] p-6 rounded-xl border border-n-weak shadow-md flex flex-col gap-6"
   >
-    <h3 class="text-base font-medium text-slate-900 dark:text-slate-50">
+    <h3 class="text-base font-medium text-n-slate-12">
       {{
         t(
           `HELP_CENTER.CATEGORY_PAGE.CATEGORY_DIALOG.HEADER.${mode.toUpperCase()}`
diff --git a/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoryForm.vue b/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoryForm.vue
index 18fabd2af..5c0316b7d 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoryForm.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoryForm.vue
@@ -246,7 +246,7 @@ defineExpose({ state, isSubmitDisabled });
           variant="faded"
           color="slate"
           :label="t('HELP_CENTER.CATEGORY_PAGE.CATEGORY_DIALOG.BUTTONS.CANCEL')"
-          class="w-full bg-n-alpha-2 n-blue-text hover:bg-n-alpha-3"
+          class="w-full bg-n-alpha-2 text-n-blue-text hover:bg-n-alpha-3"
           @click="handleCancel"
         />
         <Button
diff --git a/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoryHeaderControls.vue b/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoryHeaderControls.vue
index 9c62997ef..d4e76cf31 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoryHeaderControls.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/Pages/CategoryPage/CategoryHeaderControls.vue
@@ -147,10 +147,8 @@ const handleBreadcrumbClick = () => {
           />
         </OnClickOutside>
       </div>
-      <div class="w-px h-3.5 rounded my-auto bg-slate-75 dark:bg-slate-800" />
-      <span
-        class="min-w-0 text-sm font-medium truncate text-slate-800 dark:text-slate-100"
-      >
+      <div class="w-px h-3.5 rounded my-auto bg-n-weak" />
+      <span class="min-w-0 text-sm font-medium truncate text-n-slate-12">
         {{
           t('HELP_CENTER.CATEGORY_PAGE.CATEGORY_HEADER.CATEGORIES_COUNT', {
             n: categoriesCount,
diff --git a/app/javascript/dashboard/components-next/HelpCenter/Pages/LocalePage/LocalesPage.story.vue b/app/javascript/dashboard/components-next/HelpCenter/Pages/LocalePage/LocalesPage.story.vue
index 630c50ca4..54adbcb3b 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/Pages/LocalePage/LocalesPage.story.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/Pages/LocalePage/LocalesPage.story.vue
@@ -44,7 +44,7 @@ const locales = [
 <template>
   <Story title="Pages/HelpCenter/LocalePage" :layout="{ type: 'single' }">
     <Variant title="All Locales">
-      <div class="w-full min-h-screen bg-white dark:bg-slate-900">
+      <div class="w-full min-h-screen bg-n-background">
         <LocalesPage :locales="locales" />
       </div>
     </Variant>
diff --git a/app/javascript/dashboard/components-next/HelpCenter/Pages/LocalePage/LocalesPage.vue b/app/javascript/dashboard/components-next/HelpCenter/Pages/LocalePage/LocalesPage.vue
index 5b25779c7..22dd42edd 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/Pages/LocalePage/LocalesPage.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/Pages/LocalePage/LocalesPage.vue
@@ -35,7 +35,7 @@ const localeCount = computed(() => props.locales?.length);
     <template #header-actions>
       <div class="flex items-center justify-between">
         <div class="flex items-center gap-4">
-          <span class="text-sm font-medium text-slate-800 dark:text-slate-100">
+          <span class="text-sm font-medium text-n-slate-12">
             {{ $t('HELP_CENTER.LOCALES_PAGE.LOCALES_COUNT', localeCount) }}
           </span>
         </div>
diff --git a/app/javascript/dashboard/components-next/HelpCenter/Pages/PortalSettingsPage/PortalBaseSettings.vue b/app/javascript/dashboard/components-next/HelpCenter/Pages/PortalSettingsPage/PortalBaseSettings.vue
index 34f1e003f..7995270b5 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/Pages/PortalSettingsPage/PortalBaseSettings.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/Pages/PortalSettingsPage/PortalBaseSettings.vue
@@ -211,7 +211,7 @@ const handleAvatarDelete = () => {
         class="grid items-start justify-between w-full gap-2 grid-cols-[200px,1fr]"
       >
         <label
-          class="text-sm font-medium whitespace-nowrap py-2.5 text-slate-900 dark:text-slate-50"
+          class="text-sm font-medium whitespace-nowrap py-2.5 text-n-slate-12"
         >
           {{ t('HELP_CENTER.PORTAL_SETTINGS.FORM.NAME.LABEL') }}
         </label>
@@ -229,7 +229,7 @@ const handleAvatarDelete = () => {
         class="grid items-start justify-between w-full gap-2 grid-cols-[200px,1fr]"
       >
         <label
-          class="text-sm font-medium whitespace-nowrap py-2.5 text-slate-900 dark:text-slate-50"
+          class="text-sm font-medium whitespace-nowrap py-2.5 text-n-slate-12"
         >
           {{ t('HELP_CENTER.PORTAL_SETTINGS.FORM.HEADER_TEXT.LABEL') }}
         </label>
@@ -245,7 +245,7 @@ const handleAvatarDelete = () => {
         class="grid items-start justify-between w-full gap-2 grid-cols-[200px,1fr]"
       >
         <label
-          class="text-sm font-medium whitespace-nowrap text-slate-900 py-2.5 dark:text-slate-50"
+          class="text-sm font-medium whitespace-nowrap text-n-slate-12 py-2.5"
         >
           {{ t('HELP_CENTER.PORTAL_SETTINGS.FORM.PAGE_TITLE.LABEL') }}
         </label>
@@ -261,7 +261,7 @@ const handleAvatarDelete = () => {
         class="grid items-start justify-between w-full gap-2 grid-cols-[200px,1fr]"
       >
         <label
-          class="text-sm font-medium whitespace-nowrap text-slate-900 py-2.5 dark:text-slate-50"
+          class="text-sm font-medium whitespace-nowrap text-n-slate-12 py-2.5"
         >
           {{ t('HELP_CENTER.PORTAL_SETTINGS.FORM.HOME_PAGE_LINK.LABEL') }}
         </label>
@@ -281,7 +281,7 @@ const handleAvatarDelete = () => {
         class="grid items-start justify-between w-full gap-2 grid-cols-[200px,1fr]"
       >
         <label
-          class="text-sm font-medium whitespace-nowrap py-2.5 text-slate-900 dark:text-slate-50"
+          class="text-sm font-medium whitespace-nowrap py-2.5 text-n-slate-12"
         >
           {{ t('HELP_CENTER.PORTAL_SETTINGS.FORM.SLUG.LABEL') }}
         </label>
@@ -299,7 +299,7 @@ const handleAvatarDelete = () => {
         class="grid items-start justify-between w-full gap-2 grid-cols-[200px,1fr]"
       >
         <label
-          class="text-sm font-medium whitespace-nowrap py-2.5 text-slate-900 dark:text-slate-50"
+          class="text-sm font-medium whitespace-nowrap py-2.5 text-n-slate-12"
         >
           {{ t('HELP_CENTER.PORTAL_SETTINGS.FORM.LIVE_CHAT_WIDGET.LABEL') }}
         </label>
@@ -317,7 +317,7 @@ const handleAvatarDelete = () => {
       </div>
       <div class="flex items-start justify-between w-full gap-2">
         <label
-          class="text-sm font-medium whitespace-nowrap py-2.5 text-slate-900 dark:text-slate-50"
+          class="text-sm font-medium whitespace-nowrap py-2.5 text-n-slate-12"
         >
           {{ t('HELP_CENTER.PORTAL_SETTINGS.FORM.BRAND_COLOR.LABEL') }}
         </label>
diff --git a/app/javascript/dashboard/components-next/HelpCenter/Pages/PortalSettingsPage/PortalSettings.story.vue b/app/javascript/dashboard/components-next/HelpCenter/Pages/PortalSettingsPage/PortalSettings.story.vue
index 14d460a04..ab25484ad 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/Pages/PortalSettingsPage/PortalSettings.story.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/Pages/PortalSettingsPage/PortalSettings.story.vue
@@ -5,7 +5,7 @@ import PortalSettings from './PortalSettings.vue';
 <template>
   <Story title="Pages/HelpCenter/PortalSettings" :layout="{ type: 'single' }">
     <Variant title="Default">
-      <div class="w-[1000px] min-h-screen bg-white dark:bg-slate-900">
+      <div class="w-[1000px] min-h-screen bg-n-background">
         <PortalSettings />
       </div>
     </Variant>
diff --git a/app/javascript/dashboard/components-next/HelpCenter/Pages/PortalSettingsPage/PortalSettings.vue b/app/javascript/dashboard/components-next/HelpCenter/Pages/PortalSettingsPage/PortalSettings.vue
index a49493818..02b5001b9 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/Pages/PortalSettingsPage/PortalSettings.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/Pages/PortalSettingsPage/PortalSettings.vue
@@ -81,13 +81,13 @@ const handleDeletePortal = () => {
           :is-fetching="isFetching"
           @update-portal="handleUpdatePortal"
         />
-        <div class="w-full h-px bg-slate-50 dark:bg-slate-800/50" />
+        <div class="w-full h-px bg-n-weak" />
         <PortalConfigurationSettings
           :active-portal="activePortal"
           :is-fetching="isFetching"
           @update-portal-configuration="handleUpdatePortalConfiguration"
         />
-        <div class="w-full h-px bg-slate-50 dark:bg-slate-800/50" />
+        <div class="w-full h-px bg-n-weak" />
         <div class="flex items-end justify-between w-full gap-4">
           <div class="flex flex-col gap-2">
             <h6 class="text-base font-medium text-n-slate-12">
diff --git a/app/javascript/dashboard/components-next/HelpCenter/PortalSwitcher/PortalSwitcher.story.vue b/app/javascript/dashboard/components-next/HelpCenter/PortalSwitcher/PortalSwitcher.story.vue
index e1a9dfa17..a26f5a8de 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/PortalSwitcher/PortalSwitcher.story.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/PortalSwitcher/PortalSwitcher.story.vue
@@ -32,7 +32,7 @@ const portals = [
     :layout="{ type: 'grid', width: '510px' }"
   >
     <Variant title="Portal Switcher">
-      <div class="h-[500px] p-4 bg-slate-100 dark:bg-slate-900">
+      <div class="h-[500px] p-4 bg-n-slate-2 dark:bg-n-background">
         <PortalSwitcher
           :portals="portals"
           header="Choose a Portal"
diff --git a/app/javascript/dashboard/components-next/HelpCenter/PortalSwitcher/PortalSwitcher.vue b/app/javascript/dashboard/components-next/HelpCenter/PortalSwitcher/PortalSwitcher.vue
index 5a835f8cb..bfc173d16 100644
--- a/app/javascript/dashboard/components-next/HelpCenter/PortalSwitcher/PortalSwitcher.vue
+++ b/app/javascript/dashboard/components-next/HelpCenter/PortalSwitcher/PortalSwitcher.vue
@@ -100,7 +100,7 @@ const redirectToPortalHomePage = () => {
       <div class="flex flex-col gap-1">
         <div class="flex items-center gap-2">
           <h2
-            class="text-base font-medium cursor-pointer text-slate-900 dark:text-slate-50 w-fit hover:underline"
+            class="text-base font-medium cursor-pointer text-n-slate-12 w-fit hover:underline"
             @click="redirectToPortalHomePage"
           >
             {{ t('HELP_CENTER.PORTAL_SWITCHER.PORTALS') }}
@@ -115,7 +115,7 @@ const redirectToPortalHomePage = () => {
             @click="onClickPreviewPortal"
           />
         </div>
-        <p class="text-sm text-slate-600 dark:text-slate-300">
+        <p class="text-sm text-n-slate-11">
           {{ t('HELP_CENTER.PORTAL_SWITCHER.CREATE_PORTAL') }}
         </p>
       </div>
diff --git a/app/javascript/dashboard/components-next/avatar/Avatar.story.vue b/app/javascript/dashboard/components-next/avatar/Avatar.story.vue
index 12b804e72..cdb03edcb 100644
--- a/app/javascript/dashboard/components-next/avatar/Avatar.story.vue
+++ b/app/javascript/dashboard/components-next/avatar/Avatar.story.vue
@@ -5,7 +5,7 @@ import Avatar from './Avatar.vue';
 <template>
   <Story title="Components/Avatar" :layout="{ type: 'grid', width: '400' }">
     <Variant title="Default">
-      <div class="flex p-4 space-x-4 bg-white dark:bg-slate-900">
+      <div class="flex p-4 space-x-4 bg-n-background">
         <Avatar
           name=""
           src="https://api.dicebear.com/9.x/thumbs/svg?seed=Amaya"
@@ -16,7 +16,7 @@ import Avatar from './Avatar.vue';
     </Variant>
 
     <Variant title="Different Shapes">
-      <div class="gap-4 p-4 bg-white dark:bg-slate-900">
+      <div class="gap-4 p-4 bg-n-background">
         <Avatar
           src="https://api.dicebear.com/9.x/thumbs/svg?seed=Amaya"
           name=""
@@ -34,7 +34,7 @@ import Avatar from './Avatar.vue';
     </Variant>
 
     <Variant title="Different Sizes">
-      <div class="flex flex-wrap gap-4 p-4 bg-white dark:bg-slate-900">
+      <div class="flex flex-wrap gap-4 p-4 bg-n-background">
         <Avatar
           src="https://api.dicebear.com/9.x/avataaars/svg?seed=Felix"
           :size="48"
@@ -57,7 +57,7 @@ import Avatar from './Avatar.vue';
     </Variant>
 
     <Variant title="With Status">
-      <div class="flex flex-wrap gap-4 p-4 bg-white dark:bg-slate-900">
+      <div class="flex flex-wrap gap-4 p-4 bg-n-background">
         <Avatar
           src="https://api.dicebear.com/9.x/thumbs/svg?seed=Felix"
           status="online"
@@ -77,7 +77,7 @@ import Avatar from './Avatar.vue';
     </Variant>
 
     <Variant title="With Custom Icon">
-      <div class="flex flex-wrap gap-4 p-4 bg-white dark:bg-slate-900">
+      <div class="flex flex-wrap gap-4 p-4 bg-n-background">
         <Avatar name="Custom Icon" icon-name="i-lucide-user" :size="48" />
         <Avatar
           name="Custom Industry"
@@ -88,7 +88,7 @@ import Avatar from './Avatar.vue';
     </Variant>
 
     <Variant title="Upload States">
-      <div class="flex flex-wrap gap-4 p-4 bg-white dark:bg-slate-900">
+      <div class="flex flex-wrap gap-4 p-4 bg-n-background">
         <!-- Empty state with upload -->
         <Avatar name="Upload New" allow-upload :size="48" />
 
@@ -103,7 +103,7 @@ import Avatar from './Avatar.vue';
     </Variant>
 
     <Variant title="Name Initials">
-      <div class="flex flex-wrap gap-4 p-4 bg-white dark:bg-slate-900">
+      <div class="flex flex-wrap gap-4 p-4 bg-n-background">
         <Avatar name="Catherine" :size="48" />
         <Avatar name="John Doe" :size="48" />
         <Avatar name="Rose Doe John" :size="48" />
diff --git a/app/javascript/dashboard/components-next/breadcrumb/Breadcrumb.story.vue b/app/javascript/dashboard/components-next/breadcrumb/Breadcrumb.story.vue
index 0c2bdf115..8fe74d7ba 100644
--- a/app/javascript/dashboard/components-next/breadcrumb/Breadcrumb.story.vue
+++ b/app/javascript/dashboard/components-next/breadcrumb/Breadcrumb.story.vue
@@ -29,32 +29,32 @@ const longBreadcrumb = ref([
     :layout="{ type: 'grid', width: '800px' }"
   >
     <Variant title="Single Item">
-      <div class="w-full p-4 bg-white dark:bg-slate-900">
+      <div class="w-full p-4 bg-n-background">
         <Breadcrumb :items="singleItem" />
       </div>
     </Variant>
 
     <Variant title="Two Items">
-      <div class="w-full p-4 bg-white dark:bg-slate-900">
+      <div class="w-full p-4 bg-n-background">
         <Breadcrumb :items="twoItems" />
       </div>
     </Variant>
 
     <Variant title="Three Items with Count">
-      <div class="w-full p-4 bg-white dark:bg-slate-900">
+      <div class="w-full p-4 bg-n-background">
         <Breadcrumb :items="threeItems" count-label="articles" />
       </div>
     </Variant>
 
     <Variant title="Long Breadcrumb">
-      <div class="w-full p-4 bg-white dark:bg-slate-900">
+      <div class="w-full p-4 bg-n-background">
         <Breadcrumb :items="longBreadcrumb" count-label="articles" />
       </div>
     </Variant>
 
     <Variant title="RTL Support">
       <div dir="rtl">
-        <div class="w-full p-4 bg-white dark:bg-slate-900">
+        <div class="w-full p-4 bg-n-background">
           <Breadcrumb :items="threeItems" count-label="articles" />
         </div>
       </div>
diff --git a/app/javascript/dashboard/components-next/breadcrumb/Breadcrumb.vue b/app/javascript/dashboard/components-next/breadcrumb/Breadcrumb.vue
index bb848c62b..8ca325607 100644
--- a/app/javascript/dashboard/components-next/breadcrumb/Breadcrumb.vue
+++ b/app/javascript/dashboard/components-next/breadcrumb/Breadcrumb.vue
@@ -36,9 +36,7 @@ const onClick = event => {
             icon="i-lucide-chevron-right"
             class="flex-shrink-0 mx-2 size-4 text-n-slate-11 dark:text-n-slate-11"
           />
-          <span
-            class="text-sm truncate text-slate-900 dark:text-slate-50 max-w-56"
-          >
+          <span class="text-sm truncate text-n-slate-12 max-w-56">
             {{ item.emoji ? item.emoji : '' }} {{ item.label }}
           </span>
         </template>
diff --git a/app/javascript/dashboard/components-next/button/Button.story.vue b/app/javascript/dashboard/components-next/button/Button.story.vue
index 404712b34..53d0f3e2e 100644
--- a/app/javascript/dashboard/components-next/button/Button.story.vue
+++ b/app/javascript/dashboard/components-next/button/Button.story.vue
@@ -11,7 +11,7 @@ const SIZES = ['default', 'sm', 'lg'];
   <Story title="Components/Button" :layout="{ type: 'grid', width: '800px' }">
     <!-- Basic Variants -->
     <Variant title="Basic Variants">
-      <div class="flex flex-wrap gap-2 p-4 bg-white dark:bg-slate-900">
+      <div class="flex flex-wrap gap-2 p-4 bg-n-background">
         <Button
           v-for="variant in VARIANTS"
           :key="variant"
@@ -23,7 +23,7 @@ const SIZES = ['default', 'sm', 'lg'];
 
     <!-- Colors -->
     <Variant title="Color Variants">
-      <div class="flex flex-wrap gap-2 p-4 bg-white dark:bg-slate-900">
+      <div class="flex flex-wrap gap-2 p-4 bg-n-background">
         <Button
           v-for="color in COLORS"
           :key="color"
@@ -35,16 +35,14 @@ const SIZES = ['default', 'sm', 'lg'];
 
     <!-- Sizes -->
     <Variant title="Size Variants">
-      <div
-        class="flex flex-wrap items-center gap-2 p-4 bg-white dark:bg-slate-900"
-      >
+      <div class="flex flex-wrap items-center gap-2 p-4 bg-n-background">
         <Button v-for="size in SIZES" :key="size" :label="size" :size="size" />
       </div>
     </Variant>
 
     <!-- Icons -->
     <Variant title="Icons">
-      <div class="flex flex-wrap gap-2 p-4 bg-white dark:bg-slate-900">
+      <div class="flex flex-wrap gap-2 p-4 bg-n-background">
         <Button label="Leading Icon" icon="i-lucide-plus" />
         <Button label="Trailing Icon" icon="i-lucide-plus" trailing-icon />
         <Button icon="i-lucide-plus" />
@@ -53,7 +51,7 @@ const SIZES = ['default', 'sm', 'lg'];
 
     <!-- Loading State -->
     <Variant title="Loading State">
-      <div class="flex flex-wrap gap-2 p-4 bg-white dark:bg-slate-900">
+      <div class="flex flex-wrap gap-2 p-4 bg-n-background">
         <Button label="Loading" is-loading />
         <Button label="Loading" variant="outline" is-loading />
         <Button is-loading icon="i-lucide-plus" />
@@ -62,7 +60,7 @@ const SIZES = ['default', 'sm', 'lg'];
 
     <!-- Disabled State -->
     <Variant title="Disabled State">
-      <div class="flex flex-wrap gap-2 p-4 bg-white dark:bg-slate-900">
+      <div class="flex flex-wrap gap-2 p-4 bg-n-background">
         <Button label="Disabled" disabled />
         <Button label="Disabled Outline" variant="outline" disabled />
         <Button label="Disabled Icon" icon="delete" disabled />
@@ -78,7 +76,7 @@ const SIZES = ['default', 'sm', 'lg'];
 
     <!-- Color Combinations -->
     <Variant title="Color & Variant Combinations">
-      <div class="flex flex-wrap gap-2 p-4 bg-white dark:bg-slate-900">
+      <div class="flex flex-wrap gap-2 p-4 bg-n-background">
         <template v-for="color in COLORS" :key="color">
           <Button
             v-for="variant in VARIANTS"
@@ -93,7 +91,7 @@ const SIZES = ['default', 'sm', 'lg'];
 
     <!-- Icon Positions -->
     <Variant title="Icon Positions & Sizes">
-      <div class="flex flex-wrap gap-2 p-4 bg-white dark:bg-slate-900">
+      <div class="flex flex-wrap gap-2 p-4 bg-n-background">
         <template v-for="size in SIZES" :key="size">
           <Button
             :label="`${size} Leading`"
@@ -113,7 +111,7 @@ const SIZES = ['default', 'sm', 'lg'];
 
     <!-- Ghost & Link Variants -->
     <Variant title="Ghost & Link Variants">
-      <div class="flex flex-wrap gap-2 p-4 bg-white dark:bg-slate-900">
+      <div class="flex flex-wrap gap-2 p-4 bg-n-background">
         <Button label="Ghost Button" variant="ghost" color="slate" />
         <Button
           label="Ghost with Icon"
diff --git a/app/javascript/dashboard/components-next/button/ConfirmButton.story.vue b/app/javascript/dashboard/components-next/button/ConfirmButton.story.vue
index 673661a74..8e2847982 100644
--- a/app/javascript/dashboard/components-next/button/ConfirmButton.story.vue
+++ b/app/javascript/dashboard/components-next/button/ConfirmButton.story.vue
@@ -15,7 +15,7 @@ const incrementCount = () => {
     :layout="{ type: 'grid', width: '400px' }"
   >
     <Variant title="Basic">
-      <div class="grid gap-2 p-4 bg-white dark:bg-slate-900">
+      <div class="grid gap-2 p-4 bg-n-background">
         <p>{{ count }}</p>
         <ConfirmButton
           label="Delete"
@@ -26,7 +26,7 @@ const incrementCount = () => {
     </Variant>
 
     <Variant title="Color Change">
-      <div class="grid gap-2 p-4 bg-white dark:bg-slate-900">
+      <div class="grid gap-2 p-4 bg-n-background">
         <p>{{ count }}</p>
         <ConfirmButton
           label="Archive"
diff --git a/app/javascript/dashboard/components-next/captain/assistant/AssistantCard.story.vue b/app/javascript/dashboard/components-next/captain/assistant/AssistantCard.story.vue
index b388d067e..7557d01dd 100644
--- a/app/javascript/dashboard/components-next/captain/assistant/AssistantCard.story.vue
+++ b/app/javascript/dashboard/components-next/captain/assistant/AssistantCard.story.vue
@@ -12,7 +12,7 @@ import { assistantsList } from 'dashboard/components-next/captain/pageComponents
       <div
         v-for="(assistant, index) in assistantsList"
         :key="index"
-        class="px-20 py-4 bg-white dark:bg-slate-900"
+        class="px-20 py-4 bg-n-background"
       >
         <AssistantCard
           :id="assistant.id"
diff --git a/app/javascript/dashboard/components-next/captain/assistant/DocumentCard.story.vue b/app/javascript/dashboard/components-next/captain/assistant/DocumentCard.story.vue
index df1ada6cc..40d2f1f04 100644
--- a/app/javascript/dashboard/components-next/captain/assistant/DocumentCard.story.vue
+++ b/app/javascript/dashboard/components-next/captain/assistant/DocumentCard.story.vue
@@ -12,7 +12,7 @@ import { documentsList } from 'dashboard/components-next/captain/pageComponents/
       <div
         v-for="(doc, index) in documentsList"
         :key="index"
-        class="px-20 py-4 bg-white dark:bg-slate-900"
+        class="px-20 py-4 bg-n-background"
       >
         <DocumentCard
           :id="doc.id"
diff --git a/app/javascript/dashboard/components-next/captain/assistant/InboxCard.story.vue b/app/javascript/dashboard/components-next/captain/assistant/InboxCard.story.vue
index 2fd0e9756..afddce442 100644
--- a/app/javascript/dashboard/components-next/captain/assistant/InboxCard.story.vue
+++ b/app/javascript/dashboard/components-next/captain/assistant/InboxCard.story.vue
@@ -12,7 +12,7 @@ import { inboxes } from 'dashboard/components-next/captain/pageComponents/emptyS
       <div
         v-for="inbox in inboxes"
         :key="inbox.id"
-        class="px-20 py-4 bg-white dark:bg-slate-900"
+        class="px-20 py-4 bg-n-background"
       >
         <InboxCard :id="inbox.id" :inbox="inbox" />
       </div>
diff --git a/app/javascript/dashboard/components-next/captain/assistant/ResponseCard.story.vue b/app/javascript/dashboard/components-next/captain/assistant/ResponseCard.story.vue
index 1a281b799..0842422b9 100644
--- a/app/javascript/dashboard/components-next/captain/assistant/ResponseCard.story.vue
+++ b/app/javascript/dashboard/components-next/captain/assistant/ResponseCard.story.vue
@@ -12,7 +12,7 @@ import { responsesList } from 'dashboard/components-next/captain/pageComponents/
       <div
         v-for="(response, index) in responsesList"
         :key="index"
-        class="px-20 py-4 bg-white dark:bg-slate-900"
+        class="px-20 py-4 bg-n-background"
       >
         <ResponseCard
           :id="response.id"
diff --git a/app/javascript/dashboard/components-next/captain/pageComponents/assistant/AssistantForm.vue b/app/javascript/dashboard/components-next/captain/pageComponents/assistant/AssistantForm.vue
index 3c8afec07..8c26de2f5 100644
--- a/app/javascript/dashboard/components-next/captain/pageComponents/assistant/AssistantForm.vue
+++ b/app/javascript/dashboard/components-next/captain/pageComponents/assistant/AssistantForm.vue
@@ -159,7 +159,7 @@ watch(
         variant="faded"
         color="slate"
         :label="t('CAPTAIN.FORM.CANCEL')"
-        class="w-full bg-n-alpha-2 n-blue-text hover:bg-n-alpha-3"
+        class="w-full bg-n-alpha-2 text-n-blue-text hover:bg-n-alpha-3"
         @click="handleCancel"
       />
       <Button
diff --git a/app/javascript/dashboard/components-next/captain/pageComponents/document/DocumentForm.vue b/app/javascript/dashboard/components-next/captain/pageComponents/document/DocumentForm.vue
index 2a2730e46..d85ba8a06 100644
--- a/app/javascript/dashboard/components-next/captain/pageComponents/document/DocumentForm.vue
+++ b/app/javascript/dashboard/components-next/captain/pageComponents/document/DocumentForm.vue
@@ -99,7 +99,7 @@ const handleSubmit = async () => {
         variant="faded"
         color="slate"
         :label="t('CAPTAIN.FORM.CANCEL')"
-        class="w-full bg-n-alpha-2 n-blue-text hover:bg-n-alpha-3"
+        class="w-full bg-n-alpha-2 text-n-blue-text hover:bg-n-alpha-3"
         @click="handleCancel"
       />
       <Button
diff --git a/app/javascript/dashboard/components-next/captain/pageComponents/inbox/ConnectInboxForm.vue b/app/javascript/dashboard/components-next/captain/pageComponents/inbox/ConnectInboxForm.vue
index 23aae478f..a7acb45b1 100644
--- a/app/javascript/dashboard/components-next/captain/pageComponents/inbox/ConnectInboxForm.vue
+++ b/app/javascript/dashboard/components-next/captain/pageComponents/inbox/ConnectInboxForm.vue
@@ -100,7 +100,7 @@ const handleSubmit = async () => {
         variant="faded"
         color="slate"
         :label="t('CAPTAIN.FORM.CANCEL')"
-        class="w-full bg-n-alpha-2 n-blue-text hover:bg-n-alpha-3"
+        class="w-full bg-n-alpha-2 text-n-blue-text hover:bg-n-alpha-3"
         @click="handleCancel"
       />
       <Button
diff --git a/app/javascript/dashboard/components-next/captain/pageComponents/response/ResponseForm.vue b/app/javascript/dashboard/components-next/captain/pageComponents/response/ResponseForm.vue
index 5582199a7..2b143fd15 100644
--- a/app/javascript/dashboard/components-next/captain/pageComponents/response/ResponseForm.vue
+++ b/app/javascript/dashboard/components-next/captain/pageComponents/response/ResponseForm.vue
@@ -146,7 +146,7 @@ watch(
         variant="faded"
         color="slate"
         :label="t('CAPTAIN.FORM.CANCEL')"
-        class="w-full bg-n-alpha-2 n-blue-text hover:bg-n-alpha-3"
+        class="w-full bg-n-alpha-2 text-n-blue-text hover:bg-n-alpha-3"
         @click="handleCancel"
       />
       <Button
diff --git a/app/javascript/dashboard/components-next/colorpicker/ColorPicker.vue b/app/javascript/dashboard/components-next/colorpicker/ColorPicker.vue
index de04b115a..0e342def2 100644
--- a/app/javascript/dashboard/components-next/colorpicker/ColorPicker.vue
+++ b/app/javascript/dashboard/components-next/colorpicker/ColorPicker.vue
@@ -90,7 +90,7 @@ const pickerRef = ref(null);
 
     input,
     .vc-input__input {
-      @apply bg-n-background text-slate-900 dark:text-slate-50 rounded-md shadow-none;
+      @apply bg-n-background text-n-slate-12 rounded-md shadow-none;
     }
 
     .vc-input__label {
diff --git a/app/javascript/dashboard/components-next/combobox/ComboBox.story.vue b/app/javascript/dashboard/components-next/combobox/ComboBox.story.vue
index caf26ad43..8933844ce 100644
--- a/app/javascript/dashboard/components-next/combobox/ComboBox.story.vue
+++ b/app/javascript/dashboard/components-next/combobox/ComboBox.story.vue
@@ -15,14 +15,14 @@ const selectedValue = ref('');
 <template>
   <Story title="Components/ComboBox" :layout="{ type: 'grid', width: '300px' }">
     <Variant title="Default">
-      <div class="w-full p-4 bg-white h-80 dark:bg-slate-900">
+      <div class="w-full p-4 bg-n-background h-80">
         <ComboBox v-model="selectedValue" :options="options" />
         <p class="mt-2">Selected value: {{ selectedValue }}</p>
       </div>
     </Variant>
 
     <Variant title="Disabled">
-      <div class="w-full p-4 bg-white h-80 dark:bg-slate-900">
+      <div class="w-full p-4 bg-n-background h-80">
         <ComboBox :options="options" disabled />
       </div>
     </Variant>
diff --git a/app/javascript/dashboard/components-next/combobox/ComboBoxDropdown.vue b/app/javascript/dashboard/components-next/combobox/ComboBoxDropdown.vue
index e24a366e2..4cb0b6718 100644
--- a/app/javascript/dashboard/components-next/combobox/ComboBoxDropdown.vue
+++ b/app/javascript/dashboard/components-next/combobox/ComboBoxDropdown.vue
@@ -69,7 +69,7 @@ defineExpose({
         :value="searchValue"
         type="search"
         :placeholder="searchPlaceholder || t('COMBOBOX.SEARCH_PLACEHOLDER')"
-        class="reset-base w-full py-2 pl-10 pr-2 text-sm focus:outline-none border-none rounded-t-md bg-n-solid-1 text-slate-900 dark:text-slate-50"
+        class="reset-base w-full py-2 pl-10 pr-2 text-sm focus:outline-none border-none rounded-t-md bg-n-solid-1 text-n-slate-12"
         @input="onInputSearch"
       />
     </div>
@@ -102,10 +102,7 @@ defineExpose({
           class="flex-shrink-0 i-lucide-check size-4 text-n-slate-11"
         />
       </li>
-      <li
-        v-if="options.length === 0"
-        class="px-3 py-2 text-sm text-slate-600 dark:text-slate-300"
-      >
+      <li v-if="options.length === 0" class="px-3 py-2 text-sm text-n-slate-11">
         {{ emptyState || t('COMBOBOX.EMPTY_STATE') }}
       </li>
     </ul>
diff --git a/app/javascript/dashboard/components-next/combobox/TagMultiSelectComboxBox.story.vue b/app/javascript/dashboard/components-next/combobox/TagMultiSelectComboxBox.story.vue
index dc4b5b0f3..fb57e7082 100644
--- a/app/javascript/dashboard/components-next/combobox/TagMultiSelectComboxBox.story.vue
+++ b/app/javascript/dashboard/components-next/combobox/TagMultiSelectComboxBox.story.vue
@@ -20,14 +20,14 @@ const preselectedValues = ref([1, 2]);
     :layout="{ type: 'grid', width: '300px' }"
   >
     <Variant title="Default">
-      <div class="w-full p-4 bg-white h-80 dark:bg-slate-900">
+      <div class="w-full p-4 bg-n-background h-80">
         <TagMultiSelectComboBox v-model="selectedValues" :options="options" />
         <p class="mt-2">Selected values: {{ selectedValues }}</p>
       </div>
     </Variant>
 
     <Variant title="With Preselected Values">
-      <div class="w-full p-4 bg-white h-80 dark:bg-slate-900">
+      <div class="w-full p-4 bg-n-background h-80">
         <TagMultiSelectComboBox
           v-model="preselectedValues"
           :options="options"
@@ -37,13 +37,13 @@ const preselectedValues = ref([1, 2]);
     </Variant>
 
     <Variant title="Disabled">
-      <div class="w-full p-4 bg-white h-80 dark:bg-slate-900">
+      <div class="w-full p-4 bg-n-background h-80">
         <TagMultiSelectComboBox :options="options" disabled />
       </div>
     </Variant>
 
     <Variant title="With Error">
-      <div class="w-full p-4 bg-white h-80 dark:bg-slate-900">
+      <div class="w-full p-4 bg-n-background h-80">
         <TagMultiSelectComboBox
           :options="options"
           has-error
diff --git a/app/javascript/dashboard/components-next/copilot/CopilotLauncher.vue b/app/javascript/dashboard/components-next/copilot/CopilotLauncher.vue
index e21c550c0..9b7ac983f 100644
--- a/app/javascript/dashboard/components-next/copilot/CopilotLauncher.vue
+++ b/app/javascript/dashboard/components-next/copilot/CopilotLauncher.vue
@@ -49,7 +49,10 @@ const toggleSidebar = () => {
 </script>
 
 <template>
-  <div v-if="showCopilotLauncher" class="fixed bottom-4 right-4 z-50">
+  <div
+    v-if="showCopilotLauncher"
+    class="fixed bottom-4 ltr:right-4 rtl:left-4 z-50"
+  >
     <div class="rounded-full bg-n-alpha-2 p-1">
       <Button
         icon="i-woot-captain"
diff --git a/app/javascript/dashboard/components-next/dropdown-menu/DropdownMenu.story.vue b/app/javascript/dashboard/components-next/dropdown-menu/DropdownMenu.story.vue
index f1fb01af3..fa1ffb30d 100644
--- a/app/javascript/dashboard/components-next/dropdown-menu/DropdownMenu.story.vue
+++ b/app/javascript/dashboard/components-next/dropdown-menu/DropdownMenu.story.vue
@@ -20,7 +20,7 @@ const handleAction = () => {
 <template>
   <Story title="Components/DropdownMenu" :layout="{ type: 'grid', width: 300 }">
     <Variant title="Default">
-      <div class="p-4 bg-white h-72 dark:bg-slate-900">
+      <div class="p-4 bg-n-background h-72">
         <div class="relative">
           <Button label="Open Menu" size="sm" @click="toggleDropdown" />
           <DropdownMenu
@@ -34,13 +34,13 @@ const handleAction = () => {
     </Variant>
 
     <Variant title="Always Open">
-      <div class="p-4 bg-white h-72 dark:bg-slate-900">
+      <div class="p-4 bg-n-background h-72">
         <DropdownMenu :menu-items="menuItems" @action="handleAction" />
       </div>
     </Variant>
 
     <Variant title="Custom Items">
-      <div class="p-4 bg-white h-72 dark:bg-slate-900">
+      <div class="p-4 bg-n-background h-72">
         <DropdownMenu
           :menu-items="[
             { label: 'Custom 1', action: 'custom1', icon: 'file-upload' },
@@ -53,7 +53,7 @@ const handleAction = () => {
     </Variant>
 
     <Variant title="With search">
-      <div class="p-4 bg-white h-72 dark:bg-slate-900">
+      <div class="p-4 bg-n-background h-72">
         <DropdownMenu
           :menu-items="[
             { label: 'Custom 1', action: 'custom1', icon: 'file-upload' },
diff --git a/app/javascript/dashboard/components-next/dropdown-menu/DropdownPrimitives.story.vue b/app/javascript/dashboard/components-next/dropdown-menu/DropdownPrimitives.story.vue
index 085aa0d28..a174b1eea 100644
--- a/app/javascript/dashboard/components-next/dropdown-menu/DropdownPrimitives.story.vue
+++ b/app/javascript/dashboard/components-next/dropdown-menu/DropdownPrimitives.story.vue
@@ -51,7 +51,7 @@ const menuItems = ref([
     :layout="{ type: 'grid', width: 400, height: 800 }"
   >
     <Variant title="Profile Menu">
-      <div class="p-4 bg-white h-[500px] dark:bg-slate-900">
+      <div class="p-4 bg-n-background h-[500px]">
         <DropdownContainer>
           <template #trigger="{ toggle }">
             <Button label="Open Menu" size="sm" @click="toggle" />
diff --git a/app/javascript/dashboard/components-next/inline-input/InlineInput.story.vue b/app/javascript/dashboard/components-next/inline-input/InlineInput.story.vue
index 7338d9cc9..2d013f01d 100644
--- a/app/javascript/dashboard/components-next/inline-input/InlineInput.story.vue
+++ b/app/javascript/dashboard/components-next/inline-input/InlineInput.story.vue
@@ -8,13 +8,13 @@ import InlineInput from './InlineInput.vue';
     :layout="{ type: 'grid', width: '400' }"
   >
     <Variant title="Default">
-      <div class="p-4 bg-white dark:bg-slate-800">
+      <div class="p-4 bg-n-background">
         <InlineInput id="inline-input-1" placeholder="Default InlineInput" />
       </div>
     </Variant>
 
     <Variant title="With Label">
-      <div class="p-4 bg-white dark:bg-slate-800">
+      <div class="p-4 bg-n-background">
         <InlineInput
           id="inline-input-2"
           label="Username"
@@ -24,7 +24,7 @@ import InlineInput from './InlineInput.vue';
     </Variant>
 
     <Variant title="Disabled">
-      <div class="p-4 bg-white dark:bg-slate-800">
+      <div class="p-4 bg-n-background">
         <InlineInput
           id="inline-input-3"
           label="Disabled InlineInput"
@@ -35,24 +35,24 @@ import InlineInput from './InlineInput.vue';
     </Variant>
 
     <Variant title="With Custom Classes">
-      <div class="flex flex-col gap-4 p-4 bg-white dark:bg-slate-800">
+      <div class="flex flex-col gap-4 p-4 bg-n-background">
         <InlineInput
           id="inline-input-4"
           label="Custom Input Class"
           placeholder="Custom input style"
-          custom-input-class="placeholder:text-green-200 dark:placeholder:text-green-800"
+          custom-input-class="placeholder:text-n-teal-6 dark:placeholder:text-n-teal-6"
         />
         <InlineInput
           id="inline-input-5"
           label="Custom Label Class"
           placeholder="Custom label style"
-          custom-label-class="text-green-600 dark:text-green-400"
+          custom-label-class="text-n-teal-6 dark:text-n-teal-6"
         />
       </div>
     </Variant>
 
     <Variant title="Different Types">
-      <div class="flex flex-col gap-4 p-4 bg-white dark:bg-slate-800">
+      <div class="flex flex-col gap-4 p-4 bg-n-background">
         <InlineInput
           id="inline-input-6"
           label="Text"
diff --git a/app/javascript/dashboard/components-next/input/Input.story.vue b/app/javascript/dashboard/components-next/input/Input.story.vue
index 579c2437a..bf190d827 100644
--- a/app/javascript/dashboard/components-next/input/Input.story.vue
+++ b/app/javascript/dashboard/components-next/input/Input.story.vue
@@ -5,25 +5,25 @@ import Input from './Input.vue';
 <template>
   <Story title="Components/Input" :layout="{ type: 'grid', width: '400' }">
     <Variant title="Default">
-      <div class="p-4 bg-white dark:bg-slate-800">
+      <div class="p-4 bg-n-background">
         <Input placeholder="Default Input" />
       </div>
     </Variant>
 
     <Variant title="With Label">
-      <div class="p-4 bg-white dark:bg-slate-800">
+      <div class="p-4 bg-n-background">
         <Input label="Username" placeholder="Enter your username" />
       </div>
     </Variant>
 
     <Variant title="Disabled">
-      <div class="p-4 bg-white dark:bg-slate-800">
+      <div class="p-4 bg-n-background">
         <Input label="Disabled Input" placeholder="Can't type here" disabled />
       </div>
     </Variant>
 
     <Variant title="With Message">
-      <div class="flex flex-col gap-4 p-4 bg-white dark:bg-slate-800">
+      <div class="flex flex-col gap-4 p-4 bg-n-background">
         <Input
           label="Email"
           placeholder="Enter your email"
@@ -46,7 +46,7 @@ import Input from './Input.vue';
     </Variant>
 
     <Variant title="Different Types">
-      <div class="flex flex-col gap-4 p-4 bg-white dark:bg-slate-800">
+      <div class="flex flex-col gap-4 p-4 bg-n-background">
         <Input label="Text" type="text" placeholder="Text input" />
         <Input label="Number" type="number" placeholder="Number input" />
         <Input label="Password" type="password" placeholder="Password input" />
@@ -56,11 +56,11 @@ import Input from './Input.vue';
     </Variant>
 
     <Variant title="Custom Input Class">
-      <div class="p-4 bg-white dark:bg-slate-800">
+      <div class="p-4 bg-n-background">
         <Input
           label="Custom Style"
           placeholder="Custom input class"
-          custom-input-class="border-yellow-500 dark:border-yellow-700"
+          custom-input-class="border-n-amber-5 dark:border-n-amber-5"
         />
       </div>
     </Variant>
diff --git a/app/javascript/dashboard/components-next/input/Input.vue b/app/javascript/dashboard/components-next/input/Input.vue
index ed6d7a20b..6288f7452 100644
--- a/app/javascript/dashboard/components-next/input/Input.vue
+++ b/app/javascript/dashboard/components-next/input/Input.vue
@@ -38,7 +38,7 @@ const messageClass = computed(() => {
     case 'error':
       return 'text-n-ruby-9 dark:text-n-ruby-9';
     case 'success':
-      return 'text-green-500 dark:text-green-400';
+      return 'text-n-teal-10 dark:text-n-teal-10';
     default:
       return 'text-n-slate-11 dark:text-n-slate-11';
   }
diff --git a/app/javascript/dashboard/components-next/message/bubbles/Dyte.vue b/app/javascript/dashboard/components-next/message/bubbles/Dyte.vue
index fb0813409..157298d73 100644
--- a/app/javascript/dashboard/components-next/message/bubbles/Dyte.vue
+++ b/app/javascript/dashboard/components-next/message/bubbles/Dyte.vue
@@ -74,7 +74,7 @@ const action = computed(() => ({
 
 <style lang="scss">
 .join-call-button {
-  margin: var(--space-small) 0;
+  margin: 0.5rem 0;
 }
 
 .video-call--container {
@@ -83,9 +83,9 @@ const action = computed(() => ({
   right: 0;
   width: 100%;
   height: 100%;
-  z-index: var(--z-index-high);
-  padding: var(--space-smaller);
-  background: var(--b-800);
+  z-index: 1000;
+  padding: 0.25rem;
+  @apply bg-n-background;
 
   iframe {
     width: 100%;
@@ -95,7 +95,7 @@ const action = computed(() => ({
 
   button {
     position: absolute;
-    top: var(--space-smaller);
+    top: 0.25rem;
     right: 10rem;
   }
 }
diff --git a/app/javascript/dashboard/components-next/message/chips/File.vue b/app/javascript/dashboard/components-next/message/chips/File.vue
index 90472db7f..2d55065c8 100644
--- a/app/javascript/dashboard/components-next/message/chips/File.vue
+++ b/app/javascript/dashboard/components-next/message/chips/File.vue
@@ -34,7 +34,7 @@ const displayFileName = computed(() => {
 const textColorClass = computed(() => {
   const colorMap = {
     '7z': 'dark:text-[#EDEEF0] text-[#2F265F]',
-    csv: 'text-amber-12',
+    csv: 'text-n-amber-12',
     doc: 'dark:text-[#D6E1FF] text-[#1F2D5C]', // indigo-12
     docx: 'dark:text-[#D6E1FF] text-[#1F2D5C]', // indigo-12
     json: 'text-n-slate-12',
diff --git a/app/javascript/dashboard/components-next/pagination/PaginationFooter.story.vue b/app/javascript/dashboard/components-next/pagination/PaginationFooter.story.vue
index 255bbc8dc..b1f5ea3e2 100644
--- a/app/javascript/dashboard/components-next/pagination/PaginationFooter.story.vue
+++ b/app/javascript/dashboard/components-next/pagination/PaginationFooter.story.vue
@@ -23,7 +23,7 @@ const singlePageState = createPaginationState(1, 10, 16);
     :layout="{ type: 'grid', width: '957' }"
   >
     <Variant title="Default">
-      <div class="p-4 bg-white dark:bg-slate-900">
+      <div class="p-4 bg-n-background">
         <PaginationFooter
           :current-page="defaultState.currentPage.value"
           :total-items="defaultState.totalItems"
@@ -34,7 +34,7 @@ const singlePageState = createPaginationState(1, 10, 16);
     </Variant>
 
     <Variant title="Middle Page">
-      <div class="p-4 bg-white dark:bg-slate-900">
+      <div class="p-4 bg-n-background">
         <PaginationFooter
           :current-page="middlePageState.currentPage.value"
           :total-items="middlePageState.totalItems"
@@ -45,7 +45,7 @@ const singlePageState = createPaginationState(1, 10, 16);
     </Variant>
 
     <Variant title="Last Page">
-      <div class="p-4 bg-white dark:bg-slate-900">
+      <div class="p-4 bg-n-background">
         <PaginationFooter
           :current-page="lastPageState.currentPage.value"
           :total-items="lastPageState.totalItems"
@@ -56,7 +56,7 @@ const singlePageState = createPaginationState(1, 10, 16);
     </Variant>
 
     <Variant title="Custom Items Per Page">
-      <div class="p-4 bg-white dark:bg-slate-900">
+      <div class="p-4 bg-n-background">
         <PaginationFooter
           :current-page="customItemsState.currentPage.value"
           :total-items="customItemsState.totalItems"
@@ -67,7 +67,7 @@ const singlePageState = createPaginationState(1, 10, 16);
     </Variant>
 
     <Variant title="Single Page">
-      <div class="p-4 bg-white dark:bg-slate-900">
+      <div class="p-4 bg-n-background">
         <PaginationFooter
           :current-page="singlePageState.currentPage.value"
           :total-items="singlePageState.totalItems"
diff --git a/app/javascript/dashboard/components-next/sidebar/SidebarGroupHeader.vue b/app/javascript/dashboard/components-next/sidebar/SidebarGroupHeader.vue
index 1fd1786a0..b0fd8fc69 100644
--- a/app/javascript/dashboard/components-next/sidebar/SidebarGroupHeader.vue
+++ b/app/javascript/dashboard/components-next/sidebar/SidebarGroupHeader.vue
@@ -23,10 +23,11 @@ const showBadge = useMapGetter(props.getterKeys.badge);
     :is="to ? 'router-link' : 'div'"
     class="flex items-center gap-2 px-2 py-1.5 rounded-lg h-8"
     role="button"
+    draggable="false"
     :to="to"
     :title="label"
     :class="{
-      'n-blue-text bg-n-alpha-2 font-medium': isActive && !hasActiveChild,
+      'text-n-blue-text bg-n-alpha-2 font-medium': isActive && !hasActiveChild,
       'text-n-slate-12 font-medium': hasActiveChild,
       'text-n-slate-11 hover:bg-n-alpha-2': !isActive && !hasActiveChild,
     }"
diff --git a/app/javascript/dashboard/components-next/sidebar/SidebarGroupLeaf.vue b/app/javascript/dashboard/components-next/sidebar/SidebarGroupLeaf.vue
index f97beadee..8d8b134bd 100644
--- a/app/javascript/dashboard/components-next/sidebar/SidebarGroupLeaf.vue
+++ b/app/javascript/dashboard/components-next/sidebar/SidebarGroupLeaf.vue
@@ -33,7 +33,7 @@ const shouldRenderComponent = computed(() => {
       :title="label"
       class="flex h-8 items-center gap-2 px-2 py-1 rounded-lg max-w-[9.438rem] hover:bg-gradient-to-r from-transparent via-n-slate-3/70 to-n-slate-3/70 group"
       :class="{
-        'n-blue-text bg-n-alpha-2 active': active,
+        'text-n-blue-text bg-n-alpha-2 active': active,
       }"
     >
       <component
diff --git a/app/javascript/dashboard/components-next/sidebar/SidebarProfileMenu.vue b/app/javascript/dashboard/components-next/sidebar/SidebarProfileMenu.vue
index ce8017984..5f7fa0755 100644
--- a/app/javascript/dashboard/components-next/sidebar/SidebarProfileMenu.vue
+++ b/app/javascript/dashboard/components-next/sidebar/SidebarProfileMenu.vue
@@ -111,11 +111,7 @@ const allowedMenuItems = computed(() => {
 </script>
 
 <template>
-  <DropdownContainer
-    class="relative w-full min-w-0"
-    :class="{ 'z-20': isOpen }"
-    @close="emit('close')"
-  >
+  <DropdownContainer class="relative w-full min-w-0" @close="emit('close')">
     <template #trigger="{ toggle, isOpen }">
       <button
         class="flex gap-2 items-center rounded-lg cursor-pointer text-left w-full hover:bg-n-alpha-1 p-1"
diff --git a/app/javascript/dashboard/components-next/switch/Switch.vue b/app/javascript/dashboard/components-next/switch/Switch.vue
index 766442953..d20128f25 100644
--- a/app/javascript/dashboard/components-next/switch/Switch.vue
+++ b/app/javascript/dashboard/components-next/switch/Switch.vue
@@ -19,7 +19,7 @@ const updateValue = () => {
 <template>
   <button
     type="button"
-    class="relative h-4 transition-colors duration-200 ease-in-out rounded-full w-7 focus:outline-none focus:ring-1 focus:ring-primary-500 focus:ring-offset-n-slate-2 focus:ring-offset-2"
+    class="relative h-4 transition-colors duration-200 ease-in-out rounded-full w-7 focus:outline-none focus:ring-1 focus:ring-n-brand focus:ring-offset-n-slate-2 focus:ring-offset-2"
     :class="modelValue ? 'bg-n-brand' : 'bg-n-alpha-1 dark:bg-n-alpha-2'"
     role="switch"
     :aria-checked="modelValue"
@@ -30,8 +30,8 @@ const updateValue = () => {
       class="absolute top-0.5 left-0.5 h-3 w-3 transform rounded-full shadow-sm transition-transform duration-200 ease-in-out"
       :class="
         modelValue
-          ? 'translate-x-3 bg-white'
-          : 'translate-x-0 bg-white dark:bg-n-black'
+          ? 'translate-x-3 bg-n-background'
+          : 'translate-x-0 bg-n-background'
       "
     />
   </button>
diff --git a/app/javascript/dashboard/components-next/tabbar/TabBar.story.vue b/app/javascript/dashboard/components-next/tabbar/TabBar.story.vue
index 7b1946cf6..d87ea1fda 100644
--- a/app/javascript/dashboard/components-next/tabbar/TabBar.story.vue
+++ b/app/javascript/dashboard/components-next/tabbar/TabBar.story.vue
@@ -25,13 +25,13 @@ const handleTabChanged = tab => {
 <template>
   <Story title="Components/TabBar" :layout="{ type: 'grid', width: '920px' }">
     <Variant title="Default">
-      <div class="p-4 bg-white dark:bg-slate-900">
+      <div class="p-4 bg-n-background">
         <TabBar :tabs="defaultTabs" @tab-changed="handleTabChanged" />
       </div>
     </Variant>
 
     <Variant title="Custom Tabs with Initial Tab">
-      <div class="p-4 bg-white dark:bg-slate-900">
+      <div class="p-4 bg-n-background">
         <TabBar
           :tabs="customTabs"
           :initial-active-tab="1"
@@ -41,7 +41,7 @@ const handleTabChanged = tab => {
     </Variant>
 
     <Variant title="No Counts">
-      <div class="p-4 bg-white dark:bg-slate-900">
+      <div class="p-4 bg-n-background">
         <TabBar
           :tabs="[{ label: 'Tab 1' }, { label: 'Tab 2' }, { label: 'Tab 3' }]"
           @tab-changed="handleTabChanged"
@@ -50,7 +50,7 @@ const handleTabChanged = tab => {
     </Variant>
 
     <Variant title="Single Tab">
-      <div class="p-4 bg-white dark:bg-slate-900">
+      <div class="p-4 bg-n-background">
         <TabBar
           :tabs="[{ label: 'Single Tab', count: 42 }]"
           @tab-changed="handleTabChanged"
diff --git a/app/javascript/dashboard/components-next/textarea/TextArea.story.vue b/app/javascript/dashboard/components-next/textarea/TextArea.story.vue
index 0a31f76c0..f934758ec 100644
--- a/app/javascript/dashboard/components-next/textarea/TextArea.story.vue
+++ b/app/javascript/dashboard/components-next/textarea/TextArea.story.vue
@@ -9,19 +9,19 @@ const description = ref('');
 <template>
   <Story title="Components/TextArea" :layout="{ type: 'grid', width: '400' }">
     <Variant title="Default">
-      <div class="p-4 bg-white dark:bg-slate-800">
+      <div class="p-4 bg-n-background">
         <TextArea placeholder="Default TextArea" />
       </div>
     </Variant>
 
     <Variant title="With Label">
-      <div class="p-4 bg-white dark:bg-slate-800">
+      <div class="p-4 bg-n-background">
         <TextArea label="Description" placeholder="Enter your description" />
       </div>
     </Variant>
 
     <Variant title="Disabled">
-      <div class="p-4 bg-white dark:bg-slate-800">
+      <div class="p-4 bg-n-background">
         <TextArea
           label="Disabled TextArea"
           placeholder="Can't type here"
@@ -31,7 +31,7 @@ const description = ref('');
     </Variant>
 
     <Variant title="With Character Count">
-      <div class="p-4 bg-white dark:bg-slate-800">
+      <div class="p-4 bg-n-background">
         <TextArea
           v-model="bio"
           label="Bio"
@@ -43,7 +43,7 @@ const description = ref('');
     </Variant>
 
     <Variant title="Custom Max Length">
-      <div class="p-4 bg-white dark:bg-slate-800">
+      <div class="p-4 bg-n-background">
         <TextArea
           v-model="description"
           label="Long Description"
@@ -55,11 +55,11 @@ const description = ref('');
     </Variant>
 
     <Variant title="Custom TextArea Class">
-      <div class="p-4 bg-white dark:bg-slate-800">
+      <div class="p-4 bg-n-background">
         <TextArea
           label="Custom Style"
           placeholder="Custom textarea class"
-          custom-text-area-class="border-yellow-500 dark:border-yellow-700"
+          custom-text-area-class="border-n-amber-5 dark:border-n-amber-5"
         />
       </div>
     </Variant>
diff --git a/app/javascript/dashboard/components-next/textarea/TextArea.vue b/app/javascript/dashboard/components-next/textarea/TextArea.vue
index 66cb5f7f4..7568341c4 100644
--- a/app/javascript/dashboard/components-next/textarea/TextArea.vue
+++ b/app/javascript/dashboard/components-next/textarea/TextArea.vue
@@ -47,7 +47,7 @@ const messageClass = computed(() => {
     case 'error':
       return 'text-n-ruby-9 dark:text-n-ruby-9';
     case 'success':
-      return 'text-green-500 dark:text-green-400';
+      return 'text-n-teal-10 dark:text-n-teal-10';
     default:
       return 'text-n-slate-11 dark:text-n-slate-11';
   }
@@ -179,7 +179,7 @@ onMounted(() => {
         }"
         :disabled="disabled"
         rows="1"
-        class="flex w-full reset-base text-sm p-0 !rounded-none !bg-transparent dark:!bg-transparent !border-0 !outline-0 !mb-0 placeholder:text-n-slate-10 dark:placeholder:text-n-slate-10 text-n-slate-12 dark:text-n-slate-12 disabled:cursor-not-allowed disabled:opacity-50 disabled:bg-slate-25 dark:disabled:bg-slate-900"
+        class="flex w-full reset-base text-sm p-0 !rounded-none !bg-transparent dark:!bg-transparent !border-0 !outline-0 !mb-0 placeholder:text-n-slate-10 dark:placeholder:text-n-slate-10 text-n-slate-12 dark:text-n-slate-12 disabled:cursor-not-allowed disabled:opacity-50"
         @input="handleInput"
         @focus="handleFocus"
         @blur="handleBlur"
diff --git a/app/javascript/dashboard/components/ChatList.vue b/app/javascript/dashboard/components/ChatList.vue
index 439e7c682..3727a16c3 100644
--- a/app/javascript/dashboard/components/ChatList.vue
+++ b/app/javascript/dashboard/components/ChatList.vue
@@ -31,6 +31,7 @@ import DeleteCustomViews from 'dashboard/routes/dashboard/customviews/DeleteCust
 import ConversationBulkActions from './widgets/conversation/conversationBulkActions/Index.vue';
 import IntersectionObserver from './IntersectionObserver.vue';
 import TeleportWithDirection from 'dashboard/components-next/TeleportWithDirection.vue';
+import Spinner from 'dashboard/components-next/spinner/Spinner.vue';
 
 import { useUISettings } from 'dashboard/composables/useUISettings';
 import { useAlert } from 'dashboard/composables';
@@ -953,12 +954,12 @@ watch(conversationFilters, (newVal, oldVal) => {
           </DynamicScrollerItem>
         </template>
         <template #after>
-          <div v-if="chatListLoading" class="text-center">
-            <span class="mt-4 mb-4 spinner" />
+          <div v-if="chatListLoading" class="flex justify-center my-4">
+            <Spinner class="text-n-brand" />
           </div>
           <p
             v-else-if="showEndOfListMessage"
-            class="p-4 text-center text-slate-400 dark:text-slate-300"
+            class="p-4 text-center text-n-slate-11"
           >
             {{ $t('CHAT_LIST.EOF') }}
           </p>
diff --git a/app/javascript/dashboard/components/ChatListHeader.vue b/app/javascript/dashboard/components/ChatListHeader.vue
index c184103c0..04a22806d 100644
--- a/app/javascript/dashboard/components/ChatListHeader.vue
+++ b/app/javascript/dashboard/components/ChatListHeader.vue
@@ -1,10 +1,8 @@
 <script setup>
 import { computed } from 'vue';
 import { useUISettings } from 'dashboard/composables/useUISettings';
-import { useMapGetter } from 'dashboard/composables/store.js';
 import { formatNumber } from '@chatwoot/utils';
 import wootConstants from 'dashboard/constants/globals';
-import { FEATURE_FLAGS } from 'dashboard/featureFlags';
 
 import ConversationBasicFilter from './widgets/conversation/ConversationBasicFilter.vue';
 import SwitchLayout from 'dashboard/routes/dashboard/conversation/search/SwitchLayout.vue';
@@ -30,11 +28,6 @@ const emit = defineEmits([
 
 const { uiSettings, updateUISettings } = useUISettings();
 
-const currentAccountId = useMapGetter('getCurrentAccountId');
-const isFeatureEnabledonAccount = useMapGetter(
-  'accounts/isFeatureEnabledonAccount'
-);
-
 const onBasicFilterChange = (value, type) => {
   emit('basicFilterChange', value, type);
 };
@@ -43,13 +36,6 @@ const hasAppliedFiltersOrActiveFolders = computed(() => {
   return props.hasAppliedFilters || props.hasActiveFolders;
 });
 
-const showV4View = computed(() => {
-  return isFeatureEnabledonAccount.value(
-    currentAccountId.value,
-    FEATURE_FLAGS.CHATWOOT_V4
-  );
-});
-
 const allCount = computed(() => props.conversationStats?.allCount || 0);
 const formattedAllCount = computed(() => formatNumber(allCount.value));
 
@@ -174,7 +160,6 @@ const toggleConversationLayout = () => {
         @change-filter="onBasicFilterChange"
       />
       <SwitchLayout
-        v-if="showV4View"
         :is-on-expanded-layout="isOnExpandedLayout"
         @toggle="toggleConversationLayout"
       />
diff --git a/app/javascript/dashboard/components/FormSection.vue b/app/javascript/dashboard/components/FormSection.vue
index 481006adb..d622d470d 100644
--- a/app/javascript/dashboard/components/FormSection.vue
+++ b/app/javascript/dashboard/components/FormSection.vue
@@ -14,13 +14,13 @@ defineProps({
 <template>
   <div class="flex flex-col items-start w-full gap-6">
     <div class="flex flex-col w-full gap-4">
-      <h4 v-if="title" class="text-lg font-medium text-ash-900">
+      <h4 v-if="title" class="text-lg font-medium text-n-slate-12">
         {{ title }}
       </h4>
       <div class="flex flex-row items-center justify-between">
-        <div class="flex-grow h-px bg-ash-200" />
+        <div class="flex-grow h-px bg-n-weak" />
       </div>
-      <p v-if="description" class="mb-0 text-sm font-normal text-ash-900">
+      <p v-if="description" class="mb-0 text-sm font-normal text-n-slate-12">
         {{ description }}
       </p>
     </div>
diff --git a/app/javascript/dashboard/components/ModalHeader.vue b/app/javascript/dashboard/components/ModalHeader.vue
index 9e2330aa4..a79c2cd6c 100644
--- a/app/javascript/dashboard/components/ModalHeader.vue
+++ b/app/javascript/dashboard/components/ModalHeader.vue
@@ -28,19 +28,19 @@ export default {
     <img v-if="headerImage" :src="headerImage" alt="No image" />
     <h2
       data-test-id="modal-header-title"
-      class="text-base font-semibold leading-6 text-slate-800 dark:text-slate-50"
+      class="text-base font-semibold leading-6 text-n-slate-12"
     >
       {{ headerTitle }}
     </h2>
     <p
       v-if="headerContent"
       data-test-id="modal-header-content"
-      class="w-full mt-2 text-sm leading-5 break-words text-slate-600 dark:text-slate-300"
+      class="w-full mt-2 text-sm leading-5 break-words text-n-slate-11"
     >
       {{ headerContent }}
       <span
         v-if="headerContentValue"
-        class="text-sm font-semibold text-slate-600 dark:text-slate-300"
+        class="text-sm font-semibold text-n-slate-11"
       >
         {{ headerContentValue }}
       </span>
diff --git a/app/javascript/dashboard/components/SettingsSection.vue b/app/javascript/dashboard/components/SettingsSection.vue
index e3933a6f4..6068b6456 100644
--- a/app/javascript/dashboard/components/SettingsSection.vue
+++ b/app/javascript/dashboard/components/SettingsSection.vue
@@ -30,15 +30,10 @@ export default {
   >
     <div class="grid grid-cols-1 lg:grid-cols-8 gap-6">
       <div class="col-span-2">
-        <p
-          v-if="title"
-          class="text-base text-woot-500 dark:text-woot-500 mb-0 font-medium"
-        >
+        <p v-if="title" class="text-base text-n-brand mb-0 font-medium">
           {{ title }}
         </p>
-        <p
-          class="text-sm mb-2 text-slate-700 dark:text-slate-300 leading-5 tracking-normal mt-2"
-        >
+        <p class="text-sm mb-2 text-n-slate-11 leading-5 tracking-normal mt-2">
           <slot v-if="subTitle" name="subTitle">
             {{ subTitle }}
           </slot>
diff --git a/app/javascript/dashboard/components/SidemenuIcon.vue b/app/javascript/dashboard/components/SidemenuIcon.vue
deleted file mode 100644
index 50bee3f17..000000000
--- a/app/javascript/dashboard/components/SidemenuIcon.vue
+++ /dev/null
@@ -1,49 +0,0 @@
-<script>
-import { FEATURE_FLAGS } from 'dashboard/featureFlags';
-import { BUS_EVENTS } from 'shared/constants/busEvents';
-import { mapGetters } from 'vuex';
-import { emitter } from 'shared/helpers/mitt';
-import NextButton from 'dashboard/components-next/button/Button.vue';
-
-export default {
-  components: {
-    NextButton,
-  },
-  props: {
-    size: {
-      type: String,
-      default: 'sm',
-    },
-  },
-  computed: {
-    ...mapGetters({
-      accountId: 'getCurrentAccountId',
-      isFeatureEnabledonAccount: 'accounts/isFeatureEnabledonAccount',
-    }),
-    hasNextSidebar() {
-      return this.isFeatureEnabledonAccount(
-        this.accountId,
-        FEATURE_FLAGS.CHATWOOT_V4
-      );
-    },
-  },
-  methods: {
-    onMenuItemClick() {
-      emitter.emit(BUS_EVENTS.TOGGLE_SIDEMENU);
-    },
-  },
-};
-</script>
-
-<!-- eslint-disable-next-line vue/no-root-v-if -->
-<template>
-  <NextButton
-    v-if="!hasNextSidebar"
-    ghost
-    slate
-    :size="size"
-    icon="i-lucide-menu"
-    class="-ml-3"
-    @click="onMenuItemClick"
-  />
-</template>
diff --git a/app/javascript/dashboard/components/layout/sidebarComponents/AddAccountModal.vue b/app/javascript/dashboard/components/app/AddAccountModal.vue
similarity index 100%
rename from app/javascript/dashboard/components/layout/sidebarComponents/AddAccountModal.vue
rename to app/javascript/dashboard/components/app/AddAccountModal.vue
diff --git a/app/javascript/dashboard/components/buttons/ResolveAction.vue b/app/javascript/dashboard/components/buttons/ResolveAction.vue
index 0866b9a7f..a8698b4a5 100644
--- a/app/javascript/dashboard/components/buttons/ResolveAction.vue
+++ b/app/javascript/dashboard/components/buttons/ResolveAction.vue
@@ -178,7 +178,7 @@ useEmitter(CMD_RESOLVE_CONVERSATION, onCmdResolveConversation);
     <div
       v-if="showActionsDropdown"
       v-on-clickaway="closeDropdown"
-      class="dropdown-pane dropdown-pane--open left-auto top-full mt-0.5 start-0 xl:start-auto xl:end-0 max-w-[12.5rem] min-w-[9.75rem]"
+      class="border rounded-lg shadow-lg border-n-strong dark:border-n-strong box-content p-2 w-fit z-10 bg-n-alpha-3 backdrop-blur-[100px] absolute block left-auto top-full mt-0.5 start-0 xl:start-auto xl:end-0 max-w-[12.5rem] min-w-[9.75rem] [&_ul>li]:mb-0"
     >
       <WootDropdownMenu class="mb-0">
         <WootDropdownItem v-if="!isPending">
@@ -209,11 +209,3 @@ useEmitter(CMD_RESOLVE_CONVERSATION, onCmdResolveConversation);
     </div>
   </div>
 </template>
-
-<style lang="scss" scoped>
-.dropdown-pane {
-  .dropdown-menu__item {
-    @apply mb-0;
-  }
-}
-</style>
diff --git a/app/javascript/dashboard/components/copilot/CopilotContainer.vue b/app/javascript/dashboard/components/copilot/CopilotContainer.vue
index 06cf1db11..bc55509b3 100644
--- a/app/javascript/dashboard/components/copilot/CopilotContainer.vue
+++ b/app/javascript/dashboard/components/copilot/CopilotContainer.vue
@@ -8,7 +8,7 @@ import { FEATURE_FLAGS } from 'dashboard/featureFlags';
 defineProps({
   conversationInboxType: {
     type: String,
-    required: true,
+    default: '',
   },
 });
 
diff --git a/app/javascript/dashboard/components/index.js b/app/javascript/dashboard/components/index.js
index dffb42914..459a46963 100644
--- a/app/javascript/dashboard/components/index.js
+++ b/app/javascript/dashboard/components/index.js
@@ -15,7 +15,6 @@ import Label from './ui/Label.vue';
 import LoadingState from './widgets/LoadingState.vue';
 import ModalHeader from './ModalHeader.vue';
 import Modal from './Modal.vue';
-import SidemenuIcon from './SidemenuIcon.vue';
 import Spinner from 'shared/components/Spinner.vue';
 import Tabs from './ui/Tabs/Tabs.vue';
 import TabsItem from './ui/Tabs/TabsItem.vue';
@@ -38,7 +37,6 @@ const WootUIKit = {
   LoadingState,
   Modal,
   ModalHeader,
-  SidemenuIcon,
   Spinner,
   Tabs,
   TabsItem,
diff --git a/app/javascript/dashboard/components/layout/AvailabilityStatus.vue b/app/javascript/dashboard/components/layout/AvailabilityStatus.vue
deleted file mode 100644
index a4995aee8..000000000
--- a/app/javascript/dashboard/components/layout/AvailabilityStatus.vue
+++ /dev/null
@@ -1,157 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-import { useAlert } from 'dashboard/composables';
-import { useImpersonation } from 'dashboard/composables/useImpersonation';
-import WootDropdownItem from 'shared/components/ui/dropdown/DropdownItem.vue';
-import WootDropdownMenu from 'shared/components/ui/dropdown/DropdownMenu.vue';
-import WootDropdownHeader from 'shared/components/ui/dropdown/DropdownHeader.vue';
-import WootDropdownDivider from 'shared/components/ui/dropdown/DropdownDivider.vue';
-import AvailabilityStatusBadge from '../widgets/conversation/AvailabilityStatusBadge.vue';
-import wootConstants from 'dashboard/constants/globals';
-import NextButton from 'dashboard/components-next/button/Button.vue';
-
-const { AVAILABILITY_STATUS_KEYS } = wootConstants;
-
-export default {
-  components: {
-    WootDropdownHeader,
-    WootDropdownDivider,
-    WootDropdownMenu,
-    WootDropdownItem,
-    AvailabilityStatusBadge,
-    NextButton,
-  },
-  setup() {
-    const { isImpersonating } = useImpersonation();
-    return { isImpersonating };
-  },
-  data() {
-    return {
-      isStatusMenuOpened: false,
-      isUpdating: false,
-    };
-  },
-
-  computed: {
-    ...mapGetters({
-      getCurrentUserAvailability: 'getCurrentUserAvailability',
-      currentAccountId: 'getCurrentAccountId',
-      currentUserAutoOffline: 'getCurrentUserAutoOffline',
-    }),
-    statusList() {
-      return [
-        this.$t('PROFILE_SETTINGS.FORM.AVAILABILITY.STATUS.ONLINE'),
-        this.$t('PROFILE_SETTINGS.FORM.AVAILABILITY.STATUS.BUSY'),
-        this.$t('PROFILE_SETTINGS.FORM.AVAILABILITY.STATUS.OFFLINE'),
-      ];
-    },
-    availabilityDisplayLabel() {
-      const availabilityIndex = AVAILABILITY_STATUS_KEYS.findIndex(
-        key => key === this.currentUserAvailability
-      );
-      return this.statusList[availabilityIndex];
-    },
-    currentUserAvailability() {
-      return this.getCurrentUserAvailability;
-    },
-    availabilityStatuses() {
-      return this.statusList.map((statusLabel, index) => ({
-        label: statusLabel,
-        value: AVAILABILITY_STATUS_KEYS[index],
-        disabled:
-          this.currentUserAvailability === AVAILABILITY_STATUS_KEYS[index],
-      }));
-    },
-  },
-
-  methods: {
-    openStatusMenu() {
-      this.isStatusMenuOpened = true;
-    },
-    closeStatusMenu() {
-      this.isStatusMenuOpened = false;
-    },
-    updateAutoOffline(autoOffline) {
-      this.$store.dispatch('updateAutoOffline', {
-        accountId: this.currentAccountId,
-        autoOffline,
-      });
-    },
-    changeAvailabilityStatus(availability) {
-      if (this.isImpersonating) {
-        useAlert(
-          this.$t('PROFILE_SETTINGS.FORM.AVAILABILITY.IMPERSONATING_ERROR')
-        );
-        return;
-      }
-
-      if (this.isUpdating) {
-        return;
-      }
-
-      this.isUpdating = true;
-      try {
-        this.$store.dispatch('updateAvailability', {
-          availability,
-          account_id: this.currentAccountId,
-        });
-      } catch (error) {
-        useAlert(
-          this.$t('PROFILE_SETTINGS.FORM.AVAILABILITY.SET_AVAILABILITY_ERROR')
-        );
-      } finally {
-        this.isUpdating = false;
-      }
-    },
-  },
-};
-</script>
-
-<template>
-  <WootDropdownMenu>
-    <WootDropdownHeader :title="$t('SIDEBAR.SET_AVAILABILITY_TITLE')" />
-    <WootDropdownItem
-      v-for="status in availabilityStatuses"
-      :key="status.value"
-      class="flex items-baseline"
-    >
-      <NextButton
-        sm
-        :color="status.disabled ? 'blue' : 'slate'"
-        :variant="status.disabled ? 'faded' : 'ghost'"
-        class="status-change--dropdown-button !w-full !justify-start"
-        @click="changeAvailabilityStatus(status.value)"
-      >
-        <AvailabilityStatusBadge :status="status.value" />
-        <span class="min-w-0 truncate font-medium text-xs">
-          {{ status.label }}
-        </span>
-      </NextButton>
-    </WootDropdownItem>
-    <WootDropdownDivider />
-    <WootDropdownItem class="flex items-center justify-between px-3 py-2 m-0">
-      <div class="flex items-center">
-        <fluent-icon
-          v-tooltip.right-start="$t('SIDEBAR.SET_AUTO_OFFLINE.INFO_TEXT')"
-          icon="info"
-          size="14"
-          class="mt-px"
-        />
-
-        <span
-          class="mx-2 my-0 text-xs font-medium text-slate-600 dark:text-slate-100"
-        >
-          {{ $t('SIDEBAR.SET_AUTO_OFFLINE.TEXT') }}
-        </span>
-      </div>
-
-      <woot-switch
-        size="small"
-        class="mx-1 mt-px mb-0"
-        :model-value="currentUserAutoOffline"
-        @input="updateAutoOffline"
-      />
-    </WootDropdownItem>
-    <WootDropdownDivider />
-  </WootDropdownMenu>
-</template>
diff --git a/app/javascript/dashboard/components/layout/Sidebar.vue b/app/javascript/dashboard/components/layout/Sidebar.vue
deleted file mode 100644
index 4d6bfbb58..000000000
--- a/app/javascript/dashboard/components/layout/Sidebar.vue
+++ /dev/null
@@ -1,246 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-import { getSidebarItems } from './config/default-sidebar';
-import { useKeyboardEvents } from 'dashboard/composables/useKeyboardEvents';
-import { useAccount } from 'dashboard/composables/useAccount';
-import { useRoute, useRouter } from 'vue-router';
-
-import PrimarySidebar from './sidebarComponents/Primary.vue';
-import SecondarySidebar from './sidebarComponents/Secondary.vue';
-import { routesWithPermissions } from '../../routes';
-import {
-  getUserPermissions,
-  hasPermissions,
-} from '../../helper/permissionsHelper';
-
-export default {
-  components: {
-    PrimarySidebar,
-    SecondarySidebar,
-  },
-  props: {
-    showSecondarySidebar: {
-      type: Boolean,
-      default: true,
-    },
-  },
-  emits: [
-    'toggleAccountModal',
-    'showAddLabelPopup',
-    'openNotificationPanel',
-    'closeKeyShortcutModal',
-    'openKeyShortcutModal',
-  ],
-  setup(props, { emit }) {
-    const route = useRoute();
-    const router = useRouter();
-    const { accountId } = useAccount();
-
-    const toggleKeyShortcutModal = () => {
-      emit('openKeyShortcutModal');
-    };
-    const closeKeyShortcutModal = () => {
-      emit('closeKeyShortcutModal');
-    };
-    const isCurrentRouteSameAsNavigation = routeName => {
-      return route.name === routeName;
-    };
-    const navigateToRoute = routeName => {
-      if (!isCurrentRouteSameAsNavigation(routeName)) {
-        router.push({ name: routeName });
-      }
-    };
-    const keyboardEvents = {
-      '$mod+Slash': {
-        action: toggleKeyShortcutModal,
-      },
-      '$mod+Escape': {
-        action: closeKeyShortcutModal,
-      },
-      'Alt+KeyC': {
-        action: () => navigateToRoute('home'),
-      },
-      'Alt+KeyV': {
-        action: () => navigateToRoute('contacts_dashboard'),
-      },
-      'Alt+KeyR': {
-        action: () => navigateToRoute('account_overview_reports'),
-      },
-      'Alt+KeyS': {
-        action: () => navigateToRoute('agent_list'),
-      },
-    };
-    useKeyboardEvents(keyboardEvents);
-
-    return {
-      toggleKeyShortcutModal,
-      accountId,
-    };
-  },
-  data() {
-    return {
-      showOptionsMenu: false,
-    };
-  },
-
-  computed: {
-    ...mapGetters({
-      currentUser: 'getCurrentUser',
-      globalConfig: 'globalConfig/get',
-      inboxes: 'inboxes/getInboxes',
-      isACustomBrandedInstance: 'globalConfig/isACustomBrandedInstance',
-      isFeatureEnabledonAccount: 'accounts/isFeatureEnabledonAccount',
-      isOnChatwootCloud: 'globalConfig/isOnChatwootCloud',
-      labels: 'labels/getLabelsOnSidebar',
-      teams: 'teams/getMyTeams',
-    }),
-    activeCustomView() {
-      if (this.activePrimaryMenu.key === 'contacts') {
-        return 'contact';
-      }
-      if (this.activePrimaryMenu.key === 'conversations') {
-        return 'conversation';
-      }
-      return '';
-    },
-    customViews() {
-      if (!this.activeCustomView) {
-        return [];
-      }
-      return this.$store.getters['customViews/getCustomViewsByFilterType'](
-        this.activeCustomView
-      );
-    },
-    isConversationOrContactActive() {
-      return (
-        this.activePrimaryMenu.key === 'contacts' ||
-        this.activePrimaryMenu.key === 'conversations'
-      );
-    },
-    sideMenuConfig() {
-      return getSidebarItems(this.accountId);
-    },
-    primaryMenuItems() {
-      const userPermissions = getUserPermissions(
-        this.currentUser,
-        this.accountId
-      );
-      const menuItems = this.sideMenuConfig.primaryMenu;
-      return menuItems.filter(menuItem => {
-        const isAvailableForTheUser = hasPermissions(
-          routesWithPermissions[menuItem.toStateName],
-          userPermissions
-        );
-
-        if (!isAvailableForTheUser) {
-          return false;
-        }
-        if (
-          menuItem.alwaysVisibleOnChatwootInstances &&
-          !this.isACustomBrandedInstance
-        ) {
-          return true;
-        }
-        if (menuItem.featureFlag) {
-          return this.isFeatureEnabledonAccount(
-            this.accountId,
-            menuItem.featureFlag
-          );
-        }
-        return true;
-      });
-    },
-    activeSecondaryMenu() {
-      const { secondaryMenu } = this.sideMenuConfig;
-      const { name: currentRoute } = this.$route;
-
-      const activeSecondaryMenu =
-        secondaryMenu.find(menuItem =>
-          menuItem.routes.includes(currentRoute)
-        ) || {};
-      return activeSecondaryMenu;
-    },
-    activePrimaryMenu() {
-      const activePrimaryMenu =
-        this.primaryMenuItems.find(
-          menuItem => menuItem.key === this.activeSecondaryMenu.parentNav
-        ) || {};
-      return activePrimaryMenu;
-    },
-    hasSecondaryMenu() {
-      return (
-        this.activeSecondaryMenu.menuItems &&
-        this.activeSecondaryMenu.menuItems.length
-      );
-    },
-    hasSecondarySidebar() {
-      // if it is explicitly stated to show and it has secondary menu items to show
-      // showSecondarySidebar corresponds to the UI settings, indicating if the user has toggled it
-      return this.showSecondarySidebar && this.hasSecondaryMenu;
-    },
-  },
-
-  watch: {
-    activeCustomView() {
-      this.fetchCustomViews();
-    },
-  },
-  mounted() {
-    this.$store.dispatch('labels/get');
-    this.$store.dispatch('inboxes/get');
-    this.$store.dispatch('notifications/unReadCount');
-    this.$store.dispatch('teams/get');
-    this.$store.dispatch('attributes/get');
-    this.fetchCustomViews();
-  },
-
-  methods: {
-    fetchCustomViews() {
-      if (this.isConversationOrContactActive) {
-        this.$store.dispatch('customViews/get', this.activeCustomView);
-      }
-    },
-    toggleSupportChatWindow() {
-      window.$chatwoot.toggle();
-    },
-    toggleAccountModal() {
-      this.$emit('toggleAccountModal');
-    },
-    showAddLabelPopup() {
-      this.$emit('showAddLabelPopup');
-    },
-    openNotificationPanel() {
-      this.$emit('openNotificationPanel');
-    },
-  },
-};
-</script>
-
-<template>
-  <aside class="flex h-full">
-    <PrimarySidebar
-      :logo-source="globalConfig.logoThumbnail"
-      :installation-name="globalConfig.installationName"
-      :is-a-custom-branded-instance="isACustomBrandedInstance"
-      :account-id="accountId"
-      :menu-items="primaryMenuItems"
-      :active-menu-item="activePrimaryMenu.key"
-      @toggle-accounts="toggleAccountModal"
-      @open-key-shortcut-modal="toggleKeyShortcutModal"
-      @open-notification-panel="openNotificationPanel"
-    />
-    <SecondarySidebar
-      v-if="hasSecondarySidebar"
-      :account-id="accountId"
-      :inboxes="inboxes"
-      :labels="labels"
-      :teams="teams"
-      :custom-views="customViews"
-      :menu-config="activeSecondaryMenu"
-      :current-user="currentUser"
-      :is-on-chatwoot-cloud="isOnChatwootCloud"
-      @add-label="showAddLabelPopup"
-      @toggle-accounts="toggleAccountModal"
-    />
-  </aside>
-</template>
diff --git a/app/javascript/dashboard/components/layout/config/default-sidebar.js b/app/javascript/dashboard/components/layout/config/default-sidebar.js
deleted file mode 100644
index bbe2c44cd..000000000
--- a/app/javascript/dashboard/components/layout/config/default-sidebar.js
+++ /dev/null
@@ -1,19 +0,0 @@
-import conversations from './sidebarItems/conversations';
-import contacts from './sidebarItems/contacts';
-import reports from './sidebarItems/reports';
-import campaigns from './sidebarItems/campaigns';
-import settings from './sidebarItems/settings';
-import notifications from './sidebarItems/notifications';
-import primaryMenu from './sidebarItems/primaryMenu';
-
-export const getSidebarItems = accountId => ({
-  primaryMenu: primaryMenu(accountId),
-  secondaryMenu: [
-    conversations(accountId),
-    contacts(accountId),
-    reports(accountId),
-    campaigns(accountId),
-    settings(accountId),
-    notifications(accountId),
-  ],
-});
diff --git a/app/javascript/dashboard/components/layout/config/sidebarItems/campaigns.js b/app/javascript/dashboard/components/layout/config/sidebarItems/campaigns.js
deleted file mode 100644
index 9c3196dd6..000000000
--- a/app/javascript/dashboard/components/layout/config/sidebarItems/campaigns.js
+++ /dev/null
@@ -1,26 +0,0 @@
-import { frontendURL } from '../../../../helper/URLHelper';
-
-const campaigns = accountId => ({
-  parentNav: 'campaigns',
-  routes: ['campaigns_sms_index', 'campaigns_livechat_index'],
-  menuItems: [
-    {
-      icon: 'arrow-swap',
-      label: 'LIVE_CHAT',
-      key: 'ongoingCampaigns',
-      hasSubMenu: false,
-      toState: frontendURL(`accounts/${accountId}/campaigns/live_chat`),
-      toStateName: 'campaigns_livechat_index',
-    },
-    {
-      key: 'oneOffCampaigns',
-      icon: 'sound-source',
-      label: 'SMS',
-      hasSubMenu: false,
-      toState: frontendURL(`accounts/${accountId}/campaigns/sms`),
-      toStateName: 'campaigns_sms_index',
-    },
-  ],
-});
-
-export default campaigns;
diff --git a/app/javascript/dashboard/components/layout/config/sidebarItems/contacts.js b/app/javascript/dashboard/components/layout/config/sidebarItems/contacts.js
deleted file mode 100644
index e5eb204ee..000000000
--- a/app/javascript/dashboard/components/layout/config/sidebarItems/contacts.js
+++ /dev/null
@@ -1,32 +0,0 @@
-import { frontendURL } from '../../../../helper/URLHelper';
-
-const contacts = accountId => ({
-  parentNav: 'contacts',
-  routes: [
-    'contacts_dashboard_index',
-    'contacts_dashboard_segments_index',
-    'contacts_dashboard_labels_index',
-    'contacts_edit',
-    'contacts_edit_segment',
-    'contacts_edit_label',
-    'contacts_dashboard_active',
-  ],
-  menuItems: [
-    {
-      icon: 'contact-card-group',
-      label: 'ALL_CONTACTS',
-      hasSubMenu: false,
-      toState: frontendURL(`accounts/${accountId}/contacts?page=1`),
-      toStateName: 'contacts_dashboard_index',
-    },
-    {
-      icon: 'visitor-contacts',
-      label: 'ACTIVE',
-      hasSubMenu: false,
-      toState: frontendURL(`accounts/${accountId}/contacts/active`),
-      toStateName: 'contacts_dashboard_active',
-    },
-  ],
-});
-
-export default contacts;
diff --git a/app/javascript/dashboard/components/layout/config/sidebarItems/conversations.js b/app/javascript/dashboard/components/layout/config/sidebarItems/conversations.js
deleted file mode 100644
index a8302bd58..000000000
--- a/app/javascript/dashboard/components/layout/config/sidebarItems/conversations.js
+++ /dev/null
@@ -1,50 +0,0 @@
-import { frontendURL } from '../../../../helper/URLHelper';
-
-const conversations = accountId => ({
-  parentNav: 'conversations',
-  routes: [
-    'home',
-    'inbox_dashboard',
-    'inbox_conversation',
-    'conversation_through_inbox',
-    'notifications_dashboard',
-    'label_conversations',
-    'conversations_through_label',
-    'team_conversations',
-    'conversations_through_team',
-    'conversation_mentions',
-    'conversation_through_mentions',
-    'conversation_participating',
-    'conversation_through_participating',
-    'folder_conversations',
-    'conversations_through_folders',
-    'conversation_unattended',
-    'conversation_through_unattended',
-  ],
-  menuItems: [
-    {
-      icon: 'chat',
-      label: 'ALL_CONVERSATIONS',
-      key: 'conversations',
-      toState: frontendURL(`accounts/${accountId}/dashboard`),
-      toolTip: 'Conversation from all subscribed inboxes',
-      toStateName: 'home',
-    },
-    {
-      icon: 'mention',
-      label: 'MENTIONED_CONVERSATIONS',
-      key: 'conversation_mentions',
-      toState: frontendURL(`accounts/${accountId}/mentions/conversations`),
-      toStateName: 'conversation_mentions',
-    },
-    {
-      icon: 'mail-unread',
-      label: 'UNATTENDED_CONVERSATIONS',
-      key: 'conversation_unattended',
-      toState: frontendURL(`accounts/${accountId}/unattended/conversations`),
-      toStateName: 'conversation_unattended',
-    },
-  ],
-});
-
-export default conversations;
diff --git a/app/javascript/dashboard/components/layout/config/sidebarItems/notifications.js b/app/javascript/dashboard/components/layout/config/sidebarItems/notifications.js
deleted file mode 100644
index e3b18ebc5..000000000
--- a/app/javascript/dashboard/components/layout/config/sidebarItems/notifications.js
+++ /dev/null
@@ -1,7 +0,0 @@
-const notifications = () => ({
-  parentNav: 'notifications',
-  routes: ['notifications_index'],
-  menuItems: [],
-});
-
-export default notifications;
diff --git a/app/javascript/dashboard/components/layout/config/sidebarItems/primaryMenu.js b/app/javascript/dashboard/components/layout/config/sidebarItems/primaryMenu.js
deleted file mode 100644
index 59de35564..000000000
--- a/app/javascript/dashboard/components/layout/config/sidebarItems/primaryMenu.js
+++ /dev/null
@@ -1,70 +0,0 @@
-import { FEATURE_FLAGS } from '../../../../featureFlags';
-import { frontendURL } from '../../../../helper/URLHelper';
-
-const primaryMenuItems = accountId => [
-  {
-    icon: 'mail-inbox',
-    key: 'inboxView',
-    label: 'INBOX_VIEW',
-    featureFlag: FEATURE_FLAGS.INBOX_VIEW,
-    toState: frontendURL(`accounts/${accountId}/inbox-view`),
-    toStateName: 'inbox_view',
-  },
-  {
-    icon: 'chat',
-    key: 'conversations',
-    label: 'CONVERSATIONS',
-    toState: frontendURL(`accounts/${accountId}/dashboard`),
-    toStateName: 'home',
-  },
-  {
-    icon: 'captain',
-    key: 'captain',
-    label: 'CAPTAIN',
-    featureFlag: FEATURE_FLAGS.CAPTAIN,
-    toState: frontendURL(`accounts/${accountId}/captain/documents`),
-    toStateName: 'captain',
-  },
-  {
-    icon: 'book-contacts',
-    key: 'contacts',
-    label: 'CONTACTS',
-    featureFlag: FEATURE_FLAGS.CRM,
-    toState: frontendURL(`accounts/${accountId}/contacts`),
-    toStateName: 'contacts_dashboard_index',
-  },
-  {
-    icon: 'arrow-trending-lines',
-    key: 'reports',
-    label: 'REPORTS',
-    featureFlag: FEATURE_FLAGS.REPORTS,
-    toState: frontendURL(`accounts/${accountId}/reports`),
-    toStateName: 'account_overview_reports',
-  },
-  {
-    icon: 'megaphone',
-    key: 'campaigns',
-    label: 'CAMPAIGNS',
-    featureFlag: FEATURE_FLAGS.CAMPAIGNS,
-    toState: frontendURL(`accounts/${accountId}/campaigns`),
-    toStateName: 'campaigns_ongoing_index',
-  },
-  {
-    icon: 'library',
-    key: 'helpcenter',
-    label: 'HELP_CENTER.TITLE',
-    featureFlag: FEATURE_FLAGS.HELP_CENTER,
-    alwaysVisibleOnChatwootInstances: true,
-    toState: frontendURL(`accounts/${accountId}/portals/portal_articles_index`),
-    toStateName: 'portals_index',
-  },
-  {
-    icon: 'settings',
-    key: 'settings',
-    label: 'SETTINGS',
-    toState: frontendURL(`accounts/${accountId}/settings`),
-    toStateName: 'settings_home',
-  },
-];
-
-export default primaryMenuItems;
diff --git a/app/javascript/dashboard/components/layout/config/sidebarItems/profileSettings.js b/app/javascript/dashboard/components/layout/config/sidebarItems/profileSettings.js
deleted file mode 100644
index 024b4d3f6..000000000
--- a/app/javascript/dashboard/components/layout/config/sidebarItems/profileSettings.js
+++ /dev/null
@@ -1,7 +0,0 @@
-const profileSettings = () => ({
-  parentNav: 'profileSettings',
-  routes: ['profile_settings_index'],
-  menuItems: [],
-});
-
-export default profileSettings;
diff --git a/app/javascript/dashboard/components/layout/config/sidebarItems/reports.js b/app/javascript/dashboard/components/layout/config/sidebarItems/reports.js
deleted file mode 100644
index f9f00b88d..000000000
--- a/app/javascript/dashboard/components/layout/config/sidebarItems/reports.js
+++ /dev/null
@@ -1,87 +0,0 @@
-import { FEATURE_FLAGS } from '../../../../featureFlags';
-import { frontendURL } from '../../../../helper/URLHelper';
-
-const reports = accountId => ({
-  parentNav: 'reports',
-  routes: [
-    'account_overview_reports',
-    'conversation_reports',
-    'csat_reports',
-    'bot_reports',
-    'agent_reports',
-    'label_reports',
-    'inbox_reports',
-    'inbox_reports_show',
-    'team_reports',
-    'sla_reports',
-  ],
-  menuItems: [
-    {
-      icon: 'arrow-trending-lines',
-      label: 'REPORTS_OVERVIEW',
-      hasSubMenu: false,
-      toState: frontendURL(`accounts/${accountId}/reports/overview`),
-      toStateName: 'account_overview_reports',
-    },
-    {
-      icon: 'chat',
-      label: 'REPORTS_CONVERSATION',
-      hasSubMenu: false,
-      toState: frontendURL(`accounts/${accountId}/reports/conversation`),
-      toStateName: 'conversation_reports',
-    },
-    {
-      icon: 'emoji',
-      label: 'CSAT',
-      hasSubMenu: false,
-      toState: frontendURL(`accounts/${accountId}/reports/csat`),
-      toStateName: 'csat_reports',
-    },
-    {
-      icon: 'bot',
-      label: 'REPORTS_BOT',
-      hasSubMenu: false,
-      featureFlag: FEATURE_FLAGS.RESPONSE_BOT,
-      toState: frontendURL(`accounts/${accountId}/reports/bot`),
-      toStateName: 'bot_reports',
-    },
-    {
-      icon: 'people',
-      label: 'REPORTS_AGENT',
-      hasSubMenu: false,
-      toState: frontendURL(`accounts/${accountId}/reports/agent`),
-      toStateName: 'agent_reports',
-    },
-    {
-      icon: 'tag',
-      label: 'REPORTS_LABEL',
-      hasSubMenu: false,
-      toState: frontendURL(`accounts/${accountId}/reports/label`),
-      toStateName: 'label_reports',
-    },
-    {
-      icon: 'mail-inbox-all',
-      label: 'REPORTS_INBOX',
-      hasSubMenu: false,
-      toState: frontendURL(`accounts/${accountId}/reports/inboxes`),
-      toStateName: 'inbox_reports',
-    },
-    {
-      icon: 'people-team',
-      label: 'REPORTS_TEAM',
-      hasSubMenu: false,
-      toState: frontendURL(`accounts/${accountId}/reports/teams`),
-      toStateName: 'team_reports',
-    },
-    {
-      icon: 'document-list-clock',
-      label: 'REPORTS_SLA',
-      hasSubMenu: false,
-      featureFlag: FEATURE_FLAGS.SLA,
-      toState: frontendURL(`accounts/${accountId}/reports/sla`),
-      toStateName: 'sla_reports',
-    },
-  ],
-});
-
-export default reports;
diff --git a/app/javascript/dashboard/components/layout/config/sidebarItems/settings.js b/app/javascript/dashboard/components/layout/config/sidebarItems/settings.js
deleted file mode 100644
index 08526f4d3..000000000
--- a/app/javascript/dashboard/components/layout/config/sidebarItems/settings.js
+++ /dev/null
@@ -1,220 +0,0 @@
-import { FEATURE_FLAGS } from '../../../../featureFlags';
-import { frontendURL } from '../../../../helper/URLHelper';
-
-const settings = accountId => ({
-  parentNav: 'settings',
-  routes: [
-    'agent_bots',
-    'agent_list',
-    'attributes_list',
-    'automation_list',
-    'auditlogs_list',
-    'billing_settings_index',
-    'canned_list',
-    'general_settings_index',
-    'general_settings',
-    'labels_list',
-    'macros_edit',
-    'macros_new',
-    'macros_wrapper',
-    'settings_applications_integration',
-    'settings_applications_webhook',
-    'settings_applications',
-    'settings_inbox_finish',
-    'settings_inbox_list',
-    'settings_inbox_new',
-    'settings_inbox_show',
-    'settings_inboxes_add_agents',
-    'settings_inboxes_page_channel',
-    'settings_integrations_dashboard_apps',
-    'settings_integrations_integration',
-    'settings_integrations_slack',
-    'settings_integrations_webhook',
-    'settings_integrations',
-    'settings_teams_add_agents',
-    'settings_teams_edit_finish',
-    'settings_teams_edit_members',
-    'settings_teams_edit',
-    'settings_teams_finish',
-    'settings_teams_list',
-    'settings_teams_new',
-    'sla_list',
-    'custom_roles_list',
-  ],
-  menuItems: [
-    {
-      icon: 'briefcase',
-      label: 'ACCOUNT_SETTINGS',
-      hasSubMenu: false,
-      meta: {
-        permissions: ['administrator'],
-      },
-      toState: frontendURL(`accounts/${accountId}/settings/general`),
-      toStateName: 'general_settings_index',
-    },
-    {
-      icon: 'people',
-      label: 'AGENTS',
-      hasSubMenu: false,
-      meta: {
-        permissions: ['administrator'],
-      },
-      toState: frontendURL(`accounts/${accountId}/settings/agents/list`),
-      toStateName: 'agent_list',
-      featureFlag: FEATURE_FLAGS.AGENT_MANAGEMENT,
-    },
-    {
-      icon: 'people-team',
-      label: 'TEAMS',
-      hasSubMenu: false,
-      meta: {
-        permissions: ['administrator'],
-      },
-      toState: frontendURL(`accounts/${accountId}/settings/teams/list`),
-      toStateName: 'settings_teams_list',
-      featureFlag: FEATURE_FLAGS.TEAM_MANAGEMENT,
-    },
-    {
-      icon: 'mail-inbox-all',
-      label: 'INBOXES',
-      hasSubMenu: false,
-      meta: {
-        permissions: ['administrator'],
-      },
-      toState: frontendURL(`accounts/${accountId}/settings/inboxes/list`),
-      toStateName: 'settings_inbox_list',
-      featureFlag: FEATURE_FLAGS.INBOX_MANAGEMENT,
-    },
-    {
-      icon: 'tag',
-      label: 'LABELS',
-      hasSubMenu: false,
-      meta: {
-        permissions: ['administrator'],
-      },
-      toState: frontendURL(`accounts/${accountId}/settings/labels/list`),
-      toStateName: 'labels_list',
-      featureFlag: FEATURE_FLAGS.LABELS,
-    },
-    {
-      icon: 'code',
-      label: 'CUSTOM_ATTRIBUTES',
-      hasSubMenu: false,
-      meta: {
-        permissions: ['administrator'],
-      },
-      toState: frontendURL(
-        `accounts/${accountId}/settings/custom-attributes/list`
-      ),
-      toStateName: 'attributes_list',
-      featureFlag: FEATURE_FLAGS.CUSTOM_ATTRIBUTES,
-    },
-    {
-      icon: 'automation',
-      label: 'AUTOMATION',
-      hasSubMenu: false,
-      meta: {
-        permissions: ['administrator'],
-      },
-      toState: frontendURL(`accounts/${accountId}/settings/automation/list`),
-      toStateName: 'automation_list',
-      featureFlag: FEATURE_FLAGS.AUTOMATIONS,
-    },
-    {
-      icon: 'bot',
-      label: 'AGENT_BOTS',
-      hasSubMenu: false,
-      meta: {
-        permissions: ['administrator'],
-      },
-      toState: frontendURL(`accounts/${accountId}/settings/agent-bots`),
-      toStateName: 'agent_bots',
-      featureFlag: FEATURE_FLAGS.AGENT_BOTS,
-    },
-    {
-      icon: 'flash-settings',
-      label: 'MACROS',
-      hasSubMenu: false,
-      meta: {
-        permissions: ['administrator', 'agent'],
-      },
-      toState: frontendURL(`accounts/${accountId}/settings/macros`),
-      toStateName: 'macros_wrapper',
-      featureFlag: FEATURE_FLAGS.MACROS,
-    },
-    {
-      icon: 'chat-multiple',
-      label: 'CANNED_RESPONSES',
-      hasSubMenu: false,
-      meta: {
-        permissions: ['administrator', 'agent'],
-      },
-      toState: frontendURL(
-        `accounts/${accountId}/settings/canned-response/list`
-      ),
-      toStateName: 'canned_list',
-      featureFlag: FEATURE_FLAGS.CANNED_RESPONSES,
-    },
-    {
-      icon: 'flash-on',
-      label: 'INTEGRATIONS',
-      hasSubMenu: false,
-      meta: {
-        permissions: ['administrator'],
-      },
-      toState: frontendURL(`accounts/${accountId}/settings/integrations`),
-      toStateName: 'settings_applications',
-      featureFlag: FEATURE_FLAGS.INTEGRATIONS,
-    },
-    {
-      icon: 'key',
-      label: 'AUDIT_LOGS',
-      hasSubMenu: false,
-      meta: {
-        permissions: ['administrator'],
-      },
-      toState: frontendURL(`accounts/${accountId}/settings/audit-logs/list`),
-      toStateName: 'auditlogs_list',
-      isEnterpriseOnly: true,
-      featureFlag: FEATURE_FLAGS.AUDIT_LOGS,
-    },
-    {
-      icon: 'scan-person',
-      label: 'CUSTOM_ROLES',
-      hasSubMenu: false,
-      meta: {
-        permissions: ['administrator'],
-      },
-      toState: frontendURL(`accounts/${accountId}/settings/custom-roles/list`),
-      toStateName: 'custom_roles_list',
-      isEnterpriseOnly: true,
-      beta: true,
-    },
-    {
-      icon: 'document-list-clock',
-      label: 'SLA',
-      hasSubMenu: false,
-      meta: {
-        permissions: ['administrator'],
-      },
-      toState: frontendURL(`accounts/${accountId}/settings/sla/list`),
-      toStateName: 'sla_list',
-      isEnterpriseOnly: true,
-      featureFlag: FEATURE_FLAGS.SLA,
-      beta: true,
-    },
-    {
-      icon: 'credit-card-person',
-      label: 'BILLING',
-      hasSubMenu: false,
-      meta: {
-        permissions: ['administrator'],
-      },
-      toState: frontendURL(`accounts/${accountId}/settings/billing`),
-      toStateName: 'billing_settings_index',
-      showOnlyOnCloud: true,
-    },
-  ],
-});
-
-export default settings;
diff --git a/app/javascript/dashboard/components/layout/sidebarComponents/AccountContext.vue b/app/javascript/dashboard/components/layout/sidebarComponents/AccountContext.vue
deleted file mode 100644
index dc00ed03d..000000000
--- a/app/javascript/dashboard/components/layout/sidebarComponents/AccountContext.vue
+++ /dev/null
@@ -1,110 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-import NextButton from 'dashboard/components-next/button/Button.vue';
-
-export default {
-  components: {
-    NextButton,
-  },
-  emits: ['toggleAccounts'],
-  data() {
-    return { showSwitchButton: false };
-  },
-  computed: {
-    ...mapGetters({
-      account: 'getCurrentAccount',
-      userAccounts: 'getUserAccounts',
-    }),
-    showShowCurrentAccountContext() {
-      return this.userAccounts.length > 1 && this.account.name;
-    },
-  },
-  methods: {
-    setShowSwitch() {
-      this.showSwitchButton = true;
-    },
-    resetShowSwitch() {
-      this.showSwitchButton = false;
-    },
-  },
-};
-</script>
-
-<!-- eslint-disable-next-line vue/no-root-v-if -->
-<template>
-  <div
-    v-if="showShowCurrentAccountContext"
-    class="relative px-2 py-2 mt-2 text-xs border rounded-md cursor-pointer text-slate-700 dark:text-slate-200 border-slate-50 dark:border-slate-800/50 hover:bg-slate-50 dark:hover:bg-slate-800"
-    @mouseover="setShowSwitch"
-    @mouseleave="resetShowSwitch"
-  >
-    {{ $t('SIDEBAR.CURRENTLY_VIEWING_ACCOUNT') }}
-    <p
-      class="mb-0 overflow-hidden font-medium text-ellipsis whitespace-nowrap text-slate-800 dark:text-slate-100"
-    >
-      {{ account.name }}
-    </p>
-    <transition name="fade">
-      <div
-        v-if="showSwitchButton"
-        class="absolute top-0 right-0 flex items-center justify-end w-full h-full rounded-md ltr:overlay-shadow ltr:dark:overlay-shadow-dark rtl:rtl-overlay-shadow rtl:dark:rtl-overlay-shadow-dark"
-      >
-        <div class="mx-2 my-0">
-          <NextButton
-            ghost
-            xs
-            icon="i-lucide-arrow-right-left"
-            :label="$t('SIDEBAR.SWITCH')"
-            @click="$emit('toggleAccounts')"
-          />
-        </div>
-      </div>
-    </transition>
-  </div>
-</template>
-
-<style scoped>
-@tailwind components;
-@layer components {
-  .overlay-shadow {
-    background-image: linear-gradient(
-      to right,
-      rgba(255, 255, 255, 0) 0%,
-      rgba(255, 255, 255, 1) 50%
-    );
-  }
-
-  .overlay-shadow-dark {
-    background-image: linear-gradient(
-      to right,
-      rgba(0, 0, 0, 0) 0%,
-      rgb(21, 23, 24) 50%
-    );
-  }
-
-  .rtl-overlay-shadow {
-    background-image: linear-gradient(
-      to left,
-      rgba(255, 255, 255, 0) 0%,
-      rgba(255, 255, 255, 1) 50%
-    );
-  }
-
-  .rtl-overlay-shadow-dark {
-    background-image: linear-gradient(
-      to left,
-      rgba(0, 0, 0, 0) 0%,
-      rgb(21, 23, 24) 50%
-    );
-  }
-}
-.fade-enter-active,
-.fade-leave-active {
-  transition: opacity 300ms ease;
-}
-
-.fade-enter,
-.fade-leave-to {
-  @apply opacity-0;
-}
-</style>
diff --git a/app/javascript/dashboard/components/layout/sidebarComponents/AccountSelector.vue b/app/javascript/dashboard/components/layout/sidebarComponents/AccountSelector.vue
deleted file mode 100644
index 8ff15ecf1..000000000
--- a/app/javascript/dashboard/components/layout/sidebarComponents/AccountSelector.vue
+++ /dev/null
@@ -1,88 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-export default {
-  props: {
-    showAccountModal: {
-      type: Boolean,
-      default: true,
-    },
-  },
-  emits: ['closeAccountModal', 'showCreateAccountModal'],
-  computed: {
-    ...mapGetters({
-      accountId: 'getCurrentAccountId',
-      currentUser: 'getCurrentUser',
-      globalConfig: 'globalConfig/get',
-    }),
-  },
-  methods: {
-    onChangeAccount(accountId) {
-      const accountUrl = `/app/accounts/${accountId}/dashboard`;
-      window.location.href = accountUrl;
-    },
-  },
-};
-</script>
-
-<template>
-  <woot-modal
-    :show="showAccountModal"
-    :on-close="() => $emit('closeAccountModal')"
-  >
-    <woot-modal-header
-      :header-title="$t('SIDEBAR_ITEMS.CHANGE_ACCOUNTS')"
-      :header-content="$t('SIDEBAR_ITEMS.SELECTOR_SUBTITLE')"
-    />
-    <div class="px-8 py-4">
-      <div
-        v-for="account in currentUser.accounts"
-        :id="`account-${account.id}`"
-        :key="account.id"
-        class="pt-0 pb-0"
-      >
-        <button
-          class="flex items-center justify-between w-full px-4 py-3 rounded-lg cursor-pointer expanded clear link hover:underline hover:bg-slate-25 dark:hover:bg-slate-900"
-          @click="onChangeAccount(account.id)"
-        >
-          <span class="w-full">
-            <label :for="account.name" class="text-left rtl:text-right">
-              <div
-                class="text-lg font-medium leading-5 text-slate-700 dark:text-slate-100 hover:underline-offset-4"
-              >
-                {{ account.name }}
-              </div>
-              <div
-                class="text-xs font-medium lowercase text-slate-500 dark:text-slate-500 hover:underline-offset-4"
-              >
-                {{
-                  account.custom_role_id
-                    ? account.custom_role.name
-                    : account.role
-                }}
-              </div>
-            </label>
-          </span>
-          <fluent-icon
-            v-show="account.id === accountId"
-            class="text-slate-800 dark:text-slate-100"
-            icon="checkmark-circle"
-            type="solid"
-            size="24"
-          />
-        </button>
-      </div>
-    </div>
-
-    <div
-      v-if="globalConfig.createNewAccountFromDashboard"
-      class="flex items-center justify-end gap-2 px-8 pt-4 pb-8"
-    >
-      <button
-        class="w-full button success large expanded nice"
-        @click="$emit('showCreateAccountModal')"
-      >
-        {{ $t('CREATE_ACCOUNT.NEW_ACCOUNT') }}
-      </button>
-    </div>
-  </woot-modal>
-</template>
diff --git a/app/javascript/dashboard/components/layout/sidebarComponents/AgentDetails.vue b/app/javascript/dashboard/components/layout/sidebarComponents/AgentDetails.vue
deleted file mode 100644
index bab54d53f..000000000
--- a/app/javascript/dashboard/components/layout/sidebarComponents/AgentDetails.vue
+++ /dev/null
@@ -1,45 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-import Thumbnail from '../../widgets/Thumbnail.vue';
-import NextButton from 'dashboard/components-next/button/Button.vue';
-
-export default {
-  components: {
-    Thumbnail,
-    NextButton,
-  },
-  emits: ['toggleMenu'],
-  computed: {
-    ...mapGetters({
-      currentUser: 'getCurrentUser',
-      currentUserAvailability: 'getCurrentUserAvailability',
-    }),
-    statusOfAgent() {
-      return this.currentUserAvailability || 'offline';
-    },
-  },
-  methods: {
-    handleClick() {
-      this.$emit('toggleMenu');
-    },
-  },
-};
-</script>
-
-<template>
-  <NextButton
-    v-tooltip.right="$t(`SIDEBAR.PROFILE_SETTINGS`)"
-    link
-    class="rounded-full"
-    @click="handleClick"
-  >
-    <Thumbnail
-      :src="currentUser.avatar_url"
-      :username="currentUser.name"
-      :status="statusOfAgent"
-      should-show-status-always
-      size="32px"
-      class="flex-shrink-0"
-    />
-  </NextButton>
-</template>
diff --git a/app/javascript/dashboard/components/layout/sidebarComponents/Logo.vue b/app/javascript/dashboard/components/layout/sidebarComponents/Logo.vue
deleted file mode 100644
index 38615fff0..000000000
--- a/app/javascript/dashboard/components/layout/sidebarComponents/Logo.vue
+++ /dev/null
@@ -1,33 +0,0 @@
-<script>
-import { frontendURL } from 'dashboard/helper/URLHelper';
-
-export default {
-  props: {
-    source: {
-      type: String,
-      default: '',
-    },
-    name: {
-      type: String,
-      default: '',
-    },
-    accountId: {
-      type: Number,
-      default: 0,
-    },
-  },
-  computed: {
-    dashboardPath() {
-      return frontendURL(`accounts/${this.accountId}/dashboard`);
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="w-8 h-8">
-    <router-link :to="dashboardPath" replace>
-      <img :src="source" :alt="name" />
-    </router-link>
-  </div>
-</template>
diff --git a/app/javascript/dashboard/components/layout/sidebarComponents/NotificationBell.vue b/app/javascript/dashboard/components/layout/sidebarComponents/NotificationBell.vue
deleted file mode 100644
index d0c53037a..000000000
--- a/app/javascript/dashboard/components/layout/sidebarComponents/NotificationBell.vue
+++ /dev/null
@@ -1,58 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-
-export default {
-  emits: ['openNotificationPanel'],
-
-  computed: {
-    ...mapGetters({
-      notificationMetadata: 'notifications/getMeta',
-    }),
-    unreadCount() {
-      if (!this.notificationMetadata.unreadCount) {
-        return '';
-      }
-
-      return this.notificationMetadata.unreadCount < 100
-        ? `${this.notificationMetadata.unreadCount}`
-        : '99+';
-    },
-    isNotificationPanelActive() {
-      return this.$route.name === 'notifications_index';
-    },
-  },
-  methods: {
-    openNotificationPanel() {
-      if (this.$route.name !== 'notifications_index') {
-        this.$emit('openNotificationPanel');
-      }
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="mb-4">
-    <button
-      class="relative flex items-center justify-center w-10 h-10 p-0 my-2 rounded-lg text-slate-600 dark:text-slate-100 hover:bg-slate-25 dark:hover:bg-slate-700 dark:hover:text-slate-100 hover:text-slate-600"
-      :class="{
-        'bg-woot-50 dark:bg-slate-800 text-woot-500 hover:bg-woot-50':
-          isNotificationPanelActive,
-      }"
-      @click="openNotificationPanel"
-    >
-      <fluent-icon
-        icon="alert"
-        :class="{
-          'text-woot-500': isNotificationPanelActive,
-        }"
-      />
-      <span
-        v-if="unreadCount"
-        class="text-black-900 bg-yellow-300 absolute -top-0.5 -right-1 text-xxs min-w-[1rem] rounded-full"
-      >
-        {{ unreadCount }}
-      </span>
-    </button>
-  </div>
-</template>
diff --git a/app/javascript/dashboard/components/layout/sidebarComponents/OptionsMenu.vue b/app/javascript/dashboard/components/layout/sidebarComponents/OptionsMenu.vue
deleted file mode 100644
index 03549dad6..000000000
--- a/app/javascript/dashboard/components/layout/sidebarComponents/OptionsMenu.vue
+++ /dev/null
@@ -1,204 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-import Auth from '../../../api/auth';
-import WootDropdownItem from 'shared/components/ui/dropdown/DropdownItem.vue';
-import WootDropdownMenu from 'shared/components/ui/dropdown/DropdownMenu.vue';
-import AvailabilityStatus from 'dashboard/components/layout/AvailabilityStatus.vue';
-import { FEATURE_FLAGS } from '../../../featureFlags';
-import NextButton from 'dashboard/components-next/button/Button.vue';
-
-export default {
-  components: {
-    WootDropdownMenu,
-    WootDropdownItem,
-    AvailabilityStatus,
-    NextButton,
-  },
-  props: {
-    show: {
-      type: Boolean,
-      default: false,
-    },
-  },
-  emits: [
-    'close',
-    'openKeyShortcutModal',
-    'toggleAccounts',
-    'showSupportChatWindow',
-  ],
-  computed: {
-    ...mapGetters({
-      currentUser: 'getCurrentUser',
-      globalConfig: 'globalConfig/get',
-      accountId: 'getCurrentAccountId',
-      isFeatureEnabledonAccount: 'accounts/isFeatureEnabledonAccount',
-    }),
-    showChangeAccountOption() {
-      if (this.globalConfig.createNewAccountFromDashboard) {
-        return true;
-      }
-
-      const { accounts = [] } = this.currentUser;
-      return accounts.length > 1;
-    },
-    showChatSupport() {
-      return (
-        this.isFeatureEnabledonAccount(
-          this.accountId,
-          FEATURE_FLAGS.CONTACT_CHATWOOT_SUPPORT_TEAM
-        ) && this.globalConfig.chatwootInboxToken
-      );
-    },
-  },
-  methods: {
-    handleProfileSettingClick(e, navigate) {
-      this.$emit('close');
-      navigate(e);
-    },
-    handleKeyboardHelpClick() {
-      this.$emit('openKeyShortcutModal');
-      this.$emit('close');
-    },
-    logout() {
-      Auth.logout();
-    },
-    onClickAway() {
-      if (this.show) this.$emit('close');
-    },
-    openAppearanceOptions() {
-      const ninja = document.querySelector('ninja-keys');
-      ninja.open({ parent: 'appearance_settings' });
-    },
-  },
-};
-</script>
-
-<template>
-  <transition name="menu-slide">
-    <div
-      v-if="show"
-      v-on-clickaway="onClickAway"
-      class="absolute z-30 w-64 px-2 py-2 bg-white border rounded-md shadow-xl left-3 rtl:left-auto rtl:right-3 bottom-16 dark:bg-slate-800 border-slate-25 dark:border-slate-700"
-      :class="{ 'block visible': show }"
-    >
-      <AvailabilityStatus />
-      <WootDropdownMenu>
-        <WootDropdownItem v-if="showChangeAccountOption">
-          <NextButton
-            ghost
-            sm
-            slate
-            icon="i-lucide-arrow-right-left"
-            class="!w-full !justify-start"
-            @click="$emit('toggleAccounts')"
-          >
-            <span class="min-w-0 truncate font-medium text-xs">
-              {{ $t('SIDEBAR_ITEMS.CHANGE_ACCOUNTS') }}
-            </span>
-          </NextButton>
-        </WootDropdownItem>
-        <WootDropdownItem v-if="showChatSupport">
-          <NextButton
-            ghost
-            sm
-            slate
-            icon="i-lucide-message-circle-question"
-            class="!w-full !justify-start"
-            @click="$emit('showSupportChatWindow')"
-          >
-            <span class="min-w-0 truncate font-medium text-xs">
-              {{ $t('SIDEBAR_ITEMS.CONTACT_SUPPORT') }}
-            </span>
-          </NextButton>
-        </WootDropdownItem>
-        <WootDropdownItem>
-          <NextButton
-            ghost
-            sm
-            slate
-            icon="i-lucide-keyboard"
-            class="!w-full !justify-start"
-            @click="handleKeyboardHelpClick"
-          >
-            <span class="min-w-0 truncate font-medium text-xs">
-              {{ $t('SIDEBAR_ITEMS.KEYBOARD_SHORTCUTS') }}
-            </span>
-          </NextButton>
-        </WootDropdownItem>
-        <WootDropdownItem>
-          <router-link
-            v-slot="{ href, isActive, navigate }"
-            :to="`/app/accounts/${accountId}/profile/settings`"
-            custom
-          >
-            <a
-              :href="href"
-              :class="{ 'is-active': isActive }"
-              @click="e => handleProfileSettingClick(e, navigate)"
-            >
-              <NextButton
-                ghost
-                sm
-                slate
-                icon="i-lucide-circle-user"
-                class="!w-full !justify-start"
-              >
-                <span class="min-w-0 truncate font-medium text-xs">
-                  {{ $t('SIDEBAR_ITEMS.PROFILE_SETTINGS') }}
-                </span>
-              </NextButton>
-            </a>
-          </router-link>
-        </WootDropdownItem>
-        <WootDropdownItem>
-          <NextButton
-            ghost
-            sm
-            slate
-            icon="i-lucide-sun-moon"
-            class="!w-full !justify-start"
-            @click="openAppearanceOptions"
-          >
-            <span class="min-w-0 truncate font-medium text-xs">
-              {{ $t('SIDEBAR_ITEMS.APPEARANCE') }}
-            </span>
-          </NextButton>
-        </WootDropdownItem>
-        <WootDropdownItem v-if="currentUser.type === 'SuperAdmin'">
-          <a
-            href="/super_admin"
-            target="_blank"
-            rel="noopener nofollow noreferrer"
-            @click="$emit('close')"
-          >
-            <NextButton
-              ghost
-              sm
-              slate
-              icon="i-lucide-layout-dashboard"
-              class="!w-full !justify-start"
-            >
-              <span class="min-w-0 truncate font-medium text-xs">
-                {{ $t('SIDEBAR_ITEMS.SUPER_ADMIN_CONSOLE') }}
-              </span>
-            </NextButton>
-          </a>
-        </WootDropdownItem>
-        <WootDropdownItem>
-          <NextButton
-            ghost
-            sm
-            slate
-            icon="i-lucide-circle-power"
-            class="!w-full !justify-start"
-            @click="logout"
-          >
-            <span class="min-w-0 truncate font-medium text-xs">
-              {{ $t('SIDEBAR_ITEMS.LOGOUT') }}
-            </span>
-          </NextButton>
-        </WootDropdownItem>
-      </WootDropdownMenu>
-    </div>
-  </transition>
-</template>
diff --git a/app/javascript/dashboard/components/layout/sidebarComponents/Primary.vue b/app/javascript/dashboard/components/layout/sidebarComponents/Primary.vue
deleted file mode 100644
index 1cbd6a56a..000000000
--- a/app/javascript/dashboard/components/layout/sidebarComponents/Primary.vue
+++ /dev/null
@@ -1,116 +0,0 @@
-<script>
-import Logo from './Logo.vue';
-import PrimaryNavItem from './PrimaryNavItem.vue';
-import OptionsMenu from './OptionsMenu.vue';
-import AgentDetails from './AgentDetails.vue';
-import NotificationBell from './NotificationBell.vue';
-import wootConstants from 'dashboard/constants/globals';
-import { frontendURL } from 'dashboard/helper/URLHelper';
-import { ACCOUNT_EVENTS } from '../../../helper/AnalyticsHelper/events';
-import { useTrack } from 'dashboard/composables';
-
-export default {
-  components: {
-    Logo,
-    PrimaryNavItem,
-    OptionsMenu,
-    AgentDetails,
-    NotificationBell,
-  },
-  props: {
-    isACustomBrandedInstance: {
-      type: Boolean,
-      default: false,
-    },
-    logoSource: {
-      type: String,
-      default: '',
-    },
-    installationName: {
-      type: String,
-      default: '',
-    },
-    accountId: {
-      type: Number,
-      default: 0,
-    },
-    menuItems: {
-      type: Array,
-      default: () => [],
-    },
-    activeMenuItem: {
-      type: String,
-      default: '',
-    },
-  },
-  emits: ['toggleAccounts', 'openNotificationPanel', 'openKeyShortcutModal'],
-  data() {
-    return {
-      helpDocsURL: wootConstants.DOCS_URL,
-      showOptionsMenu: false,
-    };
-  },
-  methods: {
-    frontendURL,
-    toggleOptions() {
-      this.showOptionsMenu = !this.showOptionsMenu;
-    },
-    toggleAccountModal() {
-      this.$emit('toggleAccounts');
-    },
-    toggleSupportChatWindow() {
-      window.$chatwoot.toggle();
-    },
-    openNotificationPanel() {
-      useTrack(ACCOUNT_EVENTS.OPENED_NOTIFICATIONS);
-      this.$emit('openNotificationPanel');
-    },
-  },
-};
-</script>
-
-<template>
-  <div
-    class="flex flex-col justify-between w-16 h-full bg-white border-r dark:bg-slate-900 border-slate-50 dark:border-slate-800/50 rtl:border-l rtl:border-r-0"
-  >
-    <div class="flex flex-col items-center">
-      <Logo
-        :source="logoSource"
-        :name="installationName"
-        :account-id="accountId"
-        class="m-4 mb-10"
-      />
-      <PrimaryNavItem
-        v-for="menuItem in menuItems"
-        :id="menuItem.key"
-        :key="menuItem.toState"
-        :icon="menuItem.icon"
-        :name="menuItem.label"
-        :to="menuItem.toState"
-        :is-child-menu-active="menuItem.key === activeMenuItem"
-      />
-    </div>
-    <div class="flex flex-col items-center justify-end pb-6">
-      <a
-        v-if="!isACustomBrandedInstance"
-        v-tooltip.right="$t(`SIDEBAR.DOCS`)"
-        :href="helpDocsURL"
-        class="relative flex items-center justify-center w-10 h-10 my-2 rounded-lg text-slate-700 dark:text-slate-100 hover:bg-slate-25 dark:hover:bg-slate-700 dark:hover:text-slate-100 hover:text-slate-600"
-        rel="noopener noreferrer nofollow"
-        target="_blank"
-      >
-        <fluent-icon icon="book-open-globe" />
-        <span class="sr-only">{{ $t(`SIDEBAR.DOCS`) }}</span>
-      </a>
-      <NotificationBell @open-notification-panel="openNotificationPanel" />
-      <AgentDetails @toggle-menu="toggleOptions" />
-      <OptionsMenu
-        :show="showOptionsMenu"
-        @toggle-accounts="toggleAccountModal"
-        @show-support-chat-window="toggleSupportChatWindow"
-        @open-key-shortcut-modal="$emit('openKeyShortcutModal')"
-        @close="toggleOptions"
-      />
-    </div>
-  </div>
-</template>
diff --git a/app/javascript/dashboard/components/layout/sidebarComponents/PrimaryNavItem.vue b/app/javascript/dashboard/components/layout/sidebarComponents/PrimaryNavItem.vue
deleted file mode 100644
index 2ad2a57b5..000000000
--- a/app/javascript/dashboard/components/layout/sidebarComponents/PrimaryNavItem.vue
+++ /dev/null
@@ -1,148 +0,0 @@
-<script>
-import { OnClickOutside } from '@vueuse/components';
-import { HELP_CENTER_MENU_ITEMS } from 'dashboard/helper/portalHelper';
-
-import DropdownMenu from 'dashboard/components-next/dropdown-menu/DropdownMenu.vue';
-
-export default {
-  components: {
-    DropdownMenu,
-    OnClickOutside,
-  },
-  props: {
-    to: {
-      type: String,
-      default: '',
-    },
-    id: {
-      type: String,
-      default: '',
-    },
-    name: {
-      type: String,
-      default: '',
-    },
-    icon: {
-      type: String,
-      default: '',
-    },
-    count: {
-      type: String,
-      default: '',
-    },
-    isChildMenuActive: {
-      type: Boolean,
-      default: false,
-    },
-    openInNewPage: {
-      type: Boolean,
-      default: false,
-    },
-  },
-
-  data() {
-    return {
-      helpCenterMenu: HELP_CENTER_MENU_ITEMS,
-      showHelpCenterMenu: false,
-    };
-  },
-  computed: {
-    helpCenterMenuItems() {
-      return this.helpCenterMenu.map(item => ({
-        ...item,
-        isSelected: this.isSelectedMenuItem(item),
-      }));
-    },
-    isHelpCenter() {
-      return this.id === 'helpcenter';
-    },
-    isHelpCenterSelected() {
-      const routes = [
-        'portals_new',
-        'portals_index',
-        'portals_articles_index',
-        'portals_articles_new',
-        'portals_articles_edit',
-        'portals_categories_index',
-        'portals_categories_articles_index',
-        'portals_categories_articles_edit',
-        'portals_locales_index',
-        'portals_settings_index',
-      ];
-      return routes.includes(this.$route.name);
-    },
-  },
-  methods: {
-    isSelectedMenuItem(menuItem) {
-      return menuItem.value.includes(this.$route.name);
-    },
-    toggleHelpCenterMenu() {
-      this.showHelpCenterMenu = !this.showHelpCenterMenu;
-    },
-    handleHelpCenterAction({ action }) {
-      this.$router.push({
-        name: 'portals_index',
-        params: {
-          navigationPath: action,
-        },
-      });
-    },
-  },
-};
-</script>
-
-<template>
-  <OnClickOutside v-if="isHelpCenter" @trigger="showHelpCenterMenu = false">
-    <button
-      v-tooltip.top="$t(`SIDEBAR.${name}`)"
-      class="relative flex items-center justify-center w-10 h-10 my-2 rounded-lg text-slate-700 dark:text-slate-100 hover:!bg-slate-25 dark:hover:!bg-slate-700 dark:hover:text-slate-100 hover:text-slate-600"
-      :class="{
-        'bg-woot-50 dark:bg-slate-800 text-woot-500 hover:bg-woot-50':
-          isHelpCenterSelected,
-      }"
-      @click="toggleHelpCenterMenu"
-    >
-      <fluent-icon
-        :icon="icon"
-        :class="{
-          'text-woot-500': isHelpCenterSelected,
-        }"
-      />
-      <DropdownMenu
-        v-if="showHelpCenterMenu && isHelpCenter"
-        :menu-items="helpCenterMenuItems"
-        class="ltr:left-10 rtl:right-10 w-36 z-[100] top-0 overflow-y-auto max-h-52"
-        @action="handleHelpCenterAction"
-      />
-    </button>
-  </OnClickOutside>
-
-  <router-link v-else v-slot="{ href, isActive, navigate }" :to="to" custom>
-    <a
-      v-tooltip.right="$t(`SIDEBAR.${name}`)"
-      :href="href"
-      class="relative flex items-center justify-center w-10 h-10 my-2 rounded-lg text-slate-700 dark:text-slate-100 hover:bg-slate-25 dark:hover:bg-slate-700 dark:hover:text-slate-100 hover:text-slate-600"
-      :class="{
-        'bg-woot-50 dark:bg-slate-800 text-woot-500 hover:bg-woot-50':
-          isActive || isChildMenuActive,
-      }"
-      :rel="openInNewPage ? 'noopener noreferrer nofollow' : undefined"
-      :target="openInNewPage ? '_blank' : undefined"
-      @click="navigate"
-    >
-      <fluent-icon
-        :icon="icon"
-        :class="{
-          'text-woot-500': isActive || isChildMenuActive,
-        }"
-      />
-      <span class="sr-only">{{ name }}</span>
-      <span
-        v-if="count"
-        class="absolute bg-yellow-500 text-black-900 -top-1 -right-1"
-      >
-        {{ count }}
-      </span>
-    </a>
-  </router-link>
-</template>
diff --git a/app/javascript/dashboard/components/layout/sidebarComponents/Secondary.vue b/app/javascript/dashboard/components/layout/sidebarComponents/Secondary.vue
deleted file mode 100644
index c36b6f611..000000000
--- a/app/javascript/dashboard/components/layout/sidebarComponents/Secondary.vue
+++ /dev/null
@@ -1,265 +0,0 @@
-<script>
-import { frontendURL } from '../../../helper/URLHelper';
-import SecondaryNavItem from './SecondaryNavItem.vue';
-import AccountContext from './AccountContext.vue';
-import { mapGetters } from 'vuex';
-import { FEATURE_FLAGS } from '../../../featureFlags';
-import {
-  getUserPermissions,
-  hasPermissions,
-} from '../../../helper/permissionsHelper';
-import { routesWithPermissions } from '../../../routes';
-
-export default {
-  components: {
-    AccountContext,
-    SecondaryNavItem,
-  },
-  props: {
-    accountId: {
-      type: Number,
-      default: 0,
-    },
-    labels: {
-      type: Array,
-      default: () => [],
-    },
-    inboxes: {
-      type: Array,
-      default: () => [],
-    },
-    teams: {
-      type: Array,
-      default: () => [],
-    },
-    customViews: {
-      type: Array,
-      default: () => [],
-    },
-    menuConfig: {
-      type: Object,
-      default: () => {},
-    },
-    currentUser: {
-      type: Object,
-      default: () => {},
-    },
-    isOnChatwootCloud: {
-      type: Boolean,
-      default: false,
-    },
-  },
-  emits: ['addLabel', 'toggleAccounts'],
-  computed: {
-    ...mapGetters({
-      isFeatureEnabledonAccount: 'accounts/isFeatureEnabledonAccount',
-    }),
-    contactCustomViews() {
-      return this.customViews.filter(view => view.filter_type === 'contact');
-    },
-    accessibleMenuItems() {
-      const menuItemsFilteredByPermissions = this.menuConfig.menuItems.filter(
-        menuItem => {
-          const userPermissions = getUserPermissions(
-            this.currentUser,
-            this.accountId
-          );
-          return hasPermissions(
-            routesWithPermissions[menuItem.toStateName],
-            userPermissions
-          );
-        }
-      );
-      return menuItemsFilteredByPermissions.filter(item => {
-        if (item.showOnlyOnCloud) {
-          return this.isOnChatwootCloud;
-        }
-        return true;
-      });
-    },
-    inboxSection() {
-      return {
-        icon: 'folder',
-        label: 'INBOXES',
-        hasSubMenu: true,
-        newLink: this.showNewLink(FEATURE_FLAGS.INBOX_MANAGEMENT),
-        newLinkTag: 'NEW_INBOX',
-        key: 'inbox',
-        toState: frontendURL(`accounts/${this.accountId}/settings/inboxes/new`),
-        toStateName: 'settings_inbox_new',
-        newLinkRouteName: 'settings_inbox_new',
-        children: this.inboxes
-          .map(inbox => ({
-            id: inbox.id,
-            label: inbox.name,
-            truncateLabel: true,
-            toState: frontendURL(
-              `accounts/${this.accountId}/inbox/${inbox.id}`
-            ),
-            type: inbox.channel_type,
-            phoneNumber: inbox.phone_number,
-            reauthorizationRequired: inbox.reauthorization_required,
-          }))
-          .sort((a, b) =>
-            a.label.toLowerCase() > b.label.toLowerCase() ? 1 : -1
-          ),
-      };
-    },
-    labelSection() {
-      return {
-        icon: 'number-symbol',
-        label: 'LABELS',
-        hasSubMenu: true,
-        newLink: this.showNewLink(FEATURE_FLAGS.TEAM_MANAGEMENT),
-        newLinkTag: 'NEW_LABEL',
-        key: 'label',
-        toState: frontendURL(`accounts/${this.accountId}/settings/labels`),
-        toStateName: 'labels_list',
-        showModalForNewItem: true,
-        modalName: 'AddLabel',
-        dataTestid: 'sidebar-new-label-button',
-        children: this.labels.map(label => ({
-          id: label.id,
-          label: label.title,
-          color: label.color,
-          truncateLabel: true,
-          toState: frontendURL(
-            `accounts/${this.accountId}/label/${label.title}`
-          ),
-        })),
-      };
-    },
-    contactLabelSection() {
-      return {
-        icon: 'number-symbol',
-        label: 'TAGGED_WITH',
-        hasSubMenu: true,
-        key: 'labels',
-        newLink: this.showNewLink(FEATURE_FLAGS.TEAM_MANAGEMENT),
-        newLinkTag: 'NEW_LABEL',
-        toState: frontendURL(`accounts/${this.accountId}/settings/labels`),
-        toStateName: 'labels_list',
-        showModalForNewItem: true,
-        modalName: 'AddLabel',
-        children: this.labels.map(label => ({
-          id: label.id,
-          label: label.title,
-          color: label.color,
-          truncateLabel: true,
-          toState: frontendURL(
-            `accounts/${this.accountId}/contacts/labels/${label.title}`
-          ),
-        })),
-      };
-    },
-    teamSection() {
-      return {
-        icon: 'people-team',
-        label: 'TEAMS',
-        hasSubMenu: true,
-        newLink: this.showNewLink(FEATURE_FLAGS.TEAM_MANAGEMENT),
-        newLinkTag: 'NEW_TEAM',
-        key: 'team',
-        toState: frontendURL(`accounts/${this.accountId}/settings/teams/new`),
-        toStateName: 'settings_teams_new',
-        newLinkRouteName: 'settings_teams_new',
-        children: this.teams.map(team => ({
-          id: team.id,
-          label: team.name,
-          truncateLabel: true,
-          toState: frontendURL(`accounts/${this.accountId}/team/${team.id}`),
-        })),
-      };
-    },
-    foldersSection() {
-      return {
-        icon: 'folder',
-        label: 'CUSTOM_VIEWS_FOLDER',
-        hasSubMenu: true,
-        key: 'custom_view',
-        children: this.customViews
-          .filter(view => view.filter_type === 'conversation')
-          .map(view => ({
-            id: view.id,
-            label: view.name,
-            truncateLabel: true,
-            toState: frontendURL(
-              `accounts/${this.accountId}/custom_view/${view.id}`
-            ),
-          })),
-      };
-    },
-    contactSegmentsSection() {
-      return {
-        icon: 'folder',
-        label: 'CUSTOM_VIEWS_SEGMENTS',
-        hasSubMenu: true,
-        key: 'segments',
-        children: this.customViews
-          .filter(view => view.filter_type === 'contact')
-          .map(view => ({
-            id: view.id,
-            label: view.name,
-            truncateLabel: true,
-            toState: frontendURL(
-              `accounts/${this.accountId}/contacts/segments/${view.id}`
-            ),
-          })),
-      };
-    },
-    additionalSecondaryMenuItems() {
-      let conversationMenuItems = [this.inboxSection, this.labelSection];
-      let contactMenuItems = [this.contactLabelSection];
-      if (this.teams.length) {
-        conversationMenuItems = [this.teamSection, ...conversationMenuItems];
-      }
-      if (this.customViews.length) {
-        conversationMenuItems = [this.foldersSection, ...conversationMenuItems];
-      }
-      if (this.contactCustomViews.length) {
-        contactMenuItems = [this.contactSegmentsSection, ...contactMenuItems];
-      }
-      return {
-        conversations: conversationMenuItems,
-        contacts: contactMenuItems,
-      };
-    },
-  },
-  methods: {
-    showAddLabelPopup() {
-      this.$emit('addLabel');
-    },
-    toggleAccountModal() {
-      this.$emit('toggleAccounts');
-    },
-    showNewLink(featureFlag) {
-      return this.isFeatureEnabledonAccount(this.accountId, featureFlag);
-    },
-  },
-};
-</script>
-
-<template>
-  <div
-    class="flex flex-col w-48 h-full px-2 pb-8 overflow-auto text-sm bg-white border-r dark:bg-slate-900 dark:border-slate-800/50 rtl:border-r-0 rtl:border-l border-slate-50"
-  >
-    <AccountContext @toggle-accounts="toggleAccountModal" />
-    <transition-group
-      name="menu-list"
-      tag="ul"
-      class="pt-2 list-none reset-base"
-    >
-      <SecondaryNavItem
-        v-for="menuItem in accessibleMenuItems"
-        :key="menuItem.toState"
-        :menu-item="menuItem"
-      />
-      <SecondaryNavItem
-        v-for="menuItem in additionalSecondaryMenuItems[menuConfig.parentNav]"
-        :key="menuItem.key"
-        :menu-item="menuItem"
-        @add-label="showAddLabelPopup"
-      />
-    </transition-group>
-  </div>
-</template>
diff --git a/app/javascript/dashboard/components/layout/sidebarComponents/SecondaryChildNavItem.vue b/app/javascript/dashboard/components/layout/sidebarComponents/SecondaryChildNavItem.vue
deleted file mode 100644
index 6f72f11ec..000000000
--- a/app/javascript/dashboard/components/layout/sidebarComponents/SecondaryChildNavItem.vue
+++ /dev/null
@@ -1,132 +0,0 @@
-<script>
-export default {
-  props: {
-    to: {
-      type: String,
-      default: '',
-    },
-    label: {
-      type: String,
-      default: '',
-    },
-    labelColor: {
-      type: String,
-      default: '',
-    },
-    shouldTruncate: {
-      type: Boolean,
-      default: false,
-    },
-    icon: {
-      type: String,
-      default: '',
-    },
-    warningIcon: {
-      type: String,
-      default: '',
-    },
-    showChildCount: {
-      type: Boolean,
-      default: false,
-    },
-    childItemCount: {
-      type: Number,
-      default: 0,
-    },
-  },
-  computed: {
-    showIcon() {
-      return {
-        'overflow-hidden whitespace-nowrap text-ellipsis': this.shouldTruncate,
-      };
-    },
-    isCountZero() {
-      return this.childItemCount === 0;
-    },
-    menuTitle() {
-      return this.shouldTruncate ? this.label : '';
-    },
-  },
-};
-</script>
-
-<template>
-  <router-link
-    v-slot="{ href, isActive, navigate }"
-    :to="to"
-    custom
-    active-class="active"
-  >
-    <li
-      class="h-7 my-1 hover:bg-slate-25 hover:text-bg-50 flex items-center px-2 rounded-md dark:hover:bg-slate-800"
-      :class="{
-        'bg-woot-25 dark:bg-slate-800': isActive,
-        'text-ellipsis overflow-hidden whitespace-nowrap max-w-full':
-          shouldTruncate,
-      }"
-      @click="navigate"
-    >
-      <a
-        :href="href"
-        class="inline-flex text-left max-w-full w-full items-center"
-      >
-        <span
-          v-if="icon"
-          class="inline-flex items-center justify-center w-4 rounded-sm bg-slate-100 dark:bg-slate-700 p-0.5 mr-1.5 rtl:mr-0 rtl:ml-1.5"
-        >
-          <fluent-icon
-            class="text-xxs text-slate-700 dark:text-slate-200"
-            :class="{
-              'text-woot-500 dark:text-woot-500': isActive,
-            }"
-            :icon="icon"
-            size="12"
-          />
-        </span>
-
-        <span
-          v-if="labelColor"
-          class="inline-flex rounded-sm bg-slate-100 h-3 w-3.5 mr-1.5 rtl:mr-0 rtl:ml-1.5 border border-slate-50 dark:border-slate-900"
-          :style="{ backgroundColor: labelColor }"
-        />
-        <div
-          class="items-center flex overflow-hidden whitespace-nowrap text-ellipsis w-full justify-between"
-        >
-          <span
-            :title="menuTitle"
-            class="text-sm text-slate-700 dark:text-slate-100"
-            :class="{
-              'text-woot-500 dark:text-woot-500': isActive,
-              'text-ellipsis overflow-hidden whitespace-nowrap max-w-full':
-                shouldTruncate,
-            }"
-          >
-            {{ label }}
-          </span>
-          <span
-            v-if="showChildCount"
-            class="bg-slate-50 dark:bg-slate-700 rounded-full min-w-[18px] justify-center items-center flex text-xxs mx-1 py-0 px-1"
-            :class="
-              isCountZero
-                ? `text-slate-300 dark:text-slate-500`
-                : `text-slate-700 dark:text-slate-50`
-            "
-          >
-            {{ childItemCount }}
-          </span>
-        </div>
-        <span
-          v-if="warningIcon"
-          class="inline-flex mr-1 bg-red-50 dark:bg-red-900 p-0.5 rounded-sm"
-        >
-          <fluent-icon
-            v-tooltip.top-end="$t('SIDEBAR.REAUTHORIZE')"
-            class="text-xxs text-red-500 dark:text-red-300"
-            :icon="warningIcon"
-            size="12"
-          />
-        </span>
-      </a>
-    </li>
-  </router-link>
-</template>
diff --git a/app/javascript/dashboard/components/layout/sidebarComponents/SecondaryNavItem.vue b/app/javascript/dashboard/components/layout/sidebarComponents/SecondaryNavItem.vue
deleted file mode 100644
index 6bee69a41..000000000
--- a/app/javascript/dashboard/components/layout/sidebarComponents/SecondaryNavItem.vue
+++ /dev/null
@@ -1,277 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-import { useAdmin } from 'dashboard/composables/useAdmin';
-import { useConfig } from 'dashboard/composables/useConfig';
-import {
-  getInboxClassByType,
-  getInboxWarningIconClass,
-} from 'dashboard/helper/inbox';
-
-import SecondaryChildNavItem from './SecondaryChildNavItem.vue';
-import {
-  isOnMentionsView,
-  isOnUnattendedView,
-} from '../../../store/modules/conversations/helpers/actionHelpers';
-import Policy from '../../policy.vue';
-import NextButton from 'dashboard/components-next/button/Button.vue';
-
-export default {
-  components: { SecondaryChildNavItem, Policy, NextButton },
-  props: {
-    menuItem: {
-      type: Object,
-      default: () => ({}),
-    },
-  },
-  emits: ['addLabel', 'open'],
-  setup() {
-    const { isAdmin } = useAdmin();
-    const { isEnterprise } = useConfig();
-    return {
-      isAdmin,
-      isEnterprise,
-    };
-  },
-  computed: {
-    ...mapGetters({
-      activeInbox: 'getSelectedInbox',
-      accountId: 'getCurrentAccountId',
-      isFeatureEnabledonAccount: 'accounts/isFeatureEnabledonAccount',
-      globalConfig: 'globalConfig/get',
-    }),
-    isCountZero() {
-      return this.menuItem.count === 0;
-    },
-    isActiveView() {
-      return this.computedClass.includes('active-view');
-    },
-    hasSubMenu() {
-      return !!this.menuItem.children;
-    },
-    isMenuItemVisible() {
-      let isFeatureEnabled = true;
-      if (this.menuItem.featureFlag) {
-        isFeatureEnabled = this.isFeatureEnabledonAccount(
-          this.accountId,
-          this.menuItem.featureFlag
-        );
-      }
-
-      if (this.menuItem.isEnterpriseOnly) {
-        if (!this.isEnterprise) return false;
-        return isFeatureEnabled || this.globalConfig.displayManifest;
-      }
-
-      if (this.menuItem.featureFlag) {
-        return this.isFeatureEnabledonAccount(
-          this.accountId,
-          this.menuItem.featureFlag
-        );
-      }
-
-      return isFeatureEnabled;
-    },
-    isAllConversations() {
-      return (
-        this.$store.state.route.name === 'inbox_conversation' &&
-        this.menuItem.toStateName === 'home'
-      );
-    },
-    isMentions() {
-      return (
-        isOnMentionsView({ route: this.$route }) &&
-        this.menuItem.toStateName === 'conversation_mentions'
-      );
-    },
-    isUnattended() {
-      return (
-        isOnUnattendedView({ route: this.$route }) &&
-        this.menuItem.toStateName === 'conversation_unattended'
-      );
-    },
-    isTeamsSettings() {
-      return (
-        this.$store.state.route.name === 'settings_teams_edit' &&
-        this.menuItem.toStateName === 'settings_teams_list'
-      );
-    },
-    isInboxSettings() {
-      return (
-        this.$route.name === 'settings_inbox_show' &&
-        this.menuItem.toStateName === 'settings_inbox_list'
-      );
-    },
-    isIntegrationsSettings() {
-      return (
-        this.$store.state.route.name === 'settings_integrations_webhook' &&
-        this.menuItem.toStateName === 'settings_integrations'
-      );
-    },
-    isApplicationsSettings() {
-      return (
-        this.$store.state.route.name === 'settings_applications_integration' &&
-        this.menuItem.toStateName === 'settings_applications'
-      );
-    },
-    isContactsDefaultRoute() {
-      return (
-        this.menuItem.toStateName === 'contacts_dashboard_index' &&
-        (this.$store.state.route.name === 'contacts_dashboard_index' ||
-          this.$store.state.route.name === 'contacts_edit')
-      );
-    },
-    isCurrentRoute() {
-      return this.$store.state.route.name.includes(this.menuItem.toStateName);
-    },
-
-    computedClass() {
-      // If active inbox is present, do not highlight conversations
-      if (this.activeInbox) return ' ';
-      if (
-        this.isAllConversations ||
-        this.isMentions ||
-        this.isUnattended ||
-        this.isContactsDefaultRoute ||
-        this.isCurrentRoute
-      ) {
-        return 'bg-woot-25 dark:bg-slate-800 text-woot-500 dark:text-woot-500 hover:text-woot-500 dark:hover:text-woot-500 active-view';
-      }
-      if (this.hasSubMenu) {
-        if (
-          this.isTeamsSettings ||
-          this.isInboxSettings ||
-          this.isIntegrationsSettings ||
-          this.isApplicationsSettings
-        ) {
-          return 'bg-woot-25 dark:bg-slate-800 text-woot-500 dark:text-woot-500 hover:text-woot-500 dark:hover:text-woot-500 active-view';
-        }
-        return 'hover:text-slate-700 dark:hover:text-slate-100';
-      }
-
-      return 'hover:text-slate-700 dark:hover:text-slate-100';
-    },
-  },
-  methods: {
-    computedInboxClass(child) {
-      const { type, phoneNumber } = child;
-      if (!type) return '';
-      const classByType = getInboxClassByType(type, phoneNumber);
-      return classByType;
-    },
-    computedInboxErrorClass(child) {
-      const { type, reauthorizationRequired } = child;
-      if (!type) return '';
-      const warningClass = getInboxWarningIconClass(
-        type,
-        reauthorizationRequired
-      );
-      return warningClass;
-    },
-    newLinkClick(e, navigate) {
-      if (this.menuItem.newLinkRouteName) {
-        navigate(e);
-      } else if (this.menuItem.showModalForNewItem) {
-        if (this.menuItem.modalName === 'AddLabel') {
-          e.preventDefault();
-          this.$emit('addLabel');
-        }
-      }
-    },
-    showItem(item) {
-      return this.isAdmin && !!item.newLink;
-    },
-    onClickOpen() {
-      this.$emit('open');
-    },
-    showChildCount(count) {
-      return Number.isInteger(count);
-    },
-  },
-};
-</script>
-
-<template>
-  <li v-show="isMenuItemVisible" class="mt-1">
-    <div v-if="hasSubMenu" class="flex justify-between">
-      <span
-        class="px-2 pt-1 my-2 text-sm font-semibold text-slate-700 dark:text-slate-200"
-      >
-        {{ $t(`SIDEBAR.${menuItem.label}`) }}
-      </span>
-      <div v-if="menuItem.showNewButton" class="flex items-center">
-        <NextButton ghost xs slate icon="i-lucide-plus" @click="onClickOpen" />
-      </div>
-    </div>
-    <router-link
-      v-else
-      class="flex items-center p-2 m-0 text-sm leading-4 rounded-lg text-slate-700 dark:text-slate-100 hover:bg-slate-25 dark:hover:bg-slate-800"
-      :class="computedClass"
-      :to="menuItem && menuItem.toState"
-    >
-      <fluent-icon
-        :icon="menuItem.icon"
-        class="min-w-[1rem] mr-1.5 rtl:mr-0 rtl:ml-1.5"
-        size="14"
-      />
-      {{ $t(`SIDEBAR.${menuItem.label}`) }}
-      <span
-        v-if="showChildCount(menuItem.count)"
-        class="px-1 py-0 mx-1 rounded-md text-xxs"
-        :class="{
-          'text-slate-300 dark:text-slate-600': isCountZero && !isActiveView,
-          'text-slate-600 dark:text-slate-50': !isCountZero && !isActiveView,
-          'bg-woot-75 dark:bg-woot-200 text-woot-600 dark:text-woot-600':
-            isActiveView,
-          'bg-slate-50 dark:bg-slate-700': !isActiveView,
-        }"
-      >
-        {{ `${menuItem.count}` }}
-      </span>
-      <span
-        v-if="menuItem.beta"
-        data-view-component="true"
-        label="Beta"
-        class="inline-block px-1 mx-1 leading-4 text-green-500 border border-green-400 rounded-lg text-xxs"
-      >
-        {{ $t('SIDEBAR.BETA') }}
-      </span>
-    </router-link>
-
-    <ul v-if="hasSubMenu" class="list-none reset-base">
-      <SecondaryChildNavItem
-        v-for="child in menuItem.children"
-        :key="child.id"
-        :to="child.toState"
-        :label="child.label"
-        :label-color="child.color"
-        :should-truncate="child.truncateLabel"
-        :icon="computedInboxClass(child)"
-        :warning-icon="computedInboxErrorClass(child)"
-        :show-child-count="showChildCount(child.count)"
-        :child-item-count="child.count"
-      />
-      <Policy :permissions="['administrator']">
-        <router-link
-          v-if="menuItem.newLink"
-          v-slot="{ href, navigate }"
-          :to="menuItem.toState"
-          custom
-        >
-          <li class="pl-1">
-            <a :href="href">
-              <NextButton
-                ghost
-                xs
-                slate
-                icon="i-lucide-plus"
-                :label="$t(`SIDEBAR.${menuItem.newLinkTag}`)"
-                :data-testid="menuItem.dataTestid"
-                @click="e => newLinkClick(e, navigate)"
-              />
-            </a>
-          </li>
-        </router-link>
-      </Policy>
-    </ul>
-  </li>
-</template>
diff --git a/app/javascript/dashboard/components/layout/sidebarComponents/specs/AccountSelector.spec.js b/app/javascript/dashboard/components/layout/sidebarComponents/specs/AccountSelector.spec.js
deleted file mode 100644
index c819702b0..000000000
--- a/app/javascript/dashboard/components/layout/sidebarComponents/specs/AccountSelector.spec.js
+++ /dev/null
@@ -1,73 +0,0 @@
-import { mount } from '@vue/test-utils';
-import { createStore } from 'vuex';
-import AccountSelector from '../AccountSelector.vue';
-import WootModal from 'dashboard/components/Modal.vue';
-import WootModalHeader from 'dashboard/components/ModalHeader.vue';
-import FluentIcon from 'shared/components/FluentIcon/DashboardIcon.vue';
-
-const store = createStore({
-  modules: {
-    auth: {
-      namespaced: false,
-      getters: {
-        getCurrentAccountId: () => 1,
-        getCurrentUser: () => ({
-          accounts: [
-            { id: 1, name: 'Chatwoot', role: 'administrator' },
-            { id: 2, name: 'GitX', role: 'agent' },
-          ],
-        }),
-      },
-    },
-    globalConfig: {
-      namespaced: true,
-      getters: {
-        get: () => ({ createNewAccountFromDashboard: false }),
-      },
-    },
-  },
-});
-
-describe('AccountSelector', () => {
-  let accountSelector = null;
-
-  beforeEach(() => {
-    accountSelector = mount(AccountSelector, {
-      global: {
-        plugins: [store],
-        components: {
-          'woot-modal': WootModal,
-          'woot-modal-header': WootModalHeader,
-          'fluent-icon': FluentIcon,
-        },
-        stubs: {
-          // override global stub
-          WootModalHeader: false,
-        },
-      },
-      props: { showAccountModal: true },
-    });
-  });
-
-  it('title and sub title exist', () => {
-    const headerComponent = accountSelector.findComponent(WootModalHeader);
-    const title = headerComponent.find('[data-test-id="modal-header-title"]');
-    expect(title.text()).toBe('Switch account');
-    const content = headerComponent.find(
-      '[data-test-id="modal-header-content"]'
-    );
-    expect(content.text()).toBe('Select an account from the following list');
-  });
-
-  it('first account item is checked', () => {
-    const selectedAccountCheckmark = accountSelector.find(
-      '#account-1 > button > svg'
-    );
-    expect(selectedAccountCheckmark.exists()).toBe(true);
-
-    const otherAccountCheckmark = accountSelector.find(
-      '#account-2 > button > svg'
-    );
-    expect(otherAccountCheckmark.exists()).toBe(true);
-  });
-});
diff --git a/app/javascript/dashboard/components/layout/sidebarComponents/specs/AgentDetails.spec.js b/app/javascript/dashboard/components/layout/sidebarComponents/specs/AgentDetails.spec.js
deleted file mode 100644
index 7dd3e775b..000000000
--- a/app/javascript/dashboard/components/layout/sidebarComponents/specs/AgentDetails.spec.js
+++ /dev/null
@@ -1,61 +0,0 @@
-import { shallowMount } from '@vue/test-utils';
-import { createStore } from 'vuex';
-import AgentDetails from '../AgentDetails.vue';
-import Thumbnail from 'dashboard/components/widgets/Thumbnail.vue';
-import NextButton from 'dashboard/components-next/button/Button.vue';
-
-describe('AgentDetails', () => {
-  const currentUser = {
-    name: 'Neymar Junior',
-    avatar_url: '',
-    availability_status: 'online',
-  };
-  const currentRole = 'agent';
-  let store = null;
-  let agentDetails = null;
-
-  const mockTooltipDirective = {
-    mounted: (el, binding) => {
-      // You can mock the behavior here if necessary
-      el.setAttribute('data-tooltip', binding.value || '');
-    },
-  };
-
-  beforeEach(() => {
-    store = createStore({
-      modules: {
-        auth: {
-          namespaced: false,
-          getters: {
-            getCurrentUser: () => currentUser,
-            getCurrentRole: () => currentRole,
-            getCurrentUserAvailability: () => currentUser.availability_status,
-          },
-        },
-      },
-    });
-
-    agentDetails = shallowMount(AgentDetails, {
-      global: {
-        plugins: [store],
-        components: {
-          Thumbnail,
-          NextButton,
-        },
-        directives: {
-          tooltip: mockTooltipDirective, // Mocking the tooltip directive
-        },
-        stubs: { NextButton: { template: '<button><slot /></button>' } },
-      },
-    });
-  });
-
-  it('shows the correct agent status', () => {
-    expect(agentDetails.findComponent(Thumbnail).vm.status).toBe('online');
-  });
-
-  it('agent thumbnail exists', () => {
-    const thumbnailComponent = agentDetails.findComponent(Thumbnail);
-    expect(thumbnailComponent.exists()).toBe(true);
-  });
-});
diff --git a/app/javascript/dashboard/components/layout/sidebarComponents/specs/NotificationBell.spec.js b/app/javascript/dashboard/components/layout/sidebarComponents/specs/NotificationBell.spec.js
deleted file mode 100644
index 607604d48..000000000
--- a/app/javascript/dashboard/components/layout/sidebarComponents/specs/NotificationBell.spec.js
+++ /dev/null
@@ -1,88 +0,0 @@
-import { shallowMount } from '@vue/test-utils';
-import { createStore } from 'vuex';
-import FluentIcon from 'shared/components/FluentIcon/DashboardIcon.vue';
-import NotificationBell from '../NotificationBell.vue';
-
-const $route = {
-  name: 'notifications_index',
-};
-
-describe('notificationBell', () => {
-  const accountId = 1;
-  const notificationMetadata = { unreadCount: 19 };
-  let store = null;
-  let actions = null;
-  let modules = null;
-
-  beforeEach(() => {
-    actions = {
-      showNotification: vi.fn(),
-    };
-    modules = {
-      auth: {
-        namespaced: false,
-        getters: {
-          getCurrentAccountId: () => accountId,
-        },
-      },
-      notifications: {
-        namespaced: false,
-        getters: {
-          'notifications/getMeta': () => notificationMetadata,
-        },
-      },
-    };
-
-    store = createStore({
-      actions,
-      modules,
-    });
-  });
-
-  it('it should return unread count 19', () => {
-    const wrapper = shallowMount(NotificationBell, {
-      global: {
-        plugins: [store],
-        mocks: {
-          $route,
-        },
-        components: {
-          'fluent-icon': FluentIcon,
-        },
-      },
-    });
-    expect(wrapper.vm.unreadCount).toBe('19');
-  });
-
-  it('it should return unread count 99+', async () => {
-    notificationMetadata.unreadCount = 100;
-    const wrapper = shallowMount(NotificationBell, {
-      global: {
-        plugins: [store],
-        mocks: {
-          $route,
-        },
-        components: {
-          'fluent-icon': FluentIcon,
-        },
-      },
-    });
-    expect(wrapper.vm.unreadCount).toBe('99+');
-  });
-
-  it('isNotificationPanelActive', async () => {
-    const notificationBell = shallowMount(NotificationBell, {
-      global: {
-        plugins: [store],
-        mocks: {
-          $route,
-        },
-        components: {
-          'fluent-icon': FluentIcon,
-        },
-      },
-    });
-
-    expect(notificationBell.vm.isNotificationPanelActive).toBe(true);
-  });
-});
diff --git a/app/javascript/dashboard/components/layout/specs/AvailabilityStatus.spec.js b/app/javascript/dashboard/components/layout/specs/AvailabilityStatus.spec.js
deleted file mode 100644
index ccff4321a..000000000
--- a/app/javascript/dashboard/components/layout/specs/AvailabilityStatus.spec.js
+++ /dev/null
@@ -1,71 +0,0 @@
-import { mount } from '@vue/test-utils';
-import { createStore } from 'vuex';
-import AvailabilityStatus from '../AvailabilityStatus.vue';
-import NextButton from 'dashboard/components-next/button/Button.vue';
-import WootDropdownItem from 'shared/components/ui/dropdown/DropdownItem.vue';
-import WootDropdownMenu from 'shared/components/ui/dropdown/DropdownMenu.vue';
-import WootDropdownHeader from 'shared/components/ui/dropdown/DropdownHeader.vue';
-import WootDropdownDivider from 'shared/components/ui/dropdown/DropdownDivider.vue';
-import FluentIcon from 'shared/components/FluentIcon/DashboardIcon.vue';
-
-describe('AvailabilityStatus', () => {
-  const currentAvailability = 'online';
-  const currentAccountId = '1';
-  const currentUserAutoOffline = false;
-  let store = null;
-  let actions = null;
-
-  beforeEach(() => {
-    actions = {
-      updateAvailability: vi.fn(() => Promise.resolve()),
-    };
-
-    store = createStore({
-      modules: {
-        auth: {
-          namespaced: false,
-          getters: {
-            getCurrentUserAvailability: () => currentAvailability,
-            getCurrentAccountId: () => currentAccountId,
-            getCurrentUserAutoOffline: () => currentUserAutoOffline,
-          },
-        },
-      },
-      actions,
-    });
-  });
-
-  it('dispatches an action when user changes status', async () => {
-    const wrapper = mount(AvailabilityStatus, {
-      global: {
-        plugins: [store],
-        components: {
-          NextButton,
-          WootDropdownItem,
-          WootDropdownMenu,
-          WootDropdownHeader,
-          WootDropdownDivider,
-          FluentIcon,
-        },
-        stubs: {
-          WootSwitch: { template: '<button />' },
-        },
-      },
-    });
-
-    // Ensure that the dropdown menu is opened
-    await wrapper.vm.openStatusMenu();
-
-    // Simulate the user clicking the 3rd button (offline status)
-    const buttons = wrapper.findAll('.status-change--dropdown-button');
-    expect(buttons.length).toBeGreaterThan(0); // Ensure buttons exist
-
-    await buttons[2].trigger('click');
-
-    expect(actions.updateAvailability).toHaveBeenCalledTimes(1);
-    expect(actions.updateAvailability.mock.calls[0][1]).toEqual({
-      availability: 'offline',
-      account_id: currentAccountId,
-    });
-  });
-});
diff --git a/app/javascript/dashboard/components/specs/SidemenuIcon.spec.js b/app/javascript/dashboard/components/specs/SidemenuIcon.spec.js
deleted file mode 100644
index dc946369c..000000000
--- a/app/javascript/dashboard/components/specs/SidemenuIcon.spec.js
+++ /dev/null
@@ -1,31 +0,0 @@
-import { shallowMount } from '@vue/test-utils';
-import { createStore } from 'vuex';
-import SidemenuIcon from '../SidemenuIcon.vue';
-
-const store = createStore({
-  modules: {
-    auth: {
-      namespaced: false,
-      getters: {
-        getCurrentAccountId: () => 1,
-      },
-    },
-    accounts: {
-      namespaced: true,
-      getters: {
-        isFeatureEnabledonAccount: () => () => false,
-      },
-    },
-  },
-});
-
-describe('SidemenuIcon', () => {
-  test('matches snapshot', () => {
-    const wrapper = shallowMount(SidemenuIcon, {
-      stubs: { NextButton: { template: '<button><slot /></button>' } },
-      global: { plugins: [store] },
-    });
-    expect(wrapper.vm).toBeTruthy();
-    expect(wrapper.element).toMatchSnapshot();
-  });
-});
diff --git a/app/javascript/dashboard/components/specs/__snapshots__/SidemenuIcon.spec.js.snap b/app/javascript/dashboard/components/specs/__snapshots__/SidemenuIcon.spec.js.snap
deleted file mode 100644
index a5ca2af6a..000000000
--- a/app/javascript/dashboard/components/specs/__snapshots__/SidemenuIcon.spec.js.snap
+++ /dev/null
@@ -1,14 +0,0 @@
-// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
-
-exports[`SidemenuIcon > matches snapshot 1`] = `
-<button
-  class="-ml-3"
-  ghost=""
-  icon="i-lucide-menu"
-  size="sm"
-  slate=""
->
-  
-  
-</button>
-`;
diff --git a/app/javascript/dashboard/components/table/BaseCell.vue b/app/javascript/dashboard/components/table/BaseCell.vue
index 952337423..ad1e6cf83 100644
--- a/app/javascript/dashboard/components/table/BaseCell.vue
+++ b/app/javascript/dashboard/components/table/BaseCell.vue
@@ -19,6 +19,6 @@ const isRTL = useMapGetter('accounts/isRTL');
     <slot v-if="$slots.default || content">
       <template v-if="content">{{ content }}</template>
     </slot>
-    <span v-else class="text-slate-300 dark:text-slate-700"> --- </span>
+    <span v-else class="text-n-slate-10"> --- </span>
   </div>
 </template>
diff --git a/app/javascript/dashboard/components/ui/Banner.vue b/app/javascript/dashboard/components/ui/Banner.vue
index 12e292a67..6c71588f7 100644
--- a/app/javascript/dashboard/components/ui/Banner.vue
+++ b/app/javascript/dashboard/components/ui/Banner.vue
@@ -118,13 +118,13 @@ export default {
 <style lang="scss" scoped>
 .banner {
   &.primary {
-    @apply bg-woot-500 dark:bg-woot-500;
+    @apply bg-n-brand;
   }
 
   &.secondary {
     @apply bg-n-slate-3 dark:bg-n-solid-3 text-n-slate-12;
     a {
-      @apply text-slate-800 dark:text-slate-800;
+      @apply text-n-slate-12;
     }
   }
 
@@ -137,18 +137,18 @@ export default {
   }
 
   &.warning {
-    @apply bg-yellow-500 dark:bg-yellow-500 text-yellow-500 dark:text-yellow-500;
+    @apply bg-n-amber-5 text-n-amber-12;
     a {
-      @apply text-yellow-500 dark:text-yellow-500;
+      @apply text-n-amber-12;
     }
   }
 
   &.gray {
-    @apply text-black-500 dark:text-black-500;
+    @apply text-n-gray-10 dark:text-n-gray-10;
   }
 
   a {
-    @apply ml-1 underline text-white dark:text-white text-xs;
+    @apply ml-1 underline text-n-amber-12 text-xs;
   }
 
   .banner-message {
diff --git a/app/javascript/dashboard/components/ui/DatePicker/components/CalendarDateInput.vue b/app/javascript/dashboard/components/ui/DatePicker/components/CalendarDateInput.vue
index 715bc8cb3..73a41ab65 100644
--- a/app/javascript/dashboard/components/ui/DatePicker/components/CalendarDateInput.vue
+++ b/app/javascript/dashboard/components/ui/DatePicker/components/CalendarDateInput.vue
@@ -55,7 +55,7 @@ const validateDate = () => {
 
 <template>
   <div class="h-[82px] flex flex-col items-start px-5 gap-1.5 pt-4 w-full">
-    <span class="text-sm font-medium text-slate-800 dark:text-slate-50">
+    <span class="text-sm font-medium text-n-slate-12">
       {{
         calendarType === START_CALENDAR
           ? $t('DATE_PICKER.DATE_RANGE_INPUT.START')
diff --git a/app/javascript/dashboard/components/ui/DatePicker/components/DatePickerButton.vue b/app/javascript/dashboard/components/ui/DatePicker/components/DatePickerButton.vue
index d1fa42630..950a9f020 100644
--- a/app/javascript/dashboard/components/ui/DatePicker/components/DatePickerButton.vue
+++ b/app/javascript/dashboard/components/ui/DatePicker/components/DatePickerButton.vue
@@ -51,21 +51,13 @@ const openDatePicker = () => {
     class="inline-flex relative items-center rounded-lg gap-2 py-1.5 px-3 h-8 bg-n-alpha-2 hover:bg-n-alpha-1 active:bg-n-alpha-1"
     @click="openDatePicker"
   >
-    <fluent-icon
-      class="text-slate-800 dark:text-slate-50"
-      icon="calendar"
-      size="16"
-    />
-    <span class="text-sm font-medium text-slate-800 dark:text-slate-50">
+    <fluent-icon class="text-n-slate-12" icon="calendar" size="16" />
+    <span class="text-sm font-medium text-n-slate-12">
       {{ $t(activeDateRange) }}
     </span>
-    <span class="text-sm font-medium text-slate-600 dark:text-slate-200">
+    <span class="text-sm font-medium text-n-slate-11">
       {{ formatDateRange }}
     </span>
-    <fluent-icon
-      class="text-slate-800 dark:text-slate-50"
-      icon="chevron-down"
-      size="14"
-    />
+    <fluent-icon class="text-n-slate-12" icon="chevron-down" size="14" />
   </button>
 </template>
diff --git a/app/javascript/dashboard/components/ui/HelperTextPopup.vue b/app/javascript/dashboard/components/ui/HelperTextPopup.vue
index eed0e2755..88be9960b 100644
--- a/app/javascript/dashboard/components/ui/HelperTextPopup.vue
+++ b/app/javascript/dashboard/components/ui/HelperTextPopup.vue
@@ -12,12 +12,12 @@ defineProps({
     <fluent-icon
       icon="info"
       size="14"
-      class="mt-0.5 text-slate-600 absolute dark:text-slate-400"
+      class="mt-0.5 text-n-slate-11 absolute"
     />
     <div
-      class="bg-white dark:bg-slate-900 w-fit ltr:left-4 rtl:right-4 top-0 border p-2.5 group-hover:flex items-center hidden absolute border-slate-75 dark:border-slate-800 rounded-lg shadow-md"
+      class="bg-n-background w-fit ltr:left-4 rtl:right-4 top-0 border p-2.5 group-hover:flex items-center hidden absolute border-n-weak rounded-lg shadow-md"
     >
-      <p class="text-slate-800 dark:text-slate-75 mb-0 text-xs">
+      <p class="text-n-slate-12 mb-0 text-xs">
         {{ message }}
       </p>
     </div>
diff --git a/app/javascript/dashboard/components/ui/Label.vue b/app/javascript/dashboard/components/ui/Label.vue
index 96e08fd7b..6c02c3629 100644
--- a/app/javascript/dashboard/components/ui/Label.vue
+++ b/app/javascript/dashboard/components/ui/Label.vue
@@ -113,7 +113,7 @@ export default {
 
 <style scoped lang="scss">
 .label {
-  @apply items-center font-medium text-xs rounded-[4px] gap-1 p-1 bg-slate-50 dark:bg-slate-700 text-slate-800 dark:text-slate-100 border border-solid border-n-strong h-6;
+  @apply items-center font-medium text-xs rounded-[4px] gap-1 p-1 bg-n-slate-3 text-n-slate-12 border border-solid border-n-strong h-6;
 
   &.small {
     @apply text-xs py-0.5 px-1 leading-tight h-5;
@@ -133,67 +133,71 @@ export default {
 
   /* Color Schemes */
   &.primary {
-    @apply bg-woot-100 dark:bg-woot-100 text-woot-900 dark:text-woot-900 border border-solid border-woot-200;
+    @apply bg-n-blue-5 text-n-blue-12 border border-solid border-n-blue-7;
 
     a {
-      @apply text-woot-900 dark:text-woot-900;
+      @apply text-n-blue-12;
     }
     .label-color-dot {
-      @apply bg-woot-600 dark:bg-woot-600;
+      @apply bg-n-blue-9;
     }
   }
   &.secondary {
-    @apply bg-slate-100 dark:bg-slate-700 text-slate-900 dark:text-slate-100 border border-solid border-n-weak;
+    @apply bg-n-slate-5 text-n-slate-12 border border-solid border-n-slate-7;
 
     a {
-      @apply text-slate-900 dark:text-slate-100;
+      @apply text-n-slate-12;
     }
     .label-color-dot {
-      @apply bg-slate-600 dark:bg-slate-600;
+      @apply bg-n-slate-9;
     }
   }
   &.success {
-    @apply bg-green-100 dark:bg-green-700 text-green-900 dark:text-green-100 border border-solid border-green-200 dark:border-green-600;
+    @apply bg-n-teal-5 text-n-teal-12 border border-solid border-n-teal-7;
 
     a {
-      @apply text-green-900 dark:text-green-100;
+      @apply text-n-teal-12;
     }
     .label-color-dot {
-      @apply bg-green-600 dark:bg-green-600;
+      @apply bg-n-teal-9;
     }
   }
   &.alert {
-    @apply bg-red-100 dark:bg-red-700 text-red-900 dark:text-red-100 border border-solid border-red-200 dark:border-red-600;
+    @apply bg-n-ruby-5 text-n-ruby-12 border border-solid border-n-ruby-7;
 
     a {
-      @apply text-red-900 dark:text-red-100;
+      @apply text-n-ruby-12;
     }
     .label-color-dot {
-      @apply bg-red-600 dark:bg-red-600;
+      @apply bg-n-ruby-9;
     }
   }
   &.warning {
-    @apply bg-yellow-100 dark:bg-yellow-700 text-yellow-900 dark:text-yellow-100 border border-solid border-yellow-200 dark:border-yellow-600;
+    @apply bg-n-amber-5 text-n-amber-12 border border-solid border-n-amber-7;
 
     a {
-      @apply text-yellow-900 dark:text-yellow-100;
+      @apply text-n-amber-12;
     }
     .label-color-dot {
-      @apply bg-yellow-900 dark:bg-yellow-900;
+      @apply bg-n-amber-9;
     }
   }
 
   &.smooth {
-    @apply bg-transparent text-slate-700 dark:text-slate-100 border border-solid border-n-strong;
+    @apply bg-transparent text-n-slate-11 dark:text-n-slate-12 border border-solid border-n-strong;
   }
 
   &.dashed {
-    @apply bg-transparent text-slate-700 dark:text-slate-100 border border-dashed border-n-strong;
+    @apply bg-transparent text-n-slate-11 dark:text-n-slate-12 border border-dashed border-n-strong;
   }
 }
 
 .label-close--button {
-  @apply text-slate-800 dark:text-slate-100 -mb-0.5 rounded-sm cursor-pointer flex items-center justify-center hover:bg-slate-100 dark:hover:bg-slate-700;
+  @apply text-n-slate-11 -mb-0.5 rounded-sm cursor-pointer flex items-center justify-center hover:bg-n-slate-3;
+
+  svg {
+    @apply text-n-slate-11;
+  }
 }
 
 .label-action--button {
diff --git a/app/javascript/dashboard/components/ui/PreviewCard.vue b/app/javascript/dashboard/components/ui/PreviewCard.vue
index 1c90ce956..4baa362b0 100644
--- a/app/javascript/dashboard/components/ui/PreviewCard.vue
+++ b/app/javascript/dashboard/components/ui/PreviewCard.vue
@@ -23,16 +23,17 @@ export default {
 
 <template>
   <div
-    class="flex flex-col min-w-[15rem] max-h-[21.25rem] max-w-[23.75rem] rounded-md border border-solid border-n-strong"
+    class="flex flex-col min-w-[15rem] max-h-[21.25rem] max-w-[23.75rem] rounded-md border border-solid"
     :class="{
-      'bg-woot-25 dark:bg-n-solid-2 border border-solid border-n-blue-border':
-        active,
+      'bg-n-blue-1 dark:bg-n-solid-2 border-n-blue-4': active,
+      'border-n-weak': !active,
     }"
   >
     <div
-      class="flex justify-between items-center rounded-t-md px-2 w-full h-10 bg-slate-50 dark:bg-slate-900 border-b border-solid border-n-strong"
+      class="flex justify-between items-center rounded-t-md px-2 w-full h-10 border-b border-solid"
       :class="{
-        'bg-woot-50 border-b border-solid border-n-blue-border': active,
+        'bg-n-blue-2 border-n-blue-4': active,
+        'bg-n-slate-2 border-n-weak': !active,
       }"
     >
       <div class="flex items-center p-1 text-sm font-medium">{{ heading }}</div>
@@ -41,23 +42,19 @@ export default {
         icon="checkmark-circle"
         type="solid"
         size="24"
-        class="text-woot-500 dark:text-woot-500"
+        class="text-n-brand"
       />
     </div>
     <div
-      class="text-slate-700 dark:text-slate-200 text-xs leading-[1.4] px-3 pt-3 pb-0 text-start"
+      class="text-n-slate-11 text-xs leading-[1.4] px-3 pt-3 pb-0 text-start"
     >
       {{ content }}
     </div>
     <div v-if="src" class="p-3">
       <img
         :src="src"
-        class="border border-solid rounded-md"
-        :class="
-          active
-            ? 'border-woot-75 dark:border-woot-700'
-            : 'border-slate-50 dark:border-slate-600'
-        "
+        class="border rounded-md"
+        :class="active ? 'border-n-blue-border' : 'border-n-weak'"
       />
     </div>
     <slot v-else />
diff --git a/app/javascript/dashboard/components/ui/Switch.vue b/app/javascript/dashboard/components/ui/Switch.vue
index b4398baf8..14cdad521 100644
--- a/app/javascript/dashboard/components/ui/Switch.vue
+++ b/app/javascript/dashboard/components/ui/Switch.vue
@@ -29,11 +29,11 @@ export default {
 
 <style lang="scss" scoped>
 .toggle-button {
-  @apply bg-slate-200 dark:bg-slate-600;
+  @apply bg-n-slate-5;
   --toggle-button-box-shadow: rgb(255, 255, 255) 0px 0px 0px 0px,
     rgba(59, 130, 246, 0.5) 0px 0px 0px 0px, rgba(0, 0, 0, 0.1) 0px 1px 3px 0px,
     rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
-  border-radius: var(--border-radius-large);
+  border-radius: 0.5625rem;
   border: 2px solid transparent;
   cursor: pointer;
   display: flex;
@@ -46,7 +46,7 @@ export default {
   width: 2.125rem;
 
   &.active {
-    background-color: var(--w-500);
+    @apply bg-n-brand;
   }
 
   &.small {
@@ -54,30 +54,29 @@ export default {
     height: 0.875rem;
 
     span {
-      height: var(--space-one);
-      width: var(--space-one);
+      @apply size-2.5;
 
       &.active {
-        transform: translate(var(--space-small), var(--space-zero));
+        @apply ltr:translate-x-[0.5rem] ltr:translate-y-0 rtl:translate-x-[-0.5rem] rtl:translate-y-0;
       }
     }
   }
 
   span {
-    @apply bg-white dark:bg-slate-900;
-    --space-one-point-five: 0.9375rem;
+    @apply bg-n-background;
+
     border-radius: 100%;
     box-shadow: var(--toggle-button-box-shadow);
     display: inline-block;
-    height: var(--space-one-point-five);
+    height: 0.9375rem;
     transform: translate(0, 0);
     transition-duration: 200ms;
     transition-property: transform;
     transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
-    width: var(--space-one-point-five);
+    width: 0.9375rem;
 
     &.active {
-      transform: translate(var(--space-one-point-five), var(--space-zero));
+      @apply ltr:translate-x-[0.9375rem] ltr:translate-y-0 rtl:translate-x-[-0.9375rem] rtl:translate-y-0;
     }
   }
 }
diff --git a/app/javascript/dashboard/components/ui/Tabs/Tabs.vue b/app/javascript/dashboard/components/ui/Tabs/Tabs.vue
index 7a2b5054d..004eb31b1 100644
--- a/app/javascript/dashboard/components/ui/Tabs/Tabs.vue
+++ b/app/javascript/dashboard/components/ui/Tabs/Tabs.vue
@@ -11,10 +11,6 @@ const props = defineProps({
     type: Boolean,
     default: true,
   },
-  isCompact: {
-    type: Boolean,
-    default: false,
-  },
 });
 
 const emit = defineEmits(['change']);
@@ -70,25 +66,28 @@ watch(
 <template>
   <div
     ref="tabsContainer"
-    :class="{
-      'tabs--container--with-border': border,
-      'tabs--container--compact': isCompact,
-    }"
-    class="tabs--container"
+    class="flex"
+    :class="[border && 'border-b border-b-n-weak']"
   >
     <button
       v-if="hasScroll"
-      class="tabs--scroll-button button clear secondary button--only-icon"
+      class="items-center rounded-none cursor-pointer flex h-auto justify-center min-w-8"
       @click="onScrollClick('left')"
     >
       <fluent-icon icon="chevron-left" :size="16" />
     </button>
-    <ul ref="tabsList" :class="{ 'tabs--with-scroll': hasScroll }" class="tabs">
+    <ul
+      ref="tabsList"
+      class="border-r-0 border-l-0 border-t-0 flex min-w-[6.25rem] py-0 px-4 list-none mb-0"
+      :class="
+        hasScroll ? 'overflow-hidden py-0 px-1 max-w-[calc(100%-64px)]' : ''
+      "
+    >
       <slot />
     </ul>
     <button
       v-if="hasScroll"
-      class="tabs--scroll-button button clear secondary button--only-icon"
+      class="items-center rounded-none cursor-pointer flex h-auto justify-center min-w-8"
       @click="onScrollClick('right')"
     >
       <fluent-icon icon="chevron-right" :size="16" />
diff --git a/app/javascript/dashboard/components/ui/Tabs/TabsItem.vue b/app/javascript/dashboard/components/ui/Tabs/TabsItem.vue
index 8936bec2e..aa959a4fa 100644
--- a/app/javascript/dashboard/components/ui/Tabs/TabsItem.vue
+++ b/app/javascript/dashboard/components/ui/Tabs/TabsItem.vue
@@ -22,6 +22,10 @@ const props = defineProps({
     type: Boolean,
     default: true,
   },
+  isCompact: {
+    type: Boolean,
+    default: false,
+  },
 });
 
 const activeIndex = inject('activeIndex');
@@ -40,14 +44,28 @@ const onTabClick = event => {
 
 <template>
   <li
-    class="tabs-title"
-    :class="{
-      'is-active': active,
-    }"
+    class="flex-shrink-0 my-0 mx-2 ltr:first:ml-0 rtl:first:mr-0 ltr:last:mr-0 rtl:last:ml-0 hover:text-n-slate-12"
   >
-    <a @click="onTabClick">
+    <a
+      class="flex items-center flex-row border-b select-none cursor-pointer text-sm relative top-[1px] transition-[border-color] duration-[150ms] ease-[cubic-bezier(0.37,0,0.63,1)]"
+      :class="[
+        active
+          ? 'border-b border-n-brand text-n-blue-text'
+          : 'border-transparent text-n-slate-11',
+        isCompact ? 'py-2 text-sm' : 'text-base py-3',
+      ]"
+      @click="onTabClick"
+    >
       {{ name }}
-      <div v-if="showBadge" class="badge min-w-[20px]">
+      <div
+        v-if="showBadge"
+        class="rounded-md h-5 flex items-center justify-center text-xxs font-semibold my-0 mx-1 px-1 py-0 min-w-[20px]"
+        :class="[
+          active
+            ? 'bg-n-brand/10 dark:bg-n-brand/20 text-n-blue-text'
+            : 'bg-n-alpha-black2 dark:bg-n-solid-3 text-n-slate-11',
+        ]"
+      >
         <span>
           {{ getItemCount }}
         </span>
diff --git a/app/javascript/dashboard/components/ui/TimeAgo.vue b/app/javascript/dashboard/components/ui/TimeAgo.vue
index 6cf3202d6..9b1ee75db 100644
--- a/app/javascript/dashboard/components/ui/TimeAgo.vue
+++ b/app/javascript/dashboard/components/ui/TimeAgo.vue
@@ -113,7 +113,7 @@ export default {
       delay: { show: 1000, hide: 0 },
       hideOnClick: true,
     }"
-    class="ml-auto leading-4 text-xxs text-n-slate-10 hover:text-slate-11"
+    class="ml-auto leading-4 text-xxs text-n-slate-10 hover:text-n-slate-11"
   >
     <span>{{ `${createdAtTime} • ${lastActivityTime}` }}</span>
   </div>
diff --git a/app/javascript/dashboard/components/ui/Wizard.vue b/app/javascript/dashboard/components/ui/Wizard.vue
index cef85b193..2219a07c1 100644
--- a/app/javascript/dashboard/components/ui/Wizard.vue
+++ b/app/javascript/dashboard/components/ui/Wizard.vue
@@ -44,21 +44,18 @@ export default {
     >
       <div class="flex items-center">
         <h3
-          class="text-slate-800 dark:text-slate-100 text-base font-medium pl-6 overflow-hidden whitespace-nowrap mb-1.5 text-ellipsis leading-tight"
+          class="text-n-slate-12 text-base font-medium pl-6 overflow-hidden whitespace-nowrap mt-0.5 text-ellipsis leading-tight"
         >
           {{ item.title }}
         </h3>
-        <span
-          v-if="isOver(item)"
-          class="ml-1 text-green-500 dark:text-green-500"
-        >
+        <span v-if="isOver(item)" class="mx-1 mt-0.5 text-n-teal-9">
           <fluent-icon icon="checkmark" />
         </span>
       </div>
       <span class="step">
         {{ items.indexOf(item) + 1 }}
       </span>
-      <p class="pl-6 m-0 text-sm text-slate-600 dark:text-slate-300">
+      <p class="pl-6 m-0 mt-1.5 text-sm text-n-slate-11">
         {{ item.body }}
       </p>
     </div>
@@ -68,7 +65,7 @@ export default {
 <style lang="scss" scoped>
 .wizard-box {
   .item {
-    @apply cursor-pointer after:bg-slate-75 before:bg-slate-75 dark:after:bg-slate-600 dark:before:bg-slate-600 py-4 ltr:pr-4 rtl:pl-4 ltr:pl-6 rtl:pr-6 relative before:h-4 before:top-0 last:before:h-0 first:before:h-0 last:after:h-0 before:content-[''] before:absolute before:w-0.5 after:content-[''] after:h-full after:absolute after:top-5 after:w-0.5 rtl:after:left-6 rtl:before:left-6;
+    @apply cursor-pointer after:bg-n-slate-6 before:bg-n-slate-6 py-4 ltr:pr-4 rtl:pl-4 ltr:pl-6 rtl:pr-6 relative before:h-4 before:top-0 last:before:h-0 first:before:h-0 last:after:h-0 before:content-[''] before:absolute before:w-0.5 after:content-[''] after:h-full after:absolute after:top-5 after:w-0.5 rtl:after:left-6 rtl:before:left-6;
 
     &.active {
       h3 {
@@ -97,7 +94,7 @@ export default {
     }
 
     .step {
-      @apply bg-slate-75 dark:bg-slate-600 rounded-2xl font-medium w-4 left-4 leading-4 z-10 absolute text-center text-white dark:text-white text-xxs top-5;
+      @apply bg-n-slate-7 rounded-2xl font-medium w-4 left-4 leading-4 z-10 absolute text-center text-white dark:text-white text-xxs top-5;
     }
   }
 }
diff --git a/app/javascript/dashboard/components/widgets/AIAssistanceCTAButton.vue b/app/javascript/dashboard/components/widgets/AIAssistanceCTAButton.vue
index 2eef79d2a..6fbdfe6e7 100644
--- a/app/javascript/dashboard/components/widgets/AIAssistanceCTAButton.vue
+++ b/app/javascript/dashboard/components/widgets/AIAssistanceCTAButton.vue
@@ -19,10 +19,10 @@ const onClick = () => {
     />
 
     <div
-      class="radar-ping-animation absolute top-0 right-0 -mt-1 -mr-1 rounded-full w-3 h-3 bg-woot-500 dark:bg-woot-500"
+      class="radar-ping-animation absolute top-0 right-0 -mt-1 -mr-1 rounded-full w-3 h-3 bg-n-brand"
     />
     <div
-      class="absolute top-0 right-0 -mt-1 -mr-1 rounded-full w-3 h-3 bg-woot-500 dark:bg-woot-500 opacity-50"
+      class="absolute top-0 right-0 -mt-1 -mr-1 rounded-full w-3 h-3 bg-n-brand opacity-50"
     />
   </div>
 </template>
diff --git a/app/javascript/dashboard/components/widgets/AIAssistanceModal.vue b/app/javascript/dashboard/components/widgets/AIAssistanceModal.vue
index 395d49334..04bba8f59 100644
--- a/app/javascript/dashboard/components/widgets/AIAssistanceModal.vue
+++ b/app/javascript/dashboard/components/widgets/AIAssistanceModal.vue
@@ -70,11 +70,11 @@ export default {
       @submit.prevent="applyText"
     >
       <div v-if="draftMessage" class="w-full">
-        <h4 class="mt-1 text-base text-slate-700 dark:text-slate-100">
+        <h4 class="mt-1 text-base text-n-slate-12">
           {{ $t('INTEGRATION_SETTINGS.OPEN_AI.ASSISTANCE_MODAL.DRAFT_TITLE') }}
         </h4>
         <p v-dompurify-html="formatMessage(draftMessage, false)" />
-        <h4 class="mt-1 text-base text-slate-700 dark:text-slate-100">
+        <h4 class="mt-1 text-base text-n-slate-12">
           {{
             $t('INTEGRATION_SETTINGS.OPEN_AI.ASSISTANCE_MODAL.GENERATED_TITLE')
           }}
diff --git a/app/javascript/dashboard/components/widgets/AILoader.vue b/app/javascript/dashboard/components/widgets/AILoader.vue
index ad6735251..66826b3a3 100644
--- a/app/javascript/dashboard/components/widgets/AILoader.vue
+++ b/app/javascript/dashboard/components/widgets/AILoader.vue
@@ -22,23 +22,15 @@
     gap: 4px;
 
     .ai-typing--icon {
-      color: var(--v-500);
+      @apply text-n-iris-11;
     }
   }
   label {
-    display: inline-block;
-    margin-right: var(--space-smaller);
-    color: var(--v-400);
+    @apply text-n-iris-11 ltr:mr-1 rtl:ml-1 inline-block;
   }
   .loader {
-    display: inline-block;
-    width: 6px;
-    height: 6px;
-    margin-right: var(--space-smaller);
-    margin-top: var(--space-slab);
-    background-color: var(--v-300);
-    border-radius: 50%;
     animation: bubble-scale 1.2s infinite;
+    @apply bg-n-iris-11 inline-block size-1.5 ltr:mr-1 rtl:ml-1 mt-3 rounded-full;
   }
 
   .loader:nth-child(2) {
diff --git a/app/javascript/dashboard/components/widgets/AttachmentsPreview.vue b/app/javascript/dashboard/components/widgets/AttachmentsPreview.vue
index 299a2ad5a..75afb5263 100644
--- a/app/javascript/dashboard/components/widgets/AttachmentsPreview.vue
+++ b/app/javascript/dashboard/components/widgets/AttachmentsPreview.vue
@@ -50,7 +50,7 @@ const fileName = file => {
     <div
       v-for="(attachment, index) in nonRecordedAudioAttachments"
       :key="attachment.id"
-      class="preview-item flex items-center p-1 bg-slate-50 dark:bg-slate-800 gap-1 rounded-md w-[15rem] mb-1"
+      class="flex items-center p-1 bg-n-slate-3 gap-1 rounded-md w-[15rem] mb-1"
     >
       <div class="max-w-[4rem] flex-shrink-0 w-6 flex items-center">
         <img
diff --git a/app/javascript/dashboard/components/widgets/AutomationActionInput.vue b/app/javascript/dashboard/components/widgets/AutomationActionInput.vue
index 9bc197f25..f59b12dda 100644
--- a/app/javascript/dashboard/components/widgets/AutomationActionInput.vue
+++ b/app/javascript/dashboard/components/widgets/AutomationActionInput.vue
@@ -266,11 +266,11 @@ export default {
   @apply flex items-center justify-center relative my-2.5 mx-0;
 
   .operator__line {
-    @apply absolute w-full border-b border-solid border-slate-75 dark:border-slate-600;
+    @apply absolute w-full border-b border-solid border-n-weak;
   }
 
   .operator__select {
-    margin-bottom: var(--space-zero) !important;
+    margin-bottom: 0 !important;
     @apply relative w-auto;
   }
 }
diff --git a/app/javascript/dashboard/components/widgets/AutomationActionTeamMessageInput.vue b/app/javascript/dashboard/components/widgets/AutomationActionTeamMessageInput.vue
index f5de79044..275b292d0 100644
--- a/app/javascript/dashboard/components/widgets/AutomationActionTeamMessageInput.vue
+++ b/app/javascript/dashboard/components/widgets/AutomationActionTeamMessageInput.vue
@@ -56,9 +56,9 @@ export default {
 
 <style scoped>
 .multiselect {
-  margin: var(--space-smaller) var(--space-zero);
+  margin: 0.25rem 0;
 }
 textarea {
-  margin-bottom: var(--space-zero);
+  margin-bottom: 0;
 }
 </style>
diff --git a/app/javascript/dashboard/components/widgets/AutomationFileInput.vue b/app/javascript/dashboard/components/widgets/AutomationFileInput.vue
index 1298c1da4..1eff406bf 100644
--- a/app/javascript/dashboard/components/widgets/AutomationFileInput.vue
+++ b/app/javascript/dashboard/components/widgets/AutomationFileInput.vue
@@ -79,13 +79,13 @@ input[type='file'] {
   @apply hidden;
 }
 .input-wrapper {
-  @apply flex h-9 bg-white dark:bg-slate-900 py-1 px-2 items-center text-xs cursor-pointer rounded-sm border border-dashed border-woot-100 dark:border-woot-500;
+  @apply flex h-9 bg-n-background py-1 px-2 items-center text-xs cursor-pointer rounded-sm border border-dashed border-n-strong;
 }
 .success-icon {
-  @apply text-green-500 dark:text-green-600 mr-2;
+  @apply text-n-teal-9 mr-2;
 }
 .error-icon {
-  @apply text-red-500 dark:text-red-600 mr-2;
+  @apply text-n-ruby-9 mr-2;
 }
 
 .processing {
diff --git a/app/javascript/dashboard/components/widgets/Avatar.vue b/app/javascript/dashboard/components/widgets/Avatar.vue
index 2c7ad01c0..9ccb87bf8 100644
--- a/app/javascript/dashboard/components/widgets/Avatar.vue
+++ b/app/javascript/dashboard/components/widgets/Avatar.vue
@@ -50,6 +50,6 @@ export default {
   }
 }
 .avatar-container {
-  @apply flex leading-[100%] font-medium items-center justify-center text-center cursor-default avatar-color dark:dark-avatar-color text-woot-600 dark:text-woot-200;
+  @apply flex leading-[100%] font-medium items-center justify-center text-center cursor-default avatar-color dark:dark-avatar-color text-n-blue-text;
 }
 </style>
diff --git a/app/javascript/dashboard/components/widgets/ChatTypeTabs.vue b/app/javascript/dashboard/components/widgets/ChatTypeTabs.vue
index 26fa7466a..da56b54af 100644
--- a/app/javascript/dashboard/components/widgets/ChatTypeTabs.vue
+++ b/app/javascript/dashboard/components/widgets/ChatTypeTabs.vue
@@ -48,26 +48,17 @@ useKeyboardEvents(keyboardEvents);
 <template>
   <woot-tabs
     :index="activeTabIndex"
-    class="w-full px-3 -mt-1 py-0 tab--chat-type"
+    class="w-full px-3 -mt-1 py-0 [&_ul]:p-0"
     @change="onTabChange"
   >
     <woot-tabs-item
       v-for="(item, index) in items"
       :key="item.key"
-      class="text-sm"
+      class="text-sm [&_a]:font-medium"
       :index="index"
       :name="item.name"
       :count="item.count"
+      is-compact
     />
   </woot-tabs>
 </template>
-
-<style scoped lang="scss">
-.tab--chat-type {
-  ::v-deep {
-    .tabs {
-      @apply p-0;
-    }
-  }
-}
-</style>
diff --git a/app/javascript/dashboard/components/widgets/ColorPicker.vue b/app/javascript/dashboard/components/widgets/ColorPicker.vue
index 3a9c8e7ad..37637398e 100644
--- a/app/javascript/dashboard/components/widgets/ColorPicker.vue
+++ b/app/javascript/dashboard/components/widgets/ColorPicker.vue
@@ -52,19 +52,16 @@ export default {
 </template>
 
 <style scoped lang="scss">
-@import 'dashboard/assets/scss/variables';
-@import 'dashboard/assets/scss/mixins';
-
 .colorpicker {
   position: relative;
 }
 
 .colorpicker--selected {
-  @apply border border-solid border-slate-50 dark:border-slate-600 rounded cursor-pointer h-8 w-8 mb-4;
+  @apply border border-solid border-n-weak rounded cursor-pointer h-8 w-8 mb-4;
 }
 
 .colorpicker--chrome.vc-chrome {
-  @apply shadow-lg -mt-2.5 absolute z-[9999] border border-solid border-slate-75 dark:border-slate-600 rounded;
+  @apply shadow-lg -mt-2.5 absolute z-[9999] border border-solid border-n-weak rounded;
 
   ::v-deep {
     input {
diff --git a/app/javascript/dashboard/components/widgets/EmptyState.vue b/app/javascript/dashboard/components/widgets/EmptyState.vue
index 810704131..800b35f28 100644
--- a/app/javascript/dashboard/components/widgets/EmptyState.vue
+++ b/app/javascript/dashboard/components/widgets/EmptyState.vue
@@ -17,7 +17,7 @@ export default {
     </h3>
     <p
       v-if="message"
-      class="block text-center text-n-slate-11 dark:text-slate-400 my-4 mx-auto w-[90%]"
+      class="block text-center text-n-slate-11 my-4 mx-auto w-[90%]"
     >
       {{ message }}
     </p>
diff --git a/app/javascript/dashboard/components/widgets/FilterInput/Index.vue b/app/javascript/dashboard/components/widgets/FilterInput/Index.vue
index f6011c4ad..9e9e5bc4b 100644
--- a/app/javascript/dashboard/components/widgets/FilterInput/Index.vue
+++ b/app/javascript/dashboard/components/widgets/FilterInput/Index.vue
@@ -264,12 +264,10 @@ export default {
       v-if="showQueryOperator"
       class="flex items-center justify-center relative my-2.5 mx-0"
     >
-      <hr
-        class="absolute w-full border-b border-solid border-slate-75 dark:border-slate-800"
-      />
+      <hr class="absolute w-full border-b border-solid border-n-weak" />
       <select
         v-model="query_operator"
-        class="relative w-auto mb-0 bg-white dark:bg-slate-900 text-slate-800 dark:text-slate-100 border-slate-75 dark:border-slate-600"
+        class="relative w-auto mb-0 bg-n-background text-n-slate-12 border-n-weak"
       >
         <option value="and">
           {{ $t('FILTER.QUERY_DROPDOWN_LABELS.AND') }}
@@ -285,7 +283,7 @@ export default {
 <style lang="scss" scoped>
 .filter__answer--wrap {
   input {
-    @apply bg-white dark:bg-slate-900 mb-0 text-slate-800 dark:text-slate-100 border-slate-75 dark:border-slate-600;
+    @apply bg-n-background mb-0 text-n-slate-12 border-n-weak;
   }
 }
 
diff --git a/app/javascript/dashboard/components/widgets/LoadingState.vue b/app/javascript/dashboard/components/widgets/LoadingState.vue
index dfba6b43e..b68cd2b6c 100644
--- a/app/javascript/dashboard/components/widgets/LoadingState.vue
+++ b/app/javascript/dashboard/components/widgets/LoadingState.vue
@@ -1,20 +1,20 @@
-<script>
-export default {
-  props: {
-    message: { type: String, default: '' },
-  },
-};
+<script setup>
+import Spinner from 'dashboard/components-next/spinner/Spinner.vue';
+
+defineProps({
+  message: { type: String, default: '' },
+});
 </script>
 
 <template>
   <div class="flex items-center justify-center p-8">
     <h6
-      class="flex items-center gap-2 text-base text-center w-100 text-slate-800 dark:text-slate-300"
+      class="flex items-center gap-3 text-base text-center w-100 text-n-slate-11"
     >
-      <span class="text-base font-medium text-slate-800 dark:text-slate-100">
+      <span class="text-base font-medium text-n-slate-12">
         {{ message }}
       </span>
-      <span class="spinner" />
+      <Spinner class="text-n-brand" />
     </h6>
   </div>
 </template>
diff --git a/app/javascript/dashboard/components/widgets/SettingIntroBanner.vue b/app/javascript/dashboard/components/widgets/SettingIntroBanner.vue
index 60a22353f..4f7668604 100644
--- a/app/javascript/dashboard/components/widgets/SettingIntroBanner.vue
+++ b/app/javascript/dashboard/components/widgets/SettingIntroBanner.vue
@@ -16,13 +16,10 @@ export default {
 <template>
   <div class="border-b border-solid border-n-weak/60">
     <div class="max-w-6xl w-full mx-auto pt-4 pb-0 px-8">
-      <h2 class="text-2xl text-slate-800 dark:text-slate-100 mb-1 font-medium">
+      <h2 class="text-2xl text-n-slate-12 mb-1 font-medium">
         {{ headerTitle }}
       </h2>
-      <p
-        v-if="headerContent"
-        class="w-full text-slate-600 dark:text-slate-300 text-sm mb-2"
-      >
+      <p v-if="headerContent" class="w-full text-n-slate-11 text-sm mb-2">
         {{ headerContent }}
       </p>
       <slot />
diff --git a/app/javascript/dashboard/components/widgets/ShowMore.vue b/app/javascript/dashboard/components/widgets/ShowMore.vue
index fbc09cb6a..ca0ef36a7 100644
--- a/app/javascript/dashboard/components/widgets/ShowMore.vue
+++ b/app/javascript/dashboard/components/widgets/ShowMore.vue
@@ -37,7 +37,7 @@ const toggleShowMore = () => {
     {{ textToBeDisplayed }}
     <button
       v-if="text.length > limit"
-      class="text-woot-500 !p-0 !border-0 align-top"
+      class="text-n-brand !p-0 !border-0 align-top"
       @click="toggleShowMore"
     >
       {{ buttonLabel }}
diff --git a/app/javascript/dashboard/components/widgets/TableFooterResults.vue b/app/javascript/dashboard/components/widgets/TableFooterResults.vue
index 23a3c3a0d..2e3875cad 100644
--- a/app/javascript/dashboard/components/widgets/TableFooterResults.vue
+++ b/app/javascript/dashboard/components/widgets/TableFooterResults.vue
@@ -16,7 +16,7 @@ defineProps({
 </script>
 
 <template>
-  <span class="text-sm text-slate-700 dark:text-slate-200 font-medium">
+  <span class="text-sm text-n-slate-11 font-medium">
     {{
       $t('GENERAL.SHOWING_RESULTS', {
         firstIndex,
diff --git a/app/javascript/dashboard/components/widgets/Thumbnail.vue b/app/javascript/dashboard/components/widgets/Thumbnail.vue
index 5998dd338..3111212aa 100644
--- a/app/javascript/dashboard/components/widgets/Thumbnail.vue
+++ b/app/javascript/dashboard/components/widgets/Thumbnail.vue
@@ -93,7 +93,7 @@ export default {
     },
     thumbnailClass() {
       const className = this.hasBorder
-        ? 'border border-solid border-white dark:border-slate-700/50'
+        ? 'border border-solid border-white dark:border-n-weak'
         : '';
       const variant =
         this.variant === 'circle' ? 'thumbnail-rounded' : 'thumbnail-square';
@@ -183,7 +183,7 @@ export default {
   .user-thumbnail {
     border-radius: 50%;
     &.thumbnail-square {
-      border-radius: var(--border-radius-large);
+      border-radius: 0.5625rem;
     }
     height: 100%;
     width: 100%;
@@ -193,20 +193,16 @@ export default {
   }
 
   .source-badge {
-    border-radius: var(--border-radius-small);
-    bottom: var(--space-minus-micro);
-    box-shadow: var(--shadow-small);
-    height: var(--space-slab);
-    padding: var(--space-micro);
+    border-radius: 0.1875rem;
+    bottom: -0.125rem;
+    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
     position: absolute;
     right: 0;
-    width: var(--space-slab);
-    @apply bg-white dark:bg-slate-900;
+    @apply bg-n-background p-0.5 size-3;
   }
 
   .user-online-status {
-    border-radius: 50%;
-    bottom: var(--space-micro);
+    @apply bottom-0.5 rounded-full;
 
     &:after {
       content: ' ';
@@ -214,15 +210,15 @@ export default {
   }
 
   .user-online-status--online {
-    @apply bg-green-400 dark:bg-green-400;
+    @apply bg-n-teal-10;
   }
 
   .user-online-status--busy {
-    @apply bg-yellow-500 dark:bg-yellow-500;
+    @apply bg-n-amber-10;
   }
 
   .user-online-status--offline {
-    @apply bg-slate-500 dark:bg-slate-500;
+    @apply bg-n-slate-10;
   }
 }
 </style>
diff --git a/app/javascript/dashboard/components/widgets/ThumbnailGroup.vue b/app/javascript/dashboard/components/widgets/ThumbnailGroup.vue
index 5f35f62fa..e25025e17 100644
--- a/app/javascript/dashboard/components/widgets/ThumbnailGroup.vue
+++ b/app/javascript/dashboard/components/widgets/ThumbnailGroup.vue
@@ -60,31 +60,19 @@ export default {
 
 .overlapping-thumbnail {
   position: relative;
-  box-shadow: var(--shadow-small);
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
 
   &:not(:first-child) {
-    margin-left: var(--space-minus-smaller);
+    margin-left: -0.25rem;
   }
 
   .gap-tight {
-    margin-left: var(--space-minus-small);
+    margin-left: -0.5rem;
   }
 }
 
 .thumbnail-more-text {
-  display: inline-flex;
-  align-items: center;
-  position: relative;
-
-  margin-left: var(--space-minus-small);
-  padding: 0 var(--space-small);
-  box-shadow: var(--shadow-small);
-  background: var(--color-background);
-  border-radius: var(--space-giga);
-  border: 1px solid var(--white);
-
-  color: var(--s-600);
-  font-size: var(--font-size-mini);
-  font-weight: var(--font-weight-medium);
+  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
+  @apply text-n-slate-11 bg-n-slate-4 border border-n-weak text-xs font-medium rounded-full px-2 ltr:-ml-2 rtl:-mr-2 inline-flex items-center relative;
 }
 </style>
diff --git a/app/javascript/dashboard/components/widgets/WootWriter/Editor.vue b/app/javascript/dashboard/components/widgets/WootWriter/Editor.vue
index 628c88ad3..7ac589691 100644
--- a/app/javascript/dashboard/components/widgets/WootWriter/Editor.vue
+++ b/app/javascript/dashboard/components/widgets/WootWriter/Editor.vue
@@ -709,7 +709,7 @@ useEmitter(BUS_EVENTS.INSERT_INTO_RICH_EDITOR, insertContentIntoEditor);
     <div ref="editor" />
     <div
       v-show="isImageNodeSelected && showImageResizeToolbar"
-      class="absolute shadow-md rounded-[4px] flex gap-1 py-1 px-1 bg-slate-50 dark:bg-slate-700 text-slate-800 dark:text-slate-50"
+      class="absolute shadow-md rounded-[6px] flex gap-1 py-1 px-1 bg-n-solid-3 outline outline-1 outline-n-weak text-n-slate-12"
       :style="{
         top: toolbarPosition.top,
         left: toolbarPosition.left,
@@ -718,7 +718,7 @@ useEmitter(BUS_EVENTS.INSERT_INTO_RICH_EDITOR, insertContentIntoEditor);
       <button
         v-for="size in sizes"
         :key="size.name"
-        class="text-xs font-medium rounded-[4px] border border-solid border-slate-200 dark:border-slate-600 px-1.5 py-0.5 hover:bg-slate-100 dark:hover:bg-slate-800"
+        class="text-xs font-medium rounded-[4px] outline outline-1 outline-n-strong px-1.5 py-0.5 hover:bg-n-slate-5"
         @click="setURLWithQueryAndImageSize(size)"
       >
         {{ size.name }}
@@ -735,16 +735,16 @@ useEmitter(BUS_EVENTS.INSERT_INTO_RICH_EDITOR, insertContentIntoEditor);
   @apply flex flex-col;
 
   .ProseMirror-menubar {
-    min-height: var(--space-two) !important;
+    min-height: 1.25rem !important;
     @apply -ml-2.5 pb-0 bg-transparent text-n-slate-11;
 
     .ProseMirror-menu-active {
-      @apply bg-slate-75 dark:bg-slate-800;
+      @apply bg-n-slate-5 dark:bg-n-solid-3;
     }
   }
 
   > .ProseMirror {
-    @apply p-0 break-words text-slate-800 dark:text-slate-100;
+    @apply p-0 break-words text-n-slate-12;
 
     h1,
     h2,
@@ -753,14 +753,14 @@ useEmitter(BUS_EVENTS.INSERT_INTO_RICH_EDITOR, insertContentIntoEditor);
     h5,
     h6,
     p {
-      @apply text-slate-800 dark:text-slate-100;
+      @apply text-n-slate-12;
     }
 
     blockquote {
-      @apply border-slate-400 dark:border-slate-500;
+      @apply border-n-slate-7;
 
       p {
-        @apply text-slate-600 dark:text-slate-400;
+        @apply text-n-slate-11;
       }
     }
 
@@ -825,6 +825,6 @@ useEmitter(BUS_EVENTS.INSERT_INTO_RICH_EDITOR, insertContentIntoEditor);
 }
 
 .editor-warning__message {
-  @apply text-red-400 dark:text-red-400 font-normal text-sm pt-1 pb-0 px-0;
+  @apply text-n-ruby-9 dark:text-n-ruby-9 font-normal text-sm pt-1 pb-0 px-0;
 }
 </style>
diff --git a/app/javascript/dashboard/components/widgets/WootWriter/ReplyBottomPanel.vue b/app/javascript/dashboard/components/widgets/WootWriter/ReplyBottomPanel.vue
index 47fe01e9c..ad3edce1b 100644
--- a/app/javascript/dashboard/components/widgets/WootWriter/ReplyBottomPanel.vue
+++ b/app/javascript/dashboard/components/widgets/WootWriter/ReplyBottomPanel.vue
@@ -355,10 +355,10 @@ export default {
       <transition name="modal-fade">
         <div
           v-show="uploadRef && uploadRef.dropActive"
-          class="fixed top-0 bottom-0 left-0 right-0 z-20 flex flex-col items-center justify-center w-full h-full gap-2 text-slate-900 dark:text-slate-50 bg-modal-backdrop-light dark:bg-modal-backdrop-dark"
+          class="fixed top-0 bottom-0 left-0 right-0 z-20 flex flex-col items-center justify-center w-full h-full gap-2 text-n-slate-12 bg-modal-backdrop-light dark:bg-modal-backdrop-dark"
         >
           <fluent-icon icon="cloud-backup" size="40" />
-          <h4 class="text-2xl break-words text-slate-900 dark:text-slate-50">
+          <h4 class="text-2xl break-words text-n-slate-12">
             {{ $t('CONVERSATION.REPLYBOX.DRAG_DROP') }}
           </h4>
         </div>
@@ -402,7 +402,7 @@ export default {
   }
 
   &:hover button {
-    @apply dark:bg-slate-800 bg-slate-100;
+    @apply enabled:bg-n-slate-9/20;
   }
 }
 </style>
diff --git a/app/javascript/dashboard/components/widgets/WootWriter/ReplyTopPanel.vue b/app/javascript/dashboard/components/widgets/WootWriter/ReplyTopPanel.vue
index 23ef82b5e..b5367ca29 100644
--- a/app/javascript/dashboard/components/widgets/WootWriter/ReplyTopPanel.vue
+++ b/app/javascript/dashboard/components/widgets/WootWriter/ReplyTopPanel.vue
@@ -73,7 +73,7 @@ export default {
       };
     },
     charLengthClass() {
-      return this.charactersRemaining < 0 ? 'text-red-600' : 'text-slate-600';
+      return this.charactersRemaining < 0 ? 'text-n-ruby-9' : 'text-n-slate-11';
     },
     characterLengthWarning() {
       return this.charactersRemaining < 0
diff --git a/app/javascript/dashboard/components/widgets/WootWriter/keyboardEmojiSelector.vue b/app/javascript/dashboard/components/widgets/WootWriter/keyboardEmojiSelector.vue
index 3efade71d..a2fcd8ac7 100644
--- a/app/javascript/dashboard/components/widgets/WootWriter/keyboardEmojiSelector.vue
+++ b/app/javascript/dashboard/components/widgets/WootWriter/keyboardEmojiSelector.vue
@@ -52,13 +52,13 @@ onMounted(() => {
   >
     <template #default="{ item, selected }">
       <span
-        class="max-w-full inline-flex items-center gap-0.5 min-w-0 mb-0 text-sm font-medium text-slate-900 dark:text-slate-100 group-hover:text-woot-500 dark:group-hover:text-woot-500 truncate"
+        class="max-w-full inline-flex items-center gap-0.5 min-w-0 mb-0 text-sm font-medium text-n-slate-12 group-hover:text-n-brand truncate"
       >
         {{ item.emoji }}
         <p
           class="relative mb-0 truncate bottom-px"
           :class="{
-            'text-woot-500 dark:text-woot-500': selected,
+            'text-n-brand': selected,
             'font-normal': !selected,
           }"
         >
diff --git a/app/javascript/dashboard/components/widgets/conversation/AvailabilityStatusBadge.vue b/app/javascript/dashboard/components/widgets/conversation/AvailabilityStatusBadge.vue
deleted file mode 100644
index 97461667a..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/AvailabilityStatusBadge.vue
+++ /dev/null
@@ -1,27 +0,0 @@
-<script>
-export default {
-  props: {
-    status: { type: String, default: '' },
-  },
-};
-</script>
-
-<template>
-  <div
-    :class="`status-badge status-badge__${status} rounded-full w-2.5 h-2.5 mr-0.5 rtl:mr-0 rtl:ml-0.5 inline-flex`"
-  />
-</template>
-
-<style lang="scss" scoped>
-.status-badge {
-  &__online {
-    @apply bg-green-400;
-  }
-  &__offline {
-    @apply bg-slate-500;
-  }
-  &__busy {
-    @apply bg-yellow-500;
-  }
-}
-</style>
diff --git a/app/javascript/dashboard/components/widgets/conversation/ChatFilter.vue b/app/javascript/dashboard/components/widgets/conversation/ChatFilter.vue
deleted file mode 100644
index 7794e0ab0..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/ChatFilter.vue
+++ /dev/null
@@ -1 +0,0 @@
-<!-- // not using this component -->
diff --git a/app/javascript/dashboard/components/widgets/conversation/ConversationBox.vue b/app/javascript/dashboard/components/widgets/conversation/ConversationBox.vue
index 62ea8fdaf..36f8438c3 100644
--- a/app/javascript/dashboard/components/widgets/conversation/ConversationBox.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/ConversationBox.vue
@@ -91,7 +91,7 @@ export default {
 
 <template>
   <div
-    class="conversation-details-wrap bg-n-background relative"
+    class="conversation-details-wrap flex flex-col min-w-0 w-full bg-n-background relative"
     :class="{
       'border-l rtl:border-l-0 rtl:border-r border-n-weak': !isOnExpandedLayout,
     }"
@@ -104,7 +104,7 @@ export default {
     <woot-tabs
       v-if="dashboardApps.length && currentChat.id"
       :index="activeIndex"
-      class="-mt-px dashboard-app--tabs border-t border-t-n-background"
+      class="-mt-px border-t border-t-n-background"
       @change="onDashboardAppTabChange"
     >
       <woot-tabs-item
@@ -113,6 +113,8 @@ export default {
         :index="tab.index"
         :name="tab.name"
         :show-badge="false"
+        is-compact
+        class="[&_a]:pt-1"
       />
     </woot-tabs>
     <div v-show="!activeIndex" class="flex h-full min-h-0 m-0">
@@ -138,19 +140,3 @@ export default {
     />
   </div>
 </template>
-
-<style lang="scss" scoped>
-.conversation-details-wrap {
-  @apply flex flex-col min-w-0 w-full;
-}
-
-.dashboard-app--tabs {
-  ::v-deep {
-    .tabs-title {
-      a {
-        @apply pb-2 pt-1;
-      }
-    }
-  }
-}
-</style>
diff --git a/app/javascript/dashboard/components/widgets/conversation/ConversationCard.vue b/app/javascript/dashboard/components/widgets/conversation/ConversationCard.vue
index 4840b459f..30e99ca9d 100644
--- a/app/javascript/dashboard/components/widgets/conversation/ConversationCard.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/ConversationCard.vue
@@ -328,9 +328,7 @@ export default {
           {{ $t(`CHAT_LIST.NO_MESSAGES`) }}
         </span>
       </p>
-      <div
-        class="absolute flex flex-col conversation--meta ltr:right-4 rtl:left-4 top-4"
-      >
+      <div class="absolute flex flex-col mt-4 ltr:right-4 rtl:left-4 top-4">
         <span class="ml-auto font-normal leading-4 text-xxs">
           <TimeAgo
             :last-activity-timestamp="chat.timestamp"
@@ -338,7 +336,7 @@ export default {
           />
         </span>
         <span
-          class="unread shadow-lg rounded-full hidden text-xxs font-semibold h-4 leading-4 ml-auto mt-1 min-w-[1rem] px-1 py-0 text-center text-white bg-n-teal-9"
+          class="unread shadow-lg rounded-full hidden text-xxs font-semibold h-4 leading-4 ltr:ml-auto rtl:mr-auto mt-1 min-w-[1rem] px-1 py-0 text-center text-white bg-n-teal-9"
         >
           {{ unreadCount > 9 ? '9+' : unreadCount }}
         </span>
diff --git a/app/javascript/dashboard/components/widgets/conversation/EmptyState/EmptyStateMessage.vue b/app/javascript/dashboard/components/widgets/conversation/EmptyState/EmptyStateMessage.vue
index 4a82c7537..3adc25459 100644
--- a/app/javascript/dashboard/components/widgets/conversation/EmptyState/EmptyStateMessage.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/EmptyState/EmptyStateMessage.vue
@@ -23,9 +23,7 @@ export default {
       src="dashboard/assets/images/no-chat.svg"
       alt="No Chat"
     />
-    <span
-      class="text-sm text-slate-800 dark:text-slate-200 font-medium text-center"
-    >
+    <span class="text-sm text-n-slate-12 font-medium text-center">
       {{ message }}
       <br />
     </span>
diff --git a/app/javascript/dashboard/components/widgets/conversation/Message.vue b/app/javascript/dashboard/components/widgets/conversation/Message.vue
deleted file mode 100644
index bed90fd05..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/Message.vue
+++ /dev/null
@@ -1,800 +0,0 @@
-<script>
-import { useMessageFormatter } from 'shared/composables/useMessageFormatter';
-import BubbleActions from './bubble/Actions.vue';
-import BubbleContact from './bubble/Contact.vue';
-import BubbleFile from './bubble/File.vue';
-import BubbleImageAudioVideo from './bubble/ImageAudioVideo.vue';
-import BubbleIntegration from './bubble/Integration.vue';
-import BubbleLocation from './bubble/Location.vue';
-import BubbleMailHead from './bubble/MailHead.vue';
-import BubbleReplyTo from './bubble/ReplyTo.vue';
-import BubbleText from './bubble/Text.vue';
-import ContextMenu from 'dashboard/modules/conversations/components/MessageContextMenu.vue';
-import InstagramStory from './bubble/InstagramStory.vue';
-import InstagramStoryReply from './bubble/InstagramStoryReply.vue';
-import Spinner from 'shared/components/Spinner.vue';
-import { CONTENT_TYPES } from 'shared/constants/contentType';
-import { MESSAGE_TYPE, MESSAGE_STATUS } from 'shared/constants/messages';
-import { generateBotMessageContent } from './helpers/botMessageContentHelper';
-import { BUS_EVENTS } from 'shared/constants/busEvents';
-import { ACCOUNT_EVENTS } from 'dashboard/helper/AnalyticsHelper/events';
-import { LOCAL_STORAGE_KEYS } from 'dashboard/constants/localStorage';
-import { LocalStorage } from 'shared/helpers/localStorage';
-import { getDayDifferenceFromNow } from 'shared/helpers/DateHelper';
-import * as Sentry from '@sentry/vue';
-import { useTrack } from 'dashboard/composables';
-import { emitter } from 'shared/helpers/mitt';
-
-import NextButton from 'dashboard/components-next/button/Button.vue';
-
-export default {
-  components: {
-    BubbleActions,
-    BubbleContact,
-    BubbleFile,
-    BubbleImageAudioVideo,
-    BubbleIntegration,
-    BubbleLocation,
-    BubbleMailHead,
-    BubbleReplyTo,
-    BubbleText,
-    ContextMenu,
-    InstagramStory,
-    InstagramStoryReply,
-    Spinner,
-    NextButton,
-  },
-  props: {
-    data: {
-      type: Object,
-      required: true,
-    },
-    isATweet: {
-      type: Boolean,
-      default: false,
-    },
-    isAFacebookInbox: {
-      type: Boolean,
-      default: false,
-    },
-    isInstagram: {
-      type: Boolean,
-      default: false,
-    },
-    isAWhatsAppChannel: {
-      type: Boolean,
-      default: false,
-    },
-    isAnEmailInbox: {
-      type: Boolean,
-      default: false,
-    },
-    inboxSupportsReplyTo: {
-      type: Object,
-      default: () => ({}),
-    },
-    inReplyTo: {
-      type: Object,
-      default: () => ({}),
-    },
-  },
-  setup() {
-    const { formatMessage } = useMessageFormatter();
-    return {
-      formatMessage,
-    };
-  },
-  data() {
-    return {
-      showContextMenu: false,
-      hasMediaLoadError: false,
-      contextMenuPosition: {},
-      showBackgroundHighlight: false,
-    };
-  },
-  computed: {
-    attachments() {
-      // Here it is used to get sender and created_at for each attachment
-      return this.data?.attachments.map(attachment => ({
-        ...attachment,
-        sender: this.data.sender || {},
-        created_at: this.data.created_at || '',
-      }));
-    },
-    hasOneDayPassed() {
-      // Disable retry button if the message is failed and the message is older than 24 hours
-      return getDayDifferenceFromNow(new Date(), this.data?.created_at) >= 1;
-    },
-    shouldRenderMessage() {
-      return (
-        this.hasAttachments ||
-        this.data.content ||
-        this.isEmailContentType ||
-        this.isUnsupported ||
-        this.isAnIntegrationMessage
-      );
-    },
-    emailMessageContent() {
-      const {
-        html_content: { full: fullHTMLContent } = {},
-        text_content: { full: fullTextContent } = {},
-      } = this.contentAttributes.email || {};
-
-      if (fullHTMLContent) {
-        return fullHTMLContent;
-      }
-
-      if (fullTextContent) {
-        return fullTextContent.replace(/\n/g, '<br>');
-      }
-
-      return '';
-    },
-    displayQuotedButton() {
-      if (this.emailMessageContent.includes('<blockquote')) {
-        return true;
-      }
-
-      if (!this.isIncoming) {
-        return false;
-      }
-
-      return false;
-    },
-    message() {
-      // If the message is an email, emailMessageContent would be present
-      // In that case, we would use letter package to render the email
-      if (this.emailMessageContent && this.isIncoming) {
-        return this.emailMessageContent;
-      }
-
-      const botMessageContent = generateBotMessageContent(
-        this.contentType,
-        this.contentAttributes,
-        {
-          noResponseText: this.$t('CONVERSATION.NO_RESPONSE'),
-          csat: {
-            ratingTitle: this.$t('CONVERSATION.RATING_TITLE'),
-            feedbackTitle: this.$t('CONVERSATION.FEEDBACK_TITLE'),
-          },
-        }
-      );
-
-      if (this.contentType === 'input_csat') {
-        return this.$t('CONVERSATION.CSAT_REPLY_MESSAGE') + botMessageContent;
-      }
-
-      return (
-        this.formatMessage(
-          this.data.content,
-          this.isATweet,
-          this.data.private
-        ) + botMessageContent
-      );
-    },
-    inReplyToMessageId() {
-      // Why not use the inReplyTo object directly?
-      // Glad you asked! The inReplyTo object may or may not be available
-      // depending on the current scroll position of the message list
-      // since old messages are only loaded when the user scrolls up
-      return this.data.content_attributes?.in_reply_to;
-    },
-    isAnInstagramStory() {
-      return this.contentAttributes.image_type === 'story_mention';
-    },
-    contextMenuEnabledOptions() {
-      return {
-        copy: this.hasText,
-        delete:
-          (this.hasText || this.hasAttachments) &&
-          !this.isMessageDeleted &&
-          !this.isFailed,
-        cannedResponse:
-          this.isOutgoing && this.hasText && !this.isMessageDeleted,
-        copyLink: !this.isFailed || !this.isProcessing,
-        translate:
-          (!this.isFailed || !this.isProcessing) &&
-          !this.isMessageDeleted &&
-          this.hasText,
-        replyTo: !this.data.private && this.inboxSupportsReplyTo.outgoing,
-      };
-    },
-    contentAttributes() {
-      return this.data.content_attributes || {};
-    },
-    externalError() {
-      return this.contentAttributes.external_error || '';
-    },
-    sender() {
-      return this.data.sender || {};
-    },
-    status() {
-      return this.data.status;
-    },
-    storySender() {
-      return this.contentAttributes.story_sender || null;
-    },
-    storyId() {
-      return this.contentAttributes.story_id || null;
-    },
-    storyUrl() {
-      return this.contentAttributes.story_url || null;
-    },
-    contentType() {
-      const {
-        data: { content_type: contentType },
-      } = this;
-      return contentType;
-    },
-    twitterProfileLink() {
-      const additionalAttributes = this.sender.additional_attributes || {};
-      const { screen_name: screenName } = additionalAttributes;
-      return `https://twitter.com/${screenName}`;
-    },
-    alignBubble() {
-      const { message_type: messageType } = this.data;
-      const isCentered = messageType === MESSAGE_TYPE.ACTIVITY;
-      const isLeftAligned = messageType === MESSAGE_TYPE.INCOMING;
-      const isRightAligned =
-        messageType === MESSAGE_TYPE.OUTGOING ||
-        messageType === MESSAGE_TYPE.TEMPLATE;
-      return {
-        center: isCentered,
-        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,
-      };
-    },
-    createdAt() {
-      return this.contentAttributes.external_created_at || this.data.created_at;
-    },
-    isBubble() {
-      return [0, 1, 3].includes(this.data.message_type);
-    },
-    isIncoming() {
-      return this.data.message_type === MESSAGE_TYPE.INCOMING;
-    },
-    isOutgoing() {
-      return this.data.message_type === MESSAGE_TYPE.OUTGOING;
-    },
-    isTemplate() {
-      return this.data.message_type === MESSAGE_TYPE.TEMPLATE;
-    },
-    isAnIntegrationMessage() {
-      return this.contentType === 'integrations';
-    },
-    emailHeadAttributes() {
-      return {
-        email: this.contentAttributes.email,
-        cc: this.contentAttributes.cc_emails,
-        bcc: this.contentAttributes.bcc_emails,
-      };
-    },
-    hasAttachments() {
-      return !!(this.data.attachments && this.data.attachments.length > 0);
-    },
-    isMessageDeleted() {
-      return this.contentAttributes.deleted;
-    },
-    hasText() {
-      return !!this.data.content;
-    },
-    tooltipForSender() {
-      const name = this.senderNameForAvatar;
-      const { message_type: messageType } = this.data;
-      const showTooltip =
-        messageType === MESSAGE_TYPE.OUTGOING ||
-        messageType === MESSAGE_TYPE.TEMPLATE;
-      return showTooltip
-        ? {
-            content: `${this.$t('CONVERSATION.SENT_BY')} ${name}`,
-          }
-        : false;
-    },
-    errorMessageTooltip() {
-      if (this.isFailed) {
-        return this.externalError || this.$t(`CONVERSATION.SEND_FAILED`);
-      }
-      return '';
-    },
-    wrapClass() {
-      return {
-        wrap: this.isBubble,
-        'activity-wrap': !this.isBubble,
-        'is-pending': this.isPending,
-        'is-failed': this.isFailed,
-        'is-email': this.isEmailContentType,
-      };
-    },
-    bubbleClass() {
-      return {
-        bubble: this.isBubble,
-        'is-private': this.data.private,
-        'is-unsupported': this.isUnsupported,
-        'is-image': this.hasMediaAttachment('image'),
-        'is-video': this.hasMediaAttachment('video'),
-        'is-text': this.hasText,
-        'is-from-bot': this.isSentByBot,
-        'is-failed': this.isFailed,
-        'is-email': this.isEmailContentType,
-      };
-    },
-    isUnsupported() {
-      return this.contentAttributes.is_unsupported ?? false;
-    },
-    isPending() {
-      return this.data.status === MESSAGE_STATUS.PROGRESS;
-    },
-    isFailed() {
-      return this.data.status === MESSAGE_STATUS.FAILED;
-    },
-    isSentByBot() {
-      if (this.isPending || this.isFailed) return false;
-      return !this.sender.type || this.sender.type === 'agent_bot';
-    },
-    shouldShowContextMenu() {
-      return !this.isUnsupported;
-    },
-    showAvatar() {
-      if (this.isOutgoing || this.isTemplate) {
-        return true;
-      }
-      return this.isATweet && this.isIncoming && this.sender;
-    },
-    senderNameForAvatar() {
-      if (this.isOutgoing || this.isTemplate) {
-        const { name = this.$t('CONVERSATION.BOT') } = this.sender || {};
-        return name;
-      }
-      return '';
-    },
-    isEmailContentType() {
-      return this.contentType === CONTENT_TYPES.INCOMING_EMAIL;
-    },
-  },
-  watch: {
-    data() {
-      this.hasMediaLoadError = false;
-    },
-  },
-  mounted() {
-    this.hasMediaLoadError = false;
-    emitter.on(BUS_EVENTS.ON_MESSAGE_LIST_SCROLL, this.closeContextMenu);
-    this.setupHighlightTimer();
-  },
-  unmounted() {
-    emitter.off(BUS_EVENTS.ON_MESSAGE_LIST_SCROLL, this.closeContextMenu);
-    clearTimeout(this.higlightTimeout);
-  },
-  methods: {
-    isAttachmentImageVideoAudio(fileType) {
-      return ['image', 'audio', 'video', 'story_mention', 'ig_reel'].includes(
-        fileType
-      );
-    },
-    hasMediaAttachment(type) {
-      if (this.hasAttachments && this.data.attachments.length > 0) {
-        return this.compareMessageFileType(this.data, type);
-      }
-      return false;
-    },
-    compareMessageFileType(messageData, type) {
-      try {
-        const { attachments = [{}] } = messageData;
-        const { file_type: fileType } = attachments[0];
-        return fileType === type && !this.hasMediaLoadError;
-      } catch (err) {
-        Sentry.setContext('attachment-parsing-error', {
-          messageData,
-          type,
-          hasMediaLoadError: this.hasMediaLoadError,
-        });
-
-        Sentry.captureException(err);
-        return false;
-      }
-    },
-    handleContextMenuClick() {
-      this.showContextMenu = !this.showContextMenu;
-    },
-    async retrySendMessage() {
-      await this.$store.dispatch('sendMessageWithData', this.data);
-    },
-    onMediaLoadError() {
-      this.hasMediaLoadError = true;
-    },
-    openContextMenu(e) {
-      const shouldSkipContextMenu =
-        e.target?.classList.contains('skip-context-menu') ||
-        e.target?.tagName.toLowerCase() === 'a';
-      if (shouldSkipContextMenu || getSelection().toString()) {
-        return;
-      }
-
-      e.preventDefault();
-      if (e.type === 'contextmenu') {
-        useTrack(ACCOUNT_EVENTS.OPEN_MESSAGE_CONTEXT_MENU);
-      }
-      this.contextMenuPosition = {
-        x: e.pageX || e.clientX,
-        y: e.pageY || e.clientY,
-      };
-      this.showContextMenu = true;
-    },
-    closeContextMenu() {
-      this.showContextMenu = false;
-      this.contextMenuPosition = { x: null, y: null };
-    },
-    handleReplyTo() {
-      const replyStorageKey = LOCAL_STORAGE_KEYS.MESSAGE_REPLY_TO;
-      const { conversation_id: conversationId, id: replyTo } = this.data;
-
-      LocalStorage.updateJsonStore(replyStorageKey, conversationId, replyTo);
-      emitter.emit(BUS_EVENTS.TOGGLE_REPLY_TO_MESSAGE, this.data);
-    },
-    setupHighlightTimer() {
-      if (Number(this.$route.query.messageId) !== Number(this.data.id)) {
-        return;
-      }
-
-      this.showBackgroundHighlight = true;
-      const HIGHLIGHT_TIMER = 1000;
-      this.higlightTimeout = setTimeout(() => {
-        this.showBackgroundHighlight = false;
-      }, HIGHLIGHT_TIMER);
-    },
-  },
-};
-</script>
-
-<!-- eslint-disable-next-line vue/no-root-v-if -->
-<template>
-  <li
-    v-if="shouldRenderMessage"
-    :id="`message${data.id}`"
-    class="group/context-menu"
-    :class="[alignBubble]"
-  >
-    <div :class="wrapClass">
-      <div
-        v-if="isFailed && !hasOneDayPassed && !isAnEmailInbox"
-        class="message-failed--alert"
-      >
-        <NextButton
-          v-tooltip.top-end="$t('CONVERSATION.TRY_AGAIN')"
-          ghost
-          xs
-          ruby
-          icon="i-lucide-refresh-ccw"
-          @click="retrySendMessage"
-        />
-      </div>
-      <div :class="bubbleClass" @contextmenu="openContextMenu($event)">
-        <BubbleMailHead
-          :email-attributes="contentAttributes.email"
-          :cc="emailHeadAttributes.cc"
-          :bcc="emailHeadAttributes.bcc"
-          :is-incoming="isIncoming"
-        />
-        <InstagramStoryReply v-if="storyUrl" :story-url="storyUrl" />
-        <BubbleReplyTo
-          v-if="inReplyToMessageId && inboxSupportsReplyTo.incoming"
-          :message="inReplyTo"
-          :message-type="data.message_type"
-          :parent-has-attachments="hasAttachments"
-        />
-        <div v-if="isUnsupported">
-          <template v-if="isAFacebookInbox && isInstagram">
-            {{ $t('CONVERSATION.UNSUPPORTED_MESSAGE_INSTAGRAM') }}
-          </template>
-          <template v-else-if="isAFacebookInbox">
-            {{ $t('CONVERSATION.UNSUPPORTED_MESSAGE_FACEBOOK') }}
-          </template>
-          <template v-else>
-            {{ $t('CONVERSATION.UNSUPPORTED_MESSAGE') }}
-          </template>
-        </div>
-        <BubbleText
-          v-else-if="data.content"
-          :message="message"
-          :is-email="isEmailContentType"
-          :display-quoted-button="displayQuotedButton"
-        />
-        <BubbleIntegration
-          :message-id="data.id"
-          :content-attributes="contentAttributes"
-          :inbox-id="data.inbox_id"
-        />
-        <span
-          v-if="isPending && hasAttachments"
-          class="chat-bubble has-attachment agent"
-        >
-          {{ $t('CONVERSATION.UPLOADING_ATTACHMENTS') }}
-        </span>
-        <div v-if="!isPending && hasAttachments">
-          <div v-for="attachment in attachments" :key="attachment.id">
-            <InstagramStory
-              v-if="isAnInstagramStory"
-              :story-url="attachment.data_url"
-              @error="onMediaLoadError"
-            />
-            <BubbleImageAudioVideo
-              v-else-if="isAttachmentImageVideoAudio(attachment.file_type)"
-              :attachment="attachment"
-              @error="onMediaLoadError"
-            />
-            <BubbleLocation
-              v-else-if="attachment.file_type === 'location'"
-              :latitude="attachment.coordinates_lat"
-              :longitude="attachment.coordinates_long"
-              :name="attachment.fallback_title"
-            />
-            <BubbleContact
-              v-else-if="attachment.file_type === 'contact'"
-              :name="data.content"
-              :phone-number="attachment.fallback_title"
-            />
-            <BubbleFile v-else :url="attachment.data_url" />
-          </div>
-        </div>
-        <BubbleActions
-          :id="data.id"
-          :sender="data.sender"
-          :story-sender="storySender"
-          :external-error="errorMessageTooltip"
-          :story-id="`${storyId}`"
-          :is-a-tweet="isATweet"
-          :is-a-whatsapp-channel="isAWhatsAppChannel"
-          :is-email="isEmailContentType"
-          :is-private="data.private"
-          :message-type="data.message_type"
-          :message-status="status"
-          :source-id="data.source_id"
-          :inbox-id="data.inbox_id"
-          :created-at="createdAt"
-        />
-      </div>
-      <Spinner v-if="isPending" size="tiny" />
-      <div
-        v-if="showAvatar"
-        v-tooltip.left="tooltipForSender"
-        class="sender--info"
-      >
-        <woot-thumbnail
-          :src="sender.thumbnail"
-          :username="senderNameForAvatar"
-          size="16px"
-        />
-        <a
-          v-if="isATweet && isIncoming"
-          class="sender--available-name"
-          :href="twitterProfileLink"
-          target="_blank"
-          rel="noopener noreferrer nofollow"
-        >
-          {{ sender.name }}
-        </a>
-      </div>
-    </div>
-    <div v-if="shouldShowContextMenu" class="context-menu-wrap">
-      <ContextMenu
-        v-if="isBubble && !isMessageDeleted"
-        :context-menu-position="contextMenuPosition"
-        :is-open="showContextMenu"
-        :enabled-options="contextMenuEnabledOptions"
-        :message="data"
-        @open="openContextMenu"
-        @close="closeContextMenu"
-        @reply-to="handleReplyTo"
-      />
-    </div>
-  </li>
-</template>
-
-<style lang="scss">
-.wrap {
-  > .bubble {
-    @apply min-w-[128px];
-
-    &.is-unsupported {
-      @apply text-xs max-w-[300px] border-dashed border border-slate-200 text-slate-600 dark:text-slate-200 bg-slate-50 dark:bg-slate-700 dark:border-slate-500;
-
-      .message-text--metadata .time {
-        @apply text-slate-400 dark:text-slate-300;
-      }
-    }
-
-    &.is-image,
-    &.is-video {
-      @apply p-0 overflow-hidden;
-
-      .image,
-      .video {
-        @apply max-w-[20rem] p-0.5;
-
-        > img,
-        > video {
-          /** ensure that the bubble radius and image radius match*/
-          @apply rounded-[0.4rem];
-        }
-
-        > video {
-          @apply h-full w-full object-cover;
-        }
-      }
-
-      .video {
-        @apply h-[11.25rem];
-      }
-    }
-
-    &.is-image.is-text > .message-text__wrap,
-    &.is-video.is-text > .message-text__wrap {
-      @apply max-w-[20rem] py-2 px-4;
-    }
-
-    &.is-private .file.message-text__wrap {
-      .file--icon {
-        @apply text-woot-400 dark:text-woot-400;
-      }
-
-      .attachment-name {
-        @apply text-slate-700 dark:text-slate-200;
-      }
-
-      .download.button {
-        @apply text-woot-400 dark:text-woot-400;
-      }
-    }
-
-    &.is-private.is-text > .message-text__wrap .link {
-      @apply text-woot-600 dark:text-woot-200;
-    }
-
-    &.is-private.is-text > .message-text__wrap .prosemirror-mention-node {
-      @apply font-bold bg-none rounded-sm p-0 bg-yellow-100 dark:bg-yellow-700 text-slate-700 dark:text-slate-25 underline;
-    }
-
-    &.is-from-bot {
-      @apply bg-violet-400 dark:bg-violet-400;
-
-      .message-text--metadata .time {
-        @apply text-violet-50 dark:text-violet-50;
-      }
-
-      &.is-private .message-text--metadata .time {
-        @apply text-slate-400 dark:text-slate-400;
-      }
-    }
-
-    &.is-failed {
-      @apply bg-n-ruby-4 dark:bg-n-ruby-4 text-n-slate-12;
-
-      .message-text--metadata .time {
-        @apply text-n-ruby-12 dark:text-n-ruby-12;
-      }
-    }
-  }
-
-  &.is-pending {
-    @apply relative opacity-80;
-
-    .spinner {
-      @apply absolute bottom-1 right-1;
-    }
-
-    > .is-image.is-text.bubble > .message-text__wrap {
-      @apply p-0;
-    }
-  }
-}
-
-.wrap.is-email {
-  --bubble-max-width: 84% !important;
-}
-
-.sender--info {
-  @apply items-center text-black-700 dark:text-black-100 inline-flex py-1 px-0;
-
-  .sender--available-name {
-    @apply text-xs ml-1;
-  }
-}
-
-.message-failed--alert {
-  @apply text-red-900 dark:text-red-900 flex-grow text-right mt-1 mr-1 mb-0 ml-0;
-}
-
-li.left,
-li.right {
-  @apply flex items-end;
-}
-
-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;
-}
-
-li.has-bg {
-  @apply bg-woot-75 dark:bg-woot-600;
-}
-
-li.right .context-menu-wrap {
-  @apply ml-auto;
-}
-
-li.right {
-  @apply flex-row-reverse justify-end;
-
-  .wrap.is-pending {
-    @apply ml-auto;
-  }
-
-  .wrap.is-failed {
-    @apply flex items-end ltr:ml-auto rtl:mr-auto;
-  }
-}
-
-.has-context-menu {
-  @apply bg-slate-50 dark:bg-slate-700;
-}
-
-.context-menu {
-  @apply relative;
-}
-
-/* Markdown styling */
-
-.bubble .text-content {
-  p code {
-    @apply bg-slate-75 dark:bg-slate-700 inline-block leading-none rounded-sm p-1;
-  }
-
-  ol li {
-    @apply list-item list-decimal;
-  }
-
-  pre {
-    @apply bg-slate-75 dark:bg-slate-700 block border-slate-75 dark:border-slate-700 text-slate-800 dark:text-slate-100 rounded-md p-2 mt-1 mb-2 leading-relaxed whitespace-pre-wrap;
-
-    code {
-      @apply bg-transparent text-slate-800 dark:text-slate-100 p-0;
-    }
-  }
-
-  blockquote {
-    @apply border-l-4 mx-0 my-1 pt-2 pr-2 pb-0 pl-4 border-slate-75 border-solid dark:border-slate-600 text-slate-800 dark:text-slate-100;
-
-    p {
-      @apply text-slate-800 dark:text-slate-300;
-    }
-  }
-}
-
-.right .bubble .text-content {
-  p code {
-    @apply bg-woot-600 dark:bg-woot-600 text-white dark:text-white;
-  }
-
-  pre {
-    @apply bg-woot-800 dark:bg-woot-800 border-woot-700 dark:border-woot-700 text-white dark:text-white;
-
-    code {
-      @apply bg-transparent text-white dark:text-white;
-    }
-  }
-
-  blockquote {
-    @apply border-l-4 border-solid border-woot-400 dark:border-woot-400 text-white dark:text-white;
-
-    p {
-      @apply text-woot-75 dark:text-woot-75;
-    }
-  }
-}
-</style>
diff --git a/app/javascript/dashboard/components/widgets/conversation/MessagePreview.vue b/app/javascript/dashboard/components/widgets/conversation/MessagePreview.vue
index 4df6e16e1..2421f948d 100644
--- a/app/javascript/dashboard/components/widgets/conversation/MessagePreview.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/MessagePreview.vue
@@ -66,26 +66,26 @@ export default {
       <fluent-icon
         v-if="isMessagePrivate"
         size="16"
-        class="-mt-0.5 align-middle text-slate-600 dark:text-slate-300 inline-block"
+        class="-mt-0.5 align-middle text-n-slate-11 inline-block"
         icon="lock-closed"
       />
       <fluent-icon
         v-else-if="messageByAgent"
         size="16"
-        class="-mt-0.5 align-middle text-slate-600 dark:text-slate-300 inline-block"
+        class="-mt-0.5 align-middle text-n-slate-11 inline-block"
         icon="arrow-reply"
       />
       <fluent-icon
         v-else-if="isMessageAnActivity"
         size="16"
-        class="-mt-0.5 align-middle text-slate-600 dark:text-slate-300 inline-block"
+        class="-mt-0.5 align-middle text-n-slate-11 inline-block"
         icon="info"
       />
     </template>
     <span v-if="message.content && isMessageSticker">
       <fluent-icon
         size="16"
-        class="-mt-0.5 align-middle inline-block text-slate-600 dark:text-slate-300"
+        class="-mt-0.5 align-middle inline-block text-n-slate-11"
         icon="image"
       />
       {{ $t('CHAT_LIST.ATTACHMENTS.image.CONTENT') }}
@@ -97,7 +97,7 @@ export default {
       <fluent-icon
         v-if="attachmentIcon && showMessageType"
         size="16"
-        class="-mt-0.5 align-middle inline-block text-slate-600 dark:text-slate-300"
+        class="-mt-0.5 align-middle inline-block text-n-slate-11"
         :icon="attachmentIcon"
       />
       {{ $t(`${attachmentMessageContent}`) }}
diff --git a/app/javascript/dashboard/components/widgets/conversation/MessageSignatureMissingAlert.vue b/app/javascript/dashboard/components/widgets/conversation/MessageSignatureMissingAlert.vue
index fd2139b67..a10d933bc 100644
--- a/app/javascript/dashboard/components/widgets/conversation/MessageSignatureMissingAlert.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/MessageSignatureMissingAlert.vue
@@ -11,7 +11,7 @@ const openProfileSettings = () => {
 
 <template>
   <div
-    class="my-0 mx-4 px-1 flex max-h-[8vh] items-baseline justify-between hover:bg-slate-25 dark:hover:bg-slate-800 border border-dashed border-slate-100 dark:border-slate-700 rounded-sm overflow-auto"
+    class="my-0 mx-4 px-1 flex max-h-[8vh] items-baseline justify-between hover:bg-n-slate-1 border border-dashed border-n-weak rounded-sm overflow-auto"
   >
     <p class="w-fit !m-0">
       {{ $t('CONVERSATION.FOOTER.MESSAGE_SIGNATURE_NOT_CONFIGURED') }}
diff --git a/app/javascript/dashboard/components/widgets/conversation/MessagesView.vue b/app/javascript/dashboard/components/widgets/conversation/MessagesView.vue
index 5f020d9ba..0ff68f79b 100644
--- a/app/javascript/dashboard/components/widgets/conversation/MessagesView.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/MessagesView.vue
@@ -4,14 +4,13 @@ import { ref, provide } from 'vue';
 import { useConfig } from 'dashboard/composables/useConfig';
 import { useKeyboardEvents } from 'dashboard/composables/useKeyboardEvents';
 import { useAI } from 'dashboard/composables/useAI';
-import { useMapGetter } from 'dashboard/composables/store';
 
 // components
 import ReplyBox from './ReplyBox.vue';
-import Message from './Message.vue';
-import NextMessageList from 'next/message/MessageList.vue';
+import MessageList from 'next/message/MessageList.vue';
 import ConversationLabelSuggestion from './conversation/LabelSuggestion.vue';
 import Banner from 'dashboard/components/ui/Banner.vue';
+import Spinner from 'dashboard/components-next/spinner/Spinner.vue';
 
 // stores and apis
 import { mapGetters } from 'vuex';
@@ -35,16 +34,15 @@ import { BUS_EVENTS } from 'shared/constants/busEvents';
 import { REPLY_POLICY } from 'shared/constants/links';
 import wootConstants from 'dashboard/constants/globals';
 import { LOCAL_STORAGE_KEYS } from 'dashboard/constants/localStorage';
-import { FEATURE_FLAGS } from '../../../featureFlags';
 import { INBOX_TYPES } from 'dashboard/helper/inbox';
 
 export default {
   components: {
-    Message,
-    NextMessageList,
+    MessageList,
     ReplyBox,
     Banner,
     ConversationLabelSuggestion,
+    Spinner,
   },
   mixins: [inboxMixin],
   setup() {
@@ -52,17 +50,11 @@ export default {
     const conversationPanelRef = ref(null);
     const { isEnterprise } = useConfig();
 
-    const closePopOutReplyBox = () => {
-      isPopOutReplyBox.value = false;
-    };
-
-    const showPopOutReplyBox = () => {
-      isPopOutReplyBox.value = !isPopOutReplyBox.value;
-    };
-
     const keyboardEvents = {
       Escape: {
-        action: closePopOutReplyBox,
+        action: () => {
+          isPopOutReplyBox.value = false;
+        },
       },
     };
 
@@ -75,28 +67,15 @@ export default {
       fetchLabelSuggestions,
     } = useAI();
 
-    const currentAccountId = useMapGetter('getCurrentAccountId');
-    const isFeatureEnabledonAccount = useMapGetter(
-      'accounts/isFeatureEnabledonAccount'
-    );
-
-    const showNextBubbles = isFeatureEnabledonAccount.value(
-      currentAccountId.value,
-      FEATURE_FLAGS.CHATWOOT_V4
-    );
-
     provide('contextMenuElementTarget', conversationPanelRef);
 
     return {
       isEnterprise,
       isPopOutReplyBox,
-      closePopOutReplyBox,
-      showPopOutReplyBox,
       isAIIntegrationEnabled,
       isLabelSuggestionFeatureEnabled,
       fetchIntegrationsIfRequired,
       fetchLabelSuggestions,
-      showNextBubbles,
       conversationPanelRef,
     };
   },
@@ -180,20 +159,6 @@ export default {
         (!this.listLoadingStatus && this.isLoadingPrevious)
       );
     },
-    conversationType() {
-      const { additional_attributes: additionalAttributes } = this.currentChat;
-      const type = additionalAttributes ? additionalAttributes.type : '';
-      return type || '';
-    },
-
-    isATweet() {
-      return this.conversationType === 'tweet';
-    },
-    getLastSeenAt() {
-      const { contact_last_seen_at: contactLastSeenAt } = this.currentChat;
-      return contactLastSeenAt;
-    },
-
     // Check there is a instagram inbox exists with the same instagram_id
     hasDuplicateInstagramInbox() {
       const instagramId = this.inbox.instagram_id;
@@ -269,9 +234,6 @@ export default {
           : 'CONVERSATION.UNREAD_MESSAGE';
       return `${count} ${this.$t(label)}`;
     },
-    isInstagramDM() {
-      return this.conversationType === 'instagram_direct_message';
-    },
     inboxSupportsReplyTo() {
       const incoming = this.inboxHasFeature(INBOX_FEATURES.REPLY_TO);
       const outgoing =
@@ -475,18 +437,6 @@ export default {
     makeMessagesRead() {
       this.$store.dispatch('markMessagesRead', { id: this.currentChat.id });
     },
-    getInReplyToMessage(parentMessage) {
-      if (!parentMessage) return {};
-      const inReplyToMessageId = parentMessage.content_attributes?.in_reply_to;
-      if (!inReplyToMessageId) return {};
-
-      return this.currentChat?.messages.find(message => {
-        if (message.id === inReplyToMessageId) {
-          return true;
-        }
-        return false;
-      });
-    },
   },
 };
 </script>
@@ -507,10 +457,9 @@ export default {
       class="mx-2 mt-2 overflow-hidden rounded-lg"
       :banner-message="$t('CONVERSATION.OLD_INSTAGRAM_INBOX_REPLY_BANNER')"
     />
-    <NextMessageList
-      v-if="showNextBubbles"
+    <MessageList
       ref="conversationPanelRef"
-      class="conversation-panel"
+      class="conversation-panel flex-shrink flex-grow basis-px flex flex-col overflow-y-auto relative h-full m-0 pb-4"
       :current-user-id="currentUserId"
       :first-unread-id="unReadMessages[0]?.id"
       :is-an-email-channel="isAnEmailChannel"
@@ -520,14 +469,18 @@ export default {
       <template #beforeAll>
         <transition name="slide-up">
           <!-- eslint-disable-next-line vue/require-toggle-inside-transition -->
-          <li class="min-h-[4rem]">
-            <span v-if="shouldShowSpinner" class="spinner message" />
+          <li
+            class="min-h-[4rem] flex flex-shrink-0 flex-grow-0 items-center flex-auto justify-center max-w-full mt-0 mr-0 mb-1 ml-0 relative first:mt-auto last:mb-0"
+          >
+            <Spinner v-if="shouldShowSpinner" class="text-n-brand" />
           </li>
         </transition>
       </template>
       <template #unreadBadge>
-        <li v-show="unreadMessageCount != 0" class="unread--toast">
-          <span>
+        <li v-show="unreadMessageCount != 0">
+          <span
+            class="shadow-lg rounded-full bg-n-brand text-white text-xs font-medium my-2.5 mx-auto px-2.5 py-1.5"
+          >
             {{ unreadMessageLabel }}
           </span>
         </li>
@@ -540,65 +493,12 @@ export default {
           :conversation-id="currentChat.id"
         />
       </template>
-    </NextMessageList>
-    <ul v-else ref="conversationPanelRef" class="conversation-panel">
-      <transition name="slide-up">
-        <!-- eslint-disable-next-line vue/require-toggle-inside-transition -->
-        <li class="min-h-[4rem]">
-          <span v-if="shouldShowSpinner" class="spinner message" />
-        </li>
-      </transition>
-      <Message
-        v-for="message in readMessages"
-        :key="message.id"
-        class="message--read ph-no-capture"
-        data-clarity-mask="True"
-        :data="message"
-        :is-a-tweet="isATweet"
-        :is-a-whatsapp-channel="isAWhatsAppChannel"
-        :is-web-widget-inbox="isAWebWidgetInbox"
-        :is-a-facebook-inbox="isAFacebookInbox"
-        :is-an-email-inbox="isAnEmailChannel"
-        :is-instagram="isInstagramDM"
-        :inbox-supports-reply-to="inboxSupportsReplyTo"
-        :in-reply-to="getInReplyToMessage(message)"
-      />
-      <li v-show="unreadMessageCount != 0" class="unread--toast">
-        <span>
-          {{ unreadMessageCount > 9 ? '9+' : unreadMessageCount }}
-          {{
-            unreadMessageCount > 1
-              ? $t('CONVERSATION.UNREAD_MESSAGES')
-              : $t('CONVERSATION.UNREAD_MESSAGE')
-          }}
-        </span>
-      </li>
-      <Message
-        v-for="message in unReadMessages"
-        :key="message.id"
-        class="message--unread ph-no-capture"
-        data-clarity-mask="True"
-        :data="message"
-        :is-a-tweet="isATweet"
-        :is-a-whatsapp-channel="isAWhatsAppChannel"
-        :is-web-widget-inbox="isAWebWidgetInbox"
-        :is-a-facebook-inbox="isAFacebookInbox"
-        :is-instagram-dm="isInstagramDM"
-        :inbox-supports-reply-to="inboxSupportsReplyTo"
-        :in-reply-to="getInReplyToMessage(message)"
-      />
-      <ConversationLabelSuggestion
-        v-if="shouldShowLabelSuggestions"
-        :suggested-labels="labelSuggestions"
-        :chat-labels="currentChat.labels"
-        :conversation-id="currentChat.id"
-      />
-    </ul>
+    </MessageList>
     <div
-      class="conversation-footer"
+      class="flex relative flex-col"
       :class="{
         'modal-mask': isPopOutReplyBox,
-        'bg-n-background': showNextBubbles && !isPopOutReplyBox,
+        'bg-n-background': !isPopOutReplyBox,
       }"
     >
       <div
@@ -606,7 +506,7 @@ export default {
         class="absolute flex items-center w-full h-0 -top-7"
       >
         <div
-          class="flex py-2 pr-4 pl-5 shadow-md rounded-full bg-white dark:bg-slate-700 text-n-slate-11 text-xs font-semibold my-2.5 mx-auto"
+          class="flex py-2 pr-4 pl-5 shadow-md rounded-full bg-white dark:bg-n-solid-3 text-n-slate-11 text-xs font-semibold my-2.5 mx-auto"
         >
           {{ typingUserNames }}
           <img
@@ -617,8 +517,8 @@ export default {
         </div>
       </div>
       <ReplyBox
-        v-model:popout-reply-box="isPopOutReplyBox"
-        @toggle-popout="showPopOutReplyBox"
+        :pop-out-reply-box="isPopOutReplyBox"
+        @update:pop-out-reply-box="isPopOutReplyBox = $event"
       />
     </div>
   </div>
@@ -626,7 +526,7 @@ export default {
 
 <style scoped lang="scss">
 .modal-mask {
-  @apply absolute;
+  @apply fixed;
 
   &::v-deep {
     .ProseMirror-woot-style {
@@ -650,7 +550,7 @@ export default {
     }
 
     .emoji-dialog {
-      @apply absolute left-auto bottom-1;
+      @apply absolute ltr:left-auto rtl:right-auto bottom-1;
     }
   }
 }
diff --git a/app/javascript/dashboard/components/widgets/conversation/OnboardingFeatureCard.vue b/app/javascript/dashboard/components/widgets/conversation/OnboardingFeatureCard.vue
index d141d34c3..d7ae5ab89 100644
--- a/app/javascript/dashboard/components/widgets/conversation/OnboardingFeatureCard.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/OnboardingFeatureCard.vue
@@ -29,24 +29,24 @@ defineProps({
 
 <template>
   <div
-    class="h-full w-full bg-white dark:bg-slate-900 border border-slate-100 dark:border-white/10 rounded-lg p-4 flex flex-col"
+    class="h-full w-full bg-n-background border border-n-weak rounded-lg p-4 flex flex-col"
   >
     <div class="flex-1 flex items-center justify-center">
       <img :src="imageSrc" :alt="imageAlt" class="h-36 w-auto mx-auto" />
     </div>
     <div class="mt-auto">
       <p
-        class="text-base text-slate-800 dark:text-slate-100 font-interDisplay font-semibold tracking-[0.3px]"
+        class="text-base text-n-slate-12 font-interDisplay font-semibold tracking-[0.3px]"
       >
         {{ title }}
       </p>
-      <p class="text-slate-600 dark:text-slate-400 text-sm">
+      <p class="text-n-slate-11 text-sm">
         {{ description }}
       </p>
       <router-link
         v-if="to"
         :to="{ name: to }"
-        class="no-underline text-woot-500 text-sm font-medium"
+        class="no-underline text-n-brand text-sm font-medium"
       >
         <span>{{ linkText }}</span>
         <span class="ml-2">{{ `→` }}</span>
diff --git a/app/javascript/dashboard/components/widgets/conversation/OnboardingView.vue b/app/javascript/dashboard/components/widgets/conversation/OnboardingView.vue
index a2145c4e6..5ac9390a5 100644
--- a/app/javascript/dashboard/components/widgets/conversation/OnboardingView.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/OnboardingView.vue
@@ -32,11 +32,11 @@ const greetingMessage = computed(() => {
   >
     <div class="col-span-full self-start">
       <p
-        class="text-xl font-semibold text-slate-900 dark:text-white font-interDisplay tracking-[0.3px]"
+        class="text-xl font-semibold text-n-slate-12 font-interDisplay tracking-[0.3px]"
       >
         {{ greetingMessage }}
       </p>
-      <p class="text-slate-600 dark:text-slate-400 max-w-2xl text-base">
+      <p class="text-n-slate-11 max-w-2xl text-base">
         {{
           $t('ONBOARDING.DESCRIPTION', {
             installationName: globalConfig.installationName,
diff --git a/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue b/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue
index 4fa83e029..4eeef92e8 100644
--- a/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/ReplyBox.vue
@@ -1,6 +1,5 @@
 <script>
-// [TODO] The popout events are needlessly complex and should be simplified
-import { defineAsyncComponent, defineModel, useTemplateRef } from 'vue';
+import { defineAsyncComponent, useTemplateRef } from 'vue';
 import { mapGetters } from 'vuex';
 import { useAlert } from 'dashboard/composables';
 import { useUISettings } from 'dashboard/composables/useUISettings';
@@ -66,7 +65,13 @@ export default {
     WootMessageEditor,
   },
   mixins: [inboxMixin, fileUploadMixin, keyboardEventListenerMixins],
-  emits: ['update:popoutReplyBox', 'togglePopout'],
+  props: {
+    popOutReplyBox: {
+      type: Boolean,
+      default: false,
+    },
+  },
+  emits: ['update:popOutReplyBox'],
   setup() {
     const {
       uiSettings,
@@ -75,16 +80,10 @@ export default {
       fetchSignatureFlagFromUISettings,
     } = useUISettings();
 
-    const popoutReplyBox = defineModel('popoutReplyBox', {
-      type: Boolean,
-      default: false,
-    });
-
     const replyEditor = useTemplateRef('replyEditor');
 
     return {
       uiSettings,
-      popoutReplyBox,
       updateUISettings,
       isEditorHotKeyEnabled,
       fetchSignatureFlagFromUISettings,
@@ -123,7 +122,6 @@ export default {
   },
   computed: {
     ...mapGetters({
-      isRTL: 'accounts/isRTL',
       currentChat: 'getSelectedChat',
       messageSignature: 'getMessageSignature',
       currentUser: 'getCurrentUser',
@@ -316,15 +314,6 @@ export default {
         this.uiSettings;
       return conversationDisplayType !== CONDENSED;
     },
-    emojiDialogClassOnExpandedLayoutAndRTLView() {
-      if (this.isOnExpandedLayout || this.popoutReplyBox) {
-        return 'emoji-dialog--expanded';
-      }
-      if (this.isRTL) {
-        return 'emoji-dialog--rtl';
-      }
-      return '';
-    },
     isMessageEmpty() {
       if (!this.message) {
         return true;
@@ -719,7 +708,7 @@ export default {
 
         this.clearMessage();
         this.hideEmojiPicker();
-        this.$emit('update:popoutReplyBox', false);
+        this.$emit('update:popOutReplyBox', false);
       }
     },
     sendMessageAsMultipleMessages(message) {
@@ -1098,6 +1087,9 @@ export default {
         file => !file?.isRecordedAudio
       );
     },
+    togglePopout() {
+      this.$emit('update:popOutReplyBox', !this.popOutReplyBox);
+    },
   },
 };
 </script>
@@ -1118,9 +1110,9 @@ export default {
       :mode="replyType"
       :is-message-length-reaching-threshold="isMessageLengthReachingThreshold"
       :characters-remaining="charactersRemaining"
-      :popout-reply-box="popoutReplyBox"
+      :popout-reply-box="popOutReplyBox"
       @set-reply-mode="setReplyMode"
-      @toggle-popout="$emit('togglePopout')"
+      @toggle-popout="togglePopout"
     />
     <ArticleSearchPopover
       v-if="showArticleSearchPopover && connectedPortalSlug"
@@ -1144,7 +1136,9 @@ export default {
       <EmojiInput
         v-if="showEmojiPicker"
         v-on-clickaway="hideEmojiPicker"
-        :class="emojiDialogClassOnExpandedLayoutAndRTLView"
+        :class="{
+          'emoji-dialog--expanded': isOnExpandedLayout || popOutReplyBox,
+        }"
         :on-click="addIntoEditor"
       />
       <ReplyEmailHead
@@ -1297,21 +1291,11 @@ export default {
 }
 
 .emoji-dialog {
-  @apply top-[unset] -bottom-10 -left-80 right-[unset];
+  @apply top-[unset] -bottom-10 ltr:-left-80 ltr:right-[unset] rtl:left-[unset] rtl:-right-80;
 
   &::before {
-    transform: rotate(270deg);
-    filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.08));
-    @apply -right-4 bottom-2 rtl:right-0 rtl:-left-4;
-  }
-}
-
-.emoji-dialog--rtl {
-  @apply left-[unset] -right-80;
-
-  &::before {
-    transform: rotate(90deg);
     filter: drop-shadow(0px 4px 4px rgba(0, 0, 0, 0.08));
+    @apply ltr:-right-4 bottom-2 rtl:-left-4 ltr:rotate-[270deg] rtl:rotate-[90deg];
   }
 }
 
@@ -1320,12 +1304,12 @@ export default {
 
   &::before {
     transform: rotate(0deg);
-    @apply left-1 -bottom-2;
+    @apply ltr:left-1 rtl:right-1 -bottom-2;
   }
 }
 
 .normal-editor__canned-box {
-  width: calc(100% - 2 * var(--space-normal));
-  left: var(--space-normal);
+  width: calc(100% - 2 * 1rem);
+  left: 1rem;
 }
 </style>
diff --git a/app/javascript/dashboard/components/widgets/conversation/ShopifyOrderItem.vue b/app/javascript/dashboard/components/widgets/conversation/ShopifyOrderItem.vue
index ed15ff47d..d47b4c7b7 100644
--- a/app/javascript/dashboard/components/widgets/conversation/ShopifyOrderItem.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/ShopifyOrderItem.vue
@@ -27,7 +27,7 @@ const getStatusClass = status => {
   const classes = {
     paid: 'bg-n-teal-5 text-n-teal-12',
   };
-  return classes[status] || 'bg-slate-50 text-slate-700';
+  return classes[status] || 'bg-n-solid-3 text-n-slate-12';
 };
 
 const getStatusI18nKey = (type, status = '') => {
@@ -52,11 +52,11 @@ const financialStatus = computed(() => {
 
 const getFulfillmentClass = status => {
   const classes = {
-    fulfilled: 'text-green-600',
-    partial: 'text-yellow-600',
-    unfulfilled: 'text-red-600',
+    fulfilled: 'text-n-teal-9',
+    partial: 'text-n-amber-9',
+    unfulfilled: 'text-n-ruby-9',
   };
-  return classes[status] || 'text-slate-600';
+  return classes[status] || 'text-n-slate-11';
 };
 </script>
 
diff --git a/app/javascript/dashboard/components/widgets/conversation/TagAgents.vue b/app/javascript/dashboard/components/widgets/conversation/TagAgents.vue
index 2e055cae6..b2d578e0d 100644
--- a/app/javascript/dashboard/components/widgets/conversation/TagAgents.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/TagAgents.vue
@@ -82,7 +82,7 @@ const onAgentSelect = index => {
         @click="onAgentSelect(index)"
         @mouseover="onHover(index)"
       >
-        <div class="mr-2">
+        <div class="ltr:mr-2 rtl:ml-2">
           <Avatar :src="agent.thumbnail" :name="agent.name" rounded-full />
         </div>
         <div
diff --git a/app/javascript/dashboard/components/widgets/conversation/VariableList.vue b/app/javascript/dashboard/components/widgets/conversation/VariableList.vue
index 0bbde1ba5..1b935ad29 100644
--- a/app/javascript/dashboard/components/widgets/conversation/VariableList.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/VariableList.vue
@@ -69,6 +69,6 @@ export default {
 
 <style scoped>
 .variable--list-label {
-  font-weight: var(--font-weight-bold);
+  font-weight: 600;
 }
 </style>
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/Actions.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/Actions.vue
deleted file mode 100644
index f3ed9ac51..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/Actions.vue
+++ /dev/null
@@ -1,357 +0,0 @@
-<script>
-import { MESSAGE_TYPE, MESSAGE_STATUS } from 'shared/constants/messages';
-import inboxMixin from 'shared/mixins/inboxMixin';
-import { messageTimestamp } from 'shared/helpers/timeHelper';
-
-export default {
-  mixins: [inboxMixin],
-  props: {
-    sender: {
-      type: Object,
-      default: () => ({}),
-    },
-    createdAt: {
-      type: Number,
-      default: 0,
-    },
-    storySender: {
-      type: String,
-      default: '',
-    },
-    externalError: {
-      type: String,
-      default: '',
-    },
-    storyId: {
-      type: String,
-      default: '',
-    },
-    isEmail: {
-      type: Boolean,
-      default: true,
-    },
-    isPrivate: {
-      type: Boolean,
-      default: true,
-    },
-    isATweet: {
-      type: Boolean,
-      default: true,
-    },
-    messageType: {
-      type: Number,
-      default: 1,
-    },
-    messageStatus: {
-      type: String,
-      default: '',
-    },
-    sourceId: {
-      type: String,
-      default: '',
-    },
-    inboxId: {
-      type: [String, Number],
-      default: 0,
-    },
-  },
-  computed: {
-    inbox() {
-      return this.$store.getters['inboxes/getInbox'](this.inboxId);
-    },
-    isIncoming() {
-      return MESSAGE_TYPE.INCOMING === this.messageType;
-    },
-    isOutgoing() {
-      return MESSAGE_TYPE.OUTGOING === this.messageType;
-    },
-    isTemplate() {
-      return MESSAGE_TYPE.TEMPLATE === this.messageType;
-    },
-    isDelivered() {
-      return MESSAGE_STATUS.DELIVERED === this.messageStatus;
-    },
-    isRead() {
-      return MESSAGE_STATUS.READ === this.messageStatus;
-    },
-    isSent() {
-      return MESSAGE_STATUS.SENT === this.messageStatus;
-    },
-    readableTime() {
-      return messageTimestamp(this.createdAt, 'LLL d, h:mm a');
-    },
-    screenName() {
-      const { additional_attributes: additionalAttributes = {} } =
-        this.sender || {};
-      return additionalAttributes?.screen_name || '';
-    },
-    linkToTweet() {
-      if (!this.sourceId || !this.inbox.name) {
-        return '';
-      }
-      const { screenName, sourceId } = this;
-      return `https://twitter.com/${
-        screenName || this.inbox.name
-      }/status/${sourceId}`;
-    },
-    linkToStory() {
-      if (!this.storyId || !this.storySender) {
-        return '';
-      }
-      const { storySender, storyId } = this;
-      return `https://www.instagram.com/stories/direct/${storySender}_${storyId}`;
-    },
-    showStatusIndicators() {
-      if ((this.isOutgoing || this.isTemplate) && !this.isPrivate) {
-        return true;
-      }
-      return false;
-    },
-    showSentIndicator() {
-      if (!this.showStatusIndicators) {
-        return false;
-      }
-      // Messages will be marked as sent for the Email channel if they have a source ID.
-      if (this.isAnEmailChannel) {
-        return !!this.sourceId;
-      }
-
-      if (
-        this.isAWhatsAppChannel ||
-        this.isATwilioChannel ||
-        this.isAFacebookInbox ||
-        this.isASmsInbox ||
-        this.isATelegramChannel
-      ) {
-        return this.sourceId && this.isSent;
-      }
-      // All messages will be mark as sent for the Line channel, as there is no source ID.
-      if (this.isALineChannel) {
-        return true;
-      }
-
-      return false;
-    },
-    showDeliveredIndicator() {
-      if (!this.showStatusIndicators) {
-        return false;
-      }
-      if (
-        this.isAWhatsAppChannel ||
-        this.isATwilioChannel ||
-        this.isASmsInbox ||
-        this.isAFacebookInbox
-      ) {
-        return this.sourceId && this.isDelivered;
-      }
-      // All messages marked as delivered for the web widget inbox and API inbox once they are sent.
-      if (this.isAWebWidgetInbox || this.isAPIInbox) {
-        return this.isSent;
-      }
-      if (this.isALineChannel) {
-        return this.isDelivered;
-      }
-
-      return false;
-    },
-    showReadIndicator() {
-      if (!this.showStatusIndicators) {
-        return false;
-      }
-      if (
-        this.isAWhatsAppChannel ||
-        this.isATwilioChannel ||
-        this.isAFacebookInbox
-      ) {
-        return this.sourceId && this.isRead;
-      }
-
-      if (this.isAWebWidgetInbox || this.isAPIInbox) {
-        return this.isRead;
-      }
-
-      return false;
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="message-text--metadata">
-    <span
-      class="time"
-      :class="{
-        'has-status-icon':
-          showSentIndicator || showDeliveredIndicator || showReadIndicator,
-      }"
-    >
-      {{ readableTime }}
-    </span>
-    <span v-if="externalError" class="read-indicator-wrap">
-      <fluent-icon
-        v-tooltip.top-start="externalError"
-        icon="error-circle"
-        class="action--icon"
-        size="14"
-      />
-    </span>
-    <span v-if="showReadIndicator" class="read-indicator-wrap">
-      <fluent-icon
-        v-tooltip.top-start="$t('CHAT_LIST.MESSAGE_READ')"
-        icon="checkmark-double"
-        class="action--icon read-tick read-indicator"
-        size="14"
-      />
-    </span>
-    <span v-else-if="showDeliveredIndicator" class="read-indicator-wrap">
-      <fluent-icon
-        v-tooltip.top-start="$t('CHAT_LIST.DELIVERED')"
-        icon="checkmark-double"
-        class="action--icon read-tick"
-        size="14"
-      />
-    </span>
-    <span v-else-if="showSentIndicator" class="read-indicator-wrap">
-      <fluent-icon
-        v-tooltip.top-start="$t('CHAT_LIST.SENT')"
-        icon="checkmark"
-        class="action--icon read-tick"
-        size="14"
-      />
-    </span>
-    <fluent-icon
-      v-if="isEmail"
-      v-tooltip.top-start="$t('CHAT_LIST.RECEIVED_VIA_EMAIL')"
-      icon="mail"
-      class="action--icon"
-      size="16"
-    />
-    <fluent-icon
-      v-if="isPrivate"
-      v-tooltip.top-start="$t('CONVERSATION.VISIBLE_TO_AGENTS')"
-      icon="lock-closed"
-      class="action--icon lock--icon--private"
-      size="16"
-      @mouseenter="isHovered = true"
-      @mouseleave="isHovered = false"
-    />
-    <a
-      v-if="isATweet && (isOutgoing || isIncoming) && linkToTweet"
-      :href="linkToTweet"
-      target="_blank"
-      rel="noopener noreferrer nofollow"
-    >
-      <fluent-icon
-        v-tooltip.top-start="$t('CHAT_LIST.VIEW_TWEET_IN_TWITTER')"
-        icon="open"
-        class="cursor-pointer action--icon"
-        size="16"
-      />
-    </a>
-  </div>
-</template>
-
-<style lang="scss" scoped>
-.right {
-  .message-text--metadata {
-    @apply items-center;
-    .time {
-      @apply text-woot-100 dark:text-woot-100;
-    }
-
-    .action--icon {
-      @apply text-white dark:text-white;
-
-      &.read-tick {
-        @apply text-violet-100 dark:text-violet-100;
-      }
-
-      &.read-indicator {
-        @apply text-green-200 dark:text-green-200;
-      }
-    }
-
-    .lock--icon--private {
-      @apply text-slate-400 dark:text-slate-400;
-    }
-  }
-}
-
-.left {
-  .message-text--metadata {
-    .time {
-      @apply text-slate-400 dark:text-slate-200;
-    }
-  }
-}
-
-.message-text--metadata {
-  @apply items-start flex;
-
-  .time {
-    @apply mr-2 block text-xxs leading-[1.8];
-  }
-
-  .action--icon {
-    @apply mr-2 ml-2 text-slate-900 dark:text-slate-100;
-  }
-
-  a {
-    @apply text-slate-900 dark:text-slate-100;
-  }
-}
-
-.activity-wrap {
-  .message-text--metadata {
-    .time {
-      @apply ml-2 rtl:mr-2 rtl:ml-0 flex text-center text-xxs text-slate-300 dark:text-slate-200;
-    }
-  }
-}
-
-.is-image,
-.is-video {
-  .message-text--metadata {
-    .time {
-      @apply bottom-1 text-white dark:text-slate-50 absolute right-2 whitespace-nowrap;
-
-      &.has-status-icon {
-        @apply right-8 leading-loose;
-      }
-    }
-    .read-tick {
-      @apply absolute bottom-2 right-2;
-    }
-  }
-}
-
-.is-private {
-  .message-text--metadata {
-    @apply items-center;
-
-    .time {
-      @apply text-slate-400 dark:text-slate-400;
-    }
-
-    .icon {
-      @apply text-slate-400 dark:text-slate-400;
-    }
-  }
-
-  &.is-image,
-  &.is-video {
-    .time {
-      position: inherit;
-      @apply pl-2.5;
-    }
-  }
-}
-
-.delivered-icon {
-  @apply ml-4;
-}
-
-.read-indicator-wrap {
-  @apply leading-none flex items-center;
-}
-</style>
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/Contact.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/Contact.vue
deleted file mode 100644
index 313a5943d..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/Contact.vue
+++ /dev/null
@@ -1,123 +0,0 @@
-<script>
-import { useAlert } from 'dashboard/composables';
-import {
-  DuplicateContactException,
-  ExceptionWithMessage,
-} from 'shared/helpers/CustomErrors';
-import NextButton from 'dashboard/components-next/button/Button.vue';
-
-export default {
-  components: {
-    NextButton,
-  },
-  props: {
-    name: {
-      type: String,
-      default: '',
-    },
-    phoneNumber: {
-      type: String,
-      default: '',
-    },
-  },
-  computed: {
-    formattedPhoneNumber() {
-      return this.phoneNumber.replace(/\s|-|[A-Za-z]/g, '');
-    },
-    rawPhoneNumber() {
-      return this.phoneNumber.replace(/\D/g, '');
-    },
-  },
-  methods: {
-    async addContact() {
-      try {
-        let contact = await this.filterContactByNumber(this.rawPhoneNumber);
-        if (!contact) {
-          contact = await this.$store.dispatch(
-            'contacts/create',
-            this.getContactObject()
-          );
-          useAlert(this.$t('CONTACT_FORM.SUCCESS_MESSAGE'));
-        }
-        this.openContactNewTab(contact.id);
-      } catch (error) {
-        if (error instanceof DuplicateContactException) {
-          if (error.data.includes('phone_number')) {
-            useAlert(this.$t('CONTACT_FORM.FORM.PHONE_NUMBER.DUPLICATE'));
-          }
-        } else if (error instanceof ExceptionWithMessage) {
-          useAlert(error.data);
-        } else {
-          useAlert(this.$t('CONTACT_FORM.ERROR_MESSAGE'));
-        }
-      }
-    },
-    getContactObject() {
-      const contactItem = {
-        name: this.name,
-        phone_number: `+${this.rawPhoneNumber}`,
-      };
-      return contactItem;
-    },
-    async filterContactByNumber(phoneNumber) {
-      const query = {
-        attribute_key: 'phone_number',
-        filter_operator: 'equal_to',
-        values: [phoneNumber],
-        attribute_model: 'standard',
-        custom_attribute_type: '',
-      };
-
-      const queryPayload = { payload: [query] };
-      const contacts = await this.$store.dispatch('contacts/filter', {
-        queryPayload,
-        resetState: false,
-      });
-      return contacts.shift();
-    },
-    openContactNewTab(contactId) {
-      const accountId = window.location.pathname.split('/')[3];
-      const url = `/app/accounts/${accountId}/contacts/${contactId}`;
-      window.open(url, '_blank');
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="contact--group">
-    <fluent-icon icon="call" class="file--icon" size="18" />
-    <div class="meta">
-      <p
-        class="overflow-hidden whitespace-nowrap text-ellipsis margin-bottom-0"
-      >
-        {{ phoneNumber }}
-      </p>
-    </div>
-    <div v-if="formattedPhoneNumber" class="link-wrap">
-      <NextButton
-        ghost
-        xs
-        :label="$t('CONVERSATION.SAVE_CONTACT')"
-        @click.prevent="addContact"
-      />
-    </div>
-  </div>
-</template>
-
-<style lang="scss" scoped>
-.contact--group {
-  align-items: center;
-  display: flex;
-  margin-top: var(--space-smaller);
-
-  .meta {
-    flex: 1;
-    margin-left: var(--space-small);
-  }
-
-  .link-wrap {
-    margin-left: var(--space-small);
-  }
-}
-</style>
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/File.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/File.vue
deleted file mode 100644
index 7e7fb4e3c..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/File.vue
+++ /dev/null
@@ -1,86 +0,0 @@
-<script>
-export default {
-  props: {
-    url: {
-      type: String,
-      required: true,
-    },
-  },
-  computed: {
-    fileName() {
-      if (this.url) {
-        const filename = this.url.substring(this.url.lastIndexOf('/') + 1);
-        return filename || this.$t('CONVERSATION.UNKNOWN_FILE_TYPE');
-      }
-      return this.$t('CONVERSATION.UNKNOWN_FILE_TYPE');
-    },
-  },
-  methods: {
-    openLink() {
-      const win = window.open(this.url, '_blank', 'noopener');
-      if (win) win.focus();
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="file message-text__wrap">
-    <div class="icon-wrap">
-      <fluent-icon icon="document" class="file--icon" size="32" />
-    </div>
-    <div class="meta">
-      <h5 class="attachment-name text-slate-700 dark:text-slate-400">
-        {{ decodeURI(fileName) }}
-      </h5>
-      <a
-        class="download clear link button small"
-        rel="noreferrer noopener nofollow"
-        target="_blank"
-        :href="url"
-      >
-        {{ $t('CONVERSATION.DOWNLOAD') }}
-      </a>
-    </div>
-  </div>
-</template>
-
-<style lang="scss" scoped>
-@import 'dashboard/assets/scss/variables';
-
-.file {
-  display: flex;
-  flex-direction: row;
-  padding: $space-smaller 0;
-  cursor: pointer;
-
-  .icon-wrap {
-    font-size: $font-size-giga;
-    color: $color-white;
-    line-height: 1;
-    margin-left: $space-smaller;
-    margin-right: $space-slab;
-  }
-
-  .attachment-name {
-    margin: 0;
-    color: $color-white;
-    font-weight: $font-weight-bold;
-    word-break: break-word;
-  }
-
-  .button {
-    padding: 0;
-    margin: 0;
-    color: $color-primary-light;
-  }
-
-  .meta {
-    padding-right: $space-two;
-  }
-
-  .time {
-    min-width: $space-larger;
-  }
-}
-</style>
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/Image.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/Image.vue
deleted file mode 100644
index 1b2fd4201..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/Image.vue
+++ /dev/null
@@ -1,34 +0,0 @@
-<script>
-export default {
-  components: {},
-  props: {
-    url: {
-      type: String,
-      required: true,
-    },
-  },
-  emits: ['error'],
-  data() {
-    return {
-      show: false,
-    };
-  },
-  methods: {
-    onClose() {
-      this.show = false;
-    },
-    onClick() {
-      this.show = true;
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="image message-text__wrap">
-    <img :src="url" @click="onClick" @error="$emit('error')" />
-    <woot-modal v-model:show="show" full-width :on-close="onClose">
-      <img :src="url" class="modal-image skip-context-menu" />
-    </woot-modal>
-  </div>
-</template>
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/ImageAudioVideo.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/ImageAudioVideo.vue
deleted file mode 100644
index de5e3a3cd..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/ImageAudioVideo.vue
+++ /dev/null
@@ -1,127 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-import { hasPressedCommand } from 'shared/helpers/KeyboardHelpers';
-import GalleryView from '../components/GalleryView.vue';
-import { timeStampAppendedURL } from 'dashboard/helper/URLHelper';
-
-const ALLOWED_FILE_TYPES = {
-  IMAGE: 'image',
-  VIDEO: 'video',
-  AUDIO: 'audio',
-  IG_REEL: 'ig_reel',
-};
-
-export default {
-  components: {
-    GalleryView,
-  },
-  props: {
-    attachment: {
-      type: Object,
-      required: true,
-    },
-  },
-  emits: ['error'],
-  data() {
-    return {
-      show: false,
-      isImageError: false,
-    };
-  },
-  computed: {
-    ...mapGetters({
-      currentChatAttachments: 'getSelectedChatAttachments',
-    }),
-    isImage() {
-      return this.attachment.file_type === ALLOWED_FILE_TYPES.IMAGE;
-    },
-    isVideo() {
-      return (
-        this.attachment.file_type === ALLOWED_FILE_TYPES.VIDEO ||
-        this.attachment.file_type === ALLOWED_FILE_TYPES.IG_REEL
-      );
-    },
-    isAudio() {
-      return this.attachment.file_type === ALLOWED_FILE_TYPES.AUDIO;
-    },
-    timeStampURL() {
-      return timeStampAppendedURL(this.dataUrl);
-    },
-    attachmentTypeClasses() {
-      return {
-        image: this.isImage,
-        video: this.isVideo,
-      };
-    },
-    filteredCurrentChatAttachments() {
-      const attachments = this.currentChatAttachments.filter(attachment =>
-        ['image', 'video', 'audio'].includes(attachment.file_type)
-      );
-      return attachments;
-    },
-    dataUrl() {
-      return this.attachment.data_url;
-    },
-    imageWidth() {
-      return this.attachment.width ? `${this.attachment.width}px` : 'auto';
-    },
-    imageHeight() {
-      return this.attachment.height ? `${this.attachment.height}px` : 'auto';
-    },
-  },
-  watch: {
-    attachment() {
-      this.isImageError = false;
-    },
-  },
-  methods: {
-    onClose() {
-      this.show = false;
-    },
-    onClick(e) {
-      if (hasPressedCommand(e)) {
-        window.open(this.attachment.data_url, '_blank');
-        return;
-      }
-      this.show = true;
-    },
-    onImgError() {
-      this.isImageError = true;
-      this.$emit('error');
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="message-text__wrap" :class="attachmentTypeClasses">
-    <img
-      v-if="isImage && !isImageError"
-      class="bg-woot-200 dark:bg-woot-900"
-      :src="dataUrl"
-      :width="imageWidth"
-      :height="imageHeight"
-      @click="onClick"
-      @error="onImgError"
-    />
-    <video
-      v-if="isVideo"
-      :src="dataUrl"
-      muted
-      playsInline
-      @error="onImgError"
-      @click="onClick"
-    />
-    <audio v-else-if="isAudio" controls class="skip-context-menu mb-0.5">
-      <source :src="timeStampURL" />
-    </audio>
-    <GalleryView
-      v-if="show"
-      v-model:show="show"
-      :attachment="attachment"
-      :all-attachments="filteredCurrentChatAttachments"
-      @error="onImgError"
-      @close="onClose"
-    />
-  </div>
-</template>
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/InstagramStory.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/InstagramStory.vue
deleted file mode 100644
index 0ddcfb853..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/InstagramStory.vue
+++ /dev/null
@@ -1,53 +0,0 @@
-<script>
-import BubbleImage from './Image.vue';
-import BubbleVideo from './Video.vue';
-import InstagramStoryErrorPlaceHolder from './InstagramStoryErrorPlaceHolder.vue';
-
-export default {
-  components: {
-    BubbleImage,
-    BubbleVideo,
-    InstagramStoryErrorPlaceHolder,
-  },
-  props: {
-    storyUrl: {
-      type: String,
-      default: '',
-    },
-  },
-  emits: ['error'],
-  data() {
-    return {
-      hasImgStoryError: false,
-      hasVideoStoryError: false,
-    };
-  },
-  methods: {
-    onImageLoadError() {
-      this.hasImgStoryError = true;
-      this.emitError();
-    },
-    onVideoLoadError() {
-      this.hasVideoStoryError = true;
-      this.emitError();
-    },
-    emitError() {
-      this.$emit('error');
-    },
-  },
-};
-</script>
-
-<template>
-  <BubbleImage
-    v-if="!hasImgStoryError"
-    :url="storyUrl"
-    @error="onImageLoadError"
-  />
-  <BubbleVideo
-    v-else-if="!hasVideoStoryError"
-    :url="storyUrl"
-    @error="onVideoLoadError"
-  />
-  <InstagramStoryErrorPlaceHolder v-else />
-</template>
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/InstagramStoryErrorPlaceHolder.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/InstagramStoryErrorPlaceHolder.vue
deleted file mode 100644
index 07781df88..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/InstagramStoryErrorPlaceHolder.vue
+++ /dev/null
@@ -1,14 +0,0 @@
-<script>
-export default {};
-</script>
-
-<template>
-  <div
-    class="flex items-center justify-center px-8 h-28 w-full bg-slate-100 text-slate-700 dark:bg-slate-500 dark:text-slate-75"
-  >
-    <fluent-icon icon="document-error" size="32" />
-    <p class="mb-0 text-slate-700 dark:text-slate-75">
-      {{ $t('COMPONENTS.FILE_BUBBLE.INSTAGRAM_STORY_UNAVAILABLE') }}
-    </p>
-  </div>
-</template>
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/InstagramStoryReply.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/InstagramStoryReply.vue
deleted file mode 100644
index a42f694fd..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/InstagramStoryReply.vue
+++ /dev/null
@@ -1,36 +0,0 @@
-<script>
-import InstagramStory from './InstagramStory.vue';
-
-export default {
-  components: { InstagramStory },
-  props: {
-    storyUrl: {
-      type: String,
-      default: '',
-    },
-  },
-  data() {
-    return {
-      hasImgStoryError: false,
-      hasVideoStoryError: false,
-    };
-  },
-  methods: {
-    onImageLoadError() {
-      this.hasImgStoryError = true;
-    },
-    onVideoLoadError() {
-      this.hasVideoStoryError = true;
-    },
-  },
-};
-</script>
-
-<template>
-  <blockquote
-    class="my-0 px-2 pb-0 pt-0 border-l-4 border-solid border-slate-75 dark:border-slate-600 text-slate-600 dark:text-slate-200"
-  >
-    <span>{{ $t('CONVERSATION.REPLIED_TO_STORY') }}</span>
-    <InstagramStory :story-url="storyUrl" class="mt-3 rounded-md" />
-  </blockquote>
-</template>
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/Integration.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/Integration.vue
deleted file mode 100644
index fd8fb9212..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/Integration.vue
+++ /dev/null
@@ -1,41 +0,0 @@
-<script>
-import DyteVideoCall from './integrations/Dyte.vue';
-import inboxMixin from 'shared/mixins/inboxMixin';
-
-export default {
-  components: { DyteVideoCall },
-  mixins: [inboxMixin],
-  props: {
-    messageId: {
-      type: [String, Number],
-      default: 0,
-    },
-    contentAttributes: {
-      type: Object,
-      default: () => ({}),
-    },
-    inboxId: {
-      type: [String, Number],
-      default: 0,
-    },
-  },
-  computed: {
-    showDyteIntegration() {
-      const isEnabledOnTheInbox = this.isAPIInbox || this.isAWebWidgetInbox;
-      return isEnabledOnTheInbox && this.contentAttributes.type === 'dyte';
-    },
-    inbox() {
-      return this.$store.getters['inboxes/getInbox'](this.inboxId);
-    },
-  },
-};
-</script>
-
-<!-- eslint-disable-next-line vue/no-root-v-if -->
-<template>
-  <DyteVideoCall
-    v-if="showDyteIntegration"
-    :message-id="messageId"
-    :meeting-data="contentAttributes.data"
-  />
-</template>
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/Location.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/Location.vue
deleted file mode 100644
index e72233b88..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/Location.vue
+++ /dev/null
@@ -1,52 +0,0 @@
-<script setup>
-import { computed } from 'vue';
-
-const props = defineProps({
-  latitude: {
-    type: Number,
-    default: undefined,
-  },
-  longitude: {
-    type: Number,
-    default: undefined,
-  },
-  name: {
-    type: String,
-    default: '',
-  },
-});
-
-const mapUrl = computed(
-  () => `https://maps.google.com/?q=${props.latitude},${props.longitude}`
-);
-</script>
-
-<template>
-  <div
-    class="flex flex-row items-center justify-start gap-1 w-full py-1 px-0 cursor-pointer overflow-hidden"
-  >
-    <fluent-icon
-      icon="location"
-      class="text-slate-600 dark:text-slate-200 leading-none my-0 flex items-center flex-shrink-0"
-      size="32"
-    />
-    <div class="flex flex-col items-start flex-1 min-w-0">
-      <h5
-        class="text-sm text-slate-800 dark:text-slate-100 truncate m-0 w-full"
-        :title="name"
-      >
-        {{ name }}
-      </h5>
-      <div class="flex items-center">
-        <a
-          class="text-woot-600 dark:text-woot-600 text-xs underline"
-          rel="noreferrer noopener nofollow"
-          target="_blank"
-          :href="mapUrl"
-        >
-          {{ $t('COMPONENTS.LOCATION_BUBBLE.SEE_ON_MAP') }}
-        </a>
-      </div>
-    </div>
-  </div>
-</template>
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/MailHead.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/MailHead.vue
deleted file mode 100644
index 9e0b8ef0d..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/MailHead.vue
+++ /dev/null
@@ -1,100 +0,0 @@
-<script>
-export default {
-  props: {
-    emailAttributes: {
-      type: Object,
-      default: () => ({}),
-    },
-    isIncoming: {
-      type: Boolean,
-      default: true,
-    },
-    cc: {
-      type: Array,
-      default: () => [],
-    },
-    bcc: {
-      type: Array,
-      default: () => [],
-    },
-  },
-  computed: {
-    fromMail() {
-      const from = this.emailAttributes.from || [];
-      return from.join(', ');
-    },
-    toMails() {
-      const to = this.emailAttributes.to || [];
-      return to.join(', ');
-    },
-    ccMails() {
-      const cc = this.emailAttributes.cc || this.cc || [];
-      return cc.join(', ');
-    },
-    bccMails() {
-      const bcc = this.emailAttributes.bcc || this.bcc || [];
-      return bcc.join(', ');
-    },
-    subject() {
-      return this.emailAttributes.subject || '';
-    },
-    showHead() {
-      return this.toMails || this.ccMails || this.bccMails || this.fromMail;
-    },
-  },
-};
-</script>
-
-<!-- eslint-disable-next-line vue/no-root-v-if -->
-<template>
-  <div
-    v-if="showHead"
-    class="message__mail-head"
-    :class="{ 'is-incoming': isIncoming }"
-  >
-    <div v-if="fromMail" class="meta-wrap">
-      <span class="message__content--type">{{ $t('EMAIL_HEADER.FROM') }}:</span>
-      <span>{{ fromMail }}</span>
-    </div>
-    <div v-if="toMails" class="meta-wrap">
-      <span class="message__content--type">{{ $t('EMAIL_HEADER.TO') }}:</span>
-      <span>{{ toMails }}</span>
-    </div>
-    <div v-if="ccMails" class="meta-wrap">
-      <span class="message__content--type">{{ $t('EMAIL_HEADER.CC') }}:</span>
-      <span>{{ ccMails }}</span>
-    </div>
-    <div v-if="bccMails" class="meta-wrap">
-      <span class="message__content--type">{{ $t('EMAIL_HEADER.BCC') }}:</span>
-      <span>{{ bccMails }}</span>
-    </div>
-    <div v-if="subject" class="meta-wrap">
-      <span class="message__content--type">
-        {{ $t('EMAIL_HEADER.SUBJECT') }}:
-      </span>
-      <span>{{ subject }}</span>
-    </div>
-  </div>
-</template>
-
-<style lang="scss" scoped>
-.message__mail-head {
-  padding-bottom: var(--space-small);
-  margin-bottom: var(--space-small);
-  border-bottom: 1px solid var(--w-300);
-
-  &.is-incoming {
-    border-bottom: 1px solid var(--color-border-light);
-  }
-}
-
-.meta-wrap {
-  .message__content--type {
-    font-weight: var(--font-weight-bold);
-    font-size: var(--font-size-mini);
-  }
-  span {
-    font-size: var(--font-size-mini);
-  }
-}
-</style>
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/ReplyTo.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/ReplyTo.vue
deleted file mode 100644
index e11f1a17e..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/ReplyTo.vue
+++ /dev/null
@@ -1,57 +0,0 @@
-<script>
-import MessagePreview from 'dashboard/components/widgets/conversation/MessagePreview.vue';
-import { MESSAGE_TYPE } from 'shared/constants/messages';
-import { BUS_EVENTS } from 'shared/constants/busEvents';
-import { emitter } from 'shared/helpers/mitt';
-
-export default {
-  name: 'ReplyTo',
-  components: {
-    MessagePreview,
-  },
-  props: {
-    message: {
-      type: Object,
-      required: true,
-    },
-    messageType: {
-      type: Number,
-      required: true,
-    },
-    parentHasAttachments: {
-      type: Boolean,
-      required: true,
-    },
-  },
-  data() {
-    return { MESSAGE_TYPE };
-  },
-  methods: {
-    scrollToMessage() {
-      emitter.emit(BUS_EVENTS.SCROLL_TO_MESSAGE, {
-        messageId: this.message.id,
-      });
-    },
-  },
-};
-</script>
-
-<template>
-  <div
-    class="px-2 py-1.5 rounded-sm min-w-[10rem] mb-2"
-    :class="{
-      'bg-slate-50 dark:bg-slate-600 dark:text-slate-50':
-        messageType === MESSAGE_TYPE.INCOMING,
-      'bg-woot-600 text-woot-50': messageType === MESSAGE_TYPE.OUTGOING,
-      '-mx-2': !parentHasAttachments,
-    }"
-    @click="scrollToMessage"
-  >
-    <MessagePreview
-      class="cursor-pointer"
-      :message="message"
-      :show-message-type="false"
-      :default-empty-message="$t('CONVERSATION.REPLY_MESSAGE_NOT_FOUND')"
-    />
-  </div>
-</template>
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/Text.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/Text.vue
deleted file mode 100644
index 6500cbc35..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/Text.vue
+++ /dev/null
@@ -1,162 +0,0 @@
-<script>
-import { Letter } from 'vue-letter';
-import GalleryView from '../components/GalleryView.vue';
-
-export default {
-  components: { Letter, GalleryView },
-  props: {
-    message: {
-      type: String,
-      default: '',
-    },
-    isEmail: {
-      type: Boolean,
-      default: true,
-    },
-    displayQuotedButton: {
-      type: Boolean,
-      default: false,
-    },
-  },
-  data() {
-    return {
-      showQuotedContent: false,
-      showGalleryViewer: false,
-      attachment: {},
-      availableAttachments: [],
-    };
-  },
-  computed: {
-    isQuotedContentPresent() {
-      if (!this.isEmail) {
-        return this.message.includes('<blockquote');
-      }
-      return this.showQuotedContent;
-    },
-    showQuoteToggle() {
-      if (!this.isEmail) {
-        return false;
-      }
-      return this.displayQuotedButton;
-    },
-  },
-  methods: {
-    toggleQuotedContent() {
-      this.showQuotedContent = !this.showQuotedContent;
-    },
-    handleClickOnContent(event) {
-      // if event target is IMG and not close in A tag
-      // then open image preview
-      const isImageElement = event.target.tagName === 'IMG';
-      const isWrappedInLink = event.target.closest('A');
-
-      if (isImageElement && !isWrappedInLink) {
-        this.openImagePreview(event.target.src);
-      }
-    },
-    openImagePreview(src) {
-      this.showGalleryViewer = true;
-      this.attachment = {
-        file_type: 'image',
-        data_url: src,
-        message_id: Math.floor(Math.random() * 100),
-      };
-      this.availableAttachments = [{ ...this.attachment }];
-    },
-    onClose() {
-      this.showGalleryViewer = false;
-      this.resetAttachmentData();
-    },
-    resetAttachmentData() {
-      this.attachment = {};
-      this.availableAttachments = [];
-    },
-  },
-};
-</script>
-
-<template>
-  <div
-    class="message-text__wrap"
-    :class="{
-      'show--quoted': isQuotedContentPresent,
-      'hide--quoted': !isQuotedContentPresent,
-    }"
-  >
-    <div v-if="!isEmail" v-dompurify-html="message" class="text-content" />
-    <div v-else @click="handleClickOnContent">
-      <Letter
-        class="text-content bg-white dark:bg-white text-slate-900 dark:text-slate-900 p-2 rounded-[4px]"
-        :html="message"
-      />
-    </div>
-    <button
-      v-if="showQuoteToggle"
-      class="py-1 text-xs cursor-pointer text-slate-300 dark:text-slate-300"
-      @click="toggleQuotedContent"
-    >
-      <span v-if="showQuotedContent" class="flex items-center gap-0.5">
-        <fluent-icon icon="chevron-up" size="16" />
-        {{ $t('CHAT_LIST.HIDE_QUOTED_TEXT') }}
-      </span>
-      <span v-else class="flex items-center gap-0.5">
-        <fluent-icon icon="chevron-down" size="16" />
-        {{ $t('CHAT_LIST.SHOW_QUOTED_TEXT') }}
-      </span>
-    </button>
-    <GalleryView
-      v-if="showGalleryViewer"
-      v-model:show="showGalleryViewer"
-      :attachment="attachment"
-      :all-attachments="availableAttachments"
-      @error="onClose"
-      @close="onClose"
-    />
-  </div>
-</template>
-
-<style lang="scss">
-.text-content {
-  overflow: auto;
-
-  ul,
-  ol {
-    padding-left: var(--space-two);
-  }
-
-  table {
-    margin: 0;
-    border: 0;
-
-    td {
-      margin: 0;
-      border: 0;
-    }
-
-    tr {
-      border-bottom: 0 !important;
-    }
-  }
-
-  h1,
-  h2,
-  h3,
-  h4,
-  h5,
-  h6 {
-    font-size: var(--font-size-normal);
-  }
-}
-
-.show--quoted {
-  blockquote {
-    @apply block;
-  }
-}
-
-.hide--quoted {
-  blockquote {
-    @apply hidden;
-  }
-}
-</style>
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/Video.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/Video.vue
deleted file mode 100644
index cdfe90f5a..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/Video.vue
+++ /dev/null
@@ -1,43 +0,0 @@
-<script>
-export default {
-  props: {
-    url: {
-      type: String,
-      required: true,
-    },
-  },
-  emits: ['error'],
-  data() {
-    return {
-      show: false,
-    };
-  },
-  mounted() {
-    this.$refs.videoElement.onerror = () => {
-      this.$emit('error');
-    };
-  },
-  methods: {
-    onClose() {
-      this.show = false;
-    },
-    onClick() {
-      this.show = true;
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="video message-text__wrap">
-    <video ref="videoElement" :src="url" muted playsInline @click="onClick" />
-    <woot-modal v-model:show="show" :on-close="onClose">
-      <video
-        :src="url"
-        controls
-        playsInline
-        class="modal-video skip-context-menu mx-auto"
-      />
-    </woot-modal>
-  </div>
-</template>
diff --git a/app/javascript/dashboard/components/widgets/conversation/bubble/integrations/Dyte.vue b/app/javascript/dashboard/components/widgets/conversation/bubble/integrations/Dyte.vue
deleted file mode 100644
index 0b41d00f0..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/bubble/integrations/Dyte.vue
+++ /dev/null
@@ -1,98 +0,0 @@
-<script>
-import DyteAPI from 'dashboard/api/integrations/dyte';
-import { buildDyteURL } from 'shared/helpers/IntegrationHelper';
-import { useAlert } from 'dashboard/composables';
-import NextButton from 'dashboard/components-next/button/Button.vue';
-
-export default {
-  components: {
-    NextButton,
-  },
-  props: {
-    messageId: {
-      type: Number,
-      required: true,
-    },
-  },
-  data() {
-    return { isLoading: false, dyteAuthToken: '', isSDKMounted: false };
-  },
-  computed: {
-    meetingLink() {
-      return buildDyteURL(this.dyteAuthToken);
-    },
-  },
-  methods: {
-    async joinTheCall() {
-      this.isLoading = true;
-      try {
-        const { data: { token } = {} } = await DyteAPI.addParticipantToMeeting(
-          this.messageId
-        );
-        this.dyteAuthToken = token;
-      } catch (err) {
-        useAlert(this.$t('INTEGRATION_SETTINGS.DYTE.JOIN_ERROR'));
-      } finally {
-        this.isLoading = false;
-      }
-    },
-    leaveTheRoom() {
-      this.dyteAuthToken = '';
-    },
-  },
-};
-</script>
-
-<template>
-  <div>
-    <NextButton
-      blue
-      sm
-      icon="i-lucide-video"
-      :label="$t('INTEGRATION_SETTINGS.DYTE.CLICK_HERE_TO_JOIN')"
-      :is-loading="isLoading"
-      @click="joinTheCall"
-    />
-    <div v-if="dyteAuthToken" class="video-call--container">
-      <iframe
-        :src="meetingLink"
-        allow="camera;microphone;fullscreen;display-capture;picture-in-picture;clipboard-write;"
-      />
-      <NextButton
-        sm
-        class="mt-2"
-        :label="$t('INTEGRATION_SETTINGS.DYTE.LEAVE_THE_ROOM')"
-        @click="leaveTheRoom"
-      />
-    </div>
-  </div>
-</template>
-
-<style lang="scss">
-.join-call-button {
-  margin: var(--space-small) 0;
-}
-
-.video-call--container {
-  position: fixed;
-  bottom: 0;
-  right: 0;
-  width: 100%;
-  height: 100%;
-  z-index: var(--z-index-high);
-  padding: var(--space-smaller);
-  background: var(--b-800);
-
-  iframe {
-    width: 100%;
-    height: 100%;
-    border: 0;
-  }
-
-  button {
-    position: absolute;
-    top: var(--space-smaller);
-    right: 10rem;
-  }
-}
-</style>
diff --git a/app/javascript/dashboard/components/widgets/conversation/contextMenu/agentLoadingPlaceholder.vue b/app/javascript/dashboard/components/widgets/conversation/contextMenu/agentLoadingPlaceholder.vue
index f62117f96..e21ae1438 100644
--- a/app/javascript/dashboard/components/widgets/conversation/contextMenu/agentLoadingPlaceholder.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/contextMenu/agentLoadingPlaceholder.vue
@@ -21,11 +21,11 @@ export default {
   align-items: center;
   flex-direction: column;
   justify-content: center;
-  padding: var(--space-normal) 0;
-  min-width: calc(var(--space-mega) * 2);
+  padding: 1rem 0;
+  min-width: calc(6.25rem * 2);
 
   p {
-    margin: var(--space-small) 0 0 0;
+    margin: 0.5rem 0 0 0;
   }
 }
 </style>
diff --git a/app/javascript/dashboard/components/widgets/conversation/contextMenu/menuItem.vue b/app/javascript/dashboard/components/widgets/conversation/contextMenu/menuItem.vue
index 2b58e9389..4c24d9405 100644
--- a/app/javascript/dashboard/components/widgets/conversation/contextMenu/menuItem.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/contextMenu/menuItem.vue
@@ -18,10 +18,7 @@ export default {
 </script>
 
 <template>
-  <div
-    class="menu text-slate-800 dark:text-slate-100 min-h-7 min-w-0"
-    role="button"
-  >
+  <div class="menu text-n-slate-12 min-h-7 min-w-0" role="button">
     <fluent-icon
       v-if="variant === 'icon' && option.icon"
       :icon="option.icon"
@@ -49,7 +46,7 @@ export default {
 
 <style scoped lang="scss">
 .menu {
-  width: calc(var(--space-mega) * 2);
+  width: calc(6.25rem * 2);
   @apply flex items-center flex-nowrap p-1 rounded-md overflow-hidden cursor-pointer;
 
   .menu-label {
@@ -57,7 +54,7 @@ export default {
   }
 
   &:hover {
-    @apply bg-n-brand text-white dark:text-slate-50;
+    @apply bg-n-brand text-white;
   }
 }
 
diff --git a/app/javascript/dashboard/components/widgets/conversation/contextMenu/menuItemWithSubmenu.vue b/app/javascript/dashboard/components/widgets/conversation/contextMenu/menuItemWithSubmenu.vue
index a601c92d3..32fc71890 100644
--- a/app/javascript/dashboard/components/widgets/conversation/contextMenu/menuItemWithSubmenu.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/contextMenu/menuItemWithSubmenu.vue
@@ -40,7 +40,7 @@ const submenuPosition = computed(() => [
 <template>
   <div
     ref="menuRef"
-    class="text-slate-800 dark:text-slate-100 menu-with-submenu min-width-calc w-full p-1 flex items-center h-7 rounded-md relative bg-n-alpha-3/50 backdrop-blur-[100px] justify-between hover:bg-n-brand/10 cursor-pointer dark:hover:bg-n-solid-3"
+    class="text-n-slate-12 menu-with-submenu min-width-calc w-full p-1 flex items-center h-7 rounded-md relative bg-n-alpha-3/50 backdrop-blur-[100px] justify-between hover:bg-n-brand/10 cursor-pointer dark:hover:bg-n-solid-3"
     :class="!subMenuAvailable ? 'opacity-50 cursor-not-allowed' : ''"
   >
     <div class="flex items-center h-4">
diff --git a/app/javascript/dashboard/components/widgets/conversation/conversation/LabelSuggestion.vue b/app/javascript/dashboard/components/widgets/conversation/conversation/LabelSuggestion.vue
index aafd59f3e..6b4397ff9 100644
--- a/app/javascript/dashboard/components/widgets/conversation/conversation/LabelSuggestion.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/conversation/LabelSuggestion.vue
@@ -154,7 +154,7 @@ export default {
 <template>
   <li
     v-if="shouldShowSuggestions"
-    class="label-suggestion right"
+    class="label-suggestion right list-none"
     @mouseover="isHovered = true"
     @mouseleave="isHovered = false"
   >
@@ -180,9 +180,7 @@ export default {
             <woot-label
               variant="dashed"
               v-bind="label"
-              :bg-color="
-                selectedLabels.includes(label.title) ? 'var(--w-100)' : ''
-              "
+              :bg-color="selectedLabels.includes(label.title) ? '#2781F6' : ''"
             />
           </button>
           <NextButton
@@ -253,17 +251,14 @@ export default {
 .label-suggestion {
   flex-direction: row;
   justify-content: flex-end;
-  margin-top: var(--space-normal);
+  margin-top: 1rem;
 
   .label-suggestion--container {
     max-width: 300px;
   }
 
   .label-suggestion--options {
-    text-align: right;
-    display: flex;
-    align-items: center;
-    gap: var(--space-micro);
+    @apply gap-0.5 text-end flex items-center;
 
     button.label-suggestion--option {
       .label {
@@ -274,14 +269,12 @@ export default {
   }
 
   .chatwoot-ai-icon {
-    height: var(--font-size-mini);
-    width: var(--font-size-mini);
+    height: 0.75rem;
+    width: 0.75rem;
   }
 
   .label-suggestion--title {
-    color: var(--b-600);
-    margin-top: var(--space-micro);
-    font-size: var(--font-size-micro);
+    @apply text-n-slate-11 mt-0.5 text-xxs;
   }
 }
 </style>
diff --git a/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/AgentSelector.vue b/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/AgentSelector.vue
index 22443d118..f4f38cbb1 100644
--- a/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/AgentSelector.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/AgentSelector.vue
@@ -129,7 +129,7 @@ export default {
                 :username="agent.name"
                 size="22px"
               />
-              <span class="my-0 text-slate-800 dark:text-slate-75">
+              <span class="my-0 text-n-slate-12">
                 {{ agent.name }}
               </span>
             </div>
@@ -181,7 +181,7 @@ export default {
 
 <style scoped lang="scss">
 .bulk-action__agents {
-  @apply max-w-[75%] absolute right-2 top-12 origin-top-right w-auto z-20 min-w-[15rem] bg-n-alpha-3 backdrop-blur-[100px] border-n-weak rounded-lg border border-solid shadow-md;
+  @apply max-w-[75%] absolute ltr:right-2 rtl:left-2 top-12 origin-top-right w-auto z-20 min-w-[15rem] bg-n-alpha-3 backdrop-blur-[100px] border-n-weak rounded-lg border border-solid shadow-md;
   .header {
     @apply p-2.5;
 
@@ -198,7 +198,7 @@ export default {
     .agent-list-search {
       @apply py-0 px-2.5 bg-n-alpha-black2 border border-solid border-n-strong rounded-md;
       .search-icon {
-        @apply text-slate-400 dark:text-slate-200;
+        @apply text-n-slate-10;
       }
 
       .agent--search_input {
@@ -207,8 +207,7 @@ export default {
     }
   }
   .triangle {
-    right: var(--triangle-position);
-    @apply block z-10 absolute -top-3 text-left;
+    @apply block z-10 absolute -top-3 text-left ltr:right-[--triangle-position] rtl:left-[--triangle-position];
 
     svg path {
       @apply fill-n-alpha-3 backdrop-blur-[100px]  stroke-n-weak;
@@ -248,6 +247,6 @@ ul {
 }
 
 .agent__list-loading {
-  @apply m-2.5 rounded-md bg-slate-25 dark:bg-slate-900 flex items-center justify-center flex-col p-5 h-[calc(95%-6.25rem)];
+  @apply m-2.5 rounded-md dark:bg-n-solid-3 bg-n-slate-2 flex items-center justify-center flex-col p-5 h-[calc(95%-6.25rem)];
 }
 </style>
diff --git a/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/Index.vue b/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/Index.vue
index 0cc9a50ba..e36e94ac6 100644
--- a/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/Index.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/Index.vue
@@ -262,15 +262,6 @@ export default {
 </template>
 
 <style scoped lang="scss">
-// For RTL direction view
-.app-rtl--wrapper {
-  .bulk-action__actions {
-    ::v-deep .button--only-icon:last-child {
-      margin-right: var(--space-smaller);
-    }
-  }
-}
-
 .bulk-action__container {
   @apply p-4 relative border-b border-solid border-n-strong dark:border-n-weak;
 }
@@ -288,7 +279,7 @@ export default {
 }
 
 .bulk-action__alert {
-  @apply bg-yellow-50 text-yellow-700 rounded text-xs mt-2 py-1 px-2 border border-solid border-yellow-300 dark:border-yellow-300/10 dark:bg-yellow-200/20 dark:text-yellow-400;
+  @apply bg-n-amber-3 text-n-amber-12 rounded text-xs mt-2 py-1 px-2 border border-solid border-n-amber-5;
 }
 
 .popover-animation-enter-active,
diff --git a/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/LabelActions.vue b/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/LabelActions.vue
index 78b93f0de..9bb8f0ccf 100644
--- a/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/LabelActions.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/LabelActions.vue
@@ -130,7 +130,7 @@ export default {
   @apply bg-n-alpha-black2 py-0 px-2.5 border border-solid border-n-strong rounded-md;
 
   .search-icon {
-    @apply text-slate-400 dark:text-slate-200;
+    @apply text-n-slate-10;
   }
 
   .label--search_input {
@@ -139,7 +139,7 @@ export default {
 }
 
 .labels-container {
-  @apply absolute right-2 top-12 origin-top-right w-auto z-20 max-w-[15rem] min-w-[15rem] bg-n-alpha-3 backdrop-blur-[100px] border-n-weak rounded-lg border border-solid shadow-md;
+  @apply absolute ltr:right-2 rtl:left-2 top-12 origin-top-right w-auto z-20 max-w-[15rem] min-w-[15rem] bg-n-alpha-3 backdrop-blur-[100px] border-n-weak rounded-lg border border-solid shadow-md;
 
   .header {
     @apply p-2.5;
@@ -158,8 +158,7 @@ export default {
   }
 
   .triangle {
-    right: var(--triangle-position);
-    @apply block z-10 absolute text-left -top-3;
+    @apply block z-10 absolute text-left -top-3 ltr:right-[--triangle-position] rtl:left-[--triangle-position];
 
     svg path {
       @apply fill-n-alpha-3 backdrop-blur-[100px]  stroke-n-weak;
@@ -182,7 +181,7 @@ ul {
     @apply items-center rounded-md cursor-pointer flex py-1 px-2.5 hover:bg-n-slate-3 dark:hover:bg-n-solid-3;
 
     &.label-selected {
-      @apply bg-slate-50 dark:bg-slate-900;
+      @apply bg-n-slate-2;
     }
 
     span {
@@ -190,7 +189,7 @@ ul {
     }
 
     .label-checkbox {
-      @apply my-0 mr-2.5 ml-0;
+      @apply my-0 ltr:mr-2.5 rtl:ml-2.5;
     }
 
     .label-title {
@@ -198,7 +197,7 @@ ul {
     }
 
     .label-pill {
-      @apply bg-slate-50 rounded-md h-3 w-3 flex-shrink-0 border border-solid border-n-weak;
+      @apply rounded-md h-3 w-3 flex-shrink-0 border border-solid border-n-weak;
     }
   }
 }
@@ -206,12 +205,4 @@ ul {
 .search-container {
   @apply bg-n-alpha-3 backdrop-blur-[100px] py-0 px-2.5 sticky top-0 z-20;
 }
-
-.actions-container {
-  @apply bg-white dark:bg-slate-900 bottom-0 p-2 sticky z-20;
-
-  button {
-    @apply w-full;
-  }
-}
 </style>
diff --git a/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/TeamActions.vue b/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/TeamActions.vue
index fae209692..2bb6bd893 100644
--- a/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/TeamActions.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/TeamActions.vue
@@ -66,9 +66,7 @@ export default {
           <template v-if="filteredTeams.length">
             <li v-for="team in filteredTeams" :key="team.id">
               <div class="team__list-item" @click="assignTeam(team)">
-                <span
-                  class="my-0 ltr:ml-2 rtl:mr-2 text-slate-800 dark:text-slate-75"
-                >
+                <span class="my-0 ltr:ml-2 rtl:mr-2 text-n-slate-12">
                   {{ team.name }}
                 </span>
               </div>
@@ -76,9 +74,7 @@ export default {
           </template>
           <li v-else>
             <div class="team__list-item">
-              <span
-                class="my-0 ltr:ml-2 rtl:mr-2 text-slate-800 dark:text-slate-75"
-              >
+              <span class="my-0 ltr:ml-2 rtl:mr-2 text-n-slate-12">
                 {{ $t('BULK_ACTION.TEAMS.NO_TEAMS_AVAILABLE') }}
               </span>
             </div>
@@ -91,7 +87,7 @@ export default {
 
 <style scoped lang="scss">
 .bulk-action__teams {
-  @apply max-w-[75%] absolute right-2 top-12 origin-top-right w-auto z-20 min-w-[15rem] bg-n-alpha-3 backdrop-blur-[100px] border-n-weak rounded-lg border border-solid shadow-md;
+  @apply max-w-[75%] absolute ltr:right-2 rtl:left-2 top-12 origin-top-right w-auto z-20 min-w-[15rem] bg-n-alpha-3 backdrop-blur-[100px] border-n-weak rounded-lg border border-solid shadow-md;
   .header {
     @apply p-2.5;
 
@@ -108,7 +104,7 @@ export default {
     .agent-list-search {
       @apply py-0 px-2.5 bg-n-alpha-black2 border border-solid border-n-strong rounded-md;
       .search-icon {
-        @apply text-slate-400 dark:text-slate-200;
+        @apply text-n-slate-10;
       }
 
       .agent--search_input {
@@ -117,8 +113,7 @@ export default {
     }
   }
   .triangle {
-    right: var(--triangle-position);
-    @apply block z-10 absolute text-left -top-3;
+    @apply block z-10 absolute text-left -top-3 ltr:right-[--triangle-position] rtl:left-[--triangle-position];
 
     svg path {
       @apply fill-n-alpha-3 backdrop-blur-[100px]  stroke-n-weak;
diff --git a/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/UpdateActions.vue b/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/UpdateActions.vue
index fe40b048d..e3280c5af 100644
--- a/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/UpdateActions.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/conversationBulkActions/UpdateActions.vue
@@ -68,7 +68,7 @@ const actionLabel = key => {
 <template>
   <div
     v-on-clickaway="onClose"
-    class="absolute z-20 w-auto origin-top-right border border-solid rounded-lg shadow-md right-2 top-12 bg-n-alpha-3 backdrop-blur-[100px] border-n-weak"
+    class="absolute z-20 w-auto origin-top-right border border-solid rounded-lg shadow-md ltr:right-2 rtl:left-2 top-12 bg-n-alpha-3 backdrop-blur-[100px] border-n-weak"
   >
     <div
       class="right-[var(--triangle-position)] block z-10 absolute text-left -top-3"
@@ -83,7 +83,7 @@ const actionLabel = key => {
       </svg>
     </div>
     <div class="p-2.5 flex gap-1 items-center justify-between">
-      <span class="text-sm font-medium text-slate-600 dark:text-slate-100">
+      <span class="text-sm font-medium text-n-slate-12">
         {{ $t('BULK_ACTION.UPDATE.CHANGE_STATUS') }}
       </span>
       <Button ghost xs slate icon="i-lucide-x" @click="onClose" />
@@ -96,7 +96,7 @@ const actionLabel = key => {
               ghost
               sm
               slate
-              class="!w-full ltr:!justify-start rtl:!justify-end"
+              class="!w-full !justify-start"
               :icon="action.icon"
               :label="actionLabel(action.key)"
               @click="updateConversations(action.key)"
diff --git a/app/javascript/dashboard/components/widgets/conversation/conversationCardComponents/CardLabels.vue b/app/javascript/dashboard/components/widgets/conversation/conversationCardComponents/CardLabels.vue
index 65260444e..c07c73010 100644
--- a/app/javascript/dashboard/components/widgets/conversation/conversationCardComponents/CardLabels.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/conversationCardComponents/CardLabels.vue
@@ -86,7 +86,7 @@ const onShowLabels = e => {
             ? $t('CONVERSATION.CARD.HIDE_LABELS')
             : $t('CONVERSATION.CARD.SHOW_LABELS')
         "
-        class="h-5 py-0 px-1 flex-shrink-0 mr-6 ml-0 rtl:ml-6 rtl:mr-0 rtl:rotate-180 text-slate-700 dark:text-slate-200 border-n-strong dark:border-n-strong"
+        class="h-5 py-0 px-1 flex-shrink-0 mr-6 ml-0 rtl:ml-6 rtl:mr-0 rtl:rotate-180 text-n-slate-11 border-n-strong dark:border-n-strong"
         @click="onShowLabels"
       >
         <fluent-icon
diff --git a/app/javascript/dashboard/components/widgets/conversation/helpers/botMessageContentHelper.js b/app/javascript/dashboard/components/widgets/conversation/helpers/botMessageContentHelper.js
deleted file mode 100644
index 2f4521f72..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/helpers/botMessageContentHelper.js
+++ /dev/null
@@ -1,87 +0,0 @@
-import { CSAT_RATINGS } from '../../../../../shared/constants/messages';
-
-const generateInputSelectContent = contentAttributes => {
-  const { submitted_values: submittedValues = [] } = contentAttributes;
-  const [selectedOption] = submittedValues;
-
-  if (selectedOption && selectedOption.title) {
-    return `<strong>${selectedOption.title}</strong>`;
-  }
-  return '';
-};
-
-const generateInputEmailContent = contentAttributes => {
-  const { submitted_email: submittedEmail = '' } = contentAttributes;
-  if (submittedEmail) {
-    return `<strong>${submittedEmail}</strong>`;
-  }
-  return '';
-};
-
-const generateFormContent = (contentAttributes, { noResponseText }) => {
-  const { items, submitted_values: submittedValues = [] } = contentAttributes;
-  if (submittedValues.length) {
-    const submittedObject = submittedValues.reduce((acc, keyValuePair) => {
-      acc[keyValuePair.name] = keyValuePair.value;
-      return acc;
-    }, {});
-    let formMessageContent = '';
-    items.forEach(item => {
-      formMessageContent += `<div>${item.label}</div>`;
-      const response = submittedObject[item.name] || noResponseText;
-      formMessageContent += `<strong>${response}</strong><br/><br/>`;
-    });
-    return formMessageContent;
-  }
-  return '';
-};
-
-const generateCSATContent = (
-  contentAttributes,
-  { ratingTitle, feedbackTitle }
-) => {
-  const {
-    submitted_values: { csat_survey_response: surveyResponse = {} } = {},
-  } = contentAttributes;
-  const { rating, feedback_message } = surveyResponse || {};
-
-  let messageContent = '';
-  if (rating) {
-    const [ratingObject = {}] = CSAT_RATINGS.filter(
-      csatRating => csatRating.value === rating
-    );
-    messageContent += `<div><strong>${ratingTitle}</strong></div>`;
-    messageContent += `<p>${ratingObject.emoji}</p>`;
-  }
-  if (feedback_message) {
-    messageContent += `<div><strong>${feedbackTitle}</strong></div>`;
-    messageContent += `<p>${feedback_message}</p>`;
-  }
-  return messageContent;
-};
-
-export const generateBotMessageContent = (
-  contentType,
-  contentAttributes,
-  {
-    noResponseText = 'No response',
-    csat: { ratingTitle = 'Rating', feedbackTitle = 'Feedback' } = {},
-  } = {}
-) => {
-  const contentTypeMethods = {
-    input_select: generateInputSelectContent,
-    input_email: generateInputEmailContent,
-    form: generateFormContent,
-    input_csat: generateCSATContent,
-  };
-
-  const contentTypeMethod = contentTypeMethods[contentType];
-  if (contentTypeMethod && typeof contentTypeMethod === 'function') {
-    return contentTypeMethod(contentAttributes, {
-      noResponseText,
-      ratingTitle,
-      feedbackTitle,
-    });
-  }
-  return '';
-};
diff --git a/app/javascript/dashboard/components/widgets/conversation/helpers/specs/botMessageContentHelper.spec.js b/app/javascript/dashboard/components/widgets/conversation/helpers/specs/botMessageContentHelper.spec.js
deleted file mode 100644
index a0901aa1a..000000000
--- a/app/javascript/dashboard/components/widgets/conversation/helpers/specs/botMessageContentHelper.spec.js
+++ /dev/null
@@ -1,66 +0,0 @@
-import { generateBotMessageContent } from '../botMessageContentHelper';
-
-describe('#generateBotMessageContent', () => {
-  it('return correct input_select content', () => {
-    expect(
-      generateBotMessageContent('input_select', {
-        submitted_values: [{ value: 'salad', title: 'Salad' }],
-      })
-    ).toEqual('<strong>Salad</strong>');
-  });
-
-  it('return correct input_email content', () => {
-    expect(
-      generateBotMessageContent('input_email', {
-        submitted_email: 'hello@chatwoot.com',
-      })
-    ).toEqual('<strong>hello@chatwoot.com</strong>');
-  });
-
-  it('return correct input_csat content', () => {
-    expect(
-      generateBotMessageContent('input_csat', {
-        submitted_values: {
-          csat_survey_response: {
-            rating: 5,
-            feedback_message: 'Great Service',
-          },
-        },
-      })
-    ).toEqual(
-      '<div><strong>Rating</strong></div><p>😍</p><div><strong>Feedback</strong></div><p>Great Service</p>'
-    );
-
-    expect(
-      generateBotMessageContent(
-        'input_csat',
-        {
-          submitted_values: {
-            csat_survey_response: { rating: 1, feedback_message: '' },
-          },
-        },
-        { csat: { ratingTitle: 'റേറ്റിംഗ്', feedbackTitle: 'പ്രതികരണം' } }
-      )
-    ).toEqual('<div><strong>റേറ്റിംഗ്</strong></div><p>😞</p>');
-  });
-
-  it('return correct form content', () => {
-    expect(
-      generateBotMessageContent('form', {
-        items: [
-          {
-            name: 'large_text',
-            label: 'This a large text',
-          },
-          {
-            name: 'email',
-            label: 'Email',
-          },
-        ],
-        submitted_values: [{ name: 'large_text', value: 'Large Text Content' }],
-      })
-    ).toEqual(
-      '<div>This a large text</div><strong>Large Text Content</strong><br/><br/><div>Email</div><strong>No response</strong><br/><br/>'
-    );
-  });
-});
diff --git a/app/javascript/dashboard/components/widgets/conversation/linear/CreateOrLinkIssue.vue b/app/javascript/dashboard/components/widgets/conversation/linear/CreateOrLinkIssue.vue
index 52791f300..4fd57eccc 100644
--- a/app/javascript/dashboard/components/widgets/conversation/linear/CreateOrLinkIssue.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/linear/CreateOrLinkIssue.vue
@@ -58,7 +58,7 @@ const onClickTabChange = index => {
     />
 
     <div class="flex flex-col h-auto overflow-auto">
-      <div class="flex flex-col px-8 pb-4">
+      <div class="flex flex-col px-8 pb-4 mt-1">
         <woot-tabs
           class="ltr:[&>ul]:pl-0 rtl:[&>ul]:pr-0"
           :index="selectedTabIndex"
@@ -70,6 +70,7 @@ const onClickTabChange = index => {
             :index="index"
             :name="tab.name"
             :show-badge="false"
+            is-compact
           />
         </woot-tabs>
       </div>
diff --git a/app/javascript/dashboard/components/widgets/forms/AvatarUploader.vue b/app/javascript/dashboard/components/widgets/forms/AvatarUploader.vue
index 5cfdc87d9..23006183e 100644
--- a/app/javascript/dashboard/components/widgets/forms/AvatarUploader.vue
+++ b/app/javascript/dashboard/components/widgets/forms/AvatarUploader.vue
@@ -53,7 +53,7 @@ export default {
       :src="src"
       :username="usernameAvatar"
     />
-    <div v-if="src && deleteAvatar" class="avatar-delete-btn">
+    <div v-if="src && deleteAvatar" class="my-1">
       <NextButton
         outline
         xs
@@ -74,10 +74,3 @@ export default {
     </label>
   </div>
 </template>
-
-<style lang="scss" scoped>
-.avatar-delete-btn {
-  margin-top: var(--space-smaller);
-  margin-bottom: var(--space-smaller);
-}
-</style>
diff --git a/app/javascript/dashboard/components/widgets/forms/PhoneInput.vue b/app/javascript/dashboard/components/widgets/forms/PhoneInput.vue
index bf85ae712..a18857cbc 100644
--- a/app/javascript/dashboard/components/widgets/forms/PhoneInput.vue
+++ b/app/javascript/dashboard/components/widgets/forms/PhoneInput.vue
@@ -194,7 +194,7 @@ export default {
       </div>
       <span
         v-if="activeDialCode"
-        class="flex py-2 pl-2 pr-0 text-base font-normal leading-normal text-n-slate-12"
+        class="flex py-2 ltr:pl-2 rtl:pr-2 text-base font-normal leading-normal text-n-slate-12"
       >
         {{ activeDialCode }}
       </span>
diff --git a/app/javascript/dashboard/components/widgets/mentions/MentionBox.vue b/app/javascript/dashboard/components/widgets/mentions/MentionBox.vue
index fc4dc5c7e..894ab3045 100644
--- a/app/javascript/dashboard/components/widgets/mentions/MentionBox.vue
+++ b/app/javascript/dashboard/components/widgets/mentions/MentionBox.vue
@@ -92,7 +92,7 @@ const variableKey = (item = {}) => {
         >
           <slot :item="item" :index="index" :selected="index === selectedIndex">
             <p
-              class="max-w-full min-w-0 mb-0 overflow-hidden text-sm font-medium text-n-slate-11 group-hover:text-n-slate-11 text-ellipsis whitespace-nowrap"
+              class="max-w-full min-w-0 mb-0 overflow-hidden text-sm font-medium text-n-slate-11 group-hover:text-n-slate-12 text-ellipsis whitespace-nowrap"
               :class="{
                 'text-n-slate-12': index === selectedIndex,
               }"
@@ -100,7 +100,7 @@ const variableKey = (item = {}) => {
               {{ item.description }}
             </p>
             <p
-              class="max-w-full min-w-0 mb-0 overflow-hidden text-xs text-slate-500 dark:text-slate-300 group-hover:text-n-slate-11 text-ellipsis whitespace-nowrap"
+              class="max-w-full min-w-0 mb-0 overflow-hidden text-xs text-n-slate-11 group-hover:text-n-slate-12 text-ellipsis whitespace-nowrap"
               :class="{
                 'text-n-slate-12': index === selectedIndex,
               }"
diff --git a/app/javascript/dashboard/components/widgets/modal/WootKeyShortcutModal.vue b/app/javascript/dashboard/components/widgets/modal/WootKeyShortcutModal.vue
index 04cd100ef..c8fe5f2b8 100644
--- a/app/javascript/dashboard/components/widgets/modal/WootKeyShortcutModal.vue
+++ b/app/javascript/dashboard/components/widgets/modal/WootKeyShortcutModal.vue
@@ -43,7 +43,7 @@ onMounted(async () => {
       />
       <div class="grid grid-cols-2 px-8 pt-0 pb-4 mt-6 gap-x-5 gap-y-3">
         <div class="flex justify-between items-center min-w-[25rem]">
-          <h5 class="text-sm text-slate-800 dark:text-slate-100">
+          <h5 class="text-sm text-n-slate-12">
             {{ $t('KEYBOARD_SHORTCUTS.TOGGLE_MODAL') }}
           </h5>
           <div class="flex items-center gap-2 mb-1 ml-2">
@@ -63,7 +63,7 @@ onMounted(async () => {
           :key="shortcut.id"
           class="flex justify-between items-center min-w-[25rem]"
         >
-          <h5 class="text-sm text-slate-800 min-w-[36px] dark:text-slate-100">
+          <h5 class="text-sm text-n-slate-12 min-w-[36px]">
             {{ title(shortcut) }}
           </h5>
           <div class="flex items-center gap-2 mb-1 ml-2">
@@ -83,7 +83,7 @@ onMounted(async () => {
               </template>
               <span
                 v-else
-                class="flex items-center text-sm font-semibold text-slate-800 dark:text-slate-100"
+                class="flex items-center text-sm font-semibold text-n-slate-12"
               >
                 {{ key }}
               </span>
@@ -97,6 +97,6 @@ onMounted(async () => {
 
 <style scoped>
 .key {
-  @apply py-2 px-2.5 font-semibold text-xs text-slate-700 dark:text-slate-100 bg-slate-75 dark:bg-slate-900 shadow border-b-2 rtl:border-l-2 ltr:border-r-2 border-slate-200 dark:border-slate-700;
+  @apply py-2 px-2.5 font-semibold text-xs text-n-slate-12 bg-n-slate-4 dark:bg-n-slate-2 shadow border-b-2 rtl:border-l-2 ltr:border-r-2 border-n-strong;
 }
 </style>
diff --git a/app/javascript/dashboard/helper/permissionsHelper.js b/app/javascript/dashboard/helper/permissionsHelper.js
index 25f97c038..cb736f4ab 100644
--- a/app/javascript/dashboard/helper/permissionsHelper.js
+++ b/app/javascript/dashboard/helper/permissionsHelper.js
@@ -25,32 +25,6 @@ export const getUserRole = (user, accountId) => {
   return currentAccount.role || 'agent';
 };
 
-const isPermissionsPresentInRoute = route =>
-  route.meta && route.meta.permissions;
-
-export const buildPermissionsFromRouter = (routes = []) =>
-  routes.reduce((acc, route) => {
-    if (route.name) {
-      if (!isPermissionsPresentInRoute(route)) {
-        // eslint-disable-next-line
-        console.error(route);
-        throw new Error(
-          "The route doesn't have the required permissions defined"
-        );
-      }
-      acc[route.name] = route.meta.permissions;
-    }
-
-    if (route.children) {
-      acc = {
-        ...acc,
-        ...buildPermissionsFromRouter(route.children),
-      };
-    }
-
-    return acc;
-  }, {});
-
 /**
  * Filters and transforms items based on user permissions.
  *
diff --git a/app/javascript/dashboard/helper/portalHelper.js b/app/javascript/dashboard/helper/portalHelper.js
index 4df38c5bc..a640ed6ca 100644
--- a/app/javascript/dashboard/helper/portalHelper.js
+++ b/app/javascript/dashboard/helper/portalHelper.js
@@ -66,42 +66,6 @@ export const getArticleStatus = status => {
   }
 };
 
-// Constants
-export const HELP_CENTER_MENU_ITEMS = [
-  {
-    label: 'Articles',
-    icon: 'i-lucide-book',
-    action: 'portals_articles_index',
-    value: [
-      'portals_articles_index',
-      'portals_articles_new',
-      'portals_articles_edit',
-    ],
-  },
-  {
-    label: 'Categories',
-    icon: 'i-lucide-folder',
-    action: 'portals_categories_index',
-    value: [
-      'portals_categories_index',
-      'portals_categories_articles_index',
-      'portals_categories_articles_edit',
-    ],
-  },
-  {
-    label: 'Locales',
-    icon: 'i-lucide-languages',
-    action: 'portals_locales_index',
-    value: ['portals_locales_index'],
-  },
-  {
-    label: 'Settings',
-    icon: 'i-lucide-settings',
-    action: 'portals_settings_index',
-    value: ['portals_settings_index'],
-  },
-];
-
 export const ARTICLE_STATUSES = {
   DRAFT: 'draft',
   PUBLISHED: 'published',
diff --git a/app/javascript/dashboard/helper/specs/permissionsHelper.spec.js b/app/javascript/dashboard/helper/specs/permissionsHelper.spec.js
index f991a6bc9..7fe26119d 100644
--- a/app/javascript/dashboard/helper/specs/permissionsHelper.spec.js
+++ b/app/javascript/dashboard/helper/specs/permissionsHelper.spec.js
@@ -1,5 +1,4 @@
 import {
-  buildPermissionsFromRouter,
   getCurrentAccount,
   getUserPermissions,
   hasPermissions,
@@ -43,70 +42,6 @@ describe('hasPermissions', () => {
   });
 });
 
-describe('buildPermissionsFromRouter', () => {
-  it('returns a valid object when routes have permissions defined', () => {
-    expect(
-      buildPermissionsFromRouter([
-        {
-          path: 'agent',
-          name: 'agent_list',
-          meta: { permissions: ['agent_admin'] },
-        },
-        {
-          path: 'inbox',
-          children: [
-            {
-              path: '',
-              name: 'inbox_list',
-              meta: { permissions: ['inbox_admin'] },
-            },
-          ],
-        },
-        {
-          path: 'conversations',
-          children: [
-            {
-              path: '',
-              children: [
-                {
-                  path: 'attachments',
-                  name: 'attachments_list',
-                  meta: { permissions: ['conversation_admin'] },
-                },
-              ],
-            },
-          ],
-        },
-      ])
-    ).toEqual({
-      agent_list: ['agent_admin'],
-      inbox_list: ['inbox_admin'],
-      attachments_list: ['conversation_admin'],
-    });
-  });
-
-  it('throws an error if a named routed does not have permissions defined', () => {
-    expect(() => {
-      buildPermissionsFromRouter([
-        {
-          path: 'agent',
-          name: 'agent_list',
-        },
-      ]);
-    }).toThrow("The route doesn't have the required permissions defined");
-
-    expect(() => {
-      buildPermissionsFromRouter([
-        {
-          path: 'agent',
-          name: 'agent_list',
-          meta: {},
-        },
-      ]);
-    }).toThrow("The route doesn't have the required permissions defined");
-  });
-});
-
 describe('filterItemsByPermission', () => {
   const items = {
     item1: { name: 'Item 1', permissions: ['agent', 'administrator'] },
diff --git a/app/javascript/dashboard/modules/contact/components/ContactDropdownItem.vue b/app/javascript/dashboard/modules/contact/components/ContactDropdownItem.vue
index ec3865227..f68cf9530 100644
--- a/app/javascript/dashboard/modules/contact/components/ContactDropdownItem.vue
+++ b/app/javascript/dashboard/modules/contact/components/ContactDropdownItem.vue
@@ -60,7 +60,7 @@ export default {
   @apply flex items-center;
 }
 .user-identifier {
-  @apply text-xs ml-0.5 text-slate-700 dark:text-slate-100;
+  @apply text-xs ml-0.5 text-n-slate-12;
 }
 .option__user-data {
   @apply flex flex-col flex-grow ml-2 mr-2;
@@ -73,10 +73,10 @@ export default {
   @apply relative top-px mr-0.5 rtl:mr-0 rtl:ml-0.5;
 }
 .option__title {
-  @apply text-slate-800 dark:text-slate-100 font-medium mb-0.5;
+  @apply text-n-slate-12 font-medium mb-0.5;
 }
 .option__body {
-  @apply text-xs text-slate-700 dark:text-slate-100 mt-1;
+  @apply text-xs text-n-slate-12 mt-1;
 }
 
 .option__user-data .option__body {
diff --git a/app/javascript/dashboard/modules/contact/components/MergeContact.vue b/app/javascript/dashboard/modules/contact/components/MergeContact.vue
index 4055a22e4..85fda4464 100644
--- a/app/javascript/dashboard/modules/contact/components/MergeContact.vue
+++ b/app/javascript/dashboard/modules/contact/components/MergeContact.vue
@@ -130,7 +130,7 @@ export default {
       </div>
       <div class="flex multiselect-wrap--medium">
         <div
-          class="w-8 relative text-base text-slate-100 dark:text-slate-600 after:content-[''] after:h-12 after:w-0 ltr:after:left-4 rtl:after:right-4 after:absolute after:border-l after:border-solid after:border-slate-100 after:dark:border-slate-600 before:content-[''] before:h-0 before:w-4 ltr:before:left-4 rtl:before:right-4 before:top-12 before:absolute before:border-b before:border-solid before:border-slate-100 before:dark:border-slate-600"
+          class="w-8 relative text-base text-n-strong after:content-[''] after:h-12 after:w-0 ltr:after:left-4 rtl:after:right-4 after:absolute after:border-l after:border-solid after:border-n-strong before:content-[''] before:h-0 before:w-4 ltr:before:left-4 rtl:before:right-4 before:top-12 before:absolute before:border-b before:border-solid before:border-n-strong"
         >
           <fluent-icon
             icon="arrow-up"
diff --git a/app/javascript/dashboard/modules/contact/components/MergeContactSummary.vue b/app/javascript/dashboard/modules/contact/components/MergeContactSummary.vue
index 26d4ce44c..058021dd5 100644
--- a/app/javascript/dashboard/modules/contact/components/MergeContactSummary.vue
+++ b/app/javascript/dashboard/modules/contact/components/MergeContactSummary.vue
@@ -17,9 +17,9 @@ export default {
 <template>
   <div
     v-if="parentContactName"
-    class="my-4 relative p-2.5 border rounded-[4px] text-slate-800 dark:text-slate-100 border-slate-100 dark:border-slate-700 bg-white dark:bg-slate-800"
+    class="my-4 relative p-2.5 border rounded-[4px] text-n-slate-12 border-n-weak bg-n-background"
   >
-    <h5 class="text-base font-medium text-slate-900 dark:text-white">
+    <h5 class="text-base font-medium text-n-slate-12">
       {{ $t('MERGE_CONTACTS.SUMMARY.TITLE') }}
     </h5>
     <ul class="ml-0 list-none">
diff --git a/app/javascript/dashboard/modules/conversations/components/MessageContextMenu.vue b/app/javascript/dashboard/modules/conversations/components/MessageContextMenu.vue
index ababf1588..632425feb 100644
--- a/app/javascript/dashboard/modules/conversations/components/MessageContextMenu.vue
+++ b/app/javascript/dashboard/modules/conversations/components/MessageContextMenu.vue
@@ -257,7 +257,7 @@ export default {
 
 <style lang="scss" scoped>
 .menu-container {
-  @apply p-1 bg-white dark:bg-slate-900 shadow-xl rounded-md;
+  @apply p-1 bg-n-background shadow-xl rounded-md;
 
   hr:first-child {
     @apply hidden;
@@ -277,10 +277,6 @@ export default {
         @apply font-medium text-base;
       }
     }
-
-    .modal-footer {
-      @apply pt-4 pb-8 px-8;
-    }
   }
 }
 </style>
diff --git a/app/javascript/dashboard/modules/search/components/SearchTabs.vue b/app/javascript/dashboard/modules/search/components/SearchTabs.vue
index 6e5174b5c..9260796ef 100644
--- a/app/javascript/dashboard/modules/search/components/SearchTabs.vue
+++ b/app/javascript/dashboard/modules/search/components/SearchTabs.vue
@@ -41,6 +41,7 @@ const onTabChange = index => {
         :name="item.name"
         :count="item.count"
         :show-badge="item.showBadge"
+        is-compact
       />
     </woot-tabs>
   </div>
diff --git a/app/javascript/dashboard/modules/widget-preview/components/Widget.vue b/app/javascript/dashboard/modules/widget-preview/components/Widget.vue
index 028a330ac..61e917d91 100644
--- a/app/javascript/dashboard/modules/widget-preview/components/Widget.vue
+++ b/app/javascript/dashboard/modules/widget-preview/components/Widget.vue
@@ -140,7 +140,7 @@ export default {
     </div>
     <div
       v-if="isWidgetVisible"
-      class="widget-wrapper flex flex-col justify-between rounded-lg shadow-md bg-slate-25 dark:bg-slate-800 h-[31.25rem] w-80"
+      class="widget-wrapper flex flex-col justify-between rounded-lg shadow-md bg-n-slate-2 dark:bg-n-solid-1 h-[31.25rem] w-80"
     >
       <WidgetHead :config="getWidgetConfig" />
       <div>
@@ -151,7 +151,7 @@ export default {
         <WidgetFooter :config="getWidgetConfig" />
         <div class="py-2.5 flex justify-center">
           <a
-            class="items-center gap-0.5 text-slate-500 dark:text-slate-400 cursor-pointer flex filter grayscale opacity-90 hover:grayscale-0 hover:opacity-100 text-xxs"
+            class="items-center gap-0.5 text-n-slate-11 cursor-pointer flex filter grayscale opacity-90 hover:grayscale-0 hover:opacity-100 text-xxs"
           >
             <img
               class="max-w-2.5 max-h-2.5"
diff --git a/app/javascript/dashboard/modules/widget-preview/components/WidgetBody.vue b/app/javascript/dashboard/modules/widget-preview/components/WidgetBody.vue
index 09f1ce057..b2a1740b9 100644
--- a/app/javascript/dashboard/modules/widget-preview/components/WidgetBody.vue
+++ b/app/javascript/dashboard/modules/widget-preview/components/WidgetBody.vue
@@ -28,7 +28,7 @@ defineProps({
       </div>
 
       <div
-        class="bg-white shadow rounded-[1.25rem] rounded-bl-[0.25rem] px-4 py-3 inline-block text-sm text-slate-900 dark:text-white dark:bg-slate-700"
+        class="shadow rounded-[1.25rem] rounded-bl-[0.25rem] px-4 py-3 inline-block text-sm text-n-slate-12 bg-n-background dark:bg-n-solid-3"
       >
         <div>
           <p class="m-0">
diff --git a/app/javascript/dashboard/modules/widget-preview/components/WidgetFooter.vue b/app/javascript/dashboard/modules/widget-preview/components/WidgetFooter.vue
index afa31a212..224d9cf5b 100644
--- a/app/javascript/dashboard/modules/widget-preview/components/WidgetFooter.vue
+++ b/app/javascript/dashboard/modules/widget-preview/components/WidgetFooter.vue
@@ -27,16 +27,16 @@ const getStatusText = computed(() => {
   <div class="relative flex flex-col w-full px-4">
     <div
       v-if="config.isDefaultScreen"
-      class="p-4 bg-white rounded-md shadow-sm dark:bg-slate-700"
+      class="p-4 rounded-md shadow-sm bg-n-background dark:bg-n-solid-2"
     >
       <div class="flex items-center justify-between">
         <div>
           <div
-            class="text-sm font-medium leading-4 text-slate-700 dark:text-slate-50"
+            class="text-sm font-medium leading-4 text-n-slate-12 dark:text-n-slate-50"
           >
             {{ getStatusText }}
           </div>
-          <div class="mt-1 text-xs text-slate-500 dark:text-slate-100">
+          <div class="mt-1 text-xs text-n-slate-11">
             {{ config.replyTime }}
           </div>
         </div>
@@ -44,7 +44,7 @@ const getStatusText = computed(() => {
       </div>
       <button
         v-if="config.isDefaultScreen"
-        class="inline-flex items-center justify-between px-2 py-1 mt-1 -ml-2 font-medium leading-6 bg-transparent rounded-md text-slate-800 dark:bg-transparent dark:text-slate-50 hover:bg-slate-25 dark:hover:bg-slate-800"
+        class="inline-flex items-center justify-between px-2 py-1 mt-1 -ml-2 font-medium leading-6 bg-transparent rounded-md text-n-slate-12 dark:bg-transparent"
         :style="{ color: config.color }"
       >
         <span class="pr-2 text-xs">
@@ -59,8 +59,8 @@ const getStatusText = computed(() => {
     </div>
     <div
       v-else
-      class="flex items-center h-10 bg-white rounded-md dark:bg-slate-700"
-      :class="{ 'ring-2 ring-woot-500 dark:ring-woot-400': isInputFocused }"
+      class="flex items-center h-10 bg-white rounded-md dark:!bg-n-slate-3"
+      :class="{ 'ring-2 ring-n-brand dark:ring-n-brand': isInputFocused }"
     >
       <ResizableTextArea
         id="chat-input"
@@ -68,7 +68,7 @@ const getStatusText = computed(() => {
         :placeholder="
           $t('INBOX_MGMT.WIDGET_BUILDER.FOOTER.CHAT_INPUT_PLACEHOLDER')
         "
-        class="flex-grow !bg-white border-0 outline-none !outline-0 border-none h-8 text-sm dark:!bg-slate-700 pb-0 !pt-1.5 resize-none px-3 !mb-0 focus:outline-none rounded-md"
+        class="flex-grow !bg-white border-0 outline-none !outline-0 border-none h-8 text-sm dark:!bg-n-slate-3 pb-0 !pt-1.5 resize-none px-3 !mb-0 focus:outline-none rounded-md"
         @focus="isInputFocused = true"
         @blur="isInputFocused = false"
       />
diff --git a/app/javascript/dashboard/modules/widget-preview/components/WidgetHead.vue b/app/javascript/dashboard/modules/widget-preview/components/WidgetHead.vue
index 5de9ca069..58bbfac15 100644
--- a/app/javascript/dashboard/modules/widget-preview/components/WidgetHead.vue
+++ b/app/javascript/dashboard/modules/widget-preview/components/WidgetHead.vue
@@ -26,8 +26,8 @@ const isDefaultScreen = computed(() => {
     class="rounded-t-lg flex-shrink-0 transition-[max-height] duration-300"
     :class="
       isDefaultScreen
-        ? 'bg-slate-25 dark:bg-slate-800 px-4 py-5'
-        : 'bg-white dark:bg-slate-900 p-4'
+        ? 'bg-n-slate-2 dark:bg-n-solid-1 px-4 py-5'
+        : 'bg-n-slate-2 dark:bg-n-solid-1 p-4'
     "
   >
     <div class="relative top-px">
@@ -40,17 +40,15 @@ const isDefaultScreen = computed(() => {
         />
         <div v-if="!isDefaultScreen">
           <div class="flex items-center justify-start gap-1">
-            <span
-              class="text-base font-medium leading-3 text-slate-900 dark:text-white"
-            >
+            <span class="text-base font-medium leading-3 text-n-slate-12">
               {{ config.websiteName }}
             </span>
             <div
               v-if="config.isOnline"
-              class="w-2 h-2 bg-green-500 rounded-full"
+              class="w-2 h-2 bg-n-teal-10 rounded-full"
             />
           </div>
-          <span class="mt-1 text-xs text-slate-600 dark:text-slate-400">
+          <span class="mt-1 text-xs text-n-slate-11">
             {{ config.replyTime }}
           </span>
         </div>
diff --git a/app/javascript/dashboard/routes/dashboard/Dashboard.vue b/app/javascript/dashboard/routes/dashboard/Dashboard.vue
index 475fc9ee3..ae54e9a7c 100644
--- a/app/javascript/dashboard/routes/dashboard/Dashboard.vue
+++ b/app/javascript/dashboard/routes/dashboard/Dashboard.vue
@@ -1,43 +1,29 @@
 <script>
 import { defineAsyncComponent, ref } from 'vue';
-import { mapGetters } from 'vuex';
 
 import NextSidebar from 'next/sidebar/Sidebar.vue';
 import WootKeyShortcutModal from 'dashboard/components/widgets/modal/WootKeyShortcutModal.vue';
-import AddAccountModal from 'dashboard/components/layout/sidebarComponents/AddAccountModal.vue';
-import AccountSelector from 'dashboard/components/layout/sidebarComponents/AccountSelector.vue';
-import AddLabelModal from 'dashboard/routes/dashboard/settings/labels/AddLabel.vue';
-import NotificationPanel from 'dashboard/routes/dashboard/notifications/components/NotificationPanel.vue';
+import AddAccountModal from 'dashboard/components/app/AddAccountModal.vue';
 import UpgradePage from 'dashboard/routes/dashboard/upgrade/UpgradePage.vue';
 
 import { useUISettings } from 'dashboard/composables/useUISettings';
 import { useAccount } from 'dashboard/composables/useAccount';
 
 import wootConstants from 'dashboard/constants/globals';
-import { BUS_EVENTS } from 'shared/constants/busEvents';
-import { FEATURE_FLAGS } from 'dashboard/featureFlags';
 
 const CommandBar = defineAsyncComponent(
   () => import('./commands/commandbar.vue')
 );
 
-const Sidebar = defineAsyncComponent(
-  () => import('../../components/layout/Sidebar.vue')
-);
-import { emitter } from 'shared/helpers/mitt';
 import CopilotLauncher from 'dashboard/components-next/copilot/CopilotLauncher.vue';
 import CopilotContainer from 'dashboard/components/copilot/CopilotContainer.vue';
 
 export default {
   components: {
     NextSidebar,
-    Sidebar,
     CommandBar,
     WootKeyShortcutModal,
     AddAccountModal,
-    AccountSelector,
-    AddLabelModal,
-    NotificationPanel,
     UpgradePage,
     CopilotLauncher,
     CopilotContainer,
@@ -58,20 +44,11 @@ export default {
     return {
       showAccountModal: false,
       showCreateAccountModal: false,
-      showAddLabelModal: false,
       showShortcutModal: false,
-      isNotificationPanel: false,
       displayLayoutType: '',
-      hasBanner: '',
     };
   },
   computed: {
-    ...mapGetters({
-      isFeatureEnabledonAccount: 'accounts/isFeatureEnabledonAccount',
-    }),
-    currentRoute() {
-      return ' ';
-    },
     showUpgradePage() {
       return this.upgradePageRef?.shouldShowUpgradePage;
     },
@@ -82,10 +59,6 @@ export default {
         'agent_list',
       ].includes(this.$route.name);
     },
-    isSidebarOpen() {
-      const { show_secondary_sidebar: showSecondarySidebar } = this.uiSettings;
-      return showSecondarySidebar;
-    },
     previouslyUsedDisplayType() {
       const {
         previously_used_conversation_display_type: conversationDisplayType,
@@ -97,12 +70,6 @@ export default {
         this.uiSettings;
       return showSecondarySidebar;
     },
-    showNextSidebar() {
-      return this.isFeatureEnabledonAccount(
-        this.accountId,
-        FEATURE_FLAGS.CHATWOOT_V4
-      );
-    },
   },
   watch: {
     displayLayoutType() {
@@ -121,22 +88,13 @@ export default {
   },
   mounted() {
     this.handleResize();
-    this.$nextTick(this.checkBanner);
     window.addEventListener('resize', this.handleResize);
-    window.addEventListener('resize', this.checkBanner);
-    emitter.on(BUS_EVENTS.TOGGLE_SIDEMENU, this.toggleSidebar);
   },
   unmounted() {
     window.removeEventListener('resize', this.handleResize);
-    window.removeEventListener('resize', this.checkBanner);
-    emitter.off(BUS_EVENTS.TOGGLE_SIDEMENU, this.toggleSidebar);
   },
 
   methods: {
-    checkBanner() {
-      this.hasBanner =
-        document.getElementsByClassName('woot-banner').length > 0;
-    },
     handleResize() {
       const { SMALL_SCREEN_BREAKPOINT, LAYOUT_TYPES } = wootConstants;
       let throttled = false;
@@ -156,12 +114,6 @@ export default {
         }
       }, delay);
     },
-    toggleSidebar() {
-      this.updateUISettings({
-        show_secondary_sidebar: !this.isSidebarOpen,
-        previously_used_sidebar_view: !this.isSidebarOpen,
-      });
-    },
     openCreateAccountModal() {
       this.showAccountModal = false;
       this.showCreateAccountModal = true;
@@ -178,42 +130,18 @@ export default {
     closeKeyShortcutModal() {
       this.showShortcutModal = false;
     },
-    showAddLabelPopup() {
-      this.showAddLabelModal = true;
-    },
-    hideAddLabelPopup() {
-      this.showAddLabelModal = false;
-    },
-    openNotificationPanel() {
-      this.isNotificationPanel = true;
-    },
-    closeNotificationPanel() {
-      this.isNotificationPanel = false;
-    },
   },
 };
 </script>
 
 <template>
-  <div class="flex flex-wrap app-wrapper dark:text-slate-300">
+  <div class="flex flex-wrap app-wrapper text-n-slate-12">
     <NextSidebar
-      v-if="showNextSidebar"
       @toggle-account-modal="toggleAccountModal"
       @open-key-shortcut-modal="toggleKeyShortcutModal"
       @close-key-shortcut-modal="closeKeyShortcutModal"
       @show-create-account-modal="openCreateAccountModal"
     />
-    <Sidebar
-      v-else
-      :route="currentRoute"
-      :has-banner="hasBanner"
-      :show-secondary-sidebar="isSidebarOpen"
-      @open-notification-panel="openNotificationPanel"
-      @toggle-account-modal="toggleAccountModal"
-      @open-key-shortcut-modal="toggleKeyShortcutModal"
-      @close-key-shortcut-modal="closeKeyShortcutModal"
-      @show-add-label-popup="showAddLabelPopup"
-    />
     <main class="flex flex-1 h-full min-h-0 px-0 overflow-hidden">
       <UpgradePage
         v-show="showUpgradePage"
@@ -225,23 +153,7 @@ export default {
         <CommandBar />
         <CopilotLauncher />
         <CopilotContainer />
-
-        <NotificationPanel
-          v-if="isNotificationPanel"
-          @close="closeNotificationPanel"
-        />
-        <woot-modal
-          v-model:show="showAddLabelModal"
-          :on-close="hideAddLabelPopup"
-        >
-          <AddLabelModal @close="hideAddLabelPopup" />
-        </woot-modal>
       </template>
-      <AccountSelector
-        :show-account-modal="showAccountModal"
-        @close-account-modal="toggleAccountModal"
-        @show-create-account-modal="openCreateAccountModal"
-      />
       <AddAccountModal
         :show="showCreateAccountModal"
         @close-account-create-modal="closeCreateAccountModal"
diff --git a/app/javascript/dashboard/routes/dashboard/commands/commandbar.vue b/app/javascript/dashboard/routes/dashboard/commands/commandbar.vue
index 19e1cbe9e..afd15283e 100644
--- a/app/javascript/dashboard/routes/dashboard/commands/commandbar.vue
+++ b/app/javascript/dashboard/routes/dashboard/commands/commandbar.vue
@@ -95,7 +95,7 @@ onMounted(setCommandBarData);
 
 <style lang="scss">
 ninja-keys {
-  --ninja-accent-color: var(--w-500);
+  --ninja-accent-color: rgba(39, 129, 246, 1);
   --ninja-font-family: 'Inter';
   z-index: 9999;
 }
diff --git a/app/javascript/dashboard/routes/dashboard/conversation/ContactConversations.vue b/app/javascript/dashboard/routes/dashboard/conversation/ContactConversations.vue
index 810872cac..68f5bd36e 100644
--- a/app/javascript/dashboard/routes/dashboard/conversation/ContactConversations.vue
+++ b/app/javascript/dashboard/routes/dashboard/conversation/ContactConversations.vue
@@ -71,7 +71,7 @@ export default {
 
 <style lang="scss" scoped>
 .no-label-message {
-  @apply text-slate-500 dark:text-slate-400 mb-4;
+  @apply text-n-slate-11 mb-4;
 }
 
 ::v-deep .conversation {
diff --git a/app/javascript/dashboard/routes/dashboard/conversation/ContactDetailsItem.vue b/app/javascript/dashboard/routes/dashboard/conversation/ContactDetailsItem.vue
index 1bba00568..5d5697c93 100644
--- a/app/javascript/dashboard/routes/dashboard/conversation/ContactDetailsItem.vue
+++ b/app/javascript/dashboard/routes/dashboard/conversation/ContactDetailsItem.vue
@@ -11,7 +11,7 @@ export default {
 <template>
   <div class="overflow-auto" :class="compact ? 'py-0 px-0' : 'py-3 px-4'">
     <div class="items-center flex justify-between mb-1.5">
-      <span class="text-sm font-medium text-slate-800 dark:text-slate-100">
+      <span class="text-sm font-medium text-n-slate-12">
         {{ title }}
       </span>
       <slot name="button" />
diff --git a/app/javascript/dashboard/routes/dashboard/conversation/ContactPanel.vue b/app/javascript/dashboard/routes/dashboard/conversation/ContactPanel.vue
index 64191eab5..ed762d914 100644
--- a/app/javascript/dashboard/routes/dashboard/conversation/ContactPanel.vue
+++ b/app/javascript/dashboard/routes/dashboard/conversation/ContactPanel.vue
@@ -304,7 +304,7 @@ onMounted(() => {
 <style lang="scss" scoped>
 ::v-deep {
   .contact--profile {
-    @apply pb-3 border-b border-solid border-slate-75 dark:border-slate-700;
+    @apply pb-3 border-b border-solid border-n-weak;
   }
 
   .conversation--actions .multiselect-wrap--small {
diff --git a/app/javascript/dashboard/routes/dashboard/conversation/ConversationAction.vue b/app/javascript/dashboard/routes/dashboard/conversation/ConversationAction.vue
index b715c000a..f94fc7a9b 100644
--- a/app/javascript/dashboard/routes/dashboard/conversation/ConversationAction.vue
+++ b/app/javascript/dashboard/routes/dashboard/conversation/ConversationAction.vue
@@ -207,7 +207,7 @@ export default {
 </script>
 
 <template>
-  <div class="bg-white dark:bg-slate-900">
+  <div class="bg-n-background">
     <div class="multiselect-wrap--small">
       <ContactDetailsItem
         compact
diff --git a/app/javascript/dashboard/routes/dashboard/conversation/ConversationParticipant.vue b/app/javascript/dashboard/routes/dashboard/conversation/ConversationParticipant.vue
index f3bdbbee5..2323b4281 100644
--- a/app/javascript/dashboard/routes/dashboard/conversation/ConversationParticipant.vue
+++ b/app/javascript/dashboard/routes/dashboard/conversation/ConversationParticipant.vue
@@ -155,7 +155,7 @@ export default {
 </script>
 
 <template>
-  <div class="relative bg-white dark:bg-slate-900">
+  <div class="relative bg-n-background">
     <div class="flex justify-between">
       <div class="flex justify-between w-full mb-1">
         <div>
@@ -163,7 +163,7 @@ export default {
             <Spinner v-if="watchersUiFlas.isFetching" size="tiny" />
             {{ totalWatchersText }}
           </p>
-          <p v-else class="m-0 text-sm text-slate-400 dark:text-slate-700">
+          <p v-else class="m-0 text-sm text-n-slate-10">
             {{ $t('CONVERSATION_PARTICIPANTS.NO_PARTICIPANTS_TEXT') }}
           </p>
         </div>
@@ -185,10 +185,7 @@ export default {
         :show-more-thumbnails-count="showMoreThumbs"
         :users-list="thumbnailList"
       />
-      <p
-        v-if="isUserWatching"
-        class="m-0 text-sm text-slate-300 dark:text-slate-300"
-      >
+      <p v-if="isUserWatching" class="m-0 text-sm text-n-slate-10">
         {{ $t('CONVERSATION_PARTICIPANTS.YOU_ARE_WATCHING') }}
       </p>
       <NextButton
@@ -207,12 +204,15 @@ export default {
           onCloseDropdown();
         }
       "
-      :class="{ 'dropdown-pane--open': showDropDown }"
-      class="dropdown-pane"
+      :class="{
+        'block visible': showDropDown,
+        'hidden invisible': !showDropDown,
+      }"
+      class="border rounded-lg shadow-lg bg-n-alpha-3 absolute backdrop-blur-[100px] border-n-strong dark:border-n-strong p-2 z-[9999] box-border top-8 w-full"
     >
       <div class="flex items-center justify-between mb-1">
         <h4
-          class="m-0 overflow-hidden text-sm whitespace-nowrap text-ellipsis text-slate-800 dark:text-slate-100"
+          class="m-0 overflow-hidden text-sm whitespace-nowrap text-ellipsis text-n-slate-12"
         >
           {{ $t('CONVERSATION_PARTICIPANTS.ADD_PARTICIPANTS') }}
         </h4>
@@ -227,9 +227,3 @@ export default {
     </div>
   </div>
 </template>
-
-<style lang="scss" scoped>
-.dropdown-pane {
-  @apply box-border top-8 w-full;
-}
-</style>
diff --git a/app/javascript/dashboard/routes/dashboard/conversation/ConversationView.vue b/app/javascript/dashboard/routes/dashboard/conversation/ConversationView.vue
index 14b1f37d1..a1534a772 100644
--- a/app/javascript/dashboard/routes/dashboard/conversation/ConversationView.vue
+++ b/app/javascript/dashboard/routes/dashboard/conversation/ConversationView.vue
@@ -4,12 +4,10 @@ import { useUISettings } from 'dashboard/composables/useUISettings';
 import { useAccount } from 'dashboard/composables/useAccount';
 import ChatList from '../../../components/ChatList.vue';
 import ConversationBox from '../../../components/widgets/conversation/ConversationBox.vue';
-import PopOverSearch from './search/PopOverSearch.vue';
 import wootConstants from 'dashboard/constants/globals';
 import { BUS_EVENTS } from 'shared/constants/busEvents';
 import CmdBarConversationSnooze from 'dashboard/routes/dashboard/commands/CmdBarConversationSnooze.vue';
 import { emitter } from 'shared/helpers/mitt';
-import { FEATURE_FLAGS } from 'dashboard/featureFlags';
 import SidepanelSwitch from 'dashboard/components-next/Conversation/SidepanelSwitch.vue';
 import ConversationSidebar from 'dashboard/components/widgets/conversation/ConversationSidebar.vue';
 
@@ -17,7 +15,6 @@ export default {
   components: {
     ChatList,
     ConversationBox,
-    PopOverSearch,
     CmdBarConversationSnooze,
     SidepanelSwitch,
     ConversationSidebar,
@@ -75,7 +72,6 @@ export default {
     ...mapGetters({
       chatList: 'getAllConversations',
       currentChat: 'getSelectedChat',
-      isFeatureEnabledonAccount: 'accounts/isFeatureEnabledonAccount',
     }),
     showConversationList() {
       return this.isOnExpandedLayout ? !this.conversationId : true;
@@ -100,12 +96,6 @@ export default {
       const { is_contact_sidebar_open: isContactSidebarOpen } = this.uiSettings;
       return isContactSidebarOpen;
     },
-    showPopOverSearch() {
-      return !this.isFeatureEnabledonAccount(
-        this.accountId,
-        FEATURE_FLAGS.CHATWOOT_V4
-      );
-    },
   },
   watch: {
     conversationId() {
@@ -215,13 +205,7 @@ export default {
       :folders-id="foldersId"
       :is-on-expanded-layout="isOnExpandedLayout"
       @conversation-load="onConversationLoad"
-    >
-      <PopOverSearch
-        v-if="showPopOverSearch"
-        :is-on-expanded-layout="isOnExpandedLayout"
-        @toggle-conversation-layout="toggleConversationLayout"
-      />
-    </ChatList>
+    />
     <ConversationBox
       v-if="showMessageView"
       :inbox-id="inboxId"
diff --git a/app/javascript/dashboard/routes/dashboard/conversation/Macros/MacroPreview.vue b/app/javascript/dashboard/routes/dashboard/conversation/Macros/MacroPreview.vue
index 299531df2..d5a2ae0b8 100644
--- a/app/javascript/dashboard/routes/dashboard/conversation/Macros/MacroPreview.vue
+++ b/app/javascript/dashboard/routes/dashboard/conversation/Macros/MacroPreview.vue
@@ -59,10 +59,10 @@ const resolvedMacro = computed(() => {
     >
       <div
         v-if="i !== macro.actions.length - 1"
-        class="top-[0.390625rem] absolute -bottom-1 left-0 w-px bg-slate-75 dark:bg-slate-600"
+        class="top-[0.390625rem] absolute -bottom-1 left-0 w-px bg-n-slate-6"
       />
       <div
-        class="absolute -left-[0.21875rem] top-[0.2734375rem] w-2 h-2 rounded-full bg-n-solid-1 border-2 border-solid border-n-weak dark:border-slate-600"
+        class="absolute -left-[0.21875rem] top-[0.2734375rem] w-2 h-2 rounded-full bg-n-solid-1 border-2 border-solid border-n-weak dark:border-n-slate-6"
       />
       <p class="mb-1 text-xs text-n-slate-11">
         {{ $t(`MACROS.ACTIONS.${action.actionName}`) }}
diff --git a/app/javascript/dashboard/routes/dashboard/conversation/contact/ContactForm.vue b/app/javascript/dashboard/routes/dashboard/conversation/contact/ContactForm.vue
index f5075f201..967d25912 100644
--- a/app/javascript/dashboard/routes/dashboard/conversation/contact/ContactForm.vue
+++ b/app/javascript/dashboard/routes/dashboard/conversation/contact/ContactForm.vue
@@ -346,7 +346,7 @@ export default {
         </label>
         <div
           v-if="isPhoneNumberNotValid || !phoneNumber"
-          class="relative mx-0 mt-0 mb-2.5 p-2 rounded-md text-sm border border-solid border-yellow-500 text-yellow-700 dark:border-yellow-700 bg-yellow-200/60 dark:bg-yellow-200/20 dark:text-yellow-400"
+          class="relative mx-0 mt-0 mb-2.5 p-2 rounded-md text-sm border border-solid border-n-amber-5 text-n-amber-12 bg-n-amber-3"
         >
           {{ $t('CONTACT_FORM.FORM.PHONE_NUMBER.HELP') }}
         </div>
@@ -394,13 +394,13 @@ export default {
         class="flex items-stretch w-full mb-4"
       >
         <span
-          class="flex items-center h-10 px-2 text-sm border-solid bg-slate-50 border-y ltr:border-l rtl:border-r ltr:rounded-l-md rtl:rounded-r-md dark:bg-slate-700 text-slate-800 dark:text-slate-100 border-slate-200 dark:border-slate-600"
+          class="flex items-center h-10 px-2 text-sm border-solid border-y ltr:border-l rtl:border-r ltr:rounded-l-md rtl:rounded-r-md bg-n-solid-3 text-n-slate-11 border-n-weak"
         >
           {{ socialProfile.prefixURL }}
         </span>
         <input
           v-model="socialProfileUserNames[socialProfile.key]"
-          class="input-group-field ltr:!rounded-l-none rtl:rounded-r-none !mb-0"
+          class="input-group-field ltr:!rounded-l-none rtl:!rounded-r-none !mb-0"
           type="text"
         />
       </div>
diff --git a/app/javascript/dashboard/routes/dashboard/conversation/contact/SocialIcons.vue b/app/javascript/dashboard/routes/dashboard/conversation/contact/SocialIcons.vue
index 0cd0ad4b5..b5c4b12be 100644
--- a/app/javascript/dashboard/routes/dashboard/conversation/contact/SocialIcons.vue
+++ b/app/javascript/dashboard/routes/dashboard/conversation/contact/SocialIcons.vue
@@ -41,7 +41,7 @@ export default {
       <fluent-icon
         :icon="`brand-${profile.key}`"
         size="16"
-        class="text-slate-500 dark:text-slate-400 hover:text-slate-700 dark:hover:text-slate-200"
+        class="text-n-slate-11 hover:text-n-slate-10"
       />
     </a>
   </div>
diff --git a/app/javascript/dashboard/routes/dashboard/conversation/labels/LabelBox.vue b/app/javascript/dashboard/routes/dashboard/conversation/labels/LabelBox.vue
index be46d268f..e129852b2 100644
--- a/app/javascript/dashboard/routes/dashboard/conversation/labels/LabelBox.vue
+++ b/app/javascript/dashboard/routes/dashboard/conversation/labels/LabelBox.vue
@@ -102,20 +102,21 @@ export default {
           @remove="removeLabelFromConversation"
         />
 
-        <div class="dropdown-wrap">
-          <div
-            :class="{ 'dropdown-pane--open': showSearchDropdownLabel }"
-            class="dropdown-pane"
-          >
-            <LabelDropdown
-              v-if="showSearchDropdownLabel"
-              :account-labels="accountLabels"
-              :selected-labels="savedLabels"
-              :allow-creation="isAdmin"
-              @add="addLabelToConversation"
-              @remove="removeLabelFromConversation"
-            />
-          </div>
+        <div
+          :class="{
+            'block visible': showSearchDropdownLabel,
+            'hidden invisible': !showSearchDropdownLabel,
+          }"
+          class="border rounded-lg bg-n-alpha-3 top-6 backdrop-blur-[100px] absolute w-full shadow-lg border-n-strong dark:border-n-strong p-2 box-border z-[9999]"
+        >
+          <LabelDropdown
+            v-if="showSearchDropdownLabel"
+            :account-labels="accountLabels"
+            :selected-labels="savedLabels"
+            :allow-creation="isAdmin"
+            @add="addLabelToConversation"
+            @remove="removeLabelFromConversation"
+          />
         </div>
       </div>
     </div>
@@ -131,28 +132,8 @@ export default {
   width: 100%;
 
   .label-wrap {
-    line-height: var(--space-medium);
+    line-height: 1.5rem;
     position: relative;
-
-    .dropdown-wrap {
-      display: flex;
-      left: -1px;
-      margin-right: var(--space-medium);
-      position: absolute;
-      top: var(--space-medium);
-      width: 100%;
-
-      .dropdown-pane {
-        width: 100%;
-        box-sizing: border-box;
-      }
-    }
   }
 }
-
-.error {
-  color: var(--r-500);
-  font-size: var(--font-size-mini);
-  font-weight: var(--font-weight-medium);
-}
 </style>
diff --git a/app/javascript/dashboard/routes/dashboard/conversation/search/PopOverSearch.vue b/app/javascript/dashboard/routes/dashboard/conversation/search/PopOverSearch.vue
deleted file mode 100644
index 1c1627914..000000000
--- a/app/javascript/dashboard/routes/dashboard/conversation/search/PopOverSearch.vue
+++ /dev/null
@@ -1,78 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-import SwitchLayout from './SwitchLayout.vue';
-import { frontendURL } from 'dashboard/helper/URLHelper';
-
-export default {
-  components: {
-    SwitchLayout,
-  },
-  directives: {
-    focus: {
-      inserted(el) {
-        el.focus();
-      },
-    },
-  },
-  props: {
-    isOnExpandedLayout: {
-      type: Boolean,
-      required: true,
-    },
-  },
-  emits: ['toggleConversationLayout'],
-  computed: {
-    ...mapGetters({
-      accountId: 'getCurrentAccountId',
-    }),
-    searchUrl() {
-      return frontendURL(`accounts/${this.accountId}/search`);
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="relative">
-    <div
-      class="flex px-4 pb-1 justify-between items-center flex-row gap-1 pt-2.5 border-b border-transparent"
-    >
-      <woot-sidemenu-icon
-        size="xs"
-        class="relative top-0 ltr:-ml-1.5 rtl:-mr-1.5 flex-shrink-0 focus:!bg-n-solid-3 dark:!hover:bg-n-solid-2 hover:!bg-n-alpha-2"
-      />
-      <router-link
-        :to="searchUrl"
-        class="inline-flex items-center flex-1 h-6 min-w-0 gap-1 px-2 py-0 text-left rounded-md rtl:mr-2.5 search-link rtl:text-right bg-n-slate-9/10 hover:bg-n-slate-3"
-      >
-        <div class="flex flex-shrink-0">
-          <fluent-icon
-            icon="search"
-            class="search--icon text-n-slate-11"
-            size="16"
-          />
-        </div>
-        <p
-          class="mb-0 overflow-hidden text-sm search--label whitespace-nowrap text-ellipsis text-n-slate-11"
-        >
-          {{ $t('CONVERSATION.SEARCH_MESSAGES') }}
-        </p>
-      </router-link>
-      <SwitchLayout
-        :is-on-expanded-layout="isOnExpandedLayout"
-        @toggle="$emit('toggleConversationLayout')"
-      />
-    </div>
-  </div>
-</template>
-
-<style lang="scss" scoped>
-.search-link {
-  &:hover {
-    .search--icon,
-    .search--label {
-      @apply hover:text-woot-500 dark:hover:text-woot-500;
-    }
-  }
-}
-</style>
diff --git a/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/ArticleSearchResultItem.vue b/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/ArticleSearchResultItem.vue
index 0c3254028..e5108ddc1 100644
--- a/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/ArticleSearchResultItem.vue
+++ b/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/ArticleSearchResultItem.vue
@@ -50,18 +50,18 @@ const handleCopy = async e => {
 
 <template>
   <button
-    class="flex flex-col w-full gap-1 px-2 py-1 bg-white border border-transparent border-solid rounded-md cursor-pointer dark:bg-slate-900 hover:bg-slate-25 hover:dark:bg-slate-800 group focus:outline-none focus:bg-slate-25 focus:border-slate-500 dark:focus:border-slate-400 dark:focus:bg-slate-800"
+    class="flex flex-col w-full gap-1 px-2 py-1 border border-transparent border-solid rounded-md cursor-pointer hover:bg-n-slate-3 group focus:outline-none focus:bg-n-slate-3"
     @click="handlePreview"
   >
     <h4
-      class="w-full mb-0 -mx-1 text-sm rounded-sm ltr:text-left rtl:text-right text-slate-900 dark:text-slate-25 hover:underline group-hover:underline"
+      class="w-full mb-0 -mx-1 text-sm rounded-sm ltr:text-left rtl:text-right text-n-slate-12 hover:underline group-hover:underline"
     >
       {{ title }}
     </h4>
 
     <div class="flex content-between items-center gap-0.5 w-full">
       <p
-        class="w-full mb-0 text-sm ltr:text-left rtl:text-right text-slate-600 dark:text-slate-300"
+        class="w-full mb-0 text-sm ltr:text-left rtl:text-right text-n-slate-11"
       >
         {{ locale }}
         {{ ` / ` }}
diff --git a/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/Header.vue b/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/Header.vue
index 7fac7b663..516984b80 100644
--- a/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/Header.vue
+++ b/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/Header.vue
@@ -47,7 +47,7 @@ useKeyboardEvents(keyboardEvents);
 <template>
   <div class="flex flex-col py-1">
     <div class="flex items-center justify-between py-2 mb-1">
-      <h3 class="text-base text-slate-900 dark:text-slate-25">
+      <h3 class="text-base text-n-slate-12">
         {{ title }}
       </h3>
       <Button ghost xs slate icon="i-lucide-x" @click="onClose" />
@@ -63,7 +63,7 @@ useKeyboardEvents(keyboardEvents);
         ref="searchInputRef"
         type="text"
         :placeholder="$t('HELP_CENTER.ARTICLE_SEARCH.PLACEHOLDER')"
-        class="block w-full !h-9 ltr:!pl-8 rtl:!pr-8 dark:!bg-n-slate-2 !border-n-weak !bg-n-slate-2 text-sm rounded-md leading-8 text-slate-700 shadow-sm ring-2 ring-transparent ring-slate-300 border border-solid placeholder:text-slate-400 focus:border-woot-600 focus:ring-woot-200 !mb-0 focus:bg-slate-25 dark:focus:bg-slate-700 dark:focus:ring-woot-700"
+        class="block w-full !h-9 ltr:!pl-8 rtl:!pr-8 dark:!bg-n-slate-2 !border-n-weak !bg-n-slate-2 text-sm rounded-md leading-8 text-n-slate-12 shadow-sm ring-2 ring-transparent ring-n-weak border border-solid placeholder:text-n-slate-10 focus:border-n-brand focus:ring-n-brand !mb-0"
         :value="searchQuery"
         @input="onInput"
       />
diff --git a/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/SearchPopover.vue b/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/SearchPopover.vue
index f54db1597..88504d26d 100644
--- a/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/SearchPopover.vue
+++ b/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/SearchPopover.vue
@@ -137,7 +137,7 @@ export default {
   >
     <div
       v-on-clickaway="onClose"
-      class="flex flex-col px-4 pb-4 rounded-md shadow-md border border-solid border-slate-50 dark:border-slate-800 bg-white dark:bg-slate-900 z-[1000] max-w-[720px] md:w-[20rem] lg:w-[24rem] xl:w-[28rem] 2xl:w-[32rem] h-[calc(100vh-20rem)] max-h-[40rem]"
+      class="flex flex-col px-4 pb-4 rounded-md shadow-md border border-solid border-n-weak bg-n-background z-[1000] max-w-[720px] md:w-[20rem] lg:w-[24rem] xl:w-[28rem] 2xl:w-[32rem] h-[calc(100vh-20rem)] max-h-[40rem]"
     >
       <SearchHeader
         :title="$t('HELP_CENTER.ARTICLE_SEARCH.TITLE')"
diff --git a/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/SearchResults.vue b/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/SearchResults.vue
index a51e29767..7338924b1 100644
--- a/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/SearchResults.vue
+++ b/app/javascript/dashboard/routes/dashboard/helpcenter/components/ArticleSearch/SearchResults.vue
@@ -39,13 +39,19 @@ export default {
 
 <template>
   <div
-    class="flex justify-end h-full gap-1 py-4 overflow-y-auto bg-white dark:bg-slate-900"
+    class="flex justify-end h-full gap-1 py-4 overflow-y-auto bg-n-background"
   >
     <div class="flex flex-col w-full gap-1">
-      <div v-if="isLoading" class="empty-state-message">
+      <div
+        v-if="isLoading"
+        class="text-center flex items-center justify-center px-4 py-8 text-n-slate-10 text-sm"
+      >
         {{ $t('HELP_CENTER.ARTICLE_SEARCH_RESULT.SEARCH_LOADER') }}
       </div>
-      <div v-else-if="showNoResults" class="empty-state-message">
+      <div
+        v-else-if="showNoResults"
+        class="text-center flex items-center justify-center px-4 py-8 text-n-slate-10 text-sm"
+      >
         {{ $t('HELP_CENTER.ARTICLE_SEARCH_RESULT.NO_RESULT') }}
       </div>
       <template v-else>
@@ -65,9 +71,3 @@ export default {
     </div>
   </div>
 </template>
-
-<style scoped>
-.empty-state-message {
-  @apply text-center flex items-center justify-center px-4 py-8 text-slate-500 text-sm;
-}
-</style>
diff --git a/app/javascript/dashboard/routes/dashboard/helpcenter/components/UpgradePage.vue b/app/javascript/dashboard/routes/dashboard/helpcenter/components/UpgradePage.vue
index b498e4385..ec38b3248 100644
--- a/app/javascript/dashboard/routes/dashboard/helpcenter/components/UpgradePage.vue
+++ b/app/javascript/dashboard/routes/dashboard/helpcenter/components/UpgradePage.vue
@@ -68,17 +68,17 @@ export default {
 
 <template>
   <div
-    class="flex flex-col gap-12 sm:gap-16 items-center justify-center py-0 px-4 md:px-0 w-full min-h-screen max-w-full overflow-auto bg-white dark:bg-slate-900"
+    class="flex flex-col gap-12 sm:gap-16 items-center justify-center py-0 px-4 md:px-0 w-full min-h-screen max-w-full overflow-auto bg-n-background"
   >
     <div class="flex flex-col justify-start sm:justify-center gap-6">
       <div class="flex flex-col gap-1.5 items-start sm:items-center">
         <h1
-          class="text-slate-900 dark:text-white text-left sm:text-center text-4xl sm:text-5xl mb-6 font-semibold"
+          class="text-n-slate-12 text-left sm:text-center text-4xl sm:text-5xl mb-6 font-semibold"
         >
           {{ $t('HELP_CENTER.UPGRADE_PAGE.TITLE') }}
         </h1>
         <p
-          class="max-w-2xl text-base font-normal leading-6 text-left sm:text-center text-slate-700 dark:text-slate-200"
+          class="max-w-2xl text-base font-normal leading-6 text-left sm:text-center text-n-slate-11"
         >
           {{
             isOnChatwootCloud
@@ -116,14 +116,14 @@ export default {
               :icon="feature.icon"
               icon-lib="lucide"
               :size="26"
-              class="mt-px text-slate-800 dark:text-slate-25"
+              class="mt-px text-n-slate-12"
             />
           </div>
           <div>
-            <h5 class="font-semibold text-lg text-slate-800 dark:text-slate-25">
+            <h5 class="font-semibold text-lg text-n-slate-12">
               {{ feature.title }}
             </h5>
-            <p class="text-sm leading-6 text-slate-700 dark:text-slate-100">
+            <p class="text-sm leading-6 text-n-slate-12">
               {{ feature.description }}
             </p>
           </div>
diff --git a/app/javascript/dashboard/routes/dashboard/helpcenter/pages/HelpCenterPageRouteView.vue b/app/javascript/dashboard/routes/dashboard/helpcenter/pages/HelpCenterPageRouteView.vue
index f43270857..6e86b54f7 100644
--- a/app/javascript/dashboard/routes/dashboard/helpcenter/pages/HelpCenterPageRouteView.vue
+++ b/app/javascript/dashboard/routes/dashboard/helpcenter/pages/HelpCenterPageRouteView.vue
@@ -67,7 +67,7 @@ watch(
   <div class="flex flex-grow-0 w-full h-full min-h-0 app-wrapper">
     <section
       v-if="isHelpCenterEnabled"
-      class="flex flex-1 h-full px-0 overflow-hidden bg-white dark:bg-slate-900"
+      class="flex flex-1 h-full px-0 overflow-hidden bg-n-background"
     >
       <router-view />
     </section>
diff --git a/app/javascript/dashboard/routes/dashboard/helpcenter/pages/PortalsIndexPage.vue b/app/javascript/dashboard/routes/dashboard/helpcenter/pages/PortalsIndexPage.vue
index d5f9d677b..0d9100259 100644
--- a/app/javascript/dashboard/routes/dashboard/helpcenter/pages/PortalsIndexPage.vue
+++ b/app/javascript/dashboard/routes/dashboard/helpcenter/pages/PortalsIndexPage.vue
@@ -69,7 +69,7 @@ onMounted(() => performRouting());
 
 <template>
   <div
-    class="flex items-center justify-center w-full bg-n-background text-slate-600 dark:text-slate-200"
+    class="flex items-center justify-center w-full bg-n-background text-n-slate-11"
   >
     <Spinner />
   </div>
diff --git a/app/javascript/dashboard/routes/dashboard/inbox/InboxEmptyState.vue b/app/javascript/dashboard/routes/dashboard/inbox/InboxEmptyState.vue
index 2276037ce..f54fa8a7f 100644
--- a/app/javascript/dashboard/routes/dashboard/inbox/InboxEmptyState.vue
+++ b/app/javascript/dashboard/routes/dashboard/inbox/InboxEmptyState.vue
@@ -1,6 +1,11 @@
 <script>
 import { mapGetters } from 'vuex';
+import Spinner from 'dashboard/components-next/spinner/Spinner.vue';
+
 export default {
+  components: {
+    Spinner,
+  },
   props: {
     emptyStateMessage: {
       type: String,
@@ -25,14 +30,12 @@ export default {
   <div
     class="items-center justify-center hidden w-full h-full text-center bg-n-background lg:flex"
   >
-    <span v-if="uiFlags.isFetching" class="my-4 spinner" />
+    <div v-if="uiFlags.isFetching" class="flex justify-center my-4">
+      <Spinner class="text-n-brand" />
+    </div>
     <div v-else class="flex flex-col items-center gap-2">
-      <fluent-icon
-        icon="mail-inbox"
-        size="40"
-        class="text-slate-600 dark:text-slate-400"
-      />
-      <span class="text-sm font-medium text-slate-500 dark:text-slate-300">
+      <fluent-icon icon="mail-inbox" size="40" class="text-n-slate-11" />
+      <span class="text-sm font-medium text-n-slate-11">
         {{ emptyMessage }}
       </span>
     </div>
diff --git a/app/javascript/dashboard/routes/dashboard/inbox/InboxList.vue b/app/javascript/dashboard/routes/dashboard/inbox/InboxList.vue
index 50771d538..f7b5eb2df 100644
--- a/app/javascript/dashboard/routes/dashboard/inbox/InboxList.vue
+++ b/app/javascript/dashboard/routes/dashboard/inbox/InboxList.vue
@@ -9,6 +9,7 @@ import InboxListHeader from './components/InboxListHeader.vue';
 import { INBOX_EVENTS } from 'dashboard/helper/AnalyticsHelper/events';
 import IntersectionObserver from 'dashboard/components/IntersectionObserver.vue';
 import CmdBarConversationSnooze from 'dashboard/routes/dashboard/commands/CmdBarConversationSnooze.vue';
+import Spinner from 'dashboard/components-next/spinner/Spinner.vue';
 
 export default {
   components: {
@@ -16,6 +17,7 @@ export default {
     InboxListHeader,
     IntersectionObserver,
     CmdBarConversationSnooze,
+    Spinner,
   },
   setup() {
     const { uiSettings } = useUISettings();
@@ -242,12 +244,12 @@ export default {
           @context-menu-close="isInboxContextMenuOpen = false"
           @click="openConversation(notificationItem)"
         />
-        <div v-if="uiFlags.isFetching" class="text-center">
-          <span class="mt-4 mb-4 spinner" />
+        <div v-if="uiFlags.isFetching" class="flex justify-center my-4">
+          <Spinner class="text-n-brand" />
         </div>
         <p
           v-if="showEmptyState"
-          class="p-4 text-sm font-medium text-center text-slate-400 dark:text-slate-400"
+          class="p-4 text-sm font-medium text-center text-n-slate-10"
         >
           {{ $t('INBOX.LIST.NO_NOTIFICATIONS') }}
         </p>
diff --git a/app/javascript/dashboard/routes/dashboard/inbox/InboxView.vue b/app/javascript/dashboard/routes/dashboard/inbox/InboxView.vue
index f420a40a8..29ddc5ef1 100644
--- a/app/javascript/dashboard/routes/dashboard/inbox/InboxView.vue
+++ b/app/javascript/dashboard/routes/dashboard/inbox/InboxView.vue
@@ -4,6 +4,7 @@ import { useTrack } from 'dashboard/composables';
 import InboxItemHeader from './components/InboxItemHeader.vue';
 import ConversationBox from 'dashboard/components/widgets/conversation/ConversationBox.vue';
 import InboxEmptyState from './InboxEmptyState.vue';
+import Spinner from 'dashboard/components-next/spinner/Spinner.vue';
 import { useUISettings } from 'dashboard/composables/useUISettings';
 import { BUS_EVENTS } from 'shared/constants/busEvents';
 import { INBOX_EVENTS } from 'dashboard/helper/AnalyticsHelper/events';
@@ -14,6 +15,7 @@ export default {
     InboxItemHeader,
     InboxEmptyState,
     ConversationBox,
+    Spinner,
   },
   setup() {
     const { uiSettings, updateUISettings } = useUISettings();
@@ -191,9 +193,9 @@ export default {
       />
       <div
         v-if="isConversationLoading"
-        class="flex items-center h-[calc(100%-56px)] justify-center bg-slate-25 dark:bg-slate-800"
+        class="flex items-center h-[calc(100%-56px)] my-4 justify-center bg-n-solid-1"
       >
-        <span class="my-4 spinner" />
+        <Spinner class="text-n-brand" />
       </div>
       <ConversationBox
         v-else
diff --git a/app/javascript/dashboard/routes/dashboard/inbox/components/InboxDisplayMenu.vue b/app/javascript/dashboard/routes/dashboard/inbox/components/InboxDisplayMenu.vue
index 71e506294..ec9d02979 100644
--- a/app/javascript/dashboard/routes/dashboard/inbox/components/InboxDisplayMenu.vue
+++ b/app/javascript/dashboard/routes/dashboard/inbox/components/InboxDisplayMenu.vue
@@ -182,12 +182,12 @@ export default {
             type="checkbox"
             :name="option.key"
             :checked="option.selected"
-            class="m-0 border-[1.5px] shadow border-slate-200 dark:border-slate-600 appearance-none rounded-[4px] w-4 h-4 dark:bg-slate-800 focus:ring-1 focus:ring-slate-100 dark:focus:ring-slate-700 checked:bg-n-brand dark:checked:bg-n-brand after:content-[''] after:text-white checked:after:content-['✓'] after:flex after:items-center after:justify-center checked:border-t checked:border-woot-700 dark:checked:border-woot-300 checked:border-b-0 checked:border-r-0 checked:border-l-0 after:text-center after:text-xs after:font-bold after:relative after:-top-[1.5px]"
+            class="m-0 border-[1.5px] shadow border-n-weak appearance-none rounded-[4px] w-4 h-4 dark:bg-n-background focus:ring-1 focus:ring-n-weak dark:focus:ring-n-strong checked:bg-n-brand dark:checked:bg-n-brand after:content-[''] after:text-white checked:after:content-['✓'] after:flex after:items-center after:justify-center checked:border-t checked:border-n-blue-10 checked:border-b-0 checked:border-r-0 checked:border-l-0 after:text-center after:text-xs after:font-bold after:relative after:-top-[1.5px]"
             @change="updateDisplayOption(option)"
           />
           <label
             :for="option.key"
-            class="text-xs font-medium text-slate-800 !ml-0 !mr-0 dark:text-slate-100"
+            class="text-xs font-medium text-n-slate-12 !ml-0 !mr-0 dark:text-n-slate-12"
           >
             {{ option.name }}
           </label>
diff --git a/app/javascript/dashboard/routes/dashboard/inbox/routes.js b/app/javascript/dashboard/routes/dashboard/inbox/routes.js
index 28ffa2ebf..4ec1dff75 100644
--- a/app/javascript/dashboard/routes/dashboard/inbox/routes.js
+++ b/app/javascript/dashboard/routes/dashboard/inbox/routes.js
@@ -7,8 +7,6 @@ import {
   CONVERSATION_PERMISSIONS,
 } from 'dashboard/constants/permissions.js';
 
-import { FEATURE_FLAGS } from 'dashboard/featureFlags';
-
 export const routes = [
   {
     path: frontendURL('accounts/:accountId/inbox-view'),
@@ -20,7 +18,6 @@ export const routes = [
         component: InboxEmptyStateView,
         meta: {
           permissions: [...ROLES, ...CONVERSATION_PERMISSIONS],
-          featureFlag: FEATURE_FLAGS.CHATWOOT_V4,
         },
       },
       {
@@ -29,7 +26,6 @@ export const routes = [
         component: InboxDetailView,
         meta: {
           permissions: [...ROLES, ...CONVERSATION_PERMISSIONS],
-          featureFlag: FEATURE_FLAGS.CHATWOOT_V4,
         },
       },
     ],
diff --git a/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationPanel.vue b/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationPanel.vue
deleted file mode 100644
index 59ecf67b4..000000000
--- a/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationPanel.vue
+++ /dev/null
@@ -1,230 +0,0 @@
-<script>
-import { mapGetters } from 'vuex';
-import NotificationPanelList from './NotificationPanelList.vue';
-import { useTrack } from 'dashboard/composables';
-import { ACCOUNT_EVENTS } from '../../../../helper/AnalyticsHelper/events';
-import NextButton from 'dashboard/components-next/button/Button.vue';
-
-export default {
-  components: {
-    NotificationPanelList,
-    NextButton,
-  },
-  emits: ['close'],
-  data() {
-    return {
-      pageSize: 15,
-    };
-  },
-  computed: {
-    ...mapGetters({
-      meta: 'notifications/getMeta',
-      records: 'notifications/getNotifications',
-      uiFlags: 'notifications/getUIFlags',
-    }),
-    totalUnreadNotifications() {
-      return this.meta.unreadCount;
-    },
-    noUnreadNotificationAvailable() {
-      return this.meta.unreadCount === 0;
-    },
-    getUnreadNotifications() {
-      return this.records.filter(notification => notification.read_at === null);
-    },
-    currentPage() {
-      return Number(this.meta.currentPage);
-    },
-    lastPage() {
-      if (this.totalUnreadNotifications > 15) {
-        return Math.ceil(this.totalUnreadNotifications / this.pageSize);
-      }
-      return 1;
-    },
-    inFirstPage() {
-      const page = Number(this.meta.currentPage);
-      return page === 1;
-    },
-    inLastPage() {
-      return this.currentPage === this.lastPage;
-    },
-  },
-  mounted() {
-    this.$store.dispatch('notifications/get', { page: 1 });
-  },
-  methods: {
-    onPageChange(page) {
-      this.$store.dispatch('notifications/get', { page });
-    },
-    openConversation(notification) {
-      const {
-        primary_actor_id: primaryActorId,
-        primary_actor_type: primaryActorType,
-        primary_actor: { id: conversationId },
-        notification_type: notificationType,
-      } = notification;
-
-      useTrack(ACCOUNT_EVENTS.OPEN_CONVERSATION_VIA_NOTIFICATION, {
-        notificationType,
-      });
-      this.$store.dispatch('notifications/read', {
-        id: notification.id,
-        primaryActorId,
-        primaryActorType,
-        unreadCount: this.meta.unreadCount,
-      });
-      this.$router.push({
-        name: 'inbox_conversation',
-        params: { conversation_id: conversationId },
-      });
-      this.$emit('close');
-    },
-    onClickNextPage() {
-      if (!this.inLastPage) {
-        const page = this.currentPage + 1;
-        this.onPageChange(page);
-      }
-    },
-    onClickPreviousPage() {
-      if (!this.inFirstPage) {
-        const page = this.currentPage - 1;
-        this.onPageChange(page);
-      }
-    },
-    onClickFirstPage() {
-      if (!this.inFirstPage) {
-        const page = 1;
-        this.onPageChange(page);
-      }
-    },
-    onClickLastPage() {
-      if (!this.inLastPage) {
-        const page = this.lastPage;
-        this.onPageChange(page);
-      }
-    },
-    onMarkAllDoneClick() {
-      useTrack(ACCOUNT_EVENTS.MARK_AS_READ_NOTIFICATIONS);
-      this.$store.dispatch('notifications/readAll');
-    },
-    openAudioNotificationSettings() {
-      this.$router.push({ name: 'profile_settings_index' });
-      this.closeNotificationPanel();
-      this.$nextTick(() => {
-        const audioSettings = document.getElementById(
-          'profile-settings-notifications'
-        );
-        if (audioSettings) {
-          // TODO [ref](https://github.com/chatwoot/chatwoot/pull/6233#discussion_r1069636890)
-          audioSettings.scrollIntoView(
-            { behavior: 'smooth', block: 'start' },
-            150
-          );
-        }
-      });
-    },
-    closeNotificationPanel() {
-      this.$emit('close');
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="modal-mask">
-    <div
-      v-on-clickaway="closeNotificationPanel"
-      class="flex-col h-[90vh] w-[32.5rem] flex justify-between z-10 rounded-md shadow-md absolute bg-white dark:bg-slate-800 left-14 rtl:left-auto rtl:right-14 m-4"
-    >
-      <div
-        class="flex flex-row items-center justify-between w-full px-6 pt-5 pb-3 border-b border-solid border-slate-50 dark:border-slate-700"
-      >
-        <div class="flex items-center">
-          <span class="text-xl font-bold text-slate-800 dark:text-slate-100">
-            {{ $t('NOTIFICATIONS_PAGE.UNREAD_NOTIFICATION.TITLE') }}
-          </span>
-          <span
-            v-if="totalUnreadNotifications"
-            class="px-2 py-1 ml-2 mr-2 font-semibold rounded-md text-slate-700 dark:text-slate-200 text-xxs bg-slate-50 dark:bg-slate-700"
-          >
-            {{ totalUnreadNotifications }}
-          </span>
-        </div>
-        <div class="flex gap-2">
-          <NextButton
-            v-if="!noUnreadNotificationAvailable"
-            faded
-            xs
-            icon="i-lucide-list-check"
-            :is-loading="uiFlags.isUpdating"
-            :label="$t('NOTIFICATIONS_PAGE.MARK_ALL_DONE')"
-            @click="onMarkAllDoneClick"
-          />
-          <NextButton
-            faded
-            xs
-            slate
-            icon="i-lucide-settings"
-            @click="openAudioNotificationSettings"
-          />
-          <NextButton
-            ghost
-            xs
-            slate
-            icon="i-lucide-x"
-            @click="closeNotificationPanel"
-          />
-        </div>
-      </div>
-      <NotificationPanelList
-        :notifications="getUnreadNotifications"
-        :is-loading="uiFlags.isFetching"
-        :on-click-notification="openConversation"
-        :in-last-page="inLastPage"
-        @close="closeNotificationPanel"
-      />
-      <div
-        v-if="records.length !== 0"
-        class="flex items-center justify-between px-5 py-1"
-      >
-        <div class="flex">
-          <NextButton
-            ghost
-            slate
-            icon="i-lucide-chevrons-left"
-            :disabled="inFirstPage"
-            @click="onClickFirstPage"
-          />
-          <NextButton
-            ghost
-            slate
-            icon="i-lucide-chevron-left"
-            class="ltr:-ml-3 rtl:-mr-3"
-            :disabled="inFirstPage"
-            @click="onClickPreviousPage"
-          />
-        </div>
-        <span class="font-semibold text-xxs text-slate-500 dark:text-slate-400">
-          {{ currentPage }} - {{ lastPage }}
-        </span>
-        <div class="flex">
-          <NextButton
-            ghost
-            slate
-            icon="i-lucide-chevron-right"
-            class="ltr:-mr-3 rtl:-ml-3"
-            :disabled="inLastPage"
-            @click="onClickNextPage"
-          />
-          <NextButton
-            ghost
-            slate
-            icon="i-lucide-chevrons-right"
-            :disabled="inLastPage"
-            @click="onClickLastPage"
-          />
-        </div>
-      </div>
-      <div v-else />
-    </div>
-  </div>
-</template>
diff --git a/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationPanelItem.vue b/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationPanelItem.vue
deleted file mode 100644
index 1ef18548f..000000000
--- a/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationPanelItem.vue
+++ /dev/null
@@ -1,106 +0,0 @@
-<script>
-import Thumbnail from 'dashboard/components/widgets/Thumbnail.vue';
-import { dynamicTime } from 'shared/helpers/timeHelper';
-import NextButton from 'dashboard/components-next/button/Button.vue';
-
-export default {
-  components: {
-    Thumbnail,
-    NextButton,
-  },
-  props: {
-    notificationItem: {
-      type: Object,
-      default: () => {},
-    },
-  },
-  emits: ['openNotification'],
-  computed: {
-    notificationAssignee() {
-      const { primary_actor: primaryActor } = this.notificationItem;
-      return primaryActor?.meta?.assignee;
-    },
-    hasNotificationAssignee() {
-      return !!this.notificationAssignee;
-    },
-    notificationAssigneeName() {
-      return this.notificationAssignee?.name || '';
-    },
-    notificationAssigneeThumbnail() {
-      return this.notificationAssignee?.thumbnail || '';
-    },
-  },
-  methods: {
-    dynamicTime,
-    onClickOpenNotification() {
-      this.$emit('openNotification', this.notificationItem);
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="w-full">
-    <NextButton
-      link
-      slate
-      class="!w-full !h-auto"
-      @click="onClickOpenNotification()"
-    >
-      <div
-        class="flex-row items-center p-2.5 leading-[1.4] border-b border-solid border-slate-50 dark:border-slate-700 flex w-full hover:bg-slate-75 dark:hover:bg-slate-900 hover:rounded-md"
-      >
-        <div
-          v-if="!notificationItem.read_at"
-          class="w-2 h-2 rounded-full bg-woot-500"
-        />
-        <div v-else class="flex w-2" />
-        <div
-          class="flex-col ml-2.5 overflow-hidden w-full flex justify-between"
-        >
-          <div class="flex justify-between">
-            <div class="flex items-center">
-              <span class="font-bold text-slate-800 dark:text-slate-100">
-                {{
-                  `#${
-                    notificationItem.primary_actor
-                      ? notificationItem.primary_actor.id
-                      : $t(`NOTIFICATIONS_PAGE.DELETE_TITLE`)
-                  }`
-                }}
-              </span>
-              <span
-                class="text-xxs p-0.5 px-1 my-0 mx-2 bg-slate-50 dark:bg-slate-700 rounded-md"
-              >
-                {{
-                  $t(
-                    `NOTIFICATIONS_PAGE.TYPE_LABEL.${notificationItem.notification_type}`
-                  )
-                }}
-              </span>
-            </div>
-            <div v-if="hasNotificationAssignee">
-              <Thumbnail
-                :src="notificationAssigneeThumbnail"
-                size="16px"
-                :username="notificationAssigneeName"
-              />
-            </div>
-          </div>
-          <div class="flex w-full">
-            <span
-              class="overflow-hidden font-normal text-slate-700 dark:text-slate-200 whitespace-nowrap text-ellipsis"
-            >
-              {{ notificationItem.push_message_title }}
-            </span>
-          </div>
-          <span
-            class="flex mt-1 font-semibold text-slate-500 dark:text-slate-400 text-xxs"
-          >
-            {{ dynamicTime(notificationItem.last_activity_at) }}
-          </span>
-        </div>
-      </div>
-    </NextButton>
-  </div>
-</template>
diff --git a/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationPanelList.vue b/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationPanelList.vue
deleted file mode 100644
index a8bf0d0d4..000000000
--- a/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationPanelList.vue
+++ /dev/null
@@ -1,81 +0,0 @@
-<script>
-import Spinner from 'shared/components/Spinner.vue';
-import EmptyState from 'dashboard/components/widgets/EmptyState.vue';
-import NotificationPanelItem from './NotificationPanelItem.vue';
-import NextButton from 'dashboard/components-next/button/Button.vue';
-
-export default {
-  components: {
-    NotificationPanelItem,
-    Spinner,
-    EmptyState,
-    NextButton,
-  },
-  props: {
-    notifications: {
-      type: Array,
-      default: () => [],
-    },
-    isLoading: {
-      type: Boolean,
-      default: true,
-    },
-    onClickNotification: {
-      type: Function,
-      default: () => {},
-    },
-    inLastPage: {
-      type: Boolean,
-      default: false,
-    },
-  },
-  emits: ['close'],
-  computed: {
-    showEmptyResult() {
-      return !this.isLoading && this.notifications.length === 0;
-    },
-  },
-  methods: {
-    openNotificationPage() {
-      if (this.$route.name !== 'notifications_index') {
-        this.$router.push({
-          name: 'notifications_index',
-        });
-      }
-      this.$emit('close');
-    },
-  },
-};
-</script>
-
-<template>
-  <div class="flex-col py-2 px-2.5 overflow-auto h-full flex">
-    <NotificationPanelItem
-      v-for="notificationItem in notifications"
-      v-show="!isLoading"
-      :key="notificationItem.id"
-      :notification-item="notificationItem"
-      @open-notification="onClickNotification"
-    />
-    <EmptyState
-      v-if="showEmptyResult"
-      :title="$t('NOTIFICATIONS_PAGE.UNREAD_NOTIFICATION.EMPTY_MESSAGE')"
-    />
-    <NextButton
-      v-if="!isLoading && inLastPage"
-      ghost
-      class="!w-full mt-3"
-      :label="$t('NOTIFICATIONS_PAGE.UNREAD_NOTIFICATION.ALL_NOTIFICATIONS')"
-      @click="openNotificationPage"
-    />
-    <div
-      v-if="isLoading"
-      class="flex items-center justify-center mx-2 my-12 text-sm font-medium"
-    >
-      <Spinner />
-      <span>{{
-        $t('NOTIFICATIONS_PAGE.UNREAD_NOTIFICATION.LOADING_UNREAD_MESSAGE')
-      }}</span>
-    </div>
-  </div>
-</template>
diff --git a/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationTable.vue b/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationTable.vue
index b7b59c445..ce234cc54 100644
--- a/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationTable.vue
+++ b/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationTable.vue
@@ -66,7 +66,7 @@ export default {
         @click="onMarkAllDoneClick"
       />
     </div>
-    <table class="woot-table notifications-table overflow-auto">
+    <table class="notifications-table overflow-auto">
       <tbody v-show="!isLoading">
         <tr
           v-for="notificationItem in notifications"
@@ -74,9 +74,10 @@ export default {
           :class="{
             'is-unread': notificationItem.read_at === null,
           }"
+          class="border-b border-n-weak"
           @click="() => onClickNotification(notificationItem)"
         >
-          <td>
+          <td class="p-2.5 text-n-slate-12">
             <div
               class="overflow-hidden flex-view notification-contant--wrap whitespace-nowrap text-ellipsis"
             >
@@ -109,12 +110,12 @@ export default {
             <Thumbnail
               v-if="notificationItem.primary_actor.meta.assignee"
               :src="notificationItem.primary_actor.meta.assignee.thumbnail"
-              size="36px"
+              size="28px"
               :username="notificationItem.primary_actor.meta.assignee.name"
             />
           </td>
           <td>
-            <div class="text-right timestamp--column">
+            <div class="text-right timestamp--column ltr:mr-2 rtl:ml-2">
               <span class="notification--created-at">
                 {{ dynamicTime(notificationItem.last_activity_at) }}
               </span>
@@ -141,10 +142,8 @@ export default {
 </template>
 
 <style lang="scss" scoped>
-@import 'dashboard/assets/scss/mixins';
-
 .notification--title {
-  @apply text-sm m-0 text-slate-800 dark:text-slate-100;
+  @apply text-sm m-0 text-n-slate-12;
 }
 
 .notifications-table {
@@ -153,11 +152,11 @@ export default {
       @apply cursor-pointer;
 
       &:hover {
-        @apply bg-slate-50 dark:bg-slate-800;
+        @apply bg-n-slate-3;
       }
 
       &.is-active {
-        @apply bg-slate-100 dark:bg-slate-700;
+        @apply bg-n-slate-4 dark:bg-n-slate-6;
       }
 
       > td {
@@ -182,11 +181,11 @@ export default {
 }
 
 .notification--unread-indicator {
-  @apply w-2.5 h-2.5 rounded-full bg-woot-500 dark:bg-woot-500;
+  @apply w-2.5 h-2.5 rounded-full bg-n-brand;
 }
 
 .notification--created-at {
-  @apply text-slate-700 dark:text-slate-200 text-xs;
+  @apply text-n-slate-11 text-xs;
 }
 
 .notification--type {
@@ -206,6 +205,6 @@ export default {
 }
 
 .notification--message-title {
-  @apply text-slate-700 dark:text-slate-100;
+  @apply text-n-slate-12;
 }
 </style>
diff --git a/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationsView.vue b/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationsView.vue
index 0013ec42a..67805e0e3 100644
--- a/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationsView.vue
+++ b/app/javascript/dashboard/routes/dashboard/notifications/components/NotificationsView.vue
@@ -68,7 +68,7 @@ export default {
         :on-mark-all-done-click="onMarkAllDoneClick"
       />
       <TableFooter
-        class="border-t border-slate-75 dark:border-slate-700/50"
+        class="border-t border-n-weak"
         :current-page="Number(meta.currentPage)"
         :total-count="meta.count"
         :page-size="15"
@@ -77,17 +77,3 @@ export default {
     </div>
   </div>
 </template>
-
-<style lang="scss" scoped>
-.notification--page {
-  background: var(--white);
-  overflow-y: auto;
-  width: 100%;
-}
-
-.notification--content {
-  display: flex;
-  flex-direction: column;
-  height: 100%;
-}
-</style>
diff --git a/app/javascript/dashboard/routes/dashboard/notifications/routes.js b/app/javascript/dashboard/routes/dashboard/notifications/routes.js
index 0e532362d..76293f347 100644
--- a/app/javascript/dashboard/routes/dashboard/notifications/routes.js
+++ b/app/javascript/dashboard/routes/dashboard/notifications/routes.js
@@ -11,7 +11,6 @@ export const routes = [
       headerTitle: '',
       icon: '',
       showNewButton: false,
-      showSidemenuIcon: false,
     },
     children: [
       {
diff --git a/app/javascript/dashboard/routes/dashboard/settings/SettingsHeader.vue b/app/javascript/dashboard/routes/dashboard/settings/SettingsHeader.vue
index b5772db54..ec51744ad 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/SettingsHeader.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/SettingsHeader.vue
@@ -35,10 +35,6 @@ export default {
       type: String,
       default: '',
     },
-    showSidemenuIcon: {
-      type: Boolean,
-      default: true,
-    },
   },
   setup() {
     const { isAdmin } = useAdmin();
@@ -59,7 +55,6 @@ export default {
     class="flex justify-between items-center h-20 min-h-[3.5rem] px-4 py-2 bg-n-background"
   >
     <h1 class="flex items-center mb-0 text-2xl text-n-slate-12">
-      <woot-sidemenu-icon v-if="showSidemenuIcon" />
       <BackButton
         v-if="showBackButton"
         :button-label="backButtonLabel"
@@ -68,7 +63,7 @@ export default {
       />
 
       <slot />
-      <span class="text-xl font-medium text-slate-900 dark:text-slate-100">
+      <span class="text-xl font-medium text-n-slate-12">
         {{ headerTitle }}
       </span>
     </h1>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/SettingsLayout.vue b/app/javascript/dashboard/routes/dashboard/settings/SettingsLayout.vue
index 4202c687b..44bad28c1 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/SettingsLayout.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/SettingsLayout.vue
@@ -30,7 +30,7 @@ defineProps({
       </slot>
       <p
         v-else-if="noRecordsFound"
-        class="flex-1 py-20 text-slate-700 dark:text-slate-100 flex items-center justify-center text-base"
+        class="flex-1 py-20 text-n-slate-12 flex items-center justify-center text-base"
       >
         {{ noRecordsMessage }}
       </p>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/SettingsSubPageHeader.vue b/app/javascript/dashboard/routes/dashboard/settings/SettingsSubPageHeader.vue
index ab84902b3..329f1f750 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/SettingsSubPageHeader.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/SettingsSubPageHeader.vue
@@ -9,14 +9,12 @@ export default {
 
 <template>
   <div class="flex flex-col w-full items-start mb-4">
-    <h2
-      class="text-xl font-medium mb-1 text-slate-800 dark:text-slate-100 break-words"
-    >
+    <h2 class="text-xl font-medium mb-1 text-n-slate-12 break-words">
       {{ headerTitle }}
     </h2>
     <p
       v-dompurify-html="headerContent"
-      class="text-sm w-full text-slate-600 dark:text-slate-300"
+      class="text-sm w-full text-n-slate-11"
     />
   </div>
 </template>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/Wrapper.vue b/app/javascript/dashboard/routes/dashboard/settings/Wrapper.vue
index 7bd67b8ab..c8e7cebab 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/Wrapper.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/Wrapper.vue
@@ -11,7 +11,6 @@ const props = defineProps({
   newButtonRoutes: { type: Array, default: () => [] },
   showBackButton: { type: Boolean, default: false },
   backUrl: { type: [String, Object], default: '' },
-  showSidemenuIcon: { type: Boolean, default: true },
   fullWidth: { type: Boolean, default: false },
 });
 
@@ -45,7 +44,6 @@ const showSettingsHeader = computed(
         :show-back-button="showBackButton"
         :back-url="backUrl"
         :show-new-button="showNewButton"
-        :show-sidemenu-icon="showSidemenuIcon"
         class="sticky top-0 z-20"
         :class="{ 'max-w-6xl w-full mx-auto': fullWidth }"
       />
diff --git a/app/javascript/dashboard/routes/dashboard/settings/account/components/AccountDelete.vue b/app/javascript/dashboard/routes/dashboard/settings/account/components/AccountDelete.vue
index 66c969a0a..b57680fca 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/account/components/AccountDelete.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/account/components/AccountDelete.vue
@@ -106,9 +106,7 @@ async function clearDeletionMark() {
     with-border
   >
     <div v-if="isMarkedForDeletion">
-      <div
-        class="p-4 flex-grow-0 flex-shrink-0 flex-[50%] bg-red-50 dark:bg-red-900 rounded"
-      >
+      <div class="p-4 flex-grow-0 flex-shrink-0 flex-[50%] bg-n-ruby-4 rounded">
         <p class="mb-4">
           {{ markedForDeletionMessage }}
         </p>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/agents/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/agents/Index.vue
index 8a2e46655..bd44d9e7b 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/agents/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/agents/Index.vue
@@ -159,7 +159,7 @@ const confirmDeletion = () => {
       </BaseSettingsHeader>
     </template>
     <template #body>
-      <table class="divide-y divide-slate-75 dark:divide-slate-700">
+      <table class="divide-y divide-n-weak">
         <tbody class="divide-y divide-n-weak text-n-slate-11">
           <tr v-for="(agent, index) in agentList" :key="agent.email">
             <td class="py-4 ltr:pr-4 rtl:pl-4">
@@ -190,7 +190,7 @@ const confirmDeletion = () => {
                 {{ getAgentRoleName(agent) }}
 
                 <div
-                  class="absolute left-0 z-10 hidden max-w-[300px] w-auto bg-white rounded-xl border border-slate-50 shadow-lg top-14 md:top-12 dark:bg-slate-800 dark:border-slate-700"
+                  class="absolute left-0 z-10 hidden max-w-[300px] w-auto bg-white rounded-xl border border-n-weak shadow-lg top-14 md:top-12 dark:bg-n-solid-2"
                   :class="{ 'group-hover:block': agent.custom_role_id }"
                 >
                   <div class="flex flex-col gap-1 p-4">
diff --git a/app/javascript/dashboard/routes/dashboard/settings/attributes/AddAttribute.vue b/app/javascript/dashboard/routes/dashboard/settings/attributes/AddAttribute.vue
index cb59d059d..c0b388ce1 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/attributes/AddAttribute.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/attributes/AddAttribute.vue
@@ -246,7 +246,10 @@ export default {
               @close="onTouch"
               @tag="addTagValue"
             />
-            <label v-show="isMultiselectInvalid" class="error-message">
+            <label
+              v-show="isMultiselectInvalid"
+              class="text-n-ruby-9 dark:text-n-ruby-9 text-sm font-normal mt-1"
+            >
               {{ $t('ATTRIBUTES_MGMT.ADD.FORM.TYPE.LIST.ERROR') }}
             </label>
           </div>
@@ -296,26 +299,12 @@ export default {
 
 <style lang="scss" scoped>
 .key-value {
-  padding: 0 var(--space-small) var(--space-small) 0;
+  padding: 0 0.5rem 0.5rem 0;
   font-family: monospace;
 }
 
 .multiselect--wrap {
-  margin-bottom: var(--space-normal);
-
-  .error-message {
-    color: var(--r-400);
-    font-size: var(--font-size-small);
-    font-weight: var(--font-weight-normal);
-  }
-
-  .invalid {
-    ::v-deep {
-      .multiselect__tags {
-        border: 1px solid var(--r-400);
-      }
-    }
-  }
+  margin-bottom: 1rem;
 }
 
 ::v-deep {
@@ -328,7 +317,7 @@ export default {
   }
 
   .multiselect--active .multiselect__tags {
-    border-radius: var(--border-radius-normal);
+    border-radius: 0.3125rem;
   }
 }
 </style>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/attributes/CustomAttribute.vue b/app/javascript/dashboard/routes/dashboard/settings/attributes/CustomAttribute.vue
index 2e120c1e0..420edafce 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/attributes/CustomAttribute.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/attributes/CustomAttribute.vue
@@ -100,9 +100,7 @@ const tableHeaders = computed(() => {
           {{ tableHeader }}
         </th>
       </thead>
-      <tbody
-        class="divide-y divide-slate-25 dark:divide-slate-800 flex-1 text-slate-700 dark:text-slate-100"
-      >
+      <tbody class="divide-y divide-n-weak flex-1 text-n-slate-12">
         <tr v-for="attribute in attributes" :key="attribute.attribute_key">
           <td
             class="py-4 ltr:pr-4 rtl:pl-4 overflow-hidden whitespace-nowrap text-ellipsis"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/attributes/EditAttribute.vue b/app/javascript/dashboard/routes/dashboard/settings/attributes/EditAttribute.vue
index 64372ef8a..712d65588 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/attributes/EditAttribute.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/attributes/EditAttribute.vue
@@ -236,7 +236,10 @@ export default {
             taggable
             @tag="addTagValue"
           />
-          <label v-show="isMultiselectInvalid" class="error-message">
+          <label
+            v-show="isMultiselectInvalid"
+            class="text-n-ruby-9 dark:text-n-ruby-9 text-sm font-normal mt-1"
+          >
             {{ $t('ATTRIBUTES_MGMT.ADD.FORM.TYPE.LIST.ERROR') }}
           </label>
         </div>
@@ -286,26 +289,12 @@ export default {
 
 <style lang="scss" scoped>
 .key-value {
-  padding: 0 var(--space-small) var(--space-small) 0;
+  padding: 0 0.5rem 0.5rem 0;
   font-family: monospace;
 }
 
 .multiselect--wrap {
-  margin-bottom: var(--space-normal);
-
-  .error-message {
-    color: var(--r-400);
-    font-size: var(--font-size-small);
-    font-weight: var(--font-weight-normal);
-  }
-
-  .invalid {
-    ::v-deep {
-      .multiselect__tags {
-        border: 1px solid var(--r-400);
-      }
-    }
-  }
+  margin-bottom: 1rem;
 }
 
 ::v-deep {
@@ -318,7 +307,7 @@ export default {
   }
 
   .multiselect--active .multiselect__tags {
-    border-radius: var(--border-radius-normal);
+    border-radius: 0.3125rem;
   }
 }
 </style>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/attributes/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/attributes/Index.vue
index 77d9df74e..636892005 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/attributes/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/attributes/Index.vue
@@ -79,7 +79,7 @@ const onClickTabChange = index => {
     </template>
     <template #preBody>
       <woot-tabs
-        class="font-medium [&_.tabs]:p-0 mb-4"
+        class="font-medium [&_ul]:p-0 mb-4"
         :index="selectedTabIndex"
         @change="onClickTabChange"
       >
@@ -89,6 +89,7 @@ const onClickTabChange = index => {
           :index="index"
           :name="tab.name"
           :show-badge="false"
+          is-compact
         />
       </woot-tabs>
     </template>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/auditlogs/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/auditlogs/Index.vue
index 13c7521d4..f98297f21 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/auditlogs/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/auditlogs/Index.vue
@@ -83,7 +83,7 @@ const tableHeaders = computed(() => {
       feature-name="audit_logs"
     />
 
-    <div class="mt-6 flex-1 text-slate-700 dark:text-slate-300">
+    <div class="mt-6 flex-1 text-n-slate-11">
       <woot-loading-state
         v-if="uiFlags.fetchingList"
         :message="$t('AUDIT_LOGS.LOADING')"
@@ -95,7 +95,7 @@ const tableHeaders = computed(() => {
         {{ $t('AUDIT_LOGS.LIST.404') }}
       </p>
       <div v-else class="min-w-full overflow-x-auto">
-        <table class="divide-y divide-slate-75 dark:divide-slate-700">
+        <table class="divide-y divide-n-weak">
           <thead>
             <th
               v-for="thHeader in tableHeaders"
@@ -128,7 +128,7 @@ const tableHeaders = computed(() => {
           :current-page="Number(meta.currentPage)"
           :total-count="meta.totalEntries"
           :page-size="meta.perPage"
-          class="border-slate-50 dark:border-slate-800 border-t !px-0 py-4"
+          class="border-n-weak border-t !px-0 py-4"
           @page-change="onPageChange"
         />
       </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/automation/AddAutomationRule.vue b/app/javascript/dashboard/routes/dashboard/settings/automation/AddAutomationRule.vue
index c92d0b1c8..1cd0e9069 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/automation/AddAutomationRule.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/automation/AddAutomationRule.vue
@@ -215,7 +215,7 @@ export default {
           </label>
           <p
             v-if="hasAutomationMutated"
-            class="text-xs text-right text-green-500 pt-1 dark:text-green-500"
+            class="text-xs text-right text-n-teal-10 pt-1"
           >
             {{ $t('AUTOMATION.FORM.RESET_MESSAGE') }}
           </p>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/automation/EditAutomationRule.vue b/app/javascript/dashboard/routes/dashboard/settings/automation/EditAutomationRule.vue
index 208fcf7ec..aac65302b 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/automation/EditAutomationRule.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/automation/EditAutomationRule.vue
@@ -337,7 +337,7 @@ export default {
     @apply m-0;
   }
   .info-message {
-    @apply text-xs text-green-500 dark:text-green-500 text-right;
+    @apply text-xs text-n-teal-10  text-right;
   }
 
   @apply mb-6;
diff --git a/app/javascript/dashboard/routes/dashboard/settings/automation/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/automation/Index.vue
index 02e24287b..3d0e82d88 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/automation/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/automation/Index.vue
@@ -196,7 +196,7 @@ const tableHeaders = computed(() => {
       </BaseSettingsHeader>
     </template>
     <template #body>
-      <table class="min-w-full divide-y divide-slate-75 dark:divide-slate-700">
+      <table class="min-w-full divide-y divide-n-weak">
         <thead>
           <th
             v-for="thHeader in tableHeaders"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/canned/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/canned/Index.vue
index 474439663..216aa1923 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/canned/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/canned/Index.vue
@@ -141,14 +141,11 @@ const tableHeaders = computed(() => {
       />
       <p
         v-else-if="!records.length"
-        class="flex flex-col items-center justify-center h-full text-base text-slate-600 dark:text-slate-300 py-8"
+        class="flex flex-col items-center justify-center h-full text-base text-n-slate-11 py-8"
       >
         {{ $t('CANNED_MGMT.LIST.404') }}
       </p>
-      <table
-        v-else
-        class="min-w-full overflow-x-auto divide-y divide-slate-75 dark:divide-slate-700"
-      >
+      <table v-else class="min-w-full overflow-x-auto divide-y divide-n-weak">
         <thead>
           <th
             v-for="thHeader in tableHeaders"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/components/BaseSettingsHeader.vue b/app/javascript/dashboard/routes/dashboard/settings/components/BaseSettingsHeader.vue
index 1d42b7972..3b8dfed7c 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/components/BaseSettingsHeader.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/components/BaseSettingsHeader.vue
@@ -51,10 +51,10 @@ const openInNewTab = url => {
       <div class="flex items-center gap-3">
         <div
           v-if="iconName"
-          class="flex items-center w-10 h-10 p-1 rounded-full bg-woot-25/60 dark:bg-woot-900/60"
+          class="flex items-center w-10 h-10 p-1 rounded-full bg-n-blue-2"
         >
           <div
-            class="flex items-center justify-center w-full h-full rounded-full bg-woot-75/70 dark:bg-woot-800/40"
+            class="flex items-center justify-center w-full h-full rounded-full bg-n-blue-3"
           >
             <fluent-icon
               size="14"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/components/BaseSettingsListItem.vue b/app/javascript/dashboard/routes/dashboard/settings/components/BaseSettingsListItem.vue
index 3f86b0727..6c4a10636 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/components/BaseSettingsListItem.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/components/BaseSettingsListItem.vue
@@ -21,7 +21,7 @@ defineProps({
           class="flex items-center justify-between w-full gap-3 sm:justify-normal whitespace-nowrap"
         >
           <h3
-            class="justify-between tracking-tight font-medium truncate w-fit sm:justify-normal text-slate-900 dark:text-slate-25"
+            class="justify-between tracking-tight font-medium truncate w-fit sm:justify-normal text-n-slate-12"
           >
             <slot name="title">
               {{ title }}
@@ -29,9 +29,7 @@ defineProps({
           </h3>
           <slot name="label" />
         </div>
-        <p
-          class="text-base text-slate-600 dark:text-slate-300 max-w-[25rem] w-full line-clamp-2"
-        >
+        <p class="text-base text-n-slate-11 max-w-[25rem] w-full line-clamp-2">
           <slot name="description">
             {{ description }}
           </slot>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/customRoles/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/customRoles/Index.vue
index 0d2316c21..501313010 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/customRoles/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/customRoles/Index.vue
@@ -147,15 +147,12 @@ const confirmDeletion = () => {
 
     <template #body>
       <CustomRolePaywall v-if="isBehindAPaywall" />
-      <table
-        v-else
-        class="min-w-full overflow-x-auto divide-y divide-slate-75 dark:divide-slate-700"
-      >
+      <table v-else class="min-w-full overflow-x-auto divide-y divide-n-weak">
         <thead>
           <th
             v-for="thHeader in tableHeaders"
             :key="thHeader"
-            class="py-4 ltr:pr-4 rtl:pl-4 font-semibold text-left text-slate-700 dark:text-slate-300"
+            class="py-4 ltr:pr-4 rtl:pl-4 font-semibold text-left text-n-slate-11"
           >
             <span class="mb-0">
               {{ thHeader }}
diff --git a/app/javascript/dashboard/routes/dashboard/settings/customRoles/component/CustomRoleModal.vue b/app/javascript/dashboard/routes/dashboard/settings/customRoles/component/CustomRoleModal.vue
index cddbddd32..ed67a0636 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/customRoles/component/CustomRoleModal.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/customRoles/component/CustomRoleModal.vue
@@ -186,7 +186,7 @@ const isSubmitDisabled = computed(
       </div>
 
       <div class="w-full">
-        <label :class="{ 'text-red-500': v$.selectedPermissions.$error }">
+        <label :class="{ 'text-n-ruby-9': v$.selectedPermissions.$error }">
           {{ $t('CUSTOM_ROLE.FORM.PERMISSIONS.LABEL') }}
         </label>
         <div class="flex flex-col gap-2.5 mb-4 mt-2">
diff --git a/app/javascript/dashboard/routes/dashboard/settings/customRoles/component/CustomRolePaywall.vue b/app/javascript/dashboard/routes/dashboard/settings/customRoles/component/CustomRolePaywall.vue
index aefe281ff..7e8b6f255 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/customRoles/component/CustomRolePaywall.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/customRoles/component/CustomRolePaywall.vue
@@ -79,7 +79,7 @@ const tableHeaders = computed(() => {
         <th
           v-for="thHeader in tableHeaders"
           :key="thHeader"
-          class="py-4 ltr:pr-4 rtl:pl-4 font-semibold text-left text-slate-700 dark:text-slate-300"
+          class="py-4 ltr:pr-4 rtl:pl-4 font-semibold text-left text-n-slate-11"
         >
           <span class="mb-0">
             {{ thHeader }}
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/FinishSetup.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/FinishSetup.vue
index fcac0648e..f6d0707af 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/FinishSetup.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/FinishSetup.vue
@@ -114,11 +114,11 @@ export default {
           />
         </div>
         <div v-if="isWhatsAppCloudInbox" class="w-[50%] max-w-[50%] ml-[25%]">
-          <p class="mt-8 font-medium text-slate-700 dark:text-slate-200">
+          <p class="mt-8 font-medium text-n-slate-11">
             {{ $t('INBOX_MGMT.ADD.WHATSAPP.API_CALLBACK.WEBHOOK_URL') }}
           </p>
           <woot-code lang="html" :script="currentInbox.callback_webhook_url" />
-          <p class="mt-8 font-medium text-slate-700 dark:text-slate-200">
+          <p class="mt-8 font-medium text-n-slate-11">
             {{
               $t(
                 'INBOX_MGMT.ADD.WHATSAPP.API_CALLBACK.WEBHOOK_VERIFICATION_TOKEN'
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/Index.vue
index f7ce40f66..aae2263a7 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/Index.vue
@@ -88,9 +88,7 @@ const openDelete = inbox => {
     </template>
     <template #body>
       <table class="min-w-full overflow-x-auto">
-        <tbody
-          class="divide-y divide-n-weak flex-1 text-slate-700 dark:text-slate-100"
-        >
+        <tbody class="divide-y divide-n-weak flex-1 text-n-slate-12">
           <tr v-for="inbox in inboxesList" :key="inbox.id">
             <td class="py-4 ltr:pr-4 rtl:pl-4">
               <div class="flex items-center flex-row gap-4">
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/PreChatForm/PreChatFields.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/PreChatForm/PreChatFields.vue
index cf7048c29..8936558ee 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/PreChatForm/PreChatFields.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/PreChatForm/PreChatFields.vue
@@ -42,7 +42,7 @@ export default {
     @end="onDragEnd"
   >
     <template #item="{ element: item }">
-      <tr>
+      <tr class="border-b border-n-weak">
         <td class="pre-chat-field"><fluent-icon icon="drag" /></td>
         <td class="pre-chat-field">
           <woot-switch
@@ -98,14 +98,14 @@ export default {
 
 <style scoped lang="scss">
 .pre-chat-field {
-  @apply py-4 px-2 text-slate-700 dark:text-slate-100;
+  @apply py-4 px-2 text-n-slate-12;
 
   svg {
     @apply flex items-center;
   }
 }
 .disabled-text {
-  @apply text-slate-500 dark:text-slate-400;
+  @apply text-n-slate-11;
 }
 
 table {
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/PreChatForm/Settings.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/PreChatForm/Settings.vue
index 0d0e49567..bb7274db0 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/PreChatForm/Settings.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/PreChatForm/Settings.vue
@@ -127,9 +127,11 @@ export default {
         </div>
         <div class="mt-4">
           <label>{{ $t('INBOX_MGMT.PRE_CHAT_FORM.SET_FIELDS') }}</label>
-          <table class="table w-full table-striped woot-table">
+          <table class="table w-full table-striped mt-4">
             <thead class="thead-dark">
-              <tr>
+              <tr
+                class="[&>th]:font-semibold [&>th]:tracking-[1px] ltr:[&>th]:text-left rtl:[&>th]:text-right [&>th]:px-2.5 [&>th]:uppercase [&>th]:text-n-slate-12"
+              >
                 <th scope="col" />
                 <th scope="col" />
                 <th scope="col">
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/Settings.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/Settings.vue
index a3bb9f3f4..a3f60c6d5 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/Settings.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/Settings.vue
@@ -390,7 +390,7 @@ export default {
       :header-title="inboxName"
     >
       <woot-tabs
-        class="settings--tabs"
+        class="[&_ul]:p-0"
         :index="selectedTabIndex"
         :border="false"
         @change="onTabChange"
@@ -401,6 +401,7 @@ export default {
           :index="index"
           :name="tab.name"
           :show-badge="false"
+          is-compact
         />
       </woot-tabs>
     </SettingIntroBanner>
@@ -814,11 +815,3 @@ export default {
     </section>
   </div>
 </template>
-
-<style scoped lang="scss">
-.settings--tabs {
-  ::v-deep .tabs {
-    @apply p-0;
-  }
-}
-</style>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/WidgetBuilder.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/WidgetBuilder.vue
index 9e88287e0..08ad90a92 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/WidgetBuilder.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/WidgetBuilder.vue
@@ -408,7 +408,7 @@ export default {
         />
         <div
           v-if="isWidgetPreview"
-          class="flex flex-col items-center justify-end min-h-[40.625rem] mx-5 mb-5 p-2.5 bg-slate-50 dark:bg-slate-900/50 rounded-lg"
+          class="flex flex-col items-center justify-end min-h-[40.625rem] mx-5 mb-5 p-2.5 bg-n-slate-3 rounded-lg"
         >
           <Widget
             :welcome-heading="welcomeHeading"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Instagram.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Instagram.vue
index 83620b496..bcdeafcc9 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Instagram.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/channels/Instagram.vue
@@ -65,7 +65,7 @@ export default {
 
 <template>
   <div
-    class="border border-slate-25 dark:border-slate-800/60 bg-white dark:bg-slate-900 h-full p-6 w-full max-w-full md:w-3/4 md:max-w-[75%] flex-shrink-0 flex-grow-0"
+    class="border border-n-weak bg-n-background h-full p-6 w-full max-w-full md:w-3/4 md:max-w-[75%] flex-shrink-0 flex-grow-0"
   >
     <div class="flex flex-col items-center justify-start h-full text-center">
       <div v-if="hasError" class="max-w-lg mx-auto text-center">
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/components/BusinessDay.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/components/BusinessDay.vue
index ccbb06617..14ba5b371 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/components/BusinessDay.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/components/BusinessDay.vue
@@ -193,14 +193,14 @@ export default {
         />
       </div>
       <div v-if="hasError" class="date-error pt-1">
-        <span class="error text-xs text-red-300 dark:text-red-500">{{
+        <span class="error text-xs text-n-ruby-9">{{
           $t('INBOX_MGMT.BUSINESS_HOURS.DAY.VALIDATION_ERROR')
         }}</span>
       </div>
     </div>
     <div
       v-else
-      class="flex items-center flex-shrink-0 flex-grow text-sm text-slate-500 dark:text-slate-300"
+      class="flex items-center flex-shrink-0 flex-grow text-sm text-n-slate-11"
     >
       <span>
         {{ $t('INBOX_MGMT.BUSINESS_HOURS.DAY.UNAVAILABLE') }}
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/components/InputRadioGroup.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/components/InputRadioGroup.vue
index ded4fb9d7..cf0d0d2c2 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/components/InputRadioGroup.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/components/InputRadioGroup.vue
@@ -43,22 +43,22 @@ export default {
 
 <style lang="scss" scoped>
 .radio-group-label {
-  margin-bottom: var(--space-smaller);
+  margin-bottom: 0.25rem;
 }
 .radio-group {
   display: inline-block;
-  margin-bottom: var(--space-small);
+  margin-bottom: 0.5rem;
 }
 .radio-group-item {
   float: left;
-  margin-right: var(--space-one);
+  margin-right: 0.625rem;
   .radio-group-item-label {
     display: flex;
     align-items: center;
     cursor: pointer;
 
     .radio-input {
-      margin: 0 var(--space-one) 0 0;
+      margin: 0 0.625rem 0 0;
     }
   }
 }
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/components/SenderNameExamplePreview.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/components/SenderNameExamplePreview.vue
index 2b5b23907..5c08b143b 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/components/SenderNameExamplePreview.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/components/SenderNameExamplePreview.vue
@@ -73,7 +73,7 @@ export default {
     <button
       v-for="keyOption in senderNameKeyOptions"
       :key="keyOption.key"
-      class="text-slate-800 dark:text-slate-100 cursor-pointer p-0"
+      class="text-n-slate-12 cursor-pointer p-0"
       @click="toggleSenderNameType(keyOption.key)"
     >
       <PreviewCard
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/components/WeeklyAvailability.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/components/WeeklyAvailability.vue
index 758dfa1ff..83f2bed8c 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/components/WeeklyAvailability.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/components/WeeklyAvailability.vue
@@ -136,7 +136,7 @@ export default {
           />
           {{ $t('INBOX_MGMT.BUSINESS_HOURS.TOGGLE_AVAILABILITY') }}
         </label>
-        <p class="mb-4 text-slate-700 dark:text-slate-300">
+        <p class="mb-4 text-n-slate-11">
           {{ $t('INBOX_MGMT.BUSINESS_HOURS.TOGGLE_HELP') }}
         </p>
         <div v-if="isBusinessHoursEnabled" class="mb-6">
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/facebook/Reauthorize.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/facebook/Reauthorize.vue
index e5018b1da..c234cb7ae 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/facebook/Reauthorize.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/facebook/Reauthorize.vue
@@ -103,12 +103,10 @@ export default {
 </template>
 
 <style lang="scss" scoped>
-@import 'dashboard/assets/scss/variables';
-
 .fb--login {
   img {
     max-width: 240px;
-    padding: $space-normal 0;
+    padding: 1rem 0;
   }
 }
 </style>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/inbox/settingsPage/CollaboratorsPage.vue b/app/javascript/dashboard/routes/dashboard/settings/inbox/settingsPage/CollaboratorsPage.vue
index 8f72894c2..d2ee47e48 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/inbox/settingsPage/CollaboratorsPage.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/inbox/settingsPage/CollaboratorsPage.vue
@@ -170,10 +170,7 @@ export default {
         </p>
       </label>
 
-      <div
-        v-if="enableAutoAssignment && isEnterprise"
-        class="max-assignment-container"
-      >
+      <div v-if="enableAutoAssignment && isEnterprise" class="py-3">
         <woot-input
           v-model="maxAssignmentLimit"
           type="number"
@@ -196,13 +193,3 @@ export default {
     </SettingsSection>
   </div>
 </template>
-
-<style scoped lang="scss">
-@import 'dashboard/assets/scss/variables';
-@import 'dashboard/assets/scss/mixins';
-
-.max-assignment-container {
-  padding-top: var(--space-slab);
-  padding-bottom: var(--space-slab);
-}
-</style>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/integrations/DashboardApps/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/integrations/DashboardApps/Index.vue
index a82321f1d..da8adc496 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/integrations/DashboardApps/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/integrations/DashboardApps/Index.vue
@@ -102,7 +102,7 @@ export default {
         />
       </template>
     </BaseSettingsHeader>
-    <div class="w-full overflow-x-auto text-slate-700 dark:text-slate-200">
+    <div class="w-full overflow-x-auto text-n-slate-11">
       <p
         v-if="!uiFlags.isFetching && !records.length"
         class="flex flex-col items-center justify-center h-full"
@@ -115,18 +115,18 @@ export default {
       />
       <table
         v-if="!uiFlags.isFetching && records.length"
-        class="min-w-full divide-y divide-slate-75 dark:divide-slate-700"
+        class="min-w-full divide-y divide-n-weak"
       >
         <thead>
           <th
             v-for="thHeader in tableHeaders"
             :key="thHeader"
-            class="py-4 ltr:pr-4 rtl:pl-4 font-semibold text-left text-slate-700 dark:text-slate-300"
+            class="py-4 ltr:pr-4 rtl:pl-4 font-semibold text-left text-n-slate-11"
           >
             {{ thHeader }}
           </th>
         </thead>
-        <tbody class="divide-y divide-slate-50 dark:divide-slate-800">
+        <tbody class="divide-y divide-n-weak">
           <DashboardAppsRow
             v-for="(dashboardAppItem, index) in records"
             :key="dashboardAppItem.id"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/integrations/MultipleIntegrationHooks.vue b/app/javascript/dashboard/routes/dashboard/settings/integrations/MultipleIntegrationHooks.vue
index d8e770d49..ddb5197e0 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/integrations/MultipleIntegrationHooks.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/integrations/MultipleIntegrationHooks.vue
@@ -78,8 +78,10 @@ export default {
       </template>
     </BaseSettingsHeader>
     <div class="w-full">
-      <table v-if="hasConnectedHooks" class="woot-table">
-        <thead>
+      <table v-if="hasConnectedHooks">
+        <thead
+          class="[&>th]:font-semibold [&>th]:tracking-[1px] ltr:[&>th]:text-left rtl:[&>th]:text-right [&>th]:px-2.5 [&>th]:uppercase [&>th]:text-n-slate-12"
+        >
           <th
             v-for="hookHeader in hookHeaders"
             :key="hookHeader"
@@ -92,7 +94,11 @@ export default {
           </th>
         </thead>
         <tbody>
-          <tr v-for="hook in hooks" :key="hook.id">
+          <tr
+            v-for="hook in hooks"
+            :key="hook.id"
+            class="border-b border-n-weak [&>td]:p-2.5 [&>td]:text-n-slate-12"
+          >
             <td
               v-for="property in hook.properties"
               :key="property"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/integrations/NewHook.vue b/app/javascript/dashboard/routes/dashboard/settings/integrations/NewHook.vue
index c7b4cde1f..5fe350215 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/integrations/NewHook.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/integrations/NewHook.vue
@@ -179,7 +179,7 @@ export default {
 }
 
 [data-invalid] .formkit-message {
-  @apply text-red-500 block text-xs font-normal my-1 w-full;
+  @apply text-n-ruby-9 block text-xs font-normal my-1 w-full;
 }
 
 .formkit-outer[data-type='checkbox'] .formkit-wrapper {
diff --git a/app/javascript/dashboard/routes/dashboard/settings/integrations/Shopify.vue b/app/javascript/dashboard/routes/dashboard/settings/integrations/Shopify.vue
index f88769b91..304aa1724 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/integrations/Shopify.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/integrations/Shopify.vue
@@ -117,7 +117,7 @@ onMounted(() => {
         v-if="error"
         class="flex items-center justify-center flex-1 outline outline-n-container outline-1 bg-n-alpha-3 rounded-md shadow p-6"
       >
-        <p class="text-red-500">
+        <p class="text-n-ruby-9">
           {{ $t('INTEGRATION_SETTINGS.SHOPIFY.ERROR') }}
         </p>
       </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/integrations/Slack/SelectChannelWarning.vue b/app/javascript/dashboard/routes/dashboard/settings/integrations/Slack/SelectChannelWarning.vue
index f94f3640f..6639da4b4 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/integrations/Slack/SelectChannelWarning.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/integrations/Slack/SelectChannelWarning.vue
@@ -97,7 +97,7 @@ const updateIntegration = async () => {
       <div v-else class="inline-flex">
         <select
           v-model="selectedChannelId"
-          class="h-8 py-1 mr-4 text-xs leading-4 border border-yellow-300"
+          class="h-8 py-1 mr-4 text-xs leading-4 border border-n-amber-10"
         >
           <option value="">
             {{ $t('INTEGRATION_SETTINGS.SLACK.SELECT_CHANNEL.OPTION_LABEL') }}
diff --git a/app/javascript/dashboard/routes/dashboard/settings/integrations/Webhooks/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/integrations/Webhooks/Index.vue
index 81a654964..2c9a71d94 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/integrations/Webhooks/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/integrations/Webhooks/Index.vue
@@ -115,7 +115,7 @@ export default {
       </BaseSettingsHeader>
     </template>
     <template #body>
-      <table class="min-w-full divide-y divide-slate-75 dark:divide-slate-700">
+      <table class="min-w-full divide-y divide-n-weak">
         <thead>
           <th
             v-for="thHeader in tableHeaders"
@@ -125,9 +125,7 @@ export default {
             {{ thHeader }}
           </th>
         </thead>
-        <tbody
-          class="divide-y divide-slate-25 dark:divide-slate-800 flex-1 text-slate-700 dark:text-slate-100"
-        >
+        <tbody class="divide-y divide-n-weak flex-1 text-n-slate-12">
           <WebhookRow
             v-for="(webHookItem, index) in records"
             :key="webHookItem.id"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/integrations/Webhooks/WebhookRow.vue b/app/javascript/dashboard/routes/dashboard/settings/integrations/Webhooks/WebhookRow.vue
index 1ff6244ba..e2bf986e0 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/integrations/Webhooks/WebhookRow.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/integrations/Webhooks/WebhookRow.vue
@@ -37,10 +37,10 @@ const subscribedEvents = computed(() => {
 <template>
   <tr>
     <td class="py-4 ltr:pr-4 rtl:pl-4">
-      <div class="font-medium break-words text-slate-700 dark:text-slate-100">
+      <div class="font-medium break-words text-n-slate-12">
         {{ webhook.url }}
       </div>
-      <div class="block mt-1 text-sm text-slate-500 dark:text-slate-400">
+      <div class="block mt-1 text-sm text-n-slate-11">
         <span class="font-medium">
           {{ $t('INTEGRATION_SETTINGS.WEBHOOK.SUBSCRIBED_EVENTS') }}:
         </span>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/labels/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/labels/Index.vue
index 9f7faa889..7a2944a2c 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/labels/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/labels/Index.vue
@@ -104,26 +104,20 @@ onBeforeMount(() => {
       </BaseSettingsHeader>
     </template>
     <template #body>
-      <table
-        class="min-w-full overflow-x-auto divide-y divide-slate-75 dark:divide-slate-700"
-      >
+      <table class="min-w-full overflow-x-auto divide-y divide-n-weak">
         <thead>
           <th
             v-for="thHeader in tableHeaders"
             :key="thHeader"
-            class="py-4 font-semibold text-left ltr:pr-4 rtl:pl-4 text-slate-700 dark:text-slate-300"
+            class="py-4 font-semibold text-left ltr:pr-4 rtl:pl-4 text-n-slate-11"
           >
             {{ thHeader }}
           </th>
         </thead>
-        <tbody
-          class="flex-1 divide-y divide-slate-25 dark:divide-slate-800 text-slate-700 dark:text-slate-100"
-        >
+        <tbody class="flex-1 divide-y divide-n-weak text-n-slate-12">
           <tr v-for="(label, index) in records" :key="label.title">
             <td class="py-4 ltr:pr-4 rtl:pl-4">
-              <span
-                class="mb-1 font-medium break-words text-slate-700 dark:text-slate-100"
-              >
+              <span class="mb-1 font-medium break-words text-n-slate-12">
                 {{ label.title }}
               </span>
             </td>
@@ -131,7 +125,7 @@ onBeforeMount(() => {
             <td class="py-4 leading-6 ltr:pr-4 rtl:pl-4">
               <div class="flex items-center">
                 <span
-                  class="w-4 h-4 mr-1 border border-solid rounded rtl:mr-0 rtl:ml-1 border-slate-50 dark:border-slate-700"
+                  class="w-4 h-4 mr-1 border border-solid rounded rtl:mr-0 rtl:ml-1 border-n-weak"
                   :style="{ backgroundColor: label.color }"
                 />
                 {{ label.color }}
diff --git a/app/javascript/dashboard/routes/dashboard/settings/macros/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/macros/Index.vue
index 46579678d..c5ec47327 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/macros/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/macros/Index.vue
@@ -83,7 +83,7 @@ const tableHeaders = computed(() => {
       </BaseSettingsHeader>
     </template>
     <template #body>
-      <table class="min-w-full divide-y divide-slate-75 dark:divide-slate-700">
+      <table class="min-w-full divide-y divide-n-weak">
         <thead>
           <th
             v-for="thHeader in tableHeaders"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/macros/MacroNode.vue b/app/javascript/dashboard/routes/dashboard/settings/macros/MacroNode.vue
index e010b270c..687a14285 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/macros/MacroNode.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/macros/MacroNode.vue
@@ -61,10 +61,10 @@ const dropdownValues = () => {
       sm
       slate
       icon="i-lucide-menu"
-      class="absolute cursor-move -left-10 mr-2 macros__node-drag-handle"
+      class="absolute cursor-move ltr:-left-10 rtl:-right-10 ltr:mr-2 rtl:ml-2 macros__node-drag-handle"
     />
     <div
-      class="flex-grow p-2 mr-2 rounded-md shadow-sm outline outline-1 outline-n-weak"
+      class="flex-grow p-2 ltr:mr-2 rtl:ml-2 rounded-md shadow-sm outline outline-1 outline-n-weak"
       :class="
         errorKey
           ? 'animate-shake bg-n-ruby-8/20 outline-n-ruby-5 dark:outline-n-ruby-5'
diff --git a/app/javascript/dashboard/routes/dashboard/settings/macros/MacroNodes.vue b/app/javascript/dashboard/routes/dashboard/settings/macros/MacroNodes.vue
index 855aae9d3..dd7b3a47b 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/macros/MacroNodes.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/macros/MacroNodes.vue
@@ -118,33 +118,26 @@ export default {
 
 .macro__node:not(:last-child) {
   position: relative;
-  padding-bottom: var(--space-large);
+  padding-bottom: 2rem;
 }
 
 .macro__node:not(:last-child):not(.sortable-chosen):after,
 .macros__nodes-draggable:after {
-  content: '';
-  position: absolute;
-  height: var(--space-large);
-  width: var(--space-smaller);
-  margin-left: var(--space-medium);
-
-  border-left: 1px dashed var(--s-500);
+  @apply border-l dark:border-n-blue-11 border-n-blue-7 border-dashed ltr:ml-6 rtl:mr-6 absolute h-8 w-1 content-[""];
 }
 
 .macros__nodes-draggable {
   position: relative;
-  padding-bottom: var(--space-large);
+  padding-bottom: 2rem;
 }
 
 .macros__node-action-container {
   position: relative;
   .drag-handle {
     position: absolute;
-    left: var(--space-minus-medium);
-    top: var(--space-smaller);
+    left: -1.5rem;
+    top: 0.25rem;
     cursor: move;
-    color: var(--s-400);
   }
 }
 </style>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/macros/MacroProperties.vue b/app/javascript/dashboard/routes/dashboard/settings/macros/MacroProperties.vue
index 1d5c80579..c4de2b2c2 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/macros/MacroProperties.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/macros/MacroProperties.vue
@@ -20,8 +20,8 @@ export default {
   methods: {
     isActive(key) {
       return this.macroVisibility === key
-        ? 'bg-woot-25 dark:bg-slate-900 border-woot-200 dark:border-woot-700'
-        : 'bg-white dark:bg-slate-900 border-slate-200 dark:border-slate-600';
+        ? 'bg-n-blue-2 dark:bg-n-blue-1 border-n-blue-3 dark:border-n-blue-4'
+        : 'bg-white dark:bg-n-solid-2 border-n-weak dark:border-n-strong';
     },
     onUpdateName(value) {
       this.$emit('update:name', value);
@@ -48,9 +48,7 @@ export default {
       />
     </div>
     <div class="mt-2">
-      <p
-        class="block m-0 text-sm font-medium leading-[1.8] text-slate-700 dark:text-slate-100"
-      >
+      <p class="block m-0 text-sm font-medium leading-[1.8] text-n-slate-12">
         {{ $t('MACROS.EDITOR.VISIBILITY.LABEL') }}
       </p>
       <div class="grid grid-cols-1 lg:grid-cols-2 gap-3">
@@ -63,14 +61,14 @@ export default {
             v-if="macroVisibility === 'global'"
             icon="checkmark-circle"
             type="solid"
-            class="absolute text-woot-500 dark:text-woot-500 top-2 right-2"
+            class="absolute text-n-brand top-2 right-2"
           />
           <p
-            class="block m-0 text-sm font-medium leading-[1.8] text-slate-700 dark:text-slate-100"
+            class="block m-0 text-sm font-medium leading-[1.8] text-n-slate-12"
           >
             {{ $t('MACROS.EDITOR.VISIBILITY.GLOBAL.LABEL') }}
           </p>
-          <p class="text-xs text-slate-500 dark:text-slate-200">
+          <p class="text-xs text-n-slate-11">
             {{ $t('MACROS.EDITOR.VISIBILITY.GLOBAL.DESCRIPTION') }}
           </p>
         </button>
@@ -83,14 +81,14 @@ export default {
             v-if="macroVisibility === 'personal'"
             icon="checkmark-circle"
             type="solid"
-            class="absolute text-woot-500 dark:text-woot-500 top-2 right-2"
+            class="absolute text-n-brand top-2 right-2"
           />
           <p
-            class="block m-0 text-sm font-medium leading-[1.8] text-slate-700 dark:text-slate-100"
+            class="block m-0 text-sm font-medium leading-[1.8] text-n-slate-12"
           >
             {{ $t('MACROS.EDITOR.VISIBILITY.PERSONAL.LABEL') }}
           </p>
-          <p class="text-xs text-slate-500 dark:text-slate-200">
+          <p class="text-xs text-n-slate-11">
             {{ $t('MACROS.EDITOR.VISIBILITY.PERSONAL.DESCRIPTION') }}
           </p>
         </button>
@@ -99,9 +97,7 @@ export default {
         class="mt-2 flex items-start p-2 bg-n-slate-3 dark:bg-n-solid-3 rounded-md"
       >
         <fluent-icon icon="info" size="16" class="flex-shrink-0 mt-0.5" />
-        <p
-          class="ml-2 rtl:ml-0 rtl:mr-2 mb-0 text-slate-600 dark:text-slate-200"
-        >
+        <p class="ml-2 rtl:ml-0 rtl:mr-2 mb-0 text-n-slate-11">
           {{ $t('MACROS.ORDER_INFO') }}
         </p>
       </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/AccessToken.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/AccessToken.vue
index 5b0b43fac..027492629 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/profile/AccessToken.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/profile/AccessToken.vue
@@ -33,7 +33,7 @@ const onReset = () => {
   <div class="flex flex-row justify-between gap-4">
     <woot-input
       name="access_token"
-      class="flex-1 [&>input]:!py-1.5 ltr:[&>input]:!pr-9 ltr:[&>input]:!pl-3 rtl:[&>input]:!pl-9 rtl:[&>input]:!pr-3 focus:[&>input]:!border-slate-200 focus:[&>input]:dark:!border-slate-600 [&>input]:cursor-not-allowed relative"
+      class="flex-1 [&>input]:!py-1.5 ltr:[&>input]:!pr-9 ltr:[&>input]:!pl-3 rtl:[&>input]:!pl-9 rtl:[&>input]:!pr-3 focus:[&>input]:!border-n-weak [&>input]:cursor-not-allowed relative"
       :styles="{
         borderRadius: '12px',
         fontSize: '14px',
diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/AudioAlertCondition.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/AudioAlertCondition.vue
index 898d9afb6..a83cecaa4 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/profile/AudioAlertCondition.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/profile/AudioAlertCondition.vue
@@ -20,7 +20,7 @@ const onChange = (id, value) => {
 <template>
   <div>
     <label
-      class="flex justify-between pb-1 text-sm font-medium leading-6 text-ash-900"
+      class="flex justify-between pb-1 text-sm font-medium leading-6 text-n-slate-12"
     >
       {{ label }}
     </label>
@@ -37,7 +37,7 @@ const onChange = (id, value) => {
           @update="onChange"
         />
         <label
-          class="text-sm font-normal text-ash-900"
+          class="text-sm font-normal text-n-slate-12"
           :for="`checkbox-condition-${item.value}`"
         >
           {{ item.label }}
diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/AudioAlertEvent.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/AudioAlertEvent.vue
index 890956f7e..9a9415d48 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/profile/AudioAlertEvent.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/profile/AudioAlertEvent.vue
@@ -70,7 +70,7 @@ const alertDescription = computed(() => {
 
 <template>
   <div>
-    <label class="pb-1 text-sm font-medium leading-6 text-ash-900">
+    <label class="pb-1 text-sm font-medium leading-6 text-n-slate-12">
       {{ label }}
     </label>
     <div class="grid gap-3 mt-2">
@@ -86,7 +86,7 @@ const alertDescription = computed(() => {
         />
         <label
           :for="`checkbox-${option.value}`"
-          class="text-sm text-ash-900 font-normal"
+          class="text-sm text-n-slate-12 font-normal"
         >
           {{
             $t(
diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/AudioAlertTone.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/AudioAlertTone.vue
index 4ec8183d7..c0ed9000a 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/profile/AudioAlertTone.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/profile/AudioAlertTone.vue
@@ -86,7 +86,7 @@ const playAudio = async () => {
       v-tooltip.top="
         $t('PROFILE_SETTINGS.FORM.AUDIO_NOTIFICATIONS_SECTION.PLAY')
       "
-      class="border-0 shadow-sm outline-none flex justify-center items-center size-10 appearance-none rounded-xl ring-ash-200 ring-1 ring-inset focus:ring-2 focus:ring-inset focus:ring-primary-500 flex-shrink-0 mt-[1.75rem]"
+      class="border-0 shadow-sm outline-none flex justify-center items-center size-10 appearance-none rounded-xl ring-n-weak ring-1 ring-inset focus:ring-2 focus:ring-inset focus:ring-n-brand flex-shrink-0 mt-[1.75rem]"
       @click="playAudio"
     >
       <Icon icon="i-lucide-volume-2" />
diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/ChangePassword.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/ChangePassword.vue
index 6ee5108ac..3e9d93181 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/profile/ChangePassword.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/profile/ChangePassword.vue
@@ -3,11 +3,11 @@ import { useVuelidate } from '@vuelidate/core';
 import { required, minLength } from '@vuelidate/validators';
 import { useAlert } from 'dashboard/composables';
 import { parseAPIErrorResponse } from 'dashboard/store/utils/api';
-import FormButton from 'v3/components/Form/Button.vue';
+import NextButton from 'dashboard/components-next/button/Button.vue';
 
 export default {
   components: {
-    FormButton,
+    NextButton,
   },
   setup() {
     return { v$: useVuelidate() };
@@ -130,15 +130,13 @@ export default {
         @blur="v$.passwordConfirmation.$touch"
       />
 
-      <FormButton
-        type="submit"
-        color-scheme="primary"
-        variant="solid"
-        size="large"
-        :disabled="isButtonDisabled"
-      >
-        {{ $t('PROFILE_SETTINGS.FORM.PASSWORD_SECTION.BTN_TEXT') }}
-      </FormButton>
+      <div>
+        <NextButton
+          type="submit"
+          :label="$t('PROFILE_SETTINGS.FORM.PASSWORD_SECTION.BTN_TEXT')"
+          :disabled="isButtonDisabled"
+        />
+      </div>
     </div>
   </form>
 </template>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/HotKeyCard.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/HotKeyCard.vue
index f652adeb0..cab54d43a 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/profile/HotKeyCard.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/profile/HotKeyCard.vue
@@ -27,13 +27,13 @@ defineProps({
   <button
     class="flex flex-col gap-4 w-full h-fit p-4 rounded-md border border-n-weak dark:border-n-weak"
     :class="{
-      'border-primary-300 ': active,
+      'border-n-brand ': active,
     }"
   >
     <div class="flex flex-col gap-2 items-center w-full rounded-t-[5px]">
       <div class="grid grid-cols-[1fr_auto] items-center w-full gap-1">
         <div
-          class="overflow-hidden text-base font-medium text-ash-900 text-left"
+          class="overflow-hidden text-base font-medium text-n-slate-12 text-left"
         >
           <span class="block truncate">{{ title }}</span>
         </div>
@@ -41,10 +41,12 @@ defineProps({
           :checked="active"
           type="radio"
           :name="`hotkey-${title}`"
-          class="shadow cursor-pointer grid place-items-center border-2 border-ash-200 appearance-none rounded-full w-5 h-5 checked:bg-primary-600 before:content-[''] before:bg-primary-600 before:border-4 before:rounded-full before:border-ash-25 checked:before:w-[18px] checked:before:h-[18px] checked:border checked:border-primary-600"
+          class="shadow cursor-pointer grid place-items-center border-2 border-n-strong appearance-none rounded-full w-5 h-5 checked:bg-n-brand before:content-[''] before:bg-n-brand before:border-4 before:rounded-full before:border-n-strong checked:before:w-[18px] checked:before:h-[18px] checked:border checked:border-n-brand"
         />
       </div>
-      <span class="text-ash-900 text-sm line-clamp-2 leading-[1.4] text-start">
+      <span
+        class="text-n-slate-12 text-sm line-clamp-2 leading-[1.4] text-start"
+      >
         {{ description }}
       </span>
     </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/Index.vue
index 097e0589a..2c278ed75 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/profile/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/profile/Index.vue
@@ -196,7 +196,7 @@ export default {
 <template>
   <div class="grid py-16 px-5 font-inter mx-auto gap-16 sm:max-w-screen-md">
     <div class="flex flex-col gap-6">
-      <h2 class="text-2xl font-medium text-ash-900">
+      <h2 class="text-2xl font-medium text-n-slate-12">
         {{ $t('PROFILE_SETTINGS.TITLE') }}
       </h2>
       <UserProfilePicture
diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/MessageSignature.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/MessageSignature.vue
index 2d149755c..ffb1ff9e7 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/profile/MessageSignature.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/profile/MessageSignature.vue
@@ -2,7 +2,7 @@
 import { ref, watch } from 'vue';
 import WootMessageEditor from 'dashboard/components/widgets/WootWriter/Editor.vue';
 import { MESSAGE_SIGNATURE_EDITOR_MENU_OPTIONS } from 'dashboard/constants/editor';
-import FormButton from 'v3/components/Form/Button.vue';
+import NextButton from 'dashboard/components-next/button/Button.vue';
 
 const props = defineProps({
   messageSignature: {
@@ -38,13 +38,11 @@ const updateSignature = () => {
       :enable-suggestions="false"
       show-image-resize-toolbar
     />
-    <FormButton
-      type="submit"
-      color-scheme="primary"
-      variant="solid"
-      size="large"
-    >
-      {{ $t('PROFILE_SETTINGS.FORM.MESSAGE_SIGNATURE_SECTION.BTN_TEXT') }}
-    </FormButton>
+    <div>
+      <NextButton
+        type="submit"
+        :label="$t('PROFILE_SETTINGS.FORM.MESSAGE_SIGNATURE_SECTION.BTN_TEXT')"
+      />
+    </div>
   </form>
 </template>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/NotificationCheckBox.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/NotificationCheckBox.vue
index 7b2c4fd22..ee0b85ddc 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/profile/NotificationCheckBox.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/profile/NotificationCheckBox.vue
@@ -45,7 +45,7 @@ const handleInput = e => {
   >
     <input
       v-model="localFlags"
-      class="mt-1 flex-shrink-0 border-ash-200 border checked:border-none checked:bg-primary-600 dark:checked:bg-primary-600 shadow appearance-none rounded-[4px] w-4 h-4 focus:ring-1 after:content-[''] after:text-white checked:after:content-['✓'] after:flex after:items-center after:justify-center after:text-center after:text-xs after:font-bold after:relative"
+      class="mt-1 flex-shrink-0 border-n-weak border checked:border-none checked:bg-n-brand shadow appearance-none rounded-[4px] w-4 h-4 focus:ring-1 after:content-[''] after:text-white checked:after:content-['✓'] after:flex after:items-center after:justify-center after:text-center after:text-xs after:font-bold after:relative"
       type="checkbox"
       :value="localValue"
       @input="handleInput"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/NotificationPreferences.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/NotificationPreferences.vue
index 6ab2b34d4..3c239a3c8 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/profile/NotificationPreferences.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/profile/NotificationPreferences.vue
@@ -167,7 +167,7 @@ export default {
           :span="7"
           label="`${$t('PROFILE_SETTINGS.FORM.NOTIFICATIONS.TYPE_TITLE')}`"
         >
-          <span class="text-sm font-normal normal-case text-ash-800">
+          <span class="text-sm font-normal normal-case text-n-slate-11">
             {{ $t('PROFILE_SETTINGS.FORM.NOTIFICATIONS.TYPE_TITLE') }}
           </span>
         </TableHeaderCell>
@@ -175,7 +175,7 @@ export default {
           :span="2"
           label="`${$t('PROFILE_SETTINGS.FORM.NOTIFICATIONS.EMAIL')}`"
         >
-          <span class="text-sm font-medium normal-case text-ash-900">
+          <span class="text-sm font-medium normal-case text-n-slate-12">
             {{ $t('PROFILE_SETTINGS.FORM.NOTIFICATIONS.EMAIL') }}
           </span>
         </TableHeaderCell>
@@ -185,7 +185,7 @@ export default {
         >
           <div class="flex items-center justify-between gap-1">
             <span
-              class="text-sm font-medium normal-case text-ash-900 whitespace-nowrap"
+              class="text-sm font-medium normal-case text-n-slate-12 whitespace-nowrap"
             >
               {{ $t('PROFILE_SETTINGS.FORM.NOTIFICATIONS.PUSH') }}
             </span>
@@ -202,7 +202,7 @@ export default {
           <div
             class="flex flex-row items-start gap-2 col-span-7 px-0 py-2 text-sm tracking-[0.5] rtl:text-right"
           >
-            <span class="text-sm text-ash-900">
+            <span class="text-sm text-n-slate-12">
               {{ $t(notification.label) }}
             </span>
           </div>
@@ -225,7 +225,7 @@ export default {
     </div>
     <!--  Layout for mobile devices -->
     <div class="flex flex-col gap-6 sm:hidden">
-      <span class="text-sm font-medium normal-case text-ash-900">
+      <span class="text-sm font-medium normal-case text-n-slate-12">
         {{ $t('PROFILE_SETTINGS.FORM.EMAIL_NOTIFICATIONS_SECTION.TITLE') }}
       </span>
       <div class="flex flex-col gap-4">
@@ -240,12 +240,14 @@ export default {
             :is-checked="checkFlagStatus('email', notification.value)"
             @update="handleEmailInput"
           />
-          <span class="text-sm text-ash-900">{{ $t(notification.label) }}</span>
+          <span class="text-sm text-n-slate-12">{{
+            $t(notification.label)
+          }}</span>
         </div>
       </div>
 
       <div class="flex items-center justify-start gap-2">
-        <span class="text-sm font-medium normal-case text-ash-900">
+        <span class="text-sm font-medium normal-case text-n-slate-12">
           {{ $t('PROFILE_SETTINGS.FORM.PUSH_NOTIFICATIONS_SECTION.TITLE') }}
         </span>
       </div>
@@ -262,21 +264,23 @@ export default {
             :is-checked="checkFlagStatus('push', notification.value)"
             @update="handlePushInput"
           />
-          <span class="text-sm text-ash-900">{{ $t(notification.label) }}</span>
+          <span class="text-sm text-n-slate-12">{{
+            $t(notification.label)
+          }}</span>
         </div>
       </div>
     </div>
 
     <div
-      class="flex items-center justify-between w-full gap-2 p-4 border border-solid border-ash-200 rounded-xl"
+      class="flex items-center justify-between w-full gap-2 p-4 border border-solid border-n-weak rounded-xl"
     >
       <div class="flex flex-row items-center gap-2">
         <fluent-icon
           icon="alert"
-          class="flex-shrink-0 text-ash-900"
+          class="flex-shrink-0 text-n-slate-12"
           size="18"
         />
-        <span class="text-sm text-ash-900">
+        <span class="text-sm text-n-slate-12">
           {{ $t('PROFILE_SETTINGS.FORM.NOTIFICATIONS.BROWSER_PERMISSION') }}
         </span>
       </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/UserBasicDetails.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/UserBasicDetails.vue
index 10720e472..e44d699cc 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/profile/UserBasicDetails.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/profile/UserBasicDetails.vue
@@ -1,11 +1,11 @@
 <script>
 import { useAlert } from 'dashboard/composables';
-import FormButton from 'v3/components/Form/Button.vue';
+import NextButton from 'dashboard/components-next/button/Button.vue';
 import { useVuelidate } from '@vuelidate/core';
 import { required, minLength, email } from '@vuelidate/validators';
 export default {
   components: {
-    FormButton,
+    NextButton,
   },
   props: {
     name: {
@@ -131,13 +131,8 @@ export default {
       @input="v$.userEmail.$touch"
       @blur="v$.userEmail.$touch"
     />
-    <FormButton
-      type="submit"
-      color-scheme="primary"
-      variant="solid"
-      size="large"
-    >
-      {{ $t('PROFILE_SETTINGS.BTN_TEXT') }}
-    </FormButton>
+    <div>
+      <NextButton type="submit" :label="$t('PROFILE_SETTINGS.BTN_TEXT')" />
+    </div>
   </form>
 </template>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/UserProfilePicture.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/UserProfilePicture.vue
index d86329b76..901c842de 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/profile/UserProfilePicture.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/profile/UserProfilePicture.vue
@@ -24,7 +24,7 @@ const deleteProfilePicture = () => {
 
 <template>
   <div class="flex flex-col gap-2">
-    <span class="text-sm font-medium text-ash-900">
+    <span class="text-sm font-medium text-n-slate-12">
       {{ $t('PROFILE_SETTINGS.FORM.PICTURE') }}
     </span>
     <Avatar
diff --git a/app/javascript/dashboard/routes/dashboard/settings/profile/Wrapper.vue b/app/javascript/dashboard/routes/dashboard/settings/profile/Wrapper.vue
index c055a781e..857f3a992 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/profile/Wrapper.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/profile/Wrapper.vue
@@ -9,7 +9,7 @@ defineProps({
 
 <template>
   <div
-    class="flex flex-col justify-between flex-1 h-full m-0 overflow-auto bg-white dark:bg-slate-900"
+    class="flex flex-col justify-between flex-1 h-full m-0 overflow-auto bg-n-background"
   >
     <router-view v-slot="{ Component }">
       <keep-alive v-if="keepAlive">
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/ReportContainer.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/ReportContainer.vue
index 01ee625fe..3a459e771 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/ReportContainer.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/ReportContainer.vue
@@ -169,7 +169,7 @@ export default {
             :collection="getCollection(metric)"
             :chart-options="getChartOptions(metric)"
           />
-          <span v-else class="text-sm text-slate-600">
+          <span v-else class="text-sm text-n-slate-10">
             {{ $t('REPORT.NO_ENOUGH_DATA') }}
           </span>
         </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/ChartElements/ChartStats.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/ChartElements/ChartStats.vue
index 118248cab..6e47a14ce 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/ChartElements/ChartStats.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/ChartElements/ChartStats.vue
@@ -27,12 +27,12 @@ const { calculateTrend, displayMetric, isAverageMetricType, fetchingStatus } =
 const trendColor = (value, key) => {
   if (isAverageMetricType(key)) {
     return value > 0
-      ? 'border-red-500 text-red-500'
-      : 'border-green-500 text-green-500';
+      ? 'border-n-ruby-9 text-n-ruby-9'
+      : 'border-n-teal-10 text-n-teal-10';
   }
   return value < 0
-    ? 'border-red-500 text-red-500'
-    : 'border-green-500 text-green-500';
+    ? 'border-n-ruby-9 text-n-ruby-9'
+    : 'border-n-teal-10 text-n-teal-10';
 };
 </script>
 
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/ConversationCell.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/ConversationCell.vue
index 5342d75e4..0b221857e 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/ConversationCell.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/ConversationCell.vue
@@ -19,10 +19,7 @@ const routerParams = computed(() => ({
     <router-link :to="routerParams" class="hover:underline">
       {{ `#${row.original.conversationId}` }}
     </router-link>
-    <div
-      v-tooltip="row.original.createdAt"
-      class="text-slate-600 dark:text-slate-200 text-sm"
-    >
+    <div v-tooltip="row.original.createdAt" class="text-n-slate-11 text-sm">
       {{ row.original.createdAgo }}
     </div>
   </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/CsatTable.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/CsatTable.vue
index 76a3e3079..64870d31c 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/CsatTable.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/CsatTable.vue
@@ -105,7 +105,7 @@ const columns = computed(() => [
         {
           class: ratingObject.emoji
             ? 'emoji-response text-lg'
-            : 'text-slate-300 dark:text-slate-700',
+            : 'text-n-slate-10',
         },
         ratingObject.emoji || '---'
       );
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/DateGroupBy.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/DateGroupBy.vue
index 6a74f17a3..37139865f 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/DateGroupBy.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/DateGroupBy.vue
@@ -48,7 +48,7 @@ export default {
 
 <template>
   <div class="multiselect-wrap--small">
-    <p aria-hidden="true" class="hide">
+    <p aria-hidden="true" class="hidden">
       {{ $t('REPORT.GROUP_BY_FILTER_DROPDOWN_LABEL') }}
     </p>
     <multiselect
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/Labels.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/Labels.vue
index 68cc4baf2..ede9e020c 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/Labels.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Filters/Labels.vue
@@ -44,7 +44,7 @@ export default {
             :style="{ backgroundColor: props.option.color }"
             class="w-5 h-5 rounded-full"
           />
-          <span class="my-0 text-slate-800 dark:text-slate-75">
+          <span class="my-0 text-n-slate-12">
             {{ props.option.title }}
           </span>
         </div>
@@ -53,10 +53,10 @@ export default {
         <div class="flex items-center gap-2">
           <div
             :style="{ backgroundColor: props.option.color }"
-            class="flex-shrink-0 w-5 h-5 border border-solid rounded-full border-slate-100 dark:border-slate-800"
+            class="flex-shrink-0 w-5 h-5 border border-solid rounded-full border-n-weak"
           />
 
-          <span class="my-0 text-slate-800 truncate min-w-0 dark:text-slate-75">
+          <span class="my-0 text-n-slate-12 truncate min-w-0">
             {{ props.option.title }}
           </span>
         </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Heatmap.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Heatmap.vue
index eed783f4b..41cfe277e 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/Heatmap.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/Heatmap.vue
@@ -67,7 +67,7 @@ function getDayOfTheWeek(date) {
   return days[dayIndex];
 }
 function getHeatmapLevelClass(value) {
-  if (!value) return 'outline-n-container dark:bg-slate-700/40 bg-slate-50/50';
+  if (!value) return 'outline-n-container bg-n-slate-2 dark:bg-n-slate-5/50';
 
   let level = [...quantileRange.value, Infinity].findIndex(
     range => value <= range && value > 0
@@ -76,16 +76,16 @@ function getHeatmapLevelClass(value) {
   if (level > 6) level = 5;
 
   if (level === 0) {
-    return 'outline-n-container dark:bg-slate-700/40 bg-slate-50/50';
+    return 'outline-n-container bg-n-slate-2 dark:bg-n-slate-5/50';
   }
 
   const classes = [
-    'bg-woot-50 dark:bg-woot-800/40 dark:outline-woot-800/80',
-    'bg-woot-100 dark:bg-woot-800/30 dark:outline-woot-800/80',
-    'bg-woot-200 dark:bg-woot-500/40 dark:outline-woot-700/80',
-    'bg-woot-300 dark:bg-woot-500/60 dark:outline-woot-600/80',
-    'bg-woot-600 dark:bg-woot-500/80 dark:outline-woot-500/80',
-    'bg-woot-800 dark:bg-woot-500 dark:outline-woot-400/80',
+    'bg-n-blue-3 dark:outline-n-blue-4',
+    'bg-n-blue-5 dark:outline-n-blue-6',
+    'bg-n-blue-7 dark:outline-n-blue-8',
+    'bg-n-blue-8 dark:outline-n-blue-9',
+    'bg-n-blue-10 dark:outline-n-blue-8',
+    'bg-n-blue-11 dark:outline-n-blue-10',
   ];
 
   return classes[level - 1];
@@ -101,7 +101,7 @@ function getHeatmapLevelClass(value) {
         <div
           v-for="ii in numberOfRows"
           :key="ii"
-          class="w-full rounded-sm bg-slate-100 dark:bg-slate-900 animate-loader-pulse h-8 min-w-[70px]"
+          class="w-full rounded-sm bg-n-slate-3 dark:bg-n-slate-1 animate-loader-pulse h-8 min-w-[70px]"
         />
       </div>
       <div class="grid gap-[5px] w-full min-w-[700px]">
@@ -113,13 +113,13 @@ function getHeatmapLevelClass(value) {
           <div
             v-for="jj in 24"
             :key="jj"
-            class="w-full h-8 rounded-sm bg-slate-100 dark:bg-slate-900 animate-loader-pulse"
+            class="w-full h-8 rounded-sm bg-n-slate-3 dark:bg-n-slate-1 animate-loader-pulse"
           />
         </div>
       </div>
       <div />
       <div
-        class="grid grid-cols-[repeat(24,_1fr)] gap-[5px] w-full text-[8px] font-semibold h-5 text-slate-800 dark:text-slate-200"
+        class="grid grid-cols-[repeat(24,_1fr)] gap-[5px] w-full text-[8px] font-semibold h-5 text-n-slate-11"
       >
         <div
           v-for="ii in 24"
@@ -135,10 +135,10 @@ function getHeatmapLevelClass(value) {
         <div
           v-for="dateKey in processedData.keys()"
           :key="dateKey"
-          class="h-8 min-w-[70px] text-slate-800 dark:text-slate-200 text-[10px] font-semibold flex flex-col items-end justify-center"
+          class="h-8 min-w-[70px] text-n-slate-12 text-[10px] font-semibold flex flex-col items-end justify-center"
         >
           {{ getDayOfTheWeek(new Date(dateKey)) }}
-          <time class="font-normal text-slate-700 dark:text-slate-200">
+          <time class="font-normal text-n-slate-11">
             {{ formatDate(dateKey) }}
           </time>
         </div>
@@ -153,14 +153,14 @@ function getHeatmapLevelClass(value) {
             v-for="data in processedData.get(dateKey)"
             :key="data.timestamp"
             v-tooltip.top="getCountTooltip(data.value)"
-            class="h-8 rounded-sm shadow-inner dark:outline dark:outline-1 shadow-black"
+            class="h-8 rounded-sm shadow-inner dark:outline dark:outline-1"
             :class="getHeatmapLevelClass(data.value)"
           />
         </div>
       </div>
       <div />
       <div
-        class="grid grid-cols-[repeat(24,_1fr)] gap-[5px] w-full text-[8px] font-semibold h-5 text-slate-800 dark:text-slate-200"
+        class="grid grid-cols-[repeat(24,_1fr)] gap-[5px] w-full text-[8px] font-semibold h-5 text-n-slate-12"
       >
         <div
           v-for="ii in 24"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/ReportFilters.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/ReportFilters.vue
index c1d805081..d7409dc22 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/ReportFilters.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/ReportFilters.vue
@@ -188,7 +188,7 @@ export default {
               :username="props.option.name"
               size="22px"
             />
-            <span class="my-0 text-slate-800 truncate dark:text-slate-75">{{
+            <span class="my-0 text-n-slate-12 truncate">{{
               props.option.name
             }}</span>
           </div>
@@ -201,7 +201,7 @@ export default {
               :username="props.option.name"
               size="22px"
             />
-            <p class="my-0 text-slate-800 dark:text-slate-75">
+            <p class="my-0 text-n-slate-12">
               {{ props.option.name }}
             </p>
           </div>
@@ -230,7 +230,7 @@ export default {
               class="w-5 h-5 rounded-full"
             />
 
-            <span class="my-0 text-slate-800 truncate dark:text-slate-75">
+            <span class="my-0 text-n-slate-12 truncate">
               {{ props.option.title }}
             </span>
           </div>
@@ -239,10 +239,10 @@ export default {
           <div class="flex items-center min-w-0 gap-2">
             <div
               :style="{ backgroundColor: props.option.color }"
-              class="flex-shrink-0 w-5 h-5 border border-solid rounded-full border-slate-100 dark:border-slate-800"
+              class="flex-shrink-0 w-5 h-5 border border-solid rounded-full border-n-weak"
             />
 
-            <span class="my-0 text-slate-800 truncate dark:text-slate-75">
+            <span class="my-0 text-n-slate-12 truncate">
               {{ props.option.title }}
             </span>
           </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAFilter.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAFilter.vue
index fc8f35521..abe5674eb 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAFilter.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAFilter.vue
@@ -179,7 +179,7 @@ export default {
     <!-- Dividing line between Active filters and Add filter button -->
     <div
       v-if="hasActiveFilters && !isAllFilterSelected"
-      class="w-full h-px border md:w-px md:h-5 border-slate-75 dark:border-slate-800"
+      class="w-full h-px border md:w-px md:h-5 border-n-weak"
     />
     <!-- Add filter and clear filter button -->
     <div class="flex items-center gap-2">
@@ -196,10 +196,7 @@ export default {
       />
 
       <!-- Dividing line between Add filter and Clear all filter button -->
-      <div
-        v-if="hasActiveFilters"
-        class="w-px h-5 border border-slate-75 dark:border-slate-800"
-      />
+      <div v-if="hasActiveFilters" class="w-px h-5 border border-n-weak" />
       <!-- Clear all filter button -->
       <FilterButton
         v-if="hasActiveFilters"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAReportItem.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAReportItem.vue
index 1cd18226e..9604cedf9 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAReportItem.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAReportItem.vue
@@ -34,12 +34,12 @@ const conversationLabels = computed(() => {
     class="grid items-center content-center w-full h-16 grid-cols-12 gap-4 px-6 py-0 border-b last:border-b-0 last:rounded-b-xl border-n-weak"
   >
     <div
-      class="flex items-center gap-2 col-span-6 px-0 py-2 text-sm tracking-[0.5] text-slate-700 dark:text-slate-100 rtl:text-right"
+      class="flex items-center gap-2 col-span-6 px-0 py-2 text-sm tracking-[0.5] text-n-slate-12 rtl:text-right"
     >
       <span class="text-n-slate-12">
         {{ `#${conversationId} ` }}
       </span>
-      <span class="text-slate-11">
+      <span class="text-n-slate-11">
         {{ $t('SLA_REPORTS.WITH') }}
       </span>
       <span class="capitalize truncate text-n-slate-12">{{
@@ -53,7 +53,7 @@ const conversationLabels = computed(() => {
       />
     </div>
     <div
-      class="flex items-center capitalize py-2 px-0 text-sm tracking-[0.5] text-slate-700 dark:text-slate-50 text-left rtl:text-right col-span-2"
+      class="flex items-center capitalize py-2 px-0 text-sm tracking-[0.5] text-n-slate-12 text-left rtl:text-right col-span-2"
     >
       {{ slaName }}
     </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAViewDetails.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAViewDetails.vue
index f50fed377..2eb04f652 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAViewDetails.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/SLA/SLAViewDetails.vue
@@ -34,7 +34,7 @@ export default {
 <template>
   <div
     v-on-clickaway="closeSlaEvents"
-    class="flex items-center col-span-2 text-slate-11 justify-end"
+    class="flex items-center col-span-2 text-n-slate-11 justify-end"
   >
     <div class="relative">
       <NextButton
diff --git a/app/javascript/dashboard/routes/dashboard/settings/reports/components/overview/AgentCell.vue b/app/javascript/dashboard/routes/dashboard/settings/reports/components/overview/AgentCell.vue
index effa4c56b..c6f348252 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/reports/components/overview/AgentCell.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/reports/components/overview/AgentCell.vue
@@ -27,11 +27,11 @@ const isRTL = useMapGetter('accounts/isRTL');
       />
       <div class="items-start flex flex-col min-w-0 my-0 mx-2">
         <h6
-          class="overflow-hidden text-sm m-0 leading-[1.2] text-slate-800 dark:text-slate-100 whitespace-nowrap text-ellipsis"
+          class="overflow-hidden text-sm m-0 leading-[1.2] text-n-slate-12 whitespace-nowrap text-ellipsis"
         >
           {{ row.original.agent }}
         </h6>
-        <span class="text-xs text-slate-600 dark:text-slate-200">
+        <span class="text-xs text-n-slate-11">
           {{ row.original.email }}
         </span>
       </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/sla/SlaForm.vue b/app/javascript/dashboard/routes/dashboard/settings/sla/SlaForm.vue
index f562aa9ce..5dc6e16f4 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/sla/SlaForm.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/sla/SlaForm.vue
@@ -200,7 +200,7 @@ export default {
       <div
         class="mt-3 flex h-10 items-center text-sm w-full gap-2 border border-solid border-n-strong px-3 py-1.5 rounded-xl justify-between"
       >
-        <span for="sla_bh" class="text-slate-700 dark:text-slate-200">
+        <span for="sla_bh" class="text-n-slate-11">
           {{ $t('SLA.FORM.BUSINESS_HOURS.PLACEHOLDER') }}
         </span>
         <woot-switch id="sla_bh" v-model="onlyDuringBusinessHours" />
diff --git a/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLABusinessHoursLabel.vue b/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLABusinessHoursLabel.vue
index 3f8cad837..983ff38b2 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLABusinessHoursLabel.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLABusinessHoursLabel.vue
@@ -9,26 +9,18 @@ defineProps({
 
 <template>
   <div
-    class="inline-flex items-center min-w-0 gap-1 px-1.5 sm:px-2 py-1 border border-solid rounded-lg border-slate-75 dark:border-slate-700/50"
+    class="inline-flex items-center min-w-0 gap-1 px-1.5 sm:px-2 py-1 border border-solid rounded-lg border-n-weak"
   >
     <fluent-icon
       size="14"
       :icon="hasBusinessHours ? 'alarm-on' : 'alarm-off'"
       type="outline"
       class="flex-shrink-0"
-      :class="
-        hasBusinessHours
-          ? 'text-slate-600 dark:text-slate-400'
-          : 'text-slate-300 dark:text-slate-700'
-      "
+      :class="hasBusinessHours ? 'text-n-slate-11' : 'text-n-slate-10'"
     />
     <span
       class="hidden text-xs tracking-[0.2%] font-normal truncate sm:block"
-      :class="
-        hasBusinessHours
-          ? 'text-slate-600 dark:text-slate-400'
-          : 'text-slate-300 dark:text-slate-700'
-      "
+      :class="hasBusinessHours ? 'text-n-slate-11' : 'text-n-slate-10'"
     >
       {{
         hasBusinessHours
diff --git a/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLAListItem.vue b/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLAListItem.vue
index f296da403..085860efa 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLAListItem.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLAListItem.vue
@@ -40,7 +40,7 @@ const emit = defineEmits(['delete']);
 
 <template>
   <BaseSettingsListItem
-    class="sm:divide-x sm:divide-slate-75 sm:dark:divide-slate-700/50"
+    class="sm:divide-x sm:divide-n-weak"
     :title="slaName"
     :description="description"
   >
@@ -49,7 +49,7 @@ const emit = defineEmits(['delete']);
     </template>
     <template #rightSection>
       <div
-        class="flex items-center divide-x rtl:divide-x-reverse sm:rtl:!border-l-0 sm:rtl:!border-r sm:rtl:border-solid sm:rtl:border-slate-75 sm:rtl:dark:border-slate-700/50 gap-1.5 w-fit sm:w-full sm:gap-0 sm:justify-between divide-slate-75 dark:divide-slate-700/50"
+        class="flex items-center divide-x rtl:divide-x-reverse sm:rtl:!border-l-0 sm:rtl:!border-r sm:rtl:border-solid sm:rtl:border-n-weak gap-1.5 w-fit sm:w-full sm:gap-0 sm:justify-between divide-n-weak"
       >
         <SLAResponseTime response-type="FRT" :response-time="firstResponse" />
         <SLAResponseTime response-type="NRT" :response-time="nextResponse" />
diff --git a/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLAListItemLoading.vue b/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLAListItemLoading.vue
index 860ded975..7282f73d1 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLAListItemLoading.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLAListItemLoading.vue
@@ -6,25 +6,25 @@ import BaseSettingsListItem from '../../components/BaseSettingsListItem.vue';
   <BaseSettingsListItem class="opacity-50">
     <template #title>
       <div
-        class="w-24 h-[26px] rounded-md bg-slate-50 dark:bg-slate-700 animate-pulse"
+        class="w-24 h-[26px] rounded-md bg-n-slate-4 dark:bg-n-slate-6 animate-pulse"
       />
     </template>
     <template #description>
       <div
-        class="w-64 h-4 mb-0.5 rounded-md bg-slate-50 dark:bg-slate-700 animate-pulse"
+        class="w-64 h-4 mb-0.5 rounded-md bg-n-slate-4 dark:bg-n-slate-6 animate-pulse"
       />
       <div
-        class="w-48 h-4 rounded-md bg-slate-50 dark:bg-slate-700 animate-pulse"
+        class="w-48 h-4 rounded-md bg-n-slate-4 dark:bg-n-slate-6 animate-pulse"
       />
     </template>
     <template #label>
       <div
-        class="w-32 h-[26px] bg-slate-50 dark:bg-slate-700 animate-pulse rounded-md"
+        class="w-32 h-[26px] bg-n-slate-4 dark:bg-n-slate-6 animate-pulse rounded-md"
       />
     </template>
     <template #rightSection>
       <div
-        class="flex items-center sm:rtl:!border-l-0 sm:rtl:!border-r sm:rtl:border-solid sm:rtl:border-slate-75 sm:rtl:dark:border-slate-700/50 gap-1.5 w-fit sm:w-full sm:gap-0 sm:justify-between"
+        class="flex items-center sm:rtl:!border-l-0 sm:rtl:!border-r border-n-weak gap-1.5 w-fit sm:w-full sm:gap-0 sm:justify-between"
       >
         <div
           v-for="ii in 3"
@@ -32,7 +32,7 @@ import BaseSettingsListItem from '../../components/BaseSettingsListItem.vue';
           class="flex justify-end w-1/3 h-full px-4"
         >
           <div
-            class="w-32 h-full rounded-md bg-slate-50 dark:bg-slate-700 animate-pulse"
+            class="w-32 h-full rounded-md bg-n-slate-4 dark:bg-n-slate-6 animate-pulse"
           />
         </div>
       </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLAResponseTime.vue b/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLAResponseTime.vue
index e7e986e7b..87860110a 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLAResponseTime.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/sla/components/SLAResponseTime.vue
@@ -16,20 +16,20 @@ defineProps({
     class="flex flex-row items-start w-full h-full gap-1 sm:items-end sm:px-6 sm:py-2 sm:gap-2 sm:flex-col"
   >
     <span
-      class="inline-flex items-center gap-1 tracking-[-0.6%] text-sm ltr:pl-1.5 sm:ltr:pl-0 rtl:pr-1.5 sm:rtl:pr-0 text-slate-600 dark:text-slate-300"
+      class="inline-flex items-center gap-1 tracking-[-0.6%] text-sm ltr:pl-1.5 sm:ltr:pl-0 rtl:pr-1.5 sm:rtl:pr-0 text-n-slate-11"
     >
       <fluent-icon
         v-tooltip.left="$t(`SLA.LIST.RESPONSE_TYPES.${responseType}`)"
         size="14"
         icon="information"
         type="outline"
-        class="flex-shrink-0 hidden text-sm font-normal sm:flex sm:font-medium text-slate-500 dark:text-slate-500"
+        class="flex-shrink-0 hidden text-sm font-normal sm:flex sm:font-medium text-n-slate-11"
       />
       {{ $t(`SLA.LIST.RESPONSE_TYPES.SHORT_HAND.${responseType}`) }}
       <span class="flex sm:hidden">:</span>
     </span>
     <span
-      class="text-sm sm:text-2xl font-medium tracking-[-1.5%] text-slate-900 dark:text-slate-25"
+      class="text-sm sm:text-2xl font-medium tracking-[-1.5%] text-n-slate-12"
     >
       {{ responseTime }}
     </span>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/teams/AgentSelector.vue b/app/javascript/dashboard/routes/dashboard/settings/teams/AgentSelector.vue
index cf48c0c97..d90d3ce63 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/teams/AgentSelector.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/teams/AgentSelector.vue
@@ -73,8 +73,10 @@ export default {
 <template>
   <div>
     <div class="add-agents__header" />
-    <table class="woot-table">
-      <thead>
+    <table>
+      <thead
+        class="[&>th]:font-semibold [&>th]:tracking-[1px] ltr:[&>th]:text-left rtl:[&>th]:text-right [&>th]:px-2.5 [&>th]:uppercase [&>th]:text-n-slate-12"
+      >
         <tr>
           <td class="ltr:pl-2.5 rtl:pr-2.5">
             <div class="flex items-center">
@@ -87,10 +89,10 @@ export default {
               />
             </div>
           </td>
-          <td class="text-slate-800 dark:text-slate-100 ltr:pl-2.5 rtl:pr-2.5">
+          <td class="text-n-slate-12 ltr:pl-2.5 rtl:pr-2.5">
             {{ $t('TEAMS_SETTINGS.AGENTS.AGENT') }}
           </td>
-          <td class="text-slate-800 dark:text-slate-100 ltr:pl-2.5 rtl:pr-2.5">
+          <td class="text-n-slate-12 ltr:pl-2.5 rtl:pr-2.5">
             {{ $t('TEAMS_SETTINGS.AGENTS.EMAIL') }}
           </td>
         </tr>
@@ -100,6 +102,7 @@ export default {
           v-for="agent in agentList"
           :key="agent.id"
           :class="agentRowClass(agent.id)"
+          class="border-b border-n-weak [&>td]:p-2.5 [&>td]:text-n-slate-12"
         >
           <td class="w-12">
             <div class="flex items-center">
@@ -118,7 +121,7 @@ export default {
                 :username="agent.name"
                 :status="agent.availability_status"
               />
-              <h4 class="text-base mb-0 text-slate-800 dark:text-slate-100">
+              <h4 class="text-base mb-0 text-n-slate-12">
                 {{ agent.name }}
               </h4>
             </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/teams/Create/AddAgents.vue b/app/javascript/dashboard/routes/dashboard/settings/teams/Create/AddAgents.vue
index 7f3eb9694..084cc88f5 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/teams/Create/AddAgents.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/teams/Create/AddAgents.vue
@@ -104,7 +104,7 @@ export default {
 
       <div class="w-full">
         <div v-if="v$.selectedAgents.$error">
-          <p class="error-message">
+          <p class="error-message pb-2">
             {{ $t('TEAMS_SETTINGS.ADD.AGENT_VALIDATION_ERROR') }}
           </p>
         </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/teams/Edit/EditAgents.vue b/app/javascript/dashboard/routes/dashboard/settings/teams/Edit/EditAgents.vue
index 66df8ea12..b56c0c2e1 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/teams/Edit/EditAgents.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/teams/Edit/EditAgents.vue
@@ -119,7 +119,7 @@ export default {
 
       <div class="w-full">
         <div v-if="v$.selectedAgents.$error">
-          <p class="error-message">
+          <p class="error-message pb-2">
             {{ $t('TEAMS_SETTINGS.ADD.AGENT_VALIDATION_ERROR') }}
           </p>
         </div>
diff --git a/app/javascript/dashboard/routes/dashboard/settings/teams/Index.vue b/app/javascript/dashboard/routes/dashboard/settings/teams/Index.vue
index 14b07e93c..cd32e1911 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/teams/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/teams/Index.vue
@@ -84,7 +84,7 @@ const confirmPlaceHolderText = computed(() =>
         </router-link>
       </template>
     </BaseSettingsHeader>
-    <div class="mt-6 flex-1 text-slate-700 dark:text-slate-300">
+    <div class="mt-6 flex-1 text-n-slate-11">
       <woot-loading-state
         v-if="uiFlags.isFetching"
         :message="$t('TEAMS_SETTINGS.LOADING')"
@@ -96,11 +96,8 @@ const confirmPlaceHolderText = computed(() =>
         {{ $t('TEAMS_SETTINGS.LIST.404') }}
       </p>
 
-      <table
-        v-else
-        class="min-w-full divide-y divide-slate-75 dark:divide-slate-700"
-      >
-        <tbody class="divide-y divide-slate-50 dark:divide-slate-800">
+      <table v-else class="min-w-full divide-y divide-n-weak">
+        <tbody class="divide-y divide-n-weak">
           <tr v-for="team in teamsList" :key="team.id">
             <td class="py-4 ltr:pr-4 rtl:pl-4">
               <span class="block font-medium capitalize">{{ team.name }}</span>
diff --git a/app/javascript/dashboard/routes/dashboard/suspended/Index.vue b/app/javascript/dashboard/routes/dashboard/suspended/Index.vue
index c52a32a1f..56a5b5cae 100644
--- a/app/javascript/dashboard/routes/dashboard/suspended/Index.vue
+++ b/app/javascript/dashboard/routes/dashboard/suspended/Index.vue
@@ -21,7 +21,7 @@ onMounted(() => {
 </script>
 
 <template>
-  <div class="items-center bg-slate-50 flex justify-center h-full w-full">
+  <div class="items-center bg-n-slate-2 flex justify-center h-full w-full">
     <EmptyState
       :title="$t('APP_GLOBAL.ACCOUNT_SUSPENDED.TITLE')"
       :message="$t('APP_GLOBAL.ACCOUNT_SUSPENDED.MESSAGE')"
diff --git a/app/javascript/dashboard/routes/index.js b/app/javascript/dashboard/routes/index.js
index e21cca31a..e69d0b5ad 100644
--- a/app/javascript/dashboard/routes/index.js
+++ b/app/javascript/dashboard/routes/index.js
@@ -5,12 +5,10 @@ import dashboard from './dashboard/dashboard.routes';
 import store from 'dashboard/store';
 import { validateLoggedInRoutes } from '../helper/routeHelpers';
 import AnalyticsHelper from '../helper/AnalyticsHelper';
-import { buildPermissionsFromRouter } from '../helper/permissionsHelper';
 
 const routes = [...dashboard.routes];
 
 export const router = createRouter({ history: createWebHistory(), routes });
-export const routesWithPermissions = buildPermissionsFromRouter(routes);
 
 export const validateAuthenticateRoutePermission = (to, next) => {
   const { isLoggedIn, getCurrentUser: user } = store.getters;
diff --git a/app/javascript/shared/assets/stylesheets/animations.scss b/app/javascript/shared/assets/stylesheets/animations.scss
deleted file mode 100644
index f0f2758c6..000000000
--- a/app/javascript/shared/assets/stylesheets/animations.scss
+++ /dev/null
@@ -1,11 +0,0 @@
-// Taken from thoughtbot/bourbon library timing functions
-
-:root {
-  --ease-in-cubic: cubic-bezier(0.17, 0.67, 0.83, 0.67);
-  --ease-in-sine: cubic-bezier(0.47, 0, 0.745, 0.715);
-
-  --ease-out-cubic: cubic-bezier(0.215, 0.61, 0.355, 1);
-  --ease-out-sine: cubic-bezier(0.39, 0.575, 0.565, 1);
-
-  --ease-in-out-quad: cubic-bezier(0.455, 0.03, 0.515, 0.955);
-}
diff --git a/app/javascript/shared/assets/stylesheets/border-radius.scss b/app/javascript/shared/assets/stylesheets/border-radius.scss
deleted file mode 100644
index 5fefbb5ac..000000000
--- a/app/javascript/shared/assets/stylesheets/border-radius.scss
+++ /dev/null
@@ -1,8 +0,0 @@
-:root {
-  --border-radius-small: 0.1875rem;
-  --border-radius-normal: 0.3125rem;
-  --border-radius-medium: 0.4375rem;
-  --border-radius-large: 0.5625rem;
-  --border-radius-full: 6.25rem;
-  --border-radius-rounded: 50%;
-}
diff --git a/app/javascript/shared/assets/stylesheets/colors.scss b/app/javascript/shared/assets/stylesheets/colors.scss
deleted file mode 100644
index c80f52427..000000000
--- a/app/javascript/shared/assets/stylesheets/colors.scss
+++ /dev/null
@@ -1,109 +0,0 @@
-:root {
-  --white: #fff;
-  --white-transparent: rgba(255, 255, 255, 0.9);
-  --black-transparent: rgba(0, 0, 0, 0.9);
-
-  --w-25: #F5FAFF;
-  --w-50: #EBF5FF;
-  --w-75: #D6EBFF;
-  --w-100: #C2E1FF;
-  --w-200: #99CEFF;
-  --w-300: #70BAFF;
-  --w-400: #47A6FF;
-  --w-500: #1F93FF;
-  --w-600: #1976CC;
-  --w-700: #135899;
-  --w-800: #0C3B66;
-  --w-900: #061D33;
-
-  --g-50: #E6F8E6;
-  --g-100: #C4EEC2;
-  --g-200: #9DE29A;
-  --g-300: #6FD86F;
-  --g-400: #44CE4B;
-  --g-500: #00C41D;
-  --g-600: #00B412;
-  --g-700: #00A200;
-  --g-800: #009000;
-  --g-900: #007000;
-
-  --y-50: #FEFDE8;
-  --y-100: #FDFCC4;
-  --y-200: #FCF68C;
-  --y-300: #F9E736;
-  --y-400: #F6D819;
-  --y-500: #E6C00C;
-  --y-600: #C69608;
-  --y-700: #9E6b0A;
-  --y-800: #835510;
-  --y-900: #6F4514;
-
-  --s-25: #F8FAFC;
-  --s-50: #F1F5F8;
-  --s-75: #EBF0F5;
-  --s-100: #E4EBF1;
-  --s-200: #C9D7E3;
-  --s-300: #AEC3D5;
-  --s-400: #93AFC8;
-  --s-500: #779BBB;
-  --s-600: #446888;
-  --s-700: #37546D;
-  --s-800: #293F51;
-  --s-900: #1B2836;
-
-  --b-50: #F7F7F7;
-  --b-100: #ECECED;
-  --b-200: #DDDDE0;
-  --b-300: #C6C7CA;
-  --b-400: #ABACAF;
-  --b-500: #96979C;
-  --b-600: #6E6F73;
-  --b-700: #5A5B5F;
-  --b-800: #3C3D40;
-  --b-900: #1B1C1F;
-
-  --r-50: #FFEBEE;
-  --r-100: #FFCCD1;
-  --r-200: #F69898;
-  --r-300: #EF6F6F;
-  --r-400: #F94B4A;
-  --r-500: #FF382D;
-  --r-600: #F02B2D;
-  --r-700: #DE1E27;
-  --r-800: #D11320;
-  --r-900: #C30011;
-
-  --v-50: #FFFFFF;
-  --v-100: #F5EBFF;
-  --v-200: #DDB8FF;
-  --v-300: #C585FF;
-  --v-400: #AC52FF;
-  --v-500: #941FFF;
-  --v-600: #7B00EB;
-  --v-700: #6000B8;
-  --v-800: #450085;
-  --v-900: #2B0052;
-
-  // Common color aliases
-  --color-woot: var(--w-500);
-
-  --color-heading: #1f2d3d;
-  --color-body: #3c4858;
-
-  --color-border: var(--s-75);
-  --color-border-light: var(--s-50);
-  --color-border-dark: var(--s-100);
-
-  --color-background: var(--s-50);
-  --color-background-light: var(--s-25);
-
-  // Social and inboxes brand colors
-  --color-facebook-brand: #3b5998;
-  --color-twitter-brand: #1da1f2;
-  --color-whatsapp-brand: #25d366;
-  --color-sms-twilio: #f42f46;
-  --color-cloud-generic: #18b7b0;
-
-  // Tech-debt
-  --color-medium-gray: #8492a6;
-}
diff --git a/app/javascript/shared/assets/stylesheets/font-size.scss b/app/javascript/shared/assets/stylesheets/font-size.scss
deleted file mode 100644
index 77406a5ca..000000000
--- a/app/javascript/shared/assets/stylesheets/font-size.scss
+++ /dev/null
@@ -1,14 +0,0 @@
-:root {
-  --font-size-nano: 0.5rem;
-  --font-size-micro: 0.625rem;
-  --font-size-mini: 0.75rem;
-  --font-size-small: 0.875rem;
-  --font-size-default: 1rem;
-  --font-size-medium: 1.125rem;
-  --font-size-two: 1.25rem;
-  --font-size-large: 1.375rem;
-  --font-size-big: 1.5rem;
-  --font-size-bigger: 1.875rem;
-  --font-size-mega: 2.125rem;
-  --font-size-giga: 2.5rem;
-}
diff --git a/app/javascript/shared/assets/stylesheets/font-weights.scss b/app/javascript/shared/assets/stylesheets/font-weights.scss
deleted file mode 100644
index 322b66c72..000000000
--- a/app/javascript/shared/assets/stylesheets/font-weights.scss
+++ /dev/null
@@ -1,8 +0,0 @@
-:root {
-  --font-weight-feather: 100;
-  --font-weight-light: 300;
-  --font-weight-normal: 400;
-  --font-weight-medium: 500;
-  --font-weight-bold: 600;
-  --font-weight-black: 700;
-}
diff --git a/app/javascript/shared/assets/stylesheets/shadows.scss b/app/javascript/shared/assets/stylesheets/shadows.scss
deleted file mode 100644
index ef086f93d..000000000
--- a/app/javascript/shared/assets/stylesheets/shadows.scss
+++ /dev/null
@@ -1,19 +0,0 @@
-:root {
-    --shadow: 0 1px 3px 0 rgba(0, 0, 0, 0.1),
-        0 1px 2px 0 rgba(0, 0, 0, 0.06);
-    --shadow-small: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
-    --shadow-medium: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
-        0 2px 4px -1px rgba(0, 0, 0, 0.06);
-    --shadow-large: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
-        0 4px 6px -2px rgba(0, 0, 0, 0.05);
-    --shadow-larger: 0 20px 25px -5px rgba(0, 0, 0, 0.1),
-        0 10px 10px -5px rgba(0, 0, 0, 0.04);
-    --shadow-dropdown-pane:
-        0 0.5rem 1rem rgb(50 50 93 / 8%),
-        0 0.25rem 0.75rem rgb(0 0 0 / 7%);
-    --shadow-bulk-action-container:
-        6px 3px 22px 9px rgb(181 181 181 / 25%);
-    --shadow-context-menu: rgb(22 23 24 / 30%) 0px 10px 38px -10px,
-    rgb(22 23 24 / 20%) 0px 10px 20px -15px;
-    --shadow-widget-builder: 0 0px 20px 5px rgb(0 0 0 / 10%);
-}
diff --git a/app/javascript/shared/assets/stylesheets/spacing.scss b/app/javascript/shared/assets/stylesheets/spacing.scss
deleted file mode 100644
index aad1e5b27..000000000
--- a/app/javascript/shared/assets/stylesheets/spacing.scss
+++ /dev/null
@@ -1,33 +0,0 @@
-:root {
-  // spaces
-  --space-zero: 0;
-  --space-micro: 0.125rem;
-  --space-smaller: 0.25rem;
-  --space-small: 0.5rem;
-  --space-one: 0.625rem;
-  --space-slab: 0.75rem;
-  --space-snug: 0.875rem;
-  --space-normal: 1rem;
-  --space-two: 1.25rem;
-  --space-medium: 1.5rem;
-  --space-large: 2rem;
-  --space-larger: 3rem;
-  --space-jumbo: 4rem;
-  --space-mega: 6.25rem;
-  --space-giga: 15rem;
-
-  --space-minus-micro: -0.125rem;
-  --space-minus-smaller: -0.25rem;
-  --space-minus-half: -0.3125rem;
-  --space-minus-small: -0.5rem;
-  --space-minus-one: -0.625rem;
-  --space-minus-slab: -0.75rem;
-  --space-minus-snug: -0.875rem;
-  --space-minus-normal: -1rem;
-  --space-minus-two: -1.25rem;
-  --space-minus-medium: -1.5rem;
-  --space-minus-large: -2rem;
-  --space-minus-larger: -3rem;
-  --space-minus-jumbo: -4rem;
-  --space-minus-mega: -6.25rem;
-}
diff --git a/app/javascript/shared/assets/stylesheets/z-index.scss b/app/javascript/shared/assets/stylesheets/z-index.scss
deleted file mode 100644
index 43c28d575..000000000
--- a/app/javascript/shared/assets/stylesheets/z-index.scss
+++ /dev/null
@@ -1,14 +0,0 @@
-:root {
-  // z-index
-  --z-index-minus: -1;
-  --z-index-zero: 0;
-  --z-index-one: 1;
-  --z-index-low: 10;
-  --z-index-twenty: 20;
-  --z-index-normal: 100;
-  --z-index-high: 1000;
-  --z-index-higher: 2000;
-  --z-index-much-higher: 5000;
-  --z-index-very-high: 9999;
-  --z-index-highest: 10000;
-}
diff --git a/app/javascript/shared/components/ArticleSkeletonLoader.vue b/app/javascript/shared/components/ArticleSkeletonLoader.vue
index d65813b54..098dde490 100644
--- a/app/javascript/shared/components/ArticleSkeletonLoader.vue
+++ b/app/javascript/shared/components/ArticleSkeletonLoader.vue
@@ -1,26 +1,26 @@
 <template>
-  <div class="p-4 space-y-6 bg-white dark:bg-slate-900">
+  <div class="p-4 space-y-6 bg-n-background">
     <div class="space-y-2 animate-loader-pulse">
-      <div class="h-6 bg-slate-100 dark:bg-slate-700 rounded w-1/5" />
-      <div class="h-10 bg-slate-100 dark:bg-slate-700 rounded w-3/5" />
+      <div class="h-6 bg-n-slate-4 dark:bg-n-slate-6 rounded w-1/5" />
+      <div class="h-10 bg-n-slate-4 dark:bg-n-slate-6 rounded w-3/5" />
     </div>
     <div class="space-y-2 animate-loader-pulse">
-      <div class="h-5 bg-slate-100 dark:bg-slate-700 rounded" />
-      <div class="h-5 bg-slate-100 dark:bg-slate-700 rounded" />
-      <div class="h-5 bg-slate-100 dark:bg-slate-700 rounded" />
-      <div class="h-5 bg-slate-100 dark:bg-slate-700 rounded w-4/5" />
+      <div class="h-5 bg-n-slate-4 dark:bg-n-slate-6 rounded" />
+      <div class="h-5 bg-n-slate-4 dark:bg-n-slate-6 rounded" />
+      <div class="h-5 bg-n-slate-4 dark:bg-n-slate-6 rounded" />
+      <div class="h-5 bg-n-slate-4 dark:bg-n-slate-6 rounded w-4/5" />
     </div>
     <div class="space-y-2 animate-loader-pulse">
-      <div class="h-5 bg-slate-100 dark:bg-slate-700 rounded" />
-      <div class="h-5 bg-slate-100 dark:bg-slate-700 rounded" />
-      <div class="h-5 bg-slate-100 dark:bg-slate-700 rounded w-3/5" />
-      <div class="h-5 bg-slate-100 dark:bg-slate-700 rounded" />
+      <div class="h-5 bg-n-slate-4 dark:bg-n-slate-6 rounded" />
+      <div class="h-5 bg-n-slate-4 dark:bg-n-slate-6 rounded" />
+      <div class="h-5 bg-n-slate-4 dark:bg-n-slate-6 rounded w-3/5" />
+      <div class="h-5 bg-n-slate-4 dark:bg-n-slate-6 rounded" />
     </div>
     <div class="space-y-2 animate-loader-pulse">
-      <div class="h-5 bg-slate-100 dark:bg-slate-700 rounded" />
-      <div class="h-5 bg-slate-100 dark:bg-slate-700 rounded" />
-      <div class="h-5 bg-slate-100 dark:bg-slate-700 rounded" />
-      <div class="h-5 bg-slate-100 dark:bg-slate-700 rounded w-3/5" />
+      <div class="h-5 bg-n-slate-4 dark:bg-n-slate-6 rounded" />
+      <div class="h-5 bg-n-slate-4 dark:bg-n-slate-6 rounded" />
+      <div class="h-5 bg-n-slate-4 dark:bg-n-slate-6 rounded" />
+      <div class="h-5 bg-n-slate-4 dark:bg-n-slate-6 rounded w-3/5" />
     </div>
   </div>
 </template>
diff --git a/app/javascript/shared/components/Button.vue b/app/javascript/shared/components/Button.vue
index b6275a3a3..52eef212e 100644
--- a/app/javascript/shared/components/Button.vue
+++ b/app/javascript/shared/components/Button.vue
@@ -27,11 +27,11 @@ export default {
       let className =
         'text-white py-3 px-4 rounded-lg shadow-sm leading-4 cursor-pointer disabled:opacity-50';
       if (this.type === 'clear') {
-        className = 'flex mx-auto mt-4 text-xs leading-3 w-auto text-black-600';
+        className = 'flex mx-auto mt-4 text-xs leading-3 w-auto text-n-gray-12';
       }
 
       if (this.type === 'blue' && !Object.keys(this.buttonStyles).length) {
-        className = `${className} bg-woot-500 hover:bg-woot-700`;
+        className = `${className} bg-n-brand hover:brightness-110`;
       }
       if (this.block) {
         className = `${className} w-full`;
diff --git a/app/javascript/shared/components/Spinner.vue b/app/javascript/shared/components/Spinner.vue
index e80a94c7b..af7237554 100644
--- a/app/javascript/shared/components/Spinner.vue
+++ b/app/javascript/shared/components/Spinner.vue
@@ -13,15 +13,15 @@ export default {
   computed: {
     colorSchemeClasses() {
       if (this.colorScheme === 'primary') {
-        return 'before:!border-t-woot-500';
+        return 'before:!border-t-n-brand';
       }
 
       if (this.colorScheme === 'warning') {
-        return 'before:!border-t-yellow-500';
+        return 'before:!border-t-n-amber-6';
       }
 
       if (this.colorScheme === 'success') {
-        return 'before:!border-t-success-500';
+        return 'before:!border-t-n-teal-9';
       }
 
       return this.colorScheme;
diff --git a/app/javascript/shared/components/TextArea.vue b/app/javascript/shared/components/TextArea.vue
index 682a4522b..1f6e0127a 100644
--- a/app/javascript/shared/components/TextArea.vue
+++ b/app/javascript/shared/components/TextArea.vue
@@ -38,23 +38,22 @@ export default {
       v-if="label"
       class="mb-2 text-xs font-medium"
       :class="{
-        'text-black-800': !error,
-        'text-red-400': error,
+        'text-n-gray-12': !error,
+        'text-n-ruby-9': error,
       }"
     >
       {{ label }}
     </div>
     <textarea
       v-model="computedModel"
-      class="w-full px-3 py-2 leading-tight border rounded outline-none resize-none text-slate-700"
+      class="w-full px-3 py-2 leading-tight border rounded outline-none resize-none text-n-gray-12"
       :class="{
-        'border-black-200 hover:border-black-300 focus:border-black-300':
-          !error,
-        'border-red-200 hover:border-red-300 focus:border-red-300': error,
+        'border-n-weak hover:border-n-weak focus:border-n-weak': !error,
+        'border-n-ruby-9 hover:border-n-ruby-9 focus:border-n-ruby-9': error,
       }"
       :placeholder="placeholder"
     />
-    <div v-if="error" class="mt-2 text-xs font-medium text-red-400">
+    <div v-if="error" class="mt-2 text-xs font-medium text-n-ruby-9">
       {{ error }}
     </div>
   </label>
diff --git a/app/javascript/shared/components/emoji/EmojiInput.vue b/app/javascript/shared/components/emoji/EmojiInput.vue
index 37917c6c3..586496d8a 100644
--- a/app/javascript/shared/components/emoji/EmojiInput.vue
+++ b/app/javascript/shared/components/emoji/EmojiInput.vue
@@ -210,23 +210,10 @@ export default {
 </style>
 
 <style lang="scss">
-@import 'dashboard/assets/scss/mixins';
-
 .emoji-dialog {
   &::before {
-    $space-slab: 12px;
-
-    @media (prefers-color-scheme: dark) {
-      $color-bg-dark: #26292b;
-      @include arrow(bottom, $color-bg-dark, $space-slab);
-    }
-
-    @media (prefers-color-scheme: light) {
-      $color-bg: #ebf0f5;
-      @include arrow(bottom, $color-bg, $space-slab);
-    }
-
-    @apply -bottom-3 absolute right-5;
+    @apply absolute -bottom-3 h-3 w-6 bg-n-slate-3 content-[""];
+    clip-path: polygon(50% 100%, 0% 0%, 100% 0%);
   }
 }
 
diff --git a/app/javascript/shared/components/ui/MultiselectDropdown.vue b/app/javascript/shared/components/ui/MultiselectDropdown.vue
index 3c066e691..e3150ac05 100644
--- a/app/javascript/shared/components/ui/MultiselectDropdown.vue
+++ b/app/javascript/shared/components/ui/MultiselectDropdown.vue
@@ -91,8 +91,11 @@ const hasValue = computed(() => {
         />
       </Button>
       <div
-        :class="{ 'dropdown-pane--open': showSearchDropdown }"
-        class="dropdown-pane"
+        :class="{
+          'block visible': showSearchDropdown,
+          'hidden invisible': !showSearchDropdown,
+        }"
+        class="box-border top-[2.625rem] w-full border rounded-lg bg-n-alpha-3 backdrop-blur-[100px] absolute shadow-lg border-n-strong dark:border-n-strong p-2 z-[9999]"
       >
         <div class="flex items-center justify-between mb-1">
           <h4
@@ -115,9 +118,3 @@ const hasValue = computed(() => {
     </div>
   </OnClickOutside>
 </template>
-
-<style lang="scss" scoped>
-.dropdown-pane {
-  @apply box-border top-[2.625rem] w-full;
-}
-</style>
diff --git a/app/javascript/shared/components/ui/MultiselectDropdownItems.vue b/app/javascript/shared/components/ui/MultiselectDropdownItems.vue
index 20f9cf05d..0df7bedac 100644
--- a/app/javascript/shared/components/ui/MultiselectDropdownItems.vue
+++ b/app/javascript/shared/components/ui/MultiselectDropdownItems.vue
@@ -133,7 +133,7 @@ export default {
 }
 
 .search-input {
-  @apply m-0 w-full border border-solid border-transparent h-8 text-sm text-slate-700 dark:text-slate-100 rounded-md focus:border-woot-500 bg-slate-50 dark:bg-slate-900;
+  @apply m-0 w-full border border-solid border-transparent h-8 text-sm text-n-slate-12 rounded-md focus:border-n-brand bg-n-background dark:bg-n-background;
 }
 
 .multiselect-dropdown--item {
@@ -144,7 +144,7 @@ export default {
   }
 
   &:hover {
-    @apply bg-n-slate-2 dark:bg-n-solid-3 text-slate-800 dark:text-slate-100;
+    @apply bg-n-slate-2 dark:bg-n-solid-3 text-n-slate-12;
   }
 }
 </style>
diff --git a/app/javascript/shared/components/ui/dropdown/DropdownDivider.vue b/app/javascript/shared/components/ui/dropdown/DropdownDivider.vue
index fbe7f6e32..f9b230fbb 100644
--- a/app/javascript/shared/components/ui/dropdown/DropdownDivider.vue
+++ b/app/javascript/shared/components/ui/dropdown/DropdownDivider.vue
@@ -4,7 +4,7 @@ export default {};
 
 <template>
   <li
-    class="list-none my-1 mx-0 border-b border-slate-50 dark:border-slate-700"
+    class="list-none my-1 mx-0 border-b border-n-weak"
     :tabindex="null"
     :aria-disabled="true"
   />
diff --git a/app/javascript/shared/components/ui/dropdown/DropdownHeader.vue b/app/javascript/shared/components/ui/dropdown/DropdownHeader.vue
index 65afa3123..9da0ef39c 100644
--- a/app/javascript/shared/components/ui/dropdown/DropdownHeader.vue
+++ b/app/javascript/shared/components/ui/dropdown/DropdownHeader.vue
@@ -13,7 +13,7 @@ export default {
 <template>
   <li class="inline-flex list-none" :tabindex="null" :aria-disabled="true">
     <span
-      class="text-xs text-slate-600 dark:text-slate-100 mt-1 font-medium w-full block text-left rtl:text-right whitespace-nowrap p-2"
+      class="text-xs text-n-slate-12 mt-1 font-medium w-full block text-left rtl:text-right whitespace-nowrap p-2"
     >
       {{ title }}
     </span>
diff --git a/app/javascript/shared/components/ui/dropdown/DropdownSubMenu.vue b/app/javascript/shared/components/ui/dropdown/DropdownSubMenu.vue
index 95f98f01b..f41d6fa7c 100644
--- a/app/javascript/shared/components/ui/dropdown/DropdownSubMenu.vue
+++ b/app/javascript/shared/components/ui/dropdown/DropdownSubMenu.vue
@@ -18,20 +18,10 @@ export default {
 </script>
 
 <template>
-  <li class="sub-menu-container">
-    <ul class="sub-menu-li-container">
+  <li class="!mt-0.5">
+    <ul class="!m-0">
       <WootDropdownHeader v-if="title" :title="title" />
       <slot />
     </ul>
   </li>
 </template>
-
-<style lang="scss" scoped>
-.sub-menu-container {
-  margin-top: var(--space-micro);
-}
-
-.sub-menu-li-container {
-  margin: 0;
-}
-</style>
diff --git a/app/javascript/shared/components/ui/label/LabelDropdown.vue b/app/javascript/shared/components/ui/label/LabelDropdown.vue
index 5eccabd2f..a1216acd8 100644
--- a/app/javascript/shared/components/ui/label/LabelDropdown.vue
+++ b/app/javascript/shared/components/ui/label/LabelDropdown.vue
@@ -114,12 +114,12 @@ export default {
   <div class="flex flex-col w-full max-h-[12.5rem]">
     <div class="flex items-center justify-center mb-1">
       <h4
-        class="flex-grow m-0 overflow-hidden text-sm text-slate-800 dark:text-slate-100 whitespace-nowrap text-ellipsis"
+        class="flex-grow m-0 overflow-hidden text-sm text-n-slate-12 whitespace-nowrap text-ellipsis"
       >
         {{ $t('CONTACT_PANEL.LABELS.LABEL_SELECT.TITLE') }}
       </h4>
       <Hotkey
-        custom-class="border border-solid text-slate-800 dark:text-slate-100 bg-slate-50 dark:bg-slate-600 text-xxs border-slate-75 dark:border-slate-600 flex-shrink-0"
+        custom-class="border border-solid text-n-slate-12 bg-n-slate-2 text-xxs border-n-strong flex-shrink-0"
       >
         {{ 'L' }}
       </Hotkey>
@@ -150,13 +150,13 @@ export default {
         </woot-dropdown-menu>
         <div
           v-if="noResult"
-          class="flex justify-center py-4 px-2.5 font-medium text-xs text-slate-700 dark:text-slate-200"
+          class="flex justify-center py-4 px-2.5 font-medium text-xs text-n-slate-11"
         >
           {{ $t('CONTACT_PANEL.LABELS.LABEL_SELECT.NO_RESULT') }}
         </div>
         <div
           v-if="allowCreation && shouldShowCreate"
-          class="flex pt-1 border-t border-solid border-slate-100 dark:border-slate-900"
+          class="flex pt-1 border-t border-solid border-n-weak"
         >
           <NextButton
             icon="i-lucide-plus"
diff --git a/app/javascript/shared/constants/busEvents.js b/app/javascript/shared/constants/busEvents.js
index 8ae15c3f8..0d5661d26 100644
--- a/app/javascript/shared/constants/busEvents.js
+++ b/app/javascript/shared/constants/busEvents.js
@@ -5,7 +5,6 @@ export const BUS_EVENTS = {
   SCROLL_TO_MESSAGE: 'SCROLL_TO_MESSAGE',
   MESSAGE_SENT: 'MESSAGE_SENT',
   FETCH_LABEL_SUGGESTIONS: 'FETCH_LABEL_SUGGESTIONS',
-  TOGGLE_SIDEMENU: 'TOGGLE_SIDEMENU',
   ON_MESSAGE_LIST_SCROLL: 'ON_MESSAGE_LIST_SCROLL',
   WEBSOCKET_DISCONNECT: 'WEBSOCKET_DISCONNECT',
   WEBSOCKET_RECONNECT: 'WEBSOCKET_RECONNECT',
diff --git a/app/javascript/shared/helpers/DateHelper.js b/app/javascript/shared/helpers/DateHelper.js
index dc6b8b4fd..938b4c605 100644
--- a/app/javascript/shared/helpers/DateHelper.js
+++ b/app/javascript/shared/helpers/DateHelper.js
@@ -2,7 +2,7 @@ import fromUnixTime from 'date-fns/fromUnixTime';
 import format from 'date-fns/format';
 import isToday from 'date-fns/isToday';
 import isYesterday from 'date-fns/isYesterday';
-import { endOfDay, getUnixTime, startOfDay, differenceInDays } from 'date-fns';
+import { endOfDay, getUnixTime, startOfDay } from 'date-fns';
 
 export const formatUnixDate = (date, dateFormat = 'MMM dd, yyyy') => {
   const unixDate = fromUnixTime(date);
@@ -16,10 +16,6 @@ export const formatDate = ({ date, todayText, yesterdayText }) => {
   return date;
 };
 
-export const formatDigitToString = val => {
-  return val > 9 ? `${val}` : `0${val}`;
-};
-
 export const isTimeAfter = (h1, m1, h2, m2) => {
   if (h1 < h2) {
     return false;
@@ -45,8 +41,3 @@ export const generateRelativeTime = (value, unit, languageCode) => {
   });
   return rtf.format(value, unit);
 };
-
-export const getDayDifferenceFromNow = (now, timestampInSeconds) => {
-  const date = new Date(timestampInSeconds * 1000);
-  return differenceInDays(now, date);
-};
diff --git a/app/javascript/shared/helpers/specs/DateHelper.spec.js b/app/javascript/shared/helpers/specs/DateHelper.spec.js
index 63ef9edd8..13678fa2f 100644
--- a/app/javascript/shared/helpers/specs/DateHelper.spec.js
+++ b/app/javascript/shared/helpers/specs/DateHelper.spec.js
@@ -1,10 +1,8 @@
 import {
   formatDate,
   formatUnixDate,
-  formatDigitToString,
   isTimeAfter,
   generateRelativeTime,
-  getDayDifferenceFromNow,
 } from '../DateHelper';
 
 describe('#DateHelper', () => {
@@ -47,14 +45,6 @@ describe('#DateHelper', () => {
     ).toEqual('Yesterday');
   });
 });
-describe('#formatDigitToString', () => {
-  it('returns date compatabile string from number is less than 9', () => {
-    expect(formatDigitToString(8)).toEqual('08');
-  });
-  it('returns date compatabile string from number is greater than 9', () => {
-    expect(formatDigitToString(11)).toEqual('11');
-  });
-});
 
 describe('#isTimeAfter', () => {
   it('return correct values', () => {
@@ -121,25 +111,3 @@ describe('generateRelativeTime', () => {
     expect(actualResult).toBe(expectedResult);
   });
 });
-
-describe('#getDayDifferenceFromNow', () => {
-  it('should return the difference if in same day', () => {
-    const now = new Date('2023-12-08T00:00:00.000Z');
-    const timestampInSeconds = 1702020305; // 08/12/2023, 12:55:05 (GMT+05:30)
-    const expectedResult = 0;
-
-    const actualResult = getDayDifferenceFromNow(now, timestampInSeconds);
-
-    expect(actualResult).toBe(expectedResult);
-  });
-
-  it('should return the difference if in different day', () => {
-    const now = new Date('2023-12-11T00:00:00.000Z');
-    const timestampInSeconds = 1702020305; // 08/12/2023, 12:55:05 (GMT+05:30)
-    const expectedResult = 2;
-
-    const actualResult = getDayDifferenceFromNow(now, timestampInSeconds);
-
-    expect(actualResult).toBe(expectedResult);
-  });
-});
diff --git a/app/javascript/v3/App.vue b/app/javascript/v3/App.vue
index 718828665..992c0b381 100644
--- a/app/javascript/v3/App.vue
+++ b/app/javascript/v3/App.vue
@@ -50,10 +50,6 @@ export default {
 @tailwind utilities;
 
 @import '../dashboard/assets/scss/next-colors';
-@import 'shared/assets/stylesheets/colors';
-@import 'shared/assets/stylesheets/spacing';
-@import 'shared/assets/stylesheets/font-size';
-@import 'shared/assets/stylesheets/border-radius';
 
 html,
 body {
@@ -68,7 +64,7 @@ body {
 }
 
 .text-link {
-  @apply text-woot-500 font-medium hover:text-woot-600;
+  @apply text-n-brand font-medium hover:text-n-blue-10;
 }
 
 .v-popper--theme-tooltip .v-popper__inner {
diff --git a/app/javascript/v3/components/Button/SubmitButton.vue b/app/javascript/v3/components/Button/SubmitButton.vue
deleted file mode 100644
index 88dad0799..000000000
--- a/app/javascript/v3/components/Button/SubmitButton.vue
+++ /dev/null
@@ -1,65 +0,0 @@
-<script>
-import Spinner from 'shared/components/Spinner.vue';
-
-export default {
-  components: {
-    Spinner,
-  },
-  props: {
-    disabled: {
-      type: Boolean,
-      default: false,
-    },
-    loading: {
-      type: Boolean,
-      default: false,
-    },
-    buttonText: {
-      type: String,
-      default: '',
-    },
-    buttonClass: {
-      type: String,
-      default: '',
-    },
-    iconClass: {
-      type: String,
-      default: '',
-    },
-    type: {
-      type: String,
-      default: 'submit',
-    },
-  },
-  computed: {
-    computedClass() {
-      return `
-        ${this.disabled ? 'opacity-40 hover:bg-woot-500' : ''}
-        ${this.buttonClass || ' '}
-      `;
-    },
-  },
-  created() {
-    if (import.meta.env.DEV) {
-      // eslint-disable-next-line
-      console.warn(
-        '[DEPRECATED] This component has been deprecated and will be removed soon. Please use v3/components/Form/Button.vue instead'
-      );
-    }
-  },
-};
-</script>
-
-<template>
-  <button
-    :type="type"
-    data-testid="submit_button"
-    :disabled="disabled"
-    :class="computedClass"
-    class="flex items-center w-full justify-center rounded-md bg-woot-500 py-3 px-3 text-base font-medium text-white shadow-sm hover:bg-woot-600 focus-visible:outline focus-visible:outline-2 focus-visible:outline-offset-2 focus-visible:outline-woot-500 cursor-pointer"
-  >
-    <span>{{ buttonText }}</span>
-    <fluent-icon v-if="!!iconClass" :icon="iconClass" class="icon" />
-    <Spinner v-if="loading" />
-  </button>
-</template>
diff --git a/app/javascript/v3/components/Form/Button.vue b/app/javascript/v3/components/Form/Button.vue
deleted file mode 100644
index 5786b0af7..000000000
--- a/app/javascript/v3/components/Form/Button.vue
+++ /dev/null
@@ -1,101 +0,0 @@
-<script setup>
-import { computed, useAttrs } from 'vue';
-
-const props = defineProps({
-  variant: {
-    type: String,
-    default: 'solid',
-    validator: value => ['outline', 'ghost', 'solid'].includes(value),
-  },
-  size: {
-    type: String,
-    default: 'large',
-    validator: value => ['medium', 'large'].includes(value),
-  },
-  icon: {
-    type: String,
-    default: '',
-  },
-  colorScheme: {
-    type: String,
-    default: 'primary',
-    validator: value => ['primary', 'secondary', 'danger'].includes(value),
-  },
-  trailingIcon: {
-    type: Boolean,
-    default: false,
-  },
-});
-
-const attrs = useAttrs();
-
-const baseClasses = {
-  outline: 'outline outline-1 -outline-offset-1',
-  ghost: 'hover:text-600 active:text-600 focus:outline focus:outline-offset-1',
-  solid:
-    'hover:bg-700 active:bg-700 focus:outline focus:outline-offset-1 focus:outline-2',
-};
-
-const colorClass = computed(() => {
-  if (attrs.disabled) {
-    return 'bg-ash-200 text-ash-600 cursor-not-allowed';
-  }
-
-  const styleMap = {
-    primary: {
-      outline: `${baseClasses.outline} outline-primary-400 hover:text-primary-600 active:text-primary-600`,
-      ghost: `${baseClasses.ghost} focus:outline-primary-400`,
-      solid: `${baseClasses.solid} bg-primary-600 text-white focus:outline-primary-400`,
-    },
-    secondary: {
-      outline: `${baseClasses.outline} outline-ash-400 hover:text-ash-900 active:text-ash-900 `,
-      ghost: `${baseClasses.ghost} focus:outline-ash-400`,
-      solid: `${baseClasses.solid} bg-ash-100 text-ash-900 focus:outline-ash-400`,
-    },
-    danger: {
-      outline: `${baseClasses.outline} outline-ruby-400 hover:text-ruby-600 active:text-ruby-600`,
-      ghost: `${baseClasses.ghost} focus:outline-ruby-400`,
-      solid: `${baseClasses.solid} bg-ruby-600 text-white focus:outline-ruby-400`,
-    },
-  };
-
-  const schemeStyles = styleMap[props.colorScheme];
-  return schemeStyles[props.variant] || schemeStyles.solid;
-});
-
-const sizeClass = computed(() => {
-  if (props.size === 'medium') {
-    return 'h-8 px-3 py-1.5 text-sm';
-  }
-  return 'h-10 px-4 py-2.5 text';
-});
-
-const buttonClasses = computed(() => [colorClass.value, sizeClass.value]);
-</script>
-
-<template>
-  <button
-    class="inline-flex items-center gap-1 text-sm font-medium reset-base rounded-xl w-fit"
-    :class="buttonClasses"
-    v-bind="$attrs"
-  >
-    <fluent-icon
-      v-if="icon && !trailingIcon"
-      size="1.16em"
-      :icon="icon"
-      class="flex-shrink-0"
-    />
-    <span
-      v-if="$slots.default"
-      class="text-sm font-medium truncate ltr:text-left rtl:text-right"
-    >
-      <slot />
-    </span>
-    <fluent-icon
-      v-if="icon && trailingIcon"
-      size="1.16em"
-      :icon="icon"
-      class="flex-shrink-0"
-    />
-  </button>
-</template>
diff --git a/app/javascript/v3/components/Form/CheckBox.vue b/app/javascript/v3/components/Form/CheckBox.vue
index fe5baf41d..8241e3150 100644
--- a/app/javascript/v3/components/Form/CheckBox.vue
+++ b/app/javascript/v3/components/Form/CheckBox.vue
@@ -26,6 +26,6 @@ const checked = computed({
     v-model="checked"
     type="checkbox"
     :value="value"
-    class="flex-shrink-0 mt-0.5 border-ash-200 border bg-ash-50 checked:border-none checked:bg-primary-600 dark:checked:bg-primary-600 shadow-sm appearance-none rounded-[4px] w-4 h-4 focus:ring-1 after:content-[''] after:text-white checked:after:content-['✓'] after:flex after:items-center after:justify-center after:text-center after:text-xs after:font-bold after:relative"
+    class="flex-shrink-0 mt-0.5 border-n-strong border bg-n-slate-2 checked:border-none checked:bg-n-brand shadow-sm appearance-none rounded-[4px] w-4 h-4 focus:ring-1 after:content-[''] after:text-white checked:after:content-['✓'] after:flex after:items-center after:justify-center after:text-center after:text-xs after:font-bold after:relative"
   />
 </template>
diff --git a/app/javascript/v3/components/Form/InitialsAvatar.vue b/app/javascript/v3/components/Form/InitialsAvatar.vue
deleted file mode 100644
index ad427acaf..000000000
--- a/app/javascript/v3/components/Form/InitialsAvatar.vue
+++ /dev/null
@@ -1,43 +0,0 @@
-<script setup>
-import { computed } from 'vue';
-import { userInitial } from 'v3/helpers/CommonHelper';
-const props = defineProps({
-  name: {
-    type: String,
-    default: '',
-  },
-  size: {
-    type: Number,
-    default: 72,
-  },
-});
-const colors = {
-  1: 'bg-ash-200 text-ash-900',
-  2: 'bg-amber-200 text-amber-900',
-  3: 'bg-pink-100 text-pink-800',
-  4: 'bg-purple-100 text-purple-800',
-  5: 'bg-indigo-100 text-indigo-800',
-  6: 'bg-grass-100 text-grass-800',
-  7: 'bg-mint-100 text-mint-800',
-  8: 'bg-orange-100 text-orange-800',
-};
-const style = computed(() => ({
-  fontSize: `${Math.floor(props.size / 2.5)}px`,
-}));
-const colorClass = computed(() => {
-  return colors[(props.name.length % 8) + 1];
-});
-
-const initial = computed(() => userInitial(props.name));
-</script>
-
-<template>
-  <div
-    class="rounded-xl flex leading-[100%] font-medium items-center justify-center text-center cursor-default"
-    :class="`h-[${size}px] w-[${size}px] ${colorClass}`"
-    :style="style"
-    aria-hidden="true"
-  >
-    <slot>{{ initial }}</slot>
-  </div>
-</template>
diff --git a/app/javascript/v3/components/Form/Switch.vue b/app/javascript/v3/components/Form/Switch.vue
index 597284ef8..c7e9e93fb 100644
--- a/app/javascript/v3/components/Form/Switch.vue
+++ b/app/javascript/v3/components/Form/Switch.vue
@@ -17,9 +17,7 @@ export default {
     type="button"
     class="relative flex-shrink-0 h-4 p-0 border-none shadow-inner w-7 rounded-3xl"
     :class="
-      modelValue
-        ? 'bg-primary-600 shadow-primary-800'
-        : 'shadow-ash-400 bg-ash-200'
+      modelValue ? 'bg-n-brand shadow-n-brand' : 'shadow-n-slate-6 bg-n-slate-5'
     "
     role="switch"
     :aria-checked="modelValue.toString()"
@@ -27,7 +25,7 @@ export default {
   >
     <span
       aria-hidden="true"
-      class="rounded-full bg-white top-0.5 absolute dark:bg-white w-3 h-3 translate-y-0 duration-200 transition-transform ease-in-out"
+      class="rounded-full bg-n-background top-0.5 absolute w-3 h-3 translate-y-0 duration-200 transition-transform ease-in-out"
       :class="
         modelValue
           ? 'ltr:translate-x-0 rtl:translate-x-[0.75rem]'
diff --git a/app/javascript/v3/components/Form/Textarea.vue b/app/javascript/v3/components/Form/Textarea.vue
deleted file mode 100644
index 8236d5b21..000000000
--- a/app/javascript/v3/components/Form/Textarea.vue
+++ /dev/null
@@ -1,85 +0,0 @@
-<script>
-import WithLabel from './WithLabel.vue';
-export default {
-  components: {
-    WithLabel,
-  },
-  props: {
-    label: {
-      type: String,
-      default: '',
-    },
-    name: {
-      type: String,
-      required: true,
-    },
-    required: {
-      type: Boolean,
-      default: false,
-    },
-    placeholder: {
-      type: String,
-      default: '',
-    },
-    modelValue: {
-      type: [String, Number],
-      default: '',
-    },
-    rows: {
-      type: Number,
-      default: 3,
-    },
-    allowResize: {
-      type: Boolean,
-      default: true,
-    },
-    hasError: {
-      type: Boolean,
-      default: false,
-    },
-    errorMessage: {
-      type: String,
-      default: '',
-    },
-    dataTestid: {
-      type: String,
-      default: '',
-    },
-  },
-  emits: ['update:modelValue', 'blur'],
-  methods: {
-    onInput(e) {
-      this.$emit('update:modelValue', e.target.value);
-    },
-  },
-};
-</script>
-
-<template>
-  <WithLabel
-    :label="label"
-    :name="name"
-    :has-error="hasError"
-    :error-message="errorMessage"
-  >
-    <textarea
-      :id="name"
-      :name="name"
-      autocomplete="off"
-      :required="required"
-      :placeholder="placeholder"
-      :data-testid="dataTestid"
-      :value="modelValue"
-      :rows="rows"
-      :class="{
-        'focus:outline-red-600 outline-red-600': hasError,
-        'dark:outline-slate-600 dark:focus:outline-woot-500 outline-slate-200 focus:outline-woot-500':
-          !hasError,
-        'resize-none': !allowResize,
-      }"
-      class="block w-full p-3 bg-white border-none rounded-md shadow-sm appearance-none outline outline-1 focus:outline focus:outline-2 text-slate-900 dark:text-slate-100 placeholder:text-slate-400 dark:bg-slate-800"
-      @update:model-value="onInput"
-      @blur="$emit('blur')"
-    />
-  </WithLabel>
-</template>
diff --git a/app/javascript/v3/components/SnackBar/Item.vue b/app/javascript/v3/components/SnackBar/Item.vue
index 25c719c76..97c75cc63 100644
--- a/app/javascript/v3/components/SnackBar/Item.vue
+++ b/app/javascript/v3/components/SnackBar/Item.vue
@@ -17,7 +17,7 @@ export default {
 
 <template>
   <div
-    class="bg-slate-900 dark:bg-slate-800 rounded-md drop-shadow-md mb-4 max-w-[40rem] inline-flex items-center min-w-[22rem] py-3 px-4"
+    class="bg-n-slate-12 dark:bg-n-slate-7 rounded-md drop-shadow-md mb-4 max-w-[40rem] inline-flex items-center min-w-[22rem] py-3 px-4"
     :class="isActionPresent ? 'justify-between' : 'justify-center'"
   >
     <div class="text-sm font-medium text-white">
diff --git a/app/javascript/v3/views/auth/password/Edit.vue b/app/javascript/v3/views/auth/password/Edit.vue
index 34405d76e..93ae3b0ac 100644
--- a/app/javascript/v3/views/auth/password/Edit.vue
+++ b/app/javascript/v3/views/auth/password/Edit.vue
@@ -3,14 +3,14 @@ import { useVuelidate } from '@vuelidate/core';
 import { required, minLength } from '@vuelidate/validators';
 import { useAlert } from 'dashboard/composables';
 import FormInput from '../../../components/Form/Input.vue';
-import SubmitButton from '../../../components/Button/SubmitButton.vue';
+import NextButton from 'dashboard/components-next/button/Button.vue';
 import { DEFAULT_REDIRECT_URL } from 'dashboard/constants/globals';
 import { setNewPassword } from '../../../api/auth';
 
 export default {
   components: {
     FormInput,
-    SubmitButton,
+    NextButton,
   },
   props: {
     resetPasswordToken: { type: String, default: '' },
@@ -120,14 +120,18 @@ export default {
           :placeholder="$t('SET_NEW_PASSWORD.CONFIRM_PASSWORD.PLACEHOLDER')"
           @blur="v$.credentials.confirmPassword.$touch"
         />
-        <SubmitButton
+        <NextButton
+          lg
+          type="submit"
+          data-testid="submit_button"
+          class="w-full"
+          :label="$t('SET_NEW_PASSWORD.SUBMIT')"
           :disabled="
             v$.credentials.password.$invalid ||
             v$.credentials.confirmPassword.$invalid ||
             newPasswordAPI.showLoading
           "
-          :button-text="$t('SET_NEW_PASSWORD.SUBMIT')"
-          :loading="newPasswordAPI.showLoading"
+          :is-loading="newPasswordAPI.showLoading"
         />
       </div>
     </form>
diff --git a/app/javascript/v3/views/auth/reset/password/Index.vue b/app/javascript/v3/views/auth/reset/password/Index.vue
index a1fecacde..4f3bf04e8 100644
--- a/app/javascript/v3/views/auth/reset/password/Index.vue
+++ b/app/javascript/v3/views/auth/reset/password/Index.vue
@@ -6,10 +6,10 @@ import { required, minLength, email } from '@vuelidate/validators';
 import globalConfigMixin from 'shared/mixins/globalConfigMixin';
 import FormInput from '../../../../components/Form/Input.vue';
 import { resetPassword } from '../../../../api/auth';
-import SubmitButton from '../../../../components/Button/SubmitButton.vue';
+import NextButton from 'dashboard/components-next/button/Button.vue';
 
 export default {
-  components: { FormInput, SubmitButton },
+  components: { FormInput, NextButton },
   mixins: [globalConfigMixin],
   setup() {
     return { v$: useVuelidate() };
@@ -98,10 +98,14 @@ export default {
           :placeholder="$t('RESET_PASSWORD.EMAIL.PLACEHOLDER')"
           @input="v$.credentials.email.$touch"
         />
-        <SubmitButton
+        <NextButton
+          lg
+          type="submit"
+          data-testid="submit_button"
+          class="w-full"
+          :label="$t('RESET_PASSWORD.SUBMIT')"
           :disabled="v$.credentials.email.$invalid || resetPassword.showLoading"
-          :button-text="$t('RESET_PASSWORD.SUBMIT')"
-          :loading="resetPassword.showLoading"
+          :is-loading="resetPassword.showLoading"
         />
       </div>
       <p class="mt-4 -mb-1 text-sm text-n-slate-11">
diff --git a/app/javascript/v3/views/auth/signup/components/Signup/Form.vue b/app/javascript/v3/views/auth/signup/components/Signup/Form.vue
index 9cffea18d..6f0a6da48 100644
--- a/app/javascript/v3/views/auth/signup/components/Signup/Form.vue
+++ b/app/javascript/v3/views/auth/signup/components/Signup/Form.vue
@@ -7,7 +7,7 @@ import globalConfigMixin from 'shared/mixins/globalConfigMixin';
 import { DEFAULT_REDIRECT_URL } from 'dashboard/constants/globals';
 import VueHcaptcha from '@hcaptcha/vue3-hcaptcha';
 import FormInput from '../../../../../components/Form/Input.vue';
-import SubmitButton from '../../../../../components/Button/SubmitButton.vue';
+import NextButton from 'dashboard/components-next/button/Button.vue';
 import { isValidPassword } from 'shared/helpers/Validators';
 import GoogleOAuthButton from '../../../../../components/GoogleOauth/Button.vue';
 import { register } from '../../../../../api/auth';
@@ -17,7 +17,7 @@ export default {
   components: {
     FormInput,
     GoogleOAuthButton,
-    SubmitButton,
+    NextButton,
     VueHcaptcha,
   },
   mixins: [globalConfigMixin],
@@ -195,23 +195,28 @@ export default {
         />
         <span
           v-if="!hasAValidCaptcha && didCaptchaReset"
-          class="text-xs text-red-400"
+          class="text-xs text-n-ruby-9"
         >
           {{ $t('SET_NEW_PASSWORD.CAPTCHA.ERROR') }}
         </span>
       </div>
-      <SubmitButton
-        :button-text="$t('REGISTER.SUBMIT')"
+      <NextButton
+        lg
+        type="submit"
+        data-testid="submit_button"
+        class="w-full"
+        icon="i-lucide-chevron-right"
+        trailing-icon
+        :label="$t('REGISTER.SUBMIT')"
         :disabled="isSignupInProgress || !isFormValid"
-        :loading="isSignupInProgress"
-        icon-class="arrow-chevron-right"
+        :is-loading="isSignupInProgress"
       />
     </form>
     <GoogleOAuthButton v-if="showGoogleOAuth" class="flex-col-reverse">
       {{ $t('REGISTER.OAUTH.GOOGLE_SIGNUP') }}
     </GoogleOAuthButton>
     <p
-      class="text-sm mb-1 mt-5 text-slate-800 dark:text-woot-50 [&>a]:text-woot-500 [&>a]:font-medium [&>a]:hover:text-woot-600"
+      class="text-sm mb-1 mt-5 text-n-slate-12 [&>a]:text-n-brand [&>a]:font-medium [&>a]:hover:brightness-110"
       v-html="termsLink"
     />
   </div>
@@ -221,8 +226,7 @@ export default {
 .h-captcha--box {
   &::v-deep .error {
     iframe {
-      border: 1px solid var(--r-500);
-      border-radius: var(--border-radius-normal);
+      @apply rounded-md border border-n-ruby-8 dark:border-n-ruby-8;
     }
   }
 }
diff --git a/app/javascript/v3/views/auth/signup/components/Testimonials/Index.vue b/app/javascript/v3/views/auth/signup/components/Testimonials/Index.vue
index d6bed6431..e49cf7505 100644
--- a/app/javascript/v3/views/auth/signup/components/Testimonials/Index.vue
+++ b/app/javascript/v3/views/auth/signup/components/Testimonials/Index.vue
@@ -28,7 +28,7 @@ export default {
 <template>
   <div
     v-show="testimonials.length"
-    class="relative flex-1 min-h-screen hidden overflow-hidden bg-woot-400 dark:bg-woot-800 xl:flex"
+    class="relative flex-1 min-h-screen hidden overflow-hidden bg-n-blue-8 dark:bg-n-blue-5 xl:flex"
   >
     <img
       src="assets/images/auth/top-left.svg"
diff --git a/app/javascript/v3/views/login/Index.vue b/app/javascript/v3/views/login/Index.vue
index a90368d08..707e84879 100644
--- a/app/javascript/v3/views/login/Index.vue
+++ b/app/javascript/v3/views/login/Index.vue
@@ -15,7 +15,7 @@ import globalConfigMixin from 'shared/mixins/globalConfigMixin';
 import FormInput from '../../components/Form/Input.vue';
 import GoogleOAuthButton from '../../components/GoogleOauth/Button.vue';
 import Spinner from 'shared/components/Spinner.vue';
-import SubmitButton from '../../components/Button/SubmitButton.vue';
+import NextButton from 'dashboard/components-next/button/Button.vue';
 
 const ERROR_MESSAGES = {
   'no-account-found': 'LOGIN.OAUTH.NO_ACCOUNT_FOUND',
@@ -29,7 +29,7 @@ export default {
     FormInput,
     GoogleOAuthButton,
     Spinner,
-    SubmitButton,
+    NextButton,
   },
   mixins: [globalConfigMixin],
   props: {
@@ -237,11 +237,15 @@ export default {
               </router-link>
             </p>
           </FormInput>
-          <SubmitButton
-            :disabled="loginApi.showLoading"
+          <NextButton
+            lg
+            type="submit"
+            data-testid="submit_button"
+            class="w-full"
             :tabindex="3"
-            :button-text="$t('LOGIN.SUBMIT')"
-            :loading="loginApi.showLoading"
+            :label="$t('LOGIN.SUBMIT')"
+            :disabled="loginApi.showLoading"
+            :is-loading="loginApi.showLoading"
           />
         </form>
       </div>
diff --git a/app/javascript/v3/views/onboarding/OnboardingStep.vue b/app/javascript/v3/views/onboarding/OnboardingStep.vue
index fbd3d17d4..ac8c079ff 100644
--- a/app/javascript/v3/views/onboarding/OnboardingStep.vue
+++ b/app/javascript/v3/views/onboarding/OnboardingStep.vue
@@ -24,19 +24,19 @@ export default {
 
 <template>
   <div
-    class="flex items-center gap-2 p-2 text-lg font-bold mb-6 relative before:absolute before:h-10 before:w-[1px] before:bg-slate-200 before:-bottom-8 before:left-[24px] hide-before-of-last"
+    class="flex items-center gap-2 p-2 text-lg font-bold mb-6 relative before:absolute before:h-10 before:w-[1px] before:bg-n-slate-3 before:-bottom-8 before:left-[24px] hide-before-of-last"
     :class="{
-      'text-woot-500 ': isActive,
-      'text-slate-400': !isActive || isComplete,
-      'before:bg-woot-500': !isActive && isComplete,
+      'text-n-brand ': isActive,
+      'text-n-slate-6': !isActive || isComplete,
+      'before:bg-n-brand': !isActive && isComplete,
     }"
   >
     <div
       class="grid w-8 h-8 border border-solid rounded-full place-content-center"
       :class="{
-        'border-woot-500': !isActive || isComplete,
-        'border-slate-200 dark:border-slate-600': !isActive && !isComplete,
-        'text-woot-500': isComplete,
+        'border-n-brand': !isActive || isComplete,
+        'border-n-weak': !isActive && !isComplete,
+        'text-n-brand': isComplete,
       }"
     >
       <fluent-icon v-if="isComplete" size="20" icon="checkmark" />
diff --git a/app/javascript/widget/assets/scss/woot.scss b/app/javascript/widget/assets/scss/woot.scss
index 3a8496d70..07aa6a0e3 100755
--- a/app/javascript/widget/assets/scss/woot.scss
+++ b/app/javascript/widget/assets/scss/woot.scss
@@ -1,6 +1,3 @@
-@import 'shared/assets/stylesheets/animations';
-@import 'shared/assets/stylesheets/colors';
-
 @import 'reset';
 @import 'tailwindcss/base';
 @import 'tailwindcss/components';
diff --git a/app/javascript/widget/components/ChatHeader.vue b/app/javascript/widget/components/ChatHeader.vue
index 462cddcfe..7c497b70f 100644
--- a/app/javascript/widget/components/ChatHeader.vue
+++ b/app/javascript/widget/components/ChatHeader.vue
@@ -76,7 +76,7 @@ export default {
           <span v-dompurify-html="title" class="ltr:mr-1 rtl:ml-1" />
           <div
             :class="`h-2 w-2 rounded-full
-              ${isOnline ? 'bg-green-500' : 'hidden'}`"
+              ${isOnline ? 'bg-n-teal-10' : 'hidden'}`"
           />
         </div>
         <div class="text-xs leading-3 text-n-slate-11">
diff --git a/app/javascript/widget/components/FooterReplyTo.vue b/app/javascript/widget/components/FooterReplyTo.vue
index 42d7492a5..fdafbb37b 100644
--- a/app/javascript/widget/components/FooterReplyTo.vue
+++ b/app/javascript/widget/components/FooterReplyTo.vue
@@ -26,14 +26,14 @@ export default {
 
 <template>
   <div
-    class="mb-2.5 rounded-[7px] dark:bg-slate-900 dark:text-slate-100 bg-slate-100 px-2 py-1.5 text-sm text-slate-700 flex items-center gap-2"
+    class="mb-2.5 rounded-[7px] bg-n-slate-3 px-2 py-1.5 text-sm text-n-slate-11 flex items-center gap-2"
   >
     <div class="items-center flex-grow truncate">
       <strong>{{ $t('FOOTER_REPLY_TO.REPLY_TO') }}</strong>
       {{ inReplyTo.content || replyToAttachment }}
     </div>
     <button
-      class="items-end flex-shrink-0 p-1 rounded-md hover:bg-slate-200 dark:hover:bg-slate-800"
+      class="items-end flex-shrink-0 p-1 rounded-md hover:bg-n-slate-5"
       @click="$emit('dismiss')"
     >
       <FluentIcon icon="dismiss" size="12" />
diff --git a/app/javascript/widget/components/MessageReplyButton.vue b/app/javascript/widget/components/MessageReplyButton.vue
index b99194ac3..f484f2e76 100644
--- a/app/javascript/widget/components/MessageReplyButton.vue
+++ b/app/javascript/widget/components/MessageReplyButton.vue
@@ -9,7 +9,7 @@ export default {
 
 <template>
   <button
-    class="p-1 mb-1 rounded-full dark:text-slate-500 dark:bg-slate-900 text-slate-600 bg-slate-100 hover:text-slate-800"
+    class="p-1 mb-1 rounded-full text-n-slate-11 bg-n-slate-3 hover:text-n-slate-12"
   >
     <FluentIcon icon="arrow-reply" size="11" class="flex-shrink-0" />
   </button>
diff --git a/app/javascript/widget/components/ReplyToChip.vue b/app/javascript/widget/components/ReplyToChip.vue
index f4c76ebcc..2968e5353 100644
--- a/app/javascript/widget/components/ReplyToChip.vue
+++ b/app/javascript/widget/components/ReplyToChip.vue
@@ -37,9 +37,9 @@ export default {
       this.$nextTick(() => {
         const el = document.getElementById(elementId);
         el.scrollIntoView();
-        el.classList.add('bg-slate-100', 'dark:bg-slate-900');
+        el.classList.add('bg-n-slate-3', 'dark:bg-n-solid-3');
         this.timeOutID = setTimeout(() => {
-          el.classList.remove('bg-slate-100', 'dark:bg-slate-900');
+          el.classList.remove('bg-n-slate-3', 'dark:bg-n-solid-3');
         }, 500);
       });
     },
@@ -49,7 +49,7 @@ export default {
 
 <template>
   <button
-    class="px-1.5 py-0.5 rounded-md text-slate-500 bg-slate-50 dark:bg-slate-900 opacity-60 hover:opacity-100 cursor-pointer flex items-center gap-1.5"
+    class="px-1.5 py-0.5 rounded-md text-n-slate-11 bg-n-slate-4 opacity-60 hover:opacity-100 cursor-pointer flex items-center gap-1.5"
     @click="navigateTo(replyTo.id)"
   >
     <FluentIcon icon="arrow-reply" size="12" class="flex-shrink-0" />
diff --git a/app/javascript/widget/components/UnreadMessageList.vue b/app/javascript/widget/components/UnreadMessageList.vue
index 51b14a4d0..b9e415745 100644
--- a/app/javascript/widget/components/UnreadMessageList.vue
+++ b/app/javascript/widget/components/UnreadMessageList.vue
@@ -118,12 +118,12 @@ export default {
   }
 
   .clear-button {
-    transition: all 0.3s var(--ease-in-cubic);
+    transition: all 0.3s cubic-bezier(0.17, 0.67, 0.83, 0.67);
     @apply bg-transparent text-n-brand border-none border-0 font-semibold text-base ml-1 py-0 pl-0 pr-2.5 hover:brightness-75 hover:translate-x-1;
   }
 
   .close-unread-button {
-    transition: all 0.3s var(--ease-in-cubic);
+    transition: all 0.3s cubic-bezier(0.17, 0.67, 0.83, 0.67);
     @apply bg-n-slate-3 dark:bg-n-slate-12 text-n-slate-12 dark:text-n-slate-1 hover:brightness-95 border-none border-0 font-medium text-xxs rounded-2xl mb-3;
   }
 }
diff --git a/app/javascript/widget/components/template/Article.vue b/app/javascript/widget/components/template/Article.vue
index a380f6564..218bab6f8 100644
--- a/app/javascript/widget/components/template/Article.vue
+++ b/app/javascript/widget/components/template/Article.vue
@@ -36,7 +36,7 @@ export default {
         rel="noopener noreferrer nofollow"
         class="text-n-slate-12 no-underline"
       >
-        <span class="flex items-center text-black-900 font-medium">
+        <span class="flex items-center text-n-slate-12 font-medium">
           <FluentIcon icon="link" class="ltr:mr-1 rtl:ml-1 text-n-slate-12" />
           <span class="text-n-slate-12">
             {{ item.title }}
diff --git a/enterprise/app/views/fields/account_features_field/_form.html.erb b/enterprise/app/views/fields/account_features_field/_form.html.erb
index 6c3b33ae9..ffdd33091 100644
--- a/enterprise/app/views/fields/account_features_field/_form.html.erb
+++ b/enterprise/app/views/fields/account_features_field/_form.html.erb
@@ -9,7 +9,7 @@
       <% feature_key, display_name = key_array %>
       <div class="flex items-center justify-between p-3 bg-white rounded-lg shadow-sm outline outline-1 outline-n-container">
         <span class="text-sm text-slate-700"><%= display_name %></span>
-        <span><%= check_box "enabled_features", "feature_#{feature_key}", { checked: val, class: "h-4 w-4 rounded border-slate-300 text-indigo-600 focus:ring-indigo-600" }, true, false %></span>
+        <span><%= check_box "enabled_features", "feature_#{feature_key}", { checked: val, class: "h-4 w-4 rounded border-slate-300 text-violet-600 focus:ring-violet-600" }, true, false %></span>
       </div>
     <% end %>
   </div>
@@ -27,7 +27,7 @@
           <span class="text-sm text-slate-700"><%= display_name %></span>
         </div>
         <% should_disable = ChatwootHub.pricing_plan == 'community' %>
-        <span><%= check_box "enabled_features", "feature_#{feature_key}", { checked: val, disabled: should_disable, class: "h-4 w-4 rounded border-slate-300 text-indigo-600 focus:ring-indigo-600" }, true, false %></span>
+        <span><%= check_box "enabled_features", "feature_#{feature_key}", { checked: val, disabled: should_disable, class: "h-4 w-4 rounded border-slate-300 text-violet-600 focus:ring-violet-600" }, true, false %></span>
       </div>
     <% end %>
   </div>
diff --git a/enterprise/app/views/fields/manually_managed_features_field/_form.html.erb b/enterprise/app/views/fields/manually_managed_features_field/_form.html.erb
index b84da3d5c..97b21090a 100644
--- a/enterprise/app/views/fields/manually_managed_features_field/_form.html.erb
+++ b/enterprise/app/views/fields/manually_managed_features_field/_form.html.erb
@@ -29,7 +29,7 @@
           <%= check_box_tag "account[manually_managed_features][]", 
                          feature_key, 
                          selected_features.include?(feature_key), 
-                         class: "h-4 w-4 rounded border-slate-300 text-indigo-600 focus:ring-indigo-600" %>
+                         class: "h-4 w-4 rounded border-slate-300 text-violet-600 focus:ring-violet-600" %>
         </span>
       </div>
     <% end %>
diff --git a/theme/colors.js b/theme/colors.js
index 67c20202a..52870e75b 100644
--- a/theme/colors.js
+++ b/theme/colors.js
@@ -102,187 +102,7 @@ export const colors = {
     800: violetDark.violet6,
     900: violet.violet12,
   },
-  primary: {
-    25: 'rgb(var(--color-primary-25) / <alpha-value>)',
-    50: 'rgb(var(--color-primary-50) / <alpha-value>)',
-    75: 'rgb(var(--color-primary-75) / <alpha-value>)',
-    100: 'rgb(var(--color-primary-100) / <alpha-value>)',
-    200: 'rgb(var(--color-primary-200) / <alpha-value>)',
-    300: 'rgb(var(--color-primary-300) / <alpha-value>)',
-    400: 'rgb(var(--color-primary-400) / <alpha-value>)',
-    500: 'rgb(var(--color-primary-500) / <alpha-value>)',
-    600: 'rgb(var(--color-primary-600) / <alpha-value>)',
-    700: 'rgb(var(--color-primary-700) / <alpha-value>)',
-    800: 'rgb(var(--color-primary-800) / <alpha-value>)',
-    900: 'rgb(var(--color-primary-900) / <alpha-value>)',
-  },
-  ash: {
-    25: 'rgb(var(--color-ash-25) / <alpha-value>)',
-    50: 'rgb(var(--color-ash-50) / <alpha-value>)',
-    75: 'rgb(var(--color-ash-75) / <alpha-value>)',
-    100: 'rgb(var(--color-ash-100) / <alpha-value>)',
-    200: 'rgb(var(--color-ash-200) / <alpha-value>)',
-    300: 'rgb(var(--color-ash-300) / <alpha-value>)',
-    400: 'rgb(var(--color-ash-400) / <alpha-value>)',
-    500: 'rgb(var(--color-ash-500) / <alpha-value>)',
-    600: 'rgb(var(--color-ash-600) / <alpha-value>)',
-    700: 'rgb(var(--color-ash-700) / <alpha-value>)',
-    800: 'rgb(var(--color-ash-800) / <alpha-value>)',
-    900: 'rgb(var(--color-ash-900) / <alpha-value>)',
-  },
-  teal: {
-    25: 'rgb(var(--color-teal-25) / <alpha-value>)',
-    50: 'rgb(var(--color-teal-50) / <alpha-value>)',
-    100: 'rgb(var(--color-teal-100) / <alpha-value>)',
-    200: 'rgb(var(--color-teal-200) / <alpha-value>)',
-    300: 'rgb(var(--color-teal-300) / <alpha-value>)',
-    400: 'rgb(var(--color-teal-400) / <alpha-value>)',
-    500: 'rgb(var(--color-teal-500) / <alpha-value>)',
-    600: 'rgb(var(--color-teal-600) / <alpha-value>)',
-    700: 'rgb(var(--color-teal-700) / <alpha-value>)',
-    800: 'rgb(var(--color-teal-800) / <alpha-value>)',
-    900: 'rgb(var(--color-teal-900) / <alpha-value>)',
-  },
-  amber: {
-    25: 'rgb(var(--color-amber-25) / <alpha-value>)',
-    50: 'rgb(var(--color-amber-50) / <alpha-value>)',
-    75: 'rgb(var(--color-amber-75) / <alpha-value>)',
-    100: 'rgb(var(--color-amber-100) / <alpha-value>)',
-    200: 'rgb(var(--color-amber-200) / <alpha-value>)',
-    300: 'rgb(var(--color-amber-300) / <alpha-value>)',
-    400: 'rgb(var(--color-amber-400) / <alpha-value>)',
-    500: 'rgb(var(--color-amber-500) / <alpha-value>)',
-    600: 'rgb(var(--color-amber-600) / <alpha-value>)',
-    700: 'rgb(var(--color-amber-700) / <alpha-value>)',
-    800: 'rgb(var(--color-amber-800) / <alpha-value>)',
-    900: 'rgb(var(--color-amber-900) / <alpha-value>)',
-  },
-  ruby: {
-    25: 'rgb(var(--color-ruby-25) / <alpha-value>)',
-    50: 'rgb(var(--color-ruby-50) / <alpha-value>)',
-    75: 'rgb(var(--color-ruby-75) / <alpha-value>)',
-    100: 'rgb(var(--color-ruby-100) / <alpha-value>)',
-    200: 'rgb(var(--color-ruby-200) / <alpha-value>)',
-    300: 'rgb(var(--color-ruby-300) / <alpha-value>)',
-    400: 'rgb(var(--color-ruby-400) / <alpha-value>)',
-    500: 'rgb(var(--color-ruby-500) / <alpha-value>)',
-    600: 'rgb(var(--color-ruby-600) / <alpha-value>)',
-    700: 'rgb(var(--color-ruby-700) / <alpha-value>)',
-    800: 'rgb(var(--color-ruby-800) / <alpha-value>)',
-    900: 'rgb(var(--color-ruby-900) / <alpha-value>)',
-  },
-  grass: {
-    25: 'rgb(var(--color-green-25) / <alpha-value>)',
-    50: 'rgb(var(--color-green-50) / <alpha-value>)',
-    75: 'rgb(var(--color-green-75) / <alpha-value>)',
-    100: 'rgb(var(--color-green-100) / <alpha-value>)',
-    200: 'rgb(var(--color-green-200) / <alpha-value>)',
-    300: 'rgb(var(--color-green-300) / <alpha-value>)',
-    400: 'rgb(var(--color-green-400) / <alpha-value>)',
-    500: 'rgb(var(--color-green-500) / <alpha-value>)',
-    600: 'rgb(var(--color-green-600) / <alpha-value>)',
-    700: 'rgb(var(--color-green-700) / <alpha-value>)',
-    800: 'rgb(var(--color-green-800) / <alpha-value>)',
-    900: 'rgb(var(--color-green-900) / <alpha-value>)',
-  },
-  mint: {
-    25: 'rgb(var(--color-mint-25) / <alpha-value>)',
-    50: 'rgb(var(--color-mint-50) / <alpha-value>)',
-    75: 'rgb(var(--color-mint-75) / <alpha-value>)',
-    100: 'rgb(var(--color-mint-100) / <alpha-value>)',
-    200: 'rgb(var(--color-mint-200) / <alpha-value>)',
-    300: 'rgb(var(--color-mint-300) / <alpha-value>)',
-    400: 'rgb(var(--color-mint-400) / <alpha-value>)',
-    500: 'rgb(var(--color-mint-500) / <alpha-value>)',
-    600: 'rgb(var(--color-mint-600) / <alpha-value>)',
-    700: 'rgb(var(--color-mint-700) / <alpha-value>)',
-    800: 'rgb(var(--color-mint-800) / <alpha-value>)',
-    900: 'rgb(var(--color-mint-900) / <alpha-value>)',
-  },
-  sky: {
-    25: 'rgb(var(--color-sky-25) / <alpha-value>)',
-    50: 'rgb(var(--color-sky-50) / <alpha-value>)',
-    75: 'rgb(var(--color-sky-75) / <alpha-value>)',
-    100: 'rgb(var(--color-sky-100) / <alpha-value>)',
-    200: 'rgb(var(--color-sky-200) / <alpha-value>)',
-    300: 'rgb(var(--color-sky-300) / <alpha-value>)',
-    400: 'rgb(var(--color-sky-400) / <alpha-value>)',
-    500: 'rgb(var(--color-sky-500) / <alpha-value>)',
-    600: 'rgb(var(--color-sky-600) / <alpha-value>)',
-    700: 'rgb(var(--color-sky-700) / <alpha-value>)',
-    800: 'rgb(var(--color-sky-800) / <alpha-value>)',
-    900: 'rgb(var(--color-sky-900) / <alpha-value>)',
-  },
-  indigo: {
-    25: 'rgb(var(--color-indigo-25) / <alpha-value>)',
-    50: 'rgb(var(--color-indigo-50) / <alpha-value>)',
-    75: 'rgb(var(--color-indigo-75) / <alpha-value>)',
-    100: 'rgb(var(--color-indigo-100) / <alpha-value>)',
-    200: 'rgb(var(--color-indigo-200) / <alpha-value>)',
-    300: 'rgb(var(--color-indigo-300) / <alpha-value>)',
-    400: 'rgb(var(--color-indigo-400) / <alpha-value>)',
-    500: 'rgb(var(--color-indigo-500) / <alpha-value>)',
-    600: 'rgb(var(--color-indigo-600) / <alpha-value>)',
-    700: 'rgb(var(--color-indigo-700) / <alpha-value>)',
-    800: 'rgb(var(--color-indigo-800) / <alpha-value>)',
-    900: 'rgb(var(--color-indigo-900) / <alpha-value>)',
-  },
-  iris: {
-    25: 'rgb(var(--color-iris-25) / <alpha-value>)',
-    50: 'rgb(var(--color-iris-50) / <alpha-value>)',
-    75: 'rgb(var(--color-iris-75) / <alpha-value>)',
-    100: 'rgb(var(--color-iris-100) / <alpha-value>)',
-    200: 'rgb(var(--color-iris-200) / <alpha-value>)',
-    300: 'rgb(var(--color-iris-300) / <alpha-value>)',
-    400: 'rgb(var(--color-iris-400) / <alpha-value>)',
-    500: 'rgb(var(--color-iris-500) / <alpha-value>)',
-    600: 'rgb(var(--color-iris-600) / <alpha-value>)',
-    700: 'rgb(var(--color-iris-700) / <alpha-value>)',
-    800: 'rgb(var(--color-iris-800) / <alpha-value>)',
-    900: 'rgb(var(--color-iris-900) / <alpha-value>)',
-  },
-  purple: {
-    25: 'rgb(var(--color-violet-25) / <alpha-value>)',
-    50: 'rgb(var(--color-violet-50) / <alpha-value>)',
-    75: 'rgb(var(--color-violet-75) / <alpha-value>)',
-    100: 'rgb(var(--color-violet-100) / <alpha-value>)',
-    200: 'rgb(var(--color-violet-200) / <alpha-value>)',
-    300: 'rgb(var(--color-violet-300) / <alpha-value>)',
-    400: 'rgb(var(--color-violet-400) / <alpha-value>)',
-    500: 'rgb(var(--color-violet-500) / <alpha-value>)',
-    600: 'rgb(var(--color-violet-600) / <alpha-value>)',
-    700: 'rgb(var(--color-violet-700) / <alpha-value>)',
-    800: 'rgb(var(--color-violet-800) / <alpha-value>)',
-    900: 'rgb(var(--color-violet-900) / <alpha-value>)',
-  },
-  pink: {
-    25: 'rgb(var(--color-pink-25) / <alpha-value>)',
-    50: 'rgb(var(--color-pink-50) / <alpha-value>)',
-    75: 'rgb(var(--color-pink-75) / <alpha-value>)',
-    100: 'rgb(var(--color-pink-100) / <alpha-value>)',
-    200: 'rgb(var(--color-pink-200) / <alpha-value>)',
-    300: 'rgb(var(--color-pink-300) / <alpha-value>)',
-    400: 'rgb(var(--color-pink-400) / <alpha-value>)',
-    500: 'rgb(var(--color-pink-500) / <alpha-value>)',
-    600: 'rgb(var(--color-pink-600) / <alpha-value>)',
-    700: 'rgb(var(--color-pink-700) / <alpha-value>)',
-    800: 'rgb(var(--color-pink-800) / <alpha-value>)',
-    900: 'rgb(var(--color-pink-900) / <alpha-value>)',
-  },
-  orange: {
-    25: 'rgb(var(--color-orange-25) / <alpha-value>)',
-    50: 'rgb(var(--color-orange-50) / <alpha-value>)',
-    75: 'rgb(var(--color-orange-75) / <alpha-value>)',
-    100: 'rgb(var(--color-orange-100) / <alpha-value>)',
-    200: 'rgb(var(--color-orange-200) / <alpha-value>)',
-    300: 'rgb(var(--color-orange-300) / <alpha-value>)',
-    400: 'rgb(var(--color-orange-400) / <alpha-value>)',
-    500: 'rgb(var(--color-orange-500) / <alpha-value>)',
-    600: 'rgb(var(--color-orange-600) / <alpha-value>)',
-    700: 'rgb(var(--color-orange-700) / <alpha-value>)',
-    800: 'rgb(var(--color-orange-800) / <alpha-value>)',
-    900: 'rgb(var(--color-orange-900) / <alpha-value>)',
-  },
+
   // next design system color
   n: {
     slate: {

From d1c9af260c67df081b38aad6957a35dbf37f9eea Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Tue, 1 Jul 2025 10:52:40 +0530
Subject: [PATCH 10/31] fix: Unread badge style issue (#11846)

- fix issue with unread badges
---
 .../components/widgets/conversation/MessagesView.vue         | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/app/javascript/dashboard/components/widgets/conversation/MessagesView.vue b/app/javascript/dashboard/components/widgets/conversation/MessagesView.vue
index 0ff68f79b..1f850cd74 100644
--- a/app/javascript/dashboard/components/widgets/conversation/MessagesView.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/MessagesView.vue
@@ -477,7 +477,10 @@ export default {
         </transition>
       </template>
       <template #unreadBadge>
-        <li v-show="unreadMessageCount != 0">
+        <li
+          v-show="unreadMessageCount != 0"
+          class="list-none flex justify-center items-center"
+        >
           <span
             class="shadow-lg rounded-full bg-n-brand text-white text-xs font-medium my-2.5 mx-auto px-2.5 py-1.5"
           >

From 2573f37d903c6f387e29d294e36d946408f94861 Mon Sep 17 00:00:00 2001
From: Muhsin Keloth <muhsinkeramam@gmail.com>
Date: Tue, 1 Jul 2025 12:04:35 +0530
Subject: [PATCH 11/31] chore: Replace `content` with `outgoing_content` in
 webhook data (#11829)

The API channels don't receive CSAT survey URLs in webhook payloads since `webhook_data` uses content instead of outgoing_content.
---
 app/models/message.rb       |  2 +-
 spec/models/message_spec.rb | 17 +++++++++++++++++
 2 files changed, 18 insertions(+), 1 deletion(-)

diff --git a/app/models/message.rb b/app/models/message.rb
index d4036416e..cc04a088e 100644
--- a/app/models/message.rb
+++ b/app/models/message.rb
@@ -168,7 +168,7 @@ class Message < ApplicationRecord
       additional_attributes: additional_attributes,
       content_attributes: content_attributes,
       content_type: content_type,
-      content: content,
+      content: outgoing_content,
       conversation: conversation.webhook_data,
       created_at: created_at,
       id: id,
diff --git a/spec/models/message_spec.rb b/spec/models/message_spec.rb
index 3bf64a231..6de36a55e 100644
--- a/spec/models/message_spec.rb
+++ b/spec/models/message_spec.rb
@@ -267,6 +267,23 @@ RSpec.describe Message do
       message = create(:message)
       expect(message.webhook_data.key?(:attachments)).to be false
     end
+
+    it 'uses outgoing_content for webhook content' do
+      message = create(:message, content: 'Test content')
+      expect(message).to receive(:outgoing_content).and_return('Outgoing test content')
+
+      webhook_data = message.webhook_data
+      expect(webhook_data[:content]).to eq('Outgoing test content')
+    end
+
+    it 'includes CSAT survey link in webhook content for input_csat messages' do
+      inbox = create(:inbox, channel: create(:channel_api))
+      conversation = create(:conversation, inbox: inbox)
+      message = create(:message, conversation: conversation, content_type: 'input_csat', content: 'Rate your experience')
+
+      expect(message.outgoing_content).to include('survey/responses/')
+      expect(message.webhook_data[:content]).to include('survey/responses/')
+    end
   end
 
   context 'when message is created' do

From 14ba73fc63f0d1f4cd68d246e32014776069b124 Mon Sep 17 00:00:00 2001
From: Muhsin Keloth <muhsinkeramam@gmail.com>
Date: Tue, 1 Jul 2025 13:31:02 +0530
Subject: [PATCH 12/31] fix: Revoke Linear OAuth token when integration is
 deleted (#11838)

When users delete the Linear integration from their Chatwoot dashboard,
the access token remains valid in Linear's system. This causes the
integration to still appear as connected in Linear's UI, even though
it's been removed from Chatwoot. Users need to manually disconnect from
Linear's side to fully remove the integration.


https://www.loom.com/share/5c102cbdf02e49bcb7a6fa6d409b531a?sid=0c664250-c867-4fc8-b44d-e1c1165337a7
---
 .../v1/accounts/integrations/linear_controller.rb    | 12 ++++++++++++
 lib/linear.rb                                        |  9 +++++++++
 .../accounts/integrations/linear_controller_spec.rb  |  6 ++++++
 3 files changed, 27 insertions(+)

diff --git a/app/controllers/api/v1/accounts/integrations/linear_controller.rb b/app/controllers/api/v1/accounts/integrations/linear_controller.rb
index bfdfff058..c121ec9a4 100644
--- a/app/controllers/api/v1/accounts/integrations/linear_controller.rb
+++ b/app/controllers/api/v1/accounts/integrations/linear_controller.rb
@@ -3,6 +3,7 @@ class Api::V1::Accounts::Integrations::LinearController < Api::V1::Accounts::Bas
   before_action :fetch_hook, only: [:destroy]
 
   def destroy
+    revoke_linear_token
     @hook.destroy!
     head :ok
   end
@@ -120,4 +121,15 @@ class Api::V1::Accounts::Integrations::LinearController < Api::V1::Accounts::Bas
   def fetch_hook
     @hook = Integrations::Hook.where(account: Current.account).find_by(app_id: 'linear')
   end
+
+  def revoke_linear_token
+    return unless @hook&.access_token
+
+    begin
+      linear_client = Linear.new(@hook.access_token)
+      linear_client.revoke_token
+    rescue StandardError => e
+      Rails.logger.error "Failed to revoke Linear token: #{e.message}"
+    end
+  end
 end
diff --git a/lib/linear.rb b/lib/linear.rb
index 8bf967fc3..d96be1b5d 100644
--- a/lib/linear.rb
+++ b/lib/linear.rb
@@ -1,5 +1,6 @@
 class Linear
   BASE_URL = 'https://api.linear.app/graphql'.freeze
+  REVOKE_URL = 'https://api.linear.app/oauth/revoke'.freeze
   PRIORITY_LEVELS = (0..4).to_a
 
   def initialize(access_token)
@@ -86,6 +87,14 @@ class Linear
     process_response(response)
   end
 
+  def revoke_token
+    response = HTTParty.post(
+      REVOKE_URL,
+      headers: { 'Authorization' => "Bearer #{@access_token}", 'Content-Type' => 'application/json' }
+    )
+    response.success?
+  end
+
   private
 
   def validate_team_and_title(params)
diff --git a/spec/controllers/api/v1/accounts/integrations/linear_controller_spec.rb b/spec/controllers/api/v1/accounts/integrations/linear_controller_spec.rb
index 851c5dbaf..995b7c879 100644
--- a/spec/controllers/api/v1/accounts/integrations/linear_controller_spec.rb
+++ b/spec/controllers/api/v1/accounts/integrations/linear_controller_spec.rb
@@ -14,6 +14,12 @@ RSpec.describe 'Linear Integration API', type: :request do
 
   describe 'DELETE /api/v1/accounts/:account_id/integrations/linear' do
     it 'deletes the linear integration' do
+      # Stub the HTTP call to Linear's revoke endpoint
+      allow(HTTParty).to receive(:post).with(
+        'https://api.linear.app/oauth/revoke',
+        anything
+      ).and_return(instance_double(HTTParty::Response, success?: true))
+
       delete "/api/v1/accounts/#{account.id}/integrations/linear",
              headers: agent.create_new_auth_token,
              as: :json

From 01acbe3cda18056c8a6087468e16eb275b7187be Mon Sep 17 00:00:00 2001
From: Muhsin Keloth <muhsinkeramam@gmail.com>
Date: Tue, 1 Jul 2025 16:49:26 +0530
Subject: [PATCH 13/31] feat: Add user attribution to Linear integration with
 actor authorization (#11774)

- Add `actor=app` parameter to Linear OAuth authorization URL for
consistent app-level authorization
https://linear.app/developers/oauth-actor-authorization
- Implement user attribution for Linear issue creation and linking using
`createAsUser` and `displayIconUrl` parameters
- Enhance Linear integration to properly attribute actions to specific
Chatwoot agents

**Note**
- The displayIconUrl parameter is being sent correctly to Linear's
GraphQL API (verified through testing), but there is an issues with icon
is not attaching properly.
- We might need to disconnect the integration connect again.
---
 .../integrations/linear_controller.rb         |  4 +-
 app/models/integrations/app.rb                |  3 +-
 lib/integrations/linear/processor_service.rb  |  8 +--
 lib/linear.rb                                 | 57 +++++++++++----
 lib/linear/mutations.rb                       | 16 ++++-
 .../integrations/linear_controller_spec.rb    | 10 +--
 .../linear/processor_service_spec.rb          | 36 ++++++++--
 spec/lib/linear_spec.rb                       | 69 +++++++++++++++++++
 8 files changed, 168 insertions(+), 35 deletions(-)

diff --git a/app/controllers/api/v1/accounts/integrations/linear_controller.rb b/app/controllers/api/v1/accounts/integrations/linear_controller.rb
index c121ec9a4..eb6525bb1 100644
--- a/app/controllers/api/v1/accounts/integrations/linear_controller.rb
+++ b/app/controllers/api/v1/accounts/integrations/linear_controller.rb
@@ -28,7 +28,7 @@ class Api::V1::Accounts::Integrations::LinearController < Api::V1::Accounts::Bas
   end
 
   def create_issue
-    issue = linear_processor_service.create_issue(permitted_params)
+    issue = linear_processor_service.create_issue(permitted_params, Current.user)
     if issue[:error]
       render json: { error: issue[:error] }, status: :unprocessable_entity
     else
@@ -45,7 +45,7 @@ class Api::V1::Accounts::Integrations::LinearController < Api::V1::Accounts::Bas
   def link_issue
     issue_id = permitted_params[:issue_id]
     title = permitted_params[:title]
-    issue = linear_processor_service.link_issue(conversation_link, issue_id, title)
+    issue = linear_processor_service.link_issue(conversation_link, issue_id, title, Current.user)
     if issue[:error]
       render json: { error: issue[:error] }, status: :unprocessable_entity
     else
diff --git a/app/models/integrations/app.rb b/app/models/integrations/app.rb
index 3b5cd821a..6a1378f1e 100644
--- a/app/models/integrations/app.rb
+++ b/app/models/integrations/app.rb
@@ -73,7 +73,8 @@ class Integrations::App
       "redirect_uri=#{self.class.linear_integration_url}",
       "state=#{encode_state}",
       'scope=read,write',
-      'prompt=consent'
+      'prompt=consent',
+      'actor=app'
     ].join('&')
   end
 
diff --git a/lib/integrations/linear/processor_service.rb b/lib/integrations/linear/processor_service.rb
index a53d17f4c..a3447b79e 100644
--- a/lib/integrations/linear/processor_service.rb
+++ b/lib/integrations/linear/processor_service.rb
@@ -22,8 +22,8 @@ class Integrations::Linear::ProcessorService
     }
   end
 
-  def create_issue(params)
-    response = linear_client.create_issue(params)
+  def create_issue(params, user = nil)
+    response = linear_client.create_issue(params, user)
     return response if response[:error]
 
     {
@@ -33,8 +33,8 @@ class Integrations::Linear::ProcessorService
     }
   end
 
-  def link_issue(link, issue_id, title)
-    response = linear_client.link_issue(link, issue_id, title)
+  def link_issue(link, issue_id, title, user = nil)
+    response = linear_client.link_issue(link, issue_id, title, user)
     return response if response[:error]
 
     {
diff --git a/lib/linear.rb b/lib/linear.rb
index d96be1b5d..2ffcf8cca 100644
--- a/lib/linear.rb
+++ b/lib/linear.rb
@@ -46,33 +46,24 @@ class Linear
     process_response(response)
   end
 
-  def create_issue(params)
+  def create_issue(params, user = nil)
     validate_team_and_title(params)
     validate_priority(params[:priority])
     validate_label_ids(params[:label_ids])
 
-    variables = {
-      title: params[:title],
-      teamId: params[:team_id],
-      description: params[:description],
-      assigneeId: params[:assignee_id],
-      priority: params[:priority],
-      labelIds: params[:label_ids],
-      projectId: params[:project_id],
-      stateId: params[:state_id]
-    }.compact
+    variables = build_issue_variables(params, user)
     mutation = Linear::Mutations.issue_create(variables)
     response = post({ query: mutation })
     process_response(response)
   end
 
-  def link_issue(link, issue_id, title)
+  def link_issue(link, issue_id, title, user = nil)
     raise ArgumentError, 'Missing link' if link.blank?
     raise ArgumentError, 'Missing issue id' if issue_id.blank?
 
-    payload = {
-      query: Linear::Mutations.issue_link(issue_id, link, title)
-    }
+    link_params = build_link_params(issue_id, link, title, user)
+    payload = { query: Linear::Mutations.issue_link(link_params) }
+
     response = post(payload)
     process_response(response)
   end
@@ -97,6 +88,42 @@ class Linear
 
   private
 
+  def build_issue_variables(params, user)
+    variables = {
+      title: params[:title],
+      teamId: params[:team_id],
+      description: params[:description],
+      assigneeId: params[:assignee_id],
+      priority: params[:priority],
+      labelIds: params[:label_ids],
+      projectId: params[:project_id],
+      stateId: params[:state_id]
+    }.compact
+
+    # Add user attribution if available
+    if user&.name.present?
+      variables[:createAsUser] = user.name
+      variables[:displayIconUrl] = user.avatar_url if user.avatar_url.present?
+    end
+
+    variables
+  end
+
+  def build_link_params(issue_id, link, title, user)
+    params = {
+      issue_id: issue_id,
+      link: link,
+      title: title
+    }
+
+    if user.present?
+      params[:user_name] = user.name if user.name.present?
+      params[:user_avatar_url] = user.avatar_url if user.avatar_url.present?
+    end
+
+    params
+  end
+
   def validate_team_and_title(params)
     raise ArgumentError, 'Missing team id' if params[:team_id].blank?
     raise ArgumentError, 'Missing title' if params[:title].blank?
diff --git a/lib/linear/mutations.rb b/lib/linear/mutations.rb
index 04774c705..5f34e602b 100644
--- a/lib/linear/mutations.rb
+++ b/lib/linear/mutations.rb
@@ -32,10 +32,22 @@ module Linear::Mutations
     GRAPHQL
   end
 
-  def self.issue_link(issue_id, link, title)
+  def self.issue_link(params)
+    issue_id = params[:issue_id]
+    link = params[:link]
+    title = params[:title]
+    user_name = params[:user_name]
+    user_avatar_url = params[:user_avatar_url]
+
+    user_params = []
+    user_params << "createAsUser: #{graphql_value(user_name)}" if user_name.present?
+    user_params << "displayIconUrl: #{graphql_value(user_avatar_url)}" if user_avatar_url.present?
+
+    user_params_str = user_params.any? ? ", #{user_params.join(', ')}" : ''
+
     <<~GRAPHQL
       mutation {
-        attachmentLinkURL(url: "#{link}", issueId: "#{issue_id}", title: "#{title}") {
+        attachmentLinkURL(url: "#{link}", issueId: "#{issue_id}", title: "#{title}"#{user_params_str}) {
           success
           attachment {
             id
diff --git a/spec/controllers/api/v1/accounts/integrations/linear_controller_spec.rb b/spec/controllers/api/v1/accounts/integrations/linear_controller_spec.rb
index 995b7c879..5f512b2bd 100644
--- a/spec/controllers/api/v1/accounts/integrations/linear_controller_spec.rb
+++ b/spec/controllers/api/v1/accounts/integrations/linear_controller_spec.rb
@@ -119,7 +119,7 @@ RSpec.describe 'Linear Integration API', type: :request do
         let(:created_issue) { { data: { identifier: 'ENG-123', title: 'Sample Issue' } } }
 
         it 'returns the created issue' do
-          allow(processor_service).to receive(:create_issue).with(issue_params.stringify_keys).and_return(created_issue)
+          allow(processor_service).to receive(:create_issue).with(issue_params.stringify_keys, agent).and_return(created_issue)
 
           post "/api/v1/accounts/#{account.id}/integrations/linear/create_issue",
                params: issue_params,
@@ -131,7 +131,7 @@ RSpec.describe 'Linear Integration API', type: :request do
         end
 
         it 'creates activity message when conversation is provided' do
-          allow(processor_service).to receive(:create_issue).with(issue_params.stringify_keys).and_return(created_issue)
+          allow(processor_service).to receive(:create_issue).with(issue_params.stringify_keys, agent).and_return(created_issue)
 
           expect do
             post "/api/v1/accounts/#{account.id}/integrations/linear/create_issue",
@@ -150,7 +150,7 @@ RSpec.describe 'Linear Integration API', type: :request do
 
       context 'when issue creation fails' do
         it 'returns error message and does not create activity message' do
-          allow(processor_service).to receive(:create_issue).with(issue_params.stringify_keys).and_return(error: 'error message')
+          allow(processor_service).to receive(:create_issue).with(issue_params.stringify_keys, agent).and_return(error: 'error message')
 
           expect do
             post "/api/v1/accounts/#{account.id}/integrations/linear/create_issue",
@@ -177,7 +177,7 @@ RSpec.describe 'Linear Integration API', type: :request do
         let(:linked_issue) { { data: { 'id' => 'issue1', 'link' => 'https://linear.app/issue1' } } }
 
         it 'returns the linked issue and creates activity message' do
-          allow(processor_service).to receive(:link_issue).with(link, issue_id, title).and_return(linked_issue)
+          allow(processor_service).to receive(:link_issue).with(link, issue_id, title, agent).and_return(linked_issue)
 
           expect do
             post "/api/v1/accounts/#{account.id}/integrations/linear/link_issue",
@@ -199,7 +199,7 @@ RSpec.describe 'Linear Integration API', type: :request do
 
       context 'when issue linking fails' do
         it 'returns error message and does not create activity message' do
-          allow(processor_service).to receive(:link_issue).with(link, issue_id, title).and_return(error: 'error message')
+          allow(processor_service).to receive(:link_issue).with(link, issue_id, title, agent).and_return(error: 'error message')
 
           expect do
             post "/api/v1/accounts/#{account.id}/integrations/linear/link_issue",
diff --git a/spec/lib/integrations/linear/processor_service_spec.rb b/spec/lib/integrations/linear/processor_service_spec.rb
index 8830e658e..9af9e08d3 100644
--- a/spec/lib/integrations/linear/processor_service_spec.rb
+++ b/spec/lib/integrations/linear/processor_service_spec.rb
@@ -80,6 +80,7 @@ describe Integrations::Linear::ProcessorService do
         label_ids: %w[bug]
       }
     end
+    let(:user) { instance_double(User, name: 'John Doe', avatar_url: 'https://example.com/avatar.jpg') }
     let(:issue_response) do
       {
         'issueCreate' => {
@@ -94,7 +95,7 @@ describe Integrations::Linear::ProcessorService do
 
     context 'when Linear client returns valid data' do
       it 'returns parsed issue data with identifier' do
-        allow(linear_client).to receive(:create_issue).with(params).and_return(issue_response)
+        allow(linear_client).to receive(:create_issue).with(params, nil).and_return(issue_response)
         result = service.create_issue(params)
         expect(result).to eq({
                                data: {
@@ -104,13 +105,27 @@ describe Integrations::Linear::ProcessorService do
                                }
                              })
       end
+
+      context 'when user is provided' do
+        it 'passes user to Linear client' do
+          allow(linear_client).to receive(:create_issue).with(params, user).and_return(issue_response)
+          result = service.create_issue(params, user)
+          expect(result).to eq({
+                                 data: {
+                                   id: 'issue1',
+                                   title: 'Issue title',
+                                   identifier: 'ENG-123'
+                                 }
+                               })
+        end
+      end
     end
 
     context 'when Linear client returns an error' do
       let(:error_response) { { error: 'Some error message' } }
 
       it 'returns the error' do
-        allow(linear_client).to receive(:create_issue).with(params).and_return(error_response)
+        allow(linear_client).to receive(:create_issue).with(params, nil).and_return(error_response)
         result = service.create_issue(params)
         expect(result).to eq(error_response)
       end
@@ -121,22 +136,31 @@ describe Integrations::Linear::ProcessorService do
     let(:link) { 'https://example.com' }
     let(:issue_id) { 'issue1' }
     let(:title) { 'Title' }
+    let(:user) { instance_double(User, name: 'John Doe', avatar_url: 'https://example.com/avatar.jpg') }
     let(:link_issue_response) { { id: issue_id, link: link, 'attachmentLinkURL': { 'attachment': { 'id': 'attachment1' } } } }
     let(:link_response) { { data: { id: issue_id, link: link, link_id: 'attachment1' } } }
 
     context 'when Linear client returns valid data' do
       it 'returns parsed link data' do
-        allow(linear_client).to receive(:link_issue).with(link, issue_id, title).and_return(link_issue_response)
+        allow(linear_client).to receive(:link_issue).with(link, issue_id, title, nil).and_return(link_issue_response)
         result = service.link_issue(link, issue_id, title)
         expect(result).to eq(link_response)
       end
+
+      context 'when user is provided' do
+        it 'passes user to Linear client' do
+          allow(linear_client).to receive(:link_issue).with(link, issue_id, title, user).and_return(link_issue_response)
+          result = service.link_issue(link, issue_id, title, user)
+          expect(result).to eq(link_response)
+        end
+      end
     end
 
     context 'when Linear client returns an error' do
       let(:error_response) { { error: 'Some error message' } }
 
       it 'returns the error' do
-        allow(linear_client).to receive(:link_issue).with(link, issue_id, title).and_return(error_response)
+        allow(linear_client).to receive(:link_issue).with(link, issue_id, title, nil).and_return(error_response)
         result = service.link_issue(link, issue_id, title)
         expect(result).to eq(error_response)
       end
@@ -237,7 +261,7 @@ describe Integrations::Linear::ProcessorService do
           }
         }
 
-        allow(linear_client).to receive(:create_issue).with(params).and_return(response)
+        allow(linear_client).to receive(:create_issue).with(params, nil).and_return(response)
         result = service.create_issue(params)
 
         expect(result[:data]).to have_key(:identifier)
@@ -256,7 +280,7 @@ describe Integrations::Linear::ProcessorService do
           }
         }
 
-        allow(linear_client).to receive(:link_issue).with(link, issue_id, title).and_return(response)
+        allow(linear_client).to receive(:link_issue).with(link, issue_id, title, nil).and_return(response)
         result = service.link_issue(link, issue_id, title)
 
         expect(result[:data][:id]).to eq(issue_id)
diff --git a/spec/lib/linear_spec.rb b/spec/lib/linear_spec.rb
index 2ebaec1a8..e15f64382 100644
--- a/spec/lib/linear_spec.rb
+++ b/spec/lib/linear_spec.rb
@@ -91,6 +91,7 @@ describe Linear do
         label_ids: ['bug']
       }
     end
+    let(:user) { instance_double(User, name: 'John Doe', avatar_url: 'https://example.com/avatar.jpg') }
 
     context 'when the API response is success' do
       before do
@@ -103,6 +104,34 @@ describe Linear do
         expect(response).to eq({ 'issueCreate' => { 'id' => 'issue1', 'title' => 'Title' } })
       end
 
+      context 'when user is provided' do
+        it 'includes user attribution in the request' do
+          allow(linear_client).to receive(:post) do |payload|
+            expect(payload[:query]).to include('createAsUser: "John Doe"')
+            expect(payload[:query]).to include('displayIconUrl: "https://example.com/avatar.jpg"')
+            instance_double(HTTParty::Response, success?: true,
+                                                parsed_response: { 'data' => { 'issueCreate' => { 'id' => 'issue1', 'title' => 'Title' } } })
+          end
+
+          linear_client.create_issue(params, user)
+        end
+      end
+
+      context 'when user has no avatar' do
+        let(:user_no_avatar) { instance_double(User, name: 'Jane Doe', avatar_url: '') }
+
+        it 'includes only user name in the request' do
+          allow(linear_client).to receive(:post) do |payload|
+            expect(payload[:query]).to include('createAsUser: "Jane Doe"')
+            expect(payload[:query]).not_to include('displayIconUrl')
+            instance_double(HTTParty::Response, success?: true,
+                                                parsed_response: { 'data' => { 'issueCreate' => { 'id' => 'issue1', 'title' => 'Title' } } })
+          end
+
+          linear_client.create_issue(params, user_no_avatar)
+        end
+      end
+
       context 'when the priority is invalid' do
         let(:params) { { title: 'Title', team_id: 'team1', priority: 5 } }
 
@@ -182,6 +211,7 @@ describe Linear do
     let(:link) { 'https://example.com' }
     let(:issue_id) { 'issue1' }
     let(:title) { 'Title' }
+    let(:user) { instance_double(User, name: 'John Doe', avatar_url: 'https://example.com/avatar.jpg') }
 
     context 'when the API response is success' do
       before do
@@ -194,6 +224,45 @@ describe Linear do
         expect(response).to eq({ 'attachmentLinkURL' => { 'id' => 'attachment1' } })
       end
 
+      context 'when user is provided' do
+        it 'includes user attribution in the request' do
+          expected_params = {
+            issue_id: issue_id,
+            link: link,
+            title: title,
+            user_name: 'John Doe',
+            user_avatar_url: 'https://example.com/avatar.jpg'
+          }
+
+          expect(Linear::Mutations).to receive(:issue_link).with(expected_params).and_call_original
+          allow(linear_client).to receive(:post).and_return(
+            instance_double(HTTParty::Response, success?: true, parsed_response: { 'data' => { 'attachmentLinkURL' => { 'id' => 'attachment1' } } })
+          )
+
+          linear_client.link_issue(link, issue_id, title, user)
+        end
+      end
+
+      context 'when user has no avatar' do
+        let(:user_no_avatar) { instance_double(User, name: 'Jane Doe', avatar_url: '') }
+
+        it 'includes only user name in the request' do
+          expected_params = {
+            issue_id: issue_id,
+            link: link,
+            title: title,
+            user_name: 'Jane Doe'
+          }
+
+          expect(Linear::Mutations).to receive(:issue_link).with(expected_params).and_call_original
+          allow(linear_client).to receive(:post).and_return(
+            instance_double(HTTParty::Response, success?: true, parsed_response: { 'data' => { 'attachmentLinkURL' => { 'id' => 'attachment1' } } })
+          )
+
+          linear_client.link_issue(link, issue_id, title, user_no_avatar)
+        end
+      end
+
       context 'when the link is missing' do
         let(:link) { '' }
 

From 20dc4f169c4b38d319171b1aebecf1b7e95cd946 Mon Sep 17 00:00:00 2001
From: Vishnu Narayanan <iamwishnu@gmail.com>
Date: Wed, 2 Jul 2025 03:40:39 +0530
Subject: [PATCH 14/31] fix: Do not enforce max_limits if inbox_auto_assignment
 is disabled (#11849)

# Pull Request Template

## Description

The `auto_assignment` max_limits were being enforced even if the inbox
level `auto_assign` feature was disabled. This was because the
enterprise method was not verifying the feature status before returning
the available agents.

## Type of change

Please delete options that are not relevant.

- [x] Bug fix (non-breaking change which fixes an issue)


## How Has This Been Tested?
- Tested locally
- Added Specs

## Checklist:

- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my code
- [x] I have commented on my code, particularly in hard-to-understand
areas
- [x] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [x] I have added tests that prove my fix is effective or that my
feature works
- [x] New and existing unit tests pass locally with my changes
- [x] Any dependent changes have been merged and published in downstream
modules
---
 enterprise/app/models/enterprise/inbox.rb   |  2 ++
 spec/enterprise/models/conversation_spec.rb | 31 +++++++++++++++++++++
 2 files changed, 33 insertions(+)

diff --git a/enterprise/app/models/enterprise/inbox.rb b/enterprise/app/models/enterprise/inbox.rb
index 4cd627e41..0ae21ce00 100644
--- a/enterprise/app/models/enterprise/inbox.rb
+++ b/enterprise/app/models/enterprise/inbox.rb
@@ -1,5 +1,7 @@
 module Enterprise::Inbox
   def member_ids_with_assignment_capacity
+    return super unless enable_auto_assignment?
+
     max_assignment_limit = auto_assignment_config['max_assignment_limit']
     overloaded_agent_ids = max_assignment_limit.present? ? get_agent_ids_over_assignment_limit(max_assignment_limit) : []
     super - overloaded_agent_ids
diff --git a/spec/enterprise/models/conversation_spec.rb b/spec/enterprise/models/conversation_spec.rb
index 9585274dd..50d9ee993 100644
--- a/spec/enterprise/models/conversation_spec.rb
+++ b/spec/enterprise/models/conversation_spec.rb
@@ -74,4 +74,35 @@ RSpec.describe Conversation, type: :model do
       end
     end
   end
+
+  describe 'assignment capacity limits' do
+    describe 'team assignment with inbox auto-assignment disabled' do
+      let(:account) { create(:account) }
+      let(:inbox) { create(:inbox, account: account, enable_auto_assignment: false, auto_assignment_config: { max_assignment_limit: 1 }) }
+      let(:team) { create(:team, account: account, allow_auto_assign: true) }
+      let!(:agent1) { create(:user, account: account, role: :agent, auto_offline: false) }
+      let!(:agent2) { create(:user, account: account, role: :agent, auto_offline: false) }
+
+      before do
+        create(:inbox_member, inbox: inbox, user: agent1)
+        create(:inbox_member, inbox: inbox, user: agent2)
+        create(:team_member, team: team, user: agent1)
+        create(:team_member, team: team, user: agent2)
+        # Both agents are over the limit (simulate by assigning open conversations)
+        create_list(:conversation, 2, inbox: inbox, assignee: agent1, status: :open)
+        create_list(:conversation, 2, inbox: inbox, assignee: agent2, status: :open)
+      end
+
+      it 'does not enforce max_assignment_limit for team assignment when inbox auto-assignment is disabled' do
+        conversation = create(:conversation, inbox: inbox, account: account, assignee: nil, status: :open)
+
+        # Assign to team to trigger the assignment logic
+        conversation.update!(team: team)
+
+        # Should assign to a team member even if they are over the limit
+        expect(conversation.reload.assignee).to be_present
+        expect([agent1, agent2]).to include(conversation.reload.assignee)
+      end
+    end
+  end
 end

From ef591f848aa3a886773b8fb64f3acf6984a39f88 Mon Sep 17 00:00:00 2001
From: Pranav <pranav@chatwoot.com>
Date: Tue, 1 Jul 2025 21:31:50 -0700
Subject: [PATCH 15/31] chore: Add open conversation option (#11828)

Added conversation_status, assignee_id, team_id, and priority to the
message_created event to allow users to build automations based on
conversation details. Also introduced a new open_conversation action.

---------

Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com>
---
 .../dashboard/helper/validations.js           |  1 +
 .../dashboard/i18n/locale/en/automation.json  |  3 +-
 .../settings/automation/constants.js          | 34 ++++++++++++++++++-
 app/models/automation_rule.rb                 |  2 +-
 app/services/action_service.rb                |  4 +++
 .../automation_rule_listener_spec.rb          | 10 ++++++
 spec/services/action_service_spec.rb          | 11 ++++++
 .../conditions_filter_service_spec.rb         | 23 +++++++++++++
 8 files changed, 85 insertions(+), 3 deletions(-)

diff --git a/app/javascript/dashboard/helper/validations.js b/app/javascript/dashboard/helper/validations.js
index 58f3faa1a..edebc4656 100644
--- a/app/javascript/dashboard/helper/validations.js
+++ b/app/javascript/dashboard/helper/validations.js
@@ -126,6 +126,7 @@ const validateSingleAction = action => {
     'snooze_conversation',
     'resolve_conversation',
     'remove_assigned_team',
+    'open_conversation',
   ];
 
   if (
diff --git a/app/javascript/dashboard/i18n/locale/en/automation.json b/app/javascript/dashboard/i18n/locale/en/automation.json
index 86ec0b58b..c5dd4a514 100644
--- a/app/javascript/dashboard/i18n/locale/en/automation.json
+++ b/app/javascript/dashboard/i18n/locale/en/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/routes/dashboard/settings/automation/constants.js b/app/javascript/dashboard/routes/dashboard/settings/automation/constants.js
index 18468e3ad..1b0f0599f 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/automation/constants.js
+++ b/app/javascript/dashboard/routes/dashboard/settings/automation/constants.js
@@ -32,6 +32,30 @@ export const AUTOMATIONS = {
         inputType: 'multi_select',
         filterOperators: OPERATOR_TYPES_1,
       },
+      {
+        key: 'status',
+        name: 'STATUS',
+        inputType: 'multi_select',
+        filterOperators: OPERATOR_TYPES_1,
+      },
+      {
+        key: 'assignee_id',
+        name: 'ASSIGNEE_NAME',
+        inputType: 'search_select',
+        filterOperators: OPERATOR_TYPES_3,
+      },
+      {
+        key: 'team_id',
+        name: 'TEAM_NAME',
+        inputType: 'search_select',
+        filterOperators: OPERATOR_TYPES_3,
+      },
+      {
+        key: 'priority',
+        name: 'PRIORITY',
+        inputType: 'multi_select',
+        filterOperators: OPERATOR_TYPES_1,
+      },
       {
         key: 'conversation_language',
         name: 'CONVERSATION_LANGUAGE',
@@ -82,7 +106,10 @@ export const AUTOMATIONS = {
         key: 'snooze_conversation',
         name: 'SNOOZE_CONVERSATION',
       },
-
+      {
+        key: 'open_conversation',
+        name: 'OPEN_CONVERSATION',
+      },
       {
         key: 'resolve_conversation',
         name: 'RESOLVE_CONVERSATION',
@@ -508,6 +535,11 @@ export const AUTOMATION_ACTION_TYPES = [
     label: 'RESOLVE_CONVERSATION',
     inputType: null,
   },
+  {
+    key: 'open_conversation',
+    label: 'OPEN_CONVERSATION',
+    inputType: null,
+  },
   {
     key: 'send_webhook_event',
     label: 'SEND_WEBHOOK_EVENT',
diff --git a/app/models/automation_rule.rb b/app/models/automation_rule.rb
index 258c5c0a3..c8f5a180d 100644
--- a/app/models/automation_rule.rb
+++ b/app/models/automation_rule.rb
@@ -41,7 +41,7 @@ class AutomationRule < ApplicationRecord
 
   def actions_attributes
     %w[send_message add_label remove_label send_email_to_team assign_team assign_agent send_webhook_event mute_conversation
-       send_attachment change_status resolve_conversation snooze_conversation change_priority send_email_transcript].freeze
+       send_attachment change_status resolve_conversation open_conversation snooze_conversation change_priority send_email_transcript].freeze
   end
 
   def file_base_data
diff --git a/app/services/action_service.rb b/app/services/action_service.rb
index 4f33a302b..a50b11193 100644
--- a/app/services/action_service.rb
+++ b/app/services/action_service.rb
@@ -18,6 +18,10 @@ class ActionService
     @conversation.resolved!
   end
 
+  def open_conversation(_params)
+    @conversation.open!
+  end
+
   def change_status(status)
     @conversation.update!(status: status[0])
   end
diff --git a/spec/listeners/automation_rule_listener_spec.rb b/spec/listeners/automation_rule_listener_spec.rb
index e0103b19a..c08b6e402 100644
--- a/spec/listeners/automation_rule_listener_spec.rb
+++ b/spec/listeners/automation_rule_listener_spec.rb
@@ -171,6 +171,16 @@ describe AutomationRuleListener do
         listener.message_created(event)
         expect(AutomationRules::ActionService).not_to have_received(:new).with(automation_rule, account, conversation)
       end
+
+      it 'passes conversation attributes to conditions filter service' do
+        conversation.update!(status: :open, priority: :high)
+        listener.message_created(event)
+        expect(AutomationRules::ConditionsFilterService).to have_received(:new).with(
+          automation_rule,
+          conversation,
+          { message: message, changed_attributes: { content: %w[nil Hi] } }
+        )
+      end
     end
   end
 end
diff --git a/spec/services/action_service_spec.rb b/spec/services/action_service_spec.rb
index c28761844..95b1e6ecf 100644
--- a/spec/services/action_service_spec.rb
+++ b/spec/services/action_service_spec.rb
@@ -14,6 +14,17 @@ describe ActionService do
     end
   end
 
+  describe '#open_conversation' do
+    let(:conversation) { create(:conversation, status: :resolved) }
+    let(:action_service) { described_class.new(conversation) }
+
+    it 'opens the conversation' do
+      expect(conversation.status).to eq('resolved')
+      action_service.open_conversation(nil)
+      expect(conversation.reload.status).to eq('open')
+    end
+  end
+
   describe '#change_priority' do
     let(:conversation) { create(:conversation) }
     let(:action_service) { described_class.new(conversation) }
diff --git a/spec/services/automation_rules/conditions_filter_service_spec.rb b/spec/services/automation_rules/conditions_filter_service_spec.rb
index ec9f52062..7082d31b1 100644
--- a/spec/services/automation_rules/conditions_filter_service_spec.rb
+++ b/spec/services/automation_rules/conditions_filter_service_spec.rb
@@ -110,6 +110,29 @@ RSpec.describe AutomationRules::ConditionsFilterService do
           expect(described_class.new(rule, conversation, { message: message, changed_attributes: {} }).perform).to be(false)
         end
       end
+
+      context 'when filtering messages based on conversation attributes' do
+        let(:conversation) { create(:conversation, account: account, status: :open, priority: :high) }
+        let(:message) do
+          create(:message, account: account, conversation: conversation, content: 'Test message',
+                           inbox: conversation.inbox, message_type: :incoming)
+        end
+
+        it 'will return true when conversation status matches' do
+          rule.update(conditions: [{ 'values': ['open'], 'attribute_key': 'status', 'query_operator': nil, 'filter_operator': 'equal_to' }])
+          expect(described_class.new(rule, conversation, { message: message, changed_attributes: {} }).perform).to be(true)
+        end
+
+        it 'will return false when conversation status does not match' do
+          rule.update(conditions: [{ 'values': ['resolved'], 'attribute_key': 'status', 'query_operator': nil, 'filter_operator': 'equal_to' }])
+          expect(described_class.new(rule, conversation, { message: message, changed_attributes: {} }).perform).to be(false)
+        end
+
+        it 'will return true when conversation priority matches' do
+          rule.update(conditions: [{ 'values': ['high'], 'attribute_key': 'priority', 'query_operator': nil, 'filter_operator': 'equal_to' }])
+          expect(described_class.new(rule, conversation, { message: message, changed_attributes: {} }).perform).to be(true)
+        end
+      end
     end
   end
 end

From cdb1dc6714ea718b1b6186e0d6416c4edb949a3e Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Wed, 2 Jul 2025 11:59:15 +0530
Subject: [PATCH 16/31] chore: Disable drag on macro item when preview is open
 (#11847)

---
 .../dashboard/routes/dashboard/conversation/Macros/List.vue      | 1 -
 .../dashboard/routes/dashboard/conversation/Macros/MacroItem.vue | 1 +
 2 files changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/javascript/dashboard/routes/dashboard/conversation/Macros/List.vue b/app/javascript/dashboard/routes/dashboard/conversation/Macros/List.vue
index 9e7f92ae1..7903ae751 100644
--- a/app/javascript/dashboard/routes/dashboard/conversation/Macros/List.vue
+++ b/app/javascript/dashboard/routes/dashboard/conversation/Macros/List.vue
@@ -104,7 +104,6 @@ onMounted(() => {
           :key="element.id"
           :macro="element"
           :conversation-id="conversationId"
-          class="drag-handle cursor-grab"
         />
       </template>
     </Draggable>
diff --git a/app/javascript/dashboard/routes/dashboard/conversation/Macros/MacroItem.vue b/app/javascript/dashboard/routes/dashboard/conversation/Macros/MacroItem.vue
index 2b7637ee2..b6de05d51 100644
--- a/app/javascript/dashboard/routes/dashboard/conversation/Macros/MacroItem.vue
+++ b/app/javascript/dashboard/routes/dashboard/conversation/Macros/MacroItem.vue
@@ -54,6 +54,7 @@ const closeMacroPreview = () => {
 <template>
   <div
     class="relative flex items-center justify-between leading-4 rounded-md h-10 pl-3 pr-2"
+    :class="showPreview ? 'cursor-default' : 'drag-handle cursor-grab'"
   >
     <span
       class="overflow-hidden whitespace-nowrap text-ellipsis font-medium text-n-slate-12"

From 19d8f6bac59d359759e41f89acf02ab490c88f57 Mon Sep 17 00:00:00 2001
From: mix5003 <mix5003@gmail.com>
Date: Wed, 2 Jul 2025 14:03:29 +0700
Subject: [PATCH 17/31] fix: `input_select` styles in Line channel (#11805)

---
 app/services/line/send_on_line_service.rb       | 3 ++-
 spec/services/line/send_on_line_service_spec.rb | 3 ++-
 2 files changed, 4 insertions(+), 2 deletions(-)

diff --git a/app/services/line/send_on_line_service.rb b/app/services/line/send_on_line_service.rb
index a5467ebbf..b0b6d828d 100644
--- a/app/services/line/send_on_line_service.rb
+++ b/app/services/line/send_on_line_service.rb
@@ -73,7 +73,8 @@ class Line::SendOnLineService < Base::SendOnChannelService
           contents: [
             {
               type: 'text',
-              text: message.content
+              text: message.content,
+              wrap: true
             },
             *input_select_to_button
           ]
diff --git a/spec/services/line/send_on_line_service_spec.rb b/spec/services/line/send_on_line_service_spec.rb
index 5352565e7..a7520b8d8 100644
--- a/spec/services/line/send_on_line_service_spec.rb
+++ b/spec/services/line/send_on_line_service_spec.rb
@@ -112,7 +112,8 @@ describe Line::SendOnLineService do
               contents: [
                 {
                   type: 'text',
-                  text: 'test'
+                  text: 'test',
+                  wrap: true
                 },
                 {
                   type: 'button',

From 3ea6429895423c50a6fbbdfc10f15ebda24892c2 Mon Sep 17 00:00:00 2001
From: Kitsios Konstantinos <kitsios.konst@gmail.com>
Date: Wed, 2 Jul 2025 12:55:30 +0300
Subject: [PATCH 18/31] chore: Cancel redundant ci runs on consecutive pushes
 on the same PR (#11851)

Currently, if a PR is open and a push happens, the Run Size Limit Check
workflow will start running. If, shortly after a subsequent push on the
same PR happens, the workflow will start running again without
cancelling the previous (now obsolete) run. With these changes, the
first run would be cancelled, thus saving compute resources (see below
for quantity) without sacrificing functionality, since the second run
will contain the changes from the first push as well.
---
 .github/workflows/deploy_check.yml             | 5 +++++
 .github/workflows/logging_percentage_check.yml | 5 +++++
 .github/workflows/size-limit.yml               | 5 +++++
 3 files changed, 15 insertions(+)

diff --git a/.github/workflows/deploy_check.yml b/.github/workflows/deploy_check.yml
index 7fda2b1a4..9f295a6c8 100644
--- a/.github/workflows/deploy_check.yml
+++ b/.github/workflows/deploy_check.yml
@@ -6,6 +6,11 @@ name: Deploy Check
 on:
   pull_request:
 
+# If two pushes happen within a short time in the same PR, cancel the run of the oldest push
+concurrency:
+  group: pr-${{ github.workflow }}-${{ github.head_ref }}
+  cancel-in-progress: true
+
 jobs:
   deployment_check:
     name: Check Deployment
diff --git a/.github/workflows/logging_percentage_check.yml b/.github/workflows/logging_percentage_check.yml
index e9f84c313..5c45ba635 100644
--- a/.github/workflows/logging_percentage_check.yml
+++ b/.github/workflows/logging_percentage_check.yml
@@ -5,6 +5,11 @@ on:
     branches:
       - develop
 
+# If two pushes happen within a short time in the same PR, cancel the run of the oldest push
+concurrency:
+  group: pr-${{ github.workflow }}-${{ github.head_ref }}
+  cancel-in-progress: true
+
 jobs:
   log_lines_check:
     runs-on: ubuntu-latest
diff --git a/.github/workflows/size-limit.yml b/.github/workflows/size-limit.yml
index 9be79da05..c2a4bd174 100644
--- a/.github/workflows/size-limit.yml
+++ b/.github/workflows/size-limit.yml
@@ -5,6 +5,11 @@ on:
     branches:
       - develop
 
+# If two pushes happen within a short time in the same PR, cancel the run of the oldest push
+concurrency:
+  group: pr-${{ github.workflow }}-${{ github.head_ref }}
+  cancel-in-progress: true
+
 jobs:
   test:
     runs-on: ubuntu-22.04

From a6cc3617c0481bafc1a67742afb97f0022e9174a Mon Sep 17 00:00:00 2001
From: Muhsin Keloth <muhsinkeramam@gmail.com>
Date: Wed, 2 Jul 2025 19:57:59 +0530
Subject: [PATCH 19/31] feat: Add the ability to mention team in private
 message (#11758)

This PR allows agents to mention entire teams in private messages using
`@team_name` syntax. When a team is mentioned, all team members with
inbox access are automatically notified. The scheme changes can be found
[here](https://github.com/chatwoot/prosemirror-schema/pull/34).

---------

Co-authored-by: iamsivin <iamsivin@gmail.com>
Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Co-authored-by: Sojan Jose <sojan@pepalo.com>
---
 .../widgets/conversation/TagAgents.vue        | 144 +++--
 .../dashboard/helper/editorHelper.js          |  13 +-
 .../helper/specs/editorContentHelper.spec.js  |   1 +
 .../helper/specs/editorHelper.spec.js         | 189 ++++++-
 .../i18n/locale/en/conversation.json          |   4 +
 app/services/messages/mention_service.rb      |  29 +-
 package.json                                  |   2 +-
 pnpm-lock.yaml                                |  10 +-
 .../services/messages/mention_service_spec.rb | 498 ++++++++++++++++--
 9 files changed, 806 insertions(+), 84 deletions(-)

diff --git a/app/javascript/dashboard/components/widgets/conversation/TagAgents.vue b/app/javascript/dashboard/components/widgets/conversation/TagAgents.vue
index b2d578e0d..b3faa57f8 100644
--- a/app/javascript/dashboard/components/widgets/conversation/TagAgents.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/TagAgents.vue
@@ -1,8 +1,9 @@
 <script setup>
 import Avatar from 'next/avatar/Avatar.vue';
 import { ref, computed, watch, nextTick } from 'vue';
-import { useStoreGetters } from 'dashboard/composables/store';
+import { useStoreGetters, useMapGetter } from 'dashboard/composables/store';
 import { useKeyboardNavigableList } from 'dashboard/composables/useKeyboardNavigableList';
+import { useI18n } from 'vue-i18n';
 
 const props = defineProps({
   searchKey: {
@@ -13,41 +14,89 @@ const props = defineProps({
 
 const emit = defineEmits(['selectAgent']);
 
+const { t } = useI18n();
 const getters = useStoreGetters();
 const agents = computed(() => getters['agents/getVerifiedAgents'].value);
+const teams = useMapGetter('teams/getTeams');
 
 const tagAgentsRef = ref(null);
 const selectedIndex = ref(0);
 
 const items = computed(() => {
-  if (!props.searchKey) {
-    return agents.value;
-  }
-  return agents.value.filter(agent =>
-    agent.name.toLowerCase().includes(props.searchKey.toLowerCase())
+  const search = props.searchKey?.trim().toLowerCase() || '';
+
+  const buildItems = (list, type, infoKey) =>
+    list
+      .map(item => ({
+        ...item,
+        type,
+        displayName: item.name,
+        displayInfo: item[infoKey],
+      }))
+      .filter(item =>
+        search ? item.displayName.toLowerCase().includes(search) : true
+      );
+
+  const categories = [
+    {
+      title: t('CONVERSATION.MENTION.AGENTS'),
+      data: buildItems(agents.value, 'user', 'email'),
+    },
+    {
+      title: t('CONVERSATION.MENTION.TEAMS'),
+      data: buildItems(teams.value, 'team', 'description'),
+    },
+  ];
+
+  return categories.flatMap(({ title, data }) =>
+    data.length
+      ? [
+          { type: 'header', title, id: `${title.toLowerCase()}-header` },
+          ...data,
+        ]
+      : []
   );
 });
 
+const selectableItems = computed(() => {
+  return items.value.filter(item => item.type !== 'header');
+});
+
+const getSelectableIndex = item => {
+  return selectableItems.value.findIndex(
+    selectableItem =>
+      selectableItem.type === item.type && selectableItem.id === item.id
+  );
+};
+
 const adjustScroll = () => {
   nextTick(() => {
     if (tagAgentsRef.value) {
-      tagAgentsRef.value.scrollTop = 50 * selectedIndex.value;
+      const selectedElement = tagAgentsRef.value.querySelector(
+        `#mention-item-${selectedIndex.value}`
+      );
+      if (selectedElement) {
+        selectedElement.scrollIntoView({
+          block: 'nearest',
+          behavior: 'auto',
+        });
+      }
     }
   });
 };
 
 const onSelect = () => {
-  emit('selectAgent', items.value[selectedIndex.value]);
+  emit('selectAgent', selectableItems.value[selectedIndex.value]);
 };
 
 useKeyboardNavigableList({
-  items,
+  items: selectableItems,
   onSelect,
   adjustScroll,
   selectedIndex,
 });
 
-watch(items, newListOfAgents => {
+watch(selectableItems, newListOfAgents => {
   if (newListOfAgents.length < selectedIndex.value + 1) {
     selectedIndex.value = 0;
   }
@@ -69,40 +118,61 @@ const onAgentSelect = index => {
       v-if="items.length"
       ref="tagAgentsRef"
       class="vertical dropdown menu mention--box bg-n-solid-1 p-1 rounded-xl text-sm overflow-auto absolute w-full z-20 shadow-md left-0 leading-[1.2] bottom-full max-h-[12.5rem] border border-solid border-n-strong"
+      role="listbox"
     >
       <li
-        v-for="(agent, index) in items"
-        :id="`mention-item-${index}`"
-        :key="agent.id"
-        :class="{
-          'bg-n-alpha-black2': index === selectedIndex,
-          'last:mb-0': items.length <= 4,
-        }"
-        class="flex items-center px-2 py-1 rounded-md"
-        @click="onAgentSelect(index)"
-        @mouseover="onHover(index)"
+        v-for="item in items"
+        :id="
+          item.type === 'header'
+            ? undefined
+            : `mention-item-${getSelectableIndex(item)}`
+        "
+        :key="`${item.type}-${item.id}`"
       >
-        <div class="ltr:mr-2 rtl:ml-2">
-          <Avatar :src="agent.thumbnail" :name="agent.name" rounded-full />
-        </div>
+        <!-- Section Header -->
         <div
-          class="flex-1 max-w-full overflow-hidden whitespace-nowrap text-ellipsis"
+          v-if="item.type === 'header'"
+          class="px-2 py-2 text-xs font-medium tracking-wide capitalize text-n-slate-11"
         >
-          <h5
-            class="mb-0 overflow-hidden text-sm text-n-slate-11 whitespace-nowrap text-ellipsis"
-            :class="{
-              'text-n-slate-12': index === selectedIndex,
-            }"
-          >
-            {{ agent.name }}
-          </h5>
+          {{ item.title }}
+        </div>
+        <!-- Selectable Item -->
+        <div
+          v-else
+          :class="{
+            'bg-n-alpha-black2': getSelectableIndex(item) === selectedIndex,
+          }"
+          class="flex items-center px-2 py-1 rounded-md cursor-pointer"
+          role="option"
+          @click="onAgentSelect(getSelectableIndex(item))"
+          @mouseover="onHover(getSelectableIndex(item))"
+        >
+          <div class="ltr:mr-2 rtl:ml-2">
+            <Avatar
+              :src="item.thumbnail"
+              :name="item.displayName"
+              rounded-full
+            />
+          </div>
           <div
-            class="overflow-hidden text-xs whitespace-nowrap text-ellipsis text-n-slate-10"
-            :class="{
-              'text-n-slate-11': index === selectedIndex,
-            }"
+            class="overflow-hidden flex-1 max-w-full whitespace-nowrap text-ellipsis"
           >
-            {{ agent.email }}
+            <h5
+              class="overflow-hidden mb-0 text-sm capitalize whitespace-nowrap text-n-slate-11 text-ellipsis"
+              :class="{
+                'text-n-slate-12': getSelectableIndex(item) === selectedIndex,
+              }"
+            >
+              {{ item.displayName }}
+            </h5>
+            <div
+              class="overflow-hidden text-xs whitespace-nowrap text-ellipsis text-n-slate-10"
+              :class="{
+                'text-n-slate-11': getSelectableIndex(item) === selectedIndex,
+              }"
+            >
+              {{ item.displayInfo }}
+            </div>
           </div>
         </div>
       </li>
diff --git a/app/javascript/dashboard/helper/editorHelper.js b/app/javascript/dashboard/helper/editorHelper.js
index ae9eabe67..1fede3a58 100644
--- a/app/javascript/dashboard/helper/editorHelper.js
+++ b/app/javascript/dashboard/helper/editorHelper.js
@@ -301,11 +301,18 @@ export function setURLWithQueryAndSize(selectedImageNode, size, editorView) {
 const createNode = (editorView, nodeType, content) => {
   const { state } = editorView;
   switch (nodeType) {
-    case 'mention':
-      return state.schema.nodes.mention.create({
+    case 'mention': {
+      const mentionType = content.type || 'user';
+      const displayName = content.displayName || content.name;
+
+      const mentionNode = state.schema.nodes.mention.create({
         userId: content.id,
-        userFullName: content.name,
+        userFullName: displayName,
+        mentionType,
       });
+
+      return mentionNode;
+    }
     case 'cannedResponse':
       return new MessageMarkdownTransformer(messageSchema).parse(content);
     case 'variable':
diff --git a/app/javascript/dashboard/helper/specs/editorContentHelper.spec.js b/app/javascript/dashboard/helper/specs/editorContentHelper.spec.js
index a90c0c233..56b162d50 100644
--- a/app/javascript/dashboard/helper/specs/editorContentHelper.spec.js
+++ b/app/javascript/dashboard/helper/specs/editorContentHelper.spec.js
@@ -48,6 +48,7 @@ describe('getContentNode', () => {
         {
           userId: content.id,
           userFullName: content.name,
+          mentionType: 'user',
         }
       );
     });
diff --git a/app/javascript/dashboard/helper/specs/editorHelper.spec.js b/app/javascript/dashboard/helper/specs/editorHelper.spec.js
index a33ef3a1e..4ed9170c2 100644
--- a/app/javascript/dashboard/helper/specs/editorHelper.spec.js
+++ b/app/javascript/dashboard/helper/specs/editorHelper.spec.js
@@ -8,6 +8,7 @@ import {
   insertAtCursor,
   findNodeToInsertImage,
   setURLWithQueryAndSize,
+  getContentNode,
 } from '../editorHelper';
 import { EditorState } from '@chatwoot/prosemirror-schema';
 import { EditorView } from '@chatwoot/prosemirror-schema';
@@ -18,12 +19,28 @@ const schema = new Schema({
   nodes: {
     doc: { content: 'paragraph+' },
     paragraph: {
-      content: 'text*',
+      content: 'inline*',
+      group: 'block',
       toDOM: () => ['p', 0], // Represents a paragraph as a <p> tag in the DOM.
     },
     text: {
+      group: 'inline',
       toDOM: node => node.text, // Represents text as its actual string value.
     },
+    mention: {
+      attrs: {
+        userId: { default: '' },
+        userFullName: { default: '' },
+        mentionType: { default: 'user' },
+      },
+      inline: true,
+      group: 'inline',
+      toDOM: node => [
+        'span',
+        { class: 'mention' },
+        `@${node.attrs.userFullName}`,
+      ],
+    },
   },
 });
 
@@ -439,3 +456,173 @@ describe('setURLWithQueryAndSize', () => {
     expect(editorView.dispatch).not.toHaveBeenCalled();
   });
 });
+
+describe('getContentNode', () => {
+  let mockEditorView;
+
+  beforeEach(() => {
+    mockEditorView = {
+      state: {
+        schema: {
+          nodes: {
+            mention: {
+              create: vi.fn(attrs => ({
+                type: { name: 'mention' },
+                attrs,
+              })),
+            },
+          },
+          text: vi.fn(content => ({ type: { name: 'text' }, text: content })),
+        },
+      },
+    };
+  });
+
+  describe('mention node creation', () => {
+    it('creates a user mention node with correct attributes', () => {
+      const userContent = {
+        id: '123',
+        name: 'John Doe',
+        type: 'user',
+      };
+
+      const result = getContentNode(mockEditorView, 'mention', userContent, {
+        from: 0,
+        to: 5,
+      });
+
+      expect(
+        mockEditorView.state.schema.nodes.mention.create
+      ).toHaveBeenCalledWith({
+        userId: '123',
+        userFullName: 'John Doe',
+        mentionType: 'user',
+      });
+
+      expect(result).toEqual({
+        node: {
+          type: { name: 'mention' },
+          attrs: {
+            userId: '123',
+            userFullName: 'John Doe',
+            mentionType: 'user',
+          },
+        },
+        from: 0,
+        to: 5,
+      });
+    });
+
+    it('creates a team mention node with correct attributes', () => {
+      const teamContent = {
+        id: '456',
+        name: 'Support Team',
+        type: 'team',
+      };
+
+      const result = getContentNode(mockEditorView, 'mention', teamContent, {
+        from: 0,
+        to: 5,
+      });
+
+      expect(
+        mockEditorView.state.schema.nodes.mention.create
+      ).toHaveBeenCalledWith({
+        userId: '456',
+        userFullName: 'Support Team',
+        mentionType: 'team',
+      });
+
+      expect(result).toEqual({
+        node: {
+          type: { name: 'mention' },
+          attrs: {
+            userId: '456',
+            userFullName: 'Support Team',
+            mentionType: 'team',
+          },
+        },
+        from: 0,
+        to: 5,
+      });
+    });
+
+    it('defaults to user mention type when type is not specified', () => {
+      const contentWithoutType = {
+        id: '789',
+        name: 'Jane Smith',
+      };
+
+      getContentNode(mockEditorView, 'mention', contentWithoutType, {
+        from: 0,
+        to: 5,
+      });
+
+      expect(
+        mockEditorView.state.schema.nodes.mention.create
+      ).toHaveBeenCalledWith({
+        userId: '789',
+        userFullName: 'Jane Smith',
+        mentionType: 'user',
+      });
+    });
+
+    it('uses displayName over name when both are provided', () => {
+      const contentWithDisplayName = {
+        id: '101',
+        name: 'john_doe',
+        displayName: 'John Doe (Admin)',
+        type: 'user',
+      };
+
+      getContentNode(mockEditorView, 'mention', contentWithDisplayName, {
+        from: 0,
+        to: 5,
+      });
+
+      expect(
+        mockEditorView.state.schema.nodes.mention.create
+      ).toHaveBeenCalledWith({
+        userId: '101',
+        userFullName: 'John Doe (Admin)',
+        mentionType: 'user',
+      });
+    });
+
+    it('handles missing displayName by falling back to name', () => {
+      const contentWithoutDisplayName = {
+        id: '102',
+        name: 'jane_smith',
+        type: 'user',
+      };
+
+      getContentNode(mockEditorView, 'mention', contentWithoutDisplayName, {
+        from: 0,
+        to: 5,
+      });
+
+      expect(
+        mockEditorView.state.schema.nodes.mention.create
+      ).toHaveBeenCalledWith({
+        userId: '102',
+        userFullName: 'jane_smith',
+        mentionType: 'user',
+      });
+    });
+  });
+
+  describe('unsupported node types', () => {
+    it('returns null node for unsupported type', () => {
+      const result = getContentNode(mockEditorView, 'unsupported', 'content', {
+        from: 0,
+        to: 5,
+      });
+
+      expect(result).toEqual({
+        node: null,
+        from: 0,
+        to: 5,
+      });
+    });
+  });
+});
diff --git a/app/javascript/dashboard/i18n/locale/en/conversation.json b/app/javascript/dashboard/i18n/locale/en/conversation.json
index c047f17ad..5b3b7f3f8 100644
--- a/app/javascript/dashboard/i18n/locale/en/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/en/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agents",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/services/messages/mention_service.rb b/app/services/messages/mention_service.rb
index 3f4392ec1..43bc17fb8 100644
--- a/app/services/messages/mention_service.rb
+++ b/app/services/messages/mention_service.rb
@@ -19,14 +19,33 @@ class Messages::MentionService
   end
 
   def mentioned_ids
-    @mentioned_ids ||= message.content.scan(%r{\(mention://(user|team)/(\d+)/(.+?)\)}).map(&:second).uniq
+    user_mentions = message.content.scan(%r{\(mention://user/(\d+)/(.+?)\)}).map(&:first)
+    team_mentions = message.content.scan(%r{\(mention://team/(\d+)/(.+?)\)}).map(&:first)
+
+    expanded_user_ids = expand_team_mentions_to_users(team_mentions)
+
+    (user_mentions + expanded_user_ids).uniq
+  end
+
+  def expand_team_mentions_to_users(team_ids)
+    return [] if team_ids.blank?
+
+    message.inbox.account.teams
+           .joins(:team_members)
+           .where(id: team_ids)
+           .pluck('team_members.user_id')
+           .map(&:to_s)
+  end
+
+  def valid_mentionable_user_ids
+    @valid_mentionable_user_ids ||= begin
+      inbox = message.inbox
+      inbox.account.administrators.pluck(:id) + inbox.members.pluck(:id)
+    end
   end
 
   def filter_mentioned_ids_by_inbox
-    inbox = message.inbox
-    valid_mentionable_ids = inbox.account.administrators.map(&:id) + inbox.members.map(&:id)
-    # Intersection of ids
-    mentioned_ids & valid_mentionable_ids.uniq.map(&:to_s)
+    mentioned_ids & valid_mentionable_user_ids.map(&:to_s)
   end
 
   def generate_notifications_for_mentions(validated_mentioned_ids)
diff --git a/package.json b/package.json
index c81f033b5..1ca8d1025 100644
--- a/package.json
+++ b/package.json
@@ -33,7 +33,7 @@
   "dependencies": {
     "@breezystack/lamejs": "^1.2.7",
     "@chatwoot/ninja-keys": "1.2.3",
-    "@chatwoot/prosemirror-schema": "1.1.1-next",
+    "@chatwoot/prosemirror-schema": "1.1.6-next",
     "@chatwoot/utils": "^0.0.47",
     "@formkit/core": "^1.6.7",
     "@formkit/vue": "^1.6.7",
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index b8b23d1d0..a88cfc084 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -20,8 +20,8 @@ importers:
         specifier: 1.2.3
         version: 1.2.3
       '@chatwoot/prosemirror-schema':
-        specifier: 1.1.1-next
-        version: 1.1.1-next
+        specifier: 1.1.6-next
+        version: 1.1.6-next
       '@chatwoot/utils':
         specifier: ^0.0.47
         version: 0.0.47
@@ -403,8 +403,8 @@ packages:
   '@chatwoot/ninja-keys@1.2.3':
     resolution: {integrity: sha512-xM8d9P5ikDMZm2WbaCTk/TW5HFauylrU3cJ75fq5je6ixKwyhl/0kZbVN/vbbZN4+AUX/OaSIn6IJbtCgIF67g==}
 
-  '@chatwoot/prosemirror-schema@1.1.1-next':
-    resolution: {integrity: sha512-/M2qZ+ZF7GlQNt1riwVP499fvp3hxSqd5iy8hxyF9pkj9qQ+OKYn5JK+v3qwwqQY3IxhmNOn1Lp6tm7vstrd9Q==}
+  '@chatwoot/prosemirror-schema@1.1.6-next':
+    resolution: {integrity: sha512-9lf7FrcED/B5oyGrMmIkbegkhlC/P0NrtXoX8k94YWRosZcx0hGVGhpTud+0Mhm7saAfGerKIwTRVDmmnxPuCA==}
 
   '@chatwoot/utils@0.0.47':
     resolution: {integrity: sha512-0z/MY+rBjDnf6zuWbMdzexH+zFDXU/g5fPr/kcUxnqtvPsZIQpL8PvwSPBW0+wS6R7LChndNkdviV1e9H8Yp+Q==}
@@ -5237,7 +5237,7 @@ snapshots:
       hotkeys-js: 3.8.7
       lit: 2.2.6
 
-  '@chatwoot/prosemirror-schema@1.1.1-next':
+  '@chatwoot/prosemirror-schema@1.1.6-next':
     dependencies:
       markdown-it-sup: 2.0.0
       prosemirror-commands: 1.6.0
diff --git a/spec/services/messages/mention_service_spec.rb b/spec/services/messages/mention_service_spec.rb
index 94277570b..7cdb8ffe7 100644
--- a/spec/services/messages/mention_service_spec.rb
+++ b/spec/services/messages/mention_service_spec.rb
@@ -5,69 +5,503 @@ describe Messages::MentionService do
   let!(:user) { create(:user, account: account) }
   let!(:first_agent) { create(:user, account: account) }
   let!(:second_agent) { create(:user, account: account) }
+  let!(:third_agent) { create(:user, account: account) }
+  let!(:admin_user) { create(:user, account: account, role: :administrator) }
   let!(:inbox) { create(:inbox, account: account) }
   let!(:conversation) { create(:conversation, account: account, inbox: inbox, assignee: user) }
+  let!(:team) { create(:team, account: account, name: 'Support Team') }
+  let!(:empty_team) { create(:team, account: account, name: 'Empty Team') }
   let(:builder) { double }
 
   before do
     create(:inbox_member, user: first_agent, inbox: inbox)
     create(:inbox_member, user: second_agent, inbox: inbox)
+    create(:team_member, user: first_agent, team: team)
+    create(:team_member, user: second_agent, team: team)
     conversation.reload
     allow(NotificationBuilder).to receive(:new).and_return(builder)
     allow(builder).to receive(:perform)
+    allow(Conversations::UserMentionJob).to receive(:perform_later)
   end
 
-  context 'when message contains mention' do
-    it 'creates notifications for inbox member who was mentioned' do
+  describe '#perform' do
+    context 'when message is not private' do
+      it 'does not process mentions for public messages' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hi (mention://user/#{first_agent.id}/#{first_agent.name})",
+          private: false
+        )
+
+        described_class.new(message: message).perform
+
+        expect(NotificationBuilder).not_to have_received(:new)
+        expect(Conversations::UserMentionJob).not_to have_received(:perform_later)
+      end
+    end
+
+    context 'when message has no content' do
+      it 'does not process mentions for empty messages' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: nil,
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        expect(NotificationBuilder).not_to have_received(:new)
+        expect(Conversations::UserMentionJob).not_to have_received(:perform_later)
+      end
+    end
+
+    context 'when message has no mentions' do
+      it 'does not process messages without mentions' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: 'just a regular message',
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        expect(NotificationBuilder).not_to have_received(:new)
+        expect(Conversations::UserMentionJob).not_to have_received(:perform_later)
+      end
+    end
+  end
+
+  describe 'user mentions' do
+    context 'when message contains single user mention' do
+      it 'creates notifications for inbox member who was mentioned' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hi (mention://user/#{first_agent.id}/#{first_agent.name})",
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        expect(NotificationBuilder).to have_received(:new).with(
+          notification_type: 'conversation_mention',
+          user: first_agent,
+          account: account,
+          primary_actor: message.conversation,
+          secondary_actor: message
+        )
+        expect(Conversations::UserMentionJob).to have_received(:perform_later).with(
+          [first_agent.id.to_s],
+          conversation.id,
+          account.id
+        )
+      end
+
+      it 'adds mentioned user as conversation participant' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hi (mention://user/#{first_agent.id}/#{first_agent.name})",
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        expect(conversation.conversation_participants.map(&:user_id)).to include(first_agent.id)
+      end
+    end
+
+    context 'when message contains multiple user mentions' do
+      let(:message) do
+        build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hey (mention://user/#{second_agent.id}/#{second_agent.name}) " \
+                   "and (mention://user/#{first_agent.id}/#{first_agent.name}), please look into this?",
+          private: true
+        )
+      end
+
+      it 'creates notifications for all mentioned inbox members' do
+        described_class.new(message: message).perform
+
+        expect(NotificationBuilder).to have_received(:new).with(
+          notification_type: 'conversation_mention',
+          user: second_agent,
+          account: account,
+          primary_actor: message.conversation,
+          secondary_actor: message
+        )
+        expect(NotificationBuilder).to have_received(:new).with(
+          notification_type: 'conversation_mention',
+          user: first_agent,
+          account: account,
+          primary_actor: message.conversation,
+          secondary_actor: message
+        )
+      end
+
+      it 'adds all mentioned users to the participants list' do
+        described_class.new(message: message).perform
+        expect(conversation.conversation_participants.map(&:user_id)).to contain_exactly(first_agent.id, second_agent.id)
+      end
+
+      it 'passes unique user IDs to UserMentionJob' do
+        described_class.new(message: message).perform
+        expect(Conversations::UserMentionJob).to have_received(:perform_later).with(
+          contain_exactly(first_agent.id.to_s, second_agent.id.to_s),
+          conversation.id,
+          account.id
+        )
+      end
+    end
+
+    context 'when mentioned user is not an inbox member' do
+      let!(:non_member_user) { create(:user, account: account) }
+
+      it 'does not create notifications for non-inbox members' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hi (mention://user/#{non_member_user.id}/#{non_member_user.name})",
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        expect(NotificationBuilder).not_to have_received(:new)
+        expect(Conversations::UserMentionJob).not_to have_received(:perform_later)
+      end
+    end
+
+    context 'when mentioned user is an admin' do
+      it 'creates notifications for admin users even if not inbox members' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hi (mention://user/#{admin_user.id}/#{admin_user.name})",
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        expect(NotificationBuilder).to have_received(:new).with(
+          notification_type: 'conversation_mention',
+          user: admin_user,
+          account: account,
+          primary_actor: message.conversation,
+          secondary_actor: message
+        )
+      end
+    end
+
+    context 'when same user is mentioned multiple times' do
+      it 'creates only one notification per user' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hi (mention://user/#{first_agent.id}/#{first_agent.name}) and again (mention://user/#{first_agent.id}/#{first_agent.name})",
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        expect(NotificationBuilder).to have_received(:new).once
+        expect(Conversations::UserMentionJob).to have_received(:perform_later).with(
+          [first_agent.id.to_s],
+          conversation.id,
+          account.id
+        )
+      end
+    end
+  end
+
+  describe 'team mentions' do
+    context 'when message contains single team mention' do
+      it 'creates notifications for all team members who are inbox members' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hey (mention://team/#{team.id}/#{team.name}) please help",
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        expect(NotificationBuilder).to have_received(:new).with(
+          notification_type: 'conversation_mention',
+          user: first_agent,
+          account: account,
+          primary_actor: message.conversation,
+          secondary_actor: message
+        )
+        expect(NotificationBuilder).to have_received(:new).with(
+          notification_type: 'conversation_mention',
+          user: second_agent,
+          account: account,
+          primary_actor: message.conversation,
+          secondary_actor: message
+        )
+      end
+
+      it 'adds all team members as conversation participants' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hey (mention://team/#{team.id}/#{team.name}) please help",
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        expect(conversation.conversation_participants.map(&:user_id)).to contain_exactly(first_agent.id, second_agent.id)
+      end
+
+      it 'passes team member IDs to UserMentionJob' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hey (mention://team/#{team.id}/#{team.name}) please help",
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        expect(Conversations::UserMentionJob).to have_received(:perform_later).with(
+          contain_exactly(first_agent.id.to_s, second_agent.id.to_s),
+          conversation.id,
+          account.id
+        )
+      end
+    end
+
+    context 'when team has members who are not inbox members' do
+      let!(:non_inbox_team_member) { create(:user, account: account) }
+
+      before do
+        create(:team_member, user: non_inbox_team_member, team: team)
+      end
+
+      it 'only notifies team members who are also inbox members' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hey (mention://team/#{team.id}/#{team.name}) please help",
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        expect(NotificationBuilder).to have_received(:new).with(
+          notification_type: 'conversation_mention', user: first_agent, account: account,
+          primary_actor: message.conversation, secondary_actor: message
+        )
+        expect(NotificationBuilder).to have_received(:new).with(
+          notification_type: 'conversation_mention', user: second_agent, account: account,
+          primary_actor: message.conversation, secondary_actor: message
+        )
+        expect(NotificationBuilder).not_to have_received(:new).with(
+          notification_type: 'conversation_mention', user: non_inbox_team_member, account: account,
+          primary_actor: message.conversation, secondary_actor: message
+        )
+      end
+    end
+
+    context 'when team has admin members' do
+      before do
+        create(:team_member, user: admin_user, team: team)
+      end
+
+      it 'includes admin team members in notifications' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hey (mention://team/#{team.id}/#{team.name}) please help",
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        expect(NotificationBuilder).to have_received(:new).with(
+          notification_type: 'conversation_mention',
+          user: admin_user,
+          account: account,
+          primary_actor: message.conversation,
+          secondary_actor: message
+        )
+      end
+    end
+
+    context 'when team is empty' do
+      it 'does not create any notifications for empty teams' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hey (mention://team/#{empty_team.id}/#{empty_team.name}) please help",
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        expect(NotificationBuilder).not_to have_received(:new)
+        expect(Conversations::UserMentionJob).not_to have_received(:perform_later)
+      end
+    end
+
+    context 'when team does not exist' do
+      it 'does not create notifications for non-existent teams' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: 'hey (mention://team/99999/NonExistentTeam) please help',
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        expect(NotificationBuilder).not_to have_received(:new)
+        expect(Conversations::UserMentionJob).not_to have_received(:perform_later)
+      end
+    end
+
+    context 'when same team is mentioned multiple times' do
+      it 'creates only one notification per team member' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hey (mention://team/#{team.id}/#{team.name}) and again (mention://team/#{team.id}/#{team.name})",
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        expect(NotificationBuilder).to have_received(:new).exactly(2).times
+        expect(Conversations::UserMentionJob).to have_received(:perform_later).with(
+          contain_exactly(first_agent.id.to_s, second_agent.id.to_s),
+          conversation.id,
+          account.id
+        )
+      end
+    end
+  end
+
+  describe 'mixed user and team mentions' do
+    context 'when message contains both user and team mentions' do
+      it 'creates notifications for both individual users and team members' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hey (mention://user/#{third_agent.id}/#{third_agent.name}) and (mention://team/#{team.id}/#{team.name})",
+          private: true
+        )
+
+        # Make third_agent an inbox member
+        create(:inbox_member, user: third_agent, inbox: inbox)
+
+        described_class.new(message: message).perform
+
+        expect(NotificationBuilder).to have_received(:new).with(
+          notification_type: 'conversation_mention', user: third_agent, account: account,
+          primary_actor: message.conversation, secondary_actor: message
+        )
+        expect(NotificationBuilder).to have_received(:new).with(
+          notification_type: 'conversation_mention', user: first_agent, account: account,
+          primary_actor: message.conversation, secondary_actor: message
+        )
+        expect(NotificationBuilder).to have_received(:new).with(
+          notification_type: 'conversation_mention', user: second_agent, account: account,
+          primary_actor: message.conversation, secondary_actor: message
+        )
+      end
+
+      it 'avoids duplicate notifications when user is mentioned directly and via team' do
+        message = build(
+          :message,
+          conversation: conversation,
+          account: account,
+          content: "hey (mention://user/#{first_agent.id}/#{first_agent.name}) and (mention://team/#{team.id}/#{team.name})",
+          private: true
+        )
+
+        described_class.new(message: message).perform
+
+        # first_agent should only receive one notification despite being mentioned directly and via team
+        expect(NotificationBuilder).to have_received(:new).with(
+          notification_type: 'conversation_mention',
+          user: first_agent,
+          account: account,
+          primary_actor: message.conversation,
+          secondary_actor: message
+        ).once
+        expect(NotificationBuilder).to have_received(:new).with(
+          notification_type: 'conversation_mention',
+          user: second_agent,
+          account: account,
+          primary_actor: message.conversation,
+          secondary_actor: message
+        ).once
+      end
+    end
+  end
+
+  describe 'cross-account validation' do
+    let!(:other_account) { create(:account) }
+    let!(:other_team) { create(:team, account: other_account) }
+    let!(:other_user) { create(:user, account: other_account) }
+
+    before do
+      create(:team_member, user: other_user, team: other_team)
+    end
+
+    it 'does not process mentions for teams from other accounts' do
       message = build(
         :message,
         conversation: conversation,
         account: account,
-        content: "hi [#{first_agent.name}](mention://user/#{first_agent.id}/#{first_agent.name})",
+        content: "hey (mention://team/#{other_team.id}/#{other_team.name})",
         private: true
       )
 
       described_class.new(message: message).perform
 
-      expect(NotificationBuilder).to have_received(:new).with(notification_type: 'conversation_mention',
-                                                              user: first_agent,
-                                                              account: account,
-                                                              primary_actor: message.conversation,
-                                                              secondary_actor: message)
+      expect(NotificationBuilder).not_to have_received(:new)
+      expect(Conversations::UserMentionJob).not_to have_received(:perform_later)
     end
-  end
 
-  context 'when message contains multiple mentions' do
-    let(:message) do
-      build(
+    it 'does not process mentions for users from other accounts' do
+      message = build(
         :message,
         conversation: conversation,
         account: account,
-        content: "hey [#{second_agent.name}](mention://user/#{second_agent.id}/#{second_agent.name})/
-                  [#{first_agent.name}](mention://user/#{first_agent.id}/#{first_agent.name}),
-                   please look in to this?",
+        content: "hey (mention://user/#{other_user.id}/#{other_user.name})",
         private: true
       )
-    end
 
-    it 'creates notifications for inbox member who was mentioned' do
       described_class.new(message: message).perform
 
-      expect(NotificationBuilder).to have_received(:new).with(notification_type: 'conversation_mention',
-                                                              user: second_agent,
-                                                              account: account,
-                                                              primary_actor: message.conversation,
-                                                              secondary_actor: message)
-      expect(NotificationBuilder).to have_received(:new).with(notification_type: 'conversation_mention',
-                                                              user: first_agent,
-                                                              account: account,
-                                                              primary_actor: message.conversation,
-                                                              secondary_actor: message)
-    end
-
-    it 'add the users to the participants list' do
-      described_class.new(message: message).perform
-      expect(conversation.conversation_participants.map(&:user_id)).to contain_exactly(first_agent.id, second_agent.id)
+      expect(NotificationBuilder).not_to have_received(:new)
+      expect(Conversations::UserMentionJob).not_to have_received(:perform_later)
     end
   end
 end

From 4e4aa7f580b6fd30dbd580a41efda6376da9eecd Mon Sep 17 00:00:00 2001
From: Muhsin Keloth <muhsinkeramam@gmail.com>
Date: Thu, 3 Jul 2025 11:32:13 +0530
Subject: [PATCH 20/31] fix: Handle emoji and special characters in mention
 notifications (#11857)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Fixes notification display issues when user or team names contain emojis
and special characters. Previously, mention notifications would show
URL-encoded characters instead of properly formatted names with emojis.

  **Before:**
Notification: "John Doe: Hey @%F0%9F%91%8D%20customer%20support please
check this"

  **After:**
  Notification: "John Doe: Hey @👍 customer support please check this"
---
 app/helpers/message_format_helper.rb       | 10 +++++--
 lib/regex_helper.rb                        |  8 +++++-
 spec/helpers/message_format_helper_spec.rb | 30 +++++++++++++++++++-
 spec/models/notification_spec.rb           | 33 ++++++++++++++++++++++
 4 files changed, 76 insertions(+), 5 deletions(-)

diff --git a/app/helpers/message_format_helper.rb b/app/helpers/message_format_helper.rb
index 2c50fd609..8b271e3a3 100644
--- a/app/helpers/message_format_helper.rb
+++ b/app/helpers/message_format_helper.rb
@@ -1,9 +1,13 @@
 module MessageFormatHelper
-  include RegexHelper
-
   def transform_user_mention_content(message_content)
     # attachment message without content, message_content is nil
-    message_content.presence ? message_content.gsub(MENTION_REGEX, '\1') : ''
+    return '' unless message_content.presence
+
+    # Use CommonMarker to convert markdown to plain text for notifications
+    # This handles all markdown formatting (links, bold, italic, etc.) not just mentions
+    # Converts: [@👍 customer support](mention://team/1/%F0%9F%91%8D%20customer%20support)
+    # To: @👍 customer support
+    CommonMarker.render_doc(message_content).to_plaintext.strip
   end
 
   def render_message_content(message_content)
diff --git a/lib/regex_helper.rb b/lib/regex_helper.rb
index 31916da7d..5e4c2abf0 100644
--- a/lib/regex_helper.rb
+++ b/lib/regex_helper.rb
@@ -5,7 +5,13 @@ module RegexHelper
   # valid unicode letter, unicode number, underscore, hyphen
   # shouldn't start with a underscore or hyphen
   UNICODE_CHARACTER_NUMBER_HYPHEN_UNDERSCORE = Regexp.new('\A[\p{L}\p{N}]+[\p{L}\p{N}_-]+\Z')
-  MENTION_REGEX = Regexp.new('\[(@[\w_. ]+)\]\(mention://(?:user|team)/\d+/(.*?)+\)')
+  # Regex to match mention markdown links and extract display names
+  # Matches: [@display name](mention://user|team/id/url_encoded_name)
+  # Captures: 1) @display name (including emojis), 2) url_encoded_name
+  # Uses [^]]+ to match any characters except ] in display name to support emojis
+  # NOTE: Still used by Slack integration (lib/integrations/slack/send_on_slack_service.rb)
+  # while notifications use CommonMarker for better markdown processing
+  MENTION_REGEX = Regexp.new('\[(@[^]]+)\]\(mention://(?:user|team)/\d+/([^)]+)\)')
 
   TWILIO_CHANNEL_SMS_REGEX = Regexp.new('^\+\d{1,15}\z')
   TWILIO_CHANNEL_WHATSAPP_REGEX = Regexp.new('^whatsapp:\+\d{1,15}\z')
diff --git a/spec/helpers/message_format_helper_spec.rb b/spec/helpers/message_format_helper_spec.rb
index c5bafe67d..fe1335b8f 100644
--- a/spec/helpers/message_format_helper_spec.rb
+++ b/spec/helpers/message_format_helper_spec.rb
@@ -3,9 +3,37 @@ require 'rails_helper'
 describe MessageFormatHelper do
   describe '#transform_user_mention_content' do
     context 'when transform_user_mention_content called' do
-      it 'return transormed text correctly' do
+      it 'return transformed text correctly' do
         expect(helper.transform_user_mention_content('[@john](mention://user/1/John%20K), check this ticket')).to eq '@john, check this ticket'
       end
+
+      it 'handles emoji in display names correctly' do
+        content = '[@👍 customer support](mention://team/1/%F0%9F%91%8D%20customer%20support), please help'
+        expected = '@👍 customer support, please help'
+        expect(helper.transform_user_mention_content(content)).to eq expected
+      end
+
+      it 'handles multiple mentions with emojis and spaces' do
+        content = 'Hey [@John Doe](mention://user/1/John%20Doe) and [@🚀 Dev Team](mention://team/2/%F0%9F%9A%80%20Dev%20Team)'
+        expected = 'Hey @John Doe and @🚀 Dev Team'
+        expect(helper.transform_user_mention_content(content)).to eq expected
+      end
+
+      it 'handles emoji-only team names' do
+        expect(helper.transform_user_mention_content('[@🔥](mention://team/3/%F0%9F%94%A5) urgent')).to eq '@🔥 urgent'
+      end
+
+      it 'handles special characters in names' do
+        expect(helper.transform_user_mention_content('[@user@domain.com](mention://user/4/user%40domain.com) check')).to eq '@user@domain.com check'
+      end
+
+      it 'returns empty string for nil content' do
+        expect(helper.transform_user_mention_content(nil)).to eq ''
+      end
+
+      it 'returns empty string for empty content' do
+        expect(helper.transform_user_mention_content('')).to eq ''
+      end
     end
   end
 
diff --git a/spec/models/notification_spec.rb b/spec/models/notification_spec.rb
index 07e7e3fe2..172389fe4 100644
--- a/spec/models/notification_spec.rb
+++ b/spec/models/notification_spec.rb
@@ -128,6 +128,39 @@ has been assigned to you"
       expect(notification.push_message_body).to eq "#{message.sender.name}: Hey @John Peter please check this?"
     end
 
+    it 'returns appropriate body suited for the notification type conversation_mention if username contains emoji' do
+      conversation = create(:conversation)
+      content = 'Hey [@👍 customer support](mention://team/1/%F0%9F%91%8D%20customer%20support) please check this?'
+      message = create(:message, sender: create(:user), content: content, conversation: conversation)
+      notification = create(:notification, notification_type: 'conversation_mention', primary_actor: conversation, secondary_actor: message)
+      expect(notification.push_message_body).to eq "#{message.sender.name}: Hey @👍 customer support please check this?"
+    end
+
+    it 'returns appropriate body suited for the notification type conversation_mention if team name contains emoji and spaces' do
+      conversation = create(:conversation)
+      content = 'Please check [@🚀 Development Team](mention://team/2/%F0%9F%9A%80%20Development%20Team)'
+      message = create(:message, sender: create(:user), content: content, conversation: conversation)
+      notification = create(:notification, notification_type: 'conversation_mention', primary_actor: conversation, secondary_actor: message)
+      expect(notification.push_message_body).to eq "#{message.sender.name}: Please check @🚀 Development Team"
+    end
+
+    it 'returns appropriate body suited for the notification type conversation_mention with mixed emoji and regular mentions' do
+      conversation = create(:conversation)
+      content = 'Hey [@John Doe](mention://user/1/John%20Doe) and ' \
+                '[@👍 customer support](mention://team/1/%F0%9F%91%8D%20customer%20support) please review'
+      message = create(:message, sender: create(:user), content: content, conversation: conversation)
+      notification = create(:notification, notification_type: 'conversation_mention', primary_actor: conversation, secondary_actor: message)
+      expect(notification.push_message_body).to eq "#{message.sender.name}: Hey @John Doe and @👍 customer support please review"
+    end
+
+    it 'returns appropriate body suited for the notification type conversation_mention with special characters in names' do
+      conversation = create(:conversation)
+      content = 'Please review [@user@domain.com](mention://user/4/user%40domain.com)'
+      message = create(:message, sender: create(:user), content: content, conversation: conversation)
+      notification = create(:notification, notification_type: 'conversation_mention', primary_actor: conversation, secondary_actor: message)
+      expect(notification.push_message_body).to eq "#{message.sender.name}: Please review @user@domain.com"
+    end
+
     it 'calls remove duplicate notification job' do
       allow(Notification::RemoveDuplicateNotificationJob).to receive(:perform_later)
       notification = create(:notification, notification_type: 'conversation_mention')

From cb01a2bc66d3f0376a56190799472522518d6986 Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Thu, 3 Jul 2025 13:22:44 +0530
Subject: [PATCH 21/31] fix: Incorrect account ID in conversation header back
 button URL (#11866)

---
 .../widgets/conversation/ConversationHeader.vue      | 12 +++++++++---
 1 file changed, 9 insertions(+), 3 deletions(-)

diff --git a/app/javascript/dashboard/components/widgets/conversation/ConversationHeader.vue b/app/javascript/dashboard/components/widgets/conversation/ConversationHeader.vue
index 7a3489265..cdcbd64b5 100644
--- a/app/javascript/dashboard/components/widgets/conversation/ConversationHeader.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/ConversationHeader.vue
@@ -39,15 +39,21 @@ const chatMetadata = computed(() => props.chat.meta);
 
 const backButtonUrl = computed(() => {
   const {
-    params: { inbox_id: inboxId, label, teamId },
+    params: { inbox_id: inboxId, label, teamId, id: customViewId },
     name,
   } = route;
+
+  const conversationTypeMap = {
+    conversation_through_mentions: 'mention',
+    conversation_through_unattended: 'unattended',
+  };
   return conversationListPageURL({
-    accountId,
+    accountId: accountId.value,
     inboxId,
     label,
     teamId,
-    conversationType: name === 'conversation_mentions' ? 'mention' : '',
+    conversationType: conversationTypeMap[name],
+    customViewId,
   });
 });
 

From 7343e53659e9020024653914157ed707a0c07f89 Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Thu, 3 Jul 2025 19:39:36 +0530
Subject: [PATCH 22/31] fix: Variable search item not showing after
 braces/commas (#11864)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

# Pull Request Template

## Description

This PR fixes an issue where typing variables, like `{{contact.name}}`,
caused the variable list to miss showing `contact.name`. The search key
in this case became `contact.name}},` which didn't match any available
options. The logic in `VariableList.vue` only checked the part after the
last comma and didn’t fully sanitize the input.

**Solution**
Updated `searchKey` to remove all {} and commas for accurate matching.

Fixes
[CW-4574](https://linear.app/chatwoot/issue/CW-4574/i-dont-see-an-option-for-contactname-it-shows-initially-but-it-doesnt)

## Type of change

- [x] Bug fix (non-breaking change which fixes an issue)

## How Has This Been Tested?

### Loom video

https://www.loom.com/share/fc86e53853ad49e6acf6de57ebbd8fcb?sid=6702f896-d1a3-4c5a-9eb7-b96b5ed91531


## Checklist:

- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my code
- [x] I have commented on my code, particularly in hard-to-understand
areas
- [ ] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [x] New and existing unit tests pass locally with my changes
- [ ] Any dependent changes have been merged and published in downstream
modules
---
 .../widgets/conversation/VariableList.vue     |  8 +++--
 app/javascript/dashboard/helper/commons.js    | 13 +++++++
 .../dashboard/helper/specs/commons.spec.js    | 35 +++++++++++++++++++
 3 files changed, 54 insertions(+), 2 deletions(-)

diff --git a/app/javascript/dashboard/components/widgets/conversation/VariableList.vue b/app/javascript/dashboard/components/widgets/conversation/VariableList.vue
index 1b935ad29..30e45749b 100644
--- a/app/javascript/dashboard/components/widgets/conversation/VariableList.vue
+++ b/app/javascript/dashboard/components/widgets/conversation/VariableList.vue
@@ -1,6 +1,7 @@
 <script>
 import { mapGetters } from 'vuex';
 import { MESSAGE_VARIABLES } from 'shared/constants/messages';
+import { sanitizeVariableSearchKey } from 'dashboard/helper/commons';
 import MentionBox from '../mentions/MentionBox.vue';
 
 export default {
@@ -16,6 +17,9 @@ export default {
     ...mapGetters({
       customAttributes: 'attributes/getAttributes',
     }),
+    sanitizedSearchKey() {
+      return sanitizeVariableSearchKey(this.searchKey);
+    },
     items() {
       return [
         ...this.standardAttributeVariables,
@@ -25,8 +29,8 @@ export default {
     standardAttributeVariables() {
       return MESSAGE_VARIABLES.filter(variable => {
         return (
-          variable.label.includes(this.searchKey) ||
-          variable.key.includes(this.searchKey)
+          variable.label.includes(this.sanitizedSearchKey) ||
+          variable.key.includes(this.sanitizedSearchKey)
         );
       }).map(variable => ({
         label: variable.key,
diff --git a/app/javascript/dashboard/helper/commons.js b/app/javascript/dashboard/helper/commons.js
index 3539bc822..b12d1aa3d 100644
--- a/app/javascript/dashboard/helper/commons.js
+++ b/app/javascript/dashboard/helper/commons.js
@@ -83,3 +83,16 @@ export const convertToPortalSlug = text => {
     .replace(/[^\w ]+/g, '')
     .replace(/ +/g, '-');
 };
+
+/**
+ * Strip curly braces, commas and leading/trailing whitespace from a search key.
+ * Eg. "{{contact.name}}," => "contact.name"
+ * @param {string} searchKey
+ * @returns {string}
+ */
+export const sanitizeVariableSearchKey = (searchKey = '') => {
+  return searchKey
+    .replace(/[{}]/g, '') // remove all curly braces
+    .replace(/,/g, '') // remove commas
+    .trim();
+};
diff --git a/app/javascript/dashboard/helper/specs/commons.spec.js b/app/javascript/dashboard/helper/specs/commons.spec.js
index 46065660f..466cdcf45 100644
--- a/app/javascript/dashboard/helper/specs/commons.spec.js
+++ b/app/javascript/dashboard/helper/specs/commons.spec.js
@@ -4,6 +4,7 @@ import {
   convertToAttributeSlug,
   convertToCategorySlug,
   convertToPortalSlug,
+  sanitizeVariableSearchKey,
 } from '../commons';
 
 describe('#getTypingUsersText', () => {
@@ -107,3 +108,37 @@ describe('convertToPortalSlug', () => {
     expect(convertToPortalSlug('Room rental')).toBe('room-rental');
   });
 });
+
+describe('sanitizeVariableSearchKey', () => {
+  it('removes braces', () => {
+    expect(sanitizeVariableSearchKey('{{contact.name}}')).toBe('contact.name');
+  });
+
+  it('removes right braces', () => {
+    expect(sanitizeVariableSearchKey('contact.name}}')).toBe('contact.name');
+  });
+
+  it('removes braces, comma and whitespace', () => {
+    expect(sanitizeVariableSearchKey(' {{contact.name }},')).toBe(
+      'contact.name'
+    );
+  });
+
+  it('trims whitespace', () => {
+    expect(sanitizeVariableSearchKey('  contact.name  ')).toBe('contact.name');
+  });
+
+  it('handles multiple commas', () => {
+    expect(sanitizeVariableSearchKey('{{contact.name}},,')).toBe(
+      'contact.name'
+    );
+  });
+
+  it('returns empty string when only braces/commas/whitespace', () => {
+    expect(sanitizeVariableSearchKey(' {  }, , ')).toBe('');
+  });
+
+  it('returns empty string for undefined input', () => {
+    expect(sanitizeVariableSearchKey()).toBe('');
+  });
+});

From 3e993ead0ff4af52b5147dd6dbca4a74e2e406fc Mon Sep 17 00:00:00 2001
From: Pranav <pranav@chatwoot.com>
Date: Thu, 3 Jul 2025 12:41:12 -0700
Subject: [PATCH 23/31] feat: OG Image in Chatwoot Help Center (#11826)

_Note: This is only available for Cloud version of Chatwoot._



![image](https://github.com/user-attachments/assets/b7d61035-8682-4dbd-9460-4f8546ca6a98)
---
 .../api/v1/portals/articles_controller.rb     |  4 +-
 .../api/v1/portals/categories_controller.rb   |  4 +-
 .../public/api/v1/portals_controller.rb       |  4 +-
 app/helpers/portal_helper.rb                  | 17 +++++++
 .../public/api/v1/portals/_hero.html.erb      | 11 +++++
 .../api/v1/portals/articles/show.html.erb     | 10 +++++
 .../api/v1/portals/categories/show.html.erb   | 11 ++++-
 config/installation_config.yml                | 14 ++++++
 .../super_admin/app_configs_controller.rb     |  3 +-
 spec/helpers/portal_helper_spec.rb            | 45 ++++++++++++++++---
 10 files changed, 112 insertions(+), 11 deletions(-)

diff --git a/app/controllers/public/api/v1/portals/articles_controller.rb b/app/controllers/public/api/v1/portals/articles_controller.rb
index 02023559b..e6cc2aa69 100644
--- a/app/controllers/public/api/v1/portals/articles_controller.rb
+++ b/app/controllers/public/api/v1/portals/articles_controller.rb
@@ -17,7 +17,9 @@ class Public::Api::V1::Portals::ArticlesController < Public::Api::V1::Portals::B
     limit_results
   end
 
-  def show; end
+  def show
+    @og_image_url = helpers.set_og_image_url(@portal.name, @article.title)
+  end
 
   def tracking_pixel
     @article = @portal.articles.find_by(slug: permitted_params[:article_slug])
diff --git a/app/controllers/public/api/v1/portals/categories_controller.rb b/app/controllers/public/api/v1/portals/categories_controller.rb
index c3a7b59e9..ebfcb310a 100644
--- a/app/controllers/public/api/v1/portals/categories_controller.rb
+++ b/app/controllers/public/api/v1/portals/categories_controller.rb
@@ -8,7 +8,9 @@ class Public::Api::V1::Portals::CategoriesController < Public::Api::V1::Portals:
     @categories = @portal.categories.order(position: :asc)
   end
 
-  def show; end
+  def show
+    @og_image_url = helpers.set_og_image_url(@portal.name, @category.name)
+  end
 
   private
 
diff --git a/app/controllers/public/api/v1/portals_controller.rb b/app/controllers/public/api/v1/portals_controller.rb
index e8fb867cb..df4552432 100644
--- a/app/controllers/public/api/v1/portals_controller.rb
+++ b/app/controllers/public/api/v1/portals_controller.rb
@@ -4,7 +4,9 @@ class Public::Api::V1::PortalsController < Public::Api::V1::Portals::BaseControl
   before_action :redirect_to_portal_with_locale, only: [:show]
   layout 'portal'
 
-  def show; end
+  def show
+    @og_image_url = helpers.set_og_image_url('', @portal.header_text)
+  end
 
   def sitemap
     @help_center_url = @portal.custom_domain || ChatwootApp.help_center_root
diff --git a/app/helpers/portal_helper.rb b/app/helpers/portal_helper.rb
index 2b1ab7b21..3ed303556 100644
--- a/app/helpers/portal_helper.rb
+++ b/app/helpers/portal_helper.rb
@@ -1,4 +1,21 @@
 module PortalHelper
+  def set_og_image_url(portal_name, title)
+    cdn_url = GlobalConfig.get('OG_IMAGE_CDN_URL')['OG_IMAGE_CDN_URL']
+    return if cdn_url.blank?
+
+    client_ref = GlobalConfig.get('OG_IMAGE_CLIENT_REF')['OG_IMAGE_CLIENT_REF']
+
+    uri = URI.parse(cdn_url)
+    uri.path = '/og'
+    uri.query = URI.encode_www_form(
+      clientRef: client_ref,
+      title: title,
+      portalName: portal_name
+    )
+
+    uri.to_s
+  end
+
   def generate_portal_bg_color(portal_color, theme)
     base_color = theme == 'dark' ? 'black' : 'white'
     "color-mix(in srgb, #{portal_color} 20%, #{base_color})"
diff --git a/app/views/public/api/v1/portals/_hero.html.erb b/app/views/public/api/v1/portals/_hero.html.erb
index f71574692..0ce5ddde6 100644
--- a/app/views/public/api/v1/portals/_hero.html.erb
+++ b/app/views/public/api/v1/portals/_hero.html.erb
@@ -1,4 +1,15 @@
 <% if !@is_plain_layout_enabled %>
+<% content_for :head do %>
+  <title><%= @portal.name %></title>
+  <meta name="title" content="<%= @portal.name %>">
+
+  <% if @og_image_url.present? %>
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="og:image" content="<%= @og_image_url.html_safe %>">
+    <meta property="og:image" content="<%= @og_image_url.html_safe %>">
+    <meta name="twitter:image" content="<%= @og_image_url.html_safe %>">
+  <% end %>
+<% end %>
 <section id="portal-bg" class="w-full bg-white dark:bg-slate-900 shadow-inner">
   <div id="portal-bg-gradient" class="pt-8 pb-8 md:pt-14 md:pb-6 min-h-[240px] md:min-h-[260px]">
     <div class="mx-auto max-w-5xl px-4 md:px-8 flex flex-col items-start">
diff --git a/app/views/public/api/v1/portals/articles/show.html.erb b/app/views/public/api/v1/portals/articles/show.html.erb
index 080ab4a6a..9568709b9 100644
--- a/app/views/public/api/v1/portals/articles/show.html.erb
+++ b/app/views/public/api/v1/portals/articles/show.html.erb
@@ -2,13 +2,23 @@
   <title><%= @article.title %> | <%= @portal.name %></title>
   <% if @article.meta["title"].present? %>
     <meta name="title" content="<%= @article.meta["title"] %>">
+    <meta property="og:title" content="<%= @article.meta["title"] %>">
+    <meta name="twitter:title" content="<%= @article.meta["title"] %>">
   <% end %>
   <% if @article.meta["description"].present? %>
     <meta name="description" content="<%= @article.meta["description"] %>">
+    <meta property="og:description" content="<%= @article.meta["description"] %>">
+    <meta name="twitter:description" content="<%= @article.meta["description"] %>">
   <% end %>
   <% if @article.meta["tags"].present? %>
     <meta name="tags" content="<%= @article.meta["tags"].join(',') %>">
   <% end %>
+  <% if @og_image_url.present? %>
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="og:image" content="<%= @og_image_url.html_safe %>">
+    <meta property="og:image" content="<%= @og_image_url.html_safe %>">
+    <meta name="twitter:image" content="<%= @og_image_url.html_safe %>">
+  <% end %>
 <% end %>
 
 <% if !@is_plain_layout_enabled %>
diff --git a/app/views/public/api/v1/portals/categories/show.html.erb b/app/views/public/api/v1/portals/categories/show.html.erb
index 3e36b4753..702483355 100644
--- a/app/views/public/api/v1/portals/categories/show.html.erb
+++ b/app/views/public/api/v1/portals/categories/show.html.erb
@@ -1,7 +1,16 @@
 <% content_for :head do %>
   <title><%= @category.name %> | <%= @portal.name %></title>
+  <meta name="title" content="<%= @category.name %> | <%= @portal.name %>">
   <% if @category.description.present? %>
     <meta name="description" content="<%= @category.description %>">
+    <meta property="og:description" content="<%= @category.description %>">
+    <meta name="twitter:description" content="<%= @category.description %>">
+  <% end %>
+  <% if @og_image_url.present? %>
+    <meta name="twitter:card" content="summary_large_image">
+    <meta name="og:image" content="<%= @og_image_url.html_safe %>">
+    <meta property="og:image" content="<%= @og_image_url.html_safe %>">
+    <meta name="twitter:image" content="<%= @og_image_url.html_safe %>">
   <% end %>
 <% end %>
 
@@ -35,7 +44,7 @@
           <span class="text-sm text-slate-600 dark:text-slate-400 font-medium flex items-center"><%= I18n.t('public_portal.common.last_updated_on', last_updated_on: article.updated_at.strftime("%b %d, %Y")) %></span>
         </div>
       </a>
-    </div>  
+    </div>
     <% end %>
     <% end %>
   </div>
diff --git a/config/installation_config.yml b/config/installation_config.yml
index a089a4ea7..58d593502 100644
--- a/config/installation_config.yml
+++ b/config/installation_config.yml
@@ -360,3 +360,17 @@
   value: 'v22.0'
   locked: true
 # ------- End of Instagram Channel Related Config ------- #
+
+# ------- OG Image Related Config ------- #
+- name: OG_IMAGE_CDN_URL
+  display_title: 'OG Image CDN URL'
+  description: 'The CDN URL for serving OG images'
+  value: ''
+  locked: false
+- name: OG_IMAGE_CLIENT_REF
+  display_title: 'OG Image Client Reference'
+  description: 'Token used to block unauthorized access to OG images'
+  value: ''
+  locked: false
+  type: secret
+# ------- End of OG Image Related Config ------- #
diff --git a/enterprise/app/controllers/enterprise/super_admin/app_configs_controller.rb b/enterprise/app/controllers/enterprise/super_admin/app_configs_controller.rb
index 2454295dc..67ce3a6a9 100644
--- a/enterprise/app/controllers/enterprise/super_admin/app_configs_controller.rb
+++ b/enterprise/app/controllers/enterprise/super_admin/app_configs_controller.rb
@@ -33,6 +33,7 @@ module Enterprise::SuperAdmin::AppConfigsController
 
   def internal_config_options
     %w[CHATWOOT_INBOX_TOKEN CHATWOOT_INBOX_HMAC_KEY ANALYTICS_TOKEN CLEARBIT_API_KEY DASHBOARD_SCRIPTS INACTIVE_WHATSAPP_NUMBERS BLOCKED_EMAIL_DOMAINS
-       CAPTAIN_CLOUD_PLAN_LIMITS ACCOUNT_SECURITY_NOTIFICATION_WEBHOOK_URL CHATWOOT_INSTANCE_ADMIN_EMAIL]
+       CAPTAIN_CLOUD_PLAN_LIMITS ACCOUNT_SECURITY_NOTIFICATION_WEBHOOK_URL CHATWOOT_INSTANCE_ADMIN_EMAIL
+       OG_IMAGE_CDN_URL OG_IMAGE_CLIENT_REF]
   end
 end
diff --git a/spec/helpers/portal_helper_spec.rb b/spec/helpers/portal_helper_spec.rb
index dfd37138a..241b4c6dd 100644
--- a/spec/helpers/portal_helper_spec.rb
+++ b/spec/helpers/portal_helper_spec.rb
@@ -250,12 +250,45 @@ describe PortalHelper do
   describe '#thumbnail_bg_color' do
     it 'returns the correct color based on username length' do
       expect(helper.thumbnail_bg_color('')).to be_in(['#6D95BA', '#A4C3C3', '#E19191'])
-      expect(helper.thumbnail_bg_color('Joe')).to eq('#6D95BA') # Length 3, so index is 0
-      expect(helper.thumbnail_bg_color('John')).to eq('#A4C3C3') # Length 4, so index is 1
-      expect(helper.thumbnail_bg_color('Jane james')).to eq('#A4C3C3') # Length 10, so index is 1
-      expect(helper.thumbnail_bg_color('Jane_123')).to eq('#E19191') # Length 8, so index is 2
-      expect(helper.thumbnail_bg_color('AlexanderTheGreat')).to eq('#E19191') # Length 17, so index is 2
-      expect(helper.thumbnail_bg_color('Reginald John Sans')).to eq('#6D95BA') # Length 18, so index is 0
+      expect(helper.thumbnail_bg_color('Joe')).to eq('#6D95BA')
+      expect(helper.thumbnail_bg_color('John')).to eq('#A4C3C3')
+      expect(helper.thumbnail_bg_color('Jane james')).to eq('#A4C3C3')
+      expect(helper.thumbnail_bg_color('Jane_123')).to eq('#E19191')
+      expect(helper.thumbnail_bg_color('AlexanderTheGreat')).to eq('#E19191')
+      expect(helper.thumbnail_bg_color('Reginald John Sans')).to eq('#6D95BA')
+    end
+  end
+
+  describe '#set_og_image_url' do
+    let(:portal_name) { 'Chatwoot Portal' }
+    let(:title) { 'Welcome to Chatwoot' }
+
+    context 'when CDN URL is present' do
+      before do
+        InstallationConfig.create!(name: 'OG_IMAGE_CDN_URL', value: 'https://cdn.example.com')
+        InstallationConfig.create!(name: 'OG_IMAGE_CLIENT_REF', value: 'client-123')
+      end
+
+      it 'returns the composed OG image URL with correct params' do
+        result = helper.set_og_image_url(portal_name, title)
+        uri = URI.parse(result)
+        expect(uri.path).to eq('/og')
+        params = Rack::Utils.parse_query(uri.query)
+        expect(params['clientRef']).to eq('client-123')
+        expect(params['title']).to eq(title)
+        expect(params['portalName']).to eq(portal_name)
+      end
+    end
+
+    context 'when CDN URL is blank' do
+      before do
+        InstallationConfig.create!(name: 'OG_IMAGE_CDN_URL', value: '')
+        InstallationConfig.create!(name: 'OG_IMAGE_CLIENT_REF', value: 'client-123')
+      end
+
+      it 'returns nil' do
+        expect(helper.set_og_image_url(portal_name, title)).to be_nil
+      end
     end
   end
 end

From b8814a8bd598ab42b11232bf8bcd86a58a7a929d Mon Sep 17 00:00:00 2001
From: Muhsin Keloth <muhsinkeramam@gmail.com>
Date: Fri, 4 Jul 2025 10:35:11 +0530
Subject: [PATCH 24/31] fix: Escape closing bracket in mention regex (#11877)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

**Summary**
- Fixed Ruby warning about unescaped closing bracket in character class
within `MENTION_REGEX`
- Properly escaped the `]` character in the regex pattern to follow Ruby
regex syntax standards

**Changes**
- Updated `MENTION_REGEX` in `lib/regex_helper.rb` to escape the closing
bracket in character class `[^]]+` → `[^\\]]+`
---
 lib/regex_helper.rb | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/lib/regex_helper.rb b/lib/regex_helper.rb
index 5e4c2abf0..2eeb895ea 100644
--- a/lib/regex_helper.rb
+++ b/lib/regex_helper.rb
@@ -11,7 +11,7 @@ module RegexHelper
   # Uses [^]]+ to match any characters except ] in display name to support emojis
   # NOTE: Still used by Slack integration (lib/integrations/slack/send_on_slack_service.rb)
   # while notifications use CommonMarker for better markdown processing
-  MENTION_REGEX = Regexp.new('\[(@[^]]+)\]\(mention://(?:user|team)/\d+/([^)]+)\)')
+  MENTION_REGEX = Regexp.new('\[(@[^\\]]+)\]\(mention://(?:user|team)/\d+/([^)]+)\)')
 
   TWILIO_CHANNEL_SMS_REGEX = Regexp.new('^\+\d{1,15}\z')
   TWILIO_CHANNEL_WHATSAPP_REGEX = Regexp.new('^whatsapp:\+\d{1,15}\z')

From b72848513fd284aa98c1f860d06cbec214e23246 Mon Sep 17 00:00:00 2001
From: Pranav <pranav@chatwoot.com>
Date: Sun, 6 Jul 2025 19:30:27 -0700
Subject: [PATCH 25/31] fix: Show billing upgrade page if there is a mismatch
 in the user count (#11886)

Disable features/show billing upgrade for accounts with more users than
the one in the license.

---------

Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com>
---
 app/javascript/dashboard/i18n/locale/en/generalSettings.json | 2 +-
 app/javascript/dashboard/i18n/locale/ru/generalSettings.json | 2 +-
 .../dashboard/routes/dashboard/upgrade/UpgradePage.vue       | 4 +++-
 .../app/controllers/enterprise/api/v1/accounts_controller.rb | 5 ++++-
 .../enterprise/api/v1/accounts_controller_spec.rb            | 5 ++++-
 5 files changed, 13 insertions(+), 5 deletions(-)

diff --git a/app/javascript/dashboard/i18n/locale/en/generalSettings.json b/app/javascript/dashboard/i18n/locale/en/generalSettings.json
index c0c4d247d..9055574c5 100644
--- a/app/javascript/dashboard/i18n/locale/en/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/en/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/ru/generalSettings.json b/app/javascript/dashboard/i18n/locale/ru/generalSettings.json
index b46d06a9d..ea6b9fca1 100644
--- a/app/javascript/dashboard/i18n/locale/ru/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/ru/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Настройки аккаунта",
diff --git a/app/javascript/dashboard/routes/dashboard/upgrade/UpgradePage.vue b/app/javascript/dashboard/routes/dashboard/upgrade/UpgradePage.vue
index c23d3e76b..aa2686b83 100644
--- a/app/javascript/dashboard/routes/dashboard/upgrade/UpgradePage.vue
+++ b/app/javascript/dashboard/routes/dashboard/upgrade/UpgradePage.vue
@@ -58,7 +58,9 @@ const limitExceededMessage = computed(() => {
   } else if (testLimit(nonWebInboxes)) {
     message = t('GENERAL_SETTINGS.LIMIT_MESSAGES.INBOXES');
   } else if (testLimit(agents)) {
-    message = t('GENERAL_SETTINGS.LIMIT_MESSAGES.AGENTS');
+    message = t('GENERAL_SETTINGS.LIMIT_MESSAGES.AGENTS', {
+      allowedAgents: agents.allowed,
+    });
   }
 
   return message;
diff --git a/enterprise/app/controllers/enterprise/api/v1/accounts_controller.rb b/enterprise/app/controllers/enterprise/api/v1/accounts_controller.rb
index 95b85a472..339fbdf3c 100644
--- a/enterprise/app/controllers/enterprise/api/v1/accounts_controller.rb
+++ b/enterprise/app/controllers/enterprise/api/v1/accounts_controller.rb
@@ -65,7 +65,10 @@ class Enterprise::Api::V1::AccountsController < Api::BaseController
     {
       'conversation' => {},
       'non_web_inboxes' => {},
-      'agents' => {},
+      'agents' => {
+        'allowed' => @account.usage_limits[:agents],
+        'consumed' => agents(@account)
+      },
       'captain' => @account.usage_limits[:captain]
     }
   end
diff --git a/spec/enterprise/controllers/enterprise/api/v1/accounts_controller_spec.rb b/spec/enterprise/controllers/enterprise/api/v1/accounts_controller_spec.rb
index 0bd917c06..33941cee8 100644
--- a/spec/enterprise/controllers/enterprise/api/v1/accounts_controller_spec.rb
+++ b/spec/enterprise/controllers/enterprise/api/v1/accounts_controller_spec.rb
@@ -199,7 +199,10 @@ RSpec.describe 'Enterprise Billing APIs', type: :request do
           expected_response = {
             'id' => account.id,
             'limits' => {
-              'agents' => {},
+              'agents' => {
+                'allowed' => account.usage_limits[:agents],
+                'consumed' => account.users.count
+              },
               'conversation' => {},
               'captain' => {
                 'documents' => { 'consumed' => 0, 'current_available' => ChatwootApp.max_limit, 'total_count' => ChatwootApp.max_limit },

From e4ba80e2f021699a5fe22cd1a4123b7ecf9d0a2e Mon Sep 17 00:00:00 2001
From: Chatwoot Bot <92152627+chatwoot-bot@users.noreply.github.com>
Date: Mon, 7 Jul 2025 14:34:25 -0700
Subject: [PATCH 26/31] chore: Update translations (#11893)

---
 .../dashboard/i18n/locale/am/automation.json  |   3 +-
 .../dashboard/i18n/locale/am/components.json  |   3 +
 .../i18n/locale/am/conversation.json          |   4 +
 .../i18n/locale/am/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/am/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/am/integrations.json          |  10 ++
 .../dashboard/i18n/locale/ar/automation.json  |   3 +-
 .../dashboard/i18n/locale/ar/components.json  |   3 +
 .../i18n/locale/ar/conversation.json          |   4 +
 .../i18n/locale/ar/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/ar/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/ar/integrations.json          |  10 ++
 .../dashboard/i18n/locale/az/automation.json  |   3 +-
 .../dashboard/i18n/locale/az/components.json  |   3 +
 .../i18n/locale/az/conversation.json          |   4 +
 .../i18n/locale/az/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/az/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/az/integrations.json          |  10 ++
 .../dashboard/i18n/locale/bg/automation.json  |   3 +-
 .../dashboard/i18n/locale/bg/components.json  |   3 +
 .../i18n/locale/bg/conversation.json          |   4 +
 .../i18n/locale/bg/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/bg/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/bg/integrations.json          |  10 ++
 .../dashboard/i18n/locale/ca/automation.json  |   3 +-
 .../dashboard/i18n/locale/ca/components.json  |   3 +
 .../i18n/locale/ca/conversation.json          |   4 +
 .../i18n/locale/ca/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/ca/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/ca/integrations.json          |  10 ++
 .../dashboard/i18n/locale/cs/automation.json  |   3 +-
 .../dashboard/i18n/locale/cs/components.json  |   3 +
 .../i18n/locale/cs/conversation.json          |   4 +
 .../i18n/locale/cs/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/cs/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/cs/integrations.json          |  10 ++
 .../dashboard/i18n/locale/da/automation.json  |   3 +-
 .../dashboard/i18n/locale/da/components.json  |   3 +
 .../i18n/locale/da/conversation.json          |   4 +
 .../i18n/locale/da/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/da/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/da/integrations.json          |  10 ++
 .../dashboard/i18n/locale/de/automation.json  |   3 +-
 .../dashboard/i18n/locale/de/components.json  |   3 +
 .../dashboard/i18n/locale/de/contact.json     |  14 +--
 .../i18n/locale/de/conversation.json          |  22 ++--
 .../i18n/locale/de/generalSettings.json       |  18 ++--
 .../dashboard/i18n/locale/de/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/de/integrations.json          |  10 ++
 .../dashboard/i18n/locale/el/automation.json  |   3 +-
 .../dashboard/i18n/locale/el/components.json  |   3 +
 .../i18n/locale/el/conversation.json          |   4 +
 .../i18n/locale/el/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/el/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/el/integrations.json          |  10 ++
 .../dashboard/i18n/locale/es/auditLogs.json   |   2 +-
 .../dashboard/i18n/locale/es/automation.json  |  35 +++---
 .../dashboard/i18n/locale/es/components.json  |  11 +-
 .../dashboard/i18n/locale/es/contact.json     |  14 +--
 .../i18n/locale/es/conversation.json          |  24 +++--
 .../i18n/locale/es/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/es/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/es/integrations.json          |  10 ++
 .../dashboard/i18n/locale/es/macros.json      |  14 +--
 .../dashboard/i18n/locale/es/settings.json    |  10 +-
 .../dashboard/i18n/locale/fa/automation.json  |   3 +-
 .../dashboard/i18n/locale/fa/components.json  |   3 +
 .../i18n/locale/fa/conversation.json          |   4 +
 .../i18n/locale/fa/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/fa/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/fa/integrations.json          |  10 ++
 .../dashboard/i18n/locale/fi/automation.json  |   3 +-
 .../dashboard/i18n/locale/fi/components.json  |   3 +
 .../i18n/locale/fi/conversation.json          |   4 +
 .../i18n/locale/fi/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/fi/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/fi/integrations.json          |  10 ++
 .../dashboard/i18n/locale/fr/agentBots.json   |  12 +--
 .../dashboard/i18n/locale/fr/automation.json  |   3 +-
 .../dashboard/i18n/locale/fr/components.json  |   3 +
 .../i18n/locale/fr/conversation.json          |   4 +
 .../i18n/locale/fr/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/fr/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/fr/integrations.json          |  10 ++
 .../dashboard/i18n/locale/fr/settings.json    |   4 +-
 .../dashboard/i18n/locale/he/automation.json  |   3 +-
 .../dashboard/i18n/locale/he/components.json  |   3 +
 .../i18n/locale/he/conversation.json          |   4 +
 .../i18n/locale/he/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/he/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/he/integrations.json          |  10 ++
 .../dashboard/i18n/locale/hi/automation.json  |   3 +-
 .../dashboard/i18n/locale/hi/components.json  |   3 +
 .../i18n/locale/hi/conversation.json          |   4 +
 .../i18n/locale/hi/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/hi/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/hi/integrations.json          |  10 ++
 .../dashboard/i18n/locale/hr/automation.json  |   3 +-
 .../dashboard/i18n/locale/hr/components.json  |   3 +
 .../i18n/locale/hr/conversation.json          |   4 +
 .../i18n/locale/hr/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/hr/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/hr/integrations.json          |  10 ++
 .../dashboard/i18n/locale/hu/automation.json  |   3 +-
 .../dashboard/i18n/locale/hu/components.json  |   3 +
 .../i18n/locale/hu/conversation.json          |   4 +
 .../i18n/locale/hu/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/hu/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/hu/integrations.json          |  10 ++
 .../dashboard/i18n/locale/hy/automation.json  |   3 +-
 .../dashboard/i18n/locale/hy/components.json  |   3 +
 .../i18n/locale/hy/conversation.json          |   4 +
 .../i18n/locale/hy/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/hy/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/hy/integrations.json          |  10 ++
 .../dashboard/i18n/locale/id/automation.json  |   3 +-
 .../dashboard/i18n/locale/id/components.json  |   3 +
 .../i18n/locale/id/conversation.json          |   4 +
 .../i18n/locale/id/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/id/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/id/integrations.json          |  10 ++
 .../dashboard/i18n/locale/is/automation.json  |   3 +-
 .../dashboard/i18n/locale/is/components.json  |   3 +
 .../i18n/locale/is/conversation.json          |   4 +
 .../i18n/locale/is/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/is/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/is/integrations.json          |  10 ++
 .../dashboard/i18n/locale/it/automation.json  |   3 +-
 .../dashboard/i18n/locale/it/components.json  |   3 +
 .../i18n/locale/it/conversation.json          |   4 +
 .../i18n/locale/it/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/it/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/it/integrations.json          |  10 ++
 .../dashboard/i18n/locale/ja/automation.json  |   3 +-
 .../dashboard/i18n/locale/ja/components.json  |   3 +
 .../i18n/locale/ja/conversation.json          |   4 +
 .../i18n/locale/ja/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/ja/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/ja/integrations.json          |  10 ++
 .../dashboard/i18n/locale/ka/automation.json  |   3 +-
 .../dashboard/i18n/locale/ka/components.json  |   3 +
 .../i18n/locale/ka/conversation.json          |   4 +
 .../i18n/locale/ka/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/ka/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/ka/integrations.json          |  10 ++
 .../dashboard/i18n/locale/ko/automation.json  |   3 +-
 .../dashboard/i18n/locale/ko/components.json  |   3 +
 .../i18n/locale/ko/conversation.json          |   4 +
 .../i18n/locale/ko/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/ko/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/ko/integrations.json          |  10 ++
 .../dashboard/i18n/locale/lt/automation.json  |   3 +-
 .../dashboard/i18n/locale/lt/components.json  |   3 +
 .../i18n/locale/lt/conversation.json          |   4 +
 .../i18n/locale/lt/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/lt/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/lt/integrations.json          |  10 ++
 .../dashboard/i18n/locale/lv/automation.json  |   3 +-
 .../dashboard/i18n/locale/lv/components.json  |   3 +
 .../i18n/locale/lv/conversation.json          |   4 +
 .../i18n/locale/lv/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/lv/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/lv/integrations.json          |  10 ++
 .../dashboard/i18n/locale/ml/automation.json  |   3 +-
 .../dashboard/i18n/locale/ml/components.json  |   3 +
 .../i18n/locale/ml/conversation.json          |   4 +
 .../i18n/locale/ml/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/ml/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/ml/integrations.json          |  10 ++
 .../dashboard/i18n/locale/ms/automation.json  |   3 +-
 .../dashboard/i18n/locale/ms/components.json  |   3 +
 .../i18n/locale/ms/conversation.json          |   4 +
 .../i18n/locale/ms/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/ms/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/ms/integrations.json          |  10 ++
 .../dashboard/i18n/locale/ne/automation.json  |   3 +-
 .../dashboard/i18n/locale/ne/components.json  |   3 +
 .../i18n/locale/ne/conversation.json          |   4 +
 .../i18n/locale/ne/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/ne/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/ne/integrations.json          |  10 ++
 .../dashboard/i18n/locale/nl/automation.json  |   3 +-
 .../dashboard/i18n/locale/nl/components.json  |   3 +
 .../i18n/locale/nl/conversation.json          |   4 +
 .../i18n/locale/nl/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/nl/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/nl/integrations.json          |  10 ++
 .../dashboard/i18n/locale/no/automation.json  |   3 +-
 .../dashboard/i18n/locale/no/components.json  |   3 +
 .../i18n/locale/no/conversation.json          |   4 +
 .../i18n/locale/no/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/no/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/no/integrations.json          |  10 ++
 .../dashboard/i18n/locale/pl/automation.json  |   3 +-
 .../dashboard/i18n/locale/pl/components.json  |   3 +
 .../i18n/locale/pl/conversation.json          |   4 +
 .../i18n/locale/pl/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/pl/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/pl/integrations.json          |  10 ++
 .../dashboard/i18n/locale/pt/agentBots.json   |  40 +++----
 .../dashboard/i18n/locale/pt/auditLogs.json   |   2 +-
 .../dashboard/i18n/locale/pt/automation.json  |  33 +++---
 .../dashboard/i18n/locale/pt/components.json  |  11 +-
 .../dashboard/i18n/locale/pt/contact.json     |  24 ++---
 .../i18n/locale/pt/conversation.json          |  24 +++--
 .../i18n/locale/pt/generalSettings.json       |  90 ++++++++--------
 .../dashboard/i18n/locale/pt/helpCenter.json  |   2 +-
 .../dashboard/i18n/locale/pt/inboxMgmt.json   |  77 ++++++++++----
 .../i18n/locale/pt/integrations.json          | 100 ++++++++++--------
 .../dashboard/i18n/locale/pt/macros.json      |  18 ++--
 .../dashboard/i18n/locale/pt/report.json      |   2 +-
 .../dashboard/i18n/locale/pt/settings.json    |  10 +-
 .../i18n/locale/pt_BR/automation.json         |   3 +-
 .../i18n/locale/pt_BR/components.json         |   3 +
 .../i18n/locale/pt_BR/conversation.json       |   6 +-
 .../i18n/locale/pt_BR/generalSettings.json    |   2 +-
 .../i18n/locale/pt_BR/inboxMgmt.json          |  43 +++++++-
 .../i18n/locale/pt_BR/integrations.json       |  10 ++
 .../dashboard/i18n/locale/pt_BR/report.json   |   2 +-
 .../dashboard/i18n/locale/ro/automation.json  |   3 +-
 .../dashboard/i18n/locale/ro/components.json  |   3 +
 .../i18n/locale/ro/conversation.json          |   4 +
 .../i18n/locale/ro/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/ro/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/ro/integrations.json          |  10 ++
 .../dashboard/i18n/locale/ru/automation.json  |   3 +-
 .../dashboard/i18n/locale/ru/components.json  |   3 +
 .../i18n/locale/ru/conversation.json          |   4 +
 .../dashboard/i18n/locale/ru/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/ru/integrations.json          |  10 ++
 .../dashboard/i18n/locale/sh/automation.json  |   3 +-
 .../dashboard/i18n/locale/sh/components.json  |   3 +
 .../i18n/locale/sh/conversation.json          |   4 +
 .../i18n/locale/sh/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/sh/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/sh/integrations.json          |  10 ++
 .../dashboard/i18n/locale/sk/automation.json  |   3 +-
 .../dashboard/i18n/locale/sk/components.json  |   3 +
 .../i18n/locale/sk/conversation.json          |   4 +
 .../i18n/locale/sk/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/sk/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/sk/integrations.json          |  10 ++
 .../dashboard/i18n/locale/sl/automation.json  |   3 +-
 .../dashboard/i18n/locale/sl/components.json  |   3 +
 .../i18n/locale/sl/conversation.json          |   4 +
 .../i18n/locale/sl/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/sl/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/sl/integrations.json          |  10 ++
 .../dashboard/i18n/locale/sq/automation.json  |   3 +-
 .../dashboard/i18n/locale/sq/components.json  |   3 +
 .../i18n/locale/sq/conversation.json          |   4 +
 .../i18n/locale/sq/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/sq/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/sq/integrations.json          |  10 ++
 .../dashboard/i18n/locale/sr/automation.json  |   3 +-
 .../dashboard/i18n/locale/sr/components.json  |   3 +
 .../i18n/locale/sr/conversation.json          |   4 +
 .../i18n/locale/sr/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/sr/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/sr/integrations.json          |  10 ++
 .../dashboard/i18n/locale/sv/automation.json  |   3 +-
 .../dashboard/i18n/locale/sv/components.json  |   3 +
 .../i18n/locale/sv/conversation.json          |   4 +
 .../i18n/locale/sv/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/sv/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/sv/integrations.json          |  10 ++
 .../dashboard/i18n/locale/ta/automation.json  |   3 +-
 .../dashboard/i18n/locale/ta/components.json  |   3 +
 .../i18n/locale/ta/conversation.json          |   4 +
 .../i18n/locale/ta/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/ta/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/ta/integrations.json          |  10 ++
 .../dashboard/i18n/locale/th/automation.json  |   3 +-
 .../dashboard/i18n/locale/th/components.json  |   3 +
 .../i18n/locale/th/conversation.json          |   4 +
 .../i18n/locale/th/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/th/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/th/integrations.json          |  10 ++
 .../dashboard/i18n/locale/tl/automation.json  |   3 +-
 .../dashboard/i18n/locale/tl/components.json  |   3 +
 .../i18n/locale/tl/conversation.json          |   4 +
 .../i18n/locale/tl/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/tl/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/tl/integrations.json          |  10 ++
 .../dashboard/i18n/locale/tr/automation.json  |   3 +-
 .../dashboard/i18n/locale/tr/components.json  |   3 +
 .../i18n/locale/tr/conversation.json          |   6 +-
 .../i18n/locale/tr/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/tr/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/tr/integrations.json          |  20 +++-
 .../dashboard/i18n/locale/tr/report.json      |   2 +-
 .../dashboard/i18n/locale/uk/automation.json  |   3 +-
 .../dashboard/i18n/locale/uk/components.json  |   3 +
 .../i18n/locale/uk/conversation.json          |   4 +
 .../i18n/locale/uk/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/uk/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/uk/integrations.json          |  10 ++
 .../dashboard/i18n/locale/ur/automation.json  |   3 +-
 .../dashboard/i18n/locale/ur/components.json  |   3 +
 .../i18n/locale/ur/conversation.json          |   4 +
 .../i18n/locale/ur/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/ur/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/ur/integrations.json          |  10 ++
 .../i18n/locale/ur_IN/automation.json         |   3 +-
 .../i18n/locale/ur_IN/components.json         |   3 +
 .../i18n/locale/ur_IN/conversation.json       |   4 +
 .../i18n/locale/ur_IN/generalSettings.json    |   2 +-
 .../i18n/locale/ur_IN/inboxMgmt.json          |  43 +++++++-
 .../i18n/locale/ur_IN/integrations.json       |  10 ++
 .../dashboard/i18n/locale/vi/automation.json  |   3 +-
 .../dashboard/i18n/locale/vi/components.json  |   3 +
 .../i18n/locale/vi/conversation.json          |   4 +
 .../i18n/locale/vi/generalSettings.json       |   2 +-
 .../dashboard/i18n/locale/vi/inboxMgmt.json   |  43 +++++++-
 .../i18n/locale/vi/integrations.json          |  10 ++
 .../i18n/locale/zh_CN/automation.json         |   3 +-
 .../i18n/locale/zh_CN/components.json         |   3 +
 .../i18n/locale/zh_CN/conversation.json       |   4 +
 .../i18n/locale/zh_CN/generalSettings.json    |   2 +-
 .../i18n/locale/zh_CN/inboxMgmt.json          |  43 +++++++-
 .../i18n/locale/zh_CN/integrations.json       |  10 ++
 .../i18n/locale/zh_TW/automation.json         |   3 +-
 .../i18n/locale/zh_TW/components.json         |   3 +
 .../i18n/locale/zh_TW/conversation.json       |   4 +
 .../i18n/locale/zh_TW/generalSettings.json    |   2 +-
 .../i18n/locale/zh_TW/inboxMgmt.json          |  43 +++++++-
 .../i18n/locale/zh_TW/integrations.json       |  10 ++
 config/locales/am.yml                         |   7 ++
 config/locales/ar.yml                         |   7 ++
 config/locales/az.yml                         |   7 ++
 config/locales/bg.yml                         |   7 ++
 config/locales/ca.yml                         |   7 ++
 config/locales/cs.yml                         |   7 ++
 config/locales/da.yml                         |   7 ++
 config/locales/de.yml                         |   7 ++
 config/locales/el.yml                         |   7 ++
 config/locales/es.yml                         |   7 ++
 config/locales/fa.yml                         |   7 ++
 config/locales/fi.yml                         |   7 ++
 config/locales/fr.yml                         |   7 ++
 config/locales/he.yml                         |   7 ++
 config/locales/hi.yml                         |   7 ++
 config/locales/hr.yml                         |   7 ++
 config/locales/hu.yml                         |   7 ++
 config/locales/hy.yml                         |   7 ++
 config/locales/id.yml                         |   7 ++
 config/locales/is.yml                         |   7 ++
 config/locales/it.yml                         |   7 ++
 config/locales/ja.yml                         |   7 ++
 config/locales/ka.yml                         |   7 ++
 config/locales/ko.yml                         |   7 ++
 config/locales/lt.yml                         |   7 ++
 config/locales/lv.yml                         |   7 ++
 config/locales/ml.yml                         |   7 ++
 config/locales/ms.yml                         |   7 ++
 config/locales/ne.yml                         |   7 ++
 config/locales/nl.yml                         |   7 ++
 config/locales/no.yml                         |   7 ++
 config/locales/pl.yml                         |   7 ++
 config/locales/pt.yml                         |  79 +++++++-------
 config/locales/pt_BR.yml                      |  19 ++--
 config/locales/ro.yml                         |   7 ++
 config/locales/ru.yml                         |   7 ++
 config/locales/sh.yml                         |   7 ++
 config/locales/sk.yml                         |   7 ++
 config/locales/sl.yml                         |   7 ++
 config/locales/sq.yml                         |   7 ++
 config/locales/sr.yml                         |   7 ++
 config/locales/sv.yml                         |   7 ++
 config/locales/ta.yml                         |   7 ++
 config/locales/th.yml                         |   7 ++
 config/locales/tl.yml                         |   7 ++
 config/locales/tr.yml                         |  21 ++--
 config/locales/uk.yml                         |   7 ++
 config/locales/ur.yml                         |   7 ++
 config/locales/ur_IN.yml                      |   7 ++
 config/locales/vi.yml                         |   7 ++
 config/locales/zh_CN.yml                      |   7 ++
 config/locales/zh_TW.yml                      |   7 ++
 379 files changed, 3905 insertions(+), 485 deletions(-)

diff --git a/app/javascript/dashboard/i18n/locale/am/automation.json b/app/javascript/dashboard/i18n/locale/am/automation.json
index 86ec0b58b..c5dd4a514 100644
--- a/app/javascript/dashboard/i18n/locale/am/automation.json
+++ b/app/javascript/dashboard/i18n/locale/am/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/am/components.json b/app/javascript/dashboard/i18n/locale/am/components.json
index e44c6e039..0a2542a84 100644
--- a/app/javascript/dashboard/i18n/locale/am/components.json
+++ b/app/javascript/dashboard/i18n/locale/am/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/am/conversation.json b/app/javascript/dashboard/i18n/locale/am/conversation.json
index c047f17ad..5b3b7f3f8 100644
--- a/app/javascript/dashboard/i18n/locale/am/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/am/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agents",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/am/generalSettings.json b/app/javascript/dashboard/i18n/locale/am/generalSettings.json
index c0c4d247d..9055574c5 100644
--- a/app/javascript/dashboard/i18n/locale/am/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/am/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/am/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/am/inboxMgmt.json
index cc0fe4b33..be7a6f2f9 100644
--- a/app/javascript/dashboard/i18n/locale/am/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/am/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/am/integrations.json b/app/javascript/dashboard/i18n/locale/am/integrations.json
index 43de9b65d..ed5ef8b72 100644
--- a/app/javascript/dashboard/i18n/locale/am/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/am/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Cancel"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Delete",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/ar/automation.json b/app/javascript/dashboard/i18n/locale/ar/automation.json
index a7a1ce25f..3b7962a9e 100644
--- a/app/javascript/dashboard/i18n/locale/ar/automation.json
+++ b/app/javascript/dashboard/i18n/locale/ar/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "تغيير الأولوية",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "فتح المحادثة"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/ar/components.json b/app/javascript/dashboard/i18n/locale/ar/components.json
index e06f11d82..f79ac8b5e 100644
--- a/app/javascript/dashboard/i18n/locale/ar/components.json
+++ b/app/javascript/dashboard/i18n/locale/ar/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ar/conversation.json b/app/javascript/dashboard/i18n/locale/ar/conversation.json
index fe176f4d9..21c7267cf 100644
--- a/app/javascript/dashboard/i18n/locale/ar/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/ar/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "الأسبوع القادم"
       }
     },
+    "MENTION": {
+      "AGENTS": "الوكلاء",
+      "TEAMS": "الفرق"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "تأجيل حتى",
       "APPLY": "تأجيل",
diff --git a/app/javascript/dashboard/i18n/locale/ar/generalSettings.json b/app/javascript/dashboard/i18n/locale/ar/generalSettings.json
index b0cb392c5..38b78d789 100644
--- a/app/javascript/dashboard/i18n/locale/ar/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/ar/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "إعدادات الحساب",
diff --git a/app/javascript/dashboard/i18n/locale/ar/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/ar/inboxMgmt.json
index b090f348b..d2b9d69bb 100644
--- a/app/javascript/dashboard/i18n/locale/ar/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/ar/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "لم نتمكن من حفظ قناة واتساب"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "رقم الهاتف",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "معرف حساب Twilio (يعرف أيضاً بـ Account SID)",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "رمز المصادقة Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "مفتاح API SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "مفتاح سر API",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "قناة API",
         "DESC": "اربط مع قناة API وابدأ في دعم عملائك.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "تيليجرام",
       "LINE": "Line",
       "API": "قناة API",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ar/integrations.json b/app/javascript/dashboard/i18n/locale/ar/integrations.json
index ccb74cd98..e32a292f0 100644
--- a/app/javascript/dashboard/i18n/locale/ar/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/ar/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "نعم، احذف",
+        "CANCEL": "إلغاء"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "حذف",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/az/automation.json b/app/javascript/dashboard/i18n/locale/az/automation.json
index 86ec0b58b..c5dd4a514 100644
--- a/app/javascript/dashboard/i18n/locale/az/automation.json
+++ b/app/javascript/dashboard/i18n/locale/az/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/az/components.json b/app/javascript/dashboard/i18n/locale/az/components.json
index e44c6e039..0a2542a84 100644
--- a/app/javascript/dashboard/i18n/locale/az/components.json
+++ b/app/javascript/dashboard/i18n/locale/az/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/az/conversation.json b/app/javascript/dashboard/i18n/locale/az/conversation.json
index c047f17ad..5b3b7f3f8 100644
--- a/app/javascript/dashboard/i18n/locale/az/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/az/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agents",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/az/generalSettings.json b/app/javascript/dashboard/i18n/locale/az/generalSettings.json
index c0c4d247d..9055574c5 100644
--- a/app/javascript/dashboard/i18n/locale/az/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/az/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/az/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/az/inboxMgmt.json
index cc0fe4b33..be7a6f2f9 100644
--- a/app/javascript/dashboard/i18n/locale/az/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/az/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/az/integrations.json b/app/javascript/dashboard/i18n/locale/az/integrations.json
index 43de9b65d..ed5ef8b72 100644
--- a/app/javascript/dashboard/i18n/locale/az/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/az/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Cancel"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Delete",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/bg/automation.json b/app/javascript/dashboard/i18n/locale/bg/automation.json
index 43401760f..bfbddab68 100644
--- a/app/javascript/dashboard/i18n/locale/bg/automation.json
+++ b/app/javascript/dashboard/i18n/locale/bg/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/bg/components.json b/app/javascript/dashboard/i18n/locale/bg/components.json
index cb087f380..8b8fe3f40 100644
--- a/app/javascript/dashboard/i18n/locale/bg/components.json
+++ b/app/javascript/dashboard/i18n/locale/bg/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/bg/conversation.json b/app/javascript/dashboard/i18n/locale/bg/conversation.json
index e19af9bd2..a2dbc8481 100644
--- a/app/javascript/dashboard/i18n/locale/bg/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/bg/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Агенти",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/bg/generalSettings.json b/app/javascript/dashboard/i18n/locale/bg/generalSettings.json
index 62e7c15d1..a452fd932 100644
--- a/app/javascript/dashboard/i18n/locale/bg/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/bg/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/bg/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/bg/inboxMgmt.json
index 224bb087f..2a28cd2a8 100644
--- a/app/javascript/dashboard/i18n/locale/bg/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/bg/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/bg/integrations.json b/app/javascript/dashboard/i18n/locale/bg/integrations.json
index f5392e1fb..47899e6ee 100644
--- a/app/javascript/dashboard/i18n/locale/bg/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/bg/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Отмени"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Изтрий",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/ca/automation.json b/app/javascript/dashboard/i18n/locale/ca/automation.json
index 83a1f1bf9..da6e0753e 100644
--- a/app/javascript/dashboard/i18n/locale/ca/automation.json
+++ b/app/javascript/dashboard/i18n/locale/ca/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Canvia la prioritat",
-      "ADD_SLA": "Afegeix SLA"
+      "ADD_SLA": "Afegeix SLA",
+      "OPEN_CONVERSATION": "Obrir conversa"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/ca/components.json b/app/javascript/dashboard/i18n/locale/ca/components.json
index 11623bd86..c8adecbf1 100644
--- a/app/javascript/dashboard/i18n/locale/ca/components.json
+++ b/app/javascript/dashboard/i18n/locale/ca/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ca/conversation.json b/app/javascript/dashboard/i18n/locale/ca/conversation.json
index 088dc2331..5da99cfa7 100644
--- a/app/javascript/dashboard/i18n/locale/ca/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/ca/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Pròxima setmana"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agents",
+      "TEAMS": "Equips"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Posposat fins a",
       "APPLY": "Posposat",
diff --git a/app/javascript/dashboard/i18n/locale/ca/generalSettings.json b/app/javascript/dashboard/i18n/locale/ca/generalSettings.json
index ac8714d6e..72df0e477 100644
--- a/app/javascript/dashboard/i18n/locale/ca/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/ca/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Configuració del compte",
diff --git a/app/javascript/dashboard/i18n/locale/ca/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/ca/inboxMgmt.json
index 425b7d463..bd42fce16 100644
--- a/app/javascript/dashboard/i18n/locale/ca/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/ca/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "No hem pogut desar el canal WhatsApp"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Número de telèfon",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Compte SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Token d'autenticació",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "Canal de l'API",
         "DESC": "Integra’t amb el canal API i comença a donar suport als teus clients.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "Canal de l'API",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ca/integrations.json b/app/javascript/dashboard/i18n/locale/ca/integrations.json
index 66be524d4..ebbd228f1 100644
--- a/app/javascript/dashboard/i18n/locale/ca/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/ca/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Sí, esborra",
+        "CANCEL": "Cancel·la"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Esborrar",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/cs/automation.json b/app/javascript/dashboard/i18n/locale/cs/automation.json
index 2d72b2ca6..cda8f4b51 100644
--- a/app/javascript/dashboard/i18n/locale/cs/automation.json
+++ b/app/javascript/dashboard/i18n/locale/cs/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Odeslat přílohu",
       "SEND_MESSAGE": "Odeslat zprávu",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Typ zprávy",
diff --git a/app/javascript/dashboard/i18n/locale/cs/components.json b/app/javascript/dashboard/i18n/locale/cs/components.json
index 480c7e626..51398ece6 100644
--- a/app/javascript/dashboard/i18n/locale/cs/components.json
+++ b/app/javascript/dashboard/i18n/locale/cs/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/cs/conversation.json b/app/javascript/dashboard/i18n/locale/cs/conversation.json
index a158b273f..b69100909 100644
--- a/app/javascript/dashboard/i18n/locale/cs/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/cs/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Příští týden"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agenti",
+      "TEAMS": "Týmy"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Odložit do",
       "APPLY": "Odložit",
diff --git a/app/javascript/dashboard/i18n/locale/cs/generalSettings.json b/app/javascript/dashboard/i18n/locale/cs/generalSettings.json
index bd6c45169..8baf19b67 100644
--- a/app/javascript/dashboard/i18n/locale/cs/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/cs/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Nastavení účtu",
diff --git a/app/javascript/dashboard/i18n/locale/cs/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/cs/inboxMgmt.json
index ac3bdcfdf..1085b19b6 100644
--- a/app/javascript/dashboard/i18n/locale/cs/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/cs/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Telefonní číslo",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "SID účtu",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/cs/integrations.json b/app/javascript/dashboard/i18n/locale/cs/integrations.json
index a7ff9afd9..5e75289d8 100644
--- a/app/javascript/dashboard/i18n/locale/cs/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/cs/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Zrušit"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Vymazat",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/da/automation.json b/app/javascript/dashboard/i18n/locale/da/automation.json
index c5d701963..d7a3637fd 100644
--- a/app/javascript/dashboard/i18n/locale/da/automation.json
+++ b/app/javascript/dashboard/i18n/locale/da/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Åbn samtale"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/da/components.json b/app/javascript/dashboard/i18n/locale/da/components.json
index 7905f51e6..b71842016 100644
--- a/app/javascript/dashboard/i18n/locale/da/components.json
+++ b/app/javascript/dashboard/i18n/locale/da/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/da/conversation.json b/app/javascript/dashboard/i18n/locale/da/conversation.json
index 34971059f..ef8188307 100644
--- a/app/javascript/dashboard/i18n/locale/da/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/da/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Næste uge"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agenter",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Udsæt til",
       "APPLY": "Udsæt",
diff --git a/app/javascript/dashboard/i18n/locale/da/generalSettings.json b/app/javascript/dashboard/i18n/locale/da/generalSettings.json
index cd9fd33ad..2c0d82000 100644
--- a/app/javascript/dashboard/i18n/locale/da/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/da/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Kontoindstillinger",
diff --git a/app/javascript/dashboard/i18n/locale/da/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/da/inboxMgmt.json
index 7aefb2d97..3db1d05ba 100644
--- a/app/javascript/dashboard/i18n/locale/da/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/da/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Vi kunne ikke gemme WhatsApp-kanalen"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Telefonnummer",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Konto SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Kanal",
         "DESC": "Integrer med API-kanal og begynd at supportere dine kunder.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Kanal",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/da/integrations.json b/app/javascript/dashboard/i18n/locale/da/integrations.json
index 5fd5643e5..9a4898f3a 100644
--- a/app/javascript/dashboard/i18n/locale/da/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/da/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Annuller"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Slet",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/de/automation.json b/app/javascript/dashboard/i18n/locale/de/automation.json
index 3d137921e..a74a646ed 100644
--- a/app/javascript/dashboard/i18n/locale/de/automation.json
+++ b/app/javascript/dashboard/i18n/locale/de/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Priorität ändern",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Unterhaltung öffnen"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/de/components.json b/app/javascript/dashboard/i18n/locale/de/components.json
index e9497cd02..565b82181 100644
--- a/app/javascript/dashboard/i18n/locale/de/components.json
+++ b/app/javascript/dashboard/i18n/locale/de/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/de/contact.json b/app/javascript/dashboard/i18n/locale/de/contact.json
index ece7d0267..3db34b141 100644
--- a/app/javascript/dashboard/i18n/locale/de/contact.json
+++ b/app/javascript/dashboard/i18n/locale/de/contact.json
@@ -285,7 +285,7 @@
     "HEADER": {
       "TITLE": "Kontakte",
       "SEARCH_TITLE": "Kontakte suchen",
-      "ACTIVE_TITLE": "Active contacts",
+      "ACTIVE_TITLE": "Aktive Kontakt",
       "SEARCH_PLACEHOLDER": "Suchen...",
       "MESSAGE_BUTTON": "Nachricht",
       "SEND_MESSAGE": "Nachricht senden",
@@ -460,8 +460,8 @@
         }
       },
       "DELETE_CONTACT": {
-        "MESSAGE": "This action is permanent and irreversible.",
-        "BUTTON": "Delete now"
+        "MESSAGE": "Diese Aktion ist permanent und unwiderruflich.",
+        "BUTTON": "Jetzt löschen"
       }
     },
     "DETAILS": {
@@ -471,7 +471,7 @@
       "DELETE_CONTACT": "Kontakt löschen",
       "DELETE_DIALOG": {
         "TITLE": "Löschung bestätigen",
-        "DESCRIPTION": "Are you sure you want to delete this contact?",
+        "DESCRIPTION": "Sind Sie sicher, dass Sie den Kontakt löschen möchten?",
         "CONFIRM": "Ja, löschen",
         "API": {
           "SUCCESS_MESSAGE": "Kontakt erfolgreich gelöscht",
@@ -550,8 +550,8 @@
         "YOU": "Sie",
         "SAVE": "Notiz speichern",
         "EXPAND": "Erweitern",
-        "COLLAPSE": "Collapse",
-        "NO_NOTES": "No notes, you can add notes from the contact details page.",
+        "COLLAPSE": "Einklappen",
+        "NO_NOTES": "Keine Notizen, Sie können Notizen auf der Kontakt-Detailseite hinzufügen.",
         "EMPTY_STATE": "Es gibt keine Notizen zu diesem Kontakt. Sie können eine Notiz hinzufügen, indem Sie diese in das obige Feld eingeben."
       }
     },
@@ -561,7 +561,7 @@
       "BUTTON_LABEL": "Kontakt hinzufügen",
       "SEARCH_EMPTY_STATE_TITLE": "Keine Kontakte entsprechen Ihrer Suche 🔍",
       "LIST_EMPTY_STATE_TITLE": "Keine Kontakte verfügbar in dieser Ansicht 📋",
-      "ACTIVE_EMPTY_STATE_TITLE": "No contacts are active at the moment 🌙"
+      "ACTIVE_EMPTY_STATE_TITLE": "Im Moment sind keine Kontakte aktiv 🌙"
     }
   },
   "COMPOSE_NEW_CONVERSATION": {
diff --git a/app/javascript/dashboard/i18n/locale/de/conversation.json b/app/javascript/dashboard/i18n/locale/de/conversation.json
index 85db52360..3331fdff8 100644
--- a/app/javascript/dashboard/i18n/locale/de/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/de/conversation.json
@@ -32,12 +32,12 @@
     "LOADING_CONVERSATIONS": "Gespräche laden",
     "CANNOT_REPLY": "Sie können nicht antworten, weil",
     "24_HOURS_WINDOW": "24-Stunden-Nachrichtenfenster-Beschränkung",
-    "API_HOURS_WINDOW": "You can only reply to this conversation within {hours} hours",
+    "API_HOURS_WINDOW": "Sie können auf diese Unterhaltung nur innerhalb von {hours} Stunden antworten",
     "NOT_ASSIGNED_TO_YOU": "Diese Konversation ist Ihnen nicht zugeordnet. Möchten Sie dieses Gespräch sich selbst zuordnen?",
     "ASSIGN_TO_ME": "Mir zuweisen",
     "TWILIO_WHATSAPP_CAN_REPLY": "Sie können auf diese Konversation nur mit einer Nachrichtenvorlage antworten wegen",
     "TWILIO_WHATSAPP_24_HOURS_WINDOW": "24-Stunden-Nachrichtenfenster-Beschränkung",
-    "OLD_INSTAGRAM_INBOX_REPLY_BANNER": "This Instagram account was migrated to the new Instagram channel inbox. All new messages will show up there. You won’t be able to send messages from this conversation anymore.",
+    "OLD_INSTAGRAM_INBOX_REPLY_BANNER": "Dieser Instagram-Account wurde in den neuen Instagram-Kanal übertragen. Alle neuen Nachrichten werden dort erscheinen. Sie werden keine Nachrichten mehr von dieser Unterhaltung senden können.",
     "REPLYING_TO": "Sie antworten auf:",
     "REMOVE_SELECTION": "Auswahl entfernen",
     "DOWNLOAD": "Herunterladen",
@@ -70,7 +70,7 @@
       "RESOLVE_ACTION": "Fall schließen",
       "REOPEN_ACTION": "Wieder öffnen",
       "OPEN_ACTION": "Öffnen",
-      "MORE_ACTIONS": "More actions",
+      "MORE_ACTIONS": "Weitere Aktionen",
       "OPEN": "Mehr",
       "CLOSE": "Schließen",
       "DETAILS": "Einzelheiten",
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Nächste Woche"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agenten",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Stummschalten bis",
       "APPLY": "Stummschalten",
@@ -119,8 +123,8 @@
       }
     },
     "DELETE_CONVERSATION": {
-      "TITLE": "Delete conversation #{conversationId}",
-      "DESCRIPTION": "Are you sure you want to delete this conversation?",
+      "TITLE": "Lösche Unterhaltung #{conversationId}",
+      "DESCRIPTION": "Sind Sie sicher, dass Sie diese Unterhaltung löschen möchten?",
       "CONFIRM": "Löschen"
     },
     "CARD_CONTEXT_MENU": {
@@ -139,7 +143,7 @@
       "ASSIGN_LABEL": "Label zuweisen",
       "AGENTS_LOADING": "Agenten werden geladen...",
       "ASSIGN_TEAM": "Team zuweisen",
-      "DELETE": "Delete conversation",
+      "DELETE": "Unterhaltung löschen",
       "API": {
         "AGENT_ASSIGNMENT": {
           "SUCCESFUL": "Konversations-ID {conversationId} zugewiesen zu \"{agentName}\"",
@@ -214,8 +218,8 @@
     "ASSIGN_LABEL_SUCCESFUL": "Label erfolgreich zugewiesen",
     "ASSIGN_LABEL_FAILED": "Labelzuweisung fehlgeschlagen",
     "CHANGE_TEAM": "Das Konversationsteam hat sich geändert",
-    "SUCCESS_DELETE_CONVERSATION": "Conversation deleted successfully",
-    "FAIL_DELETE_CONVERSATION": "Couldn't delete conversation! Try again",
+    "SUCCESS_DELETE_CONVERSATION": "Unterhaltung erfolgreich gelöscht",
+    "FAIL_DELETE_CONVERSATION": "Unterhaltung konnte nicht gelöscht werden! Erneut versuchen",
     "FILE_SIZE_LIMIT": "Die Datei überschreitet das Anhangslimit von {MAXIMUM_SUPPORTED_FILE_UPLOAD_SIZE} MB",
     "MESSAGE_ERROR": "Nachricht konnte nicht gesendet werden, bitte versuchen Sie es später erneut",
     "SENT_BY": "Gesendet von:",
@@ -304,7 +308,7 @@
       "CONVERSATION_ACTIONS": "Konversationsaktionen",
       "CONVERSATION_LABELS": "Konversationslabels",
       "CONVERSATION_INFO": "Konversationsinformationen",
-      "CONTACT_NOTES": "Contact Notes",
+      "CONTACT_NOTES": "Kontakt Notizen",
       "CONTACT_ATTRIBUTES": "Kontakt-Attribute",
       "PREVIOUS_CONVERSATION": "Vorherige Konversationen",
       "MACROS": "Makros",
diff --git a/app/javascript/dashboard/i18n/locale/de/generalSettings.json b/app/javascript/dashboard/i18n/locale/de/generalSettings.json
index 2eccd68db..91054bf76 100644
--- a/app/javascript/dashboard/i18n/locale/de/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/de/generalSettings.json
@@ -1,10 +1,10 @@
 {
   "GENERAL_SETTINGS": {
     "LIMIT_MESSAGES": {
-      "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
-      "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
-      "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
+      "CONVERSATION": "Sie haben das Konversationslimit überschritten. Der Hacker Plan erlaubt nur 500 Unterhaltungen.",
+      "INBOXES": "Sie haben das Posteingang-Limit überschritten. Der Hacker-Plan unterstützt nur Live-Chat der Webseite. Zusätzliche Posteingänge wie E-Mail, WhatsApp usw. erfordern einen kostenpflichtigen Tarif.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
+      "NON_ADMIN": "Bitte kontaktieren Sie Ihren Administrator, um den Plan zu upgraden und alle Funktionen weiterzunutzen."
     },
     "TITLE": "Kontoeinstellungen",
     "SUBMIT": "Einstellungen aktualisieren",
@@ -15,12 +15,12 @@
       "SUCCESS": "Kontoeinstellungen erfolgreich aktualisiert"
     },
     "ACCOUNT_DELETE_SECTION": {
-      "TITLE": "Delete your Account",
-      "NOTE": "Once you delete your account, all your data will be deleted.",
-      "BUTTON_TEXT": "Delete Your Account",
+      "TITLE": "Löschen Sie Ihr Konto",
+      "NOTE": "Sobald Sie Ihr Konto gelöscht haben, werden alle Ihre Daten gelöscht.",
+      "BUTTON_TEXT": "Löschen Sie Ihr Konto",
       "CONFIRM": {
-        "TITLE": "Delete Account",
-        "MESSAGE": "Deleting your Account is irreversible. Enter your account name below to confirm you want to permanently delete it.",
+        "TITLE": "Konto löschen",
+        "MESSAGE": "Das Löschen Ihres Kontos ist unwiderruflich. Geben Sie Ihren Kontonamen ein, um zu bestätigen, dass Sie es dauerhaft löschen möchten.",
         "BUTTON_TEXT": "Löschen",
         "DISMISS": "Stornieren",
         "PLACE_HOLDER": "Bitte {accountName} zur Bestätigung eingeben"
diff --git a/app/javascript/dashboard/i18n/locale/de/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/de/inboxMgmt.json
index 8a3213095..9878b3402 100644
--- a/app/javascript/dashboard/i18n/locale/de/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/de/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Wir konnten den WhatsApp-Kanal nicht speichern"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Telefonnummer",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth-Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API-Schlüssel SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API-Schlüssel-Geheimnis",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API-Kanal",
         "DESC": "Integrieren Sie einen API-Kanal und starten Sie mit der Unterstützung Ihrer Kunden.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegramm",
       "LINE": "Line",
       "API": "API-Kanal",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/de/integrations.json b/app/javascript/dashboard/i18n/locale/de/integrations.json
index 1b1f4df62..7b99aacd8 100644
--- a/app/javascript/dashboard/i18n/locale/de/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/de/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Ja, löschen",
+        "CANCEL": "Stornieren"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Löschen",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/el/automation.json b/app/javascript/dashboard/i18n/locale/el/automation.json
index de7bbe3cb..f5df02cb9 100644
--- a/app/javascript/dashboard/i18n/locale/el/automation.json
+++ b/app/javascript/dashboard/i18n/locale/el/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Άνοιγμα συνομιλίας"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/el/components.json b/app/javascript/dashboard/i18n/locale/el/components.json
index 0e08a569b..6f56c2165 100644
--- a/app/javascript/dashboard/i18n/locale/el/components.json
+++ b/app/javascript/dashboard/i18n/locale/el/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/el/conversation.json b/app/javascript/dashboard/i18n/locale/el/conversation.json
index ecfea2a9b..849aa52f1 100644
--- a/app/javascript/dashboard/i18n/locale/el/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/el/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Επόμενη εβδομάδα"
       }
     },
+    "MENTION": {
+      "AGENTS": "Πράκτορες",
+      "TEAMS": "Ομάδες"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Αναβολή έως",
       "APPLY": "Αναβολή",
diff --git a/app/javascript/dashboard/i18n/locale/el/generalSettings.json b/app/javascript/dashboard/i18n/locale/el/generalSettings.json
index 028897002..d5b29ee95 100644
--- a/app/javascript/dashboard/i18n/locale/el/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/el/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Ρυθμίσεις",
diff --git a/app/javascript/dashboard/i18n/locale/el/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/el/inboxMgmt.json
index 46d205201..c5993d2f4 100644
--- a/app/javascript/dashboard/i18n/locale/el/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/el/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Δεν ήμασταν σε θέση να αποθηκεύσουμε το κανάλι WhatsApp"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Αριθμός Τηλεφώνου",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "SID Λογαριασμού",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "Κανάλι API",
         "DESC": "Ενσωματώστε ένα κανάλι APΙ και ξεκινήσετε την υποστήριξη των πελατών σας.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "Κανάλι API",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/el/integrations.json b/app/javascript/dashboard/i18n/locale/el/integrations.json
index 0e48b011a..627863b74 100644
--- a/app/javascript/dashboard/i18n/locale/el/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/el/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Άκυρο"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Διαγραφή",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/es/auditLogs.json b/app/javascript/dashboard/i18n/locale/es/auditLogs.json
index f74178fce..1be0da1dd 100644
--- a/app/javascript/dashboard/i18n/locale/es/auditLogs.json
+++ b/app/javascript/dashboard/i18n/locale/es/auditLogs.json
@@ -71,7 +71,7 @@
       "EDIT": "{agentName} actualizó la configuración de la cuenta (#{id})"
     },
     "CONVERSATION": {
-      "DELETE": "{agentName} deleted conversation #{id}"
+      "DELETE": "{agentName} ha eliminado la conversación #{id}"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/es/automation.json b/app/javascript/dashboard/i18n/locale/es/automation.json
index 90a7eb799..a81798027 100644
--- a/app/javascript/dashboard/i18n/locale/es/automation.json
+++ b/app/javascript/dashboard/i18n/locale/es/automation.json
@@ -130,37 +130,38 @@
     "EVENTS": {
       "CONVERSATION_CREATED": "Conversación creada",
       "CONVERSATION_UPDATED": "Conversación actualizada",
-      "MESSAGE_CREATED": "Message Created",
-      "CONVERSATION_OPENED": "Conversation Opened"
+      "MESSAGE_CREATED": "Mensaje creado",
+      "CONVERSATION_OPENED": "Conversación abierta"
     },
     "ACTIONS": {
-      "ASSIGN_AGENT": "Assign to Agent",
-      "ASSIGN_TEAM": "Assign a Team",
-      "ADD_LABEL": "Add a Label",
-      "REMOVE_LABEL": "Remove a Label",
-      "SEND_EMAIL_TO_TEAM": "Send an Email to Team",
-      "SEND_EMAIL_TRANSCRIPT": "Send an Email Transcript",
+      "ASSIGN_AGENT": "Asignar al agente",
+      "ASSIGN_TEAM": "Asignar equipo",
+      "ADD_LABEL": "Añadir etiqueta",
+      "REMOVE_LABEL": "Eliminar etiqueta",
+      "SEND_EMAIL_TO_TEAM": "Enviar un email al equipo",
+      "SEND_EMAIL_TRANSCRIPT": "Enviar transcripción por correo",
       "MUTE_CONVERSATION": "Silenciar Conversación",
       "SNOOZE_CONVERSATION": "Posponer conversación",
       "RESOLVE_CONVERSATION": "Resolver conversación",
-      "SEND_WEBHOOK_EVENT": "Send Webhook Event",
-      "SEND_ATTACHMENT": "Send Attachment",
-      "SEND_MESSAGE": "Send a Message",
+      "SEND_WEBHOOK_EVENT": "Enviar Evento de Webhook",
+      "SEND_ATTACHMENT": "Enviar archivo adjunto",
+      "SEND_MESSAGE": "Enviar mensaje",
       "CHANGE_PRIORITY": "Cambiar prioridad",
-      "ADD_SLA": "Añadir SLA"
+      "ADD_SLA": "Añadir SLA",
+      "OPEN_CONVERSATION": "Abrir conversación"
     },
     "ATTRIBUTES": {
-      "MESSAGE_TYPE": "Message Type",
-      "MESSAGE_CONTAINS": "Message Contains",
+      "MESSAGE_TYPE": "Tipo de mensaje",
+      "MESSAGE_CONTAINS": "El mensaje contiene",
       "EMAIL": "E-mail",
       "INBOX": "Bandeja de entrada",
-      "CONVERSATION_LANGUAGE": "Conversation Language",
+      "CONVERSATION_LANGUAGE": "Idioma de la conversación",
       "PHONE_NUMBER": "Número telefónico",
       "STATUS": "Estado",
       "BROWSER_LANGUAGE": "Idioma del navegador",
-      "MAIL_SUBJECT": "Email Subject",
+      "MAIL_SUBJECT": "Asunto de Email",
       "COUNTRY_NAME": "País",
-      "REFERER_LINK": "Referrer Link",
+      "REFERER_LINK": "Enlace de referencia",
       "ASSIGNEE_NAME": "Cesionario",
       "TEAM_NAME": "Equipo",
       "PRIORITY": "Prioridad"
diff --git a/app/javascript/dashboard/i18n/locale/es/components.json b/app/javascript/dashboard/i18n/locale/es/components.json
index 79764eadc..4627e6897 100644
--- a/app/javascript/dashboard/i18n/locale/es/components.json
+++ b/app/javascript/dashboard/i18n/locale/es/components.json
@@ -45,9 +45,12 @@
     "WATCH_VIDEO": "Watch video"
   },
   "DURATION_INPUT": {
-    "MINUTES": "Minutes",
-    "HOURS": "Hours",
-    "DAYS": "Days",
-    "PLACEHOLDER": "Enter duration"
+    "MINUTES": "Minutos",
+    "HOURS": "Horas",
+    "DAYS": "Días",
+    "PLACEHOLDER": "Ingresar duración"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "¡Muy pronto!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/es/contact.json b/app/javascript/dashboard/i18n/locale/es/contact.json
index 41ee73d66..859de8246 100644
--- a/app/javascript/dashboard/i18n/locale/es/contact.json
+++ b/app/javascript/dashboard/i18n/locale/es/contact.json
@@ -285,7 +285,7 @@
     "HEADER": {
       "TITLE": "Contactos",
       "SEARCH_TITLE": "Buscar contactos",
-      "ACTIVE_TITLE": "Active contacts",
+      "ACTIVE_TITLE": "Contactos activos",
       "SEARCH_PLACEHOLDER": "Buscar...",
       "MESSAGE_BUTTON": "Mensaje",
       "SEND_MESSAGE": "Enviar mensaje",
@@ -460,8 +460,8 @@
         }
       },
       "DELETE_CONTACT": {
-        "MESSAGE": "This action is permanent and irreversible.",
-        "BUTTON": "Delete now"
+        "MESSAGE": "Eliminar permanentemente este contacto. Esta acción es irreversible.",
+        "BUTTON": "Eliminar ahora"
       }
     },
     "DETAILS": {
@@ -471,7 +471,7 @@
       "DELETE_CONTACT": "Eliminar contacto",
       "DELETE_DIALOG": {
         "TITLE": "Confirmar eliminación",
-        "DESCRIPTION": "Are you sure you want to delete this contact?",
+        "DESCRIPTION": "¿Está seguro que desea eliminar este contacto?",
         "CONFIRM": "Sí, eliminar",
         "API": {
           "SUCCESS_MESSAGE": "Contacto eliminado correctamente",
@@ -550,8 +550,8 @@
         "YOU": "Tú",
         "SAVE": "Guardar nota",
         "EXPAND": "Expandir",
-        "COLLAPSE": "Collapse",
-        "NO_NOTES": "No notes, you can add notes from the contact details page.",
+        "COLLAPSE": "Contraer",
+        "NO_NOTES": "No hay notas, puede agregar notas desde la página de detalles de contacto.",
         "EMPTY_STATE": "No hay notas asociadas a este contacto. Puede añadir una nota escribiendo en el recuadro superior."
       }
     },
@@ -561,7 +561,7 @@
       "BUTTON_LABEL": "Añadir contacto",
       "SEARCH_EMPTY_STATE_TITLE": "No hay contactos que coincidan con tu búsqueda 🔍",
       "LIST_EMPTY_STATE_TITLE": "No hay contactos disponibles en esta vista 📋",
-      "ACTIVE_EMPTY_STATE_TITLE": "No contacts are active at the moment 🌙"
+      "ACTIVE_EMPTY_STATE_TITLE": "No hay contactos activos por el momento 🌙"
     }
   },
   "COMPOSE_NEW_CONVERSATION": {
diff --git a/app/javascript/dashboard/i18n/locale/es/conversation.json b/app/javascript/dashboard/i18n/locale/es/conversation.json
index 3733925eb..51cd0a1e0 100644
--- a/app/javascript/dashboard/i18n/locale/es/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/es/conversation.json
@@ -32,12 +32,12 @@
     "LOADING_CONVERSATIONS": "Cargando conversaciones",
     "CANNOT_REPLY": "No puede responder debido a",
     "24_HOURS_WINDOW": "Restricción de la ventana de mensajes de 24 horas",
-    "API_HOURS_WINDOW": "You can only reply to this conversation within {hours} hours",
+    "API_HOURS_WINDOW": "Solo puedes responder a esta conversación dentro de {hours} horas",
     "NOT_ASSIGNED_TO_YOU": "Esta conversación no te está asignada. ¿Quieres asignarla a ti mismo?",
     "ASSIGN_TO_ME": "Asignar a mi",
     "TWILIO_WHATSAPP_CAN_REPLY": "Sólo puede responder a esta conversación usando una plantilla de mensaje debido a",
     "TWILIO_WHATSAPP_24_HOURS_WINDOW": "Restricción de la ventana de mensajes de 24 horas",
-    "OLD_INSTAGRAM_INBOX_REPLY_BANNER": "This Instagram account was migrated to the new Instagram channel inbox. All new messages will show up there. You won’t be able to send messages from this conversation anymore.",
+    "OLD_INSTAGRAM_INBOX_REPLY_BANNER": "Esta cuenta de Instagram fue migrada a la nueva bandeja de entrada del canal Instagram. Todos los nuevos mensajes aparecerán allí. Ya no podrás enviar mensajes de esta conversación.",
     "REPLYING_TO": "Esta respondiendo a:",
     "REMOVE_SELECTION": "Eliminar selección",
     "DOWNLOAD": "Descargar",
@@ -70,7 +70,7 @@
       "RESOLVE_ACTION": "Resolver",
       "REOPEN_ACTION": "Reabrir",
       "OPEN_ACTION": "Abrir",
-      "MORE_ACTIONS": "More actions",
+      "MORE_ACTIONS": "Otras acciones",
       "OPEN": "Más",
       "CLOSE": "Cerrar",
       "DETAILS": "detalles",
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Próxima semana"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agentes",
+      "TEAMS": "Equipos"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Posponer hasta",
       "APPLY": "Posponer",
@@ -119,8 +123,8 @@
       }
     },
     "DELETE_CONVERSATION": {
-      "TITLE": "Delete conversation #{conversationId}",
-      "DESCRIPTION": "Are you sure you want to delete this conversation?",
+      "TITLE": "Eliminar conversación #{conversationId}",
+      "DESCRIPTION": "¿Está seguro que desea eliminar esta conversación?",
       "CONFIRM": "Eliminar"
     },
     "CARD_CONTEXT_MENU": {
@@ -139,7 +143,7 @@
       "ASSIGN_LABEL": "Asignar etiqueta",
       "AGENTS_LOADING": "Cargando agentes...",
       "ASSIGN_TEAM": "Asignar equipo",
-      "DELETE": "Delete conversation",
+      "DELETE": "Eliminar conversación",
       "API": {
         "AGENT_ASSIGNMENT": {
           "SUCCESFUL": "ID de conversación {conversationId} asignado a \"{agentName}\"",
@@ -214,8 +218,8 @@
     "ASSIGN_LABEL_SUCCESFUL": "Etiqueta asignada correctamente",
     "ASSIGN_LABEL_FAILED": "No se ha podido asignar la etiqueta",
     "CHANGE_TEAM": "Equipo de conversación cambiado",
-    "SUCCESS_DELETE_CONVERSATION": "Conversation deleted successfully",
-    "FAIL_DELETE_CONVERSATION": "Couldn't delete conversation! Try again",
+    "SUCCESS_DELETE_CONVERSATION": "Conversación eliminada con éxito",
+    "FAIL_DELETE_CONVERSATION": "¡No se pudo eliminar la conversación! Inténtalo de nuevo",
     "FILE_SIZE_LIMIT": "El archivo supera el límite de archivos adjuntos de {MAXIMUM_SUPPORTED_FILE_UPLOAD_SIZE} MB",
     "MESSAGE_ERROR": "No se puede enviar este mensaje, por favor inténtalo de nuevo más tarde",
     "SENT_BY": "Enviado por:",
@@ -304,11 +308,11 @@
       "CONVERSATION_ACTIONS": "Acciones de conversación",
       "CONVERSATION_LABELS": "Etiquetas de conversación",
       "CONVERSATION_INFO": "Información de la conversación",
-      "CONTACT_NOTES": "Contact Notes",
+      "CONTACT_NOTES": "Notas de contacto",
       "CONTACT_ATTRIBUTES": "Atributos de contacto",
       "PREVIOUS_CONVERSATION": "Conversaciones anteriores",
       "MACROS": "Macros",
-      "LINEAR_ISSUES": "Linked Linear Issues",
+      "LINEAR_ISSUES": "Problemas lineales vinculados",
       "SHOPIFY_ORDERS": "Shopify Orders"
     },
     "SHOPIFY": {
diff --git a/app/javascript/dashboard/i18n/locale/es/generalSettings.json b/app/javascript/dashboard/i18n/locale/es/generalSettings.json
index ce462c715..deb9e532f 100644
--- a/app/javascript/dashboard/i18n/locale/es/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/es/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Configuración de la cuenta",
diff --git a/app/javascript/dashboard/i18n/locale/es/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/es/inboxMgmt.json
index 400a604a6..2ce3dda49 100644
--- a/app/javascript/dashboard/i18n/locale/es/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/es/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "No pudimos guardar el canal de WhatsApp"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Número telefónico",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Cuenta SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Token de Auth",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "Clave API secreta",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "Canal API",
         "DESC": "Integre con API channel y comienze a dar soporte a sus clientes.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "Canal API",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/es/integrations.json b/app/javascript/dashboard/i18n/locale/es/integrations.json
index d9abe6c63..b7f4b5494 100644
--- a/app/javascript/dashboard/i18n/locale/es/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/es/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Sí, eliminar",
+        "CANCEL": "Cancelar"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Eliminar",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/es/macros.json b/app/javascript/dashboard/i18n/locale/es/macros.json
index 627c9d762..0085c7ebd 100644
--- a/app/javascript/dashboard/i18n/locale/es/macros.json
+++ b/app/javascript/dashboard/i18n/locale/es/macros.json
@@ -85,20 +85,20 @@
       "ATLEAST_ONE_ACTION_REQUIRED": "Se requiere al menos una acción"
     },
     "ACTIONS": {
-      "ASSIGN_TEAM": "Assign a Team",
+      "ASSIGN_TEAM": "Asignar equipo",
       "ASSIGN_AGENT": "Assign an Agent",
-      "ADD_LABEL": "Add a Label",
-      "REMOVE_LABEL": "Remove a Label",
+      "ADD_LABEL": "Añadir etiqueta",
+      "REMOVE_LABEL": "Eliminar etiqueta",
       "REMOVE_ASSIGNED_TEAM": "Remove Assigned Team",
-      "SEND_EMAIL_TRANSCRIPT": "Send an Email Transcript",
+      "SEND_EMAIL_TRANSCRIPT": "Enviar transcripción por correo",
       "MUTE_CONVERSATION": "Silenciar Conversación",
       "SNOOZE_CONVERSATION": "Posponer conversación",
       "RESOLVE_CONVERSATION": "Resolver conversación",
-      "SEND_ATTACHMENT": "Send Attachment",
-      "SEND_MESSAGE": "Send a Message",
+      "SEND_ATTACHMENT": "Enviar archivo adjunto",
+      "SEND_MESSAGE": "Enviar mensaje",
       "CHANGE_PRIORITY": "Cambiar prioridad",
       "ADD_PRIVATE_NOTE": "Add a Private Note",
-      "SEND_WEBHOOK_EVENT": "Send Webhook Event"
+      "SEND_WEBHOOK_EVENT": "Enviar Evento de Webhook"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/es/settings.json b/app/javascript/dashboard/i18n/locale/es/settings.json
index f9958dfe9..09081dbdd 100644
--- a/app/javascript/dashboard/i18n/locale/es/settings.json
+++ b/app/javascript/dashboard/i18n/locale/es/settings.json
@@ -78,10 +78,10 @@
         "NOTE": "Este token puede ser usado si estás construyendo una integración basada en API",
         "COPY": "Copiar",
         "RESET": "Reset",
-        "CONFIRM_RESET": "Are you sure?",
-        "CONFIRM_HINT": "Click again to confirm",
-        "RESET_SUCCESS": "Access token regenerated successfully",
-        "RESET_ERROR": "Unable to regenerate access token. Please try again"
+        "CONFIRM_RESET": "¿Está seguro?",
+        "CONFIRM_HINT": "Haz clic de nuevo para confirmar",
+        "RESET_SUCCESS": "Token de acceso regenerado con éxito",
+        "RESET_ERROR": "No se puede regenerar el token de acceso. Por favor, inténtalo de nuevo"
       },
       "AUDIO_NOTIFICATIONS_SECTION": {
         "TITLE": "Alertas de audio",
@@ -191,7 +191,7 @@
         },
         "SET_AVAILABILITY_SUCCESS": "La disponibilidad se ha establecido con éxito",
         "SET_AVAILABILITY_ERROR": "No se pudo establecer la disponibilidad, inténtelo de nuevo",
-        "IMPERSONATING_ERROR": "Cannot change availability while impersonating a user"
+        "IMPERSONATING_ERROR": "No se puede cambiar la disponibilidad al suplantar a un usuario"
       },
       "EMAIL": {
         "LABEL": "Tu dirección de correo",
diff --git a/app/javascript/dashboard/i18n/locale/fa/automation.json b/app/javascript/dashboard/i18n/locale/fa/automation.json
index 40ad16241..b04ae78dd 100644
--- a/app/javascript/dashboard/i18n/locale/fa/automation.json
+++ b/app/javascript/dashboard/i18n/locale/fa/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "تغییر اولویت",
-      "ADD_SLA": "اضافه کردن SLA"
+      "ADD_SLA": "اضافه کردن SLA",
+      "OPEN_CONVERSATION": "باز کردن گفتگو"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/fa/components.json b/app/javascript/dashboard/i18n/locale/fa/components.json
index 13c553711..b2dd2e2ee 100644
--- a/app/javascript/dashboard/i18n/locale/fa/components.json
+++ b/app/javascript/dashboard/i18n/locale/fa/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/fa/conversation.json b/app/javascript/dashboard/i18n/locale/fa/conversation.json
index ef92db5b0..07f540d3d 100644
--- a/app/javascript/dashboard/i18n/locale/fa/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/fa/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "هفته بعد"
       }
     },
+    "MENTION": {
+      "AGENTS": "ایجنت ها",
+      "TEAMS": "تیم‌ها"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "به تعویق انداختن تا",
       "APPLY": "به تعویق انداختن",
diff --git a/app/javascript/dashboard/i18n/locale/fa/generalSettings.json b/app/javascript/dashboard/i18n/locale/fa/generalSettings.json
index 9d0e398f9..412be985d 100644
--- a/app/javascript/dashboard/i18n/locale/fa/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/fa/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "تنظیمات حساب",
diff --git a/app/javascript/dashboard/i18n/locale/fa/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/fa/inboxMgmt.json
index 87f1f1e95..d13df62ed 100644
--- a/app/javascript/dashboard/i18n/locale/fa/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/fa/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "ما نتوانستیم کانال WhatsApp را ذخیره کنیم"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "شماره تلفن",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "شناسه SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth توکن",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "کانال API",
         "DESC": "با کانال API ادغام شده و از مشتریان خود پشتیبانی کنید.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "کانال API",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/fa/integrations.json b/app/javascript/dashboard/i18n/locale/fa/integrations.json
index 2e1b4d38e..7b6e8fe5c 100644
--- a/app/javascript/dashboard/i18n/locale/fa/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/fa/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "بله، حذف شود",
+        "CANCEL": "انصراف"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "حذف",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/fi/automation.json b/app/javascript/dashboard/i18n/locale/fi/automation.json
index 7a8ab4ad6..c151c7530 100644
--- a/app/javascript/dashboard/i18n/locale/fi/automation.json
+++ b/app/javascript/dashboard/i18n/locale/fi/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/fi/components.json b/app/javascript/dashboard/i18n/locale/fi/components.json
index 4270da3d8..16b40e1e4 100644
--- a/app/javascript/dashboard/i18n/locale/fi/components.json
+++ b/app/javascript/dashboard/i18n/locale/fi/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/fi/conversation.json b/app/javascript/dashboard/i18n/locale/fi/conversation.json
index 3c91f2c2c..cf82a8ed5 100644
--- a/app/javascript/dashboard/i18n/locale/fi/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/fi/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Edustajat",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/fi/generalSettings.json b/app/javascript/dashboard/i18n/locale/fi/generalSettings.json
index a25c64396..699606a35 100644
--- a/app/javascript/dashboard/i18n/locale/fi/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/fi/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Tilin asetukset",
diff --git a/app/javascript/dashboard/i18n/locale/fi/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/fi/inboxMgmt.json
index 90d823345..c0ca9c1b5 100644
--- a/app/javascript/dashboard/i18n/locale/fi/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/fi/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Puhelinnumero",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Tilin SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API-rajapinta",
         "DESC": "Integroi API-rajapintaan ja aloita tukemaan asiakkaitasi.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API-rajapinta",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/fi/integrations.json b/app/javascript/dashboard/i18n/locale/fi/integrations.json
index 491f7c768..d61448b90 100644
--- a/app/javascript/dashboard/i18n/locale/fi/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/fi/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Peruuta"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Poista",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/fr/agentBots.json b/app/javascript/dashboard/i18n/locale/fr/agentBots.json
index 477eef743..99142ad27 100644
--- a/app/javascript/dashboard/i18n/locale/fr/agentBots.json
+++ b/app/javascript/dashboard/i18n/locale/fr/agentBots.json
@@ -61,10 +61,10 @@
     },
     "ACCESS_TOKEN": {
       "TITLE": "Jeton d'accès",
-      "DESCRIPTION": "Copy the access token and save it securely",
-      "COPY_SUCCESSFUL": "Access token copied to clipboard",
-      "RESET_SUCCESS": "Access token regenerated successfully",
-      "RESET_ERROR": "Unable to regenerate access token. Please try again"
+      "DESCRIPTION": "Copiez le jeton d'accès et enregistrez-le en toute sécurité",
+      "COPY_SUCCESSFUL": "Jeton d'accès copié dans le presse-papier",
+      "RESET_SUCCESS": "Jeton d'accès régénéré avec succès",
+      "RESET_ERROR": "Impossible de régénérer le jeton d'accès. Veuillez réessayer"
     },
     "FORM": {
       "AVATAR": {
@@ -82,11 +82,11 @@
       "WEBHOOK_URL": {
         "LABEL": "URL du Webhook",
         "PLACEHOLDER": "https://example.com/webhook",
-        "REQUIRED": "L'URL du webhook est requise"
+        "REQUIRED": "L'URL du Webhook est requise"
       },
       "ERRORS": {
         "NAME": "Le nom du bot est requis",
-        "URL": "L'URL du webhook est requise",
+        "URL": "L'URL du Webhook est requise",
         "VALID_URL": "Veuillez entrer une URL valide commençant par http:// ou https://"
       },
       "CANCEL": "Annuler",
diff --git a/app/javascript/dashboard/i18n/locale/fr/automation.json b/app/javascript/dashboard/i18n/locale/fr/automation.json
index c2c657a54..46153c7d7 100644
--- a/app/javascript/dashboard/i18n/locale/fr/automation.json
+++ b/app/javascript/dashboard/i18n/locale/fr/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Envoyer la pièce jointe",
       "SEND_MESSAGE": "Envoyer un message",
       "CHANGE_PRIORITY": "Modifier la priorité",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Ouvrir la conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Type de message",
diff --git a/app/javascript/dashboard/i18n/locale/fr/components.json b/app/javascript/dashboard/i18n/locale/fr/components.json
index 41e6a1b0d..491f0d493 100644
--- a/app/javascript/dashboard/i18n/locale/fr/components.json
+++ b/app/javascript/dashboard/i18n/locale/fr/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Heures",
     "DAYS": "Jours",
     "PLACEHOLDER": "Entrez la durée"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/fr/conversation.json b/app/javascript/dashboard/i18n/locale/fr/conversation.json
index 70d9014ac..73f0ba7e6 100644
--- a/app/javascript/dashboard/i18n/locale/fr/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/fr/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Semaine prochaine"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agents",
+      "TEAMS": "Équipes"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Reporter jusqu'à",
       "APPLY": "Reporter",
diff --git a/app/javascript/dashboard/i18n/locale/fr/generalSettings.json b/app/javascript/dashboard/i18n/locale/fr/generalSettings.json
index 5ba2a8767..e2485cd9c 100644
--- a/app/javascript/dashboard/i18n/locale/fr/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/fr/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "Vous avez dépassé la limite de conversation. Le plan Hacker autorise uniquement 500 conversations.",
       "INBOXES": "Vous avez dépassé la limite de boîtes de réception. Le plan Hacker ne prend en charge que le chat en direct sur le site Web. Des boîtes de réception supplémentaires telles que l'email, WhatsApp, etc. nécessitent un plan payant.",
-      "AGENTS": "Vous avez dépassé la limite d'agents. Le plan Hacker permet uniquement 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Veuillez contacter votre administrateur pour mettre à niveau le plan et continuer à utiliser toutes les fonctionnalités."
     },
     "TITLE": "Paramètres du compte",
diff --git a/app/javascript/dashboard/i18n/locale/fr/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/fr/inboxMgmt.json
index 5981e27e9..7a5ec1d7a 100644
--- a/app/javascript/dashboard/i18n/locale/fr/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/fr/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Nous n'avons pas pu enregistrer le canal WhatsApp"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Numéro de téléphone",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "SID du compte",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Jeton d'authentification",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "SID de la clé API",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "Secret de la clé API",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "Canal API",
         "DESC": "Intégrez le canal API et commencez à aider vos clients.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "Canal API",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/fr/integrations.json b/app/javascript/dashboard/i18n/locale/fr/integrations.json
index 450d22b9b..153c04ca0 100644
--- a/app/javascript/dashboard/i18n/locale/fr/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/fr/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Oui, supprimer",
+        "CANCEL": "Annuler"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Supprimer",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/fr/settings.json b/app/javascript/dashboard/i18n/locale/fr/settings.json
index 1f6dd95fd..404673d71 100644
--- a/app/javascript/dashboard/i18n/locale/fr/settings.json
+++ b/app/javascript/dashboard/i18n/locale/fr/settings.json
@@ -80,8 +80,8 @@
         "RESET": "Reset",
         "CONFIRM_RESET": "Are you sure?",
         "CONFIRM_HINT": "Click again to confirm",
-        "RESET_SUCCESS": "Access token regenerated successfully",
-        "RESET_ERROR": "Unable to regenerate access token. Please try again"
+        "RESET_SUCCESS": "Jeton d'accès régénéré avec succès",
+        "RESET_ERROR": "Impossible de régénérer le jeton d'accès. Veuillez réessayer"
       },
       "AUDIO_NOTIFICATIONS_SECTION": {
         "TITLE": "Audio Alerts",
diff --git a/app/javascript/dashboard/i18n/locale/he/automation.json b/app/javascript/dashboard/i18n/locale/he/automation.json
index 31a7fb68c..5b8f1edd7 100644
--- a/app/javascript/dashboard/i18n/locale/he/automation.json
+++ b/app/javascript/dashboard/i18n/locale/he/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "שיחה פתוחה"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/he/components.json b/app/javascript/dashboard/i18n/locale/he/components.json
index d2855b661..f9a713cdd 100644
--- a/app/javascript/dashboard/i18n/locale/he/components.json
+++ b/app/javascript/dashboard/i18n/locale/he/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/he/conversation.json b/app/javascript/dashboard/i18n/locale/he/conversation.json
index ce1224c3a..4f68f873b 100644
--- a/app/javascript/dashboard/i18n/locale/he/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/he/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "שבוע הבא"
       }
     },
+    "MENTION": {
+      "AGENTS": "סוכנים",
+      "TEAMS": "צוותים"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "השהה עד",
       "APPLY": "נודניק",
diff --git a/app/javascript/dashboard/i18n/locale/he/generalSettings.json b/app/javascript/dashboard/i18n/locale/he/generalSettings.json
index 0a677534a..0c231eb57 100644
--- a/app/javascript/dashboard/i18n/locale/he/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/he/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "הגדרות חשבון",
diff --git a/app/javascript/dashboard/i18n/locale/he/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/he/inboxMgmt.json
index 262628cbf..1b118b24a 100644
--- a/app/javascript/dashboard/i18n/locale/he/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/he/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "לא הצלחנו לשמור את ערוץ הוואטסאפ"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "מספר טלפון",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "חשבון SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "ערוץ API",
         "DESC": "שלב עם ערוץ API והתחל לתמוך בלקוחות שלך.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "ערוץ API",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/he/integrations.json b/app/javascript/dashboard/i18n/locale/he/integrations.json
index 6ec0bef03..187d6f4db 100644
--- a/app/javascript/dashboard/i18n/locale/he/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/he/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "ביטול"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "מחק",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/hi/automation.json b/app/javascript/dashboard/i18n/locale/hi/automation.json
index 86ec0b58b..c5dd4a514 100644
--- a/app/javascript/dashboard/i18n/locale/hi/automation.json
+++ b/app/javascript/dashboard/i18n/locale/hi/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/hi/components.json b/app/javascript/dashboard/i18n/locale/hi/components.json
index dea9e6b1a..748020e02 100644
--- a/app/javascript/dashboard/i18n/locale/hi/components.json
+++ b/app/javascript/dashboard/i18n/locale/hi/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/hi/conversation.json b/app/javascript/dashboard/i18n/locale/hi/conversation.json
index c047f17ad..5b3b7f3f8 100644
--- a/app/javascript/dashboard/i18n/locale/hi/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/hi/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agents",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/hi/generalSettings.json b/app/javascript/dashboard/i18n/locale/hi/generalSettings.json
index c0c4d247d..9055574c5 100644
--- a/app/javascript/dashboard/i18n/locale/hi/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/hi/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/hi/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/hi/inboxMgmt.json
index 5e7ac5a26..6c7ab319f 100644
--- a/app/javascript/dashboard/i18n/locale/hi/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/hi/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/hi/integrations.json b/app/javascript/dashboard/i18n/locale/hi/integrations.json
index bd79e81f3..252b62930 100644
--- a/app/javascript/dashboard/i18n/locale/hi/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/hi/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Cancel"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Delete",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/hr/automation.json b/app/javascript/dashboard/i18n/locale/hr/automation.json
index 0f0bdddbe..1b55967df 100644
--- a/app/javascript/dashboard/i18n/locale/hr/automation.json
+++ b/app/javascript/dashboard/i18n/locale/hr/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Promjena prioriteta",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Otvori razgovor"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/hr/components.json b/app/javascript/dashboard/i18n/locale/hr/components.json
index cd32e5822..372cb867d 100644
--- a/app/javascript/dashboard/i18n/locale/hr/components.json
+++ b/app/javascript/dashboard/i18n/locale/hr/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/hr/conversation.json b/app/javascript/dashboard/i18n/locale/hr/conversation.json
index ada317045..755b22c5a 100644
--- a/app/javascript/dashboard/i18n/locale/hr/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/hr/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agenti",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/hr/generalSettings.json b/app/javascript/dashboard/i18n/locale/hr/generalSettings.json
index e88423779..135b66d04 100644
--- a/app/javascript/dashboard/i18n/locale/hr/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/hr/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/hr/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/hr/inboxMgmt.json
index 836736ef7..a3fa3f041 100644
--- a/app/javascript/dashboard/i18n/locale/hr/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/hr/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/hr/integrations.json b/app/javascript/dashboard/i18n/locale/hr/integrations.json
index 89954c4e2..f7ccb7e83 100644
--- a/app/javascript/dashboard/i18n/locale/hr/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/hr/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Da, izbriši",
+        "CANCEL": "Odustani"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Izbriši",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/hu/automation.json b/app/javascript/dashboard/i18n/locale/hu/automation.json
index 72b5aabe3..7de73e485 100644
--- a/app/javascript/dashboard/i18n/locale/hu/automation.json
+++ b/app/javascript/dashboard/i18n/locale/hu/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Prioritás megváltoztatása",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Beszélgetés megnyitása"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/hu/components.json b/app/javascript/dashboard/i18n/locale/hu/components.json
index f16dacaf8..22a01aeaf 100644
--- a/app/javascript/dashboard/i18n/locale/hu/components.json
+++ b/app/javascript/dashboard/i18n/locale/hu/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/hu/conversation.json b/app/javascript/dashboard/i18n/locale/hu/conversation.json
index 6fe483cf3..31137350e 100644
--- a/app/javascript/dashboard/i18n/locale/hu/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/hu/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Jövő héten"
       }
     },
+    "MENTION": {
+      "AGENTS": "Ügynökök",
+      "TEAMS": "Csapatok"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Halasztás eddig",
       "APPLY": "Halasztás",
diff --git a/app/javascript/dashboard/i18n/locale/hu/generalSettings.json b/app/javascript/dashboard/i18n/locale/hu/generalSettings.json
index 9e52f1585..12d41de10 100644
--- a/app/javascript/dashboard/i18n/locale/hu/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/hu/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Fiókbeállítások",
diff --git a/app/javascript/dashboard/i18n/locale/hu/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/hu/inboxMgmt.json
index 15ee5d45d..3cff39478 100644
--- a/app/javascript/dashboard/i18n/locale/hu/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/hu/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Nem tudtuk elmenteni a WhatsApp csatornát"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Telefonszám",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Fiók SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API kulcs biztonsági azonosító (SID)",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API titkos kulcs",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API csatorna",
         "DESC": "API-val integrálj és láss neki az ügyfeleid támogatásának.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API csatorna",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/hu/integrations.json b/app/javascript/dashboard/i18n/locale/hu/integrations.json
index 098dd1f1a..96c356132 100644
--- a/app/javascript/dashboard/i18n/locale/hu/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/hu/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Igen, törlés",
+        "CANCEL": "Mégse"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Törlés",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/hy/automation.json b/app/javascript/dashboard/i18n/locale/hy/automation.json
index 86ec0b58b..c5dd4a514 100644
--- a/app/javascript/dashboard/i18n/locale/hy/automation.json
+++ b/app/javascript/dashboard/i18n/locale/hy/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/hy/components.json b/app/javascript/dashboard/i18n/locale/hy/components.json
index e44c6e039..0a2542a84 100644
--- a/app/javascript/dashboard/i18n/locale/hy/components.json
+++ b/app/javascript/dashboard/i18n/locale/hy/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/hy/conversation.json b/app/javascript/dashboard/i18n/locale/hy/conversation.json
index c047f17ad..5b3b7f3f8 100644
--- a/app/javascript/dashboard/i18n/locale/hy/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/hy/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agents",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/hy/generalSettings.json b/app/javascript/dashboard/i18n/locale/hy/generalSettings.json
index c0c4d247d..9055574c5 100644
--- a/app/javascript/dashboard/i18n/locale/hy/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/hy/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/hy/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/hy/inboxMgmt.json
index dae2f9ecb..9d5c70609 100644
--- a/app/javascript/dashboard/i18n/locale/hy/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/hy/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/hy/integrations.json b/app/javascript/dashboard/i18n/locale/hy/integrations.json
index 4eb1343cb..7ae07cfa2 100644
--- a/app/javascript/dashboard/i18n/locale/hy/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/hy/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Cancel"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Delete",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/id/automation.json b/app/javascript/dashboard/i18n/locale/id/automation.json
index c358b0daa..53a15ed78 100644
--- a/app/javascript/dashboard/i18n/locale/id/automation.json
+++ b/app/javascript/dashboard/i18n/locale/id/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Ubah Prioritas",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Buka percakapan"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/id/components.json b/app/javascript/dashboard/i18n/locale/id/components.json
index 4275c1226..2f1e6802a 100644
--- a/app/javascript/dashboard/i18n/locale/id/components.json
+++ b/app/javascript/dashboard/i18n/locale/id/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/id/conversation.json b/app/javascript/dashboard/i18n/locale/id/conversation.json
index d3750a26e..b8be52a53 100644
--- a/app/javascript/dashboard/i18n/locale/id/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/id/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Minggu depan"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agen",
+      "TEAMS": "Tim"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Tunda hingga",
       "APPLY": "Tunda",
diff --git a/app/javascript/dashboard/i18n/locale/id/generalSettings.json b/app/javascript/dashboard/i18n/locale/id/generalSettings.json
index 02afb7fcb..435759147 100644
--- a/app/javascript/dashboard/i18n/locale/id/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/id/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Pengaturan akun",
diff --git a/app/javascript/dashboard/i18n/locale/id/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/id/inboxMgmt.json
index e4277c490..6c394a9b4 100644
--- a/app/javascript/dashboard/i18n/locale/id/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/id/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Kami tidak dapat menyimpan saluran WhatsApp"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Nomor Telepon",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Token Auth",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrasikan dengan saluran API dan mulai dukung pelanggan Anda.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/id/integrations.json b/app/javascript/dashboard/i18n/locale/id/integrations.json
index 6a10e7bd2..46631614a 100644
--- a/app/javascript/dashboard/i18n/locale/id/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/id/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Ya, hapus",
+        "CANCEL": "Batalkan"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Hapus",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/is/automation.json b/app/javascript/dashboard/i18n/locale/is/automation.json
index 48f3a7a4c..0e527019e 100644
--- a/app/javascript/dashboard/i18n/locale/is/automation.json
+++ b/app/javascript/dashboard/i18n/locale/is/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Opna samtal"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/is/components.json b/app/javascript/dashboard/i18n/locale/is/components.json
index d71ecd858..d3c75b1d6 100644
--- a/app/javascript/dashboard/i18n/locale/is/components.json
+++ b/app/javascript/dashboard/i18n/locale/is/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/is/conversation.json b/app/javascript/dashboard/i18n/locale/is/conversation.json
index b5968c810..b6e07c663 100644
--- a/app/javascript/dashboard/i18n/locale/is/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/is/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Þjónustufulltrúar",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/is/generalSettings.json b/app/javascript/dashboard/i18n/locale/is/generalSettings.json
index 0a4b3c052..9b8aec36c 100644
--- a/app/javascript/dashboard/i18n/locale/is/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/is/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Aðgangs stillingar",
diff --git a/app/javascript/dashboard/i18n/locale/is/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/is/inboxMgmt.json
index 9f1ace4f7..5f543ffe0 100644
--- a/app/javascript/dashboard/i18n/locale/is/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/is/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Við gátum ekki vistað WhatsApp rásina"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Símanúmer",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "SID Aðgangs",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auðkenningar token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Samþættu við API rásina og byrjaðu að þjónusta viðskiptavini þína.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/is/integrations.json b/app/javascript/dashboard/i18n/locale/is/integrations.json
index 90ba47749..bea96a131 100644
--- a/app/javascript/dashboard/i18n/locale/is/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/is/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Hætta við"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Eyða",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/it/automation.json b/app/javascript/dashboard/i18n/locale/it/automation.json
index f6e48123a..fef16e1d0 100644
--- a/app/javascript/dashboard/i18n/locale/it/automation.json
+++ b/app/javascript/dashboard/i18n/locale/it/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Apri conversazione"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/it/components.json b/app/javascript/dashboard/i18n/locale/it/components.json
index c1d5dfd8b..9df2334b7 100644
--- a/app/javascript/dashboard/i18n/locale/it/components.json
+++ b/app/javascript/dashboard/i18n/locale/it/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/it/conversation.json b/app/javascript/dashboard/i18n/locale/it/conversation.json
index 594e154d1..f5dc23388 100644
--- a/app/javascript/dashboard/i18n/locale/it/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/it/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Prossima settimana"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agenti",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Posticipa fino a",
       "APPLY": "Posticipa",
diff --git a/app/javascript/dashboard/i18n/locale/it/generalSettings.json b/app/javascript/dashboard/i18n/locale/it/generalSettings.json
index 7b7906541..63d8c2ef9 100644
--- a/app/javascript/dashboard/i18n/locale/it/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/it/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Impostazioni account",
diff --git a/app/javascript/dashboard/i18n/locale/it/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/it/inboxMgmt.json
index 80394d5a1..ff88be563 100644
--- a/app/javascript/dashboard/i18n/locale/it/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/it/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Non siamo stati in grado di salvare il canale WhatsApp"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Numero di telefono",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "SID dell'account",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Token di autenticazione",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "Canale API",
         "DESC": "Integra con il canale API e inizia a supportare i tuoi clienti.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "Canale API",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/it/integrations.json b/app/javascript/dashboard/i18n/locale/it/integrations.json
index 12b389fa3..a908a28d9 100644
--- a/app/javascript/dashboard/i18n/locale/it/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/it/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "annulla"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Elimina",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/ja/automation.json b/app/javascript/dashboard/i18n/locale/ja/automation.json
index 1b8a079c2..d5384e5b5 100644
--- a/app/javascript/dashboard/i18n/locale/ja/automation.json
+++ b/app/javascript/dashboard/i18n/locale/ja/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "優先度を変更",
-      "ADD_SLA": "SLAを追加"
+      "ADD_SLA": "SLAを追加",
+      "OPEN_CONVERSATION": "会話を開く"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/ja/components.json b/app/javascript/dashboard/i18n/locale/ja/components.json
index 75ea91312..f91e4f5d4 100644
--- a/app/javascript/dashboard/i18n/locale/ja/components.json
+++ b/app/javascript/dashboard/i18n/locale/ja/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ja/conversation.json b/app/javascript/dashboard/i18n/locale/ja/conversation.json
index 23d768def..76aff17c6 100644
--- a/app/javascript/dashboard/i18n/locale/ja/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/ja/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "次週"
       }
     },
+    "MENTION": {
+      "AGENTS": "担当者",
+      "TEAMS": "チーム"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "までスヌーズする",
       "APPLY": "スヌーズ",
diff --git a/app/javascript/dashboard/i18n/locale/ja/generalSettings.json b/app/javascript/dashboard/i18n/locale/ja/generalSettings.json
index c52280e39..8323df4d7 100644
--- a/app/javascript/dashboard/i18n/locale/ja/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/ja/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "アカウント設定",
diff --git a/app/javascript/dashboard/i18n/locale/ja/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/ja/inboxMgmt.json
index 3a44b1503..98908f70b 100644
--- a/app/javascript/dashboard/i18n/locale/ja/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/ja/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "WhatsAppチャンネルを保存できませんでした"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "電話番号",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "アカウント SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "認証トークン",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "APIキー SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "APIキーシークレット",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "APIチャンネル",
         "DESC": "APIチャンネルと連携し、顧客のサポートを開始します。",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "APIチャンネル",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ja/integrations.json b/app/javascript/dashboard/i18n/locale/ja/integrations.json
index 42694429a..d7119ea0b 100644
--- a/app/javascript/dashboard/i18n/locale/ja/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/ja/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "はい、削除します",
+        "CANCEL": "キャンセル"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "会話 #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "削除",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/ka/automation.json b/app/javascript/dashboard/i18n/locale/ka/automation.json
index 86ec0b58b..c5dd4a514 100644
--- a/app/javascript/dashboard/i18n/locale/ka/automation.json
+++ b/app/javascript/dashboard/i18n/locale/ka/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/ka/components.json b/app/javascript/dashboard/i18n/locale/ka/components.json
index e44c6e039..0a2542a84 100644
--- a/app/javascript/dashboard/i18n/locale/ka/components.json
+++ b/app/javascript/dashboard/i18n/locale/ka/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ka/conversation.json b/app/javascript/dashboard/i18n/locale/ka/conversation.json
index c047f17ad..5b3b7f3f8 100644
--- a/app/javascript/dashboard/i18n/locale/ka/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/ka/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agents",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/ka/generalSettings.json b/app/javascript/dashboard/i18n/locale/ka/generalSettings.json
index c0c4d247d..9055574c5 100644
--- a/app/javascript/dashboard/i18n/locale/ka/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/ka/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/ka/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/ka/inboxMgmt.json
index 5e7ac5a26..6c7ab319f 100644
--- a/app/javascript/dashboard/i18n/locale/ka/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/ka/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ka/integrations.json b/app/javascript/dashboard/i18n/locale/ka/integrations.json
index 4eb1343cb..7ae07cfa2 100644
--- a/app/javascript/dashboard/i18n/locale/ka/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/ka/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Cancel"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Delete",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/ko/automation.json b/app/javascript/dashboard/i18n/locale/ko/automation.json
index b2e244e19..66df959f0 100644
--- a/app/javascript/dashboard/i18n/locale/ko/automation.json
+++ b/app/javascript/dashboard/i18n/locale/ko/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/ko/components.json b/app/javascript/dashboard/i18n/locale/ko/components.json
index fa25dece7..3dab334a9 100644
--- a/app/javascript/dashboard/i18n/locale/ko/components.json
+++ b/app/javascript/dashboard/i18n/locale/ko/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ko/conversation.json b/app/javascript/dashboard/i18n/locale/ko/conversation.json
index e346d0ae8..610f3eaf4 100644
--- a/app/javascript/dashboard/i18n/locale/ko/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/ko/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "다음 주"
       }
     },
+    "MENTION": {
+      "AGENTS": "에이전트",
+      "TEAMS": "팀"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/ko/generalSettings.json b/app/javascript/dashboard/i18n/locale/ko/generalSettings.json
index 2bb6ea2fb..340825f62 100644
--- a/app/javascript/dashboard/i18n/locale/ko/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/ko/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "계정 설정",
diff --git a/app/javascript/dashboard/i18n/locale/ko/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/ko/inboxMgmt.json
index f99b7c627..33709e16f 100644
--- a/app/javascript/dashboard/i18n/locale/ko/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/ko/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "전화 번호",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "계정 SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "인증 토큰",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API 채널",
         "DESC": "API 채널과 통합하여 고객 지원을 시작하십시오.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API 채널",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ko/integrations.json b/app/javascript/dashboard/i18n/locale/ko/integrations.json
index e0b1209ca..c279a9097 100644
--- a/app/javascript/dashboard/i18n/locale/ko/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/ko/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "취소"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "삭제",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/lt/automation.json b/app/javascript/dashboard/i18n/locale/lt/automation.json
index 23e392120..08ff2e825 100644
--- a/app/javascript/dashboard/i18n/locale/lt/automation.json
+++ b/app/javascript/dashboard/i18n/locale/lt/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Pakeisti Prioritetą",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Atidaryti pokalbį"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/lt/components.json b/app/javascript/dashboard/i18n/locale/lt/components.json
index 47b7bc6f5..52980d59f 100644
--- a/app/javascript/dashboard/i18n/locale/lt/components.json
+++ b/app/javascript/dashboard/i18n/locale/lt/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/lt/conversation.json b/app/javascript/dashboard/i18n/locale/lt/conversation.json
index 49dcba6ca..1e1e8c5da 100644
--- a/app/javascript/dashboard/i18n/locale/lt/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/lt/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Kitą savaitę"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agentai",
+      "TEAMS": "Komandos"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Atidėti iki",
       "APPLY": "Atidėti",
diff --git a/app/javascript/dashboard/i18n/locale/lt/generalSettings.json b/app/javascript/dashboard/i18n/locale/lt/generalSettings.json
index bd62ea64e..42fdca091 100644
--- a/app/javascript/dashboard/i18n/locale/lt/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/lt/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Paskyros nustatymai",
diff --git a/app/javascript/dashboard/i18n/locale/lt/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/lt/inboxMgmt.json
index 2ca3dd7a9..bc295c614 100644
--- a/app/javascript/dashboard/i18n/locale/lt/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/lt/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Mes negalėjome išsaugoti WhatsApp kanalo"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Telefono numeris",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Paskyros SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Prieigos Raktas",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API kanalas",
         "DESC": "Integruokite API kanalą ir pradėkite komunikuoti su savo klientais.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API kanalas",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/lt/integrations.json b/app/javascript/dashboard/i18n/locale/lt/integrations.json
index 00e13c468..2761b7024 100644
--- a/app/javascript/dashboard/i18n/locale/lt/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/lt/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Taip, Trinti",
+        "CANCEL": "Atšaukti"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Ištrinti",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/lv/automation.json b/app/javascript/dashboard/i18n/locale/lv/automation.json
index 557857b9d..f1e107b17 100644
--- a/app/javascript/dashboard/i18n/locale/lv/automation.json
+++ b/app/javascript/dashboard/i18n/locale/lv/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Sūtīt Pielikumu",
       "SEND_MESSAGE": "Nosūtīt Ziņojumu",
       "CHANGE_PRIORITY": "Mainīt prioritāti",
-      "ADD_SLA": "Pievienot SLA"
+      "ADD_SLA": "Pievienot SLA",
+      "OPEN_CONVERSATION": "Atvērt sarunu"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Ziņojuma Tips",
diff --git a/app/javascript/dashboard/i18n/locale/lv/components.json b/app/javascript/dashboard/i18n/locale/lv/components.json
index 33f36c584..fc47b929f 100644
--- a/app/javascript/dashboard/i18n/locale/lv/components.json
+++ b/app/javascript/dashboard/i18n/locale/lv/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/lv/conversation.json b/app/javascript/dashboard/i18n/locale/lv/conversation.json
index b69618141..7181a6977 100644
--- a/app/javascript/dashboard/i18n/locale/lv/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/lv/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Nākamā nedēļa"
       }
     },
+    "MENTION": {
+      "AGENTS": "Aģenti",
+      "TEAMS": "Komandas"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Atlikt līdz",
       "APPLY": "Atlikt",
diff --git a/app/javascript/dashboard/i18n/locale/lv/generalSettings.json b/app/javascript/dashboard/i18n/locale/lv/generalSettings.json
index fd7067904..74cc49c37 100644
--- a/app/javascript/dashboard/i18n/locale/lv/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/lv/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "Jūs esat pārsniedzis sarunu ierobežojumu. Hacker plāns pieļauj tikai 500 sarunas.",
       "INBOXES": "Jūs esat pārsniedzis iesūtnes ierobežojumu. Hacker plāns atbalsta tikai vietnes tiešraides tērzēšanu. Papildu iesūtnēm, piemēram, e-pastam, WhatsApp utt., ir nepieciešams maksas plāns.",
-      "AGENTS": "Jūs esat pārsniedzis aģentu ierobežojumu. Hakeru plānā ir atļauti tikai 2 aģenti.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Lūdzu, sazinieties ar savu administratoru, lai modernizētu plānu un turpinātu izmantot visas funkcijas."
     },
     "TITLE": "Konta iestatījumi",
diff --git a/app/javascript/dashboard/i18n/locale/lv/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/lv/inboxMgmt.json
index 616b11de9..bee8165f1 100644
--- a/app/javascript/dashboard/i18n/locale/lv/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/lv/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Mēs nevarējām saglabāt WhatsApp kanālu"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Telefona numurs",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Konta SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Atslēgas SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Atslēgas Noslēpums",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Kanāls",
         "DESC": "Integrēt ar API kanālu un sākt atbalstīt savus klientus.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Kanāls",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/lv/integrations.json b/app/javascript/dashboard/i18n/locale/lv/integrations.json
index c230ded21..840ae0fd7 100644
--- a/app/javascript/dashboard/i18n/locale/lv/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/lv/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Jā, dzēst",
+        "CANCEL": "Atcelt"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Saruna #{id}"
       },
       "SELECTED": "Atlasīti {count}",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Apstiprināt",
       "BULK_DELETE_BUTTON": "Dzēst",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/ml/automation.json b/app/javascript/dashboard/i18n/locale/ml/automation.json
index 3d34b41ae..eba67abf8 100644
--- a/app/javascript/dashboard/i18n/locale/ml/automation.json
+++ b/app/javascript/dashboard/i18n/locale/ml/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/ml/components.json b/app/javascript/dashboard/i18n/locale/ml/components.json
index c2d1dc756..b0bc6e350 100644
--- a/app/javascript/dashboard/i18n/locale/ml/components.json
+++ b/app/javascript/dashboard/i18n/locale/ml/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ml/conversation.json b/app/javascript/dashboard/i18n/locale/ml/conversation.json
index 0ea878528..2d9f73dd7 100644
--- a/app/javascript/dashboard/i18n/locale/ml/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/ml/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "ഏജന്റുമാർ",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/ml/generalSettings.json b/app/javascript/dashboard/i18n/locale/ml/generalSettings.json
index 52cf08c2c..791618123 100644
--- a/app/javascript/dashboard/i18n/locale/ml/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/ml/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "അക്കൗണ്ട് ക്രമീകരണങ്ങൾ",
diff --git a/app/javascript/dashboard/i18n/locale/ml/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/ml/inboxMgmt.json
index 98d0fc0ca..dbdd9ce9a 100644
--- a/app/javascript/dashboard/i18n/locale/ml/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/ml/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "ഫോൺ നമ്പർ",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "അക്കൗണ്ട് എസ്ഐഡി",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "ഓത്ത് ടോക്കൺ",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ml/integrations.json b/app/javascript/dashboard/i18n/locale/ml/integrations.json
index f048ff9c6..6afe4c696 100644
--- a/app/javascript/dashboard/i18n/locale/ml/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/ml/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "റദ്ദാക്കുക"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "ഇല്ലാതാക്കുക",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/ms/automation.json b/app/javascript/dashboard/i18n/locale/ms/automation.json
index b94398364..d14827bb8 100644
--- a/app/javascript/dashboard/i18n/locale/ms/automation.json
+++ b/app/javascript/dashboard/i18n/locale/ms/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/ms/components.json b/app/javascript/dashboard/i18n/locale/ms/components.json
index c0ad88921..fd5c6ddca 100644
--- a/app/javascript/dashboard/i18n/locale/ms/components.json
+++ b/app/javascript/dashboard/i18n/locale/ms/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ms/conversation.json b/app/javascript/dashboard/i18n/locale/ms/conversation.json
index f85962a18..3d1360862 100644
--- a/app/javascript/dashboard/i18n/locale/ms/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/ms/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Ejen",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/ms/generalSettings.json b/app/javascript/dashboard/i18n/locale/ms/generalSettings.json
index c9f4fb9cd..986a4efe4 100644
--- a/app/javascript/dashboard/i18n/locale/ms/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/ms/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/ms/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/ms/inboxMgmt.json
index 90db11bee..d51ef2127 100644
--- a/app/javascript/dashboard/i18n/locale/ms/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/ms/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ms/integrations.json b/app/javascript/dashboard/i18n/locale/ms/integrations.json
index 316e84f1d..48a8afe8c 100644
--- a/app/javascript/dashboard/i18n/locale/ms/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/ms/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Batalkan"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Padamkan",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/ne/automation.json b/app/javascript/dashboard/i18n/locale/ne/automation.json
index c56f900f4..ceda8e268 100644
--- a/app/javascript/dashboard/i18n/locale/ne/automation.json
+++ b/app/javascript/dashboard/i18n/locale/ne/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/ne/components.json b/app/javascript/dashboard/i18n/locale/ne/components.json
index e44c6e039..0a2542a84 100644
--- a/app/javascript/dashboard/i18n/locale/ne/components.json
+++ b/app/javascript/dashboard/i18n/locale/ne/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ne/conversation.json b/app/javascript/dashboard/i18n/locale/ne/conversation.json
index 94f9f6e6a..907a3414b 100644
--- a/app/javascript/dashboard/i18n/locale/ne/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/ne/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agents",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/ne/generalSettings.json b/app/javascript/dashboard/i18n/locale/ne/generalSettings.json
index c0c4d247d..9055574c5 100644
--- a/app/javascript/dashboard/i18n/locale/ne/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/ne/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/ne/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/ne/inboxMgmt.json
index 11c2f88ce..763ed9409 100644
--- a/app/javascript/dashboard/i18n/locale/ne/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/ne/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ne/integrations.json b/app/javascript/dashboard/i18n/locale/ne/integrations.json
index 5779e973f..1f4a6b1a1 100644
--- a/app/javascript/dashboard/i18n/locale/ne/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/ne/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Cancel"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Delete",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/nl/automation.json b/app/javascript/dashboard/i18n/locale/nl/automation.json
index 09d19a055..1539499c4 100644
--- a/app/javascript/dashboard/i18n/locale/nl/automation.json
+++ b/app/javascript/dashboard/i18n/locale/nl/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/nl/components.json b/app/javascript/dashboard/i18n/locale/nl/components.json
index 5f52637d7..7f6f763b9 100644
--- a/app/javascript/dashboard/i18n/locale/nl/components.json
+++ b/app/javascript/dashboard/i18n/locale/nl/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/nl/conversation.json b/app/javascript/dashboard/i18n/locale/nl/conversation.json
index 1c64164f1..1bb5ea7a2 100644
--- a/app/javascript/dashboard/i18n/locale/nl/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/nl/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Volgende week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Medewerkers",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze tot",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/nl/generalSettings.json b/app/javascript/dashboard/i18n/locale/nl/generalSettings.json
index f371d56d6..c15d168e8 100644
--- a/app/javascript/dashboard/i18n/locale/nl/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/nl/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Accountinstellingen",
diff --git a/app/javascript/dashboard/i18n/locale/nl/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/nl/inboxMgmt.json
index 42a13dc94..cff43a383 100644
--- a/app/javascript/dashboard/i18n/locale/nl/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/nl/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Telefoonnummer",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Klant SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Authenticatie Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API-kanaal",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API-kanaal",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/nl/integrations.json b/app/javascript/dashboard/i18n/locale/nl/integrations.json
index 94cc0034d..f25f04f05 100644
--- a/app/javascript/dashboard/i18n/locale/nl/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/nl/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Ja, verwijderen",
+        "CANCEL": "Annuleren"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Verwijderen",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/no/automation.json b/app/javascript/dashboard/i18n/locale/no/automation.json
index 44edd7b44..afc9e7744 100644
--- a/app/javascript/dashboard/i18n/locale/no/automation.json
+++ b/app/javascript/dashboard/i18n/locale/no/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/no/components.json b/app/javascript/dashboard/i18n/locale/no/components.json
index 2e9776e1f..d5e551f8a 100644
--- a/app/javascript/dashboard/i18n/locale/no/components.json
+++ b/app/javascript/dashboard/i18n/locale/no/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/no/conversation.json b/app/javascript/dashboard/i18n/locale/no/conversation.json
index c83a5833b..3d70da918 100644
--- a/app/javascript/dashboard/i18n/locale/no/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/no/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agenter",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/no/generalSettings.json b/app/javascript/dashboard/i18n/locale/no/generalSettings.json
index d68075947..4329140a9 100644
--- a/app/javascript/dashboard/i18n/locale/no/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/no/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Kontoinnstillinger",
diff --git a/app/javascript/dashboard/i18n/locale/no/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/no/inboxMgmt.json
index 0cd2534aa..95dc44758 100644
--- a/app/javascript/dashboard/i18n/locale/no/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/no/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Telefonnummer",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Konto-SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Autoriseringstoken",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Kanal",
         "DESC": "Integrer med en API-kanal for å støtte dine kunder.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Kanal",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/no/integrations.json b/app/javascript/dashboard/i18n/locale/no/integrations.json
index 6d22be801..0af8f92b2 100644
--- a/app/javascript/dashboard/i18n/locale/no/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/no/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Avbryt"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Slett",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/pl/automation.json b/app/javascript/dashboard/i18n/locale/pl/automation.json
index efe06f71d..0817a235e 100644
--- a/app/javascript/dashboard/i18n/locale/pl/automation.json
+++ b/app/javascript/dashboard/i18n/locale/pl/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Zmień priorytet",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Otwórz rozmowę"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/pl/components.json b/app/javascript/dashboard/i18n/locale/pl/components.json
index dc56b980b..9801c5350 100644
--- a/app/javascript/dashboard/i18n/locale/pl/components.json
+++ b/app/javascript/dashboard/i18n/locale/pl/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/pl/conversation.json b/app/javascript/dashboard/i18n/locale/pl/conversation.json
index 4c3086088..91f68d0a8 100644
--- a/app/javascript/dashboard/i18n/locale/pl/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/pl/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Następny tydzień"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agenci",
+      "TEAMS": "Zespoły"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Uśpij do",
       "APPLY": "Uśpij",
diff --git a/app/javascript/dashboard/i18n/locale/pl/generalSettings.json b/app/javascript/dashboard/i18n/locale/pl/generalSettings.json
index 50ae20b2e..b81d9741c 100644
--- a/app/javascript/dashboard/i18n/locale/pl/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/pl/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Ustawienia konta",
diff --git a/app/javascript/dashboard/i18n/locale/pl/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/pl/inboxMgmt.json
index 8396d148e..676691ff3 100644
--- a/app/javascript/dashboard/i18n/locale/pl/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/pl/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Nie udało się zapisać kanału WhatsApp"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Numer telefonu",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "ID konta",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Token uwierzytelniania",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "Kanał API",
         "DESC": "Zintegruj kanał API i rozpocznij obsługę klientów.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "Kanał API",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/pl/integrations.json b/app/javascript/dashboard/i18n/locale/pl/integrations.json
index 65752a63f..3ebc5bd01 100644
--- a/app/javascript/dashboard/i18n/locale/pl/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/pl/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Tak, usuń",
+        "CANCEL": "Anuluj"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Usuń",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/pt/agentBots.json b/app/javascript/dashboard/i18n/locale/pt/agentBots.json
index 84b15f403..e2feb9296 100644
--- a/app/javascript/dashboard/i18n/locale/pt/agentBots.json
+++ b/app/javascript/dashboard/i18n/locale/pt/agentBots.json
@@ -2,13 +2,13 @@
   "AGENT_BOTS": {
     "HEADER": "Bots",
     "LOADING_EDITOR": "A carregar editor...",
-    "DESCRIPTION": "Agent Bots are like the most fabulous members of your team. They can handle the small stuff, so you can focus on the stuff that matters. Give them a try. You can manage your bots from this page or create new ones using the 'Add Bot' button.",
+    "DESCRIPTION": "Os Agentes Bots são como os membros mais fabulosos da sua equipa. Tratam das pequenas coisas, para que se possa concentrar no que realmente importa. Experimente. Pode gerir os seus bots nesta página ou criar novos, utilizando o botão \"Adicionar Bot\".",
     "LEARN_MORE": "Learn about agent bots",
-    "GLOBAL_BOT": "System bot",
+    "GLOBAL_BOT": "Bot do sistema",
     "GLOBAL_BOT_BADGE": "Sistema",
     "AVATAR": {
-      "SUCCESS_DELETE": "Bot avatar deleted successfully",
-      "ERROR_DELETE": "Error deleting bot avatar, please try again"
+      "SUCCESS_DELETE": "Avatar do bot apagado",
+      "ERROR_DELETE": "Erro ao apagar avatar do bot, por favor tente novamente"
     },
     "BOT_CONFIGURATION": {
       "TITLE": "Selecione um agente bot",
@@ -22,7 +22,7 @@
       "SELECT_PLACEHOLDER": "Selecionar bot"
     },
     "ADD": {
-      "TITLE": "Add Bot",
+      "TITLE": "Adicionar Bot",
       "CANCEL_BUTTON_TEXT": "Cancelar",
       "API": {
         "SUCCESS_MESSAGE": "Bot adicionado com sucesso.",
@@ -30,10 +30,10 @@
       }
     },
     "LIST": {
-      "404": "No bots found. You can create a bot by clicking the 'Add Bot' button.",
+      "404": "Nenhum bot encontrado. Pode criar um bot clicando no botão \"Adicionar Bot\".",
       "LOADING": "A carregar bots...",
       "TABLE_HEADER": {
-        "DETAILS": "Bot Details",
+        "DETAILS": "Detalhes do bot",
         "URL": "URL do Webhook"
       }
     },
@@ -42,7 +42,7 @@
       "TITLE": "Apagar bot",
       "CONFIRM": {
         "TITLE": "Confirmar exclusão",
-        "MESSAGE": "Are you sure you want to delete {name}?",
+        "MESSAGE": "Tem a certeza que pretende apagar o {name}?",
         "YES": "Sim, excluir",
         "NO": "Não, manter"
       },
@@ -61,10 +61,10 @@
     },
     "ACCESS_TOKEN": {
       "TITLE": "Token de acesso",
-      "DESCRIPTION": "Copy the access token and save it securely",
-      "COPY_SUCCESSFUL": "Access token copied to clipboard",
-      "RESET_SUCCESS": "Access token regenerated successfully",
-      "RESET_ERROR": "Unable to regenerate access token. Please try again"
+      "DESCRIPTION": "Copie o token de acesso e guarde-o de forma segura",
+      "COPY_SUCCESSFUL": "Token de acesso copiado para área de transferência",
+      "RESET_SUCCESS": "O token de acesso voltou a ser gerado",
+      "RESET_ERROR": "Não foi possível voltar a gerar o token de acesso, por favor tente novamente"
     },
     "FORM": {
       "AVATAR": {
@@ -72,7 +72,7 @@
       },
       "NAME": {
         "LABEL": "Nome do bot",
-        "PLACEHOLDER": "Enter bot name",
+        "PLACEHOLDER": "Insira o nome do bot",
         "REQUIRED": "O nome do bot é obrigatório"
       },
       "DESCRIPTION": {
@@ -81,20 +81,20 @@
       },
       "WEBHOOK_URL": {
         "LABEL": "URL do Webhook",
-        "PLACEHOLDER": "https://example.com/webhook",
-        "REQUIRED": "Webhook URL is required"
+        "PLACEHOLDER": "https://exemplo.com/webhook",
+        "REQUIRED": "O URL do Webhook é obrigatório"
       },
       "ERRORS": {
         "NAME": "O nome do bot é obrigatório",
-        "URL": "Webhook URL is required",
-        "VALID_URL": "Please enter a valid URL starting with http:// or https://"
+        "URL": "O URL do Webhook é obrigatório",
+        "VALID_URL": "Por favor, insira um URL válido que comece por http:// ou https://"
       },
       "CANCEL": "Cancelar",
-      "CREATE": "Create Bot",
-      "UPDATE": "Update Bot"
+      "CREATE": "Criar Bot",
+      "UPDATE": "Atualizar Bot"
     },
     "WEBHOOK": {
-      "DESCRIPTION": "Configure a webhook bot to integrate with your custom services. The bot will receive and process events from conversations and can respond to them."
+      "DESCRIPTION": "Configure um webhook para o bot integrar com os seus serviços personalizados. O bot receberá e processará eventos de conversas e pode respondê-los."
     },
     "TYPES": {
       "WEBHOOK": "Webhook bot"
diff --git a/app/javascript/dashboard/i18n/locale/pt/auditLogs.json b/app/javascript/dashboard/i18n/locale/pt/auditLogs.json
index 00914c17d..04f1bdd03 100644
--- a/app/javascript/dashboard/i18n/locale/pt/auditLogs.json
+++ b/app/javascript/dashboard/i18n/locale/pt/auditLogs.json
@@ -71,7 +71,7 @@
       "EDIT": "{agentName} updated the account configuration (#{id})"
     },
     "CONVERSATION": {
-      "DELETE": "{agentName} deleted conversation #{id}"
+      "DELETE": "{agentName} apagou a conversa #{id}"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/pt/automation.json b/app/javascript/dashboard/i18n/locale/pt/automation.json
index eebc50044..c24eae5fd 100644
--- a/app/javascript/dashboard/i18n/locale/pt/automation.json
+++ b/app/javascript/dashboard/i18n/locale/pt/automation.json
@@ -130,37 +130,38 @@
     "EVENTS": {
       "CONVERSATION_CREATED": "Conversa criada",
       "CONVERSATION_UPDATED": "Conversa atualizada",
-      "MESSAGE_CREATED": "Message Created",
-      "CONVERSATION_OPENED": "Conversation Opened"
+      "MESSAGE_CREATED": "Mensagem criada",
+      "CONVERSATION_OPENED": "Conversa aberta"
     },
     "ACTIONS": {
-      "ASSIGN_AGENT": "Assign to Agent",
-      "ASSIGN_TEAM": "Assign a Team",
-      "ADD_LABEL": "Add a Label",
-      "REMOVE_LABEL": "Remove a Label",
-      "SEND_EMAIL_TO_TEAM": "Send an Email to Team",
-      "SEND_EMAIL_TRANSCRIPT": "Send an Email Transcript",
+      "ASSIGN_AGENT": "Atribuir ao agente",
+      "ASSIGN_TEAM": "Atribuir equipa",
+      "ADD_LABEL": "Adicionar etiqueta",
+      "REMOVE_LABEL": "Remover um rótulo",
+      "SEND_EMAIL_TO_TEAM": "Enviar um e-mail para a equipa",
+      "SEND_EMAIL_TRANSCRIPT": "Enviar transcrição por e-mail",
       "MUTE_CONVERSATION": "Silenciar Conversa",
       "SNOOZE_CONVERSATION": "Adiar conversa",
       "RESOLVE_CONVERSATION": "Resolver conversa",
-      "SEND_WEBHOOK_EVENT": "Send Webhook Event",
+      "SEND_WEBHOOK_EVENT": "Enviar evento webhook",
       "SEND_ATTACHMENT": "Enviar anexo",
-      "SEND_MESSAGE": "Send a Message",
+      "SEND_MESSAGE": "Enviar mensagem",
       "CHANGE_PRIORITY": "Alterar prioridade",
-      "ADD_SLA": "Adicionar SLA"
+      "ADD_SLA": "Adicionar SLA",
+      "OPEN_CONVERSATION": "Abrir conversa"
     },
     "ATTRIBUTES": {
-      "MESSAGE_TYPE": "Message Type",
-      "MESSAGE_CONTAINS": "Message Contains",
+      "MESSAGE_TYPE": "Tipo de mensagem",
+      "MESSAGE_CONTAINS": "A mensagem contém",
       "EMAIL": "E-mail",
       "INBOX": "Caixa de entrada",
-      "CONVERSATION_LANGUAGE": "Conversation Language",
+      "CONVERSATION_LANGUAGE": "Linguagem da conversa",
       "PHONE_NUMBER": "Número de telefone",
       "STATUS": "Situação",
       "BROWSER_LANGUAGE": "Idioma do navegador",
-      "MAIL_SUBJECT": "Email Subject",
+      "MAIL_SUBJECT": "Assunto do e-mail",
       "COUNTRY_NAME": "País",
-      "REFERER_LINK": "Referrer Link",
+      "REFERER_LINK": "Link de referência",
       "ASSIGNEE_NAME": "Atribuído",
       "TEAM_NAME": "Equipa",
       "PRIORITY": "Prioridade"
diff --git a/app/javascript/dashboard/i18n/locale/pt/components.json b/app/javascript/dashboard/i18n/locale/pt/components.json
index df71ba7e8..8559d05b7 100644
--- a/app/javascript/dashboard/i18n/locale/pt/components.json
+++ b/app/javascript/dashboard/i18n/locale/pt/components.json
@@ -45,9 +45,12 @@
     "WATCH_VIDEO": "Watch video"
   },
   "DURATION_INPUT": {
-    "MINUTES": "Minutes",
-    "HOURS": "Hours",
-    "DAYS": "Days",
-    "PLACEHOLDER": "Enter duration"
+    "MINUTES": "Minutos",
+    "HOURS": "Horas",
+    "DAYS": "Dias",
+    "PLACEHOLDER": "Introduza a duração"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Em Breve!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/pt/contact.json b/app/javascript/dashboard/i18n/locale/pt/contact.json
index 365108766..e84d74f78 100644
--- a/app/javascript/dashboard/i18n/locale/pt/contact.json
+++ b/app/javascript/dashboard/i18n/locale/pt/contact.json
@@ -285,7 +285,7 @@
     "HEADER": {
       "TITLE": "Contactos",
       "SEARCH_TITLE": "Search contacts",
-      "ACTIVE_TITLE": "Active contacts",
+      "ACTIVE_TITLE": "Contactos ativos",
       "SEARCH_PLACEHOLDER": "Search...",
       "MESSAGE_BUTTON": "Messagem",
       "SEND_MESSAGE": "Enviar mensagem",
@@ -460,8 +460,8 @@
         }
       },
       "DELETE_CONTACT": {
-        "MESSAGE": "This action is permanent and irreversible.",
-        "BUTTON": "Delete now"
+        "MESSAGE": "Esta ação é permanente e irreversível.",
+        "BUTTON": "Apagar agora"
       }
     },
     "DETAILS": {
@@ -471,7 +471,7 @@
       "DELETE_CONTACT": "Excluir contacto",
       "DELETE_DIALOG": {
         "TITLE": "Confirmar exclusão",
-        "DESCRIPTION": "Are you sure you want to delete this contact?",
+        "DESCRIPTION": "Tem a certeza de que quer apagar este contacto?",
         "CONFIRM": "Sim, excluir",
         "API": {
           "SUCCESS_MESSAGE": "Contacto excluído com sucesso",
@@ -548,20 +548,20 @@
         "PLACEHOLDER": "Adicionar nota",
         "WROTE": "escreveu",
         "YOU": "Você",
-        "SAVE": "Save note",
+        "SAVE": "Salvar nota",
         "EXPAND": "Expandir",
-        "COLLAPSE": "Collapse",
-        "NO_NOTES": "No notes, you can add notes from the contact details page.",
-        "EMPTY_STATE": "There are no notes associated to this contact. You can add a note by typing in the box above."
+        "COLLAPSE": "Recolher",
+        "NO_NOTES": "Sem notas, pode adicionar notas na página de detalhes do contacto.",
+        "EMPTY_STATE": "Não existem notas associadas a este contacto. Pode adicionar uma nota escrevendo na caixa acima."
       }
     },
     "EMPTY_STATE": {
-      "TITLE": "No contacts found in this account",
-      "SUBTITLE": "Start adding new contacts by clicking on the button below",
-      "BUTTON_LABEL": "Add contact",
+      "TITLE": "Nenhum contacto encontrado nesta conta",
+      "SUBTITLE": "Para adicionar novos contatos, clique no botão abaixo",
+      "BUTTON_LABEL": "Adicionar contacto",
       "SEARCH_EMPTY_STATE_TITLE": "Nenhum contacto corresponde à sua pesquisa 🔍",
       "LIST_EMPTY_STATE_TITLE": "No contacts available in this view 📋",
-      "ACTIVE_EMPTY_STATE_TITLE": "No contacts are active at the moment 🌙"
+      "ACTIVE_EMPTY_STATE_TITLE": "Neste momento não há contactos ativos 🌙"
     }
   },
   "COMPOSE_NEW_CONVERSATION": {
diff --git a/app/javascript/dashboard/i18n/locale/pt/conversation.json b/app/javascript/dashboard/i18n/locale/pt/conversation.json
index d2eab7850..9ece5b576 100644
--- a/app/javascript/dashboard/i18n/locale/pt/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/pt/conversation.json
@@ -32,12 +32,12 @@
     "LOADING_CONVERSATIONS": "A carregar conversas",
     "CANNOT_REPLY": "Não pode responder porque",
     "24_HOURS_WINDOW": "Mensagens bloqueadas durante 24 horas",
-    "API_HOURS_WINDOW": "You can only reply to this conversation within {hours} hours",
+    "API_HOURS_WINDOW": "Só pode responder a esta conversa dentro de {hours} horas",
     "NOT_ASSIGNED_TO_YOU": "Esta conversa não está atribuída a si. Gostaria de atribuir esta conversa a si mesmo?",
     "ASSIGN_TO_ME": "Atribuir a mim",
     "TWILIO_WHATSAPP_CAN_REPLY": "Só pode responder utilizando uma mensagem modelo, porque",
     "TWILIO_WHATSAPP_24_HOURS_WINDOW": "Mensagens bloqueadas durante 24 horas",
-    "OLD_INSTAGRAM_INBOX_REPLY_BANNER": "This Instagram account was migrated to the new Instagram channel inbox. All new messages will show up there. You won’t be able to send messages from this conversation anymore.",
+    "OLD_INSTAGRAM_INBOX_REPLY_BANNER": "Esta conta do Instagram foi migrada para a nova caixa de entrada do canal Instagram. Todas as novas mensagens aparecerão lá. Já não poderá enviar mensagens a partir desta conversa.",
     "REPLYING_TO": "Está a responder a:",
     "REMOVE_SELECTION": "Remover seleção",
     "DOWNLOAD": "Descarregar",
@@ -70,7 +70,7 @@
       "RESOLVE_ACTION": "Resolver",
       "REOPEN_ACTION": "Reabrir",
       "OPEN_ACTION": "Abertas",
-      "MORE_ACTIONS": "More actions",
+      "MORE_ACTIONS": "Mais ações",
       "OPEN": "Mais",
       "CLOSE": "Fechar",
       "DETAILS": "Detalhes",
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Próxima semana"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agentes",
+      "TEAMS": "Equipas"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Suspender até",
       "APPLY": "Adiar",
@@ -119,8 +123,8 @@
       }
     },
     "DELETE_CONVERSATION": {
-      "TITLE": "Delete conversation #{conversationId}",
-      "DESCRIPTION": "Are you sure you want to delete this conversation?",
+      "TITLE": "Apagar conversa #{conversationId}",
+      "DESCRIPTION": "Tem a certeza de que quer apagar esta conversa?",
       "CONFIRM": "Excluir"
     },
     "CARD_CONTEXT_MENU": {
@@ -139,7 +143,7 @@
       "ASSIGN_LABEL": "Atribuir etiqueta",
       "AGENTS_LOADING": "A carregar agentes...",
       "ASSIGN_TEAM": "Atribuir equipa",
-      "DELETE": "Delete conversation",
+      "DELETE": "Apagar conversa",
       "API": {
         "AGENT_ASSIGNMENT": {
           "SUCCESFUL": "Conversa com ID {conversationId} atribuída a \"{agentName}\"",
@@ -214,8 +218,8 @@
     "ASSIGN_LABEL_SUCCESFUL": "Etiqueta atribuída com sucesso",
     "ASSIGN_LABEL_FAILED": "Falha na atribuição de etiqueta",
     "CHANGE_TEAM": "Equipa da conversa alterada",
-    "SUCCESS_DELETE_CONVERSATION": "Conversation deleted successfully",
-    "FAIL_DELETE_CONVERSATION": "Couldn't delete conversation! Try again",
+    "SUCCESS_DELETE_CONVERSATION": "Conversa apagada",
+    "FAIL_DELETE_CONVERSATION": "Não foi possível apagar a conversa! Tente novamente",
     "FILE_SIZE_LIMIT": "O ficheiro excede o tamanho limite para anexos de {MAXIMUM_SUPPORTED_FILE_UPLOAD_SIZE} MB",
     "MESSAGE_ERROR": "Não foi possível enviar esta mensagem, por favor, tente novamente mais tarde",
     "SENT_BY": "Enviado por:",
@@ -304,11 +308,11 @@
       "CONVERSATION_ACTIONS": "Ações de conversa",
       "CONVERSATION_LABELS": "Etiquetas da conversa",
       "CONVERSATION_INFO": "Informação da conversa",
-      "CONTACT_NOTES": "Contact Notes",
+      "CONTACT_NOTES": "Notas do contacto",
       "CONTACT_ATTRIBUTES": "Atributos do contacto",
       "PREVIOUS_CONVERSATION": "Conversas anteriores",
       "MACROS": "Macros",
-      "LINEAR_ISSUES": "Linked Linear Issues",
+      "LINEAR_ISSUES": "Casos Linear Associados",
       "SHOPIFY_ORDERS": "Shopify Orders"
     },
     "SHOPIFY": {
diff --git a/app/javascript/dashboard/i18n/locale/pt/generalSettings.json b/app/javascript/dashboard/i18n/locale/pt/generalSettings.json
index 25eaf917f..7e5c3f105 100644
--- a/app/javascript/dashboard/i18n/locale/pt/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/pt/generalSettings.json
@@ -1,10 +1,10 @@
 {
   "GENERAL_SETTINGS": {
     "LIMIT_MESSAGES": {
-      "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
-      "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
-      "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
+      "CONVERSATION": "Excedeu o limite de conversas. O plano Hacker permite apenas 500 conversas.",
+      "INBOXES": "Excedeu o limite de caixas de entrada. O plano Hacker só suporta chat ao vivo no site. Caixas de entrada adicionais como email, WhatsApp, etc. requerem um plano pago.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
+      "NON_ADMIN": "Por favor, contacte o seu administrador para atualizar o plano e continuar a usar todas as funcionalidades."
     },
     "TITLE": "Configurações da conta",
     "SUBMIT": "Atualizar configurações",
@@ -15,23 +15,23 @@
       "SUCCESS": "Configurações de conta atualizadas com sucesso"
     },
     "ACCOUNT_DELETE_SECTION": {
-      "TITLE": "Delete your Account",
-      "NOTE": "Once you delete your account, all your data will be deleted.",
-      "BUTTON_TEXT": "Delete Your Account",
+      "TITLE": "Apagar a sua Conta",
+      "NOTE": "Após apagar a sua conta, todos os seus dados serão apagados.",
+      "BUTTON_TEXT": "Apagar a Sua Conta",
       "CONFIRM": {
-        "TITLE": "Delete Account",
-        "MESSAGE": "Deleting your Account is irreversible. Enter your account name below to confirm you want to permanently delete it.",
+        "TITLE": "Apagar Conta",
+        "MESSAGE": "Apagar a sua conta é irreversível. Introduza o nome da sua conta abaixo para confirmar que pretende apagá-la permanentemente.",
         "BUTTON_TEXT": "Excluir",
         "DISMISS": "Cancelar",
-        "PLACE_HOLDER": "Por favor, digite {accountName} para confirmar"
+        "PLACE_HOLDER": "Por favor, escreva {accountName} para confirmar"
       },
-      "SUCCESS": "Account marked for deletion",
-      "FAILURE": "Could not delete account, try again!",
+      "SUCCESS": "Conta selecionada para apagar",
+      "FAILURE": "Não foi possível apagar a conta, tente novamente!",
       "SCHEDULED_DELETION": {
-        "TITLE": "Account Scheduled for Deletion",
-        "MESSAGE_MANUAL": "This account is scheduled for deletion on {deletionDate}. This was requested by an administrator. You can cancel the deletion before this date.",
-        "MESSAGE_INACTIVITY": "This account is scheduled for deletion on {deletionDate} due to account inactivity. You can cancel the deletion before this date.",
-        "CLEAR_BUTTON": "Cancel Scheduled Deletion"
+        "TITLE": "Eliminação da conta agendada",
+        "MESSAGE_MANUAL": "Eliminação da conta agendada para {deletionDate}. Isto foi solicitado por um administrador. Pode cancelar a eliminação antes desta data.",
+        "MESSAGE_INACTIVITY": "Eliminação da conta está agendada para {deletionDate} devido à sua inatividade. Pode cancelar a eliminação antes desta data.",
+        "CLEAR_BUTTON": "Cancelar agendamento da eliminação"
       }
     },
     "FORM": {
@@ -45,32 +45,32 @@
         "NOTE": "Este ID é necessário para integrações via API"
       },
       "AUTO_RESOLVE": {
-        "TITLE": "Auto-resolve conversations",
-        "NOTE": "This configuration would allow you to automatically resolve the conversation after a certain period of inactivity.",
+        "TITLE": "Auto-resolver conversas",
+        "NOTE": "Esta configuração permite-lhe resolver automaticamente a conversa após um determinado período de inatividade.",
         "DURATION": {
-          "LABEL": "Inactivity duration",
-          "HELP": "Time period of inactivity after which conversation is auto-resolved",
+          "LABEL": "Duração da inatividade",
+          "HELP": "Período de inatividade após o qual a conversa é automaticamente resolvida",
           "PLACEHOLDER": "30",
-          "ERROR": "Auto resolve duration should be between 10 minutes and 999 days",
+          "ERROR": "A duração de auto-resolução deve ser entre 10 minutos e 999 dias",
           "API": {
-            "SUCCESS": "Auto resolve settings updated successfully",
-            "ERROR": "Failed to update auto resolve settings"
+            "SUCCESS": "Definições de auto-resolução atualizadas",
+            "ERROR": "Falha ao atualizar as definições de auto-resolução"
           }
         },
         "MESSAGE": {
-          "LABEL": "Custom auto-resolution message",
-          "PLACEHOLDER": "Conversation was marked resolved by system due to 15 days of inactivity",
-          "HELP": "Message sent to the customer after conversation is auto-resolved"
+          "LABEL": "Mensagem personalizada de auto-resolução",
+          "PLACEHOLDER": "A conversa foi marcada como resolvida pelo sistema devido a 15 dias de inatividade",
+          "HELP": "Mensagem enviada ao cliente após a conversa ser automaticamente resolvida"
         },
         "PREFERENCES": "Preferências",
         "LABEL": {
-          "LABEL": "Add label after auto-resolution",
-          "PLACEHOLDER": "Select a label"
+          "LABEL": "Adicionar etiqueta após auto-resolução",
+          "PLACEHOLDER": "Selecionar uma etiqueta"
         },
         "IGNORE_WAITING": {
-          "LABEL": "Skip conversations waiting for agent’s reply"
+          "LABEL": "Ignorar conversas à espera de resposta do agente"
         },
-        "UPDATE_BUTTON": "Save Changes"
+        "UPDATE_BUTTON": "Salvar alterações"
       },
       "NAME": {
         "LABEL": "Nome da conta",
@@ -93,30 +93,30 @@
         "ERROR": ""
       },
       "AUTO_RESOLVE_IGNORE_WAITING": {
-        "LABEL": "Exclude unattended conversations",
-        "HELP": "When enabled, the system will skip resolving conversations that are still waiting for an agent's reply."
+        "LABEL": "Excluir conversas não atendidas",
+        "HELP": "Quando ativado, o sistema irá ignorar a resolução de conversas que ainda estão à espera de resposta de um agente."
       },
       "AUDIO_TRANSCRIPTION": {
-        "TITLE": "Transcribe Audio Messages",
-        "NOTE": "Automatically transcribe audio messages in conversations. Generate a text transcript whenever an audio message is sent or received, and display it alongside the message.",
+        "TITLE": "Transcrever mensagens de áudio",
+        "NOTE": "Transcreva automaticamente mensagens de áudio nas conversas. Gere uma transcrição de texto sempre que uma mensagem de áudio for enviada ou recebida e apresente-a junto da mensagem.",
         "API": {
-          "SUCCESS": "Audio transcription setting updated successfully",
-          "ERROR": "Failed to update audio transcription setting"
+          "SUCCESS": "Definição de transcrição de áudio atualizada com sucesso",
+          "ERROR": "Falha ao atualizar a definição de transcrição de áudio"
         }
       },
       "AUTO_RESOLVE_DURATION": {
-        "LABEL": "Inactivity duration for resolution",
-        "HELP": "Duration after a conversation should auto resolve if there is no activity",
+        "LABEL": "Duração de inatividade para resolução",
+        "HELP": "Duração após a qual a conversa deve ser automaticamente resolvida se não houver atividade",
         "PLACEHOLDER": "30",
-        "ERROR": "Auto resolve duration should be between 10 minutes and 999 days",
+        "ERROR": "A duração de auto-resolução deve ser entre 10 minutos e 999 dias",
         "API": {
-          "SUCCESS": "Auto resolve settings updated successfully",
-          "ERROR": "Failed to update auto resolve settings"
+          "SUCCESS": "Definições de auto-resolução atualizadas",
+          "ERROR": "Falha ao atualizar as definições de auto-resolução"
         },
         "UPDATE_BUTTON": "Atualização",
-        "MESSAGE_LABEL": "Custom resolution message",
-        "MESSAGE_PLACEHOLDER": "Conversation was marked resolved by system due to 15 days of inactivity",
-        "MESSAGE_HELP": "This message is sent to the customer when a conversation is automatically resolved by the system due to inactivity."
+        "MESSAGE_LABEL": "Mensagem personalizada de resolução",
+        "MESSAGE_PLACEHOLDER": "A conversa foi marcada como resolvida pelo sistema devido a 15 dias de inatividade",
+        "MESSAGE_HELP": "Esta mensagem é enviada ao cliente quando uma conversa é automaticamente resolvida pelo sistema devido à inatividade."
       },
       "FEATURES": {
         "INBOUND_EMAIL_ENABLED": "A sua conta tem a opção de continuar as conversas por e-mail ativa.",
@@ -126,7 +126,7 @@
     "UPDATE_CHATWOOT": "Está disponível uma nova atualização {latestChatwootVersion} para o ChatWoot. Por favor, atualize a sua versão.",
     "LEARN_MORE": "Saber mais",
     "PAYMENT_PENDING": "O seu pagamento está pendente. Por favor, atualize as suas informações de pagamento para continuar a usar o Chatwoot",
-    "UPGRADE": "Upgrade to continue using Chatwoot",
+    "UPGRADE": "Atualize para continuar a usar o Chatwoot",
     "LIMITS_UPGRADE": "A sua conta excedeu os limites de utilização. Por favor, faça um upgrade ao seu plano para continuar a utilizar o Chatwoot",
     "OPEN_BILLING": "Abrir faturação"
   },
diff --git a/app/javascript/dashboard/i18n/locale/pt/helpCenter.json b/app/javascript/dashboard/i18n/locale/pt/helpCenter.json
index 9d7fecba9..774a064d8 100644
--- a/app/javascript/dashboard/i18n/locale/pt/helpCenter.json
+++ b/app/javascript/dashboard/i18n/locale/pt/helpCenter.json
@@ -697,7 +697,7 @@
         "LABEL": "Slug",
         "PLACEHOLDER": "user-guide",
         "ERROR": "Slug obrigatória",
-        "FORMAT_ERROR": "Please enter a valid slug, for eg: user-guide"
+        "FORMAT_ERROR": "Por favor, introduza um slug válido, por exemplo: guia-do-utilizador"
       }
     },
     "PORTAL_SETTINGS": {
diff --git a/app/javascript/dashboard/i18n/locale/pt/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/pt/inboxMgmt.json
index dd293d91e..ec4c5ec1d 100644
--- a/app/javascript/dashboard/i18n/locale/pt/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/pt/inboxMgmt.json
@@ -47,13 +47,13 @@
         "CREATE_INBOX": "Criar caixa de entrada"
       },
       "INSTAGRAM": {
-        "CONTINUE_WITH_INSTAGRAM": "Continue with Instagram",
-        "CONNECT_YOUR_INSTAGRAM_PROFILE": "Connect your Instagram Profile",
-        "HELP": "To add your Instagram profile as a channel, you need to authenticate your Instagram Profile by clicking on 'Continue with Instagram' ",
-        "ERROR_MESSAGE": "There was an error connecting to Instagram, please try again",
-        "ERROR_AUTH": "There was an error connecting to Instagram, please try again",
-        "NEW_INBOX_SUGGESTION": "This Instagram account was previously linked to a different inbox and has now been migrated here. All new messages will appear here. The old inbox will no longer be able to send or receive messages for this account.",
-        "DUPLICATE_INBOX_BANNER": "This Instagram account was migrated to the new Instagram channel inbox. You won’t be able to send/receive Instagram messages from this inbox anymore."
+        "CONTINUE_WITH_INSTAGRAM": "Continuar com o Instagram",
+        "CONNECT_YOUR_INSTAGRAM_PROFILE": "Ligue o seu perfil do Instagram",
+        "HELP": "Para adicionar o seu perfil do Instagram como canal, precisa autenticar o seu perfil clicando em 'Continuar com o Instagram' ",
+        "ERROR_MESSAGE": "Ocorreu um erro ao ligar ao Instagram, por favor tente novamente",
+        "ERROR_AUTH": "Ocorreu um erro ao ligar ao Instagram, por favor tente novamente",
+        "NEW_INBOX_SUGGESTION": "Esta conta do Instagram estava anteriormente ligada a uma caixa de entrada diferente e foi agora migrada para aqui. Todas as novas mensagens aparecerão aqui. A caixa de entrada antiga já não poderá enviar ou receber mensagens para esta conta.",
+        "DUPLICATE_INBOX_BANNER": "Esta conta do Instagram foi migrada para a nova caixa de entrada do canal Instagram. Já não poderá enviar/receber mensagens do Instagram a partir desta caixa de entrada."
       },
       "TWITTER": {
         "HELP": "Para adicionar o seu perfil do Twitter como um canal, precisa de autenticar o seu perfil do Twitter clicando em 'Entrar com o Twitter' ",
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Não foi possível gravar o canal do WhatsApp"
         }
       },
+      "VOICE": {
+        "TITLE": "Canal de Voz",
+        "DESC": "Integre o Twilio e comece a oferecer suporte aos seus clientes via chamadas telefónicas.",
+        "PHONE_NUMBER": {
+          "LABEL": "Número de telefone",
+          "PLACEHOLDER": "Escreva o seu número de telefone (por exemplo, +1234567890)",
+          "ERROR": "Por favor, forneça um número de telefone válido no formato +E.164 (por exemplo, +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "SID da conta",
+            "PLACEHOLDER": "Insira o SID da sua Conta Twilio",
+            "REQUIRED": "O SID da conta é obrigatório"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Token de autenticação",
+            "PLACEHOLDER": "Escreva o seu Token de Autenticação Twilio",
+            "REQUIRED": "O Token de Autenticação é obrigatório"
+          },
+          "API_KEY_SID": {
+            "LABEL": "Chave da API SID",
+            "PLACEHOLDER": "Insira a chave SID da API Twilio",
+            "REQUIRED": "A chave SID da API é obrigatória"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "Chave secreta da API",
+            "PLACEHOLDER": "Insira a chave secreta da API Twilio",
+            "REQUIRED": "A chave secreta da API é obrigatória"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Insira a sua Twilio TwiML App SID (começa por AP)",
+            "REQUIRED": "TwiML App SID é obrigatória"
+          }
+        },
+        "SUBMIT_BUTTON": "Criar canal de Voz",
+        "API": {
+          "ERROR_MESSAGE": "Não foi possível criar o canal de voz"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "Canal da API",
         "DESC": "Integrar com o canal API para dar apoio aos seus clientes.",
@@ -579,28 +619,28 @@
     },
     "CSAT": {
       "TITLE": "Ativar CSAT",
-      "SUBTITLE": "Automatically trigger CSAT surveys at the end of conversations to understand how customers feel about their support experience. Track satisfaction trends and identify areas for improvement over time.",
+      "SUBTITLE": "Acione automaticamente inquéritos CSAT no final das conversas para perceber como os clientes se sentem sobre o apoio recebido. Acompanhe tendências de satisfação e identifique áreas de melhoria ao longo do tempo.",
       "DISPLAY_TYPE": {
-        "LABEL": "Display type"
+        "LABEL": "Tipo de visualização"
       },
       "MESSAGE": {
         "LABEL": "Messagem",
-        "PLACEHOLDER": "Please enter a message to show users with the form"
+        "PLACEHOLDER": "Por favor, insira uma mensagem para mostrar aos utilizadores com o formulário"
       },
       "SURVEY_RULE": {
-        "LABEL": "Survey rule",
-        "DESCRIPTION_PREFIX": "Send the survey if the conversation",
-        "DESCRIPTION_SUFFIX": "any of the labels",
+        "LABEL": "Regra do inquérito",
+        "DESCRIPTION_PREFIX": "Enviar o inquérito se a conversa",
+        "DESCRIPTION_SUFFIX": "qualquer uma das etiquetas",
         "OPERATOR": {
           "CONTAINS": "contém",
           "DOES_NOT_CONTAINS": "não contém"
         },
-        "SELECT_PLACEHOLDER": "select labels"
+        "SELECT_PLACEHOLDER": "selecionar etiquetas"
       },
-      "NOTE": "Note: CSAT surveys are sent only once per conversation",
+      "NOTE": "Nota: Os inquéritos CSAT são enviados apenas uma vez por conversa",
       "API": {
-        "SUCCESS_MESSAGE": "CSAT settings updated successfully",
-        "ERROR_MESSAGE": "We couldn't update CSAT settings. Please try again later."
+        "SUCCESS_MESSAGE": "Definições de CSAT atualizadas com sucesso",
+        "ERROR_MESSAGE": "Não foi possível atualizar as definições de CSAT. Por favor, tente novamente mais tarde."
       }
     },
     "BUSINESS_HOURS": {
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "Canal da API",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voz"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/pt/integrations.json b/app/javascript/dashboard/i18n/locale/pt/integrations.json
index 60b69375f..37e22315b 100644
--- a/app/javascript/dashboard/i18n/locale/pt/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/pt/integrations.json
@@ -42,8 +42,8 @@
             "WEBWIDGET_TRIGGERED": "Widget de live-chat aberto pelo utilizador",
             "CONTACT_CREATED": "Contacto criado",
             "CONTACT_UPDATED": "Contacto atualizado",
-            "CONVERSATION_TYPING_ON": "Conversation Typing On",
-            "CONVERSATION_TYPING_OFF": "Conversation Typing Off"
+            "CONVERSATION_TYPING_ON": "Conversa: a escrever",
+            "CONVERSATION_TYPING_OFF": "Conversa: a escrever desligada"
           }
         },
         "END_POINT": {
@@ -318,7 +318,7 @@
         "SUCCESS": "Problema desvinculado com sucesso",
         "ERROR": "Houve um erro ao desvincular o problema, por favor, tente novamente"
       },
-      "NO_LINKED_ISSUES": "No linked issues found",
+      "NO_LINKED_ISSUES": "Sem casos associados",
       "DELETE": {
         "TITLE": "Are you sure you want to delete the integration?",
         "MESSAGE": "Are you sure you want to delete the integration?",
@@ -326,10 +326,18 @@
         "CANCEL": "Cancelar"
       },
       "CTA": {
-        "TITLE": "Connect to Linear",
-        "AGENT_DESCRIPTION": "Linear workspace is not connected. Request your administrator to connect a workspace to use this integration.",
-        "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
-        "BUTTON_TEXT": "Connect Linear workspace"
+        "TITLE": "Ligar ao Linear",
+        "AGENT_DESCRIPTION": "O espaço de trabalho linear não está ligado. Solicite ao administrador que ligue um espaço de trabalho para usar esta integração.",
+        "DESCRIPTION": "O workspace Linear não está ligado. Clique no botão abaixo para ligar o seu workspace para utilizar esta integração.",
+        "BUTTON_TEXT": "Ligar workspace Linear"
+      }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Tem a certeza que pretende apagar a integração Notion?",
+        "MESSAGE": "Apagar esta integração removerá o acesso ao seu workspace Notion e encerrará todas as funcionalidades relacionadas.",
+        "CONFIRM": "Sim, excluir",
+        "CANCEL": "Cancelar"
       }
     }
   },
@@ -339,36 +347,36 @@
     "COPILOT": {
       "TITLE": "Copilot",
       "TRY_THESE_PROMPTS": "Try these prompts",
-      "PANEL_TITLE": "Get started with Copilot",
-      "KICK_OFF_MESSAGE": "Need a quick summary, want to check past conversations, or draft a better reply? Copilot’s here to speed things up.",
+      "PANEL_TITLE": "Comece com o Copilot",
+      "KICK_OFF_MESSAGE": "Precisa de um resumo rápido, quer consultar conversas anteriores ou redigir uma resposta melhor? O Copilot está aqui para acelerar o processo.",
       "SEND_MESSAGE": "Enviar mensagem...",
-      "EMPTY_MESSAGE": "There was an error generating the response. Please try again.",
+      "EMPTY_MESSAGE": "Ocorreu um erro ao gerar a resposta. Por favor, tente novamente.",
       "LOADER": "Captain is thinking",
       "YOU": "Você",
       "USE": "Use this",
       "RESET": "Reset",
-      "SHOW_STEPS": "Show steps",
+      "SHOW_STEPS": "Mostrar passos",
       "SELECT_ASSISTANT": "Select Assistant",
       "PROMPTS": {
         "SUMMARIZE": {
-          "LABEL": "Summarize this conversation",
-          "CONTENT": "Summarize the key points discussed between the customer and the support agent, including the customer's concerns, questions, and the solutions or responses provided by the support agent"
+          "LABEL": "Resumir esta conversa",
+          "CONTENT": "Resuma os pontos-chave discutidos entre o cliente e o agente de suporte, incluindo as preocupações do cliente, as questões e as soluções ou respostas dadas pelo agente de suporte"
         },
         "SUGGEST": {
-          "LABEL": "Suggest an answer",
-          "CONTENT": "Analyze the customer's inquiry, and draft a response that effectively addresses their concerns or questions. Ensure the reply is clear, concise, and provides helpful information."
+          "LABEL": "Sugerir uma resposta",
+          "CONTENT": "Analise a questão do cliente e redija uma resposta que aborde eficazmente as suas preocupações ou perguntas. Certifique-se de que a resposta é clara, concisa e fornece informações úteis."
         },
         "RATE": {
-          "LABEL": "Rate this conversation",
-          "CONTENT": "Review the conversation to see how well it meets the customer's needs. Share a rating out of 5 based on tone, clarity, and effectiveness."
+          "LABEL": "Avalie esta conversa",
+          "CONTENT": "Reveja a conversa para ver o quanto foram satisfeitas as necessidades do cliente. Compartilhe uma classificação até 5 com base no tom, clareza e eficácia."
         },
         "HIGH_PRIORITY": {
-          "LABEL": "High priority conversations",
-          "CONTENT": "Give me a summary of all high priority open conversations. Include the conversation ID, customer name (if available), last message content, and assigned agent. Group by status if relevant."
+          "LABEL": "Conversas de alta prioridade",
+          "CONTENT": "Dê-me um resumo de todas as conversas abertas de alta prioridade. Inclua o ID da conversa, nome do cliente (se disponível), conteúdo da última mensagem e agente atribuído. Agrupe por estado, se relevante."
         },
         "LIST_CONTACTS": {
-          "LABEL": "List contacts",
-          "CONTENT": "Show me the list of top 10 contacts. Include name, email or phone number (if available), last seen time, tags (if any)."
+          "LABEL": "Listar contactos",
+          "CONTENT": "Mostre-me a lista dos 10 principais contactos. Inclua nome, email ou número de telefone (se disponível), última vez visto, etiquetas (se houver)."
         }
       }
     },
@@ -377,8 +385,8 @@
       "ASSISTANT": "Assistant",
       "MESSAGE_PLACEHOLDER": "Escreva a sua mensagem...",
       "HEADER": "Playground",
-      "DESCRIPTION": "Use this playground to send messages to your assistant and check if it responds accurately, quickly, and in the tone you expect.",
-      "CREDIT_NOTE": "Messages sent here will count toward your Captain credits."
+      "DESCRIPTION": "Use este playground para enviar mensagens para o seu assistente e verificar se ele responde com precisão, rápido e no tom esperado.",
+      "CREDIT_NOTE": "As mensagens aqui enviadas vão contar para os créditos do seu Captain."
     },
     "PAYWALL": {
       "TITLE": "Upgrade to use Captain AI",
@@ -402,7 +410,7 @@
     },
     "ASSISTANTS": {
       "HEADER": "Assistants",
-      "NO_ASSISTANTS_AVAILABLE": "There are no assistants available in your account.",
+      "NO_ASSISTANTS_AVAILABLE": "Não há agentes disponíveis na sua conta.",
       "ADD_NEW": "Create a new assistant",
       "DELETE": {
         "TITLE": "Are you sure to delete the assistant?",
@@ -420,46 +428,46 @@
       "FORM": {
         "UPDATE": "Atualização",
         "SECTIONS": {
-          "BASIC_INFO": "Basic Information",
-          "SYSTEM_MESSAGES": "System Messages",
-          "INSTRUCTIONS": "Instructions",
+          "BASIC_INFO": "Informação básica",
+          "SYSTEM_MESSAGES": "Mensagens do Sistema",
+          "INSTRUCTIONS": "Instruções",
           "FEATURES": "Características",
-          "TOOLS": "Tools "
+          "TOOLS": "Ferramentas "
         },
         "NAME": {
           "LABEL": "Nome:",
-          "PLACEHOLDER": "Enter assistant name",
-          "ERROR": "The name is required"
+          "PLACEHOLDER": "Escreva o nome do assistente",
+          "ERROR": "O nome é obrigatório"
         },
         "TEMPERATURE": {
-          "LABEL": "Response Temperature",
-          "DESCRIPTION": "Adjust how creative or restrictive the assistant's responses should be. Lower values produce more focused and deterministic responses, while higher values allow for more creative and varied outputs."
+          "LABEL": "Temperatura da Resposta",
+          "DESCRIPTION": "Ajuste o quão criativo ou restritivo as respostas do assistente devem ser. Valores mais baixos produzem respostas mais focadas e deterministas, enquanto valores mais altos permitem resultados mais criativos e variados."
         },
         "DESCRIPTION": {
           "LABEL": "Descrição",
-          "PLACEHOLDER": "Enter assistant description",
-          "ERROR": "The description is required"
+          "PLACEHOLDER": "Escreva a descrição do assistente",
+          "ERROR": "A descrição é obrigatória"
         },
         "PRODUCT_NAME": {
           "LABEL": "Product Name",
-          "PLACEHOLDER": "Enter product name",
-          "ERROR": "The product name is required"
+          "PLACEHOLDER": "Escreva o nome do produto",
+          "ERROR": "O nome do produto é obrigatório"
         },
         "WELCOME_MESSAGE": {
-          "LABEL": "Welcome Message",
-          "PLACEHOLDER": "Enter welcome message"
+          "LABEL": "Mensagem de Boas-vindas",
+          "PLACEHOLDER": "Escreva a mensagem de boas-vindas"
         },
         "HANDOFF_MESSAGE": {
-          "LABEL": "Handoff Message",
-          "PLACEHOLDER": "Enter handoff message"
+          "LABEL": "Mensagem de despedida",
+          "PLACEHOLDER": "Escreva a mensagem de despedida"
         },
         "RESOLUTION_MESSAGE": {
-          "LABEL": "Resolution Message",
-          "PLACEHOLDER": "Enter resolution message"
+          "LABEL": "Mensagem de resolução",
+          "PLACEHOLDER": "Escreva a mensagem de resolução"
         },
         "INSTRUCTIONS": {
-          "LABEL": "Instructions",
-          "PLACEHOLDER": "Enter instructions for the assistant"
+          "LABEL": "Instruções",
+          "PLACEHOLDER": "Escreva as instruções para o assistente"
         },
         "FEATURES": {
           "TITLE": "Características",
@@ -471,7 +479,7 @@
         "TITLE": "Update the assistant",
         "SUCCESS_MESSAGE": "The assistant has been successfully updated",
         "ERROR_MESSAGE": "There was an error updating the assistant, please try again.",
-        "NOT_FOUND": "Could not find the assistant. Please try again."
+        "NOT_FOUND": "Não foi possível encontrar o assistente. Por favor, tente novamente."
       },
       "OPTIONS": {
         "EDIT_ASSISTANT": "Edit Assistant",
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Selecionar todas ({count})",
+      "UNSELECT_ALL": "Desmarcar todas ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Excluir",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/pt/macros.json b/app/javascript/dashboard/i18n/locale/pt/macros.json
index ad427b303..b83d91887 100644
--- a/app/javascript/dashboard/i18n/locale/pt/macros.json
+++ b/app/javascript/dashboard/i18n/locale/pt/macros.json
@@ -85,20 +85,20 @@
       "ATLEAST_ONE_ACTION_REQUIRED": "Pelo menos uma ação é obrigatória"
     },
     "ACTIONS": {
-      "ASSIGN_TEAM": "Assign a Team",
-      "ASSIGN_AGENT": "Assign an Agent",
-      "ADD_LABEL": "Add a Label",
-      "REMOVE_LABEL": "Remove a Label",
-      "REMOVE_ASSIGNED_TEAM": "Remove Assigned Team",
-      "SEND_EMAIL_TRANSCRIPT": "Send an Email Transcript",
+      "ASSIGN_TEAM": "Atribuir equipa",
+      "ASSIGN_AGENT": "Atribuir um agente",
+      "ADD_LABEL": "Adicionar um rótulo",
+      "REMOVE_LABEL": "Remover um rótulo",
+      "REMOVE_ASSIGNED_TEAM": "Remover equipa atribuída",
+      "SEND_EMAIL_TRANSCRIPT": "Enviar uma transcrição por e-mail",
       "MUTE_CONVERSATION": "Silenciar Conversa",
       "SNOOZE_CONVERSATION": "Adiar conversa",
       "RESOLVE_CONVERSATION": "Resolver conversa",
       "SEND_ATTACHMENT": "Enviar anexo",
-      "SEND_MESSAGE": "Send a Message",
+      "SEND_MESSAGE": "Enviar uma Mensagem",
       "CHANGE_PRIORITY": "Alterar prioridade",
-      "ADD_PRIVATE_NOTE": "Add a Private Note",
-      "SEND_WEBHOOK_EVENT": "Send Webhook Event"
+      "ADD_PRIVATE_NOTE": "Adicionar uma Nota Privada",
+      "SEND_WEBHOOK_EVENT": "Enviar evento webhook"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/pt/report.json b/app/javascript/dashboard/i18n/locale/pt/report.json
index cdd25f66c..c520fb5ea 100644
--- a/app/javascript/dashboard/i18n/locale/pt/report.json
+++ b/app/javascript/dashboard/i18n/locale/pt/report.json
@@ -193,7 +193,7 @@
   },
   "LABEL_REPORTS": {
     "HEADER": "Visão geral de etiquetas",
-    "DESCRIPTION": "Track label performance with key metrics including conversations, response times, resolution times, and resolved cases. Click a label name for detailed insights.",
+    "DESCRIPTION": "Rastreie o desempenho com métricas-chave, incluindo conversas, tempos de resposta, tempos de resolução e casos resolvidos. Clique num nome de rótulo para informações detalhadas.",
     "LOADING_CHART": "A carregar dados...",
     "NO_ENOUGH_DATA": "Não recebemos pontos de dados suficientes para gerar o relatório. Por favor, tente novamente mais tarde.",
     "DOWNLOAD_LABEL_REPORTS": "Descarregar relatórios de etiquetas",
diff --git a/app/javascript/dashboard/i18n/locale/pt/settings.json b/app/javascript/dashboard/i18n/locale/pt/settings.json
index b428b5558..d25a530d4 100644
--- a/app/javascript/dashboard/i18n/locale/pt/settings.json
+++ b/app/javascript/dashboard/i18n/locale/pt/settings.json
@@ -78,10 +78,10 @@
         "NOTE": "Este token pode ser usado se você estiver construindo uma integração baseada em API",
         "COPY": "Copiar",
         "RESET": "Reset",
-        "CONFIRM_RESET": "Are you sure?",
-        "CONFIRM_HINT": "Click again to confirm",
-        "RESET_SUCCESS": "Access token regenerated successfully",
-        "RESET_ERROR": "Unable to regenerate access token. Please try again"
+        "CONFIRM_RESET": "Tem a certeza?",
+        "CONFIRM_HINT": "Clique novamente para confirmar",
+        "RESET_SUCCESS": "O token de acesso voltou a ser gerado",
+        "RESET_ERROR": "Não foi possível voltar a gerar o token de acesso, por favor tente novamente"
       },
       "AUDIO_NOTIFICATIONS_SECTION": {
         "TITLE": "Audio Alerts",
@@ -191,7 +191,7 @@
         },
         "SET_AVAILABILITY_SUCCESS": "Disponibilidade foi definida com sucesso",
         "SET_AVAILABILITY_ERROR": "Não foi possível definir a disponibilidade, por favor tente novamente",
-        "IMPERSONATING_ERROR": "Cannot change availability while impersonating a user"
+        "IMPERSONATING_ERROR": "Não é possível alterar a disponibilidade enquanto está em modo de representação de um utilizador"
       },
       "EMAIL": {
         "LABEL": "Seu endereço de e-mail",
diff --git a/app/javascript/dashboard/i18n/locale/pt_BR/automation.json b/app/javascript/dashboard/i18n/locale/pt_BR/automation.json
index 2c0d51696..edf41d5ff 100644
--- a/app/javascript/dashboard/i18n/locale/pt_BR/automation.json
+++ b/app/javascript/dashboard/i18n/locale/pt_BR/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Enviar Anexo",
       "SEND_MESSAGE": "Enviar Mensagem",
       "CHANGE_PRIORITY": "Alterar Prioridade",
-      "ADD_SLA": "Adicionar SLA"
+      "ADD_SLA": "Adicionar SLA",
+      "OPEN_CONVERSATION": "Abrir conversa"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Tipo da Mensagem",
diff --git a/app/javascript/dashboard/i18n/locale/pt_BR/components.json b/app/javascript/dashboard/i18n/locale/pt_BR/components.json
index e877c4f24..999171733 100644
--- a/app/javascript/dashboard/i18n/locale/pt_BR/components.json
+++ b/app/javascript/dashboard/i18n/locale/pt_BR/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Horas",
     "DAYS": "Dias",
     "PLACEHOLDER": "Insira a duração"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/pt_BR/conversation.json b/app/javascript/dashboard/i18n/locale/pt_BR/conversation.json
index c426a4cac..0258e0031 100644
--- a/app/javascript/dashboard/i18n/locale/pt_BR/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/pt_BR/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Próxima semana"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agentes",
+      "TEAMS": "Times"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Adiar até",
       "APPLY": "Adiar",
@@ -308,7 +312,7 @@
       "CONTACT_ATTRIBUTES": "Atributos do contato",
       "PREVIOUS_CONVERSATION": "Conversas anteriores",
       "MACROS": "Macros",
-      "LINEAR_ISSUES": "Linked Linear Issues",
+      "LINEAR_ISSUES": "Problemas do Linear vinculados",
       "SHOPIFY_ORDERS": "Shopify Orders"
     },
     "SHOPIFY": {
diff --git a/app/javascript/dashboard/i18n/locale/pt_BR/generalSettings.json b/app/javascript/dashboard/i18n/locale/pt_BR/generalSettings.json
index 6ea40a2ec..77b9cfb8e 100644
--- a/app/javascript/dashboard/i18n/locale/pt_BR/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/pt_BR/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "Você excedeu o limite de conversas. O plano Hacker permite apenas 500 conversas.",
       "INBOXES": "Você excedeu o limite da caixa de entrada. O plano Hacker só suporta chat ao vivo do site. Caixas adicionais como e-mail, WhatsApp etc. requerem um plano pago.",
-      "AGENTS": "Você excedeu o limite de agentes. O plano Hacker permite apenas 2 agentes.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Entre em contato com o administrador para atualizar o plano e continuar usando todos os recursos."
     },
     "TITLE": "Conta",
diff --git a/app/javascript/dashboard/i18n/locale/pt_BR/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/pt_BR/inboxMgmt.json
index cc728f880..d4337bee1 100644
--- a/app/javascript/dashboard/i18n/locale/pt_BR/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/pt_BR/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Não foi possível salvar o canal do WhatsApp"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Número de Telefone",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "SID da Conta",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Token de autenticação",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "Chave da API SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "Segredo da Chave API",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "Canal da API",
         "DESC": "Integre com canal API e comece a ajudar seus clientes.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "Canal da API",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/pt_BR/integrations.json b/app/javascript/dashboard/i18n/locale/pt_BR/integrations.json
index c0fbf9888..a87545975 100644
--- a/app/javascript/dashboard/i18n/locale/pt_BR/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/pt_BR/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "O espaço de trabalho do Linear não está conectado. Clique no botão abaixo para conectar seu espaço de trabalho para usar essa integração.",
         "BUTTON_TEXT": "Conectar espaço de trabalho do Linear"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Sim, excluir",
+        "CANCEL": "Cancelar"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversação #{id}"
       },
       "SELECTED": "{count} selecionado",
+      "SELECT_ALL": "Selecionar todos ({count})",
+      "UNSELECT_ALL": "Desmarcar todos ({count})",
       "BULK_APPROVE_BUTTON": "Aprovar",
       "BULK_DELETE_BUTTON": "Excluir",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/pt_BR/report.json b/app/javascript/dashboard/i18n/locale/pt_BR/report.json
index 47f875068..9b4d8de90 100644
--- a/app/javascript/dashboard/i18n/locale/pt_BR/report.json
+++ b/app/javascript/dashboard/i18n/locale/pt_BR/report.json
@@ -193,7 +193,7 @@
   },
   "LABEL_REPORTS": {
     "HEADER": "Visão Geral das Etiquetas",
-    "DESCRIPTION": "Track label performance with key metrics including conversations, response times, resolution times, and resolved cases. Click a label name for detailed insights.",
+    "DESCRIPTION": "Acompanhe o desempenho da sua etiqueta com métricas-chave incluindo conversas, tempo de resposta, tempos de resolução e casos resolvidos. Clique no nome da etiqueta para obter detalhes.",
     "LOADING_CHART": "Carregando dados do gráfico...",
     "NO_ENOUGH_DATA": "Não existem dados suficientes para gerar o relatório. Tente novamente mais tarde.",
     "DOWNLOAD_LABEL_REPORTS": "Baixar relatórios de etiquetas",
diff --git a/app/javascript/dashboard/i18n/locale/ro/automation.json b/app/javascript/dashboard/i18n/locale/ro/automation.json
index fee029fc5..14d212def 100644
--- a/app/javascript/dashboard/i18n/locale/ro/automation.json
+++ b/app/javascript/dashboard/i18n/locale/ro/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Modificarea priorității",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Deschiderea conversației"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/ro/components.json b/app/javascript/dashboard/i18n/locale/ro/components.json
index 5be9ed8ab..31b039abf 100644
--- a/app/javascript/dashboard/i18n/locale/ro/components.json
+++ b/app/javascript/dashboard/i18n/locale/ro/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ro/conversation.json b/app/javascript/dashboard/i18n/locale/ro/conversation.json
index 4cc8d43c9..8925d513d 100644
--- a/app/javascript/dashboard/i18n/locale/ro/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/ro/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Săptămâna viitoare"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agenți",
+      "TEAMS": "Echipe"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Amânare până la",
       "APPLY": "Amânați",
diff --git a/app/javascript/dashboard/i18n/locale/ro/generalSettings.json b/app/javascript/dashboard/i18n/locale/ro/generalSettings.json
index 01d4d0292..a0dbf8706 100644
--- a/app/javascript/dashboard/i18n/locale/ro/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/ro/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Setări cont",
diff --git a/app/javascript/dashboard/i18n/locale/ro/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/ro/inboxMgmt.json
index 72e5469f7..a39360dee 100644
--- a/app/javascript/dashboard/i18n/locale/ro/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/ro/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Nu am reușit să salvăm canalul WhatsApp"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Număr de telefon",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Cont SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Token de autentificare",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "Canal API",
         "DESC": "Integrați-vă cu canalul API și începeți să vă sprijiniți clienții.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "Canal API",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ro/integrations.json b/app/javascript/dashboard/i18n/locale/ro/integrations.json
index ac6dee5c7..e7d963b22 100644
--- a/app/javascript/dashboard/i18n/locale/ro/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/ro/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Renunță"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Şterge",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/ru/automation.json b/app/javascript/dashboard/i18n/locale/ru/automation.json
index 87a67ef2e..bc4174ba5 100644
--- a/app/javascript/dashboard/i18n/locale/ru/automation.json
+++ b/app/javascript/dashboard/i18n/locale/ru/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Изменить приоритет",
-      "ADD_SLA": "Добавить SLA"
+      "ADD_SLA": "Добавить SLA",
+      "OPEN_CONVERSATION": "Открыть беседу"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/ru/components.json b/app/javascript/dashboard/i18n/locale/ru/components.json
index 92890e3e0..1ef1dea27 100644
--- a/app/javascript/dashboard/i18n/locale/ru/components.json
+++ b/app/javascript/dashboard/i18n/locale/ru/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ru/conversation.json b/app/javascript/dashboard/i18n/locale/ru/conversation.json
index ffc9b90c9..214b9c0fc 100644
--- a/app/javascript/dashboard/i18n/locale/ru/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/ru/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "На следующей неделе"
       }
     },
+    "MENTION": {
+      "AGENTS": "Операторы",
+      "TEAMS": "Команды"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Отложить до",
       "APPLY": "Отложено",
diff --git a/app/javascript/dashboard/i18n/locale/ru/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/ru/inboxMgmt.json
index e63b6f407..04267a433 100644
--- a/app/javascript/dashboard/i18n/locale/ru/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/ru/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Не удалось сохранить канал WhatsApp"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Номер телефона",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "SID аккаунта",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Токен авторизации",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Ключ SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "Секретный ключ API",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "Источник API",
         "DESC": "Интегрируйте с API каналом и начните поддерживать ваших клиентов.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "Источник API",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ru/integrations.json b/app/javascript/dashboard/i18n/locale/ru/integrations.json
index cee7df308..5128a9557 100644
--- a/app/javascript/dashboard/i18n/locale/ru/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/ru/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Да, удалить",
+        "CANCEL": "Отменить"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Диалог #{id}"
       },
       "SELECTED": "Выбрано {count}",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Одобрить",
       "BULK_DELETE_BUTTON": "Удалить",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/sh/automation.json b/app/javascript/dashboard/i18n/locale/sh/automation.json
index 86ec0b58b..c5dd4a514 100644
--- a/app/javascript/dashboard/i18n/locale/sh/automation.json
+++ b/app/javascript/dashboard/i18n/locale/sh/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/sh/components.json b/app/javascript/dashboard/i18n/locale/sh/components.json
index e44c6e039..0a2542a84 100644
--- a/app/javascript/dashboard/i18n/locale/sh/components.json
+++ b/app/javascript/dashboard/i18n/locale/sh/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/sh/conversation.json b/app/javascript/dashboard/i18n/locale/sh/conversation.json
index c047f17ad..5b3b7f3f8 100644
--- a/app/javascript/dashboard/i18n/locale/sh/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/sh/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agents",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/sh/generalSettings.json b/app/javascript/dashboard/i18n/locale/sh/generalSettings.json
index c0c4d247d..9055574c5 100644
--- a/app/javascript/dashboard/i18n/locale/sh/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/sh/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/sh/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/sh/inboxMgmt.json
index b38e8ed86..4ea0a8af1 100644
--- a/app/javascript/dashboard/i18n/locale/sh/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/sh/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/sh/integrations.json b/app/javascript/dashboard/i18n/locale/sh/integrations.json
index 4eb1343cb..7ae07cfa2 100644
--- a/app/javascript/dashboard/i18n/locale/sh/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/sh/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Cancel"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Delete",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/sk/automation.json b/app/javascript/dashboard/i18n/locale/sk/automation.json
index ca4cd0dd2..3807bf174 100644
--- a/app/javascript/dashboard/i18n/locale/sk/automation.json
+++ b/app/javascript/dashboard/i18n/locale/sk/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/sk/components.json b/app/javascript/dashboard/i18n/locale/sk/components.json
index 8c705e06d..34f3f7839 100644
--- a/app/javascript/dashboard/i18n/locale/sk/components.json
+++ b/app/javascript/dashboard/i18n/locale/sk/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/sk/conversation.json b/app/javascript/dashboard/i18n/locale/sk/conversation.json
index bbda30a36..1a51e5e40 100644
--- a/app/javascript/dashboard/i18n/locale/sk/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/sk/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Ďalší ťýždeň"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agenti",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Odložiť do",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/sk/generalSettings.json b/app/javascript/dashboard/i18n/locale/sk/generalSettings.json
index 8e12e31f7..6259dfbac 100644
--- a/app/javascript/dashboard/i18n/locale/sk/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/sk/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Nastavenia účtu",
diff --git a/app/javascript/dashboard/i18n/locale/sk/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/sk/inboxMgmt.json
index dac2f9a93..7c034f4d6 100644
--- a/app/javascript/dashboard/i18n/locale/sk/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/sk/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Telefónne číslo",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "SID účtu",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Autentifikačný token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API kanál",
         "DESC": "Integrujte sa s kanálom API a začnite podporovať svojich zákazníkov.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API kanál",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/sk/integrations.json b/app/javascript/dashboard/i18n/locale/sk/integrations.json
index 5ff7aa6e3..d6a32b14f 100644
--- a/app/javascript/dashboard/i18n/locale/sk/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/sk/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Zrušiť"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Vymazať",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/sl/automation.json b/app/javascript/dashboard/i18n/locale/sl/automation.json
index 9fe0becab..9adfcbae2 100644
--- a/app/javascript/dashboard/i18n/locale/sl/automation.json
+++ b/app/javascript/dashboard/i18n/locale/sl/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Dodaj"
+      "ADD_SLA": "Dodaj",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/sl/components.json b/app/javascript/dashboard/i18n/locale/sl/components.json
index 52d6109e1..a9c96a78f 100644
--- a/app/javascript/dashboard/i18n/locale/sl/components.json
+++ b/app/javascript/dashboard/i18n/locale/sl/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/sl/conversation.json b/app/javascript/dashboard/i18n/locale/sl/conversation.json
index 0b9bad8dd..d87e19400 100644
--- a/app/javascript/dashboard/i18n/locale/sl/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/sl/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agents",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/sl/generalSettings.json b/app/javascript/dashboard/i18n/locale/sl/generalSettings.json
index c0c4d247d..9055574c5 100644
--- a/app/javascript/dashboard/i18n/locale/sl/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/sl/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/sl/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/sl/inboxMgmt.json
index b101293be..b6c46fab3 100644
--- a/app/javascript/dashboard/i18n/locale/sl/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/sl/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/sl/integrations.json b/app/javascript/dashboard/i18n/locale/sl/integrations.json
index 43627d32c..266929039 100644
--- a/app/javascript/dashboard/i18n/locale/sl/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/sl/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Da, izbriši",
+        "CANCEL": "Cancel"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Izbriši",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/sq/automation.json b/app/javascript/dashboard/i18n/locale/sq/automation.json
index b14c8b23b..c424e63f3 100644
--- a/app/javascript/dashboard/i18n/locale/sq/automation.json
+++ b/app/javascript/dashboard/i18n/locale/sq/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/sq/components.json b/app/javascript/dashboard/i18n/locale/sq/components.json
index e44c6e039..0a2542a84 100644
--- a/app/javascript/dashboard/i18n/locale/sq/components.json
+++ b/app/javascript/dashboard/i18n/locale/sq/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/sq/conversation.json b/app/javascript/dashboard/i18n/locale/sq/conversation.json
index c047f17ad..5b3b7f3f8 100644
--- a/app/javascript/dashboard/i18n/locale/sq/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/sq/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agents",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/sq/generalSettings.json b/app/javascript/dashboard/i18n/locale/sq/generalSettings.json
index c0c4d247d..9055574c5 100644
--- a/app/javascript/dashboard/i18n/locale/sq/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/sq/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/sq/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/sq/inboxMgmt.json
index a0ab1c84e..d92c9da3d 100644
--- a/app/javascript/dashboard/i18n/locale/sq/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/sq/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/sq/integrations.json b/app/javascript/dashboard/i18n/locale/sq/integrations.json
index 59e0f393d..f99d12d45 100644
--- a/app/javascript/dashboard/i18n/locale/sq/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/sq/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Cancel"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Delete",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/sr/automation.json b/app/javascript/dashboard/i18n/locale/sr/automation.json
index ee0272085..fe4fa9494 100644
--- a/app/javascript/dashboard/i18n/locale/sr/automation.json
+++ b/app/javascript/dashboard/i18n/locale/sr/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Otvoren razgovor"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/sr/components.json b/app/javascript/dashboard/i18n/locale/sr/components.json
index f78a78497..6e46cb927 100644
--- a/app/javascript/dashboard/i18n/locale/sr/components.json
+++ b/app/javascript/dashboard/i18n/locale/sr/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/sr/conversation.json b/app/javascript/dashboard/i18n/locale/sr/conversation.json
index 2543dbcb9..ea8cc2294 100644
--- a/app/javascript/dashboard/i18n/locale/sr/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/sr/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Sledeće nedelje"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agenti",
+      "TEAMS": "Timovi"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Odloži do",
       "APPLY": "Odloži",
diff --git a/app/javascript/dashboard/i18n/locale/sr/generalSettings.json b/app/javascript/dashboard/i18n/locale/sr/generalSettings.json
index 870e0cace..dedb5eed4 100644
--- a/app/javascript/dashboard/i18n/locale/sr/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/sr/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Podešavanja naloga",
diff --git a/app/javascript/dashboard/i18n/locale/sr/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/sr/inboxMgmt.json
index 9ede90e66..7b3775b19 100644
--- a/app/javascript/dashboard/i18n/locale/sr/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/sr/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Nisamo uspeli da sačuvamo WhatsApp kanal"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Broj telefona",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "SID naloga",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Token autorizacije",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API kanal",
         "DESC": "Integrišite sa API kanalom i započnite podršku vašim potrošačima.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API kanal",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/sr/integrations.json b/app/javascript/dashboard/i18n/locale/sr/integrations.json
index cb72cc150..07988f805 100644
--- a/app/javascript/dashboard/i18n/locale/sr/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/sr/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Otkaži"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Izbriši",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/sv/automation.json b/app/javascript/dashboard/i18n/locale/sv/automation.json
index 406cfd995..a0c4be432 100644
--- a/app/javascript/dashboard/i18n/locale/sv/automation.json
+++ b/app/javascript/dashboard/i18n/locale/sv/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/sv/components.json b/app/javascript/dashboard/i18n/locale/sv/components.json
index bd0548eed..5c2ef3d03 100644
--- a/app/javascript/dashboard/i18n/locale/sv/components.json
+++ b/app/javascript/dashboard/i18n/locale/sv/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/sv/conversation.json b/app/javascript/dashboard/i18n/locale/sv/conversation.json
index 234656f95..3b41ef698 100644
--- a/app/javascript/dashboard/i18n/locale/sv/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/sv/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Nästa vecka"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agenter",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooza tills",
       "APPLY": "Snooza",
diff --git a/app/javascript/dashboard/i18n/locale/sv/generalSettings.json b/app/javascript/dashboard/i18n/locale/sv/generalSettings.json
index 3258dfd7d..6cc100cac 100644
--- a/app/javascript/dashboard/i18n/locale/sv/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/sv/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Kontoinställningar",
diff --git a/app/javascript/dashboard/i18n/locale/sv/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/sv/inboxMgmt.json
index 7d3706af6..8ef453613 100644
--- a/app/javascript/dashboard/i18n/locale/sv/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/sv/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Vi kunde inte spara WhatsApp-kanalen"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Telefonnummer",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Kontots SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth-token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API-kanal",
         "DESC": "Integrera med API-kanalen och börja supporta dina kunder.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API-kanal",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/sv/integrations.json b/app/javascript/dashboard/i18n/locale/sv/integrations.json
index 11d651b45..57ec78359 100644
--- a/app/javascript/dashboard/i18n/locale/sv/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/sv/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Avbryt"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Radera",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/ta/automation.json b/app/javascript/dashboard/i18n/locale/ta/automation.json
index 82c2b4809..09ddaf827 100644
--- a/app/javascript/dashboard/i18n/locale/ta/automation.json
+++ b/app/javascript/dashboard/i18n/locale/ta/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/ta/components.json b/app/javascript/dashboard/i18n/locale/ta/components.json
index 4adf87ecf..975e9be60 100644
--- a/app/javascript/dashboard/i18n/locale/ta/components.json
+++ b/app/javascript/dashboard/i18n/locale/ta/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ta/conversation.json b/app/javascript/dashboard/i18n/locale/ta/conversation.json
index 1e2028e82..f9083b51e 100644
--- a/app/javascript/dashboard/i18n/locale/ta/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/ta/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "ஏஜென்ட்கள்",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/ta/generalSettings.json b/app/javascript/dashboard/i18n/locale/ta/generalSettings.json
index fd0c21773..7f638a536 100644
--- a/app/javascript/dashboard/i18n/locale/ta/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/ta/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "கணக்கு அமைப்புகள்",
diff --git a/app/javascript/dashboard/i18n/locale/ta/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/ta/inboxMgmt.json
index c9774a8c2..6369a6c6a 100644
--- a/app/javascript/dashboard/i18n/locale/ta/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/ta/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "கணக்கின் SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "அங்கீகார டோக்கன்",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ta/integrations.json b/app/javascript/dashboard/i18n/locale/ta/integrations.json
index cfad7d30f..fc80613a2 100644
--- a/app/javascript/dashboard/i18n/locale/ta/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/ta/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "ரத்துசெய்"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Delete",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/th/automation.json b/app/javascript/dashboard/i18n/locale/th/automation.json
index 6e11773e7..fc4976557 100644
--- a/app/javascript/dashboard/i18n/locale/th/automation.json
+++ b/app/javascript/dashboard/i18n/locale/th/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "เปิดดูการสนทนา"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/th/components.json b/app/javascript/dashboard/i18n/locale/th/components.json
index 93cf557c3..3dc7a528d 100644
--- a/app/javascript/dashboard/i18n/locale/th/components.json
+++ b/app/javascript/dashboard/i18n/locale/th/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/th/conversation.json b/app/javascript/dashboard/i18n/locale/th/conversation.json
index 8677f18d7..4f7fa94e9 100644
--- a/app/javascript/dashboard/i18n/locale/th/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/th/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "สัปดาห์หน้า"
       }
     },
+    "MENTION": {
+      "AGENTS": "พนักงาน",
+      "TEAMS": "ทีม"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "พักการสนทนาจนถึง",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/th/generalSettings.json b/app/javascript/dashboard/i18n/locale/th/generalSettings.json
index 55b4f9b1d..782bcd3cd 100644
--- a/app/javascript/dashboard/i18n/locale/th/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/th/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "ตั้งค่าบัญชี",
diff --git a/app/javascript/dashboard/i18n/locale/th/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/th/inboxMgmt.json
index ad80df533..3f03d29f8 100644
--- a/app/javascript/dashboard/i18n/locale/th/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/th/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "เราไม่สามารถบันทึกช่องทาง WhatsApp ได้"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "หมายเลขโทรศัพท์",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "ช่อง API",
         "DESC": "สร้างช่องด้วย API เเละเริ่มช่วยเหลือลูกค้าของคุณ",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "ช่อง API",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/th/integrations.json b/app/javascript/dashboard/i18n/locale/th/integrations.json
index 64697d7ea..c57f0d5b5 100644
--- a/app/javascript/dashboard/i18n/locale/th/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/th/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "ยกเลิก"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "ลบ",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/tl/automation.json b/app/javascript/dashboard/i18n/locale/tl/automation.json
index 86ec0b58b..c5dd4a514 100644
--- a/app/javascript/dashboard/i18n/locale/tl/automation.json
+++ b/app/javascript/dashboard/i18n/locale/tl/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/tl/components.json b/app/javascript/dashboard/i18n/locale/tl/components.json
index e44c6e039..0a2542a84 100644
--- a/app/javascript/dashboard/i18n/locale/tl/components.json
+++ b/app/javascript/dashboard/i18n/locale/tl/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/tl/conversation.json b/app/javascript/dashboard/i18n/locale/tl/conversation.json
index c047f17ad..5b3b7f3f8 100644
--- a/app/javascript/dashboard/i18n/locale/tl/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/tl/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agents",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/tl/generalSettings.json b/app/javascript/dashboard/i18n/locale/tl/generalSettings.json
index c0c4d247d..9055574c5 100644
--- a/app/javascript/dashboard/i18n/locale/tl/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/tl/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/tl/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/tl/inboxMgmt.json
index cc0fe4b33..be7a6f2f9 100644
--- a/app/javascript/dashboard/i18n/locale/tl/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/tl/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/tl/integrations.json b/app/javascript/dashboard/i18n/locale/tl/integrations.json
index 43de9b65d..ed5ef8b72 100644
--- a/app/javascript/dashboard/i18n/locale/tl/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/tl/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Cancel"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Delete",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/tr/automation.json b/app/javascript/dashboard/i18n/locale/tr/automation.json
index eda09b867..4be5c6a5e 100644
--- a/app/javascript/dashboard/i18n/locale/tr/automation.json
+++ b/app/javascript/dashboard/i18n/locale/tr/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Ek Gönder",
       "SEND_MESSAGE": "Mesaj Gönder",
       "CHANGE_PRIORITY": "Önceliği Değiştir",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Görüşmeyi aç"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Mesaj Türü",
diff --git a/app/javascript/dashboard/i18n/locale/tr/components.json b/app/javascript/dashboard/i18n/locale/tr/components.json
index 69b9ad42f..e2b8e1a8b 100644
--- a/app/javascript/dashboard/i18n/locale/tr/components.json
+++ b/app/javascript/dashboard/i18n/locale/tr/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Saat",
     "DAYS": "Gün",
     "PLACEHOLDER": "Süre girin"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/tr/conversation.json b/app/javascript/dashboard/i18n/locale/tr/conversation.json
index e37ae0362..0239355d6 100644
--- a/app/javascript/dashboard/i18n/locale/tr/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/tr/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Sonraki hafta"
       }
     },
+    "MENTION": {
+      "AGENTS": "Kullanıcılar",
+      "TEAMS": "Ekipler"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Şu tarihe kadar ertele",
       "APPLY": "Sustur",
@@ -308,7 +312,7 @@
       "CONTACT_ATTRIBUTES": "İletişim Nitelikleri",
       "PREVIOUS_CONVERSATION": "Önceki Konuşmalar",
       "MACROS": "Kısayollar",
-      "LINEAR_ISSUES": "Linked Linear Issues",
+      "LINEAR_ISSUES": "Bağlantılı Linear Sorunları",
       "SHOPIFY_ORDERS": "Shopify Orders"
     },
     "SHOPIFY": {
diff --git a/app/javascript/dashboard/i18n/locale/tr/generalSettings.json b/app/javascript/dashboard/i18n/locale/tr/generalSettings.json
index 29f7f79bc..ee0c15945 100644
--- a/app/javascript/dashboard/i18n/locale/tr/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/tr/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "Sohbet sınırını aştınız. Hacker planı yalnızca 500 sohbete izin verir.",
       "INBOXES": "Gelen kutusu sınırını aştınız. Hacker planı yalnızca web sitesi canlı sohbetini destekler. E-posta, WhatsApp gibi ek gelen kutuları ücretli plan gerektirir.",
-      "AGENTS": "Temsilci sınırını aştınız. Hacker planı yalnızca 2 temsilciye izin verir.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Tüm özellikleri kullanmaya devam etmek için lütfen yöneticinizle iletişime geçin ve planı yükseltin."
     },
     "TITLE": "Hesap Ayarları",
diff --git a/app/javascript/dashboard/i18n/locale/tr/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/tr/inboxMgmt.json
index 7291523dc..4f384359c 100644
--- a/app/javascript/dashboard/i18n/locale/tr/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/tr/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "WhatsApp kanalını kaydedemedik"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Telefon Numarası",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Hesap SID'si",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Yetkilendirme Jetonu",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Anahtar SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Anahtar Sırrı",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Kanalı",
         "DESC": "API kanalı ile entegre edin ve müşterilerinizi desteklemeye başlayın.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Kanalı",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/tr/integrations.json b/app/javascript/dashboard/i18n/locale/tr/integrations.json
index 12c7fc99c..e8ed52fff 100644
--- a/app/javascript/dashboard/i18n/locale/tr/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/tr/integrations.json
@@ -318,7 +318,7 @@
         "SUCCESS": "Issue unlinked successfully",
         "ERROR": "There was an error unlinking the issue, please try again"
       },
-      "NO_LINKED_ISSUES": "No linked issues found",
+      "NO_LINKED_ISSUES": "Bağlanmış sorun bulunamadı",
       "DELETE": {
         "TITLE": "Are you sure you want to delete the integration?",
         "MESSAGE": "Are you sure you want to delete the integration?",
@@ -326,10 +326,18 @@
         "CANCEL": "İptal Et"
       },
       "CTA": {
-        "TITLE": "Connect to Linear",
-        "AGENT_DESCRIPTION": "Linear workspace is not connected. Request your administrator to connect a workspace to use this integration.",
-        "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
-        "BUTTON_TEXT": "Connect Linear workspace"
+        "TITLE": "Linear'a bağlan",
+        "AGENT_DESCRIPTION": "Doğrusal çalışma alanı bağlı değil. Bu entegrasyonu kullanmak için yöneticinizden bir çalışma alanı bağlamasını isteyin.",
+        "DESCRIPTION": "Linear çalışma alanı bağlı değil. Bu entegrasyonu kullanmak için çalışma alanınızı bağlamak üzere aşağıdaki düğmeye tıklayın.",
+        "BUTTON_TEXT": "Linear çalışma alanını bağlayın"
+      }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Evet, sil",
+        "CANCEL": "İptal Et"
       }
     }
   },
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Sil",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/tr/report.json b/app/javascript/dashboard/i18n/locale/tr/report.json
index 496a82156..d6a95682d 100644
--- a/app/javascript/dashboard/i18n/locale/tr/report.json
+++ b/app/javascript/dashboard/i18n/locale/tr/report.json
@@ -193,7 +193,7 @@
   },
   "LABEL_REPORTS": {
     "HEADER": "Etiketler Genel Bakış",
-    "DESCRIPTION": "Track label performance with key metrics including conversations, response times, resolution times, and resolved cases. Click a label name for detailed insights.",
+    "DESCRIPTION": "Konuşmalar, yanıt süreleri, çözüm süreleri ve çözülmüş vakalar gibi temel ölçümlerle etiket performansını takip edin. Ayrıntılı içgörüler için bir etiket adına tıklayın.",
     "LOADING_CHART": "Grafik verileri yükleniyor...",
     "NO_ENOUGH_DATA": "Rapor oluşturmak için yeterli veri yok, Lütfen daha sonra tekrar deneyin.",
     "DOWNLOAD_LABEL_REPORTS": "Etiket raporlarını indir",
diff --git a/app/javascript/dashboard/i18n/locale/uk/automation.json b/app/javascript/dashboard/i18n/locale/uk/automation.json
index 63a2e78ee..4d6ca8dc0 100644
--- a/app/javascript/dashboard/i18n/locale/uk/automation.json
+++ b/app/javascript/dashboard/i18n/locale/uk/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Змінити пріоритет",
-      "ADD_SLA": "Додати SLA"
+      "ADD_SLA": "Додати SLA",
+      "OPEN_CONVERSATION": "Відкрити розмову"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/uk/components.json b/app/javascript/dashboard/i18n/locale/uk/components.json
index 22395ecc6..6809a24fe 100644
--- a/app/javascript/dashboard/i18n/locale/uk/components.json
+++ b/app/javascript/dashboard/i18n/locale/uk/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/uk/conversation.json b/app/javascript/dashboard/i18n/locale/uk/conversation.json
index 192acf812..62065b5d1 100644
--- a/app/javascript/dashboard/i18n/locale/uk/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/uk/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Наступного тижня"
       }
     },
+    "MENTION": {
+      "AGENTS": "Агенти",
+      "TEAMS": "Команди"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Відкласти до",
       "APPLY": "Відкласти",
diff --git a/app/javascript/dashboard/i18n/locale/uk/generalSettings.json b/app/javascript/dashboard/i18n/locale/uk/generalSettings.json
index 7f2440d0a..bc34739af 100644
--- a/app/javascript/dashboard/i18n/locale/uk/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/uk/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Налаштування облікового запису",
diff --git a/app/javascript/dashboard/i18n/locale/uk/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/uk/inboxMgmt.json
index 5cb66640f..7c463b43a 100644
--- a/app/javascript/dashboard/i18n/locale/uk/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/uk/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Ми не змогли зберегти канал WhatsApp"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Номер телефону",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "SID облікового запису",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Токен автентифікації",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "Секретний ключ API",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API канал",
         "DESC": "Інтегруйте з API каналом і почніть підтримувати клієнтів.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API канал",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/uk/integrations.json b/app/javascript/dashboard/i18n/locale/uk/integrations.json
index 619a3fff0..2631d17fb 100644
--- a/app/javascript/dashboard/i18n/locale/uk/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/uk/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Так, видалити",
+        "CANCEL": "Скасувати"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Видалити",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/ur/automation.json b/app/javascript/dashboard/i18n/locale/ur/automation.json
index b2b5ce768..4b9e281ad 100644
--- a/app/javascript/dashboard/i18n/locale/ur/automation.json
+++ b/app/javascript/dashboard/i18n/locale/ur/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/ur/components.json b/app/javascript/dashboard/i18n/locale/ur/components.json
index 02df3a635..9491f168e 100644
--- a/app/javascript/dashboard/i18n/locale/ur/components.json
+++ b/app/javascript/dashboard/i18n/locale/ur/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ur/conversation.json b/app/javascript/dashboard/i18n/locale/ur/conversation.json
index 0078f4b5b..2c09626ad 100644
--- a/app/javascript/dashboard/i18n/locale/ur/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/ur/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "ایجنٹ",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/ur/generalSettings.json b/app/javascript/dashboard/i18n/locale/ur/generalSettings.json
index b41fc07a2..95190e330 100644
--- a/app/javascript/dashboard/i18n/locale/ur/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/ur/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/ur/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/ur/inboxMgmt.json
index 750eb5be6..d89f57c89 100644
--- a/app/javascript/dashboard/i18n/locale/ur/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/ur/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ur/integrations.json b/app/javascript/dashboard/i18n/locale/ur/integrations.json
index aa18160a1..cbd8d202b 100644
--- a/app/javascript/dashboard/i18n/locale/ur/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/ur/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "منسوخ کریں۔"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "حذف کریں۔",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/ur_IN/automation.json b/app/javascript/dashboard/i18n/locale/ur_IN/automation.json
index 86ec0b58b..c5dd4a514 100644
--- a/app/javascript/dashboard/i18n/locale/ur_IN/automation.json
+++ b/app/javascript/dashboard/i18n/locale/ur_IN/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Open conversation"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/ur_IN/components.json b/app/javascript/dashboard/i18n/locale/ur_IN/components.json
index e44c6e039..0a2542a84 100644
--- a/app/javascript/dashboard/i18n/locale/ur_IN/components.json
+++ b/app/javascript/dashboard/i18n/locale/ur_IN/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ur_IN/conversation.json b/app/javascript/dashboard/i18n/locale/ur_IN/conversation.json
index c047f17ad..5b3b7f3f8 100644
--- a/app/javascript/dashboard/i18n/locale/ur_IN/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/ur_IN/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Next week"
       }
     },
+    "MENTION": {
+      "AGENTS": "Agents",
+      "TEAMS": "Teams"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/ur_IN/generalSettings.json b/app/javascript/dashboard/i18n/locale/ur_IN/generalSettings.json
index c0c4d247d..9055574c5 100644
--- a/app/javascript/dashboard/i18n/locale/ur_IN/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/ur_IN/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Account settings",
diff --git a/app/javascript/dashboard/i18n/locale/ur_IN/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/ur_IN/inboxMgmt.json
index 037c8d764..c09c5a5eb 100644
--- a/app/javascript/dashboard/i18n/locale/ur_IN/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/ur_IN/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Phone Number",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Account SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Auth Token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API Channel",
         "DESC": "Integrate with API channel and start supporting your customers.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API Channel",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/ur_IN/integrations.json b/app/javascript/dashboard/i18n/locale/ur_IN/integrations.json
index 4eb1343cb..7ae07cfa2 100644
--- a/app/javascript/dashboard/i18n/locale/ur_IN/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/ur_IN/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Yes, delete",
+        "CANCEL": "Cancel"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Delete",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/vi/automation.json b/app/javascript/dashboard/i18n/locale/vi/automation.json
index 169473ab3..9de0b8eaf 100644
--- a/app/javascript/dashboard/i18n/locale/vi/automation.json
+++ b/app/javascript/dashboard/i18n/locale/vi/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "Mở cuộc trò chuyện"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/vi/components.json b/app/javascript/dashboard/i18n/locale/vi/components.json
index d7fdcc472..74e433202 100644
--- a/app/javascript/dashboard/i18n/locale/vi/components.json
+++ b/app/javascript/dashboard/i18n/locale/vi/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/vi/conversation.json b/app/javascript/dashboard/i18n/locale/vi/conversation.json
index 50b5edea3..94d80c8b8 100644
--- a/app/javascript/dashboard/i18n/locale/vi/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/vi/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "Tuần sau"
       }
     },
+    "MENTION": {
+      "AGENTS": "Nhà cung cấp",
+      "TEAMS": "Nhóm"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Tạm dừng đến khi",
       "APPLY": "Báo lại",
diff --git a/app/javascript/dashboard/i18n/locale/vi/generalSettings.json b/app/javascript/dashboard/i18n/locale/vi/generalSettings.json
index 39db9df91..a5e003478 100644
--- a/app/javascript/dashboard/i18n/locale/vi/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/vi/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "Cài đặt tài khoản",
diff --git a/app/javascript/dashboard/i18n/locale/vi/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/vi/inboxMgmt.json
index 706be5e28..e82b4a03d 100644
--- a/app/javascript/dashboard/i18n/locale/vi/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/vi/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "Chúng tôi không thể lưu kênh WhatsApp"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "Số điện thoại",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "Tài khoản SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "Token xác thực",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "Kênh API",
         "DESC": "Tích hợp với kênh API và bắt đầu hỗ trợ khách hàng của bạn.",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "Kênh API",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/vi/integrations.json b/app/javascript/dashboard/i18n/locale/vi/integrations.json
index 53a9d6997..5fa5d2b3d 100644
--- a/app/javascript/dashboard/i18n/locale/vi/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/vi/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "Có, xoá",
+        "CANCEL": "Huỷ"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "Xoá",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/zh_CN/automation.json b/app/javascript/dashboard/i18n/locale/zh_CN/automation.json
index 285a7a8bd..51741d23a 100644
--- a/app/javascript/dashboard/i18n/locale/zh_CN/automation.json
+++ b/app/javascript/dashboard/i18n/locale/zh_CN/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "发送附件",
       "SEND_MESSAGE": "发送消息",
       "CHANGE_PRIORITY": "更改优先级",
-      "ADD_SLA": "添加SLA"
+      "ADD_SLA": "添加SLA",
+      "OPEN_CONVERSATION": "打开对话"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "消息类型",
diff --git a/app/javascript/dashboard/i18n/locale/zh_CN/components.json b/app/javascript/dashboard/i18n/locale/zh_CN/components.json
index 3d5f736ec..dbd4630d6 100644
--- a/app/javascript/dashboard/i18n/locale/zh_CN/components.json
+++ b/app/javascript/dashboard/i18n/locale/zh_CN/components.json
@@ -49,5 +49,8 @@
     "HOURS": "小时",
     "DAYS": "天",
     "PLACEHOLDER": "输入耗时"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/zh_CN/conversation.json b/app/javascript/dashboard/i18n/locale/zh_CN/conversation.json
index 43c46fa3a..0cbf0ad36 100644
--- a/app/javascript/dashboard/i18n/locale/zh_CN/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/zh_CN/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "下周"
       }
     },
+    "MENTION": {
+      "AGENTS": "客服",
+      "TEAMS": "团队"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "推迟到",
       "APPLY": "推迟",
diff --git a/app/javascript/dashboard/i18n/locale/zh_CN/generalSettings.json b/app/javascript/dashboard/i18n/locale/zh_CN/generalSettings.json
index f4535fee6..effd00ee8 100644
--- a/app/javascript/dashboard/i18n/locale/zh_CN/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/zh_CN/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "您已经超过对话限制。黑客计划只允许500次对话。",
       "INBOXES": "您已超过收件箱限制。Hacker 计划只支持网站在线聊天。其他收件箱如电子邮件、WhatsApp 等需要付费计划。",
-      "AGENTS": "您已超过坐席限制。黑客计划只允许 2 个坐席。",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "请联系您的管理员升级计划并继续使用所有功能。"
     },
     "TITLE": "帐户设置",
diff --git a/app/javascript/dashboard/i18n/locale/zh_CN/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/zh_CN/inboxMgmt.json
index 128379392..6cabd0cf0 100644
--- a/app/javascript/dashboard/i18n/locale/zh_CN/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/zh_CN/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "我们无法保存 WhatsApp 通道"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "电话号码",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "账户 SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "身份验证令牌",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API 密钥 SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API 密钥密码",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API 频道",
         "DESC": "与API通道集成，开始为您的客户提供支持",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API 频道",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/zh_CN/integrations.json b/app/javascript/dashboard/i18n/locale/zh_CN/integrations.json
index 53911f104..0c90f63be 100644
--- a/app/javascript/dashboard/i18n/locale/zh_CN/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/zh_CN/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "是的，删除",
+        "CANCEL": "取消"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "对话 #{id}"
       },
       "SELECTED": "{count} 已选择",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "批准",
       "BULK_DELETE_BUTTON": "删除",
       "BULK_APPROVE": {
diff --git a/app/javascript/dashboard/i18n/locale/zh_TW/automation.json b/app/javascript/dashboard/i18n/locale/zh_TW/automation.json
index e9d22cb1a..4b96c3dbc 100644
--- a/app/javascript/dashboard/i18n/locale/zh_TW/automation.json
+++ b/app/javascript/dashboard/i18n/locale/zh_TW/automation.json
@@ -147,7 +147,8 @@
       "SEND_ATTACHMENT": "Send Attachment",
       "SEND_MESSAGE": "Send a Message",
       "CHANGE_PRIORITY": "Change Priority",
-      "ADD_SLA": "Add SLA"
+      "ADD_SLA": "Add SLA",
+      "OPEN_CONVERSATION": "開啟對話"
     },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
diff --git a/app/javascript/dashboard/i18n/locale/zh_TW/components.json b/app/javascript/dashboard/i18n/locale/zh_TW/components.json
index 9d4176c48..5c4737544 100644
--- a/app/javascript/dashboard/i18n/locale/zh_TW/components.json
+++ b/app/javascript/dashboard/i18n/locale/zh_TW/components.json
@@ -49,5 +49,8 @@
     "HOURS": "Hours",
     "DAYS": "Days",
     "PLACEHOLDER": "Enter duration"
+  },
+  "CHANNEL_SELECTOR": {
+    "COMING_SOON": "Coming Soon!"
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/zh_TW/conversation.json b/app/javascript/dashboard/i18n/locale/zh_TW/conversation.json
index 8e8082846..c233a2bf1 100644
--- a/app/javascript/dashboard/i18n/locale/zh_TW/conversation.json
+++ b/app/javascript/dashboard/i18n/locale/zh_TW/conversation.json
@@ -96,6 +96,10 @@
         "NEXT_WEEK": "下週"
       }
     },
+    "MENTION": {
+      "AGENTS": "客服",
+      "TEAMS": "團隊"
+    },
     "CUSTOM_SNOOZE": {
       "TITLE": "Snooze until",
       "APPLY": "Snooze",
diff --git a/app/javascript/dashboard/i18n/locale/zh_TW/generalSettings.json b/app/javascript/dashboard/i18n/locale/zh_TW/generalSettings.json
index b4f4d0d74..e13e6724a 100644
--- a/app/javascript/dashboard/i18n/locale/zh_TW/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/zh_TW/generalSettings.json
@@ -3,7 +3,7 @@
     "LIMIT_MESSAGES": {
       "CONVERSATION": "You have exceeded the conversation limit. Hacker plan allows only 500 conversations.",
       "INBOXES": "You have exceeded the inbox limit. Hacker plan only supports website live-chat. Additional inboxes like email, WhatsApp etc. require a paid plan.",
-      "AGENTS": "You have exceeded the agent limit. Hacker plan allows only 2 agents.",
+      "AGENTS": "You have exceeded the agent limit. Your plan only allows {allowedAgents} agents.",
       "NON_ADMIN": "Please contact your administrator to upgrade the plan and continue using all features."
     },
     "TITLE": "帳戶設定",
diff --git a/app/javascript/dashboard/i18n/locale/zh_TW/inboxMgmt.json b/app/javascript/dashboard/i18n/locale/zh_TW/inboxMgmt.json
index 0490d2aa8..d9ccab4e0 100644
--- a/app/javascript/dashboard/i18n/locale/zh_TW/inboxMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/zh_TW/inboxMgmt.json
@@ -268,6 +268,46 @@
           "ERROR_MESSAGE": "We were not able to save the WhatsApp channel"
         }
       },
+      "VOICE": {
+        "TITLE": "Voice Channel",
+        "DESC": "Integrate Twilio Voice and start supporting your customers via phone calls.",
+        "PHONE_NUMBER": {
+          "LABEL": "聯絡人電話",
+          "PLACEHOLDER": "Enter your phone number (e.g. +1234567890)",
+          "ERROR": "Please provide a valid phone number in E.164 format (e.g. +1234567890)"
+        },
+        "TWILIO": {
+          "ACCOUNT_SID": {
+            "LABEL": "帳戶 SID",
+            "PLACEHOLDER": "Enter your Twilio Account SID",
+            "REQUIRED": "Account SID is required"
+          },
+          "AUTH_TOKEN": {
+            "LABEL": "身份驗證 token",
+            "PLACEHOLDER": "Enter your Twilio Auth Token",
+            "REQUIRED": "Auth Token is required"
+          },
+          "API_KEY_SID": {
+            "LABEL": "API Key SID",
+            "PLACEHOLDER": "Enter your Twilio API Key SID",
+            "REQUIRED": "API Key SID is required"
+          },
+          "API_KEY_SECRET": {
+            "LABEL": "API Key Secret",
+            "PLACEHOLDER": "Enter your Twilio API Key Secret",
+            "REQUIRED": "API Key Secret is required"
+          },
+          "TWIML_APP_SID": {
+            "LABEL": "TwiML App SID",
+            "PLACEHOLDER": "Enter your Twilio TwiML App SID (starts with AP)",
+            "REQUIRED": "TwiML App SID is required"
+          }
+        },
+        "SUBMIT_BUTTON": "Create Voice Channel",
+        "API": {
+          "ERROR_MESSAGE": "We were not able to create the voice channel"
+        }
+      },
       "API_CHANNEL": {
         "TITLE": "API 頻道",
         "DESC": "與 API 頻道互動，開始服務客戶。",
@@ -789,7 +829,8 @@
       "TELEGRAM": "Telegram",
       "LINE": "Line",
       "API": "API 頻道",
-      "INSTAGRAM": "Instagram"
+      "INSTAGRAM": "Instagram",
+      "VOICE": "Voice"
     }
   }
 }
diff --git a/app/javascript/dashboard/i18n/locale/zh_TW/integrations.json b/app/javascript/dashboard/i18n/locale/zh_TW/integrations.json
index 3d6150301..e7100d0ac 100644
--- a/app/javascript/dashboard/i18n/locale/zh_TW/integrations.json
+++ b/app/javascript/dashboard/i18n/locale/zh_TW/integrations.json
@@ -331,6 +331,14 @@
         "DESCRIPTION": "Linear workspace is not connected. Click the button below to connect your workspace to use this integration.",
         "BUTTON_TEXT": "Connect Linear workspace"
       }
+    },
+    "NOTION": {
+      "DELETE": {
+        "TITLE": "Are you sure you want to delete the Notion integration?",
+        "MESSAGE": "Deleting this integration will remove access to your Notion workspace and stop all related functionality.",
+        "CONFIRM": "是的，刪除",
+        "CANCEL": "取消"
+      }
     }
   },
   "CAPTAIN": {
@@ -539,6 +547,8 @@
         "CONVERSATION": "Conversation #{id}"
       },
       "SELECTED": "{count} selected",
+      "SELECT_ALL": "Select all ({count})",
+      "UNSELECT_ALL": "Unselect all ({count})",
       "BULK_APPROVE_BUTTON": "Approve",
       "BULK_DELETE_BUTTON": "刪除",
       "BULK_APPROVE": {
diff --git a/config/locales/am.yml b/config/locales/am.yml
index bb6feec58..21d60833a 100644
--- a/config/locales/am.yml
+++ b/config/locales/am.yml
@@ -182,6 +182,8 @@ am:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ am:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ am:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/ar.yml b/config/locales/ar.yml
index d114c08cb..afb5800c7 100644
--- a/config/locales/ar.yml
+++ b/config/locales/ar.yml
@@ -182,6 +182,8 @@ ar:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} كتم صوت المحادثة'
       unmuted: '%{user_name} قام بإلغاء كتم المحادثة'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ ar:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'إنشاء مشكلات في Linear مباشرة من نافذة المحادثة الخاصة بك. بدلاً من ذلك، قم بربط مشكلات Linear القائمة من أجل عملية تتبع أكثر تبسيطاً وكفاءة.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ ar:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: الرسالة مطلوبة
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/az.yml b/config/locales/az.yml
index a77dd793e..44994090c 100644
--- a/config/locales/az.yml
+++ b/config/locales/az.yml
@@ -182,6 +182,8 @@ az:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ az:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ az:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/bg.yml b/config/locales/bg.yml
index b638f02e3..16e4fd4e8 100644
--- a/config/locales/bg.yml
+++ b/config/locales/bg.yml
@@ -182,6 +182,8 @@ bg:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ bg:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ bg:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/ca.yml b/config/locales/ca.yml
index 0c610c4c0..8b29afaa9 100644
--- a/config/locales/ca.yml
+++ b/config/locales/ca.yml
@@ -182,6 +182,8 @@ ca:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} ha silenciat la conversa'
       unmuted: '%{user_name} ha desactivat el silenci de la conversa'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ ca:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ ca:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: El missatge és obligatori
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/cs.yml b/config/locales/cs.yml
index d21ebfbef..c2880dd93 100644
--- a/config/locales/cs.yml
+++ b/config/locales/cs.yml
@@ -182,6 +182,8 @@ cs:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} ztlumil/a konverzaci'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ cs:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ cs:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/da.yml b/config/locales/da.yml
index 37478f846..1ff160433 100644
--- a/config/locales/da.yml
+++ b/config/locales/da.yml
@@ -182,6 +182,8 @@ da:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} har slukket for samtalen'
       unmuted: '%{user_name} har genaktiveret samtalen'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ da:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ da:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Beskeden er påkrævet
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/de.yml b/config/locales/de.yml
index 85fad2d29..34e04692c 100644
--- a/config/locales/de.yml
+++ b/config/locales/de.yml
@@ -182,6 +182,8 @@ de:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} hat das Gespräch stumm geschaltet'
       unmuted: '%{user_name} hat das Gespräch laut gestellt'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ de:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ de:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Nachricht ist erforderlich
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/el.yml b/config/locales/el.yml
index 635e0d5ff..c30f3b1d1 100644
--- a/config/locales/el.yml
+++ b/config/locales/el.yml
@@ -182,6 +182,8 @@ el:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: 'Ο χρήστης %{user_name} σίγασε την συνομιλία'
       unmuted: 'Ο χρήστης %{user_name} επανάφερε από την σίγαση την συνομιλία'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ el:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ el:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Το μήνυμα είναι απαραίτητο
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/es.yml b/config/locales/es.yml
index 308a11c4a..2007d7819 100644
--- a/config/locales/es.yml
+++ b/config/locales/es.yml
@@ -182,6 +182,8 @@ es:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} ha silenciado la conversación'
       unmuted: '%{user_name} ha anulado el silenciado de la conversación'
       auto_resolution_message: 'Resolviendo la conversación, ya que ha estado inactiva durante un tiempo. Por favor, inicia una nueva conversación si necesitas más ayuda.'
@@ -241,6 +243,10 @@ es:
       name: 'Lineal'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Crea problemas en Linear directamente desde tu ventana de conversación. Alternativamente, enlaza problemas existentes en Linear para un proceso de seguimiento de problemas más eficiente y ágil.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ es:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: El mensaje es obligatorio
     copilot_error: 'Conecte un asistente a esta bandeja de entrada para utilizar Copilot'
     copilot_limit: 'Te quedaste sin créditos de Copilot. Puedes comprar más créditos desde la sección de facturación.'
     copilot:
diff --git a/config/locales/fa.yml b/config/locales/fa.yml
index 0a5166ab4..b52cc98ad 100644
--- a/config/locales/fa.yml
+++ b/config/locales/fa.yml
@@ -182,6 +182,8 @@ fa:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} مکالمه را بی صدا کرد'
       unmuted: '%{user_name} مکالمه را از حالت بی صدا خراج کرد'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ fa:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ fa:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: پیام الزامی است
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/fi.yml b/config/locales/fi.yml
index 2f5fefe20..20e2df251 100644
--- a/config/locales/fi.yml
+++ b/config/locales/fi.yml
@@ -182,6 +182,8 @@ fi:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} mykisti keskustelun'
       unmuted: '%{user_name} poisti keskustelun mykistyksen'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ fi:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ fi:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/fr.yml b/config/locales/fr.yml
index a7925e6e8..3b113ccac 100644
--- a/config/locales/fr.yml
+++ b/config/locales/fr.yml
@@ -182,6 +182,8 @@ fr:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} a mis la conversation en sourdine'
       unmuted: '%{user_name} a rétabli le son de la conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ fr:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ fr:
       short_description: 'Synchronisez vos contacts et conversations avec LeadSquared CRM.'
       description: 'Synchronisez vos contacts et conversations avec LeadSquared CRM. Cette intégration crée automatiquement des prospects dans LeadSquared lorsque de nouveaux contacts sont ajoutés, et enregistre l''activité des conversations pour fournir à votre équipe de vente un contexte complet.'
   captain:
+    copilot_message_required: Le message est obligatoire
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/he.yml b/config/locales/he.yml
index 3d2585675..25aa326e6 100644
--- a/config/locales/he.yml
+++ b/config/locales/he.yml
@@ -182,6 +182,8 @@ he:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ he:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ he:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: הודעה שדה חובה
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/hi.yml b/config/locales/hi.yml
index 58899852e..be39b5ca7 100644
--- a/config/locales/hi.yml
+++ b/config/locales/hi.yml
@@ -182,6 +182,8 @@ hi:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ hi:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ hi:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/hr.yml b/config/locales/hr.yml
index a4016bd34..e50712930 100644
--- a/config/locales/hr.yml
+++ b/config/locales/hr.yml
@@ -182,6 +182,8 @@ hr:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ hr:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ hr:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/hu.yml b/config/locales/hu.yml
index eb04702db..1431aa6d1 100644
--- a/config/locales/hu.yml
+++ b/config/locales/hu.yml
@@ -182,6 +182,8 @@ hu:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} elnémította a beszélgetést'
       unmuted: '%{user_name} kikapcsolta a beszélgetés elnémítását'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ hu:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ hu:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Üzenet kötelező
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/hy.yml b/config/locales/hy.yml
index 77a36722a..ef432a472 100644
--- a/config/locales/hy.yml
+++ b/config/locales/hy.yml
@@ -182,6 +182,8 @@ hy:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ hy:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ hy:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/id.yml b/config/locales/id.yml
index 0cf76f44a..6360143f4 100644
--- a/config/locales/id.yml
+++ b/config/locales/id.yml
@@ -182,6 +182,8 @@ id:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} me-mute percakapan'
       unmuted: '%{user_name} telah un-mute percakapan'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ id:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ id:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Pesan wajib diisi
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/is.yml b/config/locales/is.yml
index a6efef268..2803bc09c 100644
--- a/config/locales/is.yml
+++ b/config/locales/is.yml
@@ -182,6 +182,8 @@ is:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ is:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ is:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/it.yml b/config/locales/it.yml
index e4d48b1c2..116d9b9db 100644
--- a/config/locales/it.yml
+++ b/config/locales/it.yml
@@ -182,6 +182,8 @@ it:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} ha silenziato la conversazione'
       unmuted: '%{user_name} ha riattivato l''audio della conversazione'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ it:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ it:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Il messaggio è obbligatorio
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/ja.yml b/config/locales/ja.yml
index 660d9f549..930aeddfa 100644
--- a/config/locales/ja.yml
+++ b/config/locales/ja.yml
@@ -182,6 +182,8 @@ ja:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} が会話をミュートしました'
       unmuted: '%{user_name} が会話のミュートを解除しました'
       auto_resolution_message: '会話がしばらく非アクティブのため、解決済みとして処理します。引き続きサポートが必要な場合は、新しい会話を開始してください。'
@@ -241,6 +243,10 @@ ja:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: '会話ウィンドウから直接Linearに問題を作成します。あるいは、既存のLinearの問題をリンクして、より効率的な問題追跡プロセスを実現します。'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ ja:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: メッセージは必須です
     copilot_error: 'この受信トレイにアシスタントを接続してCopilotを使用してください'
     copilot_limit: 'Copilot残高がありません。課金セクションからクレジットを追加購入することができます。'
     copilot:
diff --git a/config/locales/ka.yml b/config/locales/ka.yml
index 08b042c93..7a2d22c92 100644
--- a/config/locales/ka.yml
+++ b/config/locales/ka.yml
@@ -182,6 +182,8 @@ ka:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ ka:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ ka:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/ko.yml b/config/locales/ko.yml
index 723c8a8ea..3f178e684 100644
--- a/config/locales/ko.yml
+++ b/config/locales/ko.yml
@@ -182,6 +182,8 @@ ko:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ ko:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ ko:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/lt.yml b/config/locales/lt.yml
index 9a7f843be..57b7e06f5 100644
--- a/config/locales/lt.yml
+++ b/config/locales/lt.yml
@@ -182,6 +182,8 @@ lt:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} nutildė pokalbį'
       unmuted: '%{user_name} įjungė pokalbio garsą'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ lt:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ lt:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Yra reikalingas pranešimas
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/lv.yml b/config/locales/lv.yml
index eaa113cb7..423a83b16 100644
--- a/config/locales/lv.yml
+++ b/config/locales/lv.yml
@@ -182,6 +182,8 @@ lv:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} izslēdza sarunu'
       unmuted: '%{user_name} ieslēdza sarunu'
       auto_resolution_message: 'Saruna tiek pabeigta, jo tā kādu laiku ir bijusi neaktīva. Ja nepieciešama papildu palīdzība, lūdzu, sāciet jaunu sarunu.'
@@ -241,6 +243,10 @@ lv:
       name: 'Lineārs'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Izveidojiet problēmu pieteikumus programmā Linear, tieši no sarunas loga. Varat arī sasaistīt esošos Linear problēmu pieteikumus, lai nodrošinātu racionālāku un efektīvāku problēmu izsekošanas procesu.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ lv:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Nepieciešams ziņojums
     copilot_error: 'Lai izmantotu Copilot, lūdzu, pievienojiet šai iesūtnei palīgu'
     copilot_limit: 'Jums ir beigušies Copilot kredīti. Vairāk kredītu varat iegādāties norēķinu sadaļā.'
     copilot:
diff --git a/config/locales/ml.yml b/config/locales/ml.yml
index fefc77b18..56c2b4a8e 100644
--- a/config/locales/ml.yml
+++ b/config/locales/ml.yml
@@ -182,6 +182,8 @@ ml:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ ml:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ ml:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: സന്ദേശം ആവശ്യമാണ്
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/ms.yml b/config/locales/ms.yml
index dea61ba68..a65de867f 100644
--- a/config/locales/ms.yml
+++ b/config/locales/ms.yml
@@ -182,6 +182,8 @@ ms:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ ms:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ ms:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/ne.yml b/config/locales/ne.yml
index 1b97449af..66172e513 100644
--- a/config/locales/ne.yml
+++ b/config/locales/ne.yml
@@ -182,6 +182,8 @@ ne:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ ne:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ ne:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/nl.yml b/config/locales/nl.yml
index f92ab3c01..825a2fe6e 100644
--- a/config/locales/nl.yml
+++ b/config/locales/nl.yml
@@ -182,6 +182,8 @@ nl:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ nl:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ nl:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Bericht is vereist
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/no.yml b/config/locales/no.yml
index 944b63559..802b4f446 100644
--- a/config/locales/no.yml
+++ b/config/locales/no.yml
@@ -182,6 +182,8 @@
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} har dempet samtalen'
       unmuted: '%{user_name} har opphevet dempingen av samtalen'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/pl.yml b/config/locales/pl.yml
index b6e7bb5ef..8fb84eb32 100644
--- a/config/locales/pl.yml
+++ b/config/locales/pl.yml
@@ -182,6 +182,8 @@ pl:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} wyciszył/a rozmowę'
       unmuted: '%{user_name} cofnął wyciszenie rozmowy'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ pl:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ pl:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Wiadomość jest wymagana
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/pt.yml b/config/locales/pt.yml
index 429b025f8..610207306 100644
--- a/config/locales/pt.yml
+++ b/config/locales/pt.yml
@@ -91,7 +91,7 @@ pt:
       conversations_count: Num de conversas
       avg_first_response_time: Média de tempo da primeira resposta
       avg_resolution_time: Média de tempo de resolução
-      avg_reply_time: Avg reply time
+      avg_reply_time: Média de tempo de resposta
       resolution_count: Contagem de resolução
     team_csv:
       team_name: Nome da equipa
@@ -135,19 +135,19 @@ pt:
     no_content: 'Sem conteúdo'
   conversations:
     captain:
-      handoff: 'Transferring to another agent for further assistance.'
+      handoff: 'A transferir para outro agente que lhe prestará assistência adicional.'
     messages:
       instagram_story_content: '%{story_sender} mencionou você na história: '
       instagram_deleted_story_content: Esta história já não está disponível.
       deleted: Esta mensagem foi apagada
       whatsapp:
-        list_button_label: 'Choose an item'
+        list_button_label: 'Escolha um item'
       delivery_status:
         error_code: 'Código de erro: %{error_code}'
     activity:
       captain:
-        resolved: 'Conversation was marked resolved by %{user_name} due to inactivity'
-        open: 'Conversation was marked open by %{user_name}'
+        resolved: 'A conversa foi marcada como resolvida por %{user_name} devido à inatividade'
+        open: 'A conversa foi marcada como aberta por %{user_name}'
       status:
         resolved: 'Conversa foi marcada como resolvida por %{user_name}'
         contact_resolved: 'Conversa foi resolvida por %{contact_name}'
@@ -155,8 +155,8 @@ pt:
         pending: 'Conversa marcada como pendente por %{user_name}'
         snoozed: 'Conversa adiada por %{user_name}'
         auto_resolved_days: 'Conversa auto-resolvida pelo sistema por causa dos %{count} dias sem inatividade'
-        auto_resolved_hours: 'Conversation was marked resolved by system due to %{count} hours of inactivity'
-        auto_resolved_minutes: 'Conversation was marked resolved by system due to %{count} minutes of inactivity'
+        auto_resolved_hours: 'A conversa foi marcada como resolvida pelo sistema devido a %{count} horas de inatividade'
+        auto_resolved_minutes: 'A conversa foi marcada como resolvida pelo sistema devido a %{count} minutos de inatividade'
         system_auto_open: O sistema reabriu a conversa por ter sido recebida uma nova mensagem.
       priority:
         added: '%{user_name} definiu a prioridade para %{new_priority}'
@@ -177,11 +177,13 @@ pt:
         added: '%{user_name} adicionou uma política de SLA %{sla_name}'
         removed: '%{user_name} removeu a política de SLA de %{sla_name}'
       linear:
-        issue_created: 'Linear issue %{issue_id} was created by %{user_name}'
-        issue_linked: 'Linear issue %{issue_id} was linked by %{user_name}'
-        issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
+        issue_created: 'Caso Linear %{issue_id} foi criado por %{user_name}'
+        issue_linked: 'Caso Linear %{issue_id} foi associado por %{user_name}'
+        issue_unlinked: 'Caso Linear %{issue_id} foi desassociado por %{user_name}'
       csat:
-        not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+        not_sent_due_to_messaging_window: 'Inquérito CSAT não enviado devido a restrições de saída de mensagem'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolução de mensagem não enviada devido a restrições na saída de mensagens'
       muted: '%{user_name} bloqueou a conversa'
       unmuted: '%{user_name} reativou a conversa'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -215,48 +217,53 @@ pt:
       description: 'Dashboard Apps allow you to create and embed applications that display user information, orders, or payment history, providing more context to your customer support agents.'
     dyte:
       name: 'Dyte'
-      short_description: 'Start video/voice calls with customers directly from Chatwoot.'
+      short_description: 'Iniciar chamadas de vídeo/voz com clientes diretamente do Chatwoot.'
       description: 'Dyte is a product that integrates audio and video functionalities into your application. With this integration, your agents can start video/voice calls with your customers directly from Chatwoot.'
       meeting_name: '%{agent_name} iniciou uma reunião'
     slack:
       name: 'Slack'
-      short_description: 'Receive notifications and respond to conversations directly in Slack.'
+      short_description: 'Receba notificações e responda as conversas diretamente no Slack.'
       description: "Integrate Chatwoot with Slack to keep your team in sync. This integration allows you to receive notifications for new conversations and respond to them directly within Slack's interface."
     webhooks:
       name: 'Webhooks'
       description: 'Webhook events provide real-time updates about activities in your Chatwoot account. You can subscribe to your preferred events, and Chatwoot will send you HTTP callbacks with the updates.'
     dialogflow:
       name: 'Dialogflow'
-      short_description: 'Build chatbots to handle initial queries before transferring to agents.'
+      short_description: 'Crie chatbots para lidar com as consultas iniciais antes de transferir para agentes.'
       description: 'Build chatbots with Dialogflow and easily integrate them into your inbox. These bots can handle initial queries before transferring them to a customer service agent.'
     google_translate:
       name: 'Google Tradutor'
-      short_description: 'Automatically translate customer messages for agents.'
+      short_description: 'Traduzir automaticamente mensagens dos clientes para agentes.'
       description: "Integrate Google Translate to help agents easily translate customer messages. This integration automatically detects the language and converts it to the agent's or admin's preferred language."
     openai:
       name: 'OpenAI'
-      short_description: 'AI-powered reply suggestions, summarization, and message enhancement.'
+      short_description: 'Sugestões, resumos e aprimoramento de mensagem e resposta via IA.'
       description: 'Leverage the power of large language models from OpenAI with the features such as reply suggestions, summarization, message rephrasing, spell-checking, and label classification.'
     linear:
       name: 'Linear'
-      short_description: 'Create and link Linear issues directly from conversations.'
+      short_description: 'Crie e associe casos Linear diretamente de conversas.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Noção'
+      short_description: 'Integrar bases de dados, documentos e páginas diretamente com o Captain.'
+      description: 'Conecte o seu workspace Notion para permitir que o Captain aceda e gere respostas inteligentes utilizando o conteúdo das suas base de dados, documentos e páginas para fornecer mais apoio contextual ao cliente.'
     shopify:
       name: 'Shopify'
-      short_description: 'Access order details and customer data from your Shopify store.'
+      short_description: 'Aceder a detalhes do pedido e dados de clientes da sua loja Shopify.'
       description: 'Connect your Shopify store to access order details, customer information, and product data directly within your conversations and helps your support team provide faster, more contextual assistance to your customers.'
     leadsquared:
       name: 'LeadSquared'
-      short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
-      description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
+      short_description: 'Sincronize contatos e conversas com o seu LeadSquared CRM.'
+      description: 'Sincronize contatos e conversas com o seu LeadSquared CRM. Essa integração cria automaticamente leads em LeadSquared quando novos contatos são adicionados, e regista a atividade das conversas para fornecer à sua equipa de vendas um contexto completo.'
   captain:
+    copilot_message_required: A mensagem é obrigatória
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
-      using_tool: 'Using tool %{function_name}'
-      completed_tool_call: 'Completed %{function_name} tool call'
-      invalid_tool_call: 'Invalid tool call'
-      tool_not_available: 'Tool not available'
+      using_tool: 'A usar a ferramenta %{function_name}'
+      completed_tool_call: 'Chamada da ferramenta %{function_name} concluída'
+      invalid_tool_call: 'Chamada de ferramenta incorreta'
+      tool_not_available: 'Ferramenta não disponível'
   public_portal:
     search:
       search_placeholder: Pesquisar artigo por título ou corpo...
@@ -282,7 +289,7 @@ pt:
       made_with: Feito com
     header:
       go_to_homepage: Website
-      visit_website: Visit website
+      visit_website: Visitar website
       appearance:
         system: Sistema
         light: Claro
@@ -316,24 +323,12 @@ pt:
       one: '%{count} segundo'
       other: '%{count} segundos'
   automation:
-    system_name: 'Automation System'
+    system_name: 'Sistema de Automação'
   crm:
-    no_message: 'No messages in conversation'
-    attachment: '[Attachment: %{type}]'
+    no_message: 'Sem mensagens na conversa'
+    attachment: '[Anexo: %{type}]'
     no_content: '[Sem conteúdo]'
     created_activity: |
-      New conversation started on %{brand_name}
-
-      Channel: %{channel_info}
-      Created: %{formatted_creation_time}
-      Conversation ID: %{display_id}
-      View in %{brand_name}: %{url}
+      Nova conversa iniciada em %{brand_name}\n\nCanal: %{channel_info}\nCriado: %{formatted_creation_time}\nID da conversa: %{display_id}\nVer em %{brand_name}: %{url}
     transcript_activity: |
-      Conversation Transcript from %{brand_name}
-
-      Channel: %{channel_info}
-      Conversation ID: %{display_id}
-      View in %{brand_name}: %{url}
-
-      Transcript:
-      %{format_messages}
+      Transcrição da conversa de %{brand_name}\n\nCanal: %{channel_info}\nID da conversa: %{display_id}\nVer em %{brand_name}: %{url}\n\nTranscrição:\n%{format_messages}
diff --git a/config/locales/pt_BR.yml b/config/locales/pt_BR.yml
index e7d2bfb91..b13f0204f 100644
--- a/config/locales/pt_BR.yml
+++ b/config/locales/pt_BR.yml
@@ -91,7 +91,7 @@ pt_BR:
       conversations_count: Nº de Conversas
       avg_first_response_time: Tempo médio de primeira resposta
       avg_resolution_time: Tempo médio de resolução
-      avg_reply_time: Avg reply time
+      avg_reply_time: Tempo médio de resposta
       resolution_count: Contagem de Resolução
     team_csv:
       team_name: Nome do Time
@@ -141,7 +141,7 @@ pt_BR:
       instagram_deleted_story_content: Este Story não está mais disponível.
       deleted: Esta mensagem foi excluída
       whatsapp:
-        list_button_label: 'Choose an item'
+        list_button_label: 'Escolha um item'
       delivery_status:
         error_code: 'Código de erro: %{error_code}'
     activity:
@@ -177,11 +177,13 @@ pt_BR:
         added: '%{user_name} adicionou política de SLA %{sla_name}'
         removed: '%{user_name} removeu a política de SLA %{sla_name}'
       linear:
-        issue_created: 'Linear issue %{issue_id} was created by %{user_name}'
-        issue_linked: 'Linear issue %{issue_id} was linked by %{user_name}'
-        issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
+        issue_created: 'Problema linear %{issue_id} foi criado por %{user_name}'
+        issue_linked: 'Problema linear %{issue_id} foi vinculado por %{user_name}'
+        issue_unlinked: 'Problema linear %{issue_id} foi desvinculado por %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'Pesquisa CSAT não foi enviada devido a restrições de envio de mensagens'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolver mensagem não enviada devido a restrições de envio de mensagens'
       muted: '%{user_name} silenciou a conversa'
       unmuted: '%{user_name} reativou a conversa'
       auto_resolution_message: 'Resolvendo a conversa dado que está inativa por um tempo. Por favor, inicie uma nova conversa se precisar de mais ajuda.'
@@ -241,6 +243,10 @@ pt_BR:
       name: 'Linear'
       short_description: 'Crie e vincule issues do Linear diretamente de conversas.'
       description: 'Crie issues em Linear diretamente da sua janela de conversa. Alternativamente, vincule as issues lineares existentes para um processo de rastreamento de problemas mais simples e eficiente.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Acessar detalhes do pedido e dados de clientes da sua loja Shopify.'
@@ -250,6 +256,7 @@ pt_BR:
       short_description: 'Sincronize seus contatos e conversas com LeadSquared CRM.'
       description: 'Sincronize seus contatos e conversas com LeadSquared CRM. Essa integração cria automaticamente leads em LeadSquared quando novos contatos são adicionados, e registra a atividade de conversação para fornecer à sua equipe de vendas um contexto completo.'
   captain:
+    copilot_message_required: A mensagem é obrigatória
     copilot_error: 'Conecte com um assistente a esta caixa de entrada para usar Copilot'
     copilot_limit: 'Você está sem créditos de Copilot. Pode comprar mais créditos na seção de faturamento.'
     copilot:
@@ -282,7 +289,7 @@ pt_BR:
       made_with: Criado com
     header:
       go_to_homepage: Site
-      visit_website: Visit website
+      visit_website: Visite o site
       appearance:
         system: Sistema
         light: Claro
diff --git a/config/locales/ro.yml b/config/locales/ro.yml
index 408f85f87..e0c56de83 100644
--- a/config/locales/ro.yml
+++ b/config/locales/ro.yml
@@ -182,6 +182,8 @@ ro:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} a dezactivat conversația'
       unmuted: '%{user_name} a activat conversația'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ ro:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ ro:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Este necesar un mesaj
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/ru.yml b/config/locales/ru.yml
index 46b749f21..21b859d44 100644
--- a/config/locales/ru.yml
+++ b/config/locales/ru.yml
@@ -182,6 +182,8 @@ ru:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} заглушил(а) этот разговор'
       unmuted: '%{user_name} включил(а) уведомления для разговора'
       auto_resolution_message: 'Разговор закрывается, поскольку он был неактивен в течение длительного времени. Пожалуйста, начните новый разговор, если потребуется дополнительная помощь.'
@@ -241,6 +243,10 @@ ru:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Создавайте или прикрепляйте уже существующие задачи в Linear непосредственно из окна диалога для более упорядоченного и эффективного процесса отслеживания проблем.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ ru:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Необходимо ввести сообщение
     copilot_error: 'Пожалуйста, подключите ассистента к этому источнику входящих для использования Copilot'
     copilot_limit: 'У вас закончились кредиты для Copilot. Вы можете купить дополнительные кредиты в разделе биллинга.'
     copilot:
diff --git a/config/locales/sh.yml b/config/locales/sh.yml
index d1e84b328..0ec3547f8 100644
--- a/config/locales/sh.yml
+++ b/config/locales/sh.yml
@@ -182,6 +182,8 @@ sh:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ sh:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ sh:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/sk.yml b/config/locales/sk.yml
index d607ecb66..07cb5ebde 100644
--- a/config/locales/sk.yml
+++ b/config/locales/sk.yml
@@ -182,6 +182,8 @@ sk:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} stlmil konverzáciu'
       unmuted: '%{user_name} odtlmil konverzáciu'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ sk:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ sk:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/sl.yml b/config/locales/sl.yml
index a4d981878..db82f23eb 100644
--- a/config/locales/sl.yml
+++ b/config/locales/sl.yml
@@ -182,6 +182,8 @@ sl:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} je utišal pogovor'
       unmuted: '%{user_name} je vklopil sporočila pogovora'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ sl:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Ustvarite issue v Linearju neposredno iz pogovornega okna. Druga možnost je, da povežete obstoječe Linear issue za bolj poenostavljen in učinkovit postopek sledenja težavam.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ sl:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/sq.yml b/config/locales/sq.yml
index a95d31f8b..84e74137f 100644
--- a/config/locales/sq.yml
+++ b/config/locales/sq.yml
@@ -182,6 +182,8 @@ sq:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ sq:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ sq:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/sr.yml b/config/locales/sr.yml
index 020ee79f6..d7e9b8b0b 100644
--- a/config/locales/sr.yml
+++ b/config/locales/sr.yml
@@ -182,6 +182,8 @@ sr-Latn:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} je utišao razgovor'
       unmuted: '%{user_name} je uklonio utišanje razgovora'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ sr-Latn:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ sr-Latn:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Poruka je obavezna
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/sv.yml b/config/locales/sv.yml
index e6fd303b2..0c6db6561 100644
--- a/config/locales/sv.yml
+++ b/config/locales/sv.yml
@@ -182,6 +182,8 @@ sv:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} har tystat konversationen'
       unmuted: '%{user_name} har avtystat konversationen'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ sv:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ sv:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Meddelande måste fyllas i
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/ta.yml b/config/locales/ta.yml
index 19160d31c..4002781b8 100644
--- a/config/locales/ta.yml
+++ b/config/locales/ta.yml
@@ -182,6 +182,8 @@ ta:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ ta:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ ta:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/th.yml b/config/locales/th.yml
index 92fc4b1c6..035ec8206 100644
--- a/config/locales/th.yml
+++ b/config/locales/th.yml
@@ -182,6 +182,8 @@ th:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ th:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ th:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: โปรดระบุข้อความด้วย
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/tl.yml b/config/locales/tl.yml
index b0ff25b71..9952a7c93 100644
--- a/config/locales/tl.yml
+++ b/config/locales/tl.yml
@@ -182,6 +182,8 @@ tl:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ tl:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ tl:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/tr.yml b/config/locales/tr.yml
index 128783873..83fe47a92 100644
--- a/config/locales/tr.yml
+++ b/config/locales/tr.yml
@@ -91,7 +91,7 @@ tr:
       conversations_count: Konuşma sayısı
       avg_first_response_time: Avg first response time
       avg_resolution_time: Avg resolution time
-      avg_reply_time: Avg reply time
+      avg_reply_time: Ortalama yanıt süresi
       resolution_count: Çözünürlük Sayısı
     team_csv:
       team_name: Ekip adı
@@ -141,7 +141,7 @@ tr:
       instagram_deleted_story_content: Bu hikaye artık mevcut değil.
       deleted: Bu mesaj silinmiş
       whatsapp:
-        list_button_label: 'Choose an item'
+        list_button_label: 'Bir öğe seçin'
       delivery_status:
         error_code: 'Hata kodu: %{error_code}'
     activity:
@@ -177,11 +177,13 @@ tr:
         added: '%{user_name} added SLA policy %{sla_name}'
         removed: '%{user_name} removed SLA policy %{sla_name}'
       linear:
-        issue_created: 'Linear issue %{issue_id} was created by %{user_name}'
-        issue_linked: 'Linear issue %{issue_id} was linked by %{user_name}'
-        issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
+        issue_created: 'Linear sorun %{issue_id} %{user_name} tarafından oluşturuldu'
+        issue_linked: 'Linear sorun %{issue_id} %{user_name} tarafından bağlandı'
+        issue_unlinked: 'Linear sorun %{issue_id} %{user_name} tarafından bağlantısı kaldırıldı'
       csat:
-        not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+        not_sent_due_to_messaging_window: 'Giden mesaj kısıtlamaları nedeniyle CSAT anketi gönderilmedi'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name}, sohbeti sessize aldı'
       unmuted: '%{user_name} konuşmanın sesini açtı'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ tr:
       name: 'Linear'
       short_description: 'Linear sorunlarını doğrudan sohbetlerden oluşturun ve bağlayın.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Shopify mağazanızdan sipariş detaylarına ve müşteri verilerine erişin.'
@@ -250,6 +256,7 @@ tr:
       short_description: 'Kişilerinizi ve sohbetlerinizi LeadSquared CRM ile senkronize edin.'
       description: 'Kişilerinizi ve sohbetlerinizi LeadSquared CRM ile senkronize edin. Bu entegrasyon, yeni kişiler eklendiğinde otomatik olarak LeadSquared''da potansiyel müşteri oluşturur ve satış ekibinize tam bağlam sağlamak için sohbet etkinliğini kaydeder.'
   captain:
+    copilot_message_required: Mesaj gerekli
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
@@ -282,7 +289,7 @@ tr:
       made_with: İle yapılmıştır
     header:
       go_to_homepage: Website
-      visit_website: Visit website
+      visit_website: Siteyi ziyaret et
       appearance:
         system: Sistem
         light: Açık Mod
diff --git a/config/locales/uk.yml b/config/locales/uk.yml
index b48de05bb..d7afbbdd3 100644
--- a/config/locales/uk.yml
+++ b/config/locales/uk.yml
@@ -182,6 +182,8 @@ uk:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} включив безвучний режим'
       unmuted: '%{user_name} виключив безвучний режим'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ uk:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ uk:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Необхідне повідомлення
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/ur.yml b/config/locales/ur.yml
index 5e441edc4..e3c7382e8 100644
--- a/config/locales/ur.yml
+++ b/config/locales/ur.yml
@@ -182,6 +182,8 @@ ur:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ ur:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ ur:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/ur_IN.yml b/config/locales/ur_IN.yml
index cb659d105..8207db68c 100644
--- a/config/locales/ur_IN.yml
+++ b/config/locales/ur_IN.yml
@@ -182,6 +182,8 @@ ur:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} has muted the conversation'
       unmuted: '%{user_name} has unmuted the conversation'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ ur:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ ur:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Message is required
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/vi.yml b/config/locales/vi.yml
index ff1e6c398..91119144d 100644
--- a/config/locales/vi.yml
+++ b/config/locales/vi.yml
@@ -182,6 +182,8 @@ vi:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} đã tắt tiếng hội thoại'
       unmuted: '%{user_name} đã bật tiếng cuộc trò chuyện'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ vi:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ vi:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: Thông điệp bắt buộc có
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:
diff --git a/config/locales/zh_CN.yml b/config/locales/zh_CN.yml
index 415de5705..5e57bcd06 100644
--- a/config/locales/zh_CN.yml
+++ b/config/locales/zh_CN.yml
@@ -182,6 +182,8 @@ zh_CN:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} 已将会话静音'
       unmuted: '%{user_name} 已将会话取消静音'
       auto_resolution_message: '由于对话长时间未活跃，已将其标记为已解决。如果您需要进一步帮助，请开始新的对话。'
@@ -241,6 +243,10 @@ zh_CN:
       name: 'Linear'
       short_description: '直接在会话中创建并关联 Linear 问题。'
       description: '直接从对话窗口在 Linear 中创建问题。或者，链接现有的 Linear 问题以简化问题跟踪过程。'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: '从您的 Shopify 商店访问订单详情和客户数据。'
@@ -250,6 +256,7 @@ zh_CN:
       short_description: '与 LeadSquared CRM 同步您的联系人和对话。'
       description: '与 LeadSquared CRM 同步您的联系人和对话。 当添加新联系人时，这种集成会自动在潜在客户创建线索，并记录对话活动，为您的销售团队提供完整的上下文。'
   captain:
+    copilot_message_required: 消息是必填项
     copilot_error: '请为该收件箱连接一个助手以使用 Copilot'
     copilot_limit: '您的 Copilot 积分已用完。您可以从计费部分购买更多积分。'
     copilot:
diff --git a/config/locales/zh_TW.yml b/config/locales/zh_TW.yml
index d658f5a17..4ff8ba720 100644
--- a/config/locales/zh_TW.yml
+++ b/config/locales/zh_TW.yml
@@ -182,6 +182,8 @@ zh_TW:
         issue_unlinked: 'Linear issue %{issue_id} was unlinked by %{user_name}'
       csat:
         not_sent_due_to_messaging_window: 'CSAT survey not sent due to outgoing message restrictions'
+      auto_resolve:
+        not_sent_due_to_messaging_window: 'Auto-resolve message not sent due to outgoing message restrictions'
       muted: '%{user_name} 已將對話靜音'
       unmuted: '%{user_name} 將對話解除靜音'
       auto_resolution_message: 'Resolving the conversation as it has been inactive for a while. Please start a new conversation if you need further assistance.'
@@ -241,6 +243,10 @@ zh_TW:
       name: 'Linear'
       short_description: 'Create and link Linear issues directly from conversations.'
       description: 'Create issues in Linear directly from your conversation window. Alternatively, link existing Linear issues for a more streamlined and efficient issue tracking process.'
+    notion:
+      name: 'Notion'
+      short_description: 'Integrate databases, documents and pages directly with Captain.'
+      description: 'Connect your Notion workspace to enable Captain to access and generate intelligent responses using content from your databases, documents, and pages to provide more contextual customer support.'
     shopify:
       name: 'Shopify'
       short_description: 'Access order details and customer data from your Shopify store.'
@@ -250,6 +256,7 @@ zh_TW:
       short_description: 'Sync your contacts and conversations with LeadSquared CRM.'
       description: 'Sync your contacts and conversations with LeadSquared CRM. This integration automatically creates leads in LeadSquared when new contacts are added, and logs conversation activity to provide your sales team with complete context.'
   captain:
+    copilot_message_required: 訊息為必填
     copilot_error: 'Please connect an assistant to this inbox to use Copilot'
     copilot_limit: 'You are out of Copilot credits. You can buy more credits from the billing section.'
     copilot:

From 30a3a3528178e1ead0597fbf456fc99e97228b4f Mon Sep 17 00:00:00 2001
From: Shivam Mishra <scm.mymail@gmail.com>
Date: Tue, 8 Jul 2025 09:41:40 +0530
Subject: [PATCH 27/31] feat: remove colon and semicolons when sanitizing inbox
 name (#11889)

---
 app/models/inbox.rb       | 2 +-
 spec/models/inbox_spec.rb | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/app/models/inbox.rb b/app/models/inbox.rb
index 69996707b..1c898ba7f 100644
--- a/app/models/inbox.rb
+++ b/app/models/inbox.rb
@@ -191,7 +191,7 @@ class Inbox < ApplicationRecord
   end
 
   def apply_sanitization_rules(name)
-    name.gsub(/[\\<>@"!#$%&*+=?^`{|}~]/, '')            # Remove forbidden chars
+    name.gsub(/[\\<>@"!#$%&*+=?^`{|}~:;]/, '')         # Remove forbidden chars
         .gsub(/[\x00-\x1F\x7F]/, ' ')                   # Replace control chars with spaces
         .gsub(/\A[[:punct:]]+|[[:punct:]]+\z/, '')      # Remove leading/trailing punctuation
         .gsub(/\s+/, ' ')                               # Normalize spaces
diff --git a/spec/models/inbox_spec.rb b/spec/models/inbox_spec.rb
index e25e87e4d..92fddcd78 100644
--- a/spec/models/inbox_spec.rb
+++ b/spec/models/inbox_spec.rb
@@ -262,7 +262,7 @@ RSpec.describe Inbox do
   describe '#sanitized_name' do
     context 'when inbox name contains forbidden characters' do
       it 'removes forbidden and spam-trigger characters' do
-        inbox = FactoryBot.build(:inbox, name: 'Test/Name\\With<Bad>@Characters"And\'Quotes!#$%')
+        inbox = FactoryBot.build(:inbox, name: 'Test/Name\\With<Bad>@Characters"And\';:Quotes!#$%')
         expect(inbox.sanitized_name).to eq('Test/NameWithBadCharactersAnd\'Quotes')
       end
     end

From c553997af82eb02d73cb3032ff42a32471d78116 Mon Sep 17 00:00:00 2001
From: Petterson <58094725+hahuma@users.noreply.github.com>
Date: Tue, 8 Jul 2025 04:10:40 -0300
Subject: [PATCH 28/31] fix: Translate Priority and Messages types in
 Automations and Macros (#11741)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

# Pull Request Template

## Description

With these fixes, I could improve some translations in portuguese, and
also I added some improvements to make some drowpdown values, that were
not translatable into translatable strings, into the Automations, Macros
and Custom Attributes page. I also fixed some typos.

Here are the main improvements.

- ~Fixed typo in portuguese into `Reports > Agents` page:~
~Before:

![image](https://github.com/user-attachments/assets/5a911108-76a6-4e54-82f1-1185c3e1981b)
After:

![image](https://github.com/user-attachments/assets/2a4fc5bf-3239-47b5-9113-ba66e0f44b9c)~

- Added the possibility to make the `Priority` and `Message types`
translatables in other languages, into Macros and Automations page. Also
added the same feature for Custom attributes page at `applies to` and
`type` fields:
Before:

![image](https://github.com/user-attachments/assets/d53b3e6d-be3e-4e02-9478-7d3121cc11cb)

![image](https://github.com/user-attachments/assets/28a7bffe-fe8b-43f6-8e30-9d62ab8adf14)

![image](https://github.com/user-attachments/assets/18a983c1-2db8-445d-a4cc-982beb88015a)

![image](https://github.com/user-attachments/assets/2be8b0f2-ed9e-4bac-aeb0-596533200da4)
After:

![image](https://github.com/user-attachments/assets/0fa904ae-7b48-4ce4-afb8-e0586c5624b7)

![image](https://github.com/user-attachments/assets/a524f119-9222-4e98-9cd7-2fca3303e8d5)

![image](https://github.com/user-attachments/assets/7062f277-e9c9-4473-980b-6ca2d6bdcefc)

![image](https://github.com/user-attachments/assets/0bb66f07-ee10-4833-b950-b9aa9441a312)

- ~Improve Bots page. In the Brazilian portuguese is very common and
widely used bots to refer to chatbots, using `robô` as a direct
translations sounds weird, `robô` is used more often when we are talking
about robots, not chatbots.
Before:

![image](https://github.com/user-attachments/assets/3966cc11-51f4-4e1a-bc81-ada2795408e8)
After:

![image](https://github.com/user-attachments/assets/c9ec0ad5-974e-40d9-9542-031db99839e2)~

- Added multiselect both `no options` and `Select` placeholder
translatable strings:
Before:

![image](https://github.com/user-attachments/assets/545641d4-87ae-4305-8adc-3b73bbaf2ab1)

![image](https://github.com/user-attachments/assets/8800c001-abe7-41bb-bd68-feb5db13b8f0)
After:

![image](https://github.com/user-attachments/assets/46748652-28f2-4ae3-9d20-55db1015aaae)

- Added `.pnpm-store` to `.gitignore`, when I'm using docker, the pnpm
always creates this folder into my root directory, so I imagine the same
could happens with others, so I fixed it.


## Type of change

Please delete options that are not relevant.

- [x] Bug fix (non-breaking change which fixes an issue)
- [x] New feature (non-breaking change which adds functionality)
- [ ] Breaking change (fix or feature that would cause existing
functionality not to work as expected)
- [ ] This change requires a documentation update

## How Has This Been Tested?

I've added some translations for my language (brazilian portuguese), so
i just switched the languages between the original in EN to PT_BR.

## Checklist:

- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my code
- [ ] I have commented on my code, particularly in hard-to-understand
areas
- [ ] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [ ] New and existing unit tests pass locally with my changes
- [x] Any dependent changes have been merged and published in downstream
modules

---------

Co-authored-by: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Co-authored-by: iamsivin <iamsivin@gmail.com>
Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com>
---
 .../widgets/AutomationActionInput.vue         | 12 +++++-
 .../components/widgets/FilterInput/Index.vue  | 16 ++++++--
 .../composables/spec/useAutomation.spec.js    | 13 ++++--
 .../composables/spec/useMacros.spec.js        | 11 +++--
 .../composables/useAutomationValues.js        | 23 +++++++++++
 .../dashboard/composables/useMacros.js        |  7 +++-
 .../dashboard/constants/automation.js         | 11 ++++-
 .../dashboard/helper/automationHelper.js      | 11 ++---
 .../specs/fixtures/automationFixtures.js      | 25 +++++++-----
 .../i18n/locale/en/attributesMgmt.json        | 12 ++++++
 .../dashboard/i18n/locale/en/automation.json  | 11 +++++
 .../i18n/locale/en/generalSettings.json       |  1 +
 .../dashboard/i18n/locale/en/macros.json      |  7 ++++
 .../settings/attributes/AddAttribute.vue      | 14 ++++++-
 .../settings/attributes/CustomAttribute.vue   |  6 ++-
 .../settings/attributes/EditAttribute.vue     | 11 +++--
 .../settings/attributes/constants.js          | 40 ++++---------------
 17 files changed, 163 insertions(+), 68 deletions(-)

diff --git a/app/javascript/dashboard/components/widgets/AutomationActionInput.vue b/app/javascript/dashboard/components/widgets/AutomationActionInput.vue
index f59b12dda..5f9aa8f0d 100644
--- a/app/javascript/dashboard/components/widgets/AutomationActionInput.vue
+++ b/app/javascript/dashboard/components/widgets/AutomationActionInput.vue
@@ -133,7 +133,11 @@ export default {
               :options="dropdownValues"
               :allow-empty="false"
               :option-height="104"
-            />
+            >
+              <template #noOptions>
+                {{ $t('FORMS.MULTISELECT.NO_OPTIONS') }}
+              </template>
+            </multiselect>
           </div>
           <div
             v-else-if="inputType === 'multi_select'"
@@ -152,7 +156,11 @@ export default {
               :options="dropdownValues"
               :allow-empty="false"
               :option-height="104"
-            />
+            >
+              <template #noOptions>
+                {{ $t('FORMS.MULTISELECT.NO_OPTIONS') }}
+              </template>
+            </multiselect>
           </div>
           <input
             v-else-if="inputType === 'email'"
diff --git a/app/javascript/dashboard/components/widgets/FilterInput/Index.vue b/app/javascript/dashboard/components/widgets/FilterInput/Index.vue
index 9e9e5bc4b..f38bc814b 100644
--- a/app/javascript/dashboard/components/widgets/FilterInput/Index.vue
+++ b/app/javascript/dashboard/components/widgets/FilterInput/Index.vue
@@ -203,7 +203,7 @@ export default {
               v-model="values"
               track-by="id"
               label="name"
-              placeholder="Select"
+              :placeholder="$t('FORMS.MULTISELECT.SELECT')"
               multiple
               selected-label
               :select-label="$t('FORMS.MULTISELECT.ENTER_TO_SELECT')"
@@ -211,7 +211,11 @@ export default {
               :max-height="160"
               :options="dropdownValues"
               :allow-empty="false"
-            />
+            >
+              <template #noOptions>
+                {{ $t('FORMS.MULTISELECT.NO_OPTIONS') }}
+              </template>
+            </multiselect>
           </div>
           <div
             v-else-if="inputType === 'search_select'"
@@ -221,7 +225,7 @@ export default {
               v-model="values"
               track-by="id"
               label="name"
-              placeholder="Select"
+              :placeholder="$t('FORMS.MULTISELECT.SELECT')"
               selected-label
               :select-label="$t('FORMS.MULTISELECT.ENTER_TO_SELECT')"
               deselect-label=""
@@ -229,7 +233,11 @@ export default {
               :options="dropdownValues"
               :allow-empty="false"
               :option-height="104"
-            />
+            >
+              <template #noOptions>
+                {{ $t('FORMS.MULTISELECT.NO_OPTIONS') }}
+              </template>
+            </multiselect>
           </div>
           <div v-else-if="inputType === 'date'" class="multiselect-wrap--small">
             <input
diff --git a/app/javascript/dashboard/composables/spec/useAutomation.spec.js b/app/javascript/dashboard/composables/spec/useAutomation.spec.js
index c8acae2c6..46c0bde50 100644
--- a/app/javascript/dashboard/composables/spec/useAutomation.spec.js
+++ b/app/javascript/dashboard/composables/spec/useAutomation.spec.js
@@ -9,6 +9,8 @@ import {
   teams,
   labels,
   statusFilterOptions,
+  messageTypeOptions,
+  priorityOptions,
   campaigns,
   contacts,
   inboxes,
@@ -16,7 +18,6 @@ import {
   countries,
   slaPolicies,
 } from 'dashboard/helper/specs/fixtures/automationFixtures.js';
-import { MESSAGE_CONDITION_VALUES } from 'dashboard/constants/automation';
 
 vi.mock('dashboard/composables/store');
 vi.mock('dashboard/composables');
@@ -71,7 +72,9 @@ describe('useAutomation', () => {
         case 'country_code':
           return countries;
         case 'message_type':
-          return MESSAGE_CONDITION_VALUES;
+          return messageTypeOptions;
+        case 'priority':
+          return priorityOptions;
         default:
           return [];
       }
@@ -93,6 +96,8 @@ describe('useAutomation', () => {
           return [];
         case 'add_sla':
           return slaPolicies;
+        case 'change_priority':
+          return priorityOptions;
         default:
           return [];
       }
@@ -218,8 +223,9 @@ describe('useAutomation', () => {
     expect(getConditionDropdownValues('browser_language')).toEqual(languages);
     expect(getConditionDropdownValues('country_code')).toEqual(countries);
     expect(getConditionDropdownValues('message_type')).toEqual(
-      MESSAGE_CONDITION_VALUES
+      messageTypeOptions
     );
+    expect(getConditionDropdownValues('priority')).toEqual(priorityOptions);
   });
 
   it('gets action dropdown values correctly', () => {
@@ -231,6 +237,7 @@ describe('useAutomation', () => {
     expect(getActionDropdownValues('send_email_to_team')).toEqual(teams);
     expect(getActionDropdownValues('send_message')).toEqual([]);
     expect(getActionDropdownValues('add_sla')).toEqual(slaPolicies);
+    expect(getActionDropdownValues('change_priority')).toEqual(priorityOptions);
   });
 
   it('handles event change correctly', () => {
diff --git a/app/javascript/dashboard/composables/spec/useMacros.spec.js b/app/javascript/dashboard/composables/spec/useMacros.spec.js
index a72d2ddfe..7666e4afa 100644
--- a/app/javascript/dashboard/composables/spec/useMacros.spec.js
+++ b/app/javascript/dashboard/composables/spec/useMacros.spec.js
@@ -5,6 +5,9 @@ import { PRIORITY_CONDITION_VALUES } from 'dashboard/constants/automation';
 
 vi.mock('dashboard/composables/store');
 vi.mock('dashboard/helper/automationHelper.js');
+vi.mock('vue-i18n', () => ({
+  useI18n: () => ({ t: key => key }),
+}));
 
 describe('useMacros', () => {
   const mockLabels = [
@@ -148,9 +151,11 @@ describe('useMacros', () => {
 
   it('returns PRIORITY_CONDITION_VALUES for change_priority type', () => {
     const { getMacroDropdownValues } = useMacros();
-    expect(getMacroDropdownValues('change_priority')).toEqual(
-      PRIORITY_CONDITION_VALUES
-    );
+    const expectedPriority = PRIORITY_CONDITION_VALUES.map(item => ({
+      id: item.id,
+      name: `MACROS.PRIORITY_TYPES.${item.i18nKey}`,
+    }));
+    expect(getMacroDropdownValues('change_priority')).toEqual(expectedPriority);
   });
 
   it('returns an empty array for unknown types', () => {
diff --git a/app/javascript/dashboard/composables/useAutomationValues.js b/app/javascript/dashboard/composables/useAutomationValues.js
index 4df46be8f..abc44f66b 100644
--- a/app/javascript/dashboard/composables/useAutomationValues.js
+++ b/app/javascript/dashboard/composables/useAutomationValues.js
@@ -8,6 +8,10 @@ import {
   getActionOptions,
   getConditionOptions,
 } from 'dashboard/helper/automationHelper';
+import {
+  MESSAGE_CONDITION_VALUES,
+  PRIORITY_CONDITION_VALUES,
+} from 'dashboard/constants/automation';
 
 /**
  * This is a shared composables that holds utilites used to build dropdown and file options
@@ -60,6 +64,20 @@ export default function useAutomationValues() {
     ];
   });
 
+  const messageTypeOptions = computed(() =>
+    MESSAGE_CONDITION_VALUES.map(item => ({
+      id: item.id,
+      name: t(`AUTOMATION.MESSAGE_TYPES.${item.i18nKey}`),
+    }))
+  );
+
+  const priorityOptions = computed(() =>
+    PRIORITY_CONDITION_VALUES.map(item => ({
+      id: item.id,
+      name: t(`AUTOMATION.PRIORITY_TYPES.${item.i18nKey}`),
+    }))
+  );
+
   /**
    * Adds a translated "None" option to the beginning of a list
    * @param {Array} list - The list to add "None" to
@@ -87,6 +105,8 @@ export default function useAutomationValues() {
       customAttributes: getters['attributes/getAttributes'].value,
       inboxes: inboxes.value,
       statusFilterOptions: statusFilterOptions.value,
+      priorityOptions: priorityOptions.value,
+      messageTypeOptions: messageTypeOptions.value,
       teams: teams.value,
       languages,
       countries,
@@ -108,6 +128,7 @@ export default function useAutomationValues() {
       languages,
       type,
       addNoneToListFn: addNoneToList,
+      priorityOptions: priorityOptions.value,
     });
   };
 
@@ -115,6 +136,8 @@ export default function useAutomationValues() {
     booleanFilterOptions,
     statusFilterItems,
     statusFilterOptions,
+    priorityOptions,
+    messageTypeOptions,
     getConditionDropdownValues,
     getActionDropdownValues,
     agents,
diff --git a/app/javascript/dashboard/composables/useMacros.js b/app/javascript/dashboard/composables/useMacros.js
index 0489e2d1f..8f0227fa3 100644
--- a/app/javascript/dashboard/composables/useMacros.js
+++ b/app/javascript/dashboard/composables/useMacros.js
@@ -1,4 +1,5 @@
 import { computed } from 'vue';
+import { useI18n } from 'vue-i18n';
 import { useStoreGetters } from 'dashboard/composables/store';
 import { PRIORITY_CONDITION_VALUES } from 'dashboard/constants/automation';
 
@@ -7,6 +8,7 @@ import { PRIORITY_CONDITION_VALUES } from 'dashboard/constants/automation';
  * @returns {Object} An object containing the getMacroDropdownValues function
  */
 export const useMacros = () => {
+  const { t } = useI18n();
   const getters = useStoreGetters();
 
   const labels = computed(() => getters['labels/getLabels'].value);
@@ -32,7 +34,10 @@ export const useMacros = () => {
           name: i.title,
         }));
       case 'change_priority':
-        return PRIORITY_CONDITION_VALUES;
+        return PRIORITY_CONDITION_VALUES.map(item => ({
+          id: item.id,
+          name: t(`MACROS.PRIORITY_TYPES.${item.i18nKey}`),
+        }));
       default:
         return [];
     }
diff --git a/app/javascript/dashboard/constants/automation.js b/app/javascript/dashboard/constants/automation.js
index 3aa9754d5..399dd6153 100644
--- a/app/javascript/dashboard/constants/automation.js
+++ b/app/javascript/dashboard/constants/automation.js
@@ -38,11 +38,13 @@ export const DEFAULT_ACTIONS = [
 export const MESSAGE_CONDITION_VALUES = [
   {
     id: 'incoming',
-    name: 'Incoming Message',
+    name: 'Incoming',
+    i18nKey: 'INCOMING',
   },
   {
     id: 'outgoing',
-    name: 'Outgoing Message',
+    name: 'Outgoing',
+    i18nKey: 'OUTGOING',
   },
 ];
 
@@ -50,21 +52,26 @@ export const PRIORITY_CONDITION_VALUES = [
   {
     id: 'nil',
     name: 'None',
+    i18nKey: 'NONE',
   },
   {
     id: 'low',
     name: 'Low',
+    i18nKey: 'LOW',
   },
   {
     id: 'medium',
     name: 'Medium',
+    i18nKey: 'MEDIUM',
   },
   {
     id: 'high',
     name: 'High',
+    i18nKey: 'HIGH',
   },
   {
     id: 'urgent',
     name: 'Urgent',
+    i18nKey: 'URGENT',
   },
 ];
diff --git a/app/javascript/dashboard/helper/automationHelper.js b/app/javascript/dashboard/helper/automationHelper.js
index 07186c122..c9852814a 100644
--- a/app/javascript/dashboard/helper/automationHelper.js
+++ b/app/javascript/dashboard/helper/automationHelper.js
@@ -8,8 +8,6 @@ import {
   DEFAULT_CONVERSATION_OPENED_CONDITION,
   DEFAULT_OTHER_CONDITION,
   DEFAULT_ACTIONS,
-  MESSAGE_CONDITION_VALUES,
-  PRIORITY_CONDITION_VALUES,
 } from 'dashboard/constants/automation';
 import filterQueryGenerator from './filterQueryGenerator';
 import actionQueryGenerator from './actionQueryGenerator';
@@ -103,6 +101,7 @@ export const getActionOptions = ({
   slaPolicies,
   type,
   addNoneToListFn,
+  priorityOptions,
 }) => {
   const actionsMap = {
     assign_agent: addNoneToListFn ? addNoneToListFn(agents) : agents,
@@ -110,7 +109,7 @@ export const getActionOptions = ({
     send_email_to_team: teams,
     add_label: generateConditionOptions(labels, 'title'),
     remove_label: generateConditionOptions(labels, 'title'),
-    change_priority: PRIORITY_CONDITION_VALUES,
+    change_priority: priorityOptions,
     add_sla: slaPolicies,
   };
   return actionsMap[type];
@@ -128,6 +127,8 @@ export const getConditionOptions = ({
   statusFilterOptions,
   teams,
   type,
+  priorityOptions,
+  messageTypeOptions,
 }) => {
   if (isCustomAttributeCheckbox(customAttributes, type)) {
     return booleanFilterOptions;
@@ -147,8 +148,8 @@ export const getConditionOptions = ({
     browser_language: languages,
     conversation_language: languages,
     country_code: countries,
-    message_type: MESSAGE_CONDITION_VALUES,
-    priority: PRIORITY_CONDITION_VALUES,
+    message_type: messageTypeOptions,
+    priority: priorityOptions,
   };
 
   return conditionFilterMaps[type];
diff --git a/app/javascript/dashboard/helper/specs/fixtures/automationFixtures.js b/app/javascript/dashboard/helper/specs/fixtures/automationFixtures.js
index 1f642587b..e8f1b3ad9 100644
--- a/app/javascript/dashboard/helper/specs/fixtures/automationFixtures.js
+++ b/app/javascript/dashboard/helper/specs/fixtures/automationFixtures.js
@@ -2,6 +2,11 @@ import allLanguages from 'dashboard/components/widgets/conversation/advancedFilt
 
 import allCountries from 'shared/constants/countries.js';
 
+import {
+  MESSAGE_CONDITION_VALUES,
+  PRIORITY_CONDITION_VALUES,
+} from 'dashboard/constants/automation';
+
 export const customAttributes = [
   {
     id: 1,
@@ -636,16 +641,16 @@ export const statusFilterOptions = [
 ];
 export const languages = allLanguages;
 export const countries = allCountries;
-export const MESSAGE_CONDITION_VALUES = [
-  {
-    id: 'incoming',
-    name: 'Incoming Message',
-  },
-  {
-    id: 'outgoing',
-    name: 'Outgoing Message',
-  },
-];
+
+export const messageTypeOptions = MESSAGE_CONDITION_VALUES.map(item => ({
+  id: item.id,
+  name: `AUTOMATION.MESSAGE_TYPES.${item.i18nKey}`,
+}));
+
+export const priorityOptions = PRIORITY_CONDITION_VALUES.map(item => ({
+  id: item.id,
+  name: `AUTOMATION.PRIORITY_TYPES.${item.i18nKey}`,
+}));
 
 export const automationToSubmit = {
   name: 'Fayaz',
diff --git a/app/javascript/dashboard/i18n/locale/en/attributesMgmt.json b/app/javascript/dashboard/i18n/locale/en/attributesMgmt.json
index dd413ab26..cea6359de 100644
--- a/app/javascript/dashboard/i18n/locale/en/attributesMgmt.json
+++ b/app/javascript/dashboard/i18n/locale/en/attributesMgmt.json
@@ -5,6 +5,18 @@
     "LOADING": "Fetching custom attributes",
     "DESCRIPTION": "A custom attribute tracks additional details about your contacts or conversations—such as the subscription plan or the date of their first purchase. You can add different types of custom attributes, such as text, lists, or numbers, to capture the specific information you need.",
     "LEARN_MORE": "Learn more about custom attributes",
+    "ATTRIBUTE_MODELS": {
+      "CONVERSATION": "Conversation",
+      "CONTACT": "Contact"
+    },
+    "ATTRIBUTE_TYPES": {
+      "TEXT": "Text",
+      "NUMBER": "Number",
+      "LINK": "Link",
+      "DATE": "Date",
+      "LIST": "List",
+      "CHECKBOX": "Checkbox"
+    },
     "ADD": {
       "TITLE": "Add Custom Attribute",
       "SUBMIT": "Create",
diff --git a/app/javascript/dashboard/i18n/locale/en/automation.json b/app/javascript/dashboard/i18n/locale/en/automation.json
index c5dd4a514..cb030332f 100644
--- a/app/javascript/dashboard/i18n/locale/en/automation.json
+++ b/app/javascript/dashboard/i18n/locale/en/automation.json
@@ -150,6 +150,17 @@
       "ADD_SLA": "Add SLA",
       "OPEN_CONVERSATION": "Open conversation"
     },
+    "MESSAGE_TYPES": {
+      "INCOMING": "Incoming Message",
+      "OUTGOING": "Outgoing Message"
+    },
+    "PRIORITY_TYPES": {
+      "NONE": "None",
+      "LOW": "Low",
+      "MEDIUM": "Medium",
+      "HIGH": "High",
+      "URGENT": "Urgent"
+    },
     "ATTRIBUTES": {
       "MESSAGE_TYPE": "Message Type",
       "MESSAGE_CONTAINS": "Message Contains",
diff --git a/app/javascript/dashboard/i18n/locale/en/generalSettings.json b/app/javascript/dashboard/i18n/locale/en/generalSettings.json
index 9055574c5..d924bffbd 100644
--- a/app/javascript/dashboard/i18n/locale/en/generalSettings.json
+++ b/app/javascript/dashboard/i18n/locale/en/generalSettings.json
@@ -134,6 +134,7 @@
     "MULTISELECT": {
       "ENTER_TO_SELECT": "Press enter to select",
       "ENTER_TO_REMOVE": "Press enter to remove",
+      "NO_OPTIONS": "List is empty",
       "SELECT_ONE": "Select one",
       "SELECT": "Select"
     }
diff --git a/app/javascript/dashboard/i18n/locale/en/macros.json b/app/javascript/dashboard/i18n/locale/en/macros.json
index d22744190..fcb409f34 100644
--- a/app/javascript/dashboard/i18n/locale/en/macros.json
+++ b/app/javascript/dashboard/i18n/locale/en/macros.json
@@ -99,6 +99,13 @@
       "CHANGE_PRIORITY": "Change Priority",
       "ADD_PRIVATE_NOTE": "Add a Private Note",
       "SEND_WEBHOOK_EVENT": "Send Webhook Event"
+    },
+    "PRIORITY_TYPES": {
+      "NONE": "None",
+      "LOW": "Low",
+      "MEDIUM": "Medium",
+      "HIGH": "High",
+      "URGENT": "Urgent"
     }
   }
 }
diff --git a/app/javascript/dashboard/routes/dashboard/settings/attributes/AddAttribute.vue b/app/javascript/dashboard/routes/dashboard/settings/attributes/AddAttribute.vue
index c0b388ce1..006d5cdaf 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/attributes/AddAttribute.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/attributes/AddAttribute.vue
@@ -40,8 +40,6 @@ export default {
       regexPattern: null,
       regexCue: null,
       regexEnabled: false,
-      models: ATTRIBUTE_MODELS,
-      types: ATTRIBUTE_TYPES,
       values: [],
       options: [],
       show: true,
@@ -53,6 +51,18 @@ export default {
     ...mapGetters({
       uiFlags: 'getUIFlags',
     }),
+    models() {
+      return ATTRIBUTE_MODELS.map(item => ({
+        ...item,
+        option: this.$t(`ATTRIBUTES_MGMT.ATTRIBUTE_MODELS.${item.key}`),
+      }));
+    },
+    types() {
+      return ATTRIBUTE_TYPES.map(item => ({
+        ...item,
+        option: this.$t(`ATTRIBUTES_MGMT.ATTRIBUTE_TYPES.${item.key}`),
+      }));
+    },
     isMultiselectInvalid() {
       return this.isTouched && this.values.length === 0;
     },
diff --git a/app/javascript/dashboard/routes/dashboard/settings/attributes/CustomAttribute.vue b/app/javascript/dashboard/routes/dashboard/settings/attributes/CustomAttribute.vue
index 420edafce..db9c2dacf 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/attributes/CustomAttribute.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/attributes/CustomAttribute.vue
@@ -113,7 +113,11 @@ const tableHeaders = computed(() => {
           <td
             class="py-4 ltr:pr-4 rtl:pl-4 overflow-hidden whitespace-nowrap text-ellipsis"
           >
-            {{ attribute.attribute_display_type }}
+            {{
+              $t(
+                `ATTRIBUTES_MGMT.ATTRIBUTE_TYPES.${attribute.attribute_display_type?.toUpperCase()}`
+              )
+            }}
           </td>
           <td
             class="py-4 ltr:pr-4 rtl:pl-4 attribute-key overflow-hidden whitespace-nowrap text-ellipsis"
diff --git a/app/javascript/dashboard/routes/dashboard/settings/attributes/EditAttribute.vue b/app/javascript/dashboard/routes/dashboard/settings/attributes/EditAttribute.vue
index 712d65588..a25be5b8b 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/attributes/EditAttribute.vue
+++ b/app/javascript/dashboard/routes/dashboard/settings/attributes/EditAttribute.vue
@@ -32,7 +32,6 @@ export default {
       regexPattern: null,
       regexCue: null,
       regexEnabled: false,
-      types: ATTRIBUTE_TYPES,
       show: true,
       attributeKey: '',
       values: [],
@@ -59,6 +58,12 @@ export default {
     },
   },
   computed: {
+    types() {
+      return ATTRIBUTE_TYPES.map(item => ({
+        ...item,
+        option: this.$t(`ATTRIBUTES_MGMT.ATTRIBUTE_TYPES.${item.key}`),
+      }));
+    },
     setAttributeListValue() {
       return this.selectedAttribute.attribute_values.map(values => ({
         name: values,
@@ -84,9 +89,9 @@ export default {
     selectedAttributeType() {
       return this.types.find(
         item =>
-          item.option.toLowerCase() ===
+          item.key.toLowerCase() ===
           this.selectedAttribute.attribute_display_type
-      ).id;
+      )?.id;
     },
     keyErrorMessage() {
       if (!this.v$.attributeKey.isKey) {
diff --git a/app/javascript/dashboard/routes/dashboard/settings/attributes/constants.js b/app/javascript/dashboard/routes/dashboard/settings/attributes/constants.js
index 9aa36dec1..619ce7718 100644
--- a/app/javascript/dashboard/routes/dashboard/settings/attributes/constants.js
+++ b/app/javascript/dashboard/routes/dashboard/settings/attributes/constants.js
@@ -1,37 +1,13 @@
 export const ATTRIBUTE_MODELS = [
-  {
-    id: 0,
-    option: 'Conversation',
-  },
-  {
-    id: 1,
-    option: 'Contact',
-  },
+  { id: 0, key: 'CONVERSATION' },
+  { id: 1, key: 'CONTACT' },
 ];
 
 export const ATTRIBUTE_TYPES = [
-  {
-    id: 0,
-    option: 'Text',
-  },
-  {
-    id: 1,
-    option: 'Number',
-  },
-  {
-    id: 4,
-    option: 'Link',
-  },
-  {
-    id: 5,
-    option: 'Date',
-  },
-  {
-    id: 6,
-    option: 'List',
-  },
-  {
-    id: 7,
-    option: 'Checkbox',
-  },
+  { id: 0, key: 'TEXT' },
+  { id: 1, key: 'NUMBER' },
+  { id: 4, key: 'LINK' },
+  { id: 5, key: 'DATE' },
+  { id: 6, key: 'LIST' },
+  { id: 7, key: 'CHECKBOX' },
 ];

From 8c78573d9dd2c8c95dd9e54329edead85d62de43 Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Tue, 8 Jul 2025 15:31:33 +0530
Subject: [PATCH 29/31] chore: Remove `defer` attribute from widget-loader
 script (#11887)

---
 .../dashboard/helper/specs/fixtures/automationFixtures.js       | 2 +-
 app/models/channel/web_widget.rb                                | 1 -
 app/views/super_admin/application/_javascript.html.erb          | 1 -
 app/views/widget_tests/index.html.erb                           | 1 -
 4 files changed, 1 insertion(+), 4 deletions(-)

diff --git a/app/javascript/dashboard/helper/specs/fixtures/automationFixtures.js b/app/javascript/dashboard/helper/specs/fixtures/automationFixtures.js
index e8f1b3ad9..cd55a5668 100644
--- a/app/javascript/dashboard/helper/specs/fixtures/automationFixtures.js
+++ b/app/javascript/dashboard/helper/specs/fixtures/automationFixtures.js
@@ -473,7 +473,7 @@ export const inboxes = [
     welcome_title: '',
     welcome_tagline: '',
     web_widget_script:
-      '\n    <script>\n      (function(d,t) {\n        var BASE_URL="http://localhost:3000";\n        var g=d.createElement(t),s=d.getElementsByTagName(t)[0];\n        g.src=BASE_URL+"/packs/js/sdk.js";\n        g.defer = true;\n        g.async = true;\n        s.parentNode.insertBefore(g,s);\n        g.onload=function(){\n          window.chatwootSDK.run({\n            websiteToken: \'yZ7USzaEs7hrwUAHLGwjbxJ1\',\n            baseUrl: BASE_URL\n          })\n        }\n      })(document,"script");\n    </script>\n    ',
+      '\n    <script>\n      (function(d,t) {\n        var BASE_URL="http://localhost:3000";\n        var g=d.createElement(t),s=d.getElementsByTagName(t)[0];\n        g.src=BASE_URL+"/packs/js/sdk.js";\n        g.async = true;\n        s.parentNode.insertBefore(g,s);\n        g.onload=function(){\n          window.chatwootSDK.run({\n            websiteToken: \'yZ7USzaEs7hrwUAHLGwjbxJ1\',\n            baseUrl: BASE_URL\n          })\n        }\n      })(document,"script");\n    </script>\n    ',
     website_token: 'yZ7USzaEs7hrwUAHLGwjbxJ1',
     selected_feature_flags: ['attachments', 'emoji_picker', 'end_conversation'],
     reply_time: 'in_a_few_minutes',
diff --git a/app/models/channel/web_widget.rb b/app/models/channel/web_widget.rb
index faa1126f3..9e3016eac 100644
--- a/app/models/channel/web_widget.rb
+++ b/app/models/channel/web_widget.rb
@@ -66,7 +66,6 @@ class Channel::WebWidget < ApplicationRecord
         var BASE_URL=\"#{ENV.fetch('FRONTEND_URL', '')}\";
         var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
         g.src=BASE_URL+\"/packs/js/sdk.js\";
-        g.defer = true;
         g.async = true;
         s.parentNode.insertBefore(g,s);
         g.onload=function(){
diff --git a/app/views/super_admin/application/_javascript.html.erb b/app/views/super_admin/application/_javascript.html.erb
index a179991ca..d11bc2c97 100644
--- a/app/views/super_admin/application/_javascript.html.erb
+++ b/app/views/super_admin/application/_javascript.html.erb
@@ -29,7 +29,6 @@ window.chatwootSettings = {
   var BASE_URL = '';
   var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
   g.src= BASE_URL + "/packs/js/sdk.js";
-  g.defer = true;
   g.async = true;
   s.parentNode.insertBefore(g,s);
   g.onload=function(){
diff --git a/app/views/widget_tests/index.html.erb b/app/views/widget_tests/index.html.erb
index 2809b6944..f08fe0d14 100644
--- a/app/views/widget_tests/index.html.erb
+++ b/app/views/widget_tests/index.html.erb
@@ -30,7 +30,6 @@ window.chatwootSettings = {
   var BASE_URL = '';
   var g=d.createElement(t),s=d.getElementsByTagName(t)[0];
   g.src= BASE_URL + "/packs/js/sdk.js";
-  g.defer = true;
   g.async = true;
   s.parentNode.insertBefore(g,s);
   g.onload=function(){

From 5ebe8c71ec760b9a26a80cf51a7429a5b7357483 Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Wed, 9 Jul 2025 02:56:00 +0530
Subject: [PATCH 30/31] feat:  Support customizable welcome text, availability
 messages, and UI toggles (#11891)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

# Pull Request Template

## Description

This PR allows users to dynamically pass custom welcome and availability
messages, along with UI feature toggles, via `window.chatwootSettings`.
If any of the following settings are provided, the widget will use them;
otherwise, it falls back to default behavior.

**New options:**
```
window.chatwootSettings = {
  welcomeTitle: 'Need help?',                        // Custom widget title
  welcomeDescription: 'We’re here to support you.',        // Subtitle in the header
  availableMessage: 'We’re online and ready to chat!', // Shown when team is online
  unavailableMessage: 'We’re currently offline.',      // Shown when team is unavailable

  enableFileUpload: true,          // Enable file attachments
  enableEmojiPicker: true,         // Enable emoji picker in chat input
  enableEndConversation: true     // Allow users to end the conversation
}
```


Fixes
https://linear.app/chatwoot/issue/CW-4589/add-options-to-windowchatwootsettings

## Type of change

- [x] New feature (non-breaking change which adds functionality)

## How Has This Been Tested?

### Loom video

https://www.loom.com/share/413fc4aa59384366b071450bd19d1bf8?sid=ff30fb4c-267c-4beb-80ab-d6f583aa960d

## Checklist:

- [x] My code follows the style guidelines of this project
- [x] I have performed a self-review of my code
- [ ] I have commented on my code, particularly in hard-to-understand
areas
- [ ] I have made corresponding changes to the documentation
- [x] My changes generate no new warnings
- [ ] I have added tests that prove my fix is effective or that my
feature works
- [x] New and existing unit tests pass locally with my changes
- [ ] Any dependent changes have been merged and published in downstream
modules

---------

Co-authored-by: Muhsin Keloth <muhsinkeramam@gmail.com>
---
 app/javascript/entrypoints/sdk.js             |  7 ++++
 app/javascript/sdk/IFrameHelper.js            |  7 ++++
 .../widget/components/ChatAttachment.vue      |  8 +++-
 .../widget/components/ChatHeaderExpanded.vue  |  4 +-
 .../widget/components/ChatInputWrap.vue       | 12 ++++--
 .../widget/components/HeaderActions.vue       |  2 +
 .../widget/components/TeamAvailability.vue    | 15 ++++---
 .../components/layouts/ViewWithHeader.vue     |  6 ++-
 .../widget/store/modules/appConfig.js         | 35 ++++++++++++++++
 .../modules/specs/appConfig/getters.spec.js   | 42 +++++++++++++++++++
 10 files changed, 124 insertions(+), 14 deletions(-)

diff --git a/app/javascript/entrypoints/sdk.js b/app/javascript/entrypoints/sdk.js
index a2cf297f1..2a919f42c 100755
--- a/app/javascript/entrypoints/sdk.js
+++ b/app/javascript/entrypoints/sdk.js
@@ -72,6 +72,13 @@ const runSDK = ({ baseUrl, websiteToken }) => {
     widgetStyle: getWidgetStyle(chatwootSettings.widgetStyle) || 'standard',
     resetTriggered: false,
     darkMode: getDarkMode(chatwootSettings.darkMode),
+    welcomeTitle: chatwootSettings.welcomeTitle || '',
+    welcomeDescription: chatwootSettings.welcomeDescription || '',
+    availableMessage: chatwootSettings.availableMessage || '',
+    unavailableMessage: chatwootSettings.unavailableMessage || '',
+    enableFileUpload: chatwootSettings.enableFileUpload ?? true,
+    enableEmojiPicker: chatwootSettings.enableEmojiPicker ?? true,
+    enableEndConversation: chatwootSettings.enableEndConversation ?? true,
 
     toggle(state) {
       IFrameHelper.events.toggleBubble(state);
diff --git a/app/javascript/sdk/IFrameHelper.js b/app/javascript/sdk/IFrameHelper.js
index 469fbe8de..3ab1ba1f5 100644
--- a/app/javascript/sdk/IFrameHelper.js
+++ b/app/javascript/sdk/IFrameHelper.js
@@ -166,6 +166,13 @@ export const IFrameHelper = {
         darkMode: window.$chatwoot.darkMode,
         showUnreadMessagesDialog: window.$chatwoot.showUnreadMessagesDialog,
         campaignsSnoozedTill,
+        welcomeTitle: window.$chatwoot.welcomeTitle,
+        welcomeDescription: window.$chatwoot.welcomeDescription,
+        availableMessage: window.$chatwoot.availableMessage,
+        unavailableMessage: window.$chatwoot.unavailableMessage,
+        enableFileUpload: window.$chatwoot.enableFileUpload,
+        enableEmojiPicker: window.$chatwoot.enableEmojiPicker,
+        enableEndConversation: window.$chatwoot.enableEndConversation,
       });
       IFrameHelper.onLoad({
         widgetColor: message.config.channelConfig.widgetColor,
diff --git a/app/javascript/widget/components/ChatAttachment.vue b/app/javascript/widget/components/ChatAttachment.vue
index ac5a54127..64a20bcc7 100755
--- a/app/javascript/widget/components/ChatAttachment.vue
+++ b/app/javascript/widget/components/ChatAttachment.vue
@@ -24,7 +24,10 @@ export default {
     return { isUploading: false };
   },
   computed: {
-    ...mapGetters({ globalConfig: 'globalConfig/get' }),
+    ...mapGetters({
+      globalConfig: 'globalConfig/get',
+      shouldShowFilePicker: 'appConfig/getShouldShowFilePicker',
+    }),
     fileUploadSizeLimit() {
       return MAXIMUM_FILE_UPLOAD_SIZE;
     },
@@ -40,6 +43,9 @@ export default {
   },
   methods: {
     handleClipboardPaste(e) {
+      // If file picker is not enabled, do not allow paste
+      if (!this.shouldShowFilePicker) return;
+
       const items = (e.clipboardData || e.originalEvent.clipboardData).items;
       // items is a DataTransferItemList object which does not have forEach method
       const itemsArray = Array.from(items);
diff --git a/app/javascript/widget/components/ChatHeaderExpanded.vue b/app/javascript/widget/components/ChatHeaderExpanded.vue
index 6d8ac4a96..e89b1aef0 100755
--- a/app/javascript/widget/components/ChatHeaderExpanded.vue
+++ b/app/javascript/widget/components/ChatHeaderExpanded.vue
@@ -47,11 +47,11 @@ const containerClasses = computed(() => [
     </div>
     <h2
       v-dompurify-html="introHeading"
-      class="mt-4 text-2xl mb-1.5 font-medium text-n-slate-12"
+      class="mt-4 text-2xl mb-1.5 font-medium text-n-slate-12 line-clamp-4"
     />
     <p
       v-dompurify-html="formatMessage(introBody)"
-      class="text-lg leading-normal text-n-slate-11 [&_a]:underline"
+      class="text-lg leading-normal text-n-slate-11 [&_a]:underline line-clamp-6"
     />
   </header>
 </template>
diff --git a/app/javascript/widget/components/ChatInputWrap.vue b/app/javascript/widget/components/ChatInputWrap.vue
index 64997eed8..c423ab220 100755
--- a/app/javascript/widget/components/ChatInputWrap.vue
+++ b/app/javascript/widget/components/ChatInputWrap.vue
@@ -41,9 +41,15 @@ export default {
     ...mapGetters({
       widgetColor: 'appConfig/getWidgetColor',
       isWidgetOpen: 'appConfig/getIsWidgetOpen',
+      shouldShowFilePicker: 'appConfig/getShouldShowFilePicker',
+      shouldShowEmojiPicker: 'appConfig/getShouldShowEmojiPicker',
     }),
     showAttachment() {
-      return this.hasAttachmentsEnabled && this.userInput.length === 0;
+      return (
+        this.shouldShowFilePicker &&
+        this.hasAttachmentsEnabled &&
+        this.userInput.length === 0
+      );
     },
     showSendButton() {
       return this.userInput.length > 0;
@@ -143,7 +149,7 @@ export default {
         :on-attach="onSendAttachment"
       />
       <button
-        v-if="hasEmojiPickerEnabled"
+        v-if="shouldShowEmojiPicker && hasEmojiPickerEnabled"
         class="flex items-center justify-center min-h-8 min-w-8"
         :aria-label="$t('EMOJI.ARIA_LABEL')"
         @click="toggleEmojiPicker"
@@ -158,7 +164,7 @@ export default {
         />
       </button>
       <EmojiInput
-        v-if="showEmojiPicker"
+        v-if="shouldShowEmojiPicker && showEmojiPicker"
         v-on-clickaway="hideEmojiPicker"
         :on-click="emojiOnClick"
         @keydown.esc="hideEmojiPicker"
diff --git a/app/javascript/widget/components/HeaderActions.vue b/app/javascript/widget/components/HeaderActions.vue
index df9dc64bf..f29cad82d 100644
--- a/app/javascript/widget/components/HeaderActions.vue
+++ b/app/javascript/widget/components/HeaderActions.vue
@@ -23,6 +23,7 @@ export default {
   computed: {
     ...mapGetters({
       conversationAttributes: 'conversationAttributes/getConversationParams',
+      canUserEndConversation: 'appConfig/getCanUserEndConversation',
     }),
     canLeaveConversation() {
       return [
@@ -82,6 +83,7 @@ export default {
     <button
       v-if="
         canLeaveConversation &&
+        canUserEndConversation &&
         hasEndConversationEnabled &&
         showEndConversationButton
       "
diff --git a/app/javascript/widget/components/TeamAvailability.vue b/app/javascript/widget/components/TeamAvailability.vue
index cdc50ed12..866854c09 100644
--- a/app/javascript/widget/components/TeamAvailability.vue
+++ b/app/javascript/widget/components/TeamAvailability.vue
@@ -29,6 +29,8 @@ export default {
   computed: {
     ...mapGetters({
       widgetColor: 'appConfig/getWidgetColor',
+      availableMessage: 'appConfig/getAvailableMessage',
+      unavailableMessage: 'appConfig/getUnavailableMessage',
     }),
     textColor() {
       return getContrastingTextColor(this.widgetColor);
@@ -40,6 +42,11 @@ export default {
         id: agent.id,
       }));
     },
+    headerMessage() {
+      return this.isOnline
+        ? this.availableMessage || this.$t('TEAM_AVAILABILITY.ONLINE')
+        : this.unavailableMessage || this.$t('TEAM_AVAILABILITY.OFFLINE');
+    },
     isOnline() {
       const { workingHoursEnabled } = this.channelConfig;
       const anyAgentOnline = this.availableAgents.length > 0;
@@ -71,12 +78,8 @@ export default {
   >
     <div class="flex items-center justify-between gap-2">
       <div class="flex flex-col gap-1">
-        <div class="font-medium text-n-slate-12">
-          {{
-            isOnline
-              ? $t('TEAM_AVAILABILITY.ONLINE')
-              : $t('TEAM_AVAILABILITY.OFFLINE')
-          }}
+        <div class="font-medium text-n-slate-12 line-clamp-2">
+          {{ headerMessage }}
         </div>
         <div class="text-n-slate-11">
           {{ replyWaitMessage }}
diff --git a/app/javascript/widget/components/layouts/ViewWithHeader.vue b/app/javascript/widget/components/layouts/ViewWithHeader.vue
index 1b1e1e2fd..70eaf783b 100644
--- a/app/javascript/widget/components/layouts/ViewWithHeader.vue
+++ b/app/javascript/widget/components/layouts/ViewWithHeader.vue
@@ -119,8 +119,10 @@ export default {
       >
         <ChatHeaderExpanded
           v-if="!isHeaderCollapsed"
-          :intro-heading="channelConfig.welcomeTitle"
-          :intro-body="channelConfig.welcomeTagline"
+          :intro-heading="appConfig.welcomeTitle || channelConfig.welcomeTitle"
+          :intro-body="
+            appConfig.welcomeDescription || channelConfig.welcomeTagline
+          "
           :avatar-url="channelConfig.avatarUrl"
           :show-popout-button="appConfig.showPopoutButton"
         />
diff --git a/app/javascript/widget/store/modules/appConfig.js b/app/javascript/widget/store/modules/appConfig.js
index 44a13c4c4..3ad5078b8 100644
--- a/app/javascript/widget/store/modules/appConfig.js
+++ b/app/javascript/widget/store/modules/appConfig.js
@@ -21,6 +21,13 @@ const state = {
   widgetStyle: 'standard',
   darkMode: 'light',
   isUpdatingRoute: false,
+  welcomeTitle: '',
+  welcomeDescription: '',
+  availableMessage: '',
+  unavailableMessage: '',
+  enableFileUpload: true,
+  enableEmojiPicker: true,
+  enableEndConversation: true,
 };
 
 export const getters = {
@@ -34,6 +41,13 @@ export const getters = {
   darkMode: $state => $state.darkMode,
   getShowUnreadMessagesDialog: $state => $state.showUnreadMessagesDialog,
   getIsUpdatingRoute: _state => _state.isUpdatingRoute,
+  getWelcomeHeading: $state => $state.welcomeTitle,
+  getWelcomeTagline: $state => $state.welcomeDescription,
+  getAvailableMessage: $state => $state.availableMessage,
+  getUnavailableMessage: $state => $state.unavailableMessage,
+  getShouldShowFilePicker: $state => $state.enableFileUpload,
+  getShouldShowEmojiPicker: $state => $state.enableEmojiPicker,
+  getCanUserEndConversation: $state => $state.enableEndConversation,
 };
 
 export const actions = {
@@ -46,6 +60,13 @@ export const actions = {
       showUnreadMessagesDialog,
       widgetStyle = 'rounded',
       darkMode = 'light',
+      welcomeTitle = '',
+      welcomeDescription = '',
+      availableMessage = '',
+      unavailableMessage = '',
+      enableFileUpload = true,
+      enableEmojiPicker = true,
+      enableEndConversation = true,
     }
   ) {
     commit(SET_WIDGET_APP_CONFIG, {
@@ -55,6 +76,13 @@ export const actions = {
       showUnreadMessagesDialog: !!showUnreadMessagesDialog,
       widgetStyle,
       darkMode,
+      welcomeTitle,
+      welcomeDescription,
+      availableMessage,
+      unavailableMessage,
+      enableFileUpload,
+      enableEmojiPicker,
+      enableEndConversation,
     });
   },
   toggleWidgetOpen({ commit }, isWidgetOpen) {
@@ -90,6 +118,13 @@ export const mutations = {
     $state.darkMode = data.darkMode;
     $state.locale = data.locale || $state.locale;
     $state.showUnreadMessagesDialog = data.showUnreadMessagesDialog;
+    $state.welcomeTitle = data.welcomeTitle;
+    $state.welcomeDescription = data.welcomeDescription;
+    $state.availableMessage = data.availableMessage;
+    $state.unavailableMessage = data.unavailableMessage;
+    $state.enableFileUpload = data.enableFileUpload;
+    $state.enableEmojiPicker = data.enableEmojiPicker;
+    $state.enableEndConversation = data.enableEndConversation;
   },
   [TOGGLE_WIDGET_OPEN]($state, isWidgetOpen) {
     $state.isWidgetOpen = isWidgetOpen;
diff --git a/app/javascript/widget/store/modules/specs/appConfig/getters.spec.js b/app/javascript/widget/store/modules/specs/appConfig/getters.spec.js
index 5d3db77bc..a6020cb84 100644
--- a/app/javascript/widget/store/modules/specs/appConfig/getters.spec.js
+++ b/app/javascript/widget/store/modules/specs/appConfig/getters.spec.js
@@ -19,6 +19,48 @@ describe('#getters', () => {
       expect(getters.getShowUnreadMessagesDialog(state)).toEqual(true);
     });
   });
+  describe('#getAvailableMessage', () => {
+    it('returns correct value', () => {
+      const state = { availableMessage: 'We reply quickly' };
+      expect(getters.getAvailableMessage(state)).toEqual('We reply quickly');
+    });
+  });
+  describe('#getWelcomeHeading', () => {
+    it('returns correct value', () => {
+      const state = { welcomeTitle: 'Hello!' };
+      expect(getters.getWelcomeHeading(state)).toEqual('Hello!');
+    });
+  });
+  describe('#getWelcomeTagline', () => {
+    it('returns correct value', () => {
+      const state = { welcomeDescription: 'Welcome to our site' };
+      expect(getters.getWelcomeTagline(state)).toEqual('Welcome to our site');
+    });
+  });
+  describe('#getShouldShowFilePicker', () => {
+    it('returns correct value', () => {
+      const state = { enableFileUpload: true };
+      expect(getters.getShouldShowFilePicker(state)).toEqual(true);
+    });
+  });
+  describe('#getShouldShowEmojiPicker', () => {
+    it('returns correct value', () => {
+      const state = { enableEmojiPicker: true };
+      expect(getters.getShouldShowEmojiPicker(state)).toEqual(true);
+    });
+  });
+  describe('#getCanUserEndConversation', () => {
+    it('returns correct value', () => {
+      const state = { enableEndConversation: true };
+      expect(getters.getCanUserEndConversation(state)).toEqual(true);
+    });
+  });
+  describe('#getUnavailableMessage', () => {
+    it('returns correct value', () => {
+      const state = { unavailableMessage: 'We are offline' };
+      expect(getters.getUnavailableMessage(state)).toEqual('We are offline');
+    });
+  });
   describe('#getIsUpdatingRoute', () => {
     it('returns correct value', () => {
       const state = { isUpdatingRoute: true };

From 3e5ca9bca95df2c7ea5d1dc86e04f8a79724281f Mon Sep 17 00:00:00 2001
From: Sivin Varghese <64252451+iamsivin@users.noreply.github.com>
Date: Wed, 9 Jul 2025 09:23:20 +0530
Subject: [PATCH 31/31] fix: Widget message input resize issue (#11896)

---
 app/javascript/shared/components/ResizableTextArea.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/app/javascript/shared/components/ResizableTextArea.vue b/app/javascript/shared/components/ResizableTextArea.vue
index 088753a23..4dda62cf9 100644
--- a/app/javascript/shared/components/ResizableTextArea.vue
+++ b/app/javascript/shared/components/ResizableTextArea.vue
@@ -69,7 +69,7 @@ export default {
     },
   },
   watch: {
-    value() {
+    modelValue() {
       this.resizeTextarea();
       // 🚨 watch triggers every time the value is changed, we cannot set this to focus then
       // when this runs, it sets the cursor to the end of the body, ignoring the signature