Update README.md

Ref #137

.github/ISSUE_TEMPLATE/confirmed-bug.md

@@ -0,0 +1,16 @@
+---
+name: Confirmed Bug Report
+about: Report a confirmed bug in Libredesk
+title: "[Bug] <brief summary>"
+labels: bug
+assignees: ""
+---
+
+**Version:**
+- libredesk: [eg: v0.7.0]
+
+**Description of the bug and steps to reproduce:**
+A clear and concise description of what the bug is.
+
+**Logs / Screenshots:**
+Attach any relevant logs or screenshots to help diagnose the issue.

.github/ISSUE_TEMPLATE/possible-bug.md

@@ -0,0 +1,16 @@
+---
+name: Possible Bug Report
+about: Something in Libredesk might be broken but needs confirmation
+title: "[Possible Bug] <brief summary>"
+labels: bug, needs-investigation
+assignees: ""
+---
+
+**Version:**
+ - libredesk: [eg: v0.7.0]
+ 
+**Description of the bug and steps to reproduce:**
+A clear and concise description of what the bug is.
+
+**Logs / Screenshots:**
+Attach any relevant logs or screenshots to help diagnose the issue.

.github/workflows/crowdin.yml

@@ -12,6 +12,8 @@ on:
 jobs:
   crowdin:
     runs-on: ubuntu-latest
+    # Only run on the original repository, not forks
+    if: github.event.repository.fork == false
     steps:
       - name: Checkout
         uses: actions/checkout@v4

.github/workflows/github-pages.yml

@@ -1,31 +0,0 @@
-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

README.md

@@ -3,9 +3,9 @@
 
 # Libredesk
 
-Open source, self-hosted customer support desk. Single binary app.
+Modern, open source, self-hosted customer support desk. Single binary app. 
 
-![image](docs/docs/images/hero.png)
+![image](https://libredesk.io/hero.png)
 
 
 Visit [libredesk.io](https://libredesk.io) for more info. Check out the [**Live demo**](https://demo.libredesk.io/).
@@ -15,7 +15,7 @@ Visit [libredesk.io](https://libredesk.io) for more info. Check out the [**Live
 ## Features
 
 - **Multi Shared Inbox**  
-  Libredesk supports multiple shares inboxes, letting you manage conversations across teams effortlessly.
+  Libredesk supports multiple shared inboxes, letting you manage conversations across teams effortlessly.
 - **Granular Permissions**  
   Create custom roles with granular permissions for teams and individual agents.
 - **Smart Automation**  
@@ -67,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://libredesk.io/docs/installation/)
+See [installation docs](https://docs.libredesk.io/getting-started/installation)
 
 __________________
 
@@ -78,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://libredesk.io/docs/installation)
+See [installation docs](https://docs.libredesk.io/getting-started/installation)
 __________________
 
 
 ## Developers
-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.
+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.
+
+## 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/automation.go

@@ -45,10 +45,11 @@ func handleToggleAutomationRule(r *fastglue.Request) error {
 		app   = r.Context.(*App)
 		id, _ = strconv.Atoi(r.RequestCtx.UserValue("id").(string))
 	)
-	if err := app.automation.ToggleRule(id); err != nil {
+	toggledRule, err := app.automation.ToggleRule(id)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(toggledRule)
 }
 
 // handleUpdateAutomationRule updates an automation rule
@@ -66,10 +67,11 @@ func handleUpdateAutomationRule(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
 	}
 
-	if err = app.automation.UpdateRule(id, rule); err != nil {
+	updatedRule, err := app.automation.UpdateRule(id, rule)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(updatedRule)
 }
 
 // handleCreateAutomationRule creates a new automation rule
@@ -81,10 +83,11 @@ func handleCreateAutomationRule(r *fastglue.Request) error {
 	if err := r.Decode(&rule, "json"); err != nil {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
 	}
-	if err := app.automation.CreateRule(rule); err != nil {
+	createdRule, err := app.automation.CreateRule(rule)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(createdRule)
 }
 
 // handleDeleteAutomationRule deletes an automation rule

cmd/business_hours.go

@@ -55,11 +55,12 @@ func handleCreateBusinessHours(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`name`"), nil, envelope.InputError)
 	}
 
-	if err := app.businessHours.Create(businessHours.Name, businessHours.Description, businessHours.IsAlwaysOpen, businessHours.Hours, businessHours.Holidays); err != nil {
+	createdBusinessHours, err := app.businessHours.Create(businessHours.Name, businessHours.Description, businessHours.IsAlwaysOpen, businessHours.Hours, businessHours.Holidays)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(createdBusinessHours)
 }
 
 // handleDeleteBusinessHour deletes the business hour with the given id.
@@ -93,8 +94,9 @@ func handleUpdateBusinessHours(r *fastglue.Request) error {
 	if businessHours.Name == "" {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`name`"), nil, envelope.InputError)
 	}
-	if err := app.businessHours.Update(id, businessHours.Name, businessHours.Description, businessHours.IsAlwaysOpen, businessHours.Hours, businessHours.Holidays); err != nil {
+	updatedBusinessHours, err := app.businessHours.Update(id, businessHours.Name, businessHours.Description, businessHours.IsAlwaysOpen, businessHours.Hours, businessHours.Holidays)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(updatedBusinessHours)
 }

cmd/config.go

@@ -0,0 +1,63 @@
+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])
 	}
-	phoneNumberCallingCode := ""
+	phoneNumberCountryCode := ""
-	if v, ok := form.Value["phone_number_calling_code"]; ok && len(v) > 0 {
+	if v, ok := form.Value["phone_number_country_code"]; ok && len(v) > 0 {
-		phoneNumberCallingCode = string(v[0])
+		phoneNumberCountryCode = 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 phoneNumberCallingCode == "null" {
+	if phoneNumberCountryCode == "null" {
-		phoneNumberCallingCode = ""
+		phoneNumberCountryCode = ""
 	}
 	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 != ""),
-		PhoneNumberCallingCode: null.NewString(phoneNumberCallingCode, phoneNumberCallingCode != ""),
+		PhoneNumberCountryCode: null.NewString(phoneNumberCountryCode, phoneNumberCountryCode != ""),
 	}
 
 	if err := app.user.UpdateContact(id, contactToUpdate); err != nil {
@@ -164,11 +164,17 @@ 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)
 		}
 	}
-	return r.SendEnvelope(true)
+
+	// Refetch contact and return it
+	contact, err = app.user.GetContact(id, "")
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(contact)
 }
 
 // handleGetContactNotes returns all notes for a contact.
@@ -195,18 +201,21 @@ 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)
 	}
-	if err := app.user.CreateNote(contactID, auser.ID, req.Note); err != nil {
+	n, err := app.user.CreateNote(contactID, auser.ID, req.Note)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(true)
+	n, err = app.user.GetNote(n.ID)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(n)
 }
 
 // handleDeleteContactNote deletes a note for a contact.
@@ -240,6 +249,8 @@ 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)
 	}
@@ -251,6 +262,7 @@ 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{}
 	)
 
@@ -262,8 +274,15 @@ 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)
 	}
-	return r.SendEnvelope(true)
+
+	contact, err := app.user.GetContact(contactID, "")
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(contact)
 }

cmd/conversation.go

@@ -49,6 +49,7 @@ 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.
@@ -273,8 +274,8 @@ func handleGetConversation(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 
-	prev, _ := app.conversation.GetContactConversations(conv.ContactID)
+	prev, _ := app.conversation.GetContactPreviousConversations(conv.ContactID, 10)
-	conv.PreviousConversations = filterCurrentConv(prev, conv.UUID)
+	conv.PreviousConversations = filterCurrentPreviousConv(prev, conv.UUID)
 	return r.SendEnvelope(conv)
 }
 
@@ -649,14 +650,14 @@ func handleRemoveTeamAssignee(r *fastglue.Request) error {
 	return r.SendEnvelope(true)
 }
 
-// filterCurrentConv removes the current conversation from the list of conversations.
+// filterCurrentPreviousConv removes the current conversation from the list of previous conversations.
-func filterCurrentConv(convs []cmodels.Conversation, uuid string) []cmodels.Conversation {
+func filterCurrentPreviousConv(convs []cmodels.PreviousConversation, uuid string) []cmodels.PreviousConversation {
 	for i, c := range convs {
 		if c.UUID == uuid {
 			return append(convs[:i], convs[i+1:]...)
 		}
 	}
-	return []cmodels.Conversation{}
+	return []cmodels.PreviousConversation{}
 }
 
 // handleCreateConversation creates a new conversation and sends a message to it.
@@ -672,39 +673,17 @@ 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)
-	}
-
 	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),
@@ -717,7 +696,7 @@ func handleCreateConversation(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.Ts("globals.messages.errorCreating", "name", "{globals.terms.contact}"), nil))
 	}
 
-	// Create conversation
+	// Create conversation first.
 	conversationID, conversationUUID, err := app.conversation.CreateConversation(
 		contact.ID,
 		contact.ContactChannelID,
@@ -725,14 +704,14 @@ func handleCreateConversation(r *fastglue.Request) error {
 		"",         /** 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))
 	}
 
-	// Prepare attachments.
+	// Get media for the attachment ids.
 	var media = make([]medModels.Media, 0, len(req.Attachments))
 	for _, id := range req.Attachments {
 		m, err := app.media.Get(id, "")
@@ -743,13 +722,29 @@ func handleCreateConversation(r *fastglue.Request) error {
 		media = append(media, m)
 	}
 
-	// Send reply to the created conversation.
+	// Send initial message based on the initiator of conversation.
-	if err := app.conversation.SendReply(media, req.InboxID, auser.ID /**sender_id**/, conversationUUID, req.Content, to, nil /**cc**/, nil /**bcc**/, map[string]any{} /**meta**/); err != nil {
+	switch req.Initiator {
-		// Delete the conversation if reply fails.
+	case umodels.UserTypeAgent:
-		if err := app.conversation.DeleteConversation(conversationUUID); err != nil {
+		// Queue reply.
-			app.lo.Error("error deleting conversation", "error", err)
+		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))
 		}
-		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.Ts("globals.messages.errorSending", "name", "{globals.terms.message}"), nil))
+	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)
 	}
 
 	// Assign the conversation to the agent or team.
@@ -768,3 +763,36 @@ 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

@@ -6,6 +6,10 @@ import (
 	"github.com/zerodha/fastglue"
 )
 
+const (
+	maxCsatFeedbackLength = 1000
+)
+
 // handleShowCSAT renders the CSAT page for a given csat.
 func handleShowCSAT(r *fastglue.Request) error {
 	var (
@@ -17,7 +21,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": "Page not found",
+				"ErrorMessage": app.i18n.T("globals.messages.pageNotFound"),
 			},
 		})
 	}
@@ -25,8 +29,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":   "Thank you!",
+				"Title":   app.i18n.T("globals.messages.thankYou"),
-				"Message": "We appreciate you taking the time to submit your feedback.",
+				"Message": app.i18n.T("csat.thankYouMessage"),
 			},
 		})
 	}
@@ -35,14 +39,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": "Page not found",
+				"ErrorMessage": app.i18n.T("globals.messages.pageNotFound"),
 			},
 		})
 	}
 
 	return app.tmpl.RenderWebPage(r.RequestCtx, "csat", map[string]interface{}{
 		"Data": map[string]interface{}{
-			"Title":    "Rate your interaction with us",
+			"Title": app.i18n.T("csat.pageTitle"),
 			"CSAT": map[string]interface{}{
 				"UUID": csat.UUID,
 			},
@@ -67,7 +71,7 @@ func handleUpdateCSATResponse(r *fastglue.Request) error {
 	if err != nil {
 		return app.tmpl.RenderWebPage(r.RequestCtx, "error", map[string]interface{}{
 			"Data": map[string]interface{}{
-				"ErrorMessage": "Invalid `rating`",
+				"ErrorMessage": app.i18n.T("globals.messages.somethingWentWrong"),
 			},
 		})
 	}
@@ -75,7 +79,7 @@ func handleUpdateCSATResponse(r *fastglue.Request) error {
 	if ratingI < 1 || ratingI > 5 {
 		return app.tmpl.RenderWebPage(r.RequestCtx, "error", map[string]interface{}{
 			"Data": map[string]interface{}{
-				"ErrorMessage": "Invalid `rating`",
+				"ErrorMessage": app.i18n.T("globals.messages.somethingWentWrong"),
 			},
 		})
 	}
@@ -83,11 +87,16 @@ func handleUpdateCSATResponse(r *fastglue.Request) error {
 	if uuid == "" {
 		return app.tmpl.RenderWebPage(r.RequestCtx, "error", map[string]interface{}{
 			"Data": map[string]interface{}{
-				"ErrorMessage": "Invalid `uuid`",
+				"ErrorMessage": app.i18n.T("globals.messages.somethingWentWrong"),
 			},
 		})
 	}
 
+	// 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{}{
@@ -98,8 +107,8 @@ func handleUpdateCSATResponse(r *fastglue.Request) error {
 
 	return app.tmpl.RenderWebPage(r.RequestCtx, "info", map[string]interface{}{
 		"Data": map[string]interface{}{
-			"Title":   "Thank you!",
+			"Title":   app.i18n.T("globals.messages.thankYou"),
-			"Message": "We appreciate you taking the time to submit your feedback.",
+			"Message": app.i18n.T("csat.thankYouMessage"),
 		},
 	})
 }

cmd/custom_attributes.go

@@ -70,10 +70,11 @@ func handleCreateCustomAttribute(r *fastglue.Request) error {
 	if err := validateCustomAttribute(app, attribute); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	if err := app.customAttribute.Create(attribute); err != nil {
+	createdAttr, err := app.customAttribute.Create(attribute)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(createdAttr)
 }
 
 // handleUpdateCustomAttribute updates an existing custom attribute in the database.
@@ -92,10 +93,11 @@ func handleUpdateCustomAttribute(r *fastglue.Request) error {
 	if err := validateCustomAttribute(app, attribute); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	if err = app.customAttribute.Update(id, attribute); err != nil {
+	updatedAttr, err := app.customAttribute.Update(id, attribute)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(updatedAttr)
 }
 
 // handleDeleteCustomAttribute deletes a custom attribute from the database.

cmd/handlers.go

@@ -23,18 +23,20 @@ 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", handleGetGeneralSettings)
+	g.GET("/api/v1/settings/general", auth(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"))
@@ -153,7 +155,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", perm(handleGetRoles, "roles:manage"))
+	g.GET("/api/v1/roles", auth(handleGetRoles))
 	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"))

cmd/inboxes.go

@@ -17,6 +17,12 @@ 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)
 }
 
@@ -47,11 +53,12 @@ func handleCreateInbox(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), err.Error(), envelope.InputError)
 	}
 
-	if err := app.inbox.Create(inbox); err != nil {
+	createdInbox, err := app.inbox.Create(inbox)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	if err := validateInbox(app, inbox); err != nil {
+	if err := validateInbox(app, createdInbox); err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
@@ -59,7 +66,13 @@ func handleCreateInbox(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, app.i18n.Ts("globals.messages.couldNotReload", "name", "{globals.terms.inbox}"), nil, envelope.GeneralError)
 	}
 
-	return r.SendEnvelope(true)
+	// Clear passwords before returning.
+	if err := createdInbox.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(createdInbox)
 }
 
 // handleUpdateInbox updates an inbox
@@ -82,7 +95,7 @@ func handleUpdateInbox(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 
-	err = app.inbox.Update(id, inbox)
+	updatedInbox, err := app.inbox.Update(id, inbox)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
@@ -91,7 +104,13 @@ func handleUpdateInbox(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, app.i18n.Ts("globals.messages.couldNotReload", "name", "{globals.terms.inbox}"), nil, envelope.GeneralError)
 	}
 
-	return r.SendEnvelope(inbox)
+	// Clear passwords before returning.
+	if err := updatedInbox.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(updatedInbox)
 }
 
 // handleToggleInbox toggles an inbox
@@ -105,7 +124,8 @@ func handleToggleInbox(r *fastglue.Request) error {
 			app.i18n.Ts("globals.messages.invalid", "name", "`id`"), nil, envelope.InputError)
 	}
 
-	if err = app.inbox.Toggle(id); err != nil {
+	toggledInbox, err := app.inbox.Toggle(id)
+	if err != nil {
 		return err
 	}
 
@@ -113,7 +133,13 @@ func handleToggleInbox(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, app.i18n.Ts("globals.messages.couldNotReload", "name", "{globals.terms.inbox}"), nil, envelope.GeneralError)
 	}
 
-	return r.SendEnvelope(true)
+	// Clear passwords before returning
+	if err := toggledInbox.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(toggledInbox)
 }
 
 // handleDeleteInbox deletes an inbox

cmd/init.go

@@ -250,11 +250,12 @@ func initTag(db *sqlx.DB, i18n *i18n.I18n) *tag.Manager {
 }
 
 // initViews inits view manager.
-func initView(db *sqlx.DB) *view.Manager {
+func initView(db *sqlx.DB, i18n *i18n.I18n) *view.Manager {
 	var lo = initLogger("view_manager")
 	m, err := view.New(view.Opts{
-		DB: db,
+		DB:   db,
-		Lo: lo,
+		Lo:   lo,
+		I18n: i18n,
 	})
 	if err != nil {
 		log.Fatalf("error initializing view manager: %v", err)
@@ -327,7 +328,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)
+		funcMap = getTmplFuncs(consts, i18n)
 	)
 	tpls, err := stuffbin.ParseTemplatesGlob(funcMap, fs, "/static/email-templates/*.html")
 	if err != nil {
@@ -345,7 +346,7 @@ func initTemplate(db *sqlx.DB, fs stuffbin.FileSystem, consts *constants, i18n *
 }
 
 // getTmplFuncs returns the template functions.
-func getTmplFuncs(consts *constants) template.FuncMap {
+func getTmplFuncs(consts *constants, i18n *i18n.I18n) template.FuncMap {
 	return template.FuncMap{
 		"RootURL": func() string {
 			return consts.AppBaseURL
@@ -365,6 +366,9 @@ func getTmplFuncs(consts *constants) template.FuncMap {
 		"SiteName": func() string {
 			return consts.SiteName
 		},
+		"L": func() interface{} {
+			return i18n
+		},
 	}
 }
 
@@ -381,7 +385,10 @@ func reloadSettings(app *App) error {
 		app.lo.Error("error unmarshalling settings from DB", "error", err)
 		return err
 	}
-	if err := ko.Load(confmap.Provider(out, "."), nil); err != nil {
+	app.Lock()
+	err = ko.Load(confmap.Provider(out, "."), nil)
+	app.Unlock()
+	if err != nil {
 		app.lo.Error("error loading settings into koanf", "error", err)
 		return err
 	}
@@ -393,7 +400,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))
+	funcMap := getTmplFuncs(app.consts.Load().(*constants), app.i18n)
 	tpls, err := stuffbin.ParseTemplatesGlob(funcMap, app.fs, "/static/email-templates/*.html")
 	if err != nil {
 		app.lo.Error("error parsing email templates", "error", err)

cmd/login.go

@@ -3,7 +3,6 @@ package main
 import (
 	amodels "github.com/abhinavxd/libredesk/internal/auth/models"
 	"github.com/abhinavxd/libredesk/internal/envelope"
-	umodels "github.com/abhinavxd/libredesk/internal/user/models"
 	realip "github.com/ferluci/fast-realip"
 	"github.com/valyala/fasthttp"
 	"github.com/zerodha/fastglue"
@@ -42,12 +41,6 @@ func handleLogin(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, app.i18n.T("user.accountDisabled"), nil))
 	}
 
-	// Set user availability status to online.
-	if err := app.user.UpdateAvailability(user.ID, umodels.Online); err != nil {
-		return sendErrorEnvelope(r, err)
-	}
-	user.AvailabilityStatus = umodels.Online
-
 	if err := app.auth.SaveSession(amodels.User{
 		ID:        user.ID,
 		Email:     user.Email.String,

cmd/macro.go

@@ -81,11 +81,12 @@ func handleCreateMacro(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 
-	if err := app.macro.Create(macro.Name, macro.MessageContent, macro.UserID, macro.TeamID, macro.Visibility, macro.VisibleWhen, macro.Actions); err != nil {
+	createdMacro, err := app.macro.Create(macro.Name, macro.MessageContent, macro.UserID, macro.TeamID, macro.Visibility, macro.VisibleWhen, macro.Actions)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	return r.SendEnvelope(macro)
+	return r.SendEnvelope(createdMacro)
 }
 
 // handleUpdateMacro updates a macro.
@@ -109,11 +110,12 @@ func handleUpdateMacro(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 
-	if err = app.macro.Update(id, macro.Name, macro.MessageContent, macro.UserID, macro.TeamID, macro.Visibility, macro.VisibleWhen, macro.Actions); err != nil {
+	updatedMacro, err := app.macro.Update(id, macro.Name, macro.MessageContent, macro.UserID, macro.TeamID, macro.Visibility, macro.VisibleWhen, macro.Actions)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	return r.SendEnvelope(macro)
+	return r.SendEnvelope(updatedMacro)
 }
 
 // handleDeleteMacro deletes macro.

cmd/main.go

@@ -97,6 +97,8 @@ type App struct {
 
 	// 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
 }
 
@@ -239,7 +241,7 @@ func main() {
 		activityLog:     initActivityLog(db, i18n),
 		customAttribute: initCustomAttribute(db, i18n),
 		authz:           initAuthz(i18n),
-		view:            initView(db),
+		view:            initView(db, i18n),
 		report:          initReport(db, i18n),
 		csat:            initCSAT(db, i18n),
 		search:          initSearch(db, i18n),

cmd/messages.go

@@ -2,10 +2,14 @@ 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"
 )
@@ -17,6 +21,7 @@ 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.
@@ -99,7 +104,7 @@ func handleGetMessage(r *fastglue.Request) error {
 	return r.SendEnvelope(message)
 }
 
-// handleRetryMessage changes message status so it can be retried for sending.
+// handleRetryMessage changes message status to `pending`, so it's enqueued for sending.
 func handleRetryMessage(r *fastglue.Request) error {
 	var (
 		app   = r.Context.(*App)
@@ -150,7 +155,31 @@ func handleSendMessage(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil, envelope.InputError)
 	}
 
-	// Prepare attachments.
+	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)
+	}
+
+	// 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.
 	var media = make([]medModels.Media, 0, len(req.Attachments))
 	for _, id := range req.Attachments {
 		m, err := app.media.Get(id, "")
@@ -161,14 +190,28 @@ func handleSendMessage(r *fastglue.Request) error {
 		media = append(media, m)
 	}
 
-	if req.Private {
+	// Create contact message.
-		if err := app.conversation.SendPrivateNote(media, user.ID, cuuid, req.Message); err != nil {
+	if req.SenderType == umodels.UserTypeContact {
-			return sendErrorEnvelope(r, err)
+		message, err := app.conversation.CreateContactMessage(media, int(conv.ContactID), cuuid, req.Message, cmodels.ContentTypeHTML)
-		}
+		if err != nil {
-	} else {
-		if err := app.conversation.SendReply(media, conv.InboxID, user.ID, cuuid, req.Message, req.To, req.CC, req.BCC, map[string]any{} /**meta**/); err != nil {
 			return sendErrorEnvelope(r, err)
 		}
+		return r.SendEnvelope(message)
 	}
-	return r.SendEnvelope(true)
+
+	// Send private note.
+	if req.Private {
+		message, err := app.conversation.SendPrivateNote(media, user.ID, cuuid, req.Message)
+		if err != nil {
+			return sendErrorEnvelope(r, err)
+		}
+		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**/)
+	if err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope(message)
 }

cmd/oidc.go

@@ -11,16 +11,6 @@ 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)
@@ -65,7 +55,8 @@ func handleCreateOIDC(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 
-	if err := app.oidc.Create(req); err != nil {
+	createdOIDC, err := app.oidc.Create(req)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
@@ -73,7 +64,11 @@ 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)
 	}
-	return r.SendEnvelope("OIDC created successfully")
+
+	// Clear client secret before returning
+	createdOIDC.ClientSecret = strings.Repeat(stringutil.PasswordDummy, 10)
+
+	return r.SendEnvelope(createdOIDC)
 }
 
 // handleUpdateOIDC updates an OIDC record.
@@ -96,7 +91,8 @@ func handleUpdateOIDC(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 
-	if err = app.oidc.Update(id, req); err != nil {
+	updatedOIDC, err := app.oidc.Update(id, req)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
@@ -104,7 +100,11 @@ 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)
 	}
-	return r.SendEnvelope(true)
+
+	// Clear client secret before returning
+	updatedOIDC.ClientSecret = strings.Repeat(stringutil.PasswordDummy, 10)
+
+	return r.SendEnvelope(updatedOIDC)
 }
 
 // handleDeleteOIDC deletes an OIDC record.

cmd/roles.go

@@ -55,10 +55,11 @@ func handleCreateRole(r *fastglue.Request) error {
 	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 := app.role.Create(req); err != nil {
+	createdRole, err := app.role.Create(req)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(createdRole)
 }
 
 // handleUpdateRole updates a role
@@ -71,8 +72,9 @@ func handleUpdateRole(r *fastglue.Request) error {
 	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 := app.role.Update(id, req); err != nil {
+	updatedRole, err := app.role.Update(id, req)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(updatedRole)
 }

cmd/settings.go

@@ -31,6 +31,8 @@ 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)
 }
 
@@ -45,6 +47,11 @@ 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, "/")
 
@@ -55,6 +62,17 @@ 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)
 	}
@@ -109,6 +127,7 @@ 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
 	}
@@ -117,6 +136,10 @@ func handleUpdateEmailNotificationSettings(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 
-	// No reload implemented, so user has to restart the app.
+	// Email notification settings require app restart to take effect.
+	app.Lock()
+	app.restartRequired = true
+	app.Unlock()
+
 	return r.SendEnvelope(true)
 }

cmd/sla.go

@@ -54,11 +54,12 @@ func handleCreateSLA(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 
-	if err := app.sla.Create(sla.Name, sla.Description, sla.FirstResponseTime, sla.ResolutionTime, sla.NextResponseTime, sla.Notifications); err != nil {
+	createdSLA, err := app.sla.Create(sla.Name, sla.Description, sla.FirstResponseTime, sla.ResolutionTime, sla.NextResponseTime, sla.Notifications)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	return r.SendEnvelope("SLA created successfully.")
+	return r.SendEnvelope(createdSLA)
 }
 
 // handleUpdateSLA updates the SLA with the given ID.
@@ -81,11 +82,12 @@ func handleUpdateSLA(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, err)
 	}
 
-	if err := app.sla.Update(id, sla.Name, sla.Description, sla.FirstResponseTime, sla.ResolutionTime, sla.NextResponseTime, sla.Notifications); err != nil {
+	updatedSLA, err := app.sla.Update(id, sla.Name, sla.Description, sla.FirstResponseTime, sla.ResolutionTime, sla.NextResponseTime, sla.Notifications)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(updatedSLA)
 }
 
 // handleDeleteSLA deletes the SLA with the given ID.

cmd/statuses.go

@@ -33,12 +33,12 @@ func handleCreateStatus(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`name`"), nil, envelope.InputError)
 	}
 
-	err := app.status.Create(status.Name)
+	createdStatus, err := app.status.Create(status.Name)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(createdStatus)
 }
 
 func handleDeleteStatus(r *fastglue.Request) error {
@@ -74,10 +74,10 @@ func handleUpdateStatus(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`name`"), nil, envelope.InputError)
 	}
 
-	err = app.status.Update(id, status.Name)
+	updatedStatus, err := app.status.Update(id, status.Name)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(updatedStatus)
 }

cmd/tags.go

@@ -35,11 +35,12 @@ func handleCreateTag(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`name`"), nil, envelope.InputError)
 	}
 
-	if err := app.tag.Create(tag.Name); err != nil {
+	createdTag, err := app.tag.Create(tag.Name)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(createdTag)
 }
 
 // handleDeleteTag deletes a tag from the database.
@@ -78,9 +79,10 @@ func handleUpdateTag(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`name`"), nil, envelope.InputError)
 	}
 
-	if err = app.tag.Update(id, tag.Name); err != nil {
+	updatedTag, err := app.tag.Update(id, tag.Name)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(updatedTag)
 }

cmd/teams.go

@@ -60,10 +60,11 @@ func handleCreateTeam(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil))
 	}
 
-	if err := app.team.Create(req.Name, req.Timezone, req.ConversationAssignmentType, req.BusinessHoursID, req.SLAPolicyID, req.Emoji.String, req.MaxAutoAssignedConversations); err != nil {
+	createdTeam, err := app.team.Create(req.Name, req.Timezone, req.ConversationAssignmentType, req.BusinessHoursID, req.SLAPolicyID, req.Emoji.String, req.MaxAutoAssignedConversations)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(createdTeam)
 }
 
 // handleUpdateTeam updates an existing team.
@@ -82,10 +83,11 @@ func handleUpdateTeam(r *fastglue.Request) error {
 		return sendErrorEnvelope(r, envelope.NewError(envelope.InputError, app.i18n.Ts("globals.messages.errorParsing", "name", "{globals.terms.request}"), nil))
 	}
 
-	if err := app.team.Update(id, req.Name, req.Timezone, req.ConversationAssignmentType, req.BusinessHoursID, req.SLAPolicyID, req.Emoji.String, req.MaxAutoAssignedConversations); err != nil {
+	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)
 	}
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(updatedTeam)
 }
 
 // handleDeleteTeam deletes a team

cmd/templates.go

@@ -53,10 +53,11 @@ func handleCreateTemplate(r *fastglue.Request) error {
 	if req.Name == "" {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`name`"), nil, envelope.InputError)
 	}
-	if err := app.tmpl.Create(req); err != nil {
+	template, err := app.tmpl.Create(req)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(template)
 }
 
 // handleUpdateTemplate updates a template.
@@ -76,10 +77,11 @@ func handleUpdateTemplate(r *fastglue.Request) error {
 	if req.Name == "" {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`name`"), nil, envelope.InputError)
 	}
-	if err = app.tmpl.Update(id, req); err != nil {
+	updatedTemplate, err := app.tmpl.Update(id, req)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(updatedTemplate)
 }
 
 // handleDeleteTemplate deletes a template.

cmd/upgrade.go

@@ -35,6 +35,7 @@ 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},
 }
 
 // upgrade upgrades the database to the current version by running SQL migration files

cmd/users.go

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

@@ -47,10 +47,11 @@ func handleCreateUserView(r *fastglue.Request) error {
 	if string(view.Filters) == "" {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.empty", "name", "`Filters`"), nil, envelope.InputError)
 	}
-	if err := app.view.Create(view.Name, view.Filters, user.ID); err != nil {
+	createdView, err := app.view.Create(view.Name, view.Filters, user.ID)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(createdView)
 }
 
 // handleDeleteUserView deletes a view for a user.
@@ -111,8 +112,9 @@ func handleUpdateUserView(r *fastglue.Request) error {
 	if v.UserID != user.ID {
 		return r.SendErrorEnvelope(fasthttp.StatusForbidden, app.i18n.Ts("globals.messages.denied", "name", "{globals.terms.permission}"), nil, envelope.PermissionError)
 	}
-	if err = app.view.Update(id, view.Name, view.Filters); err != nil {
+	updatedView, err := app.view.Update(id, view.Name, view.Filters)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
-	return r.SendEnvelope(true)
+	return r.SendEnvelope(updatedView)
 }

cmd/webhooks.go

@@ -67,12 +67,15 @@ func handleCreateWebhook(r *fastglue.Request) error {
 		return r.SendEnvelope(err)
 	}
 
-	_, err := app.webhook.Create(webhook)
+	webhook, err := app.webhook.Create(webhook)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	return r.SendEnvelope(true)
+	// Clear secret before returning
+	webhook.Secret = strings.Repeat(stringutil.PasswordDummy, 10)
+
+	return r.SendEnvelope(webhook)
 }
 
 // handleUpdateWebhook updates an existing webhook in the database.
@@ -105,11 +108,15 @@ func handleUpdateWebhook(r *fastglue.Request) error {
 		webhook.Secret = existingWebhook.Secret
 	}
 
-	if err := app.webhook.Update(id, webhook); err != nil {
+	updatedWebhook, err := app.webhook.Update(id, webhook)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	return r.SendEnvelope(true)
+	// Clear secret before returning
+	updatedWebhook.Secret = strings.Repeat(stringutil.PasswordDummy, 10)
+
+	return r.SendEnvelope(updatedWebhook)
 }
 
 // handleDeleteWebhook deletes a webhook from the database.
@@ -140,11 +147,15 @@ func handleToggleWebhook(r *fastglue.Request) error {
 		return r.SendErrorEnvelope(fasthttp.StatusBadRequest, app.i18n.Ts("globals.messages.invalid", "name", "`id`"), nil, envelope.InputError)
 	}
 
-	if err := app.webhook.Toggle(id); err != nil {
+	toggledWebhook, err := app.webhook.Toggle(id)
+	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
 
-	return r.SendEnvelope(true)
+	// Clear secret before returning
+	toggledWebhook.Secret = strings.Repeat(stringutil.PasswordDummy, 10)
+
+	return r.SendEnvelope(toggledWebhook)
 }
 
 // handleTestWebhook sends a test payload to a webhook.

docs/docs/developer-setup.md

@@ -1,32 +0,0 @@
-# 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

@@ -1,17 +0,0 @@
-# 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

@@ -1,65 +0,0 @@
-# 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

@@ -1,57 +0,0 @@
-# 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

@@ -1,60 +0,0 @@
-# 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

@@ -1,3 +0,0 @@
-# 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

@@ -1,18 +0,0 @@
-# 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

@@ -1,222 +0,0 @@
-# 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 are delivered with a 10-second timeout
-- 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

@@ -1,37 +0,0 @@
-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
-  - Contributions:
-      - Developer Setup: developer-setup.md
-      - Translate Libredesk: translations.md

frontend/cypress/e2e/testLogin.cy.js

@@ -2,23 +2,33 @@
 
 describe('Login Component', () => {
     beforeEach(() => {
-        // Visit the login page
-        cy.visit('/')
-
         // Mock the API response for OIDC providers
-        cy.intercept('GET', '**/api/v1/oidc/enabled', {
+        cy.intercept('GET', '**/api/v1/config', {
             statusCode: 200,
             body: {
-                data: [
+                data: {
-                    {
+                    "app.favicon_url": "http://localhost:9000/favicon.ico",
-                        id: 1,
+                    "app.lang": "en",
-                        name: 'Google',
+                    "app.logo_url": "http://localhost:9000/logo.png",
-                        logo_url: 'https://example.com/google-logo.png',
+                    "app.site_name": "Libredesk",
-                        disabled: false
+                    "app.sso_providers": [
-                    }
+                        {
-                ]
+                            "client_id": "xx",
+                            "enabled": true,
+                            "id": 1,
+                            "logo_url": "/images/google-logo.png",
+                            "name": "Google",
+                            "provider": "Google",
+                            "provider_url": "https://accounts.google.com",
+                            "redirect_uri": "http://localhost:9000/api/v1/oidc/1/finish"
+                        }
+                    ]
+                }
             }
         }).as('getOIDCProviders')
+
+        // Visit the login page
+        cy.visit('/')
     })
 
     it('should display login form', () => {

frontend/package.json

@@ -18,6 +18,8 @@
     "format": "prettier --write src/"
   },
   "dependencies": {
+    "@codemirror/lang-html": "^6.4.9",
+    "@codemirror/theme-one-dark": "^6.1.3",
     "@formkit/auto-animate": "^0.8.2",
     "@internationalized/date": "^3.5.5",
     "@radix-icons/vue": "^1.0.0",
@@ -40,7 +42,7 @@
     "axios": "^1.8.2",
     "class-variance-authority": "^0.7.0",
     "clsx": "^2.1.1",
-    "codeflask": "^1.4.1",
+    "codemirror": "^6.0.2",
     "date-fns": "^3.6.0",
     "lucide-vue-next": "^0.378.0",
     "mitt": "^3.0.1",

frontend/pnpm-lock.yaml

@@ -8,6 +8,12 @@ importers:
 
   .:
     dependencies:
+      '@codemirror/lang-html':
+        specifier: ^6.4.9
+        version: 6.4.9
+      '@codemirror/theme-one-dark':
+        specifier: ^6.1.3
+        version: 6.1.3
       '@formkit/auto-animate':
         specifier: ^0.8.2
         version: 0.8.2
@@ -74,9 +80,9 @@ importers:
       clsx:
         specifier: ^2.1.1
         version: 2.1.1
-      codeflask:
+      codemirror:
-        specifier: ^1.4.1
+        specifier: ^6.0.2
-        version: 1.4.1
+        version: 6.0.2
       date-fns:
         specifier: ^3.6.0
         version: 3.6.0
@@ -234,6 +240,39 @@ packages:
   '@bassist/utils@0.4.0':
     resolution: {integrity: sha512-aoFTl0jUjm8/tDZodP41wnEkvB+C5O9NFCuYN/ztL6jSUSsuBkXq90/1ifBm1XhV/zySHgLYlU1+tgo3XtQ+nA==}
 
+  '@codemirror/autocomplete@6.18.6':
+    resolution: {integrity: sha512-PHHBXFomUs5DF+9tCOM/UoW6XQ4R44lLNNhRaW9PKPTU0D7lIjRg3ElxaJnTwsl/oHiR93WSXDBrekhoUGCPtg==}
+
+  '@codemirror/commands@6.8.1':
+    resolution: {integrity: sha512-KlGVYufHMQzxbdQONiLyGQDUW0itrLZwq3CcY7xpv9ZLRHqzkBSoteocBHtMCoY7/Ci4xhzSrToIeLg7FxHuaw==}
+
+  '@codemirror/lang-css@6.3.1':
+    resolution: {integrity: sha512-kr5fwBGiGtmz6l0LSJIbno9QrifNMUusivHbnA1H6Dmqy4HZFte3UAICix1VuKo0lMPKQr2rqB+0BkKi/S3Ejg==}
+
+  '@codemirror/lang-html@6.4.9':
+    resolution: {integrity: sha512-aQv37pIMSlueybId/2PVSP6NPnmurFDVmZwzc7jszd2KAF8qd4VBbvNYPXWQq90WIARjsdVkPbw29pszmHws3Q==}
+
+  '@codemirror/lang-javascript@6.2.4':
+    resolution: {integrity: sha512-0WVmhp1QOqZ4Rt6GlVGwKJN3KW7Xh4H2q8ZZNGZaP6lRdxXJzmjm4FqvmOojVj6khWJHIb9sp7U/72W7xQgqAA==}
+
+  '@codemirror/language@6.11.1':
+    resolution: {integrity: sha512-5kS1U7emOGV84vxC+ruBty5sUgcD0te6dyupyRVG2zaSjhTDM73LhVKUtVwiqSe6QwmEoA4SCiU8AKPFyumAWQ==}
+
+  '@codemirror/lint@6.8.5':
+    resolution: {integrity: sha512-s3n3KisH7dx3vsoeGMxsbRAgKe4O1vbrnKBClm99PU0fWxmxsx5rR2PfqQgIt+2MMJBHbiJ5rfIdLYfB9NNvsA==}
+
+  '@codemirror/search@6.5.11':
+    resolution: {integrity: sha512-KmWepDE6jUdL6n8cAAqIpRmLPBZ5ZKnicE8oGU/s3QrAVID+0VhLFrzUucVKHG5035/BSykhExDL/Xm7dHthiA==}
+
+  '@codemirror/state@6.5.2':
+    resolution: {integrity: sha512-FVqsPqtPWKVVL3dPSxy8wEF/ymIEuVzF1PK3VbUgrxXpJUSHQWWZz4JMToquRxnkw+36LTamCZG2iua2Ptq0fA==}
+
+  '@codemirror/theme-one-dark@6.1.3':
+    resolution: {integrity: sha512-NzBdIvEJmx6fjeremiGp3t/okrLPYT0d9orIc7AFun8oZcRk58aejkqhv6spnz4MLAevrKNPMQYXEWMg4s+sKA==}
+
+  '@codemirror/view@6.37.2':
+    resolution: {integrity: sha512-XD3LdgQpxQs5jhOOZ2HRVT+Rj59O4Suc7g2ULvZ+Yi8eCkickrkZ5JFuoDhs2ST1mNI5zSsNYgR3NGa4OUrbnw==}
+
   '@colors/colors@1.5.0':
     resolution: {integrity: sha512-ooWCrlZP11i8GImSjTHYHLkvFDP48nS4+204nGb1RiX/WXYHmJA2III9/e2DWVabCESdW7hBAEzHRqUn9OUVvQ==}
     engines: {node: '>=0.1.90'}
@@ -508,6 +547,24 @@ packages:
   '@juggle/resize-observer@3.4.0':
     resolution: {integrity: sha512-dfLbk+PwWvFzSxwk3n5ySL0hfBog779o8h68wK/7/APo/7cgyWp5jcXockbxdk5kFRkbeXWm4Fbi9FrdN381sA==}
 
+  '@lezer/common@1.2.3':
+    resolution: {integrity: sha512-w7ojc8ejBqr2REPsWxJjrMFsA/ysDCFICn8zEOR9mrqzOu2amhITYuLD8ag6XZf0CFXDrhKqw7+tW8cX66NaDA==}
+
+  '@lezer/css@1.2.1':
+    resolution: {integrity: sha512-2F5tOqzKEKbCUNraIXc0f6HKeyKlmMWJnBB0i4XW6dJgssrZO/YlZ2pY5xgyqDleqqhiNJ3dQhbrV2aClZQMvg==}
+
+  '@lezer/highlight@1.2.1':
+    resolution: {integrity: sha512-Z5duk4RN/3zuVO7Jq0pGLJ3qynpxUVsh7IbUbGj88+uV2ApSAn6kWg2au3iJb+0Zi7kKtqffIESgNcRXWZWmSA==}
+
+  '@lezer/html@1.3.10':
+    resolution: {integrity: sha512-dqpT8nISx/p9Do3AchvYGV3qYc4/rKr3IBZxlHmpIKam56P47RSHkSF5f13Vu9hebS1jM0HmtJIwLbWz1VIY6w==}
+
+  '@lezer/javascript@1.5.1':
+    resolution: {integrity: sha512-ATOImjeVJuvgm3JQ/bpo2Tmv55HSScE2MTPnKRMRIPx2cLhHGyX2VnqpHhtIV1tVzIjZDbcWQm+NCTF40ggZVw==}
+
+  '@lezer/lr@1.4.2':
+    resolution: {integrity: sha512-pu0K1jCIdnQ12aWNaAVU5bzi7Bd1w54J3ECgANPmYLtQKP0HBj2cE/5coBD66MT10xbtIuUr7tg0Shbsvk0mDA==}
+
   '@mapbox/geojson-rewind@0.5.2':
     resolution: {integrity: sha512-tJaT+RbYGJYStt7wI3cq4Nl4SXxG8W7JDG5DMJu97V25RnbNg3QtQtf+KD+VLjNpWKYsRvXDNmNrBgEETr1ifA==}
     hasBin: true
@@ -535,6 +592,9 @@ packages:
     resolution: {integrity: sha512-Es6WcD0nO5l+2BOQS4uLfNPYQaNDfbot3X1XUoloz+x0mPDS3eeORZJl06HXjwBG1fOGwCRnzK88LMdxKRrd6Q==}
     engines: {node: '>=6.0.0'}
 
+  '@marijn/find-cluster-break@1.0.2':
+    resolution: {integrity: sha512-l0h88YhZFyKdXIFNfSWpyjStDjGHwZ/U7iobcK1cQQD8sejsONdQtTVU+1wVN1PBw40PiiHB1vA5S7VTfQiP9g==}
+
   '@nodelib/fs.scandir@2.1.5':
     resolution: {integrity: sha512-vq24Bq3ym5HEQm2NKCr3yXDwjc7vTsEThRDnkp2DK9p1uqLR+DHurm/NOTo0KG7HYHU7eppKZj3MyqYuMBf62g==}
     engines: {node: '>= 8'}
@@ -1109,9 +1169,6 @@ packages:
   '@types/pbf@3.0.5':
     resolution: {integrity: sha512-j3pOPiEcWZ34R6a6mN07mUkM4o4Lwf6hPNt8eilOeZhTFbxFXmKhvXl9Y28jotFPaI1bpPDJsbCprUoNke6OrA==}
 
-  '@types/prismjs@1.26.5':
-    resolution: {integrity: sha512-AUZTa7hQ2KY5L7AmtSiqxlhWxb4ina0yd8hNbl4TWuqnv/pFP0nDMb3YrfSBf4hJVGLh2YEIBfKaBW/9UEl6IQ==}
-
   '@types/sinonjs__fake-timers@8.1.1':
     resolution: {integrity: sha512-0kSuKjAS0TrGLJ0M/+8MaFkGsQhZpB6pxOmvS3K8FYI72K//YmdfoW9X2qPsAKh1mkwxGD5zib9s1FIFed6E8g==}
 
@@ -1532,8 +1589,8 @@ packages:
     resolution: {integrity: sha512-eYm0QWBtUrBWZWG0d386OGAw16Z995PiOVo2B7bjWSbHedGl5e0ZWaq65kOGgUSNesEIDkB9ISbTg/JK9dhCZA==}
     engines: {node: '>=6'}
 
-  codeflask@1.4.1:
+  codemirror@6.0.2:
-    resolution: {integrity: sha512-4vb2IbE/iwvP0Uubhd2ixVeysm3KNC2pl7SoDaisxq1juhZzvap3qbaX7B2CtpQVvv5V9sjcQK8hO0eTcY0V9Q==}
+    resolution: {integrity: sha512-VhydHotNW5w1UGK0Qj96BwSk/Zqbp9WbnyK2W/eVMv4QyF41INRGpjUhFJY7/uDNuudSc33a/PKr4iDqRduvHw==}
 
   color-convert@2.0.1:
     resolution: {integrity: sha512-RRECPsj7iu/xb5oKYcsFHSppFNnsj/52OVTRKb4zP5onXwVF3zVmmToNcOfGC+CRDpfK/U584fMg38ZHCaElKQ==}
@@ -2780,10 +2837,6 @@ packages:
     resolution: {integrity: sha512-FFw039TmrBqFK8ma/7OL3sDz/VytdtJr044/QUJtH0wK9lb9jLq9tJyIxUwtQJHwar2BqtiA4iCWSwo9JLkzFg==}
     engines: {node: '>=6'}
 
-  prismjs@1.29.0:
-    resolution: {integrity: sha512-Kx/1w86q/epKcmte75LNrEoT+lX8pBpavuAbvJWRXar7Hz8jrtF+e3vY751p0R8H9HdArwaCTNDDzHg/ScJK1Q==}
-    engines: {node: '>=6'}
-
   process@0.11.10:
     resolution: {integrity: sha512-cdGef/drWFoydD1JsMzuFf8100nZl+GT+yacc2bEced5f9Rjk4z+WtFUTBu9PhOi9j/jfmBPu0mMEY4wIdAF8A==}
     engines: {node: '>= 0.6.0'}
@@ -3093,6 +3146,9 @@ packages:
   striptags@3.2.0:
     resolution: {integrity: sha512-g45ZOGzHDMe2bdYMdIvdAfCQkCTDMGBazSw1ypMowwGIee7ZQ5dU0rBJ8Jqgl+jAKIv4dbeE1jscZq9wid1Tkw==}
 
+  style-mod@4.1.2:
+    resolution: {integrity: sha512-wnD1HyVqpJUI2+eKZ+eo1UwghftP6yuFheBqqe+bWCotBjC2K1YnteJILRMs3SM4V/0dLEW1SC27MWP5y+mwmw==}
+
   stylis@4.2.0:
     resolution: {integrity: sha512-Orov6g6BB1sDfYgzWfTHDOxamtX1bE/zo104Dh9e6fqJ3PooipYyfJ0pUmrZO2wAvO8YbEyeFrkV91XTsGMSrw==}
 
@@ -3550,6 +3606,89 @@ snapshots:
     dependencies:
       '@withtypes/mime': 0.1.2
 
+  '@codemirror/autocomplete@6.18.6':
+    dependencies:
+      '@codemirror/language': 6.11.1
+      '@codemirror/state': 6.5.2
+      '@codemirror/view': 6.37.2
+      '@lezer/common': 1.2.3
+
+  '@codemirror/commands@6.8.1':
+    dependencies:
+      '@codemirror/language': 6.11.1
+      '@codemirror/state': 6.5.2
+      '@codemirror/view': 6.37.2
+      '@lezer/common': 1.2.3
+
+  '@codemirror/lang-css@6.3.1':
+    dependencies:
+      '@codemirror/autocomplete': 6.18.6
+      '@codemirror/language': 6.11.1
+      '@codemirror/state': 6.5.2
+      '@lezer/common': 1.2.3
+      '@lezer/css': 1.2.1
+
+  '@codemirror/lang-html@6.4.9':
+    dependencies:
+      '@codemirror/autocomplete': 6.18.6
+      '@codemirror/lang-css': 6.3.1
+      '@codemirror/lang-javascript': 6.2.4
+      '@codemirror/language': 6.11.1
+      '@codemirror/state': 6.5.2
+      '@codemirror/view': 6.37.2
+      '@lezer/common': 1.2.3
+      '@lezer/css': 1.2.1
+      '@lezer/html': 1.3.10
+
+  '@codemirror/lang-javascript@6.2.4':
+    dependencies:
+      '@codemirror/autocomplete': 6.18.6
+      '@codemirror/language': 6.11.1
+      '@codemirror/lint': 6.8.5
+      '@codemirror/state': 6.5.2
+      '@codemirror/view': 6.37.2
+      '@lezer/common': 1.2.3
+      '@lezer/javascript': 1.5.1
+
+  '@codemirror/language@6.11.1':
+    dependencies:
+      '@codemirror/state': 6.5.2
+      '@codemirror/view': 6.37.2
+      '@lezer/common': 1.2.3
+      '@lezer/highlight': 1.2.1
+      '@lezer/lr': 1.4.2
+      style-mod: 4.1.2
+
+  '@codemirror/lint@6.8.5':
+    dependencies:
+      '@codemirror/state': 6.5.2
+      '@codemirror/view': 6.37.2
+      crelt: 1.0.6
+
+  '@codemirror/search@6.5.11':
+    dependencies:
+      '@codemirror/state': 6.5.2
+      '@codemirror/view': 6.37.2
+      crelt: 1.0.6
+
+  '@codemirror/state@6.5.2':
+    dependencies:
+      '@marijn/find-cluster-break': 1.0.2
+
+  '@codemirror/theme-one-dark@6.1.3':
+    dependencies:
+      '@codemirror/language': 6.11.1
+      '@codemirror/state': 6.5.2
+      '@codemirror/view': 6.37.2
+      '@lezer/highlight': 1.2.1
+
+  '@codemirror/view@6.37.2':
+    dependencies:
+      '@codemirror/state': 6.5.2
+      crelt: 1.0.6
+      style-mod: 4.1.2
+      w3c-keyname: 2.2.8
+
   '@colors/colors@1.5.0':
     optional: true
 
@@ -3815,6 +3954,34 @@ snapshots:
 
   '@juggle/resize-observer@3.4.0': {}
 
+  '@lezer/common@1.2.3': {}
+
+  '@lezer/css@1.2.1':
+    dependencies:
+      '@lezer/common': 1.2.3
+      '@lezer/highlight': 1.2.1
+      '@lezer/lr': 1.4.2
+
+  '@lezer/highlight@1.2.1':
+    dependencies:
+      '@lezer/common': 1.2.3
+
+  '@lezer/html@1.3.10':
+    dependencies:
+      '@lezer/common': 1.2.3
+      '@lezer/highlight': 1.2.1
+      '@lezer/lr': 1.4.2
+
+  '@lezer/javascript@1.5.1':
+    dependencies:
+      '@lezer/common': 1.2.3
+      '@lezer/highlight': 1.2.1
+      '@lezer/lr': 1.4.2
+
+  '@lezer/lr@1.4.2':
+    dependencies:
+      '@lezer/common': 1.2.3
+
   '@mapbox/geojson-rewind@0.5.2':
     dependencies:
       get-stream: 6.0.1
@@ -3836,6 +4003,8 @@ snapshots:
 
   '@mapbox/whoots-js@3.1.0': {}
 
+  '@marijn/find-cluster-break@1.0.2': {}
+
   '@nodelib/fs.scandir@2.1.5':
     dependencies:
       '@nodelib/fs.stat': 2.0.5
@@ -4378,8 +4547,6 @@ snapshots:
 
   '@types/pbf@3.0.5': {}
 
-  '@types/prismjs@1.26.5': {}
-
   '@types/sinonjs__fake-timers@8.1.1': {}
 
   '@types/sizzle@2.3.9': {}
@@ -4906,10 +5073,15 @@ snapshots:
 
   clsx@2.1.1: {}
 
-  codeflask@1.4.1:
+  codemirror@6.0.2:
     dependencies:
-      '@types/prismjs': 1.26.5
+      '@codemirror/autocomplete': 6.18.6
-      prismjs: 1.29.0
+      '@codemirror/commands': 6.8.1
+      '@codemirror/language': 6.11.1
+      '@codemirror/lint': 6.8.5
+      '@codemirror/search': 6.5.11
+      '@codemirror/state': 6.5.2
+      '@codemirror/view': 6.37.2
 
   color-convert@2.0.1:
     dependencies:
@@ -6200,8 +6372,6 @@ snapshots:
 
   pretty-bytes@5.6.0: {}
 
-  prismjs@1.29.0: {}
-
   process@0.11.10: {}
 
   prosemirror-changeset@2.2.1:
@@ -6601,6 +6771,8 @@ snapshots:
 
   striptags@3.2.0: {}
 
+  style-mod@4.1.2: {}
+
   stylis@4.2.0: {}
 
   stylus@0.57.0:

frontend/src/App.vue

@@ -88,8 +88,8 @@
         @create-conversation="() => (openCreateConversationDialog = true)"
       >
         <div class="flex flex-col h-screen">
-          <!-- Show app update only in admin routes -->
+          <!-- Show admin banner only in admin routes -->
-          <AppUpdate v-if="route.path.startsWith('/admin')" />
+          <AdminBanner v-if="route.path.startsWith('/admin')" />
 
           <!-- Common header for all pages -->
           <PageHeader />
@@ -128,7 +128,7 @@ 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 AppUpdate from '@/components/update/AppUpdate.vue'
+import AdminBanner from '@/components/banner/AdminBanner.vue'
 import api from '@/api'
 import { toast as sooner } from 'vue-sonner'
 import Sidebar from '@/components/sidebar/Sidebar.vue'

frontend/src/api/index.js

@@ -122,7 +122,7 @@ const createOIDC = (data) =>
       'Content-Type': 'application/json'
     }
   })
-const getAllEnabledOIDC = () => http.get('/api/v1/oidc/enabled')
+const getConfig = () => http.get('/api/v1/config')
 const getAllOIDC = () => http.get('/api/v1/oidc')
 const getOIDC = (id) => http.get(`/api/v1/oidc/${id}`)
 const updateOIDC = (id, data) =>
@@ -514,7 +514,7 @@ export default {
   updateSettings,
   createOIDC,
   getAllOIDC,
-  getAllEnabledOIDC,
+  getConfig,
   getOIDC,
   updateOIDC,
   deleteOIDC,

frontend/src/assets/styles/main.scss

@@ -137,10 +137,10 @@
     --background: 240 5.9% 10%;
     --foreground: 0 0% 98%;
 
-    --card: 240 10% 3.9%;
+    --card: 240 5.9% 10%;
     --card-foreground: 0 0% 98%;
 
-    --popover: 240 10% 3.9%;
+    --popover: 240 5.9% 10%;
     --popover-foreground: 0 0% 98%;
 
     --primary: 0 0% 98%;
@@ -184,6 +184,10 @@
   @apply border shadow rounded;
 }
 
+.loading-fade {
+  @apply opacity-50 transition-opacity duration-300
+}
+
 // Scrollbar start
 ::-webkit-scrollbar {
   width: 8px; /* Adjust width */
@@ -207,10 +211,6 @@
 }
 // End Scrollbar
 
-.code-editor {
-  @apply rounded border shadow h-[65vh] min-h-[250px] w-full relative;
-}
-
 .show-quoted-text {
   blockquote {
     @apply block;

frontend/src/components/banner/AdminBanner.vue

@@ -0,0 +1,63 @@
+<template>
+  <div class="border-b">
+    <!-- Update notification -->
+    <div
+      v-if="appSettingsStore.settings['app.update']?.update?.is_new"
+      class="px-4 py-2.5 border-b border-border/50 last:border-b-0"
+    >
+      <div class="flex items-center gap-3">
+        <div class="flex-shrink-0">
+          <Download class="w-5 h-5 text-primary" />
+        </div>
+        <div class="min-w-0 flex-1">
+          <div class="flex items-center gap-2 text-sm text-foreground">
+            <span>{{ $t('update.newUpdateAvailable') }}</span>
+            <a
+              :href="appSettingsStore.settings['app.update'].update.url"
+              target="_blank"
+              rel="nofollow noreferrer"
+              class="font-semibold text-primary hover:text-primary/80 underline transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-1"
+            >
+              {{ appSettingsStore.settings['app.update'].update.release_version }}
+            </a>
+            <span class="text-muted-foreground">•</span>
+            <span class="text-muted-foreground">
+              {{ appSettingsStore.settings['app.update'].update.release_date }}
+            </span>
+          </div>
+
+          <!-- Update description -->
+          <div
+            v-if="appSettingsStore.settings['app.update'].update.description"
+            class="mt-2 text-xs text-muted-foreground"
+          >
+            {{ appSettingsStore.settings['app.update'].update.description }}
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- Restart required notification -->
+    <div
+      v-if="appSettingsStore.settings['app.restart_required']"
+      class="px-4 py-2.5 border-b border-border/50 last:border-b-0"
+    >
+      <div class="flex items-center gap-3">
+        <div class="flex-shrink-0">
+          <Info class="w-5 h-5 text-primary" />
+        </div>
+        <div class="min-w-0 flex-1">
+          <div class="text-sm text-foreground">
+            {{ $t('admin.banner.restartMessage') }}
+          </div>
+        </div>
+      </div>
+    </div>
+  </div>
+</template>
+
+<script setup>
+import { Download, Info } from 'lucide-vue-next'
+import { useAppSettingsStore } from '@/stores/appSettings'
+const appSettingsStore = useAppSettingsStore()
+</script>

frontend/src/components/button/CloseButton.vue

@@ -1,7 +1,7 @@
 <template>
   <Button
     variant="ghost"
-    @click.prevent="onClose"
+    @click.stop="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"
   >

frontend/src/components/editor/CodeEditor.vue

@@ -1,10 +1,13 @@
 <template>
-    <div ref="codeEditor" id="code-editor" class="code-editor" />
+    <div ref="codeEditor" @click="editorView?.focus()" class="w-full h-[28rem] border rounded-md" />
 </template>
 
 <script setup>
-import { ref, onMounted, watch, nextTick } from 'vue'
+import { ref, onMounted, watch, nextTick, useTemplateRef } from 'vue'
-import CodeFlask from 'codeflask'
+import { EditorView, basicSetup } from 'codemirror'
+import { html } from '@codemirror/lang-html'
+import { oneDark } from '@codemirror/theme-one-dark'
+import { useColorMode } from '@vueuse/core'
 
 const props = defineProps({
     modelValue: { type: String, default: '' },
@@ -13,45 +16,38 @@ const props = defineProps({
 })
 
 const emit = defineEmits(['update:modelValue'])
-const codeEditor = ref(null)
 const data = ref('')
-const flask = ref(null)
+let editorView = null 
+const codeEditor = useTemplateRef('codeEditor')
 
 const initCodeEditor = (body) => {
-    const el = document.createElement('code-flask')
+    const isDark = useColorMode().value === 'dark'
-    el.attachShadow({ mode: 'open' })
-    el.shadowRoot.innerHTML = `
-      <style>
-        .codeflask .codeflask__flatten {
-          font-size: 15px;
-          white-space: pre-wrap;
-          word-break: break-word;
-        }
-        .codeflask .codeflask__lines { background: #fafafa; z-index: 10; }
-        .codeflask .token.tag { font-weight: bold; }
-        .codeflask .token.attr-name { color: #111; }
-        .codeflask .token.attr-value { color: #000 !important; }
-      </style>
-      <div id="area"></div>
-    `
-    codeEditor.value.appendChild(el)
 
-    flask.value = new CodeFlask(el.shadowRoot.getElementById('area'), {
+    editorView = new EditorView({
-        language: props.language,
+        doc: body,
-        lineNumbers: false,
+        extensions: [
-        styleParent: el.shadowRoot,
+            basicSetup,
-        readonly: props.disabled
+            html(),
+            ...(isDark ? [oneDark] : []),
+            EditorView.editable.of(!props.disabled),
+            EditorView.theme({
+                '&': { height: '100%' },
+                '.cm-editor': { height: '100%' },
+                '.cm-scroller': { overflow: 'auto' }
+            }),
+            EditorView.updateListener.of((update) => {
+                if (!update.docChanged) return
+                const v = update.state.doc.toString()
+                emit('update:modelValue', v)
+                data.value = v
+                
+            })
+        ],
+        parent: codeEditor.value
     })
 
-    flask.value.onUpdate((v) => {
-        emit('update:modelValue', v)
-        data.value = v
-    })
-
-    flask.value.updateCode(body)
-
     nextTick(() => {
-        document.querySelector('code-flask').shadowRoot.querySelector('textarea').focus()
+        editorView?.focus()
     })
 }
 
@@ -61,7 +57,9 @@ onMounted(() => {
 
 watch(() => props.modelValue, (newVal) => {
     if (newVal !== data.value) {
-        flask.value.updateCode(newVal)
+        editorView?.dispatch({
+            changes: { from: 0, to: editorView.state.doc.length, insert: newVal }
+        })
     }
 })
 </script>

frontend/src/components/filter/FilterBuilder.vue

@@ -52,8 +52,15 @@
         <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-if="
+                v-else-if="
                   getFieldOptions(modelFilter).length > 0 &&
                   modelFilter.field === 'assigned_user_id'
                 "
@@ -94,8 +101,9 @@
       <CloseButton :onClose="() => removeFilter(index)" />
     </div>
 
+    <!-- Button Container -->
     <div class="flex items-center justify-between pt-3">
-      <Button variant="ghost" size="sm" @click="addFilter" class="text-slate-600">
+      <Button variant="ghost" size="sm" @click.stop="addFilter" class="text-slate-600">
         <Plus class="w-3 h-3 mr-1" />
         {{
           $t('globals.messages.add', {
@@ -104,15 +112,17 @@
         }}
       </Button>
       <div class="flex gap-2" v-if="showButtons">
-        <Button variant="ghost" @click="clearFilters">{{ $t('globals.messages.reset') }}</Button>
+        <Button variant="ghost" @click.stop="clearFilters">
-        <Button @click="applyFilters">{{ $t('globals.messages.apply') }}</Button>
+          {{ $t('globals.messages.reset') }}
+        </Button>
+        <Button @click.stop="applyFilters">{{ $t('globals.messages.apply') }}</Button>
       </div>
     </div>
   </div>
 </template>
 
 <script setup>
-import { computed, onMounted, watch } from 'vue'
+import { computed, onMounted, onUnmounted, watch } from 'vue'
 import {
   Select,
   SelectContent,
@@ -125,8 +135,10 @@ import { Plus } from 'lucide-vue-next'
 import { Button } from '@/components/ui/button'
 import { Input } from '@/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'
 
 const props = defineProps({
   fields: {
@@ -150,12 +162,17 @@ 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
+// Set model for each filter and the default value
 watch(
   () => modelValue.value,
   (filters) => {
@@ -163,6 +180,15 @@ 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 }
@@ -170,15 +196,20 @@ watch(
 
 // Reset operator and value when field changes for a filter at a given index
 watch(
-  () => modelValue.value.map((f) => f.field),
+  modelValue,
-  (newFields, oldFields) => {
+  (newFilters, oldFilters) => {
-    newFields.forEach((field, index) => {
+    // Skip first run
-      if (field !== oldFields[index]) {
+    if (!oldFilters) return
-        modelValue.value[index].operator = ''
+
-        modelValue.value[index].value = ''
+    newFilters.forEach((filter, index) => {
+      const oldFilter = oldFilters[index]
+      if (oldFilter && filter.field !== oldFilter.field) {
+        filter.operator = ''
+        filter.value = ''
       }
     })
-  }
+  },
+  { deep: true }
 )
 
 const addFilter = () => {
@@ -197,7 +228,17 @@ const clearFilters = () => {
 }
 
 const validFilters = computed(() => {
-  return modelValue.value.filter((filter) => filter.field && filter.operator && filter.value)
+  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
+  })
 })
 
 const getFieldOptions = (fieldValue) => {
@@ -209,4 +250,9 @@ 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/src/components/layout/MenuCard.vue

@@ -4,9 +4,9 @@
     @click="handleClick">
     <div class="flex items-center mb-2">
       <component :is="icon" size="24" class="mr-2 text-primary" />
-      <h3 class="text-lg font-medium text-gray-800">{{ title }}</h3>
+      <h3 class="text-lg font-medium">{{ title }}</h3>
     </div>
-    <p class="text-sm text-gray-600">{{ subTitle }}</p>
+    <p class="text-sm text-gray-600 dark:text-gray-400">{{ subTitle }}</p>
   </div>
 </template>
 

frontend/src/components/sidebar/Sidebar.vue

@@ -5,7 +5,7 @@ import {
   accountNavItems,
   contactNavItems
 } from '@/constants/navigation'
-import { RouterLink, useRoute } from 'vue-router'
+import { RouterLink, useRoute, useRouter } from 'vue-router'
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from '@/components/ui/collapsible'
 import {
   Sidebar,
@@ -38,19 +38,32 @@ import {
   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'
 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'
 
 defineProps({
   userTeams: { type: Array, default: () => [] },
   userViews: { type: Array, default: () => [] }
 })
 const userStore = useUserStore()
+const conversationStore = useConversationStore()
 const settingsStore = useAppSettingsStore()
 const route = useRoute()
+const router = useRouter()
 const { t } = useI18n()
 const emit = defineEmits(['createView', 'editView', 'deleteView', 'createConversation'])
 
@@ -70,8 +83,69 @@ const editView = (view) => {
   emit('editView', view)
 }
 
-const deleteView = (view) => {
+const openDeleteConfirmation = (view) => {
-  emit('deleteView', view)
+  viewToDelete.value = view
+  isDeleteOpen.value = true
+}
+
+const handleDeleteView = () => {
+  if (viewToDelete.value) {
+    emit('deleteView', viewToDelete.value)
+    isDeleteOpen.value = false
+    viewToDelete.value = null
+  }
+}
+
+// Navigation methods with conversation retention
+const navigateToInbox = (type) => {
+  if (conversationStore.hasConversationOpen && conversationStore.conversation.data?.uuid) {
+    router.push({
+      name: 'inbox-conversation',
+      params: {
+        type,
+        uuid: conversationStore.conversation.data.uuid
+      }
+    })
+  } else {
+    router.push({
+      name: 'inbox',
+      params: { type }
+    })
+  }
+}
+
+const navigateToTeamInbox = (teamID) => {
+  if (conversationStore.hasConversationOpen && conversationStore.conversation.data?.uuid) {
+    router.push({
+      name: 'team-inbox-conversation',
+      params: {
+        teamID,
+        uuid: conversationStore.conversation.data.uuid
+      }
+    })
+  } else {
+    router.push({
+      name: 'team-inbox',
+      params: { teamID }
+    })
+  }
+}
+
+const navigateToViewInbox = (viewID) => {
+  if (conversationStore.hasConversationOpen && conversationStore.conversation.data?.uuid) {
+    router.push({
+      name: 'view-inbox-conversation',
+      params: {
+        viewID,
+        uuid: conversationStore.conversation.data.uuid
+      }
+    })
+  } else {
+    router.push({
+      name: 'view-inbox',
+      params: { viewID }
+    })
+  }
 }
 
 const filteredAdminNavItems = computed(() => filterNavItems(adminNavItems, userStore.can))
@@ -102,6 +176,13 @@ 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>
@@ -322,32 +403,32 @@ const viewInboxOpen = useStorage('viewInboxOpen', true)
               </SidebarMenuItem>
               <SidebarMenuItem>
                 <SidebarMenuButton asChild :isActive="isActiveParent('/inboxes/assigned')">
-                  <router-link :to="{ name: 'inbox', params: { type: 'assigned' } }">
+                  <a href="#" @click.prevent="navigateToInbox('assigned')">
                     <User />
                     <span>{{ t('globals.terms.myInbox') }}</span>
-                  </router-link>
+                  </a>
                 </SidebarMenuButton>
               </SidebarMenuItem>
 
               <SidebarMenuItem>
                 <SidebarMenuButton asChild :isActive="isActiveParent('/inboxes/unassigned')">
-                  <router-link :to="{ name: 'inbox', params: { type: 'unassigned' } }">
+                  <a href="#" @click.prevent="navigateToInbox('unassigned')">
                     <CircleDashed />
                     <span>
                       {{ t('globals.terms.unassigned') }}
                     </span>
-                  </router-link>
+                  </a>
                 </SidebarMenuButton>
               </SidebarMenuItem>
 
               <SidebarMenuItem>
                 <SidebarMenuButton asChild :isActive="isActiveParent('/inboxes/all')">
-                  <router-link :to="{ name: 'inbox', params: { type: 'all' } }">
+                  <a href="#" @click.prevent="navigateToInbox('all')">
                     <List />
                     <span>
                       {{ t('globals.messages.all') }}
                     </span>
-                  </router-link>
+                  </a>
                 </SidebarMenuButton>
               </SidebarMenuItem>
 
@@ -380,9 +461,9 @@ const viewInboxOpen = useStorage('viewInboxOpen', true)
                           :is-active="route.params.teamID == team.id"
                           asChild
                         >
-                          <router-link :to="{ name: 'team-inbox', params: { teamID: team.id } }">
+                          <a href="#" @click.prevent="navigateToTeamInbox(team.id)">
                             {{ team.emoji }}<span>{{ team.name }}</span>
-                          </router-link>
+                          </a>
                         </SidebarMenuButton>
                       </SidebarMenuSubItem>
                     </SidebarMenuSub>
@@ -417,30 +498,41 @@ const viewInboxOpen = useStorage('viewInboxOpen', true)
 
                   <CollapsibleContent>
                     <SidebarMenuSub v-for="view in userViews" :key="view.id">
-                      <SidebarMenuSubItem>
+                      <SidebarMenuSubItem
+                        @mouseenter="hoveredViewId = view.id"
+                        @mouseleave="hoveredViewId = null"
+                      >
                         <SidebarMenuButton
                           size="sm"
                           :isActive="route.params.viewID == view.id"
                           asChild
                         >
-                          <router-link :to="{ name: 'view-inbox', params: { viewID: view.id } }">
+                          <a href="#" @click.prevent="navigateToViewInbox(view.id)">
-                            <span class="break-words w-32 truncate">{{ view.name }}</span>
+                            <span class="break-words w-32 truncate" :title="view.name">{{ view.name }}</span>
-                            <SidebarMenuAction :showOnHover="true" class="mr-3">
+                            <SidebarMenuAction
+                              @click.stop
+                              :class="[
+                                'mr-3',
+                                'md:opacity-0',
+                                'data-[state=open]:opacity-100',
+                                { 'md:opacity-100': hoveredViewId === view.id }
+                              ]"
+                            >
                               <DropdownMenu>
-                                <DropdownMenuTrigger asChild>
+                                <DropdownMenuTrigger asChild @click.prevent>
                                   <EllipsisVertical />
                                 </DropdownMenuTrigger>
                                 <DropdownMenuContent>
                                   <DropdownMenuItem @click="() => editView(view)">
                                     <span>{{ t('globals.messages.edit') }}</span>
                                   </DropdownMenuItem>
-                                  <DropdownMenuItem @click="() => deleteView(view)">
+                                  <DropdownMenuItem @click="() => openDeleteConfirmation(view)">
                                     <span>{{ t('globals.messages.delete') }}</span>
                                   </DropdownMenuItem>
                                 </DropdownMenuContent>
                               </DropdownMenu>
                             </SidebarMenuAction>
-                          </router-link>
+                          </a>
                         </SidebarMenuButton>
                       </SidebarMenuSubItem>
                     </SidebarMenuSub>
@@ -458,4 +550,22 @@ const viewInboxOpen = useStorage('viewInboxOpen', true)
       <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/src/components/ui/combobox/ComboBox.vue

@@ -8,7 +8,7 @@
         :class="['w-full justify-between', buttonClass]"
       >
         <slot name="selected" :selected="selectedItem">{{ selectedLabel }}</slot>
-        <CaretSortIcon class="ml-2 h-4 w-4 shrink-0 opacity-50" />
+        <CaretSortIcon class="h-4 w-4 shrink-0 opacity-50" />
       </Button>
     </PopoverTrigger>
     <PopoverContent class="p-0">

frontend/src/components/ui/select/SelectTag.vue

@@ -1,4 +1,5 @@
 <template>
+  <!-- idk why I named this select tag, should be named multi-select -->
   <TagsInput v-model="tags" class="px-0 gap-0" :displayValue="getLabel">
     <!-- Tags visible to the user -->
     <div class="flex gap-2 flex-wrap items-center px-3">
@@ -24,6 +25,7 @@
             @keydown.enter.prevent
             @blur="handleBlur"
             @click="open = true"
+            @input.stop
           />
         </ComboboxInput>
       </ComboboxAnchor>

frontend/src/components/update/AppUpdate.vue

@@ -1,25 +0,0 @@
-<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/src/composables/useConversationFilters.js

@@ -5,6 +5,7 @@ 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 { useI18n } from 'vue-i18n'
 
@@ -15,6 +16,7 @@ export function useConversationFilters () {
     const tStore = useTeamStore()
     const slaStore = useSlaStore()
     const customAttributeStore = useCustomAttributeStore()
+    const tagStore = useTagStore()
     const { t } = useI18n()
 
     const customAttributeDataTypeToFieldType = {
@@ -69,6 +71,12 @@ 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/src/constants/filterConfig.js

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

@@ -12,6 +12,7 @@ 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/src/constants/user.js

@@ -1 +1,3 @@
-export const Roles = ["Admin", "Agent"]
+export const Roles = ["Admin", "Agent"]
+export const UserTypeAgent = "agent"
+export const UserTypeContact = "contact"

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

@@ -418,7 +418,6 @@ 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/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 font-medium' }, row.getValue('first_name'))
+      return h('div', { class: 'text-center' }, 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 font-medium' }, row.getValue('last_name'))
+      return h('div', { class: 'text-center' }, 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 font-medium' }, row.getValue('enabled') ? t('globals.messages.yes') : t('globals.messages.no'))
+      return h('div', { class: 'text-center' }, 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 font-medium' }, row.getValue('email'))
+      return h('div', { class: 'text-center' }, row.getValue('email'))
     }
   },
   {
@@ -47,7 +47,7 @@ export const createColumns = (t) => [
     cell: function ({ row }) {
       return h(
         'div',
-        { class: 'text-center font-medium' },
+        { class: 'text-center' },
         format(row.getValue('created_at'), 'PPpp')
       )
     }
@@ -60,7 +60,7 @@ export const createColumns = (t) => [
     cell: function ({ row }) {
       return h(
         'div',
-        { class: 'text-center font-medium' },
+        { class: 'text-center' },
         format(row.getValue('updated_at'), 'PPpp')
       )
     }

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

@@ -62,7 +62,7 @@
                   :checked="!!selectedDays[day]"
                   @update:checked="handleDayToggle(day, $event)"
                 />
-                <Label :for="day" class="font-medium text-gray-800">{{ day }}</Label>
+                <Label :for="day" class="font-medium">{{ day }}</Label>
               </div>
               <div class="flex space-x-2 items-center">
                 <div class="flex flex-col items-start">
@@ -156,7 +156,7 @@
         </div>
         <DialogFooter>
           <Button :disabled="!holidayName || !holidayDate" @click="saveHoliday">
-            {{ t('globals.messages.saveChanges') }}
+            {{ t('globals.messages.add') }}
           </Button>
         </DialogFooter>
       </DialogContent>
@@ -231,9 +231,16 @@ const { t } = useI18n()
 
 const form = useForm({
   validationSchema: toTypedSchema(createFormSchema(t)),
-  initialValues: props.initialValues
+  initialValues: {
+    is_always_open: true
+  }
 })
 
+// Sync form field with local state
+const syncHoursToForm = () => {
+  form.setFieldValue('hours', { ...hours.value })
+}
+
 const saveHoliday = () => {
   holidays.push({
     name: holidayName.value,
@@ -252,21 +259,15 @@ const deleteHoliday = (item) => {
 }
 
 const handleDayToggle = (day, checked) => {
-  selectedDays.value = {
+  selectedDays.value[day] = checked
-    ...selectedDays.value,
+
-    [day]: checked
+  if (checked) {
+    hours.value[day] = hours.value[day] || { open: '09:00', close: '17:00' }
+  } else {
+    delete hours.value[day]
   }
 
-  if (checked && !hours.value[day]) {
+  syncHoursToForm()
-    hours.value[day] = { open: '09:00', close: '17:00' }
-  } else if (!checked) {
-    const newHours = { ...hours.value }
-    delete newHours[day]
-    hours.value = newHours
-  }
-
-  // Sync with form values
-  form.setFieldValue('hours', { ...hours.value })
 }
 
 const updateHours = (day, type, value) => {
@@ -274,50 +275,48 @@ const updateHours = (day, type, value) => {
     hours.value[day] = { open: '09:00', close: '17:00' }
   }
   hours.value[day][type] = value
-
+  syncHoursToForm()
-  // Sync with form values
-  form.setFieldValue('hours', { ...hours.value })
 }
 
 const onSubmit = form.handleSubmit((values) => {
-  const businessHours =
+  const businessHours = values.is_always_open === true ? {} : { ...hours.value }
-    values.is_always_open === true
+
-      ? {}
-      : Object.keys(selectedDays.value)
-          .filter((day) => selectedDays.value[day])
-          .reduce((acc, day) => {
-            acc[day] = hours.value[day]
-            return acc
-          }, {})
   const finalValues = {
     ...values,
-    is_always_open: values.is_always_open,
     hours: businessHours,
-    holidays: holidays
+    holidays: [...holidays]
   }
   props.submitForm(finalValues)
 })
 
+// Initialize state from props
+const initializeFromValues = (values) => {
+  if (!values) return
+
+  // Reset state
+  hours.value = {}
+  selectedDays.value = {}
+  holidays.length = 0
+
+  // Set hours and selected days
+  if (values.hours && typeof values.hours === 'object') {
+    hours.value = { ...values.hours }
+    selectedDays.value = Object.keys(values.hours).reduce((acc, day) => {
+      acc[day] = true
+      return acc
+    }, {})
+  }
+
+  // Set holidays
+  if (values.holidays) {
+    holidays.push(...values.holidays)
+  }
+
+  // Update form
+  form.setValues(values)
+  syncHoursToForm()
+}
+
 // Watch for initial values
-watch(
+watch(() => props.initialValues, initializeFromValues, { immediate: true, deep: true })
-  () => props.initialValues,
-  (newValues) => {
-    if (!newValues || Object.keys(newValues).length === 0) {
-      return
-    }
-    // Set business hours if provided
-    if (newValues.is_always_open === false) {
-      hours.value = newValues.hours || {}
-      selectedDays.value = Object.keys(hours.value).reduce((acc, day) => {
-        acc[day] = true
-        return acc
-      }, {})
-    }
-    // Set other form values
-    form.setValues(newValues)
-    holidays.length = 0
-    holidays.push(...(newValues.holidays || []))
-  },
-  { deep: true }
-)
 </script>

frontend/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 font-medium' }, row.getValue('name'))
+            return h('div', { class: 'text-center' }, 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 font-medium' }, format(row.getValue('created_at'), 'PPpp'))
+            return h('div', { class: 'text-center' }, 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 font-medium' }, format(row.getValue('updated_at'), 'PPpp'))
+            return h('div', { class: 'text-center' }, format(row.getValue('updated_at'), 'PPpp'))
         }
     },
     {

frontend/src/features/admin/business-hours/formSchema.js

@@ -5,7 +5,7 @@ const timeRegex = /^([01]\d|2[0-3]):([0-5]\d)$/
 export const createFormSchema = (t) => z.object({
     name: z.string().min(1, t('globals.messages.required')),
     description: z.string().min(1, t('globals.messages.required')),
-    is_always_open: z.boolean().default(true),
+    is_always_open: z.boolean(),
     hours: z.record(
         z.object({
             open: z.string().regex(timeRegex, t('form.error.time.invalid')),

frontend/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 font-medium' }, row.getValue('name'))
+            return h('div', { class: 'text-center' }, 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 font-medium' }, row.getValue('key'))
+            return h('div', { class: 'text-center' }, 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 font-medium' }, row.getValue('data_type'))
+            return h('div', { class: 'text-center' }, 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 font-medium' }, row.getValue('applies_to'))
+            return h('div', { class: 'text-center' }, row.getValue('applies_to'))
         }
     },
     {
@@ -47,7 +47,7 @@ export const createColumns = (t) => [
         cell: function ({ row }) {
             return h(
                 'div',
-                { class: 'text-center font-medium' },
+                { class: 'text-center' },
                 format(row.getValue('created_at'), 'PPpp')
             )
         }
@@ -60,7 +60,7 @@ export const createColumns = (t) => [
         cell: function ({ row }) {
             return h(
                 'div',
-                { class: 'text-center font-medium' },
+                { class: 'text-center' },
                 format(row.getValue('updated_at'), 'PPpp')
             )
         }

frontend/src/features/admin/macros/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 font-medium' }, row.getValue('name'))
+      return h('div', { class: 'text-center' }, row.getValue('name'))
     }
   },
   {

frontend/src/features/admin/oidc/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 font-medium' }, row.getValue('name'))
+      return h('div', { class: 'text-center' }, row.getValue('name'))
     }
   },
   {
@@ -18,7 +18,7 @@ export const createColumns = (t) => [
       return h('div', { class: 'text-center' }, t('globals.terms.provider'))
     },
     cell: function ({ row }) {
-      return h('div', { class: 'text-center font-medium' }, row.getValue('provider'))
+      return h('div', { class: 'text-center' }, row.getValue('provider'))
     }
   },
   {

frontend/src/features/admin/roles/RoleForm.vue

@@ -140,6 +140,7 @@ const permissions = ref([
       { name: perms.CONVERSATIONS_UPDATE_TAGS, label: t('admin.role.conversations.updateTags') },
       { name: perms.MESSAGES_READ, label: t('admin.role.messages.read') },
       { name: perms.MESSAGES_WRITE, label: t('admin.role.messages.write') },
+      { name: perms.MESSAGES_WRITE_AS_CONTACT, label: t('admin.role.messages.writeAsContact') },
       { name: perms.VIEW_MANAGE, label: t('admin.role.view.manage') }
     ]
   },

frontend/src/features/admin/roles/dataTableColumns.js

@@ -8,7 +8,7 @@ export const createColumns = (t) => [
       return h('div', { class: 'text-center' }, t('globals.terms.name'))
     },
     cell: function ({ row }) {
-      return h('div', { class: 'text-center font-medium' }, row.getValue('name'))
+      return h('div', { class: 'text-center' }, row.getValue('name'))
     }
   },
   {
@@ -17,7 +17,7 @@ export const createColumns = (t) => [
       return h('div', { class: 'text-center' }, t('globals.terms.description'))
     },
     cell: function ({ row }) {
-      return h('div', { class: 'text-center font-medium' }, row.getValue('description'))
+      return h('div', { class: 'text-center' }, row.getValue('description'))
     }
   },
   {

frontend/src/features/admin/sla/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 font-medium' }, row.getValue('name'))
+            return h('div', { class: 'text-center' }, 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 font-medium' }, format(row.getValue('created_at'), 'PPpp'))
+            return h('div', { class: 'text-center' }, 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 font-medium' }, format(row.getValue('updated_at'), 'PPpp'))
+            return h('div', { class: 'text-center' }, format(row.getValue('updated_at'), 'PPpp'))
         }
     },
     {

frontend/src/features/admin/status/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 font-medium' }, row.getValue('name'))
+      return h('div', { class: 'text-center' }, row.getValue('name'))
     }
   },
   {

frontend/src/features/admin/tags/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 font-medium' }, row.getValue('name'))
+      return h('div', { class: 'text-center' }, row.getValue('name'))
     }
   },
   {

frontend/src/features/admin/teams/TeamsDataTableColumns.js

@@ -9,7 +9,7 @@ export const columns = [
       return h('div', { class: 'text-center' }, 'Name')
     },
     cell: function ({ row }) {
-      return h('div', { class: 'text-center font-medium' }, row.getValue('name'))
+      return h('div', { class: 'text-center' }, row.getValue('name'))
     }
   },
   {
@@ -20,7 +20,7 @@ export const columns = [
     cell: function ({ row }) {
       return h(
         'div',
-        { class: 'text-center font-medium' },
+        { class: 'text-center' },
         format(row.getValue('created_at'), 'PPpp')
       )
     }
@@ -33,7 +33,7 @@ export const columns = [
     cell: function ({ row }) {
       return h(
         'div',
-        { class: 'text-center font-medium' },
+        { class: 'text-center' },
         format(row.getValue('updated_at'), 'PPpp')
       )
     }

frontend/src/features/admin/templates/dataTableColumns.js

@@ -9,7 +9,7 @@ export const createOutgoingEmailTableColumns = (t) => [
       return h('div', { class: 'text-center' }, t('globals.terms.name'))
     },
     cell: function ({ row }) {
-      return h('div', { class: 'text-center font-medium' }, row.getValue('name'))
+      return h('div', { class: 'text-center' }, row.getValue('name'))
     }
   },
   {
@@ -60,7 +60,7 @@ export const createEmailNotificationTableColumns = (t) => [
       return h('div', { class: 'text-center' }, t('globals.terms.name'))
     },
     cell: function ({ row }) {
-      return h('div', { class: 'text-center font-medium' }, row.getValue('name'))
+      return h('div', { class: 'text-center' }, row.getValue('name'))
     }
   },
 

frontend/src/features/admin/webhooks/dataTableColumns.js

@@ -10,7 +10,7 @@ export const createColumns = (t) => [
       return h('div', { class: 'text-center' }, t('globals.terms.name'))
     },
     cell: function ({ row }) {
-      return h('div', { class: 'text-center font-medium' }, row.getValue('name'))
+      return h('div', { class: 'text-center' }, row.getValue('name'))
     }
   },
   {
@@ -20,7 +20,7 @@ export const createColumns = (t) => [
     },
     cell: function ({ row }) {
       const url = row.getValue('url')
-      return h('div', { class: 'text-center font-mono text-sm max-w-sm truncate' }, url)
+      return h('div', { class: 'text-center font-mono mt-1 max-w-sm truncate' }, url)
     }
   },
   {

frontend/src/features/contact/ContactForm.vue

@@ -41,8 +41,8 @@
 
       <div class="flex flex-col flex-1">
         <div class="flex items-end">
-          <FormField v-slot="{ componentField }" name="phone_number_calling_code">
+          <FormField v-slot="{ componentField }" name="phone_number_country_code">
-            <FormItem class="w-20">
+            <FormItem class="w-max">
               <FormLabel class="flex items-center whitespace-nowrap">
                 {{ t('globals.terms.phoneNumber') }}
               </FormLabel>
@@ -58,13 +58,18 @@
                       <div class="w-7 h-7 flex items-center justify-center">
                         <span v-if="item.emoji">{{ item.emoji }}</span>
                       </div>
-                      <span class="text-sm">{{ item.label }} ({{ item.value }})</span>
+                      <span class="text-sm">{{ item.label }} ({{ item.calling_code }})</span>
                     </div>
                   </template>
 
                   <template #selected="{ selected }">
-                    <div class="flex items-center mb-1">
+                    <div class="flex items-center gap-1">
-                      <span v-if="selected" class="text-xl leading-none">{{ selected.emoji }}</span>
+                      <span v-if="selected" class="text-lg">{{ selected.emoji }}</span>
+                      <span
+                        v-if="selected && selected.calling_code"
+                        class="text-xs text-muted-foreground"
+                        >({{ selected.calling_code }})</span
+                      >
                     </div>
                   </template>
                 </ComboBox>
@@ -116,7 +121,8 @@ const userStore = useUserStore()
 
 const allCountries = countries.map((country) => ({
   label: country.name,
-  value: country.calling_code,
+  value: country.iso_2,
-  emoji: country.emoji
+  emoji: country.emoji,
+  calling_code: country.calling_code
 }))
 </script>

frontend/src/features/contact/ContactNotes.vue

@@ -33,13 +33,7 @@
             />
           </div>
           <div class="flex justify-end space-x-3 pt-2">
-            <Button
+            <Button variant="outline" @click="cancelAddNote"> Cancel </Button>
-              variant="outline"
-              @click="cancelAddNote"
-              class="transition-all hover:bg-gray-100"
-            >
-              Cancel
-            </Button>
             <Button type="submit" :disabled="!newNote.trim()">
               {{ $t('globals.messages.save') + ' ' + $t('globals.terms.note').toLowerCase() }}
             </Button>
@@ -53,13 +47,13 @@
       <Card
         v-for="note in notes"
         :key="note.id"
-        class="overflow-hidden border-gray-2 hover:border-gray-300 transition-all duration-200 box hover:shadow"
+        class="overflow-hidden border-gray-2 dark:hover:border-gray-700 hover:border-gray-300 transition-all duration-200 box hover:shadow"
       >
         <!-- Header -->
-        <CardHeader class="bg-gray-50/50 dark:bg-secondary border-b p-2">
+        <CardHeader class="bg-background border-b p-2">
           <div class="flex items-center justify-between">
             <div class="flex items-center space-x-3">
-              <Avatar class="border border-gray-200 shadow-sm">
+              <Avatar class="border shadow-sm">
                 <AvatarImage :src="note.avatar_url" />
                 <AvatarFallback>
                   {{ getInitials(note.first_name, note.last_name) }}

frontend/src/features/contact/formSchema.js

@@ -29,7 +29,7 @@ export const createFormSchema = (t) => z.object({
             })
         })
         .nullable(),
-    phone_number_calling_code: z.string().optional().nullable(),
+    phone_number_country_code: z.string().optional().nullable(),
     avatar_url: z.string().optional().nullable(),
     email: z
         .string({

frontend/src/features/conversation/ConversationPlaceholder.vue

@@ -1,5 +1,106 @@
 <template>
-  <div class="h-screen w-full flex items-center justify-center min-w-[400px]">
+  <div class="placeholder-container">
-    <p>{{ $t('conversation.placeholder') }}</p>
+    <Spinner v-if="isLoading" />
+    <template v-else>
+      <div v-if="showGettingStarted" class="getting-started-wrapper">
+        <div class="text-center">
+          <h2 class="text-2xl font-semibold text-foreground mb-6">
+            {{ $t('setup.completeYourSetup') }}
+          </h2>
+
+          <div class="space-y-4 mb-6">
+            <div class="checklist-item" :class="{ completed: hasInboxes }">
+              <CheckCircle v-if="hasInboxes" class="check-icon completed" />
+              <Circle v-else class="w-5 h-5 text-muted-foreground" />
+              <span class="flex-1 text-left ml-3 text-foreground">
+                {{ $t('setup.createFirstInbox') }}
+              </span>
+              <Button
+                v-if="!hasInboxes"
+                variant="ghost"
+                size="sm"
+                @click="router.push({ name: 'inbox-list' })"
+                class="ml-auto"
+              >
+                {{ $t('globals.messages.setUp') }}
+              </Button>
+            </div>
+
+            <div class="checklist-item" :class="{ completed: hasAgents, disabled: !hasInboxes }">
+              <CheckCircle v-if="hasAgents" class="check-icon completed" />
+              <Circle v-else class="w-5 h-5 text-muted-foreground" />
+              <span class="flex-1 text-left ml-3 text-foreground">
+                {{ $t('setup.inviteTeammates') }}
+              </span>
+              <Button
+                v-if="!hasAgents && hasInboxes"
+                variant="ghost"
+                size="sm"
+                @click="router.push({ name: 'agent-list' })"
+                class="ml-auto"
+              >
+                {{ $t('globals.messages.invite') }}
+              </Button>
+            </div>
+          </div>
+        </div>
+      </div>
+      <div v-else>
+        <p class="placeholder-text">{{ $t('conversation.placeholder') }}</p>
+      </div>
+    </template>
   </div>
 </template>
+
+<script setup>
+import { ref, computed, onMounted } from 'vue'
+import { useRouter } from 'vue-router'
+import { CheckCircle, Circle } from 'lucide-vue-next'
+import { Button } from '@/components/ui/button'
+import { Spinner } from '@/components/ui/spinner'
+import { useInboxStore } from '@/stores/inbox'
+import { useUsersStore } from '@/stores/users'
+
+const router = useRouter()
+const inboxStore = useInboxStore()
+const usersStore = useUsersStore()
+const isLoading = ref(true)
+
+onMounted(async () => {
+  try {
+    await Promise.all([inboxStore.fetchInboxes(), usersStore.fetchUsers()])
+  } finally {
+    isLoading.value = false
+  }
+})
+
+const hasInboxes = computed(() => inboxStore.inboxes.length > 0)
+const hasAgents = computed(() => usersStore.users.length > 0)
+const showGettingStarted = computed(() => !hasInboxes.value || !hasAgents.value)
+</script>
+
+<style scoped>
+.placeholder-container {
+  @apply h-screen w-full flex items-center justify-center min-w-[400px] relative;
+}
+
+.getting-started-wrapper {
+  @apply w-full max-w-md mx-auto px-4;
+}
+
+.checklist-item {
+  @apply flex items-center justify-between py-3 px-4 rounded-lg border border-border;
+}
+
+.checklist-item.completed {
+  @apply bg-muted/50;
+}
+
+.checklist-item.disabled {
+  @apply opacity-50;
+}
+
+.check-icon.completed {
+  @apply w-5 h-5 text-primary;
+}
+</style>

frontend/src/features/conversation/CreateConversation.vue

@@ -10,7 +10,7 @@
               })
             }}
           </DialogTitle>
-          <DialogDescription/>
+          <DialogDescription />
         </DialogHeader>
         <form @submit="createConversation" class="flex flex-col flex-1 overflow-hidden">
           <!-- Form Fields Section -->
@@ -263,6 +263,7 @@ import { useFileUpload } from '@/composables/useFileUpload'
 import Editor from '@/components/editor/TextEditor.vue'
 import { useMacroStore } from '@/stores/macro'
 import SelectComboBox from '@/components/combobox/SelectCombobox.vue'
+import { UserTypeAgent } from '@/constants/user'
 import api from '@/api'
 
 const dialogOpen = defineModel({
@@ -393,12 +394,14 @@ const selectContact = (contact) => {
 const createConversation = form.handleSubmit(async (values) => {
   loading.value = true
   try {
-    // convert ids to numbers if they are not already
+    // Convert ids to numbers if they are not already
     values.inbox_id = Number(values.inbox_id)
     values.team_id = values.team_id ? Number(values.team_id) : null
     values.agent_id = values.agent_id ? Number(values.agent_id) : null
-    // array of attachment ids.
+    // Array of attachment ids.
     values.attachments = mediaFiles.value.map((file) => file.id)
+    // Initiator of this conversation is always agent
+    values.initiator = UserTypeAgent
     const conversation = await api.createConversation(values)
     const conversationUUID = conversation.data.data.uuid
 

frontend/src/features/conversation/ReplyBox.vue

@@ -122,6 +122,7 @@ import { Input } from '@/components/ui/input'
 import { useEmitter } from '@/composables/useEmitter'
 import { useFileUpload } from '@/composables/useFileUpload'
 import ReplyBoxContent from '@/features/conversation/ReplyBoxContent.vue'
+import { UserTypeAgent } from '@/constants/user'
 import {
   Form,
   FormField,
@@ -252,6 +253,7 @@ const processSend = async () => {
     if (hasTextContent.value > 0 || mediaFiles.value.length > 0) {
       const message = htmlContent.value
       await api.sendMessage(conversationStore.current.uuid, {
+        sender_type: UserTypeAgent,
         private: messageType.value === 'private_note',
         message: message,
         attachments: mediaFiles.value.map((file) => file.id),

frontend/src/features/conversation/message/AgentMessageBubble.vue

@@ -66,11 +66,11 @@
       <Tooltip>
         <TooltipTrigger>
           <span class="text-muted-foreground text-xs mt-1">
-            {{ format(message.updated_at, 'h:mm a') }}
+            {{ formatMessageTimestamp(message.created_at) }}
           </span>
         </TooltipTrigger>
         <TooltipContent>
-          {{ format(message.updated_at, "MMMM dd, yyyy 'at' HH:mm") }}
+          {{ formatFullTimestamp(message.created_at) }}
         </TooltipContent>
       </Tooltip>
     </div>
@@ -79,12 +79,12 @@
 
 <script setup>
 import { computed } from 'vue'
-import { format } from 'date-fns'
 import { useConversationStore } from '@/stores/conversation'
 import { Lock, RotateCcw, Check } from 'lucide-vue-next'
 import { revertCIDToImageSrc } from '@/utils/strings'
 import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
 import { Spinner } from '@/components/ui/spinner'
+import { formatMessageTimestamp, formatFullTimestamp } from '@/utils/datetime'
 import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'
 import MessageAttachmentPreview from '@/features/conversation/message/attachment/MessageAttachmentPreview.vue'
 import MessageEnvelope from './MessageEnvelope.vue'

frontend/src/features/conversation/message/ContactMessageBubble.vue

@@ -34,7 +34,7 @@
           <Letter
             :html="sanitizedMessageContent"
             :allowedSchemas="['cid', 'https', 'http', 'mailto']"
-            class="mb-1 native-html"
+            class="mb-1 native-html break-all"
             :class="{ 'mb-3': message.attachments.length > 0 }"
           />
 
@@ -60,12 +60,12 @@
       <Tooltip>
         <TooltipTrigger>
           <span class="text-muted-foreground text-xs mt-1">
-            {{ format(message.updated_at, 'h:mm a') }}
+            {{ formatMessageTimestamp(message.created_at) }}
           </span>
         </TooltipTrigger>
         <TooltipContent>
           <p>
-            {{ format(message.updated_at, "MMMM dd, yyyy 'at' HH:mm") }}
+            {{ formatFullTimestamp(message.created_at) }}
           </p>
         </TooltipContent>
       </Tooltip>
@@ -75,11 +75,11 @@
 
 <script setup>
 import { computed, ref } from 'vue'
-import { format } from 'date-fns'
 import { useConversationStore } from '@/stores/conversation'
 import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
 import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'
 import { Letter } from 'vue-letter'
+import { formatMessageTimestamp, formatFullTimestamp } from '@/utils/datetime'
 import { useAppSettingsStore } from '@/stores/appSettings'
 import { useI18n } from 'vue-i18n'
 import MessageAttachmentPreview from '@/features/conversation/message/attachment/MessageAttachmentPreview.vue'

frontend/src/features/conversation/sidebar/ConversationSideBar.vue

@@ -13,7 +13,9 @@
           <SelectComboBox
             v-model="conversationStore.current.assigned_user_id"
             :items="[{ value: 'none', label: 'None' }, ...usersStore.options]"
-            :placeholder="t('globals.messages.select', { name: t('globals.terms.agent').toLowerCase() })"
+            :placeholder="
+              t('globals.messages.select', { name: t('globals.terms.agent').toLowerCase() })
+            "
             @select="selectAgent"
             type="user"
           />
@@ -22,7 +24,9 @@
           <SelectComboBox
             v-model="conversationStore.current.assigned_team_id"
             :items="[{ value: 'none', label: 'None' }, ...teamsStore.options]"
-            :placeholder="t('globals.messages.select', { name: t('globals.terms.team').toLowerCase() })"
+            :placeholder="
+              t('globals.messages.select', { name: t('globals.terms.team').toLowerCase() })
+            "
             @select="selectTeam"
             type="team"
           />
@@ -31,7 +35,9 @@
           <SelectComboBox
             v-model="conversationStore.current.priority_id"
             :items="priorityOptions"
-            :placeholder="t('globals.messages.select', { name: t('globals.terms.priority').toLowerCase() })"
+            :placeholder="
+              t('globals.messages.select', { name: t('globals.terms.priority').toLowerCase() })
+            "
             @select="selectPriority"
             type="priority"
           />
@@ -41,7 +47,9 @@
             v-if="conversationStore.current"
             v-model="conversationStore.current.tags"
             :items="tags.map((tag) => ({ label: tag, value: tag }))"
-            :placeholder="t('globals.messages.select', { name: t('globals.terms.tag', 2).toLowerCase() })"
+            :placeholder="
+              t('globals.messages.select', { name: t('globals.terms.tag', 2).toLowerCase() })
+            "
           />
         </AccordionContent>
       </AccordionItem>
@@ -93,6 +101,7 @@ import { ref, onMounted, watch, computed } from 'vue'
 import { useConversationStore } from '@/stores/conversation'
 import { useUsersStore } from '@/stores/users'
 import { useTeamStore } from '@/stores/team'
+import { useTagStore } from '@/stores/tag'
 import {
   Accordion,
   AccordionContent,
@@ -118,6 +127,7 @@ const emitter = useEmitter()
 const conversationStore = useConversationStore()
 const usersStore = useUsersStore()
 const teamsStore = useTeamStore()
+const tagStore = useTagStore()
 const tags = ref([])
 // Save the accordion state in local storage
 const accordionState = useStorage('conversation-sidebar-accordion', [])
@@ -171,15 +181,8 @@ watch(
 const priorityOptions = computed(() => conversationStore.priorityOptions)
 
 const fetchTags = async () => {
-  try {
+  await tagStore.fetchTags()
-    const resp = await api.getTags()
+  tags.value = tagStore.tags.map((item) => item.name)
-    tags.value = resp.data.data.map((item) => item.name)
-  } catch (error) {
-    emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
-      variant: 'destructive',
-      description: handleHTTPError(error).message
-    })
-  }
 }
 
 const handleAssignedUserChange = (id) => {

frontend/src/features/conversation/sidebar/ConversationSideBarContact.vue

@@ -58,6 +58,7 @@ import { ViewVerticalIcon } from '@radix-icons/vue'
 import { Button } from '@/components/ui/button'
 import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'
 import { Mail, Phone, ExternalLink } from 'lucide-vue-next'
+import countries from '@/constants/countries.js'
 import { useEmitter } from '@/composables/useEmitter'
 import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
 import { useConversationStore } from '@/stores/conversation'
@@ -72,8 +73,13 @@ const { t } = useI18n()
 const userStore = useUserStore()
 
 const phoneNumber = computed(() => {
-  const callingCode = conversation.value?.contact?.phone_number_calling_code || ''
+  const countryCodeValue = conversation.value?.contact?.phone_number_country_code || ''
   const number = conversation.value?.contact?.phone_number || t('conversation.sidebar.notAvailable')
-  return callingCode ? `${callingCode} ${number}` : number
+  if (!countryCodeValue) return number
+
+  // Lookup calling code
+  const country = countries.find((c) => c.iso_2 === countryCodeValue)
+  const callingCode = country ? country.calling_code : countryCodeValue
+  return `${callingCode} ${number}`
 })
 </script>

frontend/src/features/conversation/sidebar/PreviousConversations.vue

@@ -8,7 +8,7 @@
   >
     {{ $t('conversation.sidebar.noPreviousConvo') }}
   </div>
-  <div v-else class="space-y-3">
+  <div v-else class="space-y-1">
     <router-link
       v-for="conversation in conversationStore.current.previous_conversations"
       :key="conversation.uuid"
@@ -30,9 +30,31 @@
             {{ conversation.last_message }}
           </span>
         </div>
-        <span class="text-xs text-muted-foreground" v-if="conversation.last_message_at">
+        <Tooltip>
-          {{ format(new Date(conversation.last_message_at), 'h') + ' h' }}
+          <TooltipTrigger asChild>
-        </span>
+            <div class="flex gap-1 items-center text-xs text-muted-foreground">
+              <span v-if="conversation.created_at">
+                {{ getRelativeTime(new Date(conversation.created_at)) }}
+              </span>
+              <span>•</span>
+              <span v-if="conversation.last_message_at">
+                {{ getRelativeTime(new Date(conversation.last_message_at)) }}
+              </span>
+            </div>
+          </TooltipTrigger>
+          <TooltipContent>
+            <div class="space-y-1 text-xs">
+              <p>
+                {{ $t('globals.terms.createdAt') }}:
+                {{ formatFullTimestamp(new Date(conversation.created_at)) }}
+              </p>
+              <p v-if="conversation.last_message_at">
+                {{ $t('globals.terms.lastMessageAt') }}:
+                {{ formatFullTimestamp(new Date(conversation.last_message_at)) }}
+              </p>
+            </div>
+          </TooltipContent>
+        </Tooltip>
       </div>
     </router-link>
   </div>
@@ -40,7 +62,8 @@
 
 <script setup>
 import { useConversationStore } from '@/stores/conversation'
-import { format } from 'date-fns'
+import { Tooltip, TooltipContent, TooltipTrigger } from '@/components/ui/tooltip'
+import { formatFullTimestamp, getRelativeTime } from '@/utils/datetime'
 
 const conversationStore = useConversationStore()
 </script>

frontend/src/features/search/SearchResults.vue

@@ -1,105 +1,139 @@
 <template>
   <div class="max-w-5xl mx-auto p-6 min-h-screen">
-    <div class="space-y-8">
+    <Tabs :default-value="defaultTab" v-model="activeTab">
-      <div
+      <TabsList class="grid w-full mb-6" :class="tabsGridClass">
-        v-for="(items, type) in results"
+        <TabsTrigger v-for="(items, type) in results" :key="type" :value="type" class="capitalize">
-        :key="type"
+          {{ type }} ({{ items.length }})
-        class="bg-card rounded shadow overflow-hidden"
+        </TabsTrigger>
-      >
+      </TabsList>
-        <!-- Header for each section -->
-        <h2
-          class="bg-primary dark:bg-primary text-lg font-bold text-white dark:text-primary-foreground py-2 px-6 capitalize"
-        >
-          {{ type }}
-        </h2>
 
-        <!-- No results message -->
+      <TabsContent v-for="(items, type) in results" :key="type" :value="type" class="mt-0">
-        <div v-if="items.length === 0" class="p-6 text-gray-500 dark:text-muted-foreground">
+        <div class="bg-background rounded border overflow-hidden">
-          {{
+          <!-- No results message -->
-            $t('globals.messages.noResults', {
+          <div v-if="items.length === 0" class="p-8 text-center text-muted-foreground">
-              name: type
+            <div class="text-lg font-medium mb-2">
-            })
+              {{
-          }}
+                $t('globals.messages.noResults', {
-        </div>
+                  name: type
+                })
+              }}
+            </div>
+            <div class="text-sm">{{ $t('search.adjustSearchTerms') }}</div>
+          </div>
 
-        <!-- Results list -->
+          <!-- Results list -->
-        <div class="divide-y divide-gray-200 dark:divide-border">
+          <div v-else class="divide-y divide-border">
-          <div
+            <div
-            v-for="item in items"
+              v-for="item in items"
-            :key="item.id || item.uuid"
+              :key="item.id || item.uuid"
-            class="p-6 hover:bg-gray-100 dark:hover:bg-accent transition duration-300 ease-in-out group"
+              class="p-6 hover:bg-accent/50 transition duration-200 ease-in-out group"
-          >
-            <router-link
-              :to="{
-                name: 'inbox-conversation',
-                params: {
-                  uuid: type === 'conversations' ? item.uuid : item.conversation_uuid,
-                  type: 'assigned'
-                }
-              }"
-              class="block"
             >
-              <div class="flex justify-between items-start">
+              <router-link
-                <div class="flex-grow">
+                :to="{
-                  <!-- Reference number -->
+                  name: 'inbox-conversation',
-                  <div
+                  params: {
-                    class="text-sm font-semibold mb-2 group-hover:text-primary dark:group-hover:text-primary transition duration-300"
+                    uuid: type === 'conversations' ? item.uuid : item.conversation_uuid,
-                  >
+                    type: 'assigned'
-                    #{{
+                  }
-                      type === 'conversations'
+                }"
-                        ? item.reference_number
+                class="block"
-                        : item.conversation_reference_number
+              >
-                    }}
+                <div class="flex justify-between items-start">
+                  <div class="flex-grow">
+                    <!-- Reference number -->
+                    <div
+                      class="text-sm font-semibold mb-2 text-muted-foreground group-hover:text-primary transition duration-200"
+                    >
+                      #{{
+                        type === 'conversations'
+                          ? item.reference_number
+                          : item.conversation_reference_number
+                      }}
+                    </div>
+
+                    <!-- Content -->
+                    <div
+                      class="text-foreground font-medium mb-2 text-lg group-hover:text-primary transition duration-200"
+                    >
+                      {{
+                        truncateText(
+                          type === 'conversations' ? item.subject : item.text_content,
+                          100
+                        )
+                      }}
+                    </div>
+
+                    <!-- Timestamp -->
+                    <div class="text-sm text-muted-foreground flex items-center">
+                      <ClockIcon class="h-4 w-4 mr-1" />
+                      {{
+                        formatDate(
+                          type === 'conversations' ? item.created_at : item.conversation_created_at
+                        )
+                      }}
+                    </div>
                   </div>
 
-                  <!-- Content -->
+                  <!-- Right arrow icon -->
                   <div
-                    class="text-gray-900 dark:text-card-foreground font-medium mb-2 text-lg group-hover:text-gray-950 dark:group-hover:text-foreground transition duration-300"
+                    class="bg-secondary rounded-full p-2 group-hover:bg-primary transition duration-200"
                   >
-                    {{
+                    <ChevronRightIcon
-                      truncateText(type === 'conversations' ? item.subject : item.text_content, 100)
+                      class="h-5 w-5 text-secondary-foreground group-hover:text-primary-foreground"
-                    }}
+                      aria-hidden="true"
-                  </div>
+                    />
-
-                  <!-- Timestamp -->
-                  <div class="text-sm text-gray-500 dark:text-muted-foreground flex items-center">
-                    <ClockIcon class="h-4 w-4 mr-1" />
-                    {{
-                      formatDate(
-                        type === 'conversations' ? item.created_at : item.conversation_created_at
-                      )
-                    }}
                   </div>
                 </div>
-
+              </router-link>
-                <!-- Right arrow icon -->
+            </div>
-                <div
-                  class="bg-gray-200 dark:bg-secondary rounded-full p-2 group-hover:bg-primary dark:group-hover:bg-primary transition duration-300"
-                >
-                  <ChevronRightIcon
-                    class="h-5 w-5 text-gray-700 dark:text-secondary-foreground group-hover:text-white dark:group-hover:text-primary-foreground"
-                    aria-hidden="true"
-                  />
-                </div>
-              </div>
-            </router-link>
           </div>
         </div>
-      </div>
+      </TabsContent>
-    </div>
+    </Tabs>
   </div>
 </template>
 <script setup>
+import { computed, ref, watch } from 'vue'
 import { ChevronRightIcon, ClockIcon } from 'lucide-vue-next'
 import { format, parseISO } from 'date-fns'
+import { Tabs, TabsContent, TabsList, TabsTrigger } from '@/components/ui/tabs'
 
-defineProps({
+const props = defineProps({
   results: {
     type: Object,
     required: true
   }
 })
 
+// Get the first available tab as default
+const defaultTab = computed(() => {
+  const types = Object.keys(props.results)
+  return types.length > 0 ? types[0] : ''
+})
+
+const activeTab = ref('')
+
+// Watch for changes in results and set the first tab as active
+watch(
+  () => props.results,
+  (newResults) => {
+    const types = Object.keys(newResults)
+    if (types.length > 0 && !activeTab.value) {
+      activeTab.value = types[0]
+    }
+  },
+  { immediate: true }
+)
+
+// Dynamic grid class based on number of tabs
+const tabsGridClass = computed(() => {
+  const tabCount = Object.keys(props.results).length
+  if (tabCount <= 2) return 'grid-cols-2'
+  if (tabCount <= 3) return 'grid-cols-3'
+  if (tabCount <= 4) return 'grid-cols-4'
+  return 'grid-cols-5'
+})
+
 const formatDate = (dateString) => {
   const date = parseISO(dateString)
   return format(date, 'MMM d, yyyy HH:mm')

frontend/src/features/view/ViewForm.vue

@@ -83,6 +83,7 @@ import { handleHTTPError } from '@/utils/http'
 import { OPERATOR } from '@/constants/filterConfig.js'
 import { useI18n } from 'vue-i18n'
 import { z } from 'zod'
+import { FIELD_TYPE } from '@/constants/filterConfig'
 import api from '@/api'
 
 const emitter = useEmitter()
@@ -106,68 +107,88 @@ const formSchema = toTypedSchema(
   z.object({
     id: z.number().optional(),
     name: z
-      .string()
+      .string({
+        required_error: t('globals.messages.required')
+      })
       .min(2, { message: t('view.form.name.length') })
       .max(30, { message: t('view.form.name.length') }),
     filters: z
       .array(
         z.object({
-          model: z.string({
+          model: z.string().optional(),
-            required_error: t('globals.messages.required', {
+          field: z.string().optional(),
-              name: t('globals.terms.filter').toLowerCase()
+          operator: z.string().optional(),
-            })
+          value: z
-          }),
+            .union([
-          field: z.string({
+              z.string(),
-            required_error: t('globals.messages.required', {
+              z.number(),
-              name: t('globals.terms.field').toLowerCase()
+              z.boolean(),
-            })
+              z.array(z.union([z.string(), z.number()]))
-          }),
+            ])
-          operator: z.string({
+            .optional()
-            required_error: t('globals.messages.required', {
-              name: t('globals.terms.operator').toLowerCase()
-            })
-          }),
-          value: z.union([z.string(), z.number(), z.boolean()]).optional()
         })
       )
       .default([])
-      .refine((filters) => filters.length > 0, { message: t('view.form.filter.selectAtLeastOne') })
-      .refine(
-        (filters) =>
-          filters.every(
-            (f) =>
-              f.model &&
-              f.field &&
-              f.operator &&
-              ([OPERATOR.SET, OPERATOR.NOT_SET].includes(f.operator) || f.value)
-          ),
-        {
-          message: t('view.form.filter.partiallyFilled')
-        }
-      )
   })
 )
 
 const form = useForm({
-  validationSchema: formSchema,
+  validationSchema: formSchema
-  validateOnMount: false,
-  validateOnInput: false,
-  validateOnBlur: false
 })
 
-const onSubmit = async () => {
+const onSubmit = form.handleSubmit(async (values) => {
-  const validationResult = await form.validate()
-  if (!validationResult.valid) return
-
   if (isSubmitting.value) return
+
+  // Make sure at least one filter is selected
+  if (!values.filters || values.filters.length === 0) {
+    form.setFieldError('filters', t('view.form.filter.selectAtLeastOne'))
+    return
+  }
+
+  // Check for partial filters
+  const hasPartialFilters = values.filters.some(
+    (f) =>
+      !f.field ||
+      !f.operator ||
+      (![OPERATOR.SET, OPERATOR.NOT_SET].includes(f.operator) && !f.value)
+  )
+  if (hasPartialFilters) {
+    form.setFieldError('filters', t('view.form.filter.partiallyFilled'))
+    return
+  }
+
   isSubmitting.value = true
 
   try {
-    const values = form.values
+    // Serialize array values to JSON strings for backend
+    if (values.filters) {
+      values.filters = values.filters.map((filter) => {
+        if (Array.isArray(filter.value)) {
+          // Convert string IDs to numbers for backend (tags use string IDs in frontend)
+          const numericValues = filter.value.map((v) => {
+            const num = Number(v)
+            return isNaN(num) ? v : num
+          })
+          return { ...filter, value: JSON.stringify(numericValues) }
+        }
+        return filter
+      })
+    }
+
     if (values.id) {
       await api.updateView(values.id, values)
+      emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+        description: t('globals.messages.updatedSuccessfully', {
+          name: t('globals.terms.view')
+        })
+      })
     } else {
       await api.createView(values)
+      emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
+        description: t('globals.messages.createdSuccessfully', {
+          name: t('globals.terms.view')
+        })
+      })
     }
     emitter.emit(EMITTER_EVENTS.REFRESH_LIST, { model: 'view' })
     openDialog.value = false
@@ -180,14 +201,36 @@ const onSubmit = async () => {
   } finally {
     isSubmitting.value = false
   }
-}
+})
 
 // Set form values when view prop changes
 watch(
   () => view.value,
   (newVal) => {
     if (newVal && Object.keys(newVal).length) {
-      form.setValues(newVal)
+      // Deserialize multi-select filter values from JSON strings to arrays
+      const processedVal = { ...newVal }
+      if (processedVal.filters) {
+        processedVal.filters = processedVal.filters.map((filter) => {
+          // Multi-select fields need to be deserialized from JSON strings
+          const field = filterFields.value.find((f) => f.field === filter.field)
+          const isMultiSelectField = field?.type === FIELD_TYPE.MULTI_SELECT
+
+          if (isMultiSelectField && typeof filter.value === 'string') {
+            try {
+              const parsed = JSON.parse(filter.value)
+              // Convert numbers back to strings (frontend uses string IDs)
+              const stringValues = Array.isArray(parsed) ? parsed.map((v) => String(v)) : parsed
+              return { ...filter, value: stringValues }
+            } catch (e) {
+              // If parsing fails, return as-is
+              return filter
+            }
+          }
+          return filter
+        })
+      }
+      form.setValues(processedVal)
     }
   },
   { immediate: true }

frontend/src/main.js

@@ -18,14 +18,14 @@ const setFavicon = (url) => {
 }
 
 async function initApp () {
-  const settings = (await api.getSettings('general')).data.data
+  const config = (await api.getConfig()).data.data
   const emitter = mitt()
-  const lang = settings['app.lang'] || 'en'
+  const lang = config['app.lang'] || 'en'
   const langMessages = await api.getLanguage(lang)
 
   // Set favicon.
-  if (settings['app.favicon_url'])
+  if (config['app.favicon_url'])
-    setFavicon(settings['app.favicon_url'])
+    setFavicon(config['app.favicon_url'])
 
   // Initialize i18n.
   const i18nConfig = {
@@ -42,9 +42,17 @@ async function initApp () {
   const pinia = createPinia()
   app.use(pinia)
 
-  // Store app settings in Pinia
+  // Fetch and store app settings in store (after pinia is initialized)
   const settingsStore = useAppSettingsStore()
-  settingsStore.setSettings(settings)
+
+  // Store the public config in the store
+  settingsStore.setPublicConfig(config)
+
+  try {
+    await settingsStore.fetchSettings('general')
+  } catch (error) {
+    // Pass
+  }
 
   // Add emitter to global properties.
   app.config.globalProperties.emitter = emitter

frontend/src/router/index.js

@@ -71,14 +71,16 @@ const routes = [
             path: '',
             name: 'team-inbox',
             component: () => import('@/views/inbox/InboxView.vue'),
-            meta: { title: 'Team inbox' }
+            meta: { title: 'Team inbox' },
-          },
+            children: [
-          {
+              {
-            path: 'conversation/:uuid',
+                path: 'conversation/:uuid',
-            name: 'team-inbox-conversation',
+                name: 'team-inbox-conversation',
-            component: () => import('@/views/conversation/ConversationDetailView.vue'),
+                component: () => import('@/views/conversation/ConversationDetailView.vue'),
-            props: true,
+                props: true,
-            meta: { title: 'Team inbox', hidePageHeader: true }
+                meta: { title: 'Team inbox', hidePageHeader: true }
+              }
+            ]
           }
         ]
       },
@@ -93,14 +95,16 @@ const routes = [
             path: '',
             name: 'view-inbox',
             component: () => import('@/views/inbox/InboxView.vue'),
-            meta: { title: 'View inbox' }
+            meta: { title: 'View inbox' },
-          },
+            children: [
-          {
+              {
-            path: 'conversation/:uuid',
+                path: 'conversation/:uuid',
-            name: 'view-inbox-conversation',
+                name: 'view-inbox-conversation',
-            component: () => import('@/views/conversation/ConversationDetailView.vue'),
+                component: () => import('@/views/conversation/ConversationDetailView.vue'),
-            props: true,
+                props: true,
-            meta: { title: 'View inbox', hidePageHeader: true }
+                meta: { title: 'View inbox', hidePageHeader: true }
+              }
+            ]
           }
         ]
       },

frontend/src/stores/appSettings.js

@@ -1,12 +1,35 @@
 import { defineStore } from 'pinia'
+import api from '@/api'
 
 export const useAppSettingsStore = defineStore('settings', {
     state: () => ({
-        settings: {}
+        settings: {},
+        public_config: {}
     }),
     actions: {
+        async fetchSettings (key = 'general') {
+            try {
+                const response = await api.getSettings(key)
+                this.settings = response?.data?.data || {}
+                return this.settings
+            } catch (error) {
+                // Pass
+            }
+        },
+        async fetchPublicConfig () {
+            try {
+                const response = await api.getConfig()
+                this.public_config = response?.data?.data || {}
+                return this.public_config
+            } catch (error) {
+                // Pass
+            }
+        },
         setSettings (newSettings) {
             this.settings = newSettings
+        },
+        setPublicConfig (newPublicConfig) {
+            this.public_config = newPublicConfig
         }
     }
 })

frontend/src/stores/conversation.js

@@ -378,9 +378,6 @@ export const useConversationStore = defineStore('conversation', () => {
     if (conversations.listType !== listType || conversations.teamID !== teamID || conversations.viewID !== viewID) {
       resetConversations()
     }
-    if (conversations.listType !== listType) {
-      resetCurrentConversation()
-    }
     if (listType) conversations.listType = listType
     if (teamID) conversations.teamID = teamID
     if (viewID) conversations.viewID = viewID

frontend/src/stores/inbox.js

@@ -12,14 +12,13 @@ export const useInboxStore = defineStore('inbox', () => {
     label: inb.name,
     value: String(inb.id)
   })))
-  const fetchInboxes = async () => {
+  const fetchInboxes = async (force = false) => {
-    if (inboxes.value.length) return
+    if (!force && inboxes.value.length) return
     try {
       const response = await api.getInboxes()
       inboxes.value = response?.data?.data || []
     } catch (error) {
       emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
-        title: 'Error',
         variant: 'destructive',
         description: handleHTTPError(error).message
       })

frontend/src/stores/users.js

@@ -5,6 +5,7 @@ import { useEmitter } from '@/composables/useEmitter'
 import { EMITTER_EVENTS } from '@/constants/emitterEvents'
 import api from '@/api'
 
+// TODO: rename this store to agents
 export const useUsersStore = defineStore('users', () => {
     const users = ref([])
     const emitter = useEmitter()
@@ -13,8 +14,8 @@ export const useUsersStore = defineStore('users', () => {
         value: String(user.id),
         avatar_url: user.avatar_url,
     })))
-    const fetchUsers = async () => {
+    const fetchUsers = async (force = false) => {
-        if (users.value.length) return
+        if (!force && users.value.length) return
         try {
             const response = await api.getUsersCompact()
             users.value = response?.data?.data || []

frontend/src/utils/datetime.js

@@ -1,16 +1,17 @@
-import { format, differenceInMinutes, differenceInHours, differenceInDays } from 'date-fns'
+import { format, differenceInMinutes, differenceInHours, differenceInDays, differenceInYears } from 'date-fns'
 
 export function getRelativeTime (timestamp, now = new Date()) {
   try {
     const mins = differenceInMinutes(now, timestamp)
     const hours = differenceInHours(now, timestamp)
     const days = differenceInDays(now, timestamp)
+    const years = differenceInYears(now, timestamp)
 
-    if (mins === 0) return 'Just now'
+    if (mins === 0) return 'now'
-    if (mins < 60) return `${mins} mins ago`
+    if (mins < 60) return `${mins}m`
-    if (hours < 24) return `${hours} hrs ago`
+    if (hours < 24) return `${hours}h`
-    if (days < 7) return `${days} days ago`
+    if (days < 365) return `${days}d`
-    return format(timestamp, 'MMMM d, yyyy h:mm a')
+    return `${years}y`
   } catch (error) {
     console.error('Error parsing time', error, 'timestamp', timestamp)
     return ''
@@ -25,4 +26,12 @@ export const formatDuration = (seconds, showSeconds = true) => {
   const mins = Math.floor((totalSeconds % 3600) / 60)
   const secs = totalSeconds % 60
   return `${hours}h ${mins}m ${showSeconds ? `${secs}s` : ''}`
+}
+
+export const formatMessageTimestamp = (time) => {
+  return format(time, 'd MMM, hh:mm a')
+}
+
+export const formatFullTimestamp = (time) => {
+  return format(time, 'd MMM yyyy, hh:mm a')
 }

frontend/src/views/admin/agents/AgentList.vue

@@ -17,7 +17,7 @@
 </template>
 
 <script setup>
-import { onMounted, ref } from 'vue'
+import { onMounted, onUnmounted, ref } from 'vue'
 import { createColumns } from '@/features/admin/agents/dataTableColumns.js'
 import { Button } from '@/components/ui/button'
 import DataTable from '@/components/datatable/DataTable.vue'
@@ -25,10 +25,11 @@ import { handleHTTPError } from '@/utils/http'
 import { Spinner } from '@/components/ui/spinner'
 import { useEmitter } from '@/composables/useEmitter'
 import { EMITTER_EVENTS } from '@/constants/emitterEvents.js'
-import api from '@/api'
+import { useUsersStore } from '@/stores/users'
 import { useI18n } from 'vue-i18n'
 
 const isLoading = ref(false)
+const usersStore = useUsersStore()
 const { t } = useI18n()
 const data = ref([])
 const emitter = useEmitter()
@@ -40,11 +41,15 @@ onMounted(async () => {
   })
 })
 
+onUnmounted(() => {
+  emitter.off(EMITTER_EVENTS.REFRESH_LIST)
+})
+
 const getData = async () => {
   try {
     isLoading.value = true
-    const response = await api.getUsers()
+    await usersStore.fetchUsers(true)
-    data.value = response.data.data
+    data.value = usersStore.users
   } catch (error) {
     emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
       variant: 'destructive',

frontend/src/views/admin/general/General.vue

@@ -20,15 +20,17 @@ import { ref, onMounted } from 'vue'
 import { Spinner } from '@/components/ui/spinner'
 import GeneralSettingForm from '@/features/admin/general/GeneralSettingForm.vue'
 import AdminPageWithHelp from '@/layouts/admin/AdminPageWithHelp.vue'
+import { useAppSettingsStore } from '@/stores/appSettings'
 import api from '@/api'
 
 const initialValues = ref({})
 const isLoading = ref(false)
+const settingsStore = useAppSettingsStore()
 
 onMounted(async () => {
   isLoading.value = true
-  const response = await api.getSettings('general')
+  await settingsStore.fetchSettings('general')
-  const data = response.data.data
+  const data = settingsStore.settings
   isLoading.value = false
   initialValues.value = Object.keys(data).reduce((acc, key) => {
     // Remove 'app.' prefix

frontend/src/views/admin/inbox/InboxList.vue

@@ -32,11 +32,13 @@ import { useRouter } from 'vue-router'
 import { useI18n } from 'vue-i18n'
 import { format } from 'date-fns'
 import { Spinner } from '@/components/ui/spinner'
+import { useInboxStore } from '@/stores/inbox'
 import api from '@/api'
 
 const { t } = useI18n()
 const router = useRouter()
 const emitter = useEmitter()
+const inboxStore = useInboxStore()
 const isLoading = ref(false)
 const data = ref([])
 
@@ -47,8 +49,8 @@ onMounted(async () => {
 const getInboxes = async () => {
   try {
     isLoading.value = true
-    const response = await api.getInboxes()
+    await inboxStore.fetchInboxes(true)
-    data.value = response.data.data
+    data.value = inboxStore.inboxes
   } catch (error) {
     emitter.emit(EMITTER_EVENTS.SHOW_TOAST, {
       variant: 'destructive',
@@ -67,7 +69,7 @@ const columns = [
       return h('div', { class: 'text-center' }, t('globals.terms.name'))
     },
     cell: function ({ row }) {
-      return h('div', { class: 'text-center font-medium' }, row.getValue('name'))
+      return h('div', { class: 'text-center' }, row.getValue('name'))
     }
   },
   {
@@ -76,7 +78,7 @@ const columns = [
       return h('div', { class: 'text-center' }, t('globals.terms.channel'))
     },
     cell: function ({ row }) {
-      return h('div', { class: 'text-center font-medium' }, row.getValue('channel'))
+      return h('div', { class: 'text-center' }, row.getValue('channel'))
     }
   },
   {

frontend/src/views/admin/oidc/OIDC.vue

@@ -7,7 +7,7 @@
     <template #help>
       <p>Configure single sign-on with one or more OpenID Connect providers.</p>
       <a
-        href="https://libredesk.io/docs/sso/"
+        href="https://docs.libredesk.io/configuration/sso"
         target="_blank"
         rel="noopener noreferrer"
         class="link-style"