fix(ai): compute email recipients for AI and automated replies

- Add SendAutoReply method that automatically determines to/cc/bcc based on conversation history. Fixes AI assistant replies failing for email conversations while maintaining livechat compatibility.

.github/workflows/github-pages.yml

@@ -0,0 +1,31 @@
+name: Deploy MkDocs
+
+on:
+  push:
+    branches:
+      - main
+
+jobs:
+  deploy:
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+
+      - uses: actions/setup-python@v4
+        with:
+          python-version: 3.x
+
+      - run: pip install mkdocs-material
+
+      - run: |
+          if [ -f requirements.txt ]; then
+            pip install -r requirements.txt;
+          fi
+
+      - run: cd docs && mkdocs build
+
+      - name: Deploy to GitHub Pages
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          publish_dir: ./docs/site

Makefile

@@ -15,7 +15,7 @@ GOPATH ?= $(HOME)/go
 STUFFBIN ?= $(GOPATH)/bin/stuffbin
 
 # The default target to run when `make` is executed.
-.DEFAULT_GOAL := build  
+.DEFAULT_GOAL := build 
 
 # Install stuffbin if it doesn't exist.
 $(STUFFBIN):
@@ -28,11 +28,24 @@ install-deps: $(STUFFBIN)
 	@echo "→ Installing frontend dependencies..."
 	@cd ${FRONTEND_DIR} && pnpm install
 
-# Build the frontend for production.
+# Build the frontend for production (both apps).
 .PHONY: frontend-build
 frontend-build: install-deps
-	@echo "→ Building frontend for production..."
-	@export VITE_APP_VERSION="${VERSION}" && cd ${FRONTEND_DIR} && pnpm build
+	@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
+
+# Build only the main frontend app.
+.PHONY: frontend-build-main
+frontend-build-main: install-deps
+	@echo "→ Building main frontend app for production..."
+	@export VITE_APP_VERSION="${VERSION}" && cd ${FRONTEND_DIR} && pnpm build:main
+
+# Build only the widget frontend app.
+.PHONY: frontend-build-widget
+frontend-build-widget: install-deps
+	@echo "→ Building widget frontend app for production..."
+	@export VITE_APP_VERSION="${VERSION}" && cd ${FRONTEND_DIR} && pnpm build:widget
 
 # Run the Go backend server in development mode.
 .PHONY: run-backend
@@ -40,13 +53,29 @@ run-backend:
 	@echo "→ Running backend..."
 	CGO_ENABLED=0 go run -ldflags="-s -w -X 'main.buildString=${BUILDSTR}' -X 'main.versionString=${VERSION}' -X 'github.com/abhinavxd/libredesk/internal/version.Version=${VERSION}' -X 'main.frontendDir=frontend/dist'" cmd/*.go
 
-# Run the JS frontend server in development mode.
+# Run the JS frontend server in development mode (main app only).
 .PHONY: run-frontend
 run-frontend:
 	@echo "→ Installing frontend dependencies (if not already installed)..."
 	@cd ${FRONTEND_DIR} && pnpm install
-	@echo "→ Running frontend..."
-	@export VITE_APP_VERSION="${VERSION}" && cd ${FRONTEND_DIR} && pnpm dev
+	@echo "→ Running main frontend app..."
+	@export VITE_APP_VERSION="${VERSION}" && cd ${FRONTEND_DIR} && pnpm dev:main
+
+# Run the main frontend app in development mode.
+.PHONY: run-frontend-main
+run-frontend-main:
+	@echo "→ Installing frontend dependencies (if not already installed)..."
+	@cd ${FRONTEND_DIR} && pnpm install
+	@echo "→ Running main frontend app..."
+	@export VITE_APP_VERSION="${VERSION}" && cd ${FRONTEND_DIR} && pnpm dev:main
+
+# Run the widget frontend app in development mode.
+.PHONY: run-frontend-widget
+run-frontend-widget:
+	@echo "→ Installing frontend dependencies (if not already installed)..."
+	@cd ${FRONTEND_DIR} && pnpm install
+	@echo "→ Running widget frontend app..."
+	@export VITE_APP_VERSION="${VERSION}" && cd ${FRONTEND_DIR} && pnpm dev:widget
 
 # Build the backend binary.
 .PHONY: build-backend

README.md

@@ -3,13 +3,15 @@
 
 # Libredesk
 
-Modern, open source, self-hosted customer support desk. Single binary app. 
+Open source, self-hosted customer support desk. Single binary app.
 
-![image](https://libredesk.io/hero.png)
+![image](docs/docs/images/hero.png)
 
 
 Visit [libredesk.io](https://libredesk.io) for more info. Check out the [**Live demo**](https://demo.libredesk.io/).
 
+> **CAUTION:** This project is currently in **alpha**. Features and APIs may change and are not yet fully tested.
+
 ## Features
 
 - **Multi Shared Inbox**  
@@ -65,7 +67,7 @@ docker exec -it libredesk_app ./libredesk --set-system-user-password
 
 Go to `http://localhost:9000` and login with username `System` and the password you set using the `--set-system-user-password` command.
 
-See [installation docs](https://docs.libredesk.io/getting-started/installation)
+See [installation docs](https://libredesk.io/docs/installation/)
 
 __________________
 
@@ -76,12 +78,17 @@ __________________
 - Run `./libredesk --set-system-user-password` to set the password for the System user.
 - Run `./libredesk` and visit `http://localhost:9000` and login with username `System` and the password you set using the --set-system-user-password command.
 
-See [installation docs](https://docs.libredesk.io/getting-started/installation)
+See [installation docs](https://libredesk.io/docs/installation)
 __________________
 
 
 ## Developers
-If you are interested in contributing, refer to the [developer setup](https://docs.libredesk.io/contributing/developer-setup). The backend is written in Go and the frontend is Vue js 3 with Shadcn for UI components.
+If you are interested in contributing, refer to the [developer setup](https://libredesk.io/docs/developer-setup/). The backend is written in Go and the frontend is Vue js 3 with Shadcn for UI components.
+
+## Development Status
+
+Libredesk is under active development.  
+Track roadmap and progress on the GitHub Project Board:   [https://github.com/users/abhinavxd/projects/1](https://github.com/users/abhinavxd/projects/1)
 
 
 ## Translators

cmd/ai_assistants.go

@@ -0,0 +1,193 @@
+package main
+
+import (
+	"encoding/json"
+	"strconv"
+
+	"github.com/abhinavxd/libredesk/internal/envelope"
+	umodels "github.com/abhinavxd/libredesk/internal/user/models"
+	"github.com/valyala/fasthttp"
+	"github.com/volatiletech/null/v9"
+	"github.com/zerodha/fastglue"
+)
+
+type aiAssisantRequest struct {
+	FirstName          string `json:"first_name"`
+	LastName           string `json:"last_name"`
+	Email              string `json:"email"`
+	AvatarURL          string `json:"avatar_url"`
+	ProductName        string `json:"product_name"`
+	ProductDescription string `json:"product_description"`
+	AnswerLength       string `json:"answer_length"`
+	AnswerTone         string `json:"answer_tone"`
+	HandOff            bool   `json:"hand_off"`
+	HandOffTeam        int    `json:"hand_off_team"`
+	Enabled            bool   `json:"enabled"`
+}
+
+// handleGetAIAssistants returns all AI assistants from the database.
+func handleGetAIAssistants(r *fastglue.Request) error {
+	var app = r.Context.(*App)
+	assistants, err := app.user.GetAIAssistants()
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(assistants)
+}
+
+// handleGetAIAssistant returns a single AI assistant by ID.
+func handleGetAIAssistant(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.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+	assistant, err := app.user.GetAIAssistant(id)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(assistant)
+}
+
+// handleCreateAIAssistant creates a new AI assistant in the database.
+func handleCreateAIAssistant(r *fastglue.Request) error {
+	var (
+		app = r.Context.(*App)
+		req = aiAssisantRequest{}
+	)
+
+	if err := r.Decode(&req, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
+	}
+
+	if err := validateAIAssistantRequest(req, app); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	// Prepare meta data
+	meta := umodels.AIAssistantMeta{
+		ProductName:        req.ProductName,
+		ProductDescription: req.ProductDescription,
+		AnswerLength:       req.AnswerLength,
+		AnswerTone:         req.AnswerTone,
+		HandOff:            req.HandOff,
+		HandOffTeam:        req.HandOffTeam,
+	}
+
+	metaBytes, err := json.Marshal(meta)
+	if err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, app.i18n.Ts("globals.messages.errorMarshalling", "name", "{globals.terms.meta}"), err.Error(), envelope.GeneralError)
+	}
+
+	// Create AI assistant in the database
+	assistant := &umodels.User{
+		FirstName: req.FirstName,
+		LastName:  req.LastName,
+		Email:     null.NewString(req.Email, req.Email != ""),
+		AvatarURL: null.NewString(req.AvatarURL, req.AvatarURL != ""),
+		Type:      umodels.UserTypeAIAssistant,
+		Enabled:   true,
+		Meta:      metaBytes,
+	}
+	if err := app.user.CreateAIAssistant(assistant); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	return r.SendEnvelope(assistant)
+}
+
+// handleUpdateAIAssistant updates an existing AI assistant in the database.
+func handleUpdateAIAssistant(r *fastglue.Request) error {
+	var (
+		app   = r.Context.(*App)
+		req   = aiAssisantRequest{}
+		id, _ = strconv.Atoi(r.RequestCtx.UserValue("id").(string))
+	)
+	if id <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+
+	if err := r.Decode(&req, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
+	}
+
+	if err := validateAIAssistantRequest(req, app); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	// Prepare meta data
+	meta := umodels.AIAssistantMeta{
+		ProductName:        req.ProductName,
+		ProductDescription: req.ProductDescription,
+		AnswerLength:       req.AnswerLength,
+		AnswerTone:         req.AnswerTone,
+		HandOff:            req.HandOff,
+		HandOffTeam:        req.HandOffTeam,
+	}
+
+	metaBytes, err := json.Marshal(meta)
+	if err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, "Error encoding meta data", err.Error(), envelope.GeneralError)
+	}
+
+	// Update AI assistant in the database
+	assistant := umodels.User{
+		FirstName: req.FirstName,
+		LastName:  req.LastName,
+		Email:     null.NewString(req.Email, req.Email != ""),
+		AvatarURL: null.NewString(req.AvatarURL, req.AvatarURL != ""),
+		Enabled:   req.Enabled,
+		Meta:      metaBytes,
+	}
+	if err := app.user.UpdateAIAssistant(id, assistant); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	// Return the updated assistant
+	updatedAssistant, err := app.user.GetAIAssistant(id)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	return r.SendEnvelope(updatedAssistant)
+}
+
+// handleDeleteAIAssistant soft deletes an AI assistant from the database.
+func handleDeleteAIAssistant(r *fastglue.Request) error {
+	var (
+		app = r.Context.(*App)
+	)
+
+	id, err := strconv.Atoi(r.RequestCtx.UserValue("id").(string))
+	if err != nil || id <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+
+	if err := app.user.SoftDeleteAIAssistant(id); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	return r.SendEnvelope(true)
+}
+
+// validateAIAssistantRequest validates the fields of an aiAssisantRequest.
+func validateAIAssistantRequest(req aiAssisantRequest, app *App) error {
+	if req.FirstName == "" {
+		return envelope.NewError("validation_error", app.i18n.Ts("globals.messages.empty", "name", "`first_name`"), nil)
+	}
+	if req.ProductName == "" {
+		return envelope.NewError("validation_error", app.i18n.Ts("globals.messages.empty", "name", "`product_name`"), nil)
+	}
+	if req.ProductDescription == "" {
+		return envelope.NewError("validation_error", app.i18n.Ts("globals.messages.empty", "name", "`product_description`"), nil)
+	}
+	if req.AnswerLength == "" {
+		return envelope.NewError("validation_error", app.i18n.Ts("globals.messages.empty", "name", "`answer_length`"), nil)
+	}
+	if req.AnswerTone == "" {
+		return envelope.NewError("validation_error", app.i18n.Ts("globals.messages.empty", "name", "`answer_tone`"), nil)
+	}
+	return nil
+}

cmd/config.go

@@ -1,63 +0,0 @@
-package main
-
-import (
-	"encoding/json"
-
-	"github.com/abhinavxd/libredesk/internal/envelope"
-	"github.com/zerodha/fastglue"
-)
-
-// 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)
-
-	// Get app settings
-	settingsJSON, err := app.setting.GetByPrefix("app")
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-
-	// Unmarshal settings
-	var settings map[string]any
-	if err := json.Unmarshal(settingsJSON, &settings); err != nil {
-		app.lo.Error("error unmarshalling settings", "err", err)
-		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.Ts("globals.messages.errorFetching", "name", app.i18n.T("globals.terms.setting")), nil))
-	}
-
-	// Filter to only include public fields needed for initial app load
-	publicSettings := map[string]any{
-		"app.lang":        settings["app.lang"],
-		"app.favicon_url": settings["app.favicon_url"],
-		"app.logo_url":    settings["app.logo_url"],
-		"app.site_name":   settings["app.site_name"],
-	}
-
-	// Get all OIDC providers
-	oidcProviders, err := app.oidc.GetAll()
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-
-	// Filter for enabled providers and remove client_secret
-	enabledProviders := make([]map[string]any, 0)
-	for _, provider := range oidcProviders {
-		if provider.Enabled {
-			providerMap := map[string]any{
-				"id":           provider.ID,
-				"name":         provider.Name,
-				"provider":     provider.Provider,
-				"provider_url": provider.ProviderURL,
-				"client_id":    provider.ClientID,
-				"logo_url":     provider.ProviderLogoURL,
-				"enabled":      provider.Enabled,
-				"redirect_uri": provider.RedirectURI,
-			}
-			enabledProviders = append(enabledProviders, providerMap)
-		}
-	}
-
-	// Add SSO providers to the response
-	publicSettings["app.sso_providers"] = enabledProviders
-
-	return r.SendEnvelope(publicSettings)
-}

cmd/contacts.go

@@ -103,9 +103,9 @@ func handleUpdateContact(r *fastglue.Request) error {
 	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])
+	phoneNumberCallingCode := ""
+	if v, ok := form.Value["phone_number_calling_code"]; ok && len(v) > 0 {
+		phoneNumberCallingCode = string(v[0])
 	}
 	avatarURL := ""
 	if v, ok := form.Value["avatar_url"]; ok && len(v) > 0 {
@@ -116,8 +116,8 @@ func handleUpdateContact(r *fastglue.Request) error {
 	if avatarURL == "null" {
 		avatarURL = ""
 	}
-	if phoneNumberCountryCode == "null" {
-		phoneNumberCountryCode = ""
+	if phoneNumberCallingCode == "null" {
+		phoneNumberCallingCode = ""
 	}
 	if phoneNumber == "null" {
 		phoneNumber = ""
@@ -146,7 +146,7 @@ func handleUpdateContact(r *fastglue.Request) error {
 		Email:                  null.StringFrom(email),
 		AvatarURL:              null.NewString(avatarURL, avatarURL != ""),
 		PhoneNumber:            null.NewString(phoneNumber, phoneNumber != ""),
-		PhoneNumberCountryCode: null.NewString(phoneNumberCountryCode, phoneNumberCountryCode != ""),
+		PhoneNumberCallingCode: null.NewString(phoneNumberCallingCode, phoneNumberCallingCode != ""),
 	}
 
 	if err := app.user.UpdateContact(id, contactToUpdate); err != nil {
@@ -164,17 +164,11 @@ func handleUpdateContact(r *fastglue.Request) error {
 	// Upload avatar?
 	files, ok := form.File["files"]
 	if ok && len(files) > 0 {
-		if err := uploadUserAvatar(r, contact, files); err != nil {
+		if err := uploadUserAvatar(r, &contact, files); err != nil {
 			return sendErrorEnvelope(r, err)
 		}
 	}
-
-	// Refetch contact and return it
-	contact, err = app.user.GetContact(id, "")
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-	return r.SendEnvelope(contact)
+	return r.SendEnvelope(true)
 }
 
 // handleGetContactNotes returns all notes for a contact.
@@ -201,21 +195,18 @@ func handleCreateContactNote(r *fastglue.Request) error {
 		auser        = r.RequestCtx.UserValue("user").(amodels.User)
 		req          = createContactNoteReq{}
 	)
+
 	if err := r.Decode(&req, "json"); err != nil {
 		return sendErrorEnvelope(r, envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil))
 	}
+
 	if len(req.Note) == 0 {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "note"), nil, envelope.InputError)
 	}
-	n, err := app.user.CreateNote(contactID, auser.ID, req.Note)
-	if err != nil {
+	if err := app.user.CreateNote(contactID, auser.ID, req.Note); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	n, err = app.user.GetNote(n.ID)
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-	return r.SendEnvelope(n)
+	return r.SendEnvelope(true)
 }
 
 // handleDeleteContactNote deletes a note for a contact.
@@ -249,8 +240,6 @@ func handleDeleteContactNote(r *fastglue.Request) error {
 		}
 	}
 
-	app.lo.Info("deleting contact note", "note_id", noteID, "contact_id", contactID, "actor_id", auser.ID)
-
 	if err := app.user.DeleteNote(noteID, contactID); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
@@ -262,7 +251,6 @@ func handleBlockContact(r *fastglue.Request) error {
 	var (
 		app          = r.Context.(*App)
 		contactID, _ = strconv.Atoi(r.RequestCtx.UserValue("id").(string))
-		auser        = r.RequestCtx.UserValue("user").(amodels.User)
 		req          = blockContactReq{}
 	)
 
@@ -274,15 +262,8 @@ func handleBlockContact(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil))
 	}
 
-	app.lo.Info("setting contact block status", "contact_id", contactID, "enabled", req.Enabled, "actor_id", auser.ID)
-
 	if err := app.user.ToggleEnabled(contactID, models.UserTypeContact, req.Enabled); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-
-	contact, err := app.user.GetContact(contactID, "")
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-	return r.SendEnvelope(contact)
+	return r.SendEnvelope(true)
 }

cmd/conversation.go

@@ -49,7 +49,6 @@ type createConversationRequest struct {
 	Subject         string `json:"subject"`
 	Content         string `json:"content"`
 	Attachments     []int  `json:"attachments"`
-	Initiator       string `json:"initiator"` // "contact" | "agent"
 }
 
 // handleGetAllConversations retrieves all conversations.
@@ -274,8 +273,8 @@ func handleGetConversation(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 
-	prev, _ := app.conversation.GetContactPreviousConversations(conv.ContactID, 10)
-	conv.PreviousConversations = filterCurrentPreviousConv(prev, conv.UUID)
+	prev, _ := app.conversation.GetContactConversations(conv.ContactID)
+	conv.PreviousConversations = filterCurrentConv(prev, conv.UUID)
 	return r.SendEnvelope(conv)
 }
 
@@ -470,34 +469,16 @@ func handleUpdateConversationStatus(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	conversation, err := enforceConversationAccess(app, uuid, user)
+	_, err = enforceConversationAccess(app, uuid, user)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	// Make sure a user is assigned before resolving conversation.
-	if status == cmodels.StatusResolved && conversation.AssignedUserID.Int == 0 {
-		return sendErrorEnvelope(r, envelope.NewError(envelope.InputError, app.i18n.T("conversation.resolveWithoutAssignee"), nil))
-	}
-
 	// Update conversation status.
 	if err := app.conversation.UpdateConversationStatus(uuid, 0 /**status_id**/, status, snoozedUntil, user); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	// If status is `Resolved`, send CSAT survey if enabled on inbox.
-	if status == cmodels.StatusResolved {
-		// Check if CSAT is enabled on the inbox and send CSAT survey message.
-		inbox, err := app.inbox.GetDBRecord(conversation.InboxID)
-		if err != nil {
-			return sendErrorEnvelope(r, err)
-		}
-		if inbox.CSATEnabled {
-			if err := app.conversation.SendCSATReply(user.ID, *conversation); err != nil {
-				return sendErrorEnvelope(r, err)
-			}
-		}
-	}
 	return r.SendEnvelope(true)
 }
 
@@ -584,7 +565,7 @@ func handleUpdateContactCustomAttributes(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	if err := app.user.UpdateCustomAttributes(conversation.ContactID, attributes); err != nil {
+	if err := app.user.SaveCustomAttributes(conversation.ContactID, attributes, false); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 	// Broadcast update.
@@ -650,14 +631,14 @@ func handleRemoveTeamAssignee(r *fastglue.Request) error {
 	return r.SendEnvelope(true)
 }
 
-// filterCurrentPreviousConv removes the current conversation from the list of previous conversations.
-func filterCurrentPreviousConv(convs []cmodels.PreviousConversation, uuid string) []cmodels.PreviousConversation {
+// filterCurrentConv removes the current conversation from the list of conversations.
+func filterCurrentConv(convs []cmodels.Conversation, uuid string) []cmodels.Conversation {
 	for i, c := range convs {
 		if c.UUID == uuid {
 			return append(convs[:i], convs[i+1:]...)
 		}
 	}
-	return []cmodels.PreviousConversation{}
+	return []cmodels.Conversation{}
 }
 
 // handleCreateConversation creates a new conversation and sends a message to it.
@@ -673,45 +654,64 @@ func handleCreateConversation(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
 	}
 
-	// Validate the request
-	if err := validateCreateConversationRequest(req, app); err != nil {
-		return sendErrorEnvelope(r, err)
+	to := []string{req.Email}
+
+	// Validate required fields
+	if req.InboxID <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.required", "name", "`inbox_id`"), nil, envelope.InputError)
+	}
+	if req.Content == "" {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.required", "name", "`content`"), nil, envelope.InputError)
+	}
+	if req.Email == "" {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.required", "name", "`contact_email`"), nil, envelope.InputError)
+	}
+	if req.FirstName == "" {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.required", "name", "`first_name`"), nil, envelope.InputError)
+	}
+	if !stringutil.ValidEmail(req.Email) {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`contact_email`"), nil, envelope.InputError)
 	}
 
-	to := []string{req.Email}
 	user, err := app.user.GetAgent(auser.ID, "")
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
+	// Check if inbox exists and is enabled.
+	inbox, err := app.inbox.GetDBRecord(req.InboxID)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	if !inbox.Enabled {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.disabled", "name", "inbox"), nil, envelope.InputError)
+	}
+
 	// Find or create contact.
 	contact := umodels.User{
-		Email:           null.StringFrom(req.Email),
-		SourceChannelID: null.StringFrom(req.Email),
-		FirstName:       req.FirstName,
-		LastName:        req.LastName,
-		InboxID:         req.InboxID,
+		Email:     null.StringFrom(req.Email),
+		FirstName: req.FirstName,
+		LastName:  req.LastName,
 	}
 	if err := app.user.CreateContact(&contact); err != nil {
 		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.Ts("globals.messages.errorCreating", "name", "{globals.terms.contact}"), nil))
 	}
 
-	// Create conversation first.
+	// Create conversation
 	conversationID, conversationUUID, err := app.conversation.CreateConversation(
 		contact.ID,
-		contact.ContactChannelID,
 		req.InboxID,
 		"",         /** last_message **/
 		time.Now(), /** last_message_at **/
 		req.Subject,
-		true, /** append reference number to subject? **/
+		true, /** append reference number to subject **/
 	)
 	if err != nil {
 		app.lo.Error("error creating conversation", "error", err)
 		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.Ts("globals.messages.errorCreating", "name", "{globals.terms.conversation}"), nil))
 	}
 
-	// Get media for the attachment ids.
+	// Prepare attachments.
 	var media = make([]medModels.Media, 0, len(req.Attachments))
 	for _, id := range req.Attachments {
 		m, err := app.media.Get(id, "")
@@ -722,29 +722,13 @@ func handleCreateConversation(r *fastglue.Request) error {
 		media = append(media, m)
 	}
 
-	// Send initial message based on the initiator of conversation.
-	switch req.Initiator {
-	case umodels.UserTypeAgent:
-		// Queue reply.
-		if _, err := app.conversation.QueueReply(media, req.InboxID, auser.ID /**sender_id**/, conversationUUID, req.Content, to, nil /**cc**/, nil /**bcc**/, map[string]any{} /**meta**/); err != nil {
-			// Delete the conversation if msg queue fails.
-			if err := app.conversation.DeleteConversation(conversationUUID); err != nil {
-				app.lo.Error("error deleting conversation", "error", err)
-			}
-			return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.Ts("globals.messages.errorSending", "name", "{globals.terms.message}"), nil))
+	// Send reply to the created conversation.
+	if _, err := app.conversation.SendReply(media, req.InboxID, auser.ID, contact.ID, conversationUUID, req.Content, to, nil /**cc**/, nil /**bcc**/, map[string]any{} /**meta**/); err != nil {
+		// Delete the conversation if reply fails.
+		if err := app.conversation.DeleteConversation(conversationUUID); err != nil {
+			app.lo.Error("error deleting conversation", "error", err)
 		}
-	case umodels.UserTypeContact:
-		// Create contact message.
-		if _, err := app.conversation.CreateContactMessage(media, contact.ID, conversationUUID, req.Content, cmodels.ContentTypeHTML); err != nil {
-			// Delete the conversation if message creation fails.
-			if err := app.conversation.DeleteConversation(conversationUUID); err != nil {
-				app.lo.Error("error deleting conversation", "error", err)
-			}
-			return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.Ts("globals.messages.errorSending", "name", "{globals.terms.message}"), nil))
-		}
-	default:
-		// Guard anyway.
-		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`initiator`"), nil, envelope.InputError)
+		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.Ts("globals.messages.errorSending", "name", "{globals.terms.message}"), nil))
 	}
 
 	// Assign the conversation to the agent or team.
@@ -763,36 +747,3 @@ func handleCreateConversation(r *fastglue.Request) error {
 
 	return r.SendEnvelope(conversation)
 }
-
-// validateCreateConversationRequest validates the create conversation request fields.
-func validateCreateConversationRequest(req createConversationRequest, app *App) error {
-	if req.InboxID <= 0 {
-		return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.required", "name", "`inbox_id`"), nil)
-	}
-	if req.Content == "" {
-		return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.required", "name", "`content`"), nil)
-	}
-	if req.Email == "" {
-		return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.required", "name", "`contact_email`"), nil)
-	}
-	if req.FirstName == "" {
-		return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.required", "name", "`first_name`"), nil)
-	}
-	if !stringutil.ValidEmail(req.Email) {
-		return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.invalid", "name", "`contact_email`"), nil)
-	}
-	if req.Initiator != umodels.UserTypeContact && req.Initiator != umodels.UserTypeAgent {
-		return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.invalid", "name", "`initiator`"), nil)
-	}
-
-	// Check if inbox exists and is enabled.
-	inbox, err := app.inbox.GetDBRecord(req.InboxID)
-	if err != nil {
-		return err
-	}
-	if !inbox.Enabled {
-		return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.disabled", "name", "inbox"), nil)
-	}
-
-	return nil
-}

cmd/csat.go

@@ -3,12 +3,15 @@ package main
 import (
 	"strconv"
 
+	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/valyala/fasthttp"
 	"github.com/zerodha/fastglue"
 )
 
-const (
-	maxCsatFeedbackLength = 1000
-)
+type csatResponse struct {
+	Rating   int    `json:"rating"`
+	Feedback string `json:"feedback"`
+}
 
 // handleShowCSAT renders the CSAT page for a given csat.
 func handleShowCSAT(r *fastglue.Request) error {
@@ -21,7 +24,7 @@ func handleShowCSAT(r *fastglue.Request) error {
 	if err != nil {
 		return app.tmpl.RenderWebPage(r.RequestCtx, "error", map[string]interface{}{
 			"Data": map[string]interface{}{
-				"ErrorMessage": app.i18n.T("globals.messages.pageNotFound"),
+				"ErrorMessage": "Page not found",
 			},
 		})
 	}
@@ -29,8 +32,8 @@ func handleShowCSAT(r *fastglue.Request) error {
 	if csat.ResponseTimestamp.Valid {
 		return app.tmpl.RenderWebPage(r.RequestCtx, "info", map[string]interface{}{
 			"Data": map[string]interface{}{
-				"Title":   app.i18n.T("globals.messages.thankYou"),
-				"Message": app.i18n.T("csat.thankYouMessage"),
+				"Title":   "Thank you!",
+				"Message": "We appreciate you taking the time to submit your feedback.",
 			},
 		})
 	}
@@ -39,14 +42,14 @@ func handleShowCSAT(r *fastglue.Request) error {
 	if err != nil {
 		return app.tmpl.RenderWebPage(r.RequestCtx, "error", map[string]interface{}{
 			"Data": map[string]interface{}{
-				"ErrorMessage": app.i18n.T("globals.messages.pageNotFound"),
+				"ErrorMessage": "Page not found",
 			},
 		})
 	}
 
 	return app.tmpl.RenderWebPage(r.RequestCtx, "csat", map[string]interface{}{
 		"Data": map[string]interface{}{
-			"Title": app.i18n.T("csat.pageTitle"),
+			"Title": "Rate your interaction with us",
 			"CSAT": map[string]interface{}{
 				"UUID": csat.UUID,
 			},
@@ -71,15 +74,15 @@ func handleUpdateCSATResponse(r *fastglue.Request) error {
 	if err != nil {
 		return app.tmpl.RenderWebPage(r.RequestCtx, "error", map[string]interface{}{
 			"Data": map[string]interface{}{
-				"ErrorMessage": app.i18n.T("globals.messages.somethingWentWrong"),
+				"ErrorMessage": "Invalid `rating`",
 			},
 		})
 	}
 
-	if ratingI < 1 || ratingI > 5 {
+	if ratingI < 0 || ratingI > 5 {
 		return app.tmpl.RenderWebPage(r.RequestCtx, "error", map[string]interface{}{
 			"Data": map[string]interface{}{
-				"ErrorMessage": app.i18n.T("globals.messages.somethingWentWrong"),
+				"ErrorMessage": "Invalid `rating`",
 			},
 		})
 	}
@@ -87,16 +90,11 @@ func handleUpdateCSATResponse(r *fastglue.Request) error {
 	if uuid == "" {
 		return app.tmpl.RenderWebPage(r.RequestCtx, "error", map[string]interface{}{
 			"Data": map[string]interface{}{
-				"ErrorMessage": app.i18n.T("globals.messages.somethingWentWrong"),
+				"ErrorMessage": "Invalid `uuid`",
 			},
 		})
 	}
 
-	// Trim feedback if it exceeds max length
-	if len(feedback) > maxCsatFeedbackLength {
-		feedback = feedback[:maxCsatFeedbackLength]
-	}
-
 	if err := app.csat.UpdateResponse(uuid, ratingI, feedback); err != nil {
 		return app.tmpl.RenderWebPage(r.RequestCtx, "error", map[string]interface{}{
 			"Data": map[string]interface{}{
@@ -107,8 +105,41 @@ func handleUpdateCSATResponse(r *fastglue.Request) error {
 
 	return app.tmpl.RenderWebPage(r.RequestCtx, "info", map[string]interface{}{
 		"Data": map[string]interface{}{
-			"Title":   app.i18n.T("globals.messages.thankYou"),
-			"Message": app.i18n.T("csat.thankYouMessage"),
+			"Title":   "Thank you!",
+			"Message": "We appreciate you taking the time to submit your feedback.",
 		},
 	})
 }
+
+// handleSubmitCSATResponse handles CSAT response submission from the widget API.
+func handleSubmitCSATResponse(r *fastglue.Request) error {
+	var (
+		app  = r.Context.(*App)
+		uuid = r.RequestCtx.UserValue("uuid").(string)
+		req  = csatResponse{}
+	)
+
+	if err := r.Decode(&req, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, "Invalid JSON", nil, envelope.InputError)
+	}
+
+	if req.Rating < 0 || req.Rating > 5 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, "Rating must be between 0 and 5 (0 means no rating)", nil, envelope.InputError)
+	}
+
+	// At least one of rating or feedback must be provided
+	if req.Rating == 0 && req.Feedback == "" {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, "Either rating or feedback must be provided", nil, envelope.InputError)
+	}
+
+	if uuid == "" {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, "Invalid UUID", nil, envelope.InputError)
+	}
+
+	// Update CSAT response
+	if err := app.csat.UpdateResponse(uuid, req.Rating, req.Feedback); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	return r.SendEnvelope(true)
+}

cmd/custom_attributes.go

@@ -28,22 +28,6 @@ var (
 	}
 )
 
-// handleGetCustomAttribute retrieves a custom attribute by its ID.
-func handleGetCustomAttribute(r *fastglue.Request) error {
-	var (
-		app = r.Context.(*App)
-	)
-	id, err := strconv.Atoi(r.RequestCtx.UserValue("id").(string))
-	if err != nil || id <= 0 {
-		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`id`"), nil, envelope.InputError)
-	}
-
-	attribute, err := app.customAttribute.Get(id)
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-	return r.SendEnvelope(attribute)
-}
 
 // handleGetCustomAttributes retrieves all custom attributes from the database.
 func handleGetCustomAttributes(r *fastglue.Request) error {

cmd/handlers.go

@@ -1,12 +1,16 @@
 package main
 
 import (
+	"encoding/json"
 	"mime"
 	"net/http"
 	"path"
 	"path/filepath"
+	"strings"
 
 	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/abhinavxd/libredesk/internal/httputil"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat"
 	"github.com/abhinavxd/libredesk/internal/ws"
 	"github.com/valyala/fasthttp"
 	"github.com/zerodha/fastglue"
@@ -23,20 +27,18 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 	// i18n.
 	g.GET("/api/v1/lang/{lang}", handleGetI18nLang)
 
-	// Public config for app initialization.
-	g.GET("/api/v1/config", handleGetConfig)
-
 	// Media.
 	g.GET("/uploads/{uuid}", auth(handleServeMedia))
 	g.POST("/api/v1/media", auth(handleMediaUpload))
 
 	// Settings.
-	g.GET("/api/v1/settings/general", auth(handleGetGeneralSettings))
+	g.GET("/api/v1/settings/general", handleGetGeneralSettings)
 	g.PUT("/api/v1/settings/general", perm(handleUpdateGeneralSettings, "general_settings:manage"))
 	g.GET("/api/v1/settings/notifications/email", perm(handleGetEmailNotificationSettings, "notification_settings:manage"))
 	g.PUT("/api/v1/settings/notifications/email", perm(handleUpdateEmailNotificationSettings, "notification_settings:manage"))
 
 	// OpenID connect single sign-on.
+	g.GET("/api/v1/oidc/enabled", handleGetAllEnabledOIDC)
 	g.GET("/api/v1/oidc", perm(handleGetAllOIDC, "oidc:manage"))
 	g.POST("/api/v1/oidc", perm(handleCreateOIDC, "oidc:manage"))
 	g.GET("/api/v1/oidc/{id}", perm(handleGetOIDC, "oidc:manage"))
@@ -91,6 +93,20 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 	g.PUT("/api/v1/tags/{id}", perm(handleUpdateTag, "tags:manage"))
 	g.DELETE("/api/v1/tags/{id}", perm(handleDeleteTag, "tags:manage"))
 
+	// AI Assistants.
+	g.GET("/api/v1/ai-assistants", perm(handleGetAIAssistants, "ai:manage"))
+	g.GET("/api/v1/ai-assistants/{id}", perm(handleGetAIAssistant, "ai:manage"))
+	g.POST("/api/v1/ai-assistants", perm(handleCreateAIAssistant, "ai:manage"))
+	g.PUT("/api/v1/ai-assistants/{id}", perm(handleUpdateAIAssistant, "ai:manage"))
+	g.DELETE("/api/v1/ai-assistants/{id}", perm(handleDeleteAIAssistant, "ai:manage"))
+
+	// AI Snippets.
+	g.GET("/api/v1/ai-snippets", perm(handleGetAISnippets, "ai:manage"))
+	g.GET("/api/v1/ai-snippets/{id}", perm(handleGetAISnippet, "ai:manage"))
+	g.POST("/api/v1/ai-snippets", perm(handleCreateAISnippet, "ai:manage"))
+	g.PUT("/api/v1/ai-snippets/{id}", perm(handleUpdateAISnippet, "ai:manage"))
+	g.DELETE("/api/v1/ai-snippets/{id}", perm(handleDeleteAISnippet, "ai:manage"))
+
 	// Macros.
 	g.GET("/api/v1/macros", auth(handleGetMacros))
 	g.GET("/api/v1/macros/{id}", perm(handleGetMacro, "macros:manage"))
@@ -155,7 +171,7 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 	g.DELETE("/api/v1/inboxes/{id}", perm(handleDeleteInbox, "inboxes:manage"))
 
 	// Roles.
-	g.GET("/api/v1/roles", auth(handleGetRoles))
+	g.GET("/api/v1/roles", perm(handleGetRoles, "roles:manage"))
 	g.GET("/api/v1/roles/{id}", perm(handleGetRole, "roles:manage"))
 	g.POST("/api/v1/roles", perm(handleCreateRole, "roles:manage"))
 	g.PUT("/api/v1/roles/{id}", perm(handleUpdateRole, "roles:manage"))
@@ -204,20 +220,61 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 	// Custom attributes.
 	g.GET("/api/v1/custom-attributes", auth(handleGetCustomAttributes))
 	g.POST("/api/v1/custom-attributes", perm(handleCreateCustomAttribute, "custom_attributes:manage"))
-	g.GET("/api/v1/custom-attributes/{id}", perm(handleGetCustomAttribute, "custom_attributes:manage"))
 	g.PUT("/api/v1/custom-attributes/{id}", perm(handleUpdateCustomAttribute, "custom_attributes:manage"))
 	g.DELETE("/api/v1/custom-attributes/{id}", perm(handleDeleteCustomAttribute, "custom_attributes:manage"))
 
 	// Actvity logs.
 	g.GET("/api/v1/activity-logs", perm(handleGetActivityLogs, "activity_logs:manage"))
 
+	// Help Centers.
+	g.GET("/api/v1/help-centers", auth(handleGetHelpCenters))
+	g.GET("/api/v1/help-centers/{id}", auth(handleGetHelpCenter))
+	g.GET("/api/v1/help-centers/{id}/tree", auth(handleGetHelpCenterTree))
+	g.POST("/api/v1/help-centers", perm(handleCreateHelpCenter, "help_center:manage"))
+	g.PUT("/api/v1/help-centers/{id}", perm(handleUpdateHelpCenter, "help_center:manage"))
+	g.DELETE("/api/v1/help-centers/{id}", perm(handleDeleteHelpCenter, "help_center:manage"))
+
+	// Collections.
+	g.GET("/api/v1/help-centers/{hc_id}/collections", auth(handleGetCollections))
+	g.GET("/api/v1/help-centers/{hc_id}/collections/{id}", auth(handleGetCollection))
+	g.POST("/api/v1/help-centers/{hc_id}/collections", perm(handleCreateCollection, "help_center:manage"))
+	g.PUT("/api/v1/help-centers/{hc_id}/collections/{id}", perm(handleUpdateCollection, "help_center:manage"))
+	g.DELETE("/api/v1/help-centers/{hc_id}/collections/{id}", perm(handleDeleteCollection, "help_center:manage"))
+	g.PUT("/api/v1/collections/{id}/toggle", perm(handleToggleCollection, "help_center:manage"))
+
+	// Articles.
+	g.GET("/api/v1/collections/{col_id}/articles", auth(handleGetArticles))
+	g.GET("/api/v1/collections/{col_id}/articles/{id}", auth(handleGetArticle))
+	g.POST("/api/v1/collections/{col_id}/articles", perm(handleCreateArticle, "help_center:manage"))
+	g.PUT("/api/v1/collections/{col_id}/articles/{id}", perm(handleUpdateArticle, "help_center:manage"))
+	g.PUT("/api/v1/articles/{id}", perm(handleUpdateArticleByID, "help_center:manage"))
+	g.DELETE("/api/v1/collections/{col_id}/articles/{id}", perm(handleDeleteArticle, "help_center:manage"))
+	g.PUT("/api/v1/articles/{id}/status", perm(handleUpdateArticleStatus, "help_center:manage"))
+
+	// CSAT.
+	g.POST("/api/v1/csat/{uuid}/response", handleSubmitCSATResponse)
+
 	// WebSocket.
 	g.GET("/ws", auth(func(r *fastglue.Request) error {
 		return handleWS(r, hub)
 	}))
 
+	// Live chat widget websocket.
+	g.GET("/widget/ws", handleWidgetWS)
+
+	// Widget APIs.
+	g.GET("/api/v1/widget/chat/settings/launcher", handleGetChatLauncherSettings)
+	g.GET("/api/v1/widget/chat/settings", handleGetChatSettings)
+	g.POST("/api/v1/widget/chat/conversations/init", rateLimitWidget(widgetAuth(handleChatInit)))
+	g.GET("/api/v1/widget/chat/conversations", rateLimitWidget(widgetAuth(handleGetConversations)))
+	g.POST("/api/v1/widget/chat/conversations/{uuid}/update-last-seen", rateLimitWidget(widgetAuth(handleChatUpdateLastSeen)))
+	g.GET("/api/v1/widget/chat/conversations/{uuid}", rateLimitWidget(widgetAuth(handleChatGetConversation)))
+	g.POST("/api/v1/widget/chat/conversations/{uuid}/message", rateLimitWidget(widgetAuth(handleChatSendMessage)))
+	g.POST("/api/v1/widget/media/upload", rateLimitWidget(widgetAuth(handleWidgetMediaUpload)))
+
 	// Frontend pages.
 	g.GET("/", notAuthPage(serveIndexPage))
+	g.GET("/widget", serveWidgetIndexPage)
 	g.GET("/inboxes/{all:*}", authPage(serveIndexPage))
 	g.GET("/teams/{all:*}", authPage(serveIndexPage))
 	g.GET("/views/{all:*}", authPage(serveIndexPage))
@@ -227,8 +284,12 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 	g.GET("/account/{all:*}", authPage(serveIndexPage))
 	g.GET("/reset-password", notAuthPage(serveIndexPage))
 	g.GET("/set-password", notAuthPage(serveIndexPage))
-	// FIXME: Don't need three separate routes for the same thing.
+
+	// Assets and static files.
+	// FIXME: Reduce the number of routes.
+	g.GET("/widget.js", serveWidgetJS)
 	g.GET("/assets/{all:*}", serveFrontendStaticFiles)
+	g.GET("/widget/assets/{all:*}", serveWidgetStaticFiles)
 	g.GET("/images/{all:*}", serveFrontendStaticFiles)
 	g.GET("/static/public/{all:*}", serveStaticFiles)
 
@@ -265,6 +326,77 @@ func serveIndexPage(r *fastglue.Request) error {
 	return nil
 }
 
+// validateWidgetReferer validates the Referer header against trusted domains configured in the live chat inbox settings.
+func validateWidgetReferer(app *App, r *fastglue.Request, inboxID int) error {
+	// Get the Referer header from the request
+	referer := string(r.RequestCtx.Request.Header.Peek("Referer"))
+
+	// If no referer header is present, allow direct access.
+	if referer == "" {
+		return nil
+	}
+
+	// Get inbox configuration
+	inbox, err := app.inbox.GetDBRecord(inboxID)
+	if err != nil {
+		app.lo.Error("error fetching inbox for referer check", "inbox_id", inboxID, "error", err)
+		return r.SendErrorEnvelope(http.StatusNotFound, app.i18n.Ts("globals.messages.notFound", "name", "{globals.terms.inbox}"), nil, envelope.NotFoundError)
+	}
+
+	if !inbox.Enabled {
+		return r.SendErrorEnvelope(http.StatusBadRequest, app.i18n.Ts("globals.messages.disabled", "name", "{globals.terms.inbox}"), nil, envelope.InputError)
+	}
+
+	// Parse the live chat config
+	var config livechat.Config
+	if err := json.Unmarshal(inbox.Config, &config); err != nil {
+		app.lo.Error("error parsing live chat config for referer check", "error", err)
+		return r.SendErrorEnvelope(http.StatusInternalServerError, app.i18n.Ts("globals.messages.invalid", "name", "{globals.terms.inbox}"), nil, envelope.GeneralError)
+	}
+
+	// If trusted domains list is empty, allow all referers
+	if len(config.TrustedDomains) == 0 {
+		return nil
+	}
+
+	// Check if the referer matches any of the trusted domains
+	if !httputil.IsOriginTrusted(referer, config.TrustedDomains) {
+		app.lo.Warn("widget request from untrusted referer blocked",
+			"referer", referer,
+			"inbox_id", inboxID,
+			"trusted_domains", config.TrustedDomains)
+		return r.SendErrorEnvelope(http.StatusForbidden, "Widget not allowed from this origin: "+referer, nil, envelope.PermissionError)
+	}
+	app.lo.Debug("widget request from trusted referer allowed", "referer", referer, "inbox_id", inboxID)
+	return nil
+}
+
+// serveWidgetIndexPage serves the widget index page of the application.
+func serveWidgetIndexPage(r *fastglue.Request) error {
+	app := r.Context.(*App)
+
+	// Extract inbox ID and validate trusted domains if present
+	inboxID := r.RequestCtx.QueryArgs().GetUintOrZero("inbox_id")
+	if err := validateWidgetReferer(app, r, inboxID); err != nil {
+		return err
+	}
+
+	// Prevent caching of the index page.
+	r.RequestCtx.Response.Header.Add("Cache-Control", "no-store, no-cache, must-revalidate, post-check=0, pre-check=0")
+	r.RequestCtx.Response.Header.Add("Pragma", "no-cache")
+	r.RequestCtx.Response.Header.Add("Expires", "-1")
+
+	// Serve the index.html file from the embedded filesystem.
+	file, err := app.fs.Get(path.Join(widgetDir, "index.html"))
+	if err != nil {
+		return r.SendErrorEnvelope(http.StatusNotFound, app.i18n.Ts("globals.messages.notFound", "name", "{globals.terms.file}"), nil, envelope.NotFoundError)
+	}
+	r.RequestCtx.Response.Header.Set("Content-Type", "text/html")
+	r.RequestCtx.SetBody(file.ReadBytes())
+
+	return nil
+}
+
 // serveStaticFiles serves static assets from the embedded filesystem.
 func serveStaticFiles(r *fastglue.Request) error {
 	app := r.Context.(*App)
@@ -313,6 +445,47 @@ func serveFrontendStaticFiles(r *fastglue.Request) error {
 	return nil
 }
 
+// serveWidgetStaticFiles serves widget static assets from the embedded filesystem.
+func serveWidgetStaticFiles(r *fastglue.Request) error {
+	app := r.Context.(*App)
+
+	filePath := string(r.RequestCtx.Path())
+	finalPath := filepath.Join(widgetDir, strings.TrimPrefix(filePath, "/widget"))
+
+	file, err := app.fs.Get(finalPath)
+	if err != nil {
+		return r.SendErrorEnvelope(http.StatusNotFound, app.i18n.Ts("globals.messages.notFound", "name", "{globals.terms.file}"), nil, envelope.NotFoundError)
+	}
+
+	// Set the appropriate Content-Type based on the file extension.
+	ext := filepath.Ext(filePath)
+	contentType := mime.TypeByExtension(ext)
+	if contentType == "" {
+		contentType = http.DetectContentType(file.ReadBytes())
+	}
+	r.RequestCtx.Response.Header.Set("Content-Type", contentType)
+	r.RequestCtx.SetBody(file.ReadBytes())
+	return nil
+}
+
+// serveWidgetJS serves the widget JavaScript file.
+func serveWidgetJS(r *fastglue.Request) error {
+	app := r.Context.(*App)
+
+	// Set appropriate headers for JavaScript
+	r.RequestCtx.Response.Header.Set("Content-Type", "application/javascript")
+	r.RequestCtx.Response.Header.Set("Cache-Control", "public, max-age=3600") // Cache for 1 hour
+
+	// Serve the widget.js file from the embedded filesystem.
+	file, err := app.fs.Get("static/widget.js")
+	if err != nil {
+		return r.SendErrorEnvelope(http.StatusNotFound, app.i18n.Ts("globals.messages.notFound", "name", "{globals.terms.file}"), nil, envelope.NotFoundError)
+	}
+
+	r.RequestCtx.SetBody(file.ReadBytes())
+	return nil
+}
+
 // sendErrorEnvelope sends a standardized error response to the client.
 func sendErrorEnvelope(r *fastglue.Request, err error) error {
 	e, ok := err.(envelope.Error)

cmd/helpcenter.go

@@ -0,0 +1,548 @@
+package main
+
+import (
+	"strconv"
+
+	"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/stringutil"
+	"github.com/valyala/fasthttp"
+	"github.com/zerodha/fastglue"
+)
+
+// Help Centers
+
+// handleGetHelpCenters returns all help centers from the database.
+func handleGetHelpCenters(r *fastglue.Request) error {
+	app := r.Context.(*App)
+	helpCenters, err := app.helpcenter.GetAllHelpCenters()
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(helpCenters)
+}
+
+// handleGetHelpCenter returns a specific help center by ID.
+func handleGetHelpCenter(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.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+	helpCenter, err := app.helpcenter.GetHelpCenterByID(id)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(helpCenter)
+}
+
+// handleCreateHelpCenter creates a new help center.
+func handleCreateHelpCenter(r *fastglue.Request) error {
+	var (
+		app = r.Context.(*App)
+		req = helpcenter.HelpCenterCreateRequest{}
+	)
+
+	if err := r.Decode(&req, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
+	}
+
+	if err := validateHelpCenter(r, &req); err != nil {
+		return err
+	}
+
+	helpCenter, err := app.helpcenter.CreateHelpCenter(req)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	return r.SendEnvelope(helpCenter)
+}
+
+// handleUpdateHelpCenter updates an existing help center.
+func handleUpdateHelpCenter(r *fastglue.Request) error {
+	var (
+		app   = r.Context.(*App)
+		req   = helpcenter.HelpCenterUpdateRequest{}
+		id, _ = strconv.Atoi(r.RequestCtx.UserValue("id").(string))
+	)
+	if id <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+
+	if err := r.Decode(&req, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
+	}
+
+	if err := validateHelpCenter(r, &req); err != nil {
+		return err
+	}
+
+	helpCenter, err := app.helpcenter.UpdateHelpCenter(id, req)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	return r.SendEnvelope(helpCenter)
+}
+
+// handleDeleteHelpCenter deletes a help center.
+func handleDeleteHelpCenter(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.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+	if err := app.helpcenter.DeleteHelpCenter(id); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(true)
+}
+
+// Collections
+
+// handleGetCollections returns all collections for a help center.
+func handleGetCollections(r *fastglue.Request) error {
+	var (
+		app             = r.Context.(*App)
+		helpCenterID, _ = strconv.Atoi(r.RequestCtx.UserValue("hc_id").(string))
+		err             error
+	)
+
+	if helpCenterID <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`help_center_id`"), nil, envelope.InputError)
+	}
+
+	// Check for locale filter
+	locale := string(r.RequestCtx.QueryArgs().Peek("locale"))
+
+	var collections []hcmodels.Collection
+	if locale != "" {
+		collections, err = app.helpcenter.GetCollectionsByHelpCenterAndLocale(helpCenterID, locale)
+	} else {
+		collections, err = app.helpcenter.GetCollectionsByHelpCenter(helpCenterID)
+	}
+
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(collections)
+}
+
+// handleGetCollection returns a specific collection by ID.
+func handleGetCollection(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.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+	collection, err := app.helpcenter.GetCollectionByID(id)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(collection)
+}
+
+// handleCreateCollection creates a new collection.
+func handleCreateCollection(r *fastglue.Request) error {
+	var (
+		app               = r.Context.(*App)
+		req               = helpcenter.CollectionCreateRequest{}
+		helpCenterID, err = strconv.Atoi(r.RequestCtx.UserValue("hc_id").(string))
+	)
+
+	if helpCenterID <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`help_center_id`"), nil, envelope.InputError)
+	}
+
+	if err := r.Decode(&req, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
+	}
+
+	if err := validateCollection(r, &req); err != nil {
+		return err
+	}
+
+	// Generate slug.
+	req.Slug = stringutil.GenerateSlug(req.Name, true)
+
+	collection, err := app.helpcenter.CreateCollection(helpCenterID, req)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	return r.SendEnvelope(collection)
+}
+
+// handleUpdateCollection updates an existing collection.
+func handleUpdateCollection(r *fastglue.Request) error {
+	var (
+		app   = r.Context.(*App)
+		req   = helpcenter.CollectionUpdateRequest{}
+		id, _ = strconv.Atoi(r.RequestCtx.UserValue("id").(string))
+	)
+
+	if id <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+
+	if err := r.Decode(&req, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
+	}
+
+	if err := validateCollection(r, &req); err != nil {
+		return err
+	}
+
+	// Generate slug
+	req.Slug = stringutil.GenerateSlug(req.Name, true)
+
+	collection, err := app.helpcenter.UpdateCollection(id, req)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	return r.SendEnvelope(collection)
+}
+
+// handleDeleteCollection deletes a collection.
+func handleDeleteCollection(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.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+	if err := app.helpcenter.DeleteCollection(id); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(true)
+}
+
+// handleToggleCollection toggles the published status of a collection.
+func handleToggleCollection(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.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+
+	collection, err := app.helpcenter.ToggleCollectionPublished(id)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	return r.SendEnvelope(collection)
+}
+
+
+// Articles
+
+// handleGetArticles returns all articles for a collection.
+func handleGetArticles(r *fastglue.Request) error {
+	var (
+		app             = r.Context.(*App)
+		collectionID, _ = strconv.Atoi(r.RequestCtx.UserValue("col_id").(string))
+		err             error
+	)
+
+	if collectionID <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`collection_id`"), nil, envelope.InputError)
+	}
+
+	// Check for locale filter
+	locale := string(r.RequestCtx.QueryArgs().Peek("locale"))
+
+	var articles []hcmodels.Article
+	if locale != "" {
+		articles, err = app.helpcenter.GetArticlesByCollectionAndLocale(collectionID, locale)
+	} else {
+		articles, err = app.helpcenter.GetArticlesByCollection(collectionID)
+	}
+
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(articles)
+}
+
+// handleGetArticle returns a specific article by ID.
+func handleGetArticle(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.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+
+	article, err := app.helpcenter.GetArticleByID(id)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(article)
+}
+
+// handleCreateArticle creates a new article.
+func handleCreateArticle(r *fastglue.Request) error {
+	var (
+		app             = r.Context.(*App)
+		req             = helpcenter.ArticleCreateRequest{}
+		collectionID, _ = strconv.Atoi(r.RequestCtx.UserValue("col_id").(string))
+	)
+
+	if collectionID <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`collection_id`"), nil, envelope.InputError)
+	}
+
+	if err := r.Decode(&req, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
+	}
+
+	if err := validateArticle(r, &req); err != nil {
+		return err
+	}
+
+	// Generate slug
+	req.Slug = stringutil.GenerateSlug(req.Title, true)
+
+	if req.Status == "" {
+		req.Status = hcmodels.ArticleStatusDraft
+	}
+	article, err := app.helpcenter.CreateArticle(collectionID, req)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	return r.SendEnvelope(article)
+}
+
+// handleUpdateArticle updates an existing article.
+func handleUpdateArticle(r *fastglue.Request) error {
+	var (
+		app   = r.Context.(*App)
+		req   = helpcenter.ArticleUpdateRequest{}
+		id, _ = strconv.Atoi(r.RequestCtx.UserValue("id").(string))
+	)
+
+	if id <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+
+	if err := r.Decode(&req, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
+	}
+
+	if err := validateArticle(r, &req); err != nil {
+		return err
+	}
+
+	// Generate slug
+	req.Slug = stringutil.GenerateSlug(req.Title, true)
+
+	if req.Status == "" {
+		req.Status = hcmodels.ArticleStatusDraft
+	}
+
+	article, err := app.helpcenter.UpdateArticle(id, req)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	return r.SendEnvelope(article)
+}
+
+// handleUpdateArticleByID updates an existing article by its ID (allows collection changes).
+func handleUpdateArticleByID(r *fastglue.Request) error {
+	var (
+		app   = r.Context.(*App)
+		req   = helpcenter.ArticleUpdateRequest{}
+		id, _ = strconv.Atoi(r.RequestCtx.UserValue("id").(string))
+	)
+
+	if id <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+
+	if err := r.Decode(&req, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
+	}
+
+	if err := validateArticle(r, &req); err != nil {
+		return err
+	}
+
+	// Generate slug
+	req.Slug = stringutil.GenerateSlug(req.Title, true)
+
+	if req.Status == "" {
+		req.Status = hcmodels.ArticleStatusDraft
+	}
+
+	article, err := app.helpcenter.UpdateArticle(id, req)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	return r.SendEnvelope(article)
+}
+
+// handleDeleteArticle deletes an article.
+func handleDeleteArticle(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.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+
+	if err := app.helpcenter.DeleteArticle(id); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	return r.SendEnvelope(true)
+}
+
+// handleUpdateArticleStatus updates the status of an article.
+func handleUpdateArticleStatus(r *fastglue.Request) error {
+	var (
+		app   = r.Context.(*App)
+		req   = helpcenter.UpdateStatusRequest{}
+		id, _ = strconv.Atoi(r.RequestCtx.UserValue("id").(string))
+	)
+
+	if id <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+
+	if err := r.Decode(&req, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
+	}
+
+	if req.Status == "" {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`status`"), nil, envelope.InputError)
+	}
+
+	article, err := app.helpcenter.UpdateArticleStatus(id, req.Status)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	return r.SendEnvelope(article)
+}
+
+
+// handleGetHelpCenterTree returns the complete tree structure for a help center.
+func handleGetHelpCenterTree(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.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+
+	// Get locale from query parameter (optional)
+	locale := string(r.RequestCtx.QueryArgs().Peek("locale"))
+
+	tree, err := app.helpcenter.GetHelpCenterTree(id, locale)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	return r.SendEnvelope(tree)
+}
+
+func validateHelpCenter(r *fastglue.Request, req any) error {
+	app := r.Context.(*App)
+	switch v := req.(type) {
+	case *helpcenter.HelpCenterCreateRequest:
+		if v.Name == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`name`"), nil, envelope.InputError)
+		}
+		if v.Slug == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`slug`"), nil, envelope.InputError)
+		}
+		if v.PageTitle == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`page_title`"), nil, envelope.InputError)
+		}
+		if v.DefaultLocale == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`default_locale`"), nil, envelope.InputError)
+		}
+	case *helpcenter.HelpCenterUpdateRequest:
+		if v.Name == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`name`"), nil, envelope.InputError)
+		}
+		if v.Slug == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`slug`"), nil, envelope.InputError)
+		}
+		if v.PageTitle == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`page_title`"), nil, envelope.InputError)
+		}
+		if v.DefaultLocale == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`default_locale`"), nil, envelope.InputError)
+		}
+	}
+	return nil
+}
+
+func validateCollection(r *fastglue.Request, req any) error {
+	app := r.Context.(*App)
+	switch v := req.(type) {
+	case *helpcenter.CollectionCreateRequest:
+		if v.Name == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`name`"), nil, envelope.InputError)
+		}
+		if v.Locale == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`locale`"), nil, envelope.InputError)
+		}
+	case *helpcenter.CollectionUpdateRequest:
+		if v.Name == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`name`"), nil, envelope.InputError)
+		}
+		if v.Locale == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`locale`"), nil, envelope.InputError)
+		}
+	}
+	return nil
+}
+
+func validateArticle(r *fastglue.Request, req any) error {
+	app := r.Context.(*App)
+	switch v := req.(type) {
+	case *helpcenter.ArticleCreateRequest:
+		if v.Title == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`title`"), nil, envelope.InputError)
+		}
+		if v.Content == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`content`"), nil, envelope.InputError)
+		}
+		if v.Locale == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`locale`"), nil, envelope.InputError)
+		}
+	case *helpcenter.ArticleUpdateRequest:
+		if v.Title == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`title`"), nil, envelope.InputError)
+		}
+		if v.Content == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`content`"), nil, envelope.InputError)
+		}
+		if v.Locale == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`locale`"), nil, envelope.InputError)
+		}
+	}
+	return nil
+}

cmd/inboxes.go

@@ -1,10 +1,12 @@
 package main
 
 import (
+	"encoding/json"
 	"net/mail"
 	"strconv"
 
 	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat"
 	imodels "github.com/abhinavxd/libredesk/internal/inbox/models"
 	"github.com/valyala/fasthttp"
 	"github.com/zerodha/fastglue"
@@ -17,12 +19,6 @@ func handleGetInboxes(r *fastglue.Request) error {
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	for i := range inboxes {
-		if err := inboxes[i].ClearPasswords(); err != nil {
-			app.lo.Error("error clearing inbox passwords from response", "error", err)
-			return envelope.NewError(envelope.GeneralError, app.i18n.Ts("globals.messages.errorFetching", "name", "{globals.terms.inbox}"), nil)
-		}
-	}
 	return r.SendEnvelope(inboxes)
 }
 
@@ -160,9 +156,11 @@ func handleDeleteInbox(r *fastglue.Request) error {
 
 // validateInbox validates the inbox
 func validateInbox(app *App, inbox imodels.Inbox) error {
-	// Validate from address.
-	if _, err := mail.ParseAddress(inbox.From); err != nil {
-		return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.invalidFromAddress"), nil)
+	// Validate from address only for email channels.
+	if inbox.Channel == "email" {
+		if _, err := mail.ParseAddress(inbox.From); err != nil {
+			return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.invalidFromAddress"), nil)
+		}
 	}
 	if len(inbox.Config) == 0 {
 		return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.empty", "name", "config"), nil)
@@ -173,5 +171,17 @@ func validateInbox(app *App, inbox imodels.Inbox) error {
 	if inbox.Channel == "" {
 		return envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.empty", "name", "channel"), nil)
 	}
+
+	// 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)
+			}
+		}
+	}
+
 	return nil
 }

cmd/init.go

@@ -25,8 +25,10 @@ import (
 	"github.com/abhinavxd/libredesk/internal/conversation/status"
 	"github.com/abhinavxd/libredesk/internal/csat"
 	customAttribute "github.com/abhinavxd/libredesk/internal/custom_attribute"
+	"github.com/abhinavxd/libredesk/internal/helpcenter"
 	"github.com/abhinavxd/libredesk/internal/inbox"
 	"github.com/abhinavxd/libredesk/internal/inbox/channel/email"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat"
 	imodels "github.com/abhinavxd/libredesk/internal/inbox/models"
 	"github.com/abhinavxd/libredesk/internal/macro"
 	"github.com/abhinavxd/libredesk/internal/media"
@@ -35,6 +37,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/ratelimit"
 	"github.com/abhinavxd/libredesk/internal/report"
 	"github.com/abhinavxd/libredesk/internal/role"
 	"github.com/abhinavxd/libredesk/internal/search"
@@ -132,7 +135,8 @@ func initConstants() *constants {
 // initFS initializes the stuffbin FileSystem.
 func initFS() stuffbin.FileSystem {
 	var files = []string{
-		"frontend/dist",
+		"frontend/dist/main",
+		"frontend/dist/widget",
 		"i18n",
 		"static",
 	}
@@ -249,14 +253,27 @@ func initTag(db *sqlx.DB, i18n *i18n.I18n) *tag.Manager {
 	return mgr
 }
 
-// initViews inits view manager.
-func initView(db *sqlx.DB, i18n *i18n.I18n) *view.Manager {
-	var lo = initLogger("view_manager")
-	m, err := view.New(view.Opts{
+// initHelpCenter inits helpcenter manager.
+func initHelpCenter(db *sqlx.DB, i18n *i18n.I18n) *helpcenter.Manager {
+	var lo = initLogger("helpcenter_manager")
+	mgr, err := helpcenter.New(helpcenter.Opts{
 		DB:   db,
 		Lo:   lo,
 		I18n: i18n,
 	})
+	if err != nil {
+		log.Fatalf("error initializing helpcenter: %v", err)
+	}
+	return mgr
+}
+
+// initViews inits view manager.
+func initView(db *sqlx.DB) *view.Manager {
+	var lo = initLogger("view_manager")
+	m, err := view.New(view.Opts{
+		DB: db,
+		Lo: lo,
+	})
 	if err != nil {
 		log.Fatalf("error initializing view manager: %v", err)
 	}
@@ -328,7 +345,7 @@ func initWS(user *user.Manager) *ws.Hub {
 func initTemplate(db *sqlx.DB, fs stuffbin.FileSystem, consts *constants, i18n *i18n.I18n) *tmpl.Manager {
 	var (
 		lo      = initLogger("template")
-		funcMap = getTmplFuncs(consts, i18n)
+		funcMap = getTmplFuncs(consts)
 	)
 	tpls, err := stuffbin.ParseTemplatesGlob(funcMap, fs, "/static/email-templates/*.html")
 	if err != nil {
@@ -346,7 +363,7 @@ func initTemplate(db *sqlx.DB, fs stuffbin.FileSystem, consts *constants, i18n *
 }
 
 // getTmplFuncs returns the template functions.
-func getTmplFuncs(consts *constants, i18n *i18n.I18n) template.FuncMap {
+func getTmplFuncs(consts *constants) template.FuncMap {
 	return template.FuncMap{
 		"RootURL": func() string {
 			return consts.AppBaseURL
@@ -366,9 +383,6 @@ func getTmplFuncs(consts *constants, i18n *i18n.I18n) template.FuncMap {
 		"SiteName": func() string {
 			return consts.SiteName
 		},
-		"L": func() interface{} {
-			return i18n
-		},
 	}
 }
 
@@ -385,10 +399,7 @@ func reloadSettings(app *App) error {
 		app.lo.Error("error unmarshalling settings from DB", "error", err)
 		return err
 	}
-	app.Lock()
-	err = ko.Load(confmap.Provider(out, "."), nil)
-	app.Unlock()
-	if err != nil {
+	if err := ko.Load(confmap.Provider(out, "."), nil); err != nil {
 		app.lo.Error("error loading settings into koanf", "error", err)
 		return err
 	}
@@ -400,7 +411,7 @@ func reloadSettings(app *App) error {
 // reloadTemplates reloads the templates from the filesystem.
 func reloadTemplates(app *App) error {
 	app.lo.Info("reloading templates")
-	funcMap := getTmplFuncs(app.consts.Load().(*constants), app.i18n)
+	funcMap := getTmplFuncs(app.consts.Load().(*constants))
 	tpls, err := stuffbin.ParseTemplatesGlob(funcMap, app.fs, "/static/email-templates/*.html")
 	if err != nil {
 		app.lo.Error("error parsing email templates", "error", err)
@@ -467,10 +478,11 @@ func initMedia(db *sqlx.DB, i18n *i18n.I18n) *media.Manager {
 	}
 
 	media, err := media.New(media.Opts{
-		Store: store,
-		Lo:    lo,
-		DB:    db,
-		I18n:  i18n,
+		Store:  store,
+		Lo:     lo,
+		DB:     db,
+		I18n:   i18n,
+		Secret: ko.String("upload.secret"),
 	})
 	if err != nil {
 		log.Fatalf("error initializing media: %v", err)
@@ -579,11 +591,41 @@ func initEmailInbox(inboxRecord imodels.Inbox, msgStore inbox.MessageStore, usrS
 	return inbox, nil
 }
 
+// initLiveChatInbox initializes the live chat inbox.
+func initLiveChatInbox(inboxRecord imodels.Inbox, msgStore inbox.MessageStore, usrStore inbox.UserStore) (inbox.Inbox, error) {
+	var config livechat.Config
+
+	// Load JSON data into Koanf.
+	if err := ko.Load(rawbytes.Provider([]byte(inboxRecord.Config)), kjson.Parser()); err != nil {
+		return nil, fmt.Errorf("loading config: %w", err)
+	}
+
+	if err := ko.UnmarshalWithConf("", &config, koanf.UnmarshalConf{Tag: "json"}); err != nil {
+		return nil, fmt.Errorf("unmarshalling `%s` %s config: %w", inboxRecord.Channel, inboxRecord.Name, err)
+	}
+
+	inbox, err := livechat.New(msgStore, usrStore, livechat.Opts{
+		ID:     inboxRecord.ID,
+		Config: config,
+		Lo:     initLogger("livechat_inbox"),
+	})
+
+	if err != nil {
+		return nil, fmt.Errorf("initializing `%s` inbox: `%s` error : %w", inboxRecord.Channel, inboxRecord.Name, err)
+	}
+
+	log.Printf("`%s` inbox successfully initialized", inboxRecord.Name)
+
+	return inbox, nil
+}
+
 // initializeInboxes handles inbox initialization.
 func initializeInboxes(inboxR imodels.Inbox, msgStore inbox.MessageStore, usrStore inbox.UserStore) (inbox.Inbox, error) {
 	switch inboxR.Channel {
 	case "email":
 		return initEmailInbox(inboxR, msgStore, usrStore)
+	case "livechat":
+		return initLiveChatInbox(inboxR, msgStore, usrStore)
 	default:
 		return nil, fmt.Errorf("unknown inbox channel: %s", inboxR.Channel)
 	}
@@ -778,9 +820,39 @@ func initPriority(db *sqlx.DB, i18n *i18n.I18n) *priority.Manager {
 }
 
 // initAI inits AI manager.
-func initAI(db *sqlx.DB, i18n *i18n.I18n) *ai.Manager {
+func initAI(db *sqlx.DB, i18n *i18n.I18n, conversationStore *conversation.Manager, helpCenterStore *helpcenter.Manager) *ai.Manager {
 	lo := initLogger("ai")
-	m, err := ai.New(ai.Opts{
+
+	embeddingCfg := ai.EmbeddingConfig{
+		Provider: ko.String("ai.embedding.provider"),
+		URL:      ko.String("ai.embedding.url"),
+		APIKey:   ko.String("ai.embedding.api_key"),
+		Model:    ko.String("ai.embedding.model"),
+		Timeout:  ko.Duration("ai.embedding.timeout"),
+	}
+
+	chunkingCfg := ai.ChunkingConfig{
+		MaxTokens:     ko.Int("ai.embedding.chunking.max_tokens"),
+		MinTokens:     ko.Int("ai.embedding.chunking.min_tokens"),
+		OverlapTokens: ko.Int("ai.embedding.chunking.overlap_tokens"),
+	}
+
+	completionCfg := ai.CompletionConfig{
+		Provider:    ko.String("ai.completion.provider"),
+		URL:         ko.String("ai.completion.url"),
+		APIKey:      ko.String("ai.completion.api_key"),
+		Model:       ko.String("ai.completion.model"),
+		Timeout:     ko.Duration("ai.completion.timeout"),
+		MaxTokens:   ko.Int("ai.completion.max_tokens"),
+		Temperature: ko.Float64("ai.completion.temperature"),
+	}
+
+	workerCfg := ai.WorkerConfig{
+		Workers:  ko.Int("ai.worker.workers"),
+		Capacity: ko.Int("ai.worker.capacity"),
+	}
+
+	m, err := ai.New(embeddingCfg, chunkingCfg, completionCfg, workerCfg, conversationStore, helpCenterStore, ai.Opts{
 		DB:   db,
 		Lo:   lo,
 		I18n: i18n,
@@ -901,3 +973,12 @@ func getLogLevel(lvl string) logf.Level {
 		return logf.InfoLevel
 	}
 }
+
+// initRateLimit initializes the rate limiter.
+func initRateLimit(redisClient *redis.Client) *ratelimit.Limiter {
+	var config ratelimit.Config
+	if err := ko.UnmarshalWithConf("rate_limit", &config, koanf.UnmarshalConf{Tag: "toml"}); err != nil {
+		log.Fatalf("error unmarshalling rate limit config: %v", err)
+	}
+	return ratelimit.New(redisClient, config)
+}

cmd/main.go

@@ -13,6 +13,8 @@ import (
 
 	_ "time/tzdata"
 
+	_ "github.com/pgvector/pgvector-go"
+
 	activitylog "github.com/abhinavxd/libredesk/internal/activity_log"
 	"github.com/abhinavxd/libredesk/internal/ai"
 	auth_ "github.com/abhinavxd/libredesk/internal/auth"
@@ -21,6 +23,7 @@ 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/helpcenter"
 	"github.com/abhinavxd/libredesk/internal/macro"
 	notifier "github.com/abhinavxd/libredesk/internal/notification"
 	"github.com/abhinavxd/libredesk/internal/report"
@@ -35,6 +38,7 @@ import (
 	"github.com/abhinavxd/libredesk/internal/inbox"
 	"github.com/abhinavxd/libredesk/internal/media"
 	"github.com/abhinavxd/libredesk/internal/oidc"
+	"github.com/abhinavxd/libredesk/internal/ratelimit"
 	"github.com/abhinavxd/libredesk/internal/role"
 	"github.com/abhinavxd/libredesk/internal/setting"
 	"github.com/abhinavxd/libredesk/internal/tag"
@@ -54,7 +58,8 @@ var (
 	ko          = koanf.New(".")
 	ctx         = context.Background()
 	appName     = "libredesk"
-	frontendDir = "frontend/dist"
+	frontendDir = "frontend/dist/main"
+	widgetDir   = "frontend/dist/widget"
 
 	// Injected at build time.
 	buildString   string
@@ -94,11 +99,11 @@ type App struct {
 	customAttribute *customAttribute.Manager
 	report          *report.Manager
 	webhook         *webhook.Manager
+	rateLimit       *ratelimit.Limiter
+	helpcenter      *helpcenter.Manager
 
 	// Global state that stores data on an available app update.
 	update *AppUpdate
-	// Flag to indicate if app restart is required for settings to take effect.
-	restartRequired bool
 	sync.Mutex
 }
 
@@ -203,10 +208,19 @@ func main() {
 		sla                         = initSLA(db, team, settings, businessHours, notifier, template, user, i18n)
 		conversation                = initConversations(i18n, sla, status, priority, wsHub, notifier, db, inbox, user, team, media, settings, csat, automation, template, webhook)
 		autoassigner                = initAutoAssigner(team, user, conversation)
+		rateLimiter                 = initRateLimit(rdb)
+		helpcenter                  = initHelpCenter(db, i18n)
+		ai                          = initAI(db, i18n, conversation, helpcenter)
 	)
-	automation.SetConversationStore(conversation)
 
+	wsHub.SetConversationStore(conversation)
+	automation.SetConversationStore(conversation)
+	conversation.SetAIStore(ai)
+	helpcenter.SetAIStore(ai)
+
+	// Start inboxes.
 	startInboxes(ctx, inbox, conversation, user)
+
 	go automation.Run(ctx, automationWorkers)
 	go autoassigner.Run(ctx, autoAssignInterval)
 	go conversation.Run(ctx, messageIncomingQWorkers, messageOutgoingQWorkers, messageOutgoingScanInterval)
@@ -217,6 +231,7 @@ func main() {
 	go sla.SendNotifications(ctx)
 	go media.DeleteUnlinkedMedia(ctx)
 	go user.MonitorAgentAvailability(ctx)
+	go ai.StartConversationCompletions()
 
 	var app = &App{
 		lo:              lo,
@@ -241,15 +256,17 @@ func main() {
 		activityLog:     initActivityLog(db, i18n),
 		customAttribute: initCustomAttribute(db, i18n),
 		authz:           initAuthz(i18n),
-		view:            initView(db, i18n),
+		view:            initView(db),
 		report:          initReport(db, i18n),
 		csat:            initCSAT(db, i18n),
 		search:          initSearch(db, i18n),
 		role:            initRole(db, i18n),
 		tag:             initTag(db, i18n),
 		macro:           initMacro(db, i18n),
-		ai:              initAI(db, i18n),
+		ai:              ai,
 		webhook:         webhook,
+		rateLimit:       rateLimiter,
+		helpcenter:      helpcenter,
 	}
 	app.consts.Store(constants)
 
@@ -297,6 +314,8 @@ func main() {
 	webhook.Close()
 	colorlog.Red("Shutting down conversation...")
 	conversation.Close()
+	colorlog.Red("Shutting down AI...")
+	app.ai.StopConversationCompletions()
 	colorlog.Red("Shutting down SLA...")
 	sla.Close()
 	colorlog.Red("Shutting down database...")

cmd/media.go

@@ -143,45 +143,51 @@ func handleMediaUpload(r *fastglue.Request) error {
 }
 
 // handleServeMedia serves uploaded media.
+// Supports both authenticated agent access and unauthenticated access via signed URLs.
 func handleServeMedia(r *fastglue.Request) error {
 	var (
-		app   = r.Context.(*App)
-		auser = r.RequestCtx.UserValue("user").(amodels.User)
-		uuid  = r.RequestCtx.UserValue("uuid").(string)
+		app  = r.Context.(*App)
+		uuid = r.RequestCtx.UserValue("uuid").(string)
 	)
 
-	user, err := app.user.GetAgent(auser.ID, "")
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-
-	// Fetch media from DB.
-	media, err := app.media.Get(0, strings.TrimPrefix(uuid, thumbPrefix))
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-
-	// Check if the user has permission to access the linked model.
-	allowed, err := app.authz.EnforceMediaAccess(user, media.Model.String)
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-
-	// For messages, check access to the conversation this message is part of.
-	if media.Model.String == "messages" {
-		conversation, err := app.conversation.GetConversationByMessageID(media.ModelID.Int)
+	// Check if user is authenticated (agent access)
+	auser := r.RequestCtx.UserValue("user")
+	if auser != nil {
+		// Authenticated.
+		user, err := app.user.GetAgent(auser.(amodels.User).ID, "")
 		if err != nil {
 			return sendErrorEnvelope(r, err)
 		}
-		allowed, err = app.authz.EnforceConversationAccess(user, conversation)
+
+		// Fetch media from DB.
+		media, err := app.media.Get(0, strings.TrimPrefix(uuid, thumbPrefix))
 		if err != nil {
 			return sendErrorEnvelope(r, err)
 		}
-	}
 
-	if !allowed {
-		return r.SendErrorEnvelope(http.StatusUnauthorized, app.i18n.Ts("globals.messages.denied", "name", "{globals.terms.permission}"), nil, envelope.UnauthorizedError)
+		// Check if the user has permission to access the linked model.
+		allowed, err := app.authz.EnforceMediaAccess(user, media.Model.String)
+		if err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+
+		// For messages, check access to the conversation this message is part of.
+		if media.Model.String == "messages" {
+			conversation, err := app.conversation.GetConversationByMessageID(media.ModelID.Int)
+			if err != nil {
+				return sendErrorEnvelope(r, err)
+			}
+			allowed, err = app.authz.EnforceConversationAccess(user, conversation)
+			if err != nil {
+				return sendErrorEnvelope(r, err)
+			}
+		}
+
+		if !allowed {
+			return r.SendErrorEnvelope(http.StatusUnauthorized, app.i18n.Ts("globals.messages.denied", "name", "{globals.terms.permission}"), nil, envelope.UnauthorizedError)
+		}
 	}
+	// If no authenticated user, the middleware has already verified the request signature serve the file.
 	consts := app.consts.Load().(*constants)
 	switch consts.UploadProvider {
 	case "fs":

cmd/messages.go

@@ -2,14 +2,11 @@ package main
 
 import (
 	"strconv"
-	"strings"
 
 	amodels "github.com/abhinavxd/libredesk/internal/auth/models"
-	authzModels "github.com/abhinavxd/libredesk/internal/authz/models"
 	cmodels "github.com/abhinavxd/libredesk/internal/conversation/models"
 	"github.com/abhinavxd/libredesk/internal/envelope"
 	medModels "github.com/abhinavxd/libredesk/internal/media/models"
-	umodels "github.com/abhinavxd/libredesk/internal/user/models"
 	"github.com/valyala/fasthttp"
 	"github.com/zerodha/fastglue"
 )
@@ -21,7 +18,6 @@ type messageReq struct {
 	To          []string `json:"to"`
 	CC          []string `json:"cc"`
 	BCC         []string `json:"bcc"`
-	SenderType  string   `json:"sender_type"`
 }
 
 // handleGetMessages returns messages for a conversation.
@@ -46,7 +42,7 @@ func handleGetMessages(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 
-	messages, pageSize, err := app.conversation.GetConversationMessages(uuid, page, pageSize)
+	messages, pageSize, err := app.conversation.GetConversationMessages(uuid, []string{cmodels.MessageIncoming, cmodels.MessageOutgoing, cmodels.MessageActivity}, nil, page, pageSize)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
@@ -57,10 +53,11 @@ func handleGetMessages(r *fastglue.Request) error {
 		for j := range messages[i].Attachments {
 			messages[i].Attachments[j].URL = app.media.GetURL(messages[i].Attachments[j].UUID)
 		}
-		// Redact CSAT survey link
-		messages[i].CensorCSATContent()
 	}
 
+	// Process CSAT status for all messages (will only affect CSAT messages)
+	app.conversation.ProcessCSATStatus(messages)
+
 	return r.SendEnvelope(envelope.PageResults{
 		Total:      total,
 		Results:    messages,
@@ -94,8 +91,10 @@ func handleGetMessage(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 
-	// Redact CSAT survey link
-	message.CensorCSATContent()
+	// Process CSAT status for the message (will only affect CSAT messages)
+	messages := []cmodels.Message{message}
+	app.conversation.ProcessCSATStatus(messages)
+	message = messages[0]
 
 	for j := range message.Attachments {
 		message.Attachments[j].URL = app.media.GetURL(message.Attachments[j].UUID)
@@ -104,7 +103,7 @@ func handleGetMessage(r *fastglue.Request) error {
 	return r.SendEnvelope(message)
 }
 
-// handleRetryMessage changes message status to `pending`, so it's enqueued for sending.
+// handleRetryMessage changes message status so it can be retried for sending.
 func handleRetryMessage(r *fastglue.Request) error {
 	var (
 		app   = r.Context.(*App)
@@ -155,31 +154,16 @@ func handleSendMessage(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
 	}
 
-	if req.SenderType != umodels.UserTypeAgent && req.SenderType != umodels.UserTypeContact {
-		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`sender_type`"), nil, envelope.InputError)
+	// Make sure the inbox is enabled.
+	inbox, err := app.inbox.GetDBRecord(conv.InboxID)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	if !inbox.Enabled {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.disabled", "name", "{globals.terms.inbox}"), nil, envelope.InputError)
 	}
 
-	// Contacts cannot send private messages
-	if req.SenderType == umodels.UserTypeContact && req.Private {
-		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("globals.messages.badRequest"), nil, envelope.InputError)
-	}
-
-	// Check if user has permission to send messages as contact
-	if req.SenderType == umodels.UserTypeContact {
-		parts := strings.Split(authzModels.PermMessagesWriteAsContact, ":")
-		if len(parts) != 2 {
-			return sendErrorEnvelope(r, envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.errorChecking", "name", "{globals.terms.permission}"), nil))
-		}
-		ok, err := app.authz.Enforce(user, parts[0], parts[1])
-		if err != nil {
-			return sendErrorEnvelope(r, envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.errorChecking", "name", "{globals.terms.permission}"), nil))
-		}
-		if !ok {
-			return r.SendErrorEnvelope(fasthttp.StatusForbidden, app.i18n.Ts("globals.messages.denied", "name", "{globals.terms.permission}"), nil, envelope.PermissionError)
-		}
-	}
-
-	// Get media for all attachments.
+	// Prepare attachments.
 	var media = make([]medModels.Media, 0, len(req.Attachments))
 	for _, id := range req.Attachments {
 		m, err := app.media.Get(id, "")
@@ -190,16 +174,6 @@ func handleSendMessage(r *fastglue.Request) error {
 		media = append(media, m)
 	}
 
-	// Create contact message.
-	if req.SenderType == umodels.UserTypeContact {
-		message, err := app.conversation.CreateContactMessage(media, int(conv.ContactID), cuuid, req.Message, cmodels.ContentTypeHTML)
-		if err != nil {
-			return sendErrorEnvelope(r, err)
-		}
-		return r.SendEnvelope(message)
-	}
-
-	// Send private note.
 	if req.Private {
 		message, err := app.conversation.SendPrivateNote(media, user.ID, cuuid, req.Message)
 		if err != nil {
@@ -208,8 +182,7 @@ func handleSendMessage(r *fastglue.Request) error {
 		return r.SendEnvelope(message)
 	}
 
-	// Queue reply.
-	message, err := app.conversation.QueueReply(media, conv.InboxID, user.ID, cuuid, req.Message, req.To, req.CC, req.BCC, map[string]any{} /**meta**/)
+	message, err := app.conversation.SendReply(media, conv.InboxID, user.ID, conv.ContactID, cuuid, req.Message, req.To, req.CC, req.BCC, map[string]any{} /**meta**/)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}

cmd/middlewares.go

@@ -97,6 +97,23 @@ func auth(handler fastglue.FastRequestHandler) fastglue.FastRequestHandler {
 	return func(r *fastglue.Request) error {
 		var app = r.Context.(*App)
 
+		// For media uploads, check if signature is provided in the query parameters, if so, verify it.
+		path := string(r.RequestCtx.Path())
+		if strings.HasPrefix(path, "/uploads/") {
+			signature := string(r.RequestCtx.QueryArgs().Peek("signature"))
+			expires := string(r.RequestCtx.QueryArgs().Peek("expires"))
+
+			if signature != "" && expires != "" {
+				if err := app.media.VerifySignature(r); err != nil {
+					app.lo.Error("error verifying media signature", "error",
+						err, "path", string(r.RequestCtx.Path()), "query", string(r.RequestCtx.QueryArgs().QueryString()))
+					return r.SendErrorEnvelope(http.StatusUnauthorized, "signature verification failed", nil, envelope.PermissionError)
+				}
+				return handler(r)
+			}
+			// If no signature, continue with normal authentication.
+		}
+
 		// Authenticate user using shared authentication logic
 		user, err := authenticateUser(r, app)
 		if err != nil {

cmd/oidc.go

@@ -11,6 +11,16 @@ import (
 	"github.com/zerodha/fastglue"
 )
 
+// handleGetAllEnabledOIDC returns all enabled OIDC records
+func handleGetAllEnabledOIDC(r *fastglue.Request) error {
+	app := r.Context.(*App)
+	out, err := app.oidc.GetAllEnabled()
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(out)
+}
+
 // handleGetAllOIDC returns all OIDC records
 func handleGetAllOIDC(r *fastglue.Request) error {
 	app := r.Context.(*App)
@@ -64,10 +74,10 @@ func handleCreateOIDC(r *fastglue.Request) error {
 	if err := reloadAuth(app); err != nil {
 		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, app.i18n.Ts("globals.messages.couldNotReload", "name", "OIDC"), nil, envelope.GeneralError)
 	}
-
+	
 	// Clear client secret before returning
 	createdOIDC.ClientSecret = strings.Repeat(stringutil.PasswordDummy, 10)
-
+	
 	return r.SendEnvelope(createdOIDC)
 }
 
@@ -100,10 +110,10 @@ func handleUpdateOIDC(r *fastglue.Request) error {
 	if err := reloadAuth(app); err != nil {
 		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, app.i18n.Ts("globals.messages.couldNotReload", "name", "OIDC"), nil, envelope.GeneralError)
 	}
-
+	
 	// Clear client secret before returning
 	updatedOIDC.ClientSecret = strings.Repeat(stringutil.PasswordDummy, 10)
-
+	
 	return r.SendEnvelope(updatedOIDC)
 }
 

cmd/settings.go

@@ -31,8 +31,6 @@ func handleGetGeneralSettings(r *fastglue.Request) error {
 	settings["app.update"] = app.update
 	// Set app version.
 	settings["app.version"] = versionString
-	// Set restart required flag.
-	settings["app.restart_required"] = app.restartRequired
 	return r.SendEnvelope(settings)
 }
 
@@ -47,11 +45,6 @@ func handleUpdateGeneralSettings(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("globals.messages.badRequest"), nil, envelope.InputError)
 	}
 
-	// Get current language before update.
-	app.Lock()
-	oldLang := ko.String("app.lang")
-	app.Unlock()
-
 	// Remove any trailing slash `/` from the root url.
 	req.RootURL = strings.TrimRight(req.RootURL, "/")
 
@@ -62,17 +55,6 @@ func handleUpdateGeneralSettings(r *fastglue.Request) error {
 	if err := reloadSettings(app); err != nil {
 		return envelope.NewError(envelope.GeneralError, app.i18n.Ts("globals.messages.couldNotReload", "name", app.i18n.T("globals.terms.setting")), nil)
 	}
-
-	// Check if language changed and reload i18n if needed.
-	app.Lock()
-	newLang := ko.String("app.lang")
-	if oldLang != newLang {
-		app.lo.Info("language changed, reloading i18n", "old_lang", oldLang, "new_lang", newLang)
-		app.i18n = initI18n(app.fs)
-		app.lo.Info("reloaded i18n", "old_lang", oldLang, "new_lang", newLang)
-	}
-	app.Unlock()
-
 	if err := reloadTemplates(app); err != nil {
 		return envelope.NewError(envelope.GeneralError, app.i18n.Ts("globals.messages.couldNotReload", "name", app.i18n.T("globals.terms.setting")), nil)
 	}
@@ -127,7 +109,6 @@ func handleUpdateEmailNotificationSettings(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("globals.messages.invalidFromAddress"), nil, envelope.InputError)
 	}
 
-	// If empty then retain previous password.
 	if req.Password == "" {
 		req.Password = cur.Password
 	}
@@ -136,10 +117,6 @@ func handleUpdateEmailNotificationSettings(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 
-	// Email notification settings require app restart to take effect.
-	app.Lock()
-	app.restartRequired = true
-	app.Unlock()
-
+	// No reload implemented, so user has to restart the app.
 	return r.SendEnvelope(true)
 }

cmd/snippets.go

@@ -0,0 +1,108 @@
+package main
+
+import (
+	"strconv"
+
+	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/valyala/fasthttp"
+	"github.com/zerodha/fastglue"
+)
+
+// snippetReq represents the request payload for snippets creation and updates.
+type snippetReq struct {
+	Content string `json:"content"`
+	Enabled bool   `json:"enabled"`
+}
+
+// validateSnippetReq validates the snippet request payload.
+func validateSnippetReq(r *fastglue.Request, snippetData *snippetReq) error {
+	var app = r.Context.(*App)
+	if snippetData.Content == "" {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`content`"), nil, envelope.InputError)
+	}
+	return nil
+}
+
+// handleGetAISnippets returns all AI snippets from the database.
+func handleGetAISnippets(r *fastglue.Request) error {
+	var app = r.Context.(*App)
+	snippets, err := app.ai.GetKnowledgeBaseItems()
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(snippets)
+}
+
+// handleGetAISnippet returns a single AI snippet by ID.
+func handleGetAISnippet(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.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+	snippet, err := app.ai.GetKnowledgeBaseItem(id)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(snippet)
+}
+
+// handleCreateAISnippet creates a new AI snippet in the database.
+func handleCreateAISnippet(r *fastglue.Request) error {
+	var (
+		app         = r.Context.(*App)
+		snippetData snippetReq
+	)
+	if err := r.Decode(&snippetData, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
+	}
+	if err := validateSnippetReq(r, &snippetData); err != nil {
+		return err
+	}
+
+	snippet, err := app.ai.CreateKnowledgeBaseItem("snippet", snippetData.Content, snippetData.Enabled)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(snippet)
+}
+
+// handleUpdateAISnippet updates an existing AI snippet in the database.
+func handleUpdateAISnippet(r *fastglue.Request) error {
+	var (
+		app         = r.Context.(*App)
+		snippetData snippetReq
+		id, _       = strconv.Atoi(r.RequestCtx.UserValue("id").(string))
+	)
+	if id <= 0 {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+	if err := r.Decode(&snippetData, "json"); err != nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
+	}
+	if err := validateSnippetReq(r, &snippetData); err != nil {
+		return err
+	}
+	snippet, err := app.ai.UpdateKnowledgeBaseItem(id, "snippet", snippetData.Content, snippetData.Enabled)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(snippet)
+}
+
+// handleDeleteAISnippet deletes an AI snippet from the database.
+func handleDeleteAISnippet(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.invalid", "name", "`id`"), nil, envelope.InputError)
+	}
+	if err := app.ai.DeleteKnowledgeBaseItem(id); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(true)
+}

cmd/teams.go

@@ -83,7 +83,7 @@ func handleUpdateTeam(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil))
 	}
 
-	updatedTeam, err := app.team.Update(id, req.Name, req.Timezone, req.ConversationAssignmentType, req.BusinessHoursID, req.SLAPolicyID, req.Emoji.String, req.MaxAutoAssignedConversations)
+	updatedTeam, err := app.team.Update(id, req.Name, req.Timezone, req.ConversationAssignmentType, req.BusinessHoursID, req.SLAPolicyID, req.Emoji.String, req.MaxAutoAssignedConversations);
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}

cmd/upgrade.go

@@ -35,7 +35,8 @@ var migList = []migFunc{
 	{"v0.5.0", migrations.V0_5_0},
 	{"v0.6.0", migrations.V0_6_0},
 	{"v0.7.0", migrations.V0_7_0},
-	{"v0.7.4", migrations.V0_7_4},
+	{"v0.8.0", migrations.V0_8_0},
+	{"v0.9.0", migrations.V0_9_0},
 }
 
 // upgrade upgrades the database to the current version by running SQL migration files

cmd/users.go

@@ -26,38 +26,34 @@ const (
 	maxAvatarSizeMB = 2
 )
 
-type updateAvailabilityRequest struct {
+// Request structs for user-related endpoints
+
+// UpdateAvailabilityRequest represents the request to update user availability
+type UpdateAvailabilityRequest struct {
 	Status string `json:"status"`
 }
 
-type resetPasswordRequest struct {
+// ResetPasswordRequest represents the password reset request
+type ResetPasswordRequest struct {
 	Email string `json:"email"`
 }
 
-type setPasswordRequest struct {
+// SetPasswordRequest represents the set password request
+type SetPasswordRequest struct {
 	Token    string `json:"token"`
 	Password string `json:"password"`
 }
 
-type availabilityRequest struct {
+// AvailabilityRequest represents the request to update agent availability
+type AvailabilityRequest struct {
 	Status string `json:"status"`
 }
 
-type agentReq struct {
-	FirstName          string   `json:"first_name"`
-	LastName           string   `json:"last_name"`
-	Email              string   `json:"email"`
-	SendWelcomeEmail   bool     `json:"send_welcome_email"`
-	Teams              []string `json:"teams"`
-	Roles              []string `json:"roles"`
-	Enabled            bool     `json:"enabled"`
-	AvailabilityStatus string   `json:"availability_status"`
-	NewPassword        string   `json:"new_password,omitempty"`
-}
-
 // handleGetAgents returns all agents.
 func handleGetAgents(r *fastglue.Request) error {
-	var app = r.Context.(*App)
+	var (
+		app = r.Context.(*App)
+	)
 	agents, err := app.user.GetAgents()
 	if err != nil {
 		return sendErrorEnvelope(r, err)
@@ -77,7 +73,9 @@ func handleGetAgentsCompact(r *fastglue.Request) error {
 
 // handleGetAgent returns an agent.
 func handleGetAgent(r *fastglue.Request) error {
-	var app = r.Context.(*App)
+	var (
+		app = r.Context.(*App)
+	)
 	id, err := strconv.Atoi(r.RequestCtx.UserValue("id").(string))
 	if err != nil || id <= 0 {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`id`"), nil, envelope.InputError)
@@ -95,7 +93,7 @@ func handleUpdateAgentAvailability(r *fastglue.Request) error {
 		app      = r.Context.(*App)
 		auser    = r.RequestCtx.UserValue("user").(amodels.User)
 		ip       = realip.FromRequest(r.RequestCtx)
-		availReq availabilityRequest
+		availReq AvailabilityRequest
 	)
 
 	// Decode JSON request
@@ -103,7 +101,6 @@ func handleUpdateAgentAvailability(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
 	}
 
-	// Fetch entire agent
 	agent, err := app.user.GetAgent(auser.ID, "")
 	if err != nil {
 		return sendErrorEnvelope(r, err)
@@ -111,10 +108,10 @@ func handleUpdateAgentAvailability(r *fastglue.Request) error {
 
 	// Same status?
 	if agent.AvailabilityStatus == availReq.Status {
-		return r.SendEnvelope(agent)
+		return r.SendEnvelope(true)
 	}
 
-	// Update availability status
+	// Update availability status.
 	if err := app.user.UpdateAvailability(auser.ID, availReq.Status); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
@@ -126,22 +123,21 @@ func handleUpdateAgentAvailability(r *fastglue.Request) error {
 		}
 	}
 
-	// Fetch updated agent and return
-	agent, err = app.user.GetAgent(auser.ID, "")
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-
-	return r.SendEnvelope(agent)
+	return r.SendEnvelope(true)
 }
 
-// handleGetCurrentAgentTeams returns the teams of current agent.
+// handleGetCurrentAgentTeams returns the teams of an agent.
 func handleGetCurrentAgentTeams(r *fastglue.Request) error {
 	var (
 		app   = r.Context.(*App)
 		auser = r.RequestCtx.UserValue("user").(amodels.User)
 	)
-	teams, err := app.team.GetUserTeams(auser.ID)
+	agent, err := app.user.GetAgent(auser.ID, "")
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
+	teams, err := app.team.GetUserTeams(agent.ID)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
@@ -154,6 +150,11 @@ func handleUpdateCurrentAgent(r *fastglue.Request) error {
 		app   = r.Context.(*App)
 		auser = r.RequestCtx.UserValue("user").(amodels.User)
 	)
+	agent, err := app.user.GetAgent(auser.ID, "")
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+
 	form, err := r.RequestCtx.MultipartForm()
 	if err != nil {
 		app.lo.Error("error parsing form data", "error", err)
@@ -164,53 +165,54 @@ func handleUpdateCurrentAgent(r *fastglue.Request) error {
 
 	// Upload avatar?
 	if ok && len(files) > 0 {
-		agent, err := app.user.GetAgent(auser.ID, "")
-		if err != nil {
-			return sendErrorEnvelope(r, err)
-		}
-		if err := uploadUserAvatar(r, agent, files); err != nil {
+		if err := uploadUserAvatar(r, &agent, files); err != nil {
 			return sendErrorEnvelope(r, err)
 		}
 	}
-
-	// Fetch updated agent and return.
-	agent, err := app.user.GetAgent(auser.ID, "")
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-
-	return r.SendEnvelope(agent)
+	return r.SendEnvelope(true)
 }
 
 // handleCreateAgent creates a new agent.
 func handleCreateAgent(r *fastglue.Request) error {
 	var (
-		app = r.Context.(*App)
-		req = agentReq{}
+		app  = r.Context.(*App)
+		user = models.User{}
 	)
-
-	if err := r.Decode(&req, "json"); err != nil {
+	if err := r.Decode(&user, "json"); err != nil {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
 	}
 
-	// Validate agent request
-	if err := validateAgentRequest(r, &req); err != nil {
-		return err
+	if user.Email.String == "" {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`email`"), nil, envelope.InputError)
+	}
+	user.Email = null.StringFrom(strings.TrimSpace(strings.ToLower(user.Email.String)))
+
+	if !stringutil.ValidEmail(user.Email.String) {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`email`"), nil, envelope.InputError)
 	}
 
-	agent, err := app.user.CreateAgent(req.FirstName, req.LastName, req.Email, req.Roles)
-	if err != nil {
+	if user.Roles == nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`role`"), nil, envelope.InputError)
+	}
+
+	if user.FirstName == "" {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`first_name`"), nil, envelope.InputError)
+	}
+
+	if err := app.user.CreateAgent(&user); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
 	// Upsert user teams.
-	if len(req.Teams) > 0 {
-		app.team.UpsertUserTeams(agent.ID, req.Teams)
+	if len(user.Teams) > 0 {
+		if err := app.team.UpsertUserTeams(user.ID, user.Teams.Names()); err != nil {
+			return sendErrorEnvelope(r, err)
+		}
 	}
 
-	if req.SendWelcomeEmail {
+	if user.SendWelcomeEmail {
 		// Generate reset token.
-		resetToken, err := app.user.SetResetPasswordToken(agent.ID)
+		resetToken, err := app.user.SetResetPasswordToken(user.ID)
 		if err != nil {
 			return sendErrorEnvelope(r, err)
 		}
@@ -218,36 +220,31 @@ func handleCreateAgent(r *fastglue.Request) error {
 		// Render template and send email.
 		content, err := app.tmpl.RenderInMemoryTemplate(tmpl.TmplWelcome, map[string]any{
 			"ResetToken": resetToken,
-			"Email":      req.Email,
+			"Email":      user.Email.String,
 		})
 		if err != nil {
 			app.lo.Error("error rendering template", "error", err)
+			return r.SendEnvelope(true)
 		}
 
 		if err := app.notifier.Send(notifier.Message{
-			RecipientEmails: []string{req.Email},
-			Subject:         app.i18n.T("globals.messages.welcomeToLibredesk"),
+			RecipientEmails: []string{user.Email.String},
+			Subject:         "Welcome to Libredesk",
 			Content:         content,
 			Provider:        notifier.ProviderEmail,
 		}); err != nil {
 			app.lo.Error("error sending notification message", "error", err)
+			return r.SendEnvelope(true)
 		}
 	}
-
-	// Refetch agent as other details might've changed.
-	agent, err = app.user.GetAgent(agent.ID, "")
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-
-	return r.SendEnvelope(agent)
+	return r.SendEnvelope(true)
 }
 
 // handleUpdateAgent updates an agent.
 func handleUpdateAgent(r *fastglue.Request) error {
 	var (
 		app   = r.Context.(*App)
-		req   = agentReq{}
+		user  = models.User{}
 		auser = r.RequestCtx.UserValue("user").(amodels.User)
 		ip    = realip.FromRequest(r.RequestCtx)
 		id, _ = strconv.Atoi(r.RequestCtx.UserValue("id").(string))
@@ -256,13 +253,25 @@ func handleUpdateAgent(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`id`"), nil, envelope.InputError)
 	}
 
-	if err := r.Decode(&req, "json"); err != nil {
+	if err := r.Decode(&user, "json"); err != nil {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
 	}
 
-	// Validate agent request
-	if err := validateAgentRequest(r, &req); err != nil {
-		return err
+	if user.Email.String == "" {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`email`"), nil, envelope.InputError)
+	}
+	user.Email = null.StringFrom(strings.TrimSpace(strings.ToLower(user.Email.String)))
+
+	if !stringutil.ValidEmail(user.Email.String) {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`email`"), nil, envelope.InputError)
+	}
+
+	if user.Roles == nil {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`role`"), nil, envelope.InputError)
+	}
+
+	if user.FirstName == "" {
+		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`first_name`"), nil, envelope.InputError)
 	}
 
 	agent, err := app.user.GetAgent(id, "")
@@ -271,8 +280,8 @@ func handleUpdateAgent(r *fastglue.Request) error {
 	}
 	oldAvailabilityStatus := agent.AvailabilityStatus
 
-	// Update agent with individual fields
-	if err = app.user.UpdateAgent(id, req.FirstName, req.LastName, req.Email, req.Roles, req.Enabled, req.AvailabilityStatus, req.NewPassword); err != nil {
+	// Update agent.
+	if err = app.user.UpdateAgent(id, user); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
@@ -280,24 +289,18 @@ func handleUpdateAgent(r *fastglue.Request) error {
 	defer app.authz.InvalidateUserCache(id)
 
 	// Create activity log if user availability status changed.
-	if oldAvailabilityStatus != req.AvailabilityStatus {
-		if err := app.activityLog.UserAvailability(auser.ID, auser.Email, req.AvailabilityStatus, ip, req.Email, id); err != nil {
+	if oldAvailabilityStatus != user.AvailabilityStatus {
+		if err := app.activityLog.UserAvailability(auser.ID, auser.Email, user.AvailabilityStatus, ip, user.Email.String, id); err != nil {
 			app.lo.Error("error creating activity log", "error", err)
 		}
 	}
 
 	// Upsert agent teams.
-	if err := app.team.UpsertUserTeams(id, req.Teams); err != nil {
+	if err := app.team.UpsertUserTeams(id, user.Teams.Names()); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	// Refetch agent and return.
-	agent, err = app.user.GetAgent(id, "")
-	if err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-
-	return r.SendEnvelope(agent)
+	return r.SendEnvelope(true)
 }
 
 // handleDeleteAgent soft deletes an agent.
@@ -378,7 +381,7 @@ func handleResetPassword(r *fastglue.Request) error {
 	var (
 		app       = r.Context.(*App)
 		auser, ok = r.RequestCtx.UserValue("user").(amodels.User)
-		resetReq  resetPasswordRequest
+		resetReq  ResetPasswordRequest
 	)
 	if ok && auser.ID > 0 {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.T("user.userAlreadyLoggedIn"), nil, envelope.InputError)
@@ -396,7 +399,7 @@ func handleResetPassword(r *fastglue.Request) error {
 	agent, err := app.user.GetAgent(0, resetReq.Email)
 	if err != nil {
 		// Send 200 even if user not found, to prevent email enumeration.
-		return r.SendEnvelope(true)
+		return r.SendEnvelope("Reset password email sent successfully.")
 	}
 
 	token, err := app.user.SetResetPasswordToken(agent.ID)
@@ -431,7 +434,7 @@ func handleSetPassword(r *fastglue.Request) error {
 	var (
 		app       = r.Context.(*App)
 		agent, ok = r.RequestCtx.UserValue("user").(amodels.User)
-		req       setPasswordRequest
+		req       = SetPasswordRequest{}
 	)
 
 	if ok && agent.ID > 0 {
@@ -454,13 +457,13 @@ func handleSetPassword(r *fastglue.Request) error {
 }
 
 // uploadUserAvatar uploads the user avatar.
-func uploadUserAvatar(r *fastglue.Request, user models.User, files []*multipart.FileHeader) error {
+func uploadUserAvatar(r *fastglue.Request, user *models.User, files []*multipart.FileHeader) error {
 	var app = r.Context.(*App)
 
 	fileHeader := files[0]
 	file, err := fileHeader.Open()
 	if err != nil {
-		app.lo.Error("error opening uploaded file", "user_id", user.ID, "error", err)
+		app.lo.Error("error opening uploaded file", "error", err)
 		return envelope.NewError(envelope.GeneralError, app.i18n.Ts("globals.messages.errorReading", "name", "{globals.terms.file}"), nil)
 	}
 	defer file.Close()
@@ -477,7 +480,7 @@ func uploadUserAvatar(r *fastglue.Request, user models.User, files []*multipart.
 
 	// Check file size
 	if bytesToMegabytes(srcFileSize) > maxAvatarSizeMB {
-		app.lo.Error("error uploaded file size is larger than max allowed", "user_id", user.ID, "size", bytesToMegabytes(srcFileSize), "max_allowed", maxAvatarSizeMB)
+		app.lo.Error("error uploaded file size is larger than max allowed", "size", bytesToMegabytes(srcFileSize), "max_allowed", maxAvatarSizeMB)
 		return envelope.NewError(
 			envelope.InputError,
 			app.i18n.Ts("media.fileSizeTooLarge", "size", fmt.Sprintf("%dMB", maxAvatarSizeMB)),
@@ -494,25 +497,23 @@ func uploadUserAvatar(r *fastglue.Request, user models.User, files []*multipart.
 	meta := []byte("{}")
 	media, err := app.media.UploadAndInsert(srcFileName, srcContentType, contentID, linkedModel, linkedID, file, int(srcFileSize), disposition, meta)
 	if err != nil {
-		app.lo.Error("error uploading file", "user_id", user.ID, "error", err)
+		app.lo.Error("error uploading file", "error", err)
 		return envelope.NewError(envelope.GeneralError, app.i18n.Ts("globals.messages.errorUploading", "name", "{globals.terms.file}"), nil)
 	}
 
 	// Delete current avatar.
 	if user.AvatarURL.Valid {
 		fileName := filepath.Base(user.AvatarURL.String)
-		if err := app.media.Delete(fileName); err != nil {
-			app.lo.Error("error deleting user avatar", "user_id", user.ID, "error", err)
-		}
+		app.media.Delete(fileName)
 	}
 
 	// Save file path.
 	path, err := stringutil.GetPathFromURL(media.URL)
 	if err != nil {
-		app.lo.Debug("error getting path from URL", "user_id", user.ID, "url", media.URL, "error", err)
+		app.lo.Debug("error getting path from URL", "url", media.URL, "error", err)
 		return envelope.NewError(envelope.GeneralError, app.i18n.Ts("globals.messages.errorUploading", "name", "{globals.terms.file}"), nil)
 	}
-
+	fmt.Println("path", path)
 	if err := app.user.UpdateAvatar(user.ID, path); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
@@ -576,28 +577,3 @@ func handleRevokeAPIKey(r *fastglue.Request) error {
 
 	return r.SendEnvelope(true)
 }
-
-// validateAgentRequest validates common agent request fields and normalizes the email
-func validateAgentRequest(r *fastglue.Request, req *agentReq) error {
-	var app = r.Context.(*App)
-
-	// Normalize email
-	req.Email = strings.TrimSpace(strings.ToLower(req.Email))
-	if req.Email == "" {
-		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`email`"), nil, envelope.InputError)
-	}
-
-	if !stringutil.ValidEmail(req.Email) {
-		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`email`"), nil, envelope.InputError)
-	}
-
-	if req.Roles == nil {
-		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`role`"), nil, envelope.InputError)
-	}
-
-	if req.FirstName == "" {
-		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`first_name`"), nil, envelope.InputError)
-	}
-
-	return nil
-}

cmd/widget_middleware.go

@@ -0,0 +1,167 @@
+package main
+
+import (
+	"fmt"
+	"strconv"
+	"strings"
+
+	"github.com/abhinavxd/libredesk/internal/envelope"
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat"
+	imodels "github.com/abhinavxd/libredesk/internal/inbox/models"
+	"github.com/valyala/fasthttp"
+	"github.com/zerodha/fastglue"
+)
+
+const (
+	// Context keys for storing authenticated widget data
+	ctxWidgetClaims    = "widget_claims"
+	ctxWidgetInboxID   = "widget_inbox_id"
+	ctxWidgetContactID = "widget_contact_id"
+	ctxWidgetInbox     = "widget_inbox"
+
+	// Header sent in every widget request to identify the inbox
+	hdrWidgetInboxID = "X-Libredesk-Inbox-ID"
+)
+
+// widgetAuth middleware authenticates widget requests using JWT and inbox validation.
+// It always validates the inbox from X-Libredesk-Inbox-ID header, and conditionally validates JWT.
+// For /conversations/init without JWT, it allows visitor creation while still validating inbox.
+func widgetAuth(next func(*fastglue.Request) error) func(*fastglue.Request) error {
+	return func(r *fastglue.Request) error {
+		var (
+			app = r.Context.(*App)
+		)
+
+		// Always extract and validate inbox_id from custom header
+		inboxIDHeader := string(r.RequestCtx.Request.Header.Peek(hdrWidgetInboxID))
+		if inboxIDHeader == "" {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.required", "name", "{globals.terms.inbox}"), nil, envelope.InputError)
+		}
+
+		inboxID, err := strconv.Atoi(inboxIDHeader)
+		if err != nil || inboxID <= 0 {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "{globals.terms.inbox}"), nil, envelope.InputError)
+		}
+
+		// Always fetch and validate inbox
+		inbox, err := app.inbox.GetDBRecord(inboxID)
+		if err != nil {
+			app.lo.Error("error fetching inbox", "inbox_id", inboxID, "error", err)
+			return sendErrorEnvelope(r, err)
+		}
+
+		if !inbox.Enabled {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.disabled", "name", "{globals.terms.inbox}"), nil, envelope.InputError)
+		}
+
+		// Check if inbox is the correct type for widget requests
+		if inbox.Channel != livechat.ChannelLiveChat {
+			return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.notFound", "name", "{globals.terms.inbox}"), nil, envelope.InputError)
+		}
+
+		// Always store inbox data in context
+		r.RequestCtx.SetUserValue(ctxWidgetInboxID, inboxID)
+		r.RequestCtx.SetUserValue(ctxWidgetInbox, inbox)
+
+		// Extract JWT from Authorization header (Bearer token)
+		authHeader := string(r.RequestCtx.Request.Header.Peek("Authorization"))
+
+		// For init endpoint, allow requests without JWT (visitor creation)
+		if authHeader == "" && strings.Contains(string(r.RequestCtx.Path()), "/conversations/init") {
+			return next(r)
+		}
+
+		// For all other requests, require JWT
+		if authHeader == "" || !strings.HasPrefix(authHeader, "Bearer ") {
+			return r.SendErrorEnvelope(fasthttp.StatusUnauthorized, app.i18n.T("globals.terms.unAuthorized"), nil, envelope.UnauthorizedError)
+		}
+		jwtToken := strings.TrimPrefix(authHeader, "Bearer ")
+
+		// Verify JWT using inbox secret
+		claims, err := verifyStandardJWT(jwtToken, inbox.Secret.String)
+		if err != nil {
+			app.lo.Error("invalid JWT", "jwt", jwtToken, "error", err)
+			return r.SendErrorEnvelope(fasthttp.StatusUnauthorized, app.i18n.T("globals.terms.unAuthorized"), nil, envelope.UnauthorizedError)
+		}
+
+		// Resolve user/contact ID from JWT claims
+		contactID, err := resolveUserIDFromClaims(app, claims)
+		if err != nil {
+			envErr, ok := err.(envelope.Error)
+			if ok && envErr.ErrorType != envelope.NotFoundError {
+				app.lo.Error("error resolving user ID from JWT claims", "error", err)
+				return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, app.i18n.Ts("globals.messages.errorFetching", "name", "{globals.terms.user}"), nil, envelope.GeneralError)
+			}
+		}
+
+		// Store authenticated data in request context for downstream handlers
+		r.RequestCtx.SetUserValue(ctxWidgetClaims, claims)
+		r.RequestCtx.SetUserValue(ctxWidgetContactID, contactID)
+
+		return next(r)
+	}
+}
+
+// Helper functions to extract authenticated data from request context
+
+// getWidgetInboxID extracts inbox ID from request context
+func getWidgetInboxID(r *fastglue.Request) (int, error) {
+	val := r.RequestCtx.UserValue(ctxWidgetInboxID)
+	if val == nil {
+		return 0, fmt.Errorf("widget middleware not applied: missing inbox ID in context")
+	}
+	inboxID, ok := val.(int)
+	if !ok {
+		return 0, fmt.Errorf("invalid inbox ID type in context")
+	}
+	return inboxID, nil
+}
+
+// getWidgetContactID extracts contact ID from request context
+func getWidgetContactID(r *fastglue.Request) (int, error) {
+	val := r.RequestCtx.UserValue(ctxWidgetContactID)
+	if val == nil {
+		return 0, fmt.Errorf("widget middleware not applied: missing contact ID in context")
+	}
+	contactID, ok := val.(int)
+	if !ok {
+		return 0, fmt.Errorf("invalid contact ID type in context")
+	}
+	return contactID, nil
+}
+
+// getWidgetInbox extracts inbox model from request context
+func getWidgetInbox(r *fastglue.Request) (imodels.Inbox, error) {
+	val := r.RequestCtx.UserValue(ctxWidgetInbox)
+	if val == nil {
+		return imodels.Inbox{}, fmt.Errorf("widget middleware not applied: missing inbox in context")
+	}
+	inbox, ok := val.(imodels.Inbox)
+	if !ok {
+		return imodels.Inbox{}, fmt.Errorf("invalid inbox type in context")
+	}
+	return inbox, nil
+}
+
+// getWidgetClaimsOptional extracts JWT claims from request context, returns nil if not set
+func getWidgetClaimsOptional(r *fastglue.Request) *Claims {
+	val := r.RequestCtx.UserValue(ctxWidgetClaims)
+	if val == nil {
+		return nil
+	}
+	if claims, ok := val.(Claims); ok {
+		return &claims
+	}
+	return nil
+}
+
+// rateLimitWidget applies rate limiting to widget endpoints.
+func rateLimitWidget(handler fastglue.FastRequestHandler) fastglue.FastRequestHandler {
+	return func(r *fastglue.Request) error {
+		app := r.Context.(*App)
+		if err := app.rateLimit.CheckWidgetLimit(r.RequestCtx); err != nil {
+			return err
+		}
+		return handler(r)
+	}
+}

cmd/widget_ws.go

@@ -0,0 +1,272 @@
+package main
+
+import (
+	"encoding/json"
+	"fmt"
+
+	"github.com/abhinavxd/libredesk/internal/inbox/channel/livechat"
+	"github.com/fasthttp/websocket"
+	"github.com/zerodha/fastglue"
+)
+
+// Widget WebSocket message types
+const (
+	WidgetMsgTypeJoin    = "join"
+	WidgetMsgTypeMessage = "message"
+	WidgetMsgTypeTyping  = "typing"
+	WidgetMsgTypePing    = "ping"
+	WidgetMsgTypePong    = "pong"
+	WidgetMsgTypeError   = "error"
+	WidgetMsgTypeNewMsg  = "new_message"
+	WidgetMsgTypeStatus  = "status"
+	WidgetMsgTypeJoined  = "joined"
+)
+
+// WidgetMessage represents a message sent through the widget WebSocket
+type WidgetMessage struct {
+	Type string `json:"type"`
+	JWT  string `json:"jwt,omitempty"`
+	Data any    `json:"data"`
+}
+
+type WidgetInboxJoinRequest struct {
+	InboxID int `json:"inbox_id"`
+}
+
+// WidgetMessageData represents a chat message through the widget
+type WidgetMessageData struct {
+	ConversationUUID string `json:"conversation_uuid"`
+	Content          string `json:"content"`
+	SenderName       string `json:"sender_name,omitempty"`
+	SenderType       string `json:"sender_type"`
+	Timestamp        int64  `json:"timestamp"`
+}
+
+// WidgetTypingData represents typing indicator data
+type WidgetTypingData struct {
+	ConversationUUID string `json:"conversation_uuid"`
+	IsTyping         bool   `json:"is_typing"`
+}
+
+// handleWidgetWS handles the widget WebSocket connection for live chat.
+func handleWidgetWS(r *fastglue.Request) error {
+	var app = r.Context.(*App)
+
+	if err := upgrader.Upgrade(r.RequestCtx, func(conn *websocket.Conn) {
+		// To store client and live chat references for cleanup.
+		var client *livechat.Client
+		var liveChat *livechat.LiveChat
+
+		// Clean up client when connection closes.
+		defer func() {
+			conn.Close()
+			if client != nil && liveChat != nil {
+				liveChat.RemoveClient(client)
+				close(client.Channel)
+				app.lo.Debug("cleaned up client on websocket disconnect", "client_id", client.ID)
+			}
+		}()
+
+		// Read messages from the WebSocket connection.
+		for {
+			var msg WidgetMessage
+			if err := conn.ReadJSON(&msg); err != nil {
+				app.lo.Debug("widget websocket connection closed", "error", err)
+				break
+			}
+
+			switch msg.Type {
+			// Inbox join request.
+			case WidgetMsgTypeJoin:
+				var joinedClient *livechat.Client
+				var joinedLiveChat *livechat.LiveChat
+				var err error
+				if joinedClient, joinedLiveChat, err = handleInboxJoin(app, conn, &msg); err != nil {
+					app.lo.Error("error handling widget join", "error", err)
+					sendWidgetError(conn, "Failed to join conversation")
+					continue
+				}
+				// Store the client and livechat reference for cleanup.
+				client = joinedClient
+				liveChat = joinedLiveChat
+			// Typing.
+			case WidgetMsgTypeTyping:
+				if err := handleWidgetTyping(app, &msg); err != nil {
+					app.lo.Error("error handling widget typing", "error", err)
+					continue
+				}
+			// Ping.
+			case WidgetMsgTypePing:
+				if err := conn.WriteJSON(WidgetMessage{
+					Type: WidgetMsgTypePong,
+				}); err != nil {
+					app.lo.Error("error writing pong to widget client", "error", err)
+				}
+			}
+		}
+	}); err != nil {
+		app.lo.Error("error upgrading widget websocket connection", "error", err)
+	}
+	return nil
+}
+
+// handleInboxJoin handles a websocket join request for a live chat inbox.
+func handleInboxJoin(app *App, conn *websocket.Conn, msg *WidgetMessage) (*livechat.Client, *livechat.LiveChat, error) {
+	joinDataBytes, err := json.Marshal(msg.Data)
+	if err != nil {
+		return nil, nil, fmt.Errorf("invalid join data: %w", err)
+	}
+
+	var joinData WidgetInboxJoinRequest
+	if err := json.Unmarshal(joinDataBytes, &joinData); err != nil {
+		return nil, nil, fmt.Errorf("invalid join data format: %w", err)
+	}
+
+	// Validate JWT with inbox secret
+	claims, err := validateWidgetMessageJWT(app, msg.JWT, joinData.InboxID)
+	if err != nil {
+		return nil, nil, fmt.Errorf("JWT validation failed: %w", err)
+	}
+
+	// Resolve user ID.
+	userID, err := resolveUserIDFromClaims(app, claims)
+	if err != nil {
+		return nil, nil, fmt.Errorf("failed to resolve user ID from claims: %w", err)
+	}
+
+	// Make sure inbox is active.
+	inbox, err := app.inbox.GetDBRecord(joinData.InboxID)
+	if err != nil {
+		return nil, nil, fmt.Errorf("inbox not found: %w", err)
+	}
+	if !inbox.Enabled {
+		return nil, nil, fmt.Errorf("inbox is not enabled")
+	}
+
+	// Get live chat inbox
+	lcInbox, err := app.inbox.Get(inbox.ID)
+	if err != nil {
+		return nil, nil, fmt.Errorf("live chat inbox not found: %w", err)
+	}
+
+	// Assert type.
+	liveChat, ok := lcInbox.(*livechat.LiveChat)
+	if !ok {
+		return nil, nil, fmt.Errorf("inbox is not a live chat inbox")
+	}
+
+	// Add client to live chat session
+	userIDStr := fmt.Sprintf("%d", userID)
+	client, err := liveChat.AddClient(userIDStr)
+	if err != nil {
+		app.lo.Error("error adding client to live chat", "error", err, "user_id", userIDStr)
+		return nil, nil, err
+	}
+
+	// Start listening for messages from the live chat channel.
+	go func() {
+		for msgData := range client.Channel {
+			if err := conn.WriteMessage(websocket.TextMessage, msgData); err != nil {
+				app.lo.Error("error forwarding message to widget client", "error", err)
+				return
+			}
+		}
+	}()
+
+	// Send join confirmation
+	joinResp := WidgetMessage{
+		Type: WidgetMsgTypeJoined,
+		Data: map[string]string{
+			"message": "namaste!",
+		},
+	}
+
+	if err := conn.WriteJSON(joinResp); err != nil {
+		return nil, nil, err
+	}
+
+	app.lo.Debug("widget client joined live chat", "user_id", userIDStr, "inbox_id", joinData.InboxID)
+
+	return client, liveChat, nil
+}
+
+// handleWidgetTyping handles typing indicators
+func handleWidgetTyping(app *App, msg *WidgetMessage) error {
+	typingDataBytes, err := json.Marshal(msg.Data)
+	if err != nil {
+		app.lo.Error("error marshalling typing data", "error", err)
+		return fmt.Errorf("invalid typing data: %w", err)
+	}
+
+	var typingData WidgetTypingData
+	if err := json.Unmarshal(typingDataBytes, &typingData); err != nil {
+		app.lo.Error("error unmarshalling typing data", "error", err)
+		return fmt.Errorf("invalid typing data format: %w", err)
+	}
+
+	// Get conversation to retrieve inbox ID for JWT validation
+	if typingData.ConversationUUID == "" {
+		return fmt.Errorf("conversation UUID is required for typing messages")
+	}
+
+	conversation, err := app.conversation.GetConversation(0, typingData.ConversationUUID)
+	if err != nil {
+		app.lo.Error("error fetching conversation for typing", "conversation_uuid", typingData.ConversationUUID, "error", err)
+		return fmt.Errorf("conversation not found: %w", err)
+	}
+
+	// Validate JWT with inbox secret
+	claims, err := validateWidgetMessageJWT(app, msg.JWT, conversation.InboxID)
+	if err != nil {
+		return fmt.Errorf("JWT validation failed: %w", err)
+	}
+
+	userID := claims.UserID
+
+	// Broadcast typing status to agents via conversation manager
+	// Set broadcastToWidgets=false to avoid echoing back to widget clients
+	app.conversation.BroadcastTypingToConversation(typingData.ConversationUUID, typingData.IsTyping, false)
+
+	app.lo.Debug("Broadcasted typing data from widget user to agents", "user_id", userID, "is_typing", typingData.IsTyping, "conversation_uuid", typingData.ConversationUUID)
+	return nil
+}
+
+// validateWidgetMessageJWT validates the incoming widget message JWT using inbox secret
+func validateWidgetMessageJWT(app *App, jwtToken string, inboxID int) (Claims, error) {
+	if jwtToken == "" {
+		return Claims{}, fmt.Errorf("JWT token is empty")
+	}
+
+	if inboxID <= 0 {
+		return Claims{}, fmt.Errorf("inbox ID is required for JWT validation")
+	}
+
+	// Get inbox to retrieve secret for JWT verification
+	inbox, err := app.inbox.GetDBRecord(inboxID)
+	if err != nil {
+		return Claims{}, fmt.Errorf("inbox not found: %w", err)
+	}
+
+	if !inbox.Secret.Valid || inbox.Secret.String == "" {
+		return Claims{}, fmt.Errorf("inbox secret not configured for JWT verification")
+	}
+
+	// Use the existing verifyStandardJWT function which properly validates with inbox secret
+	claims, err := verifyStandardJWT(jwtToken, inbox.Secret.String)
+	if err != nil {
+		return Claims{}, fmt.Errorf("JWT validation failed: %w", err)
+	}
+
+	return claims, nil
+}
+
+// sendWidgetError sends an error message to the widget client
+func sendWidgetError(conn *websocket.Conn, message string) {
+	errorMsg := WidgetMessage{
+		Type: WidgetMsgTypeError,
+		Data: map[string]string{
+			"message": message,
+		},
+	}
+	conn.WriteJSON(errorMsg)
+}

config.sample.toml

@@ -122,3 +122,37 @@ unsnooze_interval = "5m"
 [sla]
 # How often to evaluate SLA compliance for conversations
 evaluation_interval = "5m"
+
+[rate_limit]
+[rate_limit.widget]
+enabled = true
+requests_per_minute = 100
+
+[ai]
+[ai.embedding]
+provider = "openai"
+url = "https://api.openai.com/v1/embeddings"
+api_key = "secret"
+model = "text-embedding-3-small"
+timeout = "20s"
+
+[ai.embedding.chunking]
+# Maximum tokens per chunk (increase for larger context models)
+max_tokens = 2000
+# Minimum tokens per chunk (smaller chunks may lack context)
+min_tokens = 400
+# Overlap tokens between chunks for context continuity
+overlap_tokens = 150
+
+[ai.completion]
+provider = "openai"
+url = "https://api.openai.com/v1/chat/completions"
+api_key = "secret"
+model = "gpt-oss:20b"
+temperature = 0.2
+max_tokens = 1000
+timeout = "30s"
+
+[ai.worker]
+workers = 50
+capacity = 10000

docs/docs/api-getting-started.md

@@ -0,0 +1,30 @@
+# API getting started
+
+You can access the Libredesk API to interact with your instance programmatically.
+
+## Generating API keys
+
+1. **Edit agent**: Go to Admin → Teammate → Agent → Edit
+2. **Generate new API key**: An API Key and API Secret will be generated for the agent
+3. **Save the credentials**: Keep both the API Key and API Secret secure
+4. **Key management**: You can revoke / regenerate API keys at any time from the same page
+
+## Using the API
+
+LibreDesk supports two authentication schemes:
+
+### Basic authentication
+```bash
+curl -X GET "https://your-libredesk-instance.com/api/endpoint" \
+  -H "Authorization: Basic <base64_encoded_key:secret>"
+```
+
+### Token authentication
+```bash
+curl -X GET "https://your-libredesk-instance.com/api/endpoint" \
+  -H "Authorization: token your_api_key:your_api_secret"
+```
+
+## API Documentation
+
+Complete API documentation with available endpoints and examples coming soon.

docs/docs/developer-setup.md

@@ -0,0 +1,32 @@
+# Developer Setup
+
+Libredesk is a monorepo with a Go backend and a Vue.js frontend. The frontend uses Shadcn for UI components.
+
+### Pre-requisites
+
+- go
+- nodejs (if you are working on the frontend) and `pnpm`
+- redis
+- postgres database (>= 13)
+
+### First time setup
+
+Clone the repository:
+
+```sh
+git clone https://github.com/abhinavxd/libredesk.git
+```
+
+1. Copy `config.toml.sample` as `config.toml` and add your config.
+2. Run `make` to build the libredesk binary. Once the binary is built, run `./libredesk --install` to run the DB setup and set the System user password.
+
+### Running the Dev Environment
+
+1. Run `make run-backend` to start the libredesk backend dev server on `:9000`.
+2. Run `make run-frontend` to start the Vue frontend in dev mode using pnpm on `:8000`. Requests are proxied to the backend running on `:9000` check `vite.config.js` for the proxy config.
+
+---
+
+# Production Build
+
+Run `make` to build the Go binary, build the Javascript frontend, and embed the static assets producing a single self-contained binary, `libredesk`.

docs/docs/index.md

@@ -0,0 +1,17 @@
+# Introduction
+
+Libredesk is an open-source, self-hosted customer support desk — single binary app.
+
+<div style="border: 1px solid #ccc; padding: 2px; border-radius: 6px; box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1); background-color: #f9f9f9;">
+  <a href="https://libredesk.io">
+    <img src="images/hero.png" alt="libredesk UI screenshot" style="display: block; margin: 0 auto; max-width: 100%; border-radius: 4px;" />
+  </a>
+</div>
+
+## Developers
+
+Libredesk is licensed under AGPLv3. Contributions are welcome.
+
+- Source code: [GitHub](https://github.com/abhinavxd/libredesk)
+- Setup guide: [Developer setup](developer-setup.md)
+- Stack: Go backend, Vue 3 frontend (Shadcn UI)

docs/docs/installation.md

@@ -0,0 +1,65 @@
+# Installation
+
+Libredesk is a single binary application that requires postgres and redis to run. You can install it using the binary or docker.
+
+## Binary
+
+1. Download the [latest release](https://github.com/abhinavxd/libredesk/releases) and extract the libredesk binary.
+2. `./libredesk --install` to install the tables in the Postgres DB (⩾ 13) and set the System user password.
+3. Run `./libredesk` and visit `http://localhost:9000` and login with the email `System` and the password you set during installation.
+
+!!! Tip
+    To set the System user password during installation, set the environment variables:
+    `LIBREDESK_SYSTEM_USER_PASSWORD=xxxxxxxxxxx ./libredesk --install`
+
+
+## Docker
+
+The latest image is available on DockerHub at `libredesk/libredesk:latest`
+
+The recommended method is to download the [docker-compose.yml](https://github.com/abhinavxd/libredesk/blob/main/docker-compose.yml) file, customize it for your environment and then to simply run `docker compose up -d`.
+
+```shell
+# Download the compose file and the sample config file in the current directory.
+curl -LO https://github.com/abhinavxd/libredesk/raw/main/docker-compose.yml
+curl -LO https://github.com/abhinavxd/libredesk/raw/main/config.sample.toml
+
+# Copy the config.sample.toml to config.toml and edit it as needed.
+cp config.sample.toml config.toml
+
+# Run the services in the background.
+docker compose up -d
+
+# Setting System user password.
+docker exec -it libredesk_app ./libredesk --set-system-user-password
+```
+
+Go to `http://localhost:9000` and login with the email `System` and the password you set using the `--set-system-user-password` command.
+
+
+## Compiling from source
+
+To compile the latest unreleased version (`main` branch):
+
+1. Make sure `go`, `nodejs`, and `pnpm` are installed on your system.
+2. `git clone git@github.com:abhinavxd/libredesk.git`
+3. `cd libredesk && make`. This will generate the `libredesk` binary.
+
+
+## Nginx
+
+Libredesk uses websockets for real-time updates. If you are using Nginx, you need to add the following (or similar) configuration to your Nginx configuration file.
+
+```nginx
+client_max_body_size 100M;
+location / {
+    proxy_pass http://localhost:9000;
+    proxy_http_version 1.1;
+    proxy_set_header Upgrade $http_upgrade;
+    proxy_set_header Connection 'upgrade';
+    proxy_set_header Host $host;
+    proxy_set_header X-Real-IP $remote_addr;
+    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
+    proxy_cache_bypass $http_upgrade;
+}
+```

docs/docs/sso.md

@@ -0,0 +1,57 @@
+# Setting up SSO
+
+Libredesk supports external OpenID Connect providers (e.g., Google, Keycloak) for signing in users.
+
+!!! note
+    User accounts must be created in Libredesk manually; signup is not supported.
+
+## Generic Configuration Steps
+
+Since each provider’s configuration might differ, consult your provider’s documentation for any additional or divergent settings.
+
+1. Provider setup:  
+   In your provider’s admin console, create a new OpenID Connect application/client. Retrieve:
+      - Client ID
+      - Client Secret
+
+2. Libredesk configuration: 
+   In Libredesk, navigate to Security > SSO and click New SSO and enter the following details:
+      - Provider URL (e.g., the URL of your OpenID provider)
+      - Client ID
+      - Client Secret
+      - A descriptive name for the connection
+
+3. Redirect URL:  
+   After saving, copy the generated Callback URL from Libredesk and add it as a valid redirect URI in your provider’s client settings.
+   
+## Provider Examples
+
+#### Keycloak
+
+1. Log in to your Keycloak Admin Console.
+
+2. In Keycloak, navigate to Clients and click Create:
+
+      - Client ID (e.g., `libredesk-app`)
+      - Client Protocol: `openid-connect`
+      - Root URL and Web Origins: your app domain (e.g., `https://ticket.example.com`)
+      - Under Authentication flow, uncheck everything except the standard flow
+      - Click save
+
+3. Go to the credentials tab:
+      - Ensure client authenticator is set to `Client Id and Secret`
+      - Note down the generated client secret
+
+4. In Libredesk, go to Admin > Security > SSO and click New SSO:
+      - Provider URL (e.g., `https://keycloak.example.com/realms/yourrealm`)
+      - Name (e.g., `Keycloak`)
+      - Client ID
+      - Client secret
+      - Click save
+
+5. After saving, click on the three dots and choose Edit to open the new SSO entry.
+
+6. Copy the generated Callback URL from Libredesk.
+
+7. Back in Keycloak, edit the client and add the Callback URL to Valid Redirect URIs:
+      - e.g., `https://ticket.example.com/api/v1/oidc/1/finish`

docs/docs/templating.md

@@ -0,0 +1,60 @@
+# Templating
+
+Templating in outgoing emails allows you to personalize content by embedding dynamic expressions like `{{ .Recipient.FullName }}`. These expressions reference fields from the conversation, contact, recipient, and author objects.
+
+## Outgoing Email Template Expressions
+
+If you want to customize the look of outgoing emails, you can do so in the Admin > Templates -> Outgoing Email Templates section. This template will be used for all outgoing emails including replies to conversations, notifications, and other system-generated emails.
+
+### Conversation Variables
+
+| Variable | Value |
+|---------------------------------|--------------------------------------------------------|
+| {{ .Conversation.ReferenceNumber }} | The unique reference number of the conversation |
+| {{ .Conversation.Subject }} | The subject of the conversation |
+| {{ .Conversation.Priority }} | The priority level of the conversation |
+| {{ .Conversation.UUID }} | The unique identifier of the conversation |
+
+### Contact Variables
+
+| Variable | Value |
+|------------------------------|------------------------------------|
+| {{ .Contact.FirstName }} | First name of the contact/customer |
+| {{ .Contact.LastName }} | Last name of the contact/customer |
+| {{ .Contact.FullName }} | Full name of the contact/customer |
+| {{ .Contact.Email }} | Email address of the contact/customer |
+
+### Recipient Variables
+
+| Variable | Value |
+|--------------------------------|-----------------------------------|
+| {{ .Recipient.FirstName }} | First name of the recipient |
+| {{ .Recipient.LastName }} | Last name of the recipient |
+| {{ .Recipient.FullName }} | Full name of the recipient |
+| {{ .Recipient.Email }} | Email address of the recipient |
+
+### Author Variables
+
+| Variable | Value |
+|------------------------------|-----------------------------------|
+| {{ .Author.FirstName }} | First name of the message author |
+| {{ .Author.LastName }} | Last name of the message author |
+| {{ .Author.FullName }} | Full name of the message author |
+| {{ .Author.Email }} | Email address of the message author |
+
+### Example outgoing email template
+
+```html
+Dear {{ .Recipient.FirstName }},
+
+{{ template "content" . }}
+
+Best regards,
+{{ .Author.FullName }}
+---
+Reference: {{ .Conversation.ReferenceNumber }}
+```
+
+Here, the `{{ template "content" . }}` serves as a placeholder for the body of the outgoing email. It will be replaced with the actual email content at the time of sending.
+
+Similarly, the `{{ .Recipient.FirstName }}` expression will dynamically insert the recipient's first name when the email is sent.

docs/docs/translations.md

@@ -0,0 +1,3 @@
+# Translations / Internationalization
+
+You can help translate libreDesk into different languages by contributing here: [Libredesk Translation Project](https://crowdin.com/project/libredesk)

docs/docs/upgrade.md

@@ -0,0 +1,18 @@
+# Upgrade
+
+!!! warning "Warning"
+    Always take a backup of the Postgres database before upgrading Libredesk.
+
+## Binary
+- Stop running libredesk binary.
+- Download the [latest release](https://github.com/abhinavxd/libredesk/releases) and extract the libredesk binary and overwrite the previous version.
+- `./libredesk --upgrade` to upgrade an existing database schema. Upgrades are idempotent and running them multiple times have no side effects.
+- Run `./libredesk` again.
+
+## Docker
+
+```shell
+docker compose down app
+docker compose pull
+docker compose up app -d
+```

docs/docs/webhooks.md

@@ -0,0 +1,222 @@
+# Webhooks
+
+Webhooks allow you to receive real-time HTTP notifications when specific events occur in your Libredesk instance. This enables you to integrate Libredesk with external systems and automate workflows based on conversation and message events.
+
+## Overview
+
+When a configured event occurs in Libredesk, a HTTP POST request is sent to the webhook URL you specify. The request contains a JSON payload with event details and relevant data.
+
+## Webhook Configuration
+
+1. Navigate to **Admin > Integrations > Webhooks** in your Libredesk dashboard
+2. Click **Create Webhook**
+3. Configure the following:
+   - **Name**: A descriptive name for your webhook
+   - **URL**: The endpoint URL where webhook payloads will be sent
+   - **Events**: Select which events you want to subscribe to
+   - **Secret**: Optional secret key for signature verification
+   - **Status**: Enable or disable the webhook
+
+## Security
+
+### Signature Verification
+
+If you provide a secret key, webhook payloads will be signed using HMAC-SHA256. The signature is included in the `X-Signature-256` header in the format `sha256=<signature>`.
+
+To verify the signature:
+
+```python
+import hmac
+import hashlib
+
+def verify_signature(payload, signature, secret):
+    expected_signature = hmac.new(
+        secret.encode('utf-8'),
+        payload,
+        hashlib.sha256
+    ).hexdigest()
+    return hmac.compare_digest(f"sha256={expected_signature}", signature)
+```
+
+### Headers
+
+Each webhook request includes the following headers:
+
+- `Content-Type`: `application/json`
+- `User-Agent`: `Libredesk-Webhook/<libredesk_version_here>`
+- `X-Signature-256`: HMAC signature (if secret is configured)
+
+## Available Events
+
+### Conversation Events
+
+#### `conversation.created`
+Triggered when a new conversation is created.
+
+**Sample Payload:**
+```json
+{
+  "event": "conversation.created",
+  "timestamp": "2025-06-15T10:30:00Z",
+  "payload": {
+    "id": 123,
+    "created_at": "2025-06-15T10:30:00Z",
+    "updated_at": "2025-06-15T10:30:00Z",
+    "uuid": "550e8400-e29b-41d4-a716-446655440000",
+    "contact_id": 456,
+    "inbox_id": 1,
+    "reference_number": "100",
+    "priority": "Medium",
+    "priority_id": 2,
+    "status": "Open",
+    "status_id": 1,
+    "subject": "Help with account setup",
+    "inbox_name": "Support",
+    "inbox_channel": "email",
+    "contact": {
+      "id": 456,
+      "first_name": "John",
+      "last_name": "Doe",
+      "email": "john.doe@example.com",
+      "type": "contact"
+    },
+    "custom_attributes": {},
+    "tags": []
+  }
+}
+```
+
+#### `conversation.status_changed`
+Triggered when a conversation's status is updated.
+
+**Sample Payload:**
+```json
+{
+  "event": "conversation.status_changed",
+  "timestamp": "2025-06-15T10:35:00Z",
+  "payload": {
+    "conversation_uuid": "550e8400-e29b-41d4-a716-446655440000",
+    "previous_status": "Open",
+    "new_status": "Resolved",
+    "snooze_until": "",
+    "actor_id": 789
+  }
+}
+```
+
+#### `conversation.assigned`
+Triggered when a conversation is assigned to a user.
+
+**Sample Payload:**
+```json
+{
+  "event": "conversation.assigned",
+  "timestamp": "2025-06-15T10:32:00Z",
+  "payload": {
+    "conversation_uuid": "550e8400-e29b-41d4-a716-446655440000",
+    "assigned_to": 789,
+    "actor_id": 789
+  }
+}
+```
+
+#### `conversation.unassigned`
+Triggered when a conversation is unassigned from a user.
+
+**Sample Payload:**
+```json
+{
+  "event": "conversation.unassigned",
+  "timestamp": "2025-06-15T10:40:00Z",
+  "payload": {
+    "conversation_uuid": "550e8400-e29b-41d4-a716-446655440000",
+    "actor_id": 789
+  }
+}
+```
+
+#### `conversation.tags_changed`
+Triggered when tags are added or removed from a conversation.
+
+**Sample Payload:**
+```json
+{
+  "event": "conversation.tags_changed",
+  "timestamp": "2025-06-15T10:45:00Z",
+  "payload": {
+    "conversation_uuid": "550e8400-e29b-41d4-a716-446655440000",
+    "previous_tags": ["bug", "priority"],
+    "new_tags": ["bug", "priority", "resolved"],
+    "actor_id": 789
+  }
+}
+```
+
+### Message Events
+
+#### `message.created`
+Triggered when a new message is created in a conversation.
+
+**Sample Payload:**
+```json
+{
+  "event": "message.created",
+  "timestamp": "2025-06-15T10:33:00Z",
+  "payload": {
+    "id": 987,
+    "created_at": "2025-06-15T10:33:00Z",
+    "updated_at": "2025-06-15T10:33:00Z",
+    "uuid": "123e4567-e89b-12d3-a456-426614174000",
+    "type": "outgoing",
+    "status": "sent",
+    "conversation_id": 123,
+    "content": "<p>Hello! How can I help you today?</p>",
+    "text_content": "Hello! How can I help you today?",
+    "content_type": "html",
+    "private": false,
+    "sender_id": 789,
+    "sender_type": "agent",
+    "attachments": []
+  }
+}
+```
+
+#### `message.updated`
+Triggered when an existing message is updated.
+
+**Sample Payload:**
+```json
+{
+  "event": "message.updated",
+  "timestamp": "2025-06-15T10:34:00Z",
+  "payload": {
+    "id": 987,
+    "created_at": "2025-06-15T10:33:00Z",
+    "updated_at": "2025-06-15T10:34:00Z",
+    "uuid": "123e4567-e89b-12d3-a456-426614174000",
+    "type": "outgoing",
+    "status": "sent",
+    "conversation_id": 123,
+    "content": "<p>Hello! How can I help you today? (Updated)</p>",
+    "text_content": "Hello! How can I help you today? (Updated)",
+    "content_type": "html",
+    "private": false,
+    "sender_id": 789,
+    "sender_type": "agent",
+    "attachments": []
+  }
+}
+```
+
+## Delivery and Retries
+
+- Webhooks requests timeout can be configured in the `config.toml` file
+- Failed deliveries are not automatically retried
+- Webhook delivery runs in a background worker pool for better performance
+- If the webhook queue is full (configurable in config.toml file), new events may be dropped
+
+## Testing Webhooks
+
+You can test your webhook configuration using tools like:
+
+- [Webhook.site](https://webhook.site) - Generate a temporary URL to inspect webhook payloads

docs/mkdocs.yml

@@ -0,0 +1,38 @@
+site_name: Libredesk Docs
+theme:
+  name: material
+  language: en
+  font:
+    text: Source Sans Pro
+    code: Roboto Mono
+    weights: [400, 700]
+  direction: ltr
+  palette:
+    primary: white
+    accent: red
+  features:
+    - navigation.indexes
+    - navigation.sections
+    - content.code.copy
+extra:
+  search:
+    language: en
+
+markdown_extensions:
+  - admonition
+  - codehilite
+  - toc:
+      permalink: true
+
+nav:
+  - Introduction: index.md
+  - Getting Started:
+      - Installation: installation.md
+      - Upgrade Guide: upgrade.md
+      - Email Templates: templating.md
+      - SSO Setup: sso.md
+      - Webhooks: webhooks.md
+      - API Getting Started: api-getting-started.md
+  - Contributions:
+      - Developer Setup: developer-setup.md
+      - Translate Libredesk: translations.md

frontend/README-SETUP.md

@@ -0,0 +1,59 @@
+# Libredesk Frontend - Multi-App Setup
+
+This frontend supports both the main Libredesk application and a chat widget as separate Vue applications sharing common UI components.
+
+## Project Structure
+
+```
+frontend/
+├── apps/
+│   ├── main/          # Main Libredesk application
+│   │   ├── src/
+│   │   └── index.html
+│   └── widget/        # Chat widget application
+│       ├── src/
+│       └── index.html
+├── shared-ui/         # Shared UI components (shadcn/ui)
+│   ├── components/
+│   │   └── ui/        # shadcn/ui components
+│   ├── lib/           # Utility functions
+│   └── assets/        # Shared styles
+└── package.json
+```
+
+## Development
+
+Check Makefile for available commands.
+
+## Shared UI Components
+
+The `shared-ui` directory contains all the shadcn/ui components that can be used in both apps.
+
+### Using Shared Components
+
+```vue
+<script setup>
+import { Button } from '@shared-ui/components/ui/button'
+import { Card, CardContent, CardHeader, CardTitle } from '@shared-ui/components/ui/card'
+import { Input } from '@shared-ui/components/ui/input'
+</script>
+
+<template>
+  <Card>
+    <CardHeader>
+      <CardTitle>Example Card</CardTitle>
+    </CardHeader>
+    <CardContent>
+      <Input placeholder="Type something..." />
+      <Button>Submit</Button>
+    </CardContent>
+  </Card>
+</template>
+```
+
+### Path Aliases
+
+- `@shared-ui` - Points to the shared-ui directory
+- `@main` - Points to apps/main/src
+- `@widget` - Points to apps/widget/src
+- `@` - Points to the current app's src directory (context-dependent)

frontend/apps/main/src/App.vue

@@ -88,8 +88,8 @@
         @create-conversation="() => (openCreateConversationDialog = true)"
       >
         <div class="flex flex-col h-screen">
-          <!-- Show admin banner only in admin routes -->
-          <AdminBanner v-if="route.path.startsWith('/admin')" />
+          <!-- Show app update only in admin routes -->
+          <AppUpdate v-if="route.path.startsWith('/admin')" />
 
           <!-- Common header for all pages -->
           <PageHeader />
@@ -112,26 +112,26 @@
 <script setup>
 import { onMounted, ref } from 'vue'
 import { RouterView } from 'vue-router'
-import { useUserStore } from '@/stores/user'
-import { initWS } from '@/websocket.js'
-import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
-import { useEmitter } from '@/composables/useEmitter'
-import { handleHTTPError } from '@/utils/http'
+import { useUserStore } from './stores/user'
+import { initWS } from './websocket.js'
+import { EMITTER_EVENTS } from './constants/emitterEvents.js'
+import { useEmitter } from './composables/useEmitter'
+import { handleHTTPError } from './utils/http'
 import { useConversationStore } from './stores/conversation'
-import { useInboxStore } from '@/stores/inbox'
-import { useUsersStore } from '@/stores/users'
-import { useTeamStore } from '@/stores/team'
-import { useSlaStore } from '@/stores/sla'
-import { useMacroStore } from '@/stores/macro'
-import { useTagStore } from '@/stores/tag'
-import { useCustomAttributeStore } from '@/stores/customAttributes'
-import { useIdleDetection } from '@/composables/useIdleDetection'
+import { useInboxStore } from './stores/inbox'
+import { useUsersStore } from './stores/users'
+import { useTeamStore } from './stores/team'
+import { useSlaStore } from './stores/sla'
+import { useMacroStore } from './stores/macro'
+import { useTagStore } from './stores/tag'
+import { useCustomAttributeStore } from './stores/customAttributes'
+import { useIdleDetection } from './composables/useIdleDetection'
 import PageHeader from './components/layout/PageHeader.vue'
 import ViewForm from '@/features/view/ViewForm.vue'
-import AdminBanner from '@/components/banner/AdminBanner.vue'
-import api from '@/api'
+import AppUpdate from '@main/components/update/AppUpdate.vue'
+import api from './api'
 import { toast as sooner } from 'vue-sonner'
-import Sidebar from '@/components/sidebar/Sidebar.vue'
+import Sidebar from '@main/components/sidebar/Sidebar.vue'
 import Command from '@/features/command/CommandBox.vue'
 import CreateConversation from '@/features/conversation/CreateConversation.vue'
 import { Inbox, Shield, FileLineChart, BookUser } from 'lucide-vue-next'
@@ -147,9 +147,9 @@ import {
   SidebarMenuButton,
   SidebarMenuItem,
   SidebarProvider
-} from '@/components/ui/sidebar'
-import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
-import SidebarNavUser from '@/components/sidebar/SidebarNavUser.vue'
+} from '@shared-ui/components/ui/sidebar'
+import { Tooltip, TooltipContent, TooltipTrigger } from '@shared-ui/components/ui/tooltip'
+import SidebarNavUser from '@main/components/sidebar/SidebarNavUser.vue'
 
 const route = useRoute()
 const emitter = useEmitter()

frontend/apps/main/src/OuterApp.vue

@@ -5,8 +5,8 @@
 <script setup>
 import { onMounted } from 'vue'
 import { RouterView } from 'vue-router'
-import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
-import { useEmitter } from '@/composables/useEmitter'
+import { EMITTER_EVENTS } from './constants/emitterEvents.js'
+import { useEmitter } from './composables/useEmitter'
 import { toast as sooner } from 'vue-sonner'
 
 const emitter = useEmitter()

frontend/apps/main/src/Root.vue

@@ -7,6 +7,6 @@
 
 <script setup>
 import { RouterView } from 'vue-router'
-import { Toaster } from '@/components/ui/sonner'
-import { TooltipProvider } from '@/components/ui/tooltip'
+import { Toaster } from '@shared-ui/components/ui/sonner'
+import { TooltipProvider } from '@shared-ui/components/ui/tooltip'
 </script>

frontend/apps/main/src/api/index.js

@@ -47,7 +47,6 @@ const createCustomAttribute = (data) =>
       'Content-Type': 'application/json'
     }
   })
-const getCustomAttribute = (id) => http.get(`/api/v1/custom-attributes/${id}`)
 const updateCustomAttribute = (id, data) =>
   http.put(`/api/v1/custom-attributes/${id}`, data, {
     headers: {
@@ -122,7 +121,7 @@ const createOIDC = (data) =>
       'Content-Type': 'application/json'
     }
   })
-const getConfig = () => http.get('/api/v1/config')
+const getAllEnabledOIDC = () => http.get('/api/v1/oidc/enabled')
 const getAllOIDC = () => http.get('/api/v1/oidc')
 const getOIDC = (id) => http.get(`/api/v1/oidc/${id}`)
 const updateOIDC = (id, data) =>
@@ -431,6 +430,96 @@ const generateAPIKey = (id) =>
 
 const revokeAPIKey = (id) => http.delete(`/api/v1/agents/${id}/api-key`)
 
+// Help center.
+const getHelpCenters = () => http.get('/api/v1/help-centers')
+const getHelpCenter = (id) => http.get(`/api/v1/help-centers/${id}`)
+const createHelpCenter = (data) => http.post('/api/v1/help-centers', data, {
+  headers: {
+    'Content-Type': 'application/json'
+  }
+})
+const updateHelpCenter = (id, data) => http.put(`/api/v1/help-centers/${id}`, data, {
+  headers: {
+    'Content-Type': 'application/json'
+  }
+})
+const deleteHelpCenter = (id) => http.delete(`/api/v1/help-centers/${id}`)
+const getHelpCenterTree = (id, params) => http.get(`/api/v1/help-centers/${id}/tree`, { params })
+
+const getCollections = (helpCenterId, params) => http.get(`/api/v1/help-centers/${helpCenterId}/collections`, { params })
+const getCollection = (id) => http.get(`/api/v1/help-centers/*/collections/${id}`)
+const createCollection = (helpCenterId, data) => http.post(`/api/v1/help-centers/${helpCenterId}/collections`, data, {
+  headers: {
+    'Content-Type': 'application/json'
+  }
+})
+const updateCollection = (helpCenterId, id, data) => http.put(`/api/v1/help-centers/${helpCenterId}/collections/${id}`, data, {
+  headers: {
+    'Content-Type': 'application/json'
+  }
+})
+const deleteCollection = (helpCenterId, id) => http.delete(`/api/v1/help-centers/${helpCenterId}/collections/${id}`)
+const toggleCollection = (id) => http.put(`/api/v1/collections/${id}/toggle`)
+
+const getArticles = (collectionId, params) => http.get(`/api/v1/collections/${collectionId}/articles`, { params })
+const getArticle = (id) => http.get(`/api/v1/collections/*/articles/${id}`)
+const createArticle = (collectionId, data) => http.post(`/api/v1/collections/${collectionId}/articles`, data, {
+  headers: {
+    'Content-Type': 'application/json'
+  }
+})
+const updateArticle = (collectionId, id, data) => http.put(`/api/v1/collections/${collectionId}/articles/${id}`, data, {
+  headers: {
+    'Content-Type': 'application/json'
+  }
+})
+const updateArticleByID = (id, data) => http.put(`/api/v1/articles/${id}`, data, {
+  headers: {
+    'Content-Type': 'application/json'
+  }
+})
+const deleteArticle = (collectionId, id) => http.delete(`/api/v1/collections/${collectionId}/articles/${id}`)
+const updateArticleStatus = (id, data) => http.put(`/api/v1/articles/${id}/status`, data, {
+  headers: {
+    'Content-Type': 'application/json'
+  }
+})
+
+// AI Assistants
+const getAIAssistants = () => http.get('/api/v1/ai-assistants')
+const getAIAssistant = (id) => http.get(`/api/v1/ai-assistants/${id}`)
+const createAIAssistant = (data) =>
+  http.post('/api/v1/ai-assistants', data, {
+    headers: {
+      'Content-Type': 'application/json'
+    }
+  })
+const updateAIAssistant = (id, data) =>
+  http.put(`/api/v1/ai-assistants/${id}`, data, {
+    headers: {
+      'Content-Type': 'application/json'
+    }
+  })
+const deleteAIAssistant = (id) => http.delete(`/api/v1/ai-assistants/${id}`)
+
+// AI Snippets
+const getAISnippets = () => http.get('/api/v1/ai-snippets')
+const getAISnippet = (id) => http.get(`/api/v1/ai-snippets/${id}`)
+const createAISnippet = (data) =>
+  http.post('/api/v1/ai-snippets', data, {
+    headers: {
+      'Content-Type': 'application/json'
+    }
+  })
+const updateAISnippet = (id, data) =>
+  http.put(`/api/v1/ai-snippets/${id}`, data, {
+    headers: {
+      'Content-Type': 'application/json'
+    }
+  })
+const deleteAISnippet = (id) => http.delete(`/api/v1/ai-snippets/${id}`)
+
+
 export default {
   login,
   deleteUser,
@@ -504,6 +593,18 @@ export default {
   sendMessage,
   retryMessage,
   createUser,
+  // AI Assistants
+  getAIAssistants,
+  getAIAssistant,
+  createAIAssistant,
+  updateAIAssistant,
+  deleteAIAssistant,
+  // AI Snippets
+  getAISnippets,
+  getAISnippet,
+  createAISnippet,
+  updateAISnippet,
+  deleteAISnippet,
   createInbox,
   updateInbox,
   deleteInbox,
@@ -514,7 +615,7 @@ export default {
   updateSettings,
   createOIDC,
   getAllOIDC,
-  getConfig,
+  getAllEnabledOIDC,
   getOIDC,
   updateOIDC,
   deleteOIDC,
@@ -554,7 +655,6 @@ export default {
   createCustomAttribute,
   updateCustomAttribute,
   deleteCustomAttribute,
-  getCustomAttribute,
   getContactNotes,
   createContactNote,
   deleteContactNote,
@@ -567,5 +667,25 @@ export default {
   toggleWebhook,
   testWebhook,
   generateAPIKey,
-  revokeAPIKey
+  revokeAPIKey,
+  // Help Center
+  getHelpCenters,
+  getHelpCenter,
+  createHelpCenter,
+  updateHelpCenter,
+  deleteHelpCenter,
+  getHelpCenterTree,
+  getCollections,
+  getCollection,
+  createCollection,
+  updateCollection,
+  deleteCollection,
+  toggleCollection,
+  getArticles,
+  getArticle,
+  createArticle,
+  updateArticle,
+  updateArticleByID,
+  deleteArticle,
+  updateArticleStatus,
 }

frontend/apps/main/src/components/button/CloseButton.vue

@@ -1,7 +1,7 @@
 <template>
   <Button
     variant="ghost"
-    @click.stop="onClose"
+    @click.prevent="onClose"
     size="xs"
     class="text-gray-400 dark:text-gray-500 hover:text-gray-600 hover:bg-gray-100 dark:hover:bg-gray-800 w-6 h-6 p-0"
   >
@@ -12,7 +12,7 @@
 </template>
 
 <script setup>
-import { Button } from '@/components/ui/button'
+import { Button } from '@shared-ui/components/ui/button'
 import { X } from 'lucide-vue-next'
 
 defineProps({

frontend/apps/main/src/components/combobox/SelectCombobox.vue

@@ -42,8 +42,8 @@
 
 <script setup>
 import { computed } from 'vue'
-import { Avatar, AvatarImage, AvatarFallback } from '@/components/ui/avatar'
-import ComboBox from '@/components/ui/combobox/ComboBox.vue'
+import { Avatar, AvatarImage, AvatarFallback } from '@shared-ui/components/ui/avatar'
+import ComboBox from '@shared-ui/components/ui/combobox/ComboBox.vue'
 
 const props = defineProps({
   modelValue: [String, Number, Object],

frontend/apps/main/src/components/datatable/DataTable.vue

@@ -51,7 +51,7 @@ import {
   TableHead,
   TableHeader,
   TableRow
-} from '@/components/ui/table'
+} from '@shared-ui/components/ui/table'
 
 const { t } = useI18n()
 const props = defineProps({

frontend/apps/main/src/components/editor/TextEditor.vue

@@ -4,12 +4,12 @@
       :editor="editor"
       :tippy-options="{ duration: 100 }"
       v-if="editor"
-      class="bg-background p-1 box will-change-transform"
+      class="bg-background p-2 box will-change-transform max-w-fit"
     >
-      <div class="flex space-x-1 items-center">
+      <div class="flex gap-1 items-center justify-start whitespace-nowrap">
         <DropdownMenu v-if="aiPrompts.length > 0">
           <DropdownMenuTrigger>
-            <Button size="sm" variant="ghost" class="flex items-center justify-center">
+            <Button size="sm" variant="ghost" class="flex items-center justify-center" title="AI Prompts">
               <span class="flex items-center">
                 <span class="text-medium">AI</span>
                 <Bot size="14" class="ml-1" />
@@ -27,11 +27,43 @@
             </DropdownMenuItem>
           </DropdownMenuContent>
         </DropdownMenu>
+
+        <!-- Heading Dropdown for Article Mode -->
+        <DropdownMenu v-if="editorType === 'article'">
+          <DropdownMenuTrigger>
+            <Button size="sm" variant="ghost" class="flex items-center justify-center" title="Heading Options">
+              <span class="flex items-center">
+                <Type size="14" />
+                <span class="ml-1 text-xs font-medium">{{ getCurrentHeadingText() }}</span>
+                <ChevronDown class="w-3 h-3 ml-1" />
+              </span>
+            </Button>
+          </DropdownMenuTrigger>
+          <DropdownMenuContent>
+            <DropdownMenuItem @select="setParagraph" title="Set Paragraph">
+              <span class="font-normal">Paragraph</span>
+            </DropdownMenuItem>
+            <DropdownMenuItem @select="() => setHeading(1)" title="Set Heading 1">
+              <span class="text-xl font-bold">Heading 1</span>
+            </DropdownMenuItem>
+            <DropdownMenuItem @select="() => setHeading(2)" title="Set Heading 2">
+              <span class="text-lg font-bold">Heading 2</span>
+            </DropdownMenuItem>
+            <DropdownMenuItem @select="() => setHeading(3)" title="Set Heading 3">
+              <span class="text-base font-semibold">Heading 3</span>
+            </DropdownMenuItem>
+            <DropdownMenuItem @select="() => setHeading(4)" title="Set Heading 4">
+              <span class="text-sm font-semibold">Heading 4</span>
+            </DropdownMenuItem>
+          </DropdownMenuContent>
+        </DropdownMenu>
+
         <Button
           size="sm"
           variant="ghost"
           @click.prevent="editor?.chain().focus().toggleBold().run()"
           :class="{ 'bg-gray-200 dark:bg-secondary': editor?.isActive('bold') }"
+          title="Bold"
         >
           <Bold size="14" />
         </Button>
@@ -40,6 +72,7 @@
           variant="ghost"
           @click.prevent="editor?.chain().focus().toggleItalic().run()"
           :class="{ 'bg-gray-200 dark:bg-secondary': editor?.isActive('italic') }"
+          title="Italic"
         >
           <Italic size="14" />
         </Button>
@@ -48,6 +81,7 @@
           variant="ghost"
           @click.prevent="editor?.chain().focus().toggleBulletList().run()"
           :class="{ 'bg-gray-200 dark:bg-secondary': editor?.isActive('bulletList') }"
+          title="Bullet List"
         >
           <List size="14" />
         </Button>
@@ -57,6 +91,7 @@
           variant="ghost"
           @click.prevent="editor?.chain().focus().toggleOrderedList().run()"
           :class="{ 'bg-gray-200 dark:bg-secondary': editor?.isActive('orderedList') }"
+          title="Ordered List"
         >
           <ListOrdered size="14" />
         </Button>
@@ -65,9 +100,32 @@
           variant="ghost"
           @click.prevent="openLinkModal"
           :class="{ 'bg-gray-200 dark:bg-secondary': editor?.isActive('link') }"
+          title="Insert Link"
         >
           <LinkIcon size="14" />
         </Button>
+
+        <!-- Additional tools for Article Mode -->
+        <template v-if="editorType === 'article'">
+          <Button
+            size="sm"
+            variant="ghost"
+            @click.prevent="editor?.chain().focus().toggleCodeBlock().run()"
+            :class="{ 'bg-gray-200 dark:bg-secondary': editor?.isActive('codeBlock') }"
+            title="Code Block"
+          >
+            <Code size="14" />
+          </Button>
+          <Button
+            size="sm"
+            variant="ghost"
+            @click.prevent="editor?.chain().focus().toggleBlockquote().run()"
+            :class="{ 'bg-gray-200 dark:bg-secondary': editor?.isActive('blockquote') }"
+            title="Blockquote"
+          >
+            <Quote size="14" />
+          </Button>
+        </template>
         <div v-if="showLinkInput" class="flex space-x-2 p-2 bg-background border rounded">
           <Input
             v-model="linkUrl"
@@ -75,10 +133,10 @@
             placeholder="Enter link URL"
             class="border p-1 text-sm w-[200px]"
           />
-          <Button size="sm" @click="setLink">
+          <Button size="sm" @click="setLink" title="Set Link">
             <Check size="14" />
           </Button>
-          <Button size="sm" @click="unsetLink">
+          <Button size="sm" @click="unsetLink" title="Unset Link">
             <X size="14" />
           </Button>
         </div>
@@ -100,16 +158,19 @@ import {
   ListOrdered,
   Link as LinkIcon,
   Check,
-  X
+  X,
+  Type,
+  Code,
+  Quote
 } from 'lucide-vue-next'
-import { Button } from '@/components/ui/button'
+import { Button } from '@shared-ui/components/ui/button'
 import {
   DropdownMenu,
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuTrigger
-} from '@/components/ui/dropdown-menu'
-import { Input } from '@/components/ui/input'
+} from '@shared-ui/components/ui/dropdown-menu'
+import { Input } from '@shared-ui/components/ui/input'
 import Placeholder from '@tiptap/extension-placeholder'
 import Image from '@tiptap/extension-image'
 import StarterKit from '@tiptap/starter-kit'
@@ -118,6 +179,8 @@ import Table from '@tiptap/extension-table'
 import TableRow from '@tiptap/extension-table-row'
 import TableCell from '@tiptap/extension-table-cell'
 import TableHeader from '@tiptap/extension-table-header'
+import { useTypingIndicator } from '@shared-ui/composables'
+import { useConversationStore } from '@main/stores/conversation'
 
 const textContent = defineModel('textContent', { default: '' })
 const htmlContent = defineModel('htmlContent', { default: '' })
@@ -134,6 +197,11 @@ const props = defineProps({
   aiPrompts: {
     type: Array,
     default: () => []
+  },
+  editorType: {
+    type: String,
+    default: 'conversation',
+    validator: (value) => ['conversation', 'article'].includes(value)
   }
 })
 
@@ -141,6 +209,10 @@ const emit = defineEmits(['send', 'aiPromptSelected'])
 
 const emitPrompt = (key) => emit('aiPromptSelected', key)
 
+// Set up typing indicator
+const conversationStore = useConversationStore()
+const { startTyping, stopTyping } = useTypingIndicator(conversationStore.sendTyping)
+
 // To preseve the table styling in emails, need to set the table style inline.
 // Created these custom extensions to set the table style inline.
 const CustomTable = Table.extend({
@@ -183,17 +255,39 @@ const CustomTableHeader = TableHeader.extend({
 
 const isInternalUpdate = ref(false)
 
-const editor = useEditor({
-  extensions: [
-    StarterKit.configure(),
+// Configure extensions based on editor type
+const getExtensions = () => {
+  const baseExtensions = [
+    StarterKit.configure({
+      heading: props.editorType === 'article' ? { levels: [1, 2, 3, 4] } : false
+    }),
     Image.configure({ HTMLAttributes: { class: 'inline-image' } }),
     Placeholder.configure({ placeholder: () => props.placeholder }),
-    Link,
-    CustomTable.configure({ resizable: false }),
-    TableRow,
-    CustomTableCell,
-    CustomTableHeader
-  ],
+    Link
+  ]
+
+  // Add table extensions
+  if (props.editorType === 'article') {
+    baseExtensions.push(
+      CustomTable.configure({ resizable: true }),
+      TableRow,
+      CustomTableCell,
+      CustomTableHeader
+    )
+  } else {
+    baseExtensions.push(
+      CustomTable.configure({ resizable: false }),
+      TableRow,
+      CustomTableCell,
+      CustomTableHeader
+    )
+  }
+
+  return baseExtensions
+}
+
+const editor = useEditor({
+  extensions: getExtensions(),
   autofocus: props.autoFocus,
   content: htmlContent.value,
   editorProps: {
@@ -201,6 +295,8 @@ const editor = useEditor({
     handleKeyDown: (view, event) => {
       if (event.ctrlKey && event.key === 'Enter') {
         emit('send')
+        // Stop typing when sending
+        stopTyping()
         return true
       }
     }
@@ -211,6 +307,13 @@ const editor = useEditor({
     htmlContent.value = editor.getHTML()
     textContent.value = editor.getText()
     isInternalUpdate.value = false
+
+    // Trigger typing indicator when user types
+    startTyping()
+  },
+  onBlur: () => {
+    // Stop typing when editor loses focus
+    stopTyping()
   }
 })
 
@@ -258,6 +361,32 @@ const unsetLink = () => {
   editor.value?.chain().focus().unsetLink().run()
   showLinkInput.value = false
 }
+
+// Heading functions for article mode
+const setHeading = (level) => {
+  editor.value?.chain().focus().toggleHeading({ level }).run()
+}
+
+const setParagraph = () => {
+  editor.value?.chain().focus().setParagraph().run()
+}
+
+const getCurrentHeadingLevel = () => {
+  if (!editor.value) return null
+  for (let level = 1; level <= 4; level++) {
+    if (editor.value.isActive('heading', { level })) {
+      return level
+    }
+  }
+  return null
+}
+
+const getCurrentHeadingText = () => {
+  const level = getCurrentHeadingLevel()
+  if (level) return `H${level}`
+  if (editor.value?.isActive('paragraph')) return 'P'
+  return 'T'
+}
 </script>
 
 <style lang="scss">

frontend/apps/main/src/components/filter/FilterBuilder.vue

@@ -52,15 +52,8 @@
         <div class="flex-1">
           <div v-if="modelFilter.field && modelFilter.operator">
             <template v-if="modelFilter.operator !== 'set' && modelFilter.operator !== 'not set'">
-              <SelectTag
-                v-if="getFieldType(modelFilter) === FIELD_TYPE.MULTI_SELECT"
-                v-model="modelFilter.value"
-                :items="getFieldOptions(modelFilter)"
-                :placeholder="t('globals.messages.select', { name: t('globals.terms.tag', 2) })"
-              />
-
               <SelectComboBox
-                v-else-if="
+                v-if="
                   getFieldOptions(modelFilter).length > 0 &&
                   modelFilter.field === 'assigned_user_id'
                 "
@@ -101,9 +94,8 @@
       <CloseButton :onClose="() => removeFilter(index)" />
     </div>
 
-    <!-- Button Container -->
     <div class="flex items-center justify-between pt-3">
-      <Button variant="ghost" size="sm" @click.stop="addFilter" class="text-slate-600">
+      <Button variant="ghost" size="sm" @click="addFilter" class="text-slate-600">
         <Plus class="w-3 h-3 mr-1" />
         {{
           $t('globals.messages.add', {
@@ -112,17 +104,15 @@
         }}
       </Button>
       <div class="flex gap-2" v-if="showButtons">
-        <Button variant="ghost" @click.stop="clearFilters">
-          {{ $t('globals.messages.reset') }}
-        </Button>
-        <Button @click.stop="applyFilters">{{ $t('globals.messages.apply') }}</Button>
+        <Button variant="ghost" @click="clearFilters">{{ $t('globals.messages.reset') }}</Button>
+        <Button @click="applyFilters">{{ $t('globals.messages.apply') }}</Button>
       </div>
     </div>
   </div>
 </template>
 
 <script setup>
-import { computed, onMounted, onUnmounted, watch } from 'vue'
+import { computed, onMounted, watch } from 'vue'
 import {
   Select,
   SelectContent,
@@ -130,15 +120,13 @@ import {
   SelectItem,
   SelectTrigger,
   SelectValue
-} from '@/components/ui/select'
+} from '@shared-ui/components/ui/select'
 import { Plus } from 'lucide-vue-next'
-import { Button } from '@/components/ui/button'
-import { Input } from '@/components/ui/input'
+import { Button } from '@shared-ui/components/ui/button'
+import { Input } from '@shared-ui/components/ui/input'
 import { useI18n } from 'vue-i18n'
-import { FIELD_TYPE } from '@/constants/filterConfig'
-import CloseButton from '@/components/button/CloseButton.vue'
-import SelectComboBox from '@/components/combobox/SelectCombobox.vue'
-import SelectTag from '@/components/ui/select/SelectTag.vue'
+import CloseButton from '@main/components/button/CloseButton.vue'
+import SelectComboBox from '@main/components/combobox/SelectCombobox.vue'
 
 const props = defineProps({
   fields: {
@@ -162,17 +150,12 @@ onMounted(() => {
   }
 })
 
-onUnmounted(() => {
-  // On unmounted set valid filters
-  modelValue.value = validFilters.value
-})
-
 const getModel = (field) => {
   const fieldConfig = props.fields.find((f) => f.field === field)
   return fieldConfig?.model || ''
 }
 
-// Set model for each filter and the default value
+// Set model for each filter
 watch(
   () => modelValue.value,
   (filters) => {
@@ -180,15 +163,6 @@ watch(
       if (filter.field && !filter.model) {
         filter.model = getModel(filter.field)
       }
-
-      // Multi select need arrays as their default value
-      if (
-        filter.field &&
-        getFieldType(filter) === FIELD_TYPE.MULTI_SELECT &&
-        !Array.isArray(filter.value)
-      ) {
-        filter.value = []
-      }
     })
   },
   { deep: true }
@@ -196,20 +170,15 @@ watch(
 
 // Reset operator and value when field changes for a filter at a given index
 watch(
-  modelValue,
-  (newFilters, oldFilters) => {
-    // Skip first run
-    if (!oldFilters) return
-
-    newFilters.forEach((filter, index) => {
-      const oldFilter = oldFilters[index]
-      if (oldFilter && filter.field !== oldFilter.field) {
-        filter.operator = ''
-        filter.value = ''
+  () => modelValue.value.map((f) => f.field),
+  (newFields, oldFields) => {
+    newFields.forEach((field, index) => {
+      if (field !== oldFields[index]) {
+        modelValue.value[index].operator = ''
+        modelValue.value[index].value = ''
       }
     })
-  },
-  { deep: true }
+  }
 )
 
 const addFilter = () => {
@@ -228,17 +197,7 @@ const clearFilters = () => {
 }
 
 const validFilters = computed(() => {
-  return modelValue.value.filter((filter) => {
-    // For multi-select field type, allow empty array as a valid value
-    const field = props.fields.find((f) => f.field === filter.field)
-    const isMultiSelectField = field?.type === FIELD_TYPE.MULTI_SELECT
-
-    if (isMultiSelectField) {
-      return filter.field && filter.operator && filter.value !== undefined && filter.value !== null
-    }
-
-    return filter.field && filter.operator && filter.value
-  })
+  return modelValue.value.filter((filter) => filter.field && filter.operator && filter.value)
 })
 
 const getFieldOptions = (fieldValue) => {
@@ -250,9 +209,4 @@ const getFieldOperators = (modelFilter) => {
   const field = props.fields.find((f) => f.field === modelFilter.field)
   return field?.operators || []
 }
-
-const getFieldType = (modelFilter) => {
-  const field = props.fields.find((f) => f.field === modelFilter.field)
-  return field?.type || ''
-}
 </script>

frontend/apps/main/src/components/layout/PageHeader.vue

@@ -12,8 +12,8 @@
 
 <script setup>
 import { computed } from 'vue'
-import { Separator } from '@/components/ui/separator'
-import { SidebarTrigger } from '@/components/ui/sidebar'
+import { Separator } from '@shared-ui/components/ui/separator'
+import { SidebarTrigger } from '@shared-ui/components/ui/sidebar'
 import { useRoute } from 'vue-router'
 
 const route = useRoute()

frontend/apps/main/src/components/sidebar/Sidebar.vue

@@ -4,9 +4,9 @@ import {
   reportsNavItems,
   accountNavItems,
   contactNavItems
-} from '@/constants/navigation'
+} from '../../constants/navigation'
 import { RouterLink, useRoute, useRouter } from 'vue-router'
-import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible'
+import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@shared-ui/components/ui/collapsible'
 import {
   Sidebar,
   SidebarContent,
@@ -21,8 +21,8 @@ import {
   SidebarMenuSubItem,
   SidebarProvider,
   SidebarRail
-} from '@/components/ui/sidebar'
-import { useAppSettingsStore } from '@/stores/appSettings'
+} from '@shared-ui/components/ui/sidebar'
+import { useAppSettingsStore } from '../../stores/appSettings'
 import {
   ChevronRight,
   EllipsisVertical,
@@ -37,23 +37,13 @@ import {
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuTrigger
-} from '@/components/ui/dropdown-menu'
-import {
-  AlertDialog,
-  AlertDialogAction,
-  AlertDialogCancel,
-  AlertDialogContent,
-  AlertDialogDescription,
-  AlertDialogFooter,
-  AlertDialogHeader,
-  AlertDialogTitle
-} from '@/components/ui/alert-dialog'
-import { filterNavItems } from '@/utils/nav-permissions'
+} from '@shared-ui/components/ui/dropdown-menu'
+import { filterNavItems } from '../../utils/nav-permissions'
 import { useStorage } from '@vueuse/core'
 import { computed, ref, watch } from 'vue'
 import { useI18n } from 'vue-i18n'
-import { useUserStore } from '@/stores/user'
-import { useConversationStore } from '@/stores/conversation'
+import { useUserStore } from '../../stores/user'
+import { useConversationStore } from '../../stores/conversation'
 
 defineProps({
   userTeams: { type: Array, default: () => [] },
@@ -83,17 +73,8 @@ const editView = (view) => {
   emit('editView', view)
 }
 
-const openDeleteConfirmation = (view) => {
-  viewToDelete.value = view
-  isDeleteOpen.value = true
-}
-
-const handleDeleteView = () => {
-  if (viewToDelete.value) {
-    emit('deleteView', viewToDelete.value)
-    isDeleteOpen.value = false
-    viewToDelete.value = null
-  }
+const deleteView = (view) => {
+  emit('deleteView', view)
 }
 
 // Navigation methods with conversation retention
@@ -176,13 +157,6 @@ watch(
 const sidebarOpen = useStorage('mainSidebarOpen', true)
 const teamInboxOpen = useStorage('teamInboxOpen', true)
 const viewInboxOpen = useStorage('viewInboxOpen', true)
-
-// Track which view is being hovered for ellipsis menu visibility
-const hoveredViewId = ref(null)
-
-// Track delete confirmation dialog state
-const isDeleteOpen = ref(false)
-const viewToDelete = ref(null)
 </script>
 
 <template>
@@ -315,7 +289,7 @@ const viewToDelete = ref(null)
                       <SidebarMenuSubItem v-for="child in item.children" :key="child.titleKey">
                         <SidebarMenuButton size="sm" :isActive="isActiveParent(child.href)" asChild>
                           <router-link :to="child.href">
-                            <span>{{ t(child.titleKey) }}</span>
+                            <span>{{ t(child.titleKey, child.isTitleKeyPlural === true ? 2 : 1) }}</span>
                           </router-link>
                         </SidebarMenuButton>
                       </SidebarMenuSubItem>
@@ -498,35 +472,24 @@ const viewToDelete = ref(null)
 
                   <CollapsibleContent>
                     <SidebarMenuSub v-for="view in userViews" :key="view.id">
-                      <SidebarMenuSubItem
-                        @mouseenter="hoveredViewId = view.id"
-                        @mouseleave="hoveredViewId = null"
-                      >
+                      <SidebarMenuSubItem>
                         <SidebarMenuButton
                           size="sm"
                           :isActive="route.params.viewID == view.id"
                           asChild
                         >
                           <a href="#" @click.prevent="navigateToViewInbox(view.id)">
-                            <span class="break-words w-32 truncate" :title="view.name">{{ view.name }}</span>
-                            <SidebarMenuAction
-                              @click.stop
-                              :class="[
-                                'mr-3',
-                                'md:opacity-0',
-                                'data-[state=open]:opacity-100',
-                                { 'md:opacity-100': hoveredViewId === view.id }
-                              ]"
-                            >
+                            <span class="break-words w-32 truncate">{{ view.name }}</span>
+                            <SidebarMenuAction :showOnHover="true" class="mr-3">
                               <DropdownMenu>
-                                <DropdownMenuTrigger asChild @click.prevent>
+                                <DropdownMenuTrigger asChild>
                                   <EllipsisVertical />
                                 </DropdownMenuTrigger>
                                 <DropdownMenuContent>
                                   <DropdownMenuItem @click="() => editView(view)">
                                     <span>{{ t('globals.messages.edit') }}</span>
                                   </DropdownMenuItem>
-                                  <DropdownMenuItem @click="() => openDeleteConfirmation(view)">
+                                  <DropdownMenuItem @click="() => deleteView(view)">
                                     <span>{{ t('globals.messages.delete') }}</span>
                                   </DropdownMenuItem>
                                 </DropdownMenuContent>
@@ -550,22 +513,4 @@ const viewToDelete = ref(null)
       <slot></slot>
     </SidebarInset>
   </SidebarProvider>
-
-  <!-- View Delete Confirmation Dialog -->
-  <AlertDialog v-model:open="isDeleteOpen">
-    <AlertDialogContent>
-      <AlertDialogHeader>
-        <AlertDialogTitle>{{ t('globals.messages.areYouAbsolutelySure') }}</AlertDialogTitle>
-        <AlertDialogDescription>
-          {{ t('globals.messages.deletionConfirmation', { name: t('globals.terms.view') }) }}
-        </AlertDialogDescription>
-      </AlertDialogHeader>
-      <AlertDialogFooter>
-        <AlertDialogCancel>{{ t('globals.messages.cancel') }}</AlertDialogCancel>
-        <AlertDialogAction @click="handleDeleteView">
-          {{ t('globals.messages.delete') }}
-        </AlertDialogAction>
-      </AlertDialogFooter>
-    </AlertDialogContent>
-  </AlertDialog>
 </template>

frontend/apps/main/src/components/sidebar/SidebarNavUser.vue

@@ -118,12 +118,12 @@ import {
   DropdownMenuLabel,
   DropdownMenuSeparator,
   DropdownMenuTrigger
-} from '@/components/ui/dropdown-menu'
-import { SidebarMenuButton } from '@/components/ui/sidebar'
-import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'
-import { Switch } from '@/components/ui/switch'
+} from '@shared-ui/components/ui/dropdown-menu'
+import { SidebarMenuButton } from '@shared-ui/components/ui/sidebar'
+import { Avatar, AvatarFallback, AvatarImage } from '@shared-ui/components/ui/avatar'
+import { Switch } from '@shared-ui/components/ui/switch'
 import { ChevronsUpDown, CircleUserRound, LogOut, Moon, Sun } from 'lucide-vue-next'
-import { useUserStore } from '@/stores/user'
+import { useUserStore } from '../../stores/user'
 import { useRouter } from 'vue-router'
 
 import { useColorMode } from '@vueuse/core'

frontend/apps/main/src/components/table/SimpleTable.vue

@@ -71,8 +71,8 @@
 <script setup>
 import { Trash2 } from 'lucide-vue-next'
 import { defineEmits } from 'vue'
-import { Button } from '@/components/ui/button'
-import { Skeleton } from '@/components/ui/skeleton'
+import { Button } from '@shared-ui/components/ui/button'
+import { Skeleton } from '@shared-ui/components/ui/skeleton'
 
 defineProps({
   headers: {

frontend/apps/main/src/components/update/AppUpdate.vue

@@ -0,0 +1,25 @@
+<template>
+  <div
+    v-if="appSettingsStore.settings['app.update']?.update?.is_new"
+    class="p-2 mb-2 border-b bg-secondary text-secondary-foreground"
+  >
+    {{ $t('update.newUpdateAvailable') }}:
+    {{ appSettingsStore.settings['app.update'].update.release_version }} ({{
+      appSettingsStore.settings['app.update'].update.release_date
+    }})
+    <a
+      :href="appSettingsStore.settings['app.update'].update.url"
+      target="_blank"
+      nofollow
+      noreferrer
+      class="underline ml-2"
+    >
+      {{ $t('globals.messages.viewDetails') }}
+    </a>
+  </div>
+</template>
+
+<script setup>
+import { useAppSettingsStore } from '../../stores/appSettings'
+const appSettingsStore = useAppSettingsStore()
+</script>

frontend/apps/main/src/composables/useActivityLogFilters.js

@@ -1,6 +1,6 @@
 import { computed } from 'vue'
-import { useUsersStore } from '@/stores/users'
-import { FIELD_TYPE, FIELD_OPERATORS } from '@/constants/filterConfig'
+import { useUsersStore } from '../stores/users'
+import { FIELD_TYPE, FIELD_OPERATORS } from '../constants/filterConfig'
 import { useI18n } from 'vue-i18n'
 
 export function useActivityLogFilters () {

frontend/apps/main/src/composables/useConversationFilters.js

@@ -1,12 +1,11 @@
 import { computed } from 'vue'
-import { useConversationStore } from '@/stores/conversation'
-import { useInboxStore } from '@/stores/inbox'
-import { useUsersStore } from '@/stores/users'
-import { useTeamStore } from '@/stores/team'
-import { useSlaStore } from '@/stores/sla'
-import { useCustomAttributeStore } from '@/stores/customAttributes'
-import { useTagStore } from '@/stores/tag'
-import { FIELD_TYPE, FIELD_OPERATORS } from '@/constants/filterConfig'
+import { useConversationStore } from '../stores/conversation'
+import { useInboxStore } from '../stores/inbox'
+import { useUsersStore } from '../stores/users'
+import { useTeamStore } from '../stores/team'
+import { useSlaStore } from '../stores/sla'
+import { useCustomAttributeStore } from '../stores/customAttributes'
+import { FIELD_TYPE, FIELD_OPERATORS } from '../constants/filterConfig'
 import { useI18n } from 'vue-i18n'
 
 export function useConversationFilters () {
@@ -16,7 +15,6 @@ export function useConversationFilters () {
     const tStore = useTeamStore()
     const slaStore = useSlaStore()
     const customAttributeStore = useCustomAttributeStore()
-    const tagStore = useTagStore()
     const { t } = useI18n()
 
     const customAttributeDataTypeToFieldType = {
@@ -71,12 +69,6 @@ export function useConversationFilters () {
             type: FIELD_TYPE.SELECT,
             operators: FIELD_OPERATORS.SELECT,
             options: iStore.options
-        },
-        tags: {
-            label: t('globals.terms.tag', 2),
-            type: FIELD_TYPE.MULTI_SELECT,
-            operators: FIELD_OPERATORS.MULTI_SELECT,
-            options: tagStore.tagOptions
         }
     }))
 

frontend/apps/main/src/composables/useFileUpload.js

@@ -1,8 +1,8 @@
 import { ref, readonly } from 'vue'
-import { useEmitter } from '@/composables/useEmitter'
-import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
-import { handleHTTPError } from '@/utils/http'
-import api from '@/api'
+import { useEmitter } from './useEmitter'
+import { EMITTER_EVENTS } from '../constants/emitterEvents.js'
+import { handleHTTPError } from '../utils/http'
+import api from '../api'
 
 /**
  * Composable for handling file uploads

frontend/apps/main/src/composables/useIdleDetection.js

@@ -1,6 +1,6 @@
 import { ref, onMounted, onBeforeUnmount, watch } from 'vue'
-import { useUserStore } from '@/stores/user'
-import { debounce } from '@/utils/debounce'
+import { useUserStore } from '../stores/user'
+import { debounce } from '../utils/debounce'
 import { useStorage } from '@vueuse/core'
 
 export function useIdleDetection () {

frontend/apps/main/src/composables/useSla.js

@@ -1,5 +1,5 @@
 import { ref, onMounted, onUnmounted } from 'vue'
-import { calculateSla } from '@/utils/sla'
+import { calculateSla } from '../utils/sla'
 
 export function useSla (dueAt, actualAt) {
     const sla = ref(null)

frontend/apps/main/src/constants/filterConfig.js

@@ -1,7 +1,6 @@
 export const FIELD_TYPE = {
     SELECT: 'select',
     TAG: 'tag',
-    MULTI_SELECT: 'multi-select',
     TEXT: 'text',
     NUMBER: 'number',
     RICHTEXT: 'richtext',
@@ -40,5 +39,4 @@ export const FIELD_OPERATORS = {
         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]
 }

frontend/apps/main/src/constants/navigation.js

@@ -82,6 +82,23 @@ export const adminNavItems = [
       }
     ]
   },
+  {
+    titleKey: 'globals.terms.ai',
+    children: [
+      {
+        titleKey: 'globals.terms.aiAssistant',
+        isTitleKeyPlural: true,
+        href: '/admin/ai/assistants',
+        permission: 'ai:manage'
+      },
+      {
+        titleKey: 'globals.terms.snippet',
+        isTitleKeyPlural: true,
+        href: '/admin/ai/snippets',
+        permission: 'ai:manage'
+      },
+    ]
+  },
   {
     titleKey: 'globals.terms.automation',
     children: [
@@ -142,7 +159,17 @@ export const adminNavItems = [
         permission: 'webhooks:manage'
       }
     ]
-  }
+  },
+  {
+    titleKey: 'globals.terms.helpCenter',
+    children: [
+      {
+        titleKey: 'globals.terms.helpCenter',
+        href: '/admin/help-center',
+        permission: 'help_center:manage'
+      }
+    ]
+  },
 ]
 
 export const accountNavItems = [

frontend/apps/main/src/constants/permissions.js

@@ -12,7 +12,6 @@ export const permissions = {
   CONVERSATIONS_UPDATE_TAGS: 'conversations:update_tags',
   MESSAGES_READ: 'messages:read',
   MESSAGES_WRITE: 'messages:write',
-  MESSAGES_WRITE_AS_CONTACT: 'messages:write_as_contact',
   VIEW_MANAGE: 'view:manage',
   GENERAL_SETTINGS_MANAGE: 'general_settings:manage',
   NOTIFICATION_SETTINGS_MANAGE: 'notification_settings:manage',

frontend/apps/main/src/constants/user.js

@@ -0,0 +1 @@
+export const Roles = ["Admin", "Agent"]

frontend/apps/main/src/constants/websocket.js

@@ -0,0 +1,13 @@
+export const WS_EVENT = {
+    NEW_MESSAGE: 'new_message',
+    MESSAGE_PROP_UPDATE: 'message_prop_update',
+    CONVERSATION_PROP_UPDATE: 'conversation_prop_update',
+    CONVERSATION_SUBSCRIBE: 'conversation_subscribe',
+    CONVERSATION_SUBSCRIBED: 'conversation_subscribed',
+    TYPING: 'typing',
+}
+
+// Message types that should not be queued because they become stale quickly
+export const WS_EPHEMERAL_TYPES = [
+    WS_EVENT.TYPING,
+]

frontend/apps/main/src/features/admin/activity-log/ActivityLog.vue

@@ -148,7 +148,7 @@
 
 <script setup>
 import { ref, computed, onMounted, watch } from 'vue'
-import SimpleTable from '@/components/table/SimpleTable.vue'
+import SimpleTable from '@main/components/table/SimpleTable.vue'
 import {
   Pagination,
   PaginationEllipsis,
@@ -158,23 +158,23 @@ import {
   PaginationListItem,
   PaginationNext,
   PaginationPrev
-} from '@/components/ui/pagination'
+} from '@shared-ui/components/ui/pagination'
 import {
   Select,
   SelectContent,
   SelectItem,
   SelectTrigger,
   SelectValue
-} from '@/components/ui/select'
-import FilterBuilder from '@/components/filter/FilterBuilder.vue'
-import { Button } from '@/components/ui/button'
+} from '@shared-ui/components/ui/select'
+import FilterBuilder from '@main/components/filter/FilterBuilder.vue'
+import { Button } from '@shared-ui/components/ui/button'
 import { ListFilter, ArrowDownWideNarrow } from 'lucide-vue-next'
-import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'
-import { useActivityLogFilters } from '@/composables/useActivityLogFilters'
+import { Popover, PopoverContent, PopoverTrigger } from '@shared-ui/components/ui/popover'
+import { useActivityLogFilters } from '../../../composables/useActivityLogFilters'
 import { useI18n } from 'vue-i18n'
 import { format } from 'date-fns'
-import { getVisiblePages } from '@/utils/pagination'
-import api from '@/api'
+import { getVisiblePages } from '../../../utils/pagination'
+import api from '../../../api'
 
 const activityLogs = ref([])
 const { t } = useI18n()

frontend/apps/main/src/features/admin/agents/AgentForm.vue

@@ -304,17 +304,17 @@
 
 <script setup>
 import { watch, onMounted, ref, computed } from 'vue'
-import { Button } from '@/components/ui/button'
+import { Button } from '@shared-ui/components/ui/button/index.js'
 import { useForm } from 'vee-validate'
 import { toTypedSchema } from '@vee-validate/zod'
 import { createFormSchema } from './formSchema.js'
-import { Checkbox } from '@/components/ui/checkbox'
-import { Label } from '@/components/ui/label'
+import { Checkbox } from '@shared-ui/components/ui/checkbox/index.js'
+import { Label } from '@shared-ui/components/ui/label/index.js'
 import { vAutoAnimate } from '@formkit/auto-animate/vue'
-import { Badge } from '@/components/ui/badge'
+import { Badge } from '@shared-ui/components/ui/badge/index.js'
 import { Clock, LogIn, Key, RotateCcw, Trash2, Plus, Copy, AlertTriangle } from 'lucide-vue-next'
-import { FormControl, FormField, FormItem, FormLabel, FormMessage } from '@/components/ui/form'
-import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'
+import { FormControl, FormField, FormItem, FormLabel, FormMessage } from '@shared-ui/components/ui/form/index.js'
+import { Avatar, AvatarFallback, AvatarImage } from '@shared-ui/components/ui/avatar/index.js'
 import {
   Select,
   SelectContent,
@@ -322,9 +322,9 @@ import {
   SelectItem,
   SelectTrigger,
   SelectValue
-} from '@/components/ui/select'
-import { SelectTag } from '@/components/ui/select'
-import { Input } from '@/components/ui/input'
+} from '@shared-ui/components/ui/select/index.js'
+import { SelectTag } from '@shared-ui/components/ui/select/index.js'
+import { Input } from '@shared-ui/components/ui/input/index.js'
 import {
   Dialog,
   DialogContent,
@@ -332,13 +332,13 @@ import {
   DialogFooter,
   DialogHeader,
   DialogTitle
-} from '@/components/ui/dialog'
-import { Alert, AlertDescription, AlertTitle } from '@/components/ui/alert'
+} from '@shared-ui/components/ui/dialog/index.js'
+import { Alert, AlertDescription, AlertTitle } from '@shared-ui/components/ui/alert/index.js'
 import { useI18n } from 'vue-i18n'
-import { useEmitter } from '@/composables/useEmitter'
-import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
+import { useEmitter } from '../../../composables/useEmitter.js'
+import { EMITTER_EVENTS } from '../../../constants/emitterEvents.js'
 import { format } from 'date-fns'
-import api from '@/api'
+import api from '../../../api/index.js'
 
 const props = defineProps({
   initialValues: {
@@ -418,6 +418,7 @@ const onSubmit = form.handleSubmit((values) => {
   if (values.availability_status === 'active_group') {
     values.availability_status = 'online'
   }
+  values.teams = values.teams.map((team) => ({ name: team }))
   props.submitForm(values)
 })
 

frontend/apps/main/src/features/admin/agents/dataTableColumns.js

@@ -9,7 +9,7 @@ export const createColumns = (t) => [
       return h('div', { class: 'text-center' }, t('globals.terms.firstName'))
     },
     cell: function ({ row }) {
-      return h('div', { class: 'text-center' }, row.getValue('first_name'))
+      return h('div', { class: 'text-center font-medium' }, row.getValue('first_name'))
     }
   },
   {
@@ -18,7 +18,7 @@ export const createColumns = (t) => [
       return h('div', { class: 'text-center' }, t('globals.terms.lastName'))
     },
     cell: function ({ row }) {
-      return h('div', { class: 'text-center' }, row.getValue('last_name'))
+      return h('div', { class: 'text-center font-medium' }, row.getValue('last_name'))
     }
   },
   {
@@ -27,7 +27,7 @@ export const createColumns = (t) => [
       return h('div', { class: 'text-center' }, t('globals.terms.enabled'))
     },
     cell: function ({ row }) {
-      return h('div', { class: 'text-center' }, row.getValue('enabled') ? t('globals.messages.yes') : t('globals.messages.no'))
+      return h('div', { class: 'text-center font-medium' }, row.getValue('enabled') ? t('globals.messages.yes') : t('globals.messages.no'))
     }
   },
   {
@@ -36,7 +36,7 @@ export const createColumns = (t) => [
       return h('div', { class: 'text-center' }, t('globals.terms.email'))
     },
     cell: function ({ row }) {
-      return h('div', { class: 'text-center' }, row.getValue('email'))
+      return h('div', { class: 'text-center font-medium' }, row.getValue('email'))
     }
   },
   {
@@ -47,7 +47,7 @@ export const createColumns = (t) => [
     cell: function ({ row }) {
       return h(
         'div',
-        { class: 'text-center' },
+        { class: 'text-center font-medium' },
         format(row.getValue('created_at'), 'PPpp')
       )
     }
@@ -60,7 +60,7 @@ export const createColumns = (t) => [
     cell: function ({ row }) {
       return h(
         'div',
-        { class: 'text-center' },
+        { class: 'text-center font-medium' },
         format(row.getValue('updated_at'), 'PPpp')
       )
     }

frontend/apps/main/src/features/admin/agents/dataTableDropdown.vue

@@ -40,7 +40,7 @@ import {
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuTrigger
-} from '@/components/ui/dropdown-menu'
+} from '@shared-ui/components/ui/dropdown-menu'
 import {
   AlertDialog,
   AlertDialogAction,
@@ -50,13 +50,13 @@ import {
   AlertDialogFooter,
   AlertDialogHeader,
   AlertDialogTitle
-} from '@/components/ui/alert-dialog'
-import { Button } from '@/components/ui/button'
+} from '@shared-ui/components/ui/alert-dialog'
+import { Button } from '@shared-ui/components/ui/button'
 import { useRouter } from 'vue-router'
-import { useEmitter } from '@/composables/useEmitter'
-import { handleHTTPError } from '@/utils/http'
-import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
-import api from '@/api'
+import { useEmitter } from '../../../composables/useEmitter'
+import { handleHTTPError } from '../../../utils/http'
+import { EMITTER_EVENTS } from '../../../constants/emitterEvents.js'
+import api from '../../../api'
 
 const alertOpen = ref(false)
 const emit = useEmitter()

frontend/apps/main/src/features/admin/ai-assistants/AIAssistantForm.vue

@@ -0,0 +1,305 @@
+<template>
+  <Spinner v-if="formLoading"></Spinner>
+  <form @submit="onSubmit" class="space-y-6 w-full" :class="{ 'opacity-50': formLoading }">
+    <!-- Enabled Field -->
+    <FormField v-slot="{ componentField, handleChange }" name="enabled" v-if="!isNewForm">
+      <FormItem class="flex flex-row items-center justify-between rounded-lg border p-4">
+        <div class="space-y-0.5">
+          <FormLabel class="text-base">{{ t('globals.terms.enabled') }}</FormLabel>
+          <FormDescription>{{ t('ai.assistant.enabledDescription') }}</FormDescription>
+        </div>
+        <FormControl>
+          <Switch :checked="componentField.modelValue" @update:checked="handleChange" />
+        </FormControl>
+      </FormItem>
+    </FormField>
+
+    <!-- Name Field -->
+    <FormField v-slot="{ componentField }" name="first_name">
+      <FormItem>
+        <FormLabel>{{ t('globals.terms.name') }} <span class="text-red-500">*</span></FormLabel>
+        <FormControl>
+          <Input
+            type="text"
+            :placeholder="t('ai.assistant.namePlaceholder')"
+            v-bind="componentField"
+          />
+        </FormControl>
+        <FormDescription>{{ t('ai.assistant.nameDescription') }}</FormDescription>
+        <FormMessage />
+      </FormItem>
+    </FormField>
+
+    <!-- Avatar url -->
+    <FormField v-slot="{ componentField }" name="avatar_url">
+      <FormItem>
+        <FormLabel>{{ t('globals.terms.avatar') }} {{ t('globals.terms.url') }}</FormLabel>
+        <FormControl>
+          <Input
+            type="url"
+            v-bind="componentField"
+          />
+        </FormControl>
+        <FormMessage></FormMessage>
+      </FormItem>
+    </FormField>
+
+    <!-- Product Name Field -->
+    <FormField v-slot="{ componentField }" name="product_name">
+      <FormItem>
+        <FormLabel
+          >{{ t('ai.assistant.productName') }} <span class="text-red-500">*</span></FormLabel
+        >
+        <FormControl>
+          <Input
+            type="text"
+            :placeholder="t('ai.assistant.productNamePlaceholder')"
+            v-bind="componentField"
+          />
+        </FormControl>
+        <FormDescription>{{ t('ai.assistant.productNameDescription') }}</FormDescription>
+        <FormMessage />
+      </FormItem>
+    </FormField>
+
+    <!-- Product Description Field -->
+    <FormField v-slot="{ componentField }" name="product_description">
+      <FormItem>
+        <FormLabel
+          >{{ t('ai.assistant.productDescription') }} <span class="text-red-500">*</span></FormLabel
+        >
+        <FormControl>
+          <Textarea
+            :placeholder="t('ai.assistant.productDescriptionPlaceholder')"
+            v-bind="componentField"
+            rows="4"
+          />
+        </FormControl>
+        <FormDescription>{{ t('ai.assistant.productDescriptionDescription') }}</FormDescription>
+        <FormMessage />
+      </FormItem>
+    </FormField>
+
+    <!-- Answer Length Field -->
+    <FormField v-slot="{ componentField }" name="answer_length">
+      <FormItem>
+        <FormLabel
+          >{{ t('ai.assistant.answerLength') }} <span class="text-red-500">*</span></FormLabel
+        >
+        <Select v-bind="componentField">
+          <FormControl>
+            <SelectTrigger>
+              <SelectValue :placeholder="t('ai.assistant.selectAnswerLength')" />
+            </SelectTrigger>
+          </FormControl>
+          <SelectContent>
+            <SelectItem value="concise">{{ t('ai.assistant.answerLengthConcise') }}</SelectItem>
+            <SelectItem value="medium">{{ t('ai.assistant.answerLengthMedium') }}</SelectItem>
+            <SelectItem value="long">{{ t('ai.assistant.answerLengthLong') }}</SelectItem>
+          </SelectContent>
+        </Select>
+        <FormDescription>{{ t('ai.assistant.answerLengthDescription') }}</FormDescription>
+        <FormMessage />
+      </FormItem>
+    </FormField>
+
+    <!-- Answer Tone Field -->
+    <FormField v-slot="{ componentField }" name="answer_tone">
+      <FormItem>
+        <FormLabel
+          >{{ t('ai.assistant.answerTone') }} <span class="text-red-500">*</span></FormLabel
+        >
+        <Select v-bind="componentField">
+          <FormControl>
+            <SelectTrigger>
+              <SelectValue :placeholder="t('ai.assistant.selectAnswerTone')" />
+            </SelectTrigger>
+          </FormControl>
+          <SelectContent>
+            <SelectItem value="neutral">{{ t('ai.assistant.answerToneNeutral') }}</SelectItem>
+            <SelectItem value="friendly">{{ t('ai.assistant.answerToneFriendly') }}</SelectItem>
+            <SelectItem value="professional">{{
+              t('ai.assistant.answerToneProfessional')
+            }}</SelectItem>
+            <SelectItem value="humorous">{{ t('ai.assistant.answerToneHumorous') }}</SelectItem>
+          </SelectContent>
+        </Select>
+        <FormDescription>{{ t('ai.assistant.answerToneDescription') }}</FormDescription>
+        <FormMessage />
+      </FormItem>
+    </FormField>
+
+    <!-- Enable Handoff Checkbox -->
+    <FormField v-slot="{ componentField, handleChange }" name="hand_off">
+      <FormItem class="flex flex-row items-center justify-between rounded-lg border p-4">
+        <div class="space-y-0.5">
+          <FormLabel class="text-base">{{ t('ai.assistant.enableHandoff') }}</FormLabel>
+          <FormDescription>{{ t('ai.assistant.enableHandoffDescription') }}</FormDescription>
+        </div>
+        <FormControl>
+          <Switch :checked="componentField.modelValue" @update:checked="handleChange" />
+        </FormControl>
+      </FormItem>
+    </FormField>
+
+    <!-- Hand off team (conditional) -->
+    <FormField v-slot="{ componentField }" name="hand_off_team" v-if="form.values.hand_off">
+      <FormItem>
+        <FormLabel>{{ t('ai.assistant.conversationHandoffTeam') }}</FormLabel>
+        <FormControl>
+          <Select v-bind="componentField">
+            <FormControl>
+              <SelectTrigger>
+                <SelectValue
+                  :placeholder="
+                    t('globals.messages.select', { name: t('globals.terms.team').toLowerCase() })
+                  "
+                />
+              </SelectTrigger>
+            </FormControl>
+            <SelectContent>
+              <SelectItem
+                v-for="opt in teamStore.options"
+                :key="opt.value"
+                :value="parseInt(opt.value)"
+              >
+                {{ opt.label }}
+              </SelectItem>
+            </SelectContent>
+          </Select>
+        </FormControl>
+        <FormMessage />
+      </FormItem>
+    </FormField>
+
+    <!-- Submit Button -->
+    <div class="flex justify-end">
+      <Button type="submit" :disabled="formLoading">
+        <template v-if="formLoading">
+          <LoaderCircle class="w-4 h-4 mr-2 animate-spin" />
+        </template>
+        {{ isNewForm ? t('globals.messages.create') : t('globals.messages.update') }}
+      </Button>
+    </div>
+  </form>
+</template>
+
+<script setup>
+import { computed, onMounted, watch } from 'vue'
+import { toTypedSchema } from '@vee-validate/zod'
+import { useForm } from 'vee-validate'
+import { useI18n } from 'vue-i18n'
+import { Button } from '@shared-ui/components/ui/button'
+import { Input } from '@shared-ui/components/ui/input'
+import { Textarea } from '@shared-ui/components/ui/textarea'
+import { Switch } from '@shared-ui/components/ui/switch'
+import {
+  FormControl,
+  FormDescription,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage
+} from '@shared-ui/components/ui/form'
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from '@shared-ui/components/ui/select'
+import { Spinner } from '@shared-ui/components/ui/spinner'
+import { LoaderCircle } from 'lucide-vue-next'
+import { createFormSchema } from './formSchema.js'
+import { useTeamStore } from '@/stores/team'
+
+const { t } = useI18n()
+const teamStore = useTeamStore()
+const props = defineProps({
+  initialValues: {
+    type: Object,
+    default: () => ({})
+  },
+  submitForm: {
+    type: Function,
+    required: true
+  },
+  isNewForm: {
+    type: Boolean,
+    default: false
+  },
+  isLoading: {
+    type: Boolean,
+    default: false
+  }
+})
+
+const formLoading = computed(() => props.isLoading)
+
+const formSchema = toTypedSchema(createFormSchema(t))
+
+const form = useForm({
+  validationSchema: formSchema,
+  initialValues: {
+    first_name: '',
+    last_name: '',
+    avatar_url: '',
+    product_name: '',
+    product_description: '',
+    answer_length: 'medium',
+    answer_tone: 'friendly',
+    hand_off: false,
+    hand_off_team: null,
+    enabled: true,
+    ...props.initialValues
+  }
+})
+
+const onSubmit = form.handleSubmit((values) => {
+  props.submitForm(values)
+})
+
+// Parse meta fields if editing an existing assistant
+onMounted(() => {
+  if (!props.isNewForm && props.initialValues?.meta) {
+    try {
+      const meta =
+        typeof props.initialValues.meta === 'string'
+          ? JSON.parse(props.initialValues.meta)
+          : props.initialValues.meta
+
+      if (meta) {
+        form.setFieldValue('product_name', meta.product_name || '')
+        form.setFieldValue('product_description', meta.product_description || '')
+        form.setFieldValue('answer_length', meta.answer_length || 'medium')
+        form.setFieldValue('answer_tone', meta.answer_tone || 'friendly')
+        form.setFieldValue('hand_off', meta.hand_off || false)
+        form.setFieldValue('hand_off_team', meta.hand_off_team || null)
+      }
+    } catch (e) {
+      console.warn('Failed to parse AI assistant meta:', e)
+    }
+  }
+})
+
+// Watch for changes in initialValues (for edit mode)
+watch(
+  () => props.initialValues,
+  (newValues) => {
+    if (newValues && Object.keys(newValues).length > 0) {
+      form.resetForm({
+        values: {
+          first_name: newValues.first_name || '',
+          last_name: newValues.last_name || '',
+          avatar_url: newValues.avatar_url || '',
+          hand_off: newValues.hand_off ?? false,
+          hand_off_team: newValues.hand_off_team || null,
+          enabled: newValues.enabled ?? true,
+          ...newValues
+        }
+      })
+    }
+  },
+  { deep: true, immediate: true }
+)
+</script>

frontend/apps/main/src/features/admin/ai-assistants/dataTableColumns.js

@@ -0,0 +1,81 @@
+import { h } from 'vue'
+import AIAssistantDataTableDropDown from '@/features/admin/ai-assistants/dataTableDropdown.vue'
+import { format } from 'date-fns'
+
+export const createColumns = (t) => [
+  {
+    accessorKey: 'first_name',
+    header: function () {
+      return h('div', { class: 'text-center' }, t('globals.terms.name'))
+    },
+    cell: function ({ row }) {
+      return h('div', { class: 'text-center font-medium' }, row.getValue('first_name'))
+    }
+  },
+  {
+    accessorKey: 'meta',
+    header: function () {
+      return h('div', { class: 'text-center' }, t('globals.terms.product'))
+    },
+    cell: function ({ row }) {
+      const meta = row.getValue('meta')
+      let productName = ''
+      try {
+        const parsedMeta = typeof meta === 'string' ? JSON.parse(meta) : meta
+        productName = parsedMeta?.product_name || ''
+      } catch (e) {
+        productName = ''
+      }
+      return h('div', { class: 'text-center font-medium' }, productName)
+    }
+  },
+  {
+    accessorKey: 'enabled',
+    header: function () {
+      return h('div', { class: 'text-center' }, t('globals.terms.enabled'))
+    },
+    cell: function ({ row }) {
+      return h('div', { class: 'text-center font-medium' }, row.getValue('enabled') ? t('globals.messages.yes') : t('globals.messages.no'))
+    }
+  },
+  {
+    accessorKey: 'created_at',
+    header: function () {
+      return h('div', { class: 'text-center' }, t('globals.terms.createdAt'))
+    },
+    cell: function ({ row }) {
+      return h(
+        'div',
+        { class: 'text-center font-medium' },
+        format(row.getValue('created_at'), 'PPpp')
+      )
+    }
+  },
+  {
+    accessorKey: 'updated_at',
+    header: function () {
+      return h('div', { class: 'text-center' }, t('globals.terms.updatedAt'))
+    },
+    cell: function ({ row }) {
+      return h(
+        'div',
+        { class: 'text-center font-medium' },
+        format(row.getValue('updated_at'), 'PPpp')
+      )
+    }
+  },
+  {
+    id: 'actions',
+    enableHiding: false,
+    cell: ({ row }) => {
+      const assistant = row.original
+      return h(
+        'div',
+        { class: 'relative' },
+        h(AIAssistantDataTableDropDown, {
+          assistant
+        })
+      )
+    }
+  }
+]

frontend/apps/main/src/features/admin/ai-assistants/dataTableDropdown.vue

@@ -0,0 +1,97 @@
+<template>
+  <DropdownMenu>
+    <DropdownMenuTrigger as-child>
+      <Button variant="ghost" class="w-8 h-8 p-0">
+        <span class="sr-only"></span>
+        <MoreHorizontal class="w-4 h-4" />
+      </Button>
+    </DropdownMenuTrigger>
+    <DropdownMenuContent>
+      <DropdownMenuItem @click="editAIAssistant(props.assistant.id)">{{
+        $t('globals.messages.edit')
+      }}</DropdownMenuItem>
+      <DropdownMenuItem @click="() => (alertOpen = true)">{{
+        $t('globals.messages.delete')
+      }}</DropdownMenuItem>
+    </DropdownMenuContent>
+  </DropdownMenu>
+
+  <AlertDialog :open="alertOpen" @update:open="alertOpen = $event">
+    <AlertDialogContent>
+      <AlertDialogHeader>
+        <AlertDialogTitle>{{ $t('globals.messages.areYouAbsolutelySure') }}</AlertDialogTitle>
+        <AlertDialogDescription>{{ $t('ai.assistant.deleteConfirmation') }}</AlertDialogDescription>
+      </AlertDialogHeader>
+      <AlertDialogFooter>
+        <AlertDialogCancel>{{ $t('globals.messages.cancel') }}</AlertDialogCancel>
+        <AlertDialogAction @click="handleDelete">{{
+          $t('globals.messages.delete')
+        }}</AlertDialogAction>
+      </AlertDialogFooter>
+    </AlertDialogContent>
+  </AlertDialog>
+</template>
+
+<script setup>
+import { ref } from 'vue'
+import { MoreHorizontal } from 'lucide-vue-next'
+import {
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuItem,
+  DropdownMenuTrigger
+} from '@shared-ui/components/ui/dropdown-menu'
+import {
+  AlertDialog,
+  AlertDialogAction,
+  AlertDialogCancel,
+  AlertDialogContent,
+  AlertDialogDescription,
+  AlertDialogFooter,
+  AlertDialogHeader,
+  AlertDialogTitle
+} from '@shared-ui/components/ui/alert-dialog'
+import { Button } from '@shared-ui/components/ui/button'
+import { useRouter } from 'vue-router'
+import { useEmitter } from '../../../composables/useEmitter'
+import { handleHTTPError } from '../../../utils/http'
+import { EMITTER_EVENTS } from '../../../constants/emitterEvents.js'
+import api from '../../../api'
+
+const alertOpen = ref(false)
+const emit = useEmitter()
+const router = useRouter()
+
+const props = defineProps({
+  assistant: {
+    type: Object,
+    required: true,
+    default: () => ({
+      id: ''
+    })
+  }
+})
+
+function editAIAssistant(id) {
+  router.push({ path: `/admin/ai/assistants/${id}/edit` })
+}
+
+async function handleDelete() {
+  try {
+    await api.deleteAIAssistant(props.assistant.id)
+    alertOpen.value = false
+    emitRefreshAssistantList()
+  } catch (error) {
+    emit.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  }
+}
+
+const emitRefreshAssistantList = () => {
+  emit.emit(EMITTER_EVENTS.REFRESH_LIST, {
+    model: 'ai_assistant'
+  })
+}
+</script>

frontend/apps/main/src/features/admin/ai-assistants/formSchema.js

@@ -0,0 +1,89 @@
+import * as z from 'zod'
+
+export const createFormSchema = (t) => z.object({
+  first_name: z
+    .string({
+      required_error: t('globals.messages.required'),
+    })
+    .min(2, {
+      message: t('form.error.minmax', {
+        min: 2,
+        max: 100,
+      })
+    })
+    .max(100, {
+      message: t('form.error.minmax', {
+        min: 2,
+        max: 100,
+      })
+    }),
+
+  last_name: z.string().optional(),
+
+  avatar_url: z
+    .string()
+    .url({
+      message: t('globals.messages.invalidUrl'),
+    })
+    .optional()
+    .or(z.literal('')),
+
+  product_name: z
+    .string({
+      required_error: t('globals.messages.required'),
+    })
+    .min(2, {
+      message: t('form.error.minmax', {
+        min: 2,
+        max: 255,
+      })
+    })
+    .max(255, {
+      message: t('form.error.minmax', {
+        min: 2,
+        max: 255,
+      })
+    }),
+
+  product_description: z
+    .string({
+      required_error: t('globals.messages.required'),
+    })
+    .min(10, {
+      message: t('form.error.minmax', {
+        min: 10,
+        max: 1000,
+      })
+    })
+    .max(1000, {
+      message: t('form.error.minmax', {
+        min: 10,
+        max: 1000,
+      })
+    }),
+
+  answer_length: z
+    .enum(['concise', 'medium', 'long'], {
+      required_error: t('globals.messages.required'),
+      invalid_type_error: t('globals.messages.invalid', { name: t('ai.assistant.answerLength') })
+    }),
+
+  answer_tone: z
+    .enum(['neutral', 'friendly', 'professional', 'humorous'], {
+      required_error: t('globals.messages.required'),
+      invalid_type_error: t('globals.messages.invalid', { name: t('ai.assistant.answerTone') })
+    }),
+
+  enabled: z.boolean().optional().default(true),
+
+  hand_off: z.boolean().optional().default(false),
+
+  hand_off_team: z
+    .number()
+    .int({
+      message: t('globals.messages.invalid', { name: t('globals.terms.team') })
+    })
+    .optional()
+    .nullable()
+    .default(null),
+})

frontend/apps/main/src/features/admin/automation/ActionBox.vue

@@ -87,9 +87,9 @@
 
 <script setup>
 import { toRefs } from 'vue'
-import { Button } from '@/components/ui/button'
-import CloseButton from '@/components/button/CloseButton.vue'
-import { useTagStore } from '@/stores/tag'
+import { Button } from '@shared-ui/components/ui/button'
+import CloseButton from '@main/components/button/CloseButton.vue'
+import { useTagStore } from '../../../stores/tag'
 import {
   Select,
   SelectContent,
@@ -97,13 +97,13 @@ import {
   SelectItem,
   SelectTrigger,
   SelectValue
-} from '@/components/ui/select'
-import { SelectTag } from '@/components/ui/select'
-import { useConversationFilters } from '@/composables/useConversationFilters'
-import { getTextFromHTML } from '@/utils/strings.js'
+} from '@shared-ui/components/ui/select'
+import { SelectTag } from '@shared-ui/components/ui/select'
+import { useConversationFilters } from '../../../composables/useConversationFilters'
+import { getTextFromHTML } from '../../../utils/strings.js'
 import { useI18n } from 'vue-i18n'
-import Editor from '@/components/editor/TextEditor.vue'
-import SelectComboBox from '@/components/combobox/SelectCombobox.vue'
+import Editor from '@main/components/editor/TextEditor.vue'
+import SelectComboBox from '@main/components/combobox/SelectCombobox.vue'
 
 const props = defineProps({
   actions: {

frontend/apps/main/src/features/admin/automation/AutomationTabs.vue

@@ -34,7 +34,7 @@
 </template>
 
 <script setup>
-import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@shared-ui/components/ui/tabs'
 import { useI18n } from 'vue-i18n'
 import RuleTab from './RuleTab.vue'
 

frontend/apps/main/src/features/admin/automation/RuleBox.vue

@@ -190,10 +190,10 @@
 
 <script setup>
 import { toRefs, computed, watch } from 'vue'
-import { Checkbox } from '@/components/ui/checkbox'
-import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group'
-import { Button } from '@/components/ui/button'
-import CloseButton from '@/components/button/CloseButton.vue'
+import { Checkbox } from '@shared-ui/components/ui/checkbox'
+import { RadioGroup, RadioGroupItem } from '@shared-ui/components/ui/radio-group'
+import { Button } from '@shared-ui/components/ui/button'
+import CloseButton from '@main/components/button/CloseButton.vue'
 import {
   Select,
   SelectContent,
@@ -202,19 +202,19 @@ import {
   SelectLabel,
   SelectTrigger,
   SelectValue
-} from '@/components/ui/select'
+} from '@shared-ui/components/ui/select'
 import {
   TagsInput,
   TagsInputInput,
   TagsInputItem,
   TagsInputItemDelete,
   TagsInputItemText
-} from '@/components/ui/tags-input'
-import { Label } from '@/components/ui/label'
-import { Input } from '@/components/ui/input'
+} from '@shared-ui/components/ui/tags-input'
+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 SelectComboBox from '@/components/combobox/SelectCombobox.vue'
+import { useConversationFilters } from '../../../composables/useConversationFilters'
+import SelectComboBox from '@main/components/combobox/SelectCombobox.vue'
 
 const props = defineProps({
   ruleGroup: {

frontend/apps/main/src/features/admin/automation/RuleList.vue

@@ -68,7 +68,7 @@ import {
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuTrigger
-} from '@/components/ui/dropdown-menu'
+} from '@shared-ui/components/ui/dropdown-menu'
 import {
   AlertDialog,
   AlertDialogAction,
@@ -78,10 +78,10 @@ import {
   AlertDialogFooter,
   AlertDialogHeader,
   AlertDialogTitle
-} from '@/components/ui/alert-dialog'
+} from '@shared-ui/components/ui/alert-dialog'
 import { EllipsisVertical } from 'lucide-vue-next'
 import { useRouter } from 'vue-router'
-import { Badge } from '@/components/ui/badge'
+import { Badge } from '@shared-ui/components/ui/badge'
 
 const router = useRouter()
 const alertOpen = ref(false)

frontend/apps/main/src/features/admin/automation/RuleTab.vue

@@ -64,17 +64,17 @@
 <script setup>
 import { ref, onMounted, watch } from 'vue'
 import RuleList from './RuleList.vue'
-import { Spinner } from '@/components/ui/spinner'
+import { Spinner } from '@shared-ui/components/ui/spinner'
 import {
   Select,
   SelectContent,
   SelectItem,
   SelectTrigger,
   SelectValue
-} from '@/components/ui/select'
+} from '@shared-ui/components/ui/select'
 import { Settings } from 'lucide-vue-next'
 import draggable from 'vuedraggable'
-import api from '@/api'
+import api from '../../../api'
 
 const isLoading = ref(false)
 const rules = ref([])

frontend/apps/main/src/features/admin/business-hours/BusinessHoursForm.vue

@@ -167,23 +167,23 @@
 
 <script setup>
 import { ref, watch, reactive, computed } from 'vue'
-import { Button } from '@/components/ui/button'
+import { Button } from '@shared-ui/components/ui/button/index.js'
 import { useForm } from 'vee-validate'
 import { toTypedSchema } from '@vee-validate/zod'
 import { createFormSchema } from './formSchema.js'
-import { Checkbox } from '@/components/ui/checkbox'
-import { Label } from '@/components/ui/label'
-import { RadioGroup, RadioGroupItem } from '@/components/ui/radio-group'
-import { FormControl, FormField, FormItem, FormLabel, FormMessage } from '@/components/ui/form'
-import { Calendar } from '@/components/ui/calendar'
-import { Input } from '@/components/ui/input'
-import { Popover, PopoverContent, PopoverTrigger } from '@/components/ui/popover'
-import { cn } from '@/lib/utils'
+import { Checkbox } from '@shared-ui/components/ui/checkbox/index.js'
+import { Label } from '@shared-ui/components/ui/label/index.js'
+import { RadioGroup, RadioGroupItem } from '@shared-ui/components/ui/radio-group/index.js'
+import { FormControl, FormField, FormItem, FormLabel, FormMessage } from '@shared-ui/components/ui/form/index.js'
+import { Calendar } from '@shared-ui/components/ui/calendar/index.js'
+import { Input } from '@shared-ui/components/ui/input/index.js'
+import { Popover, PopoverContent, PopoverTrigger } from '@shared-ui/components/ui/popover/index.js'
+import { cn } from '@shared-ui/lib/utils.js'
 import { format } from 'date-fns'
-import { WEEKDAYS } from '@/constants/date'
+import { WEEKDAYS } from '../../../constants/date.js'
 import { Calendar as CalendarIcon } from 'lucide-vue-next'
 import { useI18n } from 'vue-i18n'
-import SimpleTable from '@/components/table/SimpleTable.vue'
+import SimpleTable from '@main/components/table/SimpleTable.vue'
 import {
   Dialog,
   DialogContent,
@@ -192,7 +192,7 @@ import {
   DialogHeader,
   DialogTitle,
   DialogTrigger
-} from '@/components/ui/dialog'
+} from '@shared-ui/components/ui/dialog/index.js'
 
 const props = defineProps({
   initialValues: {

frontend/apps/main/src/features/admin/business-hours/dataTableColumns.js

@@ -9,7 +9,7 @@ export const createColumns = (t) => [
             return h('div', { class: 'text-center' }, t('globals.terms.name'))
         },
         cell: function ({ row }) {
-            return h('div', { class: 'text-center' }, row.getValue('name'))
+            return h('div', { class: 'text-center font-medium' }, row.getValue('name'))
         }
     },
     {
@@ -18,7 +18,7 @@ export const createColumns = (t) => [
             return h('div', { class: 'text-center' }, t('globals.terms.createdAt'))
         },
         cell: function ({ row }) {
-            return h('div', { class: 'text-center' }, format(row.getValue('created_at'), 'PPpp'))
+            return h('div', { class: 'text-center font-medium' }, format(row.getValue('created_at'), 'PPpp'))
         }
     },
     {
@@ -27,7 +27,7 @@ export const createColumns = (t) => [
             return h('div', { class: 'text-center' }, t('globals.terms.updatedAt'))
         },
         cell: function ({ row }) {
-            return h('div', { class: 'text-center' }, format(row.getValue('updated_at'), 'PPpp'))
+            return h('div', { class: 'text-center font-medium' }, format(row.getValue('updated_at'), 'PPpp'))
         }
     },
     {

frontend/apps/main/src/features/admin/business-hours/dataTableDropdown.vue

@@ -50,7 +50,7 @@ import {
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuTrigger
-} from '@/components/ui/dropdown-menu'
+} from '@shared-ui/components/ui/dropdown-menu'
 import {
   AlertDialog,
   AlertDialogAction,
@@ -60,13 +60,13 @@ import {
   AlertDialogFooter,
   AlertDialogHeader,
   AlertDialogTitle
-} from '@/components/ui/alert-dialog'
-import { Button } from '@/components/ui/button'
+} from '@shared-ui/components/ui/alert-dialog'
+import { Button } from '@shared-ui/components/ui/button'
 import { useRouter } from 'vue-router'
-import api from '@/api'
-import { useEmitter } from '@/composables/useEmitter'
+import api from '../../../api'
+import { useEmitter } from '../../../composables/useEmitter'
 import { useI18n } from 'vue-i18n'
-import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
+import { EMITTER_EVENTS } from '../../../constants/emitterEvents.js'
 
 const { t } = useI18n()
 const router = useRouter()

frontend/apps/main/src/features/admin/custom-attributes/CustomAttributesForm.vue

@@ -150,14 +150,14 @@ import {
   FormItem,
   FormLabel,
   FormMessage
-} from '@/components/ui/form'
+} from '@shared-ui/components/ui/form'
 import {
   TagsInput,
   TagsInputInput,
   TagsInputItem,
   TagsInputItemDelete,
   TagsInputItemText
-} from '@/components/ui/tags-input'
+} from '@shared-ui/components/ui/tags-input'
 import {
   Select,
   SelectContent,
@@ -165,8 +165,8 @@ import {
   SelectItem,
   SelectTrigger,
   SelectValue
-} from '@/components/ui/select'
-import { Input } from '@/components/ui/input'
+} from '@shared-ui/components/ui/select'
+import { Input } from '@shared-ui/components/ui/input'
 
 const props = defineProps({
   form: {

frontend/apps/main/src/features/admin/custom-attributes/dataTableColumns.js

@@ -9,7 +9,7 @@ export const createColumns = (t) => [
             return h('div', { class: 'text-center' }, t('globals.terms.name'))
         },
         cell: function ({ row }) {
-            return h('div', { class: 'text-center' }, row.getValue('name'))
+            return h('div', { class: 'text-center font-medium' }, row.getValue('name'))
         }
     },
     {
@@ -18,7 +18,7 @@ export const createColumns = (t) => [
             return h('div', { class: 'text-center' }, t('globals.terms.key'))
         },
         cell: function ({ row }) {
-            return h('div', { class: 'text-center' }, row.getValue('key'))
+            return h('div', { class: 'text-center font-medium' }, row.getValue('key'))
         }
     },
     {
@@ -27,7 +27,7 @@ export const createColumns = (t) => [
             return h('div', { class: 'text-center' }, t('globals.terms.type'))
         },
         cell: function ({ row }) {
-            return h('div', { class: 'text-center' }, row.getValue('data_type'))
+            return h('div', { class: 'text-center font-medium' }, row.getValue('data_type'))
         }
     },
     {
@@ -36,7 +36,7 @@ export const createColumns = (t) => [
             return h('div', { class: 'text-center' }, t('globals.terms.appliesTo'))
         },
         cell: function ({ row }) {
-            return h('div', { class: 'text-center' }, row.getValue('applies_to'))
+            return h('div', { class: 'text-center font-medium' }, row.getValue('applies_to'))
         }
     },
     {
@@ -47,7 +47,7 @@ export const createColumns = (t) => [
         cell: function ({ row }) {
             return h(
                 'div',
-                { class: 'text-center' },
+                { class: 'text-center font-medium' },
                 format(row.getValue('created_at'), 'PPpp')
             )
         }
@@ -60,7 +60,7 @@ export const createColumns = (t) => [
         cell: function ({ row }) {
             return h(
                 'div',
-                { class: 'text-center' },
+                { class: 'text-center font-medium' },
                 format(row.getValue('updated_at'), 'PPpp')
             )
         }

frontend/apps/main/src/features/admin/custom-attributes/dataTableDropdown.vue

@@ -44,7 +44,7 @@ import {
   DropdownMenuContent,
   DropdownMenuItem,
   DropdownMenuTrigger
-} from '@/components/ui/dropdown-menu'
+} from '@shared-ui/components/ui/dropdown-menu'
 import {
   AlertDialog,
   AlertDialogAction,
@@ -54,12 +54,12 @@ import {
   AlertDialogFooter,
   AlertDialogHeader,
   AlertDialogTitle
-} from '@/components/ui/alert-dialog'
-import { Button } from '@/components/ui/button'
-import { useEmitter } from '@/composables/useEmitter'
-import { handleHTTPError } from '@/utils/http'
-import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
-import api from '@/api'
+} from '@shared-ui/components/ui/alert-dialog'
+import { Button } from '@shared-ui/components/ui/button'
+import { useEmitter } from '../../../composables/useEmitter'
+import { handleHTTPError } from '../../../utils/http'
+import { EMITTER_EVENTS } from '../../../constants/emitterEvents.js'
+import api from '../../../api'
 
 const alertOpen = ref(false)
 const emit = useEmitter()

frontend/apps/main/src/features/admin/general/GeneralSettingForm.vue

@@ -171,7 +171,7 @@
 
 <script setup>
 import { watch, ref, onMounted } from 'vue'
-import { Button } from '@/components/ui/button'
+import { Button } from '@shared-ui/components/ui/button/index.js'
 import { useForm } from 'vee-validate'
 import { toTypedSchema } from '@vee-validate/zod'
 import { createFormSchema } from './formSchema.js'
@@ -182,7 +182,7 @@ import {
   FormLabel,
   FormMessage,
   FormDescription
-} from '@/components/ui/form'
+} from '@shared-ui/components/ui/form/index.js'
 import {
   Select,
   SelectContent,
@@ -190,21 +190,21 @@ import {
   SelectItem,
   SelectTrigger,
   SelectValue
-} from '@/components/ui/select'
+} from '@shared-ui/components/ui/select/index.js'
 import {
   TagsInput,
   TagsInputInput,
   TagsInputItem,
   TagsInputItemDelete,
   TagsInputItemText
-} from '@/components/ui/tags-input'
-import { Input } from '@/components/ui/input'
-import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
-import { useEmitter } from '@/composables/useEmitter'
-import { handleHTTPError } from '@/utils/http'
-import { timeZones } from '@/constants/timezones.js'
+} from '@shared-ui/components/ui/tags-input/index.js'
+import { Input } from '@shared-ui/components/ui/input/index.js'
+import { EMITTER_EVENTS } from '../../../constants/emitterEvents.js'
+import { useEmitter } from '../../../composables/useEmitter.js'
+import { handleHTTPError } from '../../../utils/http.js'
+import { timeZones } from '../../../constants/timezones.js'
 import { useI18n } from 'vue-i18n'
-import api from '@/api'
+import api from '../../../api/index.js'
 
 const emitter = useEmitter()
 const { t } = useI18n()

frontend/apps/main/src/features/admin/help-center/ArticleEditSheet.vue

@@ -0,0 +1,376 @@
+<template>
+  <Sheet :open="isOpen" @update:open="$emit('update:open', $event)">
+    <SheetContent class="!max-w-[80vw] sm:!max-w-[80vw] h-full p-0 flex flex-col">
+      <div class="flex-1 flex flex-col min-h-0">
+        <!-- Header -->
+        <div class="flex items-center justify-between p-6 border-b bg-card/50">
+          <div>
+            <h2 class="text-lg font-semibold">
+              {{ article ? 'Edit Article' : 'Create Article' }}
+            </h2>
+            <p class="text-sm text-muted-foreground mt-1">
+              {{ article ? `Last updated ${formatDatetime(new Date(article.updated_at))}` : 'Create a new help article' }}
+            </p>
+          </div>
+        </div>
+
+        <!-- Content -->
+        <div class="flex-1 flex min-h-0">
+          <!-- Main Content Area (75%) -->
+          <div class="flex-1 flex flex-col p-6 space-y-6 overflow-y-auto">
+            <Spinner v-if="formLoading" />
+            
+            <form v-else @submit="onSubmit" class="space-y-6 flex-1 flex flex-col">
+              <!-- Title -->
+              <FormField v-slot="{ componentField }" name="title">
+                <FormItem>
+                  <FormControl>
+                    <Input 
+                      type="text" 
+                      placeholder="Enter article title..." 
+                      v-bind="componentField" 
+                      class="text-xl font-semibold border-0 px-0 py-3 shadow-none focus-visible:ring-0 placeholder:text-muted-foreground/60"
+                    />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              </FormField>
+
+              <!-- Content Editor -->
+              <FormField v-slot="{ componentField }" name="content">
+                <FormItem class="flex-1 flex flex-col">
+                  <FormControl class="flex-1">
+                    <div class="flex-1 flex flex-col">
+                      <Editor
+                        v-model:htmlContent="componentField.modelValue"
+                        @update:htmlContent="(value) => componentField.onChange(value)"
+                        :placeholder="t('editor.newLine')"
+                        editorType="article"
+                        class="min-h-[400px] border-0 px-0 shadow-none focus-visible:ring-0"
+                      />
+                    </div>
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              </FormField>
+
+              <!-- Submit Button (Hidden - controlled by sidebar) -->
+              <button type="submit" class="hidden" ref="submitButton"></button>
+            </form>
+          </div>
+
+          <!-- Sidebar (25%) -->
+          <div class="w-80 border-l bg-muted/20 p-6 overflow-y-auto">
+            <div class="space-y-6">
+              <!-- Publish Actions -->
+              <div class="space-y-4">
+                <h3 class="font-medium text-sm text-muted-foreground uppercase tracking-wider">
+                  Actions
+                </h3>
+                
+                <div class="flex gap-2">
+                  <Button 
+                    type="button" 
+                    variant="outline" 
+                    size="sm" 
+                    @click="$emit('cancel')"
+                    class="flex-1"
+                  >
+                    Cancel
+                  </Button>
+                  <Button 
+                    type="button" 
+                    size="sm" 
+                    @click="handleSubmit"
+                    :disabled="isLoading"
+                    class="flex-1"
+                  >
+                    <Loader2Icon v-if="isLoading" class="h-4 w-4 mr-2 animate-spin" />
+                    {{ submitLabel }}
+                  </Button>
+                </div>
+              </div>
+
+              <!-- Status -->
+              <div class="space-y-3">
+                <h3 class="font-medium text-sm text-muted-foreground uppercase tracking-wider">
+                  Status
+                </h3>
+                
+                <FormField v-slot="{ componentField }" name="status">
+                  <FormItem>
+                    <FormControl>
+                      <Select v-bind="componentField">
+                        <SelectTrigger>
+                          <SelectValue />
+                        </SelectTrigger>
+                        <SelectContent>
+                          <SelectItem value="draft">Draft</SelectItem>
+                          <SelectItem value="published">Published</SelectItem>
+                        </SelectContent>
+                      </Select>
+                    </FormControl>
+                    <FormDescription class="text-xs">
+                      Only published articles are visible to users
+                    </FormDescription>
+                    <FormMessage />
+                  </FormItem>
+                </FormField>
+              </div>
+
+              <!-- Collection -->
+              <div v-if="availableCollections.length > 0" class="space-y-3">
+                <h3 class="font-medium text-sm text-muted-foreground uppercase tracking-wider">
+                  Collection
+                </h3>
+                
+                <FormField v-slot="{ componentField }" name="collection_id">
+                  <FormItem>
+                    <FormControl>
+                      <Select v-bind="componentField">
+                        <SelectTrigger>
+                          <SelectValue placeholder="Select collection" />
+                        </SelectTrigger>
+                        <SelectContent>
+                          <SelectItem
+                            v-for="collection in availableCollections"
+                            :key="collection.id"
+                            :value="collection.id"
+                          >
+                            {{ collection.name }}
+                          </SelectItem>
+                        </SelectContent>
+                      </Select>
+                    </FormControl>
+                    <FormDescription class="text-xs">
+                      Move this article to a different collection
+                    </FormDescription>
+                    <FormMessage />
+                  </FormItem>
+                </FormField>
+              </div>
+
+              <!-- AI Settings -->
+              <div class="space-y-3">
+                <h3 class="font-medium text-sm text-muted-foreground uppercase tracking-wider">
+                  AI Settings
+                </h3>
+                
+                <FormField v-slot="{ componentField }" name="ai_enabled">
+                  <FormItem class="flex flex-row items-start space-x-3 space-y-0 border rounded-lg p-3">
+                    <FormControl>
+                      <Checkbox
+                        :checked="componentField.modelValue"
+                        @update:checked="componentField.onChange"
+                      />
+                    </FormControl>
+                    <div class="space-y-1 leading-none flex-1">
+                      <FormLabel class="text-sm font-medium">
+                        Allow AI assistants to use this article
+                      </FormLabel>
+                      <FormDescription class="text-xs">
+                        Article must be published for this to take effect
+                      </FormDescription>
+                    </div>
+                    <FormMessage />
+                  </FormItem>
+                </FormField>
+              </div>
+
+              <!-- Metadata -->
+              <div v-if="article" class="space-y-3">
+                <h3 class="font-medium text-sm text-muted-foreground uppercase tracking-wider">
+                  Metadata
+                </h3>
+                
+                <div class="space-y-3 text-sm">
+                  <div class="flex justify-between py-2 border-b border-border/50">
+                    <span class="text-muted-foreground">Created</span>
+                    <span>{{ formatDatetime(new Date(article.created_at)) }}</span>
+                  </div>
+                  <div class="flex justify-between py-2 border-b border-border/50">
+                    <span class="text-muted-foreground">Updated</span>
+                    <span>{{ formatDatetime(new Date(article.updated_at)) }}</span>
+                  </div>
+                  <div v-if="article.view_count !== undefined" class="flex justify-between py-2 border-b border-border/50">
+                    <span class="text-muted-foreground">Views</span>
+                    <span>{{ article.view_count.toLocaleString() }}</span>
+                  </div>
+                  <div class="flex justify-between py-2">
+                    <span class="text-muted-foreground">ID</span>
+                    <span class="font-mono text-xs">#{{ article.id }}</span>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </SheetContent>
+  </Sheet>
+</template>
+
+<script setup>
+import { ref, watch, onMounted, computed } from 'vue'
+import { useForm } from 'vee-validate'
+import { toTypedSchema } from '@vee-validate/zod'
+import { Button } from '@shared-ui/components/ui/button'
+import { Input } from '@shared-ui/components/ui/input'
+import { Checkbox } from '@shared-ui/components/ui/checkbox'
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from '@shared-ui/components/ui/select'
+import {
+  Sheet,
+  SheetContent,
+} from '@shared-ui/components/ui/sheet'
+import { Spinner } from '@shared-ui/components/ui/spinner'
+import {
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+  FormDescription
+} from '@shared-ui/components/ui/form/index.js'
+import { Loader2 as Loader2Icon } from 'lucide-vue-next'
+import { createArticleFormSchema } from './articleFormSchema.js'
+import { useI18n } from 'vue-i18n'
+import { getTextFromHTML } from '../../../utils/strings.js'
+import Editor from '@main/components/editor/TextEditor.vue'
+import api from '../../../api'
+import { handleHTTPError } from '../../../utils/http'
+import { useEmitter } from '../../../composables/useEmitter'
+import { EMITTER_EVENTS } from '../../../constants/emitterEvents.js'
+import { formatDatetime } from '@shared-ui/utils/datetime.js'
+
+const { t } = useI18n()
+
+const props = defineProps({
+  isOpen: {
+    type: Boolean,
+    default: false
+  },
+  article: {
+    type: Object,
+    default: null
+  },
+  collectionId: {
+    type: Number,
+    default: null
+  },
+  submitForm: {
+    type: Function,
+    required: true
+  },
+  submitLabel: {
+    type: String,
+    default: ''
+  },
+  isLoading: {
+    type: Boolean,
+    default: false
+  },
+  locale: {
+    type: String,
+    default: 'en'
+  }
+})
+
+defineEmits(['update:open', 'cancel'])
+const emitter = useEmitter()
+
+const formLoading = ref(false)
+const availableCollections = ref([])
+const submitButton = ref(null)
+
+const submitLabel = computed(() => {
+  return (
+    props.submitLabel ||
+    (props.article ? t('globals.messages.update') : t('globals.messages.create'))
+  )
+})
+
+const form = useForm({
+  validationSchema: toTypedSchema(createArticleFormSchema(t)),
+  initialValues: {
+    title: props.article?.title || '',
+    content: props.article?.content || '',
+    status: props.article?.status || 'draft',
+    collection_id: props.article?.collection_id || props.collectionId || null,
+    sort_order: props.article?.sort_order || 0,
+    ai_enabled: props.article?.ai_enabled || false
+  }
+})
+
+onMounted(async () => {
+  await fetchAvailableCollections()
+})
+
+watch(
+  () => [props.article, props.collectionId, props.locale],
+  async (newValues) => {
+    const [newArticle, newCollectionId] = newValues
+    
+    // Re-fetch available collections when article, collectionId, or locale changes
+    await fetchAvailableCollections()
+    
+    if (newArticle && Object.keys(newArticle).length > 0) {
+      form.setValues({
+        title: newArticle.title || '',
+        content: newArticle.content || '',
+        status: newArticle.status || 'draft',
+        collection_id: newArticle.collection_id || newCollectionId || null,
+        sort_order: newArticle.sort_order || 0,
+        ai_enabled: newArticle.ai_enabled || false
+      })
+    }
+  },
+  { immediate: true }
+)
+
+const fetchAvailableCollections = async () => {
+  try {
+    let helpCenterId = null
+    if (props.article?.collection_id) {
+      // Editing existing article - get its collection first to find help center
+      const { data: collection } = await api.getCollection(props.article.collection_id)
+      helpCenterId = collection.data.help_center_id
+    } else if (props.collectionId) {
+      // Creating new article - get help center from provided collection
+      const { data: collection } = await api.getCollection(props.collectionId)
+      helpCenterId = collection.data.help_center_id
+    }
+    
+    if (helpCenterId) {
+      // Filter collections by current locale
+      const { data: collections } = await api.getCollections(helpCenterId, { locale: props.locale })
+      // Allow selecting all published collections for the current locale
+      availableCollections.value = collections.data.filter((c) => c.is_published)
+    }
+  } catch (error) {
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  }
+}
+
+const onSubmit = form.handleSubmit(async (values) => {
+  const textContent = getTextFromHTML(values.content)
+  if (textContent.length === 0) {
+    values.content = ''
+  }
+  props.submitForm(values)
+})
+
+const handleSubmit = () => {
+  if (submitButton.value) {
+    submitButton.value.click()
+  }
+}
+</script>

frontend/apps/main/src/features/admin/help-center/CollectionEditSheet.vue

@@ -0,0 +1,352 @@
+<template>
+  <Sheet :open="isOpen" @update:open="$emit('update:open', $event)">
+    <SheetContent class="!max-w-[60vw] sm:!max-w-[60vw] h-full p-0 flex flex-col">
+      <div class="flex-1 flex flex-col min-h-0">
+        <!-- Header -->
+        <div class="flex items-center justify-between p-6 border-b bg-card/50">
+          <div>
+            <h2 class="text-lg font-semibold">
+              {{ collection ? 'Edit Collection' : 'Create Collection' }}
+            </h2>
+            <p class="text-sm text-muted-foreground mt-1">
+              {{ collection ? `Last updated ${formatDatetime(new Date(collection.updated_at))}` : 'Create a new help collection' }}
+            </p>
+          </div>
+        </div>
+
+        <!-- Content -->
+        <div class="flex-1 flex min-h-0">
+          <!-- Main Content Area (70%) -->
+          <div class="flex-1 flex flex-col p-6 space-y-6 overflow-y-auto">
+            <Spinner v-if="formLoading" />
+            
+            <form v-else @submit="onSubmit" class="space-y-6 flex-1 flex flex-col">
+              <!-- Name -->
+              <FormField v-slot="{ componentField }" name="name">
+                <FormItem>
+                  <FormControl>
+                    <Input 
+                      type="text" 
+                      placeholder="Enter collection name..." 
+                      v-bind="componentField" 
+                      class="text-xl font-semibold border-0 px-0 py-3 shadow-none focus-visible:ring-0 placeholder:text-muted-foreground/60"
+                    />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              </FormField>
+
+              <!-- Description -->
+              <FormField v-slot="{ componentField }" name="description">
+                <FormItem class="flex-1">
+                  <FormControl>
+                    <Textarea
+                      placeholder="Describe what this collection contains..."
+                      rows="6"
+                      v-bind="componentField"
+                      class="border-0 px-0 py-2 shadow-none focus-visible:ring-0 resize-none placeholder:text-muted-foreground/60"
+                    />
+                  </FormControl>
+                  <FormMessage />
+                </FormItem>
+              </FormField>
+
+              <!-- Submit Button (Hidden - controlled by sidebar) -->
+              <button type="submit" class="hidden" ref="submitButton"></button>
+            </form>
+          </div>
+
+          <!-- Sidebar (30%) -->
+          <div class="w-72 border-l bg-muted/20 p-6 overflow-y-auto">
+            <div class="space-y-6">
+              <!-- Publish Actions -->
+              <div class="space-y-4">
+                <h3 class="font-medium text-sm text-muted-foreground uppercase tracking-wider">
+                  Actions
+                </h3>
+                
+                <div class="flex gap-2">
+                  <Button 
+                    type="button" 
+                    variant="outline" 
+                    size="sm" 
+                    @click="$emit('cancel')"
+                    class="flex-1"
+                  >
+                    Cancel
+                  </Button>
+                  <Button 
+                    type="button" 
+                    size="sm" 
+                    @click="handleSubmit"
+                    :disabled="isLoading"
+                    class="flex-1"
+                  >
+                    <Loader2Icon v-if="isLoading" class="h-4 w-4 mr-2 animate-spin" />
+                    {{ submitLabel }}
+                  </Button>
+                </div>
+              </div>
+
+              <!-- Visibility -->
+              <div class="space-y-3">
+                <h3 class="font-medium text-sm text-muted-foreground uppercase tracking-wider">
+                  Visibility
+                </h3>
+                
+                <FormField v-slot="{ componentField }" name="is_published">
+                  <FormItem class="flex flex-row items-start space-x-3 space-y-0 border rounded-lg p-3">
+                    <FormControl>
+                      <Checkbox
+                        :checked="componentField.modelValue"
+                        @update:checked="componentField.onChange"
+                      />
+                    </FormControl>
+                    <div class="space-y-1 leading-none flex-1">
+                      <FormLabel class="text-sm font-medium">
+                        Published
+                      </FormLabel>
+                      <FormDescription class="text-xs">
+                        Published collections are visible to users
+                      </FormDescription>
+                    </div>
+                    <FormMessage />
+                  </FormItem>
+                </FormField>
+              </div>
+
+              <!-- Parent Collection -->
+              <div v-if="availableParents.length > 0" class="space-y-3">
+                <h3 class="font-medium text-sm text-muted-foreground uppercase tracking-wider">
+                  Parent Collection
+                </h3>
+                
+                <FormField v-slot="{ componentField }" name="parent_id">
+                  <FormItem>
+                    <FormControl>
+                      <Select v-bind="componentField">
+                        <SelectTrigger>
+                          <SelectValue placeholder="Select parent (optional)" />
+                        </SelectTrigger>
+                        <SelectContent>
+                          <SelectItem :value="0">No parent (root level)</SelectItem>
+                          <SelectItem v-for="parent in availableParents" :key="parent.id" :value="parent.id">
+                            {{ parent.name }}
+                          </SelectItem>
+                        </SelectContent>
+                      </Select>
+                    </FormControl>
+                    <FormDescription class="text-xs">
+                      Collections can be nested up to 3 levels deep
+                    </FormDescription>
+                    <FormMessage />
+                  </FormItem>
+                </FormField>
+              </div>
+
+              <!-- Articles Count -->
+              <div v-if="collection && collection.articles" class="space-y-3">
+                <h3 class="font-medium text-sm text-muted-foreground uppercase tracking-wider">
+                  Articles
+                </h3>
+                
+                <div class="border rounded-lg p-3">
+                  <div class="flex items-center justify-between">
+                    <span class="text-sm font-medium">Total Articles</span>
+                    <Badge variant="outline">{{ collection.articles.length }}</Badge>
+                  </div>
+                  <p class="text-xs text-muted-foreground mt-2">
+                    {{ collection.articles.filter(a => a.status === 'published').length }} published, 
+                    {{ collection.articles.filter(a => a.status === 'draft').length }} draft
+                  </p>
+                </div>
+              </div>
+
+              <!-- Metadata -->
+              <div v-if="collection" class="space-y-3">
+                <h3 class="font-medium text-sm text-muted-foreground uppercase tracking-wider">
+                  Metadata
+                </h3>
+                
+                <div class="space-y-3 text-sm">
+                  <div class="flex justify-between py-2 border-b border-border/50">
+                    <span class="text-muted-foreground">Created</span>
+                    <span>{{ formatDatetime(new Date(collection.created_at)) }}</span>
+                  </div>
+                  <div class="flex justify-between py-2 border-b border-border/50">
+                    <span class="text-muted-foreground">Updated</span>
+                    <span>{{ formatDatetime(new Date(collection.updated_at)) }}</span>
+                  </div>
+                  <div v-if="collection.view_count !== undefined" class="flex justify-between py-2 border-b border-border/50">
+                    <span class="text-muted-foreground">Views</span>
+                    <span>{{ collection.view_count.toLocaleString() }}</span>
+                  </div>
+                  <div class="flex justify-between py-2">
+                    <span class="text-muted-foreground">ID</span>
+                    <span class="font-mono text-xs">#{{ collection.id }}</span>
+                  </div>
+                </div>
+              </div>
+            </div>
+          </div>
+        </div>
+      </div>
+    </SheetContent>
+  </Sheet>
+</template>
+
+<script setup>
+import { ref, watch, onMounted, computed } from 'vue'
+import { useForm } from 'vee-validate'
+import { toTypedSchema } from '@vee-validate/zod'
+import { Button } from '@shared-ui/components/ui/button'
+import { Input } from '@shared-ui/components/ui/input'
+import { Textarea } from '@shared-ui/components/ui/textarea'
+import { Checkbox } from '@shared-ui/components/ui/checkbox'
+import { Badge } from '@shared-ui/components/ui/badge'
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from '@shared-ui/components/ui/select'
+import {
+  Sheet,
+  SheetContent,
+} from '@shared-ui/components/ui/sheet'
+import { Spinner } from '@shared-ui/components/ui/spinner'
+import {
+  FormControl,
+  FormField,
+  FormItem,
+  FormLabel,
+  FormMessage,
+  FormDescription
+} from '@shared-ui/components/ui/form/index.js'
+import { Loader2 as Loader2Icon } from 'lucide-vue-next'
+import { createCollectionFormSchema } from './collectionFormSchema.js'
+import { useI18n } from 'vue-i18n'
+import api from '../../../api'
+import { handleHTTPError } from '../../../utils/http'
+import { useEmitter } from '../../../composables/useEmitter'
+import { EMITTER_EVENTS } from '../../../constants/emitterEvents.js'
+import { formatDatetime } from '@shared-ui/utils/datetime.js'
+
+const { t } = useI18n()
+
+const props = defineProps({
+  isOpen: {
+    type: Boolean,
+    default: false
+  },
+  collection: {
+    type: Object,
+    default: null
+  },
+  helpCenterId: {
+    type: Number,
+    required: true
+  },
+  parentId: {
+    type: Number,
+    default: null
+  },
+  submitForm: {
+    type: Function,
+    required: true
+  },
+  submitLabel: {
+    type: String,
+    default: ''
+  },
+  isLoading: {
+    type: Boolean,
+    default: false
+  },
+  locale: {
+    type: String,
+    default: 'en'
+  }
+})
+
+defineEmits(['update:open', 'cancel'])
+const emitter = useEmitter()
+
+const formLoading = ref(false)
+const availableParents = ref([])
+const submitButton = ref(null)
+
+const submitLabel = computed(() => {
+  return (
+    props.submitLabel ||
+    (props.collection ? t('globals.messages.update') : t('globals.messages.create'))
+  )
+})
+
+const form = useForm({
+  validationSchema: toTypedSchema(createCollectionFormSchema(t)),
+  initialValues: {
+    name: props.collection?.name || '',
+    description: props.collection?.description || '',
+    parent_id: props.collection?.parent_id || props.parentId || null,
+    is_published: props.collection?.is_published ?? true,
+    sort_order: props.collection?.sort_order || 0
+  }
+})
+
+onMounted(async () => {
+  await fetchAvailableParents()
+})
+
+watch(
+  () => props.collection,
+  (newValues) => {
+    if (newValues && Object.keys(newValues).length > 0) {
+      form.setValues({
+        name: newValues.name || '',
+        description: newValues.description || '',
+        parent_id: newValues.parent_id || null,
+        is_published: newValues.is_published ?? true,
+        sort_order: newValues.sort_order || 0
+      })
+    }
+  },
+  { immediate: true }
+)
+
+watch(
+  () => props.locale,
+  async () => {
+    await fetchAvailableParents()
+  }
+)
+
+const fetchAvailableParents = async () => {
+  try {
+    // Filter collections by current locale
+    const { data } = await api.getCollections(props.helpCenterId, { locale: props.locale })
+    availableParents.value = data.data.filter((collection) => {
+      // Exclude self and children from parent options
+      if (props.collection && collection.id === props.collection.id) return false
+      if (props.collection && collection.parent_id === props.collection.id) return false
+      return true
+    })
+  } catch (error) {
+    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+      variant: 'destructive',
+      description: handleHTTPError(error).message
+    })
+  }
+}
+
+const onSubmit = form.handleSubmit(async (values) => {
+  props.submitForm(values)
+})
+
+const handleSubmit = () => {
+  if (submitButton.value) {
+    submitButton.value.click()
+  }
+}
+</script>