From db3e02760eb5f14487360cc46e0fa5a3371e721c Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Wed, 13 May 2026 23:29:47 +0200
Subject: [PATCH 001/178] feat(contact): add insert-contact-manual SQL query

---
 internal/user/queries.sql | 5 +++++
 1 file changed, 5 insertions(+)

diff --git a/internal/user/queries.sql b/internal/user/queries.sql
index 67a04774..872b07da 100644
--- a/internal/user/queries.sql
+++ b/internal/user/queries.sql
@@ -209,6 +209,11 @@ UPDATE users
 SET enabled = $3, updated_at = NOW()
 WHERE id = $1 AND type = $2;
 
+-- name: insert-contact-manual
+INSERT INTO users (email, type, first_name, last_name, password, avatar_url, phone_number, phone_number_country_code, country, custom_attributes)
+VALUES ($1, 'contact', $2, $3, $4, $5, $6, $7, $8, '{}')
+RETURNING id;
+
 -- name: update-contact
 UPDATE users
 SET first_name = COALESCE($2, first_name),

From 7e9158684787aaa95967c3074ba71398b364b7d8 Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Wed, 13 May 2026 23:34:22 +0200
Subject: [PATCH 002/178] feat(contact): register InsertContactManual prepared
 statement

---
 internal/user/user.go | 1 +
 1 file changed, 1 insertion(+)

diff --git a/internal/user/user.go b/internal/user/user.go
index a863e56e..f54d9841 100644
--- a/internal/user/user.go
+++ b/internal/user/user.go
@@ -85,6 +85,7 @@ type queries struct {
 	InsertAgent                   *sqlx.Stmt `query:"insert-agent"`
 	InsertContactWithExtID        *sqlx.Stmt `query:"insert-contact-with-external-id"`
 	InsertContactNoExtID          *sqlx.Stmt `query:"insert-contact-without-external-id"`
+	InsertContactManual           *sqlx.Stmt `query:"insert-contact-manual"`
 	GetContactByEmail             *sqlx.Stmt `query:"get-contact-by-email"`
 	GetContactByEmailWithoutExtID *sqlx.Stmt `query:"get-contact-by-email-without-ext-id"`
 	IsEmailBlocked                *sqlx.Stmt `query:"is-email-blocked"`

From 8c82704558710d57328a50addf3ae217508f3d32 Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Wed, 13 May 2026 23:39:11 +0200
Subject: [PATCH 003/178] feat(contact): add CreateManualContact method

---
 internal/user/contact.go | 24 ++++++++++++++++++++++++
 1 file changed, 24 insertions(+)

diff --git a/internal/user/contact.go b/internal/user/contact.go
index ed992042..ae8f2b15 100644
--- a/internal/user/contact.go
+++ b/internal/user/contact.go
@@ -10,6 +10,30 @@ import (
 	"github.com/volatiletech/null/v9"
 )
 
+// CreateManualContact creates a new contact with all optional fields from the management UI.
+func (u *Manager) CreateManualContact(user *models.User) error {
+	password, err := u.generatePassword()
+	if err != nil {
+		u.lo.Error("generating password", "error", err)
+		return fmt.Errorf("generating password: %w", err)
+	}
+
+	// Normalize email.
+	user.Email = null.NewString(strings.ToLower(strings.TrimSpace(user.Email.String)), user.Email.Valid)
+
+	if err := u.q.InsertContactManual.QueryRow(
+		user.Email, user.FirstName, user.LastName, password, user.AvatarURL,
+		user.PhoneNumber, user.PhoneNumberCountryCode, user.Country,
+	).Scan(&user.ID); err != nil {
+		if dbutil.IsUniqueViolationError(err) {
+			return envelope.NewError(envelope.InputError, u.i18n.T("contact.alreadyExistsWithEmail"), nil)
+		}
+		u.lo.Error("error creating manual contact", "error", err)
+		return envelope.NewError(envelope.GeneralError, u.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return nil
+}
+
 func (u *Manager) CreateContact(user *models.User) error {
 	password, err := u.generatePassword()
 	if err != nil {

From 9bc84b22343e8ed00ea67dfca723ddb638cfd8e5 Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Wed, 13 May 2026 23:45:33 +0200
Subject: [PATCH 004/178] feat(contact): add handleCreateContact handler

---
 cmd/contacts.go | 84 +++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 84 insertions(+)

diff --git a/cmd/contacts.go b/cmd/contacts.go
index 4a2c237e..8ace81c2 100644
--- a/cmd/contacts.go
+++ b/cmd/contacts.go
@@ -22,6 +22,90 @@ type blockContactReq struct {
 	Enabled bool `json:"enabled"`
 }
 
+// handleCreateContact creates a new contact.
+func handleCreateContact(r *fastglue.Request) error {
+	var app = r.Context.(*App)
+
+	form, err := r.RequestCtx.MultipartForm()
+	if err != nil {
+		app.lo.Error("error parsing form data", "error", err)
+		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, app.i18n.T("errors.parsingRequest"), nil, envelope.GeneralError)
+	}
+
+	firstName := ""
+	if v, ok := form.Value["first_name"]; ok && len(v) > 0 {
+		firstName = string(v[0])
+	}
+	lastName := ""
+	if v, ok := form.Value["last_name"]; ok && len(v) > 0 {
+		lastName = string(v[0])
+	}
+	email := ""
+	if v, ok := form.Value["email"]; ok && len(v) > 0 {
+		email = strings.TrimSpace(string(v[0]))
+	}
+	phoneNumber := ""
+	if v, ok := form.Value["phone_number"]; ok && len(v) > 0 {
+		phoneNumber = string(v[0])
+	}
+	phoneNumberCountryCode := ""
+	if v, ok := form.Value["phone_number_country_code"]; ok && len(v) > 0 {
+		phoneNumberCountryCode = string(v[0])
+	}
+	country := ""
+	if v, ok := form.Value["country"]; ok && len(v) > 0 {
+		country = string(v[0])
+	}
+
+	// Nullify "null" strings.
+	if phoneNumberCountryCode == "null" {
+		phoneNumberCountryCode = ""
+	}
+	if phoneNumber == "null" {
+		phoneNumber = ""
+	}
+	if country == "null" {
+		country = ""
+	}
+
+	// Validate email format if provided.
+	if email != "" && !stringutil.ValidEmail(email) {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("validation.invalidEmail"), nil, envelope.InputError)
+	}
+
+	contact := models.User{
+		FirstName:              firstName,
+		LastName:               lastName,
+		Email:                  null.NewString(email, email != ""),
+		PhoneNumber:            null.NewString(phoneNumber, phoneNumber != ""),
+		PhoneNumberCountryCode: null.NewString(phoneNumberCountryCode, phoneNumberCountryCode != ""),
+		Country:                null.NewString(country, country != ""),
+	}
+
+	if err := app.user.CreateManualContact(&contact); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	createdContact, err := app.user.GetContactOrVisitor(contact.ID, "")
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	// Upload avatar if provided.
+	files, ok := form.File["files"]
+	if ok && len(files) > 0 {
+		if err := uploadUserAvatar(r, createdContact, files); err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+		createdContact, err = app.user.GetContactOrVisitor(contact.ID, "")
+		if err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+	}
+
+	return r.SendEnvelope(createdContact)
+}
+
 // handleGetContacts returns a list of contacts from the database.
 func handleGetContacts(r *fastglue.Request) error {
 	var (

From 1f59bff183e976e60b6670f5899979363bdf0b9a Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Wed, 13 May 2026 23:52:18 +0200
Subject: [PATCH 005/178] feat(contact): register POST /api/v1/contacts route

---
 cmd/handlers.go | 1 +
 1 file changed, 1 insertion(+)

diff --git a/cmd/handlers.go b/cmd/handlers.go
index 625ba272..ced42755 100644
--- a/cmd/handlers.go
+++ b/cmd/handlers.go
@@ -143,6 +143,7 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 
 	// Contacts.
 	g.GET("/api/v1/contacts", perm(handleGetContacts, "contacts:read_all"))
+	g.POST("/api/v1/contacts", perm(handleCreateContact, "contacts:write"))
 	g.GET("/api/v1/contacts/{id}", perm(handleGetContact, "contacts:read"))
 	g.PUT("/api/v1/contacts/{id}", perm(handleUpdateContact, "contacts:write"))
 	g.PUT("/api/v1/contacts/{id}/block", perm(handleBlockContact, "contacts:block"))

From 9999c1a3ab4893a0dc122e3b09970a67227a2702 Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Wed, 13 May 2026 23:57:44 +0200
Subject: [PATCH 006/178] feat(i18n): add create contact translation keys

---
 i18n/en.json | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/i18n/en.json b/i18n/en.json
index 55d3723a..35665807 100644
--- a/i18n/en.json
+++ b/i18n/en.json
@@ -451,6 +451,9 @@
   "contact.identityNotVerified": "Identity not verified",
   "contact.identityVerified": "Identity verified",
   "contact.newNote": "New note",
+  "contact.newContact": "New contact",
+  "contact.createContact": "Create contact",
+  "contact.createdSuccessfully": "Contact created successfully",
   "contact.noContactsFound": "No contacts found",
   "contact.notes.empty": "No notes yet",
   "contact.notes.help": "Add note for this contact to keep track of important information and conversations.",

From 3ed34009550ce88c8cb6dd79f68edae5d51587f5 Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Thu, 14 May 2026 00:04:09 +0200
Subject: [PATCH 007/178] feat(contact): add createContact API function

---
 frontend/apps/main/src/api/index.js | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/frontend/apps/main/src/api/index.js b/frontend/apps/main/src/api/index.js
index d8638db6..b57024c6 100644
--- a/frontend/apps/main/src/api/index.js
+++ b/frontend/apps/main/src/api/index.js
@@ -192,6 +192,12 @@ const updateRole = (id, data) =>
 const deleteRole = (id) => http.delete(`/api/v1/roles/${id}`)
 const getContacts = (params) => http.get('/api/v1/contacts', { params })
 const getContact = (id) => http.get(`/api/v1/contacts/${id}`)
+const createContact = (data) =>
+  http.post('/api/v1/contacts', data, {
+    headers: {
+      'Content-Type': 'multipart/form-data'
+    }
+  })
 const updateContact = (id, data) =>
   http.put(`/api/v1/contacts/${id}`, data, {
     headers: {
@@ -648,6 +654,7 @@ export default {
   removeAssignee,
   getContacts,
   getContact,
+  createContact,
   updateContact,
   blockContact,
   getCustomAttributes,

From 72c794f1b1d6016e923ec287ffd6a9a687ae60ed Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Thu, 14 May 2026 00:12:55 +0200
Subject: [PATCH 008/178] feat(contact): add createContactFormSchema with all
 optional fields

---
 .../main/src/features/contact/formSchema.js   | 31 +++++++++++++++++++
 1 file changed, 31 insertions(+)

diff --git a/frontend/apps/main/src/features/contact/formSchema.js b/frontend/apps/main/src/features/contact/formSchema.js
index c216b67e..8765806d 100644
--- a/frontend/apps/main/src/features/contact/formSchema.js
+++ b/frontend/apps/main/src/features/contact/formSchema.js
@@ -40,3 +40,34 @@ export const createFormSchema = (t) => z.object({
             message: t('validation.invalidEmail'),
         }),
 })
+
+export const createContactFormSchema = (t) => z.object({
+    first_name: z
+        .string()
+        .max(50, {
+            message: t('validation.minmax', { min: 0, max: 50 })
+        })
+        .optional()
+        .or(z.literal('')),
+    last_name: z
+        .string()
+        .max(50, {
+            message: t('validation.minmax', { min: 0, max: 50 })
+        })
+        .optional()
+        .or(z.literal('')),
+    email: z
+        .string()
+        .email({ message: t('validation.invalidEmail') })
+        .optional()
+        .or(z.literal('')),
+    phone_number: z
+        .string()
+        .refine(val => !val || /^\d{1,15}$/.test(val), {
+            message: t('validation.minmax', { min: 1, max: 15 })
+        })
+        .optional()
+        .or(z.literal('')),
+    phone_number_country_code: z.string().optional().nullable(),
+    country: z.string().optional().nullable(),
+})

From cc69a5b2c0655cf33811e65cddd17ee1f12d8c44 Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Thu, 14 May 2026 00:23:31 +0200
Subject: [PATCH 009/178] feat(contact): add CreateContactDialog component

---
 .../features/contact/CreateContactDialog.vue  | 251 ++++++++++++++++++
 1 file changed, 251 insertions(+)
 create mode 100644 frontend/apps/main/src/features/contact/CreateContactDialog.vue

diff --git a/frontend/apps/main/src/features/contact/CreateContactDialog.vue b/frontend/apps/main/src/features/contact/CreateContactDialog.vue
new file mode 100644
index 00000000..003adbf9
--- /dev/null
+++ b/frontend/apps/main/src/features/contact/CreateContactDialog.vue
@@ -0,0 +1,251 @@
+<template>
+  <Dialog :open="open" @update:open="$emit('update:open', $event)">
+    <DialogContent class="sm:max-w-lg">
+      <DialogHeader>
+        <DialogTitle>{{ t('contact.createContact') }}</DialogTitle>
+      </DialogHeader>
+
+      <form @submit.prevent="onSubmit" class="space-y-6 pt-2">
+        <!-- Avatar -->
+        <div class="flex justify-center">
+          <AvatarUpload
+            @upload="onAvatarUpload"
+            @remove="onAvatarRemove"
+            :src="avatarPreview"
+            :initials="initials"
+            :label="t('globals.messages.upload')"
+          />
+        </div>
+
+        <!-- First name / Last name -->
+        <div class="flex flex-wrap gap-4">
+          <div class="flex-1">
+            <FormField v-slot="{ componentField }" name="first_name">
+              <FormItem class="flex flex-col">
+                <FormLabel>{{ t('globals.terms.firstName') }}</FormLabel>
+                <FormControl><Input v-bind="componentField" type="text" /></FormControl>
+                <FormMessage />
+              </FormItem>
+            </FormField>
+          </div>
+          <div class="flex-1">
+            <FormField v-slot="{ componentField }" name="last_name">
+              <FormItem class="flex flex-col">
+                <FormLabel>{{ t('globals.terms.lastName') }}</FormLabel>
+                <FormControl><Input v-bind="componentField" type="text" /></FormControl>
+                <FormMessage />
+              </FormItem>
+            </FormField>
+          </div>
+        </div>
+
+        <!-- Email -->
+        <FormField v-slot="{ componentField }" name="email">
+          <FormItem class="flex flex-col">
+            <FormLabel>{{ t('globals.terms.email') }}</FormLabel>
+            <FormControl><Input v-bind="componentField" type="email" /></FormControl>
+            <FormMessage />
+          </FormItem>
+        </FormField>
+
+        <!-- Phone -->
+        <div class="flex flex-col">
+          <div class="flex items-end">
+            <FormField v-slot="{ componentField }" name="phone_number_country_code">
+              <FormItem class="w-max">
+                <FormLabel class="whitespace-nowrap">{{ t('globals.terms.phoneNumber') }}</FormLabel>
+                <FormControl>
+                  <ComboBox
+                    v-bind="componentField"
+                    :items="allCountries"
+                    :placeholder="t('globals.terms.select')"
+                    :buttonClass="'rounded-r-none border-r-0'"
+                  >
+                    <template #item="{ item }">
+                      <div class="flex items-center gap-2">
+                        <div class="w-7 h-7 flex items-center justify-center">
+                          <span v-if="item.emoji">{{ item.emoji }}</span>
+                        </div>
+                        <span class="text-sm">{{ item.label }} ({{ item.calling_code }})</span>
+                      </div>
+                    </template>
+                    <template #selected="{ selected }">
+                      <div class="flex items-center gap-1">
+                        <span v-if="selected" class="text-lg">{{ selected.emoji }}</span>
+                        <span v-if="selected?.calling_code" class="text-xs text-muted-foreground">({{ selected.calling_code }})</span>
+                      </div>
+                    </template>
+                  </ComboBox>
+                </FormControl>
+                <FormMessage />
+              </FormItem>
+            </FormField>
+            <div class="flex-1">
+              <FormField v-slot="{ componentField }" name="phone_number">
+                <FormItem class="relative">
+                  <FormControl>
+                    <Input type="tel" v-bind="componentField" class="rounded-l-none" inputmode="numeric" />
+                    <FormMessage class="absolute top-full mt-1 text-sm" />
+                  </FormControl>
+                </FormItem>
+              </FormField>
+            </div>
+          </div>
+        </div>
+
+        <!-- Country -->
+        <FormField v-slot="{ componentField }" name="country">
+          <FormItem class="flex flex-col">
+            <FormLabel>{{ t('globals.terms.country') }}</FormLabel>
+            <FormControl>
+              <ComboBox
+                v-bind="componentField"
+                :items="countryOptions"
+                :placeholder="t('globals.terms.select')"
+              >
+                <template #item="{ item }">
+                  <div class="flex items-center gap-2">
+                    <span v-if="item.emoji">{{ item.emoji }}</span>
+                    <span class="text-sm">{{ item.label }}</span>
+                  </div>
+                </template>
+                <template #selected="{ selected }">
+                  <div class="flex items-center gap-1">
+                    <span v-if="selected" class="text-lg">{{ selected.emoji }}</span>
+                    <span v-if="selected" class="text-sm">{{ selected.label }}</span>
+                  </div>
+                </template>
+              </ComboBox>
+            </FormControl>
+            <FormMessage />
+          </FormItem>
+        </FormField>
+
+        <div class="flex justify-end gap-2 pt-2">
+          <Button type="button" variant="outline" @click="$emit('update:open', false)">
+            {{ t('globals.messages.cancel') }}
+          </Button>
+          <Button type="submit" :isLoading="loading" :disabled="loading">
+            {{ t('contact.createContact') }}
+          </Button>
+        </div>
+      </form>
+    </DialogContent>
+  </Dialog>
+</template>
+
+<script setup>
+import { ref, computed, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useForm } from 'vee-validate'
+import { toTypedSchema } from '@vee-validate/zod'
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle
+} from '@shared-ui/components/ui/dialog'
+import {
+  FormField,
+  FormItem,
+  FormLabel,
+  FormControl,
+  FormMessage
+} from '@shared-ui/components/ui/form'
+import { Input } from '@shared-ui/components/ui/input'
+import { Button } from '@shared-ui/components/ui/button'
+import { AvatarUpload } from '@shared-ui/components/ui/avatar'
+import ComboBox from '@shared-ui/components/ui/combobox/ComboBox.vue'
+import countries from '../../constants/countries.js'
+import api from '../../api'
+import { createContactFormSchema } from './formSchema.js'
+import { useEmitter } from '../../composables/useEmitter'
+import { EMITTER_EVENTS } from '../../constants/emitterEvents'
+import { handleHTTPError } from '@shared-ui/utils/http.js'
+
+const props = defineProps({
+  open: {
+    type: Boolean,
+    default: false
+  }
+})
+
+const emit = defineEmits(['update:open', 'created'])
+
+const { t } = useI18n()
+const emitter = useEmitter()
+const loading = ref(false)
+const avatarFile = ref(null)
+const avatarPreview = ref('')
+
+const allCountries = countries.map((c) => ({
+  label: c.name,
+  value: c.iso_2,
+  emoji: c.emoji,
+  calling_code: c.calling_code
+}))
+
+const countryOptions = countries.map((c) => ({
+  label: c.name,
+  value: c.iso_2,
+  emoji: c.emoji
+}))
+
+const form = useForm({
+  validationSchema: toTypedSchema(createContactFormSchema(t))
+})
+
+const initials = computed(() => {
+  const first = form.values.first_name?.[0] || ''
+  const last = form.values.last_name?.[0] || ''
+  return `${first}${last}`.toUpperCase()
+})
+
+function onAvatarUpload(file) {
+  avatarFile.value = file
+  avatarPreview.value = URL.createObjectURL(file)
+}
+
+function onAvatarRemove() {
+  avatarFile.value = null
+  avatarPreview.value = ''
+}
+
+function resetForm() {
+  form.resetForm()
+  avatarFile.value = null
+  avatarPreview.value = ''
+}
+
+watch(() => props.open, (val) => {
+  if (!val) resetForm()
+})
+
+const onSubmit = form.handleSubmit(async (values) => {
+  loading.value = true
+  try {
+    const formData = new FormData()
+    if (values.first_name) formData.append('first_name', values.first_name)
+    if (values.last_name) formData.append('last_name', values.last_name)
+    if (values.email) formData.append('email', values.email)
+    if (values.phone_number) formData.append('phone_number', values.phone_number)
+    if (values.phone_number_country_code) formData.append('phone_number_country_code', values.phone_number_country_code)
+    if (values.country) formData.append('country', values.country)
+    if (avatarFile.value) formData.append('files', avatarFile.value)
+
+    const { data } = await api.createContact(formData)
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      description: t('contact.createdSuccessfully')
+    })
+    emit('update:open', false)
+    emit('created', data.data)
+  } catch (err) {
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(err).message
+    })
+  } finally {
+    loading.value = false
+  }
+})
+</script>

From 989adbc4823c7e3a725a92d4f9d623ade33e0ce2 Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Thu, 14 May 2026 00:38:14 +0200
Subject: [PATCH 010/178] feat(contact): add create contact button and dialog
 to contacts list

---
 .../src/features/contact/ContactsList.vue     | 28 ++++++++++++++++++-
 1 file changed, 27 insertions(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/features/contact/ContactsList.vue b/frontend/apps/main/src/features/contact/ContactsList.vue
index a5c1907a..ab0c0a12 100644
--- a/frontend/apps/main/src/features/contact/ContactsList.vue
+++ b/frontend/apps/main/src/features/contact/ContactsList.vue
@@ -42,6 +42,17 @@
             </Select>
           </PopoverContent>
         </Popover>
+
+        <!-- Create Contact Button -->
+        <Button
+          v-if="userStore.can('contacts:write')"
+          size="sm"
+          class="flex items-center h-8 gap-1"
+          @click="showCreateDialog = true"
+        >
+          <UserPlus size="16" />
+          {{ $t('contact.newContact') }}
+        </Button>
       </div>
 
       <!-- Loading State -->
@@ -104,10 +115,16 @@
       :total-pages="totalPages"
     />
   </div>
+
+  <CreateContactDialog
+    v-model:open="showCreateDialog"
+    @created="onContactCreated"
+  />
 </template>
 
 <script setup>
 import { ref, onMounted, watch } from 'vue'
+import { useRouter } from 'vue-router'
 import { Card } from '@shared-ui/components/ui/card'
 import { Skeleton } from '@shared-ui/components/ui/skeleton'
 import { Avatar, AvatarImage, AvatarFallback } from '@shared-ui/components/ui/avatar'
@@ -121,13 +138,15 @@ import {
 } from '@shared-ui/components/ui/select'
 import { Input } from '@shared-ui/components/ui/input'
 import { Button } from '@shared-ui/components/ui/button'
-import { ArrowDownWideNarrow, IdCardIcon } from 'lucide-vue-next'
+import { ArrowDownWideNarrow, IdCardIcon, UserPlus } from 'lucide-vue-next'
 import { Popover, PopoverContent, PopoverTrigger } from '@shared-ui/components/ui/popover'
 import { useDebounceFn } from '@vueuse/core'
 import { EMITTER_EVENTS } from '@main/constants/emitterEvents.js'
 import { useEmitter } from '@main/composables/useEmitter'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
 import PaginationBar from '@main/components/pagination/PaginationBar.vue'
+import CreateContactDialog from './CreateContactDialog.vue'
+import { useUserStore } from '@main/stores/user'
 import api from '@main/api'
 
 const contacts = ref([])
@@ -139,7 +158,10 @@ const searchTerm = ref('')
 const orderByField = ref('users.created_at')
 const orderByDirection = ref('desc')
 const total = ref(0)
+const showCreateDialog = ref(false)
 const emitter = useEmitter()
+const router = useRouter()
+const userStore = useUserStore()
 
 const fetchContactsDebounced = useDebounceFn(() => {
   fetchContacts()
@@ -183,6 +205,10 @@ const getInitials = (firstName, lastName) => {
   return `${firstName?.[0] || ''}${lastName?.[0] || ''}`.toUpperCase()
 }
 
+const onContactCreated = (contact) => {
+  router.push({ name: 'contact-detail', params: { id: contact.id } })
+}
+
 watch([page, perPage], fetchContacts)
 
 onMounted(() => {

From feea4c165859ee6ac76e8cb189c3ed561758f639 Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Thu, 14 May 2026 00:51:47 +0200
Subject: [PATCH 011/178] feat(contact): add new contact button and dialog to
 sidebar

---
 .../apps/main/src/components/sidebar/Sidebar.vue     | 12 +++++++++++-
 1 file changed, 11 insertions(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/components/sidebar/Sidebar.vue b/frontend/apps/main/src/components/sidebar/Sidebar.vue
index 87175362..1ac76ef9 100644
--- a/frontend/apps/main/src/components/sidebar/Sidebar.vue
+++ b/frontend/apps/main/src/components/sidebar/Sidebar.vue
@@ -52,7 +52,8 @@ import {
   Link,
   BarChart3,
   CircleUser,
-  Contact
+  Contact,
+  UserPlus
 } from 'lucide-vue-next'
 
 const navIconMap = {
@@ -102,6 +103,7 @@ import { computed, ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useUserStore } from '@main/stores/user'
 import { useConversationStore } from '@main/stores/conversation'
+import CreateContactDialog from '@main/features/contact/CreateContactDialog.vue'
 
 defineProps({
   userTeams: { type: Array, default: () => [] },
@@ -233,6 +235,7 @@ const hoveredViewId = ref(null)
 // Track delete confirmation dialog state
 const isDeleteOpen = ref(false)
 const viewToDelete = ref(null)
+const showCreateContactDialog = ref(false)
 </script>
 
 <template>
@@ -268,10 +271,17 @@ const viewToDelete = ref(null)
                   </router-link>
                 </SidebarMenuButton>
               </SidebarMenuItem>
+              <SidebarMenuItem v-if="userStore.can('contacts:write')">
+                <SidebarMenuButton @click="showCreateContactDialog = true">
+                  <UserPlus />
+                  <span>{{ t('contact.newContact') }}</span>
+                </SidebarMenuButton>
+              </SidebarMenuItem>
             </SidebarMenu>
           </SidebarGroup>
         </SidebarContent>
       </Sidebar>
+      <CreateContactDialog v-model:open="showCreateContactDialog" />
     </template>
 
     <!-- Reports sidebar -->

From 09945379be8e95f79e04c316fd44f987e0826fe3 Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Thu, 14 May 2026 01:43:48 +0200
Subject: [PATCH 012/178] fix(contact): return envelope error

---
 internal/user/contact.go | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/internal/user/contact.go b/internal/user/contact.go
index ae8f2b15..325849f9 100644
--- a/internal/user/contact.go
+++ b/internal/user/contact.go
@@ -15,7 +15,7 @@ func (u *Manager) CreateManualContact(user *models.User) error {
 	password, err := u.generatePassword()
 	if err != nil {
 		u.lo.Error("generating password", "error", err)
-		return fmt.Errorf("generating password: %w", err)
+		return envelope.NewError(envelope.GeneralError, u.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
 
 	// Normalize email.

From 46368da80f8d43bb06145ceab1e266d3b5f9d249 Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Thu, 14 May 2026 01:45:27 +0200
Subject: [PATCH 013/178] fix(contact): revoke avatar preview URLs

---
 .../src/features/contact/CreateContactDialog.vue    | 13 +++++++++++--
 1 file changed, 11 insertions(+), 2 deletions(-)

diff --git a/frontend/apps/main/src/features/contact/CreateContactDialog.vue b/frontend/apps/main/src/features/contact/CreateContactDialog.vue
index 003adbf9..8ae71a17 100644
--- a/frontend/apps/main/src/features/contact/CreateContactDialog.vue
+++ b/frontend/apps/main/src/features/contact/CreateContactDialog.vue
@@ -135,7 +135,7 @@
 </template>
 
 <script setup>
-import { ref, computed, watch } from 'vue'
+import { ref, computed, watch, onBeforeUnmount } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useForm } from 'vee-validate'
 import { toTypedSchema } from '@vee-validate/zod'
@@ -202,18 +202,25 @@ const initials = computed(() => {
 })
 
 function onAvatarUpload(file) {
+  revokeAvatarPreview()
   avatarFile.value = file
   avatarPreview.value = URL.createObjectURL(file)
 }
 
 function onAvatarRemove() {
   avatarFile.value = null
-  avatarPreview.value = ''
+  revokeAvatarPreview()
 }
 
 function resetForm() {
   form.resetForm()
   avatarFile.value = null
+  revokeAvatarPreview()
+}
+
+function revokeAvatarPreview() {
+  if (!avatarPreview.value) return
+  URL.revokeObjectURL(avatarPreview.value)
   avatarPreview.value = ''
 }
 
@@ -221,6 +228,8 @@ watch(() => props.open, (val) => {
   if (!val) resetForm()
 })
 
+onBeforeUnmount(revokeAvatarPreview)
+
 const onSubmit = form.handleSubmit(async (values) => {
   loading.value = true
   try {

From 88c9433490c35d897bee1be148fa9d72f8465511 Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Thu, 14 May 2026 01:47:07 +0200
Subject: [PATCH 014/178] fix(contact): route after sidebar create

---
 frontend/apps/main/src/components/sidebar/Sidebar.vue | 10 +++++++++-
 1 file changed, 9 insertions(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/components/sidebar/Sidebar.vue b/frontend/apps/main/src/components/sidebar/Sidebar.vue
index 1ac76ef9..9f610e1a 100644
--- a/frontend/apps/main/src/components/sidebar/Sidebar.vue
+++ b/frontend/apps/main/src/components/sidebar/Sidebar.vue
@@ -236,6 +236,11 @@ const hoveredViewId = ref(null)
 const isDeleteOpen = ref(false)
 const viewToDelete = ref(null)
 const showCreateContactDialog = ref(false)
+
+const handleContactCreated = (contact) => {
+  showCreateContactDialog.value = false
+  router.push({ name: 'contact-detail', params: { id: contact.id } })
+}
 </script>
 
 <template>
@@ -281,7 +286,10 @@ const showCreateContactDialog = ref(false)
           </SidebarGroup>
         </SidebarContent>
       </Sidebar>
-      <CreateContactDialog v-model:open="showCreateContactDialog" />
+      <CreateContactDialog
+        v-model:open="showCreateContactDialog"
+        @created="handleContactCreated"
+      />
     </template>
 
     <!-- Reports sidebar -->

From f9d4089590cec8bd2aa4882793888f01bb3c3d27 Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Thu, 14 May 2026 01:52:26 +0200
Subject: [PATCH 015/178] refactor(contact): share form parsing

---
 cmd/contacts.go | 152 ++++++++++++++++++------------------------------
 1 file changed, 56 insertions(+), 96 deletions(-)

diff --git a/cmd/contacts.go b/cmd/contacts.go
index 8ace81c2..1bad4d15 100644
--- a/cmd/contacts.go
+++ b/cmd/contacts.go
@@ -22,6 +22,42 @@ type blockContactReq struct {
 	Enabled bool `json:"enabled"`
 }
 
+type contactFormValues struct {
+	FirstName              string
+	LastName               string
+	Email                  string
+	PhoneNumber            string
+	PhoneNumberCountryCode string
+	Country                string
+	AvatarURL              string
+}
+
+func parseContactFormValues(values map[string][]string) contactFormValues {
+	return contactFormValues{
+		FirstName:              getContactFormValue(values, "first_name"),
+		LastName:               getContactFormValue(values, "last_name"),
+		Email:                  strings.TrimSpace(getContactFormValue(values, "email")),
+		PhoneNumber:            nullifyContactFormValue(getContactFormValue(values, "phone_number")),
+		PhoneNumberCountryCode: nullifyContactFormValue(getContactFormValue(values, "phone_number_country_code")),
+		Country:                nullifyContactFormValue(getContactFormValue(values, "country")),
+		AvatarURL:              nullifyContactFormValue(getContactFormValue(values, "avatar_url")),
+	}
+}
+
+func getContactFormValue(values map[string][]string, key string) string {
+	if v, ok := values[key]; ok && len(v) > 0 {
+		return v[0]
+	}
+	return ""
+}
+
+func nullifyContactFormValue(value string) string {
+	if value == "null" {
+		return ""
+	}
+	return value
+}
+
 // handleCreateContact creates a new contact.
 func handleCreateContact(r *fastglue.Request) error {
 	var app = r.Context.(*App)
@@ -32,54 +68,20 @@ func handleCreateContact(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, app.i18n.T("errors.parsingRequest"), nil, envelope.GeneralError)
 	}
 
-	firstName := ""
-	if v, ok := form.Value["first_name"]; ok && len(v) > 0 {
-		firstName = string(v[0])
-	}
-	lastName := ""
-	if v, ok := form.Value["last_name"]; ok && len(v) > 0 {
-		lastName = string(v[0])
-	}
-	email := ""
-	if v, ok := form.Value["email"]; ok && len(v) > 0 {
-		email = strings.TrimSpace(string(v[0]))
-	}
-	phoneNumber := ""
-	if v, ok := form.Value["phone_number"]; ok && len(v) > 0 {
-		phoneNumber = string(v[0])
-	}
-	phoneNumberCountryCode := ""
-	if v, ok := form.Value["phone_number_country_code"]; ok && len(v) > 0 {
-		phoneNumberCountryCode = string(v[0])
-	}
-	country := ""
-	if v, ok := form.Value["country"]; ok && len(v) > 0 {
-		country = string(v[0])
-	}
-
-	// Nullify "null" strings.
-	if phoneNumberCountryCode == "null" {
-		phoneNumberCountryCode = ""
-	}
-	if phoneNumber == "null" {
-		phoneNumber = ""
-	}
-	if country == "null" {
-		country = ""
-	}
+	fields := parseContactFormValues(form.Value)
 
 	// Validate email format if provided.
-	if email != "" && !stringutil.ValidEmail(email) {
+	if fields.Email != "" && !stringutil.ValidEmail(fields.Email) {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("validation.invalidEmail"), nil, envelope.InputError)
 	}
 
 	contact := models.User{
-		FirstName:              firstName,
-		LastName:               lastName,
-		Email:                  null.NewString(email, email != ""),
-		PhoneNumber:            null.NewString(phoneNumber, phoneNumber != ""),
-		PhoneNumberCountryCode: null.NewString(phoneNumberCountryCode, phoneNumberCountryCode != ""),
-		Country:                null.NewString(country, country != ""),
+		FirstName:              fields.FirstName,
+		LastName:               fields.LastName,
+		Email:                  null.NewString(fields.Email, fields.Email != ""),
+		PhoneNumber:            null.NewString(fields.PhoneNumber, fields.PhoneNumber != ""),
+		PhoneNumberCountryCode: null.NewString(fields.PhoneNumberCountryCode, fields.PhoneNumberCountryCode != ""),
+		Country:                null.NewString(fields.Country, fields.Country != ""),
 	}
 
 	if err := app.user.CreateManualContact(&contact); err != nil {
@@ -169,69 +171,27 @@ func handleUpdateContact(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, app.i18n.T("errors.parsingRequest"), nil, envelope.GeneralError)
 	}
 
-	// Parse form data
-	firstName := ""
-	if v, ok := form.Value["first_name"]; ok && len(v) > 0 {
-		firstName = string(v[0])
-	}
-	lastName := ""
-	if v, ok := form.Value["last_name"]; ok && len(v) > 0 {
-		lastName = string(v[0])
-	}
-	email := ""
-	if v, ok := form.Value["email"]; ok && len(v) > 0 {
-		email = strings.TrimSpace(string(v[0]))
-	}
-	phoneNumber := ""
-	if v, ok := form.Value["phone_number"]; ok && len(v) > 0 {
-		phoneNumber = string(v[0])
-	}
-	phoneNumberCountryCode := ""
-	if v, ok := form.Value["phone_number_country_code"]; ok && len(v) > 0 {
-		phoneNumberCountryCode = string(v[0])
-	}
-	country := ""
-	if v, ok := form.Value["country"]; ok && len(v) > 0 {
-		country = string(v[0])
-	}
-	avatarURL := ""
-	if v, ok := form.Value["avatar_url"]; ok && len(v) > 0 {
-		avatarURL = string(v[0])
-	}
-
-	// Set nulls to empty strings.
-	if avatarURL == "null" {
-		avatarURL = ""
-	}
-	if phoneNumberCountryCode == "null" {
-		phoneNumberCountryCode = ""
-	}
-	if phoneNumber == "null" {
-		phoneNumber = ""
-	}
-	if country == "null" {
-		country = ""
-	}
+	fields := parseContactFormValues(form.Value)
 
 	// Validate mandatory fields.
-	if email == "" {
+	if fields.Email == "" {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "email"), nil, envelope.InputError)
 	}
-	if !stringutil.ValidEmail(email) {
+	if !stringutil.ValidEmail(fields.Email) {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("validation.invalidEmail"), nil, envelope.InputError)
 	}
-	if firstName == "" {
+	if fields.FirstName == "" {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "first_name"), nil, envelope.InputError)
 	}
 
 	contactToUpdate := models.User{
-		FirstName:              firstName,
-		LastName:               lastName,
-		Email:                  null.StringFrom(email),
-		AvatarURL:              null.NewString(avatarURL, avatarURL != ""),
-		PhoneNumber:            null.NewString(phoneNumber, phoneNumber != ""),
-		PhoneNumberCountryCode: null.NewString(phoneNumberCountryCode, phoneNumberCountryCode != ""),
-		Country:                null.NewString(country, country != ""),
+		FirstName:              fields.FirstName,
+		LastName:               fields.LastName,
+		Email:                  null.StringFrom(fields.Email),
+		AvatarURL:              null.NewString(fields.AvatarURL, fields.AvatarURL != ""),
+		PhoneNumber:            null.NewString(fields.PhoneNumber, fields.PhoneNumber != ""),
+		PhoneNumberCountryCode: null.NewString(fields.PhoneNumberCountryCode, fields.PhoneNumberCountryCode != ""),
+		Country:                null.NewString(fields.Country, fields.Country != ""),
 	}
 
 	if err := app.user.UpdateContact(id, contactToUpdate); err != nil {
@@ -239,7 +199,7 @@ func handleUpdateContact(r *fastglue.Request) error {
 	}
 
 	// Delete avatar?
-	if avatarURL == "" && contact.AvatarURL.Valid {
+	if fields.AvatarURL == "" && contact.AvatarURL.Valid {
 		fileName := filepath.Base(contact.AvatarURL.String)
 		app.media.Delete(fileName)
 		contact.AvatarURL.Valid = false

From 864ab1ccd5e1eb44bf785a4dac220b173cec9408 Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Thu, 14 May 2026 01:53:44 +0200
Subject: [PATCH 016/178] refactor(contact): simplify form schema

---
 frontend/apps/main/src/features/contact/formSchema.js | 9 +++------
 1 file changed, 3 insertions(+), 6 deletions(-)

diff --git a/frontend/apps/main/src/features/contact/formSchema.js b/frontend/apps/main/src/features/contact/formSchema.js
index 8765806d..1922978a 100644
--- a/frontend/apps/main/src/features/contact/formSchema.js
+++ b/frontend/apps/main/src/features/contact/formSchema.js
@@ -47,15 +47,13 @@ export const createContactFormSchema = (t) => z.object({
         .max(50, {
             message: t('validation.minmax', { min: 0, max: 50 })
         })
-        .optional()
-        .or(z.literal('')),
+        .optional(),
     last_name: z
         .string()
         .max(50, {
             message: t('validation.minmax', { min: 0, max: 50 })
         })
-        .optional()
-        .or(z.literal('')),
+        .optional(),
     email: z
         .string()
         .email({ message: t('validation.invalidEmail') })
@@ -66,8 +64,7 @@ export const createContactFormSchema = (t) => z.object({
         .refine(val => !val || /^\d{1,15}$/.test(val), {
             message: t('validation.minmax', { min: 1, max: 15 })
         })
-        .optional()
-        .or(z.literal('')),
+        .optional(),
     phone_number_country_code: z.string().optional().nullable(),
     country: z.string().optional().nullable(),
 })

From 14d151afaf3d87aa76efa4d33ea079fc9f9b989f Mon Sep 17 00:00:00 2001
From: Gumbraise <34947108+Gumbraise@users.noreply.github.com>
Date: Thu, 21 May 2026 23:43:26 +0200
Subject: [PATCH 017/178] fix(contact): treat avatar upload as best-effort
 after contact creation

---
 cmd/contacts.go | 14 ++++++++------
 1 file changed, 8 insertions(+), 6 deletions(-)

diff --git a/cmd/contacts.go b/cmd/contacts.go
index 9dbef6d9..045c1b9f 100644
--- a/cmd/contacts.go
+++ b/cmd/contacts.go
@@ -93,15 +93,17 @@ func handleCreateContact(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 
-	// Upload avatar if provided.
+	// Upload avatar if provided. Treat as best-effort: a failure does not
+	// roll back the already-created contact.
 	files, ok := form.File["files"]
 	if ok && len(files) > 0 {
 		if err := uploadUserAvatar(r, createdContact, files); err != nil {
-			return sendErrorEnvelope(r, err)
-		}
-		createdContact, err = app.user.GetContactOrVisitor(contact.ID, "")
-		if err != nil {
-			return sendErrorEnvelope(r, err)
+			app.lo.Error("failed to upload avatar for new contact", "contact_id", contact.ID, "error", err)
+		} else {
+			createdContact, err = app.user.GetContactOrVisitor(contact.ID, "")
+			if err != nil {
+				return sendErrorEnvelope(r, err)
+			}
 		}
 	}
 

From 45c1b6a6e993f192cd053b441c84469585f8b187 Mon Sep 17 00:00:00 2001
From: Izzaldin <izzaldinsamir@gmail.com>
Date: Fri, 31 Jul 2026 00:54:38 +0300
Subject: [PATCH 018/178] fix: force light background for email messages in
 dark mode (#449)

---
 .../main/src/features/conversation/message/MessageBubble.vue    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
index 4d2ececc..2bbf433d 100644
--- a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
+++ b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
@@ -106,7 +106,7 @@
               >
                 {{ sanitizedContent }}
               </div>
-              <div v-else ref="messageContentEl" @click="onMessageContentClick">
+              <div v-else ref="messageContentEl" @click="onMessageContentClick" class="dark:bg-white dark:text-black dark:p-4 dark:rounded-md">
                 <Letter
                   :html="sanitizedContent"
                   :allowedSchemas="['cid', 'https', 'http', 'mailto']"

From 9862adceeced565a7375c2f208f8678e51b78bcc Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sat, 1 Aug 2026 21:06:22 +0530
Subject: [PATCH 019/178] render incoming email on a light canvas in dark mode

---
 .../src/features/conversation/message/MessageBubble.vue   | 7 ++++++-
 frontend/shared-ui/assets/styles/main.scss                | 8 ++++++++
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
index 2bbf433d..9b7120ef 100644
--- a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
+++ b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
@@ -106,7 +106,12 @@
               >
                 {{ sanitizedContent }}
               </div>
-              <div v-else ref="messageContentEl" @click="onMessageContentClick" class="dark:bg-white dark:text-black dark:p-4 dark:rounded-md">
+              <div
+                v-else
+                ref="messageContentEl"
+                @click="onMessageContentClick"
+                :class="{ 'email-light-canvas': !isOutgoing }"
+              >
                 <Letter
                   :html="sanitizedContent"
                   :allowedSchemas="['cid', 'https', 'http', 'mailto']"
diff --git a/frontend/shared-ui/assets/styles/main.scss b/frontend/shared-ui/assets/styles/main.scss
index af6bcc0a..16124e93 100644
--- a/frontend/shared-ui/assets/styles/main.scss
+++ b/frontend/shared-ui/assets/styles/main.scss
@@ -257,6 +257,14 @@
   }
 }
 
+// Sender colours are only legible against white, so incoming email HTML is not themed.
+.dark .email-light-canvas {
+  @apply p-2 rounded border border-border;
+  color-scheme: light;
+  background: #fff;
+  color: #1a1a1a;
+}
+
 .overlay {
   background: hsl(var(--foreground) / 0.5);
 }

From a3a102540ac0fb792845ae8a6070385bcdbca437 Mon Sep 17 00:00:00 2001
From: Izzaldin <izzaldinsamir@gmail.com>
Date: Sun, 2 Aug 2026 17:08:32 +0300
Subject: [PATCH 020/178] Update frontend/shared-ui/assets/styles/main.scss

Co-authored-by: coderabbitai[bot] <136622811+coderabbitai[bot]@users.noreply.github.com>
---
 frontend/shared-ui/assets/styles/main.scss | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/frontend/shared-ui/assets/styles/main.scss b/frontend/shared-ui/assets/styles/main.scss
index 16124e93..fc84734c 100644
--- a/frontend/shared-ui/assets/styles/main.scss
+++ b/frontend/shared-ui/assets/styles/main.scss
@@ -259,9 +259,10 @@
 
 // Sender colours are only legible against white, so incoming email HTML is not themed.
 .dark .email-light-canvas {
-  @apply p-2 rounded border border-border;
+  `@apply` p-2 rounded border border-border;
+
   color-scheme: light;
-  background: #fff;
+  background: `#fff`;
   color: #1a1a1a;
 }
 

From 4f061b60d9c96e783d2a4d9c5a85f519053d7457 Mon Sep 17 00:00:00 2001
From: Izzaldin <izzaldinsamir@gmail.com>
Date: Sun, 2 Aug 2026 17:19:00 +0300
Subject: [PATCH 021/178] fix: remove invalid CSS syntax added by bot

---
 .../main/src/features/conversation/message/MessageBubble.vue  | 2 +-
 frontend/shared-ui/assets/styles/main.scss                    | 4 ++--
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
index 9b7120ef..3356f4e3 100644
--- a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
+++ b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
@@ -106,7 +106,7 @@
               >
                 {{ sanitizedContent }}
               </div>
-              <div
+main.scss              <div
                 v-else
                 ref="messageContentEl"
                 @click="onMessageContentClick"
diff --git a/frontend/shared-ui/assets/styles/main.scss b/frontend/shared-ui/assets/styles/main.scss
index fc84734c..a017bcf2 100644
--- a/frontend/shared-ui/assets/styles/main.scss
+++ b/frontend/shared-ui/assets/styles/main.scss
@@ -259,10 +259,10 @@
 
 // Sender colours are only legible against white, so incoming email HTML is not themed.
 .dark .email-light-canvas {
-  `@apply` p-2 rounded border border-border;
+  @apply p-2 rounded border border-border;
 
   color-scheme: light;
-  background: `#fff`;
+  background: #fff;
   color: #1a1a1a;
 }
 

From 10d2a7d52fd6c59a1d3628ef5b0025728c053788 Mon Sep 17 00:00:00 2001
From: pat-s <patrick.schratz@gmail.com>
Date: Fri, 14 Aug 2026 13:10:38 +0000
Subject: [PATCH 022/178] feat(auth): add SSO-only login mode

---
 cmd/config.go                                 | 20 +++++++++
 cmd/config_test.go                            | 41 +++++++++++++++++++
 cmd/login.go                                  |  8 ++++
 config.sample.toml                            |  6 +++
 .../main/src/views/auth/UserLoginView.vue     |  8 +++-
 5 files changed, 81 insertions(+), 2 deletions(-)
 create mode 100644 cmd/config_test.go

diff --git a/cmd/config.go b/cmd/config.go
index 8a04a219..e354ab9d 100644
--- a/cmd/config.go
+++ b/cmd/config.go
@@ -4,9 +4,28 @@ import (
 	"encoding/json"
 
 	"github.com/abhinavxd/libredesk/internal/envelope"
+	oidcmodels "github.com/abhinavxd/libredesk/internal/oidc/models"
 	"github.com/zerodha/fastglue"
 )
 
+const localLoginEnabledKey = "auth.local_login_enabled"
+
+// isLocalLoginEnabled keeps local login available by default and whenever no
+// OIDC provider is enabled, preventing an administrator from locking everyone out.
+func isLocalLoginEnabled(providers []oidcmodels.OIDC) bool {
+	if !ko.Exists(localLoginEnabledKey) || ko.Bool(localLoginEnabledKey) {
+		return true
+	}
+
+	for _, provider := range providers {
+		if provider.Enabled {
+			return false
+		}
+	}
+
+	return true
+}
+
 // handleGetConfig returns the public configuration needed for app initialization, this includes minimal app settings and enabled SSO providers (without secrets).
 func handleGetConfig(r *fastglue.Request) error {
 	var app = r.Context.(*App)
@@ -58,6 +77,7 @@ func handleGetConfig(r *fastglue.Request) error {
 
 	// Add SSO providers to the response
 	publicSettings["app.sso_providers"] = enabledProviders
+	publicSettings["app.local_login_enabled"] = isLocalLoginEnabled(oidcProviders)
 
 	return r.SendEnvelope(publicSettings)
 }
diff --git a/cmd/config_test.go b/cmd/config_test.go
new file mode 100644
index 00000000..fcca43fa
--- /dev/null
+++ b/cmd/config_test.go
@@ -0,0 +1,41 @@
+package main
+
+import (
+	"testing"
+
+	oidcmodels "github.com/abhinavxd/libredesk/internal/oidc/models"
+)
+
+func TestIsLocalLoginEnabled(t *testing.T) {
+	tests := []struct {
+		name       string
+		configured *bool
+		providers  []oidcmodels.OIDC
+		want       bool
+	}{
+		{name: "defaults to enabled", want: true},
+		{name: "remains enabled when configured", configured: boolPointer(true), want: true},
+		{name: "remains enabled without an enabled OIDC provider", configured: boolPointer(false), providers: []oidcmodels.OIDC{{Enabled: false}}, want: true},
+		{name: "is disabled with an enabled OIDC provider", configured: boolPointer(false), providers: []oidcmodels.OIDC{{Enabled: true}}, want: false},
+	}
+
+	for _, tt := range tests {
+		t.Run(tt.name, func(t *testing.T) {
+			ko.Delete(localLoginEnabledKey)
+			if tt.configured != nil {
+				if err := ko.Set(localLoginEnabledKey, *tt.configured); err != nil {
+					t.Fatalf("set config: %v", err)
+				}
+			}
+			t.Cleanup(func() { ko.Delete(localLoginEnabledKey) })
+
+			if got := isLocalLoginEnabled(tt.providers); got != tt.want {
+				t.Fatalf("isLocalLoginEnabled() = %v, want %v", got, tt.want)
+			}
+		})
+	}
+}
+
+func boolPointer(value bool) *bool {
+	return &value
+}
diff --git a/cmd/login.go b/cmd/login.go
index 2cf3968e..c20ab830 100644
--- a/cmd/login.go
+++ b/cmd/login.go
@@ -21,6 +21,14 @@ func handleLogin(r *fastglue.Request) error {
 		loginReq loginRequest
 	)
 
+	oidcProviders, err := app.oidc.GetAll()
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	if !isLocalLoginEnabled(oidcProviders) {
+		return r.SendErrorEnvelope(fasthttp.StatusForbidden, "Local login is disabled. Sign in with an SSO provider.", nil, envelope.PermissionError)
+	}
+
 	// Decode JSON request.
 	if err := r.Decode(&loginReq, "json"); err != nil {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("errors.parsingRequest"), nil, envelope.InputError)
diff --git a/config.sample.toml b/config.sample.toml
index 713c01a8..b39aa2ff 100644
--- a/config.sample.toml
+++ b/config.sample.toml
@@ -34,6 +34,12 @@ read_buffer_size = 65536
 # Keepalive settings.
 keepalive_timeout = "10s"
 
+[auth]
+# Allow users to sign in with their LibreDesk email and password.
+# Disable this only after configuring and enabling at least one OIDC provider.
+# LibreDesk automatically keeps local login available when no OIDC provider is enabled to prevent lockout.
+local_login_enabled = true
+
 # File upload provider to use, either `fs` or `s3`.
 [upload]
 provider = "fs"
diff --git a/frontend/apps/main/src/views/auth/UserLoginView.vue b/frontend/apps/main/src/views/auth/UserLoginView.vue
index 3cf65fd1..5ca74ff1 100644
--- a/frontend/apps/main/src/views/auth/UserLoginView.vue
+++ b/frontend/apps/main/src/views/auth/UserLoginView.vue
@@ -32,7 +32,7 @@
             {{ oidcProvider.name }}
           </Button>
 
-          <div class="relative">
+          <div v-if="localLoginEnabled" class="relative">
             <div class="absolute inset-0 flex items-center">
               <span class="w-full border-t border-border"></span>
             </div>
@@ -42,7 +42,7 @@
           </div>
         </div>
 
-        <form @submit.prevent="loginAction" class="space-y-3">
+        <form v-if="localLoginEnabled" @submit.prevent="loginAction" class="space-y-3">
           <div class="space-y-2">
             <Label for="email" class="text-muted-foreground">{{
               t('globals.terms.email')
@@ -246,6 +246,10 @@ const enabledOIDCProviders = computed(() => {
   return oidcProviders.value.filter((provider) => !provider.disabled)
 })
 
+const localLoginEnabled = computed(
+  () => appSettingsStore.public_config?.['app.local_login_enabled'] !== false
+)
+
 const emailHasError = computed(() => {
   if (!submitted.value) return false
   const email = loginForm.value.email

From 8a3efb0f787a1ae01346b2de933f22b6733545a4 Mon Sep 17 00:00:00 2001
From: pat-s <patrick.schratz@gmail.com>
Date: Fri, 14 Aug 2026 13:21:00 +0000
Subject: [PATCH 023/178] docs(auth): clarify SSO recovery path

---
 config.sample.toml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/config.sample.toml b/config.sample.toml
index b39aa2ff..4f0bbe19 100644
--- a/config.sample.toml
+++ b/config.sample.toml
@@ -38,6 +38,7 @@ keepalive_timeout = "10s"
 # Allow users to sign in with their LibreDesk email and password.
 # Disable this only after configuring and enabling at least one OIDC provider.
 # LibreDesk automatically keeps local login available when no OIDC provider is enabled to prevent lockout.
+# If an enabled provider is unavailable or misconfigured, set auth.local_login_enabled = true to restore password login.
 local_login_enabled = true
 
 # File upload provider to use, either `fs` or `s3`.

From 0cba59c0aad2184c0f85b7642ba549a3dd45e39b Mon Sep 17 00:00:00 2001
From: Jonathan Leroy <jonathan@relkian.com>
Date: Wed, 2 Sep 2026 02:44:08 +0200
Subject: [PATCH 024/178] Update translations [2025-09-02]

---
 i18n/da-DK.json |   19 -
 i18n/de-DE.json |   26 +-
 i18n/es-ES.json |   33 +-
 i18n/fa-IR.json |   19 -
 i18n/fr-FR.json |  521 +++++++++++++++++++++--
 i18n/it-IT.json |   19 -
 i18n/ja-JP.json |   19 -
 i18n/mr-IN.json |   19 -
 i18n/nl-NL.json | 1067 +++++++++++++++++++++++++++++++++++++++++++++++
 i18n/pt-BR.json |   19 -
 i18n/pt-PT.json | 1013 ++++++++++++++++++++++++++++++++++++++++++++
 i18n/zh-CN.json |   55 ++-
 12 files changed, 2628 insertions(+), 201 deletions(-)
 create mode 100644 i18n/nl-NL.json
 create mode 100644 i18n/pt-PT.json

diff --git a/i18n/da-DK.json b/i18n/da-DK.json
index 4b8b3ac7..70f9efa4 100644
--- a/i18n/da-DK.json
+++ b/i18n/da-DK.json
@@ -3,11 +3,9 @@
   "_.name": "Dansk",
   "account.avatarRemoved": "Avatar fjernet",
   "account.changeAvatar": "Skift avataren hér.",
-  "account.chooseAFile": "Vælg en fil...",
   "account.cropAvatar": "Beskær avatar",
   "account.editProfile": "Rediger profil",
   "account.publicAvatar": "Offentlig avatar",
-  "account.removeAvatar": "Fjern avatar",
   "actions.addAction": "Tilføj handling",
   "actions.addCondition": "Tilføj betingelse",
   "actions.addTags": "Tilføj tags",
@@ -81,7 +79,6 @@
   "admin.contextLink.help.detail": "Brug {'{{token}}'} til en fuldt krypteret payload, som den eksterne app dekrypterer med en delt hemmelighed. Eller brug individuelle variabler som {'{{email}}'}, {'{{phone}}'}, {'{{external_user_id}}'} til almindelige URL-links til betroede interne værktøjer.",
   "admin.conversationStatus.name.description": "Opsæt statusnavn. Klik på Gem når færdig.",
   "admin.conversationTags.edit.description": "Skift tagnavn. Klik på Gem når færdig.",
-  "admin.conversationTags.name.valid": "Tagnavn skal udgøre mindst 3 tegn",
   "admin.conversationTags.new.description": "Opsæt tagnavn. Klik på Gem når færdig.",
   "admin.customAttribute.help": "Tilpassede attributter hjælper dig med at angive yderligere detaljer om dine kontakter eller samtaler, såsom abonnementsplan eller dato for første køb.",
   "admin.customAttributes.keyNotAllowed": "Den angivne nøgle er ikke tilladt, da den er i konflikt med standardattributter. Benyt en anden nøgle.",
@@ -193,7 +190,6 @@
   "admin.inbox.livechat.noticeBanner.enabled": "Aktivér meddelsesbanner",
   "admin.inbox.livechat.noticeBanner.text": "Meddelsesbanner-tekst",
   "admin.inbox.livechat.officeHours": "Kontortid",
-  "admin.inbox.livechat.prechatForm.addField": "Tilføj felt",
   "admin.inbox.livechat.prechatForm.availableFields": "Tilgængelige tilpassede attributter",
   "admin.inbox.livechat.prechatForm.enabled": "Aktivér præ-chat-formular",
   "admin.inbox.livechat.prechatForm.enabled.description": "Vis en formular til at indsamle information før chat starter",
@@ -371,9 +367,6 @@
   "agent.generateApiKey": "Generer API-nøgle",
   "agent.new": "Ny agent",
   "agent.selectAvailabilityStatus": "Vælg tilgængelighedsstatus",
-  "ai.apiKey.description": "{provider} API-nøgle er ikke indstillet eller ugyldig. Angiv en gyldig API-nøgle for at bruge AI-funktioner.",
-  "ai.apiKeyNotSet": "{provider} API-nøgle er ikke angivet. Anmod administratoren om at opsætte den",
-  "ai.enterOpenAIAPIKey": "Angiv OpenAI API-nøgle",
   "auth.backToLogin": "Retur til login",
   "auth.checkEmailForReset": "Tjek indbakken for adgangskodenulstillingslinket.",
   "auth.confirmPassword": "Bekræft adgangskode",
@@ -592,8 +585,6 @@
   "globals.messages.sendUsMessage": "Send os en besked",
   "globals.messages.sending": "Sender...",
   "globals.messages.setUp": "Opsæt",
-  "globals.messages.smallScreenDescription": "Libredesk er designet til større skærme. For den bedste oplevelse, brug venligst en computer eller tablet.",
-  "globals.messages.smallScreenTitle": "Skift til desktop for den bedste oplevelse",
   "globals.messages.somethingWentWrong": "Noget gik galt",
   "globals.messages.startNewConversation": "Start ny samtale",
   "globals.messages.startTypingToSearch": "Begynd at skrive for at søge...",
@@ -870,32 +861,25 @@
   "replyBox.removeBCC": "Fjern BCC",
   "replyBox.sendAnyway": "Send alligevel",
   "replyBox.toRequired": "Mindst én modtager er påkrævet i Til-feltet.",
-  "report.agentStatus": "Agentstatus",
   "report.chart.newConversations": "Nye samtaler",
   "report.chart.resolvedConversations": "Løste samtaler",
-  "report.chart.title": "Samtaletendenser",
   "report.csat.avgRating": "Gns. bedømmelse",
-  "report.csat.cardTitle": "Kundetilfredshed (sidste {days} dage)",
   "report.csat.responseRate": "Svarprocent",
   "report.csat.responses": "Svar",
-  "report.messages.cardTitle": "Beskedvolumen (sidste {days} dage)",
   "report.messages.incoming": "Indgående",
   "report.messages.outgoing": "Udgående",
   "report.messages.perConversation": "Pr. samtale",
   "report.messages.total": "I alt",
   "report.noTagsFound": "Ingen tags fundet",
-  "report.openConversations": "Åbne samtaler",
   "report.sla.avgFirstResp": "Gns. første svartid",
   "report.sla.avgNextResp": "Gns. næste svartid",
   "report.sla.avgResolution": "Gns. løsningstid",
   "report.sla.breached": "Brudt",
-  "report.sla.cardTitle": "SLA-ydeevne (sidste {days} dage)",
   "report.sla.compliance": "Overholdelse",
   "report.sla.firstResponse": "Første svar",
   "report.sla.met": "Opfyldt",
   "report.sla.nextResponse": "Næste svar",
   "report.sla.resolution": "Løsning",
-  "report.tags.cardTitle": "Tag-fordeling (sidste {days} dage)",
   "report.tags.tagged": "Tagget",
   "report.tags.topTags": "Top-tags",
   "role.deletionConfirmation": "Denne handling kan ikke fortrydes. Dette vil permanent slette denne rolle.",
@@ -964,7 +948,6 @@
   "validation.invalidKey": "Ugyldig nøgle",
   "validation.invalidPermission": "Ugyldig tilladelse",
   "validation.invalidPortValue": "Ugyldig portværdi",
-  "validation.invalidProvider": "Ugyldig udbyder",
   "validation.invalidSnoozeDuration": "Ugyldig slumrevarighed",
   "validation.invalidTimeFormat": "Ugyldigt tidsformat (TT:mm)",
   "validation.invalidUrl": "Ugyldig URL",
@@ -998,11 +981,9 @@
   "validation.subjectCannotBeEmpty": "Emne kan ikke være tomt",
   "validation.tooLongStatus": "Status er for lang, bør højst være {max} tegn",
   "view.form.description": "Opret og gem tilpassede filtervisninger for hurtig adgang til samtaler.",
-  "view.form.filter.partiallyFilled": "Sørg for, at filtreringsfelterne er udfyldt korrekt.",
   "view.form.filter.selectAtLeastOne": "Vælg mindst ét filter.",
   "view.form.filters.description": "Indstil et eller flere filtre for at tilpasse visningen.",
   "view.form.name.description": "Angiv et unikt navn til visningen.",
-  "view.form.name.length": "Visningsnavn skal være mellem 2 og 30 tegn.",
   "webhook.edit": "Rediger webhook",
   "webhook.new": "Ny webhook",
   "webhook.sendTest": "Send testbesked",
diff --git a/i18n/de-DE.json b/i18n/de-DE.json
index 598628f2..4710ff06 100644
--- a/i18n/de-DE.json
+++ b/i18n/de-DE.json
@@ -3,16 +3,16 @@
   "_.name": "Deutsch",
   "account.avatarRemoved": "Profilbild entfernt",
   "account.changeAvatar": "Ändere dein Profilbild hier.",
-  "account.chooseAFile": "Wähle eine Datei...",
   "account.cropAvatar": "Profilbild zuschneiden",
   "account.editProfile": "Profil bearbeiten",
   "account.publicAvatar": "Öffentliches Profilbild",
-  "account.removeAvatar": "Profilbild entfernen",
   "actions.addAction": "Aktion hinzufügen",
   "actions.addCondition": "Bedingung hinzufügen",
   "actions.addTags": "Tags hinzufügen",
   "actions.addingPrivateNotes": "Private Notizen hinzufügen",
+  "actions.addPrivateNote": "Private Nachricht hinzufügen",
   "actions.applyMacro": "Makro anwenden",
+  "actions.openMacros": "Makros öffnen",
   "actions.assignAgent": "Mitarbeiter zuweisen",
   "actions.assignTeam": "Team zuweisen",
   "actions.noActions": "Keine Aktionen",
@@ -35,6 +35,12 @@
   "activityLog.agentOnline": "{actorEmail} ({actorId}) hat den Status von {targetEmail} ({targetId}) auf Online geändert",
   "activityLog.agentOnlineSelf": "{actorEmail} ({actorId}) ist online",
   "activityLog.agentPasswordSet": "{actorEmail} ({actorId}) hat das Passwort gesetzt für {targetEmail} ({targetId})",
+  "activityLog.entryType": "Art des Logeintrags",
+  "activityLog.entryType.agentAway": "Agent abwesend",
+  "activityLog.entryType.agentAwayReassigned": "Agent abwesend neu zugewiesen",
+  "activityLog.entryType.agentLogin": "Agent angemeldet",
+  "activityLog.entryType.agentLogout": "Agent abgemeldet",
+  "activityLog.entryType.agentOnline": "Agent online",
   "activityLog.rolePermissionsAdded": "{actorEmail} ({actorId}) hat Berechtigung(en) {permissions} zur Rolle {roleName} ({roleId}) hinzugefügt",
   "activityLog.rolePermissionsChanged": "{actorEmail} ({actorId}) hat Berechtigung(en) {removed} entfernt und Berechtigung(en) {added} zur Rolle {roleName} ({roleId}) hinzugefügt",
   "activityLog.rolePermissionsRemoved": "{actorEmail} ({actorId}) hat Berechtigung(en) {permissions} von der Rolle {roleName} ({roleId}) entfernt",
@@ -78,9 +84,9 @@
   "admin.businessHours.setBusinessHours": "Geschäftszeiten auswählen",
   "admin.contextLink.help.description": "Kontextlinks erscheinen in der Seitenleiste der Konversation und ermöglichen es Mitarbeitern, externe Tools wie CRMs, Abrechnungssysteme oder interne Dashboards zu öffnen, wobei die Kontaktdaten automatisch übergeben werden.",
   "admin.contextLink.help.detail": "Verwenden Sie {'{{token}}'} für eine vollständig verschlüsselte Nutzlast, die die externe App mit einem gemeinsamen Schlüssel entschlüsselt. Oder verwenden Sie einzelne Variablen wie {'{{email}}'}, {'{{phone}}'}, {'{{external_user_id}}'} für einfache URL-Links zu vertrauenswürdigen internen Tools.",
+  "admin.conversationStatus.category.placeholder": "Kategorie auswählen",
   "admin.conversationStatus.name.description": "Status-Name festlegen. Klicken auf Speichern, wenn du fertig bist.",
   "admin.conversationTags.edit.description": "Ändere den Tag-Namen. Klicke auf Speichern, wenn du fertig bist.",
-  "admin.conversationTags.name.valid": "Tag-Name muss mindestens 3 Zeichen lang sein",
   "admin.conversationTags.new.description": "Lege den Tag-Namen fest. Klicke auf Speichern, wenn du fertig bist.",
   "admin.customAttribute.help": "Benutzerdefinierte Attribute helfen Ihnen, zusätzliche Details zu Ihren Kontakten oder Konversationen festzulegen, wie z. B. den Abonnementplan oder das Datum des ersten Kaufs.",
   "admin.customAttributes.keyNotAllowed": "Der angegebene Schlüssel ist nicht zulässig, da er mit den Standardattributen kollidiert. Bitte verwenden Sie einen anderen Schlüssel.",
@@ -170,7 +176,6 @@
   "admin.inbox.livechat.noticeBanner.enabled": "Hinweisbanner aktivieren",
   "admin.inbox.livechat.noticeBanner.text": "Hinweisbanner-Text",
   "admin.inbox.livechat.officeHours": "Geschäftszeiten",
-  "admin.inbox.livechat.prechatForm.addField": "Feld hinzufügen",
   "admin.inbox.livechat.prechatForm.availableFields": "Verfügbare benutzerdefinierte Attribute",
   "admin.inbox.livechat.prechatForm.enabled.description": "Formular anzeigen, um Informationen vor dem Chat-Start zu sammeln",
   "admin.inbox.livechat.prechatForm.fields": "Formularfelder",
@@ -321,9 +326,6 @@
   "agent.edit": "Mitarbeiter bearbeiten",
   "agent.generateApiKey": "API-Schlüssel generieren",
   "agent.new": "Neuer Mitarbeiter",
-  "ai.apiKey.description": "{provider} API-Schlüssel ist nicht gesetzt oder ungültig. Bitte gib einen gültigen API-Schlüssel ein, um die KI-Funktionen zu nutzen.",
-  "ai.apiKeyNotSet": "{provider} API-Schlüssel ist nicht gesetzt. Bitte den Administrator, ihn einzurichten",
-  "ai.enterOpenAIAPIKey": "OpenAI API-Schlüssel eingeben",
   "auth.backToLogin": "Zurück zum Login",
   "auth.checkEmailForReset": "Überprüfe deinen E-Mail-Posteingang für den Link zum Zurücksetzen des Passworts.",
   "auth.confirmPassword": "Passwort bestätigen",
@@ -535,7 +537,6 @@
   "globals.messages.sendUsMessage": "Senden Sie uns eine Nachricht",
   "globals.messages.sending": "Senden...",
   "globals.messages.setUp": "Einrichten",
-  "globals.messages.smallScreenTitle": "Wechseln Sie zum Desktop für die beste Erfahrung",
   "globals.messages.somethingWentWrong": "Etwas ist schiefgelaufen",
   "globals.messages.startNewConversation": "Neue Konversation beginnen",
   "globals.messages.startTypingToSearch": "Fang an zu tippen, um zu suchen...",
@@ -806,21 +807,16 @@
   "replyBox.removeBCC": "BCC entfernen",
   "replyBox.sendAnyway": "Trotzdem senden",
   "replyBox.toRequired": "Mindestens ein Empfänger im An-Feld ist erforderlich.",
-  "report.agentStatus": "Mitarbeiterstatus",
   "report.chart.newConversations": "Neue Konversationen",
   "report.chart.resolvedConversations": "Abgeschlossene Konversationen",
-  "report.chart.title": "Konversationstrends",
   "report.csat.avgRating": "Durchschnittliche Bewertung",
-  "report.csat.cardTitle": "Kundenzufriedenheit (letzte {days} Tage)",
   "report.csat.responseRate": "Antwortquote",
   "report.csat.responses": "Antworten",
-  "report.messages.cardTitle": "Nachrichtenvolumen (letzte {days} Tage)",
   "report.messages.incoming": "Eingehend",
   "report.messages.outgoing": "Ausgehend",
   "report.messages.perConversation": "pro Konversation",
   "report.messages.total": "Gesamt",
   "report.noTagsFound": "Keine Tags gefunden",
-  "report.openConversations": "Offene Konversationen",
   "report.sla.avgFirstResp": "Durchschnittliche Zeit für erste Antwort",
   "report.sla.avgNextResp": "Durchschnittliche Antwortzeit für die nächste",
   "report.sla.avgResolution": "Durchschnittliche Lösungszeit",
@@ -830,7 +826,6 @@
   "report.sla.met": "Eingehalten",
   "report.sla.nextResponse": "Nächste Antwort",
   "report.sla.resolution": "Lösung",
-  "report.tags.cardTitle": "Tag-Verteilung (letzte {days} Tage)",
   "report.tags.tagged": "Getaggt",
   "report.tags.topTags": "Top-Tags",
   "role.deletionConfirmation": "Diese Aktion kann nicht rückgängig gemacht werden. Diese Rolle wird dauerhaft gelöscht.",
@@ -890,7 +885,6 @@
   "validation.invalidInbox": "Ungültiger Posteingang",
   "validation.invalidKey": "Ungültiger Schlüssel",
   "validation.invalidPermission": "Ungültige Berechtigung",
-  "validation.invalidProvider": "Ungültiger Anbieter",
   "validation.invalidTimeFormat": "Ungültiges Zeitformat (HH:mm)",
   "validation.invalidUrl": "Ungültige URL",
   "validation.invalidUser": "Ungültiger Benutzer",
@@ -922,11 +916,9 @@
   "validation.subjectCannotBeEmpty": "Betreff darf nicht leer sein",
   "validation.tooLongStatus": "Status ist zu lang, sollte höchstens {max} Zeichen haben",
   "view.form.description": "Erstelle und speichere benutzerdefinierte Filteransichten, um schnell auf deine Konversationen zuzugreifen.",
-  "view.form.filter.partiallyFilled": "Bitte stelle sicher, dass du die Felder für die Filter korrekt ausgefüllt hast.",
   "view.form.filter.selectAtLeastOne": "Wähle mindestens einen Filter.",
   "view.form.filters.description": "Verwende einen oder mehrere Filter, um die Ansicht anzupassen.",
   "view.form.name.description": "Gib einen eindeutigen Namen für die Ansicht ein.",
-  "view.form.name.length": "Der Name der Ansicht sollte zwischen 2 und 30 Zeichen lang sein.",
   "webhook.edit": "Webhook bearbeiten",
   "webhook.new": "Neuer Webhook",
   "webhook.sendTest": "Test senden",
diff --git a/i18n/es-ES.json b/i18n/es-ES.json
index 09804810..40f66457 100644
--- a/i18n/es-ES.json
+++ b/i18n/es-ES.json
@@ -3,16 +3,16 @@
   "_.name": "Español",
   "account.avatarRemoved": "Avatar eliminado",
   "account.changeAvatar": "Cambia tu avatar aquí.",
-  "account.chooseAFile": "Elige un archivo...",
   "account.cropAvatar": "Recortar avatar",
   "account.editProfile": "Editar perfil",
   "account.publicAvatar": "Avatar público",
-  "account.removeAvatar": "Eliminar avatar",
   "actions.addAction": "Añadir acción",
   "actions.addCondition": "Añadir condición",
   "actions.addTags": "Añadir etiquetas",
   "actions.addingPrivateNotes": "Añadiendo notas privadas",
+  "actions.addPrivateNote": "Añadir nota privada",
   "actions.applyMacro": "Aplicar macro",
+  "actions.openMacros": "Abrir macros",
   "actions.assignAgent": "Asignar agente",
   "actions.assignTeam": "Asignar equipo",
   "actions.noActions": "Sin acciones",
@@ -35,6 +35,14 @@
   "activityLog.agentOnline": "{actorEmail} ({actorId}) cambió el estado de {targetEmail} ({targetId}) a en línea",
   "activityLog.agentOnlineSelf": "{actorEmail} ({actorId}) está en línea",
   "activityLog.agentPasswordSet": "{actorEmail} ({actorId}) estableció contraseña para {targetEmail} ({targetId})",
+  "activityLog.entryType": "Tipo de entrada de registro",
+  "activityLog.entryType.agentAway": "Agente ausente",
+  "activityLog.entryType.agentAwayReassigned": "Agente ausente reasignado",
+  "activityLog.entryType.agentLogin": "Inicio de sesión de agente",
+  "activityLog.entryType.agentLogout": "Cierre de sesión de agente",
+  "activityLog.entryType.agentOnline": "Agente en línea",
+  "activityLog.entryType.agentPasswordSet": "Contraseña de agente establecida",
+  "activityLog.entryType.agentRolePermissionsChanged": "Permisos de rol de agente cambiados",
   "activityLog.rolePermissionsAdded": "{actorEmail} ({actorId}) añadió permiso(s) {permissions} al rol {roleName} ({roleId})",
   "activityLog.rolePermissionsChanged": "{actorEmail} ({actorId}) eliminó permiso(s) {removed} y añadió permiso(s) {added} al rol {roleName} ({roleId})",
   "activityLog.rolePermissionsRemoved": "{actorEmail} ({actorId}) eliminó permiso(s) {permissions} del rol {roleName} ({roleId})",
@@ -81,13 +89,16 @@
   "admin.contextLink.help.detail": "Usa {'{{token}}'} para un payload completamente cifrado que la aplicación externa descifra con un secreto compartido. O usa variables individuales como {'{{email}}'}, {'{{phone}}'}, {'{{external_user_id}}'} para enlaces URL en texto plano hacia herramientas internas de confianza.",
   "admin.conversationStatus.name.description": "Establece el nombre del estado. Haz clic en guardar cuando termines.",
   "admin.conversationTags.edit.description": "Cambia el nombre de la etiqueta. Haz clic en guardar cuando termines.",
-  "admin.conversationTags.name.valid": "El nombre de la etiqueta debe tener al menos 3 caracteres",
   "admin.conversationTags.new.description": "Establece el nombre de la etiqueta. Haz clic en guardar cuando termines.",
   "admin.customAttribute.help": "Los atributos personalizados te ayudan a definir detalles adicionales sobre tus contactos o conversaciones, como el plan de suscripción o la fecha de su primera compra.",
   "admin.customAttributes.keyNotAllowed": "La clave proporcionada no está permitida ya que entra en conflicto con atributos predeterminados. Por favor usa una clave diferente.",
   "admin.customAttributes.regex.description": "Regex para validar el valor de este atributo personalizado. Deja vacío para omitir la validación.",
   "admin.customAttributes.regexHint.description": "Sugerencia del patrón regex.",
   "admin.empty": "Selecciona una sección de la barra lateral",
+  "admin.ai.toolsHelp": "Las herramientas permiten que el asistente llame a sus propias APIs para obtener o actualizar datos mientras responde. Una herramienta es compartida entre todos los asistentes a los que se les concede acceso a ella, y el modelo decide cuándo llamarlo desde el nombre y la descripción, así que manténgalos precisos.",
+  "admin.ai.positiveNumber": "Ingresa un número entero mayor que 0.",
+  "admin.ai.instructions": "Instrucciones personalizadas",
+  "admin.ai.vision": "El modelo soporta entrada de imagen",
   "admin.general.allowedFileUploadExtensions": "Extensiones de carga de archivo permitidas",
   "admin.general.allowedFileUploadExtensions.description": "Usa `*` para permitir todos los tipos de archivo. Por ejemplo: `jpg, png, pdf`",
   "admin.general.businessHours.placeholder": "Seleccionar horario de atención",
@@ -192,7 +203,6 @@
   "admin.inbox.livechat.noticeBanner.enabled": "Habilitar banner de aviso",
   "admin.inbox.livechat.noticeBanner.text": "Texto del banner de aviso",
   "admin.inbox.livechat.officeHours": "Horario de oficina",
-  "admin.inbox.livechat.prechatForm.addField": "Añadir campo",
   "admin.inbox.livechat.prechatForm.availableFields": "Atributos personalizados disponibles",
   "admin.inbox.livechat.prechatForm.enabled": "Habilitar formulario previo al chat",
   "admin.inbox.livechat.prechatForm.enabled.description": "Mostrar un formulario para recopilar información antes de que comience el chat",
@@ -367,9 +377,6 @@
   "agent.generateApiKey": "Generar clave API",
   "agent.new": "Nuevo agente",
   "agent.selectAvailabilityStatus": "Seleccionar estado de disponibilidad",
-  "ai.apiKey.description": "La clave API de {provider} no está configurada o no es válida. Por favor introduce una clave API válida para usar funciones de IA.",
-  "ai.apiKeyNotSet": "La clave API de {provider} no está configurada. Por favor pide a tu administrador que la configure",
-  "ai.enterOpenAIAPIKey": "Introduce la clave API de OpenAI",
   "auth.backToLogin": "Volver al inicio de sesión",
   "auth.checkEmailForReset": "Revisa tu correo electrónico para obtener el enlace de restablecimiento de contraseña.",
   "auth.confirmPassword": "Confirmar contraseña",
@@ -593,8 +600,6 @@
   "globals.messages.sendUsMessage": "Envíanos un mensaje",
   "globals.messages.sending": "Enviando...",
   "globals.messages.setUp": "Configurar",
-  "globals.messages.smallScreenDescription": "Libredesk está diseñado para pantallas más grandes. Para la mejor experiencia, utilice un escritorio o una tableta.",
-  "globals.messages.smallScreenTitle": "Cambia al escritorio para la mejor experiencia",
   "globals.messages.somethingWentWrong": "Algo salió mal",
   "globals.messages.startNewConversation": "Iniciar nueva conversación",
   "globals.messages.startTypingToSearch": "Comienza a escribir para buscar...",
@@ -873,31 +878,24 @@
   "replyBox.removeBCC": "Eliminar BCC",
   "replyBox.sendAnyway": "Enviar de todos modos",
   "replyBox.toRequired": "Se requiere al menos un destinatario en el campo Para.",
-  "report.agentStatus": "Estado del agente",
   "report.chart.newConversations": "Nuevas conversaciones",
   "report.chart.resolvedConversations": "Conversaciones resueltas",
-  "report.chart.title": "Tendencias de conversación",
   "report.csat.avgRating": "Calificación promedio",
-  "report.csat.cardTitle": "Satisfacción del cliente (últimos {days} días)",
   "report.csat.responseRate": "Tasa de respuesta",
   "report.csat.responses": "Respuestas",
-  "report.messages.cardTitle": "Volumen de mensajes (últimos {days} días)",
   "report.messages.incoming": "Entrantes",
   "report.messages.outgoing": "Salientes",
   "report.messages.perConversation": "Por conversación",
   "report.noTagsFound": "No se encontraron etiquetas",
-  "report.openConversations": "Conversaciones abiertas",
   "report.sla.avgFirstResp": "Promedio de tiempo de primera respuesta",
   "report.sla.avgNextResp": "Promedio de tiempo de siguiente respuesta",
   "report.sla.avgResolution": "Promedio de tiempo de resolución",
   "report.sla.breached": "Incumplido",
-  "report.sla.cardTitle": "Rendimiento SLA (últimos {days} días)",
   "report.sla.compliance": "Cumplimiento",
   "report.sla.firstResponse": "Primera respuesta",
   "report.sla.met": "Cumplido",
   "report.sla.nextResponse": "Siguiente respuesta",
   "report.sla.resolution": "Resolución",
-  "report.tags.cardTitle": "Distribución de etiquetas (últimos {days} días)",
   "report.tags.tagged": "Etiquetado",
   "report.tags.topTags": "Etiquetas principales",
   "role.deletionConfirmation": "Esta acción no se puede deshacer. Se eliminará permanentemente este rol.",
@@ -966,7 +964,6 @@
   "validation.invalidKey": "Clave no válida",
   "validation.invalidPermission": "Permiso no válido",
   "validation.invalidPortValue": "Valor de puerto no válido",
-  "validation.invalidProvider": "Proveedor no válido",
   "validation.invalidSnoozeDuration": "Duración de posposición no válida",
   "validation.invalidTimeFormat": "Formato de hora no válido (HH:mm)",
   "validation.invalidUrl": "URL no válida",
@@ -1000,11 +997,9 @@
   "validation.subjectCannotBeEmpty": "El asunto no puede estar vacío",
   "validation.tooLongStatus": "El estado es demasiado largo, debe tener como máximo {max} caracteres",
   "view.form.description": "Crea y guarda vistas de filtro personalizadas para acceso rápido a tus conversaciones.",
-  "view.form.filter.partiallyFilled": "Por favor asegúrate de haber llenado los campos del filtro correctamente.",
   "view.form.filter.selectAtLeastOne": "Selecciona al menos un filtro.",
   "view.form.filters.description": "Establece uno o más filtros para personalizar la vista.",
   "view.form.name.description": "Introduce un nombre único para tu vista.",
-  "view.form.name.length": "El nombre de la vista debe tener entre 2 y 30 caracteres.",
   "webhook.edit": "Editar webhook",
   "webhook.new": "Nuevo webhook",
   "webhook.sendTest": "Enviar prueba",
diff --git a/i18n/fa-IR.json b/i18n/fa-IR.json
index a04c8a48..f7258568 100644
--- a/i18n/fa-IR.json
+++ b/i18n/fa-IR.json
@@ -3,11 +3,9 @@
   "_.name": "فارسی",
   "account.avatarRemoved": "آواتار حذف شد",
   "account.changeAvatar": "آواتار خود را اینجا تغییر دهید.",
-  "account.chooseAFile": "یک فایل انتخاب کنید...",
   "account.cropAvatar": "برش آواتار",
   "account.editProfile": "ویرایش پروفایل",
   "account.publicAvatar": "آواتار عمومی",
-  "account.removeAvatar": "حذف آواتار",
   "actions.addAction": "افزودن عملیات",
   "actions.addCondition": "افزودن شرط",
   "actions.addTags": "افزودن برچسب‌ها",
@@ -81,7 +79,6 @@
   "admin.contextLink.help.detail": "از {'{{token}}'} برای ارسال بار رمزگذاری‌شده استفاده کنید که اپلیکیشن خارجی آن را با یک رمز مشترک رمزگشایی می‌کند. یا از متغیرهای جداگانه مانند {'{{email}}'}، {'{{phone}}'}، {'{{external_user_id}}'} برای لینک‌های URL ساده به ابزارهای داخلی مورد اعتماد استفاده کنید.",
   "admin.conversationStatus.name.description": "نام وضعیت را تنظیم کنید. پس از اتمام، ذخیره را کلیک کنید.",
   "admin.conversationTags.edit.description": "نام برچسب را تغییر دهید. پس از اتمام، ذخیره را کلیک کنید.",
-  "admin.conversationTags.name.valid": "نام برچسب باید حداقل 3 کاراکتر باشد",
   "admin.conversationTags.new.description": "نام برچسب را تنظیم کنید. پس از اتمام، ذخیره را کلیک کنید.",
   "admin.customAttribute.help": "ویژگی‌های سفارشی به شما کمک می‌کنند جزئیات اضافی درباره مخاطبان یا مکالمات خود تنظیم کنید، مانند طرح اشتراک یا تاریخ اولین خرید.",
   "admin.customAttributes.keyNotAllowed": "کلید ارائه‌شده مجاز نیست زیرا با ویژگی‌های پیش‌فرض تداخل دارد. لطفاً از کلید دیگری استفاده کنید.",
@@ -193,7 +190,6 @@
   "admin.inbox.livechat.noticeBanner.enabled": "فعال‌سازی بنر اعلان",
   "admin.inbox.livechat.noticeBanner.text": "متن بنر اعلان",
   "admin.inbox.livechat.officeHours": "ساعات اداری",
-  "admin.inbox.livechat.prechatForm.addField": "افزودن فیلد",
   "admin.inbox.livechat.prechatForm.availableFields": "ویژگی‌های سفارشی در دسترس",
   "admin.inbox.livechat.prechatForm.enabled": "فعال‌سازی فرم پیش از چت",
   "admin.inbox.livechat.prechatForm.enabled.description": "نمایش فرم برای جمع‌آوری اطلاعات قبل از شروع چت",
@@ -371,9 +367,6 @@
   "agent.generateApiKey": "تولید کلید API",
   "agent.new": "کارشناس جدید",
   "agent.selectAvailabilityStatus": "انتخاب وضعیت دسترسی",
-  "ai.apiKey.description": "کلید API {provider} تنظیم نشده یا نامعتبر است. لطفاً یک کلید API معتبر برای استفاده از ویژگی‌های هوش مصنوعی وارد کنید.",
-  "ai.apiKeyNotSet": "کلید API {provider} تنظیم نشده است. لطفاً از مدیر خود بخواهید آن را تنظیم کند",
-  "ai.enterOpenAIAPIKey": "کلید API OpenAI را وارد کنید",
   "auth.backToLogin": "بازگشت به ورود",
   "auth.checkEmailForReset": "ایمیل خود را برای لینک بازنشانی رمز عبور بررسی کنید.",
   "auth.confirmPassword": "تأیید رمز عبور",
@@ -592,8 +585,6 @@
   "globals.messages.sendUsMessage": "برای ما پیام بفرستید",
   "globals.messages.sending": "در حال ارسال...",
   "globals.messages.setUp": "راه‌اندازی",
-  "globals.messages.smallScreenDescription": "لیبردسک برای صفحه‌نمایش‌های بزرگ‌تر طراحی شده است. برای بهترین تجربه، لطفا از دسکتاپ یا تبلت استفاده کنید.",
-  "globals.messages.smallScreenTitle": "برای بهترین تجربه به دسکتاپ بروید",
   "globals.messages.somethingWentWrong": "مشکلی پیش آمد",
   "globals.messages.startNewConversation": "شروع مکالمه جدید",
   "globals.messages.startTypingToSearch": "برای جستجو شروع به تایپ کنید...",
@@ -886,32 +877,25 @@
   "replyBox.removeBCC": "حذف BCC",
   "replyBox.sendAnyway": "ارسال به هر حال",
   "replyBox.toRequired": "حداقل یک گیرنده در فیلد به الزامی است.",
-  "report.agentStatus": "وضعیت نماینده",
   "report.chart.newConversations": "مکالمات جدید",
   "report.chart.resolvedConversations": "مکالمات حل‌شده",
-  "report.chart.title": "روندهای مکالمه",
   "report.csat.avgRating": "میانگین امتیاز",
-  "report.csat.cardTitle": "رضایت مشتری (آخرین {days} روز)",
   "report.csat.responseRate": "نرخ پاسخ",
   "report.csat.responses": "پاسخ‌ها",
-  "report.messages.cardTitle": "حجم پیام (آخرین {days} روز)",
   "report.messages.incoming": "ورودی",
   "report.messages.outgoing": "خروجی",
   "report.messages.perConversation": "به ازای هر مکالمه",
   "report.messages.total": "کل",
   "report.noTagsFound": "برچسبی یافت نشد",
-  "report.openConversations": "مکالمات باز",
   "report.sla.avgFirstResp": "میانگین زمان پاسخ اول",
   "report.sla.avgNextResp": "میانگین زمان پاسخ بعدی",
   "report.sla.avgResolution": "میانگین زمان حل",
   "report.sla.breached": "نقض شد",
-  "report.sla.cardTitle": "عملکرد SLA (آخرین {days} روز)",
   "report.sla.compliance": "رعایت",
   "report.sla.firstResponse": "پاسخ اول",
   "report.sla.met": "برآورده شد",
   "report.sla.nextResponse": "پاسخ بعدی",
   "report.sla.resolution": "حل",
-  "report.tags.cardTitle": "توزیع برچسب (آخرین {days} روز)",
   "report.tags.tagged": "برچسب‌گذاری شده",
   "report.tags.topTags": "برچسب‌های برتر",
   "role.deletionConfirmation": "این عمل قابل بازگشت نیست. این نقش به طور دائم حذف خواهد شد.",
@@ -980,7 +964,6 @@
   "validation.invalidKey": "کلید نامعتبر",
   "validation.invalidPermission": "مجوز نامعتبر",
   "validation.invalidPortValue": "مقدار پورت نامعتبر",
-  "validation.invalidProvider": "ارائه‌دهنده نامعتبر",
   "validation.invalidSnoozeDuration": "مدت‌زمان تعویق نامعتبر",
   "validation.invalidTimeFormat": "فرمت زمان نامعتبر (HH:mm)",
   "validation.invalidUrl": "URL نامعتبر",
@@ -1014,11 +997,9 @@
   "validation.subjectCannotBeEmpty": "موضوع نمی‌تواند خالی باشد",
   "validation.tooLongStatus": "وضعیت خیلی طولانی است، حداکثر باید {max} کاراکتر باشد",
   "view.form.description": "ایجاد و ذخیره نمایش‌های فیلتر سفارشی برای دسترسی سریع به مکالمات شما.",
-  "view.form.filter.partiallyFilled": "لطفاً مطمئن شوید که فیلدهای فیلتر را به درستی پر کرده‌اید.",
   "view.form.filter.selectAtLeastOne": "حداقل یک فیلتر انتخاب کنید.",
   "view.form.filters.description": "یک یا چند فیلتر برای سفارشی‌سازی نمایش تنظیم کنید.",
   "view.form.name.description": "یک نام یکتا برای نمایش خود وارد کنید.",
-  "view.form.name.length": "نام نمایش باید بین 2 و 30 کاراکتر باشد.",
   "webhook.edit": "ویرایش webhook",
   "webhook.new": "webhook جدید",
   "webhook.sendTest": "ارسال آزمایشی",
diff --git a/i18n/fr-FR.json b/i18n/fr-FR.json
index 7cca0943..11131c31 100644
--- a/i18n/fr-FR.json
+++ b/i18n/fr-FR.json
@@ -3,17 +3,17 @@
   "_.name": "Français",
   "account.avatarRemoved": "Avatar supprimé",
   "account.changeAvatar": "Modifiez votre avatar ici.",
-  "account.chooseAFile": "Sélectionnez un fichier...",
   "account.cropAvatar": "Recadrer l'avatar",
   "account.editProfile": "Modifier votre profil",
   "account.publicAvatar": "Avatar public",
-  "account.removeAvatar": "Supprimer l’avatar",
   "actions.addAction": "Ajouter une action",
   "actions.addCondition": "Ajouter une condition",
   "actions.addTags": "Ajouter des étiquettes",
   "actions.addingPrivateNotes": "Ajout de notes privées",
   "actions.addPrivateNote": "Ajouter une note privée",
   "actions.applyMacro": "Appliquer la macro",
+  "actions.notify": "Avertir les agents",
+  "actions.openMacros": "Ouvrir les macros",
   "actions.assignAgent": "Affecter un agent",
   "actions.assignTeam": "Affecter une équipe",
   "actions.noActions": "Aucune action",
@@ -27,6 +27,7 @@
   "actions.setTags": "Définir les étiquettes",
   "actions.setValue": "Définissez une valeur",
   "actions.startingConversation": "Démarrage d'une conversation",
+  "actions.triggerWebhook": "Déclencher le webhook",
   "activityLog.agentAway": "{actorEmail} ({actorId}) a changé le statut de {targetEmail} ({targetId}) vers \"Absent\"",
   "activityLog.agentAwayReassign": "{actorEmail} ({actorId}) a changé le statut de {targetEmail} ({targetId}) vers \"Absent et réaffecter\"",
   "activityLog.agentAwayReassignSelf": "{actorEmail} ({actorId}) est absent et réaffecte",
@@ -36,6 +37,8 @@
   "activityLog.agentOnline": "{actorEmail} ({actorId}) a changé le statut de {targetEmail} ({targetId}) vers \"En ligne\"",
   "activityLog.agentOnlineSelf": "{actorEmail} ({actorId}) est en ligne",
   "activityLog.agentPasswordSet": "{actorEmail} ({actorId}) a défini le mot de passe de {targetEmail} ({targetId})",
+  "activityLog.contactDataExported": "{actorEmail} ({actorId}) a exporté les données du contact {contactEmail} ({contactId})",
+  "activityLog.contactDeleted": "{actorEmail} ({actorId}) a supprimé le contact {contactEmail} ({contactId})",
   "activityLog.entryType": "Type d'entrée du journal",
   "activityLog.entryType.agentAway": "Agent absent",
   "activityLog.entryType.agentAwayReassigned": "Agent absent et réaffecté",
@@ -44,6 +47,8 @@
   "activityLog.entryType.agentOnline": "Agent en ligne",
   "activityLog.entryType.agentPasswordSet": "Mot de passe de l'agent défini",
   "activityLog.entryType.agentRolePermissionsChanged": "Autorisations du rôle de l'agent modifiées",
+  "activityLog.entryType.contactDataExported": "Les données de contact ont été exportées",
+  "activityLog.entryType.contactDeleted": "Contact supprimé",
   "activityLog.rolePermissionsAdded": "{actorEmail} ({actorId}) a ajouté les permissions {permissions} au rôle {roleName} ({roleId})",
   "activityLog.rolePermissionsChanged": "{actorEmail} ({actorId}) a supprimé les permissions {removed} et ajouté les permissions {added} au rôle {roleName} ({roleId})",
   "activityLog.rolePermissionsRemoved": "{actorEmail} ({actorId}) a supprimé les permissions {permissions} du rôle {roleName} ({roleId})",
@@ -70,8 +75,13 @@
   "admin.automation.matchTheseRules": "Correspondre à ces règles",
   "admin.automation.newConversation.description": "Règles qui s'exécutent lorsqu'une nouvelle conversation est créée par un contact. Les conversations initiées par les agents ne déclenchent pas ces règles. Glisser-déposer pour réorganiser.",
   "admin.automation.noRulesFound": "Aucune règle trouvée",
+  "admin.automation.webhookEventNameHint": "Nom de l'événement envoyé dans le payload du webhook.",
   "admin.automation.or": "OU",
   "admin.automation.performTheseActions": "Effectuer les actions suivantes",
+  "admin.automation.previousAssignedTeam": "Équipe affectée précédemment",
+  "admin.automation.previousAssignedUser": "Utilisateur affecté précédemment",
+  "admin.automation.previousPriority": "Priorité précédente",
+  "admin.automation.previousStatus": "Statut précédent",
   "admin.automation.timeTriggers": "Déclencheurs de temps",
   "admin.automation.timeTriggers.description": "Règles qui s'exécutent une fois par heure.",
   "admin.automation.validation.addAction": "Veuillez ajouter au moins une action.",
@@ -99,12 +109,159 @@
   "admin.customAttributes.regex.description": "Expression régulière pour valider la valeur de cet attribut personnalisé. Laissez vide pour ignorer la validation.",
   "admin.customAttributes.regexHint.description": "Indice concernant le motif de l'expression régulière.",
   "admin.empty": "Sélectionnez une section dans la barre latérale",
+  "admin.ai.title": "IA",
+  "admin.ai.providersHelp": "Fonctionne avec n'importe quelle API compatible OpenAI.",
+  "admin.ai.snippetsHelp": "Les extraits sont la base de connaissances que l'assistant recherche pour répondre aux questions.",
+  "admin.ai.toolsHelp": "Les outils permettent aux assistants IA d'appeler vos propres API pour récupérer ou mettre à jour les données pendant la réponse. Un outil est partagé entre tous les assistants qui y ont accès et le modèle décide quand l'appeler à partir du nom et de la description, il est donc conseiller de définir les valeurs les plus précises possibles pour ces champs.",
+  "admin.ai.assistantsHelp": "Les assistants répondent aux conversations que vous leur transmettez avec une règle d'automatisation, et passent le relai à un humain lorsqu'ils ne sont pas en mesure de traiter la demande. Chacun a sa propre personalité, ses instructions et ses propres outils, et ils consultent tous la même base de connaissances.",
+  "admin.ai.preset": "Préréglage",
+  "admin.ai.presetHint": "Préremplit l'URL de base et le modèle d'un fournisseur commun. Vous pourrez toujours modifier n'importe quel champ.",
+  "admin.ai.completion": "Suggestions",
+  "admin.ai.embedding": "Représentation vectorielle",
+  "admin.ai.snippets": "Extrait | Extraits",
+  "admin.ai.tools": "Outils",
+  "admin.ai.suggestions": "Suggestions",
+  "admin.ai.suggestion.source": "Source",
+  "admin.ai.suggestion.viewSource": "Voir la conversation",
+  "admin.ai.suggestion.review": "Évaluer la suggestion",
+  "admin.ai.suggestion.approved": "Suggestion approuvée et ajoutée aux extraits",
+  "admin.ai.suggestion.rejected": "Suggestion rejetée",
+  "admin.ai.snippet.autoCreated": "Créé automatiquement",
+  "admin.ai.snippet.imported": "Importé",
+  "admin.ai.snippet.importUrl": "Importer depuis une URL",
+  "admin.ai.snippet.importUrlPlaceholder": "https://exemple.com/aide/article",
+  "admin.ai.snippet.titlePlaceholder": "Politique de remboursement",
+  "admin.ai.snippet.contentPlaceholder": "Nous vous remboursons sans condition dans les 30 jours suivant votre achat, pour en bénéficier...",
+  "admin.ai.snippet.contentHint": "L'assistant recherche ce texte pour répondre aux questions du client, alors écrivez-le comme une réponse complète plutôt que comme un morceau de réponse.",
+  "admin.ai.faqLearning.title": "Apprendre à partir de conversations résolues",
+  "admin.ai.faqLearning.description": "Lorsque cette option est activée, de nouvelles suggestions apparaissent ici pour que vous puissiez les vérifier.",
+  "admin.ai.faqLearning.help": "Les suggestions sont rédigées à partir de conversations résolues où un agent humain a donné une réponse réutilisable. Examinez chacun d'eux : l'approuver ajoute un extrait que l'assistant pourra utiliser.",
+  "admin.ai.baseUrl": "URL de base",
+  "admin.ai.baseUrlHint": "URL de base de l'API compatible OpenAI. Laissez vide pour utiliser la valeur par défaut d'OpenAI.",
+  "admin.ai.apiKeyPlaceholder": "Laissez vide pour supprimer la clé enregistrée",
+  "admin.ai.reservedSecretPrefix": "La valeur ne peut pas débuter par \"enc:\". Ce préfixe est réservé aux secrets chiffrés.",
+  "admin.ai.dimensions": "Dimensions",
+  "admin.ai.dimensionsHint": "Doit correspondre à la taille de sortie du modèle (par exemple « 1536 » pour le modèle « text-embedding-3-small »). Les extraits existants sont retraités par le modèle de représentation vectorielle après avoir modifié ce paramètre.",
+  "admin.ai.temperature": "Température",
+  "admin.ai.temperatureRange": "La température doit être un nombre compris entre 0 et 2.",
+  "admin.ai.positiveNumber": "Entrez un nombre entier supérieur à 0.",
+  "admin.ai.maxTokens": "Nombre maximal de jetons",
+  "admin.ai.reasoningEffort": "Effort de raisonnement",
+  "admin.ai.reasoningEffortHint": "Laissez vide pour la plupart des modèles. Valeurs acceptées : « none », « low », « medium » ou « high ».",
+  "admin.ai.instructions": "Instructions personnalisées",
+  "admin.ai.instructionsHint": "Ajouté aux invites IA. Utilisez-le pour définir le ton et le format, par exemple « Garde les réponses sous 3 phrases ».",
+  "admin.ai.vision": "Le modèle prend en charge la soumission d'images",
+  "admin.ai.visionHint": "Activer uniquement si le modèle de complétion peut lire les images. Lorsque activé, les pièces jointes des clients sont envoyées au modèle. Lorsque désactivé, les images ne sont jamais envoyées.",
+  "admin.ai.completionDescription": "Le modèle utilisé pour rédiger des réponses et alimenter le copilote.",
+  "admin.ai.embeddingDescription": "Le modèle utilisé pour la représentation vectorielle des articles et des extraits pour la recherche.",
+  "admin.ai.testConnection": "Tester la connexion",
+  "admin.ai.testSuccess": "Connexion réussie. Le fournisseur a accepté la requête.",
+  "admin.ai.tool.nameHint": "Lettres, chiffres, tirets et trait de soulignement uniquement, limité à 64 caractères.",
+  "admin.ai.tool.method": "Méthode",
+  "admin.ai.tool.headers": "En-têtes",
+  "admin.ai.tool.headersHint": "Envoyé avec chaque requête vers cet outil. Les valeurs sont chiffrées au repos.",
+  "admin.ai.tool.headersInvalid": "Entrez à la fois un nom et une valeur pour chaque en-tête, ou supprimez ceux incomplets.",
+  "admin.ai.tool.headerSecretMissing": "Cette en-tête n'a pas de valeur enregistrée. Le renommage d'une en-tête ne conserve pas son secret stocké. Entrez la valeur à nouveau.",
+  "admin.ai.tool.headerKeyPlaceholder": "Authorization",
+  "admin.ai.tool.headerValuePlaceholder": "Bearer xxx",
+  "admin.ai.tool.addHeader": "Ajouter une en-tête",
+  "admin.ai.tool.descriptionPlaceholder": "Recherche le statut et la date de livraison d'une commande par numéro de commande.",
+  "admin.ai.tool.descriptionHint": "La modèle lit cette description afin de déterminer lorsque l'outil doit être appelé, décrivez donc précisément ce qu'il fait et quand il doit être utilisé.",
+  "admin.ai.tool.parameters": "Paramètres (schéma JSON)",
+  "admin.ai.tool.parametersHint": "Arguments que le modèle peut passer lors de l'appel à cet outil. Laissez vide pour une seule entrée de texte.",
+  "admin.ai.tool.parametersInvalid": "JSON invalide. Vérifiez qu'aucune virgule, guillemet ou parenthèse ne soit manquante.",
+  "admin.ai.tool.new": "Nouvel outil",
+  "admin.ai.tool.edit": "Modifier l'outil",
+  "admin.ai.tool.deleteConfirmation": "Cela supprimera définitivement l'outil.",
+  "admin.ai.tool.reservedName": "Ce nom est déjà utilisé par un outil intégré. Choisissez un nom différent.",
+  "admin.ai.tool.requireVerification": "Nécessite un contact vérifié",
+  "admin.ai.tool.requireVerificationHint": "L'assistant doit vérifier l'identité du client en lui envoyant un code de vérification par email avant que cet outil puisse être appelé.",
+  "admin.ai.tool.turnOffVerificationTitle": "Désactiver l'identification client ?",
+  "admin.ai.tool.turnOffVerificationBody": "Avec la vérification activée, Libredesk envoie au client un code à usage unique par email et n'exécute cet outil qu'après l'avoir saisi. Le désactiver permet à n'importe qui dans le chat de déclencher l'outil.",
+  "admin.ai.tool.turnOffVerificationEndpoint": "Si l'outil accède à des données sensibles ou effectue des actions, votre point de terminaison doit lui-même identifier le client. Chaque requête contient une en-tête « X-Libredesk-Contact-Verified ».",
+  "admin.ai.tool.keepVerificationOn": "Garder l'identification active",
+  "admin.ai.tool.turnOffVerification": "Désactiver",
+  "admin.ai.snippet.new": "Nouvel extrait",
+  "admin.ai.snippet.edit": "Modifier l'extrait",
+  "admin.ai.snippet.deleteConfirmation": "L'extrait sera définitivement supprimé.",
+  "admin.ai.assistants": "Assistants",
+  "admin.ai.assistant.new": "Nouvel assistant",
+  "admin.ai.assistant.edit": "Modifier l'assistant",
+  "admin.ai.assistant.deleteConfirmation": "L'assistant sera définitivement supprimé.",
+  "admin.ai.assistant.nameHint": "Le nom que voient les clients lorsqu'ils discutent avec cet assistant.",
+  "admin.ai.assistant.descriptionPlaceholder": "Traite les questions relatives à l'état de la commande et aux retours",
+  "admin.ai.assistant.descriptionHint": "À usage interne uniquement. Non visible par les clients.",
+  "admin.ai.assistant.expectationPlaceholder": "Je suis un assistant IA. Un agent humain peut rejoindre la conversation si besoin.",
+  "admin.ai.assistant.instructionsPlaceholder": "Toujours confirmer le numéro de commande avant de rechercher quoi que ce soit. Évite les réponses de plus de 3 phrases.",
+  "admin.ai.assistant.guardrailsPlaceholder": "Ne jamais émettre de remboursement sans l’approbation d’un agent humain. Ne jamais partager les détails de la commande d’autres clients.",
+  "admin.ai.assistant.avatar": "Avatar",
+  "admin.ai.assistant.tone": "Ton",
+  "admin.ai.assistant.toneOption.friendly": "Amical",
+  "admin.ai.assistant.toneOption.professional": "Professionnel",
+  "admin.ai.assistant.toneOption.neutral": "Neutre",
+  "admin.ai.assistant.toneOption.casual": "Décontracté",
+  "admin.ai.assistant.responseLength": "Longueur de la réponse",
+  "admin.ai.assistant.responseLengthOption.concise": "Concise",
+  "admin.ai.assistant.responseLengthOption.balanced": "Équilibrée",
+  "admin.ai.assistant.responseLengthOption.detailed": "Détaillée",
+  "admin.ai.assistant.maxTurns": "Nombre maximal de tours",
+  "admin.ai.assistant.maxTurnsHint": "Nombre maximal d'allers-retours avant que l'assistant transmette la conversation à un humain. Entre 1 et 20.",
+  "admin.ai.assistant.fallbackTeam": "Équipe de repli",
+  "admin.ai.assistant.fallbackTeamHint": "Équipe à laquelle la conversation est transmise lorsque l'assistant ne peut pas aider.",
+  "admin.ai.assistant.languagesPlaceholder": "Saisissez une langue et appuyez sur Entrée",
+  "admin.ai.assistant.languagesHint": "Langues dans lesquelles l'assistant est autorisé à répondre. L'agent utilisera la langue du client si elle se trouve dans cette liste, dans le cas contraire il utilisera la première de la liste. Laisser vide pour toujours utiliser la langue du client.",
+  "admin.ai.assistant.offerHandoff": "Proposer de transmettre la conversation à un humain",
+  "admin.ai.assistant.offerHandoffHint": "Lorsque désactivé, l'assistant ne proposera jamais de transmettre la conversation à un humain et indiquera qu'il n'est pas en mesure de répondre à une question en dehors de son champ de compétences. ",
+  "admin.ai.assistant.instructions": "Consignes",
+  "admin.ai.assistant.instructionsHint": "Invite personnalisée indiquant la façon dont cet assistant répond.",
+  "admin.ai.assistant.guardrails": "Garde-fous",
+  "admin.ai.assistant.guardrailsHint": "Liste de règles que l'assistant ne doit jamais enfreindre.",
+  "admin.ai.assistant.expectation": "Message d'attente",
+  "admin.ai.assistant.expectationHint": "Affiché au client pendant que cet assistant prend en charge la conversation. Disparaît lorsque la conversation est transmise à un humain.",
+  "admin.ai.assistant.tools": "Outils",
+  "admin.ai.assistant.toolsHint": "Outils que cet assistant est autorisé à appeler. Il ne peut utiliser que ceux que vous autorisez ici. Les extraits de connaissances sont partagés automatiquement entre tous les assistants.",
+  "admin.ai.assistant.toolsEmpty": "Pas encore d'outils. Créez des outils dans le menu « IA » pour les autoriser ici.",
+  "admin.ai.assistant.tabs.settings": "Paramètres",
+  "admin.ai.assistant.tabs.test": "Tester",
+  "admin.ai.assistant.tabs.performance": "Performances",
+  "admin.ai.assistant.stats.title": "Statistiques",
+  "admin.ai.assistant.stats.conversations": "Conversations",
+  "admin.ai.assistant.stats.replies": "Réponses",
+  "admin.ai.assistant.stats.csat": "CSAT moyen",
+  "admin.ai.assistant.stats.resolutionRate": "Taux de résolution",
+  "admin.ai.assistant.stats.handoffRate": "Taux de transmission",
+  "admin.ai.assistant.stats.reopenRate": "Taux réouverture",
+  "admin.ai.assistant.stats.depth": "Réponses par conversation",
+  "admin.ai.assistant.stats.csatPositive": "Score CSAT positif",
+  "admin.ai.assistant.preview.title": "Tester l'assistant",
+  "admin.ai.assistant.preview.placeholder": "Saisissez un exemple de message client",
+  "admin.ai.assistant.preview.run": "Tester",
+  "admin.ai.assistant.preview.shortcutHint": "Ctrl + Entrée pour tester",
+  "admin.ai.assistant.preview.replyLabel": "Brouillon de réponse",
+  "admin.ai.assistant.preview.sources": "Connaissances utilisées",
+  "admin.ai.assistant.preview.empty": "Le brouillon apparaîtra ici.",
+  "copilot.title": "Copilote",
+  "copilot.details": "Détails",
+  "copilot.placeholder": "Posez une question…",
+  "copilot.emptyState": "Demandez à {name} . Il peut chercher dans votre base de connaissances pour répondre.",
+  "copilot.thinking": "En train de réfléchir…",
+  "copilot.clearChat": "Effacer le tchat",
+  "copilot.preset.summarize": "Résumer cette conversation",
+  "copilot.preset.customerAsking": "Que demande le client ?",
+  "copilot.insertIntoReply": "Insérer dans la réponse",
+  "copilot.addAsPrivateNote": "Ajouter comme note privée",
+  "copilot.copyFailed": "Impossible de copier dans le presse-papiers.",
+  "copilot.noteAdded": "Ajouté en tant que note privée.",
+  "replyBox.generateReply": "Générer une réponse",
+  "globals.terms.model": "Modèle",
   "admin.general.allowedFileUploadExtensions": "Extensions de fichiers autorisées",
   "admin.general.allowedFileUploadExtensions.description": "Utilisez `*` pour autoriser tous les types de fichiers. Par exemple : `jpg, png, pdf`",
   "admin.general.businessHours.placeholder": "Sélectionner les heures d'ouverture",
   "admin.general.faviconURL": "URL de la favicon",
   "admin.general.faviconURL.valid": "L'URL de la favicon doit être une URL valide",
   "admin.general.help": "Ce sont les paramètres par défaut de votre centre d'assistance. Les paramètres des équipes l'emporteront sur ceux-ci lorsqu'ils seront définis.",
+  "admin.helpCenter.help": "Créez des centres d'aide publics où les clients naviguent et recherchent des articles. Les articles publiés peuvent également être utilisés par l'agent IA pour répondre aux conversations.",
+  "admin.helpCenter.treeHelp": "Groupez les articles dans des catégories. Faites glisser un article pour modifier l'ordre dans lequel il sera affiché.",
   "admin.general.language.placeholder": "Sélectionnez votre \nlangue",
   "admin.general.logoURL.valid": "L'URL du logo doit être valide",
   "admin.general.maxAllowedFileUploadSize": "Taille maximale de téléversement de fichiers",
@@ -114,6 +271,8 @@
   "admin.general.rootURL.valid": "L'URL racine doit être une URL valide",
   "admin.general.siteName": "Nom du site",
   "admin.general.siteName.min": "Le nom du site doit comporter au moins 1 caractère",
+  "admin.general.showConversationSubject": "Afficher l'objet dans la liste des conversations",
+  "admin.general.showConversationSubject.description": "Affiche l'objet de la conversation dans la liste des conversations lorsque disponible.",
   "admin.general.timezone.placeholder": "Sélectionnez un fuseau horaire",
   "admin.inbox.authProtocol": "Protocole d’authentification",
   "admin.inbox.authProtocol.description": "Protocole d'authentification à utiliser.",
@@ -122,10 +281,10 @@
   "admin.inbox.chooseChannel": "Choisir le canal",
   "admin.inbox.createEmailInbox": "Créer une boîte de réception email pour le support client par email",
   "admin.inbox.createLiveChatInbox": "Créer une boîte de réception de chat en direct pour le support client en temps réel",
-  "admin.inbox.csatSurveys": "Enquêtes CSAT",
+  "admin.inbox.csatSurveys": "Questionnaire de satisfaction utilisateur (CSAT)",
   "admin.inbox.csatSurveys.description_1": "Envoyer des enquêtes de satisfaction aux clients lorsque la conversation est marquée comme résolue.",
   "admin.inbox.csatSurveys.description_2": "Pour mieux contrôler le moment où les enquêtes sont envoyées, désactivez cette option et créez une règle d'automatisation pour l'envoi des enquêtes.",
-  "admin.inbox.csatSurveys.description_3": "Les enquêtes CSAT ne sont envoyées qu'une seule fois par conversation.",
+  "admin.inbox.csatSurveys.description_3": "Les questionnaires de satisfaction utilisateur (CSAT) ne sont envoyées qu'une seule fois par conversation.",
   "admin.inbox.enablePlusAddressing": "Activer l'adressage plus",
   "admin.inbox.enablePlusAddressing.description": "Améliore le fil de conversation mais nécessite le support du fournisseur (ex : Gmail, Microsoft 365).",
   "admin.inbox.enablePlusAddressing.requiredForMicrosoft": "Requis pour les boîtes de réception Microsoft afin que les fils de discussion s'affichent correctement.",
@@ -153,6 +312,7 @@
   "admin.inbox.livechat.chatReplyExpectationMessage": "Message d'attente de réponse du chat",
   "admin.inbox.livechat.chatReplyExpectationMessage.description": "Message affiché aux clients pendant les heures d'ouverture concernant les délais de réponse attendus.",
   "admin.inbox.livechat.colors": "Couleurs",
+  "admin.inbox.livechat.colors.primary.contrastWarning": "La couleur principale est proche de la couleur d'arrière-plan du widget. Les boutons et les bulles de message peuvent être difficiles à voir. Choisissez une couleur avec plus de contraste.",
   "admin.inbox.livechat.continuity.maxMessagesPerEmail": "Max. messages par email",
   "admin.inbox.livechat.continuity.maxMessagesPerEmail.description": "Nombre maximum de messages à inclure dans un seul email de suivi. Maximum 100.",
   "admin.inbox.livechat.continuity.minEmailInterval": "Intervalle min. entre emails",
@@ -177,8 +337,10 @@
   "admin.inbox.livechat.features.fileUpload.description": "Permettre aux utilisateurs de téléverser des fichiers dans le chat",
   "admin.inbox.livechat.greetingMessage": "Message de bienvenue",
   "admin.inbox.livechat.greetingMessage.variables": "Variables disponibles : {'{{.FirstName}}'}, {'{{.LastName}}'}. Utilisez {'|'} comme valeur par défaut, par ex. Bonjour {'{{.FirstName | à vous}}'}",
+  "admin.inbox.livechat.homeApps.incomplete": "Complétez ou retirez les applications incomplètes de l'écran d'accueil",
   "admin.inbox.livechat.homeScreen.fadeBackground": "Fondu d'arrière-plan",
   "admin.inbox.livechat.homeScreen.fadeBackground.description": "Fondre l'arrière-plan de l'en-tête dans la zone de contenu en dessous",
+  "admin.inbox.livechat.homeScreen.headerTextColor.contrastWarning": "Les couleurs du texte de l'en-tête et celle de l'arrière-plan sont trop proches. Le texte d'accueil peut être difficile à lire. Changez la couleur du texte celle d'arrière-plan.",
   "admin.inbox.livechat.homeScreen.headerTextColor.description": "Couleur du texte d'accueil et d'introduction sur l'écran d'accueil",
   "admin.inbox.livechat.installation.identity.addJwt": "Ajoutez le JWT signé à LibredeskSettings :",
   "admin.inbox.livechat.installation.identity.description": "Vérifier les utilisateurs connectés afin d'être certains que les conversations soient liées à leurs comptes réels et que les utilisateurs ne puissent pas usurper l'identité d'un autre.",
@@ -206,7 +368,6 @@
   "admin.inbox.livechat.noticeBanner.enabled": "Activer la bannière d'avis",
   "admin.inbox.livechat.noticeBanner.text": "Texte de la bannière d'avis",
   "admin.inbox.livechat.officeHours": "Heures d'ouverture",
-  "admin.inbox.livechat.prechatForm.addField": "Ajouter un champ",
   "admin.inbox.livechat.prechatForm.availableFields": "Attributs personnalisés disponibles",
   "admin.inbox.livechat.prechatForm.enabled": "Activer le formulaire pré-chat",
   "admin.inbox.livechat.prechatForm.enabled.description": "Afficher un formulaire pour collecter des informations avant le début du chat",
@@ -218,8 +379,12 @@
   "admin.inbox.livechat.preventMultipleConversations.visitors.description": "Empêcher les visiteurs de démarrer plusieurs conversations simultanément",
   "admin.inbox.livechat.preventReplyToClosedConversation": "Empêcher les réponses aux conversations fermées",
   "admin.inbox.livechat.preventReplyToClosedConversation.description": "Lorsque activé, les utilisateurs ne peuvent pas répondre aux conversations fermées",
+  "admin.inbox.livechat.preview": "Aperçu",
+  "admin.inbox.livechat.preview.sampleAgentReply": "Bonjour ! Je suis Martin. Pourriez-vous me communiquer votre adresse email ?",
+  "admin.inbox.livechat.preview.sampleUserMessage": "Bonjour, je n'arrive pas à me connecter à mon compte.",
   "admin.inbox.livechat.secretKey": "Clé secrète",
   "admin.inbox.livechat.secretKey.description": "Définissez une clé secrète pour sécuriser le widget de chat.",
+  "admin.inbox.livechat.secretKey.weak": "Ce secret est court, ce qui affaiblit la signature JWT. Utilisez au moins 32 caractères aléatoires.",
   "admin.inbox.livechat.sessionDuration.description": "Durée maximale d'inactivité des sessions utilisateur. Minimum 1 heure. Exemple : 24h, 168 h, 720h, 2160h.",
   "admin.inbox.livechat.sessionDuration.label": "Durée de session des utilisateurs authentifiés",
   "admin.inbox.livechat.showOfficeHoursAfterAssignment": "Afficher les heures d'ouverture après affectation d'équipe",
@@ -268,6 +433,11 @@
   "admin.inbox.replyToAddress": "Adresse de réponse (optionnel)",
   "admin.inbox.replyToAddress.description": "Adresse recevant la réponse du client. Nécessaire seulement lorsque l'en-tête SMTP « From » et la boîte de réception IMAP utilisent des domaines différents.",
   "admin.inbox.replyToAddress.placeholder": "support{'@'}exemple.com",
+  "admin.inbox.fromNameTemplate": "Modèle de nom d'expéditeur",
+  "admin.inbox.fromNameTemplate.description": "Nom à afficher comme expéditeur des emails sortants. Laissez vide pour utiliser l'adresse d'expédition (From).",
+  "admin.inbox.fromNameTemplate.variables": "Variables : {'{{ .Agent.FirstName }}'}, {'{{ .Agent.LastName }}'}, {'{{ .Agent.FullName }}'}, {'{{ .Inbox.Name }}'}.",
+  "admin.inbox.fromNameTemplate.placeholder": "{'{{ .Agent.FirstName }} de {{ .Inbox.Name }}'}",
+  "admin.inbox.fromNameTemplate.invalidTemplate": "Modèle invalide. Veuillez vérifier que vous utilisez uniquement les variables supportées et que les accolades sont correctement fermées.",
   "admin.inbox.skipTLSVerification": "Sauter la vérification TLS",
   "admin.inbox.skipTLSVerification.description": "Ignorer la vérification du nom d'hôte sur le certificat TLS.",
   "admin.inbox.smtpConfig": "Configuration SMTP",
@@ -291,6 +461,8 @@
   "admin.role.contactNotes.read": "Voir les Notes du Contact",
   "admin.role.contactNotes.write": "Ajouter des Notes au Contact",
   "admin.role.contacts.block": "Bloquer les contacts",
+  "admin.role.contacts.delete": "Supprimer des contacts",
+  "admin.role.contacts.export": "Exporter les données des contacts",
   "admin.role.contacts.read": "Voir les Détails du Contact",
   "admin.role.contacts.readAll": "Afficher tous les contacts",
   "admin.role.contacts.write": "Modifier les détails du contact",
@@ -310,11 +482,13 @@
   "admin.role.customAttributes.manage": "Gérer les attributs personnalisés",
   "admin.role.generalSettings.manage": "Paramètres généraux",
   "admin.role.help": "Gérez les rôles et leurs permissions pour un contrôle précis de votre service d'assistance.",
+  "admin.role.helpCenter.manage": "Gérer les centres d'aide",
   "admin.role.inboxes.manage": "Gérer les boîtes de réception",
   "admin.role.macros.manage": "Gérer les macros",
   "admin.role.messages.read": "Voir les messages de conversation",
   "admin.role.messages.write": "Envoyer des messages dans les conversations",
   "admin.role.messages.writeAsContact": "Envoyer des messages en tant que contact",
+  "admin.role.messages.writePrivate": "Ajouter des notes privées dans les conversations",
   "admin.role.notificationSettings.manage": "Gérer les paramètres de notification",
   "admin.role.oidc.manage": "Gérer la configuration SSO",
   "admin.role.reports.manage": "Gestion des Rapports",
@@ -389,10 +563,32 @@
   "agent.edit": "Modifier l'agent",
   "agent.generateApiKey": "Générer une clé API",
   "agent.new": "Nouvel agent",
-  "agent.selectAvailabilityStatus": "Sélectionner le statut de disponibilité",
-  "ai.apiKey.description": "{provider} La clé API n'est pas définie ou n'est pas valide. Veuillez saisir une clé API valide pour utiliser les fonctionnalités de l'IA.",
-  "ai.apiKeyNotSet": "{provider} La clé API n'est pas définie, veuillez demander à votre administrateur de la définir",
-  "ai.enterOpenAIAPIKey": "Saisir la clé API OpenAI",
+  "agent.selectAvailabilityStatus": "Sélectionnez l'état de disponibilité",
+  "ai.apiKeyNotSet": "La clé API du fournisseur d'IA n'est pas définie. Demandez à votre administrateur de l'ajouter dans les paramètres.",
+  "ai.invalidAPIKey": "Le fournisseur d'IA a rejeté la clé API. Les fonctionnalités IA ne fonctionneront pas tant que votre administrateur ne la mettra pas à jour dans les paramètres.",
+  "ai.rateLimited": "Le fournisseur d'AI limite les requêtes. Attendez une minute et réessayez.",
+  "ai.providerUnavailable": "Le fournisseur d'IA n'a pas pu être joint. Réessayez dans quelques minutes ou demandez à votre administrateur de vérifier les paramètres.",
+  "ai.providerTimeout": "Le fournisseur d'IA a mis trop de temps à répondre. Réessayez, ou essayez une requête plus courte.",
+  "ai.emptyResponse": "L'AI a renvoyé une réponse vide. Rien n'a été généré. Réessayez ou reformulez votre demande.",
+  "ai.faqAlreadyReviewed": "Cette suggestion a déjà été évaluée.",
+  "ai.noAnswerWithinSteps": "L'IA a atteint sa limite de nombre d'étapes avant de répondre. Essayez une requête plus simple, ou demandez à un administrateur d'augmenter la limite.",
+  "ai.agent.handoffDefault": "L'assistant d'IA a transmis cette conversation à un humain.",
+  "ai.agent.handoffMaxTurns": "L'assistant d'IA a atteint sa limite de nombre de réponses pour cette conversation et l'a transmise à un humain.",
+  "ai.agent.handoffError": "L'assistant d'IA n'a pas été en mesure de répondre à cette conversation et l'a transmise à un humain.",
+  "ai.agent.handoffNoAnswer": "L'assistant d'IA n'a pas trouvé de réponse pour cette conversation et l'a transmise à un humain.",
+  "ai.agent.handoffOtherParticipant": "Quelqu'un d'autre que le contact a répondu à cette conversation, l'assistant IA l'a donc transmise à un humain.",
+  "ai.agent.verificationEmailSubject": "Votre code de vérification",
+  "ai.agent.verificationEmailBody": "Votre code de vérification est {code}. Il expire dans 10 minutes. Si vous ne l'avez pas demandé, vous pouvez ignorer cet email.",
+  "ai.testDimensionsMismatch": "Le fournisseur a retourné des vecteurs de dimension {returned} alors que les dimensions du modèle sont définies à {configured}. Réglez les dimensions à {returned} ou la recherche ne fonctionnera pas.",
+  "ai.summaryNoteTitle": "Résumé IA",
+  "ai.urlImport.invalidUrl": "Saisissez une URL HTTP ou HTTPS valide.",
+  "ai.urlImport.fetchFailed": "La page n'a pas pu être récupérée. Vérifiez que l'URL est accessible et réessayez.",
+  "ai.urlImport.noContent": "Aucun contenu lisible n'a été trouvé à cette URL.",
+  "ai.urlImport.unsupportedContentType": "Cette URL ne renvoie pas de page web, et ne peut donc pas être importée. Entrez un lien vers une page HTML ou ajoutez le contenu manuellement en tant qu'extrait.",
+  "ai.summarizeEmptyConversation": "Il n'y a pas encore de message à résumer.",
+  "ai.assistantUnavailable": "L'assistant sélectionné n'est pas disponible. Il a peut-être été supprimé ou désactivé. Choisissez un autre assistant ou utilisez le copilote par défaut.",
+  "ai.noTagsConfigured": "Aucune étiquette n'existe encore. Les suggestions d'étiquettes nécessitent des étiquettes existantes. Demandez à un administrateur de les créer.",
+  "ai.tagSuggestEmptyConversation": "Il n'y a pas encore de messages pour lesquels suggérer des étiquettes.",
   "auth.backToLogin": "Retour à la page de connexion",
   "auth.checkEmailForReset": "Vérifie tes e-mails pour trouver le lien de réinitialisation de ton mot de passe.",
   "auth.confirmPassword": "Confirmez le mot de passe",
@@ -406,6 +602,11 @@
   "auth.invalidResetLink": "Lien de réinitialisation invalide. Veuillez demander un nouveau lien de réinitialisation de mot de passe.",
   "auth.loggingIn": "Connexion à...",
   "auth.newPassword": "Nouveau mot de passe",
+  "auth.oidcAccessDenied": "La connexion a été annulée ou refusée par le fournisseur d'identité. Essayez de vous connecter à nouveau.",
+  "auth.oidcInvalidClient": "La connexion est indisponible en raison d'un problème de configuration. Demandez à votre administrateur de vérifier l'ID client SSO et le secret.",
+  "auth.oidcLoginFailed": "Échec de la connexion. Réessayez et contactez votre administrateur si cela se reproduit.",
+  "auth.oidcNoAccount": "Il n'y a pas de compte d'agent pour l'email retourné par votre fournisseur SSO. Contactez votre administrateur.",
+  "auth.oidcSessionExpired": "Votre session a expiré. Veuillez vous connecter à nouveau.",
   "auth.orContinueWith": "Ou continuer avec",
   "auth.passwordRequired": "Mot de passe requis.",
   "auth.passwordSetSuccess": "Vous pouvez maintenant vous connecter avec votre nouveau mot de passe.",
@@ -426,10 +627,10 @@
   "businessHour.newHoliday": "Nouveau jour férié",
   "command.navigate": "Naviguer",
   "command.noCommandAvailable": "Aucune commande disponible",
-  "command.pickSnoozeTime": "Choisir une heure de réveil",
+  "command.pickSnoozeTime": "Mettre en sommeil",
   "command.replyPreview": "Aperçu de la réponse",
   "command.selectAMacro": "Sélectionnez une macro pour afficher les détails",
-  "command.snoozeFor": "Reporter de",
+  "command.snoozeFor": "Mettre en sommeil pour...",
   "command.typeCmdOrSearch": "Tapez une commande ou recherchez...",
   "confirm.deleteContextLink": "Cette action est irréversible. Ce lien contextuel sera définitivement supprimé.",
   "confirm.deleteInbox": "Cette action est irréversible. Cette boîte de réception sera définitivement supprimée.",
@@ -445,7 +646,10 @@
   "contact.blockConfirm": "Êtes-vous sûr de vouloir bloquer ce contact ? Il ne pourra plus discuter et les e-mails entrants provenant de son adresse seront rejetés. Cela bloque également les e-mails entrants de tout autre contact utilisant la même adresse.",
   "contact.blockContact": "Bloquer le contact",
   "contact.blockedSuccessfully": "Contact bloqué avec succès",
+  "contact.deleteConfirm": "Êtes-vous sûr de vouloir supprimer ce contact ? Toutes ses conversations, messages, notes et pièces jointes seront définitivement supprimées. Cette opération ne peut pas être annulé.",
+  "contact.deleteContact": "Supprimer le contact",
   "contact.deleteNote": "Supprimer la note",
+  "contact.deleteNoteConfirmation": "La note sera définitivement supprimée.",
   "contact.editContact": "Modifier le contact",
   "contact.identityNotVerified": "Identité non vérifiée",
   "contact.identityVerified": "Identité vérifiée",
@@ -473,6 +677,8 @@
   "contextLink.urlTemplateHelp": "{'{{token}}'} est un blob chiffré en AES-256-GCM encodé en base64 contenant tous les champs du contact et de l'agent (nécessite un secret). Les variables individuelles comme {'{{email}}'}, {'{{phone}}'}, {'{{external_user_id}}'}, {'{{contact_id}}'}, {'{{first_name}}'}, {'{{last_name}}'}, {'{{conversation_uuid}}'} sont transmises en texte brut.",
   "conversation.agentAssigned": "Agent assigné",
   "conversation.allLoaded": "Toutes les conversations sont chargées",
+  "conversation.assignSelfAction": "Me l'affecter",
+  "conversation.assignSelfPrompt": "Cette conversation n'est affectée à personne.",
   "conversation.bulkActions.clearSelection": "Désélectionner",
   "conversation.bulkActions.failedToast": "Certaines conversations n'ont pas pu être modifiées",
   "conversation.bulkActions.selectAll": "Sélectionner toutes les conversations",
@@ -481,6 +687,14 @@
   "conversation.bulkActions.successToast": "Conversations modifiées",
   "conversation.bulkActions.toolbar": "Barre d'outils d'actions en masse",
   "conversation.couldNotFetch": "Impossible d'obtenir des conversations",
+  "conversation.downloadTranscript": "Télécharger la transcription",
+  "conversation.summarize": "Résumer grâce à l'IA",
+  "conversation.summarizing": "L'IA résume la conversation. Cela peut prendre quelques secondes…",
+  "conversation.summarizeAdded": "Résumé ajouté à la conversation en tant que note privée.",
+  "conversation.deletePrivateNote": "Supprimer la note",
+  "conversation.deletePrivateNoteConfirmation": "Cela supprimera définitivement la note. Elle ne pourra pas être récupérée.",
+  "conversation.privateNoteDeleted": "La note a été supprimée",
+  "conversation.filters.tooManyGroups": "Limite de groupes de filtres dépassée. Une vue ne peut avoir plus de {max} groupes. Supprimez des groupes et réessayez.",
   "conversation.hideQuotedText": "Masquer le texte cité",
   "conversation.mentions": "Mes mentions",
   "conversation.myInbox": "Ma boîte de réception",
@@ -497,7 +711,10 @@
   "conversation.sidebar.lastVisitedPages": "Dernières pages visitées",
   "conversation.sidebar.noPreviousConvo": "Pas de conversations antérieures",
   "conversation.sidebar.notAvailable": "Non disponible",
+  "conversation.sidebar.noTagSuggestions": "Aucune suggestion d'étiquettes pour cette conversation.",
   "conversation.sidebar.previousConvo": "Conversations précédentes",
+  "conversation.sidebar.suggestTags": "Étiquettes suggérées",
+  "conversation.snoozedUntil": "Mise en sommeil jusqu'au {time}",
   "conversation.sort.newestActivity": "Activité la plus récente",
   "conversation.sort.nextSLATarget": "Prochain objectif du SLA",
   "conversation.sort.oldestActivity": "Activité la plus ancienne",
@@ -510,10 +727,10 @@
   "conversation.viewPermissionDenied": "Vous n'avez pas accès à cette vue",
   "conversationStatus.alreadyInUse": "Impossible de supprimer le statut car il est en cours d'utilisation. Veuillez supprimer ce statut de toutes les conversations avant de le supprimer",
   "conversationStatus.cannotUpdateDefault": "Impossible de mettre à jour l'état de la conversation par défaut",
-  "csat.alreadySubmitted": "CSAT déjà soumis",
-  "csat.pageTitle": "Noter votre interaction avec nous",
+  "csat.alreadySubmitted": "Questionnaire de satisfaction utilisateur (CSAT) déjà soumis",
+  "csat.pageTitle": "Noter votre interaction",
   "csat.pleaseFillRequired": "Veuillez fournir une note ou un commentaire.",
-  "csat.rateYourInteraction": "Évaluez votre récente interaction",
+  "csat.rateYourInteraction": "Évaluez votre interaction",
   "csat.thankYouMessage": "Nous vous remercions de prendre le temps de nous faire part de vos commentaires.",
   "customAttribute.deletionConfirmation": "Cette action est irréversible. Cet attribut personnalisé sera définitivement supprimé.",
   "customAttribute.edit": "Modifier l'attribut personnalisé",
@@ -521,11 +738,38 @@
   "dateFilter.lastNDays": "Derniers {n} jours | Derniers {n} jours",
   "dateFilter.selectDays": "Sélectionner les jours",
   "editor.addLinkUrl": "Ajouter l'URL du lien",
+  "editor.addYoutubeUrl": "Ajouter l'URL d'une vidéo YouTube",
+  "editor.displayAsButton": "Afficher sous forme de bouton",
+  "editor.invalidYoutubeUrl": "Veuillez saisir une URL de vidéo YouTube valide.",
+  "editor.table.addRowBefore": "Ajouter une ligne au-dessus",
+  "editor.table.addRowAfter": "Ajouter une ligne en dessous",
+  "editor.table.addColumnBefore": "Ajouter une colonne à gauche",
+  "editor.table.addColumnAfter": "Ajouter une colonne à droite",
+  "editor.table.deleteRow": "Supprimer la ligne",
+  "editor.table.deleteColumn": "Supprimer la colonne",
+  "editor.table.toggleHeaderRow": "Activer/désactiver la ligne d'en-tête",
+  "editor.table.deleteTable": "Supprimer le tableau",
   "editor.editLinkUrl": "Modifier l'URL du lien",
+  "editor.heading": "Titre {level}",
   "editor.hint.full": "MAJ + Entrée pour nouvelle ligne. Ctrl + Entrée pour envoyer. Ctrl + K pour ouvrir la barre de commande.",
   "editor.hint.newLineCtrlK": "MAJ + Entrée pour nouvelle ligne. Ctrl + K pour ouvrir la barre de commande.",
   "editor.hint.newLineSend": "MAJ + Entrée pour nouvelle ligne. Ctrl + Entrée pour envoyer.",
+  "editor.paragraph": "Paragraphe",
   "editor.newLine": "Maj + Entrée pour ajouter une nouvelle ligne. ",
+  "editor.tooltip.strikethrough": "Barré",
+  "editor.tooltip.underline": "Souligné",
+  "editor.tooltip.bulletList": "Liste à puces",
+  "editor.tooltip.orderedList": "Liste numérotée",
+  "editor.tooltip.codeBlock": "Bloc de code",
+  "editor.tooltip.blockquote": "Citation",
+  "editor.tooltip.alignLeft": "Aligner à gauche",
+  "editor.tooltip.alignCenter": "Aligner au centre",
+  "editor.tooltip.alignRight": "Aligner à droite",
+  "editor.tooltip.table": "Tableau",
+  "editor.tooltip.horizontalRule": "Séparateur",
+  "editor.tooltip.youtube": "Vidéo YouTube",
+  "editor.tooltip.callout": "Note",
+  "editor.tooltip.collapsible": "Section repliable",
   "errors.alreadyExistsCustomAttribute": "L'attribut personnalisé existe déjà",
   "errors.alreadyExistsRole": "Le rôle existe déjà",
   "errors.alreadyExistsTag": "L'étiquette existe déjà",
@@ -533,6 +777,11 @@
   "errors.canOnlyDeleteOwnNote": "Vous ne pouvez supprimer que votre propre note",
   "errors.parsingRequest": "Erreur lors de l'analyse de la requête",
   "filter.add": "Ajouter un filtre",
+  "filter.addGroup": "Ajouter un groupe",
+  "filter.containsAnyOf": "Contient l'un des éléments suivants",
+  "filter.containsNoneOf": "Ne contient aucun des éléments suivants",
+  "filter.removeGroup": "Supprimer le groupe",
+  "filter.toggleConnector": "Cliquez pour basculer entre \"ET\" et \"OU\"",
   "globals.messages.add": "Ajouter {name}",
   "globals.messages.addAnnouncement": "Ajouter une annonce",
   "globals.messages.addEmoji": "Ajouter un émoji",
@@ -552,10 +801,14 @@
   "globals.messages.bestFit": "Optimal",
   "globals.messages.block": "Bloquer {name}",
   "globals.messages.cancel": "Annuler",
+  "globals.messages.approve": "Approuver",
+  "globals.messages.reject": "Rejeter",
   "globals.messages.caseSensitiveMatch": "Correspondance sensible à la casse",
   "globals.messages.close": "Fermer",
   "globals.messages.closeChat": "Fermer le chat",
+  "globals.messages.connected": "Connecté",
   "globals.messages.connecting": "Connexion en cours...",
+  "globals.messages.connectionFailedRefresh": "Échec de connexion. Veuillez rafraîchir la page",
   "globals.messages.continueConversation": "Continuez votre conversation",
   "globals.messages.copied": "Copié dans le presse-papiers",
   "globals.messages.correctEmailErrors": "Veuillez corriger les erreurs d'email",
@@ -574,6 +827,7 @@
   "globals.messages.errorSendingPasswordResetEmail": "Erreur lors de l'envoi de l'email de réinitialisation du mot de passe",
   "globals.messages.errorUpdatingConversation": "Erreur lors de la mise à jour de la conversation",
   "globals.messages.errorUploadingFile": "Erreur lors du téléversement du fichier",
+  "globals.messages.exportData": "Exporter les données",
   "globals.messages.false": "Non",
   "globals.messages.fileTypeisNotAnImage": "Le type de fichier n'est pas une image",
   "globals.messages.goBack": "Retour",
@@ -586,6 +840,8 @@
   "globals.messages.hoursSinceLastReply": "Heures depuis la dernière réponse",
   "globals.messages.hoursSinceResolved": "Heures depuis la résolution",
   "globals.messages.import": "Importer {name}",
+  "globals.messages.insertExample": "Insérer un exemple",
+  "globals.messages.invalidFilters": "Filtres invalides.",
   "globals.messages.invite": "Inviter",
   "globals.messages.lastUsed": "Dernière utilisation",
   "globals.messages.linkUrl": "URL du lien",
@@ -593,8 +849,12 @@
   "globals.messages.markAsRead": "Marquer comme lu",
   "globals.messages.markAsUnread": "Marquer comme non lu",
   "globals.messages.maxLength": "Doit contenir au maximum {max} caractères",
+  "globals.messages.fieldTooLong": "La valeur du champ « {field} » ne peut excéder {max} caractères.",
   "globals.messages.mustBeNumber": "Doit être un nombre",
+  "globals.messages.nDays": "{days} jours",
   "globals.messages.new": "Nouveau {name}",
+  "globals.messages.moveUp": "Monter",
+  "globals.messages.moveDown": "Descendre",
   "globals.messages.no": "Aucun {name}",
   "globals.messages.noInternetConnection": "Pas de connexion Internet",
   "globals.messages.noMessagesYet": "Aucun message pour le moment",
@@ -609,6 +869,7 @@
   "globals.messages.pleaseRateConversation": "Veuillez évaluer cette conversation :",
   "globals.messages.pleaseSelect": "Veuillez sélectionner {name} avant de soumettre",
   "globals.messages.pressEnterToSelectAValue": "Appuyez sur Entrée pour sélectionner une valeur",
+  "globals.messages.publish": "Publier",
   "globals.messages.reassigning": "Réassigner",
   "globals.messages.regenerate": "Régénérer",
   "globals.messages.replying": "En train de répondre",
@@ -625,8 +886,8 @@
   "globals.messages.sendUsMessage": "Envoyez-nous un message",
   "globals.messages.sending": "Envoi en cours...",
   "globals.messages.setUp": "Configurer",
-  "globals.messages.smallScreenDescription": "Libredesk est conçu pour les grands écrans. Pour une meilleure expérience, veuillez utiliser un ordinateur ou une tablette.",
-  "globals.messages.smallScreenTitle": "Passez au bureau pour la meilleure expérience",
+  "globals.messages.showLess": "Moins",
+  "globals.messages.showMore": "Plus",
   "globals.messages.somethingWentWrong": "Une erreur s'est produite",
   "globals.messages.startNewConversation": "Démarrer une nouvelle conversation",
   "globals.messages.startTypingToSearch": "Commencez à taper pour rechercher...",
@@ -639,6 +900,7 @@
   "globals.messages.tooManyRequests": "Trop de requêtes.",
   "globals.messages.true": "Oui",
   "globals.messages.unblock": "Débloquer {name}",
+  "globals.messages.unpublish": "Dé-publier",
   "globals.messages.update": "Mettre à jour {name}",
   "globals.messages.upload": "Téléverser",
   "globals.messages.uploading": "Téléversement de {name}",
@@ -657,18 +919,25 @@
   "globals.terms.announcement": "Annonce | Annonces",
   "globals.terms.apiKey": "Clé de l'API | Clés de l'API",
   "globals.terms.appliesTo": "S'applique à",
+  "globals.terms.article": "Article | Articles",
   "globals.terms.ascending": "Croissant",
+  "globals.terms.assignedTeam": "Équipe affectée",
+  "globals.terms.assignee": "Cessionnaire",
+  "globals.terms.attachment": "Pièce jointe | Pièces jointes",
   "globals.terms.audio": "Son",
   "globals.terms.automation": "Automatisation | Automatisations",
-  "globals.terms.availabilityStatus": "Statut de disponibilité",
+  "globals.terms.availabilityStatus": "État de disponibilité",
   "globals.terms.awaitingResponse": "En attente de réponse",
   "globals.terms.away": "Absent | Absent",
   "globals.terms.awayReassigning": "Absent et réaffectant",
   "globals.terms.background": "Arrière-plan",
   "globals.terms.beta": "Bêta",
   "globals.terms.black": "Noir",
+  "globals.terms.blocked": "Bloqué",
+  "globals.terms.bold": "Gras",
   "globals.terms.body": "Corps",
   "globals.terms.brandName": "Nom de marque",
+  "globals.terms.breadcrumb": "Fil d'Ariane",
   "globals.terms.businessHour": "Horaire d’ouverture | Horaires d'ouverture",
   "globals.terms.callbackURL": "URL de retour",
   "globals.terms.category": "Catégorie",
@@ -678,15 +947,25 @@
   "globals.terms.closed": "Fermée",
   "globals.terms.closedAt": "Fermé le",
   "globals.terms.collapse": "Réduire",
+  "globals.messages.collapseAll": "Tout réduire",
+  "globals.messages.expandAll": "Tout déplier",
+  "globals.terms.collection": "Catégorie | Catégories",
   "globals.terms.contact": "Contact | Contacts",
+  "globals.terms.contactEmail": "E-mail du contact",
+  "globals.terms.contactExternalId": "ID externe du contact",
   "globals.terms.content": "Contenu | Contenus",
   "globals.terms.contextLink": "Lien contextuel | Liens contextuels",
   "globals.terms.continue": "Continuer",
   "globals.terms.conversation": "Conversation | Conversations",
   "globals.terms.copy": "Copier",
   "globals.terms.country": "Pays",
+  "globals.terms.countryCode": "Indicatif du pays",
   "globals.terms.createdAt": "Créé le",
+  "globals.terms.question": "Question",
+  "globals.terms.answer": "Réponse",
   "globals.terms.createdOn": "Créé le",
+  "globals.terms.csatFeedback": "Commentaire du questionnaire de satisfaction utilisateur (CSAT)",
+  "globals.terms.csatRating": "Note du questionnaire de satisfaction utilisateur (CSAT)",
   "globals.terms.custom": "Personnalisé",
   "globals.terms.customAttribute": "Attribut personnalisé | Attributs personnalisés",
   "globals.terms.date": "Date",
@@ -696,6 +975,7 @@
   "globals.terms.description": "Description | Descriptions",
   "globals.terms.disabled": "Désactivé",
   "globals.terms.download": "Télécharger",
+  "globals.terms.downloadedAt": "Téléchargé le",
   "globals.terms.draft": "Brouillon",
   "globals.terms.email": "E-mail | E-mails",
   "globals.terms.enabled": "Activé",
@@ -710,17 +990,24 @@
   "globals.terms.filter": "Filtre | Filtres",
   "globals.terms.firstName": "Prénom | Prénoms",
   "globals.terms.firstReplyAt": "Première réponse le",
+  "globals.terms.footer": "Pied de page",
   "globals.terms.fromEmailAddress": "Depuis l'adresse mail | Depuis les adresses mails",
   "globals.terms.general": "Général",
+  "globals.terms.appearance": "Apparence",
+  "globals.terms.desktop": "Ordinateur",
+  "globals.terms.tablet": "Tablette",
+  "globals.terms.mobile": "Smartphone",
   "globals.terms.good": "Bon",
   "globals.terms.google": "Google",
   "globals.terms.gradient": "Dégradé",
   "globals.terms.great": "Très bien",
+  "globals.terms.helpCenter": "Centre d'aide | Centres d'aide",
   "globals.terms.home": "Accueil",
   "globals.terms.homeScreen": "Écran d'accueil",
   "globals.terms.homeScreenApp": "Application d'accueil | Applications d'accueil",
   "globals.terms.host": "Hôte | Hôtes",
   "globals.terms.hour": "Heure | Heures",
+  "globals.terms.icon": "Icône | Icônes",
   "globals.terms.image": "Image | Images",
   "globals.terms.import": "Importation | Importations",
   "globals.terms.inactive": "Inactif | Inactifs",
@@ -729,16 +1016,20 @@
   "globals.terms.integration": "Intégration | Intégrations",
   "globals.terms.ipAddress": "Adresse IP | Adresses IP",
   "globals.terms.isDefault": "Par défaut",
+  "globals.terms.italic": "Italique",
   "globals.terms.key": "Clé | Clés",
   "globals.terms.label": "Libellé | Libellés",
   "globals.terms.language": "Langue | Langues",
   "globals.terms.lastActive": "Dernière activité",
+  "globals.terms.lastInteractionAt": "Dernière interaction le",
+  "globals.terms.lastInteractionBy": "Dernière interaction avec",
   "globals.terms.lastLogin": "Dernière connexion",
   "globals.terms.lastMessageAt": "Dernier message à",
   "globals.terms.lastName": "Nom | Noms",
   "globals.terms.lastReplyAt": "Dernière réponse le",
   "globals.terms.lastUpdated": "Dernière modification",
   "globals.terms.learnMore": "En savoir plus",
+  "globals.terms.link": "Lien | Liens",
   "globals.terms.listValues": "Lister les valeurs",
   "globals.terms.liveChat": "Chat en direct",
   "globals.terms.loadMore": "Charger plus",
@@ -746,11 +1037,14 @@
   "globals.terms.log": "Journal | Journaux",
   "globals.terms.logoUrl": "URL du logo",
   "globals.terms.macro": "Macro | Macros",
+  "globals.terms.main": "Principal",
   "globals.terms.mention": "Mention | Mentions",
+  "globals.terms.menu": "Menu",
   "globals.terms.message": "Message | Messages",
   "globals.terms.microsoft": "Microsoft",
   "globals.terms.myInbox": "Ma boite de réception | Mes boites de réception",
   "globals.terms.name": "Nom | Noms",
+  "globals.terms.nextSlaDeadline": "Prochaine échéance du SLA",
   "globals.terms.none": "Aucun",
   "globals.terms.note": "Note | Notes",
   "globals.terms.notification": "Notification | Notifications",
@@ -766,10 +1060,12 @@
   "globals.terms.page": "Page | Pages",
   "globals.terms.participant": "Participant | Participants",
   "globals.terms.password": "Mot de passe | Mots de passe",
+  "globals.terms.paused": "En pause",
   "globals.terms.pending": "En attente",
   "globals.terms.phoneNumber": "Numéro de téléphone | Numéros de téléphone",
   "globals.terms.pickDate": "Choisir une date",
   "globals.terms.placeholder": "Espace réservé | Espaces réservés",
+  "globals.terms.platform": "Plateforme",
   "globals.terms.poor": "Mauvais",
   "globals.terms.port": "Port | Ports",
   "globals.terms.primaryColor": "Couleur primaire | Couleurs primaires",
@@ -779,8 +1075,11 @@
   "globals.terms.profile": "Profil | Profils",
   "globals.terms.provider": "Fournisseur | Fournisseurs",
   "globals.terms.providerURL": "URL du fournisseur",
+  "globals.terms.published": "Publié",
+  "globals.terms.read": "Lu",
   "globals.terms.reconnect": "Reconnecter",
   "globals.terms.referenceNumber": "Numéro de référence",
+  "globals.terms.refresh": "Actualiser",
   "globals.terms.regex": "Expression régulière | Expressions régulières",
   "globals.terms.regexHint": "Indice concernant l'expression régulière",
   "globals.terms.remove": "Supprimer",
@@ -798,16 +1097,19 @@
   "globals.terms.security": "Sécurité",
   "globals.terms.select": "Sélectionner",
   "globals.terms.sendWelcomeEmail": "Envoyer un e-mail de bienvenue ? | Envoyer des e-mails de bienvenue ?",
+  "globals.terms.sent": "Envoyé",
   "globals.terms.setPassword": "Définir le mot de passe | Définir les mots de passe",
   "globals.terms.sharedView": "Vue partagée | Vues partagées",
   "globals.terms.sla": "SLA | SLA",
   "globals.terms.slaMetric": "Statistique SLA | Statistiques SLA",
   "globals.terms.slaPolicy": "Politique SLA | Politiques SLA",
+  "globals.terms.slug": "Identifiant | Identifiants",
   "globals.terms.small": "Petite",
   "globals.terms.smtpHost": "Hôte SMTP | Hôtes SMTP",
   "globals.terms.smtpPort": "Port SMTP | Ports SMTP",
-  "globals.terms.snooze": "Reporter",
-  "globals.terms.snoozed": "En pause",
+  "globals.terms.snooze": "Mettre en sommeil",
+  "globals.terms.snoozed": "En sommeil",
+  "globals.terms.snoozedUntil": "En sommeil jusqu'au",
   "globals.terms.solid": "Uni",
   "globals.terms.someone": "Quelqu'un",
   "globals.terms.sso": "SSO | SSO",
@@ -820,6 +1122,7 @@
   "globals.terms.tellUsMore": "Dites-nous en plus...",
   "globals.terms.template": "Modèle | Modèles",
   "globals.terms.tenantID": "ID du locataire",
+  "globals.terms.textColor": "Couleur du texte",
   "globals.terms.time": "Heure",
   "globals.terms.timestamp": "Horodatage | Horodatages",
   "globals.terms.timezone": "Fuseau horaire | Fuseaux horaires",
@@ -843,12 +1146,152 @@
   "globals.terms.visibility": "Visibilité | Visibilités",
   "globals.terms.visitor": "Visiteur | Visiteurs",
   "globals.terms.waiting": "En attente",
+  "globals.terms.waitingSince": "En attente depuis",
   "globals.terms.warning": "Avertissement | Avertissements",
+  "globals.terms.info": "Information",
+  "globals.terms.success": "Succès",
+  "globals.terms.danger": "Danger",
+  "globals.terms.summary": "Résumé",
   "globals.terms.webhook": "Webhook | Webhooks",
   "globals.terms.week": "Semaine | Semaines",
   "globals.terms.white": "Blanc",
   "globals.terms.workspace": "Espace de travail",
+  "globals.terms.yesterday": "Hier",
   "globals.terms.you": "Vous",
+  "helpCenter.aiEnabled": "Autoriser les assistants IA à utiliser cet article",
+  "helpCenter.article": "article | articles",
+  "helpCenter.articlePlaceholder": "Écrivez votre article...",
+  "helpCenter.aiEnabledHint": "Prend effet seulement lorsque l'article est publié. Activez-le dans une seule langue seulement, pas dans chaque traduction.",
+  "helpCenter.customCSS": "Feuille de style CSS personnalisée",
+  "helpCenter.preview.sampleArticleTitle": "Exemple d'article",
+  "helpCenter.preview.sampleCollection": "Exemple de catégorie",
+  "helpCenter.preview.sampleAuthor": "Exemple d’auteur",
+  "helpCenter.preview.sampleArticleExcerpt": "Un exemple d'article montrant à quoi ressembleront les pages de vos articles.",
+  "helpCenter.preview.sampleArticleHeading1": "Premiers pas",
+  "helpCenter.preview.sampleArticleHeading2": "Avant de commencer",
+  "helpCenter.preview.sampleArticleHeading3": "Prochaines étapes",
+  "helpCenter.preview.sampleArticleBody": "Le texte du corps, les liens et les images apparaissent ici, stylisés avec les paramètres que vous choisissez sur la gauche.",
+  "helpCenter.preview.sampleArticleListItem": "Les éléments de liste et les autres mises en forme sont stylisés de la même manière.",
+  "helpCenter.styling.brand": "Marque",
+  "helpCenter.styling.customCode": "Code CSS personnalisé",
+  "helpCenter.customJS": "Code JavaScript personnalisé",
+  "helpCenter.deleteArticleConfirmation": "L'article sera définitivement supprimé.",
+  "helpCenter.deleteCollectionConfirmation": "La catégorie et l'ensemble des articles qu'elle contient seront définitivement supprimés.",
+  "helpCenter.deleteConfirmation": "Le centre d'aide ainsi que l'ensemble de ses catégories et articles seront définitivement supprimés.",
+  "helpCenter.editArticle": "Modifier l'article",
+  "helpCenter.editCollection": "Modifier la catégorie",
+  "helpCenter.headerText": "Titre",
+  "helpCenter.homeMetaDescriptionHint": "Affiché dans les résultats du moteur de recherche et dans les aperçus de la page d'accueil du centre d'aide sur les réseaux sociaux. Laissez vide pour utiliser le texte de l'en-tête.",
+  "helpCenter.invalidColor": "La couleur d'accentuation doit être un code couleur hexadécimal tel que #1f93ff.",
+  "helpCenter.invalidParent": "Une catégorie ne peut pas être son propre parent.",
+  "helpCenter.parentLocaleMismatch": "La catégorie parente utilise une langue différente. Choisissez une catégorie parente utilisant la même langue que cette catégorie.",
+  "helpCenter.invalidCollection": "Cette catégorie appartient à un autre centre d'aide. Choisissez une catégorie appartenant à ce centre d'aide.",
+  "helpCenter.invalidSlug": "Cet identifiant n'est pas autorisé. Indiquez un identifiant différent.",
+  "helpCenter.invalidStatus": "Le statut de l'article doit être « Brouillon » ou « Publié ».",
+  "helpCenter.invalidTheme": "Les paramètres d'apparence n'ont pas pu être lus. Actualisez la page et réessayez.",
+  "helpCenter.announcementTextRequired": "L'annonce nécessite un texte. Un lien seul n'est pas affiché.",
+  "helpCenter.invalidLocale": "Code de langue invalide. Utilisez un code comme « fr » ou « fr-FR ».",
+  "helpCenter.defaultLocaleNotAllowed": "La langue par défaut ne se trouve pas dans les langues du centre d'aide. Ajoutez-la à la liste des langues ou choisissez une autre langue par défaut.",
+  "helpCenter.customDomainInUse": "Un autre centre d'aide utilise déjà ce domaine. Retirez d'abord le domaine de ce centre d'aide ou choisissez un autre domaine.",
+  "helpCenter.localeNotSupported": "Cette langue n'est pas une des langues prises en charge par le centre d'aide. Le contenu enregistré dans celui-ci n'apparaîtra pas sur le site public. Ajoutez d'abord la langue au centre d'aide.",
+  "helpCenter.localeInUse": "La langue {locale} contient encore des catégories ou des articles. La retirer les cacherait du site public sans aucun moyen de les consulter. Déplacez ou supprimez d'abord ceux-ci.",
+  "helpCenter.invalidURL": "Entrez une URL complète commençant par « https:// » ou un chemin commençant par « / ».",
+  "helpCenter.invalidAuthor": "L'auteur sélectionné n'est pas un agent ou un assistant IA. Choisissez un autre auteur.",
+  "helpCenter.writtenBy": "Rédigé par",
+  "helpCenter.createdBy": "Créé par",
+  "helpCenter.collectionLocaleMismatch": "La catégorie est dans une langue différente de l'article. Choisissez une catégorie dans la langue de l'article.",
+  "helpCenter.excerpt": "Résumé",
+  "helpCenter.excerptHint": "Un résumé d'une ligne affiché sous le titre de l'article et dans les résultats de recherche.",
+  "helpCenter.feedbackThanks": "Merci pour votre retour.",
+  "helpCenter.insights": "Aperçus de recherche",
+  "helpCenter.localeChangeHasContent": "Cette catégorie contient des articles ou des sous-catégories dans sa langue actuelle. Changer sa langue les masquerait. Déplacez-les avant de modifier la langue.",
+  "helpCenter.metaDescription": "Description (balise meta)",
+  "helpCenter.metaDescriptionHint": "Affiché dans les résultats des moteurs de recherche et les aperçus des réseaux sociaux. Laissez vide pour utiliser l'extrait.",
+  "helpCenter.metaImageURL": "URL de l'image pour les réseaux sociaux",
+  "helpCenter.metaTitle": "Titre (balise meta)",
+  "helpCenter.metaTitleHint": "Titre affiché dans les moteurs de recherche et les onglets du navigateur. Laissez vide pour utiliser le titre de l'article.",
+  "helpCenter.notFoundText": "Cette page n'existe pas a été déplacée. Effectuez une recherche à l'aide du champ ci-dessus ou retournez au centre d'aide.",
+  "helpCenter.errorText": "La page n'a pas pu être chargée en raison d'un problème temporaire. Réessayez dans un instant, ou retournez au centre d'aide.",
+  "helpCenter.backToHelpCenter": "Retour au centre d'aide",
+  "helpCenter.noResultSearches": "Recherches sans résultats",
+  "helpCenter.noSearchData": "Aucune recherche n'a encore été enregistrée.",
+  "helpCenter.onThisPage": "Sur cette page",
+  "helpCenter.skipToContent": "Aller au contenu principal",
+  "helpCenter.resultsCount": "{count} résultat | {count} résultats",
+  "helpCenter.supportedLanguages": "Langues prises en charge",
+  "helpCenter.visitSite": "Visiter le site",
+  "helpCenter.supportedLanguagesHint": "Ajoutez une langue avant de créer des articles pour celle-ci.",
+  "helpCenter.defaultLanguage": "Langue par défaut",
+  "helpCenter.defaultLanguageHint": "Le centre d'aide sera affiché dans cette langue à moins que l'utilisateur en sélectionne une autre.",
+  "helpCenter.searchTerm": "Terme recherché",
+  "helpCenter.searchCount": "Requêtes",
+  "helpCenter.seo": "SEO et métadonnées",
+  "helpCenter.topSearches": "Recherches fréquentes",
+  "helpCenter.wasHelpful": "Cet article vous a-t-il aidé ?",
+  "helpCenter.maxDepthReached": "Les catégories peuvent être imbriquées jusqu'à 3 niveaux. Choisissez un parent de niveau supérieur.",
+  "helpCenter.relatedArticles": "Articles liés",
+  "helpCenter.navLinks": "Liens de navigation",
+  "helpCenter.faviconHint": "https://exemple.com/favicon.ico",
+  "helpCenter.styling.header": "En-tête et hero",
+  "helpCenter.styling.tagline": "Slogan",
+  "helpCenter.styling.bgDefault": "Par défaut (couleur d'accentuation)",
+  "helpCenter.styling.bgSolid": "Couleur pleine",
+  "helpCenter.styling.textColorHint": "Laisser vide pour utiliser celle par défaut",
+  "helpCenter.styling.inlineMarkdownHint": "Markdown est supporté. Par exemple **gras**, *italique* et [lien](https://exemple.com).",
+  "helpCenter.styling.footerTaglineHint": "Votre slogan ou informations de contact",
+  "helpCenter.styling.socialLinks": "Liens des réseaux sociaux",
+  "helpCenter.styling.articlePage": "Page d'article",
+  "helpCenter.styling.showToc": "Montrer la table des matières",
+  "helpCenter.styling.showRelated": "Afficher les articles liés",
+  "helpCenter.styling.showAuthor": "Afficher l’auteur",
+  "helpCenter.styling.headerImageHint": "Recommandé : au moins 1600x500px (environ 3:1), au format JPEG, PNG ou WebP. L'image sera automatiquement centrée et recadrée.",
+  "helpCenter.styling.landingPage": "Page de destination",
+  "helpCenter.styling.collectionLayout": "Disposition de la catégorie",
+  "helpCenter.styling.layoutGrid": "Grille des cartes",
+  "helpCenter.styling.layoutList": "Une par ligne",
+  "helpCenter.styling.cardsPerRow": "Cartes par ligne",
+  "helpCenter.styling.cardIconPosition": "Position de l'icône de la carte",
+  "helpCenter.styling.iconBesideTitle": "À côté du titre",
+  "helpCenter.styling.iconAboveTitle": "Au-dessus du titre",
+  "helpCenter.styling.iconCentered": "Centrée",
+  "helpCenter.styling.showCardDescription": "Afficher les descriptions des catégories",
+  "helpCenter.styling.showCardCount": "Afficher le nombre d'articles",
+  "helpCenter.styling.showCardAuthors": "Afficher les avatars des auteurs",
+  "helpCenter.styling.showIconTile": "Afficher la tuile d'arrière-plan de l'icône",
+  "helpCenter.styling.showPopularArticles": "Lister les articles les plus populaires",
+  "helpCenter.styling.popularArticlesLabel": "Titre de la liste des articles populaires",
+  "helpCenter.styling.announcementHint": "Une barre fermable affichée au-dessus de l'en-tête sur chaque page. Laissez le texte vide pour ne pas l'afficher.",
+  "helpCenter.authors": "auteur | auteurs",
+  "helpCenter.social.website": "Site web",
+  "helpCenter.social.twitter": "X (Twitter)",
+  "helpCenter.social.github": "GitHub",
+  "helpCenter.social.linkedin": "LinkedIn",
+  "helpCenter.social.facebook": "Facebook",
+  "helpCenter.social.instagram": "Instagram",
+  "helpCenter.social.youtube": "YouTube",
+  "helpCenter.newArticle": "Nouvel article",
+  "helpCenter.newCollection": "Nouvelle catégorie",
+  "helpCenter.noArticles": "Cette catégorie n'a pas encore d'articles. Essayez d'effectuer une recherche ou de parcourir les autres catégories.",
+  "helpCenter.noCollections": "Aucune catégorie pour le moment.",
+  "helpCenter.noPublishedContent": "Rien n'a encore été publié ici. Veuillez revenir plus tard.",
+  "helpCenter.noCollectionsInLanguage": "Aucune catégorie dans cette langue. Créez-en une avant de sauvegarder cet article.",
+  "helpCenter.noResults": "Aucun article ne correspond à votre recherche. Essayez une recherche plus concise ou utilisez mots différents.",
+  "helpCenter.pageTitle": "Titre de la page",
+  "helpCenter.parentCollection": "Catégorie parente",
+  "helpCenter.pause": "Suspendre le site",
+  "helpCenter.popularArticles": "Articles populaires",
+  "helpCenter.poweredBy": "Propulsé par",
+  "helpCenter.resume": "Publier le site",
+  "helpCenter.searchPlaceholder": "Rechercher des articles...",
+  "helpCenter.searchResults": "Résultats pour",
+  "helpCenter.templates.docs": "Documentation",
+  "helpCenter.templates.docsHint": "Mise en page de type documentation avec une barre de navigation supérieure, une liste latérale de catégories et une recherche rapide (Ctrl+K).",
+  "helpCenter.templates.classic": "Classique",
+  "helpCenter.templates.classicHint": "Mise en page de type classique avec une bannière « hero », une grande barre de recherche et des catégories affichées au format cartes.",
+  "helpCenter.slugHint": "Utilisé dans l'URL du centre d'aide.",
+  "helpCenter.customDomain": "Domaine personnalisé (facultatif)",
+  "helpCenter.customDomainHint": "Servir ce centre d'aide sur son propre domaine. Configurez d'abord le domaine afin qu'il pointe vers Libredesk dans votre configuration DNS et votre reverse-proxy.",
+  "helpCenter.invalidCustomDomain": "Entrez l'URL racine du domaine commençant par https://, sans chemin d'accès ou barre oblique de fin, par exemple « https://help.example.com ».",
   "imageLightbox.next": "Image suivante",
   "imageLightbox.previous": "Image précédente",
   "imageLightbox.resetZoom": "Zoom par défaut",
@@ -894,6 +1337,7 @@
   "media.invalidOrExpiredURL": "URL de média invalide ou expirée",
   "navigation.away": "Absent",
   "navigation.darkMode": "Mode Sombre",
+  "navigation.keyboardShortcuts": "Raccourcis clavier",
   "navigation.logout": "Déconnexion",
   "navigation.reassignReplies": "Réassigner les réponses",
   "notification.conversationAssigned": "Conversation assignée à vous #{referenceNumber}",
@@ -917,18 +1361,23 @@
   "placeholders.selectEvents": "Sélectionner les événements",
   "placeholders.selectField": "Sélectionner le champ",
   "placeholders.selectInbox": "Sélectionner la boîte de réception",
+  "placeholders.selectLanguage": "Sélectionnez une langue",
   "placeholders.selectOperator": "Sélectionner l'opérateur",
   "placeholders.selectPosition": "Sélectionner la position",
   "placeholders.selectPriority": "Sélectionner la priorité",
   "placeholders.selectProtocol": "Sélectionner le protocole",
   "placeholders.selectProvider": "Sélectionner le fournisseur",
+  "placeholders.selectRecipients": "Sélectionner les destinataires",
   "placeholders.selectTags": "Sélectionner les étiquettes",
   "placeholders.selectTeam": "Sélectionner une équipe",
   "placeholders.selectTeams": "Sélectionner des équipes",
   "placeholders.selectType": "Sélectionner le type",
   "placeholders.selectValue": "Sélectionner la valeur",
+  "placeholders.selectWebhook": "Sélectionner un webhook",
+  "placeholders.snoozeDuration": "Ex : 30m, 3h, 2h30m",
   "placeholders.startConversation": "Démarrer une conversation",
   "placeholders.tellUsAboutYourself": "Parlez-nous de vous",
+  "placeholders.webhookEventName": "Ex : priority.escalated",
   "replyBox.bcc": "Copie cachée",
   "replyBox.contactEmailMissing": "L'e-mail du contact n'est pas dans les destinataires",
   "replyBox.contactEmailMissingDescription": "L'email du contact ({email}) n'est pas inclus dans À, CC ou BCC. Le contact ne recevra pas cette réponse.",
@@ -938,16 +1387,20 @@
   "replyBox.missingTagsTitle": "Cette conversation ne comporte aucune étiquette",
   "replyBox.removeBCC": "Supprimer le BCC",
   "replyBox.sendAnyway": "Envoyer quand même",
+  "replyBox.sendAndSetAs": "Envoyer et marquer comme",
   "replyBox.toRequired": "Au moins un destinataire est requis dans le champ À.",
-  "report.agentStatus": "Statut des agents",
+  "report.agentStatus": "Statut de l'agent",
+  "report.autoRefreshPaused": "Actualisation automatique en pause",
+  "report.awaitingFirstReply": "En attente d'une première réponse",
   "report.chart.newConversations": "Nouvelles conversations",
   "report.chart.resolvedConversations": "Conversations résolues",
   "report.chart.title": "Tendances des conversations",
   "report.csat.avgRating": "Note moyenne",
-  "report.csat.cardTitle": "Satisfaction client (derniers {days} jours)",
+  "report.csat.cardTitle": "Satisfaction client",
   "report.csat.responseRate": "Taux de réponse",
   "report.csat.responses": "Réponses",
-  "report.messages.cardTitle": "Volume de messages (derniers {days} jours)",
+  "report.customRangeDays": "Plage personnalisée en jours",
+  "report.messages.cardTitle": "Volume de messages",
   "report.messages.incoming": "Entrants",
   "report.messages.outgoing": "Sortants",
   "report.messages.perConversation": "Par conversation",
@@ -958,13 +1411,13 @@
   "report.sla.avgNextResp": "Temps moyen de prochaine réponse",
   "report.sla.avgResolution": "Temps moyen de résolution",
   "report.sla.breached": "Non respecté",
-  "report.sla.cardTitle": "Performance SLA (derniers {days} jours)",
+  "report.sla.cardTitle": "Performances SLA",
   "report.sla.compliance": "Conformité",
   "report.sla.firstResponse": "Première réponse",
   "report.sla.met": "Respecté",
   "report.sla.nextResponse": "Prochaine réponse",
   "report.sla.resolution": "Résolution",
-  "report.tags.cardTitle": "Distribution des étiquettes (derniers {days} jours)",
+  "report.tags.cardTitle": "Répartition des étiquettes",
   "report.tags.tagged": "Étiquetés",
   "report.tags.topTags": "Principales étiquettes",
   "role.deletionConfirmation": "Cette action est irréversible. Ce rôle sera définitivement supprimé.",
@@ -981,6 +1434,8 @@
   "sharedView.allAgents": "Tous les agents",
   "sharedView.editSharedView": "Modifier la vue partagée",
   "sharedView.new": "Nouvelle vue partagée",
+  "shortcuts.openCommandBar": "Barre de commandes",
+  "shortcuts.replyEditor": "Éditeur de réponse",
   "sla.deletionConfirmation": "Cette action est irréversible. Cette politique SLA sera définitivement supprimée.",
   "sla.edit": "Modifier la politique SLA",
   "sla.enterDuration": "Saisir la durée",
@@ -1021,6 +1476,7 @@
   "user.userAlreadyLoggedIn": "L'utilisateur est déjà connecté",
   "user.userCannotDeleteSelf": "Vous ne pouvez pas vous supprimer vous-même",
   "validation.invalid": "{name} invalide",
+  "validation.invalidAvailabilityStatus": "État de disponibilité invalide",
   "validation.invalidColor": "Couleur invalide",
   "validation.invalidCredential": "Identifiant non valide",
   "validation.invalidCsvFile": "Fichier CSV non valide",
@@ -1032,9 +1488,10 @@
   "validation.invalidInbox": "Boîte de réception non valide",
   "validation.invalidKey": "Clé invalide",
   "validation.invalidPermission": "Autorisation non valide",
+  "validation.invalidPhone": "Numéro de téléphone incorrect",
   "validation.invalidPortValue": "Valeur de port non valide",
-  "validation.invalidProvider": "Fournisseur non valide",
-  "validation.invalidSnoozeDuration": "Durée de répétition invalide",
+  "validation.invalidRole": "Rôle invalide",
+  "validation.invalidSnoozeDuration": "Durée de mise en sommeil invalide",
   "validation.invalidTimeFormat": "Format d'heure invalide (HH:mm)",
   "validation.invalidUrl": "URL non valide",
   "validation.invalidUser": "Utilisateur non valide",
@@ -1044,7 +1501,7 @@
   "validation.minmax": "Doit être compris entre {min} et {max} caractères",
   "validation.minmaxNumber": "Doit être compris entre {min} et {max}",
   "validation.notFoundConversation": "Conversation introuvable",
-  "validation.notFoundCsatSurvey": "Enquête CSAT introuvable",
+  "validation.notFoundCsatSurvey": "Questionnaire de satisfaction utilisateur (CSAT) introuvable",
   "validation.notFoundCustomAttribute": "Attribut personnalisé introuvable",
   "validation.notFoundFile": "Fichier introuvable",
   "validation.notFoundImport": "Importation introuvable",
@@ -1067,16 +1524,20 @@
   "validation.subjectCannotBeEmpty": "Le sujet ne peut pas être vide",
   "validation.tooLongStatus": "Le statut est trop long, il doit contenir au maximum {max} caractères",
   "view.form.description": "Créez et enregistrez des vues de filtre personnalisées pour un accès rapide à vos conversations.",
-  "view.form.filter.partiallyFilled": "Assurez-vous d'avoir rempli correctement les champs du filtre.",
   "view.form.filter.selectAtLeastOne": "Sélectionnez au moins un filtre.",
   "view.form.filters.description": "Définissez un ou plusieurs filtres pour personnaliser l'affichage.",
   "view.form.name.description": "Saisissez un nom unique pour votre vue.",
-  "view.form.name.length": "Le nom de la vue doit comporter entre 2 et 30 caractères.",
+  "view.form.name.length": "Le nom de la vue doit comporter entre 2 et 140 caractères.",
   "webhook.edit": "Modifier le webhook",
   "webhook.new": "Nouveau webhook",
   "webhook.sendTest": "Envoyer un test",
   "webhook.sentSuccessfully": "Webhook envoyé avec succès",
   "widget.conversationClosed": "Cette conversation a été fermée",
   "widget.ipBlocked": "Accès refusé",
-  "widget.prechatForm.startChat": "Démarrer le chat"
+  "widget.prechatForm.startChat": "Démarrer le chat",
+  "conversation.sidebarCounts.all": "{count} conversation ouverte | {count} conversations ouvertes",
+  "conversation.sidebarCounts.assigned": "{count} conversation ouverte dans ma boîte de réception | {count} conversations ouvertes dans ma boîte de réception",
+  "conversation.sidebarCounts.mentioned": "{count} conversation ouverte avec mentions | {count} conversations ouvertes avec mentions",
+  "conversation.sidebarCounts.view": "{count} conversation dans cette vue | {count} conversations dans cette vue",
+  "conversation.sidebarCounts.unassigned": "{count} conversation ouverte non affectée | {count} conversations ouvertes non affectées"
 }
diff --git a/i18n/it-IT.json b/i18n/it-IT.json
index 3f324fe0..e0402c50 100644
--- a/i18n/it-IT.json
+++ b/i18n/it-IT.json
@@ -3,11 +3,9 @@
   "_.name": "Italiano",
   "account.avatarRemoved": "Avatar rimosso",
   "account.changeAvatar": "Cambia il tuo avatar qui.",
-  "account.chooseAFile": "Scegli un file...",
   "account.cropAvatar": "Ritaglia avatar",
   "account.editProfile": "Modifica profilo",
   "account.publicAvatar": "Avatar pubblico",
-  "account.removeAvatar": "Elimina avatar",
   "actions.addAction": "Aggiungi azione",
   "actions.addCondition": "Aggiungi condizione",
   "actions.addTags": "Aggiungi tag",
@@ -81,7 +79,6 @@
   "admin.contextLink.help.detail": "Usa {'{{token}}'} per un payload completamente crittografato che l'app esterna decrittografa con un segreto condiviso. Oppure usa variabili individuali come {'{{email}}'}, {'{{phone}}'}, {'{{external_user_id}}'} per link URL in chiaro verso strumenti interni affidabili.",
   "admin.conversationStatus.name.description": "Imposta il nome di stato. Fai clic su Salva quando hai finito.",
   "admin.conversationTags.edit.description": "Cambia il nome del tag. Fai clic su Salva quando hai finito.",
-  "admin.conversationTags.name.valid": "Il nome del sito deve essere di almeno 3 carattere",
   "admin.conversationTags.new.description": "Imposta il nome del tag. Fai clic su Salva quando hai finito.",
   "admin.customAttribute.help": "Gli attributi personalizzati ti aiutano a impostare dettagli aggiuntivi sui tuoi contatti o conversazioni, come il piano di abbonamento o la data del primo acquisto.",
   "admin.customAttributes.keyNotAllowed": "La chiave fornita non è consentita in quanto è in conflitto con gli attributi predefiniti. Si prega di utilizzare una chiave diversa.",
@@ -193,7 +190,6 @@
   "admin.inbox.livechat.noticeBanner.enabled": "Abilita banner di avviso",
   "admin.inbox.livechat.noticeBanner.text": "Testo del banner di avviso",
   "admin.inbox.livechat.officeHours": "Orario d'ufficio",
-  "admin.inbox.livechat.prechatForm.addField": "Aggiungi campo",
   "admin.inbox.livechat.prechatForm.availableFields": "Attributi personalizzati disponibili",
   "admin.inbox.livechat.prechatForm.enabled": "Abilita modulo pre-chat",
   "admin.inbox.livechat.prechatForm.enabled.description": "Mostra un modulo per raccogliere informazioni prima dell'inizio della chat",
@@ -371,9 +367,6 @@
   "agent.generateApiKey": "Genera chiave API",
   "agent.new": "Nuovo agente",
   "agent.selectAvailabilityStatus": "Seleziona stato di disponibilità",
-  "ai.apiKey.description": "La chiave API {provider} non è impostata o non valida. Inserisci una chiave API valida per usare le funzioni AI.",
-  "ai.apiKeyNotSet": "Chiave API {provider} non impostata. Chiedi all'amministratore di configurarla",
-  "ai.enterOpenAIAPIKey": "Inserisci OpenAI API Key",
   "auth.backToLogin": "Torna al login",
   "auth.checkEmailForReset": "Controlla la tua email per trovare il link per il reset della password.",
   "auth.confirmPassword": "Conferma password",
@@ -592,8 +585,6 @@
   "globals.messages.sendUsMessage": "Inviaci un messaggio",
   "globals.messages.sending": "Invio in corso...",
   "globals.messages.setUp": "Imposta",
-  "globals.messages.smallScreenDescription": "Libredesk è progettato per schermi più grandi. Per la migliore esperienza, utilizza un desktop o un tablet.",
-  "globals.messages.smallScreenTitle": "Passa al desktop per la migliore esperienza",
   "globals.messages.somethingWentWrong": "Qualcosa è andato storto",
   "globals.messages.startNewConversation": "Inizia nuova conversazione",
   "globals.messages.startTypingToSearch": "Inizia a digitare per effettuare una ricerca...",
@@ -872,32 +863,25 @@
   "replyBox.removeBCC": "Rimuovi BCC",
   "replyBox.sendAnyway": "Invia comunque",
   "replyBox.toRequired": "È richiesto almeno un destinatario nel campo A.",
-  "report.agentStatus": "Stato dell’agente",
   "report.chart.newConversations": "Nuove conversazioni",
   "report.chart.resolvedConversations": "Conversazioni risolte",
-  "report.chart.title": "Tendenze Della Conversazione",
   "report.csat.avgRating": "Valutazione media",
-  "report.csat.cardTitle": "Soddisfazione del cliente (ultimo {days} giorni)",
   "report.csat.responseRate": "Tasso di risposta",
   "report.csat.responses": "Risposte",
-  "report.messages.cardTitle": "Volume messaggio (ultimo {days} giorni)",
   "report.messages.incoming": "In arrivo",
   "report.messages.outgoing": "In uscita",
   "report.messages.perConversation": "Per conversazione",
   "report.messages.total": "Totale",
   "report.noTagsFound": "Nessun tag trovato",
-  "report.openConversations": "Apri conversazione",
   "report.sla.avgFirstResp": "Tempo Di Risposta Medio",
   "report.sla.avgNextResp": "Tempo di risposta successivo medio",
   "report.sla.avgResolution": "Orario di risoluzione medio",
   "report.sla.breached": "Violazione",
-  "report.sla.cardTitle": "Prestazioni SLA (Ultimi {days} giorni)",
   "report.sla.compliance": "Conformità",
   "report.sla.firstResponse": "Prima Risposta",
   "report.sla.met": "Incontrato",
   "report.sla.nextResponse": "Risposta Successiva",
   "report.sla.resolution": "Risoluzione",
-  "report.tags.cardTitle": "Distribuzione dei tag (ultimi {days} giorni)",
   "report.tags.tagged": "Taggato",
   "report.tags.topTags": "Tag principali",
   "role.deletionConfirmation": "Questa azione non può essere annullata. Questo ruolo verrà eliminato permanentemente.",
@@ -966,7 +950,6 @@
   "validation.invalidKey": "Chiave non valida",
   "validation.invalidPermission": "Permesso non valido",
   "validation.invalidPortValue": "Valore della porta non valido",
-  "validation.invalidProvider": "Fornitore non valido",
   "validation.invalidSnoozeDuration": "Durata posticipo non valida",
   "validation.invalidTimeFormat": "Formato orario non valido (HH:mm)",
   "validation.invalidUrl": "URL non valido",
@@ -1000,11 +983,9 @@
   "validation.subjectCannotBeEmpty": "L'oggetto non può essere vuoto",
   "validation.tooLongStatus": "Lo stato è troppo lungo, deve avere al massimo {max} caratteri",
   "view.form.description": "Crea e salva visualizzazioni di filtri personalizzate per un rapido accesso alle conversazioni.",
-  "view.form.filter.partiallyFilled": "Assicurati di aver compilato correttamente i campi del filtro.",
   "view.form.filter.selectAtLeastOne": "Seleziona almeno un filtro",
   "view.form.filters.description": "Imposta uno o più filtri per personalizzare la vista.",
   "view.form.name.description": "Inserisci un nome univoco per la tua vista.",
-  "view.form.name.length": "Il nome della politica SLA deve essere compreso tra 2 e 30 caratteri.",
   "webhook.edit": "Modifica webhook",
   "webhook.new": "Nuovo webhook",
   "webhook.sendTest": "Invia test",
diff --git a/i18n/ja-JP.json b/i18n/ja-JP.json
index 7917f461..b9f4efab 100644
--- a/i18n/ja-JP.json
+++ b/i18n/ja-JP.json
@@ -3,11 +3,9 @@
   "_.name": "日本語",
   "account.avatarRemoved": "アバターが削除されました",
   "account.changeAvatar": "ここでアバターを変更できます。",
-  "account.chooseAFile": "ファイルを選択…",
   "account.cropAvatar": "アバターを切り抜き",
   "account.editProfile": "プロフィールを編集",
   "account.publicAvatar": "公開アバター",
-  "account.removeAvatar": "アバターを削除",
   "actions.addAction": "アクションを追加",
   "actions.addCondition": "条件を追加",
   "actions.addTags": "タグを追加",
@@ -81,7 +79,6 @@
   "admin.contextLink.help.detail": "{'{{token}}'} を使用すると、外部アプリが共有シークレットで復号する完全に暗号化されたペイロードになります。または {'{{email}}'}、{'{{phone}}'}、{'{{external_user_id}}'} などの個別変数を使用して、信頼できる社内ツールへのプレーンURLリンクを作成できます。",
   "admin.conversationStatus.name.description": "ステータス名を設定してください。設定が終わったら「保存」をクリックしてください。",
   "admin.conversationTags.edit.description": "タグ名を変更してください。変更が終わったら「保存」をクリックしてください。",
-  "admin.conversationTags.name.valid": "タグ名は少なくとも 3 文字必要です",
   "admin.conversationTags.new.description": "タグ名を設定してください。設定が終わったら「保存」をクリックしてください。",
   "admin.customAttribute.help": "カスタム属性を使用すると、サブスクリプションプランや初回購入日など、連絡先や会話に関する追加情報を設定できます。",
   "admin.customAttributes.keyNotAllowed": "指定したキーはデフォルト属性と重複しているため使用できません。別のキーを使用してください。",
@@ -193,7 +190,6 @@
   "admin.inbox.livechat.noticeBanner.enabled": "お知らせバナーを有効化",
   "admin.inbox.livechat.noticeBanner.text": "お知らせバナーのテキスト",
   "admin.inbox.livechat.officeHours": "営業時間",
-  "admin.inbox.livechat.prechatForm.addField": "フィールドを追加",
   "admin.inbox.livechat.prechatForm.availableFields": "利用可能なカスタム属性",
   "admin.inbox.livechat.prechatForm.enabled": "チャット前フォームを有効化",
   "admin.inbox.livechat.prechatForm.enabled.description": "チャット開始前に情報を収集するフォームを表示します",
@@ -371,9 +367,6 @@
   "agent.generateApiKey": "APIキーを生成",
   "agent.new": "新規エージェント",
   "agent.selectAvailabilityStatus": "対応状況を選択",
-  "ai.apiKey.description": "{provider} の API キーが設定されていないか無効です。AI 機能を使用するには、有効な API キーを入力してください。",
-  "ai.apiKeyNotSet": "{provider} の API キーが設定されていません。管理者に設定を依頼してください",
-  "ai.enterOpenAIAPIKey": "OpenAI API キーを入力してください",
   "auth.backToLogin": "ログイン画面に戻る",
   "auth.checkEmailForReset": "パスワードのリセット用のリンクをメールで送信しましたのでご確認ください。",
   "auth.confirmPassword": "パスワードの確認入力",
@@ -591,8 +584,6 @@
   "globals.messages.sendUsMessage": "メッセージを送信してください",
   "globals.messages.sending": "送信中...",
   "globals.messages.setUp": "設定",
-  "globals.messages.smallScreenDescription": "Libredeskは大きな画面向けに設計されています。最適な体験のために、デスクトップまたはタブレットをご利用ください。",
-  "globals.messages.smallScreenTitle": "最高の体験のためにデスクトップに切り替えてください",
   "globals.messages.somethingWentWrong": "エラーが発生しました",
   "globals.messages.startNewConversation": "新しい会話を開始",
   "globals.messages.startTypingToSearch": "入力を開始して検索…",
@@ -876,32 +867,25 @@
   "replyBox.removeBCC": "BCCを削除",
   "replyBox.sendAnyway": "それでも送信",
   "replyBox.toRequired": "宛先フィールドに少なくとも1つの受信者が必要です。",
-  "report.agentStatus": "担当者の状態",
   "report.chart.newConversations": "新しい会話",
   "report.chart.resolvedConversations": "解決済みの会話",
-  "report.chart.title": "会話の傾向",
   "report.csat.avgRating": "平均評価",
-  "report.csat.cardTitle": "顧客満足度（直近 {days} 日間）",
   "report.csat.responseRate": "応答率",
   "report.csat.responses": "応答",
-  "report.messages.cardTitle": "メッセージの数（直近 {days} 日間）",
   "report.messages.incoming": "受信",
   "report.messages.outgoing": "送信",
   "report.messages.perConversation": "会話ごと",
   "report.messages.total": "合計",
   "report.noTagsFound": "タグが見つかりません",
-  "report.openConversations": "会話を開く",
   "report.sla.avgFirstResp": "平均初回応答時間",
   "report.sla.avgNextResp": "平均追加応答時間",
   "report.sla.avgResolution": "平均解決時間",
   "report.sla.breached": "違反",
-  "report.sla.cardTitle": "SLA 達成状況（直近 {days} 日間）",
   "report.sla.compliance": "コンプライアンス",
   "report.sla.firstResponse": "初回応答",
   "report.sla.met": "達成",
   "report.sla.nextResponse": "追加応答",
   "report.sla.resolution": "解決",
-  "report.tags.cardTitle": "タグの分布（直近 {days} 日間）",
   "report.tags.tagged": "タグを付けました",
   "report.tags.topTags": "トップタグ",
   "role.deletionConfirmation": "この操作は元に戻せません。このロールは完全に削除されます。",
@@ -970,7 +954,6 @@
   "validation.invalidKey": "無効なキー",
   "validation.invalidPermission": "無効な権限",
   "validation.invalidPortValue": "無効なポート値",
-  "validation.invalidProvider": "無効なプロバイダー",
   "validation.invalidSnoozeDuration": "無効なスヌーズ時間です",
   "validation.invalidTimeFormat": "無効な時刻フォーマット (HH:mm)",
   "validation.invalidUrl": "無効なURL",
@@ -1004,11 +987,9 @@
   "validation.subjectCannotBeEmpty": "件名を空にすることはできません",
   "validation.tooLongStatus": "ステータスが長すぎます。{max}文字以下にしてください",
   "view.form.description": "会話に素早くアクセスできるよう、カスタムフィルターを作成して保存してください。",
-  "view.form.filter.partiallyFilled": "フィルターの入力内容が正しいか確認してください。",
   "view.form.filter.selectAtLeastOne": "少なくとも1つのフィルターを選択してください。",
   "view.form.filters.description": "ビューをカスタマイズするために、1つ以上のフィルターを設定してください。",
   "view.form.name.description": "ビューに一意の名前を入力してください。",
-  "view.form.name.length": "ビュー名は2文字以上30文字以下で入力してください。",
   "webhook.edit": "Webhookを編集",
   "webhook.new": "新規Webhook",
   "webhook.sendTest": "テスト送信",
diff --git a/i18n/mr-IN.json b/i18n/mr-IN.json
index 0c8c08fb..85305777 100644
--- a/i18n/mr-IN.json
+++ b/i18n/mr-IN.json
@@ -3,11 +3,9 @@
   "_.name": "मराठी",
   "account.avatarRemoved": "अवतार काढला",
   "account.changeAvatar": "तुमचा अवतार येथे बदला.",
-  "account.chooseAFile": "फाइल निवडा...",
   "account.cropAvatar": "अवतार क्रॉप करा",
   "account.editProfile": "प्रोफाइल संपादित करा",
   "account.publicAvatar": "सार्वजनिक अवतार",
-  "account.removeAvatar": "अवतार काढा",
   "actions.addAction": "क्रिया जोडा",
   "actions.addCondition": "अट जोडा",
   "actions.addTags": "टॅग्ज जोडा",
@@ -81,7 +79,6 @@
   "admin.contextLink.help.detail": "संपूर्ण एन्क्रिप्टेड पेलोडसाठी {'{{token}}'} वापरा जो बाह्य अॅप सामायिक गुपिताने डिक्रिप्ट करतो. किंवा विश्वसनीय अंतर्गत साधनांसाठी सादा URL दुव्यांमध्ये {'{{email}}'}, {'{{phone}}'}, {'{{external_user_id}}'} सारखे वैयक्तिक व्हेरिएबल्स वापरा.",
   "admin.conversationStatus.name.description": "स्थिती नाव सेट करा. पूर्ण झाल्यावर जतन करा क्लिक करा.",
   "admin.conversationTags.edit.description": "टॅग नाव बदला. पूर्ण झाल्यावर जतन करा क्लिक करा.",
-  "admin.conversationTags.name.valid": "टॅग नाव किमान 3 अक्षरे असावे",
   "admin.conversationTags.new.description": "टॅग नाव सेट करा. पूर्ण झाल्यावर जतन करा क्लिक करा.",
   "admin.customAttribute.help": "कस्टम अॅट्रिब्यूट तुम्हाला तुमच्या संपर्कांबद्दल किंवा संभाषणांबद्दल अतिरिक्त तपशील सेट करण्यात मदत करतात जसे की सदस्यता योजना किंवा त्यांच्या पहिल्या खरेदीची तारीख.",
   "admin.customAttributes.keyNotAllowed": "प्रदान केलेली की परवानगी नाही कारण ती डिफॉल्ट अॅट्रिब्यूटांशी संघर्ष करते. कृपया वेगळी की वापरा.",
@@ -193,7 +190,6 @@
   "admin.inbox.livechat.noticeBanner.enabled": "सूचना बॅनर सक्षम करा",
   "admin.inbox.livechat.noticeBanner.text": "सूचना बॅनर मजकूर",
   "admin.inbox.livechat.officeHours": "कार्यालयीन तास",
-  "admin.inbox.livechat.prechatForm.addField": "फील्ड जोडा",
   "admin.inbox.livechat.prechatForm.availableFields": "उपलब्ध कस्टम अॅट्रिब्यूट",
   "admin.inbox.livechat.prechatForm.enabled": "प्री-चॅट फॉर्म सक्षम करा",
   "admin.inbox.livechat.prechatForm.enabled.description": "चॅट सुरू होण्यापूर्वी माहिती गोळा करण्यासाठी फॉर्म दाखवा",
@@ -371,9 +367,6 @@
   "agent.generateApiKey": "API की निर्माण करा",
   "agent.new": "नवीन एजंट",
   "agent.selectAvailabilityStatus": "उपलब्धता स्थिती निवडा",
-  "ai.apiKey.description": "{provider} API की सेट केलेली नाही किंवा अवैध आहे. AI वैशिष्ट्ये वापरण्यासाठी वैध API की प्रविष्ट करा.",
-  "ai.apiKeyNotSet": "{provider} API की सेट केलेली नाही. कृपया तुमच्या प्रशासकांना ते सेट करण्यास सांगा",
-  "ai.enterOpenAIAPIKey": "OpenAI API की प्रविष्ट करा",
   "auth.backToLogin": "लॉगिनवर परत जा",
   "auth.checkEmailForReset": "कृपया रीसेट लिंकसाठी तुमचा ईमेल तपासा.",
   "auth.confirmPassword": "पासवर्ड पुष्टी करा",
@@ -592,8 +585,6 @@
   "globals.messages.sendUsMessage": "आम्हाला संदेश पाठवा",
   "globals.messages.sending": "पाठवत आहे...",
   "globals.messages.setUp": "सेट अप करा",
-  "globals.messages.smallScreenDescription": "Libredesk मोठ्या स्क्रीनसाठी डिझाइन केले आहे. सर्वोत्तम अनुभवासाठी, कृपया डेस्कटॉप किंवा टॅबलेट वापरा.",
-  "globals.messages.smallScreenTitle": "सर्वोत्तम अनुभवासाठी डेस्कटॉपवर जा",
   "globals.messages.somethingWentWrong": "काहीतरी चुकले",
   "globals.messages.startNewConversation": "नवीन संभाषण सुरू करा",
   "globals.messages.startTypingToSearch": "शोधण्यासाठी टाइप करा...",
@@ -889,32 +880,25 @@
   "replyBox.removeBCC": "BCC काढा",
   "replyBox.sendAnyway": "तरीही पाठवा",
   "replyBox.toRequired": "To फील्डमध्ये किमान एक प्राप्तकर्ता आवश्यक आहे.",
-  "report.agentStatus": "एजंट स्थिती",
   "report.chart.newConversations": "नवीन संभाषणे",
   "report.chart.resolvedConversations": "सोडवलेली संभाषणे",
-  "report.chart.title": "संभाषण ट्रेंड",
   "report.csat.avgRating": "सरासरी रेटिंग",
-  "report.csat.cardTitle": "ग्राहक समाधान (शेवटचे {days} दिवस)",
   "report.csat.responseRate": "प्रतिसाद दर",
   "report.csat.responses": "प्रतिसाद",
-  "report.messages.cardTitle": "संदेश व्हॉल्यूम (शेवटचे {days} दिवस)",
   "report.messages.incoming": "येणारे",
   "report.messages.outgoing": "बाहेर जाणारे",
   "report.messages.perConversation": "प्रति संभाषण",
   "report.messages.total": "एकूण",
   "report.noTagsFound": "कोणतेही टॅग सापडले नाहीत",
-  "report.openConversations": "उघडी संभाषणे",
   "report.sla.avgFirstResp": "सरासरी प्रथम प्रतिसाद वेळ",
   "report.sla.avgNextResp": "सरासरी पुढील प्रतिसाद वेळ",
   "report.sla.avgResolution": "सरासरी समाधान वेळ",
   "report.sla.breached": "ब्रीच",
-  "report.sla.cardTitle": "SLA कामगिरी (शेवटचे {days} दिवस)",
   "report.sla.compliance": "कंप्लायन्स",
   "report.sla.firstResponse": "प्रथम प्रतिसाद",
   "report.sla.met": "पूर्ण",
   "report.sla.nextResponse": "पुढील प्रतिसाद",
   "report.sla.resolution": "समाधान",
-  "report.tags.cardTitle": "टॅग वितरण (शेवटचे {days} दिवस)",
   "report.tags.tagged": "टॅग केलेले",
   "report.tags.topTags": "शीर्ष टॅग",
   "role.deletionConfirmation": "ही क्रिया पूर्ववत करता येणार नाही. ही भूमिका कायमची हटवली जाईल.",
@@ -983,7 +967,6 @@
   "validation.invalidKey": "अवैध की",
   "validation.invalidPermission": "अवैध परवानगी",
   "validation.invalidPortValue": "अवैध पोर्ट मूल्य",
-  "validation.invalidProvider": "अवैध प्रदाता",
   "validation.invalidSnoozeDuration": "अवैध स्नूझ कालावधी",
   "validation.invalidTimeFormat": "अवैध वेळ फॉरमॅट (HH:mm)",
   "validation.invalidUrl": "अवैध URL",
@@ -1017,11 +1000,9 @@
   "validation.subjectCannotBeEmpty": "विषय रिक्त असू शकत नाही",
   "validation.tooLongStatus": "स्थिती खूप लांब आहे, जास्तीत जास्त {max} अक्षरे असावीत",
   "view.form.description": "तुमच्या संभाषणांवर द्रुत प्रवेशासाठी कस्टम फिल्टर दृश्ये तयार आणि जतन करा.",
-  "view.form.filter.partiallyFilled": "कृपया फिल्टर फील्ड्स योग्यरित्या भरले आहेत याची खात्री करा.",
   "view.form.filter.selectAtLeastOne": "किमान एक फिल्टर निवडा.",
   "view.form.filters.description": "दृश्य कस्टमाइझ करण्यासाठी एक किंवा अधिक फिल्टर्स सेट करा.",
   "view.form.name.description": "तुमच्या दृश्यासाठी अद्वितीय नाव प्रविष्ट करा.",
-  "view.form.name.length": "दृश्य नाव 2 ते 30 अक्षरांदरम्यान असावे.",
   "webhook.edit": "वेबहुक संपादित करा",
   "webhook.new": "नवीन वेबहुक",
   "webhook.sendTest": "चाचणी पाठवा",
diff --git a/i18n/nl-NL.json b/i18n/nl-NL.json
new file mode 100644
index 00000000..2fe3fc91
--- /dev/null
+++ b/i18n/nl-NL.json
@@ -0,0 +1,1067 @@
+{
+  "_.code": "nl-NL",
+  "_.name": "Nederlands",
+  "account.avatarRemoved": "Avatar verwijderd",
+  "account.changeAvatar": "Wijzig hier je avatar.",
+  "account.cropAvatar": "Avatar bijsnijden",
+  "account.editProfile": "Profiel bewerken",
+  "account.publicAvatar": "Openbare avatar",
+  "actions.addAction": "Actie toevoegen",
+  "actions.addCondition": "Voorwaarde toevoegen",
+  "actions.addTags": "Tags toevoegen",
+  "actions.addingPrivateNotes": "Privénotities toevoegen",
+  "actions.addPrivateNote": "Privénotitie toevoegen",
+  "actions.applyMacro": "Macro toepassen",
+  "actions.assignAgent": "Agent toewijzen",
+  "actions.assignTeam": "Team toewijzen",
+  "actions.noActions": "Geen acties",
+  "actions.removeLink": "Link verwijderen",
+  "actions.removeTags": "Tags verwijderen",
+  "actions.sendCsat": "CSAT versturen",
+  "actions.sendReply": "Antwoord versturen",
+  "actions.setPriority": "Prioriteit instellen",
+  "actions.setSla": "SLA instellen",
+  "actions.setStatus": "Status instellen",
+  "actions.setTags": "Tags instellen",
+  "actions.setValue": "Waarde instellen",
+  "actions.startingConversation": "Gesprek starten",
+  "activityLog.agentAway": "{actorEmail} ({actorId}) heeft de status van {targetEmail} ({targetId}) gewijzigd naar afwezig",
+  "activityLog.agentAwayReassign": "{actorEmail} ({actorId}) heeft de status van {targetEmail} ({targetId}) gewijzigd naar afwezig en wijst gesprekken opnieuw toe",
+  "activityLog.agentAwayReassignSelf": "{actorEmail} ({actorId}) is afwezig en wijst gesprekken opnieuw toe",
+  "activityLog.agentAwaySelf": "{actorEmail} ({actorId}) is afwezig",
+  "activityLog.agentLogin": "{email} ({userId}) heeft zich aangemeld",
+  "activityLog.agentLogout": "{email} ({userId}) heeft zich afgemeld",
+  "activityLog.agentOnline": "{actorEmail} ({actorId}) heeft de status van {targetEmail} ({targetId}) gewijzigd naar online",
+  "activityLog.agentOnlineSelf": "{actorEmail} ({actorId}) is online",
+  "activityLog.agentPasswordSet": "{actorEmail} ({actorId}) heeft een wachtwoord ingesteld voor {targetEmail} ({targetId})",
+  "activityLog.entryType": "Type logboekvermelding",
+  "activityLog.entryType.agentAway": "Agent afwezig",
+  "activityLog.entryType.agentAwayReassigned": "Agent afwezig, opnieuw toegewezen",
+  "activityLog.entryType.agentLogin": "Agent aangemeld",
+  "activityLog.entryType.agentLogout": "Agent afgemeld",
+  "activityLog.entryType.agentOnline": "Agent online",
+  "activityLog.entryType.agentPasswordSet": "Wachtwoord agent ingesteld",
+  "activityLog.entryType.agentRolePermissionsChanged": "Rolrechten agent gewijzigd",
+  "activityLog.rolePermissionsAdded": "{actorEmail} ({actorId}) heeft recht(en) {permissions} toegevoegd aan rol {roleName} ({roleId})",
+  "activityLog.rolePermissionsChanged": "{actorEmail} ({actorId}) heeft recht(en) {removed} verwijderd en recht(en) {added} toegevoegd aan rol {roleName} ({roleId})",
+  "activityLog.rolePermissionsRemoved": "{actorEmail} ({actorId}) heeft recht(en) {permissions} verwijderd van rol {roleName} ({roleId})",
+  "admin.agent.apiKey.description": "Genereer API-sleutels voor deze agent om Libredesk programmatisch te benaderen.",
+  "admin.agent.apiKey.noKey": "Er is geen API-sleutel gegenereerd voor deze agent.",
+  "admin.agent.apiKey.warningMessage": "Dit geheim wordt maar één keer getoond. Zorg dat je het nu kopieert.",
+  "admin.agent.deleteConfirmation": "Hiermee wordt de agent permanent verwijderd. Overweeg om het account in plaats daarvan uit te schakelen.",
+  "admin.agent.help": "Beheer supportagents, rollen, rechten en teams.",
+  "admin.automation.all": "ALLE",
+  "admin.automation.and": "EN",
+  "admin.automation.any": "ELKE",
+  "admin.automation.conversationUpdate": "Gesprek bijgewerkt",
+  "admin.automation.conversationUpdate.description": "Regels die worden uitgevoerd wanneer een gesprek wordt bijgewerkt.",
+  "admin.automation.evaluateRuleOnTheseEvents": "Regel evalueren bij deze gebeurtenissen.",
+  "admin.automation.event.message.incoming": "Inkomend bericht",
+  "admin.automation.event.message.outgoing": "Uitgaand bericht",
+  "admin.automation.event.priority.change": "Prioriteitswijziging",
+  "admin.automation.event.status.change": "Statuswijziging",
+  "admin.automation.executeAllMatchingRules": "Alle overeenkomende regels uitvoeren",
+  "admin.automation.executeFirstMatchingRule": "Eerste overeenkomende regel uitvoeren",
+  "admin.automation.help": "Automatiseer acties wanneer gesprekken worden aangemaakt, bijgewerkt of volgens een uurschema.",
+  "admin.automation.invalid": "Zorg dat je minstens één actie en één regel hebt en dat hun waarden niet leeg zijn.",
+  "admin.automation.matchBelow": "Voldoe hieronder aan {any_or_all}.",
+  "admin.automation.matchTheseRules": "Voldoe aan deze regels",
+  "admin.automation.newConversation.description": "Regels die worden uitgevoerd wanneer een contact een nieuw gesprek start. Gesprekken die door agents worden gestart, activeren deze regels niet. Sleep om de volgorde te wijzigen.",
+  "admin.automation.noRulesFound": "Geen regels gevonden",
+  "admin.automation.or": "OF",
+  "admin.automation.performTheseActions": "Voer deze acties uit",
+  "admin.automation.timeTriggers": "Tijdtriggers",
+  "admin.automation.timeTriggers.description": "Regels die één keer per uur worden uitgevoerd.",
+  "admin.automation.validation.addAction": "Voeg minstens één actie toe.",
+  "admin.automation.validation.addCondition": "Voeg minstens één voorwaarde toe.",
+  "admin.automation.validation.selectActionType": "Selecteer een type voor alle acties.",
+  "admin.automation.validation.selectField": "Selecteer een veld voor alle voorwaarden.",
+  "admin.automation.validation.selectOperator": "Selecteer een operator voor alle voorwaarden.",
+  "admin.automation.validation.setActionValue": "Stel een waarde in voor alle acties.",
+  "admin.automation.validation.setConditionValue": "Stel een waarde in voor alle voorwaarden.",
+  "admin.banner.restartMessage": "Er zijn instellingen gewijzigd die een herstart van de applicatie vereisen om van kracht te worden.",
+  "admin.businessHour.help.description": "Met openingstijden kun je werktijden instellen voor je hele helpdesk of voor afzonderlijke teams.",
+  "admin.businessHour.help.detail": "SLA-berekeningen zijn gebaseerd op openingstijden. Als een team openingstijden heeft ingesteld, wordt de SLA berekend op basis van de tijden van dat team. Anders wordt teruggevallen op de openingstijden van de helpdesk.",
+  "admin.businessHours.alwaysOpen24x7": "Altijd open (24/7)",
+  "admin.businessHours.customBusinessHours": "Aangepaste openingstijden",
+  "admin.businessHours.setBusinessHours": "Openingstijden instellen",
+  "admin.contextLink.help.description": "Contextlinks verschijnen in de gespreksbalk en stellen agents in staat externe tools zoals CRM's, facturatiesystemen of interne dashboards te openen, waarbij de gegevens van het contact automatisch worden meegegeven.",
+  "admin.contextLink.help.detail": "Gebruik {'{{token}}'} voor een volledig versleutelde payload die de externe app ontsleutelt met een gedeeld geheim. Of gebruik losse variabelen zoals {'{{email}}'}, {'{{phone}}'}, {'{{external_user_id}}'} voor gewone URL-links naar vertrouwde interne tools.",
+  "admin.conversationStatus.category.placeholder": "Selecteer categorie",
+  "admin.conversationStatus.name.description": "Stel de statusnaam in. Klik op opslaan als je klaar bent.",
+  "admin.conversationTags.edit.description": "Wijzig de tagnaam. Klik op opslaan als je klaar bent.",
+  "admin.conversationTags.new.description": "Stel de tagnaam in. Klik op opslaan als je klaar bent.",
+  "admin.customAttribute.help": "Aangepaste kenmerken helpen je extra details over je contacten of gesprekken vast te leggen, zoals het abonnement of de datum van hun eerste aankoop.",
+  "admin.customAttributes.keyNotAllowed": "De opgegeven sleutel is niet toegestaan omdat deze conflicteert met standaardkenmerken. Gebruik een andere sleutel.",
+  "admin.customAttributes.regex.description": "Regex om de waarde van dit aangepaste kenmerk te valideren. Laat leeg om validatie over te slaan.",
+  "admin.customAttributes.regexHint.description": "Hint voor het regex-patroon.",
+  "admin.empty": "Selecteer een sectie in de zijbalk",
+  "admin.ai.toolsHelp": "Tools laten de AI-assistent je eigen API's gebruiken om gegevens op te halen of bij te werken tijdens het reageren. Een tool wordt gedeeld met elke assistent die toegang heeft verleend en het model bepaalt wanneer het, op basis van de naam en beschrijving, moet worden aangeroepen. Gebruik dus een nauwkeurige naam en beschrijving.",
+  "admin.ai.snippet.contentPlaceholder": "Wij bieden restituties aan binnen 30 dagen na aankoop. Om er een aan te vragen...",
+  "admin.general.allowedFileUploadExtensions": "Toegestane bestandsextensies voor uploads",
+  "admin.general.allowedFileUploadExtensions.description": "Gebruik `*` om alle bestandstypen toe te staan. Bijvoorbeeld: `jpg, png, pdf`",
+  "admin.general.businessHours.placeholder": "Selecteer openingstijden",
+  "admin.general.faviconURL": "Favicon-URL",
+  "admin.general.faviconURL.valid": "Favicon-URL moet een geldige URL zijn",
+  "admin.general.help": "Dit zijn je standaardinstellingen voor de hele helpdesk. Instellingen op teamniveau overschrijven deze waar geconfigureerd.",
+  "admin.general.language.placeholder": "Selecteer taal",
+  "admin.general.logoURL.valid": "Logo-URL moet een geldige URL zijn",
+  "admin.general.maxAllowedFileUploadSize": "Maximale bestandsgrootte voor uploads",
+  "admin.general.maxAllowedFileUploadSize.description": "Maximale bestandsgrootte voor uploads in MB.",
+  "admin.general.maxAllowedFileUploadSize.valid": "Maximale bestandsgrootte voor uploads moet tussen 1 en 500 MB liggen",
+  "admin.general.rootURL.description": "Hoofd-URL voor de app. (Geen schuine streep aan het einde).",
+  "admin.general.rootURL.valid": "Hoofd-URL moet een geldige URL zijn",
+  "admin.general.siteName": "Sitenaam",
+  "admin.general.siteName.min": "Sitenaam moet minstens 1 teken bevatten",
+  "admin.general.timezone.placeholder": "Selecteer tijdzone",
+  "admin.inbox.authProtocol": "Authenticatieprotocol",
+  "admin.inbox.authProtocol.description": "Te gebruiken authenticatieprotocol.",
+  "admin.inbox.authProtocol.login": "Login",
+  "admin.inbox.authProtocol.plain": "Plain",
+  "admin.inbox.chooseChannel": "Kies kanaal",
+  "admin.inbox.createEmailInbox": "Maak een e-mailinbox voor e-mailgebaseerde klantenondersteuning",
+  "admin.inbox.createLiveChatInbox": "Maak een live chat-inbox voor realtime klantenondersteuning",
+  "admin.inbox.csatSurveys": "CSAT-enquêtes",
+  "admin.inbox.csatSurveys.description_1": "Verstuur klanttevredenheidsenquêtes wanneer een gesprek als opgelost wordt gemarkeerd.",
+  "admin.inbox.csatSurveys.description_2": "Voor meer controle over wanneer enquêtes worden verstuurd, schakel deze optie uit en maak een automatiseringsregel om enquêtes te versturen.",
+  "admin.inbox.csatSurveys.description_3": "CSAT-enquêtes worden maar één keer per gesprek verstuurd.",
+  "admin.inbox.enablePlusAddressing": "Plusadressering inschakelen",
+  "admin.inbox.enablePlusAddressing.description": "Verbetert de threading van gesprekken, maar vereist ondersteuning van de provider (bijv. Gmail, Microsoft 365).",
+  "admin.inbox.enablePlusAddressing.requiredForMicrosoft": "Vereist voor Microsoft-inboxen om antwoorden correct te threaden.",
+  "admin.inbox.enabled.description": "Schakel het scannen van de inbox en het versturen van berichten in of uit.",
+  "admin.inbox.fromEmailAddress.description": "Afzender-e-mailadres voor je inbox. Bijv. Mijn inbox <support{'@'}example.com>",
+  "admin.inbox.fromEmailAddress.placeholder": "Mijn inbox <support{'@'}example.com>",
+  "admin.inbox.heloHostname": "HELO-hostnaam",
+  "admin.inbox.heloHostname.description": "De hostnaam die in het HELO/EHLO-commando wordt gebruikt. Als deze niet is ingesteld, wordt standaard localhost gebruikt.",
+  "admin.inbox.help.email": "Verbind je Google- of Microsoft-e-mailaccount, of configureer IMAP- en SMTP-instellingen handmatig. Elke toegevoegde inbox maakt een nieuw e-mailkanaal aan voor het ontvangen van klant-e-mails.",
+  "admin.inbox.help.livechat": "Maak live chat-widgets die op je website kunnen worden ingesloten voor realtime klantenondersteuning.",
+  "admin.inbox.idleTimeout": "Inactiviteitstime-out",
+  "admin.inbox.idleTimeout.description": "Maximale tijd dat een inactieve verbinding in leven moet worden gehouden voordat deze wordt gesloten en uit de pool verwijderd.",
+  "admin.inbox.imap.tls.description": "Kies de versleutelingsmethode voor IMAP.",
+  "admin.inbox.imapConfig": "IMAP-configuratie",
+  "admin.inbox.imapScanInboxSince": "Inbox scannen sinds",
+  "admin.inbox.imapScanInboxSince.description": "Om de prestaties in grote helpdesks met veel e-mailverkeer te verbeteren, beperkt dit het scannen tot e-mails die zijn ontvangen sinds de opgegeven duur (bijv. `2h`, `48h`) door deze van de huidige tijd af te trekken.",
+  "admin.inbox.imapScanInterval": "Scaninterval",
+  "admin.inbox.imapScanInterval.description": "Interval om de inbox op nieuwe e-mails te scannen. Formaat: 120s, 1m, 1h",
+  "admin.inbox.livechat.allowStartConversation": "Gesprek starten toestaan",
+  "admin.inbox.livechat.allowStartConversation.users.description": "Sta gebruikers toe nieuwe gesprekken te starten",
+  "admin.inbox.livechat.allowStartConversation.visitors.description": "Sta bezoekers toe nieuwe gesprekken te starten",
+  "admin.inbox.livechat.blockedIPs.description": "Voer IP-adressen of CIDR-bereiken in om te blokkeren, één per regel. Geblokkeerde IP's krijgen geen toegang tot de widget.",
+  "admin.inbox.livechat.blockedIPs.list": "IP-blokkeerlijst",
+  "admin.inbox.livechat.chatIntroduction": "Chatintroductie",
+  "admin.inbox.livechat.chatReplyExpectationMessage": "Bericht over verwachte antwoordtijd",
+  "admin.inbox.livechat.chatReplyExpectationMessage.description": "Bericht dat tijdens openingstijden wordt getoond over de verwachte antwoordtijden.",
+  "admin.inbox.livechat.colors": "Kleuren",
+  "admin.inbox.livechat.continuity.maxMessagesPerEmail": "Max. berichten per e-mail",
+  "admin.inbox.livechat.continuity.maxMessagesPerEmail.description": "Maximaal aantal berichten om op te nemen in één continuïteitse-mail. Max. 100.",
+  "admin.inbox.livechat.continuity.minEmailInterval": "Min. e-mailinterval",
+  "admin.inbox.livechat.continuity.minEmailInterval.description": "Minimale tijd tussen continuïteitse-mails naar hetzelfde contact. Min. 1m.",
+  "admin.inbox.livechat.continuity.offlineThreshold": "Offline-drempel",
+  "admin.inbox.livechat.continuity.offlineThreshold.description": "Hoe lang er moet worden gewacht nadat een contact offline gaat voordat er een e-mail wordt verstuurd. Min. 1m.",
+  "admin.inbox.livechat.continuityEmailFooter": "Beantwoord deze e-mail rechtstreeks om het gesprek voort te zetten.",
+  "admin.inbox.livechat.continuityEmailFooterWithLink": "Beantwoord deze e-mail of {link}ga naar de chat{endlink} om het gesprek voort te zetten.",
+  "admin.inbox.livechat.conversationContinuity": "E-mailinbox voor gesprekscontinuïteit",
+  "admin.inbox.livechat.conversationContinuity.description": "Wanneer een contact offline gaat, worden antwoorden verstuurd via deze e-mailinbox. Ze kunnen het gesprek voortzetten door de e-mail te beantwoorden of terug te keren naar de chatwidget.",
+  "admin.inbox.livechat.darkMode": "Donkere modus",
+  "admin.inbox.livechat.darkMode.description": "Schakel de donkere modus in voor de chatwidget",
+  "admin.inbox.livechat.directToConversation": "Direct in gesprek starten",
+  "admin.inbox.livechat.directToConversation.description": "Sla het startscherm over en open direct het laatste gesprek van de gebruiker, of een nieuw gesprek als er geen bestaat",
+  "admin.inbox.livechat.externalLinks": "Externe links",
+  "admin.inbox.livechat.externalLinks.add": "Externe link toevoegen",
+  "admin.inbox.livechat.fallbackLanguage": "Terugvaltaal",
+  "admin.inbox.livechat.fallbackLanguage.description": "Taal die wordt gebruikt wanneer de browsertaal van de bezoeker niet beschikbaar is.",
+  "admin.inbox.livechat.features.emoji": "Emoji-ondersteuning",
+  "admin.inbox.livechat.features.emoji.description": "Sta gebruikers toe emoji's te gebruiken in de chat",
+  "admin.inbox.livechat.features.fileUpload": "Bestandsupload",
+  "admin.inbox.livechat.features.fileUpload.description": "Sta gebruikers toe bestanden te uploaden in de chat",
+  "admin.inbox.livechat.greetingMessage": "Begroetingsbericht",
+  "admin.inbox.livechat.greetingMessage.variables": "Beschikbare variabelen: {'{{.FirstName}}'}, {'{{.LastName}}'}. Gebruik {'|'} voor een terugval, bijv. Hoi {'{{.FirstName | daar}}'}",
+  "admin.inbox.livechat.homeScreen.fadeBackground": "Achtergrond laten vervagen",
+  "admin.inbox.livechat.homeScreen.fadeBackground.description": "Laat de achtergrond van de koptekst overvloeien in het contentgebied eronder",
+  "admin.inbox.livechat.homeScreen.headerTextColor.description": "Kleur van de begroetings- en introductietekst op het startscherm",
+  "admin.inbox.livechat.installation.identity.addJwt": "Voeg de ondertekende JWT toe aan LibredeskSettings:",
+  "admin.inbox.livechat.installation.identity.description": "Verifieer ingelogde gebruikers zodat gesprekken aan hun echte accounts worden gekoppeld en gebruikers zich niet voor elkaar kunnen uitgeven.",
+  "admin.inbox.livechat.installation.identity.howItWorks": "Je server genereert een ondertekende JWT met de gegevens van de gebruiker. Gebruik de geheime sleutel van het tabblad Beveiliging om deze te ondertekenen met het HS256-algoritme.",
+  "admin.inbox.livechat.installation.identity.secretWarning": "Stel de geheime sleutel nooit bloot in code aan de clientzijde. Genereer de JWT altijd op je server.",
+  "admin.inbox.livechat.installation.identity.title": "Identiteitsverificatie",
+  "admin.inbox.livechat.installation.instructions.step1": "Kopieer het onderstaande codefragment",
+  "admin.inbox.livechat.installation.instructions.step2": "Plak het vlak vóór de afsluitende `body`-tag op elke pagina waar je de live chat-widget wilt laten verschijnen",
+  "admin.inbox.livechat.installation.instructions.title": "Installatie-instructies",
+  "admin.inbox.livechat.installation.jsApi.description": "Bestuur de widget programmatisch vanuit je applicatie.",
+  "admin.inbox.livechat.installation.jsApi.title": "JavaScript-API",
+  "admin.inbox.livechat.introductionMessage": "Introductiebericht",
+  "admin.inbox.livechat.language.auto": "Automatisch detecteren (browsertaal)",
+  "admin.inbox.livechat.launcher": "Launcher",
+  "admin.inbox.livechat.launcher.color": "Launcherkleur",
+  "admin.inbox.livechat.launcher.logo": "Launcherlogo",
+  "admin.inbox.livechat.launcher.position": "Positie",
+  "admin.inbox.livechat.launcher.position.left": "Links",
+  "admin.inbox.livechat.launcher.position.right": "Rechts",
+  "admin.inbox.livechat.launcher.spacing.bottom": "Afstand onderkant",
+  "admin.inbox.livechat.launcher.spacing.bottom.description": "Afstand vanaf de onderkant van het scherm in pixels",
+  "admin.inbox.livechat.launcher.spacing.side": "Afstand zijkant",
+  "admin.inbox.livechat.launcher.spacing.side.description": "Afstand vanaf de zijkant van het scherm in pixels",
+  "admin.inbox.livechat.noticeBanner": "Meldingsbanner",
+  "admin.inbox.livechat.noticeBanner.enabled": "Meldingsbanner inschakelen",
+  "admin.inbox.livechat.noticeBanner.text": "Tekst meldingsbanner",
+  "admin.inbox.livechat.officeHours": "Kantooruren",
+  "admin.inbox.livechat.prechatForm.availableFields": "Beschikbare aangepaste kenmerken",
+  "admin.inbox.livechat.prechatForm.enabled": "Pre-chatformulier inschakelen",
+  "admin.inbox.livechat.prechatForm.enabled.description": "Toon een formulier om informatie te verzamelen voordat de chat begint",
+  "admin.inbox.livechat.prechatForm.fields": "Formuliervelden",
+  "admin.inbox.livechat.prechatForm.noFields": "Geen velden geconfigureerd. Voeg velden toe uit aangepaste kenmerken.",
+  "admin.inbox.livechat.prechatForm.title": "Formuliertitel",
+  "admin.inbox.livechat.preventMultipleConversations": "Meerdere gesprekken voorkomen",
+  "admin.inbox.livechat.preventMultipleConversations.users.description": "Voorkom dat gebruikers meerdere gesprekken tegelijk starten",
+  "admin.inbox.livechat.preventMultipleConversations.visitors.description": "Voorkom dat bezoekers meerdere gesprekken tegelijk starten",
+  "admin.inbox.livechat.preventReplyToClosedConversation": "Antwoorden op gesloten gesprekken voorkomen",
+  "admin.inbox.livechat.preventReplyToClosedConversation.description": "Wanneer ingeschakeld kunnen gebruikers niet antwoorden op gesloten gesprekken",
+  "admin.inbox.livechat.secretKey": "Geheime sleutel",
+  "admin.inbox.livechat.secretKey.description": "Stel een geheime sleutel in om de chatwidget te beveiligen.",
+  "admin.inbox.livechat.sessionDuration.description": "Hoe lang sessies van geverifieerde gebruikers actief blijven. Sessies worden automatisch verlengd bij activiteit. Minimaal 1 uur. Voorbeeld: 24h, 168h, 720h, 2160h.",
+  "admin.inbox.livechat.sessionDuration.label": "Sessieduur geverifieerde gebruiker",
+  "admin.inbox.livechat.showOfficeHoursAfterAssignment": "Kantooruren tonen na teamtoewijzing",
+  "admin.inbox.livechat.showOfficeHoursAfterAssignment.description": "Toon de kantooruren nadat een gesprek aan een team is toegewezen",
+  "admin.inbox.livechat.showOfficeHoursInChat": "Kantooruren tonen in chat",
+  "admin.inbox.livechat.showOfficeHoursInChat.description": "Toon wanneer het team weer beschikbaar is",
+  "admin.inbox.livechat.showPoweredBy": "\"Powered by\" tonen",
+  "admin.inbox.livechat.showPoweredBy.description": "Toon \"Powered by Libredesk\" wanneer er een gesprek open is in de widget",
+  "admin.inbox.livechat.startConversationButtonText": "Tekst knop gesprek starten",
+  "admin.inbox.livechat.tabs.appearance": "Weergave",
+  "admin.inbox.livechat.tabs.installation": "Installatie",
+  "admin.inbox.livechat.tabs.messages": "Berichten",
+  "admin.inbox.livechat.tabs.prechat": "Pre-chatformulier",
+  "admin.inbox.livechat.trustedDomains.description": "Eén domein per regel. *.example.com komt alleen overeen met subdomeinen; voeg het kale domein example.com apart toe. Laat leeg om elk domein toe te staan.",
+  "admin.inbox.livechat.trustedDomains.list": "Domeinlijst",
+  "admin.inbox.livechat.userSettings.visitors": "Bezoekers",
+  "admin.inbox.livechat.websiteUrl": "Website-URL",
+  "admin.inbox.livechat.websiteUrl.description": "URL waar de chatwidget is geïnstalleerd. Wordt gebruikt in continuïteitse-mails om terug te linken naar de chat.",
+  "admin.inbox.mailbox": "Postvak",
+  "admin.inbox.mailbox.description": "Postvak (map) om te scannen op inkomende e-mails. Standaard is INBOX (meestal niet nodig om te wijzigen).",
+  "admin.inbox.maxConnections": "Max. verbindingen",
+  "admin.inbox.maxConnections.description": "Maximaal aantal gelijktijdige verbindingen met de server.",
+  "admin.inbox.maxRetries": "Max. nieuwe pogingen",
+  "admin.inbox.maxRetries.description": "Aantal keren dat opnieuw wordt geprobeerd wanneer een bericht mislukt.",
+  "admin.inbox.oauth.chooseSetupMethod": "Kies installatiemethode",
+  "admin.inbox.oauth.clientIDSecretRequired": "Geef zowel de client-ID als het clientgeheim op",
+  "admin.inbox.oauth.connectAccount": "{provider}-account verbinden",
+  "admin.inbox.oauth.connectedVia": "Verbonden via OAuth - {provider}",
+  "admin.inbox.oauth.enterClientID": "Voer je OAuth-client-ID in",
+  "admin.inbox.oauth.enterClientSecret": "Voer je OAuth-clientgeheim in",
+  "admin.inbox.oauth.followSteps": "Volg de onderstaande stappen om je e-mailaccount te verbinden",
+  "admin.inbox.oauth.googleCloudConsole": "Google Cloud Console",
+  "admin.inbox.oauth.googleDescription": "Verbinden met Google Workspace of Gmail",
+  "admin.inbox.oauth.microsoftAzurePortal": "Microsoft Azure Portal",
+  "admin.inbox.oauth.microsoftDescription": "Verbinden met Microsoft 365 of Outlook",
+  "admin.inbox.oauth.otherProvider": "Andere provider",
+  "admin.inbox.oauth.otherProviderDescription": "IMAP en SMTP handmatig configureren",
+  "admin.inbox.oauth.reconnectAccount": "{provider}-account opnieuw verbinden",
+  "admin.inbox.oauth.reconnectDescription": "Voer je inloggegevens opnieuw in om de OAuth-verbinding te vernieuwen",
+  "admin.inbox.oauth.selectConnectionMethod": "Selecteer hoe je je e-mailaccount wilt verbinden",
+  "admin.inbox.oauth.step1CreateApp": "1. Maak een OAuth-app aan bij",
+  "admin.inbox.oauth.step2AddCallback": "2. Voeg deze callback-URL toe:",
+  "admin.inbox.oauth.step3EnterCredentials": "3. Voer hieronder je inloggegevens in:",
+  "admin.inbox.promptTagsOnReply": "Vragen om te taggen vóór antwoorden",
+  "admin.inbox.promptTagsOnReply.description": "Waarschuw agents voordat ze een antwoord versturen op een gesprek zonder tags. Agents kunnen alsnog versturen zonder te taggen door de melding te bevestigen.",
+  "admin.inbox.replyToAddress": "Reply-To-adres (optioneel)",
+  "admin.inbox.replyToAddress.description": "Waar antwoorden van klanten naartoe gaan. Alleen nodig wanneer de SMTP-afzender en het IMAP-postvak op verschillende domeinen staan.",
+  "admin.inbox.replyToAddress.placeholder": "support{'@'}example.com",
+  "admin.inbox.skipTLSVerification": "TLS-verificatie overslaan",
+  "admin.inbox.skipTLSVerification.description": "Sla de hostnaamcontrole op het TLS-certificaat over.",
+  "admin.inbox.smtpConfig": "SMTP-configuratie",
+  "admin.inbox.tls.description": "TLS/SSL-versleuteling, STARTTLS wordt vaak gebruikt.",
+  "admin.inbox.waitTimeout": "Wachttime-out",
+  "admin.inbox.waitTimeout.description": "Maximale tijd om te wachten op een verbinding voordat er een time-out optreedt. Time-outs kunnen optreden wanneer alle open verbindingen bezig zijn met het versturen van e-mails en niet snel genoeg terugkeren naar de pool. Dit is ook de time-out die wordt gebruikt bij het maken van nieuwe SMTP-verbindingen.",
+  "admin.macro.actionInvalid": "Elke actie moet een type en een waarde hebben",
+  "admin.macro.help": "Combineer meerdere gespreksacties tot macro's met één klik.",
+  "admin.macro.messageContent": "Antwoord dat wordt verstuurd wanneer de macro wordt gebruikt (optioneel)",
+  "admin.macro.messageOrActionRequired": "Er is óf berichtinhoud óf zijn acties vereist",
+  "admin.notification.help.description": "Configureer SMTP-serverinstellingen voor het versturen van e-mailmeldingen naar teamleden.",
+  "admin.notification.help.detail": "Eenmaal geconfigureerd ontvangen teamgenoten automatische meldingen voor gesprekstoewijzingen, SLA-overschrijdingen en andere belangrijke gebeurtenissen.",
+  "admin.notification.restartApp": "Instellingen succesvol bijgewerkt. Herstart de app om de wijzigingen door te voeren.",
+  "admin.oidc.help": "Configureer eenmalige aanmelding met een of meer OpenID Connect-providers.",
+  "admin.role.activityLog.manage": "Activiteitenlogboek beheren",
+  "admin.role.ai.manage": "AI-functies beheren",
+  "admin.role.automations.manage": "Automatiseringen beheren",
+  "admin.role.businessHours.manage": "Openingstijden beheren",
+  "admin.role.cannotModifyAdminRole": "Kan de beheerdersrol niet wijzigen. Maak een nieuwe rol aan.",
+  "admin.role.contactNotes.delete": "Contactnotities verwijderen",
+  "admin.role.contactNotes.read": "Contactnotities bekijken",
+  "admin.role.contactNotes.write": "Contactnotities toevoegen",
+  "admin.role.contacts.block": "Contacten blokkeren",
+  "admin.role.contacts.read": "Contactgegevens bekijken",
+  "admin.role.contacts.readAll": "Alle contacten bekijken",
+  "admin.role.contacts.write": "Contactgegevens bewerken",
+  "admin.role.contextLinks.manage": "Contextlinks beheren",
+  "admin.role.conversations.read": "Gesprek bekijken",
+  "admin.role.conversations.readAll": "Alle gesprekken bekijken",
+  "admin.role.conversations.readAssigned": "Aan mij toegewezen gesprekken bekijken",
+  "admin.role.conversations.readTeamAll": "Gesprekken van je team bekijken",
+  "admin.role.conversations.readTeamInbox": "Gesprekken in teaminbox bekijken",
+  "admin.role.conversations.readUnassigned": "Alle niet-toegewezen gesprekken bekijken",
+  "admin.role.conversations.updatePriority": "Gespreksprioriteit wijzigen",
+  "admin.role.conversations.updateStatus": "Gespreksstatus wijzigen",
+  "admin.role.conversations.updateTags": "Gesprekstags toevoegen of verwijderen",
+  "admin.role.conversations.updateTeamAssignee": "Gesprekken aan teams toewijzen",
+  "admin.role.conversations.updateUserAssignee": "Gesprekken aan gebruikers toewijzen",
+  "admin.role.conversations.write": "Gesprek aanmaken",
+  "admin.role.customAttributes.manage": "Aangepaste kenmerken beheren",
+  "admin.role.generalSettings.manage": "Algemene instellingen beheren",
+  "admin.role.help": "Beheer rollen en hun rechten voor nauwkeurige controle over je supportdesk.",
+  "admin.role.inboxes.manage": "Inboxen beheren",
+  "admin.role.macros.manage": "Macro's beheren",
+  "admin.role.messages.read": "Gespreksberichten bekijken",
+  "admin.role.messages.write": "Berichten versturen in gesprekken",
+  "admin.role.messages.writeAsContact": "Berichten versturen als contact",
+  "admin.role.notificationSettings.manage": "Meldingsinstellingen beheren",
+  "admin.role.oidc.manage": "SSO-configuratie beheren",
+  "admin.role.reports.manage": "Rapporten beheren",
+  "admin.role.roleForAllSupportAgents": "Rol voor alle supportagents",
+  "admin.role.roles.manage": "Rollen beheren",
+  "admin.role.setPermissionsForThisRole": "Rechten instellen voor deze rol",
+  "admin.role.sharedViews.manage": "Gedeelde weergaven beheren",
+  "admin.role.sla.manage": "SLA-beleid beheren",
+  "admin.role.status.manage": "Gespreksstatussen beheren",
+  "admin.role.tags.manage": "Tags beheren",
+  "admin.role.teams.manage": "Teams beheren",
+  "admin.role.templates.manage": "Sjablonen beheren",
+  "admin.role.users.manage": "Gebruikers beheren",
+  "admin.role.view.manage": "Gespreksweergaven maken en beheren",
+  "admin.role.webhooks.manage": "Webhooks beheren",
+  "admin.sharedView.help": "Maak gedeelde weergaven die zichtbaar zijn voor alle agents of specifieke teams.",
+  "admin.sla.addBreachAlert": "Overschrijdingswaarschuwing toevoegen",
+  "admin.sla.addWarningAlert": "Waarschuwing toevoegen",
+  "admin.sla.advanceWarning": "Voorafgaande waarschuwing",
+  "admin.sla.afterSpecificDuration": "Na een specifieke duur",
+  "admin.sla.alertConfiguration": "Waarschuwingsconfiguratie",
+  "admin.sla.alertConfiguration.description": "Stel waarschuwingstriggers en -ontvangers in",
+  "admin.sla.alertRecipients": "Waarschuwingsontvangers",
+  "admin.sla.assignedUser": "Toegewezen gebruiker",
+  "admin.sla.atleastOneSLATimeRequired": "Minstens één van Eerste reactietijd, Volgende reactietijd of Oplostijd is vereist.",
+  "admin.sla.breach": "Overschrijding",
+  "admin.sla.description.valid": "Beschrijving van SLA-beleid moet tussen 1 en 255 tekens bevatten",
+  "admin.sla.firstResponseTime": "Eerste reactietijd",
+  "admin.sla.followUpDelay": "Opvolgvertraging",
+  "admin.sla.help.description": "Configureer SLA-beleid om doelen voor reactie-, oplos- en volgende reactietijd in te stellen.",
+  "admin.sla.help.detail": "SLA's helpen de teamprestaties te volgen en zorgen ervoor dat gesprekken binnen de verwachte tijdsbestekken worden afgehandeld. Overschreden SLA's activeren meldingen naar geconfigureerde teamleden.",
+  "admin.sla.immediatelyOnBreach": "Direct bij overschrijding",
+  "admin.sla.name.valid": "Naam van SLA-beleid moet tussen 1 en 255 tekens bevatten",
+  "admin.sla.nextResponseTime": "Volgende reactietijd",
+  "admin.sla.noAlertsConfigured": "Geen waarschuwingen geconfigureerd",
+  "admin.sla.postBreachAlert": "Waarschuwing na overschrijding",
+  "admin.sla.preBreachAlert": "Waarschuwing vóór overschrijding",
+  "admin.sla.resolutionTime": "Oplostijd",
+  "admin.sla.triggerTiming": "Triggertiming",
+  "admin.sla.warning": "Waarschuwing",
+  "admin.sso.logoURLDescription": "Aangepaste logo-URL om weer te geven op de inlogpagina.",
+  "admin.sso.setThisUrlForCallback": "Stel deze URI in voor callback.",
+  "admin.status.help": "Maak aangepaste gespreksstatussen om de standaardworkflow uit te breiden.",
+  "admin.tag.help": "Tags kunnen worden gebruikt om gesprekken te filteren en als voorwaarden in automatiseringen.",
+  "admin.tags.deleteConfirmation": "Weet je zeker dat je deze tag wilt verwijderen? Hiermee wordt deze ook van alle gesprekken verwijderd",
+  "admin.team.assignmentType": "Type automatische toewijzing",
+  "admin.team.assignmentType.description": "Round robin: gesprekken worden volgens een round-robinprincipe aan teamleden toegewezen. Handmatig: gesprekken moeten door teamleden worden opgepakt.",
+  "admin.team.assignmentType.manual": "Handmatig",
+  "admin.team.assignmentType.placeholder": "Selecteer een toewijzingstype",
+  "admin.team.assignmentType.roundRobin": "Round robin",
+  "admin.team.businessHours.description": "Standaardopeningstijden voor het team, worden gebruikt om de SLA te berekenen.",
+  "admin.team.couldNotFetchBusinessHours": "Kon openingstijden niet ophalen",
+  "admin.team.emoji": "Emoji",
+  "admin.team.help.description": "Configureer teaminstellingen, waaronder werktijden en SLA-beleid.",
+  "admin.team.help.detail": "Beheer limieten voor automatische toewijzing van agents en meer.",
+  "admin.team.maxAutoAssigned": "Maximumaantal automatisch toegewezen gesprekken",
+  "admin.team.maxAutoAssigned.description": "Maximaal aantal gesprekken dat automatisch aan een agent kan worden toegewezen. Alleen gesprekken met een status in de categorie \"Open\" tellen mee voor deze limiet. Stel in op 0 voor onbeperkt.",
+  "admin.team.noPermissionBusinessHours": "Je hebt geen rechten om openingstijden te bekijken.",
+  "admin.team.slaPolicy.description": "SLA-beleid dat automatisch op gesprekken wordt toegepast wanneer gesprekken aan dit team worden toegewezen.",
+  "admin.team.slaPolicy.placeholder": "Selecteer beleid",
+  "admin.team.timezone.description": "De tijdzone van het team wordt gebruikt om de SLA te berekenen.",
+  "admin.template.emailNotificationTemplates": "Sjablonen voor e-mailmeldingen",
+  "admin.template.help": "Pas het uiterlijk en de inhoud aan van uitgaande e-mails naar klanten en meldingse-mails naar je team.",
+  "admin.template.makeSureTemplateHasContent": "Zorg dat het sjabloon {content} precies één keer bevat.",
+  "admin.template.onlyOneDefaultOutgoingTemplate": "Je kunt maar één standaardsjabloon voor uitgaande e-mail hebben.",
+  "admin.template.outgoingEmailTemplates": "Sjablonen voor uitgaande e-mail",
+  "admin.webhook.events.description": "Selecteer de gebeurtenissen waarop je je wilt abonneren.",
+  "admin.webhook.help": "Configureer webhooks om realtime meldingen te ontvangen wanneer er gebeurtenissen in je desk plaatsvinden.",
+  "admin.webhook.secret.description": "Optionele geheime sleutel voor verificatie van de webhook-handtekening.",
+  "agent.apiKeyGenerated": "API-sleutel succesvol gegenereerd",
+  "agent.apiKeyRevoked": "API-sleutel succesvol ingetrokken",
+  "agent.edit": "Agent bewerken",
+  "agent.generateApiKey": "API-sleutel genereren",
+  "agent.new": "Nieuwe agent",
+  "agent.selectAvailabilityStatus": "Selecteer beschikbaarheidsstatus",
+  "auth.backToLogin": "Terug naar inloggen",
+  "auth.checkEmailForReset": "Controleer je e-mail voor de link om je wachtwoord opnieuw in te stellen.",
+  "auth.confirmPassword": "Bevestig wachtwoord",
+  "auth.csrfTokenMismatch": "CSRF-token komt niet overeen",
+  "auth.enterEmailForReset": "Voer je e-mailadres in om een link te ontvangen om je wachtwoord opnieuw in te stellen.",
+  "auth.enterNewPasswordTwice": "Voer je nieuwe wachtwoord twee keer in ter bevestiging.",
+  "auth.forgotPassword": "Wachtwoord vergeten?",
+  "auth.hidePassword": "Wachtwoord verbergen",
+  "auth.invalidOrExpiredSession": "Ongeldige of verlopen sessie",
+  "auth.invalidOrExpiredSessionClearCookie": "Ongeldige of verlopen sessie. Wis je cookies en probeer het opnieuw.",
+  "auth.invalidResetLink": "Ongeldige resetlink. Vraag een nieuwe link aan om je wachtwoord opnieuw in te stellen.",
+  "auth.loggingIn": "Bezig met inloggen...",
+  "auth.newPassword": "Nieuw wachtwoord",
+  "auth.orContinueWith": "Of ga verder met",
+  "auth.passwordRequired": "Wachtwoord is verplicht.",
+  "auth.passwordSetSuccess": "Je kunt nu inloggen met je nieuwe wachtwoord.",
+  "auth.passwordsDoNotMatch": "Wachtwoorden komen niet overeen.",
+  "auth.resetPassword": "Wachtwoord opnieuw instellen",
+  "auth.sendResetLink": "Resetlink versturen",
+  "auth.setNewPassword": "Nieuw wachtwoord instellen",
+  "auth.settingPassword": "Wachtwoord instellen...",
+  "auth.showPassword": "Wachtwoord tonen",
+  "auth.signIn": "Log in op je account",
+  "auth.signInButton": "Inloggen",
+  "automation.deletionConfirmation": "Deze actie kan niet ongedaan worden gemaakt. Hiermee wordt deze automatiseringsregel permanent verwijderd.",
+  "automation.editRule": "Regel bewerken",
+  "automation.newRule": "Nieuwe regel",
+  "businessHour.deletionConfirmation": "Deze actie kan niet ongedaan worden gemaakt. Hiermee wordt deze openingstijd permanent verwijderd.",
+  "businessHour.edit": "Openingstijd bewerken",
+  "businessHour.new": "Nieuwe openingstijd",
+  "businessHour.newHoliday": "Nieuwe feestdag",
+  "command.navigate": "Navigeren",
+  "command.noCommandAvailable": "Geen commando beschikbaar",
+  "command.pickSnoozeTime": "Kies een snoozetijd",
+  "command.replyPreview": "Voorbeeld van antwoord",
+  "command.selectAMacro": "Selecteer een macro om details te bekijken",
+  "command.snoozeFor": "Snoozen voor",
+  "command.typeCmdOrSearch": "Typ een commando of zoek...",
+  "confirm.deleteContextLink": "Deze actie kan niet ongedaan worden gemaakt. Hiermee wordt deze contextlink permanent verwijderd.",
+  "confirm.deleteInbox": "Deze actie kan niet ongedaan worden gemaakt. Hiermee wordt deze inbox permanent verwijderd.",
+  "confirm.deleteMacro": "Deze actie kan niet ongedaan worden gemaakt. Hiermee wordt deze macro permanent verwijderd.",
+  "confirm.deleteSharedView": "Deze actie kan niet ongedaan worden gemaakt. Hiermee wordt deze gedeelde weergave permanent verwijderd.",
+  "confirm.deleteSso": "Deze actie kan niet ongedaan worden gemaakt. Hiermee wordt deze SSO permanent verwijderd.",
+  "confirm.deleteTeam": "Deze actie kan niet ongedaan worden gemaakt. Hiermee wordt dit team permanent verwijderd.",
+  "confirm.deleteView": "Deze actie kan niet ongedaan worden gemaakt. Hiermee wordt deze weergave permanent verwijderd.",
+  "confirm.deleteWebhook": "Deze actie kan niet ongedaan worden gemaakt. Hiermee wordt deze webhook permanent verwijderd.",
+  "contact.addNote": "Notitie toevoegen",
+  "contact.allContacts": "Alle contacten",
+  "contact.alreadyExistsWithEmail": "Er bestaat al een ander contact met hetzelfde e-mailadres",
+  "contact.blockConfirm": "Weet je zeker dat je dit contact wilt blokkeren? Ze kunnen niet meer chatten en inkomende e-mails van hun adres worden geweigerd. Dit blokkeert ook inkomende e-mails van andere contacten die hetzelfde e-mailadres gebruiken.",
+  "contact.blockContact": "Contact blokkeren",
+  "contact.blockedSuccessfully": "Contact succesvol geblokkeerd",
+  "contact.deleteNote": "Notitie verwijderen",
+  "contact.editContact": "Contact bewerken",
+  "contact.identityNotVerified": "Identiteit niet geverifieerd",
+  "contact.identityVerified": "Identiteit geverifieerd",
+  "contact.newNote": "Nieuwe notitie",
+  "contact.noContactsFound": "Geen contacten gevonden",
+  "contact.notes.empty": "Nog geen notities",
+  "contact.notes.help": "Voeg een notitie toe voor dit contact om belangrijke informatie en gesprekken bij te houden.",
+  "contact.saveNote": "Notitie opslaan",
+  "contact.searchByEmail": "Zoeken op e-mailadres",
+  "contact.type.contact": "Contact",
+  "contact.type.visitor": "Bezoeker",
+  "contact.unblockConfirm": "Weet je zeker dat je de blokkering van dit contact wilt opheffen? Ze kunnen weer chatten en inkomende e-mails van hun adres worden geaccepteerd.",
+  "contact.unblockContact": "Blokkering opheffen",
+  "contact.unblockedSuccessfully": "Blokkering van contact succesvol opgeheven",
+  "contact.updateContact": "Contact bijwerken",
+  "contextLink.edit": "Contextlink bewerken",
+  "contextLink.namePlaceholder": "Mijn app",
+  "contextLink.new": "Nieuwe contextlink",
+  "contextLink.secret": "Geheim",
+  "contextLink.secretHelp": "Een sleutel van 32 tekens die wordt gedeeld tussen Libredesk en de externe app. Wordt gebruikt om de {'{{token}}'} te versleutelen zodat alleen de externe app de contactgegevens kan lezen. Niet nodig als je alleen gewone variabelen zoals {'{{email}}'} gebruikt.",
+  "contextLink.secretLengthError": "Het geheim moet precies 32 tekens lang zijn.",
+  "contextLink.tokenExpiry": "Tokenvervaltijd (seconden)",
+  "contextLink.tokenExpiryHelp": "De externe app moet tokens weigeren die ouder zijn dan dit. Opgenomen als 'exp' (vervaltijdstempel) in het versleutelde token.",
+  "contextLink.urlTemplate": "URL-sjabloon",
+  "contextLink.urlTemplateHelp": "{'{{token}}'} is een base64-gecodeerde, met AES-256-GCM versleutelde blob die alle contact- en agentvelden bevat (vereist een geheim). Losse variabelen zoals {'{{email}}'}, {'{{phone}}'}, {'{{external_user_id}}'}, {'{{contact_id}}'}, {'{{first_name}}'}, {'{{last_name}}'}, {'{{conversation_uuid}}'} worden als platte tekst doorgegeven.",
+  "conversation.agentAssigned": "Agent toegewezen",
+  "conversation.allLoaded": "Alle gesprekken geladen",
+  "conversation.bulkActions.clearSelection": "Selectie wissen",
+  "conversation.bulkActions.failedToast": "Sommige gesprekken konden niet worden bijgewerkt",
+  "conversation.bulkActions.selectAll": "Alle gesprekken selecteren",
+  "conversation.bulkActions.selectConversation": "Gesprek selecteren",
+  "conversation.bulkActions.selected": "Geen gesprekken geselecteerd | 1 geselecteerd | {count} geselecteerd",
+  "conversation.bulkActions.successToast": "Gesprekken bijgewerkt",
+  "conversation.bulkActions.toolbar": "Werkbalk voor bulkacties",
+  "conversation.couldNotFetch": "Kon gesprekken niet ophalen",
+  "conversation.hideQuotedText": "Geciteerde tekst verbergen",
+  "conversation.mentions": "Vermeldingen",
+  "conversation.myInbox": "Mijn inbox",
+  "conversation.newConversation": "Nieuw gesprek",
+  "conversation.noConversationsFound": "Geen gesprekken gevonden",
+  "conversation.notMemberOfTeam": "Je bent geen lid van dit team. Vernieuw de pagina en probeer het opnieuw",
+  "conversation.placeholder": "Selecteer een gesprek in het linkerpaneel.",
+  "conversation.search": "Gesprekken zoeken",
+  "conversation.searchContact": "Zoek contact op e-mailadres of typ een nieuw e-mailadres",
+  "conversation.sentViaEmail": "Verzonden via e-mail",
+  "conversation.showQuotedText": "Geciteerde tekst tonen",
+  "conversation.sidebar.contactAttributes": "Contactkenmerken",
+  "conversation.sidebar.information": "Informatie",
+  "conversation.sidebar.lastVisitedPages": "Laatst bezochte pagina's",
+  "conversation.sidebar.noPreviousConvo": "Geen eerdere gesprekken",
+  "conversation.sidebar.notAvailable": "Niet beschikbaar",
+  "conversation.sidebar.previousConvo": "Eerdere gesprekken",
+  "conversation.sort.newestActivity": "Nieuwste activiteit",
+  "conversation.sort.nextSLATarget": "Volgend SLA-doel",
+  "conversation.sort.oldestActivity": "Oudste activiteit",
+  "conversation.sort.priorityFirst": "Prioriteit eerst",
+  "conversation.sort.startedFirst": "Eerst gestart",
+  "conversation.sort.startedLast": "Laatst gestart",
+  "conversation.sort.waitingLongest": "Langst wachtend",
+  "conversation.teamAssigned": "Team toegewezen",
+  "conversation.tryAdjustingFilters": "Probeer de filters aan te passen",
+  "conversation.viewPermissionDenied": "Je hebt geen toegang tot deze weergave",
+  "conversationStatus.alreadyInUse": "Kan status niet verwijderen omdat deze in gebruik is. Verwijder deze status van alle gesprekken voordat je deze verwijdert",
+  "conversationStatus.cannotUpdateDefault": "Kan standaardgespreksstatus niet bijwerken",
+  "csat.alreadySubmitted": "CSAT al ingediend",
+  "csat.pageTitle": "Beoordeel je interactie met ons",
+  "csat.pleaseFillRequired": "Geef een beoordeling of feedback.",
+  "csat.rateYourInteraction": "Beoordeel je recente interactie",
+  "csat.thankYouMessage": "We waarderen het dat je de tijd hebt genomen om je feedback te geven.",
+  "customAttribute.deletionConfirmation": "Deze actie kan niet ongedaan worden gemaakt. Hiermee wordt dit aangepaste kenmerk permanent verwijderd.",
+  "customAttribute.edit": "Aangepast kenmerk bewerken",
+  "customAttribute.new": "Nieuw aangepast kenmerk",
+  "dateFilter.lastNDays": "Laatste {n} dag | Laatste {n} dagen",
+  "dateFilter.selectDays": "Selecteer dagen",
+  "editor.addLinkUrl": "Link-URL toevoegen",
+  "editor.editLinkUrl": "Link-URL bewerken",
+  "editor.hint.full": "Shift + Enter voor een nieuwe regel. Ctrl + Enter om te versturen. Ctrl + K om de commandobalk te openen.",
+  "editor.hint.newLineCtrlK": "Shift + Enter voor een nieuwe regel. Ctrl + K om de commandobalk te openen.",
+  "editor.hint.newLineSend": "Shift + Enter voor een nieuwe regel. Ctrl + Enter om te versturen.",
+  "editor.newLine": "Shift + Enter voor een nieuwe regel. ",
+  "errors.alreadyExistsCustomAttribute": "Aangepast kenmerk bestaat al",
+  "errors.alreadyExistsRole": "Rol bestaat al",
+  "errors.alreadyExistsTag": "Tag bestaat al",
+  "errors.alreadyExistsTeam": "Team bestaat al",
+  "errors.canOnlyDeleteOwnNote": "Je kunt alleen je eigen notitie verwijderen",
+  "errors.parsingRequest": "Fout bij het verwerken van het verzoek",
+  "filter.add": "Filter toevoegen",
+  "globals.messages.add": "Toevoegen",
+  "globals.messages.addAnnouncement": "Aankondiging toevoegen",
+  "globals.messages.addEmoji": "Emoji toevoegen",
+  "globals.messages.addExternalLink": "Externe link toevoegen",
+  "globals.messages.additionalFeedback": "Aanvullende feedback (optioneel)",
+  "globals.messages.all": "Alle",
+  "globals.messages.apply": "Toepassen",
+  "globals.messages.areYouAbsolutelySure": "Weet je het absoluut zeker?",
+  "globals.messages.attachFile": "Bestand bijvoegen",
+  "globals.messages.back": "Terug",
+  "globals.messages.backOnDayAt": "op {day} om {time}",
+  "globals.messages.backTodayAt": "vandaag om {time}",
+  "globals.messages.backTomorrowAt": "morgen om {time}",
+  "globals.messages.backgroundColor": "Achtergrondkleur",
+  "globals.messages.backgroundImageUrl": "URL achtergrondafbeelding",
+  "globals.messages.badRequest": "Ongeldig verzoek",
+  "globals.messages.bestFit": "Beste passing",
+  "globals.messages.block": "Blokkeren",
+  "globals.messages.cancel": "Annuleren",
+  "globals.messages.caseSensitiveMatch": "Hoofdlettergevoelige overeenkomst",
+  "globals.messages.close": "Sluiten",
+  "globals.messages.closeChat": "Chat sluiten",
+  "globals.messages.connected": "Verbonden",
+  "globals.messages.connecting": "Verbinden...",
+  "globals.messages.connectionFailedRefresh": "Verbinding mislukt. Vernieuw de pagina.",
+  "globals.messages.continueConversation": "Zet je gesprek voort",
+  "globals.messages.copied": "Gekopieerd naar klembord",
+  "globals.messages.correctEmailErrors": "Corrigeer de e-mailfouten",
+  "globals.messages.coverImageUrl": "URL omslagafbeelding",
+  "globals.messages.create": "Aanmaken",
+  "globals.messages.currentlyOffline": "We zijn momenteel offline",
+  "globals.messages.delete": "Verwijderen",
+  "globals.messages.deleteAll": "Alles verwijderen",
+  "globals.messages.deletedSuccessfully": "Succesvol verwijderd",
+  "globals.messages.disable": "Uitschakelen",
+  "globals.messages.edit": "Bewerken",
+  "globals.messages.empty": "{name} leeg",
+  "globals.messages.enable": "Inschakelen",
+  "globals.messages.errorAlreadyExists": "Bestaat al",
+  "globals.messages.errorSendingMessage": "Fout bij het versturen van het bericht",
+  "globals.messages.errorSendingPasswordResetEmail": "Fout bij het versturen van de wachtwoordreset-e-mail",
+  "globals.messages.errorUpdatingConversation": "Fout bij het bijwerken van het gesprek",
+  "globals.messages.errorUploadingFile": "Fout bij het uploaden van het bestand",
+  "globals.messages.false": "Onwaar",
+  "globals.messages.fileTypeisNotAnImage": "Bestandstype is geen afbeelding",
+  "globals.messages.goBack": "Ga terug",
+  "globals.messages.golangDurationHoursMinutes": "Duur in uren of minuten. Voorbeeld: 1h, 30m, 1h30m",
+  "globals.messages.gradientEnd": "Einde verloop",
+  "globals.messages.gradientStart": "Begin verloop",
+  "globals.messages.headerTextColor": "Tekstkleur koptekst",
+  "globals.messages.hoursSinceCreated": "Uren sinds aangemaakt",
+  "globals.messages.hoursSinceFirstReply": "Uren sinds eerste antwoord",
+  "globals.messages.hoursSinceLastReply": "Uren sinds laatste antwoord",
+  "globals.messages.hoursSinceResolved": "Uren sinds opgelost",
+  "globals.messages.import": "Importeren",
+  "globals.messages.invite": "Uitnodigen",
+  "globals.messages.lastUsed": "Laatst gebruikt",
+  "globals.messages.linkUrl": "Link-URL",
+  "globals.messages.markAllAsRead": "Alles markeren als gelezen",
+  "globals.messages.markAsRead": "Markeren als gelezen",
+  "globals.messages.markAsUnread": "Markeren als ongelezen",
+  "globals.messages.maxLength": "Mag maximaal {max} tekens bevatten",
+  "globals.messages.mustBeNumber": "Moet een getal zijn",
+  "globals.messages.new": "Nieuw",
+  "globals.messages.no": "Nee",
+  "globals.messages.noInternetConnection": "Geen internetverbinding",
+  "globals.messages.noMessagesYet": "Nog geen berichten",
+  "globals.messages.noResultsFound": "Geen resultaten gevonden",
+  "globals.messages.notAllowed": "Niet toegestaan",
+  "globals.messages.notFound": "Niet gevonden",
+  "globals.messages.options": "Opties",
+  "globals.messages.pageNofTotal": "Pagina {page} van {total}",
+  "globals.messages.pageNotFound": "Pagina niet gevonden",
+  "globals.messages.pageTooLarge": "Paginagrootte is te groot, mag maximaal {max} zijn",
+  "globals.messages.pickDateAndTime": "Kies datum en tijd",
+  "globals.messages.pleaseRateConversation": "Beoordeel dit gesprek:",
+  "globals.messages.pleaseSelect": "Selecteer {name} voordat je verzendt",
+  "globals.messages.pressEnterToSelectAValue": "Druk op Enter om een waarde te selecteren",
+  "globals.messages.reassigning": "Opnieuw toewijzen",
+  "globals.messages.regenerate": "Opnieuw genereren",
+  "globals.messages.replying": "Antwoorden",
+  "globals.messages.required": "{name} verplicht",
+  "globals.messages.reset": "Resetten",
+  "globals.messages.revoke": "Intrekken",
+  "globals.messages.save": "Opslaan",
+  "globals.messages.saveChanges": "Wijzigingen opslaan",
+  "globals.messages.savedSuccessfully": "Wijzigingen opgeslagen",
+  "globals.messages.saving": "Opslaan...",
+  "globals.messages.selectAFutureTime": "Selecteer een tijd in de toekomst",
+  "globals.messages.selectTLS": "Selecteer TLS-type",
+  "globals.messages.send": "Verzenden",
+  "globals.messages.sendUsMessage": "Stuur ons een bericht",
+  "globals.messages.sending": "Verzenden...",
+  "globals.messages.setUp": "Instellen",
+  "globals.messages.somethingWentWrong": "Er is iets misgegaan",
+  "globals.messages.startNewConversation": "Nieuw gesprek starten",
+  "globals.messages.startTypingToSearch": "Begin met typen om te zoeken...",
+  "globals.messages.strongPassword": "Het wachtwoord moet tussen {min} en {max} tekens lang zijn en minstens één hoofdletter, één kleine letter, één cijfer en één speciaal teken bevatten.",
+  "globals.messages.submit": "Verzenden",
+  "globals.messages.submitFeedback": "Feedback verzenden",
+  "globals.messages.submitting": "Verzenden...",
+  "globals.messages.thankYou": "Bedankt!",
+  "globals.messages.thankYouFeedback": "✅ Bedankt voor je feedback!",
+  "globals.messages.tooManyRequests": "Te veel verzoeken.",
+  "globals.messages.true": "Waar",
+  "globals.messages.unblock": "Deblokkeren",
+  "globals.messages.update": "Bijwerken",
+  "globals.messages.upload": "Uploaden",
+  "globals.messages.uploading": "Uploaden",
+  "globals.messages.visibleWhen": "Zichtbaar wanneer",
+  "globals.messages.welcomeToLibredesk": "Welkom bij Libredesk",
+  "globals.messages.wellBeBack": "We zijn terug {when}",
+  "globals.messages.yes": "Ja",
+  "globals.terms.account": "Account | Accounts",
+  "globals.terms.action": "Actie | Acties",
+  "globals.terms.active": "Actief",
+  "globals.terms.activityLog": "Activiteitenlogboek | Activiteitenlogboeken",
+  "globals.terms.actor": "Actor | Actoren",
+  "globals.terms.admin": "Beheerder | Beheerders",
+  "globals.terms.agent": "Agent | Agents",
+  "globals.terms.alert": "Waarschuwing | Waarschuwingen",
+  "globals.terms.announcement": "Aankondiging | Aankondigingen",
+  "globals.terms.apiKey": "API-sleutel | API-sleutels",
+  "globals.terms.appliesTo": "Van toepassing op",
+  "globals.terms.ascending": "Oplopend",
+  "globals.terms.audio": "Audio",
+  "globals.terms.automation": "Automatisering | Automatiseringen",
+  "globals.terms.availabilityStatus": "Beschikbaarheidsstatus",
+  "globals.terms.awaitingResponse": "Wacht op reactie",
+  "globals.terms.away": "Afwezig | Afwezig",
+  "globals.terms.awayReassigning": "Afwezig en opnieuw toewijzen",
+  "globals.terms.background": "Achtergrond",
+  "globals.terms.beta": "Bèta",
+  "globals.terms.black": "Zwart",
+  "globals.terms.body": "Inhoud",
+  "globals.terms.brandName": "Merknaam",
+  "globals.terms.businessHour": "Openingstijd | Openingstijden",
+  "globals.terms.callbackURL": "Callback-URL",
+  "globals.terms.category": "Categorie",
+  "globals.terms.channel": "Kanaal",
+  "globals.terms.clientID": "Client-ID",
+  "globals.terms.clientSecret": "Clientgeheim",
+  "globals.terms.closed": "Gesloten",
+  "globals.terms.closedAt": "Gesloten op",
+  "globals.terms.collapse": "Inklappen",
+  "globals.terms.contact": "Contact | Contacten",
+  "globals.terms.content": "Inhoud | Inhoud",
+  "globals.terms.contextLink": "Contextlink | Contextlinks",
+  "globals.terms.continue": "Doorgaan",
+  "globals.terms.conversation": "Gesprek | Gesprekken",
+  "globals.terms.copy": "Kopiëren",
+  "globals.terms.country": "Land",
+  "globals.terms.createdAt": "Aangemaakt op",
+  "globals.terms.createdOn": "Aangemaakt op",
+  "globals.terms.custom": "Aangepast",
+  "globals.terms.customAttribute": "Aangepast kenmerk | Aangepaste kenmerken",
+  "globals.terms.date": "Datum",
+  "globals.terms.day": "Dag | Dagen",
+  "globals.terms.default": "Standaard",
+  "globals.terms.descending": "Aflopend",
+  "globals.terms.description": "Beschrijving | Beschrijvingen",
+  "globals.terms.disabled": "Uitgeschakeld",
+  "globals.terms.download": "Downloaden",
+  "globals.terms.draft": "Concept",
+  "globals.terms.email": "E-mail | E-mails",
+  "globals.terms.enabled": "Ingeschakeld",
+  "globals.terms.error": "Fout | Fouten",
+  "globals.terms.event": "Gebeurtenis | Gebeurtenissen",
+  "globals.terms.excellent": "Uitstekend",
+  "globals.terms.expand": "Uitklappen",
+  "globals.terms.fair": "Redelijk",
+  "globals.terms.features": "Functies",
+  "globals.terms.feedback": "Feedback | Feedback",
+  "globals.terms.file": "Bestand | Bestanden",
+  "globals.terms.filter": "Filter | Filters",
+  "globals.terms.firstName": "Voornaam | Voornamen",
+  "globals.terms.firstReplyAt": "Eerste antwoord op",
+  "globals.terms.fromEmailAddress": "Afzender-e-mailadres | Afzender-e-mailadressen",
+  "globals.terms.general": "Algemeen",
+  "globals.terms.good": "Goed",
+  "globals.terms.google": "Google",
+  "globals.terms.gradient": "Verloop",
+  "globals.terms.great": "Geweldig",
+  "globals.terms.home": "Start",
+  "globals.terms.homeScreen": "Startscherm",
+  "globals.terms.homeScreenApp": "Startscherm-app | Startscherm-apps",
+  "globals.terms.host": "Host | Hosts",
+  "globals.terms.hour": "Uur | Uren",
+  "globals.terms.image": "Afbeelding | Afbeeldingen",
+  "globals.terms.import": "Import | Imports",
+  "globals.terms.inactive": "Inactief | Inactief",
+  "globals.terms.inbox": "Inbox | Inboxen",
+  "globals.terms.initiatedAt": "Gestart op",
+  "globals.terms.integration": "Integratie | Integraties",
+  "globals.terms.ipAddress": "IP-adres | IP-adressen",
+  "globals.terms.isDefault": "Is standaard",
+  "globals.terms.key": "Sleutel | Sleutels",
+  "globals.terms.label": "Label | Labels",
+  "globals.terms.language": "Taal | Talen",
+  "globals.terms.lastActive": "Laatst actief",
+  "globals.terms.lastLogin": "Laatste aanmelding",
+  "globals.terms.lastMessageAt": "Laatste bericht op",
+  "globals.terms.lastName": "Achternaam | Achternamen",
+  "globals.terms.lastReplyAt": "Laatste antwoord op",
+  "globals.terms.lastUpdated": "Laatst bijgewerkt",
+  "globals.terms.learnMore": "Meer informatie",
+  "globals.terms.listValues": "Lijstwaarden",
+  "globals.terms.liveChat": "Live chat",
+  "globals.terms.loadMore": "Meer laden",
+  "globals.terms.loading": "Laden...",
+  "globals.terms.log": "Logboek | Logboeken",
+  "globals.terms.logoUrl": "Logo-URL",
+  "globals.terms.macro": "Macro | Macro's",
+  "globals.terms.mention": "Vermelding | Vermeldingen",
+  "globals.terms.message": "Bericht | Berichten",
+  "globals.terms.microsoft": "Microsoft",
+  "globals.terms.myInbox": "Mijn inbox | Mijn inboxen",
+  "globals.terms.name": "Naam | Namen",
+  "globals.terms.none": "Geen",
+  "globals.terms.note": "Notitie | Notities",
+  "globals.terms.notification": "Melding | Meldingen",
+  "globals.terms.off": "UIT",
+  "globals.terms.offline": "Offline | Offline",
+  "globals.terms.online": "Online | Online",
+  "globals.terms.open": "Open",
+  "globals.terms.openMenu": "Menu openen",
+  "globals.terms.optional": "Optioneel | Optioneel",
+  "globals.terms.original": "Origineel",
+  "globals.terms.overdue": "Te laat",
+  "globals.terms.overview": "Overzicht",
+  "globals.terms.page": "Pagina | Pagina's",
+  "globals.terms.participant": "Deelnemer | Deelnemers",
+  "globals.terms.password": "Wachtwoord | Wachtwoorden",
+  "globals.terms.pending": "In behandeling",
+  "globals.terms.phoneNumber": "Telefoonnummer | Telefoonnummers",
+  "globals.terms.pickDate": "Kies een datum",
+  "globals.terms.placeholder": "Tijdelijke aanduiding | Tijdelijke aanduidingen",
+  "globals.terms.poor": "Slecht",
+  "globals.terms.port": "Poort | Poorten",
+  "globals.terms.primaryColor": "Primaire kleur | Primaire kleuren",
+  "globals.terms.priority": "Prioriteit | Prioriteiten",
+  "globals.terms.privateNote": "Privénotitie | Privénotities",
+  "globals.terms.productivity": "Productiviteit",
+  "globals.terms.profile": "Profiel | Profielen",
+  "globals.terms.provider": "Provider | Providers",
+  "globals.terms.providerURL": "Provider-URL",
+  "globals.terms.reconnect": "Opnieuw verbinden",
+  "globals.terms.referenceNumber": "Referentienummer",
+  "globals.terms.regex": "Regex | Regexes",
+  "globals.terms.regexHint": "Regex-hint",
+  "globals.terms.remove": "Verwijderen",
+  "globals.terms.reply": "Antwoord | Antwoorden",
+  "globals.terms.report": "Rapport | Rapporten",
+  "globals.terms.required": "Verplicht",
+  "globals.terms.resolve": "Oplossen",
+  "globals.terms.resolved": "Opgelost",
+  "globals.terms.resolvedAt": "Opgelost op",
+  "globals.terms.role": "Rol | Rollen",
+  "globals.terms.rootURL": "Hoofd-URL",
+  "globals.terms.search": "Zoeken",
+  "globals.terms.secondaryColor": "Secundaire kleur | Secundaire kleuren",
+  "globals.terms.secret": "Geheim | Geheimen",
+  "globals.terms.security": "Beveiliging",
+  "globals.terms.select": "Selecteren",
+  "globals.terms.sendWelcomeEmail": "Welkomstmail versturen? | Welkomstmails versturen?",
+  "globals.terms.setPassword": "Wachtwoord instellen | Wachtwoorden instellen",
+  "globals.terms.sharedView": "Gedeelde weergave | Gedeelde weergaven",
+  "globals.terms.sla": "SLA | SLA's",
+  "globals.terms.slaMetric": "SLA-metriek | SLA-metrieken",
+  "globals.terms.slaPolicy": "SLA-beleid | SLA-beleidsregels",
+  "globals.terms.small": "Klein",
+  "globals.terms.smtpHost": "SMTP-host | SMTP-hosts",
+  "globals.terms.smtpPort": "SMTP-poort | SMTP-poorten",
+  "globals.terms.snooze": "Snoozen",
+  "globals.terms.snoozed": "Gesnoozed",
+  "globals.terms.solid": "Effen",
+  "globals.terms.someone": "Iemand",
+  "globals.terms.sso": "SSO | SSO's",
+  "globals.terms.status": "Status | Statussen",
+  "globals.terms.subject": "Onderwerp | Onderwerpen",
+  "globals.terms.tag": "Tag | Tags",
+  "globals.terms.team": "Team | Teams",
+  "globals.terms.teamInbox": "Teaminbox | Teaminboxen",
+  "globals.terms.teammate": "Teamgenoot | Teamgenoten",
+  "globals.terms.tellUsMore": "Vertel ons meer...",
+  "globals.terms.template": "Sjabloon | Sjablonen",
+  "globals.terms.tenantID": "Tenant-ID",
+  "globals.terms.time": "Tijd",
+  "globals.terms.timestamp": "Tijdstempel | Tijdstempels",
+  "globals.terms.timezone": "Tijdzone | Tijdzones",
+  "globals.terms.title": "Titel | Titels",
+  "globals.terms.tls": "TLS | TLS",
+  "globals.terms.today": "Vandaag",
+  "globals.terms.tryAgain": "Opnieuw proberen",
+  "globals.terms.type": "Type | Types",
+  "globals.terms.typeMessage": "Typ je bericht...",
+  "globals.terms.typing": "Aan het typen...",
+  "globals.terms.unAuthorized": "Niet geautoriseerd",
+  "globals.terms.unassigned": "Niet toegewezen",
+  "globals.terms.updatedAt": "Bijgewerkt op",
+  "globals.terms.url": "URL | URL's",
+  "globals.terms.usage": "Gebruik",
+  "globals.terms.username": "Gebruikersnaam | Gebruikersnamen",
+  "globals.terms.users": "Gebruikers",
+  "globals.terms.value": "Waarde | Waarden",
+  "globals.terms.video": "Video | Video's",
+  "globals.terms.view": "Weergave | Weergaven",
+  "globals.terms.visibility": "Zichtbaarheid | Zichtbaarheden",
+  "globals.terms.visitor": "Bezoeker | Bezoekers",
+  "globals.terms.waiting": "Wachtend",
+  "globals.terms.warning": "Waarschuwing | Waarschuwingen",
+  "globals.terms.webhook": "Webhook | Webhooks",
+  "globals.terms.week": "Week | Weken",
+  "globals.terms.white": "Wit",
+  "globals.terms.workspace": "Werkruimte",
+  "globals.terms.you": "Jij",
+  "imageLightbox.next": "Volgende afbeelding",
+  "imageLightbox.previous": "Vorige afbeelding",
+  "imageLightbox.resetZoom": "Zoom resetten",
+  "imageLightbox.zoomIn": "Inzoomen",
+  "imageLightbox.zoomOut": "Uitzoomen",
+  "importer.agentCaseSensitiveNote": "Rollen en teams moeten exact overeenkomen (hoofdlettergevoelig)",
+  "importer.createdAgent": "Rij {row}: Agent {name} ({email}) aangemaakt",
+  "importer.createdTag": "Rij {row}: Tag \"{name}\" aangemaakt",
+  "importer.csvMustContainHeadersAndData": "CSV moet kopteksten en minstens één gegevensrij bevatten",
+  "importer.emailExists": "Rij {row} ({email}): Fout - e-mailadres bestaat al",
+  "importer.errorAssigningTeams": "Rij {row} ({email}): Fout - teamtoewijzing mislukt: {error}",
+  "importer.errorCreating": "Rij {row} ({email}): Fout - kon agent niet aanmaken: {error}",
+  "importer.errorCreatingTag": "Rij {row} ({name}): Fout - kon tag niet aanmaken: {error}",
+  "importer.importAlreadyInProgress": "Import is al bezig",
+  "importer.importComplete": "Import voltooid: {success} van {total} succesvol, {errors} mislukt",
+  "importer.invalidEmail": "Rij {row}: Fout - ongeldig e-mailformaat: {email}",
+  "importer.invalidRoles": "Rij {row} ({email}): Fout - ongeldige rol(len): {roles}",
+  "importer.invalidTeams": "Rij {row} ({email}): Fout - ongeldig(e) team(s): {teams}",
+  "importer.missingFields": "Rij {row}: Fout - ontbrekende verplichte velden: {fields}",
+  "importer.requiredCSVFormat": "Vereist CSV-formaat",
+  "importer.roleRequired": "Rij {row} ({email}): Fout - minstens één rol vereist",
+  "importer.startingImport": "Import van {count} {type} wordt gestart",
+  "importer.tagExists": "Rij {row}: Fout - tag bestaat al: \"{name}\"",
+  "inbox.edit": "Inbox bewerken",
+  "inbox.emptyIMAP": "Lege IMAP-configuratie",
+  "inbox.emptySMTP": "Lege SMTP-configuratie",
+  "inbox.newInbox": "Nieuwe inbox",
+  "inbox.oauthAlreadyExists": "Er bestaat al een inbox met dit e-mailadres. Gebruik Opnieuw verbinden om de inloggegevens bij te werken.",
+  "inbox.oauthEmailMismatch": "Het geautoriseerde e-mailadres komt niet overeen met deze inbox. Autoriseer met het juiste account.",
+  "inbox.oauthNotFound": "Geen inbox gevonden met dit e-mailadres om opnieuw te verbinden.",
+  "macro.actionNotAllowed": "Actie {name} niet toegestaan",
+  "macro.actionType": "Actietype",
+  "macro.applied": "Macro toegepast",
+  "macro.couldNotApply": "Kon macro niet toepassen",
+  "macro.duplicateActionsNotAllowed": "Dubbele acties zijn niet toegestaan",
+  "macro.editMacro": "Macro bewerken",
+  "macro.new": "Nieuwe macro",
+  "macro.partiallyApplied": "Macro gedeeltelijk toegepast",
+  "macro.permissionDenied": "Geen rechten voor sommige macroacties",
+  "media.fileEmpty": "Dit bestand is 0 bytes, dus het wordt niet bijgevoegd.",
+  "media.fileSizeTooLarge": "Bestand te groot, upload een bestand kleiner dan {size}",
+  "media.fileTypeNotAllowed": "Bestandstype niet toegestaan",
+  "media.invalidOrExpiredURL": "Ongeldige of verlopen media-URL",
+  "navigation.away": "Afwezig",
+  "navigation.darkMode": "Donkere modus",
+  "navigation.logout": "Uitloggen",
+  "navigation.reassignReplies": "Antwoorden opnieuw toewijzen",
+  "notification.conversationAssigned": "Gesprek aan jou toegewezen #{referenceNumber}",
+  "notification.mentionedInConversation": "{author} heeft je vermeld in #{referenceNumber}",
+  "notification.slaAlert": "SLA {type}: {metric} voor #{referenceNumber}",
+  "notification.slaDueIn": "Verloopt over {duration}",
+  "notification.slaOverdue": "{duration} te laat",
+  "oidc.edit": "SSO bewerken",
+  "oidc.new": "Nieuwe SSO",
+  "placeholders.chatIntroduction": "Stel ons een vraag of deel je feedback.",
+  "placeholders.enterUrl": "Voer URL in",
+  "placeholders.fieldLabel": "Veldlabel",
+  "placeholders.fieldPlaceholder": "Tijdelijke aanduiding voor veld",
+  "placeholders.greetingMessage": "Welkom! Hoe kunnen we je vandaag helpen?",
+  "placeholders.introductionMessage": "We helpen je graag!",
+  "placeholders.linkText": "Linktekst",
+  "placeholders.noticeBannerText": "Onze reactietijden zijn langzamer dan normaal. We doen ons best om je bericht zo snel mogelijk te beantwoorden.",
+  "placeholders.selectAction": "Selecteer actie",
+  "placeholders.selectAgent": "Selecteer agent",
+  "placeholders.selectCsvFile": "Selecteer CSV-bestand",
+  "placeholders.selectEvents": "Selecteer gebeurtenissen",
+  "placeholders.selectField": "Selecteer veld",
+  "placeholders.selectInbox": "Selecteer inbox",
+  "placeholders.selectOperator": "Selecteer operator",
+  "placeholders.selectPosition": "Selecteer positie",
+  "placeholders.selectPriority": "Selecteer prioriteit",
+  "placeholders.selectProtocol": "Selecteer protocol",
+  "placeholders.selectProvider": "Selecteer provider",
+  "placeholders.selectTags": "Selecteer tags",
+  "placeholders.selectTeam": "Selecteer team",
+  "placeholders.selectTeams": "Selecteer teams",
+  "placeholders.selectType": "Selecteer type",
+  "placeholders.selectValue": "Selecteer waarde",
+  "placeholders.startConversation": "Gesprek starten",
+  "placeholders.tellUsAboutYourself": "Vertel ons iets over jezelf",
+  "replyBox.bcc": "BCC",
+  "replyBox.contactEmailMissing": "Contact-e-mail niet bij ontvangers",
+  "replyBox.contactEmailMissingDescription": "Het e-mailadres van het contact ({email}) staat niet in to, cc of bcc. Het contact ontvangt dit antwoord niet.",
+  "replyBox.emailAddresess": "E-mailadressen gescheiden door komma's",
+  "replyBox.invalidEmailsIn": "Ongeldig(e) e-mailadres(sen) in",
+  "replyBox.missingTagsDescription": "Dit gesprek heeft geen tags. Taggen helpt bij rapportage en triage. Je kunt nog steeds versturen zonder te taggen.",
+  "replyBox.missingTagsTitle": "Geen tags op dit gesprek",
+  "replyBox.removeBCC": "BCC verwijderen",
+  "replyBox.sendAnyway": "Toch versturen",
+  "replyBox.toRequired": "Er is minstens één ontvanger vereist in het Aan-veld.",
+  "report.chart.newConversations": "Nieuwe gesprekken",
+  "report.chart.resolvedConversations": "Opgeloste gesprekken",
+  "report.csat.avgRating": "Gem. beoordeling",
+  "report.csat.responseRate": "Reactiepercentage",
+  "report.csat.responses": "Reacties",
+  "report.messages.incoming": "Inkomend",
+  "report.messages.outgoing": "Uitgaand",
+  "report.messages.perConversation": "Per gesprek",
+  "report.messages.total": "Totaal",
+  "report.noTagsFound": "Geen tags gevonden",
+  "report.sla.avgFirstResp": "Gem. eerste reactietijd",
+  "report.sla.avgNextResp": "Gem. volgende reactietijd",
+  "report.sla.avgResolution": "Gem. oplostijd",
+  "report.sla.breached": "Overschreden",
+  "report.sla.compliance": "Naleving",
+  "report.sla.firstResponse": "Eerste reactie",
+  "report.sla.met": "Gehaald",
+  "report.sla.nextResponse": "Volgende reactie",
+  "report.sla.resolution": "Oplossing",
+  "report.tags.tagged": "Getagd",
+  "report.tags.topTags": "Toptags",
+  "role.deletionConfirmation": "Deze actie kan niet ongedaan worden gemaakt. Hiermee wordt deze rol permanent verwijderd.",
+  "role.edit": "Rol bewerken",
+  "role.new": "Nieuwe rol",
+  "role.select": "Selecteer rollen",
+  "search.adjustSearchTerms": "Probeer je zoektermen of filters aan te passen.",
+  "search.minQueryLength": " Voer minstens {length} tekens in om te zoeken.",
+  "search.noResultsForQuery": "Geen resultaten gevonden voor zoekopdracht `{query}`. Probeer een andere zoekterm.",
+  "search.searchBy": "Zoek op referentienummer, e-mailadres van contact of berichten in gesprekken.",
+  "setup.completeYourSetup": "Voltooi je installatie",
+  "setup.createFirstInbox": "Maak je eerste inbox",
+  "setup.inviteTeammates": "Teamgenoten uitnodigen",
+  "sharedView.allAgents": "Alle agents",
+  "sharedView.editSharedView": "Gedeelde weergave bewerken",
+  "sharedView.new": "Nieuwe gedeelde weergave",
+  "sla.deletionConfirmation": "Deze actie kan niet ongedaan worden gemaakt. Hiermee wordt dit SLA-beleid permanent verwijderd.",
+  "sla.edit": "SLA-beleid bewerken",
+  "sla.enterDuration": "Voer duur in",
+  "sla.firstResponseTimeAfterResolution": "Eerste reactietijd mag niet na de oplostijd liggen",
+  "sla.met": "SLA gehaald",
+  "sla.minimumDurationOneMinute": "Duur moet minstens 1 minuut zijn.",
+  "sla.new": "Nieuw SLA-beleid",
+  "sla.overdueBy": "Te laat met",
+  "sla.selectMetric": "Selecteer SLA-metriek",
+  "status.deletionConfirmation": "Deze actie kan niet ongedaan worden gemaakt. Hiermee wordt deze status permanent verwijderd.",
+  "status.deniedPermission": "Toegang geweigerd",
+  "status.disabledFileUpload": "Bestandsupload is uitgeschakeld",
+  "status.disabledInbox": "Inbox is uitgeschakeld",
+  "status.edit": "Status bewerken",
+  "status.new": "Nieuwe status",
+  "tag.edit": "Tag bewerken",
+  "tag.new": "Nieuwe tag",
+  "team.edit": "Team bewerken",
+  "team.new": "Nieuw team",
+  "template.cannotDeleteBuiltInTemplate": "Kan ingebouwd sjabloon niet verwijderen",
+  "template.defaultTemplateAlreadyExists": "Standaardsjabloon bestaat al",
+  "template.deletionConfirmation": "Deze actie kan niet ongedaan worden gemaakt. Hiermee wordt dit sjabloon permanent verwijderd.",
+  "template.edit": "Sjabloon bewerken",
+  "template.new": "Nieuw sjabloon",
+  "toast.apiKeyGenerated": "API-sleutel gegenereerd",
+  "toast.authorizationDenied": "Autorisatie geweigerd",
+  "toast.avatarUpdated": "Avatar succesvol bijgewerkt",
+  "toast.errorConnectingInbox": "Fout bij het verbinden van de inbox",
+  "toast.inboxConnected": "Inbox succesvol verbonden",
+  "toast.inboxReconnected": "Inbox succesvol opnieuw verbonden",
+  "toast.noNotificationsFound": "Geen meldingen gevonden",
+  "update.newUpdateAvailable": "Er is een nieuwe update beschikbaar",
+  "user.accountDisabled": "Je account is uitgeschakeld. Neem contact op met de beheerder",
+  "user.cannotDeleteSystemUser": "Kan systeemgebruiker niet verwijderen",
+  "user.invalidEmailPassword": "Ongeldig e-mailadres of wachtwoord.",
+  "user.resetPasswordTokenExpired": "Token is ongeldig of verlopen. Probeer het opnieuw door een nieuwe wachtwoordreset-link aan te vragen",
+  "user.sameEmailAlreadyExists": "Er bestaat al een gebruiker met hetzelfde e-mailadres",
+  "user.userAlreadyLoggedIn": "Gebruiker is al ingelogd",
+  "user.userCannotDeleteSelf": "Je kunt jezelf niet verwijderen",
+  "validation.invalid": "Ongeldig",
+  "validation.invalidColor": "Ongeldige kleur",
+  "validation.invalidCredential": "Ongeldige inloggegevens",
+  "validation.invalidCsvFile": "Ongeldig CSV-bestand",
+  "validation.invalidDomain": "Ongeldig domein: {domain}. Voer alleen domeinnamen in (bijv. example.com), zonder protocol of paden.",
+  "validation.invalidDuration": "Ongeldig duurformaat. Gebruik een geldig formaat (bijv. 30m, 1h, 48h).",
+  "validation.invalidEmail": "Ongeldig e-mailadres",
+  "validation.invalidFromAddress": "Ongeldig formaat van afzender-e-mailadres. Zorg dat het een geldig e-mailadres is in het formaat `Naam <mail@example.com>`",
+  "validation.invalidIPOrCIDR": "Ongeldig IP-adres of CIDR-bereik: {entry}",
+  "validation.invalidInbox": "Ongeldige inbox",
+  "validation.invalidKey": "Ongeldige sleutel",
+  "validation.invalidPermission": "Ongeldig recht",
+  "validation.invalidPortValue": "Ongeldige poortwaarde",
+  "validation.invalidSnoozeDuration": "Ongeldige snoozeduur",
+  "validation.invalidTimeFormat": "Ongeldig tijdformaat (HH:mm)",
+  "validation.invalidUrl": "Ongeldige URL",
+  "validation.invalidUser": "Ongeldige gebruiker",
+  "validation.invalidValue": "Ongeldige waarde",
+  "validation.messageCannotBeEmpty": "Bericht mag niet leeg zijn",
+  "validation.minDuration": "{name} moet minstens {min} zijn.",
+  "validation.minmax": "Moet tussen {min} en {max} tekens bevatten",
+  "validation.minmaxNumber": "Moet tussen {min} en {max} liggen",
+  "validation.notFoundConversation": "Gesprek niet gevonden",
+  "validation.notFoundCsatSurvey": "CSAT-enquête niet gevonden",
+  "validation.notFoundCustomAttribute": "Aangepast kenmerk niet gevonden",
+  "validation.notFoundFile": "Bestand niet gevonden",
+  "validation.notFoundImport": "Import niet gevonden",
+  "validation.notFoundInbox": "Inbox niet gevonden",
+  "validation.notFoundMacro": "Macro niet gevonden",
+  "validation.notFoundMedia": "Media niet gevonden",
+  "validation.notFoundOidcProvider": "OIDC-provider niet gevonden",
+  "validation.notFoundProvider": "Provider niet gevonden",
+  "validation.notFoundRole": "Rol niet gevonden",
+  "validation.notFoundRule": "Regel niet gevonden",
+  "validation.notFoundSla": "SLA niet gevonden",
+  "validation.notFoundTeam": "Team niet gevonden",
+  "validation.notFoundTemplate": "Sjabloon niet gevonden",
+  "validation.notFoundUser": "Gebruiker niet gevonden",
+  "validation.notFoundView": "Weergave niet gevonden",
+  "validation.passwordCannotBeEmpty": "Wachtwoord mag niet leeg zijn",
+  "validation.selectAtLeastOneEvent": "Selecteer minstens één gebeurtenis",
+  "validation.selectAtLeastOneRecipient": "Selecteer minstens één ontvanger",
+  "validation.selectAtLeastOneRole": "Selecteer minstens één rol",
+  "validation.subjectCannotBeEmpty": "Onderwerp mag niet leeg zijn",
+  "validation.tooLongStatus": "Status is te lang, mag maximaal {max} tekens bevatten",
+  "view.form.description": "Maak en bewaar aangepaste filterweergaven voor snelle toegang tot je gesprekken.",
+  "view.form.filter.selectAtLeastOne": "Selecteer minstens één filter.",
+  "view.form.filters.description": "Stel een of meer filters in om de weergave aan te passen.",
+  "view.form.name.description": "Voer een unieke naam in voor je weergave.",
+  "webhook.edit": "Webhook bewerken",
+  "webhook.new": "Nieuwe webhook",
+  "webhook.sendTest": "Test versturen",
+  "webhook.sentSuccessfully": "Webhook succesvol verstuurd",
+  "widget.conversationClosed": "Dit gesprek is gesloten",
+  "widget.ipBlocked": "Toegang geweigerd",
+  "widget.prechatForm.startChat": "Chat starten"
+}
diff --git a/i18n/pt-BR.json b/i18n/pt-BR.json
index 3c2398e7..8e97e90b 100644
--- a/i18n/pt-BR.json
+++ b/i18n/pt-BR.json
@@ -3,11 +3,9 @@
   "_.name": "Português (Brasil)",
   "account.avatarRemoved": "Avatar removido",
   "account.changeAvatar": "Mude seu avatar aqui.",
-  "account.chooseAFile": "Escolha um arquivo...",
   "account.cropAvatar": "Cortar avatar",
   "account.editProfile": "Editar perfil",
   "account.publicAvatar": "Avatar público",
-  "account.removeAvatar": "Remover avatar",
   "actions.addAction": "Adicionar ação",
   "actions.addCondition": "Adicionar condição",
   "actions.addTags": "Adicionar etiquetas",
@@ -82,7 +80,6 @@
   "admin.conversationStatus.category.placeholder": "Selecione categoria",
   "admin.conversationStatus.name.description": "Defina o nome do status. Clique em salvar quando terminar.",
   "admin.conversationTags.edit.description": "Altere o nome da etiqueta. Clique em salvar quando terminar.",
-  "admin.conversationTags.name.valid": "O nome da etiqueta deve ter pelo menos 3 caracteres",
   "admin.conversationTags.new.description": "Defina o nome da etiqueta. Clique em salvar quando terminar.",
   "admin.customAttribute.help": "Atributos personalizados ajudam você a definir detalhes adicionais sobre seus contatos ou conversas, como o plano de assinatura ou a data de sua primeira compra.",
   "admin.customAttributes.keyNotAllowed": "A chave fornecida não é permitida, pois está em conflito com os atributos padrão. Use uma chave diferente.",
@@ -194,7 +191,6 @@
   "admin.inbox.livechat.noticeBanner.enabled": "Habilitar painel de aviso",
   "admin.inbox.livechat.noticeBanner.text": "Texto do painel de aviso",
   "admin.inbox.livechat.officeHours": "Horário de funcionamento",
-  "admin.inbox.livechat.prechatForm.addField": "Adicionar campo",
   "admin.inbox.livechat.prechatForm.availableFields": "Atributos personalizados disponíveis",
   "admin.inbox.livechat.prechatForm.enabled": "Habilitar formulário pré-chat",
   "admin.inbox.livechat.prechatForm.enabled.description": "Mostrar um formulário para coletar informações antes do chat começar",
@@ -374,9 +370,6 @@
   "agent.generateApiKey": "Gerar chave de API",
   "agent.new": "Novo agente",
   "agent.selectAvailabilityStatus": "Selecione status de disponibilidade",
-  "ai.apiKey.description": "A chave de API {provider} não está definida ou é inválida. Digite uma chave de API válida para usar recursos de IA.",
-  "ai.apiKeyNotSet": "A chave de API {provider} não está definida. Peça ao seu administrador para configurá-la",
-  "ai.enterOpenAIAPIKey": "Digite a chave de API do OpenAI",
   "auth.backToLogin": "Voltar ao login",
   "auth.checkEmailForReset": "Verifique seu email para o link de redefinição de senha.",
   "auth.confirmPassword": "Confirmar senha",
@@ -595,8 +588,6 @@
   "globals.messages.sendUsMessage": "Envie-nos uma mensagem",
   "globals.messages.sending": "Enviando...",
   "globals.messages.setUp": "Configurar",
-  "globals.messages.smallScreenDescription": "Libredesk foi projetado para telas maiores. Para a melhor experiência, use um computador desktop ou tablet.",
-  "globals.messages.smallScreenTitle": "Mude para desktop para a melhor experiência",
   "globals.messages.somethingWentWrong": "Algo deu errado",
   "globals.messages.startNewConversation": "Iniciar nova conversa",
   "globals.messages.startTypingToSearch": "Comece a digitar para pesquisar...",
@@ -874,31 +865,24 @@
   "replyBox.removeBCC": "Remover CCO",
   "replyBox.sendAnyway": "Enviar mesmo assim",
   "replyBox.toRequired": "Pelo menos um destinatário é obrigatório no campo \"Para\".",
-  "report.agentStatus": "Status do Operador",
   "report.chart.newConversations": "Nova conversa",
   "report.chart.resolvedConversations": "Conversas resolvidas",
-  "report.chart.title": "Tendências de conversa",
   "report.csat.avgRating": "Avaliação Média",
-  "report.csat.cardTitle": "Satisfação do cliente (últimos {days} dias)",
   "report.csat.responseRate": "Taxa de resposta",
   "report.csat.responses": "Respostas",
-  "report.messages.cardTitle": "Volume de mensagens (últimos {days} dias)",
   "report.messages.incoming": "Entrada",
   "report.messages.outgoing": "Saída",
   "report.messages.perConversation": "Por Conversa",
   "report.noTagsFound": "Nenhuma etiqueta encontrada",
-  "report.openConversations": "Conversas abertas",
   "report.sla.avgFirstResp": "Tempo médio de primeira resposta",
   "report.sla.avgNextResp": "Tempo médio de próxima resposta",
   "report.sla.avgResolution": "Tempo médio de resolução",
   "report.sla.breached": "Violado",
-  "report.sla.cardTitle": "Desempenho de SLA (últimos {days} dias)",
   "report.sla.compliance": "Conformidade",
   "report.sla.firstResponse": "Primeira resposta",
   "report.sla.met": "Cumprido",
   "report.sla.nextResponse": "Próxima resposta",
   "report.sla.resolution": "Resolução",
-  "report.tags.cardTitle": "Distribuição de etiquetas (últimos {days} dias)",
   "report.tags.tagged": "Etiquetas principais",
   "role.deletionConfirmation": "Esta ação não pode ser desfeita. Isso excluirá permanentemente este papel.",
   "role.edit": "Editar papel",
@@ -966,7 +950,6 @@
   "validation.invalidKey": "Chave inválida",
   "validation.invalidPermission": "Permissão inválida",
   "validation.invalidPortValue": "Valor de porta inválido",
-  "validation.invalidProvider": "Provedor inválido",
   "validation.invalidSnoozeDuration": "Duração de pausa inválida",
   "validation.invalidTimeFormat": "Formato de hora inválido (HH:mm)",
   "validation.invalidUrl": "URL inválida",
@@ -1000,11 +983,9 @@
   "validation.subjectCannotBeEmpty": "O assunto não pode estar vazio",
   "validation.tooLongStatus": "Status é muito longo, deve ter no máximo {max} caracteres",
   "view.form.description": "Crie e salve visualizações de filtro personalizado para acesso rápido a suas conversas.",
-  "view.form.filter.partiallyFilled": "Certifique-se de que preencheu corretamente os campos de filtro.",
   "view.form.filter.selectAtLeastOne": "Selecione pelo menos um filtro.",
   "view.form.filters.description": "Defina um ou mais filtros para personalizar a visualização.",
   "view.form.name.description": "Digite um nome único para sua visualização.",
-  "view.form.name.length": "O nome da visualização deve ter entre 2 e 30 caracteres.",
   "webhook.edit": "Editar webhook",
   "webhook.new": "Novo webhook",
   "webhook.sendTest": "Enviar teste",
diff --git a/i18n/pt-PT.json b/i18n/pt-PT.json
new file mode 100644
index 00000000..7e1ff408
--- /dev/null
+++ b/i18n/pt-PT.json
@@ -0,0 +1,1013 @@
+{
+  "_.code": "pt-PT",
+  "_.name": "Português",
+  "account.avatarRemoved": "Avatar removido",
+  "account.changeAvatar": "Mude seu avatar aqui.",
+  "account.cropAvatar": "Cortar avatar",
+  "account.editProfile": "Editar perfil",
+  "account.publicAvatar": "Avatar público",
+  "actions.addAction": "Adicionar ação",
+  "actions.addCondition": "Adicionar condição",
+  "actions.addTags": "Adicionar etiquetas",
+  "actions.addingPrivateNotes": "Adicionar notas privadas",
+  "actions.addPrivateNote": "Adicionar uma observação privada",
+  "actions.applyMacro": "Aplicar macro",
+  "actions.assignAgent": "Atribuir agente",
+  "actions.assignTeam": "Atribuir equipe",
+  "actions.noActions": "Nenhuma ação",
+  "actions.removeLink": "Remover link",
+  "actions.removeTags": "Remover etiquetas",
+  "actions.sendCsat": "Enviar CSAT",
+  "actions.sendReply": "Enviar resposta",
+  "actions.setPriority": "Definir prioridade",
+  "actions.setSla": "Definir SLA",
+  "actions.setStatus": "Definir status",
+  "actions.setTags": "Definir etiquetas",
+  "actions.setValue": "Definir valor",
+  "actions.startingConversation": "Iniciando conversa",
+  "activityLog.agentAway": "{actorEmail} ({actorId}) mudou o status {targetEmail} ({targetId}) para ausente",
+  "activityLog.agentAwayReassign": "{actorEmail} ({actorId}) alterou o status de {targetEmail} ({targetId}) para fora e reatribuindo",
+  "activityLog.agentAwayReassignSelf": "{actorEmail} ({actorId}) está fora e reatribuindo",
+  "activityLog.agentAwaySelf": "{actorEmail} ({actorId}) está fora",
+  "activityLog.agentLogin": "{email} ({userId}) entrou",
+  "activityLog.agentLogout": "{email} ({userId}) desconectou",
+  "activityLog.agentOnline": "{actorEmail} ({actorId}) mudou o status de {targetEmail} ({targetId}) para conectado",
+  "activityLog.agentOnlineSelf": "{actorEmail} ({actorId}) está conectado",
+  "activityLog.agentPasswordSet": "{actorEmail} ({actorId}) definiu a senha de {targetEmail} ({targetId})",
+  "activityLog.entryType": "Tipo de entrada no registo",
+  "activityLog.entryType.agentAway": "Agente ausente",
+  "activityLog.entryType.agentAwayReassigned": "Agente ausente reatribuído",
+  "activityLog.entryType.agentLogin": "Início de sessão do Agente",
+  "activityLog.entryType.agentLogout": "Agente saiu",
+  "activityLog.entryType.agentOnline": "Agente online",
+  "activityLog.entryType.agentPasswordSet": "Palavra-passe do agente definida",
+  "activityLog.entryType.agentRolePermissionsChanged": "Permissões do perfil do agente alteradas",
+  "activityLog.rolePermissionsAdded": "{actorEmail} ({actorId}) adicionou permissão(ões) {permissions} ao cargo {roleName} ({roleId})",
+  "activityLog.rolePermissionsChanged": "{actorEmail} ({actorId}) removeu permissão(ões) {removed} e adicionou permissão(ões) {added} ao cargo {roleName} ({roleId})",
+  "activityLog.rolePermissionsRemoved": "{actorEmail} ({actorId}) removeu(s) permissão(ões) {permissions} do cargo {roleName} ({roleId})",
+  "admin.agent.apiKey.description": "Gerar chaves de API para este agente acessar libredesk programaticamente.",
+  "admin.agent.apiKey.noKey": "Nenhuma chave de API foi gerada para este agente.",
+  "admin.agent.apiKey.warningMessage": "Este segredo será mostrado apenas uma vez. Certifique-se de copiá-lo agora.",
+  "admin.agent.deleteConfirmation": "Isso excluirá permanentemente o agente. Considere desabilitar a conta.",
+  "admin.agent.help": "Gerenciar agentes de suporte, papéis, permissões e equipes.",
+  "admin.automation.all": "Mensagem recebida",
+  "admin.automation.and": "Mensagem enviada",
+  "admin.automation.any": "Mudança de prioridade",
+  "admin.automation.conversationUpdate": "Atualizar conversa",
+  "admin.automation.conversationUpdate.description": "Regras que são executadas quando uma conversa é atualizada.",
+  "admin.automation.evaluateRuleOnTheseEvents": "Avalie a regra sobre estes eventos.",
+  "admin.automation.event.message.incoming": "Mensagem recebida",
+  "admin.automation.event.message.outgoing": "Mensagem enviada",
+  "admin.automation.event.priority.change": "Alterar prioridade",
+  "admin.automation.event.status.change": "Alterar status",
+  "admin.automation.executeAllMatchingRules": "Executar todas as regras correspondentes",
+  "admin.automation.executeFirstMatchingRule": "Executar primeira regra correspondente",
+  "admin.automation.help": "Automatize ações quando conversas são criadas, atualizadas ou a cada hora.",
+  "admin.automation.invalid": "Certifique-se de ter pelo menos uma ação e uma regra, e que seus valores não estejam vazios.",
+  "admin.automation.matchBelow": "Corresponder {any_or_all} abaixo.",
+  "admin.automation.matchTheseRules": "Corresponder estas regras",
+  "admin.automation.newConversation.description": "Regras executadas quando uma nova conversa é criada por um contato. Conversas iniciadas por agentes não disparam essas regras. Arraste e solte para reordenar.",
+  "admin.automation.noRulesFound": "Nenhuma regra encontrada",
+  "admin.automation.or": "OU",
+  "admin.automation.performTheseActions": "Efetuar estas ações",
+  "admin.automation.timeTriggers": "Gatilhos de tempo",
+  "admin.automation.timeTriggers.description": "Regras executadas uma vez a cada hora.",
+  "admin.automation.validation.addAction": "Enviar pesquisas de satisfação do cliente quando a conversa for marcada como resolvida.",
+  "admin.automation.validation.addCondition": "Adicione pelo menos uma condição.",
+  "admin.automation.validation.selectActionType": "Selecione um tipo para todas as ações.",
+  "admin.automation.validation.selectField": "Selecione um campo para todas as condições.",
+  "admin.automation.validation.selectOperator": "Selecione um operador para todas as condições.",
+  "admin.automation.validation.setActionValue": "Defina um valor para todas as ações.",
+  "admin.automation.validation.setConditionValue": "Defina um valor para todas as condições.",
+  "admin.banner.restartMessage": "Algumas configurações foram alteradas e requerem reinicialização do aplicativo para entrar em vigor.",
+  "admin.businessHour.help.description": "Horário comercial permite que você defina horários de funcionamento para todo o seu helpdesk ou para equipes individuais.",
+  "admin.businessHour.help.detail": "Os cálculos de SLA são baseados em horários comerciais. Se uma equipe tiver horários comerciais definidos, o SLA será calculado usando as horas dessa equipe. Caso contrário, será revertido para os horários comerciais do helpdesk.",
+  "admin.businessHours.alwaysOpen24x7": "Sempre aberto (24/7)",
+  "admin.businessHours.customBusinessHours": "Horário comercial personalizado",
+  "admin.businessHours.setBusinessHours": "Definir horário comercial",
+  "admin.contextLink.help.description": "Links de contexto aparecem na barra lateral de conversas, permitindo que agentes abram ferramentas externas como CRMs, sistemas de faturamento ou painéis internos com os detalhes do contato passados automaticamente.",
+  "admin.contextLink.help.detail": "Use {'{{token}}'} para um payload totalmente criptografado que o aplicativo externo descriptografa com um segredo compartilhado. Ou use variáveis individuais como {'{{email}}'}, {'{{phone}}'}, {'{{external_user_id}}'} para links de URL simples para ferramentas internas confiáveis.",
+  "admin.conversationStatus.category.placeholder": "Selecione categoria",
+  "admin.conversationStatus.name.description": "Defina o nome do status. Clique em salvar quando terminar.",
+  "admin.conversationTags.edit.description": "Altere o nome da etiqueta. Clique em salvar quando terminar.",
+  "admin.conversationTags.new.description": "Defina o nome da etiqueta. Clique em salvar quando terminar.",
+  "admin.customAttribute.help": "Atributos personalizados ajudam você a definir detalhes adicionais sobre seus contatos ou conversas, como o plano de assinatura ou a data de sua primeira compra.",
+  "admin.customAttributes.keyNotAllowed": "A chave fornecida não é permitida, pois está em conflito com os atributos padrão. Use uma chave diferente.",
+  "admin.customAttributes.regex.description": "Regex para validar o valor deste atributo personalizado. Deixe vazio para pular a validação.",
+  "admin.customAttributes.regexHint.description": "Dica de padrão Regex.",
+  "admin.empty": "Selecionar uma seção da barra lateral",
+  "admin.general.allowedFileUploadExtensions": "Escolha canal",
+  "admin.general.allowedFileUploadExtensions.description": "Use `*` para permitir todos os tipos de arquivos. Por exemplo: `jpg, png, pdf`",
+  "admin.general.businessHours.placeholder": "Definir horário comercial",
+  "admin.general.faviconURL": "URL do favicon",
+  "admin.general.faviconURL.valid": "A URL do favicon deve ser uma URL válida",
+  "admin.general.help": "Estas são suas configurações padrão em toda a mesa. As configurações no nível da equipe substituirão essas onde configuradas.",
+  "admin.general.language.placeholder": "Selecione idioma",
+  "admin.general.logoURL.valid": "A URL do logo deve ser uma URL válida",
+  "admin.general.maxAllowedFileUploadSize": "Tamanho máximo de upload de arquivo permitido",
+  "admin.general.maxAllowedFileUploadSize.description": "Tamanho máximo de upload de arquivo em MB.",
+  "admin.general.maxAllowedFileUploadSize.valid": "O tamanho máximo de upload de arquivo deve estar entre 1 e 500 MB",
+  "admin.general.rootURL.description": "URL raiz para o aplicativo. (Sem barra invertida).",
+  "admin.general.rootURL.valid": "A URL raiz deve ser uma URL válida",
+  "admin.general.siteName": "Nome do site",
+  "admin.general.siteName.min": "O nome do site deve ter pelo menos 1 caractere",
+  "admin.general.timezone.placeholder": "Selecione fuso horário",
+  "admin.inbox.authProtocol": "Protocolo de Autenticação",
+  "admin.inbox.authProtocol.description": "Protocolo de autenticação a usar.",
+  "admin.inbox.authProtocol.login": "Entrar",
+  "admin.inbox.authProtocol.plain": "Simples",
+  "admin.inbox.chooseChannel": "Escolha o Canal",
+  "admin.inbox.createEmailInbox": "Criar uma caixa de entrada para suporte ao cliente baseado em e-mail",
+  "admin.inbox.createLiveChatInbox": "Criar uma caixa de entrada para suporte ao cliente baseado em chat ao vivo",
+  "admin.inbox.csatSurveys": "Questionários CSAT",
+  "admin.inbox.csatSurveys.description_1": "Enviar questionário de satisfação ao cliente quando a conversa for marcada como resolvida.",
+  "admin.inbox.csatSurveys.description_2": "Para melhor controle sobre quando enviar pesquisas, desabilite esta opção e crie uma regra de automação para enviar pesquisas.",
+  "admin.inbox.csatSurveys.description_3": "As pesquisas CSAT são enviadas apenas uma vez por conversa.",
+  "admin.inbox.enablePlusAddressing": "Habilitar endereçamento plus",
+  "admin.inbox.enablePlusAddressing.description": "Melhora o encadeamento de conversas, mas requer suporte do provedor (por exemplo, Gmail, Microsoft 365).",
+  "admin.inbox.enablePlusAddressing.requiredForMicrosoft": "Obrigatório para caixas de entrada da Microsoft para encadear respostas corretamente.",
+  "admin.inbox.enabled.description": "Ativar/desativar varredura da caixa de entrada e envio de mensagens.",
+  "admin.inbox.fromEmailAddress.description": "Endereço de e-mail de origem para sua caixa de entrada. ex: Minha caixa de entrada <support{'@'}example.com>",
+  "admin.inbox.fromEmailAddress.placeholder": "Minha caixa de entrada <support{'@'}example.com>",
+  "admin.inbox.heloHostname": "Nome do host HELO",
+  "admin.inbox.heloHostname.description": "O nome do host a ser usado no comando HELO/EHLO. Se não definido, padrão é localhost.",
+  "admin.inbox.help.email": "Conecte sua conta de email do Google ou Microsoft, ou configure as configurações de IMAP e SMTP manualmente. Cada caixa de entrada adicionada cria um novo canal de email para receber emails de clientes.",
+  "admin.inbox.help.livechat": "Crie widgets de chat ao vivo que podem ser incorporados em seu site para suporte em tempo real.",
+  "admin.inbox.idleTimeout": "Tempo limite ocioso",
+  "admin.inbox.idleTimeout.description": "O 'IdleTimeout' é o tempo máximo de espera por nova atividade em uma conexão antes de fechá-la e removê-la do pool.",
+  "admin.inbox.imap.tls.description": "Escolha o método de criptografia para IMAP.",
+  "admin.inbox.imapConfig": "Configuração IMAP",
+  "admin.inbox.imapScanInboxSince": "Varrer caixa de entrada desde",
+  "admin.inbox.imapScanInboxSince.description": "Para melhorar o desempenho em helpdesks grandes com alto volume de email, isso limita as varreduras aos emails recebidos desde a duração especificada (por exemplo, `2h`, `48h`) subtraindo-a da hora atual.",
+  "admin.inbox.imapScanInterval": "Intervalo de varredura",
+  "admin.inbox.imapScanInterval.description": "Intervalo para varrer a caixa de entrada procurando novos emails. Formato: 120s, 1m, 1h",
+  "admin.inbox.livechat.allowStartConversation": "Permitir iniciar conversa",
+  "admin.inbox.livechat.allowStartConversation.users.description": "Permitir que usuários iniciem novas conversas",
+  "admin.inbox.livechat.allowStartConversation.visitors.description": "Permitir que visitantes iniciem novas conversas",
+  "admin.inbox.livechat.blockedIPs.description": "Digite endereços IP ou intervalos CIDR para bloquear, um por linha. IPs bloqueados serão negados acesso ao widget.",
+  "admin.inbox.livechat.blockedIPs.list": "Lista de bloqueio de IP",
+  "admin.inbox.livechat.chatIntroduction": "Introdução do chat",
+  "admin.inbox.livechat.chatReplyExpectationMessage": "Mensagem de expectativa de resposta do chat",
+  "admin.inbox.livechat.chatReplyExpectationMessage.description": "Mensagem mostrada durante o horário comercial sobre tempos de resposta esperados.",
+  "admin.inbox.livechat.colors": "Cores",
+  "admin.inbox.livechat.continuity.maxMessagesPerEmail": "Máximo de mensagens por email",
+  "admin.inbox.livechat.continuity.maxMessagesPerEmail.description": "Número máximo de mensagens a incluir em um único email de continuidade. Máx. 100.",
+  "admin.inbox.livechat.continuity.minEmailInterval": "Intervalo mínimo de email",
+  "admin.inbox.livechat.continuity.minEmailInterval.description": "Tempo mínimo entre emails de continuidade para o mesmo contato. Mín. 1m.",
+  "admin.inbox.livechat.continuity.offlineThreshold": "Limite desconectado",
+  "admin.inbox.livechat.continuity.offlineThreshold.description": "Quanto tempo esperar depois que um contato fica desconectado antes de enviar email. Mín. 1m.",
+  "admin.inbox.livechat.continuityEmailFooter": "Responda diretamente a este email para continuar a conversa.",
+  "admin.inbox.livechat.continuityEmailFooterWithLink": "Responda a este email ou {link}vá para o chat{endlink} para continuar a conversa.",
+  "admin.inbox.livechat.conversationContinuity": "Caixa de entrada de email de continuidade de conversa",
+  "admin.inbox.livechat.conversationContinuity.description": "Quando um contato fica desconectado, as respostas são enviadas por esta caixa de entrada de email. Eles podem continuar a conversa respondendo ao email ou voltando para o chat.",
+  "admin.inbox.livechat.darkMode": "Modo escuro",
+  "admin.inbox.livechat.darkMode.description": "Habilitar modo escuro para o widget de chat",
+  "admin.inbox.livechat.directToConversation": "Lançar diretamente para a conversa",
+  "admin.inbox.livechat.directToConversation.description": "Pule a tela inicial e abra diretamente na conversa mais recente do usuário, ou em uma nova conversa se nenhuma existir",
+  "admin.inbox.livechat.externalLinks": "Links externos",
+  "admin.inbox.livechat.externalLinks.add": "Adicionar link externo",
+  "admin.inbox.livechat.fallbackLanguage": "Idioma alternativo",
+  "admin.inbox.livechat.fallbackLanguage.description": "Idioma a ser usado quando o idioma do navegador do visitante não estiver disponível.",
+  "admin.inbox.livechat.features.emoji": "Suporte a emoji",
+  "admin.inbox.livechat.features.emoji.description": "Permitir que usuários usem emojis no chat",
+  "admin.inbox.livechat.features.fileUpload": "Upload de arquivo",
+  "admin.inbox.livechat.features.fileUpload.description": "Permitir que usuários façam upload de arquivos no chat",
+  "admin.inbox.livechat.greetingMessage": "Mensagem de saudação",
+  "admin.inbox.livechat.greetingMessage.variables": "Variáveis disponíveis: {'{{.FirstName}}'}, {'{{.LastName}}'}. Utilize {‘|’} para o valor por defeito, por exemplo: Olá {‘{{.FirstName | there}}’}",
+  "admin.inbox.livechat.homeScreen.fadeBackground": "Desvanecer fundo",
+  "admin.inbox.livechat.homeScreen.fadeBackground.description": "Mescle a cor de fundo do cabeçalho na área de conteúdo abaixo",
+  "admin.inbox.livechat.homeScreen.headerTextColor.description": "Cor do texto de saudação e introdução na tela inicial",
+  "admin.inbox.livechat.installation.identity.addJwt": "Adicione o JWT assinado às Configurações do Libredesk:",
+  "admin.inbox.livechat.installation.identity.description": "Verifique usuários conectados para que as conversas sejam vinculadas a suas contas reais e os usuários não possam se passar uns pelos outros.",
+  "admin.inbox.livechat.installation.identity.howItWorks": "Seu servidor gera um JWT assinado contendo os detalhes do usuário. Use a chave secreta da guia Segurança para assiná-la com o algoritmo HS256.",
+  "admin.inbox.livechat.installation.identity.secretWarning": "Nunca exponha a chave secreta no código do lado do cliente. Sempre gere o JWT no seu servidor.",
+  "admin.inbox.livechat.installation.identity.title": "Verificação de identidade",
+  "admin.inbox.livechat.installation.instructions.step1": "Copie o trecho de código abaixo",
+  "admin.inbox.livechat.installation.instructions.step2": "Cole-o logo antes da etiqueta 'corpo' de fechamento em cada página onde deseja que o widget de chat ao vivo apareça",
+  "admin.inbox.livechat.installation.instructions.title": "Instruções de instalação",
+  "admin.inbox.livechat.installation.jsApi.description": "Controle o widget programaticamente do seu aplicativo.",
+  "admin.inbox.livechat.installation.jsApi.title": "API JavaScript",
+  "admin.inbox.livechat.introductionMessage": "Mensagem de introdução",
+  "admin.inbox.livechat.language.auto": "Detecção automática (idioma do navegador)",
+  "admin.inbox.livechat.launcher": "Iniciador",
+  "admin.inbox.livechat.launcher.color": "Cor do launcher",
+  "admin.inbox.livechat.launcher.logo": "Logo do launcher",
+  "admin.inbox.livechat.launcher.position": "Posição",
+  "admin.inbox.livechat.launcher.position.left": "Esquerda",
+  "admin.inbox.livechat.launcher.position.right": "Direita",
+  "admin.inbox.livechat.launcher.spacing.bottom": "Espaçamento inferior",
+  "admin.inbox.livechat.launcher.spacing.bottom.description": "Distância do fundo da tela em pixels",
+  "admin.inbox.livechat.launcher.spacing.side": "Espaçamento lateral",
+  "admin.inbox.livechat.launcher.spacing.side.description": "Distância do lado da tela em pixels",
+  "admin.inbox.livechat.noticeBanner": "Painel de aviso",
+  "admin.inbox.livechat.noticeBanner.enabled": "Habilitar painel de aviso",
+  "admin.inbox.livechat.noticeBanner.text": "Texto do painel de aviso",
+  "admin.inbox.livechat.officeHours": "Horário de funcionamento",
+  "admin.inbox.livechat.prechatForm.availableFields": "Atributos personalizados disponíveis",
+  "admin.inbox.livechat.prechatForm.enabled": "Habilitar formulário pré-chat",
+  "admin.inbox.livechat.prechatForm.enabled.description": "Mostrar um formulário para coletar informações antes do chat começar",
+  "admin.inbox.livechat.prechatForm.fields": "Campos do formulário",
+  "admin.inbox.livechat.prechatForm.noFields": "Nenhum campo configurado. Adicione campos de atributos personalizados.",
+  "admin.inbox.livechat.prechatForm.title": "Título do formulário",
+  "admin.inbox.livechat.preventMultipleConversations": "Prevenir múltiplas conversas",
+  "admin.inbox.livechat.preventMultipleConversations.users.description": "Prevenir que usuários iniciem múltiplas conversas simultaneamente",
+  "admin.inbox.livechat.preventMultipleConversations.visitors.description": "Prevenir que visitantes iniciem múltiplas conversas simultaneamente",
+  "admin.inbox.livechat.preventReplyToClosedConversation": "Prevenir resposta a conversas fechadas",
+  "admin.inbox.livechat.preventReplyToClosedConversation.description": "Quando habilitado, os usuários não podem responder a conversas fechadas",
+  "admin.inbox.livechat.secretKey": "Chave secreta",
+  "admin.inbox.livechat.secretKey.description": "Defina uma chave secreta para proteger o widget de chat.",
+  "admin.inbox.livechat.sessionDuration.description": "Quanto tempo as sessões de usuários autenticados permanecem ativas. As sessões se estendem automaticamente na atividade. Mínimo 1 hora. Exemplo: 24h, 168h, 720h, 2160h.",
+  "admin.inbox.livechat.sessionDuration.label": "Duração da sessão do usuário autenticado",
+  "admin.inbox.livechat.showOfficeHoursAfterAssignment": "Mostrar horário de funcionamento após atribuição de equipe",
+  "admin.inbox.livechat.showOfficeHoursAfterAssignment.description": "Mostrar horário de funcionamento após a conversa ser atribuída a uma equipe",
+  "admin.inbox.livechat.showOfficeHoursInChat": "Mostrar horário de funcionamento no chat",
+  "admin.inbox.livechat.showOfficeHoursInChat.description": "Mostrar quando a equipe estará disponível novamente",
+  "admin.inbox.livechat.showPoweredBy": "Mostrar alimentado por",
+  "admin.inbox.livechat.showPoweredBy.description": "Mostrar \"Alimentado por Libredesk\" quando uma conversa é aberta no widget",
+  "admin.inbox.livechat.startConversationButtonText": "Texto do botão iniciar conversa",
+  "admin.inbox.livechat.tabs.appearance": "Aparência",
+  "admin.inbox.livechat.tabs.installation": "Instalação",
+  "admin.inbox.livechat.tabs.messages": "Mensagens",
+  "admin.inbox.livechat.tabs.prechat": "Formulário pré-chat",
+  "admin.inbox.livechat.trustedDomains.description": "Um domínio por linha. *.example.com corresponde apenas a subdomínios, adicione o domínio simples example.com separadamente. Deixe vazio para permitir qualquer domínio.",
+  "admin.inbox.livechat.trustedDomains.list": "Lista de domínios",
+  "admin.inbox.livechat.userSettings.visitors": "Visitantes",
+  "admin.inbox.livechat.websiteUrl": "URL do site",
+  "admin.inbox.livechat.websiteUrl.description": "URL onde o widget de chat é instalado. Usado em emails de continuidade para vincular de volta ao chat.",
+  "admin.inbox.mailbox": "Caixa de correio",
+  "admin.inbox.mailbox.description": "Caixa de correio (pasta) para varrer procurando emails recebidos. Padrão é INBOX (geralmente sem necessidade de mudança).",
+  "admin.inbox.maxConnections": "Máx. Conexões",
+  "admin.inbox.maxConnections.description": "Número máximo de conexões simultâneas com o servidor.",
+  "admin.inbox.maxRetries": "Máx. Tentativas",
+  "admin.inbox.maxRetries.description": "Número de vezes para tentar novamente quando uma mensagem falha.",
+  "admin.inbox.oauth.chooseSetupMethod": "Escolha método de configuração",
+  "admin.inbox.oauth.clientIDSecretRequired": "Forneça ID do cliente e segredo do cliente",
+  "admin.inbox.oauth.connectAccount": "Conectar conta {provider}",
+  "admin.inbox.oauth.connectedVia": "Conectado via OAuth - {provider}",
+  "admin.inbox.oauth.enterClientID": "Digite o seu ID de cliente OAuth",
+  "admin.inbox.oauth.enterClientSecret": "Digite seu segredo do cliente OAuth",
+  "admin.inbox.oauth.followSteps": "Siga os passos abaixo para conectar sua conta de email",
+  "admin.inbox.oauth.googleCloudConsole": "Console de nuvem do Google",
+  "admin.inbox.oauth.googleDescription": "Conectar com Google Workspace ou Gmail",
+  "admin.inbox.oauth.microsoftAzurePortal": "Portal Azure da Microsoft",
+  "admin.inbox.oauth.microsoftDescription": "Conectar com Microsoft 365 ou Outlook",
+  "admin.inbox.oauth.otherProvider": "Outro provedor",
+  "admin.inbox.oauth.otherProviderDescription": "Configure IMAP e SMTP manualmente",
+  "admin.inbox.oauth.reconnectAccount": "Reconectar conta {provider}",
+  "admin.inbox.oauth.reconnectDescription": "Re-insira suas credenciais para atualizar a conexão OAuth",
+  "admin.inbox.oauth.selectConnectionMethod": "Selecione como deseja conectar sua conta de email",
+  "admin.inbox.oauth.step1CreateApp": "1. Criar aplicativo OAuth em",
+  "admin.inbox.oauth.step2AddCallback": "2. Adicione esta URL de callback:",
+  "admin.inbox.oauth.step3EnterCredentials": "3. Digite suas credenciais abaixo:",
+  "admin.inbox.promptTagsOnReply": "Solicitar etiquetas antes de responder",
+  "admin.inbox.promptTagsOnReply.description": "Avise agentes antes de enviarem uma resposta em uma conversa que não tem etiquetas. Os agentes ainda podem enviar sem etiquetar, confirmando o prompt.",
+  "admin.inbox.replyToAddress": "Endereço de resposta (opcional)",
+  "admin.inbox.replyToAddress.description": "Para onde as respostas do cliente vão. Necessário apenas quando o email de origem do SMTP e a caixa de correio do IMAP estão em domínios diferentes.",
+  "admin.inbox.replyToAddress.placeholder": "suporte{'@'}example.com",
+  "admin.inbox.skipTLSVerification": "Ignorar verificação TLS",
+  "admin.inbox.skipTLSVerification.description": "Ignorar a verificação de nome do host no certificado TLS.",
+  "admin.inbox.smtpConfig": "Configuração SMTP",
+  "admin.inbox.tls.description": "Criptografia TLS/SSL, STARTTLS é comumente usado.",
+  "admin.inbox.waitTimeout": "Tempo limite de espera",
+  "admin.inbox.waitTimeout.description": "'PoolWaitTimeout' é o tempo máximo de espera para obter uma conexão de um pool antes de atingir o tempo limite. Isso pode acontecer quando todas as conexões abertas estão ocupadas enviando emails e não estão retornando ao pool rápido o suficiente. Este é também o tempo limite usado ao criar novas conexões SMTP.",
+  "admin.macro.actionInvalid": "Cada ação deve ter um tipo e um valor",
+  "admin.macro.help": "Combine múltiplas ações de conversa em macros de um clique.",
+  "admin.macro.messageContent": "Resposta a ser enviada quando a macro é usada (opcional)",
+  "admin.macro.messageOrActionRequired": "Conteúdo de mensagem ou ações são necessários",
+  "admin.notification.help.description": "Configure as configurações do servidor SMTP para enviar notificações de email para membros da equipe.",
+  "admin.notification.help.detail": "Uma vez configurado, os colegas de equipe receberão alertas automatizados para atribuições de conversas, violações de SLA e outros eventos importantes.",
+  "admin.notification.restartApp": "Configurações atualizadas com sucesso, reinicie o aplicativo para as alterações entrarem em vigor.",
+  "admin.oidc.help": "Configure o logon único com um ou mais provedores OpenID Connect.",
+  "admin.role.activityLog.manage": "Gerenciar log de atividades",
+  "admin.role.ai.manage": "Gerenciar recursos de IA",
+  "admin.role.automations.manage": "Gerenciar automações",
+  "admin.role.businessHours.manage": "Gerenciar horários comerciais",
+  "admin.role.cannotModifyAdminRole": "Não é possível modificar o cargo de administrador. Crie um novo cargo.",
+  "admin.role.contactNotes.delete": "Excluir notas de contato",
+  "admin.role.contactNotes.read": "Ver notas de contato",
+  "admin.role.contactNotes.write": "Adicionar notas de contato",
+  "admin.role.contacts.block": "Bloquear contatos",
+  "admin.role.contacts.read": "Ver detalhes do contato",
+  "admin.role.contacts.readAll": "Ver todos os contatos",
+  "admin.role.contacts.write": "Editar detalhes do contato",
+  "admin.role.contextLinks.manage": "Gerenciar links de contexto",
+  "admin.role.conversations.read": "Ver conversa",
+  "admin.role.conversations.readAll": "Ver todas as conversas",
+  "admin.role.conversations.readAssigned": "Ver conversas atribuídas a mim",
+  "admin.role.conversations.readTeamAll": "Ver conversas da sua equipe",
+  "admin.role.conversations.readTeamInbox": "Ver conversas na caixa de entrada da equipe",
+  "admin.role.conversations.readUnassigned": "Ver todas as conversas não atribuídas",
+  "admin.role.conversations.updatePriority": "Alterar prioridade da conversa",
+  "admin.role.conversations.updateStatus": "Alterar status da conversa",
+  "admin.role.conversations.updateTags": "Adicionar ou remover etiquetas de conversa",
+  "admin.role.conversations.updateTeamAssignee": "Atribuir conversas a equipes",
+  "admin.role.conversations.updateUserAssignee": "Atribuir conversas a usuários",
+  "admin.role.conversations.write": "Criar conversa",
+  "admin.role.customAttributes.manage": "Gerenciar atributos personalizados",
+  "admin.role.generalSettings.manage": "Gerenciar configurações gerais",
+  "admin.role.help": "Gerencie papéis e suas permissões para controle refinado sobre seu helpdesk.",
+  "admin.role.inboxes.manage": "Gerenciar caixas de entrada",
+  "admin.role.macros.manage": "Gerenciar macros",
+  "admin.role.messages.read": "Ver mensagens de conversa",
+  "admin.role.messages.write": "Enviar mensagens em conversas",
+  "admin.role.messages.writeAsContact": "Enviar mensagens como contato",
+  "admin.role.notificationSettings.manage": "Gerenciar configurações de notificação",
+  "admin.role.oidc.manage": "Gerenciar configuração de SSO",
+  "admin.role.reports.manage": "Gerenciar relatórios",
+  "admin.role.roleForAllSupportAgents": "Papel para todos os agentes de suporte",
+  "admin.role.roles.manage": "Gerenciar papéis",
+  "admin.role.setPermissionsForThisRole": "Definir permissões para este papel",
+  "admin.role.sharedViews.manage": "Gerenciar visualizações compartilhadas",
+  "admin.role.sla.manage": "Gerenciar políticas de SLA",
+  "admin.role.status.manage": "Gerenciar status da conversa",
+  "admin.role.tags.manage": "Gerenciar etiquetas",
+  "admin.role.teams.manage": "Gerenciar equipes",
+  "admin.role.templates.manage": "Gerenciar modelos",
+  "admin.role.users.manage": "Gerenciar usuários",
+  "admin.role.view.manage": "Criar e gerenciar visualizações de conversa",
+  "admin.role.webhooks.manage": "Gerenciar webhooks",
+  "admin.sharedView.help": "Crie visualizações compartilhadas visíveis para todos os agentes ou equipes específicas.",
+  "admin.sla.addBreachAlert": "Adicionar alerta de violação",
+  "admin.sla.addWarningAlert": "Adicionar alerta de aviso",
+  "admin.sla.advanceWarning": "Aviso antecipado",
+  "admin.sla.afterSpecificDuration": "Após duração específica",
+  "admin.sla.alertConfiguration": "Configuração de alerta",
+  "admin.sla.alertConfiguration.description": "Configurar gatilhos de alerta e destinatários",
+  "admin.sla.alertRecipients": "Destinatários de alerta",
+  "admin.sla.assignedUser": "Usuário atribuído",
+  "admin.sla.atleastOneSLATimeRequired": "Pelo menos um de Tempo de Primeira Resposta, Tempo de Próxima Resposta ou Tempo de Resolução é obrigatório.",
+  "admin.sla.breach": "Violação",
+  "admin.sla.description.valid": "A descrição da Política de SLA deve ter entre 1 e 255 caracteres",
+  "admin.sla.firstResponseTime": "Tempo de primeira resposta",
+  "admin.sla.followUpDelay": "Atraso de acompanhamento",
+  "admin.sla.help.description": "Configure políticas de SLA para definir tempo de resposta, resolução e metas de tempo de próxima resposta.",
+  "admin.sla.help.detail": "Os SLAs ajudam a rastrear o desempenho da equipe e garantir que as conversas sejam tratadas nos prazos esperados. SLAs violados acionam notificações para membros da equipe configurados.",
+  "admin.sla.immediatelyOnBreach": "Imediatamente na violação",
+  "admin.sla.name.valid": "O nome da Política de SLA deve ter entre 1 e 255 caracteres",
+  "admin.sla.nextResponseTime": "Tempo de próxima resposta",
+  "admin.sla.noAlertsConfigured": "Nenhum alerta configurado",
+  "admin.sla.postBreachAlert": "Alerta pós-violação",
+  "admin.sla.preBreachAlert": "Alerta pré-violação",
+  "admin.sla.resolutionTime": "Tempo de resolução",
+  "admin.sla.triggerTiming": "Tempo de disparo",
+  "admin.sla.warning": "Aviso",
+  "admin.sso.logoURLDescription": "URL de logo personalizado para exibir na página de login.",
+  "admin.sso.setThisUrlForCallback": "Defina este URI para callback.",
+  "admin.status.help": "Crie status de conversa personalizados para estender o fluxo de trabalho padrão.",
+  "admin.tag.help": "Etiquetas podem ser usadas para filtrar conversas e como condições em automações.",
+  "admin.tags.deleteConfirmation": "Tem certeza de que deseja excluir esta etiqueta? Isso também a removerá de todas as conversas",
+  "admin.team.assignmentType": "Tipo de atribuição automática",
+  "admin.team.assignmentType.description": "Round robin: as conversas são atribuídas aos membros da equipe em ordem circular. Manual: as conversas devem ser selecionadas pelos membros da equipe.",
+  "admin.team.assignmentType.manual": "Manual",
+  "admin.team.assignmentType.placeholder": "Selecione um tipo de atribuição",
+  "admin.team.assignmentType.roundRobin": "Round robin",
+  "admin.team.businessHours.description": "Horários comerciais padrão para a equipe, serão usados para calcular o SLA.",
+  "admin.team.couldNotFetchBusinessHours": "Não foi possível buscar horários comerciais",
+  "admin.team.emoji": "Emoji",
+  "admin.team.help.description": "Configure as configurações da equipe, incluindo horários de trabalho e políticas de SLA.",
+  "admin.team.help.detail": "Gerencie os limites de atribuição automática de agentes e muito mais.",
+  "admin.team.maxAutoAssigned": "Máximo de conversas atribuídas automaticamente",
+  "admin.team.maxAutoAssigned.description": "Número máximo de conversas que podem ser atribuídas automaticamente a um agente. Apenas conversas em status com a categoria \"Aberta\" contam para este limite. Defina como 0 para ilimitado.",
+  "admin.team.noPermissionBusinessHours": "Você não tem permissão para visualizar horários comerciais.",
+  "admin.team.slaPolicy.description": "Política de SLA a ser aplicada automaticamente a conversas, quando conversas são atribuídas a esta equipe.",
+  "admin.team.slaPolicy.placeholder": "Selecione política",
+  "admin.team.timezone.description": "O fuso horário da equipe será usado para calcular o SLA.",
+  "admin.template.emailNotificationTemplates": "Modelos de notificação de email",
+  "admin.template.help": "Personalize a aparência e o conteúdo dos emails enviados para clientes e emails de notificação para sua equipe.",
+  "admin.template.makeSureTemplateHasContent": "Certifique-se de que o modelo tem {content} apenas uma vez.",
+  "admin.template.onlyOneDefaultOutgoingTemplate": "Você pode ter apenas um modelo de email de saída padrão.",
+  "admin.template.outgoingEmailTemplates": "Modelos de email de saída",
+  "admin.webhook.events.description": "Selecione os eventos aos quais deseja se inscrever.",
+  "admin.webhook.help": "Configure webhooks para receber notificações em tempo real quando eventos ocorrem em seu helpdesk.",
+  "admin.webhook.secret.description": "Chave secreta opcional para verificação de assinatura de webhook.",
+  "agent.apiKeyGenerated": "Chave de API gerada com sucesso",
+  "agent.apiKeyRevoked": "Chave de API revogada com sucesso",
+  "agent.edit": "Editar agente",
+  "agent.generateApiKey": "Gerar chave de API",
+  "agent.new": "Novo agente",
+  "agent.selectAvailabilityStatus": "Selecione status de disponibilidade",
+  "auth.backToLogin": "Voltar ao login",
+  "auth.checkEmailForReset": "Verifique seu email para o link de redefinição de senha.",
+  "auth.confirmPassword": "Confirmar senha",
+  "auth.csrfTokenMismatch": "Incompatibilidade de token CSRF",
+  "auth.enterEmailForReset": "Digite seu email para receber um link de redefinição de senha.",
+  "auth.enterNewPasswordTwice": "Digite sua nova senha duas vezes para confirmar.",
+  "auth.forgotPassword": "Esqueceu a senha?",
+  "auth.hidePassword": "Ocultar senha",
+  "auth.invalidOrExpiredSession": "Sessão inválida ou expirada",
+  "auth.invalidOrExpiredSessionClearCookie": "Sessão inválida ou expirada. Limpe seus cookies e tente novamente.",
+  "auth.invalidResetLink": "Link de redefinição inválido. Solicite um novo link de redefinição de senha.",
+  "auth.loggingIn": "Fazendo login...",
+  "auth.newPassword": "Nova senha",
+  "auth.orContinueWith": "Ou continuar com",
+  "auth.passwordRequired": "A senha é obrigatória.",
+  "auth.passwordSetSuccess": "Agora você pode fazer login com sua nova senha.",
+  "auth.passwordsDoNotMatch": "As senhas não correspondem.",
+  "auth.resetPassword": "Redefinir senha",
+  "auth.sendResetLink": "Enviar link de redefinição",
+  "auth.setNewPassword": "Definir nova senha",
+  "auth.settingPassword": "Definindo senha...",
+  "auth.showPassword": "Mostrar senha",
+  "auth.signIn": "Faça login em sua conta",
+  "auth.signInButton": "Fazer login",
+  "automation.deletionConfirmation": "Esta ação não pode ser desfeita. Isso excluirá permanentemente esta regra de automação.",
+  "automation.editRule": "Editar regra",
+  "automation.newRule": "Nova regra",
+  "businessHour.deletionConfirmation": "Esta ação não pode ser desfeita. Isso excluirá permanentemente este horário comercial.",
+  "businessHour.edit": "Editar horário comercial",
+  "businessHour.new": "Novo horário comercial",
+  "businessHour.newHoliday": "Novo feriado",
+  "command.navigate": "Navegar",
+  "command.noCommandAvailable": "Nenhum comando disponível",
+  "command.pickSnoozeTime": "Escolha um tempo de pausa",
+  "command.replyPreview": "Visualização de resposta",
+  "command.selectAMacro": "Selecione uma macro para visualizar detalhes",
+  "command.snoozeFor": "Pausar por",
+  "command.typeCmdOrSearch": "Digite um comando ou pesquise...",
+  "confirm.deleteContextLink": "Esta ação não pode ser desfeita. Isso excluirá permanentemente este link de contexto.",
+  "confirm.deleteInbox": "Esta ação não pode ser desfeita. Isso excluirá permanentemente esta caixa de entrada.",
+  "confirm.deleteMacro": "Esta ação não pode ser desfeita. Isso excluirá permanentemente esta macro.",
+  "confirm.deleteSharedView": "Esta ação não pode ser desfeita. Isso excluirá permanentemente esta visualização compartilhada.",
+  "confirm.deleteSso": "Esta ação não pode ser desfeita. Isso excluirá permanentemente este SSO.",
+  "confirm.deleteTeam": "Esta ação não pode ser desfeita. Isso excluirá permanentemente esta equipe.",
+  "confirm.deleteView": "Esta ação não pode ser desfeita. Isso excluirá permanentemente esta visualização.",
+  "confirm.deleteWebhook": "Esta ação não pode ser desfeita. Isso excluirá permanentemente este webhook.",
+  "contact.addNote": "Adicionar nota",
+  "contact.allContacts": "Todos os contatos",
+  "contact.alreadyExistsWithEmail": "Outro contato com o mesmo email já existe",
+  "contact.blockConfirm": "Tem certeza de que deseja bloquear este contato? Eles não conseguirão conversar e emails recebidos de seu endereço serão rejeitados. Isso também bloqueia emails recebidos de qualquer outro contato que use o mesmo email.",
+  "contact.blockContact": "Bloquear contato",
+  "contact.blockedSuccessfully": "Contato bloqueado com sucesso",
+  "contact.deleteNote": "Excluir nota",
+  "contact.editContact": "Editar contato",
+  "contact.identityNotVerified": "Identidade não verificada",
+  "contact.identityVerified": "Identidade verificada",
+  "contact.newNote": "Nova nota",
+  "contact.noContactsFound": "Nenhum contato encontrado",
+  "contact.notes.empty": "Nenhuma nota ainda",
+  "contact.notes.help": "Adicione nota para este contato para acompanhar informações importantes e conversas.",
+  "contact.saveNote": "Salvar nota",
+  "contact.searchByEmail": "Pesquisar por email",
+  "contact.type.contact": "Contato",
+  "contact.type.visitor": "Visitante",
+  "contact.unblockConfirm": "Tem certeza de que deseja desbloquear este contato? Eles podem conversar novamente e emails recebidos de seu endereço serão aceitos.",
+  "contact.unblockContact": "Desbloquear contato",
+  "contact.unblockedSuccessfully": "Contato desbloqueado com sucesso",
+  "contact.updateContact": "Atualizar contato",
+  "contextLink.edit": "Editar link de contexto",
+  "contextLink.namePlaceholder": "Meu aplicativo",
+  "contextLink.new": "Novo link de contexto",
+  "contextLink.secret": "Segredo",
+  "contextLink.secretHelp": "Uma chave de 32 caracteres compartilhada entre Libredesk e o aplicativo externo. Usada para criptografar o {'{{token}}'} para que apenas o aplicativo externo possa ler os detalhes do contato. Não necessária se você usar apenas variáveis simples como {'{{email}}'}.",
+  "contextLink.secretLengthError": "Segredo deve ter exatamente 32 caracteres.",
+  "contextLink.tokenExpiry": "Expiração do token (segundos)",
+  "contextLink.tokenExpiryHelp": "O aplicativo externo deve rejeitar tokens com mais de isso. Incluído como 'exp' (timestamp de expiração) dentro do token criptografado.",
+  "contextLink.urlTemplate": "Modelo de URL",
+  "contextLink.urlTemplateHelp": "{'{{token}}'} é um blob codificado em base64 criptografado com AES-256-GCM contendo todos os campos de contato e agente (requer segredo). Variáveis individuais como {'{{email}}'}, {'{{phone}}'}, {'{{external_user_id}}'}, {'{{contact_id}}'}, {'{{first_name}}'}, {'{{last_name}}'}, {'{{conversation_uuid}}'} são passadas como texto simples.",
+  "conversation.agentAssigned": "Agente atribuído",
+  "conversation.allLoaded": "Todas as conversas carregadas",
+  "conversation.bulkActions.clearSelection": "Limpar a seleção",
+  "conversation.couldNotFetch": "Não foi possível buscar conversas",
+  "conversation.hideQuotedText": "Ocultar texto entre aspas",
+  "conversation.mentions": "Menções",
+  "conversation.myInbox": "Minha caixa de entrada",
+  "conversation.newConversation": "Nova conversa",
+  "conversation.noConversationsFound": "Nenhuma conversa encontrada",
+  "conversation.notMemberOfTeam": "Você não é membro desta equipe, atualize a página e tente novamente",
+  "conversation.placeholder": "Selecione uma conversa do painel esquerdo.",
+  "conversation.search": "Pesquisar conversas",
+  "conversation.searchContact": "Pesquisar contato por email ou digitar novo email",
+  "conversation.sentViaEmail": "Enviado por email",
+  "conversation.showQuotedText": "Mostrar texto entre aspas",
+  "conversation.sidebar.contactAttributes": "Atributos de contato",
+  "conversation.sidebar.information": "Informação",
+  "conversation.sidebar.lastVisitedPages": "Últimas páginas visitadas",
+  "conversation.sidebar.noPreviousConvo": "Nenhuma conversa anterior",
+  "conversation.sidebar.notAvailable": "Não disponível",
+  "conversation.sidebar.previousConvo": "Conversas anteriores",
+  "conversation.sort.newestActivity": "Atividade mais antiga",
+  "conversation.sort.nextSLATarget": "Prioridade primeiro",
+  "conversation.sort.oldestActivity": "Começou primeiro",
+  "conversation.sort.priorityFirst": "Começou por último",
+  "conversation.sort.startedFirst": "Esperando mais tempo",
+  "conversation.sort.startedLast": "Equipe atribuída",
+  "conversation.sort.waitingLongest": "Tente ajustar filtros",
+  "conversation.teamAssigned": "Você não tem acesso a esta visualização",
+  "conversation.tryAdjustingFilters": "Não é possível excluir o status pois está em uso, remova este status de todas as conversas antes de excluir",
+  "conversation.viewPermissionDenied": "Não é possível atualizar o status de conversa padrão",
+  "csat.rateYourInteraction": "Atributo personalizado já existe",
+  "csat.thankYouMessage": "Agradecemos por dedicar tempo para enviar seus comentários.",
+  "customAttribute.deletionConfirmation": "Esta ação não pode ser desfeita. Isso excluirá permanentemente este atributo personalizado.",
+  "customAttribute.edit": "Editar atributo personalizado",
+  "customAttribute.new": "Novo atributo personalizado",
+  "dateFilter.lastNDays": "Últimos {n} dias | Últimos {n} dias",
+  "dateFilter.selectDays": "Selecionar dias",
+  "editor.addLinkUrl": "Adicionar URL de link",
+  "editor.hint.full": "Shift + Enter para adicionar uma nova linha. Ctrl + Enter para enviar. Ctrl + K para abrir a barra de comandos.",
+  "editor.hint.newLineCtrlK": "Shift + Enter para adicionar uma nova linha. Ctrl + K para abrir a barra de comandos.",
+  "editor.hint.newLineSend": "Shift + Enter para adicionar uma nova linha. Ctrl + Enter para enviar.",
+  "editor.newLine": "Shift + Enter para adicionar uma nova linha ",
+  "errors.alreadyExistsCustomAttribute": "Atributo personalizado já existe",
+  "errors.alreadyExistsRole": "Papel já existe",
+  "errors.alreadyExistsTag": "Etiqueta já existe",
+  "errors.alreadyExistsTeam": "Equipe já existe",
+  "errors.canOnlyDeleteOwnNote": "Você pode excluir apenas sua própria nota",
+  "errors.parsingRequest": "Erro ao analisar solicitação",
+  "filter.add": "Adicionar filtro",
+  "globals.messages.add": "Adicionar",
+  "globals.messages.addAnnouncement": "Adicionar anúncio",
+  "globals.messages.addEmoji": "Adicionar emoji",
+  "globals.messages.addExternalLink": "Adicionar link externo",
+  "globals.messages.additionalFeedback": "Feedback adicional (opcional)",
+  "globals.messages.all": "Tudo",
+  "globals.messages.apply": "Aplicar",
+  "globals.messages.areYouAbsolutelySure": "Tem certeza absoluta?",
+  "globals.messages.attachFile": "Anexar arquivo",
+  "globals.messages.back": "Voltar",
+  "globals.messages.backOnDayAt": "em {day} às {time}",
+  "globals.messages.backTodayAt": "hoje às {time}",
+  "globals.messages.backTomorrowAt": "amanhã às {time}",
+  "globals.messages.backgroundColor": "Cor de fundo",
+  "globals.messages.backgroundImageUrl": "URL de imagem de fundo",
+  "globals.messages.badRequest": "Solicitação ruim",
+  "globals.messages.block": "Bloquear",
+  "globals.messages.cancel": "Cancelar",
+  "globals.messages.caseSensitiveMatch": "Correspondência sensível a maiúsculas",
+  "globals.messages.close": "Fechar",
+  "globals.messages.closeChat": "Fechar chat",
+  "globals.messages.connecting": "Conectando...",
+  "globals.messages.continueConversation": "Continue sua conversa",
+  "globals.messages.copied": "Copiado para a área de transferência",
+  "globals.messages.correctEmailErrors": "Corrija os erros de email",
+  "globals.messages.coverImageUrl": "URL de imagem de capa",
+  "globals.messages.create": "Criar",
+  "globals.messages.currentlyOffline": "Estamos offline no momento",
+  "globals.messages.delete": "Excluir",
+  "globals.messages.deleteAll": "Excluir tudo",
+  "globals.messages.deletedSuccessfully": "Excluído com sucesso",
+  "globals.messages.disable": "Desabilitar",
+  "globals.messages.edit": "Editar",
+  "globals.messages.empty": "{name} vazio",
+  "globals.messages.enable": "Habilitar",
+  "globals.messages.errorAlreadyExists": "Já existe",
+  "globals.messages.errorSendingMessage": "Erro ao enviar mensagem",
+  "globals.messages.errorSendingPasswordResetEmail": "Erro ao enviar email de redefinição de senha",
+  "globals.messages.errorUpdatingConversation": "Erro ao atualizar conversa",
+  "globals.messages.errorUploadingFile": "Erro ao fazer upload de arquivo",
+  "globals.messages.false": "Falso",
+  "globals.messages.fileTypeisNotAnImage": "O tipo de arquivo não é uma imagem",
+  "globals.messages.goBack": "Voltar",
+  "globals.messages.golangDurationHoursMinutes": "Duração em horas ou minutos. Exemplo: 1h, 30m, 1h30m",
+  "globals.messages.gradientEnd": "Fim do gradiente",
+  "globals.messages.gradientStart": "Início do gradiente",
+  "globals.messages.headerTextColor": "Cor do texto do cabeçalho",
+  "globals.messages.hoursSinceCreated": "Horas desde criação",
+  "globals.messages.hoursSinceFirstReply": "Horas desde primeira resposta",
+  "globals.messages.hoursSinceLastReply": "Horas desde última resposta",
+  "globals.messages.hoursSinceResolved": "Horas desde resolução",
+  "globals.messages.import": "Importar",
+  "globals.messages.invite": "Convidar",
+  "globals.messages.lastUsed": "Último uso",
+  "globals.messages.linkUrl": "URL do link",
+  "globals.messages.markAllAsRead": "Marcar todos como lido",
+  "globals.messages.markAsRead": "Marcar como lido",
+  "globals.messages.markAsUnread": "Marcar como não lido",
+  "globals.messages.maxLength": "Deve ter no máximo {max} caracteres",
+  "globals.messages.mustBeNumber": "Deve ser um número",
+  "globals.messages.new": "Novo",
+  "globals.messages.no": "Não",
+  "globals.messages.noInternetConnection": "Sem conexão de internet",
+  "globals.messages.noMessagesYet": "Nenhuma mensagem ainda",
+  "globals.messages.noResultsFound": "Nenhum resultado encontrado",
+  "globals.messages.notAllowed": "Não permitido",
+  "globals.messages.notFound": "Não encontrado",
+  "globals.messages.options": "Opções",
+  "globals.messages.pageNofTotal": "Página {page} de {total}",
+  "globals.messages.pageNotFound": "Página não encontrada",
+  "globals.messages.pageTooLarge": "Tamanho da página é muito grande, deve ser no máximo {max}",
+  "globals.messages.pickDateAndTime": "Escolha data e hora",
+  "globals.messages.pleaseRateConversation": "Avalie esta conversa:",
+  "globals.messages.pleaseSelect": "Selecione {name} antes de enviar",
+  "globals.messages.pressEnterToSelectAValue": "Pressione Enter para selecionar um valor",
+  "globals.messages.reassigning": "Reatribuindo",
+  "globals.messages.regenerate": "Regenerar",
+  "globals.messages.replying": "Respondendo",
+  "globals.messages.required": "{name} Obrigatório",
+  "globals.messages.reset": "Redefinir",
+  "globals.messages.revoke": "Revogar",
+  "globals.messages.save": "Salvar",
+  "globals.messages.saveChanges": "Salvar alterações",
+  "globals.messages.savedSuccessfully": "Alterações salvas",
+  "globals.messages.saving": "Salvando...",
+  "globals.messages.selectAFutureTime": "Selecione um tempo futuro",
+  "globals.messages.selectTLS": "Selecione tipo TLS",
+  "globals.messages.send": "Enviar",
+  "globals.messages.sendUsMessage": "Envie-nos uma mensagem",
+  "globals.messages.sending": "Enviando...",
+  "globals.messages.setUp": "Configurar",
+  "globals.messages.somethingWentWrong": "Algo deu errado",
+  "globals.messages.startNewConversation": "Iniciar nova conversa",
+  "globals.messages.startTypingToSearch": "Comece a digitar para pesquisar...",
+  "globals.messages.strongPassword": "A senha deve ter entre {min} e {max} caracteres, deve conter pelo menos uma letra maiúscula, uma letra minúscula, um número e um caractere especial.",
+  "globals.messages.submit": "Enviar",
+  "globals.messages.submitFeedback": "É padrão",
+  "globals.messages.submitting": "Enviando...",
+  "globals.messages.thankYou": "Obrigado!",
+  "globals.messages.thankYouFeedback": "✅ Obrigado pelos seus comentários!",
+  "globals.messages.tooManyRequests": "Muitas solicitações.",
+  "globals.messages.true": "Verdadeiro",
+  "globals.messages.unblock": "Desbloquear",
+  "globals.messages.update": "Atualizar",
+  "globals.messages.upload": "Enviar",
+  "globals.messages.uploading": "Enviando",
+  "globals.messages.visibleWhen": "Visível quando",
+  "globals.messages.welcomeToLibredesk": "Bem-vindo ao Libredesk",
+  "globals.messages.wellBeBack": "Voltaremos {when}",
+  "globals.messages.yes": "Sim",
+  "globals.terms.account": "Conta | Contas",
+  "globals.terms.action": "Ações | Ações",
+  "globals.terms.active": "Ativo",
+  "globals.terms.activityLog": "Registro de atividade | Registros de Atividade",
+  "globals.terms.actor": "Ator | Atores",
+  "globals.terms.admin": "Administrador | Administradores",
+  "globals.terms.agent": "Agente | Agentes",
+  "globals.terms.alert": "Alerta | Alertas",
+  "globals.terms.announcement": "Anúncio | Anúncios",
+  "globals.terms.apiKey": "Chave de API | Chaves de API",
+  "globals.terms.appliesTo": "Aplicar para",
+  "globals.terms.ascending": "Ascendente",
+  "globals.terms.audio": "Áudio",
+  "globals.terms.automation": "Automação | Automações",
+  "globals.terms.availabilityStatus": "Status de disponibilidade",
+  "globals.terms.awaitingResponse": "Aguardando resposta",
+  "globals.terms.away": "Ausente | Ausente",
+  "globals.terms.awayReassigning": "Fora e reatribuindo",
+  "globals.terms.background": "Fundo",
+  "globals.terms.black": "Preto",
+  "globals.terms.body": "Corpo",
+  "globals.terms.brandName": "Nome da marca",
+  "globals.terms.businessHour": "Horário comercial | Horários comerciais",
+  "globals.terms.callbackURL": "URL de callback",
+  "globals.terms.category": "Categoria",
+  "globals.terms.channel": "Canal",
+  "globals.terms.clientID": "ID do cliente",
+  "globals.terms.clientSecret": "Segredo do cliente",
+  "globals.terms.closed": "Fechado",
+  "globals.terms.closedAt": "Fechado em",
+  "globals.terms.collapse": "Recolher",
+  "globals.terms.contact": "Contato | Contatos",
+  "globals.terms.content": "Conteúdo | Conteúdos",
+  "globals.terms.contextLink": "Link de contexto | Links de contexto",
+  "globals.terms.continue": "Continuar",
+  "globals.terms.conversation": "Conversa | Conversas",
+  "globals.terms.copy": "Copiar",
+  "globals.terms.country": "País",
+  "globals.terms.createdAt": "Criado em",
+  "globals.terms.createdOn": "Criado em",
+  "globals.terms.custom": "Personalizado",
+  "globals.terms.customAttribute": "Atributo personalizado | Atributos personalizados",
+  "globals.terms.date": "Data",
+  "globals.terms.day": "Dia | Dias",
+  "globals.terms.default": "Padrão",
+  "globals.terms.descending": "Descendente",
+  "globals.terms.description": "Descrição | Descrições",
+  "globals.terms.disabled": "Desabilitado",
+  "globals.terms.draft": "Rascunho",
+  "globals.terms.error": "Erro | Erros",
+  "globals.terms.event": "Evento | Eventos",
+  "globals.terms.excellent": "Excelente",
+  "globals.terms.expand": "Expandir",
+  "globals.terms.fair": "Justo",
+  "globals.terms.features": "Recursos",
+  "globals.terms.file": "Arquivo | Arquivos",
+  "globals.terms.filter": "Filtro | Filtros",
+  "globals.terms.firstName": "Primeiro nome | Primeiros nomes",
+  "globals.terms.firstReplyAt": "Primeira resposta em",
+  "globals.terms.fromEmailAddress": "Endereço de email de origem | Endereços de email de origem",
+  "globals.terms.general": "Geral",
+  "globals.terms.good": "Bom",
+  "globals.terms.gradient": "Gradiente",
+  "globals.terms.great": "Ótimo",
+  "globals.terms.home": "Inicio",
+  "globals.terms.homeScreen": "Tela inicial",
+  "globals.terms.homeScreenApp": "Aplicativo de tela inicial | Aplicativos de tela inicial",
+  "globals.terms.hour": "Hora | Horas",
+  "globals.terms.image": "Imagem | Imagens",
+  "globals.terms.import": "Importar | Importações",
+  "globals.terms.inactive": "Inativo | Inativos",
+  "globals.terms.inbox": "Caixa de entrada | Caixas de entrada",
+  "globals.terms.initiatedAt": "Iniciado em",
+  "globals.terms.integration": "Integração | Integrações",
+  "globals.terms.ipAddress": "Endereço IP | Endereços IP",
+  "globals.terms.isDefault": "É padrão",
+  "globals.terms.label": "Rótulo | Rótulos",
+  "globals.terms.language": "Idioma | Idiomas",
+  "globals.terms.lastActive": "Última atividade",
+  "globals.terms.lastLogin": "Último Login",
+  "globals.terms.lastName": "Sobrenome | Sobrenomes",
+  "globals.terms.lastReplyAt": "Última resposta em",
+  "globals.terms.lastUpdated": "Última atualização",
+  "globals.terms.learnMore": "Saiba mais",
+  "globals.terms.listValues": "Listar valores",
+  "globals.terms.liveChat": "Chat ao vivo",
+  "globals.terms.loadMore": "Carregar mais",
+  "globals.terms.loading": "Carregando...",
+  "globals.terms.logoUrl": "URL do logo",
+  "globals.terms.mention": "Menção | Menções",
+  "globals.terms.myInbox": "Minha Caixa de Entrada | Minhas Caixas de Entrada",
+  "globals.terms.name": "Nome | Nomes",
+  "globals.terms.none": "Nada",
+  "globals.terms.note": "Nota | Notas",
+  "globals.terms.notification": "Notificação | Notificações",
+  "globals.terms.off": "DESLIGADO",
+  "globals.terms.offline": "Desconectado | Desconectado",
+  "globals.terms.online": "Conectado | Conectado",
+  "globals.terms.open": "Abrir",
+  "globals.terms.openMenu": "Abrir menu",
+  "globals.terms.optional": "Opcional | Opcionais",
+  "globals.terms.overdue": "Atrasado",
+  "globals.terms.page": "Página | Páginas",
+  "globals.terms.password": "Senha | Senhas",
+  "globals.terms.pending": "Pendente",
+  "globals.terms.phoneNumber": "Número de telefone | Números de telefone",
+  "globals.terms.pickDate": "Escolha uma data",
+  "globals.terms.placeholder": "Espaço reservado | Espaços reservados",
+  "globals.terms.poor": "Ruim",
+  "globals.terms.port": "Porta | Portas",
+  "globals.terms.primaryColor": "Cor primária | Cores primárias",
+  "globals.terms.priority": "Prioridade | Prioridades",
+  "globals.terms.privateNote": "Nota privada | Notas privadas",
+  "globals.terms.productivity": "Produtividade",
+  "globals.terms.profile": "Perfil | Perfis",
+  "globals.terms.provider": "Provedor | Provedores",
+  "globals.terms.providerURL": "URL do provedor",
+  "globals.terms.reconnect": "Reconectar",
+  "globals.terms.referenceNumber": "Número de referência",
+  "globals.terms.regexHint": "Dica de regex",
+  "globals.terms.reply": "Resposta | Respostas",
+  "globals.terms.report": "Relatório | Relatórios",
+  "globals.terms.required": "Obrigatório",
+  "globals.terms.resolve": "Resolver",
+  "globals.terms.resolved": "Resolvido",
+  "globals.terms.resolvedAt": "Resolvido em",
+  "globals.terms.role": "Função | Funções",
+  "globals.terms.rootURL": "URL Raiz",
+  "globals.terms.search": "Buscar",
+  "globals.terms.secondaryColor": "Cor secundária | Cores secundárias",
+  "globals.terms.secret": "Segredo | Segredos",
+  "globals.terms.select": "Selecionar",
+  "globals.terms.sendWelcomeEmail": "Enviar email de boas-vindas? | Enviar emails de boas-vindas?",
+  "globals.terms.setPassword": "Definir senha | Definir senhas",
+  "globals.terms.sharedView": "Visualização compartilhada | Visualizações compartilhadas",
+  "globals.terms.slaMetric": "Métrica de SLA | Métricas de SLA",
+  "globals.terms.slaPolicy": "Política de SLA | Políticas de SLA",
+  "globals.terms.smtpHost": "Host SMTP | Hosts SMTP",
+  "globals.terms.smtpPort": "Porta SMTP | Portas SMTP",
+  "globals.terms.snooze": "Pausar",
+  "globals.terms.snoozed": "Pausado",
+  "globals.terms.solid": "Sólido",
+  "globals.terms.someone": "Alguém",
+  "globals.terms.status": "Estado | Estados",
+  "globals.terms.subject": "Assunto | Assuntos",
+  "globals.terms.tag": "Etiqueta | Etiquetas",
+  "globals.terms.team": "Time | Time",
+  "globals.terms.teamInbox": "Caixa de entrada da equipe | Caixas de entrada da equipe",
+  "globals.terms.teammate": "Membro da Equipe | Membros da Equipe",
+  "globals.terms.tellUsMore": "Diga-nos mais...",
+  "globals.terms.template": "Modelo | Modelos",
+  "globals.terms.tenantID": "ID de inquilino",
+  "globals.terms.time": "Hora",
+  "globals.terms.timestamp": "Carimbo de data/hora | Carimbos de data/hora",
+  "globals.terms.timezone": "Fuso horário | Fusos horários",
+  "globals.terms.title": "Título | Títulos",
+  "globals.terms.today": "Hoje",
+  "globals.terms.tryAgain": "Tente novamente",
+  "globals.terms.type": "Tipo | Tipos",
+  "globals.terms.typeMessage": "Digite sua mensagem...",
+  "globals.terms.unAuthorized": "Não autorizado",
+  "globals.terms.unassigned": "Não atribuída",
+  "globals.terms.updatedAt": "Atualizado em",
+  "globals.terms.usage": "Uso",
+  "globals.terms.username": "Nome de usuário | Nomes de usuário",
+  "globals.terms.users": "Usuários",
+  "globals.terms.value": "Valor | Valores",
+  "globals.terms.video": "Vídeo | Vídeos",
+  "globals.terms.view": "Visualizar | Exibições",
+  "globals.terms.visibility": "Visível | Visíveis",
+  "globals.terms.visitor": "Visitante | Visitantes",
+  "globals.terms.waiting": "Aguardando",
+  "globals.terms.warning": "Aviso | Avisos",
+  "globals.terms.week": "Semana | Semanas",
+  "globals.terms.white": "Branco",
+  "globals.terms.you": "Você",
+  "importer.agentCaseSensitiveNote": "Papéis e equipes devem corresponder exatamente (sensível a maiúsculas)",
+  "importer.createdAgent": "Linha {row}: Agente criado {name} ({email})",
+  "importer.createdTag": "Linha {row}: Etiqueta criada \"{name}\"",
+  "importer.emailExists": "Linha {row} ({email}): Erro - email já existe",
+  "importer.errorAssigningTeams": "Linha {row} ({email}): Erro - atribuição de equipe falhou: {error}",
+  "importer.errorCreating": "Linha {row} ({email}): Erro - falha ao criar agente: {error}",
+  "importer.errorCreatingTag": "Linha {row} ({name}): Erro - falha ao criar etiqueta: {error}",
+  "importer.importAlreadyInProgress": "Importação já em andamento",
+  "importer.importComplete": "Importação concluída: {success} de {total} bem-sucedidos, {errors} falharam",
+  "importer.invalidEmail": "Linha {row}: Erro - formato de email inválido: {email}",
+  "importer.invalidRoles": "Linha {row} ({email}): Erro - cargo(s) inválido(s): {roles}",
+  "importer.invalidTeams": "Linha {row} ({email}): Erro - equipe(s) inválida(s): {teams}",
+  "importer.missingFields": "Linha {row}: Erro - campos obrigatórios ausentes: {fields}",
+  "importer.requiredCSVFormat": "Formato CSV obrigatório",
+  "importer.roleRequired": "Linha {row} ({email}): Erro - pelo menos um papel obrigatório",
+  "importer.startingImport": "Iniciando importação de {count} {type}",
+  "importer.tagExists": "Linha {row}: Erro - etiqueta já existe: \"{name}\"",
+  "inbox.edit": "Editar caixa de entrada",
+  "inbox.emptyIMAP": "Configuração IMAP vazia",
+  "inbox.emptySMTP": "Configuração SMTP vazia",
+  "inbox.newInbox": "Nova caixa de entrada",
+  "inbox.oauthAlreadyExists": "Uma caixa de entrada com este email já existe. Use Reconectar para atualizar as credenciais.",
+  "inbox.oauthEmailMismatch": "O email autorizado não corresponde a esta caixa de entrada. Autorize com a conta correta.",
+  "inbox.oauthNotFound": "Nenhuma caixa de entrada encontrada com este email para reconectar.",
+  "macro.actionNotAllowed": "Ação {name} não permitida",
+  "macro.actionType": "Tipo de ação",
+  "macro.applied": "Macro aplicada",
+  "macro.couldNotApply": "Não foi possível aplicar macro",
+  "macro.duplicateActionsNotAllowed": "Ações duplicadas não permitidas",
+  "macro.editMacro": "Editar macro",
+  "macro.new": "Nova macro",
+  "macro.partiallyApplied": "Macro parcialmente aplicada",
+  "macro.permissionDenied": "Permissão negada para algumas ações de macro",
+  "media.fileEmpty": "Este arquivo tem 0 bytes, portanto não será anexado.",
+  "media.fileSizeTooLarge": "Tamanho de arquivo muito grande, por favor, envie um arquivo menor que {size} ",
+  "media.fileTypeNotAllowed": "Tipo de arquivo não permitido",
+  "media.invalidOrExpiredURL": "URL de mídia inválida ou expirada",
+  "navigation.away": "Fora",
+  "navigation.darkMode": "Modo escuro",
+  "navigation.logout": "Sair",
+  "navigation.reassignReplies": "Reatribuir respostas",
+  "notification.conversationAssigned": "Conversa atribuída a você #{referenceNumber}",
+  "notification.mentionedInConversation": "{author} mencionou você em #{referenceNumber}",
+  "notification.slaAlert": "SLA {type}: {metric} para #{referenceNumber}",
+  "notification.slaDueIn": "Vencimento em {duration}",
+  "notification.slaOverdue": "Vencido por {duration}",
+  "oidc.edit": "Editar SSO",
+  "oidc.new": "Novo SSO",
+  "placeholders.chatIntroduction": "Pergunte qualquer coisa ou compartilhe seus comentários.",
+  "placeholders.enterUrl": "Digite URL",
+  "placeholders.fieldLabel": "Rótulo do campo",
+  "placeholders.fieldPlaceholder": "Espaço reservado do campo",
+  "placeholders.greetingMessage": "Bem-vindo! Como podemos ajudá-lo?",
+  "placeholders.introductionMessage": "Estamos aqui para ajudar!",
+  "placeholders.linkText": "Texto do link",
+  "placeholders.noticeBannerText": "Nossos tempos de resposta são mais lentos do que o normal. Estamos trabalhando duro para chegar à sua mensagem.",
+  "placeholders.selectAction": "Selecionar ação",
+  "placeholders.selectAgent": "Selecionar agente",
+  "placeholders.selectCsvFile": "Selecionar arquivo CSV",
+  "placeholders.selectEvents": "Selecionar eventos",
+  "placeholders.selectField": "Selecionar campo",
+  "placeholders.selectInbox": "Selecionar caixa de entrada",
+  "placeholders.selectPriority": "Selecionar prioridade",
+  "placeholders.selectProtocol": "Selecionar protocolo",
+  "placeholders.selectProvider": "Selecione o provedor",
+  "placeholders.selectTags": "Selecionar etiquetas",
+  "placeholders.selectTeam": "Selecione a equipe",
+  "placeholders.selectTeams": "Selecionar equipes",
+  "placeholders.selectType": "Selecionar tipo",
+  "placeholders.selectValue": "Selecionar valor",
+  "placeholders.startConversation": "Iniciar conversa",
+  "placeholders.tellUsAboutYourself": "Fale sobre você",
+  "replyBox.bcc": "CCO",
+  "replyBox.contactEmailMissing": "E-mail do contato não se encontra nos destinatários",
+  "replyBox.contactEmailMissingDescription": "O e-mail do contato ({email}) não está incluído em, cc, ou cco. O contato não receberá esta resposta.",
+  "replyBox.emailAddresess": "Endereços de e-mail separados por vírgula",
+  "replyBox.invalidEmailsIn": "E-mail(s) inválidos em",
+  "replyBox.missingTagsDescription": "Esta conversa não tem etiquetas. A marcação ajuda com relatórios e triagem. Você ainda pode enviar sem a marcação.",
+  "replyBox.missingTagsTitle": "Nenhuma etiqueta nesta conversa",
+  "replyBox.removeBCC": "Remover CCO",
+  "replyBox.sendAnyway": "Enviar mesmo assim",
+  "replyBox.toRequired": "Pelo menos um destinatário é obrigatório no campo \"Para\".",
+  "report.chart.newConversations": "Nova conversa",
+  "report.chart.resolvedConversations": "Conversas resolvidas",
+  "report.csat.avgRating": "Avaliação Média",
+  "report.csat.responseRate": "Taxa de resposta",
+  "report.csat.responses": "Respostas",
+  "report.messages.incoming": "Entrada",
+  "report.messages.outgoing": "Saída",
+  "report.messages.perConversation": "Por Conversa",
+  "report.noTagsFound": "Nenhuma etiqueta encontrada",
+  "report.sla.avgFirstResp": "Tempo médio de primeira resposta",
+  "report.sla.avgNextResp": "Tempo médio de próxima resposta",
+  "report.sla.avgResolution": "Tempo médio de resolução",
+  "report.sla.breached": "Violado",
+  "report.sla.compliance": "Conformidade",
+  "report.sla.firstResponse": "Primeira resposta",
+  "report.sla.met": "Cumprido",
+  "report.sla.nextResponse": "Próxima resposta",
+  "report.sla.resolution": "Resolução",
+  "report.tags.tagged": "Etiquetas principais",
+  "role.deletionConfirmation": "Esta ação não pode ser desfeita. Isso excluirá permanentemente este papel.",
+  "role.edit": "Editar papel",
+  "role.new": "Novo papel",
+  "role.select": "Selecionar papéis",
+  "search.adjustSearchTerms": "Tente ajustar seus termos ou filtros de pesquisa.",
+  "search.minQueryLength": " Digite pelo menos {length} caracteres para pesquisar.",
+  "search.noResultsForQuery": "Nenhum resultado encontrado para a consulta `{query}`. Tente um termo de pesquisa diferente.",
+  "search.searchBy": "Pesquise por número de referência, email do contato ou mensagens em conversas.",
+  "setup.completeYourSetup": "Conclua sua configuração",
+  "setup.createFirstInbox": "Crie sua primeira caixa de entrada",
+  "setup.inviteTeammates": "Convidar colegas de equipe",
+  "sharedView.allAgents": "Todos os agentes",
+  "sharedView.editSharedView": "Editar visualização compartilhada",
+  "sharedView.new": "Nova visualização compartilhada",
+  "sla.deletionConfirmation": "Esta ação não pode ser desfeita. Isso excluirá permanentemente esta política de SLA.",
+  "sla.edit": "Editar política de SLA",
+  "sla.enterDuration": "Digite duração",
+  "sla.firstResponseTimeAfterResolution": "O tempo de primeira resposta não pode ser após o tempo de resolução",
+  "sla.met": "SLA cumprido",
+  "sla.minimumDurationOneMinute": "A duração deve ser de pelo menos 1 minuto.",
+  "sla.new": "Nova política de SLA",
+  "sla.overdueBy": "Atrasado por",
+  "sla.selectMetric": "Selecionar métrica de SLA",
+  "status.deletionConfirmation": "Esta ação não pode ser desfeita. Isso excluirá permanentemente este status.",
+  "status.deniedPermission": "Permissão negada",
+  "status.disabledFileUpload": "Upload de arquivo está desabilitado",
+  "status.disabledInbox": "Caixa de entrada está desabilitada",
+  "status.edit": "Editar status",
+  "status.new": "Novo status",
+  "tag.edit": "Editar etiqueta",
+  "tag.new": "Nova etiqueta",
+  "team.edit": "Editar equipe",
+  "team.new": "Nova equipe",
+  "template.cannotDeleteBuiltInTemplate": "Não é possível excluir modelo integrado",
+  "template.defaultTemplateAlreadyExists": "Modelo padrão já existe",
+  "template.deletionConfirmation": "Esta ação não pode ser desfeita. Isso excluirá permanentemente este modelo.",
+  "template.edit": "Editar modelo",
+  "template.new": "Novo modelo",
+  "toast.apiKeyGenerated": "Chave de API gerada",
+  "toast.authorizationDenied": "Autorização negada",
+  "toast.avatarUpdated": "Avatar atualizado com sucesso",
+  "toast.errorConnectingInbox": "Erro ao conectar caixa de entrada",
+  "toast.inboxConnected": "Caixa de entrada conectada com sucesso",
+  "toast.inboxReconnected": "Caixa de entrada reconectada com sucesso",
+  "toast.noNotificationsFound": "Nenhuma notificação encontrada",
+  "update.newUpdateAvailable": "Uma nova atualização está disponível",
+  "user.accountDisabled": "Sua conta está desabilitada, por favor contate o administrador",
+  "user.cannotDeleteSystemUser": "Não é possível excluir usuário do sistema",
+  "user.invalidEmailPassword": "Email ou senha inválidos.",
+  "user.resetPasswordTokenExpired": "Token é inválido ou expirado, tente novamente solicitando um novo link de redefinição de senha",
+  "user.sameEmailAlreadyExists": "Usuário com o mesmo email já existe",
+  "user.userAlreadyLoggedIn": "Usuário já fez login",
+  "user.userCannotDeleteSelf": "Você não pode se excluir",
+  "validation.invalid": "Inválido",
+  "validation.invalidColor": "Cor inválida",
+  "validation.invalidCredential": "Credencial inválida",
+  "validation.invalidCsvFile": "Arquivo CSV inválido",
+  "validation.invalidDomain": "Domínio inválido: {domain}. Digite apenas nomes de domínio (por exemplo example.com), sem protocolo ou caminhos.",
+  "validation.invalidDuration": "Formato de duração inválido. Use um formato válido (por exemplo 30m, 1h, 48h).",
+  "validation.invalidEmail": "Endereço de email inválido",
+  "validation.invalidFromAddress": "Formato de endereço de email de origem inválido, certifique-se de que é um endereço de email válido no formato `Nome <mail@example.com>`",
+  "validation.invalidIPOrCIDR": "Endereço IP ou intervalo CIDR inválido: {entry}",
+  "validation.invalidInbox": "Caixa de entrada inválida",
+  "validation.invalidKey": "Chave inválida",
+  "validation.invalidPermission": "Permissão inválida",
+  "validation.invalidPortValue": "Valor de porta inválido",
+  "validation.invalidSnoozeDuration": "Duração de pausa inválida",
+  "validation.invalidTimeFormat": "Formato de hora inválido (HH:mm)",
+  "validation.invalidUrl": "URL inválida",
+  "validation.invalidUser": "Usuário inválido",
+  "validation.invalidValue": "Valor inválido",
+  "validation.messageCannotBeEmpty": "A mensagem não pode estar vazia",
+  "validation.minDuration": "{name} deve ter pelo menos {min}.",
+  "validation.minmax": "Deve ter entre {min} e {max} caracteres",
+  "validation.minmaxNumber": "Deve estar entre {min} e {max}",
+  "validation.notFoundConversation": "Conversa não encontrada",
+  "validation.notFoundCsatSurvey": "Pesquisa CSAT não encontrada",
+  "validation.notFoundCustomAttribute": "Atributo personalizado não encontrado",
+  "validation.notFoundFile": "Arquivo não encontrado",
+  "validation.notFoundImport": "Importação não encontrada",
+  "validation.notFoundInbox": "Caixa de entrada não encontrada",
+  "validation.notFoundMacro": "Macro não encontrada",
+  "validation.notFoundMedia": "Recurso não encontrado",
+  "validation.notFoundOidcProvider": "Provedor OIDC não encontrado",
+  "validation.notFoundProvider": "Provedor não encontrado",
+  "validation.notFoundRole": "Papel não encontrado",
+  "validation.notFoundRule": "Regra não encontrada",
+  "validation.notFoundSla": "SLA não encontrado",
+  "validation.notFoundTeam": "Equipe não encontrada",
+  "validation.notFoundTemplate": "Modelo não encontrado",
+  "validation.notFoundUser": "Usuário não encontrado",
+  "validation.notFoundView": "Visualização não encontrada",
+  "validation.passwordCannotBeEmpty": "A senha não pode estar vazia",
+  "validation.selectAtLeastOneEvent": "Selecione pelo menos um evento",
+  "validation.selectAtLeastOneRecipient": "Selecione pelo menos um destinatário",
+  "validation.selectAtLeastOneRole": "Selecione pelo menos um papel",
+  "validation.subjectCannotBeEmpty": "O assunto não pode estar vazio",
+  "validation.tooLongStatus": "Status é muito longo, deve ter no máximo {max} caracteres",
+  "view.form.description": "Crie e salve visualizações de filtro personalizado para acesso rápido a suas conversas.",
+  "view.form.filter.selectAtLeastOne": "Selecione pelo menos um filtro.",
+  "view.form.filters.description": "Defina um ou mais filtros para personalizar a visualização.",
+  "view.form.name.description": "Introduza um nome único para a sua visualização.",
+  "webhook.edit": "Editar webhook",
+  "webhook.new": "Novo webhook",
+  "webhook.sendTest": "Enviar teste",
+  "webhook.sentSuccessfully": "Webhook enviado com sucesso",
+  "widget.conversationClosed": "Esta conversa foi encerrada",
+  "widget.ipBlocked": "Acesso negado",
+  "widget.prechatForm.startChat": "Iniciar chat"
+}
diff --git a/i18n/zh-CN.json b/i18n/zh-CN.json
index eb804542..a4534a3a 100644
--- a/i18n/zh-CN.json
+++ b/i18n/zh-CN.json
@@ -1,13 +1,11 @@
 {
   "_.code": "zh-CN",
-  "_.name": "简体中文",
+  "_.name": "简体中文（中国大陆）",
   "account.avatarRemoved": "已移除头像",
   "account.changeAvatar": "在此更改您的头像。",
-  "account.chooseAFile": "选择文件...",
   "account.cropAvatar": "裁剪头像",
   "account.editProfile": "编辑个人资料",
   "account.publicAvatar": "公共头像",
-  "account.removeAvatar": "移除头像",
   "actions.addAction": "添加操作",
   "actions.addCondition": "添加条件",
   "actions.addTags": "添加标签",
@@ -92,7 +90,6 @@
   "admin.conversationStatus.category.placeholder": "选择类别",
   "admin.conversationStatus.name.description": "设置状态名称。完成后点击保存。",
   "admin.conversationTags.edit.description": "更改标签名称。完成后点击保存。",
-  "admin.conversationTags.name.valid": "标签名称至少需要 3 个字符",
   "admin.conversationTags.new.description": "设置标签名称。完成后点击保存。",
   "admin.customAttribute.help": "自定义属性帮助您设置关于联系人或会话的额外详细信息，例如订阅计划或首次购买日期。",
   "admin.customAttributes.keyNotAllowed": "提供的键不允许，因为它与默认属性冲突。请使用不同的键。",
@@ -114,6 +111,7 @@
   "admin.general.rootURL.valid": "Root URL 应为有效 URL",
   "admin.general.siteName": "站点名称",
   "admin.general.siteName.min": "站点名称至少需要 1 个字符",
+  "admin.general.showConversationSubject": "在对话列表中显示主题",
   "admin.general.timezone.placeholder": "选择时区",
   "admin.inbox.authProtocol": "认证协议",
   "admin.inbox.authProtocol.description": "要使用的认证协议。",
@@ -206,7 +204,6 @@
   "admin.inbox.livechat.noticeBanner.enabled": "启用通知横幅",
   "admin.inbox.livechat.noticeBanner.text": "通知横幅文本",
   "admin.inbox.livechat.officeHours": "办公时间",
-  "admin.inbox.livechat.prechatForm.addField": "添加字段",
   "admin.inbox.livechat.prechatForm.availableFields": "可用的自定义属性",
   "admin.inbox.livechat.prechatForm.enabled": "启用聊天前表单",
   "admin.inbox.livechat.prechatForm.enabled.description": "在聊天开始前显示一个收集信息的表单",
@@ -218,8 +215,11 @@
   "admin.inbox.livechat.preventMultipleConversations.visitors.description": "防止访客同时发起多个会话",
   "admin.inbox.livechat.preventReplyToClosedConversation": "禁止回复已关闭的会话",
   "admin.inbox.livechat.preventReplyToClosedConversation.description": "启用后，用户无法回复已关闭的会话",
+  "admin.inbox.livechat.preview": "预览",
+  "admin.inbox.livechat.preview.sampleUserMessage": "你好！我如何开始？",
   "admin.inbox.livechat.secretKey": "密钥",
   "admin.inbox.livechat.secretKey.description": "设置密钥以保护聊天小部件。",
+  "admin.inbox.livechat.secretKey.weak": "此密钥很短，会削弱 JWT 的签名。使用至少 32 个随机字符。",
   "admin.inbox.livechat.sessionDuration.description": "已认证用户会话保持活动状态的时间。会话在活动时自动延长。最短 1 小时。示例：24h、168h、720h、2160h。",
   "admin.inbox.livechat.sessionDuration.label": "已认证用户会话时长",
   "admin.inbox.livechat.showOfficeHoursAfterAssignment": "在团队分配后显示办公时间",
@@ -268,6 +268,10 @@
   "admin.inbox.replyToAddress": "回复地址（可选）",
   "admin.inbox.replyToAddress.description": "客户回复发送到的地址。仅在 SMTP 发件人和 IMAP 邮箱位于不同域时需要。",
   "admin.inbox.replyToAddress.placeholder": "support{'@'}example.com",
+  "admin.inbox.fromNameTemplate": "来自显示名称模板（可选）",
+  "admin.inbox.fromNameTemplate.description": "显示发送电子邮件回复的名称。留空则使用来自地址的名称。",
+  "admin.inbox.fromNameTemplate.variables": "变量: {'{{ .Agent.FirstName }}'}, {'{{ .Agent.LastName }}'}, {'{{ .Agent.FullName }}'}, {'{{ .Inbox.Name }}'}.",
+  "admin.inbox.fromNameTemplate.invalidTemplate": "无效的模板。只能使用支持的变量和花括号。",
   "admin.inbox.skipTLSVerification": "跳过 TLS 验证",
   "admin.inbox.skipTLSVerification.description": "跳过 TLS 证书上的主机名检查。",
   "admin.inbox.smtpConfig": "SMTP 配置",
@@ -390,9 +394,6 @@
   "agent.generateApiKey": "生成 API 密钥",
   "agent.new": "新建客服",
   "agent.selectAvailabilityStatus": "选择可用性状态",
-  "ai.apiKey.description": "{provider} API 密钥未设置或无效。请输入有效的 API 密钥以使用 AI 功能。",
-  "ai.apiKeyNotSet": "{provider} API 密钥未设置。请让您的管理员进行设置",
-  "ai.enterOpenAIAPIKey": "输入 OpenAI API 密钥",
   "auth.backToLogin": "返回登录",
   "auth.checkEmailForReset": "查看您的电子邮件中的密码重置链接。",
   "auth.confirmPassword": "确认密码",
@@ -473,13 +474,18 @@
   "contextLink.urlTemplateHelp": "{'{{token}}'} 是一个 base64 编码的 AES-256-GCM 加密 blob，包含所有联系人和客服字段（需要密钥）。独立变量如 {'{{email}}'}、{'{{phone}}'}、{'{{external_user_id}}'}、{'{{contact_id}}'}、{'{{first_name}}'}、{'{{last_name}}'}、{'{{conversation_uuid}}'} 以纯文本形式传递。",
   "conversation.agentAssigned": "客服已分配",
   "conversation.allLoaded": "所有会话已加载",
+  "conversation.assignSelfAction": "分配给我",
+  "conversation.assignSelfPrompt": "此对话没有分配给任何人。",
   "conversation.bulkActions.clearSelection": "清除选择",
   "conversation.bulkActions.failedToast": "某些会话无法更新",
   "conversation.bulkActions.selectAll": "选择所有会话",
   "conversation.bulkActions.selectConversation": "选择会话",
+  "conversation.bulkActions.selected": "没有选择对话 | 已选择 {count} 个 | 已选择 {count} 个",
   "conversation.bulkActions.successToast": "会话已更新",
   "conversation.bulkActions.toolbar": "批量操作工具栏",
   "conversation.couldNotFetch": "无法获取会话",
+  "conversation.downloadTranscript": "下载脚本",
+  "conversation.deletePrivateNote": "删除备注",
   "conversation.hideQuotedText": "隐藏引用文本",
   "conversation.mentions": "提及",
   "conversation.myInbox": "我的收件箱",
@@ -532,6 +538,8 @@
   "errors.canOnlyDeleteOwnNote": "您只能删除自己的备注",
   "errors.parsingRequest": "解析请求出错",
   "filter.add": "添加筛选器",
+  "filter.addGroup": "添加分组",
+  "filter.removeGroup": "删除分组",
   "globals.messages.add": "添加",
   "globals.messages.addAnnouncement": "添加公告",
   "globals.messages.addEmoji": "添加表情符号",
@@ -624,8 +632,8 @@
   "globals.messages.sendUsMessage": "给我们发送消息",
   "globals.messages.sending": "正在发送...",
   "globals.messages.setUp": "设置",
-  "globals.messages.smallScreenDescription": "Libredesk 适用于较大的屏幕。为获得最佳体验，请使用桌面电脑或平板电脑。",
-  "globals.messages.smallScreenTitle": "切换到桌面电脑以获得最佳体验",
+  "globals.messages.showLess": "显示更少",
+  "globals.messages.showMore": "显示更多",
   "globals.messages.somethingWentWrong": "出了点问题",
   "globals.messages.startNewConversation": "开始新会话",
   "globals.messages.startTypingToSearch": "开始输入以搜索...",
@@ -657,6 +665,7 @@
   "globals.terms.apiKey": "API 密钥 | API 密钥",
   "globals.terms.appliesTo": "适用于",
   "globals.terms.ascending": "升序",
+  "globals.terms.attachment": "附件 | 附件",
   "globals.terms.audio": "音频",
   "globals.terms.automation": "自动化 | 自动化",
   "globals.terms.availabilityStatus": "可用性状态",
@@ -666,6 +675,7 @@
   "globals.terms.background": "背景",
   "globals.terms.beta": "测试版",
   "globals.terms.black": "黑色",
+  "globals.terms.bold": "粗体",
   "globals.terms.body": "正文",
   "globals.terms.brandName": "品牌名称",
   "globals.terms.businessHour": "工作时间 | 工作时间",
@@ -678,6 +688,8 @@
   "globals.terms.closedAt": "关闭于",
   "globals.terms.collapse": "折叠",
   "globals.terms.contact": "联系人 | 联系人",
+  "globals.terms.contactEmail": "联系人邮箱",
+  "globals.terms.contactExternalId": "联系人外部 ID",
   "globals.terms.content": "内容 | 内容",
   "globals.terms.contextLink": "侧边栏应用 | 侧边栏应用",
   "globals.terms.continue": "继续",
@@ -695,6 +707,7 @@
   "globals.terms.description": "描述 | 描述",
   "globals.terms.disabled": "已禁用",
   "globals.terms.download": "下载",
+  "globals.terms.downloadedAt": "下载于",
   "globals.terms.draft": "草稿",
   "globals.terms.email": "电子邮件 | 电子邮件",
   "globals.terms.enabled": "已启用",
@@ -728,10 +741,12 @@
   "globals.terms.integration": "集成 | 集成",
   "globals.terms.ipAddress": "IP 地址 | IP 地址",
   "globals.terms.isDefault": "默认",
+  "globals.terms.italic": "斜体",
   "globals.terms.key": "键 | 键",
   "globals.terms.label": "标签 | 标签",
   "globals.terms.language": "语言 | 语言",
   "globals.terms.lastActive": "最后活跃",
+  "globals.terms.lastInteractionAt": "最后一次互动于",
   "globals.terms.lastLogin": "最后登录",
   "globals.terms.lastMessageAt": "最后消息于",
   "globals.terms.lastName": "姓 | 姓",
@@ -750,6 +765,7 @@
   "globals.terms.microsoft": "Microsoft",
   "globals.terms.myInbox": "我的收件箱 | 我的收件箱",
   "globals.terms.name": "名称 | 名称",
+  "globals.terms.nextSlaDeadline": "下一个 SLA 截止日期",
   "globals.terms.none": "无",
   "globals.terms.note": "备注 | 备注",
   "globals.terms.notification": "通知 | 通知",
@@ -828,7 +844,7 @@
   "globals.terms.tryAgain": "重试",
   "globals.terms.type": "类型 | 类型",
   "globals.terms.typeMessage": "输入您的消息...",
-  "globals.terms.typing": "正在输入中……",
+  "globals.terms.typing": "正在输入...",
   "globals.terms.unAuthorized": "未授权",
   "globals.terms.unassigned": "未分配",
   "globals.terms.updatedAt": "更新于",
@@ -847,6 +863,7 @@
   "globals.terms.week": "周 | 周",
   "globals.terms.white": "白色",
   "globals.terms.workspace": "工作区",
+  "globals.terms.yesterday": "昨天",
   "globals.terms.you": "您",
   "imageLightbox.next": "下一张图片",
   "imageLightbox.previous": "上一张图片",
@@ -893,6 +910,7 @@
   "media.invalidOrExpiredURL": "媒体 URL 无效或已过期",
   "navigation.away": "离开",
   "navigation.darkMode": "深色模式",
+  "navigation.keyboardShortcuts": "键盘快捷键",
   "navigation.logout": "登出",
   "navigation.reassignReplies": "重新分配回复",
   "notification.conversationAssigned": "会话已分配给您 #{referenceNumber}",
@@ -937,33 +955,27 @@
   "replyBox.missingTagsTitle": "此会话没有标签",
   "replyBox.removeBCC": "移除密送",
   "replyBox.sendAnyway": "仍然发送",
+  "replyBox.sendAndSetAs": "发送并设置为",
   "replyBox.toRequired": "收件人字段中至少需要一个收件人。",
-  "report.agentStatus": "客服状态",
   "report.chart.newConversations": "新会话",
   "report.chart.resolvedConversations": "已解决会话",
-  "report.chart.title": "会话趋势",
   "report.csat.avgRating": "平均评分",
-  "report.csat.cardTitle": "客户满意度（最近 {days} 天）",
   "report.csat.responseRate": "回复率",
   "report.csat.responses": "回复数",
-  "report.messages.cardTitle": "消息量（最近 {days} 天）",
   "report.messages.incoming": "收到的",
   "report.messages.outgoing": "发出的",
   "report.messages.perConversation": "每会话",
   "report.messages.total": "总计",
   "report.noTagsFound": "未找到标签",
-  "report.openConversations": "打开的会话",
   "report.sla.avgFirstResp": "平均首次响应时间",
   "report.sla.avgNextResp": "平均下次响应时间",
   "report.sla.avgResolution": "平均解决时间",
   "report.sla.breached": "已违规",
-  "report.sla.cardTitle": "SLA 表现（最近 {days} 天）",
   "report.sla.compliance": "合规率",
   "report.sla.firstResponse": "首次响应",
   "report.sla.met": "达标",
   "report.sla.nextResponse": "下次响应",
   "report.sla.resolution": "解决",
-  "report.tags.cardTitle": "标签分布（最近 {days} 天）",
   "report.tags.tagged": "已标记",
   "report.tags.topTags": "热门标签",
   "role.deletionConfirmation": "此操作无法撤消。这将永久删除此角色。",
@@ -980,6 +992,8 @@
   "sharedView.allAgents": "所有客服",
   "sharedView.editSharedView": "编辑共享视图",
   "sharedView.new": "新建共享视图",
+  "shortcuts.openCommandBar": "打开命令栏",
+  "shortcuts.replyEditor": "回复编辑器",
   "sla.deletionConfirmation": "此操作无法撤消。这将永久删除此 SLA 策略。",
   "sla.edit": "编辑 SLA 策略",
   "sla.enterDuration": "输入时长",
@@ -1031,8 +1045,8 @@
   "validation.invalidInbox": "无效收件箱",
   "validation.invalidKey": "无效键",
   "validation.invalidPermission": "无效权限",
+  "validation.invalidPhone": "无效的手机号码",
   "validation.invalidPortValue": "无效端口值",
-  "validation.invalidProvider": "无效提供商",
   "validation.invalidSnoozeDuration": "无效的暂停时长",
   "validation.invalidTimeFormat": "无效的时间格式（HH:mm）",
   "validation.invalidUrl": "无效 URL",
@@ -1066,11 +1080,10 @@
   "validation.subjectCannotBeEmpty": "主题不能为空",
   "validation.tooLongStatus": "状态太长，最多 {max} 个字符",
   "view.form.description": "创建并保存自定义筛选视图，以便快速访问您的会话。",
-  "view.form.filter.partiallyFilled": "请确保您已正确填写筛选字段。",
   "view.form.filter.selectAtLeastOne": "至少选择一个筛选条件。",
   "view.form.filters.description": "设置一个或多个筛选条件以自定义视图。",
   "view.form.name.description": "为您的视图输入唯一的名称。",
-  "view.form.name.length": "视图名称应在 2 到 30 个字符之间。",
+  "view.form.name.length": "视图名称应该介于 2 到 140 个字符之间。",
   "webhook.edit": "编辑 Webhook",
   "webhook.new": "新建 Webhook",
   "webhook.sendTest": "发送测试",

From 9c0d242549dea5c136002f5f5c02a6b0d7a5501a Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 2 Sep 2026 15:44:27 +0530
Subject: [PATCH 025/178] rebuild the command palette and add keyboard
 shortcuts for conversation actions

---
 cmd/conversation.go                           |   2 +-
 frontend/apps/main/src/App.vue                |  44 +-
 .../components/KeyboardShortcutsDialog.vue    |  23 +-
 .../components/editor/ConversationEditor.vue  |   9 +-
 .../src/components/editor/useTextEditor.js    |  12 +
 .../main/src/components/sidebar/Sidebar.vue   | 121 +---
 .../src/components/sidebar/SidebarNavUser.vue |   8 +-
 .../main/src/composables/useBulkActions.js    |  58 ++
 .../src/composables/useInboxNavigation.js     |  28 +
 .../composables/useKeyboardShortcutsDialog.js |  10 +
 .../apps/main/src/constants/emitterEvents.js  |  24 +-
 frontend/apps/main/src/constants/navIcons.js  |  62 ++
 .../apps/main/src/constants/navigation.js     |  15 +
 .../main/src/features/command/CommandBox.vue  | 680 ++++++------------
 .../main/src/features/command/MacroPicker.vue | 190 +++++
 .../src/features/command/SnoozeDatePicker.vue |  96 +++
 .../command/providers/useAccountCommands.js   |  79 ++
 .../command/providers/useBulkCommands.js      | 121 ++++
 .../command/providers/useContactCommands.js   |  79 ++
 .../providers/useConversationCommands.js      | 438 +++++++++++
 .../command/providers/useCreateCommands.js    |  53 ++
 .../command/providers/useEntitySearch.js      |  53 ++
 .../command/providers/useListCommands.js      |  88 +++
 .../providers/useNavigationCommands.js        | 135 ++++
 .../main/src/features/command/sections.js     |  45 ++
 .../src/features/command/useCommandPalette.js |  51 ++
 .../features/command/useCommandRegistry.js    |  52 ++
 .../command/useCommandRegistry.test.js        |  79 ++
 .../features/command/useGlobalShortcuts.js    | 117 +++
 .../src/features/contact/ContactNotes.vue     |  11 +-
 .../features/conversation/Conversation.vue    |  21 +-
 .../conversation/CreateConversation.vue       |  16 +-
 .../src/features/conversation/ReplyBox.vue    |  11 +
 .../features/conversation/ReplyBoxContent.vue |   6 +
 .../list/ConversationBulkActionToolbar.vue    |  51 +-
 .../sidebar/ConversationSideBar.vue           |  11 +-
 frontend/apps/main/src/stores/contact.js      |  17 +
 frontend/apps/main/src/stores/conversation.js |   1 +
 frontend/apps/main/src/stores/view.js         |  25 +
 .../src/views/contact/ContactDetailView.vue   |  24 +-
 .../e2e/ui/conversationLifecycle.cy.js        |  18 +
 .../components/ui/command/Command.vue         |   8 +-
 .../components/ui/command/CommandDialog.vue   |   6 +-
 i18n/en-US.json                               |  30 +-
 internal/conversation/conversation.go         |  20 +
 internal/conversation/message.go              |  17 +
 internal/conversation/models/models.go        |  20 +-
 47 files changed, 2407 insertions(+), 678 deletions(-)
 create mode 100644 frontend/apps/main/src/composables/useBulkActions.js
 create mode 100644 frontend/apps/main/src/composables/useInboxNavigation.js
 create mode 100644 frontend/apps/main/src/composables/useKeyboardShortcutsDialog.js
 create mode 100644 frontend/apps/main/src/constants/navIcons.js
 create mode 100644 frontend/apps/main/src/features/command/MacroPicker.vue
 create mode 100644 frontend/apps/main/src/features/command/SnoozeDatePicker.vue
 create mode 100644 frontend/apps/main/src/features/command/providers/useAccountCommands.js
 create mode 100644 frontend/apps/main/src/features/command/providers/useBulkCommands.js
 create mode 100644 frontend/apps/main/src/features/command/providers/useContactCommands.js
 create mode 100644 frontend/apps/main/src/features/command/providers/useConversationCommands.js
 create mode 100644 frontend/apps/main/src/features/command/providers/useCreateCommands.js
 create mode 100644 frontend/apps/main/src/features/command/providers/useEntitySearch.js
 create mode 100644 frontend/apps/main/src/features/command/providers/useListCommands.js
 create mode 100644 frontend/apps/main/src/features/command/providers/useNavigationCommands.js
 create mode 100644 frontend/apps/main/src/features/command/sections.js
 create mode 100644 frontend/apps/main/src/features/command/useCommandPalette.js
 create mode 100644 frontend/apps/main/src/features/command/useCommandRegistry.js
 create mode 100644 frontend/apps/main/src/features/command/useCommandRegistry.test.js
 create mode 100644 frontend/apps/main/src/features/command/useGlobalShortcuts.js
 create mode 100644 frontend/apps/main/src/stores/contact.js
 create mode 100644 frontend/apps/main/src/stores/view.js

diff --git a/cmd/conversation.go b/cmd/conversation.go
index b21298e6..6a1214b5 100644
--- a/cmd/conversation.go
+++ b/cmd/conversation.go
@@ -779,7 +779,7 @@ func handleRemoveUserAssignee(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	if err = app.conversation.RemoveConversationAssignee(uuid, "user", user); err != nil {
+	if err = app.conversation.UnassignConversationUser(uuid, user); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 	return r.SendEnvelope(true)
diff --git a/frontend/apps/main/src/App.vue b/frontend/apps/main/src/App.vue
index fd899254..e5d80238 100644
--- a/frontend/apps/main/src/App.vue
+++ b/frontend/apps/main/src/App.vue
@@ -35,12 +35,12 @@
     <div class="flex-1 min-w-0">
       <Sidebar
         :userTeams="userStore.teams"
-        :userViews="userViews"
+        :userViews="viewStore.views"
         :sharedViews="sharedViewStore.sharedViewList"
         @create-view="createView"
         @edit-view="editView"
         @delete-view="deleteView"
-        @create-conversation="() => (openCreateConversationDialog = true)"
+        @create-conversation="openCreateConversation()"
       >
         <div class="flex flex-col h-full rounded-lg overflow-hidden bg-background">
           <ConnectionBanner />
@@ -63,7 +63,13 @@
   <Command />
 
   <!-- Create conversation dialog -->
-  <CreateConversation v-model="openCreateConversationDialog" v-if="openCreateConversationDialog" />
+  <CreateConversation
+    v-if="openCreateConversationDialog"
+    v-model="openCreateConversationDialog"
+    :initial-contact="createConversationContact"
+  />
+
+  <KeyboardShortcutsDialog v-model:open="showShortcuts" />
 </template>
 
 <script setup>
@@ -86,6 +92,9 @@ import { useTagStore } from './stores/tag'
 import { useCustomAttributeStore } from './stores/customAttributes'
 import { useIdleDetection } from './composables/useIdleDetection'
 import { useNotificationStore } from './stores/notification'
+import { useViewStore } from './stores/view'
+import { useKeyboardShortcutsDialog } from './composables/useKeyboardShortcutsDialog'
+import KeyboardShortcutsDialog from './components/KeyboardShortcutsDialog.vue'
 import { initAudioContext } from '@shared-ui/composables/useNotificationSound'
 import PageHeader from './components/layout/PageHeader.vue'
 import ViewForm from '@/features/view/ViewForm.vue'
@@ -148,10 +157,12 @@ const slaStore = useSlaStore()
 const sharedViewStore = useSharedViewStore()
 const tagStore = useTagStore()
 const customAttributeStore = useCustomAttributeStore()
-const userViews = ref([])
+const viewStore = useViewStore()
+const { open: showShortcuts } = useKeyboardShortcutsDialog()
 const view = ref({})
 const openCreateViewForm = ref(false)
 const openCreateConversationDialog = ref(false)
+const createConversationContact = ref(null)
 const { t } = useI18n()
 const notificationStore = useNotificationStore()
 
@@ -177,16 +188,23 @@ document.addEventListener('touchstart', unlockAudio)
 onMounted(() => {
   initToaster()
   listenViewRefresh()
+  emitter.on(EMITTER_EVENTS.OPEN_CREATE_CONVERSATION, openCreateConversation)
+  emitter.on(EMITTER_EVENTS.OPEN_VIEW_FORM, createView)
   initStores()
 })
 
+const openCreateConversation = ({ contact = null } = {}) => {
+  createConversationContact.value = contact
+  openCreateConversationDialog.value = true
+}
+
 // Initialize data stores
 const initStores = async () => {
   if (!userStore.userID) {
     await userStore.getCurrentUser()
   }
   await Promise.allSettled([
-    getUserViews(),
+    viewStore.fetchViews(),
     sharedViewStore.loadSharedViews(),
     conversationStore.fetchStatuses(),
     conversationStore.fetchPriorities(),
@@ -225,18 +243,6 @@ const deleteView = async (view) => {
   }
 }
 
-const getUserViews = async () => {
-  try {
-    const response = await api.getCurrentUserViews()
-    userViews.value = response.data.data
-  } catch (err) {
-    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
-      variant: 'destructive',
-      description: handleHTTPError(err).message
-    })
-  }
-}
-
 const initToaster = () => {
   emitter.on(EMITTER_EVENTS.SHOW_TOAST, (message) => {
     if (!message.description) return
@@ -260,12 +266,12 @@ const refreshViews = async (data) => {
   openCreateViewForm.value = false
   // TODO: move model to constants.
   if (data?.model === 'view') {
-    await getUserViews()
+    await viewStore.fetchViews()
     if (data.id) conversationStore.fetchViewCount(data.id)
     else conversationStore.fetchSidebarCounts({ force: true })
     const openID = route.params.viewID
     // If the open view was edited its filters may have changed, refetch.
-    if (openID && userViews.value.some((v) => String(v.id) === String(openID))) {
+    if (openID && viewStore.views.some((v) => String(v.id) === String(openID))) {
       // Reset list and fetch conversations.
       conversationStore.resetConversations()
       conversationStore.fetchConversationsList(true, CONVERSATION_LIST_TYPE.VIEW, 0, [], openID)
diff --git a/frontend/apps/main/src/components/KeyboardShortcutsDialog.vue b/frontend/apps/main/src/components/KeyboardShortcutsDialog.vue
index e7ee7584..9ea8da79 100644
--- a/frontend/apps/main/src/components/KeyboardShortcutsDialog.vue
+++ b/frontend/apps/main/src/components/KeyboardShortcutsDialog.vue
@@ -50,16 +50,37 @@ const { t } = useI18n()
 
 const isMac = typeof navigator !== 'undefined' && /Mac|iPhone|iPad/.test(navigator.platform)
 const mod = isMac ? '⌘' : 'Ctrl'
+const alt = isMac ? '⌥' : 'Alt'
 
 const groups = computed(() => [
   {
     title: t('globals.terms.general'),
-    items: [{ label: t('shortcuts.openCommandBar'), keys: [mod, 'K'] }]
+    items: [
+      { label: t('shortcuts.openCommandBar'), keys: [mod, 'K'] },
+      { label: t('navigation.keyboardShortcuts'), keys: [mod, '/'] },
+      { label: t('conversation.newConversation'), keys: [alt, 'C'] }
+    ]
+  },
+  {
+    title: t('globals.terms.conversation', 2),
+    items: [
+      { label: t('shortcuts.previousConversation'), keys: [alt, 'J'] },
+      { label: t('shortcuts.nextConversation'), keys: [alt, 'K'] },
+      { label: t('globals.terms.snooze'), keys: [alt, 'Z'] },
+      { label: t('actions.setPriority'), keys: [alt, 'P'] },
+      { label: t('actions.assignAgent'), keys: [alt, 'A'] },
+      { label: t('command.switchToReply'), keys: [alt, 'R'] },
+      { label: t('command.switchToPrivateNote'), keys: [alt, 'N'] },
+      { label: t('conversation.bulkActions.selectConversation'), keys: [alt, 'X'] },
+      { label: t('globals.terms.resolve'), keys: [alt, 'E'] },
+      { label: t('globals.terms.reopen'), keys: [alt, 'O'] }
+    ]
   },
   {
     title: t('shortcuts.replyEditor'),
     items: [
       { label: t('actions.openMacros'), keys: [mod, 'M'] },
+      { label: t('shortcuts.toggleReplyType'), keys: [mod, 'P'] },
       { label: t('actions.sendReply'), keys: ['Ctrl', 'Enter'] },
       { label: t('globals.terms.bold'), keys: [mod, 'B'] },
       { label: t('globals.terms.italic'), keys: [mod, 'I'] }
diff --git a/frontend/apps/main/src/components/editor/ConversationEditor.vue b/frontend/apps/main/src/components/editor/ConversationEditor.vue
index 23e73a11..08a8415a 100644
--- a/frontend/apps/main/src/components/editor/ConversationEditor.vue
+++ b/frontend/apps/main/src/components/editor/ConversationEditor.vue
@@ -49,7 +49,13 @@ const props = defineProps({
   linkedModel: { type: String, default: 'messages' }
 })
 
-const emit = defineEmits(['send', 'aiPromptSelected', 'mentionsChanged', 'filesDropped'])
+const emit = defineEmits([
+  'send',
+  'aiPromptSelected',
+  'mentionsChanged',
+  'filesDropped',
+  'toggleMessageType'
+])
 
 const linkDialog = ref(null)
 
@@ -89,6 +95,7 @@ const { editor, extractMentions, focus } = useTextEditor({
     emit('send')
     stopTyping()
   },
+  onToggleMessageType: () => emit('toggleMessageType'),
   onUpdate: () => {
     startTyping()
     if (props.enableMentions) emit('mentionsChanged', extractMentions())
diff --git a/frontend/apps/main/src/components/editor/useTextEditor.js b/frontend/apps/main/src/components/editor/useTextEditor.js
index ce6cc028..f2463e3d 100644
--- a/frontend/apps/main/src/components/editor/useTextEditor.js
+++ b/frontend/apps/main/src/components/editor/useTextEditor.js
@@ -14,6 +14,7 @@ export function useTextEditor({
   getSuggestions = null,
   enableMentions = () => false,
   onSend = () => {},
+  onToggleMessageType = null,
   onUpdate = () => {},
   onBlur = () => {},
   onOtherFiles = () => {}
@@ -63,6 +64,17 @@ export function useTextEditor({
           onSend()
           return true
         }
+        if (
+          onToggleMessageType &&
+          (event.ctrlKey || event.metaKey) &&
+          !event.shiftKey &&
+          !event.altKey &&
+          event.key.toLowerCase() === 'p'
+        ) {
+          event.preventDefault()
+          onToggleMessageType()
+          return true
+        }
       }
     },
     onUpdate: ({ editor }) => {
diff --git a/frontend/apps/main/src/components/sidebar/Sidebar.vue b/frontend/apps/main/src/components/sidebar/Sidebar.vue
index fd8d8f95..fde8b499 100644
--- a/frontend/apps/main/src/components/sidebar/Sidebar.vue
+++ b/frontend/apps/main/src/components/sidebar/Sidebar.vue
@@ -5,7 +5,7 @@ import {
   accountNavItems,
   contactNavItems
 } from '../../constants/navigation'
-import { useRoute, useRouter } from 'vue-router'
+import { useRoute } from 'vue-router'
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@shared-ui/components/ui/collapsible'
 import { Badge } from '@shared-ui/components/ui/badge'
 import {
@@ -32,66 +32,8 @@ import {
   CircleDashed,
   List,
   AtSign,
-  Settings,
-  Clock,
-  Timer,
-  Inbox as InboxIcon,
-  CircleDot,
-  Tag,
-  SlidersHorizontal,
-  Eye,
-  Zap,
-  Workflow,
-  UserRound,
-  UsersRound,
-  Shield,
-  ScrollText,
-  Mail,
-  FileText,
-  KeyRound,
-  Webhook,
-  Link,
-  BarChart3,
-  CircleUser,
-  Contact,
-  Sparkles,
-  NotebookText,
-  Wrench,
-  Bot,
-  Lightbulb,
-  BookOpen
 } from 'lucide-vue-next'
 
-const navIconMap = {
-  Settings,
-  Clock,
-  Timer,
-  Inbox: InboxIcon,
-  CircleDot,
-  Tag,
-  SlidersHorizontal,
-  Eye,
-  Zap,
-  Workflow,
-  UserRound,
-  UsersRound,
-  Shield,
-  ScrollText,
-  Mail,
-  FileText,
-  KeyRound,
-  Webhook,
-  Link,
-  BarChart3,
-  CircleUser,
-  Contact,
-  Sparkles,
-  NotebookText,
-  Wrench,
-  Bot,
-  Lightbulb,
-  BookOpen
-}
 import {
   DropdownMenu,
   DropdownMenuContent,
@@ -118,7 +60,8 @@ import { computed, onMounted, ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { useUserStore } from '@main/stores/user'
 import { useConversationStore } from '@main/stores/conversation'
-import { useIsMobile } from '@shared-ui/composables'
+import { navIconMap } from '@main/constants/navIcons'
+import { useInboxNavigation } from '@main/composables/useInboxNavigation'
 
 defineProps({
   userTeams: { type: Array, default: () => [] },
@@ -129,8 +72,6 @@ const userStore = useUserStore()
 const conversationStore = useConversationStore()
 const settingsStore = useAppSettingsStore()
 const route = useRoute()
-const router = useRouter()
-const isMobile = useIsMobile()
 const { t } = useI18n()
 const emit = defineEmits(['createView', 'editView', 'deleteView', 'createConversation'])
 
@@ -163,61 +104,7 @@ const handleDeleteView = () => {
   }
 }
 
-const keepConversationOpen = () =>
-  !isMobile.value &&
-  conversationStore.isConversationOpen &&
-  Boolean(conversationStore.conversation.data?.uuid)
-
-const navigateToInbox = (type) => {
-  if (keepConversationOpen()) {
-    router.push({
-      name: 'inbox-conversation',
-      params: {
-        type,
-        uuid: conversationStore.conversation.data.uuid
-      }
-    })
-  } else {
-    router.push({
-      name: 'inbox',
-      params: { type }
-    })
-  }
-}
-
-const navigateToTeamInbox = (teamID) => {
-  if (keepConversationOpen()) {
-    router.push({
-      name: 'team-inbox-conversation',
-      params: {
-        teamID,
-        uuid: conversationStore.conversation.data.uuid
-      }
-    })
-  } else {
-    router.push({
-      name: 'team-inbox',
-      params: { teamID }
-    })
-  }
-}
-
-const navigateToViewInbox = (viewID) => {
-  if (keepConversationOpen()) {
-    router.push({
-      name: 'view-inbox-conversation',
-      params: {
-        viewID,
-        uuid: conversationStore.conversation.data.uuid
-      }
-    })
-  } else {
-    router.push({
-      name: 'view-inbox',
-      params: { viewID }
-    })
-  }
-}
+const { navigateToInbox, navigateToTeamInbox, navigateToViewInbox } = useInboxNavigation()
 
 const filteredAdminNavItems = computed(() => filterNavItems(adminNavItems, userStore.can))
 const filteredReportsNavItems = computed(() => filterNavItems(reportsNavItems, userStore.can))
diff --git a/frontend/apps/main/src/components/sidebar/SidebarNavUser.vue b/frontend/apps/main/src/components/sidebar/SidebarNavUser.vue
index cc205320..8f18dc99 100644
--- a/frontend/apps/main/src/components/sidebar/SidebarNavUser.vue
+++ b/frontend/apps/main/src/components/sidebar/SidebarNavUser.vue
@@ -95,7 +95,7 @@
       </DropdownMenuGroup>
       <DropdownMenuSeparator />
       <DropdownMenuGroup>
-        <DropdownMenuItem @click="showShortcuts = true">
+        <DropdownMenuItem @click="shortcutsDialog.show">
           <Keyboard size="18" class="mr-2" />
           {{ t('navigation.keyboardShortcuts') }}
         </DropdownMenuItem>
@@ -108,7 +108,6 @@
     </DropdownMenuContent>
   </DropdownMenu>
 
-  <KeyboardShortcutsDialog v-model:open="showShortcuts" />
 </template>
 
 <script setup>
@@ -130,17 +129,16 @@ import { ChevronsUpDown, CircleUserRound, Keyboard, LogOut } from 'lucide-vue-ne
 import { useUserStore } from '@main/stores/user'
 import { useIsMobile } from '@shared-ui/composables'
 import { useRouter } from 'vue-router'
-import KeyboardShortcutsDialog from '@main/components/KeyboardShortcutsDialog.vue'
+import { useKeyboardShortcutsDialog } from '@main/composables/useKeyboardShortcutsDialog'
 
 import { useColorMode } from '@vueuse/core'
-import { ref } from 'vue'
 
 const isMobile = useIsMobile()
 const mode = useColorMode()
 const userStore = useUserStore()
 const router = useRouter()
 const { t } = useI18n()
-const showShortcuts = ref(false)
+const shortcutsDialog = useKeyboardShortcutsDialog()
 
 const logout = () => {
   window.location.href = '/logout'
diff --git a/frontend/apps/main/src/composables/useBulkActions.js b/frontend/apps/main/src/composables/useBulkActions.js
new file mode 100644
index 00000000..91b4caf5
--- /dev/null
+++ b/frontend/apps/main/src/composables/useBulkActions.js
@@ -0,0 +1,58 @@
+import { ref } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useConversationStore } from '@/stores/conversation'
+import { useEmitter } from '@/composables/useEmitter'
+import { EMITTER_EVENTS } from '@/constants/emitterEvents'
+import { TAG_ACTION } from '@/constants/conversation'
+import api from '@/api'
+
+const bulkLoading = ref(false)
+
+export function useBulkActions() {
+  const conversationStore = useConversationStore()
+  const emitter = useEmitter()
+  const { t } = useI18n()
+
+  const runBulkAction = async (actionFn) => {
+    const uuids = [...conversationStore.selectedUUIDs]
+    bulkLoading.value = true
+    const results = await Promise.allSettled(uuids.map((uuid) => actionFn(uuid)))
+    bulkLoading.value = false
+
+    const hasFailures = results.some((r) => r.status === 'rejected')
+
+    conversationStore.clearSelection()
+    conversationStore.fetchFirstPageConversations()
+    conversationStore.fetchSidebarCounts({ force: true })
+
+    if (hasFailures) {
+      emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+        variant: 'destructive',
+        title: t('globals.terms.error', 1),
+        description: t('conversation.bulkActions.failedToast')
+      })
+    } else {
+      emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+        description: t('conversation.bulkActions.successToast')
+      })
+    }
+  }
+
+  const bulkAssign = (assigneeType, assigneeValue) => {
+    if (assigneeValue === 'none') {
+      return runBulkAction((uuid) => api.removeAssignee(uuid, assigneeType))
+    }
+    const assigneeId = parseInt(assigneeValue, 10)
+    return runBulkAction((uuid) =>
+      api.updateAssignee(uuid, assigneeType, { assignee_id: assigneeId })
+    )
+  }
+
+  const bulkAddTag = (tag) =>
+    runBulkAction((uuid) => conversationStore.updateConversationTags(uuid, TAG_ACTION.ADD, [tag]))
+
+  const bulkUpdateStatus = (status) =>
+    runBulkAction((uuid) => api.updateConversationStatus(uuid, { status }))
+
+  return { bulkLoading, runBulkAction, bulkAssign, bulkAddTag, bulkUpdateStatus }
+}
diff --git a/frontend/apps/main/src/composables/useInboxNavigation.js b/frontend/apps/main/src/composables/useInboxNavigation.js
new file mode 100644
index 00000000..38c5861c
--- /dev/null
+++ b/frontend/apps/main/src/composables/useInboxNavigation.js
@@ -0,0 +1,28 @@
+import { useRouter } from 'vue-router'
+import { useIsMobile } from '@shared-ui/composables'
+import { useConversationStore } from '@main/stores/conversation'
+
+export function useInboxNavigation() {
+  const router = useRouter()
+  const isMobile = useIsMobile()
+  const conversationStore = useConversationStore()
+
+  const openConversationUUID = () =>
+    !isMobile.value && conversationStore.isConversationOpen
+      ? conversationStore.conversation.data?.uuid
+      : null
+
+  const navigate = (listName, params) => {
+    const uuid = openConversationUUID()
+    if (uuid) {
+      return router.push({ name: `${listName}-conversation`, params: { ...params, uuid } })
+    }
+    return router.push({ name: listName, params })
+  }
+
+  const navigateToInbox = (type) => navigate('inbox', { type })
+  const navigateToTeamInbox = (teamID) => navigate('team-inbox', { teamID })
+  const navigateToViewInbox = (viewID) => navigate('view-inbox', { viewID })
+
+  return { navigateToInbox, navigateToTeamInbox, navigateToViewInbox }
+}
diff --git a/frontend/apps/main/src/composables/useKeyboardShortcutsDialog.js b/frontend/apps/main/src/composables/useKeyboardShortcutsDialog.js
new file mode 100644
index 00000000..7fbb25e2
--- /dev/null
+++ b/frontend/apps/main/src/composables/useKeyboardShortcutsDialog.js
@@ -0,0 +1,10 @@
+import { ref } from 'vue'
+
+const open = ref(false)
+
+export function useKeyboardShortcutsDialog() {
+  const show = () => {
+    open.value = true
+  }
+  return { open, show }
+}
diff --git a/frontend/apps/main/src/constants/emitterEvents.js b/frontend/apps/main/src/constants/emitterEvents.js
index 8cd8bcb6..9a5e6b26 100644
--- a/frontend/apps/main/src/constants/emitterEvents.js
+++ b/frontend/apps/main/src/constants/emitterEvents.js
@@ -4,8 +4,26 @@ export const EMITTER_EVENTS = {
     SHOW_TOAST: 'show-toast',
     SHOW_SOONER: 'show-sooner',
     NEW_MESSAGE: 'new-message',
-    SET_NESTED_COMMAND: 'set-nested-command',
     CONVERSATION_SIDEBAR_TOGGLE: 'conversation-sidebar-toggle',
     SCROLL_TO_MESSAGE: 'scroll-to-message',
-    COPILOT_INSERT_REPLY: 'copilot-insert-reply'
-}
\ No newline at end of file
+    COPILOT_INSERT_REPLY: 'copilot-insert-reply',
+    OPEN_CREATE_CONVERSATION: 'open-create-conversation',
+    OPEN_VIEW_FORM: 'open-view-form',
+    REPLY_BOX_FOCUS: 'reply-box-focus',
+    REPLY_BOX_SET_TYPE: 'reply-box-set-type',
+    CONVERSATION_ACTION: 'conversation-action',
+    CONTACT_ACTION: 'contact-action'
+}
+
+export const CONVERSATION_ACTIONS = {
+    DOWNLOAD_TRANSCRIPT: 'download-transcript',
+    SUGGEST_TAGS: 'suggest-tags',
+    SUMMARIZE: 'summarize'
+}
+
+export const CONTACT_ACTIONS = {
+    TOGGLE_BLOCK: 'toggle-block',
+    EXPORT: 'export',
+    DELETE: 'delete',
+    ADD_NOTE: 'add-note'
+}
diff --git a/frontend/apps/main/src/constants/navIcons.js b/frontend/apps/main/src/constants/navIcons.js
new file mode 100644
index 00000000..e8e8f513
--- /dev/null
+++ b/frontend/apps/main/src/constants/navIcons.js
@@ -0,0 +1,62 @@
+import {
+  BarChart3,
+  Bot,
+  BookOpen,
+  CircleDot,
+  CircleUser,
+  Clock,
+  Contact,
+  Eye,
+  FileText,
+  Inbox,
+  KeyRound,
+  Lightbulb,
+  Link,
+  Mail,
+  NotebookText,
+  ScrollText,
+  Settings,
+  Shield,
+  SlidersHorizontal,
+  Sparkles,
+  Tag,
+  Timer,
+  UserRound,
+  UsersRound,
+  Webhook,
+  Workflow,
+  Wrench,
+  Zap
+} from 'lucide-vue-next'
+
+// Icon names referenced by string in navigation.js.
+export const navIconMap = {
+  BarChart3,
+  Bot,
+  BookOpen,
+  CircleDot,
+  CircleUser,
+  Clock,
+  Contact,
+  Eye,
+  FileText,
+  Inbox,
+  KeyRound,
+  Lightbulb,
+  Link,
+  Mail,
+  NotebookText,
+  ScrollText,
+  Settings,
+  Shield,
+  SlidersHorizontal,
+  Sparkles,
+  Tag,
+  Timer,
+  UserRound,
+  UsersRound,
+  Webhook,
+  Workflow,
+  Wrench,
+  Zap
+}
diff --git a/frontend/apps/main/src/constants/navigation.js b/frontend/apps/main/src/constants/navigation.js
index b3d043a4..5a0cc0f5 100644
--- a/frontend/apps/main/src/constants/navigation.js
+++ b/frontend/apps/main/src/constants/navigation.js
@@ -20,6 +20,7 @@ export const adminNavItems = [
       {
         titleKey: 'globals.terms.businessHour',
         href: '/admin/business-hours',
+        createRouteName: 'new-business-hours',
         permission: 'business_hours:manage',
         isTitleKeyPlural: true,
         icon: 'Clock'
@@ -27,6 +28,7 @@ export const adminNavItems = [
       {
         titleKey: 'globals.terms.slaPolicy',
         href: '/admin/sla',
+        createRouteName: 'new-sla',
         permission: 'sla:manage',
         isTitleKeyPlural: true,
         icon: 'Timer'
@@ -73,6 +75,7 @@ export const adminNavItems = [
       {
         titleKey: 'admin.ai.tools',
         href: '/admin/ai/tools',
+        createRouteName: 'new-ai-tool',
         permission: 'ai:manage',
         isTitleKeyPlural: true,
         icon: 'Wrench'
@@ -80,6 +83,7 @@ export const adminNavItems = [
       {
         titleKey: 'admin.ai.assistants',
         href: '/admin/ai/assistants',
+        createRouteName: 'new-ai-assistant',
         permission: 'ai:manage',
         isTitleKeyPlural: true,
         icon: 'Bot'
@@ -93,6 +97,7 @@ export const adminNavItems = [
       {
         titleKey: 'globals.terms.inbox',
         href: '/admin/inboxes',
+        createRouteName: 'new-inbox',
         permission: 'inboxes:manage',
         isTitleKeyPlural: true,
         icon: 'Inbox'
@@ -127,6 +132,7 @@ export const adminNavItems = [
       {
         titleKey: 'globals.terms.sharedView',
         href: '/admin/conversations/shared-views',
+        createRouteName: 'new-shared-view',
         permission: 'shared_views:manage',
         isTitleKeyPlural: true,
         icon: 'Eye'
@@ -139,6 +145,7 @@ export const adminNavItems = [
       {
         titleKey: 'globals.terms.macro',
         href: '/admin/conversations/macros',
+        createRouteName: 'new-macro',
         permission: 'macros:manage',
         isTitleKeyPlural: true,
         icon: 'Zap'
@@ -146,6 +153,7 @@ export const adminNavItems = [
       {
         titleKey: 'globals.terms.automation',
         href: '/admin/automations',
+        createRouteName: 'new-automation',
         permission: 'automations:manage',
         isTitleKeyPlural: true,
         icon: 'Workflow'
@@ -159,6 +167,7 @@ export const adminNavItems = [
       {
         titleKey: 'globals.terms.agent',
         href: '/admin/teams/agents',
+        createRouteName: 'new-agent',
         permission: 'users:manage',
         isTitleKeyPlural: true,
         icon: 'UserRound'
@@ -166,6 +175,7 @@ export const adminNavItems = [
       {
         titleKey: 'globals.terms.team',
         href: '/admin/teams/teams',
+        createRouteName: 'new-team',
         permission: 'teams:manage',
         isTitleKeyPlural: true,
         icon: 'UsersRound'
@@ -173,6 +183,7 @@ export const adminNavItems = [
       {
         titleKey: 'globals.terms.role',
         href: '/admin/teams/roles',
+        createRouteName: 'new-role',
         permission: 'roles:manage',
         isTitleKeyPlural: true,
         icon: 'Shield'
@@ -199,6 +210,7 @@ export const adminNavItems = [
       {
         titleKey: 'globals.terms.template',
         href: '/admin/templates',
+        createRouteName: 'new-template',
         permission: 'templates:manage',
         isTitleKeyPlural: true,
         icon: 'FileText'
@@ -211,6 +223,7 @@ export const adminNavItems = [
       {
         titleKey: 'globals.terms.sso',
         href: '/admin/sso',
+        createRouteName: 'new-sso',
         permission: 'oidc:manage',
         icon: 'KeyRound'
       }
@@ -223,6 +236,7 @@ export const adminNavItems = [
       {
         titleKey: 'globals.terms.webhook',
         href: '/admin/webhooks',
+        createRouteName: 'new-webhook',
         permission: 'webhooks:manage',
         isTitleKeyPlural: true,
         icon: 'Webhook'
@@ -230,6 +244,7 @@ export const adminNavItems = [
       {
         titleKey: 'globals.terms.contextLink',
         href: '/admin/context-links',
+        createRouteName: 'new-context-link',
         permission: 'context_links:manage',
         isTitleKeyPlural: true,
         icon: 'Link'
diff --git a/frontend/apps/main/src/features/command/CommandBox.vue b/frontend/apps/main/src/features/command/CommandBox.vue
index 152966fb..757afb06 100644
--- a/frontend/apps/main/src/features/command/CommandBox.vue
+++ b/frontend/apps/main/src/features/command/CommandBox.vue
@@ -2,523 +2,301 @@
   <CommandDialog
     :open="open"
     v-model:search-term="searchTerm"
-    :filter-function="isMacroMode ? passThroughFilter : undefined"
-    @update:open="toggleOpen"
+    v-model:selected-value="highlightedValue"
+    :filter-function="filterFunction"
+    @update:open="onOpenChange"
     :class="[
       'z-[51] !top-[44%] !w-[calc(100%-1.5rem)] !min-w-0 gap-0 rounded-lg border-border/80 bg-popover shadow-lg [&>button]:right-3 [&>button]:top-3 [&>button]:rounded-md [&>button]:bg-muted/70 [&>button]:opacity-60 [&>button]:hover:opacity-100',
       isMacroMode ? '!max-w-5xl' : '!max-w-2xl'
     ]"
     command-class="rounded-lg bg-popover [&_[cmdk-input-wrapper]]:h-14 [&_[cmdk-input-wrapper]]:border-border/70 [&_[cmdk-input-wrapper]]:px-4 [&_[cmdk-input-wrapper]_svg]:text-muted-foreground [&_[cmdk-input]]:h-14 [&_[cmdk-input]]:pr-10 [&_[cmdk-input]]:text-base [&_[cmdk-group]]:py-2 [&_[cmdk-group-heading]]:px-3 [&_[cmdk-group-heading]]:pb-2 [&_[cmdk-group-heading]]:pt-1 [&_[cmdk-group-heading]]:text-xs [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:uppercase [&_[cmdk-group-heading]]:tracking-wider [&_[cmdk-item]]:mx-0.5 [&_[cmdk-item]]:rounded-md [&_[cmdk-item]]:px-3 [&_[cmdk-item]]:py-2 [&_[cmdk-item]]:transition-colors [&_[cmdk-item]]:duration-150"
   >
-    <CommandInput :placeholder="t('command.typeCmdOrSearch')" @keydown="onInputKeydown" />
+    <div
+      v-if="breadcrumb"
+      class="flex items-center gap-2 border-b border-border/70 px-4 py-2 text-xs text-muted-foreground"
+    >
+      <button
+        type="button"
+        class="flex items-center gap-1 rounded-md px-1.5 py-0.5 hover:bg-muted hover:text-foreground"
+        @click="goBack"
+      >
+        <ChevronLeft class="h-3.5 w-3.5" />
+        {{ $t('globals.messages.back') }}
+      </button>
+      <span class="rounded-md bg-muted px-2 py-0.5 font-medium text-foreground">
+        {{ breadcrumb }}
+      </span>
+    </div>
+
+    <CommandInput :placeholder="placeholder" :loading="loading" @keydown="onInputKeydown" />
     <CommandList
-      :class="[
+      :key="parent || 'root'"
+      :class="
         isMacroMode
           ? 'h-[50vh] min-h-[50vh] min-w-[50vw] overflow-hidden [&>div]:h-full'
-          : 'h-auto min-h-[220px] max-h-[min(52vh,440px)]',
-        { 'overflow-hidden': nestedCommand === 'apply-macro' }
-      ]"
+          : 'h-auto min-h-[220px] max-h-[min(52vh,440px)]'
+      "
     >
-      <CommandEmpty v-if="!isMacroMode || !macroStore.searchLoading">
-        <p class="text-sm text-muted-foreground">
-          {{ $t(isMacroMode ? 'globals.messages.noResultsFound' : 'command.noCommandAvailable') }}
-        </p>
+      <CommandEmpty v-if="!loading">
+        <p class="text-sm text-muted-foreground">{{ emptyText }}</p>
       </CommandEmpty>
 
-      <!-- Snooze Options -->
-      <CommandGroup v-if="nestedCommand === 'snooze'" :heading="t('command.snoozeFor')">
-        <CommandItem value="1 hour" @select="handleSnooze(60)">
-          1 {{ $t('globals.terms.hour') }}
-        </CommandItem>
-        <CommandItem value="3 hours" @select="handleSnooze(180)">
-          3 {{ $t('globals.terms.hour', 2) }}
-        </CommandItem>
-        <CommandItem value="6 hours" @select="handleSnooze(360)">
-          6 {{ $t('globals.terms.hour', 2) }}
-        </CommandItem>
-        <CommandItem value="12 hours" @select="handleSnooze(720)">
-          12 {{ $t('globals.terms.hour', 2) }}
-        </CommandItem>
-        <CommandItem value="1 day" @select="handleSnooze(1440)">
-          1 {{ $t('globals.terms.day') }}
-        </CommandItem>
-        <CommandItem value="2 days" @select="handleSnooze(2880)">
-          2 {{ $t('globals.terms.day', 2) }}
-        </CommandItem>
-        <CommandItem value="3 days" @select="handleSnooze(4320)">
-          3 {{ $t('globals.terms.day', 2) }}
-        </CommandItem>
-        <CommandItem value="1 week" @select="handleSnooze(10080)">
-          1 {{ $t('globals.terms.week') }}
-        </CommandItem>
-        <CommandItem value="pick date & time" @select="showCustomDialog">
-          {{ $t('globals.messages.pickDateAndTime') }}
-        </CommandItem>
-      </CommandGroup>
+      <MacroPicker
+        v-if="isMacroMode"
+        :search-term="searchTerm"
+        :highlighted-value="highlightedValue"
+        :macro-context="macroContext"
+        @applied="closePalette"
+      />
 
-      <!-- Macros -->
-      <div v-if="isMacroMode" class="h-full">
-        <!-- Mounted only with results: radix's group counts its items once on mount and stays hidden when they arrive async. -->
+      <template v-else>
         <CommandGroup
-          v-if="visibleMacros.length"
-          class="flex h-full min-h-0 flex-col"
+          v-for="group in groups"
+          :key="group.section"
+          :heading="group.label"
         >
-          <div class="min-h-0 flex-1">
-            <div class="grid h-full min-h-0 grid-cols-12">
-              <div
-                ref="macroListRef"
-                class="col-span-4 h-full min-h-0 overflow-y-auto border-r border-border/70 pr-2"
-              >
-                <CommandItem
-                  v-for="(macro, index) in visibleMacros"
-                  :key="macro.value"
-                  :value="macro.label + '|' + index"
-                  :data-index="index"
-                  @select="handleApplyMacro(macro)"
-                  @pointerenter="highlightedMacro = macro"
-                  class="cursor-pointer"
-                >
-                  <div class="flex min-w-0 items-center">
-                    <span class="text-sm w-full break-words whitespace-normal">{{
-                      macro.label
-                    }}</span>
-                  </div>
-                </CommandItem>
-              </div>
-
-              <div class="col-span-8 h-full min-h-0 overflow-y-auto px-5 pb-5 pt-2">
-                <div class="flex min-h-full flex-col space-y-4 text-sm">
-                  <div v-if="contentPending" class="flex flex-1 items-center justify-center">
-                    <Spinner :absolute="false" />
-                  </div>
-                  <div v-else-if="replyContent" class="space-y-2">
-                    <p class="text-xs font-medium uppercase tracking-wider text-muted-foreground">
-                      {{ $t('command.replyPreview') }}
-                    </p>
-                    <Letter
-                      :key="highlightedMacro?.value"
-                      :html="replyContent"
-                      :allowedSchemas="['cid', 'https', 'http', 'mailto']"
-                      class="native-html min-h-[120px] w-full overflow-auto rounded-lg border bg-background p-4 shadow-sm"
-                    />
-                  </div>
-
-                  <div v-if="otherActions.length > 0" class="space-y-2">
-                    <p class="text-xs font-medium uppercase tracking-wider text-muted-foreground">
-                      {{ $t('globals.terms.action', 2) }}
-                    </p>
-                    <div class="grid gap-2 sm:grid-cols-2">
-                      <div
-                        v-for="action in otherActions"
-                        :key="action.type"
-                        class="flex min-w-0 items-center gap-2 rounded-lg border bg-muted/30 px-3 py-2 text-sm"
-                      >
-                        <div
-                          class="grid h-7 w-7 shrink-0 place-items-center rounded-md bg-background text-muted-foreground shadow-sm"
-                        >
-                          <User v-if="action.type === 'assign_user'" :size="14" class="shrink-0" />
-                          <Users
-                            v-else-if="action.type === 'assign_team'"
-                            :size="14"
-                            class="shrink-0"
-                          />
-                          <Pin
-                            v-else-if="action.type === 'set_status'"
-                            :size="14"
-                            class="shrink-0"
-                          />
-                          <Rocket
-                            v-else-if="action.type === 'set_priority'"
-                            :size="14"
-                            class="shrink-0"
-                          />
-                          <Tags v-else :size="14" class="shrink-0" />
-                        </div>
-                        <span class="truncate">{{ getActionLabel(action) }}</span>
-                      </div>
-                    </div>
-                  </div>
-
-                  <div
-                    v-if="!contentPending && !replyContent && otherActions.length === 0"
-                    class="flex min-h-40 flex-1 flex-col items-center justify-center gap-2 rounded-lg border border-dashed bg-muted/20"
-                  >
-                    <p class="text-sm text-muted-foreground">
-                      {{ $t('command.selectAMacro') }}
-                    </p>
-                  </div>
-                </div>
-              </div>
-            </div>
-          </div>
+          <CommandItem
+            v-for="command in group.commands"
+            :key="command.id"
+            :value="command.id"
+            :class="['gap-2.5', { 'text-destructive': command.destructive }]"
+            @select="onSelect($event, command)"
+          >
+            <component
+              :is="command.icon"
+              v-if="command.icon"
+              class="!h-4 !w-4 shrink-0 text-muted-foreground"
+            />
+            <span class="min-w-0 truncate">{{ command.label }}</span>
+            <span v-if="command.hint" class="min-w-0 truncate text-xs text-muted-foreground">
+              {{ command.hint }}
+            </span>
+            <span class="ml-auto flex shrink-0 items-center gap-1 pl-3">
+              <template v-if="command.shortcut">
+                <kbd v-for="key in command.shortcut" :key="key" :class="KBD_CLASS">
+                  {{ KEY_LABELS[key] || key }}
+                </kbd>
+              </template>
+              <ChevronRight
+                v-if="command.group || command.navigateTo"
+                class="!h-4 !w-4 text-muted-foreground"
+              />
+            </span>
+          </CommandItem>
         </CommandGroup>
-      </div>
-
-      <!-- Commands requiring a conversation to be open -->
-      <CommandGroup
-        :heading="t('globals.terms.conversation', 2)"
-        value="conversations"
-        v-else-if="conversationStore.isConversationOpen && !nestedCommand"
-      >
-        <CommandItem
-          value="apply-macro"
-          @select="setNestedCommand('apply-macro-to-existing-conversation')"
-        >
-          {{ $t('actions.applyMacro') }}
-        </CommandItem>
-        <CommandItem value="conv-snooze" @select="setNestedCommand('snooze')">
-          {{ $t('globals.terms.snooze') }}
-        </CommandItem>
-        <CommandItem value="conv-resolve" @select="resolveConversation">
-          {{ $t('globals.terms.resolve') }}
-        </CommandItem>
-      </CommandGroup>
+      </template>
     </CommandList>
 
-    <!-- Navigation -->
     <div
       class="flex flex-wrap items-center gap-x-4 gap-y-2 border-t border-border/70 bg-muted/30 px-4 py-2"
     >
       <span class="flex items-center gap-1 text-xs text-muted-foreground">
-        <kbd
-          :class="KBD_CLASS"
-          >Enter</kbd
-        >
+        <kbd :class="KBD_CLASS">Enter</kbd>
         {{ $t('globals.terms.select') }}
       </span>
       <span class="flex items-center gap-1 text-xs text-muted-foreground">
-        <kbd
-          :class="KBD_CLASS"
-          >&uarr;&darr;</kbd
-        >
+        <kbd :class="KBD_CLASS">&uarr;&darr;</kbd>
         {{ $t('command.navigate') }}
       </span>
       <span class="flex items-center gap-1 text-xs text-muted-foreground">
-        <kbd
-          :class="KBD_CLASS"
-          >Esc</kbd
-        >
+        <kbd :class="KBD_CLASS">Esc</kbd>
         {{ $t('globals.messages.close') }}
       </span>
-      <span v-if="nestedCommand" class="flex items-center gap-1 text-xs text-muted-foreground">
-        <kbd
-          :class="KBD_CLASS"
-          >Backspace</kbd
-        >
+      <span v-if="parent" class="flex items-center gap-1 text-xs text-muted-foreground">
+        <kbd :class="KBD_CLASS">Backspace</kbd>
         {{ $t('globals.messages.back') }}
       </span>
     </div>
   </CommandDialog>
 
-  <!-- Date Picker for Custom Snooze -->
-  <Dialog :open="showDatePicker" @update:open="closeDatePicker">
-    <DialogContent class="sm:max-w-[425px]">
-      <DialogHeader>
-        <DialogTitle>{{ $t('command.pickSnoozeTime') }}</DialogTitle>
-        <DialogDescription />
-      </DialogHeader>
-      <div class="grid gap-4 py-4">
-        <Popover :open="datePickerOpen" @update:open="datePickerOpen = $event">
-          <PopoverTrigger as-child>
-            <Button variant="outline" class="w-full justify-start text-left font-normal">
-              <CalendarIcon class="mr-2 h-4 w-4" />
-              {{ selectedDate ? selectedDate : t('globals.terms.pickDate') }}
-            </Button>
-          </PopoverTrigger>
-          <PopoverContent class="w-auto p-0">
-            <Calendar
-              mode="single"
-              v-model="selectedDate"
-              @update:model-value="datePickerOpen = false"
-            />
-          </PopoverContent>
-        </Popover>
-        <div class="grid gap-2">
-          <Label>{{ $t('globals.terms.time') }}</Label>
-          <Input type="time" v-model="selectedTime" />
-        </div>
-      </div>
-      <DialogFooter>
-        <Button @click="handleCustomSnooze">{{ $t('globals.terms.snooze') }}</Button>
-      </DialogFooter>
-    </DialogContent>
-  </Dialog>
+  <SnoozeDatePicker v-model:open="showSnoozeDatePicker" />
 </template>
 
 <script setup>
 const KBD_CLASS =
   'inline-flex h-5 items-center rounded-sm border bg-background px-1.5 font-mono text-xs font-medium text-foreground shadow-sm'
+const ASYNC_SEARCH_DEBOUNCE = 250
 
-import { ref, watch, onMounted, onUnmounted, computed } from 'vue'
-import { useMagicKeys, useDebounceFn } from '@vueuse/core'
-import { CalendarIcon } from 'lucide-vue-next'
-import { useConversationStore } from '@main/stores/conversation'
-import { useMacroStore } from '@main/stores/macro'
-import { CONVERSATION_DEFAULT_STATUSES, MACRO_CONTEXT } from '@main/constants/conversation'
-import { Users, User, Pin, Rocket, Tags } from 'lucide-vue-next'
+import { computed, ref, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useDebounceFn } from '@vueuse/core'
+import { ChevronLeft, ChevronRight } from 'lucide-vue-next'
 import {
   CommandDialog,
-  CommandInput,
-  CommandList,
   CommandEmpty,
   CommandGroup,
-  CommandItem
+  CommandInput,
+  CommandItem,
+  CommandList
 } from '@shared-ui/components/ui/command'
-import {
-  Dialog,
-  DialogContent,
-  DialogFooter,
-  DialogHeader,
-  DialogTitle,
-  DialogDescription
-} from '@shared-ui/components/ui/dialog'
-import { Popover, PopoverContent, PopoverTrigger } from '@shared-ui/components/ui/popover'
-import { EMITTER_EVENTS } from '@main/constants/emitterEvents.js'
-import { useEmitter } from '@main/composables/useEmitter'
-import { Button } from '@shared-ui/components/ui/button'
-import { Calendar } from '@shared-ui/components/ui/calendar'
-import { Input } from '@shared-ui/components/ui/input'
-import { Label } from '@shared-ui/components/ui/label'
-import { Spinner } from '@shared-ui/components/ui/spinner'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
-import { useI18n } from 'vue-i18n'
-import { Letter } from 'vue-letter'
+import { useEmitter } from '@main/composables/useEmitter'
+import { EMITTER_EVENTS } from '@main/constants/emitterEvents'
+import MacroPicker from './MacroPicker.vue'
+import SnoozeDatePicker from './SnoozeDatePicker.vue'
+import { MACROS_COMMAND, useCommandPalette } from './useCommandPalette'
+import { useCommandRegistry, commandMatches } from './useCommandRegistry'
+import { useGlobalShortcuts } from './useGlobalShortcuts'
+import { SECTION_ORDER, SECTION_LABEL_KEYS, SECTION_LABEL_PLURAL } from './sections'
+import { useNavigationCommands } from './providers/useNavigationCommands'
+import { useCreateCommands } from './providers/useCreateCommands'
+import { useAccountCommands } from './providers/useAccountCommands'
+import { useConversationCommands } from './providers/useConversationCommands'
+import { useListCommands } from './providers/useListCommands'
+import { useBulkCommands } from './providers/useBulkCommands'
+import { useContactCommands } from './providers/useContactCommands'
+import { useEntitySearch, ENTITY_SEARCH_MIN_LENGTH } from './providers/useEntitySearch'
 
-const conversationStore = useConversationStore()
-const macroStore = useMacroStore()
 const { t } = useI18n()
-const open = ref(false)
 const emitter = useEmitter()
-const nestedCommand = ref(null)
-const showDatePicker = ref(false)
-const datePickerOpen = ref(false)
-const selectedDate = ref(null)
-const selectedTime = ref('12:00')
-const searchTerm = ref('')
-const macroListRef = ref(null)
+const palette = useCommandPalette()
+const { open, parent, searchTerm, macroContext, closePalette, setParent } = palette
+const showSnoozeDatePicker = ref(false)
+const highlightedValue = ref('')
+const isMac = /Mac|iPhone|iPad/.test(navigator.platform)
+const KEY_LABELS = isMac ? { Ctrl: '⌘', Alt: '⌥' } : {}
 
-const passThroughFilter = (items) => items
+useGlobalShortcuts()
 
-const isMacroMode = computed(
-  () =>
-    nestedCommand.value === 'apply-macro-to-existing-conversation' ||
-    nestedCommand.value === 'apply-macro-to-new-conversation'
+const openSnoozeDatePicker = () => {
+  showSnoozeDatePicker.value = true
+}
+
+const registry = useCommandRegistry([
+  useBulkCommands(),
+  useConversationCommands({ openSnoozeDatePicker }),
+  useContactCommands(),
+  useListCommands(),
+  useCreateCommands(),
+  useNavigationCommands(),
+  useAccountCommands()
+])
+const entitySearch = useEntitySearch()
+
+const isMacroMode = computed(() => parent.value === MACROS_COMMAND)
+const parentCommand = computed(() => registry.get(parent.value))
+const breadcrumb = computed(() =>
+  isMacroMode.value ? t('globals.terms.macro', 2) : parentCommand.value?.label || ''
 )
 
-const visibleMacros = computed(() => macroStore.macroOptions)
-
-const searchMacrosDebounced = useDebounceFn(() => {
-  macroStore.searchMacros(searchTerm.value?.trim() || '')
-}, 300)
-
-watch(isMacroMode, (on) => {
-  if (on) macroStore.searchMacros(searchTerm.value?.trim() || '')
+const placeholder = computed(() => {
+  if (isMacroMode.value) return t('command.searchMacros')
+  return parentCommand.value?.placeholder || t('command.searchOrJumpTo')
 })
 
-watch(searchTerm, () => {
-  if (isMacroMode.value) searchMacrosDebounced()
-})
+// Results of the current async source: a group's own search, or the root entity search.
+const asyncResults = ref([])
+const loading = ref(false)
+let searchSeq = 0
 
-function preventDefaultOnHotkey(key) {
-  return (e) => {
-    if (e.key === key && (e.metaKey || e.ctrlKey)) {
-      e.preventDefault()
-    }
+const runAsyncSearch = async () => {
+  const seq = ++searchSeq
+  const term = searchTerm.value.trim()
+  const group = parentCommand.value
+  let source = null
+  if (group?.search) source = () => group.search(term)
+  else if (!parent.value && term.length >= ENTITY_SEARCH_MIN_LENGTH) {
+    source = () => entitySearch.search(term)
   }
-}
-
-const { Meta_K, Ctrl_K } = useMagicKeys({
-  passive: false,
-  onEventFired: preventDefaultOnHotkey('k')
-})
-
-watch([Meta_K, Ctrl_K], ([mac, win]) => {
-  if (mac || win) {
-    if (nestedCommand.value !== 'apply-macro-to-new-conversation') setNestedCommand(null)
-    toggleOpen()
-  }
-})
-
-const { Meta_M, Ctrl_M } = useMagicKeys({
-  passive: false,
-  onEventFired: preventDefaultOnHotkey('m')
-})
-
-watch([Meta_M, Ctrl_M], ([mac, win]) => {
-  if (mac || win) {
-    if (nestedCommand.value !== 'apply-macro-to-new-conversation') {
-      setNestedCommand('apply-macro-to-existing-conversation')
-    }
-    toggleOpen()
-  }
-})
-
-const highlightedMacro = ref(null)
-
-// New search results can drop the highlighted macro without any highlight mutation firing.
-watch(visibleMacros, (macros) => {
-  if (highlightedMacro.value && !macros.some((m) => m.value === highlightedMacro.value.value)) {
-    highlightedMacro.value = null
-  }
-})
-
-async function handleApplyMacro(macro) {
-  let messageContent = ''
-  if (macro.has_message_content) {
-    try {
-      messageContent = await macroStore.fetchMacroContent(macro.id)
-    } catch (error) {
-      emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
-        variant: 'destructive',
-        description: handleHTTPError(error).message
-      })
-      return
-    }
-  }
-  // Create a deep copy.
-  const plainMacro = JSON.parse(JSON.stringify(macro))
-  plainMacro.message_content = messageContent
-  if (nestedCommand.value === 'apply-macro-to-new-conversation') {
-    conversationStore.setMacro(plainMacro, MACRO_CONTEXT.NEW_CONVERSATION)
-  } else {
-    conversationStore.setMacro(plainMacro, MACRO_CONTEXT.REPLY)
-  }
-  toggleOpen()
-}
-
-const getActionLabel = computed(() => (action) => {
-  const prefixes = {
-    assign_user: t('actions.assignAgent'),
-    assign_team: t('actions.assignTeam'),
-    set_status: t('actions.setStatus'),
-    set_priority: t('actions.setPriority'),
-    add_tags: t('actions.addTags'),
-    set_tags: t('actions.setTags'),
-    remove_tags: t('actions.removeTags')
-  }
-  return `${prefixes[action.type]}: ${action.display_value.length > 0 ? action.display_value.join(', ') : action.value.join(', ')}`
-})
-
-const replyContent = computed(() => {
-  const macro = highlightedMacro.value
-  return macro ? macroStore.macroContents[macro.id] || '' : ''
-})
-
-const failedContentIDs = ref(new Set())
-
-const contentPending = computed(() => {
-  const macro = highlightedMacro.value
-  if (!macro?.has_message_content) return false
-  return !(macro.id in macroStore.macroContents) && !failedContentIDs.value.has(macro.id)
-})
-
-let contentFetchTimer = null
-
-watch(highlightedMacro, (macro) => {
-  clearTimeout(contentFetchTimer)
-  if (!macro?.has_message_content || macro.id in macroStore.macroContents) return
-  failedContentIDs.value.delete(macro.id)
-  contentFetchTimer = setTimeout(() => {
-    macroStore.fetchMacroContent(macro.id).catch(() => failedContentIDs.value.add(macro.id))
-  }, 150)
-})
-
-const otherActions = computed(
-  () =>
-    highlightedMacro.value?.actions?.filter(
-      (a) => a.type !== 'send_private_note' && a.type !== 'send_reply'
-    ) || []
-)
-
-function toggleOpen() {
-  open.value = !open.value
-}
-
-function setNestedCommand(command) {
-  nestedCommand.value = command
-}
-
-function formatDuration(minutes) {
-  return minutes < 60 ? `${minutes}m` : `${Math.floor(minutes / 60)}h`
-}
-
-async function handleSnooze(minutes) {
-  await conversationStore.snoozeConversation(formatDuration(minutes))
-  toggleOpen()
-}
-
-async function resolveConversation() {
-  await conversationStore.updateStatus(CONVERSATION_DEFAULT_STATUSES.RESOLVED)
-  toggleOpen()
-}
-
-function showCustomDialog() {
-  toggleOpen()
-  showDatePicker.value = true
-}
-
-function closeDatePicker() {
-  showDatePicker.value = false
-}
-
-function handleCustomSnooze() {
-  const [hours, minutes] = selectedTime.value.split(':')
-  const snoozeDate = new Date(selectedDate.value)
-  snoozeDate.setHours(parseInt(hours), parseInt(minutes))
-  const diffMinutes = Math.floor((snoozeDate - new Date()) / (1000 * 60))
-
-  if (diffMinutes <= 0) {
-    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
-      variant: 'destructive',
-      description: t('globals.messages.selectAFutureTime')
-    })
+  if (!source) {
+    asyncResults.value = []
+    loading.value = false
     return
   }
-  handleSnooze(diffMinutes)
-  closeDatePicker()
-  toggleOpen()
-}
-
-function onInputKeydown(e) {
-  if (e.key === 'Backspace') {
-    const inputVal = e.target.value || ''
-    if (!inputVal && nestedCommand.value !== null) {
-      e.preventDefault()
-      nestedCommand.value = null
-    }
+  loading.value = true
+  try {
+    const results = await source()
+    if (seq !== searchSeq) return
+    asyncResults.value = results
+  } catch (error) {
+    if (seq !== searchSeq) return
+    asyncResults.value = []
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  } finally {
+    if (seq === searchSeq) loading.value = false
   }
 }
+const runAsyncSearchDebounced = useDebounceFn(runAsyncSearch, ASYNC_SEARCH_DEBOUNCE)
 
-const nestedCommandHandler = (data) => {
-  setNestedCommand(data.command)
-  open.value = data.open
+watch(
+  () => [open.value, parent.value],
+  ([isOpen]) => {
+    searchSeq++
+    asyncResults.value = []
+    loading.value = false
+    if (isOpen && !isMacroMode.value) runAsyncSearch()
+  }
+)
+watch(
+  () => searchTerm.value,
+  () => {
+    if (open.value && !isMacroMode.value) runAsyncSearchDebounced()
+  }
+)
+
+const visibleCommands = computed(() => {
+  if (isMacroMode.value) return []
+  if (parentCommand.value?.search) return asyncResults.value
+  return [...registry.childrenOf(parent.value), ...asyncResults.value]
+})
+
+const visibleById = computed(() => new Map(visibleCommands.value.map((c) => [c.id, c])))
+const asyncIds = computed(() => new Set(asyncResults.value.map((c) => c.id)))
+
+const groups = computed(() => {
+  if (parent.value) {
+    return visibleCommands.value.length
+      ? [{ section: 'children', label: undefined, commands: visibleCommands.value }]
+      : []
+  }
+  return SECTION_ORDER.map((section) => ({
+    section,
+    label: t(SECTION_LABEL_KEYS[section], SECTION_LABEL_PLURAL.has(section) ? 2 : 1),
+    commands: visibleCommands.value.filter((c) => c.section === section)
+  })).filter((group) => group.commands.length)
+})
+
+// Async results are already filtered by the server, static commands match on label and keywords.
+const filterFunction = (values, term) => {
+  if (isMacroMode.value) return values
+  return values.filter((value) => {
+    if (asyncIds.value.has(value)) return true
+    const command = visibleById.value.get(value)
+    return command ? commandMatches(command, term) : false
+  })
 }
 
-let highlightObserver = null
+const emptyText = computed(() =>
+  !parent.value && searchTerm.value.trim().length < ENTITY_SEARCH_MIN_LENGTH
+    ? t('command.noCommandAvailable')
+    : t('globals.messages.noResultsFound')
+)
 
-watch(macroListRef, (el) => {
-  highlightObserver?.disconnect()
-  highlightObserver = null
-  highlightedMacro.value = null
-  if (!el) return
-  highlightObserver = new MutationObserver(() => {
-    const idx = el.querySelector('[data-highlighted]')?.getAttribute('data-index')
-    if (idx != null) highlightedMacro.value = visibleMacros.value[idx]
-  })
-  highlightObserver.observe(el, {
-    attributes: true,
-    attributeFilter: ['data-highlighted'],
-    subtree: true
-  })
-})
+const onSelect = async (event, command) => {
+  // Without this radix writes the selected value into the search input.
+  event.preventDefault()
+  if (command.navigateTo) return setParent(command.navigateTo)
+  if (command.group) return setParent(command.id)
+  closePalette()
+  await command.run?.()
+}
 
-onMounted(() => {
-  emitter.on(EMITTER_EVENTS.SET_NESTED_COMMAND, nestedCommandHandler)
-})
+const goBack = () => {
+  if (isMacroMode.value) return setParent(null)
+  setParent(parentCommand.value?.parent || null)
+}
 
-onUnmounted(() => {
-  emitter.off(EMITTER_EVENTS.SET_NESTED_COMMAND, nestedCommandHandler)
-  highlightObserver?.disconnect()
-  clearTimeout(contentFetchTimer)
-})
+const onOpenChange = (isOpen) => {
+  if (!isOpen) closePalette()
+}
+
+const onInputKeydown = (event) => {
+  if (event.key === 'Backspace' && !event.target.value && parent.value) {
+    event.preventDefault()
+    goBack()
+  }
+}
 </script>
diff --git a/frontend/apps/main/src/features/command/MacroPicker.vue b/frontend/apps/main/src/features/command/MacroPicker.vue
new file mode 100644
index 00000000..76895ba7
--- /dev/null
+++ b/frontend/apps/main/src/features/command/MacroPicker.vue
@@ -0,0 +1,190 @@
+<template>
+  <!-- Mounted only with results: radix's group counts its items once on mount and stays hidden when they arrive async. -->
+  <CommandGroup v-if="macros.length" class="flex h-full min-h-0 flex-col">
+    <div class="min-h-0 flex-1">
+      <div class="grid h-full min-h-0 grid-cols-12">
+        <div class="col-span-4 h-full min-h-0 overflow-y-auto border-r border-border/70 pr-2">
+          <CommandItem
+            v-for="macro in macros"
+            :key="macro.value"
+            :value="itemValue(macro)"
+            @select="onSelect($event, macro)"
+            class="cursor-pointer"
+          >
+            <div class="flex min-w-0 items-center">
+              <span class="text-sm w-full break-words whitespace-normal">{{ macro.label }}</span>
+            </div>
+          </CommandItem>
+        </div>
+
+        <div class="col-span-8 h-full min-h-0 overflow-y-auto px-5 pb-5 pt-2">
+          <div class="flex min-h-full flex-col space-y-4 text-sm">
+            <div v-if="contentPending" class="flex flex-1 items-center justify-center">
+              <Spinner :absolute="false" />
+            </div>
+            <div v-else-if="replyContent" class="space-y-2">
+              <p class="text-xs font-medium uppercase tracking-wider text-muted-foreground">
+                {{ $t('command.replyPreview') }}
+              </p>
+              <Letter
+                :key="highlightedMacro?.value"
+                :html="replyContent"
+                :allowedSchemas="['cid', 'https', 'http', 'mailto']"
+                class="native-html min-h-[120px] w-full overflow-auto rounded-lg border bg-background p-4 shadow-sm"
+              />
+            </div>
+
+            <div v-if="otherActions.length > 0" class="space-y-2">
+              <p class="text-xs font-medium uppercase tracking-wider text-muted-foreground">
+                {{ $t('globals.terms.action', 2) }}
+              </p>
+              <div class="grid gap-2 sm:grid-cols-2">
+                <div
+                  v-for="action in otherActions"
+                  :key="action.type"
+                  class="flex min-w-0 items-center gap-2 rounded-lg border bg-muted/30 px-3 py-2 text-sm"
+                >
+                  <div
+                    class="grid h-7 w-7 shrink-0 place-items-center rounded-md bg-background text-muted-foreground shadow-sm"
+                  >
+                    <component :is="ACTION_ICONS[action.type] || Tags" :size="14" class="shrink-0" />
+                  </div>
+                  <span class="truncate">{{ actionLabel(action) }}</span>
+                </div>
+              </div>
+            </div>
+
+            <div
+              v-if="!contentPending && !replyContent && otherActions.length === 0"
+              class="flex min-h-40 flex-1 flex-col items-center justify-center gap-2 rounded-lg border border-dashed bg-muted/20"
+            >
+              <p class="text-sm text-muted-foreground">
+                {{ $t('command.selectAMacro') }}
+              </p>
+            </div>
+          </div>
+        </div>
+      </div>
+    </div>
+  </CommandGroup>
+</template>
+
+<script setup>
+const MACRO_VALUE_PREFIX = 'macro.'
+const CONTENT_PREVIEW_DELAY = 150
+
+import { computed, ref, watch, onUnmounted } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useDebounceFn } from '@vueuse/core'
+import { Letter } from 'vue-letter'
+import { Users, User, Pin, Rocket, Tags } from 'lucide-vue-next'
+import { CommandGroup, CommandItem } from '@shared-ui/components/ui/command'
+import { Spinner } from '@shared-ui/components/ui/spinner'
+import { handleHTTPError } from '@shared-ui/utils/http.js'
+import { useConversationStore } from '@main/stores/conversation'
+import { useMacroStore } from '@main/stores/macro'
+import { useEmitter } from '@main/composables/useEmitter'
+import { EMITTER_EVENTS } from '@main/constants/emitterEvents'
+
+const ACTION_ICONS = {
+  assign_user: User,
+  assign_team: Users,
+  set_status: Pin,
+  set_priority: Rocket
+}
+
+const props = defineProps({
+  searchTerm: { type: String, default: '' },
+  // Value of the highlighted command item, forwarded from the combobox root.
+  highlightedValue: { type: String, default: '' },
+  macroContext: { type: String, required: true }
+})
+const emit = defineEmits(['applied'])
+
+const { t } = useI18n()
+const emitter = useEmitter()
+const conversationStore = useConversationStore()
+const macroStore = useMacroStore()
+
+const macros = computed(() => macroStore.macroOptions)
+const itemValue = (macro) => MACRO_VALUE_PREFIX + macro.value
+
+const highlightedMacro = computed(() => {
+  const value = props.highlightedValue
+  if (!value?.startsWith(MACRO_VALUE_PREFIX)) return null
+  const id = value.slice(MACRO_VALUE_PREFIX.length)
+  return macros.value.find((macro) => macro.value === id) || null
+})
+
+const search = () => macroStore.searchMacros(props.searchTerm.trim())
+const searchDebounced = useDebounceFn(search, 300)
+watch(() => props.searchTerm, searchDebounced)
+search()
+
+const failedContentIDs = ref(new Set())
+let contentFetchTimer = null
+
+watch(highlightedMacro, (macro) => {
+  clearTimeout(contentFetchTimer)
+  if (!macro?.has_message_content || macro.id in macroStore.macroContents) return
+  failedContentIDs.value.delete(macro.id)
+  contentFetchTimer = setTimeout(() => {
+    macroStore.fetchMacroContent(macro.id).catch(() => failedContentIDs.value.add(macro.id))
+  }, CONTENT_PREVIEW_DELAY)
+})
+
+const replyContent = computed(() => {
+  const macro = highlightedMacro.value
+  return macro ? macroStore.macroContents[macro.id] || '' : ''
+})
+
+const contentPending = computed(() => {
+  const macro = highlightedMacro.value
+  if (!macro?.has_message_content) return false
+  return !(macro.id in macroStore.macroContents) && !failedContentIDs.value.has(macro.id)
+})
+
+const otherActions = computed(
+  () =>
+    highlightedMacro.value?.actions?.filter(
+      (a) => a.type !== 'send_private_note' && a.type !== 'send_reply'
+    ) || []
+)
+
+const ACTION_LABEL_KEYS = {
+  assign_user: 'actions.assignAgent',
+  assign_team: 'actions.assignTeam',
+  set_status: 'actions.setStatus',
+  set_priority: 'actions.setPriority',
+  add_tags: 'actions.addTags',
+  set_tags: 'actions.setTags',
+  remove_tags: 'actions.removeTags'
+}
+
+const actionLabel = (action) => {
+  const values = action.display_value.length > 0 ? action.display_value : action.value
+  return `${t(ACTION_LABEL_KEYS[action.type])}: ${values.join(', ')}`
+}
+
+const onSelect = async (event, macro) => {
+  event.preventDefault()
+  let messageContent = ''
+  if (macro.has_message_content) {
+    try {
+      messageContent = await macroStore.fetchMacroContent(macro.id)
+    } catch (error) {
+      emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+        variant: 'destructive',
+        description: handleHTTPError(error).message
+      })
+      return
+    }
+  }
+  const plainMacro = JSON.parse(JSON.stringify(macro))
+  plainMacro.message_content = messageContent
+  conversationStore.setMacro(plainMacro, props.macroContext)
+  emit('applied')
+}
+
+onUnmounted(() => clearTimeout(contentFetchTimer))
+</script>
diff --git a/frontend/apps/main/src/features/command/SnoozeDatePicker.vue b/frontend/apps/main/src/features/command/SnoozeDatePicker.vue
new file mode 100644
index 00000000..0d9d8ad7
--- /dev/null
+++ b/frontend/apps/main/src/features/command/SnoozeDatePicker.vue
@@ -0,0 +1,96 @@
+<template>
+  <Dialog :open="open" @update:open="$emit('update:open', $event)">
+    <DialogContent class="sm:max-w-[425px]" @open-auto-focus="focusDateButton">
+      <DialogHeader>
+        <DialogTitle>{{ $t('command.pickSnoozeTime') }}</DialogTitle>
+        <DialogDescription />
+      </DialogHeader>
+      <div class="grid gap-4 py-4">
+        <Popover :open="datePickerOpen" @update:open="datePickerOpen = $event">
+          <PopoverTrigger as-child>
+            <Button
+              ref="dateButtonRef"
+              variant="outline"
+              class="w-full justify-start text-left font-normal"
+            >
+              <CalendarIcon class="mr-2 h-4 w-4" />
+              {{ selectedDate ? selectedDate : t('globals.terms.pickDate') }}
+            </Button>
+          </PopoverTrigger>
+          <PopoverContent class="w-auto p-0">
+            <Calendar
+              mode="single"
+              v-model="selectedDate"
+              @update:model-value="datePickerOpen = false"
+            />
+          </PopoverContent>
+        </Popover>
+        <div class="grid gap-2">
+          <Label>{{ $t('globals.terms.time') }}</Label>
+          <Input type="time" v-model="selectedTime" />
+        </div>
+      </div>
+      <DialogFooter>
+        <Button @click="snooze">{{ $t('globals.terms.snooze') }}</Button>
+      </DialogFooter>
+    </DialogContent>
+  </Dialog>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { CalendarIcon } from 'lucide-vue-next'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle
+} from '@shared-ui/components/ui/dialog'
+import { Popover, PopoverContent, PopoverTrigger } from '@shared-ui/components/ui/popover'
+import { Button } from '@shared-ui/components/ui/button'
+import { Calendar } from '@shared-ui/components/ui/calendar'
+import { Input } from '@shared-ui/components/ui/input'
+import { Label } from '@shared-ui/components/ui/label'
+import { useConversationStore } from '@main/stores/conversation'
+import { useEmitter } from '@main/composables/useEmitter'
+import { EMITTER_EVENTS } from '@main/constants/emitterEvents'
+import { formatSnoozeDuration } from './providers/useConversationCommands'
+
+defineProps({
+  open: { type: Boolean, default: false }
+})
+const emit = defineEmits(['update:open'])
+
+const { t } = useI18n()
+const emitter = useEmitter()
+const conversationStore = useConversationStore()
+const datePickerOpen = ref(false)
+const selectedDate = ref(null)
+const selectedTime = ref('12:00')
+const dateButtonRef = ref(null)
+
+const focusDateButton = (event) => {
+  event.preventDefault()
+  dateButtonRef.value?.$el?.focus()
+}
+
+const snooze = () => {
+  const [hours, minutes] = selectedTime.value.split(':')
+  const snoozeDate = new Date(selectedDate.value)
+  snoozeDate.setHours(parseInt(hours), parseInt(minutes))
+  const diffMinutes = Math.floor((snoozeDate - new Date()) / (1000 * 60))
+
+  if (diffMinutes <= 0) {
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: t('globals.messages.selectAFutureTime')
+    })
+    return
+  }
+  conversationStore.snoozeConversation(formatSnoozeDuration(diffMinutes))
+  emit('update:open', false)
+}
+</script>
diff --git a/frontend/apps/main/src/features/command/providers/useAccountCommands.js b/frontend/apps/main/src/features/command/providers/useAccountCommands.js
new file mode 100644
index 00000000..02b00e60
--- /dev/null
+++ b/frontend/apps/main/src/features/command/providers/useAccountCommands.js
@@ -0,0 +1,79 @@
+import { computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useColorMode } from '@vueuse/core'
+import {
+  CircleCheck,
+  Clock,
+  Keyboard,
+  LogOut,
+  Moon,
+  Sun,
+  UserRoundCog
+} from 'lucide-vue-next'
+import { useUserStore } from '@main/stores/user'
+import { useKeyboardShortcutsDialog } from '@main/composables/useKeyboardShortcutsDialog'
+import { SECTIONS } from '../sections'
+
+const AWAY_STATUSES = ['away_manual', 'away_and_reassigning']
+
+export function useAccountCommands() {
+  const { t } = useI18n()
+  const mode = useColorMode()
+  const userStore = useUserStore()
+  const shortcutsDialog = useKeyboardShortcutsDialog()
+
+  return computed(() => {
+    const status = userStore.user.availability_status
+    const isAway = AWAY_STATUSES.includes(status)
+    const isReassigning = status === 'away_and_reassigning'
+    const isDark = mode.value === 'dark'
+
+    return [
+      {
+        id: 'account.theme',
+        label: t(isDark ? 'command.switchToLightMode' : 'command.switchToDarkMode'),
+        keywords: [t('navigation.darkMode'), 'theme'],
+        section: SECTIONS.ACCOUNT,
+        icon: isDark ? Sun : Moon,
+        run: () => {
+          mode.value = isDark ? 'light' : 'dark'
+        }
+      },
+      {
+        id: 'account.availability',
+        label: t(isAway ? 'command.setOnline' : 'command.setAway'),
+        keywords: [t('navigation.away'), t('globals.terms.online'), t('globals.terms.status')],
+        section: SECTIONS.ACCOUNT,
+        icon: isAway ? CircleCheck : Clock,
+        run: () => userStore.updateUserAvailability(isAway ? 'online' : 'away_manual')
+      },
+      {
+        id: 'account.reassign',
+        label: t(isReassigning ? 'command.disableReassignReplies' : 'command.enableReassignReplies'),
+        keywords: [t('navigation.reassignReplies'), t('navigation.away')],
+        section: SECTIONS.ACCOUNT,
+        icon: UserRoundCog,
+        run: () =>
+          userStore.updateUserAvailability(isReassigning ? 'away_manual' : 'away_and_reassigning')
+      },
+      {
+        id: 'account.shortcuts',
+        label: t('navigation.keyboardShortcuts'),
+        section: SECTIONS.ACCOUNT,
+        icon: Keyboard,
+        shortcut: ['Ctrl', '/'],
+        run: shortcutsDialog.show
+      },
+      {
+        id: 'account.logout',
+        label: t('navigation.logout'),
+        keywords: ['sign out'],
+        section: SECTIONS.ACCOUNT,
+        icon: LogOut,
+        run: () => {
+          window.location.href = '/logout'
+        }
+      }
+    ]
+  })
+}
diff --git a/frontend/apps/main/src/features/command/providers/useBulkCommands.js b/frontend/apps/main/src/features/command/providers/useBulkCommands.js
new file mode 100644
index 00000000..6d0f9540
--- /dev/null
+++ b/frontend/apps/main/src/features/command/providers/useBulkCommands.js
@@ -0,0 +1,121 @@
+import { computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { CircleDot, Tag, TagIcon, UserPlus, Users, UsersRound, X } from 'lucide-vue-next'
+import { useConversationStore } from '@main/stores/conversation'
+import { useUsersStore } from '@main/stores/users'
+import { useTeamStore } from '@main/stores/team'
+import { useTagStore } from '@main/stores/tag'
+import { useBulkActions } from '@main/composables/useBulkActions'
+import { permissions as perms } from '@main/constants/permissions'
+import { SECTIONS } from '../sections'
+
+export function useBulkCommands() {
+  const { t } = useI18n()
+  const conversationStore = useConversationStore()
+  const usersStore = useUsersStore()
+  const teamStore = useTeamStore()
+  const tagStore = useTagStore()
+  const { bulkAssign, bulkAddTag, bulkUpdateStatus } = useBulkActions()
+
+  const section = SECTIONS.BULK
+
+  return computed(() => {
+    if (conversationStore.selectedCount === 0) return []
+    return [
+      {
+        id: 'bulk.status',
+        label: t('actions.setStatus'),
+        keywords: [t('globals.terms.status')],
+        section,
+        icon: CircleDot,
+        permission: perms.CONVERSATIONS_UPDATE_STATUS,
+        group: true
+      },
+      ...conversationStore.statusOptionsNoSnooze.map((status) => ({
+        id: `bulk.status.${status.value}`,
+        label: status.label,
+        parent: 'bulk.status',
+        icon: CircleDot,
+        run: () => bulkUpdateStatus(status.label)
+      })),
+      {
+        id: 'bulk.assign-agent',
+        label: t('actions.assignAgent'),
+        keywords: [t('globals.terms.agent')],
+        section,
+        icon: UserPlus,
+        permission: perms.CONVERSATIONS_UPDATE_USER_ASSIGNEE,
+        group: true,
+        placeholder: t('command.searchAgents'),
+        search: async (term) => [
+          {
+            id: 'bulk.assign-agent.none',
+            label: t('globals.terms.none'),
+            parent: 'bulk.assign-agent',
+            icon: X,
+            run: () => bulkAssign('user', 'none')
+          },
+          ...(await usersStore.searchUsers(term)).map((agent) => ({
+            id: `bulk.assign-agent.${agent.value}`,
+            label: agent.label,
+            parent: 'bulk.assign-agent',
+            icon: UserPlus,
+            run: () => bulkAssign('user', agent.value)
+          }))
+        ]
+      },
+      {
+        id: 'bulk.assign-team',
+        label: t('actions.assignTeam'),
+        keywords: [t('globals.terms.team')],
+        section,
+        icon: Users,
+        permission: perms.CONVERSATIONS_UPDATE_TEAM_ASSIGNEE,
+        group: true,
+        placeholder: t('command.searchTeams'),
+        search: async (term) => [
+          {
+            id: 'bulk.assign-team.none',
+            label: t('globals.terms.none'),
+            parent: 'bulk.assign-team',
+            icon: X,
+            run: () => bulkAssign('team', 'none')
+          },
+          ...(await teamStore.searchTeams(term)).map((team) => ({
+            id: `bulk.assign-team.${team.value}`,
+            label: team.label,
+            parent: 'bulk.assign-team',
+            icon: UsersRound,
+            run: () => bulkAssign('team', team.value)
+          }))
+        ]
+      },
+      {
+        id: 'bulk.add-tag',
+        label: t('actions.addTags'),
+        keywords: [t('globals.terms.tag')],
+        section,
+        icon: Tag,
+        permission: perms.CONVERSATIONS_UPDATE_TAGS,
+        group: true,
+        placeholder: t('command.searchTags'),
+        search: async (term) =>
+          (await tagStore.searchTagNames(term)).map((tag) => ({
+            id: `bulk.add-tag.${tag.value}`,
+            label: tag.label,
+            parent: 'bulk.add-tag',
+            icon: TagIcon,
+            run: () => bulkAddTag(tag.value)
+          }))
+      },
+      {
+        id: 'bulk.clear',
+        label: t('conversation.bulkActions.clearSelection'),
+        keywords: ['deselect'],
+        section,
+        icon: X,
+        run: () => conversationStore.clearSelection()
+      }
+    ]
+  })
+}
diff --git a/frontend/apps/main/src/features/command/providers/useContactCommands.js b/frontend/apps/main/src/features/command/providers/useContactCommands.js
new file mode 100644
index 00000000..3ad0b4ac
--- /dev/null
+++ b/frontend/apps/main/src/features/command/providers/useContactCommands.js
@@ -0,0 +1,79 @@
+import { computed } from 'vue'
+import { useRoute } from 'vue-router'
+import { useI18n } from 'vue-i18n'
+import {
+  Download,
+  MessageSquarePlus,
+  ShieldCheck,
+  ShieldOff,
+  StickyNote,
+  Trash2
+} from 'lucide-vue-next'
+import { useContactStore } from '@main/stores/contact'
+import { useEmitter } from '@main/composables/useEmitter'
+import { EMITTER_EVENTS, CONTACT_ACTIONS } from '@main/constants/emitterEvents'
+import { permissions as perms } from '@main/constants/permissions'
+import { SECTIONS } from '../sections'
+
+export function useContactCommands() {
+  const route = useRoute()
+  const { t } = useI18n()
+  const emitter = useEmitter()
+  const contactStore = useContactStore()
+
+  const section = SECTIONS.CONTACT
+  const contactAction = (action) => () => emitter.emit(EMITTER_EVENTS.CONTACT_ACTION, action)
+
+  return computed(() => {
+    const contact = contactStore.current
+    if (route.name !== 'contact-detail' || !contact) return []
+    return [
+      {
+        id: 'contact.start-conversation',
+        label: t('command.startConversationWithContact'),
+        keywords: [t('conversation.newConversation'), t('globals.messages.create')],
+        section,
+        icon: MessageSquarePlus,
+        permission: perms.CONVERSATIONS_WRITE,
+        run: () => emitter.emit(EMITTER_EVENTS.OPEN_CREATE_CONVERSATION, { contact })
+      },
+      {
+        id: 'contact.add-note',
+        label: t('contact.addNote'),
+        keywords: [t('globals.terms.note')],
+        section,
+        icon: StickyNote,
+        permission: perms.CONTACT_NOTES_WRITE,
+        run: contactAction(CONTACT_ACTIONS.ADD_NOTE)
+      },
+      {
+        id: 'contact.toggle-block',
+        label: t(contact.enabled ? 'contact.blockContact' : 'contact.unblockContact'),
+        keywords: [t('globals.messages.block'), t('globals.messages.unblock')],
+        section,
+        icon: contact.enabled ? ShieldOff : ShieldCheck,
+        permission: perms.CONTACTS_BLOCK,
+        run: contactAction(CONTACT_ACTIONS.TOGGLE_BLOCK)
+      },
+      {
+        id: 'contact.export',
+        label: t('globals.messages.exportData'),
+        keywords: ['download', 'json'],
+        section,
+        icon: Download,
+        permission: perms.CONTACTS_EXPORT,
+        run: contactAction(CONTACT_ACTIONS.EXPORT)
+      },
+      {
+        id: 'contact.delete',
+        label: t('contact.deleteContact'),
+        keywords: [t('globals.messages.delete')],
+        section,
+        icon: Trash2,
+        permission: perms.CONTACTS_DELETE,
+        destructive: true,
+        run: contactAction(CONTACT_ACTIONS.DELETE)
+      }
+    ]
+  })
+}
diff --git a/frontend/apps/main/src/features/command/providers/useConversationCommands.js b/frontend/apps/main/src/features/command/providers/useConversationCommands.js
new file mode 100644
index 00000000..b1f6ba39
--- /dev/null
+++ b/frontend/apps/main/src/features/command/providers/useConversationCommands.js
@@ -0,0 +1,438 @@
+import { computed } from 'vue'
+import { useRouter } from 'vue-router'
+import { useI18n } from 'vue-i18n'
+import {
+  CalendarClock,
+  CheckCircle2,
+  CircleDot,
+  Contact,
+  Download,
+  Flag,
+  Link2,
+  MailOpen,
+  MessageSquare,
+  PenLine,
+  RotateCcw,
+  Sparkles,
+  StickyNote,
+  Tag,
+  TagIcon,
+  UserCheck,
+  UserPlus,
+  UserX,
+  Users,
+  UsersRound,
+  Zap
+} from 'lucide-vue-next'
+import { useConversationStore } from '@main/stores/conversation'
+import { useUserStore } from '@main/stores/user'
+import { useUsersStore } from '@main/stores/users'
+import { useTeamStore } from '@main/stores/team'
+import { useTagStore } from '@main/stores/tag'
+import { useEmitter } from '@main/composables/useEmitter'
+import { EMITTER_EVENTS, CONVERSATION_ACTIONS } from '@main/constants/emitterEvents'
+import { permissions as perms } from '@main/constants/permissions'
+import { CONVERSATION_DEFAULT_STATUSES, TAG_ACTION } from '@main/constants/conversation'
+import { MACROS_COMMAND } from '../useCommandPalette'
+import { SECTIONS } from '../sections'
+
+export const SNOOZE_COMMAND = 'conv.snooze'
+export const SNOOZE_CUSTOM_COMMAND = 'conv.snooze.custom'
+
+const SNOOZE_PRESETS = [
+  { minutes: 60, unitKey: 'globals.terms.hour', count: 1 },
+  { minutes: 180, unitKey: 'globals.terms.hour', count: 3 },
+  { minutes: 360, unitKey: 'globals.terms.hour', count: 6 },
+  { minutes: 720, unitKey: 'globals.terms.hour', count: 12 },
+  { minutes: 1440, unitKey: 'globals.terms.day', count: 1 },
+  { minutes: 2880, unitKey: 'globals.terms.day', count: 2 },
+  { minutes: 4320, unitKey: 'globals.terms.day', count: 3 },
+  { minutes: 10080, unitKey: 'globals.terms.week', count: 1 }
+]
+
+const REOPENABLE_STATUSES = [
+  CONVERSATION_DEFAULT_STATUSES.RESOLVED,
+  CONVERSATION_DEFAULT_STATUSES.CLOSED,
+  CONVERSATION_DEFAULT_STATUSES.SNOOZED
+]
+
+export const formatSnoozeDuration = (minutes) =>
+  minutes < 60 ? `${minutes}m` : `${Math.floor(minutes / 60)}h`
+
+export function useConversationCommands({ openSnoozeDatePicker }) {
+  const router = useRouter()
+  const { t } = useI18n()
+  const emitter = useEmitter()
+  const conversationStore = useConversationStore()
+  const userStore = useUserStore()
+  const usersStore = useUsersStore()
+  const teamStore = useTeamStore()
+  const tagStore = useTagStore()
+
+  const section = SECTIONS.CONVERSATION
+
+  const snoozeCommands = () => [
+    {
+      id: SNOOZE_COMMAND,
+      label: t('globals.terms.snooze'),
+      section,
+      icon: CalendarClock,
+      permission: perms.CONVERSATIONS_UPDATE_STATUS,
+      group: true,
+      shortcut: ['Alt', 'Z'],
+      placeholder: t('command.snoozeFor')
+    },
+    ...SNOOZE_PRESETS.map(({ minutes, unitKey, count }) => ({
+      id: `conv.snooze.${minutes}`,
+      label: `${count} ${t(unitKey, count)}`,
+      parent: SNOOZE_COMMAND,
+      icon: CalendarClock,
+      run: () => conversationStore.snoozeConversation(formatSnoozeDuration(minutes))
+    })),
+    {
+      id: SNOOZE_CUSTOM_COMMAND,
+      label: t('globals.messages.pickDateAndTime'),
+      parent: SNOOZE_COMMAND,
+      icon: CalendarClock,
+      run: openSnoozeDatePicker
+    }
+  ]
+
+  const statusCommands = (conv) => {
+    const commands = []
+    const current = conv.status
+    if (current !== CONVERSATION_DEFAULT_STATUSES.RESOLVED) {
+      commands.push({
+        id: 'conv.resolve',
+        label: t('globals.terms.resolve'),
+        keywords: ['close', 'done'],
+        section,
+        icon: CheckCircle2,
+        permission: perms.CONVERSATIONS_UPDATE_STATUS,
+        shortcut: ['Alt', 'E'],
+        run: () => conversationStore.updateStatus(CONVERSATION_DEFAULT_STATUSES.RESOLVED)
+      })
+    }
+    if (REOPENABLE_STATUSES.includes(current)) {
+      commands.push({
+        id: 'conv.reopen',
+        label: t('globals.terms.reopen'),
+        keywords: [t('globals.terms.open')],
+        section,
+        icon: RotateCcw,
+        permission: perms.CONVERSATIONS_UPDATE_STATUS,
+        shortcut: ['Alt', 'O'],
+        run: () => conversationStore.updateStatus(CONVERSATION_DEFAULT_STATUSES.OPEN)
+      })
+    }
+    commands.push(...snoozeCommands())
+    commands.push({
+      id: 'conv.status',
+      label: t('actions.setStatus'),
+      keywords: [t('globals.terms.status')],
+      section,
+      icon: CircleDot,
+      permission: perms.CONVERSATIONS_UPDATE_STATUS,
+      group: true
+    })
+    for (const status of conversationStore.statusOptions) {
+      if (status.label === current) continue
+      const isSnooze = status.label === CONVERSATION_DEFAULT_STATUSES.SNOOZED
+      commands.push({
+        id: `conv.status.${status.value}`,
+        label: status.label,
+        parent: 'conv.status',
+        icon: isSnooze ? CalendarClock : CircleDot,
+        navigateTo: isSnooze ? SNOOZE_COMMAND : undefined,
+        run: isSnooze ? undefined : () => conversationStore.updateStatus(status.label)
+      })
+    }
+    return commands
+  }
+
+  const priorityCommands = (conv) => [
+    {
+      id: 'conv.priority',
+      label: t('actions.setPriority'),
+      keywords: [t('globals.terms.priority')],
+      section,
+      icon: Flag,
+      permission: perms.CONVERSATIONS_UPDATE_PRIORITY,
+      group: true,
+      shortcut: ['Alt', 'P']
+    },
+    ...conversationStore.priorityOptions
+      .filter((priority) => priority.label !== conv.priority)
+      .map((priority) => ({
+        id: `conv.priority.${priority.value}`,
+        label: priority.label,
+        parent: 'conv.priority',
+        icon: Flag,
+        run: () => {
+          conv.priority = priority.label
+          conv.priority_id = priority.value
+          return conversationStore.updatePriority(priority.label)
+        }
+      }))
+  ]
+
+  const assignAgent = (id) => {
+    conversationStore.current.assigned_user_id = id
+    return conversationStore.updateAssignee('user', { assignee_id: parseInt(id) })
+  }
+
+  const agentCommands = (conv) => {
+    const commands = []
+    if (conv.assigned_user_id !== userStore.userID) {
+      commands.push({
+        id: 'conv.assign-me',
+        label: t('conversation.assignSelfAction'),
+        keywords: ['self', 'me'],
+        section,
+        icon: UserCheck,
+        permission: perms.CONVERSATIONS_UPDATE_USER_ASSIGNEE,
+        run: () => assignAgent(userStore.userID)
+      })
+    }
+    commands.push({
+      id: 'conv.assign-agent',
+      label: t('actions.assignAgent'),
+      keywords: [t('globals.terms.agent')],
+      section,
+      icon: UserPlus,
+      permission: perms.CONVERSATIONS_UPDATE_USER_ASSIGNEE,
+      group: true,
+      shortcut: ['Alt', 'A'],
+      placeholder: t('command.searchAgents'),
+      search: async (term) =>
+        (await usersStore.searchUsers(term))
+          .filter((agent) => String(agent.value) !== String(conv.assigned_user_id))
+          .map((agent) => ({
+            id: `conv.assign-agent.${agent.value}`,
+            label: agent.label,
+            parent: 'conv.assign-agent',
+            icon: UserPlus,
+            run: () => assignAgent(agent.value)
+          }))
+    })
+    if (conv.assigned_user_id) {
+      commands.push({
+        id: 'conv.unassign-agent',
+        label: t('command.unassignAgent'),
+        keywords: [t('globals.terms.agent'), 'remove'],
+        section,
+        icon: UserX,
+        permission: perms.CONVERSATIONS_UPDATE_USER_ASSIGNEE,
+        run: () => conversationStore.removeAssignee('user')
+      })
+    }
+    return commands
+  }
+
+  const teamCommands = (conv) => {
+    const commands = [
+      {
+        id: 'conv.assign-team',
+        label: t('actions.assignTeam'),
+        keywords: [t('globals.terms.team')],
+        section,
+        icon: Users,
+        permission: perms.CONVERSATIONS_UPDATE_TEAM_ASSIGNEE,
+        group: true,
+        placeholder: t('command.searchTeams'),
+        search: async (term) =>
+          (await teamStore.searchTeams(term))
+            .filter((team) => String(team.value) !== String(conv.assigned_team_id))
+            .map((team) => ({
+              id: `conv.assign-team.${team.value}`,
+              label: team.label,
+              parent: 'conv.assign-team',
+              icon: UsersRound,
+              run: () =>
+                conversationStore.updateAssignee('team', { assignee_id: parseInt(team.value) })
+            }))
+      },
+      {
+        id: 'conv.suggest-tags',
+        label: t('conversation.sidebar.suggestTags'),
+        keywords: ['ai', t('globals.terms.tag')],
+        section,
+        icon: Sparkles,
+        permission: perms.CONVERSATIONS_UPDATE_TAGS,
+        run: () =>
+          emitter.emit(EMITTER_EVENTS.CONVERSATION_ACTION, CONVERSATION_ACTIONS.SUGGEST_TAGS)
+      }
+    ]
+    if (conv.assigned_team_id) {
+      commands.push({
+        id: 'conv.unassign-team',
+        label: t('command.unassignTeam'),
+        keywords: [t('globals.terms.team'), 'remove'],
+        section,
+        icon: UserX,
+        permission: perms.CONVERSATIONS_UPDATE_TEAM_ASSIGNEE,
+        run: () => conversationStore.removeAssignee('team')
+      })
+    }
+    return commands
+  }
+
+  const tagCommands = (conv) => {
+    const currentTags = conv.tags || []
+    const commands = [
+      {
+        id: 'conv.add-tag',
+        label: t('actions.addTags'),
+        keywords: [t('globals.terms.tag')],
+        section,
+        icon: Tag,
+        permission: perms.CONVERSATIONS_UPDATE_TAGS,
+        group: true,
+        placeholder: t('command.searchTags'),
+        search: async (term) =>
+          (await tagStore.searchTagNames(term))
+            .filter((tag) => !currentTags.includes(tag.value))
+            .map((tag) => ({
+              id: `conv.add-tag.${tag.value}`,
+              label: tag.label,
+              parent: 'conv.add-tag',
+              icon: TagIcon,
+              run: () =>
+                conversationStore.updateConversationTags(conv.uuid, TAG_ACTION.ADD, [tag.value])
+            }))
+      }
+    ]
+    if (currentTags.length) {
+      commands.push(
+        {
+          id: 'conv.remove-tag',
+          label: t('actions.removeTags'),
+          keywords: [t('globals.terms.tag')],
+          section,
+          icon: Tag,
+          permission: perms.CONVERSATIONS_UPDATE_TAGS,
+          group: true
+        },
+        ...currentTags.map((tag) => ({
+          id: `conv.remove-tag.${tag}`,
+          label: tag,
+          parent: 'conv.remove-tag',
+          icon: TagIcon,
+          run: () => conversationStore.updateConversationTags(conv.uuid, TAG_ACTION.REMOVE, [tag])
+        }))
+      )
+    }
+    return commands
+  }
+
+  const composeCommands = () => [
+    {
+      id: 'conv.reply',
+      label: t('command.switchToReply'),
+      keywords: [t('globals.terms.reply')],
+      section,
+      icon: MessageSquare,
+      permission: perms.MESSAGES_WRITE,
+      shortcut: ['Alt', 'R'],
+      run: () => emitter.emit(EMITTER_EVENTS.REPLY_BOX_SET_TYPE, 'reply')
+    },
+    {
+      id: 'conv.private-note',
+      label: t('command.switchToPrivateNote'),
+      keywords: [t('globals.terms.privateNote'), t('globals.terms.note')],
+      section,
+      icon: StickyNote,
+      permission: perms.MESSAGES_WRITE_PRIVATE,
+      shortcut: ['Alt', 'N'],
+      run: () => emitter.emit(EMITTER_EVENTS.REPLY_BOX_SET_TYPE, 'private_note')
+    },
+    {
+      id: 'conv.focus-reply',
+      label: t('command.focusReplyBox'),
+      keywords: [t('globals.terms.reply'), 'editor', 'compose'],
+      section,
+      icon: PenLine,
+      permission: [perms.MESSAGES_WRITE, perms.MESSAGES_WRITE_PRIVATE],
+      run: () => emitter.emit(EMITTER_EVENTS.REPLY_BOX_FOCUS)
+    }
+  ]
+
+  const copyLink = async () => {
+    await navigator.clipboard.writeText(window.location.href)
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, { description: t('globals.messages.copied') })
+  }
+
+  const miscCommands = (conv) => [
+    {
+      id: 'conv.macro',
+      label: t('actions.applyMacro'),
+      keywords: [t('globals.terms.macro')],
+      section,
+      icon: Zap,
+      shortcut: ['Ctrl', 'M'],
+      navigateTo: MACROS_COMMAND
+    },
+    {
+      id: 'conv.mark-unread',
+      label: t('globals.messages.markAsUnread'),
+      keywords: ['unread'],
+      section,
+      icon: MailOpen,
+      run: () => conversationStore.markAsUnread(conv.uuid)
+    },
+    {
+      id: 'conv.copy-link',
+      label: t('globals.messages.copyLink'),
+      keywords: [t('globals.terms.copy'), t('globals.terms.link'), 'url'],
+      section,
+      icon: Link2,
+      run: copyLink
+    },
+    {
+      id: 'conv.transcript',
+      label: t('conversation.downloadTranscript'),
+      keywords: ['export'],
+      section,
+      icon: Download,
+      run: () =>
+        emitter.emit(EMITTER_EVENTS.CONVERSATION_ACTION, CONVERSATION_ACTIONS.DOWNLOAD_TRANSCRIPT)
+    },
+    {
+      id: 'conv.summarize',
+      label: t('conversation.summarize'),
+      keywords: ['ai', t('globals.terms.summary')],
+      section,
+      icon: Sparkles,
+      permission: perms.MESSAGES_WRITE_PRIVATE,
+      run: () => emitter.emit(EMITTER_EVENTS.CONVERSATION_ACTION, CONVERSATION_ACTIONS.SUMMARIZE)
+    },
+    ...(conv.contact_id
+      ? [
+          {
+            id: 'conv.open-contact',
+            label: t('command.openContact'),
+            keywords: [t('globals.terms.contact')],
+            section,
+            icon: Contact,
+            permission: perms.CONTACTS_READ,
+            run: () => router.push({ name: 'contact-detail', params: { id: conv.contact_id } })
+          }
+        ]
+      : [])
+  ]
+
+  return computed(() => {
+    if (!conversationStore.isConversationOpen) return []
+    const conv = conversationStore.current
+    if (!conv) return []
+    return [
+      ...statusCommands(conv),
+      ...priorityCommands(conv),
+      ...agentCommands(conv),
+      ...teamCommands(conv),
+      ...tagCommands(conv),
+      ...miscCommands(conv),
+      ...composeCommands()
+    ]
+  })
+}
diff --git a/frontend/apps/main/src/features/command/providers/useCreateCommands.js b/frontend/apps/main/src/features/command/providers/useCreateCommands.js
new file mode 100644
index 00000000..f55d5e00
--- /dev/null
+++ b/frontend/apps/main/src/features/command/providers/useCreateCommands.js
@@ -0,0 +1,53 @@
+import { computed } from 'vue'
+import { useRouter } from 'vue-router'
+import { useI18n } from 'vue-i18n'
+import { Eye, MessageSquarePlus } from 'lucide-vue-next'
+import { navIconMap } from '@main/constants/navIcons'
+import { adminNavItems } from '@main/constants/navigation'
+import { permissions } from '@main/constants/permissions'
+import { useEmitter } from '@main/composables/useEmitter'
+import { EMITTER_EVENTS } from '@main/constants/emitterEvents'
+import { SECTIONS } from '../sections'
+
+export function useCreateCommands() {
+  const router = useRouter()
+  const { t } = useI18n()
+  const emitter = useEmitter()
+
+  const adminCreates = () =>
+    adminNavItems
+      .flatMap((group) => group.children)
+      .filter((item) => item.createRouteName)
+      .map((item) => ({
+        id: `create.${item.createRouteName}`,
+        label: t(router.resolve({ name: item.createRouteName }).meta.titleKey),
+        keywords: [t('globals.messages.create'), t('globals.terms.admin')],
+        section: SECTIONS.CREATE,
+        icon: navIconMap[item.icon],
+        permission: item.permission,
+        run: () => router.push({ name: item.createRouteName })
+      }))
+
+  return computed(() => [
+    {
+      id: 'create.conversation',
+      label: t('conversation.newConversation'),
+      keywords: [t('globals.messages.create')],
+      section: SECTIONS.ACTIONS,
+      icon: MessageSquarePlus,
+      permission: permissions.CONVERSATIONS_WRITE,
+      shortcut: ['Alt', 'C'],
+      run: () => emitter.emit(EMITTER_EVENTS.OPEN_CREATE_CONVERSATION, {})
+    },
+    {
+      id: 'create.view',
+      label: t('command.newView'),
+      keywords: [t('globals.messages.create'), t('globals.terms.view')],
+      section: SECTIONS.ACTIONS,
+      icon: Eye,
+      permission: permissions.VIEW_MANAGE,
+      run: () => emitter.emit(EMITTER_EVENTS.OPEN_VIEW_FORM)
+    },
+    ...adminCreates()
+  ])
+}
diff --git a/frontend/apps/main/src/features/command/providers/useEntitySearch.js b/frontend/apps/main/src/features/command/providers/useEntitySearch.js
new file mode 100644
index 00000000..1550d8ff
--- /dev/null
+++ b/frontend/apps/main/src/features/command/providers/useEntitySearch.js
@@ -0,0 +1,53 @@
+import { useRouter } from 'vue-router'
+import { Contact, MessageSquare } from 'lucide-vue-next'
+import { useUserStore } from '@main/stores/user'
+import { permissions as perms } from '@main/constants/permissions'
+import api from '@main/api'
+import { SECTIONS } from '../sections'
+
+export const ENTITY_SEARCH_MIN_LENGTH = 3
+
+const contactLabel = (contact) =>
+  [contact.first_name, contact.last_name].filter(Boolean).join(' ') || contact.email
+
+// Root-level searches that turn typed text into matching records, alongside the static commands.
+export function useEntitySearch() {
+  const router = useRouter()
+  const userStore = useUserStore()
+
+  const searchContacts = async (term) => {
+    if (!userStore.can(perms.CONTACTS_READ_ALL)) return []
+    const response = await api.searchContacts({ query: term })
+    return (response.data.data || []).map((contact) => ({
+      id: `search.contact.${contact.id}`,
+      label: contactLabel(contact),
+      hint: contact.email,
+      section: SECTIONS.CONTACT_RESULTS,
+      icon: Contact,
+      run: () => router.push({ name: 'contact-detail', params: { id: contact.id } })
+    }))
+  }
+
+  const searchConversations = async (term) => {
+    const response = await api.searchConversations({ query: term })
+    return (response.data.data || []).map((conversation) => ({
+      id: `search.conversation.${conversation.uuid}`,
+      label: conversation.subject || `#${conversation.reference_number}`,
+      hint: `#${conversation.reference_number} · ${conversation.status}`,
+      section: SECTIONS.CONVERSATION_RESULTS,
+      icon: MessageSquare,
+      run: () =>
+        router.push({
+          name: 'inbox-conversation',
+          params: { type: 'assigned', uuid: conversation.uuid }
+        })
+    }))
+  }
+
+  const search = async (term) => {
+    const results = await Promise.allSettled([searchContacts(term), searchConversations(term)])
+    return results.flatMap((result) => (result.status === 'fulfilled' ? result.value : []))
+  }
+
+  return { search }
+}
diff --git a/frontend/apps/main/src/features/command/providers/useListCommands.js b/frontend/apps/main/src/features/command/providers/useListCommands.js
new file mode 100644
index 00000000..8f3529df
--- /dev/null
+++ b/frontend/apps/main/src/features/command/providers/useListCommands.js
@@ -0,0 +1,88 @@
+import { computed } from 'vue'
+import { useRoute } from 'vue-router'
+import { useI18n } from 'vue-i18n'
+import { ArrowUpDown, CheckSquare, CircleDot, Filter } from 'lucide-vue-next'
+import { useConversationStore } from '@main/stores/conversation'
+import { useBulkActionPermissions } from '@main/composables/useBulkActionPermissions'
+import { SECTIONS } from '../sections'
+
+const SORT_FIELDS = [
+  'oldest',
+  'newest',
+  'started_first',
+  'started_last',
+  'waiting_longest',
+  'next_sla_target',
+  'priority_first'
+]
+
+export const isConversationListRoute = (route) =>
+  route.path.startsWith('/inboxes') && route.name !== 'search'
+
+export function useListCommands() {
+  const route = useRoute()
+  const { t } = useI18n()
+  const conversationStore = useConversationStore()
+  const { canBulkAct } = useBulkActionPermissions()
+
+  const section = SECTIONS.LIST
+
+  return computed(() => {
+    if (!isConversationListRoute(route)) return []
+    const commands = []
+
+    // Views are pre-filtered, the list header hides the status filter there too.
+    if (!route.params.viewID) {
+      commands.push(
+        {
+          id: 'list.status',
+          label: t('command.filterByStatus'),
+          keywords: [t('globals.terms.filter'), t('globals.terms.status')],
+          section,
+          icon: Filter,
+          group: true
+        },
+        ...conversationStore.statusOptions
+          .filter((status) => status.label !== conversationStore.getListStatus)
+          .map((status) => ({
+            id: `list.status.${status.value}`,
+            label: status.label,
+            parent: 'list.status',
+            icon: CircleDot,
+            run: () => conversationStore.setListStatus(status.label)
+          }))
+      )
+    }
+
+    commands.push(
+      {
+        id: 'list.sort',
+        label: t('globals.messages.sortBy'),
+        keywords: ['order'],
+        section,
+        icon: ArrowUpDown,
+        group: true
+      },
+      ...SORT_FIELDS.map((field) => ({
+        id: `list.sort.${field}`,
+        label: t(conversationStore.sortFieldI18nKeys[field]),
+        parent: 'list.sort',
+        icon: ArrowUpDown,
+        run: () => conversationStore.setListSortField(field)
+      }))
+    )
+
+    if (canBulkAct.value && conversationStore.conversationsList.length) {
+      commands.push({
+        id: 'list.select-all',
+        label: t('conversation.bulkActions.selectAll'),
+        keywords: ['bulk'],
+        section,
+        icon: CheckSquare,
+        run: () => conversationStore.selectAll()
+      })
+    }
+
+    return commands
+  })
+}
diff --git a/frontend/apps/main/src/features/command/providers/useNavigationCommands.js b/frontend/apps/main/src/features/command/providers/useNavigationCommands.js
new file mode 100644
index 00000000..aecb288c
--- /dev/null
+++ b/frontend/apps/main/src/features/command/providers/useNavigationCommands.js
@@ -0,0 +1,135 @@
+import { computed } from 'vue'
+import { useRouter } from 'vue-router'
+import { useI18n } from 'vue-i18n'
+import {
+  AtSign,
+  BookUser,
+  CircleUser,
+  Eye,
+  Inbox,
+  Layers,
+  Search,
+  UserX,
+  Users
+} from 'lucide-vue-next'
+import { navIconMap } from '@main/constants/navIcons'
+import { adminNavItems, reportsNavItems } from '@main/constants/navigation'
+import { permissions } from '@main/constants/permissions'
+import { useUserStore } from '@main/stores/user'
+import { useViewStore } from '@main/stores/view'
+import { useSharedViewStore } from '@main/stores/sharedView'
+import { useInboxNavigation } from '@main/composables/useInboxNavigation'
+import { SECTIONS } from '../sections'
+
+const INBOX_TYPES = [
+  { type: 'assigned', labelKey: 'conversation.myInbox', icon: Inbox },
+  { type: 'mentioned', labelKey: 'conversation.mentions', icon: AtSign },
+  { type: 'unassigned', labelKey: 'globals.terms.unassigned', icon: UserX },
+  { type: 'all', labelKey: 'globals.messages.all', icon: Layers }
+]
+
+export function useNavigationCommands() {
+  const router = useRouter()
+  const { t } = useI18n()
+  const userStore = useUserStore()
+  const viewStore = useViewStore()
+  const sharedViewStore = useSharedViewStore()
+  const { navigateToInbox, navigateToTeamInbox, navigateToViewInbox } = useInboxNavigation()
+
+  const goTo = (route) => () => router.push(route)
+
+  const navItemLabel = (item) => t(item.titleKey, item.isTitleKeyPlural ? 2 : 1)
+
+  const adminCommands = () =>
+    adminNavItems.flatMap((group) =>
+      group.children.map((item) => ({
+        id: `goto.admin.${item.href}`,
+        label: navItemLabel(item),
+        hint: navItemLabel(group),
+        keywords: [navItemLabel(group), t('globals.terms.admin')],
+        section: SECTIONS.GOTO,
+        icon: navIconMap[item.icon],
+        permission: item.permission,
+        run: goTo(item.href)
+      }))
+    )
+
+  const reportCommands = () =>
+    reportsNavItems.map((item) => ({
+      id: `goto.reports.${item.href}`,
+      label: navItemLabel(item),
+      hint: t('globals.terms.report', 2),
+      keywords: [t('globals.terms.report', 2)],
+      section: SECTIONS.GOTO,
+      icon: navIconMap[item.icon],
+      permission: item.permission,
+      run: goTo(item.href)
+    }))
+
+  return computed(() => [
+    ...INBOX_TYPES.map(({ type, labelKey, icon }) => ({
+      id: `goto.inbox.${type}`,
+      label: t(labelKey),
+      hint: t('globals.terms.inbox', 2),
+      keywords: [t('globals.terms.inbox', 2)],
+      section: SECTIONS.GOTO,
+      icon,
+      run: () => navigateToInbox(type)
+    })),
+    ...userStore.teams.map((team) => ({
+      id: `goto.team.${team.id}`,
+      label: team.name,
+      hint: t('globals.terms.teamInbox'),
+      keywords: [t('globals.terms.teamInbox'), t('globals.terms.team')],
+      section: SECTIONS.GOTO,
+      icon: Users,
+      run: () => navigateToTeamInbox(team.id)
+    })),
+    ...viewStore.views.map((view) => ({
+      id: `goto.view.${view.id}`,
+      label: view.name,
+      hint: t('globals.terms.view'),
+      keywords: [t('globals.terms.view')],
+      section: SECTIONS.GOTO,
+      icon: Eye,
+      permission: permissions.VIEW_MANAGE,
+      run: () => navigateToViewInbox(view.id)
+    })),
+    ...sharedViewStore.sharedViewList.map((view) => ({
+      id: `goto.shared-view.${view.id}`,
+      label: view.name,
+      hint: t('globals.terms.sharedView'),
+      keywords: [t('globals.terms.sharedView'), t('globals.terms.view')],
+      section: SECTIONS.GOTO,
+      icon: Eye,
+      run: () => navigateToViewInbox(view.id)
+    })),
+    {
+      id: 'goto.search',
+      label: t('conversation.search'),
+      section: SECTIONS.GOTO,
+      icon: Search,
+      run: goTo({ name: 'search' })
+    },
+    {
+      id: 'goto.contacts',
+      label: t('contact.allContacts'),
+      keywords: [t('globals.terms.contact', 2)],
+      section: SECTIONS.GOTO,
+      icon: BookUser,
+      permission: permissions.CONTACTS_READ_ALL,
+      run: goTo({ name: 'contacts' })
+    },
+    ...reportCommands(),
+    ...adminCommands(),
+    {
+      id: 'goto.profile',
+      label: t('globals.terms.profile'),
+      hint: t('globals.terms.account'),
+      keywords: [t('globals.terms.account')],
+      section: SECTIONS.GOTO,
+      icon: CircleUser,
+      run: goTo({ name: 'profile' })
+    }
+  ])
+}
diff --git a/frontend/apps/main/src/features/command/sections.js b/frontend/apps/main/src/features/command/sections.js
new file mode 100644
index 00000000..027eb777
--- /dev/null
+++ b/frontend/apps/main/src/features/command/sections.js
@@ -0,0 +1,45 @@
+export const SECTIONS = {
+  BULK: 'bulk',
+  CONVERSATION: 'conversation',
+  CONTACT: 'contact',
+  LIST: 'list',
+  ACTIONS: 'actions',
+  CREATE: 'create',
+  GOTO: 'goto',
+  ACCOUNT: 'account',
+  CONTACT_RESULTS: 'contact-results',
+  CONVERSATION_RESULTS: 'conversation-results'
+}
+
+// Contextual sections come first, global ones last.
+export const SECTION_ORDER = [
+  SECTIONS.BULK,
+  SECTIONS.CONVERSATION,
+  SECTIONS.CONTACT,
+  SECTIONS.LIST,
+  SECTIONS.ACTIONS,
+  SECTIONS.CREATE,
+  SECTIONS.GOTO,
+  SECTIONS.ACCOUNT,
+  SECTIONS.CONTACT_RESULTS,
+  SECTIONS.CONVERSATION_RESULTS
+]
+
+export const SECTION_LABEL_KEYS = {
+  [SECTIONS.BULK]: 'command.section.selectedConversations',
+  [SECTIONS.CONVERSATION]: 'globals.terms.conversation',
+  [SECTIONS.CONTACT]: 'globals.terms.contact',
+  [SECTIONS.LIST]: 'command.section.list',
+  [SECTIONS.ACTIONS]: 'globals.terms.action',
+  [SECTIONS.CREATE]: 'globals.messages.create',
+  [SECTIONS.GOTO]: 'command.section.goTo',
+  [SECTIONS.ACCOUNT]: 'globals.terms.account',
+  [SECTIONS.CONTACT_RESULTS]: 'globals.terms.contact',
+  [SECTIONS.CONVERSATION_RESULTS]: 'globals.terms.conversation'
+}
+
+export const SECTION_LABEL_PLURAL = new Set([
+  SECTIONS.ACTIONS,
+  SECTIONS.CONTACT_RESULTS,
+  SECTIONS.CONVERSATION_RESULTS
+])
diff --git a/frontend/apps/main/src/features/command/useCommandPalette.js b/frontend/apps/main/src/features/command/useCommandPalette.js
new file mode 100644
index 00000000..066b7b43
--- /dev/null
+++ b/frontend/apps/main/src/features/command/useCommandPalette.js
@@ -0,0 +1,51 @@
+import { ref } from 'vue'
+import { MACRO_CONTEXT } from '@main/constants/conversation'
+
+export const MACROS_COMMAND = 'macros'
+
+const open = ref(false)
+const parent = ref(null)
+const searchTerm = ref('')
+const macroContext = ref(MACRO_CONTEXT.REPLY)
+
+export function useCommandPalette() {
+  const openPalette = ({ parent: target = null } = {}) => {
+    parent.value = target
+    searchTerm.value = ''
+    open.value = true
+  }
+
+  const closePalette = () => {
+    open.value = false
+  }
+
+  const togglePalette = () => {
+    if (open.value) closePalette()
+    else openPalette({ parent: defaultParent() })
+  }
+
+  const setParent = (target) => {
+    parent.value = target
+    searchTerm.value = ''
+  }
+
+  // Ctrl+K inside the new-conversation dialog goes straight to macros.
+  const defaultParent = () =>
+    macroContext.value === MACRO_CONTEXT.NEW_CONVERSATION ? MACROS_COMMAND : null
+
+  const setMacroContext = (context) => {
+    macroContext.value = context
+  }
+
+  return {
+    open,
+    parent,
+    searchTerm,
+    macroContext,
+    openPalette,
+    closePalette,
+    togglePalette,
+    setParent,
+    setMacroContext
+  }
+}
diff --git a/frontend/apps/main/src/features/command/useCommandRegistry.js b/frontend/apps/main/src/features/command/useCommandRegistry.js
new file mode 100644
index 00000000..5826c05c
--- /dev/null
+++ b/frontend/apps/main/src/features/command/useCommandRegistry.js
@@ -0,0 +1,52 @@
+import { computed } from 'vue'
+import { useUserStore } from '@main/stores/user'
+
+export const normalizeSearchText = (text) =>
+  String(text || '')
+    .toLowerCase()
+    .replace(/\s+/g, ' ')
+    .trim()
+
+export const commandMatches = (command, term) => {
+  const needle = normalizeSearchText(term)
+  if (!needle) return true
+  const haystack = normalizeSearchText([command.label, ...(command.keywords || [])].join(' '))
+  return needle.split(' ').every((word) => haystack.includes(word))
+}
+
+export function useCommandRegistry(providers) {
+  const userStore = useUserStore()
+
+  const allowed = (command) => {
+    if (!command.permission) return true
+    const required = Array.isArray(command.permission) ? command.permission : [command.permission]
+    return required.some((permission) => userStore.can(permission))
+  }
+
+  // Children inherit their parent's visibility.
+  const commands = computed(() => {
+    const all = providers.flatMap((provider) => provider.value)
+    const byId = new Map(all.map((command) => [command.id, command]))
+    const visible = new Map()
+    const isVisible = (command) => {
+      if (visible.has(command.id)) return visible.get(command.id)
+      let result = allowed(command)
+      if (result && command.parent) {
+        const parent = byId.get(command.parent)
+        result = Boolean(parent) && isVisible(parent)
+      }
+      visible.set(command.id, result)
+      return result
+    }
+    return all.filter(isVisible)
+  })
+
+  const byId = computed(() => new Map(commands.value.map((command) => [command.id, command])))
+
+  const get = (id) => byId.value.get(id) || null
+
+  const childrenOf = (parentId) =>
+    commands.value.filter((command) => (command.parent || null) === (parentId || null))
+
+  return { commands, get, childrenOf }
+}
diff --git a/frontend/apps/main/src/features/command/useCommandRegistry.test.js b/frontend/apps/main/src/features/command/useCommandRegistry.test.js
new file mode 100644
index 00000000..5ed3a96c
--- /dev/null
+++ b/frontend/apps/main/src/features/command/useCommandRegistry.test.js
@@ -0,0 +1,79 @@
+import { describe, it, expect, vi } from 'vitest'
+import { computed, ref } from 'vue'
+
+const userMock = vi.hoisted(() => ({ allowed: [] }))
+
+vi.mock('@main/stores/user', () => ({
+  useUserStore: () => ({
+    can: (permission) => userMock.allowed.includes(permission)
+  })
+}))
+
+import { useCommandRegistry, commandMatches } from '@main/features/command/useCommandRegistry'
+
+const command = (id, overrides = {}) => ({ id, label: id, ...overrides })
+
+describe('useCommandRegistry', () => {
+  it('drops commands whose permission the user lacks', () => {
+    userMock.allowed = ['a:read']
+    const registry = useCommandRegistry([
+      computed(() => [
+        command('open'),
+        command('allowed', { permission: 'a:read' }),
+        command('denied', { permission: 'b:write' }),
+        command('any-of', { permission: ['b:write', 'a:read'] })
+      ])
+    ])
+    expect(registry.commands.value.map((c) => c.id)).toEqual(['open', 'allowed', 'any-of'])
+  })
+
+  it('hides children whose parent is hidden, even without their own permission', () => {
+    userMock.allowed = []
+    const registry = useCommandRegistry([
+      computed(() => [
+        command('group', { permission: 'x:manage', group: true }),
+        command('child', { parent: 'group' }),
+        command('orphan', { parent: 'missing' })
+      ])
+    ])
+    expect(registry.commands.value).toEqual([])
+    expect(registry.childrenOf('group')).toEqual([])
+  })
+
+  it('lists root commands and children separately', () => {
+    userMock.allowed = []
+    const registry = useCommandRegistry([
+      computed(() => [command('root'), command('group', { group: true }), command('child', { parent: 'group' })])
+    ])
+    expect(registry.childrenOf(null).map((c) => c.id)).toEqual(['root', 'group'])
+    expect(registry.childrenOf('group').map((c) => c.id)).toEqual(['child'])
+    expect(registry.get('child').parent).toBe('group')
+    expect(registry.get('nope')).toBeNull()
+  })
+
+  it('recomputes when a provider changes', () => {
+    userMock.allowed = []
+    const source = ref([command('one')])
+    const registry = useCommandRegistry([computed(() => source.value)])
+    expect(registry.commands.value).toHaveLength(1)
+    source.value = [command('one'), command('two')]
+    expect(registry.commands.value).toHaveLength(2)
+  })
+})
+
+describe('commandMatches', () => {
+  const resolve = command('resolve', { label: 'Resolve', keywords: ['close', 'done'] })
+
+  it('matches label and keywords case-insensitively', () => {
+    expect(commandMatches(resolve, 'RES')).toBe(true)
+    expect(commandMatches(resolve, 'close')).toBe(true)
+    expect(commandMatches(resolve, 'reopen')).toBe(false)
+  })
+
+  it('requires every typed word to match', () => {
+    const agents = command('agents', { label: 'Agents', keywords: ['Teammates'] })
+    expect(commandMatches(agents, 'team agent')).toBe(true)
+    expect(commandMatches(agents, 'team inbox')).toBe(false)
+    expect(commandMatches(agents, '   ')).toBe(true)
+  })
+})
diff --git a/frontend/apps/main/src/features/command/useGlobalShortcuts.js b/frontend/apps/main/src/features/command/useGlobalShortcuts.js
new file mode 100644
index 00000000..6329ed53
--- /dev/null
+++ b/frontend/apps/main/src/features/command/useGlobalShortcuts.js
@@ -0,0 +1,117 @@
+import { onMounted, onUnmounted } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
+import { useConversationStore } from '@main/stores/conversation'
+import { useUserStore } from '@main/stores/user'
+import { useEmitter } from '@main/composables/useEmitter'
+import { useKeyboardShortcutsDialog } from '@main/composables/useKeyboardShortcutsDialog'
+import { useBulkActionPermissions } from '@main/composables/useBulkActionPermissions'
+import { EMITTER_EVENTS } from '@main/constants/emitterEvents'
+import { permissions as perms } from '@main/constants/permissions'
+import { CONVERSATION_DEFAULT_STATUSES, MACRO_CONTEXT } from '@main/constants/conversation'
+import { MACROS_COMMAND, useCommandPalette } from './useCommandPalette'
+import { SNOOZE_COMMAND } from './providers/useConversationCommands'
+
+const isMod = (event) => event.ctrlKey || event.metaKey
+const onlyAlt = (event) => event.altKey && !event.ctrlKey && !event.metaKey && !event.shiftKey
+const dialogIsOpen = () => Boolean(document.querySelector('[role="dialog"][data-state="open"]'))
+
+// Alt combos work while typing in the editor, so no shortcut depends on where focus is.
+export function useGlobalShortcuts() {
+  const route = useRoute()
+  const router = useRouter()
+  const emitter = useEmitter()
+  const conversationStore = useConversationStore()
+  const userStore = useUserStore()
+  const palette = useCommandPalette()
+  const shortcutsDialog = useKeyboardShortcutsDialog()
+  const { canBulkAct } = useBulkActionPermissions()
+
+  const conversationOpen = () => conversationStore.isConversationOpen && conversationStore.current
+
+  const openMacros = () => {
+    const inNewConversation = palette.macroContext.value === MACRO_CONTEXT.NEW_CONVERSATION
+    if (!inNewConversation && !conversationOpen()) return false
+    palette.openPalette({ parent: MACROS_COMMAND })
+    return true
+  }
+
+  const openGroup = (parent, permission) => () => {
+    if (!conversationOpen() || !userStore.can(permission)) return false
+    palette.openPalette({ parent })
+    return true
+  }
+
+  const stepConversation = (step) => () => {
+    if (!conversationOpen() || !String(route.name).endsWith('-conversation')) return false
+    const list = conversationStore.conversationsList
+    const index = list.findIndex((c) => c.uuid === route.params.uuid)
+    if (index === -1) return false
+    const next = list[index + step]
+    if (!next) return false
+    router.push({ name: route.name, params: { ...route.params, uuid: next.uuid } })
+    return true
+  }
+
+  const setStatus = (status) => () => {
+    if (!conversationOpen() || !userStore.can(perms.CONVERSATIONS_UPDATE_STATUS)) return false
+    if (conversationStore.current.status !== status) conversationStore.updateStatus(status)
+    return true
+  }
+
+  const compose = (type, permission) => () => {
+    if (!conversationOpen() || !userStore.can(permission)) return false
+    emitter.emit(EMITTER_EVENTS.REPLY_BOX_SET_TYPE, type)
+    emitter.emit(EMITTER_EVENTS.REPLY_BOX_FOCUS)
+    return true
+  }
+
+  const toggleSelectCurrent = () => {
+    if (!conversationOpen() || !canBulkAct.value) return false
+    conversationStore.toggleSelect(conversationStore.current.uuid, false)
+    return true
+  }
+
+  const newConversation = () => {
+    if (!userStore.can(perms.CONVERSATIONS_WRITE)) return false
+    emitter.emit(EMITTER_EVENTS.OPEN_CREATE_CONVERSATION, {})
+    return true
+  }
+
+  const showShortcuts = () => {
+    palette.closePalette()
+    shortcutsDialog.show()
+    return true
+  }
+
+  // Keyed by event.code: on macOS Option+letter changes event.key to a symbol.
+  const altKeys = {
+    KeyJ: stepConversation(-1),
+    KeyK: stepConversation(1),
+    KeyZ: openGroup(SNOOZE_COMMAND, perms.CONVERSATIONS_UPDATE_STATUS),
+    KeyP: openGroup('conv.priority', perms.CONVERSATIONS_UPDATE_PRIORITY),
+    KeyA: openGroup('conv.assign-agent', perms.CONVERSATIONS_UPDATE_USER_ASSIGNEE),
+    KeyR: compose('reply', perms.MESSAGES_WRITE),
+    KeyN: compose('private_note', perms.MESSAGES_WRITE_PRIVATE),
+    KeyX: toggleSelectCurrent,
+    KeyC: newConversation,
+    KeyE: setStatus(CONVERSATION_DEFAULT_STATUSES.RESOLVED),
+    KeyO: setStatus(CONVERSATION_DEFAULT_STATUSES.OPEN)
+  }
+
+  const onKeydown = (event) => {
+    if (event.isComposing || event.repeat) return
+    let handled = false
+    if (isMod(event) && !event.shiftKey && !event.altKey) {
+      const key = event.key.toLowerCase()
+      if (key === 'k') handled = (palette.togglePalette(), true)
+      else if (key === 'm') handled = openMacros()
+      else if (event.key === '/') handled = showShortcuts()
+    } else if (onlyAlt(event) && altKeys[event.code] && !dialogIsOpen()) {
+      handled = altKeys[event.code]()
+    }
+    if (handled) event.preventDefault()
+  }
+
+  onMounted(() => window.addEventListener('keydown', onKeydown))
+  onUnmounted(() => window.removeEventListener('keydown', onKeydown))
+}
diff --git a/frontend/apps/main/src/features/contact/ContactNotes.vue b/frontend/apps/main/src/features/contact/ContactNotes.vue
index 5b539227..382aa3ba 100644
--- a/frontend/apps/main/src/features/contact/ContactNotes.vue
+++ b/frontend/apps/main/src/features/contact/ContactNotes.vue
@@ -182,7 +182,7 @@ const notesCache = new Map()
 </script>
 
 <script setup>
-import { ref, watch, computed } from 'vue'
+import { ref, watch, computed, onMounted, onUnmounted } from 'vue'
 import { format, formatDistanceToNow } from 'date-fns'
 import { Button } from '@shared-ui/components/ui/button'
 import { Card, CardHeader, CardContent } from '@shared-ui/components/ui/card'
@@ -208,7 +208,7 @@ import { PlusIcon, MoreVerticalIcon, TrashIcon, ClockIcon } from 'lucide-vue-nex
 import Editor from '@main/components/editor/ConversationEditor.vue'
 import { useI18n } from 'vue-i18n'
 import { useEmitter } from '@main/composables/useEmitter'
-import { EMITTER_EVENTS } from '@main/constants/emitterEvents.js'
+import { EMITTER_EVENTS, CONTACT_ACTIONS } from '@main/constants/emitterEvents.js'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
 import { getInitials } from '@shared-ui/utils/string'
 import { useUserStore } from '@main/stores/user'
@@ -268,6 +268,13 @@ const startAddingNote = () => {
   isAddingNote.value = true
 }
 
+const onPaletteAction = (action) => {
+  if (action === CONTACT_ACTIONS.ADD_NOTE && userStore.can('contact_notes:write')) startAddingNote()
+}
+
+onMounted(() => emitter.on(EMITTER_EVENTS.CONTACT_ACTION, onPaletteAction))
+onUnmounted(() => emitter.off(EMITTER_EVENTS.CONTACT_ACTION, onPaletteAction))
+
 const cancelAddNote = () => {
   isAddingNote.value = false
   newNote.value = ''
diff --git a/frontend/apps/main/src/features/conversation/Conversation.vue b/frontend/apps/main/src/features/conversation/Conversation.vue
index 4e9d404b..b682175d 100644
--- a/frontend/apps/main/src/features/conversation/Conversation.vue
+++ b/frontend/apps/main/src/features/conversation/Conversation.vue
@@ -87,7 +87,7 @@
 </template>
 
 <script setup>
-import { computed, ref } from 'vue'
+import { computed, ref, onMounted, onUnmounted } from 'vue'
 import { useConversationStore } from '@main/stores/conversation'
 import { useUserStore } from '@main/stores/user'
 import { Clock, MoreHorizontal, ChevronLeft, PanelRight } from 'lucide-vue-next'
@@ -104,7 +104,9 @@ import { formatMessageTimestamp } from '@shared-ui/utils/datetime.js'
 import { Button } from '@shared-ui/components/ui/button'
 import MessageList from '@/features/conversation/message/MessageList.vue'
 import ReplyBox from './ReplyBox.vue'
-import { EMITTER_EVENTS } from '@main/constants/emitterEvents.js'
+import { EMITTER_EVENTS, CONVERSATION_ACTIONS } from '@main/constants/emitterEvents.js'
+import { useCommandPalette } from '@/features/command/useCommandPalette'
+import { SNOOZE_COMMAND } from '@/features/command/providers/useConversationCommands'
 import { CONVERSATION_DEFAULT_STATUSES } from '@main/constants/conversation'
 import { useEmitter } from '@main/composables/useEmitter'
 import { useI18n } from 'vue-i18n'
@@ -115,6 +117,7 @@ import { permissions as perms } from '@main/constants/permissions.js'
 const conversationStore = useConversationStore()
 const userStore = useUserStore()
 const emitter = useEmitter()
+const palette = useCommandPalette()
 const { t } = useI18n()
 const route = useRoute()
 const router = useRouter()
@@ -182,12 +185,18 @@ const summarize = async () => {
 
 const handleUpdateStatus = (status) => {
   if (status === CONVERSATION_DEFAULT_STATUSES.SNOOZED) {
-    emitter.emit(EMITTER_EVENTS.SET_NESTED_COMMAND, {
-      command: 'snooze',
-      open: true
-    })
+    palette.openPalette({ parent: SNOOZE_COMMAND })
     return
   }
   conversationStore.updateStatus(status)
 }
+
+const paletteActions = {
+  [CONVERSATION_ACTIONS.DOWNLOAD_TRANSCRIPT]: downloadTranscript,
+  [CONVERSATION_ACTIONS.SUMMARIZE]: summarize
+}
+const onPaletteAction = (action) => paletteActions[action]?.()
+
+onMounted(() => emitter.on(EMITTER_EVENTS.CONVERSATION_ACTION, onPaletteAction))
+onUnmounted(() => emitter.off(EMITTER_EVENTS.CONVERSATION_ACTION, onPaletteAction))
 </script>
diff --git a/frontend/apps/main/src/features/conversation/CreateConversation.vue b/frontend/apps/main/src/features/conversation/CreateConversation.vue
index d6673a3e..5dcfc232 100644
--- a/frontend/apps/main/src/features/conversation/CreateConversation.vue
+++ b/frontend/apps/main/src/features/conversation/CreateConversation.vue
@@ -289,11 +289,16 @@ import { IdCard } from 'lucide-vue-next'
 import api from '@/api'
 import { hasPendingInlineUpload } from '@main/composables/useInlineImageUpload'
 import { useIsComposerCramped } from '@main/composables/useIsComposerCramped'
+import { useCommandPalette } from '@/features/command/useCommandPalette'
 
 const dialogOpen = defineModel({
   required: false,
   default: () => false
 })
+const props = defineProps({
+  initialContact: { type: Object, default: null }
+})
+const palette = useCommandPalette()
 
 const inboxStore = useInboxStore()
 const { t } = useI18n()
@@ -353,19 +358,14 @@ onUnmounted(() => {
   clearMediaFiles()
   conversationStore.resetMacro(MACRO_CONTEXT.NEW_CONVERSATION)
   macroStore.setCurrentView(previousMacroView)
-  emitter.emit(EMITTER_EVENTS.SET_NESTED_COMMAND, {
-    command: null,
-    open: false
-  })
+  palette.setMacroContext(MACRO_CONTEXT.REPLY)
 })
 
 onMounted(() => {
   previousMacroView = macroStore.currentView
   macroStore.setCurrentView('starting_conversation')
-  emitter.emit(EMITTER_EVENTS.SET_NESTED_COMMAND, {
-    command: 'apply-macro-to-new-conversation',
-    open: false
-  })
+  palette.setMacroContext(MACRO_CONTEXT.NEW_CONVERSATION)
+  if (props.initialContact?.email) selectContact(props.initialContact)
   nextTick(() => {
     emailInputRef.value?.$el?.focus()
   })
diff --git a/frontend/apps/main/src/features/conversation/ReplyBox.vue b/frontend/apps/main/src/features/conversation/ReplyBox.vue
index 2df3b897..be7bd981 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBox.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBox.vue
@@ -298,12 +298,23 @@ const handleCopilotInsertReply = (html) => {
   htmlContent.value = html
 }
 
+const setMessageTypeFromPalette = (type) => {
+  if (isGenerating.value || !isAllowedMessageType(type)) return
+  messageType.value = type
+}
+
+const focusFromPalette = () => replyBoxContentRef.value?.focus()
+
 onMounted(() => {
   emitter.on(EMITTER_EVENTS.COPILOT_INSERT_REPLY, handleCopilotInsertReply)
+  emitter.on(EMITTER_EVENTS.REPLY_BOX_SET_TYPE, setMessageTypeFromPalette)
+  emitter.on(EMITTER_EVENTS.REPLY_BOX_FOCUS, focusFromPalette)
 })
 
 onUnmounted(() => {
   emitter.off(EMITTER_EVENTS.COPILOT_INSERT_REPLY, handleCopilotInsertReply)
+  emitter.off(EMITTER_EVENTS.REPLY_BOX_SET_TYPE, setMessageTypeFromPalette)
+  emitter.off(EMITTER_EVENTS.REPLY_BOX_FOCUS, focusFromPalette)
 })
 
 /**
diff --git a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
index b28f8f8c..7d15ff58 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
@@ -102,6 +102,7 @@
         @send="handleSend"
         @mentionsChanged="handleMentionsChanged"
         @filesDropped="handleFilesDropped"
+        @toggleMessageType="toggleMessageType"
       />
     </div>
 
@@ -219,6 +220,11 @@ const handleMentionsChanged = (newMentions) => {
   mentions.value = newMentions
 }
 
+const toggleMessageType = () => {
+  if (props.isGenerating || !props.canSendReply || !props.canSendPrivateNote) return
+  messageType.value = messageType.value === 'private_note' ? 'reply' : 'private_note'
+}
+
 const props = defineProps({
   isFullscreen: {
     type: Boolean,
diff --git a/frontend/apps/main/src/features/conversation/list/ConversationBulkActionToolbar.vue b/frontend/apps/main/src/features/conversation/list/ConversationBulkActionToolbar.vue
index 65711c02..ed893f75 100644
--- a/frontend/apps/main/src/features/conversation/list/ConversationBulkActionToolbar.vue
+++ b/frontend/apps/main/src/features/conversation/list/ConversationBulkActionToolbar.vue
@@ -115,7 +115,6 @@
 </template>
 
 <script setup>
-import { ref } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { UserPlus, Users, Tag, CircleDot, Loader2, X } from 'lucide-vue-next'
 import { Button } from '@shared-ui/components/ui/button'
@@ -129,17 +128,13 @@ import {
 import SelectAgentCombobox from '@main/components/combobox/SelectAgentCombobox.vue'
 import SelectTeamCombobox from '@main/components/combobox/SelectTeamCombobox.vue'
 import SelectTagCombobox from '@main/components/combobox/SelectTagCombobox.vue'
-import { TAG_ACTION } from '@/constants/conversation'
 import { useConversationStore } from '@/stores/conversation'
-import { useEmitter } from '@/composables/useEmitter'
-import { EMITTER_EVENTS } from '@/constants/emitterEvents'
 import { useBulkActionPermissions } from '@/composables/useBulkActionPermissions'
-import api from '@/api'
+import { useBulkActions } from '@/composables/useBulkActions'
 
 const conversationStore = useConversationStore()
 const { t } = useI18n()
-const emitter = useEmitter()
-const bulkLoading = ref(false)
+const { bulkLoading, bulkAssign, bulkAddTag, bulkUpdateStatus } = useBulkActions()
 
 const { canAssignAgent, canAssignTeam, canUpdateStatus, canUpdateTags } = useBulkActionPermissions()
 
@@ -151,45 +146,7 @@ const toggleSelectAll = () => {
   }
 }
 
-const runBulkAction = async (actionFn) => {
-  const uuids = [...conversationStore.selectedUUIDs]
-  bulkLoading.value = true
-  const results = await Promise.allSettled(uuids.map((uuid) => actionFn(uuid)))
-  bulkLoading.value = false
+const onAssigneeSelect = (assigneeType, item) => bulkAssign(assigneeType, item.value)
 
-  const hasFailures = results.some((r) => r.status === 'rejected')
-
-  conversationStore.clearSelection()
-  conversationStore.fetchFirstPageConversations()
-  conversationStore.fetchSidebarCounts({ force: true })
-
-  if (hasFailures) {
-    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
-      variant: 'destructive',
-      title: t('globals.terms.error', 1),
-      description: t('conversation.bulkActions.failedToast')
-    })
-  } else {
-    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
-      description: t('conversation.bulkActions.successToast')
-    })
-  }
-}
-
-const onAssigneeSelect = (assigneeType, item) => {
-  if (item.value === 'none') {
-    runBulkAction((uuid) => api.removeAssignee(uuid, assigneeType))
-    return
-  }
-  const assigneeId = parseInt(item.value, 10)
-  runBulkAction((uuid) => api.updateAssignee(uuid, assigneeType, { assignee_id: assigneeId }))
-}
-
-const onTagSelect = (item) => {
-  runBulkAction((uuid) => conversationStore.updateConversationTags(uuid, TAG_ACTION.ADD, [item.value]))
-}
-
-const bulkUpdateStatus = (status) => {
-  runBulkAction((uuid) => api.updateConversationStatus(uuid, { status }))
-}
+const onTagSelect = (item) => bulkAddTag(item.value)
 </script>
diff --git a/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBar.vue b/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBar.vue
index 64843c4e..754a23c7 100644
--- a/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBar.vue
+++ b/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBar.vue
@@ -152,7 +152,7 @@
 </template>
 
 <script setup>
-import { ref, computed, watch } from 'vue'
+import { ref, computed, watch, onMounted, onUnmounted } from 'vue'
 import { Sparkles, Loader2, Plus } from 'lucide-vue-next'
 import { Button } from '@shared-ui/components/ui/button'
 import { useConversationStore } from '@/stores/conversation'
@@ -169,7 +169,7 @@ import ConversationInfo from './ConversationInfo.vue'
 import ConversationSideBarContact from '@/features/conversation/sidebar/ConversationSideBarContact.vue'
 import CopilotPanel from '@/features/conversation/sidebar/CopilotPanel.vue'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
-import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
+import { EMITTER_EVENTS, CONVERSATION_ACTIONS } from '@/constants/emitterEvents.js'
 import { useEmitter } from '@/composables/useEmitter'
 import { useI18n } from 'vue-i18n'
 import { useStorage } from '@vueuse/core'
@@ -241,6 +241,13 @@ const suggestTags = async () => {
   }
 }
 
+const onPaletteAction = (action) => {
+  if (action === CONVERSATION_ACTIONS.SUGGEST_TAGS) suggestTags()
+}
+
+onMounted(() => emitter.on(EMITTER_EVENTS.CONVERSATION_ACTION, onPaletteAction))
+onUnmounted(() => emitter.off(EMITTER_EVENTS.CONVERSATION_ACTION, onPaletteAction))
+
 const applySuggestedTag = (tag) => {
   const conv = conversationStore.current
   if (!conv) return
diff --git a/frontend/apps/main/src/stores/contact.js b/frontend/apps/main/src/stores/contact.js
new file mode 100644
index 00000000..15adcacd
--- /dev/null
+++ b/frontend/apps/main/src/stores/contact.js
@@ -0,0 +1,17 @@
+import { ref } from 'vue'
+import { defineStore } from 'pinia'
+
+// The contact currently open on the contact detail page.
+export const useContactStore = defineStore('contact', () => {
+    const current = ref(null)
+
+    const setCurrent = (contact) => {
+        current.value = contact
+    }
+
+    const clearCurrent = () => {
+        current.value = null
+    }
+
+    return { current, setCurrent, clearCurrent }
+})
diff --git a/frontend/apps/main/src/stores/conversation.js b/frontend/apps/main/src/stores/conversation.js
index b47418e4..74031bbd 100644
--- a/frontend/apps/main/src/stores/conversation.js
+++ b/frontend/apps/main/src/stores/conversation.js
@@ -1287,6 +1287,7 @@ export const useConversationStore = defineStore('conversation', () => {
     setMacroActions,
     removeAssignee,
     getListSortField,
+    sortFieldI18nKeys,
     getListStatus,
     statuses,
     priorities,
diff --git a/frontend/apps/main/src/stores/view.js b/frontend/apps/main/src/stores/view.js
new file mode 100644
index 00000000..8ebea63d
--- /dev/null
+++ b/frontend/apps/main/src/stores/view.js
@@ -0,0 +1,25 @@
+import { ref } from 'vue'
+import { defineStore } from 'pinia'
+import { handleHTTPError } from '@shared-ui/utils/http.js'
+import { useEmitter } from '@/composables/useEmitter'
+import { EMITTER_EVENTS } from '@/constants/emitterEvents'
+import api from '@/api'
+
+export const useViewStore = defineStore('view', () => {
+    const emitter = useEmitter()
+    const views = ref([])
+
+    const fetchViews = async () => {
+        try {
+            const response = await api.getCurrentUserViews()
+            views.value = response.data.data
+        } catch (error) {
+            emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+                variant: 'destructive',
+                description: handleHTTPError(error).message
+            })
+        }
+    }
+
+    return { views, fetchViews }
+})
diff --git a/frontend/apps/main/src/views/contact/ContactDetailView.vue b/frontend/apps/main/src/views/contact/ContactDetailView.vue
index b4fe9c85..62388117 100644
--- a/frontend/apps/main/src/views/contact/ContactDetailView.vue
+++ b/frontend/apps/main/src/views/contact/ContactDetailView.vue
@@ -142,7 +142,7 @@
 </template>
 
 <script setup>
-import { ref, onMounted, computed } from 'vue'
+import { ref, onMounted, onUnmounted, computed } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { format } from 'date-fns'
 import { useI18n } from 'vue-i18n'
@@ -169,6 +169,7 @@ import {
   DropdownMenuSeparator
 } from '@shared-ui/components/ui/dropdown-menu'
 import { useUserStore } from '@/stores/user'
+import { useContactStore } from '@/stores/contact'
 import {
   ShieldOffIcon,
   ShieldCheckIcon,
@@ -184,7 +185,7 @@ import ContactForm from '@/features/contact/ContactForm.vue'
 import ContactNotes from '@/features/contact/ContactNotes.vue'
 import { createFormSchema } from '@/features/contact/formSchema.js'
 import { useEmitter } from '@/composables/useEmitter'
-import { EMITTER_EVENTS } from '@/constants/emitterEvents'
+import { EMITTER_EVENTS, CONTACT_ACTIONS } from '@/constants/emitterEvents'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
 import { downloadBlobResponse, parseBlobError } from '@shared-ui/utils/file'
 import { CustomBreadcrumb } from '@shared-ui/components/ui/breadcrumb'
@@ -199,6 +200,7 @@ const contact = ref(null)
 const showBlockConfirmation = ref(false)
 const showDeleteConfirmation = ref(false)
 const userStore = useUserStore()
+const contactStore = useContactStore()
 
 const form = useForm({
   validationSchema: toTypedSchema(createFormSchema(t))
@@ -216,13 +218,29 @@ const breadcrumbLinks = [
   { path: '', label: t('contact.editContact') }
 ]
 
-onMounted(fetchContact)
+const paletteActions = {
+  [CONTACT_ACTIONS.TOGGLE_BLOCK]: () => (showBlockConfirmation.value = true),
+  [CONTACT_ACTIONS.EXPORT]: () => exportContact(),
+  [CONTACT_ACTIONS.DELETE]: () => (showDeleteConfirmation.value = true)
+}
+const onPaletteAction = (action) => paletteActions[action]?.()
+
+onMounted(() => {
+  emitter.on(EMITTER_EVENTS.CONTACT_ACTION, onPaletteAction)
+  fetchContact()
+})
+
+onUnmounted(() => {
+  emitter.off(EMITTER_EVENTS.CONTACT_ACTION, onPaletteAction)
+  contactStore.clearCurrent()
+})
 
 async function fetchContact() {
   formLoading.value = true
   try {
     const { data } = await api.getContact(route.params.id)
     contact.value = data.data
+    contactStore.setCurrent(data.data)
     form.setValues(data.data, false)
   } catch (err) {
     showError(err)
diff --git a/frontend/cypress/e2e/ui/conversationLifecycle.cy.js b/frontend/cypress/e2e/ui/conversationLifecycle.cy.js
index 0f4d6d16..7f819d14 100644
--- a/frontend/cypress/e2e/ui/conversationLifecycle.cy.js
+++ b/frontend/cypress/e2e/ui/conversationLifecycle.cy.js
@@ -132,6 +132,24 @@ describe('Conversation lifecycle', () => {
     statusBadge().should('contain.text', 'Open')
   })
 
+  it('focuses the date button when the custom snooze picker opens', () => {
+    openConversation()
+    cy.get('body').trigger('keydown', { key: 'z', code: 'KeyZ', altKey: true })
+    cy.get('[cmdk-input-wrapper] input').type('pick{enter}')
+    cy.contains('button', 'Pick a date').should('be.focused')
+  })
+
+  it('suggests tags from the command palette for an open conversation', () => {
+    cy.intercept('POST', '**/api/v1/ai/suggest-tags', { body: { data: [] } }).as('suggestTags')
+
+    openConversation()
+    cy.get('body').trigger('keydown', { key: 'k', code: 'KeyK', ctrlKey: true })
+    cy.get('[cmdk-input-wrapper] input').type('suggest tags')
+    cy.contains('[role="option"]', 'Suggest tags').click()
+
+    cy.wait('@suggestTags').its('request.body.conversation_uuid').should('eq', conversationUuid)
+  })
+
   it('assigns the conversation to an agent', () => {
     cy.intercept('PUT', `**/conversations/${conversationUuid}/assignee/user`).as('assignAgent')
 
diff --git a/frontend/shared-ui/components/ui/command/Command.vue b/frontend/shared-ui/components/ui/command/Command.vue
index 1b9955e5..4e69c22e 100644
--- a/frontend/shared-ui/components/ui/command/Command.vue
+++ b/frontend/shared-ui/components/ui/command/Command.vue
@@ -9,6 +9,7 @@ const props = defineProps({
   open: { type: Boolean, required: false, default: true },
   defaultOpen: { type: Boolean, required: false },
   searchTerm: { type: String, required: false },
+  selectedValue: { type: null, required: false },
   multiple: { type: Boolean, required: false },
   disabled: { type: Boolean, required: false },
   name: { type: String, required: false },
@@ -21,7 +22,12 @@ const props = defineProps({
   class: { type: null, required: false }
 })
 
-const emits = defineEmits(['update:modelValue', 'update:open', 'update:searchTerm'])
+const emits = defineEmits([
+  'update:modelValue',
+  'update:open',
+  'update:searchTerm',
+  'update:selectedValue'
+])
 
 const delegatedProps = computed(() => {
   const { class: _, ...delegated } = props
diff --git a/frontend/shared-ui/components/ui/command/CommandDialog.vue b/frontend/shared-ui/components/ui/command/CommandDialog.vue
index e41d1bce..4a86b3b4 100644
--- a/frontend/shared-ui/components/ui/command/CommandDialog.vue
+++ b/frontend/shared-ui/components/ui/command/CommandDialog.vue
@@ -9,16 +9,18 @@ const props = defineProps({
   defaultOpen: { type: Boolean, required: false },
   modal: { type: Boolean, required: false },
   searchTerm: { type: String, required: false },
+  selectedValue: { type: null, required: false },
   filterFunction: { type: Function, required: false },
   class: { type: String, required: false },
   commandClass: { type: String, required: false }
 })
-const emits = defineEmits(['update:open', 'update:searchTerm'])
+const emits = defineEmits(['update:open', 'update:searchTerm', 'update:selectedValue'])
 
 const delegatedProps = computed(() => {
   const delegated = { ...props }
   delete delegated.class
   delete delegated.commandClass
+  delete delegated.selectedValue
   return delegated
 })
 
@@ -30,8 +32,10 @@ const forwarded = useForwardPropsEmits(delegatedProps, emits)
     <DialogContent :class="['overflow-hidden p-0 shadow-lg', props.class]">
       <Command
         :search-term="props.searchTerm"
+        :selected-value="props.selectedValue"
         :filter-function="props.filterFunction"
         @update:search-term="$emit('update:searchTerm', $event)"
+        @update:selected-value="$emit('update:selectedValue', $event)"
         :class="[
           '[&_[cmdk-group-heading]]:px-2 [&_[cmdk-group-heading]]:font-medium [&_[cmdk-group-heading]]:text-muted-foreground [&_[cmdk-group]:not([hidden])_~[cmdk-group]]:pt-0 [&_[cmdk-group]]:px-2 [&_[cmdk-input-wrapper]_svg]:h-5 [&_[cmdk-input-wrapper]_svg]:w-5 [&_[cmdk-input]]:h-12 [&_[cmdk-item]]:px-2 [&_[cmdk-item]]:py-2 [&_[cmdk-item]_svg]:h-5 [&_[cmdk-item]_svg]:w-5',
           props.commandClass
diff --git a/i18n/en-US.json b/i18n/en-US.json
index b84e00bf..3de2a7e4 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -625,13 +625,35 @@
   "businessHour.edit": "Edit business hour",
   "businessHour.new": "New business hour",
   "businessHour.newHoliday": "New holiday",
+  "command.disableReassignReplies": "Disable reassign replies",
+  "command.enableReassignReplies": "Enable reassign replies",
+  "command.filterByStatus": "Filter by status",
+  "command.focusReplyBox": "Focus reply box",
   "command.navigate": "Navigate",
+  "command.newView": "New view",
   "command.noCommandAvailable": "No command available",
+  "command.openContact": "Open contact",
   "command.pickSnoozeTime": "Pick a snooze time",
   "command.replyPreview": "Reply Preview",
+  "command.searchAgents": "Search agents...",
+  "command.searchMacros": "Search macros...",
+  "command.searchOrJumpTo": "Search or jump to...",
+  "command.searchTags": "Search tags...",
+  "command.searchTeams": "Search teams...",
+  "command.section.goTo": "Go to",
+  "command.section.list": "Conversation list",
+  "command.section.selectedConversations": "Selected conversations",
   "command.selectAMacro": "Select a macro to view details",
+  "command.setAway": "Set status to away",
+  "command.setOnline": "Set status to online",
   "command.snoozeFor": "Snooze for",
-  "command.typeCmdOrSearch": "Type a command or search...",
+  "command.startConversationWithContact": "Start conversation with contact",
+  "command.switchToDarkMode": "Switch to dark mode",
+  "command.switchToLightMode": "Switch to light mode",
+  "command.switchToPrivateNote": "Switch to private note",
+  "command.switchToReply": "Switch to reply",
+  "command.unassignAgent": "Unassign agent",
+  "command.unassignTeam": "Unassign team",
   "confirm.deleteContextLink": "This action cannot be undone. This will permanently delete this context link.",
   "confirm.deleteInbox": "This action cannot be undone. This will permanently delete this inbox.",
   "confirm.deleteMacro": "This action cannot be undone. This will permanently delete this macro.",
@@ -811,6 +833,7 @@
   "globals.messages.connectionFailedRefresh": "Connection failed. Please refresh.",
   "globals.messages.continueConversation": "Continue your conversation",
   "globals.messages.copied": "Copied to clipboard",
+  "globals.messages.copyLink": "Copy link",
   "globals.messages.correctEmailErrors": "Please correct the email errors",
   "globals.messages.coverImageUrl": "Cover image URL",
   "globals.messages.create": "Create",
@@ -889,6 +912,7 @@
   "globals.messages.showLess": "Show less",
   "globals.messages.showMore": "Show more",
   "globals.messages.somethingWentWrong": "Something went wrong",
+  "globals.messages.sortBy": "Sort by",
   "globals.messages.startNewConversation": "Start new conversation",
   "globals.messages.startTypingToSearch": "Start typing to search...",
   "globals.messages.strongPassword": "Password must be between {min} and {max} characters long, should contain at least one uppercase letter, one lowercase letter, one number, and one special character.",
@@ -1083,6 +1107,7 @@
   "globals.terms.regex": "Regex | Regexes",
   "globals.terms.regexHint": "Regex hint",
   "globals.terms.remove": "Remove",
+  "globals.terms.reopen": "Reopen",
   "globals.terms.reply": "Reply | Replies",
   "globals.terms.report": "Report | Reports",
   "globals.terms.required": "Required",
@@ -1434,8 +1459,11 @@
   "sharedView.allAgents": "All agents",
   "sharedView.editSharedView": "Edit shared view",
   "sharedView.new": "New shared view",
+  "shortcuts.nextConversation": "Next conversation",
   "shortcuts.openCommandBar": "Open command bar",
+  "shortcuts.previousConversation": "Previous conversation",
   "shortcuts.replyEditor": "Reply editor",
+  "shortcuts.toggleReplyType": "Switch between reply and private note",
   "sla.deletionConfirmation": "This action cannot be undone. This will permanently delete this SLA policy.",
   "sla.edit": "Edit SLA policy",
   "sla.enterDuration": "Enter duration",
diff --git a/internal/conversation/conversation.go b/internal/conversation/conversation.go
index 59b09a30..438ce9bf 100644
--- a/internal/conversation/conversation.go
+++ b/internal/conversation/conversation.go
@@ -1672,6 +1672,26 @@ func (m *Manager) resolveNotifyRecipients(entries []string, conv models.Conversa
 	return ids
 }
 
+// UnassignConversationUser removes the assigned user and records the removal activity.
+func (m *Manager) UnassignConversationUser(uuid string, actor umodels.User) error {
+	conversation, err := m.GetConversation(0, uuid, "")
+	if err != nil {
+		return err
+	}
+	previousAssigneeID := conversation.AssignedUserID.Int
+
+	if err := m.RemoveConversationAssignee(uuid, models.AssigneeTypeUser, actor); err != nil {
+		return err
+	}
+
+	if previousAssigneeID > 0 {
+		if err := m.RecordAssigneeUserRemoval(uuid, previousAssigneeID, actor); err != nil {
+			m.lo.Error("error recording assignee removal", "uuid", uuid, "assignee_id", previousAssigneeID, "error", err)
+		}
+	}
+	return nil
+}
+
 // RemoveConversationAssignee removes assigned user from a conversation.
 func (m *Manager) RemoveConversationAssignee(uuid, typ string, actor umodels.User) error {
 	prev, prevErr := m.GetConversationListItem(uuid)
diff --git a/internal/conversation/message.go b/internal/conversation/message.go
index 1706eb6a..2bd5af5c 100644
--- a/internal/conversation/message.go
+++ b/internal/conversation/message.go
@@ -688,6 +688,19 @@ func (m *Manager) RecordAssigneeUserChange(conversationUUID string, assigneeID i
 	return m.InsertConversationActivity(models.ActivityAssignedUserChange, conversationUUID, assignee.FullName(), actor)
 }
 
+// RecordAssigneeUserRemoval records an activity for the removal of a user assignee.
+func (m *Manager) RecordAssigneeUserRemoval(conversationUUID string, assigneeID int, actor umodels.User) error {
+	if assigneeID == actor.ID {
+		return m.InsertConversationActivity(models.ActivitySelfUnassign, conversationUUID, actor.FullName(), actor)
+	}
+
+	assignee, err := m.userStore.GetAgent(assigneeID, "")
+	if err != nil {
+		return err
+	}
+	return m.InsertConversationActivity(models.ActivityAssigneeUserRemoved, conversationUUID, assignee.FullName(), actor)
+}
+
 // RecordAssigneeTeamChange records an activity for a team assignee change.
 func (m *Manager) RecordAssigneeTeamChange(conversationUUID string, teamID int, actor umodels.User) error {
 	team, err := m.teamStore.Get(teamID)
@@ -770,8 +783,12 @@ func (m *Manager) getMessageActivityContent(activityType, newValue, actorName st
 		content = fmt.Sprintf("Assigned to %s by %s", newValue, actorName)
 	case models.ActivityAssignedTeamChange:
 		content = fmt.Sprintf("Assigned to %s team by %s", newValue, actorName)
+	case models.ActivityAssigneeUserRemoved:
+		content = fmt.Sprintf("%s removed %s as assignee", actorName, newValue)
 	case models.ActivitySelfAssign:
 		content = fmt.Sprintf("%s self-assigned this conversation", actorName)
+	case models.ActivitySelfUnassign:
+		content = fmt.Sprintf("%s unassigned themselves", actorName)
 	case models.ActivityPriorityChange:
 		content = fmt.Sprintf("%s set priority to %s", actorName, newValue)
 	case models.ActivityStatusChange:
diff --git a/internal/conversation/models/models.go b/internal/conversation/models/models.go
index 03d5c316..7ce335c6 100644
--- a/internal/conversation/models/models.go
+++ b/internal/conversation/models/models.go
@@ -45,15 +45,17 @@ var (
 	MessageStatusFailed   = "failed"
 	MessageStatusReceived = "received"
 
-	ActivityStatusChange       = "status_change"
-	ActivityPriorityChange     = "priority_change"
-	ActivityAssignedUserChange = "assigned_user_change"
-	ActivityAssignedTeamChange = "assigned_team_change"
-	ActivitySelfAssign         = "self_assign"
-	ActivityTagAdded           = "tag_added"
-	ActivityTagRemoved         = "tag_removed"
-	ActivitySLASet             = "sla_set"
-	ActivityParticipantAdded   = "participant_added"
+	ActivityStatusChange        = "status_change"
+	ActivityPriorityChange      = "priority_change"
+	ActivityAssignedUserChange  = "assigned_user_change"
+	ActivityAssignedTeamChange  = "assigned_team_change"
+	ActivityAssigneeUserRemoved = "assignee_user_removed"
+	ActivitySelfAssign          = "self_assign"
+	ActivitySelfUnassign        = "self_unassign"
+	ActivityTagAdded            = "tag_added"
+	ActivityTagRemoved          = "tag_removed"
+	ActivitySLASet              = "sla_set"
+	ActivityParticipantAdded    = "participant_added"
 
 	ContentTypeText = "text"
 	ContentTypeHTML = "html"

From 2eaaa36a46f5218bdb98abaa0bb8de8520de9bb7 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 2 Sep 2026 16:07:01 +0530
Subject: [PATCH 026/178] fix snooze rounding, shifted slash shortcut and reply
 focus in fullscreen

---
 .../providers/useConversationCommands.js      |  2 +-
 .../providers/useConversationCommands.test.js | 18 ++++++++
 .../features/command/useGlobalShortcuts.js    |  8 ++--
 .../conversation/CreateConversation.vue       |  7 +++
 .../src/features/conversation/ReplyBox.vue    | 18 ++++++--
 .../cypress/e2e/ui/commandPaletteMacros.cy.js | 46 ++++++++++++++++++-
 6 files changed, 90 insertions(+), 9 deletions(-)
 create mode 100644 frontend/apps/main/src/features/command/providers/useConversationCommands.test.js

diff --git a/frontend/apps/main/src/features/command/providers/useConversationCommands.js b/frontend/apps/main/src/features/command/providers/useConversationCommands.js
index b1f6ba39..c690286b 100644
--- a/frontend/apps/main/src/features/command/providers/useConversationCommands.js
+++ b/frontend/apps/main/src/features/command/providers/useConversationCommands.js
@@ -57,7 +57,7 @@ const REOPENABLE_STATUSES = [
 ]
 
 export const formatSnoozeDuration = (minutes) =>
-  minutes < 60 ? `${minutes}m` : `${Math.floor(minutes / 60)}h`
+  minutes % 60 === 0 && minutes >= 60 ? `${minutes / 60}h` : `${minutes}m`
 
 export function useConversationCommands({ openSnoozeDatePicker }) {
   const router = useRouter()
diff --git a/frontend/apps/main/src/features/command/providers/useConversationCommands.test.js b/frontend/apps/main/src/features/command/providers/useConversationCommands.test.js
new file mode 100644
index 00000000..fa2ecd15
--- /dev/null
+++ b/frontend/apps/main/src/features/command/providers/useConversationCommands.test.js
@@ -0,0 +1,18 @@
+import { describe, it, expect } from 'vitest'
+import { formatSnoozeDuration } from '@main/features/command/providers/useConversationCommands'
+
+describe('formatSnoozeDuration', () => {
+  it('keeps minutes below an hour', () => {
+    expect(formatSnoozeDuration(30)).toBe('30m')
+  })
+
+  it('uses hours only for exact hours', () => {
+    expect(formatSnoozeDuration(60)).toBe('1h')
+    expect(formatSnoozeDuration(180)).toBe('3h')
+  })
+
+  it('keeps minutes when the duration is not a whole hour', () => {
+    expect(formatSnoozeDuration(90)).toBe('90m')
+    expect(formatSnoozeDuration(1445)).toBe('1445m')
+  })
+})
diff --git a/frontend/apps/main/src/features/command/useGlobalShortcuts.js b/frontend/apps/main/src/features/command/useGlobalShortcuts.js
index 6329ed53..b6a2f110 100644
--- a/frontend/apps/main/src/features/command/useGlobalShortcuts.js
+++ b/frontend/apps/main/src/features/command/useGlobalShortcuts.js
@@ -101,11 +101,13 @@ export function useGlobalShortcuts() {
   const onKeydown = (event) => {
     if (event.isComposing || event.repeat) return
     let handled = false
-    if (isMod(event) && !event.shiftKey && !event.altKey) {
+    if (isMod(event) && !event.altKey) {
       const key = event.key.toLowerCase()
-      if (key === 'k') handled = (palette.togglePalette(), true)
+      // Layouts like German put "/" on a shifted key, so it cannot require an unshifted event.
+      if (event.key === '/') handled = showShortcuts()
+      else if (event.shiftKey) handled = false
+      else if (key === 'k') handled = (palette.togglePalette(), true)
       else if (key === 'm') handled = openMacros()
-      else if (event.key === '/') handled = showShortcuts()
     } else if (onlyAlt(event) && altKeys[event.code] && !dialogIsOpen()) {
       handled = altKeys[event.code]()
     }
diff --git a/frontend/apps/main/src/features/conversation/CreateConversation.vue b/frontend/apps/main/src/features/conversation/CreateConversation.vue
index 5dcfc232..5b0c0e54 100644
--- a/frontend/apps/main/src/features/conversation/CreateConversation.vue
+++ b/frontend/apps/main/src/features/conversation/CreateConversation.vue
@@ -371,6 +371,13 @@ onMounted(() => {
   })
 })
 
+watch(
+  () => props.initialContact,
+  (contact) => {
+    if (contact?.email) selectContact(contact)
+  }
+)
+
 const form = useForm({
   validationSchema: toTypedSchema(formSchema),
   initialValues: {
diff --git a/frontend/apps/main/src/features/conversation/ReplyBox.vue b/frontend/apps/main/src/features/conversation/ReplyBox.vue
index be7bd981..edee9956 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBox.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBox.vue
@@ -53,6 +53,7 @@
       >
         <ReplyBoxContent
           v-if="isEditorFullscreen"
+          ref="fullscreenContentRef"
           :isFullscreen="true"
           :aiPrompts="aiPrompts"
           :isSending="isSending"
@@ -147,7 +148,7 @@
 </template>
 
 <script setup>
-import { ref, watch, computed, toRaw, onMounted, onUnmounted } from 'vue'
+import { ref, watch, computed, toRaw, nextTick, onMounted, onUnmounted } from 'vue'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
 import { EMITTER_EVENTS } from '@main/constants/emitterEvents.js'
 import { MACRO_CONTEXT } from '@main/constants/conversation'
@@ -256,6 +257,9 @@ const emailErrors = ref([])
 const aiPromptStore = useAiPromptStore()
 const aiPrompts = computed(() => aiPromptStore.prompts)
 const replyBoxContentRef = ref(null)
+const fullscreenContentRef = ref(null)
+const activeContentRef = () =>
+  isEditorFullscreen.value ? fullscreenContentRef.value : replyBoxContentRef.value
 const showContactEmailWarning = ref(false)
 const showMissingTagsWarning = ref(false)
 const deferredStatus = ref(null)
@@ -303,7 +307,15 @@ const setMessageTypeFromPalette = (type) => {
   messageType.value = type
 }
 
-const focusFromPalette = () => replyBoxContentRef.value?.focus()
+const focusFromPalette = () => {
+  // The cramped layout renders no editor until the fullscreen dialog opens.
+  if (isCramped.value && !isEditorFullscreen.value) {
+    isEditorFullscreen.value = true
+    nextTick(() => fullscreenContentRef.value?.focus())
+    return
+  }
+  activeContentRef()?.focus()
+}
 
 onMounted(() => {
   emitter.on(EMITTER_EVENTS.COPILOT_INSERT_REPLY, handleCopilotInsertReply)
@@ -569,7 +581,7 @@ watch(
   () => conversationStore.current?.uuid,
   () => {
     setTimeout(() => {
-      replyBoxContentRef.value?.focus()
+      activeContentRef()?.focus()
     }, 100)
   }
 )
diff --git a/frontend/cypress/e2e/ui/commandPaletteMacros.cy.js b/frontend/cypress/e2e/ui/commandPaletteMacros.cy.js
index 09070f3c..ecaffa43 100644
--- a/frontend/cypress/e2e/ui/commandPaletteMacros.cy.js
+++ b/frontend/cypress/e2e/ui/commandPaletteMacros.cy.js
@@ -6,9 +6,49 @@ const messageBody = `Reply body from the palette spec ${stamp}`
 describe('Command palette macros', () => {
   let contentMacroId
   let actionMacroId
+  let inboxId
+  let conversationUuid
 
   before(() => {
     cy.login()
+    cy.api('POST', '/api/v1/inboxes', {
+      name: `Palette Inbox ${stamp}`,
+      channel: 'email',
+      enabled: true,
+      from: `Palette ${stamp} <palette.${stamp}@example.com>`,
+      config: {
+        auth_type: 'password',
+        from: `Palette ${stamp} <palette.${stamp}@example.com>`,
+        smtp: [
+          {
+            host: '127.0.0.1',
+            port: Number(Cypress.env('SMTP_PORT') || 1025),
+            username: '',
+            password: '',
+            auth_protocol: 'none',
+            tls_type: 'none',
+            max_conns: 2,
+            max_msg_retries: 1,
+            idle_timeout: '5s',
+            pool_wait_timeout: '5s'
+          }
+        ],
+        imap: []
+      }
+    }).then((resp) => {
+      inboxId = resp.body.data.id
+      cy.api('POST', '/api/v1/conversations', {
+        inbox_id: inboxId,
+        contact_email: `palette.contact.${stamp}@example.com`,
+        first_name: 'Palette',
+        last_name: `Contact${stamp}`,
+        subject: `Palette conversation ${stamp}`,
+        content: '<p>first message</p>',
+        initiator: 'contact'
+      }).then((convResp) => {
+        conversationUuid = convResp.body.data.uuid
+      })
+    })
     cy.api('POST', '/api/v1/macros', {
       name: contentMacroName,
       message_content: `<p>${messageBody}</p>`,
@@ -84,8 +124,10 @@ describe('Command palette macros', () => {
     cy.intercept('GET', '**/api/v1/macros/search*').as('macroSearch')
     cy.intercept('GET', /\/api\/v1\/macros\/\d+$/).as('macroContent')
 
-    cy.visit('/inboxes/assigned')
-    cy.contains('My inbox').should('be.visible')
+    // Macros apply to a conversation, so the shortcut needs one open.
+    cy.intercept('GET', '**/messages?page=*').as('loadMessages')
+    cy.visit(`/inboxes/all/conversation/${conversationUuid}`)
+    cy.wait('@loadMessages')
 
     // useMagicKeys only sees Ctrl_M when the Control and m keydowns arrive in separate tasks.
     cy.window().then(async (win) => {

From 5dbe0f77acad9a4f3482bd25dba8bf32aefc161b Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 2 Sep 2026 16:22:49 +0530
Subject: [PATCH 027/178] delete the test inbox in the command palette macros
 spec teardown

---
 frontend/cypress/e2e/ui/commandPaletteMacros.cy.js | 1 +
 1 file changed, 1 insertion(+)

diff --git a/frontend/cypress/e2e/ui/commandPaletteMacros.cy.js b/frontend/cypress/e2e/ui/commandPaletteMacros.cy.js
index ecaffa43..e36865bb 100644
--- a/frontend/cypress/e2e/ui/commandPaletteMacros.cy.js
+++ b/frontend/cypress/e2e/ui/commandPaletteMacros.cy.js
@@ -78,6 +78,7 @@ describe('Command palette macros', () => {
     cy.login()
     if (contentMacroId) cy.api('DELETE', `/api/v1/macros/${contentMacroId}`)
     if (actionMacroId) cy.api('DELETE', `/api/v1/macros/${actionMacroId}`)
+    if (inboxId) cy.api('DELETE', `/api/v1/inboxes/${inboxId}`, null, { failOnStatusCode: false })
   })
 
   it('serves the compact list without message content', () => {

From f8c75f670f062be35fa073cb5ac44110c9470ffa Mon Sep 17 00:00:00 2001
From: Fredrik Blau <40271584+fredrikblau@users.noreply.github.com>
Date: Wed, 2 Sep 2026 18:54:23 +0330
Subject: [PATCH 028/178] feat: port ticket references to conversation editor

---
 .../components/editor/ConversationEditor.vue  |  4 +
 .../components/editor/TicketReferenceList.vue | 77 +++++++++++++++++++
 .../src/components/editor/editorExtensions.js |  7 +-
 .../src/components/editor/ticketReference.js  | 23 ++++++
 .../components/editor/ticketReference.test.js | 40 ++++++++++
 .../editor/ticketReferenceExtension.js        | 27 +++++++
 .../editor/ticketReferenceExtension.test.js   | 25 ++++++
 .../editor/ticketReferenceSuggestion.js       | 51 ++++++++++++
 .../src/components/editor/useTextEditor.js    | 16 ++++
 .../features/conversation/ReplyBoxContent.vue | 12 ++-
 i18n/en-US.json                               |  1 +
 11 files changed, 281 insertions(+), 2 deletions(-)
 create mode 100644 frontend/apps/main/src/components/editor/TicketReferenceList.vue
 create mode 100644 frontend/apps/main/src/components/editor/ticketReference.js
 create mode 100644 frontend/apps/main/src/components/editor/ticketReference.test.js
 create mode 100644 frontend/apps/main/src/components/editor/ticketReferenceExtension.js
 create mode 100644 frontend/apps/main/src/components/editor/ticketReferenceExtension.test.js
 create mode 100644 frontend/apps/main/src/components/editor/ticketReferenceSuggestion.js

diff --git a/frontend/apps/main/src/components/editor/ConversationEditor.vue b/frontend/apps/main/src/components/editor/ConversationEditor.vue
index 23e73a11..56077080 100644
--- a/frontend/apps/main/src/components/editor/ConversationEditor.vue
+++ b/frontend/apps/main/src/components/editor/ConversationEditor.vue
@@ -45,6 +45,8 @@ const props = defineProps({
   disabled: { type: Boolean, default: false },
   enableMentions: { type: Boolean, default: false },
   getSuggestions: { type: Function, default: null },
+  enableTicketReferences: { type: Boolean, default: false },
+  getTicketSuggestions: { type: Function, default: null },
   enableInlineImages: { type: Boolean, default: false },
   linkedModel: { type: String, default: 'messages' }
 })
@@ -85,6 +87,8 @@ const { editor, extractMentions, focus } = useTextEditor({
   linkedModel: props.linkedModel,
   getSuggestions: props.getSuggestions,
   enableMentions: () => props.enableMentions,
+  getTicketSuggestions: props.getTicketSuggestions,
+  ticketReferencesEnabled: () => props.enableTicketReferences,
   onSend: () => {
     emit('send')
     stopTyping()
diff --git a/frontend/apps/main/src/components/editor/TicketReferenceList.vue b/frontend/apps/main/src/components/editor/TicketReferenceList.vue
new file mode 100644
index 00000000..50c1f541
--- /dev/null
+++ b/frontend/apps/main/src/components/editor/TicketReferenceList.vue
@@ -0,0 +1,77 @@
+<template>
+  <div
+    v-if="items.length > 0"
+    class="ticket-reference-list bg-background border rounded-lg shadow-lg overflow-hidden max-h-60 overflow-y-auto"
+  >
+    <button
+      v-for="(item, index) in items"
+      :key="item.id"
+      class="ticket-reference-item w-full text-left px-3 py-2 hover:bg-muted"
+      :class="{ 'bg-muted': index === selectedIndex }"
+      @click="selectItem(index)"
+    >
+      <div class="flex items-center gap-2">
+        <span class="font-medium">#{{ item.label }}</span>
+        <span class="text-xs text-muted-foreground">{{ item.status }}</span>
+      </div>
+      <div v-if="item.subject" class="text-sm text-muted-foreground truncate">
+        {{ item.subject }}
+      </div>
+    </button>
+  </div>
+  <div v-else class="ticket-reference-list bg-background border rounded-lg shadow-lg p-3">
+    <span v-if="query.length < MIN_REFERENCE_QUERY_LENGTH" class="text-sm text-muted-foreground">
+      {{
+        $t('globals.messages.typeAtLeastDigitsToSearchTickets', {
+          count: MIN_REFERENCE_QUERY_LENGTH
+        })
+      }}
+    </span>
+    <span v-else class="text-sm text-muted-foreground">{{
+      $t('globals.messages.noResultsFound')
+    }}</span>
+  </div>
+</template>
+
+<script setup>
+import { ref, watch, nextTick } from 'vue'
+import { MIN_REFERENCE_QUERY_LENGTH } from './ticketReference'
+
+const props = defineProps({
+  items: { type: Array, default: () => [] },
+  command: { type: Function, required: true },
+  query: { type: String, default: '' }
+})
+const selectedIndex = ref(0)
+const selectItem = (index) => props.items[index] && props.command(props.items[index])
+watch(
+  () => props.items,
+  () => {
+    selectedIndex.value = 0
+  }
+)
+watch(selectedIndex, () =>
+  nextTick(() =>
+    document.querySelector('.ticket-reference-item.bg-muted')?.scrollIntoView({ block: 'nearest' })
+  )
+)
+defineExpose({
+  onKeyDown: ({ event }) => {
+    if (!props.items.length) return false
+    if (event.key === 'ArrowUp')
+      selectedIndex.value = (selectedIndex.value + props.items.length - 1) % props.items.length
+    else if (event.key === 'ArrowDown')
+      selectedIndex.value = (selectedIndex.value + 1) % props.items.length
+    else if (event.key === 'Enter') selectItem(selectedIndex.value)
+    else return false
+    return true
+  }
+})
+</script>
+
+<style scoped>
+.ticket-reference-list {
+  min-width: 240px;
+  max-width: 360px;
+}
+</style>
diff --git a/frontend/apps/main/src/components/editor/editorExtensions.js b/frontend/apps/main/src/components/editor/editorExtensions.js
index 82ce364c..6b4c024b 100644
--- a/frontend/apps/main/src/components/editor/editorExtensions.js
+++ b/frontend/apps/main/src/components/editor/editorExtensions.js
@@ -17,6 +17,8 @@ import { Callout } from './extensions/Callout'
 import { Details, DetailsSummary, DetailsContent } from './extensions/Collapsible'
 import { TrailingNode } from './extensions/TrailingNode'
 import mentionSuggestion from './mentionSuggestion'
+import ticketReferenceSuggestion from './ticketReferenceSuggestion'
+import { TicketReference } from './ticketReferenceExtension'
 
 const lowlight = createLowlight(codeGrammars)
 
@@ -135,13 +137,16 @@ const sharedExtensions = ({
   CustomLink
 ]
 
-export function buildConversationExtensions({ getPlaceholder }) {
+export function buildConversationExtensions({
+  getPlaceholder
+}) {
   return [
     ...sharedExtensions({ getPlaceholder }),
     CustomMention.configure({
       HTMLAttributes: { class: 'ld-mention' },
       suggestion: mentionSuggestion
     }),
+    TicketReference.configure({ suggestion: ticketReferenceSuggestion }),
     CustomTable.configure({ resizable: false }),
     TableRow,
     CustomTableCell,
diff --git a/frontend/apps/main/src/components/editor/ticketReference.js b/frontend/apps/main/src/components/editor/ticketReference.js
new file mode 100644
index 00000000..c963fd7c
--- /dev/null
+++ b/frontend/apps/main/src/components/editor/ticketReference.js
@@ -0,0 +1,23 @@
+import api from '@main/api'
+
+export const MIN_REFERENCE_QUERY_LENGTH = 3
+
+export const conversationReferenceHref = (uuid) => {
+  const path = `/inboxes/all/conversation/${uuid}`
+  const origin = typeof window !== 'undefined' ? window.location.origin : ''
+  return origin ? `${origin}${path}` : path
+}
+
+export const getTicketSuggestions = async (query, search = api.searchConversations) => {
+  const reference = query.trim()
+  if (reference.length < MIN_REFERENCE_QUERY_LENGTH) return []
+
+  const response = await search({ query: reference })
+  return (response.data?.data || []).map((conversation) => ({
+    id: conversation.uuid,
+    label: conversation.reference_number,
+    subject: conversation.subject,
+    status: conversation.status,
+    href: conversationReferenceHref(conversation.uuid)
+  }))
+}
diff --git a/frontend/apps/main/src/components/editor/ticketReference.test.js b/frontend/apps/main/src/components/editor/ticketReference.test.js
new file mode 100644
index 00000000..216bdf67
--- /dev/null
+++ b/frontend/apps/main/src/components/editor/ticketReference.test.js
@@ -0,0 +1,40 @@
+import { describe, expect, it, vi } from 'vitest'
+import { conversationReferenceHref, getTicketSuggestions } from './ticketReference'
+
+describe('ticket reference suggestions', () => {
+  it('does not search until three characters are entered', async () => {
+    const search = vi.fn()
+    await expect(getTicketSuggestions('10', search)).resolves.toEqual([])
+    expect(search).not.toHaveBeenCalled()
+  })
+
+  it('maps a conversation result to a link suggestion', async () => {
+    const search = vi
+      .fn()
+      .mockResolvedValue({
+        data: {
+          data: [
+            {
+              uuid: 'conversation-uuid',
+              reference_number: '108',
+              subject: 'Payment failed',
+              status: 'Open'
+            }
+          ]
+        }
+      })
+    await expect(getTicketSuggestions('108', search)).resolves.toEqual([
+      {
+        id: 'conversation-uuid',
+        label: '108',
+        subject: 'Payment failed',
+        status: 'Open',
+        href: '/inboxes/all/conversation/conversation-uuid'
+      }
+    ])
+  })
+
+  it('builds a stable conversation link', () => {
+    expect(conversationReferenceHref('abc')).toBe('/inboxes/all/conversation/abc')
+  })
+})
diff --git a/frontend/apps/main/src/components/editor/ticketReferenceExtension.js b/frontend/apps/main/src/components/editor/ticketReferenceExtension.js
new file mode 100644
index 00000000..5d0bfec7
--- /dev/null
+++ b/frontend/apps/main/src/components/editor/ticketReferenceExtension.js
@@ -0,0 +1,27 @@
+import Mention from '@tiptap/extension-mention'
+
+export const TicketReference = Mention.extend({
+  name: 'ticketReference',
+  addAttributes() {
+    return {
+      ...this.parent?.(),
+      href: { default: null, parseHTML: (element) => element.getAttribute('href') },
+      type: {
+        default: 'ticket-reference',
+        parseHTML: (element) => element.getAttribute('data-type') || 'ticket-reference',
+        renderHTML: (attributes) => ({ 'data-type': attributes.type })
+      }
+    }
+  },
+  parseHTML: () => [{ tag: 'a.ld-ticket-reference' }],
+  renderText: ({ node }) => `#${node.attrs.label}`,
+  renderHTML: ({ node, HTMLAttributes }) => [
+    'a',
+    {
+      ...HTMLAttributes,
+      href: node.attrs.href,
+      class: [HTMLAttributes.class, 'ld-ticket-reference'].filter(Boolean).join(' ')
+    },
+    `#${node.attrs.label}`
+  ]
+})
diff --git a/frontend/apps/main/src/components/editor/ticketReferenceExtension.test.js b/frontend/apps/main/src/components/editor/ticketReferenceExtension.test.js
new file mode 100644
index 00000000..a851decf
--- /dev/null
+++ b/frontend/apps/main/src/components/editor/ticketReferenceExtension.test.js
@@ -0,0 +1,25 @@
+// @vitest-environment jsdom
+
+import { describe, expect, it } from 'vitest'
+import StarterKit from '@tiptap/starter-kit'
+import { Editor } from '@tiptap/vue-3'
+import { TicketReference } from './ticketReferenceExtension'
+
+describe('ticket reference editor extension', () => {
+  it('round-trips a ticket reference through HTML', () => {
+    const content =
+      '<p><a data-id="conversation-uuid" data-label="108" data-type="ticket-reference" href="/inboxes/all/conversation/conversation-uuid" class="ld-ticket-reference">#108</a></p>'
+    const editor = new Editor({ extensions: [StarterKit, TicketReference], content })
+    expect(editor.getJSON().content[0].content[0]).toMatchObject({
+      type: 'ticketReference',
+      attrs: {
+        id: 'conversation-uuid',
+        label: '108',
+        href: '/inboxes/all/conversation/conversation-uuid',
+        type: 'ticket-reference'
+      }
+    })
+    expect(editor.getHTML()).toContain('href="/inboxes/all/conversation/conversation-uuid"')
+    editor.destroy()
+  })
+})
diff --git a/frontend/apps/main/src/components/editor/ticketReferenceSuggestion.js b/frontend/apps/main/src/components/editor/ticketReferenceSuggestion.js
new file mode 100644
index 00000000..11bcb612
--- /dev/null
+++ b/frontend/apps/main/src/components/editor/ticketReferenceSuggestion.js
@@ -0,0 +1,51 @@
+import { VueRenderer } from '@tiptap/vue-3'
+import TicketReferenceList from './TicketReferenceList.vue'
+
+export default {
+  char: '#',
+  allowSpaces: false,
+  allow: ({ editor }) => editor.options.editorProps?.ticketReferencesEnabled?.() ?? false,
+  items: async ({ query, editor }) =>
+    editor.options.editorProps?.getTicketSuggestions?.(query) || [],
+  render: () => {
+    let component
+    let popup
+    const position = (rect) => {
+      if (!rect || !popup) return
+      const bounds = rect()
+      if (!bounds) return
+      popup.style.left = `${bounds.left}px`
+      popup.style.top = `${bounds.bottom + 4}px`
+    }
+    return {
+      onStart: (props) => {
+        component = new VueRenderer(TicketReferenceList, {
+          props: { ...props, query: props.query },
+          editor: props.editor
+        })
+        if (!props.clientRect) return
+        popup = document.createElement('div')
+        popup.style.position = 'fixed'
+        popup.style.zIndex = '9999'
+        popup.appendChild(component.element)
+        document.body.appendChild(popup)
+        position(props.clientRect)
+      },
+      onUpdate: (props) => {
+        component?.updateProps({ ...props, query: props.query })
+        position(props.clientRect)
+      },
+      onKeyDown: (props) => {
+        if (props.event.key === 'Escape') {
+          if (popup) popup.style.display = 'none'
+          return true
+        }
+        return component?.ref?.onKeyDown(props)
+      },
+      onExit: () => {
+        popup?.remove()
+        component?.destroy()
+      }
+    }
+  }
+}
diff --git a/frontend/apps/main/src/components/editor/useTextEditor.js b/frontend/apps/main/src/components/editor/useTextEditor.js
index ce6cc028..1cf4e2fd 100644
--- a/frontend/apps/main/src/components/editor/useTextEditor.js
+++ b/frontend/apps/main/src/components/editor/useTextEditor.js
@@ -13,6 +13,8 @@ export function useTextEditor({
   linkedModel = 'messages',
   getSuggestions = null,
   enableMentions = () => false,
+  getTicketSuggestions = null,
+  ticketReferencesEnabled = () => false,
   onSend = () => {},
   onUpdate = () => {},
   onBlur = () => {},
@@ -52,6 +54,20 @@ export function useTextEditor({
       attributes: { class: 'outline-none' },
       getSuggestions,
       enableMentions,
+      getTicketSuggestions,
+      ticketReferencesEnabled,
+      handleDOMEvents: {
+        click: (_view, event) => {
+          const target =
+            event.target instanceof HTMLElement
+              ? event.target.closest('a.ld-ticket-reference')
+              : null
+          if (!target) return false
+          event.preventDefault()
+          window.open(target.href, '_blank', 'noopener,noreferrer')
+          return true
+        }
+      },
       handlePaste,
       handleDrop,
       handleKeyDown: (view, event) => {
diff --git a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
index b28f8f8c..0e6c333f 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
@@ -96,8 +96,10 @@
         :autoFocus="true"
         :disabled="isDraftLoading"
         :enableMentions="messageType === 'private_note'"
+        :enableTicketReferences="messageType === 'private_note'"
         :enableInlineImages="conversationStore.current.inbox_channel === 'email'"
         :getSuggestions="getSuggestions"
+        :getTicketSuggestions="getTicketSuggestions"
         @aiPromptSelected="handleAiPromptSelected"
         @send="handleSend"
         @mentionsChanged="handleMentionsChanged"
@@ -169,6 +171,7 @@ import api from '@main/api'
 
 const MENTION_LIMIT = 10
 const MENTION_DEBOUNCE_MS = 250
+import { getTicketSuggestions as fetchTicketSuggestions } from '@main/components/editor/ticketReference'
 
 const messageType = defineModel('messageType', { default: 'reply' })
 const to = defineModel('to', { default: '' })
@@ -214,6 +217,13 @@ const getSuggestions = async (query) => {
   return (await debouncedFetchSuggestions(query)) || []
 }
 
+const getTicketSuggestions = async (query) => {
+  if (messageType.value !== 'private_note') return []
+  return fetchTicketSuggestions(query)
+  if (messageType.value !== 'private_note') return []
+  return fetchTicketSuggestions(query)
+}
+
 // Handle mentions changed from editor
 const handleMentionsChanged = (newMentions) => {
   mentions.value = newMentions
@@ -383,7 +393,7 @@ const handleAiPromptSelected = (key) => {
 // Watch and update macro view based on message type this filters our macros.
 watch(
   messageType,
-  (newType, oldType) => {
+  (newType) => {
     if (newType === 'reply') {
       macroStore.setCurrentView('replying')
     } else if (newType === 'private_note') {
diff --git a/i18n/en-US.json b/i18n/en-US.json
index b84e00bf..8367c95d 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -859,6 +859,7 @@
   "globals.messages.noInternetConnection": "No internet connection",
   "globals.messages.noMessagesYet": "No messages yet",
   "globals.messages.noResultsFound": "No results found",
+  "globals.messages.typeAtLeastDigitsToSearchTickets": "Type at least {count} digits to search tickets",
   "globals.messages.notAllowed": "Not allowed",
   "globals.messages.notFound": "Not found",
   "globals.messages.options": "Options",

From 18e2fbe3828ec6befae3263c81a0c11e36d6d5b3 Mon Sep 17 00:00:00 2001
From: Fredrik Blau <40271584+fredrikblau@users.noreply.github.com>
Date: Wed, 2 Sep 2026 18:54:23 +0330
Subject: [PATCH 029/178] fix: validate ticket reference URLs

---
 .../editor/ticketReferenceExtension.js        | 25 ++++++++++++++++++-
 .../editor/ticketReferenceExtension.test.js   | 13 +++++++++-
 .../src/components/editor/useTextEditor.js    |  5 +++-
 .../features/conversation/ReplyBoxContent.vue |  2 --
 4 files changed, 40 insertions(+), 5 deletions(-)

diff --git a/frontend/apps/main/src/components/editor/ticketReferenceExtension.js b/frontend/apps/main/src/components/editor/ticketReferenceExtension.js
index 5d0bfec7..61da9249 100644
--- a/frontend/apps/main/src/components/editor/ticketReferenceExtension.js
+++ b/frontend/apps/main/src/components/editor/ticketReferenceExtension.js
@@ -1,11 +1,34 @@
 import Mention from '@tiptap/extension-mention'
 
+const conversationPath = /^\/inboxes\/all\/conversation\/[^/?#]+$/
+
+export const isSafeTicketReferenceHref = (href) => {
+  if (!href || href.startsWith('//')) return false
+
+  try {
+    const url = new URL(href, window.location.origin)
+    return (
+      (url.protocol === 'http:' || url.protocol === 'https:') &&
+      url.origin === window.location.origin &&
+      conversationPath.test(url.pathname)
+    )
+  } catch {
+    return false
+  }
+}
+
 export const TicketReference = Mention.extend({
   name: 'ticketReference',
   addAttributes() {
     return {
       ...this.parent?.(),
-      href: { default: null, parseHTML: (element) => element.getAttribute('href') },
+      href: {
+        default: null,
+        parseHTML: (element) => {
+          const href = element.getAttribute('href')
+          return isSafeTicketReferenceHref(href) ? href : null
+        }
+      },
       type: {
         default: 'ticket-reference',
         parseHTML: (element) => element.getAttribute('data-type') || 'ticket-reference',
diff --git a/frontend/apps/main/src/components/editor/ticketReferenceExtension.test.js b/frontend/apps/main/src/components/editor/ticketReferenceExtension.test.js
index a851decf..f24706d8 100644
--- a/frontend/apps/main/src/components/editor/ticketReferenceExtension.test.js
+++ b/frontend/apps/main/src/components/editor/ticketReferenceExtension.test.js
@@ -3,9 +3,20 @@
 import { describe, expect, it } from 'vitest'
 import StarterKit from '@tiptap/starter-kit'
 import { Editor } from '@tiptap/vue-3'
-import { TicketReference } from './ticketReferenceExtension'
+import { isSafeTicketReferenceHref, TicketReference } from './ticketReferenceExtension'
 
 describe('ticket reference editor extension', () => {
+  it.each([
+    ['/inboxes/all/conversation/conversation-uuid', true],
+    ['http://localhost:3000/inboxes/all/conversation/conversation-uuid', true],
+    ['https://evil.example/inboxes/all/conversation/conversation-uuid', false],
+    ['//evil.example/inboxes/all/conversation/conversation-uuid', false],
+    ['javascript:alert(1)', false],
+    ['data:text/html,<script>alert(1)</script>', false]
+  ])('validates ticket reference href %s', (href, expected) => {
+    expect(isSafeTicketReferenceHref(href)).toBe(expected)
+  })
+
   it('round-trips a ticket reference through HTML', () => {
     const content =
       '<p><a data-id="conversation-uuid" data-label="108" data-type="ticket-reference" href="/inboxes/all/conversation/conversation-uuid" class="ld-ticket-reference">#108</a></p>'
diff --git a/frontend/apps/main/src/components/editor/useTextEditor.js b/frontend/apps/main/src/components/editor/useTextEditor.js
index 1cf4e2fd..0c282c85 100644
--- a/frontend/apps/main/src/components/editor/useTextEditor.js
+++ b/frontend/apps/main/src/components/editor/useTextEditor.js
@@ -1,6 +1,7 @@
 import { ref, watch, onUnmounted } from 'vue'
 import { useEditor } from '@tiptap/vue-3'
 import { useInlineImageUpload } from '@main/composables/useInlineImageUpload'
+import { isSafeTicketReferenceHref } from './ticketReferenceExtension'
 
 export function useTextEditor({
   extensions,
@@ -64,7 +65,9 @@ export function useTextEditor({
               : null
           if (!target) return false
           event.preventDefault()
-          window.open(target.href, '_blank', 'noopener,noreferrer')
+          if (isSafeTicketReferenceHref(target.getAttribute('href'))) {
+            window.open(target.href, '_blank', 'noopener,noreferrer')
+          }
           return true
         }
       },
diff --git a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
index 0e6c333f..58d8a1cf 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
@@ -220,8 +220,6 @@ const getSuggestions = async (query) => {
 const getTicketSuggestions = async (query) => {
   if (messageType.value !== 'private_note') return []
   return fetchTicketSuggestions(query)
-  if (messageType.value !== 'private_note') return []
-  return fetchTicketSuggestions(query)
 }
 
 // Handle mentions changed from editor

From 0e13b0458d89f370cc4e5391807cc5a560ec2592 Mon Sep 17 00:00:00 2001
From: Fredrik Blau <40271584+fredrikblau@users.noreply.github.com>
Date: Wed, 2 Sep 2026 21:41:08 +0330
Subject: [PATCH 030/178] fix: discard stale ticket suggestions

---
 .../apps/main/src/features/conversation/ReplyBoxContent.vue   | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
index 58d8a1cf..e7b1a86f 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
@@ -219,7 +219,9 @@ const getSuggestions = async (query) => {
 
 const getTicketSuggestions = async (query) => {
   if (messageType.value !== 'private_note') return []
-  return fetchTicketSuggestions(query)
+  const messageTypeAtRequest = messageType.value
+  const suggestions = await fetchTicketSuggestions(query)
+  return messageType.value === messageTypeAtRequest ? suggestions : []
 }
 
 // Handle mentions changed from editor

From c47e8e0c5b495bd09ea4fbb647653c927f138881 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 2 Sep 2026 23:48:44 +0530
Subject: [PATCH 031/178] let search callers pass a result limit and show the
 palette spinner while typing

---
 cmd/aitools.go                                |  2 +-
 cmd/search.go                                 | 19 ++++++++++++++---
 .../main/src/features/command/CommandBox.vue  | 21 ++++++++++++-------
 .../command/providers/useEntitySearch.js      |  6 ++++--
 internal/search/queries.sql                   |  6 +++---
 internal/search/search.go                     | 12 +++++------
 6 files changed, 44 insertions(+), 22 deletions(-)

diff --git a/cmd/aitools.go b/cmd/aitools.go
index 0a296e88..ba0d4215 100644
--- a/cmd/aitools.go
+++ b/cmd/aitools.go
@@ -232,7 +232,7 @@ func (t *searchContactsTool) Execute(ctx context.Context, args string) (string,
 	if !allowed {
 		return "You do not have permission to search contacts.", nil
 	}
-	results, err := t.app.search.Contacts(email)
+	results, err := t.app.search.Contacts(email, maxContactSearchLimit)
 	if err != nil {
 		return "", err
 	}
diff --git a/cmd/search.go b/cmd/search.go
index 50d9c83c..1df148f4 100644
--- a/cmd/search.go
+++ b/cmd/search.go
@@ -2,6 +2,7 @@ package main
 
 import (
 	"fmt"
+	"strconv"
 
 	amodels "github.com/abhinavxd/libredesk/internal/auth/models"
 	"github.com/abhinavxd/libredesk/internal/envelope"
@@ -11,6 +12,10 @@ import (
 
 const (
 	minSearchQueryLength = 3
+
+	maxConversationSearchLimit = 1000
+	maxMessageSearchLimit      = 30
+	maxContactSearchLimit      = 15
 )
 
 // handleSearchConversations searches conversations based on the query.
@@ -19,7 +24,7 @@ func handleSearchConversations(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	results, err := app.search.Conversations(q)
+	results, err := app.search.Conversations(q, searchLimit(r, maxConversationSearchLimit))
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
@@ -47,7 +52,7 @@ func handleSearchMessages(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	results, err := app.search.Messages(q)
+	results, err := app.search.Messages(q, searchLimit(r, maxMessageSearchLimit))
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
@@ -75,7 +80,7 @@ func handleSearchContacts(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	results, err := app.search.Contacts(q)
+	results, err := app.search.Contacts(q, searchLimit(r, maxContactSearchLimit))
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
@@ -92,6 +97,14 @@ func searchInputs(r *fastglue.Request) (*App, amodels.User, string, error) {
 	return app, user, q, nil
 }
 
+func searchLimit(r *fastglue.Request, max int) int {
+	limit, err := strconv.Atoi(string(r.RequestCtx.QueryArgs().Peek("limit")))
+	if err != nil || limit < 1 || limit > max {
+		return max
+	}
+	return limit
+}
+
 func uuidSet(uuids []string) map[string]struct{} {
 	s := make(map[string]struct{}, len(uuids))
 	for _, u := range uuids {
diff --git a/frontend/apps/main/src/features/command/CommandBox.vue b/frontend/apps/main/src/features/command/CommandBox.vue
index 757afb06..83460466 100644
--- a/frontend/apps/main/src/features/command/CommandBox.vue
+++ b/frontend/apps/main/src/features/command/CommandBox.vue
@@ -189,15 +189,19 @@ const asyncResults = ref([])
 const loading = ref(false)
 let searchSeq = 0
 
-const runAsyncSearch = async () => {
-  const seq = ++searchSeq
+const asyncSource = () => {
   const term = searchTerm.value.trim()
   const group = parentCommand.value
-  let source = null
-  if (group?.search) source = () => group.search(term)
-  else if (!parent.value && term.length >= ENTITY_SEARCH_MIN_LENGTH) {
-    source = () => entitySearch.search(term)
+  if (group?.search) return () => group.search(term)
+  if (!parent.value && term.length >= ENTITY_SEARCH_MIN_LENGTH) {
+    return () => entitySearch.search(term)
   }
+  return null
+}
+
+const runAsyncSearch = async () => {
+  const seq = ++searchSeq
+  const source = asyncSource()
   if (!source) {
     asyncResults.value = []
     loading.value = false
@@ -233,7 +237,10 @@ watch(
 watch(
   () => searchTerm.value,
   () => {
-    if (open.value && !isMacroMode.value) runAsyncSearchDebounced()
+    if (!open.value || isMacroMode.value) return
+    // The request only fires after the debounce, the empty state would show until then.
+    loading.value = Boolean(asyncSource())
+    runAsyncSearchDebounced()
   }
 )
 
diff --git a/frontend/apps/main/src/features/command/providers/useEntitySearch.js b/frontend/apps/main/src/features/command/providers/useEntitySearch.js
index 1550d8ff..bea1bd10 100644
--- a/frontend/apps/main/src/features/command/providers/useEntitySearch.js
+++ b/frontend/apps/main/src/features/command/providers/useEntitySearch.js
@@ -7,6 +7,8 @@ import { SECTIONS } from '../sections'
 
 export const ENTITY_SEARCH_MIN_LENGTH = 3
 
+const RESULT_LIMIT = 10
+
 const contactLabel = (contact) =>
   [contact.first_name, contact.last_name].filter(Boolean).join(' ') || contact.email
 
@@ -17,7 +19,7 @@ export function useEntitySearch() {
 
   const searchContacts = async (term) => {
     if (!userStore.can(perms.CONTACTS_READ_ALL)) return []
-    const response = await api.searchContacts({ query: term })
+    const response = await api.searchContacts({ query: term, limit: RESULT_LIMIT })
     return (response.data.data || []).map((contact) => ({
       id: `search.contact.${contact.id}`,
       label: contactLabel(contact),
@@ -29,7 +31,7 @@ export function useEntitySearch() {
   }
 
   const searchConversations = async (term) => {
-    const response = await api.searchConversations({ query: term })
+    const response = await api.searchConversations({ query: term, limit: RESULT_LIMIT })
     return (response.data.data || []).map((conversation) => ({
       id: `search.conversation.${conversation.uuid}`,
       label: conversation.subject || `#${conversation.reference_number}`,
diff --git a/internal/search/queries.sql b/internal/search/queries.sql
index da9c06b3..7eedfcae 100644
--- a/internal/search/queries.sql
+++ b/internal/search/queries.sql
@@ -21,7 +21,7 @@ JOIN users ON conversations.contact_id = users.id
 LEFT JOIN conversation_statuses cs ON conversations.status_id = cs.id
 WHERE users.email ILIKE '%' || $1 || '%'
 ORDER BY conversations.created_at DESC
-LIMIT 1000;
+LIMIT $2;
 
 -- name: search-messages
 SELECT
@@ -34,7 +34,7 @@ FROM conversation_messages m
     JOIN conversations c ON m.conversation_id = c.id
     LEFT JOIN conversation_statuses cs ON c.status_id = cs.id
 WHERE m.type != 'activity' and m.text_content ILIKE '%' || $1 || '%'
-LIMIT 30;
+LIMIT $2;
 
 -- name: search-contacts
 SELECT
@@ -48,4 +48,4 @@ FROM users
 WHERE type = 'contact'
 AND deleted_at IS NULL
 AND email ILIKE '%' || $1 || '%'
-LIMIT 15;
+LIMIT $2;
diff --git a/internal/search/search.go b/internal/search/search.go
index aed25d43..d2d83044 100644
--- a/internal/search/search.go
+++ b/internal/search/search.go
@@ -49,7 +49,7 @@ func New(opts Opts) (*Manager, error) {
 }
 
 // Conversations searches conversations based on the query
-func (s *Manager) Conversations(query string) ([]models.ConversationResult, error) {
+func (s *Manager) Conversations(query string, limit int) ([]models.ConversationResult, error) {
 	var refNumResults = make([]models.ConversationResult, 0)
 	if err := s.q.SearchConversationsByRefNum.Select(&refNumResults, query); err != nil {
 		s.lo.Error("error searching conversations", "error", err)
@@ -57,7 +57,7 @@ func (s *Manager) Conversations(query string) ([]models.ConversationResult, erro
 	}
 
 	var emailResults = make([]models.ConversationResult, 0)
-	if err := s.q.SearchConversationsByContactEmail.Select(&emailResults, query); err != nil {
+	if err := s.q.SearchConversationsByContactEmail.Select(&emailResults, query, limit); err != nil {
 		s.lo.Error("error searching conversations", "error", err)
 		return nil, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
@@ -65,9 +65,9 @@ func (s *Manager) Conversations(query string) ([]models.ConversationResult, erro
 }
 
 // Messages searches messages based on the query
-func (s *Manager) Messages(query string) ([]models.MessageResult, error) {
+func (s *Manager) Messages(query string, limit int) ([]models.MessageResult, error) {
 	var results = make([]models.MessageResult, 0)
-	if err := s.q.SearchMessages.Select(&results, query); err != nil {
+	if err := s.q.SearchMessages.Select(&results, query, limit); err != nil {
 		s.lo.Error("error searching messages", "error", err)
 		return nil, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
@@ -75,9 +75,9 @@ func (s *Manager) Messages(query string) ([]models.MessageResult, error) {
 }
 
 // Contacts searches contacts based on the query
-func (s *Manager) Contacts(query string) ([]models.ContactResult, error) {
+func (s *Manager) Contacts(query string, limit int) ([]models.ContactResult, error) {
 	var results = make([]models.ContactResult, 0)
-	if err := s.q.SearchContacts.Select(&results, query); err != nil {
+	if err := s.q.SearchContacts.Select(&results, query, limit); err != nil {
 		s.lo.Error("error searching contacts", "error", err)
 		return nil, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}

From dd0d7ba674b1b90f74f252c47ef097aa47b38146 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 2 Sep 2026 23:50:32 +0530
Subject: [PATCH 032/178] show a loading row in the command palette list while
 results load

---
 frontend/apps/main/src/features/command/CommandBox.vue | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/frontend/apps/main/src/features/command/CommandBox.vue b/frontend/apps/main/src/features/command/CommandBox.vue
index 83460466..1a48bfb2 100644
--- a/frontend/apps/main/src/features/command/CommandBox.vue
+++ b/frontend/apps/main/src/features/command/CommandBox.vue
@@ -50,6 +50,13 @@
       />
 
       <template v-else>
+        <div
+          v-if="loading && !visibleCommands.length"
+          class="py-6 text-center text-sm text-muted-foreground"
+        >
+          {{ $t('globals.terms.loading') }}
+        </div>
+
         <CommandGroup
           v-for="group in groups"
           :key="group.section"

From e5ce086290e23fa876f32635b9c4c8a6b42732b6 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 2 Sep 2026 23:52:30 +0530
Subject: [PATCH 033/178] always show the palette loading row while a search is
 in flight

---
 .../apps/main/src/features/command/CommandBox.vue     | 11 ++++-------
 1 file changed, 4 insertions(+), 7 deletions(-)

diff --git a/frontend/apps/main/src/features/command/CommandBox.vue b/frontend/apps/main/src/features/command/CommandBox.vue
index 1a48bfb2..3fd62044 100644
--- a/frontend/apps/main/src/features/command/CommandBox.vue
+++ b/frontend/apps/main/src/features/command/CommandBox.vue
@@ -50,13 +50,6 @@
       />
 
       <template v-else>
-        <div
-          v-if="loading && !visibleCommands.length"
-          class="py-6 text-center text-sm text-muted-foreground"
-        >
-          {{ $t('globals.terms.loading') }}
-        </div>
-
         <CommandGroup
           v-for="group in groups"
           :key="group.section"
@@ -91,6 +84,10 @@
             </span>
           </CommandItem>
         </CommandGroup>
+
+        <div v-if="loading" class="py-6 text-center text-sm text-muted-foreground">
+          {{ $t('globals.terms.loading') }}
+        </div>
       </template>
     </CommandList>
 

From ccf6ba2984830fbc5485e2ecc2658a176fe4bdf1 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 2 Sep 2026 23:54:33 +0530
Subject: [PATCH 034/178] drop the palette loading row

---
 frontend/apps/main/src/features/command/CommandBox.vue | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/frontend/apps/main/src/features/command/CommandBox.vue b/frontend/apps/main/src/features/command/CommandBox.vue
index 3fd62044..83460466 100644
--- a/frontend/apps/main/src/features/command/CommandBox.vue
+++ b/frontend/apps/main/src/features/command/CommandBox.vue
@@ -84,10 +84,6 @@
             </span>
           </CommandItem>
         </CommandGroup>
-
-        <div v-if="loading" class="py-6 text-center text-sm text-muted-foreground">
-          {{ $t('globals.terms.loading') }}
-        </div>
       </template>
     </CommandList>
 

From afeb120a5fa22d6994cf3678c7c315b58853f3a7 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 3 Sep 2026 00:10:44 +0530
Subject: [PATCH 035/178] apply the search limit after the read-permission
 filter

---
 cmd/search.go                                 | 22 +++++++++++++++++--
 .../main/src/features/command/CommandBox.vue  |  4 +++-
 internal/conversation/message.go              |  6 ++---
 internal/search/search.go                     |  6 ++++-
 4 files changed, 31 insertions(+), 7 deletions(-)

diff --git a/cmd/search.go b/cmd/search.go
index 1df148f4..3a08ab14 100644
--- a/cmd/search.go
+++ b/cmd/search.go
@@ -13,6 +13,9 @@ import (
 const (
 	minSearchQueryLength = 3
 
+	// Read permissions are applied in Go after the query, so fetch a margin above the caller's limit.
+	searchOverFetchFactor = 5
+
 	maxConversationSearchLimit = 1000
 	maxMessageSearchLimit      = 30
 	maxContactSearchLimit      = 15
@@ -24,7 +27,8 @@ func handleSearchConversations(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	results, err := app.search.Conversations(q, searchLimit(r, maxConversationSearchLimit))
+	limit := searchLimit(r, maxConversationSearchLimit)
+	results, err := app.search.Conversations(q, overFetch(limit, maxConversationSearchLimit))
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
@@ -42,6 +46,9 @@ func handleSearchConversations(r *fastglue.Request) error {
 		if _, ok := set[c.UUID]; ok {
 			out = append(out, c)
 		}
+		if len(out) == limit {
+			break
+		}
 	}
 	return r.SendEnvelope(out)
 }
@@ -52,7 +59,8 @@ func handleSearchMessages(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	results, err := app.search.Messages(q, searchLimit(r, maxMessageSearchLimit))
+	limit := searchLimit(r, maxMessageSearchLimit)
+	results, err := app.search.Messages(q, overFetch(limit, maxMessageSearchLimit))
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
@@ -70,6 +78,9 @@ func handleSearchMessages(r *fastglue.Request) error {
 		if _, ok := set[m.ConversationUUID]; ok {
 			out = append(out, m)
 		}
+		if len(out) == limit {
+			break
+		}
 	}
 	return r.SendEnvelope(out)
 }
@@ -105,6 +116,13 @@ func searchLimit(r *fastglue.Request, max int) int {
 	return limit
 }
 
+func overFetch(limit, max int) int {
+	if limit > max/searchOverFetchFactor {
+		return max
+	}
+	return limit * searchOverFetchFactor
+}
+
 func uuidSet(uuids []string) map[string]struct{} {
 	s := make(map[string]struct{}, len(uuids))
 	for _, u := range uuids {
diff --git a/frontend/apps/main/src/features/command/CommandBox.vue b/frontend/apps/main/src/features/command/CommandBox.vue
index 83460466..3cef5694 100644
--- a/frontend/apps/main/src/features/command/CommandBox.vue
+++ b/frontend/apps/main/src/features/command/CommandBox.vue
@@ -238,7 +238,9 @@ watch(
   () => searchTerm.value,
   () => {
     if (!open.value || isMacroMode.value) return
-    // The request only fires after the debounce, the empty state would show until then.
+    // The request only fires after the debounce, stale results would stay selectable until then.
+    searchSeq++
+    asyncResults.value = []
     loading.value = Boolean(asyncSource())
     runAsyncSearchDebounced()
   }
diff --git a/internal/conversation/message.go b/internal/conversation/message.go
index 2bd5af5c..29cea742 100644
--- a/internal/conversation/message.go
+++ b/internal/conversation/message.go
@@ -246,7 +246,7 @@ func (m *Manager) BuildTemplateData(conversationUUID string, senderID int) (map[
 		return nil, fmt.Errorf("fetching conversation: %w", err)
 	}
 
-	sender, err := m.userStore.GetAgent(senderID, "")
+	sender, err := m.userStore.GetAgentCachedOrLoad(senderID)
 	if err != nil {
 		return nil, fmt.Errorf("fetching message sender user: %w", err)
 	}
@@ -681,7 +681,7 @@ func (m *Manager) RecordAssigneeUserChange(conversationUUID string, assigneeID i
 	}
 
 	// Assignment to another user.
-	assignee, err := m.userStore.GetAgent(assigneeID, "")
+	assignee, err := m.userStore.GetAgentCachedOrLoad(assigneeID)
 	if err != nil {
 		return err
 	}
@@ -694,7 +694,7 @@ func (m *Manager) RecordAssigneeUserRemoval(conversationUUID string, assigneeID
 		return m.InsertConversationActivity(models.ActivitySelfUnassign, conversationUUID, actor.FullName(), actor)
 	}
 
-	assignee, err := m.userStore.GetAgent(assigneeID, "")
+	assignee, err := m.userStore.GetAgentCachedOrLoad(assigneeID)
 	if err != nil {
 		return err
 	}
diff --git a/internal/search/search.go b/internal/search/search.go
index d2d83044..e32b3b07 100644
--- a/internal/search/search.go
+++ b/internal/search/search.go
@@ -61,7 +61,11 @@ func (s *Manager) Conversations(query string, limit int) ([]models.ConversationR
 		s.lo.Error("error searching conversations", "error", err)
 		return nil, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
-	return append(refNumResults, emailResults...), nil
+	results := append(refNumResults, emailResults...)
+	if len(results) > limit {
+		results = results[:limit]
+	}
+	return results, nil
 }
 
 // Messages searches messages based on the query

From 8109d1b1d6c2aa46dba3a9d581c50202cf09556a Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 3 Sep 2026 00:51:13 +0530
Subject: [PATCH 036/178] filter conversation and message search by read
 permissions in sql

---
 cmd/search.go                    | 78 +++++++++++---------------------
 internal/search/models/models.go | 12 +++++
 internal/search/queries.sql      | 30 ++++++++++--
 internal/search/search.go        | 30 +++++++++---
 4 files changed, 88 insertions(+), 62 deletions(-)

diff --git a/cmd/search.go b/cmd/search.go
index 3a08ab14..cf2d2854 100644
--- a/cmd/search.go
+++ b/cmd/search.go
@@ -2,9 +2,11 @@ package main
 
 import (
 	"fmt"
+	"slices"
 	"strconv"
 
 	amodels "github.com/abhinavxd/libredesk/internal/auth/models"
+	authzmodels "github.com/abhinavxd/libredesk/internal/authz/models"
 	"github.com/abhinavxd/libredesk/internal/envelope"
 	smodels "github.com/abhinavxd/libredesk/internal/search/models"
 	"github.com/zerodha/fastglue"
@@ -13,9 +15,6 @@ import (
 const (
 	minSearchQueryLength = 3
 
-	// Read permissions are applied in Go after the query, so fetch a margin above the caller's limit.
-	searchOverFetchFactor = 5
-
 	maxConversationSearchLimit = 1000
 	maxMessageSearchLimit      = 30
 	maxContactSearchLimit      = 15
@@ -27,30 +26,15 @@ func handleSearchConversations(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	limit := searchLimit(r, maxConversationSearchLimit)
-	results, err := app.search.Conversations(q, overFetch(limit, maxConversationSearchLimit))
+	scope, err := readScope(app, user.ID)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	uuids := make([]string, len(results))
-	for i, c := range results {
-		uuids[i] = c.UUID
-	}
-	allowed, err := app.conversation.FilterAuthorizedListUUIDs(user.ID, uuids)
+	results, err := app.search.Conversations(q, scope, searchLimit(r, maxConversationSearchLimit))
 	if err != nil {
-		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.T("globals.messages.somethingWentWrong"), nil))
+		return sendErrorEnvelope(r, err)
 	}
-	set := uuidSet(allowed)
-	out := make([]smodels.ConversationResult, 0, len(allowed))
-	for _, c := range results {
-		if _, ok := set[c.UUID]; ok {
-			out = append(out, c)
-		}
-		if len(out) == limit {
-			break
-		}
-	}
-	return r.SendEnvelope(out)
+	return r.SendEnvelope(results)
 }
 
 // handleSearchMessages searches messages based on the query.
@@ -59,30 +43,15 @@ func handleSearchMessages(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	limit := searchLimit(r, maxMessageSearchLimit)
-	results, err := app.search.Messages(q, overFetch(limit, maxMessageSearchLimit))
+	scope, err := readScope(app, user.ID)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	uuids := make([]string, len(results))
-	for i, m := range results {
-		uuids[i] = m.ConversationUUID
-	}
-	allowed, err := app.conversation.FilterAuthorizedListUUIDs(user.ID, uuids)
+	results, err := app.search.Messages(q, scope, searchLimit(r, maxMessageSearchLimit))
 	if err != nil {
-		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.T("globals.messages.somethingWentWrong"), nil))
+		return sendErrorEnvelope(r, err)
 	}
-	set := uuidSet(allowed)
-	out := make([]smodels.MessageResult, 0, len(allowed))
-	for _, m := range results {
-		if _, ok := set[m.ConversationUUID]; ok {
-			out = append(out, m)
-		}
-		if len(out) == limit {
-			break
-		}
-	}
-	return r.SendEnvelope(out)
+	return r.SendEnvelope(results)
 }
 
 // handleSearchContacts searches contacts based on the query.
@@ -116,17 +85,22 @@ func searchLimit(r *fastglue.Request, max int) int {
 	return limit
 }
 
-func overFetch(limit, max int) int {
-	if limit > max/searchOverFetchFactor {
-		return max
+func readScope(app *App, agentID int) (smodels.ReadScope, error) {
+	agent, err := app.user.GetAgentCachedOrLoad(agentID)
+	if err != nil {
+		return smodels.ReadScope{}, err
 	}
-	return limit * searchOverFetchFactor
-}
-
-func uuidSet(uuids []string) map[string]struct{} {
-	s := make(map[string]struct{}, len(uuids))
-	for _, u := range uuids {
-		s[u] = struct{}{}
+	if !agent.Enabled {
+		return smodels.ReadScope{}, nil
 	}
-	return s
+	return smodels.ReadScope{
+		UserID:         agent.ID,
+		TeamIDs:        agent.Teams.IDs(),
+		Read:           slices.Contains(agent.Permissions, authzmodels.PermConversationsRead),
+		ReadAll:        slices.Contains(agent.Permissions, authzmodels.PermConversationsReadAll),
+		ReadAssigned:   slices.Contains(agent.Permissions, authzmodels.PermConversationsReadAssigned),
+		ReadTeamAll:    slices.Contains(agent.Permissions, authzmodels.PermConversationsReadTeamAll),
+		ReadTeamInbox:  slices.Contains(agent.Permissions, authzmodels.PermConversationsReadTeamInbox),
+		ReadUnassigned: slices.Contains(agent.Permissions, authzmodels.PermConversationsReadUnassigned),
+	}, nil
 }
diff --git a/internal/search/models/models.go b/internal/search/models/models.go
index ea47ed22..aa899cc8 100644
--- a/internal/search/models/models.go
+++ b/internal/search/models/models.go
@@ -6,6 +6,18 @@ import (
 	"github.com/volatiletech/null/v9"
 )
 
+// ReadScope carries an agent's conversation read permissions for filtering search results.
+type ReadScope struct {
+	UserID         int
+	TeamIDs        []int
+	Read           bool
+	ReadAll        bool
+	ReadAssigned   bool
+	ReadTeamAll    bool
+	ReadTeamInbox  bool
+	ReadUnassigned bool
+}
+
 type ConversationResult struct {
 	CreatedAt       time.Time `db:"created_at" json:"created_at"`
 	UUID            string    `db:"uuid" json:"uuid"`
diff --git a/internal/search/queries.sql b/internal/search/queries.sql
index 7eedfcae..66a9a973 100644
--- a/internal/search/queries.sql
+++ b/internal/search/queries.sql
@@ -7,7 +7,15 @@ SELECT
     cs.name AS status
 FROM conversations
 LEFT JOIN conversation_statuses cs ON conversations.status_id = cs.id
-WHERE reference_number::text = $1;
+WHERE reference_number::text = $1
+  AND $3
+  AND (
+       $4
+    OR ($5 AND conversations.assigned_user_id = $2)
+    OR ($6 AND conversations.assigned_team_id = ANY($9::int[]))
+    OR ($7 AND conversations.assigned_team_id = ANY($9::int[]) AND conversations.assigned_user_id IS NULL)
+    OR ($8 AND conversations.assigned_user_id IS NULL AND conversations.assigned_team_id IS NULL)
+  );
 
 -- name: search-conversations-by-contact-email
 SELECT
@@ -20,8 +28,16 @@ FROM conversations
 JOIN users ON conversations.contact_id = users.id
 LEFT JOIN conversation_statuses cs ON conversations.status_id = cs.id
 WHERE users.email ILIKE '%' || $1 || '%'
+  AND $3
+  AND (
+       $4
+    OR ($5 AND conversations.assigned_user_id = $2)
+    OR ($6 AND conversations.assigned_team_id = ANY($9::int[]))
+    OR ($7 AND conversations.assigned_team_id = ANY($9::int[]) AND conversations.assigned_user_id IS NULL)
+    OR ($8 AND conversations.assigned_user_id IS NULL AND conversations.assigned_team_id IS NULL)
+  )
 ORDER BY conversations.created_at DESC
-LIMIT $2;
+LIMIT $10;
 
 -- name: search-messages
 SELECT
@@ -34,7 +50,15 @@ FROM conversation_messages m
     JOIN conversations c ON m.conversation_id = c.id
     LEFT JOIN conversation_statuses cs ON c.status_id = cs.id
 WHERE m.type != 'activity' and m.text_content ILIKE '%' || $1 || '%'
-LIMIT $2;
+  AND $3
+  AND (
+       $4
+    OR ($5 AND c.assigned_user_id = $2)
+    OR ($6 AND c.assigned_team_id = ANY($9::int[]))
+    OR ($7 AND c.assigned_team_id = ANY($9::int[]) AND c.assigned_user_id IS NULL)
+    OR ($8 AND c.assigned_user_id IS NULL AND c.assigned_team_id IS NULL)
+  )
+LIMIT $10;
 
 -- name: search-contacts
 SELECT
diff --git a/internal/search/search.go b/internal/search/search.go
index e32b3b07..8f103c60 100644
--- a/internal/search/search.go
+++ b/internal/search/search.go
@@ -9,6 +9,7 @@ import (
 	models "github.com/abhinavxd/libredesk/internal/search/models"
 	"github.com/jmoiron/sqlx"
 	"github.com/knadh/go-i18n"
+	"github.com/lib/pq"
 	"github.com/zerodha/logf"
 )
 
@@ -48,16 +49,18 @@ func New(opts Opts) (*Manager, error) {
 	return &Manager{q: q, lo: opts.Lo, i18n: opts.I18n}, nil
 }
 
-// Conversations searches conversations based on the query
-func (s *Manager) Conversations(query string, limit int) ([]models.ConversationResult, error) {
+// Conversations searches conversations the agent is allowed to read.
+func (s *Manager) Conversations(query string, scope models.ReadScope, limit int) ([]models.ConversationResult, error) {
+	args := scopeArgs(scope)
+
 	var refNumResults = make([]models.ConversationResult, 0)
-	if err := s.q.SearchConversationsByRefNum.Select(&refNumResults, query); err != nil {
+	if err := s.q.SearchConversationsByRefNum.Select(&refNumResults, append([]any{query}, args...)...); err != nil {
 		s.lo.Error("error searching conversations", "error", err)
 		return nil, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
 
 	var emailResults = make([]models.ConversationResult, 0)
-	if err := s.q.SearchConversationsByContactEmail.Select(&emailResults, query, limit); err != nil {
+	if err := s.q.SearchConversationsByContactEmail.Select(&emailResults, append([]any{query}, append(args, limit)...)...); err != nil {
 		s.lo.Error("error searching conversations", "error", err)
 		return nil, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
@@ -68,10 +71,10 @@ func (s *Manager) Conversations(query string, limit int) ([]models.ConversationR
 	return results, nil
 }
 
-// Messages searches messages based on the query
-func (s *Manager) Messages(query string, limit int) ([]models.MessageResult, error) {
+// Messages searches messages in conversations the agent is allowed to read.
+func (s *Manager) Messages(query string, scope models.ReadScope, limit int) ([]models.MessageResult, error) {
 	var results = make([]models.MessageResult, 0)
-	if err := s.q.SearchMessages.Select(&results, query, limit); err != nil {
+	if err := s.q.SearchMessages.Select(&results, append([]any{query}, append(scopeArgs(scope), limit)...)...); err != nil {
 		s.lo.Error("error searching messages", "error", err)
 		return nil, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
@@ -87,3 +90,16 @@ func (s *Manager) Contacts(query string, limit int) ([]models.ContactResult, err
 	}
 	return results, nil
 }
+
+func scopeArgs(scope models.ReadScope) []any {
+	return []any{
+		scope.UserID,
+		scope.Read,
+		scope.ReadAll,
+		scope.ReadAssigned,
+		scope.ReadTeamAll,
+		scope.ReadTeamInbox,
+		scope.ReadUnassigned,
+		pq.Array(scope.TeamIDs),
+	}
+}

From 3d45b5f74fa131496caf5501e6178d694b57bcc4 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 3 Sep 2026 01:43:30 +0530
Subject: [PATCH 037/178] fix ticket reference parsing, stored links and
 suggestion popup

---
 .../components/editor/TicketReferenceList.vue |   4 +-
 .../src/components/editor/editorExtensions.js |   4 +-
 .../src/components/editor/editorStyles.scss   |   3 +-
 .../components/editor/mentionSuggestion.js    | 109 +-----------------
 .../components/editor/suggestionRenderer.js   |  64 ++++++++++
 .../src/components/editor/ticketReference.js  |  12 +-
 .../components/editor/ticketReference.test.js |  44 +++----
 .../editor/ticketReferenceExtension.js        |  40 +------
 .../editor/ticketReferenceExtension.test.js   |  43 +++----
 .../editor/ticketReferenceSuggestion.js       |  47 +-------
 .../src/components/editor/useTextEditor.js    |  15 ---
 .../features/conversation/ReplyBoxContent.vue |   6 +-
 .../conversation/message/MessageBubble.vue    |  11 +-
 frontend/shared-ui/assets/styles/main.scss    |   4 +-
 i18n/en-US.json                               |   1 -
 15 files changed, 143 insertions(+), 264 deletions(-)
 create mode 100644 frontend/apps/main/src/components/editor/suggestionRenderer.js

diff --git a/frontend/apps/main/src/components/editor/TicketReferenceList.vue b/frontend/apps/main/src/components/editor/TicketReferenceList.vue
index 50c1f541..fb168578 100644
--- a/frontend/apps/main/src/components/editor/TicketReferenceList.vue
+++ b/frontend/apps/main/src/components/editor/TicketReferenceList.vue
@@ -22,8 +22,8 @@
   <div v-else class="ticket-reference-list bg-background border rounded-lg shadow-lg p-3">
     <span v-if="query.length < MIN_REFERENCE_QUERY_LENGTH" class="text-sm text-muted-foreground">
       {{
-        $t('globals.messages.typeAtLeastDigitsToSearchTickets', {
-          count: MIN_REFERENCE_QUERY_LENGTH
+        $t('search.minQueryLength', {
+          length: MIN_REFERENCE_QUERY_LENGTH
         })
       }}
     </span>
diff --git a/frontend/apps/main/src/components/editor/editorExtensions.js b/frontend/apps/main/src/components/editor/editorExtensions.js
index 6b4c024b..9cff04d8 100644
--- a/frontend/apps/main/src/components/editor/editorExtensions.js
+++ b/frontend/apps/main/src/components/editor/editorExtensions.js
@@ -137,9 +137,7 @@ const sharedExtensions = ({
   CustomLink
 ]
 
-export function buildConversationExtensions({
-  getPlaceholder
-}) {
+export function buildConversationExtensions({ getPlaceholder }) {
   return [
     ...sharedExtensions({ getPlaceholder }),
     CustomMention.configure({
diff --git a/frontend/apps/main/src/components/editor/editorStyles.scss b/frontend/apps/main/src/components/editor/editorStyles.scss
index d8513336..bb54614c 100644
--- a/frontend/apps/main/src/components/editor/editorStyles.scss
+++ b/frontend/apps/main/src/components/editor/editorStyles.scss
@@ -55,7 +55,8 @@
     }
   }
 
-  .ld-mention {
+  .ld-mention,
+  .ld-ticket-reference {
     background-color: hsl(var(--primary) / 0.1);
     border-radius: 0.25rem;
     padding: 0 0.25rem;
diff --git a/frontend/apps/main/src/components/editor/mentionSuggestion.js b/frontend/apps/main/src/components/editor/mentionSuggestion.js
index 2b6bffdc..b0e93750 100644
--- a/frontend/apps/main/src/components/editor/mentionSuggestion.js
+++ b/frontend/apps/main/src/components/editor/mentionSuggestion.js
@@ -1,111 +1,10 @@
-import { VueRenderer } from '@tiptap/vue-3'
 import MentionList from './MentionList.vue'
+import { createSuggestionRenderer } from './suggestionRenderer'
 
 export default {
   char: '@',
   allowSpaces: true,
-
-  allow: ({ editor }) => {
-    const enableMentions = editor.options.editorProps?.enableMentions
-    return enableMentions ? enableMentions() : false
-  },
-
-  items: async ({ query, editor }) => {
-    // Get the suggestion handler from editor options
-    const getSuggestions = editor.options.editorProps?.getSuggestions
-    if (!getSuggestions) return []
-
-    const items = await getSuggestions(query)
-    return items
-  },
-
-  render: () => {
-    let component
-    let popup
-
-    return {
-      onStart: (props) => {
-        component = new VueRenderer(MentionList, {
-          props: {
-            ...props,
-            query: props.query
-          },
-          editor: props.editor
-        })
-
-        if (!props.clientRect) {
-          return
-        }
-
-        // Create popup container with CSS positioning
-        popup = document.createElement('div')
-        popup.style.position = 'fixed'
-        popup.style.zIndex = '9999'
-        if (component.element) {
-          popup.appendChild(component.element)
-        }
-        document.body.appendChild(popup)
-
-        // Position the popup
-        updatePosition(popup, props.clientRect)
-      },
-
-      onUpdate: (props) => {
-        component.updateProps({
-          ...props,
-          query: props.query
-        })
-
-        if (!props.clientRect || !popup) {
-          return
-        }
-
-        updatePosition(popup, props.clientRect)
-      },
-
-      onKeyDown: (props) => {
-        if (props.event.key === 'Escape') {
-          if (popup) {
-            popup.style.display = 'none'
-          }
-          return true
-        }
-
-        return component.ref?.onKeyDown(props)
-      },
-
-      onExit: () => {
-        if (popup && popup.parentNode) {
-          popup.parentNode.removeChild(popup)
-        }
-        component.destroy()
-      }
-    }
-  }
-}
-
-function updatePosition(popup, clientRect) {
-  const rect = clientRect()
-  if (!rect) return
-
-  // Position below the cursor
-  popup.style.left = `${rect.left}px`
-  popup.style.top = `${rect.bottom + 4}px`
-
-  // Ensure popup doesn't go off-screen to the right
-  requestAnimationFrame(() => {
-    const popupRect = popup.getBoundingClientRect()
-    const viewportWidth = window.innerWidth
-    const viewportHeight = window.innerHeight
-
-    // Adjust horizontal position if needed
-    if (popupRect.right > viewportWidth) {
-      popup.style.left = `${viewportWidth - popupRect.width - 8}px`
-    }
-
-    // If popup goes below viewport, show above cursor
-    if (popupRect.bottom > viewportHeight) {
-      popup.style.top = `${rect.top - popupRect.height - 4}px`
-    }
-  })
+  allow: ({ editor }) => editor.options.editorProps?.enableMentions?.() ?? false,
+  items: ({ query, editor }) => editor.options.editorProps?.getSuggestions?.(query) ?? [],
+  render: () => createSuggestionRenderer(MentionList)
 }
diff --git a/frontend/apps/main/src/components/editor/suggestionRenderer.js b/frontend/apps/main/src/components/editor/suggestionRenderer.js
new file mode 100644
index 00000000..e0db90dd
--- /dev/null
+++ b/frontend/apps/main/src/components/editor/suggestionRenderer.js
@@ -0,0 +1,64 @@
+import { VueRenderer } from '@tiptap/vue-3'
+
+export function createSuggestionRenderer(ListComponent) {
+  let component
+  let popup
+  let dismissed = false
+
+  return {
+    onStart: (props) => {
+      dismissed = false
+      component = new VueRenderer(ListComponent, {
+        props: { ...props, query: props.query },
+        editor: props.editor
+      })
+      if (!props.clientRect) return
+
+      popup = document.createElement('div')
+      popup.style.position = 'fixed'
+      popup.style.zIndex = '9999'
+      if (component.element) popup.appendChild(component.element)
+      document.body.appendChild(popup)
+      updatePosition(popup, props.clientRect)
+    },
+
+    onUpdate: (props) => {
+      component.updateProps({ ...props, query: props.query })
+      if (!props.clientRect || !popup) return
+      updatePosition(popup, props.clientRect)
+    },
+
+    onKeyDown: (props) => {
+      if (dismissed) return false
+      if (props.event.key === 'Escape') {
+        dismissed = true
+        if (popup) popup.style.display = 'none'
+        return true
+      }
+      return component.ref?.onKeyDown(props)
+    },
+
+    onExit: () => {
+      popup?.remove()
+      component.destroy()
+    }
+  }
+}
+
+function updatePosition(popup, clientRect) {
+  const rect = clientRect()
+  if (!rect) return
+
+  popup.style.left = `${rect.left}px`
+  popup.style.top = `${rect.bottom + 4}px`
+
+  requestAnimationFrame(() => {
+    const popupRect = popup.getBoundingClientRect()
+    if (popupRect.right > window.innerWidth) {
+      popup.style.left = `${window.innerWidth - popupRect.width - 8}px`
+    }
+    if (popupRect.bottom > window.innerHeight) {
+      popup.style.top = `${rect.top - popupRect.height - 4}px`
+    }
+  })
+}
diff --git a/frontend/apps/main/src/components/editor/ticketReference.js b/frontend/apps/main/src/components/editor/ticketReference.js
index c963fd7c..b5f05986 100644
--- a/frontend/apps/main/src/components/editor/ticketReference.js
+++ b/frontend/apps/main/src/components/editor/ticketReference.js
@@ -1,23 +1,17 @@
 import api from '@main/api'
 
 export const MIN_REFERENCE_QUERY_LENGTH = 3
-
-export const conversationReferenceHref = (uuid) => {
-  const path = `/inboxes/all/conversation/${uuid}`
-  const origin = typeof window !== 'undefined' ? window.location.origin : ''
-  return origin ? `${origin}${path}` : path
-}
+const SUGGESTION_LIMIT = 10
 
 export const getTicketSuggestions = async (query, search = api.searchConversations) => {
   const reference = query.trim()
   if (reference.length < MIN_REFERENCE_QUERY_LENGTH) return []
 
   const response = await search({ query: reference })
-  return (response.data?.data || []).map((conversation) => ({
+  return (response.data?.data || []).slice(0, SUGGESTION_LIMIT).map((conversation) => ({
     id: conversation.uuid,
     label: conversation.reference_number,
     subject: conversation.subject,
-    status: conversation.status,
-    href: conversationReferenceHref(conversation.uuid)
+    status: conversation.status
   }))
 }
diff --git a/frontend/apps/main/src/components/editor/ticketReference.test.js b/frontend/apps/main/src/components/editor/ticketReference.test.js
index 216bdf67..85e967c4 100644
--- a/frontend/apps/main/src/components/editor/ticketReference.test.js
+++ b/frontend/apps/main/src/components/editor/ticketReference.test.js
@@ -1,5 +1,5 @@
 import { describe, expect, it, vi } from 'vitest'
-import { conversationReferenceHref, getTicketSuggestions } from './ticketReference'
+import { getTicketSuggestions } from './ticketReference'
 
 describe('ticket reference suggestions', () => {
   it('does not search until three characters are entered', async () => {
@@ -8,33 +8,27 @@ describe('ticket reference suggestions', () => {
     expect(search).not.toHaveBeenCalled()
   })
 
-  it('maps a conversation result to a link suggestion', async () => {
-    const search = vi
-      .fn()
-      .mockResolvedValue({
-        data: {
-          data: [
-            {
-              uuid: 'conversation-uuid',
-              reference_number: '108',
-              subject: 'Payment failed',
-              status: 'Open'
-            }
-          ]
-        }
-      })
-    await expect(getTicketSuggestions('108', search)).resolves.toEqual([
-      {
-        id: 'conversation-uuid',
-        label: '108',
-        subject: 'Payment failed',
-        status: 'Open',
-        href: '/inboxes/all/conversation/conversation-uuid'
+  it('maps a conversation result to a suggestion', async () => {
+    const search = vi.fn().mockResolvedValue({
+      data: {
+        data: [
+          {
+            uuid: 'conversation-uuid',
+            reference_number: '108',
+            subject: 'Payment failed',
+            status: 'Open'
+          }
+        ]
       }
+    })
+    await expect(getTicketSuggestions('108', search)).resolves.toEqual([
+      { id: 'conversation-uuid', label: '108', subject: 'Payment failed', status: 'Open' }
     ])
   })
 
-  it('builds a stable conversation link', () => {
-    expect(conversationReferenceHref('abc')).toBe('/inboxes/all/conversation/abc')
+  it('caps the suggestion list', async () => {
+    const rows = Array.from({ length: 30 }, (_, i) => ({ uuid: `u${i}`, reference_number: `${i}` }))
+    const search = vi.fn().mockResolvedValue({ data: { data: rows } })
+    await expect(getTicketSuggestions('108', search)).resolves.toHaveLength(10)
   })
 })
diff --git a/frontend/apps/main/src/components/editor/ticketReferenceExtension.js b/frontend/apps/main/src/components/editor/ticketReferenceExtension.js
index 61da9249..afa45203 100644
--- a/frontend/apps/main/src/components/editor/ticketReferenceExtension.js
+++ b/frontend/apps/main/src/components/editor/ticketReferenceExtension.js
@@ -1,48 +1,18 @@
 import Mention from '@tiptap/extension-mention'
 
-const conversationPath = /^\/inboxes\/all\/conversation\/[^/?#]+$/
-
-export const isSafeTicketReferenceHref = (href) => {
-  if (!href || href.startsWith('//')) return false
-
-  try {
-    const url = new URL(href, window.location.origin)
-    return (
-      (url.protocol === 'http:' || url.protocol === 'https:') &&
-      url.origin === window.location.origin &&
-      conversationPath.test(url.pathname)
-    )
-  } catch {
-    return false
-  }
-}
+export const conversationReferenceHref = (uuid) =>
+  `/inboxes/all/conversation/${encodeURIComponent(uuid)}`
 
 export const TicketReference = Mention.extend({
   name: 'ticketReference',
-  addAttributes() {
-    return {
-      ...this.parent?.(),
-      href: {
-        default: null,
-        parseHTML: (element) => {
-          const href = element.getAttribute('href')
-          return isSafeTicketReferenceHref(href) ? href : null
-        }
-      },
-      type: {
-        default: 'ticket-reference',
-        parseHTML: (element) => element.getAttribute('data-type') || 'ticket-reference',
-        renderHTML: (attributes) => ({ 'data-type': attributes.type })
-      }
-    }
-  },
-  parseHTML: () => [{ tag: 'a.ld-ticket-reference' }],
+  // Link's a[href] mark rule is registered first at the default priority and would swallow the anchor.
+  parseHTML: () => [{ tag: 'a.ld-ticket-reference', priority: 51 }],
   renderText: ({ node }) => `#${node.attrs.label}`,
   renderHTML: ({ node, HTMLAttributes }) => [
     'a',
     {
       ...HTMLAttributes,
-      href: node.attrs.href,
+      href: conversationReferenceHref(node.attrs.id),
       class: [HTMLAttributes.class, 'ld-ticket-reference'].filter(Boolean).join(' ')
     },
     `#${node.attrs.label}`
diff --git a/frontend/apps/main/src/components/editor/ticketReferenceExtension.test.js b/frontend/apps/main/src/components/editor/ticketReferenceExtension.test.js
index f24706d8..93458a05 100644
--- a/frontend/apps/main/src/components/editor/ticketReferenceExtension.test.js
+++ b/frontend/apps/main/src/components/editor/ticketReferenceExtension.test.js
@@ -1,36 +1,39 @@
 // @vitest-environment jsdom
 
 import { describe, expect, it } from 'vitest'
-import StarterKit from '@tiptap/starter-kit'
 import { Editor } from '@tiptap/vue-3'
-import { isSafeTicketReferenceHref, TicketReference } from './ticketReferenceExtension'
+import { buildConversationExtensions } from './editorExtensions'
+import { conversationReferenceHref } from './ticketReferenceExtension'
 
 describe('ticket reference editor extension', () => {
-  it.each([
-    ['/inboxes/all/conversation/conversation-uuid', true],
-    ['http://localhost:3000/inboxes/all/conversation/conversation-uuid', true],
-    ['https://evil.example/inboxes/all/conversation/conversation-uuid', false],
-    ['//evil.example/inboxes/all/conversation/conversation-uuid', false],
-    ['javascript:alert(1)', false],
-    ['data:text/html,<script>alert(1)</script>', false]
-  ])('validates ticket reference href %s', (href, expected) => {
-    expect(isSafeTicketReferenceHref(href)).toBe(expected)
+  it('builds a root-relative conversation link', () => {
+    expect(conversationReferenceHref('abc')).toBe('/inboxes/all/conversation/abc')
   })
 
-  it('round-trips a ticket reference through HTML', () => {
+  it('round-trips a ticket reference through HTML in the conversation editor', () => {
     const content =
-      '<p><a data-id="conversation-uuid" data-label="108" data-type="ticket-reference" href="/inboxes/all/conversation/conversation-uuid" class="ld-ticket-reference">#108</a></p>'
-    const editor = new Editor({ extensions: [StarterKit, TicketReference], content })
+      '<p><a data-id="conversation-uuid" data-label="108" href="/inboxes/all/conversation/conversation-uuid" class="ld-ticket-reference">#108</a></p>'
+    const editor = new Editor({
+      extensions: buildConversationExtensions({ getPlaceholder: () => '' }),
+      content
+    })
     expect(editor.getJSON().content[0].content[0]).toMatchObject({
       type: 'ticketReference',
-      attrs: {
-        id: 'conversation-uuid',
-        label: '108',
-        href: '/inboxes/all/conversation/conversation-uuid',
-        type: 'ticket-reference'
-      }
+      attrs: { id: 'conversation-uuid', label: '108' }
     })
     expect(editor.getHTML()).toContain('href="/inboxes/all/conversation/conversation-uuid"')
     editor.destroy()
   })
+
+  it('derives the link from the conversation id, ignoring a stored href', () => {
+    const content =
+      '<p><a data-id="conversation-uuid" data-label="108" href="https://evil.example/x" class="ld-ticket-reference">#108</a></p>'
+    const editor = new Editor({
+      extensions: buildConversationExtensions({ getPlaceholder: () => '' }),
+      content
+    })
+    expect(editor.getHTML()).toContain('href="/inboxes/all/conversation/conversation-uuid"')
+    expect(editor.getHTML()).not.toContain('evil.example')
+    editor.destroy()
+  })
 })
diff --git a/frontend/apps/main/src/components/editor/ticketReferenceSuggestion.js b/frontend/apps/main/src/components/editor/ticketReferenceSuggestion.js
index 11bcb612..33bcaad8 100644
--- a/frontend/apps/main/src/components/editor/ticketReferenceSuggestion.js
+++ b/frontend/apps/main/src/components/editor/ticketReferenceSuggestion.js
@@ -1,51 +1,10 @@
-import { VueRenderer } from '@tiptap/vue-3'
 import TicketReferenceList from './TicketReferenceList.vue'
+import { createSuggestionRenderer } from './suggestionRenderer'
 
 export default {
   char: '#',
   allowSpaces: false,
   allow: ({ editor }) => editor.options.editorProps?.ticketReferencesEnabled?.() ?? false,
-  items: async ({ query, editor }) =>
-    editor.options.editorProps?.getTicketSuggestions?.(query) || [],
-  render: () => {
-    let component
-    let popup
-    const position = (rect) => {
-      if (!rect || !popup) return
-      const bounds = rect()
-      if (!bounds) return
-      popup.style.left = `${bounds.left}px`
-      popup.style.top = `${bounds.bottom + 4}px`
-    }
-    return {
-      onStart: (props) => {
-        component = new VueRenderer(TicketReferenceList, {
-          props: { ...props, query: props.query },
-          editor: props.editor
-        })
-        if (!props.clientRect) return
-        popup = document.createElement('div')
-        popup.style.position = 'fixed'
-        popup.style.zIndex = '9999'
-        popup.appendChild(component.element)
-        document.body.appendChild(popup)
-        position(props.clientRect)
-      },
-      onUpdate: (props) => {
-        component?.updateProps({ ...props, query: props.query })
-        position(props.clientRect)
-      },
-      onKeyDown: (props) => {
-        if (props.event.key === 'Escape') {
-          if (popup) popup.style.display = 'none'
-          return true
-        }
-        return component?.ref?.onKeyDown(props)
-      },
-      onExit: () => {
-        popup?.remove()
-        component?.destroy()
-      }
-    }
-  }
+  items: ({ query, editor }) => editor.options.editorProps?.getTicketSuggestions?.(query) ?? [],
+  render: () => createSuggestionRenderer(TicketReferenceList)
 }
diff --git a/frontend/apps/main/src/components/editor/useTextEditor.js b/frontend/apps/main/src/components/editor/useTextEditor.js
index 0c282c85..f12b0da4 100644
--- a/frontend/apps/main/src/components/editor/useTextEditor.js
+++ b/frontend/apps/main/src/components/editor/useTextEditor.js
@@ -1,7 +1,6 @@
 import { ref, watch, onUnmounted } from 'vue'
 import { useEditor } from '@tiptap/vue-3'
 import { useInlineImageUpload } from '@main/composables/useInlineImageUpload'
-import { isSafeTicketReferenceHref } from './ticketReferenceExtension'
 
 export function useTextEditor({
   extensions,
@@ -57,20 +56,6 @@ export function useTextEditor({
       enableMentions,
       getTicketSuggestions,
       ticketReferencesEnabled,
-      handleDOMEvents: {
-        click: (_view, event) => {
-          const target =
-            event.target instanceof HTMLElement
-              ? event.target.closest('a.ld-ticket-reference')
-              : null
-          if (!target) return false
-          event.preventDefault()
-          if (isSafeTicketReferenceHref(target.getAttribute('href'))) {
-            window.open(target.href, '_blank', 'noopener,noreferrer')
-          }
-          return true
-        }
-      },
       handlePaste,
       handleDrop,
       handleKeyDown: (view, event) => {
diff --git a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
index e7b1a86f..54eff9b0 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
@@ -168,10 +168,10 @@ import { useI18n } from 'vue-i18n'
 import { validateEmail } from '@shared-ui/utils/string'
 import { useMacroStore } from '@main/stores/macro'
 import api from '@main/api'
+import { getTicketSuggestions as fetchTicketSuggestions } from '@main/components/editor/ticketReference'
 
 const MENTION_LIMIT = 10
 const MENTION_DEBOUNCE_MS = 250
-import { getTicketSuggestions as fetchTicketSuggestions } from '@main/components/editor/ticketReference'
 
 const messageType = defineModel('messageType', { default: 'reply' })
 const to = defineModel('to', { default: '' })
@@ -217,10 +217,12 @@ const getSuggestions = async (query) => {
   return (await debouncedFetchSuggestions(query)) || []
 }
 
+const debouncedFetchTicketSuggestions = useDebounceFn(fetchTicketSuggestions, MENTION_DEBOUNCE_MS)
+
 const getTicketSuggestions = async (query) => {
   if (messageType.value !== 'private_note') return []
   const messageTypeAtRequest = messageType.value
-  const suggestions = await fetchTicketSuggestions(query)
+  const suggestions = (await debouncedFetchTicketSuggestions(query)) || []
   return messageType.value === messageTypeAtRequest ? suggestions : []
 }
 
diff --git a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
index 9c24f949..a7e44151 100644
--- a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
+++ b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
@@ -108,7 +108,8 @@
               <div v-else ref="messageContentEl" @click="onMessageContentClick">
                 <Letter
                   :html="sanitizedContent"
-                  :allowedSchemas="['cid', 'https', 'http', 'mailto']"
+                  :allowedSchemas="allowedSchemas"
+                  :rewriteExternalLinks="rewriteMessageLink"
                   :allowed-css-properties="extendedCssProperties"
                   class="mb-1 native-html break-words"
                   :class="{ 'mb-3': message.attachments.length > 0 }"
@@ -385,6 +386,14 @@ const avatarFallback = computed(() => {
   return firstName.toUpperCase().substring(0, 2)
 })
 
+const allowedSchemas = ['cid', 'https', 'http', 'mailto']
+
+// vue-letter skips its own href schema check once a rewrite hook is set.
+const rewriteMessageLink = (href) => {
+  if (href.startsWith('/') && !href.startsWith('//')) return `${window.location.origin}${href}`
+  return allowedSchemas.includes(href.toLowerCase().split(':')[0]) ? href : ''
+}
+
 const sanitizedContent = computed(() => {
   if (props.message.meta?.is_csat) {
     return t('globals.messages.pleaseRateConversation')
diff --git a/frontend/shared-ui/assets/styles/main.scss b/frontend/shared-ui/assets/styles/main.scss
index ec35c79f..5ddc10b6 100644
--- a/frontend/shared-ui/assets/styles/main.scss
+++ b/frontend/shared-ui/assets/styles/main.scss
@@ -121,7 +121,9 @@
 
     // Mention styling — vue-letter scopes classes as msg_XXX_ld-mention
     [class$="_ld-mention"],
-    .ld-mention {
+    [class$="_ld-ticket-reference"],
+    .ld-mention,
+    .ld-ticket-reference {
       background-color: hsl(var(--primary) / 0.1);
       border-radius: 0.25rem;
       padding: 0 0.25rem;
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 8367c95d..b84e00bf 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -859,7 +859,6 @@
   "globals.messages.noInternetConnection": "No internet connection",
   "globals.messages.noMessagesYet": "No messages yet",
   "globals.messages.noResultsFound": "No results found",
-  "globals.messages.typeAtLeastDigitsToSearchTickets": "Type at least {count} digits to search tickets",
   "globals.messages.notAllowed": "Not allowed",
   "globals.messages.notFound": "Not found",
   "globals.messages.options": "Options",

From e1c87195803e010d28a23c53f009d2722ae66c22 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 3 Sep 2026 11:15:38 +0530
Subject: [PATCH 038/178] rename ticket references to conversation references

---
 .../src/components/editor/ConversationEditor.vue     |  8 ++++----
 ...ferenceList.vue => ConversationReferenceList.vue} | 12 ++++++------
 .../{ticketReference.js => conversationReference.js} |  2 +-
 ...ference.test.js => conversationReference.test.js} | 10 +++++-----
 ...xtension.js => conversationReferenceExtension.js} |  8 ++++----
 ...est.js => conversationReferenceExtension.test.js} | 12 ++++++------
 .../editor/conversationReferenceSuggestion.js        | 10 ++++++++++
 .../main/src/components/editor/editorExtensions.js   |  6 +++---
 .../main/src/components/editor/editorStyles.scss     |  2 +-
 .../components/editor/ticketReferenceSuggestion.js   | 10 ----------
 .../apps/main/src/components/editor/useTextEditor.js |  8 ++++----
 .../src/features/conversation/ReplyBoxContent.vue    | 12 ++++++------
 frontend/shared-ui/assets/styles/main.scss           |  4 ++--
 13 files changed, 52 insertions(+), 52 deletions(-)
 rename frontend/apps/main/src/components/editor/{TicketReferenceList.vue => ConversationReferenceList.vue} (78%)
 rename frontend/apps/main/src/components/editor/{ticketReference.js => conversationReference.js} (83%)
 rename frontend/apps/main/src/components/editor/{ticketReference.test.js => conversationReference.test.js} (70%)
 rename frontend/apps/main/src/components/editor/{ticketReferenceExtension.js => conversationReferenceExtension.js} (66%)
 rename frontend/apps/main/src/components/editor/{ticketReferenceExtension.test.js => conversationReferenceExtension.test.js} (74%)
 create mode 100644 frontend/apps/main/src/components/editor/conversationReferenceSuggestion.js
 delete mode 100644 frontend/apps/main/src/components/editor/ticketReferenceSuggestion.js

diff --git a/frontend/apps/main/src/components/editor/ConversationEditor.vue b/frontend/apps/main/src/components/editor/ConversationEditor.vue
index 56077080..a439a2ec 100644
--- a/frontend/apps/main/src/components/editor/ConversationEditor.vue
+++ b/frontend/apps/main/src/components/editor/ConversationEditor.vue
@@ -45,8 +45,8 @@ const props = defineProps({
   disabled: { type: Boolean, default: false },
   enableMentions: { type: Boolean, default: false },
   getSuggestions: { type: Function, default: null },
-  enableTicketReferences: { type: Boolean, default: false },
-  getTicketSuggestions: { type: Function, default: null },
+  enableConversationReferences: { type: Boolean, default: false },
+  getConversationSuggestions: { type: Function, default: null },
   enableInlineImages: { type: Boolean, default: false },
   linkedModel: { type: String, default: 'messages' }
 })
@@ -87,8 +87,8 @@ const { editor, extractMentions, focus } = useTextEditor({
   linkedModel: props.linkedModel,
   getSuggestions: props.getSuggestions,
   enableMentions: () => props.enableMentions,
-  getTicketSuggestions: props.getTicketSuggestions,
-  ticketReferencesEnabled: () => props.enableTicketReferences,
+  getConversationSuggestions: props.getConversationSuggestions,
+  conversationReferencesEnabled: () => props.enableConversationReferences,
   onSend: () => {
     emit('send')
     stopTyping()
diff --git a/frontend/apps/main/src/components/editor/TicketReferenceList.vue b/frontend/apps/main/src/components/editor/ConversationReferenceList.vue
similarity index 78%
rename from frontend/apps/main/src/components/editor/TicketReferenceList.vue
rename to frontend/apps/main/src/components/editor/ConversationReferenceList.vue
index fb168578..dc4ed428 100644
--- a/frontend/apps/main/src/components/editor/TicketReferenceList.vue
+++ b/frontend/apps/main/src/components/editor/ConversationReferenceList.vue
@@ -1,12 +1,12 @@
 <template>
   <div
     v-if="items.length > 0"
-    class="ticket-reference-list bg-background border rounded-lg shadow-lg overflow-hidden max-h-60 overflow-y-auto"
+    class="conversation-reference-list bg-background border rounded-lg shadow-lg overflow-hidden max-h-60 overflow-y-auto"
   >
     <button
       v-for="(item, index) in items"
       :key="item.id"
-      class="ticket-reference-item w-full text-left px-3 py-2 hover:bg-muted"
+      class="conversation-reference-item w-full text-left px-3 py-2 hover:bg-muted"
       :class="{ 'bg-muted': index === selectedIndex }"
       @click="selectItem(index)"
     >
@@ -19,7 +19,7 @@
       </div>
     </button>
   </div>
-  <div v-else class="ticket-reference-list bg-background border rounded-lg shadow-lg p-3">
+  <div v-else class="conversation-reference-list bg-background border rounded-lg shadow-lg p-3">
     <span v-if="query.length < MIN_REFERENCE_QUERY_LENGTH" class="text-sm text-muted-foreground">
       {{
         $t('search.minQueryLength', {
@@ -35,7 +35,7 @@
 
 <script setup>
 import { ref, watch, nextTick } from 'vue'
-import { MIN_REFERENCE_QUERY_LENGTH } from './ticketReference'
+import { MIN_REFERENCE_QUERY_LENGTH } from './conversationReference'
 
 const props = defineProps({
   items: { type: Array, default: () => [] },
@@ -52,7 +52,7 @@ watch(
 )
 watch(selectedIndex, () =>
   nextTick(() =>
-    document.querySelector('.ticket-reference-item.bg-muted')?.scrollIntoView({ block: 'nearest' })
+    document.querySelector('.conversation-reference-item.bg-muted')?.scrollIntoView({ block: 'nearest' })
   )
 )
 defineExpose({
@@ -70,7 +70,7 @@ defineExpose({
 </script>
 
 <style scoped>
-.ticket-reference-list {
+.conversation-reference-list {
   min-width: 240px;
   max-width: 360px;
 }
diff --git a/frontend/apps/main/src/components/editor/ticketReference.js b/frontend/apps/main/src/components/editor/conversationReference.js
similarity index 83%
rename from frontend/apps/main/src/components/editor/ticketReference.js
rename to frontend/apps/main/src/components/editor/conversationReference.js
index b5f05986..8f2b5c35 100644
--- a/frontend/apps/main/src/components/editor/ticketReference.js
+++ b/frontend/apps/main/src/components/editor/conversationReference.js
@@ -3,7 +3,7 @@ import api from '@main/api'
 export const MIN_REFERENCE_QUERY_LENGTH = 3
 const SUGGESTION_LIMIT = 10
 
-export const getTicketSuggestions = async (query, search = api.searchConversations) => {
+export const getConversationSuggestions = async (query, search = api.searchConversations) => {
   const reference = query.trim()
   if (reference.length < MIN_REFERENCE_QUERY_LENGTH) return []
 
diff --git a/frontend/apps/main/src/components/editor/ticketReference.test.js b/frontend/apps/main/src/components/editor/conversationReference.test.js
similarity index 70%
rename from frontend/apps/main/src/components/editor/ticketReference.test.js
rename to frontend/apps/main/src/components/editor/conversationReference.test.js
index 85e967c4..ff9c5e86 100644
--- a/frontend/apps/main/src/components/editor/ticketReference.test.js
+++ b/frontend/apps/main/src/components/editor/conversationReference.test.js
@@ -1,10 +1,10 @@
 import { describe, expect, it, vi } from 'vitest'
-import { getTicketSuggestions } from './ticketReference'
+import { getConversationSuggestions } from './conversationReference'
 
-describe('ticket reference suggestions', () => {
+describe('conversation reference suggestions', () => {
   it('does not search until three characters are entered', async () => {
     const search = vi.fn()
-    await expect(getTicketSuggestions('10', search)).resolves.toEqual([])
+    await expect(getConversationSuggestions('10', search)).resolves.toEqual([])
     expect(search).not.toHaveBeenCalled()
   })
 
@@ -21,7 +21,7 @@ describe('ticket reference suggestions', () => {
         ]
       }
     })
-    await expect(getTicketSuggestions('108', search)).resolves.toEqual([
+    await expect(getConversationSuggestions('108', search)).resolves.toEqual([
       { id: 'conversation-uuid', label: '108', subject: 'Payment failed', status: 'Open' }
     ])
   })
@@ -29,6 +29,6 @@ describe('ticket reference suggestions', () => {
   it('caps the suggestion list', async () => {
     const rows = Array.from({ length: 30 }, (_, i) => ({ uuid: `u${i}`, reference_number: `${i}` }))
     const search = vi.fn().mockResolvedValue({ data: { data: rows } })
-    await expect(getTicketSuggestions('108', search)).resolves.toHaveLength(10)
+    await expect(getConversationSuggestions('108', search)).resolves.toHaveLength(10)
   })
 })
diff --git a/frontend/apps/main/src/components/editor/ticketReferenceExtension.js b/frontend/apps/main/src/components/editor/conversationReferenceExtension.js
similarity index 66%
rename from frontend/apps/main/src/components/editor/ticketReferenceExtension.js
rename to frontend/apps/main/src/components/editor/conversationReferenceExtension.js
index afa45203..6b071f0a 100644
--- a/frontend/apps/main/src/components/editor/ticketReferenceExtension.js
+++ b/frontend/apps/main/src/components/editor/conversationReferenceExtension.js
@@ -3,17 +3,17 @@ import Mention from '@tiptap/extension-mention'
 export const conversationReferenceHref = (uuid) =>
   `/inboxes/all/conversation/${encodeURIComponent(uuid)}`
 
-export const TicketReference = Mention.extend({
-  name: 'ticketReference',
+export const ConversationReference = Mention.extend({
+  name: 'conversationReference',
   // Link's a[href] mark rule is registered first at the default priority and would swallow the anchor.
-  parseHTML: () => [{ tag: 'a.ld-ticket-reference', priority: 51 }],
+  parseHTML: () => [{ tag: 'a.ld-conversation-reference', priority: 51 }],
   renderText: ({ node }) => `#${node.attrs.label}`,
   renderHTML: ({ node, HTMLAttributes }) => [
     'a',
     {
       ...HTMLAttributes,
       href: conversationReferenceHref(node.attrs.id),
-      class: [HTMLAttributes.class, 'ld-ticket-reference'].filter(Boolean).join(' ')
+      class: [HTMLAttributes.class, 'ld-conversation-reference'].filter(Boolean).join(' ')
     },
     `#${node.attrs.label}`
   ]
diff --git a/frontend/apps/main/src/components/editor/ticketReferenceExtension.test.js b/frontend/apps/main/src/components/editor/conversationReferenceExtension.test.js
similarity index 74%
rename from frontend/apps/main/src/components/editor/ticketReferenceExtension.test.js
rename to frontend/apps/main/src/components/editor/conversationReferenceExtension.test.js
index 93458a05..9d5515ab 100644
--- a/frontend/apps/main/src/components/editor/ticketReferenceExtension.test.js
+++ b/frontend/apps/main/src/components/editor/conversationReferenceExtension.test.js
@@ -3,22 +3,22 @@
 import { describe, expect, it } from 'vitest'
 import { Editor } from '@tiptap/vue-3'
 import { buildConversationExtensions } from './editorExtensions'
-import { conversationReferenceHref } from './ticketReferenceExtension'
+import { conversationReferenceHref } from './conversationReferenceExtension'
 
-describe('ticket reference editor extension', () => {
+describe('conversation reference editor extension', () => {
   it('builds a root-relative conversation link', () => {
     expect(conversationReferenceHref('abc')).toBe('/inboxes/all/conversation/abc')
   })
 
-  it('round-trips a ticket reference through HTML in the conversation editor', () => {
+  it('round-trips a conversation reference through HTML in the conversation editor', () => {
     const content =
-      '<p><a data-id="conversation-uuid" data-label="108" href="/inboxes/all/conversation/conversation-uuid" class="ld-ticket-reference">#108</a></p>'
+      '<p><a data-id="conversation-uuid" data-label="108" href="/inboxes/all/conversation/conversation-uuid" class="ld-conversation-reference">#108</a></p>'
     const editor = new Editor({
       extensions: buildConversationExtensions({ getPlaceholder: () => '' }),
       content
     })
     expect(editor.getJSON().content[0].content[0]).toMatchObject({
-      type: 'ticketReference',
+      type: 'conversationReference',
       attrs: { id: 'conversation-uuid', label: '108' }
     })
     expect(editor.getHTML()).toContain('href="/inboxes/all/conversation/conversation-uuid"')
@@ -27,7 +27,7 @@ describe('ticket reference editor extension', () => {
 
   it('derives the link from the conversation id, ignoring a stored href', () => {
     const content =
-      '<p><a data-id="conversation-uuid" data-label="108" href="https://evil.example/x" class="ld-ticket-reference">#108</a></p>'
+      '<p><a data-id="conversation-uuid" data-label="108" href="https://evil.example/x" class="ld-conversation-reference">#108</a></p>'
     const editor = new Editor({
       extensions: buildConversationExtensions({ getPlaceholder: () => '' }),
       content
diff --git a/frontend/apps/main/src/components/editor/conversationReferenceSuggestion.js b/frontend/apps/main/src/components/editor/conversationReferenceSuggestion.js
new file mode 100644
index 00000000..690df835
--- /dev/null
+++ b/frontend/apps/main/src/components/editor/conversationReferenceSuggestion.js
@@ -0,0 +1,10 @@
+import ConversationReferenceList from './ConversationReferenceList.vue'
+import { createSuggestionRenderer } from './suggestionRenderer'
+
+export default {
+  char: '#',
+  allowSpaces: false,
+  allow: ({ editor }) => editor.options.editorProps?.conversationReferencesEnabled?.() ?? false,
+  items: ({ query, editor }) => editor.options.editorProps?.getConversationSuggestions?.(query) ?? [],
+  render: () => createSuggestionRenderer(ConversationReferenceList)
+}
diff --git a/frontend/apps/main/src/components/editor/editorExtensions.js b/frontend/apps/main/src/components/editor/editorExtensions.js
index 9cff04d8..e59d0f17 100644
--- a/frontend/apps/main/src/components/editor/editorExtensions.js
+++ b/frontend/apps/main/src/components/editor/editorExtensions.js
@@ -17,8 +17,8 @@ import { Callout } from './extensions/Callout'
 import { Details, DetailsSummary, DetailsContent } from './extensions/Collapsible'
 import { TrailingNode } from './extensions/TrailingNode'
 import mentionSuggestion from './mentionSuggestion'
-import ticketReferenceSuggestion from './ticketReferenceSuggestion'
-import { TicketReference } from './ticketReferenceExtension'
+import conversationReferenceSuggestion from './conversationReferenceSuggestion'
+import { ConversationReference } from './conversationReferenceExtension'
 
 const lowlight = createLowlight(codeGrammars)
 
@@ -144,7 +144,7 @@ export function buildConversationExtensions({ getPlaceholder }) {
       HTMLAttributes: { class: 'ld-mention' },
       suggestion: mentionSuggestion
     }),
-    TicketReference.configure({ suggestion: ticketReferenceSuggestion }),
+    ConversationReference.configure({ suggestion: conversationReferenceSuggestion }),
     CustomTable.configure({ resizable: false }),
     TableRow,
     CustomTableCell,
diff --git a/frontend/apps/main/src/components/editor/editorStyles.scss b/frontend/apps/main/src/components/editor/editorStyles.scss
index bb54614c..ac110396 100644
--- a/frontend/apps/main/src/components/editor/editorStyles.scss
+++ b/frontend/apps/main/src/components/editor/editorStyles.scss
@@ -56,7 +56,7 @@
   }
 
   .ld-mention,
-  .ld-ticket-reference {
+  .ld-conversation-reference {
     background-color: hsl(var(--primary) / 0.1);
     border-radius: 0.25rem;
     padding: 0 0.25rem;
diff --git a/frontend/apps/main/src/components/editor/ticketReferenceSuggestion.js b/frontend/apps/main/src/components/editor/ticketReferenceSuggestion.js
deleted file mode 100644
index 33bcaad8..00000000
--- a/frontend/apps/main/src/components/editor/ticketReferenceSuggestion.js
+++ /dev/null
@@ -1,10 +0,0 @@
-import TicketReferenceList from './TicketReferenceList.vue'
-import { createSuggestionRenderer } from './suggestionRenderer'
-
-export default {
-  char: '#',
-  allowSpaces: false,
-  allow: ({ editor }) => editor.options.editorProps?.ticketReferencesEnabled?.() ?? false,
-  items: ({ query, editor }) => editor.options.editorProps?.getTicketSuggestions?.(query) ?? [],
-  render: () => createSuggestionRenderer(TicketReferenceList)
-}
diff --git a/frontend/apps/main/src/components/editor/useTextEditor.js b/frontend/apps/main/src/components/editor/useTextEditor.js
index f12b0da4..d256a925 100644
--- a/frontend/apps/main/src/components/editor/useTextEditor.js
+++ b/frontend/apps/main/src/components/editor/useTextEditor.js
@@ -13,8 +13,8 @@ export function useTextEditor({
   linkedModel = 'messages',
   getSuggestions = null,
   enableMentions = () => false,
-  getTicketSuggestions = null,
-  ticketReferencesEnabled = () => false,
+  getConversationSuggestions = null,
+  conversationReferencesEnabled = () => false,
   onSend = () => {},
   onUpdate = () => {},
   onBlur = () => {},
@@ -54,8 +54,8 @@ export function useTextEditor({
       attributes: { class: 'outline-none' },
       getSuggestions,
       enableMentions,
-      getTicketSuggestions,
-      ticketReferencesEnabled,
+      getConversationSuggestions,
+      conversationReferencesEnabled,
       handlePaste,
       handleDrop,
       handleKeyDown: (view, event) => {
diff --git a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
index 54eff9b0..6b0006b4 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
@@ -96,10 +96,10 @@
         :autoFocus="true"
         :disabled="isDraftLoading"
         :enableMentions="messageType === 'private_note'"
-        :enableTicketReferences="messageType === 'private_note'"
+        :enableConversationReferences="messageType === 'private_note'"
         :enableInlineImages="conversationStore.current.inbox_channel === 'email'"
         :getSuggestions="getSuggestions"
-        :getTicketSuggestions="getTicketSuggestions"
+        :getConversationSuggestions="getConversationSuggestions"
         @aiPromptSelected="handleAiPromptSelected"
         @send="handleSend"
         @mentionsChanged="handleMentionsChanged"
@@ -168,7 +168,7 @@ import { useI18n } from 'vue-i18n'
 import { validateEmail } from '@shared-ui/utils/string'
 import { useMacroStore } from '@main/stores/macro'
 import api from '@main/api'
-import { getTicketSuggestions as fetchTicketSuggestions } from '@main/components/editor/ticketReference'
+import { getConversationSuggestions as fetchConversationSuggestions } from '@main/components/editor/conversationReference'
 
 const MENTION_LIMIT = 10
 const MENTION_DEBOUNCE_MS = 250
@@ -217,12 +217,12 @@ const getSuggestions = async (query) => {
   return (await debouncedFetchSuggestions(query)) || []
 }
 
-const debouncedFetchTicketSuggestions = useDebounceFn(fetchTicketSuggestions, MENTION_DEBOUNCE_MS)
+const debouncedFetchConversationSuggestions = useDebounceFn(fetchConversationSuggestions, MENTION_DEBOUNCE_MS)
 
-const getTicketSuggestions = async (query) => {
+const getConversationSuggestions = async (query) => {
   if (messageType.value !== 'private_note') return []
   const messageTypeAtRequest = messageType.value
-  const suggestions = (await debouncedFetchTicketSuggestions(query)) || []
+  const suggestions = (await debouncedFetchConversationSuggestions(query)) || []
   return messageType.value === messageTypeAtRequest ? suggestions : []
 }
 
diff --git a/frontend/shared-ui/assets/styles/main.scss b/frontend/shared-ui/assets/styles/main.scss
index 5ddc10b6..65d0cdf7 100644
--- a/frontend/shared-ui/assets/styles/main.scss
+++ b/frontend/shared-ui/assets/styles/main.scss
@@ -121,9 +121,9 @@
 
     // Mention styling — vue-letter scopes classes as msg_XXX_ld-mention
     [class$="_ld-mention"],
-    [class$="_ld-ticket-reference"],
+    [class$="_ld-conversation-reference"],
     .ld-mention,
-    .ld-ticket-reference {
+    .ld-conversation-reference {
       background-color: hsl(var(--primary) / 0.1);
       border-radius: 0.25rem;
       padding: 0 0.25rem;

From 908f3413fea1bbdd10a52093c59a49b2dfc0bf22 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Thu, 3 Sep 2026 06:28:57 +0000
Subject: [PATCH 039/178] Bump qs from 6.15.2 to 6.16.0 in /frontend

Bumps [qs](https://github.com/ljharb/qs) from 6.15.2 to 6.16.0.
- [Changelog](https://github.com/ljharb/qs/blob/main/CHANGELOG.md)
- [Commits](https://github.com/ljharb/qs/compare/v6.15.2...v6.16.0)

---
updated-dependencies:
- dependency-name: qs
  dependency-version: 6.16.0
  dependency-type: direct:production
...

Signed-off-by: dependabot[bot] <support@github.com>
---
 frontend/package.json   |  2 +-
 frontend/pnpm-lock.yaml | 21 +++++++++++----------
 2 files changed, 12 insertions(+), 11 deletions(-)

diff --git a/frontend/package.json b/frontend/package.json
index 34ed3f1c..8bf7e494 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -61,7 +61,7 @@
     "lucide-vue-next": "^0.525.0",
     "mitt": "^3.0.1",
     "pinia": "^2.3.0",
-    "qs": "^6.15.2",
+    "qs": "^6.16.0",
     "radix-vue": "^1.9.17",
     "reka-ui": "^2.9.7",
     "tailwind-merge": "^2.6.0",
diff --git a/frontend/pnpm-lock.yaml b/frontend/pnpm-lock.yaml
index 6df0126b..dc71dda7 100644
--- a/frontend/pnpm-lock.yaml
+++ b/frontend/pnpm-lock.yaml
@@ -129,8 +129,8 @@ importers:
         specifier: ^2.3.0
         version: 2.3.0(typescript@5.7.3)(vue@3.5.13(typescript@5.7.3))
       qs:
-        specifier: ^6.15.2
-        version: 6.15.2
+        specifier: ^6.16.0
+        version: 6.16.0
       radix-vue:
         specifier: ^1.9.17
         version: 1.9.17(vue@3.5.13(typescript@5.7.3))
@@ -3196,8 +3196,8 @@ packages:
     resolution: {integrity: sha512-V/yCWTTF7VJ9hIh18Ugr2zhJMP01MY7c5kh4J870L7imm6/DIzBsNLTXzMwUA3yZ5b/KBqLx8Kp3uRvd7xSe3Q==}
     engines: {node: '>=0.6'}
 
-  qs@6.15.2:
-    resolution: {integrity: sha512-Rzq0KEyX/w/tEybncDgdkZrJgVUsUMk3xjh3t5bv3S1HTAtg+uOYt72+ZfwiQwKdysThkTBdL/rTi6HDmX9Ddw==}
+  qs@6.16.0:
+    resolution: {integrity: sha512-h6fhOIaRrID2CbEY2fqs+7t+UXZo+MLAnU5gRIq85uFtdiUPCdsApMlHhXogKVM4HM2DVbIjGNTTYH2OcmP1vA==}
     engines: {node: '>=0.6'}
 
   queue-microtask@1.2.3:
@@ -3330,8 +3330,8 @@ packages:
     resolution: {integrity: sha512-WPS/HvHQTYnHisLo9McqBHOJk2FkHO/tlpvldyrnem4aeQp4hai3gythswg6p01oSoTl58rcpiFAjF2br2Ak2A==}
     engines: {node: '>= 0.4'}
 
-  side-channel@1.1.0:
-    resolution: {integrity: sha512-ZX99e6tRweoUXqR+VBrslhda51Nh5MTQwou5tnUDgbtyM0dBgmhEDtWGP/xbKn6hqfPRHujUNwz5fy/wbbhnpw==}
+  side-channel@1.1.1:
+    resolution: {integrity: sha512-6x6dK6zJdpTzF4sQeNYxwtvBzf6Eg4GtlesS94HOvTudUeyK2WXAaIfmDgsyslYrRBeFIlsi54AYsFGUuhmvrQ==}
     engines: {node: '>= 0.4'}
 
   siginfo@2.0.0:
@@ -7088,11 +7088,12 @@ snapshots:
 
   qs@6.14.2:
     dependencies:
-      side-channel: 1.1.0
+      side-channel: 1.1.1
 
-  qs@6.15.2:
+  qs@6.16.0:
     dependencies:
-      side-channel: 1.1.0
+      es-define-property: 1.0.1
+      side-channel: 1.1.1
 
   queue-microtask@1.2.3: {}
 
@@ -7271,7 +7272,7 @@ snapshots:
       object-inspect: 1.13.4
       side-channel-map: 1.0.1
 
-  side-channel@1.1.0:
+  side-channel@1.1.1:
     dependencies:
       es-errors: 1.3.0
       object-inspect: 1.13.4

From c1b999b014f9e8f48b9aead2b683d1cf9671587b Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sun, 6 Sep 2026 01:29:26 +0530
Subject: [PATCH 040/178] fix stale searches and mention email links

---
 .../editor/conversationReference.js           | 10 ++++++++
 .../editor/conversationReference.test.js      | 23 ++++++++++++++++++-
 .../features/conversation/ReplyBoxContent.vue | 10 ++++++--
 internal/conversation/conversation.go         |  8 ++++++-
 .../conversation/conversation_reference.go    | 14 +++++++++++
 .../conversation_reference_test.go            | 12 ++++++++++
 6 files changed, 73 insertions(+), 4 deletions(-)
 create mode 100644 internal/conversation/conversation_reference.go
 create mode 100644 internal/conversation/conversation_reference_test.go

diff --git a/frontend/apps/main/src/components/editor/conversationReference.js b/frontend/apps/main/src/components/editor/conversationReference.js
index 8f2b5c35..e0bd80b5 100644
--- a/frontend/apps/main/src/components/editor/conversationReference.js
+++ b/frontend/apps/main/src/components/editor/conversationReference.js
@@ -3,6 +3,16 @@ import api from '@main/api'
 export const MIN_REFERENCE_QUERY_LENGTH = 3
 const SUGGESTION_LIMIT = 10
 
+export const createLatestConversationSuggestionFetcher = (fetchSuggestions) => {
+  let latestRequestID = 0
+
+  return async (query) => {
+    const requestID = ++latestRequestID
+    const suggestions = await fetchSuggestions(query)
+    return requestID === latestRequestID ? suggestions : []
+  }
+}
+
 export const getConversationSuggestions = async (query, search = api.searchConversations) => {
   const reference = query.trim()
   if (reference.length < MIN_REFERENCE_QUERY_LENGTH) return []
diff --git a/frontend/apps/main/src/components/editor/conversationReference.test.js b/frontend/apps/main/src/components/editor/conversationReference.test.js
index ff9c5e86..e3f5744c 100644
--- a/frontend/apps/main/src/components/editor/conversationReference.test.js
+++ b/frontend/apps/main/src/components/editor/conversationReference.test.js
@@ -1,5 +1,7 @@
 import { describe, expect, it, vi } from 'vitest'
-import { getConversationSuggestions } from './conversationReference'
+import * as conversationReference from './conversationReference'
+
+const { getConversationSuggestions } = conversationReference
 
 describe('conversation reference suggestions', () => {
   it('does not search until three characters are entered', async () => {
@@ -31,4 +33,23 @@ describe('conversation reference suggestions', () => {
     const search = vi.fn().mockResolvedValue({ data: { data: rows } })
     await expect(getConversationSuggestions('108', search)).resolves.toHaveLength(10)
   })
+
+  it('discards a response superseded by a newer query', async () => {
+    let resolveFirst
+    let resolveSecond
+    const fetchSuggestions = vi
+      .fn()
+      .mockImplementationOnce(() => new Promise((resolve) => (resolveFirst = resolve)))
+      .mockImplementationOnce(() => new Promise((resolve) => (resolveSecond = resolve)))
+    const getLatestSuggestions =
+      conversationReference.createLatestConversationSuggestionFetcher(fetchSuggestions)
+
+    const firstRequest = getLatestSuggestions('108')
+    const secondRequest = getLatestSuggestions('109')
+
+    resolveSecond([{ label: '109' }])
+    await expect(secondRequest).resolves.toEqual([{ label: '109' }])
+    resolveFirst([{ label: '108' }])
+    await expect(firstRequest).resolves.toEqual([])
+  })
 })
diff --git a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
index 6b0006b4..2495b52c 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
@@ -168,7 +168,10 @@ import { useI18n } from 'vue-i18n'
 import { validateEmail } from '@shared-ui/utils/string'
 import { useMacroStore } from '@main/stores/macro'
 import api from '@main/api'
-import { getConversationSuggestions as fetchConversationSuggestions } from '@main/components/editor/conversationReference'
+import {
+  createLatestConversationSuggestionFetcher,
+  getConversationSuggestions as fetchConversationSuggestions
+} from '@main/components/editor/conversationReference'
 
 const MENTION_LIMIT = 10
 const MENTION_DEBOUNCE_MS = 250
@@ -218,11 +221,14 @@ const getSuggestions = async (query) => {
 }
 
 const debouncedFetchConversationSuggestions = useDebounceFn(fetchConversationSuggestions, MENTION_DEBOUNCE_MS)
+const fetchLatestConversationSuggestions = createLatestConversationSuggestionFetcher(
+  debouncedFetchConversationSuggestions
+)
 
 const getConversationSuggestions = async (query) => {
   if (messageType.value !== 'private_note') return []
   const messageTypeAtRequest = messageType.value
-  const suggestions = (await debouncedFetchConversationSuggestions(query)) || []
+  const suggestions = (await fetchLatestConversationSuggestions(query)) || []
   return messageType.value === messageTypeAtRequest ? suggestions : []
 }
 
diff --git a/internal/conversation/conversation.go b/internal/conversation/conversation.go
index 59b09a30..5c6cd466 100644
--- a/internal/conversation/conversation.go
+++ b/internal/conversation/conversation.go
@@ -1313,6 +1313,12 @@ func (m *Manager) NotifyMention(conversationUUID string, message models.Message,
 		userIDs = append(userIDs, userID)
 	}
 
+	rootURL, err := m.settingsStore.GetAppRootURL()
+	if err != nil {
+		m.lo.Error("error fetching root URL for mention notification", "error", err)
+	}
+	messageContent := absolutizeConversationReferenceLinks(message.Content, rootURL)
+
 	recipientIDs, emails := m.buildRecipientEmails(userIDs, func(recipient umodels.User) (string, string, error) {
 		content, subject, err := m.template.RenderStoredEmailTemplate(template.TmplMentioned,
 			map[string]any{
@@ -1330,7 +1336,7 @@ func (m *Manager) NotifyMention(conversationUUID string, message models.Message,
 				},
 				"Message": map[string]any{
 					"UUID":    message.UUID,
-					"Content": message.Content,
+					"Content": messageContent,
 				},
 				"MentionedBy": map[string]any{
 					"FirstName": author.FirstName,
diff --git a/internal/conversation/conversation_reference.go b/internal/conversation/conversation_reference.go
new file mode 100644
index 00000000..b600267a
--- /dev/null
+++ b/internal/conversation/conversation_reference.go
@@ -0,0 +1,14 @@
+package conversation
+
+import "strings"
+
+func absolutizeConversationReferenceLinks(content, rootURL string) string {
+	if rootURL == "" {
+		return content
+	}
+	return strings.ReplaceAll(
+		content,
+		`href="/inboxes/all/conversation/`,
+		`href="`+strings.TrimRight(rootURL, "/")+`/inboxes/all/conversation/`,
+	)
+}
diff --git a/internal/conversation/conversation_reference_test.go b/internal/conversation/conversation_reference_test.go
new file mode 100644
index 00000000..954b6c91
--- /dev/null
+++ b/internal/conversation/conversation_reference_test.go
@@ -0,0 +1,12 @@
+package conversation
+
+import "testing"
+
+func TestAbsolutizeConversationReferenceLinks(t *testing.T) {
+	content := `<p><a href="/inboxes/all/conversation/abc" class="ld-conversation-reference">#108</a> <a href="/help">Help</a> <a href="https://old.example.com/inboxes/all/conversation/def">#109</a></p>`
+	want := `<p><a href="https://desk.example.com/inboxes/all/conversation/abc" class="ld-conversation-reference">#108</a> <a href="/help">Help</a> <a href="https://old.example.com/inboxes/all/conversation/def">#109</a></p>`
+
+	if got := absolutizeConversationReferenceLinks(content, "https://desk.example.com"); got != want {
+		t.Fatalf("got %q, want %q", got, want)
+	}
+}

From 52b6658e7438a825b28e27e2a6ea8e23aacf3347 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 8 Sep 2026 01:44:16 +0530
Subject: [PATCH 041/178] reject duplicate emails when creating a contact and
 reuse shared i18n keys

---
 cmd/contacts.go                                           | 4 +---
 frontend/apps/main/src/features/contact/ContactsList.vue  | 3 +--
 .../main/src/features/contact/CreateContactDialog.vue     | 6 +++---
 i18n/en-US.json                                           | 4 +---
 internal/user/contact.go                                  | 8 +++++++-
 5 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/cmd/contacts.go b/cmd/contacts.go
index 147b4ebd..6eac37cc 100644
--- a/cmd/contacts.go
+++ b/cmd/contacts.go
@@ -25,7 +25,6 @@ type blockContactReq struct {
 	Enabled bool `json:"enabled"`
 }
 
-// handleCreateContact creates a new contact.
 func handleCreateContact(r *fastglue.Request) error {
 	var app = r.Context.(*App)
 
@@ -316,7 +315,6 @@ func handleBlockContact(r *fastglue.Request) error {
 	return r.SendEnvelope(contact)
 }
 
-// contactFromForm parses and validates the multipart contact form shared by create and update.
 func contactFromForm(r *fastglue.Request) (models.User, *multipart.Form, error) {
 	var app = r.Context.(*App)
 
@@ -331,7 +329,7 @@ func contactFromForm(r *fastglue.Request) (models.User, *multipart.Form, error)
 		if vals := form.Value[key]; len(vals) > 0 {
 			v = strings.TrimSpace(vals[0])
 		}
-		// Browsers serialise a null field as the string "null".
+		// The edit page sends cleared fields as the string "null".
 		if v == "null" {
 			return ""
 		}
diff --git a/frontend/apps/main/src/features/contact/ContactsList.vue b/frontend/apps/main/src/features/contact/ContactsList.vue
index d91104b5..d6bed017 100644
--- a/frontend/apps/main/src/features/contact/ContactsList.vue
+++ b/frontend/apps/main/src/features/contact/ContactsList.vue
@@ -45,7 +45,6 @@
           </PopoverContent>
         </Popover>
 
-        <!-- Create Contact Button -->
         <Button
           v-if="userStore.can('contacts:write')"
           size="sm"
@@ -53,7 +52,7 @@
           @click="showCreateDialog = true"
         >
           <UserPlus size="16" />
-          {{ $t('contact.newContact') }}
+          {{ $t('contact.new') }}
         </Button>
       </div>
 
diff --git a/frontend/apps/main/src/features/contact/CreateContactDialog.vue b/frontend/apps/main/src/features/contact/CreateContactDialog.vue
index f64534a8..22ecbbab 100644
--- a/frontend/apps/main/src/features/contact/CreateContactDialog.vue
+++ b/frontend/apps/main/src/features/contact/CreateContactDialog.vue
@@ -2,12 +2,12 @@
   <Dialog :open="open" @update:open="$emit('update:open', $event)">
     <DialogContent class="sm:max-w-2xl">
       <DialogHeader>
-        <DialogTitle>{{ t('contact.newContact') }}</DialogTitle>
+        <DialogTitle>{{ t('contact.new') }}</DialogTitle>
       </DialogHeader>
       <ContactForm
         :formLoading="loading"
         :onSubmit="onSubmit"
-        :submitLabel="t('contact.createContact')"
+        :submitLabel="t('globals.messages.create')"
       />
     </DialogContent>
   </Dialog>
@@ -54,7 +54,7 @@ const onSubmit = form.handleSubmit(async (values) => {
   loading.value = true
   try {
     const { data } = await api.createContact(values)
-    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, { description: t('contact.createdSuccessfully') })
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, { description: t('globals.messages.savedSuccessfully') })
     emit('update:open', false)
     emit('created', data.data)
   } catch (err) {
diff --git a/i18n/en-US.json b/i18n/en-US.json
index ed57d0d1..83874673 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -676,9 +676,7 @@
   "contact.identityNotVerified": "Identity not verified",
   "contact.identityVerified": "Identity verified",
   "contact.newNote": "New note",
-  "contact.newContact": "New contact",
-  "contact.createContact": "Create contact",
-  "contact.createdSuccessfully": "Contact created successfully",
+  "contact.new": "New contact",
   "contact.noContactsFound": "No contacts found",
   "contact.notes.empty": "No notes yet",
   "contact.notes.help": "Add note for this contact to keep track of important information and conversations.",
diff --git a/internal/user/contact.go b/internal/user/contact.go
index bb79b027..c0b99837 100644
--- a/internal/user/contact.go
+++ b/internal/user/contact.go
@@ -25,13 +25,18 @@ func (u *Manager) ResolveContact(user *models.User, policy models.ContactPolicy)
 	return u.reuseContact(user)
 }
 
-// CreateContact inserts a contact created by an agent; every contact resolved from a channel goes through ResolveContact instead.
+// CreateContact inserts an agent-created contact. Channel-sourced contacts go through ResolveContact.
 func (u *Manager) CreateContact(user *models.User) error {
 	password, err := u.newContactPassword()
 	if err != nil {
 		return envelope.NewError(envelope.GeneralError, u.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
 	user.Email = null.NewString(strings.ToLower(strings.TrimSpace(user.Email.String)), user.Email.Valid)
+	if _, err := u.GetContactByEmail(user.Email.String); err == nil {
+		return envelope.NewError(envelope.InputError, u.i18n.T("contact.alreadyExistsWithEmail"), nil)
+	} else if envErr, ok := err.(envelope.Error); !ok || envErr.ErrorType != envelope.NotFoundError {
+		return err
+	}
 	if err := u.q.InsertContact.QueryRow(user.Email, user.FirstName, user.LastName, password, user.PhoneNumber, user.PhoneNumberCountryCode, user.Country).Scan(&user.ID); err != nil {
 		if dbutil.IsUniqueViolationError(err) {
 			return envelope.NewError(envelope.InputError, u.i18n.T("contact.alreadyExistsWithEmail"), nil)
@@ -52,6 +57,7 @@ func (u *Manager) UpdateContactBasicInfo(id int, firstName, lastName, email, pho
 }
 
 func (u *Manager) UpdateContact(id int, user models.User) error {
+	user.Email = null.NewString(strings.ToLower(strings.TrimSpace(user.Email.String)), user.Email.Valid)
 	if _, err := u.q.UpdateContact.Exec(id, user.FirstName, user.LastName, user.Email, user.AvatarURL, user.PhoneNumber, user.PhoneNumberCountryCode, user.Country); err != nil {
 		if dbutil.IsUniqueViolationError(err) {
 			return envelope.NewError(envelope.InputError, u.i18n.T("contact.alreadyExistsWithEmail"), nil)

From 7b72e44f15c57775d877a2d5247d87a5a8f9dd53 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 8 Sep 2026 02:12:03 +0530
Subject: [PATCH 042/178] move new contact button to the right of the contacts
 toolbar

---
 frontend/apps/main/src/features/contact/ContactsList.vue | 5 +++--
 1 file changed, 3 insertions(+), 2 deletions(-)

diff --git a/frontend/apps/main/src/features/contact/ContactsList.vue b/frontend/apps/main/src/features/contact/ContactsList.vue
index d6bed017..71dba87c 100644
--- a/frontend/apps/main/src/features/contact/ContactsList.vue
+++ b/frontend/apps/main/src/features/contact/ContactsList.vue
@@ -2,10 +2,11 @@
   <div class="min-h-screen flex flex-col">
     <!-- Main Content Area -->
     <div class="flex flex-wrap gap-4 pb-4">
-      <div class="flex items-center gap-4 mb-4">
+      <div class="flex items-center gap-4 mb-4 w-full">
         <!-- Search Input -->
         <Input
           type="text"
+          class="max-w-sm"
           v-model="searchTerm"
           :placeholder="$t('contact.searchByEmail')"
           @input="fetchContactsDebounced"
@@ -48,7 +49,7 @@
         <Button
           v-if="userStore.can('contacts:write')"
           size="sm"
-          class="flex items-center h-8 gap-1"
+          class="flex items-center h-8 gap-1 ml-auto"
           @click="showCreateDialog = true"
         >
           <UserPlus size="16" />

From 30b5d946273cc8c2d2d6d39e624c21af2518893c Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 9 Sep 2026 00:33:02 +0530
Subject: [PATCH 043/178] add editor prompts admin page to create, edit and
 delete AI reply box prompts

---
 cmd/ai.go                                     |  51 +++++++
 cmd/handlers.go                               |   3 +
 frontend/apps/main/src/api/index.js           |   6 +
 frontend/apps/main/src/constants/navIcons.js  |   2 +
 .../apps/main/src/constants/navigation.js     |   7 +
 .../features/admin/ai/EditorPromptForm.vue    |  98 +++++++++++++
 .../features/admin/ai/editorPromptColumns.js  |  38 +++++
 .../admin/ai/editorPromptDropdown.vue         |  94 ++++++++++++
 frontend/apps/main/src/router/index.js        |   6 +
 .../src/views/admin/ai/AIEditorPrompts.vue    | 134 ++++++++++++++++++
 i18n/en-US.json                               |   7 +
 internal/ai/ai.go                             |  53 +++++++
 internal/ai/queries.sql                       |  13 +-
 13 files changed, 511 insertions(+), 1 deletion(-)
 create mode 100644 frontend/apps/main/src/features/admin/ai/EditorPromptForm.vue
 create mode 100644 frontend/apps/main/src/features/admin/ai/editorPromptColumns.js
 create mode 100644 frontend/apps/main/src/features/admin/ai/editorPromptDropdown.vue
 create mode 100644 frontend/apps/main/src/views/admin/ai/AIEditorPrompts.vue

diff --git a/cmd/ai.go b/cmd/ai.go
index e2c0bfab..0dff4ef6 100644
--- a/cmd/ai.go
+++ b/cmd/ai.go
@@ -45,6 +45,11 @@ type suggestTagsReq struct {
 	ConversationUUID string `json:"conversation_uuid"`
 }
 
+type promptReq struct {
+	Title   string `json:"title"`
+	Content string `json:"content"`
+}
+
 type snippetReq struct {
 	Title   string `json:"title"`
 	Content string `json:"content"`
@@ -81,6 +86,52 @@ func handleGetAIPrompts(r *fastglue.Request) error {
 	return r.SendEnvelope(resp)
 }
 
+func handleCreateAIPrompt(r *fastglue.Request) error {
+	var (
+		app = r.Context.(*App)
+		req promptReq
+	)
+	if err := r.Decode(&req, "json"); err != nil {
+		return sendErrorEnvelope(r, envelope.NewError(envelope.InputError, app.i18n.T("errors.parsingRequest"), nil))
+	}
+	p, err := app.ai.CreatePrompt(req.Title, req.Content)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(p)
+}
+
+func handleUpdateAIPrompt(r *fastglue.Request) error {
+	var (
+		app = r.Context.(*App)
+		req promptReq
+	)
+	id, err := strconv.Atoi(r.RequestCtx.UserValue("id").(string))
+	if err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("globals.messages.somethingWentWrong"), nil, envelope.InputError)
+	}
+	if err := r.Decode(&req, "json"); err != nil {
+		return sendErrorEnvelope(r, envelope.NewError(envelope.InputError, app.i18n.T("errors.parsingRequest"), nil))
+	}
+	p, err := app.ai.UpdatePrompt(id, req.Title, req.Content)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(p)
+}
+
+func handleDeleteAIPrompt(r *fastglue.Request) error {
+	app := r.Context.(*App)
+	id, err := strconv.Atoi(r.RequestCtx.UserValue("id").(string))
+	if err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("globals.messages.somethingWentWrong"), nil, envelope.InputError)
+	}
+	if err := app.ai.DeletePrompt(id); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(true)
+}
+
 // handleGetAIConfig returns the sanitized provider config for a type (completion/embedding).
 func handleGetAIConfig(r *fastglue.Request) error {
 	app := r.Context.(*App)
diff --git a/cmd/handlers.go b/cmd/handlers.go
index 1094f729..d56d05fa 100644
--- a/cmd/handlers.go
+++ b/cmd/handlers.go
@@ -252,6 +252,9 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 
 	// AI completions.
 	g.GET("/api/v1/ai/prompts", auth(handleGetAIPrompts))
+	g.POST("/api/v1/ai/prompts", perm(handleCreateAIPrompt, "ai:manage"))
+	g.PUT("/api/v1/ai/prompts/{id}", perm(handleUpdateAIPrompt, "ai:manage"))
+	g.DELETE("/api/v1/ai/prompts/{id}", perm(handleDeleteAIPrompt, "ai:manage"))
 	g.POST("/api/v1/ai/completion", auth(handleAICompletion))
 
 	// AI provider config (completion / embedding).
diff --git a/frontend/apps/main/src/api/index.js b/frontend/apps/main/src/api/index.js
index fe80cfe9..157c7705 100644
--- a/frontend/apps/main/src/api/index.js
+++ b/frontend/apps/main/src/api/index.js
@@ -465,6 +465,9 @@ const updateSharedView = (id, data) =>
 const deleteSharedView = (id) => http.delete(`/api/v1/shared-views/${id}`)
 
 const getAiPrompts = () => http.get('/api/v1/ai/prompts')
+const createAIPrompt = (data) => http.post('/api/v1/ai/prompts', data)
+const updateAIPrompt = (id, data) => http.put(`/api/v1/ai/prompts/${id}`, data)
+const deleteAIPrompt = (id) => http.delete(`/api/v1/ai/prompts/${id}`)
 const aiCompletion = (data) => http.post('/api/v1/ai/completion', data, {
   timeout: AI_TIMEOUT,
   headers: {
@@ -752,6 +755,9 @@ export default {
   updateSharedView,
   deleteSharedView,
   getAiPrompts,
+  createAIPrompt,
+  updateAIPrompt,
+  deleteAIPrompt,
   aiCompletion,
   getAIConfig,
   updateAIConfig,
diff --git a/frontend/apps/main/src/constants/navIcons.js b/frontend/apps/main/src/constants/navIcons.js
index e8e8f513..7535e953 100644
--- a/frontend/apps/main/src/constants/navIcons.js
+++ b/frontend/apps/main/src/constants/navIcons.js
@@ -23,6 +23,7 @@ import {
   Timer,
   UserRound,
   UsersRound,
+  WandSparkles,
   Webhook,
   Workflow,
   Wrench,
@@ -55,6 +56,7 @@ export const navIconMap = {
   Timer,
   UserRound,
   UsersRound,
+  WandSparkles,
   Webhook,
   Workflow,
   Wrench,
diff --git a/frontend/apps/main/src/constants/navigation.js b/frontend/apps/main/src/constants/navigation.js
index 5a0cc0f5..d91fce40 100644
--- a/frontend/apps/main/src/constants/navigation.js
+++ b/frontend/apps/main/src/constants/navigation.js
@@ -65,6 +65,13 @@ export const adminNavItems = [
         isTitleKeyPlural: true,
         icon: 'NotebookText'
       },
+      {
+        titleKey: 'admin.ai.editorPrompts',
+        href: '/admin/ai/editor-prompts',
+        permission: 'ai:manage',
+        isTitleKeyPlural: true,
+        icon: 'WandSparkles'
+      },
       {
         titleKey: 'admin.ai.suggestions',
         href: '/admin/ai/suggestions',
diff --git a/frontend/apps/main/src/features/admin/ai/EditorPromptForm.vue b/frontend/apps/main/src/features/admin/ai/EditorPromptForm.vue
new file mode 100644
index 00000000..477a30fd
--- /dev/null
+++ b/frontend/apps/main/src/features/admin/ai/EditorPromptForm.vue
@@ -0,0 +1,98 @@
+<template>
+  <form @submit="onSubmit" novalidate class="space-y-6 w-full">
+    <FormField v-slot="{ componentField }" name="title">
+      <FormItem>
+        <FormLabel>{{ t('globals.terms.title') }}</FormLabel>
+        <FormControl>
+          <Input
+            type="text"
+            :placeholder="t('admin.ai.editorPrompt.titlePlaceholder')"
+            v-bind="componentField"
+          />
+        </FormControl>
+        <FormMessage />
+      </FormItem>
+    </FormField>
+
+    <FormField v-slot="{ componentField }" name="content">
+      <FormItem>
+        <FormLabel>{{ t('globals.terms.content') }}</FormLabel>
+        <FormControl>
+          <Textarea
+            class="min-h-[240px] max-h-[60vh]"
+            :placeholder="t('admin.ai.editorPrompt.contentPlaceholder')"
+            v-bind="componentField"
+          />
+        </FormControl>
+        <FormMessage />
+      </FormItem>
+    </FormField>
+
+    <DialogFooter class="mt-10">
+      <Button type="submit" :isLoading="formLoading">
+        {{ isEditing ? t('globals.messages.save') : t('globals.messages.create') }}
+      </Button>
+    </DialogFooter>
+  </form>
+</template>
+
+<script setup>
+import { ref, watch } from 'vue'
+import { useForm } from 'vee-validate'
+import { toTypedSchema } from '@vee-validate/zod'
+import * as z from 'zod'
+import { Button } from '@shared-ui/components/ui/button/index.js'
+import { Input } from '@shared-ui/components/ui/input/index.js'
+import { Textarea } from '@shared-ui/components/ui/textarea/index.js'
+import { DialogFooter } from '@shared-ui/components/ui/dialog/index.js'
+import {
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage
+} from '@shared-ui/components/ui/form/index.js'
+import { useI18n } from 'vue-i18n'
+
+const props = defineProps({
+  initialValues: { type: Object, default: () => ({}) },
+  isEditing: { type: Boolean, default: false },
+  submitForm: { type: Function, required: true }
+})
+
+const { t } = useI18n()
+const formLoading = ref(false)
+
+const form = useForm({
+  validationSchema: toTypedSchema(
+    z.object({
+      title: z
+        .string({ required_error: t('globals.messages.required') })
+        .min(1, { message: t('globals.messages.required') })
+        .max(140),
+      content: z
+        .string({ required_error: t('globals.messages.required') })
+        .min(1, { message: t('globals.messages.required') })
+    })
+  ),
+  initialValues: { title: '', content: '' }
+})
+
+watch(
+  () => props.initialValues,
+  (values) => {
+    form.setValues({ title: values.title || '', content: values.content || '' }, false)
+    form.setErrors({})
+  },
+  { immediate: true, deep: true }
+)
+
+const onSubmit = form.handleSubmit(async (values) => {
+  try {
+    formLoading.value = true
+    await props.submitForm({ title: values.title, content: values.content })
+  } finally {
+    formLoading.value = false
+  }
+})
+</script>
diff --git a/frontend/apps/main/src/features/admin/ai/editorPromptColumns.js b/frontend/apps/main/src/features/admin/ai/editorPromptColumns.js
new file mode 100644
index 00000000..e2b592fd
--- /dev/null
+++ b/frontend/apps/main/src/features/admin/ai/editorPromptColumns.js
@@ -0,0 +1,38 @@
+import { h } from 'vue'
+import { format } from 'date-fns'
+import dropdown from './editorPromptDropdown.vue'
+
+export const createEditorPromptColumns = (t, { onEdit } = {}) => [
+  {
+    accessorKey: 'title',
+    header: () => h('div', { class: 'text-center' }, t('globals.terms.title')),
+    cell: ({ row }) =>
+      h(
+        'div',
+        { class: 'text-center' },
+        onEdit
+          ? h(
+              'span',
+              {
+                class: 'text-foreground font-medium hover:underline cursor-pointer',
+                onClick: () => onEdit(row.original)
+              },
+              row.getValue('title')
+            )
+          : row.getValue('title')
+      )
+  },
+  {
+    accessorKey: 'updated_at',
+    enableGlobalFilter: false,
+    header: () => h('div', { class: 'text-center' }, t('globals.terms.updatedAt')),
+    cell: ({ row }) =>
+      h('div', { class: 'text-center' }, format(row.getValue('updated_at'), 'PPpp'))
+  },
+  {
+    id: 'actions',
+    enableHiding: false,
+    enableSorting: false,
+    cell: ({ row }) => h('div', { class: 'relative' }, h(dropdown, { prompt: row.original }))
+  }
+]
diff --git a/frontend/apps/main/src/features/admin/ai/editorPromptDropdown.vue b/frontend/apps/main/src/features/admin/ai/editorPromptDropdown.vue
new file mode 100644
index 00000000..05ed55a7
--- /dev/null
+++ b/frontend/apps/main/src/features/admin/ai/editorPromptDropdown.vue
@@ -0,0 +1,94 @@
+<template>
+  <DropdownMenu>
+    <DropdownMenuTrigger as-child>
+      <Button variant="ghost" class="w-8 h-8 p-0">
+        <span class="sr-only">{{ t('globals.terms.openMenu') }}</span>
+        <MoreVertical class="w-4 h-4" />
+      </Button>
+    </DropdownMenuTrigger>
+    <DropdownMenuContent>
+      <DropdownMenuItem @click="editPrompt">
+        <Pencil class="mr-2 h-4 w-4" />
+        {{ t('globals.messages.edit') }}
+      </DropdownMenuItem>
+      <DropdownMenuSeparator />
+      <DropdownMenuItem
+        @click="() => (alertOpen = true)"
+        class="text-destructive focus:text-destructive"
+      >
+        <Trash class="mr-2 h-4 w-4" />
+        {{ t('globals.messages.delete') }}
+      </DropdownMenuItem>
+    </DropdownMenuContent>
+  </DropdownMenu>
+
+  <AlertDialog :open="alertOpen" @update:open="alertOpen = $event">
+    <AlertDialogContent>
+      <AlertDialogHeader>
+        <AlertDialogTitle>{{ t('globals.messages.areYouAbsolutelySure') }}</AlertDialogTitle>
+        <AlertDialogDescription>
+          {{ t('admin.ai.editorPrompt.deleteConfirmation') }}
+        </AlertDialogDescription>
+      </AlertDialogHeader>
+      <AlertDialogFooter>
+        <AlertDialogCancel>{{ t('globals.messages.cancel') }}</AlertDialogCancel>
+        <AlertDialogAction variant="destructive" @click="deletePrompt">{{
+          t('globals.messages.delete')
+        }}</AlertDialogAction>
+      </AlertDialogFooter>
+    </AlertDialogContent>
+  </AlertDialog>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { MoreVertical, Pencil, Trash } from 'lucide-vue-next'
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger
+} from '@shared-ui/components/ui/dropdown-menu/index.js'
+import { Button } from '@shared-ui/components/ui/button/index.js'
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle
+} from '@shared-ui/components/ui/alert-dialog/index.js'
+import { useEmitter } from '@/composables/useEmitter.js'
+import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
+import { handleHTTPError } from '@shared-ui/utils/http.js'
+import { useI18n } from 'vue-i18n'
+import api from '@/api'
+
+const { t } = useI18n()
+const alertOpen = ref(false)
+const emitter = useEmitter()
+
+const props = defineProps({
+  prompt: { type: Object, required: true }
+})
+
+const editPrompt = () => {
+  emitter.emit(EMITTER_EVENTS.EDIT_MODEL, { model: 'ai_editor_prompts', data: props.prompt })
+}
+
+const deletePrompt = async () => {
+  try {
+    await api.deleteAIPrompt(props.prompt.id)
+    alertOpen.value = false
+    emitter.emit(EMITTER_EVENTS.REFRESH_LIST, { model: 'ai_editor_prompts' })
+  } catch (error) {
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  }
+}
+</script>
diff --git a/frontend/apps/main/src/router/index.js b/frontend/apps/main/src/router/index.js
index 72b6fd20..34eb0ba3 100644
--- a/frontend/apps/main/src/router/index.js
+++ b/frontend/apps/main/src/router/index.js
@@ -236,6 +236,12 @@ const routes = [
             component: () => import('@main/views/admin/ai/AISnippets.vue'),
             meta: { titleKey: 'admin.ai.snippets', titleCount: 2 }
           },
+          {
+            path: 'ai/editor-prompts',
+            name: 'ai-editor-prompts',
+            component: () => import('@main/views/admin/ai/AIEditorPrompts.vue'),
+            meta: { titleKey: 'admin.ai.editorPrompts', titleCount: 2 }
+          },
           {
             path: 'ai/suggestions',
             name: 'ai-suggestions',
diff --git a/frontend/apps/main/src/views/admin/ai/AIEditorPrompts.vue b/frontend/apps/main/src/views/admin/ai/AIEditorPrompts.vue
new file mode 100644
index 00000000..6314721d
--- /dev/null
+++ b/frontend/apps/main/src/views/admin/ai/AIEditorPrompts.vue
@@ -0,0 +1,134 @@
+<template>
+  <AdminSplitLayout>
+    <template #content>
+      <LoadingOverlay :loading="isLoading" reserve-height>
+        <div class="flex justify-end mb-4">
+          <Dialog v-model:open="dialogOpen">
+            <DialogTrigger as-child @click="newPrompt">
+              <Button>{{ t('admin.ai.editorPrompt.new') }}</Button>
+            </DialogTrigger>
+            <DialogContent class="sm:max-w-2xl">
+              <DialogHeader>
+                <DialogTitle>
+                  {{ isEditing ? t('admin.ai.editorPrompt.edit') : t('admin.ai.editorPrompt.new') }}
+                </DialogTitle>
+              </DialogHeader>
+              <EditorPromptForm
+                :initial-values="initialValues"
+                :is-editing="isEditing"
+                :submit-form="submitPrompt"
+              />
+            </DialogContent>
+          </Dialog>
+        </div>
+        <DataTable
+          :columns="createEditorPromptColumns(t, { onEdit: editPrompt })"
+          :data="prompts"
+          :loading="isLoading"
+        />
+      </LoadingOverlay>
+    </template>
+
+    <template #help>
+      <p>{{ t('admin.ai.editorPromptsHelp') }}</p>
+    </template>
+  </AdminSplitLayout>
+</template>
+
+<script setup>
+import { ref, onMounted, onUnmounted } from 'vue'
+import AdminSplitLayout from '@/layouts/admin/AdminSplitLayout.vue'
+import LoadingOverlay from '@main/components/layout/LoadingOverlay.vue'
+import DataTable from '@main/components/datatable/DataTable.vue'
+import { Button } from '@shared-ui/components/ui/button/index.js'
+import {
+  Dialog,
+  DialogContent,
+  DialogHeader,
+  DialogTitle,
+  DialogTrigger
+} from '@shared-ui/components/ui/dialog/index.js'
+import EditorPromptForm from '@/features/admin/ai/EditorPromptForm.vue'
+import { createEditorPromptColumns } from '@/features/admin/ai/editorPromptColumns.js'
+import { useEmitter } from '@/composables/useEmitter.js'
+import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
+import { handleHTTPError } from '@shared-ui/utils/http.js'
+import { useI18n } from 'vue-i18n'
+import api from '@/api'
+
+const { t } = useI18n()
+const emitter = useEmitter()
+const isLoading = ref(false)
+const prompts = ref([])
+const dialogOpen = ref(false)
+const isEditing = ref(false)
+const initialValues = ref({})
+const editingId = ref(null)
+
+const refreshHandler = (data) => {
+  if (data?.model === 'ai_editor_prompts') getPrompts()
+}
+
+const editHandler = (data) => {
+  if (data?.model === 'ai_editor_prompts') editPrompt(data.data)
+}
+
+onMounted(() => {
+  getPrompts()
+  emitter.on(EMITTER_EVENTS.REFRESH_LIST, refreshHandler)
+  emitter.on(EMITTER_EVENTS.EDIT_MODEL, editHandler)
+})
+
+onUnmounted(() => {
+  emitter.off(EMITTER_EVENTS.REFRESH_LIST, refreshHandler)
+  emitter.off(EMITTER_EVENTS.EDIT_MODEL, editHandler)
+})
+
+const getPrompts = async () => {
+  try {
+    isLoading.value = true
+    const resp = await api.getAiPrompts()
+    prompts.value = resp.data.data || []
+  } catch (error) {
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  } finally {
+    isLoading.value = false
+  }
+}
+
+const newPrompt = () => {
+  isEditing.value = false
+  editingId.value = null
+  initialValues.value = {}
+}
+
+const editPrompt = (item) => {
+  isEditing.value = true
+  editingId.value = item.id
+  initialValues.value = { ...item }
+  dialogOpen.value = true
+}
+
+const submitPrompt = async (values) => {
+  try {
+    if (isEditing.value) {
+      await api.updateAIPrompt(editingId.value, values)
+    } else {
+      await api.createAIPrompt(values)
+    }
+    dialogOpen.value = false
+    getPrompts()
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      description: t('globals.messages.savedSuccessfully')
+    })
+  } catch (error) {
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  }
+}
+</script>
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 83874673..db500c58 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -119,6 +119,13 @@
   "admin.ai.completion": "Completion",
   "admin.ai.embedding": "Embedding",
   "admin.ai.snippets": "Snippet | Snippets",
+  "admin.ai.editorPrompts": "Editor prompt | Editor prompts",
+  "admin.ai.editorPromptsHelp": "Editor prompts are the AI actions agents can run on their draft from the reply box, such as fixing grammar or changing tone. The prompt is sent as the instruction and the draft as the text to rewrite.",
+  "admin.ai.editorPrompt.new": "New editor prompt",
+  "admin.ai.editorPrompt.edit": "Edit editor prompt",
+  "admin.ai.editorPrompt.deleteConfirmation": "This will permanently delete the editor prompt and remove it from the reply box.",
+  "admin.ai.editorPrompt.titlePlaceholder": "Make it friendlier",
+  "admin.ai.editorPrompt.contentPlaceholder": "Rewrite the text in a warm, friendly tone while keeping the original meaning.",
   "admin.ai.tools": "Tools",
   "admin.ai.suggestions": "Suggestions",
   "admin.ai.suggestion.source": "Source",
diff --git a/internal/ai/ai.go b/internal/ai/ai.go
index 0ca1cb96..593ccb2b 100644
--- a/internal/ai/ai.go
+++ b/internal/ai/ai.go
@@ -98,6 +98,9 @@ type queries struct {
 	UpdateProviderConfig         *sqlx.Stmt `query:"update-provider-config"`
 	GetPrompt                    *sqlx.Stmt `query:"get-prompt"`
 	GetPrompts                   *sqlx.Stmt `query:"get-prompts"`
+	InsertPrompt                 *sqlx.Stmt `query:"insert-prompt"`
+	UpdatePrompt                 *sqlx.Stmt `query:"update-prompt"`
+	DeletePrompt                 *sqlx.Stmt `query:"delete-prompt"`
 	GetKnowledgeBaseItems        *sqlx.Stmt `query:"get-knowledge-base-items"`
 	GetKnowledgeBaseItem         *sqlx.Stmt `query:"get-knowledge-base-item"`
 	KnowledgeBaseItemExists      *sqlx.Stmt `query:"knowledge-base-item-exists"`
@@ -242,6 +245,46 @@ func (m *Manager) GetPrompts() ([]models.Prompt, error) {
 	return prompts, nil
 }
 
+// CreatePrompt stores a new editor prompt; the key is derived from the title and never changes.
+func (m *Manager) CreatePrompt(title, content string) (models.Prompt, error) {
+	var p models.Prompt
+	if err := m.validatePrompt(title, content); err != nil {
+		return p, err
+	}
+	key := strings.ReplaceAll(stringutil.GenerateSlug(title), "-", "_")
+	if err := m.q.InsertPrompt.Get(&p, key, strings.TrimSpace(title), strings.TrimSpace(content)); err != nil {
+		if dbutil.IsUniqueViolationError(err) {
+			return p, envelope.NewError(envelope.ConflictError, m.i18n.T("globals.messages.errorAlreadyExists"), nil)
+		}
+		m.lo.Error("error creating prompt", "error", err)
+		return p, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return p, nil
+}
+
+func (m *Manager) UpdatePrompt(id int, title, content string) (models.Prompt, error) {
+	var p models.Prompt
+	if err := m.validatePrompt(title, content); err != nil {
+		return p, err
+	}
+	if err := m.q.UpdatePrompt.Get(&p, id, strings.TrimSpace(title), strings.TrimSpace(content)); err != nil {
+		if err == sql.ErrNoRows {
+			return p, envelope.NewError(envelope.NotFoundError, m.i18n.T("globals.messages.notFound"), nil)
+		}
+		m.lo.Error("error updating prompt", "error", err)
+		return p, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return p, nil
+}
+
+func (m *Manager) DeletePrompt(id int) error {
+	if _, err := m.q.DeletePrompt.Exec(id); err != nil {
+		m.lo.Error("error deleting prompt", "error", err)
+		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return nil
+}
+
 // GetProviderConfig returns the sanitized config for a provider type (no API key).
 func (m *Manager) GetProviderConfig(providerType string) (ProviderConfigView, error) {
 	cfg, err := m.getProviderConfig(providerType)
@@ -350,6 +393,16 @@ func (m *Manager) TestProviderConfig(providerType string, in models.ProviderConf
 	return nil
 }
 
+func (m *Manager) validatePrompt(title, content string) error {
+	if strings.TrimSpace(title) == "" {
+		return envelope.NewError(envelope.InputError, m.i18n.Ts("globals.messages.empty", "name", m.i18n.T("globals.terms.title")), nil)
+	}
+	if strings.TrimSpace(content) == "" {
+		return envelope.NewError(envelope.InputError, m.i18n.Ts("globals.messages.empty", "name", m.i18n.T("globals.terms.content")), nil)
+	}
+	return nil
+}
+
 func (m *Manager) getPrompt(k string) (string, error) {
 	var p models.Prompt
 	if err := m.q.GetPrompt.Get(&p, k); err != nil {
diff --git a/internal/ai/queries.sql b/internal/ai/queries.sql
index 84e46109..2ae6a904 100644
--- a/internal/ai/queries.sql
+++ b/internal/ai/queries.sql
@@ -8,7 +8,18 @@ UPDATE ai_providers SET config = $2, updated_at = now() WHERE type = $1;
 SELECT id, created_at, updated_at, key, title, content FROM ai_prompts WHERE key = $1;
 
 -- name: get-prompts
-SELECT id, created_at, updated_at, key, title FROM ai_prompts ORDER BY title;
+SELECT id, created_at, updated_at, key, title, content FROM ai_prompts ORDER BY title;
+
+-- name: insert-prompt
+INSERT INTO ai_prompts (key, title, content) VALUES ($1, $2, $3)
+RETURNING id, created_at, updated_at, key, title, content;
+
+-- name: update-prompt
+UPDATE ai_prompts SET title = $2, content = $3, updated_at = now() WHERE id = $1
+RETURNING id, created_at, updated_at, key, title, content;
+
+-- name: delete-prompt
+DELETE FROM ai_prompts WHERE id = $1;
 
 -- name: get-knowledge-base-items
 SELECT id, created_at, updated_at, type, title, content, enabled, source, source_url, embedded_fingerprint FROM ai_knowledge_base ORDER BY updated_at DESC;

From b35fc839ccdc61e8ec78fbd4eb5e675083b91e9e Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 9 Sep 2026 00:40:50 +0530
Subject: [PATCH 044/178] Change translation contribution process to Crowdin

Updated translation contribution guidelines to use Crowdin.
---
 CONTRIBUTING.md | 1 +
 1 file changed, 1 insertion(+)

diff --git a/CONTRIBUTING.md b/CONTRIBUTING.md
index 59993f38..b20d6b97 100644
--- a/CONTRIBUTING.md
+++ b/CONTRIBUTING.md
@@ -9,6 +9,7 @@ Thanks for your interest in contributing.
 - Bug fixes and documentation improvements can go straight to a PR, no prior discussion needed.
 - Anything larger should start with an issue. See below for why.
 - Keep changes focused on a single concern wherever possible.
+- For translations, please contribute through [Crowdin](https://crowdin.com/project/libredesk) instead of opening PRs for translation changes.
 
 ## Pull Requests
 

From 34d2a64895eea8de1aa6b779ccb2e51d6f770ee1 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 9 Sep 2026 00:45:43 +0530
Subject: [PATCH 045/178] keep prompt content out of the agent prompt list and
 load it on edit behind ai:manage

---
 cmd/ai.go                                      | 13 +++++++++++++
 cmd/handlers.go                                |  1 +
 frontend/apps/main/src/api/index.js            |  2 ++
 .../src/views/admin/ai/AIEditorPrompts.vue     | 18 +++++++++++++-----
 i18n/en-US.json                                |  2 +-
 internal/ai/ai.go                              | 14 ++++++++++++++
 internal/ai/queries.sql                        |  5 ++++-
 7 files changed, 48 insertions(+), 7 deletions(-)

diff --git a/cmd/ai.go b/cmd/ai.go
index 0dff4ef6..999ae50f 100644
--- a/cmd/ai.go
+++ b/cmd/ai.go
@@ -86,6 +86,19 @@ func handleGetAIPrompts(r *fastglue.Request) error {
 	return r.SendEnvelope(resp)
 }
 
+func handleGetAIPrompt(r *fastglue.Request) error {
+	app := r.Context.(*App)
+	id, err := strconv.Atoi(r.RequestCtx.UserValue("id").(string))
+	if err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("globals.messages.somethingWentWrong"), nil, envelope.InputError)
+	}
+	p, err := app.ai.GetPromptByID(id)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(p)
+}
+
 func handleCreateAIPrompt(r *fastglue.Request) error {
 	var (
 		app = r.Context.(*App)
diff --git a/cmd/handlers.go b/cmd/handlers.go
index d56d05fa..4a31cf9a 100644
--- a/cmd/handlers.go
+++ b/cmd/handlers.go
@@ -252,6 +252,7 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 
 	// AI completions.
 	g.GET("/api/v1/ai/prompts", auth(handleGetAIPrompts))
+	g.GET("/api/v1/ai/prompts/{id}", perm(handleGetAIPrompt, "ai:manage"))
 	g.POST("/api/v1/ai/prompts", perm(handleCreateAIPrompt, "ai:manage"))
 	g.PUT("/api/v1/ai/prompts/{id}", perm(handleUpdateAIPrompt, "ai:manage"))
 	g.DELETE("/api/v1/ai/prompts/{id}", perm(handleDeleteAIPrompt, "ai:manage"))
diff --git a/frontend/apps/main/src/api/index.js b/frontend/apps/main/src/api/index.js
index 157c7705..01e44525 100644
--- a/frontend/apps/main/src/api/index.js
+++ b/frontend/apps/main/src/api/index.js
@@ -465,6 +465,7 @@ const updateSharedView = (id, data) =>
 const deleteSharedView = (id) => http.delete(`/api/v1/shared-views/${id}`)
 
 const getAiPrompts = () => http.get('/api/v1/ai/prompts')
+const getAIPrompt = (id) => http.get(`/api/v1/ai/prompts/${id}`)
 const createAIPrompt = (data) => http.post('/api/v1/ai/prompts', data)
 const updateAIPrompt = (id, data) => http.put(`/api/v1/ai/prompts/${id}`, data)
 const deleteAIPrompt = (id) => http.delete(`/api/v1/ai/prompts/${id}`)
@@ -755,6 +756,7 @@ export default {
   updateSharedView,
   deleteSharedView,
   getAiPrompts,
+  getAIPrompt,
   createAIPrompt,
   updateAIPrompt,
   deleteAIPrompt,
diff --git a/frontend/apps/main/src/views/admin/ai/AIEditorPrompts.vue b/frontend/apps/main/src/views/admin/ai/AIEditorPrompts.vue
index 6314721d..5fc717e7 100644
--- a/frontend/apps/main/src/views/admin/ai/AIEditorPrompts.vue
+++ b/frontend/apps/main/src/views/admin/ai/AIEditorPrompts.vue
@@ -105,11 +105,19 @@ const newPrompt = () => {
   initialValues.value = {}
 }
 
-const editPrompt = (item) => {
-  isEditing.value = true
-  editingId.value = item.id
-  initialValues.value = { ...item }
-  dialogOpen.value = true
+const editPrompt = async (item) => {
+  try {
+    const resp = await api.getAIPrompt(item.id)
+    isEditing.value = true
+    editingId.value = item.id
+    initialValues.value = resp.data.data
+    dialogOpen.value = true
+  } catch (error) {
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  }
 }
 
 const submitPrompt = async (values) => {
diff --git a/i18n/en-US.json b/i18n/en-US.json
index db500c58..680ca10f 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -120,7 +120,7 @@
   "admin.ai.embedding": "Embedding",
   "admin.ai.snippets": "Snippet | Snippets",
   "admin.ai.editorPrompts": "Editor prompt | Editor prompts",
-  "admin.ai.editorPromptsHelp": "Editor prompts are the AI actions agents can run on their draft from the reply box, such as fixing grammar or changing tone. The prompt is sent as the instruction and the draft as the text to rewrite.",
+  "admin.ai.editorPromptsHelp": "Editor prompts are the AI actions agents can run on their draft from the reply box, such as fixing grammar or changing tone.",
   "admin.ai.editorPrompt.new": "New editor prompt",
   "admin.ai.editorPrompt.edit": "Edit editor prompt",
   "admin.ai.editorPrompt.deleteConfirmation": "This will permanently delete the editor prompt and remove it from the reply box.",
diff --git a/internal/ai/ai.go b/internal/ai/ai.go
index 593ccb2b..b1a320b5 100644
--- a/internal/ai/ai.go
+++ b/internal/ai/ai.go
@@ -98,6 +98,7 @@ type queries struct {
 	UpdateProviderConfig         *sqlx.Stmt `query:"update-provider-config"`
 	GetPrompt                    *sqlx.Stmt `query:"get-prompt"`
 	GetPrompts                   *sqlx.Stmt `query:"get-prompts"`
+	GetPromptByID                *sqlx.Stmt `query:"get-prompt-by-id"`
 	InsertPrompt                 *sqlx.Stmt `query:"insert-prompt"`
 	UpdatePrompt                 *sqlx.Stmt `query:"update-prompt"`
 	DeletePrompt                 *sqlx.Stmt `query:"delete-prompt"`
@@ -245,6 +246,19 @@ func (m *Manager) GetPrompts() ([]models.Prompt, error) {
 	return prompts, nil
 }
 
+// GetPromptByID returns a prompt with its content for the admin editor.
+func (m *Manager) GetPromptByID(id int) (models.Prompt, error) {
+	var p models.Prompt
+	if err := m.q.GetPromptByID.Get(&p, id); err != nil {
+		if err == sql.ErrNoRows {
+			return p, envelope.NewError(envelope.NotFoundError, m.i18n.T("globals.messages.notFound"), nil)
+		}
+		m.lo.Error("error fetching prompt", "error", err)
+		return p, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return p, nil
+}
+
 // CreatePrompt stores a new editor prompt; the key is derived from the title and never changes.
 func (m *Manager) CreatePrompt(title, content string) (models.Prompt, error) {
 	var p models.Prompt
diff --git a/internal/ai/queries.sql b/internal/ai/queries.sql
index 2ae6a904..c3534403 100644
--- a/internal/ai/queries.sql
+++ b/internal/ai/queries.sql
@@ -8,7 +8,10 @@ UPDATE ai_providers SET config = $2, updated_at = now() WHERE type = $1;
 SELECT id, created_at, updated_at, key, title, content FROM ai_prompts WHERE key = $1;
 
 -- name: get-prompts
-SELECT id, created_at, updated_at, key, title, content FROM ai_prompts ORDER BY title;
+SELECT id, created_at, updated_at, key, title FROM ai_prompts ORDER BY title;
+
+-- name: get-prompt-by-id
+SELECT id, created_at, updated_at, key, title, content FROM ai_prompts WHERE id = $1;
 
 -- name: insert-prompt
 INSERT INTO ai_prompts (key, title, content) VALUES ($1, $2, $3)

From bde1f06ec618cb117f973d64ab48e12095454e30 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 9 Sep 2026 01:14:42 +0530
Subject: [PATCH 046/178] skip the OIDC lookup on login unless local login is
 disabled and translate the error

---
 cmd/config.go                                 | 35 ++++++++++---------
 cmd/login.go                                  | 15 ++++----
 config.sample.toml                            |  4 +--
 .../main/src/views/auth/UserLoginView.vue     |  2 +-
 i18n/en-US.json                               |  1 +
 5 files changed, 31 insertions(+), 26 deletions(-)

diff --git a/cmd/config.go b/cmd/config.go
index e354ab9d..d0c1268a 100644
--- a/cmd/config.go
+++ b/cmd/config.go
@@ -10,22 +10,6 @@ import (
 
 const localLoginEnabledKey = "auth.local_login_enabled"
 
-// isLocalLoginEnabled keeps local login available by default and whenever no
-// OIDC provider is enabled, preventing an administrator from locking everyone out.
-func isLocalLoginEnabled(providers []oidcmodels.OIDC) bool {
-	if !ko.Exists(localLoginEnabledKey) || ko.Bool(localLoginEnabledKey) {
-		return true
-	}
-
-	for _, provider := range providers {
-		if provider.Enabled {
-			return false
-		}
-	}
-
-	return true
-}
-
 // handleGetConfig returns the public configuration needed for app initialization, this includes minimal app settings and enabled SSO providers (without secrets).
 func handleGetConfig(r *fastglue.Request) error {
 	var app = r.Context.(*App)
@@ -77,7 +61,24 @@ func handleGetConfig(r *fastglue.Request) error {
 
 	// Add SSO providers to the response
 	publicSettings["app.sso_providers"] = enabledProviders
-	publicSettings["app.local_login_enabled"] = isLocalLoginEnabled(oidcProviders)
+	publicSettings["auth.local_login_enabled"] = isLocalLoginEnabled(oidcProviders)
 
 	return r.SendEnvelope(publicSettings)
 }
+
+func localLoginDisabledInConfig() bool {
+	return ko.Exists(localLoginEnabledKey) && !ko.Bool(localLoginEnabledKey)
+}
+
+// isLocalLoginEnabled stays true while no OIDC provider is enabled so a misconfigured deployment cannot lock admins out.
+func isLocalLoginEnabled(providers []oidcmodels.OIDC) bool {
+	if !localLoginDisabledInConfig() {
+		return true
+	}
+	for _, provider := range providers {
+		if provider.Enabled {
+			return false
+		}
+	}
+	return true
+}
diff --git a/cmd/login.go b/cmd/login.go
index c20ab830..250cb943 100644
--- a/cmd/login.go
+++ b/cmd/login.go
@@ -21,12 +21,15 @@ func handleLogin(r *fastglue.Request) error {
 		loginReq loginRequest
 	)
 
-	oidcProviders, err := app.oidc.GetAll()
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-	if !isLocalLoginEnabled(oidcProviders) {
-		return r.SendErrorEnvelope(fasthttp.StatusForbidden, "Local login is disabled. Sign in with an SSO provider.", nil, envelope.PermissionError)
+	if localLoginDisabledInConfig() {
+		oidcProviders, err := app.oidc.GetAll()
+		if err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+		if !isLocalLoginEnabled(oidcProviders) {
+			return r.SendErrorEnvelope(fasthttp.StatusForbidden, app.i18n.T("auth.localLoginDisabled"), nil, envelope.PermissionError)
+		}
+		app.lo.Warn("local login is disabled in config but no OIDC provider is enabled, allowing password login")
 	}
 
 	// Decode JSON request.
diff --git a/config.sample.toml b/config.sample.toml
index 4f0bbe19..1f436192 100644
--- a/config.sample.toml
+++ b/config.sample.toml
@@ -35,9 +35,9 @@ read_buffer_size = 65536
 keepalive_timeout = "10s"
 
 [auth]
-# Allow users to sign in with their LibreDesk email and password.
+# Allow users to sign in with their libredesk email and password.
 # Disable this only after configuring and enabling at least one OIDC provider.
-# LibreDesk automatically keeps local login available when no OIDC provider is enabled to prevent lockout.
+# libredesk automatically keeps local login available when no OIDC provider is enabled to prevent lockout.
 # If an enabled provider is unavailable or misconfigured, set auth.local_login_enabled = true to restore password login.
 local_login_enabled = true
 
diff --git a/frontend/apps/main/src/views/auth/UserLoginView.vue b/frontend/apps/main/src/views/auth/UserLoginView.vue
index 5ca74ff1..eb2d0c34 100644
--- a/frontend/apps/main/src/views/auth/UserLoginView.vue
+++ b/frontend/apps/main/src/views/auth/UserLoginView.vue
@@ -247,7 +247,7 @@ const enabledOIDCProviders = computed(() => {
 })
 
 const localLoginEnabled = computed(
-  () => appSettingsStore.public_config?.['app.local_login_enabled'] !== false
+  () => appSettingsStore.public_config?.['auth.local_login_enabled'] !== false
 )
 
 const emailHasError = computed(() => {
diff --git a/i18n/en-US.json b/i18n/en-US.json
index eba74bd3..15d78cd3 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -591,6 +591,7 @@
   "auth.invalidOrExpiredSessionClearCookie": "Invalid or expired session. Please clear your cookies and try again.",
   "auth.invalidResetLink": "Invalid reset link. Please request a new password reset link.",
   "auth.loggingIn": "Logging in...",
+  "auth.localLoginDisabled": "Password login is disabled. Sign in with your SSO provider.",
   "auth.newPassword": "New password",
   "auth.orContinueWith": "Or continue with",
   "auth.passwordRequired": "Password is required.",

From 32f814757f47a7615c81479f26d2448278769320 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 9 Sep 2026 01:16:53 +0530
Subject: [PATCH 047/178] drop the rationale comment on isLocalLoginEnabled

---
 cmd/config.go | 1 -
 1 file changed, 1 deletion(-)

diff --git a/cmd/config.go b/cmd/config.go
index d0c1268a..788bd6ba 100644
--- a/cmd/config.go
+++ b/cmd/config.go
@@ -70,7 +70,6 @@ func localLoginDisabledInConfig() bool {
 	return ko.Exists(localLoginEnabledKey) && !ko.Bool(localLoginEnabledKey)
 }
 
-// isLocalLoginEnabled stays true while no OIDC provider is enabled so a misconfigured deployment cannot lock admins out.
 func isLocalLoginEnabled(providers []oidcmodels.OIDC) bool {
 	if !localLoginDisabledInConfig() {
 		return true

From 2c1aa922a8bd78ffdd40401d35f36d5f34f13567 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 9 Sep 2026 01:33:53 +0530
Subject: [PATCH 048/178] Update roadmap with new features and statuses

---
 ROADMAP.md | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/ROADMAP.md b/ROADMAP.md
index 210fcff5..3afab9d8 100644
--- a/ROADMAP.md
+++ b/ROADMAP.md
@@ -4,9 +4,10 @@ The open-source customer support platform you actually own. One inbox for email,
 
 ## Near Term
 - WhatsApp channel - WIP
+- Web / Customer Portal to manage tickets - WIP
+- Telegram channel - TODO
 
 ## Mid Term
-- Portal to manage tickets - TODO
 - Conversation reports - TODO
 - Contact merging - TODO
 - 2FA for password login - TODO

From b5c4a30805c5296225dab9bd7882af007f3f3e9c Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 9 Sep 2026 01:34:36 +0530
Subject: [PATCH 049/178] Update 2FA status and conversation reports in roadmap

---
 ROADMAP.md | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/ROADMAP.md b/ROADMAP.md
index 3afab9d8..ad5a1f81 100644
--- a/ROADMAP.md
+++ b/ROADMAP.md
@@ -5,9 +5,9 @@ The open-source customer support platform you actually own. One inbox for email,
 ## Near Term
 - WhatsApp channel - WIP
 - Web / Customer Portal to manage tickets - WIP
+- 2FA for password login - WIP
 - Telegram channel - TODO
 
 ## Mid Term
-- Conversation reports - TODO
+- Extensive conversation reports - TODO
 - Contact merging - TODO
-- 2FA for password login - TODO

From 302bbd21f5573f6541fa87b4637b6ebd0cce41b9 Mon Sep 17 00:00:00 2001
From: pmslava <pmslava@tutanota.com>
Date: Wed, 9 Sep 2026 00:16:22 +0200
Subject: [PATCH 050/178] conversation: show a priority marker on conversation
 list rows

The list showed no priority at all, so an agent scanning the inbox could not tell a
High-priority conversation from the rest without opening it - which matters when an
automation rule raises priority for paying customers. Each row now carries a small
coloured dot in the metadata cluster next to the channel icon and the relative time,
using the semantic tokens the rest of the desk uses for urgency: destructive for High,
warning-600 for Medium, muted-foreground for Low, and muted-foreground for any priority
an install has renamed. The dot is a tooltip trigger and carries an aria-label, both
reading "Priority: <name>", and rows whose priority is unset render nothing. The
mapping lives in one small PriorityDot component so any future priority display stays
consistent with it. No backend change was needed: the get-conversations query already
selects conversation_priorities.name as priority, ConversationListItem already carries
it, and a priority change is broadcast over the websocket and merged into the list row.
---
 .../src/features/conversation/PriorityDot.vue | 44 +++++++++++++++++++
 .../list/ConversationListItem.vue             |  2 +
 2 files changed, 46 insertions(+)
 create mode 100644 frontend/apps/main/src/features/conversation/PriorityDot.vue

diff --git a/frontend/apps/main/src/features/conversation/PriorityDot.vue b/frontend/apps/main/src/features/conversation/PriorityDot.vue
new file mode 100644
index 00000000..1bc0dfd2
--- /dev/null
+++ b/frontend/apps/main/src/features/conversation/PriorityDot.vue
@@ -0,0 +1,44 @@
+<template>
+  <Tooltip v-if="priorityName">
+    <TooltipTrigger asChild>
+      <span
+        class="h-2 w-2 rounded-full flex-shrink-0"
+        :class="dotClass"
+        role="img"
+        :aria-label="priorityLabel"
+      />
+    </TooltipTrigger>
+    <TooltipContent>{{ priorityLabel }}</TooltipContent>
+  </Tooltip>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import { Tooltip, TooltipContent, TooltipTrigger } from '@shared-ui/components/ui/tooltip'
+import { useI18n } from 'vue-i18n'
+
+// Priorities are seeded rows (Low, Medium, High) and are not translated, so match on the
+// name and keep anything unrecognised neutral rather than inventing a colour for it.
+const PRIORITY_DOT_CLASSES = {
+  low: 'bg-muted-foreground',
+  medium: 'bg-warning-600',
+  high: 'bg-destructive'
+}
+
+const props = defineProps({
+  priority: {
+    type: String,
+    default: ''
+  }
+})
+
+const { t } = useI18n()
+
+const priorityName = computed(() => (props.priority || '').trim())
+
+const dotClass = computed(
+  () => PRIORITY_DOT_CLASSES[priorityName.value.toLowerCase()] || 'bg-muted-foreground'
+)
+
+const priorityLabel = computed(() => `${t('globals.terms.priority', 1)}: ${priorityName.value}`)
+</script>
diff --git a/frontend/apps/main/src/features/conversation/list/ConversationListItem.vue b/frontend/apps/main/src/features/conversation/list/ConversationListItem.vue
index 3c03e086..8cc11add 100644
--- a/frontend/apps/main/src/features/conversation/list/ConversationListItem.vue
+++ b/frontend/apps/main/src/features/conversation/list/ConversationListItem.vue
@@ -60,6 +60,7 @@
                   <TooltipContent>{{ contactFullName }}</TooltipContent>
                 </Tooltip>
                 <div class="flex items-center gap-1 flex-shrink-0">
+                  <PriorityDot :priority="conversation.priority" />
                   <Tooltip>
                     <TooltipTrigger asChild>
                       <component
@@ -176,6 +177,7 @@ import {
   ContextMenuTrigger
 } from '@shared-ui/components/ui/context-menu'
 import SlaBadge from '@main/features/sla/SlaBadge.vue'
+import PriorityDot from '@main/features/conversation/PriorityDot.vue'
 import { Tooltip, TooltipContent, TooltipTrigger } from '@shared-ui/components/ui/tooltip'
 import { Checkbox } from '@shared-ui/components/ui/checkbox'
 import { useConversationStore } from '@main/stores/conversation'

From 6e039e27f55b772166df7bfc69dea7d857af2ac2 Mon Sep 17 00:00:00 2001
From: "dependabot[bot]" <49699333+dependabot[bot]@users.noreply.github.com>
Date: Thu, 10 Sep 2026 21:19:09 +0000
Subject: [PATCH 051/178] Bump vitest from 4.1.0 to 4.1.11 in /frontend

Bumps [vitest](https://github.com/vitest-dev/vitest/tree/HEAD/packages/vitest) from 4.1.0 to 4.1.11.
- [Release notes](https://github.com/vitest-dev/vitest/releases)
- [Changelog](https://github.com/vitest-dev/vitest/blob/main/docs/releases.md)
- [Commits](https://github.com/vitest-dev/vitest/commits/v4.1.11/packages/vitest)

---
updated-dependencies:
- dependency-name: vitest
  dependency-version: 4.1.11
  dependency-type: direct:development
...

Signed-off-by: dependabot[bot] <support@github.com>
---
 frontend/package.json   |   2 +-
 frontend/pnpm-lock.yaml | 187 ++++++++++++++++++++++------------------
 2 files changed, 103 insertions(+), 86 deletions(-)

diff --git a/frontend/package.json b/frontend/package.json
index 8bf7e494..39c55a37 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -94,7 +94,7 @@
     "tailwindcss": "^3.4.17",
     "tailwindcss-animate": "^1.0.7",
     "vite": "^6.4.3",
-    "vitest": "^4.1.0"
+    "vitest": "^4.1.11"
   },
   "packageManager": "pnpm@9.15.3+sha512.1f79bc245a66eb0b07c5d4d83131240774642caaa86ef7d0434ab47c0d16f66b04e21e0c086eb61e62c77efc4d7f7ec071afad3796af64892fae66509173893a"
 }
diff --git a/frontend/pnpm-lock.yaml b/frontend/pnpm-lock.yaml
index dc71dda7..0fa33df3 100644
--- a/frontend/pnpm-lock.yaml
+++ b/frontend/pnpm-lock.yaml
@@ -223,8 +223,8 @@ importers:
         specifier: ^6.4.3
         version: 6.4.3(@types/node@25.8.0)(jiti@1.21.7)(sass@1.99.0)(stylus@0.57.0)(yaml@2.9.0)
       vitest:
-        specifier: ^4.1.0
-        version: 4.1.0(@types/node@25.8.0)(jsdom@29.0.1)(vite@6.4.3(@types/node@25.8.0)(jiti@1.21.7)(sass@1.99.0)(stylus@0.57.0)(yaml@2.9.0))
+        specifier: ^4.1.11
+        version: 4.1.11(@types/node@25.8.0)(jsdom@29.0.1)(vite@6.4.3(@types/node@25.8.0)(jiti@1.21.7)(sass@1.99.0)(stylus@0.57.0)(yaml@2.9.0))
 
 packages:
 
@@ -687,8 +687,8 @@ packages:
     resolution: {integrity: sha512-R8gLRTZeyp03ymzP/6Lil/28tGeGEzhx1q2k703KGWRAI1VdvPIXdG70VJc2pAMw3NA6JKL5hhFu1sJX0Mnn/A==}
     engines: {node: '>=6.0.0'}
 
-  '@jridgewell/sourcemap-codec@1.5.5':
-    resolution: {integrity: sha512-cYQ9310grqxueWbl+WuIUIaiUaDcj7WOq5fVhEljNVgRfOUhY9fy2zTvfoqWsnebh8Sl70VScFbICvJnLKB0Og==}
+  '@jridgewell/sourcemap-codec@1.6.0':
+    resolution: {integrity: sha512-T7jf+5zgsZHwNJ4lvQ7/aezbyk0nNX+zJVWpmHA7VYsEx7a7qr5Rg5IbtJFqkgze5Y2sruq1RUY8Q837Od7iFw==}
 
   '@jridgewell/trace-mapping@0.3.25':
     resolution: {integrity: sha512-vNk6aEwybGtawWmy/PzwnGDOjCkLWSD2wqvjGGAgOAwCGWySYXfYoxt00IJkTF+8Lb57DwOb3Aa0o9CApepiYQ==}
@@ -1460,34 +1460,34 @@ packages:
       vite: ^5.0.0 || ^6.0.0
       vue: ^3.2.25
 
-  '@vitest/expect@4.1.0':
-    resolution: {integrity: sha512-EIxG7k4wlWweuCLG9Y5InKFwpMEOyrMb6ZJ1ihYu02LVj/bzUwn2VMU+13PinsjRW75XnITeFrQBMH5+dLvCDA==}
+  '@vitest/expect@4.1.11':
+    resolution: {integrity: sha512-VX2x5vNJXET47KAFzwERI+KRMtTTCSWTfSMKsW7JsUsXV4psq++e3DvZpuTDOpHcxytiDs6p2nhVb2tVDiiUYw==}
 
-  '@vitest/mocker@4.1.0':
-    resolution: {integrity: sha512-evxREh+Hork43+Y4IOhTo+h5lGmVRyjqI739Rz4RlUPqwrkFFDF6EMvOOYjTx4E8Tl6gyCLRL8Mu7Ry12a13Tw==}
+  '@vitest/mocker@4.1.11':
+    resolution: {integrity: sha512-2XJVD55d1o5AZous5CCGKS74g/riOj9odEt2bQpCVZeblHyHdnMeFl4jl0XjU21stf4mbjUkew2eXQZt65g5CQ==}
     peerDependencies:
       msw: ^2.4.9
-      vite: ^6.0.0 || ^7.0.0 || ^8.0.0-0
+      vite: ^6.0.0 || ^7.0.0 || ^8.0.0
     peerDependenciesMeta:
       msw:
         optional: true
       vite:
         optional: true
 
-  '@vitest/pretty-format@4.1.0':
-    resolution: {integrity: sha512-3RZLZlh88Ib0J7NQTRATfc/3ZPOnSUn2uDBUoGNn5T36+bALixmzphN26OUD3LRXWkJu4H0s5vvUeqBiw+kS0A==}
+  '@vitest/pretty-format@4.1.11':
+    resolution: {integrity: sha512-yiZzPbGTS9Sr/JpFl8zHrcIkAofNbFV6k21vIgQN/cY/oxZeXhJv5sc/MBJ5jFKWmWs+oJHw0UXLZjmf931+Vw==}
 
-  '@vitest/runner@4.1.0':
-    resolution: {integrity: sha512-Duvx2OzQ7d6OjchL+trw+aSrb9idh7pnNfxrklo14p3zmNL4qPCDeIJAK+eBKYjkIwG96Bc6vYuxhqDXQOWpoQ==}
+  '@vitest/runner@4.1.11':
+    resolution: {integrity: sha512-LztvUgdwMNJMIkj3hQnnxiC2Xy1zNxq928W/xhjCLaNCzqTZOudjwbQf6v9IntZGPw132i2Lq2rgTRZHD3JHNw==}
 
-  '@vitest/snapshot@4.1.0':
-    resolution: {integrity: sha512-0Vy9euT1kgsnj1CHttwi9i9o+4rRLEaPRSOJ5gyv579GJkNpgJK+B4HSv/rAWixx2wdAFci1X4CEPjiu2bXIMg==}
+  '@vitest/snapshot@4.1.11':
+    resolution: {integrity: sha512-pN7ikn1ON7h8ee4gIAp4AzyK+zBtJPzVbqOgu5LCEh4VaJVbPQcgYQYJIMGQPXVeJJq1fnfazis7a5pFNPahog==}
 
-  '@vitest/spy@4.1.0':
-    resolution: {integrity: sha512-pz77k+PgNpyMDv2FV6qmk5ZVau6c3R8HC8v342T2xlFxQKTrSeYw9waIJG8KgV9fFwAtTu4ceRzMivPTH6wSxw==}
+  '@vitest/spy@4.1.11':
+    resolution: {integrity: sha512-apNa/prQy2qCeywhnixOHPRCgGNhvg7T4Dapfl1GahLp/R+uhBm5cPyFoNVyqsNd2h1nJxL6BqqdIjiABL60YA==}
 
-  '@vitest/utils@4.1.0':
-    resolution: {integrity: sha512-XfPXT6a8TZY3dcGY8EdwsBulFCIw+BeeX0RZn2x/BtiY/75YGh8FeWGG8QISN/WhaqSrE2OrlDgtF8q5uhOTmw==}
+  '@vitest/utils@4.1.11':
+    resolution: {integrity: sha512-zTCVGpyFsGWBhllOyKlTw/vnr6D9qxsfSDyfbyZmTyjHw5N/VuvzHpHoQjm2ZJzn4RJgx5w4r7V0er69CmLgPQ==}
 
   '@vue/compiler-core@3.5.13':
     resolution: {integrity: sha512-oOdAkwqUfW1WqpwSYJce06wvt6HljgY3fGeM9NcVA1HaYOij3mZG9Rkysn0OHuyUAGMbEbARIpsG+LPVlBJ5/Q==}
@@ -2184,8 +2184,8 @@ packages:
     resolution: {integrity: sha512-Zf5H2Kxt2xjTvbJvP2ZWLEICxA6j+hAmMzIlypy4xcBg1vKVnx89Wy0GbS+kf5cwCVFFzdCFh2XSCFNULS6csw==}
     engines: {node: '>= 0.4'}
 
-  es-module-lexer@2.1.0:
-    resolution: {integrity: sha512-n27zTYMjYu1aj4MjCWzSP7G9r75utsaoc8m61weK+W8JMBGGQybd43GstCXZ3WNmSFtGT9wi59qQTW6mhTR5LQ==}
+  es-module-lexer@2.3.2:
+    resolution: {integrity: sha512-poHGpORABojJJucnV9KbOavETW8lBVnphkW77ER5/BQ5Fz7oXSoCNek7IH3vR5nRjdsEz926ibFYX8KtLQmdyw==}
 
   es-object-atoms@1.1.2:
     resolution: {integrity: sha512-HWcBoN6NileqtSydK2FqHbS/LoDd2pqrnQHLyJzBj4kOp/ky2MWMN694xOfkK8/SnUsW2DH7EfyVlydKCsm1Zw==}
@@ -2300,8 +2300,8 @@ packages:
     resolution: {integrity: sha512-8iA79xD3uAch729dUG8xaaBBFGaEa0wdD2VkYLFHwlqosEj/jT66AzcreRDSgV7ehnNLBW2WR5jIXwGKjVdTLg==}
     engines: {node: '>=4'}
 
-  expect-type@1.3.0:
-    resolution: {integrity: sha512-knvyeauYhqjOYvQ66MznSMs83wmHrCycNEN6Ao+2AeYEfxUIkuiVxdEa1qlGEPK+We3n0THiDciYSsCcgW/DoA==}
+  expect-type@1.4.0:
+    resolution: {integrity: sha512-KfYbmpRm0VbLjEvVa9yGwCi9GI34xvi7A/HXYWQO65CSD2u3MczUJSuwXKFIxlGsgBQizV9q5J9NHj4VG0n+pA==}
     engines: {node: '>=12.0.0'}
 
   extend@3.0.2:
@@ -2920,8 +2920,9 @@ packages:
     resolution: {integrity: sha512-W67iLl4J2EXEGTbfeHCffrjDfitvLANg0UlX3wFUUSTx92KXRFegMHUVgSqE+wvhAbi4WqjGg9czysTV2Epbew==}
     engines: {node: '>= 0.4'}
 
-  obug@2.1.1:
-    resolution: {integrity: sha512-uTqF9MuPraAQ+IsnPf366RG4cP9RtUi7MLO1N3KEc+wb0a6yKpeL0lmk2IB1jY5KHPAlTc6T/JRdC/YqxHNwkQ==}
+  obug@2.2.1:
+    resolution: {integrity: sha512-XrsrhT5sybtKI6wakr2SPOlGZWWYbUXZ7a0jT8/QOeAPau+1X/bSegNe5YR75oJmEZQbKningirmGOEJCIk61Q==}
+    engines: {node: '>=12.20.0'}
 
   ohash@2.0.11:
     resolution: {integrity: sha512-RdR9FQrFwNBNXAr4GixM8YaRZRJ5PUWbKYbE5eOsrwAjJW0q2REGcf79oYPsLyskQCZG1PLN+S/K1V00joZAoQ==}
@@ -3022,6 +3023,10 @@ packages:
     resolution: {integrity: sha512-QP88BAKvMam/3NxH6vj2o21R6MjxZUAd6nlwAS/pnGvN9IVLocLHxGYIzFhg6fUQ+5th6P4dv4eW9jX3DSIj7A==}
     engines: {node: '>=12'}
 
+  picomatch@4.0.7:
+    resolution: {integrity: sha512-qcJu88Q2IWqJsDD529JKMdwGm/dvInW4HvQnRwiH9JtihJvzGOscDtHE3x1pBKeUOTysQ8kVmLnJ2kJu7yhcGA==}
+    engines: {node: '>=12'}
+
   pify@2.3.0:
     resolution: {integrity: sha512-udgsAY+fTnvv7kI7aaxbqwWNb0AHiB0qBO89PZKPkoTmGOgdbrHDKD+0B2X4uTfJ/FT1R09r9gTsjUjNJotuog==}
     engines: {node: '>=0.10.0'}
@@ -3395,8 +3400,8 @@ packages:
     engines: {node: '>=16'}
     hasBin: true
 
-  std-env@4.1.0:
-    resolution: {integrity: sha512-Rq7ybcX2RuC55r9oaPVEW7/xu3tj8u4GeBYHBWCychFtzMIr86A7e3PPEBPT37sHStKX3+TiX/Fr/ACmJLVlLQ==}
+  std-env@4.2.0:
+    resolution: {integrity: sha512-oCUKSupKTHX53EyjDtuZQ64pjLJ6yYCtpmEw0goYxtjG9KpbRe8KAsl2tBUGU9DyMcJ0RwJ8GqJAFzMXcXW1Rw==}
 
   stream-combiner@0.0.4:
     resolution: {integrity: sha512-rT00SPnTVyRsaSz5zgSPma/aHSOic5U1prhYdRy5HS2kTZviFpmDgzilbtsJsxiroqACmayynDN/9VzIbX5DOw==}
@@ -3526,8 +3531,8 @@ packages:
   tinybench@2.9.0:
     resolution: {integrity: sha512-0+DUvqWMValLmha6lr4kD8iAMK1HzV0/aKnCtWb9v9641TnP/MFb7Pc2bxoxQjTXAErryXVgUOfv2YqNllqGeg==}
 
-  tinyexec@1.2.4:
-    resolution: {integrity: sha512-SHf/r48b7vOrjve9PxJo3MN5v5yuyjHvdUcrQffT3WXMUfnGmHDVbC4k3sHJaJTgZCwpUplIaAo5ANtMyp3YHg==}
+  tinyexec@1.3.1:
+    resolution: {integrity: sha512-GCvB3aoys96IuDFBMcTB46JOR6mdMtAToqwiW8JlWhsoh1mhHi/xn9ss/Dg7N555GiJyEt2qzoG/NHCwM6h1EA==}
     engines: {node: '>=18'}
 
   tinyglobby@0.2.17:
@@ -3537,8 +3542,8 @@ packages:
   tinyqueue@2.0.3:
     resolution: {integrity: sha512-ppJZNDuKGgxzkHihX8v9v9G5f+18gzaTfrukGrq6ueg0lmH4nqVnA2IPG0AEH3jKEk2GRJCUhDoqpoiw3PHLBA==}
 
-  tinyrainbow@3.1.0:
-    resolution: {integrity: sha512-Bf+ILmBgretUrdJxzXM0SgXLZ3XfiaUuOj/IKQHuTXip+05Xn+uyEYdVg0kYDipTBcLrCVyUzAPz7QmArb0mmw==}
+  tinyrainbow@3.1.1:
+    resolution: {integrity: sha512-yau8yJdTt989Mm0Bd/236QnzEiPf2xLLTqUZRUJOo/3CB078LSwzei343DgtJVmfJKJE3TMINY1u42SQsP6mXw==}
     engines: {node: '>=14.0.0'}
 
   tippy.js@6.3.7:
@@ -3706,21 +3711,23 @@ packages:
       yaml:
         optional: true
 
-  vitest@4.1.0:
-    resolution: {integrity: sha512-YbDrMF9jM2Lqc++2530UourxZHmkKLxrs4+mYhEwqWS97WJ7wOYEkcr+QfRgJ3PW9wz3odRijLZjHEaRLTNbqw==}
+  vitest@4.1.11:
+    resolution: {integrity: sha512-fhACrNXUidIbGSBr5FlbuBkO7VWC1ZyLl0DO4CU2DrQoAPxX84Ysxs+HeGQpii5lZWV1Q4gBZTTu49mF+A6Edw==}
     engines: {node: ^20.0.0 || ^22.0.0 || >=24.0.0}
     hasBin: true
     peerDependencies:
       '@edge-runtime/vm': '*'
       '@opentelemetry/api': ^1.9.0
       '@types/node': ^20.0.0 || ^22.0.0 || >=24.0.0
-      '@vitest/browser-playwright': 4.1.0
-      '@vitest/browser-preview': 4.1.0
-      '@vitest/browser-webdriverio': 4.1.0
-      '@vitest/ui': 4.1.0
+      '@vitest/browser-playwright': 4.1.11
+      '@vitest/browser-preview': 4.1.11
+      '@vitest/browser-webdriverio': 4.1.11
+      '@vitest/coverage-istanbul': 4.1.11
+      '@vitest/coverage-v8': 4.1.11
+      '@vitest/ui': 4.1.11
       happy-dom: '*'
       jsdom: '*'
-      vite: ^6.0.0 || ^7.0.0 || ^8.0.0-0
+      vite: ^6.0.0 || ^7.0.0 || ^8.0.0
     peerDependenciesMeta:
       '@edge-runtime/vm':
         optional: true
@@ -3734,6 +3741,10 @@ packages:
         optional: true
       '@vitest/browser-webdriverio':
         optional: true
+      '@vitest/coverage-istanbul':
+        optional: true
+      '@vitest/coverage-v8':
+        optional: true
       '@vitest/ui':
         optional: true
       happy-dom:
@@ -4379,30 +4390,30 @@ snapshots:
 
   '@jridgewell/gen-mapping@0.3.13':
     dependencies:
-      '@jridgewell/sourcemap-codec': 1.5.5
+      '@jridgewell/sourcemap-codec': 1.6.0
       '@jridgewell/trace-mapping': 0.3.31
 
   '@jridgewell/gen-mapping@0.3.8':
     dependencies:
       '@jridgewell/set-array': 1.2.1
-      '@jridgewell/sourcemap-codec': 1.5.5
+      '@jridgewell/sourcemap-codec': 1.6.0
       '@jridgewell/trace-mapping': 0.3.25
 
   '@jridgewell/resolve-uri@3.1.2': {}
 
   '@jridgewell/set-array@1.2.1': {}
 
-  '@jridgewell/sourcemap-codec@1.5.5': {}
+  '@jridgewell/sourcemap-codec@1.6.0': {}
 
   '@jridgewell/trace-mapping@0.3.25':
     dependencies:
       '@jridgewell/resolve-uri': 3.1.2
-      '@jridgewell/sourcemap-codec': 1.5.5
+      '@jridgewell/sourcemap-codec': 1.6.0
 
   '@jridgewell/trace-mapping@0.3.31':
     dependencies:
       '@jridgewell/resolve-uri': 3.1.2
-      '@jridgewell/sourcemap-codec': 1.5.5
+      '@jridgewell/sourcemap-codec': 1.6.0
 
   '@juggle/resize-observer@3.4.0': {}
 
@@ -4513,7 +4524,7 @@ snapshots:
       detect-libc: 2.1.2
       is-glob: 4.0.3
       node-addon-api: 7.1.1
-      picomatch: 4.0.4
+      picomatch: 4.0.7
     optionalDependencies:
       '@parcel/watcher-android-arm64': 2.5.6
       '@parcel/watcher-darwin-arm64': 2.5.6
@@ -5200,46 +5211,46 @@ snapshots:
       vite: 6.4.3(@types/node@25.8.0)(jiti@1.21.7)(sass@1.99.0)(stylus@0.57.0)(yaml@2.9.0)
       vue: 3.5.13(typescript@5.7.3)
 
-  '@vitest/expect@4.1.0':
+  '@vitest/expect@4.1.11':
     dependencies:
       '@standard-schema/spec': 1.1.0
       '@types/chai': 5.2.3
-      '@vitest/spy': 4.1.0
-      '@vitest/utils': 4.1.0
+      '@vitest/spy': 4.1.11
+      '@vitest/utils': 4.1.11
       chai: 6.2.2
-      tinyrainbow: 3.1.0
+      tinyrainbow: 3.1.1
 
-  '@vitest/mocker@4.1.0(vite@6.4.3(@types/node@25.8.0)(jiti@1.21.7)(sass@1.99.0)(stylus@0.57.0)(yaml@2.9.0))':
+  '@vitest/mocker@4.1.11(vite@6.4.3(@types/node@25.8.0)(jiti@1.21.7)(sass@1.99.0)(stylus@0.57.0)(yaml@2.9.0))':
     dependencies:
-      '@vitest/spy': 4.1.0
+      '@vitest/spy': 4.1.11
       estree-walker: 3.0.3
       magic-string: 0.30.21
     optionalDependencies:
       vite: 6.4.3(@types/node@25.8.0)(jiti@1.21.7)(sass@1.99.0)(stylus@0.57.0)(yaml@2.9.0)
 
-  '@vitest/pretty-format@4.1.0':
+  '@vitest/pretty-format@4.1.11':
     dependencies:
-      tinyrainbow: 3.1.0
+      tinyrainbow: 3.1.1
 
-  '@vitest/runner@4.1.0':
+  '@vitest/runner@4.1.11':
     dependencies:
-      '@vitest/utils': 4.1.0
+      '@vitest/utils': 4.1.11
       pathe: 2.0.3
 
-  '@vitest/snapshot@4.1.0':
+  '@vitest/snapshot@4.1.11':
     dependencies:
-      '@vitest/pretty-format': 4.1.0
-      '@vitest/utils': 4.1.0
+      '@vitest/pretty-format': 4.1.11
+      '@vitest/utils': 4.1.11
       magic-string: 0.30.21
       pathe: 2.0.3
 
-  '@vitest/spy@4.1.0': {}
+  '@vitest/spy@4.1.11': {}
 
-  '@vitest/utils@4.1.0':
+  '@vitest/utils@4.1.11':
     dependencies:
-      '@vitest/pretty-format': 4.1.0
+      '@vitest/pretty-format': 4.1.11
       convert-source-map: 2.0.0
-      tinyrainbow: 3.1.0
+      tinyrainbow: 3.1.1
 
   '@vue/compiler-core@3.5.13':
     dependencies:
@@ -6010,7 +6021,7 @@ snapshots:
 
   es-errors@1.3.0: {}
 
-  es-module-lexer@2.1.0: {}
+  es-module-lexer@2.3.2: {}
 
   es-object-atoms@1.1.2:
     dependencies:
@@ -6204,7 +6215,7 @@ snapshots:
     dependencies:
       pify: 2.3.0
 
-  expect-type@1.3.0: {}
+  expect-type@1.4.0: {}
 
   extend@3.0.2: {}
 
@@ -6248,6 +6259,10 @@ snapshots:
     optionalDependencies:
       picomatch: 4.0.4
 
+  fdir@6.5.0(picomatch@4.0.7):
+    optionalDependencies:
+      picomatch: 4.0.7
+
   file-entry-cache@6.0.1:
     dependencies:
       flat-cache: 3.2.0
@@ -6682,7 +6697,7 @@ snapshots:
 
   magic-string@0.30.21:
     dependencies:
-      '@jridgewell/sourcemap-codec': 1.5.5
+      '@jridgewell/sourcemap-codec': 1.6.0
 
   map-stream@0.1.0: {}
 
@@ -6802,7 +6817,7 @@ snapshots:
 
   object-inspect@1.13.4: {}
 
-  obug@2.1.1: {}
+  obug@2.2.1: {}
 
   ohash@2.0.11: {}
 
@@ -6894,6 +6909,8 @@ snapshots:
 
   picomatch@4.0.4: {}
 
+  picomatch@4.0.7: {}
+
   pify@2.3.0: {}
 
   pinia@2.3.0(typescript@5.7.3)(vue@3.5.13(typescript@5.7.3)):
@@ -7347,7 +7364,7 @@ snapshots:
     transitivePeerDependencies:
       - supports-color
 
-  std-env@4.1.0: {}
+  std-env@4.2.0: {}
 
   stream-combiner@0.0.4:
     dependencies:
@@ -7500,16 +7517,16 @@ snapshots:
 
   tinybench@2.9.0: {}
 
-  tinyexec@1.2.4: {}
+  tinyexec@1.3.1: {}
 
   tinyglobby@0.2.17:
     dependencies:
-      fdir: 6.5.0(picomatch@4.0.4)
-      picomatch: 4.0.4
+      fdir: 6.5.0(picomatch@4.0.7)
+      picomatch: 4.0.7
 
   tinyqueue@2.0.3: {}
 
-  tinyrainbow@3.1.0: {}
+  tinyrainbow@3.1.1: {}
 
   tippy.js@6.3.7:
     dependencies:
@@ -7629,26 +7646,26 @@ snapshots:
       stylus: 0.57.0
       yaml: 2.9.0
 
-  vitest@4.1.0(@types/node@25.8.0)(jsdom@29.0.1)(vite@6.4.3(@types/node@25.8.0)(jiti@1.21.7)(sass@1.99.0)(stylus@0.57.0)(yaml@2.9.0)):
+  vitest@4.1.11(@types/node@25.8.0)(jsdom@29.0.1)(vite@6.4.3(@types/node@25.8.0)(jiti@1.21.7)(sass@1.99.0)(stylus@0.57.0)(yaml@2.9.0)):
     dependencies:
-      '@vitest/expect': 4.1.0
-      '@vitest/mocker': 4.1.0(vite@6.4.3(@types/node@25.8.0)(jiti@1.21.7)(sass@1.99.0)(stylus@0.57.0)(yaml@2.9.0))
-      '@vitest/pretty-format': 4.1.0
-      '@vitest/runner': 4.1.0
-      '@vitest/snapshot': 4.1.0
-      '@vitest/spy': 4.1.0
-      '@vitest/utils': 4.1.0
-      es-module-lexer: 2.1.0
-      expect-type: 1.3.0
+      '@vitest/expect': 4.1.11
+      '@vitest/mocker': 4.1.11(vite@6.4.3(@types/node@25.8.0)(jiti@1.21.7)(sass@1.99.0)(stylus@0.57.0)(yaml@2.9.0))
+      '@vitest/pretty-format': 4.1.11
+      '@vitest/runner': 4.1.11
+      '@vitest/snapshot': 4.1.11
+      '@vitest/spy': 4.1.11
+      '@vitest/utils': 4.1.11
+      es-module-lexer: 2.3.2
+      expect-type: 1.4.0
       magic-string: 0.30.21
-      obug: 2.1.1
+      obug: 2.2.1
       pathe: 2.0.3
-      picomatch: 4.0.4
-      std-env: 4.1.0
+      picomatch: 4.0.7
+      std-env: 4.2.0
       tinybench: 2.9.0
-      tinyexec: 1.2.4
+      tinyexec: 1.3.1
       tinyglobby: 0.2.17
-      tinyrainbow: 3.1.0
+      tinyrainbow: 3.1.1
       vite: 6.4.3(@types/node@25.8.0)(jiti@1.21.7)(sass@1.99.0)(stylus@0.57.0)(yaml@2.9.0)
       why-is-node-running: 2.3.0
     optionalDependencies:

From 852dbfe7e1fa1f206576333429b68de8119406dd Mon Sep 17 00:00:00 2001
From: Stanislaw <56738034+anvme@users.noreply.github.com>
Date: Mon, 14 Sep 2026 15:02:59 +0200
Subject: [PATCH 052/178] fix: truncate CSAT feedback by runes to preserve
 valid UTF-8

Feedback was sliced by bytes at maxCsatFeedbackLength, which could split a
multibyte character and produce invalid UTF-8. Postgres then rejects the row
and the entire submission fails, losing the rating too. Truncate by runes.
---
 cmd/csat.go | 26 +++++++++++++++++++-------
 1 file changed, 19 insertions(+), 7 deletions(-)

diff --git a/cmd/csat.go b/cmd/csat.go
index 5efe3fab..ac434034 100644
--- a/cmd/csat.go
+++ b/cmd/csat.go
@@ -152,10 +152,9 @@ func handleSubmitCSATResponse(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, "Invalid UUID", nil, envelope.InputError)
 	}
 
-	// Trim feedback if it exceeds max length.
-	if len(req.Feedback) > maxCsatFeedbackLength {
-		req.Feedback = req.Feedback[:maxCsatFeedbackLength]
-	}
+	// Trim feedback if it exceeds max length. Truncate by runes so a
+	// multibyte UTF-8 character is never split into invalid bytes.
+	req.Feedback = truncateFeedback(req.Feedback)
 
 	// Update CSAT response
 	if err := app.csat.UpdateResponse(uuid, req.Rating, req.Feedback, nil); err != nil {
@@ -187,9 +186,7 @@ func validateCSATForm(r *fastglue.Request) (int, string, json.RawMessage, string
 		return 0, "", nil, "csat.pleaseFillRequired"
 	}
 
-	if len(feedback) > maxCsatFeedbackLength {
-		feedback = feedback[:maxCsatFeedbackLength]
-	}
+	feedback = truncateFeedback(feedback)
 
 	// Collect extra form fields into meta, skipping the known fields.
 	meta := make(map[string]string)
@@ -220,3 +217,18 @@ func validateCSATForm(r *fastglue.Request) (int, string, json.RawMessage, string
 
 	return rating, feedback, metaJSON, ""
 }
+
+// truncateFeedback caps feedback at maxCsatFeedbackLength runes. Truncating by
+// runes rather than bytes avoids splitting a multibyte UTF-8 character, which
+// would otherwise produce invalid UTF-8 that the database rejects, failing the
+// whole submission (including the rating).
+func truncateFeedback(s string) string {
+	if len(s) <= maxCsatFeedbackLength {
+		return s
+	}
+	r := []rune(s)
+	if len(r) <= maxCsatFeedbackLength {
+		return s
+	}
+	return string(r[:maxCsatFeedbackLength])
+}

From cdfe81155f64fb4d0878fc3b0682747942e26cf3 Mon Sep 17 00:00:00 2001
From: Stanislaw <56738034+anvme@users.noreply.github.com>
Date: Mon, 14 Sep 2026 15:02:59 +0200
Subject: [PATCH 053/178] fix: don't render raw driver errors on CSAT submit

handleUpdateCSATResponse rendered err.Error() directly, so submitting a form
to a malformed UUID leaked the raw Postgres error to the page. Show a generic
message and only surface known envelope.Error messages.
---
 cmd/csat.go | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/cmd/csat.go b/cmd/csat.go
index 5efe3fab..24108e19 100644
--- a/cmd/csat.go
+++ b/cmd/csat.go
@@ -86,9 +86,15 @@ func handleUpdateCSATResponse(r *fastglue.Request) error {
 	}
 
 	if err := app.csat.UpdateResponse(uuid, rating, feedback, metaJSON); err != nil {
+		// Surface only known, user-safe messages; never leak raw driver errors
+		// (e.g. a malformed UUID triggers a Postgres syntax error string).
+		msg := app.i18n.T("globals.messages.somethingWentWrong")
+		if e, ok := err.(envelope.Error); ok {
+			msg = e.Error()
+		}
 		return app.tmpl.RenderWebPage(r.RequestCtx, "error", map[string]interface{}{
 			"Data": map[string]interface{}{
-				"ErrorMessage": err.Error(),
+				"ErrorMessage": msg,
 			},
 		})
 	}

From 7388ab9c65d6fb6e0eff97547b409cfff8df420e Mon Sep 17 00:00:00 2001
From: Stanislaw <56738034+anvme@users.noreply.github.com>
Date: Mon, 14 Sep 2026 15:03:17 +0200
Subject: [PATCH 054/178] fix: prevent duplicate CSAT submissions under
 concurrency

The pre-check on response_timestamp was a read-then-write race: concurrent
submits all passed it and all wrote. Guard the UPDATE with
response_timestamp IS NULL and treat a zero-row update as already submitted.
---
 internal/csat/csat.go     | 7 ++++++-
 internal/csat/queries.sql | 2 +-
 2 files changed, 7 insertions(+), 2 deletions(-)

diff --git a/internal/csat/csat.go b/internal/csat/csat.go
index 34a8e6bf..0d0c01a9 100644
--- a/internal/csat/csat.go
+++ b/internal/csat/csat.go
@@ -106,11 +106,16 @@ func (m *Manager) UpdateResponse(uuid string, score int, feedback string, meta j
 		meta = json.RawMessage(`{}`)
 	}
 
-	_, err = m.q.Update.Exec(uuid, score, feedback, meta)
+	res, err := m.q.Update.Exec(uuid, score, feedback, meta)
 	if err != nil {
 		m.lo.Error("error updating CSAT", "error", err)
 		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
+	// The UPDATE is guarded by response_timestamp IS NULL, so a concurrent
+	// request that already recorded a response updates zero rows here.
+	if n, _ := res.RowsAffected(); n == 0 {
+		return envelope.NewError(envelope.InputError, m.i18n.T("csat.alreadySubmitted"), nil)
+	}
 	return nil
 }
 
diff --git a/internal/csat/queries.sql b/internal/csat/queries.sql
index faa2a6cd..b8e68d65 100644
--- a/internal/csat/queries.sql
+++ b/internal/csat/queries.sql
@@ -23,4 +23,4 @@ SET rating = $2,
     feedback = $3,
     meta = COALESCE($4::jsonb, '{}'),
     response_timestamp = NOW()
-WHERE uuid = $1;
+WHERE uuid = $1 AND response_timestamp IS NULL;

From a870722c539cafbd17f9a1e13b5486e4596e0835 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Mon, 14 Sep 2026 18:35:55 +0530
Subject: [PATCH 055/178] use ladders for priority market

---
 .../{PriorityDot.vue => PriorityMarker.vue}   | 24 +++++++--------
 .../list/ConversationListItem.vue             |  4 +--
 .../components/icons/PriorityIcon.vue         | 30 +++++++++++++++++++
 3 files changed, 44 insertions(+), 14 deletions(-)
 rename frontend/apps/main/src/features/conversation/{PriorityDot.vue => PriorityMarker.vue} (56%)
 create mode 100644 frontend/shared-ui/components/icons/PriorityIcon.vue

diff --git a/frontend/apps/main/src/features/conversation/PriorityDot.vue b/frontend/apps/main/src/features/conversation/PriorityMarker.vue
similarity index 56%
rename from frontend/apps/main/src/features/conversation/PriorityDot.vue
rename to frontend/apps/main/src/features/conversation/PriorityMarker.vue
index 1bc0dfd2..e24ec6be 100644
--- a/frontend/apps/main/src/features/conversation/PriorityDot.vue
+++ b/frontend/apps/main/src/features/conversation/PriorityMarker.vue
@@ -1,9 +1,11 @@
 <template>
   <Tooltip v-if="priorityName">
     <TooltipTrigger asChild>
-      <span
-        class="h-2 w-2 rounded-full flex-shrink-0"
-        :class="dotClass"
+      <PriorityIcon
+        :level="marker.level"
+        :size="13"
+        class="flex-shrink-0"
+        :class="marker.class"
         role="img"
         :aria-label="priorityLabel"
       />
@@ -14,16 +16,16 @@
 
 <script setup>
 import { computed } from 'vue'
+import PriorityIcon from '@shared-ui/components/icons/PriorityIcon.vue'
 import { Tooltip, TooltipContent, TooltipTrigger } from '@shared-ui/components/ui/tooltip'
 import { useI18n } from 'vue-i18n'
 
-// Priorities are seeded rows (Low, Medium, High) and are not translated, so match on the
-// name and keep anything unrecognised neutral rather than inventing a colour for it.
-const PRIORITY_DOT_CLASSES = {
-  low: 'bg-muted-foreground',
-  medium: 'bg-warning-600',
-  high: 'bg-destructive'
+const PRIORITY_MARKERS = {
+  low: { level: 1, class: 'text-muted-foreground' },
+  medium: { level: 2, class: 'text-warning-600' },
+  high: { level: 3, class: 'text-destructive' }
 }
+const UNKNOWN_MARKER = { level: 0, class: 'text-muted-foreground' }
 
 const props = defineProps({
   priority: {
@@ -36,9 +38,7 @@ const { t } = useI18n()
 
 const priorityName = computed(() => (props.priority || '').trim())
 
-const dotClass = computed(
-  () => PRIORITY_DOT_CLASSES[priorityName.value.toLowerCase()] || 'bg-muted-foreground'
-)
+const marker = computed(() => PRIORITY_MARKERS[priorityName.value.toLowerCase()] || UNKNOWN_MARKER)
 
 const priorityLabel = computed(() => `${t('globals.terms.priority', 1)}: ${priorityName.value}`)
 </script>
diff --git a/frontend/apps/main/src/features/conversation/list/ConversationListItem.vue b/frontend/apps/main/src/features/conversation/list/ConversationListItem.vue
index 8cc11add..f1c9e50a 100644
--- a/frontend/apps/main/src/features/conversation/list/ConversationListItem.vue
+++ b/frontend/apps/main/src/features/conversation/list/ConversationListItem.vue
@@ -60,7 +60,7 @@
                   <TooltipContent>{{ contactFullName }}</TooltipContent>
                 </Tooltip>
                 <div class="flex items-center gap-1 flex-shrink-0">
-                  <PriorityDot :priority="conversation.priority" />
+                  <PriorityMarker :priority="conversation.priority" />
                   <Tooltip>
                     <TooltipTrigger asChild>
                       <component
@@ -177,7 +177,7 @@ import {
   ContextMenuTrigger
 } from '@shared-ui/components/ui/context-menu'
 import SlaBadge from '@main/features/sla/SlaBadge.vue'
-import PriorityDot from '@main/features/conversation/PriorityDot.vue'
+import PriorityMarker from '@main/features/conversation/PriorityMarker.vue'
 import { Tooltip, TooltipContent, TooltipTrigger } from '@shared-ui/components/ui/tooltip'
 import { Checkbox } from '@shared-ui/components/ui/checkbox'
 import { useConversationStore } from '@main/stores/conversation'
diff --git a/frontend/shared-ui/components/icons/PriorityIcon.vue b/frontend/shared-ui/components/icons/PriorityIcon.vue
new file mode 100644
index 00000000..b73a6efa
--- /dev/null
+++ b/frontend/shared-ui/components/icons/PriorityIcon.vue
@@ -0,0 +1,30 @@
+<template>
+  <svg :width="size" :height="size" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg">
+    <template v-if="level">
+      <rect
+        v-for="bar in 3"
+        :key="bar"
+        :x="1 + (bar - 1) * 5"
+        :y="14 - bar * 4"
+        width="3"
+        :height="bar * 4"
+        rx="0.8"
+        :class="bar <= level ? 'fill-current' : 'fill-border'"
+      />
+    </template>
+    <circle v-else cx="8" cy="8" r="6.5" fill="none" stroke="currentColor" stroke-width="1.5" />
+  </svg>
+</template>
+
+<script setup>
+defineProps({
+  level: {
+    type: Number,
+    default: 0
+  },
+  size: {
+    type: [Number, String],
+    default: 16
+  }
+})
+</script>

From 6487b6b2429b3d7268a9b79fd3d14ad57d2a506b Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Mon, 14 Sep 2026 18:47:46 +0530
Subject: [PATCH 056/178] remove over-explanatory CSAT comments

---
 cmd/csat.go | 6 ------
 1 file changed, 6 deletions(-)

diff --git a/cmd/csat.go b/cmd/csat.go
index ac434034..9655ad2a 100644
--- a/cmd/csat.go
+++ b/cmd/csat.go
@@ -152,8 +152,6 @@ func handleSubmitCSATResponse(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, "Invalid UUID", nil, envelope.InputError)
 	}
 
-	// Trim feedback if it exceeds max length. Truncate by runes so a
-	// multibyte UTF-8 character is never split into invalid bytes.
 	req.Feedback = truncateFeedback(req.Feedback)
 
 	// Update CSAT response
@@ -218,10 +216,6 @@ func validateCSATForm(r *fastglue.Request) (int, string, json.RawMessage, string
 	return rating, feedback, metaJSON, ""
 }
 
-// truncateFeedback caps feedback at maxCsatFeedbackLength runes. Truncating by
-// runes rather than bytes avoids splitting a multibyte UTF-8 character, which
-// would otherwise produce invalid UTF-8 that the database rejects, failing the
-// whole submission (including the rating).
 func truncateFeedback(s string) string {
 	if len(s) <= maxCsatFeedbackLength {
 		return s

From d8041240c81e6849b586990a6a16394c6cd8375e Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 15 Sep 2026 00:16:03 +0530
Subject: [PATCH 057/178] apply email light canvas only for email channel
 conversations

---
 .../src/features/conversation/message/MessageBubble.vue     | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
index 9c8e6369..c33252fe 100644
--- a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
+++ b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
@@ -105,11 +105,13 @@
               >
                 {{ sanitizedContent }}
               </div>
-main.scss              <div
+              <div
                 v-else
                 ref="messageContentEl"
                 @click="onMessageContentClick"
-                :class="{ 'email-light-canvas': !isOutgoing }"
+                :class="{
+                  'email-light-canvas': !isOutgoing && convStore.current?.inbox_channel === 'email'
+                }"
               >
                 <Letter
                   :html="sanitizedContent"

From ced1a8bee519615819a18d202984b223df4020e6 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 15 Sep 2026 12:31:27 +0530
Subject: [PATCH 058/178] add per-agent notification preferences and browser
 push

---
 cmd/chat.go                                   |   2 +-
 cmd/handlers.go                               |  27 +
 cmd/init.go                                   |  60 ++-
 cmd/main.go                                   |  16 +-
 cmd/pwa_test.go                               |  51 ++
 cmd/settings.go                               |   4 +
 cmd/user_notifications.go                     |  66 +++
 frontend/apps/main/index.html                 |   5 +-
 frontend/apps/main/src/App.vue                |  10 +-
 frontend/apps/main/src/api/index.js           |   8 +
 .../components/editor/suggestionRenderer.js   |   2 +-
 .../editor/suggestionRenderer.test.js         |  12 +
 .../components/sidebar/NotificationPanel.vue  |  34 +-
 .../src/components/sidebar/SidebarNavUser.vue |   6 +-
 .../apps/main/src/composables/useLogout.js    |  10 +
 .../main/src/composables/useLogout.test.js    |  23 +
 .../src/composables/usePushNotifications.js   |  82 +++
 .../composables/usePushNotifications.test.js  | 140 +++++
 frontend/apps/main/src/constants/navIcons.js  |   2 +
 .../apps/main/src/constants/navigation.js     |   6 +
 .../features/admin/templates/TemplateForm.vue |  22 +-
 .../src/features/admin/templates/defaults.js  | 158 ++++++
 .../command/providers/useAccountCommands.js   |   8 +-
 frontend/apps/main/src/router/index.js        |   7 +
 .../NotificationPreferences.test.js           |  72 +++
 .../notifications/NotificationPreferences.vue | 168 ++++++
 .../cypress/e2e/ui/pwaNotifications.cy.js     |  18 +
 frontend/public/images/pwa-icon-192.png       | Bin 0 -> 5475 bytes
 frontend/public/images/pwa-icon-512.png       | Bin 0 -> 23465 bytes
 frontend/public/manifest.webmanifest          |  22 +
 frontend/public/sw.js                         |  34 ++
 go.mod                                        |   1 +
 go.sum                                        |  36 ++
 i18n/en-US.json                               |  25 +
 internal/conversation/conversation.go         | 499 ++++++++++++++----
 .../conversation/conversation_reference.go    |  14 +-
 .../conversation_reference_test.go            |  21 +-
 internal/conversation/message.go              |  16 +-
 internal/conversation/notification_test.go    | 428 +++++++++++++++
 internal/conversation/queries.sql             |  17 +
 internal/httputil/httputil.go                 |   2 +-
 internal/httputil/httputil_test.go            |  28 +
 internal/migrations/v2.9.0.go                 | 195 ++++++-
 internal/migrations/v2.9.0_test.go            | 113 ++++
 internal/notification/channels/email.go       |  45 ++
 internal/notification/channels/email_test.go  |  63 +++
 internal/notification/channels/in_app.go      |  62 +++
 internal/notification/channels/push.go        |  46 ++
 internal/notification/channels/types.go       |  67 +++
 internal/notification/dispatcher.go           | 168 +-----
 internal/notification/dispatcher_test.go      | 140 +++++
 internal/notification/email_queue.go          | 193 +++++++
 internal/notification/email_queue_test.go     | 392 ++++++++++++++
 internal/notification/models/models.go        | 114 +++-
 internal/notification/models/models_test.go   |  24 +
 internal/notification/preferences.go          | 136 +++++
 internal/notification/preferences_test.go     |  97 ++++
 internal/notification/push.go                 | 325 ++++++++++++
 internal/notification/push_store_test.go      |  79 +++
 internal/notification/push_test.go            | 232 ++++++++
 internal/notification/queries.sql             |  82 +++
 internal/setting/setting.go                   |   3 +-
 internal/sla/queries.sql                      |   6 +
 internal/sla/sla.go                           |  64 ++-
 internal/sla/sla_test.go                      |  82 +++
 internal/template/render.go                   |  28 +-
 internal/template/render_test.go              |  68 +++
 schema.sql                                    | 120 ++++-
 68 files changed, 4754 insertions(+), 352 deletions(-)
 create mode 100644 cmd/pwa_test.go
 create mode 100644 frontend/apps/main/src/components/editor/suggestionRenderer.test.js
 create mode 100644 frontend/apps/main/src/composables/useLogout.js
 create mode 100644 frontend/apps/main/src/composables/useLogout.test.js
 create mode 100644 frontend/apps/main/src/composables/usePushNotifications.js
 create mode 100644 frontend/apps/main/src/composables/usePushNotifications.test.js
 create mode 100644 frontend/apps/main/src/features/admin/templates/defaults.js
 create mode 100644 frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js
 create mode 100644 frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
 create mode 100644 frontend/cypress/e2e/ui/pwaNotifications.cy.js
 create mode 100644 frontend/public/images/pwa-icon-192.png
 create mode 100644 frontend/public/images/pwa-icon-512.png
 create mode 100644 frontend/public/manifest.webmanifest
 create mode 100644 frontend/public/sw.js
 create mode 100644 internal/conversation/notification_test.go
 create mode 100644 internal/httputil/httputil_test.go
 create mode 100644 internal/notification/channels/email.go
 create mode 100644 internal/notification/channels/email_test.go
 create mode 100644 internal/notification/channels/in_app.go
 create mode 100644 internal/notification/channels/push.go
 create mode 100644 internal/notification/channels/types.go
 create mode 100644 internal/notification/dispatcher_test.go
 create mode 100644 internal/notification/email_queue.go
 create mode 100644 internal/notification/email_queue_test.go
 create mode 100644 internal/notification/models/models_test.go
 create mode 100644 internal/notification/preferences.go
 create mode 100644 internal/notification/preferences_test.go
 create mode 100644 internal/notification/push.go
 create mode 100644 internal/notification/push_store_test.go
 create mode 100644 internal/notification/push_test.go
 create mode 100644 internal/template/render_test.go

diff --git a/cmd/chat.go b/cmd/chat.go
index 113a0dd0..91a0eb79 100644
--- a/cmd/chat.go
+++ b/cmd/chat.go
@@ -283,7 +283,7 @@ func handleChatInit(r *fastglue.Request) error {
 	}
 
 	// Process post-message hooks for the new conversation and initial message.
-	if err := app.conversation.ProcessIncomingMessageHooks(conversationUUID, true); err != nil {
+	if err := app.conversation.ProcessIncomingMessageHooks(message, true); err != nil {
 		app.lo.Error("error processing incoming message hooks for initial message", "conversation_uuid", conversationUUID, "error", err)
 	}
 
diff --git a/cmd/handlers.go b/cmd/handlers.go
index 4a31cf9a..bd2fdc1e 100644
--- a/cmd/handlers.go
+++ b/cmd/handlers.go
@@ -353,6 +353,10 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 	g.PUT("/api/v1/notifications/read-all", auth(handleMarkAllNotificationsAsRead))
 	g.DELETE("/api/v1/notifications/{id}", auth(handleDeleteNotification))
 	g.DELETE("/api/v1/notifications", auth(handleDeleteAllNotifications))
+	g.GET("/api/v1/notifications/preferences", auth(handleGetNotificationPreferences))
+	g.PUT("/api/v1/notifications/preferences", auth(handleUpdateNotificationPreferences))
+	g.POST("/api/v1/notifications/push-subscriptions", auth(handleCreatePushSubscription))
+	g.DELETE("/api/v1/notifications/push-subscriptions", auth(handleDeletePushSubscription))
 
 	// WebSocket.
 	g.GET("/ws", auth(func(r *fastglue.Request) error {
@@ -399,6 +403,8 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 	g.GET("/assets/{all:*}", serveFrontendStaticFiles)
 	g.GET("/widget/assets/{all:*}", serveWidgetStaticFiles)
 	g.GET("/images/{all:*}", serveFrontendStaticFiles)
+	g.GET("/manifest.webmanifest", serveManifest)
+	g.GET("/sw.js", serveServiceWorker)
 	g.GET("/static/public/{all:*}", serveStaticFiles)
 
 	// Public pages.
@@ -518,6 +524,27 @@ func serveFrontendStaticFiles(r *fastglue.Request) error {
 	return nil
 }
 
+func serveManifest(r *fastglue.Request) error {
+	return serveMainFrontendFile(r, "manifest.webmanifest", "application/manifest+json", "no-cache")
+}
+
+func serveServiceWorker(r *fastglue.Request) error {
+	r.RequestCtx.Response.Header.Set("Service-Worker-Allowed", "/")
+	return serveMainFrontendFile(r, "sw.js", "application/javascript", "no-cache")
+}
+
+func serveMainFrontendFile(r *fastglue.Request, name, contentType, cacheControl string) error {
+	app := r.Context.(*App)
+	file, err := app.fs.Get(filepath.Join(frontendDir, name))
+	if err != nil {
+		return r.SendErrorEnvelope(http.StatusNotFound, app.i18n.T("validation.notFoundFile"), nil, envelope.NotFoundError)
+	}
+	r.RequestCtx.Response.Header.Set("Content-Type", contentType)
+	r.RequestCtx.Response.Header.Set("Cache-Control", cacheControl)
+	r.RequestCtx.SetBody(file.ReadBytes())
+	return nil
+}
+
 // serveWidgetStaticFiles serves widget static assets from the embedded filesystem.
 func serveWidgetStaticFiles(r *fastglue.Request) error {
 	app := r.Context.(*App)
diff --git a/cmd/init.go b/cmd/init.go
index 9a91ce96..612f0a6e 100644
--- a/cmd/init.go
+++ b/cmd/init.go
@@ -39,6 +39,7 @@ import (
 	fs "github.com/abhinavxd/libredesk/internal/media/stores/localfs"
 	"github.com/abhinavxd/libredesk/internal/media/stores/s3"
 	notifier "github.com/abhinavxd/libredesk/internal/notification"
+	notificationchannels "github.com/abhinavxd/libredesk/internal/notification/channels"
 	emailnotifier "github.com/abhinavxd/libredesk/internal/notification/providers/email"
 	"github.com/abhinavxd/libredesk/internal/oidc"
 	"github.com/abhinavxd/libredesk/internal/ratelimit"
@@ -301,6 +302,7 @@ func initConversations(
 	template *tmpl.Manager,
 	webhook *webhook.Manager,
 	dispatcher *notifier.Dispatcher,
+	rdb *redis.Client,
 ) *conversation.Manager {
 	continuityConfig := &conversation.ContinuityConfig{}
 	if ko.Exists("conversation.continuity_scan_interval") {
@@ -309,6 +311,7 @@ func initConversations(
 
 	c, err := conversation.New(hub, i18n, sla, status, priority, inboxStore, userStore, teamStore, mediaStore, settings, csat, automationEngine, template, webhook, dispatcher, conversation.Opts{
 		DB:                       db,
+		Redis:                    rdb,
 		Lo:                       initLogger("conversation_manager"),
 		OutgoingMessageQueueSize: ko.MustInt("message.outgoing_queue_size"),
 		IncomingMessageQueueSize: ko.MustInt("message.incoming_queue_size"),
@@ -1163,6 +1166,19 @@ func initUserNotification(db *sqlx.DB, i18n *i18n.I18n) *notifier.UserNotificati
 	return m
 }
 
+// initNotificationPreference inits the notification preference manager.
+func initNotificationPreference(db *sqlx.DB, i18n *i18n.I18n) *notifier.PreferenceManager {
+	m, err := notifier.NewPreferenceManager(notifier.PreferenceManagerOpts{
+		DB:   db,
+		Lo:   initLogger("notification-preference"),
+		I18n: i18n,
+	})
+	if err != nil {
+		log.Fatalf("error initializing notification preference manager: %v", err)
+	}
+	return m
+}
+
 // initImporter inits the importer manager.
 func initImporter(i18n *i18n.I18n) *importer.Importer {
 	return importer.New(importer.Opts{
@@ -1171,14 +1187,46 @@ func initImporter(i18n *i18n.I18n) *importer.Importer {
 	})
 }
 
+func initNotificationEmailQueue(db *sqlx.DB, outbound *notifier.Service) *notifier.EmailQueue {
+	q, err := notifier.NewEmailQueue(notifier.EmailQueueOpts{
+		DB:       db,
+		Outbound: outbound,
+		Lo:       initLogger("notification-email-queue"),
+	})
+	if err != nil {
+		log.Fatalf("error initializing notification email queue: %v", err)
+	}
+	return q
+}
+
+func initPushNotification(db *sqlx.DB, settings *setting.Manager, i18n *i18n.I18n) *notifier.PushManager {
+	m, err := notifier.NewPushManager(notifier.PushManagerOpts{
+		DB:          db,
+		Settings:    settings,
+		Lo:          initLogger("push-notification"),
+		I18n:        i18n,
+		RootURL:     ko.String("app.root_url"),
+		Concurrency: ko.MustInt("notification.concurrency"),
+		QueueSize:   ko.MustInt("notification.queue_size"),
+	})
+	if err != nil {
+		log.Fatalf("error initializing push notification manager: %v", err)
+	}
+	return m
+}
+
 // initNotifDispatcher initializes the notification dispatcher.
-func initNotifDispatcher(userNotification *notifier.UserNotificationManager, outbound *notifier.Service, wsHub *ws.Hub, emailEnabled bool) *notifier.Dispatcher {
+func initNotifDispatcher(userNotification *notifier.UserNotificationManager, prefs *notifier.PreferenceManager, push *notifier.PushManager, emailQueue *notifier.EmailQueue, wsHub *ws.Hub, emailEnabled bool) *notifier.Dispatcher {
+	providers := []notificationchannels.Provider{
+		notificationchannels.NewInApp(userNotification, wsHub, initLogger("notification-in-app")),
+	}
+	if emailEnabled {
+		providers = append(providers, notificationchannels.NewEmail(emailQueue))
+	}
+	providers = append(providers, notificationchannels.NewPush(push))
 	return notifier.NewDispatcher(notifier.DispatcherOpts{
-		InApp:        userNotification,
-		Outbound:     outbound,
-		WSHub:        wsHub,
-		EmailEnabled: emailEnabled,
-		Lo:           initLogger("notification-dispatcher"),
+		Pipeline: notificationchannels.NewPipeline(providers...),
+		Prefs:    prefs,
 	})
 }
 
diff --git a/cmd/main.go b/cmd/main.go
index 41db7ef6..f76ae697 100644
--- a/cmd/main.go
+++ b/cmd/main.go
@@ -126,6 +126,8 @@ type App struct {
 	activityLog      *activitylog.Manager
 	notifier         *notifier.Service
 	userNotification *notifier.UserNotificationManager
+	notificationPref *notifier.PreferenceManager
+	pushNotification *notifier.PushManager
 	customAttribute  *customAttribute.Manager
 	report           *report.Manager
 	webhook          *webhook.Manager
@@ -249,11 +251,14 @@ func main() {
 		wsHub                       = initWS(user)
 		notifier                    = initNotifier()
 		userNotification            = initUserNotification(db, i18n)
-		notifDispatcher             = initNotifDispatcher(userNotification, notifier, wsHub, ko.Bool("notification.email.enabled"))
+		notificationPreference      = initNotificationPreference(db, i18n)
+		pushNotification            = initPushNotification(db, settings, i18n)
+		notificationEmailQueue      = initNotificationEmailQueue(db, notifier)
+		notifDispatcher             = initNotifDispatcher(userNotification, notificationPreference, pushNotification, notificationEmailQueue, wsHub, ko.Bool("notification.email.enabled"))
 		automation                  = initAutomationEngine(db, i18n)
 		ai                          = initAI(ctx, db, i18n, ssrfControl)
 		sla                         = initSLA(db, team, settings, businessHours, template, user, i18n, notifDispatcher)
-		conversation                = initConversations(i18n, sla, status, priority, wsHub, db, inbox, user, team, media, settings, csat, automation, template, webhook, notifDispatcher)
+		conversation                = initConversations(i18n, sla, status, priority, wsHub, db, inbox, user, team, media, settings, csat, automation, template, webhook, notifDispatcher, rdb)
 		aiAgent                     = initAIAgent(db, i18n, ai, conversation, media, settings, user, notifier, rdb)
 		helpCenter                  = initHelpCenter(db, i18n, ai)
 		autoassigner                = initAutoAssigner(team, user, conversation)
@@ -261,6 +266,7 @@ func main() {
 	)
 
 	wsHub.SetConversationStore(conversation)
+	notificationEmailQueue.SetConversationStore(conversation)
 	automation.SetConversationStore(conversation)
 	systemUser, err := user.GetSystemUser()
 	if err != nil {
@@ -285,6 +291,10 @@ func main() {
 	go conversation.RunDraftCleaner(ctx, draftRetentionDuration)
 	go userNotification.RunNotificationCleaner(ctx)
 	go helpCenter.RunSearchLogCleaner(ctx)
+	if ko.Bool("notification.email.enabled") {
+		go notificationEmailQueue.Run(ctx)
+	}
+	go pushNotification.Run(ctx)
 	go aiAgent.Run(ctx, cmp.Or(ko.Int("ai_agent.worker_count"), 10))
 	go ai.Run(ctx)
 
@@ -329,6 +339,8 @@ func main() {
 		redis:            rdb,
 		fc:               initFastCache(rdb),
 		userNotification: userNotification,
+		notificationPref: notificationPreference,
+		pushNotification: pushNotification,
 		wsHub:            wsHub,
 	}
 	app.consts.Store(constants)
diff --git a/cmd/pwa_test.go b/cmd/pwa_test.go
new file mode 100644
index 00000000..65c1c7f9
--- /dev/null
+++ b/cmd/pwa_test.go
@@ -0,0 +1,51 @@
+package main
+
+import (
+	"strings"
+	"testing"
+
+	"github.com/knadh/stuffbin"
+	"github.com/valyala/fasthttp"
+	"github.com/zerodha/fastglue"
+)
+
+func TestServePWAFiles(t *testing.T) {
+	fs, err := stuffbin.NewLocalFS("/",
+		"../frontend/public/manifest.webmanifest:frontend/dist/main/manifest.webmanifest",
+		"../frontend/public/sw.js:frontend/dist/main/sw.js",
+	)
+	if err != nil {
+		t.Fatalf("creating test filesystem: %v", err)
+	}
+
+	tests := []struct {
+		name                 string
+		handler              fastglue.FastRequestHandler
+		contentType          string
+		wantServiceWorkerHdr bool
+	}{
+		{"manifest", serveManifest, "application/manifest+json", false},
+		{"service worker", serveServiceWorker, "application/javascript", true},
+	}
+	for _, tc := range tests {
+		t.Run(tc.name, func(t *testing.T) {
+			ctx := &fasthttp.RequestCtx{}
+			req := &fastglue.Request{RequestCtx: ctx, Context: &App{fs: fs}}
+			if err := tc.handler(req); err != nil {
+				t.Fatalf("serving file: %v", err)
+			}
+			if got := string(ctx.Response.Header.ContentType()); got != tc.contentType {
+				t.Errorf("content type = %q, want %q", got, tc.contentType)
+			}
+			if got := string(ctx.Response.Header.Peek("Cache-Control")); got != "no-cache" {
+				t.Errorf("cache control = %q, want no-cache", got)
+			}
+			if tc.wantServiceWorkerHdr && string(ctx.Response.Header.Peek("Service-Worker-Allowed")) != "/" {
+				t.Error("service worker scope header is missing")
+			}
+			if strings.TrimSpace(string(ctx.Response.Body())) == "" {
+				t.Error("response body is empty")
+			}
+		})
+	}
+}
diff --git a/cmd/settings.go b/cmd/settings.go
index 6cb48c8f..4f09c9ab 100644
--- a/cmd/settings.go
+++ b/cmd/settings.go
@@ -6,6 +6,7 @@ import (
 	"strings"
 
 	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/abhinavxd/libredesk/internal/httputil"
 	"github.com/abhinavxd/libredesk/internal/setting/models"
 	"github.com/abhinavxd/libredesk/internal/stringutil"
 	"github.com/valyala/fasthttp"
@@ -57,6 +58,9 @@ func handleUpdateGeneralSettings(r *fastglue.Request) error {
 	}
 	// Trim whitespace and trailing slash from root URL.
 	req.RootURL = strings.TrimRight(strings.TrimSpace(req.RootURL), "/")
+	if !httputil.IsValidHTTPURL(req.RootURL) {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("admin.general.rootURL.valid"), nil, envelope.InputError)
+	}
 
 	// Get current language before update.
 	app.Lock()
diff --git a/cmd/user_notifications.go b/cmd/user_notifications.go
index caadb242..f086d85f 100644
--- a/cmd/user_notifications.go
+++ b/cmd/user_notifications.go
@@ -5,6 +5,8 @@ import (
 
 	amodels "github.com/abhinavxd/libredesk/internal/auth/models"
 	"github.com/abhinavxd/libredesk/internal/envelope"
+	notifier "github.com/abhinavxd/libredesk/internal/notification"
+	nmodels "github.com/abhinavxd/libredesk/internal/notification/models"
 	"github.com/valyala/fasthttp"
 	"github.com/zerodha/fastglue"
 )
@@ -97,3 +99,67 @@ func handleDeleteAllNotifications(r *fastglue.Request) error {
 	}
 	return r.SendEnvelope(true)
 }
+
+func handleGetNotificationPreferences(r *fastglue.Request) error {
+	var (
+		app   = r.Context.(*App)
+		auser = r.RequestCtx.UserValue("user").(amodels.User)
+	)
+	prefs, err := app.notificationPref.GetMatrix(auser.ID)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(map[string]any{
+		"preferences":      prefs,
+		"email_enabled":    ko.Bool("notification.email.enabled"),
+		"vapid_public_key": app.pushNotification.PublicKey(),
+	})
+}
+
+func handleUpdateNotificationPreferences(r *fastglue.Request) error {
+	var (
+		app   = r.Context.(*App)
+		auser = r.RequestCtx.UserValue("user").(amodels.User)
+		prefs []nmodels.NotificationPreference
+	)
+	if err := r.Decode(&prefs, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest,
+			app.i18n.T("errors.parsingRequest"), nil, envelope.InputError)
+	}
+	if err := app.notificationPref.Update(auser.ID, prefs); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(true)
+}
+
+func handleCreatePushSubscription(r *fastglue.Request) error {
+	var (
+		app          = r.Context.(*App)
+		auser        = r.RequestCtx.UserValue("user").(amodels.User)
+		subscription notifier.PushSubscriptionInput
+	)
+	if err := r.Decode(&subscription, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("errors.parsingRequest"), nil, envelope.InputError)
+	}
+	if err := app.pushNotification.Upsert(auser.ID, subscription); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(true)
+}
+
+func handleDeletePushSubscription(r *fastglue.Request) error {
+	var (
+		app     = r.Context.(*App)
+		auser   = r.RequestCtx.UserValue("user").(amodels.User)
+		request struct {
+			Endpoint string `json:"endpoint"`
+		}
+	)
+	if err := r.Decode(&request, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("errors.parsingRequest"), nil, envelope.InputError)
+	}
+	if err := app.pushNotification.Delete(auser.ID, request.Endpoint); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(true)
+}
diff --git a/frontend/apps/main/index.html b/frontend/apps/main/index.html
index 781f17db..f4f773c6 100644
--- a/frontend/apps/main/index.html
+++ b/frontend/apps/main/index.html
@@ -5,6 +5,9 @@
   <meta charset="UTF-8" />
   <meta name="robots" content="noindex, nofollow" />
   <meta name="viewport" content="width=device-width, initial-scale=1, interactive-widget=resizes-content" />
+  <meta name="theme-color" content="hsl(152 39% 30%)" />
+  <link rel="manifest" href="/manifest.webmanifest" />
+  <link rel="apple-touch-icon" href="/images/pwa-icon-192.png" />
   <link rel="preload" href="/static/public/static/fonts/Geist-Variable.woff2" as="font" type="font/woff2" crossorigin>
   <link rel="stylesheet" href="/static/public/static/fonts.css">
 </head>
@@ -14,4 +17,4 @@
   <script type="module" src="/src/main.js"></script>
 </body>
 
-</html>
\ No newline at end of file
+</html>
diff --git a/frontend/apps/main/src/App.vue b/frontend/apps/main/src/App.vue
index e5d80238..c306a44f 100644
--- a/frontend/apps/main/src/App.vue
+++ b/frontend/apps/main/src/App.vue
@@ -122,6 +122,7 @@ import NotificationBell from '@main/components/sidebar/NotificationBell.vue'
 import PrimaryNavItems from '@main/components/sidebar/PrimaryNavItems.vue'
 import { useIsMobile } from '@shared-ui/composables'
 import api from '@main/api'
+import { usePushNotifications } from '@/composables/usePushNotifications'
 
 const route = useRoute()
 const emitter = useEmitter()
@@ -165,6 +166,7 @@ const openCreateConversationDialog = ref(false)
 const createConversationContact = ref(null)
 const { t } = useI18n()
 const notificationStore = useNotificationStore()
+const pushNotifications = usePushNotifications()
 
 // Update browser tab title with unread notification count.
 // Watch both unreadCount and route so the prefix is preserved after navigation.
@@ -214,10 +216,16 @@ const initStores = async () => {
     inboxStore.fetchInboxes(),
     slaStore.fetchSlas(),
     tagStore.fetchTags(),
-    customAttributeStore.fetchCustomAttributes()
+    customAttributeStore.fetchCustomAttributes(),
+    refreshPushSubscription()
   ])
 }
 
+const refreshPushSubscription = async () => {
+  const { data } = await api.getNotificationPreferences()
+  await pushNotifications.refresh(data.data.vapid_public_key)
+}
+
 const createView = () => {
   view.value = {}
   openCreateViewForm.value = true
diff --git a/frontend/apps/main/src/api/index.js b/frontend/apps/main/src/api/index.js
index 01e44525..bab5473b 100644
--- a/frontend/apps/main/src/api/index.js
+++ b/frontend/apps/main/src/api/index.js
@@ -623,6 +623,10 @@ const markNotificationAsRead = (id) => http.put(`/api/v1/notifications/${id}/rea
 const markAllNotificationsAsRead = () => http.put('/api/v1/notifications/read-all')
 const deleteNotification = (id) => http.delete(`/api/v1/notifications/${id}`)
 const deleteAllNotifications = () => http.delete('/api/v1/notifications')
+const getNotificationPreferences = () => http.get('/api/v1/notifications/preferences')
+const updateNotificationPreferences = (data) => http.put('/api/v1/notifications/preferences', data)
+const createPushSubscription = (data) => http.post('/api/v1/notifications/push-subscriptions', data)
+const deletePushSubscription = (endpoint) => http.delete('/api/v1/notifications/push-subscriptions', { data: { endpoint } })
 
 export default {
   login,
@@ -861,5 +865,9 @@ export default {
   markAllNotificationsAsRead,
   deleteNotification,
   deleteAllNotifications,
+  getNotificationPreferences,
+  updateNotificationPreferences,
+  createPushSubscription,
+  deletePushSubscription,
   getContactPageVisits
 }
diff --git a/frontend/apps/main/src/components/editor/suggestionRenderer.js b/frontend/apps/main/src/components/editor/suggestionRenderer.js
index e0db90dd..2c9647ae 100644
--- a/frontend/apps/main/src/components/editor/suggestionRenderer.js
+++ b/frontend/apps/main/src/components/editor/suggestionRenderer.js
@@ -35,7 +35,7 @@ export function createSuggestionRenderer(ListComponent) {
         if (popup) popup.style.display = 'none'
         return true
       }
-      return component.ref?.onKeyDown(props)
+      return component?.ref?.onKeyDown(props) ?? false
     },
 
     onExit: () => {
diff --git a/frontend/apps/main/src/components/editor/suggestionRenderer.test.js b/frontend/apps/main/src/components/editor/suggestionRenderer.test.js
new file mode 100644
index 00000000..3ba1649b
--- /dev/null
+++ b/frontend/apps/main/src/components/editor/suggestionRenderer.test.js
@@ -0,0 +1,12 @@
+import { describe, expect, it, vi } from 'vitest'
+import { createSuggestionRenderer } from './suggestionRenderer'
+
+vi.mock('@tiptap/vue-3', () => ({ VueRenderer: vi.fn() }))
+
+describe('createSuggestionRenderer', () => {
+  it('ignores key events before the suggestion list starts', () => {
+    const renderer = createSuggestionRenderer({})
+
+    expect(renderer.onKeyDown({ event: { key: 'Enter' } })).toBe(false)
+  })
+})
diff --git a/frontend/apps/main/src/components/sidebar/NotificationPanel.vue b/frontend/apps/main/src/components/sidebar/NotificationPanel.vue
index 8ea422dd..7087d6a2 100644
--- a/frontend/apps/main/src/components/sidebar/NotificationPanel.vue
+++ b/frontend/apps/main/src/components/sidebar/NotificationPanel.vue
@@ -62,9 +62,9 @@
           <div class="flex gap-2.5">
             <!-- Icon based on notification type -->
             <component
-              :is="getNotificationIcon(notification.notification_type)"
+              :is="getNotificationStyle(notification.notification_type).icon"
               class="flex-shrink-0 h-4 w-4 mt-0.5"
-              :class="getNotificationIconClass(notification.notification_type)"
+              :class="getNotificationStyle(notification.notification_type).class"
             />
 
             <!-- Content -->
@@ -134,6 +134,8 @@ import {
   Trash2,
   AtSign,
   UserPlus,
+  MessageSquare,
+  RotateCcw,
   AlertTriangle,
   AlertCircle
 } from 'lucide-vue-next'
@@ -149,24 +151,22 @@ const { t } = useI18n()
 const notificationStore = useNotificationStore()
 
 
-const getNotificationIcon = (type) => {
-  const icons = {
-    mention: AtSign,
-    assignment: UserPlus,
-    sla_warning: AlertTriangle,
-    sla_breach: AlertCircle
-  }
-  return icons[type] || Bell
+const notificationStyles = {
+  mention: { icon: AtSign, class: 'text-primary' },
+  assignment: { icon: UserPlus, class: 'text-accent-foreground' },
+  new_reply: { icon: MessageSquare, class: 'text-primary' },
+  new_reply_participating: { icon: MessageSquare, class: 'text-primary' },
+  conversation_reopened: { icon: RotateCcw, class: 'text-accent-foreground' }
 }
 
-const getNotificationIconClass = (type) => {
-  const classes = {
-    mention: 'text-primary',
-    assignment: 'text-accent-foreground',
-    sla_warning: 'text-destructive',
-    sla_breach: 'text-destructive'
+const getNotificationStyle = (type) => {
+  if (type?.startsWith('sla_')) {
+    return {
+      icon: type.endsWith('_breach') ? AlertCircle : AlertTriangle,
+      class: 'text-destructive'
+    }
   }
-  return classes[type] || 'text-muted-foreground'
+  return notificationStyles[type] || { icon: Bell, class: 'text-muted-foreground' }
 }
 
 const handleNotificationClick = async (notification) => {
diff --git a/frontend/apps/main/src/components/sidebar/SidebarNavUser.vue b/frontend/apps/main/src/components/sidebar/SidebarNavUser.vue
index 8f18dc99..717ab1a7 100644
--- a/frontend/apps/main/src/components/sidebar/SidebarNavUser.vue
+++ b/frontend/apps/main/src/components/sidebar/SidebarNavUser.vue
@@ -130,6 +130,7 @@ import { useUserStore } from '@main/stores/user'
 import { useIsMobile } from '@shared-ui/composables'
 import { useRouter } from 'vue-router'
 import { useKeyboardShortcutsDialog } from '@main/composables/useKeyboardShortcutsDialog'
+import { useLogout } from '@main/composables/useLogout'
 
 import { useColorMode } from '@vueuse/core'
 
@@ -139,8 +140,5 @@ const userStore = useUserStore()
 const router = useRouter()
 const { t } = useI18n()
 const shortcutsDialog = useKeyboardShortcutsDialog()
-
-const logout = () => {
-  window.location.href = '/logout'
-}
+const logout = useLogout()
 </script>
diff --git a/frontend/apps/main/src/composables/useLogout.js b/frontend/apps/main/src/composables/useLogout.js
new file mode 100644
index 00000000..61f7de9a
--- /dev/null
+++ b/frontend/apps/main/src/composables/useLogout.js
@@ -0,0 +1,10 @@
+import { usePushNotifications } from '@main/composables/usePushNotifications'
+
+const defaultBrowser = typeof window === 'undefined' ? {} : window
+
+export const createLogout = (pushNotifications, browser = defaultBrowser) => async () => {
+  await Promise.resolve(pushNotifications.disable()).catch(() => {})
+  browser.location.href = '/logout'
+}
+
+export const useLogout = () => createLogout(usePushNotifications())
diff --git a/frontend/apps/main/src/composables/useLogout.test.js b/frontend/apps/main/src/composables/useLogout.test.js
new file mode 100644
index 00000000..c229baf9
--- /dev/null
+++ b/frontend/apps/main/src/composables/useLogout.test.js
@@ -0,0 +1,23 @@
+import { describe, expect, it, vi } from 'vitest'
+import { createLogout } from './useLogout'
+
+describe('createLogout', () => {
+  it('clears the push association before logging out', async () => {
+    const pushNotifications = { disable: vi.fn().mockResolvedValue() }
+    const browser = { location: { href: '' } }
+
+    await createLogout(pushNotifications, browser)()
+
+    expect(pushNotifications.disable).toHaveBeenCalled()
+    expect(browser.location.href).toBe('/logout')
+  })
+
+  it('logs out when clearing the push association fails', async () => {
+    const pushNotifications = { disable: vi.fn().mockRejectedValue(new Error('offline')) }
+    const browser = { location: { href: '' } }
+
+    await createLogout(pushNotifications, browser)()
+
+    expect(browser.location.href).toBe('/logout')
+  })
+})
diff --git a/frontend/apps/main/src/composables/usePushNotifications.js b/frontend/apps/main/src/composables/usePushNotifications.js
new file mode 100644
index 00000000..a0aff321
--- /dev/null
+++ b/frontend/apps/main/src/composables/usePushNotifications.js
@@ -0,0 +1,82 @@
+import { ref } from 'vue'
+import api from '@main/api'
+
+const defaultBrowser = typeof window === 'undefined' ? {} : window
+
+export const urlBase64ToUint8Array = (value) => {
+  const padding = '='.repeat((4 - value.length % 4) % 4)
+  const raw = atob((value + padding).replace(/-/g, '+').replace(/_/g, '/'))
+  return Uint8Array.from(raw, character => character.charCodeAt(0))
+}
+
+export const createPushNotifications = (apiClient = api, browser = defaultBrowser) => {
+  const supported = ref(Boolean(browser.Notification && browser.navigator?.serviceWorker && browser.PushManager))
+  const permission = ref(browser.Notification?.permission || 'unsupported')
+  const enabled = ref(false)
+  let registration = null
+
+  const registerWorker = async () => {
+    registration ??= await browser.navigator.serviceWorker.register('/sw.js')
+    return registration
+  }
+
+  const existingWorker = async () => {
+    registration ??= await browser.navigator.serviceWorker.getRegistration('/sw.js')
+    return registration
+  }
+
+  const save = async (subscription) => {
+    const value = subscription.toJSON()
+    await apiClient.createPushSubscription({
+      endpoint: value.endpoint,
+      p256dh: value.keys.p256dh,
+      auth: value.keys.auth
+    })
+  }
+
+  const refresh = async (vapidPublicKey) => {
+    if (!supported.value || !vapidPublicKey) return
+    const worker = await registerWorker()
+    const subscription = await worker.pushManager.getSubscription()
+    enabled.value = Boolean(subscription)
+    if (subscription) await save(subscription)
+  }
+
+  const enable = async (vapidPublicKey) => {
+    if (!supported.value || !vapidPublicKey) return false
+    permission.value = await browser.Notification.requestPermission()
+    if (permission.value !== 'granted') return false
+    await registerWorker()
+    const worker = await browser.navigator.serviceWorker.ready
+    const existing = await worker.pushManager.getSubscription()
+    const subscription = existing || await worker.pushManager.subscribe({
+      userVisibleOnly: true,
+      applicationServerKey: urlBase64ToUint8Array(vapidPublicKey)
+    })
+    await save(subscription)
+    enabled.value = true
+    return true
+  }
+
+  const disable = async () => {
+    if (!supported.value) return
+    const worker = await existingWorker()
+    const subscription = await worker?.pushManager.getSubscription()
+    if (!subscription) {
+      enabled.value = false
+      return
+    }
+    try {
+      await apiClient.deletePushSubscription(subscription.endpoint)
+    } finally {
+      await subscription.unsubscribe()
+      enabled.value = false
+    }
+  }
+
+  return { supported, permission, enabled, refresh, enable, disable }
+}
+
+const pushNotifications = createPushNotifications()
+
+export const usePushNotifications = () => pushNotifications
diff --git a/frontend/apps/main/src/composables/usePushNotifications.test.js b/frontend/apps/main/src/composables/usePushNotifications.test.js
new file mode 100644
index 00000000..221cfca7
--- /dev/null
+++ b/frontend/apps/main/src/composables/usePushNotifications.test.js
@@ -0,0 +1,140 @@
+import { describe, expect, it, vi } from 'vitest'
+import { createPushNotifications } from './usePushNotifications'
+
+const makeBrowser = ({ permission = 'default', subscription = null } = {}) => {
+  const pushManager = {
+    getSubscription: vi.fn().mockResolvedValue(subscription),
+    subscribe: vi.fn()
+  }
+  const registration = { pushManager }
+  const browser = {
+    Notification: {
+      permission,
+      requestPermission: vi.fn().mockResolvedValue(permission)
+    },
+    navigator: {
+      serviceWorker: {
+        register: vi.fn().mockResolvedValue(registration),
+        getRegistration: vi.fn().mockResolvedValue(registration),
+        ready: Promise.resolve(registration)
+      }
+    },
+    PushManager: function PushManager () {}
+  }
+  return { browser, registration, pushManager }
+}
+
+const subscription = {
+  endpoint: 'https://push.example/subscription',
+  toJSON: () => ({
+    endpoint: 'https://push.example/subscription',
+    keys: { p256dh: 'public-key', auth: 'auth-secret' }
+  }),
+  unsubscribe: vi.fn().mockResolvedValue(true)
+}
+
+describe('createPushNotifications', () => {
+  it('reports unsupported browsers without registering a worker', async () => {
+    const api = { createPushSubscription: vi.fn() }
+    const state = createPushNotifications(api, {})
+
+    await state.refresh('vapid-key')
+
+    expect(state.supported.value).toBe(false)
+    expect(api.createPushSubscription).not.toHaveBeenCalled()
+  })
+
+  it('refreshes an existing subscription without requesting permission', async () => {
+    const { browser } = makeBrowser({ permission: 'granted', subscription })
+    const api = { createPushSubscription: vi.fn().mockResolvedValue({}) }
+    const state = createPushNotifications(api, browser)
+
+    await state.refresh('vapid-key')
+
+    expect(browser.Notification.requestPermission).not.toHaveBeenCalled()
+    expect(api.createPushSubscription).toHaveBeenCalledWith({
+      endpoint: subscription.endpoint,
+      p256dh: 'public-key',
+      auth: 'auth-secret'
+    })
+    expect(state.enabled.value).toBe(true)
+  })
+
+  it('subscribes only after permission is granted', async () => {
+    const { browser, pushManager } = makeBrowser({ permission: 'default' })
+    browser.Notification.requestPermission.mockResolvedValue('granted')
+    pushManager.subscribe.mockResolvedValue(subscription)
+    const api = { createPushSubscription: vi.fn().mockResolvedValue({}) }
+    const state = createPushNotifications(api, browser)
+
+    await state.enable('AQID')
+
+    expect(pushManager.subscribe).toHaveBeenCalledWith({
+      userVisibleOnly: true,
+      applicationServerKey: new Uint8Array([1, 2, 3])
+    })
+    expect(state.enabled.value).toBe(true)
+  })
+
+  it('does not subscribe when permission is denied', async () => {
+    const { browser, pushManager } = makeBrowser({ permission: 'default' })
+    browser.Notification.requestPermission.mockResolvedValue('denied')
+    const state = createPushNotifications({}, browser)
+
+    await state.enable('AQID')
+
+    expect(pushManager.subscribe).not.toHaveBeenCalled()
+    expect(state.permission.value).toBe('denied')
+  })
+
+  it('waits for the first worker to become active before subscribing', async () => {
+    const { browser, registration, pushManager } = makeBrowser({ permission: 'granted' })
+    let resolveReady
+    browser.navigator.serviceWorker.ready = new Promise(resolve => {
+      resolveReady = resolve
+    })
+    pushManager.subscribe.mockResolvedValue(subscription)
+    const api = { createPushSubscription: vi.fn().mockResolvedValue({}) }
+    const state = createPushNotifications(api, browser)
+
+    const enabling = state.enable('AQID')
+    await vi.waitFor(() => expect(browser.navigator.serviceWorker.register).toHaveBeenCalledOnce())
+
+    expect(pushManager.subscribe).not.toHaveBeenCalled()
+    expect(api.createPushSubscription).not.toHaveBeenCalled()
+    expect(state.enabled.value).toBe(false)
+
+    resolveReady(registration)
+    await expect(enabling).resolves.toBe(true)
+    expect(pushManager.subscribe).toHaveBeenCalledOnce()
+    expect(api.createPushSubscription).toHaveBeenCalledOnce()
+    expect(state.enabled.value).toBe(true)
+  })
+
+  it('unsubscribes the current browser and deletes its endpoint', async () => {
+    const { browser } = makeBrowser({ permission: 'granted', subscription })
+    const api = {
+      createPushSubscription: vi.fn().mockResolvedValue({}),
+      deletePushSubscription: vi.fn().mockResolvedValue({})
+    }
+    const state = createPushNotifications(api, browser)
+    await state.refresh('vapid-key')
+
+    await state.disable()
+
+    expect(subscription.unsubscribe).toHaveBeenCalled()
+    expect(api.deletePushSubscription).toHaveBeenCalledWith(subscription.endpoint)
+    expect(state.enabled.value).toBe(false)
+  })
+
+  it('unsubscribes the browser when clearing the server association fails', async () => {
+    subscription.unsubscribe.mockClear()
+    const { browser } = makeBrowser({ permission: 'granted', subscription })
+    const api = { deletePushSubscription: vi.fn().mockRejectedValue(new Error('offline')) }
+    const state = createPushNotifications(api, browser)
+
+    await expect(state.disable()).rejects.toThrow('offline')
+
+    expect(subscription.unsubscribe).toHaveBeenCalledOnce()
+  })
+})
diff --git a/frontend/apps/main/src/constants/navIcons.js b/frontend/apps/main/src/constants/navIcons.js
index 7535e953..b85cb6fe 100644
--- a/frontend/apps/main/src/constants/navIcons.js
+++ b/frontend/apps/main/src/constants/navIcons.js
@@ -1,5 +1,6 @@
 import {
   BarChart3,
+  Bell,
   Bot,
   BookOpen,
   CircleDot,
@@ -33,6 +34,7 @@ import {
 // Icon names referenced by string in navigation.js.
 export const navIconMap = {
   BarChart3,
+  Bell,
   Bot,
   BookOpen,
   CircleDot,
diff --git a/frontend/apps/main/src/constants/navigation.js b/frontend/apps/main/src/constants/navigation.js
index d91fce40..28a5b581 100644
--- a/frontend/apps/main/src/constants/navigation.js
+++ b/frontend/apps/main/src/constants/navigation.js
@@ -265,6 +265,12 @@ export const accountNavItems = [
     titleKey: 'globals.terms.profile',
     href: '/account/profile',
     icon: 'CircleUser'
+  },
+  {
+    titleKey: 'globals.terms.notification',
+    href: '/account/notifications',
+    isTitleKeyPlural: true,
+    icon: 'Bell'
   }
 ]
 
diff --git a/frontend/apps/main/src/features/admin/templates/TemplateForm.vue b/frontend/apps/main/src/features/admin/templates/TemplateForm.vue
index e5e4cc8c..1a615f58 100644
--- a/frontend/apps/main/src/features/admin/templates/TemplateForm.vue
+++ b/frontend/apps/main/src/features/admin/templates/TemplateForm.vue
@@ -54,7 +54,18 @@
       </FormItem>
     </FormField>
 
-    <Button type="submit" :isLoading="isLoading"> {{ submitLabel }} </Button>
+    <div class="flex gap-2">
+      <Button type="submit" :isLoading="isLoading"> {{ submitLabel }} </Button>
+      <Button
+        v-if="initialValues?.is_builtin && defaultBody"
+        type="button"
+        variant="outline"
+        :disabled="isLoading"
+        @click="resetToDefault"
+      >
+        {{ $t('globals.messages.resetToDefault') }}
+      </Button>
+    </div>
   </form>
 </template>
 
@@ -78,6 +89,7 @@ import CodeEditor from '@main/components/editor/CodeEditor.vue'
 import { Checkbox } from '@shared-ui/components/ui/checkbox/index.js'
 import { Label } from '@shared-ui/components/ui/label/index.js'
 import { useI18n } from 'vue-i18n'
+import { BUILT_IN_TEMPLATE_BODIES } from './defaults.js'
 
 const props = defineProps({
   initialValues: {
@@ -121,6 +133,14 @@ const hideSubject = computed(() => {
   return isOutgoingTemplate.value || props.initialValues?.name === 'CSAT request'
 })
 
+const defaultBody = computed(() => {
+  return BUILT_IN_TEMPLATE_BODIES[props.initialValues?.name]
+})
+
+const resetToDefault = () => {
+  form.setFieldValue('body', defaultBody.value, false)
+}
+
 // Watch for changes in initialValues and update the form.
 watch(
   () => props.initialValues,
diff --git a/frontend/apps/main/src/features/admin/templates/defaults.js b/frontend/apps/main/src/features/admin/templates/defaults.js
new file mode 100644
index 00000000..362331bb
--- /dev/null
+++ b/frontend/apps/main/src/features/admin/templates/defaults.js
@@ -0,0 +1,158 @@
+export const BUILT_IN_TEMPLATE_BODIES = {
+  'Conversation assigned': `<p>A new conversation has been assigned to you:</p>
+
+<div>
+    Reference number: {{ .Conversation.ReferenceNumber }} <br>
+    Subject: {{ .Conversation.Subject }}
+</div>
+
+<p>
+    <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
+</p>
+
+<div>
+    Best regards,<br>
+    Libredesk
+</div>`,
+  'New reply from contact': `<p>{{ .Author.FullName }} replied to a conversation assigned to you:</p>
+
+<div>
+    Reference number: {{ .Conversation.ReferenceNumber }} <br>
+    Subject: {{ .Conversation.Subject }}
+</div>
+
+<blockquote>{{ .Message.Content }}</blockquote>
+
+<p>
+    <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
+</p>
+
+<div>
+    Best regards,<br>
+    Libredesk
+</div>`,
+  'New reply on participating conversation': `<p>{{ .Author.FullName }} replied to a conversation you are participating in:</p>
+
+<div>
+    Reference number: {{ .Conversation.ReferenceNumber }} <br>
+    Subject: {{ .Conversation.Subject }}
+</div>
+
+<blockquote>{{ .Message.Content }}</blockquote>
+
+<p>
+    <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
+</p>
+
+<div>
+    Best regards,<br>
+    Libredesk
+</div>`,
+  'Conversation reopened': `<p>{{ .Author.FullName }} replied and reopened a conversation assigned to you:</p>
+
+<div>
+    Reference number: {{ .Conversation.ReferenceNumber }} <br>
+    Subject: {{ .Conversation.Subject }}
+</div>
+
+<blockquote>{{ .Message.Content }}</blockquote>
+
+<p>
+    <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
+</p>
+
+<div>
+    Best regards,<br>
+    Libredesk
+</div>`,
+  'SLA breach warning': `<p>This is a notification that the SLA for conversation {{ .Conversation.ReferenceNumber }} is approaching the SLA deadline for {{ .SLA.Metric }}.</p>
+
+<p>
+  Details:<br>
+  - Conversation reference number: {{ .Conversation.ReferenceNumber }}<br>
+  - Metric: {{ .SLA.Metric }}<br>
+  - Due in: {{ .SLA.DueIn }}
+</p>
+
+<p>
+    <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
+</p>
+
+<p>
+  Best regards,<br>
+  Libredesk
+</p>`,
+  'SLA breached': `<p>This is an urgent alert that the SLA for conversation {{ .Conversation.ReferenceNumber }} has been breached for {{ .SLA.Metric }}. Please take immediate action.</p>
+
+<p>
+  Details:<br>
+  - Conversation reference number: {{ .Conversation.ReferenceNumber }}<br>
+  - Metric: {{ .SLA.Metric }}<br>
+  - Overdue by: {{ .SLA.OverdueBy }}
+</p>
+
+<p>
+    <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
+</p>
+
+<p>
+  Best regards,<br>
+  Libredesk
+</p>`,
+  'Mentioned in conversation': `<p>{{ .MentionedBy.FullName }} mentioned you in a private note on conversation #{{ .Conversation.ReferenceNumber }}.</p>
+
+<blockquote style="background-color: #f5f5f5; padding: 12px; margin: 16px 0; border-left: 4px solid #ddd;">
+{{ .Message.Content }}
+</blockquote>
+
+<p>
+<a href="{{ RootURL }}/inboxes/mentioned/conversation/{{ .Conversation.UUID }}?scrollTo={{ .Message.UUID }}">View Conversation</a>
+</p>
+
+<p>
+Best regards,<br>
+libredesk
+</p>`,
+  'CSAT request': `<p style="margin: 0 0 4px; font-size: 15px; color: #374151; text-align: center; line-height: 1.5;">
+  Your conversation <strong style="color: #111827;">#{{ .Conversation.ReferenceNumber }}</strong> has been resolved.
+</p>
+<p style="margin: 0 0 28px; font-size: 13px; color: #9ca3af; text-align: center;">
+  We would love to hear how it went.
+</p>
+<p style="margin: 0 0 20px; font-size: 14px; font-weight: 600; color: #374151; text-align: center;">
+  How would you rate your experience?
+</p>
+<!-- Variable CSATUUID is also available -->
+<div style="text-align: center; margin: 0 auto; max-width: 400px; font-size: 0;">
+  <div style="display: inline-block; width: 72px; text-align: center; vertical-align: top; padding: 4px 0;">
+    <a href="{{ .CSATLink }}?rating=1" style="text-decoration: none; display: block;">
+      <span style="font-size: 34px; display: block; line-height: 1.4;">&#128546;</span>
+      <span style="font-size: 10px; display: block; font-weight: 600; color: #b0b5bd; text-transform: uppercase; letter-spacing: 0.05em; margin-top: 4px;">Poor</span>
+    </a>
+  </div>
+  <div style="display: inline-block; width: 72px; text-align: center; vertical-align: top; padding: 4px 0;">
+    <a href="{{ .CSATLink }}?rating=2" style="text-decoration: none; display: block;">
+      <span style="font-size: 34px; display: block; line-height: 1.4;">&#128533;</span>
+      <span style="font-size: 10px; display: block; font-weight: 600; color: #b0b5bd; text-transform: uppercase; letter-spacing: 0.05em; margin-top: 4px;">Fair</span>
+    </a>
+  </div>
+  <div style="display: inline-block; width: 72px; text-align: center; vertical-align: top; padding: 4px 0;">
+    <a href="{{ .CSATLink }}?rating=3" style="text-decoration: none; display: block;">
+      <span style="font-size: 34px; display: block; line-height: 1.4;">&#128522;</span>
+      <span style="font-size: 10px; display: block; font-weight: 600; color: #b0b5bd; text-transform: uppercase; letter-spacing: 0.05em; margin-top: 4px;">Good</span>
+    </a>
+  </div>
+  <div style="display: inline-block; width: 72px; text-align: center; vertical-align: top; padding: 4px 0;">
+    <a href="{{ .CSATLink }}?rating=4" style="text-decoration: none; display: block;">
+      <span style="font-size: 34px; display: block; line-height: 1.4;">&#128515;</span>
+      <span style="font-size: 10px; display: block; font-weight: 600; color: #b0b5bd; text-transform: uppercase; letter-spacing: 0.05em; margin-top: 4px;">Great</span>
+    </a>
+  </div>
+  <div style="display: inline-block; width: 72px; text-align: center; vertical-align: top; padding: 4px 0;">
+    <a href="{{ .CSATLink }}?rating=5" style="text-decoration: none; display: block;">
+      <span style="font-size: 34px; display: block; line-height: 1.4;">&#129321;</span>
+      <span style="font-size: 10px; display: block; font-weight: 600; color: #b0b5bd; text-transform: uppercase; letter-spacing: 0.05em; margin-top: 4px;">Excellent</span>
+    </a>
+  </div>
+</div>`
+}
diff --git a/frontend/apps/main/src/features/command/providers/useAccountCommands.js b/frontend/apps/main/src/features/command/providers/useAccountCommands.js
index 02b00e60..572aaf0b 100644
--- a/frontend/apps/main/src/features/command/providers/useAccountCommands.js
+++ b/frontend/apps/main/src/features/command/providers/useAccountCommands.js
@@ -12,7 +12,8 @@ import {
 } from 'lucide-vue-next'
 import { useUserStore } from '@main/stores/user'
 import { useKeyboardShortcutsDialog } from '@main/composables/useKeyboardShortcutsDialog'
-import { SECTIONS } from '../sections'
+import { useLogout } from '@main/composables/useLogout'
+import { SECTIONS } from '@main/features/command/sections'
 
 const AWAY_STATUSES = ['away_manual', 'away_and_reassigning']
 
@@ -21,6 +22,7 @@ export function useAccountCommands() {
   const mode = useColorMode()
   const userStore = useUserStore()
   const shortcutsDialog = useKeyboardShortcutsDialog()
+  const logout = useLogout()
 
   return computed(() => {
     const status = userStore.user.availability_status
@@ -70,9 +72,7 @@ export function useAccountCommands() {
         keywords: ['sign out'],
         section: SECTIONS.ACCOUNT,
         icon: LogOut,
-        run: () => {
-          window.location.href = '/logout'
-        }
+        run: logout
       }
     ]
   })
diff --git a/frontend/apps/main/src/router/index.js b/frontend/apps/main/src/router/index.js
index 34eb0ba3..7ea886b3 100644
--- a/frontend/apps/main/src/router/index.js
+++ b/frontend/apps/main/src/router/index.js
@@ -173,6 +173,13 @@ const routes = [
             name: 'profile',
             component: () => import('@main/views/account/profile/ProfileEditView.vue'),
             meta: { titleKey: 'account.editProfile' }
+          },
+          {
+            path: 'notifications',
+            name: 'account-notifications',
+            component: () =>
+              import('@main/views/account/notifications/NotificationPreferences.vue'),
+            meta: { titleKey: 'globals.terms.notification', titleCount: 2 }
           }
         ]
       },
diff --git a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js
new file mode 100644
index 00000000..88df5723
--- /dev/null
+++ b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js
@@ -0,0 +1,72 @@
+// @vitest-environment jsdom
+import { afterEach, describe, expect, it, vi } from 'vitest'
+import { createApp, h, nextTick, ref } from 'vue'
+
+const { getPreferences, savePreferences, refresh, emit } = vi.hoisted(() => ({
+  getPreferences: vi.fn(),
+  savePreferences: vi.fn().mockResolvedValue({}),
+  refresh: vi.fn(),
+  emit: vi.fn()
+}))
+vi.mock('@/api', () => ({ default: { getNotificationPreferences: getPreferences, updateNotificationPreferences: savePreferences } }))
+vi.mock('vue-i18n', () => ({ useI18n: () => ({ t: (key) => key }) }))
+vi.mock('@/composables/useEmitter', () => ({ useEmitter: () => ({ emit }) }))
+vi.mock('@shared-ui/utils/http.js', () => ({ handleHTTPError: (error) => error }))
+vi.mock('@/composables/usePushNotifications', () => ({
+  usePushNotifications: () => ({ supported: ref(true), enabled: ref(false), permission: ref('granted'), refresh })
+}))
+vi.mock('@shared-ui/components/ui/switch', () => ({
+  Switch: {
+    props: ['checked', 'disabled'],
+    emits: ['update:checked'],
+    setup: (props, { emit }) => () => h('button', {
+      type: 'button', disabled: props.disabled,
+      onClick: () => emit('update:checked', !props.checked)
+    })
+  }
+}))
+import NotificationPreferences from './NotificationPreferences.vue'
+
+let app
+let root
+const settle = async () => { for (let i = 0; i < 10; i++) await nextTick() }
+afterEach(() => { app?.unmount(); root?.remove(); vi.clearAllMocks() })
+
+const mount = async (vapidPublicKey = 'test-key') => {
+  getPreferences.mockResolvedValue({ data: { data: {
+    email_enabled: true, vapid_public_key: vapidPublicKey, preferences: [
+      { notification_type: 'new_reply', channel: 'email', enabled: true },
+      { notification_type: 'new_reply', channel: 'in_app', enabled: false }
+    ]
+  } } })
+  root = document.createElement('div')
+  document.body.append(root)
+  app = createApp(NotificationPreferences)
+  app.config.globalProperties.$t = (key) => key
+  app.mount(root)
+  await settle()
+}
+
+describe('notification preferences', () => {
+  it('saves a channel toggle', async () => {
+    await mount()
+    const email = root.querySelectorAll('button')[2]
+    expect(email).toBeDefined()
+    email.click()
+    await settle()
+    expect(savePreferences).toHaveBeenCalledWith([{ notification_type: 'new_reply', channel: 'email', enabled: false }])
+  })
+
+  it('leaves the push subscription to the app shell', async () => {
+    await mount()
+    expect(root.textContent).toContain('notification.type.newReply')
+    expect(refresh).not.toHaveBeenCalled()
+  })
+
+  it('disables browser notifications when push is unavailable', async () => {
+    await mount('')
+    const browserPush = root.querySelector('button')
+    expect(browserPush.disabled).toBe(true)
+    expect(root.textContent).toContain('notification.browserPush.unavailable')
+  })
+})
diff --git a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
new file mode 100644
index 00000000..b1ea9d86
--- /dev/null
+++ b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
@@ -0,0 +1,168 @@
+<template>
+  <div class="h-full">
+    <div class="flex flex-col space-y-5 max-w-2xl">
+      <div class="space-y-1">
+        <span class="sub-title">{{ $t('globals.terms.notification', 2) }}</span>
+      </div>
+
+      <p v-if="!emailEnabled" class="text-muted-foreground text-xs">
+        {{ $t('notification.emailChannelDisabled') }}
+      </p>
+
+      <div class="flex items-center justify-between gap-4 border border-border rounded-md px-4 py-3">
+        <div class="space-y-1">
+          <p class="text-sm text-foreground">
+            {{ $t('globals.terms.browserNotification', 2) }}
+          </p>
+          <p class="text-xs text-muted-foreground">{{ browserPushDescription }}</p>
+        </div>
+        <Switch
+          :checked="pushNotifications.enabled.value"
+          :disabled="
+            !pushNotifications.supported.value ||
+            pushNotifications.permission.value === 'denied' ||
+            !vapidPublicKey
+          "
+          :aria-label="$t('globals.terms.browserNotification', 2)"
+          @update:checked="updateBrowserPush"
+        />
+      </div>
+
+      <div class="border border-border rounded-md divide-y divide-border">
+        <div class="flex items-center px-4 py-2 text-xs font-medium text-muted-foreground">
+          <div class="flex-grow" />
+          <div v-for="channel in channels" :key="channel.key" class="w-20 text-center">
+            {{ $t(channel.labelKey) }}
+          </div>
+        </div>
+
+        <div v-for="row in rows" :key="row.type" class="flex items-center px-4 py-3">
+          <div class="flex-grow pr-4">
+            <p class="text-sm text-foreground">{{ typeLabel(row.type) }}</p>
+          </div>
+          <div v-for="channel in channels" :key="channel.key" class="w-20 flex justify-center">
+            <Switch
+              :checked="row[channel.key]"
+              :disabled="channel.key === 'email' && !emailEnabled"
+              :aria-label="
+                $t('notification.channelToggleLabel', {
+                  channel: $t(channel.labelKey),
+                  type: typeLabel(row.type)
+                })
+              "
+              @update:checked="update(row, channel.key, $event)"
+            />
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { computed, ref, onMounted } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { Switch } from '@shared-ui/components/ui/switch'
+import { useEmitter } from '@/composables/useEmitter'
+import { handleHTTPError } from '@shared-ui/utils/http.js'
+import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
+import api from '@/api'
+import { usePushNotifications } from '@/composables/usePushNotifications'
+
+const { t } = useI18n()
+const emitter = useEmitter()
+const rows = ref([])
+const emailEnabled = ref(true)
+const vapidPublicKey = ref('')
+const pushNotifications = usePushNotifications()
+
+const channels = [
+  { key: 'in_app', labelKey: 'globals.terms.inApp' },
+  { key: 'email', labelKey: 'globals.terms.email' },
+  { key: 'push', labelKey: 'globals.terms.push' }
+]
+
+const typeLabels = {
+  assignment: 'notification.type.assignment',
+  mention: 'notification.type.mention',
+  conversation_reopened: 'notification.type.conversationReopened',
+  new_reply: 'notification.type.newReply',
+  new_reply_participating: 'notification.type.newReplyParticipating',
+  sla_first_response_warning: 'notification.type.slaFirstResponseWarning',
+  sla_first_response_breach: 'notification.type.slaFirstResponseBreach',
+  sla_next_response_warning: 'notification.type.slaNextResponseWarning',
+  sla_next_response_breach: 'notification.type.slaNextResponseBreach',
+  sla_resolution_warning: 'notification.type.slaResolutionWarning',
+  sla_resolution_breach: 'notification.type.slaResolutionBreach'
+}
+
+const typeLabel = (type) => (typeLabels[type] ? t(typeLabels[type]) : type)
+
+const fetchPreferences = async () => {
+  try {
+    const { data } = await api.getNotificationPreferences()
+    emailEnabled.value = data.data.email_enabled
+    vapidPublicKey.value = data.data.vapid_public_key
+    const byType = {}
+    for (const pref of data.data.preferences) {
+      byType[pref.notification_type] ??= { type: pref.notification_type }
+      byType[pref.notification_type][pref.channel] = pref.enabled
+    }
+    rows.value = Object.values(byType)
+  } catch (error) {
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  }
+}
+
+const browserPushDescription = computed(() => {
+  if (!pushNotifications.supported.value) return t('notification.browserPush.unsupported')
+  if (pushNotifications.permission.value === 'denied') return t('notification.browserPush.blocked')
+  if (!vapidPublicKey.value) return t('notification.browserPush.unavailable')
+  return t('notification.browserPush.description')
+})
+
+const updateBrowserPush = async (value) => {
+  try {
+    if (value) {
+      const granted = await pushNotifications.enable(vapidPublicKey.value)
+      if (!granted) {
+        emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+          variant: 'destructive',
+          description: t('notification.browserPush.blocked')
+        })
+      }
+    } else {
+      await pushNotifications.disable()
+    }
+  } catch (error) {
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  }
+}
+
+const update = async (row, channel, value) => {
+  const previous = row[channel]
+  row[channel] = value
+  try {
+    await api.updateNotificationPreferences([
+      { notification_type: row.type, channel, enabled: value }
+    ])
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      description: t('globals.messages.savedSuccessfully')
+    })
+  } catch (error) {
+    row[channel] = previous
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  }
+}
+
+onMounted(fetchPreferences)
+</script>
diff --git a/frontend/cypress/e2e/ui/pwaNotifications.cy.js b/frontend/cypress/e2e/ui/pwaNotifications.cy.js
new file mode 100644
index 00000000..8945986f
--- /dev/null
+++ b/frontend/cypress/e2e/ui/pwaNotifications.cy.js
@@ -0,0 +1,18 @@
+describe('PWA notification preferences', () => {
+  it('serves installable assets', () => {
+    cy.request('/manifest.webmanifest').then(({ body, headers, status }) => {
+      expect(status).to.eq(200)
+      expect(headers['content-type']).to.include('application/manifest+json')
+      expect(body.name).to.eq('libredesk')
+      expect(body.display).to.eq('standalone')
+      expect(body.icons).to.have.length(2)
+    })
+
+    cy.request('/sw.js').then(({ body, status }) => {
+      expect(status).to.eq(200)
+      expect(body).to.include("addEventListener('push'")
+      expect(body).to.include("addEventListener('notificationclick'")
+      expect(body).not.to.include("addEventListener('fetch'")
+    })
+  })
+})
diff --git a/frontend/public/images/pwa-icon-192.png b/frontend/public/images/pwa-icon-192.png
new file mode 100644
index 0000000000000000000000000000000000000000..79beea19e3d04e4beae65e8adba8b59004278f92
GIT binary patch
literal 5475
zcmcIoc{J2t*#Fu^hEbM~Wh7$AzAs~oQiS<hqrwOwYuSx9OCs4BLnM4<8~Zv_<R?Uh
zgfK--*0D6%dFS`O?|IL8|9Jm=&ppq5?s@M0+~?ls-20r*c@nQ$nsIRmaR30ob<y0!
zhOSBf3Og&kxB2GFMpxqQ<~COVAmS_lU>^d&F5QIv4FI8v0I+xi0JL)eKp+6uX01z~
zV0E)FGXakNZAG1B>2%An0CUG+06<#&D-5N2Srv36Tgb&LrfiGHnAyb7fOT~lbdyww
zsY8gz%@B;Xdk}`M0A)pGb$LZic||p}lA^YvnzovnoFaXo=zDvM=YIkG?s#~6hX3Dy
z)9O~Q=>VDk@etzehY1e3=@;<d7%h24RkWgpwu-X0iu!*!x$gV-F94iWxM*UC4x3z=
zj(jEsMw8a5RNQJL1vc2_AbKB}a9-2`b>bwmEe4tCHOg4bE_Cvk-HYDeVzP-9IhQKd
z4RdW&g(TbnK5K$okJ$^p=cwA(N!8+QVE+b^pMc!UDQFFDw<^4T*ix3=zO<~|KDb)2
zu(yYPWA|aDt67XPPKg#uR_YaW|9|XG`6(|mDelG3MA;mzcCALW><Al4F>)Lnox|cH
zhikcme}AjxCM`?D)=2jLjD~SvkE}9JvGM&@D}(LH#1AnR#r=7e{=HxFMQJU912GU+
zkFqihN#>;9|NO>zoO|!;ze^I)WCE9>)JNK-kEx7DTtU){=jYm`-x`9wZHYI<7Ct%x
zs%aN;aDa6m1j=Lsde2~MuIhU~L$1wN|17?3$Gztj-%sDg6Z@dqcsTC&o}m*;F1qc0
zU?+A(=>6DSd~|I$hT)@P#K`;F!3Rl2NG65LVq@|#Y!5o}yczh+q>E>@!@tJssqzC{
z#kW(a%>h}Z#@4#o405a*45+Ykr(L;iYCrts8R;tdXP4oZd1K+-Cf|v-&!sG0Lb7Gh
z58Me9I#j>9^yRO9g5~QfyW5sJi+S!ZXuu!5WKSuomBapkS<`L&%7RAn;j`{${D<D3
zS|dsUvoC{2gXVuUc6W`kWw4M$Gcbt><WA{_WVd8jlWXh}VN^MQvYYF5T71(_fuZPj
z%A;DLtSEt|!pY)(4#H}v_?=w8&5&8S3?kxJA%fdo_xh~>+cg6VGg)>d;Q0bVgP`>O
z>%t)yxDm=E2akU>vd|%@`Btl$SJMg1X0nL$5v!?W^dl>gB}twrr>ZZak{074+y$XL
zlUH#cFSu~$?uhr9p$OB<cBTG=Dj5Mqeq!q9@0tr61uJX&u%Mx~o3oFZ-ZI|6LL1w2
zsr5lWFB!2rg5YzEV=jKx?496|xycZ73Im=CxnM7=<t55J7ejVLv7#e60GE29GmO^d
zlUm!1x#40hsoV{_%a)fzNn9r3as`Wamkcg^kMOWId=^X<`YS&{MFP)@Wq9D|v3G*e
zSr|;sc*&SgCx2KebSP2F;n0*{Q*Ki{X|E9d&n+xBpmlY~j#+j!%z&FXpN?dJweD~S
zB~>F<u+&bmZ)PK1+VOkNY;PoGsHjcnXP@VI{*bZz%$i-FTHo}sp_->KzP`y*cZdZe
zRt9=({lzj~jZU$}5S7`I$qu&6%f<_18V}H~{)tXrR|Y#RO*(?Bg^ttj({?>zLH}V&
zA?|%i^Apj#7tXm)y7_F(iBm6{=C__Xe6tx?bi@|K68JvT!&b$_PqJ=#3!+(B4ek7_
zy))h+ya31~6<2p8ZRy*N*?_}<K92YB#tFB}<F{k4)oZ`ehjkc%<4Fm(8=c^&aUA=K
z=>B?Vt!HEE4!n5f=NsZi{_p1N`wA6JM_P!o)eV=ujXi9XK$)14^S$q$MbAYV?js4S
zOaX7rgfb<QeSr+jv4bFDAs%0yrQmXj{d+eQaVj8e^0h)NmAZtMCYf#M8muQu<G(h!
zz2h)>X%MrMMInu9hJ|WAMSciY7s&ojc=9O>;dMKkIwA0&b<)!$CLusA^H9(}&Jz}z
zRx6@))N~LX3Cl@aW|vE1+)XqPNb`w`+HW8rkBq@1|Lh(j5x*U&+2FR+(_^B}6Lq!W
zp~fMjoi86kpuTjU1z}(GeKccxZshX*%Z95*zk<-SCZodePJy3DG@?$bK}-vq?S3@y
z>$?vB)3_uBlmbF(O^94*!;&o_wV#*7PTZW5J$2O7=CRq64?oyIHI`V`Zqmdni7j2M
zawt3Oku2}^$JA=+CXX`mwfPHY*~*{jIyd{X^x1|VaX}FukcqKh8}w)N(@v(xmv+l-
z1sB0sjn2CiX0}ItVV8shp=o9&4s9XcXAz|d9bDT2<c~}aUkd9BBC;}N`GR7Oe=Eq-
z;vTJQvhKPvKckvUP_l}>AOW;ZE4*Ybg<Qc05WW(!2Tm|m>2Mm#4R1bZoAw{`X~gTk
zO6GV6-`0xDKC$EAqclm(nB{HFxWAd`YXt9LAr&j@>0M!Gpx^}3E}0B5>K_w%u8rsa
zto9oXHb%I)A?!e!2f!>Y`J8DaU;Rg~zRBL#TUb{PT}5tUdvGy-=jk!dg*My7Yg{Lj
z%Opa^YR`Y#cQV(Ao#8Wm^SRXGJppMub_uky89V>-=5dKoA^9^^Ja3`g+*3yE1Y14v
zm!HFKpYoFUvs(G=%UE*ZhVRD#tQlL^tvmS7R$n4B*sg}3z)(xK_m_~RPsA?+wpR6p
zk#SBkjz=9!ciU;^SL{LXTZ4DH&i-0Ak^NepY}!t3Y9K#+`(%LDGaX7la;o)(<v5Nb
zwdRrJ@S~YK%v`6;6Z=nT?(o)X1dFiA9n4DDWyeJ_e-a6d^Uk<TlG}Lvi^e!I4}5J4
zm8-I=jM-%)Pm?lHO7U@S-B+c18<lzmG$}#U=mngl+SApJ^*q~~15SP1kJsIm-A)P0
zO`T+$KHlL2BWiqH|EX`7(;;Hd;on*&%Qz+W0P_!mq8jNHBFR)FI(xz>0Kr=cMN}tT
zW5TtTm~^f!|K?&H8X_#OLeRIzT*5yfu<|Z(<cc)y9-r=ul8~mRbN?Kk4%-ol;S4Bz
zkrQ=Ze|Wus<0%{wG~<QL8|%|Xf#9DAy>m&32r4{H<NR8W!EYW=uYG(8?*3;WOMYt3
zLs*N7KXeJHdwcKAX>H?FPAnT`&AD0eL%c)v{Uvk@^2dJPnV38w00_qqeElkjaqQv=
zbKl)G8d_gmc;*KWznz6)d&C2+uLn-F1kT~_=~C>AU>SXb>V{tvHr`D8x@znlKJJTr
z|KsG8v@XvlXx$X=qNV`!6V41MSGO%fzj4OkbynOn*)Gniv0L_`SbdG&ZGFnM;}Y`)
zmbc7q&G_GY{h;VI!u7ODx(4=J?SSX*e2&;XCInF`8+Hjb*C!RjzkMRG5Dl6pf2#1g
z?6R%FcwRJzwdLbj=13z+%+s-{6Ovt@F@xte8tIx7!*z8dL_{J|NpIpmJ&$Kgil*H=
z657ZvQke=|NfJa4-S(6lw)MUS19*(YdlM3HX}qy_($2)Nie4g?LD|`u3Z>o-nWVBo
z7ND<}ycRDpkfE&4x-S!5Y&E1EtYOs1^8Pd=nZNDr1cbD^7_tArJt1*`(b2nJb!TGk
zzWxeWn#@QcYIxJ|!PP4`cZy+9{c_aMq^ea5msz7BZEm6DSyM~l+t?J{u=^QYLSI|0
zg!lmOQztH3<chF%grwoitd8BSNQgoVZ%S_JQWMRe#HCfW)5>n|l@@%EYB;+J9Eh4P
zZjaOu2wR#7YxS4SZvNQABby%9QPKlbbce?xt&-Qh$hj38?Sf0%j<LrJ@w`UcA<1=;
zh(`$x=*)_WifN71m^sY=tsdSlM`w8EbmA;f3U9ac2afz7`h)A-`SH;y#^dFHps=tp
z7<#Zv)1+8ljCGZ9-`_Hgz4UT%N2yoN)Z?3${Yxd|+IE)KNx9wN2~%>;tTb27o^rtH
z+C(s(-7=#FdFt;DmrDtwc&`k`k>E219Ru}VFi;%MXWoZgZNM=BQxBG_4O1)X;vjfn
znN~iFs}P4Z9rBu76WYr-q4J_6DLc)H!T%orQhK1BsrBdxErrqF$>T#|q;eSSo(|;@
z@o=qB;-Rmv@8ymyOfnqAjK2x?9Hxg8<ERZ!ByFN;cR{_7>@gUBeSw`HPg*SfpWT7F
z?3@hU%HFl&eOx}p;oJi_&V+aIu=THsT`?EbDVJ5c;Fg>VDLCG!@5EQ{y0Y8|UzBXI
z1!rfLXdLi!bau=as!YnnoP%UTR~6T4GB6A1u?ini_mCm2(4nW-V4vxM`*@M_!(&z!
zl)P|Qf8i^rP*_;F-54}j!RaV9MzDxSP(!Dh{2uZU2*`RKBXt#(Ichsq-{$&7=6>Db
zO~JWON*9dSue7^Hj+Up(C%rArj}TfL8D;t=`ZsXJtj%H_b0Xl*(W9`}d};0V$aW%f
zz>fwC$8!dRfncSr?YafF88~9!4<*iz<{4)PtEj3Gg)>*LOklz@G8c#=SUkj!Ar^@(
zt_%=f&x(J$v_(9;vp~9+lKhI5By;L=ZKz@k`uOtT%_D71A@%8Ke|m0EsgTK#-$<$L
zRGSK46m1%biy-&v`OZ3A;R5^|I6sc8qsNP2*p+Vmk2k&0a?cXHgj5X9A&8<5a<j`5
z>R>cdEj?wF=7R=$1S_B<2x?R6jUOpATYS7)x;v@M@!BfgPpD;gc$J<vjMzikr>mfd
zdk2)8V&jZ<*Yp3O)5%WnQ@LpoH&m-&MRRj=yzWQ{+V$SeXCc`}dIbdqm2Bw?i;0O<
zd?|Xxf|^dRK-iq;Bs5b8h4{2TUi!OPSEpo?D6V@@<EkqJG9x~SUz~FhwHc$1*9f2f
z8z_$owWh#}@F#VHS}`SzMI#I3&T+d+Q}*xHlyBUh&G-RgrR6d)V(krE>{T$+qVg8^
zUJI<emoKhki=KP4F^-q{zPp{D$=8ux{9$$MThO4=KY#~9S=k-y^R%DgE-oWj7J&w7
z!C<HN$$=)T7Yc{_$l=Wzm&ldIFlu)~C<DrtNgTXiuoW|aQu6w<y1E=fj$12{cW(0S
zAm8Uyh9{P&!e4!90eIkxQtw8H&53=dz5lptaU0Zq9pk<~3tV?3cpMAIr!IHD2xLGl
z@-Vr9p#H<PA}Ge29A);`lUw(o%yd3)VPRo53zLg+R3|)TetH}mq2Q~hUJgMuOye*0
z<E)2R7Rkh;-KCl%bn>U>sTEn5%9~<SS5^PMrazSHDcO}i3!MfQATe`>dG=u@;;-E_
zN0Xz;(7mB)2+9ps7{q*<e&yo<Lpe<pAuTp^&ztt>Q2YhbhD%dJdy<TF@~|L{PJ#Wo
zBpL<?$Gzd-Z;H)+R8<FnvuDqiLmbpjMi0lo$H>AJTu~W$rb|7sV9oemOM)hR!Eds`
zd)_WChxS%=g7o}HF2oAgQtnhC53=kx_3fNwD1&C7DB%U%aqkI(40U5ZPydV*TC)S6
z2MD(HUUWJaz#m}jWazKdq2YV|UBlq+F3(#|Q;*yIG)ZsyG3)W)h^tj23(qK8L#;Mo
zbn^OL@BmPpAioKsr60u)wc1Bgo3$yp1QU2&PhqkNjD)f_2c<B35F}8Vv~Kbs>#B$N
z`fNFrtxajFSWJ<QjdgJ`e&D}tE94+;3pTnQZ8(9^_xg`rV|vUqF7I3n+4l&Z=TGy)
zI9^It%EEXj#tKNLGmS=c&ZGq28-lx|$q4w4ZorzGn3^nN2^XC0JJYc<BxR8$Bkq{x
z?J{wic8OYjVZ-M*t0A6(21}t`4l*aHK0Z2XuN*x#T)8+4EqYA1f~jjK;gP$;ZXQXf
z2dupJvoIBoS#>wNA3HxO4r5rm-mTx&ISP)&@}*G(OxL^YD%BkA1K9Gl<kyG&&oE)*
zm?aPynD_meauZ$Admc68kp&6YG<s49t$%EW0cVgFL7pcd>Cb5*dM483;V$jsOYvI%
z!fD|N;D$Im1Wj6_1;xZ>UqJ#Di#j7d1C2~-Ax3x4<@Gl7)6~ff;DOLumhLdOK$=1D
z(DYKL0B8z2Hv3Pf%uHL0&Z*en4Snw4{4X7$CrbCIsBiBCOA<u5qVzg_&I$WsCamJ&
z*!a&x?xemGPy`X0p>z_1yB~AiPSyND_icb3(UL~ta5xVipQMsh{Yl<^S3+gulQ<57
z?buiU=5t9ug5WzA<b*#HQK@IEobjtH`1(0uw+h`O=-oUuI5-$a)q^1KAr+=8ZJuHd
zz+kZq2bvF_20=Yq0;cnt<i!l(<gzOiIi5wJMJ$XzfahvL!Yh;NnLP*Y#qK;6%2Stj
zj-#|V*BUcCh1X~eWo|XUmC)DzIX$9wb9rI3j1J@0g!MUBeUY*Hrgh^&8*hhB=+94D
zW+2GHe33fImp06A8rTNK9CygBzNz;<s&4B{s>lGtucGlK>+I%&;PA>ZS!4F{MHSO|
zDoCS|k{ZGV*^^ocA~(#DY&j3^wm*e<jYyH#hXw~VK|dyL9m))>L$8rv&ze}Q`a#X>
zhs?-@Iv}USvaGwOhZ*A-H09U)PIovGo2vAS^nvt<Bt@c;vQ$6ya(6V1B2jkClV(gR
z9|UtiI|1h*23HtPPqC@|5Sjn8%^B`xjs)<p92q4TGoc@y1}eSV%3yR=LWhjs3AQ||
zC6TX;^g{u^-lN3L^I}B`f<dAD&1-NiHcev_SB+<DkxZeioLGrkAm`S>md%4dk#)F)
z79OKq%&AV-I~Y8rjN#77wDI!A7v9YX`RNvYzFZ^#<Ke^}ycBg-RZ}y~!srhudwP08
zswyit;9BQ;w-Myi2!i&CCqn?%5m>%8?ceO0&rS-bx-2?$M_M^%4F?YuyoLml`Yw{z
z4?;VGII&D5MlvAuS~?+NfPmyTeNpki?@@v-Q;YNmv~X$W(&Jvn8|-b<t0@afLs|mv
zJ&|G~fCj_pg)mV;e!$p<yCwfWD<V8b&l+4U&Q$sN{6E&v{;Nc{H+97H?p3VDY+*$u
Rz1j#|G_^FTHo9^DKL9Z7G@Jkc

literal 0
HcmV?d00001

diff --git a/frontend/public/images/pwa-icon-512.png b/frontend/public/images/pwa-icon-512.png
new file mode 100644
index 0000000000000000000000000000000000000000..51e9b15a1738cd2a18dbd0ae240ae3250af36981
GIT binary patch
literal 23465
zcmeEt_fr#Z9Oi~Dpg~3HO+-a{??n_)x-<zL>Am+75Co+NC{>zDliq89M3EvbD7^%t
z^bR6~mgLs&-Q3Lma5MJ@986|23%l>TpZ&a_@;uM`T2Dv)GBq<b005VtJbt7P03_g7
z5`c;VJp2tBKLZb(wvY9-0U+cK07S+Bz`s+G>j2;{3;>(f03e$M01RHa?N8;wKTtf^
zRDT2z|NVaGEPV%_x#aa2<_iG)n*TnKVug${@Fb<*6Kz$>%}ZpIoVShY>e9edJbtPs
zes(r~_OiA<_TT{!6&95g5SA7YmM|0%mKBzem5|^Q2EPcqx#H;lj|<#A?VKHg|L+&D
zN$OUD7u@^bBltPH+xz<2xO@GtYh(n3#SMj}WW_{f#U%gdAXaY2#{gjJ_vFz7!=Tw6
zd~k~0jQ?VA1Uejzu|@X}m7AA~rZ(B_q$}Uh177FRa6YXnY3J1tvx91Jm-93aHx@}|
zHxW{jLVE4owR4oz9O~=x*~PqR6<(C6#ybT(HLQ5>l=IRh00vNh4o8;{lvh^Hw@hR3
zouR8xq|omkK6Lo&9h}HvV*e{I+#0*kf&y;A7fpWk|Ns1d3;e%XU}ngz3ab2QIp6?(
zG(7;P?Pne0VtyocD>moXMAMH7cy7ATNo`*<@?yXgDWB^4w&n=(>QyCah6fjBGmo3{
z_X;ySHR&-oaI4<_WN%6hcmY)dL_Y}M8*?`jQ!462v$orK!7K37Zmy^5+f(^gTbcKL
zRBiqnvbk<nfU;R#dOEu9<VOTi)T#{@1HXWoP^;OfY1xt%pXt{h+ym%RtGLHK+_9x2
zUl$ih18+p<<LzbacrIoS^|B1G(Ey4<D)q9OW7R9S5CS5OqTu3B=`UzLllb%)&xO|z
z1vg;dtIt^MDffE2cSeNjY6ndOM4B|0`-GKJ@c0z2xEyv$n<y)-b~U#KpSQ9mMwm23
z+NJX81Dv;V7JPu(&`W}iv{Fv0Yv_U~c&A+Hjk~;VO2y%<Yh%(-h(Xx_oF(W|5Yu7c
zcRat4_E9T5Lf8d+^VOqcA%3NT@ZG$oi0`+a6&Zo%@y~UBcL&I2%!PN-+{w6gxWo2{
zosxKMIx{lP1s6gyeOU{;>etPhJbY{%i&wCge#%E?XZ!TuGzv<4W#1Q5gci3EX1Y`1
zN9!1AU5L`lL(~A<<^5<B<22QXyuI{*ortCstq*CE@@gs?SqLag(vyS3PE40~o$V=z
z#?L9BuA`zkwBJaQ?mE<3@84TR`>5}c>Lk({1B}Ag^5AFRXTu}vCu^QA$I}C^`b(A<
z!@^dSGK~N1g!IT9Jtku@1RAOAT^VjFQH0SlKEbV%Xezsoo>N*wy`Za<LCzP#xZZ>`
z<$||+iL%MZl-;yEySmW)xrmLGrU;ftf=>nkRXaXm+NE!Ozxt4t*dN(>SN^K+0_+e3
zgIlP8kZcWRGr2wi3l(MOSdH;qV`aK~#uFDZ8b2DZR$;z1b>GKGoP_h1StN9Tn3XAi
z>i?>$e|lbg6$;_d?IZ^5T;a0d*vh+2c_-@p5^J}#dLjc8dW`?UeUUU*?{qg>W(ZyC
zFz=+t3Fm1|`Ko#h)_@UeLm=~ljylV$9G<PCBx^}gkXrW(JKmCBcnY7jLsk_%%QaZv
zzd>^h!fz|;z5|LJ<be}$FE3$o6vnv=Sq)>Argb6plA2bumeYN+rkvWPG_5+S-~ORr
zwiHl)B$>4GLJ61?m7dh?JXqm6OKXDi*RxF*#1hrVI^)N~rUEa2XyzL=(V&=*^S;Zb
zwjqYNueDBUd*%8YBATzy7QRy46cPH!_y=eDD>of>iiR_R5B6_<ZSzxVpO6P&=kr1c
zaxOU2d~v5lAgu{_PT8x#NEzA5s=4SdrjfAicTaeA>g+OIn|u=ZK4aH(m2wqdN5^tt
zRiHjBhWMPreiDU<DJ(-)QO^Txg!S5le3-z!&)X!seZeWASs#0xZ-r~bwTaIPo7`9*
zwr#Wu39nidygEu1`O59Sadl%Gq`RNW!;az|1rm3^aatXF9c7DR8&+@q#?CujqfG+E
z%0KxY?H8WN^P%?3Bq}xWRh1ieWpPwJ!HEpC%}07N6ODn2_j|;HA5XCniMpi8q;o8R
zw3$@E`@CXFFRS|;VK-ZFku&9z`x=~2+2YE{2G2mZwxhyLFl-m9CyPo*^qlV@(H|ei
zy%M=*`wiobGrAmGJYk&~+HrX|UZ@1)VTIww^goafM-RX&TYh?&85JtY=BvkFy=%qH
z+UzK2;7;uO`4jonnEGs%hXimX1MD^EJNS%f!Wh;l8wYR{EM%(tZYjQ_68+CZDB_$>
zh$r6$NQtwDElW5a(KHeub!%+sT1zjk_0dCpVp!oL@*}O2v(2+3-wR3TsWa8po9s*%
zmLZ5+g?G6ZM4LGRbd(fTCqwCisFv8RI}Y0a47#OS>QYpaL`K$etSQ!#@;5^p+<)DY
zgktidZz{D%J&5vs4!LvJIR0`%r3kp1r}|tkV~zRn%@NFm_#>=P#(pTJwO%~h$s#i1
z?ltb*@SyjjaK@l(OHpd8#3l;cqs2f<TP3eo9rE9|*IntC7=-uUsjr_{OMgz6gA?g4
z7T=&cUGWaDY2BJ=GW+WzkjRVR@aYANz~vnw=$_e`!&yG=94{>?xoQuKunU6IXhF<>
zROOPGFrDpn*F*rsMI_Cy@K;QJ`O(tZ&{fEpLO<s!T?j53FW-wMEqKyROm`7qav8vV
zn{|4y!at%Lxd$xvI>1%hI#F!B@wvAci*JM#`z<8zPs`N4+lQaB%GcIjaK68iGN)Yu
zJc_MY4S(puSnu}(J;aYbls^xJ@9hZ?y>1BiyB{Z6y}YpBzZv!$Ue+ahf(d3d1lScY
zUoU{w0y6lu>8T)kMC?e)<u;GqZzue{&xGOESY|HC1W|ZE_~}S5T6pBMx*H7k&pP*a
z*Nqg5`>Q@)1!fvIFaI&~?Cj|ZkKQ5-4bdV3_bhdmHEBQGqxNi>J0e4Vk#bcy+uSPE
zEpWi?Vgv%wm~cH$kI{1}u?o*Sw$8UdvK#U%&C3$xDi=_jS+*J>W{)`rH81BaZeNXD
z@h1SyWPdr$V~Pu+eD3<?OL=j_74#K_ox*G>O&!%=aYKI{8`To&Pv}h~Xcm!QJBaBE
zIS~TVWYVOB8Wfz8FXFMHe^l6&0V)iutm5Y<wb&8TtNB6K2^)PMuiKQHe77;o1KPCH
zNIA`n3!h4&>iG|QdU~Gw`Hd%hLSf=02_kC8J9ARAd$>S|+>o2-L~ex|buR@=pRn<H
zh#VgIF2BLj+ChN=GV%K;)h~x~fh2;2m10DSB+_AK-t5~)JQr&OG=RvKb+$IDK+oB@
z4(~`l(xCEMYv`R(XQw<5t}TGDf0iILQ6il8@NCuvkkwaJH^ne}-f<R1{ah5B%~5ZM
zXnJQy<l?Y#3|LL>XeOG}IW0(}oBy!d^r8ISnA-X2XTE1f-EhK1@bNANQFSjqH1b?u
zW+t!9#<Ms!;=WNrj*gWl1v#v6dpm>{i2qB_DqhN?Bv7>itnOW&Ejyq2s}_hyr2BD8
zqez;L6%(eqpOg>xu6rGS2}N~L9n+xhqDokj(=e!Wk4#2|AmOG}ot(pqQ(Zh0eBZY3
zw{^t_>{Y2X_~0+nXd>F`g=d&%LtXuy$t6|w<@XbD=el{aJ<H3t9n=z2>*_@2F+Wp~
zZHRRHjl#mhy6kUjyJ_~{`}-d+?BVV{PrU9Rc}45}%;)T;u|IXrfs2{UM2lU;%Z<bQ
zx)4-r_72${OlRlo<G6Fh{Y6rE3JK(=E8iA3AmvJpDv0Pf<G(THUHg1LSjMH5d>(Zc
zZHa98aAdA_F#4ds3pnN=wIZv~AY^1_^&zi{kZVpP?2-s!FIYZ>=bY|eJ4ZC|$2>?!
z^^gkti1+dT?E8{8WWd-Y%l3uvC!ytJiq|Y#4X`uVItnoYl;0OZcRjesZr;2Z|KrCG
zlR;7xhKY&EIo-aEvUPCi7;--3rc^5@@%Os(<FHT6KcyOUs??bxGZ2B2HdDK#Sd*%Q
zQpxw;H0ls$9{PEGP3H~fjAFo=g&wLvI|C;>_AOhpviif|@x@zG3fKjpwv1m|#IE)Q
z+x%WU><@#I%JzxAXz@BTc@?dubcX#re)rv+I_MH6otB=bhoA0I*^Ex^&Nd}5a;rWS
zmX+;qyuuX(%iz&7?ml&XgG_(>7ck|DDf@Kq7()3|vJO{--qTE93@~4^ncN~5S8`;t
zJgBg(T)XG@vrkI@3Mww?e0n&GVm+L=M@pxT6FFaAT+sxG(^%FtrNhCP9$albjVd&3
z#Cgwe+dOl!AZ~$1Z-KIE4T`NoM~B}y;jJzEyI*%R5fhK=2yv^?&XIpDLfzHhwHq8E
zene7`w;{%%(RDC-3wcJNB@+fY3E0_5F0_umcmzM&BV8=ARCxU4g-^phAVvG*`vNJk
z_)o%tHKGUZ&d%S7C&|Rt6B_t0Aw7;iO1`VKOG`@#{qC;o)4z5Rk;!f6me>*TL?mfz
zL$l*Wlhd8vQ(2)~%SqdC&4;rL`e>q|DY;kZ#gx}%-iFfY7Q~fuooO;)8sb3iE$3J8
za&m}Dl1R01HqW_{oIJ%0cUg(>d>OKD02Tk!xQEL8-husbx?@g-wmo(3I_||<c1m9S
zQsK1QP-OqE`05)eUo^|DmRBRfGlnjQr;5`b!&6YWQ#4#L3sy<;Qp|D0Yp)ZxV3e`a
zH&!ByD?a)aIv=jP`K8G<37d3LHGVgsVfLV^rMJMe2B}ztVRQ5AcD8ot5C1J8PmmA^
z6dZz<pFI5gw^`;U#hwMNaENGW3;x%G`hsx#{qx3ELAcc0{XnC*_llCZYmDTIZ$#eI
zk@jC=AS4owX-qiU6VxUtG&pVpC!EPqBklaH_i_e9I)K+<-+ur8U5;+?<Z%0KY`=j!
z53eXcS_x*axDPkF1FxB~4GRnVin)skXQ|D3@N}||GJ9^GbQ=;-B7yHtOKRH7oP$Pc
z(r3Z;;J)1?kuq3+EP5WVtA7hyHj6tHZ>pbvZXtNdi>Iz8LnIZ_XBB&JDeS`ga5A7W
zw0C<u8GAPf=Xr76Gw(zyW|#Ms#Vek~RhgHblya};91WU@rLHps)g7h_$ralmTk#Ln
ztmmi-ES!q4_hm8if?rWmH=sH$nf3}=<6a-_){HgHujy$Wujz8lTC0##$qw-uH?SyW
zd7tgQ+<$eq>wLGI>Eq&Frh~C@Aw)#&&fU9n_OOMu-DHyF)^mJWA5!k<xKv+%amDW8
zYP-<H34B>^>a4S!Vz}Dz*RB`}7KmKm#cy_69g*x%Sp6Qq9pfyvM;R|8CPczLm((|M
zzI~TivGB$dKbKx;wyA>Xq{Nj*3Ppx92Q}7>3z-#`Wt=%F7n9FJ!)~}qP1B$fOo*3F
z_c)4)*a3yADH3S3^;n09dyx&K&6ytPZ#U*Sn{YWCb7=}X=wS%nuIuZsPYm5{i?ghG
z)*i~F@?pZIuCXyKDKSwxrH`?6uwEX!s|)D1otILm+GH{RNgMvPy?P}gN1%e}l7`Af
zSb5=KfkGLJDUGTmnd?XAW69MQeXMF3*l&_q@1J<uLw-=;m!xTIW}|%cdZ#`j`;jL~
zGQ=5TH$|{lsM3#HgR)vWJ6~kTF5KD`fJx`uB0fp>5uUL&Xd||<N3*dfI<*Lj3EBaX
z_T*&~d9@*myP=X}+*;84RFV@?f+JS3zelYnvG53zkuXRAJak1ljsM=W4`A;VQy%E-
z&}b^a9<t7rAY!}{$ab&X2oO<Ip_)6x6S~A3;mO%-z^*UuTwmAiLR9zJWI_9nb<d*w
zizAm~(R1frBCXfebt%5vmhX@Rg_Au(^8N|*!w{*W)6Wh(z5V$+`&FSfGs*^4swm<%
zQbO^>Qy#emC5+*1e)WfcYfYv*j%Fh}CkvW5c^9E%zjN5MT5+AOiaY|xS+&^5x%;)1
zB`CWCp5+KXlh!3L%BS;vRwIagSYyg45u4}kiB8RO)>E#|ApvGyRW|!Bs!#fZb>IQr
z*N4tiEodOQ<XhK)A8)6*B;2X;h7~laf9E)r7Z5`@IXFfpI83e;Udo(WWgvo!AnNSz
zYnvz(CD)s60fn5e4w<zLG+}t;!G045esS+(?m2C*qjxB+qf+l*Yx=(T520Ht?UPy;
zmGIy-Yb%mPXaKa9V=XRh^BgU5wt3DkzcOmZ8`)^B=4$lfV^lHK14yKKK~<3VJOAn~
zZJ`PlW?Q`t^j_=I6&0!&y8img*>Okl-d4&W6h<kVnOGW$Pb%FX*Gz0;Cv5gQZMhgX
zkp`iMBKn3Rga+#~y9h@$=!k;^tK}$4_Ro^q)XGDL$;}8tXmaI6DJI%ij#F2RDlq>=
z!dO`?RPXrL*HB@Zw+5mQ9H$Ifk%2$W<^s%Q;G^wpitZ~Hj{CnK)Lu1CR{kq!kRPb<
zS&d|1_RiDvhOABs0?El?D>7-un@Y^Y<aRB}N@jeeCBMe#Az82G%QoF<>*|;<6pyRY
z&$NyUIuMgJu*tTglek-E=3>C(A&i(<1OMQ_;TpQHtgLK>^TXVZ$6)>T>jyWb<L2?!
z_m_QfJR^tFw{tk~+H_+n@Y3U^z@hB|N7ymK;dt}(aBYxIWxCnj%+B6`r>4Yu^FnFc
z@)R8x%B6WYyUN7QDKy}6#8P~{pj|FzO=(*FZycBWBPX`~l*OdFzUOsNA>428uzfSr
zql)rae77ut&3MhcfxnS-?dJ}e7wwXJZFg2DG=e^%kJrtE2k^S5E~au7MKe$F^np3k
zd_D4P$P{S_Tbmrz%kD29h|q3mXiyXt)o({IsD63FCYRB0u(q}q*l1ey5cMol2$EdH
zH5rmX&vF@WthI`;<f*lD@a;?H5GpMx0k(&-#RB@+0#EFHA&MQYD~J45A94q6+BrUo
z4^ce(D3j=&LnRc^3jNB>s0%6hnm{RVGxQnxZ3plE$6&GPYBMeKEQxkotA#RBaAb~A
z=of)`|Bi<`6=A{pwD<-cr&WBA*HE6QLgP`*QI;Kz0l>MX!~KQ7HB?ek(s((zE7#qU
zzULKU&j*Jvt(qitIKC7}<P{4Y$FxYX*FSF2GaG1`h&!uM%?=>RooRMw;UXIv>h0@$
z$ZhkdFd*OR^kQ4wPDJ?WqmVDKb?LcPb>6R*vtfxZ!Uyd$lj6L0DHko0yle-N^=E?d
z9|Pv@bsRItR`G8D&|>E-Ii}my`C3g3iez9*u<!x7BmdEC1+cT$VePb6&9*xPF{3S0
zX3LSE?Gcn&+1Yj9zkd%$U3WNU!hSdW?%9HXYVHrZKJ0e+TT_{BWZZsEB5aVe28Csu
z_9QS2y3aLR$kMn+q^;n>Tt;N1c9zL=3u5r4y&Eey>oDdM+L4F6+z~9oGM@_<&0k*H
zz{zyn8tJu8`d~kO;MlsS%k!B-C(2l9r+c54J)$5L8lfEcOsI-pSl(Bb!*VXQKcfUt
zo-_>aLUsvwroZ-dFgj8gs4tpuNz&5R#=M*S1HW>z{Q(#%m)Rnu{H$ati)&p7Vt%k8
z6?^Xf{5N&eyADa%qPyHX-#4m^7PC4^a#=50(53T9(Ph>;7E1PAFm4;)LWwi&qa~c_
z^YST6$Ge#3s`;KhQWnUFo)$V)sOvit?|66tRkGL*g+5^A!aU=K_^46?c9_r5^C{*R
zg1pk}ezHsUFm{b>d;y!=(ZCnAC3H$}M4{Bptp^R6aDN1Gf)rpK0B(|ubfVCZg1#Ve
z9@pkrc@<;VA<58B4)`PcOu|(-u<htg>zTAaLA+4Sk8tZce)zzMbj1ZM{f_!s4m*~E
z^E2&FUm@U^PM&YdELb3P6-3;)Z^yWcf1KKaRV^S%*==tRR-XhsV{)-?FD(vd>`L>P
z5LRKm*5TfGir=!ClGL!D(+A{5r;ENXJdt5e=Ua1l1>U_$4}I);`@(*gU4;rC(s}yn
z-W?2HMC_bozo)U6SiRa^LSxlM&YU<m3=AI1r`fla+c;~@neP&YiF=QOS&n34dQ9Is
zh}rm79L&~#*|hb4lUyn~SwI#cT2wn>9EMz$1qboxzLDmf4MVz^#D8ME%oRp)QjdTO
zPUtU+E$<rrVwNDZyt1-)Ma~+vsMZ;GTk%O4CsU2D{oO)FKe5&_u=MHlt4o_JS=<}j
z!^KUcNJa7wo(1O%rP;$K4mmDy$zKX%I>{E_w(`74NZVgCv-=!WC5>eevb=cwe5Urd
zQf51RiP%uKKK$ol@sG#=ZeV)gaQdh$O1@L+=<2%$=j7N=-pHzp{O=MVR#kaPtRj|J
z5rY)%HA#t0H>;Y=6X`7-+NRkh^rUSdZL5+)X%gfDwm;X*GTPxRFtN&(=PhU3v|fxX
zZj<9-)ux5bGxfxpzlxXV&H_zdFDdTd9|<-3wEai-K9EvT1bVYpIN!{fDj)jr2jfyH
z1}{`%S9)%op&~%6+_>nh`dVgCI^7lC*8A3KqEfkG!|}8wkR%A=NU4TM9ebK2ZaDMO
z%wE>or21Q}8-YA`Epm^f<`;kEnX>>St)htL^Spj0?;Z=-Y044>`7Xf=cL{bHC+C$2
zrOD~6l36{Tu@s{F^~kWPYKuI}nyD)I(zn;ww-=E_4V={_Qe#Cq$OReq?;#sjlH=m#
z<`H{#zDW|)Fde;k=viinHhFEzeUdJSJgIzwFQcRLX{p;p=xrYuHL%=V=6Hb!HMXj@
za{zrrAZFhX997;6UU*R2Jmgtubu!hk8k&<m!zc`+SCtw*R}aLEpIC)dcgc_lo1u;~
z49-r)W5RC+aRgnKPJ1iA*8|pWPO7$J1+^nm#J0C*SE3d^!|Trc<@QQriK<wh+-Fg?
zsNmVZ2jaYX@F~@5Wk}@wwS<I({U7!b!i>L5r?%3Mng+OHhKAUyc`g**heW4uI!>G{
zM!*K77YVbjHF?4NUnoVyltPc)<h`({iFqV7Y2x?!d-B(KqiD9VB#zQgdPPY3L`F#0
z4Dup(oW(!1>#XE#zc(UpI8vcLawD<}$NAC+v90w<E8Y2X(>K>HzP`ConenY0rw=S=
zBl*eX$1~Qt>}*8b%*>3Bn;U<-oIUL4hTorheh$$FbnCfpX+HL^DaZNEN!nUdR2pLO
zpiDP>^F*raAgS$P+?AfY1z|tS+$qD1l4n`B^U0fiqsBU(#F3LY3R^N)9@ko61B)-e
zI3^9G4L0;Nq&7#7sSJ}LZTOz8jtLW;a}7}5SPQI0ZZ~}gy2dL5p5FVAo_g@I9>Cd>
z!=@0D7RMe!6{%A?c7O1XO(4;&{1WkT;X!g!{@W1AmWA3oJRsz7MJ(sc6~0p=U<5l8
z={>_=)F-c&QGAecXg|M7kS<t5A1!iCd-wbF_X;m2^-*#urVl7_kht#tHSrj|_C>Mi
z&#!B%abx5CX04skzGOiKs9;emY%ul6>_CM@aF4fv-J^c@VnEsB^~;wJp8J%JeVl!;
zE4O(127Xjwl|*@k6@>x2FqkQc@r|=nJKH?u)HQ-%Fd|&>Eh%=_R;0I#aj7-iUim2t
zrY+;>Yyw@yzm>qWEl5*u%+Ue8`h1U7(=!}(Vq0pEaZWq^U7Xp=(e#GsTk2oq6ExIS
znTN$){@(st6SZ(?E0Ft5nxx}O$4lR=x47)@Z|V>xpB(jOt)Fk7FPF99(jIMOy|8Ty
z0KGh8y3W@Adqm5egxJ!c6`>x9Kb||leu)O#sbnz8qcH^<M_8qt)$lF1Jd6I8@*zwg
zCVT+XH?Kh1?hw%A55zKwo5YH_jPwb(pJkdv{-8u{Kb+UB#ZhMO1xTIXqgk)QskRsB
zsSL}%>Q(vI-+k2d?zz^bs*lHcgbz1g;P0jX4QDxg*NO(#)<wI+JK4oH><wwG_C8@5
zxr(ox{Xw4brMiMK#^b$168z`QF0SIF99S?G1raoFrR(eK3xwzv*$_*ali)^VcdYI*
z98{Ieq>)+QCWjQ3*&V7!bagfPR!BT{Xt9b2K6NDw_dVOa>aD@b8p6{^OItBOW8*y9
zcZbGDPL23iWTXRvD42~3-0NGa`|>%G!5UY5c2ZRI<!GFBHYJ^(N0^co5)pH_M>SJ$
zV20*csZpeQ_fD_z1A^+19rfiWhvDNHfG5?&j5ep&db_40%z~2F>>UZv#`8Qei;0Wu
zd7=@w<$I>Fv9Z4)oeB=e^!qZ{s8!6=4{~#g;i0T-?ULjwn+mz=oElRiJL+;^bp1C5
zZhI(yv>bcv@2@hZ1~h4yo<>uw;Vk{yRcp_XZ=0x)%+H?!<qRv#-zS0H5~HK=6jUe@
zpY?nDDFFwCswrk<aF+PcaHHg5RRtVlp(R}KHk&OOTVu&u{=pM7_?G8Yl@GHjk}=8|
z_Csj2Cn>uY!>)Q<Ww<dK?jCM;BQo1vtU>M})!aj>s=uK;F|}a`LDd-1lGtI5+D7EV
z8QZ^6BsE54k}TpW_#U1+J2&=~zMh89BVV33@N#}O8+;*cX|`xZoONv_UOhpQ5#4K*
zzB;_Q*86j-0>e%D#;j-uZ+bcAOD?gd`bWiEZPiZxHk*m}#PX|;{RtJP=k@QefRzZp
zfB@#I%1Kc+{?>kGWO8vF@7RUAS=7e+a-pXce+^c;)*|7g7d5E3roEP^uR|G`WQGR7
zv#|Qo0+Ul+$xDYyk;3F-aHg9P;{9QVPFM(zR$gV2<r@tJUiyJUobb8xP*++>`Z4qp
z=aRd|?auMT+$XN5NGL(!d00lJ|BI}fA|^u03tuW(Zy#r0_omKudc$IO<x3{V452*s
ze5H3?g-=R*Vze}wV)=;udCk;ZzWq$*@OBNL^o*t6p0x7U!u|J2&$PJ314{=IL!$z0
zPZrB#P%K)sTFDvRdqe}{nrs}E<!}4f6IZ-%6?6xaUd&;MO8aog#Y}m7Q1sL&;<Ch_
z&gO^q_?@up+s?J{*n{&{r9R)9yl<{$)Cr!w4-}*OX8U_;^XMOWFk5)7l$5`SEa!5f
zCu!&7!Q)lj*O4#^qqXI;r;-|byPAXIeK|RRkqktN2XNYnt&vZypH<7V3gNw$sWEV>
zShd6RF%laqb0Yuk;Bbg7=yk`rz!03_VzK!2NTVrlw@R^vIUS$)rT=v}lm@BpL}b^+
zL*elZ9Dk$;P1k+;&D0h|dzB#gVnq<E4CJam*Sl>u@_3MG$}MZ2S%V~v#n_&>7OazD
zzq;Evx5H@5AJWMV%SaWB=g_<aKf>6aZG;MFKdEAw*!u`G4xpZPb_mRu^^eb!3%n9B
z&ELz|`JTiFXB36CFIdmaC-zTWY|Mu9M-#t)IIR0}p+q4vh!W$xw#R>oA@{ZFdXm6s
zcIeCJe%BmXO-R^v`N+y$Ey7=ZAJ(5#(<tv%BJqq?AU$^HCyL-{98Z40AsKRUMAuir
zia}8~FGYW*h@7Olu!7SNM&9XlCKKZrJeO*$nyHVPmt#8*N8~!dkI^1_DAA*3@atEV
z(;Vb!PS%Xm=7CafeCxP#9`Vc}30)c$9(ugpRx!5WwLLA;j`8@h;Wv*FSc#Z_QRo!q
zk6l3OxVTY1@fO0P$_B7zF)!s1CZ{Af3n<_rDfY<wuXsJb7)DOvnjU-3Agtk$Gkey*
z5RJ#VcN!@VqL^|mW4`EQ;lGS3=}c-oc+<c0k*3Bx^Zo(U+RiS<Gi-?^Y{%8ABI81a
z&VVze#k49KrCa<$$?9<-FwyqR{L`KG%FYmU^Pg}mT%<t>az#i$VE9c^k`Yf-#rIPa
zBX|c)lN=w&Q9<<Fx7i<!2I_~{RAO7GE4_Nr%^N!Muj7!k7d?$ywZU&NPS3GCyPl<A
z2xQxVR8@PU3V|76Bw=+guV31E(8uxH`m^1UasvJjU(5OwZ~glcU^$jeDI(YEqQ|Pz
z7-Eu`%0F11KrBKiSvx4DXW)07&4nlSYdnX0y=kYJY&*s<x>++SiFK7c5pUOIKotVA
z`Yz(Q@XrI&j<#P{Y)f;Cd9&tbxUE92ujzs`A`teeP7v7|#S9r1ok)jz=R>+kJNhpU
z8vIHqI|)uk2QleasYt7Rgm_YOw80vyc4NaC$SEkm9UL4ycqYsfEg&ektD!)6xM6El
zH|#l9&)+68yofGBEan-LcNEyqY}E5_DTMRI|1QsjSmLf$Q3La@nN0jbmh@!(G}mWT
zdxJA_*`p%8`%-+yq{eQI(4bmgU+|_b*^SXP7_NR$=--v{<+tig{piYI)rJQVLI1KH
z67~Ew3X=@`uEs|CgiqGbpTF>EL5vL@lj4fWP~`{7Ww^$hH)fYNFP~$!$=FGB-p~Bf
zDLq{M`ST|>Zdj$M$M-%2V@~dar_^V;i7VxBXZ`rlk~ZXLtOz>^x5KjK=pV7%ItFK7
zhJESYh1mrN%$;o0Wsq`8O1!!Nc~zSBf^iLYGbkDn{yIUd_i>-~5KQAVic5kpA*#&6
zAI_RV$LquAd}36s`ILUJCFGA)hCK-Ef&30vOz6;dYU7esc!HJ08B4STvvlN+!*Of2
zf{g<QsoEBd7<qIa-t0ctJ3c<{F8ggoGHf(y7h%voMkDOGUlDOfVg$X^L1wO1Q)+4z
zScTaOp#y|zI${nTK~>A5jjW)^)+ipe(Ue&KcV&V2{^mV;7)VmK*>J_IY<r3oPPja!
z?-BPBwkIws6wTMv6Q_`8KB!NUaK+TvpU^b>;8Fy-RDok26Yk;?&sdlqt+uzyF)nmD
z;{-%WOHL10?#xs27JFdT8ox}z2R{spU}wasC!Va?cj7o|>K}@4JL>+Dr@5fa&HR2r
z(kWiEC`13sBYOXPxUj8F)6^$RWF;Fp;A2tF?@8fL?0kPsSWG8ZI(28h%{P$we#Gq?
zDI4Rv)osKiPf9P(#Dib_gR2P4Zd*P7()f59gX)8$a|Mv*bKl++q$G{rc^O}udrP@-
zi7dZoy(sc8XORCjE6vRLIDT$<iVM26^X+`;uit~$&p!Bh-Zk2@s$L8|U$~sg2Vxyl
z#RDfbXO>)KHRWHlb#!z<rbG-ObVR@RIIsfUu&Li#Cm!0zhE)tC($|h}_*sfK_}aI1
zur2_5ezH>pttoE*GfFfo#S$d=3QWpN^ie=CM04-!G}%dEbde!Ksp))@afdO$WAdHx
zR@G@R)*><U`!-eS8s*-2Ym+b^uR`^F=O%t@JoD%u7WvKvjdR)M!2a$@aGPr$9!~TO
z-!eOHP&#jTSN3C(bh{kW>9lPv$kJUK&OGbv8ObCj=jgC^Q`Nh=nagnXNji(ZQKDPR
z+>|%f!z-Ja#^v}kDGsYsHRRT}Yo_jnv@(G~uMK{)^*2CYt!QF#rCT6Ov{ANt5rN;D
z{0ys0DaW(*o}~PAO{a6Z+<QyDI^y0`EwYjYOg&rrnimbJsaGSXw~p!yh^GYwv|QVw
z4GO$ejAa;Y*F4GURf-4h*vRbguS4vT4SDzocpGgkf-<m$hC#6MKC{1B3=r&Ed)&pm
zP&3j|FZOVm{MKSGUUy6|&cC~aG&Zj#0hME|L}nQ!+;AazS?yMQ`uTcV=Ft;w&_y;4
z00%YXB8S^0se4DE!k6*7QoAJw=%k9X&h(_)t>MnE*YZI$bMog;eWfJY8>&ygA@;gh
zQ1jt3y2}m%m(BgXoL$X{tK3cgG+(|@=4cB*D1`|KZXP0n%~R|Kr|tcfvT<C=t4wKi
zTib+R^uYeZ+9_|dPk7<K&{7Ga5un#;+!q0x!wsB$0@u%-Cbq>&#WYWcZ;Yf~z=>gb
zdw}}VuI!>@mxE_3`8J4jhjuP>?&dqf)L<E^6%&6NnNjn3V3bb!=<(}EI$uk)&;udq
zaO+u;wW{Go3=P7}V#FU>8iHSA*})gLZw;qLkz?7g!C4X4b6_8EE;LpHwP7i7bhDdh
zgY6~%CNRP3sc~FBVe32OcKhg}pnT_R^X9H=_=Qh*Y|`)fU%Sbqr4Om<_y=(+RN)kB
zJ%6tK*qm=GR%@;ai#T~grE1hT<rN*Fp+7G-S(xY;DHh#3->ZMl&OAtZ>U1Rrl1sKg
z`Ucf@jf1rN3rUxu%HXpd=<WI|yg<s9KK)B6p>>ciHN112Z@Of)sHfIVWU&&98XJ3z
zz8l3OCI=03atPP&dCaoSF!ZBPed8#E6$D2n*(_!(PUnAHk9Ku=p~tA;SGgKs*oRmr
z0bb#nDvvVHV*?&)S+6iXlYT|iO^5xu*_N*wHYER?&l7C3-hX3E`f??*tF~6paFD2`
zt`740ov2+dU*gC_rfK?7jV0S?q`SlMqcb*;wBO#PagI=88KPr4$L%>fJHN)C;})kI
ztRyHaGO%(@U(Y9SLfDQ=+kH;OXFy)MoDi}rq$rd%=*l*%w(y$>$88qb=(~swv&#wd
zqTt~1o3QzbYERXtCm=JgRR~no^W#c>5#?Cc(s@rk4V;ZBD?^54_Br>xu{XqWNCl0#
zA+#AOvHXL^D|Ci~8c{j*QF`I8^WcXEXSXLby0>|SUr9zEFi-2$%IWW$k^=#+HzV&-
z91@P@r!Voxd_nj0zEONn$UM^Zt@qI`m%;oau1B|y){jEw2I@N&F&r8UKOC&fdf~3q
z86_lL)EDBl@>~TZeI4zqhTn@?k{fc<7jxo9ulx;RculyouV23Uj3Fw5+UJ^YtypX4
z6B|!2hdCyV51m;ei?Kg*f94`GC(m%4K1N_Fm3ZRXQFSb{tC&~*Re@@|^BYy9n_$3e
z3@ZmD0&)_c&6ZnGaJScFhn=Y$E7IHQB7?0`njNYWo{kN)yA@5MCQB~x#`c%+K1A36
zp>E#!`wJk5&E@n-%T!PH#rl1JBy~-6sjOjCqSSSN^TeOMsDG!J7ijy``*L<ulc;}8
zblN;!%nOMcR(k+Jts44s4vd?zKOuj?PC5dq(bd(3dl4>9muziqL4co!g70y;Z+~Zi
zkI@)J%JzPwsXG7=@n}Fg;Vvf!G@ACo2e1BmgCOtQ0$bopzi48<K@u9B2!BH-GhCC)
zC;hX$o-A>RyLa2C(`tLl(tK+%ss9G(;(Qu82-LtG<%$gAOS;+JE(Lcwv5%?60zyS$
zDd=yEX!pe~e0Fhh@sg3*-fnibJ+D)%LN{<XLi(h2>EnG^&172(Y<>~QhYV8oL{(<=
zZ$^T)dvPGTT6!uRz0SuAPoN<BZ8JkP?A-s2R_?z4CpCD^aN7Rc(48pvT}4wfwc;dr
zbF8o(V$B)*B+x2RM6hXYM<%eq-s?(wlkf6zmZJ2D6H`UpF<bmgl5MJ+T~K=3Ym6M)
zW3b3hQUW)>Vswv`Qy**<0*z*Qq=DUHFwWom-h_Yo%KS2zZdH#q-NF3N3lUr5Aaui>
zi0d5q!Y5(~(&?FdOgW3kG@X?%SM}Sdv`C=sp}%$+hPG+<Um$S$r|S_^QT6=3Vuy4p
zFl`9GprAfI`St79`E<PsFGc68)qQ3Bc5CAH8#)AC;dN6-s;bOdH!gvr&>L>gOclIn
z4>P&C9<6iOHcl<|1WzN`R9yE%G<|n@J=W<|J*584ix;S!ZAPa0Jta^Qu^d|M=Xt!8
z*7X4`CZIvCMh@4&{>5{a{giAAKU_lDM|clr3qiWl^!#aypkD6DG}abJGKgMMlvcon
zDf(<f*PM0XkuMLeJ&VdJQ@{8{36U^}ARl)%_CHg)ce=M{AB<D-y0uTtH{Du{>X!h^
zfM?^M7uhR}z(j+<<m(J}zJI2)bI~GU1X1??x$T8hA9mx~xxzZUZ4_vAfAB5cSN*C_
zMcLT}3ZWSwKVk$8>1LriDkmeF=CNziFbQ^DIxOX`a@Ry%^9neLmbSAvf#cPMXQJpT
zc4{fe0bKdt8aIB8$+w`pwSt9ftDI2hU;WcBlpH|fYH-)sP>CzKp`9yB^Y)?bE`bTV
z_K(bRgh_(lG4T8Ma|Z`^u|bfy_ZX;OKAN&Zo~look3M&><F4HSV%+*aPVLcskh(-%
z^Ss=ylg;E%5eTK5QTCf1xG@m`kYTSEoRD#xPxsZ2Z!J1I7$jBc|2QKG@M%una6Iym
zKA*?)Vjbu4G$OryDpcG>coN0-U3O3uaGJDul9Uq`G<+4veQBGL6e%GT*VMb{p0fX}
z`Ii+(%+)x4X|5xJ=fR!0TP-gHM}1WB5lD?c_g%Yd+^vxa_y7h;62>EdH|;X35=p5l
z)oNM2qqmnc18Vv}o|dblxv^3Fx(eq%GzIjoSb4O-pr~h)>6IYrYZ>aats@~20wQ^m
znCWxz^Nyke1()?reLw4ph|%9zHLcVyf9?aocBZAp7S4S6{XI(M>d);bl7`$sVAjkr
zmjOU6*wS2X&nn3_N}@LG2EuTCy}kK4d3g$p9xXP)E93PKieQG9O3R!^t18(|6ug47
zFNdd1-O7mv0Vvaocp|NXvimKbVC`(!xeqQ?pfsP#q$svwvwp8C;F2Fs2bKXwCEFT1
zSil8XxoPeMAXrpPs>QQ2Xr7ZU>;z<H7Pg<40}?mN+y6em|FI9<SU9;?U-n<P=_X8`
zz%#(UO-t44JtUGD-j-{zOJEdU*~O6vwVgx3^8a}I>({U5{~A3iuG-q#6fhp}r{@W(
ztE(4gm!;lpd+;wy3D#|wvjc9L-R-x!&F`yvJZo3T@Q{0+cnD5R$<)MzGX|B)t-d`X
zw|Dyn^wWFl)=s%g@oqZcr7i+BcwJHJAxx?MkF?3!0tRRLOXa;=TPx9KsO!56Ng^YN
z^W)UiRNOrNHvxYx^o=odzVmh-9F%-9FbJT1D@rbv+nih01kR*J-A7}MKi_Av{H4&k
ze1NIcPI*+F0h-Vf!l;QLY8Ux_pV%L?AJ?RSnz8-y4lMA)-5uWM!3K+kR^N*ctY`}t
zTLSH8V`q2UQ@p(HIMrV=dC~kDBL9tcvoIJWv|V7+86h6r4_Ap#IXNHFx>70dTv|mr
z&Bm<R1R|$~nh~LsE=?Wx;tQ*cE6mN!?R<Phb7lR@TYT3>TrF>aS(JkE?WU>W_t;E>
z#q&>sy^lMyp88iz4T1V!mC;QIEE7zEM;iWy&TXOo>=Nn#Jz0NoP?d?^h0}KhcAaj*
zT;zEJf9M=$k%Ns*;i`(Xgo1)a3iArr17%|x$%|_<c*W(Q>Pa5-!F?Oa^ua3*tEx}w
z^K|-H2A#EEC)Q7bcfV0g<JKTjLlPNaORyRPd?YFZ2IF$Y*swNOTU2QjH!5M5P>Dc-
zO0_eGPARLS-iK6^jLx5RuZt@ovoCvz-7|?G(5XoKZyL6R;&wx7e{0yKHG!OH^|Qwe
z8+Ef&<qH|qg##1iQUgXusQVAR_%XY{F+>g%{)vBZ1JvgZVsv{L8HOsw8@>*$M)rso
zd#N7%BF@afw)|vc=-m2Wy~wnGf?Ra;@E8FFs#_CyTUJBzj-Q6#3NF4E?DHZ2@WD)b
z=q64ELq0U<ReuJ##?6gDS1SVJz7+|a+u{S0{=Vw6X_}G6g68c@BP1L^Ut}T587uEa
zaY7eF69iqi*nKjT$Ui77Hj=NvBAfT7$+W6cGGuf)osnBaZSN?=`}}w(TAP-_3Smb#
zx`zXmgxNm00BXHe*S>oBYd@y_4VE*;s3Og)R$qz~k)aM|r_#1>OFcKCG0D@-*wm3H
zk*6907=BK6asZx_#zm~!ixtUaF=waF4(6?1Q97m94Z1^(LQjofM^_mqOj*J6;y5CL
zjC?-K{CT4?5d*Klcr0GG?cifWhaLeRW=+lDQuR0gc}01KpM=nCd&>7=I#_3+b-2Mt
z+Ub0cP*?Jo$0bH&clE7>Gf7^)96z)q%ZPl*xb*w)U%$P-8)J&HvLO>MUzY#u?zBt>
zhiWZ<`J>v$W<LD3wpn6{^|Bx~%CB;-^v7$c3slB!?NRES3fKk;c~&B-olKv2#Omc-
z!HTX;P}NdSLs+#sw`Rm8ylzTg$<-<-AQfysZ)02v7Ry0^XxdujDM&2U&!&1!>vbW<
zwvMt23LMe-3W>?d$)s|&iE{coFAm1nJxO=9`uqZAODKPKhe3nf`?osAS0CPL0mbNT
zSD!KnwY_{VLHb-^ztZvinZo|-UOc)Oz&;wdE^U<~DQ%UpVy?lO%fZ5u^IBx2hcQ8%
zna%~BV-K5TVq<epPD--3hXwo`pVA3jOf9){hZ%yx@OmGN%pT0Yi)cP&z9ByN9weNk
zRD20Oaub=yGe+Y1a{7f~>hCE`9vc9MyIoX%n9j_%W(eh}q326&kGIZzIel@!vNLW_
zB#=Y1!bY~~tI74UkDijp+03CZUGTjm>Fud{WNs-;sTmZS3sH>o)B3fMJfIC-F#VHn
z@rgoN>kywei(8Ex^kC%lkpm;{mVeo8<<z;4GeLc7OCB5Zw664@9h@6K8s+HRlX!k-
z>-9fFbPHCtqrUIx?L|!`=$^_lXAdwR(f-jKm!gAR{}(YYSL7||`j#FIM^1LXeAb+y
zIkAf43tOfjopfmXbv6~p(|1$jefrU(AD_)@M0t#c$GaSoww+U(eA?6sxU3E<S}itY
zHmx`$sYRrUG(KK)wjTz!G*my+dTHd~YGt6zyVX-1vesg%K>2Z@R>=GoKnD|Rw;oLL
zy6hZpu8%)!PxE-z^fa}92ULoAJo3E}87rz9yH%XaL_SpS0n+O%PbEXdH2`|pQ)1{k
zAE+2mlL0HNGI5uNK&uj&Vc%WF%<=-5Ej*B(zW=6i-g&2s*sVY-K{CJBNWRoLHP8XU
z)m07%l7KvSCE{7Jo@%owM?JmwcZ^U;%*@Jd)NIK^Y7#qbCu(rg*#VY_px4(*+dqFd
zo-ns;&B_=YX$_sifH9)|1K6#8vY9I^X&WjYKM}fzfRPD`kO)I_y>Y%9o(}t$aW2ft
zcG}>S`7|Jrhd*ovtFwnmH64trkG$h69~uE(BST>J@d5M(A*1&|F8;p?_G;wpzP+;p
z4N6rkXM#SGidJTiTiDaVG3wBvxpk8Ap8kL394q9N$Xk-g1g@AdhX8^okB&qyuNjPN
z6?~-ZJh6siIueoI`&q^x_+9@!aMFs+03$a(g5yK~;l+#WJhG7z?Wjl1?GB?XLzS)$
z4E6kSRx3aZ-DaWle@}h`#A+gt=)Zr(K}M<vL=t7Nj9&NcWv4bi-7$OWtFsvSQk>jt
zH`_6PBOk00!P03FH6$#i%Q1D<YEJ|14tq8TDJd--#)t*3y^-5BA=4?k3hemY`STRt
zsJ|-jbx_yGZVM{!3CD|sIVRq#dXUJ<8~;6hz6LDgBmZC}zh?X=&fcJrAwic+v8#`#
z#zR~qeqhjGOvuj8uAgv8wP)H1kjs_!CLtfF&j3aJQ@6pEt>6&M<d%tb<>aG99!YLD
zCg$PBuA{chTyiVB4C-oX8Sv>LH!uX3^jb~61((97L7w|yMlhZA6X78V_}QXjYXy*#
z*25;Ab&R7Av&H`^UAHwazec>z<pdZ{W{fC<=)}+B5E+BO0$<$HZiIL`)gAK8&0qb-
zcFwy<YGBm`&Twlh7QC}@#VWr6oiGh6<O=ECv7Tz!6(c(_*Zd_5EUOoDmPEtqTX;H<
zA_4A$s-7qZP(xlgCJ+@F7GHx|Zmy|HezaLTx#h(g1eLaR=t(($RmuCWK=|nrX(C`j
z%|)luYVF{eGsD6Q=)tUKT;8vpsAAc~LNP;cvSBsN%jjXPsJcp-e+C7m_k%6t*z5nK
zqat#0niUi8K|x$rHk-C@{_u{Tf8D!bx9QVPpaa^GzIJ-h*49RNNyETDSif>U?h1Uq
z5?M+9Z{%`zt^a7ixF0{BnwgmF(|rZ8IcEp4hu8AQPX-;P<og^Wp(<2+{s_#%`uaTs
z1B2j}xywiG%(q;h`~&{zUc}KkwanSUZVnBpPz{ZY$a;Oj2o)8f;xEJ4dFq)AlOmkV
zH5q;yPJjP&Z&iiL2+LZ}-_RSbI++L>lRe^i8|DUxaie{IcC9)7?5WBBYnT+e`RQ)X
zlW;toFWjArr<<KZ=UEc`=y3CBFyxbpvX2F*JSz_#Z0y;{MIfOa9u5X5MeD|=bW}+c
z{da!wdrgooNH%Z)=$x5sE~T0k_<ylw>uq^f@I-}o;PXTaEU8#%4<_*ajHGpCK#O#d
zaeKeo@<v#-uIJIvwt`qFSImBFwt()-9!786XHe;KT^j<z_1CgDi9+$8pkY)U6dif@
zKTJ4FM7rJVelbmsEy`vSX|P3s<*o`R`4Cr(i5WR({p!CkZ_<?J92V9=rc?YL*eh-t
zt%!)If|@Mf`Fxi+kw>mmET5G<R;rt64?6=<rzHB@36*!jK&>{uCVpsH6PGPeynwDV
zysm5~R+jwSzR7i62Kz8j36cvx+bBhV9$*LS{rmTCdHpn46l~t9&j5$?ub33gfjyQQ
zO04GxO%PW`Vk&l31H(D9u2{dihyk_HEW3niL;>CxzKc#>lYwQxDkkc|O7r7YVVGwc
z*}bVE=3f56bW<gfUZcgqL)Jj0cgK{{ZVv8&1thagaq-m3_N0F_)9~ReK@*roq4?*D
z=))BxrI_vW=g+H>&6c_SAQ@ZNY|XoPbOfk`8yXyrsrTi*#3fFS3Iry&-(Gey`4=7+
z#2cOsZ+9;eb{2QRTI&7*`XN>IvJxyAlz2}Scct-GQGAx#kD(L%#%Kj8nGYB8f(l#0
zUo}NszBTnx=A}etMpsw1{mh(0!0NMzm1h~a!N-t#YT$c27?0YRSYJ8x{{H<b-JWT6
zbu~kUN<H$Kfl*^a()oJ)J(edou(75SNWuO5Y&M-OqHci_e1U<10cLJKgwB<*ouG;&
z0bt3XDTjai`uc*5B`sB+4k*-a$$DG3;D_sOQXrAH*UNDs?WYiSQy=VU#O&$n|0*c-
z>^z$M-QWN3pZN#fK%ITt1h}DL=t!ZVU*JD61Gvp(b8LmC7*U|x^aH-VD^yw>bu?@M
zj-*D%QfO=;7CJZ-VeKH4HM0>-2?a$q<w^C=5g1Fw8YNsCy6Wg4AuI-5G=e(;U?KRV
zJJ(W|3Ixq90^u|#?E4R~c1s`Q9SD*AvIZ-y<D?VUf)<DJX}CHhm6VjubqU{<xc>F1
zcChCA2YbU(i{^q^JoT3MF6nu^_lruHSc7H!*u#0_Y+)Hk^Wn5X(wO_qkd&hlmj}ud
z<pr8!W}aXK=m|g!*AUNY96^PWq^zvzdPhc*GKh4K(W`y|_m8bq84sT0Bh~{Dd7l`!
zsXJ<Gy<}td)l7xLKLxZH3(!rF8%(}4VL9U{lOWvv`Dd~PY{bw;3V5)(HLWs!EFtPA
zIM`kazCULbs(D|u0;o=~<r8iw-`@D%cpq!sp0zMTrP5^fq4KW1>|MF0noe5>BKrw9
zwg)8f>W!&fCw8+w6Ofg@;KXz8xCc{5TXVjLrP|N@>2ON)h6ItHDDKxw(!BK_Vg9l%
zzyBf|pCgYZ?w=eise^>{;>D`e_rqK|6(*H?Wj6+{!O-;i1KMIzE%oPnVBiz!1-{9n
zvvYE2W<W*JIoUo3Dg2VOUg)a`=JcPzyspLN`Z8{Qf9<h>4gBW}Vq#*R&2#R(y}gxl
zJ8xP;Yvy(`Km%|1f!lgo27E8q51bV@7<jyYclX(~i+`I)R)$}k;UgwJS_B5`6}?1z
zPhNmBdBrQ+-Z-5?oK<+Wva(0Zec-c@Q4eNOtHQ)maPW^70&^z@b#c+L7Hs)GyTw#s
zvzvHpD-U!K=UtFTSV0fgf1}Jegp||RCLY-3uhq1kH=xM&IfY>rwZ=(#pp0*>s{HS>
z0(LwQG>JiS*oJZUPFHz`k*7JVPNcwL8Cp6z)kj-&ZMRl{et{p`<i%vXLzM%Uf`*3(
zz)4`4p_fIr$E_Akd~Ssm1GrHqIcg8=`#}yt4tZpTYyx5|Ybc|AWn<~WJUrfj!RhMf
zI36kOPSDHFYxP-B0Ju#Lw+LT6-kw<kWdo9ulf3c28+HjzY1eBJ?V;^dt~3&D7UjLj
zh!HmJLc>LW+#VPTh7UUit?BuS#$=88EH)4E1BA@~>4Am}U(b5b7~c4=37_^YYZ$=W
ziamGWLi>XJ`_zyn1wnkc#`p+g+C=01aRTC#Fz$L`wiFWd17oGBK-??#nZ$g$cQ5{h
zaQ`2cw65`7q?_IVB*m<noh}Oo6S|RWKQqI)R8W$zcWqy+OcB^vi}(9D;S@Pfy^=C}
z-M6U-x!1>NHB=9lT%ekh=d8+fsgzS$@)nq3H4Q__{1BLxnqtu};i$p-+vvl}d-2zT
z_;?6OkkF_NacXO2Ig1ZXqRJjGN7qlmLWl)b00D({u3RyK(T7u}(ecK38%Sg<-o6kl
z5dTLz*Z$A+AGT+6YKoDvD903%a-0|nDHN6F9QtBqj+Gk8F@#9UX_l#+Y6#ODno}oa
zMqez)p~xIZiOFft+xPhgo<HE(>*eK_&Bs2U`+nc|b=}u>*IaJ6mY$R!GV_<sAr*>8
zOXx$<Su@ac(9~Y($nLWc@@{$5E8{tn(wPZW?e!|;xZEdXWG{}2CExsZ@+`Z`$Jt5`
zw*5ev)4`d6poG-_og`x7-U>@nAuojLiDdq*2RdpOiW!&*?7q9Qgn<}BLjV@secspU
z;7&+#ax(aRmcF@$-Ak>?^AiNQHdKV0W93rRbHV3mk4b`VXN`CVrmIom<yXR9=@*<U
zY5Un5wz+)oiLg3^9o@&61CsoE!dDv&Q0tpp$P3v{<@?atPJ8wz`00b%SN(cn&*NI!
zIA^bE5PqS0XdVxa6b{EQ3dqdKd-)%0G-JMaC<_9vKyT%Xj8dL9XRDfEB!>3HcEuwe
z>2O?nlk5`xz|NM5OtRQh`#8HNIOQll0xc^FPh$!17l`n~daBmV^fZ%Z6zo2hk2JYH
z^lQ7+B%=C#;Q?nW7x6(1^vrtN+GZs7w*{{My?bb^(>Iu-v$OM?U*&F1eu6+WeI7&Y
zVRYbj#E3MwEi5Bq3Nv7Qt6u&GpBn_0D96Ety|Nu$CbM)cl5J?~C9efP=e=7`efUzp
zv9?zDK1<yNl-!!3d56yt<Q8|YDgZ5g8NRztY?~|5UB_CG?&lI?G9@ZVP!5@e`Uc$A
z2IaXfI-O~^I9r#j^fo>5k(#kVm6}FOTi9hQbjEpWpl8s-_(!!|hF~<J2;Ll0hWCJV
zLm7bczSzv-w3v<#iu0E-`+3cDq{_0hxL!fuLh}xM<ca0ACSoS36Z2P9AvR5iZSodc
z7{BGM4Weu|QS7F`_)W|0={22luZ}D~#R<ULLh&e0U-|sRA(zxXi`aPY^)NDryMJ-#
zVt)FvNmipJi4CG(PbLEM_bCGaqte$cpLL;?tblROK7`$U6E>)Lv8Qfvvn`-AiP5KS
zAFY0SH^#jR`$=(8bP<N<+2MJ7LH(>OQ(?)|r!u`2x|YDyb`A3bmz*~GH+S@VU&MUh
zw>4_wu!OWmhA!sV9#_xThZi(kB6Ot@p3ja~wKC>zVOMT77lWduTttM%FzCK=<K8Pt
z+1gcNz$=)69Dk_U;*gn{Ig*o|?Wjhlw4<hvXD=>r?=~P!n^}pPTAG@bGklnhGkUvI
zAZ>RisNGHU+uy3xiPnkHn>sfy<P2PsK6Mh~>}bbFB=%7@d@`4Hs|0{aj;0W6a+{0l
zm<vw65dd(A_3}Kq=Z|>QwE_7@Un`pY1h%7w`IIc3&zJW8X6ep08Y=*$EWX{{psK3N
zf?JI-^c~lAr6c>!_7#1n@;BkynnHIGg)|Bjcye)wEtS~C`&ED!IdI^>=MG0lM<C@h
z-PTi8HdfkFdjo@mgUj4Y+KvL$p$7#dAN8fma7WwHy~fdnrW|jlQ5L&n?j9T}8}O_L
z)1}b^kKRR>*%9H2GgHBvq)Dv1!QAw!9887FN$Akub3nCmlacuJu<hCvJgd;H(JvJI
z^9@I$9VO#Zlau>F#Q`lp)mh3j`51BF^X1m?Lz{E?DdG^_4VgUM>R8!o-9MINf72(p
z$%KaCfEwFQ2IF&L;*OC}_5o2@bONCgxXW>NLiD$V<$k&bL*A^qbN_fSmuAy6`g3g#
z&vMtfkW`pSh6PlXZ$-B=Q0{jK#d!5`SNPfKk$0hE|44I8cI>~w&H5*~3z)OA0L9;R
zd1(Vw+^e9`w(~d2C0lElTnj%41W{gPqrhoxA$7_LuOSY(;JY)E?MMI5cF}@7Y^OD*
zpuG-XWLlI(Ma<trVZ>aeW>Ol&_Ho3_^cEDBM@ECW4jprQw8LPl%`98V(>FLQ{HPIc
z@uOJl+j*T(QdMm&@R<+^4-oY^qOSq~%%x-iYT;Y%5oN)m?q-G9F;ypD)s|YMsXn!~
zHbjxG)!}E5JNl6<*uLhGlA3j?*FL_Zpk+&W%n8rCk?CEY3-10ux?PdHP3{AVx|x;4
zZ9F$FF775!b|IB`zumX2w<bq7h)0B8T#X!f3EIYZyDJqeRy*a-OBFO-Yd9A)n0BlH
zu26FV;mTP%C>Odr<-zOf5C%{Un{B||eIwj>k+tpIt#gA4zc+&obK*Au954iD*biWk
z&x%}aOH<mG0f)jR52!4;W*MX%+QhWQU-VtgdXQ+h2Zf^!p8(1>+E7j40@mq{T5OQ`
zs^a2fT56wMK$&~j-m57VO@DbIaWUtMFU@bsff-51TngfYB|h&+(o4`4HUNxC{vM${
z-W(0{a<c!k9<G#ojA<;%>`F|~h@qSUJQaD;uV<qy4grEY6DKICI`9xkqK?ohT?LS_
z9rz}>et~m(vLn8`(zXu8FIgYFG?L6M5mPUC(jY?R<q171^bd1~x`A=8iGh|DrQX53
zxaX>mk1DE4EkQ-bTF~L&{Y`D~D|23E*99R|`R0yf`x0*jepvh3%{Rz#QGC;}mR0>l
zAADqc2MGeO&O)(jw5u*Go;*1^EAumUkP$FuGz)8GZ337rWXx|v7`TBqndh*ht2hxO
zEL)-zX6Wh(;qCMUEp7M0aL?Yx_TN%<P=FufFYNjb1p^|}cNN^bM(%**2PCIx#oM>$
zdau~h-NsOmp{~il9Lf8>TBm%=Z+5)fM*iM6!uN6DG5n!}miosgXS#dQ=*Q5pw=_Av
zk=tA)?45(LLA@O#AYr7)!;j+P1VAd7Ic3@thlCbEzI9Pb(UDtdfDB)%WRpm4o6z*B
z!@tErE}Mxc=y0#2v_-I3Zzl=USMf=yKnG|fWja-Odpr=D$|nZRPZ{woJ*qq0PK0MT
zI6mZwV}TVi05=wPQp(Y4c7+|iPn&p~J0J;pX4{l%_nIB4MW^(z0%~0R+n+u$B;@6#
zf>bUSkf?MX%(}bfyBU$_r?P!zIt7sEt00ByX5Y}x&elJ~5&NvHB+!}g)_VBH!JmQ~
z&_%CX3#)?~w_FC8^;;Sh>G6|cK0=L7_&lM>?p6`(ot6$8qLc2Y$WGQZ&ty#Vh0Cco
zzJG|@>hJHLfoXbzT)9KL0+54?^UO46ersEAI8hV1UV|BNn2`2c7J269!MqGnJ>!AH
z;h5a82Djr?=y|!X?tuG1ca?k}yD`?&><%#&8-Dr(cILs(+hLwcIgB@T(cPDvlkl1;
zaIficSLdwJGU-5VqIJVMD6+0)|BMbGKD<VE0RhW3EOt#vNvXGH<Tm~{dV3xLKtSg1
z^=_<@IJkgO?AW!=XJAqk8_{GNzT>$CpZOaS*h$cnsHw3qW54TX<aZJG#lXn*A-aht
zb_u)kk_P5i{$r16COB*=Buqxk38U05V;M-in6c;}7Sjpk?Oinv()ekUT*URR%#?R5
zl7G(TgoB?39n%UA>{9a_c>Si-lUv=C|I`@*+7HMLFJql1r^85@5o?8%_0toBfM7mf
zsBYbUGc+$NyE^P=*y#Gm@2+P67(18k^>!i+fpMO;W=jp|1q_u7Zrcge8BrhjUzv4X
z6|`5LX2POGUjO1<qYfw7tPNnC{$_=CkS$=$>iVoTV8jCSkY+3bpb=J<uhD+vd)Y#A
z_kzksmD0`w>6oA6#}&V(USnv3TRE=T9~ewvN$4&*Sl}_mIlP2EHrxP&Yt7<gFVf{}
z1J6?5F-Qmd=e)VyDkmF~I?s$u9honZ^7LYN=5{a`-U_j$&L0L|@fM~l(JfQdpU)t}
z_|b6bNvS$Za9U<Q*81$3<Evqq`^bSRU@8o<ktDNkU#M(|(CVqdD~s%?JUK08L{CKx
zQ*Fq<$o}<TXUgD{FGt9Se=uccXJ&zH;Acn2xl;I=js#cd)3KXGKmeaFY&=-uhE|C^
z>2E`bXbM#QqJE1DPV9nnW-O`U&2Vi)C+m<fEev7~qBOmL?H}!|2%kaSN6#02eZ9PK
z7-t7zyfk!65iF=%S3@i!^B*9xb8_B!nU%{n0&OqkWc4%DNC?bc4c>yxXNNYbDIE3J
zUs|wRSx>e5{`^7onW*`c2c;JLul#lE2}J_&%A>k9iwExH(Kp@Azhwg-vjnaL+E4YB
z>N4Tgo2*Ucdta0UxUPGF3+ANv38(RqfdK)W2A~DVgXHlyW=BkZNf&TWq)L47`yd{5
zce&B3iNLR-DDx2fskbvf?-Q50Q_;VLIW|qB<tw|7<Hb%MuNvc6V=V?fx6Cg}f);$3
z#b(SQgXGVHr8zxjcQ+WMUqx3893%5idyRuu*TtSnd{%BQ#I(6tVzINE1iNOC+gXLZ
z^NAG+85Y_PH4eb0LJeia+?SJQ=|U)Pun0`12b)tYSyzB#)e$s}j2NFj@q<Inrr7SN
zW(lsn^`(lU2Zuxp165)U6}f~`3NoNm`b6c7H_m|VJ#-civHFI_J6<N6U3N6Xx7fvZ
z_auKp+o9*OiGEJY7-$A=iGYZy3ljx;hMz#BFo2^9D_lMT2Oa;QoN28I6TX^FU^xtV
zTyK3`JlA*UbJbw$^1-6It+mFwV=$in9w^zudJrQTRRl5DJ9M5eL8mvV=Z|HWXzvQ5
z8BA!O0P+<%4nl*MkN8lnPM6iGI!1ItW$cyR%kQ^x>4PHW6bPfEzK&f~@<GQGeh3iR
zmMr(1;WpNnmX=P_SQ-YoqM@WN@Nx&n2u%Ue!*--*jj>K^KP_`5r=Y4giiot^XZfPq
z_VgwVq@UcWa9mq^yzHA*n5?H4AfW)~&W-{g$&|b=NH|0>V=rfC=<3?rlNS*3iZ$S|
zrsa^Ic!ZaHM=F7dJLVV*FkwD5LoM<u;NfbvfZ6k1r%Xo9Kncix##}h?q3Gc?jvg3x
zD>;blc72!7<_~(#32CNYL*-?ZytX!AQanBHKl$sFc^e!SLmg{iii+_tS*-l?i<FMm
zKS$mFZ~U;ic>sKSt<!UrBphuJSM%;V);rT1b3S@a5M|vw<b!`N2f-KYf!adyEX{c9
z56~%rKf(pfy>dYSX??0Fi?_6c&EFwX)c48Bl{dQn6pkHqZG3<LXJrqXClRFKUt&lM
zDDFAiEbHMyR?`n9G+CF2Uw#vnFpL0~MRk$G=RqM_PKx<*Vr<Wt{^HZO%*Ak3%f-rc
zef=AWt;eM8U{`a$Ng&d80Y6@wE>chH!X8Ph4F0SmBE>CDBl-@zxP;&^ZDqcZEIs7A
z?4-rvEGrR*$UKbXzwf$#B__BY1(&I@VOp2pf&Uq-exD(`Xm7Pa<Qsu;1n(5fd*Ii2
zxmhZQUFUn*DQSE<TJnlnV8hqMx7S7d|BU;Vd_vL@AJ$)oe7)rZ_sAl!h(!X%JJ2&6
zyjbWX%E~Inh_75=KOAcArLz5Pt~;K7KWGeN2=bI}aTQ`ErizAk-uL>50zRox+tYF6
z*!N*QRxydev#zHPL{DaZQd9)vH?Q*{n|n=FdLG5nfiCe2WzI3VQta6sF8k7W(-4bW
zSnyt`TP6C+j}!6C-CzGiB>+k^ZK%`N4)$1WmtMo_kB9pWf?wVH9w+rEa;+!Ncwlx}
zCF$iJ)7p<6q5vb|hQvmDR$bmmZ>qD@aDPsF5x~b?#^62B^UFTbkf5orFZu&&*7G(d
z4yz_9#v?#nv()L27$C-fhK^`gEpfIQ39P5pawID|m|^$z_l2J<UMMgn5d$$`MPI2V
z9<Tk7N}{zQRp~cF&wQ{N44(P{W?6LX3g2QWZGn#y%%%0DH|JwluEY6_e+Qct3C@&A
zntMG2@pF^7Q)bT;cb(Y?T~>>n2z^BBW6vMmG$Eb1RfLq2%M-v>sT&$-Yxm%4h73)G
z*Uf~*as~!22Th$Ed=#RtEK+Uf8CiE13T}V3Fu47*=itIK4Uy&HUH?s?4z;v_Qn{uO
z`xJQmt;_6Z0evE}q3^F39M~>iYlt~eza())h@2L!m7x*f{*nWB%1OW>=HCeF^bl}2
zLpFZ3HmF;pw70beppTRX)H)=}`T1k^-+KU9dU;I*U6dry79g?^QNn;y^Qkdeyvgx`
z;h<98RRY*Z$*_%_Q1pGp#Dz})UD78rF(dP)QD7qd7e{SddR88}IU9>m_cur{ez9?9
z4ZUp@Inq%&w|uuY%m)jWj@;u55nL5rT!`ZBS`8mdjh2cQi>`Cd&ns5FZ=fuc<Y&6}
zaj(-gz}jY+97~ExOiaX#iYOrOPeVi$LP+fGS<ZiF)oxQqSp|R)|EzEB&?X+Qvc${X
z;=WGT4?(P&TS?b*wTOrY;SJBRyuKo(!Re)~ieW)<C!P+NnRM<P3VH>HcO)b8Tah>L
zT}#his(^>$E()KqUIzpz|KxDEsQy*#L}(}IYC=kwcfWRY5(Yk}>(rtI_{!cER6Hda
z2lnnpq@CZ++!mCh#h9A_1VgwABw3Z!-4J}Sy7i$$hbGyRlOupT_s$VqwX{M!6Rd`D
zVR?KO40T_(BRTZlpjH7Egz~G72CUlC!3LN^O>v0&zS*l-OwfhR<Ns}&VS|%$w2d;C
zi!dGPIOLh!!)ZkMpNu6KrR%9WlTEG~?YIaE0tgYA<_e$acW&ipNaY(RXtXTvf&JnY
zI@TW8y~o_@`{nlSn|>EoGrF+b6OA%4;f;WSj!?6yn#~{k!GtNtan*dBV1l0?eEhUt
zG?wrkmoQ@gZiZQ$nJL*)Sg0(fP`VZx#U_P40;XF#Lx!Ji4mbdOV#IuHFB-i8q_Fw_
zeiKWk!)}1L07Br?5B+@*jPaOHOlMB;``}HB^*Tn898};z2v|BgkiGpFK7+UBxbV}$
zm=&$*W)-FXjtK4IJ@gY*<3C9GJO|)kC`?iNNVH;0KWLk$04b2}P)h^hciz+vqUdt=
z*58rop5h$}6}Q+nkao&jq-TaY5=Y~Y@bY^8QWcVxVhP@M$srZ-L)lpB|F*96|KIih
icR*Y`?KX!e1}|>?*LIilG}u`Uu{>>K{>IcJ=6?Xr?68vn

literal 0
HcmV?d00001

diff --git a/frontend/public/manifest.webmanifest b/frontend/public/manifest.webmanifest
new file mode 100644
index 00000000..dbcab3dd
--- /dev/null
+++ b/frontend/public/manifest.webmanifest
@@ -0,0 +1,22 @@
+{
+  "name": "libredesk",
+  "short_name": "libredesk",
+  "description": "Customer support desk",
+  "start_url": "/inboxes/assigned",
+  "scope": "/",
+  "display": "standalone",
+  "background_color": "hsl(0 0% 99.2%)",
+  "theme_color": "hsl(152 39% 30%)",
+  "icons": [
+    {
+      "src": "/images/pwa-icon-192.png",
+      "sizes": "192x192",
+      "type": "image/png"
+    },
+    {
+      "src": "/images/pwa-icon-512.png",
+      "sizes": "512x512",
+      "type": "image/png"
+    }
+  ]
+}
diff --git a/frontend/public/sw.js b/frontend/public/sw.js
new file mode 100644
index 00000000..d42c00e6
--- /dev/null
+++ b/frontend/public/sw.js
@@ -0,0 +1,34 @@
+const readPayload = (event) => {
+  try {
+    return event.data ? event.data.json() : null
+  } catch {
+    return null
+  }
+}
+
+self.addEventListener('push', (event) => {
+  const notification = readPayload(event)
+  if (!notification?.title) return
+  event.waitUntil(self.registration.showNotification(notification.title, {
+    body: notification.body,
+    tag: notification.tag,
+    icon: '/images/pwa-icon-192.png',
+    badge: '/images/pwa-icon-192.png',
+    data: { url: notification.url }
+  }))
+})
+
+self.addEventListener('notificationclick', (event) => {
+  event.notification.close()
+  const url = event.notification.data?.url
+  if (!url) return
+  const target = new URL(url, self.location.origin)
+  if (target.origin !== self.location.origin) return
+
+  event.waitUntil(self.clients.matchAll({ type: 'window', includeUncontrolled: true }).then(async (clients) => {
+    const client = clients[0]
+    if (!client) return self.clients.openWindow(target.href)
+    if ('navigate' in client) await client.navigate(target.href)
+    return client.focus()
+  }))
+})
diff --git a/go.mod b/go.mod
index 1855f052..95f01f6e 100644
--- a/go.mod
+++ b/go.mod
@@ -3,6 +3,7 @@ module github.com/abhinavxd/libredesk
 go 1.25.0
 
 require (
+	github.com/SherClockHolmes/webpush-go v1.4.0
 	github.com/abhinavxd/ssrfguard v0.1.0
 	github.com/alicebob/miniredis/v2 v2.33.0
 	github.com/coreos/go-oidc/v3 v3.11.0
diff --git a/go.sum b/go.sum
index ad4cc84a..cb8f7445 100644
--- a/go.sum
+++ b/go.sum
@@ -8,6 +8,8 @@ github.com/Azure/go-ansiterm v0.0.0-20210617225240-d185dfc1b5a1 h1:UQHMgLO+TxOEl
 github.com/Azure/go-ansiterm v0.0.0-20210617225240-d185dfc1b5a1/go.mod h1:xomTg63KZ2rFqZQzSB4Vz2SUXa1BpHTVz9L5PTmPC4E=
 github.com/Microsoft/go-winio v0.6.2 h1:F2VQgta7ecxGYO8k3ZZz3RS8fVIXVxONVUPlNERoyfY=
 github.com/Microsoft/go-winio v0.6.2/go.mod h1:yd8OoFMLzJbo9gZq8j5qaps8bJ9aShtEA8Ipt1oGCvU=
+github.com/SherClockHolmes/webpush-go v1.4.0 h1:ocnzNKWN23T9nvHi6IfyrQjkIc0oJWv1B1pULsf9i3s=
+github.com/SherClockHolmes/webpush-go v1.4.0/go.mod h1:XSq8pKX11vNV8MJEMwjrlTkxhAj1zKfxmyhdV7Pd6UA=
 github.com/abhinavxd/ssrfguard v0.1.0 h1:Ns/llAQ63uGFehxSvhCd+WGDKmBEEmIH+E1AW1CGgWM=
 github.com/abhinavxd/ssrfguard v0.1.0/go.mod h1:eNVubb+m/r3KrKWYdG6hxzeAfj+t2ZmZss4V/x7D6Ws=
 github.com/alicebob/gopher-json v0.0.0-20230218143504-906a9b012302 h1:uvdUDbHQHO85qeSydJtItA4T55Pw6BtAejd0APRJOCE=
@@ -103,10 +105,12 @@ github.com/gogo/protobuf v1.3.2 h1:Ov1cvc58UF3b5XjBnZv7+opcTcQFZebYjWzi34vdm4Q=
 github.com/gogo/protobuf v1.3.2/go.mod h1:P1XiOD3dCwIKUDQYPy72D8LYyHL2YPYrpS2s69NZV8Q=
 github.com/gogs/chardet v0.0.0-20211120154057-b7413eaefb8f h1:3BSP1Tbs2djlpprl7wCLuiqMaUh5SJkkzI2gDs+FgLs=
 github.com/gogs/chardet v0.0.0-20211120154057-b7413eaefb8f/go.mod h1:Pcatq5tYkCW2Q6yrR2VRHlbHpZ/R4/7qyL1TCF7vl14=
+github.com/golang-jwt/jwt/v5 v5.2.1/go.mod h1:pqrtFR0X4osieyHYxtmOUWsAWrfe1Q5UVIyoH402zdk=
 github.com/golang-jwt/jwt/v5 v5.2.2 h1:Rl4B7itRWVtYIHFrSNd7vhTiz9UpLdi6gZhZ3wEeDy8=
 github.com/golang-jwt/jwt/v5 v5.2.2/go.mod h1:pqrtFR0X4osieyHYxtmOUWsAWrfe1Q5UVIyoH402zdk=
 github.com/golang/protobuf v1.3.1/go.mod h1:6lQm79b+lXiMfvg/cZm0SGofjICqVBUtrP5yJMmIC1U=
 github.com/golang/snappy v0.0.3/go.mod h1:/XxbfmMg8lxefKM7IXC3fBNl/7bRcc72aCRzEWrmP2Q=
+github.com/google/go-cmp v0.6.0/go.mod h1:17dUlkBOakJ0+DkrSSNjCkIjxS6bF9zb3elmeNGIjoY=
 github.com/google/go-cmp v0.7.0 h1:wk8382ETsv4JYUZwIsn6YpYiWiBsYLSJiTsyBybVuN8=
 github.com/google/go-cmp v0.7.0/go.mod h1:pXiqmnSA92OHEEa9HXL2W4E7lf9JzCmGVUdgjX3N/iU=
 github.com/google/uuid v1.3.0/go.mod h1:TIyPZe4MgqvfeYDBFedMoGGpEw/LqOeaOT+nhxU+yHo=
@@ -293,6 +297,10 @@ golang.org/x/crypto v0.0.0-20190308221718-c2843e01d9a2/go.mod h1:djNgcEr1/C05ACk
 golang.org/x/crypto v0.0.0-20210513164829-c07d793c2f9a/go.mod h1:P+XmwS30IXTQdn5tA2iutPOUgjI07+tq3H3K9MVA1s8=
 golang.org/x/crypto v0.0.0-20210921155107-089bfa567519/go.mod h1:GvvjBRRGRdwPK5ydBHafDWAxML/pGHZbMvKqRZ5+Abc=
 golang.org/x/crypto v0.0.0-20220214200702-86341886e292/go.mod h1:IxCIyHEi3zRg3s0A5j5BB6A9Jmi73HwBIUl50j+osU4=
+golang.org/x/crypto v0.13.0/go.mod h1:y6Z2r+Rw4iayiXXAIxJIDAJ1zMW4yaTpebo8fPOliYc=
+golang.org/x/crypto v0.19.0/go.mod h1:Iy9bg/ha4yyC70EfRS8jz+B6ybOBKMaSxLj6P6oBDfU=
+golang.org/x/crypto v0.23.0/go.mod h1:CKFgDieR+mRhux2Lsu27y0fO304Db0wZe70UKqHu0v8=
+golang.org/x/crypto v0.31.0/go.mod h1:kDsLvtWBEx7MV9tJOj9bnXsPbxwJQ6csT/x4KIN4Ssk=
 golang.org/x/crypto v0.52.0 h1:RMs7fP2rXdep0CftQlK8Uf+kibLm7qkCcradZWYz988=
 golang.org/x/crypto v0.52.0/go.mod h1:1QgfPxDqh0T2M/elOJtp9RvuR95kVjir0e6/BvEmGbc=
 golang.org/x/image v0.0.0-20191009234506-e7c1f5e7dbb8/go.mod h1:FeLwcggjj3mMvU+oOTbSwawSJRM1uh48EjtB4UJZlP0=
@@ -300,6 +308,9 @@ golang.org/x/image v0.41.0 h1:8wS72eGJMJaBxK6okTzd4WaXumUlTVlb753MlsSvTCo=
 golang.org/x/image v0.41.0/go.mod h1:uIc348UZMSvS5Z65CVZ7iDPaNobNFEPeJ4kbqTOszmA=
 golang.org/x/mod v0.6.0-dev.0.20220419223038-86c51ed26bb4/go.mod h1:jJ57K6gSWd91VN4djpZkiMVwK6gcyfeH4XE8wZrZaV4=
 golang.org/x/mod v0.8.0/go.mod h1:iBbtSCu2XBx23ZKBPSOrRkjjQPZFPuis4dIYUhu/chs=
+golang.org/x/mod v0.12.0/go.mod h1:iBbtSCu2XBx23ZKBPSOrRkjjQPZFPuis4dIYUhu/chs=
+golang.org/x/mod v0.15.0/go.mod h1:hTbmBsO62+eylJbnUtE2MGJUyE7QWk4xUqPFrRgJ+7c=
+golang.org/x/mod v0.17.0/go.mod h1:hTbmBsO62+eylJbnUtE2MGJUyE7QWk4xUqPFrRgJ+7c=
 golang.org/x/mod v0.35.0 h1:Ww1D637e6Pg+Zb2KrWfHQUnH2dQRLBQyAtpr/haaJeM=
 golang.org/x/mod v0.35.0/go.mod h1:+GwiRhIInF8wPm+4AoT6L0FA1QWAad3OMdTRx4tFYlU=
 golang.org/x/net v0.0.0-20190603091049-60506f45cf65/go.mod h1:HSz+uSET+XFnRR8LxR5pz3Of3rY3CfYBVs4xY44aLks=
@@ -311,6 +322,10 @@ golang.org/x/net v0.0.0-20211112202133-69e39bad7dc2/go.mod h1:9nx3DQGgdP8bBQD5qx
 golang.org/x/net v0.0.0-20220225172249-27dd8689420f/go.mod h1:CfG3xpIq0wQ8r1q4Su4UZFWDARRcnwPjda9FqA0JpMk=
 golang.org/x/net v0.0.0-20220722155237-a158d28d115b/go.mod h1:XRhObCWvk6IyKnWLug+ECip1KBveYUHfp+8e9klMJ9c=
 golang.org/x/net v0.6.0/go.mod h1:2Tu9+aMcznHK/AK1HMvgo6xiTLG5rD5rZLDS+rp2Bjs=
+golang.org/x/net v0.10.0/go.mod h1:0qNGK6F8kojg2nk9dLZ2mShWaEBan6FAoqfSigmmuDg=
+golang.org/x/net v0.15.0/go.mod h1:idbUs1IY1+zTqbi8yxTbhexhEEk5ur9LInksu6HrEpk=
+golang.org/x/net v0.21.0/go.mod h1:bIjVDfnllIU7BJ2DNgfnXvpSvtn8VRwhlsaeUTyUS44=
+golang.org/x/net v0.25.0/go.mod h1:JkAGAh7GEvH74S6FOH42FLoXpXbE/aqXSrIQjXgsiwM=
 golang.org/x/net v0.55.0 h1:bcvxaJn3e1U6InsFWt1JUq1aSjnRxLzT2rtD2KfkDF8=
 golang.org/x/net v0.55.0/go.mod h1:L5U2KuzuOe1lY7Z+aWVIKK6qEeJXnXV9yzGA+WCHJww=
 golang.org/x/oauth2 v0.27.0 h1:da9Vo7/tDv5RH/7nZDz1eMGS/q1Vv1N/7FCrBhI9I3M=
@@ -318,6 +333,10 @@ golang.org/x/oauth2 v0.27.0/go.mod h1:onh5ek6nERTohokkhCD/y2cV4Do3fxFHFuAejCkRWT
 golang.org/x/sync v0.0.0-20190423024810-112230192c58/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
 golang.org/x/sync v0.0.0-20220722155255-886fb9371eb4/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
 golang.org/x/sync v0.1.0/go.mod h1:RxMgew5VJxzue5/jJTE5uejpjVlOe/izrB70Jof72aM=
+golang.org/x/sync v0.3.0/go.mod h1:FU7BRWz2tNW+3quACPkgCx/L+uEAv1htQ0V83Z9Rj+Y=
+golang.org/x/sync v0.6.0/go.mod h1:Czt+wKu1gCyEFDUtn0jG5QVvpJ6rzVqr5aXyt9drQfk=
+golang.org/x/sync v0.7.0/go.mod h1:Czt+wKu1gCyEFDUtn0jG5QVvpJ6rzVqr5aXyt9drQfk=
+golang.org/x/sync v0.10.0/go.mod h1:Czt+wKu1gCyEFDUtn0jG5QVvpJ6rzVqr5aXyt9drQfk=
 golang.org/x/sys v0.0.0-20190215142949-d0b11bdaac8a/go.mod h1:STP8DvDyc/dI5b8T5hshtkjS+E42TnysNCUPdjciGhY=
 golang.org/x/sys v0.0.0-20201119102817-f84b799fce68/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
 golang.org/x/sys v0.0.0-20210423082822-04245dca01da/go.mod h1:h1NjWce9XRLGQEsW7wpKNCjG9DtNlClVuFLEZdDNbEs=
@@ -329,24 +348,41 @@ golang.org/x/sys v0.0.0-20220520151302-bc2c85ada10a/go.mod h1:oPkhp1MJrh7nUepCBc
 golang.org/x/sys v0.0.0-20220722155257-8c9f86f7a55f/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
 golang.org/x/sys v0.0.0-20220908164124-27713097b956/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
 golang.org/x/sys v0.5.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
+golang.org/x/sys v0.8.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
+golang.org/x/sys v0.12.0/go.mod h1:oPkhp1MJrh7nUepCBck5+mAzfO9JrbApNNgaTdGDITg=
+golang.org/x/sys v0.17.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
+golang.org/x/sys v0.20.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
+golang.org/x/sys v0.28.0/go.mod h1:/VUhepiaJMQUp4+oa/7Zr1D23ma6VTLIYjOOTFZPUcA=
 golang.org/x/sys v0.45.0 h1:dO4czNzziLiiXplLQgBCEpCvXQ3dnkn0SdaZSYdQ+FY=
 golang.org/x/sys v0.45.0/go.mod h1:4GL1E5IUh+htKOUEOaiffhrAeqysfVGipDYzABqnCmw=
+golang.org/x/telemetry v0.0.0-20240228155512-f48c80bd79b2/go.mod h1:TeRTkGYfJXctD9OcfyVLyj2J3IxLnKwHJR8f4D8a3YE=
 golang.org/x/term v0.0.0-20201126162022-7de9c90e9dd1/go.mod h1:bj7SfCRtBDWHUb9snDiAeCFNEtKQo2Wmx5Cou7ajbmo=
 golang.org/x/term v0.0.0-20210927222741-03fcf44c2211/go.mod h1:jbD1KX2456YbFQfuXm/mYQcufACuNUgVhRMnK/tPxf8=
 golang.org/x/term v0.5.0/go.mod h1:jMB1sMXY+tzblOD4FWmEbocvup2/aLOaQEp7JmGp78k=
+golang.org/x/term v0.8.0/go.mod h1:xPskH00ivmX89bAKVGSKKtLOWNx2+17Eiy94tnKShWo=
+golang.org/x/term v0.12.0/go.mod h1:owVbMEjm3cBLCHdkQu9b1opXd4ETQWc3BhuQGKgXgvU=
+golang.org/x/term v0.17.0/go.mod h1:lLRBjIVuehSbZlaOtGMbcMncT+aqLLLmKrsjNrUguwk=
+golang.org/x/term v0.20.0/go.mod h1:8UkIAJTvZgivsXaD6/pH6U9ecQzZ45awqEOzuCvwpFY=
+golang.org/x/term v0.27.0/go.mod h1:iMsnZpn0cago0GOrHO2+Y7u7JPn5AylBrcoWkElMTSM=
 golang.org/x/text v0.3.0/go.mod h1:NqM8EUOU14njkJ3fqMW+pc6Ldnwhi/IjpwHt7yyuwOQ=
 golang.org/x/text v0.3.2/go.mod h1:bEr9sfX3Q8Zfm5fL9x+3itogRgK3+ptLWKqgva+5dAk=
 golang.org/x/text v0.3.3/go.mod h1:5Zoc/QRtKVWzQhOtBMvqHzDpF6irO9z98xDceosuGiQ=
 golang.org/x/text v0.3.6/go.mod h1:5Zoc/QRtKVWzQhOtBMvqHzDpF6irO9z98xDceosuGiQ=
 golang.org/x/text v0.3.7/go.mod h1:u+2+/6zg+i71rQMx5EYifcz6MCKuco9NR6JIITiCfzQ=
 golang.org/x/text v0.7.0/go.mod h1:mrYo+phRRbMaCq/xk9113O4dZlRixOauAjOtrjsXDZ8=
+golang.org/x/text v0.9.0/go.mod h1:e1OnstbJyHTd6l/uOt8jFFHp6TRDWZR/bV3emEE/zU8=
+golang.org/x/text v0.13.0/go.mod h1:TvPlkZtksWOMsz7fbANvkp4WM8x/WCo/om8BMLbz+aE=
 golang.org/x/text v0.14.0/go.mod h1:18ZOQIKpY8NJVqYksKHtTdi31H5itFRjB5/qKTNYzSU=
+golang.org/x/text v0.15.0/go.mod h1:18ZOQIKpY8NJVqYksKHtTdi31H5itFRjB5/qKTNYzSU=
+golang.org/x/text v0.21.0/go.mod h1:4IBbMaMmOPCJ8SecivzSH54+73PCFmPWxNTLm+vZkEQ=
 golang.org/x/text v0.37.0 h1:Cqjiwd9eSg8e0QAkyCaQTNHFIIzWtidPahFWR83rTrc=
 golang.org/x/text v0.37.0/go.mod h1:a5sjxXGs9hsn/AJVwuElvCAo9v8QYLzvavO5z2PiM38=
 golang.org/x/tools v0.0.0-20180917221912-90fa682c2a6e/go.mod h1:n7NCudcB/nEzxVGmLbDWY5pfWTLqBcC2KZ6jyYvM4mQ=
 golang.org/x/tools v0.0.0-20191119224855-298f0cb1881e/go.mod h1:b+2E5dAYhXwXZwtnZ6UAqBI28+e2cm9otk0dWdXHAEo=
 golang.org/x/tools v0.1.12/go.mod h1:hNGJHUnrk76NpqgfD5Aqm5Crs+Hm0VOH/i9J2+nxYbc=
 golang.org/x/tools v0.6.0/go.mod h1:Xwgl3UAJ/d3gWutnCtw505GrjyAbvKui8lOU390QaIU=
+golang.org/x/tools v0.13.0/go.mod h1:HvlwmtVNQAhOuCjW7xxvovg8wbNq7LwfXh/k7wXUl58=
+golang.org/x/tools v0.21.1-0.20240508182429-e35e4ccd0d2d/go.mod h1:aiJjzUbINMkxbQROHiO6hDPo2LHcIPhhQsa9DLh0yGk=
 golang.org/x/xerrors v0.0.0-20190717185122-a985d3407aa7/go.mod h1:I/5z698sn9Ka8TeJc9MKroUUfqBBauWjQqLJ2OPfmY0=
 google.golang.org/appengine v1.6.5/go.mod h1:8WjMMxjGQR8xUklV/ARdw2HLXBOI7O7uCIDZVag1xfc=
 gopkg.in/check.v1 v0.0.0-20161208181325-20d25e280405/go.mod h1:Co6ibVJAznAaIkqp8huTwlJQCZ016jof/cbN4VW5Yz0=
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 9428f883..726bf0b1 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -907,6 +907,7 @@
   "globals.messages.replying": "Replying",
   "globals.messages.required": "{name} Required",
   "globals.messages.reset": "Reset",
+  "globals.messages.resetToDefault": "Reset to default",
   "globals.messages.revoke": "Revoke",
   "globals.messages.save": "Save",
   "globals.messages.saveChanges": "Save changes",
@@ -971,6 +972,7 @@
   "globals.terms.body": "Body",
   "globals.terms.brandName": "Brand name",
   "globals.terms.breadcrumb": "Breadcrumb",
+  "globals.terms.browserNotification": "Browser notification | Browser notifications",
   "globals.terms.businessHour": "Business hour | Business hours",
   "globals.terms.callbackURL": "Callback URL",
   "globals.terms.category": "Category",
@@ -1042,6 +1044,7 @@
   "globals.terms.hour": "Hour | Hours",
   "globals.terms.icon": "Icon | Icons",
   "globals.terms.image": "Image | Images",
+  "globals.terms.inApp": "In-app",
   "globals.terms.import": "Import | Imports",
   "globals.terms.inactive": "Inactive | Inactives",
   "globals.terms.inbox": "Inbox | Inboxes",
@@ -1109,6 +1112,7 @@
   "globals.terms.provider": "Provider | Providers",
   "globals.terms.providerURL": "Provider URL",
   "globals.terms.published": "Published",
+  "globals.terms.push": "Push",
   "globals.terms.read": "Read",
   "globals.terms.reconnect": "Reconnect",
   "globals.terms.referenceNumber": "Reference number",
@@ -1374,11 +1378,32 @@
   "navigation.keyboardShortcuts": "Keyboard shortcuts",
   "navigation.logout": "Logout",
   "navigation.reassignReplies": "Reassign replies",
+  "notification.browserPush.blocked": "Browser notifications are blocked. Allow them in your browser settings to receive notifications on this device.",
+  "notification.browserPush.description": "Receive notifications on this device when libredesk is closed.",
+  "notification.browserPush.unavailable": "Browser notifications are unavailable because push is not configured. Ask an administrator to configure push notifications.",
+  "notification.browserPush.unsupported": "This browser does not support push notifications. Use a supported browser to receive notifications when libredesk is closed.",
+  "notification.channelToggleLabel": "{channel} notifications for {type}",
   "notification.conversationAssigned": "Conversation assigned to you #{referenceNumber}",
+  "notification.conversationReopened": "Conversation reopened #{referenceNumber}",
+  "notification.emailChannelDisabled": "Email notifications are turned off for this workspace. Contact your administrator to enable them.",
+  "notification.invalidPreference": "Unknown notification type or channel. The preference was not saved.",
+  "notification.invalidPushSubscription": "This browser subscription is invalid. Disable and enable browser notifications, then try again.",
   "notification.mentionedInConversation": "{author} mentioned you in #{referenceNumber}",
+  "notification.newReply": "New reply on #{referenceNumber}",
   "notification.slaAlert": "SLA {type}: {metric} for #{referenceNumber}",
   "notification.slaDueIn": "Due in {duration}",
   "notification.slaOverdue": "Overdue by {duration}",
+  "notification.type.assignment": "Conversation assigned to me",
+  "notification.type.conversationReopened": "Conversation assigned to me is reopened by a reply",
+  "notification.type.mention": "Mentioned in a conversation",
+  "notification.type.newReply": "New reply on a conversation assigned to me",
+  "notification.type.newReplyParticipating": "New reply on a conversation I'm participating in",
+  "notification.type.slaFirstResponseBreach": "First response SLA breached",
+  "notification.type.slaFirstResponseWarning": "First response SLA breach warning",
+  "notification.type.slaNextResponseBreach": "Next response SLA breached",
+  "notification.type.slaNextResponseWarning": "Next response SLA breach warning",
+  "notification.type.slaResolutionBreach": "Resolution SLA breached",
+  "notification.type.slaResolutionWarning": "Resolution SLA breach warning",
   "oidc.edit": "Edit SSO",
   "oidc.new": "New SSO",
   "placeholders.chatIntroduction": "Ask us anything, or share your feedback.",
diff --git a/internal/conversation/conversation.go b/internal/conversation/conversation.go
index 657c4210..42fbd58c 100644
--- a/internal/conversation/conversation.go
+++ b/internal/conversation/conversation.go
@@ -8,6 +8,8 @@ import (
 	"encoding/json"
 	"errors"
 	"fmt"
+	"html"
+	htmltemplate "html/template"
 	"io"
 	"slices"
 	"strconv"
@@ -29,7 +31,6 @@ import (
 	"github.com/abhinavxd/libredesk/internal/inbox"
 	imodels "github.com/abhinavxd/libredesk/internal/inbox/models"
 	mmodels "github.com/abhinavxd/libredesk/internal/media/models"
-	notifier "github.com/abhinavxd/libredesk/internal/notification"
 	nmodels "github.com/abhinavxd/libredesk/internal/notification/models"
 	slaModels "github.com/abhinavxd/libredesk/internal/sla/models"
 	"github.com/abhinavxd/libredesk/internal/stringutil"
@@ -42,6 +43,7 @@ import (
 	"github.com/jmoiron/sqlx/types"
 	"github.com/knadh/go-i18n"
 	"github.com/lib/pq"
+	"github.com/redis/go-redis/v9"
 	"github.com/volatiletech/null/v9"
 	"github.com/zerodha/logf"
 )
@@ -65,6 +67,9 @@ const (
 <p>
 <a href="{{ RootURL }}/inboxes/all/conversation/{{ .Conversation.UUID }}">#{{ .Conversation.ReferenceNumber }}</a>
 </p>`
+	newReplyEmailDelay     = 2 * time.Minute
+	replyNotifiedKeyPrefix = "conversation:reply-notified:"
+	replyNotifiedTTL       = 7 * 24 * time.Hour
 )
 
 var conversationFilterRenderers = dbutil.FieldRenderers{
@@ -80,6 +85,10 @@ var conversationListAllowedFields = dbutil.AllowedFields{
 	"inboxes":               inboxesAllowedFields,
 }
 
+type notificationDispatcher interface {
+	Send(nmodels.Notification) ([]nmodels.DeliveryResult, error)
+}
+
 // Manager handles the operations related to conversations
 type Manager struct {
 	q                          queries
@@ -93,7 +102,7 @@ type Manager struct {
 	settingsStore              settingsStore
 	csatStore                  csatStore
 	webhookStore               webhookStore
-	dispatcher                 *notifier.Dispatcher
+	dispatcher                 notificationDispatcher
 	lo                         *logf.Logger
 	db                         *sqlx.DB
 	i18n                       *i18n.I18n
@@ -105,12 +114,21 @@ type Manager struct {
 	outgoingProcessingMessages sync.Map
 	closed                     bool
 	closedMu                   sync.RWMutex
+	replyNotificationMu        sync.Mutex
+	rdb                        *redis.Client
 	wg                         sync.WaitGroup
 	continuityConfig           ContinuityConfig
 	subjectRefFormat           string
 	aiAgent                    AIAgentEngine
 }
 
+type replyNotificationGroup struct {
+	nType      nmodels.NotificationType
+	tmpl       string
+	title      string
+	recipients []umodels.User
+}
+
 // AIAgentEngine is notified when a conversation assigned to an AI assistant may need a response.
 type AIAgentEngine interface {
 	HandleConversationEvent(conversationID, assigneeUserID int)
@@ -163,7 +181,6 @@ type teamStore interface {
 
 type userStore interface {
 	Get(int, string, []string) (umodels.User, error)
-	GetAgent(int, string) (umodels.User, error)
 	GetAgentCachedOrLoad(int) (umodels.User, error)
 	GetSystemUser() (umodels.User, error)
 	ResolveContact(user *umodels.User, policy umodels.ContactPolicy) error
@@ -216,6 +233,7 @@ type ContinuityConfig struct {
 // Opts holds the options for creating a new Manager.
 type Opts struct {
 	DB                       *sqlx.DB
+	Redis                    *redis.Client
 	Lo                       *logf.Logger
 	OutgoingMessageQueueSize int
 	IncomingMessageQueueSize int
@@ -239,7 +257,7 @@ func New(
 	automation *automation.Engine,
 	template *template.Manager,
 	webhook webhookStore,
-	dispatcher *notifier.Dispatcher,
+	dispatcher notificationDispatcher,
 	opts Opts) (*Manager, error) {
 
 	var q queries
@@ -284,6 +302,7 @@ func New(
 		automation:                 automation,
 		template:                   template,
 		db:                         opts.DB,
+		rdb:                        opts.Redis,
 		lo:                         opts.Lo,
 		incomingMessageQueue:       make(chan models.IncomingMessage, opts.IncomingMessageQueueSize),
 		outgoingMessageQueue:       make(chan models.Message, opts.OutgoingMessageQueueSize),
@@ -297,44 +316,46 @@ func New(
 
 type queries struct {
 	// Conversation queries.
-	GetConversationUUID                 *sqlx.Stmt `query:"get-conversation-uuid"`
-	GetConversation                     *sqlx.Stmt `query:"get-conversation"`
-	GetConversationListItem             *sqlx.Stmt `query:"get-conversation-list-item"`
-	GetConversationsCreatedAfter        *sqlx.Stmt `query:"get-conversations-created-after"`
-	GetUnassignedConversations          *sqlx.Stmt `query:"get-unassigned-conversations"`
-	GetConversations                    string     `query:"get-conversations"`
-	GetContactChatConversations         *sqlx.Stmt `query:"get-contact-chat-conversations"`
-	GetChatConversation                 *sqlx.Stmt `query:"get-chat-conversation"`
-	GetContactPreviousConversations     *sqlx.Stmt `query:"get-contact-previous-conversations"`
-	GetContactConversationsForAI        *sqlx.Stmt `query:"get-contact-conversations-for-ai"`
-	GetConversationsByContactEmailForAI *sqlx.Stmt `query:"get-conversations-by-contact-email-for-ai"`
-	GetConversationParticipants         *sqlx.Stmt `query:"get-conversation-participants"`
-	GetUserActiveConversationsCount     *sqlx.Stmt `query:"get-user-active-conversations-count"`
-	GetSidebarStandardCounts            *sqlx.Stmt `query:"get-sidebar-standard-counts"`
-	GetConversationsCountBase           string     `query:"get-conversations-count-base"`
-	StartConversationWaitingSince       *sqlx.Stmt `query:"start-conversation-waiting-since"`
-	UpdateConversationReplyTimestamps   *sqlx.Stmt `query:"update-conversation-reply-timestamps"`
-	UpdateConversationContactLastSeen   *sqlx.Stmt `query:"update-conversation-contact-last-seen"`
-	UpsertUserLastSeen                  *sqlx.Stmt `query:"upsert-user-last-seen"`
-	MarkConversationUnread              *sqlx.Stmt `query:"mark-conversation-unread"`
-	UpdateConversationAssignedUser      *sqlx.Stmt `query:"update-conversation-assigned-user"`
-	ClaimUnassignedConversation         *sqlx.Stmt `query:"claim-unassigned-conversation"`
-	UpdateConversationAssignedTeam      *sqlx.Stmt `query:"update-conversation-assigned-team"`
-	UpdateConversationCustomAttributes  *sqlx.Stmt `query:"update-conversation-custom-attributes"`
-	UpdateConversationPriority          *sqlx.Stmt `query:"update-conversation-priority"`
-	UpdateConversationStatus            *sqlx.Stmt `query:"update-conversation-status"`
-	UpdateConversationLastMessage       *sqlx.Stmt `query:"update-conversation-last-message"`
-	InsertConversationParticipant       *sqlx.Stmt `query:"insert-conversation-participant"`
-	InsertConversation                  *sqlx.Stmt `query:"insert-conversation"`
-	AddConversationTags                 *sqlx.Stmt `query:"add-conversation-tags"`
-	SetConversationTags                 *sqlx.Stmt `query:"set-conversation-tags"`
-	RemoveConversationTags              *sqlx.Stmt `query:"remove-conversation-tags"`
-	GetConversationTags                 *sqlx.Stmt `query:"get-conversation-tags"`
-	UnassignOpenConversations           *sqlx.Stmt `query:"unassign-open-conversations"`
-	ReOpenConversation                  *sqlx.Stmt `query:"re-open-conversation"`
-	UnsnoozeAll                         *sqlx.Stmt `query:"unsnooze-all"`
-	DeleteConversation                  *sqlx.Stmt `query:"delete-conversation"`
-	RemoveConversationAssignee          *sqlx.Stmt `query:"remove-conversation-assignee"`
+	GetConversationUUID                   *sqlx.Stmt `query:"get-conversation-uuid"`
+	GetConversation                       *sqlx.Stmt `query:"get-conversation"`
+	GetConversationListItem               *sqlx.Stmt `query:"get-conversation-list-item"`
+	GetConversationsCreatedAfter          *sqlx.Stmt `query:"get-conversations-created-after"`
+	GetUnassignedConversations            *sqlx.Stmt `query:"get-unassigned-conversations"`
+	GetConversations                      string     `query:"get-conversations"`
+	GetContactChatConversations           *sqlx.Stmt `query:"get-contact-chat-conversations"`
+	GetChatConversation                   *sqlx.Stmt `query:"get-chat-conversation"`
+	GetContactPreviousConversations       *sqlx.Stmt `query:"get-contact-previous-conversations"`
+	GetContactConversationsForAI          *sqlx.Stmt `query:"get-contact-conversations-for-ai"`
+	GetConversationsByContactEmailForAI   *sqlx.Stmt `query:"get-conversations-by-contact-email-for-ai"`
+	GetConversationParticipants           *sqlx.Stmt `query:"get-conversation-participants"`
+	GetConversationParticipantAgents      *sqlx.Stmt `query:"get-conversation-participant-agents"`
+	GetUserActiveConversationsCount       *sqlx.Stmt `query:"get-user-active-conversations-count"`
+	GetSidebarStandardCounts              *sqlx.Stmt `query:"get-sidebar-standard-counts"`
+	GetConversationsCountBase             string     `query:"get-conversations-count-base"`
+	StartConversationWaitingSince         *sqlx.Stmt `query:"start-conversation-waiting-since"`
+	UpdateConversationReplyTimestamps     *sqlx.Stmt `query:"update-conversation-reply-timestamps"`
+	UpdateConversationContactLastSeen     *sqlx.Stmt `query:"update-conversation-contact-last-seen"`
+	UpsertUserLastSeen                    *sqlx.Stmt `query:"upsert-user-last-seen"`
+	GetUsersWithUnreadConversationMessage *sqlx.Stmt `query:"get-users-with-unread-conversation-message"`
+	MarkConversationUnread                *sqlx.Stmt `query:"mark-conversation-unread"`
+	UpdateConversationAssignedUser        *sqlx.Stmt `query:"update-conversation-assigned-user"`
+	ClaimUnassignedConversation           *sqlx.Stmt `query:"claim-unassigned-conversation"`
+	UpdateConversationAssignedTeam        *sqlx.Stmt `query:"update-conversation-assigned-team"`
+	UpdateConversationCustomAttributes    *sqlx.Stmt `query:"update-conversation-custom-attributes"`
+	UpdateConversationPriority            *sqlx.Stmt `query:"update-conversation-priority"`
+	UpdateConversationStatus              *sqlx.Stmt `query:"update-conversation-status"`
+	UpdateConversationLastMessage         *sqlx.Stmt `query:"update-conversation-last-message"`
+	InsertConversationParticipant         *sqlx.Stmt `query:"insert-conversation-participant"`
+	InsertConversation                    *sqlx.Stmt `query:"insert-conversation"`
+	AddConversationTags                   *sqlx.Stmt `query:"add-conversation-tags"`
+	SetConversationTags                   *sqlx.Stmt `query:"set-conversation-tags"`
+	RemoveConversationTags                *sqlx.Stmt `query:"remove-conversation-tags"`
+	GetConversationTags                   *sqlx.Stmt `query:"get-conversation-tags"`
+	UnassignOpenConversations             *sqlx.Stmt `query:"unassign-open-conversations"`
+	ReOpenConversation                    *sqlx.Stmt `query:"re-open-conversation"`
+	UnsnoozeAll                           *sqlx.Stmt `query:"unsnooze-all"`
+	DeleteConversation                    *sqlx.Stmt `query:"delete-conversation"`
+	RemoveConversationAssignee            *sqlx.Stmt `query:"remove-conversation-assignee"`
 
 	// Draft queries.
 	UpsertConversationDraft *sqlx.Stmt `query:"upsert-conversation-draft"`
@@ -537,22 +558,56 @@ func (c *Manager) GetConversationsCreatedAfter(after time.Time, afterID, limit i
 
 // UpdateUserLastSeen updates the last seen timestamp for a specific user on a conversation.
 func (c *Manager) UpdateUserLastSeen(uuid string, userID int) error {
+	c.replyNotificationMu.Lock()
+	defer c.replyNotificationMu.Unlock()
+
 	if _, err := c.q.UpsertUserLastSeen.Exec(userID, uuid); err != nil {
 		c.lo.Error("error upserting user last seen", "user_id", userID, "conversation_uuid", uuid, "error", err)
 		return envelope.NewError(envelope.GeneralError, c.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
+	c.clearReplyNotified(uuid, userID)
 	return nil
 }
 
 // MarkAsUnread marks a conversation as unread for a specific user by setting last_seen to before the last message.
 func (c *Manager) MarkAsUnread(uuid string, userID int) error {
+	c.replyNotificationMu.Lock()
+	defer c.replyNotificationMu.Unlock()
+
 	if _, err := c.q.MarkConversationUnread.Exec(userID, uuid); err != nil {
 		c.lo.Error("error marking conversation as unread", "user_id", userID, "conversation_uuid", uuid, "error", err)
 		return envelope.NewError(envelope.GeneralError, c.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
+	c.clearReplyNotified(uuid, userID)
 	return nil
 }
 
+// ReleaseReplyNotification clears reply suppression for an abandoned email, preserving newer claims.
+func (m *Manager) ReleaseReplyNotification(conversationID, userID int, messageCreatedAt time.Time) {
+	if m.rdb == nil {
+		return
+	}
+	uuid, err := m.GetConversationUUID(conversationID)
+	if err != nil {
+		return
+	}
+
+	m.replyNotificationMu.Lock()
+	defer m.replyNotificationMu.Unlock()
+
+	claim, err := m.rdb.Get(context.Background(), replyNotifiedKey(uuid, userID)).Int64()
+	if errors.Is(err, redis.Nil) {
+		return
+	}
+	if err != nil {
+		m.lo.Error("error fetching reply notification claim", "conversation_uuid", uuid, "user_id", userID, "error", err)
+		return
+	}
+	if claim == 1 || claim == messageCreatedAt.UnixMicro() {
+		m.clearReplyNotified(uuid, userID)
+	}
+}
+
 // UpdateContactLastSeen updates the last seen timestamp of the contact in the conversation.
 func (c *Manager) UpdateConversationContactLastSeen(uuid string) error {
 	var lastSeenAt time.Time
@@ -683,14 +738,14 @@ func (c *Manager) GetConversations(viewingUserID, userID int, teamIDs []int, lis
 }
 
 // ReOpenConversation reopens a conversation if it's snoozed, resolved or closed.
-func (c *Manager) ReOpenConversation(conversationUUID string, actor umodels.User) error {
+func (c *Manager) ReOpenConversation(conversationUUID string, actor umodels.User) (bool, error) {
 	var conversationID int
 	if err := c.q.ReOpenConversation.QueryRow(conversationUUID).Scan(&conversationID); err != nil {
 		if err == sql.ErrNoRows {
-			return nil
+			return false, nil
 		}
 		c.lo.Error("error reopening conversation", "uuid", conversationUUID, "error", err)
-		return envelope.NewError(envelope.GeneralError, c.i18n.T("globals.messages.somethingWentWrong"), nil)
+		return false, envelope.NewError(envelope.GeneralError, c.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
 
 	// Reopening revives any first response or resolution deadline the resolved status had nulled.
@@ -701,9 +756,9 @@ func (c *Manager) ReOpenConversation(conversationUUID string, actor umodels.User
 	c.BroadcastConversationUpdate(conversationUUID, map[string]any{"status": models.StatusOpen})
 
 	if err := c.RecordStatusChange(models.StatusOpen, conversationUUID, actor); err != nil {
-		return err
+		return true, err
 	}
-	return nil
+	return true, nil
 }
 
 // ActiveUserConversationsCount returns the count of active conversations for a user. i.e. conversations not closed or resolved status.
@@ -811,7 +866,7 @@ func (c *Manager) afterUserAssignedHooks(uuid string, assigneeID int, actor umod
 		return envelope.NewError(envelope.GeneralError, c.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
 
-	agent, err := c.userStore.GetAgent(assigneeID, "")
+	agent, err := c.userStore.GetAgentCachedOrLoad(assigneeID)
 	if err == nil {
 		c.SignAvatarURL(&agent.AvatarURL)
 		// Always send expectation (empty for humans) so it clears when the AI hands off to an agent.
@@ -1211,64 +1266,244 @@ func (m *Manager) SendTransientEmail(inboxID, conversationID int, conversationUU
 
 // NotifyAssignment sends notifications (in-app, WebSocket, email) for an assigned conversation.
 func (m *Manager) NotifyAssignment(userIDs []int, conversation models.Conversation) error {
-	agent, err := m.userStore.GetAgent(userIDs[0], "")
+	agent, err := m.userStore.GetAgentCachedOrLoad(userIDs[0])
 	if err != nil {
 		m.lo.Error("error fetching agent", "user_id", userIDs[0], "error", err)
 		return fmt.Errorf("fetching agent: %w", err)
 	}
 
-	// Render email template.
+	// Automated messages do not have an author.
 	content, subject, err := m.template.RenderStoredEmailTemplate(template.TmplConversationAssigned,
-		map[string]any{
-			"Conversation": map[string]any{
-				"ReferenceNumber": conversation.ReferenceNumber,
-				"Subject":         conversation.Subject.String,
-				"Priority":        conversation.Priority.String,
-				"UUID":            conversation.UUID,
-			},
-			"Contact": map[string]any{
-				"FirstName": conversation.Contact.FirstName,
-				"LastName":  conversation.Contact.LastName,
-				"FullName":  conversation.Contact.FullName(),
-				"Email":     conversation.Contact.Email.String,
-			},
-			"Recipient": map[string]any{
-				"FirstName": agent.FirstName,
-				"LastName":  agent.LastName,
-				"FullName":  agent.FullName(),
-				"Email":     agent.Email.String,
-			},
-			// Automated messages do not have an author.
-			"Author": map[string]any{
-				"FirstName": "",
-				"LastName":  "",
-				"FullName":  "",
-				"Email":     "",
-			},
-		})
+		notificationTemplateData(conversation, agent, umodels.User{}))
 	if err != nil {
 		m.lo.Error("error rendering template", "template", template.TmplConversationAssigned, "conversation_uuid", conversation.UUID, "error", err)
 		return fmt.Errorf("rendering template: %w", err)
 	}
 
-	// Send notification.
-	m.dispatcher.Send(notifier.Notification{
-		Type:             nmodels.NotificationTypeAssignment,
-		RecipientIDs:     []int{agent.ID},
+	if _, err := m.dispatcher.Send(nmodels.Notification{
+		Type: nmodels.NotificationTypeAssignment,
+		Recipients: []nmodels.Recipient{{
+			UserID: agent.ID,
+			Email: &nmodels.EmailNotification{
+				Recipient: agent.Email.String,
+				Subject:   subject,
+				Content:   content,
+			},
+		}},
 		Title:            m.i18n.Ts("notification.conversationAssigned", "referenceNumber", conversation.ReferenceNumber),
 		Body:             conversation.Subject,
 		ConversationID:   null.IntFrom(conversation.ID),
 		ConversationUUID: conversation.UUID,
-		// Parms required for email
-		Email: &notifier.EmailNotification{
-			Recipients: []string{agent.Email.String},
-			Subject:    subject,
-			Content:    content,
-		},
-	})
+	}); err != nil {
+		return fmt.Errorf("sending assignment notification: %w", err)
+	}
 	return nil
 }
 
+// NotifyNewReply notifies the assigned agent and the other participating agents of an incoming reply.
+func (m *Manager) NotifyNewReply(conversation models.Conversation, message models.Message, reopened bool) {
+	assigneeType, assigneeTmpl, assigneeTitleKey := nmodels.NotificationTypeNewReply, template.TmplNewReply, "notification.newReply"
+	if reopened {
+		assigneeType, assigneeTmpl, assigneeTitleKey = nmodels.NotificationTypeConversationReopened, template.TmplConversationReopened, "notification.conversationReopened"
+	}
+
+	groups := []replyNotificationGroup{
+		{
+			nType:      assigneeType,
+			tmpl:       assigneeTmpl,
+			title:      m.i18n.Ts(assigneeTitleKey, "referenceNumber", conversation.ReferenceNumber),
+			recipients: m.replyNotificationAssignee(conversation, message.SenderID),
+		},
+		{
+			nType:      nmodels.NotificationTypeNewReplyParticipating,
+			tmpl:       template.TmplNewReplyParticipating,
+			title:      m.i18n.Ts("notification.newReply", "referenceNumber", conversation.ReferenceNumber),
+			recipients: m.replyNotificationParticipants(conversation, message.SenderID),
+		},
+	}
+	if !slices.ContainsFunc(groups, func(g replyNotificationGroup) bool { return len(g.recipients) > 0 }) {
+		return
+	}
+
+	author, err := m.userStore.Get(message.SenderID, "", []string{})
+	if err != nil {
+		m.lo.Error("error fetching sender for new reply notification", "user_id", message.SenderID, "error", err)
+		return
+	}
+
+	for _, group := range groups {
+		m.sendReplyNotification(conversation, message, group, author)
+	}
+}
+
+func (m *Manager) replyNotificationAssignee(conversation models.Conversation, senderID int) []umodels.User {
+	assigneeID := conversation.AssignedUserID.Int
+	if assigneeID == 0 || assigneeID == senderID {
+		return nil
+	}
+	agent, ok := m.notifiableAgent(assigneeID, conversation)
+	if !ok {
+		return nil
+	}
+	return []umodels.User{agent}
+}
+
+func (m *Manager) replyNotificationParticipants(conversation models.Conversation, senderID int) []umodels.User {
+	var participants []umodels.User
+	if err := m.q.GetConversationParticipantAgents.Select(&participants, conversation.UUID); err != nil {
+		m.lo.Error("error fetching participants for new reply notification", "conversation_uuid", conversation.UUID, "error", err)
+		return nil
+	}
+	agents := make([]umodels.User, 0, len(participants))
+	for _, participant := range participants {
+		if participant.ID == senderID || participant.ID == conversation.AssignedUserID.Int {
+			continue
+		}
+		if agent, ok := m.notifiableAgent(participant.ID, conversation); ok {
+			agents = append(agents, agent)
+		}
+	}
+	return agents
+}
+
+func (m *Manager) notifiableAgent(userID int, conversation models.Conversation) (umodels.User, bool) {
+	agent, err := m.userStore.GetAgentCachedOrLoad(userID)
+	if err != nil {
+		m.lo.Error("error fetching agent for new reply notification", "user_id", userID, "error", err)
+		return umodels.User{}, false
+	}
+	if !agent.Enabled || !authz.CanReadAssignment(agent, conversation.AssignedUserID, conversation.AssignedTeamID) {
+		return umodels.User{}, false
+	}
+	return agent, true
+}
+
+func (m *Manager) sendReplyNotification(conversation models.Conversation, message models.Message, group replyNotificationGroup, author umodels.User) {
+	if len(group.recipients) == 0 {
+		return
+	}
+	candidateIDs := make([]int, len(group.recipients))
+	for i, recipient := range group.recipients {
+		candidateIDs[i] = recipient.ID
+	}
+
+	claimedIDs, err := m.claimUnreadRecipients(conversation, candidateIDs, message.CreatedAt)
+	if err != nil {
+		return
+	}
+
+	var recipients []nmodels.Recipient
+	for _, recipient := range group.recipients {
+		if !slices.Contains(claimedIDs, recipient.ID) {
+			continue
+		}
+		email := m.renderNotificationEmail(group.tmpl, conversation, message, recipient, author)
+		if email != nil {
+			email.Delay = newReplyEmailDelay
+		}
+		recipients = append(recipients, nmodels.Recipient{UserID: recipient.ID, Email: email})
+	}
+	if len(recipients) == 0 {
+		return
+	}
+
+	results, err := m.dispatcher.Send(nmodels.Notification{
+		Type:             group.nType,
+		Recipients:       recipients,
+		Title:            group.title,
+		Body:             conversation.Subject,
+		ConversationID:   null.IntFrom(conversation.ID),
+		MessageID:        null.IntFrom(message.ID),
+		ConversationUUID: conversation.UUID,
+		MessageUUID:      message.UUID,
+		MessageCreatedAt: null.TimeFrom(message.CreatedAt),
+	})
+	if err != nil {
+		m.lo.Error("error sending reply notification", "type", group.nType, "error", err)
+		m.clearReplyNotified(conversation.UUID, claimedIDs...)
+		return
+	}
+	var untracked []int
+	for _, result := range results {
+		if !slices.Contains(result.Channels, nmodels.NotificationChannelInApp) &&
+			!slices.Contains(result.Channels, nmodels.NotificationChannelEmail) {
+			untracked = append(untracked, result.RecipientID)
+		}
+	}
+	m.clearReplyNotified(conversation.UUID, untracked...)
+}
+
+// claimUnreadRecipients holds the reply notification lock across the unread check and the claim, returning the claimed recipients.
+func (m *Manager) claimUnreadRecipients(conversation models.Conversation, userIDs []int, messageCreatedAt time.Time) ([]int, error) {
+	m.replyNotificationMu.Lock()
+	defer m.replyNotificationMu.Unlock()
+
+	var unreadIDs []int
+	if err := m.q.GetUsersWithUnreadConversationMessage.Select(&unreadIDs, conversation.ID, pq.Array(userIDs), messageCreatedAt); err != nil {
+		m.lo.Error("error checking conversation unread state", "conversation_uuid", conversation.UUID, "error", err)
+		return nil, err
+	}
+	return m.claimReplyNotified(conversation.UUID, unreadIDs, messageCreatedAt), nil
+}
+
+func (m *Manager) claimReplyNotified(conversationUUID string, userIDs []int, messageCreatedAt time.Time) []int {
+	if len(userIDs) == 0 || m.rdb == nil {
+		return userIDs
+	}
+	ctx := context.Background()
+	pipe := m.rdb.Pipeline()
+	claims := make([]*redis.BoolCmd, len(userIDs))
+	for i, userID := range userIDs {
+		claims[i] = pipe.SetNX(ctx, replyNotifiedKey(conversationUUID, userID), messageCreatedAt.UnixMicro(), replyNotifiedTTL)
+	}
+	if _, err := pipe.Exec(ctx); err != nil {
+		m.lo.Error("error claiming reply notifications", "conversation_uuid", conversationUUID, "error", err)
+		return userIDs
+	}
+	claimed := make([]int, 0, len(userIDs))
+	for i, userID := range userIDs {
+		if claims[i].Val() {
+			claimed = append(claimed, userID)
+		}
+	}
+	return claimed
+}
+
+func (m *Manager) clearReplyNotified(conversationUUID string, userIDs ...int) {
+	if len(userIDs) == 0 || m.rdb == nil {
+		return
+	}
+	keys := make([]string, len(userIDs))
+	for i, userID := range userIDs {
+		keys[i] = replyNotifiedKey(conversationUUID, userID)
+	}
+	if err := m.rdb.Del(context.Background(), keys...).Err(); err != nil {
+		m.lo.Error("error clearing reply notification", "user_ids", userIDs, "conversation_uuid", conversationUUID, "error", err)
+	}
+}
+
+// renderNotificationEmail returns nil when the recipient has no email or the template fails to render.
+func (m *Manager) renderNotificationEmail(tmplName string, conversation models.Conversation, message models.Message, recipient, author umodels.User) *nmodels.EmailNotification {
+	if recipient.Email.String == "" {
+		return nil
+	}
+	data := notificationTemplateData(conversation, recipient, author)
+	data["Message"] = map[string]any{
+		"UUID":    message.UUID,
+		"Content": htmltemplate.HTML(strings.ReplaceAll(html.EscapeString(message.TextContent), "\n", "<br>")),
+	}
+	content, subject, err := m.template.RenderStoredEmailTemplate(tmplName, data)
+	if err != nil {
+		m.lo.Error("error rendering template", "template", tmplName, "conversation_uuid", conversation.UUID, "error", err)
+		return nil
+	}
+	return &nmodels.EmailNotification{
+		Recipient: recipient.Email.String,
+		Subject:   subject,
+		Content:   content,
+	}
+}
+
 // NotifyMention sends notifications (in-app, WebSocket, email) for mentions.
 // For team mentions, expands to all team members.
 func (m *Manager) NotifyMention(conversationUUID string, message models.Message, mentions []models.MentionInput, mentionedByUserID int) {
@@ -1279,7 +1514,7 @@ func (m *Manager) NotifyMention(conversationUUID string, message models.Message,
 	}
 
 	// Get the user who made the mention.
-	author, err := m.userStore.GetAgent(mentionedByUserID, "")
+	author, err := m.userStore.GetAgentCachedOrLoad(mentionedByUserID)
 	if err != nil {
 		m.lo.Error("error fetching author for mention notification", "user_id", mentionedByUserID, "error", err)
 		return
@@ -1317,9 +1552,9 @@ func (m *Manager) NotifyMention(conversationUUID string, message models.Message,
 	if err != nil {
 		m.lo.Error("error fetching root URL for mention notification", "error", err)
 	}
-	messageContent := absolutizeConversationReferenceLinks(message.Content, rootURL)
+	messageContent := sanitizeNotificationHTML(message.Content, rootURL)
 
-	recipientIDs, emails := m.buildRecipientEmails(userIDs, func(recipient umodels.User) (string, string, error) {
+	recipients := m.buildNotificationRecipients(userIDs, func(recipient umodels.User) (string, string, error) {
 		content, subject, err := m.template.RenderStoredEmailTemplate(template.TmplMentioned,
 			map[string]any{
 				"Conversation": map[string]any{
@@ -1355,23 +1590,25 @@ func (m *Manager) NotifyMention(conversationUUID string, message models.Message,
 		return subject, content, err
 	})
 
-	if len(recipientIDs) == 0 {
+	if len(recipients) == 0 {
 		return
 	}
 
-	// Send notification via dispatcher (handles in-app, WebSocket, and email).
-	m.dispatcher.SendWithEmails(notifier.Notification{
+	if _, err := m.dispatcher.Send(nmodels.Notification{
 		Type:             nmodels.NotificationTypeMention,
-		RecipientIDs:     recipientIDs,
+		Recipients:       recipients,
 		Title:            m.i18n.Ts("notification.mentionedInConversation", "author", author.FullName(), "referenceNumber", conversation.ReferenceNumber),
 		Body:             null.StringFrom(message.TextContent),
 		ConversationID:   null.IntFrom(conversation.ID),
 		MessageID:        null.IntFrom(message.ID),
 		ActorID:          null.IntFrom(mentionedByUserID),
 		ConversationUUID: conversation.UUID,
+		MessageUUID:      message.UUID,
 		ActorFirstName:   author.FirstName,
 		ActorLastName:    author.LastName,
-	}, emails)
+	}); err != nil {
+		m.lo.Error("error sending mention notification", "error", err)
+	}
 }
 
 // UnassignOpen unassigns all open conversations belonging to a user.
@@ -1542,7 +1779,7 @@ func (m *Manager) notifyAutomation(subject, message string, entries []string, co
 		userIDs = userIDs[:amodels.MaxNotifyRecipients]
 	}
 
-	recipientIDs, emails := m.buildRecipientEmails(userIDs, func(recipient umodels.User) (string, string, error) {
+	recipients := m.buildNotificationRecipients(userIDs, func(recipient umodels.User) (string, string, error) {
 		content, err := m.template.RenderEmailWithTemplate(
 			map[string]any{
 				"Conversation": map[string]any{
@@ -1576,49 +1813,46 @@ func (m *Manager) notifyAutomation(subject, message string, entries []string, co
 		return subject, content, err
 	})
 
-	m.dispatcher.SendWithEmails(notifier.Notification{
+	if _, err := m.dispatcher.Send(nmodels.Notification{
 		Type:             nmodels.NotificationTypeMention,
-		RecipientIDs:     recipientIDs,
+		Recipients:       recipients,
 		Title:            subject,
 		Body:             null.StringFrom(message),
 		ConversationID:   null.IntFrom(conv.ID),
 		ConversationUUID: conv.UUID,
-	}, emails)
+	}); err != nil {
+		return fmt.Errorf("sending automation notification: %w", err)
+	}
 	return nil
 }
 
-// buildRecipientEmails fetches each recipient and renders their email, returning emails index-aligned with recipient IDs; on fetch or render failure the in-app notification still goes out with a zero-value email.
-func (m *Manager) buildRecipientEmails(userIDs []int, render func(recipient umodels.User) (subject, content string, err error)) ([]int, []notifier.EmailNotification) {
-	var (
-		recipientIDs []int
-		emails       []notifier.EmailNotification
-	)
+func (m *Manager) buildNotificationRecipients(userIDs []int, render func(recipient umodels.User) (subject, content string, err error)) []nmodels.Recipient {
+	recipients := make([]nmodels.Recipient, 0, len(userIDs))
 	for _, id := range userIDs {
-		recipientIDs = append(recipientIDs, id)
+		delivery := nmodels.Recipient{UserID: id}
 
 		recipient, err := m.userStore.GetAgentCachedOrLoad(id)
 		if err != nil {
 			m.lo.Error("error fetching agent for email notification", "user_id", id, "error", err)
-			emails = append(emails, notifier.EmailNotification{})
+			recipients = append(recipients, delivery)
 			continue
 		}
 
-		var email notifier.EmailNotification
 		if recipient.Email.String != "" {
 			subject, content, err := render(recipient)
 			if err != nil {
 				m.lo.Error("error rendering email notification", "user_id", id, "error", err)
 			} else {
-				email = notifier.EmailNotification{
-					Recipients: []string{recipient.Email.String},
-					Subject:    subject,
-					Content:    content,
+				delivery.Email = &nmodels.EmailNotification{
+					Recipient: recipient.Email.String,
+					Subject:   subject,
+					Content:   content,
 				}
 			}
 		}
-		emails = append(emails, email)
+		recipients = append(recipients, delivery)
 	}
-	return recipientIDs, emails
+	return recipients
 }
 
 func (m *Manager) resolveNotifyRecipients(entries []string, conv models.Conversation) []int {
@@ -1956,7 +2190,7 @@ func (m *Manager) BuildWidgetConversationView(conversation models.Conversation)
 
 	// Fetch assignee details if assigned
 	if conversation.AssignedUserID.Int > 0 {
-		assignee, err := m.userStore.GetAgent(conversation.AssignedUserID.Int, "")
+		assignee, err := m.userStore.GetAgentCachedOrLoad(conversation.AssignedUserID.Int)
 		if err != nil {
 			m.lo.Error("error fetching conversation assignee for widget", "conversation_uuid", conversation.UUID, "error", err)
 		} else {
@@ -2253,6 +2487,39 @@ func renderTagFilter(operator, value string, paramIndex int) (string, []any, err
 	}
 }
 
+func replyNotifiedKey(conversationUUID string, userID int) string {
+	return replyNotifiedKeyPrefix + conversationUUID + ":" + strconv.Itoa(userID)
+}
+
+func notificationTemplateData(conversation models.Conversation, recipient, author umodels.User) map[string]any {
+	return map[string]any{
+		"Conversation": map[string]any{
+			"ReferenceNumber": conversation.ReferenceNumber,
+			"Subject":         conversation.Subject.String,
+			"Priority":        conversation.Priority.String,
+			"UUID":            conversation.UUID,
+		},
+		"Contact": map[string]any{
+			"FirstName": conversation.Contact.FirstName,
+			"LastName":  conversation.Contact.LastName,
+			"FullName":  conversation.Contact.FullName(),
+			"Email":     conversation.Contact.Email.String,
+		},
+		"Recipient": map[string]any{
+			"FirstName": recipient.FirstName,
+			"LastName":  recipient.LastName,
+			"FullName":  recipient.FullName(),
+			"Email":     recipient.Email.String,
+		},
+		"Author": map[string]any{
+			"FirstName": author.FirstName,
+			"LastName":  author.LastName,
+			"FullName":  author.FullName(),
+			"Email":     author.Email.String,
+		},
+	}
+}
+
 // appendListTypeConditions returns the SQL conditions for the list types, appending their bind parameters to args.
 func appendListTypeConditions(listTypes []string, viewingUserID, userID int, teamIDs []int, args *[]any) ([]string, error) {
 	conditions := make([]string, 0, len(listTypes))
diff --git a/internal/conversation/conversation_reference.go b/internal/conversation/conversation_reference.go
index b600267a..b76f58fe 100644
--- a/internal/conversation/conversation_reference.go
+++ b/internal/conversation/conversation_reference.go
@@ -1,6 +1,13 @@
 package conversation
 
-import "strings"
+import (
+	htmltemplate "html/template"
+	"strings"
+
+	"github.com/microcosm-cc/bluemonday"
+)
+
+var notificationHTMLPolicy = bluemonday.UGCPolicy()
 
 func absolutizeConversationReferenceLinks(content, rootURL string) string {
 	if rootURL == "" {
@@ -12,3 +19,8 @@ func absolutizeConversationReferenceLinks(content, rootURL string) string {
 		`href="`+strings.TrimRight(rootURL, "/")+`/inboxes/all/conversation/`,
 	)
 }
+
+func sanitizeNotificationHTML(content, rootURL string) htmltemplate.HTML {
+	content = notificationHTMLPolicy.Sanitize(content)
+	return htmltemplate.HTML(absolutizeConversationReferenceLinks(content, rootURL))
+}
diff --git a/internal/conversation/conversation_reference_test.go b/internal/conversation/conversation_reference_test.go
index 954b6c91..24a390f3 100644
--- a/internal/conversation/conversation_reference_test.go
+++ b/internal/conversation/conversation_reference_test.go
@@ -1,6 +1,9 @@
 package conversation
 
-import "testing"
+import (
+	"strings"
+	"testing"
+)
 
 func TestAbsolutizeConversationReferenceLinks(t *testing.T) {
 	content := `<p><a href="/inboxes/all/conversation/abc" class="ld-conversation-reference">#108</a> <a href="/help">Help</a> <a href="https://old.example.com/inboxes/all/conversation/def">#109</a></p>`
@@ -10,3 +13,19 @@ func TestAbsolutizeConversationReferenceLinks(t *testing.T) {
 		t.Fatalf("got %q, want %q", got, want)
 	}
 }
+
+func TestSanitizeNotificationHTML(t *testing.T) {
+	content := `<p><strong>Allowed</strong><img src="x" onerror="alert(1)"><script>alert(2)</script><a href="/inboxes/all/conversation/abc">#108</a></p>`
+	got := string(sanitizeNotificationHTML(content, "https://desk.example.com"))
+
+	for _, unsafe := range []string{"onerror", "<script", "alert(1)", "alert(2)"} {
+		if strings.Contains(got, unsafe) {
+			t.Fatalf("unsafe content %q remained in %q", unsafe, got)
+		}
+	}
+	for _, safe := range []string{"<strong>Allowed</strong>", `href="https://desk.example.com/inboxes/all/conversation/abc"`} {
+		if !strings.Contains(got, safe) {
+			t.Fatalf("safe content %q missing from %q", safe, got)
+		}
+	}
+}
diff --git a/internal/conversation/message.go b/internal/conversation/message.go
index 29cea742..b31e3a8c 100644
--- a/internal/conversation/message.go
+++ b/internal/conversation/message.go
@@ -496,7 +496,7 @@ func (m *Manager) CreateContactMessage(media []mmodels.Media, contactID int, con
 	}
 
 	// Process post-message hooks (reopen, waiting since, automation, SLA).
-	if err := m.ProcessIncomingMessageHooks(conversationUUID, isNewConversation); err != nil {
+	if err := m.ProcessIncomingMessageHooks(message, isNewConversation); err != nil {
 		m.lo.Error("error processing incoming message hooks", "conversation_uuid", conversationUUID, "error", err)
 	}
 
@@ -893,7 +893,7 @@ func (m *Manager) ProcessIncomingMessage(in models.IncomingMessage) (models.Mess
 	m.broadcastMessageToWidgetClients(&msg)
 
 	// Process post-message hooks (automation rules, webhooks, SLA, etc.).
-	if err := m.ProcessIncomingMessageHooks(msg.ConversationUUID, isNewConversation); err != nil {
+	if err := m.ProcessIncomingMessageHooks(msg, isNewConversation); err != nil {
 		m.lo.Error("error processing incoming message hooks", "conversation_uuid", msg.ConversationUUID, "error", err)
 		return models.Message{}, fmt.Errorf("processing incoming message hooks: %w", err)
 	}
@@ -1015,7 +1015,7 @@ func (m *Manager) ProcessIncomingLiveChatMessage(msg models.Message) (models.Mes
 
 	// Process post-message hooks (automation rules, webhooks, SLA, etc.).
 	// isNewConversation = false since conversation always exists for live chat.
-	if err := m.ProcessIncomingMessageHooks(msg.ConversationUUID, false); err != nil {
+	if err := m.ProcessIncomingMessageHooks(msg, false); err != nil {
 		m.lo.Error("error processing incoming message hooks", "conversation_uuid", msg.ConversationUUID, "error", err)
 	}
 
@@ -1386,7 +1386,9 @@ func (m *Manager) uploadThumbnailForMedia(media mmodels.Media, content []byte) e
 // ProcessIncomingMessageHooks handles automation rules, webhooks, SLA events, and other post-processing
 // for incoming messages. This allows other channels to insert messages first and then call this
 // function to trigger the necessary hooks.
-func (m *Manager) ProcessIncomingMessageHooks(conversationUUID string, isNewConversation bool) error {
+func (m *Manager) ProcessIncomingMessageHooks(message models.Message, isNewConversation bool) error {
+	conversationUUID := message.ConversationUUID
+
 	// Start waiting since clock, cleared when agent replies.
 	m.StartConversationWaitingSince(conversationUUID, time.Now())
 
@@ -1407,11 +1409,13 @@ func (m *Manager) ProcessIncomingMessageHooks(conversationUUID string, isNewConv
 	}
 
 	// Reopen conversation if it's not Open.
+	var reopened bool
 	systemUser, err := m.userStore.GetSystemUser()
 	if err != nil {
 		m.lo.Error("error fetching system user", "error", err)
 	} else {
-		if err := m.ReOpenConversation(conversationUUID, systemUser); err != nil {
+		var err error
+		if reopened, err = m.ReOpenConversation(conversationUUID, systemUser); err != nil {
 			m.lo.Error("error reopening conversation", "error", err)
 		}
 	}
@@ -1425,6 +1429,8 @@ func (m *Manager) ProcessIncomingMessageHooks(conversationUUID string, isNewConv
 		// Trigger automations on incoming message event.
 		m.automation.EvaluateConversationUpdateRules(conversation, amodels.EventConversationMessageIncoming, previousValues, umodels.User{ID: conversation.ContactID})
 
+		go m.NotifyNewReply(conversation, message, reopened)
+
 		// If assigned to an AI assistant, let it respond to this inbound customer message.
 		if m.aiAgent != nil && conversation.AssignedUserID.Valid {
 			m.aiAgent.HandleConversationEvent(conversation.ID, conversation.AssignedUserID.Int)
diff --git a/internal/conversation/notification_test.go b/internal/conversation/notification_test.go
new file mode 100644
index 00000000..1329f4bc
--- /dev/null
+++ b/internal/conversation/notification_test.go
@@ -0,0 +1,428 @@
+package conversation
+
+import (
+	"errors"
+	"fmt"
+	htmltemplate "html/template"
+	"slices"
+	"sync"
+	"testing"
+	"time"
+
+	authzmodels "github.com/abhinavxd/libredesk/internal/authz/models"
+	"github.com/abhinavxd/libredesk/internal/conversation/models"
+	"github.com/abhinavxd/libredesk/internal/dbutil"
+	notifier "github.com/abhinavxd/libredesk/internal/notification"
+	nchannels "github.com/abhinavxd/libredesk/internal/notification/channels"
+	nmodels "github.com/abhinavxd/libredesk/internal/notification/models"
+	"github.com/abhinavxd/libredesk/internal/template"
+	"github.com/abhinavxd/libredesk/internal/testutil"
+	umodels "github.com/abhinavxd/libredesk/internal/user/models"
+	"github.com/alicebob/miniredis/v2"
+	"github.com/alicebob/miniredis/v2/server"
+	"github.com/jmoiron/sqlx"
+	"github.com/redis/go-redis/v9"
+	"github.com/volatiletech/null/v9"
+	"github.com/zerodha/logf"
+)
+
+type replyUserStore struct {
+	userStore
+	agent umodels.User
+	err   error
+}
+
+type replyPreferences struct {
+	recipients []int
+	channels   []nmodels.NotificationChannel
+	err        error
+	mu         sync.Mutex
+}
+
+type countingPush struct {
+	count int
+}
+
+func (p *countingPush) Send(int, nmodels.PushPayload) bool {
+	p.count++
+	return true
+}
+
+func (s replyUserStore) Get(int, string, []string) (umodels.User, error) {
+	return umodels.User{FirstName: "Contact"}, nil
+}
+
+func (s replyUserStore) GetAgentCachedOrLoad(int) (umodels.User, error) { return s.agent, s.err }
+
+func (p *replyPreferences) EnabledChannels(ids []int, _ nmodels.NotificationType) (map[int][]nmodels.NotificationChannel, error) {
+	p.mu.Lock()
+	defer p.mu.Unlock()
+	p.recipients = append(p.recipients, ids...)
+	if p.err != nil {
+		return nil, p.err
+	}
+	enabled := make(map[int][]nmodels.NotificationChannel)
+	if len(p.channels) > 0 {
+		for _, id := range ids {
+			enabled[id] = slices.Clone(p.channels)
+		}
+	}
+	return enabled, nil
+}
+
+func TestNotifyNewReplyChecksParticipantAccess(t *testing.T) {
+	db := testutil.NewDB(t, "reply_access")
+	var agentID, inboxID int
+	if err := db.Get(&agentID, `INSERT INTO users (type, email, first_name, last_name) VALUES ('agent', 'participant@example.com', 'Agent', '') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	if err := db.Get(&inboxID, `INSERT INTO inboxes (name, channel) VALUES ('Test', 'email') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	var conv models.Conversation
+	if err := db.Get(&conv, `INSERT INTO conversations (contact_id, inbox_id, status_id) VALUES ($1, $2, (SELECT id FROM conversation_statuses LIMIT 1)) RETURNING id, uuid`, agentID, inboxID); err != nil {
+		t.Fatal(err)
+	}
+	db.MustExec(`INSERT INTO conversation_participants (conversation_id, user_id) VALUES ($1, $2)`, conv.ID, agentID)
+	var q struct {
+		Participants *sqlx.Stmt `query:"get-conversation-participant-agents"`
+	}
+	if err := dbutil.ScanSQLFile("queries.sql", &q, db, efs); err != nil {
+		t.Fatal(err)
+	}
+	lo := logf.New(logf.Opts{})
+	for _, tt := range []struct {
+		name        string
+		permissions []string
+		enabled     bool
+		err         error
+		want        bool
+	}{
+		{"former assignee", []string{authzmodels.PermConversationsRead, authzmodels.PermConversationsReadAssigned}, true, nil, false},
+		{"read all", []string{authzmodels.PermConversationsRead, authzmodels.PermConversationsReadAll}, true, nil, true},
+		{"missing base permission", []string{authzmodels.PermConversationsReadAll}, true, nil, false},
+		{"disabled", []string{authzmodels.PermConversationsRead, authzmodels.PermConversationsReadAll}, false, nil, false},
+		{"load failed", nil, true, errors.New("unavailable"), false},
+	} {
+		t.Run(tt.name, func(t *testing.T) {
+			m := &Manager{
+				lo: &lo,
+				userStore: replyUserStore{
+					agent: umodels.User{ID: agentID, Enabled: tt.enabled, Permissions: tt.permissions},
+					err:   tt.err,
+				},
+			}
+			m.q.GetConversationParticipantAgents = q.Participants
+			conv.AssignedUserID = null.IntFrom(agentID + 1)
+			recipients := m.replyNotificationParticipants(conv, agentID+1)
+			if got := slices.ContainsFunc(recipients, func(recipient umodels.User) bool { return recipient.ID == agentID }); got != tt.want {
+				t.Fatalf("participant eligible = %v, want %v", got, tt.want)
+			}
+		})
+	}
+}
+
+func TestNotifyNewReplyChecksAssigneeAccess(t *testing.T) {
+	lo := logf.New(logf.Opts{})
+	for _, tt := range []struct {
+		name        string
+		enabled     bool
+		permissions []string
+		want        bool
+	}{
+		{"assigned access", true, []string{authzmodels.PermConversationsRead, authzmodels.PermConversationsReadAssigned}, true},
+		{"disabled", false, []string{authzmodels.PermConversationsRead, authzmodels.PermConversationsReadAssigned}, false},
+		{"missing base permission", true, []string{authzmodels.PermConversationsReadAssigned}, false},
+		{"missing assignment access", true, []string{authzmodels.PermConversationsRead}, false},
+	} {
+		t.Run(tt.name, func(t *testing.T) {
+			m := &Manager{lo: &lo, userStore: replyUserStore{agent: umodels.User{ID: 42, Enabled: tt.enabled, Permissions: tt.permissions}}}
+			recipients := m.replyNotificationAssignee(models.Conversation{AssignedUserID: null.IntFrom(42)}, 7)
+			if got := slices.ContainsFunc(recipients, func(recipient umodels.User) bool { return recipient.ID == 42 }); got != tt.want {
+				t.Fatalf("assignee eligible = %v, want %v", got, tt.want)
+			}
+		})
+	}
+}
+
+func TestReplyNotificationsAlertOncePerUnreadConversation(t *testing.T) {
+	db := testutil.NewDB(t, "reply_notification_history")
+	var userID, inboxID int
+	if err := db.Get(&userID, `INSERT INTO users (type, email, first_name, last_name) VALUES ('agent', 'history@example.com', 'Agent', '') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	if err := db.Get(&inboxID, `INSERT INTO inboxes (name, channel) VALUES ('Test', 'email') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	var conv models.Conversation
+	if err := db.Get(&conv, `INSERT INTO conversations (contact_id, inbox_id, status_id) VALUES ($1, $2, (SELECT id FROM conversation_statuses LIMIT 1)) RETURNING id, uuid`, userID, inboxID); err != nil {
+		t.Fatal(err)
+	}
+	var messageID int
+	if err := db.Get(&messageID, `INSERT INTO conversation_messages (conversation_id, sender_id, sender_type, type, status, content, text_content, created_at) VALUES ($1, $2, 'contact', 'incoming', 'received', 'Old reply', 'Old reply', $3) RETURNING id`, conv.ID, userID, time.Now().Add(-time.Hour)); err != nil {
+		t.Fatal(err)
+	}
+
+	var q struct {
+		Participants *sqlx.Stmt `query:"get-conversation-participant-agents"`
+		LastSeen     *sqlx.Stmt `query:"upsert-user-last-seen"`
+		MarkUnread   *sqlx.Stmt `query:"mark-conversation-unread"`
+		Unread       *sqlx.Stmt `query:"get-users-with-unread-conversation-message"`
+		UUID         *sqlx.Stmt `query:"get-conversation-uuid"`
+	}
+	if err := dbutil.ScanSQLFile("queries.sql", &q, db, efs); err != nil {
+		t.Fatal(err)
+	}
+	lo := logf.New(logf.Opts{})
+	i18n := testutil.NewI18n(t)
+	inApp, err := notifier.NewUserNotificationManager(notifier.UserNotificationOpts{DB: db, Lo: &lo, I18n: i18n})
+	if err != nil {
+		t.Fatal(err)
+	}
+	emailQueue, err := notifier.NewEmailQueue(notifier.EmailQueueOpts{DB: db, Lo: &lo})
+	if err != nil {
+		t.Fatal(err)
+	}
+	templates, err := template.New(&lo, db, nil, nil, htmltemplate.FuncMap{"RootURL": func() string { return "http://localhost" }}, i18n)
+	if err != nil {
+		t.Fatal(err)
+	}
+	conv.AssignedUserID = null.IntFrom(userID)
+
+	var replyRedis *miniredis.Miniredis
+	newManager := func(channels ...nmodels.NotificationChannel) *Manager {
+		db.MustExec(`DELETE FROM conversation_last_seen`)
+		db.MustExec(`DELETE FROM notification_email_queue`)
+		db.MustExec(`DELETE FROM user_notifications`)
+		mr := miniredis.RunT(t)
+		replyRedis = mr
+		m := &Manager{lo: &lo, i18n: i18n, template: templates, rdb: redis.NewClient(&redis.Options{Addr: mr.Addr()}),
+			userStore: replyUserStore{agent: umodels.User{ID: userID, Email: null.StringFrom("history@example.com"), Enabled: true, Permissions: []string{authzmodels.PermConversationsRead, authzmodels.PermConversationsReadAssigned}}},
+			dispatcher: notifier.NewDispatcher(notifier.DispatcherOpts{
+				Pipeline: nchannels.NewPipeline(nchannels.NewInApp(inApp, nil, &lo), nchannels.NewEmail(emailQueue)),
+				Prefs:    &replyPreferences{channels: channels},
+			}),
+		}
+		m.q.GetConversationParticipantAgents = q.Participants
+		m.q.UpsertUserLastSeen = q.LastSeen
+		m.q.MarkConversationUnread = q.MarkUnread
+		m.q.GetUsersWithUnreadConversationMessage = q.Unread
+		m.q.GetConversationUUID = q.UUID
+		return m
+	}
+	message := models.Message{ID: messageID, SenderID: userID + 1, CreatedAt: time.Now().UTC().Truncate(time.Microsecond)}
+
+	t.Run("one alert per unread conversation", func(t *testing.T) {
+		m := newManager(nmodels.NotificationChannelInApp)
+		notifications := func() int {
+			var count int
+			db.Get(&count, `SELECT count(*) FROM user_notifications`)
+			return count
+		}
+
+		m.NotifyNewReply(conv, message, false)
+		if notifications() != 1 {
+			t.Fatalf("notifications after first reply = %d, want 1", notifications())
+		}
+
+		next := message
+		next.CreatedAt = message.CreatedAt.Add(time.Second)
+		m.NotifyNewReply(conv, next, false)
+		if notifications() != 1 {
+			t.Fatalf("notifications after a second unread reply = %d, want 1", notifications())
+		}
+
+		m.NotifyNewReply(conv, next, true)
+		if notifications() != 1 {
+			t.Fatalf("notifications after a reopen on an unread conversation = %d, want 1", notifications())
+		}
+
+		if err := m.UpdateUserLastSeen(conv.UUID, userID); err != nil {
+			t.Fatal(err)
+		}
+		later := next
+		later.CreatedAt = time.Now().UTC().Add(time.Minute)
+		m.NotifyNewReply(conv, later, false)
+		if notifications() != 2 {
+			t.Fatalf("notifications after reading and replying again = %d, want 2", notifications())
+		}
+
+		if err := m.MarkAsUnread(conv.UUID, userID); err != nil {
+			t.Fatal(err)
+		}
+		m.NotifyNewReply(conv, later, false)
+		if notifications() != 3 {
+			t.Fatalf("notifications after marking unread and replying again = %d, want 3", notifications())
+		}
+
+		if err := m.UpdateUserLastSeen(conv.UUID, userID); err != nil {
+			t.Fatal(err)
+		}
+		read := later
+		read.CreatedAt = time.Now().Add(-time.Minute)
+		m.NotifyNewReply(conv, read, false)
+		if notifications() != 3 {
+			t.Fatalf("a reply the agent had already read was notified, notifications = %d", notifications())
+		}
+	})
+
+	t.Run("replies arriving together alert once", func(t *testing.T) {
+		m := newManager(nmodels.NotificationChannelInApp)
+		var wg sync.WaitGroup
+		for range 8 {
+			wg.Go(func() { m.NotifyNewReply(conv, message, false) })
+		}
+		wg.Wait()
+
+		var count int
+		db.Get(&count, `SELECT count(*) FROM user_notifications`)
+		if count != 1 {
+			t.Fatalf("notifications from concurrent replies = %d, want 1", count)
+		}
+	})
+
+	for _, markUnread := range []bool{false, true} {
+		t.Run(fmt.Sprintf("read during claim/markUnread=%v", markUnread), func(t *testing.T) {
+			m := newManager(nmodels.NotificationChannelInApp)
+			readDone := make(chan error, 1)
+			var once sync.Once
+			replyRedis.Server().SetPreHook(func(_ *server.Peer, cmd string, _ ...string) bool {
+				if cmd == "SET" {
+					once.Do(func() {
+						go func() {
+							if markUnread {
+								readDone <- m.MarkAsUnread(conv.UUID, userID)
+							} else {
+								readDone <- m.UpdateUserLastSeen(conv.UUID, userID)
+							}
+						}()
+						select {
+						case err := <-readDone:
+							readDone <- err
+						case <-time.After(100 * time.Millisecond):
+						}
+					})
+				}
+				return false
+			})
+
+			m.NotifyNewReply(conv, message, false)
+			if err := <-readDone; err != nil {
+				t.Fatal(err)
+			}
+			if replyRedis.Exists(replyNotifiedKey(conv.UUID, userID)) {
+				t.Fatal("completed read left a reply suppression claim")
+			}
+
+			next := message
+			next.CreatedAt = time.Now().UTC().Add(time.Minute)
+			m.NotifyNewReply(conv, next, false)
+			var count int
+			if err := db.Get(&count, `SELECT count(*) FROM user_notifications`); err != nil {
+				t.Fatal(err)
+			}
+			if count != 2 {
+				t.Fatalf("notifications after a concurrent read and a new reply = %d, want 2", count)
+			}
+		})
+	}
+
+	for _, state := range []string{"current", "legacy", "newer", "read"} {
+		t.Run("abandoned email releases only its claim/"+state, func(t *testing.T) {
+			m := newManager(nmodels.NotificationChannelEmail)
+			m.NotifyNewReply(conv, message, false)
+			key := replyNotifiedKey(conv.UUID, userID)
+			if state == "legacy" {
+				if err := replyRedis.Set(key, "1"); err != nil {
+					t.Fatal(err)
+				}
+			}
+			if state == "newer" || state == "read" {
+				if err := m.UpdateUserLastSeen(conv.UUID, userID); err != nil {
+					t.Fatal(err)
+				}
+			}
+			next := message
+			next.CreatedAt = time.Now().UTC().Add(time.Minute)
+			if state == "newer" {
+				m.NotifyNewReply(conv, next, false)
+			}
+
+			m.ReleaseReplyNotification(conv.ID, userID, message.CreatedAt)
+			if got, want := replyRedis.Exists(key), state == "newer"; got != want {
+				t.Fatalf("claim after abandonment = %v, want %v", got, want)
+			}
+			m.NotifyNewReply(conv, next, false)
+			if !replyRedis.Exists(key) {
+				t.Fatal("next unread reply was not claimed")
+			}
+		})
+	}
+
+	t.Run("push only agent keeps no claim", func(t *testing.T) {
+		m := newManager(nmodels.NotificationChannelPush)
+		push := &countingPush{}
+		m.dispatcher = notifier.NewDispatcher(notifier.DispatcherOpts{
+			Pipeline: nchannels.NewPipeline(nchannels.NewInApp(inApp, nil, &lo), nchannels.NewEmail(emailQueue), nchannels.NewPush(push)),
+			Prefs:    &replyPreferences{channels: []nmodels.NotificationChannel{nmodels.NotificationChannelPush}},
+		})
+		m.NotifyNewReply(conv, message, false)
+
+		m.dispatcher = notifier.NewDispatcher(notifier.DispatcherOpts{
+			Pipeline: nchannels.NewPipeline(nchannels.NewInApp(inApp, nil, &lo), nchannels.NewEmail(emailQueue)),
+			Prefs:    &replyPreferences{channels: []nmodels.NotificationChannel{nmodels.NotificationChannelInApp}},
+		})
+		m.NotifyNewReply(conv, message, false)
+
+		var count int
+		db.Get(&count, `SELECT count(*) FROM user_notifications`)
+		if count != 1 {
+			t.Fatalf("notifications after a push that stored nothing = %d, want 1", count)
+		}
+	})
+
+	t.Run("agent with no channel enabled is not notified", func(t *testing.T) {
+		m := newManager()
+		m.NotifyNewReply(conv, message, false)
+		var count int
+		db.Get(&count, `SELECT count(*) FROM user_notifications`)
+		if count != 0 {
+			t.Fatalf("notifications = %d, want 0", count)
+		}
+	})
+
+	t.Run("preference failure releases claim", func(t *testing.T) {
+		m := newManager()
+		m.dispatcher = notifier.NewDispatcher(notifier.DispatcherOpts{Prefs: &replyPreferences{err: errors.New("lookup failed")}})
+		m.NotifyNewReply(conv, message, false)
+		if replyRedis.Exists(replyNotifiedKey(conv.UUID, userID)) {
+			t.Fatal("preference failure left a reply suppression claim")
+		}
+	})
+
+	t.Run("email only agent is alerted once until they read the conversation", func(t *testing.T) {
+		m := newManager(nmodels.NotificationChannelEmail)
+		m.NotifyNewReply(conv, message, false)
+		next := message
+		next.CreatedAt = message.CreatedAt.Add(time.Minute)
+		m.NotifyNewReply(conv, next, false)
+
+		var queued int
+		db.Get(&queued, `SELECT count(*) FROM notification_email_queue`)
+		if queued != 1 {
+			t.Fatalf("queued emails = %d, want 1", queued)
+		}
+
+		db.MustExec(`DELETE FROM notification_email_queue`)
+		if err := m.UpdateUserLastSeen(conv.UUID, userID); err != nil {
+			t.Fatal(err)
+		}
+		later := next
+		later.CreatedAt = time.Now().UTC().Add(time.Minute)
+		m.NotifyNewReply(conv, later, false)
+		db.Get(&queued, `SELECT count(*) FROM notification_email_queue`)
+		if queued != 1 {
+			t.Fatalf("queued emails after reading and replying again = %d, want 1", queued)
+		}
+	})
+}
diff --git a/internal/conversation/queries.sql b/internal/conversation/queries.sql
index dd75f6d1..47e1ca48 100644
--- a/internal/conversation/queries.sql
+++ b/internal/conversation/queries.sql
@@ -509,6 +509,13 @@ VALUES ($1, (SELECT id FROM conversations WHERE uuid = $2), NOW())
 ON CONFLICT (conversation_id, user_id)
 DO UPDATE SET last_seen_at = NOW(), updated_at = NOW();
 
+-- name: get-users-with-unread-conversation-message
+SELECT candidate.user_id
+FROM unnest($2::BIGINT[]) AS candidate(user_id)
+LEFT JOIN conversation_last_seen seen
+    ON seen.conversation_id = $1 AND seen.user_id = candidate.user_id
+WHERE seen.last_seen_at IS NULL OR seen.last_seen_at < $3;
+
 -- name: update-conversation-last-message
 -- $1=id, $2=uuid, $3=content, $4=sender_type, $5=timestamp, $6=message_type, $7=private, $8=sender_id
 UPDATE conversations SET
@@ -535,6 +542,16 @@ WHERE conversation_id =
     SELECT id FROM conversations WHERE uuid = $1
 );
 
+-- name: get-conversation-participant-agents
+SELECT users.id, users.first_name, users.last_name, users.email
+FROM conversation_participants
+INNER JOIN users ON users.id = conversation_participants.user_id
+WHERE conversation_participants.conversation_id = (SELECT id FROM conversations WHERE uuid = $1)
+  AND users.type = 'agent'
+  AND users.email != 'System'
+  AND users.enabled
+  AND users.deleted_at IS NULL;
+
 -- name: insert-conversation-participant
 INSERT INTO conversation_participants
 (user_id, conversation_id)
diff --git a/internal/httputil/httputil.go b/internal/httputil/httputil.go
index 361c467e..7038a381 100644
--- a/internal/httputil/httputil.go
+++ b/internal/httputil/httputil.go
@@ -11,7 +11,7 @@ func IsValidHTTPURL(raw string) bool {
 	if err != nil {
 		return false
 	}
-	return u.Scheme == "http" || u.Scheme == "https"
+	return (u.Scheme == "http" || u.Scheme == "https") && u.Host != ""
 }
 
 // IsOriginTrusted checks if the given origin is trusted based on the trusted domains list
diff --git a/internal/httputil/httputil_test.go b/internal/httputil/httputil_test.go
new file mode 100644
index 00000000..429049a7
--- /dev/null
+++ b/internal/httputil/httputil_test.go
@@ -0,0 +1,28 @@
+package httputil
+
+import "testing"
+
+func TestIsValidHTTPURL(t *testing.T) {
+	tests := []struct {
+		name string
+		url  string
+		want bool
+	}{
+		{name: "HTTPS", url: "https://desk.example.com", want: true},
+		{name: "HTTP localhost", url: "http://localhost:9000", want: true},
+		{name: "path", url: "https://desk.example.com/app", want: true},
+		{name: "empty", url: "", want: false},
+		{name: "missing host", url: "https:", want: false},
+		{name: "relative", url: "/app", want: false},
+		{name: "unsupported scheme", url: "javascript:alert(1)", want: false},
+		{name: "attribute injection", url: `https://desk.example.com" onclick="alert(1)`, want: false},
+	}
+
+	for _, tt := range tests {
+		t.Run(tt.name, func(t *testing.T) {
+			if got := IsValidHTTPURL(tt.url); got != tt.want {
+				t.Fatalf("IsValidHTTPURL(%q) = %v, want %v", tt.url, got, tt.want)
+			}
+		})
+	}
+}
diff --git a/internal/migrations/v2.9.0.go b/internal/migrations/v2.9.0.go
index 212e0bcc..bd4180b0 100644
--- a/internal/migrations/v2.9.0.go
+++ b/internal/migrations/v2.9.0.go
@@ -6,12 +6,205 @@ import (
 	"github.com/knadh/stuffbin"
 )
 
+var notificationTypesV2_9_0 = []string{
+	"new_reply",
+	"new_reply_participating",
+	"sla_first_response_warning",
+	"sla_first_response_breach",
+	"sla_next_response_warning",
+	"sla_next_response_breach",
+	"sla_resolution_warning",
+	"sla_resolution_breach",
+	"conversation_reopened",
+}
+
 func V2_9_0(db *sqlx.DB, fs stuffbin.FileSystem, ko *koanf.Koanf) error {
-	_, err := db.Exec(`
+	if _, err := db.Exec(`
 		UPDATE roles
 		SET permissions = array_append(permissions, 'messages:write_private')
 		WHERE 'messages:write' = ANY(permissions)
 		AND NOT ('messages:write_private' = ANY(permissions));
+	`); err != nil {
+		return err
+	}
+
+	for _, notificationType := range notificationTypesV2_9_0 {
+		if _, err := db.Exec(`ALTER TYPE user_notification_type ADD VALUE IF NOT EXISTS '` + notificationType + `';`); err != nil {
+			return err
+		}
+	}
+
+	if _, err := db.Exec(`
+		DO $$
+		BEGIN
+			IF NOT EXISTS (SELECT 1 FROM pg_type WHERE typname = 'notification_channel') THEN
+				CREATE TYPE notification_channel AS ENUM ('in_app', 'email', 'push');
+			END IF;
+		END$$;
+	`); err != nil {
+		return err
+	}
+	if _, err := db.Exec(`ALTER TYPE notification_channel ADD VALUE IF NOT EXISTS 'push';`); err != nil {
+		return err
+	}
+
+	if _, err := db.Exec(`
+		CREATE TABLE IF NOT EXISTS user_notification_preferences (
+			id SERIAL PRIMARY KEY,
+			created_at TIMESTAMPTZ DEFAULT NOW(),
+			updated_at TIMESTAMPTZ DEFAULT NOW(),
+			user_id BIGINT REFERENCES users(id) ON DELETE CASCADE ON UPDATE CASCADE NOT NULL,
+			notification_type user_notification_type NOT NULL,
+			channel notification_channel NOT NULL,
+			enabled BOOLEAN NOT NULL DEFAULT TRUE,
+			CONSTRAINT constraint_uniq_user_notification_preferences UNIQUE (user_id, notification_type, channel)
+		);
+	`); err != nil {
+		return err
+	}
+
+	if _, err := db.Exec(`
+		CREATE TABLE IF NOT EXISTS notification_push_subscriptions (
+			id BIGSERIAL PRIMARY KEY,
+			created_at TIMESTAMPTZ DEFAULT NOW(),
+			updated_at TIMESTAMPTZ DEFAULT NOW(),
+			user_id BIGINT REFERENCES users(id) ON DELETE CASCADE ON UPDATE CASCADE NOT NULL,
+			endpoint TEXT NOT NULL UNIQUE,
+			p256dh TEXT NOT NULL,
+			auth TEXT NOT NULL
+		);
+	`); err != nil {
+		return err
+	}
+	if _, err := db.Exec(`
+		CREATE INDEX IF NOT EXISTS index_notification_push_subscriptions_on_user_id ON notification_push_subscriptions(user_id);
+	`); err != nil {
+		return err
+	}
+
+	if _, err := db.Exec(`
+		CREATE TABLE IF NOT EXISTS notification_email_queue (
+			id BIGSERIAL PRIMARY KEY,
+			created_at TIMESTAMPTZ DEFAULT NOW(),
+			updated_at TIMESTAMPTZ DEFAULT NOW(),
+			user_id BIGINT REFERENCES users(id) ON DELETE CASCADE ON UPDATE CASCADE NOT NULL,
+			notification_id BIGINT REFERENCES user_notifications(id) ON DELETE CASCADE ON UPDATE CASCADE,
+			notification_type user_notification_type NOT NULL,
+			conversation_id BIGINT REFERENCES conversations(id) ON DELETE CASCADE ON UPDATE CASCADE,
+			recipient_email TEXT NOT NULL,
+			subject TEXT NOT NULL,
+			content TEXT NOT NULL,
+			queued_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+			message_created_at TIMESTAMPTZ,
+			send_at TIMESTAMPTZ NOT NULL,
+			attempts INTEGER NOT NULL DEFAULT 0,
+			CONSTRAINT constraint_uniq_notification_email_queue UNIQUE (user_id, notification_type, conversation_id)
+		);
+	`); err != nil {
+		return err
+	}
+	if _, err := db.Exec(`
+		CREATE INDEX IF NOT EXISTS index_notification_email_queue_on_send_at ON notification_email_queue(send_at);
+	`); err != nil {
+		return err
+	}
+	if _, err := db.Exec(`
+		ALTER TABLE notification_email_queue ADD COLUMN IF NOT EXISTS message_created_at TIMESTAMPTZ;
+	`); err != nil {
+		return err
+	}
+	if _, err := db.Exec(`
+		ALTER TABLE notification_email_queue ADD COLUMN IF NOT EXISTS attempts INTEGER NOT NULL DEFAULT 0;
+	`); err != nil {
+		return err
+	}
+
+	if _, err := db.Exec(`
+		INSERT INTO settings ("key", value) VALUES
+			('notification.push.vapid_public_key', '""'::jsonb),
+			('notification.push.vapid_private_key', '""'::jsonb)
+		ON CONFLICT ("key") DO NOTHING;
+	`); err != nil {
+		return err
+	}
+
+	if _, err := db.Exec(`
+		INSERT INTO templates ("type", body, is_default, "name", subject, is_builtin)
+		SELECT 'email_notification'::template_type, '
+<p>{{ .Author.FullName }} replied to a conversation assigned to you:</p>
+
+<div>
+    Reference number: {{ .Conversation.ReferenceNumber }} <br>
+    Subject: {{ .Conversation.Subject }}
+</div>
+
+<blockquote>{{ .Message.Content }}</blockquote>
+
+<p>
+    <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
+</p>
+
+<div>
+    Best regards,<br>
+    Libredesk
+</div>
+
+', false, 'New reply from contact', 'New reply on conversation #{{ .Conversation.ReferenceNumber }}', true
+		WHERE NOT EXISTS (SELECT 1 FROM templates WHERE "name" = 'New reply from contact');
+	`); err != nil {
+		return err
+	}
+
+	if _, err := db.Exec(`
+		INSERT INTO templates ("type", body, is_default, "name", subject, is_builtin)
+		SELECT 'email_notification'::template_type, '
+<p>{{ .Author.FullName }} replied to a conversation you are participating in:</p>
+
+<div>
+    Reference number: {{ .Conversation.ReferenceNumber }} <br>
+    Subject: {{ .Conversation.Subject }}
+</div>
+
+<blockquote>{{ .Message.Content }}</blockquote>
+
+<p>
+    <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
+</p>
+
+<div>
+    Best regards,<br>
+    Libredesk
+</div>
+
+', false, 'New reply on participating conversation', 'New reply on conversation #{{ .Conversation.ReferenceNumber }}', true
+		WHERE NOT EXISTS (SELECT 1 FROM templates WHERE "name" = 'New reply on participating conversation');
+	`); err != nil {
+		return err
+	}
+
+	_, err := db.Exec(`
+		INSERT INTO templates ("type", body, is_default, "name", subject, is_builtin)
+		SELECT 'email_notification'::template_type, '
+<p>{{ .Author.FullName }} replied and reopened a conversation assigned to you:</p>
+
+<div>
+    Reference number: {{ .Conversation.ReferenceNumber }} <br>
+    Subject: {{ .Conversation.Subject }}
+</div>
+
+<blockquote>{{ .Message.Content }}</blockquote>
+
+<p>
+    <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
+</p>
+
+<div>
+    Best regards,<br>
+    Libredesk
+</div>
+
+', false, 'Conversation reopened', 'Conversation #{{ .Conversation.ReferenceNumber }} reopened', true
+		WHERE NOT EXISTS (SELECT 1 FROM templates WHERE "name" = 'Conversation reopened');
 	`)
 	return err
 }
diff --git a/internal/migrations/v2.9.0_test.go b/internal/migrations/v2.9.0_test.go
index 9654c7cf..d8e6f0d7 100644
--- a/internal/migrations/v2.9.0_test.go
+++ b/internal/migrations/v2.9.0_test.go
@@ -52,3 +52,116 @@ func TestV2_9_0PrivateNotePermissionMigration(t *testing.T) {
 		}
 	}
 }
+
+func TestV2_9_0NotificationMigration(t *testing.T) {
+	db := testutil.NewDB(t, "migration_v2_9_0_notifications")
+	db.MustExec(`
+		DROP TABLE notification_email_queue;
+		DROP TABLE notification_push_subscriptions;
+		DROP TABLE user_notification_preferences;
+		DROP TYPE notification_channel;
+		DELETE FROM settings WHERE "key" IN (
+			'notification.push.vapid_public_key',
+			'notification.push.vapid_private_key'
+		);
+		DELETE FROM templates WHERE "name" IN (
+			'New reply from contact',
+			'New reply on participating conversation',
+			'Conversation reopened'
+		);
+	`)
+
+	for range 2 {
+		if err := V2_9_0(db, nil, nil); err != nil {
+			t.Fatalf("running migration: %v", err)
+		}
+	}
+
+	for _, table := range []string{
+		"user_notification_preferences",
+		"notification_push_subscriptions",
+		"notification_email_queue",
+	} {
+		var exists bool
+		if err := db.Get(&exists, `SELECT to_regclass($1) IS NOT NULL`, table); err != nil {
+			t.Fatalf("checking table %q: %v", table, err)
+		}
+		if !exists {
+			t.Errorf("table %q was not created", table)
+		}
+	}
+
+	var pushChannel bool
+	if err := db.Get(&pushChannel, `
+		SELECT EXISTS (
+			SELECT 1 FROM pg_enum e
+			JOIN pg_type t ON t.oid = e.enumtypid
+			WHERE t.typname = 'notification_channel' AND e.enumlabel = 'push'
+		)
+	`); err != nil {
+		t.Fatalf("checking push channel: %v", err)
+	}
+	if !pushChannel {
+		t.Error("push notification channel was not created")
+	}
+
+	var settingCount, templateCount int
+	if err := db.Get(&settingCount, `SELECT COUNT(*) FROM settings WHERE "key" LIKE 'notification.push.vapid_%'`); err != nil {
+		t.Fatalf("counting VAPID settings: %v", err)
+	}
+	if settingCount != 2 {
+		t.Errorf("VAPID setting count = %d, want 2", settingCount)
+	}
+	if err := db.Get(&templateCount, `
+		SELECT COUNT(*) FROM templates WHERE "name" IN (
+			'New reply from contact',
+			'New reply on participating conversation',
+			'Conversation reopened'
+		)
+	`); err != nil {
+		t.Fatalf("counting notification templates: %v", err)
+	}
+	if templateCount != 3 {
+		t.Errorf("notification template count = %d, want 3", templateCount)
+	}
+}
+
+func TestV2_9_0PreservesExistingQueuedEmails(t *testing.T) {
+	db := testutil.NewDB(t, "migration_v2_9_0_queue")
+	columnQuery := `SELECT data_type || ':' || is_nullable || ':' || COALESCE(column_default, '') FROM information_schema.columns WHERE table_name = 'notification_email_queue' AND column_name = $1`
+	var expectedMessageTimeColumn, expectedAttemptsColumn string
+	if err := db.Get(&expectedMessageTimeColumn, columnQuery, "message_created_at"); err != nil {
+		t.Fatal(err)
+	}
+	if err := db.Get(&expectedAttemptsColumn, columnQuery, "attempts"); err != nil {
+		t.Fatal(err)
+	}
+	db.MustExec(`ALTER TABLE notification_email_queue DROP COLUMN message_created_at, DROP COLUMN attempts`)
+	db.MustExec(`INSERT INTO users (type, email, first_name, last_name) VALUES ('agent', 'queued@example.com', 'Agent', '')`)
+	db.MustExec(`INSERT INTO notification_email_queue (user_id, notification_type, recipient_email, subject, content, send_at) VALUES ((SELECT id FROM users LIMIT 1), 'new_reply', 'queued@example.com', 'Reply', 'Pending reply', now())`)
+	for range 2 {
+		if err := V2_9_0(db, nil, nil); err != nil {
+			t.Fatal(err)
+		}
+	}
+	var actualMessageTimeColumn, actualAttemptsColumn string
+	if err := db.Get(&actualMessageTimeColumn, columnQuery, "message_created_at"); err != nil {
+		t.Fatal(err)
+	}
+	if err := db.Get(&actualAttemptsColumn, columnQuery, "attempts"); err != nil {
+		t.Fatal(err)
+	}
+	if actualMessageTimeColumn != expectedMessageTimeColumn {
+		t.Fatalf("message time column = %q, schema column = %q", actualMessageTimeColumn, expectedMessageTimeColumn)
+	}
+	if actualAttemptsColumn != expectedAttemptsColumn {
+		t.Fatalf("attempts column = %q, schema column = %q", actualAttemptsColumn, expectedAttemptsColumn)
+	}
+	var preserved bool
+	if err := db.Get(&preserved, `SELECT content = 'Pending reply' AND message_created_at IS NULL AND attempts = 0 FROM notification_email_queue`); err != nil {
+		t.Fatal(err)
+	}
+	if !preserved {
+		t.Fatal("existing queued email changed")
+	}
+}
diff --git a/internal/notification/channels/email.go b/internal/notification/channels/email.go
new file mode 100644
index 00000000..9d2b71d7
--- /dev/null
+++ b/internal/notification/channels/email.go
@@ -0,0 +1,45 @@
+package channels
+
+import (
+	"time"
+
+	"github.com/abhinavxd/libredesk/internal/notification/models"
+)
+
+type EmailQueue interface {
+	Send(models.Email) bool
+	SendAfter(models.Email, time.Duration) bool
+}
+
+type email struct {
+	queue EmailQueue
+}
+
+func NewEmail(queue EmailQueue) Provider {
+	return &email{queue: queue}
+}
+
+func (p *email) Channel() models.NotificationChannel {
+	return models.NotificationChannelEmail
+}
+
+func (p *email) Send(delivery Delivery) Result {
+	notification := delivery.Recipient.Email
+	if notification == nil || notification.Recipient == "" {
+		return Result{}
+	}
+	message := models.Email{
+		UserID:           delivery.Recipient.UserID,
+		NotificationID:   delivery.NotificationID,
+		Type:             delivery.Notification.Type,
+		ConversationID:   delivery.Notification.ConversationID,
+		MessageCreatedAt: delivery.Notification.MessageCreatedAt,
+		Recipient:        notification.Recipient,
+		Subject:          notification.Subject,
+		Content:          notification.Content,
+	}
+	if notification.Delay > 0 {
+		return Result{Sent: p.queue.SendAfter(message, notification.Delay)}
+	}
+	return Result{Sent: p.queue.Send(message)}
+}
diff --git a/internal/notification/channels/email_test.go b/internal/notification/channels/email_test.go
new file mode 100644
index 00000000..ce05b49a
--- /dev/null
+++ b/internal/notification/channels/email_test.go
@@ -0,0 +1,63 @@
+package channels
+
+import (
+	"testing"
+	"time"
+
+	"github.com/abhinavxd/libredesk/internal/notification/models"
+)
+
+type emailQueueStub struct {
+	sent    []models.Email
+	delayed []models.Email
+	delay   time.Duration
+}
+
+func (q *emailQueueStub) Send(email models.Email) bool {
+	q.sent = append(q.sent, email)
+	return true
+}
+
+func (q *emailQueueStub) SendAfter(email models.Email, delay time.Duration) bool {
+	q.delayed = append(q.delayed, email)
+	q.delay = delay
+	return true
+}
+
+func TestEmailProviderSkipsMissingRecipient(t *testing.T) {
+	for _, email := range []*models.EmailNotification{nil, {}} {
+		queue := &emailQueueStub{}
+		result := NewEmail(queue).Send(Delivery{Recipient: models.Recipient{UserID: 42, Email: email}})
+		if result.Sent || len(queue.sent) != 0 || len(queue.delayed) != 0 {
+			t.Fatalf("unexpected delivery: result=%#v queue=%#v", result, queue)
+		}
+	}
+}
+
+func TestEmailProviderSendsImmediately(t *testing.T) {
+	queue := &emailQueueStub{}
+	result := NewEmail(queue).Send(Delivery{
+		Recipient: models.Recipient{UserID: 42, Email: &models.EmailNotification{
+			Recipient: "agent@example.com",
+			Subject:   "Assigned",
+			Content:   "Conversation assigned",
+		}},
+		Notification: models.Notification{Type: models.NotificationTypeAssignment},
+	})
+	if !result.Sent || len(queue.sent) != 1 || queue.sent[0].Recipient != "agent@example.com" {
+		t.Fatalf("unexpected delivery: result=%#v queue=%#v", result, queue)
+	}
+}
+
+func TestEmailProviderSchedulesDelay(t *testing.T) {
+	queue := &emailQueueStub{}
+	result := NewEmail(queue).Send(Delivery{
+		Recipient: models.Recipient{UserID: 42, Email: &models.EmailNotification{
+			Recipient: "agent@example.com",
+			Delay:     time.Minute,
+		}},
+	})
+	if !result.Sent || len(queue.delayed) != 1 || queue.delay != time.Minute {
+		t.Fatalf("unexpected delivery: result=%#v queue=%#v", result, queue)
+	}
+}
diff --git a/internal/notification/channels/in_app.go b/internal/notification/channels/in_app.go
new file mode 100644
index 00000000..caef1d5e
--- /dev/null
+++ b/internal/notification/channels/in_app.go
@@ -0,0 +1,62 @@
+package channels
+
+import (
+	"encoding/json"
+
+	"github.com/abhinavxd/libredesk/internal/notification/models"
+	wsmodels "github.com/abhinavxd/libredesk/internal/ws/models"
+	"github.com/volatiletech/null/v9"
+	"github.com/zerodha/logf"
+)
+
+type InAppStore interface {
+	Create(int, models.NotificationType, string, null.String, null.Int, null.Int, null.Int, json.RawMessage) (models.UserNotification, error)
+}
+
+type WSHub interface {
+	BroadcastMessage(msg wsmodels.BroadcastMessage)
+}
+
+type inApp struct {
+	store InAppStore
+	wsHub WSHub
+	lo    *logf.Logger
+}
+
+func NewInApp(store InAppStore, wsHub WSHub, lo *logf.Logger) Provider {
+	return &inApp{store: store, wsHub: wsHub, lo: lo}
+}
+
+func (p *inApp) Channel() models.NotificationChannel {
+	return models.NotificationChannelInApp
+}
+
+func (p *inApp) Send(delivery Delivery) Result {
+	n := delivery.Notification
+	notification, err := p.store.Create(delivery.Recipient.UserID, n.Type, n.Title, n.Body,
+		n.ConversationID, n.MessageID, n.ActorID, n.Meta)
+	if err != nil {
+		p.lo.Error("error creating in-app notification", "recipient_id", delivery.Recipient.UserID,
+			"type", n.Type, "error", err)
+		return Result{}
+	}
+	notification.ConversationUUID = null.StringFrom(n.ConversationUUID)
+	notification.MessageUUID = null.StringFrom(n.MessageUUID)
+	notification.ActorFirstName = null.StringFrom(n.ActorFirstName)
+	notification.ActorLastName = null.StringFrom(n.ActorLastName)
+	p.broadcast(delivery.Recipient.UserID, notification)
+	return Result{Sent: true, NotificationID: null.IntFrom(notification.ID)}
+}
+
+func (p *inApp) broadcast(userID int, notification any) {
+	if p.wsHub == nil {
+		return
+	}
+	message := wsmodels.Message{Type: wsmodels.MessageTypeNewNotification, Data: notification}
+	data, err := json.Marshal(message)
+	if err != nil {
+		p.lo.Error("error marshalling notification for Websocket", "error", err)
+		return
+	}
+	p.wsHub.BroadcastMessage(wsmodels.BroadcastMessage{Data: data, Users: []int{userID}})
+}
diff --git a/internal/notification/channels/push.go b/internal/notification/channels/push.go
new file mode 100644
index 00000000..5261fcf8
--- /dev/null
+++ b/internal/notification/channels/push.go
@@ -0,0 +1,46 @@
+package channels
+
+import (
+	"fmt"
+
+	"github.com/abhinavxd/libredesk/internal/notification/models"
+)
+
+type PushSender interface {
+	Send(userID int, payload models.PushPayload) bool
+}
+
+type push struct {
+	sender PushSender
+}
+
+func NewPush(sender PushSender) Provider {
+	return &push{sender: sender}
+}
+
+func (p *push) Channel() models.NotificationChannel {
+	return models.NotificationChannelPush
+}
+
+func (p *push) Send(delivery Delivery) Result {
+	n := delivery.Notification
+	sent := p.sender.Send(delivery.Recipient.UserID, models.PushPayload{
+		Title: n.Title,
+		Body:  n.Body.String,
+		Tag:   fmt.Sprintf("%s_%s", n.Type, n.ConversationUUID),
+		URL:   pushRoute(string(n.Type), n.ConversationUUID, n.MessageUUID),
+	})
+	return Result{Sent: sent}
+}
+
+func pushRoute(notificationType, conversationUUID, messageUUID string) string {
+	list := "assigned"
+	if notificationType == "mention" {
+		list = "mentioned"
+	}
+	route := fmt.Sprintf("/inboxes/%s/conversation/%s", list, conversationUUID)
+	if messageUUID != "" {
+		route += "?scrollTo=" + messageUUID
+	}
+	return route
+}
diff --git a/internal/notification/channels/types.go b/internal/notification/channels/types.go
new file mode 100644
index 00000000..9b4ab2ac
--- /dev/null
+++ b/internal/notification/channels/types.go
@@ -0,0 +1,67 @@
+package channels
+
+import (
+	"cmp"
+	"slices"
+
+	"github.com/abhinavxd/libredesk/internal/notification/models"
+	"github.com/volatiletech/null/v9"
+)
+
+type Provider interface {
+	Channel() models.NotificationChannel
+	Send(Delivery) Result
+}
+
+type Delivery struct {
+	Recipient      models.Recipient
+	Notification   models.Notification
+	NotificationID null.Int
+}
+
+type Result struct {
+	Sent           bool
+	NotificationID null.Int
+}
+
+type Pipeline struct {
+	providers []Provider
+}
+
+func NewPipeline(providers ...Provider) Pipeline {
+	providers = slices.Clone(providers)
+	slices.SortStableFunc(providers, func(a, b Provider) int {
+		return cmp.Compare(channelOrder(a.Channel()), channelOrder(b.Channel()))
+	})
+	return Pipeline{providers: providers}
+}
+
+func (p Pipeline) Send(delivery Delivery, enabled []models.NotificationChannel) []models.NotificationChannel {
+	var sent []models.NotificationChannel
+	for _, provider := range p.providers {
+		if !slices.Contains(enabled, provider.Channel()) {
+			continue
+		}
+		result := provider.Send(delivery)
+		if result.Sent {
+			sent = append(sent, provider.Channel())
+		}
+		if result.NotificationID.Valid {
+			delivery.NotificationID = result.NotificationID
+		}
+	}
+	return sent
+}
+
+func channelOrder(channel models.NotificationChannel) int {
+	switch channel {
+	case models.NotificationChannelInApp:
+		return 0
+	case models.NotificationChannelEmail:
+		return 1
+	case models.NotificationChannelPush:
+		return 2
+	default:
+		return 3
+	}
+}
diff --git a/internal/notification/dispatcher.go b/internal/notification/dispatcher.go
index 74b15b89..82208714 100644
--- a/internal/notification/dispatcher.go
+++ b/internal/notification/dispatcher.go
@@ -1,169 +1,51 @@
 package notifier
 
 import (
-	"encoding/json"
+	"fmt"
 
+	"github.com/abhinavxd/libredesk/internal/notification/channels"
 	"github.com/abhinavxd/libredesk/internal/notification/models"
-	wsmodels "github.com/abhinavxd/libredesk/internal/ws/models"
-	"github.com/volatiletech/null/v9"
-	"github.com/zerodha/logf"
 )
 
-// WSHub defines the interface for the Websocket hub.
-type WSHub interface {
-	BroadcastMessage(msg wsmodels.BroadcastMessage)
+type NotificationPreferenceStore interface {
+	EnabledChannels(recipientIDs []int, nType models.NotificationType) (map[int][]models.NotificationChannel, error)
 }
 
-// Notification represents a notification to be sent through all channels.
-type Notification struct {
-	// Core notification fields
-	Type           models.NotificationType
-	RecipientIDs   []int
-	Title          string
-	Body           null.String
-	ConversationID null.Int
-	MessageID      null.Int
-	ActorID        null.Int
-	Meta           json.RawMessage
-
-	// For Websocket broadcast
-	ConversationUUID string
-	ActorFirstName   string
-	ActorLastName    string
-
-	// Email fields (optional - if empty, no email sent)
-	Email *EmailNotification
-}
-
-// EmailNotification holds email channel notification details.
-type EmailNotification struct {
-	Recipients []string
-	Subject    string
-	Content    string
-}
-
-// Dispatcher coordinates sending notifications through multiple channels: WS, DB, email.
 type Dispatcher struct {
-	inApp        *UserNotificationManager
-	outbound     *Service
-	wsHub        WSHub
-	emailEnabled bool
-	lo           *logf.Logger
+	pipeline channels.Pipeline
+	prefs    NotificationPreferenceStore
 }
 
 // DispatcherOpts contains options for creating a new Dispatcher.
 type DispatcherOpts struct {
-	InApp        *UserNotificationManager
-	Outbound     *Service
-	WSHub        WSHub
-	EmailEnabled bool
-	Lo           *logf.Logger
+	Pipeline channels.Pipeline
+	Prefs    NotificationPreferenceStore
 }
 
 // NewDispatcher creates a new notification Dispatcher.
 func NewDispatcher(opts DispatcherOpts) *Dispatcher {
-	return &Dispatcher{
-		inApp:        opts.InApp,
-		outbound:     opts.Outbound,
-		wsHub:        opts.WSHub,
-		emailEnabled: opts.EmailEnabled,
-		lo:           opts.Lo,
-	}
+	return &Dispatcher{pipeline: opts.Pipeline, prefs: opts.Prefs}
 }
 
-// Send sends a notification through all configured channels.
-// For each recipient: creates in-app notification (DB), broadcasts via Websocket,
-// and sends email if Email field is provided.
-func (d *Dispatcher) Send(n Notification) {
-	for i, recipientID := range n.RecipientIDs {
-		d.sendToRecipient(recipientID, n)
-
-		if d.outbound != nil && n.Email != nil && d.emailEnabled {
-			var email string
-			if i < len(n.Email.Recipients) {
-				email = n.Email.Recipients[i]
-			} else if len(n.Email.Recipients) == 1 {
-				email = n.Email.Recipients[0] // Broadcast mode
-			}
-			if email != "" {
-				d.sendEmail(recipientID, email, n.Email.Subject, n.Email.Content, n.Type)
-			}
-		}
+func (d *Dispatcher) Send(n models.Notification) ([]models.DeliveryResult, error) {
+	recipientIDs := make([]int, len(n.Recipients))
+	for i, recipient := range n.Recipients {
+		recipientIDs[i] = recipient.UserID
 	}
-}
-
-// SendWithEmails sends notifications where each recipient has their own email content.
-// This is useful when email content is personalized per recipient.
-func (d *Dispatcher) SendWithEmails(n Notification, emails []EmailNotification) {
-	for i, recipientID := range n.RecipientIDs {
-		d.sendToRecipient(recipientID, n)
-
-		if d.outbound != nil && i < len(emails) && len(emails[i].Recipients) > 0 && d.emailEnabled {
-			e := emails[i]
-			d.sendEmail(recipientID, e.Recipients[0], e.Subject, e.Content, n.Type)
-		}
-	}
-}
-
-// sendToRecipient creates in-app notification and broadcasts via Websocket.
-// Returns the created notification or nil if creation failed.
-func (d *Dispatcher) sendToRecipient(recipientID int, n Notification) *models.UserNotification {
-	notification, err := d.inApp.Create(
-		recipientID,
-		n.Type,
-		n.Title,
-		n.Body,
-		n.ConversationID,
-		n.MessageID,
-		n.ActorID,
-		n.Meta,
-	)
+	enabled, err := d.prefs.EnabledChannels(recipientIDs, n.Type)
 	if err != nil {
-		d.lo.Error("error creating in-app notification",
-			"recipient_id", recipientID,
-			"type", n.Type,
-			"error", err)
-		return nil
+		return nil, fmt.Errorf("fetching notification preferences: %w", err)
 	}
-	notification.ConversationUUID = null.StringFrom(n.ConversationUUID)
-	notification.ActorFirstName = null.StringFrom(n.ActorFirstName)
-	notification.ActorLastName = null.StringFrom(n.ActorLastName)
-	d.broadcastNotification([]int{recipientID}, notification)
-	return &notification
-}
 
-// sendEmail sends an email notification through the outbound service.
-func (d *Dispatcher) sendEmail(recipientID int, email, subject, content string, nType models.NotificationType) {
-	if err := d.outbound.Send(Message{
-		RecipientEmails: []string{email},
-		Subject:         subject,
-		Content:         content,
-		Provider:        ProviderEmail,
-	}); err != nil {
-		d.lo.Error("error sending email notification",
-			"recipient_id", recipientID,
-			"email", email,
-			"type", nType,
-			"error", err)
+	results := make([]models.DeliveryResult, 0, len(n.Recipients))
+	for _, recipient := range n.Recipients {
+		results = append(results, models.DeliveryResult{
+			RecipientID: recipient.UserID,
+			Channels: d.pipeline.Send(
+				channels.Delivery{Recipient: recipient, Notification: n},
+				enabled[recipient.UserID],
+			),
+		})
 	}
-}
-
-// broadcastNotification broadcasts a notification via Websocket to specified users.
-func (d *Dispatcher) broadcastNotification(userIDs []int, notification any) {
-	if d.wsHub == nil {
-		return
-	}
-	message := wsmodels.Message{
-		Type: wsmodels.MessageTypeNewNotification,
-		Data: notification,
-	}
-	msgB, err := json.Marshal(message)
-	if err != nil {
-		d.lo.Error("error marshalling notification for Websocket", "error", err)
-		return
-	}
-	d.wsHub.BroadcastMessage(wsmodels.BroadcastMessage{
-		Data:  msgB,
-		Users: userIDs,
-	})
+	return results, nil
 }
diff --git a/internal/notification/dispatcher_test.go b/internal/notification/dispatcher_test.go
new file mode 100644
index 00000000..1e471db8
--- /dev/null
+++ b/internal/notification/dispatcher_test.go
@@ -0,0 +1,140 @@
+package notifier
+
+import (
+	"errors"
+	"slices"
+	"testing"
+
+	"github.com/abhinavxd/libredesk/internal/notification/channels"
+	"github.com/abhinavxd/libredesk/internal/notification/models"
+	"github.com/volatiletech/null/v9"
+)
+
+type fakePreferences struct {
+	channels map[int][]models.NotificationChannel
+	err      error
+}
+
+func (p fakePreferences) EnabledChannels([]int, models.NotificationType) (map[int][]models.NotificationChannel, error) {
+	return p.channels, p.err
+}
+
+type fakePushSender struct {
+	userID  int
+	payload models.PushPayload
+}
+
+type fakeChannelProvider struct {
+	channel        models.NotificationChannel
+	result         channels.Result
+	notificationID null.Int
+}
+
+func (p *fakePushSender) Send(userID int, payload models.PushPayload) bool {
+	p.userID = userID
+	p.payload = payload
+	return true
+}
+
+func (p *fakeChannelProvider) Channel() models.NotificationChannel {
+	return p.channel
+}
+
+func (p *fakeChannelProvider) Send(delivery channels.Delivery) channels.Result {
+	p.notificationID = delivery.NotificationID
+	return p.result
+}
+
+func TestDispatcherPassesResultsThroughProviders(t *testing.T) {
+	inApp := &fakeChannelProvider{
+		channel: models.NotificationChannelInApp,
+		result:  channels.Result{Sent: true, NotificationID: null.IntFrom(7)},
+	}
+	email := &fakeChannelProvider{channel: models.NotificationChannelEmail}
+	d := NewDispatcher(DispatcherOpts{
+		Pipeline: channels.NewPipeline(email, inApp),
+		Prefs: fakePreferences{channels: map[int][]models.NotificationChannel{
+			42: {models.NotificationChannelInApp, models.NotificationChannelEmail},
+		}},
+	})
+
+	results, err := d.Send(models.Notification{Type: models.NotificationTypeMention, Recipients: []models.Recipient{{UserID: 42}}})
+	if err != nil {
+		t.Fatal(err)
+	}
+
+	if email.notificationID.Int != 7 {
+		t.Fatalf("email notification ID = %d, want 7", email.notificationID.Int)
+	}
+	if len(results) != 1 || !slices.Equal(results[0].Channels, []models.NotificationChannel{models.NotificationChannelInApp}) {
+		t.Fatalf("delivery results = %#v", results)
+	}
+}
+
+func TestDispatcherSendsPushUsingNotificationRoute(t *testing.T) {
+	push := &fakePushSender{}
+	d := NewDispatcher(DispatcherOpts{
+		Prefs: fakePreferences{channels: map[int][]models.NotificationChannel{
+			42: {models.NotificationChannelPush},
+		}},
+		Pipeline: channels.NewPipeline(channels.NewPush(push)),
+	})
+	d.Send(models.Notification{
+		Type:             models.NotificationTypeMention,
+		Recipients:       []models.Recipient{{UserID: 42}},
+		Title:            "You were mentioned",
+		Body:             null.StringFrom("A teammate mentioned you"),
+		ConversationUUID: "conversation-uuid",
+		MessageUUID:      "message-uuid",
+	})
+
+	if push.userID != 42 {
+		t.Fatalf("sent to user %d, want 42", push.userID)
+	}
+	if push.payload.URL != "/inboxes/mentioned/conversation/conversation-uuid?scrollTo=message-uuid" {
+		t.Fatalf("push URL = %q", push.payload.URL)
+	}
+	if push.payload.Title != "You were mentioned" || push.payload.Body != "A teammate mentioned you" {
+		t.Fatalf("unexpected push payload: %#v", push.payload)
+	}
+}
+
+func TestDispatcherDoesNotSendPushWhenDisabled(t *testing.T) {
+	push := &fakePushSender{}
+	d := NewDispatcher(DispatcherOpts{
+		Prefs: fakePreferences{channels: map[int][]models.NotificationChannel{
+			42: nil,
+		}},
+		Pipeline: channels.NewPipeline(channels.NewPush(push)),
+	})
+	d.Send(models.Notification{
+		Type:       models.NotificationTypeMention,
+		Recipients: []models.Recipient{{UserID: 42}},
+		Title:      "You were mentioned",
+	})
+
+	if push.userID != 0 {
+		t.Fatalf("sent push to user %d when push is disabled", push.userID)
+	}
+}
+
+func TestDispatcherReturnsPreferenceLookupFailure(t *testing.T) {
+	lookupErr := errors.New("lookup failed")
+	push := &fakePushSender{}
+	d := NewDispatcher(DispatcherOpts{
+		Prefs:    fakePreferences{err: lookupErr},
+		Pipeline: channels.NewPipeline(channels.NewPush(push)),
+	})
+	_, err := d.Send(models.Notification{
+		Type:       models.NotificationTypeMention,
+		Recipients: []models.Recipient{{UserID: 42}},
+		Title:      "You were mentioned",
+	})
+
+	if !errors.Is(err, lookupErr) {
+		t.Fatalf("error = %v, want %v", err, lookupErr)
+	}
+	if push.userID != 0 {
+		t.Fatalf("sent push to user %d after preference lookup failed", push.userID)
+	}
+}
diff --git a/internal/notification/email_queue.go b/internal/notification/email_queue.go
new file mode 100644
index 00000000..db9dfecd
--- /dev/null
+++ b/internal/notification/email_queue.go
@@ -0,0 +1,193 @@
+package notifier
+
+import (
+	"context"
+	"time"
+
+	"github.com/abhinavxd/libredesk/internal/dbutil"
+	"github.com/abhinavxd/libredesk/internal/notification/models"
+	"github.com/jmoiron/sqlx"
+	"github.com/volatiletech/null/v9"
+	"github.com/zerodha/logf"
+)
+
+const (
+	emailQueueTick        = 15 * time.Second
+	emailQueueBatch       = 500
+	emailQueueClaimLease  = 5 * time.Minute
+	emailQueueMaxAttempts = 3
+	emailQueueRetryDelay  = time.Minute
+)
+
+type replyNotificationStore interface {
+	ReleaseReplyNotification(conversationID, userID int, messageCreatedAt time.Time)
+}
+
+type EmailSender interface {
+	Send(Message) error
+	SendSync(Message) error
+}
+
+type emailQueueQueries struct {
+	IsSeen  *sqlx.Stmt `query:"is-notification-seen"`
+	Enqueue *sqlx.Stmt `query:"enqueue-notification-email"`
+	Claim   *sqlx.Stmt `query:"claim-due-notification-emails"`
+	Delete  *sqlx.Stmt `query:"delete-claimed-notification-email"`
+	Retry   *sqlx.Stmt `query:"retry-claimed-notification-email"`
+}
+
+type queuedEmail struct {
+	ID               int64                   `db:"id"`
+	ClaimedAt        time.Time               `db:"updated_at"`
+	UserID           int                     `db:"user_id"`
+	NotificationID   null.Int                `db:"notification_id"`
+	Type             models.NotificationType `db:"notification_type"`
+	ConversationID   null.Int                `db:"conversation_id"`
+	Attempts         int                     `db:"attempts"`
+	Recipient        string                  `db:"recipient_email"`
+	Subject          string                  `db:"subject"`
+	Content          string                  `db:"content"`
+	MessageCreatedAt null.Time               `db:"message_created_at"`
+}
+
+type EmailQueue struct {
+	q                 emailQueueQueries
+	outbound          EmailSender
+	conversationStore replyNotificationStore
+	lo                *logf.Logger
+}
+
+type EmailQueueOpts struct {
+	DB       *sqlx.DB
+	Outbound EmailSender
+	Lo       *logf.Logger
+}
+
+func NewEmailQueue(opts EmailQueueOpts) (*EmailQueue, error) {
+	var q emailQueueQueries
+	if err := dbutil.ScanSQLFile("queries.sql", &q, opts.DB, queriesFS); err != nil {
+		return nil, err
+	}
+	return &EmailQueue{
+		q:        q,
+		outbound: opts.Outbound,
+		lo:       opts.Lo,
+	}, nil
+}
+
+func (q *EmailQueue) SetConversationStore(store replyNotificationStore) {
+	q.conversationStore = store
+}
+
+func (q *EmailQueue) Send(e models.Email) bool {
+	if err := q.outbound.Send(Message{
+		RecipientEmails: []string{e.Recipient},
+		Subject:         e.Subject,
+		Content:         e.Content,
+		Provider:        ProviderEmail,
+	}); err != nil {
+		q.lo.Error("error sending notification email", "user_id", e.UserID, "type", e.Type, "error", err)
+		return false
+	}
+	return true
+}
+
+func (q *EmailQueue) SendAfter(e models.Email, delay time.Duration) bool {
+	if _, err := q.q.Enqueue.Exec(e.UserID, e.NotificationID, e.Type, e.ConversationID, e.Recipient,
+		e.Subject, e.Content, time.Now().Add(delay), e.MessageCreatedAt); err != nil {
+		q.lo.Error("error queueing notification email", "user_id", e.UserID, "type", e.Type, "error", err)
+		return false
+	}
+	return true
+}
+
+func (q *EmailQueue) Run(ctx context.Context) {
+	ticker := time.NewTicker(emailQueueTick)
+	defer ticker.Stop()
+
+	for {
+		select {
+		case <-ctx.Done():
+			return
+		case <-ticker.C:
+			for _, e := range q.due() {
+				seen, err := q.seen(e)
+				if err != nil {
+					continue
+				}
+				if seen {
+					q.delete(e)
+					continue
+				}
+				q.deliver(e)
+			}
+		}
+	}
+}
+
+func (q *EmailQueue) due() []queuedEmail {
+	var due []queuedEmail
+	if err := q.q.Claim.Select(&due, emailQueueBatch, time.Now().Add(emailQueueClaimLease)); err != nil {
+		q.lo.Error("error claiming due notification emails", "error", err)
+		return nil
+	}
+	return due
+}
+
+func (q *EmailQueue) seen(e queuedEmail) (bool, error) {
+	var seen bool
+	if err := q.q.IsSeen.Get(&seen, e.UserID, e.NotificationID, e.ConversationID, e.MessageCreatedAt); err != nil {
+		q.lo.Error("error checking notification seen state", "user_id", e.UserID, "type", e.Type, "error", err)
+		return false, err
+	}
+	return seen, nil
+}
+
+func (q *EmailQueue) deliver(e queuedEmail) bool {
+	if err := q.outbound.SendSync(Message{
+		RecipientEmails: []string{e.Recipient},
+		Subject:         e.Subject,
+		Content:         e.Content,
+		Provider:        ProviderEmail,
+	}); err != nil {
+		q.lo.Error("error delivering notification email", "user_id", e.UserID, "type", e.Type, "error", err)
+		if e.Attempts+1 >= emailQueueMaxAttempts {
+			q.abandon(e)
+		} else {
+			q.retry(e)
+		}
+		return false
+	}
+	q.delete(e)
+	return true
+}
+
+func (q *EmailQueue) abandon(e queuedEmail) {
+	if !q.delete(e) || e.NotificationID.Valid || !e.ConversationID.Valid || q.conversationStore == nil {
+		return
+	}
+	switch e.Type {
+	case models.NotificationTypeNewReply, models.NotificationTypeNewReplyParticipating, models.NotificationTypeConversationReopened:
+		q.conversationStore.ReleaseReplyNotification(e.ConversationID.Int, e.UserID, e.MessageCreatedAt.Time)
+	}
+}
+
+func (q *EmailQueue) delete(e queuedEmail) bool {
+	result, err := q.q.Delete.Exec(e.ID, e.ClaimedAt)
+	if err != nil {
+		q.lo.Error("error deleting delivered notification email", "user_id", e.UserID, "type", e.Type, "error", err)
+		return false
+	}
+	deleted, err := result.RowsAffected()
+	if err != nil {
+		q.lo.Error("error counting deleted notification emails", "user_id", e.UserID, "type", e.Type, "error", err)
+		return false
+	}
+	return deleted > 0
+}
+
+func (q *EmailQueue) retry(e queuedEmail) {
+	if _, err := q.q.Retry.Exec(e.ID, time.Now().Add(emailQueueRetryDelay), e.ClaimedAt); err != nil {
+		q.lo.Error("error scheduling notification email retry", "user_id", e.UserID, "type", e.Type, "error", err)
+	}
+}
diff --git a/internal/notification/email_queue_test.go b/internal/notification/email_queue_test.go
new file mode 100644
index 00000000..1d976800
--- /dev/null
+++ b/internal/notification/email_queue_test.go
@@ -0,0 +1,392 @@
+package notifier
+
+import (
+	"errors"
+	"testing"
+	"time"
+
+	"github.com/abhinavxd/libredesk/internal/notification/channels"
+	"github.com/abhinavxd/libredesk/internal/notification/models"
+	"github.com/abhinavxd/libredesk/internal/testutil"
+	"github.com/volatiletech/null/v9"
+	"github.com/zerodha/logf"
+)
+
+type emailDeliveryProvider struct {
+	err error
+}
+
+type replyNotificationRecorder struct {
+	release func(int, int, time.Time)
+}
+
+func (p *emailDeliveryProvider) Send(Message) error {
+	return p.err
+}
+
+func (p *emailDeliveryProvider) Name() string {
+	return ProviderEmail
+}
+
+func (s *replyNotificationRecorder) ReleaseReplyNotification(conversationID, userID int, messageCreatedAt time.Time) {
+	s.release(conversationID, userID, messageCreatedAt)
+}
+
+func TestDelayedReplyEmailUsesMessageTime(t *testing.T) {
+	db := testutil.NewDB(t, "reply_email_time")
+	var userID, inboxID, convID int
+	if err := db.Get(&userID, `INSERT INTO users (type, email, first_name, last_name) VALUES ('agent', 'read@example.com', 'Agent', '') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	if err := db.Get(&inboxID, `INSERT INTO inboxes (name, channel) VALUES ('Test', 'email') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	if err := db.Get(&convID, `INSERT INTO conversations (contact_id, inbox_id, status_id) VALUES ($1, $2, (SELECT id FROM conversation_statuses LIMIT 1)) RETURNING id`, userID, inboxID); err != nil {
+		t.Fatal(err)
+	}
+	lo := logf.New(logf.Opts{})
+	provider := &emailDeliveryProvider{}
+	outbound := NewService(map[string]Notifier{ProviderEmail: provider}, 1, 1, &lo)
+	queue, err := NewEmailQueue(EmailQueueOpts{DB: db, Outbound: outbound, Lo: &lo})
+	if err != nil {
+		t.Fatal(err)
+	}
+	d := NewDispatcher(DispatcherOpts{
+		Pipeline: channels.NewPipeline(channels.NewEmail(queue)),
+		Prefs:    fakePreferences{channels: map[int][]models.NotificationChannel{userID: {models.NotificationChannelEmail}}},
+	})
+	messageTime := time.Now().UTC().Add(-time.Minute).Truncate(time.Microsecond)
+	n := models.Notification{
+		Type: models.NotificationTypeNewReply,
+		Recipients: []models.Recipient{{
+			UserID: userID,
+			Email: &models.EmailNotification{
+				Recipient: "read@example.com",
+				Subject:   "Reply",
+				Content:   "First reply",
+				Delay:     time.Minute,
+			},
+		}},
+		ConversationID:   null.IntFrom(convID),
+		MessageCreatedAt: null.TimeFrom(messageTime),
+	}
+	db.MustExec(`INSERT INTO conversation_last_seen (user_id, conversation_id, last_seen_at) VALUES ($1, $2, $3)`, userID, convID, messageTime.Add(-time.Second))
+	for _, tt := range []struct {
+		name     string
+		readTime time.Time
+		want     bool
+	}{
+		{"read before reply", messageTime.Add(-time.Second), false},
+		{"read at reply", messageTime, true},
+		{"read before enqueue", messageTime.Add(time.Second), true},
+	} {
+		t.Run(tt.name, func(t *testing.T) {
+			db.MustExec(`UPDATE conversation_last_seen SET last_seen_at = $1`, tt.readTime)
+			d.Send(n)
+			db.MustExec(`UPDATE notification_email_queue SET send_at = now() - interval '1 second'`)
+			due := queue.due()
+			if len(due) != 1 {
+				t.Fatalf("queued emails = %d, want 1", len(due))
+			}
+			got, err := queue.seen(due[0])
+			if err != nil {
+				t.Fatal(err)
+			}
+			if got != tt.want {
+				t.Fatalf("seen = %v, want %v", got, tt.want)
+			}
+		})
+	}
+
+	t.Run("coalesced reply uses latest message", func(t *testing.T) {
+		db.MustExec(`UPDATE conversation_last_seen SET last_seen_at = $1`, messageTime.Add(time.Second))
+		d.Send(n)
+		n.MessageCreatedAt = null.TimeFrom(messageTime.Add(2 * time.Second))
+		n.Recipients[0].Email.Content = "Second reply"
+		d.Send(n)
+		db.MustExec(`UPDATE notification_email_queue SET send_at = now() - interval '1 second'`)
+		due := queue.due()
+		if len(due) != 1 || due[0].Content != "Second reply" {
+			t.Fatalf("unexpected coalesced emails: %#v", due)
+		}
+		seen, err := queue.seen(due[0])
+		if err != nil {
+			t.Fatal(err)
+		}
+		if seen {
+			t.Fatal("unread second reply suppressed")
+		}
+		db.MustExec(`UPDATE conversation_last_seen SET last_seen_at = $1`, messageTime.Add(3*time.Second))
+		seen, err = queue.seen(due[0])
+		if err != nil {
+			t.Fatal(err)
+		}
+		if !seen {
+			t.Fatal("read second reply was not suppressed")
+		}
+	})
+
+	t.Run("legacy email without message time", func(t *testing.T) {
+		n.MessageCreatedAt = null.Time{}
+		d.Send(n)
+		db.MustExec(`UPDATE notification_email_queue SET send_at = now() - interval '1 second'`)
+		due := queue.due()
+		if len(due) != 1 {
+			t.Fatalf("queued emails = %d, want 1", len(due))
+		}
+		seen, err := queue.seen(due[0])
+		if err != nil {
+			t.Fatal(err)
+		}
+		if seen {
+			t.Fatal("legacy unread email suppressed")
+		}
+		db.MustExec(`UPDATE conversation_last_seen SET last_seen_at = now()`)
+		seen, err = queue.seen(due[0])
+		if err != nil {
+			t.Fatal(err)
+		}
+		if !seen {
+			t.Fatal("legacy read email was not suppressed")
+		}
+	})
+}
+
+func TestDelayedEmailSeenCheckReturnsDatabaseError(t *testing.T) {
+	db := testutil.NewDB(t, "notification_email_seen_error")
+	lo := logf.New(logf.Opts{})
+	queue, err := NewEmailQueue(EmailQueueOpts{DB: db, Lo: &lo})
+	if err != nil {
+		t.Fatal(err)
+	}
+	db.MustExec(`DROP TABLE conversation_last_seen`)
+
+	if _, err := queue.seen(queuedEmail{}); err == nil {
+		t.Fatal("seen-state database error was ignored")
+	}
+}
+
+func TestDelayedEmailRetriesThenGivesUp(t *testing.T) {
+	db := testutil.NewDB(t, "reply_email_recipients")
+	var userID, inboxID, convID int
+	if err := db.Get(&userID, `INSERT INTO users (type, email, first_name, last_name) VALUES ('agent', 'queued@example.com', 'Agent', '') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	if err := db.Get(&inboxID, `INSERT INTO inboxes (name, channel) VALUES ('Test', 'email') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	if err := db.Get(&convID, `INSERT INTO conversations (contact_id, inbox_id, status_id) VALUES ($1, $2, (SELECT id FROM conversation_statuses LIMIT 1)) RETURNING id`, userID, inboxID); err != nil {
+		t.Fatal(err)
+	}
+	lo := logf.New(logf.Opts{})
+	provider := &emailDeliveryProvider{}
+	outbound := NewService(map[string]Notifier{ProviderEmail: provider}, 1, 1, &lo)
+	queue, err := NewEmailQueue(EmailQueueOpts{DB: db, Outbound: outbound, Lo: &lo})
+	if err != nil {
+		t.Fatal(err)
+	}
+	d := NewDispatcher(DispatcherOpts{
+		Pipeline: channels.NewPipeline(channels.NewEmail(queue)),
+		Prefs:    fakePreferences{channels: map[int][]models.NotificationChannel{userID: {models.NotificationChannelEmail}}},
+	})
+	n := models.Notification{Type: models.NotificationTypeNewReply, Recipients: []models.Recipient{{UserID: userID}}, ConversationID: null.IntFrom(convID)}
+	email := &models.EmailNotification{Recipient: "queued@example.com", Subject: "Reply", Content: "Reply", Delay: time.Minute}
+	send := func(email *models.EmailNotification) {
+		n.Recipients[0].Email = email
+		d.Send(n)
+	}
+	queued := func() int {
+		var count int
+		if err := db.Get(&count, `SELECT COUNT(*) FROM notification_email_queue`); err != nil {
+			t.Fatal(err)
+		}
+		return count
+	}
+	claimOne := func() queuedEmail {
+		t.Helper()
+		db.MustExec(`UPDATE notification_email_queue SET send_at = now() - interval '1 second'`)
+		due := queue.due()
+		if len(due) != 1 {
+			t.Fatalf("queued emails = %d, want 1", len(due))
+		}
+		return due[0]
+	}
+
+	send(nil)
+	if queued() != 0 {
+		t.Fatal("a notification without an email body was queued")
+	}
+
+	send(email)
+	if queued() != 1 {
+		t.Fatal("email was not queued")
+	}
+	if !queue.deliver(claimOne()) {
+		t.Fatal("email was not delivered")
+	}
+	if queued() != 0 {
+		t.Fatalf("queued emails after delivery = %d, want 0", queued())
+	}
+
+	provider.err = errors.New("SMTP unavailable")
+	send(email)
+	if queue.deliver(claimOne()) {
+		t.Fatal("failed send reported as delivered")
+	}
+	if queued() != 1 {
+		t.Fatalf("queued emails after failure = %d, want 1", queued())
+	}
+	for attempt := 2; attempt <= emailQueueMaxAttempts; attempt++ {
+		queue.deliver(claimOne())
+	}
+	if queued() != 0 {
+		t.Fatalf("queued emails after final failure = %d, want 0", queued())
+	}
+
+	send(email)
+	db.MustExec(`UPDATE notification_email_queue SET attempts = $1`, emailQueueMaxAttempts-1)
+	send(email)
+	var attempts int
+	if err := db.Get(&attempts, `SELECT attempts FROM notification_email_queue`); err != nil {
+		t.Fatal(err)
+	}
+	if attempts != 0 {
+		t.Fatalf("attempts after replacement = %d, want 0", attempts)
+	}
+}
+
+func TestClaimedEmailRemainsRecoverable(t *testing.T) {
+	db := testutil.NewDB(t, "notification_email_recovery")
+	var userID int
+	if err := db.Get(&userID, `INSERT INTO users (type, email, first_name, last_name) VALUES ('agent', 'recover@example.com', 'Agent', '') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	lo := logf.New(logf.Opts{})
+	provider := &emailDeliveryProvider{}
+	queue, err := NewEmailQueue(EmailQueueOpts{
+		DB:       db,
+		Outbound: NewService(map[string]Notifier{ProviderEmail: provider}, 1, 1, &lo),
+		Lo:       &lo,
+	})
+	if err != nil {
+		t.Fatal(err)
+	}
+	email := models.Email{
+		UserID:    userID,
+		Type:      models.NotificationTypeNewReply,
+		Recipient: "recover@example.com",
+		Subject:   "Reply",
+		Content:   "Pending reply",
+	}
+	if !queue.SendAfter(email, -time.Second) {
+		t.Fatal("queueing email failed")
+	}
+	claimed := queue.due()
+	if len(claimed) != 1 {
+		t.Fatalf("claimed emails = %d, want 1", len(claimed))
+	}
+	var queued int
+	if err := db.Get(&queued, `SELECT COUNT(*) FROM notification_email_queue`); err != nil {
+		t.Fatal(err)
+	}
+	if queued != 1 {
+		t.Fatalf("queued emails after claim = %d, want 1", queued)
+	}
+	if due := queue.due(); len(due) != 0 {
+		t.Fatalf("emails reclaimed before lease expiry = %d, want 0", len(due))
+	}
+	db.MustExec(`UPDATE notification_email_queue SET send_at = now() - interval '1 second'`)
+	if due := queue.due(); len(due) != 1 {
+		t.Fatalf("emails after lease expiry = %d, want 1", len(due))
+	}
+}
+
+func TestAbandonedReplyEmailReleasesSuppression(t *testing.T) {
+	db := testutil.NewDB(t, "notification_email_abandonment")
+	var userID, inboxID, convID, notificationID int
+	if err := db.Get(&userID, `INSERT INTO users (type, email, first_name, last_name) VALUES ('agent', 'abandon@example.com', 'Agent', '') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	if err := db.Get(&inboxID, `INSERT INTO inboxes (name, channel) VALUES ('Test', 'email') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	if err := db.Get(&convID, `INSERT INTO conversations (contact_id, inbox_id, status_id) VALUES ($1, $2, (SELECT id FROM conversation_statuses LIMIT 1)) RETURNING id`, userID, inboxID); err != nil {
+		t.Fatal(err)
+	}
+	if err := db.Get(&notificationID, `INSERT INTO user_notifications (user_id, notification_type, title, conversation_id) VALUES ($1, 'new_reply', 'Reply', $2) RETURNING id`, userID, convID); err != nil {
+		t.Fatal(err)
+	}
+	lo := logf.New(logf.Opts{})
+	provider := &emailDeliveryProvider{}
+	queue, err := NewEmailQueue(EmailQueueOpts{DB: db, Outbound: NewService(map[string]Notifier{ProviderEmail: provider}, 1, 1, &lo), Lo: &lo})
+	if err != nil {
+		t.Fatal(err)
+	}
+	for _, tt := range []struct {
+		name         string
+		nType        models.NotificationType
+		inApp        bool
+		replaced     bool
+		delivered    bool
+		attempts     int
+		wantReleased bool
+		wantQueued   int
+	}{
+		{name: "email only", nType: models.NotificationTypeNewReply, attempts: 2, wantReleased: true},
+		{name: "participant", nType: models.NotificationTypeNewReplyParticipating, attempts: 2, wantReleased: true},
+		{name: "reopened", nType: models.NotificationTypeConversationReopened, attempts: 2, wantReleased: true},
+		{name: "in app remains", nType: models.NotificationTypeNewReply, inApp: true, attempts: 2},
+		{name: "retry remains", nType: models.NotificationTypeNewReply, attempts: 1, wantQueued: 1},
+		{name: "newer email remains", nType: models.NotificationTypeNewReply, replaced: true, attempts: 2, wantQueued: 1},
+		{name: "successful delivery", nType: models.NotificationTypeNewReply, delivered: true, attempts: 2},
+		{name: "unrelated notification", nType: models.NotificationTypeAssignment, attempts: 2},
+	} {
+		t.Run(tt.name, func(t *testing.T) {
+			db.MustExec(`DELETE FROM notification_email_queue`)
+			messageTime := time.Now().UTC().Truncate(time.Microsecond)
+			email := models.Email{UserID: userID, Type: tt.nType, ConversationID: null.IntFrom(convID),
+				MessageCreatedAt: null.TimeFrom(messageTime), Recipient: "abandon@example.com", Subject: "Reply", Content: "Reply"}
+			if tt.inApp {
+				email.NotificationID = null.IntFrom(notificationID)
+			}
+			released := false
+			queue.SetConversationStore(&replyNotificationRecorder{release: func(gotConv, gotUser int, gotTime time.Time) {
+				released = true
+				if gotConv != convID || gotUser != userID || !gotTime.Equal(messageTime) {
+					t.Fatalf("released wrong reply: conversation=%d, user=%d, time=%v", gotConv, gotUser, gotTime)
+				}
+			}})
+			if !queue.SendAfter(email, -time.Second) {
+				t.Fatal("queueing email failed")
+			}
+			db.MustExec(`UPDATE notification_email_queue SET attempts = $1`, tt.attempts)
+			due := queue.due()
+			if len(due) != 1 {
+				t.Fatalf("due emails = %d, want 1", len(due))
+			}
+			if tt.replaced {
+				email.MessageCreatedAt = null.TimeFrom(messageTime.Add(time.Minute))
+				if !queue.SendAfter(email, time.Minute) {
+					t.Fatal("replacing queued email failed")
+				}
+			}
+			provider.err = errors.New("SMTP unavailable")
+			if tt.delivered {
+				provider.err = nil
+			}
+			if delivered := queue.deliver(due[0]); delivered != tt.delivered {
+				t.Fatalf("delivered = %v, want %v", delivered, tt.delivered)
+			}
+			if released != tt.wantReleased {
+				t.Fatalf("released = %v, want %v", released, tt.wantReleased)
+			}
+			var count int
+			if err := db.Get(&count, `SELECT count(*) FROM notification_email_queue`); err != nil {
+				t.Fatal(err)
+			}
+			if count != tt.wantQueued {
+				t.Fatalf("queued emails = %d, want %d", count, tt.wantQueued)
+			}
+		})
+	}
+}
diff --git a/internal/notification/models/models.go b/internal/notification/models/models.go
index 8ea45bd3..3319056e 100644
--- a/internal/notification/models/models.go
+++ b/internal/notification/models/models.go
@@ -2,6 +2,7 @@ package models
 
 import (
 	"encoding/json"
+	"slices"
 	"time"
 
 	"github.com/volatiletech/null/v9"
@@ -10,13 +11,122 @@ import (
 // NotificationType represents the type of user notification.
 type NotificationType string
 
+// NotificationChannel represents the delivery channel of a notification.
+type NotificationChannel string
+
 const (
-	NotificationTypeMention    NotificationType = "mention"
-	NotificationTypeAssignment NotificationType = "assignment"
+	NotificationTypeMention                NotificationType = "mention"
+	NotificationTypeAssignment             NotificationType = "assignment"
+	NotificationTypeNewReply               NotificationType = "new_reply"
+	NotificationTypeNewReplyParticipating  NotificationType = "new_reply_participating"
+	NotificationTypeConversationReopened   NotificationType = "conversation_reopened"
+	NotificationTypeSLAFirstResponseWarn   NotificationType = "sla_first_response_warning"
+	NotificationTypeSLAFirstResponseBreach NotificationType = "sla_first_response_breach"
+	NotificationTypeSLANextResponseWarn    NotificationType = "sla_next_response_warning"
+	NotificationTypeSLANextResponseBreach  NotificationType = "sla_next_response_breach"
+	NotificationTypeSLAResolutionWarn      NotificationType = "sla_resolution_warning"
+	NotificationTypeSLAResolutionBreach    NotificationType = "sla_resolution_breach"
+
+	// Superseded by the per-metric types above, retained so existing notification rows still render.
 	NotificationTypeSLAWarning NotificationType = "sla_warning"
 	NotificationTypeSLABreach  NotificationType = "sla_breach"
+
+	NotificationChannelInApp NotificationChannel = "in_app"
+	NotificationChannelEmail NotificationChannel = "email"
+	NotificationChannelPush  NotificationChannel = "push"
 )
 
+// AgentNotificationTypes are the notification types agents can set preferences for.
+var AgentNotificationTypes = []NotificationType{
+	NotificationTypeAssignment,
+	NotificationTypeMention,
+	NotificationTypeConversationReopened,
+	NotificationTypeNewReply,
+	NotificationTypeNewReplyParticipating,
+	NotificationTypeSLAFirstResponseWarn,
+	NotificationTypeSLAFirstResponseBreach,
+	NotificationTypeSLANextResponseWarn,
+	NotificationTypeSLANextResponseBreach,
+	NotificationTypeSLAResolutionWarn,
+	NotificationTypeSLAResolutionBreach,
+}
+
+// NotificationChannels are the delivery channels a preference can target.
+var NotificationChannels = []NotificationChannel{
+	NotificationChannelInApp,
+	NotificationChannelEmail,
+	NotificationChannelPush,
+}
+
+// defaultDisabledTypes are off until an agent opts in. Every other type defaults to on.
+var defaultDisabledTypes = []NotificationType{
+	NotificationTypeNewReply,
+	NotificationTypeNewReplyParticipating,
+}
+
+// NotificationPreference is a per-channel toggle for a notification type.
+type NotificationPreference struct {
+	NotificationType NotificationType    `db:"notification_type" json:"notification_type"`
+	Channel          NotificationChannel `db:"channel" json:"channel"`
+	Enabled          bool                `db:"enabled" json:"enabled"`
+}
+
+type Recipient struct {
+	UserID int
+	Email  *EmailNotification
+}
+
+type Notification struct {
+	Type             NotificationType
+	Recipients       []Recipient
+	Title            string
+	Body             null.String
+	ConversationID   null.Int
+	MessageID        null.Int
+	MessageCreatedAt null.Time
+	ActorID          null.Int
+	Meta             json.RawMessage
+	ConversationUUID string
+	MessageUUID      string
+	ActorFirstName   string
+	ActorLastName    string
+}
+
+type EmailNotification struct {
+	Recipient string
+	Subject   string
+	Content   string
+	Delay     time.Duration
+}
+
+type Email struct {
+	UserID           int
+	NotificationID   null.Int
+	Type             NotificationType
+	ConversationID   null.Int
+	Recipient        string
+	Subject          string
+	Content          string
+	MessageCreatedAt null.Time
+}
+
+type PushPayload struct {
+	Title string `json:"title"`
+	Body  string `json:"body,omitempty"`
+	Tag   string `json:"tag,omitempty"`
+	URL   string `json:"url"`
+}
+
+type DeliveryResult struct {
+	RecipientID int
+	Channels    []NotificationChannel
+}
+
+// DefaultEnabled reports the preference for a type when the agent has no stored row for it.
+func DefaultEnabled(nType NotificationType) bool {
+	return !slices.Contains(defaultDisabledTypes, nType)
+}
+
 // UserNotification represents an in-app notification for a user.
 type UserNotification struct {
 	ID               int              `db:"id" json:"id"`
diff --git a/internal/notification/models/models_test.go b/internal/notification/models/models_test.go
new file mode 100644
index 00000000..bcf86f59
--- /dev/null
+++ b/internal/notification/models/models_test.go
@@ -0,0 +1,24 @@
+package models
+
+import "testing"
+
+func TestDefaultEnabled(t *testing.T) {
+	tests := []struct {
+		name  string
+		nType NotificationType
+		want  bool
+	}{
+		{"assignment", NotificationTypeAssignment, true},
+		{"mention", NotificationTypeMention, true},
+		{"new reply", NotificationTypeNewReply, false},
+		{"new reply participating", NotificationTypeNewReplyParticipating, false},
+	}
+
+	for _, tt := range tests {
+		t.Run(tt.name, func(t *testing.T) {
+			if got := DefaultEnabled(tt.nType); got != tt.want {
+				t.Fatalf("DefaultEnabled(%q) = %v, want %v", tt.nType, got, tt.want)
+			}
+		})
+	}
+}
diff --git a/internal/notification/preferences.go b/internal/notification/preferences.go
new file mode 100644
index 00000000..c203dfb9
--- /dev/null
+++ b/internal/notification/preferences.go
@@ -0,0 +1,136 @@
+package notifier
+
+import (
+	"slices"
+
+	"github.com/abhinavxd/libredesk/internal/dbutil"
+	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/abhinavxd/libredesk/internal/notification/models"
+	"github.com/jmoiron/sqlx"
+	"github.com/knadh/go-i18n"
+	"github.com/lib/pq"
+	"github.com/zerodha/logf"
+)
+
+type prefQueries struct {
+	GetPreferences     *sqlx.Stmt `query:"get-notification-preferences"`
+	GetPreferencesType *sqlx.Stmt `query:"get-notification-preferences-for-type"`
+	UpsertPreference   *sqlx.Stmt `query:"upsert-notification-preference"`
+}
+
+type userChannelPreference struct {
+	UserID  int                        `db:"user_id"`
+	Channel models.NotificationChannel `db:"channel"`
+	Enabled bool                       `db:"enabled"`
+}
+
+type PreferenceManager struct {
+	db   *sqlx.DB
+	lo   *logf.Logger
+	i18n *i18n.I18n
+	q    prefQueries
+}
+
+type PreferenceManagerOpts struct {
+	DB   *sqlx.DB
+	Lo   *logf.Logger
+	I18n *i18n.I18n
+}
+
+// NewPreferenceManager creates a new PreferenceManager.
+func NewPreferenceManager(opts PreferenceManagerOpts) (*PreferenceManager, error) {
+	var q prefQueries
+	if err := dbutil.ScanSQLFile("queries.sql", &q, opts.DB, queriesFS); err != nil {
+		return nil, err
+	}
+	return &PreferenceManager{
+		db:   opts.DB,
+		q:    q,
+		lo:   opts.Lo,
+		i18n: opts.I18n,
+	}, nil
+}
+
+func (m *PreferenceManager) EnabledChannels(userIDs []int, nType models.NotificationType) (map[int][]models.NotificationChannel, error) {
+	var rows []userChannelPreference
+	if err := m.q.GetPreferencesType.Select(&rows, pq.Array(userIDs), nType); err != nil {
+		return nil, err
+	}
+
+	stored := make(map[[2]any]bool, len(rows))
+	for _, r := range rows {
+		stored[[2]any{r.UserID, r.Channel}] = r.Enabled
+	}
+
+	enabled := make(map[int][]models.NotificationChannel, len(userIDs))
+	for _, userID := range userIDs {
+		for _, channel := range models.NotificationChannels {
+			on, ok := stored[[2]any{userID, channel}]
+			if !ok {
+				on = models.DefaultEnabled(nType)
+			}
+			if on {
+				enabled[userID] = append(enabled[userID], channel)
+			}
+		}
+	}
+	return enabled, nil
+}
+
+// GetMatrix returns the effective preference for every agent notification type and channel.
+func (m *PreferenceManager) GetMatrix(userID int) ([]models.NotificationPreference, error) {
+	var rows []models.NotificationPreference
+	if err := m.q.GetPreferences.Select(&rows, userID); err != nil {
+		m.lo.Error("error fetching notification preferences", "user_id", userID, "error", err)
+		return nil, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+
+	stored := make(map[[2]any]bool, len(rows))
+	for _, r := range rows {
+		stored[[2]any{r.NotificationType, r.Channel}] = r.Enabled
+	}
+
+	matrix := make([]models.NotificationPreference, 0, len(models.AgentNotificationTypes)*len(models.NotificationChannels))
+	for _, nType := range models.AgentNotificationTypes {
+		for _, channel := range models.NotificationChannels {
+			on, ok := stored[[2]any{nType, channel}]
+			if !ok {
+				on = models.DefaultEnabled(nType)
+			}
+			matrix = append(matrix, models.NotificationPreference{
+				NotificationType: nType,
+				Channel:          channel,
+				Enabled:          on,
+			})
+		}
+	}
+	return matrix, nil
+}
+
+// Update upserts the given preferences for the user. Unknown types or channels are rejected.
+func (m *PreferenceManager) Update(userID int, prefs []models.NotificationPreference) error {
+	for _, p := range prefs {
+		if !slices.Contains(models.AgentNotificationTypes, p.NotificationType) ||
+			!slices.Contains(models.NotificationChannels, p.Channel) {
+			return envelope.NewError(envelope.InputError, m.i18n.T("notification.invalidPreference"), nil)
+		}
+	}
+
+	tx, err := m.db.Beginx()
+	if err != nil {
+		m.lo.Error("error starting notification preference update", "user_id", userID, "error", err)
+		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	defer tx.Rollback()
+	for _, p := range prefs {
+		if _, err := tx.Stmtx(m.q.UpsertPreference).Exec(userID, p.NotificationType, p.Channel, p.Enabled); err != nil {
+			m.lo.Error("error updating notification preference", "user_id", userID, "type", p.NotificationType, "channel", p.Channel, "error", err)
+			return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+		}
+	}
+	if err := tx.Commit(); err != nil {
+		m.lo.Error("error committing notification preference update", "user_id", userID, "error", err)
+		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return nil
+}
diff --git a/internal/notification/preferences_test.go b/internal/notification/preferences_test.go
new file mode 100644
index 00000000..75ec8c79
--- /dev/null
+++ b/internal/notification/preferences_test.go
@@ -0,0 +1,97 @@
+package notifier
+
+import (
+	"testing"
+
+	"github.com/abhinavxd/libredesk/internal/notification/models"
+	"github.com/abhinavxd/libredesk/internal/testutil"
+	"github.com/zerodha/logf"
+)
+
+func TestEnabledChannelsReturnsLookupFailure(t *testing.T) {
+	db := testutil.NewDB(t, "notification_preferences_read_failure")
+	lo := logf.New(logf.Opts{})
+	manager, err := NewPreferenceManager(PreferenceManagerOpts{
+		DB:   db,
+		Lo:   &lo,
+		I18n: testutil.NewI18n(t),
+	})
+	if err != nil {
+		t.Fatal(err)
+	}
+	if err := manager.q.GetPreferencesType.Close(); err != nil {
+		t.Fatal(err)
+	}
+
+	channels, err := manager.EnabledChannels([]int{1}, models.NotificationTypeAssignment)
+	if err == nil {
+		t.Fatal("preference lookup failure was not returned")
+	}
+	if channels != nil {
+		t.Fatalf("enabled channels = %v, want nil", channels)
+	}
+}
+
+func TestPreferenceUpdateIsAtomic(t *testing.T) {
+	db := testutil.NewDB(t, "notification_preferences_atomic")
+	var userID int
+	if err := db.Get(&userID, `INSERT INTO users (type, email, first_name, last_name) VALUES ('agent', 'prefs@example.com', 'Agent', '') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	lo := logf.New(logf.Opts{})
+	manager, err := NewPreferenceManager(PreferenceManagerOpts{
+		DB:   db,
+		Lo:   &lo,
+		I18n: testutil.NewI18n(t),
+	})
+	if err != nil {
+		t.Fatal(err)
+	}
+
+	t.Run("invalid preference", func(t *testing.T) {
+		err := manager.Update(userID, []models.NotificationPreference{
+			{NotificationType: models.NotificationTypeAssignment, Channel: models.NotificationChannelEmail, Enabled: false},
+			{NotificationType: "unknown", Channel: models.NotificationChannelPush, Enabled: true},
+		})
+		if err == nil {
+			t.Fatal("invalid update succeeded")
+		}
+		var count int
+		if err := db.Get(&count, `SELECT COUNT(*) FROM user_notification_preferences WHERE user_id = $1`, userID); err != nil {
+			t.Fatal(err)
+		}
+		if count != 0 {
+			t.Fatalf("stored preferences = %d, want 0", count)
+		}
+	})
+
+	t.Run("database failure", func(t *testing.T) {
+		db.MustExec(`
+			CREATE FUNCTION reject_push_preference() RETURNS trigger AS $$
+			BEGIN
+				IF NEW.channel = 'push' THEN
+					RAISE EXCEPTION 'push rejected';
+				END IF;
+				RETURN NEW;
+			END;
+			$$ LANGUAGE plpgsql;
+			CREATE TRIGGER reject_push_preference
+			BEFORE INSERT OR UPDATE ON user_notification_preferences
+			FOR EACH ROW EXECUTE FUNCTION reject_push_preference();
+		`)
+		err := manager.Update(userID, []models.NotificationPreference{
+			{NotificationType: models.NotificationTypeAssignment, Channel: models.NotificationChannelEmail, Enabled: false},
+			{NotificationType: models.NotificationTypeAssignment, Channel: models.NotificationChannelPush, Enabled: true},
+		})
+		if err == nil {
+			t.Fatal("update succeeded despite database failure")
+		}
+		var count int
+		if err := db.Get(&count, `SELECT COUNT(*) FROM user_notification_preferences WHERE user_id = $1`, userID); err != nil {
+			t.Fatal(err)
+		}
+		if count != 0 {
+			t.Fatalf("stored preferences = %d, want 0", count)
+		}
+	})
+}
diff --git a/internal/notification/push.go b/internal/notification/push.go
new file mode 100644
index 00000000..a5f1feba
--- /dev/null
+++ b/internal/notification/push.go
@@ -0,0 +1,325 @@
+package notifier
+
+import (
+	"context"
+	"encoding/json"
+	"io"
+	"net/http"
+	"net/url"
+	"strings"
+	"sync"
+	"time"
+
+	webpush "github.com/SherClockHolmes/webpush-go"
+	"github.com/abhinavxd/libredesk/internal/dbutil"
+	"github.com/abhinavxd/libredesk/internal/envelope"
+	nmodels "github.com/abhinavxd/libredesk/internal/notification/models"
+	"github.com/abhinavxd/libredesk/internal/ssrf"
+	"github.com/jmoiron/sqlx"
+	"github.com/jmoiron/sqlx/types"
+	"github.com/knadh/go-i18n"
+	"github.com/zerodha/logf"
+)
+
+const (
+	pushPublicKeySetting  = "notification.push.vapid_public_key"
+	pushPrivateKeySetting = "notification.push.vapid_private_key"
+	pushTTL               = 86400
+	pushTitleRunes        = 100
+	pushBodyRunes         = 400
+)
+
+type pushSender func(context.Context, []byte, PushSubscription, string, string, string) (*http.Response, error)
+
+type pushQueries struct {
+	List       *sqlx.Stmt `query:"get-push-subscriptions"`
+	Upsert     *sqlx.Stmt `query:"upsert-push-subscription"`
+	Delete     *sqlx.Stmt `query:"delete-push-subscription"`
+	DeleteByID *sqlx.Stmt `query:"delete-push-subscription-by-id"`
+}
+
+type PushSubscription struct {
+	ID       int    `db:"id" json:"id"`
+	Endpoint string `db:"endpoint" json:"endpoint"`
+	P256DH   string `db:"p256dh" json:"p256dh"`
+	Auth     string `db:"auth" json:"auth"`
+}
+
+type PushSubscriptionInput struct {
+	Endpoint string `json:"endpoint"`
+	P256DH   string `json:"p256dh"`
+	Auth     string `json:"auth"`
+}
+
+type pushDelivery struct {
+	UserID  int
+	Payload nmodels.PushPayload
+}
+
+type pushSubscriptionStore interface {
+	List(userID int) ([]PushSubscription, error)
+	Upsert(userID int, subscription PushSubscriptionInput) error
+	Delete(userID int, endpoint string) error
+	DeleteByID(id int) error
+}
+
+type pushSettingStore interface {
+	Get(key string) (types.JSONText, error)
+	Update(settings any) error
+}
+
+type sqlPushStore struct {
+	q pushQueries
+}
+
+type PushManager struct {
+	store       pushSubscriptionStore
+	lo          *logf.Logger
+	i18n        *i18n.I18n
+	publicKey   string
+	privateKey  string
+	subject     string
+	queue       chan pushDelivery
+	concurrency int
+	sender      pushSender
+}
+
+type PushManagerOpts struct {
+	DB          *sqlx.DB
+	Settings    pushSettingStore
+	Lo          *logf.Logger
+	I18n        *i18n.I18n
+	RootURL     string
+	Concurrency int
+	QueueSize   int
+}
+
+func NewPushManager(opts PushManagerOpts) (*PushManager, error) {
+	var q pushQueries
+	if err := dbutil.ScanSQLFile("queries.sql", &q, opts.DB, queriesFS); err != nil {
+		return nil, err
+	}
+	privateKey, publicKey, err := loadVAPIDKeys(opts.Settings)
+	if err != nil {
+		opts.Lo.Error("error loading VAPID keys, push notifications are off", "error", err)
+	}
+	m := &PushManager{
+		store:       &sqlPushStore{q: q},
+		lo:          opts.Lo,
+		i18n:        opts.I18n,
+		publicKey:   publicKey,
+		privateKey:  privateKey,
+		subject:     vapidSubject(opts.RootURL),
+		queue:       make(chan pushDelivery, opts.QueueSize),
+		concurrency: opts.Concurrency,
+	}
+	pushHTTPClient := newPushHTTPClient(opts.Lo)
+	m.sender = func(ctx context.Context, payload []byte, subscription PushSubscription, subject, publicKey, privateKey string) (*http.Response, error) {
+		return sendWebPush(ctx, payload, subscription, subject, publicKey, privateKey, pushHTTPClient)
+	}
+	return m, nil
+}
+
+func (m *PushManager) PublicKey() string {
+	return m.publicKey
+}
+
+func (m *PushManager) Upsert(userID int, subscription PushSubscriptionInput) error {
+	if !validPushSubscription(subscription) {
+		return envelope.NewError(envelope.InputError, m.i18n.T("notification.invalidPushSubscription"), nil)
+	}
+	if err := m.store.Upsert(userID, subscription); err != nil {
+		m.lo.Error("error saving push subscription", "user_id", userID, "error", err)
+		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return nil
+}
+
+func (m *PushManager) Delete(userID int, endpoint string) error {
+	if endpoint == "" {
+		return envelope.NewError(envelope.InputError, m.i18n.T("notification.invalidPushSubscription"), nil)
+	}
+	if err := m.store.Delete(userID, endpoint); err != nil {
+		m.lo.Error("error deleting push subscription", "user_id", userID, "error", err)
+		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return nil
+}
+
+func (m *PushManager) Send(userID int, payload nmodels.PushPayload) bool {
+	if m.publicKey == "" || m.privateKey == "" {
+		return false
+	}
+	select {
+	case m.queue <- pushDelivery{UserID: userID, Payload: payload}:
+		return true
+	default:
+		m.lo.Error("push notification queue is full", "user_id", userID)
+		return false
+	}
+}
+
+func (m *PushManager) Run(ctx context.Context) {
+	var wg sync.WaitGroup
+	for range m.concurrency {
+		wg.Go(func() { m.worker(ctx) })
+	}
+	wg.Wait()
+}
+
+func (m *PushManager) worker(ctx context.Context) {
+	for {
+		select {
+		case <-ctx.Done():
+			return
+		case delivery := <-m.queue:
+			if err := m.deliver(ctx, delivery); err != nil {
+				m.lo.Error("error sending push notification", "user_id", delivery.UserID, "error", err)
+			}
+		}
+	}
+}
+
+func (m *PushManager) deliver(ctx context.Context, delivery pushDelivery) error {
+	subscriptions, err := m.store.List(delivery.UserID)
+	if err != nil {
+		return err
+	}
+	delivery.Payload.Title = pushPreview(delivery.Payload.Title, pushTitleRunes)
+	delivery.Payload.Body = pushPreview(delivery.Payload.Body, pushBodyRunes)
+	payload, err := json.Marshal(delivery.Payload)
+	if err != nil {
+		return err
+	}
+	for _, subscription := range subscriptions {
+		resp, err := m.sender(ctx, payload, subscription, m.subject, m.publicKey, m.privateKey)
+		if err != nil {
+			m.lo.Error("push endpoint rejected notification", "subscription_id", subscription.ID, "error", err)
+			continue
+		}
+		if resp == nil {
+			continue
+		}
+		_, _ = io.Copy(io.Discard, resp.Body)
+		_ = resp.Body.Close()
+		if resp.StatusCode == http.StatusNotFound || resp.StatusCode == http.StatusGone {
+			if err := m.store.DeleteByID(subscription.ID); err != nil {
+				m.lo.Error("error deleting expired push subscription", "subscription_id", subscription.ID, "error", err)
+			}
+			continue
+		}
+		if resp.StatusCode < 200 || resp.StatusCode >= 300 {
+			m.lo.Error("push endpoint returned error", "subscription_id", subscription.ID, "status", resp.StatusCode)
+		}
+	}
+	return nil
+}
+
+func (s *sqlPushStore) List(userID int) ([]PushSubscription, error) {
+	var subscriptions []PushSubscription
+	if err := s.q.List.Select(&subscriptions, userID); err != nil {
+		return nil, err
+	}
+	return subscriptions, nil
+}
+
+func (s *sqlPushStore) Upsert(userID int, subscription PushSubscriptionInput) error {
+	_, err := s.q.Upsert.Exec(userID, subscription.Endpoint, subscription.P256DH, subscription.Auth)
+	return err
+}
+
+func (s *sqlPushStore) Delete(userID int, endpoint string) error {
+	_, err := s.q.Delete.Exec(userID, endpoint)
+	return err
+}
+
+func (s *sqlPushStore) DeleteByID(id int) error {
+	_, err := s.q.DeleteByID.Exec(id)
+	return err
+}
+
+func loadVAPIDKeys(settings pushSettingStore) (string, string, error) {
+	privateKey, err := readStringSetting(settings, pushPrivateKeySetting)
+	if err != nil {
+		return "", "", err
+	}
+	publicKey, err := readStringSetting(settings, pushPublicKeySetting)
+	if err != nil {
+		return "", "", err
+	}
+	if privateKey != "" && publicKey != "" {
+		return privateKey, publicKey, nil
+	}
+	privateKey, publicKey, err = webpush.GenerateVAPIDKeys()
+	if err != nil {
+		return "", "", err
+	}
+	if err := settings.Update(map[string]string{
+		pushPrivateKeySetting: privateKey,
+		pushPublicKeySetting:  publicKey,
+	}); err != nil {
+		return "", "", err
+	}
+	return privateKey, publicKey, nil
+}
+
+func readStringSetting(settings pushSettingStore, key string) (string, error) {
+	b, err := settings.Get(key)
+	if err != nil {
+		return "", err
+	}
+	var value string
+	if err := json.Unmarshal(b, &value); err != nil {
+		return "", err
+	}
+	return value, nil
+}
+
+func sendWebPush(ctx context.Context, payload []byte, subscription PushSubscription, subject, publicKey, privateKey string, client *http.Client) (*http.Response, error) {
+	return webpush.SendNotificationWithContext(ctx, payload, &webpush.Subscription{
+		Endpoint: subscription.Endpoint,
+		Keys: webpush.Keys{
+			P256dh: subscription.P256DH,
+			Auth:   subscription.Auth,
+		},
+	}, &webpush.Options{
+		HTTPClient:      client,
+		Subscriber:      subject,
+		VAPIDPublicKey:  publicKey,
+		VAPIDPrivateKey: privateKey,
+		TTL:             pushTTL,
+	})
+}
+
+func validPushSubscription(subscription PushSubscriptionInput) bool {
+	endpoint, err := url.Parse(subscription.Endpoint)
+	return err == nil && endpoint.Scheme == "https" && endpoint.Host != "" && subscription.P256DH != "" && subscription.Auth != ""
+}
+
+func vapidSubject(rootURL string) string {
+	rootURL = strings.TrimRight(rootURL, "/")
+	if strings.HasPrefix(rootURL, "https://") {
+		return rootURL
+	}
+	return "support@libredesk.io"
+}
+
+func newPushHTTPClient(lo *logf.Logger) *http.Client {
+	control := ssrf.NewControl(true, nil, lo)
+	return &http.Client{
+		Transport:     ssrf.NewTransport(control, 10*time.Second),
+		Timeout:       10 * time.Second,
+		CheckRedirect: func(*http.Request, []*http.Request) error { return http.ErrUseLastResponse },
+	}
+}
+
+func pushPreview(text string, limit int) string {
+	count := 0
+	for i := range text {
+		if count == limit {
+			return text[:i] + "…"
+		}
+		count++
+	}
+	return text
+}
diff --git a/internal/notification/push_store_test.go b/internal/notification/push_store_test.go
new file mode 100644
index 00000000..bc9f2cf1
--- /dev/null
+++ b/internal/notification/push_store_test.go
@@ -0,0 +1,79 @@
+package notifier
+
+import (
+	"testing"
+
+	"github.com/abhinavxd/libredesk/internal/dbutil"
+	"github.com/abhinavxd/libredesk/internal/testutil"
+)
+
+func newTestPushStore(t *testing.T) (*sqlPushStore, int, int) {
+	t.Helper()
+	db := testutil.NewDB(t, "notification_push_store")
+	var q pushQueries
+	if err := dbutil.ScanSQLFile("queries.sql", &q, db, queriesFS); err != nil {
+		t.Fatal(err)
+	}
+	var firstUserID, secondUserID int
+	if err := db.QueryRow(`INSERT INTO users (type, email, first_name) VALUES ('agent', 'push-one@example.com', 'One') RETURNING id`).Scan(&firstUserID); err != nil {
+		t.Fatal(err)
+	}
+	if err := db.QueryRow(`INSERT INTO users (type, email, first_name) VALUES ('agent', 'push-two@example.com', 'Two') RETURNING id`).Scan(&secondUserID); err != nil {
+		t.Fatal(err)
+	}
+	return &sqlPushStore{q: q}, firstUserID, secondUserID
+}
+
+func TestPushStoreMovesEndpointToLatestUser(t *testing.T) {
+	store, firstUserID, secondUserID := newTestPushStore(t)
+	endpoint := "https://push.example/shared"
+	if err := store.Upsert(firstUserID, PushSubscriptionInput{Endpoint: endpoint, P256DH: "first-key", Auth: "first-auth"}); err != nil {
+		t.Fatal(err)
+	}
+	if err := store.Upsert(secondUserID, PushSubscriptionInput{Endpoint: endpoint, P256DH: "second-key", Auth: "second-auth"}); err != nil {
+		t.Fatal(err)
+	}
+
+	firstSubscriptions, err := store.List(firstUserID)
+	if err != nil {
+		t.Fatal(err)
+	}
+	secondSubscriptions, err := store.List(secondUserID)
+	if err != nil {
+		t.Fatal(err)
+	}
+	if len(firstSubscriptions) != 0 {
+		t.Fatalf("first user retained %d subscriptions", len(firstSubscriptions))
+	}
+	if len(secondSubscriptions) != 1 || secondSubscriptions[0].P256DH != "second-key" || secondSubscriptions[0].Auth != "second-auth" {
+		t.Fatalf("second user subscriptions = %#v", secondSubscriptions)
+	}
+}
+
+func TestPushStoreDeleteIsUserScoped(t *testing.T) {
+	store, firstUserID, secondUserID := newTestPushStore(t)
+	endpoint := "https://push.example/scoped"
+	if err := store.Upsert(secondUserID, PushSubscriptionInput{Endpoint: endpoint, P256DH: "key", Auth: "auth"}); err != nil {
+		t.Fatal(err)
+	}
+	if err := store.Delete(firstUserID, endpoint); err != nil {
+		t.Fatal(err)
+	}
+	subscriptions, err := store.List(secondUserID)
+	if err != nil {
+		t.Fatal(err)
+	}
+	if len(subscriptions) != 1 {
+		t.Fatalf("other user delete left %d subscriptions, want 1", len(subscriptions))
+	}
+	if err := store.Delete(secondUserID, endpoint); err != nil {
+		t.Fatal(err)
+	}
+	subscriptions, err = store.List(secondUserID)
+	if err != nil {
+		t.Fatal(err)
+	}
+	if len(subscriptions) != 0 {
+		t.Fatalf("owner delete left %d subscriptions", len(subscriptions))
+	}
+}
diff --git a/internal/notification/push_test.go b/internal/notification/push_test.go
new file mode 100644
index 00000000..a9c5fc68
--- /dev/null
+++ b/internal/notification/push_test.go
@@ -0,0 +1,232 @@
+package notifier
+
+import (
+	"context"
+	"encoding/json"
+	"errors"
+	"fmt"
+	"io"
+	"net/http"
+	"net/http/httptest"
+	"strings"
+	"testing"
+	"unicode/utf8"
+
+	nmodels "github.com/abhinavxd/libredesk/internal/notification/models"
+	"github.com/jmoiron/sqlx/types"
+	"github.com/zerodha/logf"
+)
+
+type fakePushSettings struct {
+	values  map[string]string
+	updates int
+}
+
+func (s *fakePushSettings) Get(key string) (types.JSONText, error) {
+	b, _ := json.Marshal(s.values[key])
+	return b, nil
+}
+
+func (s *fakePushSettings) Update(value any) error {
+	s.updates++
+	for key, setting := range value.(map[string]string) {
+		s.values[key] = setting
+	}
+	return nil
+}
+
+type fakePushStore struct {
+	subscriptions []PushSubscription
+	deletedID     int
+}
+
+func (s *fakePushStore) List(int) ([]PushSubscription, error) {
+	return s.subscriptions, nil
+}
+
+func (s *fakePushStore) Upsert(int, PushSubscriptionInput) error { return nil }
+
+func (s *fakePushStore) Delete(int, string) error { return nil }
+
+func (s *fakePushStore) DeleteByID(id int) error {
+	s.deletedID = id
+	return nil
+}
+
+func TestPushManagerDeliverSendsEverySubscription(t *testing.T) {
+	store := &fakePushStore{subscriptions: []PushSubscription{
+		{ID: 11, Endpoint: "https://push.example/one", P256DH: "key-one", Auth: "auth-one"},
+		{ID: 12, Endpoint: "https://push.example/two", P256DH: "key-two", Auth: "auth-two"},
+	}}
+	var endpoints []string
+	m := &PushManager{
+		store:      store,
+		publicKey:  "public",
+		privateKey: "private",
+		subject:    "https://desk.example",
+		sender: func(_ context.Context, payload []byte, subscription PushSubscription, _, _, _ string) (*http.Response, error) {
+			if !strings.Contains(string(payload), `"url":"/inboxes/assigned/conversation/conv-1?scrollTo=msg-1"`) {
+				t.Fatalf("unexpected payload: %s", payload)
+			}
+			endpoints = append(endpoints, subscription.Endpoint)
+			return &http.Response{StatusCode: http.StatusCreated, Body: io.NopCloser(strings.NewReader(""))}, nil
+		},
+	}
+
+	if err := m.deliver(t.Context(), pushDelivery{UserID: 7, Payload: nmodels.PushPayload{
+		Title: "Assigned conversation",
+		Body:  "A conversation was assigned to you",
+		Tag:   "assignment_conv-1",
+		URL:   "/inboxes/assigned/conversation/conv-1?scrollTo=msg-1",
+	}}); err != nil {
+		t.Fatal(err)
+	}
+	if len(endpoints) != 2 {
+		t.Fatalf("sent to %d endpoints, want 2", len(endpoints))
+	}
+}
+
+func TestPushManagerDeliverBoundsPreview(t *testing.T) {
+	for _, content := range []string{"", "Short note", strings.Repeat("a", 100), strings.Repeat("a", 101), strings.Repeat("a", 400), strings.Repeat("a", 401), strings.Repeat("a", 10000), strings.Repeat("世界🙂", 2000), strings.Repeat("<&>\x00\"\\", 2000), strings.Repeat("\x00", 2000)} {
+		t.Run(fmt.Sprintf("bytes_%d", len(content)), func(t *testing.T) {
+			original := nmodels.PushPayload{Title: content, Body: content, Tag: "mention_" + strings.Repeat("a", 36), URL: "/inboxes/mentioned/conversation/123?scrollTo=456"}
+			called := false
+			m := &PushManager{
+				store: &fakePushStore{subscriptions: []PushSubscription{{ID: 1}}},
+				sender: func(_ context.Context, payload []byte, _ PushSubscription, _, _, _ string) (*http.Response, error) {
+					called = true
+					if len(payload) > 3993 {
+						t.Fatalf("payload has %d bytes, exceeds Web Push capacity", len(payload))
+					}
+					var got nmodels.PushPayload
+					if err := json.Unmarshal(payload, &got); err != nil {
+						t.Fatal(err)
+					}
+					if got.URL != original.URL || got.Tag != original.Tag {
+						t.Fatal("routing fields changed")
+					}
+					for _, preview := range []string{got.Title, got.Body} {
+						if !utf8.ValidString(preview) || !strings.HasPrefix(content, strings.TrimSuffix(preview, "…")) {
+							t.Fatal("invalid preview")
+						}
+						if len(content) < 100 && preview != content {
+							t.Fatal("short content changed")
+						}
+					}
+					return nil, nil
+				},
+			}
+			if err := m.deliver(t.Context(), pushDelivery{UserID: 1, Payload: original}); err != nil {
+				t.Fatal(err)
+			}
+			if !called {
+				t.Fatal("push was not delivered")
+			}
+		})
+	}
+}
+
+func TestPushManagerDeliverDeletesExpiredSubscription(t *testing.T) {
+	store := &fakePushStore{subscriptions: []PushSubscription{{ID: 23, Endpoint: "https://push.example/expired"}}}
+	m := &PushManager{
+		store: store,
+		sender: func(context.Context, []byte, PushSubscription, string, string, string) (*http.Response, error) {
+			return &http.Response{StatusCode: http.StatusGone, Body: io.NopCloser(strings.NewReader(""))}, nil
+		},
+	}
+
+	if err := m.deliver(t.Context(), pushDelivery{UserID: 7, Payload: nmodels.PushPayload{Title: "Mention"}}); err != nil {
+		t.Fatal(err)
+	}
+	if store.deletedID != 23 {
+		t.Fatalf("deleted subscription %d, want 23", store.deletedID)
+	}
+}
+
+func TestValidPushSubscription(t *testing.T) {
+	tests := []struct {
+		name  string
+		input PushSubscriptionInput
+		want  bool
+	}{
+		{"valid", PushSubscriptionInput{Endpoint: "https://push.example/id", P256DH: "key", Auth: "secret"}, true},
+		{"empty endpoint", PushSubscriptionInput{P256DH: "key", Auth: "secret"}, false},
+		{"non HTTPS endpoint", PushSubscriptionInput{Endpoint: "http://push.example/id", P256DH: "key", Auth: "secret"}, false},
+		{"missing public key", PushSubscriptionInput{Endpoint: "https://push.example/id", Auth: "secret"}, false},
+		{"missing auth", PushSubscriptionInput{Endpoint: "https://push.example/id", P256DH: "key"}, false},
+	}
+	for _, tt := range tests {
+		t.Run(tt.name, func(t *testing.T) {
+			if got := validPushSubscription(tt.input); got != tt.want {
+				t.Fatalf("validPushSubscription(%#v) = %v, want %v", tt.input, got, tt.want)
+			}
+		})
+	}
+}
+
+func TestPushHTTPClientBlocksPrivateEndpoints(t *testing.T) {
+	server := httptest.NewTLSServer(http.HandlerFunc(func(http.ResponseWriter, *http.Request) {
+		t.Fatal("private endpoint received push request")
+	}))
+	defer server.Close()
+	lo := logf.New(logf.Opts{})
+	request, err := http.NewRequestWithContext(t.Context(), http.MethodPost, server.URL, nil)
+	if err != nil {
+		t.Fatal(err)
+	}
+
+	if _, err := newPushHTTPClient(&lo).Do(request); err == nil {
+		t.Fatal("private endpoint request succeeded")
+	}
+}
+
+func TestPushHTTPClientRejectsRedirects(t *testing.T) {
+	lo := logf.New(logf.Opts{})
+	client := newPushHTTPClient(&lo)
+
+	if err := client.CheckRedirect(&http.Request{}, nil); !errors.Is(err, http.ErrUseLastResponse) {
+		t.Fatalf("redirect error = %v, want %v", err, http.ErrUseLastResponse)
+	}
+}
+
+func TestVAPIDSubject(t *testing.T) {
+	if got := vapidSubject("https://desk.example/"); got != "https://desk.example" {
+		t.Fatalf("HTTPS subject = %q", got)
+	}
+	if got := vapidSubject("http://localhost:9000"); got != "support@libredesk.io" {
+		t.Fatalf("local subject = %q", got)
+	}
+}
+
+func TestLoadVAPIDKeysReusesStoredPair(t *testing.T) {
+	settings := &fakePushSettings{values: map[string]string{
+		pushPrivateKeySetting: "stored-private",
+		pushPublicKeySetting:  "stored-public",
+	}}
+
+	privateKey, publicKey, err := loadVAPIDKeys(settings)
+	if err != nil {
+		t.Fatal(err)
+	}
+	if privateKey != "stored-private" || publicKey != "stored-public" {
+		t.Fatalf("got %q, %q", privateKey, publicKey)
+	}
+	if settings.updates != 0 {
+		t.Fatalf("updated stored VAPID keys %d times", settings.updates)
+	}
+}
+
+func TestLoadVAPIDKeysCreatesMissingPair(t *testing.T) {
+	settings := &fakePushSettings{values: map[string]string{}}
+
+	privateKey, publicKey, err := loadVAPIDKeys(settings)
+	if err != nil {
+		t.Fatal(err)
+	}
+	if privateKey == "" || publicKey == "" {
+		t.Fatal("generated VAPID keys are empty")
+	}
+	if settings.updates != 1 {
+		t.Fatalf("updated VAPID keys %d times, want 1", settings.updates)
+	}
+}
diff --git a/internal/notification/queries.sql b/internal/notification/queries.sql
index 96257938..bfd5ab44 100644
--- a/internal/notification/queries.sql
+++ b/internal/notification/queries.sql
@@ -46,3 +46,85 @@ DELETE FROM user_notifications WHERE user_id = $1;
 
 -- name: delete-old-notifications
 DELETE FROM user_notifications WHERE created_at < NOW() - INTERVAL '30 days';
+
+-- name: get-notification-preferences
+SELECT notification_type, channel, enabled
+FROM user_notification_preferences
+WHERE user_id = $1;
+
+-- name: get-notification-preferences-for-type
+SELECT user_id, channel, enabled
+FROM user_notification_preferences
+WHERE user_id = ANY($1::bigint[]) AND notification_type = $2;
+
+-- name: upsert-notification-preference
+INSERT INTO user_notification_preferences (user_id, notification_type, channel, enabled)
+VALUES ($1, $2, $3, $4)
+ON CONFLICT (user_id, notification_type, channel)
+DO UPDATE SET enabled = EXCLUDED.enabled, updated_at = now();
+
+-- name: get-push-subscriptions
+SELECT id, endpoint, p256dh, auth
+FROM notification_push_subscriptions
+WHERE user_id = $1;
+
+-- name: upsert-push-subscription
+INSERT INTO notification_push_subscriptions (user_id, endpoint, p256dh, auth)
+VALUES ($1, $2, $3, $4)
+ON CONFLICT (endpoint) DO UPDATE SET
+    user_id = EXCLUDED.user_id,
+    p256dh = EXCLUDED.p256dh,
+    auth = EXCLUDED.auth,
+    updated_at = now();
+
+-- name: delete-push-subscription
+DELETE FROM notification_push_subscriptions WHERE user_id = $1 AND endpoint = $2;
+
+-- name: delete-push-subscription-by-id
+DELETE FROM notification_push_subscriptions WHERE id = $1;
+
+-- name: is-notification-seen
+SELECT COALESCE((SELECT is_read FROM user_notifications WHERE id = $2 AND user_id = $1), false)
+    OR EXISTS (
+        SELECT 1 FROM conversation_last_seen
+        WHERE conversation_id = $3 AND user_id = $1 AND last_seen_at >= $4
+    );
+
+-- name: enqueue-notification-email
+INSERT INTO notification_email_queue
+    (user_id, notification_id, notification_type, conversation_id, recipient_email, subject, content, send_at, message_created_at)
+VALUES ($1, $2, $3, $4, $5, $6, $7, $8, $9)
+ON CONFLICT (user_id, notification_type, conversation_id) DO UPDATE SET
+    notification_id = EXCLUDED.notification_id,
+    recipient_email = EXCLUDED.recipient_email,
+    subject = EXCLUDED.subject,
+    content = EXCLUDED.content,
+    message_created_at = EXCLUDED.message_created_at,
+    send_at = LEAST(notification_email_queue.send_at, EXCLUDED.send_at),
+    attempts = 0,
+    queued_at = now(),
+    updated_at = now();
+
+-- name: claim-due-notification-emails
+WITH due AS (
+    SELECT id
+    FROM notification_email_queue
+    WHERE send_at <= now()
+    ORDER BY send_at
+    LIMIT $1
+    FOR UPDATE SKIP LOCKED
+)
+UPDATE notification_email_queue AS q
+SET send_at = $2, updated_at = now()
+FROM due
+WHERE q.id = due.id
+RETURNING q.id, q.updated_at, q.user_id, q.notification_id, q.notification_type, q.conversation_id, q.attempts,
+    q.recipient_email, q.subject, q.content, COALESCE(q.message_created_at, q.queued_at) AS message_created_at;
+
+-- name: delete-claimed-notification-email
+DELETE FROM notification_email_queue WHERE id = $1 AND updated_at = $2;
+
+-- name: retry-claimed-notification-email
+UPDATE notification_email_queue
+SET send_at = $2, attempts = attempts + 1, updated_at = now()
+WHERE id = $1 AND updated_at = $3;
diff --git a/internal/setting/setting.go b/internal/setting/setting.go
index c062c1e0..97aac98a 100644
--- a/internal/setting/setting.go
+++ b/internal/setting/setting.go
@@ -53,7 +53,8 @@ func New(opts Opts) (*Manager, error) {
 
 	// Fields that need encryption.
 	encryptedFields := map[string]bool{
-		"notification.email.password": true,
+		"notification.email.password":         true,
+		"notification.push.vapid_private_key": true,
 	}
 
 	return &Manager{
diff --git a/internal/sla/queries.sql b/internal/sla/queries.sql
index c360c4a6..fabff9d7 100644
--- a/internal/sla/queries.sql
+++ b/internal/sla/queries.sql
@@ -264,6 +264,12 @@ SET processed_at = NOW(),
       updated_at = NOW()
 WHERE id = $1;
 
+-- name: update-notification-recipients
+UPDATE scheduled_sla_notifications
+SET recipients = $2,
+      updated_at = NOW()
+WHERE id = $1;
+
 -- name: insert-next-response-sla-event
 INSERT INTO sla_events (applied_sla_id, sla_policy_id, type, deadline_at)
 SELECT $1, $2, 'next_response', $3
diff --git a/internal/sla/sla.go b/internal/sla/sla.go
index a4fbea75..63427e0b 100644
--- a/internal/sla/sla.go
+++ b/internal/sla/sla.go
@@ -16,7 +16,6 @@ import (
 	cstatusmodels "github.com/abhinavxd/libredesk/internal/conversation/status/models"
 	"github.com/abhinavxd/libredesk/internal/dbutil"
 	"github.com/abhinavxd/libredesk/internal/envelope"
-	notifier "github.com/abhinavxd/libredesk/internal/notification"
 	nmodels "github.com/abhinavxd/libredesk/internal/notification/models"
 	"github.com/abhinavxd/libredesk/internal/sla/models"
 	"github.com/abhinavxd/libredesk/internal/stringutil"
@@ -57,6 +56,16 @@ var metricLabels = map[string]string{
 	MetricNextResponse:  "Next response",
 }
 
+var metricNotificationTypes = map[string]struct{ warning, breach nmodels.NotificationType }{
+	MetricFirstResponse: {nmodels.NotificationTypeSLAFirstResponseWarn, nmodels.NotificationTypeSLAFirstResponseBreach},
+	MetricNextResponse:  {nmodels.NotificationTypeSLANextResponseWarn, nmodels.NotificationTypeSLANextResponseBreach},
+	MetricResolution:    {nmodels.NotificationTypeSLAResolutionWarn, nmodels.NotificationTypeSLAResolutionBreach},
+}
+
+type notificationDispatcher interface {
+	Send(nmodels.Notification) ([]nmodels.DeliveryResult, error)
+}
+
 type Manager struct {
 	q                queries
 	lo               *logf.Logger
@@ -66,7 +75,7 @@ type Manager struct {
 	appSettingsStore appSettingsStore
 	businessHrsStore businessHrsStore
 	template         *template.Manager
-	dispatcher       *notifier.Dispatcher
+	dispatcher       notificationDispatcher
 	wg               sync.WaitGroup
 	opts             Opts
 }
@@ -128,6 +137,7 @@ type queries struct {
 	LockConversations                 *sqlx.Stmt `query:"lock-conversations"`
 	CloseSettledAppliedSLAs           *sqlx.Stmt `query:"close-settled-applied-slas"`
 	UpdateSLANotificationProcessed    *sqlx.Stmt `query:"update-notification-processed"`
+	UpdateSLANotificationRecipients   *sqlx.Stmt `query:"update-notification-recipients"`
 	UpdateSLAEventAsBreached          *sqlx.Stmt `query:"update-sla-event-as-breached"`
 	UpdateSLAEventAsMet               *sqlx.Stmt `query:"update-sla-event-as-met"`
 	SetLatestSLAEventMetAt            *sqlx.Stmt `query:"set-latest-sla-event-met-at"`
@@ -143,7 +153,7 @@ func New(
 	businessHrsStore businessHrsStore,
 	template *template.Manager,
 	userStore userStore,
-	dispatcher *notifier.Dispatcher,
+	dispatcher notificationDispatcher,
 ) (*Manager, error) {
 	var q queries
 	if err := dbutil.ScanSQLFile(
@@ -615,7 +625,7 @@ func (m *Manager) SendNotification(scheduledNotification models.ScheduledSLANoti
 	}
 
 	// Send to all recipients (agents).
-	for _, recipientS := range scheduledNotification.Recipients {
+	for i, recipientS := range scheduledNotification.Recipients {
 		// Check if SLA is already met, if met mark notification as processed and return.
 		switch scheduledNotification.Metric {
 		case MetricFirstResponse:
@@ -662,18 +672,12 @@ func (m *Manager) SendNotification(scheduledNotification models.ScheduledSLANoti
 
 		// Recipient not found?
 		if recipientID == 0 {
-			if _, err := m.q.UpdateSLANotificationProcessed.Exec(scheduledNotification.ID); err != nil {
-				m.lo.Error("error marking notification as processed", "error", err)
-			}
 			continue
 		}
 
 		agent, err := m.userStore.GetAgent(recipientID, "")
 		if err != nil {
 			m.lo.Error("error fetching agent for SLA notification", "recipient_id", recipientID, "error", err)
-			if _, err := m.q.UpdateSLANotificationProcessed.Exec(scheduledNotification.ID); err != nil {
-				m.lo.Error("error marking notification as processed", "error", err)
-			}
 			continue
 		}
 
@@ -757,12 +761,9 @@ func (m *Manager) SendNotification(scheduledNotification models.ScheduledSLANoti
 			continue
 		}
 
-		// Determine notification type for in-app notification.
-		var notifType nmodels.NotificationType
+		notifType := metricNotificationTypes[scheduledNotification.Metric].warning
 		if scheduledNotification.NotificationType == NotificationTypeBreach {
-			notifType = nmodels.NotificationTypeSLABreach
-		} else {
-			notifType = nmodels.NotificationTypeSLAWarning
+			notifType = metricNotificationTypes[scheduledNotification.Metric].breach
 		}
 
 		notificationTitle := m.i18n.Ts("notification.slaAlert",
@@ -777,26 +778,31 @@ func (m *Manager) SendNotification(scheduledNotification models.ScheduledSLANoti
 			notificationBody = m.i18n.Ts("notification.slaDueIn", "duration", dueIn)
 		}
 
-		// Send notification via dispatcher (handles in-app, WebSocket, and email).
-		m.dispatcher.Send(notifier.Notification{
-			Type:             notifType,
-			RecipientIDs:     []int{recipientID},
+		if _, err := m.dispatcher.Send(nmodels.Notification{
+			Type: notifType,
+			Recipients: []nmodels.Recipient{{
+				UserID: recipientID,
+				Email: &nmodels.EmailNotification{
+					Recipient: agent.Email.String,
+					Subject:   subject,
+					Content:   content,
+				},
+			}},
 			Title:            notificationTitle,
 			Body:             null.StringFrom(notificationBody),
 			ConversationID:   null.IntFrom(appliedSLA.ConversationID),
 			ConversationUUID: appliedSLA.ConversationUUID,
-			Email: &notifier.EmailNotification{
-				Recipients: []string{agent.Email.String},
-				Subject:    subject,
-				Content:    content,
-			},
-		})
-
-		// Mark the notification as processed.
-		if _, err := m.q.UpdateSLANotificationProcessed.Exec(scheduledNotification.ID); err != nil {
-			m.lo.Error("error marking notification as processed", "error", err)
+		}); err != nil {
+			// The retry must not re-notify recipients that already got this alert.
+			if _, uerr := m.q.UpdateSLANotificationRecipients.Exec(scheduledNotification.ID, scheduledNotification.Recipients[i:]); uerr != nil {
+				m.lo.Error("error updating pending notification recipients", "scheduled_notification_id", scheduledNotification.ID, "error", uerr)
+			}
+			return fmt.Errorf("sending SLA notification: %w", err)
 		}
 	}
+	if _, err := m.q.UpdateSLANotificationProcessed.Exec(scheduledNotification.ID); err != nil {
+		m.lo.Error("error marking notification as processed", "error", err)
+	}
 	return nil
 }
 
diff --git a/internal/sla/sla_test.go b/internal/sla/sla_test.go
index eaaed6d2..ca959887 100644
--- a/internal/sla/sla_test.go
+++ b/internal/sla/sla_test.go
@@ -3,15 +3,19 @@ package sla
 import (
 	"context"
 	"database/sql"
+	"errors"
 	"fmt"
+	htmltemplate "html/template"
 	"sync"
 	"sync/atomic"
 	"testing"
 	"time"
 
 	bmodels "github.com/abhinavxd/libredesk/internal/business_hours/models"
+	nmodels "github.com/abhinavxd/libredesk/internal/notification/models"
 	"github.com/abhinavxd/libredesk/internal/sla/models"
 	tmodels "github.com/abhinavxd/libredesk/internal/team/models"
+	"github.com/abhinavxd/libredesk/internal/template"
 	"github.com/abhinavxd/libredesk/internal/testutil"
 	umodels "github.com/abhinavxd/libredesk/internal/user/models"
 	"github.com/jmoiron/sqlx"
@@ -29,6 +33,12 @@ type stubAppSettingsStore struct{}
 
 type stubBusinessHrsStore struct{ bh bmodels.BusinessHours }
 
+type stubNotificationDispatcher struct {
+	err     error
+	succeed int
+	sentTo  []int
+}
+
 type appliedRow struct {
 	ID          int          `db:"id"`
 	Status      string       `db:"status"`
@@ -52,6 +62,16 @@ func (s stubBusinessHrsStore) Get(id int) (bmodels.BusinessHours, error) {
 	return s.bh, nil
 }
 
+func (s *stubNotificationDispatcher) Send(n nmodels.Notification) ([]nmodels.DeliveryResult, error) {
+	if len(s.sentTo) >= s.succeed {
+		return nil, s.err
+	}
+	for _, recipient := range n.Recipients {
+		s.sentTo = append(s.sentTo, recipient.UserID)
+	}
+	return nil, nil
+}
+
 func TestApplySLASetsDeadlinesAndConversation(t *testing.T) {
 	m, db := newTestManager(t)
 	policy := insertPolicy(t, db, "p1", "1h", "2h", "")
@@ -474,6 +494,68 @@ func TestSendNotificationSkipsMetMetric(t *testing.T) {
 	}
 }
 
+func TestSendNotificationKeepsPendingWhenDispatchFails(t *testing.T) {
+	m, db := newTestManager(t)
+	policy := insertPolicy(t, db, "p1", "1h", "2h", "")
+	conv := insertConversation(t, db, "c1")
+	applySLA(t, m, conv, policy)
+	appliedID := fetchApplied(t, db, conv)[0].ID
+	db.MustExec(`INSERT INTO scheduled_sla_notifications (applied_sla_id, metric, notification_type, recipients, send_at) VALUES ($1, 'first_response', 'warning', '{1}', NOW() - INTERVAL '1 min')`, appliedID)
+
+	var pending []models.ScheduledSLANotification
+	if err := m.q.GetScheduledSLANotifications.Select(&pending); err != nil {
+		t.Fatal(err)
+	}
+	if len(pending) != 1 {
+		t.Fatalf("pending notifications = %d, want 1", len(pending))
+	}
+	renderer, err := template.New(m.lo, db, nil, nil, htmltemplate.FuncMap{"RootURL": func() string { return "http://localhost" }}, m.i18n)
+	if err != nil {
+		t.Fatal(err)
+	}
+	dispatchErr := errors.New("preference lookup failed")
+	m.template = renderer
+	m.dispatcher = &stubNotificationDispatcher{err: dispatchErr}
+
+	if err := m.SendNotification(pending[0]); !errors.Is(err, dispatchErr) {
+		t.Fatalf("error = %v, want %v", err, dispatchErr)
+	}
+	if queryInt(t, db, `SELECT COUNT(*) FROM scheduled_sla_notifications WHERE id = $1 AND processed_at IS NOT NULL`, pending[0].ID) != 0 {
+		t.Fatal("failed notification was marked processed")
+	}
+}
+
+func TestSendNotificationRetriesOnlyUndeliveredRecipients(t *testing.T) {
+	m, db := newTestManager(t)
+	policy := insertPolicy(t, db, "p1", "1h", "2h", "")
+	conv := insertConversation(t, db, "c1")
+	applySLA(t, m, conv, policy)
+	appliedID := fetchApplied(t, db, conv)[0].ID
+	db.MustExec(`INSERT INTO scheduled_sla_notifications (applied_sla_id, metric, notification_type, recipients, send_at) VALUES ($1, 'first_response', 'warning', '{1,2,3}', NOW() - INTERVAL '1 min')`, appliedID)
+
+	var pending []models.ScheduledSLANotification
+	if err := m.q.GetScheduledSLANotifications.Select(&pending); err != nil {
+		t.Fatal(err)
+	}
+	renderer, err := template.New(m.lo, db, nil, nil, htmltemplate.FuncMap{"RootURL": func() string { return "http://localhost" }}, m.i18n)
+	if err != nil {
+		t.Fatal(err)
+	}
+	dispatchErr := errors.New("preference lookup failed")
+	m.template = renderer
+	m.dispatcher = &stubNotificationDispatcher{err: dispatchErr, succeed: 1}
+
+	if err := m.SendNotification(pending[0]); !errors.Is(err, dispatchErr) {
+		t.Fatalf("error = %v, want %v", err, dispatchErr)
+	}
+	if got := queryStr(t, db, `SELECT array_to_string(recipients, ',') FROM scheduled_sla_notifications WHERE id = $1`, pending[0].ID); got != "2,3" {
+		t.Fatalf("recipients = %q, want \"2,3\"", got)
+	}
+	if queryInt(t, db, `SELECT COUNT(*) FROM scheduled_sla_notifications WHERE id = $1 AND processed_at IS NOT NULL`, pending[0].ID) != 0 {
+		t.Fatal("partially delivered notification was marked processed")
+	}
+}
+
 func TestPolicyMetricCombinations(t *testing.T) {
 	cases := []struct {
 		name           string
diff --git a/internal/template/render.go b/internal/template/render.go
index 25b56af7..9c72bd99 100644
--- a/internal/template/render.go
+++ b/internal/template/render.go
@@ -3,19 +3,23 @@ package template
 import (
 	"bytes"
 	"fmt"
+	htmltemplate "html/template"
 	"strings"
-	"text/template"
+	texttemplate "text/template"
 
 	"github.com/valyala/fasthttp"
 )
 
 const (
 	// Built-in templates names stored in the database.
-	TmplConversationAssigned = "Conversation assigned"
-	TmplSLABreachWarning     = "SLA breach warning"
-	TmplSLABreached          = "SLA breached"
-	TmplMentioned            = "Mentioned in conversation"
-	TmplCSATRequest          = "CSAT request"
+	TmplConversationAssigned  = "Conversation assigned"
+	TmplSLABreachWarning      = "SLA breach warning"
+	TmplSLABreached           = "SLA breached"
+	TmplMentioned             = "Mentioned in conversation"
+	TmplCSATRequest           = "CSAT request"
+	TmplNewReply              = "New reply from contact"
+	TmplNewReplyParticipating = "New reply on participating conversation"
+	TmplConversationReopened  = "Conversation reopened"
 
 	// Built-in templates fetched from memory stored in `static` directory.
 	TmplResetPassword = "reset-password"
@@ -29,7 +33,7 @@ const (
 // RenderString renders Go template variables in the given content string
 // without wrapping it in the base email template. Returns original content on any error.
 func (m *Manager) RenderString(data any, content string) string {
-	t, err := template.New("content").Funcs(m.funcMap).Parse(content)
+	t, err := htmltemplate.New("content").Funcs(m.funcMap).Parse(content)
 	if err != nil {
 		return content
 	}
@@ -64,12 +68,12 @@ func (m *Manager) RenderEmailWithTemplate(data any, content string) (string, err
 		defaultTmpl.Body = `{{ template "content" . }}`
 	}
 
-	baseTemplate, err := template.New(TmplBase).Funcs(m.funcMap).Parse(defaultTmpl.Body)
+	baseTemplate, err := htmltemplate.New(TmplBase).Funcs(m.funcMap).Parse(defaultTmpl.Body)
 	if err != nil {
 		return "", fmt.Errorf("parsing base template: %w", err)
 	}
 
-	contentTemplate, err := template.New(TmplContent).Funcs(m.funcMap).Parse(content)
+	contentTemplate, err := htmltemplate.New(TmplContent).Funcs(m.funcMap).Parse(content)
 	if err != nil {
 		return "", fmt.Errorf("parsing content template: %w", err)
 	}
@@ -99,7 +103,7 @@ func (m *Manager) RenderStoredEmailTemplate(name string, data any) (string, stri
 
 	executeSubjectTemplate := func(subject string) (string, error) {
 		var sb strings.Builder
-		subjectTmpl, err := template.New("subject").Funcs(m.funcMap).Parse(subject)
+		subjectTmpl, err := texttemplate.New("subject").Funcs(m.funcMap).Parse(subject)
 		if err != nil {
 			return "", fmt.Errorf("parsing subject template: %w", err)
 		}
@@ -118,12 +122,12 @@ func (m *Manager) RenderStoredEmailTemplate(name string, data any) (string, stri
 		defaultTmpl.Body = `{{ template "content" . }}`
 	}
 
-	baseTemplate, err := template.New(TmplBase).Funcs(m.funcMap).Parse(defaultTmpl.Body)
+	baseTemplate, err := htmltemplate.New(TmplBase).Funcs(m.funcMap).Parse(defaultTmpl.Body)
 	if err != nil {
 		return "", "", fmt.Errorf("parsing base template: %w", err)
 	}
 
-	contentTemplate, err := template.New(TmplContent).Funcs(m.funcMap).Parse(tmpl.Body)
+	contentTemplate, err := htmltemplate.New(TmplContent).Funcs(m.funcMap).Parse(tmpl.Body)
 	if err != nil {
 		return "", "", fmt.Errorf("parsing content template: %w", err)
 	}
diff --git a/internal/template/render_test.go b/internal/template/render_test.go
new file mode 100644
index 00000000..bbf18730
--- /dev/null
+++ b/internal/template/render_test.go
@@ -0,0 +1,68 @@
+package template
+
+import (
+	htmltemplate "html/template"
+	"strings"
+	"testing"
+
+	"github.com/abhinavxd/libredesk/internal/testutil"
+	"github.com/zerodha/logf"
+)
+
+func TestRenderStringEscapesDataAndPreservesTemplateMarkup(t *testing.T) {
+	m := &Manager{funcMap: htmltemplate.FuncMap{}}
+	content := m.RenderString(map[string]any{
+		"Contact": map[string]any{"FullName": "<b>attacker</b>"},
+	}, `<p>Hi {{ .Contact.FullName }}</p>`)
+
+	if !strings.Contains(content, "<p>Hi &lt;b&gt;attacker&lt;/b&gt;</p>") {
+		t.Fatalf("unexpected content: %s", content)
+	}
+}
+
+func TestRenderEmailWithTemplateEscapesDataAndPreservesTemplateMarkup(t *testing.T) {
+	db := testutil.NewDB(t, "outgoing_email_template_escape")
+	lo := logf.New(logf.Opts{})
+	m, err := New(&lo, db, nil, nil, htmltemplate.FuncMap{}, testutil.NewI18n(t))
+	if err != nil {
+		t.Fatal(err)
+	}
+
+	content, err := m.RenderEmailWithTemplate(map[string]any{
+		"Contact": map[string]any{"FullName": "<b>attacker</b>"},
+	}, `<p>Hi {{ .Contact.FullName }}</p>`)
+	if err != nil {
+		t.Fatal(err)
+	}
+	if !strings.Contains(content, "<p>Hi &lt;b&gt;attacker&lt;/b&gt;</p>") {
+		t.Fatalf("unexpected content: %s", content)
+	}
+}
+
+func TestRenderStoredEmailTemplateEscapesUntrustedHTML(t *testing.T) {
+	db := testutil.NewDB(t, "stored_email_template_escape")
+	lo := logf.New(logf.Opts{})
+	m, err := New(&lo, db, nil, nil, htmltemplate.FuncMap{"RootURL": func() string { return "http://localhost" }}, testutil.NewI18n(t))
+	if err != nil {
+		t.Fatal(err)
+	}
+
+	content, _, err := m.RenderStoredEmailTemplate(TmplNewReply, map[string]any{
+		"Author": map[string]any{"FullName": "<b>attacker</b>"},
+		"Conversation": map[string]any{
+			"ReferenceNumber": 42,
+			"Subject":         "<i>subject</i>",
+			"UUID":            "conversation-uuid",
+		},
+		"Message": map[string]any{"Content": htmltemplate.HTML("<strong>safe message</strong>")},
+	})
+	if err != nil {
+		t.Fatal(err)
+	}
+	if !strings.Contains(content, "&lt;b&gt;attacker&lt;/b&gt;") || !strings.Contains(content, "&lt;i&gt;subject&lt;/i&gt;") {
+		t.Fatalf("untrusted HTML was not escaped: %s", content)
+	}
+	if !strings.Contains(content, "<strong>safe message</strong>") {
+		t.Fatalf("trusted message HTML was escaped: %s", content)
+	}
+}
diff --git a/schema.sql b/schema.sql
index f52ee88a..dea80277 100644
--- a/schema.sql
+++ b/schema.sql
@@ -22,7 +22,8 @@ DROP TYPE IF EXISTS "sla_metric" CASCADE; CREATE TYPE "sla_metric" AS ENUM ('fir
 DROP TYPE IF EXISTS "sla_notification_type" CASCADE; CREATE TYPE "sla_notification_type" AS ENUM ('warning', 'breach');
 DROP TYPE IF EXISTS "activity_log_type" CASCADE; CREATE TYPE "activity_log_type" AS ENUM ('agent_login', 'agent_logout', 'agent_away', 'agent_away_reassigned', 'agent_online', 'agent_password_set', 'agent_role_permissions_changed', 'contact_deleted', 'contact_data_exported');
 DROP TYPE IF EXISTS "macro_visible_when" CASCADE; CREATE TYPE "macro_visible_when" AS ENUM ('replying', 'starting_conversation', 'adding_private_note');
-DROP TYPE IF EXISTS "user_notification_type" CASCADE; CREATE TYPE "user_notification_type" AS ENUM ('mention', 'assignment', 'sla_warning', 'sla_breach');
+DROP TYPE IF EXISTS "user_notification_type" CASCADE; CREATE TYPE "user_notification_type" AS ENUM ('mention', 'assignment', 'sla_warning', 'sla_breach', 'new_reply', 'new_reply_participating', 'sla_first_response_warning', 'sla_first_response_breach', 'sla_next_response_warning', 'sla_next_response_breach', 'sla_resolution_warning', 'sla_resolution_breach', 'conversation_reopened');
+DROP TYPE IF EXISTS "notification_channel" CASCADE; CREATE TYPE "notification_channel" AS ENUM ('in_app', 'email', 'push');
 DROP TYPE IF EXISTS "conversation_status_category" CASCADE; CREATE TYPE "conversation_status_category" AS ENUM ('open', 'waiting', 'resolved');
 DROP TYPE IF EXISTS "ai_knowledge_type" CASCADE; CREATE TYPE "ai_knowledge_type" AS ENUM ('snippet');
 DROP TYPE IF EXISTS "webhook_event" CASCADE; CREATE TYPE webhook_event AS ENUM (
@@ -953,6 +954,50 @@ CREATE INDEX index_user_notifications_on_user_id_is_read ON user_notifications(u
 CREATE INDEX index_user_notifications_on_created_at ON user_notifications(created_at);
 CREATE INDEX index_user_notifications_on_conversation_id ON user_notifications(conversation_id);
 
+DROP TABLE IF EXISTS user_notification_preferences CASCADE;
+CREATE TABLE user_notification_preferences (
+	id SERIAL PRIMARY KEY,
+	created_at TIMESTAMPTZ DEFAULT NOW(),
+	updated_at TIMESTAMPTZ DEFAULT NOW(),
+	user_id BIGINT REFERENCES users(id) ON DELETE CASCADE ON UPDATE CASCADE NOT NULL,
+	notification_type user_notification_type NOT NULL,
+	channel notification_channel NOT NULL,
+	enabled BOOLEAN NOT NULL DEFAULT TRUE,
+	CONSTRAINT constraint_uniq_user_notification_preferences UNIQUE (user_id, notification_type, channel)
+);
+
+DROP TABLE IF EXISTS notification_push_subscriptions CASCADE;
+CREATE TABLE notification_push_subscriptions (
+	id BIGSERIAL PRIMARY KEY,
+	created_at TIMESTAMPTZ DEFAULT NOW(),
+	updated_at TIMESTAMPTZ DEFAULT NOW(),
+	user_id BIGINT REFERENCES users(id) ON DELETE CASCADE ON UPDATE CASCADE NOT NULL,
+	endpoint TEXT NOT NULL UNIQUE,
+	p256dh TEXT NOT NULL,
+	auth TEXT NOT NULL
+);
+CREATE INDEX index_notification_push_subscriptions_on_user_id ON notification_push_subscriptions(user_id);
+
+DROP TABLE IF EXISTS notification_email_queue CASCADE;
+CREATE TABLE notification_email_queue (
+	id BIGSERIAL PRIMARY KEY,
+	created_at TIMESTAMPTZ DEFAULT NOW(),
+	updated_at TIMESTAMPTZ DEFAULT NOW(),
+	user_id BIGINT REFERENCES users(id) ON DELETE CASCADE ON UPDATE CASCADE NOT NULL,
+	notification_id BIGINT REFERENCES user_notifications(id) ON DELETE CASCADE ON UPDATE CASCADE,
+	notification_type user_notification_type NOT NULL,
+	conversation_id BIGINT REFERENCES conversations(id) ON DELETE CASCADE ON UPDATE CASCADE,
+	recipient_email TEXT NOT NULL,
+	subject TEXT NOT NULL,
+	content TEXT NOT NULL,
+	queued_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+	message_created_at TIMESTAMPTZ,
+	send_at TIMESTAMPTZ NOT NULL,
+	attempts INTEGER NOT NULL DEFAULT 0,
+	CONSTRAINT constraint_uniq_notification_email_queue UNIQUE (user_id, notification_type, conversation_id)
+);
+CREATE INDEX index_notification_email_queue_on_send_at ON notification_email_queue(send_at);
+
 INSERT INTO ai_providers
 ("name", provider, type, config, is_default)
 VALUES
@@ -996,7 +1041,9 @@ VALUES
 	('notification.email.hello_hostname', '""'::jsonb),
     ('notification.email.email_address', '"admin@yourcompany.com"'::jsonb),
     ('notification.email.max_msg_retries', '3'::jsonb),
-    ('notification.email.enabled', 'false'::jsonb);
+    ('notification.email.enabled', 'false'::jsonb),
+    ('notification.push.vapid_public_key', '""'::jsonb),
+    ('notification.push.vapid_private_key', '""'::jsonb);
 
 -- Default conversation priorities
 INSERT INTO conversation_priorities (name) VALUES
@@ -1053,6 +1100,75 @@ VALUES('email_notification'::template_type, '
 
 ', false, 'Conversation assigned', 'New conversation assigned to you', true);
 
+INSERT INTO templates
+("type", body, is_default, "name", subject, is_builtin)
+VALUES('email_notification'::template_type, '
+<p>{{ .Author.FullName }} replied to a conversation assigned to you:</p>
+
+<div>
+    Reference number: {{ .Conversation.ReferenceNumber }} <br>
+    Subject: {{ .Conversation.Subject }}
+</div>
+
+<blockquote>{{ .Message.Content }}</blockquote>
+
+<p>
+    <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
+</p>
+
+<div>
+    Best regards,<br>
+    Libredesk
+</div>
+
+', false, 'New reply from contact', 'New reply on conversation #{{ .Conversation.ReferenceNumber }}', true);
+
+INSERT INTO templates
+("type", body, is_default, "name", subject, is_builtin)
+VALUES('email_notification'::template_type, '
+<p>{{ .Author.FullName }} replied to a conversation you are participating in:</p>
+
+<div>
+    Reference number: {{ .Conversation.ReferenceNumber }} <br>
+    Subject: {{ .Conversation.Subject }}
+</div>
+
+<blockquote>{{ .Message.Content }}</blockquote>
+
+<p>
+    <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
+</p>
+
+<div>
+    Best regards,<br>
+    Libredesk
+</div>
+
+', false, 'New reply on participating conversation', 'New reply on conversation #{{ .Conversation.ReferenceNumber }}', true);
+
+INSERT INTO templates
+("type", body, is_default, "name", subject, is_builtin)
+VALUES('email_notification'::template_type, '
+<p>{{ .Author.FullName }} replied and reopened a conversation assigned to you:</p>
+
+<div>
+    Reference number: {{ .Conversation.ReferenceNumber }} <br>
+    Subject: {{ .Conversation.Subject }}
+</div>
+
+<blockquote>{{ .Message.Content }}</blockquote>
+
+<p>
+    <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
+</p>
+
+<div>
+    Best regards,<br>
+    Libredesk
+</div>
+
+', false, 'Conversation reopened', 'Conversation #{{ .Conversation.ReferenceNumber }} reopened', true);
+
 INSERT INTO templates
 ("type", body, is_default, "name", subject, is_builtin)
 VALUES (

From f07ccd79708b40aa80971b85125aa943037270ed Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 15 Sep 2026 17:54:02 +0530
Subject: [PATCH 059/178] prevent overlapping notification preference saves

---
 .../NotificationPreferences.test.js           | 30 +++++++++++++++++++
 .../notifications/NotificationPreferences.vue | 13 +++++++-
 2 files changed, 42 insertions(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js
index 88df5723..092fd6de 100644
--- a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js
+++ b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js
@@ -57,6 +57,36 @@ describe('notification preferences', () => {
     expect(savePreferences).toHaveBeenCalledWith([{ notification_type: 'new_reply', channel: 'email', enabled: false }])
   })
 
+  it('prevents overlapping saves for the same preference', async () => {
+    let finishSave
+    savePreferences.mockImplementationOnce(
+      () =>
+        new Promise((resolve) => {
+          finishSave = resolve
+        })
+    )
+    await mount()
+    const switches = root.querySelectorAll('button')
+    const inApp = switches[1]
+    const email = switches[2]
+
+    email.click()
+    email.click()
+    await nextTick()
+
+    expect(savePreferences).toHaveBeenCalledTimes(1)
+    expect(email.disabled).toBe(true)
+    expect(inApp.disabled).toBe(false)
+
+    inApp.click()
+    await settle()
+    expect(savePreferences).toHaveBeenCalledTimes(2)
+
+    finishSave({})
+    await settle()
+    expect(email.disabled).toBe(false)
+  })
+
   it('leaves the push subscription to the app shell', async () => {
     await mount()
     expect(root.textContent).toContain('notification.type.newReply')
diff --git a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
index b1ea9d86..e6287a3d 100644
--- a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
+++ b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
@@ -43,7 +43,10 @@
           <div v-for="channel in channels" :key="channel.key" class="w-20 flex justify-center">
             <Switch
               :checked="row[channel.key]"
-              :disabled="channel.key === 'email' && !emailEnabled"
+              :disabled="
+                (channel.key === 'email' && !emailEnabled) ||
+                pendingUpdates.has(preferenceKey(row.type, channel.key))
+              "
               :aria-label="
                 $t('notification.channelToggleLabel', {
                   channel: $t(channel.labelKey),
@@ -74,6 +77,7 @@ const emitter = useEmitter()
 const rows = ref([])
 const emailEnabled = ref(true)
 const vapidPublicKey = ref('')
+const pendingUpdates = ref(new Set())
 const pushNotifications = usePushNotifications()
 
 const channels = [
@@ -97,6 +101,7 @@ const typeLabels = {
 }
 
 const typeLabel = (type) => (typeLabels[type] ? t(typeLabels[type]) : type)
+const preferenceKey = (type, channel) => `${type}:${channel}`
 
 const fetchPreferences = async () => {
   try {
@@ -146,8 +151,12 @@ const updateBrowserPush = async (value) => {
 }
 
 const update = async (row, channel, value) => {
+  const key = preferenceKey(row.type, channel)
+  if (pendingUpdates.value.has(key)) return
+
   const previous = row[channel]
   row[channel] = value
+  pendingUpdates.value.add(key)
   try {
     await api.updateNotificationPreferences([
       { notification_type: row.type, channel, enabled: value }
@@ -161,6 +170,8 @@ const update = async (row, channel, value) => {
       variant: 'destructive',
       description: handleHTTPError(error).message
     })
+  } finally {
+    pendingUpdates.value.delete(key)
   }
 }
 

From 6655a9fcb044aff49892f2d1592258ae3be6a5e2 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 16 Sep 2026 00:16:12 +0530
Subject: [PATCH 060/178] fix reply alerts and browser push subscriptions

Send every reply alert while batching email for five minutes. Keep shared browser subscriptions tied to the signed-in agent.
---
 cmd/init.go                                   |   2 -
 cmd/main.go                                   |   3 +-
 cmd/user_notifications.go                     |   5 +
 frontend/apps/main/src/App.vue                |   2 +-
 .../src/composables/usePushNotifications.js   |   6 +-
 .../composables/usePushNotifications.test.js  |  15 +-
 frontend/public/sw.js                         |  10 +-
 internal/conversation/conversation.go         | 322 ++++--------------
 internal/conversation/notification_test.go    | 192 ++---------
 internal/conversation/queries.sql             |   7 -
 internal/migrations/v2.9.0.go                 |   1 +
 internal/notification/channels/push.go        |   6 +-
 internal/notification/email_queue.go          |  27 +-
 internal/notification/email_queue_test.go     | 110 +-----
 internal/notification/models/models.go        |   2 +-
 internal/notification/push.go                 |  67 +---
 internal/notification/push_store.go           |  57 ++++
 internal/notification/queries.sql             |   2 +-
 schema.sql                                    |   2 +-
 19 files changed, 218 insertions(+), 620 deletions(-)
 create mode 100644 internal/notification/push_store.go

diff --git a/cmd/init.go b/cmd/init.go
index 612f0a6e..a2412d96 100644
--- a/cmd/init.go
+++ b/cmd/init.go
@@ -302,7 +302,6 @@ func initConversations(
 	template *tmpl.Manager,
 	webhook *webhook.Manager,
 	dispatcher *notifier.Dispatcher,
-	rdb *redis.Client,
 ) *conversation.Manager {
 	continuityConfig := &conversation.ContinuityConfig{}
 	if ko.Exists("conversation.continuity_scan_interval") {
@@ -311,7 +310,6 @@ func initConversations(
 
 	c, err := conversation.New(hub, i18n, sla, status, priority, inboxStore, userStore, teamStore, mediaStore, settings, csat, automationEngine, template, webhook, dispatcher, conversation.Opts{
 		DB:                       db,
-		Redis:                    rdb,
 		Lo:                       initLogger("conversation_manager"),
 		OutgoingMessageQueueSize: ko.MustInt("message.outgoing_queue_size"),
 		IncomingMessageQueueSize: ko.MustInt("message.incoming_queue_size"),
diff --git a/cmd/main.go b/cmd/main.go
index f76ae697..f6719125 100644
--- a/cmd/main.go
+++ b/cmd/main.go
@@ -258,7 +258,7 @@ func main() {
 		automation                  = initAutomationEngine(db, i18n)
 		ai                          = initAI(ctx, db, i18n, ssrfControl)
 		sla                         = initSLA(db, team, settings, businessHours, template, user, i18n, notifDispatcher)
-		conversation                = initConversations(i18n, sla, status, priority, wsHub, db, inbox, user, team, media, settings, csat, automation, template, webhook, notifDispatcher, rdb)
+		conversation                = initConversations(i18n, sla, status, priority, wsHub, db, inbox, user, team, media, settings, csat, automation, template, webhook, notifDispatcher)
 		aiAgent                     = initAIAgent(db, i18n, ai, conversation, media, settings, user, notifier, rdb)
 		helpCenter                  = initHelpCenter(db, i18n, ai)
 		autoassigner                = initAutoAssigner(team, user, conversation)
@@ -266,7 +266,6 @@ func main() {
 	)
 
 	wsHub.SetConversationStore(conversation)
-	notificationEmailQueue.SetConversationStore(conversation)
 	automation.SetConversationStore(conversation)
 	systemUser, err := user.GetSystemUser()
 	if err != nil {
diff --git a/cmd/user_notifications.go b/cmd/user_notifications.go
index f086d85f..3f39d96b 100644
--- a/cmd/user_notifications.go
+++ b/cmd/user_notifications.go
@@ -109,10 +109,15 @@ func handleGetNotificationPreferences(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
+	pushEndpoints, err := app.pushNotification.Endpoints(auser.ID)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
 	return r.SendEnvelope(map[string]any{
 		"preferences":      prefs,
 		"email_enabled":    ko.Bool("notification.email.enabled"),
 		"vapid_public_key": app.pushNotification.PublicKey(),
+		"push_endpoints":   pushEndpoints,
 	})
 }
 
diff --git a/frontend/apps/main/src/App.vue b/frontend/apps/main/src/App.vue
index c306a44f..5012311b 100644
--- a/frontend/apps/main/src/App.vue
+++ b/frontend/apps/main/src/App.vue
@@ -223,7 +223,7 @@ const initStores = async () => {
 
 const refreshPushSubscription = async () => {
   const { data } = await api.getNotificationPreferences()
-  await pushNotifications.refresh(data.data.vapid_public_key)
+  await pushNotifications.refresh(data.data.vapid_public_key, data.data.push_endpoints)
 }
 
 const createView = () => {
diff --git a/frontend/apps/main/src/composables/usePushNotifications.js b/frontend/apps/main/src/composables/usePushNotifications.js
index a0aff321..642c9035 100644
--- a/frontend/apps/main/src/composables/usePushNotifications.js
+++ b/frontend/apps/main/src/composables/usePushNotifications.js
@@ -34,12 +34,12 @@ export const createPushNotifications = (apiClient = api, browser = defaultBrowse
     })
   }
 
-  const refresh = async (vapidPublicKey) => {
+  const refresh = async (vapidPublicKey, savedEndpoints = []) => {
     if (!supported.value || !vapidPublicKey) return
     const worker = await registerWorker()
     const subscription = await worker.pushManager.getSubscription()
-    enabled.value = Boolean(subscription)
-    if (subscription) await save(subscription)
+    enabled.value = Boolean(subscription) && savedEndpoints.includes(subscription.endpoint)
+    if (enabled.value) await save(subscription)
   }
 
   const enable = async (vapidPublicKey) => {
diff --git a/frontend/apps/main/src/composables/usePushNotifications.test.js b/frontend/apps/main/src/composables/usePushNotifications.test.js
index 221cfca7..827b4761 100644
--- a/frontend/apps/main/src/composables/usePushNotifications.test.js
+++ b/frontend/apps/main/src/composables/usePushNotifications.test.js
@@ -49,7 +49,7 @@ describe('createPushNotifications', () => {
     const api = { createPushSubscription: vi.fn().mockResolvedValue({}) }
     const state = createPushNotifications(api, browser)
 
-    await state.refresh('vapid-key')
+    await state.refresh('vapid-key', [subscription.endpoint])
 
     expect(browser.Notification.requestPermission).not.toHaveBeenCalled()
     expect(api.createPushSubscription).toHaveBeenCalledWith({
@@ -60,6 +60,17 @@ describe('createPushNotifications', () => {
     expect(state.enabled.value).toBe(true)
   })
 
+  it('does not claim a browser subscription the server does not hold for this user', async () => {
+    const { browser } = makeBrowser({ permission: 'granted', subscription })
+    const api = { createPushSubscription: vi.fn().mockResolvedValue({}) }
+    const state = createPushNotifications(api, browser)
+
+    await state.refresh('vapid-key', ['https://push.example/someone-else'])
+
+    expect(api.createPushSubscription).not.toHaveBeenCalled()
+    expect(state.enabled.value).toBe(false)
+  })
+
   it('subscribes only after permission is granted', async () => {
     const { browser, pushManager } = makeBrowser({ permission: 'default' })
     browser.Notification.requestPermission.mockResolvedValue('granted')
@@ -118,7 +129,7 @@ describe('createPushNotifications', () => {
       deletePushSubscription: vi.fn().mockResolvedValue({})
     }
     const state = createPushNotifications(api, browser)
-    await state.refresh('vapid-key')
+    await state.refresh('vapid-key', [subscription.endpoint])
 
     await state.disable()
 
diff --git a/frontend/public/sw.js b/frontend/public/sw.js
index d42c00e6..1a52d7a2 100644
--- a/frontend/public/sw.js
+++ b/frontend/public/sw.js
@@ -6,6 +6,12 @@ const readPayload = (event) => {
   }
 }
 
+self.addEventListener('install', () => self.skipWaiting())
+
+self.addEventListener('activate', (event) => {
+  event.waitUntil(self.clients.claim())
+})
+
 self.addEventListener('push', (event) => {
   const notification = readPayload(event)
   if (!notification?.title) return
@@ -28,7 +34,7 @@ self.addEventListener('notificationclick', (event) => {
   event.waitUntil(self.clients.matchAll({ type: 'window', includeUncontrolled: true }).then(async (clients) => {
     const client = clients[0]
     if (!client) return self.clients.openWindow(target.href)
-    if ('navigate' in client) await client.navigate(target.href)
-    return client.focus()
+    await client.focus()
+    return client.navigate(target.href).catch(() => self.clients.openWindow(target.href))
   }))
 })
diff --git a/internal/conversation/conversation.go b/internal/conversation/conversation.go
index 42fbd58c..e2d53aba 100644
--- a/internal/conversation/conversation.go
+++ b/internal/conversation/conversation.go
@@ -43,7 +43,6 @@ import (
 	"github.com/jmoiron/sqlx/types"
 	"github.com/knadh/go-i18n"
 	"github.com/lib/pq"
-	"github.com/redis/go-redis/v9"
 	"github.com/volatiletech/null/v9"
 	"github.com/zerodha/logf"
 )
@@ -67,9 +66,7 @@ const (
 <p>
 <a href="{{ RootURL }}/inboxes/all/conversation/{{ .Conversation.UUID }}">#{{ .Conversation.ReferenceNumber }}</a>
 </p>`
-	newReplyEmailDelay     = 2 * time.Minute
-	replyNotifiedKeyPrefix = "conversation:reply-notified:"
-	replyNotifiedTTL       = 7 * 24 * time.Hour
+	newReplyEmailDelay = 5 * time.Minute
 )
 
 var conversationFilterRenderers = dbutil.FieldRenderers{
@@ -114,8 +111,6 @@ type Manager struct {
 	outgoingProcessingMessages sync.Map
 	closed                     bool
 	closedMu                   sync.RWMutex
-	replyNotificationMu        sync.Mutex
-	rdb                        *redis.Client
 	wg                         sync.WaitGroup
 	continuityConfig           ContinuityConfig
 	subjectRefFormat           string
@@ -233,7 +228,6 @@ type ContinuityConfig struct {
 // Opts holds the options for creating a new Manager.
 type Opts struct {
 	DB                       *sqlx.DB
-	Redis                    *redis.Client
 	Lo                       *logf.Logger
 	OutgoingMessageQueueSize int
 	IncomingMessageQueueSize int
@@ -302,7 +296,6 @@ func New(
 		automation:                 automation,
 		template:                   template,
 		db:                         opts.DB,
-		rdb:                        opts.Redis,
 		lo:                         opts.Lo,
 		incomingMessageQueue:       make(chan models.IncomingMessage, opts.IncomingMessageQueueSize),
 		outgoingMessageQueue:       make(chan models.Message, opts.OutgoingMessageQueueSize),
@@ -316,46 +309,45 @@ func New(
 
 type queries struct {
 	// Conversation queries.
-	GetConversationUUID                   *sqlx.Stmt `query:"get-conversation-uuid"`
-	GetConversation                       *sqlx.Stmt `query:"get-conversation"`
-	GetConversationListItem               *sqlx.Stmt `query:"get-conversation-list-item"`
-	GetConversationsCreatedAfter          *sqlx.Stmt `query:"get-conversations-created-after"`
-	GetUnassignedConversations            *sqlx.Stmt `query:"get-unassigned-conversations"`
-	GetConversations                      string     `query:"get-conversations"`
-	GetContactChatConversations           *sqlx.Stmt `query:"get-contact-chat-conversations"`
-	GetChatConversation                   *sqlx.Stmt `query:"get-chat-conversation"`
-	GetContactPreviousConversations       *sqlx.Stmt `query:"get-contact-previous-conversations"`
-	GetContactConversationsForAI          *sqlx.Stmt `query:"get-contact-conversations-for-ai"`
-	GetConversationsByContactEmailForAI   *sqlx.Stmt `query:"get-conversations-by-contact-email-for-ai"`
-	GetConversationParticipants           *sqlx.Stmt `query:"get-conversation-participants"`
-	GetConversationParticipantAgents      *sqlx.Stmt `query:"get-conversation-participant-agents"`
-	GetUserActiveConversationsCount       *sqlx.Stmt `query:"get-user-active-conversations-count"`
-	GetSidebarStandardCounts              *sqlx.Stmt `query:"get-sidebar-standard-counts"`
-	GetConversationsCountBase             string     `query:"get-conversations-count-base"`
-	StartConversationWaitingSince         *sqlx.Stmt `query:"start-conversation-waiting-since"`
-	UpdateConversationReplyTimestamps     *sqlx.Stmt `query:"update-conversation-reply-timestamps"`
-	UpdateConversationContactLastSeen     *sqlx.Stmt `query:"update-conversation-contact-last-seen"`
-	UpsertUserLastSeen                    *sqlx.Stmt `query:"upsert-user-last-seen"`
-	GetUsersWithUnreadConversationMessage *sqlx.Stmt `query:"get-users-with-unread-conversation-message"`
-	MarkConversationUnread                *sqlx.Stmt `query:"mark-conversation-unread"`
-	UpdateConversationAssignedUser        *sqlx.Stmt `query:"update-conversation-assigned-user"`
-	ClaimUnassignedConversation           *sqlx.Stmt `query:"claim-unassigned-conversation"`
-	UpdateConversationAssignedTeam        *sqlx.Stmt `query:"update-conversation-assigned-team"`
-	UpdateConversationCustomAttributes    *sqlx.Stmt `query:"update-conversation-custom-attributes"`
-	UpdateConversationPriority            *sqlx.Stmt `query:"update-conversation-priority"`
-	UpdateConversationStatus              *sqlx.Stmt `query:"update-conversation-status"`
-	UpdateConversationLastMessage         *sqlx.Stmt `query:"update-conversation-last-message"`
-	InsertConversationParticipant         *sqlx.Stmt `query:"insert-conversation-participant"`
-	InsertConversation                    *sqlx.Stmt `query:"insert-conversation"`
-	AddConversationTags                   *sqlx.Stmt `query:"add-conversation-tags"`
-	SetConversationTags                   *sqlx.Stmt `query:"set-conversation-tags"`
-	RemoveConversationTags                *sqlx.Stmt `query:"remove-conversation-tags"`
-	GetConversationTags                   *sqlx.Stmt `query:"get-conversation-tags"`
-	UnassignOpenConversations             *sqlx.Stmt `query:"unassign-open-conversations"`
-	ReOpenConversation                    *sqlx.Stmt `query:"re-open-conversation"`
-	UnsnoozeAll                           *sqlx.Stmt `query:"unsnooze-all"`
-	DeleteConversation                    *sqlx.Stmt `query:"delete-conversation"`
-	RemoveConversationAssignee            *sqlx.Stmt `query:"remove-conversation-assignee"`
+	GetConversationUUID                 *sqlx.Stmt `query:"get-conversation-uuid"`
+	GetConversation                     *sqlx.Stmt `query:"get-conversation"`
+	GetConversationListItem             *sqlx.Stmt `query:"get-conversation-list-item"`
+	GetConversationsCreatedAfter        *sqlx.Stmt `query:"get-conversations-created-after"`
+	GetUnassignedConversations          *sqlx.Stmt `query:"get-unassigned-conversations"`
+	GetConversations                    string     `query:"get-conversations"`
+	GetContactChatConversations         *sqlx.Stmt `query:"get-contact-chat-conversations"`
+	GetChatConversation                 *sqlx.Stmt `query:"get-chat-conversation"`
+	GetContactPreviousConversations     *sqlx.Stmt `query:"get-contact-previous-conversations"`
+	GetContactConversationsForAI        *sqlx.Stmt `query:"get-contact-conversations-for-ai"`
+	GetConversationsByContactEmailForAI *sqlx.Stmt `query:"get-conversations-by-contact-email-for-ai"`
+	GetConversationParticipants         *sqlx.Stmt `query:"get-conversation-participants"`
+	GetConversationParticipantAgents    *sqlx.Stmt `query:"get-conversation-participant-agents"`
+	GetUserActiveConversationsCount     *sqlx.Stmt `query:"get-user-active-conversations-count"`
+	GetSidebarStandardCounts            *sqlx.Stmt `query:"get-sidebar-standard-counts"`
+	GetConversationsCountBase           string     `query:"get-conversations-count-base"`
+	StartConversationWaitingSince       *sqlx.Stmt `query:"start-conversation-waiting-since"`
+	UpdateConversationReplyTimestamps   *sqlx.Stmt `query:"update-conversation-reply-timestamps"`
+	UpdateConversationContactLastSeen   *sqlx.Stmt `query:"update-conversation-contact-last-seen"`
+	UpsertUserLastSeen                  *sqlx.Stmt `query:"upsert-user-last-seen"`
+	MarkConversationUnread              *sqlx.Stmt `query:"mark-conversation-unread"`
+	UpdateConversationAssignedUser      *sqlx.Stmt `query:"update-conversation-assigned-user"`
+	ClaimUnassignedConversation         *sqlx.Stmt `query:"claim-unassigned-conversation"`
+	UpdateConversationAssignedTeam      *sqlx.Stmt `query:"update-conversation-assigned-team"`
+	UpdateConversationCustomAttributes  *sqlx.Stmt `query:"update-conversation-custom-attributes"`
+	UpdateConversationPriority          *sqlx.Stmt `query:"update-conversation-priority"`
+	UpdateConversationStatus            *sqlx.Stmt `query:"update-conversation-status"`
+	UpdateConversationLastMessage       *sqlx.Stmt `query:"update-conversation-last-message"`
+	InsertConversationParticipant       *sqlx.Stmt `query:"insert-conversation-participant"`
+	InsertConversation                  *sqlx.Stmt `query:"insert-conversation"`
+	AddConversationTags                 *sqlx.Stmt `query:"add-conversation-tags"`
+	SetConversationTags                 *sqlx.Stmt `query:"set-conversation-tags"`
+	RemoveConversationTags              *sqlx.Stmt `query:"remove-conversation-tags"`
+	GetConversationTags                 *sqlx.Stmt `query:"get-conversation-tags"`
+	UnassignOpenConversations           *sqlx.Stmt `query:"unassign-open-conversations"`
+	ReOpenConversation                  *sqlx.Stmt `query:"re-open-conversation"`
+	UnsnoozeAll                         *sqlx.Stmt `query:"unsnooze-all"`
+	DeleteConversation                  *sqlx.Stmt `query:"delete-conversation"`
+	RemoveConversationAssignee          *sqlx.Stmt `query:"remove-conversation-assignee"`
 
 	// Draft queries.
 	UpsertConversationDraft *sqlx.Stmt `query:"upsert-conversation-draft"`
@@ -558,56 +550,22 @@ func (c *Manager) GetConversationsCreatedAfter(after time.Time, afterID, limit i
 
 // UpdateUserLastSeen updates the last seen timestamp for a specific user on a conversation.
 func (c *Manager) UpdateUserLastSeen(uuid string, userID int) error {
-	c.replyNotificationMu.Lock()
-	defer c.replyNotificationMu.Unlock()
-
 	if _, err := c.q.UpsertUserLastSeen.Exec(userID, uuid); err != nil {
 		c.lo.Error("error upserting user last seen", "user_id", userID, "conversation_uuid", uuid, "error", err)
 		return envelope.NewError(envelope.GeneralError, c.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
-	c.clearReplyNotified(uuid, userID)
 	return nil
 }
 
 // MarkAsUnread marks a conversation as unread for a specific user by setting last_seen to before the last message.
 func (c *Manager) MarkAsUnread(uuid string, userID int) error {
-	c.replyNotificationMu.Lock()
-	defer c.replyNotificationMu.Unlock()
-
 	if _, err := c.q.MarkConversationUnread.Exec(userID, uuid); err != nil {
 		c.lo.Error("error marking conversation as unread", "user_id", userID, "conversation_uuid", uuid, "error", err)
 		return envelope.NewError(envelope.GeneralError, c.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
-	c.clearReplyNotified(uuid, userID)
 	return nil
 }
 
-// ReleaseReplyNotification clears reply suppression for an abandoned email, preserving newer claims.
-func (m *Manager) ReleaseReplyNotification(conversationID, userID int, messageCreatedAt time.Time) {
-	if m.rdb == nil {
-		return
-	}
-	uuid, err := m.GetConversationUUID(conversationID)
-	if err != nil {
-		return
-	}
-
-	m.replyNotificationMu.Lock()
-	defer m.replyNotificationMu.Unlock()
-
-	claim, err := m.rdb.Get(context.Background(), replyNotifiedKey(uuid, userID)).Int64()
-	if errors.Is(err, redis.Nil) {
-		return
-	}
-	if err != nil {
-		m.lo.Error("error fetching reply notification claim", "conversation_uuid", uuid, "user_id", userID, "error", err)
-		return
-	}
-	if claim == 1 || claim == messageCreatedAt.UnixMicro() {
-		m.clearReplyNotified(uuid, userID)
-	}
-}
-
 // UpdateContactLastSeen updates the last seen timestamp of the contact in the conversation.
 func (c *Manager) UpdateConversationContactLastSeen(uuid string) error {
 	var lastSeenAt time.Time
@@ -1387,27 +1345,22 @@ func (m *Manager) sendReplyNotification(conversation models.Conversation, messag
 		candidateIDs[i] = recipient.ID
 	}
 
-	claimedIDs, err := m.claimUnreadRecipients(conversation, candidateIDs, message.CreatedAt)
-	if err != nil {
-		return
+	recipients := m.buildNotificationRecipients(candidateIDs, func(recipient umodels.User) (string, string, error) {
+		data := notificationTemplateData(conversation, recipient, author)
+		data["Message"] = map[string]any{
+			"UUID":    message.UUID,
+			"Content": htmltemplate.HTML(strings.ReplaceAll(html.EscapeString(message.TextContent), "\n", "<br>")),
+		}
+		content, subject, err := m.template.RenderStoredEmailTemplate(group.tmpl, data)
+		return subject, content, err
+	})
+	for i := range recipients {
+		if recipients[i].Email != nil {
+			recipients[i].Email.Delay = newReplyEmailDelay
+		}
 	}
 
-	var recipients []nmodels.Recipient
-	for _, recipient := range group.recipients {
-		if !slices.Contains(claimedIDs, recipient.ID) {
-			continue
-		}
-		email := m.renderNotificationEmail(group.tmpl, conversation, message, recipient, author)
-		if email != nil {
-			email.Delay = newReplyEmailDelay
-		}
-		recipients = append(recipients, nmodels.Recipient{UserID: recipient.ID, Email: email})
-	}
-	if len(recipients) == 0 {
-		return
-	}
-
-	results, err := m.dispatcher.Send(nmodels.Notification{
+	if _, err := m.dispatcher.Send(nmodels.Notification{
 		Type:             group.nType,
 		Recipients:       recipients,
 		Title:            group.title,
@@ -1417,90 +1370,8 @@ func (m *Manager) sendReplyNotification(conversation models.Conversation, messag
 		ConversationUUID: conversation.UUID,
 		MessageUUID:      message.UUID,
 		MessageCreatedAt: null.TimeFrom(message.CreatedAt),
-	})
-	if err != nil {
+	}); err != nil {
 		m.lo.Error("error sending reply notification", "type", group.nType, "error", err)
-		m.clearReplyNotified(conversation.UUID, claimedIDs...)
-		return
-	}
-	var untracked []int
-	for _, result := range results {
-		if !slices.Contains(result.Channels, nmodels.NotificationChannelInApp) &&
-			!slices.Contains(result.Channels, nmodels.NotificationChannelEmail) {
-			untracked = append(untracked, result.RecipientID)
-		}
-	}
-	m.clearReplyNotified(conversation.UUID, untracked...)
-}
-
-// claimUnreadRecipients holds the reply notification lock across the unread check and the claim, returning the claimed recipients.
-func (m *Manager) claimUnreadRecipients(conversation models.Conversation, userIDs []int, messageCreatedAt time.Time) ([]int, error) {
-	m.replyNotificationMu.Lock()
-	defer m.replyNotificationMu.Unlock()
-
-	var unreadIDs []int
-	if err := m.q.GetUsersWithUnreadConversationMessage.Select(&unreadIDs, conversation.ID, pq.Array(userIDs), messageCreatedAt); err != nil {
-		m.lo.Error("error checking conversation unread state", "conversation_uuid", conversation.UUID, "error", err)
-		return nil, err
-	}
-	return m.claimReplyNotified(conversation.UUID, unreadIDs, messageCreatedAt), nil
-}
-
-func (m *Manager) claimReplyNotified(conversationUUID string, userIDs []int, messageCreatedAt time.Time) []int {
-	if len(userIDs) == 0 || m.rdb == nil {
-		return userIDs
-	}
-	ctx := context.Background()
-	pipe := m.rdb.Pipeline()
-	claims := make([]*redis.BoolCmd, len(userIDs))
-	for i, userID := range userIDs {
-		claims[i] = pipe.SetNX(ctx, replyNotifiedKey(conversationUUID, userID), messageCreatedAt.UnixMicro(), replyNotifiedTTL)
-	}
-	if _, err := pipe.Exec(ctx); err != nil {
-		m.lo.Error("error claiming reply notifications", "conversation_uuid", conversationUUID, "error", err)
-		return userIDs
-	}
-	claimed := make([]int, 0, len(userIDs))
-	for i, userID := range userIDs {
-		if claims[i].Val() {
-			claimed = append(claimed, userID)
-		}
-	}
-	return claimed
-}
-
-func (m *Manager) clearReplyNotified(conversationUUID string, userIDs ...int) {
-	if len(userIDs) == 0 || m.rdb == nil {
-		return
-	}
-	keys := make([]string, len(userIDs))
-	for i, userID := range userIDs {
-		keys[i] = replyNotifiedKey(conversationUUID, userID)
-	}
-	if err := m.rdb.Del(context.Background(), keys...).Err(); err != nil {
-		m.lo.Error("error clearing reply notification", "user_ids", userIDs, "conversation_uuid", conversationUUID, "error", err)
-	}
-}
-
-// renderNotificationEmail returns nil when the recipient has no email or the template fails to render.
-func (m *Manager) renderNotificationEmail(tmplName string, conversation models.Conversation, message models.Message, recipient, author umodels.User) *nmodels.EmailNotification {
-	if recipient.Email.String == "" {
-		return nil
-	}
-	data := notificationTemplateData(conversation, recipient, author)
-	data["Message"] = map[string]any{
-		"UUID":    message.UUID,
-		"Content": htmltemplate.HTML(strings.ReplaceAll(html.EscapeString(message.TextContent), "\n", "<br>")),
-	}
-	content, subject, err := m.template.RenderStoredEmailTemplate(tmplName, data)
-	if err != nil {
-		m.lo.Error("error rendering template", "template", tmplName, "conversation_uuid", conversation.UUID, "error", err)
-		return nil
-	}
-	return &nmodels.EmailNotification{
-		Recipient: recipient.Email.String,
-		Subject:   subject,
-		Content:   content,
 	}
 }
 
@@ -1555,38 +1426,18 @@ func (m *Manager) NotifyMention(conversationUUID string, message models.Message,
 	messageContent := sanitizeNotificationHTML(message.Content, rootURL)
 
 	recipients := m.buildNotificationRecipients(userIDs, func(recipient umodels.User) (string, string, error) {
-		content, subject, err := m.template.RenderStoredEmailTemplate(template.TmplMentioned,
-			map[string]any{
-				"Conversation": map[string]any{
-					"ReferenceNumber": conversation.ReferenceNumber,
-					"Subject":         conversation.Subject.String,
-					"Priority":        conversation.Priority.String,
-					"UUID":            conversation.UUID,
-				},
-				"Recipient": map[string]any{
-					"FirstName": recipient.FirstName,
-					"LastName":  recipient.LastName,
-					"FullName":  recipient.FullName(),
-					"Email":     recipient.Email.String,
-				},
-				"Message": map[string]any{
-					"UUID":    message.UUID,
-					"Content": messageContent,
-				},
-				"MentionedBy": map[string]any{
-					"FirstName": author.FirstName,
-					"LastName":  author.LastName,
-					"FullName":  author.FullName(),
-					"Email":     author.Email.String,
-				},
-				// Automated messages do not have an author.
-				"Author": map[string]any{
-					"FirstName": "",
-					"LastName":  "",
-					"FullName":  "",
-					"Email":     "",
-				},
-			})
+		data := notificationTemplateData(conversation, recipient, umodels.User{})
+		data["Message"] = map[string]any{
+			"UUID":    message.UUID,
+			"Content": messageContent,
+		}
+		data["MentionedBy"] = map[string]any{
+			"FirstName": author.FirstName,
+			"LastName":  author.LastName,
+			"FullName":  author.FullName(),
+			"Email":     author.Email.String,
+		}
+		content, subject, err := m.template.RenderStoredEmailTemplate(template.TmplMentioned, data)
 		return subject, content, err
 	})
 
@@ -1780,41 +1631,14 @@ func (m *Manager) notifyAutomation(subject, message string, entries []string, co
 	}
 
 	recipients := m.buildNotificationRecipients(userIDs, func(recipient umodels.User) (string, string, error) {
-		content, err := m.template.RenderEmailWithTemplate(
-			map[string]any{
-				"Conversation": map[string]any{
-					"ReferenceNumber": conv.ReferenceNumber,
-					"Subject":         conv.Subject.String,
-					"Priority":        conv.Priority.String,
-					"UUID":            conv.UUID,
-				},
-				"Recipient": map[string]any{
-					"FirstName": recipient.FirstName,
-					"LastName":  recipient.LastName,
-					"FullName":  recipient.FullName(),
-					"Email":     recipient.Email.String,
-				},
-				"Contact": map[string]any{
-					"FirstName": conv.Contact.FirstName,
-					"LastName":  conv.Contact.LastName,
-					"FullName":  conv.Contact.FullName(),
-					"Email":     conv.Contact.Email.String,
-				},
-				// Automated messages do not have an author.
-				"Author": map[string]any{
-					"FirstName": "",
-					"LastName":  "",
-					"FullName":  "",
-					"Email":     "",
-				},
-				"Message": message,
-			},
-			automationNotifyEmailContent)
+		data := notificationTemplateData(conv, recipient, umodels.User{})
+		data["Message"] = message
+		content, err := m.template.RenderEmailWithTemplate(data, automationNotifyEmailContent)
 		return subject, content, err
 	})
 
 	if _, err := m.dispatcher.Send(nmodels.Notification{
-		Type:             nmodels.NotificationTypeMention,
+		Type:             nmodels.NotificationTypeAutomation,
 		Recipients:       recipients,
 		Title:            subject,
 		Body:             null.StringFrom(message),
@@ -2487,10 +2311,6 @@ func renderTagFilter(operator, value string, paramIndex int) (string, []any, err
 	}
 }
 
-func replyNotifiedKey(conversationUUID string, userID int) string {
-	return replyNotifiedKeyPrefix + conversationUUID + ":" + strconv.Itoa(userID)
-}
-
 func notificationTemplateData(conversation models.Conversation, recipient, author umodels.User) map[string]any {
 	return map[string]any{
 		"Conversation": map[string]any{
diff --git a/internal/conversation/notification_test.go b/internal/conversation/notification_test.go
index 1329f4bc..76f0252e 100644
--- a/internal/conversation/notification_test.go
+++ b/internal/conversation/notification_test.go
@@ -2,7 +2,6 @@ package conversation
 
 import (
 	"errors"
-	"fmt"
 	htmltemplate "html/template"
 	"slices"
 	"sync"
@@ -18,10 +17,7 @@ import (
 	"github.com/abhinavxd/libredesk/internal/template"
 	"github.com/abhinavxd/libredesk/internal/testutil"
 	umodels "github.com/abhinavxd/libredesk/internal/user/models"
-	"github.com/alicebob/miniredis/v2"
-	"github.com/alicebob/miniredis/v2/server"
 	"github.com/jmoiron/sqlx"
-	"github.com/redis/go-redis/v9"
 	"github.com/volatiletech/null/v9"
 	"github.com/zerodha/logf"
 )
@@ -145,7 +141,7 @@ func TestNotifyNewReplyChecksAssigneeAccess(t *testing.T) {
 	}
 }
 
-func TestReplyNotificationsAlertOncePerUnreadConversation(t *testing.T) {
+func TestReplyNotificationsAlertForEveryMessage(t *testing.T) {
 	db := testutil.NewDB(t, "reply_notification_history")
 	var userID, inboxID int
 	if err := db.Get(&userID, `INSERT INTO users (type, email, first_name, last_name) VALUES ('agent', 'history@example.com', 'Agent', '') RETURNING id`); err != nil {
@@ -165,10 +161,6 @@ func TestReplyNotificationsAlertOncePerUnreadConversation(t *testing.T) {
 
 	var q struct {
 		Participants *sqlx.Stmt `query:"get-conversation-participant-agents"`
-		LastSeen     *sqlx.Stmt `query:"upsert-user-last-seen"`
-		MarkUnread   *sqlx.Stmt `query:"mark-conversation-unread"`
-		Unread       *sqlx.Stmt `query:"get-users-with-unread-conversation-message"`
-		UUID         *sqlx.Stmt `query:"get-conversation-uuid"`
 	}
 	if err := dbutil.ScanSQLFile("queries.sql", &q, db, efs); err != nil {
 		t.Fatal(err)
@@ -189,14 +181,10 @@ func TestReplyNotificationsAlertOncePerUnreadConversation(t *testing.T) {
 	}
 	conv.AssignedUserID = null.IntFrom(userID)
 
-	var replyRedis *miniredis.Miniredis
 	newManager := func(channels ...nmodels.NotificationChannel) *Manager {
-		db.MustExec(`DELETE FROM conversation_last_seen`)
 		db.MustExec(`DELETE FROM notification_email_queue`)
 		db.MustExec(`DELETE FROM user_notifications`)
-		mr := miniredis.RunT(t)
-		replyRedis = mr
-		m := &Manager{lo: &lo, i18n: i18n, template: templates, rdb: redis.NewClient(&redis.Options{Addr: mr.Addr()}),
+		m := &Manager{lo: &lo, i18n: i18n, template: templates,
 			userStore: replyUserStore{agent: umodels.User{ID: userID, Email: null.StringFrom("history@example.com"), Enabled: true, Permissions: []string{authzmodels.PermConversationsRead, authzmodels.PermConversationsReadAssigned}}},
 			dispatcher: notifier.NewDispatcher(notifier.DispatcherOpts{
 				Pipeline: nchannels.NewPipeline(nchannels.NewInApp(inApp, nil, &lo), nchannels.NewEmail(emailQueue)),
@@ -204,21 +192,17 @@ func TestReplyNotificationsAlertOncePerUnreadConversation(t *testing.T) {
 			}),
 		}
 		m.q.GetConversationParticipantAgents = q.Participants
-		m.q.UpsertUserLastSeen = q.LastSeen
-		m.q.MarkConversationUnread = q.MarkUnread
-		m.q.GetUsersWithUnreadConversationMessage = q.Unread
-		m.q.GetConversationUUID = q.UUID
 		return m
 	}
+	notifications := func() int {
+		var count int
+		db.Get(&count, `SELECT count(*) FROM user_notifications`)
+		return count
+	}
 	message := models.Message{ID: messageID, SenderID: userID + 1, CreatedAt: time.Now().UTC().Truncate(time.Microsecond)}
 
-	t.Run("one alert per unread conversation", func(t *testing.T) {
+	t.Run("each reply creates an in-app alert", func(t *testing.T) {
 		m := newManager(nmodels.NotificationChannelInApp)
-		notifications := func() int {
-			var count int
-			db.Get(&count, `SELECT count(*) FROM user_notifications`)
-			return count
-		}
 
 		m.NotifyNewReply(conv, message, false)
 		if notifications() != 1 {
@@ -228,45 +212,17 @@ func TestReplyNotificationsAlertOncePerUnreadConversation(t *testing.T) {
 		next := message
 		next.CreatedAt = message.CreatedAt.Add(time.Second)
 		m.NotifyNewReply(conv, next, false)
-		if notifications() != 1 {
-			t.Fatalf("notifications after a second unread reply = %d, want 1", notifications())
+		if notifications() != 2 {
+			t.Fatalf("notifications after second reply = %d, want 2", notifications())
 		}
 
 		m.NotifyNewReply(conv, next, true)
-		if notifications() != 1 {
-			t.Fatalf("notifications after a reopen on an unread conversation = %d, want 1", notifications())
-		}
-
-		if err := m.UpdateUserLastSeen(conv.UUID, userID); err != nil {
-			t.Fatal(err)
-		}
-		later := next
-		later.CreatedAt = time.Now().UTC().Add(time.Minute)
-		m.NotifyNewReply(conv, later, false)
-		if notifications() != 2 {
-			t.Fatalf("notifications after reading and replying again = %d, want 2", notifications())
-		}
-
-		if err := m.MarkAsUnread(conv.UUID, userID); err != nil {
-			t.Fatal(err)
-		}
-		m.NotifyNewReply(conv, later, false)
 		if notifications() != 3 {
-			t.Fatalf("notifications after marking unread and replying again = %d, want 3", notifications())
-		}
-
-		if err := m.UpdateUserLastSeen(conv.UUID, userID); err != nil {
-			t.Fatal(err)
-		}
-		read := later
-		read.CreatedAt = time.Now().Add(-time.Minute)
-		m.NotifyNewReply(conv, read, false)
-		if notifications() != 3 {
-			t.Fatalf("a reply the agent had already read was notified, notifications = %d", notifications())
+			t.Fatalf("notifications after reopened reply = %d, want 3", notifications())
 		}
 	})
 
-	t.Run("replies arriving together alert once", func(t *testing.T) {
+	t.Run("replies arriving together alert individually", func(t *testing.T) {
 		m := newManager(nmodels.NotificationChannelInApp)
 		var wg sync.WaitGroup
 		for range 8 {
@@ -274,92 +230,12 @@ func TestReplyNotificationsAlertOncePerUnreadConversation(t *testing.T) {
 		}
 		wg.Wait()
 
-		var count int
-		db.Get(&count, `SELECT count(*) FROM user_notifications`)
-		if count != 1 {
-			t.Fatalf("notifications from concurrent replies = %d, want 1", count)
+		if notifications() != 8 {
+			t.Fatalf("notifications from concurrent replies = %d, want 8", notifications())
 		}
 	})
 
-	for _, markUnread := range []bool{false, true} {
-		t.Run(fmt.Sprintf("read during claim/markUnread=%v", markUnread), func(t *testing.T) {
-			m := newManager(nmodels.NotificationChannelInApp)
-			readDone := make(chan error, 1)
-			var once sync.Once
-			replyRedis.Server().SetPreHook(func(_ *server.Peer, cmd string, _ ...string) bool {
-				if cmd == "SET" {
-					once.Do(func() {
-						go func() {
-							if markUnread {
-								readDone <- m.MarkAsUnread(conv.UUID, userID)
-							} else {
-								readDone <- m.UpdateUserLastSeen(conv.UUID, userID)
-							}
-						}()
-						select {
-						case err := <-readDone:
-							readDone <- err
-						case <-time.After(100 * time.Millisecond):
-						}
-					})
-				}
-				return false
-			})
-
-			m.NotifyNewReply(conv, message, false)
-			if err := <-readDone; err != nil {
-				t.Fatal(err)
-			}
-			if replyRedis.Exists(replyNotifiedKey(conv.UUID, userID)) {
-				t.Fatal("completed read left a reply suppression claim")
-			}
-
-			next := message
-			next.CreatedAt = time.Now().UTC().Add(time.Minute)
-			m.NotifyNewReply(conv, next, false)
-			var count int
-			if err := db.Get(&count, `SELECT count(*) FROM user_notifications`); err != nil {
-				t.Fatal(err)
-			}
-			if count != 2 {
-				t.Fatalf("notifications after a concurrent read and a new reply = %d, want 2", count)
-			}
-		})
-	}
-
-	for _, state := range []string{"current", "legacy", "newer", "read"} {
-		t.Run("abandoned email releases only its claim/"+state, func(t *testing.T) {
-			m := newManager(nmodels.NotificationChannelEmail)
-			m.NotifyNewReply(conv, message, false)
-			key := replyNotifiedKey(conv.UUID, userID)
-			if state == "legacy" {
-				if err := replyRedis.Set(key, "1"); err != nil {
-					t.Fatal(err)
-				}
-			}
-			if state == "newer" || state == "read" {
-				if err := m.UpdateUserLastSeen(conv.UUID, userID); err != nil {
-					t.Fatal(err)
-				}
-			}
-			next := message
-			next.CreatedAt = time.Now().UTC().Add(time.Minute)
-			if state == "newer" {
-				m.NotifyNewReply(conv, next, false)
-			}
-
-			m.ReleaseReplyNotification(conv.ID, userID, message.CreatedAt)
-			if got, want := replyRedis.Exists(key), state == "newer"; got != want {
-				t.Fatalf("claim after abandonment = %v, want %v", got, want)
-			}
-			m.NotifyNewReply(conv, next, false)
-			if !replyRedis.Exists(key) {
-				t.Fatal("next unread reply was not claimed")
-			}
-		})
-	}
-
-	t.Run("push only agent keeps no claim", func(t *testing.T) {
+	t.Run("push alerts for every reply", func(t *testing.T) {
 		m := newManager(nmodels.NotificationChannelPush)
 		push := &countingPush{}
 		m.dispatcher = notifier.NewDispatcher(notifier.DispatcherOpts{
@@ -367,40 +243,30 @@ func TestReplyNotificationsAlertOncePerUnreadConversation(t *testing.T) {
 			Prefs:    &replyPreferences{channels: []nmodels.NotificationChannel{nmodels.NotificationChannelPush}},
 		})
 		m.NotifyNewReply(conv, message, false)
-
-		m.dispatcher = notifier.NewDispatcher(notifier.DispatcherOpts{
-			Pipeline: nchannels.NewPipeline(nchannels.NewInApp(inApp, nil, &lo), nchannels.NewEmail(emailQueue)),
-			Prefs:    &replyPreferences{channels: []nmodels.NotificationChannel{nmodels.NotificationChannelInApp}},
-		})
 		m.NotifyNewReply(conv, message, false)
-
-		var count int
-		db.Get(&count, `SELECT count(*) FROM user_notifications`)
-		if count != 1 {
-			t.Fatalf("notifications after a push that stored nothing = %d, want 1", count)
+		if push.count != 2 {
+			t.Fatalf("push notifications = %d, want 2", push.count)
 		}
 	})
 
 	t.Run("agent with no channel enabled is not notified", func(t *testing.T) {
 		m := newManager()
 		m.NotifyNewReply(conv, message, false)
-		var count int
-		db.Get(&count, `SELECT count(*) FROM user_notifications`)
-		if count != 0 {
-			t.Fatalf("notifications = %d, want 0", count)
+		if notifications() != 0 {
+			t.Fatalf("notifications = %d, want 0", notifications())
 		}
 	})
 
-	t.Run("preference failure releases claim", func(t *testing.T) {
+	t.Run("preference failure sends nothing", func(t *testing.T) {
 		m := newManager()
 		m.dispatcher = notifier.NewDispatcher(notifier.DispatcherOpts{Prefs: &replyPreferences{err: errors.New("lookup failed")}})
 		m.NotifyNewReply(conv, message, false)
-		if replyRedis.Exists(replyNotifiedKey(conv.UUID, userID)) {
-			t.Fatal("preference failure left a reply suppression claim")
+		if notifications() != 0 {
+			t.Fatalf("notifications = %d, want 0", notifications())
 		}
 	})
 
-	t.Run("email only agent is alerted once until they read the conversation", func(t *testing.T) {
+	t.Run("email replies are clubbed in the queue", func(t *testing.T) {
 		m := newManager(nmodels.NotificationChannelEmail)
 		m.NotifyNewReply(conv, message, false)
 		next := message
@@ -412,17 +278,5 @@ func TestReplyNotificationsAlertOncePerUnreadConversation(t *testing.T) {
 		if queued != 1 {
 			t.Fatalf("queued emails = %d, want 1", queued)
 		}
-
-		db.MustExec(`DELETE FROM notification_email_queue`)
-		if err := m.UpdateUserLastSeen(conv.UUID, userID); err != nil {
-			t.Fatal(err)
-		}
-		later := next
-		later.CreatedAt = time.Now().UTC().Add(time.Minute)
-		m.NotifyNewReply(conv, later, false)
-		db.Get(&queued, `SELECT count(*) FROM notification_email_queue`)
-		if queued != 1 {
-			t.Fatalf("queued emails after reading and replying again = %d, want 1", queued)
-		}
 	})
 }
diff --git a/internal/conversation/queries.sql b/internal/conversation/queries.sql
index 47e1ca48..962d418e 100644
--- a/internal/conversation/queries.sql
+++ b/internal/conversation/queries.sql
@@ -509,13 +509,6 @@ VALUES ($1, (SELECT id FROM conversations WHERE uuid = $2), NOW())
 ON CONFLICT (conversation_id, user_id)
 DO UPDATE SET last_seen_at = NOW(), updated_at = NOW();
 
--- name: get-users-with-unread-conversation-message
-SELECT candidate.user_id
-FROM unnest($2::BIGINT[]) AS candidate(user_id)
-LEFT JOIN conversation_last_seen seen
-    ON seen.conversation_id = $1 AND seen.user_id = candidate.user_id
-WHERE seen.last_seen_at IS NULL OR seen.last_seen_at < $3;
-
 -- name: update-conversation-last-message
 -- $1=id, $2=uuid, $3=content, $4=sender_type, $5=timestamp, $6=message_type, $7=private, $8=sender_id
 UPDATE conversations SET
diff --git a/internal/migrations/v2.9.0.go b/internal/migrations/v2.9.0.go
index bd4180b0..96f9d959 100644
--- a/internal/migrations/v2.9.0.go
+++ b/internal/migrations/v2.9.0.go
@@ -16,6 +16,7 @@ var notificationTypesV2_9_0 = []string{
 	"sla_resolution_warning",
 	"sla_resolution_breach",
 	"conversation_reopened",
+	"automation",
 }
 
 func V2_9_0(db *sqlx.DB, fs stuffbin.FileSystem, ko *koanf.Koanf) error {
diff --git a/internal/notification/channels/push.go b/internal/notification/channels/push.go
index 5261fcf8..c020cb90 100644
--- a/internal/notification/channels/push.go
+++ b/internal/notification/channels/push.go
@@ -28,14 +28,14 @@ func (p *push) Send(delivery Delivery) Result {
 		Title: n.Title,
 		Body:  n.Body.String,
 		Tag:   fmt.Sprintf("%s_%s", n.Type, n.ConversationUUID),
-		URL:   pushRoute(string(n.Type), n.ConversationUUID, n.MessageUUID),
+		URL:   pushRoute(n.Type, n.ConversationUUID, n.MessageUUID),
 	})
 	return Result{Sent: sent}
 }
 
-func pushRoute(notificationType, conversationUUID, messageUUID string) string {
+func pushRoute(notificationType models.NotificationType, conversationUUID, messageUUID string) string {
 	list := "assigned"
-	if notificationType == "mention" {
+	if notificationType == models.NotificationTypeMention {
 		list = "mentioned"
 	}
 	route := fmt.Sprintf("/inboxes/%s/conversation/%s", list, conversationUUID)
diff --git a/internal/notification/email_queue.go b/internal/notification/email_queue.go
index db9dfecd..220c01c5 100644
--- a/internal/notification/email_queue.go
+++ b/internal/notification/email_queue.go
@@ -19,10 +19,6 @@ const (
 	emailQueueRetryDelay  = time.Minute
 )
 
-type replyNotificationStore interface {
-	ReleaseReplyNotification(conversationID, userID int, messageCreatedAt time.Time)
-}
-
 type EmailSender interface {
 	Send(Message) error
 	SendSync(Message) error
@@ -51,10 +47,9 @@ type queuedEmail struct {
 }
 
 type EmailQueue struct {
-	q                 emailQueueQueries
-	outbound          EmailSender
-	conversationStore replyNotificationStore
-	lo                *logf.Logger
+	q        emailQueueQueries
+	outbound EmailSender
+	lo       *logf.Logger
 }
 
 type EmailQueueOpts struct {
@@ -75,10 +70,6 @@ func NewEmailQueue(opts EmailQueueOpts) (*EmailQueue, error) {
 	}, nil
 }
 
-func (q *EmailQueue) SetConversationStore(store replyNotificationStore) {
-	q.conversationStore = store
-}
-
 func (q *EmailQueue) Send(e models.Email) bool {
 	if err := q.outbound.Send(Message{
 		RecipientEmails: []string{e.Recipient},
@@ -152,7 +143,7 @@ func (q *EmailQueue) deliver(e queuedEmail) bool {
 	}); err != nil {
 		q.lo.Error("error delivering notification email", "user_id", e.UserID, "type", e.Type, "error", err)
 		if e.Attempts+1 >= emailQueueMaxAttempts {
-			q.abandon(e)
+			q.delete(e)
 		} else {
 			q.retry(e)
 		}
@@ -162,16 +153,6 @@ func (q *EmailQueue) deliver(e queuedEmail) bool {
 	return true
 }
 
-func (q *EmailQueue) abandon(e queuedEmail) {
-	if !q.delete(e) || e.NotificationID.Valid || !e.ConversationID.Valid || q.conversationStore == nil {
-		return
-	}
-	switch e.Type {
-	case models.NotificationTypeNewReply, models.NotificationTypeNewReplyParticipating, models.NotificationTypeConversationReopened:
-		q.conversationStore.ReleaseReplyNotification(e.ConversationID.Int, e.UserID, e.MessageCreatedAt.Time)
-	}
-}
-
 func (q *EmailQueue) delete(e queuedEmail) bool {
 	result, err := q.q.Delete.Exec(e.ID, e.ClaimedAt)
 	if err != nil {
diff --git a/internal/notification/email_queue_test.go b/internal/notification/email_queue_test.go
index 1d976800..348c207d 100644
--- a/internal/notification/email_queue_test.go
+++ b/internal/notification/email_queue_test.go
@@ -16,10 +16,6 @@ type emailDeliveryProvider struct {
 	err error
 }
 
-type replyNotificationRecorder struct {
-	release func(int, int, time.Time)
-}
-
 func (p *emailDeliveryProvider) Send(Message) error {
 	return p.err
 }
@@ -28,10 +24,6 @@ func (p *emailDeliveryProvider) Name() string {
 	return ProviderEmail
 }
 
-func (s *replyNotificationRecorder) ReleaseReplyNotification(conversationID, userID int, messageCreatedAt time.Time) {
-	s.release(conversationID, userID, messageCreatedAt)
-}
-
 func TestDelayedReplyEmailUsesMessageTime(t *testing.T) {
 	db := testutil.NewDB(t, "reply_email_time")
 	var userID, inboxID, convID int
@@ -101,9 +93,21 @@ func TestDelayedReplyEmailUsesMessageTime(t *testing.T) {
 	t.Run("coalesced reply uses latest message", func(t *testing.T) {
 		db.MustExec(`UPDATE conversation_last_seen SET last_seen_at = $1`, messageTime.Add(time.Second))
 		d.Send(n)
+		var firstSendAt time.Time
+		if err := db.Get(&firstSendAt, `SELECT send_at FROM notification_email_queue`); err != nil {
+			t.Fatal(err)
+		}
 		n.MessageCreatedAt = null.TimeFrom(messageTime.Add(2 * time.Second))
 		n.Recipients[0].Email.Content = "Second reply"
+		n.Recipients[0].Email.Delay = 2 * time.Minute
 		d.Send(n)
+		var secondSendAt time.Time
+		if err := db.Get(&secondSendAt, `SELECT send_at FROM notification_email_queue`); err != nil {
+			t.Fatal(err)
+		}
+		if !secondSendAt.After(firstSendAt) {
+			t.Fatalf("coalesced email send time = %v, want after %v", secondSendAt, firstSendAt)
+		}
 		db.MustExec(`UPDATE notification_email_queue SET send_at = now() - interval '1 second'`)
 		due := queue.due()
 		if len(due) != 1 || due[0].Content != "Second reply" {
@@ -300,93 +304,3 @@ func TestClaimedEmailRemainsRecoverable(t *testing.T) {
 		t.Fatalf("emails after lease expiry = %d, want 1", len(due))
 	}
 }
-
-func TestAbandonedReplyEmailReleasesSuppression(t *testing.T) {
-	db := testutil.NewDB(t, "notification_email_abandonment")
-	var userID, inboxID, convID, notificationID int
-	if err := db.Get(&userID, `INSERT INTO users (type, email, first_name, last_name) VALUES ('agent', 'abandon@example.com', 'Agent', '') RETURNING id`); err != nil {
-		t.Fatal(err)
-	}
-	if err := db.Get(&inboxID, `INSERT INTO inboxes (name, channel) VALUES ('Test', 'email') RETURNING id`); err != nil {
-		t.Fatal(err)
-	}
-	if err := db.Get(&convID, `INSERT INTO conversations (contact_id, inbox_id, status_id) VALUES ($1, $2, (SELECT id FROM conversation_statuses LIMIT 1)) RETURNING id`, userID, inboxID); err != nil {
-		t.Fatal(err)
-	}
-	if err := db.Get(&notificationID, `INSERT INTO user_notifications (user_id, notification_type, title, conversation_id) VALUES ($1, 'new_reply', 'Reply', $2) RETURNING id`, userID, convID); err != nil {
-		t.Fatal(err)
-	}
-	lo := logf.New(logf.Opts{})
-	provider := &emailDeliveryProvider{}
-	queue, err := NewEmailQueue(EmailQueueOpts{DB: db, Outbound: NewService(map[string]Notifier{ProviderEmail: provider}, 1, 1, &lo), Lo: &lo})
-	if err != nil {
-		t.Fatal(err)
-	}
-	for _, tt := range []struct {
-		name         string
-		nType        models.NotificationType
-		inApp        bool
-		replaced     bool
-		delivered    bool
-		attempts     int
-		wantReleased bool
-		wantQueued   int
-	}{
-		{name: "email only", nType: models.NotificationTypeNewReply, attempts: 2, wantReleased: true},
-		{name: "participant", nType: models.NotificationTypeNewReplyParticipating, attempts: 2, wantReleased: true},
-		{name: "reopened", nType: models.NotificationTypeConversationReopened, attempts: 2, wantReleased: true},
-		{name: "in app remains", nType: models.NotificationTypeNewReply, inApp: true, attempts: 2},
-		{name: "retry remains", nType: models.NotificationTypeNewReply, attempts: 1, wantQueued: 1},
-		{name: "newer email remains", nType: models.NotificationTypeNewReply, replaced: true, attempts: 2, wantQueued: 1},
-		{name: "successful delivery", nType: models.NotificationTypeNewReply, delivered: true, attempts: 2},
-		{name: "unrelated notification", nType: models.NotificationTypeAssignment, attempts: 2},
-	} {
-		t.Run(tt.name, func(t *testing.T) {
-			db.MustExec(`DELETE FROM notification_email_queue`)
-			messageTime := time.Now().UTC().Truncate(time.Microsecond)
-			email := models.Email{UserID: userID, Type: tt.nType, ConversationID: null.IntFrom(convID),
-				MessageCreatedAt: null.TimeFrom(messageTime), Recipient: "abandon@example.com", Subject: "Reply", Content: "Reply"}
-			if tt.inApp {
-				email.NotificationID = null.IntFrom(notificationID)
-			}
-			released := false
-			queue.SetConversationStore(&replyNotificationRecorder{release: func(gotConv, gotUser int, gotTime time.Time) {
-				released = true
-				if gotConv != convID || gotUser != userID || !gotTime.Equal(messageTime) {
-					t.Fatalf("released wrong reply: conversation=%d, user=%d, time=%v", gotConv, gotUser, gotTime)
-				}
-			}})
-			if !queue.SendAfter(email, -time.Second) {
-				t.Fatal("queueing email failed")
-			}
-			db.MustExec(`UPDATE notification_email_queue SET attempts = $1`, tt.attempts)
-			due := queue.due()
-			if len(due) != 1 {
-				t.Fatalf("due emails = %d, want 1", len(due))
-			}
-			if tt.replaced {
-				email.MessageCreatedAt = null.TimeFrom(messageTime.Add(time.Minute))
-				if !queue.SendAfter(email, time.Minute) {
-					t.Fatal("replacing queued email failed")
-				}
-			}
-			provider.err = errors.New("SMTP unavailable")
-			if tt.delivered {
-				provider.err = nil
-			}
-			if delivered := queue.deliver(due[0]); delivered != tt.delivered {
-				t.Fatalf("delivered = %v, want %v", delivered, tt.delivered)
-			}
-			if released != tt.wantReleased {
-				t.Fatalf("released = %v, want %v", released, tt.wantReleased)
-			}
-			var count int
-			if err := db.Get(&count, `SELECT count(*) FROM notification_email_queue`); err != nil {
-				t.Fatal(err)
-			}
-			if count != tt.wantQueued {
-				t.Fatalf("queued emails = %d, want %d", count, tt.wantQueued)
-			}
-		})
-	}
-}
diff --git a/internal/notification/models/models.go b/internal/notification/models/models.go
index 3319056e..7622b71d 100644
--- a/internal/notification/models/models.go
+++ b/internal/notification/models/models.go
@@ -20,6 +20,7 @@ const (
 	NotificationTypeNewReply               NotificationType = "new_reply"
 	NotificationTypeNewReplyParticipating  NotificationType = "new_reply_participating"
 	NotificationTypeConversationReopened   NotificationType = "conversation_reopened"
+	NotificationTypeAutomation             NotificationType = "automation"
 	NotificationTypeSLAFirstResponseWarn   NotificationType = "sla_first_response_warning"
 	NotificationTypeSLAFirstResponseBreach NotificationType = "sla_first_response_breach"
 	NotificationTypeSLANextResponseWarn    NotificationType = "sla_next_response_warning"
@@ -27,7 +28,6 @@ const (
 	NotificationTypeSLAResolutionWarn      NotificationType = "sla_resolution_warning"
 	NotificationTypeSLAResolutionBreach    NotificationType = "sla_resolution_breach"
 
-	// Superseded by the per-metric types above, retained so existing notification rows still render.
 	NotificationTypeSLAWarning NotificationType = "sla_warning"
 	NotificationTypeSLABreach  NotificationType = "sla_breach"
 
diff --git a/internal/notification/push.go b/internal/notification/push.go
index a5f1feba..7b3c6899 100644
--- a/internal/notification/push.go
+++ b/internal/notification/push.go
@@ -31,47 +31,16 @@ const (
 
 type pushSender func(context.Context, []byte, PushSubscription, string, string, string) (*http.Response, error)
 
-type pushQueries struct {
-	List       *sqlx.Stmt `query:"get-push-subscriptions"`
-	Upsert     *sqlx.Stmt `query:"upsert-push-subscription"`
-	Delete     *sqlx.Stmt `query:"delete-push-subscription"`
-	DeleteByID *sqlx.Stmt `query:"delete-push-subscription-by-id"`
-}
-
-type PushSubscription struct {
-	ID       int    `db:"id" json:"id"`
-	Endpoint string `db:"endpoint" json:"endpoint"`
-	P256DH   string `db:"p256dh" json:"p256dh"`
-	Auth     string `db:"auth" json:"auth"`
-}
-
-type PushSubscriptionInput struct {
-	Endpoint string `json:"endpoint"`
-	P256DH   string `json:"p256dh"`
-	Auth     string `json:"auth"`
-}
-
 type pushDelivery struct {
 	UserID  int
 	Payload nmodels.PushPayload
 }
 
-type pushSubscriptionStore interface {
-	List(userID int) ([]PushSubscription, error)
-	Upsert(userID int, subscription PushSubscriptionInput) error
-	Delete(userID int, endpoint string) error
-	DeleteByID(id int) error
-}
-
 type pushSettingStore interface {
 	Get(key string) (types.JSONText, error)
 	Update(settings any) error
 }
 
-type sqlPushStore struct {
-	q pushQueries
-}
-
 type PushManager struct {
 	store       pushSubscriptionStore
 	lo          *logf.Logger
@@ -124,6 +93,19 @@ func (m *PushManager) PublicKey() string {
 	return m.publicKey
 }
 
+func (m *PushManager) Endpoints(userID int) ([]string, error) {
+	subscriptions, err := m.store.List(userID)
+	if err != nil {
+		m.lo.Error("error fetching push subscriptions", "user_id", userID, "error", err)
+		return nil, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	endpoints := make([]string, 0, len(subscriptions))
+	for _, subscription := range subscriptions {
+		endpoints = append(endpoints, subscription.Endpoint)
+	}
+	return endpoints, nil
+}
+
 func (m *PushManager) Upsert(userID int, subscription PushSubscriptionInput) error {
 	if !validPushSubscription(subscription) {
 		return envelope.NewError(envelope.InputError, m.i18n.T("notification.invalidPushSubscription"), nil)
@@ -215,29 +197,6 @@ func (m *PushManager) deliver(ctx context.Context, delivery pushDelivery) error
 	return nil
 }
 
-func (s *sqlPushStore) List(userID int) ([]PushSubscription, error) {
-	var subscriptions []PushSubscription
-	if err := s.q.List.Select(&subscriptions, userID); err != nil {
-		return nil, err
-	}
-	return subscriptions, nil
-}
-
-func (s *sqlPushStore) Upsert(userID int, subscription PushSubscriptionInput) error {
-	_, err := s.q.Upsert.Exec(userID, subscription.Endpoint, subscription.P256DH, subscription.Auth)
-	return err
-}
-
-func (s *sqlPushStore) Delete(userID int, endpoint string) error {
-	_, err := s.q.Delete.Exec(userID, endpoint)
-	return err
-}
-
-func (s *sqlPushStore) DeleteByID(id int) error {
-	_, err := s.q.DeleteByID.Exec(id)
-	return err
-}
-
 func loadVAPIDKeys(settings pushSettingStore) (string, string, error) {
 	privateKey, err := readStringSetting(settings, pushPrivateKeySetting)
 	if err != nil {
diff --git a/internal/notification/push_store.go b/internal/notification/push_store.go
new file mode 100644
index 00000000..295b13f0
--- /dev/null
+++ b/internal/notification/push_store.go
@@ -0,0 +1,57 @@
+package notifier
+
+import "github.com/jmoiron/sqlx"
+
+type pushQueries struct {
+	List       *sqlx.Stmt `query:"get-push-subscriptions"`
+	Upsert     *sqlx.Stmt `query:"upsert-push-subscription"`
+	Delete     *sqlx.Stmt `query:"delete-push-subscription"`
+	DeleteByID *sqlx.Stmt `query:"delete-push-subscription-by-id"`
+}
+
+type PushSubscription struct {
+	ID       int    `db:"id" json:"id"`
+	Endpoint string `db:"endpoint" json:"endpoint"`
+	P256DH   string `db:"p256dh" json:"p256dh"`
+	Auth     string `db:"auth" json:"auth"`
+}
+
+type PushSubscriptionInput struct {
+	Endpoint string `json:"endpoint"`
+	P256DH   string `json:"p256dh"`
+	Auth     string `json:"auth"`
+}
+
+type pushSubscriptionStore interface {
+	List(userID int) ([]PushSubscription, error)
+	Upsert(userID int, subscription PushSubscriptionInput) error
+	Delete(userID int, endpoint string) error
+	DeleteByID(id int) error
+}
+
+type sqlPushStore struct {
+	q pushQueries
+}
+
+func (s *sqlPushStore) List(userID int) ([]PushSubscription, error) {
+	var subscriptions []PushSubscription
+	if err := s.q.List.Select(&subscriptions, userID); err != nil {
+		return nil, err
+	}
+	return subscriptions, nil
+}
+
+func (s *sqlPushStore) Upsert(userID int, subscription PushSubscriptionInput) error {
+	_, err := s.q.Upsert.Exec(userID, subscription.Endpoint, subscription.P256DH, subscription.Auth)
+	return err
+}
+
+func (s *sqlPushStore) Delete(userID int, endpoint string) error {
+	_, err := s.q.Delete.Exec(userID, endpoint)
+	return err
+}
+
+func (s *sqlPushStore) DeleteByID(id int) error {
+	_, err := s.q.DeleteByID.Exec(id)
+	return err
+}
diff --git a/internal/notification/queries.sql b/internal/notification/queries.sql
index bfd5ab44..02f3f485 100644
--- a/internal/notification/queries.sql
+++ b/internal/notification/queries.sql
@@ -100,7 +100,7 @@ ON CONFLICT (user_id, notification_type, conversation_id) DO UPDATE SET
     subject = EXCLUDED.subject,
     content = EXCLUDED.content,
     message_created_at = EXCLUDED.message_created_at,
-    send_at = LEAST(notification_email_queue.send_at, EXCLUDED.send_at),
+    send_at = EXCLUDED.send_at,
     attempts = 0,
     queued_at = now(),
     updated_at = now();
diff --git a/schema.sql b/schema.sql
index dea80277..f74a5150 100644
--- a/schema.sql
+++ b/schema.sql
@@ -22,7 +22,7 @@ DROP TYPE IF EXISTS "sla_metric" CASCADE; CREATE TYPE "sla_metric" AS ENUM ('fir
 DROP TYPE IF EXISTS "sla_notification_type" CASCADE; CREATE TYPE "sla_notification_type" AS ENUM ('warning', 'breach');
 DROP TYPE IF EXISTS "activity_log_type" CASCADE; CREATE TYPE "activity_log_type" AS ENUM ('agent_login', 'agent_logout', 'agent_away', 'agent_away_reassigned', 'agent_online', 'agent_password_set', 'agent_role_permissions_changed', 'contact_deleted', 'contact_data_exported');
 DROP TYPE IF EXISTS "macro_visible_when" CASCADE; CREATE TYPE "macro_visible_when" AS ENUM ('replying', 'starting_conversation', 'adding_private_note');
-DROP TYPE IF EXISTS "user_notification_type" CASCADE; CREATE TYPE "user_notification_type" AS ENUM ('mention', 'assignment', 'sla_warning', 'sla_breach', 'new_reply', 'new_reply_participating', 'sla_first_response_warning', 'sla_first_response_breach', 'sla_next_response_warning', 'sla_next_response_breach', 'sla_resolution_warning', 'sla_resolution_breach', 'conversation_reopened');
+DROP TYPE IF EXISTS "user_notification_type" CASCADE; CREATE TYPE "user_notification_type" AS ENUM ('mention', 'assignment', 'sla_warning', 'sla_breach', 'new_reply', 'new_reply_participating', 'sla_first_response_warning', 'sla_first_response_breach', 'sla_next_response_warning', 'sla_next_response_breach', 'sla_resolution_warning', 'sla_resolution_breach', 'conversation_reopened', 'automation');
 DROP TYPE IF EXISTS "notification_channel" CASCADE; CREATE TYPE "notification_channel" AS ENUM ('in_app', 'email', 'push');
 DROP TYPE IF EXISTS "conversation_status_category" CASCADE; CREATE TYPE "conversation_status_category" AS ENUM ('open', 'waiting', 'resolved');
 DROP TYPE IF EXISTS "ai_knowledge_type" CASCADE; CREATE TYPE "ai_knowledge_type" AS ENUM ('snippet');

From 6fd04dee1bea873b80fd537d3516296599617790 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 16 Sep 2026 00:31:04 +0530
Subject: [PATCH 061/178] remove message time from email queue

---
 internal/conversation/conversation.go     |  1 -
 internal/migrations/v2.9.0.go             |  6 --
 internal/migrations/v2.9.0_test.go        | 17 ++----
 internal/notification/channels/email.go   | 15 +++--
 internal/notification/email_queue.go      | 26 ++++-----
 internal/notification/email_queue_test.go | 68 ++++++++---------------
 internal/notification/models/models.go    | 16 +++---
 internal/notification/queries.sql         |  7 +--
 schema.sql                                |  1 -
 9 files changed, 58 insertions(+), 99 deletions(-)

diff --git a/internal/conversation/conversation.go b/internal/conversation/conversation.go
index e2d53aba..a4122b51 100644
--- a/internal/conversation/conversation.go
+++ b/internal/conversation/conversation.go
@@ -1369,7 +1369,6 @@ func (m *Manager) sendReplyNotification(conversation models.Conversation, messag
 		MessageID:        null.IntFrom(message.ID),
 		ConversationUUID: conversation.UUID,
 		MessageUUID:      message.UUID,
-		MessageCreatedAt: null.TimeFrom(message.CreatedAt),
 	}); err != nil {
 		m.lo.Error("error sending reply notification", "type", group.nType, "error", err)
 	}
diff --git a/internal/migrations/v2.9.0.go b/internal/migrations/v2.9.0.go
index 96f9d959..5dcabb68 100644
--- a/internal/migrations/v2.9.0.go
+++ b/internal/migrations/v2.9.0.go
@@ -96,7 +96,6 @@ func V2_9_0(db *sqlx.DB, fs stuffbin.FileSystem, ko *koanf.Koanf) error {
 			subject TEXT NOT NULL,
 			content TEXT NOT NULL,
 			queued_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
-			message_created_at TIMESTAMPTZ,
 			send_at TIMESTAMPTZ NOT NULL,
 			attempts INTEGER NOT NULL DEFAULT 0,
 			CONSTRAINT constraint_uniq_notification_email_queue UNIQUE (user_id, notification_type, conversation_id)
@@ -109,11 +108,6 @@ func V2_9_0(db *sqlx.DB, fs stuffbin.FileSystem, ko *koanf.Koanf) error {
 	`); err != nil {
 		return err
 	}
-	if _, err := db.Exec(`
-		ALTER TABLE notification_email_queue ADD COLUMN IF NOT EXISTS message_created_at TIMESTAMPTZ;
-	`); err != nil {
-		return err
-	}
 	if _, err := db.Exec(`
 		ALTER TABLE notification_email_queue ADD COLUMN IF NOT EXISTS attempts INTEGER NOT NULL DEFAULT 0;
 	`); err != nil {
diff --git a/internal/migrations/v2.9.0_test.go b/internal/migrations/v2.9.0_test.go
index d8e6f0d7..d68b4bf6 100644
--- a/internal/migrations/v2.9.0_test.go
+++ b/internal/migrations/v2.9.0_test.go
@@ -129,14 +129,11 @@ func TestV2_9_0NotificationMigration(t *testing.T) {
 func TestV2_9_0PreservesExistingQueuedEmails(t *testing.T) {
 	db := testutil.NewDB(t, "migration_v2_9_0_queue")
 	columnQuery := `SELECT data_type || ':' || is_nullable || ':' || COALESCE(column_default, '') FROM information_schema.columns WHERE table_name = 'notification_email_queue' AND column_name = $1`
-	var expectedMessageTimeColumn, expectedAttemptsColumn string
-	if err := db.Get(&expectedMessageTimeColumn, columnQuery, "message_created_at"); err != nil {
-		t.Fatal(err)
-	}
+	var expectedAttemptsColumn string
 	if err := db.Get(&expectedAttemptsColumn, columnQuery, "attempts"); err != nil {
 		t.Fatal(err)
 	}
-	db.MustExec(`ALTER TABLE notification_email_queue DROP COLUMN message_created_at, DROP COLUMN attempts`)
+	db.MustExec(`ALTER TABLE notification_email_queue DROP COLUMN attempts`)
 	db.MustExec(`INSERT INTO users (type, email, first_name, last_name) VALUES ('agent', 'queued@example.com', 'Agent', '')`)
 	db.MustExec(`INSERT INTO notification_email_queue (user_id, notification_type, recipient_email, subject, content, send_at) VALUES ((SELECT id FROM users LIMIT 1), 'new_reply', 'queued@example.com', 'Reply', 'Pending reply', now())`)
 	for range 2 {
@@ -144,21 +141,15 @@ func TestV2_9_0PreservesExistingQueuedEmails(t *testing.T) {
 			t.Fatal(err)
 		}
 	}
-	var actualMessageTimeColumn, actualAttemptsColumn string
-	if err := db.Get(&actualMessageTimeColumn, columnQuery, "message_created_at"); err != nil {
-		t.Fatal(err)
-	}
+	var actualAttemptsColumn string
 	if err := db.Get(&actualAttemptsColumn, columnQuery, "attempts"); err != nil {
 		t.Fatal(err)
 	}
-	if actualMessageTimeColumn != expectedMessageTimeColumn {
-		t.Fatalf("message time column = %q, schema column = %q", actualMessageTimeColumn, expectedMessageTimeColumn)
-	}
 	if actualAttemptsColumn != expectedAttemptsColumn {
 		t.Fatalf("attempts column = %q, schema column = %q", actualAttemptsColumn, expectedAttemptsColumn)
 	}
 	var preserved bool
-	if err := db.Get(&preserved, `SELECT content = 'Pending reply' AND message_created_at IS NULL AND attempts = 0 FROM notification_email_queue`); err != nil {
+	if err := db.Get(&preserved, `SELECT content = 'Pending reply' AND attempts = 0 FROM notification_email_queue`); err != nil {
 		t.Fatal(err)
 	}
 	if !preserved {
diff --git a/internal/notification/channels/email.go b/internal/notification/channels/email.go
index 9d2b71d7..44cf367a 100644
--- a/internal/notification/channels/email.go
+++ b/internal/notification/channels/email.go
@@ -29,14 +29,13 @@ func (p *email) Send(delivery Delivery) Result {
 		return Result{}
 	}
 	message := models.Email{
-		UserID:           delivery.Recipient.UserID,
-		NotificationID:   delivery.NotificationID,
-		Type:             delivery.Notification.Type,
-		ConversationID:   delivery.Notification.ConversationID,
-		MessageCreatedAt: delivery.Notification.MessageCreatedAt,
-		Recipient:        notification.Recipient,
-		Subject:          notification.Subject,
-		Content:          notification.Content,
+		UserID:         delivery.Recipient.UserID,
+		NotificationID: delivery.NotificationID,
+		Type:           delivery.Notification.Type,
+		ConversationID: delivery.Notification.ConversationID,
+		Recipient:      notification.Recipient,
+		Subject:        notification.Subject,
+		Content:        notification.Content,
 	}
 	if notification.Delay > 0 {
 		return Result{Sent: p.queue.SendAfter(message, notification.Delay)}
diff --git a/internal/notification/email_queue.go b/internal/notification/email_queue.go
index 220c01c5..9dbfd6ef 100644
--- a/internal/notification/email_queue.go
+++ b/internal/notification/email_queue.go
@@ -33,17 +33,17 @@ type emailQueueQueries struct {
 }
 
 type queuedEmail struct {
-	ID               int64                   `db:"id"`
-	ClaimedAt        time.Time               `db:"updated_at"`
-	UserID           int                     `db:"user_id"`
-	NotificationID   null.Int                `db:"notification_id"`
-	Type             models.NotificationType `db:"notification_type"`
-	ConversationID   null.Int                `db:"conversation_id"`
-	Attempts         int                     `db:"attempts"`
-	Recipient        string                  `db:"recipient_email"`
-	Subject          string                  `db:"subject"`
-	Content          string                  `db:"content"`
-	MessageCreatedAt null.Time               `db:"message_created_at"`
+	ID             int64                   `db:"id"`
+	ClaimedAt      time.Time               `db:"updated_at"`
+	UserID         int                     `db:"user_id"`
+	NotificationID null.Int                `db:"notification_id"`
+	Type           models.NotificationType `db:"notification_type"`
+	ConversationID null.Int                `db:"conversation_id"`
+	Attempts       int                     `db:"attempts"`
+	Recipient      string                  `db:"recipient_email"`
+	Subject        string                  `db:"subject"`
+	Content        string                  `db:"content"`
+	QueuedAt       time.Time               `db:"queued_at"`
 }
 
 type EmailQueue struct {
@@ -85,7 +85,7 @@ func (q *EmailQueue) Send(e models.Email) bool {
 
 func (q *EmailQueue) SendAfter(e models.Email, delay time.Duration) bool {
 	if _, err := q.q.Enqueue.Exec(e.UserID, e.NotificationID, e.Type, e.ConversationID, e.Recipient,
-		e.Subject, e.Content, time.Now().Add(delay), e.MessageCreatedAt); err != nil {
+		e.Subject, e.Content, time.Now().Add(delay)); err != nil {
 		q.lo.Error("error queueing notification email", "user_id", e.UserID, "type", e.Type, "error", err)
 		return false
 	}
@@ -127,7 +127,7 @@ func (q *EmailQueue) due() []queuedEmail {
 
 func (q *EmailQueue) seen(e queuedEmail) (bool, error) {
 	var seen bool
-	if err := q.q.IsSeen.Get(&seen, e.UserID, e.NotificationID, e.ConversationID, e.MessageCreatedAt); err != nil {
+	if err := q.q.IsSeen.Get(&seen, e.UserID, e.NotificationID, e.ConversationID, e.QueuedAt); err != nil {
 		q.lo.Error("error checking notification seen state", "user_id", e.UserID, "type", e.Type, "error", err)
 		return false, err
 	}
diff --git a/internal/notification/email_queue_test.go b/internal/notification/email_queue_test.go
index 348c207d..4e346c82 100644
--- a/internal/notification/email_queue_test.go
+++ b/internal/notification/email_queue_test.go
@@ -24,7 +24,7 @@ func (p *emailDeliveryProvider) Name() string {
 	return ProviderEmail
 }
 
-func TestDelayedReplyEmailUsesMessageTime(t *testing.T) {
+func TestDelayedReplyEmailUsesQueueTime(t *testing.T) {
 	db := testutil.NewDB(t, "reply_email_time")
 	var userID, inboxID, convID int
 	if err := db.Get(&userID, `INSERT INTO users (type, email, first_name, last_name) VALUES ('agent', 'read@example.com', 'Agent', '') RETURNING id`); err != nil {
@@ -47,7 +47,6 @@ func TestDelayedReplyEmailUsesMessageTime(t *testing.T) {
 		Pipeline: channels.NewPipeline(channels.NewEmail(queue)),
 		Prefs:    fakePreferences{channels: map[int][]models.NotificationChannel{userID: {models.NotificationChannelEmail}}},
 	})
-	messageTime := time.Now().UTC().Add(-time.Minute).Truncate(time.Microsecond)
 	n := models.Notification{
 		Type: models.NotificationTypeNewReply,
 		Recipients: []models.Recipient{{
@@ -59,22 +58,25 @@ func TestDelayedReplyEmailUsesMessageTime(t *testing.T) {
 				Delay:     time.Minute,
 			},
 		}},
-		ConversationID:   null.IntFrom(convID),
-		MessageCreatedAt: null.TimeFrom(messageTime),
+		ConversationID: null.IntFrom(convID),
 	}
-	db.MustExec(`INSERT INTO conversation_last_seen (user_id, conversation_id, last_seen_at) VALUES ($1, $2, $3)`, userID, convID, messageTime.Add(-time.Second))
+	db.MustExec(`INSERT INTO conversation_last_seen (user_id, conversation_id, last_seen_at) VALUES ($1, $2, now() - interval '1 hour')`, userID, convID)
 	for _, tt := range []struct {
-		name     string
-		readTime time.Time
-		want     bool
+		name       string
+		readOffset time.Duration
+		want       bool
 	}{
-		{"read before reply", messageTime.Add(-time.Second), false},
-		{"read at reply", messageTime, true},
-		{"read before enqueue", messageTime.Add(time.Second), true},
+		{"read before queue", -time.Second, false},
+		{"read at queue", 0, true},
+		{"read after queue", time.Second, true},
 	} {
 		t.Run(tt.name, func(t *testing.T) {
-			db.MustExec(`UPDATE conversation_last_seen SET last_seen_at = $1`, tt.readTime)
 			d.Send(n)
+			var queuedAt time.Time
+			if err := db.Get(&queuedAt, `SELECT queued_at FROM notification_email_queue`); err != nil {
+				t.Fatal(err)
+			}
+			db.MustExec(`UPDATE conversation_last_seen SET last_seen_at = $1`, queuedAt.Add(tt.readOffset))
 			db.MustExec(`UPDATE notification_email_queue SET send_at = now() - interval '1 second'`)
 			due := queue.due()
 			if len(due) != 1 {
@@ -91,28 +93,31 @@ func TestDelayedReplyEmailUsesMessageTime(t *testing.T) {
 	}
 
 	t.Run("coalesced reply uses latest message", func(t *testing.T) {
-		db.MustExec(`UPDATE conversation_last_seen SET last_seen_at = $1`, messageTime.Add(time.Second))
+		db.MustExec(`UPDATE conversation_last_seen SET last_seen_at = now() - interval '1 hour'`)
 		d.Send(n)
 		var firstSendAt time.Time
 		if err := db.Get(&firstSendAt, `SELECT send_at FROM notification_email_queue`); err != nil {
 			t.Fatal(err)
 		}
-		n.MessageCreatedAt = null.TimeFrom(messageTime.Add(2 * time.Second))
 		n.Recipients[0].Email.Content = "Second reply"
 		n.Recipients[0].Email.Delay = 2 * time.Minute
 		d.Send(n)
-		var secondSendAt time.Time
-		if err := db.Get(&secondSendAt, `SELECT send_at FROM notification_email_queue`); err != nil {
+		var second struct {
+			SendAt   time.Time `db:"send_at"`
+			QueuedAt time.Time `db:"queued_at"`
+		}
+		if err := db.Get(&second, `SELECT send_at, queued_at FROM notification_email_queue`); err != nil {
 			t.Fatal(err)
 		}
-		if !secondSendAt.After(firstSendAt) {
-			t.Fatalf("coalesced email send time = %v, want after %v", secondSendAt, firstSendAt)
+		if !second.SendAt.After(firstSendAt) {
+			t.Fatalf("coalesced email send time = %v, want after %v", second.SendAt, firstSendAt)
 		}
 		db.MustExec(`UPDATE notification_email_queue SET send_at = now() - interval '1 second'`)
 		due := queue.due()
 		if len(due) != 1 || due[0].Content != "Second reply" {
 			t.Fatalf("unexpected coalesced emails: %#v", due)
 		}
+		db.MustExec(`UPDATE conversation_last_seen SET last_seen_at = $1`, second.QueuedAt.Add(-time.Second))
 		seen, err := queue.seen(due[0])
 		if err != nil {
 			t.Fatal(err)
@@ -120,7 +125,7 @@ func TestDelayedReplyEmailUsesMessageTime(t *testing.T) {
 		if seen {
 			t.Fatal("unread second reply suppressed")
 		}
-		db.MustExec(`UPDATE conversation_last_seen SET last_seen_at = $1`, messageTime.Add(3*time.Second))
+		db.MustExec(`UPDATE conversation_last_seen SET last_seen_at = $1`, second.QueuedAt)
 		seen, err = queue.seen(due[0])
 		if err != nil {
 			t.Fatal(err)
@@ -129,31 +134,6 @@ func TestDelayedReplyEmailUsesMessageTime(t *testing.T) {
 			t.Fatal("read second reply was not suppressed")
 		}
 	})
-
-	t.Run("legacy email without message time", func(t *testing.T) {
-		n.MessageCreatedAt = null.Time{}
-		d.Send(n)
-		db.MustExec(`UPDATE notification_email_queue SET send_at = now() - interval '1 second'`)
-		due := queue.due()
-		if len(due) != 1 {
-			t.Fatalf("queued emails = %d, want 1", len(due))
-		}
-		seen, err := queue.seen(due[0])
-		if err != nil {
-			t.Fatal(err)
-		}
-		if seen {
-			t.Fatal("legacy unread email suppressed")
-		}
-		db.MustExec(`UPDATE conversation_last_seen SET last_seen_at = now()`)
-		seen, err = queue.seen(due[0])
-		if err != nil {
-			t.Fatal(err)
-		}
-		if !seen {
-			t.Fatal("legacy read email was not suppressed")
-		}
-	})
 }
 
 func TestDelayedEmailSeenCheckReturnsDatabaseError(t *testing.T) {
diff --git a/internal/notification/models/models.go b/internal/notification/models/models.go
index 7622b71d..5574cbd5 100644
--- a/internal/notification/models/models.go
+++ b/internal/notification/models/models.go
@@ -83,7 +83,6 @@ type Notification struct {
 	Body             null.String
 	ConversationID   null.Int
 	MessageID        null.Int
-	MessageCreatedAt null.Time
 	ActorID          null.Int
 	Meta             json.RawMessage
 	ConversationUUID string
@@ -100,14 +99,13 @@ type EmailNotification struct {
 }
 
 type Email struct {
-	UserID           int
-	NotificationID   null.Int
-	Type             NotificationType
-	ConversationID   null.Int
-	Recipient        string
-	Subject          string
-	Content          string
-	MessageCreatedAt null.Time
+	UserID         int
+	NotificationID null.Int
+	Type           NotificationType
+	ConversationID null.Int
+	Recipient      string
+	Subject        string
+	Content        string
 }
 
 type PushPayload struct {
diff --git a/internal/notification/queries.sql b/internal/notification/queries.sql
index 02f3f485..c73e48a0 100644
--- a/internal/notification/queries.sql
+++ b/internal/notification/queries.sql
@@ -92,14 +92,13 @@ SELECT COALESCE((SELECT is_read FROM user_notifications WHERE id = $2 AND user_i
 
 -- name: enqueue-notification-email
 INSERT INTO notification_email_queue
-    (user_id, notification_id, notification_type, conversation_id, recipient_email, subject, content, send_at, message_created_at)
-VALUES ($1, $2, $3, $4, $5, $6, $7, $8, $9)
+    (user_id, notification_id, notification_type, conversation_id, recipient_email, subject, content, send_at)
+VALUES ($1, $2, $3, $4, $5, $6, $7, $8)
 ON CONFLICT (user_id, notification_type, conversation_id) DO UPDATE SET
     notification_id = EXCLUDED.notification_id,
     recipient_email = EXCLUDED.recipient_email,
     subject = EXCLUDED.subject,
     content = EXCLUDED.content,
-    message_created_at = EXCLUDED.message_created_at,
     send_at = EXCLUDED.send_at,
     attempts = 0,
     queued_at = now(),
@@ -119,7 +118,7 @@ SET send_at = $2, updated_at = now()
 FROM due
 WHERE q.id = due.id
 RETURNING q.id, q.updated_at, q.user_id, q.notification_id, q.notification_type, q.conversation_id, q.attempts,
-    q.recipient_email, q.subject, q.content, COALESCE(q.message_created_at, q.queued_at) AS message_created_at;
+    q.recipient_email, q.subject, q.content, q.queued_at;
 
 -- name: delete-claimed-notification-email
 DELETE FROM notification_email_queue WHERE id = $1 AND updated_at = $2;
diff --git a/schema.sql b/schema.sql
index f74a5150..5e090136 100644
--- a/schema.sql
+++ b/schema.sql
@@ -991,7 +991,6 @@ CREATE TABLE notification_email_queue (
 	subject TEXT NOT NULL,
 	content TEXT NOT NULL,
 	queued_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
-	message_created_at TIMESTAMPTZ,
 	send_at TIMESTAMPTZ NOT NULL,
 	attempts INTEGER NOT NULL DEFAULT 0,
 	CONSTRAINT constraint_uniq_notification_email_queue UNIQUE (user_id, notification_type, conversation_id)

From ef53a4810617313a59bb7156fd69db195308f0a7 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 16 Sep 2026 01:43:39 +0530
Subject: [PATCH 062/178] revert chagnes to render.go

---
 internal/template/render.go      | 15 ++++---
 internal/template/render_test.go | 68 --------------------------------
 2 files changed, 7 insertions(+), 76 deletions(-)
 delete mode 100644 internal/template/render_test.go

diff --git a/internal/template/render.go b/internal/template/render.go
index 9c72bd99..479ddb61 100644
--- a/internal/template/render.go
+++ b/internal/template/render.go
@@ -3,9 +3,8 @@ package template
 import (
 	"bytes"
 	"fmt"
-	htmltemplate "html/template"
 	"strings"
-	texttemplate "text/template"
+	"text/template"
 
 	"github.com/valyala/fasthttp"
 )
@@ -33,7 +32,7 @@ const (
 // RenderString renders Go template variables in the given content string
 // without wrapping it in the base email template. Returns original content on any error.
 func (m *Manager) RenderString(data any, content string) string {
-	t, err := htmltemplate.New("content").Funcs(m.funcMap).Parse(content)
+	t, err := template.New("content").Funcs(m.funcMap).Parse(content)
 	if err != nil {
 		return content
 	}
@@ -68,12 +67,12 @@ func (m *Manager) RenderEmailWithTemplate(data any, content string) (string, err
 		defaultTmpl.Body = `{{ template "content" . }}`
 	}
 
-	baseTemplate, err := htmltemplate.New(TmplBase).Funcs(m.funcMap).Parse(defaultTmpl.Body)
+	baseTemplate, err := template.New(TmplBase).Funcs(m.funcMap).Parse(defaultTmpl.Body)
 	if err != nil {
 		return "", fmt.Errorf("parsing base template: %w", err)
 	}
 
-	contentTemplate, err := htmltemplate.New(TmplContent).Funcs(m.funcMap).Parse(content)
+	contentTemplate, err := template.New(TmplContent).Funcs(m.funcMap).Parse(content)
 	if err != nil {
 		return "", fmt.Errorf("parsing content template: %w", err)
 	}
@@ -103,7 +102,7 @@ func (m *Manager) RenderStoredEmailTemplate(name string, data any) (string, stri
 
 	executeSubjectTemplate := func(subject string) (string, error) {
 		var sb strings.Builder
-		subjectTmpl, err := texttemplate.New("subject").Funcs(m.funcMap).Parse(subject)
+		subjectTmpl, err := template.New("subject").Funcs(m.funcMap).Parse(subject)
 		if err != nil {
 			return "", fmt.Errorf("parsing subject template: %w", err)
 		}
@@ -122,12 +121,12 @@ func (m *Manager) RenderStoredEmailTemplate(name string, data any) (string, stri
 		defaultTmpl.Body = `{{ template "content" . }}`
 	}
 
-	baseTemplate, err := htmltemplate.New(TmplBase).Funcs(m.funcMap).Parse(defaultTmpl.Body)
+	baseTemplate, err := template.New(TmplBase).Funcs(m.funcMap).Parse(defaultTmpl.Body)
 	if err != nil {
 		return "", "", fmt.Errorf("parsing base template: %w", err)
 	}
 
-	contentTemplate, err := htmltemplate.New(TmplContent).Funcs(m.funcMap).Parse(tmpl.Body)
+	contentTemplate, err := template.New(TmplContent).Funcs(m.funcMap).Parse(tmpl.Body)
 	if err != nil {
 		return "", "", fmt.Errorf("parsing content template: %w", err)
 	}
diff --git a/internal/template/render_test.go b/internal/template/render_test.go
deleted file mode 100644
index bbf18730..00000000
--- a/internal/template/render_test.go
+++ /dev/null
@@ -1,68 +0,0 @@
-package template
-
-import (
-	htmltemplate "html/template"
-	"strings"
-	"testing"
-
-	"github.com/abhinavxd/libredesk/internal/testutil"
-	"github.com/zerodha/logf"
-)
-
-func TestRenderStringEscapesDataAndPreservesTemplateMarkup(t *testing.T) {
-	m := &Manager{funcMap: htmltemplate.FuncMap{}}
-	content := m.RenderString(map[string]any{
-		"Contact": map[string]any{"FullName": "<b>attacker</b>"},
-	}, `<p>Hi {{ .Contact.FullName }}</p>`)
-
-	if !strings.Contains(content, "<p>Hi &lt;b&gt;attacker&lt;/b&gt;</p>") {
-		t.Fatalf("unexpected content: %s", content)
-	}
-}
-
-func TestRenderEmailWithTemplateEscapesDataAndPreservesTemplateMarkup(t *testing.T) {
-	db := testutil.NewDB(t, "outgoing_email_template_escape")
-	lo := logf.New(logf.Opts{})
-	m, err := New(&lo, db, nil, nil, htmltemplate.FuncMap{}, testutil.NewI18n(t))
-	if err != nil {
-		t.Fatal(err)
-	}
-
-	content, err := m.RenderEmailWithTemplate(map[string]any{
-		"Contact": map[string]any{"FullName": "<b>attacker</b>"},
-	}, `<p>Hi {{ .Contact.FullName }}</p>`)
-	if err != nil {
-		t.Fatal(err)
-	}
-	if !strings.Contains(content, "<p>Hi &lt;b&gt;attacker&lt;/b&gt;</p>") {
-		t.Fatalf("unexpected content: %s", content)
-	}
-}
-
-func TestRenderStoredEmailTemplateEscapesUntrustedHTML(t *testing.T) {
-	db := testutil.NewDB(t, "stored_email_template_escape")
-	lo := logf.New(logf.Opts{})
-	m, err := New(&lo, db, nil, nil, htmltemplate.FuncMap{"RootURL": func() string { return "http://localhost" }}, testutil.NewI18n(t))
-	if err != nil {
-		t.Fatal(err)
-	}
-
-	content, _, err := m.RenderStoredEmailTemplate(TmplNewReply, map[string]any{
-		"Author": map[string]any{"FullName": "<b>attacker</b>"},
-		"Conversation": map[string]any{
-			"ReferenceNumber": 42,
-			"Subject":         "<i>subject</i>",
-			"UUID":            "conversation-uuid",
-		},
-		"Message": map[string]any{"Content": htmltemplate.HTML("<strong>safe message</strong>")},
-	})
-	if err != nil {
-		t.Fatal(err)
-	}
-	if !strings.Contains(content, "&lt;b&gt;attacker&lt;/b&gt;") || !strings.Contains(content, "&lt;i&gt;subject&lt;/i&gt;") {
-		t.Fatalf("untrusted HTML was not escaped: %s", content)
-	}
-	if !strings.Contains(content, "<strong>safe message</strong>") {
-		t.Fatalf("trusted message HTML was escaped: %s", content)
-	}
-}

From 43c007ef9e0a90a2f75ccc18db74608dfd5ea17d Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 16 Sep 2026 01:54:35 +0530
Subject: [PATCH 063/178] improve notification previews and editor AI

Show the latest reply in alerts without quoted email history. Share AI prompts across conversation editors and clarify browser notification settings.
---
 frontend/apps/main/src/App.vue                |  3 +
 .../components/editor/ConversationEditor.vue  |  9 +-
 .../src/components/editor/EditorToolbar.vue   | 37 +++++++--
 .../src/features/admin/templates/defaults.js  | 12 ++-
 .../src/features/conversation/ReplyBox.vue    | 14 +---
 .../features/conversation/ReplyBoxContent.vue | 22 ++---
 frontend/apps/main/src/stores/aiPrompt.js     | 81 ++++++++++++------
 .../NotificationPreferences.test.js           | 82 +++++++++++++++----
 .../notifications/NotificationPreferences.vue | 25 +++++-
 .../src/views/admin/ai/AIEditorPrompts.vue    | 34 ++++----
 i18n/en-US.json                               |  3 +-
 internal/conversation/conversation.go         | 18 +++-
 .../conversation/conversation_reference.go    | 10 ---
 .../conversation_reference_test.go            | 21 +----
 internal/conversation/notification_test.go    | 39 +++++++++
 internal/migrations/v2.9.0.go                 | 12 ++-
 schema.sql                                    | 12 ++-
 17 files changed, 284 insertions(+), 150 deletions(-)

diff --git a/frontend/apps/main/src/App.vue b/frontend/apps/main/src/App.vue
index 5012311b..b9dfe330 100644
--- a/frontend/apps/main/src/App.vue
+++ b/frontend/apps/main/src/App.vue
@@ -92,6 +92,7 @@ import { useTagStore } from './stores/tag'
 import { useCustomAttributeStore } from './stores/customAttributes'
 import { useIdleDetection } from './composables/useIdleDetection'
 import { useNotificationStore } from './stores/notification'
+import { useAiPromptStore } from '@main/stores/aiPrompt'
 import { useViewStore } from './stores/view'
 import { useKeyboardShortcutsDialog } from './composables/useKeyboardShortcutsDialog'
 import KeyboardShortcutsDialog from './components/KeyboardShortcutsDialog.vue'
@@ -166,6 +167,7 @@ const openCreateConversationDialog = ref(false)
 const createConversationContact = ref(null)
 const { t } = useI18n()
 const notificationStore = useNotificationStore()
+const aiPromptStore = useAiPromptStore()
 const pushNotifications = usePushNotifications()
 
 // Update browser tab title with unread notification count.
@@ -217,6 +219,7 @@ const initStores = async () => {
     slaStore.fetchSlas(),
     tagStore.fetchTags(),
     customAttributeStore.fetchCustomAttributes(),
+    aiPromptStore.fetchPrompts(),
     refreshPushSubscription()
   ])
 }
diff --git a/frontend/apps/main/src/components/editor/ConversationEditor.vue b/frontend/apps/main/src/components/editor/ConversationEditor.vue
index 9b7c7070..a0ae2cf1 100644
--- a/frontend/apps/main/src/components/editor/ConversationEditor.vue
+++ b/frontend/apps/main/src/components/editor/ConversationEditor.vue
@@ -12,9 +12,9 @@
     >
       <EditorToolbar
         :editor="editor"
-        :ai-prompts="aiPrompts"
+        show-ai
         @open-link="linkDialog?.open()"
-        @ai-prompt="emitPrompt"
+        @ai-generation-change="emit('aiGenerationChange', $event)"
       />
     </BubbleMenu>
     <EditorContent :editor="editor" class="native-html" />
@@ -41,7 +41,6 @@ const props = defineProps({
   insertContent: String,
   messageType: String,
   autoFocus: { type: Boolean, default: true },
-  aiPrompts: { type: Array, default: () => [] },
   disabled: { type: Boolean, default: false },
   enableMentions: { type: Boolean, default: false },
   getSuggestions: { type: Function, default: null },
@@ -53,7 +52,7 @@ const props = defineProps({
 
 const emit = defineEmits([
   'send',
-  'aiPromptSelected',
+  'aiGenerationChange',
   'mentionsChanged',
   'filesDropped',
   'toggleMessageType'
@@ -61,8 +60,6 @@ const emit = defineEmits([
 
 const linkDialog = ref(null)
 
-const emitPrompt = (key) => emit('aiPromptSelected', key)
-
 // Suppress the formatting bubble when an image node is selected so it
 // doesn't fight with the image's own size/remove toolbar.
 const shouldShowBubble = ({ editor: e, state }) => {
diff --git a/frontend/apps/main/src/components/editor/EditorToolbar.vue b/frontend/apps/main/src/components/editor/EditorToolbar.vue
index 79fab042..08085f95 100644
--- a/frontend/apps/main/src/components/editor/EditorToolbar.vue
+++ b/frontend/apps/main/src/components/editor/EditorToolbar.vue
@@ -1,8 +1,14 @@
 <template>
   <div class="flex flex-wrap gap-1 items-center">
-    <DropdownMenu v-if="aiPrompts.length > 0">
+    <DropdownMenu v-if="showAi && aiPromptStore.prompts.length > 0">
       <DropdownMenuTrigger as-child>
-        <Button type="button" size="sm" variant="ghost" class="flex items-center justify-center">
+        <Button
+          type="button"
+          size="sm"
+          variant="ghost"
+          class="flex items-center justify-center"
+          :disabled="isGenerating"
+        >
           <span class="flex items-center">
             <span class="text-medium">AI</span>
             <Bot size="14" class="ml-1" />
@@ -12,9 +18,9 @@
       </DropdownMenuTrigger>
       <DropdownMenuContent>
         <DropdownMenuItem
-          v-for="prompt in aiPrompts"
+          v-for="prompt in aiPromptStore.prompts"
           :key="prompt.key"
-          @select="emit('aiPrompt', prompt.key)"
+          @select="complete(prompt.key)"
         >
           {{ prompt.title }}
         </DropdownMenuItem>
@@ -331,6 +337,7 @@
 </template>
 
 <script setup>
+import { ref } from 'vue'
 import {
   ChevronDown,
   Bold,
@@ -363,16 +370,20 @@ import {
   DropdownMenuTrigger
 } from '@shared-ui/components/ui/dropdown-menu'
 import { Tooltip, TooltipContent, TooltipTrigger } from '@shared-ui/components/ui/tooltip'
+import { useAiPromptStore } from '@main/stores/aiPrompt'
 import { codeBlockLanguages } from './codeLanguages'
 
 const props = defineProps({
   editor: { type: Object, default: null },
   showArticleTools: { type: Boolean, default: false },
-  aiPrompts: { type: Array, default: () => [] },
+  showAi: { type: Boolean, default: false },
   enableInlineImages: { type: Boolean, default: false }
 })
 
-const emit = defineEmits(['openLink', 'openYoutube', 'openImage', 'aiPrompt'])
+const emit = defineEmits(['openLink', 'openYoutube', 'openImage', 'aiGenerationChange'])
+
+const aiPromptStore = useAiPromptStore()
+const isGenerating = ref(false)
 
 const alignments = [
   { dir: 'left', icon: AlignLeft, label: 'editor.tooltip.alignLeft' },
@@ -398,4 +409,18 @@ const getCurrentHeadingText = () => {
   }
   return 'P'
 }
+
+const complete = async (promptKey) => {
+  if (!props.editor || isGenerating.value) return
+
+  isGenerating.value = true
+  emit('aiGenerationChange', true)
+  try {
+    const content = await aiPromptStore.complete(promptKey, props.editor.getHTML())
+    if (content !== null) props.editor.commands.setContent(content)
+  } finally {
+    isGenerating.value = false
+    emit('aiGenerationChange', false)
+  }
+}
 </script>
diff --git a/frontend/apps/main/src/features/admin/templates/defaults.js b/frontend/apps/main/src/features/admin/templates/defaults.js
index 362331bb..4df4b92d 100644
--- a/frontend/apps/main/src/features/admin/templates/defaults.js
+++ b/frontend/apps/main/src/features/admin/templates/defaults.js
@@ -21,7 +21,9 @@ export const BUILT_IN_TEMPLATE_BODIES = {
     Subject: {{ .Conversation.Subject }}
 </div>
 
-<blockquote>{{ .Message.Content }}</blockquote>
+<blockquote style="background-color: #f5f5f5; padding: 12px; margin: 16px 0; border-left: 4px solid #ddd;">
+{{ .Message.Content }}
+</blockquote>
 
 <p>
     <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
@@ -38,7 +40,9 @@ export const BUILT_IN_TEMPLATE_BODIES = {
     Subject: {{ .Conversation.Subject }}
 </div>
 
-<blockquote>{{ .Message.Content }}</blockquote>
+<blockquote style="background-color: #f5f5f5; padding: 12px; margin: 16px 0; border-left: 4px solid #ddd;">
+{{ .Message.Content }}
+</blockquote>
 
 <p>
     <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
@@ -55,7 +59,9 @@ export const BUILT_IN_TEMPLATE_BODIES = {
     Subject: {{ .Conversation.Subject }}
 </div>
 
-<blockquote>{{ .Message.Content }}</blockquote>
+<blockquote style="background-color: #f5f5f5; padding: 12px; margin: 16px 0; border-left: 4px solid #ddd;">
+{{ .Message.Content }}
+</blockquote>
 
 <p>
     <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
diff --git a/frontend/apps/main/src/features/conversation/ReplyBox.vue b/frontend/apps/main/src/features/conversation/ReplyBox.vue
index edee9956..5c7acda6 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBox.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBox.vue
@@ -55,7 +55,6 @@
           v-if="isEditorFullscreen"
           ref="fullscreenContentRef"
           :isFullscreen="true"
-          :aiPrompts="aiPrompts"
           :isSending="isSending"
           :isDraftLoading="isDraftLoading"
           :uploadingFiles="uploadingFiles"
@@ -75,7 +74,7 @@
           @fileUpload="handleFileUpload"
           @fileDelete="handleFileDelete"
           @filesDropped="uploadFiles"
-          @aiPromptSelected="handleAiPromptSelected"
+          @aiGenerationChange="isGenerating = $event"
           :isGenerating="isGenerating"
           :canSendReply="canSendReply"
           :canSendPrivateNote="canSendPrivateNote"
@@ -117,7 +116,6 @@
       <ReplyBoxContent
         ref="replyBoxContentRef"
         :isFullscreen="false"
-        :aiPrompts="aiPrompts"
         :isSending="isSending"
         :isDraftLoading="isDraftLoading"
         :uploadingFiles="uploadingFiles"
@@ -137,7 +135,7 @@
         @fileUpload="handleFileUpload"
         @fileDelete="handleFileDelete"
         @filesDropped="uploadFiles"
-        @aiPromptSelected="handleAiPromptSelected"
+        @aiGenerationChange="isGenerating = $event"
         :isGenerating="isGenerating"
         :canSendReply="canSendReply"
         :canSendPrivateNote="canSendPrivateNote"
@@ -158,7 +156,6 @@ import api from '@main/api'
 import { useI18n } from 'vue-i18n'
 import { useConversationStore } from '@main/stores/conversation'
 import { useInboxStore } from '@main/stores/inbox'
-import { useAiPromptStore } from '@main/stores/aiPrompt'
 import { useNotificationStore } from '@main/stores/notification'
 import {
   AlertDialog,
@@ -254,8 +251,6 @@ const cc = ref('')
 const bcc = ref('')
 const showBcc = ref(false)
 const emailErrors = ref([])
-const aiPromptStore = useAiPromptStore()
-const aiPrompts = computed(() => aiPromptStore.prompts)
 const replyBoxContentRef = ref(null)
 const fullscreenContentRef = ref(null)
 const activeContentRef = () =>
@@ -265,8 +260,6 @@ const showMissingTagsWarning = ref(false)
 const deferredStatus = ref(null)
 const mentions = ref([])
 
-aiPromptStore.fetchPrompts()
-
 const runAiGeneration = async (requestFn) => {
   if (isGenerating.value) return
   const uuid = currentConversationUUID.value
@@ -286,9 +279,6 @@ const runAiGeneration = async (requestFn) => {
   }
 }
 
-const handleAiPromptSelected = (key) =>
-  runAiGeneration(() => api.aiCompletion({ prompt_key: key, content: htmlContent.value }))
-
 const handleGenerateReply = () =>
   runAiGeneration((uuid) =>
     api.aiGenerateReply({ conversation_uuid: uuid, instruction: textContent.value })
diff --git a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
index b97e132c..f207d2f2 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
@@ -7,18 +7,18 @@
       :class="{ 'mb-4': !isFullscreen, 'border-b border-border pb-4': isFullscreen }"
     >
       <Tabs v-model="messageType" class="rounded-lg">
-        <TabsList class="rounded-lg border bg-muted/50 p-0.5">
+        <TabsList>
           <TabsTrigger
             v-if="canSendReply"
             value="reply"
-            :class="TAB_TRIGGER_CLASS"
+            class="max-md:py-2.5"
           >
             {{ $t('globals.terms.reply') }}
           </TabsTrigger>
           <TabsTrigger
             v-if="canSendPrivateNote"
             value="private_note"
-            :class="TAB_TRIGGER_CLASS"
+            class="max-md:py-2.5"
           >
             {{ $t('globals.terms.privateNote') }}
           </TabsTrigger>
@@ -91,7 +91,6 @@
         v-model:textContent="textContent"
         :message-type="messageType"
         :placeholder="isCramped ? t('globals.terms.typeMessage') : t('editor.hint.full')"
-        :aiPrompts="aiPrompts"
         :insertContent="insertContent"
         :autoFocus="true"
         :disabled="isDraftLoading"
@@ -100,7 +99,7 @@
         :enableInlineImages="conversationStore.current.inbox_channel === 'email'"
         :getSuggestions="getSuggestions"
         :getConversationSuggestions="getConversationSuggestions"
-        @aiPromptSelected="handleAiPromptSelected"
+        @aiGenerationChange="emit('aiGenerationChange', $event)"
         @send="handleSend"
         @mentionsChanged="handleMentionsChanged"
         @filesDropped="handleFilesDropped"
@@ -146,9 +145,6 @@
 const RECIPIENT_INPUT_CLASS =
   'flex-grow border-input bg-card px-3 py-2 text-sm shadow-none focus-visible:ring-1 focus-visible:ring-ring'
 
-const TAB_TRIGGER_CLASS =
-  'rounded-md px-3 py-1 text-sm transition-colors duration-150 max-md:py-2.5 data-[state=active]:bg-card data-[state=active]:shadow-sm'
-
 import { ref, computed, nextTick, watch } from 'vue'
 import { useDebounceFn } from '@vueuse/core'
 import { EMITTER_EVENTS } from '@main/constants/emitterEvents.js'
@@ -248,10 +244,6 @@ const props = defineProps({
     type: Boolean,
     default: false
   },
-  aiPrompts: {
-    type: Array,
-    required: true
-  },
   isSending: {
     type: Boolean,
     required: true
@@ -292,7 +284,7 @@ const emit = defineEmits([
   'inlineImageUpload',
   'fileDelete',
   'filesDropped',
-  'aiPromptSelected',
+  'aiGenerationChange',
   'generateReply'
 ])
 
@@ -400,10 +392,6 @@ const handleEmojiSelect = (emoji) => {
   nextTick(() => (insertContent.value = emoji))
 }
 
-const handleAiPromptSelected = (key) => {
-  emit('aiPromptSelected', key)
-}
-
 // Watch and update macro view based on message type this filters our macros.
 watch(
   messageType,
diff --git a/frontend/apps/main/src/stores/aiPrompt.js b/frontend/apps/main/src/stores/aiPrompt.js
index b706deee..e6050035 100644
--- a/frontend/apps/main/src/stores/aiPrompt.js
+++ b/frontend/apps/main/src/stores/aiPrompt.js
@@ -1,34 +1,61 @@
 import { ref } from 'vue'
 import { defineStore } from 'pinia'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
-import { useEmitter } from '../composables/useEmitter'
-import { EMITTER_EVENTS } from '../constants/emitterEvents'
-import api from '../api'
+import { useEmitter } from '@main/composables/useEmitter'
+import { EMITTER_EVENTS } from '@main/constants/emitterEvents'
+import api from '@main/api'
 
 export const useAiPromptStore = defineStore('aiPrompt', () => {
-    const prompts = ref([])
-    const emitter = useEmitter()
-    let inflight = null
-    let hasFetched = false
-    const fetchPrompts = () => {
-        if (hasFetched) return Promise.resolve()
-        if (inflight) return inflight
-        inflight = api.getAiPrompts()
-            .then(response => {
-                prompts.value = response?.data?.data || []
-                hasFetched = true
-            })
-            .catch(error => {
-                emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
-                    variant: 'destructive',
-                    description: handleHTTPError(error).message
-                })
-            })
-            .finally(() => { inflight = null })
-        return inflight
-    }
-    return {
-        prompts,
-        fetchPrompts,
+  const prompts = ref([])
+  const emitter = useEmitter()
+  let inflight = null
+  let hasFetched = false
+
+  const showError = (error) => {
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  }
+
+  const fetchPrompts = () => {
+    if (hasFetched) return Promise.resolve()
+    if (inflight) return inflight
+
+    inflight = api
+      .getAiPrompts()
+      .then((response) => {
+        prompts.value = response?.data?.data || []
+        hasFetched = true
+      })
+      .catch(showError)
+      .finally(() => {
+        inflight = null
+      })
+
+    return inflight
+  }
+
+  const refreshPrompts = async () => {
+    if (inflight) await inflight
+    hasFetched = false
+    return fetchPrompts()
+  }
+
+  const complete = async (promptKey, content) => {
+    try {
+      const response = await api.aiCompletion({ prompt_key: promptKey, content })
+      return response?.data?.data ?? ''
+    } catch (error) {
+      showError(error)
+      return null
     }
+  }
+
+  return {
+    prompts,
+    fetchPrompts,
+    refreshPrompts,
+    complete
+  }
 })
diff --git a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js
index 092fd6de..80a42143 100644
--- a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js
+++ b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js
@@ -2,43 +2,73 @@
 import { afterEach, describe, expect, it, vi } from 'vitest'
 import { createApp, h, nextTick, ref } from 'vue'
 
-const { getPreferences, savePreferences, refresh, emit } = vi.hoisted(() => ({
+const { getPreferences, savePreferences, refresh, enable, disable, emit } = vi.hoisted(() => ({
   getPreferences: vi.fn(),
   savePreferences: vi.fn().mockResolvedValue({}),
   refresh: vi.fn(),
+  enable: vi.fn().mockResolvedValue(true),
+  disable: vi.fn().mockResolvedValue(),
   emit: vi.fn()
 }))
-vi.mock('@/api', () => ({ default: { getNotificationPreferences: getPreferences, updateNotificationPreferences: savePreferences } }))
+vi.mock('@/api', () => ({
+  default: {
+    getNotificationPreferences: getPreferences,
+    updateNotificationPreferences: savePreferences
+  }
+}))
 vi.mock('vue-i18n', () => ({ useI18n: () => ({ t: (key) => key }) }))
 vi.mock('@/composables/useEmitter', () => ({ useEmitter: () => ({ emit }) }))
 vi.mock('@shared-ui/utils/http.js', () => ({ handleHTTPError: (error) => error }))
 vi.mock('@/composables/usePushNotifications', () => ({
-  usePushNotifications: () => ({ supported: ref(true), enabled: ref(false), permission: ref('granted'), refresh })
+  usePushNotifications: () => ({
+    supported: ref(true),
+    enabled: ref(false),
+    permission: ref('granted'),
+    refresh,
+    enable,
+    disable
+  })
 }))
 vi.mock('@shared-ui/components/ui/switch', () => ({
   Switch: {
     props: ['checked', 'disabled'],
     emits: ['update:checked'],
-    setup: (props, { emit }) => () => h('button', {
-      type: 'button', disabled: props.disabled,
-      onClick: () => emit('update:checked', !props.checked)
-    })
+    setup:
+      (props, { emit }) =>
+      () =>
+        h('button', {
+          type: 'button',
+          disabled: props.disabled,
+          onClick: () => emit('update:checked', !props.checked)
+        })
   }
 }))
 import NotificationPreferences from './NotificationPreferences.vue'
 
 let app
 let root
-const settle = async () => { for (let i = 0; i < 10; i++) await nextTick() }
-afterEach(() => { app?.unmount(); root?.remove(); vi.clearAllMocks() })
+const settle = async () => {
+  for (let i = 0; i < 10; i++) await nextTick()
+}
+afterEach(() => {
+  app?.unmount()
+  root?.remove()
+  vi.clearAllMocks()
+})
 
 const mount = async (vapidPublicKey = 'test-key') => {
-  getPreferences.mockResolvedValue({ data: { data: {
-    email_enabled: true, vapid_public_key: vapidPublicKey, preferences: [
-      { notification_type: 'new_reply', channel: 'email', enabled: true },
-      { notification_type: 'new_reply', channel: 'in_app', enabled: false }
-    ]
-  } } })
+  getPreferences.mockResolvedValue({
+    data: {
+      data: {
+        email_enabled: true,
+        vapid_public_key: vapidPublicKey,
+        preferences: [
+          { notification_type: 'new_reply', channel: 'email', enabled: true },
+          { notification_type: 'new_reply', channel: 'in_app', enabled: false }
+        ]
+      }
+    }
+  })
   root = document.createElement('div')
   document.body.append(root)
   app = createApp(NotificationPreferences)
@@ -54,7 +84,9 @@ describe('notification preferences', () => {
     expect(email).toBeDefined()
     email.click()
     await settle()
-    expect(savePreferences).toHaveBeenCalledWith([{ notification_type: 'new_reply', channel: 'email', enabled: false }])
+    expect(savePreferences).toHaveBeenCalledWith([
+      { notification_type: 'new_reply', channel: 'email', enabled: false }
+    ])
   })
 
   it('prevents overlapping saves for the same preference', async () => {
@@ -99,4 +131,22 @@ describe('notification preferences', () => {
     expect(browserPush.disabled).toBe(true)
     expect(root.textContent).toContain('notification.browserPush.unavailable')
   })
+
+  it('shows a loader while browser notifications are being enabled', async () => {
+    let finishEnable
+    enable.mockReturnValueOnce(
+      new Promise((resolve) => {
+        finishEnable = resolve
+      })
+    )
+    await mount()
+
+    root.querySelector('button').click()
+    await nextTick()
+
+    expect(root.querySelector('.animate-dot-flashing')).not.toBeNull()
+    finishEnable(true)
+    await settle()
+    expect(root.querySelector('.animate-dot-flashing')).toBeNull()
+  })
 })
diff --git a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
index e6287a3d..057a2f5c 100644
--- a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
+++ b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
@@ -9,14 +9,24 @@
         {{ $t('notification.emailChannelDisabled') }}
       </p>
 
-      <div class="flex items-center justify-between gap-4 border border-border rounded-md px-4 py-3">
+      <div
+        class="flex items-center justify-between gap-4 border border-border rounded-md px-4 py-3"
+      >
         <div class="space-y-1">
           <p class="text-sm text-foreground">
             {{ $t('globals.terms.browserNotification', 2) }}
           </p>
-          <p class="text-xs text-muted-foreground">{{ browserPushDescription }}</p>
+          <p v-if="browserPushDescription" class="text-xs text-muted-foreground">
+            {{ browserPushDescription }}
+          </p>
         </div>
+        <DotLoader
+          v-if="isUpdatingBrowserPush"
+          role="status"
+          :aria-label="$t('globals.terms.loading')"
+        />
         <Switch
+          v-else
           :checked="pushNotifications.enabled.value"
           :disabled="
             !pushNotifications.supported.value ||
@@ -66,6 +76,7 @@
 import { computed, ref, onMounted } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { Switch } from '@shared-ui/components/ui/switch'
+import { DotLoader } from '@shared-ui/components/ui/loader'
 import { useEmitter } from '@/composables/useEmitter'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
 import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
@@ -78,12 +89,13 @@ const rows = ref([])
 const emailEnabled = ref(true)
 const vapidPublicKey = ref('')
 const pendingUpdates = ref(new Set())
+const isUpdatingBrowserPush = ref(false)
 const pushNotifications = usePushNotifications()
 
 const channels = [
   { key: 'in_app', labelKey: 'globals.terms.inApp' },
   { key: 'email', labelKey: 'globals.terms.email' },
-  { key: 'push', labelKey: 'globals.terms.push' }
+  { key: 'push', labelKey: 'globals.terms.browser' }
 ]
 
 const typeLabels = {
@@ -126,11 +138,14 @@ const browserPushDescription = computed(() => {
   if (!pushNotifications.supported.value) return t('notification.browserPush.unsupported')
   if (pushNotifications.permission.value === 'denied') return t('notification.browserPush.blocked')
   if (!vapidPublicKey.value) return t('notification.browserPush.unavailable')
-  return t('notification.browserPush.description')
+  return ''
 })
 
 const updateBrowserPush = async (value) => {
+  if (isUpdatingBrowserPush.value) return
+
   try {
+    isUpdatingBrowserPush.value = true
     if (value) {
       const granted = await pushNotifications.enable(vapidPublicKey.value)
       if (!granted) {
@@ -147,6 +162,8 @@ const updateBrowserPush = async (value) => {
       variant: 'destructive',
       description: handleHTTPError(error).message
     })
+  } finally {
+    isUpdatingBrowserPush.value = false
   }
 }
 
diff --git a/frontend/apps/main/src/views/admin/ai/AIEditorPrompts.vue b/frontend/apps/main/src/views/admin/ai/AIEditorPrompts.vue
index 5fc717e7..6a952362 100644
--- a/frontend/apps/main/src/views/admin/ai/AIEditorPrompts.vue
+++ b/frontend/apps/main/src/views/admin/ai/AIEditorPrompts.vue
@@ -37,6 +37,7 @@
 
 <script setup>
 import { ref, onMounted, onUnmounted } from 'vue'
+import { storeToRefs } from 'pinia'
 import AdminSplitLayout from '@/layouts/admin/AdminSplitLayout.vue'
 import LoadingOverlay from '@main/components/layout/LoadingOverlay.vue'
 import DataTable from '@main/components/datatable/DataTable.vue'
@@ -55,18 +56,20 @@ import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
 import { useI18n } from 'vue-i18n'
 import api from '@/api'
+import { useAiPromptStore } from '@main/stores/aiPrompt'
 
 const { t } = useI18n()
 const emitter = useEmitter()
+const aiPromptStore = useAiPromptStore()
+const { prompts } = storeToRefs(aiPromptStore)
 const isLoading = ref(false)
-const prompts = ref([])
 const dialogOpen = ref(false)
 const isEditing = ref(false)
 const initialValues = ref({})
 const editingId = ref(null)
 
 const refreshHandler = (data) => {
-  if (data?.model === 'ai_editor_prompts') getPrompts()
+  if (data?.model === 'ai_editor_prompts') refreshPrompts()
 }
 
 const editHandler = (data) => {
@@ -74,7 +77,7 @@ const editHandler = (data) => {
 }
 
 onMounted(() => {
-  getPrompts()
+  loadPrompts()
   emitter.on(EMITTER_EVENTS.REFRESH_LIST, refreshHandler)
   emitter.on(EMITTER_EVENTS.EDIT_MODEL, editHandler)
 })
@@ -84,19 +87,16 @@ onUnmounted(() => {
   emitter.off(EMITTER_EVENTS.EDIT_MODEL, editHandler)
 })
 
-const getPrompts = async () => {
-  try {
-    isLoading.value = true
-    const resp = await api.getAiPrompts()
-    prompts.value = resp.data.data || []
-  } catch (error) {
-    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
-      variant: 'destructive',
-      description: handleHTTPError(error).message
-    })
-  } finally {
-    isLoading.value = false
-  }
+const loadPrompts = async () => {
+  isLoading.value = true
+  await aiPromptStore.fetchPrompts()
+  isLoading.value = false
+}
+
+const refreshPrompts = async () => {
+  isLoading.value = true
+  await aiPromptStore.refreshPrompts()
+  isLoading.value = false
 }
 
 const newPrompt = () => {
@@ -128,7 +128,7 @@ const submitPrompt = async (values) => {
       await api.createAIPrompt(values)
     }
     dialogOpen.value = false
-    getPrompts()
+    await refreshPrompts()
     emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
       description: t('globals.messages.savedSuccessfully')
     })
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 726bf0b1..64e39dcc 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -972,6 +972,7 @@
   "globals.terms.body": "Body",
   "globals.terms.brandName": "Brand name",
   "globals.terms.breadcrumb": "Breadcrumb",
+  "globals.terms.browser": "Browser",
   "globals.terms.browserNotification": "Browser notification | Browser notifications",
   "globals.terms.businessHour": "Business hour | Business hours",
   "globals.terms.callbackURL": "Callback URL",
@@ -1112,7 +1113,6 @@
   "globals.terms.provider": "Provider | Providers",
   "globals.terms.providerURL": "Provider URL",
   "globals.terms.published": "Published",
-  "globals.terms.push": "Push",
   "globals.terms.read": "Read",
   "globals.terms.reconnect": "Reconnect",
   "globals.terms.referenceNumber": "Reference number",
@@ -1379,7 +1379,6 @@
   "navigation.logout": "Logout",
   "navigation.reassignReplies": "Reassign replies",
   "notification.browserPush.blocked": "Browser notifications are blocked. Allow them in your browser settings to receive notifications on this device.",
-  "notification.browserPush.description": "Receive notifications on this device when libredesk is closed.",
   "notification.browserPush.unavailable": "Browser notifications are unavailable because push is not configured. Ask an administrator to configure push notifications.",
   "notification.browserPush.unsupported": "This browser does not support push notifications. Use a supported browser to receive notifications when libredesk is closed.",
   "notification.channelToggleLabel": "{channel} notifications for {type}",
diff --git a/internal/conversation/conversation.go b/internal/conversation/conversation.go
index a4122b51..6be55bb7 100644
--- a/internal/conversation/conversation.go
+++ b/internal/conversation/conversation.go
@@ -2,6 +2,7 @@
 package conversation
 
 import (
+	"cmp"
 	"context"
 	"database/sql"
 	"embed"
@@ -1249,7 +1250,7 @@ func (m *Manager) NotifyAssignment(userIDs []int, conversation models.Conversati
 			},
 		}},
 		Title:            m.i18n.Ts("notification.conversationAssigned", "referenceNumber", conversation.ReferenceNumber),
-		Body:             conversation.Subject,
+		Body:             null.StringFrom(cmp.Or(conversation.Subject.String, conversation.LastMessage.String)),
 		ConversationID:   null.IntFrom(conversation.ID),
 		ConversationUUID: conversation.UUID,
 	}); err != nil {
@@ -1340,6 +1341,7 @@ func (m *Manager) sendReplyNotification(conversation models.Conversation, messag
 	if len(group.recipients) == 0 {
 		return
 	}
+	messageText := replyNotificationText(message)
 	candidateIDs := make([]int, len(group.recipients))
 	for i, recipient := range group.recipients {
 		candidateIDs[i] = recipient.ID
@@ -1349,7 +1351,7 @@ func (m *Manager) sendReplyNotification(conversation models.Conversation, messag
 		data := notificationTemplateData(conversation, recipient, author)
 		data["Message"] = map[string]any{
 			"UUID":    message.UUID,
-			"Content": htmltemplate.HTML(strings.ReplaceAll(html.EscapeString(message.TextContent), "\n", "<br>")),
+			"Content": htmltemplate.HTML(strings.ReplaceAll(html.EscapeString(messageText), "\n", "<br>")),
 		}
 		content, subject, err := m.template.RenderStoredEmailTemplate(group.tmpl, data)
 		return subject, content, err
@@ -1364,7 +1366,7 @@ func (m *Manager) sendReplyNotification(conversation models.Conversation, messag
 		Type:             group.nType,
 		Recipients:       recipients,
 		Title:            group.title,
-		Body:             conversation.Subject,
+		Body:             null.StringFrom(cmp.Or(messageText, conversation.Subject.String)),
 		ConversationID:   null.IntFrom(conversation.ID),
 		MessageID:        null.IntFrom(message.ID),
 		ConversationUUID: conversation.UUID,
@@ -1422,7 +1424,7 @@ func (m *Manager) NotifyMention(conversationUUID string, message models.Message,
 	if err != nil {
 		m.lo.Error("error fetching root URL for mention notification", "error", err)
 	}
-	messageContent := sanitizeNotificationHTML(message.Content, rootURL)
+	messageContent := htmltemplate.HTML(absolutizeConversationReferenceLinks(message.Content, rootURL))
 
 	recipients := m.buildNotificationRecipients(userIDs, func(recipient umodels.User) (string, string, error) {
 		data := notificationTemplateData(conversation, recipient, umodels.User{})
@@ -2394,3 +2396,11 @@ func listTypeWhereClause(conditions []string) string {
 	}
 	return "AND (" + strings.Join(conditions, " OR ") + ")"
 }
+
+func replyNotificationText(message models.Message) string {
+	full := strings.TrimSpace(message.TextContent)
+	if message.ContentType == models.ContentTypeHTML {
+		return cmp.Or(stringutil.HTML2TextNoQuotes(message.Content), full)
+	}
+	return cmp.Or(stringutil.TrimPlainTextQuotes(full), full)
+}
diff --git a/internal/conversation/conversation_reference.go b/internal/conversation/conversation_reference.go
index b76f58fe..b6f540ff 100644
--- a/internal/conversation/conversation_reference.go
+++ b/internal/conversation/conversation_reference.go
@@ -1,14 +1,9 @@
 package conversation
 
 import (
-	htmltemplate "html/template"
 	"strings"
-
-	"github.com/microcosm-cc/bluemonday"
 )
 
-var notificationHTMLPolicy = bluemonday.UGCPolicy()
-
 func absolutizeConversationReferenceLinks(content, rootURL string) string {
 	if rootURL == "" {
 		return content
@@ -19,8 +14,3 @@ func absolutizeConversationReferenceLinks(content, rootURL string) string {
 		`href="`+strings.TrimRight(rootURL, "/")+`/inboxes/all/conversation/`,
 	)
 }
-
-func sanitizeNotificationHTML(content, rootURL string) htmltemplate.HTML {
-	content = notificationHTMLPolicy.Sanitize(content)
-	return htmltemplate.HTML(absolutizeConversationReferenceLinks(content, rootURL))
-}
diff --git a/internal/conversation/conversation_reference_test.go b/internal/conversation/conversation_reference_test.go
index 24a390f3..954b6c91 100644
--- a/internal/conversation/conversation_reference_test.go
+++ b/internal/conversation/conversation_reference_test.go
@@ -1,9 +1,6 @@
 package conversation
 
-import (
-	"strings"
-	"testing"
-)
+import "testing"
 
 func TestAbsolutizeConversationReferenceLinks(t *testing.T) {
 	content := `<p><a href="/inboxes/all/conversation/abc" class="ld-conversation-reference">#108</a> <a href="/help">Help</a> <a href="https://old.example.com/inboxes/all/conversation/def">#109</a></p>`
@@ -13,19 +10,3 @@ func TestAbsolutizeConversationReferenceLinks(t *testing.T) {
 		t.Fatalf("got %q, want %q", got, want)
 	}
 }
-
-func TestSanitizeNotificationHTML(t *testing.T) {
-	content := `<p><strong>Allowed</strong><img src="x" onerror="alert(1)"><script>alert(2)</script><a href="/inboxes/all/conversation/abc">#108</a></p>`
-	got := string(sanitizeNotificationHTML(content, "https://desk.example.com"))
-
-	for _, unsafe := range []string{"onerror", "<script", "alert(1)", "alert(2)"} {
-		if strings.Contains(got, unsafe) {
-			t.Fatalf("unsafe content %q remained in %q", unsafe, got)
-		}
-	}
-	for _, safe := range []string{"<strong>Allowed</strong>", `href="https://desk.example.com/inboxes/all/conversation/abc"`} {
-		if !strings.Contains(got, safe) {
-			t.Fatalf("safe content %q missing from %q", safe, got)
-		}
-	}
-}
diff --git a/internal/conversation/notification_test.go b/internal/conversation/notification_test.go
index 76f0252e..f389b3a5 100644
--- a/internal/conversation/notification_test.go
+++ b/internal/conversation/notification_test.go
@@ -4,6 +4,7 @@ import (
 	"errors"
 	htmltemplate "html/template"
 	"slices"
+	"strings"
 	"sync"
 	"testing"
 	"time"
@@ -222,6 +223,44 @@ func TestReplyNotificationsAlertForEveryMessage(t *testing.T) {
 		}
 	})
 
+	t.Run("reply notifications remove quoted text", func(t *testing.T) {
+		m := newManager(nmodels.NotificationChannelInApp, nmodels.NotificationChannelEmail)
+		replyConversation := conv
+		replyConversation.Subject = null.StringFrom("Conversation subject")
+		reply := message
+		reply.ContentType = models.ContentTypeHTML
+		reply.Content = `<div>Live chat reply</div><div class="gmail_quote gmail_quote_container"><blockquote>Earlier message</blockquote></div>`
+		reply.TextContent = "Live chat reply\nEarlier message"
+		m.NotifyNewReply(replyConversation, reply, false)
+
+		var body string
+		db.Get(&body, `SELECT body FROM user_notifications LIMIT 1`)
+		if body != "Live chat reply" {
+			t.Fatalf("notification body = %q, want fresh reply", body)
+		}
+
+		var emailContent string
+		db.Get(&emailContent, `SELECT content FROM notification_email_queue LIMIT 1`)
+		if !strings.Contains(emailContent, "Live chat reply") || strings.Contains(emailContent, "Earlier message") {
+			t.Fatalf("queued email contains quoted history: %q", emailContent)
+		}
+	})
+
+	t.Run("assignment body falls back to last message", func(t *testing.T) {
+		m := newManager(nmodels.NotificationChannelInApp)
+		assigned := conv
+		assigned.LastMessage = null.StringFrom("Live chat opening message")
+		if err := m.NotifyAssignment([]int{userID}, assigned); err != nil {
+			t.Fatal(err)
+		}
+
+		var body string
+		db.Get(&body, `SELECT body FROM user_notifications LIMIT 1`)
+		if body != assigned.LastMessage.String {
+			t.Fatalf("notification body = %q, want %q", body, assigned.LastMessage.String)
+		}
+	})
+
 	t.Run("replies arriving together alert individually", func(t *testing.T) {
 		m := newManager(nmodels.NotificationChannelInApp)
 		var wg sync.WaitGroup
diff --git a/internal/migrations/v2.9.0.go b/internal/migrations/v2.9.0.go
index 5dcabb68..406df15b 100644
--- a/internal/migrations/v2.9.0.go
+++ b/internal/migrations/v2.9.0.go
@@ -133,7 +133,9 @@ func V2_9_0(db *sqlx.DB, fs stuffbin.FileSystem, ko *koanf.Koanf) error {
     Subject: {{ .Conversation.Subject }}
 </div>
 
-<blockquote>{{ .Message.Content }}</blockquote>
+<blockquote style="background-color: #f5f5f5; padding: 12px; margin: 16px 0; border-left: 4px solid #ddd;">
+{{ .Message.Content }}
+</blockquote>
 
 <p>
     <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
@@ -160,7 +162,9 @@ func V2_9_0(db *sqlx.DB, fs stuffbin.FileSystem, ko *koanf.Koanf) error {
     Subject: {{ .Conversation.Subject }}
 </div>
 
-<blockquote>{{ .Message.Content }}</blockquote>
+<blockquote style="background-color: #f5f5f5; padding: 12px; margin: 16px 0; border-left: 4px solid #ddd;">
+{{ .Message.Content }}
+</blockquote>
 
 <p>
     <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
@@ -187,7 +191,9 @@ func V2_9_0(db *sqlx.DB, fs stuffbin.FileSystem, ko *koanf.Koanf) error {
     Subject: {{ .Conversation.Subject }}
 </div>
 
-<blockquote>{{ .Message.Content }}</blockquote>
+<blockquote style="background-color: #f5f5f5; padding: 12px; margin: 16px 0; border-left: 4px solid #ddd;">
+{{ .Message.Content }}
+</blockquote>
 
 <p>
     <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
diff --git a/schema.sql b/schema.sql
index 5e090136..fc510c63 100644
--- a/schema.sql
+++ b/schema.sql
@@ -1109,7 +1109,9 @@ VALUES('email_notification'::template_type, '
     Subject: {{ .Conversation.Subject }}
 </div>
 
-<blockquote>{{ .Message.Content }}</blockquote>
+<blockquote style="background-color: #f5f5f5; padding: 12px; margin: 16px 0; border-left: 4px solid #ddd;">
+{{ .Message.Content }}
+</blockquote>
 
 <p>
     <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
@@ -1132,7 +1134,9 @@ VALUES('email_notification'::template_type, '
     Subject: {{ .Conversation.Subject }}
 </div>
 
-<blockquote>{{ .Message.Content }}</blockquote>
+<blockquote style="background-color: #f5f5f5; padding: 12px; margin: 16px 0; border-left: 4px solid #ddd;">
+{{ .Message.Content }}
+</blockquote>
 
 <p>
     <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>
@@ -1155,7 +1159,9 @@ VALUES('email_notification'::template_type, '
     Subject: {{ .Conversation.Subject }}
 </div>
 
-<blockquote>{{ .Message.Content }}</blockquote>
+<blockquote style="background-color: #f5f5f5; padding: 12px; margin: 16px 0; border-left: 4px solid #ddd;">
+{{ .Message.Content }}
+</blockquote>
 
 <p>
     <a href="{{ RootURL }}/inboxes/assigned/conversation/{{ .Conversation.UUID }}">View Conversation</a>

From 89f58904d23a2a6c4f55b19b42e9a29daf8e2ac4 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 16 Sep 2026 02:11:44 +0530
Subject: [PATCH 064/178] wip: add widget campaigns, help center in widget and
 transcript download

---
 cmd/chat.go                                   |  16 +-
 cmd/handlers.go                               |   7 +
 cmd/inboxes.go                                | 182 +++---
 cmd/init.go                                   |   9 +
 cmd/main.go                                   |   3 +
 cmd/upgrade.go                                |   1 +
 cmd/widget_campaign.go                        | 245 ++++++++
 cmd/widget_campaign_reply.go                  | 100 ++++
 cmd/widget_help.go                            | 139 +++++
 cmd/widget_transcript.go                      |  40 ++
 frontend/apps/main/src/api/index.js           |   3 +
 .../src/composables/useConversationFilters.js |   2 +-
 .../apps/main/src/constants/filterConfig.js   |   9 +
 .../src/features/admin/automation/RuleBox.vue |   6 +-
 .../admin/inbox/LivechatInboxForm.vue         | 158 ++++-
 .../admin/inbox/LivechatWidgetPreview.vue     | 161 ++++-
 .../features/admin/inbox/WidgetCampaigns.vue  | 561 ++++++++++++++++++
 .../features/admin/inbox/WidgetConditions.vue |  21 +
 .../features/admin/inbox/WidgetHelpConfig.vue | 168 ++++++
 .../admin/inbox/livechatFormSchema.js         |  41 +-
 .../admin/inbox/useHelpCenterArticles.js      |  50 ++
 frontend/apps/widget/src/App.vue              |  43 +-
 frontend/apps/widget/src/api/index.js         |  14 +
 .../widget/src/components/ArticleReader.vue   |  60 ++
 .../apps/widget/src/components/ChatHeader.vue |  80 ++-
 .../widget/src/components/ChatMessages.vue    |  17 +-
 .../apps/widget/src/components/HomeHelp.vue   |  22 +
 .../widget/src/components/MessageInput.vue    |  16 +-
 .../widget/src/components/PreChatForm.vue     |  11 +-
 .../src/composables/useReplyPreviews.js       |  39 ++
 .../apps/widget/src/layouts/MainLayout.vue    |  14 +-
 frontend/apps/widget/src/store/chat.js        |  11 +-
 frontend/apps/widget/src/store/help.js        |  99 ++++
 frontend/apps/widget/src/store/help.test.js   |  77 +++
 frontend/apps/widget/src/store/proactive.js   |  66 +++
 frontend/apps/widget/src/store/widget.js      |   7 +
 frontend/apps/widget/src/views/ChatView.vue   |  21 +-
 .../widget/src/views/ConversationsView.vue    |   8 +-
 frontend/apps/widget/src/views/HelpView.vue   | 222 +++++++
 frontend/apps/widget/src/views/HomeView.vue   |  17 +-
 .../components/HelpCollectionList.vue         |  83 +++
 i18n/en-US.json                               |  76 ++-
 internal/automation/contact.go                |  19 +
 internal/automation/evaluator.go              |  15 +-
 internal/conversation/conversation.go         |   9 +
 internal/conversation/models/models.go        |   8 +-
 internal/conversation/proactive.go            |  91 +++
 internal/conversation/queries.sql             |  25 +
 internal/conversation/transcript.go           |   9 +-
 internal/inbox/channel/livechat/livechat.go   |  57 +-
 .../channel/livechat/proactive/eligibility.go | 111 ++++
 .../livechat/proactive/eligibility_test.go    |  94 +++
 .../channel/livechat/proactive/models.go      |  73 +++
 .../channel/livechat/proactive/proactive.go   | 131 ++++
 .../livechat/proactive/proactive_test.go      |  89 +++
 .../channel/livechat/proactive/queries.sql    |  40 ++
 internal/migrations/v2.10.0.go                |  31 +
 internal/migrations/v2.10.0_test.go           |  23 +
 internal/user/queries.sql                     |   6 +-
 schema.sql                                    |  19 +
 static/widget.js                              | 244 +++++++-
 61 files changed, 3823 insertions(+), 196 deletions(-)
 create mode 100644 cmd/widget_campaign.go
 create mode 100644 cmd/widget_campaign_reply.go
 create mode 100644 cmd/widget_help.go
 create mode 100644 cmd/widget_transcript.go
 create mode 100644 frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
 create mode 100644 frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue
 create mode 100644 frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
 create mode 100644 frontend/apps/main/src/features/admin/inbox/useHelpCenterArticles.js
 create mode 100644 frontend/apps/widget/src/components/ArticleReader.vue
 create mode 100644 frontend/apps/widget/src/components/HomeHelp.vue
 create mode 100644 frontend/apps/widget/src/composables/useReplyPreviews.js
 create mode 100644 frontend/apps/widget/src/store/help.js
 create mode 100644 frontend/apps/widget/src/store/help.test.js
 create mode 100644 frontend/apps/widget/src/store/proactive.js
 create mode 100644 frontend/apps/widget/src/views/HelpView.vue
 create mode 100644 frontend/shared-ui/components/HelpCollectionList.vue
 create mode 100644 internal/automation/contact.go
 create mode 100644 internal/conversation/proactive.go
 create mode 100644 internal/inbox/channel/livechat/proactive/eligibility.go
 create mode 100644 internal/inbox/channel/livechat/proactive/eligibility_test.go
 create mode 100644 internal/inbox/channel/livechat/proactive/models.go
 create mode 100644 internal/inbox/channel/livechat/proactive/proactive.go
 create mode 100644 internal/inbox/channel/livechat/proactive/proactive_test.go
 create mode 100644 internal/inbox/channel/livechat/proactive/queries.sql
 create mode 100644 internal/migrations/v2.10.0.go
 create mode 100644 internal/migrations/v2.10.0_test.go

diff --git a/cmd/chat.go b/cmd/chat.go
index 113a0dd0..3b0887c2 100644
--- a/cmd/chat.go
+++ b/cmd/chat.go
@@ -22,6 +22,7 @@ import (
 	"github.com/abhinavxd/libredesk/internal/envelope"
 	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat"
 	imodels "github.com/abhinavxd/libredesk/internal/inbox/models"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat/proactive"
 	"github.com/abhinavxd/libredesk/internal/stringutil"
 	umodels "github.com/abhinavxd/libredesk/internal/user/models"
 	realip "github.com/ferluci/fast-realip"
@@ -82,11 +83,15 @@ type customAttributeWidget struct {
 }
 
 type chatInitReq struct {
-	Message  string         `json:"message"`
-	FormData map[string]any `json:"form_data"`
+	DeliveryID string         `json:"delivery_id"`
+	BrowserKey string         `json:"browser_key"`
+	Message    string         `json:"message"`
+	FormData   map[string]any `json:"form_data"`
 }
 
 type chatSettingsResponse struct {
+	Campaigns    *struct{} `json:"campaigns,omitempty"`
+	HasCampaigns bool      `json:"has_campaigns"`
 	livechat.Config
 	// Hide server-side fields from the public widget response.
 	TrustedDomains         *struct{}                     `json:"trusted_domains,omitempty"`
@@ -130,7 +135,8 @@ func handleGetChatSettings(r *fastglue.Request) error {
 	}
 
 	response := chatSettingsResponse{
-		Config: config,
+		Config:       config,
+		HasCampaigns: slices.ContainsFunc(config.Campaigns, func(c proactive.Campaign) bool { return c.Enabled }),
 	}
 
 	// Get business hours data if office hours feature is enabled.
@@ -212,6 +218,10 @@ func handleChatInit(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, app.i18n.T("globals.messages.somethingWentWrong"), nil, envelope.GeneralError)
 	}
 
+	if req.DeliveryID != "" {
+		return handleWidgetCampaignReply(r, req, inbox, config)
+	}
+
 	// Check if user is already authenticated (has session token).
 	contactID, _ = getWidgetContactID(r)
 	if contactID > 0 {
diff --git a/cmd/handlers.go b/cmd/handlers.go
index 9d38c928..dc48c311 100644
--- a/cmd/handlers.go
+++ b/cmd/handlers.go
@@ -183,6 +183,7 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 
 	// Inboxes.
 	g.GET("/api/v1/inboxes", auth(handleGetInboxes))
+	g.GET("/api/v1/inboxes/{id}/campaign-stats", perm(handleCampaignStats, "inboxes:manage"))
 	g.GET("/api/v1/inboxes/{id}", perm(handleGetInbox, "inboxes:manage"))
 	g.POST("/api/v1/inboxes", perm(handleCreateInbox, "inboxes:manage"))
 	g.PUT("/api/v1/inboxes/{id}/toggle", perm(handleToggleInbox, "inboxes:manage"))
@@ -360,12 +361,18 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 	// Widget APIs.
 	g.GET("/api/v1/widget/chat/settings/launcher", rateLimit(validateWidgetInbox(handleGetChatLauncherSettings), "widget"))
 	g.GET("/api/v1/widget/chat/settings", rateLimit(validateWidgetInbox(handleGetChatSettings), "widget"))
+	g.POST("/api/v1/widget/chat/campaigns/next", rateLimit(optionalWidgetAuth(handleWidgetCampaign), "widget"))
+	g.POST("/api/v1/widget/chat/campaigns/event", rateLimit(optionalWidgetAuth(handleWidgetCampaignEvent), "widget"))
+	g.GET("/api/v1/widget/chat/help", rateLimit(optionalWidgetAuth(handleWidgetHelp), "widget"))
+	g.GET("/api/v1/widget/chat/help/search", rateLimit(optionalWidgetAuth(handleWidgetHelpSearch), "widget"))
+	g.GET("/api/v1/widget/chat/help/articles/{article_slug}", rateLimit(optionalWidgetAuth(handleWidgetHelpArticle), "widget"))
 	g.POST("/api/v1/widget/chat/auth/exchange", rateLimit(validateWidgetInbox(handleAuthExchange), "widget"))
 	g.GET("/api/v1/widget/chat/auth/me", rateLimit(widgetAuth(handleWidgetAuthMe), "widget"))
 	g.POST("/api/v1/widget/chat/conversations/init", rateLimit(widgetAuth(handleChatInit), "widget"))
 	g.GET("/api/v1/widget/chat/conversations", rateLimit(widgetAuth(handleGetConversations), "widget"))
 	g.POST("/api/v1/widget/chat/conversations/{uuid}/update-last-seen", rateLimit(widgetAuth(handleChatUpdateLastSeen), "widget"))
 	g.GET("/api/v1/widget/chat/conversations/{uuid}", rateLimit(widgetAuth(handleChatGetConversation), "widget"))
+	g.GET("/api/v1/widget/chat/conversations/{uuid}/transcript", rateLimit(widgetAuth(handleWidgetTranscript), "widget"))
 	g.POST("/api/v1/widget/chat/conversations/{uuid}/message", rateLimit(widgetAuth(handleChatSendMessage), "widget"))
 	g.POST("/api/v1/widget/media/upload", rateLimit(widgetAuth(handleWidgetMediaUpload), "widget"))
 
diff --git a/cmd/inboxes.go b/cmd/inboxes.go
index 462d6993..8607317f 100644
--- a/cmd/inboxes.go
+++ b/cmd/inboxes.go
@@ -209,110 +209,114 @@ func validateInbox(app *App, inbox imodels.Inbox) error {
 	// Validate livechat-specific configuration
 	if inbox.Channel == livechat.ChannelLiveChat {
 		var config livechat.Config
-		if err := json.Unmarshal(inbox.Config, &config); err == nil {
-			// ShowOfficeHoursAfterAssignment cannot be enabled if ShowOfficeHoursInChat is disabled
-			if config.ShowOfficeHoursAfterAssignment && !config.ShowOfficeHoursInChat {
-				return envelope.NewError(envelope.InputError, "`show_office_hours_after_assignment` cannot be enabled when `show_office_hours_in_chat` is disabled", nil)
+		if err := json.Unmarshal(inbox.Config, &config); err != nil {
+			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
+		}
+		if err := validateWidgetFeatures(app, config); err != nil {
+			return err
+		}
+		// ShowOfficeHoursAfterAssignment cannot be enabled if ShowOfficeHoursInChat is disabled
+		if config.ShowOfficeHoursAfterAssignment && !config.ShowOfficeHoursInChat {
+			return envelope.NewError(envelope.InputError, "`show_office_hours_after_assignment` cannot be enabled when `show_office_hours_in_chat` is disabled", nil)
+		}
+		// Validate continuity settings - required when linked email inbox is set.
+		if inbox.LinkedEmailInboxID.Valid && inbox.LinkedEmailInboxID.Int > 0 {
+			if config.Continuity.OfflineThreshold == "" {
+				return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.empty", "name", "offline_threshold"), nil)
 			}
-			// Validate continuity settings - required when linked email inbox is set.
-			if inbox.LinkedEmailInboxID.Valid && inbox.LinkedEmailInboxID.Int > 0 {
-				if config.Continuity.OfflineThreshold == "" {
-					return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.empty", "name", "offline_threshold"), nil)
-				}
-				if config.Continuity.MinEmailInterval == "" {
-					return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.empty", "name", "min_email_interval"), nil)
-				}
-				if config.Continuity.MaxMessagesPerEmail == 0 {
-					return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.empty", "name", "max_messages_per_email"), nil)
-				}
+			if config.Continuity.MinEmailInterval == "" {
+				return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.empty", "name", "min_email_interval"), nil)
 			}
-			if config.Continuity.OfflineThreshold != "" {
-				d, err := time.ParseDuration(config.Continuity.OfflineThreshold)
-				if err != nil {
-					return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.invalidDuration", "name", "offline_threshold"), nil)
-				}
-				if d < time.Minute {
-					return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.minDuration", "name", "offline_threshold", "min", "1m"), nil)
-				}
+			if config.Continuity.MaxMessagesPerEmail == 0 {
+				return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.empty", "name", "max_messages_per_email"), nil)
 			}
-			if config.Continuity.MinEmailInterval != "" {
-				d, err := time.ParseDuration(config.Continuity.MinEmailInterval)
-				if err != nil {
-					return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.invalidDuration", "name", "min_email_interval"), nil)
-				}
-				if d < time.Minute {
-					return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.minDuration", "name", "min_email_interval", "min", "1m"), nil)
-				}
+		}
+		if config.Continuity.OfflineThreshold != "" {
+			d, err := time.ParseDuration(config.Continuity.OfflineThreshold)
+			if err != nil {
+				return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.invalidDuration", "name", "offline_threshold"), nil)
 			}
-			if config.Continuity.MaxMessagesPerEmail != 0 {
-				if config.Continuity.MaxMessagesPerEmail < 1 || config.Continuity.MaxMessagesPerEmail > 100 {
-					return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.minmaxNumber", "min", "1", "max", "100"), nil)
-				}
+			if d < time.Minute {
+				return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.minDuration", "name", "offline_threshold", "min", "1m"), nil)
 			}
+		}
+		if config.Continuity.MinEmailInterval != "" {
+			d, err := time.ParseDuration(config.Continuity.MinEmailInterval)
+			if err != nil {
+				return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.invalidDuration", "name", "min_email_interval"), nil)
+			}
+			if d < time.Minute {
+				return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.minDuration", "name", "min_email_interval", "min", "1m"), nil)
+			}
+		}
+		if config.Continuity.MaxMessagesPerEmail != 0 {
+			if config.Continuity.MaxMessagesPerEmail < 1 || config.Continuity.MaxMessagesPerEmail > 100 {
+				return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.minmaxNumber", "min", "1", "max", "100"), nil)
+			}
+		}
 
-			// Validate colors.
-			hexColorRegex := regexp.MustCompile(`^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$`)
-			if config.Colors.Primary == "" {
-				return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.empty", "name", "primary color"), nil)
-			}
-			if !hexColorRegex.MatchString(config.Colors.Primary) {
-				return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidColor"), nil)
-			}
+		// Validate colors.
+		hexColorRegex := regexp.MustCompile(`^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$`)
+		if config.Colors.Primary == "" {
+			return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.empty", "name", "primary color"), nil)
+		}
+		if !hexColorRegex.MatchString(config.Colors.Primary) {
+			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidColor"), nil)
+		}
 
-			// Validate launcher position.
-			if config.Launcher.Position != "left" && config.Launcher.Position != "right" {
-				return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
-			}
+		// Validate launcher position.
+		if config.Launcher.Position != "left" && config.Launcher.Position != "right" {
+			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
+		}
 
-			// Validate launcher spacing: clamp to a sane range so a fat-fingered value doesn't push the launcher off-screen.
-			if config.Launcher.Spacing.Side < 0 || config.Launcher.Spacing.Side > 200 ||
-				config.Launcher.Spacing.Bottom < 0 || config.Launcher.Spacing.Bottom > 200 {
-				return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
-			}
+		// Validate launcher spacing: clamp to a sane range so a fat-fingered value doesn't push the launcher off-screen.
+		if config.Launcher.Spacing.Side < 0 || config.Launcher.Spacing.Side > 200 ||
+			config.Launcher.Spacing.Bottom < 0 || config.Launcher.Spacing.Bottom > 200 {
+			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
+		}
 
-			// Validate home apps.
-			for _, ha := range config.HomeApps {
-				if ha.URL != "" && !httputil.IsValidHTTPURL(ha.URL) {
-					return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidUrl"), nil)
-				}
-				if ha.Type == livechat.HomeAppAnnouncement && ha.ImageURL != "" && !httputil.IsValidHTTPURL(ha.ImageURL) {
-					return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidUrl"), nil)
-				}
-			}
-
-			// Validate home screen background image URL.
-			if config.HomeScreen.Background.ImageURL != "" && !httputil.IsValidHTTPURL(config.HomeScreen.Background.ImageURL) {
+		// Validate home apps.
+		for _, ha := range config.HomeApps {
+			if ha.URL != "" && !httputil.IsValidHTTPURL(ha.URL) {
 				return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidUrl"), nil)
 			}
-
-			// Validate URLs if set.
-			for _, u := range []string{config.LogoURL, config.Launcher.LogoURL, config.WebsiteURL} {
-				if u != "" && !httputil.IsValidHTTPURL(u) {
-					return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidUrl"), nil)
-				}
+			if ha.Type == livechat.HomeAppAnnouncement && ha.ImageURL != "" && !httputil.IsValidHTTPURL(ha.ImageURL) {
+				return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidUrl"), nil)
 			}
+		}
 
-			// Validate trusted domains.
-			// Valid formats: example.com, *.example.com, sub.example.com, example.com:8080
-			for _, domain := range config.TrustedDomains {
-				d := strings.TrimSpace(domain)
-				if d == "" {
-					continue
-				}
-				if strings.Contains(d, "://") || strings.Contains(d, "/") || strings.Contains(d, " ") {
-					return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.invalidDomain", "domain", d), nil)
-				}
-				// Wildcard must be at the start followed by a dot.
-				if strings.Contains(d, "*") && !strings.HasPrefix(d, "*.") {
-					return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.invalidDomain", "domain", d), nil)
-				}
+		// Validate home screen background image URL.
+		if config.HomeScreen.Background.ImageURL != "" && !httputil.IsValidHTTPURL(config.HomeScreen.Background.ImageURL) {
+			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidUrl"), nil)
+		}
+
+		// Validate URLs if set.
+		for _, u := range []string{config.LogoURL, config.Launcher.LogoURL, config.WebsiteURL} {
+			if u != "" && !httputil.IsValidHTTPURL(u) {
+				return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidUrl"), nil)
 			}
+		}
 
-			// Validate blocked IPs entries.
-			for _, entry := range config.BlockedIPs {
-				if !httputil.ValidateIPOrCIDR(entry) {
-					return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.invalidIPOrCIDR", "entry", entry), nil)
-				}
+		// Validate trusted domains.
+		// Valid formats: example.com, *.example.com, sub.example.com, example.com:8080
+		for _, domain := range config.TrustedDomains {
+			d := strings.TrimSpace(domain)
+			if d == "" {
+				continue
+			}
+			if strings.Contains(d, "://") || strings.Contains(d, "/") || strings.Contains(d, " ") {
+				return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.invalidDomain", "domain", d), nil)
+			}
+			// Wildcard must be at the start followed by a dot.
+			if strings.Contains(d, "*") && !strings.HasPrefix(d, "*.") {
+				return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.invalidDomain", "domain", d), nil)
+			}
+		}
+
+		// Validate blocked IPs entries.
+		for _, entry := range config.BlockedIPs {
+			if !httputil.ValidateIPOrCIDR(entry) {
+				return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.invalidIPOrCIDR", "entry", entry), nil)
 			}
 		}
 
diff --git a/cmd/init.go b/cmd/init.go
index 9a91ce96..ae77b3d9 100644
--- a/cmd/init.go
+++ b/cmd/init.go
@@ -41,6 +41,7 @@ import (
 	notifier "github.com/abhinavxd/libredesk/internal/notification"
 	emailnotifier "github.com/abhinavxd/libredesk/internal/notification/providers/email"
 	"github.com/abhinavxd/libredesk/internal/oidc"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat/proactive"
 	"github.com/abhinavxd/libredesk/internal/ratelimit"
 	"github.com/abhinavxd/libredesk/internal/report"
 	"github.com/abhinavxd/libredesk/internal/role"
@@ -1265,3 +1266,11 @@ func initRateLimit(redisClient *redis.Client) *ratelimit.Limiter {
 
 	return limiter
 }
+
+func initProactive(db *sqlx.DB, i18n *i18n.I18n) *proactive.Manager {
+	manager, err := proactive.New(proactive.Opts{DB: db, I18n: i18n, Lo: initLogger("proactive")})
+	if err != nil {
+		log.Fatalf("error initializing proactive messages: %v", err)
+	}
+	return manager
+}
diff --git a/cmd/main.go b/cmd/main.go
index 41db7ef6..6758d2c8 100644
--- a/cmd/main.go
+++ b/cmd/main.go
@@ -28,6 +28,7 @@ import (
 	customAttribute "github.com/abhinavxd/libredesk/internal/custom_attribute"
 	"github.com/abhinavxd/libredesk/internal/macro"
 	notifier "github.com/abhinavxd/libredesk/internal/notification"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat/proactive"
 	"github.com/abhinavxd/libredesk/internal/report"
 	"github.com/abhinavxd/libredesk/internal/search"
 	"github.com/abhinavxd/libredesk/internal/sla"
@@ -94,6 +95,7 @@ const (
 
 // App is the global app context which is passed and injected in the http handlers.
 type App struct {
+	proactive        *proactive.Manager
 	ctx              context.Context
 	fs               stuffbin.FileSystem
 	consts           atomic.Value
@@ -325,6 +327,7 @@ func main() {
 		importer:         initImporter(i18n),
 		webhook:          webhook,
 		contextLink:      initContextLink(db, i18n),
+		proactive:        initProactive(db, i18n),
 		rateLimit:        rateLimiter,
 		redis:            rdb,
 		fc:               initFastCache(rdb),
diff --git a/cmd/upgrade.go b/cmd/upgrade.go
index f33f2f37..cb3bd2d6 100644
--- a/cmd/upgrade.go
+++ b/cmd/upgrade.go
@@ -48,6 +48,7 @@ var migList = []migFunc{
 	{"v2.6.0", migrations.V2_6_0},
 	{"v2.8.0", migrations.V2_8_0},
 	{"v2.9.0", migrations.V2_9_0},
+	{"v2.10.0", migrations.V2_10_0},
 }
 
 // upgrade upgrades the database to the current version by running SQL migration files
diff --git a/cmd/widget_campaign.go b/cmd/widget_campaign.go
new file mode 100644
index 00000000..789d34c0
--- /dev/null
+++ b/cmd/widget_campaign.go
@@ -0,0 +1,245 @@
+package main
+
+import (
+	"encoding/json"
+	"slices"
+	"strconv"
+	"strings"
+	"time"
+
+	bhmodels "github.com/abhinavxd/libredesk/internal/business_hours/models"
+	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat/proactive"
+	umodels "github.com/abhinavxd/libredesk/internal/user/models"
+	"github.com/google/uuid"
+	"github.com/zerodha/fastglue"
+)
+
+type campaignEventRequest struct {
+	DeliveryID string `json:"delivery_id"`
+	BrowserKey string `json:"browser_key"`
+	Event      string `json:"event"`
+}
+
+type campaignCandidate struct {
+	campaign proactive.Campaign
+	snapshot proactive.Snapshot
+}
+
+func handleWidgetCampaign(r *fastglue.Request) error {
+	app := r.Context.(*App)
+	var ctx proactive.Context
+	if err := r.Decode(&ctx, "json"); err != nil || !validCampaignKey(ctx.BrowserKey) || !validCampaignKey(ctx.SessionKey) || len(ctx.URL) > 4096 || ctx.ActiveSeconds < 0 || ctx.ActiveSeconds > 86400 {
+		return sendErrorEnvelope(r, campaignInputError(app))
+	}
+	ctx.Now = time.Now()
+	ctx.Visitor = getWidgetIsVisitor(r)
+	contact, err := widgetContact(r)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	ctx.ContactID = contact.ID
+	inbox, err := getWidgetInbox(r)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	config, err := getWidgetConfig(r)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	if err := checkConversationPermissions(app, config, ctx.Visitor, contact.ID, inbox.ID); err != nil {
+		return r.SendEnvelope(nil)
+	}
+	loc, err := time.LoadLocation(app.setting.GetAppTimezone())
+	if err != nil {
+		return sendErrorEnvelope(r, campaignInputError(app))
+	}
+	var candidates []campaignCandidate
+	for _, campaign := range config.Campaigns {
+		var hoursErr error
+		within := func() bool {
+			ok, err := campaignWithinHours(app, campaign, ctx.Now, loc)
+			hoursErr = err
+			return ok
+		}
+		reason := campaign.IneligibleReason(ctx, app.automation.MatchesContact(campaign.Conditions, contact), within)
+		if hoursErr != nil {
+			return sendErrorEnvelope(r, hoursErr)
+		}
+		if reason != "" {
+			continue
+		}
+		sender, err := campaignSender(app, campaign.SenderID)
+		if err != nil {
+			continue
+		}
+		snapshot := proactive.Snapshot{Message: campaign.Message, Sender: strings.TrimSpace(sender.FirstName + " " + sender.LastName), Avatar: sender.AvatarURL.String, SenderID: sender.ID, TeamID: campaign.TeamID}
+		if campaign.SenderID == 0 {
+			snapshot.Sender = config.BrandName
+		}
+		candidates = append(candidates, campaignCandidate{campaign, snapshot})
+	}
+	if len(candidates) == 0 {
+		return r.SendEnvelope(nil)
+	}
+	unlock := app.proactive.Lock()
+	defer unlock()
+	history, err := app.proactive.History(inbox.ID, ctx)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	for _, c := range candidates {
+		if proactive.Suppression(c.campaign, ctx, history, config.CampaignCooldownHours) != "" {
+			continue
+		}
+		delivery, err := app.proactive.Reserve(inbox.ID, c.campaign, ctx, c.snapshot)
+		if err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+		return r.SendEnvelope(delivery)
+	}
+	return r.SendEnvelope(nil)
+}
+
+func handleWidgetCampaignEvent(r *fastglue.Request) error {
+	app := r.Context.(*App)
+	var req campaignEventRequest
+	if err := r.Decode(&req, "json"); err != nil || !validCampaignKey(req.DeliveryID) || !validCampaignKey(req.BrowserKey) || !slices.Contains([]string{"displayed", "opened", "dismissed"}, req.Event) {
+		return sendErrorEnvelope(r, campaignInputError(app))
+	}
+	inbox, err := getWidgetInbox(r)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	contactID, _ := getWidgetContactID(r)
+	unlock := app.proactive.Lock()
+	defer unlock()
+	delivery, err := app.proactive.Get(req.DeliveryID, inbox.ID, req.BrowserKey, contactID)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	if req.Event == "displayed" {
+		config, err := getWidgetConfig(r)
+		if err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+		active := slices.ContainsFunc(config.Campaigns, func(c proactive.Campaign) bool {
+			return c.ID == delivery.CampaignID && c.Enabled
+		})
+		if !active || delivery.Dismissed || delivery.Replied || time.Since(delivery.CreatedAt) > time.Minute {
+			return sendErrorEnvelope(r, envelope.NewError(envelope.ConflictError, app.i18n.T("widget.invitationExpired"), nil))
+		}
+	}
+	if err := app.proactive.RecordEvent(delivery.ID, req.Event); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(true)
+}
+
+func handleCampaignStats(r *fastglue.Request) error {
+	app := r.Context.(*App)
+	id, err := strconv.Atoi(r.RequestCtx.UserValue("id").(string))
+	if err != nil || id <= 0 {
+		return sendErrorEnvelope(r, campaignInputError(app))
+	}
+	from, err := time.Parse(time.DateOnly, string(r.RequestCtx.QueryArgs().Peek("from")))
+	if err != nil {
+		return sendErrorEnvelope(r, campaignInputError(app))
+	}
+	to, err := time.Parse(time.DateOnly, string(r.RequestCtx.QueryArgs().Peek("to")))
+	if err != nil || to.Before(from) {
+		return sendErrorEnvelope(r, campaignInputError(app))
+	}
+	stats, err := app.proactive.Stats(id, from, to.AddDate(0, 0, 1))
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(stats)
+}
+
+func campaignWithinHours(app *App, c proactive.Campaign, now time.Time, loc *time.Location) (bool, error) {
+	if c.BusinessHours == "any" {
+		return true, nil
+	}
+	hours, err := app.businessHours.Get(c.BusinessHoursID)
+	if err != nil {
+		return false, envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
+	}
+	if hours.IsAlwaysOpen {
+		return true, nil
+	}
+	local := now.In(loc)
+	var holidays []bhmodels.Holiday
+	var working map[string]bhmodels.WorkingHours
+	if err := json.Unmarshal(hours.Holidays, &holidays); err != nil {
+		return false, campaignInputError(app)
+	}
+	if err := json.Unmarshal(hours.Hours, &working); err != nil {
+		return false, campaignInputError(app)
+	}
+	for _, holiday := range holidays {
+		if holiday.Date == local.Format(time.DateOnly) {
+			return false, nil
+		}
+	}
+	day, ok := working[local.Weekday().String()]
+	if !ok {
+		return false, nil
+	}
+	clock := local.Format("15:04")
+	return clock >= day.Open && clock < day.Close, nil
+}
+
+func campaignSender(app *App, id int) (umodels.User, error) {
+	if id == 0 {
+		return app.user.GetSystemUser()
+	}
+	return app.user.GetAgent(id, "")
+}
+
+func validCampaignKey(key string) bool {
+	id, err := uuid.Parse(key)
+	return err == nil && id != uuid.Nil
+}
+
+func campaignInputError(app *App) error {
+	return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
+}
+
+func validateWidgetFeatures(app *App, config livechat.Config) error {
+	if config.Help.HelpCenterID < 0 || len(config.Help.FeaturedIDs) > 10 || config.Previews.AutoHideSeconds < 0 || config.Previews.AutoHideSeconds > 300 || !slices.Contains([]string{"", "message", "generic"}, config.Previews.Content) || len(config.Campaigns) > 50 || config.CampaignCooldownHours < 0 || config.CampaignCooldownHours > 8760 {
+		return campaignInputError(app)
+	}
+	if config.Help.HelpCenterID > 0 {
+		if _, err := app.helpcenter.GetHelpCenterByID(config.Help.HelpCenterID); err != nil {
+			return err
+		}
+	}
+	loc, err := time.LoadLocation(app.setting.GetAppTimezone())
+	if err != nil {
+		return campaignInputError(app)
+	}
+	ids := make(map[string]bool)
+	for _, campaign := range config.Campaigns {
+		if err := campaign.Validate(); err != nil {
+			return envelope.NewError(envelope.InputError, app.i18n.Ts("admin.inbox.livechat.campaignInvalid", "name", campaign.Name, "field", err.Error()), nil)
+		}
+		if ids[campaign.ID] {
+			return campaignInputError(app)
+		}
+		ids[campaign.ID] = true
+		if _, err := campaignSender(app, campaign.SenderID); err != nil {
+			return err
+		}
+		if campaign.TeamID > 0 {
+			if _, err := app.team.Get(campaign.TeamID); err != nil {
+				return err
+			}
+		}
+		if _, err := campaignWithinHours(app, campaign, time.Now(), loc); err != nil {
+			return err
+		}
+	}
+	return nil
+}
diff --git a/cmd/widget_campaign_reply.go b/cmd/widget_campaign_reply.go
new file mode 100644
index 00000000..f005516a
--- /dev/null
+++ b/cmd/widget_campaign_reply.go
@@ -0,0 +1,100 @@
+package main
+
+import (
+	cmodels "github.com/abhinavxd/libredesk/internal/conversation/models"
+	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat"
+	imodels "github.com/abhinavxd/libredesk/internal/inbox/models"
+	realip "github.com/ferluci/fast-realip"
+	"github.com/zerodha/fastglue"
+)
+
+func handleWidgetCampaignReply(r *fastglue.Request, req chatInitReq, inbox imodels.Inbox, config livechat.Config) error {
+	app := r.Context.(*App)
+	if !validCampaignKey(req.DeliveryID) || !validCampaignKey(req.BrowserKey) {
+		return sendErrorEnvelope(r, campaignInputError(app))
+	}
+	unlock := app.proactive.Lock()
+	defer unlock()
+	contact, err := widgetContact(r)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	delivery, err := app.proactive.Get(req.DeliveryID, inbox.ID, req.BrowserKey, contact.ID)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	if delivery.Replied && delivery.ConversationUUID == "" {
+		return sendErrorEnvelope(r, envelope.NewError(envelope.NotFoundError, app.i18n.T("globals.messages.notFound"), nil))
+	}
+	if !delivery.Displayed {
+		return sendErrorEnvelope(r, envelope.NewError(envelope.ConflictError, app.i18n.T("widget.invitationExpired"), nil))
+	}
+	var sessionToken string
+	var attrs map[string]any
+	visitor := getWidgetIsVisitor(r)
+	if delivery.ConversationUUID != "" {
+		conversation, err := app.conversation.GetConversation(0, delivery.ConversationUUID, "")
+		if err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+		if contact.ID != conversation.ContactID {
+			if contact.ID > 0 {
+				return sendErrorEnvelope(r, envelope.NewError(envelope.PermissionError, app.i18n.T("widget.conversationNotPermitted"), nil))
+			}
+			contact, err = app.user.GetContactOrVisitor(conversation.ContactID, "")
+			if err != nil {
+				return sendErrorEnvelope(r, err)
+			}
+			if contact.Type != "visitor" {
+				return sendErrorEnvelope(r, envelope.NewError(envelope.PermissionError, app.i18n.T("widget.conversationNotPermitted"), nil))
+			}
+			sessionToken, err = generateSessionToken(app, contact.ID, inbox.ID, true, "", defaultSessionTTL)
+			if err != nil {
+				return sendErrorEnvelope(r, err)
+			}
+		}
+		if err := canReply(r, conversation); err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+		message := cmodels.Message{ConversationUUID: conversation.UUID, ConversationID: conversation.ID, SenderID: contact.ID, Type: cmodels.MessageIncoming, SenderType: cmodels.SenderTypeContact, Status: cmodels.MessageStatusReceived, Content: req.Message, ContentType: cmodels.ContentTypeText}
+		if _, err := app.conversation.ProcessIncomingLiveChatMessage(message); err != nil {
+			return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.T("globals.messages.errorSendingMessage"), nil))
+		}
+	} else {
+		if contact.ID == 0 {
+			contact, sessionToken, attrs, err = createVisitorContact(app, req.FormData, config, inbox)
+			if err != nil {
+				return sendErrorEnvelope(r, err)
+			}
+		} else {
+			attrs = saveContactAttrsAndCollectConvoAttrs(app, contact.ID, nil, req.FormData, config)
+		}
+		if err := checkConversationPermissions(app, config, visitor, contact.ID, inbox.ID); err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+		meta := map[string]any{"ip": realip.FromRequest(r.RequestCtx), "user_agent": string(r.RequestCtx.Request.Header.Peek("User-Agent")), "campaign_id": delivery.CampaignID}
+		delivery.ConversationUUID, err = app.conversation.CreateProactiveConversation(delivery, contact.ID, req.Message, attrs, meta, maxChatConversationsPerContact, chatConversationRateLimitWindow)
+		if err != nil {
+			return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.T("globals.messages.errorSendingMessage"), nil))
+		}
+		if err := app.conversation.ProcessIncomingMessageHooks(delivery.ConversationUUID, true); err != nil {
+			app.lo.Error("error processing proactive reply hooks", "error", err)
+		}
+	}
+	conversation, err := app.conversation.GetConversation(0, delivery.ConversationUUID, "")
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	resp, err := buildConversationResponseWithBusinessHours(app, conversation)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	response := map[string]any{"conversation": resp.Conversation, "messages": resp.Messages, "business_hours_id": resp.BusinessHoursID, "working_hours_utc_offset": resp.WorkingHoursUTCOffset}
+	if sessionToken != "" {
+		response["session_token"] = sessionToken
+		response["user"] = map[string]any{"user_id": contact.ID, "is_visitor": visitor, "first_name": contact.FirstName, "last_name": contact.LastName}
+	}
+	r.RequestCtx.Response.Header.Set("Cache-Control", "no-store")
+	return r.SendEnvelope(response)
+}
diff --git a/cmd/widget_help.go b/cmd/widget_help.go
new file mode 100644
index 00000000..b3bc9e73
--- /dev/null
+++ b/cmd/widget_help.go
@@ -0,0 +1,139 @@
+package main
+
+import (
+	"slices"
+	"strings"
+
+	"github.com/abhinavxd/libredesk/internal/envelope"
+	hcmodels "github.com/abhinavxd/libredesk/internal/helpcenter/models"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat"
+	umodels "github.com/abhinavxd/libredesk/internal/user/models"
+	"github.com/zerodha/fastglue"
+)
+
+func optionalWidgetAuth(next func(*fastglue.Request) error) func(*fastglue.Request) error {
+	return func(r *fastglue.Request) error {
+		if len(r.RequestCtx.Request.Header.Peek("Authorization")) == 0 {
+			return validateWidgetInbox(next)(r)
+		}
+		return widgetAuth(next)(r)
+	}
+}
+
+func handleWidgetHelp(r *fastglue.Request) error {
+	app := r.Context.(*App)
+	helpCenter, audience, err := widgetHelpCenter(r)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	if helpCenter.ID == 0 {
+		return r.SendEnvelope(nil)
+	}
+	locale := resolveQueryLocale(r, helpCenter)
+	tree, err := app.helpcenter.GetPublicTree(helpCenter, locale)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	if len(tree.Tree) == 0 && locale != helpCenter.DefaultLocale {
+		locale = helpCenter.DefaultLocale
+		tree, err = app.helpcenter.GetPublicTree(helpCenter, locale)
+		if err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+	}
+	hideTreeAuthors(helpCenterTheme(helpCenter), tree.Tree)
+	popular, err := app.helpcenter.GetPopularArticles(helpCenter.Slug, locale, 5)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	for i := range popular {
+		hideArticleAuthor(helpCenterTheme(helpCenter), &popular[i])
+	}
+	config, _ := getWidgetConfig(r)
+	return r.SendEnvelope(map[string]any{
+		"slug": helpCenter.Slug, "name": helpCenter.Name, "locale": locale,
+		"tree": tree.Tree, "popular": popular, "audience": audience,
+		"featured_ids": config.Help.FeaturedIDs,
+	})
+}
+
+func handleWidgetHelpSearch(r *fastglue.Request) error {
+	app := r.Context.(*App)
+	helpCenter, _, err := widgetHelpCenter(r)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	if helpCenter.ID == 0 {
+		return r.SendEnvelope([]hcmodels.Article{})
+	}
+	query := strings.TrimSpace(string(r.RequestCtx.QueryArgs().Peek("q")))
+	articles, err := app.helpcenter.SearchPublishedArticles(helpCenter.Slug, query, resolveQueryLocale(r, helpCenter), publicSearchLimit)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	app.helpcenter.LogSearch(helpCenter.ID, query, len(articles))
+	for i := range articles {
+		hideArticleAuthor(helpCenterTheme(helpCenter), &articles[i])
+	}
+	return r.SendEnvelope(articles)
+}
+
+func handleWidgetHelpArticle(r *fastglue.Request) error {
+	app := r.Context.(*App)
+	helpCenter, _, err := widgetHelpCenter(r)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	if helpCenter.ID == 0 {
+		return sendErrorEnvelope(r, envelope.NewError(envelope.NotFoundError, app.i18n.T("globals.messages.notFound"), nil))
+	}
+	slug := r.RequestCtx.UserValue("article_slug").(string)
+	locale := resolveQueryLocale(r, helpCenter)
+	article, err := app.helpcenter.GetPublishedArticle(helpCenter.Slug, slug, locale)
+	if envErr, ok := err.(envelope.Error); ok && envErr.ErrorType == envelope.NotFoundError && locale != helpCenter.DefaultLocale {
+		article, err = app.helpcenter.GetPublishedArticle(helpCenter.Slug, slug, helpCenter.DefaultLocale)
+	}
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	hideArticleAuthor(helpCenterTheme(helpCenter), &article)
+	app.helpcenter.IncrementArticleViewCount(article.ID)
+	return r.SendEnvelope(article)
+}
+
+func widgetHelpCenter(r *fastglue.Request) (hcmodels.HelpCenter, livechat.HelpAudience, error) {
+	app := r.Context.(*App)
+	config, err := getWidgetConfig(r)
+	if err != nil {
+		return hcmodels.HelpCenter{}, livechat.HelpAudience{}, err
+	}
+	audience := config.Help.Visitors
+	if !getWidgetIsVisitor(r) {
+		audience = config.Help.Users
+	}
+	if config.Help.HelpCenterID == 0 || (!audience.Tab && !hasHelpHomeApp(config)) {
+		return hcmodels.HelpCenter{}, audience, nil
+	}
+	helpCenter, err := app.helpcenter.GetHelpCenterByID(config.Help.HelpCenterID)
+	if err != nil {
+		return hcmodels.HelpCenter{}, audience, err
+	}
+	if !helpCenter.IsActive {
+		return hcmodels.HelpCenter{}, audience, nil
+	}
+	return helpCenter, audience, nil
+}
+
+func widgetContact(r *fastglue.Request) (umodels.User, error) {
+	id, err := getWidgetContactID(r)
+	if err != nil {
+		return umodels.User{}, nil
+	}
+	return r.Context.(*App).user.GetContactOrVisitor(id, "")
+}
+
+func hasHelpHomeApp(config livechat.Config) bool {
+	return slices.ContainsFunc(config.HomeApps, func(app livechat.HomeApp) bool {
+		return app.Type == livechat.HomeAppHelp
+	})
+}
diff --git a/cmd/widget_transcript.go b/cmd/widget_transcript.go
new file mode 100644
index 00000000..97acc76f
--- /dev/null
+++ b/cmd/widget_transcript.go
@@ -0,0 +1,40 @@
+package main
+
+import (
+	"fmt"
+	"mime"
+	"time"
+
+	cmodels "github.com/abhinavxd/libredesk/internal/conversation/models"
+	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/abhinavxd/libredesk/internal/stringutil"
+	"github.com/zerodha/fastglue"
+)
+
+func handleWidgetTranscript(r *fastglue.Request) error {
+	app := r.Context.(*App)
+	config, err := getWidgetConfig(r)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	if !config.Features.Transcript {
+		return sendErrorEnvelope(r, envelope.NewError(envelope.PermissionError, app.i18n.T("status.deniedPermission"), nil))
+	}
+	uuid := r.RequestCtx.UserValue("uuid").(string)
+	_, conversation, err := getContactConversation(r, uuid)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	private := false
+	messages, err := app.conversation.GetAllConversationMessages(uuid, &private, []string{cmodels.MessageIncoming, cmodels.MessageOutgoing}, 0)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	filename := fmt.Sprintf("transcript-%s.txt", stringutil.SanitizeFilename(conversation.ReferenceNumber))
+	r.RequestCtx.Response.Header.Set("Content-Disposition", mime.FormatMediaType("attachment", map[string]string{"filename": filename}))
+	r.RequestCtx.Response.Header.Set("Cache-Control", "private, no-store")
+	r.RequestCtx.Response.Header.Set("X-Content-Type-Options", "nosniff")
+	r.RequestCtx.SetContentType("text/plain; charset=utf-8")
+	r.RequestCtx.SetBody(app.conversation.BuildTranscript(conversation, messages, time.Now()))
+	return nil
+}
diff --git a/frontend/apps/main/src/api/index.js b/frontend/apps/main/src/api/index.js
index d9370210..ec9c0eba 100644
--- a/frontend/apps/main/src/api/index.js
+++ b/frontend/apps/main/src/api/index.js
@@ -614,7 +614,10 @@ const markAllNotificationsAsRead = () => http.put('/api/v1/notifications/read-al
 const deleteNotification = (id) => http.delete(`/api/v1/notifications/${id}`)
 const deleteAllNotifications = () => http.delete('/api/v1/notifications')
 
+const getCampaignStats = (id, params) => http.get(`/api/v1/inboxes/${id}/campaign-stats`, { params })
+
 export default {
+ getCampaignStats,
   login,
   deleteUser,
   importAgents,
diff --git a/frontend/apps/main/src/composables/useConversationFilters.js b/frontend/apps/main/src/composables/useConversationFilters.js
index 9c0570b6..e1ecac35 100644
--- a/frontend/apps/main/src/composables/useConversationFilters.js
+++ b/frontend/apps/main/src/composables/useConversationFilters.js
@@ -26,7 +26,7 @@ export function useConversationFilters () {
         'text': FIELD_OPERATORS.TEXT_AUTOMATION,
         'number': FIELD_OPERATORS.NUMBER,
         'checkbox': FIELD_OPERATORS.BOOLEAN,
-        'date': FIELD_OPERATORS.DATE,
+        'date': FIELD_OPERATORS.DATE_AUTOMATION,
         'link': FIELD_OPERATORS.TEXT_AUTOMATION,
         'list': FIELD_OPERATORS.SELECT,
     }
diff --git a/frontend/apps/main/src/constants/filterConfig.js b/frontend/apps/main/src/constants/filterConfig.js
index c60b79ca..8fb103c2 100644
--- a/frontend/apps/main/src/constants/filterConfig.js
+++ b/frontend/apps/main/src/constants/filterConfig.js
@@ -75,6 +75,15 @@ export const FIELD_OPERATORS = {
         OPERATOR.LESS_THAN,
         OPERATOR.BETWEEN
     ],
+    // "between" is only implemented by the SQL filter builder, not the automation evaluator.
+    DATE_AUTOMATION: [
+        OPERATOR.EQUALS,
+        OPERATOR.NOT_EQUALS,
+        OPERATOR.SET,
+        OPERATOR.NOT_SET,
+        OPERATOR.GREATER_THAN,
+        OPERATOR.LESS_THAN
+    ],
     NUMBER: [OPERATOR.EQUALS, OPERATOR.NOT_EQUALS, OPERATOR.GREATER_THAN, OPERATOR.LESS_THAN],
     MULTI_SELECT: [OPERATOR.CONTAINS, OPERATOR.NOT_CONTAINS, OPERATOR.SET, OPERATOR.NOT_SET]
 }
diff --git a/frontend/apps/main/src/features/admin/automation/RuleBox.vue b/frontend/apps/main/src/features/admin/automation/RuleBox.vue
index c89a9f7e..0be166ac 100644
--- a/frontend/apps/main/src/features/admin/automation/RuleBox.vue
+++ b/frontend/apps/main/src/features/admin/automation/RuleBox.vue
@@ -48,7 +48,7 @@
               <SelectContent>
                 <SelectGroup>
                   <!-- Conversation fields -->
-                  <SelectLabel>{{ $t('globals.terms.conversation') }}</SelectLabel>
+                  <SelectLabel v-if="!contactsOnly">{{ $t('globals.terms.conversation') }}</SelectLabel>
                   <SelectItem v-for="(field, key) in currentFilters" :key="key" :value="key">
                     {{ field.label }}
                   </SelectItem>
@@ -231,13 +231,14 @@ import {
 import { Label } from '@shared-ui/components/ui/label'
 import { Input } from '@shared-ui/components/ui/input'
 import { useI18n } from 'vue-i18n'
-import { useConversationFilters } from '../../../composables/useConversationFilters'
+import { useConversationFilters } from '@/composables/useConversationFilters'
 import SelectComboBox from '@main/components/combobox/SelectCombobox.vue'
 import SelectAgentCombobox from '@main/components/combobox/SelectAgentCombobox.vue'
 import SelectTeamCombobox from '@main/components/combobox/SelectTeamCombobox.vue'
 import { operatorLabel } from '@/constants/filterConfig'
 
 const props = defineProps({
+  contactsOnly: { type: Boolean, default: false },
   ruleGroup: {
     type: Object,
     required: true
@@ -264,6 +265,7 @@ const { t } = useI18n()
 
 // Computed property to get the correct filters based on type
 const currentFilters = computed(() => {
+  if (props.contactsOnly) return {}
   if (props.type === 'new_conversation') return newConversationFilters.value
   if (props.type === 'conversation_update') return conversationFilters.value
   // previous_* values only exist on conversation update events.
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
index bcaeb530..692fafae 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
@@ -8,6 +8,8 @@
         }}</TabsTrigger>
         <TabsTrigger value="messages">{{ $t('admin.inbox.livechat.tabs.messages') }}</TabsTrigger>
         <TabsTrigger value="features">{{ $t('globals.terms.features') }}</TabsTrigger>
+        <TabsTrigger value="campaigns">{{ $t('widget.proactiveMessages') }}</TabsTrigger>
+        <TabsTrigger value="help">{{ $t('globals.terms.helpCenter', 1) }}</TabsTrigger>
         <TabsTrigger value="prechat">{{ $t('admin.inbox.livechat.tabs.prechat') }}</TabsTrigger>
         <TabsTrigger value="users">{{ $t('globals.terms.users') }}</TabsTrigger>
         <TabsTrigger value="security">{{ $t('globals.terms.security') }}</TabsTrigger>
@@ -366,10 +368,14 @@
                         </div>
                         <div class="flex-1">
                           <div class="text-xs text-muted-foreground mb-2">
-                            {{ item.type === 'announcement' ? $t('globals.terms.announcement') : $t('admin.inbox.livechat.externalLinks') }}
+                            {{ homeAppLabel(item.type) }}
                           </div>
+                          <!-- Help articles card has nothing to fill in; it renders from the Help tab. -->
+                          <p v-if="item.type === 'help'" class="text-sm text-muted-foreground">
+                            {{ $t('widget.helpHomeAppHint') }}
+                          </p>
                           <!-- Announcement fields -->
-                          <div v-if="item.type === 'announcement'" class="flex flex-col gap-2">
+                          <div v-else-if="item.type === 'announcement'" class="flex flex-col gap-2">
                             <Input v-model="item.title" :placeholder="$t('globals.terms.title')" @change="updateHomeApps" />
                             <Textarea v-model="item.description" :placeholder="$t('globals.terms.description')" rows="6" @change="updateHomeApps" />
                             <div class="grid grid-cols-2 gap-2">
@@ -378,7 +384,7 @@
                             </div>
                           </div>
                           <!-- External link fields -->
-                          <div v-else class="grid grid-cols-2 gap-2">
+                          <div v-else-if="item.type === 'external_link'" class="grid grid-cols-2 gap-2">
                             <Input v-model="item.text" :placeholder="$t('placeholders.linkText')" @change="updateHomeApps" />
                             <Input v-model="item.url" placeholder="https://example.com" @change="updateHomeApps" />
                           </div>
@@ -399,7 +405,20 @@
                       <Plus class="w-4 h-4"/>
                       {{ $t('globals.messages.addExternalLink') }}
                     </Button>
+                    <Button
+                      type="button"
+                      variant="outline"
+                      size="sm"
+                      :disabled="!form.values.config.help?.help_center_id || hasHelpHomeApp"
+                      @click="addHomeApp('help')"
+                    >
+                      <Plus class="w-4 h-4"/>
+                      {{ $t('widget.addHelpHomeApp') }}
+                    </Button>
                   </div>
+                  <p v-if="!form.values.config.help?.help_center_id" class="text-xs text-muted-foreground">
+                    {{ $t('widget.helpHomeAppRequiresCenter') }}
+                  </p>
                   <p v-if="showHomeAppsError && incompleteHomeApps" class="text-sm text-destructive flex items-start gap-1.5">
                     <TriangleAlert class="size-4 shrink-0 mt-0.5" />
                     <span>{{ $t('admin.inbox.livechat.homeApps.incomplete') }}</span>
@@ -635,6 +654,18 @@
           </div>
 
           <!-- Chat Features -->
+          <div class="space-y-4">
+            <h4 class="text-base font-semibold">{{ $t('widget.replyPreviews') }}</h4>
+            <FormField v-for="device in ['desktop', 'mobile']" :key="device" v-slot="{ componentField, handleChange }" :name="`config.previews.${device}`">
+              <FormItem><SwitchField :title="$t(`globals.terms.${device}`)" :checked="componentField.modelValue" @update:checked="handleChange" /></FormItem>
+            </FormField>
+            <FormField v-slot="{ componentField }" name="config.previews.content">
+              <FormItem><FormLabel>{{ $t('widget.previewContent') }}</FormLabel><Select v-bind="componentField"><SelectTrigger><SelectValue /></SelectTrigger><SelectContent><SelectItem value="message">{{ $t('widget.messagePreview') }}</SelectItem><SelectItem value="generic">{{ $t('widget.genericNotice') }}</SelectItem></SelectContent></Select><FormMessage /></FormItem>
+            </FormField>
+            <FormField v-slot="{ value, handleChange, meta }" name="config.previews.auto_hide_seconds">
+              <FormItem><FormLabel>{{ $t('widget.autoHideSeconds') }}</FormLabel><FormControl><Input type="number" min="0" max="300" :model-value="value" @update:model-value="value => handleChange(Number(value), meta.validated)" /></FormControl><FormMessage /></FormItem>
+            </FormField>
+          </div>
           <div class="space-y-4">
             <h4 class="text-base font-semibold text-foreground">{{ $t('globals.terms.features') }}</h4>
 
@@ -664,6 +695,12 @@
                 </FormItem>
               </FormField>
 
+              <FormField v-slot="{ componentField, handleChange }" name="config.features.transcript">
+                <FormItem>
+                  <SwitchField :title="$t('conversation.downloadTranscript')" :checked="componentField.modelValue" @update:checked="handleChange" />
+                </FormItem>
+              </FormField>
+
               <FormField
                 v-slot="{ componentField, handleChange }"
                 name="config.direct_to_conversation"
@@ -681,6 +718,41 @@
           </div>
         </div>
 
+        <!-- Proactive messages Tab -->
+        <div v-show="activeTab === 'campaigns'" class="space-y-3">
+          <WidgetCampaigns
+            :model-value="form.values.config.campaigns || []"
+            :inbox-id="initialValues.id || 0"
+            :cooldown="form.values.config.campaign_cooldown_hours || 24"
+            @update:model-value="form.setFieldValue('config.campaigns', $event, false)"
+            @update:cooldown="form.setFieldValue('config.campaign_cooldown_hours', $event, false)"
+            @update:preview="previewCampaign = $event"
+          />
+          <template v-for="(error, field) in form.errors.value" :key="field">
+            <p v-if="field.startsWith('config.campaign')" role="alert" class="text-sm text-destructive">
+              {{ error }}
+            </p>
+          </template>
+        </div>
+
+        <!-- Help Tab -->
+        <div v-show="activeTab === 'help'" class="space-y-3">
+          <WidgetHelpConfig
+            :model-value="form.values.config.help"
+            :centers="helpCenters"
+            :articles="helpArticles"
+            :failed="helpFailed"
+            @update:model-value="form.setFieldValue('config.help', $event, false)"
+          />
+          <p
+            v-if="Object.keys(form.errors.value).some((key) => key.startsWith('config.help'))"
+            role="alert"
+            class="text-sm text-destructive"
+          >
+            {{ $t('validation.invalidValue') }}
+          </p>
+        </div>
+
         <!-- Security Tab -->
         <div v-show="activeTab === 'security'" class="space-y-8">
           <div class="grid grid-cols-2 gap-6">
@@ -980,8 +1052,12 @@
 import { watch, computed, ref, inject, onMounted, onBeforeUnmount } from 'vue'
 import { useForm } from 'vee-validate'
 import { toTypedSchema } from '@vee-validate/zod'
-import { createFormSchema } from './livechatFormSchema.js'
+import { createFormSchema, defaultWidgetHelp, defaultWidgetPreviews } from './livechatFormSchema.js'
+import WidgetHelpConfig from './WidgetHelpConfig.vue'
+import { useHelpCenterArticles } from './useHelpCenterArticles.js'
+import WidgetCampaigns from './WidgetCampaigns.vue'
 import { useInboxStore } from '@/stores/inbox'
+import api from '@/api'
 import {
   FormControl,
   FormField,
@@ -1007,6 +1083,7 @@ import { Label } from '@shared-ui/components/ui/label'
 import { Plus, X, TriangleAlert, GripVertical, Lightbulb } from 'lucide-vue-next'
 import Draggable from 'vuedraggable'
 import { useI18n } from 'vue-i18n'
+import { useRoute, useRouter } from 'vue-router'
 import PreChatFormConfig, { getDefaultPrechatFields } from './PreChatFormConfig.vue'
 import { useAppSettingsStore } from '@/stores/appSettings'
 import { useEmitter } from '@/composables/useEmitter'
@@ -1024,9 +1101,25 @@ const WIDGET_BG = { light: '#ffffff', dark: '#1a1a1e' }
 const DEFAULT_GRADIENT_START = '#2563eb'
 const DEFAULT_GRADIENT_END = '#1e40af'
 
+const TABS = [
+  'general',
+  'appearance',
+  'messages',
+  'features',
+  'campaigns',
+  'help',
+  'prechat',
+  'users',
+  'security',
+  'installation'
+]
+
 // Maps a field path prefix to its tab, so a failed submit jumps to the tab holding the error.
 // Ordered: specific prefixes before the general-tab fallbacks.
 const FIELD_TAB = [
+  ['config.help', 'help'],
+  ['config.previews', 'features'],
+  ['config.campaign', 'campaigns'],
   ['config.home_screen', 'appearance'],
   ['config.colors', 'appearance'],
   ['config.launcher', 'appearance'],
@@ -1080,7 +1173,10 @@ const props = defineProps({
 })
 
 const { t } = useI18n()
-const activeTab = ref('general')
+const route = useRoute()
+const router = useRouter()
+const activeTab = ref(TABS.includes(route.query.tab) ? route.query.tab : 'general')
+watch(activeTab, (tab) => router.replace({ query: { ...route.query, tab } }))
 const selectedUserTab = ref('visitors')
 const homeApps = ref([])
 const prechatConfig = ref({
@@ -1163,6 +1259,9 @@ const form = useForm({
     prompt_tags_on_reply: false,
     linked_email_inbox_id: null,
     config: {
+      help: defaultWidgetHelp(),
+      previews: defaultWidgetPreviews(),
+      campaigns: [], campaign_cooldown_hours: 24,
       brand_name: '',
       website_url: '',
       dark_mode: false,
@@ -1204,6 +1303,7 @@ const form = useForm({
         fade_background: false
       },
       features: {
+        transcript: props.isNewForm,
         file_upload: true,
         emoji: true
       },
@@ -1278,10 +1378,24 @@ const weakSecret = computed(() => {
   return typeof s === 'string' && s.length > 0 && s.length < 32
 })
 
+const helpCenters = ref([])
+const helpCenterID = computed(() => form.values.config?.help?.help_center_id || 0)
+const {
+  tree: helpTree,
+  articles: helpArticles,
+  failed: helpFailed
+} = useHelpCenterArticles(helpCenterID)
+
+// The campaign the admin is editing, mirrored in the preview as an invitation card.
+const previewCampaign = ref(null)
+
 // home_apps in form.values only syncs on change events, so pull the live ref for the preview.
 const previewConfig = computed(() => ({
   ...form.values.config,
-  home_apps: homeApps.value
+  home_apps: homeApps.value,
+  help_tree: helpTree.value,
+  help_articles: helpArticles.value,
+  preview_campaign: activeTab.value === 'campaigns' ? previewCampaign.value : null
 }))
 
 // InboxView renders the preview in the help rail; feed it this form's live config while mounted.
@@ -1313,12 +1427,23 @@ const onBackgroundTypeChange = (type) => {
 const addHomeApp = (type) => {
   if (type === 'announcement') {
     homeApps.value.push({ type: 'announcement', title: '', description: '', image_url: '', url: '' })
+  } else if (type === 'help') {
+    homeApps.value.push({ type: 'help' })
   } else {
     homeApps.value.push({ type: 'external_link', text: '', url: '' })
   }
   updateHomeApps()
 }
 
+const HOME_APP_LABELS = {
+  announcement: 'globals.terms.announcement',
+  external_link: 'admin.inbox.livechat.externalLinks',
+  help: 'globals.terms.helpCenter'
+}
+const homeAppLabel = (type) => t(HOME_APP_LABELS[type], 1)
+
+const hasHelpHomeApp = computed(() => homeApps.value.some((item) => item.type === 'help'))
+
 const removeHomeApp = (index) => {
   homeApps.value.splice(index, 1)
   updateHomeApps()
@@ -1329,15 +1454,19 @@ const updateHomeApps = () => {
   form.setFieldValue('config.home_apps', homeApps.value)
 }
 
-const isHomeAppEmpty = (item) =>
-  item.type === 'announcement'
+const isHomeAppEmpty = (item) => {
+  if (item.type === 'help') return false
+  return item.type === 'announcement'
     ? !item.title && !item.description && !item.image_url && !item.url
     : !item.text && !item.url
+}
 
-const isHomeAppComplete = (item) =>
-  item.type === 'announcement'
+const isHomeAppComplete = (item) => {
+  if (item.type === 'help') return true
+  return item.type === 'announcement'
     ? Boolean(item.title && item.image_url && item.url)
     : Boolean(item.text && item.url)
+}
 
 // A row with some data but missing required fields, so submit is blocked instead of
 // silently dropping what the user typed. Fully empty rows are dropped on submit.
@@ -1351,9 +1480,14 @@ const showHomeAppsError = ref(false)
 const textareaToLines = (value) =>
   typeof value === 'string' ? value.split('\n').map((line) => line.trim()).filter(Boolean) : []
 
-onMounted(() => {
+onMounted(async () => {
   inboxStore.fetchInboxes()
   appSettingsStore.fetchPublicConfig()
+  try {
+    helpCenters.value = (await api.getHelpCenters()).data.data || []
+  } catch {
+    helpFailed.value = true
+  }
 })
 
 const onSubmit = form.handleSubmit(async (values) => {
@@ -1429,7 +1563,7 @@ watch(
       prechatConfig.value = pc
     }
 
-    form.setValues(newValues, false)
+    form.setValues({ ...newValues, config: { ...newValues.config, campaigns: newValues.config?.campaigns || [], campaign_cooldown_hours: newValues.config?.campaign_cooldown_hours || 24, help: newValues.config?.help || defaultWidgetHelp(), previews: newValues.config?.previews || defaultWidgetPreviews(), features: { ...newValues.config?.features, transcript: newValues.config?.features?.transcript ?? false } } }, false)
   },
   { deep: true, immediate: true }
 )
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
index 0407467d..5387b49f 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
@@ -231,10 +231,36 @@
                   ></div>
                 </div>
 
-                <div v-if="homeApps.length" class="flex flex-col gap-3 p-4 bg-background">
-                  <template v-for="(item, index) in homeApps" :key="index">
+                <div v-if="homeItems.length" class="flex flex-col gap-3 p-4 bg-background">
+                  <template v-for="(item, index) in homeItems" :key="index">
+                    <!-- Mirrors the widget's HomeHelp card. -->
+                    <section
+                      v-if="item.type === 'help'"
+                      class="border rounded-lg p-3 space-y-2 bg-card"
+                    >
+                      <Button
+                        type="button"
+                        variant="outline"
+                        class="w-full justify-start"
+                        @click="view = 'help'"
+                      >
+                        <Search class="size-4" />
+                        {{ $t('widget.searchArticles') }}
+                      </Button>
+                      <Button
+                        v-for="article in featuredArticles"
+                        :key="article.id"
+                        type="button"
+                        variant="ghost"
+                        class="w-full h-auto justify-start text-left whitespace-normal"
+                        @click="view = 'help'"
+                      >
+                        <FileText class="size-4 shrink-0" />
+                        {{ article.title }}
+                      </Button>
+                    </section>
                     <Card
-                      v-if="item.type === 'announcement'"
+                      v-else-if="item.type === 'announcement'"
                       class="overflow-hidden rounded-md hover:bg-accent transition-colors"
                     >
                       <img
@@ -266,6 +292,41 @@
                 </div>
               </div>
 
+              <!-- Help -->
+              <div v-else-if="view === 'help'" class="h-full flex flex-col">
+                <header class="flex items-center gap-2 border-b border-border p-3 shrink-0">
+                  <button
+                    v-if="helpCollection"
+                    type="button"
+                    class="flex items-center justify-center size-8 rounded-md hover:bg-accent text-foreground"
+                    @click="helpPath.pop()"
+                  >
+                    <ArrowLeft :size="16" />
+                  </button>
+                  <h3 class="font-medium truncate">{{ $t('globals.terms.help') }}</h3>
+                </header>
+                <div class="flex gap-2 p-3 border-b border-border shrink-0">
+                  <Input :placeholder="$t('widget.searchArticles')" readonly />
+                  <Button type="button" variant="outline">
+                    <Search class="size-4" />
+                  </Button>
+                </div>
+                <div class="flex-1 min-h-0 overflow-y-auto">
+                  <p
+                    v-if="!helpCollections.length && !helpArticles.length"
+                    class="p-4 text-sm text-muted-foreground"
+                  >
+                    {{ $t('widget.noArticles') }}
+                  </p>
+                  <HelpCollectionList
+                    v-else
+                    :collection="helpCollection"
+                    :collections="helpCollections"
+                    :articles="helpArticles"
+                    @collection="helpPath.push($event)"
+                  />
+                </div>
+              </div>
               <!-- Messages -->
               <div v-else class="h-full flex flex-col relative">
                 <div class="flex items-center justify-center p-4 border-b border-border shrink-0">
@@ -308,11 +369,11 @@
             </div>
 
             <!-- Bottom nav -->
-            <div class="grid grid-cols-2 border-t border-border bg-background shrink-0">
+            <div class="flex border-t border-border bg-background shrink-0">
               <button
                 type="button"
-                class="flex flex-col items-center gap-1 py-2"
-                :class="view === 'home' ? 'text-foreground' : 'text-muted-foreground'"
+                class="flex flex-col items-center justify-center gap-1 w-full py-4"
+                :class="view === 'home' ? 'text-primary' : 'text-muted-foreground'"
                 @click="view = 'home'"
               >
                 <House class="w-5 h-5" />
@@ -320,19 +381,53 @@
               </button>
               <button
                 type="button"
-                class="flex flex-col items-center gap-1 py-2"
-                :class="view === 'messages' ? 'text-foreground' : 'text-muted-foreground'"
+                class="flex flex-col items-center justify-center gap-1 w-full py-4"
+                :class="view === 'messages' ? 'text-primary' : 'text-muted-foreground'"
                 @click="view = 'messages'"
               >
                 <MessagesSquare class="w-5 h-5" />
                 <span class="text-xs font-medium">{{ $t('globals.terms.message', 2) }}</span>
               </button>
+              <button
+                v-if="showHelpTab"
+                type="button"
+                class="flex flex-col items-center justify-center gap-1 w-full py-4"
+                :class="view === 'help' ? 'text-primary' : 'text-muted-foreground'"
+                @click="view = 'help'"
+              >
+                <CircleQuestionMark class="w-5 h-5" />
+                <span class="text-xs font-medium">{{ $t('globals.terms.help') }}</span>
+              </button>
             </div>
           </template>
         </div>
       </div>
     </transition>
 
+    <!-- Proactive message, mirrors the card widget.js renders above the launcher. -->
+    <div v-if="campaign && !open" class="absolute" :style="campaignStyle">
+      <div
+        class="flex items-start border border-border rounded-xl bg-background text-foreground overflow-hidden shadow-lg"
+        :class="isDark ? 'dark' : 'light'"
+      >
+        <div class="flex items-start gap-2.5 flex-1 min-w-0 p-3 text-left">
+          <img
+            v-if="campaign.avatar"
+            :src="campaign.avatar"
+            alt=""
+            class="size-7 rounded-full object-cover shrink-0"
+          />
+          <span class="min-w-0">
+            <span class="block font-semibold text-sm">{{ campaign.sender }}</span>
+            <span class="block text-sm line-clamp-3">{{ campaignText }}</span>
+          </span>
+        </div>
+        <div class="flex items-center justify-center size-11 text-muted-foreground shrink-0">
+          <X :size="16" />
+        </div>
+      </div>
+    </div>
+
     <!-- Launcher -->
     <button
       type="button"
@@ -347,7 +442,7 @@
 </template>
 
 <script setup>
-import { computed, ref } from 'vue'
+import { computed, ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { Button } from '@shared-ui/components/ui/button'
 import { Card, CardContent } from '@shared-ui/components/ui/card'
@@ -356,6 +451,7 @@ import { Textarea } from '@shared-ui/components/ui/textarea'
 import {
   House,
   MessagesSquare,
+  CircleQuestionMark,
   ArrowRight,
   ArrowLeft,
   ArrowUp,
@@ -365,14 +461,19 @@ import {
   AlertTriangle,
   Paperclip,
   Smile,
-  Maximize2
+  Maximize2,
+  Search,
+  FileText,
+  X
 } from 'lucide-vue-next'
+import HelpCollectionList from '@shared-ui/components/HelpCollectionList.vue'
 import { hexToHSL, getContrastingHSL } from '@shared-ui/utils/color'
 import { renderTemplate } from '@shared-ui/utils/string'
 
 const DEFAULT_LAUNCHER_LOGO = '/static/public/launcher-logo.png'
 const HEX_COLOR = /^#([0-9a-f]{6}|[0-9a-f]{3})$/i
 const LAUNCHER_SIZE = 52
+const SNIPPET_LENGTH = 240
 
 const props = defineProps({
   userType: {
@@ -498,7 +599,40 @@ const sampleLastMessage = computed(
   () => sampleMessages.value[sampleMessages.value.length - 1].content
 )
 
-const homeApps = computed(() => props.config.home_apps || [])
+const helpConfig = computed(() => props.config.help || {})
+const helpAudience = computed(() => helpConfig.value[props.userType] || {})
+const helpEnabled = computed(() => Boolean(helpConfig.value.help_center_id))
+const showHelpTab = computed(() => helpEnabled.value && Boolean(helpAudience.value.tab))
+
+const featuredArticles = computed(() =>
+  (helpConfig.value.featured_ids || [])
+    .map((id) => (props.config.help_articles || []).find((article) => article.id === id))
+    .filter(Boolean)
+)
+
+const helpPath = ref([])
+const helpCollection = computed(() => helpPath.value.at(-1))
+const helpCollections = computed(
+  () => helpCollection.value?.children || props.config.help_tree || []
+)
+const helpArticles = computed(() => helpCollection.value?.articles || [])
+watch(
+  () => helpConfig.value.help_center_id,
+  () => {
+    helpPath.value = []
+  }
+)
+
+const homeItems = computed(() =>
+  (props.config.home_apps || []).filter((item) => item.type !== 'help' || helpEnabled.value)
+)
+
+const campaign = computed(() => props.config.preview_campaign || null)
+// Only one of the two can show, so collapse the window to reveal the invitation.
+watch(campaign, (value) => {
+  if (value) open.value = false
+})
+const campaignText = computed(() => campaign.value?.message.slice(0, SNIPPET_LENGTH) || '')
 
 const prechatFields = computed(() =>
   (props.config.prechat_form?.fields || [])
@@ -524,6 +658,11 @@ const launcherColor = computed(() => {
   return HEX_COLOR.test(primary) ? primary : '#000000'
 })
 const launcherIconColor = computed(() => `hsl(${getContrastingHSL(launcherColor.value)})`)
+const campaignStyle = computed(() => ({
+  bottom: windowBottom.value + 'px',
+  [onLeft.value ? 'left' : 'right']: clampedSide.value + 'px',
+  width: `min(280px, calc(100% - ${clampedSide.value * 2}px))`
+}))
 const launcherStyle = computed(() => ({
   width: LAUNCHER_SIZE + 'px',
   height: LAUNCHER_SIZE + 'px',
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
new file mode 100644
index 00000000..49310a37
--- /dev/null
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
@@ -0,0 +1,561 @@
+<script setup>
+import { ref, computed, watch, onMounted } from 'vue'
+import { useI18n } from 'vue-i18n'
+import api from '@/api'
+import { Button } from '@shared-ui/components/ui/button'
+import { Badge } from '@shared-ui/components/ui/badge'
+import { Input } from '@shared-ui/components/ui/input'
+import { Textarea } from '@shared-ui/components/ui/textarea'
+import { Label } from '@shared-ui/components/ui/label'
+import { Switch } from '@shared-ui/components/ui/switch'
+import {
+  Select,
+  SelectTrigger,
+  SelectValue,
+  SelectContent,
+  SelectItem
+} from '@shared-ui/components/ui/select'
+import {
+  Table,
+  TableBody,
+  TableCell,
+  TableHead,
+  TableHeader,
+  TableRow
+} from '@shared-ui/components/ui/table'
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle
+} from '@shared-ui/components/ui/alert-dialog'
+import {
+  Collapsible,
+  CollapsibleContent,
+  CollapsibleTrigger
+} from '@shared-ui/components/ui/collapsible'
+import SwitchField from '@shared-ui/components/SwitchField.vue'
+import WidgetConditions from './WidgetConditions.vue'
+import { defaultCampaign } from './livechatFormSchema.js'
+import { handleHTTPError } from '@shared-ui/utils/http'
+import { ChevronRight, ChevronDown, Plus, CircleCheck, CircleSlash } from 'lucide-vue-next'
+
+const MAX_CAMPAIGNS = 50
+const STAT_KEYS = ['displayed', 'opened', 'dismissed', 'replied']
+const SELECT_FIELDS = [{ key: 'audience', values: ['all', 'visitors', 'users'] }]
+const DEVICES = ['desktop', 'mobile']
+
+const props = defineProps({
+  modelValue: { type: Array, default: () => [] },
+  inboxId: { type: Number, default: 0 },
+  cooldown: { type: Number, default: 24 }
+})
+const emit = defineEmits(['update:modelValue', 'update:cooldown', 'update:preview'])
+const { t } = useI18n()
+
+const selected = ref('')
+const campaign = computed(() => props.modelValue.find((item) => item.id === selected.value))
+const teams = ref([])
+const agents = ref([])
+const businessHours = ref([])
+const error = ref('')
+const pendingDelete = ref(null)
+const stats = ref([])
+const from = ref(new Date(Date.now() - 30 * 86400000).toISOString().slice(0, 10))
+const to = ref(new Date().toISOString().slice(0, 10))
+const senderName = (id) => {
+  const agent = agents.value.find((item) => item.id === id)
+  return agent ? `${agent.first_name} ${agent.last_name || ''}`.trim() : t('widget.brandBot')
+}
+
+const audienceLabel = (item) => t(`widget.campaign.${item.audience}`)
+
+const pagesLabel = (item) =>
+  item.include_urls.filter(Boolean).length
+    ? item.include_urls.filter(Boolean).join(', ')
+    : t('globals.messages.all')
+
+// The rail preview mirrors what widget.js renders above the launcher for this campaign.
+watch(
+  [campaign, agents],
+  () => {
+    if (!campaign.value) {
+      emit('update:preview', null)
+      return
+    }
+    const agent = agents.value.find((item) => item.id === campaign.value.sender_id)
+    emit('update:preview', {
+      sender: senderName(campaign.value.sender_id),
+      avatar: agent?.avatar_url || '',
+      message: campaign.value.message
+    })
+  },
+  { deep: true, immediate: true }
+)
+
+const update = (key, value) => {
+  emit(
+    'update:modelValue',
+    props.modelValue.map((item) => (item.id === selected.value ? { ...item, [key]: value } : item))
+  )
+}
+
+const toggleEnabled = (id, enabled) =>
+  emit(
+    'update:modelValue',
+    props.modelValue.map((item) => (item.id === id ? { ...item, enabled } : item))
+  )
+
+const add = (source) => {
+  const item = source
+    ? {
+        ...JSON.parse(JSON.stringify(source)),
+        id: crypto.randomUUID(),
+        enabled: false,
+        name: `${source.name} (${t('globals.terms.copy')})`
+      }
+    : defaultCampaign()
+  emit('update:modelValue', [...props.modelValue, item])
+  selected.value = item.id
+}
+
+const remove = () => {
+  emit(
+    'update:modelValue',
+    props.modelValue.filter((item) => item.id !== pendingDelete.value)
+  )
+  if (selected.value === pendingDelete.value) selected.value = ''
+  pendingDelete.value = null
+}
+
+const refreshStats = async () => {
+  if (!props.inboxId) return
+  try {
+    stats.value = (
+      await api.getCampaignStats(props.inboxId, { from: from.value, to: to.value })
+    ).data.data
+  } catch (err) {
+    error.value = handleHTTPError(err).message
+  }
+}
+
+onMounted(async () => {
+  const responses = await Promise.allSettled([
+    api.getTeams(),
+    api.getUsersCompact({ enabled: true, per_page: 100 }),
+    api.getAllBusinessHours()
+  ])
+  for (const [index, response] of responses.entries()) {
+    if (response.status === 'rejected') {
+      error.value = handleHTTPError(response.reason).message
+      continue
+    }
+    const data = response.value.data.data
+    ;[teams, agents, businessHours][index].value = data.results || data
+  }
+  await refreshStats()
+})
+</script>
+
+<template>
+  <div class="space-y-6">
+    <p v-if="error" role="alert" class="text-sm text-destructive">{{ error }}</p>
+
+    <!-- Campaign list -->
+    <template v-if="!campaign">
+      <p class="text-sm text-muted-foreground">{{ t('widget.campaignsHint') }}</p>
+
+      <div class="space-y-2 max-w-md">
+        <Label for="campaign-cooldown">{{ t('widget.campaignCooldown') }}</Label>
+        <Input
+          id="campaign-cooldown"
+          type="number"
+          min="1"
+          max="8760"
+          :model-value="cooldown"
+          @update:model-value="emit('update:cooldown', Number($event))"
+        />
+      </div>
+
+      <div class="space-y-4">
+        <h4 class="text-base font-semibold text-foreground">{{ t('widget.proactiveMessages') }}</h4>
+
+        <div v-if="modelValue.length" class="space-y-2">
+          <div
+            v-for="item in modelValue"
+            :key="item.id"
+            class="flex items-center gap-3 p-3 border rounded-md hover:bg-accent/50 transition-colors cursor-pointer"
+            role="button"
+            tabindex="0"
+            @click="selected = item.id"
+            @keydown.enter.prevent="selected = item.id"
+            @keydown.space.prevent="selected = item.id"
+          >
+            <Switch
+              :checked="item.enabled"
+              :aria-label="t('globals.terms.enabled')"
+              @click.stop
+              @update:checked="toggleEnabled(item.id, $event)"
+            />
+            <div class="flex-1 min-w-0">
+              <div class="flex items-center gap-2">
+                <span class="text-sm font-medium text-foreground truncate">
+                  {{ item.name || t('widget.newCampaign') }}
+                </span>
+                <Badge :variant="item.enabled ? 'success' : 'secondary'" class="gap-1 shrink-0">
+                  <component :is="item.enabled ? CircleCheck : CircleSlash" class="size-3" />
+                  {{ item.enabled ? t('globals.terms.enabled') : t('globals.terms.paused') }}
+                </Badge>
+              </div>
+              <p class="text-xs text-muted-foreground truncate mt-0.5">
+                {{ audienceLabel(item) }} · {{ pagesLabel(item) }}
+              </p>
+            </div>
+            <ChevronRight class="size-4 text-muted-foreground shrink-0" />
+          </div>
+        </div>
+
+        <Button
+          type="button"
+          variant="outline"
+          size="sm"
+          :disabled="modelValue.length >= MAX_CAMPAIGNS"
+          @click="add()"
+        >
+          <Plus class="size-4" />
+          {{ t('widget.addCampaign') }}
+        </Button>
+        <p v-if="modelValue.length >= MAX_CAMPAIGNS" class="text-xs text-muted-foreground">
+          {{ t('widget.campaignLimitReached') }}
+        </p>
+      </div>
+
+      <!-- Results -->
+      <Collapsible v-if="inboxId" class="space-y-4">
+        <CollapsibleTrigger
+          class="flex items-center gap-2 text-base font-semibold text-foreground group"
+        >
+          <ChevronDown class="size-4 transition-transform group-data-[state=closed]:-rotate-90" />
+          {{ t('widget.campaignStats') }}
+        </CollapsibleTrigger>
+        <CollapsibleContent class="space-y-4">
+          <div class="flex flex-wrap gap-3 items-end">
+            <div class="space-y-2">
+              <Label for="campaign-stats-from">{{ t('globals.terms.from') }}</Label>
+              <Input id="campaign-stats-from" v-model="from" type="date" />
+            </div>
+            <div class="space-y-2">
+              <Label for="campaign-stats-to">{{ t('globals.terms.to') }}</Label>
+              <Input id="campaign-stats-to" v-model="to" type="date" />
+            </div>
+            <Button type="button" variant="outline" @click="refreshStats">
+              {{ t('globals.terms.refresh') }}
+            </Button>
+          </div>
+          <Table>
+            <TableHeader>
+              <TableRow>
+                <TableHead>{{ t('globals.terms.name') }}</TableHead>
+                <TableHead v-for="key in STAT_KEYS" :key="key" class="text-right">
+                  {{ t(`widget.campaign.${key}`) }}
+                </TableHead>
+              </TableRow>
+            </TableHeader>
+            <TableBody>
+              <TableRow v-for="row in stats" :key="row.campaign_id">
+                <TableCell>
+                  {{
+                    modelValue.find((item) => item.id === row.campaign_id)?.name ||
+                    t('widget.deletedCampaign')
+                  }}
+                </TableCell>
+                <TableCell v-for="key in STAT_KEYS" :key="key" class="text-right tabular-nums">
+                  {{ row[key] }}
+                </TableCell>
+              </TableRow>
+              <TableRow v-if="!stats.length">
+                <TableCell :colspan="STAT_KEYS.length + 1" class="text-muted-foreground">
+                  {{ t('globals.messages.noResultsFound') }}
+                </TableCell>
+              </TableRow>
+            </TableBody>
+          </Table>
+        </CollapsibleContent>
+      </Collapsible>
+    </template>
+
+    <!-- Campaign editor -->
+    <template v-else>
+      <div class="flex items-center justify-between gap-2">
+        <Button type="button" variant="ghost" size="sm" class="-ml-2" @click="selected = ''">
+          <ChevronRight class="size-4 rotate-180" />
+          {{ t('widget.backToCampaigns') }}
+        </Button>
+        <div class="flex gap-2">
+          <Button
+            type="button"
+            variant="outline"
+            size="sm"
+            :disabled="modelValue.length >= MAX_CAMPAIGNS"
+            @click="add(campaign)"
+          >
+            {{ t('globals.terms.duplicate') }}
+          </Button>
+          <Button
+            type="button"
+            variant="destructive"
+            size="sm"
+            @click="pendingDelete = campaign.id"
+          >
+            {{ t('globals.messages.delete') }}
+          </Button>
+        </div>
+      </div>
+
+      <SwitchField
+        :title="t('globals.terms.enabled')"
+        :checked="campaign.enabled"
+        @update:checked="update('enabled', $event)"
+      />
+
+      <!-- Message -->
+      <div class="space-y-4">
+        <h4 class="text-base font-semibold text-foreground">{{ t('globals.terms.message', 1) }}</h4>
+
+        <div class="space-y-2">
+          <Label for="campaign-name">{{ t('globals.terms.name') }}</Label>
+          <Input
+            id="campaign-name"
+            :model-value="campaign.name"
+            maxlength="128"
+            @update:model-value="update('name', $event)"
+          />
+        </div>
+
+        <div class="space-y-2">
+          <Label for="campaign-message">{{ t('globals.terms.message', 1) }}</Label>
+          <Textarea
+            id="campaign-message"
+            :model-value="campaign.message"
+            maxlength="10000"
+            rows="4"
+            @update:model-value="update('message', $event)"
+          />
+        </div>
+
+        <div class="grid sm:grid-cols-2 gap-4">
+          <div class="space-y-2">
+            <Label for="campaign-sender">{{ t('widget.campaignSender') }}</Label>
+            <Select
+              :model-value="String(campaign.sender_id)"
+              @update:model-value="update('sender_id', Number($event))"
+            >
+              <SelectTrigger id="campaign-sender"><SelectValue /></SelectTrigger>
+              <SelectContent>
+                <SelectItem value="0">{{ t('widget.brandBot') }}</SelectItem>
+                <SelectItem v-for="agent in agents" :key="agent.id" :value="String(agent.id)">
+                  {{ agent.first_name }} {{ agent.last_name }}
+                </SelectItem>
+              </SelectContent>
+            </Select>
+          </div>
+
+          <div class="space-y-2">
+            <Label for="campaign-team">{{ t('widget.replyTeam') }}</Label>
+            <Select
+              :model-value="String(campaign.team_id)"
+              @update:model-value="update('team_id', Number($event))"
+            >
+              <SelectTrigger id="campaign-team"><SelectValue /></SelectTrigger>
+              <SelectContent>
+                <SelectItem value="0">{{ t('globals.terms.none') }}</SelectItem>
+                <SelectItem v-for="team in teams" :key="team.id" :value="String(team.id)">
+                  {{ team.name }}
+                </SelectItem>
+              </SelectContent>
+            </Select>
+          </div>
+
+          <div v-for="field in SELECT_FIELDS" :key="field.key" class="space-y-2">
+            <Label :for="`campaign-${field.key}`">{{ t(`widget.campaign.${field.key}`) }}</Label>
+            <Select
+              :model-value="campaign[field.key]"
+              @update:model-value="update(field.key, $event)"
+            >
+              <SelectTrigger :id="`campaign-${field.key}`"><SelectValue /></SelectTrigger>
+              <SelectContent>
+                <SelectItem v-for="value in field.values" :key="value" :value="value">
+                  {{ t(`widget.campaign.${value}`) }}
+                </SelectItem>
+              </SelectContent>
+            </Select>
+          </div>
+        </div>
+      </div>
+
+      <!-- Who sees it -->
+      <div class="space-y-4">
+        <h4 class="text-base font-semibold text-foreground">
+          {{ t('widget.campaign.section.audience') }}
+        </h4>
+
+        <div class="space-y-3">
+          <p class="text-sm font-medium text-foreground">{{ t('widget.campaign.devices') }}</p>
+          <SwitchField
+            v-for="device in DEVICES"
+            :key="device"
+            :title="t(`globals.terms.${device}`)"
+            :checked="campaign[device]"
+            @update:checked="update(device, $event)"
+          />
+        </div>
+
+        <div class="space-y-2">
+          <p class="text-sm font-medium text-foreground">{{ t('globals.messages.visibleWhen') }}</p>
+          <WidgetConditions
+            :model-value="campaign.conditions"
+            @update:model-value="update('conditions', $event)"
+          />
+        </div>
+      </div>
+
+      <!-- Where and when -->
+      <div class="space-y-4">
+        <h4 class="text-base font-semibold text-foreground">
+          {{ t('widget.campaign.section.placement') }}
+        </h4>
+
+        <div v-for="key in ['include_urls', 'exclude_urls']" :key="key" class="space-y-2">
+          <Label :for="`campaign-${key}`">{{ t(`widget.campaign.${key}`) }}</Label>
+          <Textarea
+            :id="`campaign-${key}`"
+            :model-value="campaign[key].join('\n')"
+            rows="3"
+            @update:model-value="update(key, $event.split('\n'))"
+          />
+          <p class="text-xs text-muted-foreground">{{ t('widget.urlPatternsHint') }}</p>
+        </div>
+
+        <div class="grid sm:grid-cols-2 gap-4">
+          <div class="space-y-2">
+            <Label for="campaign-delay_seconds">{{ t('widget.campaign.delay_seconds') }}</Label>
+            <Input
+              id="campaign-delay_seconds"
+              type="number"
+              min="0"
+              max="86400"
+              :model-value="campaign.delay_seconds"
+              @update:model-value="update('delay_seconds', Number($event))"
+            />
+          </div>
+
+          <div class="space-y-2">
+            <Label for="campaign-event">{{ t('widget.campaign.event') }}</Label>
+            <Input
+              id="campaign-event"
+              :model-value="campaign.event"
+              maxlength="128"
+              @update:model-value="update('event', $event)"
+            />
+          </div>
+
+          <div class="space-y-2">
+            <Label for="campaign-business_hours">{{ t('widget.campaign.business_hours') }}</Label>
+            <Select
+              :model-value="campaign.business_hours"
+              @update:model-value="update('business_hours', $event)"
+            >
+              <SelectTrigger id="campaign-business_hours"><SelectValue /></SelectTrigger>
+              <SelectContent>
+                <SelectItem
+                  v-for="value in ['any', 'inside', 'outside']"
+                  :key="value"
+                  :value="value"
+                >
+                  {{ t(`widget.campaign.${value}`) }}
+                </SelectItem>
+              </SelectContent>
+            </Select>
+          </div>
+
+          <div v-if="campaign.business_hours !== 'any'" class="space-y-2">
+            <Label for="campaign-hours">{{ t('globals.terms.businessHour', 2) }}</Label>
+            <Select
+              :model-value="String(campaign.business_hours_id)"
+              @update:model-value="update('business_hours_id', Number($event))"
+            >
+              <SelectTrigger id="campaign-hours"><SelectValue /></SelectTrigger>
+              <SelectContent>
+                <SelectItem v-for="item in businessHours" :key="item.id" :value="String(item.id)">
+                  {{ item.name }}
+                </SelectItem>
+              </SelectContent>
+            </Select>
+          </div>
+        </div>
+      </div>
+
+      <!-- Repeat -->
+      <div class="space-y-4">
+        <h4 class="text-base font-semibold text-foreground">
+          {{ t('widget.campaign.section.repeat') }}
+        </h4>
+
+        <div class="grid sm:grid-cols-2 gap-4">
+          <div class="space-y-2">
+            <Label for="campaign-repeat">{{ t('widget.campaign.repeat') }}</Label>
+            <Select :model-value="campaign.repeat" @update:model-value="update('repeat', $event)">
+              <SelectTrigger id="campaign-repeat"><SelectValue /></SelectTrigger>
+              <SelectContent>
+                <SelectItem
+                  v-for="value in ['once', 'session', 'interval']"
+                  :key="value"
+                  :value="value"
+                >
+                  {{ t(`widget.campaign.${value}`) }}
+                </SelectItem>
+              </SelectContent>
+            </Select>
+          </div>
+
+          <div v-if="campaign.repeat === 'interval'" class="space-y-2">
+            <Label for="campaign-repeat_hours">{{ t('widget.campaign.repeat_hours') }}</Label>
+            <Input
+              id="campaign-repeat_hours"
+              type="number"
+              min="1"
+              max="8760"
+              :model-value="campaign.repeat_hours"
+              @update:model-value="update('repeat_hours', Number($event))"
+            />
+          </div>
+        </div>
+      </div>
+
+    </template>
+
+    <AlertDialog
+      :open="!!pendingDelete"
+      @update:open="pendingDelete = $event ? pendingDelete : null"
+    >
+      <AlertDialogContent>
+        <AlertDialogHeader>
+          <AlertDialogTitle>{{ t('globals.messages.areYouAbsolutelySure') }}</AlertDialogTitle>
+          <AlertDialogDescription>{{
+            t('confirm.deleteCampaign')
+          }}</AlertDialogDescription>
+        </AlertDialogHeader>
+        <AlertDialogFooter>
+          <AlertDialogCancel>{{ t('globals.messages.cancel') }}</AlertDialogCancel>
+          <AlertDialogAction variant="destructive" @click="remove">
+            {{ t('globals.messages.delete') }}
+          </AlertDialogAction>
+        </AlertDialogFooter>
+      </AlertDialogContent>
+    </AlertDialog>
+  </div>
+</template>
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue b/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue
new file mode 100644
index 00000000..87fc72ac
--- /dev/null
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue
@@ -0,0 +1,21 @@
+<script setup>
+import { ref, watch, onMounted } from 'vue'
+import RuleBox from '@/features/admin/automation/RuleBox.vue'
+import { useCustomAttributeStore } from '@/stores/customAttributes'
+
+const props = defineProps({ modelValue: { type: Object, default: () => ({ logical_op: 'AND', rules: [] }) } })
+const emit = defineEmits(['update:modelValue'])
+const group = ref({ logical_op: 'AND', rules: [] })
+watch(() => props.modelValue, value => { group.value = value ? JSON.parse(JSON.stringify(value)) : { logical_op: 'AND', rules: [] } }, { immediate: true, deep: true })
+const update = () => emit('update:modelValue', JSON.parse(JSON.stringify(group.value)))
+const add = () => {
+  group.value.rules.push({ field: '', field_type: 'contact_custom_attribute', operator: '', value: '', case_sensitive_match: false })
+  update()
+}
+const remove = (_, index) => { group.value.rules.splice(index, 1); update() }
+onMounted(() => useCustomAttributeStore().fetchCustomAttributes())
+</script>
+
+<template>
+  <RuleBox :rule-group="group" :group-index="0" type="new_conversation" contacts-only @update-group="update" @add-condition="add" @remove-condition="remove" />
+</template>
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
new file mode 100644
index 00000000..2e195dbd
--- /dev/null
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
@@ -0,0 +1,168 @@
+<script setup>
+import { computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { Label } from '@shared-ui/components/ui/label'
+import { Button } from '@shared-ui/components/ui/button'
+import {
+  Select,
+  SelectTrigger,
+  SelectValue,
+  SelectContent,
+  SelectItem
+} from '@shared-ui/components/ui/select'
+import SwitchField from '@shared-ui/components/SwitchField.vue'
+import { GripVertical, X, FileText } from 'lucide-vue-next'
+import Draggable from 'vuedraggable'
+
+const MAX_FEATURED = 10
+const AUDIENCES = ['visitors', 'users']
+
+const props = defineProps({
+  modelValue: { type: Object, required: true },
+  centers: { type: Array, default: () => [] },
+  articles: { type: Array, default: () => [] },
+  failed: { type: Boolean, default: false }
+})
+const emit = defineEmits(['update:modelValue'])
+const { t } = useI18n()
+
+const update = (key, value) => emit('update:modelValue', { ...props.modelValue, [key]: value })
+const updateAudience = (audience, key, value) =>
+  update(audience, { ...props.modelValue[audience], [key]: value })
+
+const selectHelpCenter = (value) =>
+  emit('update:modelValue', {
+    ...props.modelValue,
+    help_center_id: Number(value),
+    featured_ids: []
+  })
+
+const titleOf = (id) => props.articles.find((article) => article.id === id)?.title
+
+const featured = computed({
+  get: () => props.modelValue.featured_ids.map((id) => ({ id, title: titleOf(id) })),
+  set: (items) =>
+    update(
+      'featured_ids',
+      items.map((item) => item.id)
+    )
+})
+
+const unusedArticles = computed(() =>
+  props.articles.filter((article) => !props.modelValue.featured_ids.includes(article.id))
+)
+</script>
+
+<template>
+  <div class="space-y-8">
+    <div class="space-y-2">
+      <Label for="widget-help-center">{{ t('globals.terms.helpCenter') }}</Label>
+      <Select
+        :model-value="String(modelValue.help_center_id || 0)"
+        @update:model-value="selectHelpCenter"
+      >
+        <SelectTrigger id="widget-help-center"><SelectValue /></SelectTrigger>
+        <SelectContent>
+          <SelectItem value="0">{{ t('globals.terms.none') }}</SelectItem>
+          <SelectItem
+            v-for="center in centers"
+            :key="center.id"
+            :value="String(center.id)"
+            :disabled="!center.is_active"
+          >
+            {{ center.name }}
+          </SelectItem>
+        </SelectContent>
+      </Select>
+    </div>
+
+    <template v-if="modelValue.help_center_id">
+      <p v-if="failed" role="alert" class="text-sm text-destructive">
+        {{ t('widget.helpLoadError') }}
+      </p>
+
+      <div class="space-y-4">
+        <h4 class="text-base font-semibold text-foreground">{{ t('widget.helpPlacement') }}</h4>
+        <div class="grid sm:grid-cols-2 gap-4">
+          <div
+            v-for="audience in AUDIENCES"
+            :key="audience"
+            class="space-y-4 border rounded-md p-4"
+          >
+            <p class="text-sm font-medium text-foreground">
+              {{ t(audience === 'visitors' ? 'globals.terms.visitor' : 'globals.terms.users', 2) }}
+            </p>
+            <SwitchField
+              :title="t('widget.showHelpTab')"
+              :checked="modelValue[audience].tab"
+              @update:checked="updateAudience(audience, 'tab', $event)"
+            />
+          </div>
+        </div>
+
+        <p class="text-sm text-muted-foreground">{{ t('widget.helpOnHomeHint') }}</p>
+      </div>
+
+      <div class="space-y-4">
+        <h4 class="text-base font-semibold text-foreground">{{ t('widget.featuredArticles') }}</h4>
+        <p class="text-sm text-muted-foreground">{{ t('widget.featuredArticlesHint') }}</p>
+
+        <Draggable
+          v-model="featured"
+          item-key="id"
+          :animation="200"
+          handle=".drag-handle"
+          class="space-y-2"
+        >
+          <template #item="{ element: item, index }">
+            <div class="flex items-center gap-2 p-2 border rounded-md">
+              <div class="drag-handle cursor-move text-muted-foreground">
+                <GripVertical class="size-4" />
+              </div>
+              <FileText class="size-4 shrink-0 text-muted-foreground" />
+              <span
+                class="flex-1 min-w-0 text-sm break-words"
+                :class="{ 'text-muted-foreground': !item.title }"
+              >
+                {{ item.title || t('widget.articleUnavailable') }}
+              </span>
+              <Button
+                type="button"
+                variant="ghost"
+                size="sm"
+                :aria-label="t('globals.terms.remove')"
+                @click="
+                  update(
+                    'featured_ids',
+                    modelValue.featured_ids.filter((_, i) => i !== index)
+                  )
+                "
+              >
+                <X class="size-4" />
+              </Button>
+            </div>
+          </template>
+        </Draggable>
+
+        <Select
+          :disabled="modelValue.featured_ids.length >= MAX_FEATURED || !unusedArticles.length"
+          model-value=""
+          @update:model-value="update('featured_ids', [...modelValue.featured_ids, Number($event)])"
+        >
+          <SelectTrigger class="max-w-md">
+            <SelectValue :placeholder="t('widget.addArticle')" />
+          </SelectTrigger>
+          <SelectContent>
+            <SelectItem
+              v-for="article in unusedArticles"
+              :key="article.id"
+              :value="String(article.id)"
+            >
+              {{ article.title }} ({{ article.locale }})
+            </SelectItem>
+          </SelectContent>
+        </Select>
+      </div>
+    </template>
+  </div>
+</template>
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
index 07204221..d29cfea4 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
@@ -11,6 +11,36 @@ const rangeNumber = (t, min, max) => {
 }
 const spacingNumber = (t) => rangeNumber(t, 0, 200)
 
+export const defaultWidgetHelp = () => ({
+  help_center_id: 0,
+  visitors: { tab: true },
+  users: { tab: true },
+  featured_ids: []
+})
+export const defaultWidgetPreviews = () => ({ desktop: false, mobile: false, content: 'message', auto_hide_seconds: 0 })
+export const widgetConditionsSchema = z.object({
+  logical_op: z.enum(['AND', 'OR']),
+  rules: z.array(z.object({ field: z.string().min(1), field_type: z.literal('contact_custom_attribute'), operator: z.string().min(1), value: z.string(), case_sensitive_match: z.boolean() })).max(20)
+})
+export const defaultCampaign = () => ({
+  id: crypto.randomUUID(), name: '', enabled: false, message: '', sender_id: 0, team_id: 0,
+  audience: 'all', include_urls: [], exclude_urls: [], conditions: { logical_op: 'AND', rules: [] },
+  event: '', delay_seconds: 10,
+  business_hours_id: 0, business_hours: 'any', desktop: true, mobile: true,
+  repeat: 'once', repeat_hours: 24,
+})
+export const campaignSchema = z.object({
+  id: z.string().uuid(), name: z.string().trim().min(1).max(128), enabled: z.boolean(), message: z.string().trim().min(1).max(10000),
+  sender_id: z.number().int().min(0), team_id: z.number().int().min(0),
+  audience: z.enum(['all', 'visitors', 'users']), include_urls: z.array(z.string().max(2048)).max(20).transform(items => items.map(item => item.trim()).filter(Boolean)),
+  exclude_urls: z.array(z.string().max(2048)).max(20).transform(items => items.map(item => item.trim()).filter(Boolean)), conditions: widgetConditionsSchema,
+  event: z.string().max(128), delay_seconds: z.number().int().min(0).max(86400),
+  business_hours_id: z.number().int().min(0), business_hours: z.enum(['any', 'inside', 'outside']),
+  desktop: z.boolean(), mobile: z.boolean(),
+  repeat: z.enum(['once', 'session', 'interval']), repeat_hours: z.number().int().min(1).max(8760),
+})
+const helpAudience = z.object({ tab: z.boolean() })
+
 export const createFormSchema = (t) => z.object({
   name: z.string().min(1, { message: t('globals.messages.required') }),
   enabled: z.boolean(),
@@ -19,6 +49,14 @@ export const createFormSchema = (t) => z.object({
   secret: z.string().nullable().optional(),
   linked_email_inbox_id: z.number().nullable().optional(),
   config: z.object({
+    campaigns: z.array(campaignSchema).max(50).default([]),
+    campaign_cooldown_hours: z.number().int().min(1).max(8760).default(24),
+    help: z.object({
+      help_center_id: z.number().int().min(0),
+      visitors: helpAudience, users: helpAudience,
+      featured_ids: z.array(z.number().int().positive()).max(10),
+    }).default(defaultWidgetHelp),
+    previews: z.object({ desktop: z.boolean(), mobile: z.boolean(), content: z.enum(['message', 'generic']), auto_hide_seconds: z.number().int().min(0).max(300) }).default(defaultWidgetPreviews),
     brand_name: z.string().min(1, { message: t('globals.messages.required') }),
     website_url: optionalUrl(t),
     dark_mode: z.boolean(),
@@ -75,6 +113,7 @@ export const createFormSchema = (t) => z.object({
     features: z.object({
       file_upload: z.boolean(),
       emoji: z.boolean(),
+      transcript: z.boolean().default(false),
     }),
     continuity: z.object({
       offline_threshold: z.string().min(1, { message: t('globals.messages.required') }).refine(isGoDuration, { message: t('validation.invalidDuration') }),
@@ -86,7 +125,7 @@ export const createFormSchema = (t) => z.object({
     trusted_domains: z.string().optional(),
     blocked_ips: z.string().optional(),
     home_apps: z.array(z.object({
-      type: z.enum(['announcement', 'external_link']),
+      type: z.enum(['announcement', 'external_link', 'help']),
       title: z.string().optional().or(z.literal('')),
       description: z.string().optional().or(z.literal('')),
       image_url: optionalUrl(t),
diff --git a/frontend/apps/main/src/features/admin/inbox/useHelpCenterArticles.js b/frontend/apps/main/src/features/admin/inbox/useHelpCenterArticles.js
new file mode 100644
index 00000000..f25c2e9b
--- /dev/null
+++ b/frontend/apps/main/src/features/admin/inbox/useHelpCenterArticles.js
@@ -0,0 +1,50 @@
+import { ref, watch } from 'vue'
+import api from '@/api'
+
+const publishedTree = (nodes) =>
+  (nodes || [])
+    .filter((node) => node.is_published)
+    .map((node) => {
+      const children = publishedTree(node.children)
+      const articles = (node.articles || [])
+        .filter((article) => article.status === 'published')
+        .map((article) => ({ ...article, collection_id: node.id }))
+      return {
+        ...node,
+        children,
+        articles,
+        article_count:
+          articles.length + children.reduce((total, child) => total + child.article_count, 0)
+      }
+    })
+
+const flatten = (nodes) => nodes.flatMap((node) => [...node.articles, ...flatten(node.children)])
+
+export const useHelpCenterArticles = (helpCenterID) => {
+  const tree = ref([])
+  const articles = ref([])
+  const failed = ref(false)
+  let request = 0
+
+  watch(
+    helpCenterID,
+    async (id) => {
+      const current = ++request
+      tree.value = []
+      articles.value = []
+      failed.value = false
+      if (!id) return
+      try {
+        const response = await api.getHelpCenterTree(id)
+        if (current !== request) return
+        tree.value = publishedTree(response.data.data.tree)
+        articles.value = flatten(tree.value)
+      } catch {
+        if (current === request) failed.value = true
+      }
+    },
+    { immediate: true }
+  )
+
+  return { tree, articles, failed }
+}
diff --git a/frontend/apps/widget/src/App.vue b/frontend/apps/widget/src/App.vue
index 912f5387..f89413fe 100644
--- a/frontend/apps/widget/src/App.vue
+++ b/frontend/apps/widget/src/App.vue
@@ -23,10 +23,18 @@ import { useUnreadCount } from './composables/useUnreadCount.js'
 import { initAudioContext } from '@shared-ui/composables/useNotificationSound.js'
 import { hexToHSL, getContrastingHSL } from '@shared-ui/utils/color.js'
 import MainLayout from '@widget/layouts/MainLayout.vue'
+import { useHelpStore } from '@widget/store/help.js'
+import { useI18n } from 'vue-i18n'
+import { useProactiveStore } from '@widget/store/proactive.js'
+import { useReplyPreviews } from '@widget/composables/useReplyPreviews.js'
 
 const widgetStore = useWidgetStore()
 const chatStore = useChatStore()
 const userStore = useUserStore()
+const help = useHelpStore()
+const proactive = useProactiveStore()
+const { locale } = useI18n()
+useReplyPreviews()
 
 // Register stores for the global 401 response interceptor.
 registerStores({ userStore, chatStore, widgetStore })
@@ -54,8 +62,9 @@ onMounted(() => {
   window.parent.postMessage({ type: 'VUE_APP_READY' }, '*')
 })
 
-const signalWidgetLoaded = () => {
-  window.parent.postMessage({ type: 'WIDGET_LOADED' }, '*')
+const signalWidgetLoaded = async () => {
+  if (widgetStore.config.help?.help_center_id) await help.load(locale.value)
+  window.parent.postMessage({ type: 'WIDGET_LOADED', campaigns: widgetStore.config.has_campaigns }, '*')
 }
 
 const fetchInitialConversations = async () => {
@@ -73,6 +82,11 @@ const fetchInitialConversations = async () => {
 // Listen for messages from parent window (widget.js)
 const setupParentMessageListeners = () => {
   window.addEventListener('message', async (event) => {
+    if (event.source !== window.parent || !event.data || typeof event.data !== 'object') return
+    const parentOrigin = new URLSearchParams(window.location.search).get('parent_origin')
+    if (parentOrigin && event.origin !== parentOrigin) return
+    if (event.data.campaignSessionKey) proactive.setSessionKey(event.data.campaignSessionKey)
+    if (event.data.campaignBrowserKey) proactive.setBrowserKey(event.data.campaignBrowserKey)
     if (event.data.type == 'WIDGET_CLOSED') {
       widgetStore.setOpen(false)
     } else if (event.data.type === 'WIDGET_OPENED') {
@@ -112,6 +126,12 @@ const setupParentMessageListeners = () => {
         initVisitorToken(event.data.visitorToken)
       }
       if (event.data.jwt) {
+        proactive.reset()
+        help.reset()
+        chatStore.drafts = {}
+        chatStore.preChatDraft = {}
+        chatStore.conversations = null
+        chatStore.setCurrentConversation(null)
         try {
           const resp = await api.exchangeJWTForSession(event.data.jwt)
           const { session_token, user } = resp.data.data
@@ -127,9 +147,28 @@ const setupParentMessageListeners = () => {
         }
       }
     } else if (event.data.type === 'CLEAR_SESSION') {
+      proactive.reset()
+      chatStore.drafts = {}
+      chatStore.preChatDraft = {}
       userStore.clearSessionToken()
+      chatStore.conversations = null
+      chatStore.setCurrentConversation(null)
+      help.reset()
+      signalWidgetLoaded()
+    } else if (event.data.type === 'CAMPAIGN_CONTEXT') {
+      await proactive.next(event.data.context)
+    } else if (event.data.type === 'CAMPAIGN_EVENT') {
+      await proactive.event(event.data.event, event.data.id)
     } else if (event.data.type === 'PAGE_VISIT') {
       sendPageVisit(event.data.url, event.data.title)
+    } else if (event.data.type === 'OPEN_CONVERSATION') {
+      if (!chatStore.getConversations.some(conversation => conversation.uuid === event.data.uuid)) return
+      widgetStore.navigateToMessages()
+      if (await chatStore.loadConversation(event.data.uuid, true)) {
+        const seen = new Date(chatStore.currentConversation.contact_last_seen_at)
+        chatStore.previewUnreadUUID = chatStore.getCurrentConversationMessages.find(message => ['agent', 'ai_assistant'].includes(message.author?.type) && new Date(message.created_at) > seen)?.uuid || null
+        widgetStore.navigateToChat()
+      }
     }
   })
 }
diff --git a/frontend/apps/widget/src/api/index.js b/frontend/apps/widget/src/api/index.js
index b82b91d3..f9adc78b 100644
--- a/frontend/apps/widget/src/api/index.js
+++ b/frontend/apps/widget/src/api/index.js
@@ -135,6 +135,11 @@ const getAuthMe = () => http.get('/api/v1/widget/chat/auth/me')
 const initChatConversation = (data) => http.post('/api/v1/widget/chat/conversations/init', data)
 const getChatConversations = () => http.get('/api/v1/widget/chat/conversations')
 const getChatConversation = (uuid) => http.get(`/api/v1/widget/chat/conversations/${uuid}`)
+const downloadTranscript = (uuid) => http.get(`/api/v1/widget/chat/conversations/${uuid}/transcript`, { responseType: 'blob' })
+const getHelp = (locale) => http.get('/api/v1/widget/chat/help', { params: { locale } })
+const searchHelp = (q, locale) => http.get('/api/v1/widget/chat/help/search', { params: { q, locale } })
+const getHelpArticle = (slug, locale) => http.get(`/api/v1/widget/chat/help/articles/${encodeURIComponent(slug)}`, { params: { locale } })
+const sendHelpFeedback = (helpSlug, slug, locale, helpful) => http.post(`/api/v1/public/help-centers/${encodeURIComponent(helpSlug)}/articles/${encodeURIComponent(slug)}/feedback`, { helpful }, { params: { locale } })
 const sendChatMessage = (uuid, data) => http.post(`/api/v1/widget/chat/conversations/${uuid}/message`, data)
 const closeChatConversation = (uuid) => http.post(`/api/v1/widget/chat/conversations/${uuid}/close`)
 const uploadMedia = (conversationUUID, files) => {
@@ -155,7 +160,11 @@ const submitCSATResponse = (csatUuid, rating, feedback) =>
         feedback,
     })
 
+const nextCampaign = data => http.post('/api/v1/widget/chat/campaigns/next', data)
+const campaignEvent = data => http.post('/api/v1/widget/chat/campaigns/event', data)
+
 export default {
+    nextCampaign, campaignEvent,
     getWidgetSettings,
     getLanguage,
     getAvailableLanguages,
@@ -164,6 +173,11 @@ export default {
     initChatConversation,
     getChatConversations,
     getChatConversation,
+    downloadTranscript,
+    getHelp,
+    searchHelp,
+    getHelpArticle,
+    sendHelpFeedback,
     sendChatMessage,
     closeChatConversation,
     uploadMedia,
diff --git a/frontend/apps/widget/src/components/ArticleReader.vue b/frontend/apps/widget/src/components/ArticleReader.vue
new file mode 100644
index 00000000..88e99aea
--- /dev/null
+++ b/frontend/apps/widget/src/components/ArticleReader.vue
@@ -0,0 +1,60 @@
+<script setup>
+import { computed, ref } from 'vue'
+import articleCSS from '@public-static/article-content.css?raw'
+
+const props = defineProps({ article: { type: Object, required: true }, helpSlug: { type: String, required: true }, dark: Boolean })
+const emit = defineEmits(['article'])
+const frame = ref(null)
+const documentHTML = computed(() => {
+  const doc = document.implementation.createHTMLDocument(props.article.title)
+  const policy = doc.createElement('meta')
+  policy.httpEquiv = 'Content-Security-Policy'
+  policy.content = "default-src 'none'; img-src https: http: data:; style-src 'unsafe-inline'; font-src 'none'; frame-src 'none'; form-action 'none'; base-uri 'none'"
+  doc.head.append(policy)
+  const style = doc.createElement('style')
+  style.textContent = `${articleCSS}\nbody{margin:0;padding:16px;font:14px/1.6 system-ui;overflow-wrap:anywhere}img{max-width:100%}a{color:inherit}table{display:block;overflow:auto}.hc-prose pre{background:var(--hc-accent-tint);color:inherit}.hc-callout{background:var(--hc-accent-tint);color:inherit}`
+  doc.head.append(style)
+  doc.body.className = 'hc-prose'
+  doc.body.innerHTML = props.article.content
+  for (const element of doc.querySelectorAll('script,iframe,object,embed,form,base,meta,link,style')) {
+    if (!doc.head.contains(element)) element.remove()
+  }
+  for (const element of doc.body.querySelectorAll('*')) {
+    for (const attr of [...element.attributes]) {
+      if (attr.name.startsWith('on') || attr.name === 'srcdoc') element.removeAttribute(attr.name)
+    }
+    for (const attr of ['href', 'src']) {
+      const value = element.getAttribute(attr)
+      if (!value || value.startsWith('#')) continue
+      let url
+      try { url = new URL(value, window.location.origin) } catch { element.removeAttribute(attr); continue }
+      if (!['https:', 'http:', 'mailto:'].includes(url.protocol)) element.removeAttribute(attr)
+      else element.setAttribute(attr, url.href)
+    }
+  }
+  return '<!doctype html>' + doc.documentElement.outerHTML
+})
+const loaded = () => {
+  const doc = frame.value.contentDocument
+  if (!doc) return
+  const theme = getComputedStyle(frame.value)
+  doc.body.style.color = theme.color
+  doc.body.style.background = theme.backgroundColor
+  for (const [target, source] of Object.entries({ '--hc-border': '--border', '--hc-accent': '--primary', '--hc-accent-ink': '--primary', '--hc-accent-tint': '--muted', '--hc-muted': '--muted-foreground' })) {
+    doc.documentElement.style.setProperty(target, `hsl(${theme.getPropertyValue(source)})`)
+  }
+  doc.addEventListener('click', event => {
+    const link = event.target.closest('a[href]')
+    if (!link || link.getAttribute('href').startsWith('#')) return
+    event.preventDefault()
+    const url = new URL(link.href)
+    const match = url.pathname.match(/^\/hc\/([^/]+)\/([^/]+)\/articles\/([^/]+)$/)
+    if (url.origin === window.location.origin && match?.[1] === props.helpSlug) emit('article', { slug: decodeURIComponent(match[3]), locale: decodeURIComponent(match[2]) })
+    else window.open(url.href, '_blank', 'noopener,noreferrer')
+  })
+}
+</script>
+
+<template>
+  <iframe ref="frame" :key="`${article.id}-${dark}`" :title="article.title" :srcdoc="documentHTML" sandbox="allow-same-origin" class="w-full flex-1 min-h-0 border-0 bg-background text-foreground" @load="loaded" />
+</template>
diff --git a/frontend/apps/widget/src/components/ChatHeader.vue b/frontend/apps/widget/src/components/ChatHeader.vue
index 082226b7..d4be08e1 100644
--- a/frontend/apps/widget/src/components/ChatHeader.vue
+++ b/frontend/apps/widget/src/components/ChatHeader.vue
@@ -1,35 +1,85 @@
 <template>
   <div class="flex items-center p-2 border-b border-border bg-background gap-3 relative">
     <div class="flex items-center gap-2 justify-start">
-      <Button @click="$emit('goBack')" variant="ghost" size="sm" :aria-label="$t('globals.messages.goBack')">
+      <Button
+        type="button"
+        @click="$emit('goBack')"
+        variant="ghost"
+        size="sm"
+        :aria-label="$t('globals.messages.goBack')"
+      >
         <ArrowLeft />
       </Button>
       <ChatTitle />
     </div>
     <div class="flex items-center gap-2 ml-auto">
-      <!-- Expand/Collapse Button - only visible on desktop -->
-      <Button 
-        v-if="!widgetStore.isMobileFullScreen" 
-        @click="widgetStore.toggleExpand" 
-        variant="ghost" 
-        size="sm"
-        :title="widgetStore.isExpanded ? $t('globals.terms.collapse') : $t('globals.terms.expand')"
-        :aria-label="widgetStore.isExpanded ? $t('globals.terms.collapse') : $t('globals.terms.expand')"
-      >
-        <Maximize2 v-if="!widgetStore.isExpanded" class="w-4 h-4" />
-        <Minimize2 v-else class="w-4 h-4" />
-      </Button>
+      <DropdownMenu v-if="!widgetStore.isMobileFullScreen || canDownloadTranscript">
+        <DropdownMenuTrigger as-child>
+          <Button type="button" variant="ghost" size="sm" :aria-label="$t('globals.terms.more')">
+            <Ellipsis class="size-4" />
+          </Button>
+        </DropdownMenuTrigger>
+        <DropdownMenuContent align="end">
+          <DropdownMenuItem
+            v-if="!widgetStore.isMobileFullScreen"
+            @select="widgetStore.toggleExpand"
+          >
+            <Minimize2 v-if="widgetStore.isExpanded" class="mr-2 h-4 w-4" aria-hidden="true" />
+            <Maximize2 v-else class="mr-2 h-4 w-4" aria-hidden="true" />
+            {{ widgetStore.isExpanded ? $t('globals.terms.collapse') : $t('globals.terms.expand') }}
+          </DropdownMenuItem>
+          <DropdownMenuItem
+            v-if="canDownloadTranscript"
+            :disabled="downloading"
+            @select="downloadTranscript"
+          >
+            <Download class="mr-2 h-4 w-4" aria-hidden="true" />
+            {{ $t('conversation.downloadTranscript') }}
+          </DropdownMenuItem>
+        </DropdownMenuContent>
+      </DropdownMenu>
     </div>
   </div>
 </template>
 
 <script setup>
 import { Button } from '@shared-ui/components/ui/button'
-import { ArrowLeft, Maximize2, Minimize2 } from 'lucide-vue-next'
+import { ArrowLeft, Ellipsis, Maximize2, Minimize2, Download } from 'lucide-vue-next'
+import { computed, ref } from 'vue'
+import {
+  DropdownMenu,
+  DropdownMenuTrigger,
+  DropdownMenuContent,
+  DropdownMenuItem
+} from '@shared-ui/components/ui/dropdown-menu'
+import { useChatStore } from '@widget/store/chat.js'
+import api from '@widget/api/index.js'
+import { downloadBlobResponse, parseBlobError } from '@shared-ui/utils/file'
+import { handleHTTPError } from '@shared-ui/utils/http'
 import ChatTitle from './ChatTitle.vue'
 import { useWidgetStore } from '@widget/store/widget.js'
 
 const widgetStore = useWidgetStore()
+const chatStore = useChatStore()
+const downloading = ref(false)
+const canDownloadTranscript = computed(
+  () => widgetStore.config.features?.transcript && !!chatStore.currentConversation?.uuid
+)
 
-defineEmits(['goBack'])
+const emit = defineEmits(['goBack', 'error'])
+const downloadTranscript = async () => {
+  if (downloading.value) return
+  downloading.value = true
+  try {
+    const conversation = chatStore.currentConversation
+    downloadBlobResponse(
+      await api.downloadTranscript(conversation.uuid),
+      `transcript-${conversation.reference_number || conversation.uuid}.txt`
+    )
+  } catch (error) {
+    emit('error', handleHTTPError(await parseBlobError(error)).message)
+  } finally {
+    downloading.value = false
+  }
+}
 </script>
diff --git a/frontend/apps/widget/src/components/ChatMessages.vue b/frontend/apps/widget/src/components/ChatMessages.vue
index c56b2512..f2687173 100644
--- a/frontend/apps/widget/src/components/ChatMessages.vue
+++ b/frontend/apps/widget/src/components/ChatMessages.vue
@@ -24,6 +24,7 @@
         <div
           v-for="message in chatStore.getCurrentConversationMessages"
           :key="message.uuid"
+          :data-message-uuid="message.uuid"
           :class="[
             'flex flex-col',
             message.author.type === 'contact' || message.author.type === 'visitor'
@@ -154,8 +155,8 @@
 <script setup>
 import { ref, computed, nextTick, watch } from 'vue'
 import { useDocumentVisibility, useDebounceFn } from '@vueuse/core'
-import { useWidgetStore } from '../store/widget.js'
-import { useChatStore } from '../store/chat.js'
+import { useWidgetStore } from '@widget/store/widget.js'
+import { useChatStore } from '@widget/store/chat.js'
 import { useRelativeTime } from '@widget/composables/useRelativeTime.js'
 import { useI18n } from 'vue-i18n'
 import { Letter } from 'vue-letter'
@@ -188,7 +189,7 @@ const currentConversationUUID = ref('')
 const quotedTextState = ref({})
 const { t } = useI18n()
 
-const { hasUserScrolled, scrollToBottom, handleScroll } = useStickyScroll(messagesContainer, contentEl, {
+const { hasUserScrolled, scrollToBottom, scrollToOffset, handleScroll } = useStickyScroll(messagesContainer, contentEl, {
   onArriveBottom: () => { unreadMessages.value = 0 }
 })
 
@@ -262,7 +263,15 @@ watch(
     currentConversationUUID.value = newUUID
     unreadMessages.value = 0
     hasUserScrolled.value = false
-    nextTick(scrollToBottom)
+    nextTick(() => {
+      const id = chatStore.previewUnreadUUID
+      const target = id && contentEl.value?.querySelector(`[data-message-uuid="${id}"]`)
+      if (target) {
+        hasUserScrolled.value = true
+        scrollToOffset(target.getBoundingClientRect().top - messagesContainer.value.getBoundingClientRect().top + messagesContainer.value.scrollTop)
+        chatStore.previewUnreadUUID = null
+      } else scrollToBottom()
+    })
     if (widgetStore.isOpen && !chatStore.isLoadingConversation) {
       chatStore.updateCurrentConversationLastSeen()
     }
diff --git a/frontend/apps/widget/src/components/HomeHelp.vue b/frontend/apps/widget/src/components/HomeHelp.vue
new file mode 100644
index 00000000..cdb48520
--- /dev/null
+++ b/frontend/apps/widget/src/components/HomeHelp.vue
@@ -0,0 +1,22 @@
+<script setup>
+import { useHelpStore } from '@widget/store/help.js'
+import { useWidgetStore } from '@widget/store/widget.js'
+import { Button } from '@shared-ui/components/ui/button'
+import { Search, FileText } from 'lucide-vue-next'
+const help = useHelpStore()
+const widget = useWidgetStore()
+const open = (article) => {
+  help.article = null
+  help.query = ''
+  help.results = null
+  help.pendingArticle = article || null
+  widget.navigateToHelp()
+}
+</script>
+
+<template>
+  <section class="border rounded-lg p-3 space-y-2 bg-card">
+    <Button type="button" variant="outline" class="w-full justify-start" @click="open()"><Search class="size-4" />{{ $t('widget.searchArticles') }}</Button>
+    <Button v-for="article in help.featured" :key="article.id" type="button" variant="ghost" class="w-full h-auto justify-start text-left whitespace-normal" @click="open(article)"><FileText class="size-4 shrink-0" />{{ article.title }}</Button>
+  </section>
+</template>
diff --git a/frontend/apps/widget/src/components/MessageInput.vue b/frontend/apps/widget/src/components/MessageInput.vue
index a7c32198..d0539422 100644
--- a/frontend/apps/widget/src/components/MessageInput.vue
+++ b/frontend/apps/widget/src/components/MessageInput.vue
@@ -10,6 +10,7 @@
             v-model="newMessage"
             @keydown="handleKeydown"
             @input="handleTyping"
+            :aria-label="$t('globals.terms.typeMessage')"
             :placeholder="$t('globals.terms.typeMessage')"
             :disabled="isSending"
             maxlength="10000"
@@ -52,21 +53,24 @@ import { ref, computed, nextTick, watch, onMounted } from 'vue'
 import { ArrowUp } from 'lucide-vue-next'
 import { Button } from '@shared-ui/components/ui/button'
 import { Textarea } from '@shared-ui/components/ui/textarea'
-import { useWidgetStore } from '../store/widget.js'
-import { useChatStore } from '../store/chat.js'
+import { useWidgetStore } from '@widget/store/widget.js'
+import { useChatStore } from '@widget/store/chat.js'
 import { useUserStore } from '@widget/store/user.js'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
-import { sendWidgetTyping } from '../websocket.js'
+import { sendWidgetTyping } from '@widget/websocket.js'
 import { useTypingIndicator } from '@shared-ui/composables/useTypingIndicator.js'
 import MessageInputActions from './MessageInputActions.vue'
 import api, { saveSession } from '@widget/api/index.js'
 
+import { useProactiveStore } from '@widget/store/proactive.js'
+const proactive = useProactiveStore()
 const emit = defineEmits(['error'])
 const widgetStore = useWidgetStore()
 const chatStore = useChatStore()
 const userStore = useUserStore()
 const messageInput = ref(null)
-const newMessage = ref('')
+const draftKey = computed(() => chatStore.currentConversation?.uuid || proactive.pending?.id || 'new')
+const newMessage = computed({ get: () => chatStore.drafts[draftKey.value] || '', set: value => { chatStore.drafts[draftKey.value] = value } })
 const isUploading = ref(false)
 const isSending = ref(false)
 const config = computed(() => widgetStore.config)
@@ -90,7 +94,7 @@ const { startTyping, stopTyping } = useTypingIndicator((isTyping) => {
 })
 
 const initChatConversation = async (messageText) => {
-  const resp = await api.initChatConversation({ message: messageText })
+  const resp = await api.initChatConversation({ message: messageText, ...proactive.replyPayload() })
   const { conversation, session_token, user, messages, business_hours_id, working_hours_utc_offset } = resp.data.data
   conversation.business_hours_id = business_hours_id
   conversation.working_hours_utc_offset = working_hours_utc_offset
@@ -105,6 +109,7 @@ const initChatConversation = async (messageText) => {
   // Update chat store with new conversation and messages.
   chatStore.setCurrentConversation(conversation)
   chatStore.replaceMessages(messages)
+  proactive.replied()
 }
 
 const sendMessageToConversation = async (messageText, tempMessageID) => {
@@ -164,6 +169,7 @@ const sendMessage = async () => {
       chatStore.removeMessage(chatStore.currentConversation.uuid, tempMessageID)
     }
 
+    newMessage.value = messageText
     emit('error', handleHTTPError(error).message)
   } finally {
     isSending.value = false
diff --git a/frontend/apps/widget/src/components/PreChatForm.vue b/frontend/apps/widget/src/components/PreChatForm.vue
index 9933353d..ccd47c9e 100644
--- a/frontend/apps/widget/src/components/PreChatForm.vue
+++ b/frontend/apps/widget/src/components/PreChatForm.vue
@@ -232,7 +232,8 @@ import {
 } from '@shared-ui/components/ui/form'
 import PhoneNumberInput from '@shared-ui/components/PhoneNumberInput.vue'
 import { countryCodeKey, defaultCountryCode } from '@shared-ui/utils/phone.js'
-import { useWidgetStore } from '../store/widget.js'
+import { useWidgetStore } from '@widget/store/widget.js'
+import { useChatStore } from '@widget/store/chat.js'
 import { useI18n } from 'vue-i18n'
 import { createPreChatFormSchema } from './preChatFormSchema.js'
 
@@ -250,7 +251,8 @@ const props = defineProps({
 const emit = defineEmits(['submit'])
 const { t } = useI18n()
 const widgetStore = useWidgetStore()
-const messageText = ref('')
+const chat = useChatStore()
+const messageText = computed({ get: () => chat.preChatDraft.message || '', set: value => { chat.preChatDraft.message = value } })
 const formRef = ref(null)
 
 const config = computed(() => widgetStore.config?.prechat_form || {})
@@ -276,6 +278,7 @@ const showForm = computed(() => preChatFormEnabled.value && sortedFields.value.l
 const formSchema = computed(() => toTypedSchema(createPreChatFormSchema(t, sortedFields.value)))
 
 // Generate initial values dynamically
+const savedFields = { ...chat.preChatDraft.fields }
 const initialValues = computed(() => {
   const values = {}
   sortedFields.value.forEach((field) => {
@@ -288,7 +291,7 @@ const initialValues = computed(() => {
       values[field.key] = ''
     }
   })
-  return values
+  return { ...values, ...savedFields }
 })
 
 const { handleSubmit, meta, values } = useForm({
@@ -296,6 +299,8 @@ const { handleSubmit, meta, values } = useForm({
   initialValues
 })
 
+watch(values, fields => { chat.preChatDraft.fields = { ...fields } }, { deep: true })
+
 const requiredFieldsFilled = computed(() => {
   return sortedFields.value
     .filter((field) => field.required && field.type !== 'checkbox')
diff --git a/frontend/apps/widget/src/composables/useReplyPreviews.js b/frontend/apps/widget/src/composables/useReplyPreviews.js
new file mode 100644
index 00000000..df93de4e
--- /dev/null
+++ b/frontend/apps/widget/src/composables/useReplyPreviews.js
@@ -0,0 +1,39 @@
+import { watch, nextTick } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { useWidgetStore } from '@widget/store/widget.js'
+import { useChatStore } from '@widget/store/chat.js'
+import { useUserStore } from '@widget/store/user.js'
+
+const parentOrigin = () => new URLSearchParams(window.location.search).get('parent_origin')
+
+export function useReplyPreviews() {
+  const widget = useWidgetStore()
+  const chat = useChatStore()
+  const user = useUserStore()
+  const { t } = useI18n()
+  watch(() => [chat.getConversations, user.userID, widget.config.previews, widget.config.dark_mode, widget.isOpen], async () => {
+    await nextTick()
+    const element = document.querySelector('.libredesk-widget-app')
+    if (!element) return
+    const style = getComputedStyle(element)
+    const previews = chat.getConversations.filter(conversation => conversation.unread_message_count > 0 && conversation.last_message?.author?.type === 'agent').map(conversation => {
+      const message = conversation.last_message
+      const author = message.author || {}
+      const parsed = new DOMParser().parseFromString(message.content || '', 'text/html')
+      return {
+        conversation: conversation.uuid,
+        key: `${conversation.uuid}:${message.created_at}`,
+        name: [author.first_name, author.last_name].filter(Boolean).join(' ') || widget.config.brand_name,
+        avatar: author.avatar_url || '',
+        text: widget.config.previews?.content === 'generic' ? t('widget.newReply') : parsed.body.textContent.trim().slice(0, 240) || t('globals.terms.attachment'),
+        image: widget.config.previews?.content === 'generic' ? '' : message.attachments?.find(attachment => attachment.content_type?.startsWith('image/'))?.thumbnail_url || '',
+      }
+    })
+    const target = parentOrigin()
+    if (!target) return
+    window.parent.postMessage({ type: 'REPLY_PREVIEWS', identity: String(user.userID || 'visitor'), previews, config: { ...widget.config.previews },
+      labels: { dismiss: t('globals.terms.dismiss'), dismissAll: t('widget.dismissPreviews'), open: t('widget.openConversation') },
+      theme: { background: style.backgroundColor, foreground: style.color, border: `hsl(${style.getPropertyValue('--border')})` },
+    }, target)
+  }, { deep: true, immediate: true })
+}
diff --git a/frontend/apps/widget/src/layouts/MainLayout.vue b/frontend/apps/widget/src/layouts/MainLayout.vue
index 48a6dbcf..ef482a71 100644
--- a/frontend/apps/widget/src/layouts/MainLayout.vue
+++ b/frontend/apps/widget/src/layouts/MainLayout.vue
@@ -12,8 +12,9 @@
           <ConversationsView v-if="!widgetStore.isChatView" />
           <ChatView v-else />
         </TabsContent>
+        <TabsContent value="help" class="h-full mt-0"><HelpView /></TabsContent>
       </div>
-      <TabsList v-if="!widgetStore.isChatView" class="grid grid-cols-2 h-auto bg-background border-t rounded-none p-0">
+      <TabsList v-if="!widgetStore.isChatView" class="flex h-auto bg-background border-t rounded-none p-0">
         <TabsTrigger value="home" class="nav-tab">
           <House class="w-5 h-5" />
           <span class="text-xs font-medium">{{ $t('globals.terms.home') }}</span>
@@ -22,6 +23,10 @@
           <MessagesSquare class="w-5 h-5" />
           <span class="text-xs font-medium">{{ $t('globals.terms.message', 2) }}</span>
         </TabsTrigger>
+        <TabsTrigger v-if="help.available && help.data.audience.tab" value="help" class="nav-tab">
+          <CircleQuestionMark class="w-5 h-5" />
+          <span class="text-xs font-medium">{{ $t('globals.terms.help') }}</span>
+        </TabsTrigger>
       </TabsList>
       <div
         v-if="widgetStore.config?.show_powered_by !== false && widgetStore.isChatView"
@@ -46,7 +51,9 @@
 <script setup>
 import { Tabs, TabsList, TabsTrigger, TabsContent } from '@shared-ui/components/ui/tabs'
 import HomeView from '@widget/views/HomeView.vue'
-import { House, MessagesSquare } from 'lucide-vue-next'
+import { House, MessagesSquare, CircleQuestionMark } from 'lucide-vue-next'
+import HelpView from '@widget/views/HelpView.vue'
+import { useHelpStore } from '@widget/store/help.js'
 import ChatView from '@widget/views/ChatView.vue'
 import ConversationsView from '@widget/views/ConversationsView.vue'
 import ConnectionBanner from '@widget/components/ConnectionBanner.vue'
@@ -54,12 +61,15 @@ import CloseWidgetButton from '@widget/components/CloseWidgetButton.vue'
 import { useWidgetStore } from '@widget/store/widget.js'
 
 const widgetStore = useWidgetStore()
+const help = useHelpStore()
 
 const handleTabChange = (value) => {
   if (value === 'home') {
     widgetStore.navigateToHome()
   } else if (value === 'messages') {
     widgetStore.navigateToMessages()
+  } else if (value === 'help') {
+    widgetStore.navigateToHelp()
   }
 }
 </script>
diff --git a/frontend/apps/widget/src/store/chat.js b/frontend/apps/widget/src/store/chat.js
index 6cb0fb0e..4aacf2e1 100644
--- a/frontend/apps/widget/src/store/chat.js
+++ b/frontend/apps/widget/src/store/chat.js
@@ -1,6 +1,6 @@
 import { defineStore } from 'pinia'
 import { ref, computed, reactive } from 'vue'
-import api from '../api/index.js'
+import api from '@widget/api/index.js'
 import { deepMerge } from '@shared-ui/utils/object.js'
 import { TYPING_RECEIVE_TIMEOUT } from '@shared-ui/composables/useTypingIndicator.js'
 import MessageCache from '@main/utils/conversation-message-cache.js'
@@ -8,6 +8,9 @@ import { useUserStore } from './user.js'
 
 export const useChatStore = defineStore('chat', () => {
     const userStore = useUserStore()
+    const previewUnreadUUID = ref(null)
+    const drafts = ref({})
+    const preChatDraft = ref({})
     // State
     let typingTimeout = null
     const isTyping = ref(false)
@@ -45,6 +48,7 @@ export const useChatStore = defineStore('chat', () => {
 
         // Update last_message in the conversation
         conv.last_message = {
+            attachments: message.attachments || [],
             content: message.text_content !== '' ? message.text_content : message.content,
             created_at: message.created_at,
             status: message.status,
@@ -121,7 +125,9 @@ export const useChatStore = defineStore('chat', () => {
 
         try {
             if (!silent) isLoadingConversation.value = true
+            const token = userStore.userSessionToken
             const resp = await api.getChatConversation(conversationUUID)
+            if (token !== userStore.userSessionToken) return false
             const conversation = resp.data.data.conversation
             conversation.business_hours_id = resp.data.data.business_hours_id
             conversation.working_hours_utc_offset = resp.data.data.working_hours_utc_offset
@@ -206,7 +212,9 @@ export const useChatStore = defineStore('chat', () => {
 
         try {
             if (!silent) isLoadingConversations.value = true
+            const token = userStore.userSessionToken
             const response = await api.getChatConversations()
+            if (token !== userStore.userSessionToken) return false
             conversations.value = response.data.data || []
             return true
         } catch {
@@ -260,6 +268,7 @@ export const useChatStore = defineStore('chat', () => {
     }
 
     return {
+        drafts, preChatDraft, previewUnreadUUID,
         // State
         messageCache,
         isTyping,
diff --git a/frontend/apps/widget/src/store/help.js b/frontend/apps/widget/src/store/help.js
new file mode 100644
index 00000000..d86797bd
--- /dev/null
+++ b/frontend/apps/widget/src/store/help.js
@@ -0,0 +1,99 @@
+import { defineStore } from 'pinia'
+import { ref, computed } from 'vue'
+import api from '@widget/api/index.js'
+
+export const useHelpStore = defineStore('help', () => {
+  const data = ref(null)
+  const loading = ref(false)
+  const failed = ref(false)
+  const query = ref('')
+  const results = ref(null)
+  const collectionPath = ref([])
+  const navigationHistory = ref([])
+  const article = ref(null)
+  const feedback = ref({})
+  const feedbackPending = ref({})
+  const scrollTop = ref(0)
+  const pendingArticle = ref(null)
+  const identity = ref(0)
+  let generation = 0
+  const articles = computed(() => {
+    const collect = (nodes) =>
+      (nodes || []).flatMap((node) => [...(node.articles || []), ...collect(node.children)])
+    return collect(data.value?.tree)
+  })
+  const available = computed(() => !!data.value && articles.value.length > 0)
+  const featured = computed(() =>
+    data.value?.featured_ids?.length
+      ? data.value.featured_ids
+          .map((id) => articles.value.find((article) => article.id === id))
+          .filter(Boolean)
+      : data.value?.popular || []
+  )
+  const reset = () => {
+    generation++
+    identity.value++
+    loading.value = false
+    scrollTop.value = 0
+    pendingArticle.value = null
+    data.value = null
+    failed.value = false
+    query.value = ''
+    results.value = null
+    article.value = null
+    feedback.value = {}
+    feedbackPending.value = {}
+    collectionPath.value = []
+    navigationHistory.value = []
+  }
+  const vote = async (helpful) => {
+    const target = article.value
+    if (!target || feedback.value[target.id] !== undefined || feedbackPending.value[target.id])
+      return
+    const currentIdentity = identity.value
+    feedbackPending.value[target.id] = true
+    try {
+      await api.sendHelpFeedback(data.value.slug, target.slug, target.locale, helpful)
+      if (identity.value === currentIdentity) feedback.value[target.id] = helpful
+    } finally {
+      if (identity.value === currentIdentity) delete feedbackPending.value[target.id]
+    }
+  }
+  const load = async (locale) => {
+    const request = ++generation
+    loading.value = true
+    failed.value = false
+    try {
+      const response = await api.getHelp(locale)
+      if (request === generation) data.value = response.data.data
+    } catch {
+      if (request === generation) {
+        data.value = null
+        failed.value = true
+      }
+    } finally {
+      if (request === generation) loading.value = false
+    }
+  }
+  return {
+    feedback,
+    feedbackPending,
+    vote,
+    navigationHistory,
+    pendingArticle,
+    identity,
+    data,
+    loading,
+    failed,
+    query,
+    results,
+    collectionPath,
+    article,
+    scrollTop,
+    articles,
+    available,
+    featured,
+    load,
+    reset
+  }
+})
diff --git a/frontend/apps/widget/src/store/help.test.js b/frontend/apps/widget/src/store/help.test.js
new file mode 100644
index 00000000..ed8e9177
--- /dev/null
+++ b/frontend/apps/widget/src/store/help.test.js
@@ -0,0 +1,77 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+import { createPinia, setActivePinia } from 'pinia'
+import api from '@widget/api/index.js'
+import { useHelpStore } from './help.js'
+
+vi.mock('@widget/api/index.js', () => ({ default: { sendHelpFeedback: vi.fn() } }))
+
+beforeEach(() => {
+  setActivePinia(createPinia())
+  vi.resetAllMocks()
+})
+
+const setup = () => {
+  const help = useHelpStore()
+  help.data = { slug: 'support' }
+  help.article = { id: 1, slug: 'first', locale: 'en-US' }
+  return help
+}
+
+describe('article feedback', () => {
+  it.each([true, false])('retains a %s vote when returning to an article', async (helpful) => {
+    const help = setup()
+    await help.vote(helpful)
+    help.article = { id: 2, slug: 'second', locale: 'en-US' }
+    expect(help.feedback[2]).toBeUndefined()
+    help.article = { id: 1, slug: 'first', locale: 'en-US' }
+    expect(useHelpStore().feedback[1]).toBe(helpful)
+    await help.vote(!helpful)
+    expect(api.sendHelpFeedback).toHaveBeenCalledTimes(1)
+  })
+
+  it('records a pending vote against its original article and prevents duplicate submission', async () => {
+    let complete
+    api.sendHelpFeedback.mockImplementation(
+      () =>
+        new Promise((resolve) => {
+          complete = resolve
+        })
+    )
+    const help = setup()
+    const pending = help.vote(true)
+    await help.vote(false)
+    help.article = { id: 2, slug: 'second', locale: 'en-US' }
+    complete()
+    await pending
+    expect(help.feedback).toEqual({ 1: true })
+    expect(help.feedbackPending).toEqual({})
+    expect(api.sendHelpFeedback).toHaveBeenCalledTimes(1)
+  })
+
+  it('discards a pending vote after the widget identity resets', async () => {
+    let complete
+    api.sendHelpFeedback.mockImplementation(
+      () =>
+        new Promise((resolve) => {
+          complete = resolve
+        })
+    )
+    const help = setup()
+    const pending = help.vote(true)
+    help.reset()
+    complete()
+    await pending
+    expect(help.feedback).toEqual({})
+    expect(help.feedbackPending).toEqual({})
+  })
+
+  it('allows retry after a failed request', async () => {
+    api.sendHelpFeedback.mockRejectedValueOnce(new Error('offline')).mockResolvedValueOnce({})
+    const help = setup()
+    await expect(help.vote(false)).rejects.toThrow('offline')
+    expect(help.feedback).toEqual({})
+    expect(help.feedbackPending).toEqual({})
+    await help.vote(false)
+    expect(help.feedback[1]).toBe(false)
+  })
+})
diff --git a/frontend/apps/widget/src/store/proactive.js b/frontend/apps/widget/src/store/proactive.js
new file mode 100644
index 00000000..9f9e7760
--- /dev/null
+++ b/frontend/apps/widget/src/store/proactive.js
@@ -0,0 +1,66 @@
+import { defineStore } from 'pinia'
+import { ref } from 'vue'
+import api from '@widget/api/index.js'
+import { useWidgetStore } from '@widget/store/widget.js'
+import { useChatStore } from '@widget/store/chat.js'
+
+const parentOrigin = () => new URLSearchParams(window.location.search).get('parent_origin')
+const postToParent = message => {
+  const target = parentOrigin()
+  if (target) window.parent.postMessage(message, target)
+}
+
+export const useProactiveStore = defineStore('proactive', () => {
+  const invitation = ref(null)
+  const pending = ref(null)
+  const widget = useWidgetStore()
+  const chat = useChatStore()
+  let browserKey = ''
+  let sessionKey = ''
+  const setSessionKey = key => { if (typeof key === 'string' && key.length === 36) sessionKey = key }
+  const setBrowserKey = key => { if (typeof key === 'string' && key.length === 36) browserKey = key }
+  let busy = false
+  let generation = 0
+  const reset = () => {
+    generation++
+    invitation.value = null
+    pending.value = null
+    busy = false
+    postToParent({ type: 'CLEAR_CAMPAIGN' })
+  }
+  // The user opened the invitation and then left the chat view without answering it.
+  const abandon = () => {
+    pending.value = null
+  }
+  const next = async (context) => {
+    if (!browserKey || busy || invitation.value || pending.value || !widget.config.has_campaigns || widget.isOpen || chat.getConversations.some(item => item.unread_message_count > 0)) return
+    busy = true
+    const request = generation
+    try {
+      const response = await api.nextCampaign({ ...context, browser_key: browserKey, session_key: sessionKey })
+      if (request !== generation || !response.data.data || widget.isOpen) return
+      const delivery = response.data.data
+      invitation.value = delivery
+      postToParent({ type: 'SHOW_CAMPAIGN', delivery })
+    } catch { return false }
+    finally { if (request === generation) busy = false }
+  }
+  const event = async (name, id) => {
+    if (!invitation.value || invitation.value.id !== id) return
+    const delivery = invitation.value
+    if (name === 'opened') {
+      pending.value = delivery
+      invitation.value = null
+      chat.setCurrentConversation(null)
+      widget.navigateToChat()
+    } else if (name === 'dismissed') invitation.value = null
+    else if (name === 'dropped') {
+      invitation.value = null
+      return
+    }
+    try { await api.campaignEvent({ delivery_id: id, browser_key: browserKey, event: name }) } catch { return false }
+  }
+  const replyPayload = () => pending.value ? { delivery_id: pending.value.id, browser_key: browserKey } : {}
+  const replied = () => { pending.value = null; invitation.value = null; postToParent({ type: 'CLEAR_CAMPAIGN' }) }
+  return { setSessionKey, setBrowserKey, invitation, pending, next, event, reset, abandon, replyPayload, replied }
+})
diff --git a/frontend/apps/widget/src/store/widget.js b/frontend/apps/widget/src/store/widget.js
index 1a4603aa..ea6fbe87 100644
--- a/frontend/apps/widget/src/store/widget.js
+++ b/frontend/apps/widget/src/store/widget.js
@@ -74,6 +74,12 @@ export const useWidgetStore = defineStore('widget', () => {
         }
     }
 
+    const navigateToHelp = () => {
+        currentView.value = 'help'
+        isInChatView.value = false
+        if (isExpanded.value) collapseWidget()
+    }
+
     const updateConfig = (newConfig) => {
         config.value = { ...newConfig }
     }
@@ -142,6 +148,7 @@ export const useWidgetStore = defineStore('widget', () => {
         navigateToChat,
         navigateToMessages,
         navigateToHome,
+        navigateToHelp,
         updateConfig,
         setMobileFullScreen,
         toggleExpand,
diff --git a/frontend/apps/widget/src/views/ChatView.vue b/frontend/apps/widget/src/views/ChatView.vue
index 6ed0950e..a8aecf95 100644
--- a/frontend/apps/widget/src/views/ChatView.vue
+++ b/frontend/apps/widget/src/views/ChatView.vue
@@ -1,7 +1,12 @@
 <template>
   <div class="flex flex-col h-full">
     <!-- Chat header -->
-    <ChatHeader @goBack="goBack" />
+    <ChatHeader @goBack="goBack" @error="handleError" />
+
+    <section v-if="proactive.pending && !chatStore.currentConversation.uuid" class="mx-4 mt-3 border rounded-lg p-3 bg-muted text-sm">
+      <p class="font-medium">{{ proactive.pending.snapshot.sender }}</p>
+      <p class="whitespace-pre-wrap">{{ proactive.pending.snapshot.message }}</p>
+    </section>
 
     <!-- Pre-chat form -->
     <PreChatForm
@@ -30,9 +35,9 @@
 
 <script setup>
 import { ref, computed } from 'vue'
-import { useWidgetStore } from '../store/widget.js'
-import { useUserStore } from '../store/user.js'
-import { useChatStore } from '../store/chat.js'
+import { useWidgetStore } from '@widget/store/widget.js'
+import { useUserStore } from '@widget/store/user.js'
+import { useChatStore } from '@widget/store/chat.js'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
 import api, { saveSession } from '@widget/api/index.js'
 import WidgetError from '@widget/components/WidgetError.vue'
@@ -41,6 +46,8 @@ import ChatMessages from '@widget/components/ChatMessages.vue'
 import MessageInput from '@widget/components/MessageInput.vue'
 import PreChatForm from '@widget/components/PreChatForm.vue'
 
+import { useProactiveStore } from '@widget/store/proactive.js'
+const proactive = useProactiveStore()
 const widgetStore = useWidgetStore()
 const userStore = useUserStore()
 const chatStore = useChatStore()
@@ -79,6 +86,7 @@ const isConversationClosed = computed(() => {
 })
 
 const goBack = () => {
+  if (!chatStore.currentConversation?.uuid) proactive.abandon()
   widgetStore.navigateToMessages()
 }
 
@@ -104,7 +112,8 @@ const handlePreChatFormSubmit = async ({ formData, message }) => {
 
   try {
     const payload = {
-      message: message
+      message: message,
+      ...proactive.replyPayload()
     }
 
     if (Object.keys(formData).length > 0) {
@@ -125,6 +134,8 @@ const handlePreChatFormSubmit = async ({ formData, message }) => {
     chatStore.replaceMessages(messages)
 
     preChatFormSubmitted.value = true
+    chatStore.preChatDraft = {}
+    proactive.replied()
   } catch (error) {
     errorMessage.value = handleHTTPError(error).message
   } finally {
diff --git a/frontend/apps/widget/src/views/ConversationsView.vue b/frontend/apps/widget/src/views/ConversationsView.vue
index 2cacde4f..300241b1 100644
--- a/frontend/apps/widget/src/views/ConversationsView.vue
+++ b/frontend/apps/widget/src/views/ConversationsView.vue
@@ -29,11 +29,11 @@
 import { computed } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { Button } from '@shared-ui/components/ui/button'
-import { useChatStore } from '../store/chat.js'
-import { useWidgetStore } from '../store/widget.js'
+import { useChatStore } from '@widget/store/chat.js'
+import { useWidgetStore } from '@widget/store/widget.js'
 import { useUserStore } from '@widget/store/user.js'
-import ConversationsList from '../components/ConversationsList.vue'
-import WidgetHeader from '../layouts/WidgetHeader.vue'
+import ConversationsList from '@widget/components/ConversationsList.vue'
+import WidgetHeader from '@widget/layouts/WidgetHeader.vue'
 
 const { t } = useI18n()
 const chatStore = useChatStore()
diff --git a/frontend/apps/widget/src/views/HelpView.vue b/frontend/apps/widget/src/views/HelpView.vue
new file mode 100644
index 00000000..ad57437f
--- /dev/null
+++ b/frontend/apps/widget/src/views/HelpView.vue
@@ -0,0 +1,222 @@
+<script setup>
+import { computed, ref, nextTick, onMounted, onUnmounted } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { ArrowLeft, Search } from 'lucide-vue-next'
+import { Button } from '@shared-ui/components/ui/button'
+import { Input } from '@shared-ui/components/ui/input'
+import { useHelpStore } from '@widget/store/help.js'
+import { useWidgetStore } from '@widget/store/widget.js'
+import HelpCollectionList from '@shared-ui/components/HelpCollectionList.vue'
+import ArticleReader from '@widget/components/ArticleReader.vue'
+import api from '@widget/api/index.js'
+
+const help = useHelpStore()
+const widget = useWidgetStore()
+const { t, locale } = useI18n()
+let mounted = true
+onUnmounted(() => {
+  mounted = false
+})
+// Captured before each request so a login or logout mid-request discards only that response.
+const valid = (identity) => mounted && identity === help.identity
+const busy = ref(false)
+const error = ref('')
+const feedback = computed(() => help.feedback[help.article?.id] ?? null)
+const feedbackPending = computed(() => !!help.feedbackPending[help.article?.id])
+const scroller = ref(null)
+const backButton = ref(null)
+const articleHistory = ref([])
+const originArticleID = ref(null)
+const currentCollection = computed(() => help.collectionPath.at(-1))
+const collections = computed(() => currentCollection.value?.children || help.data?.tree || [])
+const items = computed(() => help.results ?? currentCollection.value?.articles ?? [])
+const retry = () => {
+  error.value = ''
+  help.load(locale.value)
+}
+const search = async () => {
+  if (busy.value) return
+  if (!help.query.trim()) {
+    help.results = null
+    return
+  }
+  busy.value = true
+  error.value = ''
+  const identity = help.identity
+  try {
+    const response = await api.searchHelp(help.query.trim(), help.data.locale)
+    if (!valid(identity)) return
+    help.results = response.data.data || []
+  } catch {
+    if (valid(identity)) {
+      error.value = t('widget.helpLoadError')
+      help.failed = true
+    }
+  } finally {
+    busy.value = false
+  }
+}
+const openArticle = async ({ id, slug, locale: articleLocale }) => {
+  if (busy.value) return
+  busy.value = true
+  error.value = ''
+  const identity = help.identity
+  try {
+    const response = await api.getHelpArticle(slug, articleLocale || help.data.locale)
+    if (!valid(identity)) return
+    if (help.article) articleHistory.value.push(help.article)
+    else {
+      help.scrollTop = scroller.value?.scrollTop || 0
+      originArticleID.value = id
+    }
+    help.article = response.data.data
+    await nextTick()
+    backButton.value?.$el?.focus()
+  } catch {
+    if (valid(identity)) error.value = t('widget.helpLoadError')
+  } finally {
+    busy.value = false
+  }
+}
+const openCollection = async (collection) => {
+  help.navigationHistory.push({ top: help.scrollTop, id: collection.id })
+  help.collectionPath.push(collection)
+  help.scrollTop = 0
+  await nextTick()
+  if (scroller.value) scroller.value.scrollTop = 0
+  backButton.value?.$el?.focus()
+}
+const back = async () => {
+  let selector
+  if (help.article) {
+    help.article = articleHistory.value.pop() || null
+    if (!help.article) selector = `[data-help-article="${originArticleID.value}"]`
+  } else if (help.results !== null) {
+    help.results = null
+  } else {
+    help.collectionPath.pop()
+    const previous = help.navigationHistory.pop()
+    help.scrollTop = previous?.top || 0
+    selector = `[data-help-collection="${previous?.id}"]`
+  }
+  await nextTick()
+  if (scroller.value) {
+    scroller.value.scrollTop = help.scrollTop
+    if (selector) scroller.value.querySelector(selector)?.focus({ preventScroll: true })
+  }
+}
+const vote = async (helpful) => {
+  error.value = ''
+  const identity = help.identity
+  try {
+    await help.vote(helpful)
+  } catch {
+    if (valid(identity)) error.value = t('widget.helpFeedbackError')
+  }
+}
+onMounted(async () => {
+  if (!help.data && !help.loading) await help.load(locale.value)
+  if (scroller.value) scroller.value.scrollTop = help.scrollTop
+  if (help.pendingArticle && mounted) {
+    const article = help.pendingArticle
+    help.pendingArticle = null
+    await openArticle(article)
+  }
+})
+</script>
+
+<template>
+  <div class="flex flex-col h-full">
+    <header class="flex items-center gap-2 border-b p-3 pr-12">
+      <Button
+        v-if="help.article || currentCollection || help.results !== null"
+        ref="backButton"
+        type="button"
+        variant="ghost"
+        size="icon"
+        :aria-label="t('globals.messages.goBack')"
+        @click="back"
+        ><ArrowLeft class="size-4"
+      /></Button>
+      <h2 class="font-medium truncate">{{ help.article?.title || t('globals.terms.help') }}</h2>
+    </header>
+    <div v-if="help.loading || busy" role="status" class="px-4 py-2 text-sm text-muted-foreground">
+      {{ t('globals.terms.loading') }}
+    </div>
+    <div v-if="error || help.failed" role="alert" class="p-4 text-sm">
+      <p>{{ error || t('widget.helpLoadError') }}</p>
+      <Button type="button" variant="outline" class="mt-2" @click="retry">{{
+        t('globals.terms.tryAgain')
+      }}</Button>
+    </div>
+    <template v-if="help.article">
+      <p v-if="help.article.locale !== locale" class="px-4 pt-2 text-xs text-muted-foreground">
+        {{ t('widget.articleLanguage', { language: help.article.locale }) }}
+      </p>
+      <ArticleReader
+        :article="help.article"
+        :help-slug="help.data.slug"
+        :dark="widget.config.dark_mode"
+        @article="openArticle"
+      />
+      <div class="flex items-center justify-center gap-2 p-3 border-t text-sm">
+        <span>{{ feedback !== null ? t('helpCenter.feedbackThanks') : t('widget.helpful') }}</span>
+        <template v-if="feedback === null">
+          <Button
+            type="button"
+            variant="outline"
+            size="sm"
+            :disabled="busy || feedbackPending"
+            @click="vote(true)"
+            >{{ t('globals.messages.yes') }}</Button
+          >
+          <Button
+            type="button"
+            variant="outline"
+            size="sm"
+            :disabled="busy || feedbackPending"
+            @click="vote(false)"
+            >{{ t('globals.messages.no') }}</Button
+          >
+        </template>
+      </div>
+    </template>
+    <template v-else>
+      <form class="flex gap-2 p-3 border-b" @submit.prevent="search">
+        <Input
+          v-model="help.query"
+          :aria-label="t('widget.searchArticles')"
+          :placeholder="t('widget.searchArticles')"
+        />
+        <Button
+          type="submit"
+          variant="outline"
+          :disabled="busy || !help.available"
+          :aria-label="t('globals.terms.search')"
+          ><Search class="size-4" aria-hidden="true"
+        /></Button>
+      </form>
+      <div
+        ref="scroller"
+        class="flex-1 min-h-0 overflow-auto"
+        @scroll="help.scrollTop = $event.target.scrollTop"
+      >
+        <HelpCollectionList
+          :collection="currentCollection"
+          :collections="collections"
+          :articles="items"
+          :searching="help.results !== null"
+          @collection="openCollection"
+          @article="openArticle"
+        />
+        <p
+          v-if="help.results?.length === 0"
+          role="status"
+          class="p-4 text-sm text-muted-foreground"
+        >
+          {{ t('widget.noArticles') }}
+        </p>
+      </div>
+    </template>
+  </div>
+</template>
diff --git a/frontend/apps/widget/src/views/HomeView.vue b/frontend/apps/widget/src/views/HomeView.vue
index 324d95f6..f2727d77 100644
--- a/frontend/apps/widget/src/views/HomeView.vue
+++ b/frontend/apps/widget/src/views/HomeView.vue
@@ -1,6 +1,8 @@
 <template>
   <div class="flex flex-col h-full">
-    <div class="flex-1 min-h-0 overflow-y-auto scrollbar-thin scrollbar-track-transparent scrollbar-thumb-muted-foreground/30 hover:scrollbar-thumb-muted-foreground/50">
+    <div
+      class="flex-1 min-h-0 overflow-y-auto scrollbar-thin scrollbar-track-transparent scrollbar-thumb-muted-foreground/30 hover:scrollbar-thumb-muted-foreground/50"
+    >
       <div class="flex flex-col">
         <HomeHeader :config="config">
           <!-- Primary action renders on the gradient so it flows into the header. -->
@@ -17,10 +19,11 @@
         </HomeHeader>
 
         <!-- Home Apps (announcements + external links) sit on the normal background. -->
-        <div v-if="config.home_apps?.length" class="flex flex-col gap-3 p-4 bg-background">
+        <div v-if="homeItems.length" class="flex flex-col gap-3 p-4 bg-background">
           <div class="space-y-3">
-            <template v-for="(item, index) in config.home_apps" :key="index">
-              <AnnouncementCard v-if="item.type === 'announcement'" :announcement="item" />
+            <template v-for="(item, index) in homeItems" :key="index">
+              <HomeHelp v-if="item.type === 'help'" />
+              <AnnouncementCard v-else-if="item.type === 'announcement'" :announcement="item" />
               <HomeExternalLink v-else-if="item.type === 'external_link'" :link="item" />
             </template>
           </div>
@@ -42,12 +45,18 @@ import HomeHeader from '@widget/components/HomeHeader.vue'
 import HomeExternalLink from '@widget/components/HomeExternalLink.vue'
 import AnnouncementCard from '@widget/components/AnnouncementCard.vue'
 import RecentConversationCard from '@widget/components/RecentConversationCard.vue'
+import HomeHelp from '@widget/components/HomeHelp.vue'
+import { useHelpStore } from '@widget/store/help.js'
 
 const widgetStore = useWidgetStore()
 const chatStore = useChatStore()
 const userStore = useUserStore()
 const { t } = useI18n()
 const config = computed(() => widgetStore.config)
+const help = useHelpStore()
+const homeItems = computed(() =>
+  (config.value.home_apps || []).filter((item) => item.type !== 'help' || help.available)
+)
 
 const mostRecentConversation = computed(() => {
   const conversations = chatStore.getConversations
diff --git a/frontend/shared-ui/components/HelpCollectionList.vue b/frontend/shared-ui/components/HelpCollectionList.vue
new file mode 100644
index 00000000..1663a98d
--- /dev/null
+++ b/frontend/shared-ui/components/HelpCollectionList.vue
@@ -0,0 +1,83 @@
+<script setup>
+import { ChevronRight, FileText } from 'lucide-vue-next'
+import { Button } from '@shared-ui/components/ui/button'
+
+defineProps({
+  collection: { type: Object, default: null },
+  collections: { type: Array, default: () => [] },
+  articles: { type: Array, default: () => [] },
+  searching: { type: Boolean, default: false }
+})
+defineEmits(['collection', 'article'])
+</script>
+
+<template>
+  <div>
+    <div v-if="!searching" class="px-4 py-5 space-y-2">
+      <template v-if="collection">
+        <h3 class="text-lg font-semibold break-words">{{ collection.name }}</h3>
+        <p
+          v-if="collection.description"
+          class="text-sm text-muted-foreground whitespace-pre-line break-words"
+        >
+          {{ collection.description }}
+        </p>
+        <p class="text-xs text-muted-foreground">
+          {{
+            $t(
+              'globals.messages.articleCount',
+              { count: collection.article_count },
+              collection.article_count
+            )
+          }}
+        </p>
+      </template>
+      <h3 v-else class="text-sm font-medium">
+        {{
+          $t('globals.messages.collectionCount', { count: collections.length }, collections.length)
+        }}
+      </h3>
+    </div>
+    <ul class="px-2 divide-y divide-border">
+      <li v-for="item in articles" :key="`article-${item.id}`">
+        <Button
+          type="button"
+          variant="ghost"
+          class="w-full h-auto min-h-12 justify-start gap-3 py-3 px-2 text-left whitespace-normal"
+          :data-help-article="item.id"
+          @click="$emit('article', item)"
+        >
+          <FileText class="size-4 shrink-0 text-muted-foreground" aria-hidden="true" />
+          <span class="flex-1 min-w-0 break-words">{{ item.title }}</span>
+          <ChevronRight class="size-4 shrink-0 text-muted-foreground" aria-hidden="true" />
+        </Button>
+      </li>
+      <li v-for="child in searching ? [] : collections" :key="`collection-${child.id}`">
+        <Button
+          type="button"
+          variant="ghost"
+          class="w-full h-auto justify-start gap-3 py-4 px-2 text-left whitespace-normal"
+          :data-help-collection="child.id"
+          @click="$emit('collection', child)"
+        >
+          <span class="flex-1 min-w-0 space-y-1.5">
+            <span class="block font-medium break-words">{{ child.name }}</span>
+            <span
+              v-if="child.description"
+              class="block text-sm font-normal text-muted-foreground whitespace-pre-line break-words"
+              >{{ child.description }}</span
+            >
+            <span class="block text-xs font-normal text-muted-foreground">{{
+              $t(
+                'globals.messages.articleCount',
+                { count: child.article_count },
+                child.article_count
+              )
+            }}</span>
+          </span>
+          <ChevronRight class="size-4 shrink-0 text-muted-foreground" aria-hidden="true" />
+        </Button>
+      </li>
+    </ul>
+  </div>
+</template>
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 3de2a7e4..d42666a7 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -240,6 +240,7 @@
   "admin.ai.assistant.preview.replyLabel": "Drafted reply",
   "admin.ai.assistant.preview.sources": "Knowledge used",
   "admin.ai.assistant.preview.empty": "The drafted reply will appear here.",
+  "admin.inbox.livechat.campaignInvalid": "Proactive message `{name}` is invalid: {field}",
   "copilot.title": "Copilot",
   "copilot.details": "Details",
   "copilot.placeholder": "Ask anything…",
@@ -252,6 +253,14 @@
   "copilot.addAsPrivateNote": "Add as private note",
   "copilot.copyFailed": "Could not copy to clipboard.",
   "copilot.noteAdded": "Added as a private note.",
+  "globals.messages.articleCount": "{count} article | {count} articles",
+  "globals.messages.collectionCount": "{count} collection | {count} collections",
+  "globals.terms.dismiss": "Dismiss",
+  "globals.terms.duplicate": "Duplicate",
+  "globals.terms.from": "From",
+  "globals.terms.help": "Help",
+  "globals.terms.more": "More",
+  "globals.terms.to": "To",
   "replyBox.generateReply": "Generate reply",
   "globals.terms.model": "Model",
   "admin.general.allowedFileUploadExtensions": "Allowed file upload extensions",
@@ -654,6 +663,7 @@
   "command.switchToReply": "Switch to reply",
   "command.unassignAgent": "Unassign agent",
   "command.unassignTeam": "Unassign team",
+  "confirm.deleteCampaign": "This proactive message will be removed when you save the inbox.",
   "confirm.deleteContextLink": "This action cannot be undone. This will permanently delete this context link.",
   "confirm.deleteInbox": "This action cannot be undone. This will permanently delete this inbox.",
   "confirm.deleteMacro": "This action cannot be undone. This will permanently delete this macro.",
@@ -1560,12 +1570,76 @@
   "webhook.new": "New webhook",
   "webhook.sendTest": "Send test",
   "webhook.sentSuccessfully": "Webhook sent successfully",
+  "widget.addArticle": "Add article",
+  "widget.addCampaign": "Add proactive message",
+  "widget.addHelpHomeApp": "Add help articles",
+  "widget.articleLanguage": "Available in {language}",
+  "widget.articleUnavailable": "Article unavailable",
+  "widget.autoHideSeconds": "Hide previews after (seconds, 0 keeps them visible)",
+  "widget.backToCampaigns": "Back to proactive messages",
+  "widget.brandBot": "Brand bot",
+  "widget.campaign.all": "Everyone",
+  "widget.campaign.any": "Any time",
+  "widget.campaign.audience": "Audience",
+  "widget.campaign.business_hours": "Business hours rule",
+  "widget.campaign.delay_seconds": "Active time on page (seconds)",
+  "widget.campaign.devices": "Devices",
+  "widget.campaign.dismissed": "Dismissed",
+  "widget.campaign.displayed": "Displayed",
+  "widget.campaign.event": "Optional event name",
+  "widget.campaign.exclude_urls": "Exclude pages",
+  "widget.campaign.include_urls": "Include pages",
+  "widget.campaign.inside": "During business hours",
+  "widget.campaign.interval": "After an interval",
+  "widget.campaign.once": "Once per person",
+  "widget.campaign.opened": "Opened",
+  "widget.campaign.outside": "Outside business hours",
+  "widget.campaign.repeat": "Show again",
+  "widget.campaign.repeat_hours": "Repeat after (hours)",
+  "widget.campaign.replied": "Replied",
+  "widget.campaign.section.audience": "Who sees it",
+  "widget.campaign.section.placement": "Where and when",
+  "widget.campaign.section.repeat": "Repeat",
+  "widget.campaign.session": "Once per session",
+  "widget.campaign.users": "Signed-in users",
+  "widget.campaign.visitors": "Visitors",
+  "widget.campaignCooldown": "Minimum hours between proactive messages",
+  "widget.campaignLimitReached": "You have reached the limit of 50 proactive messages. Delete one to add another.",
+  "widget.campaignSender": "Sender",
+  "widget.campaignsHint": "Invite people to chat. A conversation starts only after they reply.",
+  "widget.campaignStats": "Proactive message results",
   "widget.conversationClosed": "This conversation has been closed",
+  "widget.conversationNotPermitted": "You cannot access this conversation. Sign in with the account that started it.",
+  "widget.deletedCampaign": "Deleted message",
+  "widget.dismissPreviews": "Dismiss all previews",
+  "widget.featuredArticles": "Featured articles",
+  "widget.featuredArticlesHint": "Choose up to 10 articles. Leave empty to show popular articles.",
+  "widget.genericNotice": "Generic notification",
+  "widget.helpFeedbackError": "Feedback could not be saved. Try again.",
+  "widget.helpful": "Was this helpful?",
+  "widget.helpHomeAppHint": "Shows a search button and the featured articles set in the Help center tab.",
+  "widget.helpHomeAppRequiresCenter": "Choose a help center in the Help center tab before adding this card.",
+  "widget.helpLoadError": "Help could not be loaded. Try again or send us a message.",
+  "widget.helpOnHomeHint": "To show help on the Home screen, add the help articles card under Appearance, Home screen apps.",
+  "widget.helpPlacement": "Where help appears",
+  "widget.invitationExpired": "This invitation is no longer available. Start a new chat to contact us.",
   "widget.ipBlocked": "Access denied",
+  "widget.messagePreview": "Message text",
+  "widget.newCampaign": "New proactive message",
+  "widget.newReply": "You have a new reply",
+  "widget.noArticles": "No articles found. Try different words or send us a message.",
+  "widget.openConversation": "Open conversation",
   "widget.prechatForm.startChat": "Start chat",
   "conversation.sidebarCounts.all": "{count} open conversation in all | {count} open conversations in all",
   "conversation.sidebarCounts.assigned": "{count} open conversation in my inbox | {count} open conversations in my inbox",
   "conversation.sidebarCounts.mentioned": "{count} open conversation with mentions | {count} open conversations with mentions",
   "conversation.sidebarCounts.view": "{count} conversation in this view | {count} conversations in this view",
-  "conversation.sidebarCounts.unassigned": "{count} open unassigned conversation | {count} open unassigned conversations"
+  "conversation.sidebarCounts.unassigned": "{count} open unassigned conversation | {count} open unassigned conversations",
+  "widget.previewContent": "Preview content",
+  "widget.proactiveMessages": "Proactive messages",
+  "widget.replyPreviews": "Replies above the launcher",
+  "widget.replyTeam": "Route replies to team",
+  "widget.searchArticles": "Search help articles",
+  "widget.showHelpTab": "Show Help tab",
+  "widget.urlPatternsHint": "One URL or path per line. Use * to match any characters. Empty includes match every page."
 }
diff --git a/internal/automation/contact.go b/internal/automation/contact.go
new file mode 100644
index 00000000..267aa582
--- /dev/null
+++ b/internal/automation/contact.go
@@ -0,0 +1,19 @@
+package automation
+
+import (
+	"github.com/abhinavxd/libredesk/internal/automation/models"
+	cmodels "github.com/abhinavxd/libredesk/internal/conversation/models"
+	umodels "github.com/abhinavxd/libredesk/internal/user/models"
+)
+
+func (e *Engine) MatchesContact(group models.RuleGroup, contact umodels.User) bool {
+	if len(group.Rules) == 0 {
+		return true
+	}
+	for _, rule := range group.Rules {
+		if rule.FieldType != models.FieldTypeContactCustomAttribute {
+			return false
+		}
+	}
+	return e.evaluateGroup(group.Rules, group.LogicalOp, cmodels.Conversation{Contact: cmodels.ConversationContact{CustomAttributes: contact.CustomAttributes}}, nil)
+}
diff --git a/internal/automation/evaluator.go b/internal/automation/evaluator.go
index b80c7659..c81cb261 100644
--- a/internal/automation/evaluator.go
+++ b/internal/automation/evaluator.go
@@ -167,6 +167,9 @@ func (e *Engine) evaluateRule(rule models.RuleDetail, conversation cmodels.Conve
 	} else if rule.FieldType == models.FieldTypeContactCustomAttribute {
 		// If the field type is custom attribute, need to extract the value from the custom attributes
 		var attributes json.RawMessage = conversation.Contact.CustomAttributes
+		if len(attributes) == 0 {
+			attributes = json.RawMessage(`{}`)
+		}
 
 		// Unmarshal the custom attributes
 		if err := json.Unmarshal(attributes, &customAttributes); err != nil {
@@ -175,8 +178,13 @@ func (e *Engine) evaluateRule(rule models.RuleDetail, conversation cmodels.Conve
 		}
 		e.lo.Debug("unmarshalled custom attributes", "custom_attributes", customAttributes, "conversation_uuid", conversation.UUID)
 
-		// Check if the field exists in the custom attributes, If the field is not found, return false.
-		if val, ok := customAttributes[rule.Field]; ok {
+		// Only the set/not set operators can act on an attribute the contact does not have.
+		val, ok := customAttributes[rule.Field]
+		if !ok && rule.Operator != models.RuleOperatorSet && rule.Operator != models.RuleOperatorNotSet {
+			e.lo.Warn("field not found in custom attribute", "field", rule.Field, "field_type", rule.FieldType, "conversation_uuid", conversation.UUID)
+			return false
+		}
+		if ok {
 			// Convert the value to a string for comparison, Handle different types of values, really not required but just to be safe.
 			switch v := val.(type) {
 			case string:
@@ -191,9 +199,6 @@ func (e *Engine) evaluateRule(rule models.RuleDetail, conversation cmodels.Conve
 			default:
 				valueToCompare = fmt.Sprintf("%v", v)
 			}
-		} else {
-			e.lo.Warn("field not found in custom attribute", "field", rule.Field, "field_type", rule.FieldType, "conversation_uuid", conversation.UUID, "custom_attributes", customAttributes)
-			return false
 		}
 	} else {
 		e.lo.Error("error unrecognized field type", "field_type", rule.FieldType, "conversation_uuid", conversation.UUID)
diff --git a/internal/conversation/conversation.go b/internal/conversation/conversation.go
index 657c4210..393c8102 100644
--- a/internal/conversation/conversation.go
+++ b/internal/conversation/conversation.go
@@ -296,6 +296,9 @@ func New(
 }
 
 type queries struct {
+	LockCampaignDelivery     *sqlx.Stmt `query:"lock-campaign-delivery"`
+	CompleteCampaignDelivery *sqlx.Stmt `query:"complete-campaign-delivery"`
+	AssignProactiveTeam      *sqlx.Stmt `query:"assign-proactive-team"`
 	// Conversation queries.
 	GetConversationUUID                 *sqlx.Stmt `query:"get-conversation-uuid"`
 	GetConversation                     *sqlx.Stmt `query:"get-conversation"`
@@ -494,6 +497,7 @@ func (c *Manager) GetContactChatConversations(contactID, inboxID int) ([]models.
 			c.SignAvatarURL(&conversations[i].Assignee.AvatarURL)
 		}
 		c.SignAvatarURL(&conversations[i].LastChatMessage.Author.AvatarURL)
+		c.SignAttachmentURLs(conversations[i].LastChatMessage.Attachments)
 	}
 	return conversations, nil
 }
@@ -512,6 +516,7 @@ func (c *Manager) GetChatConversation(conversationUUID string) (models.ChatConve
 		c.SignAvatarURL(&conversation.Assignee.AvatarURL)
 	}
 	c.SignAvatarURL(&conversation.LastChatMessage.Author.AvatarURL)
+	c.SignAttachmentURLs(conversation.LastChatMessage.Attachments)
 	return conversation, nil
 }
 
@@ -2029,6 +2034,10 @@ func (m *Manager) BuildWidgetConversationResponse(conversation models.Conversati
 
 			// Strip agent email from widget responses.
 			author := msg.Author
+			if sender := proactiveSender(msg.Meta); sender != "" {
+				author.FirstName = sender
+				author.LastName = ""
+			}
 			author.Email = null.String{}
 
 			chatMessages = append(chatMessages, models.ChatMessage{
diff --git a/internal/conversation/models/models.go b/internal/conversation/models/models.go
index 7ce335c6..3326833b 100644
--- a/internal/conversation/models/models.go
+++ b/internal/conversation/models/models.go
@@ -85,12 +85,14 @@ type ContinuityUnreadMessage struct {
 }
 
 type LastChatMessage struct {
-	Content   string           `db:"content" json:"content"`
-	CreatedAt time.Time        `db:"created_at" json:"created_at"`
-	Author    umodels.ChatUser `db:"author" json:"author"`
+	Attachments attachment.Attachments `db:"attachments" json:"attachments"`
+	Content     string                 `db:"content" json:"content"`
+	CreatedAt   time.Time              `db:"created_at" json:"created_at"`
+	Author      umodels.ChatUser       `db:"author" json:"author"`
 }
 
 type ChatConversation struct {
+	ContactLastSeenAt  time.Time         `db:"contact_last_seen_at" json:"contact_last_seen_at"`
 	CreatedAt          time.Time         `db:"created_at" json:"created_at"`
 	UUID               string            `db:"uuid" json:"uuid"`
 	Status             string            `db:"status" json:"status"`
diff --git a/internal/conversation/proactive.go b/internal/conversation/proactive.go
new file mode 100644
index 00000000..0b3b3fc8
--- /dev/null
+++ b/internal/conversation/proactive.go
@@ -0,0 +1,91 @@
+package conversation
+
+import (
+	"database/sql"
+	"encoding/json"
+	"time"
+
+	"github.com/abhinavxd/libredesk/internal/conversation/models"
+	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat/proactive"
+)
+
+func (m *Manager) CreateProactiveConversation(delivery proactive.Delivery, contactID int, reply string, attrs, meta map[string]any, maxConversations int, window time.Duration) (string, error) {
+	var snapshot proactive.Snapshot
+	if err := json.Unmarshal(delivery.Snapshot, &snapshot); err != nil {
+		return "", envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	if attrs == nil {
+		attrs = map[string]any{}
+	}
+	attrsJSON, err := json.Marshal(attrs)
+	if err != nil {
+		return "", m.proactiveError(err)
+	}
+	metaJSON, err := json.Marshal(meta)
+	if err != nil {
+		return "", m.proactiveError(err)
+	}
+	tx, err := m.db.Beginx()
+	if err != nil {
+		return "", m.proactiveError(err)
+	}
+	defer tx.Rollback()
+	var existing string
+	if err := tx.Stmtx(m.q.LockCampaignDelivery).Get(&existing, delivery.ID); err != nil {
+		return "", m.proactiveError(err)
+	}
+	if existing != "" {
+		return existing, nil
+	}
+	var id int
+	var uuid string
+	now := time.Now()
+	if err := tx.Stmtx(m.q.InsertConversation).QueryRow(contactID, models.StatusOpen, delivery.InboxID, reply, now, "", "", false, metaJSON, attrsJSON, now.Add(-window), maxConversations, m.subjectRefFormat).Scan(&id, &uuid); err != nil {
+		if err == sql.ErrNoRows {
+			return "", envelope.NewError(envelope.RateLimitError, m.i18n.T("globals.messages.tooManyRequests"), nil)
+		}
+		return "", m.proactiveError(err)
+	}
+	if _, err := tx.Stmtx(m.q.AssignProactiveTeam).Exec(id, snapshot.TeamID); err != nil {
+		return "", m.proactiveError(err)
+	}
+	if _, err := tx.Stmtx(m.q.CompleteCampaignDelivery).Exec(delivery.ID, uuid, contactID); err != nil {
+		return "", m.proactiveError(err)
+	}
+	if err := tx.Commit(); err != nil {
+		return "", m.proactiveError(err)
+	}
+	if item, err := m.GetConversationListItem(uuid); err == nil {
+		m.BroadcastNewConversation(&item)
+	}
+	invitationMeta, _ := json.Marshal(map[string]any{"proactive_sender": snapshot.Sender, "campaign_id": delivery.CampaignID})
+	for _, message := range []models.Message{
+		{Type: models.MessageOutgoing, Status: models.MessageStatusSent, SenderID: snapshot.SenderID, SenderType: models.SenderTypeAgent, Content: snapshot.Message, Meta: invitationMeta},
+		{Type: models.MessageIncoming, Status: models.MessageStatusReceived, SenderID: contactID, SenderType: models.SenderTypeContact, Content: reply},
+	} {
+		message.ConversationID = id
+		message.ConversationUUID = uuid
+		message.ContentType = models.ContentTypeText
+		if err := m.InsertMessage(&message); err != nil {
+			if err := m.DeleteConversation(uuid); err != nil {
+				m.lo.Error("error deleting proactive conversation after message insert failure", "conversation_uuid", uuid, "error", err)
+			}
+			return "", err
+		}
+	}
+	return uuid, nil
+}
+
+func (m *Manager) proactiveError(err error) error {
+	m.lo.Error("error creating proactive conversation", "error", err)
+	return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.errorSendingMessage"), nil)
+}
+
+func proactiveSender(meta json.RawMessage) string {
+	var snapshot struct {
+		Sender string `json:"proactive_sender"`
+	}
+	_ = json.Unmarshal(meta, &snapshot)
+	return snapshot.Sender
+}
diff --git a/internal/conversation/queries.sql b/internal/conversation/queries.sql
index dd75f6d1..f1f86b73 100644
--- a/internal/conversation/queries.sql
+++ b/internal/conversation/queries.sql
@@ -353,6 +353,13 @@ LIMIT 50;
 
 -- name: get-chat-conversation
 SELECT
+    COALESCE((SELECT json_agg(json_build_object('name', media.filename, 'content_type', media.content_type, 'uuid', media.uuid, 'size', media.size, 'content_id', media.content_id, 'disposition', media.disposition))
+      FROM media WHERE media.model_type = 'messages' AND media.model_id = (
+        SELECT m.id FROM conversation_messages m
+        WHERE m.conversation_id = c.id AND m.private = FALSE AND m.type IN ('incoming', 'outgoing')
+        ORDER BY m.created_at DESC, m.id DESC LIMIT 1
+      )), '[]'::json) AS "last_message.attachments",
+    COALESCE(c.contact_last_seen_at, c.created_at) AS contact_last_seen_at,
     c.created_at,
     c.uuid,
     cs.name as status,
@@ -390,6 +397,13 @@ WHERE c.uuid = $1
 
 -- name: get-contact-chat-conversations
 SELECT
+    COALESCE((SELECT json_agg(json_build_object('name', media.filename, 'content_type', media.content_type, 'uuid', media.uuid, 'size', media.size, 'content_id', media.content_id, 'disposition', media.disposition))
+      FROM media WHERE media.model_type = 'messages' AND media.model_id = (
+        SELECT m.id FROM conversation_messages m
+        WHERE m.conversation_id = c.id AND m.private = FALSE AND m.type IN ('incoming', 'outgoing')
+        ORDER BY m.created_at DESC, m.id DESC LIMIT 1
+      )), '[]'::json) AS "last_message.attachments",
+    COALESCE(c.contact_last_seen_at, c.created_at) AS contact_last_seen_at,
     c.created_at,
     c.uuid,
     cs.name as status,
@@ -1054,3 +1068,14 @@ FROM conversations
 WHERE contact_id = $1
 ORDER BY last_message_at DESC NULLS LAST
 LIMIT 200;
+
+-- name: lock-campaign-delivery
+SELECT COALESCE(conversation_uuid::text, '') FROM widget_campaign_deliveries WHERE id = $1 FOR UPDATE;
+
+-- name: complete-campaign-delivery
+UPDATE widget_campaign_deliveries
+SET conversation_uuid = $2, contact_id = $3, replied = TRUE, opened = TRUE, displayed = TRUE
+WHERE id = $1;
+
+-- name: assign-proactive-team
+UPDATE conversations SET assigned_team_id = NULLIF($2, 0) WHERE id = $1;
diff --git a/internal/conversation/transcript.go b/internal/conversation/transcript.go
index 2a7a6618..f679aafb 100644
--- a/internal/conversation/transcript.go
+++ b/internal/conversation/transcript.go
@@ -34,7 +34,7 @@ func (m *Manager) BuildTranscript(conversation models.Conversation, messages []m
 		}
 		fmt.Fprintf(&b, "\n[%s] %s (%s):\n%s\n",
 			message.CreatedAt.UTC().Format(transcriptTimeFormat),
-			message.Author.FullName(),
+			transcriptAuthor(message),
 			m.senderTypeLabel(message.SenderType),
 			content,
 		)
@@ -58,3 +58,10 @@ func (m *Manager) senderTypeLabel(senderType string) string {
 	}
 	return senderType
 }
+
+func transcriptAuthor(message models.Message) string {
+	if sender := proactiveSender(message.Meta); sender != "" {
+		return sender
+	}
+	return message.Author.FullName()
+}
diff --git a/internal/inbox/channel/livechat/livechat.go b/internal/inbox/channel/livechat/livechat.go
index d8221ba9..2f15138e 100644
--- a/internal/inbox/channel/livechat/livechat.go
+++ b/internal/inbox/channel/livechat/livechat.go
@@ -11,6 +11,7 @@ import (
 
 	"github.com/abhinavxd/libredesk/internal/conversation/models"
 	"github.com/abhinavxd/libredesk/internal/inbox"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat/proactive"
 	"github.com/volatiletech/null/v9"
 	"github.com/zerodha/logf"
 )
@@ -25,6 +26,7 @@ const (
 
 	HomeAppAnnouncement = "announcement"
 	HomeAppExternalLink = "external_link"
+	HomeAppHelp         = "help"
 )
 
 type PreChatFormField struct {
@@ -46,15 +48,46 @@ type ContinuityConfig struct {
 	MinEmailInterval    string `json:"min_email_interval"`
 }
 
+type HomeApp struct {
+	Type        string `json:"type"`
+	Title       string `json:"title,omitempty"`
+	Description string `json:"description,omitempty"`
+	ImageURL    string `json:"image_url,omitempty"`
+	URL         string `json:"url"`
+	Text        string `json:"text,omitempty"`
+}
+
+type HelpAudience struct {
+	Tab bool `json:"tab"`
+}
+
+type HelpConfig struct {
+	HelpCenterID int          `json:"help_center_id"`
+	Visitors     HelpAudience `json:"visitors"`
+	Users        HelpAudience `json:"users"`
+	FeaturedIDs  []int        `json:"featured_ids"`
+}
+
+type PreviewConfig struct {
+	Desktop         bool   `json:"desktop"`
+	Mobile          bool   `json:"mobile"`
+	Content         string `json:"content"`
+	AutoHideSeconds int    `json:"auto_hide_seconds"`
+}
+
 // Config holds the live chat inbox configuration.
 type Config struct {
-	BrandName        string `json:"brand_name"`
-	WebsiteURL       string `json:"website_url"`
-	DarkMode         bool   `json:"dark_mode"`
-	ShowPoweredBy    bool   `json:"show_powered_by"`
-	Language         string `json:"language"`
-	FallbackLanguage string `json:"fallback_language"`
-	Users            struct {
+	Campaigns             []proactive.Campaign `json:"campaigns"`
+	CampaignCooldownHours int                  `json:"campaign_cooldown_hours"`
+	Help                  HelpConfig           `json:"help"`
+	Previews              PreviewConfig        `json:"previews"`
+	BrandName             string               `json:"brand_name"`
+	WebsiteURL            string               `json:"website_url"`
+	DarkMode              bool                 `json:"dark_mode"`
+	ShowPoweredBy         bool                 `json:"show_powered_by"`
+	Language              string               `json:"language"`
+	FallbackLanguage      string               `json:"fallback_language"`
+	Users                 struct {
 		AllowStartConversation           bool   `json:"allow_start_conversation"`
 		PreventMultipleConversations     bool   `json:"prevent_multiple_conversations"`
 		PreventReplyToClosedConversation bool   `json:"prevent_reply_to_closed_conversation"`
@@ -77,6 +110,7 @@ type Config struct {
 	Features struct {
 		Emoji      bool `json:"emoji"`
 		FileUpload bool `json:"file_upload"`
+		Transcript bool `json:"transcript"`
 	} `json:"features"`
 	Launcher struct {
 		Spacing struct {
@@ -98,14 +132,7 @@ type Config struct {
 		Text    string `json:"text"`
 		Enabled bool   `json:"enabled"`
 	} `json:"notice_banner"`
-	HomeApps []struct {
-		Type        string `json:"type"`
-		Title       string `json:"title,omitempty"`
-		Description string `json:"description,omitempty"`
-		ImageURL    string `json:"image_url,omitempty"`
-		URL         string `json:"url"`
-		Text        string `json:"text,omitempty"`
-	} `json:"home_apps"`
+	HomeApps                       []HomeApp        `json:"home_apps"`
 	TrustedDomains                 []string         `json:"trusted_domains"`
 	BlockedIPs                     []string         `json:"blocked_ips"`
 	DirectToConversation           bool             `json:"direct_to_conversation"`
diff --git a/internal/inbox/channel/livechat/proactive/eligibility.go b/internal/inbox/channel/livechat/proactive/eligibility.go
new file mode 100644
index 00000000..3a4e6699
--- /dev/null
+++ b/internal/inbox/channel/livechat/proactive/eligibility.go
@@ -0,0 +1,111 @@
+package proactive
+
+import (
+	"fmt"
+	"net/url"
+	"regexp"
+	"slices"
+	"strings"
+
+	amodels "github.com/abhinavxd/libredesk/internal/automation/models"
+	"github.com/google/uuid"
+)
+
+func (c Campaign) Validate() error {
+	if _, err := uuid.Parse(c.ID); err != nil {
+		return fmt.Errorf("id")
+	}
+	if strings.TrimSpace(c.Name) == "" || len(c.Name) > 128 {
+		return fmt.Errorf("name")
+	}
+	if strings.TrimSpace(c.Message) == "" || len(c.Message) > 10000 {
+		return fmt.Errorf("message")
+	}
+	if !slices.Contains([]string{"all", "visitors", "users"}, c.Audience) {
+		return fmt.Errorf("audience")
+	}
+	if !slices.Contains([]string{"once", "session", "interval"}, c.Repeat) {
+		return fmt.Errorf("repeat")
+	}
+	if !slices.Contains([]string{"any", "inside", "outside"}, c.BusinessHours) {
+		return fmt.Errorf("business_hours")
+	}
+	if c.SenderID < 0 || c.TeamID < 0 || c.BusinessHoursID < 0 || (c.BusinessHours != "any" && c.BusinessHoursID == 0) {
+		return fmt.Errorf("sender, team or business hours")
+	}
+	if c.DelaySeconds < 0 || c.DelaySeconds > 86400 || c.RepeatHours < 1 || c.RepeatHours > 8760 {
+		return fmt.Errorf("delay or repeat interval")
+	}
+	if len(c.Event) > 128 || len(c.IncludeURLs)+len(c.ExcludeURLs) > 40 {
+		return fmt.Errorf("targeting")
+	}
+	for _, pattern := range append(slices.Clone(c.IncludeURLs), c.ExcludeURLs...) {
+		if len(pattern) > 2048 || strings.TrimSpace(pattern) == "" {
+			return fmt.Errorf("url pattern")
+		}
+	}
+	return ValidateConditions(c.Conditions)
+}
+
+// withinHours is a func so the business-hours lookup only runs for campaigns that pass every in-memory check.
+func (c Campaign) IneligibleReason(ctx Context, conditionsMatch bool, withinHours func() bool) string {
+	switch {
+	case !c.Enabled:
+		return "paused"
+	case c.Audience == "visitors" && !ctx.Visitor || c.Audience == "users" && ctx.Visitor:
+		return "audience"
+	case ctx.Mobile && !c.Mobile || !ctx.Mobile && !c.Desktop:
+		return "device"
+	case !conditionsMatch:
+		return "attributes"
+	case len(c.IncludeURLs) > 0 && !matchesURL(c.IncludeURLs, ctx.URL):
+		return "url"
+	case matchesURL(c.ExcludeURLs, ctx.URL):
+		return "excludedUrl"
+	case c.Event != "" && c.Event != ctx.Event:
+		return "event"
+	case ctx.ActiveSeconds < c.DelaySeconds:
+		return "delay"
+	case c.BusinessHours == "inside" && !withinHours() || c.BusinessHours == "outside" && withinHours():
+		return "businessHours"
+	}
+	return ""
+}
+
+func ValidateConditions(group amodels.RuleGroup) error {
+	if len(group.Rules) > 20 || len(group.Rules) > 0 && group.LogicalOp != "AND" && group.LogicalOp != "OR" {
+		return fmt.Errorf("conditions")
+	}
+	for _, rule := range group.Rules {
+		if rule.FieldType != amodels.FieldTypeContactCustomAttribute || rule.Field == "" || len(rule.Value) > 2048 || !slices.Contains([]string{"contains", "not contains", "equals", "not equals", "set", "not set", "greater than", "less than", "starts with"}, rule.Operator) {
+			return fmt.Errorf("conditions")
+		}
+	}
+	return nil
+}
+
+func matchesURL(patterns []string, raw string) bool {
+	u, err := url.Parse(raw)
+	if err != nil || u.Host == "" || u.Scheme != "https" && u.Scheme != "http" {
+		return false
+	}
+	u.Fragment = ""
+	for _, pattern := range patterns {
+		target := *u
+		if !strings.Contains(pattern, "?") {
+			target.RawQuery = ""
+		}
+		candidate := target.String()
+		switch {
+		case strings.HasPrefix(pattern, "/"):
+			candidate = target.RequestURI()
+		case !strings.Contains(pattern, "://"):
+			candidate = strings.TrimPrefix(candidate, target.Scheme+"://")
+		}
+		expression := "^" + strings.ReplaceAll(regexp.QuoteMeta(pattern), `\*`, ".*") + "$"
+		if regexp.MustCompile(expression).MatchString(candidate) {
+			return true
+		}
+	}
+	return false
+}
diff --git a/internal/inbox/channel/livechat/proactive/eligibility_test.go b/internal/inbox/channel/livechat/proactive/eligibility_test.go
new file mode 100644
index 00000000..4765a640
--- /dev/null
+++ b/internal/inbox/channel/livechat/proactive/eligibility_test.go
@@ -0,0 +1,94 @@
+package proactive
+
+import (
+	"testing"
+	"time"
+)
+
+func TestEligibilityAndSuppression(t *testing.T) {
+	now := time.Date(2026, 9, 12, 12, 0, 0, 0, time.UTC)
+	campaign := Campaign{ID: "a", Enabled: true, Audience: "all", Desktop: true, Mobile: true, BusinessHours: "any", DelaySeconds: 10, Repeat: "once", IncludeURLs: []string{"https://example.com/pricing*"}, ExcludeURLs: []string{"*/private*"}}
+	ctx := Context{URL: "https://example.com/pricing?plan=team", Visitor: true, Now: now, ActiveSeconds: 10, SessionKey: "session"}
+	tests := []struct {
+		name   string
+		modify func(*Context)
+		want   string
+	}{
+		{"matches", func(*Context) {}, ""},
+		{"delay", func(c *Context) { c.ActiveSeconds = 9 }, "delay"},
+		{"wrong host", func(c *Context) { c.URL = "https://example.com.evil/pricing" }, "url"},
+		{"excluded", func(c *Context) { c.URL = "https://example.com/pricing/private" }, "excludedUrl"},
+		{"script URL", func(c *Context) { c.URL = "javascript:alert(1)" }, "url"},
+		{"path pattern ignores query", func(c *Context) { c.URL = "https://example.com/pricing?utm_source=ads" }, ""},
+	}
+	for _, tt := range tests {
+		t.Run(tt.name, func(t *testing.T) {
+			c := ctx
+			tt.modify(&c)
+			if got := campaign.IneligibleReason(c, true, func() bool { return true }); got != tt.want {
+				t.Fatalf("got %q, want %q", got, tt.want)
+			}
+		})
+	}
+	for pattern, want := range map[string]bool{"/pricing": true, "example.com/pricing": true, "https://example.com/pricing": true, "/pricing?plan=team": true, "/pricing?plan=solo": false, "/pric": false} {
+		if got := matchesURL([]string{pattern}, ctx.URL); got != want {
+			t.Fatalf("pattern %q: got %v, want %v", pattern, got, want)
+		}
+	}
+	history := []Delivery{{CampaignID: "a", Displayed: true, CreatedAt: now.Add(-48 * time.Hour), SessionKey: "session"}}
+	if got := Suppression(campaign, ctx, history, 24); got != "repeat" {
+		t.Fatalf("once: %q", got)
+	}
+	campaign.Repeat = "session"
+	if got := Suppression(campaign, ctx, history, 24); got != "repeat" {
+		t.Fatalf("session: %q", got)
+	}
+	ctx.SessionKey = "new"
+	if got := Suppression(campaign, ctx, history, 24); got != "" {
+		t.Fatalf("new session: %q", got)
+	}
+	campaign.Repeat = "interval"
+	campaign.RepeatHours = 72
+	if got := Suppression(campaign, ctx, history, 24); got != "repeat" {
+		t.Fatalf("interval: %q", got)
+	}
+	history[0].CampaignID = "other"
+	history[0].CreatedAt = now.Add(-time.Hour)
+	if got := Suppression(campaign, ctx, history, 24); got != "cooldown" {
+		t.Fatalf("shared cooldown: %q", got)
+	}
+	history[0].Displayed = false
+	if got := Suppression(campaign, ctx, history, 24); got != "" {
+		t.Fatalf("expired reservation suppressed: %q", got)
+	}
+	history[0].CreatedAt = now.Add(-time.Second)
+	if got := Suppression(campaign, ctx, history, 24); got != "cooldown" {
+		t.Fatalf("concurrent reservation: %q", got)
+	}
+}
+
+func TestEligibilityGates(t *testing.T) {
+	now := time.Date(2026, 9, 12, 12, 0, 0, 0, time.UTC)
+	open := func() bool { return true }
+	closed := func() bool { return false }
+	c := Campaign{Enabled: true, Audience: "users", Desktop: true, BusinessHours: "inside", Event: "checkout"}
+	ctx := Context{Now: now, Event: "checkout"}
+	if got := c.IneligibleReason(ctx, true, open); got != "" {
+		t.Fatal(got)
+	}
+	ctx.Event = ""
+	if got := c.IneligibleReason(ctx, true, open); got != "event" {
+		t.Fatal(got)
+	}
+	ctx.Event = "checkout"
+	if got := c.IneligibleReason(ctx, true, closed); got != "businessHours" {
+		t.Fatal(got)
+	}
+	if got := c.IneligibleReason(ctx, false, open); got != "attributes" {
+		t.Fatal(got)
+	}
+	ctx.Visitor = true
+	if got := c.IneligibleReason(ctx, true, open); got != "audience" {
+		t.Fatal(got)
+	}
+}
diff --git a/internal/inbox/channel/livechat/proactive/models.go b/internal/inbox/channel/livechat/proactive/models.go
new file mode 100644
index 00000000..b74c3f13
--- /dev/null
+++ b/internal/inbox/channel/livechat/proactive/models.go
@@ -0,0 +1,73 @@
+package proactive
+
+import (
+	"encoding/json"
+	"time"
+
+	amodels "github.com/abhinavxd/libredesk/internal/automation/models"
+)
+
+type Campaign struct {
+	ID              string            `json:"id"`
+	Name            string            `json:"name"`
+	Enabled         bool              `json:"enabled"`
+	Message         string            `json:"message"`
+	SenderID        int               `json:"sender_id"`
+	TeamID          int               `json:"team_id"`
+	Audience        string            `json:"audience"`
+	IncludeURLs     []string          `json:"include_urls"`
+	ExcludeURLs     []string          `json:"exclude_urls"`
+	Conditions      amodels.RuleGroup `json:"conditions"`
+	Event           string            `json:"event"`
+	DelaySeconds    int               `json:"delay_seconds"`
+	BusinessHoursID int               `json:"business_hours_id"`
+	BusinessHours   string            `json:"business_hours"`
+	Desktop         bool              `json:"desktop"`
+	Mobile          bool              `json:"mobile"`
+	Repeat          string            `json:"repeat"`
+	RepeatHours     int               `json:"repeat_hours"`
+}
+
+type Context struct {
+	URL           string    `json:"url"`
+	BrowserKey    string    `json:"browser_key"`
+	SessionKey    string    `json:"session_key"`
+	Event         string    `json:"event"`
+	ActiveSeconds int       `json:"active_seconds"`
+	Mobile        bool      `json:"mobile"`
+	Visitor       bool      `json:"visitor"`
+	Now           time.Time `json:"now"`
+	ContactID     int       `json:"contact_id"`
+}
+
+type Delivery struct {
+	ID               string          `db:"id" json:"id"`
+	CampaignID       string          `db:"campaign_id" json:"campaign_id"`
+	InboxID          int             `db:"inbox_id" json:"-"`
+	BrowserKey       string          `db:"browser_key" json:"-"`
+	SessionKey       string          `db:"session_key" json:"-"`
+	ContactID        int             `db:"contact_id" json:"-"`
+	Snapshot         json.RawMessage `db:"snapshot" json:"snapshot"`
+	CreatedAt        time.Time       `db:"created_at" json:"-"`
+	Displayed        bool            `db:"displayed" json:"-"`
+	Opened           bool            `db:"opened" json:"-"`
+	Dismissed        bool            `db:"dismissed" json:"-"`
+	Replied          bool            `db:"replied" json:"-"`
+	ConversationUUID string          `db:"conversation_uuid" json:"-"`
+}
+
+type Snapshot struct {
+	Message  string `json:"message"`
+	Sender   string `json:"sender"`
+	Avatar   string `json:"avatar"`
+	SenderID int    `json:"sender_id"`
+	TeamID   int    `json:"team_id"`
+}
+
+type Stats struct {
+	CampaignID string `db:"campaign_id" json:"campaign_id"`
+	Displayed  int    `db:"displayed" json:"displayed"`
+	Opened     int    `db:"opened" json:"opened"`
+	Dismissed  int    `db:"dismissed" json:"dismissed"`
+	Replied    int    `db:"replied" json:"replied"`
+}
diff --git a/internal/inbox/channel/livechat/proactive/proactive.go b/internal/inbox/channel/livechat/proactive/proactive.go
new file mode 100644
index 00000000..6375e99f
--- /dev/null
+++ b/internal/inbox/channel/livechat/proactive/proactive.go
@@ -0,0 +1,131 @@
+// Package proactive picks which livechat campaign message to show a widget visitor and records what they do with it.
+package proactive
+
+import (
+	"database/sql"
+	"embed"
+	"encoding/json"
+	"errors"
+	"sync"
+	"time"
+
+	"github.com/abhinavxd/libredesk/internal/dbutil"
+	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/jmoiron/sqlx"
+	"github.com/knadh/go-i18n"
+	"github.com/zerodha/logf"
+)
+
+var (
+	//go:embed queries.sql
+	efs embed.FS
+)
+
+type Manager struct {
+	q    queries
+	lo   *logf.Logger
+	i18n *i18n.I18n
+	mu   sync.Mutex
+}
+
+type Opts struct {
+	DB   *sqlx.DB
+	Lo   *logf.Logger
+	I18n *i18n.I18n
+}
+
+type queries struct {
+	History     *sqlx.Stmt `query:"history"`
+	Reserve     *sqlx.Stmt `query:"reserve"`
+	GetDelivery *sqlx.Stmt `query:"get-delivery"`
+	RecordEvent *sqlx.Stmt `query:"record-event"`
+	BindContact *sqlx.Stmt `query:"bind-contact"`
+	Stats       *sqlx.Stmt `query:"stats"`
+}
+
+func New(opts Opts) (*Manager, error) {
+	var q queries
+	if err := dbutil.ScanSQLFile("queries.sql", &q, opts.DB, efs); err != nil {
+		return nil, err
+	}
+	return &Manager{q: q, lo: opts.Lo, i18n: opts.I18n}, nil
+}
+
+func (m *Manager) Lock() func() {
+	m.mu.Lock()
+	return m.mu.Unlock
+}
+
+func (m *Manager) History(inboxID int, ctx Context) ([]Delivery, error) {
+	if ctx.ContactID > 0 {
+		if _, err := m.q.BindContact.Exec(inboxID, ctx.BrowserKey, ctx.ContactID); err != nil {
+			return nil, m.error(err)
+		}
+	}
+	out := make([]Delivery, 0)
+	if err := m.q.History.Select(&out, inboxID, ctx.BrowserKey, ctx.ContactID); err != nil {
+		return nil, m.error(err)
+	}
+	return out, nil
+}
+
+func (m *Manager) Reserve(inboxID int, campaign Campaign, ctx Context, snapshot Snapshot) (Delivery, error) {
+	raw, err := json.Marshal(snapshot)
+	if err != nil {
+		return Delivery{}, m.error(err)
+	}
+	delivery := Delivery{CampaignID: campaign.ID, Snapshot: raw}
+	if err := m.q.Reserve.Get(&delivery.ID, campaign.ID, inboxID, ctx.BrowserKey, ctx.SessionKey, ctx.ContactID, raw); err != nil {
+		return Delivery{}, m.error(err)
+	}
+	return delivery, nil
+}
+
+func (m *Manager) Get(id string, inboxID int, browserKey string, contactID int) (Delivery, error) {
+	var out Delivery
+	if err := m.q.GetDelivery.Get(&out, id, inboxID, browserKey, contactID); err != nil {
+		if errors.Is(err, sql.ErrNoRows) {
+			return out, envelope.NewError(envelope.NotFoundError, m.i18n.T("globals.messages.notFound"), nil)
+		}
+		return out, m.error(err)
+	}
+	return out, nil
+}
+
+func (m *Manager) RecordEvent(id, event string) error {
+	if _, err := m.q.RecordEvent.Exec(id, event); err != nil {
+		return m.error(err)
+	}
+	return nil
+}
+
+func (m *Manager) Stats(inboxID int, from, to time.Time) ([]Stats, error) {
+	out := make([]Stats, 0)
+	if err := m.q.Stats.Select(&out, inboxID, from, to); err != nil {
+		return nil, m.error(err)
+	}
+	return out, nil
+}
+
+func (m *Manager) error(err error) error {
+	m.lo.Error("proactive message operation failed", "error", err)
+	return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+}
+
+func Suppression(c Campaign, ctx Context, history []Delivery, cooldownHours int) string {
+	for _, d := range history {
+		if !d.Displayed && !d.Dismissed && !d.Replied && ctx.Now.Sub(d.CreatedAt) > time.Minute {
+			continue
+		}
+		if d.CampaignID == c.ID {
+			if d.Replied || c.Repeat == "once" || c.Repeat == "session" && d.SessionKey == ctx.SessionKey || c.Repeat == "interval" && ctx.Now.Sub(d.CreatedAt) < time.Duration(c.RepeatHours)*time.Hour {
+				return "repeat"
+			}
+			continue
+		}
+		if ctx.Now.Sub(d.CreatedAt) < time.Duration(max(1, cooldownHours))*time.Hour {
+			return "cooldown"
+		}
+	}
+	return ""
+}
diff --git a/internal/inbox/channel/livechat/proactive/proactive_test.go b/internal/inbox/channel/livechat/proactive/proactive_test.go
new file mode 100644
index 00000000..2b62d88d
--- /dev/null
+++ b/internal/inbox/channel/livechat/proactive/proactive_test.go
@@ -0,0 +1,89 @@
+package proactive
+
+import (
+	"sync"
+	"testing"
+	"time"
+
+	"github.com/abhinavxd/libredesk/internal/testutil"
+	"github.com/google/uuid"
+	"github.com/zerodha/logf"
+)
+
+func TestConcurrentDeliveryAndOwnership(t *testing.T) {
+	db := testutil.NewDB(t, "widget_delivery")
+	lo := logf.New(logf.Opts{})
+	m, err := New(Opts{DB: db, Lo: &lo, I18n: testutil.NewI18n(t)})
+	if err != nil {
+		t.Fatal(err)
+	}
+	var inboxID int
+	if err := db.Get(&inboxID, `INSERT INTO inboxes(name,channel) VALUES ('Test','livechat') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	ctx := Context{BrowserKey: uuid.NewString(), SessionKey: uuid.NewString(), Now: time.Now()}
+	c := Campaign{ID: uuid.NewString(), Repeat: "once"}
+	var wg sync.WaitGroup
+	var deliveries []Delivery
+	for range 12 {
+		wg.Go(func() {
+			unlock := m.Lock()
+			defer unlock()
+			history, err := m.History(inboxID, ctx)
+			if err != nil {
+				t.Error(err)
+				return
+			}
+			if Suppression(c, ctx, history, 24) != "" {
+				return
+			}
+			delivery, err := m.Reserve(inboxID, c, ctx, Snapshot{Message: "Hello"})
+			if err != nil {
+				t.Error(err)
+				return
+			}
+			deliveries = append(deliveries, delivery)
+		})
+	}
+	wg.Wait()
+	if len(deliveries) != 1 {
+		t.Fatalf("got %d reservations", len(deliveries))
+	}
+	d := deliveries[0]
+	if _, err := m.Get(d.ID, inboxID, uuid.NewString(), 0); err == nil {
+		t.Fatal("another browser accessed delivery")
+	}
+	if _, err := m.Get(d.ID, inboxID+1, ctx.BrowserKey, 0); err == nil {
+		t.Fatal("another inbox accessed delivery")
+	}
+	for range 2 {
+		for _, event := range []string{"displayed", "opened", "dismissed"} {
+			if err := m.RecordEvent(d.ID, event); err != nil {
+				t.Fatal(err)
+			}
+		}
+	}
+	stats, err := m.Stats(inboxID, ctx.Now.Add(-time.Minute), ctx.Now.Add(time.Minute))
+	if err != nil {
+		t.Fatal(err)
+	}
+	if len(stats) != 1 || stats[0].Displayed != 1 || stats[0].Opened != 1 || stats[0].Dismissed != 1 || stats[0].Replied != 0 {
+		t.Fatalf("duplicate events inflated stats: %+v", stats)
+	}
+	var contactID int
+	if err := db.Get(&contactID, `INSERT INTO users(type,first_name) VALUES ('contact','Test') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	ctx.ContactID = contactID
+	if _, err := m.History(inboxID, ctx); err != nil {
+		t.Fatal(err)
+	}
+	ctx.BrowserKey = uuid.NewString()
+	history, err := m.History(inboxID, ctx)
+	if err != nil {
+		t.Fatal(err)
+	}
+	if Suppression(c, ctx, history, 24) != "repeat" {
+		t.Fatal("identified contact lost delivery history")
+	}
+}
diff --git a/internal/inbox/channel/livechat/proactive/queries.sql b/internal/inbox/channel/livechat/proactive/queries.sql
new file mode 100644
index 00000000..13d96868
--- /dev/null
+++ b/internal/inbox/channel/livechat/proactive/queries.sql
@@ -0,0 +1,40 @@
+-- name: history
+SELECT id, campaign_id, inbox_id, browser_key, session_key, COALESCE(contact_id, 0) AS contact_id,
+       snapshot, created_at, displayed, opened, dismissed, replied, COALESCE(conversation_uuid::text, '') AS conversation_uuid
+FROM widget_campaign_deliveries
+WHERE inbox_id = $1 AND (browser_key = $2 OR (contact_id = $3 AND $3 > 0))
+ORDER BY created_at DESC;
+
+-- name: reserve
+INSERT INTO widget_campaign_deliveries(campaign_id, inbox_id, browser_key, session_key, contact_id, snapshot)
+VALUES ($1, $2, $3, $4, NULLIF($5, 0), $6)
+RETURNING id;
+
+-- name: get-delivery
+SELECT id, campaign_id, inbox_id, browser_key, session_key, COALESCE(contact_id, 0) AS contact_id,
+       snapshot, created_at, displayed, opened, dismissed, replied, COALESCE(conversation_uuid::text, '') AS conversation_uuid
+FROM widget_campaign_deliveries
+WHERE id = $1 AND inbox_id = $2
+  AND ((contact_id = $4 AND $4 > 0) OR (browser_key = $3 AND
+       (contact_id IS NULL OR ($4 = 0 AND EXISTS (SELECT 1 FROM users WHERE users.id = contact_id AND users.type = 'visitor')))));
+
+-- name: record-event
+UPDATE widget_campaign_deliveries
+SET displayed = displayed OR $2 = 'displayed',
+    opened = opened OR $2 = 'opened',
+    dismissed = dismissed OR $2 = 'dismissed'
+WHERE id = $1;
+
+-- name: bind-contact
+UPDATE widget_campaign_deliveries SET contact_id = $3
+WHERE inbox_id = $1 AND browser_key = $2 AND contact_id IS NULL;
+
+-- name: stats
+SELECT campaign_id,
+       COUNT(*) FILTER (WHERE displayed)::int AS displayed,
+       COUNT(*) FILTER (WHERE opened)::int AS opened,
+       COUNT(*) FILTER (WHERE dismissed)::int AS dismissed,
+       COUNT(*) FILTER (WHERE replied)::int AS replied
+FROM widget_campaign_deliveries
+WHERE inbox_id = $1 AND created_at >= $2 AND created_at < $3
+GROUP BY campaign_id;
diff --git a/internal/migrations/v2.10.0.go b/internal/migrations/v2.10.0.go
new file mode 100644
index 00000000..2292da10
--- /dev/null
+++ b/internal/migrations/v2.10.0.go
@@ -0,0 +1,31 @@
+package migrations
+
+import (
+	"github.com/jmoiron/sqlx"
+	"github.com/knadh/koanf/v2"
+	"github.com/knadh/stuffbin"
+)
+
+func V2_10_0(db *sqlx.DB, fs stuffbin.FileSystem, ko *koanf.Koanf) error {
+	_, err := db.Exec(`
+CREATE TABLE IF NOT EXISTS widget_campaign_deliveries (
+    id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+    campaign_id UUID NOT NULL,
+    inbox_id INTEGER NOT NULL REFERENCES inboxes(id) ON DELETE CASCADE,
+    browser_key UUID NOT NULL,
+    session_key UUID NOT NULL,
+    contact_id INTEGER REFERENCES users(id) ON DELETE SET NULL,
+    snapshot JSONB NOT NULL,
+    created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+    displayed BOOLEAN NOT NULL DEFAULT FALSE,
+    opened BOOLEAN NOT NULL DEFAULT FALSE,
+    dismissed BOOLEAN NOT NULL DEFAULT FALSE,
+    replied BOOLEAN NOT NULL DEFAULT FALSE,
+    conversation_uuid UUID REFERENCES conversations(uuid) ON DELETE SET NULL
+);
+CREATE INDEX IF NOT EXISTS idx_widget_campaign_browser ON widget_campaign_deliveries(inbox_id, browser_key, created_at DESC);
+CREATE INDEX IF NOT EXISTS idx_widget_campaign_contact ON widget_campaign_deliveries(inbox_id, contact_id, created_at DESC) WHERE contact_id IS NOT NULL;
+CREATE INDEX IF NOT EXISTS idx_widget_campaign_stats ON widget_campaign_deliveries(inbox_id, campaign_id, created_at);
+`)
+	return err
+}
diff --git a/internal/migrations/v2.10.0_test.go b/internal/migrations/v2.10.0_test.go
new file mode 100644
index 00000000..2d921461
--- /dev/null
+++ b/internal/migrations/v2.10.0_test.go
@@ -0,0 +1,23 @@
+package migrations
+
+import (
+	"github.com/abhinavxd/libredesk/internal/testutil"
+	"testing"
+)
+
+func TestWidgetCampaignMigration(t *testing.T) {
+	db := testutil.NewDB(t, "widget_migration")
+	db.MustExec(`DROP TABLE widget_campaign_deliveries`)
+	for range 2 {
+		if err := V2_10_0(db, nil, nil); err != nil {
+			t.Fatal(err)
+		}
+	}
+	var count int
+	if err := db.Get(&count, `SELECT COUNT(*) FROM pg_indexes WHERE tablename = 'widget_campaign_deliveries'`); err != nil {
+		t.Fatal(err)
+	}
+	if count != 4 {
+		t.Fatalf("expected primary key and three indexes, got %d", count)
+	}
+}
diff --git a/internal/user/queries.sql b/internal/user/queries.sql
index f7c3b86c..8432f4c2 100644
--- a/internal/user/queries.sql
+++ b/internal/user/queries.sql
@@ -62,6 +62,7 @@ SELECT
     u.api_key_last_used_at,
     u.external_user_id,
     u.api_secret,
+    u.custom_attributes,
     array_agg(DISTINCT r.name) FILTER (WHERE r.name IS NOT NULL) AS roles,
     COALESCE(
         (SELECT json_agg(json_build_object('id', t.id, 'name', t.name, 'emoji', t.emoji))
@@ -415,7 +416,10 @@ UPDATE users SET type = 'contact', updated_at = now()
 WHERE id = $1 AND type = 'visitor';
 
 -- name: merge-visitor-to-contact
-WITH transfer_conversations AS (
+WITH transfer_campaigns AS (
+    UPDATE widget_campaign_deliveries SET contact_id = $2 WHERE contact_id = $1
+    RETURNING id
+), transfer_conversations AS (
     UPDATE conversations
     SET contact_id = $2, updated_at = now()
     WHERE contact_id = $1
diff --git a/schema.sql b/schema.sql
index f52ee88a..cb50d570 100644
--- a/schema.sql
+++ b/schema.sql
@@ -1203,3 +1203,22 @@ INSERT INTO business_hours ("name", description, is_always_open, hours, holidays
 -- Default SLA policy
 INSERT INTO sla_policies ("name", description, first_response_time, resolution_time, next_response_time, notifications) VALUES
 ('Default', 'Default SLA policy, first response within 1 hour and resolution within 24 hours.', '1h', '24h', NULL, '[]'::jsonb);
+
+CREATE TABLE IF NOT EXISTS widget_campaign_deliveries (
+    id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+    campaign_id UUID NOT NULL,
+    inbox_id INTEGER NOT NULL REFERENCES inboxes(id) ON DELETE CASCADE,
+    browser_key UUID NOT NULL,
+    session_key UUID NOT NULL,
+    contact_id INTEGER REFERENCES users(id) ON DELETE SET NULL,
+    snapshot JSONB NOT NULL,
+    created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+    displayed BOOLEAN NOT NULL DEFAULT FALSE,
+    opened BOOLEAN NOT NULL DEFAULT FALSE,
+    dismissed BOOLEAN NOT NULL DEFAULT FALSE,
+    replied BOOLEAN NOT NULL DEFAULT FALSE,
+    conversation_uuid UUID REFERENCES conversations(uuid) ON DELETE SET NULL
+);
+CREATE INDEX IF NOT EXISTS idx_widget_campaign_browser ON widget_campaign_deliveries(inbox_id, browser_key, created_at DESC);
+CREATE INDEX IF NOT EXISTS idx_widget_campaign_contact ON widget_campaign_deliveries(inbox_id, contact_id, created_at DESC) WHERE contact_id IS NOT NULL;
+CREATE INDEX IF NOT EXISTS idx_widget_campaign_stats ON widget_campaign_deliveries(inbox_id, campaign_id, created_at);
diff --git a/static/widget.js b/static/widget.js
index ead938ed..554e4a47 100644
--- a/static/widget.js
+++ b/static/widget.js
@@ -28,6 +28,8 @@
             this.MOBILE_BREAKPOINT = 600;
             this.LAUNCHER_SIZE = 60;
             this.MOBILE_LAUNCHER_SIZE = 50;
+            this.CAMPAIGN_POLL_MIN = 5;
+            this.CAMPAIGN_POLL_MAX = 60;
 
             this.config = config;
             this.iframe = null;
@@ -37,6 +39,17 @@
             this.isChatVisible = false;
             this.widgetSettings = null;
             this.unreadCount = 0;
+            this.previewData = null;
+            this.previewHost = null;
+            this.previewTimers = new Map();
+            this.campaignData = null;
+            this.campaignActiveSeconds = 0;
+            this.campaignURL = location.href;
+            this.campaignEvent = "";
+            this.campaignBrowserKey = this.getCookie(this.getCookieName('campaign')) || this.randomKey();
+            this.setCookie(this.getCookieName('campaign'), this.campaignBrowserKey);
+            this.campaignSessionKey = this.getCookie(this.getCookieName('campaign-session')) || this.randomKey();
+            this.setCampaignSessionCookie();
             this.isMobile = window.innerWidth <= this.MOBILE_BREAKPOINT;
             this.isExpanded = false;
             this.hideLauncher = config.hideLauncher || false;
@@ -49,9 +62,24 @@
             this.init();
         }
 
+        // crypto.randomUUID is unavailable on plain-http host pages; getRandomValues is not.
+        randomKey () {
+            if (crypto.randomUUID) return crypto.randomUUID();
+            const bytes = crypto.getRandomValues(new Uint8Array(16));
+            bytes[6] = (bytes[6] & 0x0f) | 0x40;
+            bytes[8] = (bytes[8] & 0x3f) | 0x80;
+            const hex = Array.from(bytes, b => b.toString(16).padStart(2, '0')).join('');
+            return `${hex.slice(0, 8)}-${hex.slice(8, 12)}-${hex.slice(12, 16)}-${hex.slice(16, 20)}-${hex.slice(20)}`;
+        }
+
+        dropCampaign (id) {
+            this.campaignData = null;
+            this.postToIframe({ type: 'CAMPAIGN_EVENT', event: 'dropped', id });
+        }
+
         postToIframe (data) {
             if (this.iframe && this.iframe.contentWindow) {
-                this.iframe.contentWindow.postMessage(data, '*');
+                this.iframe.contentWindow.postMessage(data, new URL(this.config.baseURL).origin);
             }
         }
 
@@ -98,6 +126,11 @@
             document.cookie = cookie;
         }
 
+        setCampaignSessionCookie () {
+            const domain = this.getCookieDomain();
+            document.cookie = this.getCookieName('campaign-session') + '=' + this.campaignSessionKey + ';path=/;SameSite=Lax' + (domain ? ';domain=' + domain : '') + (location.protocol === 'https:' ? ';Secure' : '');
+        }
+
         getCookie (name) {
             var match = document.cookie.match(new RegExp('(?:^|; )' + name.replace(/[.*+?^${}()|[\]\\]/g, '\\$&') + '=([^;]*)'));
             return match ? decodeURIComponent(match[1]) : null;
@@ -280,7 +313,8 @@
                 : 'width 0.3s ease, height 0.3s ease, bottom 0.3s ease, border-radius 0.3s ease, box-shadow 0.3s ease';
 
             this.iframe = document.createElement('iframe');
-            this.iframe.src = `${this.config.baseURL}/widget?inbox_id=${this.config.inboxID}`;
+            this.iframe.src = `${this.config.baseURL}/widget?inbox_id=${encodeURIComponent(this.config.inboxID)}&parent_origin=${encodeURIComponent(window.location.origin)}`;
+            this.iframe.title = 'libredesk';
             this.iframe.style.cssText = `
                 position: fixed;
                 border: none;
@@ -379,9 +413,28 @@
         }
 
         handleMessage (event) {
-            if (event.source !== this.iframe.contentWindow) return;
+            if (event.source !== this.iframe?.contentWindow || event.origin !== new URL(this.config.baseURL).origin || !event.data) return;
 
             switch (event.data.type) {
+                case 'SHOW_CAMPAIGN':
+                    if (this.isChatVisible || this.unreadCount > 0 || this.hideLauncher) {
+                        this.dropCampaign(event.data.delivery.id);
+                        break;
+                    }
+                    this.campaignData = event.data.delivery;
+                    this.renderPreviews();
+                    if (this.previewHost) this.postToIframe({ type: 'CAMPAIGN_EVENT', event: 'displayed', id: this.campaignData.id });
+                    else this.dropCampaign(event.data.delivery.id);
+                    break;
+                case 'CLEAR_CAMPAIGN':
+                    this.campaignData = null;
+                    this.renderPreviews();
+                    break;
+                case 'REPLY_PREVIEWS':
+                    if (event.data.previews?.length && this.campaignData) this.dropCampaign(this.campaignData.id);
+                    this.previewData = event.data;
+                    this.renderPreviews();
+                    break;
                 case 'VUE_APP_READY':
                     this.handleVueAppReady();
                     break;
@@ -393,6 +446,7 @@
                     break;
                 case 'WIDGET_LOADED':
                     this.handleWidgetLoaded();
+                    if (event.data.campaigns) this.startCampaignTracking();
                     break;
                 case 'EXPAND_WIDGET':
                     this.expandWidget();
@@ -426,6 +480,7 @@
         handleResize () {
             const wasMobile = this.isMobile;
             this.sendMobileState();
+            this.renderPreviews();
             if (this.isChatVisible && wasMobile !== this.isMobile) {
                 this.applyIframeLayout();
                 this.updateLauncherVisibility();
@@ -446,7 +501,9 @@
                 this.postToIframe({
                     type: 'SET_JWT_TOKEN',
                     jwt: this.config.userJWT,
-                    visitorToken: visitorToken || ''
+                    visitorToken: visitorToken || '',
+                    campaignBrowserKey: this.campaignBrowserKey,
+                    campaignSessionKey: this.campaignSessionKey
                 });
                 return;
             }
@@ -455,7 +512,9 @@
             this.postToIframe({
                 type: 'SESSION_DATA',
                 sessionToken: sessionToken || '',
-                visitorToken: visitorToken || ''
+                visitorToken: visitorToken || '',
+                    campaignBrowserKey: this.campaignBrowserKey,
+                    campaignSessionKey: this.campaignSessionKey
             });
         }
 
@@ -477,6 +536,7 @@
 
             this.isMobile = window.innerWidth <= this.MOBILE_BREAKPOINT;
             this.isChatVisible = true;
+            this.renderPreviews();
 
             this.iframe.style.display = 'block';
             this.applyIframeLayout();
@@ -498,6 +558,7 @@
 
             this.iframe.style.display = 'none';
             this.isChatVisible = false;
+            this.renderPreviews();
             this.toggleButton.style.transform = 'scale(1)';
             this.updateLauncherVisibility();
 
@@ -580,17 +641,188 @@
             if (this._pageTrackInterval) clearInterval(this._pageTrackInterval);
         }
 
+        clearPreviews () {
+            this.previewData = null;
+            this.campaignData = null;
+            this.dismissedPreviews = [];
+            this.previewHost?.remove();
+            this.previewHost = null;
+            this.previewSignature = '';
+            for (const timer of this.previewTimers.values()) clearTimeout(timer);
+            this.previewTimers.clear();
+        }
+
+        dismissPreview (key) {
+            if (this.campaignData?.id === key) {
+                this.postToIframe({ type: 'CAMPAIGN_EVENT', event: 'dismissed', id: key });
+                this.campaignData = null;
+                this.renderPreviews();
+                return;
+            }
+            const storageKey = `libredesk-previews-${this.config.inboxID}-${this.previewData?.identity || 'visitor'}`;
+            let dismissed = this.dismissedPreviews || [];
+            try { dismissed = JSON.parse(localStorage.getItem(storageKey) || '[]'); } catch {}
+            dismissed = [...new Set([...dismissed, key])].slice(-200);
+            this.dismissedPreviews = dismissed;
+            try { localStorage.setItem(storageKey, JSON.stringify(dismissed)); } catch {}
+            this.renderPreviews();
+        }
+
+        renderPreviews () {
+            let data = this.previewData;
+            const invitation = this.campaignData;
+            if (invitation && this.unreadCount === 0 && data) {
+                const snapshot = invitation.snapshot;
+                data = { ...data, identity: 'campaign', config: { desktop: true, mobile: true, auto_hide_seconds: 0 }, previews: [{
+                    key: invitation.id, campaign: true, name: snapshot.sender, avatar: snapshot.avatar,
+                    text: snapshot.message.slice(0, 240),
+                }] };
+            }
+            const enabled = data?.config?.[this.isMobile ? 'mobile' : 'desktop'];
+            if (!data || !enabled || this.isChatVisible || this.hideLauncher) {
+                this.previewHost?.remove();
+                this.previewHost = null;
+                this.previewSignature = '';
+                return;
+            }
+            const storageKey = `libredesk-previews-${this.config.inboxID}-${data.identity || 'visitor'}`;
+            let dismissed = this.dismissedPreviews || [];
+            try { dismissed = JSON.parse(localStorage.getItem(storageKey) || '[]'); } catch {}
+            const previews = data.previews.filter(item => !dismissed.includes(item.key)).slice(0, 3);
+            const signature = JSON.stringify([previews, data.theme, data.labels, this.isMobile]);
+            if (signature === this.previewSignature) return;
+            this.previewSignature = signature;
+            this.previewHost?.remove();
+            this.previewHost = null;
+            if (!previews.length) return;
+            const host = document.createElement('div');
+            const side = this.widgetSettings.launcher.position === 'left' ? 'left' : 'right';
+            const spacing = this.widgetSettings.launcher.spacing;
+            Object.assign(host.style, { position: 'fixed', zIndex: '9998', bottom: `${spacing.bottom + (this.isMobile ? this.MOBILE_LAUNCHER_SIZE : this.LAUNCHER_SIZE) + 12}px`, [side]: `${spacing.side}px`, width: `min(320px, calc(100vw - ${spacing.side * 2}px))` });
+            const root = host.attachShadow({ mode: 'open' });
+            const style = document.createElement('style');
+            style.textContent = ':host{font:14px/1.5 system-ui}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline:2px solid;outline-offset:2px}.stack{display:flex;flex-direction:column;gap:8px}.card{display:flex;align-items:flex-start;border:1px solid;border-radius:12px;overflow:hidden}.open{display:flex;gap:10px;align-items:flex-start;flex:1;min-width:0;padding:12px;text-align:left;border:0;background:transparent}.name{font-weight:600;display:block}.text{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.avatar{width:28px;height:28px;border-radius:50%;object-fit:cover}.image{max-width:64px;max-height:48px;object-fit:cover}.close{padding:8px;min-height:44px;min-width:44px;border:0;background:transparent}.all{align-self:flex-end;border:1px solid;border-radius:6px;padding:4px 8px}';
+            root.append(style);
+            const stack = document.createElement('div');
+            stack.className = 'stack';
+            const notice = document.createElement('span');
+            notice.setAttribute('role', 'status');
+            notice.style.cssText = 'position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)';
+            notice.textContent = previews[0].text;
+            stack.append(notice);
+            const safeImage = (src, className) => {
+                if (!src) return null;
+                let url;
+                try { url = new URL(src, this.config.baseURL); } catch { return null; }
+                if (!['https:', 'http:'].includes(url.protocol)) return null;
+                const img = document.createElement('img');
+                img.src = url.href;
+                img.alt = '';
+                img.className = className;
+                return img;
+            };
+            for (const item of previews) {
+                const card = document.createElement('div');
+                card.className = 'card';
+                Object.assign(card.style, { background: data.theme.background, color: data.theme.foreground, borderColor: data.theme.border });
+                const open = document.createElement('button');
+                open.type = 'button';
+                open.className = 'open';
+                open.setAttribute('aria-label', `${data.labels.open}: ${item.name}. ${item.text}`);
+                open.addEventListener('click', () => {
+                    if (item.campaign) {
+                        this.postToIframe({ type: 'CAMPAIGN_EVENT', event: 'opened', id: item.key });
+                        this.campaignData = null;
+                    } else this.postToIframe({ type: 'OPEN_CONVERSATION', uuid: item.conversation });
+                    this.showChat();
+                });
+                const avatar = safeImage(item.avatar, 'avatar');
+                if (avatar) open.append(avatar);
+                const body = document.createElement('span');
+                const name = document.createElement('span');
+                name.className = 'name';
+                name.textContent = item.name;
+                const content = document.createElement('span');
+                content.className = 'text';
+                content.textContent = item.text;
+                body.append(name, content);
+                const image = safeImage(item.image, 'image');
+                if (image) body.append(image);
+                open.append(body);
+                const close = document.createElement('button');
+                close.type = 'button';
+                close.className = 'close';
+                close.textContent = '×';
+                close.setAttribute('aria-label', data.labels.dismiss);
+                close.addEventListener('click', () => { this.dismissPreview(item.key); this.toggleButton.focus(); });
+                card.append(open, close);
+                stack.append(card);
+                if (data.config.auto_hide_seconds > 0 && !this.previewTimers.has(item.key)) {
+                    this.previewTimers.set(item.key, setTimeout(() => this.dismissPreview(item.key), data.config.auto_hide_seconds * 1000));
+                }
+            }
+            if (previews.length > 1) {
+                const all = document.createElement('button');
+                all.type = 'button';
+                all.className = 'all';
+                all.textContent = data.labels.dismissAll;
+                Object.assign(all.style, { background: data.theme.background, color: data.theme.foreground, borderColor: data.theme.border });
+                all.addEventListener('click', () => { for (const item of previews) this.dismissPreview(item.key); this.toggleButton.focus(); });
+                stack.append(all);
+            }
+            root.append(stack);
+            document.body.append(host);
+            this.previewHost = host;
+        }
+
+        startCampaignTracking () {
+            if (this.campaignInterval) return;
+            let last = performance.now();
+            let elapsed = 0;
+            // Back off while nothing matches so a long visit doesn't poll the server every few seconds.
+            let gap = this.CAMPAIGN_POLL_MIN;
+            this.campaignInterval = setInterval(() => {
+                const now = performance.now();
+                const delta = Math.min((now - last) / 1000, 2);
+                last = now;
+                if (location.href !== this.campaignURL) {
+                    this.campaignURL = location.href;
+                    this.campaignActiveSeconds = 0;
+                    this.campaignEvent = '';
+                    elapsed = 0;
+                    gap = this.CAMPAIGN_POLL_MIN;
+                }
+                if (document.hidden || this.isChatVisible || this.hideLauncher) return;
+                this.campaignActiveSeconds += delta;
+                elapsed += delta;
+                if (elapsed < gap || this.unreadCount > 0 || this.campaignData) return;
+                elapsed = 0;
+                gap = Math.min(gap * 2, this.CAMPAIGN_POLL_MAX);
+                this.postToIframe({ type: 'CAMPAIGN_CONTEXT', context: { url: location.href, mobile: this.isMobile, active_seconds: Math.floor(this.campaignActiveSeconds), event: this.campaignEvent } });
+            }, 1000);
+        }
+
+        trackEvent (name) {
+            if (typeof name === 'string' && name.length <= 128) this.campaignEvent = name;
+        }
+
         setUser (jwt) {
+            this.clearPreviews();
             this.postToIframe({ type: 'SET_JWT_TOKEN', jwt: jwt });
         }
 
         logout () {
+            this.clearPreviews();
             this.deleteCookie(this.getCookieName('session'));
             this.deleteCookie(this.getCookieName('visitor'));
-            this.postToIframe({ type: 'CLEAR_SESSION' });
+            this.campaignBrowserKey = this.randomKey();
+            this.setCookie(this.getCookieName('campaign'), this.campaignBrowserKey);
+            this.postToIframe({ type: 'CLEAR_SESSION', campaignBrowserKey: this.campaignBrowserKey });
         }
 
         destroy () {
+            this.clearPreviews();
+            clearInterval(this.campaignInterval);
             this.stopPageTracking();
             window.removeEventListener('message', this._boundHandleMessage);
             window.removeEventListener('resize', this._boundHandleResize);

From 635ce63b78cf97144fab89aef29aed0fc0bba70e Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 16 Sep 2026 12:39:05 +0530
Subject: [PATCH 065/178] fix browser notification persistence

---
 frontend/apps/main/index.html                               | 2 +-
 .../account/notifications/NotificationPreferences.test.js   | 6 +++---
 .../views/account/notifications/NotificationPreferences.vue | 1 +
 3 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/frontend/apps/main/index.html b/frontend/apps/main/index.html
index f4f773c6..63340480 100644
--- a/frontend/apps/main/index.html
+++ b/frontend/apps/main/index.html
@@ -6,7 +6,7 @@
   <meta name="robots" content="noindex, nofollow" />
   <meta name="viewport" content="width=device-width, initial-scale=1, interactive-widget=resizes-content" />
   <meta name="theme-color" content="hsl(152 39% 30%)" />
-  <link rel="manifest" href="/manifest.webmanifest" />
+  <link rel="manifest" href="/manifest.webmanifest" crossorigin="use-credentials" />
   <link rel="apple-touch-icon" href="/images/pwa-icon-192.png" />
   <link rel="preload" href="/static/public/static/fonts/Geist-Variable.woff2" as="font" type="font/woff2" crossorigin>
   <link rel="stylesheet" href="/static/public/static/fonts.css">
diff --git a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js
index 80a42143..993c69d8 100644
--- a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js
+++ b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js
@@ -62,6 +62,7 @@ const mount = async (vapidPublicKey = 'test-key') => {
       data: {
         email_enabled: true,
         vapid_public_key: vapidPublicKey,
+        push_endpoints: ['https://push.example/subscription'],
         preferences: [
           { notification_type: 'new_reply', channel: 'email', enabled: true },
           { notification_type: 'new_reply', channel: 'in_app', enabled: false }
@@ -119,10 +120,9 @@ describe('notification preferences', () => {
     expect(email.disabled).toBe(false)
   })
 
-  it('leaves the push subscription to the app shell', async () => {
+  it('restores this browser push state from the saved endpoints', async () => {
     await mount()
-    expect(root.textContent).toContain('notification.type.newReply')
-    expect(refresh).not.toHaveBeenCalled()
+    expect(refresh).toHaveBeenCalledWith('test-key', ['https://push.example/subscription'])
   })
 
   it('disables browser notifications when push is unavailable', async () => {
diff --git a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
index 057a2f5c..313e293d 100644
--- a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
+++ b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
@@ -120,6 +120,7 @@ const fetchPreferences = async () => {
     const { data } = await api.getNotificationPreferences()
     emailEnabled.value = data.data.email_enabled
     vapidPublicKey.value = data.data.vapid_public_key
+    await pushNotifications.refresh(vapidPublicKey.value, data.data.push_endpoints)
     const byType = {}
     for (const pref of data.data.preferences) {
       byType[pref.notification_type] ??= { type: pref.notification_type }

From f600e7e9b78d5bf9a1a5f0a8084553c1a6020eaa Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 16 Sep 2026 13:01:35 +0530
Subject: [PATCH 066/178] add filters, pagination and richer results to
 conversation search

---
 cmd/init.go                                   |  11 +-
 cmd/main.go                                   |   2 +-
 cmd/search.go                                 |  50 +++--
 .../editor/conversationReference.js           |   4 +-
 .../editor/conversationReference.test.js      |  26 +--
 .../command/providers/useEntitySearch.js      |   4 +-
 .../src/features/search/HighlightedText.vue   |  20 ++
 .../src/features/search/SearchFilters.vue     | 111 +++++++++++
 .../src/features/search/SearchResultItem.vue  | 116 ++++++++++++
 .../src/features/search/SearchResults.vue     | 173 ++++--------------
 .../main/src/features/search/highlight.js     |  17 ++
 .../src/features/search/highlight.test.js     |  18 ++
 .../main/src/features/search/searchFilters.js |  68 +++++++
 .../src/features/search/searchFilters.test.js |  59 ++++++
 .../apps/main/src/views/search/SearchView.vue | 159 ++++++++++------
 i18n/en-US.json                               |   4 +-
 internal/conversation/conversation.go         |  12 +-
 internal/conversation/sidebar_counts.go       |   4 +-
 internal/conversation/sidebar_counts_test.go  |   2 +-
 internal/search/models/models.go              |  75 ++++++--
 internal/search/queries.sql                   | 116 ++++++++----
 internal/search/search.go                     | 116 ++++++++----
 22 files changed, 843 insertions(+), 324 deletions(-)
 create mode 100644 frontend/apps/main/src/features/search/HighlightedText.vue
 create mode 100644 frontend/apps/main/src/features/search/SearchFilters.vue
 create mode 100644 frontend/apps/main/src/features/search/SearchResultItem.vue
 create mode 100644 frontend/apps/main/src/features/search/highlight.js
 create mode 100644 frontend/apps/main/src/features/search/highlight.test.js
 create mode 100644 frontend/apps/main/src/features/search/searchFilters.js
 create mode 100644 frontend/apps/main/src/features/search/searchFilters.test.js

diff --git a/cmd/init.go b/cmd/init.go
index 9a91ce96..d3f59932 100644
--- a/cmd/init.go
+++ b/cmd/init.go
@@ -1060,12 +1060,15 @@ func initAIAgent(db *sqlx.DB, i18n *i18n.I18n, aiManager *ai.Manager, convo *con
 }
 
 // initSearch inits search manager.
-func initSearch(db *sqlx.DB, i18n *i18n.I18n) *search.Manager {
+func initSearch(db *sqlx.DB, i18n *i18n.I18n, convo *conversation.Manager) *search.Manager {
 	lo := initLogger("search")
 	m, err := search.New(search.Opts{
-		DB:   db,
-		Lo:   lo,
-		I18n: i18n,
+		DB:              db,
+		Lo:              lo,
+		I18n:            i18n,
+		FilterFields:    conversation.ListFilterAllowedFields,
+		FilterRenderers: conversation.ListFilterRenderers,
+		FilterLocation:  convo.FilterLocation,
 	})
 	if err != nil {
 		log.Fatalf("error initializing search manager: %v", err)
diff --git a/cmd/main.go b/cmd/main.go
index 41db7ef6..04778478 100644
--- a/cmd/main.go
+++ b/cmd/main.go
@@ -315,7 +315,7 @@ func main() {
 		authz:            initAuthz(i18n),
 		view:             initView(db, i18n),
 		report:           initReport(db, i18n),
-		search:           initSearch(db, i18n),
+		search:           initSearch(db, i18n, conversation),
 		role:             initRole(db, i18n),
 		tag:              initTag(db, i18n),
 		macro:            initMacro(db, i18n),
diff --git a/cmd/search.go b/cmd/search.go
index cf2d2854..cc63cd0d 100644
--- a/cmd/search.go
+++ b/cmd/search.go
@@ -15,12 +15,10 @@ import (
 const (
 	minSearchQueryLength = 3
 
-	maxConversationSearchLimit = 1000
-	maxMessageSearchLimit      = 30
-	maxContactSearchLimit      = 15
+	maxContactSearchLimit = 15
 )
 
-// handleSearchConversations searches conversations based on the query.
+// handleSearchConversations searches conversations by term with optional list filters, paginated.
 func handleSearchConversations(r *fastglue.Request) error {
 	app, user, q, err := searchInputs(r)
 	if err != nil {
@@ -30,14 +28,14 @@ func handleSearchConversations(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	results, err := app.search.Conversations(q, scope, searchLimit(r, maxConversationSearchLimit))
+	results, total, err := app.search.Conversations(q, scope)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(results)
+	return r.SendEnvelope(pageResults(results, total, q))
 }
 
-// handleSearchMessages searches messages based on the query.
+// handleSearchMessages searches messages by term with optional list filters, paginated.
 func handleSearchMessages(r *fastglue.Request) error {
 	app, user, q, err := searchInputs(r)
 	if err != nil {
@@ -47,11 +45,11 @@ func handleSearchMessages(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	results, err := app.search.Messages(q, scope, searchLimit(r, maxMessageSearchLimit))
+	results, total, err := app.search.Messages(q, scope)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(results)
+	return r.SendEnvelope(pageResults(results, total, q))
 }
 
 // handleSearchContacts searches contacts based on the query.
@@ -60,29 +58,41 @@ func handleSearchContacts(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	results, err := app.search.Contacts(q, searchLimit(r, maxContactSearchLimit))
+	limit, err := strconv.Atoi(string(r.RequestCtx.QueryArgs().Peek("limit")))
+	if err != nil || limit < 1 || limit > maxContactSearchLimit {
+		limit = maxContactSearchLimit
+	}
+	results, err := app.search.Contacts(q.Term, limit)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 	return r.SendEnvelope(results)
 }
 
-func searchInputs(r *fastglue.Request) (*App, amodels.User, string, error) {
+func searchInputs(r *fastglue.Request) (*App, amodels.User, smodels.Query, error) {
 	app := r.Context.(*App)
 	user, _ := r.RequestCtx.UserValue("user").(amodels.User)
-	q := string(r.RequestCtx.QueryArgs().Peek("query"))
-	if len(q) < minSearchQueryLength {
-		return app, user, "", envelope.NewError(envelope.InputError, app.i18n.Ts("search.minQueryLength", "length", fmt.Sprintf("%d", minSearchQueryLength)), nil)
+	term := string(r.RequestCtx.QueryArgs().Peek("query"))
+	if len(term) < minSearchQueryLength {
+		return app, user, smodels.Query{}, envelope.NewError(envelope.InputError, app.i18n.Ts("search.minQueryLength", "length", fmt.Sprintf("%d", minSearchQueryLength)), nil)
 	}
-	return app, user, q, nil
+	page, pageSize := getPagination(r)
+	return app, user, smodels.Query{
+		Term:     term,
+		Filters:  string(r.RequestCtx.QueryArgs().Peek("filters")),
+		Page:     page,
+		PageSize: pageSize,
+	}, nil
 }
 
-func searchLimit(r *fastglue.Request, max int) int {
-	limit, err := strconv.Atoi(string(r.RequestCtx.QueryArgs().Peek("limit")))
-	if err != nil || limit < 1 || limit > max {
-		return max
+func pageResults(results any, total int, q smodels.Query) envelope.PageResults {
+	return envelope.PageResults{
+		Results:    results,
+		Total:      total,
+		PerPage:    q.PageSize,
+		TotalPages: (total + q.PageSize - 1) / q.PageSize,
+		Page:       q.Page,
 	}
-	return limit
 }
 
 func readScope(app *App, agentID int) (smodels.ReadScope, error) {
diff --git a/frontend/apps/main/src/components/editor/conversationReference.js b/frontend/apps/main/src/components/editor/conversationReference.js
index e0bd80b5..8002090d 100644
--- a/frontend/apps/main/src/components/editor/conversationReference.js
+++ b/frontend/apps/main/src/components/editor/conversationReference.js
@@ -17,8 +17,8 @@ export const getConversationSuggestions = async (query, search = api.searchConve
   const reference = query.trim()
   if (reference.length < MIN_REFERENCE_QUERY_LENGTH) return []
 
-  const response = await search({ query: reference })
-  return (response.data?.data || []).slice(0, SUGGESTION_LIMIT).map((conversation) => ({
+  const response = await search({ query: reference, page_size: SUGGESTION_LIMIT })
+  return (response.data?.data?.results || []).map((conversation) => ({
     id: conversation.uuid,
     label: conversation.reference_number,
     subject: conversation.subject,
diff --git a/frontend/apps/main/src/components/editor/conversationReference.test.js b/frontend/apps/main/src/components/editor/conversationReference.test.js
index e3f5744c..94ddebcc 100644
--- a/frontend/apps/main/src/components/editor/conversationReference.test.js
+++ b/frontend/apps/main/src/components/editor/conversationReference.test.js
@@ -13,14 +13,16 @@ describe('conversation reference suggestions', () => {
   it('maps a conversation result to a suggestion', async () => {
     const search = vi.fn().mockResolvedValue({
       data: {
-        data: [
-          {
-            uuid: 'conversation-uuid',
-            reference_number: '108',
-            subject: 'Payment failed',
-            status: 'Open'
-          }
-        ]
+        data: {
+          results: [
+            {
+              uuid: 'conversation-uuid',
+              reference_number: '108',
+              subject: 'Payment failed',
+              status: 'Open'
+            }
+          ]
+        }
       }
     })
     await expect(getConversationSuggestions('108', search)).resolves.toEqual([
@@ -28,10 +30,10 @@ describe('conversation reference suggestions', () => {
     ])
   })
 
-  it('caps the suggestion list', async () => {
-    const rows = Array.from({ length: 30 }, (_, i) => ({ uuid: `u${i}`, reference_number: `${i}` }))
-    const search = vi.fn().mockResolvedValue({ data: { data: rows } })
-    await expect(getConversationSuggestions('108', search)).resolves.toHaveLength(10)
+  it('asks the server for a capped page', async () => {
+    const search = vi.fn().mockResolvedValue({ data: { data: { results: [] } } })
+    await getConversationSuggestions('108', search)
+    expect(search).toHaveBeenCalledWith({ query: '108', page_size: 10 })
   })
 
   it('discards a response superseded by a newer query', async () => {
diff --git a/frontend/apps/main/src/features/command/providers/useEntitySearch.js b/frontend/apps/main/src/features/command/providers/useEntitySearch.js
index bea1bd10..129f2afc 100644
--- a/frontend/apps/main/src/features/command/providers/useEntitySearch.js
+++ b/frontend/apps/main/src/features/command/providers/useEntitySearch.js
@@ -31,8 +31,8 @@ export function useEntitySearch() {
   }
 
   const searchConversations = async (term) => {
-    const response = await api.searchConversations({ query: term, limit: RESULT_LIMIT })
-    return (response.data.data || []).map((conversation) => ({
+    const response = await api.searchConversations({ query: term, page_size: RESULT_LIMIT })
+    return (response.data.data?.results || []).map((conversation) => ({
       id: `search.conversation.${conversation.uuid}`,
       label: conversation.subject || `#${conversation.reference_number}`,
       hint: `#${conversation.reference_number} · ${conversation.status}`,
diff --git a/frontend/apps/main/src/features/search/HighlightedText.vue b/frontend/apps/main/src/features/search/HighlightedText.vue
new file mode 100644
index 00000000..c1534613
--- /dev/null
+++ b/frontend/apps/main/src/features/search/HighlightedText.vue
@@ -0,0 +1,20 @@
+<template>
+  <span>
+    <template v-for="(part, index) in parts" :key="index">
+      <mark v-if="part.match" class="bg-warning/30 text-foreground rounded-sm px-0.5">{{ part.text }}</mark>
+      <template v-else>{{ part.text }}</template>
+    </template>
+  </span>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import { splitHighlight } from './highlight'
+
+const props = defineProps({
+  text: { type: String, default: '' },
+  term: { type: String, default: '' }
+})
+
+const parts = computed(() => splitHighlight(props.text, props.term))
+</script>
diff --git a/frontend/apps/main/src/features/search/SearchFilters.vue b/frontend/apps/main/src/features/search/SearchFilters.vue
new file mode 100644
index 00000000..35edf728
--- /dev/null
+++ b/frontend/apps/main/src/features/search/SearchFilters.vue
@@ -0,0 +1,111 @@
+<template>
+  <div class="flex flex-wrap items-center gap-2 px-4 py-2 border-b">
+    <div class="w-40">
+      <SelectComboBox
+        :model-value="filters.status"
+        :items="conversationStore.statusOptions"
+        :placeholder="t('globals.terms.status')"
+        align="start"
+        @update:model-value="set('status', $event)"
+      />
+    </div>
+    <div class="w-40">
+      <SelectComboBox
+        :model-value="filters.priority"
+        :items="conversationStore.priorityOptions"
+        :placeholder="t('globals.terms.priority')"
+        align="start"
+        @update:model-value="set('priority', $event)"
+      />
+    </div>
+    <div class="w-44">
+      <SelectComboBox
+        :model-value="filters.inbox"
+        :items="inboxStore.options"
+        :placeholder="t('globals.terms.inbox')"
+        align="start"
+        @update:model-value="set('inbox', $event)"
+      />
+    </div>
+    <div class="w-44">
+      <SelectAgentCombobox
+        :model-value="filters.assignee"
+        :placeholder="t('globals.terms.assignee')"
+        :prepend-items="unassignedItem"
+        align="start"
+        @update:model-value="set('assignee', $event)"
+      />
+    </div>
+    <div class="w-44">
+      <SelectTeamCombobox
+        :model-value="filters.team"
+        :placeholder="t('globals.terms.team')"
+        :prepend-items="unassignedItem"
+        align="start"
+        @update:model-value="set('team', $event)"
+      />
+    </div>
+    <div class="min-w-44 max-w-96">
+      <SelectTagCombobox
+        :model-value="filters.tags"
+        :placeholder="t('globals.terms.tag', 2)"
+        value-field="id"
+        multiple
+        @update:model-value="set('tags', $event)"
+      />
+    </div>
+    <div class="w-60">
+      <DateFilterValue
+        :model-value="filters.created"
+        range
+        @update:model-value="set('created', $event)"
+      />
+    </div>
+    <Button
+      v-if="hasActiveFilters(filters)"
+      type="button"
+      variant="ghost"
+      size="sm"
+      @click="emit('update:filters', emptyFilters())"
+    >
+      <X class="w-4 h-4 mr-1" />
+      {{ t('search.clearFilters') }}
+    </Button>
+  </div>
+</template>
+
+<script setup>
+import { computed, onMounted } from 'vue'
+import { X } from 'lucide-vue-next'
+import { useI18n } from 'vue-i18n'
+import { Button } from '@shared-ui/components/ui/button'
+import SelectComboBox from '@main/components/combobox/SelectCombobox.vue'
+import SelectAgentCombobox from '@main/components/combobox/SelectAgentCombobox.vue'
+import SelectTeamCombobox from '@main/components/combobox/SelectTeamCombobox.vue'
+import SelectTagCombobox from '@main/components/combobox/SelectTagCombobox.vue'
+import DateFilterValue from '@main/components/filter/DateFilterValue.vue'
+import { useConversationStore } from '@main/stores/conversation'
+import { useInboxStore } from '@main/stores/inbox'
+import { emptyFilters, hasActiveFilters, UNASSIGNED } from './searchFilters'
+
+const props = defineProps({
+  filters: { type: Object, required: true }
+})
+const emit = defineEmits(['update:filters'])
+
+const { t } = useI18n()
+const conversationStore = useConversationStore()
+const inboxStore = useInboxStore()
+
+const unassignedItem = computed(() => [{ value: UNASSIGNED, label: t('globals.terms.unassigned') }])
+
+const set = (key, value) => {
+  emit('update:filters', { ...props.filters, [key]: value ?? (key === 'tags' ? [] : '') })
+}
+
+onMounted(() => {
+  conversationStore.fetchStatuses()
+  conversationStore.fetchPriorities()
+  inboxStore.fetchInboxes()
+})
+</script>
diff --git a/frontend/apps/main/src/features/search/SearchResultItem.vue b/frontend/apps/main/src/features/search/SearchResultItem.vue
new file mode 100644
index 00000000..96d1f9cb
--- /dev/null
+++ b/frontend/apps/main/src/features/search/SearchResultItem.vue
@@ -0,0 +1,116 @@
+<template>
+  <router-link
+    :to="{ name: 'inbox-conversation', params: { uuid: conversationUUID, type: 'assigned' } }"
+    class="grid grid-cols-[auto_minmax(0,1fr)_auto] gap-3 px-4 py-3 hover:bg-accent/40 transition-colors"
+  >
+    <Avatar class="w-9 h-9 rounded-full mt-0.5">
+      <AvatarImage :src="item.contact.avatar_url || ''" class="object-cover" />
+      <AvatarFallback>{{ initials(item.contact.first_name) }}</AvatarFallback>
+    </Avatar>
+
+    <div class="min-w-0 space-y-1">
+      <div class="flex items-baseline gap-2 text-sm min-w-0">
+        <span class="font-medium text-foreground truncate">
+          <HighlightedText :text="contactName" :term="term" />
+        </span>
+        <span v-if="item.contact.email" class="text-muted-foreground truncate">
+          <HighlightedText :text="item.contact.email" :term="term" />
+        </span>
+      </div>
+
+      <p class="text-sm truncate" :class="subject ? 'text-foreground font-medium' : 'text-muted-foreground italic'">
+        <HighlightedText v-if="subject" :text="subject" :term="term" />
+        <template v-else>{{ t('globals.terms.noSubject') }}</template>
+      </p>
+
+      <p v-if="snippet" class="text-sm text-muted-foreground line-clamp-2 break-words">
+        <template v-if="!isConversation">
+          <span class="text-foreground">{{ senderName }}</span>
+          <Badge v-if="item.private" variant="secondary" class="mx-1.5 text-xs font-normal">
+            {{ t('globals.terms.privateNote') }}
+          </Badge>
+          <Badge v-else-if="item.type === 'outgoing'" variant="outline" class="mx-1.5 text-xs font-normal">
+            {{ t('globals.terms.reply') }}
+          </Badge>
+          <span v-else>: </span>
+        </template>
+        <HighlightedText :text="snippet" :term="term" />
+      </p>
+
+      <div class="flex flex-wrap items-center gap-x-3 gap-y-1 text-xs text-muted-foreground pt-0.5">
+        <span class="tabular-nums">#{{ referenceNumber }}</span>
+        <span v-if="item.inbox_name" class="inline-flex items-center gap-1 min-w-0">
+          <component :is="item.inbox_channel === 'livechat' ? MessageSquare : Mail" class="w-3.5 h-3.5 shrink-0" aria-hidden="true" />
+          <span class="truncate">{{ item.inbox_name }}</span>
+        </span>
+        <span class="inline-flex items-center gap-1 min-w-0">
+          <UserRound class="w-3.5 h-3.5 shrink-0" aria-hidden="true" />
+          <span class="truncate">{{ assigneeName || t('globals.terms.unassigned') }}</span>
+        </span>
+        <span v-if="item.team_name" class="inline-flex items-center gap-1 min-w-0">
+          <UsersRound class="w-3.5 h-3.5 shrink-0" aria-hidden="true" />
+          <span class="truncate">{{ item.team_name }}</span>
+        </span>
+        <span v-if="item.tags?.length" class="inline-flex items-center gap-1 flex-wrap">
+          <Tag class="w-3.5 h-3.5 shrink-0" aria-hidden="true" />
+          <span v-for="tag in item.tags" :key="tag" class="rounded-md bg-secondary px-1.5 py-0.5 text-secondary-foreground">
+            {{ tag }}
+          </span>
+        </span>
+      </div>
+    </div>
+
+    <div class="flex flex-col items-end gap-1.5 shrink-0">
+      <time
+        :datetime="timestamp"
+        :title="format(new Date(timestamp), 'MMM d, yyyy HH:mm')"
+        class="text-xs text-muted-foreground whitespace-nowrap tabular-nums"
+      >
+        {{ getRelativeTime(timestamp) }}
+      </time>
+      <Badge v-if="status" variant="outline" class="text-xs font-normal">{{ status }}</Badge>
+      <span v-if="item.priority" class="inline-flex items-center gap-1 text-xs text-muted-foreground">
+        <PriorityMarker :priority="item.priority" />
+        {{ item.priority }}
+      </span>
+    </div>
+  </router-link>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import { format } from 'date-fns'
+import { Mail, MessageSquare, Tag, UserRound, UsersRound } from 'lucide-vue-next'
+import { useI18n } from 'vue-i18n'
+import { Avatar, AvatarFallback, AvatarImage } from '@shared-ui/components/ui/avatar'
+import { Badge } from '@shared-ui/components/ui/badge'
+import { getRelativeTime } from '@shared-ui/utils/datetime.js'
+import PriorityMarker from '@main/features/conversation/PriorityMarker.vue'
+import HighlightedText from './HighlightedText.vue'
+
+const props = defineProps({
+  item: { type: Object, required: true },
+  type: { type: String, required: true },
+  term: { type: String, default: '' }
+})
+
+const { t } = useI18n()
+
+const fullName = (person) => [person?.first_name, person?.last_name].filter(Boolean).join(' ')
+const initials = (name) => (name || '?').substring(0, 2).toUpperCase()
+
+const isConversation = computed(() => props.type === 'conversations')
+const conversationUUID = computed(() => (isConversation.value ? props.item.uuid : props.item.conversation_uuid))
+const referenceNumber = computed(() =>
+  isConversation.value ? props.item.reference_number : props.item.conversation_reference_number
+)
+const status = computed(() => (isConversation.value ? props.item.status : props.item.conversation_status))
+const subject = computed(() => (isConversation.value ? props.item.subject : props.item.conversation_subject) || '')
+const snippet = computed(() => (isConversation.value ? props.item.last_message : props.item.snippet) || '')
+const timestamp = computed(() =>
+  isConversation.value ? props.item.last_message_at || props.item.created_at : props.item.created_at
+)
+const contactName = computed(() => fullName(props.item.contact))
+const senderName = computed(() => fullName(props.item.sender) || contactName.value)
+const assigneeName = computed(() => fullName(props.item.assignee))
+</script>
diff --git a/frontend/apps/main/src/features/search/SearchResults.vue b/frontend/apps/main/src/features/search/SearchResults.vue
index 1a0ebd28..1b2dab68 100644
--- a/frontend/apps/main/src/features/search/SearchResults.vue
+++ b/frontend/apps/main/src/features/search/SearchResults.vue
@@ -1,158 +1,59 @@
 <template>
-  <div class="max-w-5xl mx-auto p-6 min-h-screen">
-    <Tabs :default-value="defaultTab" v-model="activeTab">
-      <TabsList class="grid w-full mb-6" :class="tabsGridClass">
-        <TabsTrigger v-for="(items, type) in results" :key="type" :value="type">
-          {{ $t(tabLabelKeys[type], 2) }} ({{ items.length }})
+  <div class="max-w-5xl mx-auto px-4 py-4">
+    <Tabs :model-value="activeTab" @update:model-value="emit('update:activeTab', $event)">
+      <TabsList class="grid w-full grid-cols-2 mb-4">
+        <TabsTrigger v-for="type in TYPES" :key="type" :value="type">
+          {{ t(tabLabelKeys[type], 2) }} ({{ results[type].total }})
         </TabsTrigger>
       </TabsList>
 
-      <TabsContent v-for="(items, type) in results" :key="type" :value="type" class="mt-0">
+      <TabsContent v-for="type in TYPES" :key="type" :value="type" class="mt-0">
         <div class="bg-background rounded-md border overflow-hidden">
-          <!-- No results message -->
-          <div v-if="items.length === 0" class="p-8 text-center text-muted-foreground">
-            <div class="text-lg font-medium mb-2">
-              {{ $t('globals.messages.noResultsFound') }}
-            </div>
-            <div class="text-sm">{{ $t('search.adjustSearchTerms') }}</div>
+          <div v-if="results[type].results.length === 0" class="p-8 text-center text-muted-foreground">
+            <div class="text-lg font-medium mb-2">{{ t('globals.messages.noResultsFound') }}</div>
+            <div class="text-sm">{{ t('search.adjustSearchTerms') }}</div>
           </div>
-
-          <!-- Results list -->
           <div v-else class="divide-y divide-border">
-            <div
-              v-for="item in items"
-              :key="item.id || item.uuid"
-              class="p-6 hover:bg-accent/50 transition duration-200 ease-in-out group"
-            >
-              <router-link
-                :to="{
-                  name: 'inbox-conversation',
-                  params: {
-                    uuid: type === 'conversations' ? item.uuid : item.conversation_uuid,
-                    type: 'assigned'
-                  }
-                }"
-                class="block"
-              >
-                <div class="flex justify-between items-start">
-                  <div class="flex-grow">
-                    <!-- Reference number and status -->
-                    <div
-                      class="text-sm font-semibold mb-2 text-muted-foreground group-hover:text-primary transition duration-200 flex items-center gap-2"
-                    >
-                      <span>
-                        #{{
-                          type === 'conversations'
-                            ? item.reference_number
-                            : item.conversation_reference_number
-                        }}
-                      </span>
-                      <Badge variant="outline" class="text-xs font-medium">
-                        {{
-                          type === 'conversations'
-                            ? item.status
-                            : item.conversation_status
-                        }}
-                      </Badge>
-                    </div>
-
-                    <!-- Content -->
-                    <div
-                      class="text-foreground font-medium mb-2 text-lg group-hover:text-primary transition duration-200"
-                    >
-                      {{
-                        truncateText(
-                          type === 'conversations' ? item.subject : item.text_content,
-                          100
-                        )
-                      }}
-                    </div>
-
-                    <!-- Timestamp -->
-                    <div class="text-sm text-muted-foreground flex items-center">
-                      <ClockIcon class="h-4 w-4 mr-1" />
-                      {{
-                        formatDate(
-                          type === 'conversations' ? item.created_at : item.conversation_created_at
-                        )
-                      }}
-                    </div>
-                  </div>
-
-                  <!-- Right arrow icon -->
-                  <div
-                    class="bg-secondary rounded-full p-2 group-hover:bg-primary transition duration-200"
-                  >
-                    <ChevronRightIcon
-                      class="h-5 w-5 text-secondary-foreground group-hover:text-primary-foreground"
-                      aria-hidden="true"
-                    />
-                  </div>
-                </div>
-              </router-link>
-            </div>
+            <SearchResultItem
+              v-for="item in results[type].results"
+              :key="item.uuid"
+              :item="item"
+              :type="type"
+              :term="term"
+            />
           </div>
         </div>
+        <PaginationBar
+          v-if="results[type].total_pages > 1"
+          :page="results[type].page"
+          :per-page="results[type].per_page"
+          :total-pages="results[type].total_pages"
+          @update:page="emit('changePage', { type, page: $event })"
+          @update:per-page="emit('changePerPage', { type, perPage: $event })"
+        />
       </TabsContent>
     </Tabs>
   </div>
 </template>
-<script setup>
-import { computed, ref, watch } from 'vue'
-import { ChevronRightIcon, ClockIcon } from 'lucide-vue-next'
-import { format, parseISO } from 'date-fns'
-import { Tabs, TabsContent, TabsList, TabsTrigger } from '@shared-ui/components/ui/tabs'
-import { Badge } from '@shared-ui/components/ui/badge'
 
+<script setup>
+import { useI18n } from 'vue-i18n'
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@shared-ui/components/ui/tabs'
+import PaginationBar from '@main/components/pagination/PaginationBar.vue'
+import SearchResultItem from './SearchResultItem.vue'
+
+const TYPES = ['conversations', 'messages']
 const tabLabelKeys = {
   conversations: 'globals.terms.conversation',
   messages: 'globals.terms.message'
 }
 
-const props = defineProps({
-  results: {
-    type: Object,
-    required: true
-  }
+defineProps({
+  results: { type: Object, required: true },
+  term: { type: String, default: '' },
+  activeTab: { type: String, required: true }
 })
+const emit = defineEmits(['update:activeTab', 'changePage', 'changePerPage'])
 
-// Get the first available tab as default
-const defaultTab = computed(() => {
-  const types = Object.keys(props.results)
-  return types.length > 0 ? types[0] : ''
-})
-
-const activeTab = ref('')
-
-// Watch for changes in results and set the first tab as active
-watch(
-  () => props.results,
-  (newResults) => {
-    const types = Object.keys(newResults)
-    if (types.length > 0 && !activeTab.value) {
-      activeTab.value = types[0]
-    }
-  },
-  { immediate: true }
-)
-
-// Dynamic grid class based on number of tabs
-const tabsGridClass = computed(() => {
-  const tabCount = Object.keys(props.results).length
-  if (tabCount <= 2) return 'grid-cols-2'
-  if (tabCount <= 3) return 'grid-cols-3'
-  if (tabCount <= 4) return 'grid-cols-4'
-  return 'grid-cols-5'
-})
-
-const formatDate = (dateString) => {
-  const date = parseISO(dateString)
-  return format(date, 'MMM d, yyyy HH:mm')
-}
-
-const truncateText = (text, length) => {
-  if (!text) return ''
-  if (text.length <= length) return text
-  return text.slice(0, length) + '...'
-}
+const { t } = useI18n()
 </script>
diff --git a/frontend/apps/main/src/features/search/highlight.js b/frontend/apps/main/src/features/search/highlight.js
new file mode 100644
index 00000000..3027dd01
--- /dev/null
+++ b/frontend/apps/main/src/features/search/highlight.js
@@ -0,0 +1,17 @@
+export const splitHighlight = (text, term) => {
+  if (!text) return []
+  const needle = term.trim().toLowerCase()
+  if (!needle) return [{ text, match: false }]
+  const haystack = text.toLowerCase()
+  const parts = []
+  let cursor = 0
+  let index = haystack.indexOf(needle)
+  while (index !== -1) {
+    if (index > cursor) parts.push({ text: text.slice(cursor, index), match: false })
+    parts.push({ text: text.slice(index, index + needle.length), match: true })
+    cursor = index + needle.length
+    index = haystack.indexOf(needle, cursor)
+  }
+  if (cursor < text.length) parts.push({ text: text.slice(cursor), match: false })
+  return parts
+}
diff --git a/frontend/apps/main/src/features/search/highlight.test.js b/frontend/apps/main/src/features/search/highlight.test.js
new file mode 100644
index 00000000..460ab8e1
--- /dev/null
+++ b/frontend/apps/main/src/features/search/highlight.test.js
@@ -0,0 +1,18 @@
+import { describe, it, expect } from 'vitest'
+import { splitHighlight } from './highlight'
+
+describe('splitHighlight', () => {
+  it('marks every case-insensitive match', () => {
+    expect(splitHighlight('Refund the refund', 'REFUND')).toEqual([
+      { text: 'Refund', match: true },
+      { text: ' the ', match: false },
+      { text: 'refund', match: true }
+    ])
+  })
+
+  it('returns the whole text unmarked when the term is blank or absent', () => {
+    expect(splitHighlight('hello', '  ')).toEqual([{ text: 'hello', match: false }])
+    expect(splitHighlight('hello', 'xyz')).toEqual([{ text: 'hello', match: false }])
+    expect(splitHighlight('', 'a')).toEqual([])
+  })
+})
diff --git a/frontend/apps/main/src/features/search/searchFilters.js b/frontend/apps/main/src/features/search/searchFilters.js
new file mode 100644
index 00000000..8bf01773
--- /dev/null
+++ b/frontend/apps/main/src/features/search/searchFilters.js
@@ -0,0 +1,68 @@
+export const FILTER_KEYS = ['status', 'priority', 'inbox', 'assignee', 'team', 'tags', 'created']
+
+export const UNASSIGNED = 'none'
+
+export const emptyFilters = () => ({
+  status: '',
+  priority: '',
+  inbox: '',
+  assignee: '',
+  team: '',
+  tags: [],
+  created: ''
+})
+
+export const filtersFromQuery = (query) => {
+  const filters = emptyFilters()
+  for (const key of FILTER_KEYS) {
+    const raw = query[key]
+    if (raw === undefined || raw === null || raw === '') continue
+    if (key === 'tags') {
+      filters.tags = String(raw)
+        .split(',')
+        .map((v) => Number(v))
+        .filter((v) => Number.isInteger(v) && v > 0)
+    } else {
+      filters[key] = String(raw)
+    }
+  }
+  return filters
+}
+
+export const queryFromFilters = (filters) => {
+  const query = {}
+  for (const key of FILTER_KEYS) {
+    const value = filters[key]
+    if (key === 'tags') {
+      if (value?.length) query.tags = value.join(',')
+    } else if (value) {
+      query[key] = value
+    }
+  }
+  return query
+}
+
+export const hasActiveFilters = (filters) =>
+  FILTER_KEYS.some((key) => (key === 'tags' ? filters.tags?.length > 0 : Boolean(filters[key])))
+
+const leaf = (field, operator, value = '') => ({
+  model: 'conversations',
+  field,
+  operator,
+  value: String(value)
+})
+
+const assignmentLeaf = (field, value) =>
+  value === UNASSIGNED ? leaf(field, 'not set') : leaf(field, 'equals', value)
+
+export const toFiltersJSON = (filters) => {
+  const rules = []
+  if (filters.status) rules.push(leaf('status_id', 'equals', filters.status))
+  if (filters.priority) rules.push(leaf('priority_id', 'equals', filters.priority))
+  if (filters.inbox) rules.push(leaf('inbox_id', 'equals', filters.inbox))
+  if (filters.assignee) rules.push(assignmentLeaf('assigned_user_id', filters.assignee))
+  if (filters.team) rules.push(assignmentLeaf('assigned_team_id', filters.team))
+  if (filters.tags?.length) rules.push(leaf('tags', 'contains', JSON.stringify(filters.tags)))
+  if (filters.created) rules.push(leaf('created_at', 'between', filters.created))
+  return rules.length ? JSON.stringify(rules) : ''
+}
diff --git a/frontend/apps/main/src/features/search/searchFilters.test.js b/frontend/apps/main/src/features/search/searchFilters.test.js
new file mode 100644
index 00000000..471e226d
--- /dev/null
+++ b/frontend/apps/main/src/features/search/searchFilters.test.js
@@ -0,0 +1,59 @@
+import { describe, it, expect } from 'vitest'
+import {
+  emptyFilters,
+  filtersFromQuery,
+  queryFromFilters,
+  hasActiveFilters,
+  toFiltersJSON,
+  UNASSIGNED
+} from './searchFilters'
+
+describe('searchFilters', () => {
+  it('round-trips filters through the route query', () => {
+    const filters = {
+      ...emptyFilters(),
+      status: '2',
+      tags: [3, 7],
+      created: '2026-01-01,2026-01-31'
+    }
+    expect(filtersFromQuery(queryFromFilters(filters))).toEqual(filters)
+  })
+
+  it('drops empty values and junk tag ids from the query', () => {
+    expect(queryFromFilters(emptyFilters())).toEqual({})
+    expect(filtersFromQuery({ tags: 'a,0,-1,4,', status: '' }).tags).toEqual([4])
+  })
+
+  it('reports whether any filter is active', () => {
+    expect(hasActiveFilters(emptyFilters())).toBe(false)
+    expect(hasActiveFilters({ ...emptyFilters(), tags: [1] })).toBe(true)
+    expect(hasActiveFilters({ ...emptyFilters(), inbox: '5' })).toBe(true)
+  })
+
+  it('serializes to the conversation list filter JSON', () => {
+    const json = toFiltersJSON({
+      ...emptyFilters(),
+      status: '1',
+      assignee: UNASSIGNED,
+      team: '9',
+      tags: [2, 5],
+      created: '2026-01-01,2026-01-31'
+    })
+    expect(JSON.parse(json)).toEqual([
+      { model: 'conversations', field: 'status_id', operator: 'equals', value: '1' },
+      { model: 'conversations', field: 'assigned_user_id', operator: 'not set', value: '' },
+      { model: 'conversations', field: 'assigned_team_id', operator: 'equals', value: '9' },
+      { model: 'conversations', field: 'tags', operator: 'contains', value: '[2,5]' },
+      {
+        model: 'conversations',
+        field: 'created_at',
+        operator: 'between',
+        value: '2026-01-01,2026-01-31'
+      }
+    ])
+  })
+
+  it('returns an empty string when nothing is set', () => {
+    expect(toFiltersJSON(emptyFilters())).toBe('')
+  })
+})
diff --git a/frontend/apps/main/src/views/search/SearchView.vue b/frontend/apps/main/src/views/search/SearchView.vue
index 01610f14..d02200c1 100644
--- a/frontend/apps/main/src/views/search/SearchView.vue
+++ b/frontend/apps/main/src/views/search/SearchView.vue
@@ -1,13 +1,14 @@
 <template>
   <div class="flex flex-col h-screen">
-    <SearchHeader v-model="searchQuery" @search="handleSearch" />
+    <SearchHeader v-model="term" />
+    <SearchFilters :filters="filters" @update:filters="filters = $event" />
     <div class="flex-1 overflow-y-auto">
       <div v-if="loading" class="flex justify-center items-center h-64">
         <Spinner />
       </div>
       <div v-else-if="error" class="mt-8 text-center space-y-4">
         <p class="text-lg text-destructive">{{ error }}</p>
-        <Button @click="handleSearch"> {{ $t('globals.terms.tryAgain') }} </Button>
+        <Button @click="search"> {{ $t('globals.terms.tryAgain') }} </Button>
       </div>
 
       <div v-else>
@@ -15,33 +16,26 @@
           v-if="searchPerformed && totalResults === 0"
           class="mt-8 text-center text-muted-foreground"
         >
-          {{
-            $t('search.noResultsForQuery', {
-              query: searchQuery
-            })
-          }}
+          {{ $t('search.noResultsForQuery', { query: term }) }}
         </p>
-        <SearchResults v-else-if="searchPerformed" :results="results" class="h-full" />
+        <SearchResults
+          v-else-if="searchPerformed"
+          :results="results"
+          :term="term"
+          v-model:active-tab="activeTab"
+          @change-page="changePage"
+          @change-per-page="changePerPage"
+        />
 
         <p
-          v-else-if="searchQuery.length > 0 && searchQuery.length < MIN_SEARCH_LENGTH"
+          v-else-if="term.length > 0 && term.length < MIN_SEARCH_LENGTH"
           class="mt-8 text-center text-muted-foreground"
         >
-          {{
-            $t('search.minQueryLength', {
-              length: MIN_SEARCH_LENGTH
-            })
-          }}
+          {{ $t('search.minQueryLength', { length: MIN_SEARCH_LENGTH }) }}
         </p>
         <div v-else class="mt-16 text-center">
-          <h2 class="text-xl font-semibold text-primary mb-4">
-            {{
-              $t('conversation.search')
-            }}
-          </h2>
-          <p class="text-lg text-muted-foreground">
-            {{ $t('search.searchBy') }}
-          </p>
+          <h2 class="text-xl font-semibold text-primary mb-4">{{ $t('conversation.search') }}</h2>
+          <p class="text-lg text-muted-foreground">{{ $t('search.searchBy') }}</p>
         </div>
       </div>
     </div>
@@ -50,53 +44,79 @@
 
 <script setup>
 import { ref, computed, watch, onBeforeUnmount } from 'vue'
+import { useRoute, useRouter } from 'vue-router'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
 import { Button } from '@shared-ui/components/ui/button'
-import SearchHeader from '@/features/search/SearchHeader.vue'
-import SearchResults from '@/features/search/SearchResults.vue'
 import Spinner from '@shared-ui/components/ui/spinner/Spinner.vue'
-import api from '../../api'
+import SearchHeader from '@main/features/search/SearchHeader.vue'
+import SearchFilters from '@main/features/search/SearchFilters.vue'
+import SearchResults from '@main/features/search/SearchResults.vue'
+import {
+  filtersFromQuery,
+  queryFromFilters,
+  toFiltersJSON
+} from '@main/features/search/searchFilters'
+import api from '@main/api'
 
 const MIN_SEARCH_LENGTH = 3
 const DEBOUNCE_DELAY = 300
+const DEFAULT_PER_PAGE = 30
+const TABS = ['conversations', 'messages']
 
-const searchQuery = ref('')
-const results = ref({ conversations: [], messages: [] })
+const route = useRoute()
+const router = useRouter()
+
+const emptyPage = () => ({ results: [], total: 0, page: 1, per_page: DEFAULT_PER_PAGE, total_pages: 0 })
+const emptyResults = () => ({ conversations: emptyPage(), messages: emptyPage() })
+
+const term = ref(String(route.query.q || ''))
+const filters = ref(filtersFromQuery(route.query))
+const activeTab = ref(TABS.includes(route.query.tab) ? route.query.tab : 'conversations')
+const results = ref(emptyResults())
 const loading = ref(false)
 const error = ref(null)
 const searchPerformed = ref(false)
 let debounceTimer = null
 let searchRequestId = 0
 
-const totalResults = computed(() => {
-  return results.value.conversations.length + results.value.messages.length
-})
+const totalResults = computed(() => results.value.conversations.total + results.value.messages.total)
 
-const handleSearch = async () => {
-  if (searchQuery.value.length < MIN_SEARCH_LENGTH) {
-    searchRequestId++
-    results.value = { conversations: [], messages: [] }
-    searchPerformed.value = false
-    loading.value = false
+const searchParams = (page, perPage) => {
+  const params = { query: term.value, page, page_size: perPage }
+  const filtersJSON = toFiltersJSON(filters.value)
+  if (filtersJSON) params.filters = filtersJSON
+  return params
+}
+
+const fetchers = {
+  conversations: api.searchConversations,
+  messages: api.searchMessages
+}
+
+const reset = () => {
+  searchRequestId++
+  results.value = emptyResults()
+  searchPerformed.value = false
+  loading.value = false
+}
+
+const search = async () => {
+  if (term.value.length < MIN_SEARCH_LENGTH) {
+    reset()
     return
   }
-
   loading.value = true
   error.value = null
   searchPerformed.value = true
 
   const requestId = ++searchRequestId
   try {
-    const [convResults, messagesResults] = await Promise.all([
-      api.searchConversations({ query: searchQuery.value }),
-      api.searchMessages({ query: searchQuery.value })
-    ])
-
+    const perPage = Object.fromEntries(TABS.map((type) => [type, results.value[type].per_page]))
+    const pages = await Promise.all(
+      TABS.map((type) => fetchers[type](searchParams(1, perPage[type])))
+    )
     if (requestId !== searchRequestId) return
-    results.value = {
-      conversations: convResults.data.data,
-      messages: messagesResults.data.data
-    }
+    results.value = Object.fromEntries(TABS.map((type, i) => [type, pages[i].data.data]))
   } catch (err) {
     if (requestId !== searchRequestId) return
     error.value = handleHTTPError(err).message
@@ -105,23 +125,52 @@ const handleSearch = async () => {
   }
 }
 
-const debouncedSearch = () => {
-  clearTimeout(debounceTimer)
-  debounceTimer = setTimeout(handleSearch, DEBOUNCE_DELAY)
+const fetchPage = async (type, page, perPage) => {
+  const requestId = ++searchRequestId
+  try {
+    const response = await fetchers[type](searchParams(page, perPage))
+    if (requestId !== searchRequestId) return
+    results.value[type] = response.data.data
+  } catch (err) {
+    if (requestId !== searchRequestId) return
+    error.value = handleHTTPError(err).message
+  }
 }
 
-watch(searchQuery, (newValue) => {
-  if (newValue.length >= MIN_SEARCH_LENGTH) {
+const changePage = ({ type, page }) => fetchPage(type, page, results.value[type].per_page)
+const changePerPage = ({ type, perPage }) => fetchPage(type, 1, perPage)
+
+const syncRoute = () => {
+  const query = { ...queryFromFilters(filters.value) }
+  if (term.value) query.q = term.value
+  if (activeTab.value !== 'conversations') query.tab = activeTab.value
+  router.replace({ query })
+}
+
+const debouncedSearch = () => {
+  clearTimeout(debounceTimer)
+  debounceTimer = setTimeout(search, DEBOUNCE_DELAY)
+}
+
+watch(term, (value) => {
+  syncRoute()
+  if (value.length >= MIN_SEARCH_LENGTH) {
     debouncedSearch()
   } else {
     clearTimeout(debounceTimer)
-    searchRequestId++
-    results.value = { conversations: [], messages: [] }
-    searchPerformed.value = false
-    loading.value = false
+    reset()
   }
 })
 
+watch(filters, () => {
+  syncRoute()
+  if (term.value.length >= MIN_SEARCH_LENGTH) debouncedSearch()
+})
+
+watch(activeTab, syncRoute)
+
+if (term.value.length >= MIN_SEARCH_LENGTH) search()
+
 onBeforeUnmount(() => {
   clearTimeout(debounceTimer)
 })
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 9428f883..bc5d54a1 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -1079,6 +1079,7 @@
   "globals.terms.name": "Name | Names",
   "globals.terms.nextSlaDeadline": "Next SLA deadline",
   "globals.terms.none": "None",
+  "globals.terms.noSubject": "No subject",
   "globals.terms.note": "Note | Notes",
   "globals.terms.notification": "Notification | Notifications",
   "globals.terms.off": "OFF",
@@ -1459,9 +1460,10 @@
   "role.new": "New role",
   "role.select": "Select roles",
   "search.adjustSearchTerms": "Try adjusting your search terms or filters.",
+  "search.clearFilters": "Clear filters",
   "search.minQueryLength": " Please enter at least {length} characters to search.",
   "search.noResultsForQuery": "No results found for query `{query}`. Try a different search term.",
-  "search.searchBy": "Search by reference number, contact email address or messages in conversations.",
+  "search.searchBy": "Search by reference number, subject, contact name or email, or message text.",
   "setup.completeYourSetup": "Complete your setup",
   "setup.createFirstInbox": "Create your first inbox",
   "setup.inviteTeammates": "Invite teammates",
diff --git a/internal/conversation/conversation.go b/internal/conversation/conversation.go
index 657c4210..d7ef4978 100644
--- a/internal/conversation/conversation.go
+++ b/internal/conversation/conversation.go
@@ -67,13 +67,13 @@ const (
 </p>`
 )
 
-var conversationFilterRenderers = dbutil.FieldRenderers{
+var ListFilterRenderers = dbutil.FieldRenderers{
 	"conversations": {
 		"tags": renderTagFilter,
 	},
 }
 
-var conversationListAllowedFields = dbutil.AllowedFields{
+var ListFilterAllowedFields = dbutil.AllowedFields{
 	"conversations":         conversationsAllowedFields,
 	"conversation_statuses": conversationStatusAllowedFields,
 	"users":                 usersAllowedFields,
@@ -1903,13 +1903,13 @@ func (c *Manager) makeConversationsListQuery(viewingUserID, userID int, teamIDs
 		OrderBy:  orderBy,
 		Page:     page,
 		PageSize: pageSize,
-		Location: c.filterLocation(),
-	}, filtersJSON, conversationListAllowedFields, conversationFilterRenderers)
+		Location: c.FilterLocation(),
+	}, filtersJSON, ListFilterAllowedFields, ListFilterRenderers)
 }
 
 // ValidateListFilters structurally validates a conversation view's filters payload.
 func (c *Manager) ValidateListFilters(filtersJSON string) error {
-	err := dbutil.ValidateFilters(filtersJSON, conversationListAllowedFields, conversationFilterRenderers)
+	err := dbutil.ValidateFilters(filtersJSON, ListFilterAllowedFields, ListFilterRenderers)
 	if err == nil {
 		return nil
 	}
@@ -2199,7 +2199,7 @@ func (c *Manager) updateAssignee(uuid string, assigneeID int, assigneeType strin
 }
 
 // filterLocation returns the configured app timezone for resolving date filters. The builder normalizes invalid/empty values to UTC.
-func (c *Manager) filterLocation() string {
+func (c *Manager) FilterLocation() string {
 	b, err := c.settingsStore.Get("app.timezone")
 	if err != nil {
 		return ""
diff --git a/internal/conversation/sidebar_counts.go b/internal/conversation/sidebar_counts.go
index 657be04f..5fa36d97 100644
--- a/internal/conversation/sidebar_counts.go
+++ b/internal/conversation/sidebar_counts.go
@@ -130,7 +130,7 @@ func (c *Manager) makeViewCountsQuery(userID int, teamIDs []int, listTypes []str
 	var (
 		args  = []any{}
 		parts = make([]string, 0, len(views))
-		loc   = c.filterLocation()
+		loc   = c.FilterLocation()
 	)
 
 	for _, view := range views {
@@ -159,7 +159,7 @@ func (c *Manager) makeConversationsCountQuery(existingArgs []any, userID int, te
 
 	baseQuery := fmt.Sprintf(c.q.GetConversationsCountBase, listTypeWhereClause(conditions))
 
-	return dbutil.BuildFilterQuery(baseQuery, qArgs, filtersJSON, conversationListAllowedFields, conversationFilterRenderers, loc)
+	return dbutil.BuildFilterQuery(baseQuery, qArgs, filtersJSON, ListFilterAllowedFields, ListFilterRenderers, loc)
 }
 
 // ListsForUserPermissions returns conversation list types the user may access.
diff --git a/internal/conversation/sidebar_counts_test.go b/internal/conversation/sidebar_counts_test.go
index 93ac3b1a..0383f35b 100644
--- a/internal/conversation/sidebar_counts_test.go
+++ b/internal/conversation/sidebar_counts_test.go
@@ -186,7 +186,7 @@ func TestMakeConversationsCountQueryEmptyTeamIDs(t *testing.T) {
 
 func TestViewFiltersValidateAgainstListFields(t *testing.T) {
 	filters := `[{"model":"conversations","field":"inbox_id","operator":"equals","value":"1"}]`
-	if err := dbutil.ValidateFilters(filters, conversationListAllowedFields, conversationFilterRenderers); err != nil {
+	if err := dbutil.ValidateFilters(filters, ListFilterAllowedFields, ListFilterRenderers); err != nil {
 		t.Fatalf("expected valid filters, got %v", err)
 	}
 }
diff --git a/internal/search/models/models.go b/internal/search/models/models.go
index aa899cc8..ad8c2a90 100644
--- a/internal/search/models/models.go
+++ b/internal/search/models/models.go
@@ -3,6 +3,7 @@ package models
 import (
 	"time"
 
+	"github.com/lib/pq"
 	"github.com/volatiletech/null/v9"
 )
 
@@ -18,21 +19,73 @@ type ReadScope struct {
 	ReadUnassigned bool
 }
 
+// Query is a search term plus the list filters and page the caller wants applied.
+type Query struct {
+	Term     string
+	Filters  string
+	Page     int
+	PageSize int
+}
+
+type Contact struct {
+	FirstName string      `db:"first_name" json:"first_name"`
+	LastName  null.String `db:"last_name" json:"last_name"`
+	Email     null.String `db:"email" json:"email"`
+	AvatarURL null.String `db:"avatar_url" json:"avatar_url"`
+}
+
+type Assignee struct {
+	FirstName null.String `db:"first_name" json:"first_name"`
+	LastName  null.String `db:"last_name" json:"last_name"`
+	AvatarURL null.String `db:"avatar_url" json:"avatar_url"`
+}
+
+type Sender struct {
+	FirstName null.String `db:"first_name" json:"first_name"`
+	LastName  null.String `db:"last_name" json:"last_name"`
+}
+
 type ConversationResult struct {
-	CreatedAt       time.Time `db:"created_at" json:"created_at"`
-	UUID            string    `db:"uuid" json:"uuid"`
-	ReferenceNumber string    `db:"reference_number" json:"reference_number"`
-	Subject         string    `db:"subject" json:"subject"`
-	Status          string    `db:"status" json:"status"`
+	Total           int            `db:"total" json:"-"`
+	CreatedAt       time.Time      `db:"created_at" json:"created_at"`
+	UUID            string         `db:"uuid" json:"uuid"`
+	ReferenceNumber string         `db:"reference_number" json:"reference_number"`
+	Subject         null.String    `db:"subject" json:"subject"`
+	LastMessage     null.String    `db:"last_message" json:"last_message"`
+	LastMessageAt   null.Time      `db:"last_message_at" json:"last_message_at"`
+	AssignedUserID  null.Int       `db:"assigned_user_id" json:"assigned_user_id"`
+	AssignedTeamID  null.Int       `db:"assigned_team_id" json:"assigned_team_id"`
+	Assignee        Assignee       `db:"assignee" json:"assignee"`
+	TeamName        null.String    `db:"team_name" json:"team_name"`
+	Status          null.String    `db:"status" json:"status"`
+	Priority        null.String    `db:"priority" json:"priority"`
+	InboxName       null.String    `db:"inbox_name" json:"inbox_name"`
+	InboxChannel    null.String    `db:"inbox_channel" json:"inbox_channel"`
+	Contact         Contact        `db:"contact" json:"contact"`
+	Tags            pq.StringArray `db:"tags" json:"tags"`
 }
 
 type MessageResult struct {
-	CreatedAt                   time.Time `db:"created_at" json:"created_at"`
-	TextContent                 string    `db:"text_content" json:"text_content"`
-	ConversationCreatedAt       time.Time `db:"conversation_created_at" json:"conversation_created_at"`
-	ConversationUUID            string    `db:"conversation_uuid" json:"conversation_uuid"`
-	ConversationReferenceNumber string    `db:"conversation_reference_number" json:"conversation_reference_number"`
-	ConversationStatus          string    `db:"conversation_status" json:"conversation_status"`
+	Total                       int         `db:"total" json:"-"`
+	UUID                        string      `db:"uuid" json:"uuid"`
+	CreatedAt                   time.Time   `db:"created_at" json:"created_at"`
+	Type                        string      `db:"type" json:"type"`
+	Private                     bool        `db:"private" json:"private"`
+	Snippet                     null.String `db:"snippet" json:"snippet"`
+	Sender                      Sender      `db:"sender" json:"sender"`
+	ConversationCreatedAt       time.Time   `db:"conversation_created_at" json:"conversation_created_at"`
+	ConversationUUID            string      `db:"conversation_uuid" json:"conversation_uuid"`
+	ConversationReferenceNumber string      `db:"conversation_reference_number" json:"conversation_reference_number"`
+	ConversationSubject         null.String `db:"conversation_subject" json:"conversation_subject"`
+	ConversationStatus          null.String `db:"conversation_status" json:"conversation_status"`
+	AssignedUserID              null.Int    `db:"assigned_user_id" json:"assigned_user_id"`
+	AssignedTeamID              null.Int    `db:"assigned_team_id" json:"assigned_team_id"`
+	Assignee                    Assignee    `db:"assignee" json:"assignee"`
+	TeamName                    null.String `db:"team_name" json:"team_name"`
+	Priority                    null.String `db:"priority" json:"priority"`
+	InboxName                   null.String `db:"inbox_name" json:"inbox_name"`
+	InboxChannel                null.String `db:"inbox_channel" json:"inbox_channel"`
+	Contact                     Contact     `db:"contact" json:"contact"`
 }
 
 type ContactResult struct {
diff --git a/internal/search/queries.sql b/internal/search/queries.sql
index 66a9a973..48b0f05a 100644
--- a/internal/search/queries.sql
+++ b/internal/search/queries.sql
@@ -1,33 +1,43 @@
--- name: search-conversations-by-reference-number
+-- name: search-conversations
 SELECT
+    COUNT(*) OVER() AS total,
     conversations.created_at,
     conversations.uuid,
     conversations.reference_number,
     conversations.subject,
-    cs.name AS status
-FROM conversations
-LEFT JOIN conversation_statuses cs ON conversations.status_id = cs.id
-WHERE reference_number::text = $1
-  AND $3
-  AND (
-       $4
-    OR ($5 AND conversations.assigned_user_id = $2)
-    OR ($6 AND conversations.assigned_team_id = ANY($9::int[]))
-    OR ($7 AND conversations.assigned_team_id = ANY($9::int[]) AND conversations.assigned_user_id IS NULL)
-    OR ($8 AND conversations.assigned_user_id IS NULL AND conversations.assigned_team_id IS NULL)
-  );
-
--- name: search-conversations-by-contact-email
-SELECT
-    conversations.created_at,
-    conversations.uuid,
-    conversations.reference_number,
-    conversations.subject,
-    cs.name AS status
+    conversations.last_message,
+    conversations.last_message_at,
+    conversations.assigned_user_id,
+    conversations.assigned_team_id,
+    assignee.first_name AS "assignee.first_name",
+    assignee.last_name AS "assignee.last_name",
+    assignee.avatar_url AS "assignee.avatar_url",
+    teams.name AS team_name,
+    cs.name AS status,
+    cp.name AS priority,
+    inboxes.name AS inbox_name,
+    inboxes.channel AS inbox_channel,
+    users.first_name AS "contact.first_name",
+    users.last_name AS "contact.last_name",
+    users.email AS "contact.email",
+    users.avatar_url AS "contact.avatar_url",
+    COALESCE(
+        (SELECT ARRAY_AGG(tags.name ORDER BY tags.name) FROM conversation_tags JOIN tags ON tags.id = conversation_tags.tag_id WHERE conversation_tags.conversation_id = conversations.id),
+        '{}'
+    ) AS tags
 FROM conversations
 JOIN users ON conversations.contact_id = users.id
+LEFT JOIN users assignee ON conversations.assigned_user_id = assignee.id
+LEFT JOIN teams ON conversations.assigned_team_id = teams.id
+LEFT JOIN inboxes ON conversations.inbox_id = inboxes.id
 LEFT JOIN conversation_statuses cs ON conversations.status_id = cs.id
-WHERE users.email ILIKE '%' || $1 || '%'
+LEFT JOIN conversation_priorities cp ON conversations.priority_id = cp.id
+WHERE (
+       conversations.reference_number::text = $1
+    OR conversations.subject ILIKE '%' || $1 || '%'
+    OR users.email ILIKE '%' || $1 || '%'
+    OR CONCAT_WS(' ', users.first_name, users.last_name) ILIKE '%' || $1 || '%'
+  )
   AND $3
   AND (
        $4
@@ -36,29 +46,59 @@ WHERE users.email ILIKE '%' || $1 || '%'
     OR ($7 AND conversations.assigned_team_id = ANY($9::int[]) AND conversations.assigned_user_id IS NULL)
     OR ($8 AND conversations.assigned_user_id IS NULL AND conversations.assigned_team_id IS NULL)
   )
-ORDER BY conversations.created_at DESC
-LIMIT $10;
 
 -- name: search-messages
 SELECT
-    c.created_at as "conversation_created_at",
-    c.reference_number as "conversation_reference_number",
-    c.uuid as "conversation_uuid",
-    LEFT(m.text_content, 200) AS text_content,
-    cs.name as "conversation_status"
-FROM conversation_messages m
-    JOIN conversations c ON m.conversation_id = c.id
-    LEFT JOIN conversation_statuses cs ON c.status_id = cs.id
-WHERE m.type != 'activity' and m.text_content ILIKE '%' || $1 || '%'
+    COUNT(*) OVER() AS total,
+    conversation_messages.uuid,
+    conversation_messages.created_at,
+    conversation_messages.type,
+    conversation_messages.private,
+    CASE WHEN POSITION(LOWER($1) IN LOWER(conversation_messages.text_content)) > 81 THEN '…' ELSE '' END
+        || SUBSTRING(
+            conversation_messages.text_content
+            FROM GREATEST(POSITION(LOWER($1) IN LOWER(conversation_messages.text_content)) - 80, 1)
+            FOR 300
+        ) AS snippet,
+    sender.first_name AS "sender.first_name",
+    sender.last_name AS "sender.last_name",
+    conversations.created_at AS conversation_created_at,
+    conversations.uuid AS conversation_uuid,
+    conversations.reference_number AS conversation_reference_number,
+    conversations.subject AS conversation_subject,
+    conversations.assigned_user_id,
+    conversations.assigned_team_id,
+    assignee.first_name AS "assignee.first_name",
+    assignee.last_name AS "assignee.last_name",
+    assignee.avatar_url AS "assignee.avatar_url",
+    teams.name AS team_name,
+    cs.name AS conversation_status,
+    cp.name AS priority,
+    inboxes.name AS inbox_name,
+    inboxes.channel AS inbox_channel,
+    users.first_name AS "contact.first_name",
+    users.last_name AS "contact.last_name",
+    users.email AS "contact.email",
+    users.avatar_url AS "contact.avatar_url"
+FROM conversation_messages
+JOIN conversations ON conversation_messages.conversation_id = conversations.id
+JOIN users ON conversations.contact_id = users.id
+LEFT JOIN users sender ON conversation_messages.sender_id = sender.id
+LEFT JOIN users assignee ON conversations.assigned_user_id = assignee.id
+LEFT JOIN teams ON conversations.assigned_team_id = teams.id
+LEFT JOIN inboxes ON conversations.inbox_id = inboxes.id
+LEFT JOIN conversation_statuses cs ON conversations.status_id = cs.id
+LEFT JOIN conversation_priorities cp ON conversations.priority_id = cp.id
+WHERE conversation_messages.type != 'activity'
+  AND conversation_messages.text_content ILIKE '%' || $1 || '%'
   AND $3
   AND (
        $4
-    OR ($5 AND c.assigned_user_id = $2)
-    OR ($6 AND c.assigned_team_id = ANY($9::int[]))
-    OR ($7 AND c.assigned_team_id = ANY($9::int[]) AND c.assigned_user_id IS NULL)
-    OR ($8 AND c.assigned_user_id IS NULL AND c.assigned_team_id IS NULL)
+    OR ($5 AND conversations.assigned_user_id = $2)
+    OR ($6 AND conversations.assigned_team_id = ANY($9::int[]))
+    OR ($7 AND conversations.assigned_team_id = ANY($9::int[]) AND conversations.assigned_user_id IS NULL)
+    OR ($8 AND conversations.assigned_user_id IS NULL AND conversations.assigned_team_id IS NULL)
   )
-LIMIT $10;
 
 -- name: search-contacts
 SELECT
diff --git a/internal/search/search.go b/internal/search/search.go
index 8f103c60..3ecb6807 100644
--- a/internal/search/search.go
+++ b/internal/search/search.go
@@ -13,31 +13,41 @@ import (
 	"github.com/zerodha/logf"
 )
 
+const maxPageSize = 100
+
 var (
 	//go:embed queries.sql
 	efs embed.FS
+
+	messageAllowedFields = []string{"created_at"}
 )
 
 // Manager is the search manager
 type Manager struct {
-	q    queries
-	lo   *logf.Logger
-	i18n *i18n.I18n
+	q               queries
+	db              *sqlx.DB
+	lo              *logf.Logger
+	i18n            *i18n.I18n
+	filterFields    dbutil.AllowedFields
+	filterRenderers dbutil.FieldRenderers
+	filterLocation  func() string
 }
 
 // Opts contains the options for creating a new search manager
 type Opts struct {
-	DB   *sqlx.DB
-	Lo   *logf.Logger
-	I18n *i18n.I18n
+	DB              *sqlx.DB
+	Lo              *logf.Logger
+	I18n            *i18n.I18n
+	FilterFields    dbutil.AllowedFields
+	FilterRenderers dbutil.FieldRenderers
+	FilterLocation  func() string
 }
 
 // queries contains all the prepared queries
 type queries struct {
-	SearchConversationsByRefNum       *sqlx.Stmt `query:"search-conversations-by-reference-number"`
-	SearchConversationsByContactEmail *sqlx.Stmt `query:"search-conversations-by-contact-email"`
-	SearchMessages                    *sqlx.Stmt `query:"search-messages"`
-	SearchContacts                    *sqlx.Stmt `query:"search-contacts"`
+	SearchConversations string     `query:"search-conversations"`
+	SearchMessages      string     `query:"search-messages"`
+	SearchContacts      *sqlx.Stmt `query:"search-contacts"`
 }
 
 // New creates a new search manager
@@ -46,39 +56,55 @@ func New(opts Opts) (*Manager, error) {
 	if err := dbutil.ScanSQLFile("queries.sql", &q, opts.DB, efs); err != nil {
 		return nil, err
 	}
-	return &Manager{q: q, lo: opts.Lo, i18n: opts.I18n}, nil
+	return &Manager{
+		q:               q,
+		db:              opts.DB,
+		lo:              opts.Lo,
+		i18n:            opts.I18n,
+		filterFields:    opts.FilterFields,
+		filterRenderers: opts.FilterRenderers,
+		filterLocation:  opts.FilterLocation,
+	}, nil
 }
 
-// Conversations searches conversations the agent is allowed to read.
-func (s *Manager) Conversations(query string, scope models.ReadScope, limit int) ([]models.ConversationResult, error) {
-	args := scopeArgs(scope)
-
-	var refNumResults = make([]models.ConversationResult, 0)
-	if err := s.q.SearchConversationsByRefNum.Select(&refNumResults, append([]any{query}, args...)...); err != nil {
+// Conversations searches conversations the agent is allowed to read, returning the page and the total match count.
+func (s *Manager) Conversations(query models.Query, scope models.ReadScope) ([]models.ConversationResult, int, error) {
+	sql, args, err := s.buildQuery(s.q.SearchConversations, query, scope, "conversations.last_message_at", s.filterFields)
+	if err != nil {
+		return nil, 0, err
+	}
+	var results = make([]models.ConversationResult, 0)
+	if err := s.db.Select(&results, sql, args...); err != nil {
 		s.lo.Error("error searching conversations", "error", err)
-		return nil, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
+		return nil, 0, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
-
-	var emailResults = make([]models.ConversationResult, 0)
-	if err := s.q.SearchConversationsByContactEmail.Select(&emailResults, append([]any{query}, append(args, limit)...)...); err != nil {
-		s.lo.Error("error searching conversations", "error", err)
-		return nil, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
+	total := 0
+	if len(results) > 0 {
+		total = results[0].Total
 	}
-	results := append(refNumResults, emailResults...)
-	if len(results) > limit {
-		results = results[:limit]
-	}
-	return results, nil
+	return results, total, nil
 }
 
-// Messages searches messages in conversations the agent is allowed to read.
-func (s *Manager) Messages(query string, scope models.ReadScope, limit int) ([]models.MessageResult, error) {
+// Messages searches messages in conversations the agent is allowed to read, returning the page and the total match count.
+func (s *Manager) Messages(query models.Query, scope models.ReadScope) ([]models.MessageResult, int, error) {
+	fields := dbutil.AllowedFields{"conversation_messages": messageAllowedFields}
+	for model, f := range s.filterFields {
+		fields[model] = f
+	}
+	sql, args, err := s.buildQuery(s.q.SearchMessages, query, scope, "conversation_messages.created_at", fields)
+	if err != nil {
+		return nil, 0, err
+	}
 	var results = make([]models.MessageResult, 0)
-	if err := s.q.SearchMessages.Select(&results, append([]any{query}, append(scopeArgs(scope), limit)...)...); err != nil {
+	if err := s.db.Select(&results, sql, args...); err != nil {
 		s.lo.Error("error searching messages", "error", err)
-		return nil, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
+		return nil, 0, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
-	return results, nil
+	total := 0
+	if len(results) > 0 {
+		total = results[0].Total
+	}
+	return results, total, nil
 }
 
 // Contacts searches contacts based on the query
@@ -91,6 +117,30 @@ func (s *Manager) Contacts(query string, limit int) ([]models.ContactResult, err
 	return results, nil
 }
 
+func (s *Manager) buildQuery(base string, query models.Query, scope models.ReadScope, orderBy string, fields dbutil.AllowedFields) (string, []any, error) {
+	if query.Page < 1 {
+		query.Page = 1
+	}
+	if query.PageSize < 1 || query.PageSize > maxPageSize {
+		query.PageSize = maxPageSize
+	}
+	if query.Filters == "" {
+		query.Filters = "[]"
+	}
+	sql, args, err := dbutil.BuildPaginatedQuery(base, append([]any{query.Term}, scopeArgs(scope)...), dbutil.PaginationOptions{
+		Order:    dbutil.DESC,
+		OrderBy:  orderBy,
+		Page:     query.Page,
+		PageSize: query.PageSize,
+		Location: s.filterLocation(),
+	}, query.Filters, fields, s.filterRenderers)
+	if err != nil {
+		s.lo.Error("error building search query", "error", err)
+		return "", nil, envelope.NewError(envelope.InputError, s.i18n.T("globals.messages.invalidFilters"), nil)
+	}
+	return sql, args, nil
+}
+
 func scopeArgs(scope models.ReadScope) []any {
 	return []any{
 		scope.UserID,

From a7eb702e9ed4ed8a610954286898f850a8a73b91 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 16 Sep 2026 13:09:48 +0530
Subject: [PATCH 067/178] lay out search page as one centered column with the
 search field, filters and results aligned

---
 .../src/features/search/SearchFilters.vue     | 17 ++---
 .../main/src/features/search/SearchHeader.vue | 38 ++---------
 .../src/features/search/SearchResults.vue     |  9 +--
 .../apps/main/src/views/search/SearchView.vue | 68 +++++++++++++------
 i18n/en-US.json                               |  1 +
 5 files changed, 66 insertions(+), 67 deletions(-)

diff --git a/frontend/apps/main/src/features/search/SearchFilters.vue b/frontend/apps/main/src/features/search/SearchFilters.vue
index 35edf728..c36aa863 100644
--- a/frontend/apps/main/src/features/search/SearchFilters.vue
+++ b/frontend/apps/main/src/features/search/SearchFilters.vue
@@ -1,6 +1,6 @@
 <template>
-  <div class="flex flex-wrap items-center gap-2 px-4 py-2 border-b">
-    <div class="w-40">
+  <div class="flex flex-wrap items-center gap-2">
+    <div class="flex-1 min-w-28">
       <SelectComboBox
         :model-value="filters.status"
         :items="conversationStore.statusOptions"
@@ -9,7 +9,7 @@
         @update:model-value="set('status', $event)"
       />
     </div>
-    <div class="w-40">
+    <div class="flex-1 min-w-28">
       <SelectComboBox
         :model-value="filters.priority"
         :items="conversationStore.priorityOptions"
@@ -18,7 +18,7 @@
         @update:model-value="set('priority', $event)"
       />
     </div>
-    <div class="w-44">
+    <div class="flex-1 min-w-28">
       <SelectComboBox
         :model-value="filters.inbox"
         :items="inboxStore.options"
@@ -27,7 +27,7 @@
         @update:model-value="set('inbox', $event)"
       />
     </div>
-    <div class="w-44">
+    <div class="flex-1 min-w-28">
       <SelectAgentCombobox
         :model-value="filters.assignee"
         :placeholder="t('globals.terms.assignee')"
@@ -36,7 +36,7 @@
         @update:model-value="set('assignee', $event)"
       />
     </div>
-    <div class="w-44">
+    <div class="flex-1 min-w-28">
       <SelectTeamCombobox
         :model-value="filters.team"
         :placeholder="t('globals.terms.team')"
@@ -45,7 +45,7 @@
         @update:model-value="set('team', $event)"
       />
     </div>
-    <div class="min-w-44 max-w-96">
+    <div class="flex-[1.5] min-w-40">
       <SelectTagCombobox
         :model-value="filters.tags"
         :placeholder="t('globals.terms.tag', 2)"
@@ -54,7 +54,7 @@
         @update:model-value="set('tags', $event)"
       />
     </div>
-    <div class="w-60">
+    <div class="flex-1 min-w-44">
       <DateFilterValue
         :model-value="filters.created"
         range
@@ -66,6 +66,7 @@
       type="button"
       variant="ghost"
       size="sm"
+      class="text-muted-foreground"
       @click="emit('update:filters', emptyFilters())"
     >
       <X class="w-4 h-4 mr-1" />
diff --git a/frontend/apps/main/src/features/search/SearchHeader.vue b/frontend/apps/main/src/features/search/SearchHeader.vue
index de5b4d73..116e4e21 100644
--- a/frontend/apps/main/src/features/search/SearchHeader.vue
+++ b/frontend/apps/main/src/features/search/SearchHeader.vue
@@ -1,41 +1,13 @@
 <template>
-  <div>
-    <div class="flex items-center px-2 h-12">
-      <SidebarTrigger class="cursor-pointer" />
-      <Input
-        ref="inputRef"
-        v-model="model"
-        :placeholder="t('globals.terms.search')"
-        class="w-full border-none shadow-none focus:ring-0 focus:ring-offset-0"
-      />
-    </div>
-    <Separator />
+  <div class="flex items-center space-x-4 px-2 h-12 border-b shrink-0">
+    <SidebarTrigger class="cursor-pointer" />
+    <span class="text-xl font-semibold">{{ t('globals.terms.search') }}</span>
   </div>
 </template>
 
 <script setup>
-import { ref, onMounted, nextTick } from 'vue'
-import { Separator } from '@shared-ui/components/ui/separator'
-import { Input } from '@shared-ui/components/ui/input'
 import { SidebarTrigger } from '@shared-ui/components/ui/sidebar'
 import { useI18n } from 'vue-i18n'
-const model = defineModel({
-  type: String,
-  default: '',
-  required: false
-})
-const { t } = useI18n()
-const inputRef = ref(null)
-onMounted(async () => {
-  await nextTick()
-  inputRef.value?.$el?.focus?.()
-})
-</script>
 
-<style scoped>
-.focus\:ring-0:focus {
-  --tw-ring-offset-shadow: none;
-  --tw-ring-shadow: none;
-  box-shadow: none;
-}
-</style>
+const { t } = useI18n()
+</script>
diff --git a/frontend/apps/main/src/features/search/SearchResults.vue b/frontend/apps/main/src/features/search/SearchResults.vue
index 1b2dab68..96911e78 100644
--- a/frontend/apps/main/src/features/search/SearchResults.vue
+++ b/frontend/apps/main/src/features/search/SearchResults.vue
@@ -1,9 +1,10 @@
 <template>
-  <div class="max-w-5xl mx-auto px-4 py-4">
+  <div>
     <Tabs :model-value="activeTab" @update:model-value="emit('update:activeTab', $event)">
-      <TabsList class="grid w-full grid-cols-2 mb-4">
-        <TabsTrigger v-for="type in TYPES" :key="type" :value="type">
-          {{ t(tabLabelKeys[type], 2) }} ({{ results[type].total }})
+      <TabsList class="mb-3">
+        <TabsTrigger v-for="type in TYPES" :key="type" :value="type" class="gap-1.5">
+          {{ t(tabLabelKeys[type], 2) }}
+          <span class="text-xs tabular-nums text-muted-foreground">{{ results[type].total }}</span>
         </TabsTrigger>
       </TabsList>
 
diff --git a/frontend/apps/main/src/views/search/SearchView.vue b/frontend/apps/main/src/views/search/SearchView.vue
index d02200c1..6da50842 100644
--- a/frontend/apps/main/src/views/search/SearchView.vue
+++ b/frontend/apps/main/src/views/search/SearchView.vue
@@ -1,23 +1,43 @@
 <template>
   <div class="flex flex-col h-screen">
-    <SearchHeader v-model="term" />
-    <SearchFilters :filters="filters" @update:filters="filters = $event" />
+    <SearchHeader />
     <div class="flex-1 overflow-y-auto">
-      <div v-if="loading" class="flex justify-center items-center h-64">
-        <Spinner />
-      </div>
-      <div v-else-if="error" class="mt-8 text-center space-y-4">
-        <p class="text-lg text-destructive">{{ error }}</p>
-        <Button @click="search"> {{ $t('globals.terms.tryAgain') }} </Button>
-      </div>
+      <div class="max-w-6xl mx-auto px-4 py-6 space-y-4">
+        <div class="relative">
+          <SearchIcon
+            class="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-muted-foreground pointer-events-none"
+            aria-hidden="true"
+          />
+          <Input
+            ref="inputRef"
+            v-model="term"
+            :placeholder="$t('search.placeholder')"
+            class="h-12 pl-10 pr-10 text-base"
+          />
+          <button
+            v-if="term"
+            type="button"
+            class="absolute right-2 top-1/2 -translate-y-1/2 p-1.5 rounded-md text-muted-foreground hover:text-foreground hover:bg-accent"
+            :aria-label="$t('globals.terms.clear')"
+            @click="term = ''"
+          >
+            <X class="w-4 h-4" />
+          </button>
+        </div>
 
-      <div v-else>
-        <p
-          v-if="searchPerformed && totalResults === 0"
-          class="mt-8 text-center text-muted-foreground"
-        >
-          {{ $t('search.noResultsForQuery', { query: term }) }}
-        </p>
+        <SearchFilters :filters="filters" @update:filters="filters = $event" />
+
+        <div v-if="loading" class="flex justify-center items-center h-64">
+          <Spinner />
+        </div>
+        <div v-else-if="error" class="py-16 text-center space-y-4">
+          <p class="text-destructive">{{ error }}</p>
+          <Button @click="search"> {{ $t('globals.terms.tryAgain') }} </Button>
+        </div>
+        <div v-else-if="searchPerformed && totalResults === 0" class="py-16 text-center space-y-1">
+          <p class="text-foreground font-medium">{{ $t('search.noResultsForQuery', { query: term }) }}</p>
+          <p class="text-sm text-muted-foreground">{{ $t('search.adjustSearchTerms') }}</p>
+        </div>
         <SearchResults
           v-else-if="searchPerformed"
           :results="results"
@@ -26,16 +46,15 @@
           @change-page="changePage"
           @change-per-page="changePerPage"
         />
-
         <p
           v-else-if="term.length > 0 && term.length < MIN_SEARCH_LENGTH"
-          class="mt-8 text-center text-muted-foreground"
+          class="py-16 text-center text-sm text-muted-foreground"
         >
           {{ $t('search.minQueryLength', { length: MIN_SEARCH_LENGTH }) }}
         </p>
-        <div v-else class="mt-16 text-center">
-          <h2 class="text-xl font-semibold text-primary mb-4">{{ $t('conversation.search') }}</h2>
-          <p class="text-lg text-muted-foreground">{{ $t('search.searchBy') }}</p>
+        <div v-else class="py-16 text-center space-y-2">
+          <SearchIcon class="w-8 h-8 mx-auto text-muted-foreground/60" aria-hidden="true" />
+          <p class="text-sm text-muted-foreground max-w-md mx-auto">{{ $t('search.searchBy') }}</p>
         </div>
       </div>
     </div>
@@ -43,10 +62,12 @@
 </template>
 
 <script setup>
-import { ref, computed, watch, onBeforeUnmount } from 'vue'
+import { ref, computed, watch, onMounted, onBeforeUnmount } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
+import { Search as SearchIcon, X } from 'lucide-vue-next'
 import { Button } from '@shared-ui/components/ui/button'
+import { Input } from '@shared-ui/components/ui/input'
 import Spinner from '@shared-ui/components/ui/spinner/Spinner.vue'
 import SearchHeader from '@main/features/search/SearchHeader.vue'
 import SearchFilters from '@main/features/search/SearchFilters.vue'
@@ -69,6 +90,7 @@ const router = useRouter()
 const emptyPage = () => ({ results: [], total: 0, page: 1, per_page: DEFAULT_PER_PAGE, total_pages: 0 })
 const emptyResults = () => ({ conversations: emptyPage(), messages: emptyPage() })
 
+const inputRef = ref(null)
 const term = ref(String(route.query.q || ''))
 const filters = ref(filtersFromQuery(route.query))
 const activeTab = ref(TABS.includes(route.query.tab) ? route.query.tab : 'conversations')
@@ -171,6 +193,8 @@ watch(activeTab, syncRoute)
 
 if (term.value.length >= MIN_SEARCH_LENGTH) search()
 
+onMounted(() => inputRef.value?.$el?.focus?.())
+
 onBeforeUnmount(() => {
   clearTimeout(debounceTimer)
 })
diff --git a/i18n/en-US.json b/i18n/en-US.json
index bc5d54a1..99be35b2 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -1462,6 +1462,7 @@
   "search.adjustSearchTerms": "Try adjusting your search terms or filters.",
   "search.clearFilters": "Clear filters",
   "search.minQueryLength": " Please enter at least {length} characters to search.",
+  "search.placeholder": "Search by reference number, subject, contact or message text",
   "search.noResultsForQuery": "No results found for query `{query}`. Try a different search term.",
   "search.searchBy": "Search by reference number, subject, contact name or email, or message text.",
   "setup.completeYourSetup": "Complete your setup",

From e0c38a9a1f43fb71b22ac1d1bf75604a15a63388 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 16 Sep 2026 14:26:19 +0530
Subject: [PATCH 068/178] fix tag filter chips showing ids and date range
 overflowing the filter row

---
 frontend/apps/main/src/features/search/SearchFilters.vue  | 4 ++--
 frontend/apps/main/src/features/search/searchFilters.js   | 5 ++---
 .../apps/main/src/features/search/searchFilters.test.js   | 8 ++++----
 3 files changed, 8 insertions(+), 9 deletions(-)

diff --git a/frontend/apps/main/src/features/search/SearchFilters.vue b/frontend/apps/main/src/features/search/SearchFilters.vue
index c36aa863..bc1a20e2 100644
--- a/frontend/apps/main/src/features/search/SearchFilters.vue
+++ b/frontend/apps/main/src/features/search/SearchFilters.vue
@@ -45,7 +45,7 @@
         @update:model-value="set('team', $event)"
       />
     </div>
-    <div class="flex-[1.5] min-w-40">
+    <div class="flex-[2] min-w-56">
       <SelectTagCombobox
         :model-value="filters.tags"
         :placeholder="t('globals.terms.tag', 2)"
@@ -54,7 +54,7 @@
         @update:model-value="set('tags', $event)"
       />
     </div>
-    <div class="flex-1 min-w-44">
+    <div class="flex-[1.5] min-w-60">
       <DateFilterValue
         :model-value="filters.created"
         range
diff --git a/frontend/apps/main/src/features/search/searchFilters.js b/frontend/apps/main/src/features/search/searchFilters.js
index 8bf01773..7354e463 100644
--- a/frontend/apps/main/src/features/search/searchFilters.js
+++ b/frontend/apps/main/src/features/search/searchFilters.js
@@ -20,8 +20,7 @@ export const filtersFromQuery = (query) => {
     if (key === 'tags') {
       filters.tags = String(raw)
         .split(',')
-        .map((v) => Number(v))
-        .filter((v) => Number.isInteger(v) && v > 0)
+        .filter((v) => /^[1-9]\d*$/.test(v))
     } else {
       filters[key] = String(raw)
     }
@@ -62,7 +61,7 @@ export const toFiltersJSON = (filters) => {
   if (filters.inbox) rules.push(leaf('inbox_id', 'equals', filters.inbox))
   if (filters.assignee) rules.push(assignmentLeaf('assigned_user_id', filters.assignee))
   if (filters.team) rules.push(assignmentLeaf('assigned_team_id', filters.team))
-  if (filters.tags?.length) rules.push(leaf('tags', 'contains', JSON.stringify(filters.tags)))
+  if (filters.tags?.length) rules.push(leaf('tags', 'contains', JSON.stringify(filters.tags.map(Number))))
   if (filters.created) rules.push(leaf('created_at', 'between', filters.created))
   return rules.length ? JSON.stringify(rules) : ''
 }
diff --git a/frontend/apps/main/src/features/search/searchFilters.test.js b/frontend/apps/main/src/features/search/searchFilters.test.js
index 471e226d..0def0d42 100644
--- a/frontend/apps/main/src/features/search/searchFilters.test.js
+++ b/frontend/apps/main/src/features/search/searchFilters.test.js
@@ -13,7 +13,7 @@ describe('searchFilters', () => {
     const filters = {
       ...emptyFilters(),
       status: '2',
-      tags: [3, 7],
+      tags: ['3', '7'],
       created: '2026-01-01,2026-01-31'
     }
     expect(filtersFromQuery(queryFromFilters(filters))).toEqual(filters)
@@ -21,12 +21,12 @@ describe('searchFilters', () => {
 
   it('drops empty values and junk tag ids from the query', () => {
     expect(queryFromFilters(emptyFilters())).toEqual({})
-    expect(filtersFromQuery({ tags: 'a,0,-1,4,', status: '' }).tags).toEqual([4])
+    expect(filtersFromQuery({ tags: 'a,0,-1,4,', status: '' }).tags).toEqual(['4'])
   })
 
   it('reports whether any filter is active', () => {
     expect(hasActiveFilters(emptyFilters())).toBe(false)
-    expect(hasActiveFilters({ ...emptyFilters(), tags: [1] })).toBe(true)
+    expect(hasActiveFilters({ ...emptyFilters(), tags: ['1'] })).toBe(true)
     expect(hasActiveFilters({ ...emptyFilters(), inbox: '5' })).toBe(true)
   })
 
@@ -36,7 +36,7 @@ describe('searchFilters', () => {
       status: '1',
       assignee: UNASSIGNED,
       team: '9',
-      tags: [2, 5],
+      tags: ['2', '5'],
       created: '2026-01-01,2026-01-31'
     })
     expect(JSON.parse(json)).toEqual([

From ec73a17bd3984a3ebb85eeac2cdaf670e599acd3 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 16 Sep 2026 14:28:05 +0530
Subject: [PATCH 069/178] give search result rows more space and a single meta
 line

---
 .../src/features/search/SearchResultItem.vue  | 78 ++++++++++---------
 1 file changed, 42 insertions(+), 36 deletions(-)

diff --git a/frontend/apps/main/src/features/search/SearchResultItem.vue b/frontend/apps/main/src/features/search/SearchResultItem.vue
index 96d1f9cb..2747b2a7 100644
--- a/frontend/apps/main/src/features/search/SearchResultItem.vue
+++ b/frontend/apps/main/src/features/search/SearchResultItem.vue
@@ -1,57 +1,78 @@
 <template>
   <router-link
     :to="{ name: 'inbox-conversation', params: { uuid: conversationUUID, type: 'assigned' } }"
-    class="grid grid-cols-[auto_minmax(0,1fr)_auto] gap-3 px-4 py-3 hover:bg-accent/40 transition-colors"
+    class="flex gap-4 px-5 py-4 hover:bg-accent/40 transition-colors"
   >
-    <Avatar class="w-9 h-9 rounded-full mt-0.5">
+    <Avatar class="w-10 h-10 rounded-full shrink-0 mt-0.5">
       <AvatarImage :src="item.contact.avatar_url || ''" class="object-cover" />
       <AvatarFallback>{{ initials(item.contact.first_name) }}</AvatarFallback>
     </Avatar>
 
-    <div class="min-w-0 space-y-1">
-      <div class="flex items-baseline gap-2 text-sm min-w-0">
-        <span class="font-medium text-foreground truncate">
-          <HighlightedText :text="contactName" :term="term" />
-        </span>
-        <span v-if="item.contact.email" class="text-muted-foreground truncate">
-          <HighlightedText :text="item.contact.email" :term="term" />
-        </span>
+    <div class="min-w-0 flex-1">
+      <div class="flex items-baseline justify-between gap-4">
+        <div class="flex items-baseline gap-2 min-w-0 text-sm">
+          <span class="font-medium text-foreground truncate">
+            <HighlightedText :text="contactName" :term="term" />
+          </span>
+          <span v-if="item.contact.email" class="text-muted-foreground truncate hidden sm:inline">
+            <HighlightedText :text="item.contact.email" :term="term" />
+          </span>
+        </div>
+        <time
+          :datetime="timestamp"
+          :title="format(new Date(timestamp), 'MMM d, yyyy HH:mm')"
+          class="text-xs text-muted-foreground whitespace-nowrap tabular-nums shrink-0"
+        >
+          {{ getRelativeTime(timestamp) }}
+        </time>
       </div>
 
-      <p class="text-sm truncate" :class="subject ? 'text-foreground font-medium' : 'text-muted-foreground italic'">
+      <p
+        class="mt-1 text-base leading-snug truncate"
+        :class="subject ? 'font-medium text-foreground' : 'text-muted-foreground'"
+      >
         <HighlightedText v-if="subject" :text="subject" :term="term" />
         <template v-else>{{ t('globals.terms.noSubject') }}</template>
       </p>
 
-      <p v-if="snippet" class="text-sm text-muted-foreground line-clamp-2 break-words">
+      <p
+        v-if="snippet"
+        class="mt-1 text-sm leading-relaxed text-muted-foreground break-words"
+        :class="isConversation ? 'truncate' : 'line-clamp-2'"
+      >
         <template v-if="!isConversation">
           <span class="text-foreground">{{ senderName }}</span>
-          <Badge v-if="item.private" variant="secondary" class="mx-1.5 text-xs font-normal">
+          <span v-if="item.private" class="mx-1.5 rounded-md bg-secondary px-1.5 py-0.5 text-xs text-secondary-foreground">
             {{ t('globals.terms.privateNote') }}
-          </Badge>
-          <Badge v-else-if="item.type === 'outgoing'" variant="outline" class="mx-1.5 text-xs font-normal">
+          </span>
+          <span v-else-if="item.type === 'outgoing'" class="mx-1.5 rounded-md border px-1.5 py-0.5 text-xs">
             {{ t('globals.terms.reply') }}
-          </Badge>
+          </span>
           <span v-else>: </span>
         </template>
         <HighlightedText :text="snippet" :term="term" />
       </p>
 
-      <div class="flex flex-wrap items-center gap-x-3 gap-y-1 text-xs text-muted-foreground pt-0.5">
+      <div class="mt-2.5 flex flex-wrap items-center gap-x-4 gap-y-1.5 text-xs text-muted-foreground">
+        <Badge v-if="status" variant="outline" class="font-normal">{{ status }}</Badge>
+        <span v-if="item.priority" class="inline-flex items-center gap-1">
+          <PriorityMarker :priority="item.priority" />
+          {{ item.priority }}
+        </span>
         <span class="tabular-nums">#{{ referenceNumber }}</span>
-        <span v-if="item.inbox_name" class="inline-flex items-center gap-1 min-w-0">
+        <span v-if="item.inbox_name" class="inline-flex items-center gap-1.5 min-w-0">
           <component :is="item.inbox_channel === 'livechat' ? MessageSquare : Mail" class="w-3.5 h-3.5 shrink-0" aria-hidden="true" />
           <span class="truncate">{{ item.inbox_name }}</span>
         </span>
-        <span class="inline-flex items-center gap-1 min-w-0">
+        <span class="inline-flex items-center gap-1.5 min-w-0">
           <UserRound class="w-3.5 h-3.5 shrink-0" aria-hidden="true" />
           <span class="truncate">{{ assigneeName || t('globals.terms.unassigned') }}</span>
         </span>
-        <span v-if="item.team_name" class="inline-flex items-center gap-1 min-w-0">
+        <span v-if="item.team_name" class="inline-flex items-center gap-1.5 min-w-0">
           <UsersRound class="w-3.5 h-3.5 shrink-0" aria-hidden="true" />
           <span class="truncate">{{ item.team_name }}</span>
         </span>
-        <span v-if="item.tags?.length" class="inline-flex items-center gap-1 flex-wrap">
+        <span v-if="item.tags?.length" class="inline-flex items-center gap-1.5 flex-wrap">
           <Tag class="w-3.5 h-3.5 shrink-0" aria-hidden="true" />
           <span v-for="tag in item.tags" :key="tag" class="rounded-md bg-secondary px-1.5 py-0.5 text-secondary-foreground">
             {{ tag }}
@@ -59,21 +80,6 @@
         </span>
       </div>
     </div>
-
-    <div class="flex flex-col items-end gap-1.5 shrink-0">
-      <time
-        :datetime="timestamp"
-        :title="format(new Date(timestamp), 'MMM d, yyyy HH:mm')"
-        class="text-xs text-muted-foreground whitespace-nowrap tabular-nums"
-      >
-        {{ getRelativeTime(timestamp) }}
-      </time>
-      <Badge v-if="status" variant="outline" class="text-xs font-normal">{{ status }}</Badge>
-      <span v-if="item.priority" class="inline-flex items-center gap-1 text-xs text-muted-foreground">
-        <PriorityMarker :priority="item.priority" />
-        {{ item.priority }}
-      </span>
-    </div>
   </router-link>
 </template>
 

From c758576f2f4b0fafb9df1a083163c1e1059a7de7 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 16 Sep 2026 14:29:52 +0530
Subject: [PATCH 070/178] separate search result meta items with a middle dot

---
 frontend/apps/main/src/features/search/SearchResultItem.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/features/search/SearchResultItem.vue b/frontend/apps/main/src/features/search/SearchResultItem.vue
index 2747b2a7..a24c3115 100644
--- a/frontend/apps/main/src/features/search/SearchResultItem.vue
+++ b/frontend/apps/main/src/features/search/SearchResultItem.vue
@@ -53,7 +53,9 @@
         <HighlightedText :text="snippet" :term="term" />
       </p>
 
-      <div class="mt-2.5 flex flex-wrap items-center gap-x-4 gap-y-1.5 text-xs text-muted-foreground">
+      <div
+        class="mt-2.5 flex flex-wrap items-center gap-x-2 gap-y-1.5 text-xs text-muted-foreground [&>*+*]:before:content-['·'] [&>*+*]:before:mr-2 [&>*+*]:before:text-muted-foreground/60"
+      >
         <Badge v-if="status" variant="outline" class="font-normal">{{ status }}</Badge>
         <span v-if="item.priority" class="inline-flex items-center gap-1">
           <PriorityMarker :priority="item.priority" />

From 8b790800f0921b9cfda29d983a6ef294773d02b8 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 16 Sep 2026 14:32:23 +0530
Subject: [PATCH 071/178] keep search pagination bar flush at the end of the
 page

---
 frontend/apps/main/src/views/search/SearchView.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/views/search/SearchView.vue b/frontend/apps/main/src/views/search/SearchView.vue
index 6da50842..449d3ab4 100644
--- a/frontend/apps/main/src/views/search/SearchView.vue
+++ b/frontend/apps/main/src/views/search/SearchView.vue
@@ -2,7 +2,7 @@
   <div class="flex flex-col h-screen">
     <SearchHeader />
     <div class="flex-1 overflow-y-auto">
-      <div class="max-w-6xl mx-auto px-4 py-6 space-y-4">
+      <div class="max-w-6xl mx-auto px-4 pt-6 space-y-4">
         <div class="relative">
           <SearchIcon
             class="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-muted-foreground pointer-events-none"

From 75ab05cc5fefe4fdaba7bfd249e5357c37a1747e Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 16 Sep 2026 23:07:37 +0530
Subject: [PATCH 072/178] show a loader while notification settings load

---
 .../NotificationPreferences.test.js           |  33 +++++
 .../notifications/NotificationPreferences.vue | 120 ++++++++++--------
 2 files changed, 97 insertions(+), 56 deletions(-)

diff --git a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js
index 993c69d8..781df0a5 100644
--- a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js
+++ b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.test.js
@@ -79,6 +79,39 @@ const mount = async (vapidPublicKey = 'test-key') => {
 }
 
 describe('notification preferences', () => {
+  it('shows a loader until preferences are loaded', async () => {
+    let finishLoad
+    getPreferences.mockReturnValueOnce(
+      new Promise((resolve) => {
+        finishLoad = resolve
+      })
+    )
+    root = document.createElement('div')
+    document.body.append(root)
+    app = createApp(NotificationPreferences)
+    app.config.globalProperties.$t = (key) => key
+    app.mount(root)
+    await nextTick()
+
+    expect(root.querySelector('[role="status"]')).not.toBeNull()
+    expect(root.querySelectorAll('button')).toHaveLength(0)
+
+    finishLoad({
+      data: {
+        data: {
+          email_enabled: true,
+          vapid_public_key: 'test-key',
+          push_endpoints: [],
+          preferences: []
+        }
+      }
+    })
+    await settle()
+
+    expect(root.querySelector('[role="status"]')).toBeNull()
+    expect(root.querySelectorAll('button')).toHaveLength(1)
+  })
+
   it('saves a channel toggle', async () => {
     await mount()
     const email = root.querySelectorAll('button')[2]
diff --git a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
index 313e293d..3e21f9aa 100644
--- a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
+++ b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
@@ -1,73 +1,77 @@
 <template>
-  <div class="h-full">
+  <div class="h-full relative">
     <div class="flex flex-col space-y-5 max-w-2xl">
       <div class="space-y-1">
         <span class="sub-title">{{ $t('globals.terms.notification', 2) }}</span>
       </div>
 
-      <p v-if="!emailEnabled" class="text-muted-foreground text-xs">
-        {{ $t('notification.emailChannelDisabled') }}
-      </p>
+      <Spinner v-if="isLoading" />
 
-      <div
-        class="flex items-center justify-between gap-4 border border-border rounded-md px-4 py-3"
-      >
-        <div class="space-y-1">
-          <p class="text-sm text-foreground">
-            {{ $t('globals.terms.browserNotification', 2) }}
-          </p>
-          <p v-if="browserPushDescription" class="text-xs text-muted-foreground">
-            {{ browserPushDescription }}
-          </p>
-        </div>
-        <DotLoader
-          v-if="isUpdatingBrowserPush"
-          role="status"
-          :aria-label="$t('globals.terms.loading')"
-        />
-        <Switch
-          v-else
-          :checked="pushNotifications.enabled.value"
-          :disabled="
-            !pushNotifications.supported.value ||
-            pushNotifications.permission.value === 'denied' ||
-            !vapidPublicKey
-          "
-          :aria-label="$t('globals.terms.browserNotification', 2)"
-          @update:checked="updateBrowserPush"
-        />
-      </div>
+      <template v-else>
+        <p v-if="!emailEnabled" class="text-muted-foreground text-xs">
+          {{ $t('notification.emailChannelDisabled') }}
+        </p>
 
-      <div class="border border-border rounded-md divide-y divide-border">
-        <div class="flex items-center px-4 py-2 text-xs font-medium text-muted-foreground">
-          <div class="flex-grow" />
-          <div v-for="channel in channels" :key="channel.key" class="w-20 text-center">
-            {{ $t(channel.labelKey) }}
+        <div
+          class="flex items-center justify-between gap-4 border border-border rounded-md px-4 py-3"
+        >
+          <div class="space-y-1">
+            <p class="text-sm text-foreground">
+              {{ $t('globals.terms.browserNotification', 2) }}
+            </p>
+            <p v-if="browserPushDescription" class="text-xs text-muted-foreground">
+              {{ browserPushDescription }}
+            </p>
           </div>
+          <DotLoader
+            v-if="isUpdatingBrowserPush"
+            role="status"
+            :aria-label="$t('globals.terms.loading')"
+          />
+          <Switch
+            v-else
+            :checked="pushNotifications.enabled.value"
+            :disabled="
+              !pushNotifications.supported.value ||
+              pushNotifications.permission.value === 'denied' ||
+              !vapidPublicKey
+            "
+            :aria-label="$t('globals.terms.browserNotification', 2)"
+            @update:checked="updateBrowserPush"
+          />
         </div>
 
-        <div v-for="row in rows" :key="row.type" class="flex items-center px-4 py-3">
-          <div class="flex-grow pr-4">
-            <p class="text-sm text-foreground">{{ typeLabel(row.type) }}</p>
+        <div class="border border-border rounded-md divide-y divide-border">
+          <div class="flex items-center px-4 py-2 text-xs font-medium text-muted-foreground">
+            <div class="flex-grow" />
+            <div v-for="channel in channels" :key="channel.key" class="w-20 text-center">
+              {{ $t(channel.labelKey) }}
+            </div>
           </div>
-          <div v-for="channel in channels" :key="channel.key" class="w-20 flex justify-center">
-            <Switch
-              :checked="row[channel.key]"
-              :disabled="
-                (channel.key === 'email' && !emailEnabled) ||
-                pendingUpdates.has(preferenceKey(row.type, channel.key))
-              "
-              :aria-label="
-                $t('notification.channelToggleLabel', {
-                  channel: $t(channel.labelKey),
-                  type: typeLabel(row.type)
-                })
-              "
-              @update:checked="update(row, channel.key, $event)"
-            />
+
+          <div v-for="row in rows" :key="row.type" class="flex items-center px-4 py-3">
+            <div class="flex-grow pr-4">
+              <p class="text-sm text-foreground">{{ typeLabel(row.type) }}</p>
+            </div>
+            <div v-for="channel in channels" :key="channel.key" class="w-20 flex justify-center">
+              <Switch
+                :checked="row[channel.key]"
+                :disabled="
+                  (channel.key === 'email' && !emailEnabled) ||
+                  pendingUpdates.has(preferenceKey(row.type, channel.key))
+                "
+                :aria-label="
+                  $t('notification.channelToggleLabel', {
+                    channel: $t(channel.labelKey),
+                    type: typeLabel(row.type)
+                  })
+                "
+                @update:checked="update(row, channel.key, $event)"
+              />
+            </div>
           </div>
         </div>
-      </div>
+      </template>
     </div>
   </div>
 </template>
@@ -77,6 +81,7 @@ import { computed, ref, onMounted } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { Switch } from '@shared-ui/components/ui/switch'
 import { DotLoader } from '@shared-ui/components/ui/loader'
+import { Spinner } from '@shared-ui/components/ui/spinner'
 import { useEmitter } from '@/composables/useEmitter'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
 import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
@@ -86,6 +91,7 @@ import { usePushNotifications } from '@/composables/usePushNotifications'
 const { t } = useI18n()
 const emitter = useEmitter()
 const rows = ref([])
+const isLoading = ref(true)
 const emailEnabled = ref(true)
 const vapidPublicKey = ref('')
 const pendingUpdates = ref(new Set())
@@ -132,6 +138,8 @@ const fetchPreferences = async () => {
       variant: 'destructive',
       description: handleHTTPError(error).message
     })
+  } finally {
+    isLoading.value = false
   }
 }
 

From ba349158bcd8a8b833f581c26c7cb14818f74696 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 17 Sep 2026 00:31:44 +0530
Subject: [PATCH 073/178] add notification settings link

---
 .../src/components/sidebar/NotificationPanel.vue   | 14 +++++++++++++-
 i18n/en-US.json                                    |  1 +
 2 files changed, 14 insertions(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/components/sidebar/NotificationPanel.vue b/frontend/apps/main/src/components/sidebar/NotificationPanel.vue
index 7087d6a2..cbc13e14 100644
--- a/frontend/apps/main/src/components/sidebar/NotificationPanel.vue
+++ b/frontend/apps/main/src/components/sidebar/NotificationPanel.vue
@@ -119,6 +119,17 @@
         </Button>
       </div>
     </div>
+
+    <div class="flex justify-end border-t border-border p-1">
+      <router-link
+        :to="{ name: 'account-notifications' }"
+        :class="buttonVariants({ variant: 'ghost', size: 'sm' })"
+        @click="emit('close')"
+      >
+        <Settings aria-hidden="true" />
+        <span>{{ t('notification.settings') }}</span>
+      </router-link>
+    </div>
   </div>
 </template>
 
@@ -132,6 +143,7 @@ import {
   CheckCheck,
   X,
   Trash2,
+  Settings,
   AtSign,
   UserPlus,
   MessageSquare,
@@ -139,7 +151,7 @@ import {
   AlertTriangle,
   AlertCircle
 } from 'lucide-vue-next'
-import { Button } from '@shared-ui/components/ui/button'
+import { Button, buttonVariants } from '@shared-ui/components/ui/button'
 import { Skeleton } from '@shared-ui/components/ui/skeleton'
 import { useNotificationStore } from '@main/stores/notification'
 import { getRelativeTime } from '@shared-ui/utils/datetime.js'
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 64e39dcc..d8904399 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -1389,6 +1389,7 @@
   "notification.invalidPushSubscription": "This browser subscription is invalid. Disable and enable browser notifications, then try again.",
   "notification.mentionedInConversation": "{author} mentioned you in #{referenceNumber}",
   "notification.newReply": "New reply on #{referenceNumber}",
+  "notification.settings": "Notification settings",
   "notification.slaAlert": "SLA {type}: {metric} for #{referenceNumber}",
   "notification.slaDueIn": "Due in {duration}",
   "notification.slaOverdue": "Overdue by {duration}",

From cd4610a27aba2ff8ad1c2613b5204d943c6e08bc Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 17 Sep 2026 00:40:29 +0530
Subject: [PATCH 074/178] remove icon from new contact button

---
 frontend/apps/main/src/features/contact/ContactsList.vue | 5 ++---
 1 file changed, 2 insertions(+), 3 deletions(-)

diff --git a/frontend/apps/main/src/features/contact/ContactsList.vue b/frontend/apps/main/src/features/contact/ContactsList.vue
index 71dba87c..aa300190 100644
--- a/frontend/apps/main/src/features/contact/ContactsList.vue
+++ b/frontend/apps/main/src/features/contact/ContactsList.vue
@@ -49,10 +49,9 @@
         <Button
           v-if="userStore.can('contacts:write')"
           size="sm"
-          class="flex items-center h-8 gap-1 ml-auto"
+          class="flex items-center h-8 ml-auto"
           @click="showCreateDialog = true"
         >
-          <UserPlus size="16" />
           {{ $t('contact.new') }}
         </Button>
       </div>
@@ -140,7 +139,7 @@ import {
 } from '@shared-ui/components/ui/select'
 import { Input } from '@shared-ui/components/ui/input'
 import { Button } from '@shared-ui/components/ui/button'
-import { ArrowDownWideNarrow, IdCardIcon, UserPlus } from 'lucide-vue-next'
+import { ArrowDownWideNarrow, IdCardIcon } from 'lucide-vue-next'
 import { Popover, PopoverContent, PopoverTrigger } from '@shared-ui/components/ui/popover'
 import { useDebounceFn } from '@vueuse/core'
 import { EMITTER_EVENTS } from '@main/constants/emitterEvents.js'

From 2f1f67bf08ec2674a092d128fb5a2e4995a83fe3 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 17 Sep 2026 02:02:39 +0530
Subject: [PATCH 075/178] show pagination in a bordered panel

---
 .../apps/main/src/components/pagination/PaginationBar.vue   | 6 ++++--
 .../main/src/features/admin/activity-log/ActivityLog.vue    | 1 +
 2 files changed, 5 insertions(+), 2 deletions(-)

diff --git a/frontend/apps/main/src/components/pagination/PaginationBar.vue b/frontend/apps/main/src/components/pagination/PaginationBar.vue
index 7ba949c7..6f84e9ad 100644
--- a/frontend/apps/main/src/components/pagination/PaginationBar.vue
+++ b/frontend/apps/main/src/components/pagination/PaginationBar.vue
@@ -1,6 +1,8 @@
 <template>
-  <div class="sticky bottom-0 bg-background border-t border-border px-4 py-3 mt-auto">
-    <div class="flex flex-col sm:flex-row items-center justify-between gap-4">
+  <div class="sticky bottom-0 bg-background pt-3 pb-4 mt-auto">
+    <div
+      class="flex flex-col sm:flex-row items-center justify-between gap-4 rounded-md border border-border shadow-sm px-4 py-3"
+    >
       <div class="flex items-center gap-3">
         <span class="text-sm text-muted-foreground tabular-nums">
           {{ t('globals.messages.pageNofTotal', { page, total: totalPages }) }}
diff --git a/frontend/apps/main/src/features/admin/activity-log/ActivityLog.vue b/frontend/apps/main/src/features/admin/activity-log/ActivityLog.vue
index 87d3869c..bc12b7f2 100644
--- a/frontend/apps/main/src/features/admin/activity-log/ActivityLog.vue
+++ b/frontend/apps/main/src/features/admin/activity-log/ActivityLog.vue
@@ -80,6 +80,7 @@
     </div>
 
     <PaginationBar
+      class="-mx-6 sm:-mx-8 -mb-6 sm:-mb-8 px-6 sm:px-8"
       v-model:page="page"
       v-model:per-page="perPage"
       :total-pages="totalPages"

From 9391b50b8070c2da70221b764a74aa91fec74052 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 17 Sep 2026 02:29:30 +0530
Subject: [PATCH 076/178] fix search results and pagination

---
 cmd/search.go                                 |   6 +-
 .../src/components/filter/DateFilterValue.vue |  13 +-
 .../components/pagination/PaginationBar.vue   |  18 ++-
 .../src/features/search/SearchFilters.vue     |   5 +-
 .../src/features/search/SearchResults.vue     |   5 +-
 .../apps/main/src/views/search/SearchView.vue |   9 +-
 i18n/en-US.json                               |  12 +-
 internal/search/queries.sql                   |  19 ++-
 internal/search/search.go                     |  30 ++--
 internal/search/search_test.go                | 133 ++++++++++++++++++
 10 files changed, 207 insertions(+), 43 deletions(-)
 create mode 100644 internal/search/search_test.go

diff --git a/cmd/search.go b/cmd/search.go
index cc63cd0d..3efb2394 100644
--- a/cmd/search.go
+++ b/cmd/search.go
@@ -8,6 +8,7 @@ import (
 	amodels "github.com/abhinavxd/libredesk/internal/auth/models"
 	authzmodels "github.com/abhinavxd/libredesk/internal/authz/models"
 	"github.com/abhinavxd/libredesk/internal/envelope"
+	searchmanager "github.com/abhinavxd/libredesk/internal/search"
 	smodels "github.com/abhinavxd/libredesk/internal/search/models"
 	"github.com/zerodha/fastglue"
 )
@@ -77,12 +78,13 @@ func searchInputs(r *fastglue.Request) (*App, amodels.User, smodels.Query, error
 		return app, user, smodels.Query{}, envelope.NewError(envelope.InputError, app.i18n.Ts("search.minQueryLength", "length", fmt.Sprintf("%d", minSearchQueryLength)), nil)
 	}
 	page, pageSize := getPagination(r)
-	return app, user, smodels.Query{
+	query := searchmanager.NormalizeQuery(smodels.Query{
 		Term:     term,
 		Filters:  string(r.RequestCtx.QueryArgs().Peek("filters")),
 		Page:     page,
 		PageSize: pageSize,
-	}, nil
+	})
+	return app, user, query, nil
 }
 
 func pageResults(results any, total int, q smodels.Query) envelope.PageResults {
diff --git a/frontend/apps/main/src/components/filter/DateFilterValue.vue b/frontend/apps/main/src/components/filter/DateFilterValue.vue
index 76c24bb8..cfca98b5 100644
--- a/frontend/apps/main/src/components/filter/DateFilterValue.vue
+++ b/frontend/apps/main/src/components/filter/DateFilterValue.vue
@@ -3,6 +3,7 @@
     <Popover v-if="range" v-model:open="rangeOpen">
       <PopoverTrigger as-child>
         <Button
+          type="button"
           variant="outline"
           :class="
             cn(
@@ -11,8 +12,8 @@
             )
           "
         >
-          <CalendarIcon class="mr-2 h-4 w-4" />
-          {{ rangeLabel || t('globals.terms.pickDate') }}
+          <CalendarIcon class="mr-2 h-4 w-4" aria-hidden="true" />
+          {{ rangeLabel || placeholder || t('globals.terms.pickDate') }}
         </Button>
       </PopoverTrigger>
       <PopoverContent class="w-auto p-0">
@@ -26,6 +27,7 @@
     <Popover v-else v-model:open="open">
       <PopoverTrigger as-child>
         <Button
+          type="button"
           variant="outline"
           :class="
             cn(
@@ -34,8 +36,8 @@
             )
           "
         >
-          <CalendarIcon class="mr-2 h-4 w-4" />
-          {{ modelValue ? formatDisplay(modelValue) : t('globals.terms.pickDate') }}
+          <CalendarIcon class="mr-2 h-4 w-4" aria-hidden="true" />
+          {{ modelValue ? formatDisplay(modelValue) : placeholder || t('globals.terms.pickDate') }}
         </Button>
       </PopoverTrigger>
       <PopoverContent class="w-auto p-0">
@@ -64,7 +66,8 @@ const { t } = useI18n()
 const modelValue = defineModel({ type: String, default: '' })
 
 defineProps({
-  range: { type: Boolean, default: false }
+  range: { type: Boolean, default: false },
+  placeholder: { type: String, default: '' }
 })
 
 const open = ref(false)
diff --git a/frontend/apps/main/src/components/pagination/PaginationBar.vue b/frontend/apps/main/src/components/pagination/PaginationBar.vue
index 6f84e9ad..92dda21d 100644
--- a/frontend/apps/main/src/components/pagination/PaginationBar.vue
+++ b/frontend/apps/main/src/components/pagination/PaginationBar.vue
@@ -8,7 +8,7 @@
           {{ t('globals.messages.pageNofTotal', { page, total: totalPages }) }}
         </span>
         <Select :model-value="perPage" @update:model-value="handlePerPageChange">
-          <SelectTrigger class="h-8 w-[70px]">
+          <SelectTrigger class="h-8 w-[70px]" :aria-label="t('globals.messages.resultsPerPage')">
             <SelectValue :placeholder="String(perPage)" />
           </SelectTrigger>
           <SelectContent>
@@ -24,19 +24,21 @@
           variant="ghost"
           size="sm"
           class="h-8 w-8 p-0"
+          :aria-label="t('globals.messages.firstPage')"
           :disabled="page <= 1"
           @click="goToPage(1)"
         >
-          <ChevronsLeft class="h-4 w-4" />
+          <ChevronsLeft class="h-4 w-4" aria-hidden="true" />
         </Button>
         <Button
           variant="ghost"
           size="sm"
           class="h-8 w-8 p-0"
+          :aria-label="t('globals.messages.previousPage')"
           :disabled="page <= 1"
           @click="goToPage(page - 1)"
         >
-          <ChevronLeft class="h-4 w-4" />
+          <ChevronLeft class="h-4 w-4" aria-hidden="true" />
         </Button>
 
         <div class="flex items-center bg-muted rounded-lg p-1">
@@ -66,19 +68,21 @@
           variant="ghost"
           size="sm"
           class="h-8 w-8 p-0"
+          :aria-label="t('globals.messages.nextPage')"
           :disabled="page >= totalPages"
           @click="goToPage(page + 1)"
         >
-          <ChevronRight class="h-4 w-4" />
+          <ChevronRight class="h-4 w-4" aria-hidden="true" />
         </Button>
         <Button
           variant="ghost"
           size="sm"
           class="h-8 w-8 p-0"
+          :aria-label="t('globals.messages.lastPage')"
           :disabled="page >= totalPages"
           @click="goToPage(totalPages)"
         >
-          <ChevronsRight class="h-4 w-4" />
+          <ChevronsRight class="h-4 w-4" aria-hidden="true" />
         </Button>
       </div>
     </div>
@@ -106,7 +110,7 @@ const props = defineProps({
   perPageOptions: { type: Array, default: () => [15, 30, 50, 100] }
 })
 
-const emit = defineEmits(['update:page', 'update:perPage'])
+const emit = defineEmits(['update:page', 'update:perPage', 'change'])
 
 const { t } = useI18n()
 
@@ -115,11 +119,13 @@ const visiblePages = computed(() => getVisiblePages(props.page, props.totalPages
 function goToPage(p) {
   if (p >= 1 && p <= props.totalPages && p !== props.page) {
     emit('update:page', p)
+    emit('change', { page: p, perPage: props.perPage })
   }
 }
 
 function handlePerPageChange(newPerPage) {
   emit('update:perPage', newPerPage)
   emit('update:page', 1)
+  emit('change', { page: 1, perPage: newPerPage })
 }
 </script>
diff --git a/frontend/apps/main/src/features/search/SearchFilters.vue b/frontend/apps/main/src/features/search/SearchFilters.vue
index bc1a20e2..9bade9fd 100644
--- a/frontend/apps/main/src/features/search/SearchFilters.vue
+++ b/frontend/apps/main/src/features/search/SearchFilters.vue
@@ -57,6 +57,7 @@
     <div class="flex-[1.5] min-w-60">
       <DateFilterValue
         :model-value="filters.created"
+        :placeholder="t('search.conversationCreatedDate')"
         range
         @update:model-value="set('created', $event)"
       />
@@ -69,8 +70,8 @@
       class="text-muted-foreground"
       @click="emit('update:filters', emptyFilters())"
     >
-      <X class="w-4 h-4 mr-1" />
-      {{ t('search.clearFilters') }}
+      <X class="w-4 h-4 mr-1" aria-hidden="true" />
+      {{ t('globals.messages.clearFilters') }}
     </Button>
   </div>
 </template>
diff --git a/frontend/apps/main/src/features/search/SearchResults.vue b/frontend/apps/main/src/features/search/SearchResults.vue
index 96911e78..c97efd6c 100644
--- a/frontend/apps/main/src/features/search/SearchResults.vue
+++ b/frontend/apps/main/src/features/search/SearchResults.vue
@@ -29,8 +29,7 @@
           :page="results[type].page"
           :per-page="results[type].per_page"
           :total-pages="results[type].total_pages"
-          @update:page="emit('changePage', { type, page: $event })"
-          @update:per-page="emit('changePerPage', { type, perPage: $event })"
+          @change="emit('changePage', { type, ...$event })"
         />
       </TabsContent>
     </Tabs>
@@ -54,7 +53,7 @@ defineProps({
   term: { type: String, default: '' },
   activeTab: { type: String, required: true }
 })
-const emit = defineEmits(['update:activeTab', 'changePage', 'changePerPage'])
+const emit = defineEmits(['update:activeTab', 'changePage'])
 
 const { t } = useI18n()
 </script>
diff --git a/frontend/apps/main/src/views/search/SearchView.vue b/frontend/apps/main/src/views/search/SearchView.vue
index 449d3ab4..73839e30 100644
--- a/frontend/apps/main/src/views/search/SearchView.vue
+++ b/frontend/apps/main/src/views/search/SearchView.vue
@@ -11,7 +11,8 @@
           <Input
             ref="inputRef"
             v-model="term"
-            :placeholder="$t('search.placeholder')"
+            :placeholder="$t('search.searchBy')"
+            :aria-label="$t('globals.terms.search')"
             class="h-12 pl-10 pr-10 text-base"
           />
           <button
@@ -21,7 +22,7 @@
             :aria-label="$t('globals.terms.clear')"
             @click="term = ''"
           >
-            <X class="w-4 h-4" />
+            <X class="w-4 h-4" aria-hidden="true" />
           </button>
         </div>
 
@@ -44,7 +45,6 @@
           :term="term"
           v-model:active-tab="activeTab"
           @change-page="changePage"
-          @change-per-page="changePerPage"
         />
         <p
           v-else-if="term.length > 0 && term.length < MIN_SEARCH_LENGTH"
@@ -159,8 +159,7 @@ const fetchPage = async (type, page, perPage) => {
   }
 }
 
-const changePage = ({ type, page }) => fetchPage(type, page, results.value[type].per_page)
-const changePerPage = ({ type, perPage }) => fetchPage(type, 1, perPage)
+const changePage = ({ type, page, perPage }) => fetchPage(type, page, perPage)
 
 const syncRoute = () => {
   const query = { ...queryFromFilters(filters.value) }
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 60313d46..cfea93b6 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -835,6 +835,7 @@
   "globals.messages.approve": "Approve",
   "globals.messages.reject": "Reject",
   "globals.messages.caseSensitiveMatch": "Case sensitive match",
+  "globals.messages.clearFilters": "Clear filters",
   "globals.messages.close": "Close",
   "globals.messages.closeChat": "Close chat",
   "globals.messages.connected": "Connected",
@@ -862,6 +863,7 @@
   "globals.messages.exportData": "Export data",
   "globals.messages.false": "False",
   "globals.messages.fileTypeisNotAnImage": "File type is not an image",
+  "globals.messages.firstPage": "First page",
   "globals.messages.goBack": "Go back",
   "globals.messages.golangDurationHoursMinutes": "Duration in hours or minutes. Example: 1h, 30m, 1h30m",
   "globals.messages.gradientEnd": "Gradient end",
@@ -875,6 +877,7 @@
   "globals.messages.insertExample": "Insert example",
   "globals.messages.invalidFilters": "Invalid filters.",
   "globals.messages.invite": "Invite",
+  "globals.messages.lastPage": "Last page",
   "globals.messages.lastUsed": "Last used",
   "globals.messages.linkUrl": "Link URL",
   "globals.messages.markAllAsRead": "Mark all as read",
@@ -885,6 +888,7 @@
   "globals.messages.mustBeNumber": "Must be a number",
   "globals.messages.nDays": "{days} days",
   "globals.messages.new": "New",
+  "globals.messages.nextPage": "Next page",
   "globals.messages.moveUp": "Move up",
   "globals.messages.moveDown": "Move down",
   "globals.messages.no": "No",
@@ -901,6 +905,7 @@
   "globals.messages.pleaseRateConversation": "Please rate this conversation:",
   "globals.messages.pleaseSelect": "Please select {name} before submitting",
   "globals.messages.pressEnterToSelectAValue": "Press enter to select a value",
+  "globals.messages.previousPage": "Previous page",
   "globals.messages.publish": "Publish",
   "globals.messages.reassigning": "Reassigning",
   "globals.messages.regenerate": "Regenerate",
@@ -908,6 +913,7 @@
   "globals.messages.required": "{name} Required",
   "globals.messages.reset": "Reset",
   "globals.messages.resetToDefault": "Reset to default",
+  "globals.messages.resultsPerPage": "Results per page",
   "globals.messages.revoke": "Revoke",
   "globals.messages.save": "Save",
   "globals.messages.saveChanges": "Save changes",
@@ -978,6 +984,7 @@
   "globals.terms.callbackURL": "Callback URL",
   "globals.terms.category": "Category",
   "globals.terms.channel": "Channel",
+  "globals.terms.clear": "Clear",
   "globals.terms.clientID": "Client ID",
   "globals.terms.clientSecret": "Client secret",
   "globals.terms.closed": "Closed",
@@ -1485,11 +1492,10 @@
   "role.new": "New role",
   "role.select": "Select roles",
   "search.adjustSearchTerms": "Try adjusting your search terms or filters.",
-  "search.clearFilters": "Clear filters",
+  "search.conversationCreatedDate": "Conversation created date",
   "search.minQueryLength": " Please enter at least {length} characters to search.",
-  "search.placeholder": "Search by reference number, subject, contact or message text",
   "search.noResultsForQuery": "No results found for query `{query}`. Try a different search term.",
-  "search.searchBy": "Search by reference number, subject, contact name or email, or message text.",
+  "search.searchBy": "Search by reference number, contact email or message text",
   "setup.completeYourSetup": "Complete your setup",
   "setup.createFirstInbox": "Create your first inbox",
   "setup.inviteTeammates": "Invite teammates",
diff --git a/internal/search/queries.sql b/internal/search/queries.sql
index 48b0f05a..682e2963 100644
--- a/internal/search/queries.sql
+++ b/internal/search/queries.sql
@@ -1,4 +1,16 @@
 -- name: search-conversations
+WITH matched_conversations AS (
+    SELECT id
+    FROM conversations
+    WHERE reference_number = $1
+
+    UNION ALL
+
+    SELECT conversations.id
+    FROM users
+    JOIN conversations ON conversations.contact_id = users.id
+    WHERE users.email ILIKE '%' || $1 || '%'
+)
 SELECT
     COUNT(*) OVER() AS total,
     conversations.created_at,
@@ -32,12 +44,7 @@ LEFT JOIN teams ON conversations.assigned_team_id = teams.id
 LEFT JOIN inboxes ON conversations.inbox_id = inboxes.id
 LEFT JOIN conversation_statuses cs ON conversations.status_id = cs.id
 LEFT JOIN conversation_priorities cp ON conversations.priority_id = cp.id
-WHERE (
-       conversations.reference_number::text = $1
-    OR conversations.subject ILIKE '%' || $1 || '%'
-    OR users.email ILIKE '%' || $1 || '%'
-    OR CONCAT_WS(' ', users.first_name, users.last_name) ILIKE '%' || $1 || '%'
-  )
+WHERE conversations.id IN (SELECT id FROM matched_conversations)
   AND $3
   AND (
        $4
diff --git a/internal/search/search.go b/internal/search/search.go
index 3ecb6807..c3c8d4c2 100644
--- a/internal/search/search.go
+++ b/internal/search/search.go
@@ -3,6 +3,7 @@ package search
 
 import (
 	"embed"
+	"fmt"
 
 	"github.com/abhinavxd/libredesk/internal/dbutil"
 	"github.com/abhinavxd/libredesk/internal/envelope"
@@ -13,7 +14,12 @@ import (
 	"github.com/zerodha/logf"
 )
 
-const maxPageSize = 100
+const (
+	maxPageSize = 100
+
+	conversationResultOrder = "(conversations.reference_number = $1) DESC, conversations.last_message_at DESC NULLS LAST"
+	messageResultOrder      = "conversation_messages.created_at DESC NULLS LAST"
+)
 
 var (
 	//go:embed queries.sql
@@ -69,7 +75,7 @@ func New(opts Opts) (*Manager, error) {
 
 // Conversations searches conversations the agent is allowed to read, returning the page and the total match count.
 func (s *Manager) Conversations(query models.Query, scope models.ReadScope) ([]models.ConversationResult, int, error) {
-	sql, args, err := s.buildQuery(s.q.SearchConversations, query, scope, "conversations.last_message_at", s.filterFields)
+	sql, args, err := s.buildQuery(s.q.SearchConversations, query, scope, conversationResultOrder, s.filterFields)
 	if err != nil {
 		return nil, 0, err
 	}
@@ -91,7 +97,7 @@ func (s *Manager) Messages(query models.Query, scope models.ReadScope) ([]models
 	for model, f := range s.filterFields {
 		fields[model] = f
 	}
-	sql, args, err := s.buildQuery(s.q.SearchMessages, query, scope, "conversation_messages.created_at", fields)
+	sql, args, err := s.buildQuery(s.q.SearchMessages, query, scope, messageResultOrder, fields)
 	if err != nil {
 		return nil, 0, err
 	}
@@ -117,7 +123,7 @@ func (s *Manager) Contacts(query string, limit int) ([]models.ContactResult, err
 	return results, nil
 }
 
-func (s *Manager) buildQuery(base string, query models.Query, scope models.ReadScope, orderBy string, fields dbutil.AllowedFields) (string, []any, error) {
+func NormalizeQuery(query models.Query) models.Query {
 	if query.Page < 1 {
 		query.Page = 1
 	}
@@ -127,17 +133,19 @@ func (s *Manager) buildQuery(base string, query models.Query, scope models.ReadS
 	if query.Filters == "" {
 		query.Filters = "[]"
 	}
-	sql, args, err := dbutil.BuildPaginatedQuery(base, append([]any{query.Term}, scopeArgs(scope)...), dbutil.PaginationOptions{
-		Order:    dbutil.DESC,
-		OrderBy:  orderBy,
-		Page:     query.Page,
-		PageSize: query.PageSize,
-		Location: s.filterLocation(),
-	}, query.Filters, fields, s.filterRenderers)
+	return query
+}
+
+func (s *Manager) buildQuery(base string, query models.Query, scope models.ReadScope, orderBy string, fields dbutil.AllowedFields) (string, []any, error) {
+	query = NormalizeQuery(query)
+	sql, args, err := dbutil.BuildFilterQuery(base, append([]any{query.Term}, scopeArgs(scope)...), query.Filters, fields, s.filterRenderers, s.filterLocation())
 	if err != nil {
 		s.lo.Error("error building search query", "error", err)
 		return "", nil, envelope.NewError(envelope.InputError, s.i18n.T("globals.messages.invalidFilters"), nil)
 	}
+	sql += " ORDER BY " + orderBy
+	sql += fmt.Sprintf(" LIMIT $%d OFFSET $%d", len(args)+1, len(args)+2)
+	args = append(args, query.PageSize, dbutil.PageOffset(query.Page, query.PageSize))
 	return sql, args, nil
 }
 
diff --git a/internal/search/search_test.go b/internal/search/search_test.go
new file mode 100644
index 00000000..0290574d
--- /dev/null
+++ b/internal/search/search_test.go
@@ -0,0 +1,133 @@
+package search
+
+import (
+	"fmt"
+	"strings"
+	"testing"
+	"time"
+
+	"github.com/abhinavxd/libredesk/internal/search/models"
+	"github.com/abhinavxd/libredesk/internal/testutil"
+	"github.com/jmoiron/sqlx"
+	"github.com/zerodha/logf"
+)
+
+func TestNormalizeQuery(t *testing.T) {
+	query := NormalizeQuery(models.Query{Page: 0, PageSize: 500})
+
+	if query.Page != 1 {
+		t.Fatalf("page = %d, want 1", query.Page)
+	}
+	if query.PageSize != maxPageSize {
+		t.Fatalf("page size = %d, want %d", query.PageSize, maxPageSize)
+	}
+	if query.Filters != "[]" {
+		t.Fatalf("filters = %q, want []", query.Filters)
+	}
+}
+
+func TestBuildConversationQueryPrioritizesExactReference(t *testing.T) {
+	manager := &Manager{filterLocation: func() string { return "UTC" }}
+	query, args, err := manager.buildQuery(
+		"SELECT 1 FROM conversations WHERE $3",
+		models.Query{Term: "108", Page: 2, PageSize: 500},
+		models.ReadScope{},
+		conversationResultOrder,
+		nil,
+	)
+	if err != nil {
+		t.Fatalf("building query: %v", err)
+	}
+	if !strings.Contains(query, "ORDER BY (conversations.reference_number = $1) DESC, conversations.last_message_at DESC NULLS LAST") {
+		t.Fatalf("query does not prioritize exact references: %s", query)
+	}
+	if got := args[len(args)-2]; got != maxPageSize {
+		t.Fatalf("limit = %v, want %d", got, maxPageSize)
+	}
+	if got := args[len(args)-1]; got != maxPageSize {
+		t.Fatalf("offset = %v, want %d", got, maxPageSize)
+	}
+}
+
+func TestConversationSearchFieldsAndRanking(t *testing.T) {
+	db := testutil.NewDB(t, "search_conversations")
+	lo := logf.New(logf.Opts{})
+	manager, err := New(Opts{
+		DB:             db,
+		Lo:             &lo,
+		I18n:           testutil.NewI18n(t),
+		FilterLocation: func() string { return "UTC" },
+	})
+	if err != nil {
+		t.Fatalf("creating search manager: %v", err)
+	}
+	if _, err := db.Exec(`INSERT INTO inboxes (name, channel) VALUES ('Search test', 'email')`); err != nil {
+		t.Fatalf("inserting inbox: %v", err)
+	}
+
+	oldest := time.Date(2025, time.January, 1, 0, 0, 0, 0, time.UTC)
+	insertSearchConversation(t, db, "108", "exact-108@example.com", "Exact", "Contact", "Old subject", oldest)
+	for i := range 10 {
+		insertSearchConversation(
+			t,
+			db,
+			fmt.Sprintf("2%02d", i),
+			fmt.Sprintf("new-108-%02d@example.com", i),
+			"Recent",
+			"Contact",
+			"Recent subject",
+			oldest.Add(time.Duration(i+1)*time.Hour),
+		)
+	}
+	insertSearchConversation(t, db, "999", "other@example.com", "Needle", "Name", "Needle subject", oldest)
+
+	scope := models.ReadScope{Read: true, ReadAll: true}
+	results, total, err := manager.Conversations(models.Query{Term: "108", Page: 1, PageSize: 10}, scope)
+	if err != nil {
+		t.Fatalf("searching conversations: %v", err)
+	}
+	if total != 11 {
+		t.Fatalf("total = %d, want 11", total)
+	}
+	if len(results) != 10 {
+		t.Fatalf("result count = %d, want 10", len(results))
+	}
+	if results[0].ReferenceNumber != "108" {
+		t.Fatalf("first reference = %q, want 108", results[0].ReferenceNumber)
+	}
+
+	results, total, err = manager.Conversations(models.Query{Term: "Needle", Page: 1, PageSize: 10}, scope)
+	if err != nil {
+		t.Fatalf("searching unsupported fields: %v", err)
+	}
+	if total != 0 || len(results) != 0 {
+		t.Fatalf("subject or name matched: total %d, results %d", total, len(results))
+	}
+}
+
+func insertSearchConversation(t *testing.T, db *sqlx.DB, reference, email, firstName, lastName, subject string, lastMessageAt time.Time) {
+	t.Helper()
+
+	var contactID int
+	if err := db.Get(&contactID, `
+		INSERT INTO users (type, email, first_name, last_name)
+		VALUES ('contact', $1, $2, $3)
+		RETURNING id
+	`, email, firstName, lastName); err != nil {
+		t.Fatalf("inserting contact: %v", err)
+	}
+
+	if _, err := db.Exec(`
+		INSERT INTO conversations (contact_id, inbox_id, status_id, reference_number, subject, last_message_at)
+		VALUES (
+			$1,
+			(SELECT id FROM inboxes LIMIT 1),
+			(SELECT id FROM conversation_statuses WHERE name = 'Open'),
+			$2,
+			$3,
+			$4
+		)
+	`, contactID, reference, subject, lastMessageAt); err != nil {
+		t.Fatalf("inserting conversation: %v", err)
+	}
+}

From 1892ff9dbd04c1a0cd04e2b166e3cc222709ccd3 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 17 Sep 2026 13:19:42 +0530
Subject: [PATCH 077/178] add extrap paddin when total page =1

---
 frontend/apps/main/src/features/search/SearchResults.vue | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/features/search/SearchResults.vue b/frontend/apps/main/src/features/search/SearchResults.vue
index c97efd6c..81aa9210 100644
--- a/frontend/apps/main/src/features/search/SearchResults.vue
+++ b/frontend/apps/main/src/features/search/SearchResults.vue
@@ -8,7 +8,13 @@
         </TabsTrigger>
       </TabsList>
 
-      <TabsContent v-for="type in TYPES" :key="type" :value="type" class="mt-0">
+      <TabsContent
+        v-for="type in TYPES"
+        :key="type"
+        :value="type"
+        class="mt-0"
+        :class="{ 'pb-4': results[type].total_pages <= 1 }"
+      >
         <div class="bg-background rounded-md border overflow-hidden">
           <div v-if="results[type].results.length === 0" class="p-8 text-center text-muted-foreground">
             <div class="text-lg font-medium mb-2">{{ t('globals.messages.noResultsFound') }}</div>

From 2ad949238fd599601d3a3294afaf8996db5a28e3 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 17 Sep 2026 16:12:04 +0530
Subject: [PATCH 078/178] fix send using old draft after AI editor prompt
 rewrites it

---
 frontend/apps/main/src/components/editor/EditorToolbar.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/components/editor/EditorToolbar.vue b/frontend/apps/main/src/components/editor/EditorToolbar.vue
index 08085f95..1b5057ad 100644
--- a/frontend/apps/main/src/components/editor/EditorToolbar.vue
+++ b/frontend/apps/main/src/components/editor/EditorToolbar.vue
@@ -417,7 +417,7 @@ const complete = async (promptKey) => {
   emit('aiGenerationChange', true)
   try {
     const content = await aiPromptStore.complete(promptKey, props.editor.getHTML())
-    if (content !== null) props.editor.commands.setContent(content)
+    if (content !== null) props.editor.commands.setContent(content, true)
   } finally {
     isGenerating.value = false
     emit('aiGenerationChange', false)

From f4f1352d631b1dd130d3050e72e4bd8eb230c2ba Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 00:41:04 +0530
Subject: [PATCH 079/178] add Kathmandu timezone option

---
 frontend/apps/main/src/constants/timezones.js | 3 ++-
 internal/stringutil/timezone_test.go          | 1 +
 2 files changed, 3 insertions(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/constants/timezones.js b/frontend/apps/main/src/constants/timezones.js
index a75a59ab..c2f26a1d 100644
--- a/frontend/apps/main/src/constants/timezones.js
+++ b/frontend/apps/main/src/constants/timezones.js
@@ -19,6 +19,7 @@ export const timeZones = {
     "Istanbul, Europe (UTC+03:00)": "Europe/Istanbul",
     "Dubai, Asia (UTC+04:00)": "Asia/Dubai",
     "Kolkata, Asia (UTC+05:30)": "Asia/Kolkata",
+    "Kathmandu, Asia (UTC+05:45)": "Asia/Kathmandu",
     "Bangkok, Asia (UTC+07:00)": "Asia/Bangkok",
     "Singapore, Asia (UTC+08:00)": "Asia/Singapore",
     "Shanghai, Asia (UTC+08:00)": "Asia/Shanghai",
@@ -33,4 +34,4 @@ export const timeZones = {
     "Lagos, Africa (UTC+01:00)": "Africa/Lagos",
     "Nairobi, Africa (UTC+03:00)": "Africa/Nairobi",
     "Johannesburg, Africa (UTC+02:00)": "Africa/Johannesburg"
-}
\ No newline at end of file
+}
diff --git a/internal/stringutil/timezone_test.go b/internal/stringutil/timezone_test.go
index 64a115e9..b504b6f9 100644
--- a/internal/stringutil/timezone_test.go
+++ b/internal/stringutil/timezone_test.go
@@ -27,6 +27,7 @@ var frontendPickerTimezones = []string{
 	"Europe/Istanbul",
 	"Asia/Dubai",
 	"Asia/Kolkata",
+	"Asia/Kathmandu",
 	"Asia/Bangkok",
 	"Asia/Singapore",
 	"Asia/Shanghai",

From 88daac8a8dba58280c226951bcb11f458cc6f365 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 00:41:37 +0530
Subject: [PATCH 080/178] improve search filters and results

---
 .../components/pagination/PaginationBar.vue   |  34 ++--
 .../src/features/search/SearchFilters.vue     | 166 ++++++++++--------
 .../src/features/search/SearchResultItem.vue  |  54 +++---
 .../src/features/search/SearchResults.vue     |  57 +++---
 .../src/features/search/SearchTagFilter.vue   |  31 ++++
 .../apps/main/src/views/search/SearchView.vue |  70 ++++++--
 .../ui/combobox/MultiSelectComboBox.vue       | 145 +++++++++++++++
 i18n/en-US.json                               |   9 +-
 8 files changed, 415 insertions(+), 151 deletions(-)
 create mode 100644 frontend/apps/main/src/features/search/SearchTagFilter.vue
 create mode 100644 frontend/shared-ui/components/ui/combobox/MultiSelectComboBox.vue

diff --git a/frontend/apps/main/src/components/pagination/PaginationBar.vue b/frontend/apps/main/src/components/pagination/PaginationBar.vue
index 92dda21d..7516e4ee 100644
--- a/frontend/apps/main/src/components/pagination/PaginationBar.vue
+++ b/frontend/apps/main/src/components/pagination/PaginationBar.vue
@@ -8,7 +8,10 @@
           {{ t('globals.messages.pageNofTotal', { page, total: totalPages }) }}
         </span>
         <Select :model-value="perPage" @update:model-value="handlePerPageChange">
-          <SelectTrigger class="h-8 w-[70px]" :aria-label="t('globals.messages.resultsPerPage')">
+          <SelectTrigger
+            class="h-10 w-[70px] sm:h-8"
+            :aria-label="t('globals.messages.resultsPerPage')"
+          >
             <SelectValue :placeholder="String(perPage)" />
           </SelectTrigger>
           <SelectContent>
@@ -21,38 +24,41 @@
 
       <div class="flex items-center gap-1">
         <Button
+          type="button"
           variant="ghost"
           size="sm"
-          class="h-8 w-8 p-0"
+          :class="EDGE_BUTTON_CLASS"
           :aria-label="t('globals.messages.firstPage')"
           :disabled="page <= 1"
           @click="goToPage(1)"
         >
-          <ChevronsLeft class="h-4 w-4" aria-hidden="true" />
+          <ChevronsLeft :class="PAGINATION_ICON_CLASS" aria-hidden="true" />
         </Button>
         <Button
+          type="button"
           variant="ghost"
           size="sm"
-          class="h-8 w-8 p-0"
+          :class="STEP_BUTTON_CLASS"
           :aria-label="t('globals.messages.previousPage')"
           :disabled="page <= 1"
           @click="goToPage(page - 1)"
         >
-          <ChevronLeft class="h-4 w-4" aria-hidden="true" />
+          <ChevronLeft :class="PAGINATION_ICON_CLASS" aria-hidden="true" />
         </Button>
 
         <div class="flex items-center bg-muted rounded-lg p-1">
           <template v-for="pageNumber in visiblePages" :key="pageNumber">
             <span
               v-if="pageNumber === '...'"
-              class="flex items-center justify-center h-7 w-7 text-sm text-muted-foreground select-none"
+              class="flex h-10 w-10 items-center justify-center text-sm text-muted-foreground select-none sm:h-7 sm:w-7"
             >
               ...
             </span>
             <button
               v-else
+              type="button"
               @click="goToPage(pageNumber)"
-              class="h-7 min-w-7 px-2 rounded-md text-sm font-medium transition-all duration-150 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring"
+              class="h-10 min-w-10 px-2 rounded-md text-sm font-medium transition-all duration-150 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring sm:h-7 sm:min-w-7"
               :class="
                 pageNumber === page
                   ? 'bg-background text-foreground shadow-sm'
@@ -65,24 +71,26 @@
         </div>
 
         <Button
+          type="button"
           variant="ghost"
           size="sm"
-          class="h-8 w-8 p-0"
+          :class="STEP_BUTTON_CLASS"
           :aria-label="t('globals.messages.nextPage')"
           :disabled="page >= totalPages"
           @click="goToPage(page + 1)"
         >
-          <ChevronRight class="h-4 w-4" aria-hidden="true" />
+          <ChevronRight :class="PAGINATION_ICON_CLASS" aria-hidden="true" />
         </Button>
         <Button
+          type="button"
           variant="ghost"
           size="sm"
-          class="h-8 w-8 p-0"
+          :class="EDGE_BUTTON_CLASS"
           :aria-label="t('globals.messages.lastPage')"
           :disabled="page >= totalPages"
           @click="goToPage(totalPages)"
         >
-          <ChevronsRight class="h-4 w-4" aria-hidden="true" />
+          <ChevronsRight :class="PAGINATION_ICON_CLASS" aria-hidden="true" />
         </Button>
       </div>
     </div>
@@ -103,6 +111,10 @@ import { ChevronsLeft, ChevronLeft, ChevronRight, ChevronsRight } from 'lucide-v
 import { useI18n } from 'vue-i18n'
 import { getVisiblePages } from '@main/utils/pagination'
 
+const EDGE_BUTTON_CLASS = 'hidden h-8 w-8 p-0 sm:inline-flex'
+const PAGINATION_ICON_CLASS = 'h-4 w-4'
+const STEP_BUTTON_CLASS = 'h-10 w-10 p-0 sm:h-8 sm:w-8'
+
 const props = defineProps({
   page: { type: Number, required: true },
   perPage: { type: Number, required: true },
diff --git a/frontend/apps/main/src/features/search/SearchFilters.vue b/frontend/apps/main/src/features/search/SearchFilters.vue
index 9bade9fd..462c013b 100644
--- a/frontend/apps/main/src/features/search/SearchFilters.vue
+++ b/frontend/apps/main/src/features/search/SearchFilters.vue
@@ -1,78 +1,77 @@
 <template>
-  <div class="flex flex-wrap items-center gap-2">
-    <div class="flex-1 min-w-28">
-      <SelectComboBox
-        :model-value="filters.status"
-        :items="conversationStore.statusOptions"
-        :placeholder="t('globals.terms.status')"
-        align="start"
-        @update:model-value="set('status', $event)"
-      />
+  <div class="space-y-2">
+    <div class="flex flex-wrap items-center gap-2">
+      <div :class="FILTER_CLASS">
+        <SelectComboBox
+          :model-value="filters.status"
+          :items="conversationStore.statusOptions"
+          :placeholder="t('globals.terms.status')"
+          align="start"
+          @update:model-value="set('status', $event)"
+        />
+      </div>
+      <div :class="FILTER_CLASS">
+        <SelectComboBox
+          :model-value="filters.priority"
+          :items="conversationStore.priorityOptions"
+          :placeholder="t('globals.terms.priority')"
+          align="start"
+          @update:model-value="set('priority', $event)"
+        />
+      </div>
+      <div :class="FILTER_CLASS">
+        <SelectComboBox
+          :model-value="filters.inbox"
+          :items="inboxStore.options"
+          :placeholder="t('globals.terms.inbox')"
+          align="start"
+          @update:model-value="set('inbox', $event)"
+        />
+      </div>
+      <div :class="FILTER_CLASS">
+        <SelectAgentCombobox
+          :model-value="filters.assignee"
+          :placeholder="t('globals.terms.assignee')"
+          :prepend-items="unassignedItem"
+          align="start"
+          @update:model-value="set('assignee', $event)"
+        />
+      </div>
+      <div :class="FILTER_CLASS">
+        <SelectTeamCombobox
+          :model-value="filters.team"
+          :placeholder="t('globals.terms.team')"
+          :prepend-items="unassignedItem"
+          align="start"
+          @update:model-value="set('team', $event)"
+        />
+      </div>
+      <div class="w-36 shrink-0">
+        <SearchTagFilter :model-value="filters.tags" @update:model-value="set('tags', $event)" />
+      </div>
+      <div class="flex-[1.5] min-w-60">
+        <DateFilterValue
+          :model-value="filters.created"
+          :placeholder="t('globals.terms.conversationDate')"
+          range
+          @update:model-value="set('created', $event)"
+        />
+      </div>
     </div>
-    <div class="flex-1 min-w-28">
-      <SelectComboBox
-        :model-value="filters.priority"
-        :items="conversationStore.priorityOptions"
-        :placeholder="t('globals.terms.priority')"
-        align="start"
-        @update:model-value="set('priority', $event)"
-      />
+
+    <div v-if="selectedTags.length" class="flex flex-wrap gap-1.5">
+      <button
+        v-for="tag in selectedTags"
+        :key="tag.value"
+        type="button"
+        class="inline-flex min-h-7 max-w-full items-center gap-1 rounded-md bg-secondary px-2 text-sm text-secondary-foreground hover:bg-accent focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring"
+        :aria-label="`${t('globals.terms.remove')} ${tag.label}`"
+        @click="removeTag(tag.value)"
+      >
+        <span class="truncate">{{ tag.label }}</span>
+        <X class="h-3.5 w-3.5 shrink-0" aria-hidden="true" />
+      </button>
     </div>
-    <div class="flex-1 min-w-28">
-      <SelectComboBox
-        :model-value="filters.inbox"
-        :items="inboxStore.options"
-        :placeholder="t('globals.terms.inbox')"
-        align="start"
-        @update:model-value="set('inbox', $event)"
-      />
-    </div>
-    <div class="flex-1 min-w-28">
-      <SelectAgentCombobox
-        :model-value="filters.assignee"
-        :placeholder="t('globals.terms.assignee')"
-        :prepend-items="unassignedItem"
-        align="start"
-        @update:model-value="set('assignee', $event)"
-      />
-    </div>
-    <div class="flex-1 min-w-28">
-      <SelectTeamCombobox
-        :model-value="filters.team"
-        :placeholder="t('globals.terms.team')"
-        :prepend-items="unassignedItem"
-        align="start"
-        @update:model-value="set('team', $event)"
-      />
-    </div>
-    <div class="flex-[2] min-w-56">
-      <SelectTagCombobox
-        :model-value="filters.tags"
-        :placeholder="t('globals.terms.tag', 2)"
-        value-field="id"
-        multiple
-        @update:model-value="set('tags', $event)"
-      />
-    </div>
-    <div class="flex-[1.5] min-w-60">
-      <DateFilterValue
-        :model-value="filters.created"
-        :placeholder="t('search.conversationCreatedDate')"
-        range
-        @update:model-value="set('created', $event)"
-      />
-    </div>
-    <Button
-      v-if="hasActiveFilters(filters)"
-      type="button"
-      variant="ghost"
-      size="sm"
-      class="text-muted-foreground"
-      @click="emit('update:filters', emptyFilters())"
-    >
-      <X class="w-4 h-4 mr-1" aria-hidden="true" />
-      {{ t('globals.messages.clearFilters') }}
-    </Button>
   </div>
 </template>
 
@@ -80,15 +79,17 @@
 import { computed, onMounted } from 'vue'
 import { X } from 'lucide-vue-next'
 import { useI18n } from 'vue-i18n'
-import { Button } from '@shared-ui/components/ui/button'
 import SelectComboBox from '@main/components/combobox/SelectCombobox.vue'
 import SelectAgentCombobox from '@main/components/combobox/SelectAgentCombobox.vue'
 import SelectTeamCombobox from '@main/components/combobox/SelectTeamCombobox.vue'
-import SelectTagCombobox from '@main/components/combobox/SelectTagCombobox.vue'
 import DateFilterValue from '@main/components/filter/DateFilterValue.vue'
 import { useConversationStore } from '@main/stores/conversation'
 import { useInboxStore } from '@main/stores/inbox'
-import { emptyFilters, hasActiveFilters, UNASSIGNED } from './searchFilters'
+import { useTagStore } from '@main/stores/tag'
+import SearchTagFilter from './SearchTagFilter.vue'
+import { UNASSIGNED } from './searchFilters'
+
+const FILTER_CLASS = 'flex-1 min-w-28'
 
 const props = defineProps({
   filters: { type: Object, required: true }
@@ -98,13 +99,28 @@ const emit = defineEmits(['update:filters'])
 const { t } = useI18n()
 const conversationStore = useConversationStore()
 const inboxStore = useInboxStore()
+const tagStore = useTagStore()
 
 const unassignedItem = computed(() => [{ value: UNASSIGNED, label: t('globals.terms.unassigned') }])
+const selectedTags = computed(() => {
+  const labels = new Map(tagStore.tagOptions.map((tag) => [String(tag.value), tag.label]))
+  return props.filters.tags.map((value) => ({
+    value,
+    label: labels.get(String(value)) || value
+  }))
+})
 
 const set = (key, value) => {
   emit('update:filters', { ...props.filters, [key]: value ?? (key === 'tags' ? [] : '') })
 }
 
+const removeTag = (value) => {
+  set(
+    'tags',
+    props.filters.tags.filter((tag) => String(tag) !== String(value))
+  )
+}
+
 onMounted(() => {
   conversationStore.fetchStatuses()
   conversationStore.fetchPriorities()
diff --git a/frontend/apps/main/src/features/search/SearchResultItem.vue b/frontend/apps/main/src/features/search/SearchResultItem.vue
index a24c3115..de80eeab 100644
--- a/frontend/apps/main/src/features/search/SearchResultItem.vue
+++ b/frontend/apps/main/src/features/search/SearchResultItem.vue
@@ -27,12 +27,8 @@
         </time>
       </div>
 
-      <p
-        class="mt-1 text-base leading-snug truncate"
-        :class="subject ? 'font-medium text-foreground' : 'text-muted-foreground'"
-      >
-        <HighlightedText v-if="subject" :text="subject" :term="term" />
-        <template v-else>{{ t('globals.terms.noSubject') }}</template>
+      <p v-if="subject" class="mt-1 truncate text-base font-medium leading-snug text-foreground">
+        <HighlightedText :text="subject" :term="term" />
       </p>
 
       <p
@@ -42,19 +38,13 @@
       >
         <template v-if="!isConversation">
           <span class="text-foreground">{{ senderName }}</span>
-          <span v-if="item.private" class="mx-1.5 rounded-md bg-secondary px-1.5 py-0.5 text-xs text-secondary-foreground">
-            {{ t('globals.terms.privateNote') }}
-          </span>
-          <span v-else-if="item.type === 'outgoing'" class="mx-1.5 rounded-md border px-1.5 py-0.5 text-xs">
-            {{ t('globals.terms.reply') }}
-          </span>
-          <span v-else>: </span>
+          <span>: </span>
         </template>
         <HighlightedText :text="snippet" :term="term" />
       </p>
 
       <div
-        class="mt-2.5 flex flex-wrap items-center gap-x-2 gap-y-1.5 text-xs text-muted-foreground [&>*+*]:before:content-['·'] [&>*+*]:before:mr-2 [&>*+*]:before:text-muted-foreground/60"
+        class="mt-2.5 flex flex-wrap items-center gap-x-3 gap-y-1.5 text-xs text-muted-foreground"
       >
         <Badge v-if="status" variant="outline" class="font-normal">{{ status }}</Badge>
         <span v-if="item.priority" class="inline-flex items-center gap-1">
@@ -63,20 +53,28 @@
         </span>
         <span class="tabular-nums">#{{ referenceNumber }}</span>
         <span v-if="item.inbox_name" class="inline-flex items-center gap-1.5 min-w-0">
-          <component :is="item.inbox_channel === 'livechat' ? MessageSquare : Mail" class="w-3.5 h-3.5 shrink-0" aria-hidden="true" />
+          <component
+            :is="item.inbox_channel === 'livechat' ? MessageSquare : Mail"
+            :class="METADATA_ICON_CLASS"
+            aria-hidden="true"
+          />
           <span class="truncate">{{ item.inbox_name }}</span>
         </span>
         <span class="inline-flex items-center gap-1.5 min-w-0">
-          <UserRound class="w-3.5 h-3.5 shrink-0" aria-hidden="true" />
+          <UserRound :class="METADATA_ICON_CLASS" aria-hidden="true" />
           <span class="truncate">{{ assigneeName || t('globals.terms.unassigned') }}</span>
         </span>
         <span v-if="item.team_name" class="inline-flex items-center gap-1.5 min-w-0">
-          <UsersRound class="w-3.5 h-3.5 shrink-0" aria-hidden="true" />
+          <UsersRound :class="METADATA_ICON_CLASS" aria-hidden="true" />
           <span class="truncate">{{ item.team_name }}</span>
         </span>
         <span v-if="item.tags?.length" class="inline-flex items-center gap-1.5 flex-wrap">
-          <Tag class="w-3.5 h-3.5 shrink-0" aria-hidden="true" />
-          <span v-for="tag in item.tags" :key="tag" class="rounded-md bg-secondary px-1.5 py-0.5 text-secondary-foreground">
+          <Tag :class="METADATA_ICON_CLASS" aria-hidden="true" />
+          <span
+            v-for="tag in item.tags"
+            :key="tag"
+            class="rounded-md bg-secondary px-1.5 py-0.5 text-secondary-foreground"
+          >
             {{ tag }}
           </span>
         </span>
@@ -96,6 +94,8 @@ import { getRelativeTime } from '@shared-ui/utils/datetime.js'
 import PriorityMarker from '@main/features/conversation/PriorityMarker.vue'
 import HighlightedText from './HighlightedText.vue'
 
+const METADATA_ICON_CLASS = 'w-3.5 h-3.5 shrink-0'
+
 const props = defineProps({
   item: { type: Object, required: true },
   type: { type: String, required: true },
@@ -108,13 +108,21 @@ const fullName = (person) => [person?.first_name, person?.last_name].filter(Bool
 const initials = (name) => (name || '?').substring(0, 2).toUpperCase()
 
 const isConversation = computed(() => props.type === 'conversations')
-const conversationUUID = computed(() => (isConversation.value ? props.item.uuid : props.item.conversation_uuid))
+const conversationUUID = computed(() =>
+  isConversation.value ? props.item.uuid : props.item.conversation_uuid
+)
 const referenceNumber = computed(() =>
   isConversation.value ? props.item.reference_number : props.item.conversation_reference_number
 )
-const status = computed(() => (isConversation.value ? props.item.status : props.item.conversation_status))
-const subject = computed(() => (isConversation.value ? props.item.subject : props.item.conversation_subject) || '')
-const snippet = computed(() => (isConversation.value ? props.item.last_message : props.item.snippet) || '')
+const status = computed(() =>
+  isConversation.value ? props.item.status : props.item.conversation_status
+)
+const subject = computed(
+  () => (isConversation.value ? props.item.subject : props.item.conversation_subject) || ''
+)
+const snippet = computed(
+  () => (isConversation.value ? props.item.last_message : props.item.snippet) || ''
+)
 const timestamp = computed(() =>
   isConversation.value ? props.item.last_message_at || props.item.created_at : props.item.created_at
 )
diff --git a/frontend/apps/main/src/features/search/SearchResults.vue b/frontend/apps/main/src/features/search/SearchResults.vue
index 81aa9210..9574afdd 100644
--- a/frontend/apps/main/src/features/search/SearchResults.vue
+++ b/frontend/apps/main/src/features/search/SearchResults.vue
@@ -1,25 +1,39 @@
 <template>
   <div>
     <Tabs :model-value="activeTab" @update:model-value="emit('update:activeTab', $event)">
-      <TabsList class="mb-3">
-        <TabsTrigger v-for="type in TYPES" :key="type" :value="type" class="gap-1.5">
-          {{ t(tabLabelKeys[type], 2) }}
-          <span class="text-xs tabular-nums text-muted-foreground">{{ results[type].total }}</span>
-        </TabsTrigger>
-      </TabsList>
+      <div class="mb-3 flex items-center gap-2">
+        <TabsList>
+          <TabsTrigger v-for="type in TYPES" :key="type" :value="type" class="gap-1.5">
+            {{ t(tabLabelKeys[type], 2) }}
+            <span class="text-xs tabular-nums text-muted-foreground">{{
+              results[type].total
+            }}</span>
+          </TabsTrigger>
+        </TabsList>
+        <Button
+          v-if="showClearFilters"
+          type="button"
+          variant="ghost"
+          size="sm"
+          class="shrink-0 text-muted-foreground"
+          @click="emit('clearFilters')"
+        >
+          <X class="mr-1 h-4 w-4" aria-hidden="true" />
+          {{ t('globals.messages.clearFilters') }}
+        </Button>
+      </div>
 
-      <TabsContent
-        v-for="type in TYPES"
-        :key="type"
-        :value="type"
-        class="mt-0"
-        :class="{ 'pb-4': results[type].total_pages <= 1 }"
-      >
-        <div class="bg-background rounded-md border overflow-hidden">
-          <div v-if="results[type].results.length === 0" class="p-8 text-center text-muted-foreground">
-            <div class="text-lg font-medium mb-2">{{ t('globals.messages.noResultsFound') }}</div>
-            <div class="text-sm">{{ t('search.adjustSearchTerms') }}</div>
-          </div>
+      <TabsContent v-for="type in TYPES" :key="type" :value="type" class="mt-0">
+        <div
+          class="overflow-hidden rounded-md border bg-background"
+          :class="{ 'border-dashed': results[type].results.length === 0 }"
+        >
+          <p
+            v-if="results[type].results.length === 0"
+            class="p-8 text-center text-sm text-muted-foreground"
+          >
+            {{ t('globals.messages.noResultsFound') }}
+          </p>
           <div v-else class="divide-y divide-border">
             <SearchResultItem
               v-for="item in results[type].results"
@@ -43,7 +57,9 @@
 </template>
 
 <script setup>
+import { X } from 'lucide-vue-next'
 import { useI18n } from 'vue-i18n'
+import { Button } from '@shared-ui/components/ui/button'
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@shared-ui/components/ui/tabs'
 import PaginationBar from '@main/components/pagination/PaginationBar.vue'
 import SearchResultItem from './SearchResultItem.vue'
@@ -57,9 +73,10 @@ const tabLabelKeys = {
 defineProps({
   results: { type: Object, required: true },
   term: { type: String, default: '' },
-  activeTab: { type: String, required: true }
+  activeTab: { type: String, required: true },
+  showClearFilters: { type: Boolean, default: false }
 })
-const emit = defineEmits(['update:activeTab', 'changePage'])
+const emit = defineEmits(['update:activeTab', 'changePage', 'clearFilters'])
 
 const { t } = useI18n()
 </script>
diff --git a/frontend/apps/main/src/features/search/SearchTagFilter.vue b/frontend/apps/main/src/features/search/SearchTagFilter.vue
new file mode 100644
index 00000000..f4207ec2
--- /dev/null
+++ b/frontend/apps/main/src/features/search/SearchTagFilter.vue
@@ -0,0 +1,31 @@
+<template>
+  <MultiSelectComboBox
+    v-model="modelValue"
+    :items="tagStore.tagOptions"
+    :placeholder="t('placeholders.selectTags')"
+    :selected-label="t('globals.terms.tag', 2)"
+    :search="tagStore.searchTagOptions"
+  />
+</template>
+
+<script setup>
+import { onMounted, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import MultiSelectComboBox from '@shared-ui/components/ui/combobox/MultiSelectComboBox.vue'
+import { useTagStore } from '@main/stores/tag'
+
+const modelValue = defineModel({ type: Array, default: () => [] })
+
+const { t } = useI18n()
+const tagStore = useTagStore()
+
+watch(
+  modelValue,
+  (ids) => {
+    tagStore.ensureTagIDs(ids)
+  },
+  { immediate: true }
+)
+
+onMounted(tagStore.fetchTags)
+</script>
diff --git a/frontend/apps/main/src/views/search/SearchView.vue b/frontend/apps/main/src/views/search/SearchView.vue
index 73839e30..673f5b76 100644
--- a/frontend/apps/main/src/views/search/SearchView.vue
+++ b/frontend/apps/main/src/views/search/SearchView.vue
@@ -2,7 +2,7 @@
   <div class="flex flex-col h-screen">
     <SearchHeader />
     <div class="flex-1 overflow-y-auto">
-      <div class="max-w-6xl mx-auto px-4 pt-6 space-y-4">
+      <div class="mx-auto max-w-6xl space-y-4 px-4 py-6">
         <div class="relative">
           <SearchIcon
             class="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-muted-foreground pointer-events-none"
@@ -13,13 +13,21 @@
             v-model="term"
             :placeholder="$t('search.searchBy')"
             :aria-label="$t('globals.terms.search')"
-            class="h-12 pl-10 pr-10 text-base"
+            class="h-12 pl-10 pr-20 text-base"
+          />
+          <Spinner
+            v-if="loading"
+            size="sm"
+            variant="muted"
+            :absolute="false"
+            :center="false"
+            class="absolute right-10 top-1/2 -translate-y-1/2"
           />
           <button
             v-if="term"
             type="button"
             class="absolute right-2 top-1/2 -translate-y-1/2 p-1.5 rounded-md text-muted-foreground hover:text-foreground hover:bg-accent"
-            :aria-label="$t('globals.terms.clear')"
+            :aria-label="$t('globals.messages.clear')"
             @click="term = ''"
           >
             <X class="w-4 h-4" aria-hidden="true" />
@@ -28,23 +36,24 @@
 
         <SearchFilters :filters="filters" @update:filters="filters = $event" />
 
-        <div v-if="loading" class="flex justify-center items-center h-64">
-          <Spinner />
+        <div v-if="loading && totalResults === 0" class="flex justify-center items-center h-64">
+          <Spinner :absolute="false" />
         </div>
         <div v-else-if="error" class="py-16 text-center space-y-4">
           <p class="text-destructive">{{ error }}</p>
-          <Button @click="search"> {{ $t('globals.terms.tryAgain') }} </Button>
-        </div>
-        <div v-else-if="searchPerformed && totalResults === 0" class="py-16 text-center space-y-1">
-          <p class="text-foreground font-medium">{{ $t('search.noResultsForQuery', { query: term }) }}</p>
-          <p class="text-sm text-muted-foreground">{{ $t('search.adjustSearchTerms') }}</p>
+          <Button type="button" @click="search"> {{ $t('globals.terms.tryAgain') }} </Button>
         </div>
         <SearchResults
           v-else-if="searchPerformed"
           :results="results"
           :term="term"
-          v-model:active-tab="activeTab"
+          :active-tab="activeTab"
+          :show-clear-filters="hasActiveFilters(filters)"
+          :aria-busy="loading"
+          :class="{ 'pointer-events-none opacity-60': loading }"
+          @update:active-tab="selectTab"
           @change-page="changePage"
+          @clear-filters="filters = emptyFilters()"
         />
         <p
           v-else-if="term.length > 0 && term.length < MIN_SEARCH_LENGTH"
@@ -52,9 +61,9 @@
         >
           {{ $t('search.minQueryLength', { length: MIN_SEARCH_LENGTH }) }}
         </p>
-        <div v-else class="py-16 text-center space-y-2">
-          <SearchIcon class="w-8 h-8 mx-auto text-muted-foreground/60" aria-hidden="true" />
-          <p class="text-sm text-muted-foreground max-w-md mx-auto">{{ $t('search.searchBy') }}</p>
+        <div v-else class="py-16 text-center text-muted-foreground">
+          <SearchIcon class="w-8 h-8 mx-auto mb-2 opacity-60" aria-hidden="true" />
+          <p class="text-sm">{{ $t('globals.messages.resultsAppearHere') }}</p>
         </div>
       </div>
     </div>
@@ -73,7 +82,9 @@ import SearchHeader from '@main/features/search/SearchHeader.vue'
 import SearchFilters from '@main/features/search/SearchFilters.vue'
 import SearchResults from '@main/features/search/SearchResults.vue'
 import {
+  emptyFilters,
   filtersFromQuery,
+  hasActiveFilters,
   queryFromFilters,
   toFiltersJSON
 } from '@main/features/search/searchFilters'
@@ -87,13 +98,20 @@ const TABS = ['conversations', 'messages']
 const route = useRoute()
 const router = useRouter()
 
-const emptyPage = () => ({ results: [], total: 0, page: 1, per_page: DEFAULT_PER_PAGE, total_pages: 0 })
+const emptyPage = () => ({
+  results: [],
+  total: 0,
+  page: 1,
+  per_page: DEFAULT_PER_PAGE,
+  total_pages: 0
+})
 const emptyResults = () => ({ conversations: emptyPage(), messages: emptyPage() })
 
 const inputRef = ref(null)
 const term = ref(String(route.query.q || ''))
 const filters = ref(filtersFromQuery(route.query))
 const activeTab = ref(TABS.includes(route.query.tab) ? route.query.tab : 'conversations')
+const tabSelectedByUser = ref(TABS.includes(route.query.tab))
 const results = ref(emptyResults())
 const loading = ref(false)
 const error = ref(null)
@@ -101,7 +119,9 @@ const searchPerformed = ref(false)
 let debounceTimer = null
 let searchRequestId = 0
 
-const totalResults = computed(() => results.value.conversations.total + results.value.messages.total)
+const totalResults = computed(
+  () => results.value.conversations.total + results.value.messages.total
+)
 
 const searchParams = (page, perPage) => {
   const params = { query: term.value, page, page_size: perPage }
@@ -120,6 +140,7 @@ const reset = () => {
   results.value = emptyResults()
   searchPerformed.value = false
   loading.value = false
+  error.value = null
 }
 
 const search = async () => {
@@ -139,6 +160,10 @@ const search = async () => {
     )
     if (requestId !== searchRequestId) return
     results.value = Object.fromEntries(TABS.map((type, i) => [type, pages[i].data.data]))
+    if (!tabSelectedByUser.value && results.value[activeTab.value].total === 0) {
+      const populatedTab = TABS.find((type) => results.value[type].total > 0)
+      if (populatedTab) activeTab.value = populatedTab
+    }
   } catch (err) {
     if (requestId !== searchRequestId) return
     error.value = handleHTTPError(err).message
@@ -148,6 +173,8 @@ const search = async () => {
 }
 
 const fetchPage = async (type, page, perPage) => {
+  loading.value = true
+  error.value = null
   const requestId = ++searchRequestId
   try {
     const response = await fetchers[type](searchParams(page, perPage))
@@ -156,15 +183,24 @@ const fetchPage = async (type, page, perPage) => {
   } catch (err) {
     if (requestId !== searchRequestId) return
     error.value = handleHTTPError(err).message
+  } finally {
+    if (requestId === searchRequestId) loading.value = false
   }
 }
 
 const changePage = ({ type, page, perPage }) => fetchPage(type, page, perPage)
 
+const selectTab = (tab) => {
+  tabSelectedByUser.value = true
+  activeTab.value = tab
+}
+
 const syncRoute = () => {
   const query = { ...queryFromFilters(filters.value) }
   if (term.value) query.q = term.value
-  if (activeTab.value !== 'conversations') query.tab = activeTab.value
+  if (tabSelectedByUser.value || activeTab.value !== 'conversations') {
+    query.tab = activeTab.value
+  }
   router.replace({ query })
 }
 
diff --git a/frontend/shared-ui/components/ui/combobox/MultiSelectComboBox.vue b/frontend/shared-ui/components/ui/combobox/MultiSelectComboBox.vue
new file mode 100644
index 00000000..b91ba2dd
--- /dev/null
+++ b/frontend/shared-ui/components/ui/combobox/MultiSelectComboBox.vue
@@ -0,0 +1,145 @@
+<template>
+  <Popover v-model:open="open">
+    <PopoverTrigger as-child>
+      <Button
+        type="button"
+        variant="outline"
+        role="combobox"
+        class="w-full justify-between font-normal"
+        :aria-expanded="open"
+        :disabled="disabled"
+      >
+        <span
+          class="min-w-0 truncate"
+          :class="modelValue.length ? 'text-foreground' : 'text-muted-foreground'"
+        >
+          {{ modelValue.length ? selectedLabel || placeholder : placeholder }}
+        </span>
+        <span class="ml-auto flex shrink-0 items-center gap-1.5">
+          <span
+            v-if="modelValue.length"
+            class="rounded bg-secondary px-1.5 py-0.5 text-xs tabular-nums text-secondary-foreground"
+          >
+            {{ modelValue.length }}
+          </span>
+          <CaretSortIcon class="h-4 w-4 opacity-50" aria-hidden="true" />
+        </span>
+      </Button>
+    </PopoverTrigger>
+    <PopoverContent align="start" class="p-0">
+      <Command
+        multiple
+        :model-value="modelValue"
+        v-model:search-term="searchTerm"
+        :filter-function="passThroughFilter"
+      >
+        <CommandInput :placeholder="placeholder" :loading="searching" />
+        <CommandEmpty v-if="!searching">{{ t('globals.messages.noResultsFound') }}</CommandEmpty>
+        <CommandList>
+          <CommandGroup>
+            <CommandItem
+              v-for="item in visibleItems"
+              :key="item.value"
+              :value="item.value"
+              @select.prevent="toggle(item.value)"
+            >
+              <slot name="item" :item="item">
+                <span class="truncate">{{ item.label }}</span>
+              </slot>
+              <CheckIcon
+                class="ml-auto h-4 w-4 shrink-0"
+                :class="isSelected(item.value) ? 'opacity-100' : 'opacity-0'"
+                aria-hidden="true"
+              />
+            </CommandItem>
+          </CommandGroup>
+        </CommandList>
+      </Command>
+    </PopoverContent>
+  </Popover>
+</template>
+
+<script setup>
+import { computed, onUnmounted, ref, watch } from 'vue'
+import { CaretSortIcon, CheckIcon } from '@radix-icons/vue'
+import { useI18n } from 'vue-i18n'
+import { Button } from '@shared-ui/components/ui/button'
+import {
+  Command,
+  CommandEmpty,
+  CommandGroup,
+  CommandInput,
+  CommandItem,
+  CommandList
+} from '@shared-ui/components/ui/command'
+import { Popover, PopoverContent, PopoverTrigger } from '@shared-ui/components/ui/popover'
+import { useRemoteSearch } from '@shared-ui/composables/useRemoteSearch'
+
+const RENDER_CAP = 200
+const SEARCH_DEBOUNCE_MS = 250
+
+const props = defineProps({
+  items: {
+    type: Array,
+    required: true,
+    validator: (items) => items.every((item) => 'label' in item && 'value' in item)
+  },
+  placeholder: {
+    type: String,
+    default: ''
+  },
+  selectedLabel: {
+    type: String,
+    default: ''
+  },
+  search: {
+    type: Function,
+    default: null
+  },
+  disabled: {
+    type: Boolean,
+    default: false
+  }
+})
+
+const modelValue = defineModel({ type: Array, default: () => [] })
+
+const { t } = useI18n()
+const open = ref(false)
+const searchTerm = ref('')
+const passThroughFilter = (values) => values
+
+const {
+  results: searchResults,
+  searching,
+  update: updateSearch,
+  dispose: disposeSearch
+} = useRemoteSearch((term) => props.search(term), SEARCH_DEBOUNCE_MS)
+
+const displayedItems = computed(() => searchResults.value ?? props.items)
+const filteredItems = computed(() => {
+  if (props.search || !searchTerm.value) return displayedItems.value
+  const term = searchTerm.value.trim().toLowerCase()
+  return displayedItems.value.filter((item) => item.label.toLowerCase().includes(term))
+})
+const visibleItems = computed(() => filteredItems.value.slice(0, RENDER_CAP))
+
+const isSelected = (value) =>
+  modelValue.value.some((selected) => String(selected) === String(value))
+
+const toggle = (value) => {
+  modelValue.value = isSelected(value)
+    ? modelValue.value.filter((selected) => String(selected) !== String(value))
+    : [...modelValue.value, value]
+}
+
+watch(searchTerm, (term) => {
+  if (props.search) updateSearch(term)
+})
+
+watch(open, (isOpen) => {
+  if (!isOpen && searchTerm.value) searchTerm.value = ''
+})
+
+onUnmounted(disposeSearch)
+</script>
diff --git a/i18n/en-US.json b/i18n/en-US.json
index cfea93b6..93919bf7 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -835,6 +835,7 @@
   "globals.messages.approve": "Approve",
   "globals.messages.reject": "Reject",
   "globals.messages.caseSensitiveMatch": "Case sensitive match",
+  "globals.messages.clear": "Clear",
   "globals.messages.clearFilters": "Clear filters",
   "globals.messages.close": "Close",
   "globals.messages.closeChat": "Close chat",
@@ -913,6 +914,7 @@
   "globals.messages.required": "{name} Required",
   "globals.messages.reset": "Reset",
   "globals.messages.resetToDefault": "Reset to default",
+  "globals.messages.resultsAppearHere": "Results will appear here.",
   "globals.messages.resultsPerPage": "Results per page",
   "globals.messages.revoke": "Revoke",
   "globals.messages.save": "Save",
@@ -984,7 +986,6 @@
   "globals.terms.callbackURL": "Callback URL",
   "globals.terms.category": "Category",
   "globals.terms.channel": "Channel",
-  "globals.terms.clear": "Clear",
   "globals.terms.clientID": "Client ID",
   "globals.terms.clientSecret": "Client secret",
   "globals.terms.closed": "Closed",
@@ -1000,6 +1001,7 @@
   "globals.terms.contextLink": "Context link | Context links",
   "globals.terms.continue": "Continue",
   "globals.terms.conversation": "Conversation | Conversations",
+  "globals.terms.conversationDate": "Conversation date",
   "globals.terms.copy": "Copy",
   "globals.terms.country": "Country",
   "globals.terms.countryCode": "Country code",
@@ -1090,7 +1092,6 @@
   "globals.terms.name": "Name | Names",
   "globals.terms.nextSlaDeadline": "Next SLA deadline",
   "globals.terms.none": "None",
-  "globals.terms.noSubject": "No subject",
   "globals.terms.note": "Note | Notes",
   "globals.terms.notification": "Notification | Notifications",
   "globals.terms.off": "OFF",
@@ -1492,9 +1493,7 @@
   "role.new": "New role",
   "role.select": "Select roles",
   "search.adjustSearchTerms": "Try adjusting your search terms or filters.",
-  "search.conversationCreatedDate": "Conversation created date",
-  "search.minQueryLength": " Please enter at least {length} characters to search.",
-  "search.noResultsForQuery": "No results found for query `{query}`. Try a different search term.",
+  "search.minQueryLength": "Please enter at least {length} characters to search.",
   "search.searchBy": "Search by reference number, contact email or message text",
   "setup.completeYourSetup": "Complete your setup",
   "setup.createFirstInbox": "Create your first inbox",

From 46e2e5250d435f96b8d7221c52417a4e491ce72b Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 01:04:54 +0530
Subject: [PATCH 081/178] escape wildcard characters in search queries

---
 internal/dbutil/builder.go        | 14 ++++++++---
 internal/dbutil/builder_test.go   | 10 ++++----
 internal/helpcenter/helpcenter.go |  5 +---
 internal/helpcenter/queries.sql   |  2 +-
 internal/macro/macro.go           |  4 +--
 internal/macro/queries.sql        |  4 +--
 internal/search/queries.sql       |  6 ++---
 internal/search/search.go         |  6 +++--
 internal/search/search_test.go    | 41 ++++++++++++++++++++++++++++---
 internal/user/agent.go            |  2 +-
 internal/user/queries.sql         |  2 +-
 11 files changed, 68 insertions(+), 28 deletions(-)

diff --git a/internal/dbutil/builder.go b/internal/dbutil/builder.go
index 990df1c3..6a7e3362 100644
--- a/internal/dbutil/builder.go
+++ b/internal/dbutil/builder.go
@@ -16,6 +16,8 @@ var ErrTooManyGroups = errors.New("too many filter groups")
 
 var dateOnlyRe = regexp.MustCompile(`^\d{4}-\d{2}-\d{2}$`)
 
+var likePatternEscaper = strings.NewReplacer(`\`, `\\`, `%`, `\%`, `_`, `\_`)
+
 var valueRequiredOperators = map[string]bool{
 	"equals":       true,
 	"not equals":   true,
@@ -173,6 +175,10 @@ func ValidateFilters(filtersJSON string, allowedFields AllowedFields, renderers
 	return err
 }
 
+func ContainsPattern(value string) string {
+	return "%" + likePatternEscaper.Replace(value) + "%"
+}
+
 // parseFilters accepts either a legacy flat array of leaves or a {logic, rules} group object.
 func parseFilters(filtersJSON string) (FilterNode, error) {
 	trimmed := strings.TrimSpace(filtersJSON)
@@ -398,13 +404,13 @@ func buildLeaf(f FilterNode, args *[]any, next *int, allowedFields AllowedFields
 		*next += 2
 		return cond, nil
 	case "contains", "ilike":
-		cond := fmt.Sprintf("%s ILIKE $%d", field, *next)
-		*args = append(*args, "%"+f.Value+"%")
+		cond := fmt.Sprintf("%s ILIKE $%d ESCAPE '\\'", field, *next)
+		*args = append(*args, ContainsPattern(f.Value))
 		*next++
 		return cond, nil
 	case "not contains":
-		cond := fmt.Sprintf("%s NOT ILIKE $%d", field, *next)
-		*args = append(*args, "%"+f.Value+"%")
+		cond := fmt.Sprintf("%s NOT ILIKE $%d ESCAPE '\\'", field, *next)
+		*args = append(*args, ContainsPattern(f.Value))
 		*next++
 		return cond, nil
 	default:
diff --git a/internal/dbutil/builder_test.go b/internal/dbutil/builder_test.go
index 93f6d76d..d790d561 100644
--- a/internal/dbutil/builder_test.go
+++ b/internal/dbutil/builder_test.go
@@ -109,21 +109,21 @@ func TestEmptyFiltersNoClause(t *testing.T) {
 }
 
 func TestContainsOnPlainColumnIsILike(t *testing.T) {
-	q, args, err := build(t, `[{"model":"users","field":"email","operator":"contains","value":"gmail"}]`)
+	q, args, err := build(t, `[{"model":"users","field":"email","operator":"contains","value":"50%_off\\today"}]`)
 	if err != nil {
 		t.Fatal(err)
 	}
-	if !strings.Contains(q, "users.email ILIKE $1") {
+	if !strings.Contains(q, `users.email ILIKE $1 ESCAPE '\'`) {
 		t.Fatalf("expected ILIKE for contains, got: %s", q)
 	}
-	if args[0] != "%gmail%" {
-		t.Fatalf("expected wrapped pattern, got: %v", args[0])
+	if args[0] != `%50\%\_off\\today%` {
+		t.Fatalf("expected escaped and wrapped pattern, got: %v", args[0])
 	}
 	q, _, err = build(t, `[{"model":"users","field":"email","operator":"not contains","value":"gmail"}]`)
 	if err != nil {
 		t.Fatal(err)
 	}
-	if !strings.Contains(q, "users.email NOT ILIKE $1") {
+	if !strings.Contains(q, `users.email NOT ILIKE $1 ESCAPE '\'`) {
 		t.Fatalf("expected NOT ILIKE for not contains, got: %s", q)
 	}
 }
diff --git a/internal/helpcenter/helpcenter.go b/internal/helpcenter/helpcenter.go
index 4dc6ade7..c8f4e6e5 100644
--- a/internal/helpcenter/helpcenter.go
+++ b/internal/helpcenter/helpcenter.go
@@ -71,8 +71,6 @@ var (
 	// slugRe matches the charset stringutil.GenerateSlug emits; anything else breaks /hc/ URLs.
 	slugRe = regexp.MustCompile(fmt.Sprintf(`^[a-z0-9_-]{1,%d}$`, maxSlugLen))
 
-	ilikeEscaper = strings.NewReplacer(`\`, `\\`, `%`, `\%`, `_`, `\_`)
-
 	youtubeEmbedRe = regexp.MustCompile(`^https://(www\.)?(youtube\.com|youtube-nocookie\.com)/embed/[\w-]+`)
 
 	articleButtonClassRe = regexp.MustCompile(`^hc-button$`)
@@ -943,8 +941,7 @@ func (m *Manager) SearchPublishedArticles(helpCenterSlug, query, locale string,
 	}
 	query = truncateRunes(query, maxSearchQueryLen)
 	tsQuery := prefixTSQuery(query)
-	query = ilikeEscaper.Replace(query)
-	if err := m.q.SearchPublishedArticles.Select(&articles, helpCenterSlug, query, limit, locale, tsQuery); err != nil {
+	if err := m.q.SearchPublishedArticles.Select(&articles, helpCenterSlug, dbutil.ContainsPattern(query), limit, locale, tsQuery); err != nil {
 		m.lo.Error("error searching published articles", "error", err, "help_center_slug", helpCenterSlug)
 		return nil, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
diff --git a/internal/helpcenter/queries.sql b/internal/helpcenter/queries.sql
index 7d965de2..9191c243 100644
--- a/internal/helpcenter/queries.sql
+++ b/internal/helpcenter/queries.sql
@@ -415,7 +415,7 @@ FROM help_articles a
 JOIN article_collections c ON c.id = a.collection_id AND c.locale = a.locale AND c.id IN (SELECT id FROM published_collections)
 WHERE a.status = 'published' AND a.locale = $4
     AND (a.search_tsv @@ to_tsquery(help_article_search_config($4), NULLIF($5, ''))
-        OR a.title ILIKE '%' || $2 || '%' OR a.content ILIKE '%' || $2 || '%')
+        OR a.title ILIKE $2 ESCAPE '\' OR a.content ILIKE $2 ESCAPE '\')
 ORDER BY ts_rank(a.search_tsv, to_tsquery(help_article_search_config($4), NULLIF($5, '')), 2) DESC, a.view_count DESC, a.created_at DESC
 LIMIT $3;
 
diff --git a/internal/macro/macro.go b/internal/macro/macro.go
index 8525adbb..b6a050b0 100644
--- a/internal/macro/macro.go
+++ b/internal/macro/macro.go
@@ -105,7 +105,7 @@ func (m *Manager) GetAll() ([]models.Macro, error) {
 // GetAllCompact returns macros without message content filtered by name, all of them when pageSize is 0.
 func (m *Manager) GetAllCompact(query string, page, pageSize int) ([]models.MacroCompact, error) {
 	macros := make([]models.MacroCompact, 0)
-	err := m.q.GetAllCompact.Select(&macros, query, pageSize, dbutil.PageOffset(page, pageSize))
+	err := m.q.GetAllCompact.Select(&macros, query, pageSize, dbutil.PageOffset(page, pageSize), dbutil.ContainsPattern(query))
 	if err != nil {
 		m.lo.Error("error fetching macros", "error", err)
 		return nil, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
@@ -116,7 +116,7 @@ func (m *Manager) GetAllCompact(query string, page, pageSize int) ([]models.Macr
 // SearchCompact returns the top macros without message content visible to the given user.
 func (m *Manager) SearchCompact(query, view string, userID int, teamIDs []int) ([]models.MacroCompact, error) {
 	macros := make([]models.MacroCompact, 0)
-	err := m.q.SearchCompact.Select(&macros, query, view, userID, pq.Array(teamIDs))
+	err := m.q.SearchCompact.Select(&macros, query, view, userID, pq.Array(teamIDs), dbutil.ContainsPattern(query))
 	if err != nil {
 		m.lo.Error("error searching macros", "error", err)
 		return nil, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
diff --git a/internal/macro/queries.sql b/internal/macro/queries.sql
index 71c66787..5225f2e9 100644
--- a/internal/macro/queries.sql
+++ b/internal/macro/queries.sql
@@ -51,7 +51,7 @@ SELECT
 FROM
     macros
 WHERE
-    ($1 = '' OR name ILIKE '%' || $1 || '%')
+    ($1 = '' OR name ILIKE $4 ESCAPE '\')
 ORDER BY
     updated_at DESC
 LIMIT NULLIF($2, 0) OFFSET $3;
@@ -72,7 +72,7 @@ SELECT
 FROM
     macros
 WHERE
-    ($1 = '' OR name ILIKE '%' || $1 || '%')
+    ($1 = '' OR name ILIKE $5 ESCAPE '\')
     AND ($2 = '' OR $2 = ANY(visible_when::text[]))
     AND (
         visibility = 'all'
diff --git a/internal/search/queries.sql b/internal/search/queries.sql
index 682e2963..c6894c2c 100644
--- a/internal/search/queries.sql
+++ b/internal/search/queries.sql
@@ -9,7 +9,7 @@ WITH matched_conversations AS (
     SELECT conversations.id
     FROM users
     JOIN conversations ON conversations.contact_id = users.id
-    WHERE users.email ILIKE '%' || $1 || '%'
+    WHERE users.email ILIKE $10 ESCAPE '\'
 )
 SELECT
     COUNT(*) OVER() AS total,
@@ -97,7 +97,7 @@ LEFT JOIN inboxes ON conversations.inbox_id = inboxes.id
 LEFT JOIN conversation_statuses cs ON conversations.status_id = cs.id
 LEFT JOIN conversation_priorities cp ON conversations.priority_id = cp.id
 WHERE conversation_messages.type != 'activity'
-  AND conversation_messages.text_content ILIKE '%' || $1 || '%'
+  AND conversation_messages.text_content ILIKE $10 ESCAPE '\'
   AND $3
   AND (
        $4
@@ -118,5 +118,5 @@ SELECT
 FROM users
 WHERE type = 'contact'
 AND deleted_at IS NULL
-AND email ILIKE '%' || $1 || '%'
+AND email ILIKE $1 ESCAPE '\'
 LIMIT $2;
diff --git a/internal/search/search.go b/internal/search/search.go
index c3c8d4c2..fa0403c3 100644
--- a/internal/search/search.go
+++ b/internal/search/search.go
@@ -116,7 +116,7 @@ func (s *Manager) Messages(query models.Query, scope models.ReadScope) ([]models
 // Contacts searches contacts based on the query
 func (s *Manager) Contacts(query string, limit int) ([]models.ContactResult, error) {
 	var results = make([]models.ContactResult, 0)
-	if err := s.q.SearchContacts.Select(&results, query, limit); err != nil {
+	if err := s.q.SearchContacts.Select(&results, dbutil.ContainsPattern(query), limit); err != nil {
 		s.lo.Error("error searching contacts", "error", err)
 		return nil, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
@@ -138,7 +138,9 @@ func NormalizeQuery(query models.Query) models.Query {
 
 func (s *Manager) buildQuery(base string, query models.Query, scope models.ReadScope, orderBy string, fields dbutil.AllowedFields) (string, []any, error) {
 	query = NormalizeQuery(query)
-	sql, args, err := dbutil.BuildFilterQuery(base, append([]any{query.Term}, scopeArgs(scope)...), query.Filters, fields, s.filterRenderers, s.filterLocation())
+	baseArgs := append([]any{query.Term}, scopeArgs(scope)...)
+	baseArgs = append(baseArgs, dbutil.ContainsPattern(query.Term))
+	sql, args, err := dbutil.BuildFilterQuery(base, baseArgs, query.Filters, fields, s.filterRenderers, s.filterLocation())
 	if err != nil {
 		s.lo.Error("error building search query", "error", err)
 		return "", nil, envelope.NewError(envelope.InputError, s.i18n.T("globals.messages.invalidFilters"), nil)
diff --git a/internal/search/search_test.go b/internal/search/search_test.go
index 0290574d..78ea7fc5 100644
--- a/internal/search/search_test.go
+++ b/internal/search/search_test.go
@@ -79,7 +79,13 @@ func TestConversationSearchFieldsAndRanking(t *testing.T) {
 			oldest.Add(time.Duration(i+1)*time.Hour),
 		)
 	}
-	insertSearchConversation(t, db, "999", "other@example.com", "Needle", "Name", "Needle subject", oldest)
+	conversationID, senderID := insertSearchConversation(t, db, "999", "other@example.com", "Needle", "Name", "Needle subject", oldest)
+	if _, err := db.Exec(`
+		INSERT INTO conversation_messages (type, status, conversation_id, text_content, sender_id, sender_type)
+		VALUES ('incoming', 'received', $1, 'ordinary message', $2, 'contact')
+	`, conversationID, senderID); err != nil {
+		t.Fatalf("inserting message: %v", err)
+	}
 
 	scope := models.ReadScope{Read: true, ReadAll: true}
 	results, total, err := manager.Conversations(models.Query{Term: "108", Page: 1, PageSize: 10}, scope)
@@ -103,9 +109,35 @@ func TestConversationSearchFieldsAndRanking(t *testing.T) {
 	if total != 0 || len(results) != 0 {
 		t.Fatalf("subject or name matched: total %d, results %d", total, len(results))
 	}
+
+	for _, term := range []string{"%%%", "___", "%_%"} {
+		results, total, err = manager.Conversations(models.Query{Term: term, Page: 1, PageSize: 10}, scope)
+		if err != nil {
+			t.Fatalf("searching conversations for %q: %v", term, err)
+		}
+		if total != 0 || len(results) != 0 {
+			t.Fatalf("conversation search for %q returned total %d, results %d", term, total, len(results))
+		}
+
+		messages, messageTotal, err := manager.Messages(models.Query{Term: term, Page: 1, PageSize: 10}, scope)
+		if err != nil {
+			t.Fatalf("searching messages for %q: %v", term, err)
+		}
+		if messageTotal != 0 || len(messages) != 0 {
+			t.Fatalf("message search for %q returned total %d, results %d", term, messageTotal, len(messages))
+		}
+
+		contacts, err := manager.Contacts(term, 10)
+		if err != nil {
+			t.Fatalf("searching contacts for %q: %v", term, err)
+		}
+		if len(contacts) != 0 {
+			t.Fatalf("contact search for %q returned %d results", term, len(contacts))
+		}
+	}
 }
 
-func insertSearchConversation(t *testing.T, db *sqlx.DB, reference, email, firstName, lastName, subject string, lastMessageAt time.Time) {
+func insertSearchConversation(t *testing.T, db *sqlx.DB, reference, email, firstName, lastName, subject string, lastMessageAt time.Time) (int, int) {
 	t.Helper()
 
 	var contactID int
@@ -117,7 +149,8 @@ func insertSearchConversation(t *testing.T, db *sqlx.DB, reference, email, first
 		t.Fatalf("inserting contact: %v", err)
 	}
 
-	if _, err := db.Exec(`
+	var conversationID int
+	if err := db.Get(&conversationID, `
 		INSERT INTO conversations (contact_id, inbox_id, status_id, reference_number, subject, last_message_at)
 		VALUES (
 			$1,
@@ -127,7 +160,9 @@ func insertSearchConversation(t *testing.T, db *sqlx.DB, reference, email, first
 			$3,
 			$4
 		)
+		RETURNING id
 	`, contactID, reference, subject, lastMessageAt); err != nil {
 		t.Fatalf("inserting conversation: %v", err)
 	}
+	return conversationID, contactID
 }
diff --git a/internal/user/agent.go b/internal/user/agent.go
index a6ba92fd..daf38d26 100644
--- a/internal/user/agent.go
+++ b/internal/user/agent.go
@@ -82,7 +82,7 @@ func (u *Manager) InvalidateAllAgentCache() {
 // GetAgentsCompact returns agents and AI assistants matching search, all of them when pageSize is 0.
 func (u *Manager) GetAgentsCompact(search, userType string, enabledOnly bool, page, pageSize int) ([]models.UserCompact, error) {
 	var users = make([]models.UserCompact, 0)
-	if err := u.q.GetAgentsCompact.Select(&users, pq.Array([]string{models.UserTypeAgent, models.UserTypeAIAssistant}), search, userType, enabledOnly, pageSize, dbutil.PageOffset(page, pageSize)); err != nil {
+	if err := u.q.GetAgentsCompact.Select(&users, pq.Array([]string{models.UserTypeAgent, models.UserTypeAIAssistant}), search, userType, enabledOnly, pageSize, dbutil.PageOffset(page, pageSize), dbutil.ContainsPattern(search)); err != nil {
 		u.lo.Error("error fetching users from db", "error", err)
 		return users, envelope.NewError(envelope.GeneralError, u.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
diff --git a/internal/user/queries.sql b/internal/user/queries.sql
index d5a497c9..abc72c5d 100644
--- a/internal/user/queries.sql
+++ b/internal/user/queries.sql
@@ -8,7 +8,7 @@ WHERE (users.email != 'System' OR users.type = 'ai_assistant') AND users.deleted
 SELECT users.id, users.avatar_url, users.type, users.created_at, users.updated_at, users.first_name, users.last_name, users.email, users.enabled, users.external_user_id, users.availability_status
 FROM users
 WHERE (users.email != 'System' OR users.type = 'ai_assistant') AND users.deleted_at IS NULL AND users.type = ANY($1)
-    AND ($2 = '' OR CONCAT(users.first_name, ' ', COALESCE(users.last_name, '')) ILIKE '%' || $2 || '%' OR users.email ILIKE '%' || $2 || '%')
+    AND ($2 = '' OR CONCAT(users.first_name, ' ', COALESCE(users.last_name, '')) ILIKE $7 ESCAPE '\' OR users.email ILIKE $7 ESCAPE '\')
     AND ($3 = '' OR users.type::text = $3)
     AND (NOT $4 OR users.enabled)
 ORDER BY users.first_name, users.last_name, users.id

From 9c1e14704f3f3885eab04f9f215f0ee57e03a4f5 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 01:05:21 +0530
Subject: [PATCH 082/178] fix campaign reply and poll edge cases, enlarge
 mobile launcher

---
 cmd/widget_campaign.go                        |  5 +++--
 cmd/widget_campaign_reply.go                  |  3 +++
 .../admin/inbox/LivechatWidgetPreview.vue     |  1 -
 .../features/admin/inbox/WidgetCampaigns.vue  |  4 ++--
 .../admin/inbox/livechatFormSchema.js         | 10 ++++++++-
 frontend/apps/widget/src/App.vue              |  2 ++
 .../src/composables/useReplyPreviews.js       |  6 +++---
 frontend/apps/widget/src/store/chat.js        |  2 +-
 frontend/apps/widget/src/views/HelpView.vue   |  1 -
 internal/conversation/conversation.go         |  1 +
 internal/conversation/proactive.go            |  3 +++
 internal/conversation/queries.sql             |  3 +++
 .../channel/livechat/proactive/eligibility.go |  5 +++--
 static/widget.js                              | 21 +++++++++----------
 14 files changed, 43 insertions(+), 24 deletions(-)

diff --git a/cmd/widget_campaign.go b/cmd/widget_campaign.go
index 789d34c0..66704884 100644
--- a/cmd/widget_campaign.go
+++ b/cmd/widget_campaign.go
@@ -65,7 +65,8 @@ func handleWidgetCampaign(r *fastglue.Request) error {
 		}
 		reason := campaign.IneligibleReason(ctx, app.automation.MatchesContact(campaign.Conditions, contact), within)
 		if hoursErr != nil {
-			return sendErrorEnvelope(r, hoursErr)
+			app.lo.Warn("skipping campaign with invalid business hours", "campaign_id", campaign.ID, "business_hours_id", campaign.BusinessHoursID)
+			continue
 		}
 		if reason != "" {
 			continue
@@ -74,7 +75,7 @@ func handleWidgetCampaign(r *fastglue.Request) error {
 		if err != nil {
 			continue
 		}
-		snapshot := proactive.Snapshot{Message: campaign.Message, Sender: strings.TrimSpace(sender.FirstName + " " + sender.LastName), Avatar: sender.AvatarURL.String, SenderID: sender.ID, TeamID: campaign.TeamID}
+		snapshot := proactive.Snapshot{Message: campaign.Message, Sender: strings.TrimSpace(sender.FullName()), Avatar: sender.AvatarURL.String, SenderID: sender.ID, TeamID: campaign.TeamID}
 		if campaign.SenderID == 0 {
 			snapshot.Sender = config.BrandName
 		}
diff --git a/cmd/widget_campaign_reply.go b/cmd/widget_campaign_reply.go
index f005516a..3079846a 100644
--- a/cmd/widget_campaign_reply.go
+++ b/cmd/widget_campaign_reply.go
@@ -76,6 +76,9 @@ func handleWidgetCampaignReply(r *fastglue.Request, req chatInitReq, inbox imode
 		meta := map[string]any{"ip": realip.FromRequest(r.RequestCtx), "user_agent": string(r.RequestCtx.Request.Header.Peek("User-Agent")), "campaign_id": delivery.CampaignID}
 		delivery.ConversationUUID, err = app.conversation.CreateProactiveConversation(delivery, contact.ID, req.Message, attrs, meta, maxChatConversationsPerContact, chatConversationRateLimitWindow)
 		if err != nil {
+			if _, ok := err.(envelope.Error); ok {
+				return sendErrorEnvelope(r, err)
+			}
 			return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.T("globals.messages.errorSendingMessage"), nil))
 		}
 		if err := app.conversation.ProcessIncomingMessageHooks(delivery.ConversationUUID, true); err != nil {
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
index 5387b49f..a17a5ed4 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
@@ -628,7 +628,6 @@ const homeItems = computed(() =>
 )
 
 const campaign = computed(() => props.config.preview_campaign || null)
-// Only one of the two can show, so collapse the window to reveal the invitation.
 watch(campaign, (value) => {
   if (value) open.value = false
 })
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
index 49310a37..82ee4145 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
@@ -40,7 +40,7 @@ import {
 } from '@shared-ui/components/ui/collapsible'
 import SwitchField from '@shared-ui/components/SwitchField.vue'
 import WidgetConditions from './WidgetConditions.vue'
-import { defaultCampaign } from './livechatFormSchema.js'
+import { defaultCampaign, newCampaignId } from './livechatFormSchema.js'
 import { handleHTTPError } from '@shared-ui/utils/http'
 import { ChevronRight, ChevronDown, Plus, CircleCheck, CircleSlash } from 'lucide-vue-next'
 
@@ -114,7 +114,7 @@ const add = (source) => {
   const item = source
     ? {
         ...JSON.parse(JSON.stringify(source)),
-        id: crypto.randomUUID(),
+        id: newCampaignId(),
         enabled: false,
         name: `${source.name} (${t('globals.terms.copy')})`
       }
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
index d29cfea4..8dea6fd6 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
@@ -22,8 +22,16 @@ export const widgetConditionsSchema = z.object({
   logical_op: z.enum(['AND', 'OR']),
   rules: z.array(z.object({ field: z.string().min(1), field_type: z.literal('contact_custom_attribute'), operator: z.string().min(1), value: z.string(), case_sensitive_match: z.boolean() })).max(20)
 })
+export const newCampaignId = () => {
+  if (typeof crypto.randomUUID === 'function') return crypto.randomUUID()
+  const bytes = crypto.getRandomValues(new Uint8Array(16))
+  bytes[6] = (bytes[6] & 0x0f) | 0x40
+  bytes[8] = (bytes[8] & 0x3f) | 0x80
+  const hex = Array.from(bytes, (b) => b.toString(16).padStart(2, '0')).join('')
+  return `${hex.slice(0, 8)}-${hex.slice(8, 12)}-${hex.slice(12, 16)}-${hex.slice(16, 20)}-${hex.slice(20)}`
+}
 export const defaultCampaign = () => ({
-  id: crypto.randomUUID(), name: '', enabled: false, message: '', sender_id: 0, team_id: 0,
+  id: newCampaignId(), name: '', enabled: false, message: '', sender_id: 0, team_id: 0,
   audience: 'all', include_urls: [], exclude_urls: [], conditions: { logical_op: 'AND', rules: [] },
   event: '', delay_seconds: 10,
   business_hours_id: 0, business_hours: 'any', desktop: true, mobile: true,
diff --git a/frontend/apps/widget/src/App.vue b/frontend/apps/widget/src/App.vue
index f89413fe..5ad7f3ab 100644
--- a/frontend/apps/widget/src/App.vue
+++ b/frontend/apps/widget/src/App.vue
@@ -128,6 +128,7 @@ const setupParentMessageListeners = () => {
       if (event.data.jwt) {
         proactive.reset()
         help.reset()
+        if (widgetStore.currentView === 'help') widgetStore.navigateToHome()
         chatStore.drafts = {}
         chatStore.preChatDraft = {}
         chatStore.conversations = null
@@ -154,6 +155,7 @@ const setupParentMessageListeners = () => {
       chatStore.conversations = null
       chatStore.setCurrentConversation(null)
       help.reset()
+      if (widgetStore.currentView === 'help') widgetStore.navigateToHome()
       signalWidgetLoaded()
     } else if (event.data.type === 'CAMPAIGN_CONTEXT') {
       await proactive.next(event.data.context)
diff --git a/frontend/apps/widget/src/composables/useReplyPreviews.js b/frontend/apps/widget/src/composables/useReplyPreviews.js
index df93de4e..5397430c 100644
--- a/frontend/apps/widget/src/composables/useReplyPreviews.js
+++ b/frontend/apps/widget/src/composables/useReplyPreviews.js
@@ -3,6 +3,7 @@ import { useI18n } from 'vue-i18n'
 import { useWidgetStore } from '@widget/store/widget.js'
 import { useChatStore } from '@widget/store/chat.js'
 import { useUserStore } from '@widget/store/user.js'
+import { getTextFromHTML } from '@shared-ui/utils/string.js'
 
 const parentOrigin = () => new URLSearchParams(window.location.search).get('parent_origin')
 
@@ -16,16 +17,15 @@ export function useReplyPreviews() {
     const element = document.querySelector('.libredesk-widget-app')
     if (!element) return
     const style = getComputedStyle(element)
-    const previews = chat.getConversations.filter(conversation => conversation.unread_message_count > 0 && conversation.last_message?.author?.type === 'agent').map(conversation => {
+    const previews = chat.getConversations.filter(conversation => conversation.unread_message_count > 0 && ['agent', 'ai_assistant'].includes(conversation.last_message?.author?.type)).map(conversation => {
       const message = conversation.last_message
       const author = message.author || {}
-      const parsed = new DOMParser().parseFromString(message.content || '', 'text/html')
       return {
         conversation: conversation.uuid,
         key: `${conversation.uuid}:${message.created_at}`,
         name: [author.first_name, author.last_name].filter(Boolean).join(' ') || widget.config.brand_name,
         avatar: author.avatar_url || '',
-        text: widget.config.previews?.content === 'generic' ? t('widget.newReply') : parsed.body.textContent.trim().slice(0, 240) || t('globals.terms.attachment'),
+        text: widget.config.previews?.content === 'generic' ? t('widget.newReply') : getTextFromHTML(message.content || '').slice(0, 240) || t('globals.terms.attachment'),
         image: widget.config.previews?.content === 'generic' ? '' : message.attachments?.find(attachment => attachment.content_type?.startsWith('image/'))?.thumbnail_url || '',
       }
     })
diff --git a/frontend/apps/widget/src/store/chat.js b/frontend/apps/widget/src/store/chat.js
index 4aacf2e1..bc7f204f 100644
--- a/frontend/apps/widget/src/store/chat.js
+++ b/frontend/apps/widget/src/store/chat.js
@@ -72,7 +72,7 @@ export const useChatStore = defineStore('chat', () => {
     const addMessageToConversation = (conversationUUID, message) => {
         messageCache.addMessage(conversationUUID, message)
         messageCacheVersion.value++ // Trigger reactivity
-        const shouldIncrementUnread = message.author?.type === 'agent'
+        const shouldIncrementUnread = ['agent', 'ai_assistant'].includes(message.author?.type)
         updateConversationListLastMessage(conversationUUID, message, shouldIncrementUnread)
     }
 
diff --git a/frontend/apps/widget/src/views/HelpView.vue b/frontend/apps/widget/src/views/HelpView.vue
index ad57437f..08e186da 100644
--- a/frontend/apps/widget/src/views/HelpView.vue
+++ b/frontend/apps/widget/src/views/HelpView.vue
@@ -17,7 +17,6 @@ let mounted = true
 onUnmounted(() => {
   mounted = false
 })
-// Captured before each request so a login or logout mid-request discards only that response.
 const valid = (identity) => mounted && identity === help.identity
 const busy = ref(false)
 const error = ref('')
diff --git a/internal/conversation/conversation.go b/internal/conversation/conversation.go
index 393c8102..2d6311dc 100644
--- a/internal/conversation/conversation.go
+++ b/internal/conversation/conversation.go
@@ -299,6 +299,7 @@ type queries struct {
 	LockCampaignDelivery     *sqlx.Stmt `query:"lock-campaign-delivery"`
 	CompleteCampaignDelivery *sqlx.Stmt `query:"complete-campaign-delivery"`
 	AssignProactiveTeam      *sqlx.Stmt `query:"assign-proactive-team"`
+	RevertCampaignDelivery   *sqlx.Stmt `query:"revert-campaign-delivery"`
 	// Conversation queries.
 	GetConversationUUID                 *sqlx.Stmt `query:"get-conversation-uuid"`
 	GetConversation                     *sqlx.Stmt `query:"get-conversation"`
diff --git a/internal/conversation/proactive.go b/internal/conversation/proactive.go
index 0b3b3fc8..96403a74 100644
--- a/internal/conversation/proactive.go
+++ b/internal/conversation/proactive.go
@@ -71,6 +71,9 @@ func (m *Manager) CreateProactiveConversation(delivery proactive.Delivery, conta
 			if err := m.DeleteConversation(uuid); err != nil {
 				m.lo.Error("error deleting proactive conversation after message insert failure", "conversation_uuid", uuid, "error", err)
 			}
+			if _, err := m.q.RevertCampaignDelivery.Exec(delivery.ID); err != nil {
+				m.lo.Error("error reverting campaign delivery after message insert failure", "delivery_id", delivery.ID, "error", err)
+			}
 			return "", err
 		}
 	}
diff --git a/internal/conversation/queries.sql b/internal/conversation/queries.sql
index f1f86b73..ee315a30 100644
--- a/internal/conversation/queries.sql
+++ b/internal/conversation/queries.sql
@@ -1077,5 +1077,8 @@ UPDATE widget_campaign_deliveries
 SET conversation_uuid = $2, contact_id = $3, replied = TRUE, opened = TRUE, displayed = TRUE
 WHERE id = $1;
 
+-- name: revert-campaign-delivery
+UPDATE widget_campaign_deliveries SET conversation_uuid = NULL, replied = FALSE WHERE id = $1;
+
 -- name: assign-proactive-team
 UPDATE conversations SET assigned_team_id = NULLIF($2, 0) WHERE id = $1;
diff --git a/internal/inbox/channel/livechat/proactive/eligibility.go b/internal/inbox/channel/livechat/proactive/eligibility.go
index 3a4e6699..95cc047b 100644
--- a/internal/inbox/channel/livechat/proactive/eligibility.go
+++ b/internal/inbox/channel/livechat/proactive/eligibility.go
@@ -11,6 +11,8 @@ import (
 	"github.com/google/uuid"
 )
 
+var campaignOperators = []string{amodels.RuleOperatorContains, amodels.RuleOperatorNotContains, amodels.RuleOperatorEquals, amodels.RuleOperatorNotEqual, amodels.RuleOperatorSet, amodels.RuleOperatorNotSet, amodels.RuleOperatorGreaterThan, amodels.RuleOperatorLessThan, amodels.RuleOperatorStartsWith}
+
 func (c Campaign) Validate() error {
 	if _, err := uuid.Parse(c.ID); err != nil {
 		return fmt.Errorf("id")
@@ -47,7 +49,6 @@ func (c Campaign) Validate() error {
 	return ValidateConditions(c.Conditions)
 }
 
-// withinHours is a func so the business-hours lookup only runs for campaigns that pass every in-memory check.
 func (c Campaign) IneligibleReason(ctx Context, conditionsMatch bool, withinHours func() bool) string {
 	switch {
 	case !c.Enabled:
@@ -77,7 +78,7 @@ func ValidateConditions(group amodels.RuleGroup) error {
 		return fmt.Errorf("conditions")
 	}
 	for _, rule := range group.Rules {
-		if rule.FieldType != amodels.FieldTypeContactCustomAttribute || rule.Field == "" || len(rule.Value) > 2048 || !slices.Contains([]string{"contains", "not contains", "equals", "not equals", "set", "not set", "greater than", "less than", "starts with"}, rule.Operator) {
+		if rule.FieldType != amodels.FieldTypeContactCustomAttribute || rule.Field == "" || len(rule.Value) > 2048 || !slices.Contains(campaignOperators, rule.Operator) {
 			return fmt.Errorf("conditions")
 		}
 	}
diff --git a/static/widget.js b/static/widget.js
index 554e4a47..0118f028 100644
--- a/static/widget.js
+++ b/static/widget.js
@@ -27,7 +27,7 @@
             this.EXPANDED_WIDTH = '750px';
             this.MOBILE_BREAKPOINT = 600;
             this.LAUNCHER_SIZE = 60;
-            this.MOBILE_LAUNCHER_SIZE = 50;
+            this.MOBILE_LAUNCHER_SIZE = 68;
             this.CAMPAIGN_POLL_MIN = 5;
             this.CAMPAIGN_POLL_MAX = 60;
 
@@ -219,8 +219,8 @@
                 position: fixed;
                 cursor: pointer;
                 z-index: 9999;
-                width: ${this.isMobile ? this.MOBILE_LAUNCHER_SIZE : this.LAUNCHER_SIZE}px;
-                height: ${this.isMobile ? this.MOBILE_LAUNCHER_SIZE : this.LAUNCHER_SIZE}px;
+                width: ${this.launcherSize()}px;
+                height: ${this.launcherSize()}px;
                 background-color: ${launcher.color || colors.primary};
                 border-radius: 50%;
                 display: flex;
@@ -333,18 +333,18 @@
 
         sendMobileState () {
             this.isMobile = window.innerWidth <= this.MOBILE_BREAKPOINT;
-            this.updateLauncherSize();
             this.postToIframe({
                 type: 'SET_MOBILE_STATE',
                 isMobile: this.isMobile
             });
+            if (this.toggleButton) {
+                this.toggleButton.style.width = this.launcherSize() + 'px';
+                this.toggleButton.style.height = this.launcherSize() + 'px';
+            }
         }
 
-        updateLauncherSize () {
-            if (!this.toggleButton) return;
-            const size = this.isMobile ? this.MOBILE_LAUNCHER_SIZE : this.LAUNCHER_SIZE;
-            this.toggleButton.style.width = size + 'px';
-            this.toggleButton.style.height = size + 'px';
+        launcherSize () {
+            return this.isMobile ? this.MOBILE_LAUNCHER_SIZE : this.LAUNCHER_SIZE;
         }
 
         getNormalIframeHeight () {
@@ -698,7 +698,7 @@
             const host = document.createElement('div');
             const side = this.widgetSettings.launcher.position === 'left' ? 'left' : 'right';
             const spacing = this.widgetSettings.launcher.spacing;
-            Object.assign(host.style, { position: 'fixed', zIndex: '9998', bottom: `${spacing.bottom + (this.isMobile ? this.MOBILE_LAUNCHER_SIZE : this.LAUNCHER_SIZE) + 12}px`, [side]: `${spacing.side}px`, width: `min(320px, calc(100vw - ${spacing.side * 2}px))` });
+            Object.assign(host.style, { position: 'fixed', zIndex: '9998', bottom: `${spacing.bottom + this.launcherSize() + 12}px`, [side]: `${spacing.side}px`, width: `min(320px, calc(100vw - ${spacing.side * 2}px))` });
             const root = host.attachShadow({ mode: 'open' });
             const style = document.createElement('style');
             style.textContent = ':host{font:14px/1.5 system-ui}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline:2px solid;outline-offset:2px}.stack{display:flex;flex-direction:column;gap:8px}.card{display:flex;align-items:flex-start;border:1px solid;border-radius:12px;overflow:hidden}.open{display:flex;gap:10px;align-items:flex-start;flex:1;min-width:0;padding:12px;text-align:left;border:0;background:transparent}.name{font-weight:600;display:block}.text{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.avatar{width:28px;height:28px;border-radius:50%;object-fit:cover}.image{max-width:64px;max-height:48px;object-fit:cover}.close{padding:8px;min-height:44px;min-width:44px;border:0;background:transparent}.all{align-self:flex-end;border:1px solid;border-radius:6px;padding:4px 8px}';
@@ -779,7 +779,6 @@
             if (this.campaignInterval) return;
             let last = performance.now();
             let elapsed = 0;
-            // Back off while nothing matches so a long visit doesn't poll the server every few seconds.
             let gap = this.CAMPAIGN_POLL_MIN;
             this.campaignInterval = setInterval(() => {
                 const now = performance.now();

From 56269ca6b3a277b58751f8dc5390000bf63e19f2 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 01:05:28 +0530
Subject: [PATCH 083/178] remove extra spacing from clear filters icon

---
 frontend/apps/main/src/features/search/SearchResults.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/features/search/SearchResults.vue b/frontend/apps/main/src/features/search/SearchResults.vue
index 9574afdd..02e899bc 100644
--- a/frontend/apps/main/src/features/search/SearchResults.vue
+++ b/frontend/apps/main/src/features/search/SearchResults.vue
@@ -18,7 +18,7 @@
           class="shrink-0 text-muted-foreground"
           @click="emit('clearFilters')"
         >
-          <X class="mr-1 h-4 w-4" aria-hidden="true" />
+          <X class="h-4 w-4" aria-hidden="true" />
           {{ t('globals.messages.clearFilters') }}
         </Button>
       </div>

From 3d09ad1a2e1834293c626b55f7dd7bc79883d640 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 01:20:44 +0530
Subject: [PATCH 084/178] preserve existing search API responses

---
 cmd/handlers.go                     |  4 ++
 cmd/search.go                       | 95 +++++++++++++++++++++--------
 frontend/apps/main/src/api/index.js |  4 +-
 internal/search/models/models.go    |  1 +
 internal/search/queries.sql         |  1 +
 internal/search/search.go           | 64 +++++++++++++------
 internal/search/search_test.go      | 23 ++++++-
 7 files changed, 143 insertions(+), 49 deletions(-)

diff --git a/cmd/handlers.go b/cmd/handlers.go
index bd2fdc1e..680a654e 100644
--- a/cmd/handlers.go
+++ b/cmd/handlers.go
@@ -91,6 +91,10 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 	g.GET("/api/v1/messages/search", perm(handleSearchMessages, "messages:read"))
 	g.GET("/api/v1/contacts/search", perm(handleSearchContacts, "contacts:read"))
 
+	// New paginated search bar routes with better filter support and pagination.
+	g.GET("/api/v1/search/conversations", perm(handlePaginatedSearchConversations, "conversations:read"))
+	g.GET("/api/v1/search/messages", perm(handlePaginatedSearchMessages, "messages:read"))
+
 	// Views.
 	g.GET("/api/v1/views/me", perm(handleGetUserViews, "view:manage"))
 	g.POST("/api/v1/views/me", perm(handleCreateUserView, "view:manage"))
diff --git a/cmd/search.go b/cmd/search.go
index 3efb2394..62a3b04a 100644
--- a/cmd/search.go
+++ b/cmd/search.go
@@ -16,11 +16,56 @@ import (
 const (
 	minSearchQueryLength = 3
 
-	maxContactSearchLimit = 15
+	maxConversationSearchLimit = 1000
+	maxMessageSearchLimit      = 30
+	maxContactSearchLimit      = 15
 )
 
-// handleSearchConversations searches conversations by term with optional list filters, paginated.
 func handleSearchConversations(r *fastglue.Request) error {
+	app, user, term, err := searchTerm(r)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	scope, err := readScope(app, user.ID)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	results, err := app.search.ConversationFirstPage(term, scope, searchLimit(r, maxConversationSearchLimit))
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(results)
+}
+
+func handleSearchMessages(r *fastglue.Request) error {
+	app, user, term, err := searchTerm(r)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	scope, err := readScope(app, user.ID)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	results, err := app.search.MessageFirstPage(term, scope, searchLimit(r, maxMessageSearchLimit))
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(results)
+}
+
+func handleSearchContacts(r *fastglue.Request) error {
+	app, _, term, err := searchTerm(r)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	results, err := app.search.Contacts(term, searchLimit(r, maxContactSearchLimit))
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(results)
+}
+
+func handlePaginatedSearchConversations(r *fastglue.Request) error {
 	app, user, q, err := searchInputs(r)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
@@ -36,8 +81,7 @@ func handleSearchConversations(r *fastglue.Request) error {
 	return r.SendEnvelope(pageResults(results, total, q))
 }
 
-// handleSearchMessages searches messages by term with optional list filters, paginated.
-func handleSearchMessages(r *fastglue.Request) error {
+func handlePaginatedSearchMessages(r *fastglue.Request) error {
 	app, user, q, err := searchInputs(r)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
@@ -53,29 +97,10 @@ func handleSearchMessages(r *fastglue.Request) error {
 	return r.SendEnvelope(pageResults(results, total, q))
 }
 
-// handleSearchContacts searches contacts based on the query.
-func handleSearchContacts(r *fastglue.Request) error {
-	app, _, q, err := searchInputs(r)
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-	limit, err := strconv.Atoi(string(r.RequestCtx.QueryArgs().Peek("limit")))
-	if err != nil || limit < 1 || limit > maxContactSearchLimit {
-		limit = maxContactSearchLimit
-	}
-	results, err := app.search.Contacts(q.Term, limit)
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-	return r.SendEnvelope(results)
-}
-
 func searchInputs(r *fastglue.Request) (*App, amodels.User, smodels.Query, error) {
-	app := r.Context.(*App)
-	user, _ := r.RequestCtx.UserValue("user").(amodels.User)
-	term := string(r.RequestCtx.QueryArgs().Peek("query"))
-	if len(term) < minSearchQueryLength {
-		return app, user, smodels.Query{}, envelope.NewError(envelope.InputError, app.i18n.Ts("search.minQueryLength", "length", fmt.Sprintf("%d", minSearchQueryLength)), nil)
+	app, user, term, err := searchTerm(r)
+	if err != nil {
+		return app, user, smodels.Query{}, err
 	}
 	page, pageSize := getPagination(r)
 	query := searchmanager.NormalizeQuery(smodels.Query{
@@ -87,6 +112,24 @@ func searchInputs(r *fastglue.Request) (*App, amodels.User, smodels.Query, error
 	return app, user, query, nil
 }
 
+func searchTerm(r *fastglue.Request) (*App, amodels.User, string, error) {
+	app := r.Context.(*App)
+	user, _ := r.RequestCtx.UserValue("user").(amodels.User)
+	term := string(r.RequestCtx.QueryArgs().Peek("query"))
+	if len(term) < minSearchQueryLength {
+		return app, user, "", envelope.NewError(envelope.InputError, app.i18n.Ts("search.minQueryLength", "length", fmt.Sprintf("%d", minSearchQueryLength)), nil)
+	}
+	return app, user, term, nil
+}
+
+func searchLimit(r *fastglue.Request, max int) int {
+	limit, err := strconv.Atoi(string(r.RequestCtx.QueryArgs().Peek("limit")))
+	if err != nil || limit < 1 || limit > max {
+		return max
+	}
+	return limit
+}
+
 func pageResults(results any, total int, q smodels.Query) envelope.PageResults {
 	return envelope.PageResults{
 		Results:    results,
diff --git a/frontend/apps/main/src/api/index.js b/frontend/apps/main/src/api/index.js
index bab5473b..8c28ed1f 100644
--- a/frontend/apps/main/src/api/index.js
+++ b/frontend/apps/main/src/api/index.js
@@ -67,8 +67,8 @@ const updateCustomAttribute = (id, data) =>
     }
   })
 const deleteCustomAttribute = (id) => http.delete(`/api/v1/custom-attributes/${id}`)
-const searchConversations = (params) => http.get('/api/v1/conversations/search', { params })
-const searchMessages = (params) => http.get('/api/v1/messages/search', { params })
+const searchConversations = (params) => http.get('/api/v1/search/conversations', { params })
+const searchMessages = (params) => http.get('/api/v1/search/messages', { params })
 const searchContacts = (params) => http.get('/api/v1/contacts/search', { params })
 const getEmailNotificationSettings = () => http.get('/api/v1/settings/notifications/email')
 const updateEmailNotificationSettings = (data) =>
diff --git a/internal/search/models/models.go b/internal/search/models/models.go
index ad8c2a90..b5832b45 100644
--- a/internal/search/models/models.go
+++ b/internal/search/models/models.go
@@ -71,6 +71,7 @@ type MessageResult struct {
 	CreatedAt                   time.Time   `db:"created_at" json:"created_at"`
 	Type                        string      `db:"type" json:"type"`
 	Private                     bool        `db:"private" json:"private"`
+	TextContent                 string      `db:"text_content" json:"text_content"`
 	Snippet                     null.String `db:"snippet" json:"snippet"`
 	Sender                      Sender      `db:"sender" json:"sender"`
 	ConversationCreatedAt       time.Time   `db:"conversation_created_at" json:"conversation_created_at"`
diff --git a/internal/search/queries.sql b/internal/search/queries.sql
index c6894c2c..e9656d42 100644
--- a/internal/search/queries.sql
+++ b/internal/search/queries.sql
@@ -61,6 +61,7 @@ SELECT
     conversation_messages.created_at,
     conversation_messages.type,
     conversation_messages.private,
+    LEFT(conversation_messages.text_content, 200) AS text_content,
     CASE WHEN POSITION(LOWER($1) IN LOWER(conversation_messages.text_content)) > 81 THEN '…' ELSE '' END
         || SUBSTRING(
             conversation_messages.text_content
diff --git a/internal/search/search.go b/internal/search/search.go
index fa0403c3..d219c67a 100644
--- a/internal/search/search.go
+++ b/internal/search/search.go
@@ -15,7 +15,9 @@ import (
 )
 
 const (
-	maxPageSize = 100
+	maxPageSize                  = 100
+	maxConversationFirstPageSize = 1000
+	maxMessageFirstPageSize      = 30
 
 	conversationResultOrder = "(conversations.reference_number = $1) DESC, conversations.last_message_at DESC NULLS LAST"
 	messageResultOrder      = "conversation_messages.created_at DESC NULLS LAST"
@@ -75,7 +77,40 @@ func New(opts Opts) (*Manager, error) {
 
 // Conversations searches conversations the agent is allowed to read, returning the page and the total match count.
 func (s *Manager) Conversations(query models.Query, scope models.ReadScope) ([]models.ConversationResult, int, error) {
-	sql, args, err := s.buildQuery(s.q.SearchConversations, query, scope, conversationResultOrder, s.filterFields)
+	return s.searchConversations(query, scope, maxPageSize)
+}
+
+func (s *Manager) ConversationFirstPage(term string, scope models.ReadScope, limit int) ([]models.ConversationResult, error) {
+	results, _, err := s.searchConversations(models.Query{Term: term, Page: 1, PageSize: limit}, scope, maxConversationFirstPageSize)
+	return results, err
+}
+
+// Messages searches messages in conversations the agent is allowed to read, returning the page and the total match count.
+func (s *Manager) Messages(query models.Query, scope models.ReadScope) ([]models.MessageResult, int, error) {
+	return s.searchMessages(query, scope, maxPageSize)
+}
+
+func (s *Manager) MessageFirstPage(term string, scope models.ReadScope, limit int) ([]models.MessageResult, error) {
+	results, _, err := s.searchMessages(models.Query{Term: term, Page: 1, PageSize: limit}, scope, maxMessageFirstPageSize)
+	return results, err
+}
+
+// Contacts searches contacts based on the query
+func (s *Manager) Contacts(query string, limit int) ([]models.ContactResult, error) {
+	var results = make([]models.ContactResult, 0)
+	if err := s.q.SearchContacts.Select(&results, dbutil.ContainsPattern(query), limit); err != nil {
+		s.lo.Error("error searching contacts", "error", err)
+		return nil, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return results, nil
+}
+
+func NormalizeQuery(query models.Query) models.Query {
+	return normalizeQuery(query, maxPageSize)
+}
+
+func (s *Manager) searchConversations(query models.Query, scope models.ReadScope, pageSizeLimit int) ([]models.ConversationResult, int, error) {
+	sql, args, err := s.buildQuery(s.q.SearchConversations, query, scope, conversationResultOrder, s.filterFields, pageSizeLimit)
 	if err != nil {
 		return nil, 0, err
 	}
@@ -91,13 +126,12 @@ func (s *Manager) Conversations(query models.Query, scope models.ReadScope) ([]m
 	return results, total, nil
 }
 
-// Messages searches messages in conversations the agent is allowed to read, returning the page and the total match count.
-func (s *Manager) Messages(query models.Query, scope models.ReadScope) ([]models.MessageResult, int, error) {
+func (s *Manager) searchMessages(query models.Query, scope models.ReadScope, pageSizeLimit int) ([]models.MessageResult, int, error) {
 	fields := dbutil.AllowedFields{"conversation_messages": messageAllowedFields}
 	for model, f := range s.filterFields {
 		fields[model] = f
 	}
-	sql, args, err := s.buildQuery(s.q.SearchMessages, query, scope, messageResultOrder, fields)
+	sql, args, err := s.buildQuery(s.q.SearchMessages, query, scope, messageResultOrder, fields, pageSizeLimit)
 	if err != nil {
 		return nil, 0, err
 	}
@@ -113,22 +147,12 @@ func (s *Manager) Messages(query models.Query, scope models.ReadScope) ([]models
 	return results, total, nil
 }
 
-// Contacts searches contacts based on the query
-func (s *Manager) Contacts(query string, limit int) ([]models.ContactResult, error) {
-	var results = make([]models.ContactResult, 0)
-	if err := s.q.SearchContacts.Select(&results, dbutil.ContainsPattern(query), limit); err != nil {
-		s.lo.Error("error searching contacts", "error", err)
-		return nil, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
-	}
-	return results, nil
-}
-
-func NormalizeQuery(query models.Query) models.Query {
+func normalizeQuery(query models.Query, pageSizeLimit int) models.Query {
 	if query.Page < 1 {
 		query.Page = 1
 	}
-	if query.PageSize < 1 || query.PageSize > maxPageSize {
-		query.PageSize = maxPageSize
+	if query.PageSize < 1 || query.PageSize > pageSizeLimit {
+		query.PageSize = pageSizeLimit
 	}
 	if query.Filters == "" {
 		query.Filters = "[]"
@@ -136,8 +160,8 @@ func NormalizeQuery(query models.Query) models.Query {
 	return query
 }
 
-func (s *Manager) buildQuery(base string, query models.Query, scope models.ReadScope, orderBy string, fields dbutil.AllowedFields) (string, []any, error) {
-	query = NormalizeQuery(query)
+func (s *Manager) buildQuery(base string, query models.Query, scope models.ReadScope, orderBy string, fields dbutil.AllowedFields, pageSizeLimit int) (string, []any, error) {
+	query = normalizeQuery(query, pageSizeLimit)
 	baseArgs := append([]any{query.Term}, scopeArgs(scope)...)
 	baseArgs = append(baseArgs, dbutil.ContainsPattern(query.Term))
 	sql, args, err := dbutil.BuildFilterQuery(base, baseArgs, query.Filters, fields, s.filterRenderers, s.filterLocation())
diff --git a/internal/search/search_test.go b/internal/search/search_test.go
index 78ea7fc5..81ec40a6 100644
--- a/internal/search/search_test.go
+++ b/internal/search/search_test.go
@@ -34,6 +34,7 @@ func TestBuildConversationQueryPrioritizesExactReference(t *testing.T) {
 		models.ReadScope{},
 		conversationResultOrder,
 		nil,
+		maxPageSize,
 	)
 	if err != nil {
 		t.Fatalf("building query: %v", err)
@@ -49,6 +50,18 @@ func TestBuildConversationQueryPrioritizesExactReference(t *testing.T) {
 	}
 }
 
+func TestFirstPageSearchKeepsLegacyLimits(t *testing.T) {
+	conversationQuery := normalizeQuery(models.Query{PageSize: 500}, maxConversationFirstPageSize)
+	if conversationQuery.PageSize != 500 {
+		t.Fatalf("conversation page size = %d, want 500", conversationQuery.PageSize)
+	}
+
+	messageQuery := normalizeQuery(models.Query{PageSize: 100}, maxMessageFirstPageSize)
+	if messageQuery.PageSize != maxMessageFirstPageSize {
+		t.Fatalf("message page size = %d, want %d", messageQuery.PageSize, maxMessageFirstPageSize)
+	}
+}
+
 func TestConversationSearchFieldsAndRanking(t *testing.T) {
 	db := testutil.NewDB(t, "search_conversations")
 	lo := logf.New(logf.Opts{})
@@ -110,6 +123,14 @@ func TestConversationSearchFieldsAndRanking(t *testing.T) {
 		t.Fatalf("subject or name matched: total %d, results %d", total, len(results))
 	}
 
+	messages, messageTotal, err := manager.Messages(models.Query{Term: "ordinary", Page: 1, PageSize: 10}, scope)
+	if err != nil {
+		t.Fatalf("searching messages: %v", err)
+	}
+	if messageTotal != 1 || len(messages) != 1 || messages[0].TextContent != "ordinary message" {
+		t.Fatalf("message search returned total %d, results %+v", messageTotal, messages)
+	}
+
 	for _, term := range []string{"%%%", "___", "%_%"} {
 		results, total, err = manager.Conversations(models.Query{Term: term, Page: 1, PageSize: 10}, scope)
 		if err != nil {
@@ -119,7 +140,7 @@ func TestConversationSearchFieldsAndRanking(t *testing.T) {
 			t.Fatalf("conversation search for %q returned total %d, results %d", term, total, len(results))
 		}
 
-		messages, messageTotal, err := manager.Messages(models.Query{Term: term, Page: 1, PageSize: 10}, scope)
+		messages, messageTotal, err = manager.Messages(models.Query{Term: term, Page: 1, PageSize: 10}, scope)
 		if err != nil {
 			t.Fatalf("searching messages for %q: %v", term, err)
 		}

From 6a6e449c8dbb91426cf4c0e737cf93767e871bd6 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 01:25:41 +0530
Subject: [PATCH 085/178] limit conversation suggestions to reference matches

---
 .../src/components/editor/conversationReference.js | 14 ++++++++------
 .../editor/conversationReference.test.js           |  8 +++++++-
 2 files changed, 15 insertions(+), 7 deletions(-)

diff --git a/frontend/apps/main/src/components/editor/conversationReference.js b/frontend/apps/main/src/components/editor/conversationReference.js
index 8002090d..5f8cabdd 100644
--- a/frontend/apps/main/src/components/editor/conversationReference.js
+++ b/frontend/apps/main/src/components/editor/conversationReference.js
@@ -18,10 +18,12 @@ export const getConversationSuggestions = async (query, search = api.searchConve
   if (reference.length < MIN_REFERENCE_QUERY_LENGTH) return []
 
   const response = await search({ query: reference, page_size: SUGGESTION_LIMIT })
-  return (response.data?.data?.results || []).map((conversation) => ({
-    id: conversation.uuid,
-    label: conversation.reference_number,
-    subject: conversation.subject,
-    status: conversation.status
-  }))
+  return (response.data?.data?.results || [])
+    .filter((conversation) => conversation.reference_number === reference)
+    .map((conversation) => ({
+      id: conversation.uuid,
+      label: conversation.reference_number,
+      subject: conversation.subject,
+      status: conversation.status
+    }))
 }
diff --git a/frontend/apps/main/src/components/editor/conversationReference.test.js b/frontend/apps/main/src/components/editor/conversationReference.test.js
index 94ddebcc..3a43d76e 100644
--- a/frontend/apps/main/src/components/editor/conversationReference.test.js
+++ b/frontend/apps/main/src/components/editor/conversationReference.test.js
@@ -10,11 +10,17 @@ describe('conversation reference suggestions', () => {
     expect(search).not.toHaveBeenCalled()
   })
 
-  it('maps a conversation result to a suggestion', async () => {
+  it('only maps an exact reference number match to a suggestion', async () => {
     const search = vi.fn().mockResolvedValue({
       data: {
         data: {
           results: [
+            {
+              uuid: 'email-match-conversation-uuid',
+              reference_number: '109',
+              subject: 'Reference appears in contact email',
+              status: 'Open'
+            },
             {
               uuid: 'conversation-uuid',
               reference_number: '108',

From ab44d64068f020c22f43cc3bbff69ed142a590fa Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 02:21:05 +0530
Subject: [PATCH 086/178] add cursor pagination and search sorting

---
 cmd/search.go                                 |  40 +--
 .../src/features/search/SearchPagination.vue  |  81 ++++++
 .../src/features/search/SearchResults.vue     |  65 ++++-
 .../apps/main/src/views/search/SearchView.vue |  65 ++++-
 i18n/en-US.json                               |   2 +-
 internal/search/models/models.go              |  18 +-
 internal/search/queries.sql                   |   5 +-
 internal/search/search.go                     | 269 +++++++++++++++---
 internal/search/search_test.go                | 171 +++++++++--
 9 files changed, 597 insertions(+), 119 deletions(-)
 create mode 100644 frontend/apps/main/src/features/search/SearchPagination.vue

diff --git a/cmd/search.go b/cmd/search.go
index 62a3b04a..6793dd99 100644
--- a/cmd/search.go
+++ b/cmd/search.go
@@ -21,6 +21,13 @@ const (
 	maxContactSearchLimit      = 15
 )
 
+type searchPageResults struct {
+	Results    any    `json:"results"`
+	PerPage    int    `json:"per_page"`
+	HasMore    bool   `json:"has_more"`
+	NextCursor string `json:"next_cursor"`
+}
+
 func handleSearchConversations(r *fastglue.Request) error {
 	app, user, term, err := searchTerm(r)
 	if err != nil {
@@ -74,11 +81,16 @@ func handlePaginatedSearchConversations(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	results, total, err := app.search.Conversations(q, scope)
+	results, hasMore, nextCursor, err := app.search.Conversations(q, scope)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(pageResults(results, total, q))
+	return r.SendEnvelope(searchPageResults{
+		Results:    results,
+		PerPage:    q.PageSize,
+		HasMore:    hasMore,
+		NextCursor: nextCursor,
+	})
 }
 
 func handlePaginatedSearchMessages(r *fastglue.Request) error {
@@ -90,11 +102,16 @@ func handlePaginatedSearchMessages(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	results, total, err := app.search.Messages(q, scope)
+	results, hasMore, nextCursor, err := app.search.Messages(q, scope)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(pageResults(results, total, q))
+	return r.SendEnvelope(searchPageResults{
+		Results:    results,
+		PerPage:    q.PageSize,
+		HasMore:    hasMore,
+		NextCursor: nextCursor,
+	})
 }
 
 func searchInputs(r *fastglue.Request) (*App, amodels.User, smodels.Query, error) {
@@ -102,11 +119,12 @@ func searchInputs(r *fastglue.Request) (*App, amodels.User, smodels.Query, error
 	if err != nil {
 		return app, user, smodels.Query{}, err
 	}
-	page, pageSize := getPagination(r)
+	_, pageSize := getPagination(r)
 	query := searchmanager.NormalizeQuery(smodels.Query{
 		Term:     term,
 		Filters:  string(r.RequestCtx.QueryArgs().Peek("filters")),
-		Page:     page,
+		Cursor:   string(r.RequestCtx.QueryArgs().Peek("cursor")),
+		Sort:     smodels.Sort(r.RequestCtx.QueryArgs().Peek("sort")),
 		PageSize: pageSize,
 	})
 	return app, user, query, nil
@@ -130,16 +148,6 @@ func searchLimit(r *fastglue.Request, max int) int {
 	return limit
 }
 
-func pageResults(results any, total int, q smodels.Query) envelope.PageResults {
-	return envelope.PageResults{
-		Results:    results,
-		Total:      total,
-		PerPage:    q.PageSize,
-		TotalPages: (total + q.PageSize - 1) / q.PageSize,
-		Page:       q.Page,
-	}
-}
-
 func readScope(app *App, agentID int) (smodels.ReadScope, error) {
 	agent, err := app.user.GetAgentCachedOrLoad(agentID)
 	if err != nil {
diff --git a/frontend/apps/main/src/features/search/SearchPagination.vue b/frontend/apps/main/src/features/search/SearchPagination.vue
new file mode 100644
index 00000000..65813461
--- /dev/null
+++ b/frontend/apps/main/src/features/search/SearchPagination.vue
@@ -0,0 +1,81 @@
+<template>
+  <div class="sticky bottom-0 mt-auto bg-background pb-4 pt-3">
+    <div
+      class="flex items-center justify-between gap-4 rounded-md border border-border px-4 py-3 shadow-sm"
+    >
+      <Select :model-value="perPage" @update:model-value="handlePerPageChange">
+        <SelectTrigger
+          class="h-10 w-[70px] sm:h-8"
+          :aria-label="t('globals.messages.resultsPerPage')"
+        >
+          <SelectValue :placeholder="String(perPage)" />
+        </SelectTrigger>
+        <SelectContent>
+          <SelectItem v-for="option in perPageOptions" :key="option" :value="option">
+            {{ option }}
+          </SelectItem>
+        </SelectContent>
+      </Select>
+
+      <div class="flex items-center gap-1">
+        <Button
+          type="button"
+          variant="ghost"
+          size="sm"
+          :class="STEP_BUTTON_CLASS"
+          :aria-label="t('globals.messages.previousPage')"
+          :disabled="page <= 1"
+          @click="goToPage(page - 1)"
+        >
+          <ChevronLeft class="h-4 w-4" aria-hidden="true" />
+        </Button>
+        <Button
+          type="button"
+          variant="ghost"
+          size="sm"
+          :class="STEP_BUTTON_CLASS"
+          :aria-label="t('globals.messages.nextPage')"
+          :disabled="!hasMore"
+          @click="goToPage(page + 1)"
+        >
+          <ChevronRight class="h-4 w-4" aria-hidden="true" />
+        </Button>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+const STEP_BUTTON_CLASS = 'h-10 w-10 p-0 sm:h-8 sm:w-8'
+
+import { ChevronLeft, ChevronRight } from 'lucide-vue-next'
+import { useI18n } from 'vue-i18n'
+import { Button } from '@shared-ui/components/ui/button'
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from '@shared-ui/components/ui/select'
+
+const props = defineProps({
+  page: { type: Number, required: true },
+  perPage: { type: Number, required: true },
+  hasMore: { type: Boolean, required: true },
+  perPageOptions: { type: Array, default: () => [15, 30, 50, 100] }
+})
+
+const emit = defineEmits(['change'])
+
+const { t } = useI18n()
+
+function goToPage(page) {
+  if (page < 1 || (page > props.page && !props.hasMore)) return
+  emit('change', { page, perPage: props.perPage })
+}
+
+function handlePerPageChange(perPage) {
+  emit('change', { page: 1, perPage })
+}
+</script>
diff --git a/frontend/apps/main/src/features/search/SearchResults.vue b/frontend/apps/main/src/features/search/SearchResults.vue
index 02e899bc..58e202fd 100644
--- a/frontend/apps/main/src/features/search/SearchResults.vue
+++ b/frontend/apps/main/src/features/search/SearchResults.vue
@@ -1,13 +1,13 @@
 <template>
   <div>
     <Tabs :model-value="activeTab" @update:model-value="emit('update:activeTab', $event)">
-      <div class="mb-3 flex items-center gap-2">
+      <div class="mb-3 flex flex-wrap items-center gap-2">
         <TabsList>
           <TabsTrigger v-for="type in TYPES" :key="type" :value="type" class="gap-1.5">
             {{ t(tabLabelKeys[type], 2) }}
-            <span class="text-xs tabular-nums text-muted-foreground">{{
-              results[type].total
-            }}</span>
+            <span class="text-xs tabular-nums text-muted-foreground">
+              {{ knownResultCount(results[type]) }}
+            </span>
           </TabsTrigger>
         </TabsList>
         <Button
@@ -21,6 +21,28 @@
           <X class="h-4 w-4" aria-hidden="true" />
           {{ t('globals.messages.clearFilters') }}
         </Button>
+        <div class="ml-auto flex items-center gap-2">
+          <label for="search-sort" class="text-sm text-muted-foreground">
+            {{ t('globals.messages.sortBy') }}
+          </label>
+          <Select
+            :model-value="sorts[activeTab]"
+            @update:model-value="emit('changeSort', { type: activeTab, sort: $event })"
+          >
+            <SelectTrigger id="search-sort" class="h-9 w-40">
+              <SelectValue />
+            </SelectTrigger>
+            <SelectContent align="end">
+              <SelectItem
+                v-for="option in SORT_OPTIONS[activeTab]"
+                :key="option.value"
+                :value="option.value"
+              >
+                {{ t(option.label) }}
+              </SelectItem>
+            </SelectContent>
+          </Select>
+        </div>
       </div>
 
       <TabsContent v-for="type in TYPES" :key="type" :value="type" class="mt-0">
@@ -44,11 +66,11 @@
             />
           </div>
         </div>
-        <PaginationBar
-          v-if="results[type].total_pages > 1"
+        <SearchPagination
+          v-if="results[type].page > 1 || results[type].has_more"
           :page="results[type].page"
           :per-page="results[type].per_page"
-          :total-pages="results[type].total_pages"
+          :has-more="results[type].has_more"
           @change="emit('changePage', { type, ...$event })"
         />
       </TabsContent>
@@ -60,11 +82,30 @@
 import { X } from 'lucide-vue-next'
 import { useI18n } from 'vue-i18n'
 import { Button } from '@shared-ui/components/ui/button'
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from '@shared-ui/components/ui/select'
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@shared-ui/components/ui/tabs'
-import PaginationBar from '@main/components/pagination/PaginationBar.vue'
+import SearchPagination from './SearchPagination.vue'
 import SearchResultItem from './SearchResultItem.vue'
 
 const TYPES = ['conversations', 'messages']
+const SORT_OPTIONS = {
+  conversations: [
+    { value: 'newest', label: 'conversation.sort.newestActivity' },
+    { value: 'oldest', label: 'conversation.sort.oldestActivity' },
+    { value: 'started_first', label: 'conversation.sort.startedFirst' },
+    { value: 'started_last', label: 'conversation.sort.startedLast' }
+  ],
+  messages: [
+    { value: 'newest', label: 'conversation.sort.newestActivity' },
+    { value: 'oldest', label: 'conversation.sort.oldestActivity' }
+  ]
+}
 const tabLabelKeys = {
   conversations: 'globals.terms.conversation',
   messages: 'globals.terms.message'
@@ -74,9 +115,15 @@ defineProps({
   results: { type: Object, required: true },
   term: { type: String, default: '' },
   activeTab: { type: String, required: true },
+  sorts: { type: Object, required: true },
   showClearFilters: { type: Boolean, default: false }
 })
-const emit = defineEmits(['update:activeTab', 'changePage', 'clearFilters'])
+const emit = defineEmits(['update:activeTab', 'changeSort', 'changePage', 'clearFilters'])
 
 const { t } = useI18n()
+
+const knownResultCount = (page) => {
+  const count = (page.page - 1) * page.per_page + page.results.length
+  return page.has_more ? `${count}+` : count
+}
 </script>
diff --git a/frontend/apps/main/src/views/search/SearchView.vue b/frontend/apps/main/src/views/search/SearchView.vue
index 673f5b76..3903fdf8 100644
--- a/frontend/apps/main/src/views/search/SearchView.vue
+++ b/frontend/apps/main/src/views/search/SearchView.vue
@@ -36,7 +36,7 @@
 
         <SearchFilters :filters="filters" @update:filters="filters = $event" />
 
-        <div v-if="loading && totalResults === 0" class="flex justify-center items-center h-64">
+        <div v-if="loading && resultCount === 0" class="flex justify-center items-center h-64">
           <Spinner :absolute="false" />
         </div>
         <div v-else-if="error" class="py-16 text-center space-y-4">
@@ -48,10 +48,12 @@
           :results="results"
           :term="term"
           :active-tab="activeTab"
+          :sorts="sorts"
           :show-clear-filters="hasActiveFilters(filters)"
           :aria-busy="loading"
           :class="{ 'pointer-events-none opacity-60': loading }"
           @update:active-tab="selectTab"
+          @change-sort="changeSort"
           @change-page="changePage"
           @clear-filters="filters = emptyFilters()"
         />
@@ -100,17 +102,22 @@ const router = useRouter()
 
 const emptyPage = () => ({
   results: [],
-  total: 0,
   page: 1,
   per_page: DEFAULT_PER_PAGE,
-  total_pages: 0
+  has_more: false,
+  next_cursor: ''
 })
 const emptyResults = () => ({ conversations: emptyPage(), messages: emptyPage() })
+const emptyCursorHistory = () => ({
+  conversations: new Map([[1, '']]),
+  messages: new Map([[1, '']])
+})
 
 const inputRef = ref(null)
 const term = ref(String(route.query.q || ''))
 const filters = ref(filtersFromQuery(route.query))
 const activeTab = ref(TABS.includes(route.query.tab) ? route.query.tab : 'conversations')
+const sorts = ref({ conversations: 'newest', messages: 'newest' })
 const tabSelectedByUser = ref(TABS.includes(route.query.tab))
 const results = ref(emptyResults())
 const loading = ref(false)
@@ -118,13 +125,15 @@ const error = ref(null)
 const searchPerformed = ref(false)
 let debounceTimer = null
 let searchRequestId = 0
+let cursorsByPage = emptyCursorHistory()
 
-const totalResults = computed(
-  () => results.value.conversations.total + results.value.messages.total
+const resultCount = computed(
+  () => results.value.conversations.results.length + results.value.messages.results.length
 )
 
-const searchParams = (page, perPage) => {
-  const params = { query: term.value, page, page_size: perPage }
+const searchParams = (type, perPage, cursor = '') => {
+  const params = { query: term.value, page_size: perPage, sort: sorts.value[type] }
+  if (cursor) params.cursor = cursor
   const filtersJSON = toFiltersJSON(filters.value)
   if (filtersJSON) params.filters = filtersJSON
   return params
@@ -138,6 +147,7 @@ const fetchers = {
 const reset = () => {
   searchRequestId++
   results.value = emptyResults()
+  cursorsByPage = emptyCursorHistory()
   searchPerformed.value = false
   loading.value = false
   error.value = null
@@ -155,13 +165,21 @@ const search = async () => {
   const requestId = ++searchRequestId
   try {
     const perPage = Object.fromEntries(TABS.map((type) => [type, results.value[type].per_page]))
-    const pages = await Promise.all(
-      TABS.map((type) => fetchers[type](searchParams(1, perPage[type])))
+    const responses = await Promise.all(
+      TABS.map((type) => fetchers[type](searchParams(type, perPage[type])))
     )
     if (requestId !== searchRequestId) return
-    results.value = Object.fromEntries(TABS.map((type, i) => [type, pages[i].data.data]))
-    if (!tabSelectedByUser.value && results.value[activeTab.value].total === 0) {
-      const populatedTab = TABS.find((type) => results.value[type].total > 0)
+    cursorsByPage = emptyCursorHistory()
+    results.value = Object.fromEntries(
+      TABS.map((type, i) => [type, { ...responses[i].data.data, page: 1 }])
+    )
+    for (const type of TABS) {
+      if (results.value[type].has_more) {
+        cursorsByPage[type].set(2, results.value[type].next_cursor)
+      }
+    }
+    if (!tabSelectedByUser.value && results.value[activeTab.value].results.length === 0) {
+      const populatedTab = TABS.find((type) => results.value[type].results.length > 0)
       if (populatedTab) activeTab.value = populatedTab
     }
   } catch (err) {
@@ -173,13 +191,25 @@ const search = async () => {
 }
 
 const fetchPage = async (type, page, perPage) => {
+  if (perPage !== results.value[type].per_page) {
+    cursorsByPage[type] = new Map([[1, '']])
+  }
+  const cursor = cursorsByPage[type].get(page)
+  if (cursor === undefined) return
+
   loading.value = true
   error.value = null
   const requestId = ++searchRequestId
   try {
-    const response = await fetchers[type](searchParams(page, perPage))
+    const response = await fetchers[type](searchParams(type, perPage, cursor))
     if (requestId !== searchRequestId) return
-    results.value[type] = response.data.data
+    results.value[type] = { ...response.data.data, page }
+    if (response.data.data.has_more) {
+      cursorsByPage[type].set(page + 1, response.data.data.next_cursor)
+    }
+    for (const knownPage of cursorsByPage[type].keys()) {
+      if (knownPage > page + 1) cursorsByPage[type].delete(knownPage)
+    }
   } catch (err) {
     if (requestId !== searchRequestId) return
     error.value = handleHTTPError(err).message
@@ -190,6 +220,13 @@ const fetchPage = async (type, page, perPage) => {
 
 const changePage = ({ type, page, perPage }) => fetchPage(type, page, perPage)
 
+const changeSort = ({ type, sort }) => {
+  if (sorts.value[type] === sort) return
+  sorts.value = { ...sorts.value, [type]: sort }
+  cursorsByPage[type] = new Map([[1, '']])
+  fetchPage(type, 1, results.value[type].per_page)
+}
+
 const selectTab = (tab) => {
   tabSelectedByUser.value = true
   activeTab.value = tab
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 93919bf7..da9443a6 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -1494,7 +1494,7 @@
   "role.select": "Select roles",
   "search.adjustSearchTerms": "Try adjusting your search terms or filters.",
   "search.minQueryLength": "Please enter at least {length} characters to search.",
-  "search.searchBy": "Search by reference number, contact email or message text",
+  "search.searchBy": "Search by reference number, contact email address or messages in conversations.",
   "setup.completeYourSetup": "Complete your setup",
   "setup.createFirstInbox": "Create your first inbox",
   "setup.inviteTeammates": "Invite teammates",
diff --git a/internal/search/models/models.go b/internal/search/models/models.go
index b5832b45..ff18573a 100644
--- a/internal/search/models/models.go
+++ b/internal/search/models/models.go
@@ -7,6 +7,15 @@ import (
 	"github.com/volatiletech/null/v9"
 )
 
+const (
+	SortNewest       Sort = "newest"
+	SortOldest       Sort = "oldest"
+	SortStartedFirst Sort = "started_first"
+	SortStartedLast  Sort = "started_last"
+)
+
+type Sort string
+
 // ReadScope carries an agent's conversation read permissions for filtering search results.
 type ReadScope struct {
 	UserID         int
@@ -19,11 +28,11 @@ type ReadScope struct {
 	ReadUnassigned bool
 }
 
-// Query is a search term plus the list filters and page the caller wants applied.
 type Query struct {
 	Term     string
 	Filters  string
-	Page     int
+	Cursor   string
+	Sort     Sort
 	PageSize int
 }
 
@@ -46,7 +55,8 @@ type Sender struct {
 }
 
 type ConversationResult struct {
-	Total           int            `db:"total" json:"-"`
+	ID              int            `db:"id" json:"-"`
+	ReferenceMatch  bool           `db:"reference_match" json:"-"`
 	CreatedAt       time.Time      `db:"created_at" json:"created_at"`
 	UUID            string         `db:"uuid" json:"uuid"`
 	ReferenceNumber string         `db:"reference_number" json:"reference_number"`
@@ -66,7 +76,7 @@ type ConversationResult struct {
 }
 
 type MessageResult struct {
-	Total                       int         `db:"total" json:"-"`
+	ID                          int         `db:"id" json:"-"`
 	UUID                        string      `db:"uuid" json:"uuid"`
 	CreatedAt                   time.Time   `db:"created_at" json:"created_at"`
 	Type                        string      `db:"type" json:"type"`
diff --git a/internal/search/queries.sql b/internal/search/queries.sql
index e9656d42..e055d833 100644
--- a/internal/search/queries.sql
+++ b/internal/search/queries.sql
@@ -12,7 +12,8 @@ WITH matched_conversations AS (
     WHERE users.email ILIKE $10 ESCAPE '\'
 )
 SELECT
-    COUNT(*) OVER() AS total,
+    conversations.id,
+    conversations.reference_number = $1 AS reference_match,
     conversations.created_at,
     conversations.uuid,
     conversations.reference_number,
@@ -56,7 +57,7 @@ WHERE conversations.id IN (SELECT id FROM matched_conversations)
 
 -- name: search-messages
 SELECT
-    COUNT(*) OVER() AS total,
+    conversation_messages.id,
     conversation_messages.uuid,
     conversation_messages.created_at,
     conversation_messages.type,
diff --git a/internal/search/search.go b/internal/search/search.go
index d219c67a..13e3f2d5 100644
--- a/internal/search/search.go
+++ b/internal/search/search.go
@@ -3,7 +3,10 @@ package search
 
 import (
 	"embed"
+	"encoding/base64"
+	"encoding/json"
 	"fmt"
+	"time"
 
 	"github.com/abhinavxd/libredesk/internal/dbutil"
 	"github.com/abhinavxd/libredesk/internal/envelope"
@@ -11,6 +14,7 @@ import (
 	"github.com/jmoiron/sqlx"
 	"github.com/knadh/go-i18n"
 	"github.com/lib/pq"
+	"github.com/volatiletech/null/v9"
 	"github.com/zerodha/logf"
 )
 
@@ -18,9 +22,6 @@ const (
 	maxPageSize                  = 100
 	maxConversationFirstPageSize = 1000
 	maxMessageFirstPageSize      = 30
-
-	conversationResultOrder = "(conversations.reference_number = $1) DESC, conversations.last_message_at DESC NULLS LAST"
-	messageResultOrder      = "conversation_messages.created_at DESC NULLS LAST"
 )
 
 var (
@@ -30,6 +31,21 @@ var (
 	messageAllowedFields = []string{"created_at"}
 )
 
+type cursorCondition func(string, models.Sort, int) (string, []any, error)
+
+type conversationCursor struct {
+	ReferenceMatch bool        `json:"reference_match"`
+	Sort           models.Sort `json:"sort"`
+	SortAt         *time.Time  `json:"sort_at"`
+	ID             int         `json:"id"`
+}
+
+type messageCursor struct {
+	Sort      models.Sort `json:"sort"`
+	CreatedAt time.Time   `json:"created_at"`
+	ID        int         `json:"id"`
+}
+
 // Manager is the search manager
 type Manager struct {
 	q               queries
@@ -75,23 +91,21 @@ func New(opts Opts) (*Manager, error) {
 	}, nil
 }
 
-// Conversations searches conversations the agent is allowed to read, returning the page and the total match count.
-func (s *Manager) Conversations(query models.Query, scope models.ReadScope) ([]models.ConversationResult, int, error) {
+func (s *Manager) Conversations(query models.Query, scope models.ReadScope) ([]models.ConversationResult, bool, string, error) {
 	return s.searchConversations(query, scope, maxPageSize)
 }
 
 func (s *Manager) ConversationFirstPage(term string, scope models.ReadScope, limit int) ([]models.ConversationResult, error) {
-	results, _, err := s.searchConversations(models.Query{Term: term, Page: 1, PageSize: limit}, scope, maxConversationFirstPageSize)
+	results, _, _, err := s.searchConversations(models.Query{Term: term, PageSize: limit}, scope, maxConversationFirstPageSize)
 	return results, err
 }
 
-// Messages searches messages in conversations the agent is allowed to read, returning the page and the total match count.
-func (s *Manager) Messages(query models.Query, scope models.ReadScope) ([]models.MessageResult, int, error) {
+func (s *Manager) Messages(query models.Query, scope models.ReadScope) ([]models.MessageResult, bool, string, error) {
 	return s.searchMessages(query, scope, maxPageSize)
 }
 
 func (s *Manager) MessageFirstPage(term string, scope models.ReadScope, limit int) ([]models.MessageResult, error) {
-	results, _, err := s.searchMessages(models.Query{Term: term, Page: 1, PageSize: limit}, scope, maxMessageFirstPageSize)
+	results, _, _, err := s.searchMessages(models.Query{Term: term, PageSize: limit}, scope, maxMessageFirstPageSize)
 	return results, err
 }
 
@@ -109,59 +123,74 @@ func NormalizeQuery(query models.Query) models.Query {
 	return normalizeQuery(query, maxPageSize)
 }
 
-func (s *Manager) searchConversations(query models.Query, scope models.ReadScope, pageSizeLimit int) ([]models.ConversationResult, int, error) {
-	sql, args, err := s.buildQuery(s.q.SearchConversations, query, scope, conversationResultOrder, s.filterFields, pageSizeLimit)
+func (s *Manager) searchConversations(query models.Query, scope models.ReadScope, pageSizeLimit int) ([]models.ConversationResult, bool, string, error) {
+	query = normalizeQuery(query, pageSizeLimit)
+	orderBy, err := conversationResultOrder(query.Sort)
 	if err != nil {
-		return nil, 0, err
+		return nil, false, "", envelope.NewError(envelope.InputError, s.i18n.T("globals.messages.invalidFilters"), nil)
+	}
+	sql, args, err := s.buildQuery(s.q.SearchConversations, query, scope, orderBy, s.filterFields, conversationCursorCondition)
+	if err != nil {
+		return nil, false, "", err
 	}
 	var results = make([]models.ConversationResult, 0)
 	if err := s.db.Select(&results, sql, args...); err != nil {
 		s.lo.Error("error searching conversations", "error", err)
-		return nil, 0, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
+		return nil, false, "", envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
-	total := 0
-	if len(results) > 0 {
-		total = results[0].Total
+	results, hasMore := trimResults(results, query.PageSize)
+	if !hasMore {
+		return results, false, "", nil
 	}
-	return results, total, nil
+	nextCursor, err := encodeCursor(conversationCursor{
+		ReferenceMatch: results[len(results)-1].ReferenceMatch,
+		Sort:           query.Sort,
+		SortAt:         conversationSortAt(results[len(results)-1], query.Sort),
+		ID:             results[len(results)-1].ID,
+	})
+	if err != nil {
+		s.lo.Error("error encoding conversation search cursor", "error", err)
+		return nil, false, "", envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return results, true, nextCursor, nil
 }
 
-func (s *Manager) searchMessages(query models.Query, scope models.ReadScope, pageSizeLimit int) ([]models.MessageResult, int, error) {
+func (s *Manager) searchMessages(query models.Query, scope models.ReadScope, pageSizeLimit int) ([]models.MessageResult, bool, string, error) {
+	query = normalizeQuery(query, pageSizeLimit)
+	orderBy, err := messageResultOrder(query.Sort)
+	if err != nil {
+		return nil, false, "", envelope.NewError(envelope.InputError, s.i18n.T("globals.messages.invalidFilters"), nil)
+	}
 	fields := dbutil.AllowedFields{"conversation_messages": messageAllowedFields}
 	for model, f := range s.filterFields {
 		fields[model] = f
 	}
-	sql, args, err := s.buildQuery(s.q.SearchMessages, query, scope, messageResultOrder, fields, pageSizeLimit)
+	sql, args, err := s.buildQuery(s.q.SearchMessages, query, scope, orderBy, fields, messageCursorCondition)
 	if err != nil {
-		return nil, 0, err
+		return nil, false, "", err
 	}
 	var results = make([]models.MessageResult, 0)
 	if err := s.db.Select(&results, sql, args...); err != nil {
 		s.lo.Error("error searching messages", "error", err)
-		return nil, 0, envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
+		return nil, false, "", envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
-	total := 0
-	if len(results) > 0 {
-		total = results[0].Total
+	results, hasMore := trimResults(results, query.PageSize)
+	if !hasMore {
+		return results, false, "", nil
 	}
-	return results, total, nil
+	nextCursor, err := encodeCursor(messageCursor{
+		Sort:      query.Sort,
+		CreatedAt: results[len(results)-1].CreatedAt,
+		ID:        results[len(results)-1].ID,
+	})
+	if err != nil {
+		s.lo.Error("error encoding message search cursor", "error", err)
+		return nil, false, "", envelope.NewError(envelope.GeneralError, s.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return results, true, nextCursor, nil
 }
 
-func normalizeQuery(query models.Query, pageSizeLimit int) models.Query {
-	if query.Page < 1 {
-		query.Page = 1
-	}
-	if query.PageSize < 1 || query.PageSize > pageSizeLimit {
-		query.PageSize = pageSizeLimit
-	}
-	if query.Filters == "" {
-		query.Filters = "[]"
-	}
-	return query
-}
-
-func (s *Manager) buildQuery(base string, query models.Query, scope models.ReadScope, orderBy string, fields dbutil.AllowedFields, pageSizeLimit int) (string, []any, error) {
-	query = normalizeQuery(query, pageSizeLimit)
+func (s *Manager) buildQuery(base string, query models.Query, scope models.ReadScope, orderBy string, fields dbutil.AllowedFields, cursorWhere cursorCondition) (string, []any, error) {
 	baseArgs := append([]any{query.Term}, scopeArgs(scope)...)
 	baseArgs = append(baseArgs, dbutil.ContainsPattern(query.Term))
 	sql, args, err := dbutil.BuildFilterQuery(base, baseArgs, query.Filters, fields, s.filterRenderers, s.filterLocation())
@@ -169,12 +198,168 @@ func (s *Manager) buildQuery(base string, query models.Query, scope models.ReadS
 		s.lo.Error("error building search query", "error", err)
 		return "", nil, envelope.NewError(envelope.InputError, s.i18n.T("globals.messages.invalidFilters"), nil)
 	}
+	if query.Cursor != "" {
+		condition, cursorArgs, err := cursorWhere(query.Cursor, query.Sort, len(args)+1)
+		if err != nil {
+			s.lo.Error("error decoding search cursor", "error", err)
+			return "", nil, envelope.NewError(envelope.InputError, s.i18n.T("globals.messages.invalidFilters"), nil)
+		}
+		sql += " AND " + condition
+		args = append(args, cursorArgs...)
+	}
 	sql += " ORDER BY " + orderBy
-	sql += fmt.Sprintf(" LIMIT $%d OFFSET $%d", len(args)+1, len(args)+2)
-	args = append(args, query.PageSize, dbutil.PageOffset(query.Page, query.PageSize))
+	sql += fmt.Sprintf(" LIMIT $%d", len(args)+1)
+	args = append(args, query.PageSize+1)
 	return sql, args, nil
 }
 
+func normalizeQuery(query models.Query, pageSizeLimit int) models.Query {
+	if query.PageSize < 1 || query.PageSize > pageSizeLimit {
+		query.PageSize = pageSizeLimit
+	}
+	if query.Filters == "" {
+		query.Filters = "[]"
+	}
+	if query.Sort == "" {
+		query.Sort = models.SortNewest
+	}
+	return query
+}
+
+func conversationResultOrder(sort models.Sort) (string, error) {
+	switch sort {
+	case models.SortNewest:
+		return "(conversations.reference_number = $1) DESC, conversations.last_message_at DESC NULLS LAST, conversations.id DESC", nil
+	case models.SortOldest:
+		return "(conversations.reference_number = $1) DESC, conversations.last_message_at ASC NULLS LAST, conversations.id ASC", nil
+	case models.SortStartedFirst:
+		return "(conversations.reference_number = $1) DESC, conversations.created_at ASC, conversations.id ASC", nil
+	case models.SortStartedLast:
+		return "(conversations.reference_number = $1) DESC, conversations.created_at DESC, conversations.id DESC", nil
+	default:
+		return "", fmt.Errorf("invalid conversation sort: %q", sort)
+	}
+}
+
+func messageResultOrder(sort models.Sort) (string, error) {
+	switch sort {
+	case models.SortNewest:
+		return "conversation_messages.created_at DESC, conversation_messages.id DESC", nil
+	case models.SortOldest:
+		return "conversation_messages.created_at ASC, conversation_messages.id ASC", nil
+	default:
+		return "", fmt.Errorf("invalid message sort: %q", sort)
+	}
+}
+
+func conversationCursorCondition(raw string, sort models.Sort, firstPlaceholder int) (string, []any, error) {
+	var cursor conversationCursor
+	if err := decodeCursor(raw, &cursor); err != nil || cursor.ID < 1 || cursor.Sort != sort {
+		return "", nil, fmt.Errorf("invalid conversation cursor")
+	}
+
+	switch sort {
+	case models.SortNewest:
+		condition := fmt.Sprintf(
+			"((conversations.reference_number = $1), (conversations.last_message_at IS NOT NULL), COALESCE(conversations.last_message_at, '-infinity'::timestamptz), conversations.id) < ($%d::boolean, $%d::boolean, COALESCE($%d::timestamptz, '-infinity'::timestamptz), $%d)",
+			firstPlaceholder,
+			firstPlaceholder+1,
+			firstPlaceholder+2,
+			firstPlaceholder+3,
+		)
+		return condition, []any{cursor.ReferenceMatch, cursor.SortAt != nil, cursor.SortAt, cursor.ID}, nil
+	case models.SortOldest:
+		condition := fmt.Sprintf(
+			"((conversations.reference_number != $1), (conversations.last_message_at IS NULL), COALESCE(conversations.last_message_at, 'infinity'::timestamptz), conversations.id) > ($%d::boolean, $%d::boolean, COALESCE($%d::timestamptz, 'infinity'::timestamptz), $%d)",
+			firstPlaceholder,
+			firstPlaceholder+1,
+			firstPlaceholder+2,
+			firstPlaceholder+3,
+		)
+		return condition, []any{!cursor.ReferenceMatch, cursor.SortAt == nil, cursor.SortAt, cursor.ID}, nil
+	case models.SortStartedFirst, models.SortStartedLast:
+		if cursor.SortAt == nil {
+			return "", nil, fmt.Errorf("invalid conversation cursor")
+		}
+		operator := ">"
+		referenceExpression := "(conversations.reference_number != $1)"
+		referenceValue := !cursor.ReferenceMatch
+		if sort == models.SortStartedLast {
+			operator = "<"
+			referenceExpression = "(conversations.reference_number = $1)"
+			referenceValue = cursor.ReferenceMatch
+		}
+		condition := fmt.Sprintf(
+			"(%s, conversations.created_at, conversations.id) %s ($%d::boolean, $%d::timestamptz, $%d)",
+			referenceExpression,
+			operator,
+			firstPlaceholder,
+			firstPlaceholder+1,
+			firstPlaceholder+2,
+		)
+		return condition, []any{referenceValue, cursor.SortAt, cursor.ID}, nil
+	default:
+		return "", nil, fmt.Errorf("invalid conversation cursor")
+	}
+}
+
+func messageCursorCondition(raw string, sort models.Sort, firstPlaceholder int) (string, []any, error) {
+	var cursor messageCursor
+	if err := decodeCursor(raw, &cursor); err != nil || cursor.ID < 1 || cursor.CreatedAt.IsZero() || cursor.Sort != sort {
+		return "", nil, fmt.Errorf("invalid message cursor")
+	}
+	operator := "<"
+	if sort == models.SortOldest {
+		operator = ">"
+	} else if sort != models.SortNewest {
+		return "", nil, fmt.Errorf("invalid message cursor")
+	}
+	condition := fmt.Sprintf(
+		"(conversation_messages.created_at, conversation_messages.id) %s ($%d::timestamptz, $%d)",
+		operator,
+		firstPlaceholder,
+		firstPlaceholder+1,
+	)
+	return condition, []any{cursor.CreatedAt, cursor.ID}, nil
+}
+
+func encodeCursor(cursor any) (string, error) {
+	data, err := json.Marshal(cursor)
+	if err != nil {
+		return "", err
+	}
+	return base64.RawURLEncoding.EncodeToString(data), nil
+}
+
+func decodeCursor(raw string, cursor any) error {
+	data, err := base64.RawURLEncoding.DecodeString(raw)
+	if err != nil {
+		return err
+	}
+	return json.Unmarshal(data, cursor)
+}
+
+func nullTimePointer(value null.Time) *time.Time {
+	if !value.Valid {
+		return nil
+	}
+	return &value.Time
+}
+
+func conversationSortAt(result models.ConversationResult, sort models.Sort) *time.Time {
+	if sort == models.SortStartedFirst || sort == models.SortStartedLast {
+		return &result.CreatedAt
+	}
+	return nullTimePointer(result.LastMessageAt)
+}
+
+func trimResults[T any](results []T, pageSize int) ([]T, bool) {
+	if len(results) <= pageSize {
+		return results, false
+	}
+	return results[:pageSize], true
+}
+
 func scopeArgs(scope models.ReadScope) []any {
 	return []any{
 		scope.UserID,
diff --git a/internal/search/search_test.go b/internal/search/search_test.go
index 81ec40a6..2f988afb 100644
--- a/internal/search/search_test.go
+++ b/internal/search/search_test.go
@@ -13,28 +13,35 @@ import (
 )
 
 func TestNormalizeQuery(t *testing.T) {
-	query := NormalizeQuery(models.Query{Page: 0, PageSize: 500})
+	query := NormalizeQuery(models.Query{Cursor: "cursor", PageSize: 500})
 
-	if query.Page != 1 {
-		t.Fatalf("page = %d, want 1", query.Page)
-	}
 	if query.PageSize != maxPageSize {
 		t.Fatalf("page size = %d, want %d", query.PageSize, maxPageSize)
 	}
+	if query.Cursor != "cursor" {
+		t.Fatalf("cursor = %q, want cursor", query.Cursor)
+	}
 	if query.Filters != "[]" {
 		t.Fatalf("filters = %q, want []", query.Filters)
 	}
+	if query.Sort != models.SortNewest {
+		t.Fatalf("sort = %q, want %q", query.Sort, models.SortNewest)
+	}
 }
 
 func TestBuildConversationQueryPrioritizesExactReference(t *testing.T) {
 	manager := &Manager{filterLocation: func() string { return "UTC" }}
+	orderBy, err := conversationResultOrder(models.SortNewest)
+	if err != nil {
+		t.Fatalf("building result order: %v", err)
+	}
 	query, args, err := manager.buildQuery(
 		"SELECT 1 FROM conversations WHERE $3",
-		models.Query{Term: "108", Page: 2, PageSize: 500},
+		normalizeQuery(models.Query{Term: "108", PageSize: 500}, maxPageSize),
 		models.ReadScope{},
-		conversationResultOrder,
+		orderBy,
 		nil,
-		maxPageSize,
+		conversationCursorCondition,
 	)
 	if err != nil {
 		t.Fatalf("building query: %v", err)
@@ -42,11 +49,11 @@ func TestBuildConversationQueryPrioritizesExactReference(t *testing.T) {
 	if !strings.Contains(query, "ORDER BY (conversations.reference_number = $1) DESC, conversations.last_message_at DESC NULLS LAST") {
 		t.Fatalf("query does not prioritize exact references: %s", query)
 	}
-	if got := args[len(args)-2]; got != maxPageSize {
-		t.Fatalf("limit = %v, want %d", got, maxPageSize)
+	if strings.Contains(query, "COUNT(*) OVER()") || strings.Contains(query, " OFFSET ") {
+		t.Fatalf("query performs unbounded pagination work: %s", query)
 	}
-	if got := args[len(args)-1]; got != maxPageSize {
-		t.Fatalf("offset = %v, want %d", got, maxPageSize)
+	if got := args[len(args)-1]; got != maxPageSize+1 {
+		t.Fatalf("limit = %v, want %d", got, maxPageSize+1)
 	}
 }
 
@@ -92,21 +99,29 @@ func TestConversationSearchFieldsAndRanking(t *testing.T) {
 			oldest.Add(time.Duration(i+1)*time.Hour),
 		)
 	}
+	if _, err := db.Exec(`UPDATE conversations SET created_at = last_message_at WHERE reference_number = '108' OR reference_number BETWEEN '200' AND '209'`); err != nil {
+		t.Fatalf("setting conversation creation times: %v", err)
+	}
+	if _, err := db.Exec(`UPDATE conversations SET last_message_at = NULL WHERE reference_number IN ('208', '209')`); err != nil {
+		t.Fatalf("clearing conversation timestamps: %v", err)
+	}
 	conversationID, senderID := insertSearchConversation(t, db, "999", "other@example.com", "Needle", "Name", "Needle subject", oldest)
-	if _, err := db.Exec(`
-		INSERT INTO conversation_messages (type, status, conversation_id, text_content, sender_id, sender_type)
-		VALUES ('incoming', 'received', $1, 'ordinary message', $2, 'contact')
-	`, conversationID, senderID); err != nil {
-		t.Fatalf("inserting message: %v", err)
+	for i := range 11 {
+		if _, err := db.Exec(`
+			INSERT INTO conversation_messages (type, status, conversation_id, text_content, sender_id, sender_type, created_at)
+			VALUES ('incoming', 'received', $1, $2, $3, 'contact', $4)
+		`, conversationID, fmt.Sprintf("ordinary message %d", i), senderID, oldest.Add(time.Duration(i)*time.Minute)); err != nil {
+			t.Fatalf("inserting message: %v", err)
+		}
 	}
 
 	scope := models.ReadScope{Read: true, ReadAll: true}
-	results, total, err := manager.Conversations(models.Query{Term: "108", Page: 1, PageSize: 10}, scope)
+	results, hasMore, cursor, err := manager.Conversations(models.Query{Term: "108", PageSize: 10}, scope)
 	if err != nil {
 		t.Fatalf("searching conversations: %v", err)
 	}
-	if total != 11 {
-		t.Fatalf("total = %d, want 11", total)
+	if !hasMore || cursor == "" {
+		t.Fatalf("first page has_more = %t, cursor = %q", hasMore, cursor)
 	}
 	if len(results) != 10 {
 		t.Fatalf("result count = %d, want 10", len(results))
@@ -114,38 +129,132 @@ func TestConversationSearchFieldsAndRanking(t *testing.T) {
 	if results[0].ReferenceNumber != "108" {
 		t.Fatalf("first reference = %q, want 108", results[0].ReferenceNumber)
 	}
+	newestCursor := cursor
 
-	results, total, err = manager.Conversations(models.Query{Term: "Needle", Page: 1, PageSize: 10}, scope)
+	results, hasMore, nextCursor, err := manager.Conversations(models.Query{Term: "108", Cursor: cursor, PageSize: 10}, scope)
+	if err != nil {
+		t.Fatalf("searching next conversation page: %v", err)
+	}
+	if len(results) != 1 || hasMore || nextCursor != "" {
+		t.Fatalf("next page returned %d results, has_more %t, cursor %q", len(results), hasMore, nextCursor)
+	}
+
+	results, hasMore, cursor, err = manager.Conversations(models.Query{Term: "108", Sort: models.SortOldest, PageSize: 4}, scope)
+	if err != nil {
+		t.Fatalf("searching oldest conversations: %v", err)
+	}
+	if len(results) != 4 || !hasMore || cursor == "" {
+		t.Fatalf("oldest conversation search returned %d results, has_more %t, cursor %q", len(results), hasMore, cursor)
+	}
+	if results[0].ReferenceNumber != "108" || results[1].ReferenceNumber != "200" {
+		t.Fatalf("oldest conversation references = %q, %q, want 108, 200", results[0].ReferenceNumber, results[1].ReferenceNumber)
+	}
+	results, hasMore, nextCursor, err = manager.Conversations(models.Query{Term: "108", Sort: models.SortOldest, Cursor: cursor, PageSize: 4}, scope)
+	if err != nil {
+		t.Fatalf("searching next oldest conversation page: %v", err)
+	}
+	if len(results) != 4 || !hasMore || nextCursor == "" || results[0].ReferenceNumber != "203" {
+		t.Fatalf("next oldest conversation page returned results %+v, has_more %t, cursor %q", results, hasMore, nextCursor)
+	}
+	results, hasMore, cursor, err = manager.Conversations(models.Query{Term: "108", Sort: models.SortOldest, Cursor: nextCursor, PageSize: 4}, scope)
+	if err != nil {
+		t.Fatalf("searching final oldest conversation page: %v", err)
+	}
+	if len(results) != 3 || hasMore || cursor != "" || results[1].ReferenceNumber != "208" || results[2].ReferenceNumber != "209" {
+		t.Fatalf("final oldest conversation page returned results %+v, has_more %t, cursor %q", results, hasMore, cursor)
+	}
+	if _, _, _, err := manager.Conversations(models.Query{Term: "108", Sort: models.SortOldest, Cursor: newestCursor, PageSize: 4}, scope); err == nil {
+		t.Fatal("conversation cursor was accepted with a different sort")
+	}
+
+	results, hasMore, cursor, err = manager.Conversations(models.Query{Term: "108", Sort: models.SortStartedFirst, PageSize: 4}, scope)
+	if err != nil {
+		t.Fatalf("searching conversations started first: %v", err)
+	}
+	if len(results) != 4 || !hasMore || cursor == "" || results[0].ReferenceNumber != "108" || results[1].ReferenceNumber != "200" {
+		t.Fatalf("started-first conversation search returned results %+v, has_more %t, cursor %q", results, hasMore, cursor)
+	}
+	results, _, _, err = manager.Conversations(models.Query{Term: "108", Sort: models.SortStartedFirst, Cursor: cursor, PageSize: 4}, scope)
+	if err != nil {
+		t.Fatalf("searching next started-first conversation page: %v", err)
+	}
+	if len(results) != 4 || results[0].ReferenceNumber != "203" {
+		t.Fatalf("next started-first conversation page returned results %+v", results)
+	}
+
+	results, hasMore, cursor, err = manager.Conversations(models.Query{Term: "108", Sort: models.SortStartedLast, PageSize: 4}, scope)
+	if err != nil {
+		t.Fatalf("searching conversations started last: %v", err)
+	}
+	if len(results) != 4 || !hasMore || cursor == "" || results[0].ReferenceNumber != "108" || results[1].ReferenceNumber != "209" {
+		t.Fatalf("started-last conversation search returned results %+v, has_more %t, cursor %q", results, hasMore, cursor)
+	}
+	results, _, _, err = manager.Conversations(models.Query{Term: "108", Sort: models.SortStartedLast, Cursor: cursor, PageSize: 4}, scope)
+	if err != nil {
+		t.Fatalf("searching next started-last conversation page: %v", err)
+	}
+	if len(results) != 4 || results[0].ReferenceNumber != "206" {
+		t.Fatalf("next started-last conversation page returned results %+v", results)
+	}
+
+	results, hasMore, cursor, err = manager.Conversations(models.Query{Term: "Needle", PageSize: 10}, scope)
 	if err != nil {
 		t.Fatalf("searching unsupported fields: %v", err)
 	}
-	if total != 0 || len(results) != 0 {
-		t.Fatalf("subject or name matched: total %d, results %d", total, len(results))
+	if len(results) != 0 || hasMore || cursor != "" {
+		t.Fatalf("subject or name matched: results %d, has_more %t, cursor %q", len(results), hasMore, cursor)
 	}
 
-	messages, messageTotal, err := manager.Messages(models.Query{Term: "ordinary", Page: 1, PageSize: 10}, scope)
+	messages, hasMore, cursor, err := manager.Messages(models.Query{Term: "ordinary", PageSize: 10}, scope)
 	if err != nil {
 		t.Fatalf("searching messages: %v", err)
 	}
-	if messageTotal != 1 || len(messages) != 1 || messages[0].TextContent != "ordinary message" {
-		t.Fatalf("message search returned total %d, results %+v", messageTotal, messages)
+	if len(messages) != 10 || !hasMore || cursor == "" {
+		t.Fatalf("message search returned results %+v, has_more %t, cursor %q", messages, hasMore, cursor)
+	}
+	messages, hasMore, nextCursor, err = manager.Messages(models.Query{Term: "ordinary", Cursor: cursor, PageSize: 10}, scope)
+	if err != nil {
+		t.Fatalf("searching next message page: %v", err)
+	}
+	if len(messages) != 1 || hasMore || nextCursor != "" {
+		t.Fatalf("next message page returned %d results, has_more %t, cursor %q", len(messages), hasMore, nextCursor)
+	}
+	messages, hasMore, cursor, err = manager.Messages(models.Query{Term: "ordinary", Sort: models.SortOldest, PageSize: 10}, scope)
+	if err != nil {
+		t.Fatalf("searching oldest messages: %v", err)
+	}
+	if len(messages) != 10 || !hasMore || cursor == "" || messages[0].TextContent != "ordinary message 0" {
+		t.Fatalf("oldest message search returned results %+v, has_more %t, cursor %q", messages, hasMore, cursor)
+	}
+	messages, hasMore, nextCursor, err = manager.Messages(models.Query{Term: "ordinary", Sort: models.SortOldest, Cursor: cursor, PageSize: 10}, scope)
+	if err != nil {
+		t.Fatalf("searching next oldest message page: %v", err)
+	}
+	if len(messages) != 1 || hasMore || nextCursor != "" || messages[0].TextContent != "ordinary message 10" {
+		t.Fatalf("next oldest message page returned results %+v, has_more %t, cursor %q", messages, hasMore, nextCursor)
+	}
+	if _, _, _, err := manager.Messages(models.Query{Term: "ordinary", Cursor: "invalid", PageSize: 10}, scope); err == nil {
+		t.Fatal("invalid message cursor was accepted")
+	}
+	if _, _, _, err := manager.Messages(models.Query{Term: "ordinary", Sort: models.SortStartedFirst, PageSize: 10}, scope); err == nil {
+		t.Fatal("conversation-only sort was accepted for messages")
 	}
 
 	for _, term := range []string{"%%%", "___", "%_%"} {
-		results, total, err = manager.Conversations(models.Query{Term: term, Page: 1, PageSize: 10}, scope)
+		results, hasMore, cursor, err = manager.Conversations(models.Query{Term: term, PageSize: 10}, scope)
 		if err != nil {
 			t.Fatalf("searching conversations for %q: %v", term, err)
 		}
-		if total != 0 || len(results) != 0 {
-			t.Fatalf("conversation search for %q returned total %d, results %d", term, total, len(results))
+		if len(results) != 0 || hasMore || cursor != "" {
+			t.Fatalf("conversation search for %q returned %d results, has_more %t, cursor %q", term, len(results), hasMore, cursor)
 		}
 
-		messages, messageTotal, err = manager.Messages(models.Query{Term: term, Page: 1, PageSize: 10}, scope)
+		messages, hasMore, cursor, err = manager.Messages(models.Query{Term: term, PageSize: 10}, scope)
 		if err != nil {
 			t.Fatalf("searching messages for %q: %v", term, err)
 		}
-		if messageTotal != 0 || len(messages) != 0 {
-			t.Fatalf("message search for %q returned total %d, results %d", term, messageTotal, len(messages))
+		if len(messages) != 0 || hasMore || cursor != "" {
+			t.Fatalf("message search for %q returned %d results, has_more %t, cursor %q", term, len(messages), hasMore, cursor)
 		}
 
 		contacts, err := manager.Contacts(term, 10)

From c1e9626a83a47d3f866c4ceb0384f4276ed3bbe0 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 02:36:23 +0530
Subject: [PATCH 087/178] preserve search sort and remove unused pagination
 changes

---
 .../components/pagination/PaginationBar.vue   | 48 ++++++-------------
 .../src/features/search/SearchPagination.vue  | 10 +---
 .../apps/main/src/views/search/SearchView.vue | 20 ++++++--
 i18n/en-US.json                               |  6 ---
 4 files changed, 32 insertions(+), 52 deletions(-)

diff --git a/frontend/apps/main/src/components/pagination/PaginationBar.vue b/frontend/apps/main/src/components/pagination/PaginationBar.vue
index 7516e4ee..7ba949c7 100644
--- a/frontend/apps/main/src/components/pagination/PaginationBar.vue
+++ b/frontend/apps/main/src/components/pagination/PaginationBar.vue
@@ -1,17 +1,12 @@
 <template>
-  <div class="sticky bottom-0 bg-background pt-3 pb-4 mt-auto">
-    <div
-      class="flex flex-col sm:flex-row items-center justify-between gap-4 rounded-md border border-border shadow-sm px-4 py-3"
-    >
+  <div class="sticky bottom-0 bg-background border-t border-border px-4 py-3 mt-auto">
+    <div class="flex flex-col sm:flex-row items-center justify-between gap-4">
       <div class="flex items-center gap-3">
         <span class="text-sm text-muted-foreground tabular-nums">
           {{ t('globals.messages.pageNofTotal', { page, total: totalPages }) }}
         </span>
         <Select :model-value="perPage" @update:model-value="handlePerPageChange">
-          <SelectTrigger
-            class="h-10 w-[70px] sm:h-8"
-            :aria-label="t('globals.messages.resultsPerPage')"
-          >
+          <SelectTrigger class="h-8 w-[70px]">
             <SelectValue :placeholder="String(perPage)" />
           </SelectTrigger>
           <SelectContent>
@@ -24,41 +19,36 @@
 
       <div class="flex items-center gap-1">
         <Button
-          type="button"
           variant="ghost"
           size="sm"
-          :class="EDGE_BUTTON_CLASS"
-          :aria-label="t('globals.messages.firstPage')"
+          class="h-8 w-8 p-0"
           :disabled="page <= 1"
           @click="goToPage(1)"
         >
-          <ChevronsLeft :class="PAGINATION_ICON_CLASS" aria-hidden="true" />
+          <ChevronsLeft class="h-4 w-4" />
         </Button>
         <Button
-          type="button"
           variant="ghost"
           size="sm"
-          :class="STEP_BUTTON_CLASS"
-          :aria-label="t('globals.messages.previousPage')"
+          class="h-8 w-8 p-0"
           :disabled="page <= 1"
           @click="goToPage(page - 1)"
         >
-          <ChevronLeft :class="PAGINATION_ICON_CLASS" aria-hidden="true" />
+          <ChevronLeft class="h-4 w-4" />
         </Button>
 
         <div class="flex items-center bg-muted rounded-lg p-1">
           <template v-for="pageNumber in visiblePages" :key="pageNumber">
             <span
               v-if="pageNumber === '...'"
-              class="flex h-10 w-10 items-center justify-center text-sm text-muted-foreground select-none sm:h-7 sm:w-7"
+              class="flex items-center justify-center h-7 w-7 text-sm text-muted-foreground select-none"
             >
               ...
             </span>
             <button
               v-else
-              type="button"
               @click="goToPage(pageNumber)"
-              class="h-10 min-w-10 px-2 rounded-md text-sm font-medium transition-all duration-150 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring sm:h-7 sm:min-w-7"
+              class="h-7 min-w-7 px-2 rounded-md text-sm font-medium transition-all duration-150 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring"
               :class="
                 pageNumber === page
                   ? 'bg-background text-foreground shadow-sm'
@@ -71,26 +61,22 @@
         </div>
 
         <Button
-          type="button"
           variant="ghost"
           size="sm"
-          :class="STEP_BUTTON_CLASS"
-          :aria-label="t('globals.messages.nextPage')"
+          class="h-8 w-8 p-0"
           :disabled="page >= totalPages"
           @click="goToPage(page + 1)"
         >
-          <ChevronRight :class="PAGINATION_ICON_CLASS" aria-hidden="true" />
+          <ChevronRight class="h-4 w-4" />
         </Button>
         <Button
-          type="button"
           variant="ghost"
           size="sm"
-          :class="EDGE_BUTTON_CLASS"
-          :aria-label="t('globals.messages.lastPage')"
+          class="h-8 w-8 p-0"
           :disabled="page >= totalPages"
           @click="goToPage(totalPages)"
         >
-          <ChevronsRight :class="PAGINATION_ICON_CLASS" aria-hidden="true" />
+          <ChevronsRight class="h-4 w-4" />
         </Button>
       </div>
     </div>
@@ -111,10 +97,6 @@ import { ChevronsLeft, ChevronLeft, ChevronRight, ChevronsRight } from 'lucide-v
 import { useI18n } from 'vue-i18n'
 import { getVisiblePages } from '@main/utils/pagination'
 
-const EDGE_BUTTON_CLASS = 'hidden h-8 w-8 p-0 sm:inline-flex'
-const PAGINATION_ICON_CLASS = 'h-4 w-4'
-const STEP_BUTTON_CLASS = 'h-10 w-10 p-0 sm:h-8 sm:w-8'
-
 const props = defineProps({
   page: { type: Number, required: true },
   perPage: { type: Number, required: true },
@@ -122,7 +104,7 @@ const props = defineProps({
   perPageOptions: { type: Array, default: () => [15, 30, 50, 100] }
 })
 
-const emit = defineEmits(['update:page', 'update:perPage', 'change'])
+const emit = defineEmits(['update:page', 'update:perPage'])
 
 const { t } = useI18n()
 
@@ -131,13 +113,11 @@ const visiblePages = computed(() => getVisiblePages(props.page, props.totalPages
 function goToPage(p) {
   if (p >= 1 && p <= props.totalPages && p !== props.page) {
     emit('update:page', p)
-    emit('change', { page: p, perPage: props.perPage })
   }
 }
 
 function handlePerPageChange(newPerPage) {
   emit('update:perPage', newPerPage)
   emit('update:page', 1)
-  emit('change', { page: 1, perPage: newPerPage })
 }
 </script>
diff --git a/frontend/apps/main/src/features/search/SearchPagination.vue b/frontend/apps/main/src/features/search/SearchPagination.vue
index 65813461..6fbac1d2 100644
--- a/frontend/apps/main/src/features/search/SearchPagination.vue
+++ b/frontend/apps/main/src/features/search/SearchPagination.vue
@@ -4,10 +4,7 @@
       class="flex items-center justify-between gap-4 rounded-md border border-border px-4 py-3 shadow-sm"
     >
       <Select :model-value="perPage" @update:model-value="handlePerPageChange">
-        <SelectTrigger
-          class="h-10 w-[70px] sm:h-8"
-          :aria-label="t('globals.messages.resultsPerPage')"
-        >
+        <SelectTrigger class="h-10 w-[70px] sm:h-8">
           <SelectValue :placeholder="String(perPage)" />
         </SelectTrigger>
         <SelectContent>
@@ -23,7 +20,6 @@
           variant="ghost"
           size="sm"
           :class="STEP_BUTTON_CLASS"
-          :aria-label="t('globals.messages.previousPage')"
           :disabled="page <= 1"
           @click="goToPage(page - 1)"
         >
@@ -34,7 +30,6 @@
           variant="ghost"
           size="sm"
           :class="STEP_BUTTON_CLASS"
-          :aria-label="t('globals.messages.nextPage')"
           :disabled="!hasMore"
           @click="goToPage(page + 1)"
         >
@@ -49,7 +44,6 @@
 const STEP_BUTTON_CLASS = 'h-10 w-10 p-0 sm:h-8 sm:w-8'
 
 import { ChevronLeft, ChevronRight } from 'lucide-vue-next'
-import { useI18n } from 'vue-i18n'
 import { Button } from '@shared-ui/components/ui/button'
 import {
   Select,
@@ -68,8 +62,6 @@ const props = defineProps({
 
 const emit = defineEmits(['change'])
 
-const { t } = useI18n()
-
 function goToPage(page) {
   if (page < 1 || (page > props.page && !props.hasMore)) return
   emit('change', { page, perPage: props.perPage })
diff --git a/frontend/apps/main/src/views/search/SearchView.vue b/frontend/apps/main/src/views/search/SearchView.vue
index 3903fdf8..54271d5f 100644
--- a/frontend/apps/main/src/views/search/SearchView.vue
+++ b/frontend/apps/main/src/views/search/SearchView.vue
@@ -27,7 +27,6 @@
             v-if="term"
             type="button"
             class="absolute right-2 top-1/2 -translate-y-1/2 p-1.5 rounded-md text-muted-foreground hover:text-foreground hover:bg-accent"
-            :aria-label="$t('globals.messages.clear')"
             @click="term = ''"
           >
             <X class="w-4 h-4" aria-hidden="true" />
@@ -95,7 +94,12 @@ import api from '@main/api'
 const MIN_SEARCH_LENGTH = 3
 const DEBOUNCE_DELAY = 300
 const DEFAULT_PER_PAGE = 30
+const DEFAULT_SORT = 'newest'
 const TABS = ['conversations', 'messages']
+const SORTS_BY_TAB = {
+  conversations: ['newest', 'oldest', 'started_first', 'started_last'],
+  messages: ['newest', 'oldest']
+}
 
 const route = useRoute()
 const router = useRouter()
@@ -116,8 +120,14 @@ const emptyCursorHistory = () => ({
 const inputRef = ref(null)
 const term = ref(String(route.query.q || ''))
 const filters = ref(filtersFromQuery(route.query))
-const activeTab = ref(TABS.includes(route.query.tab) ? route.query.tab : 'conversations')
-const sorts = ref({ conversations: 'newest', messages: 'newest' })
+const initialTab = TABS.includes(route.query.tab) ? route.query.tab : 'conversations'
+const initialSort = String(route.query.sort || '')
+const activeTab = ref(initialTab)
+const sorts = ref({
+  conversations: DEFAULT_SORT,
+  messages: DEFAULT_SORT,
+  [initialTab]: SORTS_BY_TAB[initialTab].includes(initialSort) ? initialSort : DEFAULT_SORT
+})
 const tabSelectedByUser = ref(TABS.includes(route.query.tab))
 const results = ref(emptyResults())
 const loading = ref(false)
@@ -224,6 +234,7 @@ const changeSort = ({ type, sort }) => {
   if (sorts.value[type] === sort) return
   sorts.value = { ...sorts.value, [type]: sort }
   cursorsByPage[type] = new Map([[1, '']])
+  syncRoute()
   fetchPage(type, 1, results.value[type].per_page)
 }
 
@@ -238,6 +249,9 @@ const syncRoute = () => {
   if (tabSelectedByUser.value || activeTab.value !== 'conversations') {
     query.tab = activeTab.value
   }
+  if (sorts.value[activeTab.value] !== DEFAULT_SORT) {
+    query.sort = sorts.value[activeTab.value]
+  }
   router.replace({ query })
 }
 
diff --git a/i18n/en-US.json b/i18n/en-US.json
index da9443a6..d82582c4 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -835,7 +835,6 @@
   "globals.messages.approve": "Approve",
   "globals.messages.reject": "Reject",
   "globals.messages.caseSensitiveMatch": "Case sensitive match",
-  "globals.messages.clear": "Clear",
   "globals.messages.clearFilters": "Clear filters",
   "globals.messages.close": "Close",
   "globals.messages.closeChat": "Close chat",
@@ -864,7 +863,6 @@
   "globals.messages.exportData": "Export data",
   "globals.messages.false": "False",
   "globals.messages.fileTypeisNotAnImage": "File type is not an image",
-  "globals.messages.firstPage": "First page",
   "globals.messages.goBack": "Go back",
   "globals.messages.golangDurationHoursMinutes": "Duration in hours or minutes. Example: 1h, 30m, 1h30m",
   "globals.messages.gradientEnd": "Gradient end",
@@ -878,7 +876,6 @@
   "globals.messages.insertExample": "Insert example",
   "globals.messages.invalidFilters": "Invalid filters.",
   "globals.messages.invite": "Invite",
-  "globals.messages.lastPage": "Last page",
   "globals.messages.lastUsed": "Last used",
   "globals.messages.linkUrl": "Link URL",
   "globals.messages.markAllAsRead": "Mark all as read",
@@ -889,7 +886,6 @@
   "globals.messages.mustBeNumber": "Must be a number",
   "globals.messages.nDays": "{days} days",
   "globals.messages.new": "New",
-  "globals.messages.nextPage": "Next page",
   "globals.messages.moveUp": "Move up",
   "globals.messages.moveDown": "Move down",
   "globals.messages.no": "No",
@@ -906,7 +902,6 @@
   "globals.messages.pleaseRateConversation": "Please rate this conversation:",
   "globals.messages.pleaseSelect": "Please select {name} before submitting",
   "globals.messages.pressEnterToSelectAValue": "Press enter to select a value",
-  "globals.messages.previousPage": "Previous page",
   "globals.messages.publish": "Publish",
   "globals.messages.reassigning": "Reassigning",
   "globals.messages.regenerate": "Regenerate",
@@ -915,7 +910,6 @@
   "globals.messages.reset": "Reset",
   "globals.messages.resetToDefault": "Reset to default",
   "globals.messages.resultsAppearHere": "Results will appear here.",
-  "globals.messages.resultsPerPage": "Results per page",
   "globals.messages.revoke": "Revoke",
   "globals.messages.save": "Save",
   "globals.messages.saveChanges": "Save changes",

From 319c5e6d17681601eab621774a19ef01490eda9f Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 02:46:14 +0530
Subject: [PATCH 088/178] add accessible labels to search controls

---
 frontend/apps/main/src/features/search/SearchPagination.vue | 2 ++
 frontend/apps/main/src/views/search/SearchView.vue          | 1 +
 i18n/en-US.json                                             | 3 +++
 3 files changed, 6 insertions(+)

diff --git a/frontend/apps/main/src/features/search/SearchPagination.vue b/frontend/apps/main/src/features/search/SearchPagination.vue
index 6fbac1d2..ae03bbb4 100644
--- a/frontend/apps/main/src/features/search/SearchPagination.vue
+++ b/frontend/apps/main/src/features/search/SearchPagination.vue
@@ -17,6 +17,7 @@
       <div class="flex items-center gap-1">
         <Button
           type="button"
+          :aria-label="$t('globals.messages.previousPage')"
           variant="ghost"
           size="sm"
           :class="STEP_BUTTON_CLASS"
@@ -27,6 +28,7 @@
         </Button>
         <Button
           type="button"
+          :aria-label="$t('globals.messages.nextPage')"
           variant="ghost"
           size="sm"
           :class="STEP_BUTTON_CLASS"
diff --git a/frontend/apps/main/src/views/search/SearchView.vue b/frontend/apps/main/src/views/search/SearchView.vue
index 54271d5f..6e5852e1 100644
--- a/frontend/apps/main/src/views/search/SearchView.vue
+++ b/frontend/apps/main/src/views/search/SearchView.vue
@@ -26,6 +26,7 @@
           <button
             v-if="term"
             type="button"
+            :aria-label="$t('globals.terms.clearSearch')"
             class="absolute right-2 top-1/2 -translate-y-1/2 p-1.5 rounded-md text-muted-foreground hover:text-foreground hover:bg-accent"
             @click="term = ''"
           >
diff --git a/i18n/en-US.json b/i18n/en-US.json
index d82582c4..81999a04 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -888,6 +888,7 @@
   "globals.messages.new": "New",
   "globals.messages.moveUp": "Move up",
   "globals.messages.moveDown": "Move down",
+  "globals.messages.nextPage": "Next page",
   "globals.messages.no": "No",
   "globals.messages.noInternetConnection": "No internet connection",
   "globals.messages.noMessagesYet": "No messages yet",
@@ -902,6 +903,7 @@
   "globals.messages.pleaseRateConversation": "Please rate this conversation:",
   "globals.messages.pleaseSelect": "Please select {name} before submitting",
   "globals.messages.pressEnterToSelectAValue": "Press enter to select a value",
+  "globals.messages.previousPage": "Previous page",
   "globals.messages.publish": "Publish",
   "globals.messages.reassigning": "Reassigning",
   "globals.messages.regenerate": "Regenerate",
@@ -982,6 +984,7 @@
   "globals.terms.channel": "Channel",
   "globals.terms.clientID": "Client ID",
   "globals.terms.clientSecret": "Client secret",
+  "globals.terms.clearSearch": "Clear search",
   "globals.terms.closed": "Closed",
   "globals.terms.closedAt": "Closed at",
   "globals.terms.collapse": "Collapse",

From 3843f1e7e91b2d31507936febd8347cfb6f88e38 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 02:55:49 +0530
Subject: [PATCH 089/178] Merge branch 'main' into
 libredesk-widget-improvements

---
 cmd/widget_campaign_reply.go       |  9 ++++---
 internal/conversation/proactive.go | 41 +++++++++++++++---------------
 2 files changed, 27 insertions(+), 23 deletions(-)

diff --git a/cmd/widget_campaign_reply.go b/cmd/widget_campaign_reply.go
index 3079846a..531e690a 100644
--- a/cmd/widget_campaign_reply.go
+++ b/cmd/widget_campaign_reply.go
@@ -74,15 +74,18 @@ func handleWidgetCampaignReply(r *fastglue.Request, req chatInitReq, inbox imode
 			return sendErrorEnvelope(r, err)
 		}
 		meta := map[string]any{"ip": realip.FromRequest(r.RequestCtx), "user_agent": string(r.RequestCtx.Request.Header.Peek("User-Agent")), "campaign_id": delivery.CampaignID}
-		delivery.ConversationUUID, err = app.conversation.CreateProactiveConversation(delivery, contact.ID, req.Message, attrs, meta, maxChatConversationsPerContact, chatConversationRateLimitWindow)
+		reply, err := app.conversation.CreateProactiveConversation(delivery, contact.ID, req.Message, attrs, meta, maxChatConversationsPerContact, chatConversationRateLimitWindow)
 		if err != nil {
 			if _, ok := err.(envelope.Error); ok {
 				return sendErrorEnvelope(r, err)
 			}
 			return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.T("globals.messages.errorSendingMessage"), nil))
 		}
-		if err := app.conversation.ProcessIncomingMessageHooks(delivery.ConversationUUID, true); err != nil {
-			app.lo.Error("error processing proactive reply hooks", "error", err)
+		delivery.ConversationUUID = reply.ConversationUUID
+		if reply.ID > 0 {
+			if err := app.conversation.ProcessIncomingMessageHooks(reply, true); err != nil {
+				app.lo.Error("error processing proactive reply hooks", "error", err)
+			}
 		}
 	}
 	conversation, err := app.conversation.GetConversation(0, delivery.ConversationUUID, "")
diff --git a/internal/conversation/proactive.go b/internal/conversation/proactive.go
index 96403a74..ec58b6db 100644
--- a/internal/conversation/proactive.go
+++ b/internal/conversation/proactive.go
@@ -10,74 +10,75 @@ import (
 	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat/proactive"
 )
 
-func (m *Manager) CreateProactiveConversation(delivery proactive.Delivery, contactID int, reply string, attrs, meta map[string]any, maxConversations int, window time.Duration) (string, error) {
+func (m *Manager) CreateProactiveConversation(delivery proactive.Delivery, contactID int, reply string, attrs, meta map[string]any, maxConversations int, window time.Duration) (models.Message, error) {
 	var snapshot proactive.Snapshot
 	if err := json.Unmarshal(delivery.Snapshot, &snapshot); err != nil {
-		return "", envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+		return models.Message{}, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
 	if attrs == nil {
 		attrs = map[string]any{}
 	}
 	attrsJSON, err := json.Marshal(attrs)
 	if err != nil {
-		return "", m.proactiveError(err)
+		return models.Message{}, m.proactiveError(err)
 	}
 	metaJSON, err := json.Marshal(meta)
 	if err != nil {
-		return "", m.proactiveError(err)
+		return models.Message{}, m.proactiveError(err)
 	}
 	tx, err := m.db.Beginx()
 	if err != nil {
-		return "", m.proactiveError(err)
+		return models.Message{}, m.proactiveError(err)
 	}
 	defer tx.Rollback()
 	var existing string
 	if err := tx.Stmtx(m.q.LockCampaignDelivery).Get(&existing, delivery.ID); err != nil {
-		return "", m.proactiveError(err)
+		return models.Message{}, m.proactiveError(err)
 	}
 	if existing != "" {
-		return existing, nil
+		return models.Message{ConversationUUID: existing}, nil
 	}
 	var id int
 	var uuid string
 	now := time.Now()
 	if err := tx.Stmtx(m.q.InsertConversation).QueryRow(contactID, models.StatusOpen, delivery.InboxID, reply, now, "", "", false, metaJSON, attrsJSON, now.Add(-window), maxConversations, m.subjectRefFormat).Scan(&id, &uuid); err != nil {
 		if err == sql.ErrNoRows {
-			return "", envelope.NewError(envelope.RateLimitError, m.i18n.T("globals.messages.tooManyRequests"), nil)
+			return models.Message{}, envelope.NewError(envelope.RateLimitError, m.i18n.T("globals.messages.tooManyRequests"), nil)
 		}
-		return "", m.proactiveError(err)
+		return models.Message{}, m.proactiveError(err)
 	}
 	if _, err := tx.Stmtx(m.q.AssignProactiveTeam).Exec(id, snapshot.TeamID); err != nil {
-		return "", m.proactiveError(err)
+		return models.Message{}, m.proactiveError(err)
 	}
 	if _, err := tx.Stmtx(m.q.CompleteCampaignDelivery).Exec(delivery.ID, uuid, contactID); err != nil {
-		return "", m.proactiveError(err)
+		return models.Message{}, m.proactiveError(err)
 	}
 	if err := tx.Commit(); err != nil {
-		return "", m.proactiveError(err)
+		return models.Message{}, m.proactiveError(err)
 	}
 	if item, err := m.GetConversationListItem(uuid); err == nil {
 		m.BroadcastNewConversation(&item)
 	}
 	invitationMeta, _ := json.Marshal(map[string]any{"proactive_sender": snapshot.Sender, "campaign_id": delivery.CampaignID})
-	for _, message := range []models.Message{
+	messages := []models.Message{
 		{Type: models.MessageOutgoing, Status: models.MessageStatusSent, SenderID: snapshot.SenderID, SenderType: models.SenderTypeAgent, Content: snapshot.Message, Meta: invitationMeta},
 		{Type: models.MessageIncoming, Status: models.MessageStatusReceived, SenderID: contactID, SenderType: models.SenderTypeContact, Content: reply},
-	} {
-		message.ConversationID = id
-		message.ConversationUUID = uuid
-		message.ContentType = models.ContentTypeText
-		if err := m.InsertMessage(&message); err != nil {
+	}
+	for i := range messages {
+		messages[i].ConversationID = id
+		messages[i].ConversationUUID = uuid
+		messages[i].ContentType = models.ContentTypeText
+		if err := m.InsertMessage(&messages[i]); err != nil {
 			if err := m.DeleteConversation(uuid); err != nil {
 				m.lo.Error("error deleting proactive conversation after message insert failure", "conversation_uuid", uuid, "error", err)
 			}
 			if _, err := m.q.RevertCampaignDelivery.Exec(delivery.ID); err != nil {
 				m.lo.Error("error reverting campaign delivery after message insert failure", "delivery_id", delivery.ID, "error", err)
 			}
-			return "", err
+			return models.Message{}, err
 		}
 	}
-	return uuid, nil
+	return messages[1], nil
 }
 
 func (m *Manager) proactiveError(err error) error {

From 11012795b20687ae00ac68b30a226b75ce0ddbcc Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 13:36:17 +0530
Subject: [PATCH 090/178] fix mobile layouts

---
 .../src/components/datatable/DataTable.vue    | 24 ++++++++----
 .../components/pagination/PaginationBar.vue   | 22 +++++++++--
 .../admin/automation/AutomationTabs.vue       | 14 +++----
 .../main/src/features/contact/ContactForm.vue | 20 +++++-----
 .../features/conversation/Conversation.vue    | 14 +++++--
 .../conversation/CreateConversation.vue       | 24 ++++++++----
 .../notifications/NotificationPreferences.vue | 18 ++++++---
 .../views/admin/templates/TemplateList.vue    | 37 +++++++++++--------
 .../ui/sidebar/SidebarMenuSubButton.vue       |  2 +-
 .../components/ui/sidebar/SidebarTrigger.vue  |  2 +-
 .../shared-ui/components/ui/sidebar/index.js  |  4 +-
 frontend/shared-ui/composables/useIsMobile.js |  6 +--
 i18n/en-US.json                               |  5 +++
 13 files changed, 123 insertions(+), 69 deletions(-)

diff --git a/frontend/apps/main/src/components/datatable/DataTable.vue b/frontend/apps/main/src/components/datatable/DataTable.vue
index 5c7e8ee3..db775f1f 100644
--- a/frontend/apps/main/src/components/datatable/DataTable.vue
+++ b/frontend/apps/main/src/components/datatable/DataTable.vue
@@ -14,7 +14,7 @@
       class="relative overflow-auto rounded-lg border border-border bg-card shadow-sm"
       :style="{ maxHeight }"
     >
-      <table class="w-full caption-bottom text-sm">
+      <table class="w-full caption-bottom text-sm sm:w-max sm:min-w-full">
         <TableHeader class="sticky top-0 z-10 bg-card">
           <TableRow
             v-for="headerGroup in table.getHeaderGroups()"
@@ -22,12 +22,15 @@
             class="border-b border-border bg-muted/40 hover:bg-muted/40"
           >
             <TableHead
-              v-for="header in headerGroup.headers"
+              v-for="(header, headerIndex) in headerGroup.headers"
               :key="header.id"
-              class="h-11 px-4 text-center text-sm font-medium text-muted-foreground"
+              class="h-11 px-4 text-center text-sm font-medium text-muted-foreground sm:whitespace-nowrap"
               :class="{
                 'group cursor-pointer select-none transition-colors hover:text-foreground':
-                  header.column.getCanSort()
+                  header.column.getCanSort(),
+                'max-sm:hidden':
+                  (headerIndex > 1 && header.column.id !== 'actions') ||
+                  ['created_at', 'updated_at'].includes(header.column.id)
               }"
               @click="header.column.getToggleSortingHandler()?.($event)"
             >
@@ -64,10 +67,15 @@
               class="group/row border-b border-border/50 transition-colors last:border-0 hover:bg-muted/30 data-[state=selected]:bg-muted"
             >
               <TableCell
-                v-for="cell in rows[virtualRow.index].getVisibleCells()"
+                v-for="(cell, cellIndex) in rows[virtualRow.index].getVisibleCells()"
                 :key="cell.id"
-                class="px-4 py-3 text-center text-sm"
-                :class="cell.column.id === 'actions' ? actionCellClass : ''"
+                class="px-4 py-3 text-center text-sm sm:whitespace-nowrap"
+                :class="[
+                  cell.column.id === 'actions' ? actionCellClass : '',
+                  ((cellIndex > 1 && cell.column.id !== 'actions') ||
+                    ['created_at', 'updated_at'].includes(cell.column.id)) &&
+                    'max-sm:hidden'
+                ]"
               >
                 <FlexRender :render="cell.column.columnDef.cell" :props="cell.getContext()" />
               </TableCell>
@@ -205,7 +213,7 @@ const rowVirtualizer = useVirtualizer({
 
 const virtualRows = computed(() => rowVirtualizer.value.getVirtualItems())
 const totalSize = computed(() => rowVirtualizer.value.getTotalSize())
-const paddingTop = computed(() => (virtualRows.value[0]?.start ?? 0))
+const paddingTop = computed(() => virtualRows.value[0]?.start ?? 0)
 const paddingBottom = computed(() => {
   const last = virtualRows.value[virtualRows.value.length - 1]
   return last ? totalSize.value - last.end : 0
diff --git a/frontend/apps/main/src/components/pagination/PaginationBar.vue b/frontend/apps/main/src/components/pagination/PaginationBar.vue
index 7ba949c7..206e6c2f 100644
--- a/frontend/apps/main/src/components/pagination/PaginationBar.vue
+++ b/frontend/apps/main/src/components/pagination/PaginationBar.vue
@@ -19,18 +19,22 @@
 
       <div class="flex items-center gap-1">
         <Button
+          type="button"
           variant="ghost"
           size="sm"
-          class="h-8 w-8 p-0"
+          :class="EDGE_PAGE_BUTTON_CLASS"
+          :aria-label="t('globals.messages.firstPage')"
           :disabled="page <= 1"
           @click="goToPage(1)"
         >
           <ChevronsLeft class="h-4 w-4" />
         </Button>
         <Button
+          type="button"
           variant="ghost"
           size="sm"
-          class="h-8 w-8 p-0"
+          :class="PAGE_BUTTON_CLASS"
+          :aria-label="t('globals.messages.previousPage')"
           :disabled="page <= 1"
           @click="goToPage(page - 1)"
         >
@@ -47,7 +51,10 @@
             </span>
             <button
               v-else
+              type="button"
               @click="goToPage(pageNumber)"
+              :aria-label="`${t('globals.terms.page')} ${pageNumber}`"
+              :aria-current="pageNumber === page ? 'page' : undefined"
               class="h-7 min-w-7 px-2 rounded-md text-sm font-medium transition-all duration-150 focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring"
               :class="
                 pageNumber === page
@@ -61,18 +68,22 @@
         </div>
 
         <Button
+          type="button"
           variant="ghost"
           size="sm"
-          class="h-8 w-8 p-0"
+          :class="PAGE_BUTTON_CLASS"
+          :aria-label="t('globals.messages.nextPage')"
           :disabled="page >= totalPages"
           @click="goToPage(page + 1)"
         >
           <ChevronRight class="h-4 w-4" />
         </Button>
         <Button
+          type="button"
           variant="ghost"
           size="sm"
-          class="h-8 w-8 p-0"
+          :class="EDGE_PAGE_BUTTON_CLASS"
+          :aria-label="t('globals.messages.lastPage')"
           :disabled="page >= totalPages"
           @click="goToPage(totalPages)"
         >
@@ -84,6 +95,9 @@
 </template>
 
 <script setup>
+const EDGE_PAGE_BUTTON_CLASS = 'hidden h-8 w-8 p-0 sm:inline-flex'
+const PAGE_BUTTON_CLASS = 'h-8 w-8 p-0'
+
 import { computed } from 'vue'
 import { Button } from '@shared-ui/components/ui/button'
 import {
diff --git a/frontend/apps/main/src/features/admin/automation/AutomationTabs.vue b/frontend/apps/main/src/features/admin/automation/AutomationTabs.vue
index 5bb4742f..19b606bc 100644
--- a/frontend/apps/main/src/features/admin/automation/AutomationTabs.vue
+++ b/frontend/apps/main/src/features/admin/automation/AutomationTabs.vue
@@ -1,15 +1,13 @@
 <template>
   <Tabs default-value="new_conversation" v-model="selectedTab">
-    <TabsList class="grid w-full grid-cols-3 mb-5">
-      <TabsTrigger value="new_conversation">
-        {{
-          $t('conversation.newConversation')
-        }}
+    <TabsList class="flex w-full justify-start overflow-x-auto mb-5 sm:grid sm:grid-cols-3">
+      <TabsTrigger value="new_conversation" :class="AUTOMATION_TAB_CLASS">
+        {{ $t('conversation.newConversation') }}
       </TabsTrigger>
-      <TabsTrigger value="conversation_update">
+      <TabsTrigger value="conversation_update" :class="AUTOMATION_TAB_CLASS">
         {{ $t('admin.automation.conversationUpdate') }}
       </TabsTrigger>
-      <TabsTrigger value="time_trigger">
+      <TabsTrigger value="time_trigger" :class="AUTOMATION_TAB_CLASS">
         {{ $t('admin.automation.timeTriggers') }}
       </TabsTrigger>
     </TabsList>
@@ -32,6 +30,8 @@
 </template>
 
 <script setup>
+const AUTOMATION_TAB_CLASS = 'shrink-0 sm:min-w-0'
+
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@shared-ui/components/ui/tabs'
 import { useI18n } from 'vue-i18n'
 import RuleTab from './RuleTab.vue'
diff --git a/frontend/apps/main/src/features/contact/ContactForm.vue b/frontend/apps/main/src/features/contact/ContactForm.vue
index fa3eb4ae..d934dd28 100644
--- a/frontend/apps/main/src/features/contact/ContactForm.vue
+++ b/frontend/apps/main/src/features/contact/ContactForm.vue
@@ -1,7 +1,7 @@
 <template>
   <form @submit.prevent="onSubmit" class="space-y-8">
-    <div class="flex flex-wrap gap-6">
-      <div class="flex-1">
+    <div :class="FIELD_GRID_CLASS">
+      <div :class="FIELD_COLUMN_CLASS">
         <FormField v-slot="{ componentField }" name="first_name">
           <FormItem class="flex flex-col">
             <FormLabel class="flex items-center">{{ t('globals.terms.firstName') }}</FormLabel>
@@ -11,7 +11,7 @@
         </FormField>
       </div>
 
-      <div class="flex-1">
+      <div :class="FIELD_COLUMN_CLASS">
         <FormField v-slot="{ componentField }" name="last_name">
           <FormItem class="flex flex-col">
             <FormLabel class="flex items-center">{{ t('globals.terms.lastName') }}</FormLabel>
@@ -28,8 +28,8 @@
       ></FormItem>
     </FormField>
 
-    <div class="flex flex-wrap gap-6">
-      <div class="flex-1">
+    <div :class="FIELD_GRID_CLASS">
+      <div :class="FIELD_COLUMN_CLASS">
         <FormField v-slot="{ componentField }" name="email">
           <FormItem class="flex flex-col">
             <FormLabel class="flex items-center">{{ t('globals.terms.email') }}</FormLabel>
@@ -39,13 +39,13 @@
         </FormField>
       </div>
 
-      <div class="flex flex-col flex-1">
+      <div :class="FIELD_COLUMN_CLASS">
         <PhoneNumberInput />
       </div>
     </div>
 
-    <div class="flex flex-wrap gap-6">
-      <div class="flex-1">
+    <div :class="FIELD_GRID_CLASS">
+      <div :class="FIELD_COLUMN_CLASS">
         <FormField v-slot="{ componentField }" name="country">
           <FormItem class="flex flex-col">
             <FormLabel class="flex items-center">{{ t('globals.terms.country') }}</FormLabel>
@@ -74,7 +74,6 @@
           </FormItem>
         </FormField>
       </div>
-      <div class="flex-1"></div>
     </div>
 
     <div v-if="userStore.can('contacts:write')">
@@ -86,6 +85,9 @@
 </template>
 
 <script setup>
+const FIELD_COLUMN_CLASS = 'min-w-0'
+const FIELD_GRID_CLASS = 'grid gap-6 sm:grid-cols-2'
+
 import {
   FormField,
   FormItem,
diff --git a/frontend/apps/main/src/features/conversation/Conversation.vue b/frontend/apps/main/src/features/conversation/Conversation.vue
index b682175d..5c2a4a0a 100644
--- a/frontend/apps/main/src/features/conversation/Conversation.vue
+++ b/frontend/apps/main/src/features/conversation/Conversation.vue
@@ -6,7 +6,7 @@
         <Button
           v-if="isMobile"
           variant="ghost"
-          class="w-11 h-11 md:w-8 md:h-8 p-0 shrink-0 -ml-2 md:-ml-1"
+          class="w-11 h-11 xl:w-8 xl:h-8 p-0 shrink-0 -ml-2 xl:-ml-1"
           :aria-label="t('globals.messages.back')"
           @click="goBackToList"
         >
@@ -18,7 +18,7 @@
         <Button
           v-if="isMobile"
           variant="ghost"
-          class="w-11 h-11 md:w-8 md:h-8 p-0"
+          :class="MOBILE_ICON_BUTTON_CLASS"
           :aria-label="t('globals.terms.contact')"
           @click="emitter.emit(EMITTER_EVENTS.CONVERSATION_SIDEBAR_TOGGLE)"
         >
@@ -39,7 +39,7 @@
           <DropdownMenuTrigger>
             <div
               v-if="conversationStore.current?.status"
-              class="flex items-center space-x-1 cursor-pointer bg-primary px-3 py-3 md:px-2 md:py-1 rounded-md text-sm"
+              class="flex items-center space-x-1 cursor-pointer bg-primary px-3 py-3 xl:px-2 xl:py-1 rounded-md text-sm"
             >
               <span class="text-primary-foreground font-medium inline-block">
                 {{ conversationStore.current?.status }}
@@ -58,7 +58,11 @@
         </DropdownMenu>
         <DropdownMenu>
           <DropdownMenuTrigger as-child>
-            <Button variant="ghost" class="w-11 h-11 md:w-8 md:h-8 p-0">
+            <Button
+              variant="ghost"
+              :class="MOBILE_ICON_BUTTON_CLASS"
+              :aria-label="t('globals.messages.moreActions')"
+            >
               <MoreHorizontal class="w-4 h-4" />
             </Button>
           </DropdownMenuTrigger>
@@ -87,6 +91,8 @@
 </template>
 
 <script setup>
+const MOBILE_ICON_BUTTON_CLASS = 'w-11 h-11 xl:w-8 xl:h-8 p-0'
+
 import { computed, ref, onMounted, onUnmounted } from 'vue'
 import { useConversationStore } from '@main/stores/conversation'
 import { useUserStore } from '@main/stores/user'
diff --git a/frontend/apps/main/src/features/conversation/CreateConversation.vue b/frontend/apps/main/src/features/conversation/CreateConversation.vue
index 5b0c0e54..f59ef6e2 100644
--- a/frontend/apps/main/src/features/conversation/CreateConversation.vue
+++ b/frontend/apps/main/src/features/conversation/CreateConversation.vue
@@ -1,7 +1,7 @@
 <template>
   <div>
     <Dialog v-model:open="dialogOpen">
-      <DialogContent class="max-w-5xl h-[90vh] flex flex-col" >
+      <DialogContent class="max-w-5xl h-[90vh] flex flex-col">
         <DialogHeader>
           <DialogTitle>
             {{ $t('conversation.newConversation') }}
@@ -9,7 +9,11 @@
           <DialogDescription />
         </DialogHeader>
 
-        <form @submit="createConversation" novalidate class="flex flex-col flex-1 overflow-hidden">
+        <form
+          @submit="createConversation"
+          novalidate
+          class="flex flex-col flex-1 min-h-0 overflow-y-auto xl:overflow-hidden"
+        >
           <!-- Form Fields Section -->
           <div class="space-y-4 pb-2 flex-shrink-0">
             <div class="space-y-2">
@@ -67,7 +71,7 @@
               </FormField>
 
               <!-- Name Group -->
-              <div class="grid grid-cols-2 gap-4">
+              <div :class="FIELD_GRID_CLASS">
                 <FormField v-slot="{ componentField }" name="first_name">
                   <FormItem>
                     <FormLabel>{{ $t('globals.terms.firstName') }}</FormLabel>
@@ -101,7 +105,7 @@
               </div>
 
               <!-- Subject and Inbox Group -->
-              <div class="grid grid-cols-2 gap-4">
+              <div :class="FIELD_GRID_CLASS">
                 <FormField v-slot="{ componentField }" name="subject">
                   <FormItem>
                     <FormLabel>{{ $t('globals.terms.subject') }}</FormLabel>
@@ -139,7 +143,7 @@
               </div>
 
               <!-- Assignment Group -->
-              <div class="grid grid-cols-2 gap-4">
+              <div :class="FIELD_GRID_CLASS">
                 <!-- Set assigned team -->
                 <FormField v-slot="{ componentField }" name="team_id">
                   <FormItem>
@@ -172,7 +176,7 @@
           </div>
 
           <!-- Message Editor Section -->
-          <div class="flex-1 flex flex-col min-h-0 mt-4">
+          <div class="flex flex-none flex-col min-h-64 mt-4 xl:flex-1 xl:min-h-0">
             <FormField v-slot="{ componentField }" name="content">
               <FormItem class="flex flex-col h-full">
                 <FormLabel>{{ $t('globals.terms.message') }}</FormLabel>
@@ -181,7 +185,9 @@
                     <Editor
                       v-model:htmlContent="componentField.modelValue"
                       @update:htmlContent="(value) => componentField.onChange(value)"
-                      :placeholder="isCramped ? t('globals.terms.typeMessage') : t('editor.hint.newLineCtrlK')"
+                      :placeholder="
+                        isCramped ? t('globals.terms.typeMessage') : t('editor.hint.newLineCtrlK')
+                      "
                       :insertContent="insertContent"
                       :autoFocus="false"
                       :enableInlineImages="true"
@@ -240,6 +246,8 @@
 </template>
 
 <script setup>
+const FIELD_GRID_CLASS = 'grid grid-cols-1 gap-4 sm:grid-cols-2'
+
 import {
   Dialog,
   DialogContent,
@@ -262,7 +270,7 @@ import {
 import { z } from 'zod'
 import { ref, watch, onUnmounted, nextTick, onMounted, computed } from 'vue'
 import ReplyBoxAttachmentPreview from '@/features/conversation/message/attachment/ReplyBoxAttachmentPreview.vue'
-import { useConversationStore } from '../../stores/conversation'
+import { useConversationStore } from '@main/stores/conversation'
 import MacroActionsPreview from '@/features/conversation/MacroActionsPreview.vue'
 import ReplyBoxMenuBar from '@/features/conversation/ReplyBoxMenuBar.vue'
 import { EMITTER_EVENTS } from '@main/constants/emitterEvents.js'
diff --git a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
index 3e21f9aa..f378e3a7 100644
--- a/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
+++ b/frontend/apps/main/src/views/account/notifications/NotificationPreferences.vue
@@ -42,18 +42,24 @@
         </div>
 
         <div class="border border-border rounded-md divide-y divide-border">
-          <div class="flex items-center px-4 py-2 text-xs font-medium text-muted-foreground">
-            <div class="flex-grow" />
-            <div v-for="channel in channels" :key="channel.key" class="w-20 text-center">
+          <div
+            class="grid grid-cols-3 items-center px-4 py-2 text-xs font-medium text-muted-foreground sm:grid-cols-[minmax(0,1fr)_repeat(3,5rem)]"
+          >
+            <div class="hidden sm:block" />
+            <div v-for="channel in channels" :key="channel.key" class="text-center">
               {{ $t(channel.labelKey) }}
             </div>
           </div>
 
-          <div v-for="row in rows" :key="row.type" class="flex items-center px-4 py-3">
-            <div class="flex-grow pr-4">
+          <div
+            v-for="row in rows"
+            :key="row.type"
+            class="grid grid-cols-3 items-center gap-y-3 px-4 py-3 sm:grid-cols-[minmax(0,1fr)_repeat(3,5rem)]"
+          >
+            <div class="col-span-3 min-w-0 sm:col-span-1 sm:pr-4">
               <p class="text-sm text-foreground">{{ typeLabel(row.type) }}</p>
             </div>
-            <div v-for="channel in channels" :key="channel.key" class="w-20 flex justify-center">
+            <div v-for="channel in channels" :key="channel.key" class="flex justify-center">
               <Switch
                 :checked="row[channel.key]"
                 :disabled="
diff --git a/frontend/apps/main/src/views/admin/templates/TemplateList.vue b/frontend/apps/main/src/views/admin/templates/TemplateList.vue
index 5d2d4f87..00d0ab81 100644
--- a/frontend/apps/main/src/views/admin/templates/TemplateList.vue
+++ b/frontend/apps/main/src/views/admin/templates/TemplateList.vue
@@ -3,31 +3,34 @@
     <div class="flex justify-between mb-5">
       <div></div>
       <div class="flex justify-end mb-4">
-        <Button
-          @click="navigateToNewTemplate"
-          :disabled="templateType !== 'email_outgoing'"
-        >
-          {{
-            $t('template.new')
-          }}
+        <Button @click="navigateToNewTemplate" :disabled="templateType !== 'email_outgoing'">
+          {{ $t('template.new') }}
         </Button>
       </div>
     </div>
     <div>
       <Tabs default-value="email_outgoing" v-model="templateType">
-        <TabsList class="grid w-full grid-cols-2 mb-5">
-          <TabsTrigger value="email_outgoing">
+        <TabsList class="flex w-full justify-start overflow-x-auto mb-5 sm:grid sm:grid-cols-2">
+          <TabsTrigger value="email_outgoing" :class="TEMPLATE_TAB_CLASS">
             {{ $t('admin.template.outgoingEmailTemplates') }}
           </TabsTrigger>
-          <TabsTrigger value="email_notification">
+          <TabsTrigger value="email_notification" :class="TEMPLATE_TAB_CLASS">
             {{ $t('admin.template.emailNotificationTemplates') }}
           </TabsTrigger>
         </TabsList>
         <TabsContent value="email_outgoing">
-          <DataTable :columns="createOutgoingEmailTableColumns(t)" :data="templates" :loading="isLoading" />
+          <DataTable
+            :columns="createOutgoingEmailTableColumns(t)"
+            :data="templates"
+            :loading="isLoading"
+          />
         </TabsContent>
         <TabsContent value="email_notification">
-          <DataTable :columns="createEmailNotificationTableColumns(t)" :data="templates" :loading="isLoading" />
+          <DataTable
+            :columns="createEmailNotificationTableColumns(t)"
+            :data="templates"
+            :loading="isLoading"
+          />
         </TabsContent>
       </Tabs>
     </div>
@@ -35,22 +38,24 @@
 </template>
 
 <script setup>
+const TEMPLATE_TAB_CLASS = 'shrink-0 sm:min-w-0'
+
 import { ref, onMounted, onUnmounted, watch } from 'vue'
 import DataTable from '@main/components/datatable/DataTable.vue'
 import {
   createOutgoingEmailTableColumns,
   createEmailNotificationTableColumns
-} from '../../../features/admin/templates/dataTableColumns.js'
+} from '@main/features/admin/templates/dataTableColumns.js'
 import { Button } from '@shared-ui/components/ui/button'
 import { useRouter } from 'vue-router'
 import LoadingOverlay from '@main/components/layout/LoadingOverlay.vue'
-import { useEmitter } from '../../../composables/useEmitter'
-import { EMITTER_EVENTS } from '../../../constants/emitterEvents.js'
+import { useEmitter } from '@main/composables/useEmitter'
+import { EMITTER_EVENTS } from '@main/constants/emitterEvents.js'
 import { Tabs, TabsContent, TabsList, TabsTrigger } from '@shared-ui/components/ui/tabs'
 import { useStorage } from '@vueuse/core'
 import { useI18n } from 'vue-i18n'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
-import api from '../../../api'
+import api from '@main/api'
 
 const templateType = useStorage('templateType', 'email_outgoing')
 const { t } = useI18n()
diff --git a/frontend/shared-ui/components/ui/sidebar/SidebarMenuSubButton.vue b/frontend/shared-ui/components/ui/sidebar/SidebarMenuSubButton.vue
index ed13315f..7b198fcb 100644
--- a/frontend/shared-ui/components/ui/sidebar/SidebarMenuSubButton.vue
+++ b/frontend/shared-ui/components/ui/sidebar/SidebarMenuSubButton.vue
@@ -20,7 +20,7 @@ const props = defineProps({
     :data-active="isActive"
     :class="
       cn(
-        'flex h-7 min-w-0 items-center gap-2 rounded-md pl-1 text-sidebar-foreground outline-none ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground',
+        'flex h-7 max-xl:h-11 min-w-0 items-center gap-2 rounded-md pl-1 text-sidebar-foreground outline-none ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground',
         'data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground',
         size === 'sm' && 'text-xs',
         size === 'md' && 'text-sm',
diff --git a/frontend/shared-ui/components/ui/sidebar/SidebarTrigger.vue b/frontend/shared-ui/components/ui/sidebar/SidebarTrigger.vue
index 4ef46305..cfb449e8 100644
--- a/frontend/shared-ui/components/ui/sidebar/SidebarTrigger.vue
+++ b/frontend/shared-ui/components/ui/sidebar/SidebarTrigger.vue
@@ -16,7 +16,7 @@ const { toggleSidebar } = useSidebar();
     data-sidebar="trigger"
     variant="ghost"
     size="icon"
-    :class="cn('h-11 w-11 md:h-7 md:w-7', props.class)"
+    :class="cn('h-11 w-11 xl:h-7 xl:w-7', props.class)"
     @click="toggleSidebar"
   >
     <ViewVerticalIcon />
diff --git a/frontend/shared-ui/components/ui/sidebar/index.js b/frontend/shared-ui/components/ui/sidebar/index.js
index 1f9b1ab0..bbec9372 100644
--- a/frontend/shared-ui/components/ui/sidebar/index.js
+++ b/frontend/shared-ui/components/ui/sidebar/index.js
@@ -36,8 +36,8 @@ export const sidebarMenuButtonVariants = cva(
           'bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]',
       },
       size: {
-        default: 'h-8 max-md:h-11 text-sm',
-        sm: 'h-7 text-xs',
+        default: 'h-8 max-xl:h-11 text-sm',
+        sm: 'h-7 max-xl:h-11 text-xs',
         lg: 'h-12 text-sm group-data-[collapsible=icon]:!p-0',
       },
     },
diff --git a/frontend/shared-ui/composables/useIsMobile.js b/frontend/shared-ui/composables/useIsMobile.js
index 3e31e3e0..0ff28dbf 100644
--- a/frontend/shared-ui/composables/useIsMobile.js
+++ b/frontend/shared-ui/composables/useIsMobile.js
@@ -1,6 +1,6 @@
 import { useMediaQuery } from '@vueuse/core'
 
-// 767px is the exact complement of Tailwind's `md:` (min-width: 768px).
-export function useIsMobile () {
-  return useMediaQuery('(max-width: 767px)')
+// 1279px is the exact complement of Tailwind's `xl:` (min-width: 1280px).
+export function useIsMobile() {
+  return useMediaQuery('(max-width: 1279px)')
 }
diff --git a/i18n/en-US.json b/i18n/en-US.json
index d8904399..74eef153 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -862,6 +862,7 @@
   "globals.messages.exportData": "Export data",
   "globals.messages.false": "False",
   "globals.messages.fileTypeisNotAnImage": "File type is not an image",
+  "globals.messages.firstPage": "First page",
   "globals.messages.goBack": "Go back",
   "globals.messages.golangDurationHoursMinutes": "Duration in hours or minutes. Example: 1h, 30m, 1h30m",
   "globals.messages.gradientEnd": "Gradient end",
@@ -875,16 +876,19 @@
   "globals.messages.insertExample": "Insert example",
   "globals.messages.invalidFilters": "Invalid filters.",
   "globals.messages.invite": "Invite",
+  "globals.messages.lastPage": "Last page",
   "globals.messages.lastUsed": "Last used",
   "globals.messages.linkUrl": "Link URL",
   "globals.messages.markAllAsRead": "Mark all as read",
   "globals.messages.markAsRead": "Mark as read",
   "globals.messages.markAsUnread": "Mark as unread",
   "globals.messages.maxLength": "Must be at most {max} characters",
+  "globals.messages.moreActions": "More actions",
   "globals.messages.fieldTooLong": "`{field}` must be at most {max} characters.",
   "globals.messages.mustBeNumber": "Must be a number",
   "globals.messages.nDays": "{days} days",
   "globals.messages.new": "New",
+  "globals.messages.nextPage": "Next page",
   "globals.messages.moveUp": "Move up",
   "globals.messages.moveDown": "Move down",
   "globals.messages.no": "No",
@@ -900,6 +904,7 @@
   "globals.messages.pickDateAndTime": "Pick date and time",
   "globals.messages.pleaseRateConversation": "Please rate this conversation:",
   "globals.messages.pleaseSelect": "Please select {name} before submitting",
+  "globals.messages.previousPage": "Previous page",
   "globals.messages.pressEnterToSelectAValue": "Press enter to select a value",
   "globals.messages.publish": "Publish",
   "globals.messages.reassigning": "Reassigning",

From c4d809daf7255e2e268e6578546f244d259839c3 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 13:52:50 +0530
Subject: [PATCH 091/178] improve pagination accessibility

---
 .../src/components/pagination/PaginationBar.vue     | 13 +++++++------
 i18n/en-US.json                                     |  1 +
 2 files changed, 8 insertions(+), 6 deletions(-)

diff --git a/frontend/apps/main/src/components/pagination/PaginationBar.vue b/frontend/apps/main/src/components/pagination/PaginationBar.vue
index 206e6c2f..34a61807 100644
--- a/frontend/apps/main/src/components/pagination/PaginationBar.vue
+++ b/frontend/apps/main/src/components/pagination/PaginationBar.vue
@@ -17,7 +17,7 @@
         </Select>
       </div>
 
-      <div class="flex items-center gap-1">
+      <nav class="flex items-center gap-1" :aria-label="t('globals.terms.pagination')">
         <Button
           type="button"
           variant="ghost"
@@ -27,7 +27,7 @@
           :disabled="page <= 1"
           @click="goToPage(1)"
         >
-          <ChevronsLeft class="h-4 w-4" />
+          <ChevronsLeft class="h-4 w-4" aria-hidden="true" />
         </Button>
         <Button
           type="button"
@@ -38,13 +38,14 @@
           :disabled="page <= 1"
           @click="goToPage(page - 1)"
         >
-          <ChevronLeft class="h-4 w-4" />
+          <ChevronLeft class="h-4 w-4" aria-hidden="true" />
         </Button>
 
         <div class="flex items-center bg-muted rounded-lg p-1">
           <template v-for="pageNumber in visiblePages" :key="pageNumber">
             <span
               v-if="pageNumber === '...'"
+              aria-hidden="true"
               class="flex items-center justify-center h-7 w-7 text-sm text-muted-foreground select-none"
             >
               ...
@@ -76,7 +77,7 @@
           :disabled="page >= totalPages"
           @click="goToPage(page + 1)"
         >
-          <ChevronRight class="h-4 w-4" />
+          <ChevronRight class="h-4 w-4" aria-hidden="true" />
         </Button>
         <Button
           type="button"
@@ -87,9 +88,9 @@
           :disabled="page >= totalPages"
           @click="goToPage(totalPages)"
         >
-          <ChevronsRight class="h-4 w-4" />
+          <ChevronsRight class="h-4 w-4" aria-hidden="true" />
         </Button>
-      </div>
+      </nav>
     </div>
   </div>
 </template>
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 74eef153..f8a4e8df 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -1100,6 +1100,7 @@
   "globals.terms.overdue": "Overdue",
   "globals.terms.overview": "Overview",
   "globals.terms.page": "Page | Pages",
+  "globals.terms.pagination": "Pagination",
   "globals.terms.participant": "Participant | Participants",
   "globals.terms.password": "Password | Passwords",
   "globals.terms.paused": "Paused",

From 7d77754b52b5a523f3020c1028f824cb97812a78 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 16:09:15 +0530
Subject: [PATCH 092/178] improve live chat widget flows

Expand widget conversations with audience-specific forms, AI handoffs, message previews, and help article translations. Keep existing inbox settings compatible and reject invalid live chat configuration.
---
 cmd/chat.go                                   |  162 ++-
 cmd/chat_test.go                              |   81 ++
 cmd/handlers.go                               |    1 +
 cmd/helpcenter.go                             |   11 +-
 cmd/inboxes.go                                |   38 +-
 cmd/inboxes_test.go                           |   32 +
 cmd/init.go                                   |    6 +-
 cmd/main.go                                   |    4 +-
 cmd/widget_help.go                            |    9 +-
 .../admin/help-center/ArticleEditSheet.vue    |  208 +++-
 .../admin/help-center/CollectionEditSheet.vue |   12 +-
 .../admin/help-center/articleFormSchema.js    |    8 +-
 .../help-center/articleFormSchema.test.js     |  186 +--
 .../admin/help-center/collectionFormSchema.js |    2 +-
 .../help-center/collectionFormSchema.test.js  |  108 +-
 .../admin/help-center/helpCenterFormSchema.js |    3 +
 .../help-center/helpCenterFormSchema.test.js  |  517 ++++----
 .../admin/inbox/LivechatInboxForm.vue         |  743 ++++++++---
 .../admin/inbox/LivechatWidgetPreview.vue     |  183 ++-
 .../admin/inbox/PreChatFormConfig.vue         |  320 +++--
 .../features/admin/inbox/WidgetCampaigns.vue  |  327 +++--
 .../features/admin/inbox/WidgetConditions.vue |   35 +-
 .../features/admin/inbox/WidgetHelpConfig.vue |    2 +-
 .../admin/inbox/livechatFormSchema.js         |  474 +++++--
 .../admin/inbox/livechatFormSchema.test.js    | 1108 ++++++++++++-----
 .../admin/inbox/useHelpCenterArticles.test.js |  116 ++
 .../admin/help-center/HelpCenterTree.vue      |   51 +-
 .../apps/main/src/views/search/SearchView.vue |    2 +-
 frontend/apps/widget/src/App.vue              |    5 +-
 frontend/apps/widget/src/api/index.js         |  255 ++--
 .../src/components/AnnouncementCard.vue       |   16 +-
 .../widget/src/components/ArticleReader.vue   |   12 +-
 .../widget/src/components/ChatMessages.vue    |  257 ++--
 .../src/components/HomeExternalLink.vue       |   16 +-
 .../apps/widget/src/components/HomeHeader.vue |   25 +-
 .../apps/widget/src/components/HomeHelp.vue   |   28 +-
 .../widget/src/components/MessageInput.vue    |   63 +-
 .../widget/src/components/PreChatForm.vue     |  140 ++-
 .../src/components/ProactiveMessage.vue       |   12 +
 .../src/components/RecentConversationCard.vue |    6 +-
 .../widget/src/components/ReplyButtons.vue    |   27 +
 .../src/composables/useReplyPreviews.js       |   95 +-
 .../apps/widget/src/layouts/MainLayout.vue    |   23 +-
 frontend/apps/widget/src/store/chat.js        |  528 ++++----
 frontend/apps/widget/src/store/help.js        |   15 +
 frontend/apps/widget/src/utils/preChatForm.js |   11 +
 .../apps/widget/src/utils/preChatForm.test.js |   62 +
 frontend/apps/widget/src/views/ChatView.vue   |   71 +-
 frontend/apps/widget/src/views/HelpView.vue   |  166 ++-
 frontend/apps/widget/src/views/HomeView.vue   |   24 +-
 .../shared-ui/components/PhoneNumberInput.vue |   31 +-
 i18n/en-US.json                               |   23 +-
 internal/aiagent/aiagent.go                   |    5 +-
 internal/aiagent/prompt.go                    |    3 +-
 internal/aiagent/tools.go                     |    4 +
 internal/aiagent/worker.go                    |  104 +-
 internal/aiagent/worker_test.go               |   24 +
 internal/conversation/conversation.go         |   33 +
 internal/conversation/models/models.go        |    1 +
 internal/conversation/queries.sql             |   52 +
 .../helpcenter/article_translation_test.go    |   58 +
 internal/helpcenter/helpcenter.go             |   42 +-
 internal/helpcenter/models/models.go          |   56 +-
 internal/helpcenter/queries.sql               |   39 +-
 internal/inbox/channel/livechat/livechat.go   |   95 +-
 .../inbox/channel/livechat/livechat_test.go   |   59 +
 .../channel/livechat/proactive/eligibility.go |    3 +
 .../livechat/proactive/eligibility_test.go    |   19 +
 internal/migrations/v2.10.0.go                |   20 +
 internal/migrations/v2.10.0_test.go           |   59 +-
 schema.sql                                    |    2 +
 static/widget.js                              |   15 +-
 72 files changed, 5288 insertions(+), 2065 deletions(-)
 create mode 100644 cmd/chat_test.go
 create mode 100644 cmd/inboxes_test.go
 create mode 100644 frontend/apps/main/src/features/admin/inbox/useHelpCenterArticles.test.js
 create mode 100644 frontend/apps/widget/src/components/ProactiveMessage.vue
 create mode 100644 frontend/apps/widget/src/components/ReplyButtons.vue
 create mode 100644 frontend/apps/widget/src/utils/preChatForm.js
 create mode 100644 frontend/apps/widget/src/utils/preChatForm.test.js
 create mode 100644 internal/aiagent/worker_test.go
 create mode 100644 internal/helpcenter/article_translation_test.go
 create mode 100644 internal/inbox/channel/livechat/livechat_test.go

diff --git a/cmd/chat.go b/cmd/chat.go
index 08a04dd8..62f0c9f7 100644
--- a/cmd/chat.go
+++ b/cmd/chat.go
@@ -1,6 +1,7 @@
 package main
 
 import (
+	"cmp"
 	"context"
 	"crypto/rand"
 	"encoding/base64"
@@ -21,8 +22,8 @@ import (
 	cmodels "github.com/abhinavxd/libredesk/internal/conversation/models"
 	"github.com/abhinavxd/libredesk/internal/envelope"
 	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat"
-	imodels "github.com/abhinavxd/libredesk/internal/inbox/models"
 	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat/proactive"
+	imodels "github.com/abhinavxd/libredesk/internal/inbox/models"
 	"github.com/abhinavxd/libredesk/internal/stringutil"
 	umodels "github.com/abhinavxd/libredesk/internal/user/models"
 	realip "github.com/ferluci/fast-realip"
@@ -89,6 +90,10 @@ type chatInitReq struct {
 	FormData   map[string]any `json:"form_data"`
 }
 
+type handoffFormReq struct {
+	FormData map[string]any `json:"form_data"`
+}
+
 type chatSettingsResponse struct {
 	Campaigns    *struct{} `json:"campaigns,omitempty"`
 	HasCampaigns bool      `json:"has_campaigns"`
@@ -133,10 +138,20 @@ func handleGetChatSettings(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, err.Error(), nil))
 	}
+	if config.Previews.Content == "" {
+		config.Previews.Desktop = true
+		config.Previews.Mobile = true
+		config.Previews.Content = "message"
+	}
+	customAttributes := map[int]customAttributeWidget(nil)
+	if config.PreChatForm.Enabled {
+		config, customAttributes = filterPreChatForms(config, app)
+	}
 
 	response := chatSettingsResponse{
-		Config:       config,
-		HasCampaigns: slices.ContainsFunc(config.Campaigns, func(c proactive.Campaign) bool { return c.Enabled }),
+		Config:           config,
+		HasCampaigns:     slices.ContainsFunc(config.Campaigns, func(c proactive.Campaign) bool { return c.Enabled }),
+		CustomAttributes: customAttributes,
 	}
 
 	// Get business hours data if office hours feature is enabled.
@@ -169,15 +184,6 @@ func handleGetChatSettings(r *fastglue.Request) error {
 		}
 	}
 
-	// Filter out pre-chat form fields for which custom attributes don't exist anymore.
-	if config.PreChatForm.Enabled && len(config.PreChatForm.Fields) > 0 {
-		filteredFields, customAttributes := filterPreChatFormFields(config.PreChatForm.Fields, app)
-		response.PreChatForm.Fields = filteredFields
-		if len(customAttributes) > 0 {
-			response.CustomAttributes = customAttributes
-		}
-	}
-
 	return r.SendEnvelope(response)
 }
 
@@ -217,9 +223,10 @@ func handleChatInit(r *fastglue.Request) error {
 	if err != nil {
 		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, app.i18n.T("globals.messages.somethingWentWrong"), nil, envelope.GeneralError)
 	}
+	initialConfig := resolveInitialChatConfig(config, getWidgetIsVisitor(r))
 
 	if req.DeliveryID != "" {
-		return handleWidgetCampaignReply(r, req, inbox, config)
+		return handleWidgetCampaignReply(r, req, inbox, initialConfig)
 	}
 
 	// Check if user is already authenticated (has session token).
@@ -229,11 +236,11 @@ func handleChatInit(r *fastglue.Request) error {
 		// Custom attributes from JWT were already saved during /auth/exchange.
 		// Only process form-level attributes here.
 		isVisitor = getWidgetIsVisitor(r)
-		conversationAttrs = saveContactAttrsAndCollectConvoAttrs(app, contactID, nil, req.FormData, config)
+		conversationAttrs = saveContactAttrsAndCollectConvoAttrs(app, contactID, nil, req.FormData, initialConfig)
 	} else {
 		// New visitor - create visitor and session token.
 		isVisitor = true
-		visitor, newSessionToken, conversationAttrs, err = createVisitorContact(app, req.FormData, config, inbox)
+		visitor, newSessionToken, conversationAttrs, err = createVisitorContact(app, req.FormData, initialConfig, inbox)
 		if err != nil {
 			return sendErrorEnvelope(r, err)
 		}
@@ -520,6 +527,18 @@ func handleGetConversations(r *fastglue.Request) error {
 		app.lo.Error("error fetching conversations for contact", "contact_id", contactID, "error", err)
 		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, app.i18n.T("globals.messages.somethingWentWrong"), nil, envelope.GeneralError)
 	}
+	unreadMessages, err := app.conversation.GetContactUnreadPreviewMessages(contactID, inbox.ID, 3)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	for _, message := range unreadMessages {
+		for i := range chatConversations {
+			if chatConversations[i].UUID == message.ConversationUUID {
+				chatConversations[i].UnreadMessages = append(chatConversations[i].UnreadMessages, message)
+				break
+			}
+		}
+	}
 
 	return r.SendEnvelope(chatConversations)
 }
@@ -576,6 +595,63 @@ func handleChatSendMessage(r *fastglue.Request) error {
 	return sendChatMessageResponse(app, r, message.UUID)
 }
 
+func handleChatSubmitHandoffForm(r *fastglue.Request) error {
+	var (
+		app              = r.Context.(*App)
+		conversationUUID = r.RequestCtx.UserValue("uuid").(string)
+		req              handoffFormReq
+	)
+	if err := r.Decode(&req, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("errors.parsingRequest"), nil, envelope.InputError)
+	}
+	contactID, conversation, err := getContactConversation(r, conversationUUID)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	config, err := getWidgetConfig(r)
+	if err != nil {
+		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.T("globals.messages.somethingWentWrong"), nil))
+	}
+	config = config.ResolvePreChatForm(getWidgetIsVisitor(r))
+	if !config.PreChatForm.Enabled || !config.PreChatForm.HandoffOnly {
+		return r.SendErrorEnvelope(fasthttp.StatusConflict, app.i18n.T("ai.agent.handoffFormUnavailable"), nil, envelope.ConflictError)
+	}
+	if err := validateRequiredFormFields(req.FormData, config, app); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	contact, err := app.user.GetContactOrVisitor(contactID, "")
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	name, email, phone, countryCode, err := validateFormData(app, req.FormData, config, nil)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	name = cmp.Or(name, contact.FirstName)
+	email = cmp.Or(email, contact.Email.String)
+	phone = cmp.Or(phone, contact.PhoneNumber.String)
+	countryCode = cmp.Or(countryCode, contact.PhoneNumberCountryCode.String)
+	if name != "" || email != "" || phone != "" {
+		if err := app.user.UpdateContactBasicInfo(contactID, name, contact.LastName, email, phone, countryCode); err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+	}
+	conversationAttrs := saveContactAttrsAndCollectConvoAttrs(app, contactID, nil, req.FormData, config)
+	if len(conversationAttrs) > 0 {
+		merged := make(map[string]any)
+		_ = json.Unmarshal(conversation.CustomAttributes, &merged)
+		maps.Copy(merged, conversationAttrs)
+		if err := app.conversation.UpdateConversationCustomAttributes(conversation.UUID, merged); err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+	}
+	if err := app.aiAgent.CompleteHandoff(conversation); err != nil {
+		app.lo.Error("error completing AI handoff form", "conversation_uuid", conversation.UUID, "error", err)
+		return r.SendErrorEnvelope(fasthttp.StatusConflict, app.i18n.T("ai.agent.handoffFormUnavailable"), nil, envelope.ConflictError)
+	}
+	return r.SendEnvelope(map[string]bool{"handed_off": true})
+}
+
 // handleWidgetMediaUpload handles media uploads for the widget.
 func handleWidgetMediaUpload(r *fastglue.Request) error {
 	app := r.Context.(*App)
@@ -1221,6 +1297,19 @@ func validateFormData(app *App, formData map[string]any, config livechat.Config,
 	return finalName, finalEmail, finalPhone, finalPhoneCountryCode, nil
 }
 
+func validateRequiredFormFields(formData map[string]any, config livechat.Config, app *App) error {
+	for _, field := range config.PreChatForm.Fields {
+		if !field.Enabled || !field.Required || field.Type == "checkbox" {
+			continue
+		}
+		value, exists := formData[field.Key]
+		if !exists || !isFormFieldValuePresent(field, value) {
+			return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.required", "name", field.Label), nil)
+		}
+	}
+	return nil
+}
+
 func resolveFormField(formData map[string]any, key, existing string) string {
 	if existing != "" {
 		return existing
@@ -1231,6 +1320,28 @@ func resolveFormField(formData map[string]any, key, existing string) string {
 	return ""
 }
 
+func isFormFieldValuePresent(field livechat.PreChatFormField, value any) bool {
+	switch field.Type {
+	case "checkbox":
+		_, ok := value.(bool)
+		return ok
+	case "number":
+		number, ok := value.(float64)
+		return ok && !math.IsNaN(number) && !math.IsInf(number, 0)
+	default:
+		text, ok := value.(string)
+		return ok && strings.TrimSpace(text) != ""
+	}
+}
+
+func resolveInitialChatConfig(config livechat.Config, isVisitor bool) livechat.Config {
+	config = config.ResolvePreChatForm(isVisitor)
+	if config.PreChatForm.HandoffOnly {
+		config.PreChatForm.Enabled = false
+	}
+	return config
+}
+
 // filterPreChatFormFields filters out pre-chat form fields that reference non-existent custom attributes while retaining the default fields
 func filterPreChatFormFields(fields []livechat.PreChatFormField, app *App) ([]livechat.PreChatFormField, map[int]customAttributeWidget) {
 	if len(fields) == 0 {
@@ -1286,6 +1397,27 @@ func filterPreChatFormFields(fields []livechat.PreChatFormField, app *App) ([]li
 	return filteredFields, existingCustomAttrs
 }
 
+func filterPreChatForms(config livechat.Config, app *App) (livechat.Config, map[int]customAttributeWidget) {
+	customAttributes := make(map[int]customAttributeWidget)
+	filter := func(fields []livechat.PreChatFormField) []livechat.PreChatFormField {
+		filtered, attributes := filterPreChatFormFields(fields, app)
+		maps.Copy(customAttributes, attributes)
+		return filtered
+	}
+
+	config.PreChatForm.Fields = filter(config.PreChatForm.Fields)
+	if config.PreChatForm.Visitors != nil && config.PreChatForm.Visitors.Fields != nil {
+		config.PreChatForm.Visitors.Fields = filter(config.PreChatForm.Visitors.Fields)
+	}
+	if config.PreChatForm.Users != nil && config.PreChatForm.Users.Fields != nil {
+		config.PreChatForm.Users.Fields = filter(config.PreChatForm.Users.Fields)
+	}
+	if len(customAttributes) == 0 {
+		return config, nil
+	}
+	return config, customAttributes
+}
+
 // getSessionDuration returns the configured session TTL for authenticated users.
 // Falls back to defaultSessionTTL if the config value is empty or invalid.
 // Enforces a minimum of 1 hour.
diff --git a/cmd/chat_test.go b/cmd/chat_test.go
new file mode 100644
index 00000000..7bcb1f81
--- /dev/null
+++ b/cmd/chat_test.go
@@ -0,0 +1,81 @@
+package main
+
+import (
+	"math"
+	"testing"
+
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat"
+)
+
+func TestIsFormFieldValuePresent(t *testing.T) {
+	tests := []struct {
+		name  string
+		field livechat.PreChatFormField
+		value any
+		want  bool
+	}{
+		{name: "text", field: livechat.PreChatFormField{Type: "text"}, value: "answer", want: true},
+		{name: "blank text", field: livechat.PreChatFormField{Type: "text"}, value: "  "},
+		{name: "wrong text type", field: livechat.PreChatFormField{Type: "text"}, value: []string{"answer"}},
+		{name: "number", field: livechat.PreChatFormField{Type: "number"}, value: float64(0), want: true},
+		{name: "invalid number", field: livechat.PreChatFormField{Type: "number"}, value: math.NaN()},
+		{name: "checkbox", field: livechat.PreChatFormField{Type: "checkbox"}, value: false, want: true},
+	}
+	for _, tc := range tests {
+		t.Run(tc.name, func(t *testing.T) {
+			if got := isFormFieldValuePresent(tc.field, tc.value); got != tc.want {
+				t.Fatalf("got %v, want %v", got, tc.want)
+			}
+		})
+	}
+}
+
+func TestInitialChatConfigDisablesHandoffOnlyForm(t *testing.T) {
+	var config livechat.Config
+	config.PreChatForm.Enabled = true
+	config.PreChatForm.HandoffOnly = true
+
+	initial := resolveInitialChatConfig(config, true)
+	if initial.PreChatForm.Enabled {
+		t.Fatal("handoff-only form remained enabled for initial chat")
+	}
+	if !config.PreChatForm.Enabled {
+		t.Fatal("input config was mutated")
+	}
+}
+
+func TestInitialChatConfigUsesAudienceSetting(t *testing.T) {
+	var config livechat.Config
+	config.PreChatForm.Enabled = true
+	showVisitors := true
+	showUsers := false
+	config.PreChatForm.Visitors = &livechat.AudiencePreChatFormConfig{Enabled: &showVisitors}
+	config.PreChatForm.Users = &livechat.AudiencePreChatFormConfig{Enabled: &showUsers}
+
+	if !resolveInitialChatConfig(config, true).PreChatForm.Enabled {
+		t.Fatal("visitor pre-chat form was disabled")
+	}
+	if resolveInitialChatConfig(config, false).PreChatForm.Enabled {
+		t.Fatal("user pre-chat form remained enabled")
+	}
+}
+
+func TestValidateHandoffFormUsesSubmittedContactDetails(t *testing.T) {
+	var config livechat.Config
+	config.PreChatForm.Enabled = true
+	config.PreChatForm.Fields = []livechat.PreChatFormField{{
+		Key:       "name",
+		Type:      "text",
+		Enabled:   true,
+		Required:  true,
+		IsDefault: true,
+	}}
+
+	name, _, _, _, err := validateFormData(nil, map[string]any{"name": "QA Visitor"}, config, nil)
+	if err != nil {
+		t.Fatalf("unexpected error: %v", err)
+	}
+	if name != "QA Visitor" {
+		t.Fatalf("got name %q", name)
+	}
+}
diff --git a/cmd/handlers.go b/cmd/handlers.go
index f42aa2be..11cda28c 100644
--- a/cmd/handlers.go
+++ b/cmd/handlers.go
@@ -387,6 +387,7 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 	g.GET("/api/v1/widget/chat/conversations/{uuid}", rateLimit(widgetAuth(handleChatGetConversation), "widget"))
 	g.GET("/api/v1/widget/chat/conversations/{uuid}/transcript", rateLimit(widgetAuth(handleWidgetTranscript), "widget"))
 	g.POST("/api/v1/widget/chat/conversations/{uuid}/message", rateLimit(widgetAuth(handleChatSendMessage), "widget"))
+	g.POST("/api/v1/widget/chat/conversations/{uuid}/handoff-form", rateLimit(widgetAuth(handleChatSubmitHandoffForm), "widget"))
 	g.POST("/api/v1/widget/media/upload", rateLimit(widgetAuth(handleWidgetMediaUpload), "widget"))
 
 	// getAndHead registers both methods: uptime checkers and link validators probe with HEAD.
diff --git a/cmd/helpcenter.go b/cmd/helpcenter.go
index b5391334..8d43ac3b 100644
--- a/cmd/helpcenter.go
+++ b/cmd/helpcenter.go
@@ -138,6 +138,11 @@ type localeLink struct {
 	Path   string
 }
 
+type helpArticleResponse struct {
+	hcmodels.Article
+	Translations []hcmodels.ArticleTranslation `json:"translations"`
+}
+
 type previewTOCItem struct {
 	ID    string
 	Title string
@@ -445,7 +450,11 @@ func handleGetArticle(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(article)
+	translations, err := app.helpcenter.GetArticleTranslations(id)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(helpArticleResponse{Article: article, Translations: translations})
 }
 
 // handleCreateArticle creates a new article.
diff --git a/cmd/inboxes.go b/cmd/inboxes.go
index 8607317f..88559b8b 100644
--- a/cmd/inboxes.go
+++ b/cmd/inboxes.go
@@ -212,6 +212,9 @@ func validateInbox(app *App, inbox imodels.Inbox) error {
 		if err := json.Unmarshal(inbox.Config, &config); err != nil {
 			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
 		}
+		if err := validateLiveChatSessionDuration(app, config.SessionDuration); err != nil {
+			return err
+		}
 		if err := validateWidgetFeatures(app, config); err != nil {
 			return err
 		}
@@ -255,6 +258,12 @@ func validateInbox(app *App, inbox imodels.Inbox) error {
 			}
 		}
 
+		for _, replies := range [][]string{config.QuickReplies, config.Visitors.QuickReplies, config.Users.QuickReplies} {
+			if err := validateQuickReplies(app, replies); err != nil {
+				return err
+			}
+		}
+
 		// Validate colors.
 		hexColorRegex := regexp.MustCompile(`^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$`)
 		if config.Colors.Primary == "" {
@@ -275,12 +284,11 @@ func validateInbox(app *App, inbox imodels.Inbox) error {
 			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
 		}
 
-		// Validate home apps.
 		for _, ha := range config.HomeApps {
 			if ha.URL != "" && !httputil.IsValidHTTPURL(ha.URL) {
 				return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidUrl"), nil)
 			}
-			if ha.Type == livechat.HomeAppAnnouncement && ha.ImageURL != "" && !httputil.IsValidHTTPURL(ha.ImageURL) {
+			if ha.ImageURL != "" && !httputil.IsValidHTTPURL(ha.ImageURL) {
 				return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidUrl"), nil)
 			}
 		}
@@ -347,6 +355,32 @@ func validateInbox(app *App, inbox imodels.Inbox) error {
 	return nil
 }
 
+func validateQuickReplies(app *App, replies []string) error {
+	if len(replies) > 6 {
+		return envelope.NewError(envelope.InputError, app.i18n.T("admin.inbox.livechat.quickReplies.limit"), nil)
+	}
+	for _, reply := range replies {
+		if strings.TrimSpace(reply) == "" || len(reply) > 120 {
+			return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.maxLength", "max", "120"), nil)
+		}
+	}
+	return nil
+}
+
+func validateLiveChatSessionDuration(app *App, value string) error {
+	if value == "" {
+		return nil
+	}
+	duration, err := time.ParseDuration(value)
+	if err != nil {
+		return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidDuration"), nil)
+	}
+	if duration < time.Hour {
+		return envelope.NewError(envelope.InputError, app.i18n.Ts("validation.minDuration", "name", "session_duration", "min", "1h"), nil)
+	}
+	return nil
+}
+
 // validateEmailConfig validates the email inbox configuration.
 func validateEmailConfig(app *App, configJSON json.RawMessage) error {
 	var cfg imodels.Config
diff --git a/cmd/inboxes_test.go b/cmd/inboxes_test.go
new file mode 100644
index 00000000..aa58b96c
--- /dev/null
+++ b/cmd/inboxes_test.go
@@ -0,0 +1,32 @@
+package main
+
+import "testing"
+
+func TestValidateLiveChatSessionDuration(t *testing.T) {
+	app := newValidatorTestApp(t)
+	tests := []struct {
+		name    string
+		value   string
+		wantErr bool
+	}{
+		{name: "legacy empty"},
+		{name: "one hour", value: "1h"},
+		{name: "one hour in minutes", value: "60m"},
+		{name: "one hour in seconds", value: "3600s"},
+		{name: "combined duration", value: "1h30m"},
+		{name: "zero", value: "0", wantErr: true},
+		{name: "below one hour", value: "59m59s", wantErr: true},
+		{name: "below one hour in seconds", value: "3599s", wantErr: true},
+		{name: "negative", value: "-1h", wantErr: true},
+		{name: "invalid", value: "soon", wantErr: true},
+	}
+
+	for _, tc := range tests {
+		t.Run(tc.name, func(t *testing.T) {
+			err := validateLiveChatSessionDuration(app, tc.value)
+			if (err != nil) != tc.wantErr {
+				t.Fatalf("got error %v, want error %v", err, tc.wantErr)
+			}
+		})
+	}
+}
diff --git a/cmd/init.go b/cmd/init.go
index 586ba1d5..16adb1c7 100644
--- a/cmd/init.go
+++ b/cmd/init.go
@@ -33,6 +33,7 @@ import (
 	"github.com/abhinavxd/libredesk/internal/inbox"
 	"github.com/abhinavxd/libredesk/internal/inbox/channel/email"
 	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat/proactive"
 	imodels "github.com/abhinavxd/libredesk/internal/inbox/models"
 	"github.com/abhinavxd/libredesk/internal/macro"
 	"github.com/abhinavxd/libredesk/internal/media"
@@ -42,7 +43,6 @@ import (
 	notificationchannels "github.com/abhinavxd/libredesk/internal/notification/channels"
 	emailnotifier "github.com/abhinavxd/libredesk/internal/notification/providers/email"
 	"github.com/abhinavxd/libredesk/internal/oidc"
-	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat/proactive"
 	"github.com/abhinavxd/libredesk/internal/ratelimit"
 	"github.com/abhinavxd/libredesk/internal/report"
 	"github.com/abhinavxd/libredesk/internal/role"
@@ -1046,7 +1046,7 @@ func initHelpCenter(db *sqlx.DB, i18n *i18n.I18n, indexer helpcenter.ArticleInde
 }
 
 // initAIAgent inits the autonomous AI agent manager.
-func initAIAgent(db *sqlx.DB, i18n *i18n.I18n, aiManager *ai.Manager, convo *conversation.Manager, mediaManager *media.Manager, settingManager *setting.Manager, userManager *user.Manager, notifierService *notifier.Service, rdb *redis.Client) *aiagent.Manager {
+func initAIAgent(db *sqlx.DB, i18n *i18n.I18n, aiManager *ai.Manager, convo *conversation.Manager, inboxManager *inbox.Manager, mediaManager *media.Manager, settingManager *setting.Manager, userManager *user.Manager, notifierService *notifier.Service, rdb *redis.Client) *aiagent.Manager {
 	m, err := aiagent.New(aiagent.Opts{
 		DB:                 db,
 		Lo:                 initLogger("ai_agent"),
@@ -1054,7 +1054,7 @@ func initAIAgent(db *sqlx.DB, i18n *i18n.I18n, aiManager *ai.Manager, convo *con
 		QueueSize:          cmp.Or(ko.Int("ai_agent.queue_size"), 1000),
 		MaxSteps:           min(max(cmp.Or(ko.Int("ai_agent.max_steps"), 6), 1), 20),
 		MaxHistoryMessages: min(max(cmp.Or(ko.Int("ai_agent.max_history_messages"), 30), 5), 100),
-	}, aiManager, convo, mediaManager, settingManager, userManager, notifierService, rdb)
+	}, aiManager, convo, inboxManager, mediaManager, settingManager, userManager, notifierService, rdb)
 	if err != nil {
 		log.Fatalf("error initializing AI agent manager: %v", err)
 	}
diff --git a/cmd/main.go b/cmd/main.go
index 24a95ea8..61a01046 100644
--- a/cmd/main.go
+++ b/cmd/main.go
@@ -26,9 +26,9 @@ import (
 	"github.com/abhinavxd/libredesk/internal/colorlog"
 	"github.com/abhinavxd/libredesk/internal/csat"
 	customAttribute "github.com/abhinavxd/libredesk/internal/custom_attribute"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat/proactive"
 	"github.com/abhinavxd/libredesk/internal/macro"
 	notifier "github.com/abhinavxd/libredesk/internal/notification"
-	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat/proactive"
 	"github.com/abhinavxd/libredesk/internal/report"
 	"github.com/abhinavxd/libredesk/internal/search"
 	"github.com/abhinavxd/libredesk/internal/sla"
@@ -261,7 +261,7 @@ func main() {
 		ai                          = initAI(ctx, db, i18n, ssrfControl)
 		sla                         = initSLA(db, team, settings, businessHours, template, user, i18n, notifDispatcher)
 		conversation                = initConversations(i18n, sla, status, priority, wsHub, db, inbox, user, team, media, settings, csat, automation, template, webhook, notifDispatcher)
-		aiAgent                     = initAIAgent(db, i18n, ai, conversation, media, settings, user, notifier, rdb)
+		aiAgent                     = initAIAgent(db, i18n, ai, conversation, inbox, media, settings, user, notifier, rdb)
 		helpCenter                  = initHelpCenter(db, i18n, ai)
 		autoassigner                = initAutoAssigner(team, user, conversation)
 		rateLimiter                 = initRateLimit(rdb)
diff --git a/cmd/widget_help.go b/cmd/widget_help.go
index b3bc9e73..ebfcf75c 100644
--- a/cmd/widget_help.go
+++ b/cmd/widget_help.go
@@ -52,7 +52,8 @@ func handleWidgetHelp(r *fastglue.Request) error {
 	config, _ := getWidgetConfig(r)
 	return r.SendEnvelope(map[string]any{
 		"slug": helpCenter.Slug, "name": helpCenter.Name, "locale": locale,
-		"tree": tree.Tree, "popular": popular, "audience": audience,
+		"url":  helpCenterBaseURL(app, helpCenter) + helpCenterPathPrefix(helpCenter),
+		"tree": tree.Tree, "popular": popular, "audience": audience, "locales": helpCenterLocales(helpCenter),
 		"featured_ids": config.Help.FeaturedIDs,
 	})
 }
@@ -97,8 +98,12 @@ func handleWidgetHelpArticle(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 	hideArticleAuthor(helpCenterTheme(helpCenter), &article)
+	translations, err := app.helpcenter.GetPublishedArticleTranslations(helpCenter.Slug, article.ID)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
 	app.helpcenter.IncrementArticleViewCount(article.ID)
-	return r.SendEnvelope(article)
+	return r.SendEnvelope(helpArticleResponse{Article: article, Translations: translations})
 }
 
 func widgetHelpCenter(r *fastglue.Request) (hcmodels.HelpCenter, livechat.HelpAudience, error) {
diff --git a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
index 7ca262c5..dbd04401 100644
--- a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
+++ b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
@@ -5,11 +5,20 @@
         <div class="flex items-center justify-between p-6 border-b bg-card/50">
           <div>
             <SheetTitle>
-              {{ article ? t('helpCenter.editArticle') : t('helpCenter.newArticle') }}
+              {{
+                translationSource
+                  ? t('helpCenter.addTranslation')
+                  : article
+                    ? t('helpCenter.editArticle')
+                    : t('helpCenter.newArticle')
+              }}
             </SheetTitle>
-            <SheetDescription v-if="article" class="mt-1">
+            <SheetDescription v-if="translationSource" class="mt-1">
+              {{ t('helpCenter.translationOf', { title: translationSource.title }) }}
+            </SheetDescription>
+            <SheetDescription v-if="loadedArticle" class="mt-1">
               {{ t('globals.terms.lastUpdated') }}:
-              {{ format(new Date(article.updated_at), 'PPpp') }}
+              {{ formatDate(loadedArticle.updated_at) }}
             </SheetDescription>
           </div>
         </div>
@@ -89,6 +98,65 @@
                 </div>
               </div>
 
+              <div v-if="loadedArticle && helpCenterLocales.length > 1" class="space-y-3">
+                <h3 class="font-medium text-sm text-muted-foreground">
+                  {{ t('globals.terms.language', 2) }}
+                </h3>
+
+                <div class="overflow-hidden rounded-md border bg-card">
+                  <button
+                    v-for="locale in translatedLocales"
+                    :key="locale"
+                    type="button"
+                    class="flex w-full items-center gap-3 border-b px-3 py-2.5 text-left text-sm last:border-b-0 disabled:cursor-default can-hover:hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring"
+                    :class="{ 'font-medium': locale === loadedArticle.locale }"
+                    :disabled="locale === loadedArticle.locale"
+                    :aria-current="locale === loadedArticle.locale ? 'page' : undefined"
+                    @click="selectTranslationLocale(locale)"
+                  >
+                    <span class="min-w-0 flex-1 truncate">{{ languageName(locale) }}</span>
+                    <span class="text-xs uppercase text-muted-foreground">{{ locale }}</span>
+                    <Check
+                      v-if="locale === loadedArticle.locale"
+                      class="size-4 shrink-0"
+                      aria-hidden="true"
+                    />
+                    <ChevronRight
+                      v-else-if="translationByLocale.has(locale)"
+                      class="size-4 shrink-0 text-muted-foreground"
+                      aria-hidden="true"
+                    />
+                  </button>
+                </div>
+
+                <Select
+                  v-if="missingLocales.length"
+                  :model-value="''"
+                  @update:model-value="selectTranslationLocale"
+                >
+                  <SelectTrigger class="w-full">
+                    <Plus class="mr-2 size-4" aria-hidden="true" />
+                    <SelectValue :placeholder="t('helpCenter.addTranslation')" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem v-for="locale in missingLocales" :key="locale" :value="locale">
+                      {{ languageName(locale) }} ({{ locale }})
+                    </SelectItem>
+                  </SelectContent>
+                </Select>
+                <Button
+                  v-else
+                  type="button"
+                  variant="outline"
+                  size="sm"
+                  class="w-full"
+                  @click="emit('manage-languages')"
+                >
+                  <Plus class="mr-2 size-4" aria-hidden="true" />
+                  {{ t('helpCenter.addTranslation') }}
+                </Button>
+              </div>
+
               <div class="space-y-3">
                 <h3 class="font-medium text-sm text-muted-foreground">
                   {{ t('globals.terms.status') }}
@@ -122,6 +190,21 @@
                 <p v-if="localeCollections.length === 0" class="text-sm text-muted-foreground">
                   {{ t('helpCenter.noCollectionsInLanguage') }}
                 </p>
+                <Button
+                  v-if="localeCollections.length === 0 && translationSource"
+                  type="button"
+                  variant="outline"
+                  size="sm"
+                  @click="
+                    emit('create-translation-collection', {
+                      article: translationSource,
+                      locale: form.values.locale
+                    })
+                  "
+                >
+                  <Plus class="mr-2 size-4" aria-hidden="true" />
+                  {{ t('helpCenter.newCollection') }}
+                </Button>
 
                 <FormField v-slot="{ componentField }" name="collection_id">
                   <FormItem>
@@ -183,7 +266,7 @@
                           <SelectValue />
                         </SelectTrigger>
                         <SelectContent>
-                          <SelectItem v-for="loc in helpCenterLocales" :key="loc" :value="loc">
+                          <SelectItem v-for="loc in selectableLocales" :key="loc" :value="loc">
                             {{ loc }}
                           </SelectItem>
                         </SelectContent>
@@ -256,26 +339,35 @@
                 </FormField>
               </div>
 
-              <div v-if="article" class="space-y-3 text-sm border-t pt-4">
+              <div v-if="loadedArticle" class="space-y-3 text-sm border-t pt-4">
                 <div v-if="loadedArticle?.created_by_name" class="flex justify-between py-1">
                   <span class="text-muted-foreground">{{ t('helpCenter.createdBy') }}</span>
                   <span>{{ loadedArticle.created_by_name }}</span>
                 </div>
-                <div v-if="loadedArticle?.helpful_count !== undefined" class="flex justify-between py-1">
+                <div
+                  v-if="loadedArticle?.helpful_count !== undefined"
+                  class="flex justify-between py-1"
+                >
                   <span class="text-muted-foreground">{{ t('globals.terms.feedback') }}</span>
-                  <span>👍 {{ loadedArticle.helpful_count }} · 👎 {{ loadedArticle.not_helpful_count }}</span>
+                  <span
+                    >👍 {{ loadedArticle.helpful_count }} · 👎
+                    {{ loadedArticle.not_helpful_count }}</span
+                  >
                 </div>
                 <div class="flex justify-between py-1">
                   <span class="text-muted-foreground">{{ t('globals.terms.createdAt') }}</span>
-                  <span>{{ format(new Date(article.created_at), 'PPpp') }}</span>
+                  <span>{{ formatDate(loadedArticle.created_at) }}</span>
                 </div>
                 <div class="flex justify-between py-1">
                   <span class="text-muted-foreground">{{ t('globals.terms.updatedAt') }}</span>
-                  <span>{{ format(new Date(article.updated_at), 'PPpp') }}</span>
+                  <span>{{ formatDate(loadedArticle.updated_at) }}</span>
                 </div>
-                <div v-if="article.view_count !== undefined" class="flex justify-between py-1">
+                <div
+                  v-if="loadedArticle.view_count !== undefined"
+                  class="flex justify-between py-1"
+                >
                   <span class="text-muted-foreground">{{ t('globals.terms.view', 2) }}</span>
-                  <span>{{ article.view_count.toLocaleString() }}</span>
+                  <span>{{ loadedArticle.view_count.toLocaleString() }}</span>
                 </div>
               </div>
             </div>
@@ -321,9 +413,10 @@ import { handleHTTPError } from '@shared-ui/utils/http.js'
 import { useEmitter } from '@/composables/useEmitter.js'
 import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
 import { useUserStore } from '@/stores/user'
-import { format } from 'date-fns'
+import { format, isValid } from 'date-fns'
+import { Check, ChevronRight, Plus } from 'lucide-vue-next'
 
-const { t } = useI18n()
+const { t, locale: uiLocale } = useI18n()
 
 const props = defineProps({
   isOpen: {
@@ -354,6 +447,10 @@ const props = defineProps({
     type: String,
     default: ''
   },
+  translationSource: {
+    type: Object,
+    default: null
+  },
   submitForm: {
     type: Function,
     required: true
@@ -364,11 +461,17 @@ const props = defineProps({
   }
 })
 
-defineEmits(['update:open', 'cancel'])
+const emit = defineEmits([
+  'update:open',
+  'cancel',
+  'create-translation',
+  'create-translation-collection',
+  'open-translation',
+  'manage-languages'
+])
 const emitter = useEmitter()
 const userStore = useUserStore()
 
-
 const isLoadingArticle = ref(false)
 const availableCollections = ref([])
 const editorText = ref('')
@@ -382,6 +485,50 @@ const submitLabel = computed(() =>
   props.article ? t('globals.messages.update') : t('globals.messages.create')
 )
 
+const linkedLocales = computed(
+  () =>
+    new Set(
+      (loadedArticle.value?.translations || props.translationSource?.translations || []).map(
+        ({ locale }) => locale
+      )
+    )
+)
+const selectableLocales = computed(() => {
+  if (props.translationSource) {
+    return props.helpCenterLocales.filter((locale) => !linkedLocales.value.has(locale))
+  }
+  if (props.article) {
+    return props.helpCenterLocales.filter(
+      (locale) => locale === loadedArticle.value?.locale || !linkedLocales.value.has(locale)
+    )
+  }
+  return props.helpCenterLocales
+})
+const translationByLocale = computed(
+  () =>
+    new Map(
+      (loadedArticle.value?.translations || []).map((translation) => [
+        translation.locale,
+        translation
+      ])
+    )
+)
+const translatedLocales = computed(() =>
+  props.helpCenterLocales.filter((locale) => translationByLocale.value.has(locale))
+)
+const missingLocales = computed(() =>
+  props.helpCenterLocales.filter((locale) => !translationByLocale.value.has(locale))
+)
+const languageDisplayNames = computed(
+  () => new Intl.DisplayNames([uiLocale.value], { type: 'language' })
+)
+
+const languageName = (locale) => languageDisplayNames.value.of(locale) || locale
+const formatDate = (value) => {
+  const date = new Date(value)
+  return isValid(date) ? format(date, 'PPpp') : '-'
+}
+
 const toFormValues = () => {
   const article = loadedArticle.value || props.article
   return {
@@ -392,7 +539,12 @@ const toFormValues = () => {
     sort_order: article?.sort_order || 0,
     ai_enabled: article?.ai_enabled || false,
     author_id: String(article?.author_id || (props.article ? '' : userStore.userID) || ''),
-    locale: article?.locale || props.defaultLocale || props.helpCenterLocales?.[0] || 'en',
+    locale:
+      article?.locale ||
+      props.translationSource?.locale ||
+      props.defaultLocale ||
+      selectableLocales.value[0] ||
+      'en',
     excerpt: article?.excerpt || '',
     meta_title: article?.meta_title || '',
     meta_description: article?.meta_description || '',
@@ -442,7 +594,7 @@ const metaDescriptionPlaceholder = computed(() => (form.values.excerpt || '').tr
 // can't fill the form after another article was opened.
 let loadSeq = 0
 watch(
-  () => [props.article, props.collectionId, props.isOpen],
+  () => [props.article, props.collectionId, props.translationSource, props.isOpen],
   async () => {
     if (!props.isOpen) return
     const seq = ++loadSeq
@@ -486,11 +638,31 @@ const fetchArticle = async () => {
   }
 }
 
+const selectTranslationLocale = (locale) => {
+  if (form.meta.value.dirty) {
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      description: t(
+        translationByLocale.value.has(locale)
+          ? 'helpCenter.saveBeforeSwitchingTranslation'
+          : 'helpCenter.saveBeforeTranslation'
+      )
+    })
+    return
+  }
+  const translation = translationByLocale.value.get(locale)
+  if (translation) {
+    emit('open-translation', translation)
+    return
+  }
+  emit('create-translation', { article: loadedArticle.value, locale })
+}
+
 const onSubmit = form.handleSubmit(async (values) => {
   props.submitForm({
     ...values,
     content: highlightCodeBlocks(values.content),
-    author_id: values.author_id ? Number(values.author_id) : null
+    author_id: values.author_id ? Number(values.author_id) : null,
+    translation_of_id: props.translationSource?.id || undefined
   })
 })
 </script>
diff --git a/frontend/apps/main/src/features/admin/help-center/CollectionEditSheet.vue b/frontend/apps/main/src/features/admin/help-center/CollectionEditSheet.vue
index 1217da9e..545b8541 100644
--- a/frontend/apps/main/src/features/admin/help-center/CollectionEditSheet.vue
+++ b/frontend/apps/main/src/features/admin/help-center/CollectionEditSheet.vue
@@ -9,7 +9,7 @@
             </SheetTitle>
             <SheetDescription v-if="collection" class="mt-1">
               {{ t('globals.terms.lastUpdated') }}:
-              {{ format(new Date(collection.updated_at), 'PPpp') }}
+              {{ formatDate(collection.updated_at) }}
             </SheetDescription>
           </div>
         </div>
@@ -156,11 +156,11 @@
               <div v-if="collection" class="space-y-3 text-sm border-t pt-4">
                 <div class="flex justify-between py-1">
                   <span class="text-muted-foreground">{{ t('globals.terms.createdAt') }}</span>
-                  <span>{{ format(new Date(collection.created_at), 'PPpp') }}</span>
+                  <span>{{ formatDate(collection.created_at) }}</span>
                 </div>
                 <div class="flex justify-between py-1">
                   <span class="text-muted-foreground">{{ t('globals.terms.updatedAt') }}</span>
-                  <span>{{ format(new Date(collection.updated_at), 'PPpp') }}</span>
+                  <span>{{ formatDate(collection.updated_at) }}</span>
                 </div>
                 <div v-if="collection.articles" class="flex justify-between py-1">
                   <span class="text-muted-foreground">{{ t('globals.terms.article', 2) }}</span>
@@ -205,9 +205,13 @@ import api from '@/api'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
 import { useEmitter } from '@/composables/useEmitter.js'
 import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
-import { format } from 'date-fns'
+import { format, isValid } from 'date-fns'
 
 const { t } = useI18n()
+const formatDate = (value) => {
+  const date = new Date(value)
+  return isValid(date) ? format(date, 'PPpp') : '-'
+}
 
 const props = defineProps({
   isOpen: {
diff --git a/frontend/apps/main/src/features/admin/help-center/articleFormSchema.js b/frontend/apps/main/src/features/admin/help-center/articleFormSchema.js
index 1b173a01..a5f28471 100644
--- a/frontend/apps/main/src/features/admin/help-center/articleFormSchema.js
+++ b/frontend/apps/main/src/features/admin/help-center/articleFormSchema.js
@@ -2,12 +2,14 @@ import * as z from 'zod'
 
 // An untouched editor serializes to '<p></p>', which passes a length check.
 const hasArticleContent = (html) =>
-  html.replace(/<[^>]*>/g, '').replace(/&nbsp;/g, ' ').trim().length > 0 ||
-  /<(img|table|iframe|video|hr|blockquote|details)\b/i.test(html)
+  html
+    .replace(/<[^>]*>/g, '')
+    .replace(/&nbsp;/g, ' ')
+    .trim().length > 0 || /<(img|table|iframe|video|hr|blockquote|details)\b/i.test(html)
 
 export const createArticleFormSchema = (t) =>
   z.object({
-    title: z.string().min(1, t('globals.messages.required')),
+    title: z.string().trim().min(1, t('globals.messages.required')),
     content: z.string().refine(hasArticleContent, t('globals.messages.required')),
     status: z.enum(['draft', 'published']).default('draft'),
     collection_id: z.coerce.number().min(1, t('globals.messages.required')),
diff --git a/frontend/apps/main/src/features/admin/help-center/articleFormSchema.test.js b/frontend/apps/main/src/features/admin/help-center/articleFormSchema.test.js
index 3b68e59d..a57d6d04 100644
--- a/frontend/apps/main/src/features/admin/help-center/articleFormSchema.test.js
+++ b/frontend/apps/main/src/features/admin/help-center/articleFormSchema.test.js
@@ -5,117 +5,125 @@ const mockT = (key, params) => `${key} ${JSON.stringify(params || {})}`
 const schema = createArticleFormSchema(mockT)
 
 const validForm = {
-    title: 'How to reset your password',
-    content: '<p>Click the reset link.</p>',
-    collection_id: 1
+  title: 'How to reset your password',
+  content: '<p>Click the reset link.</p>',
+  collection_id: 1
 }
 
 describe('Help Center Article Form Schema', () => {
-    test('valid minimal form', () => {
-        expect(() => schema.parse(validForm)).not.toThrow()
-    })
+  test('valid minimal form', () => {
+    expect(() => schema.parse(validForm)).not.toThrow()
+  })
 
-    test('valid complete form', () => {
-        expect(() => schema.parse({
-            ...validForm,
-            status: 'published',
-            sort_order: 3,
-            ai_enabled: true,
-            locale: 'de',
-            author_id: '7',
-            excerpt: 'Reset flow',
-            meta_title: 'Reset',
-            meta_description: 'How to reset',
-            meta_image_url: 'https://cdn.example.com/a.png'
-        })).not.toThrow()
-    })
+  test('valid complete form', () => {
+    expect(() =>
+      schema.parse({
+        ...validForm,
+        status: 'published',
+        sort_order: 3,
+        ai_enabled: true,
+        locale: 'de',
+        author_id: '7',
+        excerpt: 'Reset flow',
+        meta_title: 'Reset',
+        meta_description: 'How to reset',
+        meta_image_url: 'https://cdn.example.com/a.png'
+      })
+    ).not.toThrow()
+  })
 
-    test('title missing', () => {
-        const { title, ...form } = validForm
-        expect(() => schema.parse(form)).toThrow()
-    })
+  test('title missing', () => {
+    const { title, ...form } = validForm
+    expect(() => schema.parse(form)).toThrow()
+  })
 
-    test('title empty string', () => {
-        expect(() => schema.parse({ ...validForm, title: '' })).toThrow()
-    })
+  test('title empty string', () => {
+    expect(() => schema.parse({ ...validForm, title: '' })).toThrow()
+  })
 
-    test('title at minimum length', () => {
-        expect(() => schema.parse({ ...validForm, title: 'a' })).not.toThrow()
-    })
+  test('title with only whitespace is rejected', () => {
+    expect(() => schema.parse({ ...validForm, title: '   ' })).toThrow()
+  })
 
-    test('content missing', () => {
-        const { content, ...form } = validForm
-        expect(() => schema.parse(form)).toThrow()
-    })
+  test('title at minimum length', () => {
+    expect(() => schema.parse({ ...validForm, title: 'a' })).not.toThrow()
+  })
 
-    test('content empty string', () => {
-        expect(() => schema.parse({ ...validForm, content: '' })).toThrow()
-    })
+  test('content missing', () => {
+    const { content, ...form } = validForm
+    expect(() => schema.parse(form)).toThrow()
+  })
 
-    test('untouched editor markup rejected', () => {
-        expect(() => schema.parse({ ...validForm, content: '<p></p>' })).toThrow()
-    })
+  test('content empty string', () => {
+    expect(() => schema.parse({ ...validForm, content: '' })).toThrow()
+  })
 
-    test('whitespace only content rejected', () => {
-        expect(() => schema.parse({ ...validForm, content: '<p>   </p>' })).toThrow()
-        expect(() => schema.parse({ ...validForm, content: '<p>&nbsp;</p>' })).toThrow()
-    })
+  test('untouched editor markup rejected', () => {
+    expect(() => schema.parse({ ...validForm, content: '<p></p>' })).toThrow()
+  })
 
-    test('embed only content accepted', () => {
-        expect(() => schema.parse({ ...validForm, content: '<p><img src="a.png"></p>' })).not.toThrow()
-        expect(() => schema.parse({ ...validForm, content: '<table><tr><td></td></tr></table>' })).not.toThrow()
-    })
+  test('whitespace only content rejected', () => {
+    expect(() => schema.parse({ ...validForm, content: '<p>   </p>' })).toThrow()
+    expect(() => schema.parse({ ...validForm, content: '<p>&nbsp;</p>' })).toThrow()
+  })
 
-    test('collection_id missing', () => {
-        const { collection_id, ...form } = validForm
-        expect(() => schema.parse(form)).toThrow()
-    })
+  test('embed only content accepted', () => {
+    expect(() => schema.parse({ ...validForm, content: '<p><img src="a.png"></p>' })).not.toThrow()
+    expect(() =>
+      schema.parse({ ...validForm, content: '<table><tr><td></td></tr></table>' })
+    ).not.toThrow()
+  })
 
-    test('collection_id below minimum', () => {
-        expect(() => schema.parse({ ...validForm, collection_id: 0 })).toThrow()
-    })
+  test('collection_id missing', () => {
+    const { collection_id, ...form } = validForm
+    expect(() => schema.parse(form)).toThrow()
+  })
 
-    test('collection_id coerced from string', () => {
-        expect(schema.parse({ ...validForm, collection_id: '2' }).collection_id).toBe(2)
-    })
+  test('collection_id below minimum', () => {
+    expect(() => schema.parse({ ...validForm, collection_id: 0 })).toThrow()
+  })
 
-    test('collection_id rejects non numeric string', () => {
-        expect(() => schema.parse({ ...validForm, collection_id: 'abc' })).toThrow()
-    })
+  test('collection_id coerced from string', () => {
+    expect(schema.parse({ ...validForm, collection_id: '2' }).collection_id).toBe(2)
+  })
 
-    test('status invalid value', () => {
-        expect(() => schema.parse({ ...validForm, status: 'archived' })).toThrow()
-    })
+  test('collection_id rejects non numeric string', () => {
+    expect(() => schema.parse({ ...validForm, collection_id: 'abc' })).toThrow()
+  })
 
-    test('status defaults to draft', () => {
-        expect(schema.parse(validForm).status).toBe('draft')
-    })
+  test('status invalid value', () => {
+    expect(() => schema.parse({ ...validForm, status: 'archived' })).toThrow()
+  })
 
-    test('sort_order defaults to 0', () => {
-        expect(schema.parse(validForm).sort_order).toBe(0)
-    })
+  test('status defaults to draft', () => {
+    expect(schema.parse(validForm).status).toBe('draft')
+  })
 
-    test('ai_enabled defaults to false', () => {
-        expect(schema.parse(validForm).ai_enabled).toBe(false)
-    })
+  test('sort_order defaults to 0', () => {
+    expect(schema.parse(validForm).sort_order).toBe(0)
+  })
 
-    test('locale defaults to en', () => {
-        expect(schema.parse(validForm).locale).toBe('en')
-    })
+  test('ai_enabled defaults to false', () => {
+    expect(schema.parse(validForm).ai_enabled).toBe(false)
+  })
 
-    test('meta fields default to empty strings', () => {
-        const parsed = schema.parse(validForm)
-        expect(parsed.excerpt).toBe('')
-        expect(parsed.meta_title).toBe('')
-        expect(parsed.meta_description).toBe('')
-        expect(parsed.meta_image_url).toBe('')
-    })
+  test('locale defaults to en', () => {
+    expect(schema.parse(validForm).locale).toBe('en')
+  })
 
-    test('author_id optional', () => {
-        expect(() => schema.parse(validForm)).not.toThrow()
-    })
+  test('meta fields default to empty strings', () => {
+    const parsed = schema.parse(validForm)
+    expect(parsed.excerpt).toBe('')
+    expect(parsed.meta_title).toBe('')
+    expect(parsed.meta_description).toBe('')
+    expect(parsed.meta_image_url).toBe('')
+  })
 
-    test('empty object', () => {
-        expect(() => schema.parse({})).toThrow()
-    })
+  test('author_id optional', () => {
+    expect(() => schema.parse(validForm)).not.toThrow()
+  })
+
+  test('empty object', () => {
+    expect(() => schema.parse({})).toThrow()
+  })
 })
diff --git a/frontend/apps/main/src/features/admin/help-center/collectionFormSchema.js b/frontend/apps/main/src/features/admin/help-center/collectionFormSchema.js
index 0ac83a72..d7470915 100644
--- a/frontend/apps/main/src/features/admin/help-center/collectionFormSchema.js
+++ b/frontend/apps/main/src/features/admin/help-center/collectionFormSchema.js
@@ -2,7 +2,7 @@ import * as z from 'zod'
 
 export const createCollectionFormSchema = (t) =>
   z.object({
-    name: z.string().min(1, t('globals.messages.required')),
+    name: z.string().trim().min(1, t('globals.messages.required')),
     description: z.string().optional(),
     icon: z.string().optional(),
     locale: z.string().default('en'),
diff --git a/frontend/apps/main/src/features/admin/help-center/collectionFormSchema.test.js b/frontend/apps/main/src/features/admin/help-center/collectionFormSchema.test.js
index b1ff8aa8..ee5f7e2e 100644
--- a/frontend/apps/main/src/features/admin/help-center/collectionFormSchema.test.js
+++ b/frontend/apps/main/src/features/admin/help-center/collectionFormSchema.test.js
@@ -5,71 +5,77 @@ const mockT = (key, params) => `${key} ${JSON.stringify(params || {})}`
 const schema = createCollectionFormSchema(mockT)
 
 const validForm = {
-    name: 'Getting started'
+  name: 'Getting started'
 }
 
 describe('Help Center Collection Form Schema', () => {
-    test('valid minimal form', () => {
-        expect(() => schema.parse(validForm)).not.toThrow()
-    })
+  test('valid minimal form', () => {
+    expect(() => schema.parse(validForm)).not.toThrow()
+  })
 
-    test('valid complete form', () => {
-        expect(() => schema.parse({
-            name: 'Getting started',
-            description: 'Basics',
-            icon: 'book',
-            locale: 'fr',
-            parent_id: 4,
-            is_published: false,
-            sort_order: 2
-        })).not.toThrow()
-    })
+  test('valid complete form', () => {
+    expect(() =>
+      schema.parse({
+        name: 'Getting started',
+        description: 'Basics',
+        icon: 'book',
+        locale: 'fr',
+        parent_id: 4,
+        is_published: false,
+        sort_order: 2
+      })
+    ).not.toThrow()
+  })
 
-    test('name missing', () => {
-        expect(() => schema.parse({})).toThrow()
-    })
+  test('name missing', () => {
+    expect(() => schema.parse({})).toThrow()
+  })
 
-    test('name empty string', () => {
-        expect(() => schema.parse({ name: '' })).toThrow()
-    })
+  test('name empty string', () => {
+    expect(() => schema.parse({ name: '' })).toThrow()
+  })
 
-    test('name at minimum length', () => {
-        expect(() => schema.parse({ name: 'a' })).not.toThrow()
-    })
+  test('name with only whitespace is rejected', () => {
+    expect(() => schema.parse({ name: '   ' })).toThrow()
+  })
 
-    test('name not a string', () => {
-        expect(() => schema.parse({ name: 1 })).toThrow()
-    })
+  test('name at minimum length', () => {
+    expect(() => schema.parse({ name: 'a' })).not.toThrow()
+  })
 
-    test('locale defaults to en', () => {
-        expect(schema.parse(validForm).locale).toBe('en')
-    })
+  test('name not a string', () => {
+    expect(() => schema.parse({ name: 1 })).toThrow()
+  })
 
-    test('is_published defaults to true', () => {
-        expect(schema.parse(validForm).is_published).toBe(true)
-    })
+  test('locale defaults to en', () => {
+    expect(schema.parse(validForm).locale).toBe('en')
+  })
 
-    test('sort_order defaults to 0', () => {
-        expect(schema.parse(validForm).sort_order).toBe(0)
-    })
+  test('is_published defaults to true', () => {
+    expect(schema.parse(validForm).is_published).toBe(true)
+  })
 
-    test('sort_order must be a number', () => {
-        expect(() => schema.parse({ ...validForm, sort_order: '2' })).toThrow()
-    })
+  test('sort_order defaults to 0', () => {
+    expect(schema.parse(validForm).sort_order).toBe(0)
+  })
 
-    test('parent_id accepts null', () => {
-        expect(() => schema.parse({ ...validForm, parent_id: null })).not.toThrow()
-    })
+  test('sort_order must be a number', () => {
+    expect(() => schema.parse({ ...validForm, sort_order: '2' })).toThrow()
+  })
 
-    test('parent_id coerced from string', () => {
-        expect(schema.parse({ ...validForm, parent_id: '4' }).parent_id).toBe(4)
-    })
+  test('parent_id accepts null', () => {
+    expect(() => schema.parse({ ...validForm, parent_id: null })).not.toThrow()
+  })
 
-    test('parent_id rejects non numeric string', () => {
-        expect(() => schema.parse({ ...validForm, parent_id: 'abc' })).toThrow()
-    })
+  test('parent_id coerced from string', () => {
+    expect(schema.parse({ ...validForm, parent_id: '4' }).parent_id).toBe(4)
+  })
 
-    test('description and icon optional', () => {
-        expect(() => schema.parse(validForm)).not.toThrow()
-    })
+  test('parent_id rejects non numeric string', () => {
+    expect(() => schema.parse({ ...validForm, parent_id: 'abc' })).toThrow()
+  })
+
+  test('description and icon optional', () => {
+    expect(() => schema.parse(validForm)).not.toThrow()
+  })
 })
diff --git a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js
index 13b28bc4..2465902c 100644
--- a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js
+++ b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js
@@ -64,15 +64,18 @@ const createBaseSchema = (t) => {
   return z.object({
     name: z
       .string()
+      .trim()
       .min(1, t('globals.messages.required'))
       .refine(withinLength(MAX_NAME), t('globals.messages.maxLength', { max: MAX_NAME })),
     slug: z
       .string()
+      .trim()
       .min(1, t('globals.messages.required'))
       .max(200, t('helpCenter.invalidSlug'))
       .regex(/^[a-z0-9_-]+$/, t('helpCenter.invalidSlug')),
     page_title: z
       .string()
+      .trim()
       .min(1, t('globals.messages.required'))
       .refine(
         withinLength(MAX_PAGE_TITLE),
diff --git a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.test.js b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.test.js
index 78ce143d..4e6b5ddd 100644
--- a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.test.js
+++ b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.test.js
@@ -6,254 +6,315 @@ const schema = createHelpCenterFormSchema(mockT)
 const basicsSchema = createHelpCenterBasicsSchema(mockT)
 
 const validForm = {
-    name: 'Docs',
-    slug: 'docs',
-    page_title: 'Help center'
+  name: 'Docs',
+  slug: 'docs',
+  page_title: 'Help center'
 }
 
 describe('Help Center Form Schema', () => {
-    test('valid minimal form', () => {
-        expect(() => schema.parse(validForm)).not.toThrow()
-    })
+  test('valid minimal form', () => {
+    expect(() => schema.parse(validForm)).not.toThrow()
+  })
 
-    test('valid complete form', () => {
-        expect(() => schema.parse({
-            ...validForm,
-            template: 'docs',
-            meta_description: 'Everything about our product',
-            custom_domain: 'https://help.example.com',
-            custom_css: 'body { color: red }',
-            custom_js: 'console.log(1)',
-            default_locale: 'fr',
-            allowed_locales: ['en', 'fr'],
-            theme: {
-                color: 'blue',
-                logo_url: '/uploads/logo.png',
-                favicon: 'https://cdn.example.com/f.ico',
-                tagline: 'We are here',
-                nav_links: [{ label: 'Home', url: '/' }],
-                header: {
-                    heading: 'Hi',
-                    background_type: 'gradient',
-                    background_color: '#fff',
-                    gradient_from: '#000000',
-                    gradient_to: '#ffffffcc',
-                    background_image: '/uploads/bg.png',
-                    text_color: '#123'
-                },
-                layout: { collections: 'grid', columns: 3, show_popular_articles: true, popular_articles_label: 'Popular' },
-                cards: { hide_description: false, hide_count: true, show_authors: true, show_icon_tile: true, icon_position: 'top' },
-                announcement: { text: 'New release', link_label: 'Read', link_url: '/blog' },
-                footer: { background_color: '#111111', text_color: '#eeeeee', tagline: 'Bye' },
-                footer_links: [{ label: 'Terms', url: 'https://example.com/terms' }],
-                social_links: [{ platform: 'x', url: 'https://x.com/example' }],
-                article: { hide_toc: false, hide_related: true, show_author: true }
-            }
-        })).not.toThrow()
-    })
-
-    test('name missing', () => {
-        const { name, ...form } = validForm
-        expect(() => schema.parse(form)).toThrow()
-    })
-
-    test('name empty string', () => {
-        expect(() => schema.parse({ ...validForm, name: '' })).toThrow()
-    })
-
-    test('name too long', () => {
-        expect(() => schema.parse({ ...validForm, name: 'a'.repeat(201) })).toThrow()
-    })
-
-    test('name at maximum length', () => {
-        expect(() => schema.parse({ ...validForm, name: 'a'.repeat(200) })).not.toThrow()
-    })
-
-    test('name length counts emoji as one character', () => {
-        expect(() => schema.parse({ ...validForm, name: '😀'.repeat(200) })).not.toThrow()
-    })
-
-    test('slug missing', () => {
-        const { slug, ...form } = validForm
-        expect(() => schema.parse(form)).toThrow()
-    })
-
-    test('slug empty string', () => {
-        expect(() => schema.parse({ ...validForm, slug: '' })).toThrow()
-    })
-
-    test('slug with uppercase rejected', () => {
-        expect(() => schema.parse({ ...validForm, slug: 'Docs' })).toThrow()
-    })
-
-    test('slug with space rejected', () => {
-        expect(() => schema.parse({ ...validForm, slug: 'my docs' })).toThrow()
-    })
-
-    test('slug with dash and underscore accepted', () => {
-        expect(() => schema.parse({ ...validForm, slug: 'my-docs_2' })).not.toThrow()
-    })
-
-    test('slug too long', () => {
-        expect(() => schema.parse({ ...validForm, slug: 'a'.repeat(201) })).toThrow()
-    })
-
-    test('page_title missing', () => {
-        const { page_title, ...form } = validForm
-        expect(() => schema.parse(form)).toThrow()
-    })
-
-    test('page_title empty string', () => {
-        expect(() => schema.parse({ ...validForm, page_title: '' })).toThrow()
-    })
-
-    test('page_title too long', () => {
-        expect(() => schema.parse({ ...validForm, page_title: 'a'.repeat(201) })).toThrow()
-    })
-
-    test('template defaults to classic', () => {
-        expect(schema.parse(validForm).template).toBe('classic')
-    })
-
-    test('template invalid value', () => {
-        expect(() => schema.parse({ ...validForm, template: 'minimal' })).toThrow()
-    })
-
-    test('meta_description too long', () => {
-        expect(() => schema.parse({ ...validForm, meta_description: 'a'.repeat(501) })).toThrow()
-    })
-
-    test('meta_description at maximum length', () => {
-        expect(() => schema.parse({ ...validForm, meta_description: 'a'.repeat(500) })).not.toThrow()
-    })
-
-    test('custom_domain without protocol rejected', () => {
-        expect(() => schema.parse({ ...validForm, custom_domain: 'help.example.com' })).toThrow()
-    })
-
-    test('custom_domain with a path rejected', () => {
-        expect(() => schema.parse({ ...validForm, custom_domain: 'https://help.example.com/docs' })).toThrow()
-    })
-
-    test('custom_domain empty string accepted', () => {
-        expect(() => schema.parse({ ...validForm, custom_domain: '' })).not.toThrow()
-    })
-
-    test('default_locale defaults to en', () => {
-        expect(schema.parse(validForm).default_locale).toBe('en')
-    })
-
-    test('allowed_locales defaults to en', () => {
-        expect(schema.parse(validForm).allowed_locales).toEqual(['en'])
-    })
-
-    test('default_locale must be in allowed_locales', () => {
-        expect(() => schema.parse({ ...validForm, default_locale: 'fr', allowed_locales: ['en'] })).toThrow()
-    })
-
-    test('invalid locale format', () => {
-        expect(() => schema.parse({ ...validForm, default_locale: 'english', allowed_locales: ['english'] })).toThrow()
-    })
-
-    test('region locale accepted', () => {
-        expect(() => schema.parse({ ...validForm, default_locale: 'pt-BR', allowed_locales: ['pt-BR'] })).not.toThrow()
-    })
-
-    test('allowed_locales empty array', () => {
-        expect(() => schema.parse({ ...validForm, allowed_locales: [] })).toThrow()
-    })
-
-    test('theme logo_url protocol relative rejected', () => {
-        expect(() => schema.parse({ ...validForm, theme: { logo_url: '//cdn.example.com/l.png' } })).toThrow()
-    })
-
-    test('theme logo_url root relative accepted', () => {
-        expect(() => schema.parse({ ...validForm, theme: { logo_url: '/uploads/l.png' } })).not.toThrow()
-    })
-
-    test('theme logo_url empty string accepted', () => {
-        expect(() => schema.parse({ ...validForm, theme: { logo_url: '' } })).not.toThrow()
-    })
-
-    test('theme header background_color invalid hex', () => {
-        expect(() => schema.parse({ ...validForm, theme: { header: { background_color: 'red' } } })).toThrow()
-    })
-
-    test('theme header background_color accepts 3, 4, 6 and 8 digit hex', () => {
-        for (const background_color of ['#fff', '#fff0', '#ffffff', '#ffffff00']) {
-            expect(() => schema.parse({ ...validForm, theme: { header: { background_color } } })).not.toThrow()
+  test('valid complete form', () => {
+    expect(() =>
+      schema.parse({
+        ...validForm,
+        template: 'docs',
+        meta_description: 'Everything about our product',
+        custom_domain: 'https://help.example.com',
+        custom_css: 'body { color: red }',
+        custom_js: 'console.log(1)',
+        default_locale: 'fr',
+        allowed_locales: ['en', 'fr'],
+        theme: {
+          color: 'blue',
+          logo_url: '/uploads/logo.png',
+          favicon: 'https://cdn.example.com/f.ico',
+          tagline: 'We are here',
+          nav_links: [{ label: 'Home', url: '/' }],
+          header: {
+            heading: 'Hi',
+            background_type: 'gradient',
+            background_color: '#fff',
+            gradient_from: '#000000',
+            gradient_to: '#ffffffcc',
+            background_image: '/uploads/bg.png',
+            text_color: '#123'
+          },
+          layout: {
+            collections: 'grid',
+            columns: 3,
+            show_popular_articles: true,
+            popular_articles_label: 'Popular'
+          },
+          cards: {
+            hide_description: false,
+            hide_count: true,
+            show_authors: true,
+            show_icon_tile: true,
+            icon_position: 'top'
+          },
+          announcement: { text: 'New release', link_label: 'Read', link_url: '/blog' },
+          footer: { background_color: '#111111', text_color: '#eeeeee', tagline: 'Bye' },
+          footer_links: [{ label: 'Terms', url: 'https://example.com/terms' }],
+          social_links: [{ platform: 'x', url: 'https://x.com/example' }],
+          article: { hide_toc: false, hide_related: true, show_author: true }
         }
-    })
+      })
+    ).not.toThrow()
+  })
 
-    test('nav link requires label and url', () => {
-        expect(() => schema.parse({ ...validForm, theme: { nav_links: [{ label: '', url: '/' }] } })).toThrow()
-        expect(() => schema.parse({ ...validForm, theme: { nav_links: [{ label: 'Home', url: '' }] } })).toThrow()
-        expect(() => schema.parse({ ...validForm, theme: { nav_links: [{ label: 'Home', url: 'home' }] } })).toThrow()
-    })
+  test('name missing', () => {
+    const { name, ...form } = validForm
+    expect(() => schema.parse(form)).toThrow()
+  })
 
-    test('social link requires platform and url', () => {
-        expect(() => schema.parse({ ...validForm, theme: { social_links: [{ platform: '', url: 'https://x.com/a' }] } })).toThrow()
-        expect(() => schema.parse({ ...validForm, theme: { social_links: [{ platform: 'x', url: 'x.com/a' }] } })).toThrow()
-    })
+  test('name empty string', () => {
+    expect(() => schema.parse({ ...validForm, name: '' })).toThrow()
+  })
 
-    test('card icon_position invalid value', () => {
-        expect(() => schema.parse({ ...validForm, theme: { cards: { icon_position: 'bottom' } } })).toThrow()
-    })
+  test('required text fields reject whitespace-only values', () => {
+    expect(() => schema.parse({ ...validForm, name: '   ' })).toThrow()
+    expect(() => schema.parse({ ...validForm, slug: '   ' })).toThrow()
+    expect(() => schema.parse({ ...validForm, page_title: '   ' })).toThrow()
+  })
 
-    test('announcement link without text rejected', () => {
-        expect(() => schema.parse({
-            ...validForm,
-            theme: { announcement: { text: '', link_label: 'Read', link_url: '/blog' } }
-        })).toThrow()
-    })
+  test('name too long', () => {
+    expect(() => schema.parse({ ...validForm, name: 'a'.repeat(201) })).toThrow()
+  })
 
-    test('announcement text with only whitespace rejected when a link is set', () => {
-        expect(() => schema.parse({
-            ...validForm,
-            theme: { announcement: { text: '   ', link_url: '/blog' } }
-        })).toThrow()
-    })
+  test('name at maximum length', () => {
+    expect(() => schema.parse({ ...validForm, name: 'a'.repeat(200) })).not.toThrow()
+  })
 
-    test('announcement with no text and no link accepted', () => {
-        expect(() => schema.parse({ ...validForm, theme: { announcement: {} } })).not.toThrow()
-    })
+  test('name length counts emoji as one character', () => {
+    expect(() => schema.parse({ ...validForm, name: '😀'.repeat(200) })).not.toThrow()
+  })
 
-    test('announcement with text and link accepted', () => {
-        expect(() => schema.parse({
-            ...validForm,
-            theme: { announcement: { text: 'Hi', link_label: 'Read', link_url: '/blog' } }
-        })).not.toThrow()
-    })
+  test('slug missing', () => {
+    const { slug, ...form } = validForm
+    expect(() => schema.parse(form)).toThrow()
+  })
 
-    test('theme optional', () => {
-        expect(() => schema.parse(validForm)).not.toThrow()
-    })
+  test('slug empty string', () => {
+    expect(() => schema.parse({ ...validForm, slug: '' })).toThrow()
+  })
 
-    test('empty object', () => {
-        expect(() => schema.parse({})).toThrow()
-    })
+  test('slug with uppercase rejected', () => {
+    expect(() => schema.parse({ ...validForm, slug: 'Docs' })).toThrow()
+  })
+
+  test('slug with space rejected', () => {
+    expect(() => schema.parse({ ...validForm, slug: 'my docs' })).toThrow()
+  })
+
+  test('slug with dash and underscore accepted', () => {
+    expect(() => schema.parse({ ...validForm, slug: 'my-docs_2' })).not.toThrow()
+  })
+
+  test('slug too long', () => {
+    expect(() => schema.parse({ ...validForm, slug: 'a'.repeat(201) })).toThrow()
+  })
+
+  test('page_title missing', () => {
+    const { page_title, ...form } = validForm
+    expect(() => schema.parse(form)).toThrow()
+  })
+
+  test('page_title empty string', () => {
+    expect(() => schema.parse({ ...validForm, page_title: '' })).toThrow()
+  })
+
+  test('page_title too long', () => {
+    expect(() => schema.parse({ ...validForm, page_title: 'a'.repeat(201) })).toThrow()
+  })
+
+  test('template defaults to classic', () => {
+    expect(schema.parse(validForm).template).toBe('classic')
+  })
+
+  test('template invalid value', () => {
+    expect(() => schema.parse({ ...validForm, template: 'minimal' })).toThrow()
+  })
+
+  test('meta_description too long', () => {
+    expect(() => schema.parse({ ...validForm, meta_description: 'a'.repeat(501) })).toThrow()
+  })
+
+  test('meta_description at maximum length', () => {
+    expect(() => schema.parse({ ...validForm, meta_description: 'a'.repeat(500) })).not.toThrow()
+  })
+
+  test('custom_domain without protocol rejected', () => {
+    expect(() => schema.parse({ ...validForm, custom_domain: 'help.example.com' })).toThrow()
+  })
+
+  test('custom_domain with a path rejected', () => {
+    expect(() =>
+      schema.parse({ ...validForm, custom_domain: 'https://help.example.com/docs' })
+    ).toThrow()
+  })
+
+  test('custom_domain empty string accepted', () => {
+    expect(() => schema.parse({ ...validForm, custom_domain: '' })).not.toThrow()
+  })
+
+  test('default_locale defaults to en', () => {
+    expect(schema.parse(validForm).default_locale).toBe('en')
+  })
+
+  test('allowed_locales defaults to en', () => {
+    expect(schema.parse(validForm).allowed_locales).toEqual(['en'])
+  })
+
+  test('default_locale must be in allowed_locales', () => {
+    expect(() =>
+      schema.parse({ ...validForm, default_locale: 'fr', allowed_locales: ['en'] })
+    ).toThrow()
+  })
+
+  test('invalid locale format', () => {
+    expect(() =>
+      schema.parse({ ...validForm, default_locale: 'english', allowed_locales: ['english'] })
+    ).toThrow()
+  })
+
+  test('region locale accepted', () => {
+    expect(() =>
+      schema.parse({ ...validForm, default_locale: 'pt-BR', allowed_locales: ['pt-BR'] })
+    ).not.toThrow()
+  })
+
+  test('allowed_locales empty array', () => {
+    expect(() => schema.parse({ ...validForm, allowed_locales: [] })).toThrow()
+  })
+
+  test('theme logo_url protocol relative rejected', () => {
+    expect(() =>
+      schema.parse({ ...validForm, theme: { logo_url: '//cdn.example.com/l.png' } })
+    ).toThrow()
+  })
+
+  test('theme logo_url root relative accepted', () => {
+    expect(() =>
+      schema.parse({ ...validForm, theme: { logo_url: '/uploads/l.png' } })
+    ).not.toThrow()
+  })
+
+  test('theme logo_url empty string accepted', () => {
+    expect(() => schema.parse({ ...validForm, theme: { logo_url: '' } })).not.toThrow()
+  })
+
+  test('theme header background_color invalid hex', () => {
+    expect(() =>
+      schema.parse({ ...validForm, theme: { header: { background_color: 'red' } } })
+    ).toThrow()
+  })
+
+  test('theme header background_color accepts 3, 4, 6 and 8 digit hex', () => {
+    for (const background_color of ['#fff', '#fff0', '#ffffff', '#ffffff00']) {
+      expect(() =>
+        schema.parse({ ...validForm, theme: { header: { background_color } } })
+      ).not.toThrow()
+    }
+  })
+
+  test('nav link requires label and url', () => {
+    expect(() =>
+      schema.parse({ ...validForm, theme: { nav_links: [{ label: '', url: '/' }] } })
+    ).toThrow()
+    expect(() =>
+      schema.parse({ ...validForm, theme: { nav_links: [{ label: 'Home', url: '' }] } })
+    ).toThrow()
+    expect(() =>
+      schema.parse({ ...validForm, theme: { nav_links: [{ label: 'Home', url: 'home' }] } })
+    ).toThrow()
+  })
+
+  test('social link requires platform and url', () => {
+    expect(() =>
+      schema.parse({
+        ...validForm,
+        theme: { social_links: [{ platform: '', url: 'https://x.com/a' }] }
+      })
+    ).toThrow()
+    expect(() =>
+      schema.parse({ ...validForm, theme: { social_links: [{ platform: 'x', url: 'x.com/a' }] } })
+    ).toThrow()
+  })
+
+  test('card icon_position invalid value', () => {
+    expect(() =>
+      schema.parse({ ...validForm, theme: { cards: { icon_position: 'bottom' } } })
+    ).toThrow()
+  })
+
+  test('announcement link without text rejected', () => {
+    expect(() =>
+      schema.parse({
+        ...validForm,
+        theme: { announcement: { text: '', link_label: 'Read', link_url: '/blog' } }
+      })
+    ).toThrow()
+  })
+
+  test('announcement text with only whitespace rejected when a link is set', () => {
+    expect(() =>
+      schema.parse({
+        ...validForm,
+        theme: { announcement: { text: '   ', link_url: '/blog' } }
+      })
+    ).toThrow()
+  })
+
+  test('announcement with no text and no link accepted', () => {
+    expect(() => schema.parse({ ...validForm, theme: { announcement: {} } })).not.toThrow()
+  })
+
+  test('announcement with text and link accepted', () => {
+    expect(() =>
+      schema.parse({
+        ...validForm,
+        theme: { announcement: { text: 'Hi', link_label: 'Read', link_url: '/blog' } }
+      })
+    ).not.toThrow()
+  })
+
+  test('theme optional', () => {
+    expect(() => schema.parse(validForm)).not.toThrow()
+  })
+
+  test('empty object', () => {
+    expect(() => schema.parse({})).toThrow()
+  })
 })
 
 describe('Help Center Basics Schema', () => {
-    test('valid form', () => {
-        expect(() => basicsSchema.parse(validForm)).not.toThrow()
-    })
+  test('valid form', () => {
+    expect(() => basicsSchema.parse(validForm)).not.toThrow()
+  })
 
-    test('drops the fields outside basics', () => {
-        const parsed = basicsSchema.parse({ ...validForm, custom_css: 'body{}' })
-        expect(parsed).toEqual({ name: 'Docs', slug: 'docs', page_title: 'Help center', template: 'classic' })
+  test('drops the fields outside basics', () => {
+    const parsed = basicsSchema.parse({ ...validForm, custom_css: 'body{}' })
+    expect(parsed).toEqual({
+      name: 'Docs',
+      slug: 'docs',
+      page_title: 'Help center',
+      template: 'classic'
     })
+  })
 
-    test('name still required', () => {
-        const { name, ...form } = validForm
-        expect(() => basicsSchema.parse(form)).toThrow()
-    })
+  test('name still required', () => {
+    const { name, ...form } = validForm
+    expect(() => basicsSchema.parse(form)).toThrow()
+  })
 
-    test('slug still validated', () => {
-        expect(() => basicsSchema.parse({ ...validForm, slug: 'Bad Slug' })).toThrow()
-    })
+  test('slug still validated', () => {
+    expect(() => basicsSchema.parse({ ...validForm, slug: 'Bad Slug' })).toThrow()
+  })
 
-    test('locales not required', () => {
-        expect(basicsSchema.parse(validForm).default_locale).toBeUndefined()
-    })
+  test('locales not required', () => {
+    expect(basicsSchema.parse(validForm).default_locale).toBeUndefined()
+  })
 })
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
index 692fafae..eccc1d29 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
@@ -83,7 +83,9 @@
               <FormControl>
                 <Input type="url" placeholder="https://example.com" v-bind="componentField" />
               </FormControl>
-              <FormDescription>{{ $t('admin.inbox.livechat.websiteUrl.description') }}</FormDescription>
+              <FormDescription>{{
+                $t('admin.inbox.livechat.websiteUrl.description')
+              }}</FormDescription>
               <FormMessage />
             </FormItem>
           </FormField>
@@ -98,8 +100,14 @@
                       <SelectValue :placeholder="$t('admin.general.language.placeholder')" />
                     </SelectTrigger>
                     <SelectContent>
-                      <SelectItem value="auto">{{ $t('admin.inbox.livechat.language.auto') }}</SelectItem>
-                      <SelectItem v-for="lang in availableLanguages" :key="lang.code" :value="lang.code">
+                      <SelectItem value="auto">{{
+                        $t('admin.inbox.livechat.language.auto')
+                      }}</SelectItem>
+                      <SelectItem
+                        v-for="lang in availableLanguages"
+                        :key="lang.code"
+                        :value="lang.code"
+                      >
                         {{ lang.name }}
                       </SelectItem>
                     </SelectContent>
@@ -108,7 +116,11 @@
               </FormItem>
             </FormField>
 
-            <FormField v-if="form.values.config?.language === 'auto'" v-slot="{ componentField }" name="config.fallback_language">
+            <FormField
+              v-if="form.values.config?.language === 'auto'"
+              v-slot="{ componentField }"
+              name="config.fallback_language"
+            >
               <FormItem>
                 <FormLabel>{{ $t('admin.inbox.livechat.fallbackLanguage') }}</FormLabel>
                 <FormControl>
@@ -117,13 +129,19 @@
                       <SelectValue :placeholder="$t('admin.general.language.placeholder')" />
                     </SelectTrigger>
                     <SelectContent>
-                      <SelectItem v-for="lang in availableLanguages" :key="lang.code" :value="lang.code">
+                      <SelectItem
+                        v-for="lang in availableLanguages"
+                        :key="lang.code"
+                        :value="lang.code"
+                      >
                         {{ lang.name }}
                       </SelectItem>
                     </SelectContent>
                   </Select>
                 </FormControl>
-                <FormDescription>{{ $t('admin.inbox.livechat.fallbackLanguage.description') }}</FormDescription>
+                <FormDescription>{{
+                  $t('admin.inbox.livechat.fallbackLanguage.description')
+                }}</FormDescription>
               </FormItem>
             </FormField>
           </div>
@@ -135,9 +153,7 @@
                 <FormControl>
                   <Select v-bind="componentField">
                     <SelectTrigger>
-                      <SelectValue
-                        :placeholder="$t('placeholders.selectInbox')"
-                      />
+                      <SelectValue :placeholder="$t('placeholders.selectInbox')" />
                     </SelectTrigger>
                     <SelectContent>
                       <SelectItem :value="0">{{ $t('globals.terms.none') }}</SelectItem>
@@ -154,41 +170,61 @@
             </FormField>
 
             <template v-if="form.values.linked_email_inbox_id">
-            <FormField v-slot="{ componentField }" name="config.continuity.offline_threshold">
-              <FormItem>
-                <FormLabel>{{ $t('admin.inbox.livechat.continuity.offlineThreshold') }}</FormLabel>
-                <FormControl>
-                  <Input type="text" placeholder="10m" v-bind="componentField" />
-                </FormControl>
-                <FormDescription>{{ $t('admin.inbox.livechat.continuity.offlineThreshold.description') }}</FormDescription>
-                <FormMessage />
-              </FormItem>
-            </FormField>
+              <FormField v-slot="{ componentField }" name="config.continuity.offline_threshold">
+                <FormItem>
+                  <FormLabel>{{
+                    $t('admin.inbox.livechat.continuity.offlineThreshold')
+                  }}</FormLabel>
+                  <FormControl>
+                    <Input type="text" placeholder="10m" v-bind="componentField" />
+                  </FormControl>
+                  <FormDescription>{{
+                    $t('admin.inbox.livechat.continuity.offlineThreshold.description')
+                  }}</FormDescription>
+                  <FormMessage />
+                </FormItem>
+              </FormField>
 
-            <FormField v-slot="{ componentField }" name="config.continuity.max_messages_per_email">
-              <FormItem>
-                <FormLabel>{{ $t('admin.inbox.livechat.continuity.maxMessagesPerEmail') }}</FormLabel>
-                <FormControl>
-                  <Input type="number" :min="1" :max="100" placeholder="10" v-bind="componentField" />
-                </FormControl>
-                <FormDescription>{{ $t('admin.inbox.livechat.continuity.maxMessagesPerEmail.description') }}</FormDescription>
-                <FormMessage />
-              </FormItem>
-            </FormField>
+              <FormField
+                v-slot="{ componentField }"
+                name="config.continuity.max_messages_per_email"
+              >
+                <FormItem>
+                  <FormLabel>{{
+                    $t('admin.inbox.livechat.continuity.maxMessagesPerEmail')
+                  }}</FormLabel>
+                  <FormControl>
+                    <Input
+                      type="number"
+                      :min="1"
+                      :max="100"
+                      placeholder="10"
+                      v-bind="componentField"
+                    />
+                  </FormControl>
+                  <FormDescription>{{
+                    $t('admin.inbox.livechat.continuity.maxMessagesPerEmail.description')
+                  }}</FormDescription>
+                  <FormMessage />
+                </FormItem>
+              </FormField>
 
-            <FormField v-slot="{ componentField }" name="config.continuity.min_email_interval">
-              <FormItem>
-                <FormLabel>{{ $t('admin.inbox.livechat.continuity.minEmailInterval') }}</FormLabel>
-                <FormControl>
-                  <Input type="text" placeholder="15m" v-bind="componentField" />
-                </FormControl>
-                <FormDescription>{{ $t('admin.inbox.livechat.continuity.minEmailInterval.description') }}</FormDescription>
-                <FormMessage />
-              </FormItem>
-            </FormField>
+              <FormField v-slot="{ componentField }" name="config.continuity.min_email_interval">
+                <FormItem>
+                  <FormLabel>{{
+                    $t('admin.inbox.livechat.continuity.minEmailInterval')
+                  }}</FormLabel>
+                  <FormControl>
+                    <Input type="text" placeholder="15m" v-bind="componentField" />
+                  </FormControl>
+                  <FormDescription>{{
+                    $t('admin.inbox.livechat.continuity.minEmailInterval.description')
+                  }}</FormDescription>
+                  <FormMessage />
+                </FormItem>
+              </FormField>
             </template>
           </div>
-
         </div>
 
         <!-- Appearance Tab -->
@@ -231,7 +267,9 @@
 
           <!-- Colors -->
           <div class="space-y-4">
-            <h4 class="text-base font-semibold text-foreground">{{ $t('admin.inbox.livechat.colors') }}</h4>
+            <h4 class="text-base font-semibold text-foreground">
+              {{ $t('admin.inbox.livechat.colors') }}
+            </h4>
             <div class="grid grid-cols-2 gap-4">
               <FormField v-slot="{ componentField }" name="config.colors.primary">
                 <FormItem>
@@ -240,7 +278,10 @@
                     <Input type="color" v-bind="componentField" />
                   </FormControl>
                   <FormMessage />
-                  <p v-if="lowPrimaryContrast" class="text-sm text-destructive flex items-start gap-1.5">
+                  <p
+                    v-if="lowPrimaryContrast"
+                    class="text-sm text-destructive flex items-start gap-1.5"
+                  >
                     <TriangleAlert class="size-4 shrink-0 mt-0.5" />
                     <span>{{ $t('admin.inbox.livechat.colors.primary.contrastWarning') }}</span>
                   </p>
@@ -251,7 +292,9 @@
 
           <!-- Home Screen -->
           <div class="space-y-4">
-            <h4 class="text-base font-semibold text-foreground">{{ $t('globals.terms.homeScreen') }}</h4>
+            <h4 class="text-base font-semibold text-foreground">
+              {{ $t('globals.terms.homeScreen') }}
+            </h4>
 
             <FormField v-slot="{ componentField }" name="config.home_screen.header_text_color">
               <FormItem>
@@ -268,10 +311,17 @@
                     </div>
                   </RadioGroup>
                 </FormControl>
-                <FormDescription>{{ $t('admin.inbox.livechat.homeScreen.headerTextColor.description') }}</FormDescription>
-                <p v-if="lowHeaderContrast" class="text-sm text-destructive flex items-start gap-1.5">
+                <FormDescription>{{
+                  $t('admin.inbox.livechat.homeScreen.headerTextColor.description')
+                }}</FormDescription>
+                <p
+                  v-if="lowHeaderContrast"
+                  class="text-sm text-destructive flex items-start gap-1.5"
+                >
                   <TriangleAlert class="size-4 shrink-0 mt-0.5" />
-                  <span>{{ $t('admin.inbox.livechat.homeScreen.headerTextColor.contrastWarning') }}</span>
+                  <span>{{
+                    $t('admin.inbox.livechat.homeScreen.headerTextColor.contrastWarning')
+                  }}</span>
                 </p>
               </FormItem>
             </FormField>
@@ -280,7 +330,11 @@
               <FormItem>
                 <FormLabel>{{ $t('globals.terms.background') }}</FormLabel>
                 <FormControl>
-                  <RadioGroup v-bind="componentField" @update:model-value="onBackgroundTypeChange" class="flex gap-4">
+                  <RadioGroup
+                    v-bind="componentField"
+                    @update:model-value="onBackgroundTypeChange"
+                    class="flex gap-4"
+                  >
                     <div class="flex items-center space-x-2">
                       <RadioGroupItem id="bg-solid" value="solid" />
                       <Label for="bg-solid">{{ $t('globals.terms.solid') }}</Label>
@@ -298,8 +352,15 @@
               </FormItem>
             </FormField>
 
-            <div v-if="form.values.config?.home_screen?.background?.type === 'solid'" class="grid grid-cols-2 gap-4">
-              <FormField v-slot="{ componentField }" name="config.home_screen.background.color" keep-value>
+            <div
+              v-if="form.values.config?.home_screen?.background?.type === 'solid'"
+              class="grid grid-cols-2 gap-4"
+            >
+              <FormField
+                v-slot="{ componentField }"
+                name="config.home_screen.background.color"
+                keep-value
+              >
                 <FormItem>
                   <FormLabel>{{ $t('globals.messages.backgroundColor') }}</FormLabel>
                   <FormControl>
@@ -310,8 +371,15 @@
               </FormField>
             </div>
 
-            <div v-if="form.values.config?.home_screen?.background?.type === 'gradient'" class="grid grid-cols-2 gap-4">
-              <FormField v-slot="{ componentField }" name="config.home_screen.background.gradient_start" keep-value>
+            <div
+              v-if="form.values.config?.home_screen?.background?.type === 'gradient'"
+              class="grid grid-cols-2 gap-4"
+            >
+              <FormField
+                v-slot="{ componentField }"
+                name="config.home_screen.background.gradient_start"
+                keep-value
+              >
                 <FormItem>
                   <FormLabel>{{ $t('globals.messages.gradientStart') }}</FormLabel>
                   <FormControl>
@@ -320,7 +388,11 @@
                   <FormMessage />
                 </FormItem>
               </FormField>
-              <FormField v-slot="{ componentField }" name="config.home_screen.background.gradient_end" keep-value>
+              <FormField
+                v-slot="{ componentField }"
+                name="config.home_screen.background.gradient_end"
+                keep-value
+              >
                 <FormItem>
                   <FormLabel>{{ $t('globals.messages.gradientEnd') }}</FormLabel>
                   <FormControl>
@@ -331,17 +403,29 @@
               </FormField>
             </div>
 
-            <FormField v-if="form.values.config?.home_screen?.background?.type === 'image'" v-slot="{ componentField }" name="config.home_screen.background.image_url" keep-value>
+            <FormField
+              v-if="form.values.config?.home_screen?.background?.type === 'image'"
+              v-slot="{ componentField }"
+              name="config.home_screen.background.image_url"
+              keep-value
+            >
               <FormItem>
                 <FormLabel>{{ $t('globals.messages.backgroundImageUrl') }}</FormLabel>
                 <FormControl>
-                  <Input type="url" placeholder="https://example.com/background.jpg" v-bind="componentField" />
+                  <Input
+                    type="url"
+                    placeholder="https://example.com/background.jpg"
+                    v-bind="componentField"
+                  />
                 </FormControl>
                 <FormMessage />
               </FormItem>
             </FormField>
 
-            <FormField v-slot="{ componentField, handleChange }" name="config.home_screen.fade_background">
+            <FormField
+              v-slot="{ componentField, handleChange }"
+              name="config.home_screen.fade_background"
+            >
               <FormItem>
                 <SwitchField
                   :title="$t('admin.inbox.livechat.homeScreen.fadeBackground')"
@@ -353,14 +437,22 @@
             </FormField>
           </div>
 
-          <!-- Home Screen Apps -->
           <div class="space-y-4">
-            <h4 class="text-base font-semibold text-foreground">{{ $t('globals.terms.homeScreenApp', 2) }}</h4>
+            <h4 class="text-base font-semibold text-foreground">
+              {{ $t('globals.terms.homeScreenApp', 2) }}
+            </h4>
 
             <FormField name="config.home_apps">
               <FormItem>
                 <div class="space-y-3">
-                  <Draggable v-model="homeApps" item-key="index" :animation="200" handle=".drag-handle" class="space-y-3" @change="updateHomeApps">
+                  <Draggable
+                    v-model="homeApps"
+                    item-key="index"
+                    :animation="200"
+                    handle=".drag-handle"
+                    class="space-y-3"
+                    @change="updateHomeApps"
+                  >
                     <template #item="{ element: item, index }">
                       <div class="flex items-start gap-2 p-3 border rounded-md">
                         <div class="drag-handle cursor-move text-muted-foreground pt-2">
@@ -370,26 +462,64 @@
                           <div class="text-xs text-muted-foreground mb-2">
                             {{ homeAppLabel(item.type) }}
                           </div>
-                          <!-- Help articles card has nothing to fill in; it renders from the Help tab. -->
                           <p v-if="item.type === 'help'" class="text-sm text-muted-foreground">
                             {{ $t('widget.helpHomeAppHint') }}
                           </p>
-                          <!-- Announcement fields -->
                           <div v-else-if="item.type === 'announcement'" class="flex flex-col gap-2">
-                            <Input v-model="item.title" :placeholder="$t('globals.terms.title')" @change="updateHomeApps" />
-                            <Textarea v-model="item.description" :placeholder="$t('globals.terms.description')" rows="6" @change="updateHomeApps" />
+                            <Input
+                              v-model="item.title"
+                              :placeholder="$t('globals.terms.title')"
+                              @change="updateHomeApps"
+                            />
+                            <Textarea
+                              v-model="item.description"
+                              :placeholder="$t('globals.terms.description')"
+                              rows="6"
+                              @change="updateHomeApps"
+                            />
                             <div class="grid grid-cols-2 gap-2">
-                              <Input v-model="item.image_url" type="url" :placeholder="$t('globals.messages.coverImageUrl')" @change="updateHomeApps" />
-                              <Input v-model="item.url" type="url" :placeholder="$t('globals.messages.linkUrl')" @change="updateHomeApps" />
+                              <Input
+                                v-model="item.image_url"
+                                type="url"
+                                :placeholder="$t('globals.messages.coverImageUrl')"
+                                @change="updateHomeApps"
+                              />
+                              <Input
+                                v-model="item.url"
+                                type="url"
+                                :placeholder="$t('globals.messages.linkUrl')"
+                                @change="updateHomeApps"
+                              />
                             </div>
                           </div>
-                          <!-- External link fields -->
-                          <div v-else-if="item.type === 'external_link'" class="grid grid-cols-2 gap-2">
-                            <Input v-model="item.text" :placeholder="$t('placeholders.linkText')" @change="updateHomeApps" />
-                            <Input v-model="item.url" placeholder="https://example.com" @change="updateHomeApps" />
+                          <div
+                            v-else-if="item.type === 'external_link'"
+                            class="grid grid-cols-3 gap-2"
+                          >
+                            <Input
+                              v-model="item.text"
+                              :placeholder="$t('placeholders.linkText')"
+                              @change="updateHomeApps"
+                            />
+                            <Input
+                              v-model="item.url"
+                              placeholder="https://example.com"
+                              @change="updateHomeApps"
+                            />
+                            <Input
+                              v-model="item.image_url"
+                              type="url"
+                              :placeholder="$t('globals.terms.logoUrl')"
+                              @change="updateHomeApps"
+                            />
                           </div>
                         </div>
-                        <Button type="button" variant="ghost" size="sm" @click="removeHomeApp(index)">
+                        <Button
+                          type="button"
+                          variant="ghost"
+                          size="sm"
+                          @click="removeHomeApp(index)"
+                        >
                           <X class="w-4 h-4" />
                         </Button>
                       </div>
@@ -397,12 +527,22 @@
                   </Draggable>
 
                   <div class="flex gap-2">
-                    <Button type="button" variant="outline" size="sm" @click="addHomeApp('announcement')">
-                      <Plus class="w-4 h-4"/>
+                    <Button
+                      type="button"
+                      variant="outline"
+                      size="sm"
+                      @click="addHomeApp('announcement')"
+                    >
+                      <Plus class="w-4 h-4" />
                       {{ $t('globals.messages.addAnnouncement') }}
                     </Button>
-                    <Button type="button" variant="outline" size="sm" @click="addHomeApp('external_link')">
-                      <Plus class="w-4 h-4"/>
+                    <Button
+                      type="button"
+                      variant="outline"
+                      size="sm"
+                      @click="addHomeApp('external_link')"
+                    >
+                      <Plus class="w-4 h-4" />
                       {{ $t('globals.messages.addExternalLink') }}
                     </Button>
                     <Button
@@ -412,14 +552,20 @@
                       :disabled="!form.values.config.help?.help_center_id || hasHelpHomeApp"
                       @click="addHomeApp('help')"
                     >
-                      <Plus class="w-4 h-4"/>
+                      <Plus class="w-4 h-4" />
                       {{ $t('widget.addHelpHomeApp') }}
                     </Button>
                   </div>
-                  <p v-if="!form.values.config.help?.help_center_id" class="text-xs text-muted-foreground">
+                  <p
+                    v-if="!form.values.config.help?.help_center_id"
+                    class="text-xs text-muted-foreground"
+                  >
                     {{ $t('widget.helpHomeAppRequiresCenter') }}
                   </p>
-                  <p v-if="showHomeAppsError && incompleteHomeApps" class="text-sm text-destructive flex items-start gap-1.5">
+                  <p
+                    v-if="showHomeAppsError && incompleteHomeApps"
+                    class="text-sm text-destructive flex items-start gap-1.5"
+                  >
                     <TriangleAlert class="size-4 shrink-0 mt-0.5" />
                     <span>{{ $t('admin.inbox.livechat.homeApps.incomplete') }}</span>
                   </p>
@@ -431,7 +577,9 @@
 
           <!-- Launcher Configuration -->
           <div class="space-y-4">
-            <h4 class="text-base font-semibold text-foreground">{{ $t('admin.inbox.livechat.launcher') }}</h4>
+            <h4 class="text-base font-semibold text-foreground">
+              {{ $t('admin.inbox.livechat.launcher') }}
+            </h4>
 
             <div class="grid grid-cols-2 gap-4">
               <FormField v-slot="{ componentField }" name="config.launcher.position">
@@ -488,7 +636,13 @@
                 <FormItem>
                   <FormLabel>{{ $t('admin.inbox.livechat.launcher.spacing.side') }}</FormLabel>
                   <FormControl>
-                    <Input type="number" placeholder="20" min="0" max="200" v-bind="componentField" />
+                    <Input
+                      type="number"
+                      placeholder="20"
+                      min="0"
+                      max="200"
+                      v-bind="componentField"
+                    />
                   </FormControl>
                   <FormDescription>{{
                     $t('admin.inbox.livechat.launcher.spacing.side.description')
@@ -501,7 +655,13 @@
                 <FormItem>
                   <FormLabel>{{ $t('admin.inbox.livechat.launcher.spacing.bottom') }}</FormLabel>
                   <FormControl>
-                    <Input type="number" placeholder="20" min="0" max="200" v-bind="componentField" />
+                    <Input
+                      type="number"
+                      placeholder="20"
+                      min="0"
+                      max="200"
+                      v-bind="componentField"
+                    />
                   </FormControl>
                   <FormDescription>{{
                     $t('admin.inbox.livechat.launcher.spacing.bottom.description')
@@ -536,7 +696,11 @@
             <FormItem>
               <FormLabel>{{ $t('admin.inbox.livechat.introductionMessage') }}</FormLabel>
               <FormControl>
-                <Textarea v-bind="componentField" :placeholder="$t('placeholders.introductionMessage')" rows="2" />
+                <Textarea
+                  v-bind="componentField"
+                  :placeholder="$t('placeholders.introductionMessage')"
+                  rows="2"
+                />
               </FormControl>
               <FormDescription>{{
                 $t('admin.inbox.livechat.greetingMessage.variables')
@@ -627,7 +791,9 @@
               <FormItem>
                 <SwitchField
                   :title="$t('admin.inbox.livechat.showOfficeHoursAfterAssignment')"
-                  :description="$t('admin.inbox.livechat.showOfficeHoursAfterAssignment.description')"
+                  :description="
+                    $t('admin.inbox.livechat.showOfficeHoursAfterAssignment.description')
+                  "
                   :checked="componentField.modelValue"
                   :disabled="!form.values.config.show_office_hours_in_chat"
                   @update:checked="handleChange"
@@ -656,18 +822,56 @@
           <!-- Chat Features -->
           <div class="space-y-4">
             <h4 class="text-base font-semibold">{{ $t('widget.replyPreviews') }}</h4>
-            <FormField v-for="device in ['desktop', 'mobile']" :key="device" v-slot="{ componentField, handleChange }" :name="`config.previews.${device}`">
-              <FormItem><SwitchField :title="$t(`globals.terms.${device}`)" :checked="componentField.modelValue" @update:checked="handleChange" /></FormItem>
+            <FormField
+              v-for="device in ['desktop', 'mobile']"
+              :key="device"
+              v-slot="{ componentField, handleChange }"
+              :name="`config.previews.${device}`"
+            >
+              <FormItem
+                ><SwitchField
+                  :title="$t(`globals.terms.${device}`)"
+                  :checked="componentField.modelValue"
+                  @update:checked="handleChange"
+              /></FormItem>
             </FormField>
             <FormField v-slot="{ componentField }" name="config.previews.content">
-              <FormItem><FormLabel>{{ $t('widget.previewContent') }}</FormLabel><Select v-bind="componentField"><SelectTrigger><SelectValue /></SelectTrigger><SelectContent><SelectItem value="message">{{ $t('widget.messagePreview') }}</SelectItem><SelectItem value="generic">{{ $t('widget.genericNotice') }}</SelectItem></SelectContent></Select><FormMessage /></FormItem>
+              <FormItem
+                ><FormLabel>{{ $t('widget.previewContent') }}</FormLabel
+                ><Select v-bind="componentField"
+                  ><SelectTrigger><SelectValue /></SelectTrigger
+                  ><SelectContent
+                    ><SelectItem value="message">{{ $t('widget.messagePreview') }}</SelectItem
+                    ><SelectItem value="generic">{{
+                      $t('widget.genericNotice')
+                    }}</SelectItem></SelectContent
+                  ></Select
+                ><FormMessage
+              /></FormItem>
             </FormField>
-            <FormField v-slot="{ value, handleChange, meta }" name="config.previews.auto_hide_seconds">
-              <FormItem><FormLabel>{{ $t('widget.autoHideSeconds') }}</FormLabel><FormControl><Input type="number" min="0" max="300" :model-value="value" @update:model-value="value => handleChange(Number(value), meta.validated)" /></FormControl><FormMessage /></FormItem>
+            <FormField
+              v-slot="{ value, handleChange, meta }"
+              name="config.previews.auto_hide_seconds"
+            >
+              <FormItem
+                ><FormLabel>{{ $t('widget.autoHideSeconds') }}</FormLabel
+                ><FormControl
+                  ><Input
+                    type="number"
+                    min="0"
+                    max="300"
+                    :model-value="value"
+                    @update:model-value="
+                      (value) => handleChange(Number(value), meta.validated)
+                    " /></FormControl
+                ><FormMessage
+              /></FormItem>
             </FormField>
           </div>
           <div class="space-y-4">
-            <h4 class="text-base font-semibold text-foreground">{{ $t('globals.terms.features') }}</h4>
+            <h4 class="text-base font-semibold text-foreground">
+              {{ $t('globals.terms.features') }}
+            </h4>
 
             <div class="space-y-3">
               <FormField
@@ -695,20 +899,13 @@
                 </FormItem>
               </FormField>
 
-              <FormField v-slot="{ componentField, handleChange }" name="config.features.transcript">
-                <FormItem>
-                  <SwitchField :title="$t('conversation.downloadTranscript')" :checked="componentField.modelValue" @update:checked="handleChange" />
-                </FormItem>
-              </FormField>
-
               <FormField
                 v-slot="{ componentField, handleChange }"
-                name="config.direct_to_conversation"
+                name="config.features.transcript"
               >
                 <FormItem>
                   <SwitchField
-                    :title="$t('admin.inbox.livechat.directToConversation')"
-                    :description="$t('admin.inbox.livechat.directToConversation.description')"
+                    :title="$t('conversation.downloadTranscript')"
                     :checked="componentField.modelValue"
                     @update:checked="handleChange"
                   />
@@ -721,18 +918,15 @@
         <!-- Proactive messages Tab -->
         <div v-show="activeTab === 'campaigns'" class="space-y-3">
           <WidgetCampaigns
+            ref="campaignsRef"
             :model-value="form.values.config.campaigns || []"
             :inbox-id="initialValues.id || 0"
-            :cooldown="form.values.config.campaign_cooldown_hours || 24"
-            @update:model-value="form.setFieldValue('config.campaigns', $event, false)"
-            @update:cooldown="form.setFieldValue('config.campaign_cooldown_hours', $event, false)"
+            :cooldown="form.values.config.campaign_cooldown_hours ?? 24"
+            :show-errors="showCampaignErrors"
+            @update:model-value="updateCampaigns"
+            @update:cooldown="updateCampaignCooldown"
             @update:preview="previewCampaign = $event"
           />
-          <template v-for="(error, field) in form.errors.value" :key="field">
-            <p v-if="field.startsWith('config.campaign')" role="alert" class="text-sm text-destructive">
-              {{ error }}
-            </p>
-          </template>
         </div>
 
         <!-- Help Tab -->
@@ -766,7 +960,10 @@
                   $t('admin.inbox.livechat.secretKey.description')
                 }}</FormDescription>
                 <FormMessage />
-                <p v-if="weakSecret" class="!mt-2 text-muted-foreground text-xs flex items-start gap-1.5">
+                <p
+                  v-if="weakSecret"
+                  class="!mt-2 text-muted-foreground text-xs flex items-start gap-1.5"
+                >
                   <TriangleAlert class="size-4 shrink-0 mt-0.5" />
                   <span>{{ $t('admin.inbox.livechat.secretKey.weak') }}</span>
                 </p>
@@ -779,7 +976,9 @@
                 <FormControl>
                   <Input type="text" placeholder="10h" v-bind="componentField" />
                 </FormControl>
-                <FormDescription>{{ $t('admin.inbox.livechat.sessionDuration.description') }}</FormDescription>
+                <FormDescription>{{
+                  $t('admin.inbox.livechat.sessionDuration.description')
+                }}</FormDescription>
                 <FormMessage />
               </FormItem>
             </FormField>
@@ -851,12 +1050,46 @@
                       $t('admin.inbox.livechat.startConversationButtonText')
                     }}</FormLabel>
                     <FormControl>
-                      <Input v-bind="componentField" :placeholder="$t('placeholders.startConversation')" />
+                      <Input
+                        v-bind="componentField"
+                        :placeholder="$t('placeholders.startConversation')"
+                      />
                     </FormControl>
                     <FormMessage />
                   </FormItem>
                 </FormField>
 
+                <FormField v-slot="{ componentField }" name="config.visitors.quick_replies">
+                  <FormItem>
+                    <FormLabel>{{ $t('admin.inbox.livechat.quickReplies') }}</FormLabel>
+                    <FormControl>
+                      <Textarea
+                        v-bind="componentField"
+                        :placeholder="$t('admin.inbox.livechat.quickReplies.placeholder')"
+                        rows="3"
+                      />
+                    </FormControl>
+                    <FormDescription>{{
+                      $t('admin.inbox.livechat.quickReplies.description')
+                    }}</FormDescription>
+                    <FormMessage />
+                  </FormItem>
+                </FormField>
+
+                <FormField
+                  v-slot="{ componentField, handleChange }"
+                  name="config.visitors.direct_to_conversation"
+                >
+                  <FormItem>
+                    <SwitchField
+                      :title="$t('admin.inbox.livechat.directToConversation')"
+                      :description="$t('admin.inbox.livechat.directToConversation.description')"
+                      :checked="componentField.modelValue"
+                      @update:checked="handleChange"
+                    />
+                  </FormItem>
+                </FormField>
+
                 <FormField
                   v-slot="{ componentField, handleChange }"
                   name="config.visitors.allow_start_conversation"
@@ -864,7 +1097,9 @@
                   <FormItem>
                     <SwitchField
                       :title="$t('admin.inbox.livechat.allowStartConversation')"
-                      :description="$t('admin.inbox.livechat.allowStartConversation.visitors.description')"
+                      :description="
+                        $t('admin.inbox.livechat.allowStartConversation.visitors.description')
+                      "
                       :checked="componentField.modelValue"
                       @update:checked="handleChange"
                     />
@@ -878,7 +1113,9 @@
                   <FormItem>
                     <SwitchField
                       :title="$t('admin.inbox.livechat.preventMultipleConversations')"
-                      :description="$t('admin.inbox.livechat.preventMultipleConversations.visitors.description')"
+                      :description="
+                        $t('admin.inbox.livechat.preventMultipleConversations.visitors.description')
+                      "
                       :checked="componentField.modelValue"
                       @update:checked="handleChange"
                     />
@@ -892,7 +1129,9 @@
                   <FormItem>
                     <SwitchField
                       :title="$t('admin.inbox.livechat.preventReplyToClosedConversation')"
-                      :description="$t('admin.inbox.livechat.preventReplyToClosedConversation.description')"
+                      :description="
+                        $t('admin.inbox.livechat.preventReplyToClosedConversation.description')
+                      "
                       :checked="componentField.modelValue"
                       @update:checked="handleChange"
                     />
@@ -911,12 +1150,46 @@
                       $t('admin.inbox.livechat.startConversationButtonText')
                     }}</FormLabel>
                     <FormControl>
-                      <Input v-bind="componentField" :placeholder="$t('placeholders.startConversation')" />
+                      <Input
+                        v-bind="componentField"
+                        :placeholder="$t('placeholders.startConversation')"
+                      />
                     </FormControl>
                     <FormMessage />
                   </FormItem>
                 </FormField>
 
+                <FormField v-slot="{ componentField }" name="config.users.quick_replies">
+                  <FormItem>
+                    <FormLabel>{{ $t('admin.inbox.livechat.quickReplies') }}</FormLabel>
+                    <FormControl>
+                      <Textarea
+                        v-bind="componentField"
+                        :placeholder="$t('admin.inbox.livechat.quickReplies.placeholder')"
+                        rows="3"
+                      />
+                    </FormControl>
+                    <FormDescription>{{
+                      $t('admin.inbox.livechat.quickReplies.description')
+                    }}</FormDescription>
+                    <FormMessage />
+                  </FormItem>
+                </FormField>
+
+                <FormField
+                  v-slot="{ componentField, handleChange }"
+                  name="config.users.direct_to_conversation"
+                >
+                  <FormItem>
+                    <SwitchField
+                      :title="$t('admin.inbox.livechat.directToConversation')"
+                      :description="$t('admin.inbox.livechat.directToConversation.description')"
+                      :checked="componentField.modelValue"
+                      @update:checked="handleChange"
+                    />
+                  </FormItem>
+                </FormField>
+
                 <FormField
                   v-slot="{ componentField, handleChange }"
                   name="config.users.allow_start_conversation"
@@ -924,7 +1197,9 @@
                   <FormItem>
                     <SwitchField
                       :title="$t('admin.inbox.livechat.allowStartConversation')"
-                      :description="$t('admin.inbox.livechat.allowStartConversation.users.description')"
+                      :description="
+                        $t('admin.inbox.livechat.allowStartConversation.users.description')
+                      "
                       :checked="componentField.modelValue"
                       @update:checked="handleChange"
                     />
@@ -938,7 +1213,9 @@
                   <FormItem>
                     <SwitchField
                       :title="$t('admin.inbox.livechat.preventMultipleConversations')"
-                      :description="$t('admin.inbox.livechat.preventMultipleConversations.users.description')"
+                      :description="
+                        $t('admin.inbox.livechat.preventMultipleConversations.users.description')
+                      "
                       :checked="componentField.modelValue"
                       @update:checked="handleChange"
                     />
@@ -952,7 +1229,9 @@
                   <FormItem>
                     <SwitchField
                       :title="$t('admin.inbox.livechat.preventReplyToClosedConversation')"
-                      :description="$t('admin.inbox.livechat.preventReplyToClosedConversation.description')"
+                      :description="
+                        $t('admin.inbox.livechat.preventReplyToClosedConversation.description')
+                      "
                       :checked="componentField.modelValue"
                       @update:checked="handleChange"
                     />
@@ -1011,10 +1290,7 @@
                 language="html"
                 :readOnly="true"
               />
-              <CopyButton
-                :text="authenticatedIntegrationSnippet"
-                class="absolute top-3 right-3"
-              />
+              <CopyButton :text="authenticatedIntegrationSnippet" class="absolute top-3 right-3" />
             </div>
 
             <p class="text-sm text-destructive flex items-center gap-1.5">
@@ -1049,10 +1325,16 @@
 </template>
 
 <script setup>
-import { watch, computed, ref, inject, onMounted, onBeforeUnmount } from 'vue'
+import { watch, computed, ref, inject, onMounted, onBeforeUnmount, nextTick } from 'vue'
 import { useForm } from 'vee-validate'
 import { toTypedSchema } from '@vee-validate/zod'
-import { createFormSchema, defaultWidgetHelp, defaultWidgetPreviews } from './livechatFormSchema.js'
+import {
+  createFormSchema,
+  defaultWidgetHelp,
+  defaultWidgetPreviews,
+  normalizeAudienceConfig,
+  normalizePrechatConfig
+} from './livechatFormSchema.js'
 import WidgetHelpConfig from './WidgetHelpConfig.vue'
 import { useHelpCenterArticles } from './useHelpCenterArticles.js'
 import WidgetCampaigns from './WidgetCampaigns.vue'
@@ -1100,6 +1382,7 @@ const HEX_COLOR = /^#([0-9a-f]{6}|[0-9a-f]{3})$/i
 const WIDGET_BG = { light: '#ffffff', dark: '#1a1a1e' }
 const DEFAULT_GRADIENT_START = '#2563eb'
 const DEFAULT_GRADIENT_END = '#1e40af'
+const MASKED_SECRET = '••••••••••'
 
 const TABS = [
   'general',
@@ -1129,6 +1412,7 @@ const FIELD_TAB = [
   ['config.greeting_message', 'messages'],
   ['config.introduction_message', 'messages'],
   ['config.chat_introduction', 'messages'],
+  ['config.quick_replies', 'messages'],
   ['config.chat_reply_expectation_message', 'features'],
   ['config.features', 'features'],
   ['config.prechat_form', 'prechat'],
@@ -1142,7 +1426,7 @@ const FIELD_TAB = [
   ['config.brand_name', 'general'],
   ['config.website_url', 'general'],
   ['config.language', 'general'],
-  ['name', 'general'],
+  ['name', 'general']
 ]
 
 const props = defineProps({
@@ -1181,8 +1465,19 @@ const selectedUserTab = ref('visitors')
 const homeApps = ref([])
 const prechatConfig = ref({
   enabled: false,
+  handoff_only: false,
   title: '',
-  fields: getDefaultPrechatFields()
+  fields: getDefaultPrechatFields(),
+  visitors: {
+    enabled: true,
+    title: '',
+    fields: getDefaultPrechatFields()
+  },
+  users: {
+    enabled: true,
+    title: '',
+    fields: getDefaultPrechatFields()
+  }
 })
 
 const inboxStore = useInboxStore()
@@ -1261,7 +1556,8 @@ const form = useForm({
     config: {
       help: defaultWidgetHelp(),
       previews: defaultWidgetPreviews(),
-      campaigns: [], campaign_cooldown_hours: 24,
+      campaigns: [],
+      campaign_cooldown_hours: 24,
       brand_name: '',
       website_url: '',
       dark_mode: false,
@@ -1281,6 +1577,7 @@ const form = useForm({
       greeting_message: 'Hello {{.FirstName | there}}',
       introduction_message: 'How can we help?',
       chat_introduction: 'Ask us anything, or share your feedback.',
+      quick_replies: '',
       show_office_hours_in_chat: false,
       show_office_hours_after_assignment: false,
       chat_reply_expectation_message: 'We typically reply in 5 minutes.',
@@ -1321,25 +1618,43 @@ const form = useForm({
         start_conversation_button_text: 'Start conversation',
         allow_start_conversation: true,
         prevent_multiple_conversations: false,
-        prevent_reply_to_closed_conversation: false
+        prevent_reply_to_closed_conversation: false,
+        quick_replies: '',
+        direct_to_conversation: false
       },
       users: {
         start_conversation_button_text: 'Start conversation',
         allow_start_conversation: true,
         prevent_multiple_conversations: false,
-        prevent_reply_to_closed_conversation: false
+        prevent_reply_to_closed_conversation: false,
+        quick_replies: '',
+        direct_to_conversation: false
       },
       prechat_form: {
         enabled: false,
+        handoff_only: false,
         title: '',
-        fields: getDefaultPrechatFields()
+        fields: getDefaultPrechatFields(),
+        visitors: {
+          enabled: true,
+          title: '',
+          fields: getDefaultPrechatFields()
+        },
+        users: {
+          enabled: true,
+          title: '',
+          fields: getDefaultPrechatFields()
+        }
       }
     }
   }
 })
 
 const submitLabel = computed(() => {
-  return props.submitLabel || (props.isNewForm ? t('globals.messages.create') : t('globals.messages.save'))
+  return (
+    props.submitLabel ||
+    (props.isNewForm ? t('globals.messages.create') : t('globals.messages.save'))
+  )
 })
 
 const lowHeaderContrast = computed(() => {
@@ -1349,8 +1664,7 @@ const lowHeaderContrast = computed(() => {
   const textColor = hs.header_text_color === 'black' ? '#000000' : '#ffffff'
   const pageBg = form.values.config?.dark_mode ? WIDGET_BG.dark : WIDGET_BG.light
   // An empty/unset color renders the widget's page background, so measure against that.
-  const isLow = (bg) =>
-    HEX_COLOR.test(bg) && contrastRatio(textColor, bg) < MIN_CONTRAST
+  const isLow = (bg) => HEX_COLOR.test(bg) && contrastRatio(textColor, bg) < MIN_CONTRAST
 
   switch (hs.background.type) {
     case 'solid':
@@ -1375,7 +1689,7 @@ const lowPrimaryContrast = computed(() => {
 // minimum would force rotating existing secrets and break live integrations.
 const weakSecret = computed(() => {
   const s = form.values.secret
-  return typeof s === 'string' && s.length > 0 && s.length < 32
+  return typeof s === 'string' && s !== MASKED_SECRET && s.length > 0 && s.length < 32
 })
 
 const helpCenters = ref([])
@@ -1388,6 +1702,15 @@ const {
 
 // The campaign the admin is editing, mirrored in the preview as an invitation card.
 const previewCampaign = ref(null)
+const campaignsRef = ref(null)
+const showCampaignErrors = ref(false)
+const hasCampaignErrors = computed(() =>
+  Object.keys(form.errors.value).some((field) => field.startsWith('config.campaign'))
+)
+const updateCampaigns = (campaigns) =>
+  form.setFieldValue('config.campaigns', campaigns, hasCampaignErrors.value)
+const updateCampaignCooldown = (hours) =>
+  form.setFieldValue('config.campaign_cooldown_hours', hours, hasCampaignErrors.value)
 
 // home_apps in form.values only syncs on change events, so pull the live ref for the preview.
 const previewConfig = computed(() => ({
@@ -1426,11 +1749,17 @@ const onBackgroundTypeChange = (type) => {
 
 const addHomeApp = (type) => {
   if (type === 'announcement') {
-    homeApps.value.push({ type: 'announcement', title: '', description: '', image_url: '', url: '' })
+    homeApps.value.push({
+      type: 'announcement',
+      title: '',
+      description: '',
+      image_url: '',
+      url: ''
+    })
   } else if (type === 'help') {
     homeApps.value.push({ type: 'help' })
   } else {
-    homeApps.value.push({ type: 'external_link', text: '', url: '' })
+    homeApps.value.push({ type: 'external_link', text: '', url: '', image_url: '' })
   }
   updateHomeApps()
 }
@@ -1458,7 +1787,7 @@ const isHomeAppEmpty = (item) => {
   if (item.type === 'help') return false
   return item.type === 'announcement'
     ? !item.title && !item.description && !item.image_url && !item.url
-    : !item.text && !item.url
+    : !item.text && !item.url && !item.image_url
 }
 
 const isHomeAppComplete = (item) => {
@@ -1468,17 +1797,19 @@ const isHomeAppComplete = (item) => {
     : Boolean(item.text && item.url)
 }
 
-// A row with some data but missing required fields, so submit is blocked instead of
-// silently dropping what the user typed. Fully empty rows are dropped on submit.
 const incompleteHomeApps = computed(() =>
   homeApps.value.some((item) => !isHomeAppEmpty(item) && !isHomeAppComplete(item))
 )
 
-// Only surface the incomplete warning after a save attempt, not while the user is still typing.
 const showHomeAppsError = ref(false)
 
 const textareaToLines = (value) =>
-  typeof value === 'string' ? value.split('\n').map((line) => line.trim()).filter(Boolean) : []
+  typeof value === 'string'
+    ? value
+        .split('\n')
+        .map((line) => line.trim())
+        .filter(Boolean)
+    : []
 
 onMounted(async () => {
   inboxStore.fetchInboxes()
@@ -1490,42 +1821,60 @@ onMounted(async () => {
   }
 })
 
-const onSubmit = form.handleSubmit(async (values) => {
-  values.config.trusted_domains = textareaToLines(values.config.trusted_domains)
-  values.config.blocked_ips = textareaToLines(values.config.blocked_ips)
+const onSubmit = form.handleSubmit(
+  async (values) => {
+    showCampaignErrors.value = false
+    values.config.trusted_domains = textareaToLines(values.config.trusted_domains)
+    values.config.quick_replies = textareaToLines(values.config.quick_replies)
+    values.config.visitors.quick_replies = textareaToLines(values.config.visitors.quick_replies)
+    values.config.users.quick_replies = textareaToLines(values.config.users.quick_replies)
+    values.config.blocked_ips = textareaToLines(values.config.blocked_ips)
 
-  // Block on partially-filled home apps so typed data isn't silently discarded;
-  // drop only fully empty rows.
-  if (incompleteHomeApps.value) {
-    showHomeAppsError.value = true
-    activeTab.value = 'appearance'
-    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
-      variant: 'destructive',
-      description: t('admin.inbox.livechat.homeApps.incomplete')
-    })
-    return
+    // Reject partially filled rows to avoid silently discarding typed values.
+    if (incompleteHomeApps.value) {
+      showHomeAppsError.value = true
+      activeTab.value = 'appearance'
+      emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+        variant: 'destructive',
+        description: t('admin.inbox.livechat.homeApps.incomplete')
+      })
+      return
+    }
+    values.config.home_apps = homeApps.value.filter((item) => !isHomeAppEmpty(item))
+
+    if (!values.linked_email_inbox_id) {
+      values.linked_email_inbox_id = null
+      values.config.continuity = {}
+    }
+
+    const pc = JSON.parse(JSON.stringify(prechatConfig.value))
+    for (const audience of ['visitors', 'users']) {
+      const audienceConfig = pc[audience]
+      if (
+        audienceConfig.enabled &&
+        audienceConfig.fields?.length > 0 &&
+        !audienceConfig.fields.some((field) => field.enabled)
+      ) {
+        audienceConfig.enabled = false
+      }
+    }
+    pc.title = pc.visitors.title
+    pc.fields = pc.visitors.fields
+    values.config.prechat_form = pc
+
+    await props.submitForm(values)
+  },
+  ({ errors }) => {
+    const firstKey = Object.keys(errors)[0]
+    if (!firstKey) return
+    const match = FIELD_TAB.find(([prefix]) => firstKey === prefix || firstKey.startsWith(prefix))
+    if (match) activeTab.value = match[1]
+    if (firstKey.startsWith('config.campaign')) {
+      showCampaignErrors.value = true
+      nextTick(() => campaignsRef.value?.showInvalidField(firstKey))
+    }
   }
-  values.config.home_apps = homeApps.value.filter((item) => !isHomeAppEmpty(item))
-
-  if (!values.linked_email_inbox_id) {
-    values.linked_email_inbox_id = null
-    values.config.continuity = {}
-  }
-
-  // Treat an enabled prechat form with no enabled fields as disabled.
-  const pc = { ...prechatConfig.value }
-  if (pc.enabled && pc.fields?.length > 0 && !pc.fields.some((f) => f.enabled)) {
-    pc.enabled = false
-  }
-  values.config.prechat_form = pc
-
-  await props.submitForm(values)
-}, ({ errors }) => {
-  const firstKey = Object.keys(errors)[0]
-  if (!firstKey) return
-  const match = FIELD_TAB.find(([prefix]) => firstKey === prefix || firstKey.startsWith(prefix))
-  if (match) activeTab.value = match[1]
-})
+)
 
 watch(
   () => props.initialValues,
@@ -1538,6 +1887,17 @@ watch(
       newValues.config.trusted_domains = newValues.config.trusted_domains.join('\n')
     }
 
+    if (Array.isArray(newValues.config?.quick_replies)) {
+      newValues.config.quick_replies = newValues.config.quick_replies.join('\n')
+    }
+
+    const audienceConfigs = Object.fromEntries(
+      ['visitors', 'users'].map((audience) => [
+        audience,
+        normalizeAudienceConfig(newValues.config, audience)
+      ])
+    )
+
     if (Array.isArray(newValues.config?.blocked_ips)) {
       newValues.config.blocked_ips = newValues.config.blocked_ips.join('\n')
     }
@@ -1547,23 +1907,44 @@ watch(
       homeApps.value = newValues.config.home_apps.map((app) => ({ ...app }))
     }
 
-    if (newValues.config?.prechat_form) {
-      const pc = JSON.parse(JSON.stringify(newValues.config.prechat_form))
-      if (!pc.fields || pc.fields.length === 0) {
-        pc.fields = getDefaultPrechatFields()
-      } else {
-        // Backfill default fields (e.g. phone) missing from inboxes saved before the field existed.
-        const existingKeys = new Set(pc.fields.map((field) => field.key))
-        let nextOrder = pc.fields.reduce((max, field) => Math.max(max, field.order || 0), 0)
+    let pc = newValues.config?.prechat_form
+    if (pc) {
+      pc = normalizePrechatConfig(pc)
+      for (const audience of ['visitors', 'users']) {
+        const existingFields = pc[audience].fields
+        if (existingFields.length === 0) {
+          pc[audience].fields = getDefaultPrechatFields()
+          continue
+        }
+        const existingKeys = new Set(existingFields.map((field) => field.key))
+        let nextOrder = existingFields.reduce((max, field) => Math.max(max, field.order || 0), 0)
         const missing = getDefaultPrechatFields()
           .filter((field) => !existingKeys.has(field.key))
           .map((field) => ({ ...field, order: ++nextOrder }))
-        pc.fields = [...pc.fields, ...missing]
+        pc[audience].fields = [...existingFields, ...missing]
       }
       prechatConfig.value = pc
     }
 
-    form.setValues({ ...newValues, config: { ...newValues.config, campaigns: newValues.config?.campaigns || [], campaign_cooldown_hours: newValues.config?.campaign_cooldown_hours || 24, help: newValues.config?.help || defaultWidgetHelp(), previews: newValues.config?.previews || defaultWidgetPreviews(), features: { ...newValues.config?.features, transcript: newValues.config?.features?.transcript ?? false } } }, false)
+    form.setValues(
+      {
+        ...newValues,
+        config: {
+          ...newValues.config,
+          ...audienceConfigs,
+          prechat_form: pc,
+          campaigns: newValues.config?.campaigns || [],
+          campaign_cooldown_hours: newValues.config?.campaign_cooldown_hours || 24,
+          help: newValues.config?.help || defaultWidgetHelp(),
+          previews: newValues.config?.previews || defaultWidgetPreviews(),
+          features: {
+            ...newValues.config?.features,
+            transcript: newValues.config?.features?.transcript ?? false
+          }
+        }
+      },
+      false
+    )
   },
   { deep: true, immediate: true }
 )
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
index a17a5ed4..d024f0e2 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
@@ -18,7 +18,8 @@
             <div class="flex items-center p-2 border-b border-border gap-3 shrink-0">
               <button
                 type="button"
-                class="flex items-center justify-center size-8 rounded-md hover:bg-accent text-foreground"
+                :aria-label="$t('globals.messages.back')"
+                :class="BACK_BUTTON_CLASS"
                 @click="view = 'messages'"
               >
                 <ArrowLeft :size="18" />
@@ -52,11 +53,8 @@
             <!-- Pre-chat form -->
             <template v-if="showPrechat && !openedExisting">
               <div class="flex-1 min-h-0 overflow-y-auto p-4 space-y-4">
-                <div
-                  v-if="config.prechat_form?.title"
-                  class="text-xl text-foreground mb-2 text-center"
-                >
-                  {{ config.prechat_form.title }}
+                <div v-if="prechatConfig.title" class="text-xl text-foreground mb-2 text-center">
+                  {{ prechatConfig.title }}
                 </div>
                 <div v-for="field in prechatFields" :key="field.key" class="space-y-2">
                   <div v-if="field.type === 'checkbox'" class="flex items-start gap-3">
@@ -132,6 +130,17 @@
                     <p class="text-sm text-secondary-foreground">{{ config.notice_banner.text }}</p>
                   </div>
                 </div>
+                <div
+                  v-if="!openedExisting && quickReplies.length"
+                  class="flex flex-wrap justify-end gap-2 mt-auto"
+                >
+                  <span
+                    v-for="reply in quickReplies"
+                    :key="reply"
+                    class="rounded-full border border-primary text-primary px-3 py-1.5 text-sm"
+                    >{{ reply }}</span
+                  >
+                </div>
                 <template v-if="openedExisting">
                   <div
                     v-for="m in sampleMessages"
@@ -194,10 +203,8 @@
             </div>
           </template>
 
-          <!-- Home + Messages (share the bottom nav) -->
           <template v-else>
             <div class="flex-1 min-h-0 relative">
-              <!-- Home -->
               <div v-if="view === 'home'" class="h-full overflow-y-auto flex flex-col">
                 <div class="relative" :style="headerStyle">
                   <div class="p-6">
@@ -207,44 +214,52 @@
                       :alt="config.brand_name"
                       class="max-h-7 max-w-full"
                     />
-                    <div class="mt-16 font-bold text-3xl leading-tight" :class="textColorClass">
-                      <h2 class="break-words">{{ parsedGreeting }}</h2>
-                      <p class="mt-1 font-semibold" :class="subTextColorClass">
+                    <div class="mt-16" :class="textColorClass">
+                      <h2 class="text-3xl font-bold leading-none tracking-tight break-words">
+                        {{ parsedGreeting }}
+                      </h2>
+                      <p
+                        class="mt-2 max-w-64 text-xl font-medium leading-tight"
+                        :class="subTextColorClass"
+                      >
                         {{ parsedIntroduction }}
                       </p>
                     </div>
                   </div>
-                  <div v-if="canStartConversation" class="relative z-10 px-4 pb-4">
+                  <div v-if="canStartConversation" class="relative z-10 px-4 pb-5">
                     <Button
                       type="button"
-                      class="w-full flex items-center justify-center gap-1"
+                      size="lg"
+                      class="w-full rounded-xl font-semibold shadow-md"
                       @click="startNew"
                     >
                       {{ startButtonText }}
-                      <ArrowRight :size="16" />
+                      <ArrowRight :size="16" aria-hidden="true" />
                     </Button>
                   </div>
                   <div
                     v-if="showFade"
-                    class="absolute bottom-0 left-0 right-0 h-16 pointer-events-none"
+                    class="absolute bottom-0 left-0 right-0 h-20 pointer-events-none"
                     :style="fadeStyle"
                   ></div>
                 </div>
 
-                <div v-if="homeItems.length" class="flex flex-col gap-3 p-4 bg-background">
+                <div
+                  v-if="homeItems.length"
+                  class="flex flex-col gap-3 bg-background px-4 pt-1 pb-5"
+                >
                   <template v-for="(item, index) in homeItems" :key="index">
-                    <!-- Mirrors the widget's HomeHelp card. -->
                     <section
                       v-if="item.type === 'help'"
-                      class="border rounded-lg p-3 space-y-2 bg-card"
+                      class="space-y-2 rounded-xl border border-border/80 bg-card p-2 shadow-sm"
                     >
                       <Button
                         type="button"
                         variant="outline"
-                        class="w-full justify-start"
+                        class="h-10 w-full justify-start rounded-lg"
                         @click="view = 'help'"
                       >
-                        <Search class="size-4" />
+                        <Search class="size-4" aria-hidden="true" />
                         {{ $t('widget.searchArticles') }}
                       </Button>
                       <Button
@@ -255,13 +270,13 @@
                         class="w-full h-auto justify-start text-left whitespace-normal"
                         @click="view = 'help'"
                       >
-                        <FileText class="size-4 shrink-0" />
+                        <FileText class="size-4 shrink-0" aria-hidden="true" />
                         {{ article.title }}
                       </Button>
                     </section>
                     <Card
                       v-else-if="item.type === 'announcement'"
-                      class="overflow-hidden rounded-md hover:bg-accent transition-colors"
+                      class="overflow-hidden rounded-xl border-border/80 transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
                     >
                       <img
                         v-if="item.image_url"
@@ -269,22 +284,49 @@
                         :alt="item.title"
                         class="w-full h-auto"
                       />
-                      <CardContent class="p-3 text-sm">
-                        <div class="font-bold">
+                      <CardContent class="p-4 text-sm">
+                        <div class="font-semibold leading-snug">
                           {{ item.title || $t('globals.terms.announcement') }}
                         </div>
-                        <div v-if="item.description" class="text-muted-foreground mt-1">
+                        <div
+                          v-if="item.description"
+                          class="mt-1 text-muted-foreground leading-relaxed"
+                        >
                           {{ item.description }}
                         </div>
                       </CardContent>
                     </Card>
-                    <Card v-else class="rounded-md hover:bg-accent transition-colors">
+                    <Card
+                      v-else
+                      class="rounded-xl border-border/80 transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
+                    >
                       <CardContent class="p-4">
-                        <div class="flex justify-between items-center">
-                          <span class="text-sm text-primary font-medium">{{
-                            item.text || item.url
-                          }}</span>
-                          <ExternalLink :size="18" class="text-muted-foreground" />
+                        <div class="flex items-center gap-3">
+                          <span
+                            class="flex size-9 shrink-0 items-center justify-center rounded-lg bg-muted"
+                          >
+                            <img
+                              v-if="item.image_url"
+                              :src="item.image_url"
+                              alt=""
+                              class="size-5 object-contain"
+                            />
+                            <Globe2
+                              v-else
+                              :size="16"
+                              class="text-muted-foreground"
+                              aria-hidden="true"
+                            />
+                          </span>
+                          <span
+                            class="min-w-0 flex-1 text-sm font-medium leading-snug text-foreground"
+                            >{{ item.text || item.url }}</span
+                          >
+                          <ExternalLink
+                            :size="15"
+                            class="shrink-0 text-muted-foreground"
+                            aria-hidden="true"
+                          />
                         </div>
                       </CardContent>
                     </Card>
@@ -298,7 +340,8 @@
                   <button
                     v-if="helpCollection"
                     type="button"
-                    class="flex items-center justify-center size-8 rounded-md hover:bg-accent text-foreground"
+                    :aria-label="$t('globals.messages.back')"
+                    :class="BACK_BUTTON_CLASS"
                     @click="helpPath.pop()"
                   >
                     <ArrowLeft :size="16" />
@@ -307,8 +350,8 @@
                 </header>
                 <div class="flex gap-2 p-3 border-b border-border shrink-0">
                   <Input :placeholder="$t('widget.searchArticles')" readonly />
-                  <Button type="button" variant="outline">
-                    <Search class="size-4" />
+                  <Button type="button" variant="outline" :aria-label="$t('widget.searchArticles')">
+                    <Search class="size-4" aria-hidden="true" />
                   </Button>
                 </div>
                 <div class="flex-1 min-h-0 overflow-y-auto">
@@ -335,8 +378,9 @@
                   </h3>
                 </div>
                 <div class="flex-1 overflow-y-auto pb-20">
-                  <div
-                    class="p-4 border-b border-border hover:bg-accent/50 cursor-pointer transition-colors"
+                  <button
+                    type="button"
+                    class="w-full p-4 border-b border-border hover:bg-accent/50 cursor-pointer transition-colors text-left"
                     @click="openExisting"
                   >
                     <div class="flex items-center gap-3">
@@ -355,7 +399,7 @@
                       </div>
                       <ChevronRight class="w-4 h-4 text-muted-foreground shrink-0" />
                     </div>
-                  </div>
+                  </button>
                 </div>
                 <div v-if="canStartFromMessages" class="absolute bottom-0 inset-x-0">
                   <div
@@ -368,34 +412,39 @@
               </div>
             </div>
 
-            <!-- Bottom nav -->
             <div class="flex border-t border-border bg-background shrink-0">
               <button
                 type="button"
-                class="flex flex-col items-center justify-center gap-1 w-full py-4"
-                :class="view === 'home' ? 'text-primary' : 'text-muted-foreground'"
+                :class="[
+                  PREVIEW_NAV_TAB_CLASS,
+                  view === 'home' ? 'text-primary' : 'text-muted-foreground'
+                ]"
                 @click="view = 'home'"
               >
-                <House class="w-5 h-5" />
+                <House class="w-5 h-5" aria-hidden="true" />
                 <span class="text-xs font-medium">{{ $t('globals.terms.home') }}</span>
               </button>
               <button
                 type="button"
-                class="flex flex-col items-center justify-center gap-1 w-full py-4"
-                :class="view === 'messages' ? 'text-primary' : 'text-muted-foreground'"
+                :class="[
+                  PREVIEW_NAV_TAB_CLASS,
+                  view === 'messages' ? 'text-primary' : 'text-muted-foreground'
+                ]"
                 @click="view = 'messages'"
               >
-                <MessagesSquare class="w-5 h-5" />
+                <MessagesSquare class="w-5 h-5" aria-hidden="true" />
                 <span class="text-xs font-medium">{{ $t('globals.terms.message', 2) }}</span>
               </button>
               <button
                 v-if="showHelpTab"
                 type="button"
-                class="flex flex-col items-center justify-center gap-1 w-full py-4"
-                :class="view === 'help' ? 'text-primary' : 'text-muted-foreground'"
+                :class="[
+                  PREVIEW_NAV_TAB_CLASS,
+                  view === 'help' ? 'text-primary' : 'text-muted-foreground'
+                ]"
                 @click="view = 'help'"
               >
-                <CircleQuestionMark class="w-5 h-5" />
+                <CircleQuestionMark class="w-5 h-5" aria-hidden="true" />
                 <span class="text-xs font-medium">{{ $t('globals.terms.help') }}</span>
               </button>
             </div>
@@ -431,17 +480,27 @@
     <!-- Launcher -->
     <button
       type="button"
+      :aria-label="open ? $t('globals.messages.closeChat') : $t('widget.openChat')"
       class="absolute flex items-center justify-center rounded-full shadow-lg transition-transform hover:scale-105"
       :style="launcherStyle"
       @click="open = !open"
     >
-      <ChevronDown v-if="open" :size="26" :style="{ color: launcherIconColor }" />
+      <ChevronDown
+        v-if="open"
+        :size="26"
+        :style="{ color: launcherIconColor }"
+        aria-hidden="true"
+      />
       <img v-else :src="launcherLogo" alt="" class="w-full h-full rounded-full object-cover" />
     </button>
   </div>
 </template>
 
 <script setup>
+const BACK_BUTTON_CLASS =
+  'flex items-center justify-center size-8 rounded-md hover:bg-accent text-foreground'
+const PREVIEW_NAV_TAB_CLASS = 'flex w-full flex-col items-center justify-center gap-1 py-4'
+
 import { computed, ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
 import { Button } from '@shared-ui/components/ui/button'
@@ -456,6 +515,7 @@ import {
   ArrowLeft,
   ArrowUp,
   ExternalLink,
+  Globe2,
   ChevronDown,
   ChevronRight,
   AlertTriangle,
@@ -566,7 +626,10 @@ const showFade = computed(
     Boolean(props.config.home_screen?.background?.type) &&
     Boolean(props.config.home_screen?.fade_background)
 )
-const fadeStyle = { background: 'linear-gradient(to bottom, transparent, hsl(var(--background)))' }
+const fadeStyle = {
+  background:
+    'linear-gradient(to bottom, transparent 0%, hsl(var(--background) / 0.08) 20%, hsl(var(--background) / 0.32) 45%, hsl(var(--background) / 0.72) 72%, hsl(var(--background)) 100%)'
+}
 
 const userTypeConfig = computed(() => props.config[props.userType] || {})
 
@@ -632,14 +695,32 @@ watch(campaign, (value) => {
   if (value) open.value = false
 })
 const campaignText = computed(() => campaign.value?.message.slice(0, SNIPPET_LENGTH) || '')
+const quickReplies = computed(() => {
+  const replies = userTypeConfig.value.quick_replies ?? props.config.quick_replies
+  if (Array.isArray(replies)) return replies
+  return typeof replies === 'string'
+    ? replies
+        .split('\n')
+        .map((reply) => reply.trim())
+        .filter(Boolean)
+    : []
+})
 
+const prechatConfig = computed(() => {
+  const shared = props.config.prechat_form || {}
+  const audience = shared[props.userType]
+  return audience && typeof audience === 'object' ? audience : shared
+})
 const prechatFields = computed(() =>
-  (props.config.prechat_form?.fields || [])
+  (prechatConfig.value.fields || [])
     .filter((f) => f.enabled)
     .sort((a, b) => (a.order || 0) - (b.order || 0))
 )
 const showPrechat = computed(
-  () => Boolean(props.config.prechat_form?.enabled) && prechatFields.value.length > 0
+  () =>
+    Boolean(props.config.prechat_form?.enabled) &&
+    (prechatConfig.value.enabled ?? true) &&
+    prechatFields.value.length > 0
 )
 
 const onLeft = computed(() => props.config.launcher?.position === 'left')
diff --git a/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue b/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
index 57141205..503fda57 100644
--- a/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
+++ b/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
@@ -8,132 +8,187 @@
       @update:checked="prechatConfig.enabled = $event"
     />
 
-    <!-- Form Configuration -->
-    <div v-if="prechatConfig.enabled" class="space-y-6">
-      <!-- Form Title -->
-      <div>
-        <label class="text-sm font-medium">
-          {{ $t('admin.inbox.livechat.prechatForm.title') }}
-        </label>
-        <Input
-          type="text"
-          v-model="prechatConfig.title"
-          :placeholder="$t('placeholders.tellUsAboutYourself')"
-          class="mt-1"
+    <SwitchField
+      v-if="prechatConfig.enabled"
+      :title="$t('admin.inbox.livechat.prechatForm.handoffOnly')"
+      :description="$t('admin.inbox.livechat.prechatForm.handoffOnly.description')"
+      :checked="prechatConfig.handoff_only"
+      @update:checked="prechatConfig.handoff_only = $event"
+    />
+
+    <Tabs v-if="prechatConfig.enabled" v-model="selectedAudience">
+      <TabsList class="grid w-full grid-cols-2">
+        <TabsTrigger value="visitors">
+          {{ $t('admin.inbox.livechat.userSettings.visitors') }}
+        </TabsTrigger>
+        <TabsTrigger value="users">
+          {{ $t('globals.terms.users') }}
+        </TabsTrigger>
+      </TabsList>
+
+      <div class="mt-4 space-y-6">
+        <SwitchField
+          :title="$t('admin.inbox.livechat.prechatForm.enabled')"
+          :description="$t('admin.inbox.livechat.prechatForm.enabled.description')"
+          :checked="audienceConfig.enabled"
+          @update:checked="audienceConfig.enabled = $event"
         />
-      </div>
 
-      <!-- Fields Configuration -->
-      <div class="space-y-4">
-        <h4 class="font-medium text-foreground">
-          {{ $t('admin.inbox.livechat.prechatForm.fields') }}
-        </h4>
+        <div v-if="audienceConfig.enabled" class="space-y-6">
+          <div>
+            <label class="text-sm font-medium">
+              {{ $t('admin.inbox.livechat.prechatForm.title') }}
+            </label>
+            <Input
+              type="text"
+              v-model="audienceConfig.title"
+              :placeholder="$t('placeholders.tellUsAboutYourself')"
+              class="mt-1"
+            />
+          </div>
 
-        <!-- Field List -->
-        <div class="space-y-3">
-          <Draggable
-            v-model="draggableFields"
-            :item-key="(field) => field.key || `field_${field.custom_attribute_id || 'unknown'}`"
-            :animation="200"
-            class="space-y-3"
-          >
-            <template #item="{ element: field, index }">
-              <div :key="field.key || `field-${index}`" class="border rounded-lg p-4 space-y-4">
-                <!-- Field Header -->
-                <div class="flex items-center justify-between">
-                  <div class="flex items-center space-x-3">
-                    <div class="cursor-move text-muted-foreground">
-                      <GripVertical class="w-4 h-4" />
+          <div class="space-y-4">
+            <h4 class="font-medium text-foreground">
+              {{ $t('admin.inbox.livechat.prechatForm.fields') }}
+            </h4>
+
+            <div class="space-y-3">
+              <Draggable
+                v-model="draggableFields"
+                :item-key="
+                  (field) => field.key || `field_${field.custom_attribute_id || 'unknown'}`
+                "
+                :animation="200"
+                class="space-y-3"
+              >
+                <template #item="{ element: field, index }">
+                  <div :key="field.key || `field-${index}`" class="border rounded-lg p-4 space-y-4">
+                    <div class="flex items-center justify-between">
+                      <div class="flex items-center space-x-3">
+                        <div class="cursor-move text-muted-foreground">
+                          <GripVertical class="w-4 h-4" />
+                        </div>
+                        <div>
+                          <div class="font-medium">{{ field.label }}</div>
+                          <div class="text-sm text-muted-foreground">
+                            {{ field.type }} ({{
+                              field.is_default
+                                ? $t('globals.terms.default')
+                                : $t('globals.terms.custom')
+                            }})
+                          </div>
+                        </div>
+                      </div>
+                      <div class="flex items-center space-x-2">
+                        <Switch v-model:checked="field.enabled" />
+                        <Button
+                          v-if="!field.is_default"
+                          type="button"
+                          variant="ghost"
+                          size="sm"
+                          :aria-label="$t('globals.terms.remove')"
+                          @click="removeField(index)"
+                        >
+                          <X class="w-4 h-4" aria-hidden="true" />
+                        </Button>
+                      </div>
                     </div>
-                    <div>
-                      <div class="font-medium">{{ field.label }}</div>
-                      <div class="text-sm text-muted-foreground">
-                        {{ field.type }} ({{ field.is_default ? $t('globals.terms.default') : $t('globals.terms.custom') }})
+
+                    <div v-if="field.enabled" class="space-y-4">
+                      <div class="grid grid-cols-2 gap-4">
+                        <div>
+                          <label class="text-sm font-medium">{{ $t('globals.terms.label') }}</label>
+                          <Input
+                            v-model="field.label"
+                            :placeholder="$t('placeholders.fieldLabel')"
+                            class="mt-1"
+                          />
+                        </div>
+
+                        <div>
+                          <label class="text-sm font-medium">
+                            {{ $t('globals.terms.placeholder') }}
+                          </label>
+                          <Input
+                            v-model="field.placeholder"
+                            :placeholder="$t('placeholders.fieldPlaceholder')"
+                            class="mt-1"
+                          />
+                        </div>
+                      </div>
+
+                      <div v-if="field.type !== 'checkbox'" class="flex items-center space-x-2">
+                        <Checkbox v-model:checked="field.required" />
+                        <label class="text-sm">{{ $t('globals.terms.required') }}</label>
                       </div>
                     </div>
                   </div>
-                  <div class="flex items-center space-x-2">
-                    <Switch v-model:checked="field.enabled" />
-                    <Button
-                      v-if="!field.is_default"
-                      type="button"
-                      variant="ghost"
-                      size="sm"
-                      @click="removeField(index)"
-                    >
-                      <X class="w-4 h-4" />
-                    </Button>
-                  </div>
-                </div>
+                </template>
+              </Draggable>
 
-                <!-- Field Configuration -->
-                <div v-if="field.enabled" class="space-y-4">
-                  <div class="grid grid-cols-2 gap-4">
-                    <!-- Label -->
-                    <div>
-                      <label class="text-sm font-medium">{{ $t('globals.terms.label') }}</label>
-                      <Input v-model="field.label" :placeholder="$t('placeholders.fieldLabel')" class="mt-1" />
-                    </div>
+              <div v-if="formFields.length === 0" class="text-center py-8 text-muted-foreground">
+                {{ $t('admin.inbox.livechat.prechatForm.noFields') }}
+              </div>
+            </div>
 
-                    <!-- Placeholder -->
-                    <div>
-                      <label class="text-sm font-medium">
-                        {{ $t('globals.terms.placeholder') }}
-                      </label>
-                      <Input
-                        v-model="field.placeholder"
-                        :placeholder="$t('placeholders.fieldPlaceholder')"
-                        class="mt-1"
-                      />
-                    </div>
-                  </div>
-
-                  <!-- Required -->
-                  <div v-if="field.type !== 'checkbox'" class="flex items-center space-x-2">
-                    <Checkbox v-model:checked="field.required" />
-                    <label class="text-sm">{{ $t('globals.terms.required') }}</label>
+            <div v-if="availableCustomAttributes.length > 0" class="space-y-3">
+              <h5 class="font-medium text-sm">
+                {{ $t('admin.inbox.livechat.prechatForm.availableFields') }}
+              </h5>
+              <div class="grid grid-cols-2 gap-2 max-h-48 overflow-y-auto">
+                <div
+                  v-for="attr in availableCustomAttributes"
+                  :key="attr.id"
+                  class="flex items-center space-x-2 p-2 border rounded-md cursor-pointer hover:bg-accent"
+                  @click="addCustomAttributeToForm(attr)"
+                >
+                  <div class="flex-1">
+                    <div class="font-medium text-sm">{{ attr.name }}</div>
+                    <div class="text-xs text-muted-foreground">{{ attr.data_type }}</div>
                   </div>
+                  <Plus class="w-4 h-4 text-muted-foreground" />
                 </div>
               </div>
-            </template>
-          </Draggable>
-
-          <!-- Empty State -->
-          <div v-if="formFields.length === 0" class="text-center py-8 text-muted-foreground">
-            {{ $t('admin.inbox.livechat.prechatForm.noFields') }}
-          </div>
-        </div>
-
-        <!-- Custom Attributes Selection -->
-        <div v-if="availableCustomAttributes.length > 0" class="space-y-3">
-          <h5 class="font-medium text-sm">
-            {{ $t('admin.inbox.livechat.prechatForm.availableFields') }}
-          </h5>
-          <div class="grid grid-cols-2 gap-2 max-h-48 overflow-y-auto">
-            <div
-              v-for="attr in availableCustomAttributes"
-              :key="attr.id"
-              class="flex items-center space-x-2 p-2 border rounded-md cursor-pointer hover:bg-accent"
-              @click="addCustomAttributeToForm(attr)"
-            >
-              <div class="flex-1">
-                <div class="font-medium text-sm">{{ attr.name }}</div>
-                <div class="text-xs text-muted-foreground">{{ attr.data_type }}</div>
-              </div>
-              <Plus class="w-4 h-4 text-muted-foreground" />
             </div>
           </div>
         </div>
       </div>
-    </div>
+    </Tabs>
   </div>
 </template>
 
 <script>
 export const getDefaultPrechatFields = () => [
-  { key: 'name', type: 'text', label: 'Full name', placeholder: 'Enter your name', required: true, enabled: true, order: 1, is_default: true },
-  { key: 'email', type: 'email', label: 'Email address', placeholder: 'your@email.com', required: true, enabled: true, order: 2, is_default: true },
-  { key: 'phone', type: 'phone', label: 'Phone number', placeholder: '', required: false, enabled: false, order: 3, is_default: true }
+  {
+    key: 'name',
+    type: 'text',
+    label: 'Full name',
+    placeholder: 'Enter your name',
+    required: true,
+    enabled: true,
+    order: 1,
+    is_default: true
+  },
+  {
+    key: 'email',
+    type: 'email',
+    label: 'Email address',
+    placeholder: 'your@email.com',
+    required: true,
+    enabled: true,
+    order: 2,
+    is_default: true
+  },
+  {
+    key: 'phone',
+    type: 'phone',
+    label: 'Phone number',
+    placeholder: '',
+    required: false,
+    enabled: false,
+    order: 3,
+    is_default: true
+  }
 ]
 </script>
 
@@ -144,6 +199,7 @@ import { Button } from '@shared-ui/components/ui/button'
 import { Switch } from '@shared-ui/components/ui/switch'
 import SwitchField from '@shared-ui/components/SwitchField.vue'
 import { Checkbox } from '@shared-ui/components/ui/checkbox'
+import { Tabs, TabsList, TabsTrigger } from '@shared-ui/components/ui/tabs'
 import { Plus, X, GripVertical } from 'lucide-vue-next'
 import Draggable from 'vuedraggable'
 import api from '@/api'
@@ -151,15 +207,28 @@ import api from '@/api'
 const prechatConfig = defineModel({
   default: () => ({
     enabled: false,
+    handoff_only: false,
     title: '',
-    fields: getDefaultPrechatFields()
+    fields: getDefaultPrechatFields(),
+    visitors: {
+      enabled: true,
+      title: '',
+      fields: getDefaultPrechatFields()
+    },
+    users: {
+      enabled: true,
+      title: '',
+      fields: getDefaultPrechatFields()
+    }
   })
 })
 
 const customAttributes = ref([])
+const selectedAudience = ref('visitors')
+const audienceConfig = computed(() => prechatConfig.value[selectedAudience.value])
 
 const formFields = computed(() => {
-  return prechatConfig.value.fields || []
+  return audienceConfig.value.fields || []
 })
 
 const availableCustomAttributes = computed(() => {
@@ -172,20 +241,20 @@ const availableCustomAttributes = computed(() => {
 
 const draggableFields = computed({
   get() {
-    return prechatConfig.value.fields || []
+    return audienceConfig.value.fields || []
   },
   set(newValue) {
     const fieldsWithUpdatedOrder = newValue.map((field, index) => ({
       ...field,
       order: index + 1
     }))
-    prechatConfig.value.fields = fieldsWithUpdatedOrder
+    audienceConfig.value.fields = fieldsWithUpdatedOrder
   }
 })
 
 const removeField = (index) => {
   const fields = formFields.value.filter((_, i) => i !== index)
-  prechatConfig.value.fields = fields
+  audienceConfig.value.fields = fields
 }
 
 const addCustomAttributeToForm = (attribute) => {
@@ -202,7 +271,7 @@ const addCustomAttributeToForm = (attribute) => {
   }
 
   const fields = [...formFields.value, newField]
-  prechatConfig.value.fields = fields
+  audienceConfig.value.fields = fields
 }
 
 const fetchCustomAttributes = async () => {
@@ -221,23 +290,18 @@ const fetchCustomAttributes = async () => {
     // Build lookup map for custom attributes
     const customAttrMap = new Map(customAttributes.value.map((attr) => [attr.id, attr]))
 
-    // Clean up orphaned fields and sync labels/types from current custom attribute definitions
-    const cleanedFields = (prechatConfig.value.fields || []).filter((field) => {
-      if (field.is_default) return true
-      if (field.custom_attribute_id && customAttrMap.has(field.custom_attribute_id)) return true
-      return false
-    }).map((field) => {
-      if (!field.is_default && field.custom_attribute_id) {
-        const attr = customAttrMap.get(field.custom_attribute_id)
-        if (attr) {
-          field.label = attr.name
-          field.type = attr.data_type
-        }
-      }
-      return field
-    })
-
-    prechatConfig.value.fields = cleanedFields
+    for (const audience of ['visitors', 'users']) {
+      prechatConfig.value[audience].fields = (prechatConfig.value[audience].fields || [])
+        .filter(
+          (field) =>
+            field.is_default ||
+            (field.custom_attribute_id && customAttrMap.has(field.custom_attribute_id))
+        )
+        .map((field) => {
+          const attr = customAttrMap.get(field.custom_attribute_id)
+          return attr ? { ...field, label: attr.name, type: attr.data_type } : field
+        })
+    }
   } catch (error) {
     console.error('Error fetching custom attributes:', error)
     customAttributes.value = []
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
index 82ee4145..aadb73db 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
@@ -1,7 +1,10 @@
 <script setup>
-import { ref, computed, watch, onMounted } from 'vue'
+const CAMPAIGN_ORDER_BUTTON_CLASS = 'size-6'
+
+import { ref, computed, watch, onMounted, nextTick } from 'vue'
 import { useI18n } from 'vue-i18n'
 import api from '@/api'
+import { useUsersStore } from '@/stores/users'
 import { Button } from '@shared-ui/components/ui/button'
 import { Badge } from '@shared-ui/components/ui/badge'
 import { Input } from '@shared-ui/components/ui/input'
@@ -39,28 +42,55 @@ import {
   CollapsibleTrigger
 } from '@shared-ui/components/ui/collapsible'
 import SwitchField from '@shared-ui/components/SwitchField.vue'
+import SelectAgentCombobox from '@/components/combobox/SelectAgentCombobox.vue'
+import SelectTeamCombobox from '@/components/combobox/SelectTeamCombobox.vue'
 import WidgetConditions from './WidgetConditions.vue'
-import { defaultCampaign, newCampaignId } from './livechatFormSchema.js'
+import {
+  createCampaignSchema,
+  defaultCampaign,
+  moveCampaign,
+  newCampaignId
+} from './livechatFormSchema.js'
 import { handleHTTPError } from '@shared-ui/utils/http'
-import { ChevronRight, ChevronDown, Plus, CircleCheck, CircleSlash } from 'lucide-vue-next'
+import {
+  ArrowDown,
+  ArrowUp,
+  ChevronRight,
+  ChevronDown,
+  Plus,
+  CircleCheck,
+  CircleSlash
+} from 'lucide-vue-next'
 
 const MAX_CAMPAIGNS = 50
 const STAT_KEYS = ['displayed', 'opened', 'dismissed', 'replied']
-const SELECT_FIELDS = [{ key: 'audience', values: ['all', 'visitors', 'users'] }]
+const AUDIENCE_TRANSLATION_KEYS = {
+  all: 'widget.campaign.all',
+  visitors: 'admin.inbox.livechat.userSettings.visitors',
+  users: 'widget.campaign.users'
+}
+const SELECT_FIELDS = [
+  {
+    key: 'audience',
+    labelKey: 'widget.campaign.audience',
+    values: ['all', 'visitors', 'users']
+  }
+]
 const DEVICES = ['desktop', 'mobile']
 
 const props = defineProps({
   modelValue: { type: Array, default: () => [] },
   inboxId: { type: Number, default: 0 },
-  cooldown: { type: Number, default: 24 }
+  cooldown: { type: Number, default: 24 },
+  showErrors: { type: Boolean, default: false }
 })
 const emit = defineEmits(['update:modelValue', 'update:cooldown', 'update:preview'])
 const { t } = useI18n()
+const usersStore = useUsersStore()
 
+const root = ref(null)
 const selected = ref('')
 const campaign = computed(() => props.modelValue.find((item) => item.id === selected.value))
-const teams = ref([])
-const agents = ref([])
 const businessHours = ref([])
 const error = ref('')
 const pendingDelete = ref(null)
@@ -68,11 +98,33 @@ const stats = ref([])
 const from = ref(new Date(Date.now() - 30 * 86400000).toISOString().slice(0, 10))
 const to = ref(new Date().toISOString().slice(0, 10))
 const senderName = (id) => {
-  const agent = agents.value.find((item) => item.id === id)
-  return agent ? `${agent.first_name} ${agent.last_name || ''}`.trim() : t('widget.brandBot')
+  const agent = usersStore.options.find((item) => String(item.value) === String(id))
+  return agent?.label || t('widget.brandBot')
 }
 
-const audienceLabel = (item) => t(`widget.campaign.${item.audience}`)
+const campaignErrors = computed(() => {
+  if (!props.showErrors || !campaign.value) return []
+  const result = createCampaignSchema(t).safeParse(campaign.value)
+  if (result.success) return []
+  return result.error.issues.map((issue) => ({
+    field: issue.path.join('.'),
+    message: issue.message
+  }))
+})
+const campaignFieldError = (...fields) =>
+  campaignErrors.value.find((error) => fields.some((field) => error.field === field))?.message || ''
+const campaignSectionError = (field) =>
+  campaignErrors.value.find((error) => error.field === field || error.field.startsWith(`${field}.`))
+    ?.message || ''
+const cooldownError = computed(() => {
+  if (!props.showErrors) return ''
+  const value = Number(props.cooldown)
+  return Number.isInteger(value) && value >= 1 && value <= 8760
+    ? ''
+    : t('validation.minmaxNumber', { min: 1, max: 8760 })
+})
+
+const audienceLabel = (item) => t(AUDIENCE_TRANSLATION_KEYS[item.audience])
 
 const pagesLabel = (item) =>
   item.include_urls.filter(Boolean).length
@@ -81,13 +133,15 @@ const pagesLabel = (item) =>
 
 // The rail preview mirrors what widget.js renders above the launcher for this campaign.
 watch(
-  [campaign, agents],
+  [campaign, () => usersStore.options],
   () => {
     if (!campaign.value) {
       emit('update:preview', null)
       return
     }
-    const agent = agents.value.find((item) => item.id === campaign.value.sender_id)
+    const agent = usersStore.options.find(
+      (item) => String(item.value) === String(campaign.value.sender_id)
+    )
     emit('update:preview', {
       sender: senderName(campaign.value.sender_id),
       avatar: agent?.avatar_url || '',
@@ -110,6 +164,9 @@ const toggleEnabled = (id, enabled) =>
     props.modelValue.map((item) => (item.id === id ? { ...item, enabled } : item))
   )
 
+const reorder = (index, offset) =>
+  emit('update:modelValue', moveCampaign(props.modelValue, index, offset))
+
 const add = (source) => {
   const item = source
     ? {
@@ -132,6 +189,47 @@ const remove = () => {
   pendingDelete.value = null
 }
 
+const showInvalidField = async (field) => {
+  if (field === 'config.campaign_cooldown_hours') {
+    root.value?.querySelector('#campaign-cooldown')?.focus()
+    return
+  }
+  const firstInvalid = props.modelValue
+    .map((item) => ({ item, result: createCampaignSchema(t).safeParse(item) }))
+    .find(({ result }) => !result.success)
+  if (!firstInvalid) return
+  selected.value = firstInvalid.item.id
+  await nextTick()
+  const fieldName = firstInvalid.result.error.issues[0]?.path.join('.') || field
+  const targetID = [
+    'name',
+    'message',
+    'include_urls',
+    'exclude_urls',
+    'delay_seconds',
+    'event',
+    'repeat_hours'
+  ].includes(fieldName)
+    ? `campaign-${fieldName}`
+    : ''
+  const section = fieldName.startsWith('conditions')
+    ? '[data-campaign-conditions]'
+    : fieldName === 'desktop'
+      ? '[data-campaign-devices]'
+      : fieldName === 'business_hours_id'
+        ? '[data-campaign-business-hours]'
+        : ''
+  const target = targetID
+    ? root.value?.querySelector(`#${targetID}`)
+    : section
+      ? root.value?.querySelector(section)
+      : null
+  if (targetID) target?.focus?.()
+  target?.scrollIntoView({ block: 'nearest' })
+}
+
+defineExpose({ showInvalidField })
+
 const refreshStats = async () => {
   if (!props.inboxId) return
   try {
@@ -144,25 +242,19 @@ const refreshStats = async () => {
 }
 
 onMounted(async () => {
-  const responses = await Promise.allSettled([
-    api.getTeams(),
-    api.getUsersCompact({ enabled: true, per_page: 100 }),
-    api.getAllBusinessHours()
-  ])
-  for (const [index, response] of responses.entries()) {
-    if (response.status === 'rejected') {
-      error.value = handleHTTPError(response.reason).message
-      continue
-    }
-    const data = response.value.data.data
-    ;[teams, agents, businessHours][index].value = data.results || data
+  try {
+    const response = await api.getAllBusinessHours()
+    const data = response.data.data
+    businessHours.value = data.results || data
+  } catch (err) {
+    error.value = handleHTTPError(err).message
   }
   await refreshStats()
 })
 </script>
 
 <template>
-  <div class="space-y-6">
+  <div ref="root" class="space-y-6">
     <p v-if="error" role="alert" class="text-sm text-destructive">{{ error }}</p>
 
     <!-- Campaign list -->
@@ -178,44 +270,76 @@ onMounted(async () => {
           max="8760"
           :model-value="cooldown"
           @update:model-value="emit('update:cooldown', Number($event))"
+          :aria-invalid="!!cooldownError"
         />
+        <p v-if="cooldownError" role="alert" class="text-sm text-destructive">
+          {{ cooldownError }}
+        </p>
       </div>
 
       <div class="space-y-4">
         <h4 class="text-base font-semibold text-foreground">{{ t('widget.proactiveMessages') }}</h4>
+        <p v-if="modelValue.length > 1" class="text-sm text-muted-foreground">
+          {{ t('widget.campaignPriorityHint') }}
+        </p>
 
         <div v-if="modelValue.length" class="space-y-2">
           <div
-            v-for="item in modelValue"
+            v-for="(item, index) in modelValue"
             :key="item.id"
-            class="flex items-center gap-3 p-3 border rounded-md hover:bg-accent/50 transition-colors cursor-pointer"
-            role="button"
-            tabindex="0"
-            @click="selected = item.id"
-            @keydown.enter.prevent="selected = item.id"
-            @keydown.space.prevent="selected = item.id"
+            class="flex items-center gap-3 border rounded-md hover:bg-accent/50 transition-colors"
           >
+            <div v-if="modelValue.length > 1" class="ml-2 flex flex-col">
+              <Button
+                type="button"
+                variant="ghost"
+                size="icon"
+                :class="CAMPAIGN_ORDER_BUTTON_CLASS"
+                :disabled="index === 0"
+                :aria-label="t('globals.messages.moveUp')"
+                @click="reorder(index, -1)"
+              >
+                <ArrowUp class="size-3.5" aria-hidden="true" />
+              </Button>
+              <Button
+                type="button"
+                variant="ghost"
+                size="icon"
+                :class="CAMPAIGN_ORDER_BUTTON_CLASS"
+                :disabled="index === modelValue.length - 1"
+                :aria-label="t('globals.messages.moveDown')"
+                @click="reorder(index, 1)"
+              >
+                <ArrowDown class="size-3.5" aria-hidden="true" />
+              </Button>
+            </div>
             <Switch
+              :class="modelValue.length > 1 ? '' : 'ml-3'"
               :checked="item.enabled"
               :aria-label="t('globals.terms.enabled')"
-              @click.stop
               @update:checked="toggleEnabled(item.id, $event)"
             />
-            <div class="flex-1 min-w-0">
-              <div class="flex items-center gap-2">
-                <span class="text-sm font-medium text-foreground truncate">
-                  {{ item.name || t('widget.newCampaign') }}
-                </span>
-                <Badge :variant="item.enabled ? 'success' : 'secondary'" class="gap-1 shrink-0">
-                  <component :is="item.enabled ? CircleCheck : CircleSlash" class="size-3" />
-                  {{ item.enabled ? t('globals.terms.enabled') : t('globals.terms.paused') }}
-                </Badge>
+            <button
+              type="button"
+              class="flex min-w-0 flex-1 items-center gap-3 py-3 pr-3 text-left"
+              @click="selected = item.id"
+            >
+              <div class="flex-1 min-w-0">
+                <div class="flex items-center gap-2">
+                  <span class="text-sm font-medium text-foreground truncate">
+                    {{ item.name || t('widget.newCampaign') }}
+                  </span>
+                  <Badge variant="secondary" class="gap-1 shrink-0">
+                    <component :is="item.enabled ? CircleCheck : CircleSlash" class="size-3" />
+                    {{ item.enabled ? t('globals.terms.enabled') : t('globals.terms.paused') }}
+                  </Badge>
+                </div>
+                <p class="text-xs text-muted-foreground truncate mt-0.5">
+                  {{ audienceLabel(item) }} · {{ pagesLabel(item) }}
+                </p>
               </div>
-              <p class="text-xs text-muted-foreground truncate mt-0.5">
-                {{ audienceLabel(item) }} · {{ pagesLabel(item) }}
-              </p>
-            </div>
-            <ChevronRight class="size-4 text-muted-foreground shrink-0" />
+              <ChevronRight class="size-4 text-muted-foreground shrink-0" />
+            </button>
           </div>
         </div>
 
@@ -237,6 +361,7 @@ onMounted(async () => {
       <!-- Results -->
       <Collapsible v-if="inboxId" class="space-y-4">
         <CollapsibleTrigger
+          type="button"
           class="flex items-center gap-2 text-base font-semibold text-foreground group"
         >
           <ChevronDown class="size-4 transition-transform group-data-[state=closed]:-rotate-90" />
@@ -333,7 +458,11 @@ onMounted(async () => {
             :model-value="campaign.name"
             maxlength="128"
             @update:model-value="update('name', $event)"
+            :aria-invalid="!!campaignFieldError('name')"
           />
+          <p v-if="campaignFieldError('name')" role="alert" class="text-sm text-destructive">
+            {{ campaignFieldError('name') }}
+          </p>
         </div>
 
         <div class="space-y-2">
@@ -344,44 +473,37 @@ onMounted(async () => {
             maxlength="10000"
             rows="4"
             @update:model-value="update('message', $event)"
+            :aria-invalid="!!campaignFieldError('message')"
           />
+          <p v-if="campaignFieldError('message')" role="alert" class="text-sm text-destructive">
+            {{ campaignFieldError('message') }}
+          </p>
         </div>
 
         <div class="grid sm:grid-cols-2 gap-4">
           <div class="space-y-2">
             <Label for="campaign-sender">{{ t('widget.campaignSender') }}</Label>
-            <Select
-              :model-value="String(campaign.sender_id)"
-              @update:model-value="update('sender_id', Number($event))"
-            >
-              <SelectTrigger id="campaign-sender"><SelectValue /></SelectTrigger>
-              <SelectContent>
-                <SelectItem value="0">{{ t('widget.brandBot') }}</SelectItem>
-                <SelectItem v-for="agent in agents" :key="agent.id" :value="String(agent.id)">
-                  {{ agent.first_name }} {{ agent.last_name }}
-                </SelectItem>
-              </SelectContent>
-            </Select>
+            <SelectAgentCombobox
+              id="campaign-sender"
+              :model-value="campaign.sender_id === 0 ? 'brand' : String(campaign.sender_id)"
+              :prepend-items="[{ value: 'brand', label: t('widget.brandBot') }]"
+              exclude-ai-assistants
+              @update:model-value="update('sender_id', $event === 'brand' ? 0 : Number($event))"
+            />
           </div>
 
           <div class="space-y-2">
             <Label for="campaign-team">{{ t('widget.replyTeam') }}</Label>
-            <Select
-              :model-value="String(campaign.team_id)"
-              @update:model-value="update('team_id', Number($event))"
-            >
-              <SelectTrigger id="campaign-team"><SelectValue /></SelectTrigger>
-              <SelectContent>
-                <SelectItem value="0">{{ t('globals.terms.none') }}</SelectItem>
-                <SelectItem v-for="team in teams" :key="team.id" :value="String(team.id)">
-                  {{ team.name }}
-                </SelectItem>
-              </SelectContent>
-            </Select>
+            <SelectTeamCombobox
+              id="campaign-team"
+              :model-value="campaign.team_id === 0 ? 'none' : String(campaign.team_id)"
+              include-none
+              @update:model-value="update('team_id', $event === 'none' ? 0 : Number($event))"
+            />
           </div>
 
           <div v-for="field in SELECT_FIELDS" :key="field.key" class="space-y-2">
-            <Label :for="`campaign-${field.key}`">{{ t(`widget.campaign.${field.key}`) }}</Label>
+            <Label :for="`campaign-${field.key}`">{{ t(field.labelKey) }}</Label>
             <Select
               :model-value="campaign[field.key]"
               @update:model-value="update(field.key, $event)"
@@ -389,7 +511,7 @@ onMounted(async () => {
               <SelectTrigger :id="`campaign-${field.key}`"><SelectValue /></SelectTrigger>
               <SelectContent>
                 <SelectItem v-for="value in field.values" :key="value" :value="value">
-                  {{ t(`widget.campaign.${value}`) }}
+                  {{ t(AUDIENCE_TRANSLATION_KEYS[value]) }}
                 </SelectItem>
               </SelectContent>
             </Select>
@@ -403,7 +525,7 @@ onMounted(async () => {
           {{ t('widget.campaign.section.audience') }}
         </h4>
 
-        <div class="space-y-3">
+        <div data-campaign-devices class="space-y-3">
           <p class="text-sm font-medium text-foreground">{{ t('widget.campaign.devices') }}</p>
           <SwitchField
             v-for="device in DEVICES"
@@ -412,14 +534,24 @@ onMounted(async () => {
             :checked="campaign[device]"
             @update:checked="update(device, $event)"
           />
+          <p v-if="campaignFieldError('desktop')" role="alert" class="text-sm text-destructive">
+            {{ campaignFieldError('desktop') }}
+          </p>
         </div>
 
-        <div class="space-y-2">
+        <div data-campaign-conditions class="space-y-2">
           <p class="text-sm font-medium text-foreground">{{ t('globals.messages.visibleWhen') }}</p>
           <WidgetConditions
             :model-value="campaign.conditions"
             @update:model-value="update('conditions', $event)"
           />
+          <p
+            v-if="campaignSectionError('conditions')"
+            role="alert"
+            class="text-sm text-destructive"
+          >
+            {{ campaignSectionError('conditions') }}
+          </p>
         </div>
       </div>
 
@@ -434,10 +566,17 @@ onMounted(async () => {
           <Textarea
             :id="`campaign-${key}`"
             :model-value="campaign[key].join('\n')"
+            :placeholder="
+              key === 'include_urls' ? '/pricing\nhttps://example.com/docs/*' : '/checkout/*'
+            "
             rows="3"
             @update:model-value="update(key, $event.split('\n'))"
+            :aria-invalid="!!campaignFieldError(key)"
           />
           <p class="text-xs text-muted-foreground">{{ t('widget.urlPatternsHint') }}</p>
+          <p v-if="campaignFieldError(key)" role="alert" class="text-sm text-destructive">
+            {{ campaignFieldError(key) }}
+          </p>
         </div>
 
         <div class="grid sm:grid-cols-2 gap-4">
@@ -450,7 +589,15 @@ onMounted(async () => {
               max="86400"
               :model-value="campaign.delay_seconds"
               @update:model-value="update('delay_seconds', Number($event))"
+              :aria-invalid="!!campaignFieldError('delay_seconds')"
             />
+            <p
+              v-if="campaignFieldError('delay_seconds')"
+              role="alert"
+              class="text-sm text-destructive"
+            >
+              {{ campaignFieldError('delay_seconds') }}
+            </p>
           </div>
 
           <div class="space-y-2">
@@ -482,7 +629,11 @@ onMounted(async () => {
             </Select>
           </div>
 
-          <div v-if="campaign.business_hours !== 'any'" class="space-y-2">
+          <div
+            v-if="campaign.business_hours !== 'any'"
+            data-campaign-business-hours
+            class="space-y-2"
+          >
             <Label for="campaign-hours">{{ t('globals.terms.businessHour', 2) }}</Label>
             <Select
               :model-value="String(campaign.business_hours_id)"
@@ -495,6 +646,13 @@ onMounted(async () => {
                 </SelectItem>
               </SelectContent>
             </Select>
+            <p
+              v-if="campaignFieldError('business_hours_id')"
+              role="alert"
+              class="text-sm text-destructive"
+            >
+              {{ campaignFieldError('business_hours_id') }}
+            </p>
           </div>
         </div>
       </div>
@@ -531,11 +689,18 @@ onMounted(async () => {
               max="8760"
               :model-value="campaign.repeat_hours"
               @update:model-value="update('repeat_hours', Number($event))"
+              :aria-invalid="!!campaignFieldError('repeat_hours')"
             />
+            <p
+              v-if="campaignFieldError('repeat_hours')"
+              role="alert"
+              class="text-sm text-destructive"
+            >
+              {{ campaignFieldError('repeat_hours') }}
+            </p>
           </div>
         </div>
       </div>
-
     </template>
 
     <AlertDialog
@@ -545,13 +710,11 @@ onMounted(async () => {
       <AlertDialogContent>
         <AlertDialogHeader>
           <AlertDialogTitle>{{ t('globals.messages.areYouAbsolutelySure') }}</AlertDialogTitle>
-          <AlertDialogDescription>{{
-            t('confirm.deleteCampaign')
-          }}</AlertDialogDescription>
+          <AlertDialogDescription>{{ t('confirm.deleteCampaign') }}</AlertDialogDescription>
         </AlertDialogHeader>
         <AlertDialogFooter>
-          <AlertDialogCancel>{{ t('globals.messages.cancel') }}</AlertDialogCancel>
-          <AlertDialogAction variant="destructive" @click="remove">
+          <AlertDialogCancel type="button">{{ t('globals.messages.cancel') }}</AlertDialogCancel>
+          <AlertDialogAction type="button" variant="destructive" @click="remove">
             {{ t('globals.messages.delete') }}
           </AlertDialogAction>
         </AlertDialogFooter>
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue b/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue
index 87fc72ac..251443d1 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue
@@ -3,19 +3,44 @@ import { ref, watch, onMounted } from 'vue'
 import RuleBox from '@/features/admin/automation/RuleBox.vue'
 import { useCustomAttributeStore } from '@/stores/customAttributes'
 
-const props = defineProps({ modelValue: { type: Object, default: () => ({ logical_op: 'AND', rules: [] }) } })
+const props = defineProps({
+  modelValue: { type: Object, default: () => ({ logical_op: 'AND', rules: [] }) }
+})
 const emit = defineEmits(['update:modelValue'])
 const group = ref({ logical_op: 'AND', rules: [] })
-watch(() => props.modelValue, value => { group.value = value ? JSON.parse(JSON.stringify(value)) : { logical_op: 'AND', rules: [] } }, { immediate: true, deep: true })
+watch(
+  () => props.modelValue,
+  (value) => {
+    group.value = value ? JSON.parse(JSON.stringify(value)) : { logical_op: 'AND', rules: [] }
+  },
+  { immediate: true, deep: true }
+)
 const update = () => emit('update:modelValue', JSON.parse(JSON.stringify(group.value)))
 const add = () => {
-  group.value.rules.push({ field: '', field_type: 'contact_custom_attribute', operator: '', value: '', case_sensitive_match: false })
+  group.value.rules.push({
+    field: '',
+    field_type: 'contact_custom_attribute',
+    operator: '',
+    value: '',
+    case_sensitive_match: false
+  })
+  update()
+}
+const remove = (_, index) => {
+  group.value.rules.splice(index, 1)
   update()
 }
-const remove = (_, index) => { group.value.rules.splice(index, 1); update() }
 onMounted(() => useCustomAttributeStore().fetchCustomAttributes())
 </script>
 
 <template>
-  <RuleBox :rule-group="group" :group-index="0" type="new_conversation" contacts-only @update-group="update" @add-condition="add" @remove-condition="remove" />
+  <RuleBox
+    :rule-group="group"
+    :group-index="0"
+    type="new_conversation"
+    contacts-only
+    @update-group="update"
+    @add-condition="add"
+    @remove-condition="remove"
+  />
 </template>
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
index 2e195dbd..d649f648 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
@@ -61,7 +61,7 @@ const unusedArticles = computed(() =>
         :model-value="String(modelValue.help_center_id || 0)"
         @update:model-value="selectHelpCenter"
       >
-        <SelectTrigger id="widget-help-center"><SelectValue /></SelectTrigger>
+        <SelectTrigger id="widget-help-center" class="max-w-md"><SelectValue /></SelectTrigger>
         <SelectContent>
           <SelectItem value="0">{{ t('globals.terms.none') }}</SelectItem>
           <SelectItem
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
index 8dea6fd6..ca98edaa 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
@@ -4,12 +4,63 @@ import { isGoDuration } from '@shared-ui/utils/string'
 const hexColorRegex = /^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$/
 const hexColor = (t) => z.string().regex(hexColorRegex, { message: t('validation.invalidColor') })
 const optionalHexColor = (t) => hexColor(t).optional().or(z.literal(''))
-const optionalUrl = (t) => z.string().url({ message: t('validation.invalidUrl') }).optional().or(z.literal(''))
+const optionalUrl = (t) =>
+  z
+    .string()
+    .url({ message: t('validation.invalidUrl') })
+    .optional()
+    .or(z.literal(''))
 const rangeNumber = (t, min, max) => {
   const msg = t('validation.minmaxNumber', { min, max })
-  return z.coerce.number({ invalid_type_error: msg }).min(min, { message: msg }).max(max, { message: msg })
+  return z.coerce
+    .number({ invalid_type_error: msg })
+    .min(min, { message: msg })
+    .max(max, { message: msg })
+}
+const rangeInteger = (t, min, max) => {
+  const msg = t('validation.minmaxNumber', { min, max })
+  return rangeNumber(t, min, max).int({ message: msg })
 }
 const spacingNumber = (t) => rangeNumber(t, 0, 200)
+const goDurationSeconds = (value) => {
+  const match = /^(?:(\d+)h)?(?:(\d+)m)?(?:(\d+)s)?$/.exec(value)
+  if (!match) return 0
+  return Number(match[1] || 0) * 3600 + Number(match[2] || 0) * 60 + Number(match[3] || 0)
+}
+const quickReplies = (t) =>
+  z
+    .string()
+    .refine(
+      (value) =>
+        value
+          .split('\n')
+          .map((reply) => reply.trim())
+          .filter(Boolean).length <= 6,
+      {
+        message: t('admin.inbox.livechat.quickReplies.limit')
+      }
+    )
+    .refine((value) => value.split('\n').every((reply) => reply.trim().length <= 120), {
+      message: t('globals.messages.maxLength', { max: 120 })
+    })
+const prechatField = (t) =>
+  z.object({
+    key: z.string().min(1),
+    type: z.enum(['text', 'email', 'number', 'checkbox', 'date', 'link', 'list', 'phone']),
+    label: z.string().min(1, { message: t('globals.messages.required') }),
+    placeholder: z.string().optional(),
+    required: z.boolean(),
+    enabled: z.boolean(),
+    order: z.number().min(1),
+    is_default: z.boolean(),
+    custom_attribute_id: z.number().optional()
+  })
+const prechatAudience = (t) =>
+  z.object({
+    enabled: z.boolean(),
+    title: z.string().optional(),
+    fields: z.array(prechatField(t))
+  })
 
 export const defaultWidgetHelp = () => ({
   help_center_id: 0,
@@ -17,11 +68,27 @@ export const defaultWidgetHelp = () => ({
   users: { tab: true },
   featured_ids: []
 })
-export const defaultWidgetPreviews = () => ({ desktop: false, mobile: false, content: 'message', auto_hide_seconds: 0 })
-export const widgetConditionsSchema = z.object({
-  logical_op: z.enum(['AND', 'OR']),
-  rules: z.array(z.object({ field: z.string().min(1), field_type: z.literal('contact_custom_attribute'), operator: z.string().min(1), value: z.string(), case_sensitive_match: z.boolean() })).max(20)
+export const defaultWidgetPreviews = () => ({
+  desktop: true,
+  mobile: true,
+  content: 'message',
+  auto_hide_seconds: 0
 })
+export const createWidgetConditionsSchema = (t) =>
+  z.object({
+    logical_op: z.enum(['AND', 'OR']),
+    rules: z
+      .array(
+        z.object({
+          field: z.string().min(1, t('globals.terms.required')),
+          field_type: z.literal('contact_custom_attribute'),
+          operator: z.string().min(1, t('globals.terms.required')),
+          value: z.string(),
+          case_sensitive_match: z.boolean()
+        })
+      )
+      .max(20)
+  })
 export const newCampaignId = () => {
   if (typeof crypto.randomUUID === 'function') return crypto.randomUUID()
   const bytes = crypto.getRandomValues(new Uint8Array(16))
@@ -31,141 +98,276 @@ export const newCampaignId = () => {
   return `${hex.slice(0, 8)}-${hex.slice(8, 12)}-${hex.slice(12, 16)}-${hex.slice(16, 20)}-${hex.slice(20)}`
 }
 export const defaultCampaign = () => ({
-  id: newCampaignId(), name: '', enabled: false, message: '', sender_id: 0, team_id: 0,
-  audience: 'all', include_urls: [], exclude_urls: [], conditions: { logical_op: 'AND', rules: [] },
-  event: '', delay_seconds: 10,
-  business_hours_id: 0, business_hours: 'any', desktop: true, mobile: true,
-  repeat: 'once', repeat_hours: 24,
-})
-export const campaignSchema = z.object({
-  id: z.string().uuid(), name: z.string().trim().min(1).max(128), enabled: z.boolean(), message: z.string().trim().min(1).max(10000),
-  sender_id: z.number().int().min(0), team_id: z.number().int().min(0),
-  audience: z.enum(['all', 'visitors', 'users']), include_urls: z.array(z.string().max(2048)).max(20).transform(items => items.map(item => item.trim()).filter(Boolean)),
-  exclude_urls: z.array(z.string().max(2048)).max(20).transform(items => items.map(item => item.trim()).filter(Boolean)), conditions: widgetConditionsSchema,
-  event: z.string().max(128), delay_seconds: z.number().int().min(0).max(86400),
-  business_hours_id: z.number().int().min(0), business_hours: z.enum(['any', 'inside', 'outside']),
-  desktop: z.boolean(), mobile: z.boolean(),
-  repeat: z.enum(['once', 'session', 'interval']), repeat_hours: z.number().int().min(1).max(8760),
+  id: newCampaignId(),
+  name: '',
+  enabled: false,
+  message: '',
+  sender_id: 0,
+  team_id: 0,
+  audience: 'all',
+  include_urls: [],
+  exclude_urls: [],
+  conditions: { logical_op: 'AND', rules: [] },
+  event: '',
+  delay_seconds: 10,
+  business_hours_id: 0,
+  business_hours: 'any',
+  desktop: true,
+  mobile: true,
+  repeat: 'once',
+  repeat_hours: 24
 })
+export const moveCampaign = (campaigns, index, offset) => {
+  const target = index + offset
+  if (index < 0 || index >= campaigns.length || target < 0 || target >= campaigns.length) {
+    return campaigns
+  }
+  const reordered = [...campaigns]
+  const [campaign] = reordered.splice(index, 1)
+  reordered.splice(target, 0, campaign)
+  return reordered
+}
+export const normalizeAudienceConfig = (config, audience) => {
+  const audienceConfig = { ...config?.[audience] }
+  const replies = audienceConfig.quick_replies
+  const legacyReplies = Array.isArray(config?.quick_replies)
+    ? config.quick_replies.join('\n')
+    : (config?.quick_replies ?? '')
+  return {
+    ...audienceConfig,
+    quick_replies: Array.isArray(replies) ? replies.join('\n') : (replies ?? legacyReplies),
+    direct_to_conversation:
+      audienceConfig.direct_to_conversation ?? config?.direct_to_conversation ?? false
+  }
+}
+export const normalizePrechatConfig = (config = {}) => {
+  const normalizeAudience = (value) => {
+    const audience = value && typeof value === 'object' && !Array.isArray(value) ? value : {}
+    return {
+      enabled: typeof value === 'boolean' ? value : (audience.enabled ?? true),
+      title: audience.title ?? config.title ?? '',
+      fields: (audience.fields ?? config.fields ?? []).map((field) => ({ ...field }))
+    }
+  }
+  return {
+    ...config,
+    handoff_only: config.handoff_only ?? false,
+    visitors: normalizeAudience(config.visitors),
+    users: normalizeAudience(config.users)
+  }
+}
+export const createCampaignSchema = (t) =>
+  z
+    .object({
+      id: z.string().uuid(),
+      name: z.string().trim().min(1, t('globals.terms.required')).max(128),
+      enabled: z.boolean(),
+      message: z.string().trim().min(1, t('validation.messageCannotBeEmpty')).max(10000),
+      sender_id: z.number().int().min(0),
+      team_id: z.number().int().min(0),
+      audience: z.enum(['all', 'visitors', 'users']),
+      include_urls: z
+        .array(z.string().max(2048))
+        .max(20, t('widget.campaignUrlLimit'))
+        .transform((items) => items.map((item) => item.trim()).filter(Boolean)),
+      exclude_urls: z
+        .array(z.string().max(2048))
+        .max(20, t('widget.campaignUrlLimit'))
+        .transform((items) => items.map((item) => item.trim()).filter(Boolean)),
+      conditions: createWidgetConditionsSchema(t),
+      event: z.string().max(128),
+      delay_seconds: rangeInteger(t, 0, 86400),
+      business_hours_id: z.number().int().min(0),
+      business_hours: z.enum(['any', 'inside', 'outside']),
+      desktop: z.boolean(),
+      mobile: z.boolean(),
+      repeat: z.enum(['once', 'session', 'interval']),
+      repeat_hours: rangeInteger(t, 1, 8760)
+    })
+    .superRefine((campaign, ctx) => {
+      if (!campaign.desktop && !campaign.mobile) {
+        ctx.addIssue({
+          code: z.ZodIssueCode.custom,
+          path: ['desktop'],
+          message: t('widget.campaignDeviceRequired')
+        })
+      }
+      if (campaign.business_hours !== 'any' && campaign.business_hours_id === 0) {
+        ctx.addIssue({
+          code: z.ZodIssueCode.custom,
+          path: ['business_hours_id'],
+          message: t('globals.terms.required')
+        })
+      }
+    })
 const helpAudience = z.object({ tab: z.boolean() })
 
-export const createFormSchema = (t) => z.object({
-  name: z.string().min(1, { message: t('globals.messages.required') }),
-  enabled: z.boolean(),
-  csat_enabled: z.boolean(),
-  prompt_tags_on_reply: z.boolean(),
-  secret: z.string().nullable().optional(),
-  linked_email_inbox_id: z.number().nullable().optional(),
-  config: z.object({
-    campaigns: z.array(campaignSchema).max(50).default([]),
-    campaign_cooldown_hours: z.number().int().min(1).max(8760).default(24),
-    help: z.object({
-      help_center_id: z.number().int().min(0),
-      visitors: helpAudience, users: helpAudience,
-      featured_ids: z.array(z.number().int().positive()).max(10),
-    }).default(defaultWidgetHelp),
-    previews: z.object({ desktop: z.boolean(), mobile: z.boolean(), content: z.enum(['message', 'generic']), auto_hide_seconds: z.number().int().min(0).max(300) }).default(defaultWidgetPreviews),
-    brand_name: z.string().min(1, { message: t('globals.messages.required') }),
-    website_url: optionalUrl(t),
-    dark_mode: z.boolean(),
-    show_powered_by: z.boolean(),
-    language: z.string().min(1, { message: t('globals.messages.required') }),
-    fallback_language: z.string().optional(),
-    logo_url: optionalUrl(t),
-    launcher: z.object({
-      position: z.enum(['left', 'right']),
+export const createFormSchema = (t) =>
+  z.object({
+    name: z.string().min(1, { message: t('globals.messages.required') }),
+    enabled: z.boolean(),
+    csat_enabled: z.boolean(),
+    prompt_tags_on_reply: z.boolean(),
+    secret: z.string().nullable().optional(),
+    linked_email_inbox_id: z.number().nullable().optional(),
+    config: z.object({
+      campaigns: z.array(createCampaignSchema(t)).max(50).default([]),
+      campaign_cooldown_hours: rangeInteger(t, 1, 8760).default(24),
+      help: z
+        .object({
+          help_center_id: z.number().int().min(0),
+          visitors: helpAudience,
+          users: helpAudience,
+          featured_ids: z.array(z.number().int().positive()).max(10)
+        })
+        .default(defaultWidgetHelp),
+      previews: z
+        .object({
+          desktop: z.boolean(),
+          mobile: z.boolean(),
+          content: z.enum(['message', 'generic']),
+          auto_hide_seconds: z.number().int().min(0).max(300)
+        })
+        .default(defaultWidgetPreviews),
+      brand_name: z.string().min(1, { message: t('globals.messages.required') }),
+      website_url: optionalUrl(t),
+      dark_mode: z.boolean(),
+      show_powered_by: z.boolean(),
+      language: z.string().min(1, { message: t('globals.messages.required') }),
+      fallback_language: z.string().optional(),
       logo_url: optionalUrl(t),
-      color: hexColor(t),
-      spacing: z.object({
-        side: spacingNumber(t),
-        bottom: spacingNumber(t),
-      })
-    }),
-    greeting_message: z.string().optional(),
-    introduction_message: z.string().optional(),
-    chat_introduction: z.string(),
-    show_office_hours_in_chat: z.boolean(),
-    show_office_hours_after_assignment: z.boolean(),
-    chat_reply_expectation_message: z.string().optional(),
-    notice_banner: z.object({
-      enabled: z.boolean(),
-      text: z.string().optional()
-    }).superRefine((nb, ctx) => {
-      if (nb.enabled && !nb.text?.trim()) {
-        ctx.addIssue({ code: z.ZodIssueCode.custom, path: ['text'], message: t('globals.messages.required') })
-      }
-    }),
-    colors: z.object({
-      primary: hexColor(t)
-    }),
-    home_screen: z.object({
-      header_text_color: z.enum(['black', 'white']),
-      background: z.object({
-        type: z.enum(['solid', 'gradient', 'image']),
-        color: optionalHexColor(t),
-        gradient_start: optionalHexColor(t),
-        gradient_end: optionalHexColor(t),
-        image_url: optionalUrl(t),
-      }).superRefine((bg, ctx) => {
-        // An empty solid color is intentional (the widget falls back to the page background),
-        // but a gradient/image with no value renders nothing, so require those.
-        if (bg.type === 'gradient') {
-          if (!bg.gradient_start) ctx.addIssue({ code: z.ZodIssueCode.custom, path: ['gradient_start'], message: t('globals.messages.required') })
-          if (!bg.gradient_end) ctx.addIssue({ code: z.ZodIssueCode.custom, path: ['gradient_end'], message: t('globals.messages.required') })
-        } else if (bg.type === 'image' && !bg.image_url) {
-          ctx.addIssue({ code: z.ZodIssueCode.custom, path: ['image_url'], message: t('globals.messages.required') })
-        }
+      launcher: z.object({
+        position: z.enum(['left', 'right']),
+        logo_url: optionalUrl(t),
+        color: hexColor(t),
+        spacing: z.object({
+          side: spacingNumber(t),
+          bottom: spacingNumber(t)
+        })
       }),
-      fade_background: z.boolean(),
-    }),
-    features: z.object({
-      file_upload: z.boolean(),
-      emoji: z.boolean(),
-      transcript: z.boolean().default(false),
-    }),
-    continuity: z.object({
-      offline_threshold: z.string().min(1, { message: t('globals.messages.required') }).refine(isGoDuration, { message: t('validation.invalidDuration') }),
-      max_messages_per_email: rangeNumber(t, 1, 100),
-      min_email_interval: z.string().min(1, { message: t('globals.messages.required') }).refine(isGoDuration, { message: t('validation.invalidDuration') }),
-    }).optional(),
-    session_duration: z.string().min(1, { message: t('globals.messages.required') }).refine(isGoDuration, { message: t('validation.invalidDuration') }),
-    direct_to_conversation: z.boolean().default(false),
-    trusted_domains: z.string().optional(),
-    blocked_ips: z.string().optional(),
-    home_apps: z.array(z.object({
-      type: z.enum(['announcement', 'external_link', 'help']),
-      title: z.string().optional().or(z.literal('')),
-      description: z.string().optional().or(z.literal('')),
-      image_url: optionalUrl(t),
-      url: optionalUrl(t),
-      text: z.string().optional().or(z.literal('')),
-    })),
-    visitors: z.object({
-      start_conversation_button_text: z.string(),
-      allow_start_conversation: z.boolean(),
-      prevent_multiple_conversations: z.boolean(),
-      prevent_reply_to_closed_conversation: z.boolean(),
-    }),
-    users: z.object({
-      start_conversation_button_text: z.string(),
-      allow_start_conversation: z.boolean(),
-      prevent_multiple_conversations: z.boolean(),
-      prevent_reply_to_closed_conversation: z.boolean(),
-    }),
-    prechat_form: z.object({
-      enabled: z.boolean(),
-      title: z.string().optional(),
-      fields: z.array(z.object({
-        key: z.string().min(1),
-        type: z.enum(['text', 'email', 'number', 'checkbox', 'date', 'link', 'list', 'phone']),
-        label: z.string().min(1, { message: t('globals.messages.required') }),
-        placeholder: z.string().optional(),
-        required: z.boolean(),
+      greeting_message: z.string().optional(),
+      introduction_message: z.string().optional(),
+      chat_introduction: z.string(),
+      quick_replies: quickReplies(t).optional(),
+      show_office_hours_in_chat: z.boolean(),
+      show_office_hours_after_assignment: z.boolean(),
+      chat_reply_expectation_message: z.string().optional(),
+      notice_banner: z
+        .object({
+          enabled: z.boolean(),
+          text: z.string().optional()
+        })
+        .superRefine((nb, ctx) => {
+          if (nb.enabled && !nb.text?.trim()) {
+            ctx.addIssue({
+              code: z.ZodIssueCode.custom,
+              path: ['text'],
+              message: t('globals.messages.required')
+            })
+          }
+        }),
+      colors: z.object({
+        primary: hexColor(t)
+      }),
+      home_screen: z.object({
+        header_text_color: z.enum(['black', 'white']),
+        background: z
+          .object({
+            type: z.enum(['solid', 'gradient', 'image']),
+            color: optionalHexColor(t),
+            gradient_start: optionalHexColor(t),
+            gradient_end: optionalHexColor(t),
+            image_url: optionalUrl(t)
+          })
+          .superRefine((bg, ctx) => {
+            // Empty solid colors use the page background, but empty gradients and images render nothing.
+            if (bg.type === 'gradient') {
+              if (!bg.gradient_start)
+                ctx.addIssue({
+                  code: z.ZodIssueCode.custom,
+                  path: ['gradient_start'],
+                  message: t('globals.messages.required')
+                })
+              if (!bg.gradient_end)
+                ctx.addIssue({
+                  code: z.ZodIssueCode.custom,
+                  path: ['gradient_end'],
+                  message: t('globals.messages.required')
+                })
+            } else if (bg.type === 'image' && !bg.image_url) {
+              ctx.addIssue({
+                code: z.ZodIssueCode.custom,
+                path: ['image_url'],
+                message: t('globals.messages.required')
+              })
+            }
+          }),
+        fade_background: z.boolean()
+      }),
+      features: z.object({
+        file_upload: z.boolean(),
+        emoji: z.boolean(),
+        transcript: z.boolean().default(false)
+      }),
+      continuity: z
+        .object({
+          offline_threshold: z
+            .string()
+            .min(1, { message: t('globals.messages.required') })
+            .refine(isGoDuration, { message: t('validation.invalidDuration') }),
+          max_messages_per_email: rangeNumber(t, 1, 100),
+          min_email_interval: z
+            .string()
+            .min(1, { message: t('globals.messages.required') })
+            .refine(isGoDuration, { message: t('validation.invalidDuration') })
+        })
+        .optional(),
+      session_duration: z
+        .string()
+        .min(1, { message: t('globals.messages.required') })
+        .refine(isGoDuration, { message: t('validation.invalidDuration') })
+        .refine((value) => goDurationSeconds(value) >= 3600, {
+          message: t('validation.minDuration', {
+            name: t('admin.inbox.livechat.sessionDuration.label'),
+            min: '1h'
+          })
+        }),
+      direct_to_conversation: z.boolean().default(false),
+      trusted_domains: z.string().optional(),
+      blocked_ips: z.string().optional(),
+      home_apps: z.array(
+        z.object({
+          type: z.enum(['announcement', 'external_link', 'help']),
+          title: z.string().optional().or(z.literal('')),
+          description: z.string().optional().or(z.literal('')),
+          image_url: optionalUrl(t),
+          url: optionalUrl(t),
+          text: z.string().optional().or(z.literal(''))
+        })
+      ),
+      visitors: z.object({
+        start_conversation_button_text: z.string(),
+        allow_start_conversation: z.boolean(),
+        prevent_multiple_conversations: z.boolean(),
+        prevent_reply_to_closed_conversation: z.boolean(),
+        quick_replies: quickReplies(t).optional(),
+        direct_to_conversation: z.boolean().optional()
+      }),
+      users: z.object({
+        start_conversation_button_text: z.string(),
+        allow_start_conversation: z.boolean(),
+        prevent_multiple_conversations: z.boolean(),
+        prevent_reply_to_closed_conversation: z.boolean(),
+        quick_replies: quickReplies(t).optional(),
+        direct_to_conversation: z.boolean().optional()
+      }),
+      prechat_form: z.object({
         enabled: z.boolean(),
-        order: z.number().min(1),
-        is_default: z.boolean(),
-        custom_attribute_id: z.number().optional()
-      }))
+        handoff_only: z.boolean().default(false),
+        title: z.string().optional(),
+        fields: z.array(prechatField(t)),
+        visitors: prechatAudience(t).optional(),
+        users: prechatAudience(t).optional()
+      })
     })
   })
-})
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
index 6a119d1b..22ee7645 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
@@ -1,343 +1,813 @@
 // @vitest-environment jsdom
 import { describe, test, expect } from 'vitest'
-import { createFormSchema } from './livechatFormSchema'
+import {
+  createFormSchema,
+  moveCampaign,
+  normalizeAudienceConfig,
+  normalizePrechatConfig
+} from './livechatFormSchema'
 
 const mockT = (key, params) => `${key} ${JSON.stringify(params || {})}`
 const schema = createFormSchema(mockT)
 
 const validConfig = {
-    brand_name: 'Acme',
-    dark_mode: false,
-    show_powered_by: true,
-    language: 'en',
-    launcher: {
-        position: 'right',
-        color: '#2563eb',
-        spacing: { side: 20, bottom: 20 }
-    },
-    chat_introduction: 'Ask us anything',
-    show_office_hours_in_chat: true,
-    show_office_hours_after_assignment: false,
-    notice_banner: { enabled: false },
-    colors: { primary: '#2563eb' },
-    home_screen: {
-        header_text_color: 'white',
-        background: { type: 'solid', color: '#2563eb' },
-        fade_background: true
-    },
-    features: { file_upload: true, emoji: true },
-    session_duration: '720h',
-    home_apps: [],
-    visitors: {
-        start_conversation_button_text: 'Start',
-        allow_start_conversation: true,
-        prevent_multiple_conversations: false,
-        prevent_reply_to_closed_conversation: false
-    },
-    users: {
-        start_conversation_button_text: 'Start',
-        allow_start_conversation: true,
-        prevent_multiple_conversations: false,
-        prevent_reply_to_closed_conversation: false
-    },
-    prechat_form: { enabled: false, fields: [] }
+  brand_name: 'Acme',
+  dark_mode: false,
+  show_powered_by: true,
+  language: 'en',
+  launcher: {
+    position: 'right',
+    color: '#2563eb',
+    spacing: { side: 20, bottom: 20 }
+  },
+  chat_introduction: 'Ask us anything',
+  show_office_hours_in_chat: true,
+  show_office_hours_after_assignment: false,
+  notice_banner: { enabled: false },
+  colors: { primary: '#2563eb' },
+  home_screen: {
+    header_text_color: 'white',
+    background: { type: 'solid', color: '#2563eb' },
+    fade_background: true
+  },
+  features: { file_upload: true, emoji: true },
+  session_duration: '720h',
+  home_apps: [],
+  visitors: {
+    start_conversation_button_text: 'Start',
+    allow_start_conversation: true,
+    prevent_multiple_conversations: false,
+    prevent_reply_to_closed_conversation: false
+  },
+  users: {
+    start_conversation_button_text: 'Start',
+    allow_start_conversation: true,
+    prevent_multiple_conversations: false,
+    prevent_reply_to_closed_conversation: false
+  },
+  prechat_form: { enabled: false, fields: [] }
 }
 
 const validForm = {
-    name: 'Website chat',
-    enabled: true,
-    csat_enabled: false,
-    prompt_tags_on_reply: false,
-    config: validConfig
+  name: 'Website chat',
+  enabled: true,
+  csat_enabled: false,
+  prompt_tags_on_reply: false,
+  config: validConfig
 }
 
 const withConfig = (overrides) => ({ ...validForm, config: { ...validConfig, ...overrides } })
+const validCampaign = {
+  id: '8a3660e6-e29b-461c-924f-314c7576f75a',
+  name: 'Pricing invitation',
+  enabled: true,
+  message: 'Need help choosing a plan?',
+  sender_id: 0,
+  team_id: 0,
+  audience: 'all',
+  include_urls: ['/pricing'],
+  exclude_urls: [],
+  conditions: { logical_op: 'AND', rules: [] },
+  event: '',
+  delay_seconds: 10,
+  business_hours_id: 0,
+  business_hours: 'any',
+  desktop: true,
+  mobile: true,
+  repeat: 'once',
+  repeat_hours: 24
+}
 
 describe('Livechat Inbox Form Schema', () => {
-    test('valid minimal form', () => {
-        expect(() => schema.parse(validForm)).not.toThrow()
+  test('valid minimal form', () => {
+    const parsed = schema.parse(validForm)
+    expect(parsed.config.previews).toEqual({
+      desktop: true,
+      mobile: true,
+      content: 'message',
+      auto_hide_seconds: 0
     })
+  })
 
-    test('valid complete form', () => {
-        expect(() => schema.parse({
-            ...validForm,
-            secret: 'shh',
-            linked_email_inbox_id: 3,
-            config: {
-                ...validConfig,
-                website_url: 'https://acme.example.com',
-                fallback_language: 'fr',
-                logo_url: 'https://cdn.example.com/logo.png',
-                greeting_message: 'Hi there',
-                introduction_message: 'We reply fast',
-                chat_reply_expectation_message: 'Usually within an hour',
-                notice_banner: { enabled: true, text: 'We are on holiday' },
-                continuity: {
-                    offline_threshold: '5m',
-                    max_messages_per_email: 10,
-                    min_email_interval: '30m'
-                },
-                direct_to_conversation: true,
-                trusted_domains: 'acme.example.com',
-                blocked_ips: '1.2.3.4',
-                home_apps: [
-                    { type: 'announcement', title: 'News', description: 'Read', text: 'Hi' },
-                    { type: 'external_link', title: 'Docs', url: 'https://docs.example.com', image_url: '' }
-                ],
-                prechat_form: {
-                    enabled: true,
-                    title: 'Before we start',
-                    fields: [{
-                        key: 'email',
-                        type: 'email',
-                        label: 'Email',
-                        placeholder: 'you@example.com',
-                        required: true,
-                        enabled: true,
-                        order: 1,
-                        is_default: true,
-                        custom_attribute_id: 2
-                    }]
-                }
-            }
-        })).not.toThrow()
-    })
-
-    test('name missing', () => {
-        const { name, ...form } = validForm
-        expect(() => schema.parse(form)).toThrow()
-    })
-
-    test('name empty string', () => {
-        expect(() => schema.parse({ ...validForm, name: '' })).toThrow()
-    })
-
-    test('enabled missing', () => {
-        const { enabled, ...form } = validForm
-        expect(() => schema.parse(form)).toThrow()
-    })
-
-    test('csat_enabled missing', () => {
-        const { csat_enabled, ...form } = validForm
-        expect(() => schema.parse(form)).toThrow()
-    })
-
-    test('config missing', () => {
-        const { config, ...form } = validForm
-        expect(() => schema.parse(form)).toThrow()
-    })
-
-    test('secret and linked_email_inbox_id accept null', () => {
-        expect(() => schema.parse({ ...validForm, secret: null, linked_email_inbox_id: null })).not.toThrow()
-    })
-
-    test('brand_name empty', () => {
-        expect(() => schema.parse(withConfig({ brand_name: '' }))).toThrow()
-    })
-
-    test('language empty', () => {
-        expect(() => schema.parse(withConfig({ language: '' }))).toThrow()
-    })
-
-    test('website_url invalid', () => {
-        expect(() => schema.parse(withConfig({ website_url: 'acme.example.com' }))).toThrow()
-    })
-
-    test('website_url empty string accepted', () => {
-        expect(() => schema.parse(withConfig({ website_url: '' }))).not.toThrow()
-    })
-
-    test('primary color invalid hex', () => {
-        expect(() => schema.parse(withConfig({ colors: { primary: 'blue' } }))).toThrow()
-    })
-
-    test('primary color three digit hex accepted', () => {
-        expect(() => schema.parse(withConfig({ colors: { primary: '#fff' } }))).not.toThrow()
-    })
-
-    test('primary color eight digit hex rejected', () => {
-        expect(() => schema.parse(withConfig({ colors: { primary: '#ffffff00' } }))).toThrow()
-    })
-
-    test('launcher position invalid', () => {
-        expect(() => schema.parse(withConfig({
-            launcher: { ...validConfig.launcher, position: 'center' }
-        }))).toThrow()
-    })
-
-    test('launcher spacing out of range', () => {
-        expect(() => schema.parse(withConfig({
-            launcher: { ...validConfig.launcher, spacing: { side: -1, bottom: 20 } }
-        }))).toThrow()
-        expect(() => schema.parse(withConfig({
-            launcher: { ...validConfig.launcher, spacing: { side: 20, bottom: 201 } }
-        }))).toThrow()
-    })
-
-    test('launcher spacing at boundaries', () => {
-        expect(() => schema.parse(withConfig({
-            launcher: { ...validConfig.launcher, spacing: { side: 0, bottom: 200 } }
-        }))).not.toThrow()
-    })
-
-    test('launcher spacing coerced from string', () => {
-        const parsed = schema.parse(withConfig({
-            launcher: { ...validConfig.launcher, spacing: { side: '30', bottom: '40' } }
-        }))
-        expect(parsed.config.launcher.spacing.side).toBe(30)
-    })
-
-    test('notice banner enabled without text', () => {
-        expect(() => schema.parse(withConfig({ notice_banner: { enabled: true } }))).toThrow()
-        expect(() => schema.parse(withConfig({ notice_banner: { enabled: true, text: '   ' } }))).toThrow()
-    })
-
-    test('notice banner disabled without text accepted', () => {
-        expect(() => schema.parse(withConfig({ notice_banner: { enabled: false, text: '' } }))).not.toThrow()
-    })
-
-    test('home screen header_text_color invalid', () => {
-        expect(() => schema.parse(withConfig({
-            home_screen: { ...validConfig.home_screen, header_text_color: 'grey' }
-        }))).toThrow()
-    })
-
-    test('solid background without a color accepted', () => {
-        expect(() => schema.parse(withConfig({
-            home_screen: { ...validConfig.home_screen, background: { type: 'solid' } }
-        }))).not.toThrow()
-    })
-
-    test('gradient background requires both stops', () => {
-        expect(() => schema.parse(withConfig({
-            home_screen: { ...validConfig.home_screen, background: { type: 'gradient', gradient_start: '#000000' } }
-        }))).toThrow()
-        expect(() => schema.parse(withConfig({
-            home_screen: {
-                ...validConfig.home_screen,
-                background: { type: 'gradient', gradient_start: '#000000', gradient_end: '#ffffff' }
-            }
-        }))).not.toThrow()
-    })
-
-    test('image background requires an image url', () => {
-        expect(() => schema.parse(withConfig({
-            home_screen: { ...validConfig.home_screen, background: { type: 'image' } }
-        }))).toThrow()
-        expect(() => schema.parse(withConfig({
-            home_screen: {
-                ...validConfig.home_screen,
-                background: { type: 'image', image_url: 'https://cdn.example.com/bg.png' }
-            }
-        }))).not.toThrow()
-    })
-
-    test('background type invalid', () => {
-        expect(() => schema.parse(withConfig({
-            home_screen: { ...validConfig.home_screen, background: { type: 'video' } }
-        }))).toThrow()
-    })
-
-    test('session_duration invalid duration', () => {
-        expect(() => schema.parse(withConfig({ session_duration: '30 days' }))).toThrow()
-    })
-
-    test('session_duration empty', () => {
-        expect(() => schema.parse(withConfig({ session_duration: '' }))).toThrow()
-    })
-
-    test('continuity optional', () => {
-        expect(() => schema.parse(validForm)).not.toThrow()
-    })
-
-    test('continuity offline_threshold invalid duration', () => {
-        expect(() => schema.parse(withConfig({
-            continuity: { offline_threshold: '5 min', max_messages_per_email: 10, min_email_interval: '30m' }
-        }))).toThrow()
-    })
-
-    test('continuity max_messages_per_email out of range', () => {
-        expect(() => schema.parse(withConfig({
-            continuity: { offline_threshold: '5m', max_messages_per_email: 0, min_email_interval: '30m' }
-        }))).toThrow()
-        expect(() => schema.parse(withConfig({
-            continuity: { offline_threshold: '5m', max_messages_per_email: 101, min_email_interval: '30m' }
-        }))).toThrow()
-    })
-
-    test('continuity max_messages_per_email at boundaries', () => {
-        expect(() => schema.parse(withConfig({
-            continuity: { offline_threshold: '5m', max_messages_per_email: 1, min_email_interval: '30m' }
-        }))).not.toThrow()
-        expect(() => schema.parse(withConfig({
-            continuity: { offline_threshold: '5m', max_messages_per_email: 100, min_email_interval: '30m' }
-        }))).not.toThrow()
-    })
-
-    test('home app type invalid', () => {
-        expect(() => schema.parse(withConfig({ home_apps: [{ type: 'banner' }] }))).toThrow()
-    })
-
-    test('home app url invalid', () => {
-        expect(() => schema.parse(withConfig({ home_apps: [{ type: 'external_link', url: 'docs' }] }))).toThrow()
-    })
-
-    test('home app with only a type accepted', () => {
-        expect(() => schema.parse(withConfig({ home_apps: [{ type: 'announcement' }] }))).not.toThrow()
-    })
-
-    test('prechat field label empty', () => {
-        expect(() => schema.parse(withConfig({
-            prechat_form: {
-                enabled: true,
-                fields: [{ key: 'email', type: 'email', label: '', required: true, enabled: true, order: 1, is_default: true }]
-            }
-        }))).toThrow()
-    })
-
-    test('prechat field key empty', () => {
-        expect(() => schema.parse(withConfig({
-            prechat_form: {
-                enabled: true,
-                fields: [{ key: '', type: 'email', label: 'Email', required: true, enabled: true, order: 1, is_default: true }]
-            }
-        }))).toThrow()
-    })
-
-    test('prechat field type invalid', () => {
-        expect(() => schema.parse(withConfig({
-            prechat_form: {
-                enabled: true,
-                fields: [{ key: 'x', type: 'textarea', label: 'X', required: false, enabled: true, order: 1, is_default: false }]
-            }
-        }))).toThrow()
-    })
-
-    test('prechat field order below minimum', () => {
-        expect(() => schema.parse(withConfig({
-            prechat_form: {
-                enabled: true,
-                fields: [{ key: 'x', type: 'text', label: 'X', required: false, enabled: true, order: 0, is_default: false }]
-            }
-        }))).toThrow()
-    })
-
-    test('all prechat field types accepted', () => {
-        for (const type of ['text', 'email', 'number', 'checkbox', 'date', 'link', 'list', 'phone']) {
-            expect(() => schema.parse(withConfig({
-                prechat_form: {
-                    enabled: true,
-                    fields: [{ key: 'x', type, label: 'X', required: false, enabled: true, order: 1, is_default: false }]
-                }
-            }))).not.toThrow()
+  test('help tab preserves audience placement and featured article order', () => {
+    const parsed = schema.parse(
+      withConfig({
+        help: {
+          help_center_id: 4,
+          visitors: { tab: true },
+          users: { tab: false },
+          featured_ids: [13, 8, 21]
         }
+      })
+    )
+
+    expect(parsed.config.help).toEqual({
+      help_center_id: 4,
+      visitors: { tab: true },
+      users: { tab: false },
+      featured_ids: [13, 8, 21]
+    })
+  })
+
+  test('help tab rejects more than ten featured articles', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          help: {
+            help_center_id: 4,
+            visitors: { tab: true },
+            users: { tab: true },
+            featured_ids: Array.from({ length: 11 }, (_, index) => index + 1)
+          }
+        })
+      )
+    ).toThrow()
+  })
+
+  test('reply preview settings enforce the auto-hide range', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          previews: { desktop: true, mobile: false, content: 'generic', auto_hide_seconds: 300 }
+        })
+      )
+    ).not.toThrow()
+    expect(() =>
+      schema.parse(
+        withConfig({
+          previews: { desktop: true, mobile: true, content: 'message', auto_hide_seconds: 301 }
+        })
+      )
+    ).toThrow()
+  })
+
+  test('valid complete form', () => {
+    expect(() =>
+      schema.parse({
+        ...validForm,
+        secret: 'shh',
+        linked_email_inbox_id: 3,
+        config: {
+          ...validConfig,
+          website_url: 'https://acme.example.com',
+          fallback_language: 'fr',
+          logo_url: 'https://cdn.example.com/logo.png',
+          greeting_message: 'Hi there',
+          introduction_message: 'We reply fast',
+          chat_reply_expectation_message: 'Usually within an hour',
+          quick_replies: 'Billing question\nReset my password',
+          notice_banner: { enabled: true, text: 'We are on holiday' },
+          continuity: {
+            offline_threshold: '5m',
+            max_messages_per_email: 10,
+            min_email_interval: '30m'
+          },
+          direct_to_conversation: true,
+          trusted_domains: 'acme.example.com',
+          blocked_ips: '1.2.3.4',
+          home_apps: [
+            { type: 'announcement', title: 'News', description: 'Read', text: 'Hi' },
+            { type: 'external_link', title: 'Docs', url: 'https://docs.example.com', image_url: '' }
+          ],
+          prechat_form: {
+            enabled: true,
+            title: 'Before we start',
+            fields: [
+              {
+                key: 'email',
+                type: 'email',
+                label: 'Email',
+                placeholder: 'you@example.com',
+                required: true,
+                enabled: true,
+                order: 1,
+                is_default: true,
+                custom_attribute_id: 2
+              }
+            ]
+          }
+        }
+      })
+    ).not.toThrow()
+  })
+
+  test('quick replies accept empty and repeated values', () => {
+    expect(() => schema.parse(withConfig({ quick_replies: '' }))).not.toThrow()
+    expect(() => schema.parse(withConfig({ quick_replies: 'Billing\nBilling' }))).not.toThrow()
+  })
+
+  test('campaigns trim and discard blank URL rows', () => {
+    const parsed = schema.parse(
+      withConfig({ campaigns: [{ ...validCampaign, include_urls: [' /pricing ', '', '   '] }] })
+    )
+    expect(parsed.config.campaigns[0].include_urls).toEqual(['/pricing'])
+  })
+
+  test('campaigns require a name and message', () => {
+    const result = schema.safeParse(
+      withConfig({ campaigns: [{ ...validCampaign, name: ' ', message: '' }] })
+    )
+    expect(result.success).toBe(false)
+    expect(result.error.issues.map((issue) => issue.path.join('.'))).toEqual(
+      expect.arrayContaining(['config.campaigns.0.name', 'config.campaigns.0.message'])
+    )
+  })
+
+  test('campaigns require at least one target device', () => {
+    const result = schema.safeParse(
+      withConfig({ campaigns: [{ ...validCampaign, desktop: false, mobile: false }] })
+    )
+    expect(result.success).toBe(false)
+    expect(result.error.issues[0].path.join('.')).toBe('config.campaigns.0.desktop')
+  })
+
+  test('campaign business-hour targeting requires a schedule', () => {
+    const result = schema.safeParse(
+      withConfig({ campaigns: [{ ...validCampaign, business_hours: 'inside' }] })
+    )
+    expect(result.success).toBe(false)
+    expect(result.error.issues[0].path.join('.')).toBe('config.campaigns.0.business_hours_id')
+  })
+
+  test('incomplete campaign conditions use product validation copy', () => {
+    const result = schema.safeParse(
+      withConfig({
+        campaigns: [
+          {
+            ...validCampaign,
+            conditions: {
+              logical_op: 'AND',
+              rules: [
+                {
+                  field: '',
+                  field_type: 'contact_custom_attribute',
+                  operator: '',
+                  value: '',
+                  case_sensitive_match: false
+                }
+              ]
+            }
+          }
+        ]
+      })
+    )
+    expect(result.success).toBe(false)
+    expect(result.error.issues.map((issue) => issue.message)).toEqual([
+      'globals.terms.required {}',
+      'globals.terms.required {}'
+    ])
+  })
+
+  test('campaign limits use product validation copy', () => {
+    const result = schema.safeParse(
+      withConfig({
+        campaigns: [
+          {
+            ...validCampaign,
+            include_urls: Array.from({ length: 21 }, (_, index) => `/page-${index}`),
+            delay_seconds: -1,
+            repeat_hours: 0
+          }
+        ],
+        campaign_cooldown_hours: 0
+      })
+    )
+    expect(result.success).toBe(false)
+    expect(result.error.issues.map((issue) => issue.message)).toEqual([
+      'widget.campaignUrlLimit {}',
+      'validation.minmaxNumber {"min":0,"max":86400}',
+      'validation.minmaxNumber {"min":1,"max":8760}',
+      'validation.minmaxNumber {"min":1,"max":8760}'
+    ])
+  })
+
+  test('quick replies reject more than six non-empty lines', () => {
+    expect(() => schema.parse(withConfig({ quick_replies: '1\n2\n3\n4\n5\n6\n7' }))).toThrow()
+    expect(() => schema.parse(withConfig({ quick_replies: '1\n2\n\n3\n4\n5\n6' }))).not.toThrow()
+  })
+
+  test('quick replies reject entries over 120 characters', () => {
+    expect(() => schema.parse(withConfig({ quick_replies: 'x'.repeat(121) }))).toThrow()
+  })
+
+  test('audience quick replies are validated independently', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          visitors: { ...validConfig.visitors, quick_replies: '1\n2\n3\n4\n5\n6\n7' },
+          users: { ...validConfig.users, quick_replies: '' }
+        })
+      )
+    ).toThrow()
+  })
+
+  test('legacy audience settings are copied without changing behavior', () => {
+    const config = {
+      ...validConfig,
+      quick_replies: ['Billing', 'Support'],
+      direct_to_conversation: true
+    }
+    expect(normalizeAudienceConfig(config, 'visitors')).toMatchObject({
+      quick_replies: 'Billing\nSupport',
+      direct_to_conversation: true
+    })
+    expect(normalizeAudienceConfig(config, 'users')).toMatchObject({
+      quick_replies: 'Billing\nSupport',
+      direct_to_conversation: true
+    })
+  })
+
+  test('explicit empty audience quick replies do not fall back to legacy replies', () => {
+    const config = {
+      ...validConfig,
+      quick_replies: ['Legacy'],
+      visitors: { ...validConfig.visitors, quick_replies: [], direct_to_conversation: false }
+    }
+    expect(normalizeAudienceConfig(config, 'visitors')).toMatchObject({
+      quick_replies: '',
+      direct_to_conversation: false
+    })
+  })
+
+  test('legacy prechat form is copied to both audiences', () => {
+    const fields = [{ key: 'plan', label: 'Plan' }]
+    const config = normalizePrechatConfig({
+      enabled: true,
+      title: 'Before we start',
+      fields
     })
 
-    test('direct_to_conversation defaults to false', () => {
-        expect(schema.parse(validForm).config.direct_to_conversation).toBe(false)
+    expect(config.visitors).toEqual({ enabled: true, title: 'Before we start', fields })
+    expect(config.users).toEqual({ enabled: true, title: 'Before we start', fields })
+    expect(config.visitors.fields).not.toBe(config.users.fields)
+  })
+
+  test('audience prechat forms preserve separate fields', () => {
+    const config = normalizePrechatConfig({
+      enabled: true,
+      title: 'Legacy',
+      fields: [{ key: 'legacy' }],
+      visitors: { enabled: true, title: 'Choose a plan', fields: [{ key: 'plan' }] },
+      users: { enabled: false, title: 'What is the issue?', fields: [] }
     })
 
-    test('empty object', () => {
-        expect(() => schema.parse({})).toThrow()
+    expect(config.visitors).toEqual({
+      enabled: true,
+      title: 'Choose a plan',
+      fields: [{ key: 'plan' }]
     })
+    expect(config.users).toEqual({ enabled: false, title: 'What is the issue?', fields: [] })
+  })
+
+  test('campaign priority follows saved array order', () => {
+    const campaigns = [{ id: 'first' }, { id: 'second' }, { id: 'third' }]
+    expect(moveCampaign(campaigns, 2, -1).map(({ id }) => id)).toEqual(['first', 'third', 'second'])
+    expect(campaigns.map(({ id }) => id)).toEqual(['first', 'second', 'third'])
+  })
+
+  test('name missing', () => {
+    const { name, ...form } = validForm
+    expect(() => schema.parse(form)).toThrow()
+  })
+
+  test('name empty string', () => {
+    expect(() => schema.parse({ ...validForm, name: '' })).toThrow()
+  })
+
+  test('enabled missing', () => {
+    const { enabled, ...form } = validForm
+    expect(() => schema.parse(form)).toThrow()
+  })
+
+  test('csat_enabled missing', () => {
+    const { csat_enabled, ...form } = validForm
+    expect(() => schema.parse(form)).toThrow()
+  })
+
+  test('config missing', () => {
+    const { config, ...form } = validForm
+    expect(() => schema.parse(form)).toThrow()
+  })
+
+  test('secret and linked_email_inbox_id accept null', () => {
+    expect(() =>
+      schema.parse({ ...validForm, secret: null, linked_email_inbox_id: null })
+    ).not.toThrow()
+  })
+
+  test('brand_name empty', () => {
+    expect(() => schema.parse(withConfig({ brand_name: '' }))).toThrow()
+  })
+
+  test('language empty', () => {
+    expect(() => schema.parse(withConfig({ language: '' }))).toThrow()
+  })
+
+  test('website_url invalid', () => {
+    expect(() => schema.parse(withConfig({ website_url: 'acme.example.com' }))).toThrow()
+  })
+
+  test('website_url empty string accepted', () => {
+    expect(() => schema.parse(withConfig({ website_url: '' }))).not.toThrow()
+  })
+
+  test('primary color invalid hex', () => {
+    expect(() => schema.parse(withConfig({ colors: { primary: 'blue' } }))).toThrow()
+  })
+
+  test('primary color three digit hex accepted', () => {
+    expect(() => schema.parse(withConfig({ colors: { primary: '#fff' } }))).not.toThrow()
+  })
+
+  test('primary color eight digit hex rejected', () => {
+    expect(() => schema.parse(withConfig({ colors: { primary: '#ffffff00' } }))).toThrow()
+  })
+
+  test('launcher position invalid', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          launcher: { ...validConfig.launcher, position: 'center' }
+        })
+      )
+    ).toThrow()
+  })
+
+  test('launcher spacing out of range', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          launcher: { ...validConfig.launcher, spacing: { side: -1, bottom: 20 } }
+        })
+      )
+    ).toThrow()
+    expect(() =>
+      schema.parse(
+        withConfig({
+          launcher: { ...validConfig.launcher, spacing: { side: 20, bottom: 201 } }
+        })
+      )
+    ).toThrow()
+  })
+
+  test('launcher spacing at boundaries', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          launcher: { ...validConfig.launcher, spacing: { side: 0, bottom: 200 } }
+        })
+      )
+    ).not.toThrow()
+  })
+
+  test('launcher spacing coerced from string', () => {
+    const parsed = schema.parse(
+      withConfig({
+        launcher: { ...validConfig.launcher, spacing: { side: '30', bottom: '40' } }
+      })
+    )
+    expect(parsed.config.launcher.spacing.side).toBe(30)
+  })
+
+  test('notice banner enabled without text', () => {
+    expect(() => schema.parse(withConfig({ notice_banner: { enabled: true } }))).toThrow()
+    expect(() =>
+      schema.parse(withConfig({ notice_banner: { enabled: true, text: '   ' } }))
+    ).toThrow()
+  })
+
+  test('notice banner disabled without text accepted', () => {
+    expect(() =>
+      schema.parse(withConfig({ notice_banner: { enabled: false, text: '' } }))
+    ).not.toThrow()
+  })
+
+  test('home screen header_text_color invalid', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          home_screen: { ...validConfig.home_screen, header_text_color: 'grey' }
+        })
+      )
+    ).toThrow()
+  })
+
+  test('solid background without a color accepted', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          home_screen: { ...validConfig.home_screen, background: { type: 'solid' } }
+        })
+      )
+    ).not.toThrow()
+  })
+
+  test('gradient background requires both stops', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          home_screen: {
+            ...validConfig.home_screen,
+            background: { type: 'gradient', gradient_start: '#000000' }
+          }
+        })
+      )
+    ).toThrow()
+    expect(() =>
+      schema.parse(
+        withConfig({
+          home_screen: {
+            ...validConfig.home_screen,
+            background: { type: 'gradient', gradient_start: '#000000', gradient_end: '#ffffff' }
+          }
+        })
+      )
+    ).not.toThrow()
+  })
+
+  test('image background requires an image url', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          home_screen: { ...validConfig.home_screen, background: { type: 'image' } }
+        })
+      )
+    ).toThrow()
+    expect(() =>
+      schema.parse(
+        withConfig({
+          home_screen: {
+            ...validConfig.home_screen,
+            background: { type: 'image', image_url: 'https://cdn.example.com/bg.png' }
+          }
+        })
+      )
+    ).not.toThrow()
+  })
+
+  test('background type invalid', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          home_screen: { ...validConfig.home_screen, background: { type: 'video' } }
+        })
+      )
+    ).toThrow()
+  })
+
+  test('session_duration invalid duration', () => {
+    expect(() => schema.parse(withConfig({ session_duration: '30 days' }))).toThrow()
+  })
+
+  test.each(['0h', '59m59s', '-1h'])('session_duration rejects %s', (sessionDuration) => {
+    expect(() => schema.parse(withConfig({ session_duration: sessionDuration }))).toThrow()
+  })
+
+  test.each(['1h', '60m', '3600s'])('session_duration accepts %s', (sessionDuration) => {
+    expect(() => schema.parse(withConfig({ session_duration: sessionDuration }))).not.toThrow()
+  })
+
+  test('session_duration empty', () => {
+    expect(() => schema.parse(withConfig({ session_duration: '' }))).toThrow()
+  })
+
+  test('continuity optional', () => {
+    expect(() => schema.parse(validForm)).not.toThrow()
+  })
+
+  test('continuity offline_threshold invalid duration', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          continuity: {
+            offline_threshold: '5 min',
+            max_messages_per_email: 10,
+            min_email_interval: '30m'
+          }
+        })
+      )
+    ).toThrow()
+  })
+
+  test('continuity max_messages_per_email out of range', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          continuity: {
+            offline_threshold: '5m',
+            max_messages_per_email: 0,
+            min_email_interval: '30m'
+          }
+        })
+      )
+    ).toThrow()
+    expect(() =>
+      schema.parse(
+        withConfig({
+          continuity: {
+            offline_threshold: '5m',
+            max_messages_per_email: 101,
+            min_email_interval: '30m'
+          }
+        })
+      )
+    ).toThrow()
+  })
+
+  test('continuity max_messages_per_email at boundaries', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          continuity: {
+            offline_threshold: '5m',
+            max_messages_per_email: 1,
+            min_email_interval: '30m'
+          }
+        })
+      )
+    ).not.toThrow()
+    expect(() =>
+      schema.parse(
+        withConfig({
+          continuity: {
+            offline_threshold: '5m',
+            max_messages_per_email: 100,
+            min_email_interval: '30m'
+          }
+        })
+      )
+    ).not.toThrow()
+  })
+
+  test('home app type invalid', () => {
+    expect(() => schema.parse(withConfig({ home_apps: [{ type: 'banner' }] }))).toThrow()
+  })
+
+  test('home app url invalid', () => {
+    expect(() =>
+      schema.parse(withConfig({ home_apps: [{ type: 'external_link', url: 'docs' }] }))
+    ).toThrow()
+  })
+
+  test('home app with only a type accepted', () => {
+    expect(() => schema.parse(withConfig({ home_apps: [{ type: 'announcement' }] }))).not.toThrow()
+  })
+
+  test('prechat field label empty', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          prechat_form: {
+            enabled: true,
+            fields: [
+              {
+                key: 'email',
+                type: 'email',
+                label: '',
+                required: true,
+                enabled: true,
+                order: 1,
+                is_default: true
+              }
+            ]
+          }
+        })
+      )
+    ).toThrow()
+  })
+
+  test('prechat field key empty', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          prechat_form: {
+            enabled: true,
+            fields: [
+              {
+                key: '',
+                type: 'email',
+                label: 'Email',
+                required: true,
+                enabled: true,
+                order: 1,
+                is_default: true
+              }
+            ]
+          }
+        })
+      )
+    ).toThrow()
+  })
+
+  test('prechat field type invalid', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          prechat_form: {
+            enabled: true,
+            fields: [
+              {
+                key: 'x',
+                type: 'textarea',
+                label: 'X',
+                required: false,
+                enabled: true,
+                order: 1,
+                is_default: false
+              }
+            ]
+          }
+        })
+      )
+    ).toThrow()
+  })
+
+  test('prechat field order below minimum', () => {
+    expect(() =>
+      schema.parse(
+        withConfig({
+          prechat_form: {
+            enabled: true,
+            fields: [
+              {
+                key: 'x',
+                type: 'text',
+                label: 'X',
+                required: false,
+                enabled: true,
+                order: 0,
+                is_default: false
+              }
+            ]
+          }
+        })
+      )
+    ).toThrow()
+  })
+
+  test('all prechat field types accepted', () => {
+    for (const type of ['text', 'email', 'number', 'checkbox', 'date', 'link', 'list', 'phone']) {
+      expect(() =>
+        schema.parse(
+          withConfig({
+            prechat_form: {
+              enabled: true,
+              fields: [
+                {
+                  key: 'x',
+                  type,
+                  label: 'X',
+                  required: false,
+                  enabled: true,
+                  order: 1,
+                  is_default: false
+                }
+              ]
+            }
+          })
+        )
+      ).not.toThrow()
+    }
+  })
+
+  test('audience prechat fields are validated independently', () => {
+    const result = schema.safeParse(
+      withConfig({
+        prechat_form: {
+          enabled: true,
+          title: 'Legacy',
+          fields: [],
+          visitors: {
+            enabled: true,
+            title: 'Choose a plan',
+            fields: [
+              {
+                key: 'plan',
+                type: 'text',
+                label: '',
+                required: true,
+                enabled: true,
+                order: 1,
+                is_default: false
+              }
+            ]
+          },
+          users: { enabled: true, title: 'What is the issue?', fields: [] }
+        }
+      })
+    )
+
+    expect(result.success).toBe(false)
+    expect(result.error.issues[0].path.join('.')).toBe(
+      'config.prechat_form.visitors.fields.0.label'
+    )
+  })
+
+  test('direct_to_conversation defaults to false', () => {
+    expect(schema.parse(validForm).config.direct_to_conversation).toBe(false)
+  })
+
+  test('empty object', () => {
+    expect(() => schema.parse({})).toThrow()
+  })
 })
diff --git a/frontend/apps/main/src/features/admin/inbox/useHelpCenterArticles.test.js b/frontend/apps/main/src/features/admin/inbox/useHelpCenterArticles.test.js
new file mode 100644
index 00000000..034809e2
--- /dev/null
+++ b/frontend/apps/main/src/features/admin/inbox/useHelpCenterArticles.test.js
@@ -0,0 +1,116 @@
+import { beforeEach, describe, expect, test, vi } from 'vitest'
+import { ref } from 'vue'
+import api from '@/api'
+import { useHelpCenterArticles } from './useHelpCenterArticles'
+
+vi.mock('@/api', () => ({
+  default: {
+    getHelpCenterTree: vi.fn()
+  }
+}))
+
+const treeResponse = (tree) => ({ data: { data: { tree } } })
+const deferred = () => {
+  let resolve
+  let reject
+  const promise = new Promise((resolvePromise, rejectPromise) => {
+    resolve = resolvePromise
+    reject = rejectPromise
+  })
+  return { promise, resolve, reject }
+}
+
+beforeEach(() => vi.clearAllMocks())
+
+describe('useHelpCenterArticles', () => {
+  test('keeps the empty state local when no help center is selected', () => {
+    const result = useHelpCenterArticles(ref(0))
+
+    expect(api.getHelpCenterTree).not.toHaveBeenCalled()
+    expect(result.tree.value).toEqual([])
+    expect(result.articles.value).toEqual([])
+    expect(result.failed.value).toBe(false)
+  })
+
+  test('exposes only published collections and articles', async () => {
+    api.getHelpCenterTree.mockResolvedValue(
+      treeResponse([
+        {
+          id: 1,
+          is_published: true,
+          articles: [
+            { id: 11, title: 'Published', status: 'published' },
+            { id: 12, title: 'Draft', status: 'draft' }
+          ],
+          children: [
+            {
+              id: 2,
+              is_published: true,
+              articles: [{ id: 21, title: 'Nested', status: 'published' }],
+              children: []
+            },
+            {
+              id: 3,
+              is_published: false,
+              articles: [{ id: 31, title: 'Hidden', status: 'published' }],
+              children: []
+            }
+          ]
+        }
+      ])
+    )
+
+    const result = useHelpCenterArticles(ref(7))
+
+    await vi.waitFor(() => expect(result.articles.value).toHaveLength(2))
+    expect(result.articles.value).toEqual([
+      expect.objectContaining({ id: 11, collection_id: 1 }),
+      expect.objectContaining({ id: 21, collection_id: 2 })
+    ])
+    expect(result.tree.value[0].article_count).toBe(2)
+  })
+
+  test('shows the failed empty state when loading fails', async () => {
+    api.getHelpCenterTree.mockRejectedValue(new Error('network'))
+
+    const result = useHelpCenterArticles(ref(7))
+
+    await vi.waitFor(() => expect(result.failed.value).toBe(true))
+    expect(result.tree.value).toEqual([])
+    expect(result.articles.value).toEqual([])
+  })
+
+  test('ignores an older response after the selected help center changes', async () => {
+    const first = deferred()
+    const second = deferred()
+    api.getHelpCenterTree.mockReturnValueOnce(first.promise).mockReturnValueOnce(second.promise)
+    const helpCenterID = ref(1)
+    const result = useHelpCenterArticles(helpCenterID)
+
+    helpCenterID.value = 2
+    second.resolve(
+      treeResponse([
+        {
+          id: 2,
+          is_published: true,
+          articles: [{ id: 22, title: 'Current', status: 'published' }],
+          children: []
+        }
+      ])
+    )
+    await vi.waitFor(() => expect(result.articles.value[0]?.id).toBe(22))
+
+    first.resolve(
+      treeResponse([
+        {
+          id: 1,
+          is_published: true,
+          articles: [{ id: 11, title: 'Stale', status: 'published' }],
+          children: []
+        }
+      ])
+    )
+    await Promise.resolve()
+    expect(result.articles.value[0].id).toBe(22)
+  })
+})
diff --git a/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue b/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue
index 6ad593bf..a90b6584 100644
--- a/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue
+++ b/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue
@@ -134,9 +134,14 @@
     :help-center-name="helpCenter?.name || ''"
     :help-center-locales="helpCenter?.allowed_locales || ['en']"
     :default-locale="props.locale"
+    :translation-source="translationSource"
     :submit-form="handleArticleSave"
     :is-loading="isSubmittingArticle"
     @cancel="closeEditSheet"
+    @create-translation="openCreateTranslation"
+    @create-translation-collection="openCreateTranslationCollection"
+    @open-translation="openTranslation"
+    @manage-languages="editHelpCenter"
   />
 
   <CollectionEditSheet
@@ -146,7 +151,7 @@
     :help-center-id="parseInt(id)"
     :parent-id="createCollectionParentId"
     :help-center-locales="helpCenter?.allowed_locales || ['en']"
-    :default-locale="props.locale"
+    :default-locale="createCollectionLocale || props.locale"
     :submit-form="handleCollectionSave"
     :is-loading="isSubmittingCollection"
     @cancel="closeEditSheet"
@@ -322,9 +327,12 @@ const insights = ref({ top_searches: [], no_result_searches: [] })
 const showArticleEditSheet = ref(false)
 const showCollectionEditSheet = ref(false)
 const editingArticle = ref(null)
+const translationSource = ref(null)
 const editingCollection = ref(null)
 const createCollectionParentId = ref(null)
+const createCollectionLocale = ref('')
 const createArticleCollectionId = ref(null)
+const pendingTranslation = ref(null)
 const deletingItem = ref(null)
 
 const breadcrumbLinks = computed(() => [
@@ -407,6 +415,7 @@ const selectItem = (item) => {
 }
 
 const openEditSheet = (item) => {
+  translationSource.value = null
   if (item.type === 'article') {
     editingArticle.value = item
     editingCollection.value = null
@@ -422,10 +431,13 @@ const closeEditSheet = () => {
   showArticleEditSheet.value = false
   showCollectionEditSheet.value = false
   editingArticle.value = null
+  translationSource.value = null
   editingCollection.value = null
   selectedItem.value = null
   createCollectionParentId.value = null
+  createCollectionLocale.value = ''
   createArticleCollectionId.value = null
+  pendingTranslation.value = null
 }
 
 const visitSite = () => {
@@ -460,23 +472,34 @@ const toggleActive = async () => {
 }
 
 const openCreateCollectionModal = (parentId = null) => {
+  pendingTranslation.value = null
   editingCollection.value = null
   createCollectionParentId.value = typeof parentId === 'number' ? parentId : null
+  createCollectionLocale.value = props.locale
   showCollectionEditSheet.value = true
 }
 
 const handleCollectionSave = async (formData) => {
   isSubmittingCollection.value = true
   try {
+    const resumeTranslation = !editingCollection.value ? pendingTranslation.value : null
+    let savedCollection = null
     if (editingCollection.value) {
       await api.updateCollection(props.id, editingCollection.value.id, formData)
     } else {
-      await api.createCollection(props.id, formData)
+      const { data } = await api.createCollection(props.id, formData)
+      savedCollection = data.data
     }
     emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
       description: t('globals.messages.savedSuccessfully')
     })
     closeEditSheet()
+    if (resumeTranslation) {
+      createArticleCollectionId.value = savedCollection.id
+      translationSource.value = resumeTranslation
+      showArticleEditSheet.value = true
+      return
+    }
     if (!followSavedLocale(formData.locale)) fetchTree({ silent: true })
   } catch (error) {
     emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
@@ -507,10 +530,34 @@ const openInsights = async () => {
 
 const openCreateArticleModal = (collection) => {
   editingArticle.value = null
+  translationSource.value = null
   createArticleCollectionId.value = collection.id
   showArticleEditSheet.value = true
 }
 
+const openCreateTranslation = ({ article, locale }) => {
+  editingArticle.value = null
+  createArticleCollectionId.value = null
+  translationSource.value = { ...article, locale }
+}
+
+const openCreateTranslationCollection = ({ article, locale }) => {
+  pendingTranslation.value = { ...article, locale }
+  showArticleEditSheet.value = false
+  editingArticle.value = null
+  translationSource.value = null
+  editingCollection.value = null
+  createCollectionParentId.value = null
+  createCollectionLocale.value = locale
+  showCollectionEditSheet.value = true
+}
+
+const openTranslation = (article) => {
+  editingArticle.value = article
+  createArticleCollectionId.value = null
+  translationSource.value = null
+}
+
 const handleArticleSave = async (formData) => {
   isSubmittingArticle.value = true
   try {
diff --git a/frontend/apps/main/src/views/search/SearchView.vue b/frontend/apps/main/src/views/search/SearchView.vue
index 6e5852e1..1bf90ad3 100644
--- a/frontend/apps/main/src/views/search/SearchView.vue
+++ b/frontend/apps/main/src/views/search/SearchView.vue
@@ -26,7 +26,7 @@
           <button
             v-if="term"
             type="button"
-            :aria-label="$t('globals.terms.clearSearch')"
+            :aria-label="$t('globals.messages.clearSearch')"
             class="absolute right-2 top-1/2 -translate-y-1/2 p-1.5 rounded-md text-muted-foreground hover:text-foreground hover:bg-accent"
             @click="term = ''"
           >
diff --git a/frontend/apps/widget/src/App.vue b/frontend/apps/widget/src/App.vue
index 5ad7f3ab..032dd2ad 100644
--- a/frontend/apps/widget/src/App.vue
+++ b/frontend/apps/widget/src/App.vue
@@ -74,7 +74,10 @@ const fetchInitialConversations = async () => {
       await chatStore.loadConversation(chatStore.getConversations[0].uuid)
     } catch { /* non-blocking */ }
   }
-  if (widgetStore.config?.direct_to_conversation && success) {
+  const audience = userStore.isVisitor ? widgetStore.config?.visitors : widgetStore.config?.users
+  const directToConversation =
+    audience?.direct_to_conversation ?? widgetStore.config?.direct_to_conversation
+  if (directToConversation && success) {
     widgetStore.navigateToChat()
   }
 }
diff --git a/frontend/apps/widget/src/api/index.js b/frontend/apps/widget/src/api/index.js
index f9adc78b..ce290c6d 100644
--- a/frontend/apps/widget/src/api/index.js
+++ b/frontend/apps/widget/src/api/index.js
@@ -3,131 +3,130 @@ import axios from 'axios'
 let _sessionToken = ''
 let _visitorToken = ''
 
-function postToParent (data) {
-    if (window.parent && window.parent !== window) {
-        window.parent.postMessage(data, '*')
-    }
+function postToParent(data) {
+  if (window.parent && window.parent !== window) {
+    window.parent.postMessage(data, '*')
+  }
 }
 
-function getInboxIDFromQuery () {
-    const params = new URLSearchParams(window.location.search)
-    return params.get('inbox_id') || null
+function getInboxIDFromQuery() {
+  const params = new URLSearchParams(window.location.search)
+  return params.get('inbox_id') || null
 }
 
-export function setApiSessionToken (token) {
-    _sessionToken = token || ''
+export function setApiSessionToken(token) {
+  _sessionToken = token || ''
 }
 
-export function setVisitorToken (token) {
-    _visitorToken = token
-    postToParent({ type: 'STORE_VISITOR_TOKEN', token })
+export function setVisitorToken(token) {
+  _visitorToken = token
+  postToParent({ type: 'STORE_VISITOR_TOKEN', token })
 }
 
-export function clearVisitorToken () {
-    _visitorToken = ''
-    postToParent({ type: 'CLEAR_VISITOR_TOKEN' })
+export function clearVisitorToken() {
+  _visitorToken = ''
+  postToParent({ type: 'CLEAR_VISITOR_TOKEN' })
 }
 
-export function getVisitorToken () {
-    return _visitorToken || null
+export function getVisitorToken() {
+  return _visitorToken || null
 }
 
-export function initVisitorToken (token) {
-    _visitorToken = token || ''
+export function initVisitorToken(token) {
+  _visitorToken = token || ''
 }
 
 // Stores registered by App.vue for use in the response interceptor.
 let _stores = null
-export function registerStores (stores) {
-    _stores = stores
+export function registerStores(stores) {
+  _stores = stores
 }
 
 // Clears all session state, cookies, and closes widget on 401/session expiry.
-function handleSessionExpired () {
-    if (!_stores) return
-    const { userStore, chatStore, widgetStore } = _stores
-    userStore.clearSessionToken()
-    clearVisitorToken()
-    postToParent({ type: 'CLEAR_SESSION_TOKEN' })
-    chatStore.setCurrentConversation(null)
-    chatStore.conversations = null
-    widgetStore.closeWidget()
+function handleSessionExpired() {
+  if (!_stores) return
+  const { userStore, chatStore, widgetStore } = _stores
+  userStore.clearSessionToken()
+  clearVisitorToken()
+  postToParent({ type: 'CLEAR_SESSION_TOKEN' })
+  chatStore.setCurrentConversation(null)
+  chatStore.conversations = null
+  widgetStore.closeWidget()
 }
 
 // Saves session token and user metadata from a server response.
 // When isNewVisitor is true, also stores the token as the visitor token (for merge flow).
-export function saveSession (sessionToken, user, userStore, isNewVisitor = false) {
-    userStore.setSessionToken(sessionToken)
-    setApiSessionToken(sessionToken)
-    if (user) userStore.setUserMeta(user)
-    if (isNewVisitor) setVisitorToken(sessionToken)
-    postToParent({ type: 'STORE_SESSION', token: sessionToken })
+export function saveSession(sessionToken, user, userStore, isNewVisitor = false) {
+  userStore.setSessionToken(sessionToken)
+  setApiSessionToken(sessionToken)
+  if (user) userStore.setUserMeta(user)
+  if (isNewVisitor) setVisitorToken(sessionToken)
+  postToParent({ type: 'STORE_SESSION', token: sessionToken })
 }
 
 // Returns visitor token if current user is a verified contact (for merge).
-function getVisitorTokenForMerge () {
-    const vt = getVisitorToken()
-    if (!vt || !_sessionToken || vt === _sessionToken) {
-        return null
-    }
-    return vt
+function getVisitorTokenForMerge() {
+  const vt = getVisitorToken()
+  if (!vt || !_sessionToken || vt === _sessionToken) {
+    return null
+  }
+  return vt
 }
 
 const http = axios.create({
-    timeout: 10000,
-    responseType: 'json'
+  timeout: 10000,
+  responseType: 'json'
 })
 
 // Set content type and authentication headers
 http.interceptors.request.use((request) => {
-    if ((request.method === 'post' || request.method === 'put') && !request.headers['Content-Type']) {
-        request.headers['Content-Type'] = 'application/json'
+  if ((request.method === 'post' || request.method === 'put') && !request.headers['Content-Type']) {
+    request.headers['Content-Type'] = 'application/json'
+  }
+
+  if (request.url && request.url.includes('/api/v1/widget/')) {
+    const inboxId = getInboxIDFromQuery()
+
+    if (_sessionToken) {
+      request.headers['Authorization'] = `Bearer ${_sessionToken}`
     }
 
-    // Add authentication headers for widget API endpoints
-    if (request.url && request.url.includes('/api/v1/widget/')) {
-        const inboxId = getInboxIDFromQuery()
-
-        if (_sessionToken) {
-            request.headers['Authorization'] = `Bearer ${_sessionToken}`
-        }
-
-        if (inboxId) {
-            request.headers['X-Libredesk-Inbox-ID'] = inboxId.toString()
-        }
-
-        const visitorTokenForMerge = getVisitorTokenForMerge()
-        if (visitorTokenForMerge) {
-            request.headers['X-Libredesk-Visitor-Token'] = visitorTokenForMerge
-        }
+    if (inboxId) {
+      request.headers['X-Libredesk-Inbox-ID'] = inboxId.toString()
     }
 
-    return request
+    const visitorTokenForMerge = getVisitorTokenForMerge()
+    if (visitorTokenForMerge) {
+      request.headers['X-Libredesk-Visitor-Token'] = visitorTokenForMerge
+    }
+  }
+
+  return request
 })
 
 http.interceptors.response.use(
-    (response) => {
-        if (response.headers['x-libredesk-clear-visitor']) {
-            clearVisitorToken()
-        }
-        return response
-    },
-    (error) => {
-        if (error.response?.status === 401) {
-            // Only cleanup if the failed request used the current session token.
-            // Prevents clearing a valid new session when a stale request returns 401.
-            const reqAuth = error.config?.headers?.Authorization
-            if (reqAuth && reqAuth === `Bearer ${_sessionToken}`) {
-                handleSessionExpired()
-            }
-        }
-        return Promise.reject(error)
+  (response) => {
+    if (response.headers['x-libredesk-clear-visitor']) {
+      clearVisitorToken()
     }
+    return response
+  },
+  (error) => {
+    if (error.response?.status === 401) {
+      // Ignore a stale 401 when a newer session is already active.
+      const reqAuth = error.config?.headers?.Authorization
+      if (reqAuth && reqAuth === `Bearer ${_sessionToken}`) {
+        handleSessionExpired()
+      }
+    }
+    return Promise.reject(error)
+  }
 )
 
-const getWidgetSettings = (inboxID) => http.get('/api/v1/widget/chat/settings', {
+const getWidgetSettings = (inboxID) =>
+  http.get('/api/v1/widget/chat/settings', {
     params: { inbox_id: inboxID }
-})
+  })
 const getLanguage = (lang) => http.get(`/api/v1/lang/${lang}`)
 const getAvailableLanguages = () => http.get('/api/v1/lang')
 const exchangeJWTForSession = (jwt) => http.post('/api/v1/widget/chat/auth/exchange', { jwt })
@@ -135,52 +134,66 @@ const getAuthMe = () => http.get('/api/v1/widget/chat/auth/me')
 const initChatConversation = (data) => http.post('/api/v1/widget/chat/conversations/init', data)
 const getChatConversations = () => http.get('/api/v1/widget/chat/conversations')
 const getChatConversation = (uuid) => http.get(`/api/v1/widget/chat/conversations/${uuid}`)
-const downloadTranscript = (uuid) => http.get(`/api/v1/widget/chat/conversations/${uuid}/transcript`, { responseType: 'blob' })
+const downloadTranscript = (uuid) =>
+  http.get(`/api/v1/widget/chat/conversations/${uuid}/transcript`, { responseType: 'blob' })
 const getHelp = (locale) => http.get('/api/v1/widget/chat/help', { params: { locale } })
-const searchHelp = (q, locale) => http.get('/api/v1/widget/chat/help/search', { params: { q, locale } })
-const getHelpArticle = (slug, locale) => http.get(`/api/v1/widget/chat/help/articles/${encodeURIComponent(slug)}`, { params: { locale } })
-const sendHelpFeedback = (helpSlug, slug, locale, helpful) => http.post(`/api/v1/public/help-centers/${encodeURIComponent(helpSlug)}/articles/${encodeURIComponent(slug)}/feedback`, { helpful }, { params: { locale } })
-const sendChatMessage = (uuid, data) => http.post(`/api/v1/widget/chat/conversations/${uuid}/message`, data)
+const searchHelp = (q, locale) =>
+  http.get('/api/v1/widget/chat/help/search', { params: { q, locale } })
+const getHelpArticle = (slug, locale) =>
+  http.get(`/api/v1/widget/chat/help/articles/${encodeURIComponent(slug)}`, { params: { locale } })
+const sendHelpFeedback = (helpSlug, slug, locale, helpful) =>
+  http.post(
+    `/api/v1/public/help-centers/${encodeURIComponent(helpSlug)}/articles/${encodeURIComponent(slug)}/feedback`,
+    { helpful },
+    { params: { locale } }
+  )
+const sendChatMessage = (uuid, data) =>
+  http.post(`/api/v1/widget/chat/conversations/${uuid}/message`, data)
+const submitHandoffForm = (uuid, formData) =>
+  http.post(`/api/v1/widget/chat/conversations/${uuid}/handoff-form`, { form_data: formData })
 const closeChatConversation = (uuid) => http.post(`/api/v1/widget/chat/conversations/${uuid}/close`)
 const uploadMedia = (conversationUUID, files) => {
-    const formData = new FormData()
-    formData.append('conversation_uuid', conversationUUID)
-    for (let i = 0; i < files.length; i++) {
-        formData.append('files', files[i])
-    }
-    return http.post('/api/v1/widget/media/upload', formData, {
-        headers: { 'Content-Type': 'multipart/form-data' },
-        timeout: 120000
-    })
+  const formData = new FormData()
+  formData.append('conversation_uuid', conversationUUID)
+  for (let i = 0; i < files.length; i++) {
+    formData.append('files', files[i])
+  }
+  return http.post('/api/v1/widget/media/upload', formData, {
+    headers: { 'Content-Type': 'multipart/form-data' },
+    timeout: 120000
+  })
 }
-const updateConversationLastSeen = (uuid) => http.post(`/api/v1/widget/chat/conversations/${uuid}/update-last-seen`)
+const updateConversationLastSeen = (uuid) =>
+  http.post(`/api/v1/widget/chat/conversations/${uuid}/update-last-seen`)
 const submitCSATResponse = (csatUuid, rating, feedback) =>
-    http.post(`/api/v1/csat/${csatUuid}/response`, {
-        rating,
-        feedback,
-    })
+  http.post(`/api/v1/csat/${csatUuid}/response`, {
+    rating,
+    feedback
+  })
 
-const nextCampaign = data => http.post('/api/v1/widget/chat/campaigns/next', data)
-const campaignEvent = data => http.post('/api/v1/widget/chat/campaigns/event', data)
+const nextCampaign = (data) => http.post('/api/v1/widget/chat/campaigns/next', data)
+const campaignEvent = (data) => http.post('/api/v1/widget/chat/campaigns/event', data)
 
 export default {
-    nextCampaign, campaignEvent,
-    getWidgetSettings,
-    getLanguage,
-    getAvailableLanguages,
-    exchangeJWTForSession,
-    getAuthMe,
-    initChatConversation,
-    getChatConversations,
-    getChatConversation,
-    downloadTranscript,
-    getHelp,
-    searchHelp,
-    getHelpArticle,
-    sendHelpFeedback,
-    sendChatMessage,
-    closeChatConversation,
-    uploadMedia,
-    updateConversationLastSeen,
-    submitCSATResponse
+  nextCampaign,
+  campaignEvent,
+  getWidgetSettings,
+  getLanguage,
+  getAvailableLanguages,
+  exchangeJWTForSession,
+  getAuthMe,
+  initChatConversation,
+  getChatConversations,
+  getChatConversation,
+  downloadTranscript,
+  getHelp,
+  searchHelp,
+  getHelpArticle,
+  sendHelpFeedback,
+  sendChatMessage,
+  submitHandoffForm,
+  closeChatConversation,
+  uploadMedia,
+  updateConversationLastSeen,
+  submitCSATResponse
 }
diff --git a/frontend/apps/widget/src/components/AnnouncementCard.vue b/frontend/apps/widget/src/components/AnnouncementCard.vue
index 18834c3d..960b2ce9 100644
--- a/frontend/apps/widget/src/components/AnnouncementCard.vue
+++ b/frontend/apps/widget/src/components/AnnouncementCard.vue
@@ -1,14 +1,12 @@
 <template>
   <a :href="announcement.url" target="_blank" rel="noopener noreferrer" class="block no-underline">
-    <Card class="overflow-hidden hover:bg-accent transition-colors cursor-pointer rounded-md">
-      <img
-        :src="announcement.image_url"
-        :alt="announcement.title"
-        class="w-full h-auto"
-      />
-      <CardContent class="p-3 text-sm">
-        <div class="font-bold">{{ announcement.title }}</div>
-        <div v-if="announcement.description" class="text-muted-foreground mt-1 line-height-10">
+    <Card
+      class="overflow-hidden rounded-xl border-border/80 transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
+    >
+      <img :src="announcement.image_url" :alt="announcement.title" class="w-full h-auto" />
+      <CardContent class="p-4 text-sm">
+        <div class="font-semibold leading-snug">{{ announcement.title }}</div>
+        <div v-if="announcement.description" class="mt-1 text-muted-foreground leading-relaxed">
           {{ announcement.description }}
         </div>
       </CardContent>
diff --git a/frontend/apps/widget/src/components/ArticleReader.vue b/frontend/apps/widget/src/components/ArticleReader.vue
index 88e99aea..2009af25 100644
--- a/frontend/apps/widget/src/components/ArticleReader.vue
+++ b/frontend/apps/widget/src/components/ArticleReader.vue
@@ -1,10 +1,12 @@
 <script setup>
-import { computed, ref } from 'vue'
+import { computed, ref, onUnmounted } from 'vue'
 import articleCSS from '@public-static/article-content.css?raw'
 
 const props = defineProps({ article: { type: Object, required: true }, helpSlug: { type: String, required: true }, dark: Boolean })
 const emit = defineEmits(['article'])
 const frame = ref(null)
+const height = ref('0px')
+let observer = null
 const documentHTML = computed(() => {
   const doc = document.implementation.createHTMLDocument(props.article.title)
   const policy = doc.createElement('meta')
@@ -12,7 +14,7 @@ const documentHTML = computed(() => {
   policy.content = "default-src 'none'; img-src https: http: data:; style-src 'unsafe-inline'; font-src 'none'; frame-src 'none'; form-action 'none'; base-uri 'none'"
   doc.head.append(policy)
   const style = doc.createElement('style')
-  style.textContent = `${articleCSS}\nbody{margin:0;padding:16px;font:14px/1.6 system-ui;overflow-wrap:anywhere}img{max-width:100%}a{color:inherit}table{display:block;overflow:auto}.hc-prose pre{background:var(--hc-accent-tint);color:inherit}.hc-callout{background:var(--hc-accent-tint);color:inherit}`
+  style.textContent = `${articleCSS}\nbody{margin:0;padding:16px;font:14px/1.6 system-ui;overflow-wrap:anywhere}html{overflow:hidden}img{max-width:100%}a{color:inherit}table{display:block;overflow:auto}.hc-prose pre{background:var(--hc-accent-tint);color:inherit}.hc-callout{background:var(--hc-accent-tint);color:inherit}`
   doc.head.append(style)
   doc.body.className = 'hc-prose'
   doc.body.innerHTML = props.article.content
@@ -40,6 +42,9 @@ const loaded = () => {
   const theme = getComputedStyle(frame.value)
   doc.body.style.color = theme.color
   doc.body.style.background = theme.backgroundColor
+  observer?.disconnect()
+  observer = new ResizeObserver(() => { height.value = `${doc.documentElement.scrollHeight}px` })
+  observer.observe(doc.body)
   for (const [target, source] of Object.entries({ '--hc-border': '--border', '--hc-accent': '--primary', '--hc-accent-ink': '--primary', '--hc-accent-tint': '--muted', '--hc-muted': '--muted-foreground' })) {
     doc.documentElement.style.setProperty(target, `hsl(${theme.getPropertyValue(source)})`)
   }
@@ -53,8 +58,9 @@ const loaded = () => {
     else window.open(url.href, '_blank', 'noopener,noreferrer')
   })
 }
+onUnmounted(() => observer?.disconnect())
 </script>
 
 <template>
-  <iframe ref="frame" :key="`${article.id}-${dark}`" :title="article.title" :srcdoc="documentHTML" sandbox="allow-same-origin" class="w-full flex-1 min-h-0 border-0 bg-background text-foreground" @load="loaded" />
+  <iframe ref="frame" :key="`${article.id}-${dark}`" :title="article.title" :srcdoc="documentHTML" sandbox="allow-same-origin" scrolling="no" class="block w-full border-0 bg-background text-foreground" :style="{ height }" @load="loaded" />
 </template>
diff --git a/frontend/apps/widget/src/components/ChatMessages.vue b/frontend/apps/widget/src/components/ChatMessages.vue
index f2687173..88f14906 100644
--- a/frontend/apps/widget/src/components/ChatMessages.vue
+++ b/frontend/apps/widget/src/components/ChatMessages.vue
@@ -19,124 +19,139 @@
           :noticeText="config.notice_banner.text"
         />
 
-        <!-- Messages -->
-        <TransitionGroup tag="div" enter-active-class="animate-slide-in" class="flex flex-col gap-4">
-        <div
-          v-for="message in chatStore.getCurrentConversationMessages"
-          :key="message.uuid"
-          :data-message-uuid="message.uuid"
-          :class="[
-            'flex flex-col',
-            message.author.type === 'contact' || message.author.type === 'visitor'
-              ? 'items-end'
-              : 'items-start'
-          ]"
-        >
-          <!-- CSAT Message Bubble -->
-          <CSATMessageBubble
-            v-if="message.meta?.is_csat"
-            :message="message"
-            @submitted="handleCSATSubmitted"
-          />
+        <ProactiveMessage
+          v-if="proactive.pending && !chatStore.currentConversation?.uuid"
+          :pending="proactive.pending"
+        />
 
-          <!-- Regular Message Bubble -->
+        <!-- Messages -->
+        <TransitionGroup
+          tag="div"
+          enter-active-class="animate-slide-in"
+          class="flex flex-col gap-4"
+        >
           <div
-            v-else
+            v-for="message in chatStore.getCurrentConversationMessages"
+            :key="message.uuid"
+            :data-message-uuid="message.uuid"
             :class="[
-              'max-w-[85%] px-4 py-3 rounded-2xl text-sm leading-5 break-words transition-all duration-200',
+              'flex flex-col',
               message.author.type === 'contact' || message.author.type === 'visitor'
-                ? [
-                    'text-primary-foreground',
-                    message.status === 'sending' || message.status === 'uploading'
-                      ? 'bg-primary/60'
-                      : message.status === 'failed'
-                        ? 'bg-destructive/60'
-                        : 'bg-primary'
-                  ]
-                : 'bg-muted text-foreground',
-              {
-                'show-quoted-text': isQuotedTextVisible(message.uuid),
-                'hide-quoted-text': !isQuotedTextVisible(message.uuid)
-              }
+                ? 'items-end'
+                : 'items-start'
             ]"
           >
-            <!-- Message content -->
-            <span v-if="message.content_type === 'text'" class="whitespace-pre-wrap">{{
-              message.content
-            }}</span>
-            <Letter
-              v-else
-              :html="message.content"
-              :allowedSchemas="['cid', 'https', 'http', 'mailto']"
-              :allowed-css-properties="extendedCssProperties"
-              class="native-html"
+            <CSATMessageBubble
+              v-if="message.meta?.is_csat"
+              :message="message"
+              @submitted="handleCSATSubmitted"
             />
+
             <div
-              v-if="containsQuoteMarkers(message.content)"
-              @click="toggleQuote(message.uuid)"
-              @keydown.enter.prevent="toggleQuote(message.uuid)"
-              @keydown.space.prevent="toggleQuote(message.uuid)"
-              tabindex="0"
-              role="button"
-              :aria-expanded="isQuotedTextVisible(message.uuid)"
+              v-else
               :class="[
-                'text-xs cursor-pointer px-2 py-1 w-max rounded-md transition-all mt-1',
+                'max-w-[85%] px-4 py-3 rounded-2xl text-sm leading-5 break-words transition-all duration-200',
                 message.author.type === 'contact' || message.author.type === 'visitor'
-                  ? 'text-primary-foreground/70 hover:bg-primary-foreground/10 hover:text-primary-foreground'
-                  : 'text-muted-foreground hover:bg-muted hover:text-primary'
+                  ? [
+                      'text-primary-foreground',
+                      message.status === 'sending' || message.status === 'uploading'
+                        ? 'bg-primary/60'
+                        : message.status === 'failed'
+                          ? 'bg-destructive/60'
+                          : 'bg-primary'
+                    ]
+                  : 'bg-muted text-foreground',
+                {
+                  'show-quoted-text': isQuotedTextVisible(message.uuid),
+                  'hide-quoted-text': !isQuotedTextVisible(message.uuid)
+                }
               ]"
             >
-              {{
-                isQuotedTextVisible(message.uuid)
-                  ? t('conversation.hideQuotedText')
-                  : t('conversation.showQuotedText')
-              }}
-            </div>
-            <!-- Show attachments if available -->
-            <MessageAttachment class="mt-1" :attachments="message.attachments" />
-          </div>
-
-          <!-- Message metadata -->
-          <div class="text-[10px] text-muted-foreground mt-1 flex items-center gap-2">
-            <!-- Agent name and time for agent messages -->
-            <span v-if="message.author.type === 'agent'">
-              {{ message.author.first_name }} {{ message.author.last_name }}
-              •
-              {{ getMessageTime(message.created_at) }}
-            </span>
-
-            <!-- Delivery status for user messages -->
-            <span
-              v-else-if="message.author.type === 'contact' || message.author.type === 'visitor'"
-              class="flex items-center gap-1"
-            >
-              <span
-                v-if="message.status === 'sending' || message.status === 'uploading'"
-                class="flex items-center gap-1"
+              <span v-if="message.content_type === 'text'" class="whitespace-pre-wrap">{{
+                message.content
+              }}</span>
+              <Letter
+                v-else
+                :html="message.content"
+                :allowedSchemas="['cid', 'https', 'http', 'mailto']"
+                :allowed-css-properties="extendedCssProperties"
+                class="native-html"
+              />
+              <div
+                v-if="containsQuoteMarkers(message.content)"
+                @click="toggleQuote(message.uuid)"
+                @keydown.enter.prevent="toggleQuote(message.uuid)"
+                @keydown.space.prevent="toggleQuote(message.uuid)"
+                tabindex="0"
+                role="button"
+                :aria-expanded="isQuotedTextVisible(message.uuid)"
+                :class="[
+                  'text-xs cursor-pointer px-2 py-1 w-max rounded-md transition-all mt-1',
+                  message.author.type === 'contact' || message.author.type === 'visitor'
+                    ? 'text-primary-foreground/70 hover:bg-primary-foreground/10 hover:text-primary-foreground'
+                    : 'text-muted-foreground hover:bg-muted hover:text-primary'
+                ]"
               >
-                <div
-                  class="w-3 h-3 border border-current border-t-transparent rounded-full animate-spin"
-                ></div>
-                <span v-if="message.status === 'sending'">
-                  {{ $t('globals.messages.sending') }}
-                </span>
-                <span v-if="message.status === 'uploading'">
-                  {{ $t('globals.messages.uploading') }}
-                </span>
-              </span>
-              <span v-else>
+                {{
+                  isQuotedTextVisible(message.uuid)
+                    ? t('conversation.hideQuotedText')
+                    : t('conversation.showQuotedText')
+                }}
+              </div>
+              <MessageAttachment class="mt-1" :attachments="message.attachments" />
+
+              <PreChatForm
+                v-if="message.uuid === pendingHandoffMessageUUID"
+                handoff-mode
+                :is-submitting="props.handoffFormSubmitting"
+                class="mt-3 border-t border-border pt-3"
+                @submit="emit('handoff-form-submit', { ...$event, message })"
+              />
+            </div>
+
+            <ReplyButtons
+              v-if="message.uuid === suggestedReplyMessageUUID"
+              :replies="message.meta.suggested_replies"
+              class="mt-2 max-w-[85%]"
+              @select="emit('suggested-reply', $event)"
+            />
+
+            <div class="text-[10px] text-muted-foreground mt-1 flex items-center gap-2">
+              <span v-if="message.author.type === 'agent'">
+                {{ message.author.first_name }} {{ message.author.last_name }}
+                •
                 {{ getMessageTime(message.created_at) }}
               </span>
-            </span>
+
+              <span
+                v-else-if="message.author.type === 'contact' || message.author.type === 'visitor'"
+                class="flex items-center gap-1"
+              >
+                <span
+                  v-if="message.status === 'sending' || message.status === 'uploading'"
+                  class="flex items-center gap-1"
+                >
+                  <div
+                    class="w-3 h-3 border border-current border-t-transparent rounded-full animate-spin"
+                  ></div>
+                  <span v-if="message.status === 'sending'">
+                    {{ $t('globals.messages.sending') }}
+                  </span>
+                  <span v-if="message.status === 'uploading'">
+                    {{ $t('globals.messages.uploading') }}
+                  </span>
+                </span>
+                <span v-else>
+                  {{ getMessageTime(message.created_at) }}
+                </span>
+              </span>
+            </div>
           </div>
-        </div>
         </TransitionGroup>
 
         <!-- Typing Indicator -->
         <div v-if="isTyping" class="flex flex-col items-start">
-          <div
-            class="max-w-[85%] px-4 py-3 rounded-2xl text-sm leading-5 bg-muted text-foreground"
-          >
+          <div class="max-w-[85%] px-4 py-3 rounded-2xl text-sm leading-5 bg-muted text-foreground">
             <TypingIndicator />
           </div>
         </div>
@@ -163,9 +178,13 @@ import { Letter } from 'vue-letter'
 import { allowedCssProperties } from 'lettersanitizer'
 import ScrollToBottomButton from '@shared-ui/components/ScrollToBottomButton'
 import ChatIntro from './ChatIntro.vue'
+import ProactiveMessage from './ProactiveMessage.vue'
+import { useProactiveStore } from '@widget/store/proactive.js'
 import NoticeBanner from './NoticeBanner.vue'
 import MessageAttachment from './MessageAttachment.vue'
 import CSATMessageBubble from './CSATMessageBubble.vue'
+import PreChatForm from './PreChatForm.vue'
+import ReplyButtons from './ReplyButtons.vue'
 import { TypingIndicator } from '@shared-ui/components/TypingIndicator'
 import { Spinner } from '@shared-ui/components/ui/spinner'
 import { containsQuoteMarkers } from '@shared-ui/utils/quotedContent.js'
@@ -177,11 +196,17 @@ const props = defineProps({
   showPreChatForm: {
     type: Boolean,
     default: false
+  },
+  handoffFormSubmitting: {
+    type: Boolean,
+    default: false
   }
 })
+const emit = defineEmits(['suggested-reply', 'handoff-form-submit'])
 
 const widgetStore = useWidgetStore()
 const chatStore = useChatStore()
+const proactive = useProactiveStore()
 const messagesContainer = ref(null)
 const contentEl = ref(null)
 const unreadMessages = ref(0)
@@ -189,13 +214,34 @@ const currentConversationUUID = ref('')
 const quotedTextState = ref({})
 const { t } = useI18n()
 
-const { hasUserScrolled, scrollToBottom, scrollToOffset, handleScroll } = useStickyScroll(messagesContainer, contentEl, {
-  onArriveBottom: () => { unreadMessages.value = 0 }
-})
+const { hasUserScrolled, scrollToBottom, scrollToOffset, handleScroll } = useStickyScroll(
+  messagesContainer,
+  contentEl,
+  {
+    onArriveBottom: () => {
+      unreadMessages.value = 0
+    }
+  }
+)
 
 const config = computed(() => widgetStore.config)
 const isTyping = computed(() => chatStore.isTyping)
 const isLoadingConversation = computed(() => chatStore.isLoadingConversation)
+const suggestedReplyMessageUUID = computed(() => {
+  const lastMessage = chatStore.getCurrentConversationLastMessage
+  if (
+    lastMessage?.author?.type === 'ai_assistant' &&
+    Array.isArray(lastMessage.meta?.suggested_replies) &&
+    lastMessage.meta.suggested_replies.length > 0
+  ) {
+    return lastMessage.uuid
+  }
+  return ''
+})
+const pendingHandoffMessageUUID = computed(() => {
+  const lastMessage = chatStore.getCurrentConversationLastMessage
+  return lastMessage?.meta?.handoff_form_pending ? lastMessage.uuid : ''
+})
 
 const getMessageTime = (timestamp) => {
   return useRelativeTime(new Date(timestamp)).value
@@ -268,7 +314,11 @@ watch(
       const target = id && contentEl.value?.querySelector(`[data-message-uuid="${id}"]`)
       if (target) {
         hasUserScrolled.value = true
-        scrollToOffset(target.getBoundingClientRect().top - messagesContainer.value.getBoundingClientRect().top + messagesContainer.value.scrollTop)
+        scrollToOffset(
+          target.getBoundingClientRect().top -
+            messagesContainer.value.getBoundingClientRect().top +
+            messagesContainer.value.scrollTop
+        )
         chatStore.previewUnreadUUID = null
       } else scrollToBottom()
     })
@@ -290,8 +340,7 @@ watch(
     }
     if (!oldLen || !widgetStore.isOpen) return
     if (newLen <= oldLen) return
-    const messages = chatStore.getCurrentConversationMessages
-    const newMessage = messages[messages.length - 1]
+    const newMessage = chatStore.getCurrentConversationLastMessage
     const isOwnMessage =
       newMessage.author?.type === 'contact' || newMessage.author?.type === 'visitor'
 
diff --git a/frontend/apps/widget/src/components/HomeExternalLink.vue b/frontend/apps/widget/src/components/HomeExternalLink.vue
index 4b2e1b87..3ec6c2b8 100644
--- a/frontend/apps/widget/src/components/HomeExternalLink.vue
+++ b/frontend/apps/widget/src/components/HomeExternalLink.vue
@@ -1,12 +1,18 @@
 <template>
   <a :href="link.url" target="_blank" rel="noopener noreferrer" class="block no-underline">
-    <Card class="hover:bg-accent transition-colors cursor-pointer rounded-md">
+    <Card
+      class="rounded-xl border-border/80 transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
+    >
       <CardContent class="p-4">
-        <div class="flex justify-between items-center">
-          <span class="text-sm text-foreground font-medium">
+        <div class="flex items-center gap-3">
+          <span class="flex size-9 shrink-0 items-center justify-center rounded-lg bg-muted">
+            <img v-if="link.image_url" :src="link.image_url" alt="" class="size-5 object-contain" />
+            <Globe2 v-else size="16" class="text-muted-foreground" aria-hidden="true" />
+          </span>
+          <span class="min-w-0 flex-1 text-sm font-medium leading-snug text-foreground">
             {{ link.text }}
           </span>
-          <ExternalLink size="18" class="text-muted-foreground" />
+          <ExternalLink size="15" class="shrink-0 text-muted-foreground" aria-hidden="true" />
         </div>
       </CardContent>
     </Card>
@@ -15,7 +21,7 @@
 
 <script setup>
 import { Card, CardContent } from '@shared-ui/components/ui/card'
-import { ExternalLink } from 'lucide-vue-next'
+import { ExternalLink, Globe2 } from 'lucide-vue-next'
 
 defineProps({
   link: {
diff --git a/frontend/apps/widget/src/components/HomeHeader.vue b/frontend/apps/widget/src/components/HomeHeader.vue
index fae14dd8..8775d012 100644
--- a/frontend/apps/widget/src/components/HomeHeader.vue
+++ b/frontend/apps/widget/src/components/HomeHeader.vue
@@ -1,29 +1,27 @@
 <template>
   <div class="relative" :style="headerStyle">
-    <div class="p-8">
-      <!-- Logo -->
+    <div class="p-7">
       <img
         v-if="config.logo_url"
         :src="config.logo_url"
         :alt="config.brand_name"
-        class="max-h-8 max-w-full"
+        class="max-h-7 max-w-full"
       />
-      <!-- Greeting and introduction -->
-      <div class="mt-24 font-bold text-4xl" :class="textColorClass">
-        <h2 class="break-all">{{ parsedGreeting }}</h2>
-        <p class="mt-2 font-semibold" :class="subTextColorClass">
+      <div class="mt-20" :class="textColorClass">
+        <h2 class="text-4xl font-bold leading-none tracking-tight break-words">
+          {{ parsedGreeting }}
+        </h2>
+        <p class="mt-3 max-w-80 text-2xl font-medium leading-tight" :class="subTextColorClass">
           {{ parsedIntroduction }}
         </p>
       </div>
     </div>
-    <!-- Primary action area sits on the gradient so it doesn't cut off visually. -->
-    <div class="relative z-10 px-4 pb-4">
+    <div class="relative z-10 px-4 pb-5">
       <slot />
     </div>
-    <!-- Fade overlay: masks the gradient's bottom into bg-background for a seamless transition. -->
     <div
       v-if="config.home_screen?.background?.type"
-      class="absolute bottom-0 left-0 right-0 h-16 pointer-events-none"
+      class="absolute bottom-0 left-0 right-0 h-20 pointer-events-none"
       :style="fadeStyle"
     ></div>
   </div>
@@ -93,5 +91,8 @@ const subTextColorClass = computed(() => {
   return 'text-muted-foreground'
 })
 
-const fadeStyle = { background: 'linear-gradient(to bottom, transparent, hsl(var(--background)))' }
+const fadeStyle = {
+  background:
+    'linear-gradient(to bottom, transparent 0%, hsl(var(--background) / 0.08) 20%, hsl(var(--background) / 0.32) 45%, hsl(var(--background) / 0.72) 72%, hsl(var(--background)) 100%)'
+}
 </script>
diff --git a/frontend/apps/widget/src/components/HomeHelp.vue b/frontend/apps/widget/src/components/HomeHelp.vue
index cdb48520..3ee8b7f7 100644
--- a/frontend/apps/widget/src/components/HomeHelp.vue
+++ b/frontend/apps/widget/src/components/HomeHelp.vue
@@ -2,21 +2,41 @@
 import { useHelpStore } from '@widget/store/help.js'
 import { useWidgetStore } from '@widget/store/widget.js'
 import { Button } from '@shared-ui/components/ui/button'
-import { Search, FileText } from 'lucide-vue-next'
+import { Search } from 'lucide-vue-next'
 const help = useHelpStore()
 const widget = useWidgetStore()
 const open = (article) => {
   help.article = null
   help.query = ''
   help.results = null
+  help.collectionPath = []
+  help.navigationHistory = []
+  help.scrollTop = 0
   help.pendingArticle = article || null
+  help.focusSearch = !article
   widget.navigateToHelp()
 }
 </script>
 
 <template>
-  <section class="border rounded-lg p-3 space-y-2 bg-card">
-    <Button type="button" variant="outline" class="w-full justify-start" @click="open()"><Search class="size-4" />{{ $t('widget.searchArticles') }}</Button>
-    <Button v-for="article in help.featured" :key="article.id" type="button" variant="ghost" class="w-full h-auto justify-start text-left whitespace-normal" @click="open(article)"><FileText class="size-4 shrink-0" />{{ article.title }}</Button>
+  <section class="space-y-1 rounded-xl border border-border/80 bg-card p-2 shadow-sm">
+    <Button
+      type="button"
+      variant="outline"
+      class="h-10 w-full justify-start rounded-lg"
+      @click="open()"
+    >
+      <Search class="size-4" aria-hidden="true" />
+      {{ $t('widget.searchArticles') }}
+    </Button>
+    <Button
+      v-for="article in help.featured"
+      :key="article.id"
+      type="button"
+      variant="ghost"
+      class="w-full h-auto justify-start px-2 py-1.5 text-left whitespace-normal"
+      @click="open(article)"
+      >{{ article.title }}</Button
+    >
   </section>
 </template>
diff --git a/frontend/apps/widget/src/components/MessageInput.vue b/frontend/apps/widget/src/components/MessageInput.vue
index d0539422..d6db0bae 100644
--- a/frontend/apps/widget/src/components/MessageInput.vue
+++ b/frontend/apps/widget/src/components/MessageInput.vue
@@ -1,5 +1,12 @@
 <template>
   <div class="border-t focus:ring-0 focus:outline-none">
+    <ReplyButtons
+      v-if="quickReplies.length"
+      :replies="quickReplies"
+      :disabled="isSending"
+      class="px-2 pt-2"
+      @select="sendQuickReply"
+    />
     <!-- Message Input -->
     <div class="p-2">
       <!-- Unified Input Container -->
@@ -14,7 +21,8 @@
             :placeholder="$t('globals.terms.typeMessage')"
             :disabled="isSending"
             maxlength="10000"
-            class="w-full max-h-32 resize-none border-0 bg-transparent focus:ring-0 focus:outline-none focus-visible:ring-0 p-0 shadow-none" style="min-height:20px;height:20px"
+            class="w-full max-h-32 resize-none border-0 bg-transparent focus:ring-0 focus:outline-none focus-visible:ring-0 p-0 shadow-none"
+            style="min-height: 20px; height: 20px"
             ref="messageInput"
           ></Textarea>
         </div>
@@ -34,13 +42,14 @@
 
           <!-- Send Button -->
           <Button
+            type="button"
             @click="sendMessage"
             :aria-label="$t('globals.messages.send')"
             size="sm"
             class="h-9 w-9 p-0 rounded-full disabled:opacity-50 disabled:cursor-not-allowed border-0"
             :disabled="!newMessage.trim() || isUploading || isSending"
           >
-            <ArrowUp class="w-4 h-4" />
+            <ArrowUp class="w-4 h-4" aria-hidden="true" />
           </Button>
         </div>
       </div>
@@ -52,6 +61,7 @@
 import { ref, computed, nextTick, watch, onMounted } from 'vue'
 import { ArrowUp } from 'lucide-vue-next'
 import { Button } from '@shared-ui/components/ui/button'
+import ReplyButtons from './ReplyButtons.vue'
 import { Textarea } from '@shared-ui/components/ui/textarea'
 import { useWidgetStore } from '@widget/store/widget.js'
 import { useChatStore } from '@widget/store/chat.js'
@@ -69,22 +79,38 @@ const widgetStore = useWidgetStore()
 const chatStore = useChatStore()
 const userStore = useUserStore()
 const messageInput = ref(null)
-const draftKey = computed(() => chatStore.currentConversation?.uuid || proactive.pending?.id || 'new')
-const newMessage = computed({ get: () => chatStore.drafts[draftKey.value] || '', set: value => { chatStore.drafts[draftKey.value] = value } })
+const draftKey = computed(
+  () => chatStore.currentConversation?.uuid || proactive.pending?.id || 'new'
+)
+const newMessage = computed({
+  get: () => chatStore.drafts[draftKey.value] || '',
+  set: (value) => {
+    chatStore.drafts[draftKey.value] = value
+  }
+})
 const isUploading = ref(false)
 const isSending = ref(false)
 const config = computed(() => widgetStore.config)
+const quickReplies = computed(() => {
+  if (chatStore.currentConversation?.uuid) return []
+  const audience = userStore.isVisitor ? config.value.visitors : config.value.users
+  return audience?.quick_replies ?? config.value.quick_replies ?? []
+})
 
-const getTextareaEl = () => messageInput.value?.$el?.querySelector?.('textarea') || messageInput.value?.$el
+const getTextareaEl = () =>
+  messageInput.value?.$el?.querySelector?.('textarea') || messageInput.value?.$el
 
 const focusTextarea = () => {
   nextTick(() => getTextareaEl()?.focus())
 }
 
 onMounted(focusTextarea)
-watch(() => widgetStore.isOpen, (open) => {
-  if (open) focusTextarea()
-})
+watch(
+  () => widgetStore.isOpen,
+  (open) => {
+    if (open) focusTextarea()
+  }
+)
 
 // Setup typing indicator
 const { startTyping, stopTyping } = useTypingIndicator((isTyping) => {
@@ -95,7 +121,14 @@ const { startTyping, stopTyping } = useTypingIndicator((isTyping) => {
 
 const initChatConversation = async (messageText) => {
   const resp = await api.initChatConversation({ message: messageText, ...proactive.replyPayload() })
-  const { conversation, session_token, user, messages, business_hours_id, working_hours_utc_offset } = resp.data.data
+  const {
+    conversation,
+    session_token,
+    user,
+    messages,
+    business_hours_id,
+    working_hours_utc_offset
+  } = resp.data.data
   conversation.business_hours_id = business_hours_id
   conversation.working_hours_utc_offset = working_hours_utc_offset
 
@@ -177,6 +210,13 @@ const sendMessage = async () => {
   }
 }
 
+const sendQuickReply = (reply) => {
+  newMessage.value = reply
+  sendMessage()
+}
+
+defineExpose({ sendQuickReply })
+
 // Handle typing events
 const handleTyping = () => {
   startTyping()
@@ -220,7 +260,10 @@ const handleFileUpload = async (files) => {
       chatStore.replaceMessage(chatStore.currentConversation.uuid, tempMessageID, resp.data.data)
     }
     if (resp.data.data) {
-      chatStore.updateConversationListLastMessage(chatStore.currentConversation.uuid, resp.data.data)
+      chatStore.updateConversationListLastMessage(
+        chatStore.currentConversation.uuid,
+        resp.data.data
+      )
     }
   } catch (error) {
     // Remove failed upload message
diff --git a/frontend/apps/widget/src/components/PreChatForm.vue b/frontend/apps/widget/src/components/PreChatForm.vue
index ccd47c9e..8b7824d4 100644
--- a/frontend/apps/widget/src/components/PreChatForm.vue
+++ b/frontend/apps/widget/src/components/PreChatForm.vue
@@ -1,11 +1,25 @@
 <template>
-  <div class="bg-background flex-1 flex flex-col">
-    <div v-if="showForm" class="flex-1 flex flex-col max-h-full">
+  <div :class="props.handoffMode ? 'flex flex-col' : 'bg-background flex-1 flex flex-col'">
+    <div
+      v-if="showForm"
+      :class="props.handoffMode ? 'flex flex-col' : 'flex-1 flex flex-col max-h-full'"
+    >
       <div
-        class="flex-1 overflow-y-auto scrollbar-thin scrollbar-track-transparent scrollbar-thumb-muted-foreground/30 hover:scrollbar-thumb-muted-foreground/50 p-4 space-y-4"
+        :class="[
+          'space-y-4',
+          props.handoffMode
+            ? 'py-1'
+            : 'flex-1 overflow-y-auto scrollbar-thin scrollbar-track-transparent scrollbar-thumb-muted-foreground/30 hover:scrollbar-thumb-muted-foreground/50 p-4'
+        ]"
       >
-        <!-- Form title -->
-        <div v-if="formTitle" class="text-xl text-foreground mb-2 text-center">
+        <div
+          v-if="formTitle"
+          :class="
+            props.handoffMode
+              ? 'text-sm font-medium text-foreground'
+              : 'text-xl text-foreground mb-2 text-center'
+          "
+        >
           {{ formTitle }}
         </div>
 
@@ -13,7 +27,11 @@
           <!-- Dynamic fields -->
           <div v-for="field in sortedFields" :key="field.key" class="space-y-2">
             <!-- Text input -->
-            <FormField v-if="field.type === 'text'" v-slot="{ componentField }" :name="field.key">
+            <FormField
+              v-if="field.type === 'text'"
+              v-slot="{ componentField, handleChange, meta }"
+              :name="field.key"
+            >
               <FormItem>
                 <FormLabel class="text-sm font-medium">
                   {{ field.label }}
@@ -21,9 +39,11 @@
                 </FormLabel>
                 <FormControl>
                   <Input
-                    v-bind="componentField"
+                    :name="field.key"
+                    :model-value="componentField.modelValue"
                     type="text"
                     :placeholder="field.placeholder || ''"
+                    @update:model-value="(value) => handleChange(value, meta.validated)"
                   />
                 </FormControl>
                 <FormMessage />
@@ -33,7 +53,7 @@
             <!-- Email input -->
             <FormField
               v-else-if="field.type === 'email'"
-              v-slot="{ componentField }"
+              v-slot="{ componentField, handleChange, meta }"
               :name="field.key"
             >
               <FormItem>
@@ -43,9 +63,11 @@
                 </FormLabel>
                 <FormControl>
                   <Input
-                    v-bind="componentField"
+                    :name="field.key"
+                    :model-value="componentField.modelValue"
                     type="email"
                     :placeholder="field.placeholder || ''"
+                    @update:model-value="(value) => handleChange(value, meta.validated)"
                   />
                 </FormControl>
                 <FormMessage />
@@ -55,7 +77,7 @@
             <!-- Number input -->
             <FormField
               v-else-if="field.type === 'number'"
-              v-slot="{ componentField }"
+              v-slot="{ componentField, handleChange, meta }"
               :name="field.key"
             >
               <FormItem>
@@ -65,9 +87,13 @@
                 </FormLabel>
                 <FormControl>
                   <Input
-                    v-bind="componentField"
+                    :name="field.key"
+                    :model-value="componentField.modelValue"
                     type="number"
                     :placeholder="field.placeholder || ''"
+                    @update:model-value="
+                      (value) => handleChange(value === '' ? '' : Number(value), meta.validated)
+                    "
                   />
                 </FormControl>
                 <FormMessage />
@@ -77,7 +103,7 @@
             <!-- Date input -->
             <FormField
               v-else-if="field.type === 'date'"
-              v-slot="{ componentField }"
+              v-slot="{ componentField, handleChange, meta }"
               :name="field.key"
             >
               <FormItem>
@@ -87,9 +113,11 @@
                 </FormLabel>
                 <FormControl>
                   <Input
-                    v-bind="componentField"
+                    :name="field.key"
+                    :model-value="componentField.modelValue"
                     type="date"
                     :placeholder="field.placeholder || ''"
+                    @update:model-value="(value) => handleChange(value, meta.validated)"
                   />
                 </FormControl>
                 <FormMessage />
@@ -99,7 +127,7 @@
             <!-- Link/URL input -->
             <FormField
               v-else-if="field.type === 'link'"
-              v-slot="{ componentField }"
+              v-slot="{ componentField, handleChange, meta }"
               :name="field.key"
             >
               <FormItem>
@@ -109,9 +137,11 @@
                 </FormLabel>
                 <FormControl>
                   <Input
-                    v-bind="componentField"
+                    :name="field.key"
+                    :model-value="componentField.modelValue"
                     type="url"
                     :placeholder="field.placeholder || 'https://'"
+                    @update:model-value="(value) => handleChange(value, meta.validated)"
                   />
                 </FormControl>
                 <FormMessage />
@@ -121,12 +151,15 @@
             <!-- Checkbox input -->
             <FormField
               v-else-if="field.type === 'checkbox'"
-              v-slot="{ componentField, handleChange }"
+              v-slot="{ componentField, handleChange, meta }"
               :name="field.key"
             >
               <FormItem class="flex flex-row items-start space-x-3 space-y-0">
                 <FormControl>
-                  <Checkbox :checked="componentField.modelValue" @update:checked="handleChange" />
+                  <Checkbox
+                    :checked="componentField.modelValue"
+                    @update:checked="(value) => handleChange(value, meta.validated)"
+                  />
                 </FormControl>
                 <div class="space-y-1 leading-none">
                   <FormLabel class="text-sm font-medium">
@@ -145,12 +178,13 @@
               :label="field.label"
               :placeholder="field.placeholder || ''"
               :required="field.required"
+              defer-validation
             />
 
             <!-- List/Select input -->
             <FormField
               v-else-if="field.type === 'list'"
-              v-slot="{ componentField }"
+              v-slot="{ componentField, handleChange, meta }"
               :name="field.key"
             >
               <FormItem>
@@ -159,7 +193,10 @@
                   <span v-if="field.required" class="text-destructive">*</span>
                 </FormLabel>
                 <FormControl>
-                  <Select v-bind="componentField">
+                  <Select
+                    :model-value="componentField.modelValue"
+                    @update:model-value="(value) => handleChange(value, meta.validated)"
+                  >
                     <SelectTrigger>
                       <SelectValue :placeholder="field.placeholder || $t('globals.terms.select')" />
                     </SelectTrigger>
@@ -179,8 +216,7 @@
             </FormField>
           </div>
 
-          <!-- Message textarea (always last) -->
-          <div class="space-y-2">
+          <div v-if="!props.handoffMode" class="space-y-2">
             <label class="text-sm font-medium">
               {{ $t('globals.terms.message') }}
               <span class="text-destructive">*</span>
@@ -194,14 +230,26 @@
         </form>
       </div>
 
-      <!-- Submit button - fixed at bottom -->
-      <div class="p-4 border-t">
-        <Button @click="submitForm" class="w-full" :disabled="!requiredFieldsFilled || !meta.valid || !messageText.trim() || props.isSubmitting">
+      <div :class="props.handoffMode ? 'pt-3' : 'p-4 border-t'">
+        <Button
+          type="button"
+          @click="submitForm"
+          class="w-full"
+          :disabled="
+            !requiredFieldsFilled ||
+            (!props.handoffMode && !messageText.trim()) ||
+            props.isSubmitting
+          "
+        >
           <div
             v-if="props.isSubmitting"
             class="w-4 h-4 border-2 border-background border-t-current rounded-full animate-spin mr-2"
           ></div>
-          {{ $t('widget.prechatForm.startChat') }}
+          {{
+            props.handoffMode
+              ? $t('widget.prechatForm.continueToHuman')
+              : $t('widget.prechatForm.startChat')
+          }}
         </Button>
       </div>
     </div>
@@ -234,6 +282,8 @@ import PhoneNumberInput from '@shared-ui/components/PhoneNumberInput.vue'
 import { countryCodeKey, defaultCountryCode } from '@shared-ui/utils/phone.js'
 import { useWidgetStore } from '@widget/store/widget.js'
 import { useChatStore } from '@widget/store/chat.js'
+import { useUserStore } from '@widget/store/user.js'
+import { resolvePreChatForm } from '@widget/utils/preChatForm.js'
 import { useI18n } from 'vue-i18n'
 import { createPreChatFormSchema } from './preChatFormSchema.js'
 
@@ -245,6 +295,10 @@ const props = defineProps({
   isSubmitting: {
     type: Boolean,
     default: false
+  },
+  handoffMode: {
+    type: Boolean,
+    default: false
   }
 })
 
@@ -252,10 +306,18 @@ const emit = defineEmits(['submit'])
 const { t } = useI18n()
 const widgetStore = useWidgetStore()
 const chat = useChatStore()
-const messageText = computed({ get: () => chat.preChatDraft.message || '', set: value => { chat.preChatDraft.message = value } })
+const userStore = useUserStore()
+const messageText = computed({
+  get: () => chat.preChatDraft.message || '',
+  set: (value) => {
+    chat.preChatDraft.message = value
+  }
+})
 const formRef = ref(null)
 
-const config = computed(() => widgetStore.config?.prechat_form || {})
+const config = computed(() =>
+  resolvePreChatForm(widgetStore.config?.prechat_form, userStore.isVisitor)
+)
 const preChatFormEnabled = computed(() => config.value.enabled || false)
 const formTitle = computed(() => config.value.title || '')
 const formFields = computed(() => config.value.fields || [])
@@ -294,12 +356,18 @@ const initialValues = computed(() => {
   return { ...values, ...savedFields }
 })
 
-const { handleSubmit, meta, values } = useForm({
+const { handleSubmit, values } = useForm({
   validationSchema: formSchema,
   initialValues
 })
 
-watch(values, fields => { chat.preChatDraft.fields = { ...fields } }, { deep: true })
+watch(
+  values,
+  (fields) => {
+    chat.preChatDraft.fields = { ...fields }
+  },
+  { deep: true }
+)
 
 const requiredFieldsFilled = computed(() => {
   return sortedFields.value
@@ -327,7 +395,10 @@ const submitForm = handleSubmit((values) => {
     }
   })
 
-  emit('submit', { formData: filteredValues, message: messageText.value.trim() })
+  emit('submit', {
+    formData: filteredValues,
+    message: props.handoffMode ? '' : messageText.value.trim()
+  })
 })
 
 // Get options for list fields
@@ -352,9 +423,12 @@ const focusFirstField = () => {
 }
 
 onMounted(focusFirstField)
-watch(() => widgetStore.isOpen, (open) => {
-  if (open) focusFirstField()
-})
+watch(
+  () => widgetStore.isOpen,
+  (open) => {
+    if (open) focusFirstField()
+  }
+)
 
 // Auto-submit when no fields to show (e.g., all fields excluded)
 watch(
diff --git a/frontend/apps/widget/src/components/ProactiveMessage.vue b/frontend/apps/widget/src/components/ProactiveMessage.vue
new file mode 100644
index 00000000..db6fd252
--- /dev/null
+++ b/frontend/apps/widget/src/components/ProactiveMessage.vue
@@ -0,0 +1,12 @@
+<template>
+  <div class="flex flex-col items-start">
+    <div class="max-w-[85%] px-4 py-3 rounded-2xl text-sm leading-5 break-words bg-muted text-foreground whitespace-pre-wrap">{{ pending.snapshot.message }}</div>
+    <div class="text-[10px] text-muted-foreground mt-1">{{ pending.snapshot.sender }}</div>
+  </div>
+</template>
+
+<script setup>
+defineProps({
+  pending: { type: Object, required: true }
+})
+</script>
diff --git a/frontend/apps/widget/src/components/RecentConversationCard.vue b/frontend/apps/widget/src/components/RecentConversationCard.vue
index 17c1fda0..c9ee916a 100644
--- a/frontend/apps/widget/src/components/RecentConversationCard.vue
+++ b/frontend/apps/widget/src/components/RecentConversationCard.vue
@@ -2,13 +2,15 @@
   <div class="space-y-3">
     <Card
       @click="continueConversation"
-      class="hover:bg-accent transition-colors cursor-pointer rounded-md"
+      class="cursor-pointer rounded-xl border-border/70 bg-card/95 shadow-lg transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-xl"
     >
       <CardContent class="p-4">
         <div class="flex items-start justify-between">
           <div class="flex-1 min-w-0">
             <div class="flex items-center gap-2 mb-2">
-              <div class="text-sm font-medium">{{ $t('globals.messages.continueConversation') }}</div>
+              <div class="text-sm font-medium">
+                {{ $t('globals.messages.continueConversation') }}
+              </div>
             </div>
             <div class="flex gap-2 items-start">
               <div class="text-sm text-foreground line-clamp-2 flex-1 min-w-0">
diff --git a/frontend/apps/widget/src/components/ReplyButtons.vue b/frontend/apps/widget/src/components/ReplyButtons.vue
new file mode 100644
index 00000000..f63349d9
--- /dev/null
+++ b/frontend/apps/widget/src/components/ReplyButtons.vue
@@ -0,0 +1,27 @@
+<template>
+  <div class="flex flex-wrap gap-2">
+    <Button
+      v-for="(reply, index) in replies"
+      :key="`${index}-${reply}`"
+      type="button"
+      variant="outline"
+      size="sm"
+      class="h-auto max-w-full rounded-full py-1.5 text-left whitespace-normal"
+      :disabled="disabled"
+      @click="emit('select', reply)"
+    >
+      {{ reply }}
+    </Button>
+  </div>
+</template>
+
+<script setup>
+import { Button } from '@shared-ui/components/ui/button'
+
+defineProps({
+  replies: { type: Array, required: true },
+  disabled: { type: Boolean, default: false }
+})
+
+const emit = defineEmits(['select'])
+</script>
diff --git a/frontend/apps/widget/src/composables/useReplyPreviews.js b/frontend/apps/widget/src/composables/useReplyPreviews.js
index 5397430c..e36ba2f0 100644
--- a/frontend/apps/widget/src/composables/useReplyPreviews.js
+++ b/frontend/apps/widget/src/composables/useReplyPreviews.js
@@ -12,28 +12,75 @@ export function useReplyPreviews() {
   const chat = useChatStore()
   const user = useUserStore()
   const { t } = useI18n()
-  watch(() => [chat.getConversations, user.userID, widget.config.previews, widget.config.dark_mode, widget.isOpen], async () => {
-    await nextTick()
-    const element = document.querySelector('.libredesk-widget-app')
-    if (!element) return
-    const style = getComputedStyle(element)
-    const previews = chat.getConversations.filter(conversation => conversation.unread_message_count > 0 && ['agent', 'ai_assistant'].includes(conversation.last_message?.author?.type)).map(conversation => {
-      const message = conversation.last_message
-      const author = message.author || {}
-      return {
-        conversation: conversation.uuid,
-        key: `${conversation.uuid}:${message.created_at}`,
-        name: [author.first_name, author.last_name].filter(Boolean).join(' ') || widget.config.brand_name,
-        avatar: author.avatar_url || '',
-        text: widget.config.previews?.content === 'generic' ? t('widget.newReply') : getTextFromHTML(message.content || '').slice(0, 240) || t('globals.terms.attachment'),
-        image: widget.config.previews?.content === 'generic' ? '' : message.attachments?.find(attachment => attachment.content_type?.startsWith('image/'))?.thumbnail_url || '',
-      }
-    })
-    const target = parentOrigin()
-    if (!target) return
-    window.parent.postMessage({ type: 'REPLY_PREVIEWS', identity: String(user.userID || 'visitor'), previews, config: { ...widget.config.previews },
-      labels: { dismiss: t('globals.terms.dismiss'), dismissAll: t('widget.dismissPreviews'), open: t('widget.openConversation') },
-      theme: { background: style.backgroundColor, foreground: style.color, border: `hsl(${style.getPropertyValue('--border')})` },
-    }, target)
-  }, { deep: true, immediate: true })
+  watch(
+    () => [
+      chat.getConversations,
+      user.userID,
+      widget.config.previews,
+      widget.config.dark_mode,
+      widget.isOpen
+    ],
+    async () => {
+      await nextTick()
+      const element = document.querySelector('.libredesk-widget-app')
+      if (!element) return
+      const style = getComputedStyle(element)
+      const previews = chat.getConversations
+        .filter((conversation) => conversation.unread_message_count > 0)
+        .flatMap((conversation) =>
+          (conversation.unread_messages?.length
+            ? conversation.unread_messages
+            : [conversation.last_message]
+          ).map((message) => ({ conversation, message }))
+        )
+        .filter(({ message }) => ['agent', 'ai_assistant'].includes(message?.author?.type))
+        .sort((a, b) => new Date(b.message.created_at) - new Date(a.message.created_at))
+        .slice(0, 3)
+        .map(({ conversation, message }) => {
+          const author = message.author || {}
+          return {
+            conversation: conversation.uuid,
+            key: message.uuid || `${conversation.uuid}:${message.created_at}`,
+            name:
+              [author.first_name, author.last_name].filter(Boolean).join(' ') ||
+              widget.config.brand_name,
+            avatar: author.avatar_url || '',
+            text:
+              widget.config.previews?.content === 'generic'
+                ? t('widget.newReply')
+                : getTextFromHTML(message.text_content || message.content || '').slice(0, 240) ||
+                  t('globals.terms.attachment'),
+            image:
+              widget.config.previews?.content === 'generic'
+                ? ''
+                : message.attachments?.find((attachment) =>
+                    attachment.content_type?.startsWith('image/')
+                  )?.thumbnail_url || ''
+          }
+        })
+      const target = parentOrigin()
+      if (!target) return
+      window.parent.postMessage(
+        {
+          type: 'REPLY_PREVIEWS',
+          identity: String(user.userID || 'visitor'),
+          previews,
+          config: { ...widget.config.previews },
+          labels: {
+            dismiss: t('globals.terms.dismiss'),
+            dismissAll: t('widget.dismissPreviews'),
+            open: t('widget.openConversation')
+          },
+          theme: {
+            background: style.backgroundColor,
+            foreground: style.color,
+            muted: `hsl(${style.getPropertyValue('--muted-foreground')})`,
+            border: `hsl(${style.getPropertyValue('--border')})`
+          }
+        },
+        target
+      )
+    },
+    { deep: true, immediate: true }
+  )
 }
diff --git a/frontend/apps/widget/src/layouts/MainLayout.vue b/frontend/apps/widget/src/layouts/MainLayout.vue
index ef482a71..c1efacb5 100644
--- a/frontend/apps/widget/src/layouts/MainLayout.vue
+++ b/frontend/apps/widget/src/layouts/MainLayout.vue
@@ -3,8 +3,12 @@
     <div class="absolute top-2 right-2 z-20">
       <CloseWidgetButton />
     </div>
-    <Tabs :modelValue="widgetStore.currentView" @update:modelValue="handleTabChange" class="flex flex-col h-full">
-      <div class="flex-1 min-h-0">
+    <Tabs
+      :modelValue="widgetStore.currentView"
+      @update:modelValue="handleTabChange"
+      class="flex flex-col h-full"
+    >
+      <main class="flex-1 min-h-0">
         <TabsContent value="home" class="h-full mt-0">
           <HomeView />
         </TabsContent>
@@ -13,18 +17,21 @@
           <ChatView v-else />
         </TabsContent>
         <TabsContent value="help" class="h-full mt-0"><HelpView /></TabsContent>
-      </div>
-      <TabsList v-if="!widgetStore.isChatView" class="flex h-auto bg-background border-t rounded-none p-0">
+      </main>
+      <TabsList
+        v-if="!widgetStore.isChatView"
+        class="flex h-auto bg-background border-t rounded-none p-0"
+      >
         <TabsTrigger value="home" class="nav-tab">
-          <House class="w-5 h-5" />
+          <House class="w-5 h-5" aria-hidden="true" />
           <span class="text-xs font-medium">{{ $t('globals.terms.home') }}</span>
         </TabsTrigger>
         <TabsTrigger value="messages" class="nav-tab">
-          <MessagesSquare class="w-5 h-5" />
+          <MessagesSquare class="w-5 h-5" aria-hidden="true" />
           <span class="text-xs font-medium">{{ $t('globals.terms.message', 2) }}</span>
         </TabsTrigger>
         <TabsTrigger v-if="help.available && help.data.audience.tab" value="help" class="nav-tab">
-          <CircleQuestionMark class="w-5 h-5" />
+          <CircleQuestionMark class="w-5 h-5" aria-hidden="true" />
           <span class="text-xs font-medium">{{ $t('globals.terms.help') }}</span>
         </TabsTrigger>
       </TabsList>
@@ -41,8 +48,6 @@
           Powered by <span class="font-medium">libredesk</span>
         </a>
       </div>
-
-      <!-- Network Connection Banner -->
       <ConnectionBanner />
     </Tabs>
   </div>
diff --git a/frontend/apps/widget/src/store/chat.js b/frontend/apps/widget/src/store/chat.js
index bc7f204f..a11dea20 100644
--- a/frontend/apps/widget/src/store/chat.js
+++ b/frontend/apps/widget/src/store/chat.js
@@ -7,295 +7,291 @@ import MessageCache from '@main/utils/conversation-message-cache.js'
 import { useUserStore } from './user.js'
 
 export const useChatStore = defineStore('chat', () => {
-    const userStore = useUserStore()
-    const previewUnreadUUID = ref(null)
-    const drafts = ref({})
-    const preChatDraft = ref({})
-    // State
-    let typingTimeout = null
-    const isTyping = ref(false)
-    const currentConversation = ref({})
-    const conversations = ref(null)
-    // Conversation messages cache, evict old conversation messages after 50 conversations.
-    const messageCache = reactive(new MessageCache(50))
-    const isLoadingConversations = ref(false)
-    const isLoadingConversation = ref(false)
-    // Reactivity trigger for message cache changes this is easier than making the whole messageCache reactive.
-    const messageCacheVersion = ref(0)
+  const userStore = useUserStore()
+  const previewUnreadUUID = ref(null)
+  const drafts = ref({})
+  const preChatDraft = ref({})
+  let typingTimeout = null
+  const isTyping = ref(false)
+  const currentConversation = ref({})
+  const conversations = ref(null)
+  const messageCache = reactive(new MessageCache(50))
+  const isLoadingConversations = ref(false)
+  const isLoadingConversation = ref(false)
+  const messageCacheVersion = ref(0)
 
-    // Getters
-    const getCurrentConversationMessages = computed(() => {
-        messageCacheVersion.value // Force reactivity tracking
-        const convId = currentConversation.value?.uuid
-        if (!convId) return []
-        return messageCache.getAllPagesMessages(convId)
-    })
-    const hasConversations = computed(() => conversations.value?.length > 0)
-    const getConversations = computed(() => {
-        // Sort by `last_message.created_at` descending.
-        if (conversations.value) {
-            return conversations.value.sort((a, b) => new Date(b.last_message.created_at) - new Date(a.last_message.created_at))
-        }
-        return []
-    })
+  const getCurrentConversationMessages = computed(() => {
+    messageCacheVersion.value // Force reactivity tracking
+    const convId = currentConversation.value?.uuid
+    if (!convId) return []
+    return messageCache.getAllPagesMessages(convId)
+  })
+  const getCurrentConversationLastMessage = computed(
+    () => getCurrentConversationMessages.value.at(-1) || null
+  )
+  const hasConversations = computed(() => conversations.value?.length > 0)
+  const getConversations = computed(() => {
+    if (conversations.value) {
+      return conversations.value.sort(
+        (a, b) => new Date(b.last_message.created_at) - new Date(a.last_message.created_at)
+      )
+    }
+    return []
+  })
 
-    const updateConversationListLastMessage = (conversationUUID, message, incrementUnread = false) => {
-        if (!conversations.value || !Array.isArray(conversations.value)) return
+  const updateConversationListLastMessage = (
+    conversationUUID,
+    message,
+    incrementUnread = false
+  ) => {
+    if (!conversations.value || !Array.isArray(conversations.value)) return
 
-        // Find conversation in the list
-        const conv = conversations.value.find(c => c.uuid === conversationUUID)
-        if (!conv) return
+    const conv = conversations.value.find((c) => c.uuid === conversationUUID)
+    if (!conv) return
 
-        // Update last_message in the conversation
-        conv.last_message = {
-            attachments: message.attachments || [],
-            content: message.text_content !== '' ? message.text_content : message.content,
-            created_at: message.created_at,
-            status: message.status,
-            author: {
-                id: message.author.id,
-                first_name: message.author.first_name || '',
-                last_name: message.author.last_name || '',
-                avatar_url: message.author.avatar_url || '',
-                availability_status: message.author.availability_status || '',
-                type: message.author.type || '',
-                active_at: message.author.active_at || null
-            }
-        }
-
-        // Increment unread count if needed
-        if (incrementUnread) {
-            conv.unread_message_count = (conv.unread_message_count || 0) + 1
-        }
+    conv.last_message = {
+      attachments: message.attachments || [],
+      content: message.text_content !== '' ? message.text_content : message.content,
+      created_at: message.created_at,
+      status: message.status,
+      author: {
+        id: message.author.id,
+        first_name: message.author.first_name || '',
+        last_name: message.author.last_name || '',
+        avatar_url: message.author.avatar_url || '',
+        availability_status: message.author.availability_status || '',
+        type: message.author.type || '',
+        active_at: message.author.active_at || null
+      }
     }
 
-    const addMessageToConversation = (conversationUUID, message) => {
-        messageCache.addMessage(conversationUUID, message)
-        messageCacheVersion.value++ // Trigger reactivity
-        const shouldIncrementUnread = ['agent', 'ai_assistant'].includes(message.author?.type)
-        updateConversationListLastMessage(conversationUUID, message, shouldIncrementUnread)
+    if (incrementUnread) {
+      conv.unread_message_count = (conv.unread_message_count || 0) + 1
+      conv.unread_messages = [...(conv.unread_messages || []), message]
+        .sort((a, b) => new Date(b.created_at) - new Date(a.created_at))
+        .slice(0, 3)
+    }
+  }
+
+  const addMessageToConversation = (conversationUUID, message) => {
+    messageCache.addMessage(conversationUUID, message)
+    messageCacheVersion.value++ // Trigger reactivity
+    const shouldIncrementUnread = ['agent', 'ai_assistant'].includes(message.author?.type)
+    updateConversationListLastMessage(conversationUUID, message, shouldIncrementUnread)
+  }
+
+  const addPendingMessage = (conversationUUID, messageText, authorType, authorId, files = []) => {
+    const pendingMessage = {
+      content: messageText,
+      content_type: 'text',
+      author: {
+        type: authorType,
+        id: authorId,
+        first_name: userStore.firstName || '',
+        last_name: userStore.lastName || '',
+        avatar_url: '',
+        availability_status: '',
+        active_at: null
+      },
+      attachments: [],
+      uuid: `pending-${Date.now()}`,
+      status: files.length > 0 ? 'uploading' : 'sending',
+      created_at: new Date().toISOString()
+    }
+    messageCache.addMessage(conversationUUID, pendingMessage)
+    messageCacheVersion.value++ // Trigger reactivity
+
+    updateConversationListLastMessage(conversationUUID, pendingMessage)
+
+    return pendingMessage.uuid
+  }
+
+  const replaceMessage = (conversationUUID, msgID, actualMessage) => {
+    messageCache.updateMessage(conversationUUID, msgID, actualMessage)
+    messageCacheVersion.value++ // Trigger reactivity
+    updateConversationListLastMessage(conversationUUID, actualMessage)
+  }
+
+  const removeMessage = (conversationUUID, msgID) => {
+    messageCache.removeMessage(conversationUUID, msgID)
+    messageCacheVersion.value++ // Trigger reactivity
+  }
+
+  const loadConversation = async (conversationUUID, force = false, silent = false) => {
+    if (!conversationUUID) return false
+
+    if (currentConversation.value?.uuid === conversationUUID && !force) {
+      return true
     }
 
-    const addPendingMessage = (conversationUUID, messageText, authorType, authorId, files = []) => {
-        // Pending message is a temporary message that will be replaced with actual message later after sending.
-        const pendingMessage = {
-            content: messageText,
-            content_type: 'text',
-            author: {
-                type: authorType,
-                id: authorId,
-                first_name: userStore.firstName || '',
-                last_name: userStore.lastName || '',
-                avatar_url: '',
-                availability_status: '',
-                active_at: null
-            },
-            attachments: [],
-            uuid: `pending-${Date.now()}`,
-            status: files.length > 0 ? 'uploading' : 'sending',
-            created_at: new Date().toISOString()
-        }
-        messageCache.addMessage(conversationUUID, pendingMessage)
-        messageCacheVersion.value++ // Trigger reactivity
+    try {
+      if (!silent) isLoadingConversation.value = true
+      const token = userStore.userSessionToken
+      const resp = await api.getChatConversation(conversationUUID)
+      if (token !== userStore.userSessionToken) return false
+      const conversation = resp.data.data.conversation
+      conversation.business_hours_id = resp.data.data.business_hours_id
+      conversation.working_hours_utc_offset = resp.data.data.working_hours_utc_offset
+      setCurrentConversation(conversation)
+      replaceMessages(resp.data.data.messages)
+      if (resp.data.data.messages.length > 0) {
+        updateConversationListLastMessage(conversationUUID, resp.data.data.messages[0], false)
+      }
+    } catch (error) {
+      console.error('Error fetching conversation:', error)
+      return false
+    } finally {
+      isLoadingConversation.value = false
+    }
+    return true
+  }
 
-        // Update conversations list with pending message
-        updateConversationListLastMessage(conversationUUID, pendingMessage)
+  const replaceMessages = (newMessages) => {
+    const convId = currentConversation.value?.uuid
+    if (!convId) return
+    if (Array.isArray(newMessages) && newMessages.length > 0) {
+      messageCache.purgeConversation(convId)
+      messageCache.addMessages(convId, newMessages, 1, 1)
+    }
+    messageCacheVersion.value++ // Trigger reactivity
+  }
 
-        return pendingMessage.uuid
+  const clearMessages = () => {
+    const convId = currentConversation.value?.uuid
+    if (!convId) return
+    messageCache.addMessages(convId, [], 1, 1)
+    messageCacheVersion.value++ // Trigger reactivity
+  }
+
+  const setTypingStatus = (conversationUUID, status) => {
+    if (!conversationUUID) return
+    if (currentConversation.value?.uuid !== conversationUUID) return
+
+    if (typingTimeout) {
+      clearTimeout(typingTimeout)
+      typingTimeout = null
     }
 
-    const replaceMessage = (conversationUUID, msgID, actualMessage) => {
-        messageCache.updateMessage(conversationUUID, msgID, actualMessage)
-        messageCacheVersion.value++ // Trigger reactivity
-        updateConversationListLastMessage(conversationUUID, actualMessage)
-    }
+    isTyping.value = status
 
-    const removeMessage = (conversationUUID, msgID) => {
-        messageCache.removeMessage(conversationUUID, msgID)
-        messageCacheVersion.value++ // Trigger reactivity
-    }
-
-    const loadConversation = async (conversationUUID, force = false, silent = false) => {
-        if (!conversationUUID) return false
-
-        // If the conversation is already loaded, do not fetch again unless forced.
-        if (currentConversation.value?.uuid === conversationUUID && !force) {
-            return true
-        }
-
-        try {
-            if (!silent) isLoadingConversation.value = true
-            const token = userStore.userSessionToken
-            const resp = await api.getChatConversation(conversationUUID)
-            if (token !== userStore.userSessionToken) return false
-            const conversation = resp.data.data.conversation
-            conversation.business_hours_id = resp.data.data.business_hours_id
-            conversation.working_hours_utc_offset = resp.data.data.working_hours_utc_offset
-            setCurrentConversation(conversation)
-            replaceMessages(resp.data.data.messages)
-            if (resp.data.data.messages.length > 0) {
-                updateConversationListLastMessage(conversationUUID, resp.data.data.messages[0], false)
-            }
-        } catch (error) {
-            console.error('Error fetching conversation:', error)
-            return false
-        } finally {
-            isLoadingConversation.value = false
-        }
-        return true
-    }
-
-    const replaceMessages = (newMessages) => {
-        const convId = currentConversation.value?.uuid
-        if (!convId) return
-        if (Array.isArray(newMessages) && newMessages.length > 0) {
-            // Purge and then add messages.
-            messageCache.purgeConversation(convId)
-            messageCache.addMessages(convId, newMessages, 1, 1)
-        }
-        messageCacheVersion.value++ // Trigger reactivity
-    }
-
-    const clearMessages = () => {
-        const convId = currentConversation.value?.uuid
-        if (!convId) return
-        // Clear messages for current conversation by setting empty values.
-        messageCache.addMessages(convId, [], 1, 1)
-        messageCacheVersion.value++ // Trigger reactivity
-    }
-
-    const setTypingStatus = (conversationUUID, status) => {
-        if (!conversationUUID) return
-        if (currentConversation.value?.uuid !== conversationUUID) return
-
-        if (typingTimeout) {
-            clearTimeout(typingTimeout)
-            typingTimeout = null
-        }
-
-        isTyping.value = status
-
-        if (status) {
-            typingTimeout = setTimeout(() => {
-                isTyping.value = false
-                typingTimeout = null
-            }, TYPING_RECEIVE_TIMEOUT)
-        }
-    }
-
-    const setCurrentConversation = (conversation) => {
-        if (conversation === null) {
-            conversation = {}
-        }
-        // Clear messages if conversation is null or empty.
-        if (!conversation) {
-            clearMessages()
-        }
+    if (status) {
+      typingTimeout = setTimeout(() => {
         isTyping.value = false
-        if (typingTimeout) {
-            clearTimeout(typingTimeout)
-            typingTimeout = null
-        }
-        currentConversation.value = conversation
+        typingTimeout = null
+      }, TYPING_RECEIVE_TIMEOUT)
+    }
+  }
+
+  const setCurrentConversation = (conversation) => {
+    if (conversation === null) {
+      conversation = {}
+    }
+    if (!conversation) {
+      clearMessages()
+    }
+    isTyping.value = false
+    if (typingTimeout) {
+      clearTimeout(typingTimeout)
+      typingTimeout = null
+    }
+    currentConversation.value = conversation
+  }
+
+  const fetchConversations = async (force = false, silent = false) => {
+    if (!userStore.userSessionToken) {
+      return true
     }
 
-    const fetchConversations = async (force = false, silent = false) => {
-        // No session token means visitor, no conversations to fetch.
-        if (!userStore.userSessionToken) {
-            return true
-        }
-
-        // If conversations are already loaded and is an array, do not fetch again unless forced.
-        if (!force && Array.isArray(conversations.value)) {
-            return true
-        }
-
-        try {
-            if (!silent) isLoadingConversations.value = true
-            const token = userStore.userSessionToken
-            const response = await api.getChatConversations()
-            if (token !== userStore.userSessionToken) return false
-            conversations.value = response.data.data || []
-            return true
-        } catch {
-            return false
-        } finally {
-            isLoadingConversations.value = false
-        }
+    if (!force && Array.isArray(conversations.value)) {
+      return true
     }
 
-    const updateCurrentConversationLastSeen = async () => {
-        const conversationUUID = currentConversation.value?.uuid
-        if (!conversationUUID) return
-        try {
-            await api.updateConversationLastSeen(conversationUUID)
-            // Reset unread count for current conversation
-            if (conversations.value && Array.isArray(conversations.value)) {
-                const conv = conversations.value.find(c => c.uuid === conversationUUID)
-                if (conv) {
-                    conv.unread_message_count = 0
-                }
-            }
-        } catch (error) {
-            console.error('Error updating last seen:', error)
+    try {
+      if (!silent) isLoadingConversations.value = true
+      const token = userStore.userSessionToken
+      const response = await api.getChatConversations()
+      if (token !== userStore.userSessionToken) return false
+      conversations.value = response.data.data || []
+      return true
+    } catch {
+      return false
+    } finally {
+      isLoadingConversations.value = false
+    }
+  }
+
+  const updateCurrentConversationLastSeen = async () => {
+    const conversationUUID = currentConversation.value?.uuid
+    if (!conversationUUID) return
+    try {
+      await api.updateConversationLastSeen(conversationUUID)
+      if (conversations.value && Array.isArray(conversations.value)) {
+        const conv = conversations.value.find((c) => c.uuid === conversationUUID)
+        if (conv) {
+          conv.unread_message_count = 0
+          conv.unread_messages = []
         }
+      }
+    } catch (error) {
+      console.error('Error updating last seen:', error)
+    }
+  }
+
+  const updateCurrentConversation = (data) => {
+    if (currentConversation.value?.uuid === data.uuid) {
+      deepMerge(currentConversation.value, data)
     }
 
-    const updateCurrentConversation = (data) => {
-        if (currentConversation.value?.uuid === data.uuid) {
-            deepMerge(currentConversation.value, data)
-        }
-
-        if (conversations.value && Array.isArray(conversations.value)) {
-            const index = conversations.value.findIndex(c => c.uuid === data.uuid)
-            if (index >= 0) {
-                deepMerge(conversations.value[index], data)
-            }
-        }
+    if (conversations.value && Array.isArray(conversations.value)) {
+      const index = conversations.value.findIndex((c) => c.uuid === data.uuid)
+      if (index >= 0) {
+        deepMerge(conversations.value[index], data)
+      }
     }
+  }
 
-    const addConversationToList = (conversation) => {
-        conversation.unread_message_count = 0
-        if (!conversations.value) {
-            conversations.value = []
-        }
-        const existingIndex = conversations.value.findIndex(c => c.uuid === conversation.uuid)
-        if (existingIndex >= 0) {
-            conversations.value[existingIndex] = conversation
-            return
-        }
-        conversations.value.push(conversation)
+  const addConversationToList = (conversation) => {
+    conversation.unread_message_count = 0
+    if (!conversations.value) {
+      conversations.value = []
     }
-
-    return {
-        drafts, preChatDraft, previewUnreadUUID,
-        // State
-        messageCache,
-        isTyping,
-        conversations,
-        currentConversation,
-        isLoadingConversations,
-        isLoadingConversation,
-
-        // Getters
-        getCurrentConversationMessages,
-        hasConversations,
-        getConversations,
-
-        // Actions
-        addMessageToConversation,
-        addPendingMessage,
-        replaceMessage,
-        removeMessage,
-        replaceMessages,
-        clearMessages,
-        setTypingStatus,
-        setCurrentConversation,
-        fetchConversations,
-        loadConversation,
-        updateCurrentConversationLastSeen,
-        updateConversationListLastMessage,
-        updateCurrentConversation,
-        addConversationToList
+    const existingIndex = conversations.value.findIndex((c) => c.uuid === conversation.uuid)
+    if (existingIndex >= 0) {
+      conversations.value[existingIndex] = conversation
+      return
     }
+    conversations.value.push(conversation)
+  }
+
+  return {
+    drafts,
+    preChatDraft,
+    previewUnreadUUID,
+    messageCache,
+    isTyping,
+    conversations,
+    currentConversation,
+    isLoadingConversations,
+    isLoadingConversation,
+
+    getCurrentConversationMessages,
+    getCurrentConversationLastMessage,
+    hasConversations,
+    getConversations,
+
+    addMessageToConversation,
+    addPendingMessage,
+    replaceMessage,
+    removeMessage,
+    replaceMessages,
+    clearMessages,
+    setTypingStatus,
+    setCurrentConversation,
+    fetchConversations,
+    loadConversation,
+    updateCurrentConversationLastSeen,
+    updateConversationListLastMessage,
+    updateCurrentConversation,
+    addConversationToList
+  }
 })
diff --git a/frontend/apps/widget/src/store/help.js b/frontend/apps/widget/src/store/help.js
index d86797bd..3f02ae83 100644
--- a/frontend/apps/widget/src/store/help.js
+++ b/frontend/apps/widget/src/store/help.js
@@ -2,6 +2,11 @@ import { defineStore } from 'pinia'
 import { ref, computed } from 'vue'
 import api from '@widget/api/index.js'
 
+const EXPAND_KEY = 'libredesk-help-expand'
+const readExpandArticles = () => {
+  try { return localStorage.getItem(EXPAND_KEY) !== 'false' } catch { return true }
+}
+
 export const useHelpStore = defineStore('help', () => {
   const data = ref(null)
   const loading = ref(false)
@@ -15,6 +20,8 @@ export const useHelpStore = defineStore('help', () => {
   const feedbackPending = ref({})
   const scrollTop = ref(0)
   const pendingArticle = ref(null)
+  const focusSearch = ref(false)
+  const expandArticles = ref(readExpandArticles())
   const identity = ref(0)
   let generation = 0
   const articles = computed(() => {
@@ -36,6 +43,7 @@ export const useHelpStore = defineStore('help', () => {
     loading.value = false
     scrollTop.value = 0
     pendingArticle.value = null
+    focusSearch.value = false
     data.value = null
     failed.value = false
     query.value = ''
@@ -75,7 +83,14 @@ export const useHelpStore = defineStore('help', () => {
       if (request === generation) loading.value = false
     }
   }
+  const setExpandArticles = (value) => {
+    expandArticles.value = value
+    try { localStorage.setItem(EXPAND_KEY, String(value)) } catch { /* storage blocked */ }
+  }
   return {
+    focusSearch,
+    expandArticles,
+    setExpandArticles,
     feedback,
     feedbackPending,
     vote,
diff --git a/frontend/apps/widget/src/utils/preChatForm.js b/frontend/apps/widget/src/utils/preChatForm.js
new file mode 100644
index 00000000..9b00abd4
--- /dev/null
+++ b/frontend/apps/widget/src/utils/preChatForm.js
@@ -0,0 +1,11 @@
+export const resolvePreChatForm = (config = {}, isVisitor = true) => {
+  const audience = isVisitor ? config.visitors : config.users
+  if (!audience || typeof audience !== 'object') return config
+
+  return {
+    ...config,
+    enabled: Boolean(config.enabled && (audience.enabled ?? true)),
+    title: audience.title ?? config.title,
+    fields: audience.fields ?? config.fields
+  }
+}
diff --git a/frontend/apps/widget/src/utils/preChatForm.test.js b/frontend/apps/widget/src/utils/preChatForm.test.js
new file mode 100644
index 00000000..82e65554
--- /dev/null
+++ b/frontend/apps/widget/src/utils/preChatForm.test.js
@@ -0,0 +1,62 @@
+import { describe, expect, test } from 'vitest'
+import { resolvePreChatForm } from './preChatForm.js'
+
+const legacy = {
+  enabled: true,
+  title: 'Before we start',
+  fields: [{ key: 'email' }]
+}
+
+describe('resolvePreChatForm', () => {
+  test('keeps legacy settings when audience settings are absent', () => {
+    expect(resolvePreChatForm(legacy, true)).toEqual(legacy)
+    expect(resolvePreChatForm(legacy, false)).toEqual(legacy)
+  })
+
+  test('selects the visitor form', () => {
+    const config = {
+      ...legacy,
+      visitors: { enabled: true, title: 'Choose a plan', fields: [{ key: 'plan' }] },
+      users: { enabled: true, title: 'What is the issue?', fields: [{ key: 'issue' }] }
+    }
+
+    expect(resolvePreChatForm(config, true)).toMatchObject({
+      enabled: true,
+      title: 'Choose a plan',
+      fields: [{ key: 'plan' }]
+    })
+  })
+
+  test('selects the logged-in user form', () => {
+    const config = {
+      ...legacy,
+      visitors: { enabled: true, title: 'Choose a plan', fields: [{ key: 'plan' }] },
+      users: { enabled: true, title: 'What is the issue?', fields: [{ key: 'issue' }] }
+    }
+
+    expect(resolvePreChatForm(config, false)).toMatchObject({
+      enabled: true,
+      title: 'What is the issue?',
+      fields: [{ key: 'issue' }]
+    })
+  })
+
+  test('keeps explicit disabled and empty audience values', () => {
+    const config = {
+      ...legacy,
+      users: { enabled: false, title: '', fields: [] }
+    }
+
+    expect(resolvePreChatForm(config, false)).toMatchObject({ enabled: false, title: '', fields: [] })
+  })
+
+  test('global setting cannot be overridden by an audience', () => {
+    const config = {
+      ...legacy,
+      enabled: false,
+      visitors: { enabled: true, title: 'Choose a plan', fields: [{ key: 'plan' }] }
+    }
+
+    expect(resolvePreChatForm(config, true).enabled).toBe(false)
+  })
+})
diff --git a/frontend/apps/widget/src/views/ChatView.vue b/frontend/apps/widget/src/views/ChatView.vue
index a8aecf95..d7f57a2c 100644
--- a/frontend/apps/widget/src/views/ChatView.vue
+++ b/frontend/apps/widget/src/views/ChatView.vue
@@ -3,10 +3,11 @@
     <!-- Chat header -->
     <ChatHeader @goBack="goBack" @error="handleError" />
 
-    <section v-if="proactive.pending && !chatStore.currentConversation.uuid" class="mx-4 mt-3 border rounded-lg p-3 bg-muted text-sm">
-      <p class="font-medium">{{ proactive.pending.snapshot.sender }}</p>
-      <p class="whitespace-pre-wrap">{{ proactive.pending.snapshot.message }}</p>
-    </section>
+    <ProactiveMessage
+      v-if="showPreChatForm && proactive.pending"
+      :pending="proactive.pending"
+      class="px-4 pt-4"
+    />
 
     <!-- Pre-chat form -->
     <PreChatForm
@@ -18,13 +19,24 @@
     />
 
     <!-- Messages container (when no pre-chat form) -->
-    <ChatMessages v-else ref="chatMessages" :showPreChatForm="showPreChatForm" />
+    <ChatMessages
+      v-else
+      ref="chatMessages"
+      :showPreChatForm="showPreChatForm"
+      :handoff-form-submitting="isSubmittingHandoffForm"
+      @suggested-reply="sendSuggestedReply"
+      @handoff-form-submit="submitHandoffForm"
+    />
 
     <!-- Error display -->
     <WidgetError :errorMessage="errorMessage" />
 
     <!-- Message input (only when pre-chat form is not shown) -->
-    <MessageInput v-if="!showPreChatForm && !isConversationClosed" @error="handleError" />
+    <MessageInput
+      v-if="!showPreChatForm && !isConversationClosed && !hasPendingHandoffForm"
+      ref="messageInput"
+      @error="handleError"
+    />
 
     <!-- Closed conversation notice -->
     <div v-if="isConversationClosed" class="border-t p-4 text-center text-sm text-muted-foreground">
@@ -45,6 +57,8 @@ import ChatHeader from '@widget/components/ChatHeader.vue'
 import ChatMessages from '@widget/components/ChatMessages.vue'
 import MessageInput from '@widget/components/MessageInput.vue'
 import PreChatForm from '@widget/components/PreChatForm.vue'
+import ProactiveMessage from '@widget/components/ProactiveMessage.vue'
+import { resolvePreChatForm } from '@widget/utils/preChatForm.js'
 
 import { useProactiveStore } from '@widget/store/proactive.js'
 const proactive = useProactiveStore()
@@ -52,16 +66,25 @@ const widgetStore = useWidgetStore()
 const userStore = useUserStore()
 const chatStore = useChatStore()
 const errorMessage = ref('')
+const messageInput = ref(null)
 const preChatFormSubmitted = ref(false)
 const isInitializing = ref(false)
+const isSubmittingHandoffForm = ref(false)
 const config = computed(() => widgetStore.config)
 
 // Determine if pre-chat form should be shown
 const showPreChatForm = computed(() => {
-  const preChatForm = config.value?.prechat_form
+  const preChatForm = resolvePreChatForm(
+    config.value?.prechat_form,
+    userStore.isVisitor
+  )
 
   // Must be enabled and not submitted
-  if (!preChatForm?.enabled || preChatFormSubmitted.value) {
+  if (!preChatForm.enabled || preChatFormSubmitted.value) {
+    return false
+  }
+
+  if (preChatForm.handoff_only) {
     return false
   }
 
@@ -84,6 +107,9 @@ const isConversationClosed = computed(() => {
   const settingsKey = userStore.isVisitor ? 'visitors' : 'users'
   return config.value?.[settingsKey]?.prevent_reply_to_closed_conversation ?? false
 })
+const hasPendingHandoffForm = computed(() => {
+  return !!chatStore.getCurrentConversationLastMessage?.meta?.handoff_form_pending
+})
 
 const goBack = () => {
   if (!chatStore.currentConversation?.uuid) proactive.abandon()
@@ -99,6 +125,26 @@ const handleError = (message) => {
   }
 }
 
+const sendSuggestedReply = (reply) => {
+  messageInput.value?.sendQuickReply(reply)
+}
+
+const submitHandoffForm = async ({ formData, message }) => {
+  isSubmittingHandoffForm.value = true
+  errorMessage.value = ''
+  try {
+    await api.submitHandoffForm(chatStore.currentConversation.uuid, formData)
+    chatStore.replaceMessage(chatStore.currentConversation.uuid, message.uuid, {
+      ...message,
+      meta: { ...message.meta, handoff_form_pending: false }
+    })
+  } catch (error) {
+    errorMessage.value = handleHTTPError(error).message
+  } finally {
+    isSubmittingHandoffForm.value = false
+  }
+}
+
 // Handle pre-chat form submission - init chat with form data and message
 const handlePreChatFormSubmit = async ({ formData, message }) => {
   // Auto-submit with no message (e.g., all fields excluded) - just skip to chat
@@ -121,7 +167,14 @@ const handlePreChatFormSubmit = async ({ formData, message }) => {
     }
 
     const resp = await api.initChatConversation(payload)
-    const { conversation, session_token, user, messages, business_hours_id, working_hours_utc_offset } = resp.data.data
+    const {
+      conversation,
+      session_token,
+      user,
+      messages,
+      business_hours_id,
+      working_hours_utc_offset
+    } = resp.data.data
     conversation.business_hours_id = business_hours_id
     conversation.working_hours_utc_offset = working_hours_utc_offset
 
diff --git a/frontend/apps/widget/src/views/HelpView.vue b/frontend/apps/widget/src/views/HelpView.vue
index 08e186da..34a647a2 100644
--- a/frontend/apps/widget/src/views/HelpView.vue
+++ b/frontend/apps/widget/src/views/HelpView.vue
@@ -1,9 +1,16 @@
 <script setup>
 import { computed, ref, nextTick, onMounted, onUnmounted } from 'vue'
 import { useI18n } from 'vue-i18n'
-import { ArrowLeft, Search } from 'lucide-vue-next'
+import { ArrowLeft, Search, Maximize2, Minimize2, ExternalLink } from 'lucide-vue-next'
 import { Button } from '@shared-ui/components/ui/button'
 import { Input } from '@shared-ui/components/ui/input'
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from '@shared-ui/components/ui/select'
 import { useHelpStore } from '@widget/store/help.js'
 import { useWidgetStore } from '@widget/store/widget.js'
 import HelpCollectionList from '@shared-ui/components/HelpCollectionList.vue'
@@ -24,11 +31,30 @@ const feedback = computed(() => help.feedback[help.article?.id] ?? null)
 const feedbackPending = computed(() => !!help.feedbackPending[help.article?.id])
 const scroller = ref(null)
 const backButton = ref(null)
+const searchInput = ref(null)
 const articleHistory = ref([])
 const originArticleID = ref(null)
 const currentCollection = computed(() => help.collectionPath.at(-1))
 const collections = computed(() => currentCollection.value?.children || help.data?.tree || [])
 const items = computed(() => help.results ?? currentCollection.value?.articles ?? [])
+const articleURL = computed(() =>
+  help.article
+    ? `${help.data.url}/${encodeURIComponent(help.article.locale)}/articles/${encodeURIComponent(help.article.slug)}`
+    : ''
+)
+const canExpand = computed(() => !!help.article && !widget.isMobileFullScreen)
+const availableTranslations = computed(() => help.article?.translations || [])
+const languageName = (code) => {
+  try {
+    return new Intl.DisplayNames([locale.value], { type: 'language' }).of(code) || code
+  } catch {
+    return code
+  }
+}
+const toggleExpand = () => {
+  widget.toggleExpand()
+  help.setExpandArticles(widget.isExpanded)
+}
 const retry = () => {
   error.value = ''
   help.load(locale.value)
@@ -67,6 +93,7 @@ const openArticle = async ({ id, slug, locale: articleLocale }) => {
     else {
       help.scrollTop = scroller.value?.scrollTop || 0
       originArticleID.value = id
+      if (help.expandArticles && !widget.isMobileFullScreen) widget.expandWidget()
     }
     help.article = response.data.data
     await nextTick()
@@ -77,6 +104,23 @@ const openArticle = async ({ id, slug, locale: articleLocale }) => {
     busy.value = false
   }
 }
+const switchArticleLanguage = async (articleLocale) => {
+  if (busy.value || articleLocale === help.article?.locale) return
+  const translation = availableTranslations.value.find(({ locale }) => locale === articleLocale)
+  if (!translation) return
+  busy.value = true
+  error.value = ''
+  const identity = help.identity
+  try {
+    const response = await api.getHelpArticle(translation.slug, articleLocale)
+    if (!valid(identity) || response.data.data.locale !== articleLocale) return
+    help.article = response.data.data
+  } catch {
+    if (valid(identity)) error.value = t('widget.helpLoadError')
+  } finally {
+    busy.value = false
+  }
+}
 const openCollection = async (collection) => {
   help.navigationHistory.push({ top: help.scrollTop, id: collection.id })
   help.collectionPath.push(collection)
@@ -89,7 +133,10 @@ const back = async () => {
   let selector
   if (help.article) {
     help.article = articleHistory.value.pop() || null
-    if (!help.article) selector = `[data-help-article="${originArticleID.value}"]`
+    if (!help.article) {
+      selector = `[data-help-article="${originArticleID.value}"]`
+      if (widget.isExpanded) widget.collapseWidget()
+    }
   } else if (help.results !== null) {
     help.results = null
   } else {
@@ -121,23 +168,43 @@ onMounted(async () => {
     help.pendingArticle = null
     await openArticle(article)
   }
+  if (help.focusSearch && mounted) {
+    help.focusSearch = false
+    await nextTick()
+    requestAnimationFrame(() => searchInput.value?.$el?.focus())
+  }
 })
 </script>
 
 <template>
   <div class="flex flex-col h-full">
-    <header class="flex items-center gap-2 border-b p-3 pr-12">
+    <header class="relative flex items-center justify-center p-4 border-b min-h-[3.75rem]">
       <Button
         v-if="help.article || currentCollection || help.results !== null"
         ref="backButton"
         type="button"
         variant="ghost"
         size="icon"
+        class="absolute left-2"
         :aria-label="t('globals.messages.goBack')"
         @click="back"
-        ><ArrowLeft class="size-4"
+        ><ArrowLeft class="size-4" aria-hidden="true"
       /></Button>
-      <h2 class="font-medium truncate">{{ help.article?.title || t('globals.terms.help') }}</h2>
+      <h3 v-if="!help.article" class="text-base font-semibold text-foreground">
+        {{ t('globals.terms.help') }}
+      </h3>
+      <Button
+        v-if="canExpand"
+        type="button"
+        variant="ghost"
+        size="icon"
+        class="absolute right-2"
+        :aria-label="widget.isExpanded ? t('globals.terms.collapse') : t('globals.terms.expand')"
+        @click="toggleExpand"
+      >
+        <Minimize2 v-if="widget.isExpanded" class="size-4" aria-hidden="true" />
+        <Maximize2 v-else class="size-4" aria-hidden="true" />
+      </Button>
     </header>
     <div v-if="help.loading || busy" role="status" class="px-4 py-2 text-sm text-muted-foreground">
       {{ t('globals.terms.loading') }}
@@ -149,40 +216,71 @@ onMounted(async () => {
       }}</Button>
     </div>
     <template v-if="help.article">
-      <p v-if="help.article.locale !== locale" class="px-4 pt-2 text-xs text-muted-foreground">
-        {{ t('widget.articleLanguage', { language: help.article.locale }) }}
-      </p>
-      <ArticleReader
-        :article="help.article"
-        :help-slug="help.data.slug"
-        :dark="widget.config.dark_mode"
-        @article="openArticle"
-      />
-      <div class="flex items-center justify-center gap-2 p-3 border-t text-sm">
-        <span>{{ feedback !== null ? t('helpCenter.feedbackThanks') : t('widget.helpful') }}</span>
-        <template v-if="feedback === null">
-          <Button
-            type="button"
-            variant="outline"
-            size="sm"
-            :disabled="busy || feedbackPending"
-            @click="vote(true)"
-            >{{ t('globals.messages.yes') }}</Button
-          >
-          <Button
-            type="button"
-            variant="outline"
-            size="sm"
-            :disabled="busy || feedbackPending"
-            @click="vote(false)"
-            >{{ t('globals.messages.no') }}</Button
-          >
-        </template>
+      <div class="flex-1 min-h-0 overflow-auto">
+        <ArticleReader
+          :article="help.article"
+          :help-slug="help.data.slug"
+          :dark="widget.config.dark_mode"
+          @article="openArticle"
+        />
+        <div class="flex items-center justify-center gap-2 p-3 border-t text-sm">
+          <span>{{
+            feedback !== null ? t('helpCenter.feedbackThanks') : t('widget.helpful')
+          }}</span>
+          <template v-if="feedback === null">
+            <Button
+              type="button"
+              variant="outline"
+              size="sm"
+              :disabled="busy || feedbackPending"
+              @click="vote(true)"
+              >{{ t('globals.messages.yes') }}</Button
+            >
+            <Button
+              type="button"
+              variant="outline"
+              size="sm"
+              :disabled="busy || feedbackPending"
+              @click="vote(false)"
+              >{{ t('globals.messages.no') }}</Button
+            >
+          </template>
+        </div>
+        <div
+          v-if="availableTranslations.length > 1"
+          class="flex items-center justify-center gap-2 px-4 py-3 border-t text-sm"
+        >
+          <span>{{ t('globals.terms.language') }}</span>
+          <Select :model-value="help.article.locale" @update:model-value="switchArticleLanguage">
+            <SelectTrigger class="h-8 w-44" :aria-label="t('globals.terms.language')">
+              <SelectValue />
+            </SelectTrigger>
+            <SelectContent>
+              <SelectItem
+                v-for="translation in availableTranslations"
+                :key="translation.locale"
+                :value="translation.locale"
+              >
+                {{ languageName(translation.locale) }}
+              </SelectItem>
+            </SelectContent>
+          </Select>
+        </div>
+        <a
+          :href="articleURL"
+          target="_blank"
+          rel="noopener noreferrer"
+          class="flex items-center justify-center gap-1.5 pb-4 text-xs text-muted-foreground hover:text-foreground no-underline"
+        >
+          {{ t('widget.openInHelpCenter') }}
+          <ExternalLink class="size-3.5" aria-hidden="true" />
+        </a>
       </div>
     </template>
     <template v-else>
       <form class="flex gap-2 p-3 border-b" @submit.prevent="search">
         <Input
+          ref="searchInput"
           v-model="help.query"
           :aria-label="t('widget.searchArticles')"
           :placeholder="t('widget.searchArticles')"
diff --git a/frontend/apps/widget/src/views/HomeView.vue b/frontend/apps/widget/src/views/HomeView.vue
index f2727d77..d9c46429 100644
--- a/frontend/apps/widget/src/views/HomeView.vue
+++ b/frontend/apps/widget/src/views/HomeView.vue
@@ -5,28 +5,28 @@
     >
       <div class="flex flex-col">
         <HomeHeader :config="config">
-          <!-- Primary action renders on the gradient so it flows into the header. -->
           <RecentConversationCard
             v-if="mostRecentConversation"
             :conversation="mostRecentConversation"
           />
           <div v-else-if="canStartConversation">
-            <Button @click="startConversation" class="w-full flex items-center justify-center">
+            <Button
+              size="lg"
+              class="w-full rounded-xl font-semibold shadow-md"
+              @click="startConversation"
+            >
               {{ startButtonText }}
-              <ArrowRight size="16" />
+              <ArrowRight size="16" aria-hidden="true" />
             </Button>
           </div>
         </HomeHeader>
 
-        <!-- Home Apps (announcements + external links) sit on the normal background. -->
-        <div v-if="homeItems.length" class="flex flex-col gap-3 p-4 bg-background">
-          <div class="space-y-3">
-            <template v-for="(item, index) in homeItems" :key="index">
-              <HomeHelp v-if="item.type === 'help'" />
-              <AnnouncementCard v-else-if="item.type === 'announcement'" :announcement="item" />
-              <HomeExternalLink v-else-if="item.type === 'external_link'" :link="item" />
-            </template>
-          </div>
+        <div v-if="homeItems.length" class="space-y-3 bg-background px-4 pt-1 pb-5">
+          <template v-for="(item, index) in homeItems" :key="index">
+            <HomeHelp v-if="item.type === 'help'" />
+            <AnnouncementCard v-else-if="item.type === 'announcement'" :announcement="item" />
+            <HomeExternalLink v-else-if="item.type === 'external_link'" :link="item" />
+          </template>
         </div>
       </div>
     </div>
diff --git a/frontend/shared-ui/components/PhoneNumberInput.vue b/frontend/shared-ui/components/PhoneNumberInput.vue
index a3e5220c..ddee2be5 100644
--- a/frontend/shared-ui/components/PhoneNumberInput.vue
+++ b/frontend/shared-ui/components/PhoneNumberInput.vue
@@ -1,5 +1,5 @@
 <template>
-  <FormField v-slot="{ componentField }" :name="countryCodeName">
+  <FormField v-slot="{ componentField, handleChange, meta }" :name="countryCodeName">
     <FormItem>
       <FormLabel class="flex items-center">
         {{ label || t('globals.terms.phoneNumber') }}
@@ -9,7 +9,7 @@
         <div class="shrink-0">
           <FormControl>
             <ComboBox
-              v-bind="componentField"
+              v-bind="fieldBinding(componentField, handleChange, meta)"
               :items="allCountries"
               :placeholder="t('globals.terms.select')"
               :buttonClass="'w-auto rounded-r-none border-r-0'"
@@ -38,12 +38,19 @@
         </div>
 
         <div class="flex-1 min-w-0">
-          <FormField v-slot="{ componentField: phoneField }" :name="phoneNumberName">
+          <FormField
+            v-slot="{
+              componentField: phoneField,
+              handleChange: handlePhoneChange,
+              meta: phoneMeta
+            }"
+            :name="phoneNumberName"
+          >
             <FormItem>
               <FormControl>
                 <Input
                   type="tel"
-                  v-bind="phoneField"
+                  v-bind="fieldBinding(phoneField, handlePhoneChange, phoneMeta)"
                   :placeholder="placeholder"
                   class="rounded-l-none"
                   inputmode="tel"
@@ -63,16 +70,26 @@
 import { FormField, FormItem, FormLabel, FormControl, FormMessage } from './ui/form'
 import { Input } from './ui/input'
 import ComboBox from './ui/combobox/ComboBox.vue'
-import { countryCallingOptions as allCountries } from '../constants/countries.js'
+import { countryCallingOptions as allCountries } from '@shared-ui/constants/countries.js'
 import { useI18n } from 'vue-i18n'
 
-defineProps({
+const props = defineProps({
   countryCodeName: { type: String, default: 'phone_number_country_code' },
   phoneNumberName: { type: String, default: 'phone_number' },
   label: { type: String, default: '' },
   placeholder: { type: String, default: '' },
-  required: { type: Boolean, default: false }
+  required: { type: Boolean, default: false },
+  deferValidation: { type: Boolean, default: false }
 })
 
 const { t } = useI18n()
+
+const fieldBinding = (componentField, handleChange, meta) => {
+  if (!props.deferValidation) return componentField
+  return {
+    name: componentField.name,
+    modelValue: componentField.modelValue,
+    'onUpdate:modelValue': (value) => handleChange(value, meta.validated)
+  }
+}
 </script>
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 59a15610..6713c0ab 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -388,6 +388,8 @@
   "admin.inbox.livechat.prechatForm.enabled": "Enable pre-chat form",
   "admin.inbox.livechat.prechatForm.enabled.description": "Show a form to collect information before chat starts",
   "admin.inbox.livechat.prechatForm.fields": "Form fields",
+  "admin.inbox.livechat.prechatForm.handoffOnly": "Show only during AI handoff",
+  "admin.inbox.livechat.prechatForm.handoffOnly.description": "Skip this form when a chat starts. Show it when the AI needs to transfer the conversation to a human.",
   "admin.inbox.livechat.prechatForm.noFields": "No fields configured. Add fields from custom attributes.",
   "admin.inbox.livechat.prechatForm.title": "Form title",
   "admin.inbox.livechat.preventMultipleConversations": "Prevent multiple conversations",
@@ -398,6 +400,10 @@
   "admin.inbox.livechat.preview": "Preview",
   "admin.inbox.livechat.preview.sampleAgentReply": "Happy to help, could you share a few details?",
   "admin.inbox.livechat.preview.sampleUserMessage": "Hi! How do I get started?",
+  "admin.inbox.livechat.quickReplies": "Quick replies",
+  "admin.inbox.livechat.quickReplies.description": "One reply per line, up to 6. Shown when someone starts a new conversation. Tapping one sends it as the first message.",
+  "admin.inbox.livechat.quickReplies.limit": "Add up to 6 quick replies.",
+  "admin.inbox.livechat.quickReplies.placeholder": "I have a question about billing\nHow do I reset my password?",
   "admin.inbox.livechat.secretKey": "Secret key",
   "admin.inbox.livechat.secretKey.description": "Set a secret key to secure the chat widget.",
   "admin.inbox.livechat.secretKey.weak": "This secret is short, which weakens JWT signing. Use at least 32 random characters.",
@@ -593,6 +599,9 @@
   "ai.agent.handoffError": "The AI assistant could not respond and handed this conversation off to a human.",
   "ai.agent.handoffNoAnswer": "The AI assistant did not have an answer and handed this conversation off to a human.",
   "ai.agent.handoffOtherParticipant": "Someone other than the contact replied on this conversation, so the AI assistant handed it off to a human.",
+  "ai.agent.handoffFormPrompt": "Please share these details before I connect you with a human.",
+  "ai.agent.handoffFormUnavailable": "This handoff is no longer pending. Send a new message if you still need a human.",
+  "ai.agent.needMoreHelp": "No, I need more help",
   "ai.agent.verificationEmailSubject": "Your verification code",
   "ai.agent.verificationEmailBody": "Your verification code is {code}. It expires in 10 minutes. If you did not request this, you can ignore this email.",
   "ai.testDimensionsMismatch": "The provider returned {returned}-dimension vectors but Dimensions is set to {configured}. Set Dimensions to {returned}, or search will not work.",
@@ -846,6 +855,7 @@
   "globals.messages.reject": "Reject",
   "globals.messages.caseSensitiveMatch": "Case sensitive match",
   "globals.messages.clearFilters": "Clear filters",
+  "globals.messages.clearSearch": "Clear search",
   "globals.messages.close": "Close",
   "globals.messages.closeChat": "Close chat",
   "globals.messages.connected": "Connected",
@@ -994,7 +1004,6 @@
   "globals.terms.channel": "Channel",
   "globals.terms.clientID": "Client ID",
   "globals.terms.clientSecret": "Client secret",
-  "globals.terms.clearSearch": "Clear search",
   "globals.terms.closed": "Closed",
   "globals.terms.closedAt": "Closed at",
   "globals.terms.collapse": "Collapse",
@@ -1216,6 +1225,10 @@
   "helpCenter.article": "article | articles",
   "helpCenter.articlePlaceholder": "Write your article...",
   "helpCenter.aiEnabledHint": "Takes effect only when the article is published. Enable it in one language only, not in every translation.",
+  "helpCenter.addTranslation": "Add translation",
+  "helpCenter.translationOf": "Translation of “{title}”",
+  "helpCenter.saveBeforeSwitchingTranslation": "Unsaved changes would be lost. Save the article before switching languages.",
+  "helpCenter.saveBeforeTranslation": "Unsaved changes would be lost. Save the article before adding a translation.",
   "helpCenter.customCSS": "Custom CSS",
   "helpCenter.preview.sampleArticleTitle": "Sample article",
   "helpCenter.preview.sampleCollection": "Sample collection",
@@ -1612,7 +1625,6 @@
   "widget.addArticle": "Add article",
   "widget.addCampaign": "Add proactive message",
   "widget.addHelpHomeApp": "Add help articles",
-  "widget.articleLanguage": "Available in {language}",
   "widget.articleUnavailable": "Article unavailable",
   "widget.autoHideSeconds": "Hide previews after (seconds, 0 keeps them visible)",
   "widget.backToCampaigns": "Back to proactive messages",
@@ -1641,12 +1653,14 @@
   "widget.campaign.section.repeat": "Repeat",
   "widget.campaign.session": "Once per session",
   "widget.campaign.users": "Signed-in users",
-  "widget.campaign.visitors": "Visitors",
   "widget.campaignCooldown": "Minimum hours between proactive messages",
+  "widget.campaignDeviceRequired": "Select at least one device. This proactive message cannot appear until desktop or mobile is enabled.",
   "widget.campaignLimitReached": "You have reached the limit of 50 proactive messages. Delete one to add another.",
+  "widget.campaignPriorityHint": "Messages are checked from top to bottom. The first matching message is shown.",
   "widget.campaignSender": "Sender",
   "widget.campaignsHint": "Invite people to chat. A conversation starts only after they reply.",
   "widget.campaignStats": "Proactive message results",
+  "widget.campaignUrlLimit": "Add up to 20 page patterns.",
   "widget.conversationClosed": "This conversation has been closed",
   "widget.conversationNotPermitted": "You cannot access this conversation. Sign in with the account that started it.",
   "widget.deletedCampaign": "Deleted message",
@@ -1666,9 +1680,12 @@
   "widget.messagePreview": "Message text",
   "widget.newCampaign": "New proactive message",
   "widget.newReply": "You have a new reply",
+  "widget.openInHelpCenter": "Open in help center",
   "widget.noArticles": "No articles found. Try different words or send us a message.",
   "widget.openConversation": "Open conversation",
+  "widget.openChat": "Open chat",
   "widget.prechatForm.startChat": "Start chat",
+  "widget.prechatForm.continueToHuman": "Continue to a human",
   "conversation.sidebarCounts.all": "{count} open conversation in all | {count} open conversations in all",
   "conversation.sidebarCounts.assigned": "{count} open conversation in my inbox | {count} open conversations in my inbox",
   "conversation.sidebarCounts.mentioned": "{count} open conversation with mentions | {count} open conversations with mentions",
diff --git a/internal/aiagent/aiagent.go b/internal/aiagent/aiagent.go
index 5b392ce7..7885ac0d 100644
--- a/internal/aiagent/aiagent.go
+++ b/internal/aiagent/aiagent.go
@@ -16,6 +16,7 @@ import (
 	"github.com/abhinavxd/libredesk/internal/conversation"
 	"github.com/abhinavxd/libredesk/internal/dbutil"
 	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/abhinavxd/libredesk/internal/inbox"
 	"github.com/abhinavxd/libredesk/internal/media"
 	notifier "github.com/abhinavxd/libredesk/internal/notification"
 	"github.com/abhinavxd/libredesk/internal/setting"
@@ -68,6 +69,7 @@ type Manager struct {
 	i18n     *i18n.I18n
 	ai       *ai.Manager
 	convo    *conversation.Manager
+	inbox    *inbox.Manager
 	media    *media.Manager
 	setting  *setting.Manager
 	user     *user.Manager
@@ -108,7 +110,7 @@ type Opts struct {
 }
 
 // New creates the AI agent manager.
-func New(opts Opts, aiManager *ai.Manager, convo *conversation.Manager, mediaManager *media.Manager, settingManager *setting.Manager, userManager *user.Manager, notifierService *notifier.Service, rdb *redis.Client) (*Manager, error) {
+func New(opts Opts, aiManager *ai.Manager, convo *conversation.Manager, inboxManager *inbox.Manager, mediaManager *media.Manager, settingManager *setting.Manager, userManager *user.Manager, notifierService *notifier.Service, rdb *redis.Client) (*Manager, error) {
 	var q queries
 	if err := dbutil.ScanSQLFile("queries.sql", &q, opts.DB, efs); err != nil {
 		return nil, err
@@ -122,6 +124,7 @@ func New(opts Opts, aiManager *ai.Manager, convo *conversation.Manager, mediaMan
 		maxHistoryMessages: opts.MaxHistoryMessages,
 		ai:                 aiManager,
 		convo:              convo,
+		inbox:              inboxManager,
 		media:              mediaManager,
 		setting:            settingManager,
 		user:               userManager,
diff --git a/internal/aiagent/prompt.go b/internal/aiagent/prompt.go
index 36e09bdb..f0fdd9ea 100644
--- a/internal/aiagent/prompt.go
+++ b/internal/aiagent/prompt.go
@@ -24,6 +24,7 @@ Core rules:
 - Keep replies short and conversational, usually one or two sentences. You may use simple markdown (bold, links, bullet or numbered lists) when it genuinely helps, such as listing steps; otherwise write like speech. Never use headings, tables, code blocks, or images.
 - Do not promise to do something after this reply (check, look into it, follow up, email, call, refund, cancel, escalate) unless you actually do it now with a tool.
 - When the request is ambiguous, ask one short clarifying question instead of assuming.
+- When you ask a question that has 2 or 3 obvious short answers, append a final line in this exact form: [[suggestions]] ["First answer","Second answer"]. Keep each answer under 80 characters. Do not add suggestions to open-ended questions. The customer never sees this line; it becomes reply buttons.
 - Do not end the conversation with filler like "Talk soon" or "How can I help you further?".
 
 Handling requests:
@@ -31,7 +32,7 @@ Handling requests:
 - Greeting or small talk: reply briefly and warmly, then offer to help.
 - A question about the company/product: search the knowledge base first, then answer only from what it returns.
 - %s
-- When the customer asked a genuine question or request and your reply fully answers it, end that reply with a line containing only [[confirm]], then a short confirmation question such as "Did that resolve your question?". The customer never sees the [[confirm]] line; it sends the question as its own follow-up message.
+- When the customer asked a genuine question or request and your reply fully answers it, end that reply with a line containing only [[confirm]], then a short confirmation question such as "Did that resolve your question?", followed by suggested answers using the [[suggestions]] format. The customer never sees the [[confirm]] line; it sends the question as its own follow-up message.
 - Never write [[confirm]] after a greeting, small talk, a clarifying question, an offer to help, a refusal, or a partial answer. Skip it too when the customer already signaled they are done ("thanks", "got it", "that's all").
 - Call resolve only after the customer confirms they are done (for example "yes", "thanks, that's all", or clear agreement). If they raise something new instead, keep helping.`
 
diff --git a/internal/aiagent/tools.go b/internal/aiagent/tools.go
index a915b85c..4c725d83 100644
--- a/internal/aiagent/tools.go
+++ b/internal/aiagent/tools.go
@@ -143,6 +143,10 @@ func (t *handoffTool) Execute(ctx context.Context, args string) (string, error)
 	}
 	_ = json.Unmarshal([]byte(args), &in)
 	t.m.lo.Debug("ai agent handoff tool called", "conversation_uuid", t.conv.UUID, "reason", in.Reason)
+	if t.m.requestHandoffForm(t.conv, t.assistant) {
+		t.outcome.handedOff = true
+		return "The customer has been asked for details before the human handoff. Do not take further action.", nil
+	}
 	t.m.handoff(t.conv, t.assistant, in.Reason)
 	t.outcome.handedOff = true
 	return "The conversation has been handed off to a human. Do not take further action.", nil
diff --git a/internal/aiagent/worker.go b/internal/aiagent/worker.go
index 4b4d29a0..421d0117 100644
--- a/internal/aiagent/worker.go
+++ b/internal/aiagent/worker.go
@@ -3,6 +3,7 @@ package aiagent
 import (
 	"context"
 	"database/sql"
+	"encoding/json"
 	"fmt"
 	"slices"
 	"strings"
@@ -16,6 +17,8 @@ import (
 	cmodels "github.com/abhinavxd/libredesk/internal/conversation/models"
 	statusmodels "github.com/abhinavxd/libredesk/internal/conversation/status/models"
 	imageutil "github.com/abhinavxd/libredesk/internal/image"
+	"github.com/abhinavxd/libredesk/internal/inbox"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat"
 
 	"github.com/abhinavxd/libredesk/internal/stringutil"
 	umodels "github.com/abhinavxd/libredesk/internal/user/models"
@@ -30,7 +33,8 @@ const (
 
 	// confirmMarker is the line the model emits before its trailing confirmation question so it
 	// can be split off and sent as a separate message.
-	confirmMarker = "[[confirm]]"
+	confirmMarker     = "[[confirm]]"
+	suggestionsMarker = "[[suggestions]]"
 
 	// typingRefreshInterval must stay under the widget's 5s typing expiry (TYPING_RECEIVE_TIMEOUT).
 	typingRefreshInterval = 3 * time.Second
@@ -357,19 +361,27 @@ func (m *Manager) handle(ctx context.Context, convID int) {
 	}
 	// The model's text answer is the reply to the customer. Handoff and resolve are separate tool actions.
 	answer, confirm := splitConfirmation(strings.TrimSpace(answer))
+	answer, answerSuggestions := splitSuggestions(answer)
+	confirm, confirmSuggestions := splitSuggestions(confirm)
 	// Email gets one message; separate chat-style bubbles only suit the widget.
 	if conv.InboxChannel == channelEmail && confirm != "" {
 		answer, confirm = answer+"\n\n"+confirm, ""
+		answerSuggestions, confirmSuggestions = nil, nil
 	}
 	if answer != "" {
 		m.lo.Debug("ai agent replying", "conversation_uuid", conv.UUID, "reply_len", len(answer), "resolved", outcome.resolved)
-		if err := m.postReply(conv, assistant, answer, nil); err != nil {
+		if err := m.postReply(conv, assistant, answer, suggestedRepliesMeta(answerSuggestions)); err != nil {
 			m.handoff(conv, assistant, m.i18n.T("ai.agent.handoffError"))
 			return
 		}
 	}
 	if confirm != "" {
-		if err := m.postReply(conv, assistant, confirm, map[string]any{"is_confirmation": true}); err != nil {
+		if len(confirmSuggestions) == 0 {
+			confirmSuggestions = []string{m.i18n.T("globals.messages.yes"), m.i18n.T("ai.agent.needMoreHelp")}
+		}
+		meta := suggestedRepliesMeta(confirmSuggestions)
+		meta["is_confirmation"] = true
+		if err := m.postReply(conv, assistant, confirm, meta); err != nil {
 			m.handoff(conv, assistant, m.i18n.T("ai.agent.handoffError"))
 			return
 		}
@@ -431,6 +443,51 @@ func (m *Manager) postReply(conv cmodels.Conversation, assistant models.Assistan
 	return nil
 }
 
+func (m *Manager) CompleteHandoff(conv cmodels.Conversation) error {
+	if !conv.AssignedUserID.Valid {
+		return fmt.Errorf("conversation has no assigned assistant")
+	}
+	assistant, err := m.GetAssistantByUserID(int(conv.AssignedUserID.Int))
+	if err != nil {
+		return err
+	}
+	private := false
+	messages, _, err := m.convo.GetConversationMessages(conv.UUID, 1, 1, &private, []string{cmodels.MessageOutgoing})
+	if err != nil {
+		return err
+	}
+	if len(messages) == 0 || !messageMetaBool(messages[0].Meta, "handoff_form_pending") {
+		return fmt.Errorf("conversation has no pending handoff form")
+	}
+	m.handoff(conv, assistant, "")
+	return nil
+}
+
+func (m *Manager) requestHandoffForm(conv cmodels.Conversation, assistant models.Assistant) bool {
+	if conv.InboxChannel != inbox.ChannelLiveChat {
+		return false
+	}
+	inboxRecord, err := m.inbox.GetDBRecord(conv.InboxID)
+	if err != nil {
+		m.lo.Error("error loading inbox for AI handoff form", "inbox_id", conv.InboxID, "error", err)
+		return false
+	}
+	var config livechat.Config
+	if err := json.Unmarshal(inboxRecord.Config, &config); err != nil {
+		m.lo.Error("error parsing inbox config for AI handoff form", "inbox_id", conv.InboxID, "error", err)
+		return false
+	}
+	isVisitor := conv.Contact.Type == umodels.UserTypeVisitor
+	config = config.ResolvePreChatForm(isVisitor)
+	if !config.PreChatForm.Enabled || !config.PreChatForm.HandoffOnly || !slices.ContainsFunc(config.PreChatForm.Fields, func(field livechat.PreChatFormField) bool { return field.Enabled }) {
+		return false
+	}
+	if err := m.postReply(conv, assistant, m.i18n.T("ai.agent.handoffFormPrompt"), map[string]any{"handoff_form_pending": true}); err != nil {
+		return false
+	}
+	return true
+}
+
 // handoff notes the reason and moves the conversation to the fallback team, or unassigns if none is set.
 func (m *Manager) handoff(conv cmodels.Conversation, assistant models.Assistant, reason string) {
 	actor := m.actorUser(assistant)
@@ -736,3 +793,44 @@ func splitConfirmation(answer string) (string, string) {
 	}
 	return main, confirm
 }
+
+func splitSuggestions(answer string) (string, []string) {
+	idx := strings.LastIndex(answer, suggestionsMarker)
+	if idx == -1 {
+		return answer, nil
+	}
+	body := strings.TrimSpace(strings.ReplaceAll(answer[:idx], suggestionsMarker, ""))
+	var raw []string
+	if err := json.Unmarshal([]byte(strings.TrimSpace(answer[idx+len(suggestionsMarker):])), &raw); err != nil {
+		return body, nil
+	}
+	suggestions := make([]string, 0, min(len(raw), 3))
+	for _, suggestion := range raw {
+		suggestion = strings.TrimSpace(suggestion)
+		if suggestion == "" || len([]rune(suggestion)) > 80 || slices.Contains(suggestions, suggestion) {
+			continue
+		}
+		suggestions = append(suggestions, suggestion)
+		if len(suggestions) == 3 {
+			break
+		}
+	}
+	return body, suggestions
+}
+
+func suggestedRepliesMeta(suggestions []string) map[string]any {
+	meta := map[string]any{}
+	if len(suggestions) > 0 {
+		meta["suggested_replies"] = suggestions
+	}
+	return meta
+}
+
+func messageMetaBool(raw json.RawMessage, key string) bool {
+	var meta map[string]any
+	if err := json.Unmarshal(raw, &meta); err != nil {
+		return false
+	}
+	value, _ := meta[key].(bool)
+	return value
+}
diff --git a/internal/aiagent/worker_test.go b/internal/aiagent/worker_test.go
new file mode 100644
index 00000000..2a3e62a3
--- /dev/null
+++ b/internal/aiagent/worker_test.go
@@ -0,0 +1,24 @@
+package aiagent
+
+import (
+	"reflect"
+	"testing"
+)
+
+func TestSplitSuggestions(t *testing.T) {
+	body, suggestions := splitSuggestions("Which plan?\n[[suggestions]] [\"Basic\",\"Pro\",\"Enterprise\",\"Extra\"]")
+	if body != "Which plan?" {
+		t.Fatalf("unexpected body: %q", body)
+	}
+	want := []string{"Basic", "Pro", "Enterprise"}
+	if !reflect.DeepEqual(suggestions, want) {
+		t.Fatalf("unexpected suggestions: %#v", suggestions)
+	}
+}
+
+func TestSplitSuggestionsRejectsInvalidPayload(t *testing.T) {
+	body, suggestions := splitSuggestions("Tell me more\n[[suggestions]] not-json")
+	if body != "Tell me more" || suggestions != nil {
+		t.Fatalf("unexpected result: %q %#v", body, suggestions)
+	}
+}
diff --git a/internal/conversation/conversation.go b/internal/conversation/conversation.go
index 60fd8d9f..2a0de6ac 100644
--- a/internal/conversation/conversation.go
+++ b/internal/conversation/conversation.go
@@ -363,6 +363,7 @@ type queries struct {
 	// Message queries.
 	GetMessage                         *sqlx.Stmt `query:"get-message"`
 	GetMessages                        string     `query:"get-messages"`
+	GetContactUnreadPreviewMessages    *sqlx.Stmt `query:"get-contact-unread-preview-messages"`
 	GetOutgoingPendingMessages         *sqlx.Stmt `query:"get-outgoing-pending-messages"`
 	GetMessageSourceIDs                *sqlx.Stmt `query:"get-message-source-ids"`
 	GetConversationUUIDFromMessageUUID *sqlx.Stmt `query:"get-conversation-uuid-from-message-uuid"`
@@ -517,6 +518,38 @@ func (c *Manager) GetContactChatConversations(contactID, inboxID int) ([]models.
 	return conversations, nil
 }
 
+func (c *Manager) GetContactUnreadPreviewMessages(contactID, inboxID, limit int) ([]models.ChatMessage, error) {
+	var messages []models.Message
+	if err := c.q.GetContactUnreadPreviewMessages.Select(&messages, contactID, inboxID, limit); err != nil {
+		c.lo.Error("error fetching unread preview messages", "contact_id", contactID, "inbox_id", inboxID, "error", err)
+		return nil, envelope.NewError(envelope.GeneralError, c.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+
+	previews := make([]models.ChatMessage, 0, len(messages))
+	for _, message := range messages {
+		c.SignAvatarURL(&message.Author.AvatarURL)
+		c.SignAttachmentURLs(message.Attachments)
+		author := message.Author
+		if sender := proactiveSender(message.Meta); sender != "" {
+			author.FirstName = sender
+			author.LastName = ""
+		}
+		author.Email = null.String{}
+		previews = append(previews, models.ChatMessage{
+			UUID:             message.UUID,
+			Status:           message.Status,
+			ConversationUUID: message.ConversationUUID,
+			CreatedAt:        message.CreatedAt,
+			Content:          message.Content,
+			TextContent:      message.TextContent,
+			Author:           author,
+			Attachments:      message.Attachments,
+			Meta:             message.Meta,
+		})
+	}
+	return previews, nil
+}
+
 // GetChatConversation retrieves a single chat conversation by UUID
 func (c *Manager) GetChatConversation(conversationUUID string) (models.ChatConversation, error) {
 	var conversation models.ChatConversation
diff --git a/internal/conversation/models/models.go b/internal/conversation/models/models.go
index 3326833b..f1028dfb 100644
--- a/internal/conversation/models/models.go
+++ b/internal/conversation/models/models.go
@@ -97,6 +97,7 @@ type ChatConversation struct {
 	UUID               string            `db:"uuid" json:"uuid"`
 	Status             string            `db:"status" json:"status"`
 	LastChatMessage    LastChatMessage   `db:"last_message" json:"last_message"`
+	UnreadMessages     []ChatMessage     `db:"-" json:"unread_messages,omitempty"`
 	UnreadMessageCount int               `db:"unread_message_count" json:"unread_message_count"`
 	Assignee           *umodels.ChatUser `db:"assignee" json:"assignee"`
 }
diff --git a/internal/conversation/queries.sql b/internal/conversation/queries.sql
index 221917aa..ba3f323a 100644
--- a/internal/conversation/queries.sql
+++ b/internal/conversation/queries.sql
@@ -395,6 +395,58 @@ LEFT JOIN users lis ON c.last_interaction_sender_id = lis.id
 WHERE c.uuid = $1
   AND inb.deleted_at IS NULL;
 
+-- name: get-contact-unread-preview-messages
+SELECT
+    m.id,
+    m.created_at,
+    m.status,
+    m.type,
+    m.content,
+    m.text_content,
+    m.content_type,
+    m.conversation_id,
+    m.uuid,
+    m.private,
+    m.sender_id,
+    m.sender_type,
+    m.meta,
+    c.uuid AS conversation_uuid,
+    u.id AS "author.id",
+    u.first_name AS "author.first_name",
+    u.last_name AS "author.last_name",
+    u.email AS "author.email",
+    u.avatar_url AS "author.avatar_url",
+    u.availability_status AS "author.availability_status",
+    u.type AS "author.type",
+    u.last_active_at AS "author.last_active_at",
+    COALESCE(
+      (SELECT json_agg(
+        json_build_object(
+          'name', filename,
+          'content_type', content_type,
+          'uuid', uuid,
+          'size', size,
+          'content_id', content_id,
+          'disposition', disposition
+        ) ORDER BY filename
+      ) FROM media
+      WHERE model_type = 'messages' AND model_id = m.id),
+    '[]'::json) AS attachments
+FROM conversation_messages m
+JOIN conversations c ON c.id = m.conversation_id
+JOIN inboxes inb ON inb.id = c.inbox_id
+JOIN users u ON u.id = m.sender_id
+WHERE c.contact_id = $1
+  AND c.inbox_id = $2
+  AND inb.deleted_at IS NULL
+  AND m.created_at > COALESCE(c.contact_last_seen_at, c.created_at)
+  AND m.type = 'outgoing'
+  AND m.private = false
+  AND u.type IN ('agent', 'ai_assistant')
+  AND (m.meta IS NULL OR NOT COALESCE((m.meta->>'continuity_email')::boolean, false))
+ORDER BY m.created_at DESC, m.id DESC
+LIMIT $3;
+
 -- name: get-contact-chat-conversations
 SELECT
     COALESCE((SELECT json_agg(json_build_object('name', media.filename, 'content_type', media.content_type, 'uuid', media.uuid, 'size', media.size, 'content_id', media.content_id, 'disposition', media.disposition))
diff --git a/internal/helpcenter/article_translation_test.go b/internal/helpcenter/article_translation_test.go
new file mode 100644
index 00000000..f487c026
--- /dev/null
+++ b/internal/helpcenter/article_translation_test.go
@@ -0,0 +1,58 @@
+package helpcenter
+
+import (
+	"testing"
+
+	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/abhinavxd/libredesk/internal/helpcenter/models"
+	"github.com/abhinavxd/libredesk/internal/testutil"
+	"github.com/zerodha/logf"
+)
+
+func TestCreateArticleTranslation(t *testing.T) {
+	db := testutil.NewDB(t, "help_article_translation")
+	db.MustExec(`
+		INSERT INTO help_centers (name, slug, allowed_locales) VALUES ('Docs', 'docs', '["en", "fr"]');
+		INSERT INTO article_collections (help_center_id, slug, locale, name, is_published) VALUES
+			(1, 'general', 'en', 'General', true),
+			(1, 'general', 'fr', 'Général', true);
+	`)
+	lo := logf.New(logf.Opts{})
+	mgr, err := New(Opts{DB: db, Lo: &lo, I18n: testutil.NewI18n(t)})
+	if err != nil {
+		t.Fatal(err)
+	}
+
+	source, err := mgr.CreateArticle(1, ArticleRequest{
+		Slug: "billing", Locale: "en", Title: "Billing", Content: "English", Status: models.ArticleStatusPublished,
+	})
+	if err != nil {
+		t.Fatal(err)
+	}
+	translation, err := mgr.CreateArticle(2, ArticleRequest{
+		Slug: "facturation", Locale: "fr", Title: "Facturation", Content: "Français", Status: models.ArticleStatusPublished,
+		TranslationOfID: &source.ID,
+	})
+	if err != nil {
+		t.Fatal(err)
+	}
+	if source.TranslationGroupID != translation.TranslationGroupID {
+		t.Fatal("translation was created in a different group")
+	}
+
+	translations, err := mgr.GetPublishedArticleTranslations("docs", source.ID)
+	if err != nil {
+		t.Fatal(err)
+	}
+	if len(translations) != 2 || translations[0].Locale != "en" || translations[1].Locale != "fr" {
+		t.Fatalf("unexpected translations: %#v", translations)
+	}
+
+	_, err = mgr.CreateArticle(2, ArticleRequest{
+		Slug: "autre", Locale: "fr", Title: "Autre", Content: "Français", Status: models.ArticleStatusPublished,
+		TranslationOfID: &source.ID,
+	})
+	if envErr, ok := err.(envelope.Error); !ok || envErr.ErrorType != envelope.ConflictError {
+		t.Fatalf("expected duplicate-locale conflict, got %v", err)
+	}
+}
diff --git a/internal/helpcenter/helpcenter.go b/internal/helpcenter/helpcenter.go
index c8f4e6e5..71262d35 100644
--- a/internal/helpcenter/helpcenter.go
+++ b/internal/helpcenter/helpcenter.go
@@ -134,6 +134,7 @@ type ArticleRequest struct {
 	AIEnabled       bool   `json:"ai_enabled"`
 	CollectionID    *int   `json:"collection_id,omitempty"`
 	AuthorID        *int64 `json:"author_id"`
+	TranslationOfID *int   `json:"translation_of_id,omitempty"`
 	CreatedBy       *int64 `json:"-"`
 }
 
@@ -182,6 +183,7 @@ type queries struct {
 	DeleteCollection           *sqlx.Stmt `query:"delete-collection"`
 
 	GetArticleByID                *sqlx.Stmt `query:"get-article-by-id"`
+	GetArticleTranslations        *sqlx.Stmt `query:"get-article-translations"`
 	InsertArticle                 *sqlx.Stmt `query:"insert-article"`
 	UpdateArticle                 *sqlx.Stmt `query:"update-article"`
 	ArticleSlugExistsInHelpCenter *sqlx.Stmt `query:"article-slug-exists-in-help-center"`
@@ -195,6 +197,7 @@ type queries struct {
 	GetHelpCenterTreeData            *sqlx.Stmt `query:"get-help-center-tree-data"`
 	GetPublicTreeData                *sqlx.Stmt `query:"get-public-tree-data"`
 	GetPublishedArticleBySlug        *sqlx.Stmt `query:"get-published-article-by-slug"`
+	GetPublishedArticleTranslations  *sqlx.Stmt `query:"get-published-article-translations"`
 	GetPublishedArticleLocales       *sqlx.Stmt `query:"get-published-article-locales"`
 	GetPublishedCollectionLocales    *sqlx.Stmt `query:"get-published-collection-locales"`
 	GetPublishedArticles             *sqlx.Stmt `query:"get-published-articles"`
@@ -620,6 +623,15 @@ func (m *Manager) GetArticleByID(id int) (models.Article, error) {
 	return article, nil
 }
 
+func (m *Manager) GetArticleTranslations(id int) ([]models.ArticleTranslation, error) {
+	var translations = make([]models.ArticleTranslation, 0)
+	if err := m.q.GetArticleTranslations.Select(&translations, id); err != nil {
+		m.lo.Error("error fetching article translations", "error", err, "id", id)
+		return nil, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return translations, nil
+}
+
 // CreateArticle creates a new article.
 func (m *Manager) CreateArticle(collectionID int, req ArticleRequest) (models.Article, error) {
 	var article models.Article
@@ -638,6 +650,25 @@ func (m *Manager) CreateArticle(collectionID int, req ArticleRequest) (models.Ar
 	if err := m.validateArticleAuthor(req.AuthorID); err != nil {
 		return article, err
 	}
+	translationGroupID := ""
+	if req.TranslationOfID != nil {
+		source, err := m.GetArticleByID(*req.TranslationOfID)
+		if err != nil {
+			return article, err
+		}
+		sourceCollection, err := m.GetCollectionByID(source.CollectionID)
+		if err != nil {
+			return article, err
+		}
+		targetCollection, err := m.GetCollectionByID(collectionID)
+		if err != nil {
+			return article, err
+		}
+		if sourceCollection.HelpCenterID != targetCollection.HelpCenterID {
+			return article, envelope.NewError(envelope.InputError, m.i18n.T("helpCenter.invalidCollection"), nil)
+		}
+		translationGroupID = source.TranslationGroupID
+	}
 
 	// Slug uniqueness is per help center but the DB index is per collection, so the
 	// check and insert lock the help center row to serialize concurrent writers.
@@ -657,7 +688,7 @@ func (m *Manager) CreateArticle(collectionID int, req ArticleRequest) (models.Ar
 	req.Slug = slug
 	req.Content = articleSanitizer.Sanitize(req.Content)
 	req.Excerpt = strings.TrimSpace(req.Excerpt)
-	if err := tx.Stmtx(m.q.InsertArticle).Get(&article, collectionID, req.AuthorID, req.CreatedBy, req.Slug, req.Locale, req.Title, req.Content, req.Excerpt, req.MetaTitle, req.MetaDescription, req.MetaImageURL, req.SortOrder, req.Status, req.AIEnabled); err != nil {
+	if err := tx.Stmtx(m.q.InsertArticle).Get(&article, collectionID, req.AuthorID, req.CreatedBy, req.Slug, req.Locale, req.Title, req.Content, req.Excerpt, req.MetaTitle, req.MetaDescription, req.MetaImageURL, req.SortOrder, req.Status, req.AIEnabled, translationGroupID); err != nil {
 		if dbutil.IsUniqueViolationError(err) {
 			return article, envelope.NewError(envelope.ConflictError, m.i18n.T("globals.messages.errorAlreadyExists"), nil)
 		}
@@ -892,6 +923,15 @@ func (m *Manager) GetPublishedArticle(helpCenterSlug, articleSlug, locale string
 	return article, nil
 }
 
+func (m *Manager) GetPublishedArticleTranslations(helpCenterSlug string, articleID int) ([]models.ArticleTranslation, error) {
+	var translations = make([]models.ArticleTranslation, 0)
+	if err := m.q.GetPublishedArticleTranslations.Select(&translations, helpCenterSlug, articleID); err != nil {
+		m.lo.Error("error fetching article translations", "error", err, "help_center_slug", helpCenterSlug)
+		return nil, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return translations, nil
+}
+
 // GetPopularArticles returns the most viewed published articles for a help center, filtered to locale (empty = all).
 func (m *Manager) GetPopularArticles(helpCenterSlug, locale string, limit int) ([]models.Article, error) {
 	var articles = make([]models.Article, 0)
diff --git a/internal/helpcenter/models/models.go b/internal/helpcenter/models/models.go
index f423fd52..82434d7e 100644
--- a/internal/helpcenter/models/models.go
+++ b/internal/helpcenter/models/models.go
@@ -116,33 +116,43 @@ type Collection struct {
 }
 
 type Article struct {
-	ID              int       `db:"id" json:"id"`
-	CreatedAt       time.Time `db:"created_at" json:"created_at"`
-	UpdatedAt       time.Time `db:"updated_at" json:"updated_at"`
-	CollectionID    int       `db:"collection_id" json:"collection_id"`
-	AuthorID        *int64    `db:"author_id" json:"author_id"`
-	AuthorName      *string   `db:"author_name" json:"author_name"`
-	AuthorAvatar    *string   `db:"author_avatar" json:"author_avatar"`
-	CreatedBy       *int64    `db:"created_by" json:"created_by"`
-	CreatedByName   *string   `db:"created_by_name" json:"created_by_name"`
-	Slug            string    `db:"slug" json:"slug"`
-	Locale          string    `db:"locale" json:"locale"`
-	Title           string    `db:"title" json:"title"`
-	Content         string    `db:"content" json:"content"`
-	Excerpt         string    `db:"excerpt" json:"excerpt"`
-	MetaTitle       string    `db:"meta_title" json:"meta_title"`
-	MetaDescription string    `db:"meta_description" json:"meta_description"`
-	MetaImageURL    string    `db:"meta_image_url" json:"meta_image_url"`
-	SortOrder       int       `db:"sort_order" json:"sort_order"`
-	Status          string    `db:"status" json:"status"`
-	ViewCount       int       `db:"view_count" json:"view_count"`
-	AIEnabled       bool      `db:"ai_enabled" json:"ai_enabled"`
+	ID                 int       `db:"id" json:"id"`
+	CreatedAt          time.Time `db:"created_at" json:"created_at"`
+	UpdatedAt          time.Time `db:"updated_at" json:"updated_at"`
+	CollectionID       int       `db:"collection_id" json:"collection_id"`
+	AuthorID           *int64    `db:"author_id" json:"author_id"`
+	TranslationGroupID string    `db:"translation_group_id" json:"-"`
+	AuthorName         *string   `db:"author_name" json:"author_name"`
+	AuthorAvatar       *string   `db:"author_avatar" json:"author_avatar"`
+	CreatedBy          *int64    `db:"created_by" json:"created_by"`
+	CreatedByName      *string   `db:"created_by_name" json:"created_by_name"`
+	Slug               string    `db:"slug" json:"slug"`
+	Locale             string    `db:"locale" json:"locale"`
+	Title              string    `db:"title" json:"title"`
+	Content            string    `db:"content" json:"content"`
+	Excerpt            string    `db:"excerpt" json:"excerpt"`
+	MetaTitle          string    `db:"meta_title" json:"meta_title"`
+	MetaDescription    string    `db:"meta_description" json:"meta_description"`
+	MetaImageURL       string    `db:"meta_image_url" json:"meta_image_url"`
+	SortOrder          int       `db:"sort_order" json:"sort_order"`
+	Status             string    `db:"status" json:"status"`
+	ViewCount          int       `db:"view_count" json:"view_count"`
+	AIEnabled          bool      `db:"ai_enabled" json:"ai_enabled"`
 	// EmbeddedFingerprint is internal AI-index state; mapped so RETURNING * scans in
 	// safe-mode transactions don't fail, but never exposed in API responses.
 	EmbeddedFingerprint string `db:"embedded_fingerprint" json:"-"`
 	SearchTSV           string `db:"search_tsv" json:"-"`
-	HelpfulCount    int    `db:"helpful_count" json:"helpful_count"`
-	NotHelpfulCount int    `db:"not_helpful_count" json:"not_helpful_count"`
+	HelpfulCount        int    `db:"helpful_count" json:"helpful_count"`
+	NotHelpfulCount     int    `db:"not_helpful_count" json:"not_helpful_count"`
+}
+
+type ArticleTranslation struct {
+	ID           int    `db:"id" json:"id"`
+	CollectionID int    `db:"collection_id" json:"collection_id"`
+	Locale       string `db:"locale" json:"locale"`
+	Slug         string `db:"slug" json:"slug"`
+	Title        string `db:"title" json:"title"`
+	Status       string `db:"status" json:"status"`
 }
 
 // NavLink is a single header navigation link on the public help center pages.
diff --git a/internal/helpcenter/queries.sql b/internal/helpcenter/queries.sql
index 9191c243..5b6c8c32 100644
--- a/internal/helpcenter/queries.sql
+++ b/internal/helpcenter/queries.sql
@@ -133,7 +133,7 @@ DELETE FROM article_collections
 WHERE id = $1;
 
 -- name: get-article-by-id
-SELECT a.id, a.created_at, a.updated_at, a.collection_id, a.author_id, a.created_by, a.slug, a.locale, a.title, a.content,
+SELECT a.id, a.created_at, a.updated_at, a.collection_id, a.author_id, a.created_by, a.translation_group_id, a.slug, a.locale, a.title, a.content,
     a.excerpt, a.meta_title, a.meta_description, a.meta_image_url, a.sort_order, a.status, a.view_count, a.ai_enabled,
     TRIM(u.first_name || ' ' || COALESCE(u.last_name, '')) AS author_name,
     TRIM(cu.first_name || ' ' || COALESCE(cu.last_name, '')) AS created_by_name,
@@ -144,17 +144,29 @@ LEFT JOIN users u ON u.id = a.author_id
 LEFT JOIN users cu ON cu.id = a.created_by
 WHERE a.id = $1;
 
+-- name: get-article-translations
+SELECT a.id, a.collection_id, a.locale, a.slug, a.title, a.status
+FROM help_articles a
+WHERE a.translation_group_id = (SELECT translation_group_id FROM help_articles WHERE id = $1)
+ORDER BY a.locale;
+
 -- name: insert-article
-INSERT INTO help_articles (collection_id, author_id, created_by, slug, locale, title, content, excerpt, meta_title, meta_description, meta_image_url, sort_order, status, ai_enabled)
-VALUES ($1, $2, $3, $4, $5, $6, $7, $8, $9, $10, $11, $12, $13, $14)
-RETURNING *;
+INSERT INTO help_articles (collection_id, author_id, created_by, slug, locale, title, content, excerpt, meta_title, meta_description, meta_image_url, sort_order, status, ai_enabled, translation_group_id)
+VALUES ($1, $2, $3, $4, $5, $6, $7, $8, $9, $10, $11, $12, $13, $14, COALESCE(NULLIF($15, '')::UUID, gen_random_uuid()))
+RETURNING id, created_at, updated_at, collection_id, author_id, created_by,
+    translation_group_id, slug, locale, title, content, excerpt, meta_title,
+    meta_description, meta_image_url, sort_order, status, view_count,
+    ai_enabled, embedded_fingerprint, search_tsv;
 
 -- name: update-article
 UPDATE help_articles
 SET collection_id = COALESCE($9, collection_id), slug = $2, locale = $3, title = $4, content = $5, sort_order = $6, status = $7, ai_enabled = $8,
     excerpt = $10, meta_title = $11, meta_description = $12, meta_image_url = $13, author_id = $14, updated_at = NOW()
 WHERE id = $1
-RETURNING *;
+RETURNING id, created_at, updated_at, collection_id, author_id, created_by,
+    translation_group_id, slug, locale, title, content, excerpt, meta_title,
+    meta_description, meta_image_url, sort_order, status, view_count,
+    ai_enabled, embedded_fingerprint, search_tsv;
 
 -- name: user-is-author-assignable
 SELECT EXISTS(
@@ -344,6 +356,23 @@ WHERE a.slug = $2 AND a.status = 'published' AND ($3 = '' OR a.locale = $3)
 ORDER BY c.sort_order, a.sort_order, a.id
 LIMIT 1;
 
+-- name: get-published-article-translations
+WITH RECURSIVE published_collections AS (
+    SELECT c.id FROM article_collections c
+    JOIN help_centers h ON h.id = c.help_center_id
+    WHERE h.slug = $1 AND c.parent_id IS NULL AND c.is_published = true
+    UNION
+    SELECT c.id FROM article_collections c
+    JOIN published_collections p ON c.parent_id = p.id
+    WHERE c.is_published = true
+)
+SELECT a.id, a.collection_id, a.locale, a.slug, a.title, a.status
+FROM help_articles a
+JOIN article_collections c ON c.id = a.collection_id AND c.locale = a.locale AND c.id IN (SELECT id FROM published_collections)
+WHERE a.translation_group_id = (SELECT translation_group_id FROM help_articles WHERE id = $2)
+    AND a.status = 'published'
+ORDER BY a.locale;
+
 -- name: get-published-article-locales
 WITH RECURSIVE published_collections AS (
     SELECT c.id FROM article_collections c
diff --git a/internal/inbox/channel/livechat/livechat.go b/internal/inbox/channel/livechat/livechat.go
index 2f15138e..410c3fac 100644
--- a/internal/inbox/channel/livechat/livechat.go
+++ b/internal/inbox/channel/livechat/livechat.go
@@ -75,6 +75,30 @@ type PreviewConfig struct {
 	AutoHideSeconds int    `json:"auto_hide_seconds"`
 }
 
+type AudienceConfig struct {
+	AllowStartConversation           bool     `json:"allow_start_conversation"`
+	PreventMultipleConversations     bool     `json:"prevent_multiple_conversations"`
+	PreventReplyToClosedConversation bool     `json:"prevent_reply_to_closed_conversation"`
+	StartConversationButtonText      string   `json:"start_conversation_button_text"`
+	QuickReplies                     []string `json:"quick_replies"`
+	DirectToConversation             *bool    `json:"direct_to_conversation,omitempty"`
+}
+
+type AudiencePreChatFormConfig struct {
+	Enabled *bool              `json:"enabled,omitempty"`
+	Title   *string            `json:"title,omitempty"`
+	Fields  []PreChatFormField `json:"fields"`
+}
+
+type PreChatFormConfig struct {
+	Enabled     bool                       `json:"enabled"`
+	HandoffOnly bool                       `json:"handoff_only"`
+	Title       string                     `json:"title"`
+	Fields      []PreChatFormField         `json:"fields"`
+	Visitors    *AudiencePreChatFormConfig `json:"visitors,omitempty"`
+	Users       *AudiencePreChatFormConfig `json:"users,omitempty"`
+}
+
 // Config holds the live chat inbox configuration.
 type Config struct {
 	Campaigns             []proactive.Campaign `json:"campaigns"`
@@ -87,13 +111,8 @@ type Config struct {
 	ShowPoweredBy         bool                 `json:"show_powered_by"`
 	Language              string               `json:"language"`
 	FallbackLanguage      string               `json:"fallback_language"`
-	Users                 struct {
-		AllowStartConversation           bool   `json:"allow_start_conversation"`
-		PreventMultipleConversations     bool   `json:"prevent_multiple_conversations"`
-		PreventReplyToClosedConversation bool   `json:"prevent_reply_to_closed_conversation"`
-		StartConversationButtonText      string `json:"start_conversation_button_text"`
-	} `json:"users"`
-	Colors struct {
+	Users                 AudienceConfig       `json:"users"`
+	Colors                struct {
 		Primary string `json:"primary"`
 	} `json:"colors"`
 	HomeScreen struct {
@@ -121,34 +140,26 @@ type Config struct {
 		Position string `json:"position"`
 		Color    string `json:"color"`
 	} `json:"launcher"`
-	LogoURL  string `json:"logo_url"`
-	Visitors struct {
-		AllowStartConversation           bool   `json:"allow_start_conversation"`
-		PreventMultipleConversations     bool   `json:"prevent_multiple_conversations"`
-		PreventReplyToClosedConversation bool   `json:"prevent_reply_to_closed_conversation"`
-		StartConversationButtonText      string `json:"start_conversation_button_text"`
-	} `json:"visitors"`
+	LogoURL      string         `json:"logo_url"`
+	Visitors     AudienceConfig `json:"visitors"`
 	NoticeBanner struct {
 		Text    string `json:"text"`
 		Enabled bool   `json:"enabled"`
 	} `json:"notice_banner"`
-	HomeApps                       []HomeApp        `json:"home_apps"`
-	TrustedDomains                 []string         `json:"trusted_domains"`
-	BlockedIPs                     []string         `json:"blocked_ips"`
-	DirectToConversation           bool             `json:"direct_to_conversation"`
-	GreetingMessage                string           `json:"greeting_message"`
-	ChatIntroduction               string           `json:"chat_introduction"`
-	IntroductionMessage            string           `json:"introduction_message"`
-	Continuity                     ContinuityConfig `json:"continuity"`
-	ShowOfficeHoursInChat          bool             `json:"show_office_hours_in_chat"`
-	ShowOfficeHoursAfterAssignment bool             `json:"show_office_hours_after_assignment"`
-	ChatReplyExpectationMessage    string           `json:"chat_reply_expectation_message"`
-	SessionDuration                string           `json:"session_duration"`
-	PreChatForm                    struct {
-		Enabled bool               `json:"enabled"`
-		Title   string             `json:"title"`
-		Fields  []PreChatFormField `json:"fields"`
-	} `json:"prechat_form"`
+	HomeApps                       []HomeApp         `json:"home_apps"`
+	TrustedDomains                 []string          `json:"trusted_domains"`
+	BlockedIPs                     []string          `json:"blocked_ips"`
+	DirectToConversation           bool              `json:"direct_to_conversation"`
+	GreetingMessage                string            `json:"greeting_message"`
+	ChatIntroduction               string            `json:"chat_introduction"`
+	QuickReplies                   []string          `json:"quick_replies"`
+	IntroductionMessage            string            `json:"introduction_message"`
+	Continuity                     ContinuityConfig  `json:"continuity"`
+	ShowOfficeHoursInChat          bool              `json:"show_office_hours_in_chat"`
+	ShowOfficeHoursAfterAssignment bool              `json:"show_office_hours_after_assignment"`
+	ChatReplyExpectationMessage    string            `json:"chat_reply_expectation_message"`
+	SessionDuration                string            `json:"session_duration"`
+	PreChatForm                    PreChatFormConfig `json:"prechat_form"`
 }
 
 // Client represents a connected chat client
@@ -212,6 +223,28 @@ func New(store inbox.MessageStore, userStore inbox.UserStore, opts Opts) (*LiveC
 	return lc, nil
 }
 
+func (c Config) ResolvePreChatForm(isVisitor bool) Config {
+	audience := c.PreChatForm.Users
+	if isVisitor {
+		audience = c.PreChatForm.Visitors
+	}
+	c.PreChatForm.Visitors = nil
+	c.PreChatForm.Users = nil
+	if audience == nil {
+		return c
+	}
+	if audience.Enabled != nil {
+		c.PreChatForm.Enabled = c.PreChatForm.Enabled && *audience.Enabled
+	}
+	if audience.Title != nil {
+		c.PreChatForm.Title = *audience.Title
+	}
+	if audience.Fields != nil {
+		c.PreChatForm.Fields = audience.Fields
+	}
+	return c
+}
+
 // Identifier returns the unique identifier of the inbox which is the database ID.
 func (lc *LiveChat) Identifier() int {
 	return lc.id
diff --git a/internal/inbox/channel/livechat/livechat_test.go b/internal/inbox/channel/livechat/livechat_test.go
new file mode 100644
index 00000000..cd17f84c
--- /dev/null
+++ b/internal/inbox/channel/livechat/livechat_test.go
@@ -0,0 +1,59 @@
+package livechat
+
+import (
+	"encoding/json"
+	"testing"
+)
+
+func TestResolvePreChatFormFallsBackToLegacyValues(t *testing.T) {
+	var config Config
+	if err := json.Unmarshal([]byte(`{
+		"prechat_form":{
+			"enabled":true,
+			"title":"Before we start",
+			"fields":[{"key":"email","label":"Email"}]
+		}
+	}`), &config); err != nil {
+		t.Fatal(err)
+	}
+
+	for _, isVisitor := range []bool{true, false} {
+		resolved := config.ResolvePreChatForm(isVisitor)
+		if !resolved.PreChatForm.Enabled || resolved.PreChatForm.Title != "Before we start" {
+			t.Fatalf("resolved pre-chat form = %+v", resolved.PreChatForm)
+		}
+		if len(resolved.PreChatForm.Fields) != 1 || resolved.PreChatForm.Fields[0].Key != "email" {
+			t.Fatalf("resolved fields = %+v", resolved.PreChatForm.Fields)
+		}
+	}
+}
+
+func TestResolvePreChatFormUsesAudienceValues(t *testing.T) {
+	var config Config
+	if err := json.Unmarshal([]byte(`{
+		"prechat_form":{
+			"enabled":true,
+			"title":"Legacy title",
+			"fields":[{"key":"email"}],
+			"visitors":{"enabled":true,"title":"Choose a plan","fields":[{"key":"plan"}]},
+			"users":{"enabled":false,"title":"What is the issue?","fields":[]}
+		}
+	}`), &config); err != nil {
+		t.Fatal(err)
+	}
+
+	visitor := config.ResolvePreChatForm(true)
+	if !visitor.PreChatForm.Enabled || visitor.PreChatForm.Title != "Choose a plan" {
+		t.Fatalf("visitor pre-chat form = %+v", visitor.PreChatForm)
+	}
+	if len(visitor.PreChatForm.Fields) != 1 || visitor.PreChatForm.Fields[0].Key != "plan" {
+		t.Fatalf("visitor fields = %+v", visitor.PreChatForm.Fields)
+	}
+	user := config.ResolvePreChatForm(false)
+	if user.PreChatForm.Enabled || user.PreChatForm.Title != "What is the issue?" {
+		t.Fatalf("user pre-chat form = %+v", user.PreChatForm)
+	}
+	if user.PreChatForm.Fields == nil || len(user.PreChatForm.Fields) != 0 {
+		t.Fatalf("user fields = %+v", user.PreChatForm.Fields)
+	}
+}
diff --git a/internal/inbox/channel/livechat/proactive/eligibility.go b/internal/inbox/channel/livechat/proactive/eligibility.go
index 95cc047b..8f225422 100644
--- a/internal/inbox/channel/livechat/proactive/eligibility.go
+++ b/internal/inbox/channel/livechat/proactive/eligibility.go
@@ -35,6 +35,9 @@ func (c Campaign) Validate() error {
 	if c.SenderID < 0 || c.TeamID < 0 || c.BusinessHoursID < 0 || (c.BusinessHours != "any" && c.BusinessHoursID == 0) {
 		return fmt.Errorf("sender, team or business hours")
 	}
+	if !c.Desktop && !c.Mobile {
+		return fmt.Errorf("device")
+	}
 	if c.DelaySeconds < 0 || c.DelaySeconds > 86400 || c.RepeatHours < 1 || c.RepeatHours > 8760 {
 		return fmt.Errorf("delay or repeat interval")
 	}
diff --git a/internal/inbox/channel/livechat/proactive/eligibility_test.go b/internal/inbox/channel/livechat/proactive/eligibility_test.go
index 4765a640..cd7b987a 100644
--- a/internal/inbox/channel/livechat/proactive/eligibility_test.go
+++ b/internal/inbox/channel/livechat/proactive/eligibility_test.go
@@ -92,3 +92,22 @@ func TestEligibilityGates(t *testing.T) {
 		t.Fatal(got)
 	}
 }
+
+func TestCampaignValidateRequiresTargetDevice(t *testing.T) {
+	campaign := Campaign{
+		ID:            "8a3660e6-e29b-461c-924f-314c7576f75a",
+		Name:          "Pricing invitation",
+		Message:       "Need help choosing a plan?",
+		Audience:      "all",
+		BusinessHours: "any",
+		Repeat:        "once",
+		RepeatHours:   24,
+	}
+	if err := campaign.Validate(); err == nil || err.Error() != "device" {
+		t.Fatalf("got %v, want device validation error", err)
+	}
+	campaign.Desktop = true
+	if err := campaign.Validate(); err != nil {
+		t.Fatalf("valid desktop campaign: %v", err)
+	}
+}
diff --git a/internal/migrations/v2.10.0.go b/internal/migrations/v2.10.0.go
index 2292da10..61181a88 100644
--- a/internal/migrations/v2.10.0.go
+++ b/internal/migrations/v2.10.0.go
@@ -26,6 +26,26 @@ CREATE TABLE IF NOT EXISTS widget_campaign_deliveries (
 CREATE INDEX IF NOT EXISTS idx_widget_campaign_browser ON widget_campaign_deliveries(inbox_id, browser_key, created_at DESC);
 CREATE INDEX IF NOT EXISTS idx_widget_campaign_contact ON widget_campaign_deliveries(inbox_id, contact_id, created_at DESC) WHERE contact_id IS NOT NULL;
 CREATE INDEX IF NOT EXISTS idx_widget_campaign_stats ON widget_campaign_deliveries(inbox_id, campaign_id, created_at);
+
+ALTER TABLE help_articles ADD COLUMN IF NOT EXISTS translation_group_id UUID;
+WITH article_groups AS MATERIALIZED (
+    SELECT c.help_center_id, a.slug,
+        COALESCE(MIN(a.translation_group_id::TEXT)::UUID, gen_random_uuid()) AS group_id
+    FROM help_articles a
+    JOIN article_collections c ON c.id = a.collection_id
+    GROUP BY c.help_center_id, a.slug
+    HAVING COUNT(*) = COUNT(DISTINCT a.locale)
+)
+UPDATE help_articles a
+SET translation_group_id = g.group_id
+FROM article_collections c
+JOIN article_groups g ON g.help_center_id = c.help_center_id
+WHERE a.collection_id = c.id AND a.slug = g.slug AND a.translation_group_id IS NULL;
+UPDATE help_articles SET translation_group_id = gen_random_uuid() WHERE translation_group_id IS NULL;
+ALTER TABLE help_articles ALTER COLUMN translation_group_id SET DEFAULT gen_random_uuid();
+ALTER TABLE help_articles ALTER COLUMN translation_group_id SET NOT NULL;
+CREATE UNIQUE INDEX IF NOT EXISTS index_unique_help_articles_on_translation_group_locale
+    ON help_articles(translation_group_id, locale);
 `)
 	return err
 }
diff --git a/internal/migrations/v2.10.0_test.go b/internal/migrations/v2.10.0_test.go
index 2d921461..1f3ce89a 100644
--- a/internal/migrations/v2.10.0_test.go
+++ b/internal/migrations/v2.10.0_test.go
@@ -1,8 +1,9 @@
 package migrations
 
 import (
-	"github.com/abhinavxd/libredesk/internal/testutil"
 	"testing"
+
+	"github.com/abhinavxd/libredesk/internal/testutil"
 )
 
 func TestWidgetCampaignMigration(t *testing.T) {
@@ -21,3 +22,59 @@ func TestWidgetCampaignMigration(t *testing.T) {
 		t.Fatalf("expected primary key and three indexes, got %d", count)
 	}
 }
+
+func TestHelpArticleTranslationGroupMigration(t *testing.T) {
+	db := testutil.NewDB(t, "article_translation_group_migration")
+	db.MustExec(`
+		INSERT INTO help_centers (name, slug, allowed_locales) VALUES ('Docs', 'docs', '["en", "fr"]');
+		INSERT INTO article_collections (help_center_id, slug, locale, name) VALUES
+			(1, 'general', 'en', 'General'),
+			(1, 'general', 'fr', 'Général'),
+			(1, 'other', 'en', 'Other');
+		INSERT INTO help_articles (collection_id, slug, locale, title) VALUES
+			(1, 'billing', 'en', 'Billing'),
+			(2, 'billing', 'fr', 'Facturation'),
+			(1, 'refunds', 'en', 'Refunds'),
+			(1, 'overview', 'en', 'Overview'),
+			(3, 'overview', 'en', 'Another overview');
+		ALTER TABLE help_articles DROP COLUMN translation_group_id;
+	`)
+
+	for range 2 {
+		if err := V2_10_0(db, nil, nil); err != nil {
+			t.Fatal(err)
+		}
+	}
+
+	var grouped int
+	if err := db.Get(&grouped, `
+		SELECT COUNT(DISTINCT translation_group_id)
+		FROM help_articles
+		WHERE slug = 'billing'
+	`); err != nil {
+		t.Fatal(err)
+	}
+	if grouped != 1 {
+		t.Fatalf("expected same-slug translations in one group, got %d groups", grouped)
+	}
+
+	var totalGroups int
+	if err := db.Get(&totalGroups, `SELECT COUNT(DISTINCT translation_group_id) FROM help_articles`); err != nil {
+		t.Fatal(err)
+	}
+	if totalGroups != 4 {
+		t.Fatalf("expected unrelated articles in separate groups, got %d groups", totalGroups)
+	}
+
+	var ambiguousGroups int
+	if err := db.Get(&ambiguousGroups, `
+		SELECT COUNT(DISTINCT translation_group_id)
+		FROM help_articles
+		WHERE slug = 'overview'
+	`); err != nil {
+		t.Fatal(err)
+	}
+	if ambiguousGroups != 2 {
+		t.Fatalf("expected ambiguous same-locale articles to remain separate, got %d groups", ambiguousGroups)
+	}
+}
diff --git a/schema.sql b/schema.sql
index 74dcb153..73fb3b52 100644
--- a/schema.sql
+++ b/schema.sql
@@ -715,6 +715,7 @@ CREATE TABLE help_articles (
 	collection_id INTEGER NOT NULL REFERENCES article_collections(id) ON DELETE CASCADE,
 	author_id BIGINT NULL REFERENCES users(id) ON DELETE SET NULL,
 	created_by BIGINT NULL REFERENCES users(id) ON DELETE SET NULL,
+	translation_group_id UUID NOT NULL DEFAULT gen_random_uuid(),
 	slug TEXT NOT NULL,
 	locale TEXT NOT NULL DEFAULT 'en',
 	title TEXT NOT NULL,
@@ -737,6 +738,7 @@ CREATE TABLE help_articles (
 	CONSTRAINT constraint_help_articles_on_status CHECK (status IN ('draft', 'published'))
 );
 CREATE UNIQUE INDEX index_unique_help_articles_on_collection_slug_locale ON help_articles(collection_id, slug, locale);
+CREATE UNIQUE INDEX index_unique_help_articles_on_translation_group_locale ON help_articles(translation_group_id, locale);
 CREATE INDEX index_help_articles_on_collection_id ON help_articles(collection_id);
 CREATE INDEX index_help_articles_on_author_id ON help_articles(author_id);
 CREATE INDEX index_help_articles_on_title_trgm ON help_articles USING gin (title gin_trgm_ops);
diff --git a/static/widget.js b/static/widget.js
index 0118f028..1b099555 100644
--- a/static/widget.js
+++ b/static/widget.js
@@ -20,7 +20,7 @@
                 throw new Error('inboxID is required');
             }
 
-            this.IFRAME_BORDER_RADIUS = '16px';
+            this.IFRAME_BORDER_RADIUS = '20px';
             this.IFRAME_BOX_SHADOW = '0 1px 6px rgba(9, 14, 21, 0.5), 0 4px 32px rgba(9, 14, 21, 0.65)';
             this.IFRAME_WIDTH = '400px';
             this.IFRAME_HEIGHT = '700px';
@@ -226,7 +226,7 @@
                 display: flex;
                 justify-content: center;
                 align-items: center;
-                box-shadow: 0 1px 4px rgba(9, 14, 21, 0.45), 0 3px 18px rgba(9, 14, 21, 0.55);
+                box-shadow: 0 3px 8px rgba(9, 14, 21, 0.45), 0 14px 40px rgba(9, 14, 21, 0.55);
                 transition: transform 0.3s ease;
             `;
 
@@ -698,10 +698,12 @@
             const host = document.createElement('div');
             const side = this.widgetSettings.launcher.position === 'left' ? 'left' : 'right';
             const spacing = this.widgetSettings.launcher.spacing;
-            Object.assign(host.style, { position: 'fixed', zIndex: '9998', bottom: `${spacing.bottom + this.launcherSize() + 12}px`, [side]: `${spacing.side}px`, width: `min(320px, calc(100vw - ${spacing.side * 2}px))` });
+            Object.assign(host.style, { position: 'fixed', zIndex: '9998', bottom: `${spacing.bottom + this.launcherSize() + 12}px`, [side]: `${spacing.side}px`, width: `min(340px, calc(100vw - ${spacing.side * 2}px))` });
+            host.style.setProperty('--align', side === 'left' ? 'flex-start' : 'flex-end');
+            host.style.setProperty('--muted', data.theme.muted || data.theme.foreground);
             const root = host.attachShadow({ mode: 'open' });
             const style = document.createElement('style');
-            style.textContent = ':host{font:14px/1.5 system-ui}button{font:inherit;color:inherit;cursor:pointer}button:focus-visible{outline:2px solid;outline-offset:2px}.stack{display:flex;flex-direction:column;gap:8px}.card{display:flex;align-items:flex-start;border:1px solid;border-radius:12px;overflow:hidden}.open{display:flex;gap:10px;align-items:flex-start;flex:1;min-width:0;padding:12px;text-align:left;border:0;background:transparent}.name{font-weight:600;display:block}.text{display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere}.avatar{width:28px;height:28px;border-radius:50%;object-fit:cover}.image{max-width:64px;max-height:48px;object-fit:cover}.close{padding:8px;min-height:44px;min-width:44px;border:0;background:transparent}.all{align-self:flex-end;border:1px solid;border-radius:6px;padding:4px 8px}';
+            style.textContent = ':host{font:14px/1.45 system-ui,-apple-system,sans-serif;-webkit-font-smoothing:antialiased}button{font:inherit;color:inherit;cursor:pointer;border:0;background:transparent;padding:0}button:focus-visible{outline:2px solid;outline-offset:2px}.stack{display:flex;flex-direction:column;gap:10px;align-items:var(--align)}.card{position:relative;display:flex;max-width:100%;border-radius:18px;box-shadow:0 1px 3px rgba(9,14,21,.12),0 8px 28px rgba(9,14,21,.16);animation:rise .22s ease-out}.open{display:flex;gap:10px;align-items:flex-start;min-width:0;padding:12px 14px;text-align:left;border-radius:inherit}.body{display:flex;flex-direction:column;min-width:0;gap:2px}.name{font-size:12px;line-height:1.3;color:var(--muted)}.text{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;overflow-wrap:anywhere;white-space:pre-line}.avatar{flex:none;width:32px;height:32px;border-radius:50%;object-fit:cover}.image{margin-top:6px;max-width:160px;max-height:96px;border-radius:10px;object-fit:cover}.close{position:absolute;top:-8px;inset-inline-end:-8px;width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:15px;line-height:1;color:var(--muted);box-shadow:0 1px 3px rgba(9,14,21,.18);opacity:0;transition:opacity .15s}.card:hover .close,.card:focus-within .close{opacity:1}@media(hover:none){.close{opacity:1}}.all{font-size:12px;color:var(--muted);padding:4px 6px;border-radius:6px}.all:hover{text-decoration:underline}@keyframes rise{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.card{animation:none}}';
             root.append(style);
             const stack = document.createElement('div');
             stack.className = 'stack';
@@ -724,7 +726,7 @@
             for (const item of previews) {
                 const card = document.createElement('div');
                 card.className = 'card';
-                Object.assign(card.style, { background: data.theme.background, color: data.theme.foreground, borderColor: data.theme.border });
+                Object.assign(card.style, { background: data.theme.background, color: data.theme.foreground });
                 const open = document.createElement('button');
                 open.type = 'button';
                 open.className = 'open';
@@ -739,6 +741,7 @@
                 const avatar = safeImage(item.avatar, 'avatar');
                 if (avatar) open.append(avatar);
                 const body = document.createElement('span');
+                body.className = 'body';
                 const name = document.createElement('span');
                 name.className = 'name';
                 name.textContent = item.name;
@@ -754,6 +757,7 @@
                 close.className = 'close';
                 close.textContent = '×';
                 close.setAttribute('aria-label', data.labels.dismiss);
+                Object.assign(close.style, { background: data.theme.background, border: `1px solid ${data.theme.border}` });
                 close.addEventListener('click', () => { this.dismissPreview(item.key); this.toggleButton.focus(); });
                 card.append(open, close);
                 stack.append(card);
@@ -766,7 +770,6 @@
                 all.type = 'button';
                 all.className = 'all';
                 all.textContent = data.labels.dismissAll;
-                Object.assign(all.style, { background: data.theme.background, color: data.theme.foreground, borderColor: data.theme.border });
                 all.addEventListener('click', () => { for (const item of previews) this.dismissPreview(item.key); this.toggleButton.focus(); });
                 stack.append(all);
             }

From b28f57674f995e0abd89af78e4ff4271532ab9a9 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 16:38:03 +0530
Subject: [PATCH 093/178] fix quick reply character limits

---
 cmd/inboxes.go      |  6 +++++-
 cmd/inboxes_test.go | 27 ++++++++++++++++++++++++++-
 2 files changed, 31 insertions(+), 2 deletions(-)

diff --git a/cmd/inboxes.go b/cmd/inboxes.go
index 88559b8b..6fc132a2 100644
--- a/cmd/inboxes.go
+++ b/cmd/inboxes.go
@@ -7,6 +7,7 @@ import (
 	"strconv"
 	"strings"
 	"time"
+	"unicode/utf8"
 
 	"github.com/abhinavxd/libredesk/internal/envelope"
 	"github.com/abhinavxd/libredesk/internal/httputil"
@@ -360,7 +361,10 @@ func validateQuickReplies(app *App, replies []string) error {
 		return envelope.NewError(envelope.InputError, app.i18n.T("admin.inbox.livechat.quickReplies.limit"), nil)
 	}
 	for _, reply := range replies {
-		if strings.TrimSpace(reply) == "" || len(reply) > 120 {
+		if strings.TrimSpace(reply) == "" {
+			return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.empty", "name", "quick reply"), nil)
+		}
+		if utf8.RuneCountInString(reply) > 120 {
 			return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.maxLength", "max", "120"), nil)
 		}
 	}
diff --git a/cmd/inboxes_test.go b/cmd/inboxes_test.go
index aa58b96c..3145ce3c 100644
--- a/cmd/inboxes_test.go
+++ b/cmd/inboxes_test.go
@@ -1,6 +1,31 @@
 package main
 
-import "testing"
+import (
+	"strings"
+	"testing"
+)
+
+func TestValidateQuickReplies(t *testing.T) {
+	app := newValidatorTestApp(t)
+	tests := []struct {
+		name    string
+		replies []string
+		wantErr bool
+	}{
+		{name: "unicode limit", replies: []string{strings.Repeat("界", 120)}},
+		{name: "unicode over limit", replies: []string{strings.Repeat("界", 121)}, wantErr: true},
+		{name: "blank", replies: []string{"  "}, wantErr: true},
+	}
+
+	for _, tc := range tests {
+		t.Run(tc.name, func(t *testing.T) {
+			err := validateQuickReplies(app, tc.replies)
+			if (err != nil) != tc.wantErr {
+				t.Fatalf("got error %v, want error %v", err, tc.wantErr)
+			}
+		})
+	}
+}
 
 func TestValidateLiveChatSessionDuration(t *testing.T) {
 	app := newValidatorTestApp(t)

From 29847f955f053ce179c6838a0adb59547c2d3690 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 16:38:24 +0530
Subject: [PATCH 094/178] keep campaign visitor sessions identified

---
 cmd/widget_campaign_reply.go | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/cmd/widget_campaign_reply.go b/cmd/widget_campaign_reply.go
index 531e690a..fff13738 100644
--- a/cmd/widget_campaign_reply.go
+++ b/cmd/widget_campaign_reply.go
@@ -53,6 +53,7 @@ func handleWidgetCampaignReply(r *fastglue.Request, req chatInitReq, inbox imode
 			if err != nil {
 				return sendErrorEnvelope(r, err)
 			}
+			visitor = true
 		}
 		if err := canReply(r, conversation); err != nil {
 			return sendErrorEnvelope(r, err)
@@ -67,6 +68,7 @@ func handleWidgetCampaignReply(r *fastglue.Request, req chatInitReq, inbox imode
 			if err != nil {
 				return sendErrorEnvelope(r, err)
 			}
+			visitor = true
 		} else {
 			attrs = saveContactAttrsAndCollectConvoAttrs(app, contact.ID, nil, req.FormData, config)
 		}

From da1d8e01a925aeda55edb150c2e015f1c6b99c6c Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 16:38:47 +0530
Subject: [PATCH 095/178] count unread messages for new conversations

---
 internal/conversation/queries.sql | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/internal/conversation/queries.sql b/internal/conversation/queries.sql
index ba3f323a..4cf3eab4 100644
--- a/internal/conversation/queries.sql
+++ b/internal/conversation/queries.sql
@@ -374,7 +374,7 @@ SELECT
      FROM (
          SELECT 1 FROM conversation_messages unread
          WHERE unread.conversation_id = c.id
-           AND unread.created_at > c.contact_last_seen_at
+           AND unread.created_at > COALESCE(c.contact_last_seen_at, c.created_at)
            AND unread.type = 'outgoing'
            AND unread.private = false
          LIMIT 10
@@ -470,7 +470,7 @@ SELECT
      FROM (
          SELECT 1 FROM conversation_messages unread
          WHERE unread.conversation_id = c.id
-           AND unread.created_at > c.contact_last_seen_at
+           AND unread.created_at > COALESCE(c.contact_last_seen_at, c.created_at)
            AND unread.type = 'outgoing'
            AND unread.private = false
          LIMIT 10

From 4c5ce9c11a794c12521e967068558d472f0ca4d0 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 16:39:49 +0530
Subject: [PATCH 096/178] keep empty campaign previews rendering

---
 .../main/src/features/admin/inbox/LivechatWidgetPreview.vue     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
index d024f0e2..613dba5a 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
@@ -694,7 +694,7 @@ const campaign = computed(() => props.config.preview_campaign || null)
 watch(campaign, (value) => {
   if (value) open.value = false
 })
-const campaignText = computed(() => campaign.value?.message.slice(0, SNIPPET_LENGTH) || '')
+const campaignText = computed(() => campaign.value?.message?.slice(0, SNIPPET_LENGTH) || '')
 const quickReplies = computed(() => {
   const replies = userTypeConfig.value.quick_replies ?? props.config.quick_replies
   if (Array.isArray(replies)) return replies

From 23b4dea6f231477b926645a5c8a90fb01fa51ec8 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 16:39:55 +0530
Subject: [PATCH 097/178] block duplicate handoff submissions

---
 frontend/apps/widget/src/views/ChatView.vue | 1 +
 1 file changed, 1 insertion(+)

diff --git a/frontend/apps/widget/src/views/ChatView.vue b/frontend/apps/widget/src/views/ChatView.vue
index d7f57a2c..b07087d0 100644
--- a/frontend/apps/widget/src/views/ChatView.vue
+++ b/frontend/apps/widget/src/views/ChatView.vue
@@ -130,6 +130,7 @@ const sendSuggestedReply = (reply) => {
 }
 
 const submitHandoffForm = async ({ formData, message }) => {
+  if (isSubmittingHandoffForm.value) return
   isSubmittingHandoffForm.value = true
   errorMessage.value = ''
   try {

From 658e4e00a541db9f154dda6df0aa59ab4664035c Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 16:40:00 +0530
Subject: [PATCH 098/178] discard stale help searches

---
 frontend/apps/widget/src/views/HelpView.vue | 9 +++++----
 1 file changed, 5 insertions(+), 4 deletions(-)

diff --git a/frontend/apps/widget/src/views/HelpView.vue b/frontend/apps/widget/src/views/HelpView.vue
index 34a647a2..ca24af5a 100644
--- a/frontend/apps/widget/src/views/HelpView.vue
+++ b/frontend/apps/widget/src/views/HelpView.vue
@@ -61,7 +61,8 @@ const retry = () => {
 }
 const search = async () => {
   if (busy.value) return
-  if (!help.query.trim()) {
+  const query = help.query.trim()
+  if (!query) {
     help.results = null
     return
   }
@@ -69,11 +70,11 @@ const search = async () => {
   error.value = ''
   const identity = help.identity
   try {
-    const response = await api.searchHelp(help.query.trim(), help.data.locale)
-    if (!valid(identity)) return
+    const response = await api.searchHelp(query, help.data.locale)
+    if (!valid(identity) || help.query.trim() !== query) return
     help.results = response.data.data || []
   } catch {
-    if (valid(identity)) {
+    if (valid(identity) && help.query.trim() === query) {
       error.value = t('widget.helpLoadError')
       help.failed = true
     }

From 8769e92f0b3de997a794b8c3348f9a4f646c4573 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 16:40:47 +0530
Subject: [PATCH 099/178] handle overnight campaign hours

---
 cmd/widget_campaign.go      | 12 +++++++++++-
 cmd/widget_campaign_test.go | 31 +++++++++++++++++++++++++++++++
 2 files changed, 42 insertions(+), 1 deletion(-)
 create mode 100644 cmd/widget_campaign_test.go

diff --git a/cmd/widget_campaign.go b/cmd/widget_campaign.go
index 66704884..1516b22a 100644
--- a/cmd/widget_campaign.go
+++ b/cmd/widget_campaign.go
@@ -189,7 +189,17 @@ func campaignWithinHours(app *App, c proactive.Campaign, now time.Time, loc *tim
 		return false, nil
 	}
 	clock := local.Format("15:04")
-	return clock >= day.Open && clock < day.Close, nil
+	return withinWorkingHours(clock, day), nil
+}
+
+func withinWorkingHours(clock string, day bhmodels.WorkingHours) bool {
+	if day.Open == day.Close {
+		return false
+	}
+	if day.Open < day.Close {
+		return clock >= day.Open && clock < day.Close
+	}
+	return clock >= day.Open || clock < day.Close
 }
 
 func campaignSender(app *App, id int) (umodels.User, error) {
diff --git a/cmd/widget_campaign_test.go b/cmd/widget_campaign_test.go
new file mode 100644
index 00000000..14008e85
--- /dev/null
+++ b/cmd/widget_campaign_test.go
@@ -0,0 +1,31 @@
+package main
+
+import (
+	"testing"
+
+	bhmodels "github.com/abhinavxd/libredesk/internal/business_hours/models"
+)
+
+func TestWithinWorkingHours(t *testing.T) {
+	tests := []struct {
+		name  string
+		clock string
+		day   bhmodels.WorkingHours
+		want  bool
+	}{
+		{name: "normal open", clock: "09:00", day: bhmodels.WorkingHours{Open: "09:00", Close: "17:00"}, want: true},
+		{name: "normal close", clock: "17:00", day: bhmodels.WorkingHours{Open: "09:00", Close: "17:00"}},
+		{name: "overnight evening", clock: "23:00", day: bhmodels.WorkingHours{Open: "22:00", Close: "02:00"}, want: true},
+		{name: "overnight morning", clock: "01:00", day: bhmodels.WorkingHours{Open: "22:00", Close: "02:00"}, want: true},
+		{name: "overnight closed", clock: "12:00", day: bhmodels.WorkingHours{Open: "22:00", Close: "02:00"}},
+		{name: "same time closed", clock: "09:00", day: bhmodels.WorkingHours{Open: "09:00", Close: "09:00"}},
+	}
+
+	for _, tc := range tests {
+		t.Run(tc.name, func(t *testing.T) {
+			if got := withinWorkingHours(tc.clock, tc.day); got != tc.want {
+				t.Fatalf("got %v, want %v", got, tc.want)
+			}
+		})
+	}
+}

From 7848551326d704a5eff639cd5505590e84fbf776 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 18:42:15 +0530
Subject: [PATCH 100/178] fix review findings in widget campaigns and help
 search

---
 cmd/chat.go                                   |  1 +
 cmd/widget_campaign.go                        |  8 +++-
 cmd/widget_help.go                            |  3 ++
 .../features/admin/inbox/WidgetCampaigns.vue  |  9 ++++-
 .../features/admin/inbox/WidgetConditions.vue |  9 ++++-
 .../features/admin/inbox/WidgetHelpConfig.vue |  7 ++--
 .../admin/inbox/livechatFormSchema.js         |  8 ++--
 .../widget/src/components/ChatMessages.vue    |  2 +-
 .../src/composables/useReplyPreviews.js       |  2 +-
 frontend/apps/widget/src/store/proactive.js   |  8 ++--
 frontend/apps/widget/src/views/HelpView.vue   |  6 +--
 schema.sql                                    | 39 ++++++++++---------
 12 files changed, 61 insertions(+), 41 deletions(-)

diff --git a/cmd/chat.go b/cmd/chat.go
index 62f0c9f7..068bad34 100644
--- a/cmd/chat.go
+++ b/cmd/chat.go
@@ -616,6 +616,7 @@ func handleChatSubmitHandoffForm(r *fastglue.Request) error {
 	if !config.PreChatForm.Enabled || !config.PreChatForm.HandoffOnly {
 		return r.SendErrorEnvelope(fasthttp.StatusConflict, app.i18n.T("ai.agent.handoffFormUnavailable"), nil, envelope.ConflictError)
 	}
+	config.PreChatForm.Fields, _ = filterPreChatFormFields(config.PreChatForm.Fields, app)
 	if err := validateRequiredFormFields(req.FormData, config, app); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
diff --git a/cmd/widget_campaign.go b/cmd/widget_campaign.go
index 1516b22a..3dc435c3 100644
--- a/cmd/widget_campaign.go
+++ b/cmd/widget_campaign.go
@@ -144,11 +144,15 @@ func handleCampaignStats(r *fastglue.Request) error {
 	if err != nil || id <= 0 {
 		return sendErrorEnvelope(r, campaignInputError(app))
 	}
-	from, err := time.Parse(time.DateOnly, string(r.RequestCtx.QueryArgs().Peek("from")))
+	loc, err := time.LoadLocation(app.setting.GetAppTimezone())
 	if err != nil {
 		return sendErrorEnvelope(r, campaignInputError(app))
 	}
-	to, err := time.Parse(time.DateOnly, string(r.RequestCtx.QueryArgs().Peek("to")))
+	from, err := time.ParseInLocation(time.DateOnly, string(r.RequestCtx.QueryArgs().Peek("from")), loc)
+	if err != nil {
+		return sendErrorEnvelope(r, campaignInputError(app))
+	}
+	to, err := time.ParseInLocation(time.DateOnly, string(r.RequestCtx.QueryArgs().Peek("to")), loc)
 	if err != nil || to.Before(from) {
 		return sendErrorEnvelope(r, campaignInputError(app))
 	}
diff --git a/cmd/widget_help.go b/cmd/widget_help.go
index ebfcf75c..5c2dde83 100644
--- a/cmd/widget_help.go
+++ b/cmd/widget_help.go
@@ -68,6 +68,9 @@ func handleWidgetHelpSearch(r *fastglue.Request) error {
 		return r.SendEnvelope([]hcmodels.Article{})
 	}
 	query := strings.TrimSpace(string(r.RequestCtx.QueryArgs().Peek("q")))
+	if query == "" {
+		return r.SendEnvelope([]hcmodels.Article{})
+	}
 	articles, err := app.helpcenter.SearchPublishedArticles(helpCenter.Slug, query, resolveQueryLocale(r, helpCenter), publicSearchLimit)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
index aadb73db..0b89bb6f 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
@@ -154,7 +154,14 @@ watch(
 const update = (key, value) => {
   emit(
     'update:modelValue',
-    props.modelValue.map((item) => (item.id === selected.value ? { ...item, [key]: value } : item))
+    props.modelValue.map((item) => {
+      if (item.id !== selected.value) return item
+      const next = { ...item, [key]: value }
+      if (key === 'repeat' && value !== 'interval' && !(next.repeat_hours >= 1)) {
+        next.repeat_hours = defaultCampaign().repeat_hours
+      }
+      return next
+    })
   )
 }
 
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue b/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue
index 251443d1..b1842cc4 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue
@@ -15,7 +15,14 @@ watch(
   },
   { immediate: true, deep: true }
 )
-const update = () => emit('update:modelValue', JSON.parse(JSON.stringify(group.value)))
+const update = () => {
+  const value = JSON.parse(JSON.stringify(group.value))
+  value.rules = value.rules.map((rule) => ({
+    ...rule,
+    value: Array.isArray(rule.value) ? rule.value.join(',') : rule.value
+  }))
+  emit('update:modelValue', value)
+}
 const add = () => {
   group.value.rules.push({
     field: '',
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
index d649f648..98565ebc 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
@@ -76,10 +76,11 @@ const unusedArticles = computed(() =>
       </Select>
     </div>
 
+    <p v-if="failed" role="alert" class="text-sm text-destructive">
+      {{ t('widget.helpLoadError') }}
+    </p>
+
     <template v-if="modelValue.help_center_id">
-      <p v-if="failed" role="alert" class="text-sm text-destructive">
-        {{ t('widget.helpLoadError') }}
-      </p>
 
       <div class="space-y-4">
         <h4 class="text-base font-semibold text-foreground">{{ t('widget.helpPlacement') }}</h4>
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
index ca98edaa..c97aef11 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
@@ -168,12 +168,12 @@ export const createCampaignSchema = (t) =>
       audience: z.enum(['all', 'visitors', 'users']),
       include_urls: z
         .array(z.string().max(2048))
-        .max(20, t('widget.campaignUrlLimit'))
-        .transform((items) => items.map((item) => item.trim()).filter(Boolean)),
+        .transform((items) => items.map((item) => item.trim()).filter(Boolean))
+        .refine((items) => items.length <= 20, t('widget.campaignUrlLimit')),
       exclude_urls: z
         .array(z.string().max(2048))
-        .max(20, t('widget.campaignUrlLimit'))
-        .transform((items) => items.map((item) => item.trim()).filter(Boolean)),
+        .transform((items) => items.map((item) => item.trim()).filter(Boolean))
+        .refine((items) => items.length <= 20, t('widget.campaignUrlLimit')),
       conditions: createWidgetConditionsSchema(t),
       event: z.string().max(128),
       delay_seconds: rangeInteger(t, 0, 86400),
diff --git a/frontend/apps/widget/src/components/ChatMessages.vue b/frontend/apps/widget/src/components/ChatMessages.vue
index 88f14906..05360180 100644
--- a/frontend/apps/widget/src/components/ChatMessages.vue
+++ b/frontend/apps/widget/src/components/ChatMessages.vue
@@ -311,6 +311,7 @@ watch(
     hasUserScrolled.value = false
     nextTick(() => {
       const id = chatStore.previewUnreadUUID
+      chatStore.previewUnreadUUID = null
       const target = id && contentEl.value?.querySelector(`[data-message-uuid="${id}"]`)
       if (target) {
         hasUserScrolled.value = true
@@ -319,7 +320,6 @@ watch(
             messagesContainer.value.getBoundingClientRect().top +
             messagesContainer.value.scrollTop
         )
-        chatStore.previewUnreadUUID = null
       } else scrollToBottom()
     })
     if (widgetStore.isOpen && !chatStore.isLoadingConversation) {
diff --git a/frontend/apps/widget/src/composables/useReplyPreviews.js b/frontend/apps/widget/src/composables/useReplyPreviews.js
index e36ba2f0..4f03dfbd 100644
--- a/frontend/apps/widget/src/composables/useReplyPreviews.js
+++ b/frontend/apps/widget/src/composables/useReplyPreviews.js
@@ -59,7 +59,7 @@ export function useReplyPreviews() {
           }
         })
       const target = parentOrigin()
-      if (!target) return
+      if (!target || target === 'null') return
       window.parent.postMessage(
         {
           type: 'REPLY_PREVIEWS',
diff --git a/frontend/apps/widget/src/store/proactive.js b/frontend/apps/widget/src/store/proactive.js
index 9f9e7760..23c91c8f 100644
--- a/frontend/apps/widget/src/store/proactive.js
+++ b/frontend/apps/widget/src/store/proactive.js
@@ -1,13 +1,12 @@
 import { defineStore } from 'pinia'
-import { ref } from 'vue'
+import { ref, watch } from 'vue'
 import api from '@widget/api/index.js'
 import { useWidgetStore } from '@widget/store/widget.js'
 import { useChatStore } from '@widget/store/chat.js'
 
-const parentOrigin = () => new URLSearchParams(window.location.search).get('parent_origin')
 const postToParent = message => {
-  const target = parentOrigin()
-  if (target) window.parent.postMessage(message, target)
+  const target = new URLSearchParams(window.location.search).get('parent_origin')
+  if (target && target !== 'null') window.parent.postMessage(message, target)
 }
 
 export const useProactiveStore = defineStore('proactive', () => {
@@ -60,6 +59,7 @@ export const useProactiveStore = defineStore('proactive', () => {
     }
     try { await api.campaignEvent({ delivery_id: id, browser_key: browserKey, event: name }) } catch { return false }
   }
+  watch(() => widget.isOpen, open => { if (!open) abandon() })
   const replyPayload = () => pending.value ? { delivery_id: pending.value.id, browser_key: browserKey } : {}
   const replied = () => { pending.value = null; invitation.value = null; postToParent({ type: 'CLEAR_CAMPAIGN' }) }
   return { setSessionKey, setBrowserKey, invitation, pending, next, event, reset, abandon, replyPayload, replied }
diff --git a/frontend/apps/widget/src/views/HelpView.vue b/frontend/apps/widget/src/views/HelpView.vue
index ca24af5a..78241d07 100644
--- a/frontend/apps/widget/src/views/HelpView.vue
+++ b/frontend/apps/widget/src/views/HelpView.vue
@@ -60,7 +60,6 @@ const retry = () => {
   help.load(locale.value)
 }
 const search = async () => {
-  if (busy.value) return
   const query = help.query.trim()
   if (!query) {
     help.results = null
@@ -74,10 +73,7 @@ const search = async () => {
     if (!valid(identity) || help.query.trim() !== query) return
     help.results = response.data.data || []
   } catch {
-    if (valid(identity) && help.query.trim() === query) {
-      error.value = t('widget.helpLoadError')
-      help.failed = true
-    }
+    if (valid(identity) && help.query.trim() === query) error.value = t('widget.helpLoadError')
   } finally {
     busy.value = false
   }
diff --git a/schema.sql b/schema.sql
index 73fb3b52..941bd525 100644
--- a/schema.sql
+++ b/schema.sql
@@ -999,6 +999,26 @@ CREATE TABLE notification_email_queue (
 );
 CREATE INDEX index_notification_email_queue_on_send_at ON notification_email_queue(send_at);
 
+DROP TABLE IF EXISTS widget_campaign_deliveries CASCADE;
+CREATE TABLE widget_campaign_deliveries (
+    id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+    campaign_id UUID NOT NULL,
+    inbox_id INTEGER NOT NULL REFERENCES inboxes(id) ON DELETE CASCADE,
+    browser_key UUID NOT NULL,
+    session_key UUID NOT NULL,
+    contact_id INTEGER REFERENCES users(id) ON DELETE SET NULL,
+    snapshot JSONB NOT NULL,
+    created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+    displayed BOOLEAN NOT NULL DEFAULT FALSE,
+    opened BOOLEAN NOT NULL DEFAULT FALSE,
+    dismissed BOOLEAN NOT NULL DEFAULT FALSE,
+    replied BOOLEAN NOT NULL DEFAULT FALSE,
+    conversation_uuid UUID REFERENCES conversations(uuid) ON DELETE SET NULL
+);
+CREATE INDEX idx_widget_campaign_browser ON widget_campaign_deliveries(inbox_id, browser_key, created_at DESC);
+CREATE INDEX idx_widget_campaign_contact ON widget_campaign_deliveries(inbox_id, contact_id, created_at DESC) WHERE contact_id IS NOT NULL;
+CREATE INDEX idx_widget_campaign_stats ON widget_campaign_deliveries(inbox_id, campaign_id, created_at);
+
 INSERT INTO ai_providers
 ("name", provider, type, config, is_default)
 VALUES
@@ -1326,22 +1346,3 @@ INSERT INTO business_hours ("name", description, is_always_open, hours, holidays
 -- Default SLA policy
 INSERT INTO sla_policies ("name", description, first_response_time, resolution_time, next_response_time, notifications) VALUES
 ('Default', 'Default SLA policy, first response within 1 hour and resolution within 24 hours.', '1h', '24h', NULL, '[]'::jsonb);
-
-CREATE TABLE IF NOT EXISTS widget_campaign_deliveries (
-    id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
-    campaign_id UUID NOT NULL,
-    inbox_id INTEGER NOT NULL REFERENCES inboxes(id) ON DELETE CASCADE,
-    browser_key UUID NOT NULL,
-    session_key UUID NOT NULL,
-    contact_id INTEGER REFERENCES users(id) ON DELETE SET NULL,
-    snapshot JSONB NOT NULL,
-    created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
-    displayed BOOLEAN NOT NULL DEFAULT FALSE,
-    opened BOOLEAN NOT NULL DEFAULT FALSE,
-    dismissed BOOLEAN NOT NULL DEFAULT FALSE,
-    replied BOOLEAN NOT NULL DEFAULT FALSE,
-    conversation_uuid UUID REFERENCES conversations(uuid) ON DELETE SET NULL
-);
-CREATE INDEX IF NOT EXISTS idx_widget_campaign_browser ON widget_campaign_deliveries(inbox_id, browser_key, created_at DESC);
-CREATE INDEX IF NOT EXISTS idx_widget_campaign_contact ON widget_campaign_deliveries(inbox_id, contact_id, created_at DESC) WHERE contact_id IS NOT NULL;
-CREATE INDEX IF NOT EXISTS idx_widget_campaign_stats ON widget_campaign_deliveries(inbox_id, campaign_id, created_at);

From eb14b2724010337332e0937cb9a21792bd0bdef6 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 19:02:01 +0530
Subject: [PATCH 101/178] reset out of range repeat hours and widen campaign
 contact id

---
 frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue | 2 +-
 internal/migrations/v2.10.0.go                                  | 2 +-
 schema.sql                                                      | 2 +-
 3 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
index 0b89bb6f..9f91ca56 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
@@ -157,7 +157,7 @@ const update = (key, value) => {
     props.modelValue.map((item) => {
       if (item.id !== selected.value) return item
       const next = { ...item, [key]: value }
-      if (key === 'repeat' && value !== 'interval' && !(next.repeat_hours >= 1)) {
+      if (key === 'repeat' && value !== 'interval' && !(next.repeat_hours >= 1 && next.repeat_hours <= 8760)) {
         next.repeat_hours = defaultCampaign().repeat_hours
       }
       return next
diff --git a/internal/migrations/v2.10.0.go b/internal/migrations/v2.10.0.go
index 61181a88..579746db 100644
--- a/internal/migrations/v2.10.0.go
+++ b/internal/migrations/v2.10.0.go
@@ -14,7 +14,7 @@ CREATE TABLE IF NOT EXISTS widget_campaign_deliveries (
     inbox_id INTEGER NOT NULL REFERENCES inboxes(id) ON DELETE CASCADE,
     browser_key UUID NOT NULL,
     session_key UUID NOT NULL,
-    contact_id INTEGER REFERENCES users(id) ON DELETE SET NULL,
+    contact_id BIGINT REFERENCES users(id) ON DELETE SET NULL,
     snapshot JSONB NOT NULL,
     created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
     displayed BOOLEAN NOT NULL DEFAULT FALSE,
diff --git a/schema.sql b/schema.sql
index 941bd525..5875eeda 100644
--- a/schema.sql
+++ b/schema.sql
@@ -1006,7 +1006,7 @@ CREATE TABLE widget_campaign_deliveries (
     inbox_id INTEGER NOT NULL REFERENCES inboxes(id) ON DELETE CASCADE,
     browser_key UUID NOT NULL,
     session_key UUID NOT NULL,
-    contact_id INTEGER REFERENCES users(id) ON DELETE SET NULL,
+    contact_id BIGINT REFERENCES users(id) ON DELETE SET NULL,
     snapshot JSONB NOT NULL,
     created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
     displayed BOOLEAN NOT NULL DEFAULT FALSE,

From 6614a77e654f9b5a7ff12372106bac39d331498a Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 19:21:29 +0530
Subject: [PATCH 102/178] reset fractional hidden repeat hours

---
 frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
index 9f91ca56..0f7447c9 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
@@ -157,7 +157,7 @@ const update = (key, value) => {
     props.modelValue.map((item) => {
       if (item.id !== selected.value) return item
       const next = { ...item, [key]: value }
-      if (key === 'repeat' && value !== 'interval' && !(next.repeat_hours >= 1 && next.repeat_hours <= 8760)) {
+      if (key === 'repeat' && value !== 'interval' && !(Number.isInteger(next.repeat_hours) && next.repeat_hours >= 1 && next.repeat_hours <= 8760)) {
         next.repeat_hours = defaultCampaign().repeat_hours
       }
       return next

From 216451647bebd309b400278b9ad254506a1326ea Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 20:07:35 +0530
Subject: [PATCH 103/178] label audience prechat toggle, pin handoff
 conversation, clear dismissed preview timers

---
 .../apps/main/src/features/admin/inbox/PreChatFormConfig.vue | 4 ++--
 frontend/apps/widget/src/views/ChatView.vue                  | 5 +++--
 i18n/en-US.json                                              | 2 ++
 static/widget.js                                             | 2 ++
 4 files changed, 9 insertions(+), 4 deletions(-)

diff --git a/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue b/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
index 503fda57..82cd0787 100644
--- a/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
+++ b/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
@@ -28,8 +28,8 @@
 
       <div class="mt-4 space-y-6">
         <SwitchField
-          :title="$t('admin.inbox.livechat.prechatForm.enabled')"
-          :description="$t('admin.inbox.livechat.prechatForm.enabled.description')"
+          :title="$t('admin.inbox.livechat.prechatForm.audienceEnabled')"
+          :description="$t('admin.inbox.livechat.prechatForm.audienceEnabled.description')"
           :checked="audienceConfig.enabled"
           @update:checked="audienceConfig.enabled = $event"
         />
diff --git a/frontend/apps/widget/src/views/ChatView.vue b/frontend/apps/widget/src/views/ChatView.vue
index b07087d0..630d1ac3 100644
--- a/frontend/apps/widget/src/views/ChatView.vue
+++ b/frontend/apps/widget/src/views/ChatView.vue
@@ -133,9 +133,10 @@ const submitHandoffForm = async ({ formData, message }) => {
   if (isSubmittingHandoffForm.value) return
   isSubmittingHandoffForm.value = true
   errorMessage.value = ''
+  const uuid = chatStore.currentConversation.uuid
   try {
-    await api.submitHandoffForm(chatStore.currentConversation.uuid, formData)
-    chatStore.replaceMessage(chatStore.currentConversation.uuid, message.uuid, {
+    await api.submitHandoffForm(uuid, formData)
+    chatStore.replaceMessage(uuid, message.uuid, {
       ...message,
       meta: { ...message.meta, handoff_form_pending: false }
     })
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 6713c0ab..36c14624 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -387,6 +387,8 @@
   "admin.inbox.livechat.prechatForm.availableFields": "Available custom attributes",
   "admin.inbox.livechat.prechatForm.enabled": "Enable pre-chat form",
   "admin.inbox.livechat.prechatForm.enabled.description": "Show a form to collect information before chat starts",
+  "admin.inbox.livechat.prechatForm.audienceEnabled": "Show form to this audience",
+  "admin.inbox.livechat.prechatForm.audienceEnabled.description": "Ask the selected audience to fill this form",
   "admin.inbox.livechat.prechatForm.fields": "Form fields",
   "admin.inbox.livechat.prechatForm.handoffOnly": "Show only during AI handoff",
   "admin.inbox.livechat.prechatForm.handoffOnly.description": "Skip this form when a chat starts. Show it when the AI needs to transfer the conversation to a human.",
diff --git a/static/widget.js b/static/widget.js
index 1b099555..e8adf757 100644
--- a/static/widget.js
+++ b/static/widget.js
@@ -653,6 +653,8 @@
         }
 
         dismissPreview (key) {
+            clearTimeout(this.previewTimers.get(key));
+            this.previewTimers.delete(key);
             if (this.campaignData?.id === key) {
                 this.postToIframe({ type: 'CAMPAIGN_EVENT', event: 'dismissed', id: key });
                 this.campaignData = null;

From 28b33a1b56f0fb37bf33354c280b43881aabb617 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 20:11:54 +0530
Subject: [PATCH 104/178] insert campaign reply messages in the conversation
 transaction, allow zero cooldown, scope handoff drafts and parent origin

---
 .../features/admin/inbox/WidgetCampaigns.vue  |  6 +--
 .../admin/inbox/livechatFormSchema.js         |  2 +-
 .../admin/inbox/livechatFormSchema.test.js    |  4 +-
 frontend/apps/widget/src/App.vue              |  2 +
 frontend/apps/widget/src/api/index.js         |  7 +--
 .../widget/src/components/PreChatForm.vue     |  5 +-
 frontend/apps/widget/src/store/chat.js        |  2 +
 frontend/apps/widget/src/views/ChatView.vue   |  1 +
 internal/conversation/conversation.go         |  1 -
 internal/conversation/message.go              | 48 ++++++++++++-------
 internal/conversation/proactive.go            | 34 ++++++-------
 internal/conversation/queries.sql             |  3 --
 .../channel/livechat/proactive/proactive.go   |  2 +-
 13 files changed, 67 insertions(+), 50 deletions(-)

diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
index 0f7447c9..24d7c20b 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
@@ -119,9 +119,9 @@ const campaignSectionError = (field) =>
 const cooldownError = computed(() => {
   if (!props.showErrors) return ''
   const value = Number(props.cooldown)
-  return Number.isInteger(value) && value >= 1 && value <= 8760
+  return Number.isInteger(value) && value >= 0 && value <= 8760
     ? ''
-    : t('validation.minmaxNumber', { min: 1, max: 8760 })
+    : t('validation.minmaxNumber', { min: 0, max: 8760 })
 })
 
 const audienceLabel = (item) => t(AUDIENCE_TRANSLATION_KEYS[item.audience])
@@ -273,7 +273,7 @@ onMounted(async () => {
         <Input
           id="campaign-cooldown"
           type="number"
-          min="1"
+          min="0"
           max="8760"
           :model-value="cooldown"
           @update:model-value="emit('update:cooldown', Number($event))"
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
index c97aef11..196fddfc 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
@@ -212,7 +212,7 @@ export const createFormSchema = (t) =>
     linked_email_inbox_id: z.number().nullable().optional(),
     config: z.object({
       campaigns: z.array(createCampaignSchema(t)).max(50).default([]),
-      campaign_cooldown_hours: rangeInteger(t, 1, 8760).default(24),
+      campaign_cooldown_hours: rangeInteger(t, 0, 8760).default(24),
       help: z
         .object({
           help_center_id: z.number().int().min(0),
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
index 22ee7645..9012d08d 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
@@ -269,7 +269,7 @@ describe('Livechat Inbox Form Schema', () => {
             repeat_hours: 0
           }
         ],
-        campaign_cooldown_hours: 0
+        campaign_cooldown_hours: -1
       })
     )
     expect(result.success).toBe(false)
@@ -277,7 +277,7 @@ describe('Livechat Inbox Form Schema', () => {
       'widget.campaignUrlLimit {}',
       'validation.minmaxNumber {"min":0,"max":86400}',
       'validation.minmaxNumber {"min":1,"max":8760}',
-      'validation.minmaxNumber {"min":1,"max":8760}'
+      'validation.minmaxNumber {"min":0,"max":8760}'
     ])
   })
 
diff --git a/frontend/apps/widget/src/App.vue b/frontend/apps/widget/src/App.vue
index 032dd2ad..0b878cc7 100644
--- a/frontend/apps/widget/src/App.vue
+++ b/frontend/apps/widget/src/App.vue
@@ -134,6 +134,7 @@ const setupParentMessageListeners = () => {
         if (widgetStore.currentView === 'help') widgetStore.navigateToHome()
         chatStore.drafts = {}
         chatStore.preChatDraft = {}
+        chatStore.handoffDraft = {}
         chatStore.conversations = null
         chatStore.setCurrentConversation(null)
         try {
@@ -154,6 +155,7 @@ const setupParentMessageListeners = () => {
       proactive.reset()
       chatStore.drafts = {}
       chatStore.preChatDraft = {}
+      chatStore.handoffDraft = {}
       userStore.clearSessionToken()
       chatStore.conversations = null
       chatStore.setCurrentConversation(null)
diff --git a/frontend/apps/widget/src/api/index.js b/frontend/apps/widget/src/api/index.js
index ce290c6d..58a94c24 100644
--- a/frontend/apps/widget/src/api/index.js
+++ b/frontend/apps/widget/src/api/index.js
@@ -4,9 +4,10 @@ let _sessionToken = ''
 let _visitorToken = ''
 
 function postToParent(data) {
-  if (window.parent && window.parent !== window) {
-    window.parent.postMessage(data, '*')
-  }
+  if (!window.parent || window.parent === window) return
+  const target = new URLSearchParams(window.location.search).get('parent_origin')
+  if (!target || target === 'null') return
+  window.parent.postMessage(data, target)
 }
 
 function getInboxIDFromQuery() {
diff --git a/frontend/apps/widget/src/components/PreChatForm.vue b/frontend/apps/widget/src/components/PreChatForm.vue
index 8b7824d4..2d69e925 100644
--- a/frontend/apps/widget/src/components/PreChatForm.vue
+++ b/frontend/apps/widget/src/components/PreChatForm.vue
@@ -340,7 +340,8 @@ const showForm = computed(() => preChatFormEnabled.value && sortedFields.value.l
 const formSchema = computed(() => toTypedSchema(createPreChatFormSchema(t, sortedFields.value)))
 
 // Generate initial values dynamically
-const savedFields = { ...chat.preChatDraft.fields }
+const draft = props.handoffMode ? chat.handoffDraft : chat.preChatDraft
+const savedFields = { ...draft.fields }
 const initialValues = computed(() => {
   const values = {}
   sortedFields.value.forEach((field) => {
@@ -364,7 +365,7 @@ const { handleSubmit, values } = useForm({
 watch(
   values,
   (fields) => {
-    chat.preChatDraft.fields = { ...fields }
+    draft.fields = { ...fields }
   },
   { deep: true }
 )
diff --git a/frontend/apps/widget/src/store/chat.js b/frontend/apps/widget/src/store/chat.js
index a11dea20..897f59a1 100644
--- a/frontend/apps/widget/src/store/chat.js
+++ b/frontend/apps/widget/src/store/chat.js
@@ -11,6 +11,7 @@ export const useChatStore = defineStore('chat', () => {
   const previewUnreadUUID = ref(null)
   const drafts = ref({})
   const preChatDraft = ref({})
+  const handoffDraft = ref({})
   let typingTimeout = null
   const isTyping = ref(false)
   const currentConversation = ref({})
@@ -266,6 +267,7 @@ export const useChatStore = defineStore('chat', () => {
   return {
     drafts,
     preChatDraft,
+    handoffDraft,
     previewUnreadUUID,
     messageCache,
     isTyping,
diff --git a/frontend/apps/widget/src/views/ChatView.vue b/frontend/apps/widget/src/views/ChatView.vue
index 630d1ac3..4b1c830b 100644
--- a/frontend/apps/widget/src/views/ChatView.vue
+++ b/frontend/apps/widget/src/views/ChatView.vue
@@ -140,6 +140,7 @@ const submitHandoffForm = async ({ formData, message }) => {
       ...message,
       meta: { ...message.meta, handoff_form_pending: false }
     })
+    chatStore.handoffDraft = {}
   } catch (error) {
     errorMessage.value = handleHTTPError(error).message
   } finally {
diff --git a/internal/conversation/conversation.go b/internal/conversation/conversation.go
index 2a0de6ac..5ccf1f97 100644
--- a/internal/conversation/conversation.go
+++ b/internal/conversation/conversation.go
@@ -312,7 +312,6 @@ type queries struct {
 	LockCampaignDelivery     *sqlx.Stmt `query:"lock-campaign-delivery"`
 	CompleteCampaignDelivery *sqlx.Stmt `query:"complete-campaign-delivery"`
 	AssignProactiveTeam      *sqlx.Stmt `query:"assign-proactive-team"`
-	RevertCampaignDelivery   *sqlx.Stmt `query:"revert-campaign-delivery"`
 	// Conversation queries.
 	GetConversationUUID                 *sqlx.Stmt `query:"get-conversation-uuid"`
 	GetConversation                     *sqlx.Stmt `query:"get-conversation"`
diff --git a/internal/conversation/message.go b/internal/conversation/message.go
index b31e3a8c..b4ac3f69 100644
--- a/internal/conversation/message.go
+++ b/internal/conversation/message.go
@@ -27,6 +27,7 @@ import (
 	"github.com/abhinavxd/libredesk/internal/stringutil"
 	umodels "github.com/abhinavxd/libredesk/internal/user/models"
 	wmodels "github.com/abhinavxd/libredesk/internal/webhook/models"
+	"github.com/jmoiron/sqlx"
 	"github.com/lib/pq"
 	"github.com/volatiletech/null/v9"
 )
@@ -580,6 +581,29 @@ func (m *Manager) QueueReply(media []mmodels.Media, inboxID, senderID, contactID
 
 // InsertMessage inserts a message and attaches the media to the message.
 func (m *Manager) InsertMessage(message *models.Message) error {
+	tx, err := m.db.Beginx()
+	if err != nil {
+		m.lo.Error("error beginning message insert transaction", "error", err)
+		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	defer tx.Rollback()
+
+	inlineUUIDs, err := m.InsertMessageTx(tx, message)
+	if err != nil {
+		return err
+	}
+
+	if err := tx.Commit(); err != nil {
+		m.lo.Error("error committing message insert transaction", "error", err)
+		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+
+	m.AfterMessageInsert(message, inlineUUIDs)
+	return nil
+}
+
+// InsertMessageTx inserts a message inside the caller's transaction; the caller must run AfterMessageInsert once it commits.
+func (m *Manager) InsertMessageTx(tx *sqlx.Tx, message *models.Message) ([]string, error) {
 	if message.Private {
 		message.Status = models.MessageStatusSent
 	}
@@ -604,28 +628,20 @@ func (m *Manager) InsertMessage(message *models.Message) error {
 		message.TextContent = stringutil.HTML2Text(message.Content)
 	}
 
-	tx, err := m.db.Beginx()
-	if err != nil {
-		m.lo.Error("error beginning message insert transaction", "error", err)
-		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
-	}
-	defer tx.Rollback()
-
 	if err := tx.Stmtx(m.q.InsertMessage).Get(message, message.Type, message.Status, message.ConversationID, message.ConversationUUID, message.Content, message.TextContent, message.SenderID, message.SenderType,
 		message.Private, message.ContentType, message.SourceID, message.Meta); err != nil {
 		m.lo.Error("error inserting message in db", "error", err)
-		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+		return nil, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
 
 	if err := m.mediaStore.LinkMessageMediaTx(tx, message.ID, message.Media, inlineUUIDs); err != nil {
-		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
-	}
-
-	if err := tx.Commit(); err != nil {
-		m.lo.Error("error committing message insert transaction", "error", err)
-		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+		return nil, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
+	return inlineUUIDs, nil
+}
 
+// AfterMessageInsert runs the post-commit side effects of a message insert: participant, last message and broadcast.
+func (m *Manager) AfterMessageInsert(message *models.Message, inlineUUIDs []string) {
 	// Add this user as a participant if not already present.
 	m.addConversationParticipant(message.SenderID, message.ConversationUUID)
 
@@ -669,8 +685,6 @@ func (m *Manager) InsertMessage(message *models.Message) error {
 
 	// Trigger webhook for new message created.
 	m.webhookStore.TriggerEvent(wmodels.EventMessageCreated, message)
-
-	return nil
 }
 
 // RecordAssigneeUserChange records an activity for a user assignee change.
@@ -1183,7 +1197,7 @@ func (m *Manager) uploadMessageAttachments(message *models.Message) error {
 			attachment.Size,
 			null.StringFrom(attachment.Disposition),
 			[]byte("{}"), /** meta **/
-			true,          /** private **/
+			true,         /** private **/
 		)
 		if err != nil {
 			m.lo.Error("failed to upload attachment", "name", attachment.Name, "content_type", attachment.ContentType, "size", attachment.Size, "content_id", contentID, "disposition", attachment.Disposition, "conversation_uuid", message.ConversationUUID, "message_source_id", message.SourceID.String, "error", err)
diff --git a/internal/conversation/proactive.go b/internal/conversation/proactive.go
index ec58b6db..9d8627dc 100644
--- a/internal/conversation/proactive.go
+++ b/internal/conversation/proactive.go
@@ -50,6 +50,22 @@ func (m *Manager) CreateProactiveConversation(delivery proactive.Delivery, conta
 	if _, err := tx.Stmtx(m.q.AssignProactiveTeam).Exec(id, snapshot.TeamID); err != nil {
 		return models.Message{}, m.proactiveError(err)
 	}
+	invitationMeta, _ := json.Marshal(map[string]any{"proactive_sender": snapshot.Sender, "campaign_id": delivery.CampaignID})
+	messages := []models.Message{
+		{Type: models.MessageOutgoing, Status: models.MessageStatusSent, SenderID: snapshot.SenderID, SenderType: models.SenderTypeAgent, Content: snapshot.Message, Meta: invitationMeta},
+		{Type: models.MessageIncoming, Status: models.MessageStatusReceived, SenderID: contactID, SenderType: models.SenderTypeContact, Content: reply},
+	}
+	inlineUUIDs := make([][]string, len(messages))
+	for i := range messages {
+		messages[i].ConversationID = id
+		messages[i].ConversationUUID = uuid
+		messages[i].ContentType = models.ContentTypeText
+		uuids, err := m.InsertMessageTx(tx, &messages[i])
+		if err != nil {
+			return models.Message{}, err
+		}
+		inlineUUIDs[i] = uuids
+	}
 	if _, err := tx.Stmtx(m.q.CompleteCampaignDelivery).Exec(delivery.ID, uuid, contactID); err != nil {
 		return models.Message{}, m.proactiveError(err)
 	}
@@ -59,24 +75,8 @@ func (m *Manager) CreateProactiveConversation(delivery proactive.Delivery, conta
 	if item, err := m.GetConversationListItem(uuid); err == nil {
 		m.BroadcastNewConversation(&item)
 	}
-	invitationMeta, _ := json.Marshal(map[string]any{"proactive_sender": snapshot.Sender, "campaign_id": delivery.CampaignID})
-	messages := []models.Message{
-		{Type: models.MessageOutgoing, Status: models.MessageStatusSent, SenderID: snapshot.SenderID, SenderType: models.SenderTypeAgent, Content: snapshot.Message, Meta: invitationMeta},
-		{Type: models.MessageIncoming, Status: models.MessageStatusReceived, SenderID: contactID, SenderType: models.SenderTypeContact, Content: reply},
-	}
 	for i := range messages {
-		messages[i].ConversationID = id
-		messages[i].ConversationUUID = uuid
-		messages[i].ContentType = models.ContentTypeText
-		if err := m.InsertMessage(&messages[i]); err != nil {
-			if err := m.DeleteConversation(uuid); err != nil {
-				m.lo.Error("error deleting proactive conversation after message insert failure", "conversation_uuid", uuid, "error", err)
-			}
-			if _, err := m.q.RevertCampaignDelivery.Exec(delivery.ID); err != nil {
-				m.lo.Error("error reverting campaign delivery after message insert failure", "delivery_id", delivery.ID, "error", err)
-			}
-			return models.Message{}, err
-		}
+		m.AfterMessageInsert(&messages[i], inlineUUIDs[i])
 	}
 	return messages[1], nil
 }
diff --git a/internal/conversation/queries.sql b/internal/conversation/queries.sql
index 4cf3eab4..cb8a36f4 100644
--- a/internal/conversation/queries.sql
+++ b/internal/conversation/queries.sql
@@ -1139,8 +1139,5 @@ UPDATE widget_campaign_deliveries
 SET conversation_uuid = $2, contact_id = $3, replied = TRUE, opened = TRUE, displayed = TRUE
 WHERE id = $1;
 
--- name: revert-campaign-delivery
-UPDATE widget_campaign_deliveries SET conversation_uuid = NULL, replied = FALSE WHERE id = $1;
-
 -- name: assign-proactive-team
 UPDATE conversations SET assigned_team_id = NULLIF($2, 0) WHERE id = $1;
diff --git a/internal/inbox/channel/livechat/proactive/proactive.go b/internal/inbox/channel/livechat/proactive/proactive.go
index 6375e99f..abd227b8 100644
--- a/internal/inbox/channel/livechat/proactive/proactive.go
+++ b/internal/inbox/channel/livechat/proactive/proactive.go
@@ -123,7 +123,7 @@ func Suppression(c Campaign, ctx Context, history []Delivery, cooldownHours int)
 			}
 			continue
 		}
-		if ctx.Now.Sub(d.CreatedAt) < time.Duration(max(1, cooldownHours))*time.Hour {
+		if cooldownHours > 0 && ctx.Now.Sub(d.CreatedAt) < time.Duration(cooldownHours)*time.Hour {
 			return "cooldown"
 		}
 	}

From 8d99740a41dee31cb10667e5f18364a4bc08c464 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 20:19:52 +0530
Subject: [PATCH 105/178] add custom AI tools to copilot and generate reply
 with an agent approval step

---
 cmd/ai.go                                     | 149 +++++++++--
 cmd/handlers.go                               |   2 +
 frontend/apps/main/src/api/index.js           |   6 +
 .../main/src/features/admin/ai/ToolForm.vue   |  67 ++++-
 .../src/features/conversation/ReplyBox.vue    | 121 ++++++++-
 .../conversation/sidebar/CopilotPanel.vue     | 133 +++++++++-
 frontend/shared-ui/components/SwitchField.vue |  10 +-
 i18n/en-US.json                               |  17 ++
 internal/ai/agent.go                          |  78 +++---
 internal/ai/agent_approval.go                 | 242 ++++++++++++++++++
 internal/ai/agent_approval_test.go            | 131 ++++++++++
 internal/ai/ai.go                             |  15 +-
 internal/ai/copilot.go                        |   8 +-
 internal/ai/models/models.go                  |  48 +++-
 internal/ai/queries.sql                       |  20 +-
 internal/ai/tools.go                          |   8 +-
 internal/ai/toolstore.go                      |  22 +-
 internal/ai/toolstore_test.go                 |   2 +-
 internal/migrations/v2.9.0.go                 |   9 +
 schema.sql                                    |   3 +
 20 files changed, 967 insertions(+), 124 deletions(-)
 create mode 100644 internal/ai/agent_approval.go
 create mode 100644 internal/ai/agent_approval_test.go

diff --git a/cmd/ai.go b/cmd/ai.go
index 999ae50f..0e74be10 100644
--- a/cmd/ai.go
+++ b/cmd/ai.go
@@ -60,6 +60,11 @@ type snippetImportReq struct {
 	URL string `json:"url"`
 }
 
+type aiToolReq struct {
+	aimodels.Tool
+	RequiresAgentApproval *bool `json:"requires_agent_approval"`
+}
+
 // handleAICompletion runs a stored prompt over the supplied content (reply-box actions).
 func handleAICompletion(r *fastglue.Request) error {
 	var (
@@ -214,12 +219,14 @@ func handleGetAITool(r *fastglue.Request) error {
 func handleCreateAITool(r *fastglue.Request) error {
 	var (
 		app = r.Context.(*App)
-		req aimodels.Tool
+		req aiToolReq
 	)
 	if err := r.Decode(&req, "json"); err != nil {
 		return sendErrorEnvelope(r, envelope.NewError(envelope.InputError, app.i18n.T("errors.parsingRequest"), nil))
 	}
-	tool, err := app.ai.CreateTool(req)
+	toolInput := req.Tool
+	toolInput.RequiresAgentApproval = req.RequiresAgentApproval == nil || *req.RequiresAgentApproval
+	tool, err := app.ai.CreateTool(toolInput)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
@@ -229,7 +236,7 @@ func handleCreateAITool(r *fastglue.Request) error {
 func handleUpdateAITool(r *fastglue.Request) error {
 	var (
 		app = r.Context.(*App)
-		req aimodels.Tool
+		req aiToolReq
 	)
 	id, err := strconv.Atoi(r.RequestCtx.UserValue("id").(string))
 	if err != nil {
@@ -238,7 +245,17 @@ func handleUpdateAITool(r *fastglue.Request) error {
 	if err := r.Decode(&req, "json"); err != nil {
 		return sendErrorEnvelope(r, envelope.NewError(envelope.InputError, app.i18n.T("errors.parsingRequest"), nil))
 	}
-	tool, err := app.ai.UpdateTool(id, req)
+	toolInput := req.Tool
+	if req.RequiresAgentApproval == nil {
+		existing, err := app.ai.GetTool(id)
+		if err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+		toolInput.RequiresAgentApproval = existing.RequiresAgentApproval
+	} else {
+		toolInput.RequiresAgentApproval = *req.RequiresAgentApproval
+	}
+	tool, err := app.ai.UpdateTool(id, toolInput)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
@@ -352,14 +369,29 @@ func handleAIGenerateReply(r *fastglue.Request) error {
 		}
 		transcript = conversationTranscript(app, req.ConversationUUID)
 	}
-	resp, err := app.ai.GenerateReply(r.RequestCtx, transcript, req.Instruction, ai.ToolContext{}, generateReplyTools(app, user, conv))
+	toolIDs := []int(nil)
+	tctx := ai.ToolContext{Verified: func() bool { return true }}
+	scope := ai.AgentRunScope{AgentID: auser.ID, Surface: aimodels.ToolInvocationReply}
+	if conv != nil {
+		toolIDs, err = app.ai.GetEnabledGenerateReplyToolIDs()
+		if err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+		tctx = agentToolContext(conv)
+		scope.ConversationID = conv.ID
+		scope.ConversationUUID = conv.UUID
+	}
+	resp, err := app.ai.GenerateReply(r.RequestCtx, transcript, req.Instruction, tctx, generateReplyTools(app, user, conv), toolIDs, scope)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	if strings.TrimSpace(resp) == "" {
+	if resp.Status == aimodels.AgentRunCompleted && strings.TrimSpace(resp.Content) == "" {
 		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.T("ai.emptyResponse"), nil))
 	}
-	return r.SendEnvelope(stringutil.Markdown2HTML(resp))
+	if resp.Status == aimodels.AgentRunCompleted {
+		resp.Content = stringutil.Markdown2HTML(resp.Content)
+	}
+	return r.SendEnvelope(resp)
 }
 
 // handleAISummarizeConversation summarizes a conversation and posts the summary as the requesting agent's private note.
@@ -466,22 +498,48 @@ func handleAICopilot(r *fastglue.Request) error {
 	}
 	history = append(history, aimodels.ChatMessage{Role: aimodels.RoleUser, Content: req.Message})
 
-	convoContext := conversationTranscript(app, req.ConversationUUID)
-	resp, err := app.ai.Copilot(r.RequestCtx, convoContext, history, ai.ToolContext{}, copilotTools(app, user, conv), persona)
+	scope := ai.AgentRunScope{AgentID: auser.ID, ConversationID: conv.ID, ConversationUUID: conv.UUID, Surface: aimodels.ToolInvocationCopilot, UserMessage: req.Message}
+	if _, approval := app.ai.PendingAgentApproval(scope); approval != nil {
+		return sendErrorEnvelope(r, envelope.NewError(envelope.ConflictError, app.i18n.T("ai.toolApprovalPending"), nil))
+	}
+	toolIDs, err := app.ai.GetEnabledCopilotToolIDs()
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	if strings.TrimSpace(resp) == "" {
-		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.T("ai.emptyResponse"), nil))
-	}
-	// Persist the exchange only after a successful reply, so a failed or empty call leaves no orphaned turn.
-	if err := app.ai.SaveCopilotMessage(conv.ID, auser.ID, aimodels.RoleUser, req.Message); err != nil {
+	convoContext := conversationTranscript(app, req.ConversationUUID)
+	resp, err := app.ai.Copilot(r.RequestCtx, convoContext, history, agentToolContext(conv), copilotTools(app, user, conv), persona, toolIDs, scope)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	if err := app.ai.SaveCopilotMessage(conv.ID, auser.ID, aimodels.RoleAssistant, resp); err != nil {
-		app.lo.Error("error saving copilot reply", "error", err)
+	if resp.Status == aimodels.AgentRunCompleted && strings.TrimSpace(resp.Content) == "" {
+		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.T("ai.emptyResponse"), nil))
 	}
-	return r.SendEnvelope(stringutil.Markdown2HTML(resp))
+	if resp.Status == aimodels.AgentRunCompleted {
+		if err := app.ai.SaveCopilotMessage(conv.ID, auser.ID, aimodels.RoleUser, req.Message); err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+		if err := app.ai.SaveCopilotMessage(conv.ID, auser.ID, aimodels.RoleAssistant, resp.Content); err != nil {
+			app.lo.Error("error saving copilot reply", "error", err)
+		}
+		resp.Content = stringutil.Markdown2HTML(resp.Content)
+	}
+	return r.SendEnvelope(resp)
+}
+
+func handleApproveAIToolRun(r *fastglue.Request) error {
+	resp, err := decideAIToolRun(r, true)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(resp)
+}
+
+func handleDeclineAIToolRun(r *fastglue.Request) error {
+	resp, err := decideAIToolRun(r, false)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(resp)
 }
 
 // handleGetCopilotMessages returns the requesting agent's persisted copilot chat for a conversation.
@@ -506,6 +564,13 @@ func handleGetCopilotMessages(r *fastglue.Request) error {
 			msgs[i].Content = stringutil.Markdown2HTML(msgs[i].Content)
 		}
 	}
+	scope := ai.AgentRunScope{AgentID: auser.ID, ConversationID: conv.ID, ConversationUUID: conv.UUID, Surface: aimodels.ToolInvocationCopilot}
+	if userMessage, approval := app.ai.PendingAgentApproval(scope); approval != nil {
+		if userMessage != "" {
+			msgs = append(msgs, aimodels.CopilotMessage{Role: aimodels.RoleUser, Content: userMessage})
+		}
+		msgs = append(msgs, aimodels.CopilotMessage{Role: aimodels.RoleApproval, Approval: approval})
+	}
 	return r.SendEnvelope(msgs)
 }
 
@@ -524,6 +589,7 @@ func handleClearCopilotMessages(r *fastglue.Request) error {
 	if err := app.ai.ClearCopilotMessages(conv.ID, auser.ID); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
+	app.ai.ClearPendingAgentRuns(ai.AgentRunScope{AgentID: auser.ID, ConversationID: conv.ID, ConversationUUID: conv.UUID, Surface: aimodels.ToolInvocationCopilot})
 	return r.SendEnvelope(true)
 }
 
@@ -548,3 +614,52 @@ func conversationTranscript(app *App, uuid string) string {
 	}
 	return cmodels.Transcript(msgs, maxTranscriptMessages)
 }
+
+func decideAIToolRun(r *fastglue.Request, approved bool) (aimodels.AgentRunResult, error) {
+	app := r.Context.(*App)
+	auser := r.RequestCtx.UserValue("user").(amodels.User)
+	runID := r.RequestCtx.UserValue("id").(string)
+	scope, err := app.ai.PendingAgentRunScope(runID, auser.ID)
+	if err != nil {
+		return aimodels.AgentRunResult{}, err
+	}
+	if scope.ConversationUUID != "" {
+		conv, err := enforceAIConversationAccess(r, scope.ConversationUUID)
+		if err != nil {
+			return aimodels.AgentRunResult{}, err
+		}
+		if conv.ID != scope.ConversationID {
+			return aimodels.AgentRunResult{}, envelope.NewError(envelope.PermissionError, app.i18n.T("ai.toolApprovalUnavailable"), nil)
+		}
+	}
+	resp, resumedScope, err := app.ai.ResumeAgentRun(r.RequestCtx, runID, auser.ID, approved)
+	if err != nil {
+		return aimodels.AgentRunResult{}, err
+	}
+	if resp.Status == aimodels.AgentRunCompleted && strings.TrimSpace(resp.Content) == "" {
+		return aimodels.AgentRunResult{}, envelope.NewError(envelope.GeneralError, app.i18n.T("ai.emptyResponse"), nil)
+	}
+	if resp.Status == aimodels.AgentRunCompleted {
+		if resumedScope.Surface == aimodels.ToolInvocationCopilot {
+			if err := app.ai.SaveCopilotMessage(resumedScope.ConversationID, auser.ID, aimodels.RoleUser, resumedScope.UserMessage); err != nil {
+				app.lo.Error("error saving copilot message", "error", err)
+			} else if err := app.ai.SaveCopilotMessage(resumedScope.ConversationID, auser.ID, aimodels.RoleAssistant, resp.Content); err != nil {
+				app.lo.Error("error saving copilot reply", "error", err)
+			}
+		}
+		resp.Content = stringutil.Markdown2HTML(resp.Content)
+	}
+	return resp, nil
+}
+
+func agentToolContext(conv *cmodels.Conversation) ai.ToolContext {
+	return ai.ToolContext{
+		ContactID:         conv.Contact.ID,
+		ContactExternalID: conv.Contact.ExternalUserID.String,
+		ContactType:       conv.Contact.Type,
+		ConversationUUID:  conv.UUID,
+		InboxID:           conv.InboxID,
+		ContactEmail:      func() string { return conv.Contact.Email.String },
+		Verified:          func() bool { return true },
+	}
+}
diff --git a/cmd/handlers.go b/cmd/handlers.go
index bd2fdc1e..b5daf2cd 100644
--- a/cmd/handlers.go
+++ b/cmd/handlers.go
@@ -282,6 +282,8 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 	g.POST("/api/v1/ai/summarize", perm(handleAISummarizeConversation, "messages:write_private"))
 	g.POST("/api/v1/ai/suggest-tags", auth(handleAISuggestTags))
 	g.POST("/api/v1/ai/copilot", auth(handleAICopilot))
+	g.POST("/api/v1/ai/tool-runs/{id}/approve", auth(handleApproveAIToolRun))
+	g.POST("/api/v1/ai/tool-runs/{id}/decline", auth(handleDeclineAIToolRun))
 	g.GET("/api/v1/ai/copilot/messages", auth(handleGetCopilotMessages))
 	g.DELETE("/api/v1/ai/copilot/messages", auth(handleClearCopilotMessages))
 
diff --git a/frontend/apps/main/src/api/index.js b/frontend/apps/main/src/api/index.js
index bab5473b..ad900b3d 100644
--- a/frontend/apps/main/src/api/index.js
+++ b/frontend/apps/main/src/api/index.js
@@ -517,6 +517,10 @@ const aiGenerateReply = (data) => http.post('/api/v1/ai/generate-reply', data, {
 const aiSummarizeConversation = (data) => http.post('/api/v1/ai/summarize', data, { timeout: AI_TIMEOUT })
 const aiSuggestTags = (data) => http.post('/api/v1/ai/suggest-tags', data, { timeout: AI_TIMEOUT })
 const aiCopilot = (data) => http.post('/api/v1/ai/copilot', data, { timeout: AI_TIMEOUT })
+const approveAIToolRun = (id) =>
+  http.post(`/api/v1/ai/tool-runs/${id}/approve`, {}, { timeout: AI_TIMEOUT })
+const declineAIToolRun = (id) =>
+  http.post(`/api/v1/ai/tool-runs/${id}/decline`, {}, { timeout: AI_TIMEOUT })
 const getCopilotMessages = (conversationUUID) =>
   http.get('/api/v1/ai/copilot/messages', { params: { conversation_uuid: conversationUUID } })
 const clearCopilotMessages = (conversationUUID) =>
@@ -818,6 +822,8 @@ export default {
   aiSummarizeConversation,
   aiSuggestTags,
   aiCopilot,
+  approveAIToolRun,
+  declineAIToolRun,
   getCopilotMessages,
   clearCopilotMessages,
   searchConversations,
diff --git a/frontend/apps/main/src/features/admin/ai/ToolForm.vue b/frontend/apps/main/src/features/admin/ai/ToolForm.vue
index 810bdfdc..41e6f64f 100644
--- a/frontend/apps/main/src/features/admin/ai/ToolForm.vue
+++ b/frontend/apps/main/src/features/admin/ai/ToolForm.vue
@@ -31,7 +31,11 @@
         <FormItem class="md:col-span-2">
           <FormLabel>{{ t('globals.terms.url') }}</FormLabel>
           <FormControl>
-            <Input type="text" placeholder="https://api.example.com/orders/lookup" v-bind="componentField" />
+            <Input
+              type="text"
+              placeholder="https://api.example.com/orders/lookup"
+              v-bind="componentField"
+            />
           </FormControl>
           <FormMessage />
         </FormItem>
@@ -119,6 +123,44 @@
       </FormItem>
     </FormField>
 
+    <div class="space-y-5 rounded-lg border border-border p-4">
+      <div>
+        <h3 class="text-sm font-medium text-foreground">{{ t('admin.ai.tool.agentAccess') }}</h3>
+      </div>
+
+      <FormField v-slot="{ componentField, handleChange }" name="copilot_enabled">
+        <FormItem>
+          <SwitchField
+            :title="t('admin.ai.tool.availableInCopilot')"
+            :checked="componentField.modelValue"
+            @update:checked="handleChange"
+          />
+        </FormItem>
+      </FormField>
+
+      <FormField v-slot="{ componentField, handleChange }" name="generate_reply_enabled">
+        <FormItem>
+          <SwitchField
+            :title="t('admin.ai.tool.availableInGenerateReply')"
+            :checked="componentField.modelValue"
+            @update:checked="handleChange"
+          />
+        </FormItem>
+      </FormField>
+
+      <FormField v-slot="{ componentField, handleChange }" name="requires_agent_approval">
+        <FormItem>
+          <SwitchField
+            :title="t('admin.ai.tool.requireAgentApproval')"
+            :description="t('admin.ai.tool.requireAgentApprovalHint')"
+            :checked="componentField.modelValue"
+            :disabled="!hasAgentSurface"
+            @update:checked="handleChange"
+          />
+        </FormItem>
+      </FormField>
+    </div>
+
     <div class="flex justify-end mt-10">
       <Button type="submit" :isLoading="formLoading">
         {{ isEditing ? t('globals.messages.save') : t('globals.messages.create') }}
@@ -156,7 +198,7 @@
 </template>
 
 <script setup>
-import { ref, watch } from 'vue'
+import { computed, ref, watch } from 'vue'
 import { useForm } from 'vee-validate'
 import { toTypedSchema } from '@vee-validate/zod'
 import * as z from 'zod'
@@ -233,7 +275,10 @@ const form = useForm({
         }),
       parameters: z.string().optional(),
       enabled: z.boolean().optional(),
-      requires_verification: z.boolean().default(true)
+      requires_verification: z.boolean(),
+      copilot_enabled: z.boolean(),
+      generate_reply_enabled: z.boolean(),
+      requires_agent_approval: z.boolean()
     })
   ),
   initialValues: {
@@ -244,10 +289,16 @@ const form = useForm({
     headers: [],
     parameters: '',
     enabled: true,
-    requires_verification: true
+    requires_verification: true,
+    copilot_enabled: false,
+    generate_reply_enabled: false,
+    requires_agent_approval: true
   }
 })
 
+const hasAgentSurface = computed(
+  () => form.values.copilot_enabled || form.values.generate_reply_enabled
+)
 const insertParametersExample = () => {
   form.setFieldValue('parameters', parametersPlaceholder, false)
 }
@@ -286,7 +337,10 @@ watch(
             ? JSON.stringify(values.parameters, null, 2)
             : '',
         enabled: values.enabled ?? true,
-        requires_verification: values.requires_verification ?? true
+        requires_verification: values.requires_verification ?? true,
+        copilot_enabled: values.copilot_enabled ?? false,
+        generate_reply_enabled: values.generate_reply_enabled ?? false,
+        requires_agent_approval: values.requires_agent_approval ?? true
       },
       false
     )
@@ -319,6 +373,9 @@ const onSubmit = form.handleSubmit(async (values) => {
       method: values.method || 'POST',
       enabled: !!values.enabled,
       requires_verification: values.requires_verification !== false,
+      copilot_enabled: !!values.copilot_enabled,
+      generate_reply_enabled: !!values.generate_reply_enabled,
+      requires_agent_approval: values.requires_agent_approval !== false,
       auth: { headers },
       parameters
     })
diff --git a/frontend/apps/main/src/features/conversation/ReplyBox.vue b/frontend/apps/main/src/features/conversation/ReplyBox.vue
index 5c7acda6..a8d38146 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBox.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBox.vue
@@ -1,4 +1,43 @@
 <template>
+  <AlertDialog
+    :open="!!pendingToolApproval && pendingToolConversationUUID === currentConversationUUID"
+  >
+    <AlertDialogContent>
+      <AlertDialogHeader>
+        <AlertDialogTitle>{{ $t('ai.toolApprovalTitle') }}</AlertDialogTitle>
+        <AlertDialogDescription as="div" class="space-y-3">
+          <p>
+            <i18n-t keypath="ai.toolApprovalDescription" scope="global">
+              <template #tool
+                ><code class="inline-flex items-center rounded-md border bg-muted px-1.5 py-0.5 font-mono text-xs font-medium text-foreground">{{ pendingToolApproval?.tool_name }}</code></template
+              >
+            </i18n-t>
+          </p>
+          <div class="space-y-1 text-foreground">
+            <p class="text-xs font-medium">{{ $t('ai.toolApprovalArguments') }}</p>
+            <pre
+              class="max-h-60 overflow-auto whitespace-pre-wrap rounded-md bg-muted p-3 text-xs [overflow-wrap:anywhere]"
+              >{{ formatToolArguments(pendingToolApproval?.arguments) }}</pre
+            >
+          </div>
+        </AlertDialogDescription>
+      </AlertDialogHeader>
+      <AlertDialogFooter>
+        <Button
+          type="button"
+          variant="outline"
+          :disabled="isGenerating"
+          @click="resolveGenerateToolApproval(false)"
+        >
+          {{ $t('ai.toolApprovalDecline') }}
+        </Button>
+        <Button type="button" :disabled="isGenerating" @click="resolveGenerateToolApproval(true)">
+          {{ $t('ai.toolApprovalApprove') }}
+        </Button>
+      </AlertDialogFooter>
+    </AlertDialogContent>
+  </AlertDialog>
+
   <AlertDialog :open="showContactEmailWarning" @update:open="showContactEmailWarning = $event">
     <AlertDialogContent>
       <AlertDialogHeader>
@@ -95,7 +134,11 @@
         <Pencil class="shrink-0 text-muted-foreground" />
         <span v-if="draftPreview" class="truncate">{{ draftPreview }}</span>
         <span v-else class="truncate text-muted-foreground">
-          {{ messageType === 'private_note' ? $t('globals.terms.privateNote') : $t('globals.terms.reply') }}
+          {{
+            messageType === 'private_note'
+              ? $t('globals.terms.privateNote')
+              : $t('globals.terms.reply')
+          }}
         </span>
         <span
           v-if="attachmentCount"
@@ -257,18 +300,33 @@ const activeContentRef = () =>
   isEditorFullscreen.value ? fullscreenContentRef.value : replyBoxContentRef.value
 const showContactEmailWarning = ref(false)
 const showMissingTagsWarning = ref(false)
+const pendingToolApproval = ref(null)
+const pendingToolConversationUUID = ref('')
 const deferredStatus = ref(null)
 const mentions = ref([])
 
+watch(currentConversationUUID, (uuid) => {
+  if (pendingToolApproval.value && pendingToolConversationUUID.value !== uuid) {
+    pendingToolApproval.value = null
+    pendingToolConversationUUID.value = ''
+  }
+})
+
 const runAiGeneration = async (requestFn) => {
-  if (isGenerating.value) return
+  if (isGenerating.value || pendingToolApproval.value) return
   const uuid = currentConversationUUID.value
   if (!uuid) return
   isGenerating.value = true
   try {
     const resp = await requestFn(uuid)
     if (uuid !== currentConversationUUID.value) return
-    htmlContent.value = resp.data.data || ''
+    const result = resp.data.data
+    if (result.status === 'approval_required') {
+      pendingToolApproval.value = result.approval
+      pendingToolConversationUUID.value = uuid
+      return
+    }
+    htmlContent.value = result.content || ''
   } catch (error) {
     emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
       variant: 'destructive',
@@ -284,6 +342,47 @@ const handleGenerateReply = () =>
     api.aiGenerateReply({ conversation_uuid: uuid, instruction: textContent.value })
   )
 
+const resolveGenerateToolApproval = async (approved) => {
+  const approval = pendingToolApproval.value
+  const uuid = pendingToolConversationUUID.value
+  if (!approval || isGenerating.value) return
+  isGenerating.value = true
+  try {
+    const resp = approved
+      ? await api.approveAIToolRun(approval.run_id)
+      : await api.declineAIToolRun(approval.run_id)
+    const result = resp.data.data
+    if (uuid !== currentConversationUUID.value) return
+    if (result.status === 'approval_required') {
+      pendingToolApproval.value = result.approval
+      pendingToolConversationUUID.value = uuid
+      return
+    }
+    pendingToolApproval.value = null
+    pendingToolConversationUUID.value = ''
+    htmlContent.value = result.content || ''
+  } catch (error) {
+    if ([404, 409].includes(error?.response?.status)) {
+      pendingToolApproval.value = null
+      pendingToolConversationUUID.value = ''
+    }
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  } finally {
+    isGenerating.value = false
+  }
+}
+
+const formatToolArguments = (argumentsText) => {
+  try {
+    return JSON.stringify(JSON.parse(argumentsText), null, 2)
+  } catch {
+    return argumentsText || ''
+  }
+}
+
 // Copilot's "Insert into reply" replaces the draft with its answer (already HTML from the panel),
 // forcing reply mode so a private note in progress does not silently receive customer-facing text.
 const handleCopilotInsertReply = (html) => {
@@ -330,7 +429,11 @@ const draftPreview = computed(() => textContent.value.trim())
 
 const attachmentCount = computed(() => mediaFiles.value.length + uploadingFiles.value.length)
 
-const processSend = async (skipContactEmailCheck = false, skipMissingTagsCheck = false, statusToSet = null) => {
+const processSend = async (
+  skipContactEmailCheck = false,
+  skipMissingTagsCheck = false,
+  statusToSet = null
+) => {
   let hasMessageSendingErrored = false
   isEditorFullscreen.value = false
 
@@ -342,9 +445,7 @@ const processSend = async (skipContactEmailCheck = false, skipMissingTagsCheck =
 
   if ((isPrivate && !canSendPrivateNote.value) || (!isPrivate && !canSendReply.value)) return
 
-  const currentInbox = inboxStore.inboxes.find(
-    (i) => i.id === conversationStore.current.inbox_id
-  )
+  const currentInbox = inboxStore.inboxes.find((i) => i.id === conversationStore.current.inbox_id)
   if (
     !isPrivate &&
     !skipMissingTagsCheck &&
@@ -519,8 +620,10 @@ watch(
   [loadedMacroID, loadedMacroActions],
   ([id, actions]) => {
     conversationStore.resetMacro(MACRO_CONTEXT.REPLY)
-    if (id > 0) conversationStore.setMacro({ id, actions: [...toRaw(actions)] }, MACRO_CONTEXT.REPLY)
-    else if (actions.length) conversationStore.setMacroActions([...toRaw(actions)], MACRO_CONTEXT.REPLY)
+    if (id > 0)
+      conversationStore.setMacro({ id, actions: [...toRaw(actions)] }, MACRO_CONTEXT.REPLY)
+    else if (actions.length)
+      conversationStore.setMacroActions([...toRaw(actions)], MACRO_CONTEXT.REPLY)
   },
   { deep: true }
 )
diff --git a/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue b/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
index 195d1e80..5a3ab55d 100644
--- a/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
+++ b/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
@@ -9,7 +9,9 @@
         :model-value="selectedAssistantId"
         @update:model-value="persistAssistant"
       >
-        <SelectTrigger class="h-8 w-auto gap-1.5 border-0 shadow-none text-muted-foreground focus:ring-0">
+        <SelectTrigger
+          class="h-8 w-auto gap-1.5 border-0 shadow-none text-muted-foreground focus:ring-0"
+        >
           <SelectValue :placeholder="COPILOT_NAME" />
         </SelectTrigger>
         <SelectContent>
@@ -75,6 +77,51 @@
           :class="msg.isUser ? 'items-end' : 'items-start'"
         >
           <div
+            v-if="msg.approval"
+            class="w-full space-y-3 rounded-lg border border-border bg-card p-3 text-card-foreground"
+            role="group"
+            aria-live="polite"
+            :aria-label="$t('ai.toolApprovalTitle')"
+          >
+            <div class="space-y-1">
+              <p class="text-sm font-medium">{{ $t('ai.toolApprovalTitle') }}</p>
+              <p class="text-xs text-muted-foreground">
+                <i18n-t keypath="ai.toolApprovalDescription" scope="global">
+                  <template #tool
+                    ><code class="inline-flex items-center rounded-md border bg-muted px-1.5 py-0.5 font-mono text-xs font-medium text-foreground">{{ msg.approval.tool_name }}</code></template
+                  >
+                </i18n-t>
+              </p>
+            </div>
+            <div class="space-y-1">
+              <p class="text-xs font-medium">{{ $t('ai.toolApprovalArguments') }}</p>
+              <pre
+                class="max-h-40 overflow-auto whitespace-pre-wrap rounded-md bg-muted p-2 text-xs [overflow-wrap:anywhere]"
+                >{{ formatToolArguments(msg.approval.arguments) }}</pre
+              >
+            </div>
+            <div class="flex flex-wrap justify-end gap-2">
+              <Button
+                type="button"
+                variant="outline"
+                size="sm"
+                :disabled="isThinking"
+                @click="resolveToolApproval(msg.approval, false)"
+              >
+                {{ $t('ai.toolApprovalDecline') }}
+              </Button>
+              <Button
+                type="button"
+                size="sm"
+                :disabled="isThinking"
+                @click="resolveToolApproval(msg.approval, true)"
+              >
+                {{ $t('ai.toolApprovalApprove') }}
+              </Button>
+            </div>
+          </div>
+          <div
+            v-else
             class="rounded-lg px-3 py-2 text-sm [overflow-wrap:anywhere]"
             :class="
               msg.isUser
@@ -85,7 +132,7 @@
             <Letter v-if="!msg.isUser" :html="msg.content" class="native-html" />
             <template v-else>{{ msg.content }}</template>
           </div>
-          <div v-if="!msg.isUser && msg.content" class="flex gap-0.5">
+          <div v-if="!msg.isUser && !msg.approval && msg.content" class="flex gap-0.5">
             <Tooltip>
               <TooltipTrigger as-child>
                 <Button
@@ -150,7 +197,10 @@
       >
         <Textarea
           v-model="input"
-          :placeholder="$t('copilot.placeholder')"
+          :placeholder="
+            hasPendingApproval ? $t('ai.toolApprovalPendingInput') : $t('copilot.placeholder')
+          "
+          :disabled="hasPendingApproval"
           rows="2"
           class="min-h-[44px] resize-none border-0 bg-transparent shadow-none focus-visible:ring-0"
           @keydown.enter.exact.prevent="send"
@@ -198,10 +248,7 @@ const { t } = useI18n()
 const canSendReply = computed(() => userStore.can(perms.MESSAGES_WRITE))
 const canSendPrivateNote = computed(() => userStore.can(perms.MESSAGES_WRITE_PRIVATE))
 
-const presets = computed(() => [
-  t('copilot.preset.summarize'),
-  t('copilot.preset.customerAsking')
-])
+const presets = computed(() => [t('copilot.preset.summarize'), t('copilot.preset.customerAsking')])
 
 // Chat history lives in the store keyed by conversation uuid so it survives tab
 // switches (this panel unmounts) and never leaks across conversations.
@@ -215,6 +262,7 @@ const input = ref('')
 // block the panel after the agent switches to another.
 const thinkingByUUID = ref({})
 const isThinking = computed(() => !!thinkingByUUID.value[conversationStore.current?.uuid || ''])
+const hasPendingApproval = computed(() => messages.value.some((message) => !!message.approval))
 const scrollRef = ref(null)
 
 // Persona selection is global per agent (a stored assistant whose instructions Copilot borrows for
@@ -269,7 +317,11 @@ const hydrate = async (uuid) => {
   try {
     const resp = await api.getCopilotMessages(uuid)
     if (rev !== revision(uuid) || copilotStore.getMessages(uuid).length > 0) return
-    const loaded = (resp.data.data || []).map((m) => ({ role: m.role, content: m.content }))
+    const loaded = (resp.data.data || []).map((m) => ({
+      role: m.role,
+      content: m.content,
+      approval: m.approval
+    }))
     if (loaded.length) {
       copilotStore.setMessages(uuid, loaded)
       await scrollToBottom()
@@ -295,12 +347,15 @@ const scrollToBottom = async () => {
 
 const send = async (preset) => {
   const text = (typeof preset === 'string' ? preset : input.value).trim()
-  if (!text || isThinking.value) return
+  if (!text || isThinking.value || hasPendingApproval.value) return
 
   const uuid = conversationStore.current?.uuid || ''
   if (!uuid) return
   const rev = revision(uuid)
-  copilotStore.setMessages(uuid, [...copilotStore.getMessages(uuid), { role: 'user', content: text }])
+  copilotStore.setMessages(uuid, [
+    ...copilotStore.getMessages(uuid),
+    { role: 'user', content: text }
+  ])
   input.value = ''
   thinkingByUUID.value[uuid] = true
   await scrollToBottom()
@@ -310,10 +365,12 @@ const send = async (preset) => {
     if (selectedAssistantId.value > 0) payload.assistant_id = selectedAssistantId.value
     const resp = await api.aiCopilot(payload)
     if (rev !== revision(uuid)) return
-    copilotStore.setMessages(uuid, [
-      ...copilotStore.getMessages(uuid),
-      { role: 'assistant', content: resp.data.data || '' }
-    ])
+    const result = resp.data.data
+    const message =
+      result.status === 'approval_required'
+        ? { role: 'approval', approval: result.approval }
+        : { role: 'assistant', content: result.content || '' }
+    copilotStore.setMessages(uuid, [...copilotStore.getMessages(uuid), message])
   } catch (error) {
     // A rejected persona (deleted or disabled since selection) comes back as an input error; fall back
     // to the default Copilot so the next send works.
@@ -330,6 +387,54 @@ const send = async (preset) => {
   }
 }
 
+const resolveToolApproval = async (approval, approved) => {
+  const uuid = conversationStore.current?.uuid || ''
+  if (!uuid || isThinking.value) return
+  const rev = revision(uuid)
+  thinkingByUUID.value[uuid] = true
+  try {
+    const resp = approved
+      ? await api.approveAIToolRun(approval.run_id)
+      : await api.declineAIToolRun(approval.run_id)
+    if (rev !== revision(uuid)) return
+    const result = resp.data.data
+    const replacement =
+      result.status === 'approval_required'
+        ? { role: 'approval', approval: result.approval }
+        : { role: 'assistant', content: result.content || '' }
+    copilotStore.setMessages(
+      uuid,
+      copilotStore
+        .getMessages(uuid)
+        .map((message) => (message.approval?.run_id === approval.run_id ? replacement : message))
+    )
+  } catch (error) {
+    if ([404, 409].includes(error?.response?.status)) {
+      copilotStore.setMessages(
+        uuid,
+        copilotStore
+          .getMessages(uuid)
+          .filter((message) => message.approval?.run_id !== approval.run_id)
+      )
+    }
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  } finally {
+    delete thinkingByUUID.value[uuid]
+    await scrollToBottom()
+  }
+}
+
+const formatToolArguments = (argumentsText) => {
+  try {
+    return JSON.stringify(JSON.parse(argumentsText), null, 2)
+  } catch {
+    return argumentsText
+  }
+}
+
 const copyAnswer = async (content) => {
   try {
     await navigator.clipboard.writeText(getTextFromHTML(content))
diff --git a/frontend/shared-ui/components/SwitchField.vue b/frontend/shared-ui/components/SwitchField.vue
index 02718dfa..5dd6a082 100644
--- a/frontend/shared-ui/components/SwitchField.vue
+++ b/frontend/shared-ui/components/SwitchField.vue
@@ -1,5 +1,6 @@
 <script setup>
 import { Switch } from '@shared-ui/components/ui/switch'
+import { useId } from 'vue'
 
 defineProps({
   title: { type: String, default: '' },
@@ -9,18 +10,23 @@ defineProps({
 })
 
 defineEmits(['update:checked'])
+
+const titleId = useId()
+const descriptionId = useId()
 </script>
 
 <template>
   <div class="space-y-2">
-    <p class="text-sm font-medium text-foreground">{{ title }}</p>
+    <p :id="titleId" class="text-sm font-medium text-foreground">{{ title }}</p>
     <div class="flex items-center gap-3">
       <Switch
         :checked="checked"
         :disabled="disabled"
+        :aria-labelledby="titleId"
+        :aria-describedby="description ? descriptionId : undefined"
         @update:checked="$emit('update:checked', $event)"
       />
-      <p class="text-sm text-muted-foreground">{{ description }}</p>
+      <p :id="descriptionId" class="text-sm text-muted-foreground">{{ description }}</p>
     </div>
   </div>
 </template>
diff --git a/i18n/en-US.json b/i18n/en-US.json
index d8904399..6de71e61 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -188,6 +188,11 @@
   "admin.ai.tool.turnOffVerificationEndpoint": "If the tool accesses sensitive data or performs actions, your endpoint must authenticate the customer itself. Every request carries an X-Libredesk-Contact-Verified header.",
   "admin.ai.tool.keepVerificationOn": "Keep authentication on",
   "admin.ai.tool.turnOffVerification": "Turn off",
+  "admin.ai.tool.agentAccess": "Agent access",
+  "admin.ai.tool.availableInCopilot": "Available in Copilot",
+  "admin.ai.tool.availableInGenerateReply": "Available in Generate Reply",
+  "admin.ai.tool.requireAgentApproval": "Require agent approval",
+  "admin.ai.tool.requireAgentApprovalHint": "The tool pauses before it runs. The agent must review its arguments and approve or decline it.",
   "admin.ai.snippet.new": "New snippet",
   "admin.ai.snippet.edit": "Edit snippet",
   "admin.ai.snippet.deleteConfirmation": "This will permanently delete the snippet.",
@@ -596,6 +601,18 @@
   "ai.assistantUnavailable": "The selected assistant is unavailable. It may have been removed or disabled. Pick another assistant or use the default Copilot.",
   "ai.noTagsConfigured": "No tags exist yet. Tag suggestions need an existing tag list to choose from. Ask an admin to create tags first.",
   "ai.tagSuggestEmptyConversation": "There are no messages to suggest tags from yet.",
+  "ai.toolApprovalExpired": "This tool request is no longer available. Run the AI action again to create a new request.",
+  "ai.toolApprovalPending": "A tool request is waiting for approval. Approve or decline it before sending another Copilot message.",
+  "ai.toolApprovalUnavailable": "This tool request cannot be approved for this conversation. Run the AI action again to create a new request.",
+  "ai.toolChangedBeforeApproval": "This tool changed after approval was requested and was not run. Run the AI action again to review the current tool.",
+  "ai.toolApprovalTitle": "Review tool request",
+  "ai.toolApprovalDescription": "The AI wants to run {tool}. Review the arguments before allowing it.",
+  "ai.toolApprovalArguments": "Arguments",
+  "ai.toolApprovalApprove": "Approve and run",
+  "ai.toolApprovalDecline": "Decline",
+  "ai.toolRanResponseFailed": "The tool request finished, but the AI could not complete its response. Check the external system before running it again.",
+  "ai.toolDeclinedResponseFailed": "The tool was declined, but the AI could not complete its response. Run the AI action again if you still need a reply.",
+  "ai.toolApprovalPendingInput": "Approve or decline the pending tool request first",
   "auth.backToLogin": "Back to login",
   "auth.checkEmailForReset": "Check your email for the password reset link.",
   "auth.confirmPassword": "Confirm password",
diff --git a/internal/ai/agent.go b/internal/ai/agent.go
index 949415ad..bf205992 100644
--- a/internal/ai/agent.go
+++ b/internal/ai/agent.go
@@ -5,7 +5,6 @@ import (
 	"strings"
 
 	"github.com/abhinavxd/libredesk/internal/ai/models"
-	"github.com/abhinavxd/libredesk/internal/envelope"
 )
 
 const defaultMaxSteps = 5
@@ -17,13 +16,34 @@ func (m *Manager) RunAgent(ctx context.Context, systemPrompt string, history []m
 
 // RunAgentWithTools runs the tool-calling loop; allowedToolIDs restricts custom tools to that set (empty loads none), appendWorkspaceInstructions folds the workspace admin instructions into the system prompt.
 func (m *Manager) RunAgentWithTools(ctx context.Context, systemPrompt string, history []models.ChatMessage, maxSteps int, tctx ToolContext, allowedToolIDs []int, appendWorkspaceInstructions, includeBuiltinSearch bool, extra []Tool) (string, error) {
+	run, err := m.newAgentRun(systemPrompt, history, maxSteps, tctx, allowedToolIDs, appendWorkspaceInstructions, includeBuiltinSearch, extra, AgentRunScope{}, false)
+	if err != nil {
+		return "", err
+	}
+	res, err := m.continueAgentRun(ctx, run)
+	if err != nil {
+		return "", err
+	}
+	return res.Content, nil
+}
+
+// RunAgentWithApprovals runs the tool-calling loop for agent surfaces; a custom tool flagged for approval pauses the run until the agent approves or declines it.
+func (m *Manager) RunAgentWithApprovals(ctx context.Context, systemPrompt string, history []models.ChatMessage, maxSteps int, tctx ToolContext, allowedToolIDs []int, extra []Tool, scope AgentRunScope) (models.AgentRunResult, error) {
+	run, err := m.newAgentRun(systemPrompt, history, maxSteps, tctx, allowedToolIDs, true, true, extra, scope, true)
+	if err != nil {
+		return models.AgentRunResult{}, err
+	}
+	return m.continueAgentRun(ctx, run)
+}
+
+func (m *Manager) newAgentRun(systemPrompt string, history []models.ChatMessage, maxSteps int, tctx ToolContext, allowedToolIDs []int, appendWorkspaceInstructions, includeBuiltinSearch bool, extra []Tool, scope AgentRunScope, approvals bool) (*pendingAgentRun, error) {
 	if maxSteps <= 0 {
 		maxSteps = defaultMaxSteps
 	}
 
 	cfg, err := m.getProviderConfig(models.ProviderTypeCompletion)
 	if err != nil {
-		return "", err
+		return nil, err
 	}
 	client := NewOpenAIClient(cfg, m.lo, m.providerHTTPClient)
 	if instructions := strings.TrimSpace(cfg.Instructions); appendWorkspaceInstructions && instructions != "" {
@@ -35,10 +55,10 @@ func (m *Manager) RunAgentWithTools(ctx context.Context, systemPrompt string, hi
 
 	registry, defs, err := m.buildToolRegistry(tctx, allowedToolIDs, includeBuiltinSearch, extra)
 	if err != nil {
-		return "", err
+		return nil, err
 	}
 
-	messages := make([]models.ChatMessage, 0, len(history)+2)
+	messages := make([]models.ChatMessage, 0, len(history)+1)
 	if systemPrompt != "" {
 		messages = append(messages, models.ChatMessage{Role: models.RoleSystem, Content: systemPrompt})
 	}
@@ -55,47 +75,15 @@ func (m *Manager) RunAgentWithTools(ctx context.Context, systemPrompt string, hi
 	m.lo.Debug("ai run starting", "model", cfg.Model, "vision", cfg.Vision, "max_steps", maxSteps, "history_messages", len(history), "images", imageCount, "tools", len(defs), "tool_names", strings.Join(toolNames, ","))
 	m.lo.Debug("ai run system prompt", "prompt", systemPrompt)
 
-	for step := 0; step < maxSteps; step++ {
-		m.lo.Debug("ai run step", "step", step, "messages", len(messages))
-		res, err := m.chatCompletion(ctx, client, models.ChatCompletionPayload{Messages: messages, Tools: defs})
-		if err != nil {
-			return "", err
-		}
-		m.lo.Debug("ai run model response", "step", step, "content_len", len(res.Content), "tool_calls", len(res.ToolCalls), "content", res.Content, "prompt_tokens", res.Usage.PromptTokens, "completion_tokens", res.Usage.CompletionTokens)
-
-		if len(res.ToolCalls) == 0 {
-			m.lo.Debug("ai run final answer", "answer", res.Content)
-			return stripCodeFence(res.Content), nil
-		}
-
-		messages = append(messages, models.ChatMessage{
-			Role:      models.RoleAssistant,
-			Content:   res.Content,
-			ToolCalls: res.ToolCalls,
-		})
-
-		for _, tc := range res.ToolCalls {
-			result := m.executeToolCall(ctx, registry, tc)
-			messages = append(messages, models.ChatMessage{
-				Role:       models.RoleTool,
-				ToolCallID: tc.ID,
-				Name:       tc.Function.Name,
-				Content:    result,
-			})
-		}
-	}
-
-	// Step budget exhausted, force a final answer by omitting tools.
-	res, err := m.chatCompletion(ctx, client, models.ChatCompletionPayload{Messages: messages})
-	if err != nil {
-		return "", err
-	}
-	if strings.TrimSpace(res.Content) == "" {
-		m.lo.Warn("agent produced no answer within the step budget", "max_steps", maxSteps)
-		return "", envelope.NewError(envelope.GeneralError, m.i18n.T("ai.noAnswerWithinSteps"), nil)
-	}
-	m.lo.Debug("ai run final answer", "answer", res.Content, "forced", true)
-	return stripCodeFence(res.Content), nil
+	return &pendingAgentRun{
+		Scope:       scope,
+		Client:      client,
+		Definitions: defs,
+		Registry:    registry,
+		Messages:    messages,
+		MaxSteps:    maxSteps,
+		Approvals:   approvals,
+	}, nil
 }
 
 func (m *Manager) executeToolCall(ctx context.Context, registry map[string]Tool, tc models.ToolCall) string {
diff --git a/internal/ai/agent_approval.go b/internal/ai/agent_approval.go
new file mode 100644
index 00000000..9adae8b0
--- /dev/null
+++ b/internal/ai/agent_approval.go
@@ -0,0 +1,242 @@
+package ai
+
+import (
+	"context"
+	"strings"
+	"time"
+
+	"github.com/abhinavxd/libredesk/internal/ai/models"
+	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/google/uuid"
+)
+
+const pendingAgentRunTTL = 10 * time.Minute
+
+type approvalTool interface {
+	Tool
+	approvalRequired() bool
+	toolID() int
+	toolUpdatedAt() time.Time
+}
+
+type AgentRunScope struct {
+	AgentID          int
+	ConversationID   int
+	ConversationUUID string
+	Surface          string
+	UserMessage      string
+}
+
+type pendingAgentRun struct {
+	ID            string
+	Scope         AgentRunScope
+	Client        ProviderClient
+	Definitions   []models.ToolDef
+	Registry      map[string]Tool
+	Messages      []models.ChatMessage
+	ToolCalls     []models.ToolCall
+	NextToolCall  int
+	Step          int
+	MaxSteps      int
+	ToolID        int
+	ToolUpdatedAt time.Time
+	CreatedAt     time.Time
+	ExpiresAt     time.Time
+	// Approvals is off for customer-facing runs: no agent is present to approve a tool call.
+	Approvals bool
+}
+
+func (m *Manager) ResumeAgentRun(ctx context.Context, runID string, agentID int, approved bool) (models.AgentRunResult, AgentRunScope, error) {
+	run, err := m.claimAgentRun(runID, agentID)
+	if err != nil {
+		return models.AgentRunResult{}, AgentRunScope{}, err
+	}
+	scope := run.Scope
+	toolCall := run.ToolCalls[run.NextToolCall]
+	result := "The agent declined this tool call."
+	m.lo.Info("agent reviewed custom tool call", "run_id", runID, "agent_id", agentID, "conversation_uuid", run.Scope.ConversationUUID, "surface", run.Scope.Surface, "tool", toolCall.Function.Name, "approved", approved)
+	if approved {
+		if err := m.validateApprovedTool(run); err != nil {
+			return models.AgentRunResult{}, scope, err
+		}
+		result = m.executeToolCall(ctx, run.Registry, toolCall)
+	}
+	m.appendToolResult(run, toolCall, result)
+	run.NextToolCall++
+
+	response, err := m.continueAgentRun(ctx, run)
+	if err != nil {
+		m.lo.Error("error completing agent run after tool decision", "run_id", runID, "agent_id", agentID, "tool", toolCall.Function.Name, "approved", approved, "error", err)
+		messageKey := "ai.toolDeclinedResponseFailed"
+		if approved {
+			messageKey = "ai.toolRanResponseFailed"
+		}
+		return completedAgentRun(m.i18n.T(messageKey)), scope, nil
+	}
+	return response, scope, err
+}
+
+func (m *Manager) PendingAgentRunScope(runID string, agentID int) (AgentRunScope, error) {
+	m.pendingRunMu.Lock()
+	defer m.pendingRunMu.Unlock()
+	m.deleteExpiredAgentRunsLocked(time.Now())
+	run, ok := m.pendingRuns[runID]
+	if !ok {
+		return AgentRunScope{}, envelope.NewError(envelope.NotFoundError, m.i18n.T("ai.toolApprovalExpired"), nil)
+	}
+	if run.Scope.AgentID != agentID {
+		return AgentRunScope{}, envelope.NewError(envelope.PermissionError, m.i18n.T("ai.toolApprovalUnavailable"), nil)
+	}
+	return run.Scope, nil
+}
+
+func (m *Manager) PendingAgentApproval(scope AgentRunScope) (string, *models.ToolApproval) {
+	m.pendingRunMu.Lock()
+	defer m.pendingRunMu.Unlock()
+	m.deleteExpiredAgentRunsLocked(time.Now())
+	var newest *pendingAgentRun
+	for _, run := range m.pendingRuns {
+		if !sameAgentRunScope(run.Scope, scope) || (newest != nil && !run.CreatedAt.After(newest.CreatedAt)) {
+			continue
+		}
+		newest = run
+	}
+	if newest == nil {
+		return "", nil
+	}
+	return newest.Scope.UserMessage, agentRunApproval(newest)
+}
+
+func (m *Manager) ClearPendingAgentRuns(scope AgentRunScope) {
+	m.pendingRunMu.Lock()
+	defer m.pendingRunMu.Unlock()
+	for id, run := range m.pendingRuns {
+		if sameAgentRunScope(run.Scope, scope) {
+			delete(m.pendingRuns, id)
+		}
+	}
+}
+
+func (m *Manager) continueAgentRun(ctx context.Context, run *pendingAgentRun) (models.AgentRunResult, error) {
+	if result := m.processAgentToolCalls(ctx, run); result != nil {
+		return *result, nil
+	}
+	for run.Step < run.MaxSteps {
+		m.lo.Debug("ai run step", "step", run.Step, "messages", len(run.Messages))
+		res, err := m.chatCompletion(ctx, run.Client, models.ChatCompletionPayload{Messages: run.Messages, Tools: run.Definitions})
+		if err != nil {
+			return models.AgentRunResult{}, err
+		}
+		m.lo.Debug("ai run model response", "step", run.Step, "content_len", len(res.Content), "tool_calls", len(res.ToolCalls), "content", res.Content, "prompt_tokens", res.Usage.PromptTokens, "completion_tokens", res.Usage.CompletionTokens)
+		if len(res.ToolCalls) == 0 {
+			m.lo.Debug("ai run final answer", "answer", res.Content)
+			return completedAgentRun(res.Content), nil
+		}
+		run.Messages = append(run.Messages, models.ChatMessage{Role: models.RoleAssistant, Content: res.Content, ToolCalls: res.ToolCalls})
+		run.ToolCalls = res.ToolCalls
+		run.NextToolCall = 0
+		run.Step++
+		if result := m.processAgentToolCalls(ctx, run); result != nil {
+			return *result, nil
+		}
+	}
+
+	res, err := m.chatCompletion(ctx, run.Client, models.ChatCompletionPayload{Messages: run.Messages})
+	if err != nil {
+		return models.AgentRunResult{}, err
+	}
+	if strings.TrimSpace(res.Content) == "" {
+		m.lo.Warn("agent produced no answer within the step budget", "max_steps", run.MaxSteps)
+		return models.AgentRunResult{}, envelope.NewError(envelope.GeneralError, m.i18n.T("ai.noAnswerWithinSteps"), nil)
+	}
+	m.lo.Debug("ai run final answer", "answer", res.Content, "forced", true)
+	return completedAgentRun(res.Content), nil
+}
+
+func (m *Manager) processAgentToolCalls(ctx context.Context, run *pendingAgentRun) *models.AgentRunResult {
+	for run.NextToolCall < len(run.ToolCalls) {
+		toolCall := run.ToolCalls[run.NextToolCall]
+		if run.Approvals {
+			if customTool, ok := run.Registry[toolCall.Function.Name].(approvalTool); ok && customTool.approvalRequired() {
+				run.ID = uuid.NewString()
+				run.ToolID = customTool.toolID()
+				run.ToolUpdatedAt = customTool.toolUpdatedAt()
+				run.CreatedAt = time.Now()
+				run.ExpiresAt = run.CreatedAt.Add(pendingAgentRunTTL)
+				m.storeAgentRun(run)
+				return &models.AgentRunResult{Status: models.AgentRunApprovalRequired, Approval: agentRunApproval(run)}
+			}
+		}
+		m.appendToolResult(run, toolCall, m.executeToolCall(ctx, run.Registry, toolCall))
+		run.NextToolCall++
+	}
+	run.ToolCalls = nil
+	return nil
+}
+
+func (m *Manager) appendToolResult(run *pendingAgentRun, toolCall models.ToolCall, result string) {
+	run.Messages = append(run.Messages, models.ChatMessage{
+		Role:       models.RoleTool,
+		ToolCallID: toolCall.ID,
+		Name:       toolCall.Function.Name,
+		Content:    result,
+	})
+}
+
+func (m *Manager) storeAgentRun(run *pendingAgentRun) {
+	m.pendingRunMu.Lock()
+	defer m.pendingRunMu.Unlock()
+	m.deleteExpiredAgentRunsLocked(time.Now())
+	m.pendingRuns[run.ID] = run
+}
+
+func (m *Manager) claimAgentRun(runID string, agentID int) (*pendingAgentRun, error) {
+	m.pendingRunMu.Lock()
+	defer m.pendingRunMu.Unlock()
+	now := time.Now()
+	m.deleteExpiredAgentRunsLocked(now)
+	run, ok := m.pendingRuns[runID]
+	if !ok {
+		return nil, envelope.NewError(envelope.NotFoundError, m.i18n.T("ai.toolApprovalExpired"), nil)
+	}
+	if run.Scope.AgentID != agentID {
+		return nil, envelope.NewError(envelope.PermissionError, m.i18n.T("ai.toolApprovalUnavailable"), nil)
+	}
+	delete(m.pendingRuns, runID)
+	return run, nil
+}
+
+func (m *Manager) validateApprovedTool(run *pendingAgentRun) error {
+	tool, err := m.GetTool(run.ToolID)
+	if err != nil || !tool.Enabled || tool.Name != run.ToolCalls[run.NextToolCall].Function.Name || !tool.UpdatedAt.Equal(run.ToolUpdatedAt) {
+		return envelope.NewError(envelope.ConflictError, m.i18n.T("ai.toolChangedBeforeApproval"), nil)
+	}
+	if run.Scope.Surface == models.ToolInvocationCopilot && !tool.CopilotEnabled {
+		return envelope.NewError(envelope.ConflictError, m.i18n.T("ai.toolChangedBeforeApproval"), nil)
+	}
+	if run.Scope.Surface == models.ToolInvocationReply && !tool.GenerateReplyEnabled {
+		return envelope.NewError(envelope.ConflictError, m.i18n.T("ai.toolChangedBeforeApproval"), nil)
+	}
+	return nil
+}
+
+func (m *Manager) deleteExpiredAgentRunsLocked(now time.Time) {
+	for id, run := range m.pendingRuns {
+		if !run.ExpiresAt.After(now) {
+			delete(m.pendingRuns, id)
+		}
+	}
+}
+
+func completedAgentRun(content string) models.AgentRunResult {
+	return models.AgentRunResult{Status: models.AgentRunCompleted, Content: stripCodeFence(content)}
+}
+
+func agentRunApproval(run *pendingAgentRun) *models.ToolApproval {
+	toolCall := run.ToolCalls[run.NextToolCall]
+	return &models.ToolApproval{RunID: run.ID, ToolName: toolCall.Function.Name, Arguments: toolCall.Function.Arguments}
+}
+
+func sameAgentRunScope(a, b AgentRunScope) bool {
+	return a.AgentID == b.AgentID && a.ConversationID == b.ConversationID && a.ConversationUUID == b.ConversationUUID && a.Surface == b.Surface
+}
diff --git a/internal/ai/agent_approval_test.go b/internal/ai/agent_approval_test.go
new file mode 100644
index 00000000..f67d5884
--- /dev/null
+++ b/internal/ai/agent_approval_test.go
@@ -0,0 +1,131 @@
+package ai
+
+import (
+	"context"
+	"errors"
+	"testing"
+	"time"
+
+	"github.com/abhinavxd/libredesk/internal/ai/models"
+	"github.com/jmoiron/sqlx/types"
+)
+
+type approvalTestProvider struct {
+	responses []models.ChatCompletionResult
+	calls     int
+	failAt    int
+}
+
+type approvalTestTool struct {
+	executions int
+}
+
+func (p *approvalTestProvider) SendPrompt(context.Context, models.PromptPayload) (string, error) {
+	return "", nil
+}
+
+func (p *approvalTestProvider) SendChatCompletion(context.Context, models.ChatCompletionPayload) (models.ChatCompletionResult, error) {
+	p.calls++
+	if p.calls == p.failAt {
+		return models.ChatCompletionResult{}, errors.New("provider unavailable")
+	}
+	response := p.responses[0]
+	p.responses = p.responses[1:]
+	return response, nil
+}
+
+func (p *approvalTestProvider) GetEmbeddings(context.Context, string) ([]float32, error) {
+	return nil, nil
+}
+
+func (p *approvalTestProvider) GetEmbeddingsBatch(context.Context, []string) ([][]float32, error) {
+	return nil, nil
+}
+
+func (t *approvalTestTool) Name() string { return "update_balance" }
+
+func (t *approvalTestTool) Description() string { return "Updates a balance." }
+
+func (t *approvalTestTool) Parameters() types.JSONText { return types.JSONText(`{"type":"object"}`) }
+
+func (t *approvalTestTool) Execute(context.Context, string) (string, error) {
+	t.executions++
+	return "updated", nil
+}
+
+func TestAgentToolDeclineResumesWithoutExecution(t *testing.T) {
+	m := newTestManager(t)
+	tool := &approvalTestTool{}
+	provider := &approvalTestProvider{responses: []models.ChatCompletionResult{
+		{ToolCalls: []models.ToolCall{{ID: "call-1", Type: "function", Function: models.ToolCallFunction{Name: tool.Name(), Arguments: `{"amount":100}`}}}},
+		{Content: "No changes were made."},
+	}}
+	run := &pendingAgentRun{
+		Scope:     AgentRunScope{AgentID: 7, ConversationID: 9, ConversationUUID: "conversation-1", Surface: models.ToolInvocationCopilot},
+		Client:    provider,
+		Registry:  map[string]Tool{tool.Name(): tool},
+		MaxSteps:  5,
+		Approvals: true,
+	}
+
+	result, err := m.continueAgentRun(t.Context(), run)
+	if err != nil {
+		t.Fatalf("continue run: %v", err)
+	}
+	if result.Status != models.AgentRunApprovalRequired || result.Approval == nil {
+		t.Fatalf("expected approval request, got %#v", result)
+	}
+	if tool.executions != 0 {
+		t.Fatalf("tool executed before approval: %d", tool.executions)
+	}
+
+	result, _, err = m.ResumeAgentRun(t.Context(), result.Approval.RunID, 7, false)
+	if err != nil {
+		t.Fatalf("decline run: %v", err)
+	}
+	if result.Status != models.AgentRunCompleted || result.Content != "No changes were made." {
+		t.Fatalf("unexpected completed result: %#v", result)
+	}
+	if tool.executions != 0 {
+		t.Fatalf("declined tool executed: %d", tool.executions)
+	}
+	if _, _, err := m.ResumeAgentRun(t.Context(), run.ID, 7, false); err == nil {
+		t.Fatal("expected a second decision to fail")
+	}
+}
+
+func TestAgentToolDecisionIsFinalWhenFollowUpFails(t *testing.T) {
+	m := newTestManager(t)
+	tool := &approvalTestTool{}
+	provider := &approvalTestProvider{
+		responses: []models.ChatCompletionResult{
+			{ToolCalls: []models.ToolCall{{ID: "call-1", Type: "function", Function: models.ToolCallFunction{Name: tool.Name(), Arguments: `{}`}}}},
+		},
+		failAt: 2,
+	}
+	run := &pendingAgentRun{
+		Scope:     AgentRunScope{AgentID: 7, ConversationID: 9, ConversationUUID: "conversation-1", Surface: models.ToolInvocationCopilot},
+		Client:    provider,
+		Registry:  map[string]Tool{tool.Name(): tool},
+		MaxSteps:  5,
+		Approvals: true,
+	}
+
+	result, err := m.continueAgentRun(t.Context(), run)
+	if err != nil {
+		t.Fatalf("continue run: %v", err)
+	}
+	result, _, err = m.ResumeAgentRun(t.Context(), result.Approval.RunID, 7, false)
+	if err != nil {
+		t.Fatalf("decline run: %v", err)
+	}
+	if result.Status != models.AgentRunCompleted {
+		t.Fatalf("expected a final result, got %#v", result)
+	}
+}
+
+func (t *approvalTestTool) approvalRequired() bool { return true }
+
+func (t *approvalTestTool) toolID() int { return 1 }
+
+func (t *approvalTestTool) toolUpdatedAt() time.Time { return time.Unix(1, 0) }
diff --git a/internal/ai/ai.go b/internal/ai/ai.go
index b1a320b5..a76681e7 100644
--- a/internal/ai/ai.go
+++ b/internal/ai/ai.go
@@ -60,11 +60,13 @@ type Manager struct {
 	chunkCfg      stringutil.ChunkConfig
 	index         *embeddingIndex
 	// indexReady is closed once the boot-time index load finishes; Search blocks on it.
-	indexReady  chan struct{}
-	reindexMu   sync.Mutex
-	reconcileMu sync.Mutex
-	genMu       sync.Mutex
-	gen         map[genKey]uint64
+	indexReady   chan struct{}
+	reindexMu    sync.Mutex
+	reconcileMu  sync.Mutex
+	genMu        sync.Mutex
+	gen          map[genKey]uint64
+	pendingRunMu sync.Mutex
+	pendingRuns  map[string]*pendingAgentRun
 	// tagGen is bumped on every tag vector purge; an in-flight tag reindex only commits if its gen is still current.
 	tagGen atomic.Uint64
 	// embedSem caps concurrent background embed jobs.
@@ -123,6 +125,8 @@ type queries struct {
 	GetTools                     *sqlx.Stmt `query:"get-tools"`
 	GetTool                      *sqlx.Stmt `query:"get-tool"`
 	GetEnabledToolsByIDs         *sqlx.Stmt `query:"get-enabled-tools-by-ids"`
+	GetEnabledCopilotToolIDs     *sqlx.Stmt `query:"get-enabled-copilot-tool-ids"`
+	GetEnabledGenerateToolIDs    *sqlx.Stmt `query:"get-enabled-generate-reply-tool-ids"`
 	GetToolAuth                  *sqlx.Stmt `query:"get-tool-auth"`
 	InsertTool                   *sqlx.Stmt `query:"insert-tool"`
 	UpdateTool                   *sqlx.Stmt `query:"update-tool"`
@@ -150,6 +154,7 @@ func New(opts Opts) (*Manager, error) {
 		index:         newEmbeddingIndex(),
 		indexReady:    make(chan struct{}),
 		gen:           make(map[genKey]uint64),
+		pendingRuns:   make(map[string]*pendingAgentRun),
 		embedSem:      make(chan struct{}, maxConcurrentEmbeds),
 		httpClient: &http.Client{
 			Timeout:   20 * time.Second,
diff --git a/internal/ai/copilot.go b/internal/ai/copilot.go
index 4bfe0fe1..ae311261 100644
--- a/internal/ai/copilot.go
+++ b/internal/ai/copilot.go
@@ -41,7 +41,7 @@ To answer questions about the customer's history or other tickets, use the tools
 )
 
 // GenerateReply drafts a reply to a conversation using the agentic loop (tools included).
-func (m *Manager) GenerateReply(ctx context.Context, transcript, instruction string, tctx ToolContext, extra []Tool) (string, error) {
+func (m *Manager) GenerateReply(ctx context.Context, transcript, instruction string, tctx ToolContext, extra []Tool, allowedToolIDs []int, scope AgentRunScope) (models.AgentRunResult, error) {
 	var user strings.Builder
 	if strings.TrimSpace(transcript) != "" {
 		fmt.Fprintf(&user, "Conversation so far:\n%s\n\n", transcript)
@@ -56,11 +56,11 @@ func (m *Manager) GenerateReply(ctx context.Context, transcript, instruction str
 	if len(extra) > 0 {
 		systemPrompt += "\n\n" + replyDraftHistoryToolsPrompt
 	}
-	return m.RunAgentWithTools(ctx, systemPrompt, history, defaultMaxSteps, tctx, nil, true, true, extra)
+	return m.RunAgentWithApprovals(ctx, systemPrompt, history, defaultMaxSteps, tctx, allowedToolIDs, extra, scope)
 }
 
 // Copilot answers an agent's chat message; persona borrows an assistant's voice without changing the tool set.
-func (m *Manager) Copilot(ctx context.Context, conversationContext string, history []models.ChatMessage, tctx ToolContext, extra []Tool, persona string) (string, error) {
+func (m *Manager) Copilot(ctx context.Context, conversationContext string, history []models.ChatMessage, tctx ToolContext, extra []Tool, persona string, allowedToolIDs []int, scope AgentRunScope) (models.AgentRunResult, error) {
 	msgs := make([]models.ChatMessage, 0, len(history)+1)
 	if strings.TrimSpace(conversationContext) != "" {
 		msgs = append(msgs, models.ChatMessage{
@@ -78,7 +78,7 @@ func (m *Manager) Copilot(ctx context.Context, conversationContext string, histo
 	if strings.TrimSpace(persona) != "" {
 		systemPrompt += "\n\nPersona from the selected assistant - apply it to how you write, but keep the tools and rules above unchanged:\n" + persona
 	}
-	return m.RunAgentWithTools(ctx, systemPrompt, msgs, defaultMaxSteps, tctx, nil, true, true, extra)
+	return m.RunAgentWithApprovals(ctx, systemPrompt, msgs, defaultMaxSteps, tctx, allowedToolIDs, extra, scope)
 }
 
 // Summarize produces a short handover summary of a conversation transcript.
diff --git a/internal/ai/models/models.go b/internal/ai/models/models.go
index cd4cde37..39b47f22 100644
--- a/internal/ai/models/models.go
+++ b/internal/ai/models/models.go
@@ -15,6 +15,8 @@ const (
 	RoleUser      = "user"
 	RoleAssistant = "assistant"
 	RoleTool      = "tool"
+	// RoleApproval is a synthetic copilot turn carrying a pending tool approval; it is never persisted.
+	RoleApproval = "approval"
 
 	ProviderTypeCompletion = "completion"
 	ProviderTypeEmbedding  = "embedding"
@@ -30,6 +32,12 @@ const (
 	KnowledgeSourceManual       = "manual"
 	KnowledgeSourceConversation = "conversation"
 	KnowledgeSourceURL          = "url"
+
+	ToolInvocationCopilot = "copilot"
+	ToolInvocationReply   = "generate_reply"
+
+	AgentRunCompleted        = "completed"
+	AgentRunApprovalRequired = "approval_required"
 )
 
 // Provider is a row in ai_providers (one per type: completion / embedding).
@@ -102,20 +110,35 @@ type HelpArticleItem struct {
 
 // Tool is a custom, admin-defined HTTP tool the assistant can call.
 type Tool struct {
-	ID          int            `db:"id" json:"id"`
-	CreatedAt   time.Time      `db:"created_at" json:"created_at"`
-	UpdatedAt   time.Time      `db:"updated_at" json:"updated_at"`
-	Name        string         `db:"name" json:"name"`
-	Description string         `db:"description" json:"description"`
-	URL         string         `db:"url" json:"url"`
-	Method      string         `db:"method" json:"method"`
-	Auth        types.JSONText `db:"auth" json:"auth"`
-	Parameters  types.JSONText `db:"parameters" json:"parameters"`
-	Enabled     bool           `db:"enabled" json:"enabled"`
+	ID                    int            `db:"id" json:"id"`
+	CreatedAt             time.Time      `db:"created_at" json:"created_at"`
+	UpdatedAt             time.Time      `db:"updated_at" json:"updated_at"`
+	Name                  string         `db:"name" json:"name"`
+	Description           string         `db:"description" json:"description"`
+	URL                   string         `db:"url" json:"url"`
+	Method                string         `db:"method" json:"method"`
+	Auth                  types.JSONText `db:"auth" json:"auth"`
+	Parameters            types.JSONText `db:"parameters" json:"parameters"`
+	Enabled               bool           `db:"enabled" json:"enabled"`
+	CopilotEnabled        bool           `db:"copilot_enabled" json:"copilot_enabled"`
+	GenerateReplyEnabled  bool           `db:"generate_reply_enabled" json:"generate_reply_enabled"`
+	RequiresAgentApproval bool           `db:"requires_agent_approval" json:"requires_agent_approval"`
 	// RequiresVerification fails closed: a flagged tool is blocked until the contact is verified for the conversation.
 	RequiresVerification bool `db:"requires_verification" json:"requires_verification"`
 }
 
+type ToolApproval struct {
+	RunID     string `json:"run_id"`
+	ToolName  string `json:"tool_name"`
+	Arguments string `json:"arguments"`
+}
+
+type AgentRunResult struct {
+	Status   string        `json:"status"`
+	Content  string        `json:"content,omitempty"`
+	Approval *ToolApproval `json:"approval,omitempty"`
+}
+
 // ToolAuth is the decoded ai_tools.auth JSONB: headers injected on every request.
 type ToolAuth struct {
 	Headers []ToolAuthHeader `json:"headers"`
@@ -171,8 +194,9 @@ type ChatImage struct {
 
 // CopilotMessage is one persisted turn of an agent's copilot chat on a conversation.
 type CopilotMessage struct {
-	Role    string `db:"role" json:"role"`
-	Content string `db:"content" json:"content"`
+	Role     string        `db:"role" json:"role"`
+	Content  string        `db:"content" json:"content"`
+	Approval *ToolApproval `db:"-" json:"approval,omitempty"`
 }
 
 // MarshalJSON emits plain string content when there are no images, or the OpenAI multimodal
diff --git a/internal/ai/queries.sql b/internal/ai/queries.sql
index c3534403..142f09f1 100644
--- a/internal/ai/queries.sql
+++ b/internal/ai/queries.sql
@@ -57,7 +57,7 @@ WITH RECURSIVE published_collections AS (
 SELECT a.id, a.title, a.content, a.status, a.ai_enabled, a.embedded_fingerprint,
     a.collection_id IN (SELECT id FROM published_collections) AS is_reachable
 FROM help_articles a
-WHERE (a.status = 'published' AND a.ai_enabled) OR a.embedded_fingerprint <> '';
+WHERE (a.status = 'published' AND a.ai_enabled) OR a.embedded_fingerprint != '';
 
 -- name: get-embeddable-help-article
 WITH RECURSIVE published_collections AS (
@@ -103,23 +103,29 @@ SELECT id, name FROM tags ORDER BY id;
 SELECT id, source_type, source_id, chunk_text, embedding, dimensions FROM embeddings;
 
 -- name: get-tools
-SELECT id, created_at, updated_at, name, description, url, method, auth, parameters, enabled, requires_verification FROM ai_tools ORDER BY updated_at DESC;
+SELECT id, created_at, updated_at, name, description, url, method, auth, parameters, enabled, requires_verification, copilot_enabled, generate_reply_enabled, requires_agent_approval FROM ai_tools ORDER BY updated_at DESC;
 
 -- name: get-enabled-tools-by-ids
-SELECT id, created_at, updated_at, name, description, url, method, auth, parameters, enabled, requires_verification FROM ai_tools WHERE enabled = true AND id = ANY($1);
+SELECT id, created_at, updated_at, name, description, url, method, auth, parameters, enabled, requires_verification, copilot_enabled, generate_reply_enabled, requires_agent_approval FROM ai_tools WHERE enabled = true AND id = ANY($1);
+
+-- name: get-enabled-copilot-tool-ids
+SELECT id FROM ai_tools WHERE enabled = true AND copilot_enabled = true ORDER BY id;
+
+-- name: get-enabled-generate-reply-tool-ids
+SELECT id FROM ai_tools WHERE enabled = true AND generate_reply_enabled = true ORDER BY id;
 
 -- name: get-tool
-SELECT id, created_at, updated_at, name, description, url, method, auth, parameters, enabled, requires_verification FROM ai_tools WHERE id = $1;
+SELECT id, created_at, updated_at, name, description, url, method, auth, parameters, enabled, requires_verification, copilot_enabled, generate_reply_enabled, requires_agent_approval FROM ai_tools WHERE id = $1;
 
 -- name: get-tool-auth
 SELECT auth FROM ai_tools WHERE id = $1;
 
 -- name: insert-tool
-INSERT INTO ai_tools (name, description, url, method, auth, parameters, enabled, requires_verification)
-VALUES ($1, $2, $3, $4, $5, $6, $7, $8) RETURNING *;
+INSERT INTO ai_tools (name, description, url, method, auth, parameters, enabled, requires_verification, copilot_enabled, generate_reply_enabled, requires_agent_approval)
+VALUES ($1, $2, $3, $4, $5, $6, $7, $8, $9, $10, $11) RETURNING *;
 
 -- name: update-tool
-UPDATE ai_tools SET name = $2, description = $3, url = $4, method = $5, auth = $6, parameters = $7, enabled = $8, requires_verification = $9, updated_at = now()
+UPDATE ai_tools SET name = $2, description = $3, url = $4, method = $5, auth = $6, parameters = $7, enabled = $8, requires_verification = $9, copilot_enabled = $10, generate_reply_enabled = $11, requires_agent_approval = $12, updated_at = now()
 WHERE id = $1 RETURNING *;
 
 -- name: delete-tool
diff --git a/internal/ai/tools.go b/internal/ai/tools.go
index 89819ba5..cc8c6799 100644
--- a/internal/ai/tools.go
+++ b/internal/ai/tools.go
@@ -11,6 +11,7 @@ import (
 	"regexp"
 	"strconv"
 	"strings"
+	"time"
 
 	"github.com/abhinavxd/libredesk/internal/ai/models"
 	"github.com/abhinavxd/libredesk/internal/crypto"
@@ -175,6 +176,12 @@ func (t *httpTool) Parameters() types.JSONText {
 	return t.tool.Parameters
 }
 
+func (t *httpTool) approvalRequired() bool { return t.tool.RequiresAgentApproval }
+
+func (t *httpTool) toolID() int { return t.tool.ID }
+
+func (t *httpTool) toolUpdatedAt() time.Time { return t.tool.UpdatedAt }
+
 func (t *httpTool) Execute(ctx context.Context, args string) (string, error) {
 	if t.tool.RequiresVerification && !t.tctx.verified() {
 		t.lo.Debug("custom tool blocked, contact not verified", "tool", t.tool.Name)
@@ -260,7 +267,6 @@ func (t *httpTool) Execute(ctx context.Context, args string) (string, error) {
 	if t.tctx.InboxID != 0 {
 		req.Header.Set("X-Libredesk-Inbox-Id", strconv.Itoa(t.tctx.InboxID))
 	}
-
 	resp, err := t.client.Do(req)
 	if err != nil {
 		t.lo.Error("error calling custom tool", "tool", t.tool.Name, "error", err)
diff --git a/internal/ai/toolstore.go b/internal/ai/toolstore.go
index 6d5e00d9..5f90429e 100644
--- a/internal/ai/toolstore.go
+++ b/internal/ai/toolstore.go
@@ -53,6 +53,24 @@ func (m *Manager) GetEnabledToolsByIDs(ids []int) ([]models.Tool, error) {
 	return tools, nil
 }
 
+func (m *Manager) GetEnabledCopilotToolIDs() ([]int, error) {
+	ids := make([]int, 0)
+	if err := m.q.GetEnabledCopilotToolIDs.Select(&ids); err != nil {
+		m.lo.Error("error fetching Copilot tool ids", "error", err)
+		return nil, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return ids, nil
+}
+
+func (m *Manager) GetEnabledGenerateReplyToolIDs() ([]int, error) {
+	ids := make([]int, 0)
+	if err := m.q.GetEnabledGenerateToolIDs.Select(&ids); err != nil {
+		m.lo.Error("error fetching Generate Reply tool ids", "error", err)
+		return nil, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return ids, nil
+}
+
 func (m *Manager) CreateTool(t models.Tool) (models.Tool, error) {
 	if err := m.validateToolInput(&t); err != nil {
 		return t, err
@@ -63,7 +81,7 @@ func (m *Manager) CreateTool(t models.Tool) (models.Tool, error) {
 	}
 	params := toolParametersOrEmpty(t)
 	var created models.Tool
-	if err := m.q.InsertTool.Get(&created, t.Name, t.Description, t.URL, t.Method, auth, params, t.Enabled, t.RequiresVerification); err != nil {
+	if err := m.q.InsertTool.Get(&created, t.Name, t.Description, t.URL, t.Method, auth, params, t.Enabled, t.RequiresVerification, t.CopilotEnabled, t.GenerateReplyEnabled, t.RequiresAgentApproval); err != nil {
 		m.lo.Error("error creating tool", "error", err)
 		return created, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
@@ -89,7 +107,7 @@ func (m *Manager) UpdateTool(id int, t models.Tool) (models.Tool, error) {
 	}
 	params := toolParametersOrEmpty(t)
 	var updated models.Tool
-	if err := m.q.UpdateTool.Get(&updated, id, t.Name, t.Description, t.URL, t.Method, auth, params, t.Enabled, t.RequiresVerification); err != nil {
+	if err := m.q.UpdateTool.Get(&updated, id, t.Name, t.Description, t.URL, t.Method, auth, params, t.Enabled, t.RequiresVerification, t.CopilotEnabled, t.GenerateReplyEnabled, t.RequiresAgentApproval); err != nil {
 		if err == sql.ErrNoRows {
 			return updated, envelope.NewError(envelope.NotFoundError, m.i18n.T("globals.messages.notFound"), nil)
 		}
diff --git a/internal/ai/toolstore_test.go b/internal/ai/toolstore_test.go
index 2f411fec..d3404a92 100644
--- a/internal/ai/toolstore_test.go
+++ b/internal/ai/toolstore_test.go
@@ -23,7 +23,7 @@ func newTestManager(t *testing.T) *Manager {
 		t.Fatalf("i18n init: %v", err)
 	}
 	lo := logf.New(logf.Opts{})
-	return &Manager{lo: &lo, i18n: tr, encryptionKey: testEncryptionKey}
+	return &Manager{lo: &lo, i18n: tr, encryptionKey: testEncryptionKey, pendingRuns: make(map[string]*pendingAgentRun)}
 }
 
 func decodeToolAuth(t *testing.T, raw types.JSONText) models.ToolAuth {
diff --git a/internal/migrations/v2.9.0.go b/internal/migrations/v2.9.0.go
index 406df15b..3ceb2943 100644
--- a/internal/migrations/v2.9.0.go
+++ b/internal/migrations/v2.9.0.go
@@ -20,6 +20,15 @@ var notificationTypesV2_9_0 = []string{
 }
 
 func V2_9_0(db *sqlx.DB, fs stuffbin.FileSystem, ko *koanf.Koanf) error {
+	if _, err := db.Exec(`ALTER TABLE ai_tools ADD COLUMN IF NOT EXISTS copilot_enabled BOOLEAN NOT NULL DEFAULT false;`); err != nil {
+		return err
+	}
+	if _, err := db.Exec(`ALTER TABLE ai_tools ADD COLUMN IF NOT EXISTS generate_reply_enabled BOOLEAN NOT NULL DEFAULT false;`); err != nil {
+		return err
+	}
+	if _, err := db.Exec(`ALTER TABLE ai_tools ADD COLUMN IF NOT EXISTS requires_agent_approval BOOLEAN NOT NULL DEFAULT true;`); err != nil {
+		return err
+	}
 	if _, err := db.Exec(`
 		UPDATE roles
 		SET permissions = array_append(permissions, 'messages:write_private')
diff --git a/schema.sql b/schema.sql
index fc510c63..dfe0a8b9 100644
--- a/schema.sql
+++ b/schema.sql
@@ -775,6 +775,9 @@ CREATE TABLE ai_tools (
 	parameters JSONB NOT NULL DEFAULT '{}',
 	enabled BOOLEAN NOT NULL DEFAULT true,
 	requires_verification BOOLEAN NOT NULL DEFAULT true,
+	copilot_enabled BOOLEAN NOT NULL DEFAULT false,
+	generate_reply_enabled BOOLEAN NOT NULL DEFAULT false,
+	requires_agent_approval BOOLEAN NOT NULL DEFAULT true,
 	CONSTRAINT constraint_ai_tools_on_name CHECK (name ~ '^[a-zA-Z0-9_-]+$' AND length(name) <= 64)
 );
 

From aac97e3baf0a2d450b00a0210772cdeca4762eaf Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 20:44:21 +0530
Subject: [PATCH 106/178] reject a second AI tool run while one waits for
 approval

---
 cmd/ai.go                          |  3 ---
 i18n/en-US.json                    |  2 +-
 internal/ai/agent_approval.go      | 32 +++++++++++++++++++++++-------
 internal/ai/agent_approval_test.go | 27 +++++++++++++++++++++++++
 4 files changed, 53 insertions(+), 11 deletions(-)

diff --git a/cmd/ai.go b/cmd/ai.go
index 0e74be10..e6bb47fa 100644
--- a/cmd/ai.go
+++ b/cmd/ai.go
@@ -499,9 +499,6 @@ func handleAICopilot(r *fastglue.Request) error {
 	history = append(history, aimodels.ChatMessage{Role: aimodels.RoleUser, Content: req.Message})
 
 	scope := ai.AgentRunScope{AgentID: auser.ID, ConversationID: conv.ID, ConversationUUID: conv.UUID, Surface: aimodels.ToolInvocationCopilot, UserMessage: req.Message}
-	if _, approval := app.ai.PendingAgentApproval(scope); approval != nil {
-		return sendErrorEnvelope(r, envelope.NewError(envelope.ConflictError, app.i18n.T("ai.toolApprovalPending"), nil))
-	}
 	toolIDs, err := app.ai.GetEnabledCopilotToolIDs()
 	if err != nil {
 		return sendErrorEnvelope(r, err)
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 6de71e61..9eda9e75 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -602,7 +602,7 @@
   "ai.noTagsConfigured": "No tags exist yet. Tag suggestions need an existing tag list to choose from. Ask an admin to create tags first.",
   "ai.tagSuggestEmptyConversation": "There are no messages to suggest tags from yet.",
   "ai.toolApprovalExpired": "This tool request is no longer available. Run the AI action again to create a new request.",
-  "ai.toolApprovalPending": "A tool request is waiting for approval. Approve or decline it before sending another Copilot message.",
+  "ai.toolApprovalPending": "A tool request is waiting for approval. The AI cannot run again until it is reviewed. Approve or decline the pending request first.",
   "ai.toolApprovalUnavailable": "This tool request cannot be approved for this conversation. Run the AI action again to create a new request.",
   "ai.toolChangedBeforeApproval": "This tool changed after approval was requested and was not run. Run the AI action again to review the current tool.",
   "ai.toolApprovalTitle": "Review tool request",
diff --git a/internal/ai/agent_approval.go b/internal/ai/agent_approval.go
index 9adae8b0..3e5dcb06 100644
--- a/internal/ai/agent_approval.go
+++ b/internal/ai/agent_approval.go
@@ -118,7 +118,11 @@ func (m *Manager) ClearPendingAgentRuns(scope AgentRunScope) {
 }
 
 func (m *Manager) continueAgentRun(ctx context.Context, run *pendingAgentRun) (models.AgentRunResult, error) {
-	if result := m.processAgentToolCalls(ctx, run); result != nil {
+	result, err := m.processAgentToolCalls(ctx, run)
+	if err != nil {
+		return models.AgentRunResult{}, err
+	}
+	if result != nil {
 		return *result, nil
 	}
 	for run.Step < run.MaxSteps {
@@ -136,7 +140,11 @@ func (m *Manager) continueAgentRun(ctx context.Context, run *pendingAgentRun) (m
 		run.ToolCalls = res.ToolCalls
 		run.NextToolCall = 0
 		run.Step++
-		if result := m.processAgentToolCalls(ctx, run); result != nil {
+		result, err := m.processAgentToolCalls(ctx, run)
+		if err != nil {
+			return models.AgentRunResult{}, err
+		}
+		if result != nil {
 			return *result, nil
 		}
 	}
@@ -153,7 +161,7 @@ func (m *Manager) continueAgentRun(ctx context.Context, run *pendingAgentRun) (m
 	return completedAgentRun(res.Content), nil
 }
 
-func (m *Manager) processAgentToolCalls(ctx context.Context, run *pendingAgentRun) *models.AgentRunResult {
+func (m *Manager) processAgentToolCalls(ctx context.Context, run *pendingAgentRun) (*models.AgentRunResult, error) {
 	for run.NextToolCall < len(run.ToolCalls) {
 		toolCall := run.ToolCalls[run.NextToolCall]
 		if run.Approvals {
@@ -163,15 +171,17 @@ func (m *Manager) processAgentToolCalls(ctx context.Context, run *pendingAgentRu
 				run.ToolUpdatedAt = customTool.toolUpdatedAt()
 				run.CreatedAt = time.Now()
 				run.ExpiresAt = run.CreatedAt.Add(pendingAgentRunTTL)
-				m.storeAgentRun(run)
-				return &models.AgentRunResult{Status: models.AgentRunApprovalRequired, Approval: agentRunApproval(run)}
+				if err := m.storeAgentRun(run); err != nil {
+					return nil, err
+				}
+				return &models.AgentRunResult{Status: models.AgentRunApprovalRequired, Approval: agentRunApproval(run)}, nil
 			}
 		}
 		m.appendToolResult(run, toolCall, m.executeToolCall(ctx, run.Registry, toolCall))
 		run.NextToolCall++
 	}
 	run.ToolCalls = nil
-	return nil
+	return nil, nil
 }
 
 func (m *Manager) appendToolResult(run *pendingAgentRun, toolCall models.ToolCall, result string) {
@@ -183,11 +193,19 @@ func (m *Manager) appendToolResult(run *pendingAgentRun, toolCall models.ToolCal
 	})
 }
 
-func (m *Manager) storeAgentRun(run *pendingAgentRun) {
+// storeAgentRun admits one pending run per scope, so two requests racing on the same
+// conversation and surface cannot both park a tool call the agent could approve twice.
+func (m *Manager) storeAgentRun(run *pendingAgentRun) error {
 	m.pendingRunMu.Lock()
 	defer m.pendingRunMu.Unlock()
 	m.deleteExpiredAgentRunsLocked(time.Now())
+	for _, pending := range m.pendingRuns {
+		if sameAgentRunScope(pending.Scope, run.Scope) {
+			return envelope.NewError(envelope.ConflictError, m.i18n.T("ai.toolApprovalPending"), nil)
+		}
+	}
 	m.pendingRuns[run.ID] = run
+	return nil
 }
 
 func (m *Manager) claimAgentRun(runID string, agentID int) (*pendingAgentRun, error) {
diff --git a/internal/ai/agent_approval_test.go b/internal/ai/agent_approval_test.go
index f67d5884..450bb1cc 100644
--- a/internal/ai/agent_approval_test.go
+++ b/internal/ai/agent_approval_test.go
@@ -124,6 +124,33 @@ func TestAgentToolDecisionIsFinalWhenFollowUpFails(t *testing.T) {
 	}
 }
 
+func TestSecondRunInSameScopeIsRejectedWhileOneAwaitsApproval(t *testing.T) {
+	m := newTestManager(t)
+	tool := &approvalTestTool{}
+	scope := AgentRunScope{AgentID: 7, ConversationID: 9, ConversationUUID: "conversation-1", Surface: models.ToolInvocationCopilot}
+	newRun := func() *pendingAgentRun {
+		return &pendingAgentRun{
+			Scope: scope,
+			Client: &approvalTestProvider{responses: []models.ChatCompletionResult{
+				{ToolCalls: []models.ToolCall{{ID: "call-1", Type: "function", Function: models.ToolCallFunction{Name: tool.Name(), Arguments: `{}`}}}},
+			}},
+			Registry:  map[string]Tool{tool.Name(): tool},
+			MaxSteps:  5,
+			Approvals: true,
+		}
+	}
+
+	if _, err := m.continueAgentRun(t.Context(), newRun()); err != nil {
+		t.Fatalf("first run: %v", err)
+	}
+	if _, err := m.continueAgentRun(t.Context(), newRun()); err == nil {
+		t.Fatal("expected the second run in the same scope to be rejected")
+	}
+	if len(m.pendingRuns) != 1 {
+		t.Fatalf("expected one pending run, got %d", len(m.pendingRuns))
+	}
+}
+
 func (t *approvalTestTool) approvalRequired() bool { return true }
 
 func (t *approvalTestTool) toolID() int { return 1 }

From 769aa32fdfb22494d61bcdc0c88d7f019736cd1d Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 18 Sep 2026 20:54:38 +0530
Subject: [PATCH 107/178] send the real contact verification state to AI tools
 on agent surfaces

---
 cmd/ai.go                  | 13 ++++++++-----
 internal/aiagent/otp.go    | 11 +++++++++++
 internal/aiagent/worker.go | 10 ++--------
 3 files changed, 21 insertions(+), 13 deletions(-)

diff --git a/cmd/ai.go b/cmd/ai.go
index e6bb47fa..46486ffa 100644
--- a/cmd/ai.go
+++ b/cmd/ai.go
@@ -370,16 +370,19 @@ func handleAIGenerateReply(r *fastglue.Request) error {
 		transcript = conversationTranscript(app, req.ConversationUUID)
 	}
 	toolIDs := []int(nil)
-	tctx := ai.ToolContext{Verified: func() bool { return true }}
+	tctx := ai.ToolContext{}
 	scope := ai.AgentRunScope{AgentID: auser.ID, Surface: aimodels.ToolInvocationReply}
 	if conv != nil {
 		toolIDs, err = app.ai.GetEnabledGenerateReplyToolIDs()
 		if err != nil {
 			return sendErrorEnvelope(r, err)
 		}
-		tctx = agentToolContext(conv)
+		tctx = agentToolContext(app, conv)
 		scope.ConversationID = conv.ID
 		scope.ConversationUUID = conv.UUID
+		// The draft surface keeps no history, so a reload leaves the agent no way to answer an
+		// earlier request; the newest one replaces it.
+		app.ai.ClearPendingAgentRuns(scope)
 	}
 	resp, err := app.ai.GenerateReply(r.RequestCtx, transcript, req.Instruction, tctx, generateReplyTools(app, user, conv), toolIDs, scope)
 	if err != nil {
@@ -504,7 +507,7 @@ func handleAICopilot(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 	convoContext := conversationTranscript(app, req.ConversationUUID)
-	resp, err := app.ai.Copilot(r.RequestCtx, convoContext, history, agentToolContext(conv), copilotTools(app, user, conv), persona, toolIDs, scope)
+	resp, err := app.ai.Copilot(r.RequestCtx, convoContext, history, agentToolContext(app, conv), copilotTools(app, user, conv), persona, toolIDs, scope)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
@@ -649,7 +652,7 @@ func decideAIToolRun(r *fastglue.Request, approved bool) (aimodels.AgentRunResul
 	return resp, nil
 }
 
-func agentToolContext(conv *cmodels.Conversation) ai.ToolContext {
+func agentToolContext(app *App, conv *cmodels.Conversation) ai.ToolContext {
 	return ai.ToolContext{
 		ContactID:         conv.Contact.ID,
 		ContactExternalID: conv.Contact.ExternalUserID.String,
@@ -657,6 +660,6 @@ func agentToolContext(conv *cmodels.Conversation) ai.ToolContext {
 		ConversationUUID:  conv.UUID,
 		InboxID:           conv.InboxID,
 		ContactEmail:      func() string { return conv.Contact.Email.String },
-		Verified:          func() bool { return true },
+		Verified:          func() bool { return app.aiAgent.IsContactVerified(*conv) },
 	}
 }
diff --git a/internal/aiagent/otp.go b/internal/aiagent/otp.go
index 34f196b0..cc8fab33 100644
--- a/internal/aiagent/otp.go
+++ b/internal/aiagent/otp.go
@@ -8,7 +8,9 @@ import (
 	"strings"
 	"time"
 
+	cmodels "github.com/abhinavxd/libredesk/internal/conversation/models"
 	"github.com/abhinavxd/libredesk/internal/stringutil"
+	umodels "github.com/abhinavxd/libredesk/internal/user/models"
 	"github.com/redis/go-redis/v9"
 )
 
@@ -87,6 +89,15 @@ func otpSendsKey(convUUID, email string) string {
 
 func otpConvSendsKey(convUUID string) string { return otpSendsKeyPrefix + convUUID }
 
+// IsContactVerified reports whether the customer on this conversation has proven their identity: a
+// JWT livechat contact is trusted by login, everyone else only within an OTP verification window.
+func (m *Manager) IsContactVerified(conv cmodels.Conversation) bool {
+	if conv.InboxChannel != channelEmail && conv.Contact.Type == umodels.UserTypeContact {
+		return true
+	}
+	return m.isConversationVerified(conv.UUID, conv.Contact.Email.String)
+}
+
 // isConversationVerified holds the invariant "verified == the contact's current email is the one
 // proven by OTP": the verified value stores the attested address, and a contact email rebound
 // after verification (from this or any sibling conversation) no longer matches.
diff --git a/internal/aiagent/worker.go b/internal/aiagent/worker.go
index 4b4d29a0..7e6308b1 100644
--- a/internal/aiagent/worker.go
+++ b/internal/aiagent/worker.go
@@ -273,14 +273,8 @@ func (m *Manager) handle(ctx context.Context, convID int) {
 	}
 	m.lo.Debug("ai agent running", "conversation_uuid", conv.UUID, "history_messages", len(history), "turns", turns)
 
-	// A JWT livechat contact is trusted by login; everyone else (email channel, anonymous visitor)
-	// is trusted only within an OTP verification window. Read live so mid-turn verification counts.
-	verified := func() bool {
-		if conv.InboxChannel != channelEmail && conv.Contact.Type == umodels.UserTypeContact {
-			return true
-		}
-		return m.isConversationVerified(conv.UUID, conv.Contact.Email.String)
-	}
+	// Read live so mid-turn verification counts.
+	verified := func() bool { return m.IsContactVerified(conv) }
 	// Snapshot for the run-start registration decisions (one Redis read); tctx still gets the live
 	// closure so mid-turn verification is picked up per tool call.
 	runVerified := verified()

From ea93e5efa9efd8b3310cd2f4670fcccc67dd6793 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sat, 19 Sep 2026 00:11:13 +0530
Subject: [PATCH 108/178] update agent approval hint for AI tools to clarify
 data change requirements

---
 i18n/en-US.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/i18n/en-US.json b/i18n/en-US.json
index 9eda9e75..f155cfea 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -192,7 +192,7 @@
   "admin.ai.tool.availableInCopilot": "Available in Copilot",
   "admin.ai.tool.availableInGenerateReply": "Available in Generate Reply",
   "admin.ai.tool.requireAgentApproval": "Require agent approval",
-  "admin.ai.tool.requireAgentApprovalHint": "The tool pauses before it runs. The agent must review its arguments and approve or decline it.",
+  "admin.ai.tool.requireAgentApprovalHint": "The tool pauses before it runs. The agent must review its arguments and approve or decline it. Keep this on for tools that change data. Read-only lookups can run without it.",
   "admin.ai.snippet.new": "New snippet",
   "admin.ai.snippet.edit": "Edit snippet",
   "admin.ai.snippet.deleteConfirmation": "This will permanently delete the snippet.",

From a85d59add9e099f1bd0c33751d3a32108fa16c96 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sat, 19 Sep 2026 00:39:32 +0530
Subject: [PATCH 109/178] always send verified for agent tool calls and tidy
 the approval UI

---
 cmd/ai.go                                     | 10 +++--
 .../src/features/conversation/ReplyBox.vue    | 26 ++---------
 .../conversation/ToolApprovalDetails.vue      | 40 +++++++++++++++++
 .../conversation/sidebar/CopilotPanel.vue     | 44 +++++++------------
 i18n/en-US.json                               |  2 +-
 5 files changed, 67 insertions(+), 55 deletions(-)
 create mode 100644 frontend/apps/main/src/features/conversation/ToolApprovalDetails.vue

diff --git a/cmd/ai.go b/cmd/ai.go
index 46486ffa..3f60349f 100644
--- a/cmd/ai.go
+++ b/cmd/ai.go
@@ -377,7 +377,7 @@ func handleAIGenerateReply(r *fastglue.Request) error {
 		if err != nil {
 			return sendErrorEnvelope(r, err)
 		}
-		tctx = agentToolContext(app, conv)
+		tctx = agentToolContext(conv)
 		scope.ConversationID = conv.ID
 		scope.ConversationUUID = conv.UUID
 		// The draft surface keeps no history, so a reload leaves the agent no way to answer an
@@ -507,7 +507,7 @@ func handleAICopilot(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 	convoContext := conversationTranscript(app, req.ConversationUUID)
-	resp, err := app.ai.Copilot(r.RequestCtx, convoContext, history, agentToolContext(app, conv), copilotTools(app, user, conv), persona, toolIDs, scope)
+	resp, err := app.ai.Copilot(r.RequestCtx, convoContext, history, agentToolContext(conv), copilotTools(app, user, conv), persona, toolIDs, scope)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
@@ -652,7 +652,7 @@ func decideAIToolRun(r *fastglue.Request, approved bool) (aimodels.AgentRunResul
 	return resp, nil
 }
 
-func agentToolContext(app *App, conv *cmodels.Conversation) ai.ToolContext {
+func agentToolContext(conv *cmodels.Conversation) ai.ToolContext {
 	return ai.ToolContext{
 		ContactID:         conv.Contact.ID,
 		ContactExternalID: conv.Contact.ExternalUserID.String,
@@ -660,6 +660,8 @@ func agentToolContext(app *App, conv *cmodels.Conversation) ai.ToolContext {
 		ConversationUUID:  conv.UUID,
 		InboxID:           conv.InboxID,
 		ContactEmail:      func() string { return conv.Contact.Email.String },
-		Verified:          func() bool { return app.aiAgent.IsContactVerified(*conv) },
+		// The agent picked this conversation and reviews the call before it runs, so the customer's
+		// own OTP state does not gate an agent-initiated lookup.
+		Verified: func() bool { return true },
 	}
 }
diff --git a/frontend/apps/main/src/features/conversation/ReplyBox.vue b/frontend/apps/main/src/features/conversation/ReplyBox.vue
index a8d38146..149dfcbe 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBox.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBox.vue
@@ -5,21 +5,8 @@
     <AlertDialogContent>
       <AlertDialogHeader>
         <AlertDialogTitle>{{ $t('ai.toolApprovalTitle') }}</AlertDialogTitle>
-        <AlertDialogDescription as="div" class="space-y-3">
-          <p>
-            <i18n-t keypath="ai.toolApprovalDescription" scope="global">
-              <template #tool
-                ><code class="inline-flex items-center rounded-md border bg-muted px-1.5 py-0.5 font-mono text-xs font-medium text-foreground">{{ pendingToolApproval?.tool_name }}</code></template
-              >
-            </i18n-t>
-          </p>
-          <div class="space-y-1 text-foreground">
-            <p class="text-xs font-medium">{{ $t('ai.toolApprovalArguments') }}</p>
-            <pre
-              class="max-h-60 overflow-auto whitespace-pre-wrap rounded-md bg-muted p-3 text-xs [overflow-wrap:anywhere]"
-              >{{ formatToolArguments(pendingToolApproval?.arguments) }}</pre
-            >
-          </div>
+        <AlertDialogDescription as="div">
+          <ToolApprovalDetails v-if="pendingToolApproval" :approval="pendingToolApproval" />
         </AlertDialogDescription>
       </AlertDialogHeader>
       <AlertDialogFooter>
@@ -212,6 +199,7 @@ import {
 } from '@shared-ui/components/ui/alert-dialog'
 import { Dialog, DialogContent } from '@shared-ui/components/ui/dialog'
 import { Button } from '@shared-ui/components/ui/button'
+import ToolApprovalDetails from '@/features/conversation/ToolApprovalDetails.vue'
 import { Pencil, Paperclip } from 'lucide-vue-next'
 import { useVisualViewportHeight } from '@main/composables/useVisualViewportHeight'
 import { useIsComposerCramped } from '@main/composables/useIsComposerCramped'
@@ -375,14 +363,6 @@ const resolveGenerateToolApproval = async (approved) => {
   }
 }
 
-const formatToolArguments = (argumentsText) => {
-  try {
-    return JSON.stringify(JSON.parse(argumentsText), null, 2)
-  } catch {
-    return argumentsText || ''
-  }
-}
-
 // Copilot's "Insert into reply" replaces the draft with its answer (already HTML from the panel),
 // forcing reply mode so a private note in progress does not silently receive customer-facing text.
 const handleCopilotInsertReply = (html) => {
diff --git a/frontend/apps/main/src/features/conversation/ToolApprovalDetails.vue b/frontend/apps/main/src/features/conversation/ToolApprovalDetails.vue
new file mode 100644
index 00000000..92c2ca1c
--- /dev/null
+++ b/frontend/apps/main/src/features/conversation/ToolApprovalDetails.vue
@@ -0,0 +1,40 @@
+<template>
+  <div class="space-y-3">
+    <p class="text-xs text-muted-foreground">
+      <i18n-t keypath="ai.toolApprovalDescription" scope="global">
+        <template #tool
+          ><code
+            class="inline-flex items-center rounded-md border bg-muted px-1.5 py-0.5 font-mono text-xs font-medium text-foreground"
+            >{{ approval.tool_name }}</code
+          ></template
+        >
+      </i18n-t>
+    </p>
+    <div class="space-y-1">
+      <p class="text-xs font-medium text-foreground">{{ $t('ai.toolApprovalArguments') }}</p>
+      <pre
+        class="max-h-60 overflow-auto whitespace-pre-wrap rounded-md bg-muted p-3 text-xs text-foreground [overflow-wrap:anywhere]"
+        >{{ formattedArguments }}</pre
+      >
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+
+const props = defineProps({
+  approval: {
+    type: Object,
+    required: true
+  }
+})
+
+const formattedArguments = computed(() => {
+  try {
+    return JSON.stringify(JSON.parse(props.approval.arguments), null, 2)
+  } catch {
+    return props.approval.arguments || ''
+  }
+})
+</script>
diff --git a/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue b/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
index 5a3ab55d..8d093616 100644
--- a/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
+++ b/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
@@ -33,8 +33,12 @@
       </Button>
     </div>
     <div ref="scrollRef" class="flex-1 overflow-y-auto p-4 space-y-4 min-h-0">
+      <div v-if="isHydrating" class="h-full flex items-center justify-center text-muted-foreground">
+        <DotLoader />
+        <span class="sr-only">{{ $t('globals.terms.loading') }}</span>
+      </div>
       <div
-        v-if="messages.length === 0"
+        v-else-if="messages.length === 0"
         class="h-full flex flex-col items-center justify-center gap-4 text-center px-4"
       >
         <div class="h-12 w-12 rounded-full bg-primary/10 flex items-center justify-center">
@@ -83,23 +87,8 @@
             aria-live="polite"
             :aria-label="$t('ai.toolApprovalTitle')"
           >
-            <div class="space-y-1">
-              <p class="text-sm font-medium">{{ $t('ai.toolApprovalTitle') }}</p>
-              <p class="text-xs text-muted-foreground">
-                <i18n-t keypath="ai.toolApprovalDescription" scope="global">
-                  <template #tool
-                    ><code class="inline-flex items-center rounded-md border bg-muted px-1.5 py-0.5 font-mono text-xs font-medium text-foreground">{{ msg.approval.tool_name }}</code></template
-                  >
-                </i18n-t>
-              </p>
-            </div>
-            <div class="space-y-1">
-              <p class="text-xs font-medium">{{ $t('ai.toolApprovalArguments') }}</p>
-              <pre
-                class="max-h-40 overflow-auto whitespace-pre-wrap rounded-md bg-muted p-2 text-xs [overflow-wrap:anywhere]"
-                >{{ formatToolArguments(msg.approval.arguments) }}</pre
-              >
-            </div>
+            <p class="text-sm font-medium">{{ $t('ai.toolApprovalTitle') }}</p>
+            <ToolApprovalDetails :approval="msg.approval" />
             <div class="flex flex-wrap justify-end gap-2">
               <Button
                 type="button"
@@ -213,6 +202,7 @@
 <script setup>
 import { ref, computed, nextTick, onMounted, watch } from 'vue'
 import { Button } from '@shared-ui/components/ui/button'
+import ToolApprovalDetails from '@/features/conversation/ToolApprovalDetails.vue'
 import {
   Select,
   SelectContent,
@@ -261,6 +251,7 @@ const input = ref('')
 // Thinking state is per conversation so an in-flight send for one conversation does not show or
 // block the panel after the agent switches to another.
 const thinkingByUUID = ref({})
+const isHydrating = ref(true)
 const isThinking = computed(() => !!thinkingByUUID.value[conversationStore.current?.uuid || ''])
 const hasPendingApproval = computed(() => messages.value.some((message) => !!message.approval))
 const scrollRef = ref(null)
@@ -312,8 +303,13 @@ const clearChat = async () => {
 // Load the persisted chat from the server when a conversation opens, so a refresh
 // does not lose it. Skip if the store already has messages for it (a live session).
 const hydrate = async (uuid) => {
-  if (!uuid || copilotStore.getMessages(uuid).length > 0) return
+  if (!uuid) return
+  if (copilotStore.getMessages(uuid).length > 0) {
+    isHydrating.value = false
+    return
+  }
   const rev = revision(uuid)
+  isHydrating.value = true
   try {
     const resp = await api.getCopilotMessages(uuid)
     if (rev !== revision(uuid) || copilotStore.getMessages(uuid).length > 0) return
@@ -328,6 +324,8 @@ const hydrate = async (uuid) => {
     }
   } catch {
     // Non-fatal: the panel still works without history.
+  } finally {
+    isHydrating.value = false
   }
 }
 
@@ -427,14 +425,6 @@ const resolveToolApproval = async (approval, approved) => {
   }
 }
 
-const formatToolArguments = (argumentsText) => {
-  try {
-    return JSON.stringify(JSON.parse(argumentsText), null, 2)
-  } catch {
-    return argumentsText
-  }
-}
-
 const copyAnswer = async (content) => {
   try {
     await navigator.clipboard.writeText(getTextFromHTML(content))
diff --git a/i18n/en-US.json b/i18n/en-US.json
index f155cfea..36e6f29f 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -182,7 +182,7 @@
   "admin.ai.tool.deleteConfirmation": "This will permanently delete the tool.",
   "admin.ai.tool.reservedName": "This name is reserved for a built-in tool. Choose a different name.",
   "admin.ai.tool.requireVerification": "Require verified contact",
-  "admin.ai.tool.requireVerificationHint": "The assistant verifies the customer's identity by emailing them a one-time code before this tool can run.",
+  "admin.ai.tool.requireVerificationHint": "The assistant emails the customer a one-time code and runs this tool only after they enter it. Copilot and Generate Reply run it without the code, since a human agent asks for it there.",
   "admin.ai.tool.turnOffVerificationTitle": "Turn off customer authentication?",
   "admin.ai.tool.turnOffVerificationBody": "With verification on, Libredesk emails the customer a one-time code and runs this tool only after they enter it. Turning it off lets anyone in the chat trigger the tool.",
   "admin.ai.tool.turnOffVerificationEndpoint": "If the tool accesses sensitive data or performs actions, your endpoint must authenticate the customer itself. Every request carries an X-Libredesk-Contact-Verified header.",

From aa7336e10e1e47efb58bb5a8c1a5d6242795c7ff Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sat, 19 Sep 2026 01:08:05 +0530
Subject: [PATCH 110/178] move reusable AI tool labels to global translations

---
 frontend/apps/main/src/features/admin/ai/ToolForm.vue     | 2 +-
 frontend/apps/main/src/features/conversation/ReplyBox.vue | 4 ++--
 .../src/features/conversation/ToolApprovalDetails.vue     | 2 +-
 .../src/features/conversation/sidebar/CopilotPanel.vue    | 4 ++--
 i18n/en-US.json                                           | 8 ++++----
 5 files changed, 10 insertions(+), 10 deletions(-)

diff --git a/frontend/apps/main/src/features/admin/ai/ToolForm.vue b/frontend/apps/main/src/features/admin/ai/ToolForm.vue
index 41e6f64f..b435efff 100644
--- a/frontend/apps/main/src/features/admin/ai/ToolForm.vue
+++ b/frontend/apps/main/src/features/admin/ai/ToolForm.vue
@@ -125,7 +125,7 @@
 
     <div class="space-y-5 rounded-lg border border-border p-4">
       <div>
-        <h3 class="text-sm font-medium text-foreground">{{ t('admin.ai.tool.agentAccess') }}</h3>
+        <h3 class="text-sm font-medium text-foreground">{{ t('globals.terms.agentAccess') }}</h3>
       </div>
 
       <FormField v-slot="{ componentField, handleChange }" name="copilot_enabled">
diff --git a/frontend/apps/main/src/features/conversation/ReplyBox.vue b/frontend/apps/main/src/features/conversation/ReplyBox.vue
index 149dfcbe..895ec343 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBox.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBox.vue
@@ -16,10 +16,10 @@
           :disabled="isGenerating"
           @click="resolveGenerateToolApproval(false)"
         >
-          {{ $t('ai.toolApprovalDecline') }}
+          {{ $t('globals.messages.decline') }}
         </Button>
         <Button type="button" :disabled="isGenerating" @click="resolveGenerateToolApproval(true)">
-          {{ $t('ai.toolApprovalApprove') }}
+          {{ $t('globals.messages.approveAndRun') }}
         </Button>
       </AlertDialogFooter>
     </AlertDialogContent>
diff --git a/frontend/apps/main/src/features/conversation/ToolApprovalDetails.vue b/frontend/apps/main/src/features/conversation/ToolApprovalDetails.vue
index 92c2ca1c..95f0f71a 100644
--- a/frontend/apps/main/src/features/conversation/ToolApprovalDetails.vue
+++ b/frontend/apps/main/src/features/conversation/ToolApprovalDetails.vue
@@ -11,7 +11,7 @@
       </i18n-t>
     </p>
     <div class="space-y-1">
-      <p class="text-xs font-medium text-foreground">{{ $t('ai.toolApprovalArguments') }}</p>
+      <p class="text-xs font-medium text-foreground">{{ $t('globals.terms.arguments') }}</p>
       <pre
         class="max-h-60 overflow-auto whitespace-pre-wrap rounded-md bg-muted p-3 text-xs text-foreground [overflow-wrap:anywhere]"
         >{{ formattedArguments }}</pre
diff --git a/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue b/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
index 8d093616..f481a97a 100644
--- a/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
+++ b/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
@@ -97,7 +97,7 @@
                 :disabled="isThinking"
                 @click="resolveToolApproval(msg.approval, false)"
               >
-                {{ $t('ai.toolApprovalDecline') }}
+                {{ $t('globals.messages.decline') }}
               </Button>
               <Button
                 type="button"
@@ -105,7 +105,7 @@
                 :disabled="isThinking"
                 @click="resolveToolApproval(msg.approval, true)"
               >
-                {{ $t('ai.toolApprovalApprove') }}
+                {{ $t('globals.messages.approveAndRun') }}
               </Button>
             </div>
           </div>
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 36e6f29f..67f41ed7 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -188,7 +188,6 @@
   "admin.ai.tool.turnOffVerificationEndpoint": "If the tool accesses sensitive data or performs actions, your endpoint must authenticate the customer itself. Every request carries an X-Libredesk-Contact-Verified header.",
   "admin.ai.tool.keepVerificationOn": "Keep authentication on",
   "admin.ai.tool.turnOffVerification": "Turn off",
-  "admin.ai.tool.agentAccess": "Agent access",
   "admin.ai.tool.availableInCopilot": "Available in Copilot",
   "admin.ai.tool.availableInGenerateReply": "Available in Generate Reply",
   "admin.ai.tool.requireAgentApproval": "Require agent approval",
@@ -607,9 +606,6 @@
   "ai.toolChangedBeforeApproval": "This tool changed after approval was requested and was not run. Run the AI action again to review the current tool.",
   "ai.toolApprovalTitle": "Review tool request",
   "ai.toolApprovalDescription": "The AI wants to run {tool}. Review the arguments before allowing it.",
-  "ai.toolApprovalArguments": "Arguments",
-  "ai.toolApprovalApprove": "Approve and run",
-  "ai.toolApprovalDecline": "Decline",
   "ai.toolRanResponseFailed": "The tool request finished, but the AI could not complete its response. Check the external system before running it again.",
   "ai.toolDeclinedResponseFailed": "The tool was declined, but the AI could not complete its response. Run the AI action again if you still need a reply.",
   "ai.toolApprovalPendingInput": "Approve or decline the pending tool request first",
@@ -837,6 +833,7 @@
   "globals.messages.additionalFeedback": "Additional feedback (optional)",
   "globals.messages.all": "All",
   "globals.messages.apply": "Apply",
+  "globals.messages.approveAndRun": "Approve and run",
   "globals.messages.areYouAbsolutelySure": "Are you absolutely sure?",
   "globals.messages.attachFile": "Attach file",
   "globals.messages.back": "Back",
@@ -867,6 +864,7 @@
   "globals.messages.delete": "Delete",
   "globals.messages.deleteAll": "Delete all",
   "globals.messages.deletedSuccessfully": "Deleted successfully",
+  "globals.messages.decline": "Decline",
   "globals.messages.disable": "Disable",
   "globals.messages.edit": "Edit",
   "globals.messages.empty": "{name} empty",
@@ -966,10 +964,12 @@
   "globals.terms.actor": "Actor | Actors",
   "globals.terms.admin": "Admin | Admins",
   "globals.terms.agent": "Agent | Agents",
+  "globals.terms.agentAccess": "Agent access",
   "globals.terms.alert": "Alert | Alerts",
   "globals.terms.announcement": "Announcement | Announcements",
   "globals.terms.apiKey": "API key | API keys",
   "globals.terms.appliesTo": "Applies to",
+  "globals.terms.arguments": "Arguments",
   "globals.terms.article": "Article | Articles",
   "globals.terms.ascending": "Ascending",
   "globals.terms.assignedTeam": "Assigned team",

From a1117ac5fe543b0fe3f1c6b749c6d465ae634214 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sat, 19 Sep 2026 01:34:43 +0530
Subject: [PATCH 111/178] send the AI agent's last reply before handing off to
 a human

The handoff tool used to reassign the conversation right away, so the
assistant's own reply was dropped and the customer saw nothing. It now
records the intent, the reply goes out, then the handoff runs.
---
 cmd/ai.go                                     |  3 +--
 .../src/features/conversation/ReplyBox.vue    |  2 +-
 .../conversation/sidebar/CopilotPanel.vue     | 20 +++++++++----------
 i18n/en-US.json                               |  1 -
 internal/aiagent/otp.go                       |  4 ++--
 internal/aiagent/prompt.go                    |  4 ++--
 internal/aiagent/tools.go                     |  7 ++++---
 internal/aiagent/worker.go                    | 18 +++++++++--------
 8 files changed, 30 insertions(+), 29 deletions(-)

diff --git a/cmd/ai.go b/cmd/ai.go
index 3f60349f..ca7e7ddf 100644
--- a/cmd/ai.go
+++ b/cmd/ai.go
@@ -380,8 +380,6 @@ func handleAIGenerateReply(r *fastglue.Request) error {
 		tctx = agentToolContext(conv)
 		scope.ConversationID = conv.ID
 		scope.ConversationUUID = conv.UUID
-		// The draft surface keeps no history, so a reload leaves the agent no way to answer an
-		// earlier request; the newest one replaces it.
 		app.ai.ClearPendingAgentRuns(scope)
 	}
 	resp, err := app.ai.GenerateReply(r.RequestCtx, transcript, req.Instruction, tctx, generateReplyTools(app, user, conv), toolIDs, scope)
@@ -502,6 +500,7 @@ func handleAICopilot(r *fastglue.Request) error {
 	history = append(history, aimodels.ChatMessage{Role: aimodels.RoleUser, Content: req.Message})
 
 	scope := ai.AgentRunScope{AgentID: auser.ID, ConversationID: conv.ID, ConversationUUID: conv.UUID, Surface: aimodels.ToolInvocationCopilot, UserMessage: req.Message}
+	app.ai.ClearPendingAgentRuns(scope)
 	toolIDs, err := app.ai.GetEnabledCopilotToolIDs()
 	if err != nil {
 		return sendErrorEnvelope(r, err)
diff --git a/frontend/apps/main/src/features/conversation/ReplyBox.vue b/frontend/apps/main/src/features/conversation/ReplyBox.vue
index 895ec343..5921fa35 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBox.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBox.vue
@@ -350,7 +350,7 @@ const resolveGenerateToolApproval = async (approved) => {
     pendingToolConversationUUID.value = ''
     htmlContent.value = result.content || ''
   } catch (error) {
-    if ([404, 409].includes(error?.response?.status)) {
+    if ([403, 404, 409].includes(error?.response?.status)) {
       pendingToolApproval.value = null
       pendingToolConversationUUID.value = ''
     }
diff --git a/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue b/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
index f481a97a..107bbdc6 100644
--- a/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
+++ b/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
@@ -186,10 +186,7 @@
       >
         <Textarea
           v-model="input"
-          :placeholder="
-            hasPendingApproval ? $t('ai.toolApprovalPendingInput') : $t('copilot.placeholder')
-          "
-          :disabled="hasPendingApproval"
+          :placeholder="$t('copilot.placeholder')"
           rows="2"
           class="min-h-[44px] resize-none border-0 bg-transparent shadow-none focus-visible:ring-0"
           @keydown.enter.exact.prevent="send"
@@ -253,7 +250,6 @@ const input = ref('')
 const thinkingByUUID = ref({})
 const isHydrating = ref(true)
 const isThinking = computed(() => !!thinkingByUUID.value[conversationStore.current?.uuid || ''])
-const hasPendingApproval = computed(() => messages.value.some((message) => !!message.approval))
 const scrollRef = ref(null)
 
 // Persona selection is global per agent (a stored assistant whose instructions Copilot borrows for
@@ -309,10 +305,14 @@ const hydrate = async (uuid) => {
     return
   }
   const rev = revision(uuid)
+  let staleHydrate = false
   isHydrating.value = true
   try {
     const resp = await api.getCopilotMessages(uuid)
-    if (rev !== revision(uuid) || copilotStore.getMessages(uuid).length > 0) return
+    if (rev !== revision(uuid) || copilotStore.getMessages(uuid).length > 0) {
+      staleHydrate = true
+      return
+    }
     const loaded = (resp.data.data || []).map((m) => ({
       role: m.role,
       content: m.content,
@@ -325,7 +325,7 @@ const hydrate = async (uuid) => {
   } catch {
     // Non-fatal: the panel still works without history.
   } finally {
-    isHydrating.value = false
+    if (!staleHydrate) isHydrating.value = false
   }
 }
 
@@ -345,13 +345,13 @@ const scrollToBottom = async () => {
 
 const send = async (preset) => {
   const text = (typeof preset === 'string' ? preset : input.value).trim()
-  if (!text || isThinking.value || hasPendingApproval.value) return
+  if (!text || isThinking.value) return
 
   const uuid = conversationStore.current?.uuid || ''
   if (!uuid) return
   const rev = revision(uuid)
   copilotStore.setMessages(uuid, [
-    ...copilotStore.getMessages(uuid),
+    ...copilotStore.getMessages(uuid).filter((message) => !message.approval),
     { role: 'user', content: text }
   ])
   input.value = ''
@@ -407,7 +407,7 @@ const resolveToolApproval = async (approval, approved) => {
         .map((message) => (message.approval?.run_id === approval.run_id ? replacement : message))
     )
   } catch (error) {
-    if ([404, 409].includes(error?.response?.status)) {
+    if ([403, 404, 409].includes(error?.response?.status)) {
       copilotStore.setMessages(
         uuid,
         copilotStore
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 67f41ed7..78dd13de 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -608,7 +608,6 @@
   "ai.toolApprovalDescription": "The AI wants to run {tool}. Review the arguments before allowing it.",
   "ai.toolRanResponseFailed": "The tool request finished, but the AI could not complete its response. Check the external system before running it again.",
   "ai.toolDeclinedResponseFailed": "The tool was declined, but the AI could not complete its response. Run the AI action again if you still need a reply.",
-  "ai.toolApprovalPendingInput": "Approve or decline the pending tool request first",
   "auth.backToLogin": "Back to login",
   "auth.checkEmailForReset": "Check your email for the password reset link.",
   "auth.confirmPassword": "Confirm password",
diff --git a/internal/aiagent/otp.go b/internal/aiagent/otp.go
index cc8fab33..55a3a8e4 100644
--- a/internal/aiagent/otp.go
+++ b/internal/aiagent/otp.go
@@ -89,9 +89,9 @@ func otpSendsKey(convUUID, email string) string {
 
 func otpConvSendsKey(convUUID string) string { return otpSendsKeyPrefix + convUUID }
 
-// IsContactVerified reports whether the customer on this conversation has proven their identity: a
+// isContactVerified reports whether the customer on this conversation has proven their identity: a
 // JWT livechat contact is trusted by login, everyone else only within an OTP verification window.
-func (m *Manager) IsContactVerified(conv cmodels.Conversation) bool {
+func (m *Manager) isContactVerified(conv cmodels.Conversation) bool {
 	if conv.InboxChannel != channelEmail && conv.Contact.Type == umodels.UserTypeContact {
 		return true
 	}
diff --git a/internal/aiagent/prompt.go b/internal/aiagent/prompt.go
index 36e09bdb..bd88a905 100644
--- a/internal/aiagent/prompt.go
+++ b/internal/aiagent/prompt.go
@@ -39,9 +39,9 @@ const handoffToolLine = "- hand_off_to_human: transfer the conversation to a hum
 
 const defaultLanguageLine = "Reply in the same language as the customer's last message."
 
-const cannotAnswerWithHandoff = `If you cannot answer from the knowledge base: tell the customer you could not help with that and offer to connect them with a human. Only call hand_off_to_human once the customer asks for a human or accepts your offer, or if they are clearly stuck or frustrated. Do not tell the customer they have been transferred unless you have used the tool.`
+const cannotAnswerWithHandoff = `If you cannot answer from the knowledge base: tell the customer you could not help with that and offer to connect them with a human. A tool that fails or returns an error is handled the same way: tell the customer you could not complete the request and offer a human. Only call hand_off_to_human once the customer asks for a human or accepts your offer, or if they are clearly stuck or frustrated. Do not tell the customer they have been transferred unless you have used the tool.`
 
-const cannotAnswerNoHandoff = `If you cannot answer from the knowledge base: tell the customer you could not help with that. There is no human agent to transfer to - never offer to connect them with a human, transfer the conversation, or promise that someone will follow up.`
+const cannotAnswerNoHandoff = `If you cannot answer from the knowledge base, or a tool fails or returns an error: tell the customer you could not help with that. There is no human agent to transfer to - never offer to connect them with a human, transfer the conversation, or promise that someone will follow up.`
 
 // noContactIdentityNote is a trusted, data-free system-prompt line for when nothing identifies the contact.
 const noContactIdentityNote = "You do not have any identifying details for this customer yet. If you need to identify them for a request, ask."
diff --git a/internal/aiagent/tools.go b/internal/aiagent/tools.go
index a915b85c..b7510a20 100644
--- a/internal/aiagent/tools.go
+++ b/internal/aiagent/tools.go
@@ -64,8 +64,9 @@ var (
 
 // runOutcome records which terminal tool action the assistant took during one response run.
 type runOutcome struct {
-	handedOff bool
-	resolved  bool
+	handedOff     bool
+	handoffReason string
+	resolved      bool
 }
 
 type searchKnowledgeTool struct {
@@ -143,8 +144,8 @@ func (t *handoffTool) Execute(ctx context.Context, args string) (string, error)
 	}
 	_ = json.Unmarshal([]byte(args), &in)
 	t.m.lo.Debug("ai agent handoff tool called", "conversation_uuid", t.conv.UUID, "reason", in.Reason)
-	t.m.handoff(t.conv, t.assistant, in.Reason)
 	t.outcome.handedOff = true
+	t.outcome.handoffReason = in.Reason
 	return "The conversation has been handed off to a human. Do not take further action.", nil
 }
 
diff --git a/internal/aiagent/worker.go b/internal/aiagent/worker.go
index 7e6308b1..b4611580 100644
--- a/internal/aiagent/worker.go
+++ b/internal/aiagent/worker.go
@@ -274,7 +274,7 @@ func (m *Manager) handle(ctx context.Context, convID int) {
 	m.lo.Debug("ai agent running", "conversation_uuid", conv.UUID, "history_messages", len(history), "turns", turns)
 
 	// Read live so mid-turn verification counts.
-	verified := func() bool { return m.IsContactVerified(conv) }
+	verified := func() bool { return m.isContactVerified(conv) }
 	// Snapshot for the run-start registration decisions (one Redis read); tctx still gets the live
 	// closure so mid-turn verification is picked up per tool call.
 	runVerified := verified()
@@ -339,14 +339,11 @@ func (m *Manager) handle(ctx context.Context, convID int) {
 	}
 	if err != nil {
 		m.lo.Error("error running ai agent", "conversation_uuid", conv.UUID, "error", err)
-		if !outcome.handedOff {
-			m.handoff(conv, assistant, m.i18n.T("ai.agent.handoffError"))
+		reason := m.i18n.T("ai.agent.handoffError")
+		if outcome.handedOff {
+			reason = outcome.handoffReason
 		}
-		return
-	}
-	// The assistant escalated; the handoff tool already reassigned and noted it.
-	if outcome.handedOff {
-		m.lo.Debug("ai agent handed off", "conversation_uuid", conv.UUID)
+		m.handoff(conv, assistant, reason)
 		return
 	}
 	// The model's text answer is the reply to the customer. Handoff and resolve are separate tool actions.
@@ -368,6 +365,11 @@ func (m *Manager) handle(ctx context.Context, convID int) {
 			return
 		}
 	}
+	if outcome.handedOff {
+		m.lo.Debug("ai agent handed off", "conversation_uuid", conv.UUID)
+		m.handoff(conv, assistant, outcome.handoffReason)
+		return
+	}
 	if outcome.resolved && (answer != "" || turns > 0) {
 		m.resolve(conv, assistant)
 		return

From d2dc51b7341726a6ea4c8cfa693c1d4510eaf30b Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sat, 19 Sep 2026 02:13:13 +0530
Subject: [PATCH 112/178] link article translations by group id and tidy the
 widget chat

Move the translation_group_id migration into v2.9.0 and drop the slug backfill. Existing articles each get their own group and admins link translations from the new UI. The public article page now builds its language links from the group instead of the slug, so translations with different slugs no longer 404.
---
 cmd/helpcenter.go                             | 15 +++-
 cmd/upgrade.go                                |  1 -
 .../admin/help-center/ArticleEditSheet.vue    |  6 +-
 .../widget/src/components/ChatMessages.vue    | 32 ++++++--
 i18n/en-US.json                               |  2 +-
 internal/helpcenter/helpcenter.go             | 11 ---
 internal/helpcenter/queries.sql               | 15 ----
 internal/migrations/v2.10.0.go                | 51 ------------
 internal/migrations/v2.10.0_test.go           | 80 -------------------
 internal/migrations/v2.9.0.go                 | 26 ++++++
 internal/migrations/v2.9.0_test.go            | 45 +++++++++++
 static/widget.js                              |  2 +-
 12 files changed, 114 insertions(+), 172 deletions(-)
 delete mode 100644 internal/migrations/v2.10.0.go
 delete mode 100644 internal/migrations/v2.10.0_test.go

diff --git a/cmd/helpcenter.go b/cmd/helpcenter.go
index 8d43ac3b..37793dbe 100644
--- a/cmd/helpcenter.go
+++ b/cmd/helpcenter.go
@@ -745,13 +745,22 @@ func handleShowHelpCenterArticle(r *fastglue.Request) error {
 	if err != nil {
 		related = nil
 	}
-	translated, err := app.helpcenter.GetPublishedArticleLocales(slug, article.Slug)
+	translations, err := app.helpcenter.GetPublishedArticleTranslations(slug, article.ID)
 	if err != nil {
-		translated = []string{locale}
+		translations = nil
+	}
+	translated := make([]string, 0, len(translations)+1)
+	slugByLocale := map[string]string{locale: article.Slug}
+	for _, t := range translations {
+		translated = append(translated, t.Locale)
+		slugByLocale[t.Locale] = t.Slug
+	}
+	if !slices.Contains(translated, locale) {
+		translated = append(translated, locale)
 	}
 	var (
 		root            = helpCenterBaseURL(app, helpCenter)
-		pathFor         = func(l string) string { return articlePath(helpCenter, l, article.Slug) }
+		pathFor         = func(l string) string { return articlePath(helpCenter, l, slugByLocale[l]) }
 		metaDescription = firstNonEmpty(article.MetaDescription, article.Excerpt)
 		metaTitle       = firstNonEmpty(article.MetaTitle, fmt.Sprintf("%s - %s", article.Title, helpCenter.Name))
 		ogImage         = absoluteURL(root, publicAssetPaths(app, firstNonEmpty(article.MetaImageURL, helpCenterTheme(helpCenter).LogoURL)))
diff --git a/cmd/upgrade.go b/cmd/upgrade.go
index cb3bd2d6..f33f2f37 100644
--- a/cmd/upgrade.go
+++ b/cmd/upgrade.go
@@ -48,7 +48,6 @@ var migList = []migFunc{
 	{"v2.6.0", migrations.V2_6_0},
 	{"v2.8.0", migrations.V2_8_0},
 	{"v2.9.0", migrations.V2_9_0},
-	{"v2.10.0", migrations.V2_10_0},
 }
 
 // upgrade upgrades the database to the current version by running SQL migration files
diff --git a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
index dbd04401..94d16eac 100644
--- a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
+++ b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
@@ -135,8 +135,10 @@
                   @update:model-value="selectTranslationLocale"
                 >
                   <SelectTrigger class="w-full">
-                    <Plus class="mr-2 size-4" aria-hidden="true" />
-                    <SelectValue :placeholder="t('helpCenter.addTranslation')" />
+                    <div class="flex items-center gap-2">
+                      <Plus class="size-4" aria-hidden="true" />
+                      <SelectValue :placeholder="t('helpCenter.addTranslation')" />
+                    </div>
                   </SelectTrigger>
                   <SelectContent>
                     <SelectItem v-for="locale in missingLocales" :key="locale" :value="locale">
diff --git a/frontend/apps/widget/src/components/ChatMessages.vue b/frontend/apps/widget/src/components/ChatMessages.vue
index 05360180..3aa15c13 100644
--- a/frontend/apps/widget/src/components/ChatMessages.vue
+++ b/frontend/apps/widget/src/components/ChatMessages.vue
@@ -25,17 +25,14 @@
         />
 
         <!-- Messages -->
-        <TransitionGroup
-          tag="div"
-          enter-active-class="animate-slide-in"
-          class="flex flex-col gap-4"
-        >
+        <TransitionGroup tag="div" enter-active-class="animate-slide-in" class="flex flex-col">
           <div
-            v-for="message in chatStore.getCurrentConversationMessages"
+            v-for="{ message, groupWithPrev, groupWithNext } in messageRows"
             :key="message.uuid"
             :data-message-uuid="message.uuid"
             :class="[
               'flex flex-col',
+              groupWithPrev ? 'mt-1' : 'mt-4 first:mt-0',
               message.author.type === 'contact' || message.author.type === 'visitor'
                 ? 'items-end'
                 : 'items-start'
@@ -116,7 +113,10 @@
               @select="emit('suggested-reply', $event)"
             />
 
-            <div class="text-[10px] text-muted-foreground mt-1 flex items-center gap-2">
+            <div
+              v-if="!groupWithNext"
+              class="text-[10px] text-muted-foreground mt-1 flex items-center gap-2"
+            >
               <span v-if="message.author.type === 'agent'">
                 {{ message.author.first_name }} {{ message.author.last_name }}
                 •
@@ -227,6 +227,24 @@ const { hasUserScrolled, scrollToBottom, scrollToOffset, handleScroll } = useSti
 const config = computed(() => widgetStore.config)
 const isTyping = computed(() => chatStore.isTyping)
 const isLoadingConversation = computed(() => chatStore.isLoadingConversation)
+const GROUP_WINDOW_MS = 60_000
+const canGroup = (a, b) => {
+  if (!a || !b) return false
+  if (a.meta?.is_csat || b.meta?.is_csat) return false
+  if (a.status === 'failed' || b.status === 'failed') return false
+  if (!a.author?.id || a.author.id !== b.author?.id) return false
+  const aBucket = Math.floor(new Date(a.created_at).getTime() / GROUP_WINDOW_MS)
+  const bBucket = Math.floor(new Date(b.created_at).getTime() / GROUP_WINDOW_MS)
+  return aBucket === bBucket
+}
+const messageRows = computed(() => {
+  const messages = chatStore.getCurrentConversationMessages
+  return messages.map((message, index) => ({
+    message,
+    groupWithPrev: canGroup(messages[index - 1], message),
+    groupWithNext: canGroup(message, messages[index + 1])
+  }))
+})
 const suggestedReplyMessageUUID = computed(() => {
   const lastMessage = chatStore.getCurrentConversationLastMessage
   if (
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 05707504..47097b55 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -1676,7 +1676,7 @@
   "widget.campaignLimitReached": "You have reached the limit of 50 proactive messages. Delete one to add another.",
   "widget.campaignPriorityHint": "Messages are checked from top to bottom. The first matching message is shown.",
   "widget.campaignSender": "Sender",
-  "widget.campaignsHint": "Invite people to chat. A conversation starts only after they reply.",
+  "widget.campaignsHint": "Show a message on matching pages before the chat is opened. A conversation is created only when someone replies to it.",
   "widget.campaignStats": "Proactive message results",
   "widget.campaignUrlLimit": "Add up to 20 page patterns.",
   "widget.conversationClosed": "This conversation has been closed",
diff --git a/internal/helpcenter/helpcenter.go b/internal/helpcenter/helpcenter.go
index 71262d35..c62686b3 100644
--- a/internal/helpcenter/helpcenter.go
+++ b/internal/helpcenter/helpcenter.go
@@ -198,7 +198,6 @@ type queries struct {
 	GetPublicTreeData                *sqlx.Stmt `query:"get-public-tree-data"`
 	GetPublishedArticleBySlug        *sqlx.Stmt `query:"get-published-article-by-slug"`
 	GetPublishedArticleTranslations  *sqlx.Stmt `query:"get-published-article-translations"`
-	GetPublishedArticleLocales       *sqlx.Stmt `query:"get-published-article-locales"`
 	GetPublishedCollectionLocales    *sqlx.Stmt `query:"get-published-collection-locales"`
 	GetPublishedArticles             *sqlx.Stmt `query:"get-published-articles"`
 	GetPublishedArticlesByCollection *sqlx.Stmt `query:"get-published-articles-by-collection"`
@@ -952,16 +951,6 @@ func (m *Manager) GetPublishedArticlesByCollection(collectionID, excludeArticleI
 	return articles, nil
 }
 
-// GetPublishedArticleLocales returns the locales a published article with the given slug exists in.
-func (m *Manager) GetPublishedArticleLocales(helpCenterSlug, articleSlug string) ([]string, error) {
-	var locales = make([]string, 0)
-	if err := m.q.GetPublishedArticleLocales.Select(&locales, helpCenterSlug, articleSlug); err != nil {
-		m.lo.Error("error fetching article locales", "error", err, "help_center_slug", helpCenterSlug, "article_slug", articleSlug)
-		return nil, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
-	}
-	return locales, nil
-}
-
 // GetPublishedCollectionLocales returns the locales a published collection with the given slug exists in.
 func (m *Manager) GetPublishedCollectionLocales(helpCenterSlug, collectionSlug string) ([]string, error) {
 	var locales = make([]string, 0)
diff --git a/internal/helpcenter/queries.sql b/internal/helpcenter/queries.sql
index 5b6c8c32..a0c4e5c6 100644
--- a/internal/helpcenter/queries.sql
+++ b/internal/helpcenter/queries.sql
@@ -373,21 +373,6 @@ WHERE a.translation_group_id = (SELECT translation_group_id FROM help_articles W
     AND a.status = 'published'
 ORDER BY a.locale;
 
--- name: get-published-article-locales
-WITH RECURSIVE published_collections AS (
-    SELECT c.id FROM article_collections c
-    JOIN help_centers h ON h.id = c.help_center_id
-    WHERE h.slug = $1 AND c.parent_id IS NULL AND c.is_published = true
-    UNION
-    SELECT c.id FROM article_collections c
-    JOIN published_collections p ON c.parent_id = p.id
-    WHERE c.is_published = true
-)
-SELECT DISTINCT a.locale
-FROM help_articles a
-JOIN article_collections c ON c.id = a.collection_id AND c.locale = a.locale AND c.id IN (SELECT id FROM published_collections)
-WHERE a.slug = $2 AND a.status = 'published';
-
 -- name: get-published-collection-locales
 WITH RECURSIVE published_collections AS (
     SELECT c.id FROM article_collections c
diff --git a/internal/migrations/v2.10.0.go b/internal/migrations/v2.10.0.go
deleted file mode 100644
index 579746db..00000000
--- a/internal/migrations/v2.10.0.go
+++ /dev/null
@@ -1,51 +0,0 @@
-package migrations
-
-import (
-	"github.com/jmoiron/sqlx"
-	"github.com/knadh/koanf/v2"
-	"github.com/knadh/stuffbin"
-)
-
-func V2_10_0(db *sqlx.DB, fs stuffbin.FileSystem, ko *koanf.Koanf) error {
-	_, err := db.Exec(`
-CREATE TABLE IF NOT EXISTS widget_campaign_deliveries (
-    id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
-    campaign_id UUID NOT NULL,
-    inbox_id INTEGER NOT NULL REFERENCES inboxes(id) ON DELETE CASCADE,
-    browser_key UUID NOT NULL,
-    session_key UUID NOT NULL,
-    contact_id BIGINT REFERENCES users(id) ON DELETE SET NULL,
-    snapshot JSONB NOT NULL,
-    created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
-    displayed BOOLEAN NOT NULL DEFAULT FALSE,
-    opened BOOLEAN NOT NULL DEFAULT FALSE,
-    dismissed BOOLEAN NOT NULL DEFAULT FALSE,
-    replied BOOLEAN NOT NULL DEFAULT FALSE,
-    conversation_uuid UUID REFERENCES conversations(uuid) ON DELETE SET NULL
-);
-CREATE INDEX IF NOT EXISTS idx_widget_campaign_browser ON widget_campaign_deliveries(inbox_id, browser_key, created_at DESC);
-CREATE INDEX IF NOT EXISTS idx_widget_campaign_contact ON widget_campaign_deliveries(inbox_id, contact_id, created_at DESC) WHERE contact_id IS NOT NULL;
-CREATE INDEX IF NOT EXISTS idx_widget_campaign_stats ON widget_campaign_deliveries(inbox_id, campaign_id, created_at);
-
-ALTER TABLE help_articles ADD COLUMN IF NOT EXISTS translation_group_id UUID;
-WITH article_groups AS MATERIALIZED (
-    SELECT c.help_center_id, a.slug,
-        COALESCE(MIN(a.translation_group_id::TEXT)::UUID, gen_random_uuid()) AS group_id
-    FROM help_articles a
-    JOIN article_collections c ON c.id = a.collection_id
-    GROUP BY c.help_center_id, a.slug
-    HAVING COUNT(*) = COUNT(DISTINCT a.locale)
-)
-UPDATE help_articles a
-SET translation_group_id = g.group_id
-FROM article_collections c
-JOIN article_groups g ON g.help_center_id = c.help_center_id
-WHERE a.collection_id = c.id AND a.slug = g.slug AND a.translation_group_id IS NULL;
-UPDATE help_articles SET translation_group_id = gen_random_uuid() WHERE translation_group_id IS NULL;
-ALTER TABLE help_articles ALTER COLUMN translation_group_id SET DEFAULT gen_random_uuid();
-ALTER TABLE help_articles ALTER COLUMN translation_group_id SET NOT NULL;
-CREATE UNIQUE INDEX IF NOT EXISTS index_unique_help_articles_on_translation_group_locale
-    ON help_articles(translation_group_id, locale);
-`)
-	return err
-}
diff --git a/internal/migrations/v2.10.0_test.go b/internal/migrations/v2.10.0_test.go
deleted file mode 100644
index 1f3ce89a..00000000
--- a/internal/migrations/v2.10.0_test.go
+++ /dev/null
@@ -1,80 +0,0 @@
-package migrations
-
-import (
-	"testing"
-
-	"github.com/abhinavxd/libredesk/internal/testutil"
-)
-
-func TestWidgetCampaignMigration(t *testing.T) {
-	db := testutil.NewDB(t, "widget_migration")
-	db.MustExec(`DROP TABLE widget_campaign_deliveries`)
-	for range 2 {
-		if err := V2_10_0(db, nil, nil); err != nil {
-			t.Fatal(err)
-		}
-	}
-	var count int
-	if err := db.Get(&count, `SELECT COUNT(*) FROM pg_indexes WHERE tablename = 'widget_campaign_deliveries'`); err != nil {
-		t.Fatal(err)
-	}
-	if count != 4 {
-		t.Fatalf("expected primary key and three indexes, got %d", count)
-	}
-}
-
-func TestHelpArticleTranslationGroupMigration(t *testing.T) {
-	db := testutil.NewDB(t, "article_translation_group_migration")
-	db.MustExec(`
-		INSERT INTO help_centers (name, slug, allowed_locales) VALUES ('Docs', 'docs', '["en", "fr"]');
-		INSERT INTO article_collections (help_center_id, slug, locale, name) VALUES
-			(1, 'general', 'en', 'General'),
-			(1, 'general', 'fr', 'Général'),
-			(1, 'other', 'en', 'Other');
-		INSERT INTO help_articles (collection_id, slug, locale, title) VALUES
-			(1, 'billing', 'en', 'Billing'),
-			(2, 'billing', 'fr', 'Facturation'),
-			(1, 'refunds', 'en', 'Refunds'),
-			(1, 'overview', 'en', 'Overview'),
-			(3, 'overview', 'en', 'Another overview');
-		ALTER TABLE help_articles DROP COLUMN translation_group_id;
-	`)
-
-	for range 2 {
-		if err := V2_10_0(db, nil, nil); err != nil {
-			t.Fatal(err)
-		}
-	}
-
-	var grouped int
-	if err := db.Get(&grouped, `
-		SELECT COUNT(DISTINCT translation_group_id)
-		FROM help_articles
-		WHERE slug = 'billing'
-	`); err != nil {
-		t.Fatal(err)
-	}
-	if grouped != 1 {
-		t.Fatalf("expected same-slug translations in one group, got %d groups", grouped)
-	}
-
-	var totalGroups int
-	if err := db.Get(&totalGroups, `SELECT COUNT(DISTINCT translation_group_id) FROM help_articles`); err != nil {
-		t.Fatal(err)
-	}
-	if totalGroups != 4 {
-		t.Fatalf("expected unrelated articles in separate groups, got %d groups", totalGroups)
-	}
-
-	var ambiguousGroups int
-	if err := db.Get(&ambiguousGroups, `
-		SELECT COUNT(DISTINCT translation_group_id)
-		FROM help_articles
-		WHERE slug = 'overview'
-	`); err != nil {
-		t.Fatal(err)
-	}
-	if ambiguousGroups != 2 {
-		t.Fatalf("expected ambiguous same-locale articles to remain separate, got %d groups", ambiguousGroups)
-	}
-}
diff --git a/internal/migrations/v2.9.0.go b/internal/migrations/v2.9.0.go
index 3ceb2943..b088ddd7 100644
--- a/internal/migrations/v2.9.0.go
+++ b/internal/migrations/v2.9.0.go
@@ -216,5 +216,31 @@ func V2_9_0(db *sqlx.DB, fs stuffbin.FileSystem, ko *koanf.Koanf) error {
 ', false, 'Conversation reopened', 'Conversation #{{ .Conversation.ReferenceNumber }} reopened', true
 		WHERE NOT EXISTS (SELECT 1 FROM templates WHERE "name" = 'Conversation reopened');
 	`)
+	if _, err := db.Exec(`
+CREATE TABLE IF NOT EXISTS widget_campaign_deliveries (
+    id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
+    campaign_id UUID NOT NULL,
+    inbox_id INTEGER NOT NULL REFERENCES inboxes(id) ON DELETE CASCADE,
+    browser_key UUID NOT NULL,
+    session_key UUID NOT NULL,
+    contact_id BIGINT REFERENCES users(id) ON DELETE SET NULL,
+    snapshot JSONB NOT NULL,
+    created_at TIMESTAMPTZ NOT NULL DEFAULT NOW(),
+    displayed BOOLEAN NOT NULL DEFAULT FALSE,
+    opened BOOLEAN NOT NULL DEFAULT FALSE,
+    dismissed BOOLEAN NOT NULL DEFAULT FALSE,
+    replied BOOLEAN NOT NULL DEFAULT FALSE,
+    conversation_uuid UUID REFERENCES conversations(uuid) ON DELETE SET NULL
+);
+CREATE INDEX IF NOT EXISTS idx_widget_campaign_browser ON widget_campaign_deliveries(inbox_id, browser_key, created_at DESC);
+CREATE INDEX IF NOT EXISTS idx_widget_campaign_contact ON widget_campaign_deliveries(inbox_id, contact_id, created_at DESC) WHERE contact_id IS NOT NULL;
+CREATE INDEX IF NOT EXISTS idx_widget_campaign_stats ON widget_campaign_deliveries(inbox_id, campaign_id, created_at);
+
+ALTER TABLE help_articles ADD COLUMN IF NOT EXISTS translation_group_id UUID NOT NULL DEFAULT gen_random_uuid();
+CREATE UNIQUE INDEX IF NOT EXISTS index_unique_help_articles_on_translation_group_locale
+    ON help_articles(translation_group_id, locale);
+`); err != nil {
+		return err
+	}
 	return err
 }
diff --git a/internal/migrations/v2.9.0_test.go b/internal/migrations/v2.9.0_test.go
index d68b4bf6..02ef41b7 100644
--- a/internal/migrations/v2.9.0_test.go
+++ b/internal/migrations/v2.9.0_test.go
@@ -156,3 +156,48 @@ func TestV2_9_0PreservesExistingQueuedEmails(t *testing.T) {
 		t.Fatal("existing queued email changed")
 	}
 }
+
+func TestWidgetCampaignMigration(t *testing.T) {
+	db := testutil.NewDB(t, "widget_migration")
+	db.MustExec(`DROP TABLE widget_campaign_deliveries`)
+	for range 2 {
+		if err := V2_9_0(db, nil, nil); err != nil {
+			t.Fatal(err)
+		}
+	}
+	var count int
+	if err := db.Get(&count, `SELECT COUNT(*) FROM pg_indexes WHERE tablename = 'widget_campaign_deliveries'`); err != nil {
+		t.Fatal(err)
+	}
+	if count != 4 {
+		t.Fatalf("expected primary key and three indexes, got %d", count)
+	}
+}
+
+func TestHelpArticleTranslationGroupMigration(t *testing.T) {
+	db := testutil.NewDB(t, "article_translation_group_migration")
+	db.MustExec(`
+		INSERT INTO help_centers (name, slug, allowed_locales) VALUES ('Docs', 'docs', '["en", "fr"]');
+		INSERT INTO article_collections (help_center_id, slug, locale, name) VALUES
+			(1, 'general', 'en', 'General'),
+			(1, 'general', 'fr', 'Général');
+		INSERT INTO help_articles (collection_id, slug, locale, title) VALUES
+			(1, 'billing', 'en', 'Billing'),
+			(2, 'billing', 'fr', 'Facturation');
+		ALTER TABLE help_articles DROP COLUMN translation_group_id;
+	`)
+
+	for range 2 {
+		if err := V2_9_0(db, nil, nil); err != nil {
+			t.Fatal(err)
+		}
+	}
+
+	var groups int
+	if err := db.Get(&groups, `SELECT COUNT(DISTINCT translation_group_id) FROM help_articles`); err != nil {
+		t.Fatal(err)
+	}
+	if groups != 2 {
+		t.Fatalf("expected every existing article in its own group, got %d groups", groups)
+	}
+}
diff --git a/static/widget.js b/static/widget.js
index e8adf757..6c2b6f92 100644
--- a/static/widget.js
+++ b/static/widget.js
@@ -310,7 +310,7 @@
             const reducedMotion = window.matchMedia && window.matchMedia('(prefers-reduced-motion: reduce)').matches;
             const iframeTransition = reducedMotion
                 ? 'none'
-                : 'width 0.3s ease, height 0.3s ease, bottom 0.3s ease, border-radius 0.3s ease, box-shadow 0.3s ease';
+                : 'width 0.18s ease, height 0.18s ease, bottom 0.18s ease, border-radius 0.18s ease, box-shadow 0.18s ease';
 
             this.iframe = document.createElement('iframe');
             this.iframe.src = `${this.config.baseURL}/widget?inbox_id=${encodeURIComponent(this.config.inboxID)}&parent_origin=${encodeURIComponent(window.location.origin)}`;

From 7c9fac4f4a4f4e5f167dac6b2b256d4658e49171 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sat, 19 Sep 2026 02:26:37 +0530
Subject: [PATCH 113/178] show idle agents as online instead of away

Idle agents still get auto-assigned tickets. Only the manual away
statuses skip them. The amber away dot made other agents think the
idle person would not get tickets. The agent picker, widget header
and the agents report now treat idle as online.
---
 frontend/apps/widget/src/components/ChatTitle.vue | 12 ++++++++++--
 frontend/shared-ui/components/StatusDot.vue       |  6 ++----
 internal/report/queries.sql                       |  4 ++--
 3 files changed, 14 insertions(+), 8 deletions(-)

diff --git a/frontend/apps/widget/src/components/ChatTitle.vue b/frontend/apps/widget/src/components/ChatTitle.vue
index 30e20847..6b26114b 100644
--- a/frontend/apps/widget/src/components/ChatTitle.vue
+++ b/frontend/apps/widget/src/components/ChatTitle.vue
@@ -53,6 +53,14 @@ const widgetStore = useWidgetStore()
 const { resolveBusinessHours, getBusinessHoursStatus } = useBusinessHours()
 const { t } = useI18n()
 
+const isAgentOnline = (status) => status === 'online' || status === 'away'
+
+const displayStatus = (status) => {
+  if (isAgentOnline(status)) return 'online'
+  if (status?.startsWith('away')) return 'away'
+  return status
+}
+
 const businessHoursStatus = computed(() => {
   const config = widgetStore.config
 
@@ -93,7 +101,7 @@ const businessHoursStatus = computed(() => {
 
   // Within business hours: show expectation message when agent is not online.
   const assignee = chatStore.currentConversation?.assignee
-  if (assignee?.availability_status !== 'online' && withinHoursMessage) {
+  if (!isAgentOnline(assignee?.availability_status) && withinHoursMessage) {
     return withinHoursMessage
   }
   return null
@@ -118,7 +126,7 @@ const chatTitle = computed(() => {
       name: assignee.first_name,
       avatarUrl: assignee.avatar_url || '',
       avatarFallback: assignee.first_name.charAt(0).toUpperCase(),
-      availability_status: assignee.availability_status?.startsWith('away') ? 'away' : assignee.availability_status,
+      availability_status: displayStatus(assignee.availability_status),
       expectation: assignee.expectation || '',
       hasAssignee: true
     }
diff --git a/frontend/shared-ui/components/StatusDot.vue b/frontend/shared-ui/components/StatusDot.vue
index 09ebaa39..85cf3acb 100644
--- a/frontend/shared-ui/components/StatusDot.vue
+++ b/frontend/shared-ui/components/StatusDot.vue
@@ -50,11 +50,9 @@ const props = defineProps({
   }
 })
 
-const isOnline = computed(() => props.status === 'online')
+const isOnline = computed(() => ['online', 'away'].includes(props.status))
 
-const isAway = computed(() =>
-  ['away', 'away_manual', 'away_and_reassigning'].includes(props.status)
-)
+const isAway = computed(() => ['away_manual', 'away_and_reassigning'].includes(props.status))
 
 const sizeClass = computed(() => {
   const sizes = {
diff --git a/internal/report/queries.sql b/internal/report/queries.sql
index 646ed810..46c39cee 100644
--- a/internal/report/queries.sql
+++ b/internal/report/queries.sql
@@ -24,7 +24,7 @@ agents AS (
     SELECT
         COUNT(*) FILTER (
             WHERE
-                availability_status = 'online'
+                availability_status IN ('online', 'away')
         ) AS agents_online,
         COUNT(*) FILTER (
             WHERE
@@ -36,7 +36,7 @@ agents AS (
         ) AS agents_reassigning,
         COUNT(*) FILTER (
             WHERE
-                availability_status IN ('offline', 'away')
+                availability_status = 'offline'
         ) AS agents_offline
     FROM
         users

From ec00b94be50759cb3dfc901f960895e9132caf09 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sat, 19 Sep 2026 03:48:34 +0530
Subject: [PATCH 114/178] speed up builds and load app layouts on demand

---
 Makefile                               | 10 ++++------
 frontend/apps/main/index.html          |  2 +-
 frontend/apps/main/src/router/index.js | 25 ++++++++++---------------
 frontend/apps/widget/index.html        |  2 +-
 frontend/pnpm-lock.yaml                | 10 +++++-----
 5 files changed, 21 insertions(+), 28 deletions(-)

diff --git a/Makefile b/Makefile
index 51a08865..6ed9d630 100644
--- a/Makefile
+++ b/Makefile
@@ -30,10 +30,7 @@ install-deps: $(STUFFBIN)
 
 # Build the frontend for production (both apps).
 .PHONY: frontend-build
-frontend-build: install-deps
-	@echo "→ Building frontend for production - main app & widget..."
-	@export VITE_APP_VERSION="${VERSION}" && cd ${FRONTEND_DIR} && pnpm build:main
-	@export VITE_APP_VERSION="${VERSION}" && cd ${FRONTEND_DIR} && pnpm build:widget
+frontend-build: frontend-build-main frontend-build-widget
 
 # Build only the main frontend app.
 .PHONY: frontend-build-main
@@ -81,13 +78,14 @@ run-frontend-widget:
 .PHONY: build-backend
 build-backend: $(STUFFBIN)
 	@echo "→ Building backend..."
-	@CGO_ENABLED=0 go build -a \
+	@CGO_ENABLED=0 go build \
 		-ldflags="-X 'main.buildString=${BUILDSTR}' -X 'main.versionString=${VERSION}' -X 'github.com/abhinavxd/libredesk/internal/version.Version=${VERSION}' -s -w" \
 		-o ${BIN} cmd/*.go
 
 # Main build target: builds both frontend and backend, then stuffs static assets into the binary.
 .PHONY: build
-build: frontend-build build-backend stuff
+build: frontend-build build-backend
+	@$(MAKE) --no-print-directory stuff
 	@echo "→ Build successful. Current version: $(VERSION)"
 
 # Stuff static assets into the binary using stuffbin.
diff --git a/frontend/apps/main/index.html b/frontend/apps/main/index.html
index 63340480..1ce7e812 100644
--- a/frontend/apps/main/index.html
+++ b/frontend/apps/main/index.html
@@ -9,7 +9,7 @@
   <link rel="manifest" href="/manifest.webmanifest" crossorigin="use-credentials" />
   <link rel="apple-touch-icon" href="/images/pwa-icon-192.png" />
   <link rel="preload" href="/static/public/static/fonts/Geist-Variable.woff2" as="font" type="font/woff2" crossorigin>
-  <link rel="stylesheet" href="/static/public/static/fonts.css">
+  <link rel="stylesheet" href="/static/public/static/fonts.css" vite-ignore>
 </head>
 
 <body>
diff --git a/frontend/apps/main/src/router/index.js b/frontend/apps/main/src/router/index.js
index 7ea886b3..e6f16410 100644
--- a/frontend/apps/main/src/router/index.js
+++ b/frontend/apps/main/src/router/index.js
@@ -1,17 +1,12 @@
 import { createRouter, createWebHistory } from 'vue-router'
-import App from '@main/App.vue'
-import OuterApp from '@main/OuterApp.vue'
-import InboxLayout from '@main/layouts/inbox/InboxLayout.vue'
-import AccountLayout from '@main/layouts/account/AccountLayout.vue'
-import AdminLayout from '@main/layouts/admin/AdminLayout.vue'
-import { useAppSettingsStore } from '../stores/appSettings'
-import { getI18n } from '../i18n'
-import { abortRouteScope } from '../api'
+import { useAppSettingsStore } from '@main/stores/appSettings'
+import { getI18n } from '@main/i18n'
+import { abortRouteScope } from '@main/api'
 
 const routes = [
   {
     path: '/',
-    component: OuterApp,
+    component: () => import('@main/OuterApp.vue'),
     children: [
       {
         path: '',
@@ -35,7 +30,7 @@ const routes = [
   },
   {
     path: '/',
-    component: App,
+    component: () => import('@main/App.vue'),
     children: [
       {
         path: 'contacts',
@@ -66,7 +61,7 @@ const routes = [
         path: '/inboxes/teams/:teamID',
         name: 'teams',
         props: true,
-        component: InboxLayout,
+        component: () => import('@main/layouts/inbox/InboxLayout.vue'),
         meta: { titleKey: 'globals.terms.teamInbox', hidePageHeader: true },
         children: [
           {
@@ -90,7 +85,7 @@ const routes = [
         path: '/inboxes/views/:viewID',
         name: 'views',
         props: true,
-        component: InboxLayout,
+        component: () => import('@main/layouts/inbox/InboxLayout.vue'),
         meta: { titleKey: 'globals.terms.view', hidePageHeader: true },
         children: [
           {
@@ -120,7 +115,7 @@ const routes = [
         path: '/inboxes/:type(assigned|unassigned|all|mentioned)?',
         name: 'inboxes',
         redirect: '/inboxes/assigned',
-        component: InboxLayout,
+        component: () => import('@main/layouts/inbox/InboxLayout.vue'),
         props: true,
         meta: { titleKey: 'globals.terms.inbox', hidePageHeader: true },
         children: [
@@ -164,7 +159,7 @@ const routes = [
         path: '/account/:page?',
         name: 'account',
         redirect: '/account/profile',
-        component: AccountLayout,
+        component: () => import('@main/layouts/account/AccountLayout.vue'),
         props: true,
         meta: { titleKey: 'globals.terms.account' },
         children: [
@@ -186,7 +181,7 @@ const routes = [
       {
         path: '/admin',
         name: 'admin',
-        component: AdminLayout,
+        component: () => import('@main/layouts/admin/AdminLayout.vue'),
         meta: { titleKey: 'globals.terms.admin' },
         children: [
           {
diff --git a/frontend/apps/widget/index.html b/frontend/apps/widget/index.html
index 66ac7efe..61b57d1b 100644
--- a/frontend/apps/widget/index.html
+++ b/frontend/apps/widget/index.html
@@ -7,7 +7,7 @@
   <meta name="viewport" content="width=device-width, initial-scale=1.0" />
   <title>libredesk Chat Widget</title>
   <link rel="preload" href="/static/public/static/fonts/Geist-Variable.woff2" as="font" type="font/woff2" crossorigin>
-  <link rel="stylesheet" href="/static/public/static/fonts.css">
+  <link rel="stylesheet" href="/static/public/static/fonts.css" vite-ignore>
 </head>
 
 <body>
diff --git a/frontend/pnpm-lock.yaml b/frontend/pnpm-lock.yaml
index 0fa33df3..3e0f6ff6 100644
--- a/frontend/pnpm-lock.yaml
+++ b/frontend/pnpm-lock.yaml
@@ -1751,8 +1751,8 @@ packages:
     resolution: {integrity: sha512-QOSvevhslijgYwRx6Rv7zKdMF8lbRmx+uQGx2+vDc+KI/eBnsy9kit5aj23AgGu3pa4t9AgwbnXWqS+iOY+2aA==}
     engines: {node: '>= 6'}
 
-  caniuse-lite@1.0.30001784:
-    resolution: {integrity: sha512-WU346nBTklUV9YfUl60fqRbU5ZqyXlqvo1SgigE1OAXK5bFL8LL9q1K7aap3N739l4BvNqnkm3YrGHiY9sfUQw==}
+  caniuse-lite@1.0.30001810:
+    resolution: {integrity: sha512-TITQPUkaz+aVk5GL6NhOdwk1aEaNTSDPsGFWrTuhKGtjTF70jL/Oht2W4c6rXUe5fu7Ie19VIahAXHIIiWWNeg==}
 
   caseless@0.12.0:
     resolution: {integrity: sha512-4tYFyifaFfGacoiObjJegolkwSU4xQNGbVgUiNYVUxbQ2x2lUsFvY4hVgVzGiIe6WLOPqycWXA40l+PWsxthUw==}
@@ -5464,7 +5464,7 @@ snapshots:
   autoprefixer@10.4.20(postcss@8.5.23):
     dependencies:
       browserslist: 4.24.4
-      caniuse-lite: 1.0.30001784
+      caniuse-lite: 1.0.30001810
       fraction.js: 4.3.7
       normalize-range: 0.1.2
       picocolors: 1.1.1
@@ -5528,7 +5528,7 @@ snapshots:
 
   browserslist@4.24.4:
     dependencies:
-      caniuse-lite: 1.0.30001784
+      caniuse-lite: 1.0.30001810
       electron-to-chromium: 1.5.80
       node-releases: 2.0.19
       update-browserslist-db: 1.1.2(browserslist@4.24.4)
@@ -5556,7 +5556,7 @@ snapshots:
 
   camelcase-css@2.0.1: {}
 
-  caniuse-lite@1.0.30001784: {}
+  caniuse-lite@1.0.30001810: {}
 
   caseless@0.12.0: {}
 

From f6f1bb4ad1d84740f8606a909535e69985ab1864 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sat, 19 Sep 2026 03:58:04 +0530
Subject: [PATCH 115/178] show helpcenter article as is inside the widget. adds
 new ?embed query param that shows the entire helpcenter in embed mode

---
 cmd/chat.go                                   |   1 +
 cmd/helpcenter.go                             |  52 ++++-
 .../admin/help-center/HelpCenterForm.vue      |  32 +++
 .../admin/help-center/helpCenterFormSchema.js |   1 +
 .../features/admin/inbox/WidgetCampaigns.vue  |   1 -
 frontend/apps/main/src/stores/inbox.js        |   5 +
 .../src/utils/conversation-message-cache.js   |   4 +-
 frontend/apps/widget/src/api/index.js         |   7 -
 .../widget/src/components/ArticleReader.vue   |  97 ++++----
 .../apps/widget/src/components/ChatHeader.vue |   2 +-
 frontend/apps/widget/src/store/help.js        |  20 --
 frontend/apps/widget/src/store/help.test.js   |  77 -------
 frontend/apps/widget/src/views/HelpView.vue   | 213 +++++-------------
 i18n/en-US.json                               |   3 +
 internal/conversation/conversation.go         |   2 +
 internal/conversation/message.go              |   1 +
 internal/conversation/models/models.go        |   1 +
 internal/conversation/queries.sql             |   2 +-
 internal/helpcenter/helpcenter.go             |   7 +-
 internal/helpcenter/models/models.go          |   3 +
 internal/helpcenter/queries.sql               |  14 +-
 internal/migrations/v2.9.0.go                 |  11 +-
 schema.sql                                    |   1 +
 static/public/static/article-content.css      |  20 ++
 .../web-templates/help/classic/article.html   |   4 +-
 .../web-templates/help/classic/layout.html    |   8 +-
 .../web-templates/help/docs/article.html      |   2 +-
 .../web-templates/help/docs/layout.html       |   8 +-
 .../web-templates/help/shared/partials.html   |  79 +++++++
 static/widget.js                              |   4 +-
 30 files changed, 330 insertions(+), 352 deletions(-)
 delete mode 100644 frontend/apps/widget/src/store/help.test.js

diff --git a/cmd/chat.go b/cmd/chat.go
index 068bad34..5e0bd3cc 100644
--- a/cmd/chat.go
+++ b/cmd/chat.go
@@ -781,6 +781,7 @@ func sendChatMessageResponse(app *App, r *fastglue.Request, messageUUID string)
 	author.Email = null.String{}
 
 	return r.SendEnvelope(cmodels.ChatMessage{
+		ID:               message.ID,
 		UUID:             message.UUID,
 		CreatedAt:        message.CreatedAt,
 		Content:          message.Content,
diff --git a/cmd/helpcenter.go b/cmd/helpcenter.go
index 37793dbe..2675767a 100644
--- a/cmd/helpcenter.go
+++ b/cmd/helpcenter.go
@@ -21,6 +21,7 @@ import (
 	"github.com/abhinavxd/libredesk/internal/envelope"
 	"github.com/abhinavxd/libredesk/internal/helpcenter"
 	hcmodels "github.com/abhinavxd/libredesk/internal/helpcenter/models"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat"
 	"github.com/abhinavxd/libredesk/internal/media"
 	"github.com/abhinavxd/libredesk/internal/stringutil"
 	realip "github.com/ferluci/fast-realip"
@@ -260,7 +261,7 @@ func handleHelpCenterPreview(r *fastglue.Request) error {
 		"Data": map[string]interface{}{
 			"Title":       helpCenter.PageTitle,
 			"LandingHero": true,
-			"HelpCenter":  helpCenterTemplateData(app, helpCenter, locale),
+			"HelpCenter":  helpCenterTemplateData(app, r, helpCenter, locale),
 			"Tree":        tree.Tree,
 			"Popular":     popular,
 		},
@@ -629,7 +630,7 @@ func handleShowHelpCenterHome(r *fastglue.Request) error {
 		theme           = helpCenterTheme(tree.HelpCenter)
 		metaDescription = firstNonEmpty(tree.HelpCenter.MetaDescription, theme.Header.Heading)
 	)
-	data := helpCenterTemplateData(app, tree.HelpCenter, locale)
+	data := helpCenterTemplateData(app, r, tree.HelpCenter, locale)
 	return renderHelpCenterPage(r, hcPageName(helpCenter, "help-center"), map[string]interface{}{
 		"L": localeI18n(app, locale),
 		"Data": map[string]interface{}{
@@ -683,7 +684,7 @@ func handleShowHelpCenterCollection(r *fastglue.Request) error {
 		root    = helpCenterBaseURL(app, helpCenter)
 		pathFor = func(l string) string { return collectionPath(helpCenter, l, collection.Slug) }
 	)
-	data := helpCenterTemplateData(app, helpCenter, locale)
+	data := helpCenterTemplateData(app, r, helpCenter, locale)
 	return renderHelpCenterPage(r, hcPageName(helpCenter, "help-collection"), map[string]interface{}{
 		"L": localeI18n(app, locale),
 		"Data": map[string]interface{}{
@@ -765,7 +766,7 @@ func handleShowHelpCenterArticle(r *fastglue.Request) error {
 		metaTitle       = firstNonEmpty(article.MetaTitle, fmt.Sprintf("%s - %s", article.Title, helpCenter.Name))
 		ogImage         = absoluteURL(root, publicAssetPaths(app, firstNonEmpty(article.MetaImageURL, helpCenterTheme(helpCenter).LogoURL)))
 	)
-	data := helpCenterTemplateData(app, helpCenter, locale)
+	data := helpCenterTemplateData(app, r, helpCenter, locale)
 	return renderHelpCenterPage(r, hcPageName(helpCenter, "help-article"), map[string]interface{}{
 		"L": localeI18n(app, locale),
 		"Data": map[string]interface{}{
@@ -788,6 +789,7 @@ func handleShowHelpCenterArticle(r *fastglue.Request) error {
 			"Tree":             sidebarTree(app, helpCenter, locale),
 			"ActiveCollection": collection.Slug,
 			"ActiveArticle":    article.Slug,
+			"NoIndex":          isEmbedRequest(r),
 			"Content":          template.HTML(publicAssetPaths(app, stringutil.DeferOffscreenImages(article.Content))),
 		},
 	})
@@ -821,7 +823,7 @@ func handleHelpCenterSearch(r *fastglue.Request) error {
 		}
 	}
 	var (
-		data    = helpCenterTemplateData(app, helpCenter, locale)
+		data    = helpCenterTemplateData(app, r, helpCenter, locale)
 		lcl     = localeI18n(app, locale)
 		pathFor = func(l string) string { return searchPath(helpCenter, l) }
 	)
@@ -1171,9 +1173,11 @@ func cacheHCPage(h fastglue.FastRequestHandler, noIndex bool) fastglue.FastReque
 			}
 			r.RequestCtx.Response.Header.Set("X-Cache", status)
 			r.RequestCtx.Response.Header.Set("X-Content-Type-Options", "nosniff")
-			r.RequestCtx.Response.Header.Set("X-Frame-Options", "SAMEORIGIN")
+			if !isEmbedRequest(r) {
+				r.RequestCtx.Response.Header.Set("X-Frame-Options", "SAMEORIGIN")
+			}
 			r.RequestCtx.Response.Header.Set("Referrer-Policy", "strict-origin-when-cross-origin")
-			if noIndex || isMarkdownRequest(r) {
+			if noIndex || isEmbedRequest(r) || isMarkdownRequest(r) {
 				r.RequestCtx.Response.Header.Set("X-Robots-Tag", noIndexHeader)
 			}
 		}
@@ -1181,6 +1185,11 @@ func cacheHCPage(h fastglue.FastRequestHandler, noIndex bool) fastglue.FastReque
 	}
 }
 
+// isEmbedRequest reports whether the page is framed by the chat widget.
+func isEmbedRequest(r *fastglue.Request) bool {
+	return string(r.RequestCtx.QueryArgs().Peek("embed")) == "1"
+}
+
 func isMarkdownRequest(r *fastglue.Request) bool {
 	slug, _ := r.RequestCtx.UserValue("article_slug").(string)
 	return strings.HasSuffix(slug, markdownSlugExtension)
@@ -1696,7 +1705,7 @@ func sidebarTree(app *App, hc hcmodels.HelpCenter, locale string) []hcmodels.Tre
 }
 
 // helpCenterTemplateData shapes a help center row for the public templates.
-func helpCenterTemplateData(app *App, hc hcmodels.HelpCenter, locale string) map[string]interface{} {
+func helpCenterTemplateData(app *App, r *fastglue.Request, hc hcmodels.HelpCenter, locale string) map[string]interface{} {
 	theme := helpCenterTheme(hc)
 	theme.Favicon = publicAssetPaths(app, theme.Favicon)
 	theme.Header.BackgroundImage = publicAssetPaths(app, theme.Header.BackgroundImage)
@@ -1728,9 +1737,23 @@ func helpCenterTemplateData(app *App, hc hcmodels.HelpCenter, locale string) map
 		"AnnouncementHTML":  template.HTML(helpcenter.RenderInlineMarkdown(theme.Announcement.Text)),
 		"CustomCSS":         template.CSS(hc.CustomCSS),
 		"CustomJS":          template.JS(hc.CustomJS),
+		"WidgetInboxUUID":   livechatWidgetInboxUUID(app, hc),
+		"WidgetRootURL":     helpCenterRootURL(app),
+		"Embed":             isEmbedRequest(r),
 	}
 }
 
+func livechatWidgetInboxUUID(app *App, hc hcmodels.HelpCenter) string {
+	if !hc.LivechatInboxID.Valid {
+		return ""
+	}
+	inb, err := app.inbox.GetDBRecord(hc.LivechatInboxID.Int)
+	if err != nil || !inb.Enabled || inb.Channel != livechat.ChannelLiveChat {
+		return ""
+	}
+	return inb.UUID
+}
+
 // announcementKey keys the dismissal on help center and content, so an edited announcement reappears for visitors who dismissed the old one.
 func announcementKey(hcSlug string, a hcmodels.AnnouncementTheme) string {
 	if a.Text == "" {
@@ -1806,7 +1829,7 @@ func renderHelpCenterStatusPage(r *fastglue.Request, hc *hcmodels.HelpCenter, st
 		if !ok {
 			locale = helpCenter.DefaultLocale
 		}
-		data := helpCenterTemplateData(app, helpCenter, locale)
+		data := helpCenterTemplateData(app, r, helpCenter, locale)
 		lcl := localeI18n(app, locale)
 		r.RequestCtx.Response.Header.Set("X-Robots-Tag", noIndexHeader)
 		rerr := app.tmpl.RenderWebPage(r.RequestCtx, hcPageName(helpCenter, "help-notfound"), map[string]interface{}{
@@ -1850,6 +1873,15 @@ func validateHelpCenter(app *App, req *helpcenter.HelpCenterRequest) error {
 		return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.empty", "name", "`page_title`"), nil)
 	}
 	req.Theme = json.RawMessage(publicAssetPaths(app, string(req.Theme)))
+	if req.LivechatInboxID.Valid {
+		inb, err := app.inbox.GetDBRecord(req.LivechatInboxID.Int)
+		if err != nil {
+			return err
+		}
+		if inb.Channel != livechat.ChannelLiveChat {
+			return envelope.NewError(envelope.InputError, app.i18n.T("helpCenter.invalidLivechatInbox"), nil)
+		}
+	}
 	return nil
 }
 
@@ -1988,7 +2020,7 @@ func renderHelpCenterArticlePreview(r *fastglue.Request, helpCenter hcmodels.Hel
 		"Data": map[string]interface{}{
 			"Title":         article.Title,
 			"ModifiedTime":  article.UpdatedAt.Format(time.RFC3339),
-			"HelpCenter":    helpCenterTemplateData(app, helpCenter, locale),
+			"HelpCenter":    helpCenterTemplateData(app, r, helpCenter, locale),
 			"Article":       article,
 			"AuthorInitial": authorInitial(article),
 			"Collection":    collection,
diff --git a/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue b/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue
index db5e9db6..86def789 100644
--- a/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue
+++ b/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue
@@ -40,6 +40,31 @@
             </FormItem>
           </FormField>
 
+          <FormField v-slot="{ componentField }" name="livechat_inbox_id">
+            <FormItem>
+              <FormLabel>{{ t('helpCenter.livechatInbox') }}</FormLabel>
+              <FormControl>
+                <Select v-bind="componentField">
+                  <SelectTrigger>
+                    <SelectValue :placeholder="t('placeholders.selectInbox')" />
+                  </SelectTrigger>
+                  <SelectContent>
+                    <SelectItem value="none">{{ t('globals.terms.none') }}</SelectItem>
+                    <SelectItem
+                      v-for="option in inboxStore.livechatOptions"
+                      :key="option.value"
+                      :value="option.value"
+                    >
+                      {{ option.label }}
+                    </SelectItem>
+                  </SelectContent>
+                </Select>
+              </FormControl>
+              <FormDescription>{{ t('helpCenter.livechatInboxHint') }}</FormDescription>
+              <FormMessage />
+            </FormItem>
+          </FormField>
+
           <FormField v-slot="{ componentField }" name="page_title">
             <FormItem>
               <FormLabel>{{ t('helpCenter.pageTitle') }}</FormLabel>
@@ -659,6 +684,7 @@ import { Tabs, TabsList, TabsTrigger } from '@shared-ui/components/ui/tabs'
 import CollapsibleSection from './CollapsibleSection.vue'
 import LinkListField from './LinkListField.vue'
 import SelectComboBox from '@/components/combobox/SelectCombobox.vue'
+import { useInboxStore } from '@/stores/inbox'
 import { createHelpCenterFormSchema } from './helpCenterFormSchema.js'
 import api from '@/api'
 import { useI18n } from 'vue-i18n'
@@ -699,6 +725,7 @@ const props = defineProps({
 const emit = defineEmits(['cancel', 'change'])
 
 const { t } = useI18n()
+const inboxStore = useInboxStore()
 
 const submitLabel = computed(() =>
   props.helpCenter ? t('globals.messages.update') : t('globals.messages.create')
@@ -719,6 +746,7 @@ const toFormValues = (hc) => ({
   slug: hc?.slug || '',
   template: hc?.template === 'docs' ? 'docs' : 'classic',
   custom_domain: hc?.custom_domain || '',
+  livechat_inbox_id: hc?.livechat_inbox_id ? String(hc.livechat_inbox_id) : 'none',
   page_title: hc?.page_title || '',
   meta_description: hc?.meta_description || '',
   custom_css: hc?.custom_css || '',
@@ -839,6 +867,10 @@ const toPayload = (values) => {
   const payload = JSON.parse(JSON.stringify(values))
   const allowed = cleanLocales(payload.allowed_locales)
   payload.allowed_locales = allowed.length ? allowed : ['en']
+  payload.livechat_inbox_id =
+    payload.livechat_inbox_id && payload.livechat_inbox_id !== 'none'
+      ? Number(payload.livechat_inbox_id)
+      : null
   if (payload.theme?.layout) {
     payload.theme.layout.columns = Number(payload.theme.layout.columns) || 2
   }
diff --git a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js
index 2465902c..ccea373a 100644
--- a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js
+++ b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js
@@ -96,6 +96,7 @@ const createBaseSchema = (t) => {
         t('helpCenter.invalidCustomDomain')
       )
       .optional(),
+    livechat_inbox_id: z.string().optional(),
     custom_css: z.string().optional(),
     custom_js: z.string().optional(),
     default_locale: z
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
index 24d7c20b..1e2d942f 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
@@ -494,7 +494,6 @@ onMounted(async () => {
               id="campaign-sender"
               :model-value="campaign.sender_id === 0 ? 'brand' : String(campaign.sender_id)"
               :prepend-items="[{ value: 'brand', label: t('widget.brandBot') }]"
-              exclude-ai-assistants
               @update:model-value="update('sender_id', $event === 'brand' ? 0 : Number($event))"
             />
           </div>
diff --git a/frontend/apps/main/src/stores/inbox.js b/frontend/apps/main/src/stores/inbox.js
index 22527e92..726070e1 100644
--- a/frontend/apps/main/src/stores/inbox.js
+++ b/frontend/apps/main/src/stores/inbox.js
@@ -16,6 +16,10 @@ export const useInboxStore = defineStore('inbox', () => {
     .filter(inb => inb.channel === 'email')
     .map(inb => ({ label: inb.name, value: String(inb.id) }))
   )
+  const livechatOptions = computed(() => inboxes.value
+    .filter(inb => inb.channel === 'livechat')
+    .map(inb => ({ label: inb.name, value: String(inb.id) }))
+  )
   const fetchInboxes = async (force = false) => {
     if (!force && inboxes.value.length) return
     try {
@@ -32,6 +36,7 @@ export const useInboxStore = defineStore('inbox', () => {
     inboxes,
     options,
     emailOptions,
+    livechatOptions,
     fetchInboxes,
   }
 })
\ No newline at end of file
diff --git a/frontend/apps/main/src/utils/conversation-message-cache.js b/frontend/apps/main/src/utils/conversation-message-cache.js
index f55b3106..8a8f24af 100644
--- a/frontend/apps/main/src/utils/conversation-message-cache.js
+++ b/frontend/apps/main/src/utils/conversation-message-cache.js
@@ -46,7 +46,7 @@ export default class MessageCache {
 
     getAllPagesMessages (convId) {
         return this._allMessages(convId)
-            .sort((a, b) => new Date(a.created_at) - new Date(b.created_at))
+            .sort((a, b) => new Date(a.created_at) - new Date(b.created_at) || (a.id || 0) - (b.id || 0))
     }
 
     getLatestMessage (convId, type = [], excludePrivate = false, excludeAutomated = false) {
@@ -56,7 +56,7 @@ export default class MessageCache {
             if (excludeAutomated && msg.meta?.is_automated) return false
             return true
         })
-        filtered.sort((a, b) => new Date(b.created_at) - new Date(a.created_at))
+        filtered.sort((a, b) => new Date(b.created_at) - new Date(a.created_at) || (b.id || 0) - (a.id || 0))
         return filtered.length ? filtered[0] : null
     }
 
diff --git a/frontend/apps/widget/src/api/index.js b/frontend/apps/widget/src/api/index.js
index 58a94c24..845474b9 100644
--- a/frontend/apps/widget/src/api/index.js
+++ b/frontend/apps/widget/src/api/index.js
@@ -142,12 +142,6 @@ const searchHelp = (q, locale) =>
   http.get('/api/v1/widget/chat/help/search', { params: { q, locale } })
 const getHelpArticle = (slug, locale) =>
   http.get(`/api/v1/widget/chat/help/articles/${encodeURIComponent(slug)}`, { params: { locale } })
-const sendHelpFeedback = (helpSlug, slug, locale, helpful) =>
-  http.post(
-    `/api/v1/public/help-centers/${encodeURIComponent(helpSlug)}/articles/${encodeURIComponent(slug)}/feedback`,
-    { helpful },
-    { params: { locale } }
-  )
 const sendChatMessage = (uuid, data) =>
   http.post(`/api/v1/widget/chat/conversations/${uuid}/message`, data)
 const submitHandoffForm = (uuid, formData) =>
@@ -190,7 +184,6 @@ export default {
   getHelp,
   searchHelp,
   getHelpArticle,
-  sendHelpFeedback,
   sendChatMessage,
   submitHandoffForm,
   closeChatConversation,
diff --git a/frontend/apps/widget/src/components/ArticleReader.vue b/frontend/apps/widget/src/components/ArticleReader.vue
index 2009af25..2f78eb19 100644
--- a/frontend/apps/widget/src/components/ArticleReader.vue
+++ b/frontend/apps/widget/src/components/ArticleReader.vue
@@ -1,66 +1,49 @@
 <script setup>
-import { computed, ref, onUnmounted } from 'vue'
-import articleCSS from '@public-static/article-content.css?raw'
+import { computed, onMounted, onUnmounted, ref } from 'vue'
 
-const props = defineProps({ article: { type: Object, required: true }, helpSlug: { type: String, required: true }, dark: Boolean })
-const emit = defineEmits(['article'])
-const frame = ref(null)
-const height = ref('0px')
-let observer = null
-const documentHTML = computed(() => {
-  const doc = document.implementation.createHTMLDocument(props.article.title)
-  const policy = doc.createElement('meta')
-  policy.httpEquiv = 'Content-Security-Policy'
-  policy.content = "default-src 'none'; img-src https: http: data:; style-src 'unsafe-inline'; font-src 'none'; frame-src 'none'; form-action 'none'; base-uri 'none'"
-  doc.head.append(policy)
-  const style = doc.createElement('style')
-  style.textContent = `${articleCSS}\nbody{margin:0;padding:16px;font:14px/1.6 system-ui;overflow-wrap:anywhere}html{overflow:hidden}img{max-width:100%}a{color:inherit}table{display:block;overflow:auto}.hc-prose pre{background:var(--hc-accent-tint);color:inherit}.hc-callout{background:var(--hc-accent-tint);color:inherit}`
-  doc.head.append(style)
-  doc.body.className = 'hc-prose'
-  doc.body.innerHTML = props.article.content
-  for (const element of doc.querySelectorAll('script,iframe,object,embed,form,base,meta,link,style')) {
-    if (!doc.head.contains(element)) element.remove()
-  }
-  for (const element of doc.body.querySelectorAll('*')) {
-    for (const attr of [...element.attributes]) {
-      if (attr.name.startsWith('on') || attr.name === 'srcdoc') element.removeAttribute(attr.name)
-    }
-    for (const attr of ['href', 'src']) {
-      const value = element.getAttribute(attr)
-      if (!value || value.startsWith('#')) continue
-      let url
-      try { url = new URL(value, window.location.origin) } catch { element.removeAttribute(attr); continue }
-      if (!['https:', 'http:', 'mailto:'].includes(url.protocol)) element.removeAttribute(attr)
-      else element.setAttribute(attr, url.href)
-    }
-  }
-  return '<!doctype html>' + doc.documentElement.outerHTML
+const props = defineProps({
+  article: { type: Object, required: true },
+  baseUrl: { type: String, required: true }
 })
-const loaded = () => {
-  const doc = frame.value.contentDocument
-  if (!doc) return
-  const theme = getComputedStyle(frame.value)
-  doc.body.style.color = theme.color
-  doc.body.style.background = theme.backgroundColor
-  observer?.disconnect()
-  observer = new ResizeObserver(() => { height.value = `${doc.documentElement.scrollHeight}px` })
-  observer.observe(doc.body)
-  for (const [target, source] of Object.entries({ '--hc-border': '--border', '--hc-accent': '--primary', '--hc-accent-ink': '--primary', '--hc-accent-tint': '--muted', '--hc-muted': '--muted-foreground' })) {
-    doc.documentElement.style.setProperty(target, `hsl(${theme.getPropertyValue(source)})`)
+
+const height = ref('100%')
+
+const src = computed(
+  () =>
+    `${props.baseUrl}/${encodeURIComponent(props.article.locale)}/articles/${encodeURIComponent(props.article.slug)}?embed=1`
+)
+
+const frameOrigin = computed(() => {
+  try {
+    return new URL(props.baseUrl, window.location.origin).origin
+  } catch {
+    return ''
+  }
+})
+
+const frame = ref(null)
+
+const onMessage = (event) => {
+  if (event.origin !== frameOrigin.value || event.data?.source !== 'libredesk-hc-embed') return
+  if (event.data.type === 'loaded') {
+    height.value = '100%'
+    frame.value?.parentElement?.scrollTo({ top: 0 })
+  } else if (event.data.type === 'height' && Number.isFinite(event.data.height)) {
+    height.value = `${event.data.height}px`
   }
-  doc.addEventListener('click', event => {
-    const link = event.target.closest('a[href]')
-    if (!link || link.getAttribute('href').startsWith('#')) return
-    event.preventDefault()
-    const url = new URL(link.href)
-    const match = url.pathname.match(/^\/hc\/([^/]+)\/([^/]+)\/articles\/([^/]+)$/)
-    if (url.origin === window.location.origin && match?.[1] === props.helpSlug) emit('article', { slug: decodeURIComponent(match[3]), locale: decodeURIComponent(match[2]) })
-    else window.open(url.href, '_blank', 'noopener,noreferrer')
-  })
 }
-onUnmounted(() => observer?.disconnect())
+
+onMounted(() => window.addEventListener('message', onMessage))
+onUnmounted(() => window.removeEventListener('message', onMessage))
 </script>
 
 <template>
-  <iframe ref="frame" :key="`${article.id}-${dark}`" :title="article.title" :srcdoc="documentHTML" sandbox="allow-same-origin" scrolling="no" class="block w-full border-0 bg-background text-foreground" :style="{ height }" @load="loaded" />
+  <iframe
+    ref="frame"
+    :key="src"
+    :src="src"
+    :title="article.title"
+    class="block w-full border-0"
+    :style="{ height }"
+  />
 </template>
diff --git a/frontend/apps/widget/src/components/ChatHeader.vue b/frontend/apps/widget/src/components/ChatHeader.vue
index d4be08e1..7db25bbf 100644
--- a/frontend/apps/widget/src/components/ChatHeader.vue
+++ b/frontend/apps/widget/src/components/ChatHeader.vue
@@ -12,7 +12,7 @@
       </Button>
       <ChatTitle />
     </div>
-    <div class="flex items-center gap-2 ml-auto">
+    <div class="flex items-center gap-2 ml-auto" :class="{ 'mr-12': widgetStore.isMobileFullScreen }">
       <DropdownMenu v-if="!widgetStore.isMobileFullScreen || canDownloadTranscript">
         <DropdownMenuTrigger as-child>
           <Button type="button" variant="ghost" size="sm" :aria-label="$t('globals.terms.more')">
diff --git a/frontend/apps/widget/src/store/help.js b/frontend/apps/widget/src/store/help.js
index 3f02ae83..72587c25 100644
--- a/frontend/apps/widget/src/store/help.js
+++ b/frontend/apps/widget/src/store/help.js
@@ -16,8 +16,6 @@ export const useHelpStore = defineStore('help', () => {
   const collectionPath = ref([])
   const navigationHistory = ref([])
   const article = ref(null)
-  const feedback = ref({})
-  const feedbackPending = ref({})
   const scrollTop = ref(0)
   const pendingArticle = ref(null)
   const focusSearch = ref(false)
@@ -49,24 +47,9 @@ export const useHelpStore = defineStore('help', () => {
     query.value = ''
     results.value = null
     article.value = null
-    feedback.value = {}
-    feedbackPending.value = {}
     collectionPath.value = []
     navigationHistory.value = []
   }
-  const vote = async (helpful) => {
-    const target = article.value
-    if (!target || feedback.value[target.id] !== undefined || feedbackPending.value[target.id])
-      return
-    const currentIdentity = identity.value
-    feedbackPending.value[target.id] = true
-    try {
-      await api.sendHelpFeedback(data.value.slug, target.slug, target.locale, helpful)
-      if (identity.value === currentIdentity) feedback.value[target.id] = helpful
-    } finally {
-      if (identity.value === currentIdentity) delete feedbackPending.value[target.id]
-    }
-  }
   const load = async (locale) => {
     const request = ++generation
     loading.value = true
@@ -91,9 +74,6 @@ export const useHelpStore = defineStore('help', () => {
     focusSearch,
     expandArticles,
     setExpandArticles,
-    feedback,
-    feedbackPending,
-    vote,
     navigationHistory,
     pendingArticle,
     identity,
diff --git a/frontend/apps/widget/src/store/help.test.js b/frontend/apps/widget/src/store/help.test.js
deleted file mode 100644
index ed8e9177..00000000
--- a/frontend/apps/widget/src/store/help.test.js
+++ /dev/null
@@ -1,77 +0,0 @@
-import { beforeEach, describe, expect, it, vi } from 'vitest'
-import { createPinia, setActivePinia } from 'pinia'
-import api from '@widget/api/index.js'
-import { useHelpStore } from './help.js'
-
-vi.mock('@widget/api/index.js', () => ({ default: { sendHelpFeedback: vi.fn() } }))
-
-beforeEach(() => {
-  setActivePinia(createPinia())
-  vi.resetAllMocks()
-})
-
-const setup = () => {
-  const help = useHelpStore()
-  help.data = { slug: 'support' }
-  help.article = { id: 1, slug: 'first', locale: 'en-US' }
-  return help
-}
-
-describe('article feedback', () => {
-  it.each([true, false])('retains a %s vote when returning to an article', async (helpful) => {
-    const help = setup()
-    await help.vote(helpful)
-    help.article = { id: 2, slug: 'second', locale: 'en-US' }
-    expect(help.feedback[2]).toBeUndefined()
-    help.article = { id: 1, slug: 'first', locale: 'en-US' }
-    expect(useHelpStore().feedback[1]).toBe(helpful)
-    await help.vote(!helpful)
-    expect(api.sendHelpFeedback).toHaveBeenCalledTimes(1)
-  })
-
-  it('records a pending vote against its original article and prevents duplicate submission', async () => {
-    let complete
-    api.sendHelpFeedback.mockImplementation(
-      () =>
-        new Promise((resolve) => {
-          complete = resolve
-        })
-    )
-    const help = setup()
-    const pending = help.vote(true)
-    await help.vote(false)
-    help.article = { id: 2, slug: 'second', locale: 'en-US' }
-    complete()
-    await pending
-    expect(help.feedback).toEqual({ 1: true })
-    expect(help.feedbackPending).toEqual({})
-    expect(api.sendHelpFeedback).toHaveBeenCalledTimes(1)
-  })
-
-  it('discards a pending vote after the widget identity resets', async () => {
-    let complete
-    api.sendHelpFeedback.mockImplementation(
-      () =>
-        new Promise((resolve) => {
-          complete = resolve
-        })
-    )
-    const help = setup()
-    const pending = help.vote(true)
-    help.reset()
-    complete()
-    await pending
-    expect(help.feedback).toEqual({})
-    expect(help.feedbackPending).toEqual({})
-  })
-
-  it('allows retry after a failed request', async () => {
-    api.sendHelpFeedback.mockRejectedValueOnce(new Error('offline')).mockResolvedValueOnce({})
-    const help = setup()
-    await expect(help.vote(false)).rejects.toThrow('offline')
-    expect(help.feedback).toEqual({})
-    expect(help.feedbackPending).toEqual({})
-    await help.vote(false)
-    expect(help.feedback[1]).toBe(false)
-  })
-})
diff --git a/frontend/apps/widget/src/views/HelpView.vue b/frontend/apps/widget/src/views/HelpView.vue
index 78241d07..28cf8d26 100644
--- a/frontend/apps/widget/src/views/HelpView.vue
+++ b/frontend/apps/widget/src/views/HelpView.vue
@@ -1,20 +1,14 @@
 <script setup>
 import { computed, ref, nextTick, onMounted, onUnmounted } from 'vue'
 import { useI18n } from 'vue-i18n'
-import { ArrowLeft, Search, Maximize2, Minimize2, ExternalLink } from 'lucide-vue-next'
+import { ArrowLeft, Search, Maximize2, Minimize2, FileQuestionMark } from 'lucide-vue-next'
 import { Button } from '@shared-ui/components/ui/button'
 import { Input } from '@shared-ui/components/ui/input'
-import {
-  Select,
-  SelectContent,
-  SelectItem,
-  SelectTrigger,
-  SelectValue
-} from '@shared-ui/components/ui/select'
 import { useHelpStore } from '@widget/store/help.js'
 import { useWidgetStore } from '@widget/store/widget.js'
 import HelpCollectionList from '@shared-ui/components/HelpCollectionList.vue'
 import ArticleReader from '@widget/components/ArticleReader.vue'
+import { Spinner } from '@shared-ui/components/ui/spinner'
 import api from '@widget/api/index.js'
 
 const help = useHelpStore()
@@ -27,8 +21,6 @@ onUnmounted(() => {
 const valid = (identity) => mounted && identity === help.identity
 const busy = ref(false)
 const error = ref('')
-const feedback = computed(() => help.feedback[help.article?.id] ?? null)
-const feedbackPending = computed(() => !!help.feedbackPending[help.article?.id])
 const scroller = ref(null)
 const backButton = ref(null)
 const searchInput = ref(null)
@@ -37,20 +29,7 @@ const originArticleID = ref(null)
 const currentCollection = computed(() => help.collectionPath.at(-1))
 const collections = computed(() => currentCollection.value?.children || help.data?.tree || [])
 const items = computed(() => help.results ?? currentCollection.value?.articles ?? [])
-const articleURL = computed(() =>
-  help.article
-    ? `${help.data.url}/${encodeURIComponent(help.article.locale)}/articles/${encodeURIComponent(help.article.slug)}`
-    : ''
-)
 const canExpand = computed(() => !!help.article && !widget.isMobileFullScreen)
-const availableTranslations = computed(() => help.article?.translations || [])
-const languageName = (code) => {
-  try {
-    return new Intl.DisplayNames([locale.value], { type: 'language' }).of(code) || code
-  } catch {
-    return code
-  }
-}
 const toggleExpand = () => {
   widget.toggleExpand()
   help.setExpandArticles(widget.isExpanded)
@@ -101,23 +80,6 @@ const openArticle = async ({ id, slug, locale: articleLocale }) => {
     busy.value = false
   }
 }
-const switchArticleLanguage = async (articleLocale) => {
-  if (busy.value || articleLocale === help.article?.locale) return
-  const translation = availableTranslations.value.find(({ locale }) => locale === articleLocale)
-  if (!translation) return
-  busy.value = true
-  error.value = ''
-  const identity = help.identity
-  try {
-    const response = await api.getHelpArticle(translation.slug, articleLocale)
-    if (!valid(identity) || response.data.data.locale !== articleLocale) return
-    help.article = response.data.data
-  } catch {
-    if (valid(identity)) error.value = t('widget.helpLoadError')
-  } finally {
-    busy.value = false
-  }
-}
 const openCollection = async (collection) => {
   help.navigationHistory.push({ top: help.scrollTop, id: collection.id })
   help.collectionPath.push(collection)
@@ -148,15 +110,6 @@ const back = async () => {
     if (selector) scroller.value.querySelector(selector)?.focus({ preventScroll: true })
   }
 }
-const vote = async (helpful) => {
-  error.value = ''
-  const identity = help.identity
-  try {
-    await help.vote(helpful)
-  } catch {
-    if (valid(identity)) error.value = t('widget.helpFeedbackError')
-  }
-}
 onMounted(async () => {
   if (!help.data && !help.loading) await help.load(locale.value)
   if (scroller.value) scroller.value.scrollTop = help.scrollTop
@@ -203,114 +156,64 @@ onMounted(async () => {
         <Maximize2 v-else class="size-4" aria-hidden="true" />
       </Button>
     </header>
-    <div v-if="help.loading || busy" role="status" class="px-4 py-2 text-sm text-muted-foreground">
-      {{ t('globals.terms.loading') }}
-    </div>
-    <div v-if="error || help.failed" role="alert" class="p-4 text-sm">
-      <p>{{ error || t('widget.helpLoadError') }}</p>
-      <Button type="button" variant="outline" class="mt-2" @click="retry">{{
-        t('globals.terms.tryAgain')
-      }}</Button>
-    </div>
-    <template v-if="help.article">
-      <div class="flex-1 min-h-0 overflow-auto">
-        <ArticleReader
-          :article="help.article"
-          :help-slug="help.data.slug"
-          :dark="widget.config.dark_mode"
-          @article="openArticle"
-        />
-        <div class="flex items-center justify-center gap-2 p-3 border-t text-sm">
-          <span>{{
-            feedback !== null ? t('helpCenter.feedbackThanks') : t('widget.helpful')
-          }}</span>
-          <template v-if="feedback === null">
-            <Button
-              type="button"
-              variant="outline"
-              size="sm"
-              :disabled="busy || feedbackPending"
-              @click="vote(true)"
-              >{{ t('globals.messages.yes') }}</Button
-            >
-            <Button
-              type="button"
-              variant="outline"
-              size="sm"
-              :disabled="busy || feedbackPending"
-              @click="vote(false)"
-              >{{ t('globals.messages.no') }}</Button
-            >
-          </template>
-        </div>
-        <div
-          v-if="availableTranslations.length > 1"
-          class="flex items-center justify-center gap-2 px-4 py-3 border-t text-sm"
-        >
-          <span>{{ t('globals.terms.language') }}</span>
-          <Select :model-value="help.article.locale" @update:model-value="switchArticleLanguage">
-            <SelectTrigger class="h-8 w-44" :aria-label="t('globals.terms.language')">
-              <SelectValue />
-            </SelectTrigger>
-            <SelectContent>
-              <SelectItem
-                v-for="translation in availableTranslations"
-                :key="translation.locale"
-                :value="translation.locale"
-              >
-                {{ languageName(translation.locale) }}
-              </SelectItem>
-            </SelectContent>
-          </Select>
-        </div>
-        <a
-          :href="articleURL"
-          target="_blank"
-          rel="noopener noreferrer"
-          class="flex items-center justify-center gap-1.5 pb-4 text-xs text-muted-foreground hover:text-foreground no-underline"
-        >
-          {{ t('widget.openInHelpCenter') }}
-          <ExternalLink class="size-3.5" aria-hidden="true" />
-        </a>
-      </div>
-    </template>
-    <template v-else>
-      <form class="flex gap-2 p-3 border-b" @submit.prevent="search">
-        <Input
-          ref="searchInput"
-          v-model="help.query"
-          :aria-label="t('widget.searchArticles')"
-          :placeholder="t('widget.searchArticles')"
-        />
-        <Button
-          type="submit"
-          variant="outline"
-          :disabled="busy || !help.available"
-          :aria-label="t('globals.terms.search')"
-          ><Search class="size-4" aria-hidden="true"
-        /></Button>
-      </form>
+    <div class="relative flex flex-col flex-1 min-h-0">
       <div
-        ref="scroller"
-        class="flex-1 min-h-0 overflow-auto"
-        @scroll="help.scrollTop = $event.target.scrollTop"
+        v-if="help.loading || busy"
+        class="absolute inset-0 bg-background/80 backdrop-blur-sm z-10"
+        role="status"
       >
-        <HelpCollectionList
-          :collection="currentCollection"
-          :collections="collections"
-          :articles="items"
-          :searching="help.results !== null"
-          @collection="openCollection"
-          @article="openArticle"
-        />
-        <p
-          v-if="help.results?.length === 0"
-          role="status"
-          class="p-4 text-sm text-muted-foreground"
-        >
-          {{ t('widget.noArticles') }}
-        </p>
+        <Spinner size="md" :text="t('globals.terms.loading')" absolute />
       </div>
-    </template>
+      <div v-if="error || help.failed" role="alert" class="p-4 text-sm">
+        <p>{{ error || t('widget.helpLoadError') }}</p>
+        <Button type="button" variant="outline" class="mt-2" @click="retry">{{
+          t('globals.terms.tryAgain')
+        }}</Button>
+      </div>
+      <template v-if="help.article">
+        <div class="flex-1 min-h-0 overflow-auto">
+          <ArticleReader :article="help.article" :base-url="help.data.url" />
+        </div>
+      </template>
+      <template v-else>
+        <form class="flex gap-2 p-3 border-b" @submit.prevent="search">
+          <Input
+            ref="searchInput"
+            v-model="help.query"
+            :aria-label="t('widget.searchArticles')"
+            :placeholder="t('widget.searchArticles')"
+          />
+          <Button
+            type="submit"
+            variant="outline"
+            :disabled="busy || !help.available"
+            :aria-label="t('globals.terms.search')"
+            ><Search class="size-4" aria-hidden="true"
+          /></Button>
+        </form>
+        <div
+          ref="scroller"
+          class="flex-1 min-h-0 overflow-auto"
+          @scroll="help.scrollTop = $event.target.scrollTop"
+        >
+          <HelpCollectionList
+            :collection="currentCollection"
+            :collections="collections"
+            :articles="items"
+            :searching="help.results !== null"
+            @collection="openCollection"
+            @article="openArticle"
+          />
+          <div
+            v-if="help.results?.length === 0"
+            role="status"
+            class="flex flex-col items-center justify-center px-4 py-12 text-center"
+          >
+            <FileQuestionMark class="w-10 h-10 text-muted-foreground mb-4" aria-hidden="true" />
+            <p class="text-sm text-muted-foreground">{{ t('widget.noArticles') }}</p>
+          </div>
+        </div>
+      </template>
+    </div>
   </div>
 </template>
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 47097b55..5b3c45e0 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -1376,6 +1376,9 @@
   "helpCenter.slugHint": "Used in the help center URL.",
   "helpCenter.customDomain": "Custom domain (optional)",
   "helpCenter.customDomainHint": "Serve this help center on its own domain instead of the app URL. Point the domain at Libredesk in your DNS and reverse proxy first.",
+  "helpCenter.invalidLivechatInbox": "Select a live chat inbox.",
+  "helpCenter.livechatInbox": "Live chat inbox",
+  "helpCenter.livechatInboxHint": "Shows the chat widget for this inbox on every help center page.",
   "helpCenter.invalidCustomDomain": "Enter the domain's root URL starting with https://, with no path or trailing slash, e.g. https://help.example.com.",
   "imageLightbox.next": "Next image",
   "imageLightbox.previous": "Previous image",
diff --git a/internal/conversation/conversation.go b/internal/conversation/conversation.go
index 5ccf1f97..cd11a73f 100644
--- a/internal/conversation/conversation.go
+++ b/internal/conversation/conversation.go
@@ -535,6 +535,7 @@ func (c *Manager) GetContactUnreadPreviewMessages(contactID, inboxID, limit int)
 		}
 		author.Email = null.String{}
 		previews = append(previews, models.ChatMessage{
+			ID:               message.ID,
 			UUID:             message.UUID,
 			Status:           message.Status,
 			ConversationUUID: message.ConversationUUID,
@@ -2133,6 +2134,7 @@ func (m *Manager) BuildWidgetConversationResponse(conversation models.Conversati
 			author.Email = null.String{}
 
 			chatMessages = append(chatMessages, models.ChatMessage{
+				ID:               msg.ID,
 				UUID:             msg.UUID,
 				Status:           msg.Status,
 				CreatedAt:        msg.CreatedAt,
diff --git a/internal/conversation/message.go b/internal/conversation/message.go
index b4ac3f69..e4e9300f 100644
--- a/internal/conversation/message.go
+++ b/internal/conversation/message.go
@@ -1487,6 +1487,7 @@ func (m *Manager) broadcastMessageToWidgetClients(message *models.Message) {
 	m.SignAttachmentURLs(message.Attachments)
 	m.SignAvatarURL(&message.Author.AvatarURL)
 	liveChatInbox.BroadcastMessageToClients(message.ConversationUUID, conversation.ContactID, models.ChatMessage{
+		ID:               message.ID,
 		UUID:             message.UUID,
 		Status:           message.Status,
 		ConversationUUID: message.ConversationUUID,
diff --git a/internal/conversation/models/models.go b/internal/conversation/models/models.go
index f1028dfb..73facedc 100644
--- a/internal/conversation/models/models.go
+++ b/internal/conversation/models/models.go
@@ -103,6 +103,7 @@ type ChatConversation struct {
 }
 
 type ChatMessage struct {
+	ID               int                    `json:"id"`
 	UUID             string                 `json:"uuid"`
 	Status           string                 `json:"status"`
 	ConversationUUID string                 `json:"conversation_uuid"`
diff --git a/internal/conversation/queries.sql b/internal/conversation/queries.sql
index cb8a36f4..9ae59bed 100644
--- a/internal/conversation/queries.sql
+++ b/internal/conversation/queries.sql
@@ -929,7 +929,7 @@ WHERE m.conversation_id = (
 AND ($2::boolean IS NULL OR m.private = $2)
 AND ($3::text[] IS NULL OR m.type::text = ANY($3))
 AND (m.meta IS NULL OR NOT COALESCE((m.meta->>'continuity_email')::boolean, false))
-ORDER BY m.created_at DESC %s
+ORDER BY m.created_at DESC, m.id DESC %s
 
 -- name: insert-message
 WITH conversation_id AS (
diff --git a/internal/helpcenter/helpcenter.go b/internal/helpcenter/helpcenter.go
index c62686b3..a0f322ba 100644
--- a/internal/helpcenter/helpcenter.go
+++ b/internal/helpcenter/helpcenter.go
@@ -23,6 +23,7 @@ import (
 	"github.com/jmoiron/sqlx"
 	"github.com/knadh/go-i18n"
 	"github.com/microcosm-cc/bluemonday"
+	"github.com/volatiletech/null/v9"
 	"github.com/zerodha/logf"
 )
 
@@ -107,6 +108,7 @@ type HelpCenterRequest struct {
 	Theme           json.RawMessage `json:"theme"`
 	CustomDomain    string          `json:"custom_domain"`
 	Template        string          `json:"template"`
+	LivechatInboxID null.Int        `json:"livechat_inbox_id"`
 }
 
 type CollectionRequest struct {
@@ -292,7 +294,7 @@ func (m *Manager) CreateHelpCenter(req HelpCenterRequest) (models.HelpCenter, er
 	if err := m.validateCustomDomain(req.CustomDomain, 0); err != nil {
 		return hc, err
 	}
-	if err := m.q.InsertHelpCenter.Get(&hc, req.Name, req.Slug, req.PageTitle, req.MetaDescription, req.CustomCSS, req.CustomJS, req.DefaultLocale, req.AllowedLocales, req.Theme, req.CustomDomain, req.Template); err != nil {
+	if err := m.q.InsertHelpCenter.Get(&hc, req.Name, req.Slug, req.PageTitle, req.MetaDescription, req.CustomCSS, req.CustomJS, req.DefaultLocale, req.AllowedLocales, req.Theme, req.CustomDomain, req.Template, req.LivechatInboxID); err != nil {
 		if dbutil.IsUniqueViolationError(err) {
 			return hc, envelope.NewError(envelope.ConflictError, m.i18n.T("globals.messages.errorAlreadyExists"), nil)
 		}
@@ -322,6 +324,7 @@ func (m *Manager) DraftHelpCenter(id int, req HelpCenterRequest) (models.HelpCen
 	hc.Theme = req.Theme
 	hc.CustomDomain = req.CustomDomain
 	hc.Template = req.Template
+	hc.LivechatInboxID = req.LivechatInboxID
 	return hc, nil
 }
 
@@ -347,7 +350,7 @@ func (m *Manager) UpdateHelpCenter(id int, req HelpCenterRequest) (models.HelpCe
 	if err := m.validateCustomDomain(req.CustomDomain, id); err != nil {
 		return hc, err
 	}
-	if err := m.q.UpdateHelpCenter.Get(&hc, id, req.Name, req.Slug, req.PageTitle, req.MetaDescription, req.CustomCSS, req.CustomJS, req.DefaultLocale, req.AllowedLocales, req.Theme, req.CustomDomain, req.Template); err != nil {
+	if err := m.q.UpdateHelpCenter.Get(&hc, id, req.Name, req.Slug, req.PageTitle, req.MetaDescription, req.CustomCSS, req.CustomJS, req.DefaultLocale, req.AllowedLocales, req.Theme, req.CustomDomain, req.Template, req.LivechatInboxID); err != nil {
 		if dbutil.IsUniqueViolationError(err) {
 			return hc, envelope.NewError(envelope.ConflictError, m.i18n.T("globals.messages.errorAlreadyExists"), nil)
 		}
diff --git a/internal/helpcenter/models/models.go b/internal/helpcenter/models/models.go
index 82434d7e..e0374864 100644
--- a/internal/helpcenter/models/models.go
+++ b/internal/helpcenter/models/models.go
@@ -3,6 +3,8 @@ package models
 import (
 	"encoding/json"
 	"time"
+
+	"github.com/volatiletech/null/v9"
 )
 
 const (
@@ -29,6 +31,7 @@ type HelpCenter struct {
 	Theme           json.RawMessage `db:"theme" json:"theme"`
 	CustomDomain    string          `db:"custom_domain" json:"custom_domain"`
 	Template        string          `db:"template" json:"template"`
+	LivechatInboxID null.Int        `db:"livechat_inbox_id" json:"livechat_inbox_id"`
 }
 
 // Theme holds the customizable branding for a help center's public pages.
diff --git a/internal/helpcenter/queries.sql b/internal/helpcenter/queries.sql
index a0c4e5c6..331bffbb 100644
--- a/internal/helpcenter/queries.sql
+++ b/internal/helpcenter/queries.sql
@@ -1,32 +1,32 @@
 -- name: get-all-help-centers
-SELECT id, created_at, updated_at, name, slug, page_title, meta_description, custom_css, custom_js, default_locale, allowed_locales, is_active, theme, custom_domain, template
+SELECT id, created_at, updated_at, name, slug, page_title, meta_description, custom_css, custom_js, default_locale, allowed_locales, is_active, theme, custom_domain, template, livechat_inbox_id
 FROM help_centers
 ORDER BY created_at DESC;
 
 -- name: get-active-help-centers
-SELECT id, created_at, updated_at, name, slug, page_title, meta_description, custom_css, custom_js, default_locale, allowed_locales, is_active, theme, custom_domain, template
+SELECT id, created_at, updated_at, name, slug, page_title, meta_description, custom_css, custom_js, default_locale, allowed_locales, is_active, theme, custom_domain, template, livechat_inbox_id
 FROM help_centers
 WHERE is_active = true
 ORDER BY created_at DESC;
 
 -- name: get-help-center-by-id
-SELECT id, created_at, updated_at, name, slug, page_title, meta_description, custom_css, custom_js, default_locale, allowed_locales, is_active, theme, custom_domain, template
+SELECT id, created_at, updated_at, name, slug, page_title, meta_description, custom_css, custom_js, default_locale, allowed_locales, is_active, theme, custom_domain, template, livechat_inbox_id
 FROM help_centers
 WHERE id = $1;
 
 -- name: get-help-center-by-slug
-SELECT id, created_at, updated_at, name, slug, page_title, meta_description, custom_css, custom_js, default_locale, allowed_locales, is_active, theme, custom_domain, template
+SELECT id, created_at, updated_at, name, slug, page_title, meta_description, custom_css, custom_js, default_locale, allowed_locales, is_active, theme, custom_domain, template, livechat_inbox_id
 FROM help_centers
 WHERE slug = $1 AND is_active = true;
 
 -- name: insert-help-center
-INSERT INTO help_centers (name, slug, page_title, meta_description, custom_css, custom_js, default_locale, allowed_locales, theme, custom_domain, template)
-VALUES ($1, $2, $3, $4, $5, $6, $7, $8, $9, $10, $11)
+INSERT INTO help_centers (name, slug, page_title, meta_description, custom_css, custom_js, default_locale, allowed_locales, theme, custom_domain, template, livechat_inbox_id)
+VALUES ($1, $2, $3, $4, $5, $6, $7, $8, $9, $10, $11, $12)
 RETURNING *;
 
 -- name: update-help-center
 UPDATE help_centers
-SET name = $2, slug = $3, page_title = $4, meta_description = $5, custom_css = $6, custom_js = $7, default_locale = $8, allowed_locales = $9, theme = $10, custom_domain = $11, template = $12, updated_at = NOW()
+SET name = $2, slug = $3, page_title = $4, meta_description = $5, custom_css = $6, custom_js = $7, default_locale = $8, allowed_locales = $9, theme = $10, custom_domain = $11, template = $12, livechat_inbox_id = $13, updated_at = NOW()
 WHERE id = $1
 RETURNING *;
 
diff --git a/internal/migrations/v2.9.0.go b/internal/migrations/v2.9.0.go
index b088ddd7..b7eb5987 100644
--- a/internal/migrations/v2.9.0.go
+++ b/internal/migrations/v2.9.0.go
@@ -190,7 +190,7 @@ func V2_9_0(db *sqlx.DB, fs stuffbin.FileSystem, ko *koanf.Koanf) error {
 		return err
 	}
 
-	_, err := db.Exec(`
+	if _, err := db.Exec(`
 		INSERT INTO templates ("type", body, is_default, "name", subject, is_builtin)
 		SELECT 'email_notification'::template_type, '
 <p>{{ .Author.FullName }} replied and reopened a conversation assigned to you:</p>
@@ -215,7 +215,10 @@ func V2_9_0(db *sqlx.DB, fs stuffbin.FileSystem, ko *koanf.Koanf) error {
 
 ', false, 'Conversation reopened', 'Conversation #{{ .Conversation.ReferenceNumber }} reopened', true
 		WHERE NOT EXISTS (SELECT 1 FROM templates WHERE "name" = 'Conversation reopened');
-	`)
+	`); err != nil {
+		return err
+	}
+
 	if _, err := db.Exec(`
 CREATE TABLE IF NOT EXISTS widget_campaign_deliveries (
     id UUID PRIMARY KEY DEFAULT gen_random_uuid(),
@@ -236,11 +239,13 @@ CREATE INDEX IF NOT EXISTS idx_widget_campaign_browser ON widget_campaign_delive
 CREATE INDEX IF NOT EXISTS idx_widget_campaign_contact ON widget_campaign_deliveries(inbox_id, contact_id, created_at DESC) WHERE contact_id IS NOT NULL;
 CREATE INDEX IF NOT EXISTS idx_widget_campaign_stats ON widget_campaign_deliveries(inbox_id, campaign_id, created_at);
 
+ALTER TABLE help_centers ADD COLUMN IF NOT EXISTS livechat_inbox_id INTEGER NULL REFERENCES inboxes(id) ON DELETE SET NULL;
+
 ALTER TABLE help_articles ADD COLUMN IF NOT EXISTS translation_group_id UUID NOT NULL DEFAULT gen_random_uuid();
 CREATE UNIQUE INDEX IF NOT EXISTS index_unique_help_articles_on_translation_group_locale
     ON help_articles(translation_group_id, locale);
 `); err != nil {
 		return err
 	}
-	return err
+	return nil
 }
diff --git a/schema.sql b/schema.sql
index ba7f0076..0e5e4ac3 100644
--- a/schema.sql
+++ b/schema.sql
@@ -685,6 +685,7 @@ CREATE TABLE help_centers (
 	theme JSONB NOT NULL DEFAULT '{}',
 	custom_domain TEXT NOT NULL DEFAULT '',
 	template TEXT NOT NULL DEFAULT 'classic',
+	livechat_inbox_id INTEGER NULL REFERENCES inboxes(id) ON DELETE SET NULL,
 	CONSTRAINT constraint_help_centers_on_template CHECK (template IN ('docs', 'classic'))
 );
 
diff --git a/static/public/static/article-content.css b/static/public/static/article-content.css
index 3ced56d8..f2f181ea 100644
--- a/static/public/static/article-content.css
+++ b/static/public/static/article-content.css
@@ -142,3 +142,23 @@ details.hc-details[open] > summary.hc-details-summary::before { transform: rotat
 [dir="rtl"] details.hc-details[open] > summary.hc-details-summary::before { transform: rotate(90deg); }
 details.hc-details[open] > summary.hc-details-summary { margin-bottom: .35rem; }
 details.hc-details > .hc-details-content > :last-child { margin-bottom: 0; }
+
+.hc-embed-open {
+    display: flex; align-items: center; justify-content: center; gap: .4rem;
+    padding: 1rem; font-size: .8rem; color: var(--hc-muted);
+    border-top: 1px solid var(--hc-border); text-decoration: none;
+}
+.hc-embed-open:hover { color: var(--hc-ink); text-decoration: none; }
+
+.hc-embed-langs {
+    display: flex; align-items: center; justify-content: center; gap: .5rem;
+    padding: .75rem 1rem; border-top: 1px solid var(--hc-border);
+    font-size: .8rem; color: var(--hc-muted);
+}
+.hc-embed-langs select {
+    padding: .3rem .5rem; border: 1px solid var(--hc-border); border-radius: 6px;
+    background: transparent; color: var(--hc-ink); font: inherit;
+}
+
+/* The widget sizes the frame to this height, so a stretched body would keep it at the tallest page. */
+body.hc-embed { min-height: 0; }
diff --git a/static/public/web-templates/help/classic/article.html b/static/public/web-templates/help/classic/article.html
index 0d953da6..be5c2012 100644
--- a/static/public/web-templates/help/classic/article.html
+++ b/static/public/web-templates/help/classic/article.html
@@ -1,7 +1,7 @@
 {{ define "classic-help-article" }}
 {{ template "classic-header" . }}
 
-<nav class="hc-breadcrumb" aria-label="{{ .L.T "globals.terms.breadcrumb" }}">
+{{ if not .Data.HelpCenter.Embed }}<nav class="hc-breadcrumb" aria-label="{{ .L.T "globals.terms.breadcrumb" }}">
     <ol>
         <li><a href="{{ .Data.HelpCenter.BasePath }}">{{ .Data.HelpCenter.Name }}</a></li>
         {{ if .Data.Collection.Name }}
@@ -9,7 +9,7 @@
         {{ end }}
         <li><span class="hc-current" aria-current="page">{{ .Data.Article.Title }}</span></li>
     </ol>
-</nav>
+</nav>{{ end }}
 
 <article class="hc-article">
     <h1>{{ .Data.Article.Title }}</h1>
diff --git a/static/public/web-templates/help/classic/layout.html b/static/public/web-templates/help/classic/layout.html
index f4b83f54..9716e1fb 100644
--- a/static/public/web-templates/help/classic/layout.html
+++ b/static/public/web-templates/help/classic/layout.html
@@ -1,4 +1,6 @@
-{{ define "classic-header" }}
+{{ define "classic-header" }}{{ if .Data.HelpCenter.Embed }}{{ template "hc-embed-open" . }}{{ else }}{{ template "classic-site-header" . }}{{ end }}{{ end }}
+
+{{ define "classic-site-header" }}
 {{ template "hc-head" . }}
 <body>
     <a class="hc-skip-link" href="#hc-main">{{ .L.T "helpCenter.skipToContent" }}</a>
@@ -34,7 +36,9 @@
     <main id="hc-main" tabindex="-1">
 {{ end }}
 
-{{ define "classic-footer" }}
+{{ define "classic-footer" }}{{ if .Data.HelpCenter.Embed }}{{ template "hc-embed-close" . }}{{ else }}{{ template "classic-site-footer" . }}{{ end }}{{ end }}
+
+{{ define "classic-site-footer" }}
     </main>
     <footer class="hc-footer">
         <div class="hc-footer-inner">
diff --git a/static/public/web-templates/help/docs/article.html b/static/public/web-templates/help/docs/article.html
index 6ef63b8e..c3fd10db 100644
--- a/static/public/web-templates/help/docs/article.html
+++ b/static/public/web-templates/help/docs/article.html
@@ -1,7 +1,7 @@
 {{ define "docs-help-article" }}
 {{ template "docs-header" . }}
 
-{{ template "docs-breadcrumb" (map "L" .L "Data" .Data "Collection" .Data.Collection "Current" .Data.Article.Title) }}
+{{ if not .Data.HelpCenter.Embed }}{{ template "docs-breadcrumb" (map "L" .L "Data" .Data "Collection" .Data.Collection "Current" .Data.Article.Title) }}{{ end }}
 
 <article class="hc-article hcd-article">
     <h1>{{ .Data.Article.Title }}</h1>
diff --git a/static/public/web-templates/help/docs/layout.html b/static/public/web-templates/help/docs/layout.html
index cfc7849a..9269c52f 100644
--- a/static/public/web-templates/help/docs/layout.html
+++ b/static/public/web-templates/help/docs/layout.html
@@ -1,4 +1,6 @@
-{{ define "docs-header" }}
+{{ define "docs-header" }}{{ if .Data.HelpCenter.Embed }}{{ template "hc-embed-open" . }}{{ else }}{{ template "docs-site-header" . }}{{ end }}{{ end }}
+
+{{ define "docs-site-header" }}
 {{ template "hc-head" . }}
 <body class="hcd">
     <a class="hc-skip-link" href="#hc-main">{{ .L.T "helpCenter.skipToContent" }}</a>
@@ -85,7 +87,9 @@
 </div>
 {{ end }}
 
-{{ define "docs-footer" }}
+{{ define "docs-footer" }}{{ if .Data.HelpCenter.Embed }}{{ template "hc-embed-close" . }}{{ else }}{{ template "docs-site-footer" . }}{{ end }}{{ end }}
+
+{{ define "docs-site-footer" }}
         </main>
     </div>
     <footer class="hcd-footer">
diff --git a/static/public/web-templates/help/shared/partials.html b/static/public/web-templates/help/shared/partials.html
index f1e6da2a..7c1fbea4 100644
--- a/static/public/web-templates/help/shared/partials.html
+++ b/static/public/web-templates/help/shared/partials.html
@@ -89,3 +89,82 @@
     {{ range . }}{{ if .Avatar }}<img class="hc-avatar" src="{{ .Avatar }}" alt="" loading="lazy" />{{ else }}<span class="hc-avatar hc-avatar-initial" aria-hidden="true">{{ printf "%.1s" .Name }}</span>{{ end }}{{ end }}
 </span>
 {{ end }}
+
+{{ define "hc-embed-open" }}
+{{ template "hc-head" . }}
+<body class="hc-embed{{ if eq .Data.HelpCenter.Template "docs" }} hcd{{ end }}">
+    <main id="hc-main">
+{{ end }}
+
+{{ define "hc-embed-close" }}
+    </main>
+    {{ if gt (len .Data.LocaleLinks) 1 }}
+    <div class="hc-embed-langs">
+        <label for="hc-embed-lang">{{ .L.T "globals.terms.language" }}</label>
+        <select id="hc-embed-lang">
+            {{ range .Data.LocaleLinks }}<option value="{{ .Path }}"{{ if eq .Locale $.Data.HelpCenter.CurrentLocale }} selected{{ end }}>{{ .Locale }}</option>{{ end }}
+        </select>
+    </div>
+    {{ end }}
+    <a class="hc-embed-open" data-hc-embed-exit href="{{ .Data.HelpCenter.BaseURL }}{{ if .Data.CanonicalPath }}{{ .Data.CanonicalPath }}{{ else }}{{ .Data.HelpCenter.BasePath }}{{ end }}" target="_blank" rel="noopener noreferrer">
+        {{ .L.T "widget.openInHelpCenter" }}
+        <svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M15 3h6v6"/><path d="M10 14 21 3"/><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/></svg>
+    </a>
+    <script>
+    (function () {
+        var embedded = function (href) {
+            var url = new URL(href, location.href);
+            url.searchParams.set('embed', '1');
+            return url.href;
+        };
+
+        var select = document.getElementById('hc-embed-lang');
+        if (select) select.addEventListener('change', function () { location.href = embedded(select.value); });
+
+        // Navigating to a page without embed=1 would show the full site inside the widget panel.
+        var keepEmbedded = function () {
+            document.querySelectorAll('a[href]:not([data-hc-embed-exit])').forEach(function (link) {
+                var href = link.getAttribute('href');
+                if (!href || href.charAt(0) === '#' || /^[a-z]+:/i.test(href) && !/^https?:/i.test(href)) return;
+                var url = new URL(link.href, location.href);
+                if (url.origin !== location.origin) {
+                    link.target = '_blank';
+                    link.rel = 'noopener noreferrer';
+                    return;
+                }
+                if (url.searchParams.get('embed') !== '1') link.href = embedded(link.href);
+            });
+        };
+        keepEmbedded();
+        new MutationObserver(keepEmbedded).observe(document.body, { childList: true, subtree: true });
+
+        var last = 0;
+        var report = function () {
+            var height = Math.ceil(document.body.getBoundingClientRect().height);
+            if (height === last) return;
+            last = height;
+            parent.postMessage({ source: 'libredesk-hc-embed', type: 'height', height: height }, '*');
+        };
+        parent.postMessage({ source: 'libredesk-hc-embed', type: 'loaded' }, '*');
+        new ResizeObserver(report).observe(document.body);
+        report();
+    })();
+    </script>
+    {{ if .Data.HelpCenter.CustomJS }}<script>{{ .Data.HelpCenter.CustomJS }}</script>{{ end }}
+</body>
+</html>
+{{ end }}
+
+{{ define "hc-livechat-widget" }}
+{{ if .Data.HelpCenter.WidgetInboxUUID }}
+<script>
+(function () {
+    window.LibredeskSettings = { baseURL: {{ .Data.HelpCenter.WidgetRootURL }}, inboxID: {{ .Data.HelpCenter.WidgetInboxUUID }} };
+    var s = document.createElement('script');
+    s.async = true;
+    s.src = {{ .Data.HelpCenter.WidgetRootURL }} + '/widget.js';
+    document.head.appendChild(s);
+})();
+</script>
+{{ end }}
+{{ end }}
diff --git a/static/widget.js b/static/widget.js
index 6c2b6f92..e41da073 100644
--- a/static/widget.js
+++ b/static/widget.js
@@ -27,8 +27,8 @@
             this.EXPANDED_WIDTH = '750px';
             this.MOBILE_BREAKPOINT = 600;
             this.LAUNCHER_SIZE = 60;
-            this.MOBILE_LAUNCHER_SIZE = 68;
-            this.CAMPAIGN_POLL_MIN = 5;
+            this.MOBILE_LAUNCHER_SIZE = 60;
+            this.CAMPAIGN_POLL_MIN = 2;
             this.CAMPAIGN_POLL_MAX = 60;
 
             this.config = config;

From a074bc4d55b7273290c71e7755a34846c8c7e12b Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sat, 19 Sep 2026 17:27:01 +0530
Subject: [PATCH 116/178] add hover animation to widget launcher

The launcher grows a little on hover and springs back when the pointer
leaves. Also adds a black launcher logo for light backgrounds, softens
the launcher shadow, and expands the widget when help opens on an article.
---
 frontend/apps/widget/src/views/HelpView.vue |   1 +
 static/public/launcher-logo-black.png       | Bin 0 -> 731 bytes
 static/widget.js                            |  26 +++++++++++++++++---
 3 files changed, 23 insertions(+), 4 deletions(-)
 create mode 100644 static/public/launcher-logo-black.png

diff --git a/frontend/apps/widget/src/views/HelpView.vue b/frontend/apps/widget/src/views/HelpView.vue
index 28cf8d26..c796808a 100644
--- a/frontend/apps/widget/src/views/HelpView.vue
+++ b/frontend/apps/widget/src/views/HelpView.vue
@@ -113,6 +113,7 @@ const back = async () => {
 onMounted(async () => {
   if (!help.data && !help.loading) await help.load(locale.value)
   if (scroller.value) scroller.value.scrollTop = help.scrollTop
+  if (help.article && help.expandArticles && !widget.isMobileFullScreen) widget.expandWidget()
   if (help.pendingArticle && mounted) {
     const article = help.pendingArticle
     help.pendingArticle = null
diff --git a/static/public/launcher-logo-black.png b/static/public/launcher-logo-black.png
new file mode 100644
index 0000000000000000000000000000000000000000..f00c55b6df6da4cbbf2d7d955d3bd26926d899cf
GIT binary patch
literal 731
zcmeAS@N?(olHy`uVBq!ia0vp^CqS5k8A#4*i(3Pv7>k44ofvPP)Tsw@SkfJR9T^xl
z_H+M9WCijSl0AZa85pY67#JE_7#My5g&JNkFq9fFFuY1&V6d9Oz#v{QXIG#NP-07f
zPl)UPjoLuw|8+Y5*J*>1&j0xa|JUmNUkl{w{9mi{f3?p4^*aC8=>A`?@&Et-U%!6+
z{P`0|{{H<NNJ7B>^$I|}KoN-Gj~_q&uhRob9WDL8UibU=??7>&-v8^hz)F4tjs5fI
z&;RuXARE^MEdm;D05le49Y|0Y$Ob7`s|C~oWB>usFrXmNC?G@d^Fbb<qZvzr{DK)A
zp4~_TvU@yT978H@y}cFdci2F{^`Z5-+2IGRZ~p%!z@);lvGw+%Gk50YGfwSOTUj5)
z3Dk@N=DFOqvD$WR)^P_Pr+d~><(!5Rp80CZnP-z#qEE*NIX~{JQ5D=?`b4X9XQun2
zNgYckB)iXA>!s8BrR>pCmt)^2T<#Ik^p-u`^ICpG1n13LG2i+u);;^_l%%`lymi&L
zzWsYuVt-mEZR@D12yN|~vA$hA|Jmbf6YlHR{$owqlKE%i#_KO<Oq=qGqt`n`ONGt-
z+iCu{h4~%dMEI{&d8q8=>tgR+a?gQHIq=|w&FdfBRdT65+c#NAl$Ue%gc8k%K|*?}
zf@+$D>kl8l%KLNG&MLQ$2`vIn9EvSA;T<tn93S~s?)|T-lHbX3GE`}@Kznobtl1pX
z`F57r{0Uo;#~I!ilm6em^K`!IB-c)rZlRNlTskX5*8I=imec9Ak#pvf6H8r;JSX}D
wsZ16*sp1M_PE8m7G*fBj5)PD*1ae~bFurjWl`2WUe*q-r>FVdQ&MBb@0Cq)O{r~^~

literal 0
HcmV?d00001

diff --git a/static/widget.js b/static/widget.js
index e41da073..243b6256 100644
--- a/static/widget.js
+++ b/static/widget.js
@@ -27,6 +27,8 @@
             this.EXPANDED_WIDTH = '750px';
             this.MOBILE_BREAKPOINT = 600;
             this.LAUNCHER_SIZE = 60;
+            this.LAUNCHER_HOVER_SCALE = 1.08;
+            this.LAUNCHER_OPEN_SCALE = 0.9;
             this.MOBILE_LAUNCHER_SIZE = 60;
             this.CAMPAIGN_POLL_MIN = 2;
             this.CAMPAIGN_POLL_MAX = 60;
@@ -34,6 +36,7 @@
             this.config = config;
             this.iframe = null;
             this.toggleButton = null;
+            this.isLauncherHovered = false;
             this.widgetButtonWrapper = null;
             this.unreadBadge = null;
             this.isChatVisible = false;
@@ -226,8 +229,8 @@
                 display: flex;
                 justify-content: center;
                 align-items: center;
-                box-shadow: 0 3px 8px rgba(9, 14, 21, 0.45), 0 14px 40px rgba(9, 14, 21, 0.55);
-                transition: transform 0.3s ease;
+                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08), 0 10px 28px rgba(0, 0, 0, 0.14);
+                transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
             `;
 
             this.iconContainer = document.createElement('div');
@@ -474,6 +477,14 @@
 
         setupEventListeners () {
             this.toggleButton.addEventListener('click', () => this.toggle());
+            this.toggleButton.addEventListener('mouseenter', () => {
+                this.isLauncherHovered = true;
+                this.applyLauncherScale();
+            });
+            this.toggleButton.addEventListener('mouseleave', () => {
+                this.isLauncherHovered = false;
+                this.applyLauncherScale();
+            });
             window.addEventListener('message', this._boundHandleMessage);
         }
 
@@ -542,7 +553,7 @@
             this.applyIframeLayout();
             this.updateLauncherVisibility();
 
-            this.toggleButton.style.transform = 'scale(0.9)';
+            this.applyLauncherScale();
             this.unreadBadge.style.display = 'none';
 
             if (this.defaultIcon) this.defaultIcon.style.display = 'none';
@@ -559,7 +570,7 @@
             this.iframe.style.display = 'none';
             this.isChatVisible = false;
             this.renderPreviews();
-            this.toggleButton.style.transform = 'scale(1)';
+            this.applyLauncherScale();
             this.updateLauncherVisibility();
 
             if (this.defaultIcon) this.defaultIcon.style.display = 'block';
@@ -575,6 +586,13 @@
             if (this._onHideCallback) this._onHideCallback();
         }
 
+        applyLauncherScale () {
+            if (!this.toggleButton) return;
+            const base = this.isChatVisible ? this.LAUNCHER_OPEN_SCALE : 1;
+            const scale = this.isLauncherHovered ? base * this.LAUNCHER_HOVER_SCALE : base;
+            this.toggleButton.style.transform = `scale(${scale})`;
+        }
+
         updateUnreadCount (count) {
             this.unreadCount = count;
             if (this._onUnreadCountChangeCallback) this._onUnreadCountChangeCallback(count);

From 08e6801fc4ee55ca6646811e1c273cb40875b8fd Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sun, 20 Sep 2026 18:48:51 +0530
Subject: [PATCH 117/178] polish widget UI and fix proactive message delete

Widget:
- home background stays pinned while the content scrolls, fade sits on it
- one radius and shadow scale across cards, buttons and inputs
- live search in the help tab with a "no results" state
- attachment-only messages show "Image" in the conversation preview
- launcher and panel use the same shadows as the header

Admin:
- preview column is a fixed width so zoom does not resize it, hidden on small screens
- preview matches the real widget again
- search spinner replaces the magnifier instead of covering the page

Fixes:
- deleting a proactive message did nothing, the dialog cleared the pending
  id before the handler read it
- an inbox created through the API could not be saved from the form, it
  jumped to the pre-chat tab with no error

Adds livechatWidgetTabs.cy.js covering the proactive message and help
center tabs.
---
 cmd/chat.go                                   |   8 +-
 cmd/widget_campaign.go                        |  13 +
 .../src/components/datatable/DataTable.vue    |  20 +-
 .../admin/help-center/ArticleEditSheet.vue    |  20 +-
 .../admin/inbox/LivechatInboxForm.vue         |  42 +--
 .../admin/inbox/LivechatWidgetPreview.vue     | 130 ++++----
 .../admin/inbox/PreChatFormConfig.vue         |   1 -
 .../features/admin/inbox/WidgetCampaigns.vue  |  20 +-
 .../features/admin/inbox/WidgetHelpConfig.vue |   5 +-
 .../admin/inbox/livechatFormSchema.js         |   2 +
 .../admin/inbox/livechatFormSchema.test.js    |  13 +
 .../src/layouts/admin/AdminSplitLayout.vue    |  13 +-
 .../admin/help-center/HelpCenterTree.vue      |  48 +--
 .../main/src/views/admin/inbox/InboxView.vue  |   2 +-
 .../apps/main/src/views/search/SearchView.vue |  60 ++--
 frontend/apps/widget/src/App.vue              |   9 +-
 .../src/components/AnnouncementCard.vue       |   2 +-
 .../widget/src/components/ArticleReader.vue   |   3 +
 .../src/components/CSATMessageBubble.vue      |  26 +-
 .../apps/widget/src/components/ChatHeader.vue |   4 +-
 .../widget/src/components/ChatMessages.vue    |  14 +-
 .../src/components/CloseWidgetButton.vue      |   8 +-
 .../src/components/ConversationsList.vue      |   3 +-
 .../src/components/HomeExternalLink.vue       |  20 +-
 .../apps/widget/src/components/HomeHeader.vue |  66 +---
 .../apps/widget/src/components/HomeHelp.vue   |   4 +-
 .../src/components/MessageAttachment.vue      |   4 +-
 .../widget/src/components/MessageInput.vue    |   9 +-
 .../widget/src/components/NoticeBanner.vue    |   2 +-
 .../src/components/RecentConversationCard.vue |   5 +-
 .../widget/src/components/ReplyButtons.vue    |   7 +-
 .../components/StartConversationButton.vue    |  23 ++
 .../widget/src/composables/useHeaderTheme.js  |  50 +++
 .../src/composables/useReplyPreviews.js       |   2 +-
 .../src/composables/useStartConversation.js   |  32 ++
 .../apps/widget/src/layouts/MainLayout.vue    |  11 +-
 .../apps/widget/src/layouts/WidgetHeader.vue  |   5 +-
 .../apps/widget/src/utils/messagePreview.js   |  14 +
 .../widget/src/views/ConversationsView.vue    |  39 +--
 frontend/apps/widget/src/views/HelpView.vue   |  48 ++-
 frontend/apps/widget/src/views/HomeView.vue   |  86 ++---
 .../cypress/e2e/ui/livechatInboxForm.cy.js    |   2 +
 .../cypress/e2e/ui/livechatWidgetTabs.cy.js   | 314 ++++++++++++++++++
 frontend/shared-ui/components/SearchInput.vue |  62 ++++
 i18n/en-US.json                               |  20 +-
 scripts/tools-server/README.md                |   7 +-
 scripts/widget-jwt-test/README.md             |   2 +-
 scripts/widget-jwt-test/index.html            |  13 +-
 .../web-templates/help/classic/layout.html    |   1 +
 .../web-templates/help/docs/layout.html       |   1 +
 .../web-templates/help/shared/partials.html   |  13 +
 static/widget.js                              |  21 +-
 52 files changed, 923 insertions(+), 426 deletions(-)
 create mode 100644 frontend/apps/widget/src/components/StartConversationButton.vue
 create mode 100644 frontend/apps/widget/src/composables/useHeaderTheme.js
 create mode 100644 frontend/apps/widget/src/composables/useStartConversation.js
 create mode 100644 frontend/apps/widget/src/utils/messagePreview.js
 create mode 100644 frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js
 create mode 100644 frontend/shared-ui/components/SearchInput.vue

diff --git a/cmd/chat.go b/cmd/chat.go
index 5e0bd3cc..46160845 100644
--- a/cmd/chat.go
+++ b/cmd/chat.go
@@ -97,6 +97,7 @@ type handoffFormReq struct {
 type chatSettingsResponse struct {
 	Campaigns    *struct{} `json:"campaigns,omitempty"`
 	HasCampaigns bool      `json:"has_campaigns"`
+	CampaignDelaySeconds int `json:"campaign_delay_seconds"`
 	livechat.Config
 	// Hide server-side fields from the public widget response.
 	TrustedDomains         *struct{}                     `json:"trusted_domains,omitempty"`
@@ -149,9 +150,10 @@ func handleGetChatSettings(r *fastglue.Request) error {
 	}
 
 	response := chatSettingsResponse{
-		Config:           config,
-		HasCampaigns:     slices.ContainsFunc(config.Campaigns, func(c proactive.Campaign) bool { return c.Enabled }),
-		CustomAttributes: customAttributes,
+		Config:               config,
+		HasCampaigns:         slices.ContainsFunc(config.Campaigns, func(c proactive.Campaign) bool { return c.Enabled }),
+		CampaignDelaySeconds: earliestCampaignDelay(config.Campaigns),
+		CustomAttributes:     customAttributes,
 	}
 
 	// Get business hours data if office hours feature is enabled.
diff --git a/cmd/widget_campaign.go b/cmd/widget_campaign.go
index 3dc435c3..3f4a1915 100644
--- a/cmd/widget_campaign.go
+++ b/cmd/widget_campaign.go
@@ -213,6 +213,19 @@ func campaignSender(app *App, id int) (umodels.User, error) {
 	return app.user.GetAgent(id, "")
 }
 
+func earliestCampaignDelay(campaigns []proactive.Campaign) int {
+	delay := 0
+	for _, campaign := range campaigns {
+		if !campaign.Enabled {
+			continue
+		}
+		if delay == 0 || campaign.DelaySeconds < delay {
+			delay = campaign.DelaySeconds
+		}
+	}
+	return delay
+}
+
 func validCampaignKey(key string) bool {
 	id, err := uuid.Parse(key)
 	return err == nil && id != uuid.Nil
diff --git a/frontend/apps/main/src/components/datatable/DataTable.vue b/frontend/apps/main/src/components/datatable/DataTable.vue
index 5c7e8ee3..a251c603 100644
--- a/frontend/apps/main/src/components/datatable/DataTable.vue
+++ b/frontend/apps/main/src/components/datatable/DataTable.vue
@@ -1,13 +1,13 @@
 <template>
   <div class="w-full space-y-3">
-    <div v-if="searchable" class="relative max-w-xs">
-      <Search class="absolute left-2.5 top-1/2 h-4 w-4 -translate-y-1/2 text-muted-foreground" />
-      <Input
-        v-model="globalFilter"
-        :placeholder="searchPlaceholder || t('globals.terms.search')"
-        class="pl-8"
-      />
-    </div>
+    <SearchInput
+      v-if="searchable"
+      v-model="globalFilter"
+      class="max-w-xs"
+      :placeholder="searchPlaceholder || t('globals.terms.search')"
+      :clear-label="t('globals.messages.clearSearch')"
+      :loading="loading"
+    />
 
     <div
       ref="scrollContainer"
@@ -112,7 +112,8 @@ import {
 import { useVirtualizer } from '@tanstack/vue-virtual'
 import { useI18n } from 'vue-i18n'
 import { computed, ref } from 'vue'
-import { ArrowUpDown, ChevronDown, ChevronUp, Ghost, Search } from 'lucide-vue-next'
+import { ArrowUpDown, ChevronDown, ChevronUp, Ghost } from 'lucide-vue-next'
+import SearchInput from '@shared-ui/components/SearchInput.vue'
 import {
   TableBody,
   TableCell,
@@ -120,7 +121,6 @@ import {
   TableHeader,
   TableRow
 } from '@shared-ui/components/ui/table'
-import { Input } from '@shared-ui/components/ui/input'
 
 const { t } = useI18n()
 
diff --git a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
index 94d16eac..ee1b117b 100644
--- a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
+++ b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
@@ -100,7 +100,7 @@
 
               <div v-if="loadedArticle && helpCenterLocales.length > 1" class="space-y-3">
                 <h3 class="font-medium text-sm text-muted-foreground">
-                  {{ t('globals.terms.language', 2) }}
+                  {{ t('helpCenter.translations') }}
                 </h3>
 
                 <div class="overflow-hidden rounded-md border bg-card">
@@ -198,10 +198,7 @@
                   variant="outline"
                   size="sm"
                   @click="
-                    emit('create-translation-collection', {
-                      article: translationSource,
-                      locale: form.values.locale
-                    })
+                    emit('create-translation-collection', { locale: form.values.locale })
                   "
                 >
                   <Plus class="mr-2 size-4" aria-hidden="true" />
@@ -453,6 +450,10 @@ const props = defineProps({
     type: Object,
     default: null
   },
+  createdCollection: {
+    type: Object,
+    default: null
+  },
   submitForm: {
     type: Function,
     required: true
@@ -614,6 +615,15 @@ watch(
   { immediate: true }
 )
 
+watch(
+  () => props.createdCollection,
+  async (collection) => {
+    if (!collection || !props.isOpen) return
+    await fetchAvailableCollections()
+    form.setFieldValue('collection_id', String(collection.id), false)
+  }
+)
+
 const fetchAvailableCollections = async () => {
   try {
     const { data } = await api.getCollections(props.helpCenterId)
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
index eccc1d29..6da07adb 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
@@ -494,7 +494,7 @@
                           </div>
                           <div
                             v-else-if="item.type === 'external_link'"
-                            class="grid grid-cols-3 gap-2"
+                            class="grid grid-cols-2 gap-2"
                           >
                             <Input
                               v-model="item.text"
@@ -506,12 +506,6 @@
                               placeholder="https://example.com"
                               @change="updateHomeApps"
                             />
-                            <Input
-                              v-model="item.image_url"
-                              type="url"
-                              :placeholder="$t('globals.terms.logoUrl')"
-                              @change="updateHomeApps"
-                            />
                           </div>
                         </div>
                         <Button
@@ -921,6 +915,7 @@
             ref="campaignsRef"
             :model-value="form.values.config.campaigns || []"
             :inbox-id="initialValues.id || 0"
+            :brand-name="form.values.config.brand_name || ''"
             :cooldown="form.values.config.campaign_cooldown_hours ?? 24"
             :show-errors="showCampaignErrors"
             @update:model-value="updateCampaigns"
@@ -1759,7 +1754,7 @@ const addHomeApp = (type) => {
   } else if (type === 'help') {
     homeApps.value.push({ type: 'help' })
   } else {
-    homeApps.value.push({ type: 'external_link', text: '', url: '', image_url: '' })
+    homeApps.value.push({ type: 'external_link', text: '', url: '' })
   }
   updateHomeApps()
 }
@@ -1787,7 +1782,7 @@ const isHomeAppEmpty = (item) => {
   if (item.type === 'help') return false
   return item.type === 'announcement'
     ? !item.title && !item.description && !item.image_url && !item.url
-    : !item.text && !item.url && !item.image_url
+    : !item.text && !item.url
 }
 
 const isHomeAppComplete = (item) => {
@@ -1907,24 +1902,21 @@ watch(
       homeApps.value = newValues.config.home_apps.map((app) => ({ ...app }))
     }
 
-    let pc = newValues.config?.prechat_form
-    if (pc) {
-      pc = normalizePrechatConfig(pc)
-      for (const audience of ['visitors', 'users']) {
-        const existingFields = pc[audience].fields
-        if (existingFields.length === 0) {
-          pc[audience].fields = getDefaultPrechatFields()
-          continue
-        }
-        const existingKeys = new Set(existingFields.map((field) => field.key))
-        let nextOrder = existingFields.reduce((max, field) => Math.max(max, field.order || 0), 0)
-        const missing = getDefaultPrechatFields()
-          .filter((field) => !existingKeys.has(field.key))
-          .map((field) => ({ ...field, order: ++nextOrder }))
-        pc[audience].fields = [...existingFields, ...missing]
+    const pc = normalizePrechatConfig(newValues.config?.prechat_form)
+    for (const audience of ['visitors', 'users']) {
+      const existingFields = pc[audience].fields
+      if (existingFields.length === 0) {
+        pc[audience].fields = getDefaultPrechatFields()
+        continue
       }
-      prechatConfig.value = pc
+      const existingKeys = new Set(existingFields.map((field) => field.key))
+      let nextOrder = existingFields.reduce((max, field) => Math.max(max, field.order || 0), 0)
+      const missing = getDefaultPrechatFields()
+        .filter((field) => !existingKeys.has(field.key))
+        .map((field) => ({ ...field, order: ++nextOrder }))
+      pc[audience].fields = [...existingFields, ...missing]
     }
+    prechatConfig.value = pc
 
     form.setValues(
       {
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
index 613dba5a..f2459ab4 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
@@ -4,13 +4,13 @@
     <transition name="ld-preview-window">
       <div
         v-if="open"
-        class="absolute top-4 left-3 right-3 mx-auto max-w-[360px]"
+        class="absolute top-4 inset-x-0 mx-auto max-w-[400px]"
         :style="{ bottom: windowBottom + 'px' }"
       >
         <div
-          class="libredesk-widget-preview flex flex-col h-full bg-background text-foreground rounded-2xl overflow-hidden shadow-2xl border border-border"
+          class="libredesk-widget-preview flex flex-col h-full bg-background text-foreground rounded-2xl overflow-hidden border border-border"
+          :style="[primaryStyle, { boxShadow: IFRAME_BOX_SHADOW }]"
           :class="isDark ? 'dark' : 'light'"
-          :style="primaryStyle"
         >
           <!-- Chat view -->
           <template v-if="view === 'chat'">
@@ -134,11 +134,14 @@
                   v-if="!openedExisting && quickReplies.length"
                   class="flex flex-wrap justify-end gap-2 mt-auto"
                 >
-                  <span
+                  <Button
                     v-for="reply in quickReplies"
                     :key="reply"
-                    class="rounded-full border border-primary text-primary px-3 py-1.5 text-sm"
-                    >{{ reply }}</span
+                    type="button"
+                    variant="outline"
+                    size="sm"
+                    class="h-auto max-w-full rounded-full py-1.5 text-left whitespace-normal shadow-md"
+                    >{{ reply }}</Button
                   >
                 </div>
                 <template v-if="openedExisting">
@@ -168,7 +171,7 @@
               <!-- Message input -->
               <div class="border-t border-border shrink-0">
                 <div class="p-2">
-                  <div class="border border-input rounded-lg bg-background">
+                  <div class="border border-input rounded-md bg-background">
                     <div class="p-2">
                       <textarea
                         :placeholder="$t('globals.terms.typeMessage')"
@@ -205,23 +208,30 @@
 
           <template v-else>
             <div class="flex-1 min-h-0 relative">
-              <div v-if="view === 'home'" class="h-full overflow-y-auto flex flex-col">
-                <div class="relative" :style="headerStyle">
-                  <div class="p-6">
+              <div v-if="view === 'home'" class="relative h-full bg-background">
+                <div
+                  class="pointer-events-none absolute inset-x-0 top-0"
+                  :style="[headerStyle, { height: `${headerHeight}px` }]"
+                >
+                  <div v-if="showFade" class="absolute inset-x-0 bottom-0 h-20" :style="fadeStyle"></div>
+                </div>
+                <div class="relative h-full overflow-y-auto">
+                <div ref="headerRef">
+                  <div class="px-7 pb-7 pt-7">
                     <img
                       v-if="config.logo_url"
                       :src="config.logo_url"
                       :alt="config.brand_name"
                       class="max-h-7 max-w-full"
                     />
-                    <div class="mt-16" :class="textColorClass">
-                      <h2 class="text-3xl font-bold leading-none tracking-tight break-words">
-                        {{ parsedGreeting }}
-                      </h2>
-                      <p
-                        class="mt-2 max-w-64 text-xl font-medium leading-tight"
+                    <div class="mt-20" :class="textColorClass">
+                      <h2
+                        class="text-3xl font-semibold leading-tight tracking-tight break-words"
                         :class="subTextColorClass"
                       >
+                        {{ parsedGreeting }}
+                      </h2>
+                      <p class="mt-2 text-3xl font-semibold leading-tight tracking-tight break-words">
                         {{ parsedIntroduction }}
                       </p>
                     </div>
@@ -230,53 +240,44 @@
                     <Button
                       type="button"
                       size="lg"
-                      class="w-full rounded-xl font-semibold shadow-md"
+                      class="w-full font-semibold shadow-md"
                       @click="startNew"
                     >
                       {{ startButtonText }}
                       <ArrowRight :size="16" aria-hidden="true" />
                     </Button>
                   </div>
-                  <div
-                    v-if="showFade"
-                    class="absolute bottom-0 left-0 right-0 h-20 pointer-events-none"
-                    :style="fadeStyle"
-                  ></div>
                 </div>
 
-                <div
-                  v-if="homeItems.length"
-                  class="flex flex-col gap-3 bg-background px-4 pt-1 pb-5"
-                >
+                <div v-if="homeItems.length" class="flex flex-col gap-3 px-4 pt-1 pb-5">
                   <template v-for="(item, index) in homeItems" :key="index">
                     <section
                       v-if="item.type === 'help'"
-                      class="space-y-2 rounded-xl border border-border/80 bg-card p-2 shadow-sm"
+                      class="space-y-1 rounded-xl border border-border/80 bg-card p-2 shadow-sm"
                     >
                       <Button
                         type="button"
                         variant="outline"
-                        class="h-10 w-full justify-start rounded-lg"
+                        class="h-10 w-full justify-between px-2"
                         @click="view = 'help'"
                       >
-                        <Search class="size-4" aria-hidden="true" />
                         {{ $t('widget.searchArticles') }}
+                        <Search class="size-4" aria-hidden="true" />
                       </Button>
                       <Button
                         v-for="article in featuredArticles"
                         :key="article.id"
                         type="button"
                         variant="ghost"
-                        class="w-full h-auto justify-start text-left whitespace-normal"
+                        class="w-full h-auto justify-start px-2 py-1.5 text-left whitespace-normal"
                         @click="view = 'help'"
                       >
-                        <FileText class="size-4 shrink-0" aria-hidden="true" />
                         {{ article.title }}
                       </Button>
                     </section>
                     <Card
                       v-else-if="item.type === 'announcement'"
-                      class="overflow-hidden rounded-xl border-border/80 transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
+                      class="overflow-hidden rounded-xl border-border/80 shadow-sm transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
                     >
                       <img
                         v-if="item.image_url"
@@ -298,40 +299,22 @@
                     </Card>
                     <Card
                       v-else
-                      class="rounded-xl border-border/80 transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
+                      class="rounded-xl border-border/80 shadow-sm transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
                     >
-                      <CardContent class="p-4">
-                        <div class="flex items-center gap-3">
-                          <span
-                            class="flex size-9 shrink-0 items-center justify-center rounded-lg bg-muted"
-                          >
-                            <img
-                              v-if="item.image_url"
-                              :src="item.image_url"
-                              alt=""
-                              class="size-5 object-contain"
-                            />
-                            <Globe2
-                              v-else
-                              :size="16"
-                              class="text-muted-foreground"
-                              aria-hidden="true"
-                            />
-                          </span>
-                          <span
-                            class="min-w-0 flex-1 text-sm font-medium leading-snug text-foreground"
-                            >{{ item.text || item.url }}</span
-                          >
-                          <ExternalLink
-                            :size="15"
-                            class="shrink-0 text-muted-foreground"
-                            aria-hidden="true"
-                          />
-                        </div>
+                      <CardContent class="flex items-center gap-3 p-4">
+                        <span class="min-w-0 flex-1 text-sm font-medium leading-snug text-foreground"
+                          >{{ item.text || item.url }}</span
+                        >
+                        <ExternalLink
+                          :size="15"
+                          class="shrink-0 text-muted-foreground"
+                          aria-hidden="true"
+                        />
                       </CardContent>
                     </Card>
                   </template>
                 </div>
+                </div>
               </div>
 
               <!-- Help -->
@@ -348,11 +331,12 @@
                   </button>
                   <h3 class="font-medium truncate">{{ $t('globals.terms.help') }}</h3>
                 </header>
-                <div class="flex gap-2 p-3 border-b border-border shrink-0">
-                  <Input :placeholder="$t('widget.searchArticles')" readonly />
-                  <Button type="button" variant="outline" :aria-label="$t('widget.searchArticles')">
-                    <Search class="size-4" aria-hidden="true" />
-                  </Button>
+                <div class="relative p-3 border-b border-border shrink-0">
+                  <Search
+                    class="absolute left-6 top-1/2 size-4 -translate-y-1/2 text-muted-foreground"
+                    aria-hidden="true"
+                  />
+                  <Input class="pl-10" :placeholder="$t('widget.searchArticles')" readonly />
                 </div>
                 <div class="flex-1 min-h-0 overflow-y-auto">
                   <p
@@ -480,8 +464,8 @@
     <!-- Launcher -->
     <button
       type="button"
-      :aria-label="open ? $t('globals.messages.closeChat') : $t('widget.openChat')"
-      class="absolute flex items-center justify-center rounded-full shadow-lg transition-transform hover:scale-105"
+      :aria-label="open ? $t('globals.messages.closeChat') : $t('globals.messages.openChat')"
+      class="absolute flex items-center justify-center rounded-full transition-transform hover:scale-105"
       :style="launcherStyle"
       @click="open = !open"
     >
@@ -497,11 +481,15 @@
 </template>
 
 <script setup>
+const IFRAME_BOX_SHADOW = 'rgba(9, 14, 21, 0.9) 0px 5px 40px 0px'
+const LAUNCHER_DROP_SHADOW =
+  'drop-shadow(rgba(9, 14, 21, 0.54) 0px 1px 6px) drop-shadow(rgba(9, 14, 21, 0.9) 0px 2px 32px)'
 const BACK_BUTTON_CLASS =
   'flex items-center justify-center size-8 rounded-md hover:bg-accent text-foreground'
 const PREVIEW_NAV_TAB_CLASS = 'flex w-full flex-col items-center justify-center gap-1 py-4'
 
 import { computed, ref, watch } from 'vue'
+import { useElementSize } from '@vueuse/core'
 import { useI18n } from 'vue-i18n'
 import { Button } from '@shared-ui/components/ui/button'
 import { Card, CardContent } from '@shared-ui/components/ui/card'
@@ -515,7 +503,6 @@ import {
   ArrowLeft,
   ArrowUp,
   ExternalLink,
-  Globe2,
   ChevronDown,
   ChevronRight,
   AlertTriangle,
@@ -523,7 +510,6 @@ import {
   Smile,
   Maximize2,
   Search,
-  FileText,
   X
 } from 'lucide-vue-next'
 import HelpCollectionList from '@shared-ui/components/HelpCollectionList.vue'
@@ -549,6 +535,9 @@ const props = defineProps({
 const { t } = useI18n()
 
 const open = ref(true)
+const headerRef = ref(null)
+const { height: headerHeight } = useElementSize(headerRef)
+
 const view = ref('home')
 // The preview can't send/receive, so a sample conversation stands in for a real one.
 const openedExisting = ref(false)
@@ -744,6 +733,7 @@ const campaignStyle = computed(() => ({
   width: `min(280px, calc(100% - ${clampedSide.value * 2}px))`
 }))
 const launcherStyle = computed(() => ({
+  filter: LAUNCHER_DROP_SHADOW,
   width: LAUNCHER_SIZE + 'px',
   height: LAUNCHER_SIZE + 'px',
   backgroundColor: launcherColor.value,
diff --git a/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue b/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
index 82cd0787..0abad5bd 100644
--- a/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
+++ b/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
@@ -29,7 +29,6 @@
       <div class="mt-4 space-y-6">
         <SwitchField
           :title="$t('admin.inbox.livechat.prechatForm.audienceEnabled')"
-          :description="$t('admin.inbox.livechat.prechatForm.audienceEnabled.description')"
           :checked="audienceConfig.enabled"
           @update:checked="audienceConfig.enabled = $event"
         />
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
index 1e2d942f..364b6724 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
@@ -72,7 +72,7 @@ const AUDIENCE_TRANSLATION_KEYS = {
 const SELECT_FIELDS = [
   {
     key: 'audience',
-    labelKey: 'widget.campaign.audience',
+    labelKey: 'globals.terms.audience',
     values: ['all', 'visitors', 'users']
   }
 ]
@@ -81,6 +81,7 @@ const DEVICES = ['desktop', 'mobile']
 const props = defineProps({
   modelValue: { type: Array, default: () => [] },
   inboxId: { type: Number, default: 0 },
+  brandName: { type: String, default: '' },
   cooldown: { type: Number, default: 24 },
   showErrors: { type: Boolean, default: false }
 })
@@ -97,9 +98,10 @@ const pendingDelete = ref(null)
 const stats = ref([])
 const from = ref(new Date(Date.now() - 30 * 86400000).toISOString().slice(0, 10))
 const to = ref(new Date().toISOString().slice(0, 10))
+const brandSenderName = computed(() => props.brandName.trim() || t('widget.brandBot'))
 const senderName = (id) => {
   const agent = usersStore.options.find((item) => String(item.value) === String(id))
-  return agent?.label || t('widget.brandBot')
+  return agent?.label || brandSenderName.value
 }
 
 const campaignErrors = computed(() => {
@@ -187,12 +189,14 @@ const add = (source) => {
   selected.value = item.id
 }
 
+// Radix clears pendingDelete as the dialog closes, so the id comes from the open editor.
 const remove = () => {
+  const id = selected.value
   emit(
     'update:modelValue',
-    props.modelValue.filter((item) => item.id !== pendingDelete.value)
+    props.modelValue.filter((item) => item.id !== id)
   )
-  if (selected.value === pendingDelete.value) selected.value = ''
+  selected.value = ''
   pendingDelete.value = null
 }
 
@@ -422,7 +426,7 @@ onMounted(async () => {
 
     <!-- Campaign editor -->
     <template v-else>
-      <div class="flex items-center justify-between gap-2">
+      <div data-campaign-editor class="flex items-center justify-between gap-2">
         <Button type="button" variant="ghost" size="sm" class="-ml-2" @click="selected = ''">
           <ChevronRight class="size-4 rotate-180" />
           {{ t('widget.backToCampaigns') }}
@@ -489,11 +493,11 @@ onMounted(async () => {
 
         <div class="grid sm:grid-cols-2 gap-4">
           <div class="space-y-2">
-            <Label for="campaign-sender">{{ t('widget.campaignSender') }}</Label>
+            <Label for="campaign-sender">{{ t('globals.terms.sender') }}</Label>
             <SelectAgentCombobox
               id="campaign-sender"
               :model-value="campaign.sender_id === 0 ? 'brand' : String(campaign.sender_id)"
-              :prepend-items="[{ value: 'brand', label: t('widget.brandBot') }]"
+              :prepend-items="[{ value: 'brand', label: brandSenderName }]"
               @update:model-value="update('sender_id', $event === 'brand' ? 0 : Number($event))"
             />
           </div>
@@ -532,7 +536,7 @@ onMounted(async () => {
         </h4>
 
         <div data-campaign-devices class="space-y-3">
-          <p class="text-sm font-medium text-foreground">{{ t('widget.campaign.devices') }}</p>
+          <p class="text-sm font-medium text-foreground">{{ t('globals.terms.device', 2) }}</p>
           <SwitchField
             v-for="device in DEVICES"
             :key="device"
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
index 98565ebc..31b40437 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
@@ -88,6 +88,7 @@ const unusedArticles = computed(() =>
           <div
             v-for="audience in AUDIENCES"
             :key="audience"
+            :data-help-audience="audience"
             class="space-y-4 border rounded-md p-4"
           >
             <p class="text-sm font-medium text-foreground">
@@ -104,7 +105,7 @@ const unusedArticles = computed(() =>
         <p class="text-sm text-muted-foreground">{{ t('widget.helpOnHomeHint') }}</p>
       </div>
 
-      <div class="space-y-4">
+      <div data-featured-articles class="space-y-4">
         <h4 class="text-base font-semibold text-foreground">{{ t('widget.featuredArticles') }}</h4>
         <p class="text-sm text-muted-foreground">{{ t('widget.featuredArticlesHint') }}</p>
 
@@ -151,7 +152,7 @@ const unusedArticles = computed(() =>
           @update:model-value="update('featured_ids', [...modelValue.featured_ids, Number($event)])"
         >
           <SelectTrigger class="max-w-md">
-            <SelectValue :placeholder="t('widget.addArticle')" />
+            <SelectValue :placeholder="t('widget.selectArticle')" />
           </SelectTrigger>
           <SelectContent>
             <SelectItem
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
index 196fddfc..a76df873 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
@@ -151,6 +151,8 @@ export const normalizePrechatConfig = (config = {}) => {
   }
   return {
     ...config,
+    enabled: config.enabled ?? false,
+    fields: config.fields ?? [],
     handoff_only: config.handoff_only ?? false,
     visitors: normalizeAudience(config.visitors),
     users: normalizeAudience(config.users)
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
index 9012d08d..bf1f5ee6 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
@@ -359,6 +359,19 @@ describe('Livechat Inbox Form Schema', () => {
     expect(config.users).toEqual({ enabled: false, title: 'What is the issue?', fields: [] })
   })
 
+  test('an inbox saved without a prechat form still parses', () => {
+    const config = normalizePrechatConfig(undefined)
+
+    expect(config.enabled).toBe(false)
+    expect(config.fields).toEqual([])
+    expect(() =>
+      schema.parse({
+        ...validForm,
+        config: { ...validForm.config, prechat_form: config }
+      })
+    ).not.toThrow()
+  })
+
   test('campaign priority follows saved array order', () => {
     const campaigns = [{ id: 'first' }, { id: 'second' }, { id: 'third' }]
     expect(moveCampaign(campaigns, 2, -1).map(({ id }) => id)).toEqual(['first', 'third', 'second'])
diff --git a/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue b/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue
index daaee647..ce84d059 100644
--- a/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue
+++ b/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue
@@ -1,10 +1,19 @@
 <template>
   <div class="flex justify-between flex-1 min-h-0">
-    <div class="w-full xl:w-8/12 pr-6 relative">
+    <div class="relative pr-6" :class="fixedHelp ? 'flex-1 min-w-0' : 'w-full xl:w-8/12'">
       <slot name="content" />
     </div>
-    <div class="hidden lg:block rounded-md w-3/12 p-2 space-y-2 self-stretch text-sm text-foreground/70">
+    <div
+      class="rounded-md p-2 space-y-2 self-stretch text-sm text-foreground/70"
+      :class="fixedHelp ? 'hidden xl:block w-[432px] shrink-0' : 'hidden lg:block w-3/12'"
+    >
       <slot name="help" />
     </div>
   </div>
 </template>
+
+<script setup>
+defineProps({
+  fixedHelp: { type: Boolean, default: false }
+})
+</script>
diff --git a/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue b/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue
index a90b6584..aaaa554e 100644
--- a/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue
+++ b/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue
@@ -127,7 +127,7 @@
 
   <ArticleEditSheet
     :is-open="showArticleEditSheet"
-    @update:open="$event ? (showArticleEditSheet = true) : closeEditSheet()"
+    @update:open="$event ? (showArticleEditSheet = true) : closeArticleSheet()"
     :article="editingArticle"
     :collection-id="editingArticle?.collection_id || createArticleCollectionId"
     :help-center-id="parseInt(id)"
@@ -135,9 +135,10 @@
     :help-center-locales="helpCenter?.allowed_locales || ['en']"
     :default-locale="props.locale"
     :translation-source="translationSource"
+    :created-collection="createdCollection"
     :submit-form="handleArticleSave"
     :is-loading="isSubmittingArticle"
-    @cancel="closeEditSheet"
+    @cancel="closeArticleSheet"
     @create-translation="openCreateTranslation"
     @create-translation-collection="openCreateTranslationCollection"
     @open-translation="openTranslation"
@@ -146,7 +147,7 @@
 
   <CollectionEditSheet
     :is-open="showCollectionEditSheet"
-    @update:open="$event ? (showCollectionEditSheet = true) : closeEditSheet()"
+    @update:open="$event ? (showCollectionEditSheet = true) : closeCollectionSheet()"
     :collection="editingCollection"
     :help-center-id="parseInt(id)"
     :parent-id="createCollectionParentId"
@@ -154,7 +155,7 @@
     :default-locale="createCollectionLocale || props.locale"
     :submit-form="handleCollectionSave"
     :is-loading="isSubmittingCollection"
-    @cancel="closeEditSheet"
+    @cancel="closeCollectionSheet"
   />
 
   <Sheet :open="showInsights" @update:open="showInsights = $event">
@@ -332,7 +333,7 @@ const editingCollection = ref(null)
 const createCollectionParentId = ref(null)
 const createCollectionLocale = ref('')
 const createArticleCollectionId = ref(null)
-const pendingTranslation = ref(null)
+const createdCollection = ref(null)
 const deletingItem = ref(null)
 
 const breadcrumbLinks = computed(() => [
@@ -427,17 +428,26 @@ const openEditSheet = (item) => {
   }
 }
 
-const closeEditSheet = () => {
+const closeArticleSheet = () => {
   showArticleEditSheet.value = false
-  showCollectionEditSheet.value = false
   editingArticle.value = null
   translationSource.value = null
-  editingCollection.value = null
   selectedItem.value = null
+  createArticleCollectionId.value = null
+  createdCollection.value = null
+}
+
+const closeCollectionSheet = () => {
+  showCollectionEditSheet.value = false
+  editingCollection.value = null
   createCollectionParentId.value = null
   createCollectionLocale.value = ''
-  createArticleCollectionId.value = null
-  pendingTranslation.value = null
+}
+
+const closeEditSheet = () => {
+  closeArticleSheet()
+  closeCollectionSheet()
+  selectedItem.value = null
 }
 
 const visitSite = () => {
@@ -472,7 +482,6 @@ const toggleActive = async () => {
 }
 
 const openCreateCollectionModal = (parentId = null) => {
-  pendingTranslation.value = null
   editingCollection.value = null
   createCollectionParentId.value = typeof parentId === 'number' ? parentId : null
   createCollectionLocale.value = props.locale
@@ -482,7 +491,6 @@ const openCreateCollectionModal = (parentId = null) => {
 const handleCollectionSave = async (formData) => {
   isSubmittingCollection.value = true
   try {
-    const resumeTranslation = !editingCollection.value ? pendingTranslation.value : null
     let savedCollection = null
     if (editingCollection.value) {
       await api.updateCollection(props.id, editingCollection.value.id, formData)
@@ -493,11 +501,10 @@ const handleCollectionSave = async (formData) => {
     emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
       description: t('globals.messages.savedSuccessfully')
     })
-    closeEditSheet()
-    if (resumeTranslation) {
-      createArticleCollectionId.value = savedCollection.id
-      translationSource.value = resumeTranslation
-      showArticleEditSheet.value = true
+    const keepArticleDraft = savedCollection && showArticleEditSheet.value
+    closeCollectionSheet()
+    if (keepArticleDraft) {
+      createdCollection.value = savedCollection
       return
     }
     if (!followSavedLocale(formData.locale)) fetchTree({ silent: true })
@@ -541,11 +548,8 @@ const openCreateTranslation = ({ article, locale }) => {
   translationSource.value = { ...article, locale }
 }
 
-const openCreateTranslationCollection = ({ article, locale }) => {
-  pendingTranslation.value = { ...article, locale }
-  showArticleEditSheet.value = false
-  editingArticle.value = null
-  translationSource.value = null
+const openCreateTranslationCollection = ({ locale }) => {
+  createdCollection.value = null
   editingCollection.value = null
   createCollectionParentId.value = null
   createCollectionLocale.value = locale
diff --git a/frontend/apps/main/src/views/admin/inbox/InboxView.vue b/frontend/apps/main/src/views/admin/inbox/InboxView.vue
index 02f83e4a..a4bc6fd9 100644
--- a/frontend/apps/main/src/views/admin/inbox/InboxView.vue
+++ b/frontend/apps/main/src/views/admin/inbox/InboxView.vue
@@ -1,5 +1,5 @@
 <template>
-  <AdminSplitLayout>
+  <AdminSplitLayout :fixed-help="!!livechatPreview">
     <template #content>
       <router-view />
     </template>
diff --git a/frontend/apps/main/src/views/search/SearchView.vue b/frontend/apps/main/src/views/search/SearchView.vue
index 1bf90ad3..e7307e4f 100644
--- a/frontend/apps/main/src/views/search/SearchView.vue
+++ b/frontend/apps/main/src/views/search/SearchView.vue
@@ -1,45 +1,21 @@
 <template>
   <div class="flex flex-col h-screen">
     <SearchHeader />
-    <div class="flex-1 overflow-y-auto">
+    <div ref="scrollRef" class="flex-1 overflow-y-auto">
       <div class="mx-auto max-w-6xl space-y-4 px-4 py-6">
-        <div class="relative">
-          <SearchIcon
-            class="absolute left-3 top-1/2 -translate-y-1/2 w-5 h-5 text-muted-foreground pointer-events-none"
-            aria-hidden="true"
-          />
-          <Input
-            ref="inputRef"
-            v-model="term"
-            :placeholder="$t('search.searchBy')"
-            :aria-label="$t('globals.terms.search')"
-            class="h-12 pl-10 pr-20 text-base"
-          />
-          <Spinner
-            v-if="loading"
-            size="sm"
-            variant="muted"
-            :absolute="false"
-            :center="false"
-            class="absolute right-10 top-1/2 -translate-y-1/2"
-          />
-          <button
-            v-if="term"
-            type="button"
-            :aria-label="$t('globals.messages.clearSearch')"
-            class="absolute right-2 top-1/2 -translate-y-1/2 p-1.5 rounded-md text-muted-foreground hover:text-foreground hover:bg-accent"
-            @click="term = ''"
-          >
-            <X class="w-4 h-4" aria-hidden="true" />
-          </button>
-        </div>
+        <SearchInput
+          ref="inputRef"
+          v-model="term"
+          :placeholder="$t('search.searchBy')"
+          :aria-label="$t('globals.terms.search')"
+          :clear-label="$t('globals.messages.clearSearch')"
+          input-class="h-12 text-base"
+          :loading="loading"
+        />
 
         <SearchFilters :filters="filters" @update:filters="filters = $event" />
 
-        <div v-if="loading && resultCount === 0" class="flex justify-center items-center h-64">
-          <Spinner :absolute="false" />
-        </div>
-        <div v-else-if="error" class="py-16 text-center space-y-4">
+        <div v-if="error" class="py-16 text-center space-y-4">
           <p class="text-destructive">{{ error }}</p>
           <Button type="button" @click="search"> {{ $t('globals.terms.tryAgain') }} </Button>
         </div>
@@ -76,10 +52,9 @@
 import { ref, computed, watch, onMounted, onBeforeUnmount } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
-import { Search as SearchIcon, X } from 'lucide-vue-next'
+import { Search as SearchIcon } from 'lucide-vue-next'
 import { Button } from '@shared-ui/components/ui/button'
-import { Input } from '@shared-ui/components/ui/input'
-import Spinner from '@shared-ui/components/ui/spinner/Spinner.vue'
+import SearchInput from '@shared-ui/components/SearchInput.vue'
 import SearchHeader from '@main/features/search/SearchHeader.vue'
 import SearchFilters from '@main/features/search/SearchFilters.vue'
 import SearchResults from '@main/features/search/SearchResults.vue'
@@ -201,6 +176,8 @@ const search = async () => {
   }
 }
 
+const scrollRef = ref(null)
+
 const fetchPage = async (type, page, perPage) => {
   if (perPage !== results.value[type].per_page) {
     cursorsByPage[type] = new Map([[1, '']])
@@ -229,7 +206,10 @@ const fetchPage = async (type, page, perPage) => {
   }
 }
 
-const changePage = ({ type, page, perPage }) => fetchPage(type, page, perPage)
+const changePage = async ({ type, page, perPage }) => {
+  await fetchPage(type, page, perPage)
+  scrollRef.value?.scrollTo({ top: 0 })
+}
 
 const changeSort = ({ type, sort }) => {
   if (sorts.value[type] === sort) return
@@ -280,7 +260,7 @@ watch(activeTab, syncRoute)
 
 if (term.value.length >= MIN_SEARCH_LENGTH) search()
 
-onMounted(() => inputRef.value?.$el?.focus?.())
+onMounted(() => inputRef.value?.input?.$el?.focus?.())
 
 onBeforeUnmount(() => {
   clearTimeout(debounceTimer)
diff --git a/frontend/apps/widget/src/App.vue b/frontend/apps/widget/src/App.vue
index 0b878cc7..711fe992 100644
--- a/frontend/apps/widget/src/App.vue
+++ b/frontend/apps/widget/src/App.vue
@@ -64,7 +64,14 @@ onMounted(() => {
 
 const signalWidgetLoaded = async () => {
   if (widgetStore.config.help?.help_center_id) await help.load(locale.value)
-  window.parent.postMessage({ type: 'WIDGET_LOADED', campaigns: widgetStore.config.has_campaigns }, '*')
+  window.parent.postMessage(
+    {
+      type: 'WIDGET_LOADED',
+      campaigns: widgetStore.config.has_campaigns,
+      campaignDelay: widgetStore.config.campaign_delay_seconds || 0
+    },
+    '*'
+  )
 }
 
 const fetchInitialConversations = async () => {
diff --git a/frontend/apps/widget/src/components/AnnouncementCard.vue b/frontend/apps/widget/src/components/AnnouncementCard.vue
index 960b2ce9..f509fe8a 100644
--- a/frontend/apps/widget/src/components/AnnouncementCard.vue
+++ b/frontend/apps/widget/src/components/AnnouncementCard.vue
@@ -1,7 +1,7 @@
 <template>
   <a :href="announcement.url" target="_blank" rel="noopener noreferrer" class="block no-underline">
     <Card
-      class="overflow-hidden rounded-xl border-border/80 transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
+      class="overflow-hidden rounded-xl border-border/80 shadow-sm transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
     >
       <img :src="announcement.image_url" :alt="announcement.title" class="w-full h-auto" />
       <CardContent class="p-4 text-sm">
diff --git a/frontend/apps/widget/src/components/ArticleReader.vue b/frontend/apps/widget/src/components/ArticleReader.vue
index 2f78eb19..b5eadc9a 100644
--- a/frontend/apps/widget/src/components/ArticleReader.vue
+++ b/frontend/apps/widget/src/components/ArticleReader.vue
@@ -30,6 +30,9 @@ const onMessage = (event) => {
     frame.value?.parentElement?.scrollTo({ top: 0 })
   } else if (event.data.type === 'height' && Number.isFinite(event.data.height)) {
     height.value = `${event.data.height}px`
+  } else if (event.data.type === 'scroll' && Number.isFinite(event.data.top)) {
+    const scroller = frame.value?.parentElement
+    if (scroller) scroller.scrollTo({ top: frame.value.offsetTop + event.data.top, behavior: 'smooth' })
   }
 }
 
diff --git a/frontend/apps/widget/src/components/CSATMessageBubble.vue b/frontend/apps/widget/src/components/CSATMessageBubble.vue
index 272b9bec..f36d05e8 100644
--- a/frontend/apps/widget/src/components/CSATMessageBubble.vue
+++ b/frontend/apps/widget/src/components/CSATMessageBubble.vue
@@ -9,7 +9,7 @@
           :key="rating.value"
           @click="selectedRating = rating.value"
           :aria-label="rating.text"
-          class="flex flex-col items-center p-2 rounded-lg cursor-pointer hover:bg-muted transition-all"
+          class="flex flex-col items-center p-2 rounded-md cursor-pointer hover:bg-muted transition-all"
           :class="{ 'scale-125 bg-muted': selectedRating === rating.value }"
         >
           <span class="text-xl mb-1">{{ rating.emoji }}</span>
@@ -21,25 +21,24 @@
         <label class="text-xs text-muted-foreground mb-2 block">
           {{ t('globals.messages.additionalFeedback') }}
         </label>
-        <textarea
+        <Textarea
           v-model="feedback"
           :placeholder="$t('globals.terms.tellUsMore')"
-          class="w-full p-2 text-sm border border-border rounded-md bg-background text-foreground placeholder:text-muted-foreground"
-          rows="2"
+          class="min-h-[60px]"
           maxlength="500"
-        ></textarea>
+        />
         <div class="text-xs text-muted-foreground text-right mt-1">{{ feedback.length }}/500</div>
       </div>
 
-      <button
-        @click="submitRating"
+      <Button
+        type="button"
+        class="w-full"
         :disabled="(!selectedRating && !feedback.trim()) || isSubmitting"
-        class="w-full py-2 bg-primary text-primary-foreground rounded-md text-sm disabled:opacity-50 flex items-center justify-center gap-2 cursor-pointer"
+        @click="submitRating"
       >
-        <div v-if="isSubmitting" class="w-4 h-4 border border-primary-foreground border-t-transparent rounded-full animate-spin"></div>
-        <span v-if="isSubmitting">{{ t('globals.messages.submitting') }}</span>
-        <span v-else>{{ t('globals.messages.submitFeedback') }}</span>
-      </button>
+        <Spinner v-if="isSubmitting" size="sm" :absolute="false" :center="false" />
+        {{ isSubmitting ? t('globals.messages.submitting') : t('globals.messages.submitFeedback') }}
+      </Button>
     </div>
 
     <div v-else class="text-center py-2">
@@ -63,6 +62,9 @@
 import { ref, computed } from 'vue'
 import { useI18n } from 'vue-i18n'
 import api from '@widget/api/index.js'
+import { Button } from '@shared-ui/components/ui/button'
+import { Textarea } from '@shared-ui/components/ui/textarea'
+import { Spinner } from '@shared-ui/components/ui/spinner'
 
 const props = defineProps({
   message: { type: Object, required: true }
diff --git a/frontend/apps/widget/src/components/ChatHeader.vue b/frontend/apps/widget/src/components/ChatHeader.vue
index 7db25bbf..075193aa 100644
--- a/frontend/apps/widget/src/components/ChatHeader.vue
+++ b/frontend/apps/widget/src/components/ChatHeader.vue
@@ -12,7 +12,7 @@
       </Button>
       <ChatTitle />
     </div>
-    <div class="flex items-center gap-2 ml-auto" :class="{ 'mr-12': widgetStore.isMobileFullScreen }">
+    <div class="flex items-center gap-2 ml-auto">
       <DropdownMenu v-if="!widgetStore.isMobileFullScreen || canDownloadTranscript">
         <DropdownMenuTrigger as-child>
           <Button type="button" variant="ghost" size="sm" :aria-label="$t('globals.terms.more')">
@@ -38,6 +38,7 @@
           </DropdownMenuItem>
         </DropdownMenuContent>
       </DropdownMenu>
+      <CloseWidgetButton />
     </div>
   </div>
 </template>
@@ -57,6 +58,7 @@ import api from '@widget/api/index.js'
 import { downloadBlobResponse, parseBlobError } from '@shared-ui/utils/file'
 import { handleHTTPError } from '@shared-ui/utils/http'
 import ChatTitle from './ChatTitle.vue'
+import CloseWidgetButton from './CloseWidgetButton.vue'
 import { useWidgetStore } from '@widget/store/widget.js'
 
 const widgetStore = useWidgetStore()
diff --git a/frontend/apps/widget/src/components/ChatMessages.vue b/frontend/apps/widget/src/components/ChatMessages.vue
index 3aa15c13..abd69c1e 100644
--- a/frontend/apps/widget/src/components/ChatMessages.vue
+++ b/frontend/apps/widget/src/components/ChatMessages.vue
@@ -330,14 +330,16 @@ watch(
     nextTick(() => {
       const id = chatStore.previewUnreadUUID
       chatStore.previewUnreadUUID = null
+      const container = messagesContainer.value
       const target = id && contentEl.value?.querySelector(`[data-message-uuid="${id}"]`)
-      if (target) {
+      const offset = target
+        ? target.getBoundingClientRect().top -
+          container.getBoundingClientRect().top +
+          container.scrollTop
+        : 0
+      if (target && offset > 0 && container.scrollHeight - container.clientHeight - offset > 1) {
         hasUserScrolled.value = true
-        scrollToOffset(
-          target.getBoundingClientRect().top -
-            messagesContainer.value.getBoundingClientRect().top +
-            messagesContainer.value.scrollTop
-        )
+        scrollToOffset(offset)
       } else scrollToBottom()
     })
     if (widgetStore.isOpen && !chatStore.isLoadingConversation) {
diff --git a/frontend/apps/widget/src/components/CloseWidgetButton.vue b/frontend/apps/widget/src/components/CloseWidgetButton.vue
index 41b93404..92801078 100644
--- a/frontend/apps/widget/src/components/CloseWidgetButton.vue
+++ b/frontend/apps/widget/src/components/CloseWidgetButton.vue
@@ -3,6 +3,7 @@
     v-if="widgetStore.isMobileFullScreen"
     @click="closeWidget"
     variant="ghost"
+    size="sm"
     :aria-label="$t('globals.messages.closeChat')"
   >
     <X class="w-4 h-4" />
@@ -15,10 +16,5 @@ import { X } from 'lucide-vue-next'
 import { useWidgetStore } from '@widget/store/widget.js'
 
 const widgetStore = useWidgetStore()
-
-// Send message to parent window (widget.js) to close the widget
-const closeWidget = () => {
-  widgetStore.setOpen(false)
-  window.parent.postMessage({ type: 'CLOSE_WIDGET' }, '*')
-}
+const closeWidget = () => widgetStore.closeWidget()
 </script>
diff --git a/frontend/apps/widget/src/components/ConversationsList.vue b/frontend/apps/widget/src/components/ConversationsList.vue
index 4c895c5b..ab06f85c 100644
--- a/frontend/apps/widget/src/components/ConversationsList.vue
+++ b/frontend/apps/widget/src/components/ConversationsList.vue
@@ -28,7 +28,7 @@
             </div>
             <div class="flex items-center gap-2">
               <p class="text-sm text-muted-foreground truncate flex-1 min-w-0">
-                {{ conversation.last_message.content }}
+                {{ lastMessagePreview(conversation.last_message, t) }}
               </p>
               <UnreadCountBadge :count="conversation.unread_message_count" class="flex-shrink-0" />
             </div>
@@ -50,6 +50,7 @@ import { getRelativeTime } from '@shared-ui/utils/datetime.js'
 import { Avatar, AvatarFallback, AvatarImage } from '@shared-ui/components/ui/avatar'
 import { Spinner } from '@shared-ui/components/ui/spinner'
 import UnreadCountBadge from './UnreadCountBadge.vue'
+import { lastMessagePreview } from '@widget/utils/messagePreview.js'
 
 const chatStore = useChatStore()
 const widgetStore = useWidgetStore()
diff --git a/frontend/apps/widget/src/components/HomeExternalLink.vue b/frontend/apps/widget/src/components/HomeExternalLink.vue
index 3ec6c2b8..0c605b84 100644
--- a/frontend/apps/widget/src/components/HomeExternalLink.vue
+++ b/frontend/apps/widget/src/components/HomeExternalLink.vue
@@ -1,19 +1,13 @@
 <template>
   <a :href="link.url" target="_blank" rel="noopener noreferrer" class="block no-underline">
     <Card
-      class="rounded-xl border-border/80 transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
+      class="rounded-xl border-border/80 shadow-sm transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
     >
-      <CardContent class="p-4">
-        <div class="flex items-center gap-3">
-          <span class="flex size-9 shrink-0 items-center justify-center rounded-lg bg-muted">
-            <img v-if="link.image_url" :src="link.image_url" alt="" class="size-5 object-contain" />
-            <Globe2 v-else size="16" class="text-muted-foreground" aria-hidden="true" />
-          </span>
-          <span class="min-w-0 flex-1 text-sm font-medium leading-snug text-foreground">
-            {{ link.text }}
-          </span>
-          <ExternalLink size="15" class="shrink-0 text-muted-foreground" aria-hidden="true" />
-        </div>
+      <CardContent class="flex items-center gap-3 p-4">
+        <span class="min-w-0 flex-1 text-sm font-medium leading-snug text-foreground">
+          {{ link.text }}
+        </span>
+        <ExternalLink size="15" class="shrink-0 text-muted-foreground" aria-hidden="true" />
       </CardContent>
     </Card>
   </a>
@@ -21,7 +15,7 @@
 
 <script setup>
 import { Card, CardContent } from '@shared-ui/components/ui/card'
-import { ExternalLink, Globe2 } from 'lucide-vue-next'
+import { ExternalLink } from 'lucide-vue-next'
 
 defineProps({
   link: {
diff --git a/frontend/apps/widget/src/components/HomeHeader.vue b/frontend/apps/widget/src/components/HomeHeader.vue
index 8775d012..78922607 100644
--- a/frontend/apps/widget/src/components/HomeHeader.vue
+++ b/frontend/apps/widget/src/components/HomeHeader.vue
@@ -1,6 +1,9 @@
 <template>
-  <div class="relative" :style="headerStyle">
-    <div class="p-7">
+  <div class="relative">
+    <div
+      class="px-7 pb-7"
+      :class="widgetStore.isMobileFullScreen ? 'pt-[max(3.5rem,env(safe-area-inset-top))]' : 'pt-7'"
+    >
       <img
         v-if="config.logo_url"
         :src="config.logo_url"
@@ -8,10 +11,13 @@
         class="max-h-7 max-w-full"
       />
       <div class="mt-20" :class="textColorClass">
-        <h2 class="text-4xl font-bold leading-none tracking-tight break-words">
+        <h2
+          class="text-3xl font-semibold leading-tight tracking-tight break-words"
+          :class="subTextColorClass"
+        >
           {{ parsedGreeting }}
         </h2>
-        <p class="mt-3 max-w-80 text-2xl font-medium leading-tight" :class="subTextColorClass">
+        <p class="mt-2 text-3xl font-semibold leading-tight tracking-tight break-words">
           {{ parsedIntroduction }}
         </p>
       </div>
@@ -19,17 +25,14 @@
     <div class="relative z-10 px-4 pb-5">
       <slot />
     </div>
-    <div
-      v-if="config.home_screen?.background?.type"
-      class="absolute bottom-0 left-0 right-0 h-20 pointer-events-none"
-      :style="fadeStyle"
-    ></div>
   </div>
 </template>
 
 <script setup>
 import { computed } from 'vue'
 import { useUserStore } from '@widget/store/user.js'
+import { useWidgetStore } from '@widget/store/widget.js'
+import { useHeaderTheme } from '@widget/composables/useHeaderTheme.js'
 import { renderTemplate } from '@shared-ui/utils/string.js'
 
 const props = defineProps({
@@ -40,6 +43,7 @@ const props = defineProps({
 })
 
 const userStore = useUserStore()
+const widgetStore = useWidgetStore()
 
 const userData = computed(() => ({
   firstName: userStore.firstName,
@@ -52,47 +56,5 @@ const parsedIntroduction = computed(() =>
   renderTemplate(props.config.introduction_message, userData.value)
 )
 
-const headerStyle = computed(() => {
-  const hs = props.config.home_screen
-  if (!hs?.background?.type) return {}
-
-  const style = {}
-  switch (hs.background.type) {
-    case 'solid':
-      if (hs.background.color) style.backgroundColor = hs.background.color
-      break
-    case 'gradient':
-      if (hs.background.gradient_start && hs.background.gradient_end) {
-        style.background = `linear-gradient(to bottom, ${hs.background.gradient_start}, ${hs.background.gradient_end})`
-      }
-      break
-    case 'image':
-      if (hs.background.image_url) {
-        style.backgroundImage = `url(${hs.background.image_url})`
-        style.backgroundSize = 'cover'
-        style.backgroundPosition = 'center'
-      }
-      break
-  }
-  return style
-})
-
-const headerTextColor = computed(() => props.config.home_screen?.header_text_color)
-
-const textColorClass = computed(() => {
-  if (headerTextColor.value === 'black') return 'text-black'
-  if (headerTextColor.value === 'white') return 'text-white'
-  return ''
-})
-
-const subTextColorClass = computed(() => {
-  if (headerTextColor.value === 'black') return 'text-black/70'
-  if (headerTextColor.value === 'white') return 'text-white/70'
-  return 'text-muted-foreground'
-})
-
-const fadeStyle = {
-  background:
-    'linear-gradient(to bottom, transparent 0%, hsl(var(--background) / 0.08) 20%, hsl(var(--background) / 0.32) 45%, hsl(var(--background) / 0.72) 72%, hsl(var(--background)) 100%)'
-}
+const { textColorClass, subTextColorClass } = useHeaderTheme(computed(() => props.config))
 </script>
diff --git a/frontend/apps/widget/src/components/HomeHelp.vue b/frontend/apps/widget/src/components/HomeHelp.vue
index 3ee8b7f7..6c04c057 100644
--- a/frontend/apps/widget/src/components/HomeHelp.vue
+++ b/frontend/apps/widget/src/components/HomeHelp.vue
@@ -23,11 +23,11 @@ const open = (article) => {
     <Button
       type="button"
       variant="outline"
-      class="h-10 w-full justify-start rounded-lg"
+      class="h-10 w-full justify-between px-2"
       @click="open()"
     >
-      <Search class="size-4" aria-hidden="true" />
       {{ $t('widget.searchArticles') }}
+      <Search class="size-4" aria-hidden="true" />
     </Button>
     <Button
       v-for="article in help.featured"
diff --git a/frontend/apps/widget/src/components/MessageAttachment.vue b/frontend/apps/widget/src/components/MessageAttachment.vue
index ee4561dc..f65de1fe 100644
--- a/frontend/apps/widget/src/components/MessageAttachment.vue
+++ b/frontend/apps/widget/src/components/MessageAttachment.vue
@@ -10,7 +10,7 @@
         <img
           :src="getThumbnailUrl(attachment)"
           :alt="attachment.name"
-          class="max-w-48 max-h-32 rounded-lg object-cover"
+          class="max-w-48 max-h-32 rounded-md object-cover"
           @error="fallbackToOriginal($event, attachment.url)"
           @click="openImage(attachment.url)"
         />
@@ -19,7 +19,7 @@
       <!-- File attachment -->
       <div
         v-else
-        class="flex items-center gap-2 p-2 bg-muted rounded-lg border border-border hover:bg-muted/80 transition-colors"
+        class="flex items-center gap-2 p-2 bg-muted rounded-md border border-border hover:bg-muted/80 transition-colors"
         @click="downloadFile(attachment)"
       >
         <div class="flex-shrink-0">
diff --git a/frontend/apps/widget/src/components/MessageInput.vue b/frontend/apps/widget/src/components/MessageInput.vue
index d6db0bae..6cd5e05b 100644
--- a/frontend/apps/widget/src/components/MessageInput.vue
+++ b/frontend/apps/widget/src/components/MessageInput.vue
@@ -1,16 +1,17 @@
 <template>
-  <div class="border-t focus:ring-0 focus:outline-none">
+  <div class="focus:ring-0 focus:outline-none">
     <ReplyButtons
       v-if="quickReplies.length"
       :replies="quickReplies"
       :disabled="isSending"
-      class="px-2 pt-2"
+      align="end"
+      class="px-2 pb-2"
       @select="sendQuickReply"
     />
     <!-- Message Input -->
-    <div class="p-2">
+    <div class="p-2 border-t">
       <!-- Unified Input Container -->
-      <div class="border border-input rounded-lg bg-background focus-within:border-secondary">
+      <div class="border border-input rounded-md bg-background focus-within:border-secondary">
         <!-- Textarea Container -->
         <div class="p-2">
           <Textarea
diff --git a/frontend/apps/widget/src/components/NoticeBanner.vue b/frontend/apps/widget/src/components/NoticeBanner.vue
index 8a31fd9f..40499888 100644
--- a/frontend/apps/widget/src/components/NoticeBanner.vue
+++ b/frontend/apps/widget/src/components/NoticeBanner.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="bg-secondary/30 border border-secondary rounded-lg p-4" v-if="noticeText" role="status">
+  <div class="bg-secondary/30 border border-secondary rounded-md p-4" v-if="noticeText" role="status">
     <div class="flex items-center justify-center gap-3">
       <AlertTriangle class="flex-shrink-0 text-secondary-foreground" size="16" />
       <p class="text-sm text-secondary-foreground">{{ noticeText }}</p>
diff --git a/frontend/apps/widget/src/components/RecentConversationCard.vue b/frontend/apps/widget/src/components/RecentConversationCard.vue
index c9ee916a..716553c9 100644
--- a/frontend/apps/widget/src/components/RecentConversationCard.vue
+++ b/frontend/apps/widget/src/components/RecentConversationCard.vue
@@ -2,7 +2,7 @@
   <div class="space-y-3">
     <Card
       @click="continueConversation"
-      class="cursor-pointer rounded-xl border-border/70 bg-card/95 shadow-lg transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-xl"
+      class="cursor-pointer rounded-xl border-border/80 shadow-sm transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
     >
       <CardContent class="p-4">
         <div class="flex items-start justify-between">
@@ -14,7 +14,7 @@
             </div>
             <div class="flex gap-2 items-start">
               <div class="text-sm text-foreground line-clamp-2 flex-1 min-w-0">
-                {{ conversation.last_message.content }}
+                {{ lastMessagePreview(conversation.last_message, t) }}
               </div>
               <UnreadCountBadge :count="conversation.unread_message_count" class="flex-shrink-0" />
             </div>
@@ -39,6 +39,7 @@ import UnreadCountBadge from '@widget/components/UnreadCountBadge.vue'
 import { getRelativeTime } from '@shared-ui/utils/datetime.js'
 import { useChatStore } from '@widget/store/chat.js'
 import { useWidgetStore } from '@widget/store/widget.js'
+import { lastMessagePreview } from '@widget/utils/messagePreview.js'
 import { useI18n } from 'vue-i18n'
 
 const props = defineProps({
diff --git a/frontend/apps/widget/src/components/ReplyButtons.vue b/frontend/apps/widget/src/components/ReplyButtons.vue
index f63349d9..e727a50c 100644
--- a/frontend/apps/widget/src/components/ReplyButtons.vue
+++ b/frontend/apps/widget/src/components/ReplyButtons.vue
@@ -1,12 +1,12 @@
 <template>
-  <div class="flex flex-wrap gap-2">
+  <div class="flex flex-wrap gap-2" :class="align === 'end' ? 'justify-end' : 'justify-start'">
     <Button
       v-for="(reply, index) in replies"
       :key="`${index}-${reply}`"
       type="button"
       variant="outline"
       size="sm"
-      class="h-auto max-w-full rounded-full py-1.5 text-left whitespace-normal"
+      class="h-auto max-w-full rounded-full py-1.5 text-left whitespace-normal shadow-md"
       :disabled="disabled"
       @click="emit('select', reply)"
     >
@@ -20,7 +20,8 @@ import { Button } from '@shared-ui/components/ui/button'
 
 defineProps({
   replies: { type: Array, required: true },
-  disabled: { type: Boolean, default: false }
+  disabled: { type: Boolean, default: false },
+  align: { type: String, default: 'start' }
 })
 
 const emit = defineEmits(['select'])
diff --git a/frontend/apps/widget/src/components/StartConversationButton.vue b/frontend/apps/widget/src/components/StartConversationButton.vue
new file mode 100644
index 00000000..194220bc
--- /dev/null
+++ b/frontend/apps/widget/src/components/StartConversationButton.vue
@@ -0,0 +1,23 @@
+<template>
+  <Button v-if="canStartNewConversation" type="button" @click="startNewConversation">
+    {{ label }}
+    <ArrowRight v-if="arrow" size="16" aria-hidden="true" />
+  </Button>
+</template>
+
+<script setup>
+import { computed } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { ArrowRight } from 'lucide-vue-next'
+import { Button } from '@shared-ui/components/ui/button'
+import { useStartConversation } from '@widget/composables/useStartConversation.js'
+
+const props = defineProps({
+  fallbackLabel: { type: String, default: 'globals.messages.startNewConversation' },
+  arrow: { type: Boolean, default: false }
+})
+
+const { t } = useI18n()
+const { configuredLabel, canStartNewConversation, startNewConversation } = useStartConversation()
+const label = computed(() => configuredLabel.value || t(props.fallbackLabel))
+</script>
diff --git a/frontend/apps/widget/src/composables/useHeaderTheme.js b/frontend/apps/widget/src/composables/useHeaderTheme.js
new file mode 100644
index 00000000..b26ee9f0
--- /dev/null
+++ b/frontend/apps/widget/src/composables/useHeaderTheme.js
@@ -0,0 +1,50 @@
+import { computed } from 'vue'
+
+export function useHeaderTheme (config) {
+  const homeScreen = computed(() => config.value?.home_screen)
+  const choice = computed(() => homeScreen.value?.header_text_color)
+
+  const textColorClass = computed(() => {
+    if (choice.value === 'black') return 'text-black'
+    if (choice.value === 'white') return 'text-white'
+    return ''
+  })
+
+  const subTextColorClass = computed(() => {
+    if (choice.value === 'black') return 'text-black/70'
+    if (choice.value === 'white') return 'text-white/70'
+    return 'text-muted-foreground'
+  })
+
+  const backgroundStyle = computed(() => {
+    const background = homeScreen.value?.background
+    if (!background?.type) return {}
+    if (background.type === 'solid' && background.color) {
+      return { backgroundColor: background.color }
+    }
+    if (background.type === 'gradient' && background.gradient_start && background.gradient_end) {
+      return {
+        background: `linear-gradient(to bottom, ${background.gradient_start}, ${background.gradient_end})`
+      }
+    }
+    if (background.type === 'image' && background.image_url) {
+      return {
+        backgroundImage: `url(${background.image_url})`,
+        backgroundSize: 'cover',
+        backgroundPosition: 'center'
+      }
+    }
+    return {}
+  })
+
+  const showFade = computed(
+    () => Boolean(homeScreen.value?.background?.type) && Boolean(homeScreen.value?.fade_background)
+  )
+
+  const fadeStyle = {
+    background:
+      'linear-gradient(to bottom, transparent 0%, hsl(var(--background) / 0.08) 20%, hsl(var(--background) / 0.32) 45%, hsl(var(--background) / 0.72) 72%, hsl(var(--background)) 100%)'
+  }
+
+  return { textColorClass, subTextColorClass, backgroundStyle, showFade, fadeStyle }
+}
diff --git a/frontend/apps/widget/src/composables/useReplyPreviews.js b/frontend/apps/widget/src/composables/useReplyPreviews.js
index 4f03dfbd..b85a502d 100644
--- a/frontend/apps/widget/src/composables/useReplyPreviews.js
+++ b/frontend/apps/widget/src/composables/useReplyPreviews.js
@@ -69,7 +69,7 @@ export function useReplyPreviews() {
           labels: {
             dismiss: t('globals.terms.dismiss'),
             dismissAll: t('widget.dismissPreviews'),
-            open: t('widget.openConversation')
+            open: t('globals.messages.openConversation')
           },
           theme: {
             background: style.backgroundColor,
diff --git a/frontend/apps/widget/src/composables/useStartConversation.js b/frontend/apps/widget/src/composables/useStartConversation.js
new file mode 100644
index 00000000..41aed91f
--- /dev/null
+++ b/frontend/apps/widget/src/composables/useStartConversation.js
@@ -0,0 +1,32 @@
+import { computed } from 'vue'
+import { useChatStore } from '@widget/store/chat.js'
+import { useWidgetStore } from '@widget/store/widget.js'
+import { useUserStore } from '@widget/store/user.js'
+
+export function useStartConversation () {
+  const chatStore = useChatStore()
+  const widgetStore = useWidgetStore()
+  const userStore = useUserStore()
+
+  const audienceConfig = computed(() =>
+    userStore.isVisitor ? widgetStore.config?.visitors : widgetStore.config?.users
+  )
+
+  const configuredLabel = computed(() => audienceConfig.value?.start_conversation_button_text || '')
+
+  // Mirrors the server check, else the button is shown and the send fails.
+  const canStartNewConversation = computed(() => {
+    if (!audienceConfig.value?.allow_start_conversation) return false
+    return (
+      audienceConfig.value?.prevent_multiple_conversations !== true || !chatStore.hasConversations
+    )
+  })
+
+  const startNewConversation = () => {
+    chatStore.setCurrentConversation(null)
+    chatStore.clearMessages()
+    widgetStore.navigateToChat()
+  }
+
+  return { configuredLabel, canStartNewConversation, startNewConversation }
+}
diff --git a/frontend/apps/widget/src/layouts/MainLayout.vue b/frontend/apps/widget/src/layouts/MainLayout.vue
index c1efacb5..ba4836dc 100644
--- a/frontend/apps/widget/src/layouts/MainLayout.vue
+++ b/frontend/apps/widget/src/layouts/MainLayout.vue
@@ -1,7 +1,11 @@
 <template>
   <div class="flex flex-col h-full relative">
-    <div class="absolute top-2 right-2 z-20">
-      <CloseWidgetButton />
+    <div
+      v-if="widgetStore.currentView === 'home'"
+      class="absolute right-2 z-20"
+      :class="widgetStore.isMobileFullScreen ? 'top-[max(1rem,env(safe-area-inset-top))]' : 'top-2'"
+    >
+      <CloseWidgetButton :class="textColorClass" />
     </div>
     <Tabs
       :modelValue="widgetStore.currentView"
@@ -54,6 +58,7 @@
 </template>
 
 <script setup>
+import { computed } from 'vue'
 import { Tabs, TabsList, TabsTrigger, TabsContent } from '@shared-ui/components/ui/tabs'
 import HomeView from '@widget/views/HomeView.vue'
 import { House, MessagesSquare, CircleQuestionMark } from 'lucide-vue-next'
@@ -63,10 +68,12 @@ import ChatView from '@widget/views/ChatView.vue'
 import ConversationsView from '@widget/views/ConversationsView.vue'
 import ConnectionBanner from '@widget/components/ConnectionBanner.vue'
 import CloseWidgetButton from '@widget/components/CloseWidgetButton.vue'
+import { useHeaderTheme } from '@widget/composables/useHeaderTheme.js'
 import { useWidgetStore } from '@widget/store/widget.js'
 
 const widgetStore = useWidgetStore()
 const help = useHelpStore()
+const { textColorClass } = useHeaderTheme(computed(() => widgetStore.config))
 
 const handleTabChange = (value) => {
   if (value === 'home') {
diff --git a/frontend/apps/widget/src/layouts/WidgetHeader.vue b/frontend/apps/widget/src/layouts/WidgetHeader.vue
index 895521e5..5d803a81 100644
--- a/frontend/apps/widget/src/layouts/WidgetHeader.vue
+++ b/frontend/apps/widget/src/layouts/WidgetHeader.vue
@@ -1,8 +1,11 @@
 <template>
-  <div class="flex items-center justify-center p-4 border-b">
+  <div class="relative flex items-center justify-center p-4 border-b">
     <h3 class="text-base font-semibold text-foreground">{{ title }}</h3>
+    <CloseWidgetButton class="absolute right-2 inset-y-0 my-auto" />
   </div>
 </template>
 <script setup>
+import CloseWidgetButton from '@widget/components/CloseWidgetButton.vue'
+
 defineProps(['title'])
 </script>
diff --git a/frontend/apps/widget/src/utils/messagePreview.js b/frontend/apps/widget/src/utils/messagePreview.js
new file mode 100644
index 00000000..905c9bed
--- /dev/null
+++ b/frontend/apps/widget/src/utils/messagePreview.js
@@ -0,0 +1,14 @@
+const attachmentTerm = (contentType = '') => {
+  if (contentType.startsWith('image/')) return 'globals.terms.image'
+  if (contentType.startsWith('video/')) return 'globals.terms.video'
+  if (contentType.startsWith('audio/')) return 'globals.terms.audio'
+  return 'globals.terms.file'
+}
+
+export const lastMessagePreview = (lastMessage, t) => {
+  const content = lastMessage?.content?.trim()
+  if (content) return content
+  const attachment = lastMessage?.attachments?.[0]
+  if (!attachment) return ''
+  return t(attachmentTerm(attachment.content_type), 1)
+}
diff --git a/frontend/apps/widget/src/views/ConversationsView.vue b/frontend/apps/widget/src/views/ConversationsView.vue
index 300241b1..ab970af8 100644
--- a/frontend/apps/widget/src/views/ConversationsView.vue
+++ b/frontend/apps/widget/src/views/ConversationsView.vue
@@ -9,7 +9,7 @@
     </div>
 
     <!-- Floating button with gradient fade -->
-    <div v-if="canStartNewConversation" class="absolute bottom-0 inset-x-0">
+    <div class="absolute bottom-0 inset-x-0">
       <!-- Gradient fade overlay -->
       <div
         class="h-20 bg-gradient-to-t from-background via-background/80 to-transparent pointer-events-none"
@@ -17,47 +17,14 @@
 
       <!-- Floating button -->
       <div class="absolute bottom-4 inset-x-0 mx-auto w-fit z-10">
-        <Button @click="startNewConversation">
-          {{ startButtonText }}
-        </Button>
+        <StartConversationButton />
       </div>
     </div>
   </div>
 </template>
 
 <script setup>
-import { computed } from 'vue'
-import { useI18n } from 'vue-i18n'
-import { Button } from '@shared-ui/components/ui/button'
-import { useChatStore } from '@widget/store/chat.js'
-import { useWidgetStore } from '@widget/store/widget.js'
-import { useUserStore } from '@widget/store/user.js'
 import ConversationsList from '@widget/components/ConversationsList.vue'
 import WidgetHeader from '@widget/layouts/WidgetHeader.vue'
-
-const { t } = useI18n()
-const chatStore = useChatStore()
-const widgetStore = useWidgetStore()
-const userStore = useUserStore()
-
-const startButtonText = computed(() => {
-  const userConfig = userStore.isVisitor ? widgetStore.config?.visitors : widgetStore.config?.users
-  return userConfig?.start_conversation_button_text || t('globals.messages.startNewConversation')
-})
-
-const canStartNewConversation = computed(() => {
-  const userConfig = userStore.isVisitor ? widgetStore.config?.visitors : widgetStore.config?.users
-  // Mirrors the server check, else the button is offered and the send fails.
-  if (!userConfig?.allow_start_conversation) return false
-  return userConfig?.prevent_multiple_conversations !== true || !chatStore.hasConversations
-})
-
-const startNewConversation = () => {
-  // Clear current conversation
-  chatStore.setCurrentConversation(null)
-  chatStore.clearMessages()
-
-  // Navigate directly to chat view
-  widgetStore.navigateToChat()
-}
+import StartConversationButton from '@widget/components/StartConversationButton.vue'
 </script>
diff --git a/frontend/apps/widget/src/views/HelpView.vue b/frontend/apps/widget/src/views/HelpView.vue
index c796808a..c54495dd 100644
--- a/frontend/apps/widget/src/views/HelpView.vue
+++ b/frontend/apps/widget/src/views/HelpView.vue
@@ -1,13 +1,16 @@
 <script setup>
-import { computed, ref, nextTick, onMounted, onUnmounted } from 'vue'
+import { computed, ref, watch, nextTick, onMounted, onUnmounted } from 'vue'
+import { useDebounceFn } from '@vueuse/core'
 import { useI18n } from 'vue-i18n'
-import { ArrowLeft, Search, Maximize2, Minimize2, FileQuestionMark } from 'lucide-vue-next'
+import { ArrowLeft, Maximize2, Minimize2, FileQuestionMark } from 'lucide-vue-next'
 import { Button } from '@shared-ui/components/ui/button'
-import { Input } from '@shared-ui/components/ui/input'
+import SearchInput from '@shared-ui/components/SearchInput.vue'
 import { useHelpStore } from '@widget/store/help.js'
 import { useWidgetStore } from '@widget/store/widget.js'
 import HelpCollectionList from '@shared-ui/components/HelpCollectionList.vue'
 import ArticleReader from '@widget/components/ArticleReader.vue'
+import CloseWidgetButton from '@widget/components/CloseWidgetButton.vue'
+import StartConversationButton from '@widget/components/StartConversationButton.vue'
 import { Spinner } from '@shared-ui/components/ui/spinner'
 import api from '@widget/api/index.js'
 
@@ -20,6 +23,7 @@ onUnmounted(() => {
 })
 const valid = (identity) => mounted && identity === help.identity
 const busy = ref(false)
+const searching = ref(false)
 const error = ref('')
 const scroller = ref(null)
 const backButton = ref(null)
@@ -34,6 +38,18 @@ const toggleExpand = () => {
   widget.toggleExpand()
   help.setExpandArticles(widget.isExpanded)
 }
+const runSearch = useDebounceFn(() => search(), 300)
+watch(
+  () => help.query,
+  (query) => {
+    if (!query.trim()) {
+      help.results = null
+      return
+    }
+    runSearch()
+  }
+)
+
 const retry = () => {
   error.value = ''
   help.load(locale.value)
@@ -44,7 +60,7 @@ const search = async () => {
     help.results = null
     return
   }
-  busy.value = true
+  searching.value = true
   error.value = ''
   const identity = help.identity
   try {
@@ -54,7 +70,7 @@ const search = async () => {
   } catch {
     if (valid(identity) && help.query.trim() === query) error.value = t('widget.helpLoadError')
   } finally {
-    busy.value = false
+    searching.value = false
   }
 }
 const openArticle = async ({ id, slug, locale: articleLocale }) => {
@@ -122,7 +138,7 @@ onMounted(async () => {
   if (help.focusSearch && mounted) {
     help.focusSearch = false
     await nextTick()
-    requestAnimationFrame(() => searchInput.value?.$el?.focus())
+    requestAnimationFrame(() => searchInput.value?.input?.$el?.focus())
   }
 })
 </script>
@@ -156,6 +172,7 @@ onMounted(async () => {
         <Minimize2 v-if="widget.isExpanded" class="size-4" aria-hidden="true" />
         <Maximize2 v-else class="size-4" aria-hidden="true" />
       </Button>
+      <CloseWidgetButton class="absolute right-2 inset-y-0 my-auto" />
     </header>
     <div class="relative flex flex-col flex-1 min-h-0">
       <div
@@ -177,20 +194,14 @@ onMounted(async () => {
         </div>
       </template>
       <template v-else>
-        <form class="flex gap-2 p-3 border-b" @submit.prevent="search">
-          <Input
+        <form class="p-3 border-b" @submit.prevent="search">
+          <SearchInput
             ref="searchInput"
             v-model="help.query"
-            :aria-label="t('widget.searchArticles')"
             :placeholder="t('widget.searchArticles')"
+            :clear-label="t('globals.messages.clearSearch')"
+            :loading="searching"
           />
-          <Button
-            type="submit"
-            variant="outline"
-            :disabled="busy || !help.available"
-            :aria-label="t('globals.terms.search')"
-            ><Search class="size-4" aria-hidden="true"
-          /></Button>
         </form>
         <div
           ref="scroller"
@@ -211,7 +222,10 @@ onMounted(async () => {
             class="flex flex-col items-center justify-center px-4 py-12 text-center"
           >
             <FileQuestionMark class="w-10 h-10 text-muted-foreground mb-4" aria-hidden="true" />
-            <p class="text-sm text-muted-foreground">{{ t('widget.noArticles') }}</p>
+            <p class="text-sm text-muted-foreground">
+              {{ t('widget.noResultsFor', { query: help.query.trim() }) }}
+            </p>
+            <StartConversationButton class="mt-4" />
           </div>
         </div>
       </template>
diff --git a/frontend/apps/widget/src/views/HomeView.vue b/frontend/apps/widget/src/views/HomeView.vue
index d9c46429..c50decab 100644
--- a/frontend/apps/widget/src/views/HomeView.vue
+++ b/frontend/apps/widget/src/views/HomeView.vue
@@ -1,47 +1,48 @@
 <template>
-  <div class="flex flex-col h-full">
+  <div class="relative flex flex-col h-full bg-background">
     <div
-      class="flex-1 min-h-0 overflow-y-auto scrollbar-thin scrollbar-track-transparent scrollbar-thumb-muted-foreground/30 hover:scrollbar-thumb-muted-foreground/50"
+      class="pointer-events-none absolute inset-x-0 top-0"
+      :style="[backgroundStyle, { height: `${headerHeight}px` }]"
     >
-      <div class="flex flex-col">
-        <HomeHeader :config="config">
-          <RecentConversationCard
-            v-if="mostRecentConversation"
-            :conversation="mostRecentConversation"
-          />
-          <div v-else-if="canStartConversation">
-            <Button
-              size="lg"
-              class="w-full rounded-xl font-semibold shadow-md"
-              @click="startConversation"
-            >
-              {{ startButtonText }}
-              <ArrowRight size="16" aria-hidden="true" />
-            </Button>
-          </div>
-        </HomeHeader>
+      <div v-if="showFade" class="absolute inset-x-0 bottom-0 h-20" :style="fadeStyle"></div>
+    </div>
 
-        <div v-if="homeItems.length" class="space-y-3 bg-background px-4 pt-1 pb-5">
-          <template v-for="(item, index) in homeItems" :key="index">
-            <HomeHelp v-if="item.type === 'help'" />
-            <AnnouncementCard v-else-if="item.type === 'announcement'" :announcement="item" />
-            <HomeExternalLink v-else-if="item.type === 'external_link'" :link="item" />
-          </template>
-        </div>
+    <div
+      class="relative flex-1 min-h-0 overflow-y-auto scrollbar-thin scrollbar-track-transparent scrollbar-thumb-muted-foreground/30 hover:scrollbar-thumb-muted-foreground/50"
+    >
+      <HomeHeader ref="headerRef" :config="config">
+        <RecentConversationCard
+          v-if="mostRecentConversation"
+          :conversation="mostRecentConversation"
+        />
+        <StartConversationButton
+          v-else
+          arrow
+          size="lg"
+          fallback-label="globals.messages.sendUsMessage"
+          class="w-full font-semibold shadow-md"
+        />
+      </HomeHeader>
+
+      <div v-if="homeItems.length" class="space-y-3 px-4 pt-1 pb-5">
+        <template v-for="(item, index) in homeItems" :key="index">
+          <HomeHelp v-if="item.type === 'help'" />
+          <AnnouncementCard v-else-if="item.type === 'announcement'" :announcement="item" />
+          <HomeExternalLink v-else-if="item.type === 'external_link'" :link="item" />
+        </template>
       </div>
     </div>
   </div>
 </template>
 
 <script setup>
-import { computed } from 'vue'
-import { ArrowRight } from 'lucide-vue-next'
-import { Button } from '@shared-ui/components/ui/button'
+import { computed, ref } from 'vue'
+import { useElementSize } from '@vueuse/core'
 import { useWidgetStore } from '@widget/store/widget.js'
+import { useHeaderTheme } from '@widget/composables/useHeaderTheme.js'
 import { useChatStore } from '@widget/store/chat.js'
-import { useUserStore } from '@widget/store/user.js'
-import { useI18n } from 'vue-i18n'
 import HomeHeader from '@widget/components/HomeHeader.vue'
+import StartConversationButton from '@widget/components/StartConversationButton.vue'
 import HomeExternalLink from '@widget/components/HomeExternalLink.vue'
 import AnnouncementCard from '@widget/components/AnnouncementCard.vue'
 import RecentConversationCard from '@widget/components/RecentConversationCard.vue'
@@ -50,9 +51,10 @@ import { useHelpStore } from '@widget/store/help.js'
 
 const widgetStore = useWidgetStore()
 const chatStore = useChatStore()
-const userStore = useUserStore()
-const { t } = useI18n()
 const config = computed(() => widgetStore.config)
+const { backgroundStyle, showFade, fadeStyle } = useHeaderTheme(config)
+const headerRef = ref(null)
+const { height: headerHeight } = useElementSize(computed(() => headerRef.value?.$el))
 const help = useHelpStore()
 const homeItems = computed(() =>
   (config.value.home_apps || []).filter((item) => item.type !== 'help' || help.available)
@@ -65,22 +67,4 @@ const mostRecentConversation = computed(() => {
   return conversations[0]
 })
 
-const canStartConversation = computed(() => {
-  const userConfig = userStore.isVisitor ? config.value.visitors : config.value.users
-  // Mirrors the server check, else the button is offered and the send fails.
-  if (!userConfig?.allow_start_conversation) return false
-  return userConfig?.prevent_multiple_conversations !== true || !chatStore.hasConversations
-})
-
-const startButtonText = computed(() => {
-  const isVisitor = userStore.isVisitor
-  return isVisitor
-    ? config.value.visitors?.start_conversation_button_text || t('globals.messages.sendUsMessage')
-    : config.value.users?.start_conversation_button_text || t('globals.messages.sendUsMessage')
-})
-
-const startConversation = () => {
-  chatStore.setCurrentConversation(null)
-  widgetStore.navigateToChat()
-}
 </script>
diff --git a/frontend/cypress/e2e/ui/livechatInboxForm.cy.js b/frontend/cypress/e2e/ui/livechatInboxForm.cy.js
index 983d95ab..9c461ab9 100644
--- a/frontend/cypress/e2e/ui/livechatInboxForm.cy.js
+++ b/frontend/cypress/e2e/ui/livechatInboxForm.cy.js
@@ -30,6 +30,8 @@ describe('Live chat inbox form', () => {
   let inboxId
 
   beforeEach(() => {
+    // radix-vue's select focuses a node that is already gone in headless runs.
+    Cypress.on('uncaught:exception', (err) => !err.message.includes("reading 'focus'"))
     cy.viewport(1280, 800)
     cy.login()
   })
diff --git a/frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js b/frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js
new file mode 100644
index 00000000..6db7b495
--- /dev/null
+++ b/frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js
@@ -0,0 +1,314 @@
+// The steps run in order and share the inbox created by the first one.
+
+const stamp = Date.now()
+const inboxName = `Cypress Widget Tabs ${stamp}`
+const brandName = `Cypress Tabs Brand ${stamp}`
+const campaignName = `Cypress Campaign ${stamp}`
+const campaignMessage = `Need a hand with pricing? ${stamp}`
+const secondCampaignName = `Cypress Second ${stamp}`
+const hcName = `Cypress Widget HC ${stamp}`
+const hcSlug = `cypress-widget-hc-${stamp}`
+const collectionName = `Cypress Collection ${stamp}`
+const articleTitle = `Cypress Article ${stamp}`
+const listPath = '/admin/inboxes'
+
+const openTab = (label) => cy.get('[role="tab"]').contains(label).click()
+
+const selectOption = (trigger, option) => {
+  cy.get(trigger).click()
+  cy.get('[role="option"]').contains(option).click()
+  // The listbox keeps a focus guard over the form until it has finished closing.
+  cy.get('[role="option"]').should('not.exist')
+}
+
+const editInbox = (inboxId) => cy.visit(`${listPath}/${inboxId}/edit`)
+
+const openCampaign = (name) => cy.contains('button', name).click()
+
+describe('Live chat inbox form: proactive messages and help center tabs', () => {
+  let inboxId
+  let helpCenterId
+  let articleId
+
+  before(() => {
+    cy.login()
+    cy.api('POST', '/api/v1/help-centers', {
+      name: hcName,
+      slug: hcSlug,
+      page_title: `Help ${stamp}`,
+      default_locale: 'en',
+      allowed_locales: ['en'],
+      template: 'docs'
+    })
+      .then(({ body }) => {
+        helpCenterId = body.data.id
+        return cy.api('POST', `/api/v1/help-centers/${helpCenterId}/collections`, {
+          name: collectionName,
+          locale: 'en',
+          sort_order: 1,
+          is_published: true
+        })
+      })
+      .then(({ body }) =>
+        cy.api('POST', `/api/v1/collections/${body.data.id}/articles`, {
+          title: articleTitle,
+          content: '<p>Cypress body.</p>',
+          locale: 'en',
+          status: 'published'
+        })
+      )
+      .then(({ body }) => {
+        articleId = body.data.id
+        expect(articleId).to.be.a('number')
+      })
+  })
+
+  beforeEach(() => {
+    // radix-vue's select focuses a node that is already gone in headless runs.
+    Cypress.on('uncaught:exception', (err) => !err.message.includes("reading 'focus'"))
+    cy.viewport(1280, 900)
+    cy.login()
+  })
+
+  after(() => {
+    if (inboxId) cy.api('DELETE', `/api/v1/inboxes/${inboxId}`, null, { failOnStatusCode: false })
+    if (helpCenterId) {
+      cy.api('DELETE', `/api/v1/help-centers/${helpCenterId}`, null, { failOnStatusCode: false })
+    }
+  })
+
+  it('creates the inbox the other steps edit', () => {
+    cy.intercept('POST', '**/api/v1/inboxes').as('createInbox')
+
+    cy.visit('/admin/inboxes/new')
+    cy.contains('Create a live chat inbox').click()
+    cy.get('input[name="name"]').type(inboxName)
+    cy.get('input[name="config.brand_name"]').type(brandName)
+    cy.get('button[type="submit"]').click()
+
+    cy.wait('@createInbox').then(({ response }) => {
+      expect(response.statusCode).to.eq(200)
+      inboxId = response.body.data.id
+    })
+  })
+
+  it('saves an inbox created outside the form, which carries no prechat config', () => {
+    const apiInboxName = `${inboxName} api`
+    cy.api('POST', '/api/v1/inboxes', {
+      name: apiInboxName,
+      channel: 'livechat',
+      enabled: true,
+      config: {
+        brand_name: brandName,
+        colors: { primary: '#112233' },
+        launcher: { position: 'right' }
+      }
+    }).then(({ body }) => {
+      const apiInboxId = body.data.id
+      cy.intercept('PUT', `**/api/v1/inboxes/${apiInboxId}`).as('updateApiInbox')
+
+      editInbox(apiInboxId)
+      cy.get('input[name="config.website_url"]').type('https://cypress.test/api-inbox')
+      cy.get('button[type="submit"]').click()
+      cy.wait('@updateApiInbox').its('response.statusCode').should('eq', 200)
+
+      cy.api('DELETE', `/api/v1/inboxes/${apiInboxId}`, null, { failOnStatusCode: false })
+    })
+  })
+
+  it('saves a proactive message and loads every field back', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    openTab('Proactive messages')
+    cy.contains('button', 'Add proactive message').click()
+
+    cy.get('#campaign-name').clear().type(campaignName)
+    cy.get('#campaign-message').clear().type(campaignMessage)
+    cy.get('#campaign-include_urls').clear().type('/pricing\nhttps://example.com/docs/*')
+    cy.get('#campaign-exclude_urls').clear().type('/checkout/*')
+    cy.get('#campaign-delay_seconds').type('{selectall}25')
+    cy.get('#campaign-event').clear().type('pricing_viewed')
+    selectOption('#campaign-repeat', 'After an interval')
+    cy.get('#campaign-repeat_hours').type('{selectall}12')
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
+
+    editInbox(inboxId)
+    openTab('Proactive messages')
+    openCampaign(campaignName)
+
+    cy.get('#campaign-name').should('have.value', campaignName)
+    cy.get('#campaign-message').should('have.value', campaignMessage)
+    cy.get('#campaign-include_urls').should(
+      'have.value',
+      '/pricing\nhttps://example.com/docs/*'
+    )
+    cy.get('#campaign-exclude_urls').should('have.value', '/checkout/*')
+    cy.get('#campaign-delay_seconds').should('have.value', '25')
+    cy.get('#campaign-event').should('have.value', 'pricing_viewed')
+    cy.get('#campaign-repeat_hours').should('have.value', '12')
+  })
+
+  it('rejects a proactive message with an empty message', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    openTab('Proactive messages')
+    openCampaign(campaignName)
+    cy.get('#campaign-message').clear()
+
+    cy.get('button[type="submit"]').click()
+
+    cy.contains('Message cannot be empty').should('be.visible')
+    cy.get('@updateInbox.all').should('have.length', 0)
+  })
+
+  it('rejects a repeat interval outside the allowed range', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    openTab('Proactive messages')
+    openCampaign(campaignName)
+    cy.get('#campaign-repeat_hours').type('{selectall}9000')
+
+    cy.get('button[type="submit"]').click()
+
+    cy.get('#campaign-repeat_hours').should('have.attr', 'aria-invalid', 'true')
+    cy.get('@updateInbox.all').should('have.length', 0)
+  })
+
+  it('rejects a proactive message with both devices turned off', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    openTab('Proactive messages')
+    openCampaign(campaignName)
+    cy.get('[data-campaign-devices] button[role="switch"]').each(($switch) => {
+      cy.wrap($switch).click()
+    })
+
+    cy.get('button[type="submit"]').click()
+
+    cy.contains('Select at least one device').should('be.visible')
+    cy.get('@updateInbox.all').should('have.length', 0)
+  })
+
+  it('persists the enabled toggle and the order of two proactive messages', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    openTab('Proactive messages')
+    cy.contains('button', 'Add proactive message').click()
+    cy.get('#campaign-name').clear().type(secondCampaignName)
+    cy.get('#campaign-message').clear().type(`Second message ${stamp}`)
+    cy.contains('button', 'Back to proactive messages').click()
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
+
+    editInbox(inboxId)
+    openTab('Proactive messages')
+    // A new proactive message starts paused, so one click enables it.
+    cy.contains('button', campaignName)
+      .parents('.border')
+      .first()
+      .find('button[role="switch"][aria-label="Enabled"]')
+      .should('have.attr', 'data-state', 'unchecked')
+      .click()
+    cy.contains('button', secondCampaignName)
+      .parents('.border')
+      .first()
+      .find('button[aria-label="Move up"]')
+      .click()
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
+
+    cy.api('GET', `/api/v1/inboxes/${inboxId}`).then(({ body }) => {
+      const campaigns = body.data.config.campaigns
+      expect(campaigns.map((item) => item.name)).to.deep.eq([secondCampaignName, campaignName])
+      expect(campaigns.find((item) => item.name === campaignName).enabled).to.eq(true)
+    })
+  })
+
+  it('deletes a proactive message', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    openTab('Proactive messages')
+    openCampaign(secondCampaignName)
+    cy.get('[data-campaign-editor]').contains('button', 'Delete').click()
+    cy.get('[role="alertdialog"]').contains('button', 'Delete').click()
+    cy.get('[data-campaign-editor]').should('not.exist')
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
+
+    editInbox(inboxId)
+    openTab('Proactive messages')
+    cy.contains(secondCampaignName).should('not.exist')
+    cy.contains(campaignName).should('exist')
+  })
+
+  it('links a help center, shows the help tab and features an article', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    openTab('Help center')
+    selectOption('#widget-help-center', hcName)
+
+    cy.get('[data-help-audience="visitors"]').contains('Show Help tab').should('be.visible')
+    cy.contains('Featured articles').should('be.visible')
+    cy.get('[data-featured-articles] button[role="combobox"]').should('not.be.disabled').click()
+    cy.get('[role="option"]').contains(articleTitle).click()
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
+
+    editInbox(inboxId)
+    openTab('Help center')
+    cy.get('#widget-help-center').should('contain', hcName)
+    cy.contains(articleTitle).should('be.visible')
+
+    cy.api('GET', `/api/v1/inboxes/${inboxId}`).then(({ body }) => {
+      const help = body.data.config.help
+      expect(help.help_center_id).to.eq(helpCenterId)
+      expect(help.featured_ids).to.deep.eq([articleId])
+    })
+  })
+
+  it('removes a featured article', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    openTab('Help center')
+    cy.get('[data-featured-articles] button[aria-label="Remove"]').click()
+    cy.get('[data-featured-articles] button[aria-label="Remove"]').should('not.exist')
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
+
+    cy.api('GET', `/api/v1/inboxes/${inboxId}`).then(({ body }) => {
+      expect(body.data.config.help.featured_ids).to.deep.eq([])
+    })
+  })
+
+  it('unlinks the help center and hides its settings', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    openTab('Help center')
+    selectOption('#widget-help-center', 'None')
+
+    cy.contains('Featured articles').should('not.exist')
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
+
+    cy.api('GET', `/api/v1/inboxes/${inboxId}`).then(({ body }) => {
+      expect(body.data.config.help.help_center_id).to.eq(0)
+    })
+  })
+})
diff --git a/frontend/shared-ui/components/SearchInput.vue b/frontend/shared-ui/components/SearchInput.vue
new file mode 100644
index 00000000..94039297
--- /dev/null
+++ b/frontend/shared-ui/components/SearchInput.vue
@@ -0,0 +1,62 @@
+<template>
+  <div class="relative">
+    <Spinner
+      v-if="loading"
+      size="sm"
+      variant="muted"
+      :absolute="false"
+      :center="false"
+      class="absolute left-3 top-1/2 size-4 -translate-y-1/2 pointer-events-none"
+    />
+    <Search
+      v-else
+      class="absolute left-3 top-1/2 size-4 -translate-y-1/2 text-muted-foreground pointer-events-none"
+      aria-hidden="true"
+    />
+    <Input
+      ref="input"
+      :model-value="modelValue"
+      :placeholder="placeholder"
+      :aria-label="ariaLabel || placeholder"
+      :class="['pl-10', modelValue ? 'pr-10' : 'pr-3', inputClass]"
+      @update:model-value="emit('update:modelValue', $event)"
+    />
+    <slot name="trailing" />
+    <button
+      v-if="modelValue"
+      type="button"
+      :aria-label="clearLabel"
+      class="absolute right-2 top-1/2 -translate-y-1/2 p-1.5 rounded-md text-muted-foreground hover:text-foreground hover:bg-accent"
+      @click="clear"
+    >
+      <X class="size-4" aria-hidden="true" />
+    </button>
+  </div>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { Search, X } from 'lucide-vue-next'
+import { Input } from '@shared-ui/components/ui/input'
+import { Spinner } from '@shared-ui/components/ui/spinner'
+
+defineProps({
+  modelValue: { type: String, default: '' },
+  placeholder: { type: String, default: '' },
+  ariaLabel: { type: String, default: '' },
+  clearLabel: { type: String, default: '' },
+  inputClass: { type: [String, Array, Object], default: '' },
+  loading: { type: Boolean, default: false }
+})
+
+const emit = defineEmits(['update:modelValue', 'clear'])
+const input = ref(null)
+
+const clear = () => {
+  emit('update:modelValue', '')
+  emit('clear')
+  input.value?.$el?.focus?.()
+}
+
+defineExpose({ input })
+</script>
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 5b3c45e0..3c99e1f4 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -392,7 +392,6 @@
   "admin.inbox.livechat.prechatForm.enabled": "Enable pre-chat form",
   "admin.inbox.livechat.prechatForm.enabled.description": "Show a form to collect information before chat starts",
   "admin.inbox.livechat.prechatForm.audienceEnabled": "Show form to this audience",
-  "admin.inbox.livechat.prechatForm.audienceEnabled.description": "Ask the selected audience to fill this form",
   "admin.inbox.livechat.prechatForm.fields": "Form fields",
   "admin.inbox.livechat.prechatForm.handoffOnly": "Show only during AI handoff",
   "admin.inbox.livechat.prechatForm.handoffOnly.description": "Skip this form when a chat starts. Show it when the AI needs to transfer the conversation to a human.",
@@ -873,6 +872,8 @@
   "globals.messages.clearSearch": "Clear search",
   "globals.messages.close": "Close",
   "globals.messages.closeChat": "Close chat",
+  "globals.messages.openChat": "Open chat",
+  "globals.messages.openConversation": "Open conversation",
   "globals.messages.connected": "Connected",
   "globals.messages.connecting": "Connecting...",
   "globals.messages.connectionFailedRefresh": "Connection failed. Please refresh.",
@@ -998,6 +999,7 @@
   "globals.terms.article": "Article | Articles",
   "globals.terms.ascending": "Ascending",
   "globals.terms.assignedTeam": "Assigned team",
+  "globals.terms.audience": "Audience",
   "globals.terms.assignee": "Assignee",
   "globals.terms.attachment": "Attachment | Attachments",
   "globals.terms.audio": "Audio",
@@ -1074,6 +1076,7 @@
   "globals.terms.general": "General",
   "globals.terms.appearance": "Appearance",
   "globals.terms.desktop": "Desktop",
+  "globals.terms.device": "Device | Devices",
   "globals.terms.tablet": "Tablet",
   "globals.terms.mobile": "Mobile",
   "globals.terms.good": "Good",
@@ -1177,6 +1180,7 @@
   "globals.terms.secret": "Secret | Secrets",
   "globals.terms.security": "Security",
   "globals.terms.select": "Select",
+  "globals.terms.sender": "Sender",
   "globals.terms.sendWelcomeEmail": "Send welcome email? | Send welcome emails?",
   "globals.terms.sent": "Sent",
   "globals.terms.setPassword": "Set password | Set passwords",
@@ -1245,6 +1249,7 @@
   "helpCenter.aiEnabledHint": "Takes effect only when the article is published. Enable it in one language only, not in every translation.",
   "helpCenter.addTranslation": "Add translation",
   "helpCenter.translationOf": "Translation of “{title}”",
+  "helpCenter.translations": "Translations",
   "helpCenter.saveBeforeSwitchingTranslation": "Unsaved changes would be lost. Save the article before switching languages.",
   "helpCenter.saveBeforeTranslation": "Unsaved changes would be lost. Save the article before adding a translation.",
   "helpCenter.customCSS": "Custom CSS",
@@ -1643,7 +1648,7 @@
   "webhook.new": "New webhook",
   "webhook.sendTest": "Send test",
   "webhook.sentSuccessfully": "Webhook sent successfully",
-  "widget.addArticle": "Add article",
+  "widget.selectArticle": "Select article",
   "widget.addCampaign": "Add proactive message",
   "widget.addHelpHomeApp": "Add help articles",
   "widget.articleUnavailable": "Article unavailable",
@@ -1652,10 +1657,8 @@
   "widget.brandBot": "Brand bot",
   "widget.campaign.all": "Everyone",
   "widget.campaign.any": "Any time",
-  "widget.campaign.audience": "Audience",
   "widget.campaign.business_hours": "Business hours rule",
   "widget.campaign.delay_seconds": "Active time on page (seconds)",
-  "widget.campaign.devices": "Devices",
   "widget.campaign.dismissed": "Dismissed",
   "widget.campaign.displayed": "Displayed",
   "widget.campaign.event": "Optional event name",
@@ -1678,7 +1681,6 @@
   "widget.campaignDeviceRequired": "Select at least one device. This proactive message cannot appear until desktop or mobile is enabled.",
   "widget.campaignLimitReached": "You have reached the limit of 50 proactive messages. Delete one to add another.",
   "widget.campaignPriorityHint": "Messages are checked from top to bottom. The first matching message is shown.",
-  "widget.campaignSender": "Sender",
   "widget.campaignsHint": "Show a message on matching pages before the chat is opened. A conversation is created only when someone replies to it.",
   "widget.campaignStats": "Proactive message results",
   "widget.campaignUrlLimit": "Add up to 20 page patterns.",
@@ -1690,7 +1692,6 @@
   "widget.featuredArticlesHint": "Choose up to 10 articles. Leave empty to show popular articles.",
   "widget.genericNotice": "Generic notification",
   "widget.helpFeedbackError": "Feedback could not be saved. Try again.",
-  "widget.helpful": "Was this helpful?",
   "widget.helpHomeAppHint": "Shows a search button and the featured articles set in the Help center tab.",
   "widget.helpHomeAppRequiresCenter": "Choose a help center in the Help center tab before adding this card.",
   "widget.helpLoadError": "Help could not be loaded. Try again or send us a message.",
@@ -1702,9 +1703,8 @@
   "widget.newCampaign": "New proactive message",
   "widget.newReply": "You have a new reply",
   "widget.openInHelpCenter": "Open in help center",
-  "widget.noArticles": "No articles found. Try different words or send us a message.",
-  "widget.openConversation": "Open conversation",
-  "widget.openChat": "Open chat",
+  "widget.noArticles": "No published articles yet.",
+  "widget.noResultsFor": "No results for “{query}”",
   "widget.prechatForm.startChat": "Start chat",
   "widget.prechatForm.continueToHuman": "Continue to a human",
   "conversation.sidebarCounts.all": "{count} open conversation in all | {count} open conversations in all",
@@ -1716,7 +1716,7 @@
   "widget.proactiveMessages": "Proactive messages",
   "widget.replyPreviews": "Replies above the launcher",
   "widget.replyTeam": "Route replies to team",
-  "widget.searchArticles": "Search help articles",
+  "widget.searchArticles": "Search for help",
   "widget.showHelpTab": "Show Help tab",
   "widget.urlPatternsHint": "One URL or path per line. Use * to match any characters. Empty includes match every page."
 }
diff --git a/scripts/tools-server/README.md b/scripts/tools-server/README.md
index e09c857d..26e2d5dc 100644
--- a/scripts/tools-server/README.md
+++ b/scripts/tools-server/README.md
@@ -5,8 +5,11 @@ It holds two fake accounts and looks them up by the contact's external user id,
 which libredesk sends in the `X-Libredesk-Contact-External-Id` header. Add your
 own test users by editing the `users` map in `main.go`.
 
-Custom tools are only called by AI assistants. Copilot gets the built-in tools
-and never touches these.
+AI assistants call every enabled custom tool. Copilot and Generate Reply call the
+ones with "Available in Copilot" or "Available in Generate Reply" turned on, and a
+tool with "Require agent approval" on waits for the agent to approve the call there.
+"Require verified contact" applies to assistant runs only, since an agent is the one
+asking on the Copilot and Generate Reply surfaces.
 
 ## Run
 
diff --git a/scripts/widget-jwt-test/README.md b/scripts/widget-jwt-test/README.md
index 0cbf491f..b3cd0f65 100644
--- a/scripts/widget-jwt-test/README.md
+++ b/scripts/widget-jwt-test/README.md
@@ -16,7 +16,7 @@ Open `http://localhost:8005`, then fill in:
 
 - **baseURL**: your Libredesk instance (default `http://localhost:8001` - Default points to the widget dev server, not the API server)
 - **inboxID**: the livechat inbox's UUID (from the inbox's installation snippet)
-- **Signing secret**: the "Secret Key" from that inbox's Security tab
+- **Signing secret**: the "Secret Key" from the inbox form
 
 `exp` is set to now + 1 hour on every generate. Use "Clear session" to drop the
 widget's cookies and start over as a brand-new visitor.
diff --git a/scripts/widget-jwt-test/index.html b/scripts/widget-jwt-test/index.html
index 3abba578..7b69f6de 100644
--- a/scripts/widget-jwt-test/index.html
+++ b/scripts/widget-jwt-test/index.html
@@ -2,9 +2,14 @@
 <html lang="en">
 <head>
 <meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
 <title>Libredesk widget - JWT test</title>
 <style>
   body { font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif; max-width: 720px; margin: 40px auto; padding: 0 16px; color: #222; }
+  @media (max-width: 640px) {
+    body { margin: 16px auto; }
+    .row { flex-direction: column; gap: 0; }
+  }
   h1 { font-size: 18px; }
   label { display: block; margin-top: 14px; font-size: 13px; font-weight: 600; color: #444; }
   input, textarea { width: 100%; box-sizing: border-box; font-family: ui-monospace, monospace; font-size: 13px; padding: 8px; margin-top: 4px; border: 1px solid #ccc; border-radius: 6px; }
@@ -16,12 +21,13 @@
   .row { display: flex; gap: 12px; }
   .row > div { flex: 1; }
   .hint { font-size: 12px; color: #777; font-weight: 400; }
+  .field-hint { display: block; margin-top: 4px; }
 </style>
 </head>
 <body>
 
 <h1>Libredesk widget - JWT auth test</h1>
-<p class="hint">Edit the payload below, click "Sign JWT &amp; load widget". <code>exp</code> is auto-set to now + 1 hour on every generate so the token never shows up expired. The signing secret must match the "Secret Key" configured on this inbox's Security tab in Libredesk admin.</p>
+<p class="hint">Edit the payload below, then load the widget. The signing secret must match the "Secret Key" configured in the inbox form.</p>
 
 <div class="row">
   <div>
@@ -29,8 +35,9 @@
     <input id="baseURL" value="http://localhost:8001">
   </div>
   <div>
-    <label>inboxID</label>
-    <input id="inboxID" placeholder="livechat inbox UUID from inbox form" value="">
+    <label for="inboxID">Inbox UUID</label>
+    <input id="inboxID" aria-describedby="inboxIDHint" value="">
+    <span id="inboxIDHint" class="hint field-hint">Copy the UUID from your inbox form.</span>
   </div>
 </div>
 
diff --git a/static/public/web-templates/help/classic/layout.html b/static/public/web-templates/help/classic/layout.html
index 9716e1fb..7953a1e5 100644
--- a/static/public/web-templates/help/classic/layout.html
+++ b/static/public/web-templates/help/classic/layout.html
@@ -75,6 +75,7 @@
     </script>
     <script src="/static/public/static/help-center-search.js?v={{ AssetVer }}" defer></script>
     {{ if .Data.HelpCenter.CustomJS }}<script>{{ .Data.HelpCenter.CustomJS }}</script>{{ end }}
+    {{ template "hc-livechat-widget" . }}
 </body>
 </html>
 {{ end }}
diff --git a/static/public/web-templates/help/docs/layout.html b/static/public/web-templates/help/docs/layout.html
index 9269c52f..1cd742ad 100644
--- a/static/public/web-templates/help/docs/layout.html
+++ b/static/public/web-templates/help/docs/layout.html
@@ -191,6 +191,7 @@
     </script>
     <script src="/static/public/static/help-center-search.js?v={{ AssetVer }}" defer></script>
     {{ if .Data.HelpCenter.CustomJS }}<script>{{ .Data.HelpCenter.CustomJS }}</script>{{ end }}
+    {{ template "hc-livechat-widget" . }}
 </body>
 </html>
 {{ end }}
diff --git a/static/public/web-templates/help/shared/partials.html b/static/public/web-templates/help/shared/partials.html
index 7c1fbea4..7f48b747 100644
--- a/static/public/web-templates/help/shared/partials.html
+++ b/static/public/web-templates/help/shared/partials.html
@@ -138,6 +138,19 @@
         keepEmbedded();
         new MutationObserver(keepEmbedded).observe(document.body, { childList: true, subtree: true });
 
+        // The parent sizes this iframe to the document height, so the widget panel owns scrolling.
+        document.addEventListener('click', function (event) {
+            var link = event.target.closest('a[href^="#"]');
+            if (!link) return;
+            var id = decodeURIComponent(link.getAttribute('href').slice(1));
+            var target = id && document.getElementById(id);
+            if (!target) return;
+            event.preventDefault();
+            var top = target.getBoundingClientRect().top + window.scrollY;
+            parent.postMessage({ source: 'libredesk-hc-embed', type: 'scroll', top: Math.max(top - 12, 0) }, '*');
+            if (history.replaceState) history.replaceState(null, '', '#' + id);
+        });
+
         var last = 0;
         var report = function () {
             var height = Math.ceil(document.body.getBoundingClientRect().height);
diff --git a/static/widget.js b/static/widget.js
index 243b6256..b0e6a1b0 100644
--- a/static/widget.js
+++ b/static/widget.js
@@ -21,7 +21,8 @@
             }
 
             this.IFRAME_BORDER_RADIUS = '20px';
-            this.IFRAME_BOX_SHADOW = '0 1px 6px rgba(9, 14, 21, 0.5), 0 4px 32px rgba(9, 14, 21, 0.65)';
+            this.IFRAME_BOX_SHADOW = 'rgba(9, 14, 21, 0.9) 0px 5px 40px 0px';
+            this.LAUNCHER_DROP_SHADOW = 'drop-shadow(rgba(9, 14, 21, 0.54) 0px 1px 6px) drop-shadow(rgba(9, 14, 21, 0.9) 0px 2px 32px)';
             this.IFRAME_WIDTH = '400px';
             this.IFRAME_HEIGHT = '700px';
             this.EXPANDED_WIDTH = '750px';
@@ -49,6 +50,7 @@
             this.campaignActiveSeconds = 0;
             this.campaignURL = location.href;
             this.campaignEvent = "";
+            this.campaignDelay = 0;
             this.campaignBrowserKey = this.getCookie(this.getCookieName('campaign')) || this.randomKey();
             this.setCookie(this.getCookieName('campaign'), this.campaignBrowserKey);
             this.campaignSessionKey = this.getCookie(this.getCookieName('campaign-session')) || this.randomKey();
@@ -229,7 +231,7 @@
                 display: flex;
                 justify-content: center;
                 align-items: center;
-                box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08), 0 10px 28px rgba(0, 0, 0, 0.14);
+                filter: ${this.LAUNCHER_DROP_SHADOW};
                 transition: transform 0.3s cubic-bezier(0.34, 1.56, 0.64, 1);
             `;
 
@@ -449,7 +451,10 @@
                     break;
                 case 'WIDGET_LOADED':
                     this.handleWidgetLoaded();
-                    if (event.data.campaigns) this.startCampaignTracking();
+                    if (event.data.campaigns) {
+                        this.campaignDelay = Math.min(Math.max(Number(event.data.campaignDelay) || 0, 0), 86400);
+                        this.startCampaignTracking();
+                    }
                     break;
                 case 'EXPAND_WIDGET':
                     this.expandWidget();
@@ -802,7 +807,9 @@
             if (this.campaignInterval) return;
             let last = performance.now();
             let elapsed = 0;
-            let gap = this.CAMPAIGN_POLL_MIN;
+            let asked = false;
+            const firstGap = () => Math.max(this.CAMPAIGN_POLL_MIN, this.campaignDelay);
+            let gap = firstGap();
             this.campaignInterval = setInterval(() => {
                 const now = performance.now();
                 const delta = Math.min((now - last) / 1000, 2);
@@ -812,14 +819,16 @@
                     this.campaignActiveSeconds = 0;
                     this.campaignEvent = '';
                     elapsed = 0;
-                    gap = this.CAMPAIGN_POLL_MIN;
+                    asked = false;
+                    gap = firstGap();
                 }
                 if (document.hidden || this.isChatVisible || this.hideLauncher) return;
                 this.campaignActiveSeconds += delta;
                 elapsed += delta;
                 if (elapsed < gap || this.unreadCount > 0 || this.campaignData) return;
                 elapsed = 0;
-                gap = Math.min(gap * 2, this.CAMPAIGN_POLL_MAX);
+                gap = asked ? Math.min(gap * 2, this.CAMPAIGN_POLL_MAX) : this.CAMPAIGN_POLL_MIN;
+                asked = true;
                 this.postToIframe({ type: 'CAMPAIGN_CONTEXT', context: { url: location.href, mobile: this.isMobile, active_seconds: Math.floor(this.campaignActiveSeconds), event: this.campaignEvent } });
             }, 1000);
         }

From c0d7388f19290b8b09322be2bf8d4ec3dbe5db45 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sun, 20 Sep 2026 19:00:40 +0530
Subject: [PATCH 118/178] keep zero campaign delay and scroll to an unread
 first message

---
 cmd/widget_campaign.go                               | 6 +++---
 frontend/apps/widget/src/components/ChatMessages.vue | 2 +-
 2 files changed, 4 insertions(+), 4 deletions(-)

diff --git a/cmd/widget_campaign.go b/cmd/widget_campaign.go
index 3f4a1915..2bfe1cf0 100644
--- a/cmd/widget_campaign.go
+++ b/cmd/widget_campaign.go
@@ -214,13 +214,13 @@ func campaignSender(app *App, id int) (umodels.User, error) {
 }
 
 func earliestCampaignDelay(campaigns []proactive.Campaign) int {
-	delay := 0
+	delay, found := 0, false
 	for _, campaign := range campaigns {
 		if !campaign.Enabled {
 			continue
 		}
-		if delay == 0 || campaign.DelaySeconds < delay {
-			delay = campaign.DelaySeconds
+		if !found || campaign.DelaySeconds < delay {
+			delay, found = campaign.DelaySeconds, true
 		}
 	}
 	return delay
diff --git a/frontend/apps/widget/src/components/ChatMessages.vue b/frontend/apps/widget/src/components/ChatMessages.vue
index abd69c1e..d3fe3e58 100644
--- a/frontend/apps/widget/src/components/ChatMessages.vue
+++ b/frontend/apps/widget/src/components/ChatMessages.vue
@@ -337,7 +337,7 @@ watch(
           container.getBoundingClientRect().top +
           container.scrollTop
         : 0
-      if (target && offset > 0 && container.scrollHeight - container.clientHeight - offset > 1) {
+      if (target && offset >= 0 && container.scrollHeight - container.clientHeight - offset > 1) {
         hasUserScrolled.value = true
         scrollToOffset(offset)
       } else scrollToBottom()

From 0e18223725f66779dacb9fa60a7cf0cd336fa418 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sun, 20 Sep 2026 19:51:30 +0530
Subject: [PATCH 119/178] send csat in livechat and fix widget dark mode menus

---
 frontend/apps/widget/src/App.vue              |  7 +++
 .../widget/src/components/ArticleReader.vue   | 34 ++++++++---
 frontend/apps/widget/src/views/HelpView.vue   |  2 +-
 .../cypress/e2e/ui/livechatInboxForm.cy.js    |  6 +-
 internal/conversation/conversation.go         | 60 +++++++++++--------
 5 files changed, 72 insertions(+), 37 deletions(-)

diff --git a/frontend/apps/widget/src/App.vue b/frontend/apps/widget/src/App.vue
index 711fe992..dd555533 100644
--- a/frontend/apps/widget/src/App.vue
+++ b/frontend/apps/widget/src/App.vue
@@ -57,6 +57,13 @@ const customColorStyle = computed(() => {
   return style
 })
 
+// Dropdowns and dialogs portal to document.body, outside the app wrapper.
+watch(
+  () => widgetStore.config.dark_mode,
+  (dark) => document.documentElement.classList.toggle('dark', !!dark),
+  { immediate: true }
+)
+
 onMounted(() => {
   setupParentMessageListeners()
   window.parent.postMessage({ type: 'VUE_APP_READY' }, '*')
diff --git a/frontend/apps/widget/src/components/ArticleReader.vue b/frontend/apps/widget/src/components/ArticleReader.vue
index b5eadc9a..8addc59b 100644
--- a/frontend/apps/widget/src/components/ArticleReader.vue
+++ b/frontend/apps/widget/src/components/ArticleReader.vue
@@ -1,5 +1,6 @@
 <script setup>
-import { computed, onMounted, onUnmounted, ref } from 'vue'
+import { computed, onMounted, onUnmounted, ref, watch } from 'vue'
+import { Spinner } from '@shared-ui/components/ui/spinner'
 
 const props = defineProps({
   article: { type: Object, required: true },
@@ -7,6 +8,7 @@ const props = defineProps({
 })
 
 const height = ref('100%')
+const ready = ref(false)
 
 const src = computed(
   () =>
@@ -23,9 +25,14 @@ const frameOrigin = computed(() => {
 
 const frame = ref(null)
 
+watch(src, () => {
+  ready.value = false
+})
+
 const onMessage = (event) => {
   if (event.origin !== frameOrigin.value || event.data?.source !== 'libredesk-hc-embed') return
   if (event.data.type === 'loaded') {
+    ready.value = true
     height.value = '100%'
     frame.value?.parentElement?.scrollTo({ top: 0 })
   } else if (event.data.type === 'height' && Number.isFinite(event.data.height)) {
@@ -41,12 +48,21 @@ onUnmounted(() => window.removeEventListener('message', onMessage))
 </script>
 
 <template>
-  <iframe
-    ref="frame"
-    :key="src"
-    :src="src"
-    :title="article.title"
-    class="block w-full border-0"
-    :style="{ height }"
-  />
+  <div class="relative min-h-full">
+    <div
+      v-if="!ready"
+      class="absolute inset-0 flex items-center justify-center bg-background"
+      role="status"
+    >
+      <Spinner size="md" :absolute="false" :center="false" />
+    </div>
+    <iframe
+      ref="frame"
+      :key="src"
+      :src="src"
+      :title="article.title"
+      class="block w-full border-0"
+      :style="{ height }"
+    />
+  </div>
 </template>
diff --git a/frontend/apps/widget/src/views/HelpView.vue b/frontend/apps/widget/src/views/HelpView.vue
index c54495dd..a380ed17 100644
--- a/frontend/apps/widget/src/views/HelpView.vue
+++ b/frontend/apps/widget/src/views/HelpView.vue
@@ -180,7 +180,7 @@ onMounted(async () => {
         class="absolute inset-0 bg-background/80 backdrop-blur-sm z-10"
         role="status"
       >
-        <Spinner size="md" :text="t('globals.terms.loading')" absolute />
+        <Spinner size="md" absolute />
       </div>
       <div v-if="error || help.failed" role="alert" class="p-4 text-sm">
         <p>{{ error || t('widget.helpLoadError') }}</p>
diff --git a/frontend/cypress/e2e/ui/livechatInboxForm.cy.js b/frontend/cypress/e2e/ui/livechatInboxForm.cy.js
index 9c461ab9..2a55e7a3 100644
--- a/frontend/cypress/e2e/ui/livechatInboxForm.cy.js
+++ b/frontend/cypress/e2e/ui/livechatInboxForm.cy.js
@@ -122,7 +122,7 @@ describe('Live chat inbox form', () => {
     openNewForm()
     cy.get('button[type="submit"]').click()
 
-    cy.contains(/required/i).should('be.visible')
+    cy.contains(/required/i).scrollIntoView().should('be.visible')
     cy.get('@createInbox.all').should('have.length', 0)
     cy.location('pathname').should('eq', newPath)
   })
@@ -138,9 +138,9 @@ describe('Live chat inbox form', () => {
     openTab('Security')
     cy.get('button[type="submit"]').click()
 
-    cy.contains('Invalid URL').should('be.visible')
+    cy.contains('Invalid URL').scrollIntoView().should('be.visible')
     // The offending field is on another tab, so the form has to switch back to it.
-    cy.get('input[name="config.website_url"]').should('be.visible')
+    cy.get('input[name="config.website_url"]').scrollIntoView().should('be.visible')
     cy.get('[role="tab"][data-state="active"]').should('not.contain', 'Security')
     cy.get('@createInbox.all').should('have.length', 0)
   })
diff --git a/internal/conversation/conversation.go b/internal/conversation/conversation.go
index cd11a73f..1026fb4e 100644
--- a/internal/conversation/conversation.go
+++ b/internal/conversation/conversation.go
@@ -1838,9 +1838,15 @@ func (m *Manager) RemoveConversationAssignee(uuid, typ string, actor umodels.Use
 	return nil
 }
 
-// SendCSATReply sends a CSAT reply message to a conversation. No-op if one was already sent or contact has no email.
+// SendCSATReply sends a CSAT reply message to a conversation. No-op if one was already sent.
 func (m *Manager) SendCSATReply(actorUserID int, conversation models.Conversation) error {
-	if conversation.Contact.Email.String == "" {
+	inb, err := m.inboxStore.GetDBRecord(conversation.InboxID)
+	if err != nil {
+		m.lo.Error("error fetching inbox for CSAT", "conversation_uuid", conversation.UUID, "error", err)
+		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	isEmail := inb.Channel == inbox.ChannelEmail
+	if isEmail && conversation.Contact.Email.String == "" {
 		m.lo.Info("CSAT reply skipped: contact has no email for conversation: %s", "conversation_uuid", conversation.UUID)
 		return nil
 	}
@@ -1851,25 +1857,6 @@ func (m *Manager) SendCSATReply(actorUserID int, conversation models.Conversatio
 		}
 		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
-	appRootURL, err := m.settingsStore.GetAppRootURL()
-	if err != nil {
-		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
-	}
-	csatPublicURL := m.csatStore.MakePublicURL(appRootURL, csatResp.UUID)
-
-	// Render CSAT email template.
-	data, err := m.BuildTemplateData(conversation.UUID, actorUserID)
-	if err != nil {
-		m.lo.Error("error building CSAT template data", "conversation_uuid", conversation.UUID, "error", err)
-		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
-	}
-	data["CSATLink"] = csatPublicURL
-	data["CSATUUID"] = csatResp.UUID
-	message, err := m.template.RenderStoredTemplate(template.TmplCSATRequest, data)
-	if err != nil {
-		m.lo.Error("error rendering CSAT template", "conversation_uuid", conversation.UUID, "error", err)
-		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
-	}
 
 	meta := map[string]any{
 		"is_csat":      true,
@@ -1877,9 +1864,34 @@ func (m *Manager) SendCSATReply(actorUserID int, conversation models.Conversatio
 		"csat_uuid":    csatResp.UUID,
 	}
 
-	// Only send CSAT to contact.
-	_, err = m.QueueReply(nil /**media**/, conversation.InboxID, actorUserID, conversation.ContactID, conversation.UUID, message, []string{conversation.Contact.Email.String}, nil, nil, meta)
-	if err != nil {
+	var (
+		message string
+		to      []string
+	)
+	if isEmail {
+		appRootURL, err := m.settingsStore.GetAppRootURL()
+		if err != nil {
+			return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+		}
+		data, err := m.BuildTemplateData(conversation.UUID, actorUserID)
+		if err != nil {
+			m.lo.Error("error building CSAT template data", "conversation_uuid", conversation.UUID, "error", err)
+			return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+		}
+		data["CSATLink"] = m.csatStore.MakePublicURL(appRootURL, csatResp.UUID)
+		data["CSATUUID"] = csatResp.UUID
+		message, err = m.template.RenderStoredTemplate(template.TmplCSATRequest, data)
+		if err != nil {
+			m.lo.Error("error rendering CSAT template", "conversation_uuid", conversation.UUID, "error", err)
+			return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+		}
+		to = []string{conversation.Contact.Email.String}
+	} else {
+		// The widget renders the rating form from the meta, the text is what the agent view shows.
+		message = m.i18n.T("globals.messages.pleaseRateConversation")
+	}
+
+	if _, err := m.QueueReply(nil /**media**/, conversation.InboxID, actorUserID, conversation.ContactID, conversation.UUID, message, to, nil, nil, meta); err != nil {
 		m.lo.Error("error sending CSAT reply", "conversation_uuid", conversation.UUID, "error", err)
 		return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}

From f9564faeaf93186733b0fe3aa3fa7215d674d227 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sun, 20 Sep 2026 19:58:10 +0530
Subject: [PATCH 120/178] move typing bubble style into TypingIndicator

---
 frontend/apps/widget/src/components/ChatMessages.vue  |  4 +---
 .../components/TypingIndicator/TypingIndicator.vue    | 11 ++++++++++-
 2 files changed, 11 insertions(+), 4 deletions(-)

diff --git a/frontend/apps/widget/src/components/ChatMessages.vue b/frontend/apps/widget/src/components/ChatMessages.vue
index d3fe3e58..99affdf9 100644
--- a/frontend/apps/widget/src/components/ChatMessages.vue
+++ b/frontend/apps/widget/src/components/ChatMessages.vue
@@ -151,9 +151,7 @@
 
         <!-- Typing Indicator -->
         <div v-if="isTyping" class="flex flex-col items-start">
-          <div class="max-w-[85%] px-4 py-3 rounded-2xl text-sm leading-5 bg-muted text-foreground">
-            <TypingIndicator />
-          </div>
+          <TypingIndicator bubble />
         </div>
       </div>
     </div>
diff --git a/frontend/shared-ui/components/TypingIndicator/TypingIndicator.vue b/frontend/shared-ui/components/TypingIndicator/TypingIndicator.vue
index 9b49915b..de273d53 100644
--- a/frontend/shared-ui/components/TypingIndicator/TypingIndicator.vue
+++ b/frontend/shared-ui/components/TypingIndicator/TypingIndicator.vue
@@ -1,5 +1,8 @@
 <template>
-  <div class="flex items-center space-x-2 px-3 py-2 text-sm text-muted-foreground">
+  <div
+    class="inline-flex w-fit items-center px-3 py-2 text-sm text-muted-foreground"
+    :class="bubble ? 'rounded-2xl bg-muted' : ''"
+  >
     <div class="flex space-x-1">
       <div class="w-2 h-2 bg-current rounded-full animate-bounce" style="animation-delay: 0ms"></div>
       <div class="w-2 h-2 bg-current rounded-full animate-bounce" style="animation-delay: 150ms"></div>
@@ -7,3 +10,9 @@
     </div>
   </div>
 </template>
+
+<script setup>
+defineProps({
+  bubble: { type: Boolean, default: false }
+})
+</script>

From 2d4a039d61437cc03dab8fcabd6491c6dcf7f052 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sun, 20 Sep 2026 19:59:42 +0530
Subject: [PATCH 121/178] reduce shadow intensity on reply buttons

---
 frontend/apps/widget/src/components/ReplyButtons.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/apps/widget/src/components/ReplyButtons.vue b/frontend/apps/widget/src/components/ReplyButtons.vue
index e727a50c..d20e9093 100644
--- a/frontend/apps/widget/src/components/ReplyButtons.vue
+++ b/frontend/apps/widget/src/components/ReplyButtons.vue
@@ -6,7 +6,7 @@
       type="button"
       variant="outline"
       size="sm"
-      class="h-auto max-w-full rounded-full py-1.5 text-left whitespace-normal shadow-md"
+      class="h-auto max-w-full rounded-full py-1.5 text-left whitespace-normal shadow-sm"
       :disabled="disabled"
       @click="emit('select', reply)"
     >

From bd3e73612ce53316a3e7dcac1eee84668268f283 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sun, 20 Sep 2026 21:35:10 +0530
Subject: [PATCH 122/178] add dark mode to the help center

A moon button next to the language picker switches the site between light
and dark. Visitors start in light and the choice is saved in their browser.
Admins get a dark logo field, a checkbox to hide the button, and a light
or dark switch on the customize preview. Colors an admin picks for the
header and footer only apply in light mode.
---
 cmd/helpcenter.go                             |  3 ++
 frontend/apps/main/src/api/index.js           |  4 +-
 .../admin/help-center/HelpCenterForm.vue      | 28 ++++++++++++++
 .../admin/help-center/helpCenterFormSchema.js |  2 +
 .../admin/help-center/HelpCenterCustomize.vue | 23 +++++++++--
 .../widget/src/components/ArticleReader.vue   | 28 ++++++++++----
 i18n/en-US.json                               |  6 +++
 internal/helpcenter/models/models.go          | 28 +++++++-------
 static/public/static/article-content.css      | 38 +++++++++++++++++++
 .../web-templates/help/classic/layout.html    |  6 ++-
 .../web-templates/help/docs/layout.html       |  6 ++-
 .../web-templates/help/shared/head.html       | 14 ++++++-
 .../web-templates/help/shared/partials.html   | 21 ++++++++++
 13 files changed, 176 insertions(+), 31 deletions(-)

diff --git a/cmd/helpcenter.go b/cmd/helpcenter.go
index 2675767a..c7261330 100644
--- a/cmd/helpcenter.go
+++ b/cmd/helpcenter.go
@@ -1722,6 +1722,8 @@ func helpCenterTemplateData(app *App, r *fastglue.Request, hc hcmodels.HelpCente
 		"PageTitle":         hc.PageTitle,
 		"HeaderText":        theme.Header.Heading,
 		"LogoURL":           publicAssetPaths(app, theme.LogoURL),
+		"LogoURLDark":       publicAssetPaths(app, theme.LogoURLDark),
+		"HideThemeToggle":   theme.HideThemeToggle,
 		"Color":             theme.Color,
 		"DefaultLocale":     hc.DefaultLocale,
 		"CurrentLocale":     locale,
@@ -1740,6 +1742,7 @@ func helpCenterTemplateData(app *App, r *fastglue.Request, hc hcmodels.HelpCente
 		"WidgetInboxUUID":   livechatWidgetInboxUUID(app, hc),
 		"WidgetRootURL":     helpCenterRootURL(app),
 		"Embed":             isEmbedRequest(r),
+		"Dark":              string(r.RequestCtx.QueryArgs().Peek("theme")) == "dark",
 	}
 }
 
diff --git a/frontend/apps/main/src/api/index.js b/frontend/apps/main/src/api/index.js
index eb32e2eb..1e31e8a7 100644
--- a/frontend/apps/main/src/api/index.js
+++ b/frontend/apps/main/src/api/index.js
@@ -532,10 +532,10 @@ const createHelpCenter = (data) => http.post('/api/v1/help-centers', data)
 const updateHelpCenter = (id, data) => http.put(`/api/v1/help-centers/${id}`, data)
 const deleteHelpCenter = (id) => http.delete(`/api/v1/help-centers/${id}`)
 const toggleHelpCenter = (id) => http.put(`/api/v1/help-centers/${id}/toggle`)
-const previewHelpCenter = (id, data, page) =>
+const previewHelpCenter = (id, data, page, theme) =>
   http.post(`/api/v1/help-centers/${id}/preview`, data, {
     responseType: 'text',
-    params: page ? { page } : {}
+    params: { ...(page ? { page } : {}), ...(theme ? { theme } : {}) }
   })
 const getHelpCenterTree = (id, locale) =>
   http.get(`/api/v1/help-centers/${id}/tree`, { params: locale ? { locale } : {} })
diff --git a/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue b/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue
index 86def789..ee882e75 100644
--- a/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue
+++ b/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue
@@ -186,6 +186,30 @@
               </FormItem>
             </FormField>
 
+            <FormField v-slot="{ componentField }" name="theme.logo_url_dark">
+              <FormItem>
+                <FormLabel>{{ t('helpCenter.styling.darkLogoUrl') }}</FormLabel>
+                <FormControl>
+                  <Input type="text" v-bind="componentField" />
+                </FormControl>
+                <FormMessage />
+              </FormItem>
+            </FormField>
+
+            <FormField v-slot="{ value, handleChange }" name="theme.hide_theme_toggle">
+              <FormItem class="space-y-1">
+                <div class="flex items-center gap-2">
+                  <FormControl>
+                    <Checkbox :checked="!value" @update:checked="(v) => handleChange(!v)" />
+                  </FormControl>
+                  <FormLabel class="font-normal cursor-pointer">{{
+                    t('helpCenter.styling.showThemeToggle')
+                  }}</FormLabel>
+                </div>
+                <FormDescription>{{ t('helpCenter.styling.themeToggleHint') }}</FormDescription>
+              </FormItem>
+            </FormField>
+
             <FormField v-slot="{ componentField }" name="theme.color">
               <FormItem>
                 <FormLabel>{{ t('globals.terms.primaryColor') }}</FormLabel>
@@ -695,6 +719,8 @@ const FIELD_LOCATION = [
   ['theme.tagline', 'appearance', 'header'],
   ['theme.announcement', 'appearance', 'announcement'],
   ['theme.logo_url', 'appearance', 'brand'],
+  ['theme.logo_url_dark', 'appearance', 'brand'],
+  ['theme.hide_theme_toggle', 'appearance', 'brand'],
   ['theme.color', 'appearance', 'brand'],
   ['theme.favicon', 'appearance', 'brand'],
   ['theme.nav_links', 'general', ''],
@@ -757,6 +783,8 @@ const toFormValues = (hc) => ({
   theme: {
     color: hc?.theme?.color || '#1f93ff',
     logo_url: hc?.theme?.logo_url || '',
+    logo_url_dark: hc?.theme?.logo_url_dark || '',
+    hide_theme_toggle: !!hc?.theme?.hide_theme_toggle,
     nav_links: Array.isArray(hc?.theme?.nav_links) ? hc.theme.nav_links : [],
     favicon: hc?.theme?.favicon || '',
     tagline: hc?.theme?.tagline || '',
diff --git a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js
index ccea373a..6c1d70fd 100644
--- a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js
+++ b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js
@@ -117,6 +117,8 @@ const createBaseSchema = (t) => {
       .object({
         color: z.string().optional(),
         logo_url: optionalURL,
+        logo_url_dark: optionalURL,
+        hide_theme_toggle: z.boolean().optional(),
         nav_links: linkArray,
         favicon: optionalURL,
         tagline: z.string().optional(),
diff --git a/frontend/apps/main/src/views/admin/help-center/HelpCenterCustomize.vue b/frontend/apps/main/src/views/admin/help-center/HelpCenterCustomize.vue
index fa92a6cb..33523a9f 100644
--- a/frontend/apps/main/src/views/admin/help-center/HelpCenterCustomize.vue
+++ b/frontend/apps/main/src/views/admin/help-center/HelpCenterCustomize.vue
@@ -30,8 +30,17 @@
                 <SelectItem value="article">{{ t('helpCenter.styling.articlePage') }}</SelectItem>
               </SelectContent>
             </Select>
+            <Select v-model="previewTheme">
+              <SelectTrigger class="w-28 ml-auto">
+                <SelectValue />
+              </SelectTrigger>
+              <SelectContent>
+                <SelectItem value="light">{{ t('globals.terms.light') }}</SelectItem>
+                <SelectItem value="dark">{{ t('globals.terms.dark') }}</SelectItem>
+              </SelectContent>
+            </Select>
             <Select v-model="previewDevice">
-              <SelectTrigger class="w-32 ml-auto">
+              <SelectTrigger class="w-32">
                 <SelectValue />
               </SelectTrigger>
               <SelectContent>
@@ -133,6 +142,7 @@ const origin = computed(() =>
 )
 const previewPage = ref('landing')
 const previewDevice = ref('desktop')
+const previewTheme = ref('light')
 const previewBox = ref(null)
 const previewTitle = computed(() => {
   const values = lastFormValues.value || helpCenter.value || {}
@@ -194,7 +204,7 @@ let previewRequest = 0
 const renderPreview = async (values) => {
   const request = ++previewRequest
   try {
-    const { data } = await api.previewHelpCenter(props.id, values, previewPage.value)
+    const { data } = await api.previewHelpCenter(props.id, values, previewPage.value, previewTheme.value)
     if (request === previewRequest && previewFrame.value) previewFrame.value.srcdoc = data
   } catch {
     // A half-filled form can fail validation while typing; the last good preview stays up.
@@ -207,10 +217,17 @@ const onFormChange = (values) => {
   previewTimer = setTimeout(() => renderPreview(values), 300)
 }
 
-watch(previewPage, () => {
+watch([previewPage, previewTheme], () => {
   if (lastFormValues.value) renderPreview(lastFormValues.value)
 })
 
+watch(
+  () => lastFormValues.value?.theme?.hide_theme_toggle,
+  (hidden) => {
+    if (hidden) previewTheme.value = 'light'
+  }
+)
+
 const handleSave = async (formData) => {
   isSubmitting.value = true
   try {
diff --git a/frontend/apps/widget/src/components/ArticleReader.vue b/frontend/apps/widget/src/components/ArticleReader.vue
index 8addc59b..e410e2b0 100644
--- a/frontend/apps/widget/src/components/ArticleReader.vue
+++ b/frontend/apps/widget/src/components/ArticleReader.vue
@@ -1,6 +1,7 @@
 <script setup>
 import { computed, onMounted, onUnmounted, ref, watch } from 'vue'
 import { Spinner } from '@shared-ui/components/ui/spinner'
+import { useWidgetStore } from '@widget/store/widget.js'
 
 const props = defineProps({
   article: { type: Object, required: true },
@@ -10,10 +11,12 @@ const props = defineProps({
 const height = ref('100%')
 const ready = ref(false)
 
-const src = computed(
-  () =>
-    `${props.baseUrl}/${encodeURIComponent(props.article.locale)}/articles/${encodeURIComponent(props.article.slug)}?embed=1`
-)
+const widgetStore = useWidgetStore()
+
+const src = computed(() => {
+  const path = `${props.baseUrl}/${encodeURIComponent(props.article.locale)}/articles/${encodeURIComponent(props.article.slug)}?embed=1`
+  return widgetStore.config.dark_mode ? `${path}&theme=dark` : path
+})
 
 const frameOrigin = computed(() => {
   try {
@@ -29,17 +32,28 @@ watch(src, () => {
   ready.value = false
 })
 
+const scroller = () => {
+  let element = frame.value?.parentElement
+  while (element && element.scrollHeight <= element.clientHeight) element = element.parentElement
+  return element
+}
+
 const onMessage = (event) => {
   if (event.origin !== frameOrigin.value || event.data?.source !== 'libredesk-hc-embed') return
   if (event.data.type === 'loaded') {
     ready.value = true
     height.value = '100%'
-    frame.value?.parentElement?.scrollTo({ top: 0 })
+    scroller()?.scrollTo({ top: 0 })
   } else if (event.data.type === 'height' && Number.isFinite(event.data.height)) {
     height.value = `${event.data.height}px`
   } else if (event.data.type === 'scroll' && Number.isFinite(event.data.top)) {
-    const scroller = frame.value?.parentElement
-    if (scroller) scroller.scrollTo({ top: frame.value.offsetTop + event.data.top, behavior: 'smooth' })
+    const element = scroller()
+    if (!element) return
+    const offset =
+      frame.value.getBoundingClientRect().top -
+      element.getBoundingClientRect().top +
+      element.scrollTop
+    element.scrollTo({ top: offset + event.data.top, behavior: 'smooth' })
   }
 }
 
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 3c99e1f4..ef526f41 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -1048,6 +1048,8 @@
   "globals.terms.csatFeedback": "CSAT feedback",
   "globals.terms.csatRating": "CSAT rating",
   "globals.terms.custom": "Custom",
+  "globals.terms.light": "Light",
+  "globals.terms.dark": "Dark",
   "globals.terms.customAttribute": "Custom attribute | Custom attributes",
   "globals.terms.date": "Date",
   "globals.terms.day": "Day | Days",
@@ -1250,6 +1252,7 @@
   "helpCenter.addTranslation": "Add translation",
   "helpCenter.translationOf": "Translation of “{title}”",
   "helpCenter.translations": "Translations",
+  "helpCenter.toggleTheme": "Toggle theme",
   "helpCenter.saveBeforeSwitchingTranslation": "Unsaved changes would be lost. Save the article before switching languages.",
   "helpCenter.saveBeforeTranslation": "Unsaved changes would be lost. Save the article before adding a translation.",
   "helpCenter.customCSS": "Custom CSS",
@@ -1263,6 +1266,9 @@
   "helpCenter.preview.sampleArticleBody": "Body text, links and images appear here, styled with the settings you pick on the left.",
   "helpCenter.preview.sampleArticleListItem": "List items and other formatting are styled the same way.",
   "helpCenter.styling.brand": "Brand",
+  "helpCenter.styling.darkLogoUrl": "Logo URL (dark mode)",
+  "helpCenter.styling.showThemeToggle": "Show light and dark mode toggle",
+  "helpCenter.styling.themeToggleHint": "Visitors start in light mode and can switch to dark. Turn this off to keep the help center in light mode.",
   "helpCenter.styling.customCode": "Custom code",
   "helpCenter.customJS": "Custom JS",
   "helpCenter.deleteArticleConfirmation": "This will permanently delete the article.",
diff --git a/internal/helpcenter/models/models.go b/internal/helpcenter/models/models.go
index e0374864..a7ed4da7 100644
--- a/internal/helpcenter/models/models.go
+++ b/internal/helpcenter/models/models.go
@@ -36,19 +36,21 @@ type HelpCenter struct {
 
 // Theme holds the customizable branding for a help center's public pages.
 type Theme struct {
-	Color        string            `json:"color"`
-	LogoURL      string            `json:"logo_url"`
-	NavLinks     []NavLink         `json:"nav_links"`
-	Favicon      string            `json:"favicon"`
-	Tagline      string            `json:"tagline"`
-	Header       HeaderTheme       `json:"header"`
-	Footer       FooterTheme       `json:"footer"`
-	FooterLinks  []NavLink         `json:"footer_links"`
-	SocialLinks  []SocialLink      `json:"social_links"`
-	Article      ArticleTheme      `json:"article"`
-	Layout       LayoutTheme       `json:"layout"`
-	Cards        CardTheme         `json:"cards"`
-	Announcement AnnouncementTheme `json:"announcement"`
+	Color           string            `json:"color"`
+	LogoURL         string            `json:"logo_url"`
+	LogoURLDark     string            `json:"logo_url_dark"`
+	HideThemeToggle bool              `json:"hide_theme_toggle"`
+	NavLinks        []NavLink         `json:"nav_links"`
+	Favicon         string            `json:"favicon"`
+	Tagline         string            `json:"tagline"`
+	Header          HeaderTheme       `json:"header"`
+	Footer          FooterTheme       `json:"footer"`
+	FooterLinks     []NavLink         `json:"footer_links"`
+	SocialLinks     []SocialLink      `json:"social_links"`
+	Article         ArticleTheme      `json:"article"`
+	Layout          LayoutTheme       `json:"layout"`
+	Cards           CardTheme         `json:"cards"`
+	Announcement    AnnouncementTheme `json:"announcement"`
 }
 
 // AnnouncementTheme is the dismissible banner shown above the header on every public page.
diff --git a/static/public/static/article-content.css b/static/public/static/article-content.css
index f2f181ea..7dad090a 100644
--- a/static/public/static/article-content.css
+++ b/static/public/static/article-content.css
@@ -162,3 +162,41 @@ details.hc-details > .hc-details-content > :last-child { margin-bottom: 0; }
 
 /* The widget sizes the frame to this height, so a stretched body would keep it at the tallest page. */
 body.hc-embed { min-height: 0; }
+
+.hc-dark {
+    --hc-accent-ink: color-mix(in srgb, var(--hc-accent), #ffffff 34%);
+    --hc-accent-tint: color-mix(in srgb, var(--hc-accent) 12%, #16181b);
+    --hc-accent-tint-2: color-mix(in srgb, var(--hc-accent) 20%, #16181b);
+    --hc-accent-line: color-mix(in srgb, var(--hc-accent) 30%, #16181b);
+    --hc-ink: #eceeed;
+    --hc-muted: #a3a8ae;
+    --hc-faint: #82878e;
+    --hc-border: #2c2e31;
+    --hc-bg: #1e1f1e;
+    --hc-page: #16181b;
+    --hcd-sidebar-bg: #1a1c1f;
+    --hc-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 1px 3px rgba(0, 0, 0, .5);
+    --hc-shadow-lift: 0 4px 12px rgba(0, 0, 0, .5), 0 10px 30px rgba(0, 0, 0, .55);
+    background: var(--hc-bg);
+    color: var(--hc-ink);
+}
+
+.hc-theme-btn {
+    display: inline-flex; align-items: center; justify-content: center;
+    padding: .4rem; line-height: 0;
+    border: 1px solid var(--hc-border); border-radius: var(--hc-radius-sm);
+    background: var(--hc-bg); color: var(--hc-muted); cursor: pointer;
+    transition: color .15s, border-color .15s;
+}
+.hc-theme-btn:hover { color: var(--hc-ink); border-color: var(--hc-accent-line); }
+.hc-theme-btn svg { width: 1.05rem; height: 1.05rem; }
+.hc-theme-btn .hc-theme-moon { display: none; }
+.hc-dark .hc-theme-btn .hc-theme-sun { display: none; }
+.hc-dark .hc-theme-btn .hc-theme-moon { display: block; }
+
+.hc-brand .hc-logo-dark,
+.hcd-brand .hc-logo-dark { display: none; }
+.hc-dark .hc-brand .hc-logo-light,
+.hc-dark .hcd-brand .hc-logo-light { display: none; }
+.hc-dark .hc-brand .hc-logo-dark,
+.hc-dark .hcd-brand .hc-logo-dark { display: block; }
diff --git a/static/public/web-templates/help/classic/layout.html b/static/public/web-templates/help/classic/layout.html
index 7953a1e5..14391b30 100644
--- a/static/public/web-templates/help/classic/layout.html
+++ b/static/public/web-templates/help/classic/layout.html
@@ -8,7 +8,7 @@
     <header class="hc-top">
         <nav class="hc-nav" aria-label="{{ .L.T "globals.terms.main" }}">
             <a class="hc-brand" href="{{ .Data.HelpCenter.BasePath }}">
-                {{ if .Data.HelpCenter.LogoURL }}<img src="{{ .Data.HelpCenter.LogoURL }}" alt="{{ .Data.HelpCenter.Name }}" />{{ else }}<span class="hc-name">{{ .Data.HelpCenter.Name }}</span>{{ end }}
+                {{ if .Data.HelpCenter.LogoURL }}<img class="hc-logo-light" src="{{ .Data.HelpCenter.LogoURL }}" alt="{{ .Data.HelpCenter.Name }}" />{{ if .Data.HelpCenter.LogoURLDark }}<img class="hc-logo-dark" src="{{ .Data.HelpCenter.LogoURLDark }}" alt="{{ .Data.HelpCenter.Name }}" />{{ end }}{{ else }}<span class="hc-name">{{ .Data.HelpCenter.Name }}</span>{{ end }}
             </a>
             {{ if or .Data.HelpCenter.NavLinks (gt (len .Data.HelpCenter.AvailableLocales) 1) }}
             <button type="button" class="hc-nav-toggle" data-hc-nav-toggle aria-expanded="false" aria-controls="hc-nav-links" aria-label="{{ .L.T "globals.terms.menu" }}">
@@ -17,6 +17,7 @@
             <div class="hc-nav-links" id="hc-nav-links">
                 {{ range .Data.HelpCenter.NavLinks }}<a href="{{ .URL }}">{{ .Label }}</a>{{ end }}
                 {{ if gt (len .Data.HelpCenter.AvailableLocales) 1 }}{{ template "hc-lang-switcher" . }}{{ end }}
+                {{ if not .Data.HelpCenter.HideThemeToggle }}{{ template "hc-theme-toggle" . }}{{ end }}
             </div>
             {{ end }}
         </nav>
@@ -75,7 +76,8 @@
     </script>
     <script src="/static/public/static/help-center-search.js?v={{ AssetVer }}" defer></script>
     {{ if .Data.HelpCenter.CustomJS }}<script>{{ .Data.HelpCenter.CustomJS }}</script>{{ end }}
-    {{ template "hc-livechat-widget" . }}
+    {{ if not .Data.HelpCenter.HideThemeToggle }}{{ template "hc-theme-script" . }}{{ end }}
+{{ template "hc-livechat-widget" . }}
 </body>
 </html>
 {{ end }}
diff --git a/static/public/web-templates/help/docs/layout.html b/static/public/web-templates/help/docs/layout.html
index 1cd742ad..204455ca 100644
--- a/static/public/web-templates/help/docs/layout.html
+++ b/static/public/web-templates/help/docs/layout.html
@@ -12,7 +12,7 @@
                     <svg viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.7" aria-hidden="true"><path d="M3 5.5h14M3 10h14M3 14.5h14" stroke-linecap="round"/></svg>
                 </button>
                 <a class="hcd-brand" href="{{ .Data.HelpCenter.BasePath }}">
-                    {{ if .Data.HelpCenter.LogoURL }}<img src="{{ .Data.HelpCenter.LogoURL }}" alt="{{ .Data.HelpCenter.Name }}" />{{ else }}<span class="hcd-brand-name">{{ .Data.HelpCenter.Name }}</span>{{ end }}
+                    {{ if .Data.HelpCenter.LogoURL }}<img class="hc-logo-light" src="{{ .Data.HelpCenter.LogoURL }}" alt="{{ .Data.HelpCenter.Name }}" />{{ if .Data.HelpCenter.LogoURLDark }}<img class="hc-logo-dark" src="{{ .Data.HelpCenter.LogoURLDark }}" alt="{{ .Data.HelpCenter.Name }}" />{{ end }}{{ else }}<span class="hcd-brand-name">{{ .Data.HelpCenter.Name }}</span>{{ end }}
                 </a>
             </div>
             <a class="hcd-search-btn" href="{{ .Data.HelpCenter.BasePath }}/search" data-hcd-search-open>
@@ -27,6 +27,7 @@
                 </nav>
                 {{ end }}
                 {{ if gt (len .Data.HelpCenter.AvailableLocales) 1 }}{{ template "hc-lang-switcher" . }}{{ end }}
+                {{ if not .Data.HelpCenter.HideThemeToggle }}{{ template "hc-theme-toggle" . }}{{ end }}
             </div>
         </div>
     </header>
@@ -191,7 +192,8 @@
     </script>
     <script src="/static/public/static/help-center-search.js?v={{ AssetVer }}" defer></script>
     {{ if .Data.HelpCenter.CustomJS }}<script>{{ .Data.HelpCenter.CustomJS }}</script>{{ end }}
-    {{ template "hc-livechat-widget" . }}
+    {{ if not .Data.HelpCenter.HideThemeToggle }}{{ template "hc-theme-script" . }}{{ end }}
+{{ template "hc-livechat-widget" . }}
 </body>
 </html>
 {{ end }}
diff --git a/static/public/web-templates/help/shared/head.html b/static/public/web-templates/help/shared/head.html
index 6e61ad99..35bc5a9c 100644
--- a/static/public/web-templates/help/shared/head.html
+++ b/static/public/web-templates/help/shared/head.html
@@ -1,6 +1,6 @@
 {{ define "hc-head" }}
 <!DOCTYPE html>
-<html lang="{{ if .Data.HelpCenter.CurrentLocale }}{{ .Data.HelpCenter.CurrentLocale }}{{ else if .Data.HelpCenter.DefaultLocale }}{{ .Data.HelpCenter.DefaultLocale }}{{ else }}en{{ end }}" dir="{{ .Data.HelpCenter.Dir }}">
+<html lang="{{ if .Data.HelpCenter.CurrentLocale }}{{ .Data.HelpCenter.CurrentLocale }}{{ else if .Data.HelpCenter.DefaultLocale }}{{ .Data.HelpCenter.DefaultLocale }}{{ else }}en{{ end }}" dir="{{ .Data.HelpCenter.Dir }}"{{ if .Data.HelpCenter.Dark }} class="hc-dark"{{ end }}>
 <head>
     <meta charset="utf-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1" />
@@ -30,8 +30,18 @@
     <link rel="stylesheet" href="/static/public/static/help-center-cards.css?v={{ AssetVer }}" />
     <link rel="stylesheet" href="/static/public/static/help-center-{{ .Data.HelpCenter.Template }}.css?v={{ AssetVer }}" />
     <link rel="stylesheet" href="/static/public/static/article-content.css?v={{ AssetVer }}" />
-    <style>:root { --hc-accent: {{ .Data.HelpCenter.Color }}; {{ .Data.HelpCenter.ThemeCSS }} }</style>
+    <style>:root { --hc-accent: {{ .Data.HelpCenter.Color }}; }
+    :root:not(.hc-dark) { {{ .Data.HelpCenter.ThemeCSS }} }</style>
     {{ if .Data.HelpCenter.CustomCSS }}<style>{{ .Data.HelpCenter.CustomCSS }}</style>{{ end }}
     {{ if .Data.JSONLD }}<script type="application/ld+json">{{ .Data.JSONLD }}</script>{{ end }}
+    {{ if not .Data.HelpCenter.HideThemeToggle }}<script>
+    (function () {
+        try {
+            if (localStorage.getItem('libredesk-hc-theme') === 'dark') {
+                document.documentElement.classList.add('hc-dark');
+            }
+        } catch (e) {}
+    })();
+    </script>{{ end }}
 </head>
 {{ end }}
diff --git a/static/public/web-templates/help/shared/partials.html b/static/public/web-templates/help/shared/partials.html
index 7f48b747..811323cb 100644
--- a/static/public/web-templates/help/shared/partials.html
+++ b/static/public/web-templates/help/shared/partials.html
@@ -26,6 +26,13 @@
                 </div>
 {{ end }}
 
+{{ define "hc-theme-toggle" }}
+                <button type="button" class="hc-theme-btn" data-hc-theme aria-label="{{ .L.T "helpCenter.toggleTheme" }}">
+                    <svg class="hc-theme-sun" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.6" aria-hidden="true"><circle cx="10" cy="10" r="4"/><path d="M10 1.5v2M10 16.5v2M18.5 10h-2M3.5 10h-2M16 4l-1.4 1.4M5.4 14.6 4 16M16 16l-1.4-1.4M5.4 5.4 4 4" stroke-linecap="round"/></svg>
+                    <svg class="hc-theme-moon" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.6" aria-hidden="true"><path d="M17 11.3A7.5 7.5 0 0 1 8.7 3a7.5 7.5 0 1 0 8.3 8.3Z" stroke-linejoin="round"/></svg>
+                </button>
+{{ end }}
+
 {{ define "hc-search-icon" }}<svg{{ with . }} class="{{ . }}"{{ end }} viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.8" aria-hidden="true"><circle cx="9" cy="9" r="6" /><path d="m18 18-4.5-4.5" stroke-linecap="round" /></svg>{{ end }}
 
 {{ define "hc-article-toc" }}
@@ -90,6 +97,20 @@
 </span>
 {{ end }}
 
+{{ define "hc-theme-script" }}
+<script>
+(function () {
+    var root = document.documentElement;
+    document.querySelectorAll('[data-hc-theme]').forEach(function (button) {
+        button.addEventListener('click', function () {
+            var dark = root.classList.toggle('hc-dark');
+            try { localStorage.setItem('libredesk-hc-theme', dark ? 'dark' : 'light'); } catch (e) {}
+        });
+    });
+})();
+</script>
+{{ end }}
+
 {{ define "hc-embed-open" }}
 {{ template "hc-head" . }}
 <body class="hc-embed{{ if eq .Data.HelpCenter.Template "docs" }} hcd{{ end }}">

From 835128504e3ee574190ab30020a8561945eb3433 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sun, 20 Sep 2026 22:51:20 +0530
Subject: [PATCH 123/178] fix widget, search and help center bugs

- handoff form no longer overwrites a JWT contact's name, email or phone.
  The CRM resyncs those on every exchange, so the edit reverted anyway.
  Visitors still get their submitted values saved.
- search queries dropped the cs and cp table aliases. Any saved view
  filtering on conversation_statuses.name returned a 500.
- status and priority never showed as selected in the search filters.
  The combobox compares strings, the store gives numbers.
- widget logout left the previous visitor's pre chat draft on screen.
- an auto hidden campaign preview was suppressed forever instead of for
  the session.
- switching campaigns in the admin preview did not close the open panel.
  The watcher only saw null and non null, so it now keys on campaign id.
- the Help tab blanked out when featured_ids came back as null.
- copilot panel spinner stuck when no conversation was open.
- help center theme toggle was hidden when there were no nav links and
  one locale.
- help center dark mode leaked into the article panel inside the widget.
---
 cmd/chat.go                                      |  7 ++++++-
 .../admin/inbox/LivechatWidgetPreview.vue        |  9 ++++++---
 .../src/features/admin/inbox/WidgetCampaigns.vue |  1 +
 .../features/admin/inbox/WidgetHelpConfig.vue    | 14 ++++++++------
 .../conversation/sidebar/CopilotPanel.vue        |  5 ++++-
 .../main/src/features/search/SearchFilters.vue   |  9 +++++++--
 frontend/apps/widget/src/App.vue                 |  2 +-
 internal/search/queries.sql                      | 16 ++++++++--------
 .../web-templates/help/classic/layout.html       |  2 +-
 .../public/web-templates/help/shared/head.html   |  2 +-
 static/widget.js                                 | 12 ++++++++++--
 11 files changed, 53 insertions(+), 26 deletions(-)

diff --git a/cmd/chat.go b/cmd/chat.go
index 46160845..8d982d00 100644
--- a/cmd/chat.go
+++ b/cmd/chat.go
@@ -626,7 +626,12 @@ func handleChatSubmitHandoffForm(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	name, email, phone, countryCode, err := validateFormData(app, req.FormData, config, nil)
+	// An identified contact's details come from the JWT, which resyncs them on every exchange, so the form only fills blanks.
+	var identified *umodels.User
+	if !getWidgetIsVisitor(r) {
+		identified = &contact
+	}
+	name, email, phone, countryCode, err := validateFormData(app, req.FormData, config, identified)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
index f2459ab4..91411d59 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
@@ -680,9 +680,12 @@ const homeItems = computed(() =>
 )
 
 const campaign = computed(() => props.config.preview_campaign || null)
-watch(campaign, (value) => {
-  if (value) open.value = false
-})
+watch(
+  () => campaign.value?.id ?? null,
+  (campaignId) => {
+    if (campaignId !== null) open.value = false
+  }
+)
 const campaignText = computed(() => campaign.value?.message?.slice(0, SNIPPET_LENGTH) || '')
 const quickReplies = computed(() => {
   const replies = userTypeConfig.value.quick_replies ?? props.config.quick_replies
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
index 364b6724..bedcc37a 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
@@ -145,6 +145,7 @@ watch(
       (item) => String(item.value) === String(campaign.value.sender_id)
     )
     emit('update:preview', {
+      id: campaign.value.id,
       sender: senderName(campaign.value.sender_id),
       avatar: agent?.avatar_url || '',
       message: campaign.value.message
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
index 31b40437..5fcaaca3 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
@@ -37,10 +37,12 @@ const selectHelpCenter = (value) =>
     featured_ids: []
   })
 
+const featuredIds = computed(() => props.modelValue.featured_ids || [])
+
 const titleOf = (id) => props.articles.find((article) => article.id === id)?.title
 
 const featured = computed({
-  get: () => props.modelValue.featured_ids.map((id) => ({ id, title: titleOf(id) })),
+  get: () => featuredIds.value.map((id) => ({ id, title: titleOf(id) })),
   set: (items) =>
     update(
       'featured_ids',
@@ -49,7 +51,7 @@ const featured = computed({
 })
 
 const unusedArticles = computed(() =>
-  props.articles.filter((article) => !props.modelValue.featured_ids.includes(article.id))
+  props.articles.filter((article) => !featuredIds.value.includes(article.id))
 )
 </script>
 
@@ -96,7 +98,7 @@ const unusedArticles = computed(() =>
             </p>
             <SwitchField
               :title="t('widget.showHelpTab')"
-              :checked="modelValue[audience].tab"
+              :checked="modelValue[audience]?.tab"
               @update:checked="updateAudience(audience, 'tab', $event)"
             />
           </div>
@@ -136,7 +138,7 @@ const unusedArticles = computed(() =>
                 @click="
                   update(
                     'featured_ids',
-                    modelValue.featured_ids.filter((_, i) => i !== index)
+                    featuredIds.filter((_, i) => i !== index)
                   )
                 "
               >
@@ -147,9 +149,9 @@ const unusedArticles = computed(() =>
         </Draggable>
 
         <Select
-          :disabled="modelValue.featured_ids.length >= MAX_FEATURED || !unusedArticles.length"
+          :disabled="featuredIds.length >= MAX_FEATURED || !unusedArticles.length"
           model-value=""
-          @update:model-value="update('featured_ids', [...modelValue.featured_ids, Number($event)])"
+          @update:model-value="update('featured_ids', [...featuredIds, Number($event)])"
         >
           <SelectTrigger class="max-w-md">
             <SelectValue :placeholder="t('widget.selectArticle')" />
diff --git a/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue b/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
index 107bbdc6..314eb13b 100644
--- a/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
+++ b/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
@@ -299,7 +299,10 @@ const clearChat = async () => {
 // Load the persisted chat from the server when a conversation opens, so a refresh
 // does not lose it. Skip if the store already has messages for it (a live session).
 const hydrate = async (uuid) => {
-  if (!uuid) return
+  if (!uuid) {
+    isHydrating.value = false
+    return
+  }
   if (copilotStore.getMessages(uuid).length > 0) {
     isHydrating.value = false
     return
diff --git a/frontend/apps/main/src/features/search/SearchFilters.vue b/frontend/apps/main/src/features/search/SearchFilters.vue
index 462c013b..f20907e2 100644
--- a/frontend/apps/main/src/features/search/SearchFilters.vue
+++ b/frontend/apps/main/src/features/search/SearchFilters.vue
@@ -4,7 +4,7 @@
       <div :class="FILTER_CLASS">
         <SelectComboBox
           :model-value="filters.status"
-          :items="conversationStore.statusOptions"
+          :items="statusItems"
           :placeholder="t('globals.terms.status')"
           align="start"
           @update:model-value="set('status', $event)"
@@ -13,7 +13,7 @@
       <div :class="FILTER_CLASS">
         <SelectComboBox
           :model-value="filters.priority"
-          :items="conversationStore.priorityOptions"
+          :items="priorityItems"
           :placeholder="t('globals.terms.priority')"
           align="start"
           @update:model-value="set('priority', $event)"
@@ -91,6 +91,9 @@ import { UNASSIGNED } from './searchFilters'
 
 const FILTER_CLASS = 'flex-1 min-w-28'
 
+// The combobox matches the selected value by strict equality against a string.
+const asStringValues = (options) => options.map((option) => ({ ...option, value: String(option.value) }))
+
 const props = defineProps({
   filters: { type: Object, required: true }
 })
@@ -98,6 +101,8 @@ const emit = defineEmits(['update:filters'])
 
 const { t } = useI18n()
 const conversationStore = useConversationStore()
+const statusItems = computed(() => asStringValues(conversationStore.statusOptions))
+const priorityItems = computed(() => asStringValues(conversationStore.priorityOptions))
 const inboxStore = useInboxStore()
 const tagStore = useTagStore()
 
diff --git a/frontend/apps/widget/src/App.vue b/frontend/apps/widget/src/App.vue
index dd555533..6416168f 100644
--- a/frontend/apps/widget/src/App.vue
+++ b/frontend/apps/widget/src/App.vue
@@ -174,7 +174,7 @@ const setupParentMessageListeners = () => {
       chatStore.conversations = null
       chatStore.setCurrentConversation(null)
       help.reset()
-      if (widgetStore.currentView === 'help') widgetStore.navigateToHome()
+      widgetStore.navigateToHome()
       signalWidgetLoaded()
     } else if (event.data.type === 'CAMPAIGN_CONTEXT') {
       await proactive.next(event.data.context)
diff --git a/internal/search/queries.sql b/internal/search/queries.sql
index e055d833..88c9bc5a 100644
--- a/internal/search/queries.sql
+++ b/internal/search/queries.sql
@@ -26,8 +26,8 @@ SELECT
     assignee.last_name AS "assignee.last_name",
     assignee.avatar_url AS "assignee.avatar_url",
     teams.name AS team_name,
-    cs.name AS status,
-    cp.name AS priority,
+    conversation_statuses.name AS status,
+    conversation_priorities.name AS priority,
     inboxes.name AS inbox_name,
     inboxes.channel AS inbox_channel,
     users.first_name AS "contact.first_name",
@@ -43,8 +43,8 @@ JOIN users ON conversations.contact_id = users.id
 LEFT JOIN users assignee ON conversations.assigned_user_id = assignee.id
 LEFT JOIN teams ON conversations.assigned_team_id = teams.id
 LEFT JOIN inboxes ON conversations.inbox_id = inboxes.id
-LEFT JOIN conversation_statuses cs ON conversations.status_id = cs.id
-LEFT JOIN conversation_priorities cp ON conversations.priority_id = cp.id
+LEFT JOIN conversation_statuses ON conversations.status_id = conversation_statuses.id
+LEFT JOIN conversation_priorities ON conversations.priority_id = conversation_priorities.id
 WHERE conversations.id IN (SELECT id FROM matched_conversations)
   AND $3
   AND (
@@ -81,8 +81,8 @@ SELECT
     assignee.last_name AS "assignee.last_name",
     assignee.avatar_url AS "assignee.avatar_url",
     teams.name AS team_name,
-    cs.name AS conversation_status,
-    cp.name AS priority,
+    conversation_statuses.name AS conversation_status,
+    conversation_priorities.name AS priority,
     inboxes.name AS inbox_name,
     inboxes.channel AS inbox_channel,
     users.first_name AS "contact.first_name",
@@ -96,8 +96,8 @@ LEFT JOIN users sender ON conversation_messages.sender_id = sender.id
 LEFT JOIN users assignee ON conversations.assigned_user_id = assignee.id
 LEFT JOIN teams ON conversations.assigned_team_id = teams.id
 LEFT JOIN inboxes ON conversations.inbox_id = inboxes.id
-LEFT JOIN conversation_statuses cs ON conversations.status_id = cs.id
-LEFT JOIN conversation_priorities cp ON conversations.priority_id = cp.id
+LEFT JOIN conversation_statuses ON conversations.status_id = conversation_statuses.id
+LEFT JOIN conversation_priorities ON conversations.priority_id = conversation_priorities.id
 WHERE conversation_messages.type != 'activity'
   AND conversation_messages.text_content ILIKE $10 ESCAPE '\'
   AND $3
diff --git a/static/public/web-templates/help/classic/layout.html b/static/public/web-templates/help/classic/layout.html
index 14391b30..c0e7820b 100644
--- a/static/public/web-templates/help/classic/layout.html
+++ b/static/public/web-templates/help/classic/layout.html
@@ -10,7 +10,7 @@
             <a class="hc-brand" href="{{ .Data.HelpCenter.BasePath }}">
                 {{ if .Data.HelpCenter.LogoURL }}<img class="hc-logo-light" src="{{ .Data.HelpCenter.LogoURL }}" alt="{{ .Data.HelpCenter.Name }}" />{{ if .Data.HelpCenter.LogoURLDark }}<img class="hc-logo-dark" src="{{ .Data.HelpCenter.LogoURLDark }}" alt="{{ .Data.HelpCenter.Name }}" />{{ end }}{{ else }}<span class="hc-name">{{ .Data.HelpCenter.Name }}</span>{{ end }}
             </a>
-            {{ if or .Data.HelpCenter.NavLinks (gt (len .Data.HelpCenter.AvailableLocales) 1) }}
+            {{ if or .Data.HelpCenter.NavLinks (gt (len .Data.HelpCenter.AvailableLocales) 1) (not .Data.HelpCenter.HideThemeToggle) }}
             <button type="button" class="hc-nav-toggle" data-hc-nav-toggle aria-expanded="false" aria-controls="hc-nav-links" aria-label="{{ .L.T "globals.terms.menu" }}">
                 <svg viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.7" aria-hidden="true"><path d="M3 5.5h14M3 10h14M3 14.5h14" stroke-linecap="round"/></svg>
             </button>
diff --git a/static/public/web-templates/help/shared/head.html b/static/public/web-templates/help/shared/head.html
index 35bc5a9c..b98a3b03 100644
--- a/static/public/web-templates/help/shared/head.html
+++ b/static/public/web-templates/help/shared/head.html
@@ -34,7 +34,7 @@
     :root:not(.hc-dark) { {{ .Data.HelpCenter.ThemeCSS }} }</style>
     {{ if .Data.HelpCenter.CustomCSS }}<style>{{ .Data.HelpCenter.CustomCSS }}</style>{{ end }}
     {{ if .Data.JSONLD }}<script type="application/ld+json">{{ .Data.JSONLD }}</script>{{ end }}
-    {{ if not .Data.HelpCenter.HideThemeToggle }}<script>
+    {{ if and (not .Data.HelpCenter.HideThemeToggle) (not .Data.HelpCenter.Embed) }}<script>
     (function () {
         try {
             if (localStorage.getItem('libredesk-hc-theme') === 'dark') {
diff --git a/static/widget.js b/static/widget.js
index b0e6a1b0..c79d8f62 100644
--- a/static/widget.js
+++ b/static/widget.js
@@ -46,6 +46,7 @@
             this.previewData = null;
             this.previewHost = null;
             this.previewTimers = new Map();
+            this.hiddenPreviews = new Set();
             this.campaignData = null;
             this.campaignActiveSeconds = 0;
             this.campaignURL = location.href;
@@ -668,6 +669,7 @@
             this.previewData = null;
             this.campaignData = null;
             this.dismissedPreviews = [];
+            this.hiddenPreviews.clear();
             this.previewHost?.remove();
             this.previewHost = null;
             this.previewSignature = '';
@@ -675,6 +677,12 @@
             this.previewTimers.clear();
         }
 
+        hidePreview (key) {
+            this.previewTimers.delete(key);
+            this.hiddenPreviews.add(key);
+            this.renderPreviews();
+        }
+
         dismissPreview (key) {
             clearTimeout(this.previewTimers.get(key));
             this.previewTimers.delete(key);
@@ -713,7 +721,7 @@
             const storageKey = `libredesk-previews-${this.config.inboxID}-${data.identity || 'visitor'}`;
             let dismissed = this.dismissedPreviews || [];
             try { dismissed = JSON.parse(localStorage.getItem(storageKey) || '[]'); } catch {}
-            const previews = data.previews.filter(item => !dismissed.includes(item.key)).slice(0, 3);
+            const previews = data.previews.filter(item => !dismissed.includes(item.key) && !this.hiddenPreviews.has(item.key)).slice(0, 3);
             const signature = JSON.stringify([previews, data.theme, data.labels, this.isMobile]);
             if (signature === this.previewSignature) return;
             this.previewSignature = signature;
@@ -787,7 +795,7 @@
                 card.append(open, close);
                 stack.append(card);
                 if (data.config.auto_hide_seconds > 0 && !this.previewTimers.has(item.key)) {
-                    this.previewTimers.set(item.key, setTimeout(() => this.dismissPreview(item.key), data.config.auto_hide_seconds * 1000));
+                    this.previewTimers.set(item.key, setTimeout(() => this.hidePreview(item.key), data.config.auto_hide_seconds * 1000));
                 }
             }
             if (previews.length > 1) {

From 04464fb2e0f1f3e67aedea218ec49f7ff9ec2e8f Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Sun, 20 Sep 2026 23:19:57 +0530
Subject: [PATCH 124/178] show message previews only after the widget loads

---
 static/widget.js | 3 ++-
 1 file changed, 2 insertions(+), 1 deletion(-)

diff --git a/static/widget.js b/static/widget.js
index c79d8f62..a96fa770 100644
--- a/static/widget.js
+++ b/static/widget.js
@@ -538,6 +538,7 @@
         handleWidgetLoaded () {
             this.widgetLoaded = true;
             this.updateLauncherVisibility();
+            this.renderPreviews();
         }
 
         toggle () {
@@ -712,7 +713,7 @@
                 }] };
             }
             const enabled = data?.config?.[this.isMobile ? 'mobile' : 'desktop'];
-            if (!data || !enabled || this.isChatVisible || this.hideLauncher) {
+            if (!data || !enabled || !this.widgetLoaded || this.isChatVisible || this.hideLauncher) {
                 this.previewHost?.remove();
                 this.previewHost = null;
                 this.previewSignature = '';

From f73434eea7a0d4f81a061e1f5a6fe3c5e222bce7 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Mon, 21 Sep 2026 01:01:31 +0530
Subject: [PATCH 125/178] let admins link and unlink help center article
 translations

An article written in another language can now be joined to an existing
article as its translation, or pulled back out into its own group. Also caps
transcript downloads at 1000 messages and fixes the field widths in the
automation rule and action rows.
---
 cmd/chat.go                                   |   2 +-
 cmd/conversation.go                           |   4 +-
 cmd/handlers.go                               |   3 +
 cmd/helpcenter.go                             |  63 +++-
 cmd/widget_transcript.go                      |   2 +-
 frontend/apps/main/src/api/index.js           |   9 +
 .../features/admin/automation/ActionBox.vue   |  14 +-
 .../src/features/admin/automation/RuleBox.vue |  14 +-
 .../admin/help-center/ArticleEditSheet.vue    | 269 +++++++++++++++---
 .../features/admin/inbox/WidgetHelpConfig.vue |   2 +-
 .../admin/help-center/HelpCenterTree.vue      |   2 +-
 .../api/helpCenterArticleTranslations.cy.js   | 258 +++++++++++++++++
 .../e2e/ui/helpCenterTranslations.cy.js       | 141 +++++++++
 frontend/cypress/support/commands.js          |   2 +-
 i18n/en-US.json                               |  19 +-
 internal/helpcenter/helpcenter.go             |  76 +++++
 internal/helpcenter/models/models.go          |   7 +
 internal/helpcenter/queries.sql               |  34 +++
 static/public/static/help-center-classic.css  |   4 +-
 static/public/static/help-center-docs.css     |   1 +
 .../web-templates/help/classic/layout.html    |   6 +-
 .../web-templates/help/docs/layout.html       |   6 +-
 22 files changed, 872 insertions(+), 66 deletions(-)
 create mode 100644 frontend/cypress/e2e/api/helpCenterArticleTranslations.cy.js
 create mode 100644 frontend/cypress/e2e/ui/helpCenterTranslations.cy.js

diff --git a/cmd/chat.go b/cmd/chat.go
index 8d982d00..b9a9f44d 100644
--- a/cmd/chat.go
+++ b/cmd/chat.go
@@ -657,7 +657,7 @@ func handleChatSubmitHandoffForm(r *fastglue.Request) error {
 		app.lo.Error("error completing AI handoff form", "conversation_uuid", conversation.UUID, "error", err)
 		return r.SendErrorEnvelope(fasthttp.StatusConflict, app.i18n.T("ai.agent.handoffFormUnavailable"), nil, envelope.ConflictError)
 	}
-	return r.SendEnvelope(map[string]bool{"handed_off": true})
+	return r.SendEnvelope(true)
 }
 
 // handleWidgetMediaUpload handles media uploads for the widget.
diff --git a/cmd/conversation.go b/cmd/conversation.go
index 6a1214b5..02a76478 100644
--- a/cmd/conversation.go
+++ b/cmd/conversation.go
@@ -22,6 +22,8 @@ import (
 	"github.com/zerodha/fastglue"
 )
 
+const maxTranscriptDownloadMessages = 1000
+
 type assigneeChangeReq struct {
 	AssigneeID int `json:"assignee_id"`
 }
@@ -383,7 +385,7 @@ func handleDownloadConversationTranscript(r *fastglue.Request) error {
 	}
 
 	private := false
-	messages, err := app.conversation.GetAllConversationMessages(uuid, &private, []string{cmodels.MessageIncoming, cmodels.MessageOutgoing}, 0)
+	messages, err := app.conversation.GetAllConversationMessages(uuid, &private, []string{cmodels.MessageIncoming, cmodels.MessageOutgoing}, maxTranscriptDownloadMessages)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
diff --git a/cmd/handlers.go b/cmd/handlers.go
index 968a1025..0681ed96 100644
--- a/cmd/handlers.go
+++ b/cmd/handlers.go
@@ -332,6 +332,9 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 	g.PUT("/api/v1/articles/{id}", perm(clearsHCCache(handleUpdateArticle), "help_center:manage"))
 	g.PUT("/api/v1/articles/{id}/collection", perm(clearsHCCache(handleMoveArticle), "help_center:manage"))
 	g.PUT("/api/v1/articles/{id}/status", perm(clearsHCCache(handleUpdateArticleStatus), "help_center:manage"))
+	g.GET("/api/v1/help-centers/{id}/linkable-articles", perm(handleGetLinkableArticles, "help_center:manage"))
+	g.PUT("/api/v1/articles/{id}/link-translation", perm(clearsHCCache(handleLinkArticleTranslation), "help_center:manage"))
+	g.PUT("/api/v1/articles/{id}/unlink-translation", perm(clearsHCCache(handleUnlinkArticleTranslation), "help_center:manage"))
 	g.GET("/api/v1/help-centers/{id}/insights", perm(handleGetHelpCenterInsights, "help_center:manage"))
 
 	// Public help center JSON API.
diff --git a/cmd/helpcenter.go b/cmd/helpcenter.go
index c7261330..f9c3d670 100644
--- a/cmd/helpcenter.go
+++ b/cmd/helpcenter.go
@@ -580,6 +580,67 @@ func handleUpdateArticleStatus(r *fastglue.Request) error {
 	return r.SendEnvelope(article)
 }
 
+// handleGetLinkableArticles lists articles in the other locales that can still be linked as a translation.
+func handleGetLinkableArticles(r *fastglue.Request) error {
+	var (
+		app           = r.Context.(*App)
+		id, _         = strconv.Atoi(r.RequestCtx.UserValue("id").(string))
+		excludeLocale = strings.TrimSpace(string(r.RequestCtx.QueryArgs().Peek("exclude_locale")))
+	)
+	if id <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`id`"), nil, envelope.InputError)
+	}
+	if excludeLocale == "" {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`exclude_locale`"), nil, envelope.InputError)
+	}
+	articles, err := app.helpcenter.GetLinkableArticles(id, excludeLocale)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(articles)
+}
+
+// handleLinkArticleTranslation moves an existing article into this article's translation group.
+func handleLinkArticleTranslation(r *fastglue.Request) error {
+	var (
+		app = r.Context.(*App)
+		req = struct {
+			TranslationOfID int `json:"translation_of_id"`
+		}{}
+		id, _ = strconv.Atoi(r.RequestCtx.UserValue("id").(string))
+	)
+	if id <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`id`"), nil, envelope.InputError)
+	}
+	if err := r.Decode(&req, "json"); err != nil {
+		return sendErrorEnvelope(r, envelope.NewError(envelope.InputError, app.i18n.T("errors.parsingRequest"), nil))
+	}
+	if req.TranslationOfID <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`translation_of_id`"), nil, envelope.InputError)
+	}
+	article, err := app.helpcenter.LinkArticleTranslation(id, req.TranslationOfID)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(article)
+}
+
+// handleUnlinkArticleTranslation detaches an article from its translation group.
+func handleUnlinkArticleTranslation(r *fastglue.Request) error {
+	var (
+		app   = r.Context.(*App)
+		id, _ = strconv.Atoi(r.RequestCtx.UserValue("id").(string))
+	)
+	if id <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`id`"), nil, envelope.InputError)
+	}
+	article, err := app.helpcenter.UnlinkArticleTranslation(id)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(article)
+}
+
 // handleRedirectHelpCenterHome redirects bare /hc/{slug} to the default-locale home so the locale is always in the path.
 func handleRedirectHelpCenterHome(r *fastglue.Request) error {
 	var (
@@ -1187,7 +1248,7 @@ func cacheHCPage(h fastglue.FastRequestHandler, noIndex bool) fastglue.FastReque
 
 // isEmbedRequest reports whether the page is framed by the chat widget.
 func isEmbedRequest(r *fastglue.Request) bool {
-	return string(r.RequestCtx.QueryArgs().Peek("embed")) == "1"
+	return r.RequestCtx.QueryArgs().GetBool("embed")
 }
 
 func isMarkdownRequest(r *fastglue.Request) bool {
diff --git a/cmd/widget_transcript.go b/cmd/widget_transcript.go
index 97acc76f..b1158d94 100644
--- a/cmd/widget_transcript.go
+++ b/cmd/widget_transcript.go
@@ -26,7 +26,7 @@ func handleWidgetTranscript(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 	private := false
-	messages, err := app.conversation.GetAllConversationMessages(uuid, &private, []string{cmodels.MessageIncoming, cmodels.MessageOutgoing}, 0)
+	messages, err := app.conversation.GetAllConversationMessages(uuid, &private, []string{cmodels.MessageIncoming, cmodels.MessageOutgoing}, maxTranscriptDownloadMessages)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
diff --git a/frontend/apps/main/src/api/index.js b/frontend/apps/main/src/api/index.js
index 1e31e8a7..8af83bcd 100644
--- a/frontend/apps/main/src/api/index.js
+++ b/frontend/apps/main/src/api/index.js
@@ -560,6 +560,12 @@ const updateArticle = (id, data) => http.put(`/api/v1/articles/${id}`, data)
 const deleteArticle = (collectionId, id) =>
   http.delete(`/api/v1/collections/${collectionId}/articles/${id}`)
 const updateArticleStatus = (id, data) => http.put(`/api/v1/articles/${id}/status`, data)
+const unlinkArticleTranslation = (id) => http.put(`/api/v1/articles/${id}/unlink-translation`)
+const linkArticleTranslation = (id, data) => http.put(`/api/v1/articles/${id}/link-translation`, data)
+const getLinkableArticles = (helpCenterId, excludeLocale) =>
+  http.get(`/api/v1/help-centers/${helpCenterId}/linkable-articles`, {
+    params: { exclude_locale: excludeLocale }
+  })
 const getHelpCenterInsights = (id) => http.get(`/api/v1/help-centers/${id}/insights`)
 const getContactNotes = (id) => http.get(`/api/v1/contacts/${id}/notes`)
 const createContactNote = (id, data) => http.post(`/api/v1/contacts/${id}/notes`, data, {
@@ -815,6 +821,9 @@ export default {
   updateArticle,
   deleteArticle,
   updateArticleStatus,
+  unlinkArticleTranslation,
+  linkArticleTranslation,
+  getLinkableArticles,
   getHelpCenterInsights,
   getAIFaqSuggestions,
   approveAIFaqSuggestion,
diff --git a/frontend/apps/main/src/features/admin/automation/ActionBox.vue b/frontend/apps/main/src/features/admin/automation/ActionBox.vue
index 73a3cc34..91d6cf36 100644
--- a/frontend/apps/main/src/features/admin/automation/ActionBox.vue
+++ b/frontend/apps/main/src/features/admin/automation/ActionBox.vue
@@ -9,7 +9,7 @@
         <div class="space-y-3">
           <div class="flex items-start justify-between gap-5">
             <div class="flex gap-5 flex-1 min-w-0">
-              <div class="w-56 shrink-0">
+              <div :class="fieldClass">
                 <!-- Type -->
                 <Select
                   v-model="action.type"
@@ -35,14 +35,14 @@
               <!-- Value -->
               <div
                 v-if="action.type && conversationActions[action.type]?.type === 'tag'"
-                class="flex-1 min-w-0"
+                class="flex-1 min-w-0 max-w-md"
               >
                 <SelectTagCombobox multiple v-model="action.value" />
               </div>
 
               <div
                 v-if="action.type && conversationActions[action.type]?.type === 'recipients'"
-                class="flex-1 min-w-0 space-y-3"
+                class="flex-1 min-w-0 max-w-md space-y-3"
               >
                 <SelectTag
                   :modelValue="action.recipients || []"
@@ -66,7 +66,7 @@
               </div>
 
               <div
-                class="flex-1 min-w-0"
+                :class="fieldClass"
                 v-if="action.type && conversationActions[action.type]?.type === 'select'"
               >
                 <SelectAgentCombobox
@@ -89,7 +89,7 @@
               </div>
 
               <div
-                class="flex gap-3 flex-1 min-w-0"
+                class="flex gap-3 flex-1 min-w-0 max-w-2xl"
                 v-if="action.type && conversationActions[action.type]?.type === 'webhook'"
               >
                 <div class="flex-1 min-w-0">
@@ -114,7 +114,7 @@
               </div>
 
               <div
-                class="flex-1 min-w-0"
+                :class="fieldClass"
                 v-if="action.type && conversationActions[action.type]?.type === 'text'"
               >
                 <Input
@@ -185,6 +185,8 @@ const props = defineProps({
   }
 })
 
+const fieldClass = 'flex-1 min-w-0 max-w-xs'
+
 const { actions } = toRefs(props)
 const { t } = useI18n()
 const emit = defineEmits(['update-actions', 'add-action', 'remove-action'])
diff --git a/frontend/apps/main/src/features/admin/automation/RuleBox.vue b/frontend/apps/main/src/features/admin/automation/RuleBox.vue
index 0be166ac..067cc5bd 100644
--- a/frontend/apps/main/src/features/admin/automation/RuleBox.vue
+++ b/frontend/apps/main/src/features/admin/automation/RuleBox.vue
@@ -42,7 +42,7 @@
               v-model="rule.field"
               @update:modelValue="(value) => handleFieldChange(value, index)"
             >
-              <SelectTrigger class="w-56">
+              <SelectTrigger :class="fieldClass">
                 <SelectValue :placeholder="t('placeholders.selectField')" />
               </SelectTrigger>
               <SelectContent>
@@ -53,7 +53,7 @@
                     {{ field.label }}
                   </SelectItem>
                   <!-- Contact custom attributes -->
-                  <SelectLabel>{{ $t('globals.terms.contact') }}</SelectLabel>
+                  <SelectLabel v-if="hasContactCustomAttributes">{{ $t('globals.terms.contact') }}</SelectLabel>
                   <SelectItem
                     v-for="(field, key) in contactCustomAttributes"
                     :key="key"
@@ -70,7 +70,7 @@
               v-model="rule.operator"
               @update:modelValue="(value) => handleOperatorChange(value, index)"
             >
-              <SelectTrigger class="w-56">
+              <SelectTrigger :class="fieldClass">
                 <SelectValue :placeholder="t('placeholders.selectOperator')" />
               </SelectTrigger>
               <SelectContent>
@@ -87,7 +87,7 @@
             </Select>
 
             <!-- Value -->
-            <div v-if="showInput(index)" class="flex-1">
+            <div v-if="showInput(index)" :class="fieldClass">
               <!-- Plain text input -->
               <Input
                 type="text"
@@ -180,8 +180,7 @@
               </Select>
             </div>
 
-            <!-- Placeholder for spacing -->
-            <div v-else class="flex-1"></div>
+            <div class="flex-1"></div>
 
             <!-- Remove condition -->
             <CloseButton :onClose="() => removeCondition(index)" />
@@ -253,12 +252,15 @@ const props = defineProps({
   }
 })
 
+const fieldClass = 'flex-1 min-w-0 max-w-xs'
+
 const fieldTypeConstants = {
   conversation: 'conversation',
   contact_custom_attribute: 'contact_custom_attribute'
 }
 const { conversationFilters, newConversationFilters, contactCustomAttributes } =
   useConversationFilters()
+const hasContactCustomAttributes = computed(() => Object.keys(contactCustomAttributes.value).length > 0)
 const { ruleGroup } = toRefs(props)
 const emit = defineEmits(['update-group', 'add-condition', 'remove-condition'])
 const { t } = useI18n()
diff --git a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
index ee1b117b..0f885a3d 100644
--- a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
+++ b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
@@ -16,10 +16,22 @@
             <SheetDescription v-if="translationSource" class="mt-1">
               {{ t('helpCenter.translationOf', { title: translationSource.title }) }}
             </SheetDescription>
-            <SheetDescription v-if="loadedArticle" class="mt-1">
-              {{ t('globals.terms.lastUpdated') }}:
-              {{ formatDate(loadedArticle.updated_at) }}
-            </SheetDescription>
+            <div v-if="loadedArticle" class="mt-1 flex items-center gap-3">
+              <SheetDescription>
+                {{ t('globals.terms.lastUpdated') }}:
+                {{ formatDate(loadedArticle.updated_at) }}
+              </SheetDescription>
+              <a
+                v-if="articleUrl"
+                :href="articleUrl"
+                target="_blank"
+                rel="noopener"
+                class="flex items-center gap-1 text-sm text-muted-foreground underline underline-offset-4 can-hover:hover:text-foreground"
+              >
+                {{ t('helpCenter.viewArticle') }}
+                <ExternalLink class="size-3.5" aria-hidden="true" />
+              </a>
+            </div>
           </div>
         </div>
 
@@ -102,31 +114,49 @@
                 <h3 class="font-medium text-sm text-muted-foreground">
                   {{ t('helpCenter.translations') }}
                 </h3>
+                <p class="text-sm text-muted-foreground">
+                  {{ t('helpCenter.translationsHint') }}
+                </p>
 
-                <div class="overflow-hidden rounded-md border bg-card">
-                  <button
-                    v-for="locale in translatedLocales"
-                    :key="locale"
-                    type="button"
-                    class="flex w-full items-center gap-3 border-b px-3 py-2.5 text-left text-sm last:border-b-0 disabled:cursor-default can-hover:hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-inset focus-visible:ring-ring"
-                    :class="{ 'font-medium': locale === loadedArticle.locale }"
-                    :disabled="locale === loadedArticle.locale"
-                    :aria-current="locale === loadedArticle.locale ? 'page' : undefined"
-                    @click="selectTranslationLocale(locale)"
-                  >
-                    <span class="min-w-0 flex-1 truncate">{{ languageName(locale) }}</span>
-                    <span class="text-xs uppercase text-muted-foreground">{{ locale }}</span>
-                    <Check
-                      v-if="locale === loadedArticle.locale"
-                      class="size-4 shrink-0"
-                      aria-hidden="true"
-                    />
-                    <ChevronRight
-                      v-else-if="translationByLocale.has(locale)"
-                      class="size-4 shrink-0 text-muted-foreground"
-                      aria-hidden="true"
-                    />
-                  </button>
+                <div class="space-y-2">
+                  <div v-for="locale in translatedLocales" :key="locale" class="flex gap-2">
+                    <button
+                      type="button"
+                      class="flex min-w-0 flex-1 items-center gap-3 rounded-md border bg-card px-3 py-2.5 text-left text-sm disabled:cursor-default can-hover:hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                      :class="{ 'font-medium': locale === loadedArticle.locale }"
+                      :disabled="locale === loadedArticle.locale"
+                      :aria-current="locale === loadedArticle.locale ? 'page' : undefined"
+                      @click="selectTranslationLocale(locale)"
+                    >
+                      <span class="min-w-0 flex-1 truncate">{{ languageName(locale) }}</span>
+                      <span class="text-xs uppercase text-muted-foreground">{{ locale }}</span>
+                      <Check
+                        v-if="locale === loadedArticle.locale"
+                        class="size-4 shrink-0"
+                        aria-hidden="true"
+                      />
+                      <ChevronRight
+                        v-else
+                        class="size-4 shrink-0 text-muted-foreground"
+                        aria-hidden="true"
+                      />
+                    </button>
+                    <Tooltip v-if="translatedLocales.length > 1">
+                      <TooltipTrigger as-child>
+                        <button
+                          type="button"
+                          class="shrink-0 rounded-md border bg-card px-2.5 text-muted-foreground can-hover:hover:bg-accent can-hover:hover:text-destructive focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                          :aria-label="t('helpCenter.unlinkTranslation')"
+                          @click="askUnlink(locale)"
+                        >
+                          <Unlink class="size-4" aria-hidden="true" />
+                        </button>
+                      </TooltipTrigger>
+                      <TooltipContent>
+                        {{ t('helpCenter.unlinkTranslation') }}
+                      </TooltipContent>
+                    </Tooltip>
+                  </div>
                 </div>
 
                 <Select
@@ -146,16 +176,17 @@
                     </SelectItem>
                   </SelectContent>
                 </Select>
+
                 <Button
-                  v-else
+                  v-if="missingLocales.length"
                   type="button"
-                  variant="outline"
+                  variant="ghost"
                   size="sm"
                   class="w-full"
-                  @click="emit('manage-languages')"
+                  @click="openLinkDialog"
                 >
-                  <Plus class="mr-2 size-4" aria-hidden="true" />
-                  {{ t('helpCenter.addTranslation') }}
+                  <Link2 class="mr-2 size-4" aria-hidden="true" />
+                  {{ t('helpCenter.linkExistingArticle') }}
                 </Button>
               </div>
 
@@ -197,9 +228,7 @@
                   type="button"
                   variant="outline"
                   size="sm"
-                  @click="
-                    emit('create-translation-collection', { locale: form.values.locale })
-                  "
+                  @click="emit('create-translation-collection', { locale: form.values.locale })"
                 >
                   <Plus class="mr-2 size-4" aria-hidden="true" />
                   {{ t('helpCenter.newCollection') }}
@@ -375,6 +404,58 @@
       </div>
     </SheetContent>
   </Sheet>
+
+  <Dialog :open="showLinkDialog" @update:open="showLinkDialog = $event">
+    <DialogContent class="sm:max-w-md">
+      <DialogHeader>
+        <DialogTitle>{{ t('helpCenter.linkExistingArticle') }}</DialogTitle>
+        <DialogDescription>{{ t('helpCenter.linkExistingArticleHint') }}</DialogDescription>
+      </DialogHeader>
+
+      <div class="space-y-4">
+        <Spinner v-if="isLoadingLinkable" />
+        <p v-else-if="!linkableArticleItems.length" class="text-sm text-muted-foreground">
+          {{ t('helpCenter.noLinkableArticles') }}
+        </p>
+        <SelectComboBox
+          v-else
+          v-model="linkArticleID"
+          :items="linkableArticleItems"
+          :placeholder="t('placeholders.selectArticle')"
+        />
+      </div>
+
+      <DialogFooter>
+        <Button type="button" variant="outline" @click="showLinkDialog = false">
+          {{ t('globals.messages.cancel') }}
+        </Button>
+        <Button type="button" :disabled="!linkArticleID || isLinking" @click="confirmLink">
+          {{ t('globals.terms.link') }}
+        </Button>
+      </DialogFooter>
+    </DialogContent>
+  </Dialog>
+
+  <AlertDialog :open="showUnlinkDialog" @update:open="showUnlinkDialog = $event">
+    <AlertDialogContent>
+      <AlertDialogHeader>
+        <AlertDialogTitle>{{ t('globals.messages.areYouAbsolutelySure') }}</AlertDialogTitle>
+        <AlertDialogDescription>
+          {{
+            t('helpCenter.unlinkTranslationConfirmation', {
+              language: languageName(unlinkLocale)
+            })
+          }}
+        </AlertDialogDescription>
+      </AlertDialogHeader>
+      <AlertDialogFooter>
+        <AlertDialogCancel>{{ t('globals.messages.cancel') }}</AlertDialogCancel>
+        <AlertDialogAction variant="destructive" @click="confirmUnlink">{{
+          t('globals.messages.unlink')
+        }}</AlertDialogAction>
+      </AlertDialogFooter>
+    </AlertDialogContent>
+  </AlertDialog>
 </template>
 
 <script setup>
@@ -394,6 +475,24 @@ import {
 } from '@shared-ui/components/ui/select'
 import SelectAgentCombobox from '@/components/combobox/SelectAgentCombobox.vue'
 import { Sheet, SheetContent, SheetTitle, SheetDescription } from '@shared-ui/components/ui/sheet'
+import {
+  Dialog,
+  DialogContent,
+  DialogDescription,
+  DialogFooter,
+  DialogHeader,
+  DialogTitle
+} from '@shared-ui/components/ui/dialog'
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle
+} from '@shared-ui/components/ui/alert-dialog'
 import {
   FormControl,
   FormDescription,
@@ -407,13 +506,16 @@ import { useI18n } from 'vue-i18n'
 import Editor from '@main/components/editor/ArticleEditor.vue'
 import { highlightCodeBlocks } from '@main/components/editor/highlightCodeBlocks'
 import { Spinner } from '@shared-ui/components/ui/spinner'
+import SelectComboBox from '@main/components/combobox/SelectCombobox.vue'
 import api from '@/api'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
 import { useEmitter } from '@/composables/useEmitter.js'
 import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
 import { useUserStore } from '@/stores/user'
+import { useAppSettingsStore } from '@/stores/appSettings'
 import { format, isValid } from 'date-fns'
-import { Check, ChevronRight, Plus } from 'lucide-vue-next'
+import { Check, ChevronRight, ExternalLink, Link2, Plus, Unlink } from 'lucide-vue-next'
+import { Tooltip, TooltipContent, TooltipTrigger } from '@shared-ui/components/ui/tooltip'
 
 const { t, locale: uiLocale } = useI18n()
 
@@ -438,6 +540,10 @@ const props = defineProps({
     type: String,
     default: ''
   },
+  helpCenterSlug: {
+    type: String,
+    default: ''
+  },
   helpCenterLocales: {
     type: Array,
     default: () => ['en']
@@ -469,13 +575,20 @@ const emit = defineEmits([
   'cancel',
   'create-translation',
   'create-translation-collection',
-  'open-translation',
-  'manage-languages'
+  'open-translation'
 ])
 const emitter = useEmitter()
 const userStore = useUserStore()
+const appSettingsStore = useAppSettingsStore()
 
 const isLoadingArticle = ref(false)
+const showUnlinkDialog = ref(false)
+const unlinkLocale = ref('')
+const showLinkDialog = ref(false)
+const isLinking = ref(false)
+const isLoadingLinkable = ref(false)
+const linkArticleID = ref('')
+const linkableArticles = ref([])
 const availableCollections = ref([])
 const editorText = ref('')
 const toolbarSlot = ref(null)
@@ -527,6 +640,15 @@ const languageDisplayNames = computed(
 )
 
 const languageName = (locale) => languageDisplayNames.value.of(locale) || locale
+
+const articleUrl = computed(() => {
+  if (!props.helpCenterSlug || loadedArticle.value?.status !== 'published') return ''
+  const root = (appSettingsStore.settings?.['app.root_url'] || window.location.origin).replace(
+    /\/$/,
+    ''
+  )
+  return `${root}/hc/${props.helpCenterSlug}/${loadedArticle.value.locale}/articles/${loadedArticle.value.slug}`
+})
 const formatDate = (value) => {
   const date = new Date(value)
   return isValid(date) ? format(date, 'PPpp') : '-'
@@ -650,6 +772,75 @@ const fetchArticle = async () => {
   }
 }
 
+const linkableArticleItems = computed(() =>
+  linkableArticles.value
+    .filter((article) => !translationByLocale.value.has(article.locale))
+    .map((article) => ({
+      label: `${article.title} - ${languageName(article.locale)}`,
+      value: String(article.id)
+    }))
+)
+
+const openLinkDialog = async () => {
+  linkArticleID.value = ''
+  linkableArticles.value = []
+  showLinkDialog.value = true
+  isLoadingLinkable.value = true
+  try {
+    const { data } = await api.getLinkableArticles(props.helpCenterId, loadedArticle.value.locale)
+    linkableArticles.value = data.data || []
+  } catch (error) {
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  } finally {
+    isLoadingLinkable.value = false
+  }
+}
+
+const confirmLink = async () => {
+  isLinking.value = true
+  try {
+    await api.linkArticleTranslation(Number(linkArticleID.value), {
+      translation_of_id: loadedArticle.value.id
+    })
+    loadedArticle.value = await fetchArticle()
+    showLinkDialog.value = false
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      description: t('helpCenter.translationLinked')
+    })
+  } catch (error) {
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  } finally {
+    isLinking.value = false
+  }
+}
+
+const askUnlink = (locale) => {
+  unlinkLocale.value = locale
+  showUnlinkDialog.value = true
+}
+
+const confirmUnlink = async () => {
+  showUnlinkDialog.value = false
+  try {
+    await api.unlinkArticleTranslation(translationByLocale.value.get(unlinkLocale.value).id)
+    loadedArticle.value = await fetchArticle()
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      description: t('helpCenter.translationUnlinked')
+    })
+  } catch (error) {
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  }
+}
+
 const selectTranslationLocale = (locale) => {
   if (form.meta.value.dirty) {
     emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
index 5fcaaca3..7a16a7a4 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
@@ -154,7 +154,7 @@ const unusedArticles = computed(() =>
           @update:model-value="update('featured_ids', [...featuredIds, Number($event)])"
         >
           <SelectTrigger class="max-w-md">
-            <SelectValue :placeholder="t('widget.selectArticle')" />
+            <SelectValue :placeholder="t('placeholders.selectArticle')" />
           </SelectTrigger>
           <SelectContent>
             <SelectItem
diff --git a/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue b/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue
index aaaa554e..3fcd473a 100644
--- a/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue
+++ b/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue
@@ -132,6 +132,7 @@
     :collection-id="editingArticle?.collection_id || createArticleCollectionId"
     :help-center-id="parseInt(id)"
     :help-center-name="helpCenter?.name || ''"
+    :help-center-slug="helpCenter?.slug || ''"
     :help-center-locales="helpCenter?.allowed_locales || ['en']"
     :default-locale="props.locale"
     :translation-source="translationSource"
@@ -142,7 +143,6 @@
     @create-translation="openCreateTranslation"
     @create-translation-collection="openCreateTranslationCollection"
     @open-translation="openTranslation"
-    @manage-languages="editHelpCenter"
   />
 
   <CollectionEditSheet
diff --git a/frontend/cypress/e2e/api/helpCenterArticleTranslations.cy.js b/frontend/cypress/e2e/api/helpCenterArticleTranslations.cy.js
new file mode 100644
index 00000000..a3d64f50
--- /dev/null
+++ b/frontend/cypress/e2e/api/helpCenterArticleTranslations.cy.js
@@ -0,0 +1,258 @@
+describe('API: help center article translations', () => {
+  const stamp = Date.now()
+  const hcSlug = `api-hc-tr-${stamp}`
+  const otherSlug = `api-hc-tr-other-${stamp}`
+  let helpCenterId
+  let otherHelpCenterId
+  let enCollectionId
+  let frCollectionId
+  let otherEnCollectionId
+  let enArticleId
+  let frArticleId
+  let frSpareArticleId
+  let otherArticleId
+
+  const createArticle = (collectionId, title, locale) =>
+    cy
+      .api('POST', `/api/v1/collections/${collectionId}/articles`, {
+        title,
+        content: `<p>${title}</p>`,
+        locale,
+        status: 'published'
+      })
+      .its('body.data.id')
+
+  before(() => {
+    cy.login()
+    cy.api('POST', '/api/v1/help-centers', {
+      name: `API translations ${stamp}`,
+      slug: hcSlug,
+      page_title: 'Help',
+      default_locale: 'en',
+      allowed_locales: ['en', 'fr']
+    })
+      .then(({ body }) => {
+        helpCenterId = body.data.id
+        return cy.api('POST', `/api/v1/help-centers/${helpCenterId}/collections`, {
+          name: `EN ${stamp}`,
+          locale: 'en'
+        })
+      })
+      .then(({ body }) => {
+        enCollectionId = body.data.id
+        return cy.api('POST', `/api/v1/help-centers/${helpCenterId}/collections`, {
+          name: `FR ${stamp}`,
+          locale: 'fr'
+        })
+      })
+      .then(({ body }) => {
+        frCollectionId = body.data.id
+        return createArticle(enCollectionId, `EN article ${stamp}`, 'en')
+      })
+      .then((id) => {
+        enArticleId = id
+        return createArticle(frCollectionId, `FR article ${stamp}`, 'fr')
+      })
+      .then((id) => {
+        frArticleId = id
+        return createArticle(frCollectionId, `FR spare ${stamp}`, 'fr')
+      })
+      .then((id) => {
+        frSpareArticleId = id
+        return cy.api('POST', '/api/v1/help-centers', {
+          name: `API translations other ${stamp}`,
+          slug: otherSlug,
+          page_title: 'Help',
+          default_locale: 'en',
+          allowed_locales: ['en']
+        })
+      })
+      .then(({ body }) => {
+        otherHelpCenterId = body.data.id
+        return cy.api('POST', `/api/v1/help-centers/${otherHelpCenterId}/collections`, {
+          name: `Other EN ${stamp}`,
+          locale: 'en'
+        })
+      })
+      .then(({ body }) => {
+        otherEnCollectionId = body.data.id
+        return createArticle(otherEnCollectionId, `Other EN article ${stamp}`, 'en')
+      })
+      .then((id) => {
+        otherArticleId = id
+      })
+  })
+
+  beforeEach(() => cy.login())
+
+  it('rejects a linkable list with no locale to exclude', () => {
+    cy.api('GET', `/api/v1/help-centers/${helpCenterId}/linkable-articles`, null, {
+      failOnStatusCode: false
+    }).then(({ status, body }) => {
+      expect(status).to.eq(400)
+      expect(body.error_type).to.eq('InputException')
+      expect(body.message).to.match(/exclude_locale/i)
+    })
+  })
+
+  it('lists only articles in the other locales', () => {
+    cy.api('GET', `/api/v1/help-centers/${helpCenterId}/linkable-articles?exclude_locale=en`).then(
+      ({ status, body }) => {
+        expect(status).to.eq(200)
+        const ids = body.data.map((a) => a.id)
+        expect(ids).to.include(frArticleId)
+        expect(ids).to.include(frSpareArticleId)
+        expect(ids).to.not.include(enArticleId)
+        expect(ids, 'articles from another help center').to.not.include(otherArticleId)
+        const fr = body.data.find((a) => a.id === frArticleId)
+        expect(fr.locale).to.eq('fr')
+        expect(fr.collection_name).to.eq(`FR ${stamp}`)
+      }
+    )
+  })
+
+  it('rejects a link with no target article', () => {
+    cy.api(
+      'PUT',
+      `/api/v1/articles/${frArticleId}/link-translation`,
+      {},
+      {
+        failOnStatusCode: false
+      }
+    ).then(({ status, body }) => {
+      expect(status).to.eq(400)
+      expect(body.error_type).to.eq('InputException')
+      expect(body.message).to.match(/translation_of_id/i)
+    })
+  })
+
+  it('rejects linking an article to itself', () => {
+    cy.api(
+      'PUT',
+      `/api/v1/articles/${frArticleId}/link-translation`,
+      { translation_of_id: frArticleId },
+      { failOnStatusCode: false }
+    ).then(({ status, body }) => {
+      expect(status).to.eq(400)
+      expect(body.error_type).to.eq('InputException')
+    })
+  })
+
+  it('rejects linking across help centers', () => {
+    cy.api(
+      'PUT',
+      `/api/v1/articles/${otherArticleId}/link-translation`,
+      { translation_of_id: frArticleId },
+      { failOnStatusCode: false }
+    ).then(({ status, body }) => {
+      expect(status).to.eq(400)
+      expect(body.error_type).to.eq('InputException')
+    })
+  })
+
+  it('404s linking an article that does not exist', () => {
+    cy.api(
+      'PUT',
+      '/api/v1/articles/99999999/link-translation',
+      { translation_of_id: enArticleId },
+      { failOnStatusCode: false }
+    ).then(({ status, body }) => {
+      expect(status).to.eq(404)
+      expect(body.error_type).to.eq('NotFoundException')
+    })
+  })
+
+  it('links the French article as a translation of the English one', () => {
+    cy.api('PUT', `/api/v1/articles/${frArticleId}/link-translation`, {
+      translation_of_id: enArticleId
+    })
+      .its('status')
+      .should('eq', 200)
+
+    cy.api('GET', `/api/v1/collections/${enCollectionId}/articles/${enArticleId}`).then(
+      ({ body }) => {
+        const locales = body.data.translations.map((t) => t.locale)
+        expect(locales).to.have.members(['en', 'fr'])
+      }
+    )
+    cy.api('GET', `/api/v1/collections/${frCollectionId}/articles/${frArticleId}`).then(
+      ({ body }) => {
+        const ids = body.data.translations.map((t) => t.id)
+        expect(ids).to.have.members([enArticleId, frArticleId])
+      }
+    )
+  })
+
+  it('drops linked articles from the linkable list', () => {
+    cy.api('GET', `/api/v1/help-centers/${helpCenterId}/linkable-articles?exclude_locale=en`).then(
+      ({ body }) => {
+        const ids = body.data.map((a) => a.id)
+        expect(ids).to.not.include(frArticleId)
+        expect(ids).to.include(frSpareArticleId)
+      }
+    )
+  })
+
+  it('rejects linking an article that already belongs to a translation set', () => {
+    cy.api(
+      'PUT',
+      `/api/v1/articles/${enArticleId}/link-translation`,
+      { translation_of_id: frSpareArticleId },
+      { failOnStatusCode: false }
+    ).then(({ status, body }) => {
+      expect(status).to.eq(409)
+      expect(body.error_type).to.eq('ConflictException')
+    })
+  })
+
+  it('rejects a second translation in a locale the set already has', () => {
+    cy.api(
+      'PUT',
+      `/api/v1/articles/${frSpareArticleId}/link-translation`,
+      { translation_of_id: enArticleId },
+      { failOnStatusCode: false }
+    ).then(({ status, body }) => {
+      expect(status).to.eq(409)
+      expect(body.error_type).to.eq('ConflictException')
+    })
+  })
+
+  it('unlinks the French article and leaves both standing on their own', () => {
+    cy.api('PUT', `/api/v1/articles/${frArticleId}/unlink-translation`)
+      .its('status')
+      .should('eq', 200)
+
+    cy.api('GET', `/api/v1/collections/${frCollectionId}/articles/${frArticleId}`).then(
+      ({ body }) => {
+        expect(body.data.translations.map((t) => t.id)).to.deep.eq([frArticleId])
+      }
+    )
+    cy.api('GET', `/api/v1/collections/${enCollectionId}/articles/${enArticleId}`).then(
+      ({ body }) => {
+        expect(body.data.translations.map((t) => t.id)).to.deep.eq([enArticleId])
+      }
+    )
+    cy.api('GET', `/api/v1/help-centers/${helpCenterId}/linkable-articles?exclude_locale=en`).then(
+      ({ body }) => {
+        expect(body.data.map((a) => a.id)).to.include(frArticleId)
+      }
+    )
+  })
+
+  it('404s unlinking an article that does not exist', () => {
+    cy.api('PUT', '/api/v1/articles/99999999/unlink-translation', null, {
+      failOnStatusCode: false
+    }).then(({ status, body }) => {
+      expect(status).to.eq(404)
+      expect(body.error_type).to.eq('NotFoundException')
+    })
+  })
+
+  after(() => {
+    cy.login()
+    cy.api('DELETE', `/api/v1/help-centers/${helpCenterId}`, null, { failOnStatusCode: false })
+    cy.api('DELETE', `/api/v1/help-centers/${otherHelpCenterId}`, null, {
+      failOnStatusCode: false
+    })
+  })
+})
diff --git a/frontend/cypress/e2e/ui/helpCenterTranslations.cy.js b/frontend/cypress/e2e/ui/helpCenterTranslations.cy.js
new file mode 100644
index 00000000..12e01272
--- /dev/null
+++ b/frontend/cypress/e2e/ui/helpCenterTranslations.cy.js
@@ -0,0 +1,141 @@
+// The steps run in order and share the help center created by the first one.
+
+const stamp = Date.now()
+const siteName = `Cypress Translations ${stamp}`
+const siteSlug = `cypress-tr-${stamp}`
+const enArticleTitle = `EN article ${stamp}`
+const frArticleTitle = `FR article ${stamp}`
+const listPath = '/admin/help-center'
+
+const sheet = () => cy.contains('[role="dialog"]', 'Edit article')
+// The sheet holds a button with the same text, so scope the dialog by its heading.
+const linkDialog = () => cy.contains('h2', 'Link an existing article').closest('[role="dialog"]')
+
+describe('Help center article translations', () => {
+  let helpCenterId
+  let enCollectionId
+  let frCollectionId
+  let enArticleId
+  let frArticleId
+
+  before(() => {
+    cy.login()
+    cy.api('POST', '/api/v1/help-centers', {
+      name: siteName,
+      slug: siteSlug,
+      page_title: `Help ${stamp}`,
+      default_locale: 'en',
+      allowed_locales: ['en', 'fr']
+    })
+      .then(({ body }) => {
+        helpCenterId = body.data.id
+        return cy.api('POST', `/api/v1/help-centers/${helpCenterId}/collections`, {
+          name: `EN ${stamp}`,
+          locale: 'en'
+        })
+      })
+      .then(({ body }) => {
+        enCollectionId = body.data.id
+        return cy.api('POST', `/api/v1/help-centers/${helpCenterId}/collections`, {
+          name: `FR ${stamp}`,
+          locale: 'fr'
+        })
+      })
+      .then(({ body }) => {
+        frCollectionId = body.data.id
+        return cy.api('POST', `/api/v1/collections/${enCollectionId}/articles`, {
+          title: enArticleTitle,
+          content: `<p>${enArticleTitle}</p>`,
+          locale: 'en',
+          status: 'published'
+        })
+      })
+      .then(({ body }) => {
+        enArticleId = body.data.id
+        return cy.api('POST', `/api/v1/collections/${frCollectionId}/articles`, {
+          title: frArticleTitle,
+          content: `<p>${frArticleTitle}</p>`,
+          locale: 'fr',
+          status: 'published'
+        })
+      })
+      .then(({ body }) => {
+        frArticleId = body.data.id
+      })
+  })
+
+  beforeEach(() => {
+    cy.viewport(1400, 900)
+    cy.login()
+  })
+
+  it('links an article written in another language', () => {
+    cy.intercept('PUT', '**/api/v1/articles/*/link-translation').as('linkTranslation')
+
+    cy.visit(`${listPath}/${helpCenterId}/tree/en`)
+    cy.contains('button.tree-node-title', enArticleTitle).click()
+
+    sheet().contains('button', 'Link an existing article').click()
+    linkDialog().find('button[role="combobox"]').click()
+    cy.get('[role="option"]').contains(frArticleTitle).click()
+    linkDialog().contains('button', 'Link').click()
+
+    cy.wait('@linkTranslation').its('response.statusCode').should('eq', 200)
+    sheet().contains('French').should('exist')
+    sheet().contains('button', 'Link an existing article').should('not.exist')
+  })
+
+  it('shows the linked article on the other side too', () => {
+    cy.visit(`${listPath}/${helpCenterId}/tree/fr`)
+    cy.contains('button.tree-node-title', frArticleTitle).click()
+    sheet().contains('English').should('exist')
+    sheet().contains('French').should('exist')
+  })
+
+  it('unlinks the article and keeps its own language listed', () => {
+    cy.intercept('PUT', '**/api/v1/articles/*/unlink-translation').as('unlinkTranslation')
+
+    cy.visit(`${listPath}/${helpCenterId}/tree/fr`)
+    cy.contains('button.tree-node-title', frArticleTitle).click()
+
+    sheet().contains('button', 'Unlink this article from translations').click()
+    cy.get('[role="alertdialog"]').contains('button', 'Unlink').click()
+    cy.wait('@unlinkTranslation').its('response.statusCode').should('eq', 200)
+
+    sheet().contains('French').should('exist')
+    sheet().contains('button', 'Link an existing article').should('exist')
+    sheet().contains('button', 'Unlink this article from translations').should('not.exist')
+    cy.api('GET', `/api/v1/collections/${frCollectionId}/articles/${frArticleId}`).then(
+      ({ body }) => {
+        expect(body.data.translations.map((t) => t.locale)).to.deep.eq(['fr'])
+      }
+    )
+  })
+
+  it('leaves no linkable article once every language is taken', () => {
+    cy.api('PUT', `/api/v1/articles/${frArticleId}/link-translation`, {
+      translation_of_id: enArticleId
+    })
+      .its('status')
+      .should('eq', 200)
+
+    cy.visit(`${listPath}/${helpCenterId}/tree/en`)
+    cy.contains('button.tree-node-title', enArticleTitle).click()
+    sheet().contains('button', 'Link an existing article').should('not.exist')
+    sheet().contains('Add translation').should('not.exist')
+  })
+
+  it('links to the published article on the public site', () => {
+    cy.visit(`${listPath}/${helpCenterId}/tree/en`)
+    cy.contains('button.tree-node-title', enArticleTitle).click()
+    sheet()
+      .contains('a', 'View article')
+      .should('have.attr', 'href')
+      .and('include', `/hc/${siteSlug}/en/articles/`)
+  })
+
+  after(() => {
+    cy.login()
+    cy.api('DELETE', `/api/v1/help-centers/${helpCenterId}`, null, { failOnStatusCode: false })
+  })
+})
diff --git a/frontend/cypress/support/commands.js b/frontend/cypress/support/commands.js
index d34e700b..8af654a1 100644
--- a/frontend/cypress/support/commands.js
+++ b/frontend/cypress/support/commands.js
@@ -27,7 +27,7 @@
 // Real login as the System user. Caches the session (and the csrf_token cookie
 // the backend sets on login) across specs so subsequent writes don't 403.
 Cypress.Commands.add('login', () => {
-  const email = 'System'
+  const email = Cypress.env('SYSTEM_EMAIL') || 'System'
   const password = Cypress.env('SYSTEM_PASSWORD') || 'StrongPass!123'
   cy.session(
     'system-agent',
diff --git a/i18n/en-US.json b/i18n/en-US.json
index ef526f41..d2a5ecb4 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -191,7 +191,7 @@
   "admin.ai.tool.availableInCopilot": "Available in Copilot",
   "admin.ai.tool.availableInGenerateReply": "Available in Generate Reply",
   "admin.ai.tool.requireAgentApproval": "Require agent approval",
-  "admin.ai.tool.requireAgentApprovalHint": "The tool pauses before it runs. The agent must review its arguments and approve or decline it. Keep this on for tools that change data. Read-only lookups can run without it.",
+  "admin.ai.tool.requireAgentApprovalHint": "The tool pauses before it runs, and an agent approves or declines it. Keep this on for tools that change data.",
   "admin.ai.snippet.new": "New snippet",
   "admin.ai.snippet.edit": "Edit snippet",
   "admin.ai.snippet.deleteConfirmation": "This will permanently delete the snippet.",
@@ -620,7 +620,7 @@
   "ai.noTagsConfigured": "No tags exist yet. Tag suggestions need an existing tag list to choose from. Ask an admin to create tags first.",
   "ai.tagSuggestEmptyConversation": "There are no messages to suggest tags from yet.",
   "ai.toolApprovalExpired": "This tool request is no longer available. Run the AI action again to create a new request.",
-  "ai.toolApprovalPending": "A tool request is waiting for approval. The AI cannot run again until it is reviewed. Approve or decline the pending request first.",
+  "ai.toolApprovalPending": "A tool request is waiting for approval. Approve or decline it before running the AI again.",
   "ai.toolApprovalUnavailable": "This tool request cannot be approved for this conversation. Run the AI action again to create a new request.",
   "ai.toolChangedBeforeApproval": "This tool changed after approval was requested and was not run. Run the AI action again to review the current tool.",
   "ai.toolApprovalTitle": "Review tool request",
@@ -952,6 +952,7 @@
   "globals.messages.revoke": "Revoke",
   "globals.messages.save": "Save",
   "globals.messages.saveChanges": "Save changes",
+  "globals.messages.unlink": "Unlink",
   "globals.messages.savedSuccessfully": "Changes saved",
   "globals.messages.saving": "Saving...",
   "globals.messages.selectAFutureTime": "Select a future time",
@@ -1315,8 +1316,20 @@
   "helpCenter.skipToContent": "Skip to main content",
   "helpCenter.resultsCount": "{count} result | {count} results",
   "helpCenter.supportedLanguages": "Supported languages",
+  "helpCenter.viewArticle": "View article",
   "helpCenter.visitSite": "Visit site",
   "helpCenter.supportedLanguagesHint": "Add a language before authoring articles in it.",
+  "helpCenter.translationsHint": "Write or link this article in other languages here. Readers who switch language land on the linked version, instead of the help center home page.",
+  "helpCenter.linkExistingArticle": "Link an existing article",
+  "helpCenter.linkExistingArticleHint": "Pick an article written in another language to join it with this one as a translation.",
+  "helpCenter.noLinkableArticles": "No articles in the other languages are free to link. Articles already linked as a translation are left out. Write the translation instead.",
+  "helpCenter.articleAlreadyTranslated": "That article is already part of another set of translations. Unlink it there first.",
+  "helpCenter.localeAlreadyTranslated": "This article already has a translation in that language.",
+  "helpCenter.cannotLinkArticleToItself": "An article cannot be its own translation.",
+  "helpCenter.translationLinked": "Article linked as a translation.",
+  "helpCenter.unlinkTranslation": "Unlink translation",
+  "helpCenter.unlinkTranslationConfirmation": "{language} will no longer be a translation of the others and will stand on its own. Its content stays as it is.",
+  "helpCenter.translationUnlinked": "Article unlinked from its translations.",
   "helpCenter.defaultLanguage": "Default language",
   "helpCenter.defaultLanguageHint": "Visitors land on this language unless they pick another.",
   "helpCenter.searchTerm": "Search term",
@@ -1481,6 +1494,7 @@
   "placeholders.selectEvents": "Select events",
   "placeholders.selectField": "Select field",
   "placeholders.selectInbox": "Select inbox",
+  "placeholders.selectArticle": "Select article",
   "placeholders.selectLanguage": "Select language",
   "placeholders.selectOperator": "Select operator",
   "placeholders.selectPosition": "Select position",
@@ -1654,7 +1668,6 @@
   "webhook.new": "New webhook",
   "webhook.sendTest": "Send test",
   "webhook.sentSuccessfully": "Webhook sent successfully",
-  "widget.selectArticle": "Select article",
   "widget.addCampaign": "Add proactive message",
   "widget.addHelpHomeApp": "Add help articles",
   "widget.articleUnavailable": "Article unavailable",
diff --git a/internal/helpcenter/helpcenter.go b/internal/helpcenter/helpcenter.go
index a0f322ba..b2796995 100644
--- a/internal/helpcenter/helpcenter.go
+++ b/internal/helpcenter/helpcenter.go
@@ -193,6 +193,11 @@ type queries struct {
 	MoveArticleToCollection       *sqlx.Stmt `query:"move-article-to-collection"`
 	UpdateArticleSortOrder        *sqlx.Stmt `query:"update-article-sort-order"`
 	UpdateArticleStatus           *sqlx.Stmt `query:"update-article-status"`
+	UnlinkArticleTranslation      *sqlx.Stmt `query:"unlink-article-translation"`
+	LinkArticleTranslation        *sqlx.Stmt `query:"link-article-translation"`
+	GetLinkableArticles           *sqlx.Stmt `query:"get-linkable-translation-articles"`
+	LocaleInTranslationGroup      *sqlx.Stmt `query:"article-locale-in-translation-group"`
+	CountTranslationSiblings      *sqlx.Stmt `query:"count-article-translation-siblings"`
 	DeleteArticle                 *sqlx.Stmt `query:"delete-article"`
 	UserIsAuthorAssignable        *sqlx.Stmt `query:"user-is-author-assignable"`
 
@@ -862,6 +867,77 @@ func (m *Manager) UpdateArticleStatus(id int, status string) (models.Article, er
 	return article, nil
 }
 
+// GetLinkableArticles returns articles in the help center written in another locale and not yet part of a translation group.
+func (m *Manager) GetLinkableArticles(helpCenterID int, excludeLocale string) ([]models.LinkableArticle, error) {
+	var articles = make([]models.LinkableArticle, 0)
+	if err := m.q.GetLinkableArticles.Select(&articles, helpCenterID, excludeLocale); err != nil {
+		m.lo.Error("error fetching linkable articles", "error", err, "help_center_id", helpCenterID)
+		return articles, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return articles, nil
+}
+
+// LinkArticleTranslation moves an article into the translation group of another article.
+func (m *Manager) LinkArticleTranslation(id, translationOfID int) (models.Article, error) {
+	var article models.Article
+	if id == translationOfID {
+		return article, envelope.NewError(envelope.InputError, m.i18n.T("helpCenter.cannotLinkArticleToItself"), nil)
+	}
+	source, err := m.GetArticleByID(translationOfID)
+	if err != nil {
+		return article, err
+	}
+	target, err := m.GetArticleByID(id)
+	if err != nil {
+		return article, err
+	}
+	sourceCollection, err := m.GetCollectionByID(source.CollectionID)
+	if err != nil {
+		return article, err
+	}
+	targetCollection, err := m.GetCollectionByID(target.CollectionID)
+	if err != nil {
+		return article, err
+	}
+	if sourceCollection.HelpCenterID != targetCollection.HelpCenterID {
+		return article, envelope.NewError(envelope.InputError, m.i18n.T("helpCenter.invalidCollection"), nil)
+	}
+	var siblings int
+	if err := m.q.CountTranslationSiblings.Get(&siblings, target.TranslationGroupID, target.ID); err != nil {
+		m.lo.Error("error counting translation siblings", "error", err, "id", id)
+		return article, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	if siblings > 0 {
+		return article, envelope.NewError(envelope.ConflictError, m.i18n.T("helpCenter.articleAlreadyTranslated"), nil)
+	}
+	var localeTaken bool
+	if err := m.q.LocaleInTranslationGroup.Get(&localeTaken, source.TranslationGroupID, target.Locale); err != nil {
+		m.lo.Error("error checking translation group locale", "error", err, "id", id)
+		return article, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	if localeTaken {
+		return article, envelope.NewError(envelope.ConflictError, m.i18n.T("helpCenter.localeAlreadyTranslated"), nil)
+	}
+	if err := m.q.LinkArticleTranslation.Get(&article, id, source.TranslationGroupID); err != nil {
+		m.lo.Error("error linking article translation", "error", err, "id", id)
+		return article, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return article, nil
+}
+
+// UnlinkArticleTranslation detaches an article from its translation group by giving it a group of its own.
+func (m *Manager) UnlinkArticleTranslation(id int) (models.Article, error) {
+	var article models.Article
+	if err := m.q.UnlinkArticleTranslation.Get(&article, id); err != nil {
+		if err == sql.ErrNoRows {
+			return article, envelope.NewError(envelope.NotFoundError, m.i18n.T("globals.messages.notFound"), nil)
+		}
+		m.lo.Error("error unlinking article translation", "error", err, "id", id)
+		return article, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
+	return article, nil
+}
+
 // DeleteArticle deletes an article by ID.
 func (m *Manager) DeleteArticle(id int) error {
 	if _, err := m.q.DeleteArticle.Exec(id); err != nil {
diff --git a/internal/helpcenter/models/models.go b/internal/helpcenter/models/models.go
index a7ed4da7..4558ac21 100644
--- a/internal/helpcenter/models/models.go
+++ b/internal/helpcenter/models/models.go
@@ -160,6 +160,13 @@ type ArticleTranslation struct {
 	Status       string `db:"status" json:"status"`
 }
 
+type LinkableArticle struct {
+	ID             int    `db:"id" json:"id"`
+	Title          string `db:"title" json:"title"`
+	Locale         string `db:"locale" json:"locale"`
+	CollectionName string `db:"collection_name" json:"collection_name"`
+}
+
 // NavLink is a single header navigation link on the public help center pages.
 type NavLink struct {
 	Label string `json:"label"`
diff --git a/internal/helpcenter/queries.sql b/internal/helpcenter/queries.sql
index 331bffbb..80cfc73c 100644
--- a/internal/helpcenter/queries.sql
+++ b/internal/helpcenter/queries.sql
@@ -209,6 +209,40 @@ SET status = $2, updated_at = NOW()
 WHERE id = $1
 RETURNING *;
 
+-- name: get-linkable-translation-articles
+SELECT a.id, a.title, a.locale, c.name AS collection_name
+FROM help_articles a
+JOIN article_collections c ON c.id = a.collection_id
+WHERE c.help_center_id = $1
+    AND a.locale != $2
+    AND NOT EXISTS (
+        SELECT 1 FROM help_articles sibling
+        WHERE sibling.translation_group_id = a.translation_group_id AND sibling.id != a.id
+    )
+ORDER BY a.locale, a.title;
+
+-- name: article-locale-in-translation-group
+SELECT EXISTS(
+    SELECT 1 FROM help_articles
+    WHERE translation_group_id = $1 AND locale = $2
+);
+
+-- name: count-article-translation-siblings
+SELECT COUNT(*) FROM help_articles
+WHERE translation_group_id = $1 AND id != $2;
+
+-- name: link-article-translation
+UPDATE help_articles
+SET translation_group_id = $2::UUID, updated_at = NOW()
+WHERE id = $1
+RETURNING *;
+
+-- name: unlink-article-translation
+UPDATE help_articles
+SET translation_group_id = gen_random_uuid(), updated_at = NOW()
+WHERE id = $1
+RETURNING *;
+
 -- name: delete-article
 DELETE FROM help_articles
 WHERE id = $1;
diff --git a/static/public/static/help-center-classic.css b/static/public/static/help-center-classic.css
index 4a5c1985..d670d7f9 100644
--- a/static/public/static/help-center-classic.css
+++ b/static/public/static/help-center-classic.css
@@ -89,6 +89,7 @@ a:hover { text-decoration: underline; }
 .hc-nav-links { margin-left: auto; display: flex; gap: 1.4rem; flex-wrap: wrap; align-items: center; }
 .hc-nav-links a { color: var(--hc-header-text, var(--hc-muted)); font-size: .95rem; font-weight: 500; opacity: .92; }
 .hc-nav-links a:hover { opacity: 1; text-decoration: none; }
+.hc-nav-actions { display: flex; align-items: center; gap: .4rem; }
 .hc-nav-toggle { display: none; }
 
 /* Hero: the search box straddles the band's bottom edge. */
@@ -429,7 +430,8 @@ article.hc-article .hc-meta-byline { display: flex; align-items: center; gap: .6
     .hc-nav[data-nav-open] .hc-nav-links { display: flex; }
     .hc-nav-links a { padding: .55rem .6rem; border-radius: var(--hc-radius-sm); color: var(--hc-ink); }
     .hc-nav-links a:hover { background: var(--hc-accent-tint); color: var(--hc-accent-ink); }
-    .hc-lang { align-self: flex-start; padding: .3rem .6rem 0; }
+    .hc-nav-actions { padding: .3rem .6rem 0; }
+    .hc-lang { align-self: flex-start; }
     .hc-lang-menu { right: auto; left: 0; }
     .hc-hero { padding: 2.5rem 1.25rem 0; }
     .hc-hero h1 { margin-bottom: 1.4rem; }
diff --git a/static/public/static/help-center-docs.css b/static/public/static/help-center-docs.css
index 6a71acc2..c73cae19 100644
--- a/static/public/static/help-center-docs.css
+++ b/static/public/static/help-center-docs.css
@@ -130,6 +130,7 @@ body.hcd::after {
 .hcd-topnav a { color: var(--hc-muted); font-size: .92rem; font-weight: 500; white-space: nowrap; }
 .hcd-topnav a:hover { color: var(--hc-ink); text-decoration: none; }
 .hcd-topbar-end { display: flex; align-items: center; gap: 1.1rem; justify-self: end; }
+.hc-nav-actions { display: flex; align-items: center; gap: .4rem; }
 .hcd-sidebar-toggle { display: none; }
 
 /* Topbar search trigger, styled as a slim input, centered in the bar. */
diff --git a/static/public/web-templates/help/classic/layout.html b/static/public/web-templates/help/classic/layout.html
index c0e7820b..18f29c88 100644
--- a/static/public/web-templates/help/classic/layout.html
+++ b/static/public/web-templates/help/classic/layout.html
@@ -16,8 +16,10 @@
             </button>
             <div class="hc-nav-links" id="hc-nav-links">
                 {{ range .Data.HelpCenter.NavLinks }}<a href="{{ .URL }}">{{ .Label }}</a>{{ end }}
-                {{ if gt (len .Data.HelpCenter.AvailableLocales) 1 }}{{ template "hc-lang-switcher" . }}{{ end }}
-                {{ if not .Data.HelpCenter.HideThemeToggle }}{{ template "hc-theme-toggle" . }}{{ end }}
+                <div class="hc-nav-actions">
+                    {{ if gt (len .Data.HelpCenter.AvailableLocales) 1 }}{{ template "hc-lang-switcher" . }}{{ end }}
+                    {{ if not .Data.HelpCenter.HideThemeToggle }}{{ template "hc-theme-toggle" . }}{{ end }}
+                </div>
             </div>
             {{ end }}
         </nav>
diff --git a/static/public/web-templates/help/docs/layout.html b/static/public/web-templates/help/docs/layout.html
index 204455ca..09ed6cdd 100644
--- a/static/public/web-templates/help/docs/layout.html
+++ b/static/public/web-templates/help/docs/layout.html
@@ -26,8 +26,10 @@
                     {{ range .Data.HelpCenter.NavLinks }}<a href="{{ .URL }}">{{ .Label }}</a>{{ end }}
                 </nav>
                 {{ end }}
-                {{ if gt (len .Data.HelpCenter.AvailableLocales) 1 }}{{ template "hc-lang-switcher" . }}{{ end }}
-                {{ if not .Data.HelpCenter.HideThemeToggle }}{{ template "hc-theme-toggle" . }}{{ end }}
+                <div class="hc-nav-actions">
+                    {{ if gt (len .Data.HelpCenter.AvailableLocales) 1 }}{{ template "hc-lang-switcher" . }}{{ end }}
+                    {{ if not .Data.HelpCenter.HideThemeToggle }}{{ template "hc-theme-toggle" . }}{{ end }}
+                </div>
             </div>
         </div>
     </header>

From 4ceb40e292ee346e06085739c4630eec341809f9 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Mon, 21 Sep 2026 01:24:09 +0530
Subject: [PATCH 126/178] keep dark mode when navigating the help center inside
 the widget

---
 cmd/helpcenter.go                                     | 6 +++++-
 frontend/cypress/e2e/ui/helpCenterTranslations.cy.js  | 8 ++++++--
 internal/helpcenter/helpcenter.go                     | 6 ++++++
 internal/helpcenter/queries.sql                       | 8 ++++++--
 static/public/web-templates/help/shared/partials.html | 4 +++-
 5 files changed, 26 insertions(+), 6 deletions(-)

diff --git a/cmd/helpcenter.go b/cmd/helpcenter.go
index f9c3d670..b0222191 100644
--- a/cmd/helpcenter.go
+++ b/cmd/helpcenter.go
@@ -654,8 +654,12 @@ func handleRedirectHelpCenterHome(r *fastglue.Request) error {
 	if redirectHelpCenterCanonicalHost(r, helpCenter) {
 		return nil
 	}
+	uri := helpCenterHomePath(helpCenter, helpCenter.DefaultLocale)
+	if qs := r.RequestCtx.URI().QueryString(); len(qs) > 0 {
+		uri += "?" + string(qs)
+	}
 	// 302, not 301: the default locale is mutable and browsers cache permanent redirects.
-	redirectPath(r.RequestCtx, helpCenterHomePath(helpCenter, helpCenter.DefaultLocale), fasthttp.StatusFound)
+	redirectPath(r.RequestCtx, uri, fasthttp.StatusFound)
 	return nil
 }
 
diff --git a/frontend/cypress/e2e/ui/helpCenterTranslations.cy.js b/frontend/cypress/e2e/ui/helpCenterTranslations.cy.js
index 12e01272..0df6e21a 100644
--- a/frontend/cypress/e2e/ui/helpCenterTranslations.cy.js
+++ b/frontend/cypress/e2e/ui/helpCenterTranslations.cy.js
@@ -98,13 +98,17 @@ describe('Help center article translations', () => {
     cy.visit(`${listPath}/${helpCenterId}/tree/fr`)
     cy.contains('button.tree-node-title', frArticleTitle).click()
 
-    sheet().contains('button', 'Unlink this article from translations').click()
+    sheet()
+      .contains('button', 'French')
+      .parent()
+      .find('button[aria-label="Unlink translation"]')
+      .click()
     cy.get('[role="alertdialog"]').contains('button', 'Unlink').click()
     cy.wait('@unlinkTranslation').its('response.statusCode').should('eq', 200)
 
     sheet().contains('French').should('exist')
     sheet().contains('button', 'Link an existing article').should('exist')
-    sheet().contains('button', 'Unlink this article from translations').should('not.exist')
+    sheet().find('button[aria-label="Unlink translation"]').should('not.exist')
     cy.api('GET', `/api/v1/collections/${frCollectionId}/articles/${frArticleId}`).then(
       ({ body }) => {
         expect(body.data.translations.map((t) => t.locale)).to.deep.eq(['fr'])
diff --git a/internal/helpcenter/helpcenter.go b/internal/helpcenter/helpcenter.go
index b2796995..a7f291b2 100644
--- a/internal/helpcenter/helpcenter.go
+++ b/internal/helpcenter/helpcenter.go
@@ -919,6 +919,12 @@ func (m *Manager) LinkArticleTranslation(id, translationOfID int) (models.Articl
 		return article, envelope.NewError(envelope.ConflictError, m.i18n.T("helpCenter.localeAlreadyTranslated"), nil)
 	}
 	if err := m.q.LinkArticleTranslation.Get(&article, id, source.TranslationGroupID); err != nil {
+		if err == sql.ErrNoRows {
+			return article, envelope.NewError(envelope.ConflictError, m.i18n.T("helpCenter.articleAlreadyTranslated"), nil)
+		}
+		if dbutil.IsUniqueViolationError(err) {
+			return article, envelope.NewError(envelope.ConflictError, m.i18n.T("helpCenter.localeAlreadyTranslated"), nil)
+		}
 		m.lo.Error("error linking article translation", "error", err, "id", id)
 		return article, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
diff --git a/internal/helpcenter/queries.sql b/internal/helpcenter/queries.sql
index 80cfc73c..346088d9 100644
--- a/internal/helpcenter/queries.sql
+++ b/internal/helpcenter/queries.sql
@@ -232,9 +232,13 @@ SELECT COUNT(*) FROM help_articles
 WHERE translation_group_id = $1 AND id != $2;
 
 -- name: link-article-translation
-UPDATE help_articles
+UPDATE help_articles a
 SET translation_group_id = $2::UUID, updated_at = NOW()
-WHERE id = $1
+WHERE a.id = $1
+    AND NOT EXISTS (
+        SELECT 1 FROM help_articles sibling
+        WHERE sibling.translation_group_id = a.translation_group_id AND sibling.id != a.id
+    )
 RETURNING *;
 
 -- name: unlink-article-translation
diff --git a/static/public/web-templates/help/shared/partials.html b/static/public/web-templates/help/shared/partials.html
index 811323cb..94e492ee 100644
--- a/static/public/web-templates/help/shared/partials.html
+++ b/static/public/web-templates/help/shared/partials.html
@@ -133,9 +133,11 @@
     </a>
     <script>
     (function () {
+        var theme = new URLSearchParams(location.search).get('theme');
         var embedded = function (href) {
             var url = new URL(href, location.href);
             url.searchParams.set('embed', '1');
+            if (theme) url.searchParams.set('theme', theme);
             return url.href;
         };
 
@@ -153,7 +155,7 @@
                     link.rel = 'noopener noreferrer';
                     return;
                 }
-                if (url.searchParams.get('embed') !== '1') link.href = embedded(link.href);
+                if (url.searchParams.get('embed') !== '1' || (theme && url.searchParams.get('theme') !== theme)) link.href = embedded(link.href);
             });
         };
         keepEmbedded();

From 2c34b8469a2fd1d8f8d2f16dd436b886dbb33934 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Mon, 21 Sep 2026 11:52:25 +0530
Subject: [PATCH 127/178] add a minimize button to the reply box

Collapses the composer into the same one-line bar the mobile layout
already uses, so the messages above stay readable while a draft is open.
Alt+M does the same from the keyboard. Cc and Bcc are now toggles in the
To row and only take a row of their own once they are used.
---
 .../components/KeyboardShortcutsDialog.vue    |   1 +
 .../apps/main/src/constants/emitterEvents.js  |   1 +
 .../features/command/useGlobalShortcuts.js    |   7 ++
 .../src/features/conversation/ReplyBox.vue    |  34 +++++-
 .../features/conversation/ReplyBoxContent.vue | 100 +++++++++++++++---
 i18n/en-US.json                               |   3 +
 6 files changed, 126 insertions(+), 20 deletions(-)

diff --git a/frontend/apps/main/src/components/KeyboardShortcutsDialog.vue b/frontend/apps/main/src/components/KeyboardShortcutsDialog.vue
index 9ea8da79..4a7d8657 100644
--- a/frontend/apps/main/src/components/KeyboardShortcutsDialog.vue
+++ b/frontend/apps/main/src/components/KeyboardShortcutsDialog.vue
@@ -81,6 +81,7 @@ const groups = computed(() => [
     items: [
       { label: t('actions.openMacros'), keys: [mod, 'M'] },
       { label: t('shortcuts.toggleReplyType'), keys: [mod, 'P'] },
+      { label: t('shortcuts.minimizeReplyBox'), keys: [alt, 'M'] },
       { label: t('actions.sendReply'), keys: ['Ctrl', 'Enter'] },
       { label: t('globals.terms.bold'), keys: [mod, 'B'] },
       { label: t('globals.terms.italic'), keys: [mod, 'I'] }
diff --git a/frontend/apps/main/src/constants/emitterEvents.js b/frontend/apps/main/src/constants/emitterEvents.js
index 9a5e6b26..05832cb0 100644
--- a/frontend/apps/main/src/constants/emitterEvents.js
+++ b/frontend/apps/main/src/constants/emitterEvents.js
@@ -11,6 +11,7 @@ export const EMITTER_EVENTS = {
     OPEN_VIEW_FORM: 'open-view-form',
     REPLY_BOX_FOCUS: 'reply-box-focus',
     REPLY_BOX_SET_TYPE: 'reply-box-set-type',
+    REPLY_BOX_TOGGLE_MINIMIZE: 'reply-box-toggle-minimize',
     CONVERSATION_ACTION: 'conversation-action',
     CONTACT_ACTION: 'contact-action'
 }
diff --git a/frontend/apps/main/src/features/command/useGlobalShortcuts.js b/frontend/apps/main/src/features/command/useGlobalShortcuts.js
index b6a2f110..e1b0a7a1 100644
--- a/frontend/apps/main/src/features/command/useGlobalShortcuts.js
+++ b/frontend/apps/main/src/features/command/useGlobalShortcuts.js
@@ -65,6 +65,12 @@ export function useGlobalShortcuts() {
     return true
   }
 
+  const toggleComposerMinimize = () => {
+    if (!conversationOpen()) return false
+    emitter.emit(EMITTER_EVENTS.REPLY_BOX_TOGGLE_MINIMIZE)
+    return true
+  }
+
   const toggleSelectCurrent = () => {
     if (!conversationOpen() || !canBulkAct.value) return false
     conversationStore.toggleSelect(conversationStore.current.uuid, false)
@@ -92,6 +98,7 @@ export function useGlobalShortcuts() {
     KeyA: openGroup('conv.assign-agent', perms.CONVERSATIONS_UPDATE_USER_ASSIGNEE),
     KeyR: compose('reply', perms.MESSAGES_WRITE),
     KeyN: compose('private_note', perms.MESSAGES_WRITE_PRIVATE),
+    KeyM: toggleComposerMinimize,
     KeyX: toggleSelectCurrent,
     KeyC: newConversation,
     KeyE: setStatus(CONVERSATION_DEFAULT_STATUSES.RESOLVED),
diff --git a/frontend/apps/main/src/features/conversation/ReplyBox.vue b/frontend/apps/main/src/features/conversation/ReplyBox.vue
index 5c7acda6..21c9cee8 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBox.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBox.vue
@@ -66,6 +66,7 @@
           v-model:bcc="bcc"
           v-model:emailErrors="emailErrors"
           v-model:messageType="messageType"
+          v-model:showCc="showCc"
           v-model:showBcc="showBcc"
           v-model:mentions="mentions"
           @toggleFullscreen="isEditorFullscreen = !isEditorFullscreen"
@@ -84,13 +85,13 @@
       </DialogContent>
     </Dialog>
 
-    <div v-if="isCramped && !isEditorFullscreen" class="p-2">
+    <div v-if="isCollapsed && !isEditorFullscreen" class="p-2">
       <Button
         type="button"
         variant="outline"
         class="w-full h-11 justify-start font-normal min-w-0"
         :class="{ '!bg-private': messageType === 'private_note', 'ai-generating': isGenerating }"
-        @click="isEditorFullscreen = true"
+        @click="expandComposer"
       >
         <Pencil class="shrink-0 text-muted-foreground" />
         <span v-if="draftPreview" class="truncate">{{ draftPreview }}</span>
@@ -111,7 +112,7 @@
     <div
       class="bg-background text-card-foreground box m-2 px-2 pt-2 flex flex-col relative"
       :class="{ '!bg-private': messageType === 'private_note', 'ai-generating': isGenerating }"
-      v-if="!isCramped && !isEditorFullscreen"
+      v-if="!isCollapsed && !isEditorFullscreen"
     >
       <ReplyBoxContent
         ref="replyBoxContentRef"
@@ -127,9 +128,11 @@
         v-model:bcc="bcc"
         v-model:emailErrors="emailErrors"
         v-model:messageType="messageType"
+        v-model:showCc="showCc"
         v-model:showBcc="showBcc"
         v-model:mentions="mentions"
         @toggleFullscreen="isEditorFullscreen = !isEditorFullscreen"
+        @minimize="isMinimized = true"
         @send="processSend"
         @sendAndSetStatus="processSendAndSetStatus"
         @fileUpload="handleFileUpload"
@@ -244,11 +247,13 @@ const {
 
 // Rest of existing state
 const isEditorFullscreen = ref(false)
+const isMinimized = ref(false)
 const isSending = ref(false)
 const isGenerating = ref(false)
 const to = ref('')
 const cc = ref('')
 const bcc = ref('')
+const showCc = ref(false)
 const showBcc = ref(false)
 const emailErrors = ref([])
 const replyBoxContentRef = ref(null)
@@ -289,6 +294,7 @@ const handleGenerateReply = () =>
 const handleCopilotInsertReply = (html) => {
   if (!html || !canSendReply.value) return
   if (messageType.value === 'private_note') messageType.value = 'reply'
+  isMinimized.value = false
   htmlContent.value = html
 }
 
@@ -304,19 +310,33 @@ const focusFromPalette = () => {
     nextTick(() => fullscreenContentRef.value?.focus())
     return
   }
+  if (isMinimized.value) {
+    isMinimized.value = false
+    nextTick(() => replyBoxContentRef.value?.focus())
+    return
+  }
   activeContentRef()?.focus()
 }
 
+const toggleMinimize = () => {
+  // The cramped layout is always collapsed, minimizing it would do nothing visible.
+  if (isCramped.value || isEditorFullscreen.value) return
+  isMinimized.value = !isMinimized.value
+  if (!isMinimized.value) nextTick(() => replyBoxContentRef.value?.focus())
+}
+
 onMounted(() => {
   emitter.on(EMITTER_EVENTS.COPILOT_INSERT_REPLY, handleCopilotInsertReply)
   emitter.on(EMITTER_EVENTS.REPLY_BOX_SET_TYPE, setMessageTypeFromPalette)
   emitter.on(EMITTER_EVENTS.REPLY_BOX_FOCUS, focusFromPalette)
+  emitter.on(EMITTER_EVENTS.REPLY_BOX_TOGGLE_MINIMIZE, toggleMinimize)
 })
 
 onUnmounted(() => {
   emitter.off(EMITTER_EVENTS.COPILOT_INSERT_REPLY, handleCopilotInsertReply)
   emitter.off(EMITTER_EVENTS.REPLY_BOX_SET_TYPE, setMessageTypeFromPalette)
   emitter.off(EMITTER_EVENTS.REPLY_BOX_FOCUS, focusFromPalette)
+  emitter.off(EMITTER_EVENTS.REPLY_BOX_TOGGLE_MINIMIZE, toggleMinimize)
 })
 
 /**
@@ -328,6 +348,13 @@ const hasTextContent = computed(() => {
 
 const draftPreview = computed(() => textContent.value.trim())
 
+const isCollapsed = computed(() => isCramped.value || isMinimized.value)
+
+const expandComposer = () => {
+  if (isCramped.value) isEditorFullscreen.value = true
+  else isMinimized.value = false
+}
+
 const attachmentCount = computed(() => mediaFiles.value.length + uploadingFiles.value.length)
 
 const processSend = async (skipContactEmailCheck = false, skipMissingTagsCheck = false, statusToSet = null) => {
@@ -541,6 +568,7 @@ watch(
   () => conversationStore.currentCC,
   (newVal) => {
     cc.value = newVal?.join(', ') || ''
+    showCc.value = cc.value.length > 0
   },
   { deep: true, immediate: true }
 )
diff --git a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
index f207d2f2..cc17e9a9 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
@@ -24,13 +24,25 @@
           </TabsTrigger>
         </TabsList>
       </Tabs>
-      <Button
-        class="text-muted-foreground max-md:h-11 max-md:w-11 max-md:p-0"
-        variant="ghost"
-        @click="toggleFullscreen"
-      >
-        <component :is="isFullscreen ? Minimize2 : Maximize2" />
-      </Button>
+      <div class="flex items-center">
+        <Button
+          v-if="!isFullscreen"
+          type="button"
+          class="text-muted-foreground"
+          variant="ghost"
+          :aria-label="t('globals.terms.collapse')"
+          @click="emit('minimize')"
+        >
+          <Minus />
+        </Button>
+        <Button
+          class="text-muted-foreground max-md:h-11 max-md:w-11 max-md:p-0"
+          variant="ghost"
+          @click="toggleFullscreen"
+        >
+          <component :is="isFullscreen ? Minimize2 : Maximize2" />
+        </Button>
+      </div>
     </div>
 
     <!-- To, CC, and BCC fields -->
@@ -48,29 +60,68 @@
             :class="RECIPIENT_INPUT_CLASS"
             @blur="validateEmails"
           />
+          <Button
+            v-if="!showCc"
+            type="button"
+            size="sm"
+            variant="ghost"
+            :class="RECIPIENT_TOGGLE_CLASS"
+            @click="showRecipientField('cc')"
+          >
+            {{ $t('replyBox.cc') }}
+          </Button>
+          <Button
+            v-if="!showBcc"
+            type="button"
+            size="sm"
+            variant="ghost"
+            :class="RECIPIENT_TOGGLE_CLASS"
+            @click="showRecipientField('bcc')"
+          >
+            {{ $t('replyBox.bcc') }}
+          </Button>
         </div>
-        <div class="flex items-center gap-2">
+        <div v-if="showCc" class="flex items-center gap-2">
           <label class="w-12 text-xs font-semibold tracking-wide text-muted-foreground">CC:</label>
           <Input
+            ref="ccInputRef"
             type="text"
             :placeholder="t('replyBox.emailAddresess')"
             v-model="cc"
             :class="RECIPIENT_INPUT_CLASS"
             @blur="validateEmails"
           />
-          <Button size="sm" @click="toggleBcc" variant="secondary">
-            {{ showBcc ? $t('replyBox.removeBCC') : $t('replyBox.bcc') }}
+          <Button
+            type="button"
+            size="sm"
+            variant="ghost"
+            :class="RECIPIENT_TOGGLE_CLASS"
+            :aria-label="t('replyBox.removeCC')"
+            @click="hideRecipientField('cc')"
+          >
+            <X class="w-4 h-4" />
           </Button>
         </div>
         <div v-if="showBcc" class="flex items-center gap-2">
           <label class="w-12 text-xs font-semibold tracking-wide text-muted-foreground">BCC:</label>
           <Input
+            ref="bccInputRef"
             type="text"
             :placeholder="t('replyBox.emailAddresess')"
             v-model="bcc"
             :class="RECIPIENT_INPUT_CLASS"
             @blur="validateEmails"
           />
+          <Button
+            type="button"
+            size="sm"
+            variant="ghost"
+            :class="RECIPIENT_TOGGLE_CLASS"
+            :aria-label="t('replyBox.removeBCC')"
+            @click="hideRecipientField('bcc')"
+          >
+            <X class="w-4 h-4" />
+          </Button>
         </div>
       </div>
 
@@ -144,12 +195,13 @@
 <script setup>
 const RECIPIENT_INPUT_CLASS =
   'flex-grow border-input bg-card px-3 py-2 text-sm shadow-none focus-visible:ring-1 focus-visible:ring-ring'
+const RECIPIENT_TOGGLE_CLASS = 'shrink-0 px-2 text-muted-foreground'
 
 import { ref, computed, nextTick, watch } from 'vue'
 import { useDebounceFn } from '@vueuse/core'
 import { EMITTER_EVENTS } from '@main/constants/emitterEvents.js'
 import { MACRO_CONTEXT } from '@main/constants/conversation'
-import { Maximize2, Minimize2 } from 'lucide-vue-next'
+import { Maximize2, Minimize2, Minus, X } from 'lucide-vue-next'
 import Editor from '@main/components/editor/ConversationEditor.vue'
 import { hasInlineImage, hasPendingInlineUpload } from '@main/composables/useInlineImageUpload'
 import { useConversationStore } from '@main/stores/conversation'
@@ -177,6 +229,7 @@ const messageType = defineModel('messageType', { default: 'reply' })
 const to = defineModel('to', { default: '' })
 const cc = defineModel('cc', { default: '' })
 const bcc = defineModel('bcc', { default: '' })
+const showCc = defineModel('showCc', { default: false })
 const showBcc = defineModel('showBcc', { default: false })
 const emailErrors = defineModel('emailErrors', { default: () => [] })
 const htmlContent = defineModel('htmlContent', { default: '' })
@@ -278,6 +331,7 @@ const props = defineProps({
 
 const emit = defineEmits([
   'toggleFullscreen',
+  'minimize',
   'send',
   'sendAndSetStatus',
   'fileUpload',
@@ -294,16 +348,28 @@ const emitter = useEmitter()
 const { t } = useI18n()
 const insertContent = ref(null)
 const editorRef = ref(null)
+const ccInputRef = ref(null)
+const bccInputRef = ref(null)
 
-const toggleBcc = async () => {
-  showBcc.value = !showBcc.value
+const showRecipientField = async (field) => {
+  if (field === 'cc') showCc.value = true
+  else showBcc.value = true
   await nextTick()
-  // If hiding BCC field, clear the content and validate email bcc so it doesn't show errors.
-  if (!showBcc.value) {
+  const input = field === 'cc' ? ccInputRef.value : bccInputRef.value
+  input?.$el?.focus()
+}
+
+// A hidden field must stay empty, its address would still be sent otherwise.
+const hideRecipientField = async (field) => {
+  if (field === 'cc') {
+    showCc.value = false
+    cc.value = ''
+  } else {
+    showBcc.value = false
     bcc.value = ''
-    await nextTick()
-    validateEmails()
   }
+  await nextTick()
+  validateEmails()
 }
 
 const toggleFullscreen = () => {
diff --git a/i18n/en-US.json b/i18n/en-US.json
index f8a4e8df..b606d00e 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -1444,6 +1444,7 @@
   "placeholders.tellUsAboutYourself": "Tell us about yourself",
   "placeholders.webhookEventName": "e.g. priority.escalated",
   "replyBox.bcc": "BCC",
+  "replyBox.cc": "CC",
   "replyBox.contactEmailMissing": "Contact email not in recipients",
   "replyBox.contactEmailMissingDescription": "The contact's email ({email}) is not included in to, cc, or bcc. The contact won't receive this reply.",
   "replyBox.emailAddresess": "Email addresses separated by comma",
@@ -1451,6 +1452,7 @@
   "replyBox.missingTagsDescription": "This conversation has no tags. Tagging helps with reporting and triage. You can still send without tagging.",
   "replyBox.missingTagsTitle": "No tags on this conversation",
   "replyBox.removeBCC": "Remove BCC",
+  "replyBox.removeCC": "Remove CC",
   "replyBox.sendAnyway": "Send anyway",
   "replyBox.sendAndSetAs": "Send and set as",
   "replyBox.toRequired": "At least one recipient is required in the To field.",
@@ -1499,6 +1501,7 @@
   "sharedView.allAgents": "All agents",
   "sharedView.editSharedView": "Edit shared view",
   "sharedView.new": "New shared view",
+  "shortcuts.minimizeReplyBox": "Minimize reply box",
   "shortcuts.nextConversation": "Next conversation",
   "shortcuts.openCommandBar": "Open command bar",
   "shortcuts.previousConversation": "Previous conversation",

From eeb11f941392586082aead9a0721f2d08302ab43 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Mon, 21 Sep 2026 11:57:57 +0530
Subject: [PATCH 128/178] show the draft text on the collapsed reply box

---
 frontend/apps/main/src/features/conversation/ReplyBox.vue | 4 +++-
 1 file changed, 3 insertions(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/features/conversation/ReplyBox.vue b/frontend/apps/main/src/features/conversation/ReplyBox.vue
index 21c9cee8..72792fe9 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBox.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBox.vue
@@ -151,6 +151,7 @@
 <script setup>
 import { ref, watch, computed, toRaw, nextTick, onMounted, onUnmounted } from 'vue'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
+import { getTextFromHTML } from '@shared-ui/utils/string'
 import { EMITTER_EVENTS } from '@main/constants/emitterEvents.js'
 import { MACRO_CONTEXT } from '@main/constants/conversation'
 import { useUserStore } from '@main/stores/user'
@@ -346,7 +347,8 @@ const hasTextContent = computed(() => {
   return textContent.value.trim().length > 0
 })
 
-const draftPreview = computed(() => textContent.value.trim())
+// No editor is mounted while the composer is collapsed, so textContent is empty until it opens.
+const draftPreview = computed(() => textContent.value.trim() || getTextFromHTML(htmlContent.value))
 
 const isCollapsed = computed(() => isCramped.value || isMinimized.value)
 

From d6bf0de1b5cf80a0653ecbb2660e902fdd0b3689 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Mon, 21 Sep 2026 11:57:57 +0530
Subject: [PATCH 129/178] shrink the status chip in the conversation header on
 mobile

---
 .../apps/main/src/features/conversation/Conversation.vue    | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/frontend/apps/main/src/features/conversation/Conversation.vue b/frontend/apps/main/src/features/conversation/Conversation.vue
index 5c2a4a0a..8be5691f 100644
--- a/frontend/apps/main/src/features/conversation/Conversation.vue
+++ b/frontend/apps/main/src/features/conversation/Conversation.vue
@@ -39,9 +39,11 @@
           <DropdownMenuTrigger>
             <div
               v-if="conversationStore.current?.status"
-              class="flex items-center space-x-1 cursor-pointer bg-primary px-3 py-3 xl:px-2 xl:py-1 rounded-md text-sm"
+              class="flex h-11 xl:h-8 items-center cursor-pointer"
             >
-              <span class="text-primary-foreground font-medium inline-block">
+              <span
+                class="rounded-md bg-primary px-2.5 py-1 text-xs xl:text-sm font-medium text-primary-foreground"
+              >
                 {{ conversationStore.current?.status }}
               </span>
             </div>

From a9047f8955628aadfae20d3c8fb7c7fe4647e7bd Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Mon, 21 Sep 2026 12:07:29 +0530
Subject: [PATCH 130/178] add a copy button next to the contact email

---
 .../sidebar/ConversationSideBarContact.vue           | 12 ++++++++----
 1 file changed, 8 insertions(+), 4 deletions(-)

diff --git a/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue b/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue
index 2b2d275a..f0114f06 100644
--- a/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue
+++ b/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue
@@ -51,9 +51,12 @@
           isVerified ? t('contact.identityVerified') : t('contact.identityNotVerified')
         }}</TooltipContent>
       </Tooltip>
-      <span v-if="conversation?.contact?.email" class="sidebar-value break-all">
-        {{ conversation?.contact?.email }}
-      </span>
+      <template v-if="conversation?.contact?.email">
+        <span class="sidebar-value break-all">
+          {{ conversation.contact.email }}
+        </span>
+        <CopyButton :text="conversation.contact.email" class="shrink-0" />
+      </template>
       <span v-else class="sidebar-label">
         {{ t('conversation.sidebar.notAvailable') }}
       </span>
@@ -113,6 +116,7 @@ import { ViewVerticalIcon } from '@radix-icons/vue'
 import { Button } from '@shared-ui/components/ui/button'
 import { Avatar, AvatarFallback, AvatarImage } from '@shared-ui/components/ui/avatar'
 import StatusDot from '@shared-ui/components/StatusDot.vue'
+import CopyButton from '@/components/button/CopyButton.vue'
 import {
   Mail,
   Phone,
@@ -131,7 +135,7 @@ import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
 import { useConversationStore } from '@/stores/conversation'
 import { useUserStore } from '@/stores/user'
 import { useI18n } from 'vue-i18n'
-import api from '../../../api'
+import api from '@/api'
 const conversationStore = useConversationStore()
 const emitter = useEmitter()
 const conversation = computed(() => conversationStore.current)

From e66804673f5c06675983eb135345395b2aa24507 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Mon, 21 Sep 2026 12:07:29 +0530
Subject: [PATCH 131/178] tidy comments in the reply box

---
 frontend/apps/main/src/features/conversation/ReplyBox.vue | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/frontend/apps/main/src/features/conversation/ReplyBox.vue b/frontend/apps/main/src/features/conversation/ReplyBox.vue
index 72792fe9..62364401 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBox.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBox.vue
@@ -320,7 +320,6 @@ const focusFromPalette = () => {
 }
 
 const toggleMinimize = () => {
-  // The cramped layout is always collapsed, minimizing it would do nothing visible.
   if (isCramped.value || isEditorFullscreen.value) return
   isMinimized.value = !isMinimized.value
   if (!isMinimized.value) nextTick(() => replyBoxContentRef.value?.focus())
@@ -347,7 +346,7 @@ const hasTextContent = computed(() => {
   return textContent.value.trim().length > 0
 })
 
-// No editor is mounted while the composer is collapsed, so textContent is empty until it opens.
+// textContent stays empty while the composer is collapsed, no editor is mounted to fill it.
 const draftPreview = computed(() => textContent.value.trim() || getTextFromHTML(htmlContent.value))
 
 const isCollapsed = computed(() => isCramped.value || isMinimized.value)

From 714d52b132ee07bbac1f468b81ab4414abbad5ff Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Mon, 21 Sep 2026 12:19:10 +0530
Subject: [PATCH 132/178] hide the bcc row when the thread has no bcc

---
 frontend/apps/main/src/features/conversation/ReplyBox.vue | 8 ++------
 1 file changed, 2 insertions(+), 6 deletions(-)

diff --git a/frontend/apps/main/src/features/conversation/ReplyBox.vue b/frontend/apps/main/src/features/conversation/ReplyBox.vue
index 62364401..dfc4cdf3 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBox.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBox.vue
@@ -585,12 +585,8 @@ watch(
 watch(
   () => conversationStore.currentBCC,
   (newVal) => {
-    const newBcc = newVal?.join(', ') || ''
-    bcc.value = newBcc
-    // Only show BCC field if it has content
-    if (newBcc.length > 0) {
-      showBcc.value = true
-    }
+    bcc.value = newVal?.join(', ') || ''
+    showBcc.value = bcc.value.length > 0
   },
   { deep: true, immediate: true }
 )

From 3cd6fc6b75e315bbc24d162ba3e00259a61f109e Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Mon, 21 Sep 2026 12:24:28 +0530
Subject: [PATCH 133/178] fix the status badge selector in the lifecycle test

---
 frontend/cypress/e2e/ui/conversationLifecycle.cy.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/cypress/e2e/ui/conversationLifecycle.cy.js b/frontend/cypress/e2e/ui/conversationLifecycle.cy.js
index 7f819d14..1940962a 100644
--- a/frontend/cypress/e2e/ui/conversationLifecycle.cy.js
+++ b/frontend/cypress/e2e/ui/conversationLifecycle.cy.js
@@ -43,7 +43,7 @@ describe('Conversation lifecycle', () => {
       .trigger('input')
 
   // The list column also renders a status dropdown; this one is the header badge.
-  const statusBadge = () => cy.get('div.bg-primary.rounded-md')
+  const statusBadge = () => cy.get('span.bg-primary.rounded-md')
 
   before(() => {
     cy.login()

From 01874c2e92571031af117f439d115dbad8685c62 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Mon, 21 Sep 2026 17:47:06 +0530
Subject: [PATCH 134/178] keep the tag list open so multiple tags can be picked
 in one go

---
 .../features/conversation/sidebar/ConversationSideBar.vue   | 1 +
 frontend/shared-ui/components/ui/select/SelectTag.vue       | 6 ++++++
 2 files changed, 7 insertions(+)

diff --git a/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBar.vue b/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBar.vue
index 754a23c7..2941f41d 100644
--- a/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBar.vue
+++ b/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBar.vue
@@ -45,6 +45,7 @@
             <div v-if="conversationStore.current">
               <SelectTagCombobox
                 multiple
+                keep-open-on-select
                 :model-value="conversationStore.current.tags || []"
                 @update:modelValue="onTagsChange"
               />
diff --git a/frontend/shared-ui/components/ui/select/SelectTag.vue b/frontend/shared-ui/components/ui/select/SelectTag.vue
index d0ac1d50..80b21c10 100644
--- a/frontend/shared-ui/components/ui/select/SelectTag.vue
+++ b/frontend/shared-ui/components/ui/select/SelectTag.vue
@@ -110,6 +110,10 @@ const props = defineProps({
   search: {
     type: Function,
     default: null
+  },
+  keepOpenOnSelect: {
+    type: Boolean,
+    default: false
   }
 })
 
@@ -172,6 +176,8 @@ const getLabel = (value) => {
 }
 
 const handleSelect = (event) => {
+  if (props.keepOpenOnSelect) event.preventDefault()
+
   const selectedValue = event.detail.value
   if (selectedValue) {
     tags.value = [...tags.value, selectedValue]

From 374cd26e4afd8b15690bd0ea5c4a2f595c371fe0 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 01:29:25 +0530
Subject: [PATCH 135/178] improve live chat widget settings and branding

Reduce the inbox form to five grouped tabs and add a responsive live preview.
Add separate light and dark branding with system theme support.
Add launcher size and logo scale controls. Ref #627
Fix realtime message ordering in the agent dashboard. Fixes #626
---
 cmd/chat.go                                   |   19 +-
 cmd/inboxes.go                                |   66 +-
 .../src/features/admin/automation/RuleTab.vue |   12 +-
 .../admin/help-center/ArticleEditSheet.vue    |    2 +-
 .../admin/inbox/LivechatInboxForm.vue         | 2908 +++++++++--------
 .../admin/inbox/LivechatWidgetPreview.vue     |  230 +-
 .../admin/inbox/PreChatFormConfig.vue         |    7 +-
 .../features/admin/inbox/WidgetCampaigns.vue  |  138 +-
 .../features/admin/inbox/WidgetHelpConfig.vue |    4 +
 .../admin/inbox/livechatFormSchema.js         |  108 +-
 .../admin/inbox/livechatFormSchema.test.js    |  164 +-
 .../src/layouts/admin/AdminSplitLayout.vue    |    6 +-
 frontend/apps/main/src/stores/conversation.js |    7 +-
 .../main/src/views/admin/inbox/InboxView.vue  |   50 +-
 frontend/apps/widget/src/App.vue              |    8 +-
 .../widget/src/components/ArticleReader.vue   |    2 +-
 .../apps/widget/src/components/ChatTitle.vue  |    2 +-
 .../src/components/ConversationsList.vue      |    2 +-
 .../apps/widget/src/components/HomeHeader.vue |    6 +-
 .../widget/src/composables/useHeaderTheme.js  |    6 +-
 .../src/composables/useReplyPreviews.js       |    2 +-
 .../apps/widget/src/layouts/MainLayout.vue    |    2 +-
 frontend/apps/widget/src/store/widget.js      |   19 +
 frontend/apps/widget/src/views/HomeView.vue   |    2 +-
 .../e2e/integration/livechat/config.cy.js     |   67 +-
 .../cypress/e2e/ui/livechatFormFields.cy.js   |  552 ++++
 .../cypress/e2e/ui/livechatFormLayout.cy.js   |  228 ++
 .../cypress/e2e/ui/livechatInboxForm.cy.js    |   35 +-
 .../e2e/ui/livechatThemeBranding.cy.js        |  136 +
 .../cypress/e2e/ui/livechatWidgetTabs.cy.js   |   42 +-
 frontend/cypress/support/livechat.js          |  122 +-
 frontend/shared-ui/assets/styles/main.scss    |    4 +
 .../ui/accordion/AccordionContent.vue         |    8 +-
 i18n/en-US.json                               |   18 +-
 internal/conversation/ws.go                   |    3 +-
 internal/inbox/channel/livechat/livechat.go   |  133 +-
 .../inbox/channel/livechat/livechat_test.go   |   87 +
 static/widget.js                              |   80 +-
 38 files changed, 3496 insertions(+), 1791 deletions(-)
 create mode 100644 frontend/cypress/e2e/ui/livechatFormFields.cy.js
 create mode 100644 frontend/cypress/e2e/ui/livechatFormLayout.cy.js
 create mode 100644 frontend/cypress/e2e/ui/livechatThemeBranding.cy.js

diff --git a/cmd/chat.go b/cmd/chat.go
index b9a9f44d..bf7af67d 100644
--- a/cmd/chat.go
+++ b/cmd/chat.go
@@ -95,9 +95,9 @@ type handoffFormReq struct {
 }
 
 type chatSettingsResponse struct {
-	Campaigns    *struct{} `json:"campaigns,omitempty"`
-	HasCampaigns bool      `json:"has_campaigns"`
-	CampaignDelaySeconds int `json:"campaign_delay_seconds"`
+	Campaigns            *struct{} `json:"campaigns,omitempty"`
+	HasCampaigns         bool      `json:"has_campaigns"`
+	CampaignDelaySeconds int       `json:"campaign_delay_seconds"`
 	livechat.Config
 	// Hide server-side fields from the public widget response.
 	TrustedDomains         *struct{}                     `json:"trusted_domains,omitempty"`
@@ -126,8 +126,12 @@ func handleGetChatLauncherSettings(r *fastglue.Request) error {
 	}
 
 	return r.SendEnvelope(map[string]any{
+		"theme":    config.Theme,
 		"launcher": config.Launcher,
-		"colors":   config.Colors,
+		"branding": map[string]any{
+			"light": launcherBranding(config.Branding.Light),
+			"dark":  launcherBranding(config.Branding.Dark),
+		},
 	})
 }
 
@@ -1460,3 +1464,10 @@ func canReply(r *fastglue.Request, conversation cmodels.Conversation) error {
 	}
 	return nil
 }
+
+func launcherBranding(b livechat.Branding) map[string]any {
+	return map[string]any{
+		"colors":   b.Colors,
+		"launcher": b.Launcher,
+	}
+}
diff --git a/cmd/inboxes.go b/cmd/inboxes.go
index 6fc132a2..e133dc9e 100644
--- a/cmd/inboxes.go
+++ b/cmd/inboxes.go
@@ -19,6 +19,15 @@ import (
 	"github.com/zerodha/fastglue"
 )
 
+var hexColorRegex = regexp.MustCompile(`^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$`)
+
+const (
+	minLauncherSize      = 40
+	maxLauncherSize      = 80
+	minLauncherIconScale = 40
+	maxLauncherIconScale = 100
+)
+
 // handleGetInboxes returns all inboxes
 func handleGetInboxes(r *fastglue.Request) error {
 	var app = r.Context.(*App)
@@ -45,6 +54,18 @@ func handleGetInbox(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
+	if inbox.Channel == livechat.ChannelLiveChat {
+		var config livechat.Config
+		if err := json.Unmarshal(inbox.Config, &config); err != nil {
+			app.lo.Error("error parsing live chat config", "id", id, "error", err)
+			return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.T("globals.messages.somethingWentWrong"), nil))
+		}
+		inbox.Config, err = json.Marshal(config)
+		if err != nil {
+			app.lo.Error("error encoding live chat config", "id", id, "error", err)
+			return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.T("globals.messages.somethingWentWrong"), nil))
+		}
+	}
 	if err := inbox.ClearPasswords(); err != nil {
 		app.lo.Error("error clearing inbox passwords from response", "error", err)
 		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.T("globals.messages.somethingWentWrong"), nil))
@@ -265,13 +286,28 @@ func validateInbox(app *App, inbox imodels.Inbox) error {
 			}
 		}
 
-		// Validate colors.
-		hexColorRegex := regexp.MustCompile(`^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$`)
-		if config.Colors.Primary == "" {
-			return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.empty", "name", "primary color"), nil)
+		for _, branding := range []livechat.Branding{config.Branding.Light, config.Branding.Dark} {
+			if branding.Colors.Primary == "" {
+				return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.empty", "name", "primary color"), nil)
+			}
+			if !hexColorRegex.MatchString(branding.Colors.Primary) {
+				return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidColor"), nil)
+			}
+			if branding.Launcher.Color != "" && !hexColorRegex.MatchString(branding.Launcher.Color) {
+				return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidColor"), nil)
+			}
+			if branding.HomeScreen.Background.ImageURL != "" && !httputil.IsValidHTTPURL(branding.HomeScreen.Background.ImageURL) {
+				return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidUrl"), nil)
+			}
+			for _, u := range []string{branding.LogoURL, branding.Launcher.LogoURL} {
+				if u != "" && !httputil.IsValidHTTPURL(u) {
+					return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidUrl"), nil)
+				}
+			}
 		}
-		if !hexColorRegex.MatchString(config.Colors.Primary) {
-			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidColor"), nil)
+
+		if config.Theme != livechat.ThemeSystem && config.Theme != livechat.ThemeLight && config.Theme != livechat.ThemeDark {
+			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
 		}
 
 		// Validate launcher position.
@@ -279,6 +315,14 @@ func validateInbox(app *App, inbox imodels.Inbox) error {
 			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
 		}
 
+		if config.Launcher.Size < minLauncherSize || config.Launcher.Size > maxLauncherSize {
+			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
+		}
+
+		if config.Launcher.IconScale < minLauncherIconScale || config.Launcher.IconScale > maxLauncherIconScale {
+			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
+		}
+
 		// Validate launcher spacing: clamp to a sane range so a fat-fingered value doesn't push the launcher off-screen.
 		if config.Launcher.Spacing.Side < 0 || config.Launcher.Spacing.Side > 200 ||
 			config.Launcher.Spacing.Bottom < 0 || config.Launcher.Spacing.Bottom > 200 {
@@ -294,18 +338,10 @@ func validateInbox(app *App, inbox imodels.Inbox) error {
 			}
 		}
 
-		// Validate home screen background image URL.
-		if config.HomeScreen.Background.ImageURL != "" && !httputil.IsValidHTTPURL(config.HomeScreen.Background.ImageURL) {
+		if config.WebsiteURL != "" && !httputil.IsValidHTTPURL(config.WebsiteURL) {
 			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidUrl"), nil)
 		}
 
-		// Validate URLs if set.
-		for _, u := range []string{config.LogoURL, config.Launcher.LogoURL, config.WebsiteURL} {
-			if u != "" && !httputil.IsValidHTTPURL(u) {
-				return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidUrl"), nil)
-			}
-		}
-
 		// Validate trusted domains.
 		// Valid formats: example.com, *.example.com, sub.example.com, example.com:8080
 		for _, domain := range config.TrustedDomains {
diff --git a/frontend/apps/main/src/features/admin/automation/RuleTab.vue b/frontend/apps/main/src/features/admin/automation/RuleTab.vue
index 2e13b757..12362be4 100644
--- a/frontend/apps/main/src/features/admin/automation/RuleTab.vue
+++ b/frontend/apps/main/src/features/admin/automation/RuleTab.vue
@@ -36,7 +36,17 @@
 
     <div class="space-y-4">
       <div v-if="type === 'new_conversation'">
-        <draggable v-model="rules" class="space-y-6" item-key="id" @end="onDragEnd">
+        <draggable
+          v-model="rules"
+          class="space-y-6"
+          item-key="id"
+          :animation="200"
+          :force-fallback="true"
+          fallback-on-body
+          :fallback-tolerance="3"
+          ghost-class="drag-ghost"
+          @end="onDragEnd"
+        >
           <template #item="{ element }">
             <div class="draggable-item">
               <RuleList :rule="element" @delete-rule="deleteRule" @toggle-rule="toggleRule" />
diff --git a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
index 0f885a3d..9dbd85a1 100644
--- a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
+++ b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
@@ -112,7 +112,7 @@
 
               <div v-if="loadedArticle && helpCenterLocales.length > 1" class="space-y-3">
                 <h3 class="font-medium text-sm text-muted-foreground">
-                  {{ t('helpCenter.translations') }}
+                  {{ t('globals.terms.translation', 2) }}
                 </h3>
                 <p class="text-sm text-muted-foreground">
                   {{ t('helpCenter.translationsHint') }}
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
index 6da07adb..7fef6e11 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
@@ -3,1312 +3,1434 @@
     <Tabs v-model="activeTab" class="w-full">
       <TabsList class="flex flex-wrap gap-1 h-auto p-1 w-fit">
         <TabsTrigger value="general">{{ $t('globals.terms.general') }}</TabsTrigger>
-        <TabsTrigger value="appearance">{{
-          $t('admin.inbox.livechat.tabs.appearance')
-        }}</TabsTrigger>
-        <TabsTrigger value="messages">{{ $t('admin.inbox.livechat.tabs.messages') }}</TabsTrigger>
-        <TabsTrigger value="features">{{ $t('globals.terms.features') }}</TabsTrigger>
-        <TabsTrigger value="campaigns">{{ $t('widget.proactiveMessages') }}</TabsTrigger>
-        <TabsTrigger value="help">{{ $t('globals.terms.helpCenter', 1) }}</TabsTrigger>
-        <TabsTrigger value="prechat">{{ $t('admin.inbox.livechat.tabs.prechat') }}</TabsTrigger>
-        <TabsTrigger value="users">{{ $t('globals.terms.users') }}</TabsTrigger>
-        <TabsTrigger value="security">{{ $t('globals.terms.security') }}</TabsTrigger>
-        <TabsTrigger value="installation">{{
-          $t('admin.inbox.livechat.tabs.installation')
-        }}</TabsTrigger>
+        <TabsTrigger value="appearance">{{ $t('globals.terms.appearance') }}</TabsTrigger>
+        <TabsTrigger value="content">{{ $t('globals.terms.content', 1) }}</TabsTrigger>
+        <TabsTrigger value="conversations">{{ $t('globals.terms.conversation', 2) }}</TabsTrigger>
+        <TabsTrigger value="setup">{{ $t('globals.terms.setup') }}</TabsTrigger>
       </TabsList>
 
       <div class="mt-8">
-        <!-- General Tab -->
-        <div v-show="activeTab === 'general'" class="space-y-8">
-          <FormField v-slot="{ componentField, handleChange }" name="enabled">
-            <FormItem>
-              <SwitchField
-                :checked="componentField.modelValue"
-                :title="$t('globals.terms.enabled')"
-                @update:checked="handleChange"
-              />
-            </FormItem>
-          </FormField>
-
-          <FormField v-slot="{ componentField, handleChange }" name="csat_enabled">
-            <FormItem>
-              <SwitchField
-                :title="$t('admin.inbox.csatSurveys')"
-                :description="$t('admin.inbox.csatSurveys.description_1')"
-                :checked="componentField.modelValue"
-                @update:checked="handleChange"
-              />
-            </FormItem>
-            <p class="!mt-2 text-muted-foreground text-xs flex items-start gap-1.5">
-              <Lightbulb class="size-4" />
-              <span>{{ $t('admin.inbox.csatSurveys.description_3') }}</span>
-            </p>
-          </FormField>
-
-          <FormField v-slot="{ componentField, handleChange }" name="prompt_tags_on_reply">
-            <FormItem>
-              <SwitchField
-                :title="$t('admin.inbox.promptTagsOnReply')"
-                :description="$t('admin.inbox.promptTagsOnReply.description')"
-                :checked="componentField.modelValue"
-                @update:checked="handleChange"
-              />
-            </FormItem>
-          </FormField>
-
-          <FormField v-slot="{ componentField }" name="name">
-            <FormItem>
-              <FormLabel>{{ $t('globals.terms.name') }}</FormLabel>
-              <FormControl>
-                <Input type="text" placeholder="" v-bind="componentField" />
-              </FormControl>
-              <FormMessage />
-            </FormItem>
-          </FormField>
-
-          <FormField v-slot="{ componentField }" name="config.brand_name">
-            <FormItem>
-              <FormLabel>{{ $t('globals.terms.brandName') }}</FormLabel>
-              <FormControl>
-                <Input type="text" placeholder="" v-bind="componentField" />
-              </FormControl>
-              <FormMessage />
-            </FormItem>
-          </FormField>
-
-          <FormField v-slot="{ componentField }" name="config.website_url">
-            <FormItem>
-              <FormLabel>{{ $t('admin.inbox.livechat.websiteUrl') }}</FormLabel>
-              <FormControl>
-                <Input type="url" placeholder="https://example.com" v-bind="componentField" />
-              </FormControl>
-              <FormDescription>{{
-                $t('admin.inbox.livechat.websiteUrl.description')
-              }}</FormDescription>
-              <FormMessage />
-            </FormItem>
-          </FormField>
-
-          <div class="grid grid-cols-2 gap-4">
-            <FormField v-slot="{ componentField }" name="config.language">
-              <FormItem>
-                <FormLabel>{{ $t('globals.terms.language') }}</FormLabel>
-                <FormControl>
-                  <Select v-bind="componentField">
-                    <SelectTrigger>
-                      <SelectValue :placeholder="$t('admin.general.language.placeholder')" />
-                    </SelectTrigger>
-                    <SelectContent>
-                      <SelectItem value="auto">{{
-                        $t('admin.inbox.livechat.language.auto')
-                      }}</SelectItem>
-                      <SelectItem
-                        v-for="lang in availableLanguages"
-                        :key="lang.code"
-                        :value="lang.code"
-                      >
-                        {{ lang.name }}
-                      </SelectItem>
-                    </SelectContent>
-                  </Select>
-                </FormControl>
-              </FormItem>
-            </FormField>
-
-            <FormField
-              v-if="form.values.config?.language === 'auto'"
-              v-slot="{ componentField }"
-              name="config.fallback_language"
-            >
-              <FormItem>
-                <FormLabel>{{ $t('admin.inbox.livechat.fallbackLanguage') }}</FormLabel>
-                <FormControl>
-                  <Select v-bind="componentField">
-                    <SelectTrigger>
-                      <SelectValue :placeholder="$t('admin.general.language.placeholder')" />
-                    </SelectTrigger>
-                    <SelectContent>
-                      <SelectItem
-                        v-for="lang in availableLanguages"
-                        :key="lang.code"
-                        :value="lang.code"
-                      >
-                        {{ lang.name }}
-                      </SelectItem>
-                    </SelectContent>
-                  </Select>
-                </FormControl>
-                <FormDescription>{{
-                  $t('admin.inbox.livechat.fallbackLanguage.description')
-                }}</FormDescription>
-              </FormItem>
-            </FormField>
-          </div>
-
-          <div class="grid grid-cols-2 gap-4">
-            <FormField v-slot="{ componentField }" name="linked_email_inbox_id">
-              <FormItem>
-                <FormLabel>{{ $t('admin.inbox.livechat.conversationContinuity') }}</FormLabel>
-                <FormControl>
-                  <Select v-bind="componentField">
-                    <SelectTrigger>
-                      <SelectValue :placeholder="$t('placeholders.selectInbox')" />
-                    </SelectTrigger>
-                    <SelectContent>
-                      <SelectItem :value="0">{{ $t('globals.terms.none') }}</SelectItem>
-                      <SelectItem v-for="inbox in emailInboxes" :key="inbox.id" :value="inbox.id">
-                        {{ inbox.name }}
-                      </SelectItem>
-                    </SelectContent>
-                  </Select>
-                </FormControl>
-                <FormDescription>
-                  {{ $t('admin.inbox.livechat.conversationContinuity.description') }}
-                </FormDescription>
-              </FormItem>
-            </FormField>
-
-            <template v-if="form.values.linked_email_inbox_id">
-              <FormField v-slot="{ componentField }" name="config.continuity.offline_threshold">
-                <FormItem>
-                  <FormLabel>{{
-                    $t('admin.inbox.livechat.continuity.offlineThreshold')
-                  }}</FormLabel>
-                  <FormControl>
-                    <Input type="text" placeholder="10m" v-bind="componentField" />
-                  </FormControl>
-                  <FormDescription>{{
-                    $t('admin.inbox.livechat.continuity.offlineThreshold.description')
-                  }}</FormDescription>
-                  <FormMessage />
-                </FormItem>
-              </FormField>
-
-              <FormField
-                v-slot="{ componentField }"
-                name="config.continuity.max_messages_per_email"
-              >
-                <FormItem>
-                  <FormLabel>{{
-                    $t('admin.inbox.livechat.continuity.maxMessagesPerEmail')
-                  }}</FormLabel>
-                  <FormControl>
-                    <Input
-                      type="number"
-                      :min="1"
-                      :max="100"
-                      placeholder="10"
-                      v-bind="componentField"
+        <div v-show="activeTab === 'general'">
+          <Accordion type="single" collapsible v-model="activeSection" class="w-full">
+            <AccordionItem value="basics" data-section="basics">
+              <AccordionTrigger class="text-base">{{ $t('globals.terms.general') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <FormField v-slot="{ componentField, handleChange }" name="enabled">
+                  <FormItem>
+                    <SwitchField
+                      :checked="componentField.modelValue"
+                      :title="$t('globals.terms.enabled')"
+                      @update:checked="handleChange"
                     />
-                  </FormControl>
-                  <FormDescription>{{
-                    $t('admin.inbox.livechat.continuity.maxMessagesPerEmail.description')
-                  }}</FormDescription>
-                  <FormMessage />
-                </FormItem>
-              </FormField>
+                  </FormItem>
+                </FormField>
 
-              <FormField v-slot="{ componentField }" name="config.continuity.min_email_interval">
-                <FormItem>
-                  <FormLabel>{{
-                    $t('admin.inbox.livechat.continuity.minEmailInterval')
-                  }}</FormLabel>
-                  <FormControl>
-                    <Input type="text" placeholder="15m" v-bind="componentField" />
-                  </FormControl>
-                  <FormDescription>{{
-                    $t('admin.inbox.livechat.continuity.minEmailInterval.description')
-                  }}</FormDescription>
-                  <FormMessage />
-                </FormItem>
-              </FormField>
-            </template>
-          </div>
+                <FormField v-slot="{ componentField, handleChange }" name="csat_enabled">
+                  <FormItem>
+                    <SwitchField
+                      :title="$t('admin.inbox.csatSurveys')"
+                      :description="$t('admin.inbox.csatSurveys.description_1')"
+                      :checked="componentField.modelValue"
+                      @update:checked="handleChange"
+                    />
+                  </FormItem>
+                  <p class="!mt-2 text-muted-foreground text-xs flex items-start gap-1.5">
+                    <Lightbulb class="size-4" />
+                    <span>{{ $t('admin.inbox.csatSurveys.description_3') }}</span>
+                  </p>
+                </FormField>
+
+                <FormField v-slot="{ componentField, handleChange }" name="prompt_tags_on_reply">
+                  <FormItem>
+                    <SwitchField
+                      :title="$t('admin.inbox.promptTagsOnReply')"
+                      :description="$t('admin.inbox.promptTagsOnReply.description')"
+                      :checked="componentField.modelValue"
+                      @update:checked="handleChange"
+                    />
+                  </FormItem>
+                </FormField>
+
+                <FormField v-slot="{ componentField }" name="name">
+                  <FormItem>
+                    <FormLabel>{{ $t('globals.terms.name') }}</FormLabel>
+                    <FormControl>
+                      <Input type="text" placeholder="" v-bind="componentField" />
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                </FormField>
+
+                <FormField v-slot="{ componentField }" name="config.brand_name">
+                  <FormItem>
+                    <FormLabel>{{ $t('globals.terms.brandName') }}</FormLabel>
+                    <FormControl>
+                      <Input type="text" placeholder="" v-bind="componentField" />
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                </FormField>
+
+                <FormField v-slot="{ componentField }" name="config.website_url">
+                  <FormItem>
+                    <FormLabel>{{ $t('admin.inbox.livechat.websiteUrl') }}</FormLabel>
+                    <FormControl>
+                      <Input type="url" placeholder="https://example.com" v-bind="componentField" />
+                    </FormControl>
+                    <FormDescription>{{
+                      $t('admin.inbox.livechat.websiteUrl.description')
+                    }}</FormDescription>
+                    <FormMessage />
+                  </FormItem>
+                </FormField>
+
+                <div class="grid grid-cols-2 gap-4">
+                  <FormField v-slot="{ componentField }" name="config.language">
+                    <FormItem>
+                      <FormLabel>{{ $t('globals.terms.language') }}</FormLabel>
+                      <FormControl>
+                        <Select v-bind="componentField">
+                          <SelectTrigger>
+                            <SelectValue :placeholder="$t('admin.general.language.placeholder')" />
+                          </SelectTrigger>
+                          <SelectContent>
+                            <SelectItem value="auto">{{
+                              $t('admin.inbox.livechat.language.auto')
+                            }}</SelectItem>
+                            <SelectItem
+                              v-for="lang in availableLanguages"
+                              :key="lang.code"
+                              :value="lang.code"
+                            >
+                              {{ lang.name }}
+                            </SelectItem>
+                          </SelectContent>
+                        </Select>
+                      </FormControl>
+                    </FormItem>
+                  </FormField>
+
+                  <FormField
+                    v-if="form.values.config?.language === 'auto'"
+                    v-slot="{ componentField }"
+                    name="config.fallback_language"
+                  >
+                    <FormItem>
+                      <FormLabel>{{ $t('admin.inbox.livechat.fallbackLanguage') }}</FormLabel>
+                      <FormControl>
+                        <Select v-bind="componentField">
+                          <SelectTrigger>
+                            <SelectValue :placeholder="$t('admin.general.language.placeholder')" />
+                          </SelectTrigger>
+                          <SelectContent>
+                            <SelectItem
+                              v-for="lang in availableLanguages"
+                              :key="lang.code"
+                              :value="lang.code"
+                            >
+                              {{ lang.name }}
+                            </SelectItem>
+                          </SelectContent>
+                        </Select>
+                      </FormControl>
+                      <FormDescription>{{
+                        $t('admin.inbox.livechat.fallbackLanguage.description')
+                      }}</FormDescription>
+                    </FormItem>
+                  </FormField>
+                </div>
+              </AccordionContent>
+            </AccordionItem>
+            <AccordionItem value="continuity" data-section="continuity">
+              <AccordionTrigger class="text-base">{{ $t('admin.inbox.livechat.conversationContinuity') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <div class="grid grid-cols-2 gap-4">
+                  <FormField v-slot="{ componentField }" name="linked_email_inbox_id">
+                    <FormItem>
+                      <FormLabel>{{ $t('admin.inbox.livechat.conversationContinuity') }}</FormLabel>
+                      <FormControl>
+                        <Select v-bind="componentField">
+                          <SelectTrigger>
+                            <SelectValue :placeholder="$t('placeholders.selectInbox')" />
+                          </SelectTrigger>
+                          <SelectContent>
+                            <SelectItem :value="0">{{ $t('globals.terms.none') }}</SelectItem>
+                            <SelectItem v-for="inbox in emailInboxes" :key="inbox.id" :value="inbox.id">
+                              {{ inbox.name }}
+                            </SelectItem>
+                          </SelectContent>
+                        </Select>
+                      </FormControl>
+                      <FormDescription>
+                        {{ $t('admin.inbox.livechat.conversationContinuity.description') }}
+                      </FormDescription>
+                    </FormItem>
+                  </FormField>
+
+                  <template v-if="form.values.linked_email_inbox_id">
+                    <FormField v-slot="{ componentField }" name="config.continuity.offline_threshold">
+                      <FormItem>
+                        <FormLabel>{{
+                          $t('admin.inbox.livechat.continuity.offlineThreshold')
+                        }}</FormLabel>
+                        <FormControl>
+                          <Input type="text" placeholder="10m" v-bind="componentField" />
+                        </FormControl>
+                        <FormDescription>{{
+                          $t('admin.inbox.livechat.continuity.offlineThreshold.description')
+                        }}</FormDescription>
+                        <FormMessage />
+                      </FormItem>
+                    </FormField>
+
+                    <FormField
+                      v-slot="{ componentField }"
+                      name="config.continuity.max_messages_per_email"
+                    >
+                      <FormItem>
+                        <FormLabel>{{
+                          $t('admin.inbox.livechat.continuity.maxMessagesPerEmail')
+                        }}</FormLabel>
+                        <FormControl>
+                          <Input
+                            type="number"
+                            :min="1"
+                            :max="100"
+                            placeholder="10"
+                            v-bind="componentField"
+                          />
+                        </FormControl>
+                        <FormDescription>{{
+                          $t('admin.inbox.livechat.continuity.maxMessagesPerEmail.description')
+                        }}</FormDescription>
+                        <FormMessage />
+                      </FormItem>
+                    </FormField>
+
+                    <FormField v-slot="{ componentField }" name="config.continuity.min_email_interval">
+                      <FormItem>
+                        <FormLabel>{{
+                          $t('admin.inbox.livechat.continuity.minEmailInterval')
+                        }}</FormLabel>
+                        <FormControl>
+                          <Input type="text" placeholder="15m" v-bind="componentField" />
+                        </FormControl>
+                        <FormDescription>{{
+                          $t('admin.inbox.livechat.continuity.minEmailInterval.description')
+                        }}</FormDescription>
+                        <FormMessage />
+                      </FormItem>
+                    </FormField>
+                  </template>
+                </div>
+              </AccordionContent>
+            </AccordionItem>
+          </Accordion>
         </div>
 
-        <!-- Appearance Tab -->
-        <div v-show="activeTab === 'appearance'" class="space-y-8">
-          <FormField v-slot="{ componentField }" name="config.logo_url">
-            <FormItem>
-              <FormLabel>{{ $t('globals.terms.logoUrl') }}</FormLabel>
-              <FormControl>
-                <Input
-                  type="url"
-                  placeholder="https://example.com/logo.png"
-                  v-bind="componentField"
-                />
-              </FormControl>
-              <FormMessage />
-            </FormItem>
-          </FormField>
-
-          <FormField v-slot="{ componentField, handleChange }" name="config.dark_mode">
-            <FormItem>
-              <SwitchField
-                :title="$t('admin.inbox.livechat.darkMode')"
-                :description="$t('admin.inbox.livechat.darkMode.description')"
-                :checked="componentField.modelValue"
-                @update:checked="handleChange"
-              />
-            </FormItem>
-          </FormField>
-
-          <FormField v-slot="{ componentField, handleChange }" name="config.show_powered_by">
-            <FormItem>
-              <SwitchField
-                :title="$t('admin.inbox.livechat.showPoweredBy')"
-                :description="$t('admin.inbox.livechat.showPoweredBy.description')"
-                :checked="componentField.modelValue"
-                @update:checked="handleChange"
-              />
-            </FormItem>
-          </FormField>
-
-          <!-- Colors -->
-          <div class="space-y-4">
-            <h4 class="text-base font-semibold text-foreground">
-              {{ $t('admin.inbox.livechat.colors') }}
-            </h4>
-            <div class="grid grid-cols-2 gap-4">
-              <FormField v-slot="{ componentField }" name="config.colors.primary">
-                <FormItem>
-                  <FormLabel>{{ $t('globals.terms.primaryColor', 1) }}</FormLabel>
-                  <FormControl>
-                    <Input type="color" v-bind="componentField" />
-                  </FormControl>
-                  <FormMessage />
-                  <p
-                    v-if="lowPrimaryContrast"
-                    class="text-sm text-destructive flex items-start gap-1.5"
-                  >
-                    <TriangleAlert class="size-4 shrink-0 mt-0.5" />
-                    <span>{{ $t('admin.inbox.livechat.colors.primary.contrastWarning') }}</span>
-                  </p>
-                </FormItem>
-              </FormField>
-            </div>
-          </div>
-
-          <!-- Home Screen -->
-          <div class="space-y-4">
-            <h4 class="text-base font-semibold text-foreground">
-              {{ $t('globals.terms.homeScreen') }}
-            </h4>
-
-            <FormField v-slot="{ componentField }" name="config.home_screen.header_text_color">
-              <FormItem>
-                <FormLabel>{{ $t('globals.messages.headerTextColor') }}</FormLabel>
-                <FormControl>
-                  <RadioGroup v-bind="componentField" class="flex gap-4">
-                    <div class="flex items-center space-x-2">
-                      <RadioGroupItem id="text-black" value="black" />
-                      <Label for="text-black">{{ $t('globals.terms.black') }}</Label>
-                    </div>
-                    <div class="flex items-center space-x-2">
-                      <RadioGroupItem id="text-white" value="white" />
-                      <Label for="text-white">{{ $t('globals.terms.white') }}</Label>
-                    </div>
-                  </RadioGroup>
-                </FormControl>
-                <FormDescription>{{
-                  $t('admin.inbox.livechat.homeScreen.headerTextColor.description')
-                }}</FormDescription>
-                <p
-                  v-if="lowHeaderContrast"
-                  class="text-sm text-destructive flex items-start gap-1.5"
-                >
-                  <TriangleAlert class="size-4 shrink-0 mt-0.5" />
-                  <span>{{
-                    $t('admin.inbox.livechat.homeScreen.headerTextColor.contrastWarning')
-                  }}</span>
-                </p>
-              </FormItem>
-            </FormField>
-
-            <FormField v-slot="{ componentField }" name="config.home_screen.background.type">
-              <FormItem>
-                <FormLabel>{{ $t('globals.terms.background') }}</FormLabel>
-                <FormControl>
-                  <RadioGroup
-                    v-bind="componentField"
-                    @update:model-value="onBackgroundTypeChange"
-                    class="flex gap-4"
-                  >
-                    <div class="flex items-center space-x-2">
-                      <RadioGroupItem id="bg-solid" value="solid" />
-                      <Label for="bg-solid">{{ $t('globals.terms.solid') }}</Label>
-                    </div>
-                    <div class="flex items-center space-x-2">
-                      <RadioGroupItem id="bg-gradient" value="gradient" />
-                      <Label for="bg-gradient">{{ $t('globals.terms.gradient') }}</Label>
-                    </div>
-                    <div class="flex items-center space-x-2">
-                      <RadioGroupItem id="bg-image" value="image" />
-                      <Label for="bg-image">{{ $t('globals.terms.image', 1) }}</Label>
-                    </div>
-                  </RadioGroup>
-                </FormControl>
-              </FormItem>
-            </FormField>
-
-            <div
-              v-if="form.values.config?.home_screen?.background?.type === 'solid'"
-              class="grid grid-cols-2 gap-4"
-            >
-              <FormField
-                v-slot="{ componentField }"
-                name="config.home_screen.background.color"
-                keep-value
-              >
-                <FormItem>
-                  <FormLabel>{{ $t('globals.messages.backgroundColor') }}</FormLabel>
-                  <FormControl>
-                    <Input type="color" v-bind="componentField" />
-                  </FormControl>
-                  <FormMessage />
-                </FormItem>
-              </FormField>
-            </div>
-
-            <div
-              v-if="form.values.config?.home_screen?.background?.type === 'gradient'"
-              class="grid grid-cols-2 gap-4"
-            >
-              <FormField
-                v-slot="{ componentField }"
-                name="config.home_screen.background.gradient_start"
-                keep-value
-              >
-                <FormItem>
-                  <FormLabel>{{ $t('globals.messages.gradientStart') }}</FormLabel>
-                  <FormControl>
-                    <Input type="color" v-bind="componentField" />
-                  </FormControl>
-                  <FormMessage />
-                </FormItem>
-              </FormField>
-              <FormField
-                v-slot="{ componentField }"
-                name="config.home_screen.background.gradient_end"
-                keep-value
-              >
-                <FormItem>
-                  <FormLabel>{{ $t('globals.messages.gradientEnd') }}</FormLabel>
-                  <FormControl>
-                    <Input type="color" v-bind="componentField" />
-                  </FormControl>
-                  <FormMessage />
-                </FormItem>
-              </FormField>
-            </div>
-
-            <FormField
-              v-if="form.values.config?.home_screen?.background?.type === 'image'"
-              v-slot="{ componentField }"
-              name="config.home_screen.background.image_url"
-              keep-value
-            >
-              <FormItem>
-                <FormLabel>{{ $t('globals.messages.backgroundImageUrl') }}</FormLabel>
-                <FormControl>
-                  <Input
-                    type="url"
-                    placeholder="https://example.com/background.jpg"
-                    v-bind="componentField"
-                  />
-                </FormControl>
-                <FormMessage />
-              </FormItem>
-            </FormField>
-
-            <FormField
-              v-slot="{ componentField, handleChange }"
-              name="config.home_screen.fade_background"
-            >
-              <FormItem>
-                <SwitchField
-                  :title="$t('admin.inbox.livechat.homeScreen.fadeBackground')"
-                  :description="$t('admin.inbox.livechat.homeScreen.fadeBackground.description')"
-                  :checked="componentField.modelValue"
-                  @update:checked="handleChange"
-                />
-              </FormItem>
-            </FormField>
-          </div>
-
-          <div class="space-y-4">
-            <h4 class="text-base font-semibold text-foreground">
-              {{ $t('globals.terms.homeScreenApp', 2) }}
-            </h4>
-
-            <FormField name="config.home_apps">
-              <FormItem>
-                <div class="space-y-3">
-                  <Draggable
-                    v-model="homeApps"
-                    item-key="index"
-                    :animation="200"
-                    handle=".drag-handle"
-                    class="space-y-3"
-                    @change="updateHomeApps"
-                  >
-                    <template #item="{ element: item, index }">
-                      <div class="flex items-start gap-2 p-3 border rounded-md">
-                        <div class="drag-handle cursor-move text-muted-foreground pt-2">
-                          <GripVertical class="w-4 h-4" />
+        <div v-show="activeTab === 'appearance'">
+          <Accordion type="single" collapsible v-model="activeSection" class="w-full">
+            <AccordionItem value="appearance" data-section="appearance">
+              <AccordionTrigger class="text-base">{{
+                $t('globals.terms.theme')
+              }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <FormField v-slot="{ componentField }" name="config.theme">
+                  <FormItem>
+                    <FormLabel>{{ $t('globals.terms.theme') }}</FormLabel>
+                    <FormControl>
+                      <RadioGroup v-bind="componentField" class="flex gap-4">
+                        <div class="flex items-center space-x-2">
+                          <RadioGroupItem id="theme-system" value="system" />
+                          <Label for="theme-system">{{ $t('globals.terms.matchSystem') }}</Label>
                         </div>
-                        <div class="flex-1">
-                          <div class="text-xs text-muted-foreground mb-2">
-                            {{ homeAppLabel(item.type) }}
-                          </div>
-                          <p v-if="item.type === 'help'" class="text-sm text-muted-foreground">
-                            {{ $t('widget.helpHomeAppHint') }}
-                          </p>
-                          <div v-else-if="item.type === 'announcement'" class="flex flex-col gap-2">
-                            <Input
-                              v-model="item.title"
-                              :placeholder="$t('globals.terms.title')"
-                              @change="updateHomeApps"
-                            />
-                            <Textarea
-                              v-model="item.description"
-                              :placeholder="$t('globals.terms.description')"
-                              rows="6"
-                              @change="updateHomeApps"
-                            />
-                            <div class="grid grid-cols-2 gap-2">
-                              <Input
-                                v-model="item.image_url"
-                                type="url"
-                                :placeholder="$t('globals.messages.coverImageUrl')"
-                                @change="updateHomeApps"
-                              />
-                              <Input
-                                v-model="item.url"
-                                type="url"
-                                :placeholder="$t('globals.messages.linkUrl')"
-                                @change="updateHomeApps"
-                              />
-                            </div>
-                          </div>
-                          <div
-                            v-else-if="item.type === 'external_link'"
-                            class="grid grid-cols-2 gap-2"
-                          >
-                            <Input
-                              v-model="item.text"
-                              :placeholder="$t('placeholders.linkText')"
-                              @change="updateHomeApps"
-                            />
-                            <Input
-                              v-model="item.url"
-                              placeholder="https://example.com"
-                              @change="updateHomeApps"
-                            />
-                          </div>
+                        <div class="flex items-center space-x-2">
+                          <RadioGroupItem id="theme-light" value="light" />
+                          <Label for="theme-light">{{ $t('globals.terms.light') }}</Label>
                         </div>
-                        <Button
-                          type="button"
-                          variant="ghost"
-                          size="sm"
-                          @click="removeHomeApp(index)"
+                        <div class="flex items-center space-x-2">
+                          <RadioGroupItem id="theme-dark" value="dark" />
+                          <Label for="theme-dark">{{ $t('globals.terms.dark') }}</Label>
+                        </div>
+                      </RadioGroup>
+                    </FormControl>
+                    <FormDescription>{{ $t('admin.inbox.livechat.theme.description') }}</FormDescription>
+                    <FormMessage />
+                  </FormItem>
+                </FormField>
+
+                <FormField v-slot="{ componentField, handleChange }" name="config.show_powered_by">
+                  <FormItem>
+                    <SwitchField
+                      :title="$t('admin.inbox.livechat.showPoweredBy')"
+                      :description="$t('admin.inbox.livechat.showPoweredBy.description')"
+                      :checked="componentField.modelValue"
+                      @update:checked="handleChange"
+                    />
+                  </FormItem>
+                </FormField>
+              </AccordionContent>
+            </AccordionItem>
+            <AccordionItem value="branding" data-section="branding">
+              <AccordionTrigger class="text-base">{{ $t('globals.terms.branding') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <div class="space-y-4">
+                  <Tabs :model-value="editingTheme" @update:model-value="editingTheme = $event">
+                    <TabsList class="w-full h-10">
+                      <TabsTrigger value="light" class="flex-1 gap-2 h-8">
+                        <Sun class="size-4" />
+                        {{ $t('globals.terms.light') }}
+                      </TabsTrigger>
+                      <TabsTrigger value="dark" class="flex-1 gap-2 h-8">
+                        <Moon class="size-4" />
+                        {{ $t('globals.terms.dark') }}
+                      </TabsTrigger>
+                    </TabsList>
+                  </Tabs>
+
+                  <FormField v-slot="{ componentField }" :name="`${brandingPath}.logo_url`" keep-value>
+                    <FormItem>
+                      <FormLabel>{{ $t('globals.terms.logoUrl') }}</FormLabel>
+                      <FormControl>
+                        <Input
+                          type="url"
+                          placeholder="https://example.com/logo.png"
+                          v-bind="componentField"
+                        />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  </FormField>
+
+                  <div class="grid grid-cols-2 gap-4">
+                    <FormField
+                      v-slot="{ componentField }"
+                      :name="`${brandingPath}.colors.primary`"
+                      keep-value
+                    >
+                      <FormItem>
+                        <FormLabel>{{ $t('globals.terms.primaryColor', 1) }}</FormLabel>
+                        <FormControl>
+                          <Input type="color" class="h-9 w-24 p-1" v-bind="componentField" />
+                        </FormControl>
+                        <FormMessage />
+                        <p
+                          v-if="lowPrimaryContrast"
+                          class="text-sm text-destructive flex items-start gap-1.5"
                         >
-                          <X class="w-4 h-4" />
-                        </Button>
-                      </div>
-                    </template>
-                  </Draggable>
-
-                  <div class="flex gap-2">
-                    <Button
-                      type="button"
-                      variant="outline"
-                      size="sm"
-                      @click="addHomeApp('announcement')"
-                    >
-                      <Plus class="w-4 h-4" />
-                      {{ $t('globals.messages.addAnnouncement') }}
-                    </Button>
-                    <Button
-                      type="button"
-                      variant="outline"
-                      size="sm"
-                      @click="addHomeApp('external_link')"
-                    >
-                      <Plus class="w-4 h-4" />
-                      {{ $t('globals.messages.addExternalLink') }}
-                    </Button>
-                    <Button
-                      type="button"
-                      variant="outline"
-                      size="sm"
-                      :disabled="!form.values.config.help?.help_center_id || hasHelpHomeApp"
-                      @click="addHomeApp('help')"
-                    >
-                      <Plus class="w-4 h-4" />
-                      {{ $t('widget.addHelpHomeApp') }}
-                    </Button>
+                          <TriangleAlert class="size-4 shrink-0 mt-0.5" />
+                          <span>{{ $t('admin.inbox.livechat.colors.primary.contrastWarning') }}</span>
+                        </p>
+                      </FormItem>
+                    </FormField>
                   </div>
-                  <p
-                    v-if="!form.values.config.help?.help_center_id"
-                    class="text-xs text-muted-foreground"
+
+                  <h5 class="text-sm font-semibold text-foreground pt-2">
+                    {{ $t('globals.terms.homeScreen') }}
+                  </h5>
+
+                  <FormField
+                    v-slot="{ componentField }"
+                    :name="`${brandingPath}.home_screen.header_text_color`"
+                    keep-value
                   >
-                    {{ $t('widget.helpHomeAppRequiresCenter') }}
+                    <FormItem>
+                      <FormLabel>{{ $t('globals.messages.headerTextColor') }}</FormLabel>
+                      <FormControl>
+                        <RadioGroup v-bind="componentField" class="flex gap-4">
+                          <div class="flex items-center space-x-2">
+                            <RadioGroupItem id="text-black" value="black" />
+                            <Label for="text-black">{{ $t('globals.terms.black') }}</Label>
+                          </div>
+                          <div class="flex items-center space-x-2">
+                            <RadioGroupItem id="text-white" value="white" />
+                            <Label for="text-white">{{ $t('globals.terms.white') }}</Label>
+                          </div>
+                        </RadioGroup>
+                      </FormControl>
+                      <FormDescription>{{
+                        $t('admin.inbox.livechat.homeScreen.headerTextColor.description')
+                      }}</FormDescription>
+                      <p
+                        v-if="lowHeaderContrast"
+                        class="text-sm text-destructive flex items-start gap-1.5"
+                      >
+                        <TriangleAlert class="size-4 shrink-0 mt-0.5" />
+                        <span>{{
+                          $t('admin.inbox.livechat.homeScreen.headerTextColor.contrastWarning')
+                        }}</span>
+                      </p>
+                    </FormItem>
+                  </FormField>
+
+                  <FormField
+                    v-slot="{ componentField }"
+                    :name="`${brandingPath}.home_screen.background.type`"
+                    keep-value
+                  >
+                    <FormItem>
+                      <FormLabel>{{ $t('globals.terms.background') }}</FormLabel>
+                      <FormControl>
+                        <RadioGroup
+                          v-bind="componentField"
+                          @update:model-value="onBackgroundTypeChange"
+                          class="flex gap-4"
+                        >
+                          <div class="flex items-center space-x-2">
+                            <RadioGroupItem id="bg-solid" value="solid" />
+                            <Label for="bg-solid">{{ $t('globals.terms.solid') }}</Label>
+                          </div>
+                          <div class="flex items-center space-x-2">
+                            <RadioGroupItem id="bg-gradient" value="gradient" />
+                            <Label for="bg-gradient">{{ $t('globals.terms.gradient') }}</Label>
+                          </div>
+                          <div class="flex items-center space-x-2">
+                            <RadioGroupItem id="bg-image" value="image" />
+                            <Label for="bg-image">{{ $t('globals.terms.image', 1) }}</Label>
+                          </div>
+                        </RadioGroup>
+                      </FormControl>
+                    </FormItem>
+                  </FormField>
+
+                  <div v-if="activeBackgroundType === 'solid'" class="grid grid-cols-2 gap-4">
+                    <FormField
+                      v-slot="{ componentField }"
+                      :name="`${brandingPath}.home_screen.background.color`"
+                      keep-value
+                    >
+                      <FormItem>
+                        <FormLabel>{{ $t('globals.messages.backgroundColor') }}</FormLabel>
+                        <FormControl>
+                          <Input type="color" class="h-9 w-24 p-1" v-bind="componentField" />
+                        </FormControl>
+                        <FormMessage />
+                      </FormItem>
+                    </FormField>
+                  </div>
+
+                  <div v-if="activeBackgroundType === 'gradient'" class="flex gap-8">
+                    <FormField
+                      v-slot="{ componentField }"
+                      :name="`${brandingPath}.home_screen.background.gradient_start`"
+                      keep-value
+                    >
+                      <FormItem>
+                        <FormLabel>{{ $t('globals.messages.gradientStart') }}</FormLabel>
+                        <FormControl>
+                          <Input type="color" class="h-9 w-24 p-1" v-bind="componentField" />
+                        </FormControl>
+                        <FormMessage />
+                      </FormItem>
+                    </FormField>
+                    <FormField
+                      v-slot="{ componentField }"
+                      :name="`${brandingPath}.home_screen.background.gradient_end`"
+                      keep-value
+                    >
+                      <FormItem>
+                        <FormLabel>{{ $t('globals.messages.gradientEnd') }}</FormLabel>
+                        <FormControl>
+                          <Input type="color" class="h-9 w-24 p-1" v-bind="componentField" />
+                        </FormControl>
+                        <FormMessage />
+                      </FormItem>
+                    </FormField>
+                  </div>
+
+                  <FormField
+                    v-if="activeBackgroundType === 'image'"
+                    v-slot="{ componentField }"
+                    :name="`${brandingPath}.home_screen.background.image_url`"
+                    keep-value
+                  >
+                    <FormItem>
+                      <FormLabel>{{ $t('globals.messages.backgroundImageUrl') }}</FormLabel>
+                      <FormControl>
+                        <Input
+                          type="url"
+                          placeholder="https://example.com/background.jpg"
+                          v-bind="componentField"
+                        />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  </FormField>
+
+                  <FormField
+                    v-slot="{ componentField, handleChange }"
+                    :name="`${brandingPath}.home_screen.fade_background`"
+                    keep-value
+                  >
+                    <FormItem>
+                      <SwitchField
+                        :title="$t('admin.inbox.livechat.homeScreen.fadeBackground')"
+                        :description="$t('admin.inbox.livechat.homeScreen.fadeBackground.description')"
+                        :checked="componentField.modelValue"
+                        @update:checked="handleChange"
+                      />
+                    </FormItem>
+                  </FormField>
+                </div>
+              </AccordionContent>
+            </AccordionItem>
+            <AccordionItem value="launcher" data-section="launcher">
+              <AccordionTrigger class="text-base">{{ $t('admin.inbox.livechat.launcher.layout') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <div class="space-y-4">
+                  <Tabs :model-value="editingTheme" @update:model-value="editingTheme = $event">
+                    <TabsList class="w-full h-10">
+                      <TabsTrigger value="light" class="flex-1 gap-2 h-8">
+                        <Sun class="size-4" />
+                        {{ $t('globals.terms.light') }}
+                      </TabsTrigger>
+                      <TabsTrigger value="dark" class="flex-1 gap-2 h-8">
+                        <Moon class="size-4" />
+                        {{ $t('globals.terms.dark') }}
+                      </TabsTrigger>
+                    </TabsList>
+                  </Tabs>
+
+                  <div class="grid grid-cols-2 gap-4">
+                    <FormField
+                      v-slot="{ componentField }"
+                      :name="`${brandingPath}.launcher.logo_url`"
+                      keep-value
+                    >
+                      <FormItem>
+                        <FormLabel>{{ $t('admin.inbox.livechat.launcher.logo') }}</FormLabel>
+                        <FormControl>
+                          <Input
+                            type="url"
+                            placeholder="https://example.com/launcher-logo.png"
+                            v-bind="componentField"
+                          />
+                        </FormControl>
+                        <FormMessage />
+                      </FormItem>
+                    </FormField>
+
+                    <FormField
+                      v-slot="{ componentField }"
+                      :name="`${brandingPath}.launcher.color`"
+                      keep-value
+                    >
+                      <FormItem>
+                        <FormLabel>{{ $t('admin.inbox.livechat.launcher.color') }}</FormLabel>
+                        <FormControl>
+                          <Input type="color" class="h-9 w-24 p-1" v-bind="componentField" />
+                        </FormControl>
+                        <FormMessage />
+                      </FormItem>
+                    </FormField>
+                  </div>
+
+                  <div class="grid grid-cols-2 gap-4">
+                    <FormField v-slot="{ componentField }" name="config.launcher.position">
+                      <FormItem>
+                        <FormLabel>{{ $t('admin.inbox.livechat.launcher.position') }}</FormLabel>
+                        <FormControl>
+                          <Select v-bind="componentField">
+                            <SelectTrigger>
+                              <SelectValue :placeholder="$t('placeholders.selectPosition')" />
+                            </SelectTrigger>
+                            <SelectContent>
+                              <SelectItem value="left">{{
+                                $t('admin.inbox.livechat.launcher.position.left')
+                              }}</SelectItem>
+                              <SelectItem value="right">{{
+                                $t('admin.inbox.livechat.launcher.position.right')
+                              }}</SelectItem>
+                            </SelectContent>
+                          </Select>
+                        </FormControl>
+                        <FormMessage />
+                      </FormItem>
+                    </FormField>
+
+                    <FormField v-slot="{ componentField }" name="config.launcher.size">
+                      <FormItem>
+                        <FormLabel>{{ $t('admin.inbox.livechat.launcher.size') }}</FormLabel>
+                        <FormControl>
+                          <Input
+                            type="number"
+                            placeholder="60"
+                            min="40"
+                            max="80"
+                            v-bind="componentField"
+                          />
+                        </FormControl>
+                        <FormMessage />
+                      </FormItem>
+                    </FormField>
+                  </div>
+
+                  <div class="grid grid-cols-3 gap-4">
+                    <FormField v-slot="{ componentField }" name="config.launcher.icon_scale">
+                      <FormItem>
+                        <FormLabel>{{ $t('admin.inbox.livechat.launcher.iconScale') }}</FormLabel>
+                        <FormControl>
+                          <Input
+                            type="number"
+                            placeholder="100"
+                            min="40"
+                            max="100"
+                            v-bind="componentField"
+                          />
+                        </FormControl>
+                        <FormDescription>{{
+                          $t('admin.inbox.livechat.launcher.iconScale.description')
+                        }}</FormDescription>
+                        <FormMessage />
+                      </FormItem>
+                    </FormField>
+
+                    <FormField v-slot="{ componentField }" name="config.launcher.spacing.side">
+                      <FormItem>
+                        <FormLabel>{{ $t('admin.inbox.livechat.launcher.spacing.side') }}</FormLabel>
+                        <FormControl>
+                          <Input
+                            type="number"
+                            placeholder="20"
+                            min="0"
+                            max="200"
+                            v-bind="componentField"
+                          />
+                        </FormControl>
+                        <FormDescription>{{
+                          $t('admin.inbox.livechat.launcher.spacing.side.description')
+                        }}</FormDescription>
+                        <FormMessage />
+                      </FormItem>
+                    </FormField>
+
+                    <FormField v-slot="{ componentField }" name="config.launcher.spacing.bottom">
+                      <FormItem>
+                        <FormLabel>{{ $t('admin.inbox.livechat.launcher.spacing.bottom') }}</FormLabel>
+                        <FormControl>
+                          <Input
+                            type="number"
+                            placeholder="20"
+                            min="0"
+                            max="200"
+                            v-bind="componentField"
+                          />
+                        </FormControl>
+                        <FormDescription>{{
+                          $t('admin.inbox.livechat.launcher.spacing.bottom.description')
+                        }}</FormDescription>
+                        <FormMessage />
+                      </FormItem>
+                    </FormField>
+                  </div>
+                </div>
+              </AccordionContent>
+            </AccordionItem>
+            <AccordionItem value="previews" data-section="previews">
+              <AccordionTrigger class="text-base">{{ $t('widget.replyPreviews') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <div class="space-y-4">
+                  <FormField
+                    v-for="device in ['desktop', 'mobile']"
+                    :key="device"
+                    v-slot="{ componentField, handleChange }"
+                    :name="`config.previews.${device}`"
+                  >
+                    <FormItem>
+                      <SwitchField
+                        :title="$t(`globals.terms.${device}`)"
+                        :checked="componentField.modelValue"
+                        @update:checked="handleChange"
+                      />
+                    </FormItem>
+                  </FormField>
+
+                  <div class="grid grid-cols-2 gap-4">
+                    <FormField v-slot="{ componentField }" name="config.previews.content">
+                      <FormItem>
+                        <FormLabel>{{ $t('widget.previewContent') }}</FormLabel>
+                        <Select v-bind="componentField">
+                          <SelectTrigger><SelectValue /></SelectTrigger>
+                          <SelectContent>
+                            <SelectItem value="message">{{
+                              $t('widget.messagePreview')
+                            }}</SelectItem>
+                            <SelectItem value="generic">{{
+                              $t('widget.genericNotice')
+                            }}</SelectItem>
+                          </SelectContent>
+                        </Select>
+                        <FormMessage />
+                      </FormItem>
+                    </FormField>
+
+                    <FormField
+                      v-slot="{ value, handleChange, meta }"
+                      name="config.previews.auto_hide_seconds"
+                    >
+                      <FormItem>
+                        <FormLabel>{{ $t('widget.autoHideSeconds') }}</FormLabel>
+                        <FormControl>
+                          <Input
+                            type="number"
+                            name="config.previews.auto_hide_seconds"
+                            min="0"
+                            max="300"
+                            :model-value="value"
+                            @update:model-value="
+                              (value) => handleChange(value === '' ? '' : Number(value), meta.validated)
+                            "
+                          />
+                        </FormControl>
+                        <FormMessage />
+                      </FormItem>
+                    </FormField>
+                  </div>
+                </div>
+              </AccordionContent>
+            </AccordionItem>
+          </Accordion>
+        </div>
+
+        <div v-show="activeTab === 'content'">
+          <Accordion type="single" collapsible v-model="activeSection" class="w-full">
+            <AccordionItem value="messages" data-section="messages">
+              <AccordionTrigger class="text-base">{{ $t('admin.inbox.livechat.tabs.messages') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <FormField v-slot="{ componentField }" name="config.greeting_message">
+                  <FormItem>
+                    <FormLabel>{{ $t('admin.inbox.livechat.greetingMessage') }}</FormLabel>
+                    <FormControl>
+                      <Textarea
+                        v-bind="componentField"
+                        :placeholder="$t('placeholders.greetingMessage')"
+                        rows="2"
+                      />
+                    </FormControl>
+                    <FormDescription>{{
+                      $t('admin.inbox.livechat.greetingMessage.variables')
+                    }}</FormDescription>
+                    <FormMessage />
+                  </FormItem>
+                </FormField>
+
+                <FormField v-slot="{ componentField }" name="config.introduction_message">
+                  <FormItem>
+                    <FormLabel>{{ $t('admin.inbox.livechat.introductionMessage') }}</FormLabel>
+                    <FormControl>
+                      <Textarea
+                        v-bind="componentField"
+                        :placeholder="$t('placeholders.introductionMessage')"
+                        rows="2"
+                      />
+                    </FormControl>
+                    <FormDescription>{{
+                      $t('admin.inbox.livechat.greetingMessage.variables')
+                    }}</FormDescription>
+                    <FormMessage />
+                  </FormItem>
+                </FormField>
+
+                <FormField v-slot="{ componentField }" name="config.chat_introduction">
+                  <FormItem>
+                    <FormLabel>{{ $t('admin.inbox.livechat.chatIntroduction') }}</FormLabel>
+                    <FormControl>
+                      <Textarea
+                        v-bind="componentField"
+                        :placeholder="$t('placeholders.chatIntroduction')"
+                        rows="2"
+                      />
+                    </FormControl>
+                    <FormMessage />
+                  </FormItem>
+                </FormField>
+              </AccordionContent>
+            </AccordionItem>
+            <AccordionItem value="noticeBanner" data-section="noticeBanner">
+              <AccordionTrigger class="text-base">{{ $t('admin.inbox.livechat.noticeBanner') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <div class="space-y-4">
+                  <FormField
+                    v-slot="{ componentField, handleChange }"
+                    name="config.notice_banner.enabled"
+                  >
+                    <FormItem>
+                      <SwitchField
+                        :title="$t('admin.inbox.livechat.noticeBanner.enabled')"
+                        :checked="componentField.modelValue"
+                        @update:checked="handleChange"
+                      />
+                    </FormItem>
+                  </FormField>
+
+                  <FormField
+                    v-slot="{ componentField }"
+                    name="config.notice_banner.text"
+                    v-if="form.values.config?.notice_banner?.enabled"
+                  >
+                    <FormItem>
+                      <FormLabel>{{ $t('admin.inbox.livechat.noticeBanner.text') }}</FormLabel>
+                      <FormControl>
+                        <Textarea
+                          v-bind="componentField"
+                          :placeholder="$t('placeholders.noticeBannerText')"
+                          rows="2"
+                        />
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  </FormField>
+                </div>
+              </AccordionContent>
+            </AccordionItem>
+            <AccordionItem value="homeApps" data-section="homeApps">
+              <AccordionTrigger class="text-base">{{ $t('globals.terms.homeScreenApp', 2) }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <div class="space-y-4">
+                  <FormField name="config.home_apps">
+                    <FormItem>
+                      <div class="space-y-3">
+                        <Draggable
+                          v-model="homeApps"
+                          item-key="index"
+                          :animation="200"
+                          handle=".drag-handle"
+                          :force-fallback="true"
+                          fallback-on-body
+                          :fallback-tolerance="3"
+                          ghost-class="drag-ghost"
+                          class="space-y-3"
+                          @change="updateHomeApps"
+                        >
+                          <template #item="{ element: item, index }">
+                            <div class="flex items-start gap-2 p-3 border rounded-md">
+                              <div class="drag-handle cursor-move text-muted-foreground pt-2">
+                                <GripVertical class="w-4 h-4" />
+                              </div>
+                              <div class="flex-1">
+                                <div class="text-xs text-muted-foreground mb-2">
+                                  {{ homeAppLabel(item.type) }}
+                                </div>
+                                <p v-if="item.type === 'help'" class="text-sm text-muted-foreground">
+                                  {{ $t('widget.helpHomeAppHint') }}
+                                </p>
+                                <div v-else-if="item.type === 'announcement'" class="flex flex-col gap-2">
+                                  <Input
+                                    v-model="item.title"
+                                    :placeholder="$t('globals.terms.title')"
+                                    @change="updateHomeApps"
+                                  />
+                                  <Textarea
+                                    v-model="item.description"
+                                    :placeholder="$t('globals.terms.description')"
+                                    rows="6"
+                                    @change="updateHomeApps"
+                                  />
+                                  <div class="grid grid-cols-2 gap-2">
+                                    <Input
+                                      v-model="item.image_url"
+                                      type="url"
+                                      :placeholder="$t('globals.messages.coverImageUrl')"
+                                      @change="updateHomeApps"
+                                    />
+                                    <Input
+                                      v-model="item.url"
+                                      type="url"
+                                      :placeholder="$t('globals.messages.linkUrl')"
+                                      @change="updateHomeApps"
+                                    />
+                                  </div>
+                                </div>
+                                <div
+                                  v-else-if="item.type === 'external_link'"
+                                  class="grid grid-cols-2 gap-2"
+                                >
+                                  <Input
+                                    v-model="item.text"
+                                    :placeholder="$t('placeholders.linkText')"
+                                    @change="updateHomeApps"
+                                  />
+                                  <Input
+                                    v-model="item.url"
+                                    placeholder="https://example.com"
+                                    @change="updateHomeApps"
+                                  />
+                                </div>
+                              </div>
+                              <Button
+                                type="button"
+                                variant="ghost"
+                                size="sm"
+                                :aria-label="$t('globals.terms.remove')"
+                                @click="removeHomeApp(index)"
+                              >
+                                <X class="w-4 h-4" aria-hidden="true" />
+                              </Button>
+                            </div>
+                          </template>
+                        </Draggable>
+
+                        <div class="flex gap-2">
+                          <Button
+                            type="button"
+                            variant="outline"
+                            size="sm"
+                            @click="addHomeApp('announcement')"
+                          >
+                            <Plus class="w-4 h-4" />
+                            {{ $t('globals.messages.addAnnouncement') }}
+                          </Button>
+                          <Button
+                            type="button"
+                            variant="outline"
+                            size="sm"
+                            @click="addHomeApp('external_link')"
+                          >
+                            <Plus class="w-4 h-4" />
+                            {{ $t('globals.messages.addExternalLink') }}
+                          </Button>
+                          <Button
+                            type="button"
+                            variant="outline"
+                            size="sm"
+                            :disabled="!form.values.config.help?.help_center_id || hasHelpHomeApp"
+                            @click="addHomeApp('help')"
+                          >
+                            <Plus class="w-4 h-4" />
+                            {{ $t('widget.addHelpHomeApp') }}
+                          </Button>
+                        </div>
+                        <p
+                          v-if="!form.values.config.help?.help_center_id"
+                          class="text-xs text-muted-foreground"
+                        >
+                          {{ $t('widget.helpHomeAppRequiresCenter') }}
+                        </p>
+                        <p
+                          v-if="showHomeAppsError && incompleteHomeApps"
+                          class="text-sm text-destructive flex items-start gap-1.5"
+                        >
+                          <TriangleAlert class="size-4 shrink-0 mt-0.5" />
+                          <span>{{ $t('admin.inbox.livechat.homeApps.incomplete') }}</span>
+                        </p>
+                      </div>
+                      <FormMessage />
+                    </FormItem>
+                  </FormField>
+                </div>
+              </AccordionContent>
+            </AccordionItem>
+            <AccordionItem value="help" data-section="help">
+              <AccordionTrigger class="text-base">{{ $t('globals.terms.helpCenter', 1) }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <WidgetHelpConfig
+                  :model-value="form.values.config.help"
+                  :centers="helpCenters"
+                  :articles="helpArticles"
+                  :failed="helpFailed"
+                  @update:model-value="form.setFieldValue('config.help', $event, false)"
+                />
+                <p
+                  v-if="Object.keys(form.errors.value).some((key) => key.startsWith('config.help'))"
+                  role="alert"
+                  class="text-sm text-destructive"
+                >
+                  {{ $t('validation.invalidValue') }}
+                </p>
+              </AccordionContent>
+            </AccordionItem>
+            <AccordionItem value="campaigns" data-section="campaigns">
+              <AccordionTrigger class="text-base">{{ $t('widget.proactiveMessages') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <WidgetCampaigns
+                  ref="campaignsRef"
+                  :model-value="form.values.config.campaigns || []"
+                  :inbox-id="initialValues.id || 0"
+                  :brand-name="form.values.config.brand_name || ''"
+                  :cooldown="form.values.config.campaign_cooldown_hours ?? 24"
+                  :show-errors="showCampaignErrors"
+                  @update:model-value="updateCampaigns"
+                  @update:cooldown="updateCampaignCooldown"
+                  @update:preview="previewCampaign = $event"
+                />
+              </AccordionContent>
+            </AccordionItem>
+          </Accordion>
+        </div>
+
+        <div v-show="activeTab === 'conversations'">
+          <Accordion type="single" collapsible v-model="activeSection" class="w-full">
+            <AccordionItem value="features" data-section="features">
+              <AccordionTrigger class="text-base">{{ $t('globals.terms.features') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <div class="space-y-4">
+                  <div class="space-y-3">
+                    <FormField
+                      v-slot="{ componentField, handleChange }"
+                      name="config.features.file_upload"
+                    >
+                      <FormItem>
+                        <SwitchField
+                          :title="$t('admin.inbox.livechat.features.fileUpload')"
+                          :description="$t('admin.inbox.livechat.features.fileUpload.description')"
+                          :checked="componentField.modelValue"
+                          @update:checked="handleChange"
+                        />
+                      </FormItem>
+                    </FormField>
+
+                    <FormField v-slot="{ componentField, handleChange }" name="config.features.emoji">
+                      <FormItem>
+                        <SwitchField
+                          :title="$t('admin.inbox.livechat.features.emoji')"
+                          :description="$t('admin.inbox.livechat.features.emoji.description')"
+                          :checked="componentField.modelValue"
+                          @update:checked="handleChange"
+                        />
+                      </FormItem>
+                    </FormField>
+
+                    <FormField
+                      v-slot="{ componentField, handleChange }"
+                      name="config.features.transcript"
+                    >
+                      <FormItem>
+                        <SwitchField
+                          :title="$t('conversation.downloadTranscript')"
+                          :checked="componentField.modelValue"
+                          @update:checked="handleChange"
+                        />
+                      </FormItem>
+                    </FormField>
+                  </div>
+                </div>
+              </AccordionContent>
+            </AccordionItem>
+            <AccordionItem value="officeHours" data-section="officeHours">
+              <AccordionTrigger class="text-base">{{ $t('admin.inbox.livechat.officeHours') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <div class="space-y-4">
+                  <FormField
+                    v-slot="{ componentField, handleChange }"
+                    name="config.show_office_hours_in_chat"
+                  >
+                    <FormItem>
+                      <SwitchField
+                        :title="$t('admin.inbox.livechat.showOfficeHoursInChat')"
+                        :description="$t('admin.inbox.livechat.showOfficeHoursInChat.description')"
+                        :checked="componentField.modelValue"
+                        @update:checked="handleChange"
+                      />
+                    </FormItem>
+                  </FormField>
+
+                  <FormField
+                    v-slot="{ componentField, handleChange }"
+                    name="config.show_office_hours_after_assignment"
+                  >
+                    <FormItem>
+                      <SwitchField
+                        :title="$t('admin.inbox.livechat.showOfficeHoursAfterAssignment')"
+                        :description="
+                          $t('admin.inbox.livechat.showOfficeHoursAfterAssignment.description')
+                        "
+                        :checked="componentField.modelValue"
+                        :disabled="!form.values.config.show_office_hours_in_chat"
+                        @update:checked="handleChange"
+                      />
+                    </FormItem>
+                  </FormField>
+
+                  <FormField
+                    v-if="form.values.config.show_office_hours_in_chat"
+                    v-slot="{ componentField }"
+                    name="config.chat_reply_expectation_message"
+                  >
+                    <FormItem>
+                      <FormLabel>{{ $t('admin.inbox.livechat.chatReplyExpectationMessage') }}</FormLabel>
+                      <FormControl>
+                        <Input type="text" v-bind="componentField" />
+                      </FormControl>
+                      <FormDescription>
+                        {{ $t('admin.inbox.livechat.chatReplyExpectationMessage.description') }}
+                      </FormDescription>
+                      <FormMessage />
+                    </FormItem>
+                  </FormField>
+                </div>
+              </AccordionContent>
+            </AccordionItem>
+            <AccordionItem value="prechat" data-section="prechat">
+              <AccordionTrigger class="text-base">{{ $t('admin.inbox.livechat.tabs.prechat') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <PreChatFormConfig v-model="prechatConfig" />
+              </AccordionContent>
+            </AccordionItem>
+            <AccordionItem value="users" data-section="users">
+              <AccordionTrigger class="text-base">{{ $t('globals.terms.users') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <Tabs :model-value="selectedUserTab" @update:model-value="selectedUserTab = $event">
+                  <TabsList class="grid w-full grid-cols-2">
+                    <TabsTrigger value="visitors">
+                      {{ $t('admin.inbox.livechat.userSettings.visitors') }}
+                    </TabsTrigger>
+                    <TabsTrigger value="users">
+                      {{ $t('globals.terms.users') }}
+                    </TabsTrigger>
+                  </TabsList>
+
+                  <div class="space-y-4 mt-4">
+                    <div v-show="selectedUserTab === 'visitors'" data-audience="visitors" class="space-y-4">
+                      <FormField
+                        v-slot="{ componentField }"
+                        name="config.visitors.start_conversation_button_text"
+                      >
+                        <FormItem>
+                          <FormLabel>{{
+                            $t('admin.inbox.livechat.startConversationButtonText')
+                          }}</FormLabel>
+                          <FormControl>
+                            <Input
+                              v-bind="componentField"
+                              :placeholder="$t('placeholders.startConversation')"
+                            />
+                          </FormControl>
+                          <FormMessage />
+                        </FormItem>
+                      </FormField>
+
+                      <FormField v-slot="{ componentField }" name="config.visitors.quick_replies">
+                        <FormItem>
+                          <FormLabel>{{ $t('admin.inbox.livechat.quickReplies') }}</FormLabel>
+                          <FormControl>
+                            <Textarea
+                              v-bind="componentField"
+                              :placeholder="$t('admin.inbox.livechat.quickReplies.placeholder')"
+                              rows="6"
+                            />
+                          </FormControl>
+                          <FormDescription>{{
+                            $t('admin.inbox.livechat.quickReplies.description')
+                          }}</FormDescription>
+                          <FormMessage />
+                        </FormItem>
+                      </FormField>
+
+                      <FormField
+                        v-slot="{ componentField, handleChange }"
+                        name="config.visitors.direct_to_conversation"
+                      >
+                        <FormItem>
+                          <SwitchField
+                            :title="$t('admin.inbox.livechat.directToConversation')"
+                            :description="$t('admin.inbox.livechat.directToConversation.description')"
+                            :checked="componentField.modelValue"
+                            @update:checked="handleChange"
+                          />
+                        </FormItem>
+                      </FormField>
+
+                      <FormField
+                        v-slot="{ componentField, handleChange }"
+                        name="config.visitors.allow_start_conversation"
+                      >
+                        <FormItem>
+                          <SwitchField
+                            :title="$t('admin.inbox.livechat.allowStartConversation')"
+                            :description="
+                              $t('admin.inbox.livechat.allowStartConversation.visitors.description')
+                            "
+                            :checked="componentField.modelValue"
+                            @update:checked="handleChange"
+                          />
+                        </FormItem>
+                      </FormField>
+
+                      <FormField
+                        v-slot="{ componentField, handleChange }"
+                        name="config.visitors.prevent_multiple_conversations"
+                      >
+                        <FormItem>
+                          <SwitchField
+                            :title="$t('admin.inbox.livechat.preventMultipleConversations')"
+                            :description="
+                              $t('admin.inbox.livechat.preventMultipleConversations.visitors.description')
+                            "
+                            :checked="componentField.modelValue"
+                            @update:checked="handleChange"
+                          />
+                        </FormItem>
+                      </FormField>
+
+                      <FormField
+                        v-slot="{ componentField, handleChange }"
+                        name="config.visitors.prevent_reply_to_closed_conversation"
+                      >
+                        <FormItem>
+                          <SwitchField
+                            :title="$t('admin.inbox.livechat.preventReplyToClosedConversation')"
+                            :description="
+                              $t('admin.inbox.livechat.preventReplyToClosedConversation.description')
+                            "
+                            :checked="componentField.modelValue"
+                            @update:checked="handleChange"
+                          />
+                        </FormItem>
+                      </FormField>
+                    </div>
+
+                    <div v-show="selectedUserTab === 'users'" data-audience="users" class="space-y-4">
+                      <FormField
+                        v-slot="{ componentField }"
+                        name="config.users.start_conversation_button_text"
+                      >
+                        <FormItem>
+                          <FormLabel>{{
+                            $t('admin.inbox.livechat.startConversationButtonText')
+                          }}</FormLabel>
+                          <FormControl>
+                            <Input
+                              v-bind="componentField"
+                              :placeholder="$t('placeholders.startConversation')"
+                            />
+                          </FormControl>
+                          <FormMessage />
+                        </FormItem>
+                      </FormField>
+
+                      <FormField v-slot="{ componentField }" name="config.users.quick_replies">
+                        <FormItem>
+                          <FormLabel>{{ $t('admin.inbox.livechat.quickReplies') }}</FormLabel>
+                          <FormControl>
+                            <Textarea
+                              v-bind="componentField"
+                              :placeholder="$t('admin.inbox.livechat.quickReplies.placeholder')"
+                              rows="6"
+                            />
+                          </FormControl>
+                          <FormDescription>{{
+                            $t('admin.inbox.livechat.quickReplies.description')
+                          }}</FormDescription>
+                          <FormMessage />
+                        </FormItem>
+                      </FormField>
+
+                      <FormField
+                        v-slot="{ componentField, handleChange }"
+                        name="config.users.direct_to_conversation"
+                      >
+                        <FormItem>
+                          <SwitchField
+                            :title="$t('admin.inbox.livechat.directToConversation')"
+                            :description="$t('admin.inbox.livechat.directToConversation.description')"
+                            :checked="componentField.modelValue"
+                            @update:checked="handleChange"
+                          />
+                        </FormItem>
+                      </FormField>
+
+                      <FormField
+                        v-slot="{ componentField, handleChange }"
+                        name="config.users.allow_start_conversation"
+                      >
+                        <FormItem>
+                          <SwitchField
+                            :title="$t('admin.inbox.livechat.allowStartConversation')"
+                            :description="
+                              $t('admin.inbox.livechat.allowStartConversation.users.description')
+                            "
+                            :checked="componentField.modelValue"
+                            @update:checked="handleChange"
+                          />
+                        </FormItem>
+                      </FormField>
+
+                      <FormField
+                        v-slot="{ componentField, handleChange }"
+                        name="config.users.prevent_multiple_conversations"
+                      >
+                        <FormItem>
+                          <SwitchField
+                            :title="$t('admin.inbox.livechat.preventMultipleConversations')"
+                            :description="
+                              $t('admin.inbox.livechat.preventMultipleConversations.users.description')
+                            "
+                            :checked="componentField.modelValue"
+                            @update:checked="handleChange"
+                          />
+                        </FormItem>
+                      </FormField>
+
+                      <FormField
+                        v-slot="{ componentField, handleChange }"
+                        name="config.users.prevent_reply_to_closed_conversation"
+                      >
+                        <FormItem>
+                          <SwitchField
+                            :title="$t('admin.inbox.livechat.preventReplyToClosedConversation')"
+                            :description="
+                              $t('admin.inbox.livechat.preventReplyToClosedConversation.description')
+                            "
+                            :checked="componentField.modelValue"
+                            @update:checked="handleChange"
+                          />
+                        </FormItem>
+                      </FormField>
+                    </div>
+                  </div>
+                </Tabs>
+              </AccordionContent>
+            </AccordionItem>
+          </Accordion>
+        </div>
+
+        <div v-show="activeTab === 'setup'">
+          <Accordion type="single" collapsible v-model="activeSection" class="w-full">
+            <AccordionItem value="installation" data-section="installation">
+              <AccordionTrigger class="text-base">{{ $t('admin.inbox.livechat.tabs.installation') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <div class="space-y-4">
+                  <ol class="text-sm space-y-2 list-decimal list-inside text-muted-foreground">
+                    <li>{{ $t('admin.inbox.livechat.installation.instructions.step1') }}</li>
+                    <li>{{ $t('admin.inbox.livechat.installation.instructions.step2') }}</li>
+                  </ol>
+                </div>
+
+                <div class="relative">
+                  <CodeEditor :modelValue="integrationSnippet" language="html" :readOnly="true" />
+                  <CopyButton :text="integrationSnippet" class="absolute top-3 right-3" />
+                </div>
+              </AccordionContent>
+            </AccordionItem>
+            <AccordionItem value="identity" data-section="identity">
+              <AccordionTrigger class="text-base">{{ $t('admin.inbox.livechat.installation.identity.title') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <div class="space-y-4">
+                  <div class="space-y-1">
+                    <p class="text-sm text-muted-foreground">
+                      {{ $t('admin.inbox.livechat.installation.identity.description') }}
+                    </p>
+                    <p class="text-sm text-muted-foreground">
+                      {{ $t('admin.inbox.livechat.installation.identity.howItWorks') }}
+                    </p>
+                  </div>
+
+                  <div class="relative">
+                    <CodeEditor :modelValue="jwtPayloadExample" language="javascript" :readOnly="true" />
+                    <CopyButton :text="jwtPayloadExample" class="absolute top-3 right-3" />
+                  </div>
+
+                  <p class="text-sm text-muted-foreground">
+                    {{ $t('admin.inbox.livechat.installation.identity.addJwt') }}
                   </p>
-                  <p
-                    v-if="showHomeAppsError && incompleteHomeApps"
-                    class="text-sm text-destructive flex items-start gap-1.5"
-                  >
-                    <TriangleAlert class="size-4 shrink-0 mt-0.5" />
-                    <span>{{ $t('admin.inbox.livechat.homeApps.incomplete') }}</span>
+
+                  <div class="relative">
+                    <CodeEditor
+                      :modelValue="authenticatedIntegrationSnippet"
+                      language="html"
+                      :readOnly="true"
+                    />
+                    <CopyButton :text="authenticatedIntegrationSnippet" class="absolute top-3 right-3" />
+                  </div>
+
+                  <p class="text-sm text-destructive flex items-center gap-1.5">
+                    <TriangleAlert class="size-4 shrink-0" />
+                    {{ $t('admin.inbox.livechat.installation.identity.secretWarning') }}
                   </p>
                 </div>
-                <FormMessage />
-              </FormItem>
-            </FormField>
-          </div>
+              </AccordionContent>
+            </AccordionItem>
+            <AccordionItem value="jsApi" data-section="jsApi">
+              <AccordionTrigger class="text-base">{{ $t('admin.inbox.livechat.installation.jsApi.title') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <div class="space-y-4">
+                  <p class="text-sm text-muted-foreground">
+                    {{ $t('admin.inbox.livechat.installation.jsApi.description') }}
+                  </p>
 
-          <!-- Launcher Configuration -->
-          <div class="space-y-4">
-            <h4 class="text-base font-semibold text-foreground">
-              {{ $t('admin.inbox.livechat.launcher') }}
-            </h4>
+                  <div class="relative">
+                    <CodeEditor :modelValue="jsApiSnippet" language="javascript" :readOnly="true" />
+                    <CopyButton :text="jsApiSnippet" class="absolute top-3 right-3" />
+                  </div>
+                </div>
+              </AccordionContent>
+            </AccordionItem>
+            <AccordionItem value="security" data-section="security">
+              <AccordionTrigger class="text-base">{{ $t('globals.terms.security') }}</AccordionTrigger>
+              <AccordionContent force-mount class="space-y-8 pt-2">
+                <div class="grid grid-cols-2 gap-6">
+                  <FormField v-slot="{ componentField }" name="secret">
+                    <FormItem>
+                      <FormLabel>{{ $t('admin.inbox.livechat.secretKey') }}</FormLabel>
+                      <FormControl>
+                        <Input type="password" v-bind="componentField" />
+                      </FormControl>
+                      <FormDescription>{{
+                        $t('admin.inbox.livechat.secretKey.description')
+                      }}</FormDescription>
+                      <FormMessage />
+                      <p
+                        v-if="weakSecret"
+                        class="!mt-2 text-muted-foreground text-xs flex items-start gap-1.5"
+                      >
+                        <TriangleAlert class="size-4 shrink-0 mt-0.5" />
+                        <span>{{ $t('admin.inbox.livechat.secretKey.weak') }}</span>
+                      </p>
+                    </FormItem>
+                  </FormField>
 
-            <div class="grid grid-cols-2 gap-4">
-              <FormField v-slot="{ componentField }" name="config.launcher.position">
-                <FormItem>
-                  <FormLabel>{{ $t('admin.inbox.livechat.launcher.position') }}</FormLabel>
-                  <FormControl>
-                    <Select v-bind="componentField">
-                      <SelectTrigger>
-                        <SelectValue :placeholder="$t('placeholders.selectPosition')" />
-                      </SelectTrigger>
-                      <SelectContent>
-                        <SelectItem value="left">{{
-                          $t('admin.inbox.livechat.launcher.position.left')
-                        }}</SelectItem>
-                        <SelectItem value="right">{{
-                          $t('admin.inbox.livechat.launcher.position.right')
-                        }}</SelectItem>
-                      </SelectContent>
-                    </Select>
-                  </FormControl>
-                  <FormMessage />
-                </FormItem>
-              </FormField>
+                  <FormField v-slot="{ componentField }" name="config.session_duration">
+                    <FormItem>
+                      <FormLabel>{{ $t('admin.inbox.livechat.sessionDuration.label') }}</FormLabel>
+                      <FormControl>
+                        <Input type="text" placeholder="10h" v-bind="componentField" />
+                      </FormControl>
+                      <FormDescription>{{
+                        $t('admin.inbox.livechat.sessionDuration.description')
+                      }}</FormDescription>
+                      <FormMessage />
+                    </FormItem>
+                  </FormField>
+                </div>
 
-              <FormField v-slot="{ componentField }" name="config.launcher.logo_url">
-                <FormItem>
-                  <FormLabel>{{ $t('admin.inbox.livechat.launcher.logo') }}</FormLabel>
-                  <FormControl>
-                    <Input
-                      type="url"
-                      placeholder="https://example.com/launcher-logo.png"
-                      v-bind="componentField"
-                    />
-                  </FormControl>
-                  <FormMessage />
-                </FormItem>
-              </FormField>
-            </div>
+                <div class="grid grid-cols-2 gap-6">
+                  <FormField v-slot="{ componentField }" name="config.trusted_domains">
+                    <FormItem>
+                      <FormLabel>{{ $t('admin.inbox.livechat.trustedDomains.list') }}</FormLabel>
+                      <FormControl>
+                        <Textarea
+                          v-bind="componentField"
+                          placeholder="example.com&#10;*.example.com&#10;another-domain.com"
+                          rows="4"
+                        />
+                      </FormControl>
+                      <FormDescription>{{
+                        $t('admin.inbox.livechat.trustedDomains.description')
+                      }}</FormDescription>
+                      <FormMessage />
+                    </FormItem>
+                  </FormField>
 
-            <div class="grid grid-cols-2 gap-4">
-              <FormField v-slot="{ componentField }" name="config.launcher.color">
-                <FormItem>
-                  <FormLabel>{{ $t('admin.inbox.livechat.launcher.color') }}</FormLabel>
-                  <FormControl>
-                    <Input type="color" v-bind="componentField" />
-                  </FormControl>
-                  <FormMessage />
-                </FormItem>
-              </FormField>
-            </div>
-
-            <div class="grid grid-cols-2 gap-4">
-              <FormField v-slot="{ componentField }" name="config.launcher.spacing.side">
-                <FormItem>
-                  <FormLabel>{{ $t('admin.inbox.livechat.launcher.spacing.side') }}</FormLabel>
-                  <FormControl>
-                    <Input
-                      type="number"
-                      placeholder="20"
-                      min="0"
-                      max="200"
-                      v-bind="componentField"
-                    />
-                  </FormControl>
-                  <FormDescription>{{
-                    $t('admin.inbox.livechat.launcher.spacing.side.description')
-                  }}</FormDescription>
-                  <FormMessage />
-                </FormItem>
-              </FormField>
-
-              <FormField v-slot="{ componentField }" name="config.launcher.spacing.bottom">
-                <FormItem>
-                  <FormLabel>{{ $t('admin.inbox.livechat.launcher.spacing.bottom') }}</FormLabel>
-                  <FormControl>
-                    <Input
-                      type="number"
-                      placeholder="20"
-                      min="0"
-                      max="200"
-                      v-bind="componentField"
-                    />
-                  </FormControl>
-                  <FormDescription>{{
-                    $t('admin.inbox.livechat.launcher.spacing.bottom.description')
-                  }}</FormDescription>
-                  <FormMessage />
-                </FormItem>
-              </FormField>
-            </div>
-          </div>
-        </div>
-
-        <!-- Messages Tab -->
-        <div v-show="activeTab === 'messages'" class="space-y-8">
-          <FormField v-slot="{ componentField }" name="config.greeting_message">
-            <FormItem>
-              <FormLabel>{{ $t('admin.inbox.livechat.greetingMessage') }}</FormLabel>
-              <FormControl>
-                <Textarea
-                  v-bind="componentField"
-                  :placeholder="$t('placeholders.greetingMessage')"
-                  rows="2"
-                />
-              </FormControl>
-              <FormDescription>{{
-                $t('admin.inbox.livechat.greetingMessage.variables')
-              }}</FormDescription>
-              <FormMessage />
-            </FormItem>
-          </FormField>
-
-          <FormField v-slot="{ componentField }" name="config.introduction_message">
-            <FormItem>
-              <FormLabel>{{ $t('admin.inbox.livechat.introductionMessage') }}</FormLabel>
-              <FormControl>
-                <Textarea
-                  v-bind="componentField"
-                  :placeholder="$t('placeholders.introductionMessage')"
-                  rows="2"
-                />
-              </FormControl>
-              <FormDescription>{{
-                $t('admin.inbox.livechat.greetingMessage.variables')
-              }}</FormDescription>
-              <FormMessage />
-            </FormItem>
-          </FormField>
-
-          <FormField v-slot="{ componentField }" name="config.chat_introduction">
-            <FormItem>
-              <FormLabel>{{ $t('admin.inbox.livechat.chatIntroduction') }}</FormLabel>
-              <FormControl>
-                <Textarea
-                  v-bind="componentField"
-                  :placeholder="$t('placeholders.chatIntroduction')"
-                  rows="2"
-                />
-              </FormControl>
-              <FormMessage />
-            </FormItem>
-          </FormField>
-
-          <!-- Notice Banner -->
-          <div class="space-y-4">
-            <h4 class="text-base font-semibold text-foreground">
-              {{ $t('admin.inbox.livechat.noticeBanner') }}
-            </h4>
-
-            <FormField
-              v-slot="{ componentField, handleChange }"
-              name="config.notice_banner.enabled"
-            >
-              <FormItem>
-                <SwitchField
-                  :title="$t('admin.inbox.livechat.noticeBanner.enabled')"
-                  :checked="componentField.modelValue"
-                  @update:checked="handleChange"
-                />
-              </FormItem>
-            </FormField>
-
-            <FormField
-              v-slot="{ componentField }"
-              name="config.notice_banner.text"
-              v-if="form.values.config?.notice_banner?.enabled"
-            >
-              <FormItem>
-                <FormLabel>{{ $t('admin.inbox.livechat.noticeBanner.text') }}</FormLabel>
-                <FormControl>
-                  <Textarea
-                    v-bind="componentField"
-                    :placeholder="$t('placeholders.noticeBannerText')"
-                    rows="2"
-                  />
-                </FormControl>
-                <FormMessage />
-              </FormItem>
-            </FormField>
-          </div>
-        </div>
-
-        <!-- Features Tab -->
-        <div v-show="activeTab === 'features'" class="space-y-8">
-          <!-- Office Hours -->
-          <div class="space-y-4">
-            <h4 class="text-base font-semibold text-foreground">
-              {{ $t('admin.inbox.livechat.officeHours') }}
-            </h4>
-
-            <FormField
-              v-slot="{ componentField, handleChange }"
-              name="config.show_office_hours_in_chat"
-            >
-              <FormItem>
-                <SwitchField
-                  :title="$t('admin.inbox.livechat.showOfficeHoursInChat')"
-                  :description="$t('admin.inbox.livechat.showOfficeHoursInChat.description')"
-                  :checked="componentField.modelValue"
-                  @update:checked="handleChange"
-                />
-              </FormItem>
-            </FormField>
-
-            <FormField
-              v-slot="{ componentField, handleChange }"
-              name="config.show_office_hours_after_assignment"
-            >
-              <FormItem>
-                <SwitchField
-                  :title="$t('admin.inbox.livechat.showOfficeHoursAfterAssignment')"
-                  :description="
-                    $t('admin.inbox.livechat.showOfficeHoursAfterAssignment.description')
-                  "
-                  :checked="componentField.modelValue"
-                  :disabled="!form.values.config.show_office_hours_in_chat"
-                  @update:checked="handleChange"
-                />
-              </FormItem>
-            </FormField>
-
-            <FormField
-              v-if="form.values.config.show_office_hours_in_chat"
-              v-slot="{ componentField }"
-              name="config.chat_reply_expectation_message"
-            >
-              <FormItem>
-                <FormLabel>{{ $t('admin.inbox.livechat.chatReplyExpectationMessage') }}</FormLabel>
-                <FormControl>
-                  <Input type="text" v-bind="componentField" />
-                </FormControl>
-                <FormDescription>
-                  {{ $t('admin.inbox.livechat.chatReplyExpectationMessage.description') }}
-                </FormDescription>
-                <FormMessage />
-              </FormItem>
-            </FormField>
-          </div>
-
-          <!-- Chat Features -->
-          <div class="space-y-4">
-            <h4 class="text-base font-semibold">{{ $t('widget.replyPreviews') }}</h4>
-            <FormField
-              v-for="device in ['desktop', 'mobile']"
-              :key="device"
-              v-slot="{ componentField, handleChange }"
-              :name="`config.previews.${device}`"
-            >
-              <FormItem
-                ><SwitchField
-                  :title="$t(`globals.terms.${device}`)"
-                  :checked="componentField.modelValue"
-                  @update:checked="handleChange"
-              /></FormItem>
-            </FormField>
-            <FormField v-slot="{ componentField }" name="config.previews.content">
-              <FormItem
-                ><FormLabel>{{ $t('widget.previewContent') }}</FormLabel
-                ><Select v-bind="componentField"
-                  ><SelectTrigger><SelectValue /></SelectTrigger
-                  ><SelectContent
-                    ><SelectItem value="message">{{ $t('widget.messagePreview') }}</SelectItem
-                    ><SelectItem value="generic">{{
-                      $t('widget.genericNotice')
-                    }}</SelectItem></SelectContent
-                  ></Select
-                ><FormMessage
-              /></FormItem>
-            </FormField>
-            <FormField
-              v-slot="{ value, handleChange, meta }"
-              name="config.previews.auto_hide_seconds"
-            >
-              <FormItem
-                ><FormLabel>{{ $t('widget.autoHideSeconds') }}</FormLabel
-                ><FormControl
-                  ><Input
-                    type="number"
-                    min="0"
-                    max="300"
-                    :model-value="value"
-                    @update:model-value="
-                      (value) => handleChange(Number(value), meta.validated)
-                    " /></FormControl
-                ><FormMessage
-              /></FormItem>
-            </FormField>
-          </div>
-          <div class="space-y-4">
-            <h4 class="text-base font-semibold text-foreground">
-              {{ $t('globals.terms.features') }}
-            </h4>
-
-            <div class="space-y-3">
-              <FormField
-                v-slot="{ componentField, handleChange }"
-                name="config.features.file_upload"
-              >
-                <FormItem>
-                  <SwitchField
-                    :title="$t('admin.inbox.livechat.features.fileUpload')"
-                    :description="$t('admin.inbox.livechat.features.fileUpload.description')"
-                    :checked="componentField.modelValue"
-                    @update:checked="handleChange"
-                  />
-                </FormItem>
-              </FormField>
-
-              <FormField v-slot="{ componentField, handleChange }" name="config.features.emoji">
-                <FormItem>
-                  <SwitchField
-                    :title="$t('admin.inbox.livechat.features.emoji')"
-                    :description="$t('admin.inbox.livechat.features.emoji.description')"
-                    :checked="componentField.modelValue"
-                    @update:checked="handleChange"
-                  />
-                </FormItem>
-              </FormField>
-
-              <FormField
-                v-slot="{ componentField, handleChange }"
-                name="config.features.transcript"
-              >
-                <FormItem>
-                  <SwitchField
-                    :title="$t('conversation.downloadTranscript')"
-                    :checked="componentField.modelValue"
-                    @update:checked="handleChange"
-                  />
-                </FormItem>
-              </FormField>
-            </div>
-          </div>
-        </div>
-
-        <!-- Proactive messages Tab -->
-        <div v-show="activeTab === 'campaigns'" class="space-y-3">
-          <WidgetCampaigns
-            ref="campaignsRef"
-            :model-value="form.values.config.campaigns || []"
-            :inbox-id="initialValues.id || 0"
-            :brand-name="form.values.config.brand_name || ''"
-            :cooldown="form.values.config.campaign_cooldown_hours ?? 24"
-            :show-errors="showCampaignErrors"
-            @update:model-value="updateCampaigns"
-            @update:cooldown="updateCampaignCooldown"
-            @update:preview="previewCampaign = $event"
-          />
-        </div>
-
-        <!-- Help Tab -->
-        <div v-show="activeTab === 'help'" class="space-y-3">
-          <WidgetHelpConfig
-            :model-value="form.values.config.help"
-            :centers="helpCenters"
-            :articles="helpArticles"
-            :failed="helpFailed"
-            @update:model-value="form.setFieldValue('config.help', $event, false)"
-          />
-          <p
-            v-if="Object.keys(form.errors.value).some((key) => key.startsWith('config.help'))"
-            role="alert"
-            class="text-sm text-destructive"
-          >
-            {{ $t('validation.invalidValue') }}
-          </p>
-        </div>
-
-        <!-- Security Tab -->
-        <div v-show="activeTab === 'security'" class="space-y-8">
-          <div class="grid grid-cols-2 gap-6">
-            <FormField v-slot="{ componentField }" name="secret">
-              <FormItem>
-                <FormLabel>{{ $t('admin.inbox.livechat.secretKey') }}</FormLabel>
-                <FormControl>
-                  <Input type="password" v-bind="componentField" />
-                </FormControl>
-                <FormDescription>{{
-                  $t('admin.inbox.livechat.secretKey.description')
-                }}</FormDescription>
-                <FormMessage />
-                <p
-                  v-if="weakSecret"
-                  class="!mt-2 text-muted-foreground text-xs flex items-start gap-1.5"
-                >
-                  <TriangleAlert class="size-4 shrink-0 mt-0.5" />
-                  <span>{{ $t('admin.inbox.livechat.secretKey.weak') }}</span>
-                </p>
-              </FormItem>
-            </FormField>
-
-            <FormField v-slot="{ componentField }" name="config.session_duration">
-              <FormItem>
-                <FormLabel>{{ $t('admin.inbox.livechat.sessionDuration.label') }}</FormLabel>
-                <FormControl>
-                  <Input type="text" placeholder="10h" v-bind="componentField" />
-                </FormControl>
-                <FormDescription>{{
-                  $t('admin.inbox.livechat.sessionDuration.description')
-                }}</FormDescription>
-                <FormMessage />
-              </FormItem>
-            </FormField>
-          </div>
-
-          <div class="grid grid-cols-2 gap-6">
-            <FormField v-slot="{ componentField }" name="config.trusted_domains">
-              <FormItem>
-                <FormLabel>{{ $t('admin.inbox.livechat.trustedDomains.list') }}</FormLabel>
-                <FormControl>
-                  <Textarea
-                    v-bind="componentField"
-                    placeholder="example.com&#10;*.example.com&#10;another-domain.com"
-                    rows="4"
-                  />
-                </FormControl>
-                <FormDescription>{{
-                  $t('admin.inbox.livechat.trustedDomains.description')
-                }}</FormDescription>
-                <FormMessage />
-              </FormItem>
-            </FormField>
-
-            <FormField v-slot="{ componentField }" name="config.blocked_ips">
-              <FormItem>
-                <FormLabel>{{ $t('admin.inbox.livechat.blockedIPs.list') }}</FormLabel>
-                <FormControl>
-                  <Textarea
-                    v-bind="componentField"
-                    placeholder="192.168.1.0/24&#10;10.0.0.1&#10;2001:db8::/32"
-                    rows="4"
-                  />
-                </FormControl>
-                <FormDescription>{{
-                  $t('admin.inbox.livechat.blockedIPs.description')
-                }}</FormDescription>
-                <FormMessage />
-              </FormItem>
-            </FormField>
-          </div>
-        </div>
-
-        <!-- Pre-Chat Form Tab -->
-        <div v-show="activeTab === 'prechat'" class="space-y-8">
-          <PreChatFormConfig v-model="prechatConfig" />
-        </div>
-
-        <!-- Users Tab -->
-        <div v-show="activeTab === 'users'" class="space-y-8">
-          <Tabs :model-value="selectedUserTab" @update:model-value="selectedUserTab = $event">
-            <TabsList class="grid w-full grid-cols-2">
-              <TabsTrigger value="visitors">
-                {{ $t('admin.inbox.livechat.userSettings.visitors') }}
-              </TabsTrigger>
-              <TabsTrigger value="users">
-                {{ $t('globals.terms.users') }}
-              </TabsTrigger>
-            </TabsList>
-
-            <div class="space-y-4 mt-4">
-              <!-- Visitors Settings -->
-              <div v-show="selectedUserTab === 'visitors'" class="space-y-4">
-                <FormField
-                  v-slot="{ componentField }"
-                  name="config.visitors.start_conversation_button_text"
-                >
-                  <FormItem>
-                    <FormLabel>{{
-                      $t('admin.inbox.livechat.startConversationButtonText')
-                    }}</FormLabel>
-                    <FormControl>
-                      <Input
-                        v-bind="componentField"
-                        :placeholder="$t('placeholders.startConversation')"
-                      />
-                    </FormControl>
-                    <FormMessage />
-                  </FormItem>
-                </FormField>
-
-                <FormField v-slot="{ componentField }" name="config.visitors.quick_replies">
-                  <FormItem>
-                    <FormLabel>{{ $t('admin.inbox.livechat.quickReplies') }}</FormLabel>
-                    <FormControl>
-                      <Textarea
-                        v-bind="componentField"
-                        :placeholder="$t('admin.inbox.livechat.quickReplies.placeholder')"
-                        rows="3"
-                      />
-                    </FormControl>
-                    <FormDescription>{{
-                      $t('admin.inbox.livechat.quickReplies.description')
-                    }}</FormDescription>
-                    <FormMessage />
-                  </FormItem>
-                </FormField>
-
-                <FormField
-                  v-slot="{ componentField, handleChange }"
-                  name="config.visitors.direct_to_conversation"
-                >
-                  <FormItem>
-                    <SwitchField
-                      :title="$t('admin.inbox.livechat.directToConversation')"
-                      :description="$t('admin.inbox.livechat.directToConversation.description')"
-                      :checked="componentField.modelValue"
-                      @update:checked="handleChange"
-                    />
-                  </FormItem>
-                </FormField>
-
-                <FormField
-                  v-slot="{ componentField, handleChange }"
-                  name="config.visitors.allow_start_conversation"
-                >
-                  <FormItem>
-                    <SwitchField
-                      :title="$t('admin.inbox.livechat.allowStartConversation')"
-                      :description="
-                        $t('admin.inbox.livechat.allowStartConversation.visitors.description')
-                      "
-                      :checked="componentField.modelValue"
-                      @update:checked="handleChange"
-                    />
-                  </FormItem>
-                </FormField>
-
-                <FormField
-                  v-slot="{ componentField, handleChange }"
-                  name="config.visitors.prevent_multiple_conversations"
-                >
-                  <FormItem>
-                    <SwitchField
-                      :title="$t('admin.inbox.livechat.preventMultipleConversations')"
-                      :description="
-                        $t('admin.inbox.livechat.preventMultipleConversations.visitors.description')
-                      "
-                      :checked="componentField.modelValue"
-                      @update:checked="handleChange"
-                    />
-                  </FormItem>
-                </FormField>
-
-                <FormField
-                  v-slot="{ componentField, handleChange }"
-                  name="config.visitors.prevent_reply_to_closed_conversation"
-                >
-                  <FormItem>
-                    <SwitchField
-                      :title="$t('admin.inbox.livechat.preventReplyToClosedConversation')"
-                      :description="
-                        $t('admin.inbox.livechat.preventReplyToClosedConversation.description')
-                      "
-                      :checked="componentField.modelValue"
-                      @update:checked="handleChange"
-                    />
-                  </FormItem>
-                </FormField>
-              </div>
-
-              <!-- Users Settings -->
-              <div v-show="selectedUserTab === 'users'" class="space-y-4">
-                <FormField
-                  v-slot="{ componentField }"
-                  name="config.users.start_conversation_button_text"
-                >
-                  <FormItem>
-                    <FormLabel>{{
-                      $t('admin.inbox.livechat.startConversationButtonText')
-                    }}</FormLabel>
-                    <FormControl>
-                      <Input
-                        v-bind="componentField"
-                        :placeholder="$t('placeholders.startConversation')"
-                      />
-                    </FormControl>
-                    <FormMessage />
-                  </FormItem>
-                </FormField>
-
-                <FormField v-slot="{ componentField }" name="config.users.quick_replies">
-                  <FormItem>
-                    <FormLabel>{{ $t('admin.inbox.livechat.quickReplies') }}</FormLabel>
-                    <FormControl>
-                      <Textarea
-                        v-bind="componentField"
-                        :placeholder="$t('admin.inbox.livechat.quickReplies.placeholder')"
-                        rows="3"
-                      />
-                    </FormControl>
-                    <FormDescription>{{
-                      $t('admin.inbox.livechat.quickReplies.description')
-                    }}</FormDescription>
-                    <FormMessage />
-                  </FormItem>
-                </FormField>
-
-                <FormField
-                  v-slot="{ componentField, handleChange }"
-                  name="config.users.direct_to_conversation"
-                >
-                  <FormItem>
-                    <SwitchField
-                      :title="$t('admin.inbox.livechat.directToConversation')"
-                      :description="$t('admin.inbox.livechat.directToConversation.description')"
-                      :checked="componentField.modelValue"
-                      @update:checked="handleChange"
-                    />
-                  </FormItem>
-                </FormField>
-
-                <FormField
-                  v-slot="{ componentField, handleChange }"
-                  name="config.users.allow_start_conversation"
-                >
-                  <FormItem>
-                    <SwitchField
-                      :title="$t('admin.inbox.livechat.allowStartConversation')"
-                      :description="
-                        $t('admin.inbox.livechat.allowStartConversation.users.description')
-                      "
-                      :checked="componentField.modelValue"
-                      @update:checked="handleChange"
-                    />
-                  </FormItem>
-                </FormField>
-
-                <FormField
-                  v-slot="{ componentField, handleChange }"
-                  name="config.users.prevent_multiple_conversations"
-                >
-                  <FormItem>
-                    <SwitchField
-                      :title="$t('admin.inbox.livechat.preventMultipleConversations')"
-                      :description="
-                        $t('admin.inbox.livechat.preventMultipleConversations.users.description')
-                      "
-                      :checked="componentField.modelValue"
-                      @update:checked="handleChange"
-                    />
-                  </FormItem>
-                </FormField>
-
-                <FormField
-                  v-slot="{ componentField, handleChange }"
-                  name="config.users.prevent_reply_to_closed_conversation"
-                >
-                  <FormItem>
-                    <SwitchField
-                      :title="$t('admin.inbox.livechat.preventReplyToClosedConversation')"
-                      :description="
-                        $t('admin.inbox.livechat.preventReplyToClosedConversation.description')
-                      "
-                      :checked="componentField.modelValue"
-                      @update:checked="handleChange"
-                    />
-                  </FormItem>
-                </FormField>
-              </div>
-            </div>
-          </Tabs>
-        </div>
-
-        <!-- Installation Tab -->
-        <div v-show="activeTab === 'installation'" class="space-y-8">
-          <div class="space-y-4">
-            <h4 class="text-base font-semibold text-foreground">
-              {{ $t('admin.inbox.livechat.installation.instructions.title') }}
-            </h4>
-            <ol class="text-sm space-y-2 list-decimal list-inside text-muted-foreground">
-              <li>{{ $t('admin.inbox.livechat.installation.instructions.step1') }}</li>
-              <li>{{ $t('admin.inbox.livechat.installation.instructions.step2') }}</li>
-            </ol>
-          </div>
-
-          <!-- Basic Installation -->
-          <div class="relative">
-            <CodeEditor :modelValue="integrationSnippet" language="html" :readOnly="true" />
-            <CopyButton :text="integrationSnippet" class="absolute top-3 right-3" />
-          </div>
-
-          <!-- Identity Verification Section -->
-          <div class="space-y-4 pt-4">
-            <h4 class="text-base font-semibold text-foreground">
-              {{ $t('admin.inbox.livechat.installation.identity.title') }}
-            </h4>
-
-            <div class="space-y-1">
-              <p class="text-sm text-muted-foreground">
-                {{ $t('admin.inbox.livechat.installation.identity.description') }}
-              </p>
-              <p class="text-sm text-muted-foreground">
-                {{ $t('admin.inbox.livechat.installation.identity.howItWorks') }}
-              </p>
-            </div>
-
-            <div class="relative">
-              <CodeEditor :modelValue="jwtPayloadExample" language="javascript" :readOnly="true" />
-              <CopyButton :text="jwtPayloadExample" class="absolute top-3 right-3" />
-            </div>
-
-            <p class="text-sm text-muted-foreground">
-              {{ $t('admin.inbox.livechat.installation.identity.addJwt') }}
-            </p>
-
-            <div class="relative">
-              <CodeEditor
-                :modelValue="authenticatedIntegrationSnippet"
-                language="html"
-                :readOnly="true"
-              />
-              <CopyButton :text="authenticatedIntegrationSnippet" class="absolute top-3 right-3" />
-            </div>
-
-            <p class="text-sm text-destructive flex items-center gap-1.5">
-              <TriangleAlert class="size-4 shrink-0" />
-              {{ $t('admin.inbox.livechat.installation.identity.secretWarning') }}
-            </p>
-          </div>
-
-          <!-- JavaScript API Section -->
-          <div class="space-y-4 pt-4">
-            <h4 class="text-base font-semibold text-foreground">
-              {{ $t('admin.inbox.livechat.installation.jsApi.title') }}
-            </h4>
-
-            <p class="text-sm text-muted-foreground">
-              {{ $t('admin.inbox.livechat.installation.jsApi.description') }}
-            </p>
-
-            <div class="relative">
-              <CodeEditor :modelValue="jsApiSnippet" language="javascript" :readOnly="true" />
-              <CopyButton :text="jsApiSnippet" class="absolute top-3 right-3" />
-            </div>
-          </div>
+                  <FormField v-slot="{ componentField }" name="config.blocked_ips">
+                    <FormItem>
+                      <FormLabel>{{ $t('admin.inbox.livechat.blockedIPs.list') }}</FormLabel>
+                      <FormControl>
+                        <Textarea
+                          v-bind="componentField"
+                          placeholder="192.168.1.0/24&#10;10.0.0.1&#10;2001:db8::/32"
+                          rows="4"
+                        />
+                      </FormControl>
+                      <FormDescription>{{
+                        $t('admin.inbox.livechat.blockedIPs.description')
+                      }}</FormDescription>
+                      <FormMessage />
+                    </FormItem>
+                  </FormField>
+                </div>
+              </AccordionContent>
+            </AccordionItem>
+          </Accordion>
         </div>
       </div>
     </Tabs>
@@ -1355,9 +1477,15 @@ import {
   SelectValue
 } from '@shared-ui/components/ui/select'
 import { Tabs, TabsList, TabsTrigger } from '@shared-ui/components/ui/tabs'
+import {
+  Accordion,
+  AccordionContent,
+  AccordionItem,
+  AccordionTrigger
+} from '@shared-ui/components/ui/accordion'
 import { RadioGroup, RadioGroupItem } from '@shared-ui/components/ui/radio-group'
 import { Label } from '@shared-ui/components/ui/label'
-import { Plus, X, TriangleAlert, GripVertical, Lightbulb } from 'lucide-vue-next'
+import { Plus, X, TriangleAlert, GripVertical, Lightbulb, Sun, Moon } from 'lucide-vue-next'
 import Draggable from 'vuedraggable'
 import { useI18n } from 'vue-i18n'
 import { useRoute, useRouter } from 'vue-router'
@@ -1377,38 +1505,61 @@ const HEX_COLOR = /^#([0-9a-f]{6}|[0-9a-f]{3})$/i
 const WIDGET_BG = { light: '#ffffff', dark: '#1a1a1e' }
 const DEFAULT_GRADIENT_START = '#2563eb'
 const DEFAULT_GRADIENT_END = '#1e40af'
+const DEFAULT_LAUNCHER_SIZE = 60
+const DEFAULT_LAUNCHER_ICON_SCALE = 100
 const MASKED_SECRET = '••••••••••'
 
-const TABS = [
-  'general',
-  'appearance',
-  'messages',
-  'features',
-  'campaigns',
-  'help',
-  'prechat',
-  'users',
-  'security',
-  'installation'
-]
+const TABS = ['general', 'appearance', 'content', 'conversations', 'setup']
+
+const SECTION_TAB = {
+  basics: 'general',
+  continuity: 'general',
+  appearance: 'appearance',
+  branding: 'appearance',
+  launcher: 'appearance',
+  previews: 'appearance',
+  messages: 'content',
+  noticeBanner: 'content',
+  homeApps: 'content',
+  help: 'content',
+  campaigns: 'content',
+  features: 'conversations',
+  officeHours: 'conversations',
+  prechat: 'conversations',
+  users: 'conversations',
+  installation: 'setup',
+  identity: 'setup',
+  jsApi: 'setup',
+  security: 'setup'
+}
+
+const LEGACY_TAB_SECTION = {
+  appearance: 'branding',
+  messages: 'messages',
+  features: 'features',
+  campaigns: 'campaigns',
+  help: 'help',
+  prechat: 'prechat',
+  users: 'users',
+  security: 'security',
+  installation: 'installation'
+}
 
-// Maps a field path prefix to its tab, so a failed submit jumps to the tab holding the error.
 // Ordered: specific prefixes before the general-tab fallbacks.
-const FIELD_TAB = [
+const FIELD_SECTION = [
   ['config.help', 'help'],
-  ['config.previews', 'features'],
+  ['config.previews', 'previews'],
   ['config.campaign', 'campaigns'],
-  ['config.home_screen', 'appearance'],
-  ['config.colors', 'appearance'],
-  ['config.launcher', 'appearance'],
-  ['config.home_apps', 'appearance'],
-  ['config.logo_url', 'appearance'],
-  ['config.notice_banner', 'messages'],
+  ['config.branding', 'branding'],
+  ['config.theme', 'appearance'],
+  ['config.launcher', 'launcher'],
+  ['config.home_apps', 'homeApps'],
+  ['config.notice_banner', 'noticeBanner'],
   ['config.greeting_message', 'messages'],
   ['config.introduction_message', 'messages'],
   ['config.chat_introduction', 'messages'],
   ['config.quick_replies', 'messages'],
-  ['config.chat_reply_expectation_message', 'features'],
+  ['config.chat_reply_expectation_message', 'officeHours'],
   ['config.features', 'features'],
   ['config.prechat_form', 'prechat'],
   ['config.visitors', 'users'],
@@ -1417,11 +1568,11 @@ const FIELD_TAB = [
   ['config.trusted_domains', 'security'],
   ['config.blocked_ips', 'security'],
   ['secret', 'security'],
-  ['config.continuity', 'general'],
-  ['config.brand_name', 'general'],
-  ['config.website_url', 'general'],
-  ['config.language', 'general'],
-  ['name', 'general']
+  ['config.continuity', 'continuity'],
+  ['config.brand_name', 'basics'],
+  ['config.website_url', 'basics'],
+  ['config.language', 'basics'],
+  ['name', 'basics']
 ]
 
 const props = defineProps({
@@ -1454,8 +1605,17 @@ const props = defineProps({
 const { t } = useI18n()
 const route = useRoute()
 const router = useRouter()
-const activeTab = ref(TABS.includes(route.query.tab) ? route.query.tab : 'general')
+const legacySection = LEGACY_TAB_SECTION[route.query.tab]
+const activeTab = ref(
+  TABS.includes(route.query.tab) ? route.query.tab : SECTION_TAB[legacySection] || 'general'
+)
+const activeSection = ref(legacySection || '')
 watch(activeTab, (tab) => router.replace({ query: { ...route.query, tab } }))
+
+const openSection = (section) => {
+  activeTab.value = SECTION_TAB[section]
+  activeSection.value = section
+}
 const selectedUserTab = ref('visitors')
 const homeApps = ref([])
 const prechatConfig = ref({
@@ -1539,6 +1699,26 @@ window.Libredesk.onHide(function() {});
 window.Libredesk.onUnreadCountChange(function(count) {});`
 })
 
+function defaultBranding(theme) {
+  const isDark = theme === 'dark'
+  return {
+    colors: { primary: '#2563eb' },
+    logo_url: '',
+    launcher: { logo_url: '', color: '#000000' },
+    home_screen: {
+      header_text_color: isDark ? 'white' : 'black',
+      background: {
+        type: 'solid',
+        color: isDark ? WIDGET_BG.dark : WIDGET_BG.light,
+        gradient_start: DEFAULT_GRADIENT_START,
+        gradient_end: DEFAULT_GRADIENT_END,
+        image_url: ''
+      },
+      fade_background: false
+    }
+  }
+}
+
 const form = useForm({
   validationSchema: toTypedSchema(createFormSchema(t)),
   initialValues: {
@@ -1555,15 +1735,18 @@ const form = useForm({
       campaign_cooldown_hours: 24,
       brand_name: '',
       website_url: '',
-      dark_mode: false,
+      theme: 'light',
       show_powered_by: true,
       language: 'en-US',
       fallback_language: 'en-US',
-      logo_url: '',
+      branding: {
+        light: defaultBranding('light'),
+        dark: defaultBranding('dark')
+      },
       launcher: {
         position: 'right',
-        logo_url: '',
-        color: '#000000',
+        size: DEFAULT_LAUNCHER_SIZE,
+        icon_scale: DEFAULT_LAUNCHER_ICON_SCALE,
         spacing: {
           side: 20,
           bottom: 20
@@ -1580,20 +1763,6 @@ const form = useForm({
         enabled: false,
         text: 'Our response times are slower than usual. We regret the inconvenience caused.'
       },
-      colors: {
-        primary: '#2563eb'
-      },
-      home_screen: {
-        header_text_color: 'black',
-        background: {
-          type: 'solid',
-          color: '#ffffff',
-          gradient_start: DEFAULT_GRADIENT_START,
-          gradient_end: DEFAULT_GRADIENT_END,
-          image_url: ''
-        },
-        fade_background: false
-      },
       features: {
         transcript: props.isNewForm,
         file_upload: true,
@@ -1652,12 +1821,30 @@ const submitLabel = computed(() => {
   )
 })
 
+const theme = computed(() => form.values.config?.theme || 'light')
+const editingTheme = ref('light')
+const brandingPath = computed(() => `config.branding.${editingTheme.value}`)
+const activeBranding = computed(() => form.values.config?.branding?.[editingTheme.value])
+const activeBackgroundType = computed(() => activeBranding.value?.home_screen?.background?.type)
+
+// A forced theme renders one branding half, so that is the half to edit.
+watch(
+  theme,
+  (value) => {
+    editingTheme.value = value === 'dark' ? 'dark' : 'light'
+    if (value !== 'light' && !form.values.config?.branding?.dark) {
+      form.setFieldValue('config.branding.dark', defaultBranding('dark'), false)
+    }
+  },
+  { immediate: true }
+)
+
 const lowHeaderContrast = computed(() => {
-  const hs = form.values.config?.home_screen
+  const hs = activeBranding.value?.home_screen
   if (!hs?.background) return false
 
   const textColor = hs.header_text_color === 'black' ? '#000000' : '#ffffff'
-  const pageBg = form.values.config?.dark_mode ? WIDGET_BG.dark : WIDGET_BG.light
+  const pageBg = WIDGET_BG[editingTheme.value]
   // An empty/unset color renders the widget's page background, so measure against that.
   const isLow = (bg) => HEX_COLOR.test(bg) && contrastRatio(textColor, bg) < MIN_CONTRAST
 
@@ -1674,10 +1861,9 @@ const lowHeaderContrast = computed(() => {
 // Primary is used as a fill (buttons, message bubbles, badges) over the widget background,
 // so warn if it blends into the background of the configured light/dark mode.
 const lowPrimaryContrast = computed(() => {
-  const primary = form.values.config?.colors?.primary
+  const primary = activeBranding.value?.colors?.primary
   if (!HEX_COLOR.test(primary)) return false
-  const pageBg = form.values.config?.dark_mode ? WIDGET_BG.dark : WIDGET_BG.light
-  return contrastRatio(primary, pageBg) < MIN_CONTRAST
+  return contrastRatio(primary, WIDGET_BG[editingTheme.value]) < MIN_CONTRAST
 })
 
 // Advisory only: a short secret weakens HS256 JWT signing. Not enforced, since a hard
@@ -1708,13 +1894,20 @@ const updateCampaignCooldown = (hours) =>
   form.setFieldValue('config.campaign_cooldown_hours', hours, hasCampaignErrors.value)
 
 // home_apps in form.values only syncs on change events, so pull the live ref for the preview.
-const previewConfig = computed(() => ({
-  ...form.values.config,
-  home_apps: homeApps.value,
-  help_tree: helpTree.value,
-  help_articles: helpArticles.value,
-  preview_campaign: activeTab.value === 'campaigns' ? previewCampaign.value : null
-}))
+const previewTheme = inject('livechatPreviewTheme', ref('light'))
+const previewConfig = computed(() => {
+  const branding = form.values.config?.branding?.[previewTheme.value] || {}
+  return {
+    ...form.values.config,
+    ...branding,
+    dark: previewTheme.value === 'dark',
+    launcher: { ...form.values.config?.launcher, ...branding.launcher },
+    home_apps: homeApps.value,
+    help_tree: helpTree.value,
+    help_articles: helpArticles.value,
+    preview_campaign: activeSection.value === 'campaigns' ? previewCampaign.value : null
+  }
+})
 
 // InboxView renders the preview in the help rail; feed it this form's live config while mounted.
 const livechatPreview = inject('livechatPreview', null)
@@ -1733,12 +1926,18 @@ onBeforeUnmount(() => {
 // so seed sensible defaults while retaining any colors already chosen.
 const onBackgroundTypeChange = (type) => {
   if (type !== 'gradient') return
-  const bg = form.values.config?.home_screen?.background || {}
+  const bg = activeBranding.value?.home_screen?.background || {}
   if (!bg.gradient_start) {
-    form.setFieldValue('config.home_screen.background.gradient_start', DEFAULT_GRADIENT_START)
+    form.setFieldValue(
+      `${brandingPath.value}.home_screen.background.gradient_start`,
+      DEFAULT_GRADIENT_START
+    )
   }
   if (!bg.gradient_end) {
-    form.setFieldValue('config.home_screen.background.gradient_end', DEFAULT_GRADIENT_END)
+    form.setFieldValue(
+      `${brandingPath.value}.home_screen.background.gradient_end`,
+      DEFAULT_GRADIENT_END
+    )
   }
 }
 
@@ -1828,7 +2027,7 @@ const onSubmit = form.handleSubmit(
     // Reject partially filled rows to avoid silently discarding typed values.
     if (incompleteHomeApps.value) {
       showHomeAppsError.value = true
-      activeTab.value = 'appearance'
+      openSection('homeApps')
       emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
         variant: 'destructive',
         description: t('admin.inbox.livechat.homeApps.incomplete')
@@ -1862,8 +2061,13 @@ const onSubmit = form.handleSubmit(
   ({ errors }) => {
     const firstKey = Object.keys(errors)[0]
     if (!firstKey) return
-    const match = FIELD_TAB.find(([prefix]) => firstKey === prefix || firstKey.startsWith(prefix))
-    if (match) activeTab.value = match[1]
+    if (firstKey.startsWith('config.branding.')) {
+      editingTheme.value = firstKey.split('.')[2] === 'dark' ? 'dark' : 'light'
+    }
+    const match = FIELD_SECTION.find(
+      ([prefix]) => firstKey === prefix || firstKey.startsWith(prefix)
+    )
+    if (match) openSection(match[1])
     if (firstKey.startsWith('config.campaign')) {
       showCampaignErrors.value = true
       nextTick(() => campaignsRef.value?.showInvalidField(firstKey))
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
index 91411d59..2ef20aa8 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
@@ -1,5 +1,7 @@
 <template>
-  <div class="relative w-full h-[750px] rounded-xl border border-border bg-muted overflow-hidden">
+  <div
+    class="relative w-full h-[calc(100vh-13rem)] min-h-[620px] max-h-[880px] rounded-xl border border-border bg-muted overflow-hidden"
+  >
     <!-- Widget window, themed independently of the admin app. -->
     <transition name="ld-preview-window">
       <div
@@ -213,107 +215,114 @@
                   class="pointer-events-none absolute inset-x-0 top-0"
                   :style="[headerStyle, { height: `${headerHeight}px` }]"
                 >
-                  <div v-if="showFade" class="absolute inset-x-0 bottom-0 h-20" :style="fadeStyle"></div>
+                  <div
+                    v-if="showFade"
+                    class="absolute inset-x-0 bottom-0 h-20"
+                    :style="fadeStyle"
+                  ></div>
                 </div>
                 <div class="relative h-full overflow-y-auto">
-                <div ref="headerRef">
-                  <div class="px-7 pb-7 pt-7">
-                    <img
-                      v-if="config.logo_url"
-                      :src="config.logo_url"
-                      :alt="config.brand_name"
-                      class="max-h-7 max-w-full"
-                    />
-                    <div class="mt-20" :class="textColorClass">
-                      <h2
-                        class="text-3xl font-semibold leading-tight tracking-tight break-words"
-                        :class="subTextColorClass"
+                  <div ref="headerRef">
+                    <div class="px-7 pb-7 pt-7">
+                      <img
+                        v-if="config.logo_url"
+                        :src="config.logo_url"
+                        :alt="config.brand_name"
+                        class="max-h-7 max-w-full"
+                      />
+                      <div class="mt-20" :class="textColorClass">
+                        <h2
+                          class="text-3xl font-semibold leading-tight tracking-tight break-words"
+                          :class="subTextColorClass"
+                        >
+                          {{ parsedGreeting }}
+                        </h2>
+                        <p
+                          class="mt-2 text-3xl font-semibold leading-tight tracking-tight break-words"
+                        >
+                          {{ parsedIntroduction }}
+                        </p>
+                      </div>
+                    </div>
+                    <div v-if="canStartConversation" class="relative z-10 px-4 pb-5">
+                      <Button
+                        type="button"
+                        size="lg"
+                        class="w-full font-semibold shadow-md"
+                        @click="startNew"
                       >
-                        {{ parsedGreeting }}
-                      </h2>
-                      <p class="mt-2 text-3xl font-semibold leading-tight tracking-tight break-words">
-                        {{ parsedIntroduction }}
-                      </p>
+                        {{ startButtonText }}
+                        <ArrowRight :size="16" aria-hidden="true" />
+                      </Button>
                     </div>
                   </div>
-                  <div v-if="canStartConversation" class="relative z-10 px-4 pb-5">
-                    <Button
-                      type="button"
-                      size="lg"
-                      class="w-full font-semibold shadow-md"
-                      @click="startNew"
-                    >
-                      {{ startButtonText }}
-                      <ArrowRight :size="16" aria-hidden="true" />
-                    </Button>
-                  </div>
-                </div>
 
-                <div v-if="homeItems.length" class="flex flex-col gap-3 px-4 pt-1 pb-5">
-                  <template v-for="(item, index) in homeItems" :key="index">
-                    <section
-                      v-if="item.type === 'help'"
-                      class="space-y-1 rounded-xl border border-border/80 bg-card p-2 shadow-sm"
-                    >
-                      <Button
-                        type="button"
-                        variant="outline"
-                        class="h-10 w-full justify-between px-2"
-                        @click="view = 'help'"
+                  <div v-if="homeItems.length" class="flex flex-col gap-3 px-4 pt-1 pb-5">
+                    <template v-for="(item, index) in homeItems" :key="index">
+                      <section
+                        v-if="item.type === 'help'"
+                        class="space-y-1 rounded-xl border border-border/80 bg-card p-2 shadow-sm"
                       >
-                        {{ $t('widget.searchArticles') }}
-                        <Search class="size-4" aria-hidden="true" />
-                      </Button>
-                      <Button
-                        v-for="article in featuredArticles"
-                        :key="article.id"
-                        type="button"
-                        variant="ghost"
-                        class="w-full h-auto justify-start px-2 py-1.5 text-left whitespace-normal"
-                        @click="view = 'help'"
+                        <Button
+                          type="button"
+                          variant="outline"
+                          class="h-10 w-full justify-between px-2"
+                          @click="view = 'help'"
+                        >
+                          {{ $t('widget.searchArticles') }}
+                          <Search class="size-4" aria-hidden="true" />
+                        </Button>
+                        <Button
+                          v-for="article in featuredArticles"
+                          :key="article.id"
+                          type="button"
+                          variant="ghost"
+                          class="w-full h-auto justify-start px-2 py-1.5 text-left whitespace-normal"
+                          @click="view = 'help'"
+                        >
+                          {{ article.title }}
+                        </Button>
+                      </section>
+                      <Card
+                        v-else-if="item.type === 'announcement'"
+                        class="overflow-hidden rounded-xl border-border/80 shadow-sm transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
                       >
-                        {{ article.title }}
-                      </Button>
-                    </section>
-                    <Card
-                      v-else-if="item.type === 'announcement'"
-                      class="overflow-hidden rounded-xl border-border/80 shadow-sm transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
-                    >
-                      <img
-                        v-if="item.image_url"
-                        :src="item.image_url"
-                        :alt="item.title"
-                        class="w-full h-auto"
-                      />
-                      <CardContent class="p-4 text-sm">
-                        <div class="font-semibold leading-snug">
-                          {{ item.title || $t('globals.terms.announcement') }}
-                        </div>
-                        <div
-                          v-if="item.description"
-                          class="mt-1 text-muted-foreground leading-relaxed"
-                        >
-                          {{ item.description }}
-                        </div>
-                      </CardContent>
-                    </Card>
-                    <Card
-                      v-else
-                      class="rounded-xl border-border/80 shadow-sm transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
-                    >
-                      <CardContent class="flex items-center gap-3 p-4">
-                        <span class="min-w-0 flex-1 text-sm font-medium leading-snug text-foreground"
-                          >{{ item.text || item.url }}</span
-                        >
-                        <ExternalLink
-                          :size="15"
-                          class="shrink-0 text-muted-foreground"
-                          aria-hidden="true"
+                        <img
+                          v-if="item.image_url"
+                          :src="item.image_url"
+                          :alt="item.title"
+                          class="w-full h-auto"
                         />
-                      </CardContent>
-                    </Card>
-                  </template>
-                </div>
+                        <CardContent class="p-4 text-sm">
+                          <div class="font-semibold leading-snug">
+                            {{ item.title || $t('globals.terms.announcement') }}
+                          </div>
+                          <div
+                            v-if="item.description"
+                            class="mt-1 text-muted-foreground leading-relaxed"
+                          >
+                            {{ item.description }}
+                          </div>
+                        </CardContent>
+                      </Card>
+                      <Card
+                        v-else
+                        class="rounded-xl border-border/80 shadow-sm transition-[background-color,box-shadow] can-hover:hover:bg-accent can-hover:hover:shadow-md"
+                      >
+                        <CardContent class="flex items-center gap-3 p-4">
+                          <span
+                            class="min-w-0 flex-1 text-sm font-medium leading-snug text-foreground"
+                            >{{ item.text || item.url }}</span
+                          >
+                          <ExternalLink
+                            :size="15"
+                            class="shrink-0 text-muted-foreground"
+                            aria-hidden="true"
+                          />
+                        </CardContent>
+                      </Card>
+                    </template>
+                  </div>
                 </div>
               </div>
 
@@ -475,7 +484,13 @@
         :style="{ color: launcherIconColor }"
         aria-hidden="true"
       />
-      <img v-else :src="launcherLogo" alt="" class="w-full h-full rounded-full object-cover" />
+      <img
+        v-else
+        :src="launcherLogo"
+        alt=""
+        :class="launcherIconFull ? 'rounded-full object-cover' : 'object-contain'"
+        :style="launcherIconStyle"
+      />
     </button>
   </div>
 </template>
@@ -518,7 +533,11 @@ import { renderTemplate } from '@shared-ui/utils/string'
 
 const DEFAULT_LAUNCHER_LOGO = '/static/public/launcher-logo.png'
 const HEX_COLOR = /^#([0-9a-f]{6}|[0-9a-f]{3})$/i
-const LAUNCHER_SIZE = 52
+const DEFAULT_LAUNCHER_SIZE = 60
+const DEFAULT_LAUNCHER_ICON_SCALE = 100
+// The preview stage is smaller than a real page, so the launcher renders at 52px for the
+// default 60px setting and every other size is scaled by the same ratio.
+const LAUNCHER_PREVIEW_SCALE = 52 / 60
 const SNIPPET_LENGTH = 240
 
 const props = defineProps({
@@ -551,7 +570,7 @@ const openExisting = () => {
   view.value = 'chat'
 }
 
-const isDark = computed(() => Boolean(props.config.dark_mode))
+const isDark = computed(() => Boolean(props.config.dark))
 
 const primaryStyle = computed(() => {
   const primary = props.config.colors?.primary
@@ -721,7 +740,20 @@ const onLeft = computed(() => props.config.launcher?.position === 'left')
 const clampSpacing = (value) => Math.min(Number(value) || 20, 40)
 const clampedSide = computed(() => clampSpacing(props.config.launcher?.spacing?.side))
 const clampedBottom = computed(() => clampSpacing(props.config.launcher?.spacing?.bottom))
-const windowBottom = computed(() => clampedBottom.value + LAUNCHER_SIZE + 12)
+const launcherSize = computed(() =>
+  Math.round(
+    (Number(props.config.launcher?.size) || DEFAULT_LAUNCHER_SIZE) * LAUNCHER_PREVIEW_SCALE
+  )
+)
+const windowBottom = computed(() => clampedBottom.value + launcherSize.value + 12)
+const launcherIconScale = computed(
+  () => Number(props.config.launcher?.icon_scale) || DEFAULT_LAUNCHER_ICON_SCALE
+)
+const launcherIconFull = computed(() => launcherIconScale.value >= 100)
+const launcherIconStyle = computed(() => ({
+  width: launcherIconScale.value + '%',
+  height: launcherIconScale.value + '%'
+}))
 
 const launcherColor = computed(() => {
   const c = props.config.launcher?.color
@@ -737,8 +769,8 @@ const campaignStyle = computed(() => ({
 }))
 const launcherStyle = computed(() => ({
   filter: LAUNCHER_DROP_SHADOW,
-  width: LAUNCHER_SIZE + 'px',
-  height: LAUNCHER_SIZE + 'px',
+  width: launcherSize.value + 'px',
+  height: launcherSize.value + 'px',
   backgroundColor: launcherColor.value,
   bottom: clampedBottom.value + 'px',
   [onLeft.value ? 'left' : 'right']: clampedSide.value + 'px'
diff --git a/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue b/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
index 0abad5bd..a59ac56a 100644
--- a/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
+++ b/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
@@ -58,13 +58,18 @@
                   (field) => field.key || `field_${field.custom_attribute_id || 'unknown'}`
                 "
                 :animation="200"
+                handle=".drag-handle"
+                :force-fallback="true"
+                fallback-on-body
+                :fallback-tolerance="3"
+                ghost-class="drag-ghost"
                 class="space-y-3"
               >
                 <template #item="{ element: field, index }">
                   <div :key="field.key || `field-${index}`" class="border rounded-lg p-4 space-y-4">
                     <div class="flex items-center justify-between">
                       <div class="flex items-center space-x-3">
-                        <div class="cursor-move text-muted-foreground">
+                        <div class="drag-handle cursor-move text-muted-foreground">
                           <GripVertical class="w-4 h-4" />
                         </div>
                         <div>
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
index bedcc37a..fb108e50 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
@@ -1,6 +1,4 @@
 <script setup>
-const CAMPAIGN_ORDER_BUTTON_CLASS = 'size-6'
-
 import { ref, computed, watch, onMounted, nextTick } from 'vue'
 import { useI18n } from 'vue-i18n'
 import api from '@/api'
@@ -41,22 +39,17 @@ import {
   CollapsibleContent,
   CollapsibleTrigger
 } from '@shared-ui/components/ui/collapsible'
+import Draggable from 'vuedraggable'
 import SwitchField from '@shared-ui/components/SwitchField.vue'
 import SelectAgentCombobox from '@/components/combobox/SelectAgentCombobox.vue'
 import SelectTeamCombobox from '@/components/combobox/SelectTeamCombobox.vue'
 import WidgetConditions from './WidgetConditions.vue'
-import {
-  createCampaignSchema,
-  defaultCampaign,
-  moveCampaign,
-  newCampaignId
-} from './livechatFormSchema.js'
+import { createCampaignSchema, defaultCampaign, newCampaignId } from './livechatFormSchema.js'
 import { handleHTTPError } from '@shared-ui/utils/http'
 import {
-  ArrowDown,
-  ArrowUp,
   ChevronRight,
   ChevronDown,
+  GripVertical,
   Plus,
   CircleCheck,
   CircleSlash
@@ -160,7 +153,15 @@ const update = (key, value) => {
     props.modelValue.map((item) => {
       if (item.id !== selected.value) return item
       const next = { ...item, [key]: value }
-      if (key === 'repeat' && value !== 'interval' && !(Number.isInteger(next.repeat_hours) && next.repeat_hours >= 1 && next.repeat_hours <= 8760)) {
+      if (
+        key === 'repeat' &&
+        value !== 'interval' &&
+        !(
+          Number.isInteger(next.repeat_hours) &&
+          next.repeat_hours >= 1 &&
+          next.repeat_hours <= 8760
+        )
+      ) {
         next.repeat_hours = defaultCampaign().repeat_hours
       }
       return next
@@ -174,8 +175,10 @@ const toggleEnabled = (id, enabled) =>
     props.modelValue.map((item) => (item.id === id ? { ...item, enabled } : item))
   )
 
-const reorder = (index, offset) =>
-  emit('update:modelValue', moveCampaign(props.modelValue, index, offset))
+const orderedCampaigns = computed({
+  get: () => props.modelValue,
+  set: (value) => emit('update:modelValue', value)
+})
 
 const add = (source) => {
   const item = source
@@ -295,65 +298,58 @@ onMounted(async () => {
           {{ t('widget.campaignPriorityHint') }}
         </p>
 
-        <div v-if="modelValue.length" class="space-y-2">
-          <div
-            v-for="(item, index) in modelValue"
-            :key="item.id"
-            class="flex items-center gap-3 border rounded-md hover:bg-accent/50 transition-colors"
-          >
-            <div v-if="modelValue.length > 1" class="ml-2 flex flex-col">
-              <Button
-                type="button"
-                variant="ghost"
-                size="icon"
-                :class="CAMPAIGN_ORDER_BUTTON_CLASS"
-                :disabled="index === 0"
-                :aria-label="t('globals.messages.moveUp')"
-                @click="reorder(index, -1)"
-              >
-                <ArrowUp class="size-3.5" aria-hidden="true" />
-              </Button>
-              <Button
-                type="button"
-                variant="ghost"
-                size="icon"
-                :class="CAMPAIGN_ORDER_BUTTON_CLASS"
-                :disabled="index === modelValue.length - 1"
-                :aria-label="t('globals.messages.moveDown')"
-                @click="reorder(index, 1)"
-              >
-                <ArrowDown class="size-3.5" aria-hidden="true" />
-              </Button>
-            </div>
-            <Switch
-              :class="modelValue.length > 1 ? '' : 'ml-3'"
-              :checked="item.enabled"
-              :aria-label="t('globals.terms.enabled')"
-              @update:checked="toggleEnabled(item.id, $event)"
-            />
-            <button
-              type="button"
-              class="flex min-w-0 flex-1 items-center gap-3 py-3 pr-3 text-left"
-              @click="selected = item.id"
+        <Draggable
+          v-if="modelValue.length"
+          v-model="orderedCampaigns"
+          item-key="id"
+          :animation="200"
+          handle=".drag-handle"
+          :force-fallback="true"
+          fallback-on-body
+          :fallback-tolerance="3"
+          ghost-class="drag-ghost"
+          class="space-y-2"
+        >
+          <template #item="{ element: item }">
+            <div
+              class="flex items-center gap-3 border rounded-md hover:bg-accent/50 transition-colors"
             >
-              <div class="flex-1 min-w-0">
-                <div class="flex items-center gap-2">
-                  <span class="text-sm font-medium text-foreground truncate">
-                    {{ item.name || t('widget.newCampaign') }}
-                  </span>
-                  <Badge variant="secondary" class="gap-1 shrink-0">
-                    <component :is="item.enabled ? CircleCheck : CircleSlash" class="size-3" />
-                    {{ item.enabled ? t('globals.terms.enabled') : t('globals.terms.paused') }}
-                  </Badge>
-                </div>
-                <p class="text-xs text-muted-foreground truncate mt-0.5">
-                  {{ audienceLabel(item) }} · {{ pagesLabel(item) }}
-                </p>
+              <div
+                v-if="modelValue.length > 1"
+                class="drag-handle ml-2 cursor-move text-muted-foreground"
+              >
+                <GripVertical class="size-4" aria-hidden="true" />
               </div>
-              <ChevronRight class="size-4 text-muted-foreground shrink-0" />
-            </button>
-          </div>
-        </div>
+              <Switch
+                :class="modelValue.length > 1 ? '' : 'ml-3'"
+                :checked="item.enabled"
+                :aria-label="t('globals.terms.enabled')"
+                @update:checked="toggleEnabled(item.id, $event)"
+              />
+              <button
+                type="button"
+                class="flex min-w-0 flex-1 items-center gap-3 py-3 pr-3 text-left"
+                @click="selected = item.id"
+              >
+                <div class="flex-1 min-w-0">
+                  <div class="flex items-center gap-2">
+                    <span class="text-sm font-medium text-foreground truncate">
+                      {{ item.name || t('widget.newCampaign') }}
+                    </span>
+                    <Badge variant="secondary" class="gap-1 shrink-0">
+                      <component :is="item.enabled ? CircleCheck : CircleSlash" class="size-3" />
+                      {{ item.enabled ? t('globals.terms.enabled') : t('globals.terms.paused') }}
+                    </Badge>
+                  </div>
+                  <p class="text-xs text-muted-foreground truncate mt-0.5">
+                    {{ audienceLabel(item) }} · {{ pagesLabel(item) }}
+                  </p>
+                </div>
+                <ChevronRight class="size-4 text-muted-foreground shrink-0" />
+              </button>
+            </div>
+          </template>
+        </Draggable>
 
         <Button
           type="button"
@@ -671,7 +667,7 @@ onMounted(async () => {
       <!-- Repeat -->
       <div class="space-y-4">
         <h4 class="text-base font-semibold text-foreground">
-          {{ t('widget.campaign.section.repeat') }}
+          {{ t('globals.terms.repeat') }}
         </h4>
 
         <div class="grid sm:grid-cols-2 gap-4">
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
index 7a16a7a4..7ca19bde 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
@@ -116,6 +116,10 @@ const unusedArticles = computed(() =>
           item-key="id"
           :animation="200"
           handle=".drag-handle"
+          :force-fallback="true"
+          fallback-on-body
+          :fallback-tolerance="3"
+          ghost-class="drag-ghost"
           class="space-y-2"
         >
           <template #item="{ element: item, index }">
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
index a76df873..b21c4b4c 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
@@ -27,6 +27,53 @@ const goDurationSeconds = (value) => {
   if (!match) return 0
   return Number(match[1] || 0) * 3600 + Number(match[2] || 0) * 60 + Number(match[3] || 0)
 }
+const branding = (t) =>
+  z.object({
+    colors: z.object({
+      primary: hexColor(t)
+    }),
+    logo_url: optionalUrl(t),
+    launcher: z.object({
+      logo_url: optionalUrl(t),
+      color: hexColor(t)
+    }),
+    home_screen: z.object({
+      header_text_color: z.enum(['black', 'white']),
+      background: z
+        .object({
+          type: z.enum(['solid', 'gradient', 'image']),
+          color: optionalHexColor(t),
+          gradient_start: optionalHexColor(t),
+          gradient_end: optionalHexColor(t),
+          image_url: optionalUrl(t)
+        })
+        .superRefine((bg, ctx) => {
+          // An empty solid color falls back to the page background, gradients and images render nothing.
+          if (bg.type === 'gradient') {
+            if (!bg.gradient_start)
+              ctx.addIssue({
+                code: z.ZodIssueCode.custom,
+                path: ['gradient_start'],
+                message: t('globals.messages.required')
+              })
+            if (!bg.gradient_end)
+              ctx.addIssue({
+                code: z.ZodIssueCode.custom,
+                path: ['gradient_end'],
+                message: t('globals.messages.required')
+              })
+          } else if (bg.type === 'image' && !bg.image_url) {
+            ctx.addIssue({
+              code: z.ZodIssueCode.custom,
+              path: ['image_url'],
+              message: t('globals.messages.required')
+            })
+          }
+        }),
+      fade_background: z.boolean()
+    })
+  })
+
 const quickReplies = (t) =>
   z
     .string()
@@ -117,16 +164,6 @@ export const defaultCampaign = () => ({
   repeat: 'once',
   repeat_hours: 24
 })
-export const moveCampaign = (campaigns, index, offset) => {
-  const target = index + offset
-  if (index < 0 || index >= campaigns.length || target < 0 || target >= campaigns.length) {
-    return campaigns
-  }
-  const reordered = [...campaigns]
-  const [campaign] = reordered.splice(index, 1)
-  reordered.splice(target, 0, campaign)
-  return reordered
-}
 export const normalizeAudienceConfig = (config, audience) => {
   const audienceConfig = { ...config?.[audience] }
   const replies = audienceConfig.quick_replies
@@ -228,20 +265,23 @@ export const createFormSchema = (t) =>
           desktop: z.boolean(),
           mobile: z.boolean(),
           content: z.enum(['message', 'generic']),
-          auto_hide_seconds: z.number().int().min(0).max(300)
+          auto_hide_seconds: rangeInteger(t, 0, 300)
         })
         .default(defaultWidgetPreviews),
       brand_name: z.string().min(1, { message: t('globals.messages.required') }),
       website_url: optionalUrl(t),
-      dark_mode: z.boolean(),
+      theme: z.enum(['system', 'light', 'dark']),
       show_powered_by: z.boolean(),
       language: z.string().min(1, { message: t('globals.messages.required') }),
       fallback_language: z.string().optional(),
-      logo_url: optionalUrl(t),
+      branding: z.object({
+        light: branding(t),
+        dark: branding(t)
+      }),
       launcher: z.object({
         position: z.enum(['left', 'right']),
-        logo_url: optionalUrl(t),
-        color: hexColor(t),
+        size: rangeInteger(t, 40, 80),
+        icon_scale: rangeInteger(t, 40, 100),
         spacing: z.object({
           side: spacingNumber(t),
           bottom: spacingNumber(t)
@@ -268,44 +308,6 @@ export const createFormSchema = (t) =>
             })
           }
         }),
-      colors: z.object({
-        primary: hexColor(t)
-      }),
-      home_screen: z.object({
-        header_text_color: z.enum(['black', 'white']),
-        background: z
-          .object({
-            type: z.enum(['solid', 'gradient', 'image']),
-            color: optionalHexColor(t),
-            gradient_start: optionalHexColor(t),
-            gradient_end: optionalHexColor(t),
-            image_url: optionalUrl(t)
-          })
-          .superRefine((bg, ctx) => {
-            // Empty solid colors use the page background, but empty gradients and images render nothing.
-            if (bg.type === 'gradient') {
-              if (!bg.gradient_start)
-                ctx.addIssue({
-                  code: z.ZodIssueCode.custom,
-                  path: ['gradient_start'],
-                  message: t('globals.messages.required')
-                })
-              if (!bg.gradient_end)
-                ctx.addIssue({
-                  code: z.ZodIssueCode.custom,
-                  path: ['gradient_end'],
-                  message: t('globals.messages.required')
-                })
-            } else if (bg.type === 'image' && !bg.image_url) {
-              ctx.addIssue({
-                code: z.ZodIssueCode.custom,
-                path: ['image_url'],
-                message: t('globals.messages.required')
-              })
-            }
-          }),
-        fade_background: z.boolean()
-      }),
       features: z.object({
         file_upload: z.boolean(),
         emoji: z.boolean(),
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
index bf1f5ee6..b41bee72 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
@@ -2,7 +2,6 @@
 import { describe, test, expect } from 'vitest'
 import {
   createFormSchema,
-  moveCampaign,
   normalizeAudienceConfig,
   normalizePrechatConfig
 } from './livechatFormSchema'
@@ -10,25 +9,35 @@ import {
 const mockT = (key, params) => `${key} ${JSON.stringify(params || {})}`
 const schema = createFormSchema(mockT)
 
+const validBranding = {
+  colors: { primary: '#2563eb' },
+  logo_url: '',
+  launcher: { logo_url: '', color: '#2563eb' },
+  home_screen: {
+    header_text_color: 'white',
+    background: { type: 'solid', color: '#2563eb' },
+    fade_background: true
+  }
+}
+
 const validConfig = {
   brand_name: 'Acme',
-  dark_mode: false,
+  theme: 'light',
   show_powered_by: true,
   language: 'en',
   launcher: {
     position: 'right',
-    color: '#2563eb',
+    size: 60,
+    icon_scale: 100,
     spacing: { side: 20, bottom: 20 }
   },
   chat_introduction: 'Ask us anything',
   show_office_hours_in_chat: true,
   show_office_hours_after_assignment: false,
   notice_banner: { enabled: false },
-  colors: { primary: '#2563eb' },
-  home_screen: {
-    header_text_color: 'white',
-    background: { type: 'solid', color: '#2563eb' },
-    fade_background: true
+  branding: {
+    light: validBranding,
+    dark: validBranding
   },
   features: { file_upload: true, emoji: true },
   session_duration: '720h',
@@ -57,6 +66,15 @@ const validForm = {
 }
 
 const withConfig = (overrides) => ({ ...validForm, config: { ...validConfig, ...overrides } })
+const withBranding = (overrides, theme = 'light') =>
+  withConfig({
+    branding: {
+      ...validConfig.branding,
+      [theme]: { ...validBranding, ...overrides }
+    }
+  })
+const withHomeScreen = (overrides, theme = 'light') =>
+  withBranding({ home_screen: { ...validBranding.home_screen, ...overrides } }, theme)
 const validCampaign = {
   id: '8a3660e6-e29b-461c-924f-314c7576f75a',
   name: 'Pricing invitation',
@@ -372,12 +390,6 @@ describe('Livechat Inbox Form Schema', () => {
     ).not.toThrow()
   })
 
-  test('campaign priority follows saved array order', () => {
-    const campaigns = [{ id: 'first' }, { id: 'second' }, { id: 'third' }]
-    expect(moveCampaign(campaigns, 2, -1).map(({ id }) => id)).toEqual(['first', 'third', 'second'])
-    expect(campaigns.map(({ id }) => id)).toEqual(['first', 'second', 'third'])
-  })
-
   test('name missing', () => {
     const { name, ...form } = validForm
     expect(() => schema.parse(form)).toThrow()
@@ -425,15 +437,74 @@ describe('Livechat Inbox Form Schema', () => {
   })
 
   test('primary color invalid hex', () => {
-    expect(() => schema.parse(withConfig({ colors: { primary: 'blue' } }))).toThrow()
+    expect(() => schema.parse(withBranding({ colors: { primary: 'blue' } }))).toThrow()
   })
 
   test('primary color three digit hex accepted', () => {
-    expect(() => schema.parse(withConfig({ colors: { primary: '#fff' } }))).not.toThrow()
+    expect(() => schema.parse(withBranding({ colors: { primary: '#fff' } }))).not.toThrow()
   })
 
   test('primary color eight digit hex rejected', () => {
-    expect(() => schema.parse(withConfig({ colors: { primary: '#ffffff00' } }))).toThrow()
+    expect(() => schema.parse(withBranding({ colors: { primary: '#ffffff00' } }))).toThrow()
+  })
+
+  test('dark primary color validated too', () => {
+    expect(() => schema.parse(withBranding({ colors: { primary: 'blue' } }, 'dark'))).toThrow()
+  })
+
+  test('theme invalid', () => {
+    expect(() => schema.parse(withConfig({ theme: 'auto' }))).toThrow()
+  })
+
+  test.each(['system', 'light', 'dark'])('theme accepts %s', (theme) => {
+    expect(() => schema.parse(withConfig({ theme }))).not.toThrow()
+  })
+
+  test('launcher size out of range', () => {
+    expect(() =>
+      schema.parse(withConfig({ launcher: { ...validConfig.launcher, size: 39 } }))
+    ).toThrow()
+    expect(() =>
+      schema.parse(withConfig({ launcher: { ...validConfig.launcher, size: 81 } }))
+    ).toThrow()
+  })
+
+  test('launcher size at boundaries', () => {
+    expect(() =>
+      schema.parse(withConfig({ launcher: { ...validConfig.launcher, size: 40 } }))
+    ).not.toThrow()
+    expect(() =>
+      schema.parse(withConfig({ launcher: { ...validConfig.launcher, size: 80 } }))
+    ).not.toThrow()
+  })
+
+  test('launcher size rejects a fraction', () => {
+    expect(() =>
+      schema.parse(withConfig({ launcher: { ...validConfig.launcher, size: 60.5 } }))
+    ).toThrow()
+  })
+
+  test('launcher icon scale out of range', () => {
+    expect(() =>
+      schema.parse(withConfig({ launcher: { ...validConfig.launcher, icon_scale: 39 } }))
+    ).toThrow()
+    expect(() =>
+      schema.parse(withConfig({ launcher: { ...validConfig.launcher, icon_scale: 101 } }))
+    ).toThrow()
+  })
+
+  test('launcher icon scale at boundaries', () => {
+    expect(() =>
+      schema.parse(withConfig({ launcher: { ...validConfig.launcher, icon_scale: 40 } }))
+    ).not.toThrow()
+    expect(() =>
+      schema.parse(withConfig({ launcher: { ...validConfig.launcher, icon_scale: 100 } }))
+    ).not.toThrow()
+  })
+
+  test('launcher size coerced from string', () => {
+    const parsed = schema.parse(withConfig({ launcher: { ...validConfig.launcher, size: '72' } }))
+    expect(parsed.config.launcher.size).toBe(72)
   })
 
   test('launcher position invalid', () => {
@@ -496,76 +567,43 @@ describe('Livechat Inbox Form Schema', () => {
   })
 
   test('home screen header_text_color invalid', () => {
-    expect(() =>
-      schema.parse(
-        withConfig({
-          home_screen: { ...validConfig.home_screen, header_text_color: 'grey' }
-        })
-      )
-    ).toThrow()
+    expect(() => schema.parse(withHomeScreen({ header_text_color: 'grey' }))).toThrow()
   })
 
   test('solid background without a color accepted', () => {
-    expect(() =>
-      schema.parse(
-        withConfig({
-          home_screen: { ...validConfig.home_screen, background: { type: 'solid' } }
-        })
-      )
-    ).not.toThrow()
+    expect(() => schema.parse(withHomeScreen({ background: { type: 'solid' } }))).not.toThrow()
   })
 
   test('gradient background requires both stops', () => {
     expect(() =>
-      schema.parse(
-        withConfig({
-          home_screen: {
-            ...validConfig.home_screen,
-            background: { type: 'gradient', gradient_start: '#000000' }
-          }
-        })
-      )
+      schema.parse(withHomeScreen({ background: { type: 'gradient', gradient_start: '#000000' } }))
     ).toThrow()
     expect(() =>
       schema.parse(
-        withConfig({
-          home_screen: {
-            ...validConfig.home_screen,
-            background: { type: 'gradient', gradient_start: '#000000', gradient_end: '#ffffff' }
-          }
+        withHomeScreen({
+          background: { type: 'gradient', gradient_start: '#000000', gradient_end: '#ffffff' }
         })
       )
     ).not.toThrow()
   })
 
   test('image background requires an image url', () => {
+    expect(() => schema.parse(withHomeScreen({ background: { type: 'image' } }))).toThrow()
     expect(() =>
       schema.parse(
-        withConfig({
-          home_screen: { ...validConfig.home_screen, background: { type: 'image' } }
-        })
-      )
-    ).toThrow()
-    expect(() =>
-      schema.parse(
-        withConfig({
-          home_screen: {
-            ...validConfig.home_screen,
-            background: { type: 'image', image_url: 'https://cdn.example.com/bg.png' }
-          }
+        withHomeScreen({
+          background: { type: 'image', image_url: 'https://cdn.example.com/bg.png' }
         })
       )
     ).not.toThrow()
   })
 
   test('background type invalid', () => {
-    expect(() =>
-      schema.parse(
-        withConfig({
-          home_screen: { ...validConfig.home_screen, background: { type: 'video' } }
-        })
-      )
-    ).toThrow()
+    expect(() => schema.parse(withHomeScreen({ background: { type: 'video' } }))).toThrow()
+  })
+
+  test('dark background validated too', () => {
+    expect(() => schema.parse(withHomeScreen({ background: { type: 'image' } }, 'dark'))).toThrow()
   })
 
   test('session_duration invalid duration', () => {
diff --git a/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue b/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue
index ce84d059..25716ecc 100644
--- a/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue
+++ b/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue
@@ -5,7 +5,11 @@
     </div>
     <div
       class="rounded-md p-2 space-y-2 self-stretch text-sm text-foreground/70"
-      :class="fixedHelp ? 'hidden xl:block w-[432px] shrink-0' : 'hidden lg:block w-3/12'"
+      :class="
+        fixedHelp
+          ? 'hidden xl:block w-[432px] min-[1800px]:w-[820px] shrink-0'
+          : 'hidden lg:block w-3/12'
+      "
     >
       <slot name="help" />
     </div>
diff --git a/frontend/apps/main/src/stores/conversation.js b/frontend/apps/main/src/stores/conversation.js
index 74031bbd..df982c1d 100644
--- a/frontend/apps/main/src/stores/conversation.js
+++ b/frontend/apps/main/src/stores/conversation.js
@@ -920,7 +920,11 @@ export const useConversationStore = defineStore('conversation', () => {
     if (!messages.data.hasMessage(message.conversation_uuid, message.uuid)) {
       const echoId = message.echo_id
       if (echoId && messages.data.hasMessage(message.conversation_uuid, echoId)) {
-        messages.data.updateMessage(message.conversation_uuid, echoId, { uuid: message.uuid })
+        messages.data.updateMessage(message.conversation_uuid, echoId, {
+          uuid: message.uuid,
+          id: message.id,
+          created_at: message.created_at
+        })
         incrementMessageVersion()
         updateAssigneeLastSeen(message.conversation_uuid)
         return
@@ -929,6 +933,7 @@ export const useConversationStore = defineStore('conversation', () => {
       if (message.type === 'activity') {
         const activityMessage = {
           uuid: message.uuid,
+          id: message.id,
           conversation_uuid: message.conversation_uuid,
           type: 'activity',
           content: message.preview,
diff --git a/frontend/apps/main/src/views/admin/inbox/InboxView.vue b/frontend/apps/main/src/views/admin/inbox/InboxView.vue
index a4bc6fd9..993c3fc3 100644
--- a/frontend/apps/main/src/views/admin/inbox/InboxView.vue
+++ b/frontend/apps/main/src/views/admin/inbox/InboxView.vue
@@ -8,20 +8,39 @@
       <!-- The livechat form writes its live config here so the preview replaces the help rail. -->
       <div v-if="livechatPreview" class="space-y-4 sticky top-2">
         <div class="space-y-2">
-          <div class="flex items-center justify-between gap-2">
-            <h4 class="text-sm font-medium text-foreground">
-              {{ $t('admin.inbox.livechat.preview') }}
-            </h4>
-            <Tabs v-model="previewUserType">
-              <TabsList class="h-8 p-0.5">
-                <TabsTrigger value="visitors" class="text-xs">
-                  {{ $t('admin.inbox.livechat.userSettings.visitors') }}
-                </TabsTrigger>
-                <TabsTrigger value="users" class="text-xs">
-                  {{ $t('globals.terms.users') }}
-                </TabsTrigger>
-              </TabsList>
-            </Tabs>
+          <div class="flex items-center justify-end gap-2">
+            <div class="flex items-center gap-2">
+              <Tabs v-model="previewUserType">
+                <TabsList class="h-8 p-0.5">
+                  <TabsTrigger value="visitors" class="text-xs">
+                    {{ $t('admin.inbox.livechat.userSettings.visitors') }}
+                  </TabsTrigger>
+                  <TabsTrigger value="users" class="text-xs">
+                    {{ $t('globals.terms.users') }}
+                  </TabsTrigger>
+                </TabsList>
+              </Tabs>
+              <Tabs v-model="previewTheme">
+                <TabsList class="h-8 p-0.5">
+                  <TabsTrigger
+                    value="light"
+                    class="px-2"
+                    data-preview-theme="light"
+                    :aria-label="$t('globals.terms.light')"
+                  >
+                    <Sun class="size-3.5" />
+                  </TabsTrigger>
+                  <TabsTrigger
+                    value="dark"
+                    class="px-2"
+                    data-preview-theme="dark"
+                    :aria-label="$t('globals.terms.dark')"
+                  >
+                    <Moon class="size-3.5" />
+                  </TabsTrigger>
+                </TabsList>
+              </Tabs>
+            </div>
           </div>
           <LivechatWidgetPreview :config="livechatPreview" :user-type="previewUserType" />
         </div>
@@ -72,8 +91,11 @@ import { ref, provide } from 'vue'
 import AdminSplitLayout from '@/layouts/admin/AdminSplitLayout.vue'
 import LivechatWidgetPreview from '@/features/admin/inbox/LivechatWidgetPreview.vue'
 import { Tabs, TabsList, TabsTrigger } from '@shared-ui/components/ui/tabs'
+import { Sun, Moon } from 'lucide-vue-next'
 
 const previewUserType = ref('visitors')
+const previewTheme = ref('light')
 const livechatPreview = ref(null)
 provide('livechatPreview', livechatPreview)
+provide('livechatPreviewTheme', previewTheme)
 </script>
diff --git a/frontend/apps/widget/src/App.vue b/frontend/apps/widget/src/App.vue
index 6416168f..03d24b04 100644
--- a/frontend/apps/widget/src/App.vue
+++ b/frontend/apps/widget/src/App.vue
@@ -1,7 +1,7 @@
 <template>
   <div
     class="libredesk-widget-app text-foreground bg-background"
-    :class="{ dark: widgetStore.config.dark_mode, mobile: widgetStore.isMobileFullScreen }"
+    :class="{ dark: widgetStore.isDark, mobile: widgetStore.isMobileFullScreen }"
     :style="customColorStyle"
     @click.once="initAudioContext"
     @touchstart.once="initAudioContext"
@@ -49,7 +49,7 @@ if (widgetConfig) {
 
 const customColorStyle = computed(() => {
   const style = {}
-  const colors = widgetStore.config.colors
+  const colors = widgetStore.branding?.colors
   if (colors?.primary) {
     style['--primary'] = hexToHSL(colors.primary)
     style['--primary-foreground'] = getContrastingHSL(colors.primary)
@@ -59,8 +59,8 @@ const customColorStyle = computed(() => {
 
 // Dropdowns and dialogs portal to document.body, outside the app wrapper.
 watch(
-  () => widgetStore.config.dark_mode,
-  (dark) => document.documentElement.classList.toggle('dark', !!dark),
+  () => widgetStore.isDark,
+  (dark) => document.documentElement.classList.toggle('dark', dark),
   { immediate: true }
 )
 
diff --git a/frontend/apps/widget/src/components/ArticleReader.vue b/frontend/apps/widget/src/components/ArticleReader.vue
index e410e2b0..2708be17 100644
--- a/frontend/apps/widget/src/components/ArticleReader.vue
+++ b/frontend/apps/widget/src/components/ArticleReader.vue
@@ -15,7 +15,7 @@ const widgetStore = useWidgetStore()
 
 const src = computed(() => {
   const path = `${props.baseUrl}/${encodeURIComponent(props.article.locale)}/articles/${encodeURIComponent(props.article.slug)}?embed=1`
-  return widgetStore.config.dark_mode ? `${path}&theme=dark` : path
+  return widgetStore.isDark ? `${path}&theme=dark` : path
 })
 
 const frameOrigin = computed(() => {
diff --git a/frontend/apps/widget/src/components/ChatTitle.vue b/frontend/apps/widget/src/components/ChatTitle.vue
index 6b26114b..21ca1445 100644
--- a/frontend/apps/widget/src/components/ChatTitle.vue
+++ b/frontend/apps/widget/src/components/ChatTitle.vue
@@ -134,7 +134,7 @@ const chatTitle = computed(() => {
   // Default brand values
   return {
     name: config.brand_name,
-    avatarUrl: config.launcher?.logo_url || '',
+    avatarUrl: widgetStore.branding?.launcher?.logo_url || '',
     avatarFallback: config.brand_name.charAt(0).toUpperCase(),
     availability_status: null,
     hasAssignee: false
diff --git a/frontend/apps/widget/src/components/ConversationsList.vue b/frontend/apps/widget/src/components/ConversationsList.vue
index ab06f85c..ddb0fb0e 100644
--- a/frontend/apps/widget/src/components/ConversationsList.vue
+++ b/frontend/apps/widget/src/components/ConversationsList.vue
@@ -79,7 +79,7 @@ function getAvatarUrl(conversation) {
     if (assignee?.id > 0) {
       return assignee.avatar_url || ''
     }
-    return widgetStore.config.launcher?.logo_url || ''
+    return widgetStore.branding?.launcher?.logo_url || ''
   }
   return author?.avatar_url || ''
 }
diff --git a/frontend/apps/widget/src/components/HomeHeader.vue b/frontend/apps/widget/src/components/HomeHeader.vue
index 78922607..895b455d 100644
--- a/frontend/apps/widget/src/components/HomeHeader.vue
+++ b/frontend/apps/widget/src/components/HomeHeader.vue
@@ -5,8 +5,8 @@
       :class="widgetStore.isMobileFullScreen ? 'pt-[max(3.5rem,env(safe-area-inset-top))]' : 'pt-7'"
     >
       <img
-        v-if="config.logo_url"
-        :src="config.logo_url"
+        v-if="widgetStore.branding?.logo_url"
+        :src="widgetStore.branding?.logo_url"
         :alt="config.brand_name"
         class="max-h-7 max-w-full"
       />
@@ -56,5 +56,5 @@ const parsedIntroduction = computed(() =>
   renderTemplate(props.config.introduction_message, userData.value)
 )
 
-const { textColorClass, subTextColorClass } = useHeaderTheme(computed(() => props.config))
+const { textColorClass, subTextColorClass } = useHeaderTheme()
 </script>
diff --git a/frontend/apps/widget/src/composables/useHeaderTheme.js b/frontend/apps/widget/src/composables/useHeaderTheme.js
index b26ee9f0..9c1461a9 100644
--- a/frontend/apps/widget/src/composables/useHeaderTheme.js
+++ b/frontend/apps/widget/src/composables/useHeaderTheme.js
@@ -1,7 +1,9 @@
 import { computed } from 'vue'
+import { useWidgetStore } from '@widget/store/widget.js'
 
-export function useHeaderTheme (config) {
-  const homeScreen = computed(() => config.value?.home_screen)
+export function useHeaderTheme () {
+  const widget = useWidgetStore()
+  const homeScreen = computed(() => widget.branding?.home_screen)
   const choice = computed(() => homeScreen.value?.header_text_color)
 
   const textColorClass = computed(() => {
diff --git a/frontend/apps/widget/src/composables/useReplyPreviews.js b/frontend/apps/widget/src/composables/useReplyPreviews.js
index b85a502d..d844b016 100644
--- a/frontend/apps/widget/src/composables/useReplyPreviews.js
+++ b/frontend/apps/widget/src/composables/useReplyPreviews.js
@@ -17,7 +17,7 @@ export function useReplyPreviews() {
       chat.getConversations,
       user.userID,
       widget.config.previews,
-      widget.config.dark_mode,
+      widget.isDark,
       widget.isOpen
     ],
     async () => {
diff --git a/frontend/apps/widget/src/layouts/MainLayout.vue b/frontend/apps/widget/src/layouts/MainLayout.vue
index ba4836dc..6dc29bed 100644
--- a/frontend/apps/widget/src/layouts/MainLayout.vue
+++ b/frontend/apps/widget/src/layouts/MainLayout.vue
@@ -73,7 +73,7 @@ import { useWidgetStore } from '@widget/store/widget.js'
 
 const widgetStore = useWidgetStore()
 const help = useHelpStore()
-const { textColorClass } = useHeaderTheme(computed(() => widgetStore.config))
+const { textColorClass } = useHeaderTheme()
 
 const handleTabChange = (value) => {
   if (value === 'home') {
diff --git a/frontend/apps/widget/src/store/widget.js b/frontend/apps/widget/src/store/widget.js
index ea6fbe87..baa69d02 100644
--- a/frontend/apps/widget/src/store/widget.js
+++ b/frontend/apps/widget/src/store/widget.js
@@ -15,9 +15,26 @@ export const useWidgetStore = defineStore('widget', () => {
     const connected = ref(false)
 
 
+    const prefersDark = ref(false)
+    const darkQuery = window.matchMedia?.('(prefers-color-scheme: dark)')
+    if (darkQuery) {
+        prefersDark.value = darkQuery.matches
+        darkQuery.addEventListener('change', (event) => {
+            prefersDark.value = event.matches
+        })
+    }
+
     // Getters
     const isChatView = computed(() => isInChatView.value)
 
+    const isDark = computed(() => {
+        if (config.value.theme === 'dark') return true
+        if (config.value.theme === 'system') return prefersDark.value
+        return false
+    })
+
+    const branding = computed(() => config.value.branding?.[isDark.value ? 'dark' : 'light'] || {})
+
     // Actions
     const setOpen = (open) => {
         isOpen.value = open
@@ -141,6 +158,8 @@ export const useWidgetStore = defineStore('widget', () => {
 
         // Getters
         isChatView,
+        isDark,
+        branding,
 
         // Actions
         setOpen,
diff --git a/frontend/apps/widget/src/views/HomeView.vue b/frontend/apps/widget/src/views/HomeView.vue
index c50decab..0bc4a946 100644
--- a/frontend/apps/widget/src/views/HomeView.vue
+++ b/frontend/apps/widget/src/views/HomeView.vue
@@ -52,7 +52,7 @@ import { useHelpStore } from '@widget/store/help.js'
 const widgetStore = useWidgetStore()
 const chatStore = useChatStore()
 const config = computed(() => widgetStore.config)
-const { backgroundStyle, showFade, fadeStyle } = useHeaderTheme(config)
+const { backgroundStyle, showFade, fadeStyle } = useHeaderTheme()
 const headerRef = ref(null)
 const { height: headerHeight } = useElementSize(computed(() => headerRef.value?.$el))
 const help = useHelpStore()
diff --git a/frontend/cypress/e2e/integration/livechat/config.cy.js b/frontend/cypress/e2e/integration/livechat/config.cy.js
index 31f0b2cd..f714d7cf 100644
--- a/frontend/cypress/e2e/integration/livechat/config.cy.js
+++ b/frontend/cypress/e2e/integration/livechat/config.cy.js
@@ -11,7 +11,9 @@ describe('Live chat widget config applied end to end', () => {
     cy.createLivechatInbox(
       withStart({
         brand_name: 'Cypress Brand',
-        logo_url: `${Cypress.config('baseUrl')}/static/public/launcher-logo.png`,
+        branding: {
+          light: { logo_url: `${Cypress.config('baseUrl')}/static/public/launcher-logo.png` }
+        },
         greeting_message: 'Hello from Cypress',
         introduction_message: 'We reply fast'
       })
@@ -28,7 +30,12 @@ describe('Live chat widget config applied end to end', () => {
 
   it('applies the launcher color from config', () => {
     cy.createLivechatInbox(
-      withStart({ colors: { primary: '#ff0000' }, launcher: { color: '#00ff00', position: 'right', spacing: { side: 20, bottom: 20 } } })
+      withStart({
+        branding: {
+          light: { colors: { primary: '#ff0000' }, launcher: { color: '#00ff00' } }
+        },
+        launcher: { position: 'right', spacing: { side: 20, bottom: 20 } }
+      })
     ).then((inbox) => {
       cy.visitWidgetHost(inbox.uuid)
       cy.widgetLauncher().then((el) => {
@@ -172,19 +179,65 @@ describe('Live chat widget config applied end to end', () => {
   })
 
   it('applies dark mode', () => {
-    cy.createLivechatInbox(withStart({ dark_mode: true })).then((inbox) => {
+    cy.createLivechatInbox(withStart({ theme: 'dark' })).then((inbox) => {
       cy.openWidget(inbox)
       cy.widgetBody().find('.dark').should('exist')
     })
   })
 
+  it('follows the visitor color scheme when the theme is system', () => {
+    cy.createLivechatInbox(withStart({ theme: 'system' })).then((inbox) => {
+      cy.setColorScheme('dark')
+      cy.openWidget(inbox)
+      cy.widgetBody().find('.dark').should('exist')
+    })
+
+    cy.createLivechatInbox(withStart({ theme: 'system' })).then((inbox) => {
+      cy.setColorScheme('light')
+      cy.openWidget(inbox)
+      cy.widgetBody().find('.dark').should('not.exist')
+    })
+  })
+
+  it('paints each theme from its own branding half', () => {
+    cy.createLivechatInbox(
+      withStart({
+        theme: 'dark',
+        branding: {
+          light: { launcher: { color: '#ff0000' } },
+          dark: { launcher: { color: '#00ff00' } }
+        }
+      })
+    ).then((inbox) => {
+      cy.visitWidgetHost(inbox.uuid)
+      cy.widgetLauncher().then((el) => {
+        const style = el[0].ownerDocument.defaultView.getComputedStyle(el[0])
+        expect(style.backgroundColor, 'dark launcher color not applied').to.eq('rgb(0, 255, 0)')
+      })
+    })
+  })
+
+  it('renders the launcher at the configured size', () => {
+    cy.createLivechatInbox(withStart({ launcher: { size: 48 } })).then((inbox) => {
+      cy.visitWidgetHost(inbox.uuid)
+      cy.widgetLauncher().then((el) => {
+        const style = el[0].ownerDocument.defaultView.getComputedStyle(el[0])
+        expect(style.width, 'launcher size not applied').to.eq('48px')
+      })
+    })
+  })
+
   it('paints the home screen background from config', () => {
     cy.createLivechatInbox(
       withStart({
-        home_screen: {
-          header_text_color: 'light',
-          background: { type: 'gradient', gradient_start: '#112233', gradient_end: '#445566' },
-          fade_background: true
+        branding: {
+          light: {
+            home_screen: {
+              header_text_color: 'white',
+              background: { type: 'gradient', gradient_start: '#112233', gradient_end: '#445566' },
+              fade_background: true
+            }
+          }
         }
       })
     ).then((inbox) => {
diff --git a/frontend/cypress/e2e/ui/livechatFormFields.cy.js b/frontend/cypress/e2e/ui/livechatFormFields.cy.js
new file mode 100644
index 00000000..2c1c8df1
--- /dev/null
+++ b/frontend/cypress/e2e/ui/livechatFormFields.cy.js
@@ -0,0 +1,552 @@
+// The steps run in order and share one inbox.
+
+const stamp = Date.now()
+const listPath = '/admin/inboxes'
+
+const created = {
+  name: `Cypress Fields ${stamp}`,
+  brandName: `Cypress Fields Brand ${stamp}`,
+  websiteUrl: `https://cypress.test/${stamp}`,
+  greeting: `Greeting ${stamp}`,
+  introduction: `Introduction ${stamp}`,
+  chatIntroduction: `Chat introduction ${stamp}`,
+  notice: `Notice ${stamp}`,
+  replyExpectation: `We reply in ${stamp} minutes`,
+  visitorButton: `Start visitor ${stamp}`,
+  userButton: `Start user ${stamp}`,
+  secret: `${stamp}`.padEnd(32, 'f').slice(0, 32),
+  sessionDuration: '5h',
+  trustedDomain: `cypress-${stamp}.test`,
+  blockedIp: '10.0.0.1',
+  lightPrimary: '#112233',
+  darkPrimary: '#445566',
+  lightLauncher: '#778899',
+  logoUrl: 'https://cypress.test/logo.png',
+  launcherLogo: 'https://cypress.test/launcher.png'
+}
+
+const edited = {
+  name: `${created.name} v2`,
+  brandName: `${created.brandName} v2`,
+  websiteUrl: `${created.websiteUrl}/v2`,
+  greeting: `${created.greeting} v2`,
+  introduction: `${created.introduction} v2`,
+  chatIntroduction: `${created.chatIntroduction} v2`,
+  notice: `${created.notice} v2`,
+  replyExpectation: `${created.replyExpectation} v2`,
+  visitorButton: `${created.visitorButton} v2`,
+  userButton: `${created.userButton} v2`,
+  sessionDuration: '7h',
+  trustedDomain: `edited-${stamp}.test`,
+  blockedIp: '10.0.0.2',
+  lightPrimary: '#aabbcc',
+  darkPrimary: '#ddeeff'
+}
+
+const openNewForm = () => {
+  cy.visit(`${listPath}/new`)
+  cy.contains('Create a live chat inbox').click()
+}
+
+const setColor = (name, value) =>
+  cy.get(`input[name="${name}"]`).invoke('val', value).trigger('input')
+
+describe('Live chat inbox form: every field', () => {
+  let inboxId
+
+  beforeEach(() => {
+    Cypress.on('uncaught:exception', (err) => !err.message.includes("reading 'focus'"))
+    cy.viewport(1280, 900)
+    cy.login()
+  })
+
+  it('creates an inbox with every field filled', () => {
+    cy.intercept('POST', '**/api/v1/inboxes').as('createInbox')
+
+    openNewForm()
+
+    cy.openInboxSection('General')
+    cy.get('input[name="name"]').type(created.name)
+    cy.get('input[name="config.brand_name"]').type(created.brandName)
+    cy.get('input[name="config.website_url"]').type(created.websiteUrl)
+    cy.switchField('CSAT Surveys').click()
+    cy.switchField('Prompt to tag before replying').click()
+
+    cy.openInboxSection('Theme')
+    cy.get('#theme-system').click()
+    cy.switchField('Show powered by').click()
+
+    cy.openInboxSection('Branding')
+    cy.editBrandingTheme('Light')
+    cy.get('input[name="config.branding.light.logo_url"]').clear().type(created.logoUrl)
+    setColor('config.branding.light.colors.primary', created.lightPrimary)
+    cy.get('#text-white').click()
+    cy.get('#bg-gradient').click()
+    cy.switchField('Fade background').click()
+
+    cy.editBrandingTheme('Dark')
+    setColor('config.branding.dark.colors.primary', created.darkPrimary)
+
+    cy.openInboxSection('Launcher position')
+    cy.editBrandingTheme('Light')
+    cy.get('input[name="config.branding.light.launcher.logo_url"]')
+      .clear()
+      .type(created.launcherLogo)
+    setColor('config.branding.light.launcher.color', created.lightLauncher)
+    cy.get('select[name="config.launcher.position"]').siblings('button[role="combobox"]').click()
+    cy.get('[role="option"]').contains('Left').click()
+    cy.get('[role="option"]').should('not.exist')
+    cy.get('input[name="config.launcher.size"]').clear().type('72')
+    cy.get('input[name="config.launcher.icon_scale"]').clear().type('80')
+    cy.get('input[name="config.launcher.spacing.side"]').clear().type('30')
+    cy.get('input[name="config.launcher.spacing.bottom"]').clear().type('40')
+
+    cy.openInboxSection('Reply previews')
+    cy.switchField('Mobile').click()
+    cy.get('input[name="config.previews.auto_hide_seconds"]').clear().type('45')
+
+    cy.openInboxSection('Messages')
+    cy.get('textarea[name="config.greeting_message"]').clear().type(created.greeting)
+    cy.get('textarea[name="config.introduction_message"]').clear().type(created.introduction)
+    cy.get('textarea[name="config.chat_introduction"]').clear().type(created.chatIntroduction)
+
+    cy.openInboxSection('Notice banner')
+    cy.switchField('Enable notice banner').click()
+    cy.get('textarea[name="config.notice_banner.text"]').clear().type(created.notice)
+
+    cy.openInboxSection('Features')
+    cy.switchField('Emoji support').click()
+
+    cy.openInboxSection('Office hours')
+    cy.switchField('Show office hours in chat').click()
+    cy.get('input[name="config.chat_reply_expectation_message"]')
+      .clear()
+      .type(created.replyExpectation)
+
+    cy.openInboxSection('Users')
+    cy.get('input[name="config.visitors.start_conversation_button_text"]')
+      .clear()
+      .type(created.visitorButton)
+    cy.get('textarea[name="config.visitors.quick_replies"]').clear().type('V one\nV two')
+    cy.audienceSwitch('visitors', 'Prevent multiple conversations').click()
+
+    cy.audienceTab('Users', 'Users').click()
+    cy.get('input[name="config.users.start_conversation_button_text"]')
+      .clear()
+      .type(created.userButton)
+    cy.get('textarea[name="config.users.quick_replies"]').clear().type('U one\nU two')
+
+    cy.openInboxSection('Security')
+    cy.get('input[name="secret"]').clear().type(created.secret)
+    cy.get('input[name="config.session_duration"]').clear().type(created.sessionDuration)
+    cy.get('textarea[name="config.trusted_domains"]').clear().type(created.trustedDomain)
+    cy.get('textarea[name="config.blocked_ips"]').clear().type(created.blockedIp)
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@createInbox').then(({ response }) => {
+      expect(response.statusCode).to.eq(200)
+      inboxId = response.body.data.id
+      const data = response.body.data
+      const c = data.config
+
+      expect(data.name, 'name').to.eq(created.name)
+      expect(data.csat_enabled, 'csat').to.eq(true)
+      expect(data.prompt_tags_on_reply, 'tag prompt').to.eq(true)
+      expect(c.brand_name, 'brand name').to.eq(created.brandName)
+      expect(c.website_url, 'website url').to.eq(created.websiteUrl)
+      expect(c.theme, 'theme').to.eq('system')
+      expect(c.show_powered_by, 'powered by').to.eq(false)
+
+      expect(c.branding.light.logo_url, 'light logo').to.eq(created.logoUrl)
+      expect(c.branding.light.colors.primary, 'light primary').to.eq(created.lightPrimary)
+      expect(c.branding.light.home_screen.header_text_color, 'light header text').to.eq('white')
+      expect(c.branding.light.home_screen.background.type, 'light background').to.eq('gradient')
+      expect(c.branding.light.home_screen.fade_background, 'fade').to.eq(true)
+      expect(c.branding.dark.colors.primary, 'dark primary').to.eq(created.darkPrimary)
+      expect(c.branding.light.launcher.logo_url, 'launcher logo').to.eq(created.launcherLogo)
+      expect(c.branding.light.launcher.color, 'launcher color').to.eq(created.lightLauncher)
+
+      expect(c.launcher.position, 'position').to.eq('left')
+      expect(c.launcher.size, 'size').to.eq(72)
+      expect(c.launcher.icon_scale, 'icon scale').to.eq(80)
+      expect(c.launcher.spacing.side, 'side spacing').to.eq(30)
+      expect(c.launcher.spacing.bottom, 'bottom spacing').to.eq(40)
+
+      expect(c.previews.mobile, 'mobile previews').to.eq(false)
+      expect(c.previews.auto_hide_seconds, 'auto hide').to.eq(45)
+
+      expect(c.greeting_message, 'greeting').to.eq(created.greeting)
+      expect(c.introduction_message, 'introduction').to.eq(created.introduction)
+      expect(c.chat_introduction, 'chat introduction').to.eq(created.chatIntroduction)
+      expect(c.notice_banner.enabled, 'notice enabled').to.eq(true)
+      expect(c.notice_banner.text, 'notice text').to.eq(created.notice)
+
+      expect(c.features.emoji, 'emoji').to.eq(false)
+      expect(c.show_office_hours_in_chat, 'office hours').to.eq(true)
+      expect(c.chat_reply_expectation_message, 'reply expectation').to.eq(created.replyExpectation)
+
+      expect(c.visitors.start_conversation_button_text, 'visitor button').to.eq(
+        created.visitorButton
+      )
+      expect(c.visitors.quick_replies, 'visitor replies').to.deep.eq(['V one', 'V two'])
+      expect(c.visitors.prevent_multiple_conversations, 'visitor prevent multiple').to.eq(true)
+      expect(c.users.start_conversation_button_text, 'user button').to.eq(created.userButton)
+      expect(c.users.quick_replies, 'user replies').to.deep.eq(['U one', 'U two'])
+
+      expect(c.session_duration, 'session').to.eq(created.sessionDuration)
+      expect(c.trusted_domains, 'trusted domains').to.deep.eq([created.trustedDomain])
+      expect(c.blocked_ips, 'blocked ips').to.deep.eq([created.blockedIp])
+    })
+  })
+
+  it('loads every saved value back into the edit form', () => {
+    expect(inboxId, 'inbox from the create step').to.be.a('number')
+    cy.visit(`${listPath}/${inboxId}/edit`)
+
+    cy.openInboxSection('General')
+    cy.get('input[name="name"]').should('have.value', created.name)
+    cy.get('input[name="config.brand_name"]').should('have.value', created.brandName)
+    cy.get('input[name="config.website_url"]').should('have.value', created.websiteUrl)
+    cy.switchField('CSAT Surveys').should('have.attr', 'data-state', 'checked')
+    cy.switchField('Prompt to tag before replying').should('have.attr', 'data-state', 'checked')
+
+    cy.openInboxSection('Theme')
+    cy.get('#theme-system').should('have.attr', 'data-state', 'checked')
+    cy.switchField('Show powered by').should('have.attr', 'data-state', 'unchecked')
+
+    cy.openInboxSection('Branding')
+    cy.editBrandingTheme('Light')
+    cy.get('input[name="config.branding.light.logo_url"]').should('have.value', created.logoUrl)
+    cy.get('input[name="config.branding.light.colors.primary"]').should(
+      'have.value',
+      created.lightPrimary
+    )
+    cy.get('#text-white').should('have.attr', 'data-state', 'checked')
+    cy.get('#bg-gradient').should('have.attr', 'data-state', 'checked')
+    cy.editBrandingTheme('Dark')
+    cy.get('input[name="config.branding.dark.colors.primary"]').should(
+      'have.value',
+      created.darkPrimary
+    )
+
+    cy.openInboxSection('Launcher position')
+    cy.get('select[name="config.launcher.position"]').should('have.value', 'left')
+    cy.get('input[name="config.launcher.size"]').should('have.value', '72')
+    cy.get('input[name="config.launcher.icon_scale"]').should('have.value', '80')
+    cy.get('input[name="config.launcher.spacing.side"]').should('have.value', '30')
+    cy.get('input[name="config.launcher.spacing.bottom"]').should('have.value', '40')
+
+    cy.openInboxSection('Reply previews')
+    cy.switchField('Mobile').should('have.attr', 'data-state', 'unchecked')
+    cy.get('input[name="config.previews.auto_hide_seconds"]').should('have.value', '45')
+
+    cy.openInboxSection('Messages')
+    cy.get('textarea[name="config.greeting_message"]').should('have.value', created.greeting)
+    cy.get('textarea[name="config.introduction_message"]').should(
+      'have.value',
+      created.introduction
+    )
+    cy.get('textarea[name="config.chat_introduction"]').should(
+      'have.value',
+      created.chatIntroduction
+    )
+
+    cy.openInboxSection('Notice banner')
+    cy.get('textarea[name="config.notice_banner.text"]').should('have.value', created.notice)
+
+    cy.openInboxSection('Office hours')
+    cy.get('input[name="config.chat_reply_expectation_message"]').should(
+      'have.value',
+      created.replyExpectation
+    )
+
+    cy.openInboxSection('Users')
+    cy.get('input[name="config.visitors.start_conversation_button_text"]').should(
+      'have.value',
+      created.visitorButton
+    )
+    cy.get('textarea[name="config.visitors.quick_replies"]').should('have.value', 'V one\nV two')
+    cy.audienceTab('Users', 'Users').click()
+    cy.get('input[name="config.users.start_conversation_button_text"]').should(
+      'have.value',
+      created.userButton
+    )
+
+    cy.openInboxSection('Security')
+    cy.get('input[name="secret"]').should('have.value', '••••••••••')
+    cy.get('input[name="config.session_duration"]').should('have.value', created.sessionDuration)
+    cy.get('textarea[name="config.trusted_domains"]').should('have.value', created.trustedDomain)
+    cy.get('textarea[name="config.blocked_ips"]').should('have.value', created.blockedIp)
+  })
+
+  it('changes every field from the edit form', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+    cy.visit(`${listPath}/${inboxId}/edit`)
+
+    cy.openInboxSection('General')
+    cy.get('input[name="name"]').clear().type(edited.name)
+    cy.get('input[name="config.brand_name"]').clear().type(edited.brandName)
+    cy.get('input[name="config.website_url"]').clear().type(edited.websiteUrl)
+    cy.switchField('CSAT Surveys').click()
+    cy.switchField('Prompt to tag before replying').click()
+
+    cy.openInboxSection('Theme')
+    cy.get('#theme-light').click()
+    cy.switchField('Show powered by').click()
+
+    cy.openInboxSection('Branding')
+    cy.editBrandingTheme('Light')
+    setColor('config.branding.light.colors.primary', edited.lightPrimary)
+    cy.get('#text-black').click()
+    cy.get('#bg-solid').click()
+    cy.switchField('Fade background').click()
+
+    cy.openInboxSection('Launcher position')
+    cy.get('select[name="config.launcher.position"]').siblings('button[role="combobox"]').click()
+    cy.get('[role="option"]').contains('Right').click()
+    cy.get('[role="option"]').should('not.exist')
+    cy.get('input[name="config.launcher.size"]').clear().type('50')
+    cy.get('input[name="config.launcher.icon_scale"]').clear().type('60')
+    cy.get('input[name="config.launcher.spacing.side"]').clear().type('10')
+    cy.get('input[name="config.launcher.spacing.bottom"]').clear().type('12')
+
+    cy.openInboxSection('Reply previews')
+    cy.switchField('Desktop').click()
+    cy.get('input[name="config.previews.auto_hide_seconds"]').clear().type('15')
+
+    cy.openInboxSection('Messages')
+    cy.get('textarea[name="config.greeting_message"]').clear().type(edited.greeting)
+    cy.get('textarea[name="config.introduction_message"]').clear().type(edited.introduction)
+    cy.get('textarea[name="config.chat_introduction"]').clear().type(edited.chatIntroduction)
+
+    cy.openInboxSection('Notice banner')
+    cy.get('textarea[name="config.notice_banner.text"]').clear().type(edited.notice)
+
+    cy.openInboxSection('Features')
+    cy.switchField('File upload').click()
+    cy.switchField('Download transcript').click()
+
+    cy.openInboxSection('Office hours')
+    cy.get('input[name="config.chat_reply_expectation_message"]')
+      .clear()
+      .type(edited.replyExpectation)
+
+    cy.openInboxSection('Users')
+    cy.get('input[name="config.visitors.start_conversation_button_text"]')
+      .clear()
+      .type(edited.visitorButton)
+    cy.audienceSwitch('visitors', 'Launch directly into conversation').click()
+    cy.audienceTab('Users', 'Users').click()
+    cy.get('input[name="config.users.start_conversation_button_text"]')
+      .clear()
+      .type(edited.userButton)
+
+    cy.openInboxSection('Security')
+    cy.get('input[name="config.session_duration"]').clear().type(edited.sessionDuration)
+    cy.get('textarea[name="config.trusted_domains"]').clear().type(edited.trustedDomain)
+    cy.get('textarea[name="config.blocked_ips"]').clear().type(edited.blockedIp)
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@updateInbox').then(({ response }) => {
+      expect(response.statusCode).to.eq(200)
+      const data = response.body.data
+      const c = data.config
+
+      expect(data.name, 'name').to.eq(edited.name)
+      expect(data.csat_enabled, 'csat off again').to.eq(false)
+      expect(data.prompt_tags_on_reply, 'tag prompt off again').to.eq(false)
+      expect(c.brand_name, 'brand name').to.eq(edited.brandName)
+      expect(c.website_url, 'website url').to.eq(edited.websiteUrl)
+      expect(c.theme, 'theme').to.eq('light')
+      expect(c.show_powered_by, 'powered by back on').to.eq(true)
+
+      expect(c.branding.light.colors.primary, 'light primary').to.eq(edited.lightPrimary)
+      expect(c.branding.light.home_screen.header_text_color, 'header text').to.eq('black')
+      expect(c.branding.light.home_screen.background.type, 'background').to.eq('solid')
+      expect(c.branding.light.home_screen.fade_background, 'fade off again').to.eq(false)
+      // The dark half is untouched by this pass and has to survive it.
+      expect(c.branding.dark.colors.primary, 'dark primary kept').to.eq(created.darkPrimary)
+
+      expect(c.launcher.position, 'position').to.eq('right')
+      expect(c.launcher.size, 'size').to.eq(50)
+      expect(c.launcher.icon_scale, 'icon scale').to.eq(60)
+      expect(c.launcher.spacing.side, 'side spacing').to.eq(10)
+      expect(c.launcher.spacing.bottom, 'bottom spacing').to.eq(12)
+
+      expect(c.previews.desktop, 'desktop previews').to.eq(false)
+      expect(c.previews.auto_hide_seconds, 'auto hide').to.eq(15)
+
+      expect(c.greeting_message, 'greeting').to.eq(edited.greeting)
+      expect(c.introduction_message, 'introduction').to.eq(edited.introduction)
+      expect(c.chat_introduction, 'chat introduction').to.eq(edited.chatIntroduction)
+      expect(c.notice_banner.text, 'notice text').to.eq(edited.notice)
+
+      expect(c.features.file_upload, 'file upload').to.eq(false)
+      expect(c.features.transcript, 'transcript').to.eq(false)
+      expect(c.chat_reply_expectation_message, 'reply expectation').to.eq(edited.replyExpectation)
+
+      expect(c.visitors.start_conversation_button_text, 'visitor button').to.eq(
+        edited.visitorButton
+      )
+      expect(c.visitors.direct_to_conversation, 'visitor direct').to.eq(true)
+      expect(c.users.start_conversation_button_text, 'user button').to.eq(edited.userButton)
+
+      expect(c.session_duration, 'session').to.eq(edited.sessionDuration)
+      expect(c.trusted_domains, 'trusted domains').to.deep.eq([edited.trustedDomain])
+      expect(c.blocked_ips, 'blocked ips').to.deep.eq([edited.blockedIp])
+    })
+  })
+
+  it('keeps the secret when it is left masked and replaces it when retyped', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('General')
+    cy.get('input[name="name"]').clear().type(`${edited.name} b`)
+    cy.get('button[type="submit"]').click()
+    cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
+
+    cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('Security')
+    cy.get('input[name="secret"]').should('have.value', '••••••••••')
+  })
+
+  it('adds and removes home screen apps', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('Home screen apps')
+
+    cy.contains('button', 'Add announcement').click()
+    cy.get('input[placeholder="Title"]').type(`Announcement ${stamp}`)
+    cy.get('input[placeholder="Cover image URL"]').type('https://cypress.test/cover.png')
+    cy.get('input[placeholder="Link URL"]').type('https://cypress.test/read')
+
+    cy.contains('button', 'Add external link').click()
+    cy.get('input[placeholder="Link Text"]').type(`Link ${stamp}`)
+    cy.get('input[placeholder="https://example.com"]').last().type('https://cypress.test/docs')
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@updateInbox').then(({ response }) => {
+      const apps = response.body.data.config.home_apps
+      expect(apps.map((a) => a.type), 'app order').to.deep.eq(['announcement', 'external_link'])
+    })
+
+    cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('Home screen apps')
+    cy.get('[data-section="homeApps"] button[aria-label="Remove"]').first().click()
+    cy.get('[data-section="homeApps"] button[aria-label="Remove"]').first().click()
+    cy.get('button[type="submit"]').click()
+    cy.wait('@updateInbox').then(({ response }) => {
+      expect(response.body.data.config.home_apps || []).to.have.length(0)
+    })
+  })
+
+  it('turns the pre-chat form on and saves its fields', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('Pre-chat form')
+    cy.get('[data-section="prechat"] button[role="switch"]').first().click()
+    cy.inboxSection('Pre-chat form').contains('Form fields').should('be.visible')
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@updateInbox').then(({ response }) => {
+      const prechat = response.body.data.config.prechat_form
+      expect(prechat.visitors.enabled, 'prechat enabled').to.eq(true)
+      expect(prechat.visitors.fields.length, 'default fields').to.be.greaterThan(0)
+    })
+  })
+
+  it('saves the selects and switches that the other steps leave alone', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+    cy.visit(`${listPath}/${inboxId}/edit`)
+
+    cy.openInboxSection('General')
+    cy.get('select[name="config.language"]').siblings('button[role="combobox"]').click()
+    cy.get('[role="option"]').contains('Auto-detect').click()
+    cy.get('[role="option"]').should('not.exist')
+    cy.get('select[name="config.fallback_language"]')
+      .siblings('button[role="combobox"]')
+      .should('exist')
+
+    cy.openInboxSection('Conversation continuity email inbox')
+    cy.get('select[name="linked_email_inbox_id"]').siblings('button[role="combobox"]').click()
+    cy.get('[role="option"]').not(':contains("None")').first().click()
+    cy.get('[role="option"]').should('not.exist')
+    cy.get('input[name="config.continuity.offline_threshold"]').clear().type('12m')
+    cy.get('input[name="config.continuity.max_messages_per_email"]').clear().type('7')
+    cy.get('input[name="config.continuity.min_email_interval"]').clear().type('9m')
+
+    cy.openInboxSection('Reply previews')
+    cy.get('select[name="config.previews.content"]').siblings('button[role="combobox"]').click()
+    cy.get('[role="option"]').contains('Generic notification').click()
+    cy.get('[role="option"]').should('not.exist')
+
+    cy.openInboxSection('Office hours')
+    cy.switchField('Show office hours after team assignment').click()
+
+    cy.openInboxSection('Users')
+    cy.audienceSwitch('visitors', 'Allow start conversation').click()
+    cy.audienceSwitch('visitors', 'Prevent replying to closed conversations').click()
+    cy.audienceTab('Users', 'Users').click()
+    cy.audienceSwitch('users', 'Launch directly into conversation').click()
+    cy.audienceSwitch('users', 'Prevent multiple conversations').click()
+    cy.audienceSwitch('users', 'Allow start conversation').click()
+    cy.audienceSwitch('users', 'Prevent replying to closed conversations').click()
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@updateInbox').then(({ response }) => {
+      expect(response.statusCode).to.eq(200)
+      const data = response.body.data
+      const c = data.config
+
+      expect(c.language, 'language').to.eq('auto')
+      expect(data.linked_email_inbox_id, 'linked email inbox').to.be.a('number')
+      expect(c.continuity.offline_threshold, 'offline threshold').to.eq('12m')
+      expect(c.continuity.max_messages_per_email, 'max messages').to.eq(7)
+      expect(c.continuity.min_email_interval, 'min interval').to.eq('9m')
+      expect(c.previews.content, 'preview content').to.eq('generic')
+      expect(c.show_office_hours_after_assignment, 'office hours after assignment').to.eq(true)
+      expect(c.visitors.allow_start_conversation, 'visitor start').to.eq(false)
+      expect(c.visitors.prevent_reply_to_closed_conversation, 'visitor closed replies').to.eq(true)
+      expect(c.users.direct_to_conversation, 'user direct').to.eq(true)
+      expect(c.users.prevent_multiple_conversations, 'user prevent multiple').to.eq(true)
+      expect(c.users.allow_start_conversation, 'user start').to.eq(false)
+      expect(c.users.prevent_reply_to_closed_conversation, 'user closed replies').to.eq(true)
+    })
+  })
+
+  it('rejects out-of-range and malformed values in every section that validates', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    const cases = [
+      ['Launcher position', 'input[name="config.launcher.size"]', '120'],
+      ['Launcher position', 'input[name="config.launcher.icon_scale"]', '5'],
+      ['Launcher position', 'input[name="config.launcher.spacing.side"]', '900'],
+      ['Reply previews', 'input[name="config.previews.auto_hide_seconds"]', '999'],
+      ['Security', 'input[name="config.session_duration"]', 'nope'],
+      ['General', 'input[name="config.website_url"]', 'not-a-url']
+    ]
+
+    cases.forEach(([section, selector, value]) => {
+      cy.visit(`${listPath}/${inboxId}/edit`)
+      cy.openInboxSection(section)
+      cy.get(selector).clear().type(value)
+      cy.get('button[type="submit"]').click()
+      cy.get('@updateInbox.all').should('have.length', 0)
+      cy.get(selector).should('be.visible')
+    })
+  })
+
+  it('deletes the inbox', () => {
+    cy.intercept('DELETE', `**/api/v1/inboxes/${inboxId}`).as('deleteInbox')
+
+    cy.visit(listPath)
+    cy.get('input[placeholder="Search"]').clear().type(edited.name)
+    cy.contains('tr', edited.name).find('button[aria-haspopup="menu"]').click()
+    cy.get('[role="menuitem"]').contains('Delete').click()
+    cy.get('[role="alertdialog"]').contains('button', 'Delete').click()
+    cy.wait('@deleteInbox').its('response.statusCode').should('eq', 200)
+  })
+})
diff --git a/frontend/cypress/e2e/ui/livechatFormLayout.cy.js b/frontend/cypress/e2e/ui/livechatFormLayout.cy.js
new file mode 100644
index 00000000..9ef59a0f
--- /dev/null
+++ b/frontend/cypress/e2e/ui/livechatFormLayout.cy.js
@@ -0,0 +1,228 @@
+// The steps run in order and share the inbox created by the first one.
+
+const stamp = Date.now()
+const inboxName = `Cypress Layout ${stamp}`
+const brandName = `Cypress Layout Brand ${stamp}`
+const listPath = '/admin/inboxes'
+const newPath = '/admin/inboxes/new'
+
+const TABS = ['General', 'Appearance', 'Content', 'Conversations', 'Setup']
+
+const SECTIONS = {
+  General: ['General', 'Conversation continuity email inbox'],
+  Appearance: ['Theme', 'Branding', 'Launcher position', 'Reply previews'],
+  Content: ['Messages', 'Notice banner', 'Home screen apps', 'Help center', 'Proactive messages'],
+  Conversations: ['Features', 'Office hours', 'Pre-chat form', 'Users'],
+  Setup: ['Installation', 'Identity verification', 'JavaScript API', 'Security']
+}
+
+const openTab = (label) => cy.get('form').contains('[role="tab"]', new RegExp(`^\\s*${label}\\s*$`)).click()
+
+const sectionTrigger = (label) =>
+  cy.get('form').contains('button[aria-expanded]', new RegExp(`^\\s*${label}\\s*$`))
+
+const openNewForm = () => {
+  cy.visit(newPath)
+  cy.contains('Create a live chat inbox').click()
+}
+
+describe('Live chat inbox form layout', () => {
+  let inboxId
+
+  beforeEach(() => {
+    Cypress.on('uncaught:exception', (err) => !err.message.includes("reading 'focus'"))
+    cy.viewport(1280, 900)
+    cy.login()
+  })
+
+  it('creates an inbox with fields spread across every tab', () => {
+    cy.intercept('POST', '**/api/v1/inboxes').as('createInbox')
+
+    openNewForm()
+    cy.openInboxSection('General')
+    cy.get('input[name="name"]').type(inboxName)
+    cy.get('input[name="config.brand_name"]').type(brandName)
+
+    cy.openInboxSection('Notice banner')
+    cy.inboxSection('Notice banner').find('button[role="switch"]').click()
+    cy.get('textarea[name="config.notice_banner.text"]').clear().type('Cypress layout notice')
+
+    cy.openInboxSection('Reply previews')
+    cy.get('input[name="config.previews.auto_hide_seconds"]').clear().type('30')
+
+    cy.openInboxSection('Users')
+    cy.get('textarea[name="config.visitors.quick_replies"]').clear().type('One\nTwo\nThree')
+
+    cy.openInboxSection('Security')
+    cy.get('input[name="config.session_duration"]').clear().type('6h')
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@createInbox').then(({ response }) => {
+      expect(response.statusCode).to.eq(200)
+      inboxId = response.body.data.id
+      const config = response.body.data.config
+      expect(config.notice_banner.text, 'notice text').to.eq('Cypress layout notice')
+      expect(config.previews.auto_hide_seconds, 'auto hide').to.eq(30)
+      expect(config.visitors.quick_replies, 'quick replies').to.deep.eq(['One', 'Two', 'Three'])
+      expect(config.session_duration, 'session duration').to.eq('6h')
+    })
+  })
+
+  it('shows every tab and its sections, all collapsed on load', () => {
+    cy.visit(`${listPath}/${inboxId}/edit`)
+
+    TABS.forEach((tab) => {
+      openTab(tab)
+      SECTIONS[tab].forEach((section) => {
+        sectionTrigger(section).should('be.visible').and('have.attr', 'aria-expanded', 'false')
+      })
+    })
+  })
+
+  it('opens one section at a time', () => {
+    cy.visit(`${listPath}/${inboxId}/edit`)
+
+    cy.openInboxSection('General')
+    sectionTrigger('General').should('have.attr', 'aria-expanded', 'true')
+
+    cy.openInboxSection('Conversation continuity email inbox')
+    sectionTrigger('General').should('have.attr', 'aria-expanded', 'false')
+
+    sectionTrigger('Conversation continuity email inbox').click()
+    sectionTrigger('Conversation continuity email inbox').should(
+      'have.attr',
+      'aria-expanded',
+      'false'
+    )
+  })
+
+  it('keeps values from collapsed sections on submit', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('Office hours')
+    cy.switchField('Show office hours in chat').click()
+    cy.get('input[name="config.chat_reply_expectation_message"]')
+      .clear()
+      .type('Cypress replies fast')
+
+    // Everything typed above is now inside a collapsed section.
+    cy.openInboxSection('Security')
+    cy.get('button[type="submit"]').click()
+
+    cy.wait('@updateInbox').then(({ response }) => {
+      expect(response.statusCode).to.eq(200)
+      expect(response.body.data.config.chat_reply_expectation_message).to.eq('Cypress replies fast')
+    })
+  })
+
+  it('opens the section holding the first error on a failed submit', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('Security')
+    cy.get('input[name="config.session_duration"]').clear().type('not-a-duration')
+
+    cy.openInboxSection('Messages')
+    cy.get('button[type="submit"]').click()
+
+    cy.get('form')
+      .contains('[role="tab"]', /^\s*Setup\s*$/)
+      .should('have.attr', 'data-state', 'active')
+    sectionTrigger('Security').should('have.attr', 'aria-expanded', 'true')
+    cy.get('input[name="config.session_duration"]').should('be.visible')
+    cy.get('@updateInbox.all').should('have.length', 0)
+  })
+
+  it('lands on the right tab for a link that uses an old tab name', () => {
+    cy.visit(`${listPath}/${inboxId}/edit?tab=appearance`)
+    cy.get('form')
+      .contains('[role="tab"]', /^\s*Appearance\s*$/)
+      .should('have.attr', 'data-state', 'active')
+    sectionTrigger('Branding').should('have.attr', 'aria-expanded', 'true')
+
+    cy.visit(`${listPath}/${inboxId}/edit?tab=installation`)
+    cy.get('form')
+      .contains('[role="tab"]', /^\s*Setup\s*$/)
+      .should('have.attr', 'data-state', 'active')
+    sectionTrigger('Installation').should('have.attr', 'aria-expanded', 'true')
+  })
+
+  it('keeps both branding themes when the light and dark tabs are switched', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('Theme')
+    cy.get('#theme-system').click()
+
+    cy.openInboxSection('Branding')
+    cy.editBrandingTheme('Light')
+    cy.get('#bg-gradient').click()
+    cy.get('#text-black').click()
+
+    cy.editBrandingTheme('Dark')
+    cy.get('#text-white').click()
+
+    // Light's background type and text color must survive the round trip.
+    cy.editBrandingTheme('Light')
+    cy.get('#bg-gradient').should('have.attr', 'data-state', 'checked')
+    cy.get('#text-black').should('have.attr', 'data-state', 'checked')
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@updateInbox').then(({ response }) => {
+      const branding = response.body.data.config.branding
+      expect(branding.light.home_screen.background.type, 'light background').to.eq('gradient')
+      expect(branding.light.home_screen.header_text_color, 'light text').to.eq('black')
+      expect(branding.dark.home_screen.header_text_color, 'dark text').to.eq('white')
+    })
+  })
+
+  it('renders the preview with its own theme toggle', () => {
+    cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.get('[data-preview-theme="light"]').should('be.visible')
+
+    cy.openInboxSection('Branding')
+    cy.editBrandingTheme('Dark')
+
+    cy.get('[data-preview-theme="light"]').should('have.attr', 'data-state', 'active')
+    cy.get('[data-preview-theme="dark"]').click()
+    cy.get('[data-preview-theme="dark"]').should('have.attr', 'data-state', 'active')
+  })
+
+  it('rejects more than six quick replies', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('Users')
+    cy.get('textarea[name="config.visitors.quick_replies"]')
+      .clear()
+      .type('a\nb\nc\nd\ne\nf\ng')
+
+    cy.get('button[type="submit"]').click()
+    cy.inboxSection('Users').contains('Add up to 6 quick replies.').should('be.visible')
+    cy.get('@updateInbox.all').should('have.length', 0)
+  })
+
+  it('shows the inbox uuid in the installation and identity snippets', () => {
+    cy.api('GET', `/api/v1/inboxes/${inboxId}`).then(({ body }) => {
+      const uuid = body.data.uuid
+      cy.visit(`${listPath}/${inboxId}/edit`)
+
+      cy.openInboxSection('Installation')
+      cy.inboxSection('Installation').should('contain', uuid)
+
+      cy.openInboxSection('Identity verification')
+      cy.inboxSection('Identity verification').should('contain', 'external_user_id')
+
+      cy.openInboxSection('JavaScript API')
+      cy.inboxSection('JavaScript API').should('contain', 'Libredesk')
+    })
+  })
+
+  after(() => {
+    if (inboxId) {
+      cy.login()
+      cy.api('DELETE', `/api/v1/inboxes/${inboxId}`, null, { failOnStatusCode: false })
+    }
+  })
+})
diff --git a/frontend/cypress/e2e/ui/livechatInboxForm.cy.js b/frontend/cypress/e2e/ui/livechatInboxForm.cy.js
index 2a55e7a3..48bba2e6 100644
--- a/frontend/cypress/e2e/ui/livechatInboxForm.cy.js
+++ b/frontend/cypress/e2e/ui/livechatInboxForm.cy.js
@@ -18,12 +18,10 @@ const listPath = '/admin/inboxes'
 
 const filterList = (text) => cy.get('input[placeholder="Search"]').clear().type(text)
 
-// Tab panels stay in the DOM and are only hidden, so a field is reachable when its tab is open.
-const openTab = (label) => cy.get('[role="tab"]').contains(label).click()
-
 const openNewForm = () => {
   cy.visit(newPath)
   cy.contains('Create a live chat inbox').click()
+  cy.openInboxSection('General')
 }
 
 describe('Live chat inbox form', () => {
@@ -45,7 +43,7 @@ describe('Live chat inbox form', () => {
     cy.get('input[name="config.brand_name"]').type(brandName)
     cy.get('input[name="config.website_url"]').type(websiteUrl)
 
-    openTab('Appearance')
+    cy.openInboxSection('Launcher position')
     cy.get('input[name="config.launcher.spacing.side"]').clear().type('35')
     cy.get('input[name="config.launcher.spacing.bottom"]').clear().type('45')
     cy.get('select[name="config.launcher.position"]')
@@ -53,11 +51,11 @@ describe('Live chat inbox form', () => {
       .click()
     cy.get('[role="option"]').contains('Left').click()
 
-    openTab('Messages')
+    cy.openInboxSection('Messages')
     cy.get('textarea[name="config.greeting_message"]').clear().type(greeting)
     cy.get('textarea[name="config.chat_introduction"]').clear().type(chatIntroduction)
 
-    openTab('Security')
+    cy.openInboxSection('Security')
     cy.get('input[name="secret"]').type(secret)
     cy.get('input[name="config.session_duration"]').clear().type('4h')
     cy.get('textarea[name="config.trusted_domains"]').type(trustedDomain)
@@ -77,21 +75,22 @@ describe('Live chat inbox form', () => {
     expect(inboxId, 'inbox from the create step').to.be.a('number')
 
     cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('General')
 
     cy.get('input[name="name"]').should('have.value', inboxName)
     cy.get('input[name="config.brand_name"]').should('have.value', brandName)
     cy.get('input[name="config.website_url"]').should('have.value', websiteUrl)
 
-    openTab('Appearance')
+    cy.openInboxSection('Launcher position')
     cy.get('input[name="config.launcher.spacing.side"]').should('have.value', '35')
     cy.get('input[name="config.launcher.spacing.bottom"]').should('have.value', '45')
     cy.get('select[name="config.launcher.position"]').should('have.value', 'left')
 
-    openTab('Messages')
+    cy.openInboxSection('Messages')
     cy.get('textarea[name="config.greeting_message"]').should('have.value', greeting)
     cy.get('textarea[name="config.chat_introduction"]').should('have.value', chatIntroduction)
 
-    openTab('Security')
+    cy.openInboxSection('Security')
     cy.get('input[name="config.session_duration"]').should('have.value', '4h')
     cy.get('textarea[name="config.trusted_domains"]').should('have.value', trustedDomain)
     // The signing secret comes back masked, never as the real value.
@@ -102,17 +101,19 @@ describe('Live chat inbox form', () => {
     cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
 
     cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('General')
     cy.get('input[name="name"]').should('have.value', inboxName).clear().type(renamedInbox)
 
-    openTab('Messages')
+    cy.openInboxSection('Messages')
     cy.get('textarea[name="config.greeting_message"]').clear().type(`${greeting} v2`)
 
     cy.get('button[type="submit"]').click()
     cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
 
     cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('General')
     cy.get('input[name="name"]').should('have.value', renamedInbox)
-    openTab('Messages')
+    cy.openInboxSection('Messages')
     cy.get('textarea[name="config.greeting_message"]').should('have.value', `${greeting} v2`)
   })
 
@@ -135,13 +136,13 @@ describe('Live chat inbox form', () => {
     cy.get('input[name="config.brand_name"]').type(brandName)
     cy.get('input[name="config.website_url"]').type('not-a-url')
 
-    openTab('Security')
+    cy.openInboxSection('Security')
     cy.get('button[type="submit"]').click()
 
     cy.contains('Invalid URL').scrollIntoView().should('be.visible')
     // The offending field is on another tab, so the form has to switch back to it.
     cy.get('input[name="config.website_url"]').scrollIntoView().should('be.visible')
-    cy.get('[role="tab"][data-state="active"]').should('not.contain', 'Security')
+    cy.get('[role="tab"][data-state="active"]').should('not.contain', 'Setup')
     cy.get('@createInbox.all').should('have.length', 0)
   })
 
@@ -149,7 +150,7 @@ describe('Live chat inbox form', () => {
     cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
 
     cy.visit(`${listPath}/${inboxId}/edit`)
-    openTab('Appearance')
+    cy.openInboxSection('Home screen apps')
     cy.contains('button', 'Add announcement').click()
     cy.get('input[placeholder="Title"]').type(homeAppTitle)
     cy.get('input[placeholder="Cover image URL"]').type('https://cypress.test/cover.png')
@@ -158,16 +159,18 @@ describe('Live chat inbox form', () => {
     cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
 
     cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('General')
     cy.get('input[name="config.brand_name"]').clear().type(editedBrandName)
-    openTab('Appearance')
+    cy.openInboxSection('Home screen apps')
     cy.get('input[placeholder="Title"]').clear().type(editedHomeAppTitle)
 
     cy.get('button[type="submit"]').click()
     cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
 
     cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('General')
     cy.get('input[name="config.brand_name"]').should('have.value', editedBrandName)
-    openTab('Appearance')
+    cy.openInboxSection('Home screen apps')
     cy.get('input[placeholder="Title"]').should('have.value', editedHomeAppTitle)
   })
 
diff --git a/frontend/cypress/e2e/ui/livechatThemeBranding.cy.js b/frontend/cypress/e2e/ui/livechatThemeBranding.cy.js
new file mode 100644
index 00000000..5941eb06
--- /dev/null
+++ b/frontend/cypress/e2e/ui/livechatThemeBranding.cy.js
@@ -0,0 +1,136 @@
+// The steps run in order and share the inbox created by the first one.
+
+const stamp = Date.now()
+const inboxName = `Cypress Theme ${stamp}`
+const brandName = `Cypress Theme Brand ${stamp}`
+const listPath = '/admin/inboxes'
+const newPath = '/admin/inboxes/new'
+
+const lightPrimary = '#123456'
+const darkPrimary = '#abcdef'
+
+const openNewForm = () => {
+  cy.visit(newPath)
+  cy.contains('Create a live chat inbox').click()
+  cy.openInboxSection('General')
+}
+
+describe('Live chat theme and branding', () => {
+  let inboxId
+
+  beforeEach(() => {
+    Cypress.on('uncaught:exception', (err) => !err.message.includes("reading 'focus'"))
+    cy.viewport(1280, 900)
+    cy.login()
+  })
+
+  it('saves a separate primary color for each theme', () => {
+    cy.intercept('POST', '**/api/v1/inboxes').as('createInbox')
+
+    openNewForm()
+    cy.get('input[name="name"]').type(inboxName)
+    cy.get('input[name="config.brand_name"]').type(brandName)
+
+    cy.openInboxSection('Theme')
+    cy.get('#theme-system').click()
+
+    cy.openInboxSection('Branding')
+    cy.editBrandingTheme('Light')
+    cy.get('input[name="config.branding.light.colors.primary"]')
+      .invoke('val', lightPrimary)
+      .trigger('input')
+
+    cy.editBrandingTheme('Dark')
+    cy.get('input[name="config.branding.dark.colors.primary"]')
+      .invoke('val', darkPrimary)
+      .trigger('input')
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@createInbox').then(({ response }) => {
+      expect(response.statusCode).to.eq(200)
+      inboxId = response.body.data.id
+      const branding = response.body.data.config.branding
+      expect(branding.light.colors.primary, 'light primary').to.eq(lightPrimary)
+      expect(branding.dark.colors.primary, 'dark primary').to.eq(darkPrimary)
+      expect(response.body.data.config.theme, 'theme').to.eq('system')
+    })
+  })
+
+  it('loads each theme back into its own tab', () => {
+    expect(inboxId, 'inbox from the create step').to.be.a('number')
+
+    cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('Branding')
+
+    cy.editBrandingTheme('Light')
+    cy.get('input[name="config.branding.light.colors.primary"]').should('have.value', lightPrimary)
+
+    cy.editBrandingTheme('Dark')
+    cy.get('input[name="config.branding.dark.colors.primary"]').should('have.value', darkPrimary)
+  })
+
+  it('seeds a dark background when the theme is switched away from light', () => {
+    cy.intercept('POST', '**/api/v1/inboxes').as('createSeeded')
+
+    openNewForm()
+    cy.get('input[name="name"]').type(`${inboxName} seeded`)
+    cy.get('input[name="config.brand_name"]').type(brandName)
+
+    cy.openInboxSection('Theme')
+    cy.get('#theme-dark').click()
+
+    cy.openInboxSection('Branding')
+    cy.get('input[name="config.branding.dark.home_screen.background.color"]').should(
+      'have.value',
+      '#1a1a1e'
+    )
+    cy.get('#text-white').should('have.attr', 'data-state', 'checked')
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@createSeeded').then(({ response }) => {
+      const branding = response.body.data.config.branding
+      expect(branding.dark.home_screen.header_text_color, 'dark header text').to.eq('white')
+      expect(branding.light.home_screen.header_text_color, 'light header text').to.eq('black')
+      cy.api('DELETE', `/api/v1/inboxes/${response.body.data.id}`, null, {
+        failOnStatusCode: false
+      })
+    })
+  })
+
+  it('rejects a launcher size and icon scale outside their range', () => {
+    cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('Launcher position')
+
+    cy.get('input[name="config.launcher.size"]').clear().type('120')
+    cy.get('button[type="submit"]').click()
+    cy.contains('40').should('exist')
+
+    cy.get('input[name="config.launcher.size"]').clear().type('64')
+    cy.get('input[name="config.launcher.icon_scale"]').clear().type('10')
+    cy.get('button[type="submit"]').click()
+    cy.contains('40').should('exist')
+  })
+
+  it('persists the launcher size and icon scale', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    cy.visit(`${listPath}/${inboxId}/edit`)
+    cy.openInboxSection('Launcher position')
+    cy.get('input[name="config.launcher.size"]').clear().type('72')
+    cy.get('input[name="config.launcher.icon_scale"]').clear().type('60')
+
+    cy.get('button[type="submit"]').click()
+    cy.wait('@updateInbox').then(({ response }) => {
+      expect(response.statusCode).to.eq(200)
+      expect(response.body.data.config.launcher.size, 'launcher size').to.eq(72)
+      expect(response.body.data.config.launcher.icon_scale, 'icon scale').to.eq(60)
+    })
+  })
+
+  after(() => {
+    if (inboxId) {
+      cy.login()
+      cy.api('DELETE', `/api/v1/inboxes/${inboxId}`, null, { failOnStatusCode: false })
+    }
+  })
+})
diff --git a/frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js b/frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js
index 6db7b495..e3d79b97 100644
--- a/frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js
+++ b/frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js
@@ -12,8 +12,6 @@ const collectionName = `Cypress Collection ${stamp}`
 const articleTitle = `Cypress Article ${stamp}`
 const listPath = '/admin/inboxes'
 
-const openTab = (label) => cy.get('[role="tab"]').contains(label).click()
-
 const selectOption = (trigger, option) => {
   cy.get(trigger).click()
   cy.get('[role="option"]').contains(option).click()
@@ -82,6 +80,7 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
 
     cy.visit('/admin/inboxes/new')
     cy.contains('Create a live chat inbox').click()
+    cy.openInboxSection('General')
     cy.get('input[name="name"]').type(inboxName)
     cy.get('input[name="config.brand_name"]').type(brandName)
     cy.get('button[type="submit"]').click()
@@ -108,6 +107,7 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
       cy.intercept('PUT', `**/api/v1/inboxes/${apiInboxId}`).as('updateApiInbox')
 
       editInbox(apiInboxId)
+      cy.openInboxSection('General')
       cy.get('input[name="config.website_url"]').type('https://cypress.test/api-inbox')
       cy.get('button[type="submit"]').click()
       cy.wait('@updateApiInbox').its('response.statusCode').should('eq', 200)
@@ -120,7 +120,7 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
     cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
 
     editInbox(inboxId)
-    openTab('Proactive messages')
+    cy.openInboxSection('Proactive messages')
     cy.contains('button', 'Add proactive message').click()
 
     cy.get('#campaign-name').clear().type(campaignName)
@@ -136,7 +136,7 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
     cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
 
     editInbox(inboxId)
-    openTab('Proactive messages')
+    cy.openInboxSection('Proactive messages')
     openCampaign(campaignName)
 
     cy.get('#campaign-name').should('have.value', campaignName)
@@ -155,7 +155,7 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
     cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
 
     editInbox(inboxId)
-    openTab('Proactive messages')
+    cy.openInboxSection('Proactive messages')
     openCampaign(campaignName)
     cy.get('#campaign-message').clear()
 
@@ -169,7 +169,7 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
     cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
 
     editInbox(inboxId)
-    openTab('Proactive messages')
+    cy.openInboxSection('Proactive messages')
     openCampaign(campaignName)
     cy.get('#campaign-repeat_hours').type('{selectall}9000')
 
@@ -183,7 +183,7 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
     cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
 
     editInbox(inboxId)
-    openTab('Proactive messages')
+    cy.openInboxSection('Proactive messages')
     openCampaign(campaignName)
     cy.get('[data-campaign-devices] button[role="switch"]').each(($switch) => {
       cy.wrap($switch).click()
@@ -195,11 +195,11 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
     cy.get('@updateInbox.all').should('have.length', 0)
   })
 
-  it('persists the enabled toggle and the order of two proactive messages', () => {
+  it('persists the enabled toggle and the saved order of two proactive messages', () => {
     cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
 
     editInbox(inboxId)
-    openTab('Proactive messages')
+    cy.openInboxSection('Proactive messages')
     cy.contains('button', 'Add proactive message').click()
     cy.get('#campaign-name').clear().type(secondCampaignName)
     cy.get('#campaign-message').clear().type(`Second message ${stamp}`)
@@ -209,7 +209,7 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
     cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
 
     editInbox(inboxId)
-    openTab('Proactive messages')
+    cy.openInboxSection('Proactive messages')
     // A new proactive message starts paused, so one click enables it.
     cy.contains('button', campaignName)
       .parents('.border')
@@ -217,18 +217,12 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
       .find('button[role="switch"][aria-label="Enabled"]')
       .should('have.attr', 'data-state', 'unchecked')
       .click()
-    cy.contains('button', secondCampaignName)
-      .parents('.border')
-      .first()
-      .find('button[aria-label="Move up"]')
-      .click()
-
     cy.get('button[type="submit"]').click()
     cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
 
     cy.api('GET', `/api/v1/inboxes/${inboxId}`).then(({ body }) => {
       const campaigns = body.data.config.campaigns
-      expect(campaigns.map((item) => item.name)).to.deep.eq([secondCampaignName, campaignName])
+      expect(campaigns.map((item) => item.name)).to.deep.eq([campaignName, secondCampaignName])
       expect(campaigns.find((item) => item.name === campaignName).enabled).to.eq(true)
     })
   })
@@ -237,7 +231,7 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
     cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
 
     editInbox(inboxId)
-    openTab('Proactive messages')
+    cy.openInboxSection('Proactive messages')
     openCampaign(secondCampaignName)
     cy.get('[data-campaign-editor]').contains('button', 'Delete').click()
     cy.get('[role="alertdialog"]').contains('button', 'Delete').click()
@@ -247,7 +241,7 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
     cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
 
     editInbox(inboxId)
-    openTab('Proactive messages')
+    cy.openInboxSection('Proactive messages')
     cy.contains(secondCampaignName).should('not.exist')
     cy.contains(campaignName).should('exist')
   })
@@ -256,7 +250,7 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
     cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
 
     editInbox(inboxId)
-    openTab('Help center')
+    cy.openInboxSection('Help center')
     selectOption('#widget-help-center', hcName)
 
     cy.get('[data-help-audience="visitors"]').contains('Show Help tab').should('be.visible')
@@ -268,9 +262,9 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
     cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
 
     editInbox(inboxId)
-    openTab('Help center')
+    cy.openInboxSection('Help center')
     cy.get('#widget-help-center').should('contain', hcName)
-    cy.contains(articleTitle).should('be.visible')
+    cy.contains(articleTitle).scrollIntoView().should('be.visible')
 
     cy.api('GET', `/api/v1/inboxes/${inboxId}`).then(({ body }) => {
       const help = body.data.config.help
@@ -283,7 +277,7 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
     cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
 
     editInbox(inboxId)
-    openTab('Help center')
+    cy.openInboxSection('Help center')
     cy.get('[data-featured-articles] button[aria-label="Remove"]').click()
     cy.get('[data-featured-articles] button[aria-label="Remove"]').should('not.exist')
 
@@ -299,7 +293,7 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
     cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
 
     editInbox(inboxId)
-    openTab('Help center')
+    cy.openInboxSection('Help center')
     selectOption('#widget-help-center', 'None')
 
     cy.contains('Featured articles').should('not.exist')
diff --git a/frontend/cypress/support/livechat.js b/frontend/cypress/support/livechat.js
index f210d0c4..9e4bf39e 100644
--- a/frontend/cypress/support/livechat.js
+++ b/frontend/cypress/support/livechat.js
@@ -1,10 +1,22 @@
 const openSockets = []
 const createdInboxes = []
 
+const branding = (primary) => ({
+  colors: { primary },
+  logo_url: '',
+  launcher: { logo_url: '', color: primary },
+  home_screen: {
+    header_text_color: 'black',
+    background: { type: 'solid', color: '#ffffff' },
+    fade_background: false
+  }
+})
+
 const baseConfig = () => ({
   brand_name: 'Cypress',
-  colors: { primary: '#112233' },
-  launcher: { position: 'right', spacing: { side: 20, bottom: 20 } },
+  theme: 'light',
+  branding: { light: branding('#112233'), dark: branding('#112233') },
+  launcher: { position: 'right', size: 60, spacing: { side: 20, bottom: 20 } },
   session_duration: '4h',
   visitors: { allow_start_conversation: true },
   users: { allow_start_conversation: true }
@@ -209,6 +221,17 @@ async function signJWT (payload, secret) {
   return cy.window({ timeout: 20000 }).its('Libredesk.toggleButton', { timeout: 20000 })
 })
 
+// Emulation.setEmulatedMedia reaches the widget iframe too, which stubbing window.matchMedia cannot.
+Cypress.Commands.add('setColorScheme', (value) =>
+  cy.wrap(
+    Cypress.automation('remote:debugger:protocol', {
+      command: 'Emulation.setEmulatedMedia',
+      params: { features: [{ name: 'prefers-color-scheme', value }] }
+    }),
+    { log: false }
+  )
+)
+
 Cypress.Commands.add('widgetLauncher', () =>
   cy.window().its('Libredesk.toggleButton').then((el) => cy.wrap(el, { log: false }))
 )
@@ -334,3 +357,98 @@ Cypress.Commands.add('signWidgetJWT', (payload, secret) => {
     { log: false }
   )
 })
+
+// Only one section is open at a time, so reaching a field means opening its tab and section.
+const FORM_SECTION_TAB = {
+  General: 'General',
+  'Conversation continuity email inbox': 'General',
+  Theme: 'Appearance',
+  Branding: 'Appearance',
+  'Launcher position': 'Appearance',
+  'Reply previews': 'Appearance',
+  Messages: 'Content',
+  'Notice banner': 'Content',
+  'Home screen apps': 'Content',
+  'Help center': 'Content',
+  'Proactive messages': 'Content',
+  Features: 'Conversations',
+  'Office hours': 'Conversations',
+  'Pre-chat form': 'Conversations',
+  Users: 'Conversations',
+  Installation: 'Setup',
+  'Identity verification': 'Setup',
+  'JavaScript API': 'Setup',
+  Security: 'Setup'
+}
+
+const SECTION_ID = {
+  General: 'basics',
+  'Conversation continuity email inbox': 'continuity',
+  Theme: 'appearance',
+  Branding: 'branding',
+  'Launcher position': 'launcher',
+  'Reply previews': 'previews',
+  Messages: 'messages',
+  'Notice banner': 'noticeBanner',
+  'Home screen apps': 'homeApps',
+  'Help center': 'help',
+  'Proactive messages': 'campaigns',
+  Features: 'features',
+  'Office hours': 'officeHours',
+  'Pre-chat form': 'prechat',
+  Users: 'users',
+  Installation: 'installation',
+  'Identity verification': 'identity',
+  'JavaScript API': 'jsApi',
+  Security: 'security'
+}
+
+Cypress.Commands.add('inboxSection', (section) => cy.get(`[data-section="${SECTION_ID[section]}"]`))
+
+Cypress.Commands.add('openInboxSection', (section) => {
+  const tab = FORM_SECTION_TAB[section]
+  if (!tab) throw new Error(`unknown live chat form section: ${section}`)
+  // The admin sidebar also has collapsible buttons, so every lookup stays inside the form.
+  const trigger = () =>
+    cy.get('form').contains('button[aria-expanded]', new RegExp(`^\\s*${section}\\s*$`))
+
+  cy.get('form').contains('[role="tab"]', new RegExp(`^\\s*${tab}\\s*$`)).click()
+  trigger().then(($btn) => {
+    if ($btn.attr('aria-expanded') !== 'true') cy.wrap($btn).click()
+  })
+  trigger().should('have.attr', 'aria-expanded', 'true')
+})
+
+// Branding and launcher both carry this switch, only the open section's one is visible.
+Cypress.Commands.add('editBrandingTheme', (label) =>
+  cy.get('form').find('[role="tab"]').filter(':visible').contains(label).click()
+)
+
+Cypress.Commands.add('switchField', (title) =>
+  cy
+    .get('form')
+    .contains('p:visible', new RegExp(`^\\s*${title}\\s*$`))
+    .parent()
+    .find('button[role="switch"]')
+)
+
+// Switch labels and audience tabs repeat across sections, so these scope by section.
+Cypress.Commands.add('switchFieldIn', (section, title) =>
+  cy
+    .inboxSection(section)
+    .contains('p:visible', new RegExp(`^\\s*${title}\\s*$`))
+    .parent()
+    .find('button[role="switch"]')
+)
+
+Cypress.Commands.add('audienceSwitch', (audience, title) =>
+  cy
+    .get(`[data-audience="${audience}"]`)
+    .contains('p', new RegExp(`^\\s*${title}\\s*$`))
+    .parent()
+    .find('button[role="switch"]')
+)
+
+Cypress.Commands.add('audienceTab', (section, label) =>
+  cy.inboxSection(section).contains('[role="tab"]', new RegExp(`^\\s*${label}\\s*$`))
+)
diff --git a/frontend/shared-ui/assets/styles/main.scss b/frontend/shared-ui/assets/styles/main.scss
index 27e69b2d..05e34435 100644
--- a/frontend/shared-ui/assets/styles/main.scss
+++ b/frontend/shared-ui/assets/styles/main.scss
@@ -429,6 +429,10 @@
   .link-style {
     @apply text-muted-foreground underline underline-offset-4 hover:text-foreground transition-colors;
   }
+
+  .drag-ghost {
+    @apply bg-accent/60 opacity-60;
+  }
 }
 
 /* Fix collapsed sidebar visibility in padding gap.
diff --git a/frontend/shared-ui/components/ui/accordion/AccordionContent.vue b/frontend/shared-ui/components/ui/accordion/AccordionContent.vue
index bfd11163..1e6222fd 100644
--- a/frontend/shared-ui/components/ui/accordion/AccordionContent.vue
+++ b/frontend/shared-ui/components/ui/accordion/AccordionContent.vue
@@ -6,6 +6,8 @@ import { cn } from '../../../lib/utils'
 const props = defineProps({
   asChild: { type: Boolean, required: false },
   as: { type: null, required: false },
+  // Keeps closed sections mounted, so form fields inside them stay registered.
+  forceMount: { type: Boolean, required: false },
   class: { type: null, required: false }
 })
 
@@ -19,7 +21,11 @@ const delegatedProps = computed(() => {
 <template>
   <AccordionContent
     v-bind="delegatedProps"
-    class="overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down"
+    :class="
+      props.forceMount
+        ? 'text-sm data-[state=closed]:hidden'
+        : 'overflow-hidden text-sm data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down'
+    "
   >
     <div :class="cn('pb-4 pt-0', props.class)">
       <slot />
diff --git a/i18n/en-US.json b/i18n/en-US.json
index d2a5ecb4..a3ad2c24 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -343,8 +343,6 @@
   "admin.inbox.livechat.continuityEmailFooterWithLink": "Reply to this email or {link}go to chat{endlink} to continue the conversation.",
   "admin.inbox.livechat.conversationContinuity": "Conversation continuity email inbox",
   "admin.inbox.livechat.conversationContinuity.description": "When a contact goes offline, replies are sent via this email inbox. They can continue the conversation by replying to the email or returning to the chat widget.",
-  "admin.inbox.livechat.darkMode": "Dark mode",
-  "admin.inbox.livechat.darkMode.description": "Enable dark mode for the chat widget",
   "admin.inbox.livechat.directToConversation": "Launch directly into conversation",
   "admin.inbox.livechat.directToConversation.description": "Skip the home screen and open directly into the user's latest conversation, or a new conversation if none exists",
   "admin.inbox.livechat.externalLinks": "External links",
@@ -376,6 +374,7 @@
   "admin.inbox.livechat.language.auto": "Auto-detect (browser language)",
   "admin.inbox.livechat.launcher": "Launcher",
   "admin.inbox.livechat.launcher.color": "Launcher color",
+  "admin.inbox.livechat.launcher.layout": "Launcher position",
   "admin.inbox.livechat.launcher.logo": "Launcher logo",
   "admin.inbox.livechat.launcher.position": "Position",
   "admin.inbox.livechat.launcher.position.left": "Left",
@@ -383,6 +382,9 @@
   "admin.inbox.livechat.launcher.spacing.bottom": "Bottom spacing",
   "admin.inbox.livechat.launcher.spacing.bottom.description": "Distance from the bottom of the screen in pixels",
   "admin.inbox.livechat.launcher.spacing.side": "Side spacing",
+  "admin.inbox.livechat.launcher.iconScale": "Icon size",
+  "admin.inbox.livechat.launcher.iconScale.description": "How much of the launcher the logo fills, as a percentage. Lower it to inset a logo that has no padding of its own.",
+  "admin.inbox.livechat.launcher.size": "Launcher size",
   "admin.inbox.livechat.launcher.spacing.side.description": "Distance from the side of the screen in pixels",
   "admin.inbox.livechat.noticeBanner": "Notice banner",
   "admin.inbox.livechat.noticeBanner.enabled": "Enable notice banner",
@@ -402,7 +404,6 @@
   "admin.inbox.livechat.preventMultipleConversations.visitors.description": "Prevent visitors from starting multiple conversations simultaneously",
   "admin.inbox.livechat.preventReplyToClosedConversation": "Prevent replying to closed conversations",
   "admin.inbox.livechat.preventReplyToClosedConversation.description": "When enabled, users cannot reply to closed conversations",
-  "admin.inbox.livechat.preview": "Preview",
   "admin.inbox.livechat.preview.sampleAgentReply": "Happy to help, could you share a few details?",
   "admin.inbox.livechat.preview.sampleUserMessage": "Hi! How do I get started?",
   "admin.inbox.livechat.quickReplies": "Quick replies",
@@ -425,6 +426,7 @@
   "admin.inbox.livechat.tabs.installation": "Installation",
   "admin.inbox.livechat.tabs.messages": "Messages",
   "admin.inbox.livechat.tabs.prechat": "Pre-chat form",
+  "admin.inbox.livechat.theme.description": "Match system follows the visitor's own color scheme.",
   "admin.inbox.livechat.trustedDomains.description": "One domain per line. *.example.com matches subdomains only, add the bare domain example.com separately. Leave empty to allow any domain.",
   "admin.inbox.livechat.trustedDomains.list": "Domain list",
   "admin.inbox.livechat.userSettings.visitors": "Visitors",
@@ -1050,6 +1052,12 @@
   "globals.terms.csatRating": "CSAT rating",
   "globals.terms.custom": "Custom",
   "globals.terms.light": "Light",
+  "globals.terms.theme": "Theme",
+  "globals.terms.branding": "Branding",
+  "globals.terms.matchSystem": "Match system",
+  "globals.terms.repeat": "Repeat",
+  "globals.terms.translation": "Translation | Translations",
+  "globals.terms.setup": "Setup",
   "globals.terms.dark": "Dark",
   "globals.terms.customAttribute": "Custom attribute | Custom attributes",
   "globals.terms.date": "Date",
@@ -1252,7 +1260,6 @@
   "helpCenter.aiEnabledHint": "Takes effect only when the article is published. Enable it in one language only, not in every translation.",
   "helpCenter.addTranslation": "Add translation",
   "helpCenter.translationOf": "Translation of “{title}”",
-  "helpCenter.translations": "Translations",
   "helpCenter.toggleTheme": "Toggle theme",
   "helpCenter.saveBeforeSwitchingTranslation": "Unsaved changes would be lost. Save the article before switching languages.",
   "helpCenter.saveBeforeTranslation": "Unsaved changes would be lost. Save the article before adding a translation.",
@@ -1693,7 +1700,6 @@
   "widget.campaign.replied": "Replied",
   "widget.campaign.section.audience": "Who sees it",
   "widget.campaign.section.placement": "Where and when",
-  "widget.campaign.section.repeat": "Repeat",
   "widget.campaign.session": "Once per session",
   "widget.campaign.users": "Signed-in users",
   "widget.campaignCooldown": "Minimum hours between proactive messages",
@@ -1733,7 +1739,7 @@
   "conversation.sidebarCounts.unassigned": "{count} open unassigned conversation | {count} open unassigned conversations",
   "widget.previewContent": "Preview content",
   "widget.proactiveMessages": "Proactive messages",
-  "widget.replyPreviews": "Replies above the launcher",
+  "widget.replyPreviews": "Reply previews",
   "widget.replyTeam": "Route replies to team",
   "widget.searchArticles": "Search for help",
   "widget.showHelpTab": "Show Help tab",
diff --git a/internal/conversation/ws.go b/internal/conversation/ws.go
index 3934330b..f80a5298 100644
--- a/internal/conversation/ws.go
+++ b/internal/conversation/ws.go
@@ -34,9 +34,10 @@ func (m *Manager) BroadcastNewMessage(message *cmodels.Message, conv *cmodels.Co
 	data := map[string]any{
 		"conversation_uuid": message.ConversationUUID,
 		"uuid":              message.UUID,
+		"id":                message.ID,
 		"type":              message.Type,
 		"preview":           preview,
-		"created_at":        message.CreatedAt.Format(time.RFC3339),
+		"created_at":        message.CreatedAt.Format(time.RFC3339Nano),
 		"sender_type":       message.SenderType,
 		"conversation":      convToBroadcast(conv),
 	}
diff --git a/internal/inbox/channel/livechat/livechat.go b/internal/inbox/channel/livechat/livechat.go
index 410c3fac..9d1e4975 100644
--- a/internal/inbox/channel/livechat/livechat.go
+++ b/internal/inbox/channel/livechat/livechat.go
@@ -27,8 +27,64 @@ const (
 	HomeAppAnnouncement = "announcement"
 	HomeAppExternalLink = "external_link"
 	HomeAppHelp         = "help"
+
+	ThemeSystem = "system"
+	ThemeLight  = "light"
+	ThemeDark   = "dark"
+
+	DefaultLauncherSize      = 60
+	DefaultLauncherIconScale = 100
 )
 
+type Colors struct {
+	Primary string `json:"primary"`
+}
+
+type Background struct {
+	Type          string `json:"type"`
+	Color         string `json:"color"`
+	GradientStart string `json:"gradient_start"`
+	GradientEnd   string `json:"gradient_end"`
+	ImageURL      string `json:"image_url"`
+}
+
+type HomeScreen struct {
+	HeaderTextColor string     `json:"header_text_color"`
+	Background      Background `json:"background"`
+	FadeBackground  bool       `json:"fade_background"`
+}
+
+type BrandingLauncher struct {
+	LogoURL string `json:"logo_url"`
+	Color   string `json:"color"`
+}
+
+// Branding is the appearance of the widget under one color scheme.
+type Branding struct {
+	Colors     Colors           `json:"colors"`
+	LogoURL    string           `json:"logo_url"`
+	Launcher   BrandingLauncher `json:"launcher"`
+	HomeScreen HomeScreen       `json:"home_screen"`
+}
+
+type BrandingSet struct {
+	Light Branding `json:"light"`
+	Dark  Branding `json:"dark"`
+}
+
+type LauncherSpacing struct {
+	Side   int `json:"side"`
+	Bottom int `json:"bottom"`
+}
+
+// LauncherLayout is the launcher geometry, which does not change with the color scheme.
+type LauncherLayout struct {
+	Spacing   LauncherSpacing `json:"spacing"`
+	Position  string          `json:"position"`
+	Size      int             `json:"size"`
+	IconScale int             `json:"icon_scale"`
+}
+
 type PreChatFormField struct {
 	Key               string `json:"key"`
 	Type              string `json:"type"`
@@ -107,40 +163,18 @@ type Config struct {
 	Previews              PreviewConfig        `json:"previews"`
 	BrandName             string               `json:"brand_name"`
 	WebsiteURL            string               `json:"website_url"`
-	DarkMode              bool                 `json:"dark_mode"`
+	Theme                 string               `json:"theme"`
 	ShowPoweredBy         bool                 `json:"show_powered_by"`
 	Language              string               `json:"language"`
 	FallbackLanguage      string               `json:"fallback_language"`
 	Users                 AudienceConfig       `json:"users"`
-	Colors                struct {
-		Primary string `json:"primary"`
-	} `json:"colors"`
-	HomeScreen struct {
-		HeaderTextColor string `json:"header_text_color"`
-		Background      struct {
-			Type          string `json:"type"`
-			Color         string `json:"color"`
-			GradientStart string `json:"gradient_start"`
-			GradientEnd   string `json:"gradient_end"`
-			ImageURL      string `json:"image_url"`
-		} `json:"background"`
-		FadeBackground bool `json:"fade_background"`
-	} `json:"home_screen"`
-	Features struct {
+	Branding              BrandingSet          `json:"branding"`
+	Features              struct {
 		Emoji      bool `json:"emoji"`
 		FileUpload bool `json:"file_upload"`
 		Transcript bool `json:"transcript"`
 	} `json:"features"`
-	Launcher struct {
-		Spacing struct {
-			Side   int `json:"side"`
-			Bottom int `json:"bottom"`
-		} `json:"spacing"`
-		LogoURL  string `json:"logo_url"`
-		Position string `json:"position"`
-		Color    string `json:"color"`
-	} `json:"launcher"`
-	LogoURL      string         `json:"logo_url"`
+	Launcher     LauncherLayout `json:"launcher"`
 	Visitors     AudienceConfig `json:"visitors"`
 	NoticeBanner struct {
 		Text    string `json:"text"`
@@ -223,6 +257,53 @@ func New(store inbox.MessageStore, userStore inbox.UserStore, opts Opts) (*LiveC
 	return lc, nil
 }
 
+// UnmarshalJSON fills the branding set, theme and launcher size from the pre-branding
+// config layout when they are absent, so inboxes saved before the split keep rendering.
+func (c *Config) UnmarshalJSON(data []byte) error {
+	type plain Config
+	var cfg plain
+	if err := json.Unmarshal(data, &cfg); err != nil {
+		return err
+	}
+	*c = Config(cfg)
+
+	var legacy struct {
+		Branding   *json.RawMessage `json:"branding"`
+		DarkMode   bool             `json:"dark_mode"`
+		Colors     Colors           `json:"colors"`
+		LogoURL    string           `json:"logo_url"`
+		HomeScreen HomeScreen       `json:"home_screen"`
+		Launcher   BrandingLauncher `json:"launcher"`
+	}
+	if err := json.Unmarshal(data, &legacy); err != nil {
+		return err
+	}
+
+	if legacy.Branding == nil {
+		branding := Branding{
+			Colors:     legacy.Colors,
+			LogoURL:    legacy.LogoURL,
+			Launcher:   legacy.Launcher,
+			HomeScreen: legacy.HomeScreen,
+		}
+		c.Branding.Light = branding
+		c.Branding.Dark = branding
+		if legacy.DarkMode {
+			c.Theme = ThemeDark
+		}
+	}
+	if c.Theme == "" {
+		c.Theme = ThemeLight
+	}
+	if c.Launcher.Size == 0 {
+		c.Launcher.Size = DefaultLauncherSize
+	}
+	if c.Launcher.IconScale == 0 {
+		c.Launcher.IconScale = DefaultLauncherIconScale
+	}
+	return nil
+}
+
 func (c Config) ResolvePreChatForm(isVisitor bool) Config {
 	audience := c.PreChatForm.Users
 	if isVisitor {
diff --git a/internal/inbox/channel/livechat/livechat_test.go b/internal/inbox/channel/livechat/livechat_test.go
index cd17f84c..ebf42013 100644
--- a/internal/inbox/channel/livechat/livechat_test.go
+++ b/internal/inbox/channel/livechat/livechat_test.go
@@ -57,3 +57,90 @@ func TestResolvePreChatFormUsesAudienceValues(t *testing.T) {
 		t.Fatalf("user fields = %+v", user.PreChatForm.Fields)
 	}
 }
+
+func TestUnmarshalFillsBrandingFromLegacyConfig(t *testing.T) {
+	legacy := []byte(`{
+		"dark_mode":true,
+		"colors":{"primary":"#2563eb"},
+		"logo_url":"https://example.com/a.png",
+		"launcher":{"position":"right","logo_url":"https://example.com/l.png","color":"#000000","spacing":{"side":20,"bottom":20}},
+		"home_screen":{"header_text_color":"black","background":{"type":"solid","color":"#ffffff"},"fade_background":true}
+	}`)
+
+	var config Config
+	if err := json.Unmarshal(legacy, &config); err != nil {
+		t.Fatal(err)
+	}
+
+	if config.Theme != ThemeDark {
+		t.Fatalf("theme = %q, want %q", config.Theme, ThemeDark)
+	}
+	if config.Launcher.Size != DefaultLauncherSize {
+		t.Fatalf("launcher size = %d, want %d", config.Launcher.Size, DefaultLauncherSize)
+	}
+	if config.Launcher.Position != "right" || config.Launcher.Spacing.Side != 20 {
+		t.Fatalf("launcher layout = %+v", config.Launcher)
+	}
+	for name, branding := range map[string]Branding{"light": config.Branding.Light, "dark": config.Branding.Dark} {
+		if branding.Colors.Primary != "#2563eb" {
+			t.Fatalf("%s primary = %q", name, branding.Colors.Primary)
+		}
+		if branding.LogoURL != "https://example.com/a.png" {
+			t.Fatalf("%s logo = %q", name, branding.LogoURL)
+		}
+		if branding.Launcher.LogoURL != "https://example.com/l.png" || branding.Launcher.Color != "#000000" {
+			t.Fatalf("%s launcher branding = %+v", name, branding.Launcher)
+		}
+		if branding.HomeScreen.Background.Color != "#ffffff" || !branding.HomeScreen.FadeBackground {
+			t.Fatalf("%s home screen = %+v", name, branding.HomeScreen)
+		}
+	}
+
+	normalized, err := json.Marshal(config)
+	if err != nil {
+		t.Fatal(err)
+	}
+	var response struct {
+		Branding BrandingSet `json:"branding"`
+	}
+	if err := json.Unmarshal(normalized, &response); err != nil {
+		t.Fatal(err)
+	}
+	if response.Branding.Light.LogoURL != "https://example.com/a.png" || response.Branding.Dark.LogoURL != "https://example.com/a.png" {
+		t.Fatalf("response branding = %+v", response.Branding)
+	}
+}
+
+func TestUnmarshalLegacyLightModeSetsLightTheme(t *testing.T) {
+	var config Config
+	if err := json.Unmarshal([]byte(`{"dark_mode":false,"colors":{"primary":"#2563eb"}}`), &config); err != nil {
+		t.Fatal(err)
+	}
+	if config.Theme != ThemeLight {
+		t.Fatalf("theme = %q, want %q", config.Theme, ThemeLight)
+	}
+}
+
+func TestUnmarshalKeepsExplicitBranding(t *testing.T) {
+	var config Config
+	if err := json.Unmarshal([]byte(`{
+		"theme":"system",
+		"launcher":{"position":"left","size":48,"spacing":{"side":10,"bottom":10}},
+		"colors":{"primary":"#111111"},
+		"branding":{
+			"light":{"colors":{"primary":"#2563eb"}},
+			"dark":{"colors":{"primary":"#60a5fa"}}
+		}
+	}`), &config); err != nil {
+		t.Fatal(err)
+	}
+	if config.Theme != ThemeSystem {
+		t.Fatalf("theme = %q, want %q", config.Theme, ThemeSystem)
+	}
+	if config.Launcher.Size != 48 {
+		t.Fatalf("launcher size = %d, want 48", config.Launcher.Size)
+	}
+	if config.Branding.Light.Colors.Primary != "#2563eb" || config.Branding.Dark.Colors.Primary != "#60a5fa" {
+		t.Fatalf("branding = %+v", config.Branding)
+	}
+}
diff --git a/static/widget.js b/static/widget.js
index a96fa770..44defb84 100644
--- a/static/widget.js
+++ b/static/widget.js
@@ -27,10 +27,11 @@
             this.IFRAME_HEIGHT = '700px';
             this.EXPANDED_WIDTH = '750px';
             this.MOBILE_BREAKPOINT = 600;
-            this.LAUNCHER_SIZE = 60;
+            this.DEFAULT_LAUNCHER_SIZE = 60;
+            this.LAUNCHER_IFRAME_GAP = 20;
+            this.DEFAULT_LAUNCHER_ICON_SCALE = 100;
             this.LAUNCHER_HOVER_SCALE = 1.08;
             this.LAUNCHER_OPEN_SCALE = 0.9;
-            this.MOBILE_LAUNCHER_SIZE = 60;
             this.CAMPAIGN_POLL_MIN = 2;
             this.CAMPAIGN_POLL_MAX = 60;
 
@@ -161,6 +162,7 @@
                 }
                 this.createElements();
                 this.setLauncherPosition();
+                this.watchColorScheme();
                 this.widgetButtonWrapper.style.display = 'none';
                 this.iframe.addEventListener('load', () => {
                     this.sendMobileState();
@@ -217,8 +219,7 @@
         }
 
         createElements () {
-            const launcher = this.widgetSettings.launcher;
-            const colors = this.widgetSettings.colors;
+            const branding = this.branding();
 
             this.toggleButton = document.createElement('div');
             this.toggleButton.style.cssText = `
@@ -227,7 +228,7 @@
                 z-index: 9999;
                 width: ${this.launcherSize()}px;
                 height: ${this.launcherSize()}px;
-                background-color: ${launcher.color || colors.primary};
+                background-color: ${this.launcherColor()};
                 border-radius: 50%;
                 display: flex;
                 justify-content: center;
@@ -247,13 +248,8 @@
             `;
 
             this.defaultIcon = document.createElement('img');
-            this.defaultIcon.src = launcher.logo_url || (this.config.baseURL + DEFAULT_LAUNCHER_LOGO_PATH);
-            this.defaultIcon.style.cssText = `
-                width: 100%;
-                height: 100%;
-                border-radius: 50%;
-                object-fit: cover;
-            `;
+            this.defaultIcon.src = branding.launcher?.logo_url || (this.config.baseURL + DEFAULT_LAUNCHER_LOGO_PATH);
+            this.styleLauncherIcon();
             this.iconContainer.appendChild(this.defaultIcon);
 
             this.arrowIcon = document.createElement('div');
@@ -264,7 +260,7 @@
             svg.setAttribute('fill', 'none');
             const path = document.createElementNS('http://www.w3.org/2000/svg', 'path');
             path.setAttribute('d', 'M7 10L12 15L17 10');
-            path.setAttribute('stroke', this.contrastColor(launcher.color || colors.primary));
+            path.setAttribute('stroke', this.contrastColor(this.launcherColor()));
             path.setAttribute('stroke-width', '2');
             path.setAttribute('stroke-linecap', 'round');
             path.setAttribute('stroke-linejoin', 'round');
@@ -350,12 +346,62 @@
         }
 
         launcherSize () {
-            return this.isMobile ? this.MOBILE_LAUNCHER_SIZE : this.LAUNCHER_SIZE;
+            return this.widgetSettings?.launcher?.size || this.DEFAULT_LAUNCHER_SIZE;
+        }
+
+        launcherIconScale () {
+            return this.widgetSettings?.launcher?.icon_scale || this.DEFAULT_LAUNCHER_ICON_SCALE;
+        }
+
+        styleLauncherIcon () {
+            if (!this.defaultIcon) return;
+            const scale = this.launcherIconScale();
+            const full = scale >= 100;
+            const style = this.defaultIcon.style;
+            style.width = `${scale}%`;
+            style.height = `${scale}%`;
+            style.borderRadius = full ? '50%' : '0';
+            style.objectFit = full ? 'cover' : 'contain';
+        }
+
+        prefersDark () {
+            return Boolean(window.matchMedia && window.matchMedia('(prefers-color-scheme: dark)').matches);
+        }
+
+        branding () {
+            const theme = this.widgetSettings.theme;
+            const isDark = theme === 'dark' || (theme === 'system' && this.prefersDark());
+            return this.widgetSettings.branding?.[isDark ? 'dark' : 'light'] || {};
+        }
+
+        launcherColor () {
+            const branding = this.branding();
+            return branding.launcher?.color || branding.colors?.primary || '#000000';
+        }
+
+        applyLauncherTheme () {
+            if (!this.toggleButton) return;
+            const branding = this.branding();
+            this.toggleButton.style.backgroundColor = this.launcherColor();
+            this.defaultIcon.src = branding.launcher?.logo_url || (this.config.baseURL + DEFAULT_LAUNCHER_LOGO_PATH);
+            this.styleLauncherIcon();
+            const path = this.arrowIcon.querySelector('path');
+            if (path) path.setAttribute('stroke', this.contrastColor(this.launcherColor()));
+        }
+
+        watchColorScheme () {
+            if (!window.matchMedia) return;
+            window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
+                if (this.widgetSettings.theme === 'system') this.applyLauncherTheme();
+            });
+        }
+
+        iframeBottomOffset () {
+            return this.widgetSettings.launcher.spacing.bottom + this.launcherSize() + this.LAUNCHER_IFRAME_GAP;
         }
 
         getNormalIframeHeight () {
-            const bottom = this.widgetSettings.launcher.spacing.bottom;
-            return `min(${this.IFRAME_HEIGHT}, calc(100vh - ${bottom + 100}px))`;
+            return `min(${this.IFRAME_HEIGHT}, calc(100vh - ${this.iframeBottomOffset() + this.LAUNCHER_IFRAME_GAP}px))`;
         }
 
         sendPageInfo () {
@@ -406,7 +452,7 @@
             } else {
                 iframe.style.width = this.IFRAME_WIDTH;
                 iframe.style.height = this.getNormalIframeHeight();
-                iframe.style.bottom = `${spacing.bottom + 80}px`;
+                iframe.style.bottom = `${this.iframeBottomOffset()}px`;
             }
         }
 

From a6143729c754dd4b8fac1ea5ad06df77a2372c74 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 01:57:49 +0530
Subject: [PATCH 136/178] fix widget compatibility and asset loading

---
 Makefile                                      | 10 ++-
 cmd/chat.go                                   | 52 ++++++++++--
 cmd/chat_test.go                              | 83 +++++++++++++++++++
 cmd/handlers.go                               |  4 +-
 .../src/layouts/admin/AdminSplitLayout.vue    |  2 +-
 frontend/apps/widget/src/websocket.js         | 14 ++--
 frontend/apps/widget/src/websocket.test.js    | 17 ++++
 frontend/package.json                         |  2 +
 frontend/pnpm-lock.yaml                       |  3 +
 static/widget.js                              |  2 +-
 10 files changed, 171 insertions(+), 18 deletions(-)

diff --git a/Makefile b/Makefile
index 6ed9d630..675882b2 100644
--- a/Makefile
+++ b/Makefile
@@ -10,7 +10,8 @@ BUILDSTR := ${VERSION} (\#${LAST_COMMIT} $(shell date -u +"%Y-%m-%dT%H:%M:%S%z")
 BIN := libredesk
 FRONTEND_DIR := frontend
 FRONTEND_DIST := ${FRONTEND_DIR}/dist
-STATIC := ${FRONTEND_DIST} i18n schema.sql static
+WIDGET_JS_MIN := static/widget.min.js
+STATIC := ${FRONTEND_DIST} i18n schema.sql static/email-templates static/public ${WIDGET_JS_MIN}:static/widget.js
 GOPATH ?= $(HOME)/go
 STUFFBIN ?= $(GOPATH)/bin/stuffbin
 
@@ -32,6 +33,11 @@ install-deps: $(STUFFBIN)
 .PHONY: frontend-build
 frontend-build: frontend-build-main frontend-build-widget
 
+.PHONY: minify-widget-js
+minify-widget-js: install-deps
+	@echo "→ Minifying widget loader..."
+	@cd ${FRONTEND_DIR} && pnpm build:widget-loader
+
 # Build only the main frontend app.
 .PHONY: frontend-build-main
 frontend-build-main: install-deps
@@ -90,7 +96,7 @@ build: frontend-build build-backend
 
 # Stuff static assets into the binary using stuffbin.
 .PHONY: stuff
-stuff: $(STUFFBIN)
+stuff: $(STUFFBIN) minify-widget-js
 	@echo "→ Stuffing static assets into binary..."
 	@$(STUFFBIN) -a stuff -in ${BIN} -out ${BIN} ${STATIC}
 
diff --git a/cmd/chat.go b/cmd/chat.go
index bf7af67d..6e8d1ca2 100644
--- a/cmd/chat.go
+++ b/cmd/chat.go
@@ -94,11 +94,21 @@ type handoffFormReq struct {
 	FormData map[string]any `json:"form_data"`
 }
 
+type widgetLauncherSettings struct {
+	livechat.LauncherLayout
+	livechat.BrandingLauncher
+}
+
 type chatSettingsResponse struct {
 	Campaigns            *struct{} `json:"campaigns,omitempty"`
 	HasCampaigns         bool      `json:"has_campaigns"`
 	CampaignDelaySeconds int       `json:"campaign_delay_seconds"`
 	livechat.Config
+	DarkMode   bool                   `json:"dark_mode"`
+	Colors     livechat.Colors        `json:"colors"`
+	HomeScreen livechat.HomeScreen    `json:"home_screen"`
+	Launcher   widgetLauncherSettings `json:"launcher"`
+	LogoURL    string                 `json:"logo_url"`
 	// Hide server-side fields from the public widget response.
 	TrustedDomains         *struct{}                     `json:"trusted_domains,omitempty"`
 	BlockedIPs             *struct{}                     `json:"blocked_ips,omitempty"`
@@ -125,14 +135,7 @@ func handleGetChatLauncherSettings(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, err.Error(), nil))
 	}
 
-	return r.SendEnvelope(map[string]any{
-		"theme":    config.Theme,
-		"launcher": config.Launcher,
-		"branding": map[string]any{
-			"light": launcherBranding(config.Branding.Light),
-			"dark":  launcherBranding(config.Branding.Dark),
-		},
-	})
+	return r.SendEnvelope(chatLauncherSettings(config))
 }
 
 // handleGetChatSettings returns the live chat settings for the widget
@@ -152,9 +155,15 @@ func handleGetChatSettings(r *fastglue.Request) error {
 	if config.PreChatForm.Enabled {
 		config, customAttributes = filterPreChatForms(config, app)
 	}
+	legacyBranding := legacyWidgetBranding(config)
 
 	response := chatSettingsResponse{
 		Config:               config,
+		DarkMode:             config.Theme == livechat.ThemeDark,
+		Colors:               legacyBranding.Colors,
+		HomeScreen:           legacyBranding.HomeScreen,
+		Launcher:             buildWidgetLauncherSettings(config, legacyBranding),
+		LogoURL:              legacyBranding.LogoURL,
 		HasCampaigns:         slices.ContainsFunc(config.Campaigns, func(c proactive.Campaign) bool { return c.Enabled }),
 		CampaignDelaySeconds: earliestCampaignDelay(config.Campaigns),
 		CustomAttributes:     customAttributes,
@@ -1471,3 +1480,30 @@ func launcherBranding(b livechat.Branding) map[string]any {
 		"launcher": b.Launcher,
 	}
 }
+
+func chatLauncherSettings(config livechat.Config) map[string]any {
+	legacyBranding := legacyWidgetBranding(config)
+	return map[string]any{
+		"theme":    config.Theme,
+		"colors":   legacyBranding.Colors,
+		"launcher": buildWidgetLauncherSettings(config, legacyBranding),
+		"branding": map[string]any{
+			"light": launcherBranding(config.Branding.Light),
+			"dark":  launcherBranding(config.Branding.Dark),
+		},
+	}
+}
+
+func legacyWidgetBranding(config livechat.Config) livechat.Branding {
+	if config.Theme == livechat.ThemeDark {
+		return config.Branding.Dark
+	}
+	return config.Branding.Light
+}
+
+func buildWidgetLauncherSettings(config livechat.Config, branding livechat.Branding) widgetLauncherSettings {
+	return widgetLauncherSettings{
+		LauncherLayout:   config.Launcher,
+		BrandingLauncher: branding.Launcher,
+	}
+}
diff --git a/cmd/chat_test.go b/cmd/chat_test.go
index 7bcb1f81..1197f2bd 100644
--- a/cmd/chat_test.go
+++ b/cmd/chat_test.go
@@ -1,6 +1,7 @@
 package main
 
 import (
+	"encoding/json"
 	"math"
 	"testing"
 
@@ -79,3 +80,85 @@ func TestValidateHandoffFormUsesSubmittedContactDetails(t *testing.T) {
 		t.Fatalf("got name %q", name)
 	}
 }
+
+func TestChatLauncherSettingsKeepsLegacyFields(t *testing.T) {
+	config := livechat.Config{
+		Theme: livechat.ThemeDark,
+		Launcher: livechat.LauncherLayout{
+			Position:  "right",
+			Size:      64,
+			IconScale: 80,
+			Spacing:   livechat.LauncherSpacing{Side: 20, Bottom: 24},
+		},
+		Branding: livechat.BrandingSet{
+			Light: livechat.Branding{Colors: livechat.Colors{Primary: "#ffffff"}},
+			Dark: livechat.Branding{
+				Colors:   livechat.Colors{Primary: "#111111"},
+				Launcher: livechat.BrandingLauncher{LogoURL: "https://example.com/logo.png", Color: "#222222"},
+			},
+		},
+	}
+
+	encoded, err := json.Marshal(chatLauncherSettings(config))
+	if err != nil {
+		t.Fatal(err)
+	}
+	var response struct {
+		Colors   livechat.Colors `json:"colors"`
+		Launcher struct {
+			Position  string `json:"position"`
+			Size      int    `json:"size"`
+			IconScale int    `json:"icon_scale"`
+			LogoURL   string `json:"logo_url"`
+			Color     string `json:"color"`
+		} `json:"launcher"`
+		Branding map[string]json.RawMessage `json:"branding"`
+	}
+	if err := json.Unmarshal(encoded, &response); err != nil {
+		t.Fatal(err)
+	}
+	if response.Colors.Primary != "#111111" {
+		t.Fatalf("legacy primary = %q", response.Colors.Primary)
+	}
+	if response.Launcher.Position != "right" || response.Launcher.Size != 64 || response.Launcher.IconScale != 80 {
+		t.Fatalf("legacy launcher layout = %+v", response.Launcher)
+	}
+	if response.Launcher.LogoURL != "https://example.com/logo.png" || response.Launcher.Color != "#222222" {
+		t.Fatalf("legacy launcher branding = %+v", response.Launcher)
+	}
+	if response.Branding["light"] == nil || response.Branding["dark"] == nil {
+		t.Fatalf("branding = %+v", response.Branding)
+	}
+
+	settingsResponse, err := json.Marshal(chatSettingsResponse{
+		Config:     config,
+		DarkMode:   true,
+		Colors:     config.Branding.Dark.Colors,
+		HomeScreen: config.Branding.Dark.HomeScreen,
+		Launcher:   buildWidgetLauncherSettings(config, config.Branding.Dark),
+		LogoURL:    config.Branding.Dark.LogoURL,
+	})
+	if err != nil {
+		t.Fatal(err)
+	}
+	var fullSettings struct {
+		DarkMode   bool                   `json:"dark_mode"`
+		Colors     livechat.Colors        `json:"colors"`
+		HomeScreen livechat.HomeScreen    `json:"home_screen"`
+		Launcher   widgetLauncherSettings `json:"launcher"`
+		LogoURL    string                 `json:"logo_url"`
+		Branding   livechat.BrandingSet   `json:"branding"`
+	}
+	if err := json.Unmarshal(settingsResponse, &fullSettings); err != nil {
+		t.Fatal(err)
+	}
+	if !fullSettings.DarkMode || fullSettings.Colors.Primary != "#111111" {
+		t.Fatalf("legacy theme = %+v", fullSettings)
+	}
+	if fullSettings.Launcher.LogoURL != "https://example.com/logo.png" || fullSettings.Launcher.Size != 64 {
+		t.Fatalf("legacy launcher = %+v", fullSettings.Launcher)
+	}
+	if fullSettings.Branding.Dark.Colors.Primary != "#111111" {
+		t.Fatalf("new branding = %+v", fullSettings.Branding)
+	}
+}
diff --git a/cmd/handlers.go b/cmd/handlers.go
index 0681ed96..8d7d5099 100644
--- a/cmd/handlers.go
+++ b/cmd/handlers.go
@@ -590,7 +590,9 @@ func serveWidgetJS(r *fastglue.Request) error {
 	app := r.Context.(*App)
 
 	r.RequestCtx.Response.Header.Set("Content-Type", "application/javascript")
-	r.RequestCtx.Response.Header.Set("Cache-Control", "no-cache")
+	r.RequestCtx.Response.Header.Set("Cache-Control", "no-store, no-cache, must-revalidate, max-age=0")
+	r.RequestCtx.Response.Header.Set("Pragma", "no-cache")
+	r.RequestCtx.Response.Header.Set("Expires", "0")
 
 	file, err := app.fs.Get("static/widget.js")
 	if err != nil {
diff --git a/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue b/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue
index 25716ecc..caf0fe36 100644
--- a/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue
+++ b/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue
@@ -7,7 +7,7 @@
       class="rounded-md p-2 space-y-2 self-stretch text-sm text-foreground/70"
       :class="
         fixedHelp
-          ? 'hidden xl:block w-[432px] min-[1800px]:w-[820px] shrink-0'
+          ? 'hidden xl:block w-[432px] min-[1600px]:w-[820px] shrink-0'
           : 'hidden lg:block w-3/12'
       "
     >
diff --git a/frontend/apps/widget/src/websocket.js b/frontend/apps/widget/src/websocket.js
index 304aebdf..2fa8f9bd 100644
--- a/frontend/apps/widget/src/websocket.js
+++ b/frontend/apps/widget/src/websocket.js
@@ -310,6 +310,14 @@ export class WidgetWebSocketClient {
     this.send(typingMessage)
   }
 
+  sendPageVisit (url, title) {
+    if (this.socket?.readyState !== WebSocket.OPEN) return
+    this.send({
+      type: 'page_visit',
+      data: { url, title }
+    })
+  }
+
   send (message) {
     if (this.socket?.readyState === WebSocket.OPEN) {
       this.socket.send(JSON.stringify(message))
@@ -363,9 +371,5 @@ export const closeWidgetWebSocket = () => widgetWSClient?.close()
 export const skipInitialWsSync = () => { _syncOnFirstConnect = false }
 
 export function sendPageVisit (url, title) {
-  if (!widgetWSClient) return
-  widgetWSClient.send({
-    type: 'page_visit',
-    data: { url, title }
-  })
+  widgetWSClient?.sendPageVisit(url, title)
 }
diff --git a/frontend/apps/widget/src/websocket.test.js b/frontend/apps/widget/src/websocket.test.js
index 2b2ec611..3c1bc87c 100644
--- a/frontend/apps/widget/src/websocket.test.js
+++ b/frontend/apps/widget/src/websocket.test.js
@@ -127,4 +127,21 @@ describe('Widget websocket client', () => {
 
     expect(widgetStore.setConnectionFailed).not.toHaveBeenCalled()
   })
+
+  test('page visits wait for an open socket', () => {
+    const client = connected()
+
+    client.sendPageVisit('https://example.com/docs', 'Docs')
+    expect(sockets[0].sent).toHaveLength(0)
+
+    sockets[0].readyState = FakeSocket.OPEN
+    client.sendPageVisit('https://example.com/docs', 'Docs')
+
+    expect(sockets[0].sent).toEqual([
+      JSON.stringify({
+        type: 'page_visit',
+        data: { url: 'https://example.com/docs', title: 'Docs' }
+      })
+    ])
+  })
 })
diff --git a/frontend/package.json b/frontend/package.json
index 39c55a37..cf42a343 100644
--- a/frontend/package.json
+++ b/frontend/package.json
@@ -8,6 +8,7 @@
     "dev:widget": "pnpm exec vite --mode widget",
     "build:main": "vite build --mode main",
     "build:widget": "vite build --mode widget",
+    "build:widget-loader": "esbuild ../static/widget.js --minify --target=es2020 --legal-comments=none --outfile=../static/widget.min.js",
     "preview": "vite preview",
     "test": "vitest",
     "test:run": "vitest run",
@@ -86,6 +87,7 @@
     "eslint": "^8.57.1",
     "eslint-plugin-cypress": "^2.15.2",
     "eslint-plugin-vue": "^9.32.0",
+    "esbuild": "^0.25.12",
     "jsdom": "^29.0.1",
     "postcss": "^8.5.23",
     "prettier": "^3.4.2",
diff --git a/frontend/pnpm-lock.yaml b/frontend/pnpm-lock.yaml
index 3e0f6ff6..2b3ce52b 100644
--- a/frontend/pnpm-lock.yaml
+++ b/frontend/pnpm-lock.yaml
@@ -189,6 +189,9 @@ importers:
       cypress:
         specifier: ^15.15.0
         version: 15.15.0
+      esbuild:
+        specifier: ^0.25.12
+        version: 0.25.12
       eslint:
         specifier: ^8.57.1
         version: 8.57.1
diff --git a/static/widget.js b/static/widget.js
index 44defb84..f65a68c7 100644
--- a/static/widget.js
+++ b/static/widget.js
@@ -169,7 +169,6 @@
                 });
                 this.setupMobileDetection();
                 this.setupEventListeners();
-                this.startPageTracking();
             } catch (error) {
                 console.error('Failed to initialize Libredesk Widget:', error);
             }
@@ -556,6 +555,7 @@
         }
 
         handleVueAppReady () {
+            this.startPageTracking();
             this.sendMobileState();
 
             var visitorToken = this.getCookie(this.getCookieName('visitor'));

From 96d8bb91ec4af79fc250cb28c36fea52bee3750f Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 02:13:41 +0530
Subject: [PATCH 137/178] improve proactive message setup

Explain custom events and guide users when contact attributes are missing. Accept Go durations for campaign cooldowns and stop condition fields from losing focus.
---
 cmd/widget_campaign.go                        | 23 +++++++++-
 cmd/widget_campaign_test.go                   | 28 ++++++++++++
 .../admin/inbox/LivechatInboxForm.vue         | 10 ++---
 .../features/admin/inbox/WidgetCampaigns.vue  | 40 ++++++++++++-----
 .../features/admin/inbox/WidgetConditions.vue | 44 +++++++++++++++----
 .../admin/inbox/livechatFormSchema.js         |  6 ++-
 .../admin/inbox/livechatFormSchema.test.js    | 13 +++++-
 .../apps/main/src/stores/customAttributes.js  | 14 +++---
 .../main/src/stores/customAttributes.test.js  | 38 ++++++++++++++++
 .../cypress/e2e/ui/livechatWidgetTabs.cy.js   |  4 ++
 i18n/en-US.json                               |  5 ++-
 internal/inbox/channel/livechat/livechat.go   | 26 +++++------
 .../livechat/proactive/eligibility_test.go    | 14 +++---
 .../channel/livechat/proactive/proactive.go   |  4 +-
 .../livechat/proactive/proactive_test.go      |  4 +-
 15 files changed, 211 insertions(+), 62 deletions(-)
 create mode 100644 frontend/apps/main/src/stores/customAttributes.test.js

diff --git a/cmd/widget_campaign.go b/cmd/widget_campaign.go
index 2bfe1cf0..843d4bc5 100644
--- a/cmd/widget_campaign.go
+++ b/cmd/widget_campaign.go
@@ -2,6 +2,7 @@ package main
 
 import (
 	"encoding/json"
+	"errors"
 	"slices"
 	"strconv"
 	"strings"
@@ -48,6 +49,10 @@ func handleWidgetCampaign(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
+	cooldown, err := parseCampaignCooldown(config.CampaignCooldown)
+	if err != nil {
+		return sendErrorEnvelope(r, campaignInputError(app))
+	}
 	if err := checkConversationPermissions(app, config, ctx.Visitor, contact.ID, inbox.ID); err != nil {
 		return r.SendEnvelope(nil)
 	}
@@ -91,7 +96,7 @@ func handleWidgetCampaign(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 	for _, c := range candidates {
-		if proactive.Suppression(c.campaign, ctx, history, config.CampaignCooldownHours) != "" {
+		if proactive.Suppression(c.campaign, ctx, history, cooldown) != "" {
 			continue
 		}
 		delivery, err := app.proactive.Reserve(inbox.ID, c.campaign, ctx, c.snapshot)
@@ -236,7 +241,10 @@ func campaignInputError(app *App) error {
 }
 
 func validateWidgetFeatures(app *App, config livechat.Config) error {
-	if config.Help.HelpCenterID < 0 || len(config.Help.FeaturedIDs) > 10 || config.Previews.AutoHideSeconds < 0 || config.Previews.AutoHideSeconds > 300 || !slices.Contains([]string{"", "message", "generic"}, config.Previews.Content) || len(config.Campaigns) > 50 || config.CampaignCooldownHours < 0 || config.CampaignCooldownHours > 8760 {
+	if config.Help.HelpCenterID < 0 || len(config.Help.FeaturedIDs) > 10 || config.Previews.AutoHideSeconds < 0 || config.Previews.AutoHideSeconds > 300 || !slices.Contains([]string{"", "message", "generic"}, config.Previews.Content) || len(config.Campaigns) > 50 {
+		return campaignInputError(app)
+	}
+	if _, err := parseCampaignCooldown(config.CampaignCooldown); err != nil {
 		return campaignInputError(app)
 	}
 	if config.Help.HelpCenterID > 0 {
@@ -271,3 +279,14 @@ func validateWidgetFeatures(app *App, config livechat.Config) error {
 	}
 	return nil
 }
+
+func parseCampaignCooldown(value string) (time.Duration, error) {
+	duration, err := time.ParseDuration(value)
+	if err != nil {
+		return 0, err
+	}
+	if duration < 0 {
+		return 0, errors.New("campaign cooldown cannot be negative")
+	}
+	return duration, nil
+}
diff --git a/cmd/widget_campaign_test.go b/cmd/widget_campaign_test.go
index 14008e85..38c012ab 100644
--- a/cmd/widget_campaign_test.go
+++ b/cmd/widget_campaign_test.go
@@ -2,6 +2,7 @@ package main
 
 import (
 	"testing"
+	"time"
 
 	bhmodels "github.com/abhinavxd/libredesk/internal/business_hours/models"
 )
@@ -29,3 +30,30 @@ func TestWithinWorkingHours(t *testing.T) {
 		})
 	}
 }
+
+func TestParseCampaignCooldown(t *testing.T) {
+	tests := []struct {
+		value string
+		want  time.Duration
+		valid bool
+	}{
+		{value: "0s", valid: true},
+		{value: "10m", want: 10 * time.Minute, valid: true},
+		{value: "1h30m", want: 90 * time.Minute, valid: true},
+		{value: ""},
+		{value: "tomorrow"},
+		{value: "-1m"},
+	}
+
+	for _, tc := range tests {
+		t.Run(tc.value, func(t *testing.T) {
+			got, err := parseCampaignCooldown(tc.value)
+			if tc.valid && (err != nil || got != tc.want) {
+				t.Fatalf("got %v, %v; want %v", got, err, tc.want)
+			}
+			if !tc.valid && err == nil {
+				t.Fatalf("accepted %q", tc.value)
+			}
+		})
+	}
+}
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
index 7fef6e11..44bbfe69 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
@@ -947,7 +947,7 @@
                   :model-value="form.values.config.campaigns || []"
                   :inbox-id="initialValues.id || 0"
                   :brand-name="form.values.config.brand_name || ''"
-                  :cooldown="form.values.config.campaign_cooldown_hours ?? 24"
+                  :cooldown="form.values.config.campaign_cooldown ?? '24h'"
                   :show-errors="showCampaignErrors"
                   @update:model-value="updateCampaigns"
                   @update:cooldown="updateCampaignCooldown"
@@ -1732,7 +1732,7 @@ const form = useForm({
       help: defaultWidgetHelp(),
       previews: defaultWidgetPreviews(),
       campaigns: [],
-      campaign_cooldown_hours: 24,
+      campaign_cooldown: '24h',
       brand_name: '',
       website_url: '',
       theme: 'light',
@@ -1890,8 +1890,8 @@ const hasCampaignErrors = computed(() =>
 )
 const updateCampaigns = (campaigns) =>
   form.setFieldValue('config.campaigns', campaigns, hasCampaignErrors.value)
-const updateCampaignCooldown = (hours) =>
-  form.setFieldValue('config.campaign_cooldown_hours', hours, hasCampaignErrors.value)
+const updateCampaignCooldown = (duration) =>
+  form.setFieldValue('config.campaign_cooldown', duration, hasCampaignErrors.value)
 
 // home_apps in form.values only syncs on change events, so pull the live ref for the preview.
 const previewTheme = inject('livechatPreviewTheme', ref('light'))
@@ -2130,7 +2130,7 @@ watch(
           ...audienceConfigs,
           prechat_form: pc,
           campaigns: newValues.config?.campaigns || [],
-          campaign_cooldown_hours: newValues.config?.campaign_cooldown_hours || 24,
+          campaign_cooldown: newValues.config?.campaign_cooldown || '24h',
           help: newValues.config?.help || defaultWidgetHelp(),
           previews: newValues.config?.previews || defaultWidgetPreviews(),
           features: {
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
index fb108e50..7395eac6 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
@@ -1,4 +1,6 @@
 <script setup>
+const HINT_CLASS = 'text-xs text-muted-foreground'
+
 import { ref, computed, watch, onMounted, nextTick } from 'vue'
 import { useI18n } from 'vue-i18n'
 import api from '@/api'
@@ -46,6 +48,7 @@ import SelectTeamCombobox from '@/components/combobox/SelectTeamCombobox.vue'
 import WidgetConditions from './WidgetConditions.vue'
 import { createCampaignSchema, defaultCampaign, newCampaignId } from './livechatFormSchema.js'
 import { handleHTTPError } from '@shared-ui/utils/http'
+import { isGoDuration } from '@shared-ui/utils/string'
 import {
   ChevronRight,
   ChevronDown,
@@ -75,7 +78,7 @@ const props = defineProps({
   modelValue: { type: Array, default: () => [] },
   inboxId: { type: Number, default: 0 },
   brandName: { type: String, default: '' },
-  cooldown: { type: Number, default: 24 },
+  cooldown: { type: String, default: '24h' },
   showErrors: { type: Boolean, default: false }
 })
 const emit = defineEmits(['update:modelValue', 'update:cooldown', 'update:preview'])
@@ -92,6 +95,9 @@ const stats = ref([])
 const from = ref(new Date(Date.now() - 30 * 86400000).toISOString().slice(0, 10))
 const to = ref(new Date().toISOString().slice(0, 10))
 const brandSenderName = computed(() => props.brandName.trim() || t('widget.brandBot'))
+const campaignEventExample = computed(
+  () => `window.Libredesk.trackEvent(${JSON.stringify(campaign.value?.event || 'pricing_viewed')})`
+)
 const senderName = (id) => {
   const agent = usersStore.options.find((item) => String(item.value) === String(id))
   return agent?.label || brandSenderName.value
@@ -113,10 +119,7 @@ const campaignSectionError = (field) =>
     ?.message || ''
 const cooldownError = computed(() => {
   if (!props.showErrors) return ''
-  const value = Number(props.cooldown)
-  return Number.isInteger(value) && value >= 0 && value <= 8760
-    ? ''
-    : t('validation.minmaxNumber', { min: 0, max: 8760 })
+  return isGoDuration(props.cooldown) ? '' : t('validation.invalidDuration')
 })
 
 const audienceLabel = (item) => t(AUDIENCE_TRANSLATION_KEYS[item.audience])
@@ -205,7 +208,7 @@ const remove = () => {
 }
 
 const showInvalidField = async (field) => {
-  if (field === 'config.campaign_cooldown_hours') {
+  if (field === 'config.campaign_cooldown') {
     root.value?.querySelector('#campaign-cooldown')?.focus()
     return
   }
@@ -280,13 +283,16 @@ onMounted(async () => {
         <Label for="campaign-cooldown">{{ t('widget.campaignCooldown') }}</Label>
         <Input
           id="campaign-cooldown"
-          type="number"
-          min="0"
-          max="8760"
+          type="text"
+          placeholder="1h"
           :model-value="cooldown"
-          @update:model-value="emit('update:cooldown', Number($event))"
+          aria-describedby="campaign-cooldown-hint"
+          @update:model-value="emit('update:cooldown', $event)"
           :aria-invalid="!!cooldownError"
         />
+        <p id="campaign-cooldown-hint" :class="HINT_CLASS">
+          {{ t('globals.messages.golangDurationHoursMinutes') }}
+        </p>
         <p v-if="cooldownError" role="alert" class="text-sm text-destructive">
           {{ cooldownError }}
         </p>
@@ -361,7 +367,7 @@ onMounted(async () => {
           <Plus class="size-4" />
           {{ t('widget.addCampaign') }}
         </Button>
-        <p v-if="modelValue.length >= MAX_CAMPAIGNS" class="text-xs text-muted-foreground">
+        <p v-if="modelValue.length >= MAX_CAMPAIGNS" :class="HINT_CLASS">
           {{ t('widget.campaignLimitReached') }}
         </p>
       </div>
@@ -580,7 +586,7 @@ onMounted(async () => {
             @update:model-value="update(key, $event.split('\n'))"
             :aria-invalid="!!campaignFieldError(key)"
           />
-          <p class="text-xs text-muted-foreground">{{ t('widget.urlPatternsHint') }}</p>
+          <p :class="HINT_CLASS">{{ t('widget.urlPatternsHint') }}</p>
           <p v-if="campaignFieldError(key)" role="alert" class="text-sm text-destructive">
             {{ campaignFieldError(key) }}
           </p>
@@ -612,9 +618,19 @@ onMounted(async () => {
             <Input
               id="campaign-event"
               :model-value="campaign.event"
+              placeholder="pricing_viewed"
               maxlength="128"
+              aria-describedby="campaign-event-hint campaign-event-example"
               @update:model-value="update('event', $event)"
             />
+            <p id="campaign-event-hint" :class="HINT_CLASS">
+              {{ t('widget.campaignEventHint') }}
+            </p>
+            <code
+              id="campaign-event-example"
+              class="block overflow-x-auto rounded-md border bg-muted px-3 py-2 text-xs"
+              >{{ campaignEventExample }}</code
+            >
           </div>
 
           <div class="space-y-2">
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue b/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue
index b1842cc4..e4aba97a 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue
@@ -1,5 +1,9 @@
 <script setup>
-import { ref, watch, onMounted } from 'vue'
+const MUTED_TEXT_CLASS = 'text-sm text-muted-foreground'
+
+import { computed, onMounted, ref, watch } from 'vue'
+import { useI18n } from 'vue-i18n'
+import { buttonVariants } from '@shared-ui/components/ui/button'
 import RuleBox from '@/features/admin/automation/RuleBox.vue'
 import { useCustomAttributeStore } from '@/stores/customAttributes'
 
@@ -7,21 +11,25 @@ const props = defineProps({
   modelValue: { type: Object, default: () => ({ logical_op: 'AND', rules: [] }) }
 })
 const emit = defineEmits(['update:modelValue'])
+const { t } = useI18n()
+const customAttributeStore = useCustomAttributeStore()
 const group = ref({ logical_op: 'AND', rules: [] })
+const isLoading = ref(true)
+const hasContactCustomAttributes = computed(
+  () => customAttributeStore.contactAttributeOptions.length > 0
+)
 watch(
   () => props.modelValue,
   (value) => {
-    group.value = value ? JSON.parse(JSON.stringify(value)) : { logical_op: 'AND', rules: [] }
+    const next = value
+      ? JSON.parse(JSON.stringify(value))
+      : { logical_op: 'AND', rules: [] }
+    if (JSON.stringify(next) !== JSON.stringify(group.value)) group.value = next
   },
   { immediate: true, deep: true }
 )
 const update = () => {
-  const value = JSON.parse(JSON.stringify(group.value))
-  value.rules = value.rules.map((rule) => ({
-    ...rule,
-    value: Array.isArray(rule.value) ? rule.value.join(',') : rule.value
-  }))
-  emit('update:modelValue', value)
+  emit('update:modelValue', JSON.parse(JSON.stringify(group.value)))
 }
 const add = () => {
   group.value.rules.push({
@@ -37,11 +45,15 @@ const remove = (_, index) => {
   group.value.rules.splice(index, 1)
   update()
 }
-onMounted(() => useCustomAttributeStore().fetchCustomAttributes())
+onMounted(async () => {
+  await customAttributeStore.refreshCustomAttributes()
+  isLoading.value = false
+})
 </script>
 
 <template>
   <RuleBox
+    v-if="hasContactCustomAttributes"
     :rule-group="group"
     :group-index="0"
     type="new_conversation"
@@ -50,4 +62,18 @@ onMounted(() => useCustomAttributeStore().fetchCustomAttributes())
     @add-condition="add"
     @remove-condition="remove"
   />
+  <p v-else-if="isLoading" role="status" :class="MUTED_TEXT_CLASS">
+    {{ t('globals.terms.loading') }}
+  </p>
+  <div v-else class="space-y-3 rounded-md border border-dashed p-4">
+    <p :class="MUTED_TEXT_CLASS">
+      {{ t('widget.campaignContactAttributesEmpty') }}
+    </p>
+    <RouterLink
+      :to="{ name: 'custom-attributes' }"
+      :class="buttonVariants({ variant: 'link', size: 'sm' })"
+    >
+      {{ t('widget.addContactCustomAttribute') }}
+    </RouterLink>
+  </div>
 </template>
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
index b21c4b4c..a8143a28 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
@@ -251,7 +251,11 @@ export const createFormSchema = (t) =>
     linked_email_inbox_id: z.number().nullable().optional(),
     config: z.object({
       campaigns: z.array(createCampaignSchema(t)).max(50).default([]),
-      campaign_cooldown_hours: rangeInteger(t, 0, 8760).default(24),
+      campaign_cooldown: z
+        .string()
+        .min(1, { message: t('globals.messages.required') })
+        .refine(isGoDuration, { message: t('validation.invalidDuration') })
+        .default('24h'),
       help: z
         .object({
           help_center_id: z.number().int().min(0),
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
index b41bee72..cbc96bd6 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
@@ -287,7 +287,7 @@ describe('Livechat Inbox Form Schema', () => {
             repeat_hours: 0
           }
         ],
-        campaign_cooldown_hours: -1
+        campaign_cooldown: 'tomorrow'
       })
     )
     expect(result.success).toBe(false)
@@ -295,10 +295,19 @@ describe('Livechat Inbox Form Schema', () => {
       'widget.campaignUrlLimit {}',
       'validation.minmaxNumber {"min":0,"max":86400}',
       'validation.minmaxNumber {"min":1,"max":8760}',
-      'validation.minmaxNumber {"min":0,"max":8760}'
+      'validation.invalidDuration {}'
     ])
   })
 
+  test.each(['0s', '10m', '1h', '1h30m'])(
+    'campaign cooldown accepts %s',
+    (campaignCooldown) => {
+      expect(() =>
+        schema.parse(withConfig({ campaign_cooldown: campaignCooldown }))
+      ).not.toThrow()
+    }
+  )
+
   test('quick replies reject more than six non-empty lines', () => {
     expect(() => schema.parse(withConfig({ quick_replies: '1\n2\n3\n4\n5\n6\n7' }))).toThrow()
     expect(() => schema.parse(withConfig({ quick_replies: '1\n2\n\n3\n4\n5\n6' }))).not.toThrow()
diff --git a/frontend/apps/main/src/stores/customAttributes.js b/frontend/apps/main/src/stores/customAttributes.js
index db3e8021..c8f7be1e 100644
--- a/frontend/apps/main/src/stores/customAttributes.js
+++ b/frontend/apps/main/src/stores/customAttributes.js
@@ -1,9 +1,9 @@
 import { ref, computed } from 'vue'
 import { defineStore } from 'pinia'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
-import { useEmitter } from '../composables/useEmitter'
-import { EMITTER_EVENTS } from '../constants/emitterEvents'
-import api from '../api'
+import api from '@/api'
+import { EMITTER_EVENTS } from '@/constants/emitterEvents'
+import { useEmitter } from '@/composables/useEmitter'
 
 export const useCustomAttributeStore = defineStore('customAttributes', () => {
     const attributes = ref([])
@@ -28,8 +28,7 @@ export const useCustomAttributeStore = defineStore('customAttributes', () => {
     })
     let inflight = null
     let hasFetched = false
-    const fetchCustomAttributes = () => {
-        if (hasFetched) return Promise.resolve()
+    const loadCustomAttributes = () => {
         if (inflight) return inflight
         inflight = api.getCustomAttributes()
             .then(response => {
@@ -45,10 +44,13 @@ export const useCustomAttributeStore = defineStore('customAttributes', () => {
             .finally(() => { inflight = null })
         return inflight
     }
+    const fetchCustomAttributes = () => hasFetched ? Promise.resolve() : loadCustomAttributes()
+    const refreshCustomAttributes = () => loadCustomAttributes()
     return {
         attributes,
         conversationAttributeOptions,
         contactAttributeOptions,
         fetchCustomAttributes,
+        refreshCustomAttributes,
     }
-})
\ No newline at end of file
+})
diff --git a/frontend/apps/main/src/stores/customAttributes.test.js b/frontend/apps/main/src/stores/customAttributes.test.js
new file mode 100644
index 00000000..8b92a1d1
--- /dev/null
+++ b/frontend/apps/main/src/stores/customAttributes.test.js
@@ -0,0 +1,38 @@
+import { beforeEach, describe, expect, it, vi } from 'vitest'
+import { createPinia, setActivePinia } from 'pinia'
+
+vi.mock('@/api', () => ({
+  default: { getCustomAttributes: vi.fn() }
+}))
+
+vi.mock('@/composables/useEmitter', () => ({
+  useEmitter: () => ({ emit: vi.fn() })
+}))
+
+import api from '@/api'
+import { useCustomAttributeStore } from '@/stores/customAttributes'
+
+describe('custom attribute store', () => {
+  beforeEach(() => {
+    setActivePinia(createPinia())
+    vi.clearAllMocks()
+  })
+
+  it('refreshes attributes after the initial cached fetch', async () => {
+    api.getCustomAttributes
+      .mockResolvedValueOnce({ data: { data: [{ id: 1, applies_to: 'conversation' }] } })
+      .mockResolvedValueOnce({
+        data: { data: [{ id: 2, name: 'Plan', applies_to: 'contact' }] }
+      })
+    const store = useCustomAttributeStore()
+
+    await store.fetchCustomAttributes()
+    await store.fetchCustomAttributes()
+    await store.refreshCustomAttributes()
+
+    expect(api.getCustomAttributes).toHaveBeenCalledTimes(2)
+    expect(store.contactAttributeOptions).toEqual([
+      { id: 2, name: 'Plan', applies_to: 'contact', label: 'Plan', value: '2' }
+    ])
+  })
+})
diff --git a/frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js b/frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js
index e3d79b97..c2e4526c 100644
--- a/frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js
+++ b/frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js
@@ -129,6 +129,10 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
     cy.get('#campaign-exclude_urls').clear().type('/checkout/*')
     cy.get('#campaign-delay_seconds').type('{selectall}25')
     cy.get('#campaign-event').clear().type('pricing_viewed')
+    cy.contains(
+      'Show this message only after your website tracks this event. Leave this field blank to show it without an event.'
+    ).should('be.visible')
+    cy.contains('code', 'window.Libredesk.trackEvent("pricing_viewed")').should('be.visible')
     selectOption('#campaign-repeat', 'After an interval')
     cy.get('#campaign-repeat_hours').type('{selectall}12')
 
diff --git a/i18n/en-US.json b/i18n/en-US.json
index a3ad2c24..8e140fa4 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -1676,6 +1676,7 @@
   "webhook.sendTest": "Send test",
   "webhook.sentSuccessfully": "Webhook sent successfully",
   "widget.addCampaign": "Add proactive message",
+  "widget.addContactCustomAttribute": "Add contact custom attribute",
   "widget.addHelpHomeApp": "Add help articles",
   "widget.articleUnavailable": "Article unavailable",
   "widget.autoHideSeconds": "Hide previews after (seconds, 0 keeps them visible)",
@@ -1702,8 +1703,10 @@
   "widget.campaign.section.placement": "Where and when",
   "widget.campaign.session": "Once per session",
   "widget.campaign.users": "Signed-in users",
-  "widget.campaignCooldown": "Minimum hours between proactive messages",
+  "widget.campaignContactAttributesEmpty": "Visibility conditions use contact custom attributes. None are available.",
+  "widget.campaignCooldown": "Minimum time between proactive messages",
   "widget.campaignDeviceRequired": "Select at least one device. This proactive message cannot appear until desktop or mobile is enabled.",
+  "widget.campaignEventHint": "Show this message only after your website tracks this event. Leave this field blank to show it without an event.",
   "widget.campaignLimitReached": "You have reached the limit of 50 proactive messages. Delete one to add another.",
   "widget.campaignPriorityHint": "Messages are checked from top to bottom. The first matching message is shown.",
   "widget.campaignsHint": "Show a message on matching pages before the chat is opened. A conversation is created only when someone replies to it.",
diff --git a/internal/inbox/channel/livechat/livechat.go b/internal/inbox/channel/livechat/livechat.go
index 9d1e4975..e85f13ab 100644
--- a/internal/inbox/channel/livechat/livechat.go
+++ b/internal/inbox/channel/livechat/livechat.go
@@ -157,19 +157,19 @@ type PreChatFormConfig struct {
 
 // Config holds the live chat inbox configuration.
 type Config struct {
-	Campaigns             []proactive.Campaign `json:"campaigns"`
-	CampaignCooldownHours int                  `json:"campaign_cooldown_hours"`
-	Help                  HelpConfig           `json:"help"`
-	Previews              PreviewConfig        `json:"previews"`
-	BrandName             string               `json:"brand_name"`
-	WebsiteURL            string               `json:"website_url"`
-	Theme                 string               `json:"theme"`
-	ShowPoweredBy         bool                 `json:"show_powered_by"`
-	Language              string               `json:"language"`
-	FallbackLanguage      string               `json:"fallback_language"`
-	Users                 AudienceConfig       `json:"users"`
-	Branding              BrandingSet          `json:"branding"`
-	Features              struct {
+	Campaigns        []proactive.Campaign `json:"campaigns"`
+	CampaignCooldown string               `json:"campaign_cooldown"`
+	Help             HelpConfig           `json:"help"`
+	Previews         PreviewConfig        `json:"previews"`
+	BrandName        string               `json:"brand_name"`
+	WebsiteURL       string               `json:"website_url"`
+	Theme            string               `json:"theme"`
+	ShowPoweredBy    bool                 `json:"show_powered_by"`
+	Language         string               `json:"language"`
+	FallbackLanguage string               `json:"fallback_language"`
+	Users            AudienceConfig       `json:"users"`
+	Branding         BrandingSet          `json:"branding"`
+	Features         struct {
 		Emoji      bool `json:"emoji"`
 		FileUpload bool `json:"file_upload"`
 		Transcript bool `json:"transcript"`
diff --git a/internal/inbox/channel/livechat/proactive/eligibility_test.go b/internal/inbox/channel/livechat/proactive/eligibility_test.go
index cd7b987a..53ce239b 100644
--- a/internal/inbox/channel/livechat/proactive/eligibility_test.go
+++ b/internal/inbox/channel/livechat/proactive/eligibility_test.go
@@ -36,33 +36,33 @@ func TestEligibilityAndSuppression(t *testing.T) {
 		}
 	}
 	history := []Delivery{{CampaignID: "a", Displayed: true, CreatedAt: now.Add(-48 * time.Hour), SessionKey: "session"}}
-	if got := Suppression(campaign, ctx, history, 24); got != "repeat" {
+	if got := Suppression(campaign, ctx, history, 24*time.Hour); got != "repeat" {
 		t.Fatalf("once: %q", got)
 	}
 	campaign.Repeat = "session"
-	if got := Suppression(campaign, ctx, history, 24); got != "repeat" {
+	if got := Suppression(campaign, ctx, history, 24*time.Hour); got != "repeat" {
 		t.Fatalf("session: %q", got)
 	}
 	ctx.SessionKey = "new"
-	if got := Suppression(campaign, ctx, history, 24); got != "" {
+	if got := Suppression(campaign, ctx, history, 24*time.Hour); got != "" {
 		t.Fatalf("new session: %q", got)
 	}
 	campaign.Repeat = "interval"
 	campaign.RepeatHours = 72
-	if got := Suppression(campaign, ctx, history, 24); got != "repeat" {
+	if got := Suppression(campaign, ctx, history, 24*time.Hour); got != "repeat" {
 		t.Fatalf("interval: %q", got)
 	}
 	history[0].CampaignID = "other"
 	history[0].CreatedAt = now.Add(-time.Hour)
-	if got := Suppression(campaign, ctx, history, 24); got != "cooldown" {
+	if got := Suppression(campaign, ctx, history, 90*time.Minute); got != "cooldown" {
 		t.Fatalf("shared cooldown: %q", got)
 	}
 	history[0].Displayed = false
-	if got := Suppression(campaign, ctx, history, 24); got != "" {
+	if got := Suppression(campaign, ctx, history, 90*time.Minute); got != "" {
 		t.Fatalf("expired reservation suppressed: %q", got)
 	}
 	history[0].CreatedAt = now.Add(-time.Second)
-	if got := Suppression(campaign, ctx, history, 24); got != "cooldown" {
+	if got := Suppression(campaign, ctx, history, 10*time.Minute); got != "cooldown" {
 		t.Fatalf("concurrent reservation: %q", got)
 	}
 }
diff --git a/internal/inbox/channel/livechat/proactive/proactive.go b/internal/inbox/channel/livechat/proactive/proactive.go
index abd227b8..b3d57458 100644
--- a/internal/inbox/channel/livechat/proactive/proactive.go
+++ b/internal/inbox/channel/livechat/proactive/proactive.go
@@ -112,7 +112,7 @@ func (m *Manager) error(err error) error {
 	return envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
 }
 
-func Suppression(c Campaign, ctx Context, history []Delivery, cooldownHours int) string {
+func Suppression(c Campaign, ctx Context, history []Delivery, cooldown time.Duration) string {
 	for _, d := range history {
 		if !d.Displayed && !d.Dismissed && !d.Replied && ctx.Now.Sub(d.CreatedAt) > time.Minute {
 			continue
@@ -123,7 +123,7 @@ func Suppression(c Campaign, ctx Context, history []Delivery, cooldownHours int)
 			}
 			continue
 		}
-		if cooldownHours > 0 && ctx.Now.Sub(d.CreatedAt) < time.Duration(cooldownHours)*time.Hour {
+		if cooldown > 0 && ctx.Now.Sub(d.CreatedAt) < cooldown {
 			return "cooldown"
 		}
 	}
diff --git a/internal/inbox/channel/livechat/proactive/proactive_test.go b/internal/inbox/channel/livechat/proactive/proactive_test.go
index 2b62d88d..4658e640 100644
--- a/internal/inbox/channel/livechat/proactive/proactive_test.go
+++ b/internal/inbox/channel/livechat/proactive/proactive_test.go
@@ -34,7 +34,7 @@ func TestConcurrentDeliveryAndOwnership(t *testing.T) {
 				t.Error(err)
 				return
 			}
-			if Suppression(c, ctx, history, 24) != "" {
+			if Suppression(c, ctx, history, 24*time.Hour) != "" {
 				return
 			}
 			delivery, err := m.Reserve(inboxID, c, ctx, Snapshot{Message: "Hello"})
@@ -83,7 +83,7 @@ func TestConcurrentDeliveryAndOwnership(t *testing.T) {
 	if err != nil {
 		t.Fatal(err)
 	}
-	if Suppression(c, ctx, history, 24) != "repeat" {
+	if Suppression(c, ctx, history, 24*time.Hour) != "repeat" {
 		t.Fatal("identified contact lost delivery history")
 	}
 }

From 127d98c46eccd159da56198e2d6f417735269b24 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 03:17:42 +0530
Subject: [PATCH 138/178] fix proactive message bugs and simplify launcher and
 preview settings

---
 cmd/chat.go                                   |   5 -
 cmd/chat_test.go                              |   6 +-
 cmd/inboxes.go                                |   6 -
 cmd/widget_campaign.go                        |   2 +-
 .../src/features/admin/automation/RuleBox.vue |   7 +-
 .../admin/inbox/LivechatInboxForm.vue         | 130 +++---------------
 .../admin/inbox/LivechatWidgetPreview.vue     |  16 +--
 .../features/admin/inbox/WidgetCampaigns.vue  |  12 +-
 .../admin/inbox/livechatFormSchema.js         |  54 ++++----
 .../admin/inbox/livechatFormSchema.test.js    | 130 ++++++------------
 .../src/composables/useReplyPreviews.js       |  23 +---
 .../e2e/integration/livechat/config.cy.js     |   6 +-
 .../cypress/e2e/ui/livechatFormFields.cy.js   |  31 -----
 .../cypress/e2e/ui/livechatFormLayout.cy.js   |   6 +-
 .../e2e/ui/livechatThemeBranding.cy.js        |  11 +-
 frontend/cypress/support/livechat.js          |   4 +-
 i18n/en-US.json                               |   7 -
 internal/inbox/channel/livechat/livechat.go   |  16 +--
 .../inbox/channel/livechat/livechat_test.go   |   8 +-
 .../channel/livechat/proactive/eligibility.go |   2 +
 .../livechat/proactive/eligibility_test.go    |  44 ++++++
 .../channel/livechat/proactive/proactive.go   |   1 -
 static/widget.js                              |  32 ++---
 23 files changed, 184 insertions(+), 375 deletions(-)

diff --git a/cmd/chat.go b/cmd/chat.go
index 6e8d1ca2..c196b287 100644
--- a/cmd/chat.go
+++ b/cmd/chat.go
@@ -146,11 +146,6 @@ func handleGetChatSettings(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, err.Error(), nil))
 	}
-	if config.Previews.Content == "" {
-		config.Previews.Desktop = true
-		config.Previews.Mobile = true
-		config.Previews.Content = "message"
-	}
 	customAttributes := map[int]customAttributeWidget(nil)
 	if config.PreChatForm.Enabled {
 		config, customAttributes = filterPreChatForms(config, app)
diff --git a/cmd/chat_test.go b/cmd/chat_test.go
index 1197f2bd..dbffa582 100644
--- a/cmd/chat_test.go
+++ b/cmd/chat_test.go
@@ -86,7 +86,6 @@ func TestChatLauncherSettingsKeepsLegacyFields(t *testing.T) {
 		Theme: livechat.ThemeDark,
 		Launcher: livechat.LauncherLayout{
 			Position:  "right",
-			Size:      64,
 			IconScale: 80,
 			Spacing:   livechat.LauncherSpacing{Side: 20, Bottom: 24},
 		},
@@ -107,7 +106,6 @@ func TestChatLauncherSettingsKeepsLegacyFields(t *testing.T) {
 		Colors   livechat.Colors `json:"colors"`
 		Launcher struct {
 			Position  string `json:"position"`
-			Size      int    `json:"size"`
 			IconScale int    `json:"icon_scale"`
 			LogoURL   string `json:"logo_url"`
 			Color     string `json:"color"`
@@ -120,7 +118,7 @@ func TestChatLauncherSettingsKeepsLegacyFields(t *testing.T) {
 	if response.Colors.Primary != "#111111" {
 		t.Fatalf("legacy primary = %q", response.Colors.Primary)
 	}
-	if response.Launcher.Position != "right" || response.Launcher.Size != 64 || response.Launcher.IconScale != 80 {
+	if response.Launcher.Position != "right" || response.Launcher.IconScale != 80 {
 		t.Fatalf("legacy launcher layout = %+v", response.Launcher)
 	}
 	if response.Launcher.LogoURL != "https://example.com/logo.png" || response.Launcher.Color != "#222222" {
@@ -155,7 +153,7 @@ func TestChatLauncherSettingsKeepsLegacyFields(t *testing.T) {
 	if !fullSettings.DarkMode || fullSettings.Colors.Primary != "#111111" {
 		t.Fatalf("legacy theme = %+v", fullSettings)
 	}
-	if fullSettings.Launcher.LogoURL != "https://example.com/logo.png" || fullSettings.Launcher.Size != 64 {
+	if fullSettings.Launcher.LogoURL != "https://example.com/logo.png" {
 		t.Fatalf("legacy launcher = %+v", fullSettings.Launcher)
 	}
 	if fullSettings.Branding.Dark.Colors.Primary != "#111111" {
diff --git a/cmd/inboxes.go b/cmd/inboxes.go
index e133dc9e..442b4b3a 100644
--- a/cmd/inboxes.go
+++ b/cmd/inboxes.go
@@ -22,8 +22,6 @@ import (
 var hexColorRegex = regexp.MustCompile(`^#([A-Fa-f0-9]{6}|[A-Fa-f0-9]{3})$`)
 
 const (
-	minLauncherSize      = 40
-	maxLauncherSize      = 80
 	minLauncherIconScale = 40
 	maxLauncherIconScale = 100
 )
@@ -315,10 +313,6 @@ func validateInbox(app *App, inbox imodels.Inbox) error {
 			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
 		}
 
-		if config.Launcher.Size < minLauncherSize || config.Launcher.Size > maxLauncherSize {
-			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
-		}
-
 		if config.Launcher.IconScale < minLauncherIconScale || config.Launcher.IconScale > maxLauncherIconScale {
 			return envelope.NewError(envelope.InputError, app.i18n.T("validation.invalidValue"), nil)
 		}
diff --git a/cmd/widget_campaign.go b/cmd/widget_campaign.go
index 843d4bc5..2fb4ac6e 100644
--- a/cmd/widget_campaign.go
+++ b/cmd/widget_campaign.go
@@ -241,7 +241,7 @@ func campaignInputError(app *App) error {
 }
 
 func validateWidgetFeatures(app *App, config livechat.Config) error {
-	if config.Help.HelpCenterID < 0 || len(config.Help.FeaturedIDs) > 10 || config.Previews.AutoHideSeconds < 0 || config.Previews.AutoHideSeconds > 300 || !slices.Contains([]string{"", "message", "generic"}, config.Previews.Content) || len(config.Campaigns) > 50 {
+	if config.Help.HelpCenterID < 0 || len(config.Help.FeaturedIDs) > 10 || len(config.Campaigns) > 50 {
 		return campaignInputError(app)
 	}
 	if _, err := parseCampaignCooldown(config.CampaignCooldown); err != nil {
diff --git a/frontend/apps/main/src/features/admin/automation/RuleBox.vue b/frontend/apps/main/src/features/admin/automation/RuleBox.vue
index 067cc5bd..ad2fc715 100644
--- a/frontend/apps/main/src/features/admin/automation/RuleBox.vue
+++ b/frontend/apps/main/src/features/admin/automation/RuleBox.vue
@@ -310,11 +310,8 @@ const handleFieldChange = (value, ruleIndex) => {
 }
 
 const handleOperatorChange = (value, ruleIndex) => {
-  if (['contains', 'not contains'].includes(value)) {
-    ruleGroup.value.rules[ruleIndex].value = []
-  } else {
-    ruleGroup.value.rules[ruleIndex].value = ''
-  }
+  // Every operator stores its value as a comma separated string, multi-value ones included.
+  ruleGroup.value.rules[ruleIndex].value = ''
   ruleGroup.value.rules[ruleIndex].operator = value
   emitUpdate()
 }
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
index 44bbfe69..a9982a92 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
@@ -525,45 +525,27 @@
                     </FormField>
                   </div>
 
-                  <div class="grid grid-cols-2 gap-4">
-                    <FormField v-slot="{ componentField }" name="config.launcher.position">
-                      <FormItem>
-                        <FormLabel>{{ $t('admin.inbox.livechat.launcher.position') }}</FormLabel>
-                        <FormControl>
-                          <Select v-bind="componentField">
-                            <SelectTrigger>
-                              <SelectValue :placeholder="$t('placeholders.selectPosition')" />
-                            </SelectTrigger>
-                            <SelectContent>
-                              <SelectItem value="left">{{
-                                $t('admin.inbox.livechat.launcher.position.left')
-                              }}</SelectItem>
-                              <SelectItem value="right">{{
-                                $t('admin.inbox.livechat.launcher.position.right')
-                              }}</SelectItem>
-                            </SelectContent>
-                          </Select>
-                        </FormControl>
-                        <FormMessage />
-                      </FormItem>
-                    </FormField>
-
-                    <FormField v-slot="{ componentField }" name="config.launcher.size">
-                      <FormItem>
-                        <FormLabel>{{ $t('admin.inbox.livechat.launcher.size') }}</FormLabel>
-                        <FormControl>
-                          <Input
-                            type="number"
-                            placeholder="60"
-                            min="40"
-                            max="80"
-                            v-bind="componentField"
-                          />
-                        </FormControl>
-                        <FormMessage />
-                      </FormItem>
-                    </FormField>
-                  </div>
+                  <FormField v-slot="{ componentField }" name="config.launcher.position">
+                    <FormItem>
+                      <FormLabel>{{ $t('admin.inbox.livechat.launcher.position') }}</FormLabel>
+                      <FormControl>
+                        <Select v-bind="componentField">
+                          <SelectTrigger>
+                            <SelectValue :placeholder="$t('placeholders.selectPosition')" />
+                          </SelectTrigger>
+                          <SelectContent>
+                            <SelectItem value="left">{{
+                              $t('admin.inbox.livechat.launcher.position.left')
+                            }}</SelectItem>
+                            <SelectItem value="right">{{
+                              $t('admin.inbox.livechat.launcher.position.right')
+                            }}</SelectItem>
+                          </SelectContent>
+                        </Select>
+                      </FormControl>
+                      <FormMessage />
+                    </FormItem>
+                  </FormField>
 
                   <div class="grid grid-cols-3 gap-4">
                     <FormField v-slot="{ componentField }" name="config.launcher.icon_scale">
@@ -626,69 +608,6 @@
                 </div>
               </AccordionContent>
             </AccordionItem>
-            <AccordionItem value="previews" data-section="previews">
-              <AccordionTrigger class="text-base">{{ $t('widget.replyPreviews') }}</AccordionTrigger>
-              <AccordionContent force-mount class="space-y-8 pt-2">
-                <div class="space-y-4">
-                  <FormField
-                    v-for="device in ['desktop', 'mobile']"
-                    :key="device"
-                    v-slot="{ componentField, handleChange }"
-                    :name="`config.previews.${device}`"
-                  >
-                    <FormItem>
-                      <SwitchField
-                        :title="$t(`globals.terms.${device}`)"
-                        :checked="componentField.modelValue"
-                        @update:checked="handleChange"
-                      />
-                    </FormItem>
-                  </FormField>
-
-                  <div class="grid grid-cols-2 gap-4">
-                    <FormField v-slot="{ componentField }" name="config.previews.content">
-                      <FormItem>
-                        <FormLabel>{{ $t('widget.previewContent') }}</FormLabel>
-                        <Select v-bind="componentField">
-                          <SelectTrigger><SelectValue /></SelectTrigger>
-                          <SelectContent>
-                            <SelectItem value="message">{{
-                              $t('widget.messagePreview')
-                            }}</SelectItem>
-                            <SelectItem value="generic">{{
-                              $t('widget.genericNotice')
-                            }}</SelectItem>
-                          </SelectContent>
-                        </Select>
-                        <FormMessage />
-                      </FormItem>
-                    </FormField>
-
-                    <FormField
-                      v-slot="{ value, handleChange, meta }"
-                      name="config.previews.auto_hide_seconds"
-                    >
-                      <FormItem>
-                        <FormLabel>{{ $t('widget.autoHideSeconds') }}</FormLabel>
-                        <FormControl>
-                          <Input
-                            type="number"
-                            name="config.previews.auto_hide_seconds"
-                            min="0"
-                            max="300"
-                            :model-value="value"
-                            @update:model-value="
-                              (value) => handleChange(value === '' ? '' : Number(value), meta.validated)
-                            "
-                          />
-                        </FormControl>
-                        <FormMessage />
-                      </FormItem>
-                    </FormField>
-                  </div>
-                </div>
-              </AccordionContent>
-            </AccordionItem>
           </Accordion>
         </div>
 
@@ -1448,7 +1367,6 @@ import { toTypedSchema } from '@vee-validate/zod'
 import {
   createFormSchema,
   defaultWidgetHelp,
-  defaultWidgetPreviews,
   normalizeAudienceConfig,
   normalizePrechatConfig
 } from './livechatFormSchema.js'
@@ -1505,7 +1423,6 @@ const HEX_COLOR = /^#([0-9a-f]{6}|[0-9a-f]{3})$/i
 const WIDGET_BG = { light: '#ffffff', dark: '#1a1a1e' }
 const DEFAULT_GRADIENT_START = '#2563eb'
 const DEFAULT_GRADIENT_END = '#1e40af'
-const DEFAULT_LAUNCHER_SIZE = 60
 const DEFAULT_LAUNCHER_ICON_SCALE = 100
 const MASKED_SECRET = '••••••••••'
 
@@ -1517,7 +1434,6 @@ const SECTION_TAB = {
   appearance: 'appearance',
   branding: 'appearance',
   launcher: 'appearance',
-  previews: 'appearance',
   messages: 'content',
   noticeBanner: 'content',
   homeApps: 'content',
@@ -1548,7 +1464,6 @@ const LEGACY_TAB_SECTION = {
 // Ordered: specific prefixes before the general-tab fallbacks.
 const FIELD_SECTION = [
   ['config.help', 'help'],
-  ['config.previews', 'previews'],
   ['config.campaign', 'campaigns'],
   ['config.branding', 'branding'],
   ['config.theme', 'appearance'],
@@ -1730,7 +1645,6 @@ const form = useForm({
     linked_email_inbox_id: null,
     config: {
       help: defaultWidgetHelp(),
-      previews: defaultWidgetPreviews(),
       campaigns: [],
       campaign_cooldown: '24h',
       brand_name: '',
@@ -1745,7 +1659,6 @@ const form = useForm({
       },
       launcher: {
         position: 'right',
-        size: DEFAULT_LAUNCHER_SIZE,
         icon_scale: DEFAULT_LAUNCHER_ICON_SCALE,
         spacing: {
           side: 20,
@@ -2132,7 +2045,6 @@ watch(
           campaigns: newValues.config?.campaigns || [],
           campaign_cooldown: newValues.config?.campaign_cooldown || '24h',
           help: newValues.config?.help || defaultWidgetHelp(),
-          previews: newValues.config?.previews || defaultWidgetPreviews(),
           features: {
             ...newValues.config?.features,
             transcript: newValues.config?.features?.transcript ?? false
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
index 2ef20aa8..0749a887 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
@@ -533,11 +533,8 @@ import { renderTemplate } from '@shared-ui/utils/string'
 
 const DEFAULT_LAUNCHER_LOGO = '/static/public/launcher-logo.png'
 const HEX_COLOR = /^#([0-9a-f]{6}|[0-9a-f]{3})$/i
-const DEFAULT_LAUNCHER_SIZE = 60
+const LAUNCHER_SIZE = 52
 const DEFAULT_LAUNCHER_ICON_SCALE = 100
-// The preview stage is smaller than a real page, so the launcher renders at 52px for the
-// default 60px setting and every other size is scaled by the same ratio.
-const LAUNCHER_PREVIEW_SCALE = 52 / 60
 const SNIPPET_LENGTH = 240
 
 const props = defineProps({
@@ -740,12 +737,7 @@ const onLeft = computed(() => props.config.launcher?.position === 'left')
 const clampSpacing = (value) => Math.min(Number(value) || 20, 40)
 const clampedSide = computed(() => clampSpacing(props.config.launcher?.spacing?.side))
 const clampedBottom = computed(() => clampSpacing(props.config.launcher?.spacing?.bottom))
-const launcherSize = computed(() =>
-  Math.round(
-    (Number(props.config.launcher?.size) || DEFAULT_LAUNCHER_SIZE) * LAUNCHER_PREVIEW_SCALE
-  )
-)
-const windowBottom = computed(() => clampedBottom.value + launcherSize.value + 12)
+const windowBottom = computed(() => clampedBottom.value + LAUNCHER_SIZE + 12)
 const launcherIconScale = computed(
   () => Number(props.config.launcher?.icon_scale) || DEFAULT_LAUNCHER_ICON_SCALE
 )
@@ -769,8 +761,8 @@ const campaignStyle = computed(() => ({
 }))
 const launcherStyle = computed(() => ({
   filter: LAUNCHER_DROP_SHADOW,
-  width: launcherSize.value + 'px',
-  height: launcherSize.value + 'px',
+  width: LAUNCHER_SIZE + 'px',
+  height: LAUNCHER_SIZE + 'px',
   backgroundColor: launcherColor.value,
   bottom: clampedBottom.value + 'px',
   [onLeft.value ? 'left' : 'right']: clampedSide.value + 'px'
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
index 7395eac6..c94dd7f2 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
@@ -248,6 +248,14 @@ const showInvalidField = async (field) => {
 
 defineExpose({ showInvalidField })
 
+const visibleStats = computed(() =>
+  stats.value.filter(
+    (row) =>
+      props.modelValue.some((item) => item.id === row.campaign_id) ||
+      STAT_KEYS.some((key) => row[key] > 0)
+  )
+)
+
 const refreshStats = async () => {
   if (!props.inboxId) return
   try {
@@ -405,7 +413,7 @@ onMounted(async () => {
               </TableRow>
             </TableHeader>
             <TableBody>
-              <TableRow v-for="row in stats" :key="row.campaign_id">
+              <TableRow v-for="row in visibleStats" :key="row.campaign_id">
                 <TableCell>
                   {{
                     modelValue.find((item) => item.id === row.campaign_id)?.name ||
@@ -416,7 +424,7 @@ onMounted(async () => {
                   {{ row[key] }}
                 </TableCell>
               </TableRow>
-              <TableRow v-if="!stats.length">
+              <TableRow v-if="!visibleStats.length">
                 <TableCell :colspan="STAT_KEYS.length + 1" class="text-muted-foreground">
                   {{ t('globals.messages.noResultsFound') }}
                 </TableCell>
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
index a8143a28..e30a1366 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
@@ -115,12 +115,6 @@ export const defaultWidgetHelp = () => ({
   users: { tab: true },
   featured_ids: []
 })
-export const defaultWidgetPreviews = () => ({
-  desktop: true,
-  mobile: true,
-  content: 'message',
-  auto_hide_seconds: 0
-})
 export const createWidgetConditionsSchema = (t) =>
   z.object({
     logical_op: z.enum(['AND', 'OR']),
@@ -264,14 +258,6 @@ export const createFormSchema = (t) =>
           featured_ids: z.array(z.number().int().positive()).max(10)
         })
         .default(defaultWidgetHelp),
-      previews: z
-        .object({
-          desktop: z.boolean(),
-          mobile: z.boolean(),
-          content: z.enum(['message', 'generic']),
-          auto_hide_seconds: rangeInteger(t, 0, 300)
-        })
-        .default(defaultWidgetPreviews),
       brand_name: z.string().min(1, { message: t('globals.messages.required') }),
       website_url: optionalUrl(t),
       theme: z.enum(['system', 'light', 'dark']),
@@ -284,7 +270,6 @@ export const createFormSchema = (t) =>
       }),
       launcher: z.object({
         position: z.enum(['left', 'right']),
-        size: rangeInteger(t, 40, 80),
         icon_scale: rangeInteger(t, 40, 100),
         spacing: z.object({
           side: spacingNumber(t),
@@ -319,15 +304,9 @@ export const createFormSchema = (t) =>
       }),
       continuity: z
         .object({
-          offline_threshold: z
-            .string()
-            .min(1, { message: t('globals.messages.required') })
-            .refine(isGoDuration, { message: t('validation.invalidDuration') }),
-          max_messages_per_email: rangeNumber(t, 1, 100),
-          min_email_interval: z
-            .string()
-            .min(1, { message: t('globals.messages.required') })
-            .refine(isGoDuration, { message: t('validation.invalidDuration') })
+          offline_threshold: z.string().optional().or(z.literal('')),
+          max_messages_per_email: z.coerce.number().optional(),
+          min_email_interval: z.string().optional().or(z.literal(''))
         })
         .optional(),
       session_duration: z
@@ -379,3 +358,30 @@ export const createFormSchema = (t) =>
       })
     })
   })
+    .superRefine((values, ctx) => {
+      if (!values.linked_email_inbox_id) return
+      const continuity = values.config?.continuity ?? {}
+      for (const field of ['offline_threshold', 'min_email_interval']) {
+        if (!continuity[field]) {
+          ctx.addIssue({
+            code: z.ZodIssueCode.custom,
+            path: ['config', 'continuity', field],
+            message: t('globals.messages.required')
+          })
+        } else if (!isGoDuration(continuity[field])) {
+          ctx.addIssue({
+            code: z.ZodIssueCode.custom,
+            path: ['config', 'continuity', field],
+            message: t('validation.invalidDuration')
+          })
+        }
+      }
+      const max = Number(continuity.max_messages_per_email)
+      if (!Number.isFinite(max) || max < 1 || max > 100) {
+        ctx.addIssue({
+          code: z.ZodIssueCode.custom,
+          path: ['config', 'continuity', 'max_messages_per_email'],
+          message: t('validation.minmaxNumber', { min: 1, max: 100 })
+        })
+      }
+    })
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
index cbc96bd6..bb44bb37 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
@@ -27,7 +27,6 @@ const validConfig = {
   language: 'en',
   launcher: {
     position: 'right',
-    size: 60,
     icon_scale: 100,
     spacing: { side: 20, bottom: 20 }
   },
@@ -66,6 +65,10 @@ const validForm = {
 }
 
 const withConfig = (overrides) => ({ ...validForm, config: { ...validConfig, ...overrides } })
+const withContinuity = (continuity) => ({
+  ...withConfig({ continuity }),
+  linked_email_inbox_id: 3
+})
 const withBranding = (overrides, theme = 'light') =>
   withConfig({
     branding: {
@@ -98,13 +101,7 @@ const validCampaign = {
 
 describe('Livechat Inbox Form Schema', () => {
   test('valid minimal form', () => {
-    const parsed = schema.parse(validForm)
-    expect(parsed.config.previews).toEqual({
-      desktop: true,
-      mobile: true,
-      content: 'message',
-      auto_hide_seconds: 0
-    })
+    expect(() => schema.parse(validForm)).not.toThrow()
   })
 
   test('help tab preserves audience placement and featured article order', () => {
@@ -142,23 +139,6 @@ describe('Livechat Inbox Form Schema', () => {
     ).toThrow()
   })
 
-  test('reply preview settings enforce the auto-hide range', () => {
-    expect(() =>
-      schema.parse(
-        withConfig({
-          previews: { desktop: true, mobile: false, content: 'generic', auto_hide_seconds: 300 }
-        })
-      )
-    ).not.toThrow()
-    expect(() =>
-      schema.parse(
-        withConfig({
-          previews: { desktop: true, mobile: true, content: 'message', auto_hide_seconds: 301 }
-        })
-      )
-    ).toThrow()
-  })
-
   test('valid complete form', () => {
     expect(() =>
       schema.parse({
@@ -469,30 +449,6 @@ describe('Livechat Inbox Form Schema', () => {
     expect(() => schema.parse(withConfig({ theme }))).not.toThrow()
   })
 
-  test('launcher size out of range', () => {
-    expect(() =>
-      schema.parse(withConfig({ launcher: { ...validConfig.launcher, size: 39 } }))
-    ).toThrow()
-    expect(() =>
-      schema.parse(withConfig({ launcher: { ...validConfig.launcher, size: 81 } }))
-    ).toThrow()
-  })
-
-  test('launcher size at boundaries', () => {
-    expect(() =>
-      schema.parse(withConfig({ launcher: { ...validConfig.launcher, size: 40 } }))
-    ).not.toThrow()
-    expect(() =>
-      schema.parse(withConfig({ launcher: { ...validConfig.launcher, size: 80 } }))
-    ).not.toThrow()
-  })
-
-  test('launcher size rejects a fraction', () => {
-    expect(() =>
-      schema.parse(withConfig({ launcher: { ...validConfig.launcher, size: 60.5 } }))
-    ).toThrow()
-  })
-
   test('launcher icon scale out of range', () => {
     expect(() =>
       schema.parse(withConfig({ launcher: { ...validConfig.launcher, icon_scale: 39 } }))
@@ -511,11 +467,6 @@ describe('Livechat Inbox Form Schema', () => {
     ).not.toThrow()
   })
 
-  test('launcher size coerced from string', () => {
-    const parsed = schema.parse(withConfig({ launcher: { ...validConfig.launcher, size: '72' } }))
-    expect(parsed.config.launcher.size).toBe(72)
-  })
-
   test('launcher position invalid', () => {
     expect(() =>
       schema.parse(
@@ -635,15 +586,38 @@ describe('Livechat Inbox Form Schema', () => {
     expect(() => schema.parse(validForm)).not.toThrow()
   })
 
-  test('continuity offline_threshold invalid duration', () => {
+  test('continuity blank when no email inbox is linked', () => {
     expect(() =>
       schema.parse(
         withConfig({
-          continuity: {
-            offline_threshold: '5 min',
-            max_messages_per_email: 10,
-            min_email_interval: '30m'
-          }
+          continuity: { offline_threshold: '', max_messages_per_email: 0, min_email_interval: '' }
+        })
+      )
+    ).not.toThrow()
+    expect(() => schema.parse(withConfig({ continuity: {} }))).not.toThrow()
+  })
+
+  test('continuity required when an email inbox is linked', () => {
+    expect(() => schema.parse(withContinuity({}))).toThrow()
+    expect(() =>
+      schema.parse(
+        withContinuity({ offline_threshold: '', max_messages_per_email: 10, min_email_interval: '30m' })
+      )
+    ).toThrow()
+    expect(() =>
+      schema.parse(
+        withContinuity({ offline_threshold: '5m', max_messages_per_email: 10, min_email_interval: '' })
+      )
+    ).toThrow()
+  })
+
+  test('continuity offline_threshold invalid duration', () => {
+    expect(() =>
+      schema.parse(
+        withContinuity({
+          offline_threshold: '5 min',
+          max_messages_per_email: 10,
+          min_email_interval: '30m'
         })
       )
     ).toThrow()
@@ -652,23 +626,15 @@ describe('Livechat Inbox Form Schema', () => {
   test('continuity max_messages_per_email out of range', () => {
     expect(() =>
       schema.parse(
-        withConfig({
-          continuity: {
-            offline_threshold: '5m',
-            max_messages_per_email: 0,
-            min_email_interval: '30m'
-          }
-        })
+        withContinuity({ offline_threshold: '5m', max_messages_per_email: 0, min_email_interval: '30m' })
       )
     ).toThrow()
     expect(() =>
       schema.parse(
-        withConfig({
-          continuity: {
-            offline_threshold: '5m',
-            max_messages_per_email: 101,
-            min_email_interval: '30m'
-          }
+        withContinuity({
+          offline_threshold: '5m',
+          max_messages_per_email: 101,
+          min_email_interval: '30m'
         })
       )
     ).toThrow()
@@ -677,23 +643,15 @@ describe('Livechat Inbox Form Schema', () => {
   test('continuity max_messages_per_email at boundaries', () => {
     expect(() =>
       schema.parse(
-        withConfig({
-          continuity: {
-            offline_threshold: '5m',
-            max_messages_per_email: 1,
-            min_email_interval: '30m'
-          }
-        })
+        withContinuity({ offline_threshold: '5m', max_messages_per_email: 1, min_email_interval: '30m' })
       )
     ).not.toThrow()
     expect(() =>
       schema.parse(
-        withConfig({
-          continuity: {
-            offline_threshold: '5m',
-            max_messages_per_email: 100,
-            min_email_interval: '30m'
-          }
+        withContinuity({
+          offline_threshold: '5m',
+          max_messages_per_email: 100,
+          min_email_interval: '30m'
         })
       )
     ).not.toThrow()
diff --git a/frontend/apps/widget/src/composables/useReplyPreviews.js b/frontend/apps/widget/src/composables/useReplyPreviews.js
index d844b016..578693ba 100644
--- a/frontend/apps/widget/src/composables/useReplyPreviews.js
+++ b/frontend/apps/widget/src/composables/useReplyPreviews.js
@@ -13,13 +13,7 @@ export function useReplyPreviews() {
   const user = useUserStore()
   const { t } = useI18n()
   watch(
-    () => [
-      chat.getConversations,
-      user.userID,
-      widget.config.previews,
-      widget.isDark,
-      widget.isOpen
-    ],
+    () => [chat.getConversations, user.userID, widget.isDark, widget.isOpen],
     async () => {
       await nextTick()
       const element = document.querySelector('.libredesk-widget-app')
@@ -46,16 +40,12 @@ export function useReplyPreviews() {
               widget.config.brand_name,
             avatar: author.avatar_url || '',
             text:
-              widget.config.previews?.content === 'generic'
-                ? t('widget.newReply')
-                : getTextFromHTML(message.text_content || message.content || '').slice(0, 240) ||
-                  t('globals.terms.attachment'),
+              getTextFromHTML(message.text_content || message.content || '').slice(0, 240) ||
+              t('globals.terms.attachment'),
             image:
-              widget.config.previews?.content === 'generic'
-                ? ''
-                : message.attachments?.find((attachment) =>
-                    attachment.content_type?.startsWith('image/')
-                  )?.thumbnail_url || ''
+              message.attachments?.find((attachment) =>
+                attachment.content_type?.startsWith('image/')
+              )?.thumbnail_url || ''
           }
         })
       const target = parentOrigin()
@@ -65,7 +55,6 @@ export function useReplyPreviews() {
           type: 'REPLY_PREVIEWS',
           identity: String(user.userID || 'visitor'),
           previews,
-          config: { ...widget.config.previews },
           labels: {
             dismiss: t('globals.terms.dismiss'),
             dismissAll: t('widget.dismissPreviews'),
diff --git a/frontend/cypress/e2e/integration/livechat/config.cy.js b/frontend/cypress/e2e/integration/livechat/config.cy.js
index f714d7cf..e66a338b 100644
--- a/frontend/cypress/e2e/integration/livechat/config.cy.js
+++ b/frontend/cypress/e2e/integration/livechat/config.cy.js
@@ -217,12 +217,12 @@ describe('Live chat widget config applied end to end', () => {
     })
   })
 
-  it('renders the launcher at the configured size', () => {
-    cy.createLivechatInbox(withStart({ launcher: { size: 48 } })).then((inbox) => {
+  it('renders the launcher at its fixed size', () => {
+    cy.createLivechatInbox(withStart()).then((inbox) => {
       cy.visitWidgetHost(inbox.uuid)
       cy.widgetLauncher().then((el) => {
         const style = el[0].ownerDocument.defaultView.getComputedStyle(el[0])
-        expect(style.width, 'launcher size not applied').to.eq('48px')
+        expect(style.width, 'launcher size').to.eq('60px')
       })
     })
   })
diff --git a/frontend/cypress/e2e/ui/livechatFormFields.cy.js b/frontend/cypress/e2e/ui/livechatFormFields.cy.js
index 2c1c8df1..9b7074ff 100644
--- a/frontend/cypress/e2e/ui/livechatFormFields.cy.js
+++ b/frontend/cypress/e2e/ui/livechatFormFields.cy.js
@@ -96,15 +96,10 @@ describe('Live chat inbox form: every field', () => {
     cy.get('select[name="config.launcher.position"]').siblings('button[role="combobox"]').click()
     cy.get('[role="option"]').contains('Left').click()
     cy.get('[role="option"]').should('not.exist')
-    cy.get('input[name="config.launcher.size"]').clear().type('72')
     cy.get('input[name="config.launcher.icon_scale"]').clear().type('80')
     cy.get('input[name="config.launcher.spacing.side"]').clear().type('30')
     cy.get('input[name="config.launcher.spacing.bottom"]').clear().type('40')
 
-    cy.openInboxSection('Reply previews')
-    cy.switchField('Mobile').click()
-    cy.get('input[name="config.previews.auto_hide_seconds"]').clear().type('45')
-
     cy.openInboxSection('Messages')
     cy.get('textarea[name="config.greeting_message"]').clear().type(created.greeting)
     cy.get('textarea[name="config.introduction_message"]').clear().type(created.introduction)
@@ -167,14 +162,10 @@ describe('Live chat inbox form: every field', () => {
       expect(c.branding.light.launcher.color, 'launcher color').to.eq(created.lightLauncher)
 
       expect(c.launcher.position, 'position').to.eq('left')
-      expect(c.launcher.size, 'size').to.eq(72)
       expect(c.launcher.icon_scale, 'icon scale').to.eq(80)
       expect(c.launcher.spacing.side, 'side spacing').to.eq(30)
       expect(c.launcher.spacing.bottom, 'bottom spacing').to.eq(40)
 
-      expect(c.previews.mobile, 'mobile previews').to.eq(false)
-      expect(c.previews.auto_hide_seconds, 'auto hide').to.eq(45)
-
       expect(c.greeting_message, 'greeting').to.eq(created.greeting)
       expect(c.introduction_message, 'introduction').to.eq(created.introduction)
       expect(c.chat_introduction, 'chat introduction').to.eq(created.chatIntroduction)
@@ -231,15 +222,10 @@ describe('Live chat inbox form: every field', () => {
 
     cy.openInboxSection('Launcher position')
     cy.get('select[name="config.launcher.position"]').should('have.value', 'left')
-    cy.get('input[name="config.launcher.size"]').should('have.value', '72')
     cy.get('input[name="config.launcher.icon_scale"]').should('have.value', '80')
     cy.get('input[name="config.launcher.spacing.side"]').should('have.value', '30')
     cy.get('input[name="config.launcher.spacing.bottom"]').should('have.value', '40')
 
-    cy.openInboxSection('Reply previews')
-    cy.switchField('Mobile').should('have.attr', 'data-state', 'unchecked')
-    cy.get('input[name="config.previews.auto_hide_seconds"]').should('have.value', '45')
-
     cy.openInboxSection('Messages')
     cy.get('textarea[name="config.greeting_message"]').should('have.value', created.greeting)
     cy.get('textarea[name="config.introduction_message"]').should(
@@ -305,15 +291,10 @@ describe('Live chat inbox form: every field', () => {
     cy.get('select[name="config.launcher.position"]').siblings('button[role="combobox"]').click()
     cy.get('[role="option"]').contains('Right').click()
     cy.get('[role="option"]').should('not.exist')
-    cy.get('input[name="config.launcher.size"]').clear().type('50')
     cy.get('input[name="config.launcher.icon_scale"]').clear().type('60')
     cy.get('input[name="config.launcher.spacing.side"]').clear().type('10')
     cy.get('input[name="config.launcher.spacing.bottom"]').clear().type('12')
 
-    cy.openInboxSection('Reply previews')
-    cy.switchField('Desktop').click()
-    cy.get('input[name="config.previews.auto_hide_seconds"]').clear().type('15')
-
     cy.openInboxSection('Messages')
     cy.get('textarea[name="config.greeting_message"]').clear().type(edited.greeting)
     cy.get('textarea[name="config.introduction_message"]').clear().type(edited.introduction)
@@ -368,14 +349,10 @@ describe('Live chat inbox form: every field', () => {
       expect(c.branding.dark.colors.primary, 'dark primary kept').to.eq(created.darkPrimary)
 
       expect(c.launcher.position, 'position').to.eq('right')
-      expect(c.launcher.size, 'size').to.eq(50)
       expect(c.launcher.icon_scale, 'icon scale').to.eq(60)
       expect(c.launcher.spacing.side, 'side spacing').to.eq(10)
       expect(c.launcher.spacing.bottom, 'bottom spacing').to.eq(12)
 
-      expect(c.previews.desktop, 'desktop previews').to.eq(false)
-      expect(c.previews.auto_hide_seconds, 'auto hide').to.eq(15)
-
       expect(c.greeting_message, 'greeting').to.eq(edited.greeting)
       expect(c.introduction_message, 'introduction').to.eq(edited.introduction)
       expect(c.chat_introduction, 'chat introduction').to.eq(edited.chatIntroduction)
@@ -478,11 +455,6 @@ describe('Live chat inbox form: every field', () => {
     cy.get('input[name="config.continuity.max_messages_per_email"]').clear().type('7')
     cy.get('input[name="config.continuity.min_email_interval"]').clear().type('9m')
 
-    cy.openInboxSection('Reply previews')
-    cy.get('select[name="config.previews.content"]').siblings('button[role="combobox"]').click()
-    cy.get('[role="option"]').contains('Generic notification').click()
-    cy.get('[role="option"]').should('not.exist')
-
     cy.openInboxSection('Office hours')
     cy.switchField('Show office hours after team assignment').click()
 
@@ -506,7 +478,6 @@ describe('Live chat inbox form: every field', () => {
       expect(c.continuity.offline_threshold, 'offline threshold').to.eq('12m')
       expect(c.continuity.max_messages_per_email, 'max messages').to.eq(7)
       expect(c.continuity.min_email_interval, 'min interval').to.eq('9m')
-      expect(c.previews.content, 'preview content').to.eq('generic')
       expect(c.show_office_hours_after_assignment, 'office hours after assignment').to.eq(true)
       expect(c.visitors.allow_start_conversation, 'visitor start').to.eq(false)
       expect(c.visitors.prevent_reply_to_closed_conversation, 'visitor closed replies').to.eq(true)
@@ -521,10 +492,8 @@ describe('Live chat inbox form: every field', () => {
     cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
 
     const cases = [
-      ['Launcher position', 'input[name="config.launcher.size"]', '120'],
       ['Launcher position', 'input[name="config.launcher.icon_scale"]', '5'],
       ['Launcher position', 'input[name="config.launcher.spacing.side"]', '900'],
-      ['Reply previews', 'input[name="config.previews.auto_hide_seconds"]', '999'],
       ['Security', 'input[name="config.session_duration"]', 'nope'],
       ['General', 'input[name="config.website_url"]', 'not-a-url']
     ]
diff --git a/frontend/cypress/e2e/ui/livechatFormLayout.cy.js b/frontend/cypress/e2e/ui/livechatFormLayout.cy.js
index 9ef59a0f..5b5843f8 100644
--- a/frontend/cypress/e2e/ui/livechatFormLayout.cy.js
+++ b/frontend/cypress/e2e/ui/livechatFormLayout.cy.js
@@ -10,7 +10,7 @@ const TABS = ['General', 'Appearance', 'Content', 'Conversations', 'Setup']
 
 const SECTIONS = {
   General: ['General', 'Conversation continuity email inbox'],
-  Appearance: ['Theme', 'Branding', 'Launcher position', 'Reply previews'],
+  Appearance: ['Theme', 'Branding', 'Launcher position'],
   Content: ['Messages', 'Notice banner', 'Home screen apps', 'Help center', 'Proactive messages'],
   Conversations: ['Features', 'Office hours', 'Pre-chat form', 'Users'],
   Setup: ['Installation', 'Identity verification', 'JavaScript API', 'Security']
@@ -47,9 +47,6 @@ describe('Live chat inbox form layout', () => {
     cy.inboxSection('Notice banner').find('button[role="switch"]').click()
     cy.get('textarea[name="config.notice_banner.text"]').clear().type('Cypress layout notice')
 
-    cy.openInboxSection('Reply previews')
-    cy.get('input[name="config.previews.auto_hide_seconds"]').clear().type('30')
-
     cy.openInboxSection('Users')
     cy.get('textarea[name="config.visitors.quick_replies"]').clear().type('One\nTwo\nThree')
 
@@ -62,7 +59,6 @@ describe('Live chat inbox form layout', () => {
       inboxId = response.body.data.id
       const config = response.body.data.config
       expect(config.notice_banner.text, 'notice text').to.eq('Cypress layout notice')
-      expect(config.previews.auto_hide_seconds, 'auto hide').to.eq(30)
       expect(config.visitors.quick_replies, 'quick replies').to.deep.eq(['One', 'Two', 'Three'])
       expect(config.session_duration, 'session duration').to.eq('6h')
     })
diff --git a/frontend/cypress/e2e/ui/livechatThemeBranding.cy.js b/frontend/cypress/e2e/ui/livechatThemeBranding.cy.js
index 5941eb06..0a7e3ed9 100644
--- a/frontend/cypress/e2e/ui/livechatThemeBranding.cy.js
+++ b/frontend/cypress/e2e/ui/livechatThemeBranding.cy.js
@@ -97,32 +97,25 @@ describe('Live chat theme and branding', () => {
     })
   })
 
-  it('rejects a launcher size and icon scale outside their range', () => {
+  it('rejects a launcher icon scale outside its range', () => {
     cy.visit(`${listPath}/${inboxId}/edit`)
     cy.openInboxSection('Launcher position')
 
-    cy.get('input[name="config.launcher.size"]').clear().type('120')
-    cy.get('button[type="submit"]').click()
-    cy.contains('40').should('exist')
-
-    cy.get('input[name="config.launcher.size"]').clear().type('64')
     cy.get('input[name="config.launcher.icon_scale"]').clear().type('10')
     cy.get('button[type="submit"]').click()
     cy.contains('40').should('exist')
   })
 
-  it('persists the launcher size and icon scale', () => {
+  it('persists the launcher icon scale', () => {
     cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
 
     cy.visit(`${listPath}/${inboxId}/edit`)
     cy.openInboxSection('Launcher position')
-    cy.get('input[name="config.launcher.size"]').clear().type('72')
     cy.get('input[name="config.launcher.icon_scale"]').clear().type('60')
 
     cy.get('button[type="submit"]').click()
     cy.wait('@updateInbox').then(({ response }) => {
       expect(response.statusCode).to.eq(200)
-      expect(response.body.data.config.launcher.size, 'launcher size').to.eq(72)
       expect(response.body.data.config.launcher.icon_scale, 'icon scale').to.eq(60)
     })
   })
diff --git a/frontend/cypress/support/livechat.js b/frontend/cypress/support/livechat.js
index 9e4bf39e..60d8a426 100644
--- a/frontend/cypress/support/livechat.js
+++ b/frontend/cypress/support/livechat.js
@@ -16,7 +16,7 @@ const baseConfig = () => ({
   brand_name: 'Cypress',
   theme: 'light',
   branding: { light: branding('#112233'), dark: branding('#112233') },
-  launcher: { position: 'right', size: 60, spacing: { side: 20, bottom: 20 } },
+  launcher: { position: 'right', spacing: { side: 20, bottom: 20 } },
   session_duration: '4h',
   visitors: { allow_start_conversation: true },
   users: { allow_start_conversation: true }
@@ -365,7 +365,6 @@ const FORM_SECTION_TAB = {
   Theme: 'Appearance',
   Branding: 'Appearance',
   'Launcher position': 'Appearance',
-  'Reply previews': 'Appearance',
   Messages: 'Content',
   'Notice banner': 'Content',
   'Home screen apps': 'Content',
@@ -387,7 +386,6 @@ const SECTION_ID = {
   Theme: 'appearance',
   Branding: 'branding',
   'Launcher position': 'launcher',
-  'Reply previews': 'previews',
   Messages: 'messages',
   'Notice banner': 'noticeBanner',
   'Home screen apps': 'homeApps',
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 8e140fa4..cd24fda6 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -384,7 +384,6 @@
   "admin.inbox.livechat.launcher.spacing.side": "Side spacing",
   "admin.inbox.livechat.launcher.iconScale": "Icon size",
   "admin.inbox.livechat.launcher.iconScale.description": "How much of the launcher the logo fills, as a percentage. Lower it to inset a logo that has no padding of its own.",
-  "admin.inbox.livechat.launcher.size": "Launcher size",
   "admin.inbox.livechat.launcher.spacing.side.description": "Distance from the side of the screen in pixels",
   "admin.inbox.livechat.noticeBanner": "Notice banner",
   "admin.inbox.livechat.noticeBanner.enabled": "Enable notice banner",
@@ -1679,7 +1678,6 @@
   "widget.addContactCustomAttribute": "Add contact custom attribute",
   "widget.addHelpHomeApp": "Add help articles",
   "widget.articleUnavailable": "Article unavailable",
-  "widget.autoHideSeconds": "Hide previews after (seconds, 0 keeps them visible)",
   "widget.backToCampaigns": "Back to proactive messages",
   "widget.brandBot": "Brand bot",
   "widget.campaign.all": "Everyone",
@@ -1718,7 +1716,6 @@
   "widget.dismissPreviews": "Dismiss all previews",
   "widget.featuredArticles": "Featured articles",
   "widget.featuredArticlesHint": "Choose up to 10 articles. Leave empty to show popular articles.",
-  "widget.genericNotice": "Generic notification",
   "widget.helpFeedbackError": "Feedback could not be saved. Try again.",
   "widget.helpHomeAppHint": "Shows a search button and the featured articles set in the Help center tab.",
   "widget.helpHomeAppRequiresCenter": "Choose a help center in the Help center tab before adding this card.",
@@ -1727,9 +1724,7 @@
   "widget.helpPlacement": "Where help appears",
   "widget.invitationExpired": "This invitation is no longer available. Start a new chat to contact us.",
   "widget.ipBlocked": "Access denied",
-  "widget.messagePreview": "Message text",
   "widget.newCampaign": "New proactive message",
-  "widget.newReply": "You have a new reply",
   "widget.openInHelpCenter": "Open in help center",
   "widget.noArticles": "No published articles yet.",
   "widget.noResultsFor": "No results for “{query}”",
@@ -1740,9 +1735,7 @@
   "conversation.sidebarCounts.mentioned": "{count} open conversation with mentions | {count} open conversations with mentions",
   "conversation.sidebarCounts.view": "{count} conversation in this view | {count} conversations in this view",
   "conversation.sidebarCounts.unassigned": "{count} open unassigned conversation | {count} open unassigned conversations",
-  "widget.previewContent": "Preview content",
   "widget.proactiveMessages": "Proactive messages",
-  "widget.replyPreviews": "Reply previews",
   "widget.replyTeam": "Route replies to team",
   "widget.searchArticles": "Search for help",
   "widget.showHelpTab": "Show Help tab",
diff --git a/internal/inbox/channel/livechat/livechat.go b/internal/inbox/channel/livechat/livechat.go
index e85f13ab..e6b8e9de 100644
--- a/internal/inbox/channel/livechat/livechat.go
+++ b/internal/inbox/channel/livechat/livechat.go
@@ -32,7 +32,6 @@ const (
 	ThemeLight  = "light"
 	ThemeDark   = "dark"
 
-	DefaultLauncherSize      = 60
 	DefaultLauncherIconScale = 100
 )
 
@@ -81,7 +80,6 @@ type LauncherSpacing struct {
 type LauncherLayout struct {
 	Spacing   LauncherSpacing `json:"spacing"`
 	Position  string          `json:"position"`
-	Size      int             `json:"size"`
 	IconScale int             `json:"icon_scale"`
 }
 
@@ -124,13 +122,6 @@ type HelpConfig struct {
 	FeaturedIDs  []int        `json:"featured_ids"`
 }
 
-type PreviewConfig struct {
-	Desktop         bool   `json:"desktop"`
-	Mobile          bool   `json:"mobile"`
-	Content         string `json:"content"`
-	AutoHideSeconds int    `json:"auto_hide_seconds"`
-}
-
 type AudienceConfig struct {
 	AllowStartConversation           bool     `json:"allow_start_conversation"`
 	PreventMultipleConversations     bool     `json:"prevent_multiple_conversations"`
@@ -160,7 +151,6 @@ type Config struct {
 	Campaigns        []proactive.Campaign `json:"campaigns"`
 	CampaignCooldown string               `json:"campaign_cooldown"`
 	Help             HelpConfig           `json:"help"`
-	Previews         PreviewConfig        `json:"previews"`
 	BrandName        string               `json:"brand_name"`
 	WebsiteURL       string               `json:"website_url"`
 	Theme            string               `json:"theme"`
@@ -257,8 +247,7 @@ func New(store inbox.MessageStore, userStore inbox.UserStore, opts Opts) (*LiveC
 	return lc, nil
 }
 
-// UnmarshalJSON fills the branding set, theme and launcher size from the pre-branding
-// config layout when they are absent, so inboxes saved before the split keep rendering.
+// UnmarshalJSON fills missing branding and theme values from the old config layout.
 func (c *Config) UnmarshalJSON(data []byte) error {
 	type plain Config
 	var cfg plain
@@ -295,9 +284,6 @@ func (c *Config) UnmarshalJSON(data []byte) error {
 	if c.Theme == "" {
 		c.Theme = ThemeLight
 	}
-	if c.Launcher.Size == 0 {
-		c.Launcher.Size = DefaultLauncherSize
-	}
 	if c.Launcher.IconScale == 0 {
 		c.Launcher.IconScale = DefaultLauncherIconScale
 	}
diff --git a/internal/inbox/channel/livechat/livechat_test.go b/internal/inbox/channel/livechat/livechat_test.go
index ebf42013..2589945f 100644
--- a/internal/inbox/channel/livechat/livechat_test.go
+++ b/internal/inbox/channel/livechat/livechat_test.go
@@ -75,9 +75,6 @@ func TestUnmarshalFillsBrandingFromLegacyConfig(t *testing.T) {
 	if config.Theme != ThemeDark {
 		t.Fatalf("theme = %q, want %q", config.Theme, ThemeDark)
 	}
-	if config.Launcher.Size != DefaultLauncherSize {
-		t.Fatalf("launcher size = %d, want %d", config.Launcher.Size, DefaultLauncherSize)
-	}
 	if config.Launcher.Position != "right" || config.Launcher.Spacing.Side != 20 {
 		t.Fatalf("launcher layout = %+v", config.Launcher)
 	}
@@ -125,7 +122,7 @@ func TestUnmarshalKeepsExplicitBranding(t *testing.T) {
 	var config Config
 	if err := json.Unmarshal([]byte(`{
 		"theme":"system",
-		"launcher":{"position":"left","size":48,"spacing":{"side":10,"bottom":10}},
+		"launcher":{"position":"left","spacing":{"side":10,"bottom":10}},
 		"colors":{"primary":"#111111"},
 		"branding":{
 			"light":{"colors":{"primary":"#2563eb"}},
@@ -137,9 +134,6 @@ func TestUnmarshalKeepsExplicitBranding(t *testing.T) {
 	if config.Theme != ThemeSystem {
 		t.Fatalf("theme = %q, want %q", config.Theme, ThemeSystem)
 	}
-	if config.Launcher.Size != 48 {
-		t.Fatalf("launcher size = %d, want 48", config.Launcher.Size)
-	}
 	if config.Branding.Light.Colors.Primary != "#2563eb" || config.Branding.Dark.Colors.Primary != "#60a5fa" {
 		t.Fatalf("branding = %+v", config.Branding)
 	}
diff --git a/internal/inbox/channel/livechat/proactive/eligibility.go b/internal/inbox/channel/livechat/proactive/eligibility.go
index 8f225422..36464b4c 100644
--- a/internal/inbox/channel/livechat/proactive/eligibility.go
+++ b/internal/inbox/channel/livechat/proactive/eligibility.go
@@ -103,6 +103,8 @@ func matchesURL(patterns []string, raw string) bool {
 		switch {
 		case strings.HasPrefix(pattern, "/"):
 			candidate = target.RequestURI()
+		case !strings.Contains(pattern, "://") && !strings.Contains(pattern, "/"):
+			candidate = target.Hostname()
 		case !strings.Contains(pattern, "://"):
 			candidate = strings.TrimPrefix(candidate, target.Scheme+"://")
 		}
diff --git a/internal/inbox/channel/livechat/proactive/eligibility_test.go b/internal/inbox/channel/livechat/proactive/eligibility_test.go
index 53ce239b..9f686f5b 100644
--- a/internal/inbox/channel/livechat/proactive/eligibility_test.go
+++ b/internal/inbox/channel/livechat/proactive/eligibility_test.go
@@ -111,3 +111,47 @@ func TestCampaignValidateRequiresTargetDevice(t *testing.T) {
 		t.Fatalf("valid desktop campaign: %v", err)
 	}
 }
+
+func TestCooldownAppliesToRepeatingCampaign(t *testing.T) {
+	now := time.Date(2026, 9, 12, 12, 0, 0, 0, time.UTC)
+	c := Campaign{ID: "a", Enabled: true, Repeat: "interval", RepeatHours: 1}
+	ctx := Context{Now: now, SessionKey: "session"}
+	history := []Delivery{{CampaignID: "a", Displayed: true, CreatedAt: now.Add(-2 * time.Hour), SessionKey: "session"}}
+	if got := Suppression(c, ctx, history, 24*time.Hour); got != "cooldown" {
+		t.Fatalf("got %q, want cooldown", got)
+	}
+	if got := Suppression(c, ctx, history, 90*time.Minute); got != "" {
+		t.Fatalf("past both the repeat interval and the cooldown: %q", got)
+	}
+	if got := Suppression(c, ctx, history, 0); got != "" {
+		t.Fatalf("no cooldown configured: %q", got)
+	}
+	history[0].CreatedAt = now.Add(-30 * time.Minute)
+	if got := Suppression(c, ctx, history, 0); got != "repeat" {
+		t.Fatalf("inside the repeat interval: %q", got)
+	}
+}
+
+func TestMatchesURLHostOnlyPattern(t *testing.T) {
+	tests := []struct {
+		pattern string
+		url     string
+		want    bool
+	}{
+		{"shop.example.com", "https://shop.example.com/", true},
+		{"shop.example.com", "https://shop.example.com", true},
+		{"shop.example.com", "https://shop.example.com/pricing/pro", true},
+		{"shop.example.com", "https://shop.example.com:8443/pricing", true},
+		{"shop.example.com", "https://other.example.com/pricing", false},
+		{"*.example.com", "https://shop.example.com/a/b", true},
+		{"*.example.com", "https://example.org/a", false},
+		{"shop.example.com/*", "https://shop.example.com/a", true},
+		{"shop.example.com/pricing", "https://shop.example.com/pricing", true},
+		{"/pricing", "https://shop.example.com/pricing", true},
+	}
+	for _, tt := range tests {
+		if got := matchesURL([]string{tt.pattern}, tt.url); got != tt.want {
+			t.Errorf("pattern %q against %q: got %v, want %v", tt.pattern, tt.url, got, tt.want)
+		}
+	}
+}
diff --git a/internal/inbox/channel/livechat/proactive/proactive.go b/internal/inbox/channel/livechat/proactive/proactive.go
index b3d57458..d3088fcf 100644
--- a/internal/inbox/channel/livechat/proactive/proactive.go
+++ b/internal/inbox/channel/livechat/proactive/proactive.go
@@ -121,7 +121,6 @@ func Suppression(c Campaign, ctx Context, history []Delivery, cooldown time.Dura
 			if d.Replied || c.Repeat == "once" || c.Repeat == "session" && d.SessionKey == ctx.SessionKey || c.Repeat == "interval" && ctx.Now.Sub(d.CreatedAt) < time.Duration(c.RepeatHours)*time.Hour {
 				return "repeat"
 			}
-			continue
 		}
 		if cooldown > 0 && ctx.Now.Sub(d.CreatedAt) < cooldown {
 			return "cooldown"
diff --git a/static/widget.js b/static/widget.js
index f65a68c7..7f40484b 100644
--- a/static/widget.js
+++ b/static/widget.js
@@ -27,11 +27,12 @@
             this.IFRAME_HEIGHT = '700px';
             this.EXPANDED_WIDTH = '750px';
             this.MOBILE_BREAKPOINT = 600;
-            this.DEFAULT_LAUNCHER_SIZE = 60;
+            this.LAUNCHER_SIZE = 60;
             this.LAUNCHER_IFRAME_GAP = 20;
             this.DEFAULT_LAUNCHER_ICON_SCALE = 100;
             this.LAUNCHER_HOVER_SCALE = 1.08;
             this.LAUNCHER_OPEN_SCALE = 0.9;
+            this.MOBILE_LAUNCHER_SIZE = 60;
             this.CAMPAIGN_POLL_MIN = 2;
             this.CAMPAIGN_POLL_MAX = 60;
 
@@ -46,8 +47,6 @@
             this.unreadCount = 0;
             this.previewData = null;
             this.previewHost = null;
-            this.previewTimers = new Map();
-            this.hiddenPreviews = new Set();
             this.campaignData = null;
             this.campaignActiveSeconds = 0;
             this.campaignURL = location.href;
@@ -345,7 +344,7 @@
         }
 
         launcherSize () {
-            return this.widgetSettings?.launcher?.size || this.DEFAULT_LAUNCHER_SIZE;
+            return this.isMobile ? this.MOBILE_LAUNCHER_SIZE : this.LAUNCHER_SIZE;
         }
 
         launcherIconScale () {
@@ -716,23 +715,12 @@
             this.previewData = null;
             this.campaignData = null;
             this.dismissedPreviews = [];
-            this.hiddenPreviews.clear();
             this.previewHost?.remove();
             this.previewHost = null;
             this.previewSignature = '';
-            for (const timer of this.previewTimers.values()) clearTimeout(timer);
-            this.previewTimers.clear();
-        }
-
-        hidePreview (key) {
-            this.previewTimers.delete(key);
-            this.hiddenPreviews.add(key);
-            this.renderPreviews();
         }
 
         dismissPreview (key) {
-            clearTimeout(this.previewTimers.get(key));
-            this.previewTimers.delete(key);
             if (this.campaignData?.id === key) {
                 this.postToIframe({ type: 'CAMPAIGN_EVENT', event: 'dismissed', id: key });
                 this.campaignData = null;
@@ -753,13 +741,12 @@
             const invitation = this.campaignData;
             if (invitation && this.unreadCount === 0 && data) {
                 const snapshot = invitation.snapshot;
-                data = { ...data, identity: 'campaign', config: { desktop: true, mobile: true, auto_hide_seconds: 0 }, previews: [{
+                data = { ...data, identity: 'campaign', previews: [{
                     key: invitation.id, campaign: true, name: snapshot.sender, avatar: snapshot.avatar,
                     text: snapshot.message.slice(0, 240),
                 }] };
             }
-            const enabled = data?.config?.[this.isMobile ? 'mobile' : 'desktop'];
-            if (!data || !enabled || !this.widgetLoaded || this.isChatVisible || this.hideLauncher) {
+            if (!data || !this.widgetLoaded || this.isChatVisible || this.hideLauncher) {
                 this.previewHost?.remove();
                 this.previewHost = null;
                 this.previewSignature = '';
@@ -768,8 +755,8 @@
             const storageKey = `libredesk-previews-${this.config.inboxID}-${data.identity || 'visitor'}`;
             let dismissed = this.dismissedPreviews || [];
             try { dismissed = JSON.parse(localStorage.getItem(storageKey) || '[]'); } catch {}
-            const previews = data.previews.filter(item => !dismissed.includes(item.key) && !this.hiddenPreviews.has(item.key)).slice(0, 3);
-            const signature = JSON.stringify([previews, data.theme, data.labels, this.isMobile]);
+            const previews = data.previews.filter(item => !dismissed.includes(item.key)).slice(0, 3);
+            const signature = JSON.stringify([previews, data.theme, data.labels]);
             if (signature === this.previewSignature) return;
             this.previewSignature = signature;
             this.previewHost?.remove();
@@ -841,9 +828,6 @@
                 close.addEventListener('click', () => { this.dismissPreview(item.key); this.toggleButton.focus(); });
                 card.append(open, close);
                 stack.append(card);
-                if (data.config.auto_hide_seconds > 0 && !this.previewTimers.has(item.key)) {
-                    this.previewTimers.set(item.key, setTimeout(() => this.hidePreview(item.key), data.config.auto_hide_seconds * 1000));
-                }
             }
             if (previews.length > 1) {
                 const all = document.createElement('button');
@@ -876,6 +860,8 @@
                     elapsed = 0;
                     asked = false;
                     gap = firstGap();
+                    if (this.campaignData) this.dropCampaign(this.campaignData.id);
+                    this.renderPreviews();
                 }
                 if (document.hidden || this.isChatVisible || this.hideLauncher) return;
                 this.campaignActiveSeconds += delta;

From 5702bbbd7769209d7b7bcae08ccfb4982ceff062 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 12:19:57 +0530
Subject: [PATCH 139/178] Bug fixes in live chat widget form and more e2e tests

---
 cmd/custom_attributes.go                      |  90 +++
 cmd/custom_attributes_test.go                 |  60 ++
 .../admin/inbox/LivechatInboxForm.vue         |   7 +-
 frontend/apps/widget/src/store/help.js        |  14 +-
 .../cypress/e2e/ui/livechatFormBranches.cy.js | 611 ++++++++++++++++++
 .../cypress/e2e/ui/livechatFormLayout.cy.js   |  10 +-
 .../cypress/e2e/ui/livechatInboxForm.cy.js    |  72 +--
 .../e2e/ui/livechatThemeBranding.cy.js        |  47 +-
 .../cypress/e2e/ui/livechatWidgetTabs.cy.js   |   4 +-
 i18n/en-US.json                               |  16 +-
 internal/inbox/channel/livechat/livechat.go   |  81 +++
 .../inbox/channel/livechat/livechat_test.go   |  61 ++
 12 files changed, 935 insertions(+), 138 deletions(-)
 create mode 100644 cmd/custom_attributes_test.go
 create mode 100644 frontend/cypress/e2e/ui/livechatFormBranches.cy.js

diff --git a/cmd/custom_attributes.go b/cmd/custom_attributes.go
index ee36bb6d..f6d435d3 100644
--- a/cmd/custom_attributes.go
+++ b/cmd/custom_attributes.go
@@ -1,11 +1,13 @@
 package main
 
 import (
+	"encoding/json"
 	"slices"
 	"strconv"
 
 	cmodels "github.com/abhinavxd/libredesk/internal/custom_attribute/models"
 	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat"
 	"github.com/valyala/fasthttp"
 	"github.com/zerodha/fastglue"
 )
@@ -112,6 +114,9 @@ func handleDeleteCustomAttribute(r *fastglue.Request) error {
 	if err = app.customAttribute.Delete(id); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
+	if err := removeAttributeFromPreChatForms(app, id); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
 	return r.SendEnvelope(true)
 }
 
@@ -137,3 +142,88 @@ func validateCustomAttribute(app *App, attribute cmodels.CustomAttribute) error
 	}
 	return nil
 }
+
+func removeAttributeFromPreChatForms(app *App, attributeID int) error {
+	inboxes, err := app.inbox.GetAll()
+	if err != nil {
+		return err
+	}
+	for _, inb := range inboxes {
+		if inb.Channel != livechat.ChannelLiveChat {
+			continue
+		}
+		config, changed, err := stripPreChatFormAttribute(inb.Config, attributeID)
+		if err != nil {
+			app.lo.Error("error parsing live chat config", "id", inb.ID, "error", err)
+			return envelope.NewError(envelope.GeneralError, app.i18n.T("globals.messages.somethingWentWrong"), nil)
+		}
+		if !changed {
+			continue
+		}
+		if err := app.inbox.UpdateConfig(inb.ID, config); err != nil {
+			return envelope.NewError(envelope.GeneralError, app.i18n.T("globals.messages.somethingWentWrong"), nil)
+		}
+		if err := reloadInbox(app, inb.ID); err != nil {
+			app.lo.Error("error reloading inbox", "id", inb.ID, "error", err)
+		}
+	}
+	return nil
+}
+
+func stripPreChatFormAttribute(raw json.RawMessage, attributeID int) (json.RawMessage, bool, error) {
+	var config map[string]any
+	if len(raw) == 0 {
+		return raw, false, nil
+	}
+	if err := json.Unmarshal(raw, &config); err != nil {
+		return raw, false, err
+	}
+	form, ok := config["prechat_form"].(map[string]any)
+	if !ok {
+		return raw, false, nil
+	}
+	var changed bool
+	for _, holder := range []map[string]any{form, asObject(form["visitors"]), asObject(form["users"])} {
+		if holder == nil {
+			continue
+		}
+		fields, ok := holder["fields"].([]any)
+		if !ok {
+			continue
+		}
+		kept := make([]any, 0, len(fields))
+		for _, field := range fields {
+			if attributeIDOf(field) == attributeID {
+				changed = true
+				continue
+			}
+			kept = append(kept, field)
+		}
+		holder["fields"] = kept
+	}
+	if !changed {
+		return raw, false, nil
+	}
+	updated, err := json.Marshal(config)
+	if err != nil {
+		return raw, false, err
+	}
+	return updated, true, nil
+}
+
+func asObject(value any) map[string]any {
+	object, _ := value.(map[string]any)
+	return object
+}
+
+func attributeIDOf(field any) int {
+	object, ok := field.(map[string]any)
+	if !ok {
+		return 0
+	}
+	id, ok := object["custom_attribute_id"].(float64)
+	if !ok {
+		return 0
+	}
+	return int(id)
+}
diff --git a/cmd/custom_attributes_test.go b/cmd/custom_attributes_test.go
new file mode 100644
index 00000000..5a5981e9
--- /dev/null
+++ b/cmd/custom_attributes_test.go
@@ -0,0 +1,60 @@
+package main
+
+import (
+	"encoding/json"
+	"testing"
+)
+
+func TestStripPreChatFormAttribute(t *testing.T) {
+	raw := json.RawMessage(`{
+		"brand_name":"Acme",
+		"prechat_form":{
+			"fields":[{"key":"name"},{"key":"plan","custom_attribute_id":7}],
+			"visitors":{"fields":[{"key":"plan","custom_attribute_id":7},{"key":"email"}]},
+			"users":{"fields":[{"key":"email"}]}
+		}
+	}`)
+
+	updated, changed, err := stripPreChatFormAttribute(raw, 7)
+	if err != nil {
+		t.Fatal(err)
+	}
+	if !changed {
+		t.Fatal("expected config to change")
+	}
+
+	var config struct {
+		BrandName   string `json:"brand_name"`
+		PreChatForm struct {
+			Fields   []map[string]any `json:"fields"`
+			Visitors struct {
+				Fields []map[string]any `json:"fields"`
+			} `json:"visitors"`
+			Users struct {
+				Fields []map[string]any `json:"fields"`
+			} `json:"users"`
+		} `json:"prechat_form"`
+	}
+	if err := json.Unmarshal(updated, &config); err != nil {
+		t.Fatal(err)
+	}
+	if config.BrandName != "Acme" {
+		t.Fatalf("brand name = %q", config.BrandName)
+	}
+	if len(config.PreChatForm.Fields) != 1 || config.PreChatForm.Fields[0]["key"] != "name" {
+		t.Fatalf("fields = %v", config.PreChatForm.Fields)
+	}
+	if len(config.PreChatForm.Visitors.Fields) != 1 || config.PreChatForm.Visitors.Fields[0]["key"] != "email" {
+		t.Fatalf("visitor fields = %v", config.PreChatForm.Visitors.Fields)
+	}
+	if len(config.PreChatForm.Users.Fields) != 1 {
+		t.Fatalf("user fields = %v", config.PreChatForm.Users.Fields)
+	}
+
+	if _, changed, err := stripPreChatFormAttribute(raw, 8); err != nil || changed {
+		t.Fatalf("unused attribute changed = %v, err = %v", changed, err)
+	}
+	if _, changed, err := stripPreChatFormAttribute(json.RawMessage(`{}`), 7); err != nil || changed {
+		t.Fatalf("config without a pre-chat form changed = %v, err = %v", changed, err)
+	}
+}
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
index a9982a92..147c23e1 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
@@ -1735,7 +1735,7 @@ const submitLabel = computed(() => {
 })
 
 const theme = computed(() => form.values.config?.theme || 'light')
-const editingTheme = ref('light')
+const editingTheme = inject('livechatPreviewTheme', ref('light'))
 const brandingPath = computed(() => `config.branding.${editingTheme.value}`)
 const activeBranding = computed(() => form.values.config?.branding?.[editingTheme.value])
 const activeBackgroundType = computed(() => activeBranding.value?.home_screen?.background?.type)
@@ -1807,13 +1807,12 @@ const updateCampaignCooldown = (duration) =>
   form.setFieldValue('config.campaign_cooldown', duration, hasCampaignErrors.value)
 
 // home_apps in form.values only syncs on change events, so pull the live ref for the preview.
-const previewTheme = inject('livechatPreviewTheme', ref('light'))
 const previewConfig = computed(() => {
-  const branding = form.values.config?.branding?.[previewTheme.value] || {}
+  const branding = form.values.config?.branding?.[editingTheme.value] || {}
   return {
     ...form.values.config,
     ...branding,
-    dark: previewTheme.value === 'dark',
+    dark: editingTheme.value === 'dark',
     launcher: { ...form.values.config?.launcher, ...branding.launcher },
     home_apps: homeApps.value,
     help_tree: helpTree.value,
diff --git a/frontend/apps/widget/src/store/help.js b/frontend/apps/widget/src/store/help.js
index 72587c25..4b698c86 100644
--- a/frontend/apps/widget/src/store/help.js
+++ b/frontend/apps/widget/src/store/help.js
@@ -28,13 +28,13 @@ export const useHelpStore = defineStore('help', () => {
     return collect(data.value?.tree)
   })
   const available = computed(() => !!data.value && articles.value.length > 0)
-  const featured = computed(() =>
-    data.value?.featured_ids?.length
-      ? data.value.featured_ids
-          .map((id) => articles.value.find((article) => article.id === id))
-          .filter(Boolean)
-      : data.value?.popular || []
-  )
+  const featured = computed(() => {
+    const picked = (data.value?.featured_ids || [])
+      .map((id) => articles.value.find((article) => article.id === id))
+      .filter(Boolean)
+    // Featured articles outside the visitor's locale are missing from the tree.
+    return picked.length ? picked : data.value?.popular || []
+  })
   const reset = () => {
     generation++
     identity.value++
diff --git a/frontend/cypress/e2e/ui/livechatFormBranches.cy.js b/frontend/cypress/e2e/ui/livechatFormBranches.cy.js
new file mode 100644
index 00000000..49b31f75
--- /dev/null
+++ b/frontend/cypress/e2e/ui/livechatFormBranches.cy.js
@@ -0,0 +1,611 @@
+// The steps run in order and share the inbox created by the first one.
+
+const stamp = Date.now()
+const inboxName = `Cypress Branches ${stamp}`
+const brandName = `Cypress Branches Brand ${stamp}`
+const emailInboxName = `Cypress Branch Email ${stamp}`
+const attributeName = `Cypress Branch Attr ${stamp}`
+const attributeKey = `cypress_branch_attr_${stamp}`
+const campaignName = `Cypress Branch Campaign ${stamp}`
+const listPath = '/admin/inboxes'
+
+const selectOption = (trigger, option) => {
+  cy.get(trigger).click()
+  cy.get('[role="option"]').contains(option).click()
+  // The listbox keeps a focus guard over the form until it has finished closing.
+  cy.get('[role="option"]').should('not.exist')
+}
+
+const editInbox = (inboxId) => cy.visit(`${listPath}/${inboxId}/edit`)
+
+const pickFromLabelledSelect = (label, optionIndex) => {
+  cy.contains('label', label).parent().find('button').click()
+  cy.get('[role="option"]').eq(optionIndex).click()
+  cy.get('[role="option"]').should('not.exist')
+}
+
+const linkEmailInbox = (name) => {
+  cy.inboxSection('Conversation continuity email inbox').find('button[role="combobox"]').click()
+  cy.get('[role="option"]').contains(name).click()
+  cy.get('[role="option"]').should('not.exist')
+}
+
+// The accordion's open animation makes ':visible' flaky, so these scope by section instead.
+const audienceEnabledSwitch = () =>
+  cy
+    .inboxSection('Pre-chat form')
+    .contains('p', 'Show form to this audience')
+    .parent()
+    .find('button[role="switch"]')
+
+const enablePreChatForm = () =>
+  cy.switchField('Enable pre-chat form').then(($switch) => {
+    if ($switch.attr('data-state') !== 'checked') cy.wrap($switch).click()
+  })
+
+const savedConfig = (alias) => cy.wait(alias).then(({ response }) => response.body.data.config)
+
+describe('Live chat inbox form: branches the other specs skip', () => {
+  let inboxId
+  let emailInboxId
+  let attributeId
+
+  before(() => {
+    cy.login()
+    cy.api('POST', '/api/v1/custom-attributes', {
+      name: attributeName,
+      key: attributeKey,
+      description: 'Cypress branch coverage',
+      applies_to: 'contact',
+      data_type: 'text',
+      values: [],
+      regex: '',
+      regex_hint: ''
+    }).then(({ body }) => {
+      attributeId = body.data.id
+    })
+    cy.api('POST', '/api/v1/inboxes', {
+      name: emailInboxName,
+      channel: 'email',
+      enabled: true,
+      from: `Branch ${stamp} <branch.${stamp}@example.com>`,
+      config: {
+        auth_type: 'password',
+        from: `Branch ${stamp} <branch.${stamp}@example.com>`,
+        smtp: [
+          {
+            host: '127.0.0.1',
+            port: Number(Cypress.env('SMTP_PORT') || 1025),
+            username: '',
+            password: '',
+            auth_protocol: 'none',
+            tls_type: 'none',
+            max_conns: 2,
+            max_msg_retries: 1,
+            idle_timeout: '5s',
+            pool_wait_timeout: '5s'
+          }
+        ],
+        imap: []
+      }
+    }).then(({ body }) => {
+      emailInboxId = body.data.id
+    })
+  })
+
+  beforeEach(() => {
+    // radix-vue's select focuses a node that is already gone in headless runs.
+    Cypress.on('uncaught:exception', (err) => !err.message.includes("reading 'focus'"))
+    cy.viewport(1280, 900)
+    cy.login()
+  })
+
+  after(() => {
+    if (inboxId) cy.api('DELETE', `/api/v1/inboxes/${inboxId}`, null, { failOnStatusCode: false })
+    if (emailInboxId) {
+      cy.api('DELETE', `/api/v1/inboxes/${emailInboxId}`, null, { failOnStatusCode: false })
+    }
+    if (attributeId) {
+      cy.api('DELETE', `/api/v1/custom-attributes/${attributeId}`, null, {
+        failOnStatusCode: false
+      })
+    }
+  })
+
+  it('creates the inbox the other steps edit', () => {
+    cy.intercept('POST', '**/api/v1/inboxes').as('createInbox')
+
+    cy.visit(`${listPath}/new`)
+    cy.contains('Create a live chat inbox').click()
+    cy.openInboxSection('General')
+    cy.get('input[name="name"]').type(inboxName)
+    cy.get('input[name="config.brand_name"]').type(brandName)
+    cy.get('button[type="submit"]').click()
+
+    cy.wait('@createInbox').then(({ response }) => {
+      expect(response.statusCode).to.eq(200)
+      inboxId = response.body.data.id
+    })
+  })
+
+  it('rejects an image background with no url, then saves one', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+    const imageUrl = `https://cypress.test/${stamp}/background.jpg`
+
+    editInbox(inboxId)
+    cy.openInboxSection('Branding')
+    cy.get('#bg-image').click()
+    cy.get('button[type="submit"]').click()
+    cy.get('@updateInbox.all').should('have.length', 0)
+    cy.inboxSection('Branding').should('have.attr', 'data-state', 'open')
+
+    cy.get('input[name="config.branding.light.home_screen.background.image_url"]').type(imageUrl)
+    cy.get('button[type="submit"]').click()
+    savedConfig('@updateInbox').then((config) => {
+      expect(config.branding.light.home_screen.background.type).to.eq('image')
+      expect(config.branding.light.home_screen.background.image_url).to.eq(imageUrl)
+    })
+  })
+
+  it('rejects an enabled notice banner with no text', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Notice banner')
+    cy.switchField('Enable notice banner').click()
+    cy.get('textarea[name="config.notice_banner.text"]').clear()
+    cy.get('button[type="submit"]').click()
+
+    cy.get('@updateInbox.all').should('have.length', 0)
+    cy.inboxSection('Notice banner').should('have.attr', 'data-state', 'open')
+  })
+
+  it('requires continuity values once an email inbox is linked', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Conversation continuity email inbox')
+    linkEmailInbox(emailInboxName)
+    cy.get('input[name="config.continuity.offline_threshold"]').clear()
+    cy.get('button[type="submit"]').click()
+    cy.get('@updateInbox.all').should('have.length', 0)
+
+    cy.get('input[name="config.continuity.offline_threshold"]').type('20m')
+    cy.get('input[name="config.continuity.min_email_interval"]').clear()
+    cy.get('input[name="config.continuity.min_email_interval"]').type('30m')
+    cy.get('input[name="config.continuity.max_messages_per_email"]').clear()
+    cy.get('input[name="config.continuity.max_messages_per_email"]').type('5')
+    cy.get('button[type="submit"]').click()
+    savedConfig('@updateInbox').then((config) => {
+      expect(config.continuity.offline_threshold).to.eq('20m')
+      expect(config.continuity.min_email_interval).to.eq('30m')
+      expect(config.continuity.max_messages_per_email).to.eq(5)
+    })
+  })
+
+  it('rejects a continuity message count outside its range', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Conversation continuity email inbox')
+    cy.get('input[name="config.continuity.max_messages_per_email"]').clear()
+    cy.get('input[name="config.continuity.max_messages_per_email"]').type('200')
+    cy.get('button[type="submit"]').click()
+
+    cy.get('@updateInbox.all').should('have.length', 0)
+    cy.inboxSection('Conversation continuity email inbox').should(
+      'have.attr',
+      'data-state',
+      'open'
+    )
+  })
+
+  it('saves the launch-directly toggle separately for each audience', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Pre-chat form')
+    enablePreChatForm()
+
+    cy.openInboxSection('Users')
+    cy.switchFieldIn('Users', 'Launch directly into conversation').click()
+
+    cy.get('button[type="submit"]').click()
+    savedConfig('@updateInbox').then((config) => {
+      expect(config.prechat_form.enabled, 'pre-chat on').to.eq(true)
+      expect(config.visitors.direct_to_conversation, 'visitors launch direct').to.eq(true)
+      expect(config.users.direct_to_conversation, 'users launch direct').to.eq(false)
+    })
+  })
+
+  it('adds a pre-chat custom attribute field and removes it again', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Pre-chat form')
+    enablePreChatForm()
+    cy.inboxSection('Pre-chat form').contains('div.font-medium', attributeName).click()
+    cy.get('button[type="submit"]').click()
+    savedConfig('@updateInbox').then((config) => {
+      const keys = config.prechat_form.visitors.fields.map((field) => field.key)
+      expect(keys).to.include(attributeKey)
+    })
+
+    editInbox(inboxId)
+    cy.openInboxSection('Pre-chat form')
+    cy.inboxSection('Pre-chat form')
+      .contains('div.font-medium', attributeName)
+      .closest('div.border')
+      .find('button[aria-label="Remove"]')
+      .click()
+    cy.get('button[type="submit"]').click()
+    savedConfig('@updateInbox').then((config) => {
+      const keys = config.prechat_form.visitors.fields.map((field) => field.key)
+      expect(keys).to.not.include(attributeKey)
+    })
+  })
+
+  it('rejects a business-hours-limited proactive message with no schedule picked', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Proactive messages')
+    cy.contains('button', 'Add proactive message').click()
+    cy.get('#campaign-name').type(campaignName)
+    cy.get('#campaign-message').type('Need a hand?')
+    selectOption('#campaign-business_hours', 'During business hours')
+    cy.get('button[type="submit"]').click()
+
+    cy.get('@updateInbox.all').should('have.length', 0)
+    cy.get('#campaign-hours').should('be.visible')
+
+    selectOption('#campaign-business_hours', 'Any time')
+    cy.get('button[type="submit"]').click()
+    savedConfig('@updateInbox').then((config) => {
+      expect(config.campaigns).to.have.length(1)
+      expect(config.campaigns[0].business_hours).to.eq('any')
+    })
+  })
+
+  it('saves a proactive message condition and removes it again', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Proactive messages')
+    cy.contains('button', campaignName).click()
+    cy.contains('button', 'Add condition').click()
+    cy.contains('button[role="combobox"]', 'Select field').click()
+    cy.get('[role="option"]').contains(attributeName).click()
+    cy.contains('button[role="combobox"]', 'Select operator').click()
+    cy.get('[role="option"]').contains('equals').click()
+    cy.get('input[placeholder="Set value"]').type('gold')
+    cy.inboxSection('Proactive messages').find('[role="radio"][value="OR"]').click()
+    cy.get('button[type="submit"]').click()
+
+    savedConfig('@updateInbox').then((config) => {
+      const conditions = config.campaigns[0].conditions
+      expect(conditions.logical_op).to.eq('OR')
+      expect(conditions.rules).to.have.length(1)
+      expect(conditions.rules[0].field).to.eq(attributeKey)
+      expect(conditions.rules[0].value).to.eq('gold')
+    })
+
+    editInbox(inboxId)
+    cy.openInboxSection('Proactive messages')
+    cy.contains('button', campaignName).click()
+    cy.inboxSection('Proactive messages').contains('button[role="combobox"]', attributeName)
+    cy.inboxSection('Proactive messages').find('button[aria-label="Close"]').first().click()
+    cy.get('button[type="submit"]').click()
+    savedConfig('@updateInbox').then((config) => {
+      expect(config.campaigns[0].conditions.rules).to.have.length(0)
+    })
+  })
+
+  it('saves a different pre-chat form for visitors and for users', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Pre-chat form')
+    enablePreChatForm()
+
+    cy.audienceTab('Pre-chat form', 'Visitors').click()
+    audienceEnabledSwitch().should('have.attr', 'data-state', 'checked')
+    cy.inboxSection('Pre-chat form')
+      .find('input[placeholder="Tell us about yourself"]')
+      .clear()
+    cy.inboxSection('Pre-chat form')
+      .find('input[placeholder="Tell us about yourself"]')
+      .type('Visitor questions')
+
+    cy.audienceTab('Pre-chat form', 'Users').click()
+    audienceEnabledSwitch().then(($switch) => {
+      if ($switch.attr('data-state') !== 'checked') cy.wrap($switch).click()
+    })
+    cy.inboxSection('Pre-chat form')
+      .find('input[placeholder="Tell us about yourself"]')
+      .clear()
+    cy.inboxSection('Pre-chat form')
+      .find('input[placeholder="Tell us about yourself"]')
+      .type('Signed-in questions')
+
+    cy.get('button[type="submit"]').click()
+    savedConfig('@updateInbox').then((config) => {
+      expect(config.prechat_form.visitors.enabled, 'visitors on').to.eq(true)
+      expect(config.prechat_form.users.enabled, 'users on').to.eq(true)
+      expect(config.prechat_form.visitors.title).to.eq('Visitor questions')
+      expect(config.prechat_form.users.title).to.eq('Signed-in questions')
+    })
+
+    editInbox(inboxId)
+    cy.openInboxSection('Pre-chat form')
+    cy.inboxSection('Pre-chat form')
+      .find('input[placeholder="Tell us about yourself"]')
+      .should('have.value', 'Visitor questions')
+    cy.audienceTab('Pre-chat form', 'Users').click()
+    cy.inboxSection('Pre-chat form')
+      .find('input[placeholder="Tell us about yourself"]')
+      .should('have.value', 'Signed-in questions')
+  })
+
+  it('turns the pre-chat form off for visitors while it stays on for users', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Pre-chat form')
+    cy.audienceTab('Pre-chat form', 'Visitors').click()
+    audienceEnabledSwitch().click()
+    cy.get('button[type="submit"]').click()
+
+    savedConfig('@updateInbox').then((config) => {
+      expect(config.prechat_form.enabled, 'form still on').to.eq(true)
+      expect(config.prechat_form.visitors.enabled, 'visitors off').to.eq(false)
+      expect(config.prechat_form.users.enabled, 'users on').to.eq(true)
+    })
+
+    editInbox(inboxId)
+    cy.openInboxSection('Pre-chat form')
+    cy.audienceTab('Pre-chat form', 'Visitors').click()
+    audienceEnabledSwitch().should('have.attr', 'data-state', 'unchecked')
+    cy.audienceTab('Pre-chat form', 'Users').click()
+    audienceEnabledSwitch().should('have.attr', 'data-state', 'checked')
+  })
+
+  it('keeps the pre-chat fields of one audience out of the other', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Pre-chat form')
+    cy.audienceTab('Pre-chat form', 'Users').click()
+    cy.inboxSection('Pre-chat form').contains('div.font-medium', attributeName).click()
+    cy.get('button[type="submit"]').click()
+
+    savedConfig('@updateInbox').then((config) => {
+      const userKeys = config.prechat_form.users.fields.map((field) => field.key)
+      const visitorKeys = config.prechat_form.visitors.fields.map((field) => field.key)
+      expect(userKeys, 'users carry the attribute').to.include(attributeKey)
+      expect(visitorKeys, 'visitors do not').to.not.include(attributeKey)
+    })
+  })
+
+  it('saves branding for each theme and keeps the halves apart', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Theme')
+    cy.get('#theme-system').click()
+
+    cy.openInboxSection('Branding')
+    cy.editBrandingTheme('Light')
+    cy.get('#bg-solid').click()
+    cy.get('input[name="config.branding.light.colors.primary"]').invoke(
+      'val',
+      '#0f766e'
+    ).trigger('input')
+    cy.get('#text-black').click()
+
+    cy.editBrandingTheme('Dark')
+    cy.get('#bg-solid').click()
+    cy.get('input[name="config.branding.dark.colors.primary"]').invoke(
+      'val',
+      '#f59e0b'
+    ).trigger('input')
+    cy.get('#text-white').click()
+
+    cy.get('button[type="submit"]').click()
+    savedConfig('@updateInbox').then((config) => {
+      expect(config.theme).to.eq('system')
+      expect(config.branding.light.colors.primary).to.eq('#0f766e')
+      expect(config.branding.dark.colors.primary).to.eq('#f59e0b')
+      expect(config.branding.light.home_screen.header_text_color).to.eq('black')
+      expect(config.branding.dark.home_screen.header_text_color).to.eq('white')
+    })
+
+    editInbox(inboxId)
+    cy.openInboxSection('Branding')
+    cy.editBrandingTheme('Light')
+    cy.get('input[name="config.branding.light.colors.primary"]').should('have.value', '#0f766e')
+    cy.editBrandingTheme('Dark')
+    cy.get('input[name="config.branding.dark.colors.primary"]').should('have.value', '#f59e0b')
+  })
+
+  it('edits the dark half when the theme is forced to dark', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Theme')
+    cy.get('#theme-dark').click()
+
+    cy.openInboxSection('Branding')
+    cy.inboxSection('Branding')
+      .find('[role="tab"][data-state="active"]')
+      .should('contain.text', 'Dark')
+    cy.get('input[name="config.branding.dark.logo_url"]').clear()
+    cy.get('input[name="config.branding.dark.logo_url"]').type('https://cypress.test/dark.png')
+
+    cy.get('button[type="submit"]').click()
+    savedConfig('@updateInbox').then((config) => {
+      expect(config.theme).to.eq('dark')
+      expect(config.branding.dark.logo_url).to.eq('https://cypress.test/dark.png')
+      expect(config.branding.light.colors.primary, 'light half untouched').to.eq('#0f766e')
+    })
+
+    editInbox(inboxId)
+    cy.openInboxSection('Theme')
+    cy.get('#theme-light').click()
+    cy.openInboxSection('Branding')
+    cy.inboxSection('Branding')
+      .find('[role="tab"][data-state="active"]')
+      .should('contain.text', 'Light')
+    cy.get('button[type="submit"]').click()
+    savedConfig('@updateInbox').then((config) => {
+      expect(config.theme).to.eq('light')
+      expect(config.branding.dark.logo_url, 'dark half kept').to.eq('https://cypress.test/dark.png')
+    })
+  })
+
+  it('saves both gradient colours of the home screen background', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Branding')
+    cy.editBrandingTheme('Light')
+    cy.get('#bg-gradient').click()
+    cy.get('input[name="config.branding.light.home_screen.background.gradient_start"]')
+      .invoke('val', '#0f766e')
+      .trigger('input')
+    cy.get('input[name="config.branding.light.home_screen.background.gradient_end"]')
+      .invoke('val', '#99f6e4')
+      .trigger('input')
+    cy.switchFieldIn('Branding', 'Fade background').click()
+
+    cy.get('button[type="submit"]').click()
+    savedConfig('@updateInbox').then((config) => {
+      const background = config.branding.light.home_screen.background
+      expect(background.type).to.eq('gradient')
+      expect(background.gradient_start).to.eq('#0f766e')
+      expect(background.gradient_end).to.eq('#99f6e4')
+      expect(config.branding.light.home_screen.fade_background).to.eq(true)
+    })
+
+    editInbox(inboxId)
+    cy.openInboxSection('Branding')
+    cy.editBrandingTheme('Light')
+    cy.get('input[name="config.branding.light.home_screen.background.gradient_start"]').should(
+      'have.value',
+      '#0f766e'
+    )
+    cy.get('input[name="config.branding.light.home_screen.background.gradient_end"]').should(
+      'have.value',
+      '#99f6e4'
+    )
+  })
+
+  it('saves the proactive message sender, team, audience and cooldown', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Proactive messages')
+    cy.get('#campaign-cooldown').clear()
+    cy.get('#campaign-cooldown').type('8h')
+    cy.contains('button', campaignName).click()
+
+    // SelectAgentCombobox and SelectTeamCombobox drop the id they are given.
+    pickFromLabelledSelect('Sender', 1)
+    pickFromLabelledSelect('Route replies to team', 1)
+    selectOption('#campaign-audience', 'Signed-in users')
+
+    cy.get('button[type="submit"]').click()
+    savedConfig('@updateInbox').then((config) => {
+      expect(config.campaign_cooldown).to.eq('8h')
+      expect(config.campaigns[0].sender_id, 'sender picked').to.be.greaterThan(0)
+      expect(config.campaigns[0].team_id, 'team picked').to.be.greaterThan(0)
+      expect(config.campaigns[0].audience).to.eq('users')
+    })
+
+    editInbox(inboxId)
+    cy.openInboxSection('Proactive messages')
+    cy.get('#campaign-cooldown').should('have.value', '8h')
+    cy.contains('button', campaignName).click()
+    cy.get('#campaign-audience').should('contain.text', 'Signed-in users')
+  })
+
+  it('rejects a campaign cooldown that is not a duration', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Proactive messages')
+    cy.get('#campaign-cooldown').clear()
+    cy.get('#campaign-cooldown').type('soon')
+    cy.get('button[type="submit"]').click()
+
+    cy.get('@updateInbox.all').should('have.length', 0)
+    cy.inboxSection('Proactive messages').should('have.attr', 'data-state', 'open')
+  })
+
+  it('duplicates a proactive message', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Proactive messages')
+    cy.contains('button', campaignName).click()
+    cy.contains('button', 'Duplicate').click()
+    cy.get('button[type="submit"]').click()
+
+    savedConfig('@updateInbox').then((config) => {
+      expect(config.campaigns).to.have.length(2)
+      const ids = config.campaigns.map((campaign) => campaign.id)
+      expect(new Set(ids).size, 'each copy keeps its own id').to.eq(2)
+    })
+  })
+
+  it('rejects a home screen app with a malformed link', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Home screen apps')
+    cy.contains('button', 'Add external link').click()
+    cy.get('[data-section="homeApps"] input[placeholder="Link Text"]').type('Status')
+    cy.get('[data-section="homeApps"] input[placeholder="https://example.com"]').type('not-a-url')
+    cy.get('button[type="submit"]').click()
+
+    cy.get('@updateInbox.all').should('have.length', 0)
+    cy.inboxSection('Home screen apps').should('have.attr', 'data-state', 'open')
+  })
+
+  it('rejects a quick reply longer than the limit', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('Users')
+    cy.get('textarea[name="config.visitors.quick_replies"]').clear()
+    cy.get('textarea[name="config.visitors.quick_replies"]').type('x'.repeat(121), { delay: 0 })
+    cy.get('button[type="submit"]').click()
+
+    cy.get('@updateInbox.all').should('have.length', 0)
+    cy.inboxSection('Users').should('have.attr', 'data-state', 'open')
+  })
+
+  it('saves the auto language option', () => {
+    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
+
+    editInbox(inboxId)
+    cy.openInboxSection('General')
+    cy.inboxSection('General').contains('label', 'Language').parent().find('button').click()
+    cy.get('[role="option"]').contains('Auto').click()
+    cy.get('[role="option"]').should('not.exist')
+    cy.get('button[type="submit"]').click()
+
+    savedConfig('@updateInbox').then((config) => {
+      expect(config.language).to.eq('auto')
+    })
+  })
+
+  it('keeps the help articles card out until a help center is linked', () => {
+    editInbox(inboxId)
+    cy.openInboxSection('Home screen apps')
+    cy.contains('button', 'Add help articles').should('be.disabled')
+    cy.contains('Choose a help center under Help center before adding this card.').should(
+      'be.visible'
+    )
+  })
+})
diff --git a/frontend/cypress/e2e/ui/livechatFormLayout.cy.js b/frontend/cypress/e2e/ui/livechatFormLayout.cy.js
index 5b5843f8..78b6452f 100644
--- a/frontend/cypress/e2e/ui/livechatFormLayout.cy.js
+++ b/frontend/cypress/e2e/ui/livechatFormLayout.cy.js
@@ -173,16 +173,18 @@ describe('Live chat inbox form layout', () => {
     })
   })
 
-  it('renders the preview with its own theme toggle', () => {
+  it('keeps the preview and the branding tabs on the same theme', () => {
     cy.visit(`${listPath}/${inboxId}/edit`)
     cy.get('[data-preview-theme="light"]').should('be.visible')
 
     cy.openInboxSection('Branding')
     cy.editBrandingTheme('Dark')
-
-    cy.get('[data-preview-theme="light"]').should('have.attr', 'data-state', 'active')
-    cy.get('[data-preview-theme="dark"]').click()
     cy.get('[data-preview-theme="dark"]').should('have.attr', 'data-state', 'active')
+
+    cy.get('[data-preview-theme="light"]').click()
+    cy.inboxSection('Branding')
+      .find('[role="tab"][data-state="active"]')
+      .should('contain.text', 'Light')
   })
 
   it('rejects more than six quick replies', () => {
diff --git a/frontend/cypress/e2e/ui/livechatInboxForm.cy.js b/frontend/cypress/e2e/ui/livechatInboxForm.cy.js
index 48bba2e6..5968d8f3 100644
--- a/frontend/cypress/e2e/ui/livechatInboxForm.cy.js
+++ b/frontend/cypress/e2e/ui/livechatInboxForm.cy.js
@@ -2,7 +2,6 @@
 
 const stamp = Date.now()
 const inboxName = `Cypress Livechat ${stamp}`
-const renamedInbox = `Cypress Livechat ${stamp} edited`
 const brandName = `Cypress Brand ${stamp}`
 const websiteUrl = `https://cypress.test/${stamp}`
 const greeting = `Hello from Cypress ${stamp}`
@@ -12,7 +11,6 @@ const editedBrandName = `Cypress Brand ${stamp} edited`
 const homeAppTitle = `Cypress Announcement ${stamp}`
 const editedHomeAppTitle = `Cypress Announcement ${stamp} edited`
 const secret = `${stamp}`.padEnd(32, 'c').slice(0, 32)
-const maskedSecret = '••••••••••'
 const newPath = '/admin/inboxes/new'
 const listPath = '/admin/inboxes'
 
@@ -71,52 +69,6 @@ describe('Live chat inbox form', () => {
     cy.contains(inboxName).should('exist')
   })
 
-  it('loads the saved values back into every tab of the edit form', () => {
-    expect(inboxId, 'inbox from the create step').to.be.a('number')
-
-    cy.visit(`${listPath}/${inboxId}/edit`)
-    cy.openInboxSection('General')
-
-    cy.get('input[name="name"]').should('have.value', inboxName)
-    cy.get('input[name="config.brand_name"]').should('have.value', brandName)
-    cy.get('input[name="config.website_url"]').should('have.value', websiteUrl)
-
-    cy.openInboxSection('Launcher position')
-    cy.get('input[name="config.launcher.spacing.side"]').should('have.value', '35')
-    cy.get('input[name="config.launcher.spacing.bottom"]').should('have.value', '45')
-    cy.get('select[name="config.launcher.position"]').should('have.value', 'left')
-
-    cy.openInboxSection('Messages')
-    cy.get('textarea[name="config.greeting_message"]').should('have.value', greeting)
-    cy.get('textarea[name="config.chat_introduction"]').should('have.value', chatIntroduction)
-
-    cy.openInboxSection('Security')
-    cy.get('input[name="config.session_duration"]').should('have.value', '4h')
-    cy.get('textarea[name="config.trusted_domains"]').should('have.value', trustedDomain)
-    // The signing secret comes back masked, never as the real value.
-    cy.get('input[name="secret"]').should('have.value', maskedSecret)
-  })
-
-  it('persists a changed name and greeting message', () => {
-    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
-
-    cy.visit(`${listPath}/${inboxId}/edit`)
-    cy.openInboxSection('General')
-    cy.get('input[name="name"]').should('have.value', inboxName).clear().type(renamedInbox)
-
-    cy.openInboxSection('Messages')
-    cy.get('textarea[name="config.greeting_message"]').clear().type(`${greeting} v2`)
-
-    cy.get('button[type="submit"]').click()
-    cy.wait('@updateInbox').its('response.statusCode').should('eq', 200)
-
-    cy.visit(`${listPath}/${inboxId}/edit`)
-    cy.openInboxSection('General')
-    cy.get('input[name="name"]').should('have.value', renamedInbox)
-    cy.openInboxSection('Messages')
-    cy.get('textarea[name="config.greeting_message"]').should('have.value', `${greeting} v2`)
-  })
-
   it('rejects a submit with no name and no brand name', () => {
     cy.intercept('POST', '**/api/v1/inboxes').as('createInbox')
 
@@ -128,24 +80,6 @@ describe('Live chat inbox form', () => {
     cy.location('pathname').should('eq', newPath)
   })
 
-  it('rejects a malformed website url and jumps back to its tab', () => {
-    cy.intercept('POST', '**/api/v1/inboxes').as('createInbox')
-
-    openNewForm()
-    cy.get('input[name="name"]').type(inboxName)
-    cy.get('input[name="config.brand_name"]').type(brandName)
-    cy.get('input[name="config.website_url"]').type('not-a-url')
-
-    cy.openInboxSection('Security')
-    cy.get('button[type="submit"]').click()
-
-    cy.contains('Invalid URL').scrollIntoView().should('be.visible')
-    // The offending field is on another tab, so the form has to switch back to it.
-    cy.get('input[name="config.website_url"]').scrollIntoView().should('be.visible')
-    cy.get('[role="tab"][data-state="active"]').should('not.contain', 'Setup')
-    cy.get('@createInbox.all').should('have.length', 0)
-  })
-
   it('persists a brand name edit made alongside a home screen app edit', () => {
     cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
 
@@ -178,12 +112,12 @@ describe('Live chat inbox form', () => {
     cy.intercept('DELETE', `**/api/v1/inboxes/${inboxId}`).as('deleteInbox')
 
     cy.visit(listPath)
-    filterList(renamedInbox)
-    cy.contains('tr', renamedInbox).find('button[aria-haspopup="menu"]').click()
+    filterList(inboxName)
+    cy.contains('tr', inboxName).find('button[aria-haspopup="menu"]').click()
     cy.get('[role="menuitem"]').contains('Delete').click()
     cy.get('[role="alertdialog"]').contains('button', 'Delete').click()
 
     cy.wait('@deleteInbox').its('response.statusCode').should('eq', 200)
-    cy.contains(renamedInbox).should('not.exist')
+    cy.contains(inboxName).should('not.exist')
   })
 })
diff --git a/frontend/cypress/e2e/ui/livechatThemeBranding.cy.js b/frontend/cypress/e2e/ui/livechatThemeBranding.cy.js
index 0a7e3ed9..8671ef7d 100644
--- a/frontend/cypress/e2e/ui/livechatThemeBranding.cy.js
+++ b/frontend/cypress/e2e/ui/livechatThemeBranding.cy.js
@@ -3,7 +3,6 @@
 const stamp = Date.now()
 const inboxName = `Cypress Theme ${stamp}`
 const brandName = `Cypress Theme Brand ${stamp}`
-const listPath = '/admin/inboxes'
 const newPath = '/admin/inboxes/new'
 
 const lightPrimary = '#123456'
@@ -24,6 +23,10 @@ describe('Live chat theme and branding', () => {
     cy.login()
   })
 
+  after(() => {
+    if (inboxId) cy.api('DELETE', `/api/v1/inboxes/${inboxId}`, null, { failOnStatusCode: false })
+  })
+
   it('saves a separate primary color for each theme', () => {
     cy.intercept('POST', '**/api/v1/inboxes').as('createInbox')
 
@@ -56,19 +59,6 @@ describe('Live chat theme and branding', () => {
     })
   })
 
-  it('loads each theme back into its own tab', () => {
-    expect(inboxId, 'inbox from the create step').to.be.a('number')
-
-    cy.visit(`${listPath}/${inboxId}/edit`)
-    cy.openInboxSection('Branding')
-
-    cy.editBrandingTheme('Light')
-    cy.get('input[name="config.branding.light.colors.primary"]').should('have.value', lightPrimary)
-
-    cy.editBrandingTheme('Dark')
-    cy.get('input[name="config.branding.dark.colors.primary"]').should('have.value', darkPrimary)
-  })
-
   it('seeds a dark background when the theme is switched away from light', () => {
     cy.intercept('POST', '**/api/v1/inboxes').as('createSeeded')
 
@@ -97,33 +87,4 @@ describe('Live chat theme and branding', () => {
     })
   })
 
-  it('rejects a launcher icon scale outside its range', () => {
-    cy.visit(`${listPath}/${inboxId}/edit`)
-    cy.openInboxSection('Launcher position')
-
-    cy.get('input[name="config.launcher.icon_scale"]').clear().type('10')
-    cy.get('button[type="submit"]').click()
-    cy.contains('40').should('exist')
-  })
-
-  it('persists the launcher icon scale', () => {
-    cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
-
-    cy.visit(`${listPath}/${inboxId}/edit`)
-    cy.openInboxSection('Launcher position')
-    cy.get('input[name="config.launcher.icon_scale"]').clear().type('60')
-
-    cy.get('button[type="submit"]').click()
-    cy.wait('@updateInbox').then(({ response }) => {
-      expect(response.statusCode).to.eq(200)
-      expect(response.body.data.config.launcher.icon_scale, 'icon scale').to.eq(60)
-    })
-  })
-
-  after(() => {
-    if (inboxId) {
-      cy.login()
-      cy.api('DELETE', `/api/v1/inboxes/${inboxId}`, null, { failOnStatusCode: false })
-    }
-  })
 })
diff --git a/frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js b/frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js
index c2e4526c..df8aa185 100644
--- a/frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js
+++ b/frontend/cypress/e2e/ui/livechatWidgetTabs.cy.js
@@ -129,9 +129,7 @@ describe('Live chat inbox form: proactive messages and help center tabs', () =>
     cy.get('#campaign-exclude_urls').clear().type('/checkout/*')
     cy.get('#campaign-delay_seconds').type('{selectall}25')
     cy.get('#campaign-event').clear().type('pricing_viewed')
-    cy.contains(
-      'Show this message only after your website tracks this event. Leave this field blank to show it without an event.'
-    ).should('be.visible')
+    cy.contains('Show this message only after your website tracks this event.').should('be.visible')
     cy.contains('code', 'window.Libredesk.trackEvent("pricing_viewed")').should('be.visible')
     selectOption('#campaign-repeat', 'After an interval')
     cy.get('#campaign-repeat_hours').type('{selectall}12')
diff --git a/i18n/en-US.json b/i18n/en-US.json
index cd24fda6..613e43f2 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -406,7 +406,7 @@
   "admin.inbox.livechat.preview.sampleAgentReply": "Happy to help, could you share a few details?",
   "admin.inbox.livechat.preview.sampleUserMessage": "Hi! How do I get started?",
   "admin.inbox.livechat.quickReplies": "Quick replies",
-  "admin.inbox.livechat.quickReplies.description": "One reply per line, up to 6. Shown when someone starts a new conversation. Tapping one sends it as the first message.",
+  "admin.inbox.livechat.quickReplies.description": "One reply per line, up to 6. Shown when someone starts a new conversation.",
   "admin.inbox.livechat.quickReplies.limit": "Add up to 6 quick replies.",
   "admin.inbox.livechat.quickReplies.placeholder": "I have a question about billing\nHow do I reset my password?",
   "admin.inbox.livechat.secretKey": "Secret key",
@@ -1275,7 +1275,7 @@
   "helpCenter.styling.brand": "Brand",
   "helpCenter.styling.darkLogoUrl": "Logo URL (dark mode)",
   "helpCenter.styling.showThemeToggle": "Show light and dark mode toggle",
-  "helpCenter.styling.themeToggleHint": "Visitors start in light mode and can switch to dark. Turn this off to keep the help center in light mode.",
+  "helpCenter.styling.themeToggleHint": "Visitors start in light mode and can switch to dark.",
   "helpCenter.styling.customCode": "Custom code",
   "helpCenter.customJS": "Custom JS",
   "helpCenter.deleteArticleConfirmation": "This will permanently delete the article.",
@@ -1328,7 +1328,7 @@
   "helpCenter.translationsHint": "Write or link this article in other languages here. Readers who switch language land on the linked version, instead of the help center home page.",
   "helpCenter.linkExistingArticle": "Link an existing article",
   "helpCenter.linkExistingArticleHint": "Pick an article written in another language to join it with this one as a translation.",
-  "helpCenter.noLinkableArticles": "No articles in the other languages are free to link. Articles already linked as a translation are left out. Write the translation instead.",
+  "helpCenter.noLinkableArticles": "No articles in the other languages are free to link. Write the translation instead.",
   "helpCenter.articleAlreadyTranslated": "That article is already part of another set of translations. Unlink it there first.",
   "helpCenter.localeAlreadyTranslated": "This article already has a translation in that language.",
   "helpCenter.cannotLinkArticleToItself": "An article cannot be its own translation.",
@@ -1704,9 +1704,9 @@
   "widget.campaignContactAttributesEmpty": "Visibility conditions use contact custom attributes. None are available.",
   "widget.campaignCooldown": "Minimum time between proactive messages",
   "widget.campaignDeviceRequired": "Select at least one device. This proactive message cannot appear until desktop or mobile is enabled.",
-  "widget.campaignEventHint": "Show this message only after your website tracks this event. Leave this field blank to show it without an event.",
+  "widget.campaignEventHint": "Show this message only after your website tracks this event.",
   "widget.campaignLimitReached": "You have reached the limit of 50 proactive messages. Delete one to add another.",
-  "widget.campaignPriorityHint": "Messages are checked from top to bottom. The first matching message is shown.",
+  "widget.campaignPriorityHint": "Messages are checked from top to bottom. The first match is shown.",
   "widget.campaignsHint": "Show a message on matching pages before the chat is opened. A conversation is created only when someone replies to it.",
   "widget.campaignStats": "Proactive message results",
   "widget.campaignUrlLimit": "Add up to 20 page patterns.",
@@ -1717,10 +1717,10 @@
   "widget.featuredArticles": "Featured articles",
   "widget.featuredArticlesHint": "Choose up to 10 articles. Leave empty to show popular articles.",
   "widget.helpFeedbackError": "Feedback could not be saved. Try again.",
-  "widget.helpHomeAppHint": "Shows a search button and the featured articles set in the Help center tab.",
-  "widget.helpHomeAppRequiresCenter": "Choose a help center in the Help center tab before adding this card.",
+  "widget.helpHomeAppHint": "Shows a search button and the featured articles set under Help center.",
+  "widget.helpHomeAppRequiresCenter": "Choose a help center under Help center before adding this card.",
   "widget.helpLoadError": "Help could not be loaded. Try again or send us a message.",
-  "widget.helpOnHomeHint": "To show help on the Home screen, add the help articles card under Appearance, Home screen apps.",
+  "widget.helpOnHomeHint": "To show help on the Home screen, add the help articles card under Home screen apps.",
   "widget.helpPlacement": "Where help appears",
   "widget.invitationExpired": "This invitation is no longer available. Start a new chat to contact us.",
   "widget.ipBlocked": "Access denied",
diff --git a/internal/inbox/channel/livechat/livechat.go b/internal/inbox/channel/livechat/livechat.go
index e6b8e9de..0308deef 100644
--- a/internal/inbox/channel/livechat/livechat.go
+++ b/internal/inbox/channel/livechat/livechat.go
@@ -9,6 +9,7 @@ import (
 	"sync"
 	"sync/atomic"
 
+	amodels "github.com/abhinavxd/libredesk/internal/automation/models"
 	"github.com/abhinavxd/libredesk/internal/conversation/models"
 	"github.com/abhinavxd/libredesk/internal/inbox"
 	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat/proactive"
@@ -33,6 +34,13 @@ const (
 	ThemeDark   = "dark"
 
 	DefaultLauncherIconScale = 100
+	DefaultCampaignCooldown  = "24h"
+	DefaultLauncherColor     = "#000000"
+	BackgroundSolid          = "solid"
+	// Matches the locale the widget falls back to when this is unset.
+	DefaultLanguage = "en-US"
+	// Matches the session TTL the chat handlers fall back to when this is unset.
+	DefaultSessionDuration = "4320h"
 )
 
 type Colors struct {
@@ -287,9 +295,82 @@ func (c *Config) UnmarshalJSON(data []byte) error {
 	if c.Launcher.IconScale == 0 {
 		c.Launcher.IconScale = DefaultLauncherIconScale
 	}
+	if c.CampaignCooldown == "" {
+		c.CampaignCooldown = DefaultCampaignCooldown
+	}
+	if c.SessionDuration == "" {
+		c.SessionDuration = DefaultSessionDuration
+	}
+	if c.Language == "" {
+		c.Language = DefaultLanguage
+	}
+	if c.FallbackLanguage == "" {
+		c.FallbackLanguage = DefaultLanguage
+	}
+	fillBrandingDefaults(&c.Branding.Light, ThemeLight)
+	fillBrandingDefaults(&c.Branding.Dark, ThemeDark)
+	c.fillEmptyLists()
 	return nil
 }
 
+func fillBrandingDefaults(branding *Branding, theme string) {
+	if branding.Launcher.Color == "" {
+		branding.Launcher.Color = DefaultLauncherColor
+	}
+	if branding.HomeScreen.Background.Type == "" {
+		branding.HomeScreen.Background.Type = BackgroundSolid
+	}
+	if branding.HomeScreen.HeaderTextColor == "" {
+		if theme == ThemeDark {
+			branding.HomeScreen.HeaderTextColor = "white"
+		} else {
+			branding.HomeScreen.HeaderTextColor = "black"
+		}
+	}
+}
+
+// A null list fails the admin form's validation.
+func (c *Config) fillEmptyLists() {
+	if c.Campaigns == nil {
+		c.Campaigns = []proactive.Campaign{}
+	}
+	for i := range c.Campaigns {
+		if c.Campaigns[i].IncludeURLs == nil {
+			c.Campaigns[i].IncludeURLs = []string{}
+		}
+		if c.Campaigns[i].ExcludeURLs == nil {
+			c.Campaigns[i].ExcludeURLs = []string{}
+		}
+		if c.Campaigns[i].Conditions.Rules == nil {
+			c.Campaigns[i].Conditions.Rules = []amodels.RuleDetail{}
+		}
+	}
+	if c.Help.FeaturedIDs == nil {
+		c.Help.FeaturedIDs = []int{}
+	}
+	if c.HomeApps == nil {
+		c.HomeApps = []HomeApp{}
+	}
+	if c.TrustedDomains == nil {
+		c.TrustedDomains = []string{}
+	}
+	if c.BlockedIPs == nil {
+		c.BlockedIPs = []string{}
+	}
+	if c.QuickReplies == nil {
+		c.QuickReplies = []string{}
+	}
+	if c.Users.QuickReplies == nil {
+		c.Users.QuickReplies = []string{}
+	}
+	if c.Visitors.QuickReplies == nil {
+		c.Visitors.QuickReplies = []string{}
+	}
+	if c.PreChatForm.Fields == nil {
+		c.PreChatForm.Fields = []PreChatFormField{}
+	}
+}
+
 func (c Config) ResolvePreChatForm(isVisitor bool) Config {
 	audience := c.PreChatForm.Users
 	if isVisitor {
diff --git a/internal/inbox/channel/livechat/livechat_test.go b/internal/inbox/channel/livechat/livechat_test.go
index 2589945f..fd9a4147 100644
--- a/internal/inbox/channel/livechat/livechat_test.go
+++ b/internal/inbox/channel/livechat/livechat_test.go
@@ -138,3 +138,64 @@ func TestUnmarshalKeepsExplicitBranding(t *testing.T) {
 		t.Fatalf("branding = %+v", config.Branding)
 	}
 }
+
+func TestUnmarshalFillsEmptyListsAndCooldown(t *testing.T) {
+	var config Config
+	if err := json.Unmarshal([]byte(`{"brand_name":"Acme"}`), &config); err != nil {
+		t.Fatal(err)
+	}
+
+	encoded, err := json.Marshal(config)
+	if err != nil {
+		t.Fatal(err)
+	}
+	var decoded map[string]any
+	if err := json.Unmarshal(encoded, &decoded); err != nil {
+		t.Fatal(err)
+	}
+	for _, key := range []string{"campaigns", "home_apps", "trusted_domains", "blocked_ips", "quick_replies"} {
+		if decoded[key] == nil {
+			t.Fatalf("%s encoded as null", key)
+		}
+	}
+	if config.Help.FeaturedIDs == nil || config.PreChatForm.Fields == nil {
+		t.Fatalf("help featured ids = %v, prechat fields = %v", config.Help.FeaturedIDs, config.PreChatForm.Fields)
+	}
+	if config.Users.QuickReplies == nil || config.Visitors.QuickReplies == nil {
+		t.Fatalf("audience quick replies = %v, %v", config.Users.QuickReplies, config.Visitors.QuickReplies)
+	}
+	if config.CampaignCooldown != DefaultCampaignCooldown {
+		t.Fatalf("campaign cooldown = %q", config.CampaignCooldown)
+	}
+}
+
+func TestUnmarshalFillsValuesAConfigWrittenOutsideTheFormLacks(t *testing.T) {
+	var config Config
+	if err := json.Unmarshal([]byte(`{"brand_name":"Acme","colors":{"primary":"#112233"},"launcher":{"position":"right"}}`), &config); err != nil {
+		t.Fatal(err)
+	}
+
+	if config.SessionDuration != DefaultSessionDuration {
+		t.Fatalf("session duration = %q", config.SessionDuration)
+	}
+	if config.Language != DefaultLanguage || config.FallbackLanguage != DefaultLanguage {
+		t.Fatalf("language = %q, fallback = %q", config.Language, config.FallbackLanguage)
+	}
+	for theme, branding := range map[string]Branding{ThemeLight: config.Branding.Light, ThemeDark: config.Branding.Dark} {
+		if branding.Launcher.Color != DefaultLauncherColor {
+			t.Fatalf("%s launcher color = %q", theme, branding.Launcher.Color)
+		}
+		if branding.HomeScreen.Background.Type != BackgroundSolid {
+			t.Fatalf("%s background type = %q", theme, branding.HomeScreen.Background.Type)
+		}
+		if branding.Colors.Primary != "#112233" {
+			t.Fatalf("%s primary = %q", theme, branding.Colors.Primary)
+		}
+	}
+	if config.Branding.Light.HomeScreen.HeaderTextColor != "black" {
+		t.Fatalf("light header text = %q", config.Branding.Light.HomeScreen.HeaderTextColor)
+	}
+	if config.Branding.Dark.HomeScreen.HeaderTextColor != "white" {
+		t.Fatalf("dark header text = %q", config.Branding.Dark.HomeScreen.HeaderTextColor)
+	}
+}

From 0df54faac79b79400436dd112589b30b7e5b077f Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 12:28:30 +0530
Subject: [PATCH 140/178] fix color scheme listener on old safari and reject
 fractional message counts

---
 .../src/features/admin/inbox/livechatFormSchema.js   |  2 +-
 .../features/admin/inbox/livechatFormSchema.test.js  | 12 ++++++++++++
 static/widget.js                                     |  8 ++++++--
 3 files changed, 19 insertions(+), 3 deletions(-)

diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
index e30a1366..3e14e839 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
@@ -377,7 +377,7 @@ export const createFormSchema = (t) =>
         }
       }
       const max = Number(continuity.max_messages_per_email)
-      if (!Number.isFinite(max) || max < 1 || max > 100) {
+      if (!Number.isInteger(max) || max < 1 || max > 100) {
         ctx.addIssue({
           code: z.ZodIssueCode.custom,
           path: ['config', 'continuity', 'max_messages_per_email'],
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
index bb44bb37..0bd90ae0 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
@@ -623,6 +623,18 @@ describe('Livechat Inbox Form Schema', () => {
     ).toThrow()
   })
 
+  test('continuity max_messages_per_email rejects a fraction', () => {
+    expect(() =>
+      schema.parse(
+        withContinuity({
+          offline_threshold: '5m',
+          max_messages_per_email: 1.5,
+          min_email_interval: '30m'
+        })
+      )
+    ).toThrow()
+  })
+
   test('continuity max_messages_per_email out of range', () => {
     expect(() =>
       schema.parse(
diff --git a/static/widget.js b/static/widget.js
index 7f40484b..b3ac3980 100644
--- a/static/widget.js
+++ b/static/widget.js
@@ -389,9 +389,13 @@
 
         watchColorScheme () {
             if (!window.matchMedia) return;
-            window.matchMedia('(prefers-color-scheme: dark)').addEventListener('change', () => {
+            const query = window.matchMedia('(prefers-color-scheme: dark)');
+            const onChange = () => {
                 if (this.widgetSettings.theme === 'system') this.applyLauncherTheme();
-            });
+            };
+            // Safari 13.1 and older only have the deprecated addListener.
+            if (query.addEventListener) query.addEventListener('change', onChange);
+            else if (query.addListener) query.addListener(onChange);
         }
 
         iframeBottomOffset () {

From c7ca1336cc943f1a9a8d4012a3db580212a99b20 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 12:58:36 +0530
Subject: [PATCH 141/178] fix livechat api test assertions and wait for an
 opened form section

---
 frontend/cypress/e2e/api/inboxes.cy.js | 6 ++++--
 frontend/cypress/support/livechat.js   | 2 ++
 2 files changed, 6 insertions(+), 2 deletions(-)

diff --git a/frontend/cypress/e2e/api/inboxes.cy.js b/frontend/cypress/e2e/api/inboxes.cy.js
index 493d2f24..117df914 100644
--- a/frontend/cypress/e2e/api/inboxes.cy.js
+++ b/frontend/cypress/e2e/api/inboxes.cy.js
@@ -388,7 +388,9 @@ describe('API: inboxes', () => {
       expect(status).to.eq(200)
       expect(body.data.name).to.eq(chatName)
       expect(body.data.channel).to.eq('livechat')
-      expect(body.data.config.colors.primary).to.eq('#112233')
+      // A read normalizes the legacy colors field into both branding themes.
+      expect(body.data.config.branding.light.colors.primary).to.eq('#112233')
+      expect(body.data.config.branding.dark.colors.primary).to.eq('#112233')
     })
   })
 
@@ -408,7 +410,7 @@ describe('API: inboxes', () => {
     cy.api('GET', `/api/v1/inboxes/${chatInboxId}`).then(({ body }) => {
       expect(body.data.name).to.eq(`${chatName}.renamed`)
       expect(body.data.config.brand_name).to.eq('Acme Renamed')
-      expect(body.data.config.colors.primary).to.eq('#445566')
+      expect(body.data.config.branding.light.colors.primary).to.eq('#445566')
       expect(body.data.config.launcher.position).to.eq('left')
     })
   })
diff --git a/frontend/cypress/support/livechat.js b/frontend/cypress/support/livechat.js
index 60d8a426..059662c3 100644
--- a/frontend/cypress/support/livechat.js
+++ b/frontend/cypress/support/livechat.js
@@ -415,6 +415,8 @@ Cypress.Commands.add('openInboxSection', (section) => {
     if ($btn.attr('aria-expanded') !== 'true') cy.wrap($btn).click()
   })
   trigger().should('have.attr', 'aria-expanded', 'true')
+  // aria-expanded flips before the open animation ends, and the content is force mounted.
+  cy.inboxSection(section).find('[role="region"]').should('be.visible')
 })
 
 // Branding and launcher both carry this switch, only the open section's one is visible.

From 8f5606f385fc8ad0ca1c5aaf61ab48ee3eef4d43 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 12:59:19 +0530
Subject: [PATCH 142/178] ignore playwright mcp artifacts

---
 .gitignore | 2 ++
 1 file changed, 2 insertions(+)

diff --git a/.gitignore b/.gitignore
index 91b6950e..4c6b7a2e 100644
--- a/.gitignore
+++ b/.gitignore
@@ -9,3 +9,5 @@ uploads
 dist/
 .vscode/
 static/widget.min.js
+
+.playwright-mcp/

From 6c9d9e4ac735428fd49c7ddab26f16c940cfe6e1 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 13:28:53 +0530
Subject: [PATCH 143/178] scope livechat form test switches to their section

---
 .../cypress/e2e/ui/livechatFormFields.cy.js   | 34 +++++++++----------
 frontend/cypress/support/livechat.js          |  3 +-
 2 files changed, 19 insertions(+), 18 deletions(-)

diff --git a/frontend/cypress/e2e/ui/livechatFormFields.cy.js b/frontend/cypress/e2e/ui/livechatFormFields.cy.js
index 9b7074ff..577c4d6b 100644
--- a/frontend/cypress/e2e/ui/livechatFormFields.cy.js
+++ b/frontend/cypress/e2e/ui/livechatFormFields.cy.js
@@ -69,12 +69,12 @@ describe('Live chat inbox form: every field', () => {
     cy.get('input[name="name"]').type(created.name)
     cy.get('input[name="config.brand_name"]').type(created.brandName)
     cy.get('input[name="config.website_url"]').type(created.websiteUrl)
-    cy.switchField('CSAT Surveys').click()
-    cy.switchField('Prompt to tag before replying').click()
+    cy.switchFieldIn('General', 'CSAT Surveys').click()
+    cy.switchFieldIn('General', 'Prompt to tag before replying').click()
 
     cy.openInboxSection('Theme')
     cy.get('#theme-system').click()
-    cy.switchField('Show powered by').click()
+    cy.switchFieldIn('Theme', 'Show powered by').click()
 
     cy.openInboxSection('Branding')
     cy.editBrandingTheme('Light')
@@ -82,7 +82,7 @@ describe('Live chat inbox form: every field', () => {
     setColor('config.branding.light.colors.primary', created.lightPrimary)
     cy.get('#text-white').click()
     cy.get('#bg-gradient').click()
-    cy.switchField('Fade background').click()
+    cy.switchFieldIn('Branding', 'Fade background').click()
 
     cy.editBrandingTheme('Dark')
     setColor('config.branding.dark.colors.primary', created.darkPrimary)
@@ -106,14 +106,14 @@ describe('Live chat inbox form: every field', () => {
     cy.get('textarea[name="config.chat_introduction"]').clear().type(created.chatIntroduction)
 
     cy.openInboxSection('Notice banner')
-    cy.switchField('Enable notice banner').click()
+    cy.switchFieldIn('Notice banner', 'Enable notice banner').click()
     cy.get('textarea[name="config.notice_banner.text"]').clear().type(created.notice)
 
     cy.openInboxSection('Features')
-    cy.switchField('Emoji support').click()
+    cy.switchFieldIn('Features', 'Emoji support').click()
 
     cy.openInboxSection('Office hours')
-    cy.switchField('Show office hours in chat').click()
+    cy.switchFieldIn('Office hours', 'Show office hours in chat').click()
     cy.get('input[name="config.chat_reply_expectation_message"]')
       .clear()
       .type(created.replyExpectation)
@@ -198,12 +198,12 @@ describe('Live chat inbox form: every field', () => {
     cy.get('input[name="name"]').should('have.value', created.name)
     cy.get('input[name="config.brand_name"]').should('have.value', created.brandName)
     cy.get('input[name="config.website_url"]').should('have.value', created.websiteUrl)
-    cy.switchField('CSAT Surveys').should('have.attr', 'data-state', 'checked')
-    cy.switchField('Prompt to tag before replying').should('have.attr', 'data-state', 'checked')
+    cy.switchFieldIn('General', 'CSAT Surveys').should('have.attr', 'data-state', 'checked')
+    cy.switchFieldIn('General', 'Prompt to tag before replying').should('have.attr', 'data-state', 'checked')
 
     cy.openInboxSection('Theme')
     cy.get('#theme-system').should('have.attr', 'data-state', 'checked')
-    cy.switchField('Show powered by').should('have.attr', 'data-state', 'unchecked')
+    cy.switchFieldIn('Theme', 'Show powered by').should('have.attr', 'data-state', 'unchecked')
 
     cy.openInboxSection('Branding')
     cy.editBrandingTheme('Light')
@@ -273,19 +273,19 @@ describe('Live chat inbox form: every field', () => {
     cy.get('input[name="name"]').clear().type(edited.name)
     cy.get('input[name="config.brand_name"]').clear().type(edited.brandName)
     cy.get('input[name="config.website_url"]').clear().type(edited.websiteUrl)
-    cy.switchField('CSAT Surveys').click()
-    cy.switchField('Prompt to tag before replying').click()
+    cy.switchFieldIn('General', 'CSAT Surveys').click()
+    cy.switchFieldIn('General', 'Prompt to tag before replying').click()
 
     cy.openInboxSection('Theme')
     cy.get('#theme-light').click()
-    cy.switchField('Show powered by').click()
+    cy.switchFieldIn('Theme', 'Show powered by').click()
 
     cy.openInboxSection('Branding')
     cy.editBrandingTheme('Light')
     setColor('config.branding.light.colors.primary', edited.lightPrimary)
     cy.get('#text-black').click()
     cy.get('#bg-solid').click()
-    cy.switchField('Fade background').click()
+    cy.switchFieldIn('Branding', 'Fade background').click()
 
     cy.openInboxSection('Launcher position')
     cy.get('select[name="config.launcher.position"]').siblings('button[role="combobox"]').click()
@@ -304,8 +304,8 @@ describe('Live chat inbox form: every field', () => {
     cy.get('textarea[name="config.notice_banner.text"]').clear().type(edited.notice)
 
     cy.openInboxSection('Features')
-    cy.switchField('File upload').click()
-    cy.switchField('Download transcript').click()
+    cy.switchFieldIn('Features', 'File upload').click()
+    cy.switchFieldIn('Features', 'Download transcript').click()
 
     cy.openInboxSection('Office hours')
     cy.get('input[name="config.chat_reply_expectation_message"]')
@@ -456,7 +456,7 @@ describe('Live chat inbox form: every field', () => {
     cy.get('input[name="config.continuity.min_email_interval"]').clear().type('9m')
 
     cy.openInboxSection('Office hours')
-    cy.switchField('Show office hours after team assignment').click()
+    cy.switchFieldIn('Office hours', 'Show office hours after team assignment').click()
 
     cy.openInboxSection('Users')
     cy.audienceSwitch('visitors', 'Allow start conversation').click()
diff --git a/frontend/cypress/support/livechat.js b/frontend/cypress/support/livechat.js
index 059662c3..79f33e1f 100644
--- a/frontend/cypress/support/livechat.js
+++ b/frontend/cypress/support/livechat.js
@@ -433,10 +433,11 @@ Cypress.Commands.add('switchField', (title) =>
 )
 
 // Switch labels and audience tabs repeat across sections, so these scope by section.
+// Section scoping already picks one label, and ':visible' turns flaky while a section opens.
 Cypress.Commands.add('switchFieldIn', (section, title) =>
   cy
     .inboxSection(section)
-    .contains('p:visible', new RegExp(`^\\s*${title}\\s*$`))
+    .contains('p', new RegExp(`^\\s*${title}\\s*$`))
     .parent()
     .find('button[role="switch"]')
 )

From 79f4ba4d2fa5e51668d8bbdc9fd6b9a450559f6a Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 13:53:14 +0530
Subject: [PATCH 144/178] split the cypress run across four shards

---
 .github/workflows/frontend-ci.yml | 8 +++++++-
 1 file changed, 7 insertions(+), 1 deletion(-)

diff --git a/.github/workflows/frontend-ci.yml b/.github/workflows/frontend-ci.yml
index b62b5acf..f3095288 100644
--- a/.github/workflows/frontend-ci.yml
+++ b/.github/workflows/frontend-ci.yml
@@ -9,6 +9,10 @@ on:
 jobs:
   build-and-test:
     runs-on: ubuntu-latest
+    strategy:
+      fail-fast: false
+      matrix:
+        shard: [1, 2, 3, 4]
     services:
       db:
         image: postgres:17-alpine
@@ -89,4 +93,6 @@ jobs:
             sleep 1
           done
           cd frontend
-          pnpm run test:e2e:ci
\ No newline at end of file
+          specs=$(find cypress/e2e -name '*.cy.js' | sort | awk -v s=${{ matrix.shard }} -v n=4 'NR % n == s % n' | paste -sd,)
+          echo "shard ${{ matrix.shard }} runs: $specs"
+          pnpm exec cypress run --e2e --headless --spec "$specs"
\ No newline at end of file

From 8a6bb06cd36b9c978158cbeb88f89c4eba5efd9b Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 14:34:35 +0530
Subject: [PATCH 145/178] add a fifth cypress shard and cache the pnpm store
 and cypress binary

---
 .github/workflows/frontend-ci.yml | 17 +++++++++++++----
 1 file changed, 13 insertions(+), 4 deletions(-)

diff --git a/.github/workflows/frontend-ci.yml b/.github/workflows/frontend-ci.yml
index f3095288..098a82d5 100644
--- a/.github/workflows/frontend-ci.yml
+++ b/.github/workflows/frontend-ci.yml
@@ -12,7 +12,7 @@ jobs:
     strategy:
       fail-fast: false
       matrix:
-        shard: [1, 2, 3, 4]
+        shard: [1, 2, 3, 4, 5]
     services:
       db:
         image: postgres:17-alpine
@@ -45,13 +45,22 @@ jobs:
         with:
           go-version: "1.25.0"
 
+      - name: Install pnpm
+        run: npm install -g pnpm@9.15.3
+
       - name: Set up Node.js
         uses: actions/setup-node@v3
         with:
           node-version: "20"
+          cache: pnpm
+          cache-dependency-path: frontend/pnpm-lock.yaml
 
-      - name: Install pnpm
-        run: npm install -g pnpm@9.15.3
+      - name: Cache the cypress binary
+        uses: actions/cache@v4
+        with:
+          path: ~/.cache/Cypress
+          key: cypress-${{ runner.os }}-${{ hashFiles('frontend/pnpm-lock.yaml') }}
+          restore-keys: cypress-${{ runner.os }}-
 
       - name: Install cypress deps
         run: sudo apt-get update && sudo apt-get install -y libgtk2.0-0 libgtk-3-0 libgbm-dev libnotify-dev libnss3 libxss1 libasound2t64 libxtst6 xauth xvfb
@@ -93,6 +102,6 @@ jobs:
             sleep 1
           done
           cd frontend
-          specs=$(find cypress/e2e -name '*.cy.js' | sort | awk -v s=${{ matrix.shard }} -v n=4 'NR % n == s % n' | paste -sd,)
+          specs=$(find cypress/e2e -name '*.cy.js' | sort | awk -v s=${{ matrix.shard }} -v n=5 'NR % n == s % n' | paste -sd,)
           echo "shard ${{ matrix.shard }} runs: $specs"
           pnpm exec cypress run --e2e --headless --spec "$specs"
\ No newline at end of file

From 9868e20a938f550dbbbe7eb48fd4dff3796e5ef3 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 15:09:33 +0530
Subject: [PATCH 146/178] make livechat specs create the records they pick

---
 .github/workflows/frontend-ci.yml             |  2 +-
 cmd/custom_attributes.go                      | 13 +++++-
 .../cypress/e2e/ui/livechatFormBranches.cy.js | 41 ++++++++++++++++--
 .../cypress/e2e/ui/livechatFormFields.cy.js   | 42 ++++++++++++++++++-
 4 files changed, 90 insertions(+), 8 deletions(-)

diff --git a/.github/workflows/frontend-ci.yml b/.github/workflows/frontend-ci.yml
index 098a82d5..ba9f5079 100644
--- a/.github/workflows/frontend-ci.yml
+++ b/.github/workflows/frontend-ci.yml
@@ -102,6 +102,6 @@ jobs:
             sleep 1
           done
           cd frontend
-          specs=$(find cypress/e2e -name '*.cy.js' | sort | awk -v s=${{ matrix.shard }} -v n=5 'NR % n == s % n' | paste -sd,)
+          specs=$(find cypress/e2e -type f -regextype posix-extended -regex '.*\.(cy|spec)\.(js|jsx|ts|tsx)$' | sort | awk -v s=${{ matrix.shard }} -v n=5 'NR % n == s % n' | paste -sd,)
           echo "shard ${{ matrix.shard }} runs: $specs"
           pnpm exec cypress run --e2e --headless --spec "$specs"
\ No newline at end of file
diff --git a/cmd/custom_attributes.go b/cmd/custom_attributes.go
index f6d435d3..b0316be7 100644
--- a/cmd/custom_attributes.go
+++ b/cmd/custom_attributes.go
@@ -148,6 +148,9 @@ func removeAttributeFromPreChatForms(app *App, attributeID int) error {
 	if err != nil {
 		return err
 	}
+	// One bad inbox leaves the rest pointing at an attribute that is already gone,
+	// so every inbox is attempted and the failures are reported at the end.
+	var failed int
 	for _, inb := range inboxes {
 		if inb.Channel != livechat.ChannelLiveChat {
 			continue
@@ -155,18 +158,24 @@ func removeAttributeFromPreChatForms(app *App, attributeID int) error {
 		config, changed, err := stripPreChatFormAttribute(inb.Config, attributeID)
 		if err != nil {
 			app.lo.Error("error parsing live chat config", "id", inb.ID, "error", err)
-			return envelope.NewError(envelope.GeneralError, app.i18n.T("globals.messages.somethingWentWrong"), nil)
+			failed++
+			continue
 		}
 		if !changed {
 			continue
 		}
 		if err := app.inbox.UpdateConfig(inb.ID, config); err != nil {
-			return envelope.NewError(envelope.GeneralError, app.i18n.T("globals.messages.somethingWentWrong"), nil)
+			failed++
+			continue
 		}
 		if err := reloadInbox(app, inb.ID); err != nil {
 			app.lo.Error("error reloading inbox", "id", inb.ID, "error", err)
 		}
 	}
+	if failed > 0 {
+		app.lo.Error("error clearing deleted custom attribute from live chat inboxes", "inboxes", failed)
+		return envelope.NewError(envelope.GeneralError, app.i18n.T("globals.messages.somethingWentWrong"), nil)
+	}
 	return nil
 }
 
diff --git a/frontend/cypress/e2e/ui/livechatFormBranches.cy.js b/frontend/cypress/e2e/ui/livechatFormBranches.cy.js
index 49b31f75..e3ec72ad 100644
--- a/frontend/cypress/e2e/ui/livechatFormBranches.cy.js
+++ b/frontend/cypress/e2e/ui/livechatFormBranches.cy.js
@@ -7,6 +7,8 @@ const emailInboxName = `Cypress Branch Email ${stamp}`
 const attributeName = `Cypress Branch Attr ${stamp}`
 const attributeKey = `cypress_branch_attr_${stamp}`
 const campaignName = `Cypress Branch Campaign ${stamp}`
+const teamName = `Cypress Branch Team ${stamp}`
+const agentName = `CypressBranchAgent${stamp}`
 const listPath = '/admin/inboxes'
 
 const selectOption = (trigger, option) => {
@@ -18,9 +20,16 @@ const selectOption = (trigger, option) => {
 
 const editInbox = (inboxId) => cy.visit(`${listPath}/${inboxId}/edit`)
 
-const pickFromLabelledSelect = (label, optionIndex) => {
+const pickFromLabelledSelect = (label, option) => {
   cy.contains('label', label).parent().find('button').click()
-  cy.get('[role="option"]').eq(optionIndex).click()
+  cy.get('[role="option"]').contains(option).click()
+  cy.get('[role="option"]').should('not.exist')
+}
+
+// The agent list loads after the listbox opens, so the brand entry shows on its own first.
+const pickAnAgentSender = () => {
+  cy.contains('label', 'Sender').parent().find('button').click()
+  cy.get('[role="option"]').contains(agentName).click()
   cy.get('[role="option"]').should('not.exist')
 }
 
@@ -49,6 +58,8 @@ describe('Live chat inbox form: branches the other specs skip', () => {
   let inboxId
   let emailInboxId
   let attributeId
+  let teamId
+  let agentId
 
   before(() => {
     cy.login()
@@ -64,6 +75,26 @@ describe('Live chat inbox form: branches the other specs skip', () => {
     }).then(({ body }) => {
       attributeId = body.data.id
     })
+    cy.api('POST', '/api/v1/agents', {
+      first_name: agentName,
+      last_name: 'Sender',
+      email: `branch.agent.${stamp}@example.com`,
+      roles: ['Agent'],
+      new_password: `Cypress!${stamp}`,
+      enabled: true
+    }).then(({ body }) => {
+      agentId = body.data.id
+    })
+    cy.api('POST', '/api/v1/teams', {
+      name: teamName,
+      timezone: 'Asia/Kolkata',
+      business_hours_id: null,
+      emoji: '\u{1F600}',
+      conversation_assignment_type: 'Round robin',
+      max_auto_assigned_conversations: 0
+    }).then(({ body }) => {
+      teamId = body.data.id
+    })
     cy.api('POST', '/api/v1/inboxes', {
       name: emailInboxName,
       channel: 'email',
@@ -110,6 +141,8 @@ describe('Live chat inbox form: branches the other specs skip', () => {
         failOnStatusCode: false
       })
     }
+    if (teamId) cy.api('DELETE', `/api/v1/teams/${teamId}`, null, { failOnStatusCode: false })
+    if (agentId) cy.api('DELETE', `/api/v1/agents/${agentId}`, null, { failOnStatusCode: false })
   })
 
   it('creates the inbox the other steps edit', () => {
@@ -510,8 +543,8 @@ describe('Live chat inbox form: branches the other specs skip', () => {
     cy.contains('button', campaignName).click()
 
     // SelectAgentCombobox and SelectTeamCombobox drop the id they are given.
-    pickFromLabelledSelect('Sender', 1)
-    pickFromLabelledSelect('Route replies to team', 1)
+    pickAnAgentSender()
+    pickFromLabelledSelect('Route replies to team', teamName)
     selectOption('#campaign-audience', 'Signed-in users')
 
     cy.get('button[type="submit"]').click()
diff --git a/frontend/cypress/e2e/ui/livechatFormFields.cy.js b/frontend/cypress/e2e/ui/livechatFormFields.cy.js
index 577c4d6b..416187e3 100644
--- a/frontend/cypress/e2e/ui/livechatFormFields.cy.js
+++ b/frontend/cypress/e2e/ui/livechatFormFields.cy.js
@@ -53,6 +53,46 @@ const setColor = (name, value) =>
 
 describe('Live chat inbox form: every field', () => {
   let inboxId
+  let emailInboxId
+  const emailInboxName = `Cypress Fields Email ${stamp}`
+
+  before(() => {
+    cy.login()
+    // The continuity step links an email inbox, so this spec creates its own.
+    cy.api('POST', '/api/v1/inboxes', {
+      name: emailInboxName,
+      channel: 'email',
+      enabled: true,
+      from: `Fields ${stamp} <fields.${stamp}@example.com>`,
+      config: {
+        auth_type: 'password',
+        from: `Fields ${stamp} <fields.${stamp}@example.com>`,
+        smtp: [
+          {
+            host: '127.0.0.1',
+            port: Number(Cypress.env('SMTP_PORT') || 1025),
+            username: '',
+            password: '',
+            auth_protocol: 'none',
+            tls_type: 'none',
+            max_conns: 2,
+            max_msg_retries: 1,
+            idle_timeout: '5s',
+            pool_wait_timeout: '5s'
+          }
+        ],
+        imap: []
+      }
+    }).then(({ body }) => {
+      emailInboxId = body.data.id
+    })
+  })
+
+  after(() => {
+    if (emailInboxId) {
+      cy.api('DELETE', `/api/v1/inboxes/${emailInboxId}`, null, { failOnStatusCode: false })
+    }
+  })
 
   beforeEach(() => {
     Cypress.on('uncaught:exception', (err) => !err.message.includes("reading 'focus'"))
@@ -449,7 +489,7 @@ describe('Live chat inbox form: every field', () => {
 
     cy.openInboxSection('Conversation continuity email inbox')
     cy.get('select[name="linked_email_inbox_id"]').siblings('button[role="combobox"]').click()
-    cy.get('[role="option"]').not(':contains("None")').first().click()
+    cy.get('[role="option"]').contains(emailInboxName).click()
     cy.get('[role="option"]').should('not.exist')
     cy.get('input[name="config.continuity.offline_threshold"]').clear().type('12m')
     cy.get('input[name="config.continuity.max_messages_per_email"]').clear().type('7')

From 58386ceee7f42a29ecceb3714ea9d04f7b201143 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 15:25:55 +0530
Subject: [PATCH 147/178] count a failed inbox reload as a failed attribute
 cleanup

---
 cmd/custom_attributes.go | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/cmd/custom_attributes.go b/cmd/custom_attributes.go
index b0316be7..5edf4321 100644
--- a/cmd/custom_attributes.go
+++ b/cmd/custom_attributes.go
@@ -168,8 +168,11 @@ func removeAttributeFromPreChatForms(app *App, attributeID int) error {
 			failed++
 			continue
 		}
+		// A retry finds the config already clean and skips the reload, so the running
+		// inbox would keep the deleted field until the next restart.
 		if err := reloadInbox(app, inb.ID); err != nil {
 			app.lo.Error("error reloading inbox", "id", inb.ID, "error", err)
+			failed++
 		}
 	}
 	if failed > 0 {

From 954db05d310aa180a54a3bc4f4a021789ae55d4f Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 15:31:00 +0530
Subject: [PATCH 148/178] skip ci for docs and cancel superseded runs

---
 .github/workflows/frontend-ci.yml | 6 ++++++
 1 file changed, 6 insertions(+)

diff --git a/.github/workflows/frontend-ci.yml b/.github/workflows/frontend-ci.yml
index ba9f5079..6af492d0 100644
--- a/.github/workflows/frontend-ci.yml
+++ b/.github/workflows/frontend-ci.yml
@@ -3,8 +3,14 @@ name: CI
 on:
   push:
     branches: [main]
+    paths-ignore: ['**.md', 'docs/**', 'LICENSE', '.github/ISSUE_TEMPLATE/**']
   pull_request:
     branches: [main]
+    paths-ignore: ['**.md', 'docs/**', 'LICENSE', '.github/ISSUE_TEMPLATE/**']
+
+concurrency:
+  group: ci-${{ github.head_ref || github.ref }}
+  cancel-in-progress: true
 
 jobs:
   build-and-test:

From 3d450c8f65c0ed2512113fc136d1471e23493989 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 16:21:53 +0530
Subject: [PATCH 149/178] key ci concurrency on the pull request number

---
 .github/workflows/frontend-ci.yml | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/.github/workflows/frontend-ci.yml b/.github/workflows/frontend-ci.yml
index 6af492d0..4537a442 100644
--- a/.github/workflows/frontend-ci.yml
+++ b/.github/workflows/frontend-ci.yml
@@ -9,7 +9,7 @@ on:
     paths-ignore: ['**.md', 'docs/**', 'LICENSE', '.github/ISSUE_TEMPLATE/**']
 
 concurrency:
-  group: ci-${{ github.head_ref || github.ref }}
+  group: ci-${{ github.event.pull_request.number || github.ref }}
   cancel-in-progress: true
 
 jobs:

From cb6b626b5579b1394ac55d6f29f31fde0c7c94c2 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 23:43:40 +0530
Subject: [PATCH 150/178] Keep transcript download cap only for widget.

---
 cmd/conversation.go      | 4 +---
 cmd/widget_transcript.go | 2 ++
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/cmd/conversation.go b/cmd/conversation.go
index 02a76478..6a1214b5 100644
--- a/cmd/conversation.go
+++ b/cmd/conversation.go
@@ -22,8 +22,6 @@ import (
 	"github.com/zerodha/fastglue"
 )
 
-const maxTranscriptDownloadMessages = 1000
-
 type assigneeChangeReq struct {
 	AssigneeID int `json:"assignee_id"`
 }
@@ -385,7 +383,7 @@ func handleDownloadConversationTranscript(r *fastglue.Request) error {
 	}
 
 	private := false
-	messages, err := app.conversation.GetAllConversationMessages(uuid, &private, []string{cmodels.MessageIncoming, cmodels.MessageOutgoing}, maxTranscriptDownloadMessages)
+	messages, err := app.conversation.GetAllConversationMessages(uuid, &private, []string{cmodels.MessageIncoming, cmodels.MessageOutgoing}, 0)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
diff --git a/cmd/widget_transcript.go b/cmd/widget_transcript.go
index b1158d94..5c8e0bf1 100644
--- a/cmd/widget_transcript.go
+++ b/cmd/widget_transcript.go
@@ -11,6 +11,8 @@ import (
 	"github.com/zerodha/fastglue"
 )
 
+const maxTranscriptDownloadMessages = 1000
+
 func handleWidgetTranscript(r *fastglue.Request) error {
 	app := r.Context.(*App)
 	config, err := getWidgetConfig(r)

From cf7c766033789fee5c014d66d48c2abdbf458736 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Tue, 22 Sep 2026 23:59:18 +0530
Subject: [PATCH 151/178] remove legacy launcher and widget setting resp.

---
 cmd/chat.go      | 34 +-------------------
 cmd/chat_test.go | 81 ------------------------------------------------
 2 files changed, 1 insertion(+), 114 deletions(-)

diff --git a/cmd/chat.go b/cmd/chat.go
index c196b287..3fbee0e2 100644
--- a/cmd/chat.go
+++ b/cmd/chat.go
@@ -94,21 +94,11 @@ type handoffFormReq struct {
 	FormData map[string]any `json:"form_data"`
 }
 
-type widgetLauncherSettings struct {
-	livechat.LauncherLayout
-	livechat.BrandingLauncher
-}
-
 type chatSettingsResponse struct {
 	Campaigns            *struct{} `json:"campaigns,omitempty"`
 	HasCampaigns         bool      `json:"has_campaigns"`
 	CampaignDelaySeconds int       `json:"campaign_delay_seconds"`
 	livechat.Config
-	DarkMode   bool                   `json:"dark_mode"`
-	Colors     livechat.Colors        `json:"colors"`
-	HomeScreen livechat.HomeScreen    `json:"home_screen"`
-	Launcher   widgetLauncherSettings `json:"launcher"`
-	LogoURL    string                 `json:"logo_url"`
 	// Hide server-side fields from the public widget response.
 	TrustedDomains         *struct{}                     `json:"trusted_domains,omitempty"`
 	BlockedIPs             *struct{}                     `json:"blocked_ips,omitempty"`
@@ -150,15 +140,9 @@ func handleGetChatSettings(r *fastglue.Request) error {
 	if config.PreChatForm.Enabled {
 		config, customAttributes = filterPreChatForms(config, app)
 	}
-	legacyBranding := legacyWidgetBranding(config)
 
 	response := chatSettingsResponse{
 		Config:               config,
-		DarkMode:             config.Theme == livechat.ThemeDark,
-		Colors:               legacyBranding.Colors,
-		HomeScreen:           legacyBranding.HomeScreen,
-		Launcher:             buildWidgetLauncherSettings(config, legacyBranding),
-		LogoURL:              legacyBranding.LogoURL,
 		HasCampaigns:         slices.ContainsFunc(config.Campaigns, func(c proactive.Campaign) bool { return c.Enabled }),
 		CampaignDelaySeconds: earliestCampaignDelay(config.Campaigns),
 		CustomAttributes:     customAttributes,
@@ -1477,28 +1461,12 @@ func launcherBranding(b livechat.Branding) map[string]any {
 }
 
 func chatLauncherSettings(config livechat.Config) map[string]any {
-	legacyBranding := legacyWidgetBranding(config)
 	return map[string]any{
 		"theme":    config.Theme,
-		"colors":   legacyBranding.Colors,
-		"launcher": buildWidgetLauncherSettings(config, legacyBranding),
+		"launcher": config.Launcher,
 		"branding": map[string]any{
 			"light": launcherBranding(config.Branding.Light),
 			"dark":  launcherBranding(config.Branding.Dark),
 		},
 	}
 }
-
-func legacyWidgetBranding(config livechat.Config) livechat.Branding {
-	if config.Theme == livechat.ThemeDark {
-		return config.Branding.Dark
-	}
-	return config.Branding.Light
-}
-
-func buildWidgetLauncherSettings(config livechat.Config, branding livechat.Branding) widgetLauncherSettings {
-	return widgetLauncherSettings{
-		LauncherLayout:   config.Launcher,
-		BrandingLauncher: branding.Launcher,
-	}
-}
diff --git a/cmd/chat_test.go b/cmd/chat_test.go
index dbffa582..7bcb1f81 100644
--- a/cmd/chat_test.go
+++ b/cmd/chat_test.go
@@ -1,7 +1,6 @@
 package main
 
 import (
-	"encoding/json"
 	"math"
 	"testing"
 
@@ -80,83 +79,3 @@ func TestValidateHandoffFormUsesSubmittedContactDetails(t *testing.T) {
 		t.Fatalf("got name %q", name)
 	}
 }
-
-func TestChatLauncherSettingsKeepsLegacyFields(t *testing.T) {
-	config := livechat.Config{
-		Theme: livechat.ThemeDark,
-		Launcher: livechat.LauncherLayout{
-			Position:  "right",
-			IconScale: 80,
-			Spacing:   livechat.LauncherSpacing{Side: 20, Bottom: 24},
-		},
-		Branding: livechat.BrandingSet{
-			Light: livechat.Branding{Colors: livechat.Colors{Primary: "#ffffff"}},
-			Dark: livechat.Branding{
-				Colors:   livechat.Colors{Primary: "#111111"},
-				Launcher: livechat.BrandingLauncher{LogoURL: "https://example.com/logo.png", Color: "#222222"},
-			},
-		},
-	}
-
-	encoded, err := json.Marshal(chatLauncherSettings(config))
-	if err != nil {
-		t.Fatal(err)
-	}
-	var response struct {
-		Colors   livechat.Colors `json:"colors"`
-		Launcher struct {
-			Position  string `json:"position"`
-			IconScale int    `json:"icon_scale"`
-			LogoURL   string `json:"logo_url"`
-			Color     string `json:"color"`
-		} `json:"launcher"`
-		Branding map[string]json.RawMessage `json:"branding"`
-	}
-	if err := json.Unmarshal(encoded, &response); err != nil {
-		t.Fatal(err)
-	}
-	if response.Colors.Primary != "#111111" {
-		t.Fatalf("legacy primary = %q", response.Colors.Primary)
-	}
-	if response.Launcher.Position != "right" || response.Launcher.IconScale != 80 {
-		t.Fatalf("legacy launcher layout = %+v", response.Launcher)
-	}
-	if response.Launcher.LogoURL != "https://example.com/logo.png" || response.Launcher.Color != "#222222" {
-		t.Fatalf("legacy launcher branding = %+v", response.Launcher)
-	}
-	if response.Branding["light"] == nil || response.Branding["dark"] == nil {
-		t.Fatalf("branding = %+v", response.Branding)
-	}
-
-	settingsResponse, err := json.Marshal(chatSettingsResponse{
-		Config:     config,
-		DarkMode:   true,
-		Colors:     config.Branding.Dark.Colors,
-		HomeScreen: config.Branding.Dark.HomeScreen,
-		Launcher:   buildWidgetLauncherSettings(config, config.Branding.Dark),
-		LogoURL:    config.Branding.Dark.LogoURL,
-	})
-	if err != nil {
-		t.Fatal(err)
-	}
-	var fullSettings struct {
-		DarkMode   bool                   `json:"dark_mode"`
-		Colors     livechat.Colors        `json:"colors"`
-		HomeScreen livechat.HomeScreen    `json:"home_screen"`
-		Launcher   widgetLauncherSettings `json:"launcher"`
-		LogoURL    string                 `json:"logo_url"`
-		Branding   livechat.BrandingSet   `json:"branding"`
-	}
-	if err := json.Unmarshal(settingsResponse, &fullSettings); err != nil {
-		t.Fatal(err)
-	}
-	if !fullSettings.DarkMode || fullSettings.Colors.Primary != "#111111" {
-		t.Fatalf("legacy theme = %+v", fullSettings)
-	}
-	if fullSettings.Launcher.LogoURL != "https://example.com/logo.png" {
-		t.Fatalf("legacy launcher = %+v", fullSettings.Launcher)
-	}
-	if fullSettings.Branding.Dark.Colors.Primary != "#111111" {
-		t.Fatalf("new branding = %+v", fullSettings.Branding)
-	}
-}

From e30843a5ef95845f9f27784a8972a49a53baaa5e Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 00:16:41 +0530
Subject: [PATCH 152/178] remove unused top-level quick replies from live chat
 config

---
 cmd/inboxes.go                                |  2 +-
 .../admin/inbox/LivechatInboxForm.vue         |  9 -----
 .../admin/inbox/LivechatWidgetPreview.vue     |  2 +-
 .../admin/inbox/livechatFormSchema.js         |  6 +---
 .../admin/inbox/livechatFormSchema.test.js    | 35 +++++--------------
 .../widget/src/components/MessageInput.vue    |  2 +-
 internal/inbox/channel/livechat/livechat.go   |  4 ---
 .../inbox/channel/livechat/livechat_test.go   |  2 +-
 8 files changed, 14 insertions(+), 48 deletions(-)

diff --git a/cmd/inboxes.go b/cmd/inboxes.go
index 442b4b3a..91b4f972 100644
--- a/cmd/inboxes.go
+++ b/cmd/inboxes.go
@@ -278,7 +278,7 @@ func validateInbox(app *App, inbox imodels.Inbox) error {
 			}
 		}
 
-		for _, replies := range [][]string{config.QuickReplies, config.Visitors.QuickReplies, config.Users.QuickReplies} {
+		for _, replies := range [][]string{config.Visitors.QuickReplies, config.Users.QuickReplies} {
 			if err := validateQuickReplies(app, replies); err != nil {
 				return err
 			}
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
index 147c23e1..91b1b192 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
@@ -1473,7 +1473,6 @@ const FIELD_SECTION = [
   ['config.greeting_message', 'messages'],
   ['config.introduction_message', 'messages'],
   ['config.chat_introduction', 'messages'],
-  ['config.quick_replies', 'messages'],
   ['config.chat_reply_expectation_message', 'officeHours'],
   ['config.features', 'features'],
   ['config.prechat_form', 'prechat'],
@@ -1668,7 +1667,6 @@ const form = useForm({
       greeting_message: 'Hello {{.FirstName | there}}',
       introduction_message: 'How can we help?',
       chat_introduction: 'Ask us anything, or share your feedback.',
-      quick_replies: '',
       show_office_hours_in_chat: false,
       show_office_hours_after_assignment: false,
       chat_reply_expectation_message: 'We typically reply in 5 minutes.',
@@ -1931,7 +1929,6 @@ const onSubmit = form.handleSubmit(
   async (values) => {
     showCampaignErrors.value = false
     values.config.trusted_domains = textareaToLines(values.config.trusted_domains)
-    values.config.quick_replies = textareaToLines(values.config.quick_replies)
     values.config.visitors.quick_replies = textareaToLines(values.config.visitors.quick_replies)
     values.config.users.quick_replies = textareaToLines(values.config.users.quick_replies)
     values.config.blocked_ips = textareaToLines(values.config.blocked_ips)
@@ -1964,8 +1961,6 @@ const onSubmit = form.handleSubmit(
         audienceConfig.enabled = false
       }
     }
-    pc.title = pc.visitors.title
-    pc.fields = pc.visitors.fields
     values.config.prechat_form = pc
 
     await props.submitForm(values)
@@ -1998,10 +1993,6 @@ watch(
       newValues.config.trusted_domains = newValues.config.trusted_domains.join('\n')
     }
 
-    if (Array.isArray(newValues.config?.quick_replies)) {
-      newValues.config.quick_replies = newValues.config.quick_replies.join('\n')
-    }
-
     const audienceConfigs = Object.fromEntries(
       ['visitors', 'users'].map((audience) => [
         audience,
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
index 0749a887..47a6c8c7 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatWidgetPreview.vue
@@ -704,7 +704,7 @@ watch(
 )
 const campaignText = computed(() => campaign.value?.message?.slice(0, SNIPPET_LENGTH) || '')
 const quickReplies = computed(() => {
-  const replies = userTypeConfig.value.quick_replies ?? props.config.quick_replies
+  const replies = userTypeConfig.value.quick_replies
   if (Array.isArray(replies)) return replies
   return typeof replies === 'string'
     ? replies
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
index 3e14e839..6203ee83 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.js
@@ -161,12 +161,9 @@ export const defaultCampaign = () => ({
 export const normalizeAudienceConfig = (config, audience) => {
   const audienceConfig = { ...config?.[audience] }
   const replies = audienceConfig.quick_replies
-  const legacyReplies = Array.isArray(config?.quick_replies)
-    ? config.quick_replies.join('\n')
-    : (config?.quick_replies ?? '')
   return {
     ...audienceConfig,
-    quick_replies: Array.isArray(replies) ? replies.join('\n') : (replies ?? legacyReplies),
+    quick_replies: Array.isArray(replies) ? replies.join('\n') : (replies ?? ''),
     direct_to_conversation:
       audienceConfig.direct_to_conversation ?? config?.direct_to_conversation ?? false
   }
@@ -279,7 +276,6 @@ export const createFormSchema = (t) =>
       greeting_message: z.string().optional(),
       introduction_message: z.string().optional(),
       chat_introduction: z.string(),
-      quick_replies: quickReplies(t).optional(),
       show_office_hours_in_chat: z.boolean(),
       show_office_hours_after_assignment: z.boolean(),
       chat_reply_expectation_message: z.string().optional(),
diff --git a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
index 0bd90ae0..97ce6af1 100644
--- a/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
+++ b/frontend/apps/main/src/features/admin/inbox/livechatFormSchema.test.js
@@ -65,6 +65,8 @@ const validForm = {
 }
 
 const withConfig = (overrides) => ({ ...validForm, config: { ...validConfig, ...overrides } })
+const withVisitorReplies = (quickReplies) =>
+  withConfig({ visitors: { ...validConfig.visitors, quick_replies: quickReplies } })
 const withContinuity = (continuity) => ({
   ...withConfig({ continuity }),
   linked_email_inbox_id: 3
@@ -153,7 +155,6 @@ describe('Livechat Inbox Form Schema', () => {
           greeting_message: 'Hi there',
           introduction_message: 'We reply fast',
           chat_reply_expectation_message: 'Usually within an hour',
-          quick_replies: 'Billing question\nReset my password',
           notice_banner: { enabled: true, text: 'We are on holiday' },
           continuity: {
             offline_threshold: '5m',
@@ -190,8 +191,8 @@ describe('Livechat Inbox Form Schema', () => {
   })
 
   test('quick replies accept empty and repeated values', () => {
-    expect(() => schema.parse(withConfig({ quick_replies: '' }))).not.toThrow()
-    expect(() => schema.parse(withConfig({ quick_replies: 'Billing\nBilling' }))).not.toThrow()
+    expect(() => schema.parse(withVisitorReplies(''))).not.toThrow()
+    expect(() => schema.parse(withVisitorReplies('Billing\nBilling'))).not.toThrow()
   })
 
   test('campaigns trim and discard blank URL rows', () => {
@@ -289,12 +290,12 @@ describe('Livechat Inbox Form Schema', () => {
   )
 
   test('quick replies reject more than six non-empty lines', () => {
-    expect(() => schema.parse(withConfig({ quick_replies: '1\n2\n3\n4\n5\n6\n7' }))).toThrow()
-    expect(() => schema.parse(withConfig({ quick_replies: '1\n2\n\n3\n4\n5\n6' }))).not.toThrow()
+    expect(() => schema.parse(withVisitorReplies('1\n2\n3\n4\n5\n6\n7'))).toThrow()
+    expect(() => schema.parse(withVisitorReplies('1\n2\n\n3\n4\n5\n6'))).not.toThrow()
   })
 
   test('quick replies reject entries over 120 characters', () => {
-    expect(() => schema.parse(withConfig({ quick_replies: 'x'.repeat(121) }))).toThrow()
+    expect(() => schema.parse(withVisitorReplies('x'.repeat(121)))).toThrow()
   })
 
   test('audience quick replies are validated independently', () => {
@@ -308,34 +309,16 @@ describe('Livechat Inbox Form Schema', () => {
     ).toThrow()
   })
 
-  test('legacy audience settings are copied without changing behavior', () => {
-    const config = {
-      ...validConfig,
-      quick_replies: ['Billing', 'Support'],
-      direct_to_conversation: true
-    }
+  test('legacy direct to conversation is copied to both audiences', () => {
+    const config = { ...validConfig, direct_to_conversation: true }
     expect(normalizeAudienceConfig(config, 'visitors')).toMatchObject({
-      quick_replies: 'Billing\nSupport',
       direct_to_conversation: true
     })
     expect(normalizeAudienceConfig(config, 'users')).toMatchObject({
-      quick_replies: 'Billing\nSupport',
       direct_to_conversation: true
     })
   })
 
-  test('explicit empty audience quick replies do not fall back to legacy replies', () => {
-    const config = {
-      ...validConfig,
-      quick_replies: ['Legacy'],
-      visitors: { ...validConfig.visitors, quick_replies: [], direct_to_conversation: false }
-    }
-    expect(normalizeAudienceConfig(config, 'visitors')).toMatchObject({
-      quick_replies: '',
-      direct_to_conversation: false
-    })
-  })
-
   test('legacy prechat form is copied to both audiences', () => {
     const fields = [{ key: 'plan', label: 'Plan' }]
     const config = normalizePrechatConfig({
diff --git a/frontend/apps/widget/src/components/MessageInput.vue b/frontend/apps/widget/src/components/MessageInput.vue
index 6cd5e05b..a4408a47 100644
--- a/frontend/apps/widget/src/components/MessageInput.vue
+++ b/frontend/apps/widget/src/components/MessageInput.vue
@@ -95,7 +95,7 @@ const config = computed(() => widgetStore.config)
 const quickReplies = computed(() => {
   if (chatStore.currentConversation?.uuid) return []
   const audience = userStore.isVisitor ? config.value.visitors : config.value.users
-  return audience?.quick_replies ?? config.value.quick_replies ?? []
+  return audience?.quick_replies ?? []
 })
 
 const getTextareaEl = () =>
diff --git a/internal/inbox/channel/livechat/livechat.go b/internal/inbox/channel/livechat/livechat.go
index 0308deef..a00891b3 100644
--- a/internal/inbox/channel/livechat/livechat.go
+++ b/internal/inbox/channel/livechat/livechat.go
@@ -184,7 +184,6 @@ type Config struct {
 	DirectToConversation           bool              `json:"direct_to_conversation"`
 	GreetingMessage                string            `json:"greeting_message"`
 	ChatIntroduction               string            `json:"chat_introduction"`
-	QuickReplies                   []string          `json:"quick_replies"`
 	IntroductionMessage            string            `json:"introduction_message"`
 	Continuity                     ContinuityConfig  `json:"continuity"`
 	ShowOfficeHoursInChat          bool              `json:"show_office_hours_in_chat"`
@@ -357,9 +356,6 @@ func (c *Config) fillEmptyLists() {
 	if c.BlockedIPs == nil {
 		c.BlockedIPs = []string{}
 	}
-	if c.QuickReplies == nil {
-		c.QuickReplies = []string{}
-	}
 	if c.Users.QuickReplies == nil {
 		c.Users.QuickReplies = []string{}
 	}
diff --git a/internal/inbox/channel/livechat/livechat_test.go b/internal/inbox/channel/livechat/livechat_test.go
index fd9a4147..93125db3 100644
--- a/internal/inbox/channel/livechat/livechat_test.go
+++ b/internal/inbox/channel/livechat/livechat_test.go
@@ -153,7 +153,7 @@ func TestUnmarshalFillsEmptyListsAndCooldown(t *testing.T) {
 	if err := json.Unmarshal(encoded, &decoded); err != nil {
 		t.Fatal(err)
 	}
-	for _, key := range []string{"campaigns", "home_apps", "trusted_domains", "blocked_ips", "quick_replies"} {
+	for _, key := range []string{"campaigns", "home_apps", "trusted_domains", "blocked_ips"} {
 		if decoded[key] == nil {
 			t.Fatalf("%s encoded as null", key)
 		}

From a431211a0da0d7d5b462e79d2b513c9847fdac16 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 00:30:54 +0530
Subject: [PATCH 153/178] stop the handoff form from sending itself empty and
 reload stale settings

---
 .../widget/src/components/PreChatForm.vue     | 22 +++++++++++++++++--
 1 file changed, 20 insertions(+), 2 deletions(-)

diff --git a/frontend/apps/widget/src/components/PreChatForm.vue b/frontend/apps/widget/src/components/PreChatForm.vue
index 2d69e925..7ba48c56 100644
--- a/frontend/apps/widget/src/components/PreChatForm.vue
+++ b/frontend/apps/widget/src/components/PreChatForm.vue
@@ -286,6 +286,7 @@ import { useUserStore } from '@widget/store/user.js'
 import { resolvePreChatForm } from '@widget/utils/preChatForm.js'
 import { useI18n } from 'vue-i18n'
 import { createPreChatFormSchema } from './preChatFormSchema.js'
+import api from '@widget/api/index.js'
 
 const props = defineProps({
   excludeDefaultFields: {
@@ -431,13 +432,30 @@ watch(
   }
 )
 
+// The server asked for this form with its current settings, so an empty form here means the widget's settings are stale.
+let settingsRefreshed = false
+const refreshSettings = async () => {
+  if (settingsRefreshed) return
+  settingsRefreshed = true
+  try {
+    const inboxID = new URLSearchParams(window.location.search).get('inbox_id')
+    const resp = await api.getWidgetSettings(inboxID)
+    widgetStore.updateConfig(resp.data.data)
+  } catch (error) {
+    console.error('Error refreshing widget settings:', error)
+  }
+}
+
 // Auto-submit when no fields to show (e.g., all fields excluded)
 watch(
   showForm,
   (newValue) => {
-    if (!newValue) {
-      emit('submit', { formData: {}, message: '' })
+    if (newValue) return
+    if (props.handoffMode) {
+      refreshSettings()
+      return
     }
+    emit('submit', { formData: {}, message: '' })
   },
   { immediate: true }
 )

From 77df872b2045c929f2efd09eed5ef21360703e8e Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 00:44:19 +0530
Subject: [PATCH 154/178] clear the handoff form flag once the form is
 submitted

---
 internal/aiagent/worker.go                 |  8 +++
 internal/conversation/conversation.go      |  1 +
 internal/conversation/handoff_form_test.go | 58 ++++++++++++++++++++++
 internal/conversation/message.go           | 11 ++++
 internal/conversation/queries.sql          |  5 ++
 5 files changed, 83 insertions(+)
 create mode 100644 internal/conversation/handoff_form_test.go

diff --git a/internal/aiagent/worker.go b/internal/aiagent/worker.go
index d03fa5c0..82034d9e 100644
--- a/internal/aiagent/worker.go
+++ b/internal/aiagent/worker.go
@@ -458,6 +458,14 @@ func (m *Manager) CompleteHandoff(conv cmodels.Conversation) error {
 	if len(messages) == 0 || !messageMetaBool(messages[0].Meta, "handoff_form_pending") {
 		return fmt.Errorf("conversation has no pending handoff form")
 	}
+	// A refresh re-shows the form from the saved flag, and two submits racing must hand off only once.
+	cleared, err := m.convo.ClearHandoffFormPending(messages[0].UUID)
+	if err != nil {
+		return err
+	}
+	if !cleared {
+		return fmt.Errorf("conversation has no pending handoff form")
+	}
 	m.handoff(conv, assistant, "")
 	return nil
 }
diff --git a/internal/conversation/conversation.go b/internal/conversation/conversation.go
index 1026fb4e..5a527509 100644
--- a/internal/conversation/conversation.go
+++ b/internal/conversation/conversation.go
@@ -370,6 +370,7 @@ type queries struct {
 	GetConversationByMessageID         *sqlx.Stmt `query:"get-conversation-by-message-id"`
 	InsertMessage                      *sqlx.Stmt `query:"insert-message"`
 	UpdateMessageStatus                *sqlx.Stmt `query:"update-message-status"`
+	ClearMessageHandoffFormPending     *sqlx.Stmt `query:"clear-message-handoff-form-pending"`
 	UpdateMessageSourceID              *sqlx.Stmt `query:"update-message-source-id"`
 	DeleteMessage                      *sqlx.Stmt `query:"delete-message"`
 	DeletePrivateMessage               *sqlx.Stmt `query:"delete-private-message"`
diff --git a/internal/conversation/handoff_form_test.go b/internal/conversation/handoff_form_test.go
new file mode 100644
index 00000000..7127cb22
--- /dev/null
+++ b/internal/conversation/handoff_form_test.go
@@ -0,0 +1,58 @@
+package conversation
+
+import (
+	"testing"
+
+	"github.com/abhinavxd/libredesk/internal/dbutil"
+	"github.com/abhinavxd/libredesk/internal/testutil"
+	"github.com/zerodha/logf"
+)
+
+func TestClearHandoffFormPending(t *testing.T) {
+	db := testutil.NewDB(t, "handoff_form_pending")
+	var contactID, inboxID, conversationID int
+	if err := db.Get(&contactID, `INSERT INTO users (type, email, first_name, last_name) VALUES ('contact', 'customer@example.com', 'Customer', '') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	if err := db.Get(&inboxID, `INSERT INTO inboxes (name, channel) VALUES ('Chat', 'livechat') RETURNING id`); err != nil {
+		t.Fatal(err)
+	}
+	if err := db.Get(&conversationID, `INSERT INTO conversations (contact_id, inbox_id, status_id) VALUES ($1, $2, (SELECT id FROM conversation_statuses LIMIT 1)) RETURNING id`, contactID, inboxID); err != nil {
+		t.Fatal(err)
+	}
+	insertMessage := func(meta string) string {
+		var uuid string
+		if err := db.Get(&uuid, `INSERT INTO conversation_messages (type, status, conversation_id, sender_id, sender_type, content, meta) VALUES ('outgoing', 'sent', $1, $2, 'agent', 'Please fill the form', $3) RETURNING uuid`, conversationID, contactID, meta); err != nil {
+			t.Fatal(err)
+		}
+		return uuid
+	}
+
+	lo := logf.New(logf.Opts{})
+	m := &Manager{lo: &lo}
+	if err := dbutil.ScanSQLFile("queries.sql", &m.q, db, efs); err != nil {
+		t.Fatal(err)
+	}
+
+	pending := insertMessage(`{"handoff_form_pending": true, "ai_assistant_id": 7}`)
+	cleared, err := m.ClearHandoffFormPending(pending)
+	if err != nil || !cleared {
+		t.Fatalf("first clear = %v, %v; want true, nil", cleared, err)
+	}
+	var flag, assistantID string
+	if err := db.QueryRow(`SELECT meta->>'handoff_form_pending', meta->>'ai_assistant_id' FROM conversation_messages WHERE uuid = $1`, pending).Scan(&flag, &assistantID); err != nil {
+		t.Fatal(err)
+	}
+	if flag != "false" || assistantID != "7" {
+		t.Fatalf("meta after clear = pending %q, assistant %q; want false, 7", flag, assistantID)
+	}
+
+	if cleared, err := m.ClearHandoffFormPending(pending); err != nil || cleared {
+		t.Fatalf("second clear = %v, %v; want false, nil", cleared, err)
+	}
+	for _, meta := range []string{`{}`, `{"handoff_form_pending": false}`} {
+		if cleared, err := m.ClearHandoffFormPending(insertMessage(meta)); err != nil || cleared {
+			t.Fatalf("clear with meta %s = %v, %v; want false, nil", meta, cleared, err)
+		}
+	}
+}
diff --git a/internal/conversation/message.go b/internal/conversation/message.go
index e4e9300f..6da1dbde 100644
--- a/internal/conversation/message.go
+++ b/internal/conversation/message.go
@@ -443,6 +443,17 @@ func (m *Manager) MarkMessageAsPending(uuid string) error {
 	return nil
 }
 
+// ClearHandoffFormPending clears the handoff form flag on a message and reports whether it was set.
+func (m *Manager) ClearHandoffFormPending(messageUUID string) (bool, error) {
+	res, err := m.q.ClearMessageHandoffFormPending.Exec(messageUUID)
+	if err != nil {
+		m.lo.Error("error clearing handoff form flag", "message_uuid", messageUUID, "error", err)
+		return false, err
+	}
+	n, err := res.RowsAffected()
+	return n > 0, err
+}
+
 // SendPrivateNote inserts a private message in a conversation.
 func (m *Manager) SendPrivateNote(media []mmodels.Media, senderID int, conversationUUID, content string, mentions []models.MentionInput) (models.Message, error) {
 	// Best-effort render template variables before saving.
diff --git a/internal/conversation/queries.sql b/internal/conversation/queries.sql
index 9ae59bed..085cb840 100644
--- a/internal/conversation/queries.sql
+++ b/internal/conversation/queries.sql
@@ -965,6 +965,11 @@ update conversation_messages set status = $1, updated_at = NOW() where uuid = $2
 -- name: update-message-source-id
 UPDATE conversation_messages SET source_id = $1 WHERE id = $2;
 
+-- name: clear-message-handoff-form-pending
+UPDATE conversation_messages
+SET meta = meta || '{"handoff_form_pending": false}'::jsonb, updated_at = NOW()
+WHERE uuid = $1 AND COALESCE((meta->>'handoff_form_pending')::boolean, false);
+
 -- name: get-offline-livechat-conversations
 SELECT
     c.id,

From a2ba6fa3056b3e909661718008b67f04e8228c30 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 01:19:20 +0530
Subject: [PATCH 155/178] add a light, dark or system color scheme setting to
 the help center

This replaces the old "hide theme toggle" checkbox. Admins can also set a separate primary color for dark mode, and the dark logo falls back to the light one when it's empty.
---
 cmd/helpcenter.go                             |  30 ++-
 cmd/helpcenter_theme_test.go                  |  40 ++++
 .../src/components/PreviewThemeToggle.vue     |  29 +++
 .../admin/help-center/HelpCenterForm.vue      | 137 +++++++----
 .../admin/help-center/helpCenterFormSchema.js |   3 +-
 .../help-center/helpCenterFormSchema.test.js  |  11 +
 .../admin/inbox/LivechatInboxForm.vue         |   2 +-
 .../admin/help-center/HelpCenterCustomize.vue |  21 +-
 .../main/src/views/admin/inbox/InboxView.vue  |  23 +-
 .../e2e/api/helpCenterColorScheme.cy.js       | 103 +++++++++
 .../e2e/ui/helpCenterColorScheme.cy.js        | 212 ++++++++++++++++++
 i18n/en-US.json                               |   5 +-
 internal/helpcenter/helpcenter.go             |  29 ++-
 internal/helpcenter/models/models.go          |  44 ++--
 internal/helpcenter/theme_test.go             |  35 +++
 .../web-templates/help/classic/layout.html    |   6 +-
 .../web-templates/help/docs/layout.html       |   4 +-
 .../web-templates/help/shared/head.html       |   6 +-
 18 files changed, 616 insertions(+), 124 deletions(-)
 create mode 100644 cmd/helpcenter_theme_test.go
 create mode 100644 frontend/apps/main/src/components/PreviewThemeToggle.vue
 create mode 100644 frontend/cypress/e2e/api/helpCenterColorScheme.cy.js
 create mode 100644 frontend/cypress/e2e/ui/helpCenterColorScheme.cy.js

diff --git a/cmd/helpcenter.go b/cmd/helpcenter.go
index b0222191..f2c32ee6 100644
--- a/cmd/helpcenter.go
+++ b/cmd/helpcenter.go
@@ -1,6 +1,7 @@
 package main
 
 import (
+	"cmp"
 	"encoding/json"
 	"encoding/xml"
 	"fmt"
@@ -149,6 +150,12 @@ type previewTOCItem struct {
 	Title string
 }
 
+type colorSchemeResult struct {
+	dark         bool
+	showToggle   bool
+	followSystem bool
+}
+
 func (w helpCenterCacheLogWriter) Write(p []byte) (int, error) {
 	w.lo.Error("help center page cache: " + strings.TrimSpace(string(p)))
 	return len(p), nil
@@ -1778,6 +1785,8 @@ func helpCenterTemplateData(app *App, r *fastglue.Request, hc hcmodels.HelpCente
 	if pageTemplate == "" {
 		pageTemplate = hcmodels.TemplateClassic
 	}
+	embed := isEmbedRequest(r)
+	scheme := resolveColorScheme(theme.ColorScheme, string(r.RequestCtx.QueryArgs().Peek("theme")), embed)
 	return map[string]interface{}{
 		"Slug":              hc.Slug,
 		"Name":              hc.Name,
@@ -1787,9 +1796,11 @@ func helpCenterTemplateData(app *App, r *fastglue.Request, hc hcmodels.HelpCente
 		"PageTitle":         hc.PageTitle,
 		"HeaderText":        theme.Header.Heading,
 		"LogoURL":           publicAssetPaths(app, theme.LogoURL),
-		"LogoURLDark":       publicAssetPaths(app, theme.LogoURLDark),
-		"HideThemeToggle":   theme.HideThemeToggle,
+		"LogoURLDark":       publicAssetPaths(app, cmp.Or(theme.LogoURLDark, theme.LogoURL)),
 		"Color":             theme.Color,
+		"ColorDark":         cmp.Or(theme.ColorDark, theme.Color),
+		"ShowThemeToggle":   scheme.showToggle,
+		"FollowSystemTheme": scheme.followSystem,
 		"DefaultLocale":     hc.DefaultLocale,
 		"CurrentLocale":     locale,
 		"OGLocale":          strings.ReplaceAll(locale, "-", "_"),
@@ -1806,8 +1817,8 @@ func helpCenterTemplateData(app *App, r *fastglue.Request, hc hcmodels.HelpCente
 		"CustomJS":          template.JS(hc.CustomJS),
 		"WidgetInboxUUID":   livechatWidgetInboxUUID(app, hc),
 		"WidgetRootURL":     helpCenterRootURL(app),
-		"Embed":             isEmbedRequest(r),
-		"Dark":              string(r.RequestCtx.QueryArgs().Peek("theme")) == "dark",
+		"Embed":             embed,
+		"Dark":              scheme.dark,
 	}
 }
 
@@ -2114,3 +2125,14 @@ func redirectPath(ctx *fasthttp.RequestCtx, uri string, statusCode int) {
 	ctx.SetStatusCode(statusCode)
 	ctx.Response.SetBodyString("")
 }
+
+// resolveColorScheme lets the widget embed and the admin preview override the admin's scheme.
+func resolveColorScheme(scheme, requested string, embed bool) colorSchemeResult {
+	res := colorSchemeResult{dark: scheme == hcmodels.ColorSchemeDark}
+	if requested != "" || embed {
+		res.dark = requested == hcmodels.ColorSchemeDark
+	}
+	res.showToggle = scheme == hcmodels.ColorSchemeSystem && !embed
+	res.followSystem = res.showToggle && requested == ""
+	return res
+}
diff --git a/cmd/helpcenter_theme_test.go b/cmd/helpcenter_theme_test.go
new file mode 100644
index 00000000..f431e5c9
--- /dev/null
+++ b/cmd/helpcenter_theme_test.go
@@ -0,0 +1,40 @@
+package main
+
+import (
+	"testing"
+
+	hcmodels "github.com/abhinavxd/libredesk/internal/helpcenter/models"
+)
+
+func TestResolveColorScheme(t *testing.T) {
+	const (
+		system = hcmodels.ColorSchemeSystem
+		light  = hcmodels.ColorSchemeLight
+		dark   = hcmodels.ColorSchemeDark
+	)
+	tests := []struct {
+		name      string
+		scheme    string
+		requested string
+		embed     bool
+		want      colorSchemeResult
+	}{
+		{"light site", light, "", false, colorSchemeResult{}},
+		{"dark site", dark, "", false, colorSchemeResult{dark: true}},
+		{"system site", system, "", false, colorSchemeResult{showToggle: true, followSystem: true}},
+		{"preview dark of a light site", light, dark, false, colorSchemeResult{dark: true}},
+		{"preview light of a dark site", dark, light, false, colorSchemeResult{}},
+		{"preview of a system site keeps the toggle", system, dark, false, colorSchemeResult{dark: true, showToggle: true}},
+		{"embed in a light widget on a dark site", dark, "", true, colorSchemeResult{}},
+		{"embed in a dark widget", light, dark, true, colorSchemeResult{dark: true}},
+		{"embed on a system site", system, dark, true, colorSchemeResult{dark: true}},
+		{"unknown requested value", dark, "purple", false, colorSchemeResult{}},
+	}
+	for _, tt := range tests {
+		t.Run(tt.name, func(t *testing.T) {
+			if got := resolveColorScheme(tt.scheme, tt.requested, tt.embed); got != tt.want {
+				t.Errorf("resolveColorScheme(%q, %q, %v) = %+v, want %+v", tt.scheme, tt.requested, tt.embed, got, tt.want)
+			}
+		})
+	}
+}
diff --git a/frontend/apps/main/src/components/PreviewThemeToggle.vue b/frontend/apps/main/src/components/PreviewThemeToggle.vue
new file mode 100644
index 00000000..0e0daeca
--- /dev/null
+++ b/frontend/apps/main/src/components/PreviewThemeToggle.vue
@@ -0,0 +1,29 @@
+<template>
+  <Tabs v-model="theme">
+    <TabsList class="h-8 p-0.5">
+      <TabsTrigger
+        value="light"
+        class="px-2"
+        data-preview-theme="light"
+        :aria-label="$t('globals.terms.light')"
+      >
+        <Sun class="size-3.5" />
+      </TabsTrigger>
+      <TabsTrigger
+        value="dark"
+        class="px-2"
+        data-preview-theme="dark"
+        :aria-label="$t('globals.terms.dark')"
+      >
+        <Moon class="size-3.5" />
+      </TabsTrigger>
+    </TabsList>
+  </Tabs>
+</template>
+
+<script setup>
+import { Tabs, TabsList, TabsTrigger } from '@shared-ui/components/ui/tabs'
+import { Sun, Moon } from 'lucide-vue-next'
+
+const theme = defineModel({ type: String, default: 'light' })
+</script>
diff --git a/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue b/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue
index ee882e75..26583c6b 100644
--- a/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue
+++ b/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue
@@ -176,50 +176,6 @@
             :open="openSection === 'brand'"
             @toggle="toggleSection('brand')"
           >
-            <FormField v-slot="{ componentField }" name="theme.logo_url">
-              <FormItem>
-                <FormLabel>{{ t('globals.terms.logoUrl') }}</FormLabel>
-                <FormControl>
-                  <Input type="text" v-bind="componentField" />
-                </FormControl>
-                <FormMessage />
-              </FormItem>
-            </FormField>
-
-            <FormField v-slot="{ componentField }" name="theme.logo_url_dark">
-              <FormItem>
-                <FormLabel>{{ t('helpCenter.styling.darkLogoUrl') }}</FormLabel>
-                <FormControl>
-                  <Input type="text" v-bind="componentField" />
-                </FormControl>
-                <FormMessage />
-              </FormItem>
-            </FormField>
-
-            <FormField v-slot="{ value, handleChange }" name="theme.hide_theme_toggle">
-              <FormItem class="space-y-1">
-                <div class="flex items-center gap-2">
-                  <FormControl>
-                    <Checkbox :checked="!value" @update:checked="(v) => handleChange(!v)" />
-                  </FormControl>
-                  <FormLabel class="font-normal cursor-pointer">{{
-                    t('helpCenter.styling.showThemeToggle')
-                  }}</FormLabel>
-                </div>
-                <FormDescription>{{ t('helpCenter.styling.themeToggleHint') }}</FormDescription>
-              </FormItem>
-            </FormField>
-
-            <FormField v-slot="{ componentField }" name="theme.color">
-              <FormItem>
-                <FormLabel>{{ t('globals.terms.primaryColor') }}</FormLabel>
-                <FormControl>
-                  <Input type="color" v-bind="componentField" />
-                </FormControl>
-                <FormMessage />
-              </FormItem>
-            </FormField>
-
             <FormField v-slot="{ componentField }" name="theme.favicon">
               <FormItem>
                 <FormLabel>{{ t('admin.general.faviconURL') }}</FormLabel>
@@ -233,6 +189,72 @@
                 <FormMessage />
               </FormItem>
             </FormField>
+
+            <FormField v-slot="{ componentField }" name="theme.color_scheme">
+              <FormItem>
+                <FormLabel>{{ t('globals.terms.theme') }}</FormLabel>
+                <FormControl>
+                  <RadioGroup v-bind="componentField" class="flex gap-4">
+                    <div class="flex items-center space-x-2">
+                      <RadioGroupItem id="hc-scheme-system" value="system" />
+                      <Label for="hc-scheme-system">{{ t('globals.terms.matchSystem') }}</Label>
+                    </div>
+                    <div class="flex items-center space-x-2">
+                      <RadioGroupItem id="hc-scheme-light" value="light" />
+                      <Label for="hc-scheme-light">{{ t('globals.terms.light') }}</Label>
+                    </div>
+                    <div class="flex items-center space-x-2">
+                      <RadioGroupItem id="hc-scheme-dark" value="dark" />
+                      <Label for="hc-scheme-dark">{{ t('globals.terms.dark') }}</Label>
+                    </div>
+                  </RadioGroup>
+                </FormControl>
+                <FormDescription>{{ t('globals.messages.matchSystemHint') }}</FormDescription>
+                <FormMessage />
+              </FormItem>
+            </FormField>
+
+            <Tabs :model-value="editingScheme" @update:model-value="editingScheme = $event">
+              <TabsList class="w-full h-10">
+                <TabsTrigger value="light" class="flex-1 gap-2 h-8">
+                  <Sun class="size-4" />
+                  {{ t('globals.terms.light') }}
+                </TabsTrigger>
+                <TabsTrigger value="dark" class="flex-1 gap-2 h-8">
+                  <Moon class="size-4" />
+                  {{ t('globals.terms.dark') }}
+                </TabsTrigger>
+              </TabsList>
+            </Tabs>
+
+            <FormField
+              v-slot="{ componentField }"
+              :name="editingScheme === 'dark' ? 'theme.logo_url_dark' : 'theme.logo_url'"
+              keep-value
+            >
+              <FormItem>
+                <FormLabel>{{ t('globals.terms.logoUrl') }}</FormLabel>
+                <FormControl>
+                  <Input type="text" v-bind="componentField" />
+                </FormControl>
+                <FormMessage />
+              </FormItem>
+            </FormField>
+
+            <FormField
+              v-slot="{ componentField }"
+              :name="editingScheme === 'dark' ? 'theme.color_dark' : 'theme.color'"
+              keep-value
+            >
+              <FormItem>
+                <FormLabel>{{ t('globals.terms.primaryColor') }}</FormLabel>
+                <FormControl>
+                  <Input type="color" v-bind="componentField" />
+                </FormControl>
+                <FormMessage />
+              </FormItem>
+            </FormField>
+
           </CollapsibleSection>
 
           <CollapsibleSection
@@ -680,7 +702,7 @@
 </template>
 
 <script setup>
-import { watch, computed, ref, onMounted, nextTick } from 'vue'
+import { watch, computed, ref, inject, onMounted, nextTick } from 'vue'
 import { useForm, useFieldArray } from 'vee-validate'
 import { toTypedSchema } from '@vee-validate/zod'
 import { Button } from '@shared-ui/components/ui/button'
@@ -703,7 +725,8 @@ import {
   FormMessage,
   FormDescription
 } from '@shared-ui/components/ui/form/index.js'
-import { X } from 'lucide-vue-next'
+import { X, Sun, Moon } from 'lucide-vue-next'
+import { RadioGroup, RadioGroupItem } from '@shared-ui/components/ui/radio-group'
 import { Tabs, TabsList, TabsTrigger } from '@shared-ui/components/ui/tabs'
 import CollapsibleSection from './CollapsibleSection.vue'
 import LinkListField from './LinkListField.vue'
@@ -720,7 +743,7 @@ const FIELD_LOCATION = [
   ['theme.announcement', 'appearance', 'announcement'],
   ['theme.logo_url', 'appearance', 'brand'],
   ['theme.logo_url_dark', 'appearance', 'brand'],
-  ['theme.hide_theme_toggle', 'appearance', 'brand'],
+  ['theme.color_scheme', 'appearance', 'brand'],
   ['theme.color', 'appearance', 'brand'],
   ['theme.favicon', 'appearance', 'brand'],
   ['theme.nav_links', 'general', ''],
@@ -733,6 +756,13 @@ const FIELD_LOCATION = [
   ['custom_js', 'appearance', 'code']
 ]
 
+const SCHEME_FIELDS = {
+  'theme.logo_url': 'light',
+  'theme.color': 'light',
+  'theme.logo_url_dark': 'dark',
+  'theme.color_dark': 'dark'
+}
+
 const props = defineProps({
   helpCenter: {
     type: Object,
@@ -781,10 +811,11 @@ const toFormValues = (hc) => ({
   allowed_locales:
     Array.isArray(hc?.allowed_locales) && hc.allowed_locales.length ? hc.allowed_locales : ['en'],
   theme: {
+    color_scheme: hc?.theme?.color_scheme || 'light',
     color: hc?.theme?.color || '#1f93ff',
+    color_dark: hc?.theme?.color_dark || hc?.theme?.color || '#1f93ff',
     logo_url: hc?.theme?.logo_url || '',
     logo_url_dark: hc?.theme?.logo_url_dark || '',
-    hide_theme_toggle: !!hc?.theme?.hide_theme_toggle,
     nav_links: Array.isArray(hc?.theme?.nav_links) ? hc.theme.nav_links : [],
     favicon: hc?.theme?.favicon || '',
     tagline: hc?.theme?.tagline || '',
@@ -853,6 +884,15 @@ const {
 
 const isClassic = computed(() => form.values.template === 'classic')
 
+const editingScheme = inject('helpCenterPreviewScheme', ref('light'))
+watch(
+  () => form.values.theme?.color_scheme,
+  (scheme) => {
+    editingScheme.value = scheme === 'dark' ? 'dark' : 'light'
+  },
+  { immediate: true }
+)
+
 const supportedLocales = ref([])
 
 onMounted(async () => {
@@ -917,6 +957,7 @@ const onSubmit = form.handleSubmit(
     if (match) {
       activeTab.value = match[1]
       openSection.value = match[2]
+      if (SCHEME_FIELDS[firstKey]) editingScheme.value = SCHEME_FIELDS[firstKey]
     } else if (firstKey) {
       activeTab.value = 'general'
     }
diff --git a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js
index 6c1d70fd..07129bb0 100644
--- a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js
+++ b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js
@@ -115,10 +115,11 @@ const createBaseSchema = (t) => {
       .default(['en']),
     theme: z
       .object({
+        color_scheme: z.enum(['system', 'light', 'dark']).optional(),
         color: z.string().optional(),
+        color_dark: optionalHexColor,
         logo_url: optionalURL,
         logo_url_dark: optionalURL,
-        hide_theme_toggle: z.boolean().optional(),
         nav_links: linkArray,
         favicon: optionalURL,
         tagline: z.string().optional(),
diff --git a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.test.js b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.test.js
index 4e6b5ddd..e3da7191 100644
--- a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.test.js
+++ b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.test.js
@@ -65,6 +65,17 @@ describe('Help Center Form Schema', () => {
     ).not.toThrow()
   })
 
+  test('theme color scheme and dark branding', () => {
+    const withTheme = (theme) => ({ ...validForm, theme })
+    for (const color_scheme of ['system', 'light', 'dark']) {
+      expect(() => schema.parse(withTheme({ color_scheme }))).not.toThrow()
+    }
+    expect(() => schema.parse(withTheme({ color_scheme: 'auto' }))).toThrow()
+    expect(() => schema.parse(withTheme({ color_dark: '#46ce8e' }))).not.toThrow()
+    expect(() => schema.parse(withTheme({ color_dark: 'green' }))).toThrow()
+    expect(() => schema.parse(withTheme({ logo_url_dark: 'not a url' }))).toThrow()
+  })
+
   test('name missing', () => {
     const { name, ...form } = validForm
     expect(() => schema.parse(form)).toThrow()
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
index 91b1b192..502fd0fa 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
@@ -254,7 +254,7 @@
                         </div>
                       </RadioGroup>
                     </FormControl>
-                    <FormDescription>{{ $t('admin.inbox.livechat.theme.description') }}</FormDescription>
+                    <FormDescription>{{ $t('globals.messages.matchSystemHint') }}</FormDescription>
                     <FormMessage />
                   </FormItem>
                 </FormField>
diff --git a/frontend/apps/main/src/views/admin/help-center/HelpCenterCustomize.vue b/frontend/apps/main/src/views/admin/help-center/HelpCenterCustomize.vue
index 33523a9f..62d09c69 100644
--- a/frontend/apps/main/src/views/admin/help-center/HelpCenterCustomize.vue
+++ b/frontend/apps/main/src/views/admin/help-center/HelpCenterCustomize.vue
@@ -30,15 +30,7 @@
                 <SelectItem value="article">{{ t('helpCenter.styling.articlePage') }}</SelectItem>
               </SelectContent>
             </Select>
-            <Select v-model="previewTheme">
-              <SelectTrigger class="w-28 ml-auto">
-                <SelectValue />
-              </SelectTrigger>
-              <SelectContent>
-                <SelectItem value="light">{{ t('globals.terms.light') }}</SelectItem>
-                <SelectItem value="dark">{{ t('globals.terms.dark') }}</SelectItem>
-              </SelectContent>
-            </Select>
+            <PreviewThemeToggle v-model="previewTheme" class="ml-auto" />
             <Select v-model="previewDevice">
               <SelectTrigger class="w-32">
                 <SelectValue />
@@ -100,7 +92,7 @@
 </template>
 
 <script setup>
-import { ref, computed, watch, onMounted, onBeforeUnmount } from 'vue'
+import { ref, computed, watch, provide, onMounted, onBeforeUnmount } from 'vue'
 import { useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
 import { ExternalLink, Globe, X } from 'lucide-vue-next'
@@ -114,6 +106,7 @@ import {
 } from '@shared-ui/components/ui/select'
 import { CustomBreadcrumb } from '@shared-ui/components/ui/breadcrumb'
 import HelpCenterForm from '@main/features/admin/help-center/HelpCenterForm.vue'
+import PreviewThemeToggle from '@/components/PreviewThemeToggle.vue'
 import { useEmitter } from '@/composables/useEmitter.js'
 import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
@@ -143,6 +136,7 @@ const origin = computed(() =>
 const previewPage = ref('landing')
 const previewDevice = ref('desktop')
 const previewTheme = ref('light')
+provide('helpCenterPreviewScheme', previewTheme)
 const previewBox = ref(null)
 const previewTitle = computed(() => {
   const values = lastFormValues.value || helpCenter.value || {}
@@ -221,13 +215,6 @@ watch([previewPage, previewTheme], () => {
   if (lastFormValues.value) renderPreview(lastFormValues.value)
 })
 
-watch(
-  () => lastFormValues.value?.theme?.hide_theme_toggle,
-  (hidden) => {
-    if (hidden) previewTheme.value = 'light'
-  }
-)
-
 const handleSave = async (formData) => {
   isSubmitting.value = true
   try {
diff --git a/frontend/apps/main/src/views/admin/inbox/InboxView.vue b/frontend/apps/main/src/views/admin/inbox/InboxView.vue
index 993c3fc3..60adf791 100644
--- a/frontend/apps/main/src/views/admin/inbox/InboxView.vue
+++ b/frontend/apps/main/src/views/admin/inbox/InboxView.vue
@@ -20,26 +20,7 @@
                   </TabsTrigger>
                 </TabsList>
               </Tabs>
-              <Tabs v-model="previewTheme">
-                <TabsList class="h-8 p-0.5">
-                  <TabsTrigger
-                    value="light"
-                    class="px-2"
-                    data-preview-theme="light"
-                    :aria-label="$t('globals.terms.light')"
-                  >
-                    <Sun class="size-3.5" />
-                  </TabsTrigger>
-                  <TabsTrigger
-                    value="dark"
-                    class="px-2"
-                    data-preview-theme="dark"
-                    :aria-label="$t('globals.terms.dark')"
-                  >
-                    <Moon class="size-3.5" />
-                  </TabsTrigger>
-                </TabsList>
-              </Tabs>
+              <PreviewThemeToggle v-model="previewTheme" />
             </div>
           </div>
           <LivechatWidgetPreview :config="livechatPreview" :user-type="previewUserType" />
@@ -91,7 +72,7 @@ import { ref, provide } from 'vue'
 import AdminSplitLayout from '@/layouts/admin/AdminSplitLayout.vue'
 import LivechatWidgetPreview from '@/features/admin/inbox/LivechatWidgetPreview.vue'
 import { Tabs, TabsList, TabsTrigger } from '@shared-ui/components/ui/tabs'
-import { Sun, Moon } from 'lucide-vue-next'
+import PreviewThemeToggle from '@/components/PreviewThemeToggle.vue'
 
 const previewUserType = ref('visitors')
 const previewTheme = ref('light')
diff --git a/frontend/cypress/e2e/api/helpCenterColorScheme.cy.js b/frontend/cypress/e2e/api/helpCenterColorScheme.cy.js
new file mode 100644
index 00000000..c39ff97f
--- /dev/null
+++ b/frontend/cypress/e2e/api/helpCenterColorScheme.cy.js
@@ -0,0 +1,103 @@
+describe('API: help center color scheme', () => {
+  const stamp = Date.now()
+  const created = {}
+
+  const createHelpCenter = (key, theme) =>
+    cy
+      .api('POST', '/api/v1/help-centers', {
+        name: `Color scheme ${key} ${stamp}`,
+        slug: `api-hc-scheme-${key}-${stamp}`,
+        page_title: 'Help',
+        default_locale: 'en',
+        allowed_locales: ['en'],
+        ...(theme ? { theme } : {})
+      })
+      .then(({ body }) => {
+        created[key] = body.data
+      })
+
+  const page = (key, query = '') => cy.request(`/hc/${created[key].slug}/en${query}`).its('body')
+
+  before(() => {
+    cy.login()
+    createHelpCenter('none')
+    createHelpCenter('light', { color_scheme: 'light', color: '#26583f' })
+    createHelpCenter('dark', {
+      color_scheme: 'dark',
+      color: '#26583f',
+      color_dark: '#46ce8e',
+      logo_url: '/uploads/light.png',
+      logo_url_dark: '/uploads/dark.png'
+    })
+    createHelpCenter('system', { color_scheme: 'system', color: '#26583f' })
+  })
+
+  beforeEach(() => {
+    cy.login()
+  })
+
+  it('fills the scheme defaults for a help center saved without them', () => {
+    cy.api('GET', `/api/v1/help-centers/${created.none.id}`).then(({ body }) => {
+      expect(body.data.theme.color_scheme).to.eq('light')
+      expect(body.data.theme.color_dark).to.eq(body.data.theme.color)
+    })
+    cy.api('GET', `/api/v1/help-centers/${created.light.id}`)
+      .its('body.data.theme.color_dark')
+      .should('eq', '#26583f')
+  })
+
+  it('saves an unknown scheme as light', () => {
+    const { name, slug, page_title, default_locale, allowed_locales } = created.none
+    cy.api('PUT', `/api/v1/help-centers/${created.none.id}`, {
+      name,
+      slug,
+      page_title,
+      default_locale,
+      allowed_locales,
+      theme: { color_scheme: 'purple' }
+    })
+      .its('body.data.theme.color_scheme')
+      .should('eq', 'light')
+  })
+
+  it('renders a light site without dark mode or a toggle', () => {
+    page('light').then((html) => {
+      expect(html).not.to.match(/<html[^>]*class="hc-dark"/)
+      expect(html).not.to.contain('data-hc-theme')
+      expect(html).not.to.contain('prefers-color-scheme')
+    })
+  })
+
+  it('renders a dark site dark, with the dark color and logo', () => {
+    page('dark').then((html) => {
+      expect(html).to.match(/<html[^>]*class="hc-dark"/)
+      expect(html).to.contain(':root.hc-dark { --hc-accent: #46ce8e; }')
+      expect(html).to.contain('/uploads/dark.png')
+      expect(html).not.to.contain('data-hc-theme')
+    })
+  })
+
+  it('renders a system site with the toggle and the device check', () => {
+    page('system').then((html) => {
+      expect(html).not.to.match(/<html[^>]*class="hc-dark"/)
+      expect(html).to.contain('data-hc-theme')
+      expect(html).to.contain('prefers-color-scheme')
+    })
+  })
+
+  it('lets an embedded article follow the widget instead of the site', () => {
+    page('dark', '?embed=1').should('not.match', /<html[^>]*class="hc-dark"/)
+    page('light', '?embed=1&theme=dark').should('match', /<html[^>]*class="hc-dark"/)
+    page('system', '?embed=1').then((html) => {
+      expect(html).not.to.contain('data-hc-theme')
+      expect(html).not.to.contain('prefers-color-scheme')
+    })
+  })
+
+  after(() => {
+    cy.login()
+    Object.values(created).forEach((hc) => {
+      cy.api('DELETE', `/api/v1/help-centers/${hc.id}`, null, { failOnStatusCode: false })
+    })
+  })
+})
diff --git a/frontend/cypress/e2e/ui/helpCenterColorScheme.cy.js b/frontend/cypress/e2e/ui/helpCenterColorScheme.cy.js
new file mode 100644
index 00000000..035060f2
--- /dev/null
+++ b/frontend/cypress/e2e/ui/helpCenterColorScheme.cy.js
@@ -0,0 +1,212 @@
+const stamp = Date.now()
+const listPath = '/admin/help-center'
+const LIGHT_COLOR = '#26583f'
+const DARK_COLOR = '#46ce8e'
+const LIGHT_LOGO = '/uploads/cypress-light.png'
+const DARK_LOGO = '/uploads/cypress-dark.png'
+
+const createHelpCenter = (key, theme, template = 'classic') =>
+  cy
+    .api('POST', '/api/v1/help-centers', {
+      name: `Cypress scheme ${key} ${stamp}`,
+      slug: `cypress-scheme-${key}-${stamp}`,
+      page_title: 'Help',
+      default_locale: 'en',
+      allowed_locales: ['en'],
+      template,
+      ...(theme ? { theme } : {})
+    })
+    .its('body.data')
+
+// The head script reads the device setting while the page parses, so the stub must be in place before load.
+const visitAs = (hc, deviceDark) =>
+  cy.visit(`/hc/${hc.slug}/en`, {
+    onBeforeLoad(win) {
+      cy.stub(win, 'matchMedia').callsFake((query) => ({
+        matches: query.includes('dark') ? deviceDark : false,
+        media: query,
+        onchange: null,
+        addListener() {},
+        removeListener() {},
+        addEventListener() {},
+        removeEventListener() {},
+        dispatchEvent: () => false
+      }))
+    }
+  })
+
+const html = () => cy.get('html')
+const accent = () =>
+  cy.document().then((doc) =>
+    doc.defaultView.getComputedStyle(doc.documentElement).getPropertyValue('--hc-accent').trim()
+  )
+
+describe('Help center color scheme', () => {
+  const created = {}
+
+  before(() => {
+    cy.login()
+    createHelpCenter('form').then((hc) => (created.form = hc))
+    createHelpCenter('light', { color_scheme: 'light', color: LIGHT_COLOR }).then(
+      (hc) => (created.light = hc)
+    )
+    createHelpCenter('dark', {
+      color_scheme: 'dark',
+      color: LIGHT_COLOR,
+      color_dark: DARK_COLOR,
+      logo_url: LIGHT_LOGO,
+      logo_url_dark: DARK_LOGO
+    }).then((hc) => (created.dark = hc))
+    createHelpCenter('system', {
+      color_scheme: 'system',
+      color: LIGHT_COLOR,
+      color_dark: DARK_COLOR
+    }).then((hc) => (created.system = hc))
+    createHelpCenter(
+      'docs',
+      { color_scheme: 'system', color: LIGHT_COLOR, color_dark: DARK_COLOR },
+      'docs'
+    ).then((hc) => (created.docs = hc))
+  })
+
+  beforeEach(() => {
+    cy.viewport(1400, 900)
+    cy.login()
+  })
+
+  describe('admin form', () => {
+    const openBrand = () => {
+      cy.visit(`${listPath}/${created.form.id}/customize`)
+      cy.contains('[role="tab"]', 'Appearance').click()
+      cy.contains('button[aria-expanded]', 'Brand').should('have.attr', 'aria-expanded', 'true')
+    }
+    const schemeTab = (label) => cy.contains('[role="tab"]', label)
+    const setColor = (name, value) =>
+      cy.get(`input[name="${name}"]`).invoke('val', value).trigger('input')
+    const preview = () => cy.get('iframe[title="Help center"]')
+
+    it('starts a help center without a saved scheme on Light', () => {
+      openBrand()
+      cy.get('#hc-scheme-light').should('have.attr', 'data-state', 'checked')
+      schemeTab('Light').should('have.attr', 'data-state', 'active')
+      cy.get('input[name="theme.logo_url"]').should('be.visible')
+    })
+
+    it('edits light and dark branding on their own tabs and saves both', () => {
+      cy.intercept('PUT', `**/api/v1/help-centers/${created.form.id}`).as('update')
+      openBrand()
+
+      cy.get('input[name="theme.logo_url"]').clear().type(LIGHT_LOGO)
+      setColor('theme.color', LIGHT_COLOR)
+
+      schemeTab('Dark').click()
+      schemeTab('Dark').should('have.attr', 'data-state', 'active')
+      cy.get('input[name="theme.logo_url"]').should('not.exist')
+      cy.get('input[name="theme.favicon"]').should('be.visible')
+      cy.get('input[name="theme.logo_url_dark"]').should('have.value', '').type(DARK_LOGO)
+      setColor('theme.color_dark', DARK_COLOR)
+      preview().should('have.attr', 'srcdoc').and('match', /<html[^>]*class="hc-dark"/)
+
+      schemeTab('Light').click()
+      cy.get('input[name="theme.logo_url"]').should('have.value', LIGHT_LOGO)
+      cy.get('input[name="theme.color"]').should('have.value', LIGHT_COLOR)
+      preview().should('have.attr', 'srcdoc').and('not.match', /<html[^>]*class="hc-dark"/)
+
+      cy.contains('label', 'Match system').click()
+      cy.get('button[type="submit"]').click()
+      cy.wait('@update').its('response.statusCode').should('eq', 200)
+
+      cy.api('GET', `/api/v1/help-centers/${created.form.id}`)
+        .its('body.data.theme')
+        .should('include', {
+          color_scheme: 'system',
+          color: LIGHT_COLOR,
+          color_dark: DARK_COLOR,
+          logo_url: LIGHT_LOGO,
+          logo_url_dark: DARK_LOGO
+        })
+    })
+
+    it('loads saved dark branding back into the Dark tab', () => {
+      openBrand()
+      cy.get('#hc-scheme-system').should('have.attr', 'data-state', 'checked')
+      schemeTab('Dark').click()
+      cy.get('input[name="theme.logo_url_dark"]').should('have.value', DARK_LOGO)
+      cy.get('input[name="theme.color_dark"]').should('have.value', DARK_COLOR)
+    })
+
+    it('switches to the Dark tab and a dark preview when Dark is picked', () => {
+      openBrand()
+      cy.contains('label', /^Dark$/).click()
+      schemeTab('Dark').should('have.attr', 'data-state', 'active')
+      preview().should('have.attr', 'srcdoc').and('match', /<html[^>]*class="hc-dark"/)
+
+      cy.contains('label', /^Light$/).click()
+      schemeTab('Light').should('have.attr', 'data-state', 'active')
+      preview().should('have.attr', 'srcdoc').and('not.match', /<html[^>]*class="hc-dark"/)
+    })
+  })
+
+  describe('public page', () => {
+    it('keeps a light site light on a dark device, with no toggle', () => {
+      visitAs(created.light, true)
+      html().should('not.have.class', 'hc-dark')
+      cy.get('[data-hc-theme]').should('not.exist')
+      accent().should('eq', LIGHT_COLOR)
+    })
+
+    it('shows a dark site dark on a light device, with the dark color and logo', () => {
+      visitAs(created.dark, false)
+      html().should('have.class', 'hc-dark')
+      cy.get('[data-hc-theme]').should('not.exist')
+      accent().should('eq', DARK_COLOR)
+      cy.get(`img.hc-logo-dark[src="${DARK_LOGO}"]`).should('be.visible')
+      cy.get(`img.hc-logo-light[src="${LIGHT_LOGO}"]`).should('not.be.visible')
+    })
+
+    it('follows the device on a system site', () => {
+      visitAs(created.system, true)
+      html().should('have.class', 'hc-dark')
+      accent().should('eq', DARK_COLOR)
+
+      visitAs(created.system, false)
+      html().should('not.have.class', 'hc-dark')
+      accent().should('eq', LIGHT_COLOR)
+    })
+
+    it('lets the visitor override the device and remembers it across reloads', () => {
+      visitAs(created.system, false)
+      html().should('not.have.class', 'hc-dark')
+
+      cy.get('[data-hc-theme]').filter(':visible').first().click()
+      html().should('have.class', 'hc-dark')
+      cy.window().its('localStorage').invoke('getItem', 'libredesk-hc-theme').should('eq', 'dark')
+
+      visitAs(created.system, false)
+      html().should('have.class', 'hc-dark')
+
+      cy.get('[data-hc-theme]').filter(':visible').first().click()
+      html().should('not.have.class', 'hc-dark')
+
+      visitAs(created.system, true)
+      html().should('not.have.class', 'hc-dark')
+    })
+
+    it('applies the same rules on the docs template', () => {
+      visitAs(created.docs, true)
+      html().should('have.class', 'hc-dark')
+      accent().should('eq', DARK_COLOR)
+      cy.get('[data-hc-theme]').filter(':visible').first().click()
+      html().should('not.have.class', 'hc-dark')
+      visitAs(created.docs, true)
+      html().should('not.have.class', 'hc-dark')
+    })
+  })
+
+  after(() => {
+    cy.login()
+    Object.values(created).forEach((hc) => {
+      cy.api('DELETE', `/api/v1/help-centers/${hc.id}`, null, { failOnStatusCode: false })
+    })
+  })
+})
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 613e43f2..65bce407 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -425,7 +425,6 @@
   "admin.inbox.livechat.tabs.installation": "Installation",
   "admin.inbox.livechat.tabs.messages": "Messages",
   "admin.inbox.livechat.tabs.prechat": "Pre-chat form",
-  "admin.inbox.livechat.theme.description": "Match system follows the visitor's own color scheme.",
   "admin.inbox.livechat.trustedDomains.description": "One domain per line. *.example.com matches subdomains only, add the bare domain example.com separately. Leave empty to allow any domain.",
   "admin.inbox.livechat.trustedDomains.list": "Domain list",
   "admin.inbox.livechat.userSettings.visitors": "Visitors",
@@ -919,6 +918,7 @@
   "globals.messages.markAllAsRead": "Mark all as read",
   "globals.messages.markAsRead": "Mark as read",
   "globals.messages.markAsUnread": "Mark as unread",
+  "globals.messages.matchSystemHint": "Match system follows the visitor's own color scheme.",
   "globals.messages.maxLength": "Must be at most {max} characters",
   "globals.messages.fieldTooLong": "`{field}` must be at most {max} characters.",
   "globals.messages.mustBeNumber": "Must be a number",
@@ -1273,9 +1273,6 @@
   "helpCenter.preview.sampleArticleBody": "Body text, links and images appear here, styled with the settings you pick on the left.",
   "helpCenter.preview.sampleArticleListItem": "List items and other formatting are styled the same way.",
   "helpCenter.styling.brand": "Brand",
-  "helpCenter.styling.darkLogoUrl": "Logo URL (dark mode)",
-  "helpCenter.styling.showThemeToggle": "Show light and dark mode toggle",
-  "helpCenter.styling.themeToggleHint": "Visitors start in light mode and can switch to dark.",
   "helpCenter.styling.customCode": "Custom code",
   "helpCenter.customJS": "Custom JS",
   "helpCenter.deleteArticleConfirmation": "This will permanently delete the article.",
diff --git a/internal/helpcenter/helpcenter.go b/internal/helpcenter/helpcenter.go
index a7f291b2..1843d032 100644
--- a/internal/helpcenter/helpcenter.go
+++ b/internal/helpcenter/helpcenter.go
@@ -53,6 +53,7 @@ var (
 	reservedSlugs = []string{"articles", "search", "api", "sitemap.xml"}
 
 	headerBackgroundTypes = []string{"solid", "gradient", "image"}
+	colorSchemes          = []string{models.ColorSchemeSystem, models.ColorSchemeLight, models.ColorSchemeDark}
 
 	helpCenterTemplates = []string{models.TemplateDocs, models.TemplateClassic}
 
@@ -241,6 +242,9 @@ func (m *Manager) GetAllHelpCenters() ([]models.HelpCenter, error) {
 		m.lo.Error("error fetching help centers", "error", err)
 		return nil, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
+	for i := range helpCenters {
+		fillThemeDefaults(&helpCenters[i])
+	}
 	return helpCenters, nil
 }
 
@@ -251,6 +255,9 @@ func (m *Manager) GetActiveHelpCenters() ([]models.HelpCenter, error) {
 		m.lo.Error("error fetching active help centers", "error", err)
 		return nil, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
+	for i := range helpCenters {
+		fillThemeDefaults(&helpCenters[i])
+	}
 	return helpCenters, nil
 }
 
@@ -264,6 +271,7 @@ func (m *Manager) GetHelpCenterByID(id int) (models.HelpCenter, error) {
 		m.lo.Error("error fetching help center", "error", err, "id", id)
 		return hc, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
+	fillThemeDefaults(&hc)
 	return hc, nil
 }
 
@@ -277,6 +285,7 @@ func (m *Manager) GetHelpCenterBySlug(slug string) (models.HelpCenter, error) {
 		m.lo.Error("error fetching help center by slug", "error", err, "slug", slug)
 		return hc, envelope.NewError(envelope.GeneralError, m.i18n.T("globals.messages.somethingWentWrong"), nil)
 	}
+	fillThemeDefaults(&hc)
 	return hc, nil
 }
 
@@ -374,6 +383,7 @@ func (m *Manager) ToggleHelpCenterActive(id int) (models.HelpCenter, error) {
 	}
 	// A paused help center 404s publicly, so its articles must leave the AI index too.
 	m.reindexHelpCenterArticles(id)
+	fillThemeDefaults(&hc)
 	return hc, nil
 }
 
@@ -1604,18 +1614,26 @@ func (m *Manager) normalizeHelpCenterRequest(req HelpCenterRequest) (HelpCenterR
 
 // normalizeTheme drops theme values that aren't safe to inject into CSS, and rejects a theme it can't read.
 func normalizeTheme(raw json.RawMessage) (json.RawMessage, error) {
-	if len(raw) == 0 {
-		return json.RawMessage("{}"), nil
+	if len(raw) == 0 || string(raw) == "null" {
+		raw = json.RawMessage("{}")
 	}
 	t := models.DefaultTheme()
 	if err := json.Unmarshal(raw, &t); err != nil {
 		return nil, err
 	}
+	if !slices.Contains(colorSchemes, t.ColorScheme) {
+		t.ColorScheme = models.ColorSchemeLight
+	}
 	t.Color = sanitizeHexColor(t.Color)
 	if t.Color == "" {
 		t.Color = defaultAccentColor
 	}
+	t.ColorDark = sanitizeHexColor(t.ColorDark)
+	if t.ColorDark == "" {
+		t.ColorDark = t.Color
+	}
 	t.LogoURL = sanitizeAssetURL(t.LogoURL)
+	t.LogoURLDark = sanitizeAssetURL(t.LogoURLDark)
 	t.NavLinks = sanitizeNavLinks(t.NavLinks)
 	t.Header.Heading = strings.TrimSpace(t.Header.Heading)
 	t.Header.BackgroundColor = sanitizeHexColor(t.Header.BackgroundColor)
@@ -1793,3 +1811,10 @@ func buildInlineTextSanitizer() *bluemonday.Policy {
 	p.AllowElements("b", "strong", "i", "em", "u", "s", "del", "ins", "mark", "small", "sub", "sup", "br", "span", "code")
 	return p
 }
+
+// fillThemeDefaults gives a theme saved before a field existed that field's default.
+func fillThemeDefaults(hc *models.HelpCenter) {
+	if theme, err := normalizeTheme(hc.Theme); err == nil {
+		hc.Theme = theme
+	}
+}
diff --git a/internal/helpcenter/models/models.go b/internal/helpcenter/models/models.go
index 4558ac21..0d158424 100644
--- a/internal/helpcenter/models/models.go
+++ b/internal/helpcenter/models/models.go
@@ -13,6 +13,10 @@ const (
 
 	TemplateDocs    = "docs"
 	TemplateClassic = "classic"
+
+	ColorSchemeSystem = "system"
+	ColorSchemeLight  = "light"
+	ColorSchemeDark   = "dark"
 )
 
 type HelpCenter struct {
@@ -36,21 +40,22 @@ type HelpCenter struct {
 
 // Theme holds the customizable branding for a help center's public pages.
 type Theme struct {
-	Color           string            `json:"color"`
-	LogoURL         string            `json:"logo_url"`
-	LogoURLDark     string            `json:"logo_url_dark"`
-	HideThemeToggle bool              `json:"hide_theme_toggle"`
-	NavLinks        []NavLink         `json:"nav_links"`
-	Favicon         string            `json:"favicon"`
-	Tagline         string            `json:"tagline"`
-	Header          HeaderTheme       `json:"header"`
-	Footer          FooterTheme       `json:"footer"`
-	FooterLinks     []NavLink         `json:"footer_links"`
-	SocialLinks     []SocialLink      `json:"social_links"`
-	Article         ArticleTheme      `json:"article"`
-	Layout          LayoutTheme       `json:"layout"`
-	Cards           CardTheme         `json:"cards"`
-	Announcement    AnnouncementTheme `json:"announcement"`
+	ColorScheme  string            `json:"color_scheme"`
+	Color        string            `json:"color"`
+	ColorDark    string            `json:"color_dark"`
+	LogoURL      string            `json:"logo_url"`
+	LogoURLDark  string            `json:"logo_url_dark"`
+	NavLinks     []NavLink         `json:"nav_links"`
+	Favicon      string            `json:"favicon"`
+	Tagline      string            `json:"tagline"`
+	Header       HeaderTheme       `json:"header"`
+	Footer       FooterTheme       `json:"footer"`
+	FooterLinks  []NavLink         `json:"footer_links"`
+	SocialLinks  []SocialLink      `json:"social_links"`
+	Article      ArticleTheme      `json:"article"`
+	Layout       LayoutTheme       `json:"layout"`
+	Cards        CardTheme         `json:"cards"`
+	Announcement AnnouncementTheme `json:"announcement"`
 }
 
 // AnnouncementTheme is the dismissible banner shown above the header on every public page.
@@ -216,9 +221,10 @@ type Insights struct {
 // DefaultTheme enables the show-flags for elements that must keep rendering when a stored theme predates the flag.
 func DefaultTheme() Theme {
 	return Theme{
-		Color:   "#1f93ff",
-		Layout:  LayoutTheme{ShowPopularArticles: true},
-		Cards:   CardTheme{ShowIconTile: true},
-		Article: ArticleTheme{ShowAuthor: true},
+		ColorScheme: ColorSchemeLight,
+		Color:       "#1f93ff",
+		Layout:      LayoutTheme{ShowPopularArticles: true},
+		Cards:       CardTheme{ShowIconTile: true},
+		Article:     ArticleTheme{ShowAuthor: true},
 	}
 }
diff --git a/internal/helpcenter/theme_test.go b/internal/helpcenter/theme_test.go
index 3c915bac..e2193bd7 100644
--- a/internal/helpcenter/theme_test.go
+++ b/internal/helpcenter/theme_test.go
@@ -123,6 +123,41 @@ func TestNormalizeThemeDropsUnsafeValues(t *testing.T) {
 	}
 }
 
+func TestNormalizeThemeColorScheme(t *testing.T) {
+	tests := []struct {
+		name          string
+		raw           string
+		wantScheme    string
+		wantColorDark string
+		wantLogoDark  string
+	}{
+		{"no theme saved", ``, models.ColorSchemeLight, defaultAccentColor, ""},
+		{"null theme", `null`, models.ColorSchemeLight, defaultAccentColor, ""},
+		{"saved before dark mode", `{"color": "#112233", "logo_url": "/uploads/a.png"}`, models.ColorSchemeLight, "#112233", ""},
+		{"unknown scheme", `{"color_scheme": "auto"}`, models.ColorSchemeLight, defaultAccentColor, ""},
+		{"system kept", `{"color_scheme": "system", "color_dark": "#445566"}`, models.ColorSchemeSystem, "#445566", ""},
+		{"dark kept", `{"color_scheme": "dark"}`, models.ColorSchemeDark, defaultAccentColor, ""},
+		{"bad dark color", `{"color": "#112233", "color_dark": "blue"}`, models.ColorSchemeLight, "#112233", ""},
+		{"dark logo kept", `{"logo_url_dark": "/uploads/dark.png"}`, models.ColorSchemeLight, defaultAccentColor, "/uploads/dark.png"},
+		{"unsafe dark logo", `{"logo_url_dark": "javascript:alert(1)"}`, models.ColorSchemeLight, defaultAccentColor, ""},
+	}
+	for _, tt := range tests {
+		t.Run(tt.name, func(t *testing.T) {
+			raw, err := normalizeTheme(json.RawMessage(tt.raw))
+			if err != nil {
+				t.Fatalf("normalizeTheme: %v", err)
+			}
+			var got models.Theme
+			if err := json.Unmarshal(raw, &got); err != nil {
+				t.Fatalf("unmarshal: %v", err)
+			}
+			if got.ColorScheme != tt.wantScheme || got.ColorDark != tt.wantColorDark || got.LogoURLDark != tt.wantLogoDark {
+				t.Errorf("got scheme %q, dark color %q, dark logo %q; want %q, %q, %q", got.ColorScheme, got.ColorDark, got.LogoURLDark, tt.wantScheme, tt.wantColorDark, tt.wantLogoDark)
+			}
+		})
+	}
+}
+
 func TestNormalizeLocales(t *testing.T) {
 	tests := []struct {
 		name          string
diff --git a/static/public/web-templates/help/classic/layout.html b/static/public/web-templates/help/classic/layout.html
index 18f29c88..c9a9b09d 100644
--- a/static/public/web-templates/help/classic/layout.html
+++ b/static/public/web-templates/help/classic/layout.html
@@ -10,7 +10,7 @@
             <a class="hc-brand" href="{{ .Data.HelpCenter.BasePath }}">
                 {{ if .Data.HelpCenter.LogoURL }}<img class="hc-logo-light" src="{{ .Data.HelpCenter.LogoURL }}" alt="{{ .Data.HelpCenter.Name }}" />{{ if .Data.HelpCenter.LogoURLDark }}<img class="hc-logo-dark" src="{{ .Data.HelpCenter.LogoURLDark }}" alt="{{ .Data.HelpCenter.Name }}" />{{ end }}{{ else }}<span class="hc-name">{{ .Data.HelpCenter.Name }}</span>{{ end }}
             </a>
-            {{ if or .Data.HelpCenter.NavLinks (gt (len .Data.HelpCenter.AvailableLocales) 1) (not .Data.HelpCenter.HideThemeToggle) }}
+            {{ if or .Data.HelpCenter.NavLinks (gt (len .Data.HelpCenter.AvailableLocales) 1) .Data.HelpCenter.ShowThemeToggle }}
             <button type="button" class="hc-nav-toggle" data-hc-nav-toggle aria-expanded="false" aria-controls="hc-nav-links" aria-label="{{ .L.T "globals.terms.menu" }}">
                 <svg viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.7" aria-hidden="true"><path d="M3 5.5h14M3 10h14M3 14.5h14" stroke-linecap="round"/></svg>
             </button>
@@ -18,7 +18,7 @@
                 {{ range .Data.HelpCenter.NavLinks }}<a href="{{ .URL }}">{{ .Label }}</a>{{ end }}
                 <div class="hc-nav-actions">
                     {{ if gt (len .Data.HelpCenter.AvailableLocales) 1 }}{{ template "hc-lang-switcher" . }}{{ end }}
-                    {{ if not .Data.HelpCenter.HideThemeToggle }}{{ template "hc-theme-toggle" . }}{{ end }}
+                    {{ if .Data.HelpCenter.ShowThemeToggle }}{{ template "hc-theme-toggle" . }}{{ end }}
                 </div>
             </div>
             {{ end }}
@@ -78,7 +78,7 @@
     </script>
     <script src="/static/public/static/help-center-search.js?v={{ AssetVer }}" defer></script>
     {{ if .Data.HelpCenter.CustomJS }}<script>{{ .Data.HelpCenter.CustomJS }}</script>{{ end }}
-    {{ if not .Data.HelpCenter.HideThemeToggle }}{{ template "hc-theme-script" . }}{{ end }}
+    {{ if .Data.HelpCenter.ShowThemeToggle }}{{ template "hc-theme-script" . }}{{ end }}
 {{ template "hc-livechat-widget" . }}
 </body>
 </html>
diff --git a/static/public/web-templates/help/docs/layout.html b/static/public/web-templates/help/docs/layout.html
index 09ed6cdd..b2c75405 100644
--- a/static/public/web-templates/help/docs/layout.html
+++ b/static/public/web-templates/help/docs/layout.html
@@ -28,7 +28,7 @@
                 {{ end }}
                 <div class="hc-nav-actions">
                     {{ if gt (len .Data.HelpCenter.AvailableLocales) 1 }}{{ template "hc-lang-switcher" . }}{{ end }}
-                    {{ if not .Data.HelpCenter.HideThemeToggle }}{{ template "hc-theme-toggle" . }}{{ end }}
+                    {{ if .Data.HelpCenter.ShowThemeToggle }}{{ template "hc-theme-toggle" . }}{{ end }}
                 </div>
             </div>
         </div>
@@ -194,7 +194,7 @@
     </script>
     <script src="/static/public/static/help-center-search.js?v={{ AssetVer }}" defer></script>
     {{ if .Data.HelpCenter.CustomJS }}<script>{{ .Data.HelpCenter.CustomJS }}</script>{{ end }}
-    {{ if not .Data.HelpCenter.HideThemeToggle }}{{ template "hc-theme-script" . }}{{ end }}
+    {{ if .Data.HelpCenter.ShowThemeToggle }}{{ template "hc-theme-script" . }}{{ end }}
 {{ template "hc-livechat-widget" . }}
 </body>
 </html>
diff --git a/static/public/web-templates/help/shared/head.html b/static/public/web-templates/help/shared/head.html
index b98a3b03..a4fc9235 100644
--- a/static/public/web-templates/help/shared/head.html
+++ b/static/public/web-templates/help/shared/head.html
@@ -31,13 +31,15 @@
     <link rel="stylesheet" href="/static/public/static/help-center-{{ .Data.HelpCenter.Template }}.css?v={{ AssetVer }}" />
     <link rel="stylesheet" href="/static/public/static/article-content.css?v={{ AssetVer }}" />
     <style>:root { --hc-accent: {{ .Data.HelpCenter.Color }}; }
+    :root.hc-dark { --hc-accent: {{ .Data.HelpCenter.ColorDark }}; }
     :root:not(.hc-dark) { {{ .Data.HelpCenter.ThemeCSS }} }</style>
     {{ if .Data.HelpCenter.CustomCSS }}<style>{{ .Data.HelpCenter.CustomCSS }}</style>{{ end }}
     {{ if .Data.JSONLD }}<script type="application/ld+json">{{ .Data.JSONLD }}</script>{{ end }}
-    {{ if and (not .Data.HelpCenter.HideThemeToggle) (not .Data.HelpCenter.Embed) }}<script>
+    {{ if .Data.HelpCenter.FollowSystemTheme }}<script>
     (function () {
         try {
-            if (localStorage.getItem('libredesk-hc-theme') === 'dark') {
+            var saved = localStorage.getItem('libredesk-hc-theme');
+            if (saved === 'dark' || (!saved && window.matchMedia('(prefers-color-scheme: dark)').matches)) {
                 document.documentElement.classList.add('hc-dark');
             }
         } catch (e) {}

From c52fe0e737ab6df9ad1858392281eb8698484e0c Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 01:35:19 +0530
Subject: [PATCH 156/178] add clarifying commetns to handlers

---
 cmd/chat.go                  | 1 +
 cmd/widget_campaign.go       | 3 +++
 cmd/widget_campaign_reply.go | 1 +
 3 files changed, 5 insertions(+)

diff --git a/cmd/chat.go b/cmd/chat.go
index 3fbee0e2..18003e2f 100644
--- a/cmd/chat.go
+++ b/cmd/chat.go
@@ -589,6 +589,7 @@ func handleChatSendMessage(r *fastglue.Request) error {
 	return sendChatMessageResponse(app, r, message.UUID)
 }
 
+// handleChatSubmitHandoffForm saves the form the AI agent asks the visitor to fill before it hands the chat to a human agent.
 func handleChatSubmitHandoffForm(r *fastglue.Request) error {
 	var (
 		app              = r.Context.(*App)
diff --git a/cmd/widget_campaign.go b/cmd/widget_campaign.go
index 2fb4ac6e..cdd44bc7 100644
--- a/cmd/widget_campaign.go
+++ b/cmd/widget_campaign.go
@@ -28,6 +28,7 @@ type campaignCandidate struct {
 	snapshot proactive.Snapshot
 }
 
+// handleWidgetCampaign is called by the widget as the visitor browses the site and returns the campaign message to pop up for this visitor right now, or nothing.
 func handleWidgetCampaign(r *fastglue.Request) error {
 	app := r.Context.(*App)
 	var ctx proactive.Context
@@ -108,6 +109,7 @@ func handleWidgetCampaign(r *fastglue.Request) error {
 	return r.SendEnvelope(nil)
 }
 
+// handleWidgetCampaignEvent is called by the widget when a campaign message is shown, opened or closed, for the campaign stats.
 func handleWidgetCampaignEvent(r *fastglue.Request) error {
 	app := r.Context.(*App)
 	var req campaignEventRequest
@@ -143,6 +145,7 @@ func handleWidgetCampaignEvent(r *fastglue.Request) error {
 	return r.SendEnvelope(true)
 }
 
+// handleCampaignStats returns shown, opened, dismissed and replied counts for each campaign in an inbox over a date range.
 func handleCampaignStats(r *fastglue.Request) error {
 	app := r.Context.(*App)
 	id, err := strconv.Atoi(r.RequestCtx.UserValue("id").(string))
diff --git a/cmd/widget_campaign_reply.go b/cmd/widget_campaign_reply.go
index fff13738..0d513d1d 100644
--- a/cmd/widget_campaign_reply.go
+++ b/cmd/widget_campaign_reply.go
@@ -9,6 +9,7 @@ import (
 	"github.com/zerodha/fastglue"
 )
 
+// handleWidgetCampaignReply runs when a visitor replies to a campaign pop-up, adding the reply to its conversation or starting a new one.
 func handleWidgetCampaignReply(r *fastglue.Request, req chatInitReq, inbox imodels.Inbox, config livechat.Config) error {
 	app := r.Context.(*App)
 	if !validCampaignKey(req.DeliveryID) || !validCampaignKey(req.BrowserKey) {

From 7ecc9fd084e205497aeeac008833a75b56c84e6f Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 02:07:02 +0530
Subject: [PATCH 157/178] fix help center colors that broke or went missing in
 dark mode

---
 cmd/helpcenter.go                             | 25 +++++++++++++++
 cmd/helpcenter_theme_test.go                  | 25 +++++++++++++++
 .../src/components/editor/ArticleEditor.vue   | 31 ++++++++++++++++---
 .../src/components/editor/editorStyles.scss   |  4 +--
 .../admin/help-center/ArticleEditSheet.vue    | 10 ++++++
 .../admin/help-center/HelpCenterTree.vue      |  2 ++
 static/public/static/article-content.css      | 12 +++++--
 static/public/static/help-center-classic.css  |  4 ++-
 static/public/static/help-center-docs.css     |  4 ++-
 .../web-templates/help/shared/head.html       |  5 ++-
 10 files changed, 108 insertions(+), 14 deletions(-)

diff --git a/cmd/helpcenter.go b/cmd/helpcenter.go
index f2c32ee6..1426f76e 100644
--- a/cmd/helpcenter.go
+++ b/cmd/helpcenter.go
@@ -1809,6 +1809,7 @@ func helpCenterTemplateData(app *App, r *fastglue.Request, hc hcmodels.HelpCente
 		"NavLinks":          theme.NavLinks,
 		"Theme":             theme,
 		"ThemeCSS":          buildThemeCSSVars(theme),
+		"ThemeCSSDark":      buildDarkThemeCSSVars(theme),
 		"AnnouncementKey":   announcementKey(hc.Slug, theme.Announcement),
 		"TaglineHTML":       template.HTML(helpcenter.RenderInlineMarkdown(theme.Tagline)),
 		"FooterTaglineHTML": template.HTML(helpcenter.RenderInlineMarkdown(theme.Footer.Tagline)),
@@ -1882,6 +1883,30 @@ func buildThemeCSSVars(t hcmodels.Theme) template.CSS {
 	return template.CSS(b.String())
 }
 
+// buildDarkThemeCSSVars resets text colors that sit on the default background, since those were picked against the light one.
+func buildDarkThemeCSSVars(t hcmodels.Theme) template.CSS {
+	var b strings.Builder
+	if t.Header.TextColor != "" && !hasHeaderBackground(t.Header) {
+		b.WriteString("--hc-header-text:initial;")
+	}
+	if t.Footer.TextColor != "" && t.Footer.BackgroundColor == "" {
+		b.WriteString("--hc-footer-text:initial;")
+	}
+	return template.CSS(b.String())
+}
+
+func hasHeaderBackground(h hcmodels.HeaderTheme) bool {
+	switch h.BackgroundType {
+	case "image":
+		return h.BackgroundImage != ""
+	case "gradient":
+		return h.GradientFrom != "" && h.GradientTo != ""
+	case "solid":
+		return h.BackgroundColor != ""
+	}
+	return false
+}
+
 // renderHelpCenterNotFound renders the help center's themed 404, falling back to the
 // generic error page when the help center is nil.
 func renderHelpCenterNotFound(r *fastglue.Request, hc *hcmodels.HelpCenter) error {
diff --git a/cmd/helpcenter_theme_test.go b/cmd/helpcenter_theme_test.go
index f431e5c9..cdf760d0 100644
--- a/cmd/helpcenter_theme_test.go
+++ b/cmd/helpcenter_theme_test.go
@@ -38,3 +38,28 @@ func TestResolveColorScheme(t *testing.T) {
 		})
 	}
 }
+
+func TestBuildDarkThemeCSSVars(t *testing.T) {
+	tests := []struct {
+		name   string
+		header hcmodels.HeaderTheme
+		footer hcmodels.FooterTheme
+		want   string
+	}{
+		{"nothing set", hcmodels.HeaderTheme{}, hcmodels.FooterTheme{}, ""},
+		{"header text on default header", hcmodels.HeaderTheme{TextColor: "#000"}, hcmodels.FooterTheme{}, "--hc-header-text:initial;"},
+		{"header text on solid header", hcmodels.HeaderTheme{BackgroundType: "solid", BackgroundColor: "#fff", TextColor: "#000"}, hcmodels.FooterTheme{}, ""},
+		{"header text on image header", hcmodels.HeaderTheme{BackgroundType: "image", BackgroundImage: "/a.png", TextColor: "#000"}, hcmodels.FooterTheme{}, ""},
+		{"header text on half-set gradient", hcmodels.HeaderTheme{BackgroundType: "gradient", GradientFrom: "#fff", TextColor: "#000"}, hcmodels.FooterTheme{}, "--hc-header-text:initial;"},
+		{"footer text on default footer", hcmodels.HeaderTheme{}, hcmodels.FooterTheme{TextColor: "#000"}, "--hc-footer-text:initial;"},
+		{"footer text on custom footer", hcmodels.HeaderTheme{}, hcmodels.FooterTheme{BackgroundColor: "#fff", TextColor: "#000"}, ""},
+	}
+	for _, tt := range tests {
+		t.Run(tt.name, func(t *testing.T) {
+			got := string(buildDarkThemeCSSVars(hcmodels.Theme{Header: tt.header, Footer: tt.footer}))
+			if got != tt.want {
+				t.Errorf("buildDarkThemeCSSVars() = %q, want %q", got, tt.want)
+			}
+		})
+	}
+}
diff --git a/frontend/apps/main/src/components/editor/ArticleEditor.vue b/frontend/apps/main/src/components/editor/ArticleEditor.vue
index 5579d288..2859e1c2 100644
--- a/frontend/apps/main/src/components/editor/ArticleEditor.vue
+++ b/frontend/apps/main/src/components/editor/ArticleEditor.vue
@@ -20,7 +20,11 @@
       </div>
     </Teleport>
 
-    <EditorContent :editor="editor" class="hc-prose flex-1 min-h-0 overflow-y-auto" />
+    <EditorContent
+      :editor="editor"
+      class="hc-prose flex-1 min-h-0 overflow-y-auto"
+      :style="{ '--hc-editor-accent': accentColor || null, '--hc-editor-accent-dark': accentColorDark || null }"
+    />
 
     <input
       ref="imageInput"
@@ -58,7 +62,9 @@ const props = defineProps({
   disabled: { type: Boolean, default: false },
   enableInlineImages: { type: Boolean, default: false },
   linkedModel: { type: String, default: 'messages' },
-  toolbarTarget: { type: null, default: null }
+  toolbarTarget: { type: null, default: null },
+  accentColor: { type: String, default: '' },
+  accentColorDark: { type: String, default: '' }
 })
 
 const emit = defineEmits(['send', 'filesDropped'])
@@ -104,12 +110,23 @@ defineExpose({ focus })
 
 <style lang="scss">
 .tiptap {
-  --hc-accent: hsl(var(--primary));
+  --hc-accent: var(--hc-editor-accent, hsl(var(--primary)));
   --hc-accent-ink: color-mix(in srgb, var(--hc-accent), #0d1117 46%);
+  --hc-accent-fill: color-mix(in srgb, var(--hc-accent), #0d1117 46%);
   --hc-border: hsl(var(--border));
-  --hc-accent-tint: hsl(var(--primary) / 0.08);
+  --hc-bg: hsl(var(--background));
+  --hc-accent-tint: color-mix(in srgb, var(--hc-accent) 8%, var(--hc-bg));
   --hc-muted: hsl(var(--muted-foreground));
 
+  table td,
+  table th {
+    border-color: var(--hc-border);
+  }
+
+  table th {
+    background: var(--hc-accent-tint);
+  }
+
   details.hc-details > .hc-details-content {
     margin-top: 0.5rem;
   }
@@ -124,4 +141,10 @@ defineExpose({ focus })
     outline-offset: 2px;
   }
 }
+
+.dark .tiptap {
+  --hc-accent: var(--hc-editor-accent-dark, var(--hc-editor-accent, hsl(var(--primary))));
+  --hc-accent-ink: color-mix(in srgb, var(--hc-accent), #ffffff 34%);
+  --hc-accent-tint: color-mix(in srgb, var(--hc-accent) 12%, var(--hc-bg));
+}
 </style>
diff --git a/frontend/apps/main/src/components/editor/editorStyles.scss b/frontend/apps/main/src/components/editor/editorStyles.scss
index ac110396..ccd91275 100644
--- a/frontend/apps/main/src/components/editor/editorStyles.scss
+++ b/frontend/apps/main/src/components/editor/editorStyles.scss
@@ -34,13 +34,13 @@
 
     td,
     th {
-      border: 1px solid #dee2e6;
+      border: 1px solid hsl(var(--border));
       padding: 6px 8px;
       vertical-align: top;
     }
 
     th {
-      background: #f8f9fa;
+      background: hsl(var(--muted));
       font-weight: bold;
       text-align: left;
     }
diff --git a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
index 9dbd85a1..5408530a 100644
--- a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
+++ b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
@@ -71,6 +71,8 @@
                         enableInlineImages
                         linkedModel="help_articles"
                         :toolbarTarget="toolbarSlot"
+                        :accent-color="helpCenterColor"
+                        :accent-color-dark="helpCenterColorDark"
                         class="min-h-[400px] border-0 px-0 shadow-none focus-visible:ring-0"
                       />
                     </div>
@@ -544,6 +546,14 @@ const props = defineProps({
     type: String,
     default: ''
   },
+  helpCenterColor: {
+    type: String,
+    default: ''
+  },
+  helpCenterColorDark: {
+    type: String,
+    default: ''
+  },
   helpCenterLocales: {
     type: Array,
     default: () => ['en']
diff --git a/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue b/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue
index 3fcd473a..60e90fde 100644
--- a/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue
+++ b/frontend/apps/main/src/views/admin/help-center/HelpCenterTree.vue
@@ -133,6 +133,8 @@
     :help-center-id="parseInt(id)"
     :help-center-name="helpCenter?.name || ''"
     :help-center-slug="helpCenter?.slug || ''"
+    :help-center-color="helpCenter?.theme?.color || ''"
+    :help-center-color-dark="helpCenter?.theme?.color_dark || ''"
     :help-center-locales="helpCenter?.allowed_locales || ['en']"
     :default-locale="props.locale"
     :translation-source="translationSource"
diff --git a/static/public/static/article-content.css b/static/public/static/article-content.css
index 7dad090a..fd0d39c4 100644
--- a/static/public/static/article-content.css
+++ b/static/public/static/article-content.css
@@ -71,7 +71,7 @@ a.hc-button {
     display: inline-block;
     margin: .35rem 0;
     padding: .6rem 1.15rem;
-    background: var(--hc-accent-ink);
+    background: var(--hc-accent-fill);
     color: #fff;
     border-radius: 8px;
     font-weight: 600;
@@ -164,6 +164,7 @@ details.hc-details > .hc-details-content > :last-child { margin-bottom: 0; }
 body.hc-embed { min-height: 0; }
 
 .hc-dark {
+    color-scheme: dark;
     --hc-accent-ink: color-mix(in srgb, var(--hc-accent), #ffffff 34%);
     --hc-accent-tint: color-mix(in srgb, var(--hc-accent) 12%, #16181b);
     --hc-accent-tint-2: color-mix(in srgb, var(--hc-accent) 20%, #16181b);
@@ -177,10 +178,15 @@ body.hc-embed { min-height: 0; }
     --hcd-sidebar-bg: #1a1c1f;
     --hc-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 1px 3px rgba(0, 0, 0, .5);
     --hc-shadow-lift: 0 4px 12px rgba(0, 0, 0, .5), 0 10px 30px rgba(0, 0, 0, .55);
-    background: var(--hc-bg);
-    color: var(--hc-ink);
 }
 
+.hc-dark .hc-prose pre { border: 1px solid var(--hc-border); }
+/* .dark is the agent app's theme class, for the article editor. */
+:is(.hc-dark, .dark) .hc-callout-info { background: color-mix(in srgb, #3b82f6 16%, var(--hc-bg)); }
+:is(.hc-dark, .dark) .hc-callout-success { background: color-mix(in srgb, #22c55e 14%, var(--hc-bg)); }
+:is(.hc-dark, .dark) .hc-callout-warning { background: color-mix(in srgb, #f59e0b 14%, var(--hc-bg)); }
+:is(.hc-dark, .dark) .hc-callout-danger { background: color-mix(in srgb, #ef4444 16%, var(--hc-bg)); }
+
 .hc-theme-btn {
     display: inline-flex; align-items: center; justify-content: center;
     padding: .4rem; line-height: 0;
diff --git a/static/public/static/help-center-classic.css b/static/public/static/help-center-classic.css
index d670d7f9..93db9e3e 100644
--- a/static/public/static/help-center-classic.css
+++ b/static/public/static/help-center-classic.css
@@ -1,6 +1,8 @@
 :root {
     /* Darkened accent, readable as text/icon on white for any customer hue. */
     --hc-accent-ink: color-mix(in srgb, var(--hc-accent), #0d1117 46%);
+    /* Stays dark in both modes, so white text on it remains readable. */
+    --hc-accent-fill: color-mix(in srgb, var(--hc-accent), #0d1117 46%);
     --hc-accent-tint: color-mix(in srgb, var(--hc-accent) 7%, #ffffff);
     --hc-accent-tint-2: color-mix(in srgb, var(--hc-accent) 13%, #ffffff);
     --hc-accent-line: color-mix(in srgb, var(--hc-accent) 24%, #ffffff);
@@ -46,7 +48,7 @@ a:hover { text-decoration: underline; }
     justify-content: center;
     gap: .5rem;
     padding: .55rem 1rem;
-    background: var(--hc-accent-ink);
+    background: var(--hc-accent-fill);
     color: #ffffff;
     font-size: .9rem;
     text-align: center;
diff --git a/static/public/static/help-center-docs.css b/static/public/static/help-center-docs.css
index c73cae19..7de53750 100644
--- a/static/public/static/help-center-docs.css
+++ b/static/public/static/help-center-docs.css
@@ -2,6 +2,8 @@
    article TOC rail. Colors derive from --hc-accent set by the host page. */
 :root {
     --hc-accent-ink: color-mix(in srgb, var(--hc-accent), #0d1117 46%);
+    /* Stays dark in both modes, so white text on it remains readable. */
+    --hc-accent-fill: color-mix(in srgb, var(--hc-accent), #0d1117 46%);
     --hc-accent-tint: color-mix(in srgb, var(--hc-accent) 7%, #ffffff);
     --hc-accent-tint-2: color-mix(in srgb, var(--hc-accent) 13%, #ffffff);
     --hc-accent-line: color-mix(in srgb, var(--hc-accent) 24%, #ffffff);
@@ -85,7 +87,7 @@ body.hcd::after {
     justify-content: center;
     gap: .5rem;
     padding: .55rem 1rem;
-    background: var(--hc-accent-ink);
+    background: var(--hc-accent-fill);
     color: #ffffff;
     font-size: .9rem;
     text-align: center;
diff --git a/static/public/web-templates/help/shared/head.html b/static/public/web-templates/help/shared/head.html
index a4fc9235..899a853a 100644
--- a/static/public/web-templates/help/shared/head.html
+++ b/static/public/web-templates/help/shared/head.html
@@ -30,9 +30,8 @@
     <link rel="stylesheet" href="/static/public/static/help-center-cards.css?v={{ AssetVer }}" />
     <link rel="stylesheet" href="/static/public/static/help-center-{{ .Data.HelpCenter.Template }}.css?v={{ AssetVer }}" />
     <link rel="stylesheet" href="/static/public/static/article-content.css?v={{ AssetVer }}" />
-    <style>:root { --hc-accent: {{ .Data.HelpCenter.Color }}; }
-    :root.hc-dark { --hc-accent: {{ .Data.HelpCenter.ColorDark }}; }
-    :root:not(.hc-dark) { {{ .Data.HelpCenter.ThemeCSS }} }</style>
+    <style>:root { --hc-accent: {{ .Data.HelpCenter.Color }}; {{ .Data.HelpCenter.ThemeCSS }} }
+    :root.hc-dark { --hc-accent: {{ .Data.HelpCenter.ColorDark }};{{ with .Data.HelpCenter.ThemeCSSDark }} {{ . }}{{ end }} }</style>
     {{ if .Data.HelpCenter.CustomCSS }}<style>{{ .Data.HelpCenter.CustomCSS }}</style>{{ end }}
     {{ if .Data.JSONLD }}<script type="application/ld+json">{{ .Data.JSONLD }}</script>{{ end }}
     {{ if .Data.HelpCenter.FollowSystemTheme }}<script>

From eac3041df702d01f311e2e7465f351b04ef03df8 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 02:21:50 +0530
Subject: [PATCH 158/178] add separate light and dark footer colors to the help
 center

---
 cmd/helpcenter.go                             | 16 ++++--
 cmd/helpcenter_theme_test.go                  |  4 +-
 .../admin/help-center/HelpCenterForm.vue      | 54 ++++++++++++++++---
 .../admin/help-center/helpCenterFormSchema.js |  2 +
 .../help-center/helpCenterFormSchema.test.js  | 10 ++++
 .../e2e/api/helpCenterColorScheme.cy.js       | 31 +++++++++++
 .../e2e/ui/helpCenterColorScheme.cy.js        | 53 ++++++++++++++++++
 internal/helpcenter/helpcenter.go             |  2 +
 internal/helpcenter/models/models.go          |  8 +--
 internal/helpcenter/theme_test.go             |  6 ++-
 10 files changed, 171 insertions(+), 15 deletions(-)

diff --git a/cmd/helpcenter.go b/cmd/helpcenter.go
index 1426f76e..43f4e584 100644
--- a/cmd/helpcenter.go
+++ b/cmd/helpcenter.go
@@ -1883,18 +1883,26 @@ func buildThemeCSSVars(t hcmodels.Theme) template.CSS {
 	return template.CSS(b.String())
 }
 
-// buildDarkThemeCSSVars resets text colors that sit on the default background, since those were picked against the light one.
+// buildDarkThemeCSSVars swaps in the dark footer colors and resets light-only colors to the dark defaults.
 func buildDarkThemeCSSVars(t hcmodels.Theme) template.CSS {
 	var b strings.Builder
 	if t.Header.TextColor != "" && !hasHeaderBackground(t.Header) {
 		b.WriteString("--hc-header-text:initial;")
 	}
-	if t.Footer.TextColor != "" && t.Footer.BackgroundColor == "" {
-		b.WriteString("--hc-footer-text:initial;")
-	}
+	writeDarkVar(&b, "--hc-footer-bg", t.Footer.BackgroundColorDark, t.Footer.BackgroundColor)
+	writeDarkVar(&b, "--hc-footer-text", t.Footer.TextColorDark, t.Footer.TextColor)
 	return template.CSS(b.String())
 }
 
+func writeDarkVar(b *strings.Builder, name, dark, light string) {
+	switch {
+	case dark != "":
+		fmt.Fprintf(b, "%s:%s;", name, dark)
+	case light != "":
+		fmt.Fprintf(b, "%s:initial;", name)
+	}
+}
+
 func hasHeaderBackground(h hcmodels.HeaderTheme) bool {
 	switch h.BackgroundType {
 	case "image":
diff --git a/cmd/helpcenter_theme_test.go b/cmd/helpcenter_theme_test.go
index cdf760d0..614e1092 100644
--- a/cmd/helpcenter_theme_test.go
+++ b/cmd/helpcenter_theme_test.go
@@ -52,7 +52,9 @@ func TestBuildDarkThemeCSSVars(t *testing.T) {
 		{"header text on image header", hcmodels.HeaderTheme{BackgroundType: "image", BackgroundImage: "/a.png", TextColor: "#000"}, hcmodels.FooterTheme{}, ""},
 		{"header text on half-set gradient", hcmodels.HeaderTheme{BackgroundType: "gradient", GradientFrom: "#fff", TextColor: "#000"}, hcmodels.FooterTheme{}, "--hc-header-text:initial;"},
 		{"footer text on default footer", hcmodels.HeaderTheme{}, hcmodels.FooterTheme{TextColor: "#000"}, "--hc-footer-text:initial;"},
-		{"footer text on custom footer", hcmodels.HeaderTheme{}, hcmodels.FooterTheme{BackgroundColor: "#fff", TextColor: "#000"}, ""},
+		{"light footer colors only", hcmodels.HeaderTheme{}, hcmodels.FooterTheme{BackgroundColor: "#fff", TextColor: "#000"}, "--hc-footer-bg:initial;--hc-footer-text:initial;"},
+		{"dark footer colors", hcmodels.HeaderTheme{}, hcmodels.FooterTheme{BackgroundColor: "#fff", TextColor: "#000", BackgroundColorDark: "#111", TextColorDark: "#eee"}, "--hc-footer-bg:#111;--hc-footer-text:#eee;"},
+		{"dark footer text only", hcmodels.HeaderTheme{}, hcmodels.FooterTheme{TextColorDark: "#eee"}, "--hc-footer-text:#eee;"},
 	}
 	for _, tt := range tests {
 		t.Run(tt.name, func(t *testing.T) {
diff --git a/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue b/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue
index 26583c6b..213baf65 100644
--- a/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue
+++ b/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue
@@ -254,7 +254,6 @@
                 <FormMessage />
               </FormItem>
             </FormField>
-
           </CollapsibleSection>
 
           <CollapsibleSection
@@ -583,21 +582,58 @@
             :open="openSection === 'footer'"
             @toggle="toggleSection('footer')"
           >
+            <Tabs :model-value="editingScheme" @update:model-value="editingScheme = $event">
+              <TabsList class="w-full h-10">
+                <TabsTrigger value="light" class="flex-1 gap-2 h-8">
+                  <Sun class="size-4" />
+                  {{ t('globals.terms.light') }}
+                </TabsTrigger>
+                <TabsTrigger value="dark" class="flex-1 gap-2 h-8">
+                  <Moon class="size-4" />
+                  {{ t('globals.terms.dark') }}
+                </TabsTrigger>
+              </TabsList>
+            </Tabs>
+
             <div class="flex gap-4">
-              <FormField v-slot="{ componentField }" name="theme.footer.background_color">
+              <FormField
+                v-slot="{ componentField }"
+                :name="
+                  editingScheme === 'dark'
+                    ? 'theme.footer.background_color_dark'
+                    : 'theme.footer.background_color'
+                "
+                keep-value
+              >
                 <FormItem class="flex-1">
                   <FormLabel>{{ t('globals.messages.backgroundColor') }}</FormLabel>
                   <FormControl>
-                    <Input type="text" placeholder="#ffffff" v-bind="componentField" />
+                    <Input
+                      type="text"
+                      :placeholder="editingScheme === 'dark' ? '#16181b' : '#ffffff'"
+                      v-bind="componentField"
+                    />
                   </FormControl>
                   <FormMessage />
                 </FormItem>
               </FormField>
-              <FormField v-slot="{ componentField }" name="theme.footer.text_color">
+              <FormField
+                v-slot="{ componentField }"
+                :name="
+                  editingScheme === 'dark'
+                    ? 'theme.footer.text_color_dark'
+                    : 'theme.footer.text_color'
+                "
+                keep-value
+              >
                 <FormItem class="flex-1">
                   <FormLabel>{{ t('globals.terms.textColor') }}</FormLabel>
                   <FormControl>
-                    <Input type="text" placeholder="#909aa5" v-bind="componentField" />
+                    <Input
+                      type="text"
+                      :placeholder="editingScheme === 'dark' ? '#82878e' : '#909aa5'"
+                      v-bind="componentField"
+                    />
                   </FormControl>
                   <FormMessage />
                 </FormItem>
@@ -760,7 +796,11 @@ const SCHEME_FIELDS = {
   'theme.logo_url': 'light',
   'theme.color': 'light',
   'theme.logo_url_dark': 'dark',
-  'theme.color_dark': 'dark'
+  'theme.color_dark': 'dark',
+  'theme.footer.background_color': 'light',
+  'theme.footer.text_color': 'light',
+  'theme.footer.background_color_dark': 'dark',
+  'theme.footer.text_color_dark': 'dark'
 }
 
 const props = defineProps({
@@ -851,6 +891,8 @@ const toFormValues = (hc) => ({
     footer: {
       background_color: hc?.theme?.footer?.background_color || '',
       text_color: hc?.theme?.footer?.text_color || '',
+      background_color_dark: hc?.theme?.footer?.background_color_dark || '',
+      text_color_dark: hc?.theme?.footer?.text_color_dark || '',
       tagline: hc?.theme?.footer?.tagline || ''
     },
     footer_links: Array.isArray(hc?.theme?.footer_links) ? hc.theme.footer_links : [],
diff --git a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js
index 07129bb0..795c7baf 100644
--- a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js
+++ b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.js
@@ -162,6 +162,8 @@ const createBaseSchema = (t) => {
           .object({
             background_color: optionalHexColor,
             text_color: optionalHexColor,
+            background_color_dark: optionalHexColor,
+            text_color_dark: optionalHexColor,
             tagline: z.string().optional()
           })
           .optional(),
diff --git a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.test.js b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.test.js
index e3da7191..bb5b52b0 100644
--- a/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.test.js
+++ b/frontend/apps/main/src/features/admin/help-center/helpCenterFormSchema.test.js
@@ -76,6 +76,16 @@ describe('Help Center Form Schema', () => {
     expect(() => schema.parse(withTheme({ logo_url_dark: 'not a url' }))).toThrow()
   })
 
+  test('dark footer colors', () => {
+    const withFooter = (footer) => ({ ...validForm, theme: { footer } })
+    expect(() =>
+      schema.parse(withFooter({ background_color_dark: '#16181b', text_color_dark: '#e5e5e5' }))
+    ).not.toThrow()
+    expect(() => schema.parse(withFooter({ background_color_dark: '' }))).not.toThrow()
+    expect(() => schema.parse(withFooter({ background_color_dark: 'black' }))).toThrow()
+    expect(() => schema.parse(withFooter({ text_color_dark: '#zzz' }))).toThrow()
+  })
+
   test('name missing', () => {
     const { name, ...form } = validForm
     expect(() => schema.parse(form)).toThrow()
diff --git a/frontend/cypress/e2e/api/helpCenterColorScheme.cy.js b/frontend/cypress/e2e/api/helpCenterColorScheme.cy.js
index c39ff97f..d24f5ce8 100644
--- a/frontend/cypress/e2e/api/helpCenterColorScheme.cy.js
+++ b/frontend/cypress/e2e/api/helpCenterColorScheme.cy.js
@@ -30,6 +30,21 @@ describe('API: help center color scheme', () => {
       logo_url_dark: '/uploads/dark.png'
     })
     createHelpCenter('system', { color_scheme: 'system', color: '#26583f' })
+    createHelpCenter('footer', {
+      color_scheme: 'system',
+      color: '#26583f',
+      footer: {
+        background_color: '#e3e3e3',
+        text_color: '#000000',
+        background_color_dark: '#101010',
+        text_color_dark: '#e5e5e5'
+      }
+    })
+    createHelpCenter('light-footer', {
+      color_scheme: 'system',
+      color: '#26583f',
+      footer: { background_color: '#e3e3e3', text_color: '#000000' }
+    })
   })
 
   beforeEach(() => {
@@ -85,6 +100,22 @@ describe('API: help center color scheme', () => {
     })
   })
 
+  it('uses the dark footer colors in dark mode', () => {
+    page('footer').then((html) => {
+      expect(html).to.contain('--hc-footer-bg:#e3e3e3;--hc-footer-text:#000000;')
+      expect(html).to.contain(
+        ':root.hc-dark { --hc-accent: #26583f; --hc-footer-bg:#101010;--hc-footer-text:#e5e5e5; }'
+      )
+    })
+  })
+
+  it('falls back to the default dark footer when no dark footer color is set', () => {
+    page('light-footer').should(
+      'contain',
+      ':root.hc-dark { --hc-accent: #26583f; --hc-footer-bg:initial;--hc-footer-text:initial; }'
+    )
+  })
+
   it('lets an embedded article follow the widget instead of the site', () => {
     page('dark', '?embed=1').should('not.match', /<html[^>]*class="hc-dark"/)
     page('light', '?embed=1&theme=dark').should('match', /<html[^>]*class="hc-dark"/)
diff --git a/frontend/cypress/e2e/ui/helpCenterColorScheme.cy.js b/frontend/cypress/e2e/ui/helpCenterColorScheme.cy.js
index 035060f2..2d1a47fb 100644
--- a/frontend/cypress/e2e/ui/helpCenterColorScheme.cy.js
+++ b/frontend/cypress/e2e/ui/helpCenterColorScheme.cy.js
@@ -67,6 +67,7 @@ describe('Help center color scheme', () => {
       { color_scheme: 'system', color: LIGHT_COLOR, color_dark: DARK_COLOR },
       'docs'
     ).then((hc) => (created.docs = hc))
+    createHelpCenter('footer').then((hc) => (created.footer = hc))
   })
 
   beforeEach(() => {
@@ -147,6 +148,58 @@ describe('Help center color scheme', () => {
     })
   })
 
+  describe('footer colors', () => {
+    const openFooter = () => {
+      cy.visit(`${listPath}/${created.footer.id}/customize`)
+      cy.contains('[role="tab"]', 'Appearance').click()
+      cy.contains('button[aria-expanded]', 'Footer')
+        .click()
+        .should('have.attr', 'aria-expanded', 'true')
+      return cy.contains('button[aria-expanded]', 'Footer').parent()
+    }
+
+    it('edits footer colors per theme and saves both', () => {
+      cy.intercept('PUT', `**/api/v1/help-centers/${created.footer.id}`).as('update')
+      openFooter().within(() => {
+        cy.get('input[name="theme.footer.background_color"]').clear().type('#e3e3e3')
+        cy.get('input[name="theme.footer.text_color"]').clear().type('#000000')
+
+        cy.contains('[role="tab"]', 'Dark').click()
+        cy.get('input[name="theme.footer.background_color"]').should('not.exist')
+        cy.get('input[name="theme.footer.background_color_dark"]')
+          .should('have.value', '')
+          .type('#101010')
+        cy.get('input[name="theme.footer.text_color_dark"]')
+          .should('have.value', '')
+          .type('#e5e5e5')
+
+        cy.contains('[role="tab"]', 'Light').click()
+        cy.get('input[name="theme.footer.background_color"]').should('have.value', '#e3e3e3')
+      })
+      cy.get('iframe[title="Help center"]')
+        .should('have.attr', 'srcdoc')
+        .and('not.match', /<html[^>]*class="hc-dark"/)
+      cy.get('button[type="submit"]').click()
+      cy.wait('@update').its('response.statusCode').should('eq', 200)
+
+      cy.api('GET', `/api/v1/help-centers/${created.footer.id}`)
+        .its('body.data.theme.footer')
+        .should('include', {
+          background_color: '#e3e3e3',
+          text_color: '#000000',
+          background_color_dark: '#101010',
+          text_color_dark: '#e5e5e5'
+        })
+    })
+
+    it('shows the dark footer colors on a dark page', () => {
+      cy.visit(`/hc/${created.footer.slug}/en?theme=dark`)
+      cy.get('footer').should('have.css', 'background-color', 'rgb(16, 16, 16)')
+      cy.visit(`/hc/${created.footer.slug}/en?theme=light`)
+      cy.get('footer').should('have.css', 'background-color', 'rgb(227, 227, 227)')
+    })
+  })
+
   describe('public page', () => {
     it('keeps a light site light on a dark device, with no toggle', () => {
       visitAs(created.light, true)
diff --git a/internal/helpcenter/helpcenter.go b/internal/helpcenter/helpcenter.go
index 1843d032..9fff7c11 100644
--- a/internal/helpcenter/helpcenter.go
+++ b/internal/helpcenter/helpcenter.go
@@ -1643,6 +1643,8 @@ func normalizeTheme(raw json.RawMessage) (json.RawMessage, error) {
 	t.Header.TextColor = sanitizeHexColor(t.Header.TextColor)
 	t.Footer.BackgroundColor = sanitizeHexColor(t.Footer.BackgroundColor)
 	t.Footer.TextColor = sanitizeHexColor(t.Footer.TextColor)
+	t.Footer.BackgroundColorDark = sanitizeHexColor(t.Footer.BackgroundColorDark)
+	t.Footer.TextColorDark = sanitizeHexColor(t.Footer.TextColorDark)
 	t.Favicon = sanitizeAssetURL(t.Favicon)
 	t.FooterLinks = sanitizeNavLinks(t.FooterLinks)
 	t.SocialLinks = sanitizeSocialLinks(t.SocialLinks)
diff --git a/internal/helpcenter/models/models.go b/internal/helpcenter/models/models.go
index 0d158424..9fef50ef 100644
--- a/internal/helpcenter/models/models.go
+++ b/internal/helpcenter/models/models.go
@@ -93,9 +93,11 @@ type CardTheme struct {
 }
 
 type FooterTheme struct {
-	BackgroundColor string `json:"background_color"`
-	TextColor       string `json:"text_color"`
-	Tagline         string `json:"tagline"`
+	BackgroundColor     string `json:"background_color"`
+	TextColor           string `json:"text_color"`
+	BackgroundColorDark string `json:"background_color_dark"`
+	TextColorDark       string `json:"text_color_dark"`
+	Tagline             string `json:"tagline"`
 }
 
 type SocialLink struct {
diff --git a/internal/helpcenter/theme_test.go b/internal/helpcenter/theme_test.go
index e2193bd7..7d4662a6 100644
--- a/internal/helpcenter/theme_test.go
+++ b/internal/helpcenter/theme_test.go
@@ -94,7 +94,8 @@ func TestNormalizeThemeDropsUnsafeValues(t *testing.T) {
 		"header": {"background_type": "wat", "background_color": "notacolor"},
 		"layout": {"collections": "wat", "columns": 5},
 		"cards": {"icon_position": "wat"},
-		"announcement": {"text": "", "link_url": "https://example.com", "link_label": "Go"}
+		"announcement": {"text": "", "link_url": "https://example.com", "link_label": "Go"},
+		"footer": {"background_color_dark": "black", "text_color_dark": "#eeeeee"}
 	}`))
 	if err != nil {
 		t.Fatalf("normalizeTheme: %v", err)
@@ -118,6 +119,9 @@ func TestNormalizeThemeDropsUnsafeValues(t *testing.T) {
 	if got.Cards.IconPosition != cardIconPositions[0] {
 		t.Errorf("icon_position = %q, want %q", got.Cards.IconPosition, cardIconPositions[0])
 	}
+	if got.Footer.BackgroundColorDark != "" || got.Footer.TextColorDark != "#eeeeee" {
+		t.Errorf("footer = %+v, want the bad dark background dropped and the dark text kept", got.Footer)
+	}
 	if got.Announcement != (models.AnnouncementTheme{}) {
 		t.Errorf("announcement = %+v, want cleared when the text is empty", got.Announcement)
 	}

From 08e94076e7155170991fc8cc3c6246abb9f642a9 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 02:28:18 +0530
Subject: [PATCH 159/178] stop showing a spinner in the admin table search box
 while the list loads

---
 frontend/apps/main/src/components/datatable/DataTable.vue | 1 -
 1 file changed, 1 deletion(-)

diff --git a/frontend/apps/main/src/components/datatable/DataTable.vue b/frontend/apps/main/src/components/datatable/DataTable.vue
index a251c603..2332c95f 100644
--- a/frontend/apps/main/src/components/datatable/DataTable.vue
+++ b/frontend/apps/main/src/components/datatable/DataTable.vue
@@ -6,7 +6,6 @@
       class="max-w-xs"
       :placeholder="searchPlaceholder || t('globals.terms.search')"
       :clear-label="t('globals.messages.clearSearch')"
-      :loading="loading"
     />
 
     <div

From 1a422a5e63c52a9a3de7efb9cfd71ba89144ee64 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 02:40:32 +0530
Subject: [PATCH 160/178] use shadcn buttons and labels instead of hand-styled
 raw elements

---
 .../admin/help-center/ArticleEditSheet.vue    | 25 +++++++++++--------
 .../admin/inbox/PreChatFormConfig.vue         | 13 +++++-----
 .../src/features/search/SearchFilters.vue     | 11 +++++---
 .../src/features/search/SearchResults.vue     |  5 ++--
 frontend/shared-ui/components/SearchInput.vue | 11 +++++---
 5 files changed, 39 insertions(+), 26 deletions(-)

diff --git a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
index 5408530a..95f443e0 100644
--- a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
+++ b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
@@ -21,16 +21,18 @@
                 {{ t('globals.terms.lastUpdated') }}:
                 {{ formatDate(loadedArticle.updated_at) }}
               </SheetDescription>
-              <a
+              <Button
                 v-if="articleUrl"
+                as="a"
+                variant="link"
                 :href="articleUrl"
                 target="_blank"
                 rel="noopener"
-                class="flex items-center gap-1 text-sm text-muted-foreground underline underline-offset-4 can-hover:hover:text-foreground"
+                class="h-auto gap-1 p-0 font-normal"
               >
                 {{ t('helpCenter.viewArticle') }}
                 <ExternalLink class="size-3.5" aria-hidden="true" />
-              </a>
+              </Button>
             </div>
           </div>
         </div>
@@ -122,9 +124,10 @@
 
                 <div class="space-y-2">
                   <div v-for="locale in translatedLocales" :key="locale" class="flex gap-2">
-                    <button
+                    <Button
                       type="button"
-                      class="flex min-w-0 flex-1 items-center gap-3 rounded-md border bg-card px-3 py-2.5 text-left text-sm disabled:cursor-default can-hover:hover:bg-accent focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                      variant="outline"
+                      class="h-auto min-w-0 flex-1 justify-start gap-3 px-3 py-2.5 text-left font-normal disabled:opacity-100"
                       :class="{ 'font-medium': locale === loadedArticle.locale }"
                       :disabled="locale === loadedArticle.locale"
                       :aria-current="locale === loadedArticle.locale ? 'page' : undefined"
@@ -142,17 +145,19 @@
                         class="size-4 shrink-0 text-muted-foreground"
                         aria-hidden="true"
                       />
-                    </button>
+                    </Button>
                     <Tooltip v-if="translatedLocales.length > 1">
                       <TooltipTrigger as-child>
-                        <button
+                        <Button
                           type="button"
-                          class="shrink-0 rounded-md border bg-card px-2.5 text-muted-foreground can-hover:hover:bg-accent can-hover:hover:text-destructive focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring"
+                          variant="outline"
+                          size="icon"
+                          class="h-auto shrink-0 text-muted-foreground hover:text-destructive"
                           :aria-label="t('helpCenter.unlinkTranslation')"
                           @click="askUnlink(locale)"
                         >
-                          <Unlink class="size-4" aria-hidden="true" />
-                        </button>
+                          <Unlink aria-hidden="true" />
+                        </Button>
                       </TooltipTrigger>
                       <TooltipContent>
                         {{ t('helpCenter.unlinkTranslation') }}
diff --git a/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue b/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
index a59ac56a..bbaa1410 100644
--- a/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
+++ b/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
@@ -35,9 +35,9 @@
 
         <div v-if="audienceConfig.enabled" class="space-y-6">
           <div>
-            <label class="text-sm font-medium">
+            <Label>
               {{ $t('admin.inbox.livechat.prechatForm.title') }}
-            </label>
+            </Label>
             <Input
               type="text"
               v-model="audienceConfig.title"
@@ -101,7 +101,7 @@
                     <div v-if="field.enabled" class="space-y-4">
                       <div class="grid grid-cols-2 gap-4">
                         <div>
-                          <label class="text-sm font-medium">{{ $t('globals.terms.label') }}</label>
+                          <Label>{{ $t('globals.terms.label') }}</Label>
                           <Input
                             v-model="field.label"
                             :placeholder="$t('placeholders.fieldLabel')"
@@ -110,9 +110,9 @@
                         </div>
 
                         <div>
-                          <label class="text-sm font-medium">
+                          <Label>
                             {{ $t('globals.terms.placeholder') }}
-                          </label>
+                          </Label>
                           <Input
                             v-model="field.placeholder"
                             :placeholder="$t('placeholders.fieldPlaceholder')"
@@ -123,7 +123,7 @@
 
                       <div v-if="field.type !== 'checkbox'" class="flex items-center space-x-2">
                         <Checkbox v-model:checked="field.required" />
-                        <label class="text-sm">{{ $t('globals.terms.required') }}</label>
+                        <Label class="font-normal">{{ $t('globals.terms.required') }}</Label>
                       </div>
                     </div>
                   </div>
@@ -199,6 +199,7 @@ export const getDefaultPrechatFields = () => [
 <script setup>
 import { computed, onMounted, ref } from 'vue'
 import { Input } from '@shared-ui/components/ui/input'
+import { Label } from '@shared-ui/components/ui/label'
 import { Button } from '@shared-ui/components/ui/button'
 import { Switch } from '@shared-ui/components/ui/switch'
 import SwitchField from '@shared-ui/components/SwitchField.vue'
diff --git a/frontend/apps/main/src/features/search/SearchFilters.vue b/frontend/apps/main/src/features/search/SearchFilters.vue
index f20907e2..574fbf02 100644
--- a/frontend/apps/main/src/features/search/SearchFilters.vue
+++ b/frontend/apps/main/src/features/search/SearchFilters.vue
@@ -60,17 +60,19 @@
     </div>
 
     <div v-if="selectedTags.length" class="flex flex-wrap gap-1.5">
-      <button
+      <Button
         v-for="tag in selectedTags"
         :key="tag.value"
         type="button"
-        class="inline-flex min-h-7 max-w-full items-center gap-1 rounded-md bg-secondary px-2 text-sm text-secondary-foreground hover:bg-accent focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring"
+        variant="secondary"
+        size="xs"
+        class="max-w-full gap-1 font-normal"
         :aria-label="`${t('globals.terms.remove')} ${tag.label}`"
         @click="removeTag(tag.value)"
       >
         <span class="truncate">{{ tag.label }}</span>
-        <X class="h-3.5 w-3.5 shrink-0" aria-hidden="true" />
-      </button>
+        <X aria-hidden="true" />
+      </Button>
     </div>
   </div>
 </template>
@@ -78,6 +80,7 @@
 <script setup>
 import { computed, onMounted } from 'vue'
 import { X } from 'lucide-vue-next'
+import { Button } from '@shared-ui/components/ui/button'
 import { useI18n } from 'vue-i18n'
 import SelectComboBox from '@main/components/combobox/SelectCombobox.vue'
 import SelectAgentCombobox from '@main/components/combobox/SelectAgentCombobox.vue'
diff --git a/frontend/apps/main/src/features/search/SearchResults.vue b/frontend/apps/main/src/features/search/SearchResults.vue
index 58e202fd..c800b136 100644
--- a/frontend/apps/main/src/features/search/SearchResults.vue
+++ b/frontend/apps/main/src/features/search/SearchResults.vue
@@ -22,9 +22,9 @@
           {{ t('globals.messages.clearFilters') }}
         </Button>
         <div class="ml-auto flex items-center gap-2">
-          <label for="search-sort" class="text-sm text-muted-foreground">
+          <Label for="search-sort" class="font-normal text-muted-foreground">
             {{ t('globals.messages.sortBy') }}
-          </label>
+          </Label>
           <Select
             :model-value="sorts[activeTab]"
             @update:model-value="emit('changeSort', { type: activeTab, sort: $event })"
@@ -82,6 +82,7 @@
 import { X } from 'lucide-vue-next'
 import { useI18n } from 'vue-i18n'
 import { Button } from '@shared-ui/components/ui/button'
+import { Label } from '@shared-ui/components/ui/label'
 import {
   Select,
   SelectContent,
diff --git a/frontend/shared-ui/components/SearchInput.vue b/frontend/shared-ui/components/SearchInput.vue
index 94039297..9d790cae 100644
--- a/frontend/shared-ui/components/SearchInput.vue
+++ b/frontend/shared-ui/components/SearchInput.vue
@@ -22,15 +22,17 @@
       @update:model-value="emit('update:modelValue', $event)"
     />
     <slot name="trailing" />
-    <button
+    <Button
       v-if="modelValue"
       type="button"
+      variant="ghost"
+      size="icon"
       :aria-label="clearLabel"
-      class="absolute right-2 top-1/2 -translate-y-1/2 p-1.5 rounded-md text-muted-foreground hover:text-foreground hover:bg-accent"
+      class="absolute right-2 top-1/2 size-7 -translate-y-1/2 text-muted-foreground"
       @click="clear"
     >
-      <X class="size-4" aria-hidden="true" />
-    </button>
+      <X aria-hidden="true" />
+    </Button>
   </div>
 </template>
 
@@ -38,6 +40,7 @@
 import { ref } from 'vue'
 import { Search, X } from 'lucide-vue-next'
 import { Input } from '@shared-ui/components/ui/input'
+import { Button } from '@shared-ui/components/ui/button'
 import { Spinner } from '@shared-ui/components/ui/spinner'
 
 defineProps({

From f8c684e8ca64597c832ff42307358fe9e1364eda Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 02:58:39 +0530
Subject: [PATCH 161/178] add tests for set and not set on missing contact
 attributes

---
 internal/automation/evaluator_test.go | 47 +++++++++++++++++++++++++++
 1 file changed, 47 insertions(+)

diff --git a/internal/automation/evaluator_test.go b/internal/automation/evaluator_test.go
index 1ed15922..bb5b1a19 100644
--- a/internal/automation/evaluator_test.go
+++ b/internal/automation/evaluator_test.go
@@ -468,6 +468,53 @@ func TestCustomAttributes_MissingField(t *testing.T) {
 	assert.Equal(t, 0, mockStore.callCount, "Missing custom attribute should fail the rule")
 }
 
+func TestCustomAttributes_SetNotSet(t *testing.T) {
+	tests := []struct {
+		name      string
+		attrs     json.RawMessage
+		operator  string
+		wantMatch bool
+	}{
+		{"missing field is not set", json.RawMessage(`{"client_id":"YYYYYY"}`), models.RuleOperatorNotSet, true},
+		{"missing field is not set", json.RawMessage(`{"client_id":"YYYYYY"}`), models.RuleOperatorSet, false},
+		{"empty value is not set", json.RawMessage(`{"plan":""}`), models.RuleOperatorNotSet, true},
+		{"empty value is not set", json.RawMessage(`{"plan":""}`), models.RuleOperatorSet, false},
+		{"contact with no attributes saved", nil, models.RuleOperatorNotSet, true},
+		{"contact with no attributes saved", nil, models.RuleOperatorSet, false},
+		{"filled value is set", json.RawMessage(`{"plan":"pro"}`), models.RuleOperatorNotSet, false},
+		{"filled value is set", json.RawMessage(`{"plan":"pro"}`), models.RuleOperatorSet, true},
+	}
+	for _, tt := range tests {
+		t.Run(tt.name+"/"+tt.operator, func(t *testing.T) {
+			mockStore := new(mockConversationStore)
+			mockStore.On("ApplyAction", mock.Anything, mock.Anything, mock.Anything).Return(nil)
+			engine := createTestEngine(mockStore)
+			conversation := createTestConversation(func(c *cmodels.Conversation) {
+				c.Contact.CustomAttributes = tt.attrs
+			})
+			rules := []models.Rule{
+				{
+					Groups: []models.RuleGroup{
+						{
+							LogicalOp: models.OperatorAnd,
+							Rules: []models.RuleDetail{
+								{Field: "plan", Operator: tt.operator, FieldType: models.FieldTypeContactCustomAttribute},
+							},
+						},
+					},
+					Actions:       []models.RuleAction{{Type: models.ActionSetStatus, Value: []string{"2"}}},
+					GroupOperator: models.OperatorAnd,
+					ExecutionMode: models.ExecutionModeAll,
+				},
+			}
+
+			engine.evalConversationRules(rules, conversation, nil)
+
+			assert.Equal(t, tt.wantMatch, mockStore.callCount == 1)
+		})
+	}
+}
+
 // Test: Contains operator with multiple values
 func TestContainsOperator_MultipleValues(t *testing.T) {
 	mockStore := new(mockConversationStore)

From 8068c28cb27d4db2b952a21106c5049e8bc65ce0 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 03:28:20 +0530
Subject: [PATCH 162/178] simplify new i18n keys

---
 .../admin/help-center/ArticleEditSheet.vue    |  8 +---
 .../admin/help-center/HelpCenterForm.vue      |  2 +-
 .../admin/inbox/LivechatInboxForm.vue         | 12 +++---
 .../features/admin/inbox/WidgetCampaigns.vue  | 22 ++++++----
 .../features/admin/inbox/WidgetConditions.vue |  2 +-
 .../features/admin/inbox/WidgetHelpConfig.vue |  8 ++--
 .../src/features/conversation/ReplyBox.vue    |  2 +-
 .../conversation/sidebar/CopilotPanel.vue     |  2 +-
 .../apps/main/src/views/search/SearchView.vue |  5 ---
 frontend/apps/widget/src/views/HelpView.vue   |  9 ++--
 i18n/en-US.json                               | 41 ++++++++-----------
 .../web-templates/help/shared/partials.html   |  4 +-
 12 files changed, 58 insertions(+), 59 deletions(-)

diff --git a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
index 95f443e0..ff3a581d 100644
--- a/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
+++ b/frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue
@@ -30,7 +30,7 @@
                 rel="noopener"
                 class="h-auto gap-1 p-0 font-normal"
               >
-                {{ t('helpCenter.viewArticle') }}
+                {{ t('globals.messages.viewArticle') }}
                 <ExternalLink class="size-3.5" aria-hidden="true" />
               </Button>
             </div>
@@ -859,11 +859,7 @@ const confirmUnlink = async () => {
 const selectTranslationLocale = (locale) => {
   if (form.meta.value.dirty) {
     emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
-      description: t(
-        translationByLocale.value.has(locale)
-          ? 'helpCenter.saveBeforeSwitchingTranslation'
-          : 'helpCenter.saveBeforeTranslation'
-      )
+      description: t('helpCenter.saveBeforeSwitchingTranslation')
     })
     return
   }
diff --git a/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue b/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue
index 213baf65..6d031f36 100644
--- a/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue
+++ b/frontend/apps/main/src/features/admin/help-center/HelpCenterForm.vue
@@ -42,7 +42,7 @@
 
           <FormField v-slot="{ componentField }" name="livechat_inbox_id">
             <FormItem>
-              <FormLabel>{{ t('helpCenter.livechatInbox') }}</FormLabel>
+              <FormLabel>{{ t('globals.terms.liveChatInbox') }}</FormLabel>
               <FormControl>
                 <Select v-bind="componentField">
                   <SelectTrigger>
diff --git a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
index 502fd0fa..0cf84478 100644
--- a/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
+++ b/frontend/apps/main/src/features/admin/inbox/LivechatInboxForm.vue
@@ -475,7 +475,7 @@
               </AccordionContent>
             </AccordionItem>
             <AccordionItem value="launcher" data-section="launcher">
-              <AccordionTrigger class="text-base">{{ $t('admin.inbox.livechat.launcher.layout') }}</AccordionTrigger>
+              <AccordionTrigger class="text-base">{{ $t('admin.inbox.livechat.launcher') }}</AccordionTrigger>
               <AccordionContent force-mount class="space-y-8 pt-2">
                 <div class="space-y-4">
                   <Tabs :model-value="editingTheme" @update:model-value="editingTheme = $event">
@@ -550,7 +550,7 @@
                   <div class="grid grid-cols-3 gap-4">
                     <FormField v-slot="{ componentField }" name="config.launcher.icon_scale">
                       <FormItem>
-                        <FormLabel>{{ $t('admin.inbox.livechat.launcher.iconScale') }}</FormLabel>
+                        <FormLabel>{{ $t('globals.terms.iconSize') }}</FormLabel>
                         <FormControl>
                           <Input
                             type="number"
@@ -859,7 +859,9 @@
               </AccordionContent>
             </AccordionItem>
             <AccordionItem value="campaigns" data-section="campaigns">
-              <AccordionTrigger class="text-base">{{ $t('widget.proactiveMessages') }}</AccordionTrigger>
+              <AccordionTrigger class="text-base">
+                {{ $t('globals.terms.proactiveMessage', 2) }}
+              </AccordionTrigger>
               <AccordionContent force-mount class="space-y-8 pt-2">
                 <WidgetCampaigns
                   ref="campaignsRef"
@@ -1020,7 +1022,7 @@
 
                       <FormField v-slot="{ componentField }" name="config.visitors.quick_replies">
                         <FormItem>
-                          <FormLabel>{{ $t('admin.inbox.livechat.quickReplies') }}</FormLabel>
+                          <FormLabel>{{ $t('globals.terms.quickReply', 2) }}</FormLabel>
                           <FormControl>
                             <Textarea
                               v-bind="componentField"
@@ -1119,7 +1121,7 @@
 
                       <FormField v-slot="{ componentField }" name="config.users.quick_replies">
                         <FormItem>
-                          <FormLabel>{{ $t('admin.inbox.livechat.quickReplies') }}</FormLabel>
+                          <FormLabel>{{ $t('globals.terms.quickReply', 2) }}</FormLabel>
                           <FormControl>
                             <Textarea
                               v-bind="componentField"
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
index c94dd7f2..b9fc35e6 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
@@ -60,10 +60,16 @@ import {
 
 const MAX_CAMPAIGNS = 50
 const STAT_KEYS = ['displayed', 'opened', 'dismissed', 'replied']
+const STAT_TRANSLATION_KEYS = {
+  displayed: 'globals.terms.displayed',
+  opened: 'globals.terms.opened',
+  dismissed: 'globals.terms.dismissed',
+  replied: 'globals.terms.replied'
+}
 const AUDIENCE_TRANSLATION_KEYS = {
-  all: 'widget.campaign.all',
+  all: 'globals.terms.everyone',
   visitors: 'admin.inbox.livechat.userSettings.visitors',
-  users: 'widget.campaign.users'
+  users: 'globals.terms.signedInUser'
 }
 const SELECT_FIELDS = [
   {
@@ -122,7 +128,7 @@ const cooldownError = computed(() => {
   return isGoDuration(props.cooldown) ? '' : t('validation.invalidDuration')
 })
 
-const audienceLabel = (item) => t(AUDIENCE_TRANSLATION_KEYS[item.audience])
+const audienceLabel = (audience) => t(AUDIENCE_TRANSLATION_KEYS[audience], 2)
 
 const pagesLabel = (item) =>
   item.include_urls.filter(Boolean).length
@@ -307,7 +313,9 @@ onMounted(async () => {
       </div>
 
       <div class="space-y-4">
-        <h4 class="text-base font-semibold text-foreground">{{ t('widget.proactiveMessages') }}</h4>
+        <h4 class="text-base font-semibold text-foreground">
+          {{ t('globals.terms.proactiveMessage', 2) }}
+        </h4>
         <p v-if="modelValue.length > 1" class="text-sm text-muted-foreground">
           {{ t('widget.campaignPriorityHint') }}
         </p>
@@ -356,7 +364,7 @@ onMounted(async () => {
                     </Badge>
                   </div>
                   <p class="text-xs text-muted-foreground truncate mt-0.5">
-                    {{ audienceLabel(item) }} · {{ pagesLabel(item) }}
+                    {{ audienceLabel(item.audience) }} · {{ pagesLabel(item) }}
                   </p>
                 </div>
                 <ChevronRight class="size-4 text-muted-foreground shrink-0" />
@@ -408,7 +416,7 @@ onMounted(async () => {
               <TableRow>
                 <TableHead>{{ t('globals.terms.name') }}</TableHead>
                 <TableHead v-for="key in STAT_KEYS" :key="key" class="text-right">
-                  {{ t(`widget.campaign.${key}`) }}
+                  {{ t(STAT_TRANSLATION_KEYS[key]) }}
                 </TableHead>
               </TableRow>
             </TableHeader>
@@ -532,7 +540,7 @@ onMounted(async () => {
               <SelectTrigger :id="`campaign-${field.key}`"><SelectValue /></SelectTrigger>
               <SelectContent>
                 <SelectItem v-for="value in field.values" :key="value" :value="value">
-                  {{ t(AUDIENCE_TRANSLATION_KEYS[value]) }}
+                  {{ audienceLabel(value) }}
                 </SelectItem>
               </SelectContent>
             </Select>
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue b/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue
index e4aba97a..2c8b52f3 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetConditions.vue
@@ -73,7 +73,7 @@ onMounted(async () => {
       :to="{ name: 'custom-attributes' }"
       :class="buttonVariants({ variant: 'link', size: 'sm' })"
     >
-      {{ t('widget.addContactCustomAttribute') }}
+      {{ t('globals.messages.addContactCustomAttribute') }}
     </RouterLink>
   </div>
 </template>
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
index 7ca19bde..59f25be9 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
@@ -79,7 +79,7 @@ const unusedArticles = computed(() =>
     </div>
 
     <p v-if="failed" role="alert" class="text-sm text-destructive">
-      {{ t('widget.helpLoadError') }}
+      {{ t('globals.messages.helpLoadError') }}
     </p>
 
     <template v-if="modelValue.help_center_id">
@@ -108,7 +108,9 @@ const unusedArticles = computed(() =>
       </div>
 
       <div data-featured-articles class="space-y-4">
-        <h4 class="text-base font-semibold text-foreground">{{ t('widget.featuredArticles') }}</h4>
+        <h4 class="text-base font-semibold text-foreground">
+          {{ t('globals.terms.featuredArticle', 2) }}
+        </h4>
         <p class="text-sm text-muted-foreground">{{ t('widget.featuredArticlesHint') }}</p>
 
         <Draggable
@@ -132,7 +134,7 @@ const unusedArticles = computed(() =>
                 class="flex-1 min-w-0 text-sm break-words"
                 :class="{ 'text-muted-foreground': !item.title }"
               >
-                {{ item.title || t('widget.articleUnavailable') }}
+                {{ item.title || t('globals.messages.articleUnavailable') }}
               </span>
               <Button
                 type="button"
diff --git a/frontend/apps/main/src/features/conversation/ReplyBox.vue b/frontend/apps/main/src/features/conversation/ReplyBox.vue
index 5921fa35..a99489ae 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBox.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBox.vue
@@ -16,7 +16,7 @@
           :disabled="isGenerating"
           @click="resolveGenerateToolApproval(false)"
         >
-          {{ $t('globals.messages.decline') }}
+          {{ $t('globals.messages.reject') }}
         </Button>
         <Button type="button" :disabled="isGenerating" @click="resolveGenerateToolApproval(true)">
           {{ $t('globals.messages.approveAndRun') }}
diff --git a/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue b/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
index 314eb13b..0ec0a2f4 100644
--- a/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
+++ b/frontend/apps/main/src/features/conversation/sidebar/CopilotPanel.vue
@@ -97,7 +97,7 @@
                 :disabled="isThinking"
                 @click="resolveToolApproval(msg.approval, false)"
               >
-                {{ $t('globals.messages.decline') }}
+                {{ $t('globals.messages.reject') }}
               </Button>
               <Button
                 type="button"
diff --git a/frontend/apps/main/src/views/search/SearchView.vue b/frontend/apps/main/src/views/search/SearchView.vue
index e7307e4f..e2536599 100644
--- a/frontend/apps/main/src/views/search/SearchView.vue
+++ b/frontend/apps/main/src/views/search/SearchView.vue
@@ -39,10 +39,6 @@
         >
           {{ $t('search.minQueryLength', { length: MIN_SEARCH_LENGTH }) }}
         </p>
-        <div v-else class="py-16 text-center text-muted-foreground">
-          <SearchIcon class="w-8 h-8 mx-auto mb-2 opacity-60" aria-hidden="true" />
-          <p class="text-sm">{{ $t('globals.messages.resultsAppearHere') }}</p>
-        </div>
       </div>
     </div>
   </div>
@@ -52,7 +48,6 @@
 import { ref, computed, watch, onMounted, onBeforeUnmount } from 'vue'
 import { useRoute, useRouter } from 'vue-router'
 import { handleHTTPError } from '@shared-ui/utils/http.js'
-import { Search as SearchIcon } from 'lucide-vue-next'
 import { Button } from '@shared-ui/components/ui/button'
 import SearchInput from '@shared-ui/components/SearchInput.vue'
 import SearchHeader from '@main/features/search/SearchHeader.vue'
diff --git a/frontend/apps/widget/src/views/HelpView.vue b/frontend/apps/widget/src/views/HelpView.vue
index a380ed17..834941cb 100644
--- a/frontend/apps/widget/src/views/HelpView.vue
+++ b/frontend/apps/widget/src/views/HelpView.vue
@@ -68,7 +68,8 @@ const search = async () => {
     if (!valid(identity) || help.query.trim() !== query) return
     help.results = response.data.data || []
   } catch {
-    if (valid(identity) && help.query.trim() === query) error.value = t('widget.helpLoadError')
+    if (valid(identity) && help.query.trim() === query)
+      error.value = t('globals.messages.helpLoadError')
   } finally {
     searching.value = false
   }
@@ -91,7 +92,7 @@ const openArticle = async ({ id, slug, locale: articleLocale }) => {
     await nextTick()
     backButton.value?.$el?.focus()
   } catch {
-    if (valid(identity)) error.value = t('widget.helpLoadError')
+    if (valid(identity)) error.value = t('globals.messages.helpLoadError')
   } finally {
     busy.value = false
   }
@@ -183,7 +184,7 @@ onMounted(async () => {
         <Spinner size="md" absolute />
       </div>
       <div v-if="error || help.failed" role="alert" class="p-4 text-sm">
-        <p>{{ error || t('widget.helpLoadError') }}</p>
+        <p>{{ error || t('globals.messages.helpLoadError') }}</p>
         <Button type="button" variant="outline" class="mt-2" @click="retry">{{
           t('globals.terms.tryAgain')
         }}</Button>
@@ -223,7 +224,7 @@ onMounted(async () => {
           >
             <FileQuestionMark class="w-10 h-10 text-muted-foreground mb-4" aria-hidden="true" />
             <p class="text-sm text-muted-foreground">
-              {{ t('widget.noResultsFor', { query: help.query.trim() }) }}
+              {{ t('globals.messages.noResultsFor', { query: help.query.trim() }) }}
             </p>
             <StartConversationButton class="mt-4" />
           </div>
diff --git a/i18n/en-US.json b/i18n/en-US.json
index 65bce407..52924ec4 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -374,7 +374,6 @@
   "admin.inbox.livechat.language.auto": "Auto-detect (browser language)",
   "admin.inbox.livechat.launcher": "Launcher",
   "admin.inbox.livechat.launcher.color": "Launcher color",
-  "admin.inbox.livechat.launcher.layout": "Launcher position",
   "admin.inbox.livechat.launcher.logo": "Launcher logo",
   "admin.inbox.livechat.launcher.position": "Position",
   "admin.inbox.livechat.launcher.position.left": "Left",
@@ -382,7 +381,6 @@
   "admin.inbox.livechat.launcher.spacing.bottom": "Bottom spacing",
   "admin.inbox.livechat.launcher.spacing.bottom.description": "Distance from the bottom of the screen in pixels",
   "admin.inbox.livechat.launcher.spacing.side": "Side spacing",
-  "admin.inbox.livechat.launcher.iconScale": "Icon size",
   "admin.inbox.livechat.launcher.iconScale.description": "How much of the launcher the logo fills, as a percentage. Lower it to inset a logo that has no padding of its own.",
   "admin.inbox.livechat.launcher.spacing.side.description": "Distance from the side of the screen in pixels",
   "admin.inbox.livechat.noticeBanner": "Notice banner",
@@ -405,7 +403,6 @@
   "admin.inbox.livechat.preventReplyToClosedConversation.description": "When enabled, users cannot reply to closed conversations",
   "admin.inbox.livechat.preview.sampleAgentReply": "Happy to help, could you share a few details?",
   "admin.inbox.livechat.preview.sampleUserMessage": "Hi! How do I get started?",
-  "admin.inbox.livechat.quickReplies": "Quick replies",
   "admin.inbox.livechat.quickReplies.description": "One reply per line, up to 6. Shown when someone starts a new conversation.",
   "admin.inbox.livechat.quickReplies.limit": "Add up to 6 quick replies.",
   "admin.inbox.livechat.quickReplies.placeholder": "I have a question about billing\nHow do I reset my password?",
@@ -847,6 +844,7 @@
   "filter.toggleConnector": "Click to switch between and / or",
   "globals.messages.add": "Add",
   "globals.messages.addAnnouncement": "Add announcement",
+  "globals.messages.addContactCustomAttribute": "Add contact custom attribute",
   "globals.messages.addEmoji": "Add emoji",
   "globals.messages.addExternalLink": "Add external link",
   "globals.messages.additionalFeedback": "Additional feedback (optional)",
@@ -854,6 +852,7 @@
   "globals.messages.apply": "Apply",
   "globals.messages.approveAndRun": "Approve and run",
   "globals.messages.areYouAbsolutelySure": "Are you absolutely sure?",
+  "globals.messages.articleUnavailable": "Article unavailable",
   "globals.messages.attachFile": "Attach file",
   "globals.messages.back": "Back",
   "globals.messages.backOnDayAt": "on {day} at {time}",
@@ -874,6 +873,7 @@
   "globals.messages.closeChat": "Close chat",
   "globals.messages.openChat": "Open chat",
   "globals.messages.openConversation": "Open conversation",
+  "globals.messages.openInHelpCenter": "Open in help center",
   "globals.messages.connected": "Connected",
   "globals.messages.connecting": "Connecting...",
   "globals.messages.connectionFailedRefresh": "Connection failed. Please refresh.",
@@ -887,7 +887,6 @@
   "globals.messages.delete": "Delete",
   "globals.messages.deleteAll": "Delete all",
   "globals.messages.deletedSuccessfully": "Deleted successfully",
-  "globals.messages.decline": "Decline",
   "globals.messages.disable": "Disable",
   "globals.messages.edit": "Edit",
   "globals.messages.empty": "{name} empty",
@@ -905,6 +904,7 @@
   "globals.messages.gradientEnd": "Gradient end",
   "globals.messages.gradientStart": "Gradient start",
   "globals.messages.headerTextColor": "Header text color",
+  "globals.messages.helpLoadError": "Help could not be loaded. Try again or send us a message.",
   "globals.messages.hoursSinceCreated": "Hours since created",
   "globals.messages.hoursSinceFirstReply": "Hours since first reply",
   "globals.messages.hoursSinceLastReply": "Hours since last reply",
@@ -930,6 +930,7 @@
   "globals.messages.no": "No",
   "globals.messages.noInternetConnection": "No internet connection",
   "globals.messages.noMessagesYet": "No messages yet",
+  "globals.messages.noResultsFor": "No results for “{query}”",
   "globals.messages.noResultsFound": "No results found",
   "globals.messages.notAllowed": "Not allowed",
   "globals.messages.notFound": "Not found",
@@ -949,7 +950,6 @@
   "globals.messages.required": "{name} Required",
   "globals.messages.reset": "Reset",
   "globals.messages.resetToDefault": "Reset to default",
-  "globals.messages.resultsAppearHere": "Results will appear here.",
   "globals.messages.revoke": "Revoke",
   "globals.messages.save": "Save",
   "globals.messages.saveChanges": "Save changes",
@@ -974,6 +974,7 @@
   "globals.messages.submitting": "Submitting...",
   "globals.messages.thankYou": "Thank you!",
   "globals.messages.thankYouFeedback": "✅ Thank you for your feedback!",
+  "globals.messages.toggleTheme": "Toggle theme",
   "globals.messages.tooManyRequests": "Too many requests.",
   "globals.messages.true": "True",
   "globals.messages.unblock": "Unblock",
@@ -981,6 +982,7 @@
   "globals.messages.update": "Update",
   "globals.messages.upload": "Upload",
   "globals.messages.uploading": "Uploading",
+  "globals.messages.viewArticle": "View article",
   "globals.messages.visibleWhen": "Visible when",
   "globals.messages.welcomeToLibredesk": "Welcome to Libredesk",
   "globals.messages.wellBeBack": "We'll be back {when}",
@@ -1045,6 +1047,7 @@
   "globals.terms.countryCode": "Country code",
   "globals.terms.createdAt": "Created at",
   "globals.terms.question": "Question",
+  "globals.terms.quickReply": "Quick reply | Quick replies",
   "globals.terms.answer": "Answer",
   "globals.terms.createdOn": "Created on",
   "globals.terms.csatFeedback": "CSAT feedback",
@@ -1065,6 +1068,8 @@
   "globals.terms.descending": "Descending",
   "globals.terms.description": "Description | Descriptions",
   "globals.terms.disabled": "Disabled",
+  "globals.terms.dismissed": "Dismissed",
+  "globals.terms.displayed": "Displayed",
   "globals.terms.download": "Download",
   "globals.terms.downloadedAt": "Downloaded at",
   "globals.terms.draft": "Draft",
@@ -1072,9 +1077,11 @@
   "globals.terms.enabled": "Enabled",
   "globals.terms.error": "Error | Errors",
   "globals.terms.event": "Event | Events",
+  "globals.terms.everyone": "Everyone",
   "globals.terms.excellent": "Excellent",
   "globals.terms.expand": "Expand",
   "globals.terms.fair": "Fair",
+  "globals.terms.featuredArticle": "Featured article | Featured articles",
   "globals.terms.features": "Features",
   "globals.terms.feedback": "Feedback | Feedbacks",
   "globals.terms.file": "File | Files",
@@ -1100,6 +1107,7 @@
   "globals.terms.host": "Host | Hosts",
   "globals.terms.hour": "Hour | Hours",
   "globals.terms.icon": "Icon | Icons",
+  "globals.terms.iconSize": "Icon size",
   "globals.terms.image": "Image | Images",
   "globals.terms.inApp": "In-app",
   "globals.terms.import": "Import | Imports",
@@ -1125,6 +1133,7 @@
   "globals.terms.link": "Link | Links",
   "globals.terms.listValues": "List values",
   "globals.terms.liveChat": "Live Chat",
+  "globals.terms.liveChatInbox": "Live chat inbox | Live chat inboxes",
   "globals.terms.loadMore": "Load more",
   "globals.terms.loading": "Loading...",
   "globals.terms.log": "Log | Logs",
@@ -1145,6 +1154,7 @@
   "globals.terms.offline": "Offline | Offline",
   "globals.terms.online": "Online | Online",
   "globals.terms.open": "Open",
+  "globals.terms.opened": "Opened",
   "globals.terms.openMenu": "Open menu",
   "globals.terms.optional": "Optional | Optionals",
   "globals.terms.original": "Original",
@@ -1164,6 +1174,7 @@
   "globals.terms.primaryColor": "Primary color | Primary colors",
   "globals.terms.priority": "Priority | Priorities",
   "globals.terms.privateNote": "Private note | Private notes",
+  "globals.terms.proactiveMessage": "Proactive message | Proactive messages",
   "globals.terms.productivity": "Productivity",
   "globals.terms.profile": "Profile | Profiles",
   "globals.terms.provider": "Provider | Providers",
@@ -1177,6 +1188,7 @@
   "globals.terms.regexHint": "Regex hint",
   "globals.terms.remove": "Remove",
   "globals.terms.reopen": "Reopen",
+  "globals.terms.replied": "Replied",
   "globals.terms.reply": "Reply | Replies",
   "globals.terms.report": "Report | Reports",
   "globals.terms.required": "Required",
@@ -1195,6 +1207,7 @@
   "globals.terms.sent": "Sent",
   "globals.terms.setPassword": "Set password | Set passwords",
   "globals.terms.sharedView": "Shared view | Shared views",
+  "globals.terms.signedInUser": "Signed-in user | Signed-in users",
   "globals.terms.sla": "SLA | SLAs",
   "globals.terms.slaMetric": "SLA metric | SLA metrics",
   "globals.terms.slaPolicy": "SLA policy | SLA policies",
@@ -1259,9 +1272,7 @@
   "helpCenter.aiEnabledHint": "Takes effect only when the article is published. Enable it in one language only, not in every translation.",
   "helpCenter.addTranslation": "Add translation",
   "helpCenter.translationOf": "Translation of “{title}”",
-  "helpCenter.toggleTheme": "Toggle theme",
   "helpCenter.saveBeforeSwitchingTranslation": "Unsaved changes would be lost. Save the article before switching languages.",
-  "helpCenter.saveBeforeTranslation": "Unsaved changes would be lost. Save the article before adding a translation.",
   "helpCenter.customCSS": "Custom CSS",
   "helpCenter.preview.sampleArticleTitle": "Sample article",
   "helpCenter.preview.sampleCollection": "Sample collection",
@@ -1319,7 +1330,6 @@
   "helpCenter.skipToContent": "Skip to main content",
   "helpCenter.resultsCount": "{count} result | {count} results",
   "helpCenter.supportedLanguages": "Supported languages",
-  "helpCenter.viewArticle": "View article",
   "helpCenter.visitSite": "Visit site",
   "helpCenter.supportedLanguagesHint": "Add a language before authoring articles in it.",
   "helpCenter.translationsHint": "Write or link this article in other languages here. Readers who switch language land on the linked version, instead of the help center home page.",
@@ -1404,7 +1414,6 @@
   "helpCenter.customDomain": "Custom domain (optional)",
   "helpCenter.customDomainHint": "Serve this help center on its own domain instead of the app URL. Point the domain at Libredesk in your DNS and reverse proxy first.",
   "helpCenter.invalidLivechatInbox": "Select a live chat inbox.",
-  "helpCenter.livechatInbox": "Live chat inbox",
   "helpCenter.livechatInboxHint": "Shows the chat widget for this inbox on every help center page.",
   "helpCenter.invalidCustomDomain": "Enter the domain's root URL starting with https://, with no path or trailing slash, e.g. https://help.example.com.",
   "imageLightbox.next": "Next image",
@@ -1672,32 +1681,24 @@
   "webhook.sendTest": "Send test",
   "webhook.sentSuccessfully": "Webhook sent successfully",
   "widget.addCampaign": "Add proactive message",
-  "widget.addContactCustomAttribute": "Add contact custom attribute",
   "widget.addHelpHomeApp": "Add help articles",
-  "widget.articleUnavailable": "Article unavailable",
   "widget.backToCampaigns": "Back to proactive messages",
   "widget.brandBot": "Brand bot",
-  "widget.campaign.all": "Everyone",
   "widget.campaign.any": "Any time",
   "widget.campaign.business_hours": "Business hours rule",
   "widget.campaign.delay_seconds": "Active time on page (seconds)",
-  "widget.campaign.dismissed": "Dismissed",
-  "widget.campaign.displayed": "Displayed",
   "widget.campaign.event": "Optional event name",
   "widget.campaign.exclude_urls": "Exclude pages",
   "widget.campaign.include_urls": "Include pages",
   "widget.campaign.inside": "During business hours",
   "widget.campaign.interval": "After an interval",
   "widget.campaign.once": "Once per person",
-  "widget.campaign.opened": "Opened",
   "widget.campaign.outside": "Outside business hours",
   "widget.campaign.repeat": "Show again",
   "widget.campaign.repeat_hours": "Repeat after (hours)",
-  "widget.campaign.replied": "Replied",
   "widget.campaign.section.audience": "Who sees it",
   "widget.campaign.section.placement": "Where and when",
   "widget.campaign.session": "Once per session",
-  "widget.campaign.users": "Signed-in users",
   "widget.campaignContactAttributesEmpty": "Visibility conditions use contact custom attributes. None are available.",
   "widget.campaignCooldown": "Minimum time between proactive messages",
   "widget.campaignDeviceRequired": "Select at least one device. This proactive message cannot appear until desktop or mobile is enabled.",
@@ -1711,20 +1712,15 @@
   "widget.conversationNotPermitted": "You cannot access this conversation. Sign in with the account that started it.",
   "widget.deletedCampaign": "Deleted message",
   "widget.dismissPreviews": "Dismiss all previews",
-  "widget.featuredArticles": "Featured articles",
   "widget.featuredArticlesHint": "Choose up to 10 articles. Leave empty to show popular articles.",
-  "widget.helpFeedbackError": "Feedback could not be saved. Try again.",
   "widget.helpHomeAppHint": "Shows a search button and the featured articles set under Help center.",
   "widget.helpHomeAppRequiresCenter": "Choose a help center under Help center before adding this card.",
-  "widget.helpLoadError": "Help could not be loaded. Try again or send us a message.",
   "widget.helpOnHomeHint": "To show help on the Home screen, add the help articles card under Home screen apps.",
   "widget.helpPlacement": "Where help appears",
   "widget.invitationExpired": "This invitation is no longer available. Start a new chat to contact us.",
   "widget.ipBlocked": "Access denied",
   "widget.newCampaign": "New proactive message",
-  "widget.openInHelpCenter": "Open in help center",
   "widget.noArticles": "No published articles yet.",
-  "widget.noResultsFor": "No results for “{query}”",
   "widget.prechatForm.startChat": "Start chat",
   "widget.prechatForm.continueToHuman": "Continue to a human",
   "conversation.sidebarCounts.all": "{count} open conversation in all | {count} open conversations in all",
@@ -1732,7 +1728,6 @@
   "conversation.sidebarCounts.mentioned": "{count} open conversation with mentions | {count} open conversations with mentions",
   "conversation.sidebarCounts.view": "{count} conversation in this view | {count} conversations in this view",
   "conversation.sidebarCounts.unassigned": "{count} open unassigned conversation | {count} open unassigned conversations",
-  "widget.proactiveMessages": "Proactive messages",
   "widget.replyTeam": "Route replies to team",
   "widget.searchArticles": "Search for help",
   "widget.showHelpTab": "Show Help tab",
diff --git a/static/public/web-templates/help/shared/partials.html b/static/public/web-templates/help/shared/partials.html
index 94e492ee..bc0af10d 100644
--- a/static/public/web-templates/help/shared/partials.html
+++ b/static/public/web-templates/help/shared/partials.html
@@ -27,7 +27,7 @@
 {{ end }}
 
 {{ define "hc-theme-toggle" }}
-                <button type="button" class="hc-theme-btn" data-hc-theme aria-label="{{ .L.T "helpCenter.toggleTheme" }}">
+                <button type="button" class="hc-theme-btn" data-hc-theme aria-label="{{ .L.T "globals.messages.toggleTheme" }}">
                     <svg class="hc-theme-sun" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.6" aria-hidden="true"><circle cx="10" cy="10" r="4"/><path d="M10 1.5v2M10 16.5v2M18.5 10h-2M3.5 10h-2M16 4l-1.4 1.4M5.4 14.6 4 16M16 16l-1.4-1.4M5.4 5.4 4 4" stroke-linecap="round"/></svg>
                     <svg class="hc-theme-moon" viewBox="0 0 20 20" fill="none" stroke="currentColor" stroke-width="1.6" aria-hidden="true"><path d="M17 11.3A7.5 7.5 0 0 1 8.7 3a7.5 7.5 0 1 0 8.3 8.3Z" stroke-linejoin="round"/></svg>
                 </button>
@@ -128,7 +128,7 @@
     </div>
     {{ end }}
     <a class="hc-embed-open" data-hc-embed-exit href="{{ .Data.HelpCenter.BaseURL }}{{ if .Data.CanonicalPath }}{{ .Data.CanonicalPath }}{{ else }}{{ .Data.HelpCenter.BasePath }}{{ end }}" target="_blank" rel="noopener noreferrer">
-        {{ .L.T "widget.openInHelpCenter" }}
+        {{ .L.T "globals.messages.openInHelpCenter" }}
         <svg viewBox="0 0 24 24" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><path d="M15 3h6v6"/><path d="M10 14 21 3"/><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/></svg>
     </a>
     <script>

From 9c3b022f8c5db3e889850fcd08ec4e1e23821438 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 03:33:37 +0530
Subject: [PATCH 163/178] block minimizing the reply box during an AI rewrite
 and fix the bell badge on tablets

---
 .../apps/main/src/components/datatable/DataTable.vue  | 11 +++++------
 .../main/src/components/sidebar/NotificationBell.vue  |  2 +-
 .../apps/main/src/features/conversation/ReplyBox.vue  |  5 +++--
 3 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/frontend/apps/main/src/components/datatable/DataTable.vue b/frontend/apps/main/src/components/datatable/DataTable.vue
index db775f1f..6b44ec35 100644
--- a/frontend/apps/main/src/components/datatable/DataTable.vue
+++ b/frontend/apps/main/src/components/datatable/DataTable.vue
@@ -28,9 +28,7 @@
               :class="{
                 'group cursor-pointer select-none transition-colors hover:text-foreground':
                   header.column.getCanSort(),
-                'max-sm:hidden':
-                  (headerIndex > 1 && header.column.id !== 'actions') ||
-                  ['created_at', 'updated_at'].includes(header.column.id)
+                'max-sm:hidden': isHiddenOnPhone(header.column.id, headerIndex)
               }"
               @click="header.column.getToggleSortingHandler()?.($event)"
             >
@@ -72,9 +70,7 @@
                 class="px-4 py-3 text-center text-sm sm:whitespace-nowrap"
                 :class="[
                   cell.column.id === 'actions' ? actionCellClass : '',
-                  ((cellIndex > 1 && cell.column.id !== 'actions') ||
-                    ['created_at', 'updated_at'].includes(cell.column.id)) &&
-                    'max-sm:hidden'
+                  isHiddenOnPhone(cell.column.id, cellIndex) && 'max-sm:hidden'
                 ]"
               >
                 <FlexRender :render="cell.column.columnDef.cell" :props="cell.getContext()" />
@@ -136,6 +132,9 @@ const { t } = useI18n()
 const actionCellClass =
   'transition-opacity duration-150 can-hover:opacity-0 can-hover:group-hover/row:opacity-100 focus-within:!opacity-100 [&:has([data-state=open])]:!opacity-100 max-md:[&_button]:size-11'
 
+const isHiddenOnPhone = (columnId, index) =>
+  (index > 1 && columnId !== 'actions') || ['created_at', 'updated_at'].includes(columnId)
+
 const props = defineProps({
   columns: Array,
   data: Array,
diff --git a/frontend/apps/main/src/components/sidebar/NotificationBell.vue b/frontend/apps/main/src/components/sidebar/NotificationBell.vue
index 85799ec0..29edbd12 100644
--- a/frontend/apps/main/src/components/sidebar/NotificationBell.vue
+++ b/frontend/apps/main/src/components/sidebar/NotificationBell.vue
@@ -5,7 +5,7 @@
         <Bell class="h-5 w-5" />
         <span
           v-if="notificationStore.unreadCount > 0"
-          class="absolute top-0.5 left-6 md:left-auto md:right-0.5 inline-flex size-3.5 items-center justify-center rounded-full bg-destructive text-[9px] font-medium text-destructive-foreground"
+          class="absolute top-0.5 left-6 xl:left-auto xl:right-0.5 inline-flex size-3.5 items-center justify-center rounded-full bg-destructive text-[9px] font-medium text-destructive-foreground"
         >
           {{ notificationStore.unreadCount > 99 ? '99' : notificationStore.unreadCount }}
         </span>
diff --git a/frontend/apps/main/src/features/conversation/ReplyBox.vue b/frontend/apps/main/src/features/conversation/ReplyBox.vue
index dfc4cdf3..7c0d74e7 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBox.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBox.vue
@@ -132,7 +132,7 @@
         v-model:showBcc="showBcc"
         v-model:mentions="mentions"
         @toggleFullscreen="isEditorFullscreen = !isEditorFullscreen"
-        @minimize="isMinimized = true"
+        @minimize="toggleMinimize"
         @send="processSend"
         @sendAndSetStatus="processSendAndSetStatus"
         @fileUpload="handleFileUpload"
@@ -320,7 +320,8 @@ const focusFromPalette = () => {
 }
 
 const toggleMinimize = () => {
-  if (isCramped.value || isEditorFullscreen.value) return
+  // Unmounting the editor mid AI rewrite drops the result and leaves isGenerating stuck.
+  if (isCramped.value || isEditorFullscreen.value || isGenerating.value) return
   isMinimized.value = !isMinimized.value
   if (!isMinimized.value) nextTick(() => replyBoxContentRef.value?.focus())
 }

From 718c00534f3ea84632db4899848bb70b8ac0406d Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 03:43:33 +0530
Subject: [PATCH 164/178] fix live chat review findings and tests

---
 cmd/custom_attributes.go                      |  8 +---
 .../admin/inbox/PreChatFormConfig.vue         | 15 ++++++-
 .../features/admin/inbox/WidgetCampaigns.vue  | 16 +++++++-
 .../features/admin/inbox/WidgetHelpConfig.vue | 17 +++++++-
 .../cypress/e2e/ui/livechatFormFields.cy.js   | 10 ++---
 .../cypress/e2e/ui/livechatFormLayout.cy.js   |  2 +-
 .../cypress/e2e/ui/livechatInboxForm.cy.js    |  2 +-
 frontend/cypress/support/livechat.js          |  4 +-
 .../shared-ui/components/ReorderButtons.vue   | 40 +++++++++++++++++++
 internal/inbox/channel/livechat/livechat.go   | 16 +++++---
 .../inbox/channel/livechat/livechat_test.go   | 17 ++++++++
 11 files changed, 122 insertions(+), 25 deletions(-)
 create mode 100644 frontend/shared-ui/components/ReorderButtons.vue

diff --git a/cmd/custom_attributes.go b/cmd/custom_attributes.go
index 5edf4321..c30f5f24 100644
--- a/cmd/custom_attributes.go
+++ b/cmd/custom_attributes.go
@@ -111,10 +111,10 @@ func handleDeleteCustomAttribute(r *fastglue.Request) error {
 	if err != nil || id <= 0 {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("globals.messages.somethingWentWrong"), nil, envelope.InputError)
 	}
-	if err = app.customAttribute.Delete(id); err != nil {
+	if err := removeAttributeFromPreChatForms(app, id); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	if err := removeAttributeFromPreChatForms(app, id); err != nil {
+	if err = app.customAttribute.Delete(id); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 	return r.SendEnvelope(true)
@@ -148,8 +148,6 @@ func removeAttributeFromPreChatForms(app *App, attributeID int) error {
 	if err != nil {
 		return err
 	}
-	// One bad inbox leaves the rest pointing at an attribute that is already gone,
-	// so every inbox is attempted and the failures are reported at the end.
 	var failed int
 	for _, inb := range inboxes {
 		if inb.Channel != livechat.ChannelLiveChat {
@@ -168,8 +166,6 @@ func removeAttributeFromPreChatForms(app *App, attributeID int) error {
 			failed++
 			continue
 		}
-		// A retry finds the config already clean and skips the reload, so the running
-		// inbox would keep the deleted field until the next restart.
 		if err := reloadInbox(app, inb.ID); err != nil {
 			app.lo.Error("error reloading inbox", "id", inb.ID, "error", err)
 			failed++
diff --git a/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue b/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
index bbaa1410..ab7bffdc 100644
--- a/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
+++ b/frontend/apps/main/src/features/admin/inbox/PreChatFormConfig.vue
@@ -70,8 +70,13 @@
                     <div class="flex items-center justify-between">
                       <div class="flex items-center space-x-3">
                         <div class="drag-handle cursor-move text-muted-foreground">
-                          <GripVertical class="w-4 h-4" />
+                          <GripVertical class="w-4 h-4" aria-hidden="true" />
                         </div>
+                        <ReorderButtons
+                          :index="index"
+                          :length="draggableFields.length"
+                          @move="moveField(index, $event)"
+                        />
                         <div>
                           <div class="font-medium">{{ field.label }}</div>
                           <div class="text-sm text-muted-foreground">
@@ -203,6 +208,7 @@ import { Label } from '@shared-ui/components/ui/label'
 import { Button } from '@shared-ui/components/ui/button'
 import { Switch } from '@shared-ui/components/ui/switch'
 import SwitchField from '@shared-ui/components/SwitchField.vue'
+import ReorderButtons from '@shared-ui/components/ReorderButtons.vue'
 import { Checkbox } from '@shared-ui/components/ui/checkbox'
 import { Tabs, TabsList, TabsTrigger } from '@shared-ui/components/ui/tabs'
 import { Plus, X, GripVertical } from 'lucide-vue-next'
@@ -257,6 +263,13 @@ const draggableFields = computed({
   }
 })
 
+const moveField = (index, direction) => {
+  const fields = [...draggableFields.value]
+  const [field] = fields.splice(index, 1)
+  fields.splice(index + direction, 0, field)
+  draggableFields.value = fields
+}
+
 const removeField = (index) => {
   const fields = formFields.value.filter((_, i) => i !== index)
   audienceConfig.value.fields = fields
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
index b9fc35e6..b2360cab 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetCampaigns.vue
@@ -42,6 +42,7 @@ import {
   CollapsibleTrigger
 } from '@shared-ui/components/ui/collapsible'
 import Draggable from 'vuedraggable'
+import ReorderButtons from '@shared-ui/components/ReorderButtons.vue'
 import SwitchField from '@shared-ui/components/SwitchField.vue'
 import SelectAgentCombobox from '@/components/combobox/SelectAgentCombobox.vue'
 import SelectTeamCombobox from '@/components/combobox/SelectTeamCombobox.vue'
@@ -189,6 +190,13 @@ const orderedCampaigns = computed({
   set: (value) => emit('update:modelValue', value)
 })
 
+const moveCampaign = (index, direction) => {
+  const campaigns = [...props.modelValue]
+  const [campaign] = campaigns.splice(index, 1)
+  campaigns.splice(index + direction, 0, campaign)
+  emit('update:modelValue', campaigns)
+}
+
 const add = (source) => {
   const item = source
     ? {
@@ -332,7 +340,7 @@ onMounted(async () => {
           ghost-class="drag-ghost"
           class="space-y-2"
         >
-          <template #item="{ element: item }">
+          <template #item="{ element: item, index }">
             <div
               class="flex items-center gap-3 border rounded-md hover:bg-accent/50 transition-colors"
             >
@@ -342,6 +350,12 @@ onMounted(async () => {
               >
                 <GripVertical class="size-4" aria-hidden="true" />
               </div>
+              <ReorderButtons
+                v-if="modelValue.length > 1"
+                :index="index"
+                :length="modelValue.length"
+                @move="moveCampaign(index, $event)"
+              />
               <Switch
                 :class="modelValue.length > 1 ? '' : 'ml-3'"
                 :checked="item.enabled"
diff --git a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
index 59f25be9..44627123 100644
--- a/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
+++ b/frontend/apps/main/src/features/admin/inbox/WidgetHelpConfig.vue
@@ -11,6 +11,7 @@ import {
   SelectItem
 } from '@shared-ui/components/ui/select'
 import SwitchField from '@shared-ui/components/SwitchField.vue'
+import ReorderButtons from '@shared-ui/components/ReorderButtons.vue'
 import { GripVertical, X, FileText } from 'lucide-vue-next'
 import Draggable from 'vuedraggable'
 
@@ -50,6 +51,13 @@ const featured = computed({
     )
 })
 
+const moveFeatured = (index, direction) => {
+  const ids = [...featuredIds.value]
+  const [id] = ids.splice(index, 1)
+  ids.splice(index + direction, 0, id)
+  update('featured_ids', ids)
+}
+
 const unusedArticles = computed(() =>
   props.articles.filter((article) => !featuredIds.value.includes(article.id))
 )
@@ -127,8 +135,13 @@ const unusedArticles = computed(() =>
           <template #item="{ element: item, index }">
             <div class="flex items-center gap-2 p-2 border rounded-md">
               <div class="drag-handle cursor-move text-muted-foreground">
-                <GripVertical class="size-4" />
+                <GripVertical class="size-4" aria-hidden="true" />
               </div>
+              <ReorderButtons
+                :index="index"
+                :length="featured.length"
+                @move="moveFeatured(index, $event)"
+              />
               <FileText class="size-4 shrink-0 text-muted-foreground" />
               <span
                 class="flex-1 min-w-0 text-sm break-words"
@@ -148,7 +161,7 @@ const unusedArticles = computed(() =>
                   )
                 "
               >
-                <X class="size-4" />
+                <X class="size-4" aria-hidden="true" />
               </Button>
             </div>
           </template>
diff --git a/frontend/cypress/e2e/ui/livechatFormFields.cy.js b/frontend/cypress/e2e/ui/livechatFormFields.cy.js
index 416187e3..cdd155d3 100644
--- a/frontend/cypress/e2e/ui/livechatFormFields.cy.js
+++ b/frontend/cypress/e2e/ui/livechatFormFields.cy.js
@@ -127,7 +127,7 @@ describe('Live chat inbox form: every field', () => {
     cy.editBrandingTheme('Dark')
     setColor('config.branding.dark.colors.primary', created.darkPrimary)
 
-    cy.openInboxSection('Launcher position')
+    cy.openInboxSection('Launcher')
     cy.editBrandingTheme('Light')
     cy.get('input[name="config.branding.light.launcher.logo_url"]')
       .clear()
@@ -260,7 +260,7 @@ describe('Live chat inbox form: every field', () => {
       created.darkPrimary
     )
 
-    cy.openInboxSection('Launcher position')
+    cy.openInboxSection('Launcher')
     cy.get('select[name="config.launcher.position"]').should('have.value', 'left')
     cy.get('input[name="config.launcher.icon_scale"]').should('have.value', '80')
     cy.get('input[name="config.launcher.spacing.side"]').should('have.value', '30')
@@ -327,7 +327,7 @@ describe('Live chat inbox form: every field', () => {
     cy.get('#bg-solid').click()
     cy.switchFieldIn('Branding', 'Fade background').click()
 
-    cy.openInboxSection('Launcher position')
+    cy.openInboxSection('Launcher')
     cy.get('select[name="config.launcher.position"]').siblings('button[role="combobox"]').click()
     cy.get('[role="option"]').contains('Right').click()
     cy.get('[role="option"]').should('not.exist')
@@ -532,8 +532,8 @@ describe('Live chat inbox form: every field', () => {
     cy.intercept('PUT', `**/api/v1/inboxes/${inboxId}`).as('updateInbox')
 
     const cases = [
-      ['Launcher position', 'input[name="config.launcher.icon_scale"]', '5'],
-      ['Launcher position', 'input[name="config.launcher.spacing.side"]', '900'],
+      ['Launcher', 'input[name="config.launcher.icon_scale"]', '5'],
+      ['Launcher', 'input[name="config.launcher.spacing.side"]', '900'],
       ['Security', 'input[name="config.session_duration"]', 'nope'],
       ['General', 'input[name="config.website_url"]', 'not-a-url']
     ]
diff --git a/frontend/cypress/e2e/ui/livechatFormLayout.cy.js b/frontend/cypress/e2e/ui/livechatFormLayout.cy.js
index 78b6452f..07da209b 100644
--- a/frontend/cypress/e2e/ui/livechatFormLayout.cy.js
+++ b/frontend/cypress/e2e/ui/livechatFormLayout.cy.js
@@ -10,7 +10,7 @@ const TABS = ['General', 'Appearance', 'Content', 'Conversations', 'Setup']
 
 const SECTIONS = {
   General: ['General', 'Conversation continuity email inbox'],
-  Appearance: ['Theme', 'Branding', 'Launcher position'],
+  Appearance: ['Theme', 'Branding', 'Launcher'],
   Content: ['Messages', 'Notice banner', 'Home screen apps', 'Help center', 'Proactive messages'],
   Conversations: ['Features', 'Office hours', 'Pre-chat form', 'Users'],
   Setup: ['Installation', 'Identity verification', 'JavaScript API', 'Security']
diff --git a/frontend/cypress/e2e/ui/livechatInboxForm.cy.js b/frontend/cypress/e2e/ui/livechatInboxForm.cy.js
index 5968d8f3..c51e4f7a 100644
--- a/frontend/cypress/e2e/ui/livechatInboxForm.cy.js
+++ b/frontend/cypress/e2e/ui/livechatInboxForm.cy.js
@@ -41,7 +41,7 @@ describe('Live chat inbox form', () => {
     cy.get('input[name="config.brand_name"]').type(brandName)
     cy.get('input[name="config.website_url"]').type(websiteUrl)
 
-    cy.openInboxSection('Launcher position')
+    cy.openInboxSection('Launcher')
     cy.get('input[name="config.launcher.spacing.side"]').clear().type('35')
     cy.get('input[name="config.launcher.spacing.bottom"]').clear().type('45')
     cy.get('select[name="config.launcher.position"]')
diff --git a/frontend/cypress/support/livechat.js b/frontend/cypress/support/livechat.js
index 79f33e1f..9685e38b 100644
--- a/frontend/cypress/support/livechat.js
+++ b/frontend/cypress/support/livechat.js
@@ -364,7 +364,7 @@ const FORM_SECTION_TAB = {
   'Conversation continuity email inbox': 'General',
   Theme: 'Appearance',
   Branding: 'Appearance',
-  'Launcher position': 'Appearance',
+  Launcher: 'Appearance',
   Messages: 'Content',
   'Notice banner': 'Content',
   'Home screen apps': 'Content',
@@ -385,7 +385,7 @@ const SECTION_ID = {
   'Conversation continuity email inbox': 'continuity',
   Theme: 'appearance',
   Branding: 'branding',
-  'Launcher position': 'launcher',
+  Launcher: 'launcher',
   Messages: 'messages',
   'Notice banner': 'noticeBanner',
   'Home screen apps': 'homeApps',
diff --git a/frontend/shared-ui/components/ReorderButtons.vue b/frontend/shared-ui/components/ReorderButtons.vue
new file mode 100644
index 00000000..3218bd09
--- /dev/null
+++ b/frontend/shared-ui/components/ReorderButtons.vue
@@ -0,0 +1,40 @@
+<script setup>
+import { useI18n } from 'vue-i18n'
+import { ArrowDown, ArrowUp } from 'lucide-vue-next'
+import { Button } from '@shared-ui/components/ui/button'
+
+defineProps({
+  index: { type: Number, required: true },
+  length: { type: Number, required: true }
+})
+
+const emit = defineEmits(['move'])
+const { t } = useI18n()
+</script>
+
+<template>
+  <div class="flex shrink-0">
+    <Button
+      type="button"
+      variant="ghost"
+      size="icon"
+      class="size-7"
+      :disabled="index === 0"
+      :aria-label="t('globals.messages.moveUp')"
+      @click="emit('move', -1)"
+    >
+      <ArrowUp aria-hidden="true" />
+    </Button>
+    <Button
+      type="button"
+      variant="ghost"
+      size="icon"
+      class="size-7"
+      :disabled="index === length - 1"
+      :aria-label="t('globals.messages.moveDown')"
+      @click="emit('move', 1)"
+    >
+      <ArrowDown aria-hidden="true" />
+    </Button>
+  </div>
+</template>
diff --git a/internal/inbox/channel/livechat/livechat.go b/internal/inbox/channel/livechat/livechat.go
index a00891b3..c4a9385c 100644
--- a/internal/inbox/channel/livechat/livechat.go
+++ b/internal/inbox/channel/livechat/livechat.go
@@ -264,12 +264,13 @@ func (c *Config) UnmarshalJSON(data []byte) error {
 	*c = Config(cfg)
 
 	var legacy struct {
-		Branding   *json.RawMessage `json:"branding"`
-		DarkMode   bool             `json:"dark_mode"`
-		Colors     Colors           `json:"colors"`
-		LogoURL    string           `json:"logo_url"`
-		HomeScreen HomeScreen       `json:"home_screen"`
-		Launcher   BrandingLauncher `json:"launcher"`
+		Branding              *json.RawMessage `json:"branding"`
+		DarkMode              bool             `json:"dark_mode"`
+		Colors                Colors           `json:"colors"`
+		LogoURL               string           `json:"logo_url"`
+		HomeScreen            HomeScreen       `json:"home_screen"`
+		Launcher              BrandingLauncher `json:"launcher"`
+		CampaignCooldownHours *int             `json:"campaign_cooldown_hours"`
 	}
 	if err := json.Unmarshal(data, &legacy); err != nil {
 		return err
@@ -294,6 +295,9 @@ func (c *Config) UnmarshalJSON(data []byte) error {
 	if c.Launcher.IconScale == 0 {
 		c.Launcher.IconScale = DefaultLauncherIconScale
 	}
+	if c.CampaignCooldown == "" && legacy.CampaignCooldownHours != nil && *legacy.CampaignCooldownHours > 0 {
+		c.CampaignCooldown = strconv.Itoa(*legacy.CampaignCooldownHours) + "h"
+	}
 	if c.CampaignCooldown == "" {
 		c.CampaignCooldown = DefaultCampaignCooldown
 	}
diff --git a/internal/inbox/channel/livechat/livechat_test.go b/internal/inbox/channel/livechat/livechat_test.go
index 93125db3..63345f28 100644
--- a/internal/inbox/channel/livechat/livechat_test.go
+++ b/internal/inbox/channel/livechat/livechat_test.go
@@ -169,6 +169,23 @@ func TestUnmarshalFillsEmptyListsAndCooldown(t *testing.T) {
 	}
 }
 
+func TestUnmarshalLegacyCampaignCooldown(t *testing.T) {
+	var config Config
+	if err := json.Unmarshal([]byte(`{"campaign_cooldown_hours":12}`), &config); err != nil {
+		t.Fatal(err)
+	}
+	if config.CampaignCooldown != "12h" {
+		t.Fatalf("campaign cooldown = %q", config.CampaignCooldown)
+	}
+
+	if err := json.Unmarshal([]byte(`{"campaign_cooldown":"30m","campaign_cooldown_hours":12}`), &config); err != nil {
+		t.Fatal(err)
+	}
+	if config.CampaignCooldown != "30m" {
+		t.Fatalf("campaign cooldown = %q", config.CampaignCooldown)
+	}
+}
+
 func TestUnmarshalFillsValuesAConfigWrittenOutsideTheFormLacks(t *testing.T) {
 	var config Config
 	if err := json.Unmarshal([]byte(`{"brand_name":"Acme","colors":{"primary":"#112233"},"launcher":{"position":"right"}}`), &config); err != nil {

From 21be970951148639d6fca53d3815e0f250411921 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 23:34:43 +0530
Subject: [PATCH 165/178] show the desktop layout from 1024px and fix phone
 layout bugs

---
 .../apps/main/src/components/sidebar/NotificationBell.vue | 2 +-
 .../main/src/features/admin/automation/AutomationTabs.vue | 2 +-
 .../apps/main/src/features/conversation/Conversation.vue  | 8 ++++----
 .../main/src/features/conversation/CreateConversation.vue | 4 ++--
 .../main/src/features/conversation/ReplyBoxContent.vue    | 6 +++---
 .../src/features/conversation/message/MessageBubble.vue   | 2 +-
 .../conversation/sidebar/ConversationSideBarContact.vue   | 2 +-
 frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue | 2 +-
 .../apps/main/src/views/admin/templates/TemplateList.vue  | 2 +-
 .../shared-ui/components/ui/sidebar/SidebarMenuAction.vue | 7 ++-----
 .../components/ui/sidebar/SidebarMenuSubButton.vue        | 2 +-
 .../shared-ui/components/ui/sidebar/SidebarTrigger.vue    | 2 +-
 frontend/shared-ui/components/ui/sidebar/index.js         | 4 ++--
 frontend/shared-ui/composables/useIsMobile.js             | 4 ++--
 i18n/en-US.json                                           | 2 --
 15 files changed, 23 insertions(+), 28 deletions(-)

diff --git a/frontend/apps/main/src/components/sidebar/NotificationBell.vue b/frontend/apps/main/src/components/sidebar/NotificationBell.vue
index 29edbd12..7931fe56 100644
--- a/frontend/apps/main/src/components/sidebar/NotificationBell.vue
+++ b/frontend/apps/main/src/components/sidebar/NotificationBell.vue
@@ -5,7 +5,7 @@
         <Bell class="h-5 w-5" />
         <span
           v-if="notificationStore.unreadCount > 0"
-          class="absolute top-0.5 left-6 xl:left-auto xl:right-0.5 inline-flex size-3.5 items-center justify-center rounded-full bg-destructive text-[9px] font-medium text-destructive-foreground"
+          class="absolute top-0.5 left-6 lg:left-auto lg:right-0.5 inline-flex size-3.5 items-center justify-center rounded-full bg-destructive text-[9px] font-medium text-destructive-foreground"
         >
           {{ notificationStore.unreadCount > 99 ? '99' : notificationStore.unreadCount }}
         </span>
diff --git a/frontend/apps/main/src/features/admin/automation/AutomationTabs.vue b/frontend/apps/main/src/features/admin/automation/AutomationTabs.vue
index 19b606bc..a08b4c11 100644
--- a/frontend/apps/main/src/features/admin/automation/AutomationTabs.vue
+++ b/frontend/apps/main/src/features/admin/automation/AutomationTabs.vue
@@ -1,6 +1,6 @@
 <template>
   <Tabs default-value="new_conversation" v-model="selectedTab">
-    <TabsList class="flex w-full justify-start overflow-x-auto mb-5 sm:grid sm:grid-cols-3">
+    <TabsList class="flex w-full justify-start overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden mb-5 sm:grid sm:grid-cols-3">
       <TabsTrigger value="new_conversation" :class="AUTOMATION_TAB_CLASS">
         {{ $t('conversation.newConversation') }}
       </TabsTrigger>
diff --git a/frontend/apps/main/src/features/conversation/Conversation.vue b/frontend/apps/main/src/features/conversation/Conversation.vue
index 8be5691f..805ef00b 100644
--- a/frontend/apps/main/src/features/conversation/Conversation.vue
+++ b/frontend/apps/main/src/features/conversation/Conversation.vue
@@ -6,7 +6,7 @@
         <Button
           v-if="isMobile"
           variant="ghost"
-          class="w-11 h-11 xl:w-8 xl:h-8 p-0 shrink-0 -ml-2 xl:-ml-1"
+          class="w-11 h-11 lg:w-8 lg:h-8 p-0 shrink-0 -ml-2 lg:-ml-1"
           :aria-label="t('globals.messages.back')"
           @click="goBackToList"
         >
@@ -39,10 +39,10 @@
           <DropdownMenuTrigger>
             <div
               v-if="conversationStore.current?.status"
-              class="flex h-11 xl:h-8 items-center cursor-pointer"
+              class="flex h-11 lg:h-8 items-center cursor-pointer"
             >
               <span
-                class="rounded-md bg-primary px-2.5 py-1 text-xs xl:text-sm font-medium text-primary-foreground"
+                class="rounded-md bg-primary px-2.5 py-1 text-xs lg:text-sm font-medium text-primary-foreground"
               >
                 {{ conversationStore.current?.status }}
               </span>
@@ -93,7 +93,7 @@
 </template>
 
 <script setup>
-const MOBILE_ICON_BUTTON_CLASS = 'w-11 h-11 xl:w-8 xl:h-8 p-0'
+const MOBILE_ICON_BUTTON_CLASS = 'w-11 h-11 lg:w-8 lg:h-8 p-0'
 
 import { computed, ref, onMounted, onUnmounted } from 'vue'
 import { useConversationStore } from '@main/stores/conversation'
diff --git a/frontend/apps/main/src/features/conversation/CreateConversation.vue b/frontend/apps/main/src/features/conversation/CreateConversation.vue
index f59ef6e2..563ed58d 100644
--- a/frontend/apps/main/src/features/conversation/CreateConversation.vue
+++ b/frontend/apps/main/src/features/conversation/CreateConversation.vue
@@ -12,7 +12,7 @@
         <form
           @submit="createConversation"
           novalidate
-          class="flex flex-col flex-1 min-h-0 overflow-y-auto xl:overflow-hidden"
+          class="flex flex-col flex-1 min-h-0 overflow-y-auto lg:overflow-hidden"
         >
           <!-- Form Fields Section -->
           <div class="space-y-4 pb-2 flex-shrink-0">
@@ -176,7 +176,7 @@
           </div>
 
           <!-- Message Editor Section -->
-          <div class="flex flex-none flex-col min-h-64 mt-4 xl:flex-1 xl:min-h-0">
+          <div class="flex flex-none flex-col min-h-64 mt-4 lg:flex-1 lg:min-h-0">
             <FormField v-slot="{ componentField }" name="content">
               <FormItem class="flex flex-col h-full">
                 <FormLabel>{{ $t('globals.terms.message') }}</FormLabel>
diff --git a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
index cc17e9a9..a641d26e 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
@@ -52,7 +52,7 @@
         v-if="messageType === 'reply'"
       >
         <div class="flex items-center gap-2">
-          <label class="w-12 text-xs font-semibold tracking-wide text-muted-foreground">TO:</label>
+          <label class="w-12 shrink-0 text-xs font-semibold tracking-wide text-muted-foreground">TO:</label>
           <Input
             type="text"
             :placeholder="t('replyBox.emailAddresess')"
@@ -82,7 +82,7 @@
           </Button>
         </div>
         <div v-if="showCc" class="flex items-center gap-2">
-          <label class="w-12 text-xs font-semibold tracking-wide text-muted-foreground">CC:</label>
+          <label class="w-12 shrink-0 text-xs font-semibold tracking-wide text-muted-foreground">CC:</label>
           <Input
             ref="ccInputRef"
             type="text"
@@ -103,7 +103,7 @@
           </Button>
         </div>
         <div v-if="showBcc" class="flex items-center gap-2">
-          <label class="w-12 text-xs font-semibold tracking-wide text-muted-foreground">BCC:</label>
+          <label class="w-12 shrink-0 text-xs font-semibold tracking-wide text-muted-foreground">BCC:</label>
           <Input
             ref="bccInputRef"
             type="text"
diff --git a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
index c33252fe..b7c58be3 100644
--- a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
+++ b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
@@ -52,7 +52,7 @@
       </template>
 
       <div
-        class="w-full md:w-4/5"
+        class="w-4/5"
         :class="{ 'flex justify-end items-center gap-2': isOutgoing }"
         style="contain: inline-size"
       >
diff --git a/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue b/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue
index f0114f06..7689f23c 100644
--- a/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue
+++ b/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue
@@ -52,7 +52,7 @@
         }}</TooltipContent>
       </Tooltip>
       <template v-if="conversation?.contact?.email">
-        <span class="sidebar-value break-all">
+        <span class="sidebar-value min-w-0 truncate" :title="conversation.contact.email">
           {{ conversation.contact.email }}
         </span>
         <CopyButton :text="conversation.contact.email" class="shrink-0" />
diff --git a/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue b/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue
index caf0fe36..e410296f 100644
--- a/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue
+++ b/frontend/apps/main/src/layouts/admin/AdminSplitLayout.vue
@@ -1,6 +1,6 @@
 <template>
   <div class="flex justify-between flex-1 min-h-0">
-    <div class="relative pr-6" :class="fixedHelp ? 'flex-1 min-w-0' : 'w-full xl:w-8/12'">
+    <div class="relative" :class="fixedHelp ? 'flex-1 min-w-0 xl:pr-6' : 'w-full lg:pr-6 xl:w-8/12'">
       <slot name="content" />
     </div>
     <div
diff --git a/frontend/apps/main/src/views/admin/templates/TemplateList.vue b/frontend/apps/main/src/views/admin/templates/TemplateList.vue
index 00d0ab81..eca70de5 100644
--- a/frontend/apps/main/src/views/admin/templates/TemplateList.vue
+++ b/frontend/apps/main/src/views/admin/templates/TemplateList.vue
@@ -10,7 +10,7 @@
     </div>
     <div>
       <Tabs default-value="email_outgoing" v-model="templateType">
-        <TabsList class="flex w-full justify-start overflow-x-auto mb-5 sm:grid sm:grid-cols-2">
+        <TabsList class="flex w-full justify-start overflow-x-auto [scrollbar-width:none] [&::-webkit-scrollbar]:hidden mb-5 sm:grid sm:grid-cols-2">
           <TabsTrigger value="email_outgoing" :class="TEMPLATE_TAB_CLASS">
             {{ $t('admin.template.outgoingEmailTemplates') }}
           </TabsTrigger>
diff --git a/frontend/shared-ui/components/ui/sidebar/SidebarMenuAction.vue b/frontend/shared-ui/components/ui/sidebar/SidebarMenuAction.vue
index b38063a5..6f6b02e0 100644
--- a/frontend/shared-ui/components/ui/sidebar/SidebarMenuAction.vue
+++ b/frontend/shared-ui/components/ui/sidebar/SidebarMenuAction.vue
@@ -15,11 +15,8 @@ const props = defineProps({
     data-sidebar="menu-action"
     :class="
       cn(
-        'absolute right-0 top-1.5 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-sidebar-accent-foreground [&>svg]:size-4 [&>svg]:shrink-0',
-        'after:absolute after:-inset-2 after:md:hidden',
-        'peer-data-[size=sm]/menu-button:top-1',
-        'peer-data-[size=default]/menu-button:top-1.5',
-        'peer-data-[size=lg]/menu-button:top-2.5',
+        'absolute right-0 top-1/2 -translate-y-1/2 flex aspect-square w-5 items-center justify-center rounded-md p-0 text-sidebar-foreground outline-none ring-sidebar-ring transition-transform hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 peer-hover/menu-button:text-sidebar-accent-foreground [&>svg]:size-4 [&>svg]:shrink-0',
+        'after:absolute after:-inset-2 after:lg:hidden',
         'group-data-[collapsible=icon]:hidden',
         showOnHover &&
           'group-focus-within/menu-item:opacity-100 group-hover/menu-item:opacity-100 data-[state=open]:opacity-100 peer-data-[active=true]/menu-button:text-sidebar-accent-foreground md:opacity-0',
diff --git a/frontend/shared-ui/components/ui/sidebar/SidebarMenuSubButton.vue b/frontend/shared-ui/components/ui/sidebar/SidebarMenuSubButton.vue
index 7b198fcb..31ad1954 100644
--- a/frontend/shared-ui/components/ui/sidebar/SidebarMenuSubButton.vue
+++ b/frontend/shared-ui/components/ui/sidebar/SidebarMenuSubButton.vue
@@ -20,7 +20,7 @@ const props = defineProps({
     :data-active="isActive"
     :class="
       cn(
-        'flex h-7 max-xl:h-11 min-w-0 items-center gap-2 rounded-md pl-1 text-sidebar-foreground outline-none ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground',
+        'flex h-7 max-lg:h-11 min-w-0 items-center gap-2 rounded-md pl-1 text-sidebar-foreground outline-none ring-sidebar-ring hover:bg-sidebar-accent hover:text-sidebar-accent-foreground focus-visible:ring-2 active:bg-sidebar-accent active:text-sidebar-accent-foreground disabled:pointer-events-none disabled:opacity-50 aria-disabled:pointer-events-none aria-disabled:opacity-50 [&>span:last-child]:truncate [&>svg]:size-4 [&>svg]:shrink-0 [&>svg]:text-sidebar-accent-foreground',
         'data-[active=true]:bg-sidebar-accent data-[active=true]:text-sidebar-accent-foreground',
         size === 'sm' && 'text-xs',
         size === 'md' && 'text-sm',
diff --git a/frontend/shared-ui/components/ui/sidebar/SidebarTrigger.vue b/frontend/shared-ui/components/ui/sidebar/SidebarTrigger.vue
index cfb449e8..95ccdfe4 100644
--- a/frontend/shared-ui/components/ui/sidebar/SidebarTrigger.vue
+++ b/frontend/shared-ui/components/ui/sidebar/SidebarTrigger.vue
@@ -16,7 +16,7 @@ const { toggleSidebar } = useSidebar();
     data-sidebar="trigger"
     variant="ghost"
     size="icon"
-    :class="cn('h-11 w-11 xl:h-7 xl:w-7', props.class)"
+    :class="cn('h-11 w-11 lg:h-7 lg:w-7', props.class)"
     @click="toggleSidebar"
   >
     <ViewVerticalIcon />
diff --git a/frontend/shared-ui/components/ui/sidebar/index.js b/frontend/shared-ui/components/ui/sidebar/index.js
index bbec9372..d977c486 100644
--- a/frontend/shared-ui/components/ui/sidebar/index.js
+++ b/frontend/shared-ui/components/ui/sidebar/index.js
@@ -36,8 +36,8 @@ export const sidebarMenuButtonVariants = cva(
           'bg-background shadow-[0_0_0_1px_hsl(var(--sidebar-border))] hover:bg-sidebar-accent hover:text-sidebar-accent-foreground hover:shadow-[0_0_0_1px_hsl(var(--sidebar-accent))]',
       },
       size: {
-        default: 'h-8 max-xl:h-11 text-sm',
-        sm: 'h-7 max-xl:h-11 text-xs',
+        default: 'h-8 max-lg:h-11 text-sm',
+        sm: 'h-7 max-lg:h-11 text-xs',
         lg: 'h-12 text-sm group-data-[collapsible=icon]:!p-0',
       },
     },
diff --git a/frontend/shared-ui/composables/useIsMobile.js b/frontend/shared-ui/composables/useIsMobile.js
index 0ff28dbf..df6788d0 100644
--- a/frontend/shared-ui/composables/useIsMobile.js
+++ b/frontend/shared-ui/composables/useIsMobile.js
@@ -1,6 +1,6 @@
 import { useMediaQuery } from '@vueuse/core'
 
-// 1279px is the exact complement of Tailwind's `xl:` (min-width: 1280px).
+// 1023px is the exact complement of Tailwind's `lg:` (min-width: 1024px).
 export function useIsMobile() {
-  return useMediaQuery('(max-width: 1279px)')
+  return useMediaQuery('(max-width: 1023px)')
 }
diff --git a/i18n/en-US.json b/i18n/en-US.json
index c5f45b19..63913230 100644
--- a/i18n/en-US.json
+++ b/i18n/en-US.json
@@ -927,7 +927,6 @@
   "globals.messages.mustBeNumber": "Must be a number",
   "globals.messages.nDays": "{days} days",
   "globals.messages.new": "New",
-  "globals.messages.nextPage": "Next page",
   "globals.messages.moveUp": "Move up",
   "globals.messages.moveDown": "Move down",
   "globals.messages.nextPage": "Next page",
@@ -945,7 +944,6 @@
   "globals.messages.pickDateAndTime": "Pick date and time",
   "globals.messages.pleaseRateConversation": "Please rate this conversation:",
   "globals.messages.pleaseSelect": "Please select {name} before submitting",
-  "globals.messages.previousPage": "Previous page",
   "globals.messages.pressEnterToSelectAValue": "Press enter to select a value",
   "globals.messages.previousPage": "Previous page",
   "globals.messages.publish": "Publish",

From f07efc0dec4f28031ea07c120184c35538a25539 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 23:42:23 +0530
Subject: [PATCH 166/178] close the phone sidebar when opening the view form

---
 frontend/apps/main/src/components/sidebar/Sidebar.vue     | 8 ++++++++
 .../shared-ui/components/ui/sidebar/SidebarProvider.vue   | 2 ++
 2 files changed, 10 insertions(+)

diff --git a/frontend/apps/main/src/components/sidebar/Sidebar.vue b/frontend/apps/main/src/components/sidebar/Sidebar.vue
index fde8b499..d084aec8 100644
--- a/frontend/apps/main/src/components/sidebar/Sidebar.vue
+++ b/frontend/apps/main/src/components/sidebar/Sidebar.vue
@@ -83,11 +83,18 @@ const isInboxRoute = (path) => {
   return path.startsWith('/inboxes')
 }
 
+const sidebarProviderRef = ref(null)
+
+// An open mobile drawer treats taps on the view form as outside clicks and closes it.
+const closeMobileSidebar = () => sidebarProviderRef.value?.setOpenMobile(false)
+
 const openCreateViewDialog = () => {
+  closeMobileSidebar()
   emit('createView')
 }
 
 const editView = (view) => {
+  closeMobileSidebar()
   emit('editView', view)
 }
 
@@ -151,6 +158,7 @@ onMounted(() => {
 
 <template>
   <SidebarProvider
+    ref="sidebarProviderRef"
     style="--sidebar-width: 14rem"
     :default-open="sidebarOpen"
     v-on:update:open="sidebarOpen = $event"
diff --git a/frontend/shared-ui/components/ui/sidebar/SidebarProvider.vue b/frontend/shared-ui/components/ui/sidebar/SidebarProvider.vue
index 03e555c5..a2f13714 100644
--- a/frontend/shared-ui/components/ui/sidebar/SidebarProvider.vue
+++ b/frontend/shared-ui/components/ui/sidebar/SidebarProvider.vue
@@ -70,6 +70,8 @@ provideSidebarContext({
   setOpenMobile,
   toggleSidebar,
 });
+
+defineExpose({ setOpenMobile });
 </script>
 
 <template>

From 804e4578b07fb098c8074fd946054ac860e14f08 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Wed, 23 Sep 2026 23:59:55 +0530
Subject: [PATCH 167/178] add reply recipient tests and tidy three small UI
 details

---
 .../main/src/features/admin/ai/ToolForm.vue   |  2 +-
 .../list/ConversationListItem.vue             |  2 +-
 .../sidebar/ConversationSideBarContact.vue    |  2 +-
 .../e2e/ui/conversationLifecycle.cy.js        | 90 ++++++++++++++++++-
 4 files changed, 91 insertions(+), 5 deletions(-)

diff --git a/frontend/apps/main/src/features/admin/ai/ToolForm.vue b/frontend/apps/main/src/features/admin/ai/ToolForm.vue
index b435efff..65ed642f 100644
--- a/frontend/apps/main/src/features/admin/ai/ToolForm.vue
+++ b/frontend/apps/main/src/features/admin/ai/ToolForm.vue
@@ -125,7 +125,7 @@
 
     <div class="space-y-5 rounded-lg border border-border p-4">
       <div>
-        <h3 class="text-sm font-medium text-foreground">{{ t('globals.terms.agentAccess') }}</h3>
+        <h3 class="font-medium text-sm text-muted-foreground">{{ t('globals.terms.agentAccess') }}</h3>
       </div>
 
       <FormField v-slot="{ componentField, handleChange }" name="copilot_enabled">
diff --git a/frontend/apps/main/src/features/conversation/list/ConversationListItem.vue b/frontend/apps/main/src/features/conversation/list/ConversationListItem.vue
index f1c9e50a..9778e935 100644
--- a/frontend/apps/main/src/features/conversation/list/ConversationListItem.vue
+++ b/frontend/apps/main/src/features/conversation/list/ConversationListItem.vue
@@ -105,7 +105,7 @@
                 </template>
                 <template v-else>
                   <Reply
-                    class="text-success inline-block align-text-bottom mr-0.5"
+                    class="text-success inline-block align-[-2px] mr-0.5"
                     :size="14"
                     v-if="conversation.last_message_sender === 'agent'"
                   />{{ trimmedLastMessage }}
diff --git a/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue b/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue
index 7689f23c..4f1adcec 100644
--- a/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue
+++ b/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue
@@ -55,7 +55,7 @@
         <span class="sidebar-value min-w-0 truncate" :title="conversation.contact.email">
           {{ conversation.contact.email }}
         </span>
-        <CopyButton :text="conversation.contact.email" class="shrink-0" />
+        <CopyButton :text="conversation.contact.email" class="h-6 w-6 shrink-0 [&_svg]:h-3.5 [&_svg]:w-3.5" />
       </template>
       <span v-else class="sidebar-label">
         {{ t('conversation.sidebar.notAvailable') }}
diff --git a/frontend/cypress/e2e/ui/conversationLifecycle.cy.js b/frontend/cypress/e2e/ui/conversationLifecycle.cy.js
index 1940962a..b116f4c5 100644
--- a/frontend/cypress/e2e/ui/conversationLifecycle.cy.js
+++ b/frontend/cypress/e2e/ui/conversationLifecycle.cy.js
@@ -11,22 +11,48 @@ describe('Conversation lifecycle', () => {
   const subject = `Lifecycle subject ${stamp}`
   const noteBody = `Internal note ${stamp}`
   const replyBody = `Public reply ${stamp}`
+  const ccContactLastName = `CcCustomer${stamp}`
+  const ccContactName = `Lifecycle ${ccContactLastName}`
+  const ccAddress = `lifecycle.cc.${stamp}@example.com`
+  const bccAddress = `lifecycle.bcc.${stamp}@example.com`
 
   const smtpHost = Cypress.env('SMTP_HOST') || '127.0.0.1'
   const smtpPort = Number(Cypress.env('SMTP_PORT') || 1025)
 
   let conversationUuid
+  let ccConversationUuid
   let inboxId
   let teamId
   let agentId
   let tagId
 
-  const openConversation = () => {
+  const openConversation = (uuid = conversationUuid) => {
     cy.intercept('GET', '**/messages?page=*').as('loadMessages')
-    cy.visit(`/inboxes/all/conversation/${conversationUuid}`)
+    cy.visit(`/inboxes/all/conversation/${uuid}`)
     cy.wait('@loadMessages')
   }
 
+  // A stubbed reply keeps the thread, and the recipients it prefills, the same for later tests.
+  const captureSend = () =>
+    cy
+      .intercept('POST', '**/conversations/*/messages', { statusCode: 200, body: { data: {} } })
+      .as('captureSend')
+
+  const recipientRow = (label) => cy.contains('label', label).parent()
+
+  const sendReply = (text) => {
+    cy.get('.tiptap.ProseMirror').first().click()
+    cy.get('.tiptap.ProseMirror').first().type(text)
+    cy.contains('button', /^Send$/).click()
+  }
+
+  const expectSentRecipients = (uuid, { cc, bcc }) =>
+    cy.wait('@captureSend').then(({ request }) => {
+      expect(request.url, 'conversation').to.include(uuid)
+      expect(request.body.cc, 'cc').to.deep.eq(cc)
+      expect(request.body.bcc, 'bcc').to.deep.eq(bcc)
+    })
+
   // The open set of sidebar sections is remembered per browser, so blind toggling closes it later.
   const openActionsSection = () => {
     cy.contains('button', 'Actions').then(($trigger) => {
@@ -104,6 +130,27 @@ describe('Conversation lifecycle', () => {
         conversationUuid = res.body.data.uuid
         expect(conversationUuid, 'conversation uuid').to.be.a('string').and.not.be.empty
       })
+      // The reply box prefills CC from the last email, so this thread ends on an agent reply that CC'd someone.
+      const ccCustomerEmail = `lifecycle.cc-customer.${stamp}@example.com`
+      cy.api('POST', '/api/v1/conversations', {
+        inbox_id: inboxID,
+        contact_email: ccCustomerEmail,
+        first_name: 'Lifecycle',
+        last_name: ccContactLastName,
+        subject: `${subject} with CC`,
+        content: '<p>Customer opened the CC conversation.</p>',
+        initiator: 'contact'
+      }).then((res) => {
+        ccConversationUuid = res.body.data.uuid
+        cy.api('POST', `/api/v1/conversations/${ccConversationUuid}/messages`, {
+          sender_type: 'agent',
+          private: false,
+          message: '<p>Looping in a colleague.</p>',
+          to: [ccCustomerEmail],
+          cc: [ccAddress],
+          bcc: []
+        })
+      })
     })
   })
 
@@ -231,6 +278,45 @@ describe('Conversation lifecycle', () => {
     })
   })
 
+  it('sends the CC prefilled from the last email', () => {
+    captureSend()
+    openConversation(ccConversationUuid)
+    recipientRow('CC:').find('input').should('have.value', ccAddress)
+    sendReply('Reply with the prefilled CC')
+    expectSentRecipients(ccConversationUuid, { cc: [ccAddress], bcc: [] })
+  })
+
+  it('drops the CC once its row is closed', () => {
+    captureSend()
+    openConversation(ccConversationUuid)
+    recipientRow('CC:').find('button[aria-label="Remove CC"]').click()
+    cy.contains('label', 'CC:').should('not.exist')
+    sendReply('Reply after closing CC')
+    expectSentRecipients(ccConversationUuid, { cc: [], bcc: [] })
+  })
+
+  it('sends only what each conversation shows after switching between them', () => {
+    captureSend()
+    openConversation(ccConversationUuid)
+    recipientRow('CC:').find('button[aria-label="Remove CC"]').click()
+    cy.contains('button', /^BCC$/).click()
+    recipientRow('BCC:').find('input').type(bccAddress)
+
+    cy.contains(contactName).click()
+    cy.location('pathname').should('include', conversationUuid)
+    cy.contains('label', 'CC:').should('not.exist')
+    cy.contains('label', 'BCC:').should('not.exist')
+    sendReply('Reply after switching away')
+    expectSentRecipients(conversationUuid, { cc: [], bcc: [] })
+
+    cy.contains(ccContactName).click()
+    cy.location('pathname').should('include', ccConversationUuid)
+    recipientRow('CC:').find('input').should('have.value', ccAddress)
+    cy.contains('label', 'BCC:').should('not.exist')
+    sendReply('Reply after switching back')
+    expectSentRecipients(ccConversationUuid, { cc: [ccAddress], bcc: [] })
+  })
+
   it('sends a reply that appears in the thread', () => {
     cy.intercept('POST', `**/conversations/${conversationUuid}/messages`).as('sendReply')
 

From f4d5adf33665ff8995eaa7d4282d4a9b991c64dd Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 24 Sep 2026 00:08:59 +0530
Subject: [PATCH 168/178] show the avatar next to the sender name on phones

---
 .../conversation/message/MessageBubble.vue    | 24 ++++++++++++-------
 1 file changed, 15 insertions(+), 9 deletions(-)

diff --git a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
index b7c58be3..ea2410ce 100644
--- a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
+++ b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
@@ -3,9 +3,15 @@
     <!-- Sender Name -->
     <div
       v-if="!groupWithPrev"
-      class="mb-1 flex items-center gap-1"
-      :class="isOutgoing ? 'pr-2 md:pr-[47px]' : 'pl-10 md:pl-[47px]'"
+      class="mb-1 flex items-center gap-1.5"
+      :class="isOutgoing ? 'md:pr-[47px]' : 'md:pl-[47px]'"
     >
+      <Avatar class="w-5 h-5 text-[10px] md:hidden" :class="{ 'order-last': isOutgoing }">
+        <AvatarImage :src="getAvatar" />
+        <AvatarFallback class="font-medium">
+          {{ avatarFallback }}
+        </AvatarFallback>
+      </Avatar>
       <router-link
         v-if="!isOutgoing"
         :to="{ name: 'contact-detail', params: { id: message.author?.id } }"
@@ -39,7 +45,7 @@
         <router-link
           v-if="!groupWithPrev"
           :to="{ name: 'contact-detail', params: { id: message.author?.id } }"
-          class="flex-shrink-0"
+          class="flex-shrink-0 max-md:hidden"
         >
           <Avatar class="cursor-pointer w-8 h-8 hover:opacity-80 transition-opacity">
             <AvatarImage :src="getAvatar" />
@@ -48,7 +54,7 @@
             </AvatarFallback>
           </Avatar>
         </router-link>
-        <div v-else class="w-8 flex-shrink-0" />
+        <div v-else class="w-8 flex-shrink-0 max-md:hidden" />
       </template>
 
       <div
@@ -209,11 +215,11 @@
 
       <!-- Avatar (right for outgoing) -->
       <template v-if="isOutgoing">
-        <div v-if="groupWithPrev" class="w-8 flex-shrink-0" />
+        <div v-if="groupWithPrev" class="w-8 flex-shrink-0 max-md:hidden" />
         <router-link
           v-else-if="canManageAI"
           :to="aiAssistantRoute"
-          class="flex-shrink-0"
+          class="flex-shrink-0 max-md:hidden"
         >
           <Avatar class="cursor-pointer w-8 h-8 hover:opacity-80 transition-opacity">
             <AvatarImage :src="getAvatar" />
@@ -225,7 +231,7 @@
         <router-link
           v-else-if="canManageUsers"
           :to="{ name: 'edit-agent', params: { id: message.author?.id } }"
-          class="flex-shrink-0"
+          class="flex-shrink-0 max-md:hidden"
         >
           <Avatar class="cursor-pointer w-8 h-8 hover:opacity-80 transition-opacity">
             <AvatarImage :src="getAvatar" />
@@ -234,7 +240,7 @@
             </AvatarFallback>
           </Avatar>
         </router-link>
-        <Avatar v-else class="w-8 h-8">
+        <Avatar v-else class="w-8 h-8 max-md:hidden">
           <AvatarImage :src="getAvatar" />
           <AvatarFallback class="font-medium">
             {{ avatarFallback }}
@@ -244,7 +250,7 @@
     </div>
 
     <!-- Timestamp tooltip -->
-    <div v-if="!groupWithNext" :class="isOutgoing ? 'pr-[47px]' : 'pl-[47px]'">
+    <div v-if="!groupWithNext" :class="isOutgoing ? 'md:pr-[47px]' : 'md:pl-[47px]'">
       <Tooltip>
         <TooltipTrigger>
           <span class="text-muted-foreground text-xs mt-1">

From e4fb9770c7794d709fdb3380ecaba1aea32859f0 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 24 Sep 2026 00:10:21 +0530
Subject: [PATCH 169/178] make the phone message avatar bigger

---
 .../main/src/features/conversation/message/MessageBubble.vue    | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
index ea2410ce..9b5c7cd6 100644
--- a/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
+++ b/frontend/apps/main/src/features/conversation/message/MessageBubble.vue
@@ -6,7 +6,7 @@
       class="mb-1 flex items-center gap-1.5"
       :class="isOutgoing ? 'md:pr-[47px]' : 'md:pl-[47px]'"
     >
-      <Avatar class="w-5 h-5 text-[10px] md:hidden" :class="{ 'order-last': isOutgoing }">
+      <Avatar class="w-7 h-7 text-xs md:hidden" :class="{ 'order-last': isOutgoing }">
         <AvatarImage :src="getAvatar" />
         <AvatarFallback class="font-medium">
           {{ avatarFallback }}

From 5067eb256a752b32f16d692332f02dfcd0908845 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 24 Sep 2026 00:25:03 +0530
Subject: [PATCH 170/178] keep focus in the tag picker after each pick

---
 frontend/cypress/e2e/ui/conversationLifecycle.cy.js  |  8 ++++++--
 .../shared-ui/components/ui/select/SelectTag.vue     | 12 ++++++++----
 2 files changed, 14 insertions(+), 6 deletions(-)

diff --git a/frontend/cypress/e2e/ui/conversationLifecycle.cy.js b/frontend/cypress/e2e/ui/conversationLifecycle.cy.js
index b116f4c5..1639cad2 100644
--- a/frontend/cypress/e2e/ui/conversationLifecycle.cy.js
+++ b/frontend/cypress/e2e/ui/conversationLifecycle.cy.js
@@ -14,6 +14,8 @@ describe('Conversation lifecycle', () => {
   const ccContactLastName = `CcCustomer${stamp}`
   const ccContactName = `Lifecycle ${ccContactLastName}`
   const ccAddress = `lifecycle.cc.${stamp}@example.com`
+  const customerEmail = `lifecycle.customer.${stamp}@example.com`
+  const ccCustomerEmail = `lifecycle.cc-customer.${stamp}@example.com`
   const bccAddress = `lifecycle.bcc.${stamp}@example.com`
 
   const smtpHost = Cypress.env('SMTP_HOST') || '127.0.0.1'
@@ -120,7 +122,7 @@ describe('Conversation lifecycle', () => {
       })
       cy.api('POST', '/api/v1/conversations', {
         inbox_id: inboxID,
-        contact_email: `lifecycle.customer.${stamp}@example.com`,
+        contact_email: customerEmail,
         first_name: 'Lifecycle',
         last_name: contactLastName,
         subject,
@@ -131,7 +133,6 @@ describe('Conversation lifecycle', () => {
         expect(conversationUuid, 'conversation uuid').to.be.a('string').and.not.be.empty
       })
       // The reply box prefills CC from the last email, so this thread ends on an agent reply that CC'd someone.
-      const ccCustomerEmail = `lifecycle.cc-customer.${stamp}@example.com`
       cy.api('POST', '/api/v1/conversations', {
         inbox_id: inboxID,
         contact_email: ccCustomerEmail,
@@ -304,6 +305,8 @@ describe('Conversation lifecycle', () => {
 
     cy.contains(contactName).click()
     cy.location('pathname').should('include', conversationUuid)
+    // A filled TO box means the new thread has loaded.
+    recipientRow('TO:').find('input').should('have.value', customerEmail)
     cy.contains('label', 'CC:').should('not.exist')
     cy.contains('label', 'BCC:').should('not.exist')
     sendReply('Reply after switching away')
@@ -311,6 +314,7 @@ describe('Conversation lifecycle', () => {
 
     cy.contains(ccContactName).click()
     cy.location('pathname').should('include', ccConversationUuid)
+    recipientRow('TO:').find('input').should('have.value', ccCustomerEmail)
     recipientRow('CC:').find('input').should('have.value', ccAddress)
     cy.contains('label', 'BCC:').should('not.exist')
     sendReply('Reply after switching back')
diff --git a/frontend/shared-ui/components/ui/select/SelectTag.vue b/frontend/shared-ui/components/ui/select/SelectTag.vue
index 80b21c10..ed8c7d0c 100644
--- a/frontend/shared-ui/components/ui/select/SelectTag.vue
+++ b/frontend/shared-ui/components/ui/select/SelectTag.vue
@@ -1,6 +1,6 @@
 <template>
   <!-- idk why I named this select tag, should be named multi-select -->
-  <TagsInput v-model="tags" class="px-0 gap-0" :displayValue="getLabel">
+  <TagsInput ref="rootRef" v-model="tags" class="px-0 gap-0" :displayValue="getLabel">
     <!-- Tags visible to the user -->
     <div class="flex gap-2 flex-wrap items-center px-3">
       <TagsInputItem v-for="tagValue in tags" :key="tagValue" :value="tagValue">
@@ -78,7 +78,7 @@ import {
   ComboboxPortal,
   ComboboxRoot
 } from 'radix-vue'
-import { computed, ref, watch, onUnmounted } from 'vue'
+import { computed, nextTick, ref, watch, onUnmounted } from 'vue'
 import { useField } from 'vee-validate'
 import Spinner from '@shared-ui/components/ui/spinner/Spinner.vue'
 import { useRemoteSearch } from '@shared-ui/composables/useRemoteSearch'
@@ -123,6 +123,7 @@ const { handleBlur } = useField(() => props.name, undefined, {
 
 const open = ref(false)
 const searchTerm = ref('')
+const rootRef = ref(null)
 
 const {
   results: remoteItems,
@@ -175,8 +176,9 @@ const getLabel = (value) => {
   return item?.label || seenLabels.get(value) || value
 }
 
+// Closing the list here, not in the combobox, keeps focus in the input for the next pick.
 const handleSelect = (event) => {
-  if (props.keepOpenOnSelect) event.preventDefault()
+  event.preventDefault()
 
   const selectedValue = event.detail.value
   if (selectedValue) {
@@ -184,9 +186,11 @@ const handleSelect = (event) => {
     searchTerm.value = ''
   }
 
-  if (filteredOptions.value.length === 0) {
+  if (!props.keepOpenOnSelect || filteredOptions.value.length === 0) {
     open.value = false
   }
+
+  nextTick(() => rootRef.value?.$el?.querySelector('input')?.focus())
 }
 
 const filterFunc = (remainingItemValues, term) => {

From 96d29eb8ba7f6978a1ec1c68264fdd8268d1a280 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 24 Sep 2026 01:18:18 +0530
Subject: [PATCH 171/178] Update README.md

---
 README.md | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/README.md b/README.md
index eb2afc63..061caecc 100644
--- a/README.md
+++ b/README.md
@@ -16,7 +16,7 @@
 
 <br> Modern, open source, self-hosted omnichannel customer support desk. Live chat, email, and more in a single binary.
 
-![image](https://libredesk.io/hero-dark.png?q=5)
+![image](https://libredesk.io/hero-dark.png?v=1)
 
 
 Visit [libredesk.io](https://libredesk.io) for more info. Check out the [**live demo**](https://demo.libredesk.io/).

From f9fe57dacc8920b3ae64f29fb91017d6dcef575d Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Thu, 24 Sep 2026 01:54:57 +0530
Subject: [PATCH 172/178] move the reply box minimize line to the bottom of its
 button

---
 .../apps/main/src/features/conversation/ReplyBoxContent.vue     | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
index a641d26e..58cc29d7 100644
--- a/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
+++ b/frontend/apps/main/src/features/conversation/ReplyBoxContent.vue
@@ -33,7 +33,7 @@
           :aria-label="t('globals.terms.collapse')"
           @click="emit('minimize')"
         >
-          <Minus />
+          <Minus class="translate-y-1" />
         </Button>
         <Button
           class="text-muted-foreground max-md:h-11 max-md:w-11 max-md:p-0"

From fae3251dfcaa405ef9d19ce4ede38a12562d8461 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 25 Sep 2026 11:52:31 +0530
Subject: [PATCH 173/178] stop uploaded SVG files from running scripts

An upload could send a file type like "image/svg+xml; x". We saved that
type as sent, so it skipped the SVG check and the file opened in the tab
with scripts on. Types ending in +xml had the same hole.

We now clean up the type before saving it and again when serving it,
which also fixes files uploaded before this change. Files served from
libredesk get scripts turned off, except PDFs, because Chrome's PDF
viewer won't load that way. SVG and other XML types always download.

On S3, uploads store the cleaned type and a download or inline header
on the file.
---
 cmd/media.go                         |  20 ++--
 cmd/media_test.go                    |  57 +++++++++++
 internal/media/media.go              |  21 +----
 internal/media/models/models.go      |  30 +++++-
 internal/media/models/models_test.go |  57 +++++++++++
 internal/media/stores/s3/s3.go       |  11 ++-
 internal/media/stores/s3/s3_test.go  | 136 +++++++++++++++++++++++++++
 7 files changed, 296 insertions(+), 36 deletions(-)
 create mode 100644 internal/media/models/models_test.go
 create mode 100644 internal/media/stores/s3/s3_test.go

diff --git a/cmd/media.go b/cmd/media.go
index fb1234b0..8a0e44a6 100644
--- a/cmd/media.go
+++ b/cmd/media.go
@@ -255,22 +255,18 @@ func serveMediaFile(r *fastglue.Request, app *App, uuid string, media *mmodels.M
 	consts := app.consts.Load().(*constants)
 	switch consts.UploadProvider {
 	case "fs":
-		disposition := "attachment"
-
-		// Inline images/videos/pdfs. SVG excluded.
-		if !forceDownload &&
-			media.ContentType != "image/svg+xml" &&
-			(strings.HasPrefix(media.ContentType, "image/") ||
-				strings.HasPrefix(media.ContentType, "video/") ||
-				media.ContentType == "application/pdf") {
-			disposition = "inline"
+		// Older rows hold content types exactly as the client sent them.
+		contentType := mmodels.NormalizeContentType(media.ContentType)
+		disposition := mmodels.ContentDisposition(contentType)
+		if forceDownload {
+			disposition = mmodels.DispositionAttachment
 		}
 
-		r.RequestCtx.Response.Header.Set("Content-Type", media.ContentType)
+		r.RequestCtx.Response.Header.Set("Content-Type", contentType)
 		r.RequestCtx.Response.Header.Set("Content-Disposition", mime.FormatMediaType(disposition, map[string]string{"filename": media.Filename}))
 		r.RequestCtx.Response.Header.Set("X-Content-Type-Options", "nosniff")
-		// Sandbox SVGs.
-		if media.ContentType == "image/svg+xml" {
+		// Chrome's PDF viewer does not load in a sandboxed page.
+		if contentType != mmodels.ContentTypePDF {
 			r.RequestCtx.Response.Header.Set("Content-Security-Policy", "sandbox")
 		}
 		r.RequestCtx.Response.Header.Set("Cache-Control", fmt.Sprintf("%s, max-age=%d, immutable", cacheVisibility(media.Private), int(mediaCacheTTL.Seconds())))
diff --git a/cmd/media_test.go b/cmd/media_test.go
index 3cc8f86a..bbb6bcf1 100644
--- a/cmd/media_test.go
+++ b/cmd/media_test.go
@@ -3,7 +3,14 @@ package main
 import (
 	"bytes"
 	"encoding/json"
+	"os"
+	"path/filepath"
+	"strings"
 	"testing"
+
+	mmodels "github.com/abhinavxd/libredesk/internal/media/models"
+	"github.com/valyala/fasthttp"
+	"github.com/zerodha/fastglue"
 )
 
 func TestPrepareImageUploadAllowsOversizedImageWithoutThumbnail(t *testing.T) {
@@ -31,3 +38,53 @@ func TestPrepareImageUploadAllowsOversizedImageWithoutThumbnail(t *testing.T) {
 		t.Fatalf("dimensions = %dx%d, want 10000x5000", meta.Width, meta.Height)
 	}
 }
+
+func TestServeMediaFileSandboxesAllButPDF(t *testing.T) {
+	const uuid = "0b7a3c1e-2f4d-4b8a-9c6e-1d2f3a4b5c6d"
+	dir := t.TempDir()
+	svg := []byte(`<svg xmlns="http://www.w3.org/2000/svg"><script>alert(1)</script></svg>`)
+	if err := os.WriteFile(filepath.Join(dir, uuid), svg, 0o600); err != nil {
+		t.Fatal(err)
+	}
+	if err := ko.Set("upload.fs.upload_path", dir); err != nil {
+		t.Fatal(err)
+	}
+	t.Cleanup(func() { ko.Delete("upload.fs.upload_path") })
+
+	app := &App{}
+	app.consts.Store(&constants{UploadProvider: "fs"})
+
+	tests := []struct {
+		contentType     string
+		wantType        string
+		wantDisposition string
+		wantSandbox     bool
+	}{
+		{"image/svg+xml", "image/svg+xml", "attachment", true},
+		{"image/svg+xml; x", "image/svg+xml", "attachment", true},
+		{"image/x+xml", "image/x+xml", "attachment", true},
+		{"text/plain,image/svg+xml", "application/octet-stream", "attachment", true},
+		{"image/png", "image/png", "inline", true},
+		{"application/pdf", "application/pdf", "inline", false},
+	}
+	for _, tt := range tests {
+		t.Run(tt.contentType, func(t *testing.T) {
+			req := &fastglue.Request{RequestCtx: &fasthttp.RequestCtx{}, Context: app}
+			media := &mmodels.Media{ContentType: tt.contentType, Filename: "file", Private: true}
+			if err := serveMediaFile(req, app, uuid, media); err != nil {
+				t.Fatal(err)
+			}
+
+			h := &req.RequestCtx.Response.Header
+			if got := string(h.ContentType()); got != tt.wantType {
+				t.Fatalf("Content-Type = %q, want %q", got, tt.wantType)
+			}
+			if got := string(h.Peek("Content-Disposition")); !strings.HasPrefix(got, tt.wantDisposition) {
+				t.Fatalf("Content-Disposition = %q, want %s", got, tt.wantDisposition)
+			}
+			if got := string(h.Peek("Content-Security-Policy")) == "sandbox"; got != tt.wantSandbox {
+				t.Fatalf("sandboxed = %v, want %v", got, tt.wantSandbox)
+			}
+		})
+	}
+}
diff --git a/internal/media/media.go b/internal/media/media.go
index af1ce5b0..04f180d4 100644
--- a/internal/media/media.go
+++ b/internal/media/media.go
@@ -8,7 +8,6 @@ import (
 	"errors"
 	"fmt"
 	"io"
-	"mime"
 	"net/http"
 	"net/url"
 	"os"
@@ -260,15 +259,7 @@ func (m *Manager) GetBlob(name string) ([]byte, error) {
 
 // GetURL returns the URL for accessing a media file by its name.
 func (m *Manager) GetURL(uuid, contentType, fileName string) string {
-	// Keep some content types inline. SVG excluded.
-	disposition := "attachment"
-	if contentType != "image/svg+xml" &&
-		(strings.HasPrefix(contentType, "image/") ||
-			strings.HasPrefix(contentType, "video/") ||
-			contentType == "application/pdf") {
-		disposition = "inline"
-	}
-	return m.store.GetURL(uuid, disposition, fileName)
+	return m.store.GetURL(uuid, models.ContentDisposition(contentType), fileName)
 }
 
 func (m *Manager) GetURLForDownload(uuid, fileName string) string {
@@ -415,15 +406,7 @@ func (m *Manager) deleteUnlinkedRows(stmt *sqlx.Stmt) error {
 // For generic types, it uses http.DetectContentType (stdlib) as a fast path,
 // falling back to mimetype library for deeper inspection using magic numbers.
 func (m *Manager) detectContentType(sourceContentType string, content io.ReadSeeker) (string, error) {
-	// Set default if empty
-	if sourceContentType == "" {
-		sourceContentType = "application/octet-stream"
-	}
-
-	// Handle "image/svg+xml; charset=utf-8", keep just the type.
-	if mediaType, _, err := mime.ParseMediaType(sourceContentType); err == nil && mediaType != "" {
-		sourceContentType = mediaType
-	}
+	sourceContentType = models.NormalizeContentType(sourceContentType)
 
 	// Trust source unless it's a generic/useless type
 	if sourceContentType != "application/octet-stream" &&
diff --git a/internal/media/models/models.go b/internal/media/models/models.go
index 4d63e4d0..e2e3ceb4 100644
--- a/internal/media/models/models.go
+++ b/internal/media/models/models.go
@@ -2,6 +2,9 @@ package models
 
 import (
 	"encoding/json"
+	"errors"
+	"mime"
+	"strings"
 	"time"
 
 	"github.com/volatiletech/null/v9"
@@ -13,7 +16,11 @@ const (
 	ModelUser         = "users"
 	ModelHelpArticles = "help_articles"
 
-	DispositionInline = "inline"
+	DispositionInline     = "inline"
+	DispositionAttachment = "attachment"
+
+	ContentTypeOctetStream = "application/octet-stream"
+	ContentTypePDF         = "application/pdf"
 )
 
 // IsPublicModel reports whether media linked to the model type is served without authentication.
@@ -42,3 +49,24 @@ type Media struct {
 	URL     string `json:"url"`
 	Content []byte `json:"-"`
 }
+
+// NormalizeContentType returns the lowercased type/subtype of a Content-Type value, or application/octet-stream if it does not parse.
+func NormalizeContentType(contentType string) string {
+	mediaType, _, err := mime.ParseMediaType(contentType)
+	if (err != nil && !errors.Is(err, mime.ErrInvalidMediaParameter)) || !strings.Contains(mediaType, "/") {
+		return ContentTypeOctetStream
+	}
+	return mediaType
+}
+
+// ContentDisposition returns inline for images, video and PDF. XML types such as SVG can run scripts and are always attachments.
+func ContentDisposition(contentType string) string {
+	contentType = NormalizeContentType(contentType)
+	if strings.HasSuffix(contentType, "+xml") {
+		return DispositionAttachment
+	}
+	if strings.HasPrefix(contentType, "image/") || strings.HasPrefix(contentType, "video/") || contentType == ContentTypePDF {
+		return DispositionInline
+	}
+	return DispositionAttachment
+}
diff --git a/internal/media/models/models_test.go b/internal/media/models/models_test.go
new file mode 100644
index 00000000..3e29626d
--- /dev/null
+++ b/internal/media/models/models_test.go
@@ -0,0 +1,57 @@
+package models
+
+import "testing"
+
+func TestNormalizeContentType(t *testing.T) {
+	tests := []struct {
+		in   string
+		want string
+	}{
+		{"image/png", "image/png"},
+		{"IMAGE/SVG+XML", "image/svg+xml"},
+		{"image/svg+xml; charset=utf-8", "image/svg+xml"},
+		{"image/svg+xml; x", "image/svg+xml"},
+		{"Image/Svg+Xml; x", "image/svg+xml"},
+		{`image/svg+xml ; a="b`, "image/svg+xml"},
+		{"text/plain,image/svg+xml", ContentTypeOctetStream},
+		{"image", ContentTypeOctetStream},
+		{"", ContentTypeOctetStream},
+		{"garbage", ContentTypeOctetStream},
+	}
+	for _, tt := range tests {
+		t.Run(tt.in, func(t *testing.T) {
+			if got := NormalizeContentType(tt.in); got != tt.want {
+				t.Fatalf("NormalizeContentType(%q) = %q, want %q", tt.in, got, tt.want)
+			}
+		})
+	}
+}
+
+func TestContentDisposition(t *testing.T) {
+	tests := []struct {
+		in   string
+		want string
+	}{
+		{"image/png", DispositionInline},
+		{"video/mp4", DispositionInline},
+		{"application/pdf", DispositionInline},
+		{"Application/PDF; x", DispositionInline},
+		{"image/svg+xml", DispositionAttachment},
+		{"image/svg+xml; x", DispositionAttachment},
+		{"IMAGE/SVG+XML", DispositionAttachment},
+		{"image/x+xml", DispositionAttachment},
+		{"video/x+xml", DispositionAttachment},
+		{"application/xhtml+xml", DispositionAttachment},
+		{"text/html", DispositionAttachment},
+		{"text/xml", DispositionAttachment},
+		{"text/plain,image/svg+xml", DispositionAttachment},
+		{"", DispositionAttachment},
+	}
+	for _, tt := range tests {
+		t.Run(tt.in, func(t *testing.T) {
+			if got := ContentDisposition(tt.in); got != tt.want {
+				t.Fatalf("ContentDisposition(%q) = %q, want %q", tt.in, got, tt.want)
+			}
+		})
+	}
+}
diff --git a/internal/media/stores/s3/s3.go b/internal/media/stores/s3/s3.go
index db8ad0f1..8a8d43d8 100644
--- a/internal/media/stores/s3/s3.go
+++ b/internal/media/stores/s3/s3.go
@@ -12,6 +12,7 @@ import (
 	"time"
 
 	"github.com/abhinavxd/libredesk/internal/media"
+	"github.com/abhinavxd/libredesk/internal/media/models"
 	"github.com/rhnvrm/simples3"
 )
 
@@ -67,11 +68,13 @@ func New(opt Opt) (media.Store, error) {
 // Put uploads a file to S3 with the specified name, content type, and file content.
 // It returns the name of the file or an error if the upload fails.
 func (c *Client) Put(name string, cType string, file io.ReadSeeker) (string, error) {
+	cType = models.NormalizeContentType(cType)
 	p := simples3.UploadInput{
-		Bucket:      c.opts.Bucket,
-		ContentType: cType,
-		FileName:    name,
-		Body:        file,
+		Bucket:             c.opts.Bucket,
+		ContentType:        cType,
+		ContentDisposition: models.ContentDisposition(cType),
+		FileName:           name,
+		Body:               file,
 		// Paths inside the bucket should not start with /.
 		ObjectKey: c.makeBucketPath(name),
 	}
diff --git a/internal/media/stores/s3/s3_test.go b/internal/media/stores/s3/s3_test.go
new file mode 100644
index 00000000..23f6e259
--- /dev/null
+++ b/internal/media/stores/s3/s3_test.go
@@ -0,0 +1,136 @@
+package s3
+
+import (
+	"io"
+	"mime"
+	"net/http"
+	"net/http/httptest"
+	"net/url"
+	"strings"
+	"testing"
+
+	"github.com/abhinavxd/libredesk/internal/media/models"
+	"github.com/google/uuid"
+)
+
+func TestPutStoresSafeContentHeaders(t *testing.T) {
+	tests := []struct {
+		contentType string
+		wantType    string
+		disposition string
+	}{
+		{"image/svg+xml", "image/svg+xml", "attachment"},
+		{"IMAGE/SVG+XML; x", "image/svg+xml", "attachment"},
+		{`image/svg+xml; charset="unterminated`, "image/svg+xml", "attachment"},
+		{"image/svg+xml; charset=utf-8; charset=ascii", "application/octet-stream", "attachment"},
+		{"text/plain,image/svg+xml", "application/octet-stream", "attachment"},
+		{"image/x+xml", "image/x+xml", "attachment"},
+		{"text/html", "text/html", "attachment"},
+		{"", "application/octet-stream", "attachment"},
+		{"image/png", "image/png", "inline"},
+		{"video/mp4", "video/mp4", "inline"},
+		{"application/pdf", "application/pdf", "inline"},
+	}
+	for _, tt := range tests {
+		t.Run(tt.contentType, func(t *testing.T) {
+			body := `<svg xmlns="http://www.w3.org/2000/svg"><script>alert(1)</script></svg>`
+			requests := make(chan http.Header, 1)
+			server := httptest.NewServer(http.HandlerFunc(func(w http.ResponseWriter, r *http.Request) {
+				if r.Method != http.MethodPut || r.URL.Path != "/test-bucket/uploads/file" {
+					t.Errorf("unexpected request: %s %s", r.Method, r.URL.Path)
+				}
+				got, err := io.ReadAll(r.Body)
+				if err != nil || string(got) != body {
+					t.Errorf("uploaded body = %q, error = %v", got, err)
+				}
+				requests <- r.Header.Clone()
+				w.WriteHeader(http.StatusOK)
+			}))
+			defer server.Close()
+
+			store, err := New(Opt{
+				URL:        server.URL,
+				PublicURL:  "https://cdn.example.com",
+				AccessKey:  uuid.NewString(),
+				SecretKey:  uuid.NewString(),
+				Region:     "test-region",
+				Bucket:     "test-bucket",
+				BucketPath: "uploads",
+				BucketType: "private",
+			})
+			if err != nil {
+				t.Fatal(err)
+			}
+			if _, err := store.Put("file", tt.contentType, strings.NewReader(body)); err != nil {
+				t.Fatal(err)
+			}
+
+			headers := <-requests
+			if got := headers.Get("Content-Type"); got != tt.wantType {
+				t.Errorf("Content-Type = %q, want %q", got, tt.wantType)
+			}
+			if got := headers.Get("Content-Disposition"); got != tt.disposition {
+				t.Errorf("Content-Disposition = %q, want %q", got, tt.disposition)
+			}
+		})
+	}
+}
+
+func TestGetURLPreservesPublicURLs(t *testing.T) {
+	tests := []struct {
+		name        string
+		bucketType  string
+		publicURL   string
+		disposition string
+		wantHost    string
+		wantPath    string
+		wantSigned  bool
+	}{
+		{"private download", "private", "", models.DispositionAttachment, "storage.example.com", "/test-bucket/uploads/existing-file", true},
+		{"private inline", "private", "", models.DispositionInline, "storage.example.com", "/test-bucket/uploads/existing-file", true},
+		{"private custom download", "private", "https://cdn.example.com", models.DispositionAttachment, "cdn.example.com", "/uploads/existing-file", false},
+		{"private custom inline", "private", "https://cdn.example.com", models.DispositionInline, "cdn.example.com", "/uploads/existing-file", false},
+		{"public download", "public", "", models.DispositionAttachment, "storage.example.com", "/test-bucket/uploads/existing-file", false},
+		{"public inline", "public", "", models.DispositionInline, "storage.example.com", "/test-bucket/uploads/existing-file", false},
+		{"public custom download", "public", "https://cdn.example.com", models.DispositionAttachment, "cdn.example.com", "/uploads/existing-file", false},
+		{"public custom inline", "public", "https://cdn.example.com", models.DispositionInline, "cdn.example.com", "/uploads/existing-file", false},
+	}
+	for _, tt := range tests {
+		t.Run(tt.name, func(t *testing.T) {
+			store, err := New(Opt{
+				URL:        "https://storage.example.com",
+				PublicURL:  tt.publicURL,
+				AccessKey:  uuid.NewString(),
+				SecretKey:  uuid.NewString(),
+				Region:     "test-region",
+				Bucket:     "test-bucket",
+				BucketPath: "uploads",
+				BucketType: tt.bucketType,
+			})
+			if err != nil {
+				t.Fatal(err)
+			}
+			filename := "customer attachment.svg"
+			u, err := url.Parse(store.GetURL("existing-file", tt.disposition, filename))
+			if err != nil {
+				t.Fatal(err)
+			}
+
+			if u.Host != tt.wantHost || u.Path != tt.wantPath {
+				t.Errorf("URL target = %s%s, want %s%s", u.Host, u.Path, tt.wantHost, tt.wantPath)
+			}
+			query := u.Query()
+			if got := query.Get("X-Amz-Signature") != ""; got != tt.wantSigned {
+				t.Errorf("signed URL = %v, want %v", got, tt.wantSigned)
+			}
+			if tt.wantSigned {
+				got, params, err := mime.ParseMediaType(query.Get("response-content-disposition"))
+				if err != nil || got != tt.disposition || params["filename"] != filename {
+					t.Errorf("download disposition = %q, filename = %q, error = %v", got, params["filename"], err)
+				}
+			} else if u.RawQuery != "" {
+				t.Error("public URL has unexpected query parameters")
+			}
+		})
+	}
+}

From 7c79f6e44d949cfea3e26ed6ecef60df8d346f0b Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 25 Sep 2026 14:39:55 +0530
Subject: [PATCH 174/178] fix content spilling out of panels and dialogs when
 zoomed in or out

---
 .../apps/main/src/features/command/CommandBox.vue   |  2 +-
 .../list/ConversationBulkActionToolbar.vue          |  2 +-
 .../features/conversation/list/ConversationList.vue |  2 +-
 .../sidebar/ConversationSideBarContact.vue          |  6 +++---
 .../views/conversation/ConversationDetailView.vue   | 13 +++++++++----
 5 files changed, 15 insertions(+), 10 deletions(-)

diff --git a/frontend/apps/main/src/features/command/CommandBox.vue b/frontend/apps/main/src/features/command/CommandBox.vue
index 3cef5694..085e101f 100644
--- a/frontend/apps/main/src/features/command/CommandBox.vue
+++ b/frontend/apps/main/src/features/command/CommandBox.vue
@@ -33,7 +33,7 @@
       :key="parent || 'root'"
       :class="
         isMacroMode
-          ? 'h-[50vh] min-h-[50vh] min-w-[50vw] overflow-hidden [&>div]:h-full'
+          ? 'h-[50vh] min-h-[50vh] overflow-hidden [&>div]:h-full'
           : 'h-auto min-h-[220px] max-h-[min(52vh,440px)]'
       "
     >
diff --git a/frontend/apps/main/src/features/conversation/list/ConversationBulkActionToolbar.vue b/frontend/apps/main/src/features/conversation/list/ConversationBulkActionToolbar.vue
index ed893f75..94e373ee 100644
--- a/frontend/apps/main/src/features/conversation/list/ConversationBulkActionToolbar.vue
+++ b/frontend/apps/main/src/features/conversation/list/ConversationBulkActionToolbar.vue
@@ -2,7 +2,7 @@
   <div
     role="toolbar"
     :aria-label="t('conversation.bulkActions.toolbar')"
-    class="p-2 flex items-center gap-1 bg-muted/30"
+    class="p-2 flex flex-wrap items-center gap-1 bg-muted/30"
   >
     <Checkbox
       :checked="conversationStore.allSelected"
diff --git a/frontend/apps/main/src/features/conversation/list/ConversationList.vue b/frontend/apps/main/src/features/conversation/list/ConversationList.vue
index 3a2d92ad..43016ca4 100644
--- a/frontend/apps/main/src/features/conversation/list/ConversationList.vue
+++ b/frontend/apps/main/src/features/conversation/list/ConversationList.vue
@@ -10,7 +10,7 @@
     <ConversationBulkActionToolbar v-if="hasSelection && canBulkAct" />
 
     <!-- Filters (hidden when bulk selecting) -->
-    <div v-else class="p-2 flex justify-between items-center">
+    <div v-else class="p-2 flex flex-wrap justify-between items-center">
       <!-- Status dropdown-menu, hidden when a view is selected as views are pre-filtered -->
       <DropdownMenu v-if="!route.params.viewID">
         <DropdownMenuTrigger asChild>
diff --git a/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue b/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue
index 4f1adcec..059b37c4 100644
--- a/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue
+++ b/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue
@@ -27,16 +27,16 @@
       </Button>
     </div>
 
-    <div class="h-6 flex items-center gap-2">
+    <div class="min-h-6 flex items-center gap-2">
       <router-link
         v-if="userStore.can('contacts:read') && conversation?.contact_id"
         :to="{ name: 'contact-detail', params: { id: conversation.contact_id } }"
-        class="flex items-center gap-2 hover:underline cursor-pointer"
+        class="flex min-w-0 items-center gap-2 break-words hover:underline cursor-pointer"
       >
         {{ conversation?.contact?.first_name + ' ' + conversation?.contact?.last_name }}
         <ExternalLink size="16" class="text-muted-foreground flex-shrink-0" />
       </router-link>
-      <span v-else>
+      <span v-else class="min-w-0 break-words">
         {{ conversation?.contact?.first_name + ' ' + conversation?.contact?.last_name }}
       </span>
     </div>
diff --git a/frontend/apps/main/src/views/conversation/ConversationDetailView.vue b/frontend/apps/main/src/views/conversation/ConversationDetailView.vue
index 04da5138..d8759e99 100644
--- a/frontend/apps/main/src/views/conversation/ConversationDetailView.vue
+++ b/frontend/apps/main/src/views/conversation/ConversationDetailView.vue
@@ -23,7 +23,7 @@
       <!-- Sidebar Panel (collapsible) -->
       <ResizablePanel
         ref="sidebarPanelRef"
-        :default-size="panelSizes[1]"
+        :default-size="sidebarOpen ? panelSizes[1] : 0"
         :min-size="15"
         :max-size="60"
         :collapsible="true"
@@ -69,6 +69,8 @@
 </template>
 
 <script setup>
+const DEFAULT_PANEL_SIZES = [70, 30]
+
 import { ref, computed, watch, onMounted, onUnmounted, nextTick } from 'vue'
 import { useRoute } from 'vue-router'
 import { useStorage, useDocumentVisibility } from '@vueuse/core'
@@ -92,7 +94,9 @@ const emitter = useEmitter()
 const isMobile = useIsMobile()
 const sidebarPanelRef = ref(null)
 const sidebarOpen = useStorage('conversationSidebarOpen', true)
-const panelSizes = useStorage('conversationDetailPanelSizes', [70, 30])
+const panelSizes = useStorage('conversationDetailPanelSizes', DEFAULT_PANEL_SIZES)
+// Older builds saved the collapsed [100, 0], which would reopen the panel at zero width.
+if (!(panelSizes.value[1] > 0)) panelSizes.value = DEFAULT_PANEL_SIZES
 const sheetSidebarOpen = ref(false)
 
 const showContent = computed(
@@ -113,7 +117,7 @@ const toggleSidebar = () => {
   if (sidebarOpen.value) {
     sidebarPanelRef.value?.collapse()
   } else {
-    sidebarPanelRef.value?.expand()
+    sidebarPanelRef.value?.resize(panelSizes.value[1])
   }
 }
 
@@ -126,7 +130,8 @@ const onSidebarExpand = () => {
 }
 
 const onLayoutChange = (sizes) => {
-  if (sidebarOpen.value && sizes.length === 2) {
+  // Layout fires before the collapse event, and saving the collapsed [100, 0] reopens the panel at its minimum width.
+  if (sizes.length === 2 && sizes[1] > 0) {
     panelSizes.value = sizes
   }
 }

From 8ec3b1a0c7ecfbfaa00a5d3c801d038b0a8d7b69 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 25 Sep 2026 17:44:45 +0530
Subject: [PATCH 175/178] wrap long one-word contact names inside the sidebar

---
 .../conversation/sidebar/ConversationSideBarContact.vue     | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue b/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue
index 059b37c4..cbc1e58a 100644
--- a/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue
+++ b/frontend/apps/main/src/features/conversation/sidebar/ConversationSideBarContact.vue
@@ -31,9 +31,11 @@
       <router-link
         v-if="userStore.can('contacts:read') && conversation?.contact_id"
         :to="{ name: 'contact-detail', params: { id: conversation.contact_id } }"
-        class="flex min-w-0 items-center gap-2 break-words hover:underline cursor-pointer"
+        class="flex min-w-0 items-center gap-2 hover:underline cursor-pointer"
       >
-        {{ conversation?.contact?.first_name + ' ' + conversation?.contact?.last_name }}
+        <span class="min-w-0 break-words">
+          {{ conversation?.contact?.first_name + ' ' + conversation?.contact?.last_name }}
+        </span>
         <ExternalLink size="16" class="text-muted-foreground flex-shrink-0" />
       </router-link>
       <span v-else class="min-w-0 break-words">

From dc516bdd203f4f2ad810b05860181e7413ae3163 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 25 Sep 2026 18:36:03 +0530
Subject: [PATCH 176/178] refactor: replace string literals with constants for
 content disposition

---
 internal/media/media.go | 8 ++++----
 1 file changed, 4 insertions(+), 4 deletions(-)

diff --git a/internal/media/media.go b/internal/media/media.go
index 04f180d4..17c68229 100644
--- a/internal/media/media.go
+++ b/internal/media/media.go
@@ -263,7 +263,7 @@ func (m *Manager) GetURL(uuid, contentType, fileName string) string {
 }
 
 func (m *Manager) GetURLForDownload(uuid, fileName string) string {
-	return m.store.GetURL(uuid, "attachment", fileName)
+	return m.store.GetURL(uuid, models.DispositionAttachment, fileName)
 }
 
 // GetSignedURL generates a signed URL for secure media access if the store supports it.
@@ -290,7 +290,7 @@ func (m *Manager) GetThumbnailURL(uuid string) string {
 			return u.String()
 		}
 	}
-	return m.store.GetURL(image.ThumbPrefix+uuid, "inline", "")
+	return m.store.GetURL(image.ThumbPrefix+uuid, models.DispositionInline, "")
 }
 
 // SignedURLValidator returns the store's signature validator if available.
@@ -409,7 +409,7 @@ func (m *Manager) detectContentType(sourceContentType string, content io.ReadSee
 	sourceContentType = models.NormalizeContentType(sourceContentType)
 
 	// Trust source unless it's a generic/useless type
-	if sourceContentType != "application/octet-stream" &&
+	if sourceContentType != models.ContentTypeOctetStream &&
 		sourceContentType != "application/data" &&
 		sourceContentType != "application/binary" {
 		m.lo.Debug("detected media content type from trusted source", "detected_type", sourceContentType)
@@ -426,7 +426,7 @@ func (m *Manager) detectContentType(sourceContentType string, content io.ReadSee
 
 	// If stdlib gives a useful type, use it.
 	// stdlib defaults to application/octet-stream for unknown types.
-	if detected != "application/octet-stream" {
+	if detected != models.ContentTypeOctetStream {
 		content.Seek(0, io.SeekStart)
 		m.lo.Debug("detected media content type using stdlib", "detected_type", detected, "source_type", sourceContentType)
 		return detected, nil

From 8272aa2d07277d00ebafd64105ef5837bc380670 Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 25 Sep 2026 18:52:50 +0530
Subject: [PATCH 177/178] add forced download cases to the media serve test

---
 cmd/media_test.go       | 21 ++++++++++++++-------
 internal/media/media.go |  2 +-
 2 files changed, 15 insertions(+), 8 deletions(-)

diff --git a/cmd/media_test.go b/cmd/media_test.go
index bbb6bcf1..f6330454 100644
--- a/cmd/media_test.go
+++ b/cmd/media_test.go
@@ -55,21 +55,28 @@ func TestServeMediaFileSandboxesAllButPDF(t *testing.T) {
 	app.consts.Store(&constants{UploadProvider: "fs"})
 
 	tests := []struct {
+		name            string
 		contentType     string
+		download        bool
 		wantType        string
 		wantDisposition string
 		wantSandbox     bool
 	}{
-		{"image/svg+xml", "image/svg+xml", "attachment", true},
-		{"image/svg+xml; x", "image/svg+xml", "attachment", true},
-		{"image/x+xml", "image/x+xml", "attachment", true},
-		{"text/plain,image/svg+xml", "application/octet-stream", "attachment", true},
-		{"image/png", "image/png", "inline", true},
-		{"application/pdf", "application/pdf", "inline", false},
+		{"svg", "image/svg+xml", false, "image/svg+xml", "attachment", true},
+		{"svg with bad param", "image/svg+xml; x", false, "image/svg+xml", "attachment", true},
+		{"other xml image", "image/x+xml", false, "image/x+xml", "attachment", true},
+		{"unparseable", "text/plain,image/svg+xml", false, "application/octet-stream", "attachment", true},
+		{"png", "image/png", false, "image/png", "inline", true},
+		{"png forced download", "image/png", true, "image/png", "attachment", true},
+		{"pdf", "application/pdf", false, "application/pdf", "inline", false},
+		{"pdf forced download", "application/pdf", true, "application/pdf", "attachment", false},
 	}
 	for _, tt := range tests {
-		t.Run(tt.contentType, func(t *testing.T) {
+		t.Run(tt.name, func(t *testing.T) {
 			req := &fastglue.Request{RequestCtx: &fasthttp.RequestCtx{}, Context: app}
+			if tt.download {
+				req.RequestCtx.Request.SetRequestURI("/uploads/" + uuid + "?download=1")
+			}
 			media := &mmodels.Media{ContentType: tt.contentType, Filename: "file", Private: true}
 			if err := serveMediaFile(req, app, uuid, media); err != nil {
 				t.Fatal(err)
diff --git a/internal/media/media.go b/internal/media/media.go
index 17c68229..999d538f 100644
--- a/internal/media/media.go
+++ b/internal/media/media.go
@@ -290,7 +290,7 @@ func (m *Manager) GetThumbnailURL(uuid string) string {
 			return u.String()
 		}
 	}
-	return m.store.GetURL(image.ThumbPrefix+uuid, models.DispositionInline, "")
+	return m.store.GetURL(image.ThumbPrefix+uuid, models.DispositionInline, "" /** fileName **/)
 }
 
 // SignedURLValidator returns the store's signature validator if available.

From 6f77cfb1ad2783d2cdb51c65a5860f714988e3dc Mon Sep 17 00:00:00 2001
From: Abhinav Raut <abhinavrautcs@gmail.com>
Date: Fri, 25 Sep 2026 20:01:43 +0530
Subject: [PATCH 178/178] sandbox only downloaded files so videos play in
 Chrome again

---
 cmd/media.go      | 5 +++--
 cmd/media_test.go | 9 ++++++---
 2 files changed, 9 insertions(+), 5 deletions(-)

diff --git a/cmd/media.go b/cmd/media.go
index 8a0e44a6..b539d8c4 100644
--- a/cmd/media.go
+++ b/cmd/media.go
@@ -265,8 +265,9 @@ func serveMediaFile(r *fastglue.Request, app *App, uuid string, media *mmodels.M
 		r.RequestCtx.Response.Header.Set("Content-Type", contentType)
 		r.RequestCtx.Response.Header.Set("Content-Disposition", mime.FormatMediaType(disposition, map[string]string{"filename": media.Filename}))
 		r.RequestCtx.Response.Header.Set("X-Content-Type-Options", "nosniff")
-		// Chrome's PDF viewer does not load in a sandboxed page.
-		if contentType != mmodels.ContentTypePDF {
+		// Chrome's video and PDF viewers break in a sandbox, and inline types run no script anyway.
+		// Downloads are sandboxed for webviews that render attachments inline.
+		if disposition == mmodels.DispositionAttachment {
 			r.RequestCtx.Response.Header.Set("Content-Security-Policy", "sandbox")
 		}
 		r.RequestCtx.Response.Header.Set("Cache-Control", fmt.Sprintf("%s, max-age=%d, immutable", cacheVisibility(media.Private), int(mediaCacheTTL.Seconds())))
diff --git a/cmd/media_test.go b/cmd/media_test.go
index f6330454..b8234bff 100644
--- a/cmd/media_test.go
+++ b/cmd/media_test.go
@@ -39,7 +39,7 @@ func TestPrepareImageUploadAllowsOversizedImageWithoutThumbnail(t *testing.T) {
 	}
 }
 
-func TestServeMediaFileSandboxesAllButPDF(t *testing.T) {
+func TestServeMediaFileSandboxesDownloads(t *testing.T) {
 	const uuid = "0b7a3c1e-2f4d-4b8a-9c6e-1d2f3a4b5c6d"
 	dir := t.TempDir()
 	svg := []byte(`<svg xmlns="http://www.w3.org/2000/svg"><script>alert(1)</script></svg>`)
@@ -66,10 +66,13 @@ func TestServeMediaFileSandboxesAllButPDF(t *testing.T) {
 		{"svg with bad param", "image/svg+xml; x", false, "image/svg+xml", "attachment", true},
 		{"other xml image", "image/x+xml", false, "image/x+xml", "attachment", true},
 		{"unparseable", "text/plain,image/svg+xml", false, "application/octet-stream", "attachment", true},
-		{"png", "image/png", false, "image/png", "inline", true},
+		{"html", "text/html", false, "text/html", "attachment", true},
+		{"png", "image/png", false, "image/png", "inline", false},
 		{"png forced download", "image/png", true, "image/png", "attachment", true},
+		{"video", "video/mp4", false, "video/mp4", "inline", false},
+		{"video forced download", "video/mp4", true, "video/mp4", "attachment", true},
 		{"pdf", "application/pdf", false, "application/pdf", "inline", false},
-		{"pdf forced download", "application/pdf", true, "application/pdf", "attachment", false},
+		{"pdf forced download", "application/pdf", true, "application/pdf", "attachment", true},
 	}
 	for _, tt := range tests {
 		t.Run(tt.name, func(t *testing.T) {