feat: agent availability status

New columns in users table to store user availability status. Websocket pings sets the last active at timestamp, once user stops sending pings (on disconnect) after 5 minutes the user availalbility status changes to offline. Detects auto away by checking for mouse, keyboard events and sets user status to away. User can also set their status to away manually from the sidebar. Migrations for v0.3.0 Minor visual fixes. Bump version in package.json
abhinavxd · Feb 25, 2025 · 67e1230 · 67e1230
1 parent d58898c
commit 67e1230
Show file tree

Hide file tree

Showing 26 changed files with 435 additions and 204 deletions.
diff --git a/cmd/handlers.go b/cmd/handlers.go
@@ -99,6 +99,7 @@ func initHandlers(g *fastglue.Fastglue, hub *ws.Hub) {
 	g.GET("/api/v1/users/me", auth(handleGetCurrentUser))
 	g.PUT("/api/v1/users/me", auth(handleUpdateCurrentUser))
 	g.GET("/api/v1/users/me/teams", auth(handleGetCurrentUserTeams))
+	g.PUT("/api/v1/users/me/availability", auth(handleUpdateUserAvailability))
 	g.DELETE("/api/v1/users/me/avatar", auth(handleDeleteAvatar))
 	g.GET("/api/v1/users/compact", auth(handleGetUsersCompact))
 	g.GET("/api/v1/users", perm(handleGetUsers, "users:manage"))

diff --git a/cmd/init.go b/cmd/init.go
@@ -308,6 +308,11 @@ func initCSAT(db *sqlx.DB) *csat.Manager {
 	return m
 }
 
+// initWS inits websocket hub.
+func initWS(user *user.Manager) *ws.Hub {
+	return ws.NewHub(user)
+}
+
 // initTemplates inits template manager.
 func initTemplate(db *sqlx.DB, fs stuffbin.FileSystem, consts *constants) *tmpl.Manager {
 	var (

diff --git a/cmd/login.go b/cmd/login.go
@@ -3,6 +3,7 @@ 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"
 	"github.com/valyala/fasthttp"
 	"github.com/zerodha/fastglue"
 )
@@ -11,14 +12,20 @@ import (
 func handleLogin(r *fastglue.Request) error {
 	var (
 		app      = r.Context.(*App)
-		p        = r.RequestCtx.PostArgs()
-		email    = string(p.Peek("email"))
-		password = p.Peek("password")
+		email    = string(r.RequestCtx.PostArgs().Peek("email"))
+		password = r.RequestCtx.PostArgs().Peek("password")
 	)
 	user, err := app.user.VerifyPassword(email, password)
 	if err != nil {
 		return sendErrorEnvelope(r, err)
 	}
+
+	// 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,

diff --git a/cmd/main.go b/cmd/main.go
@@ -36,7 +36,6 @@ import (
 	"github.com/abhinavxd/libredesk/internal/team"
 	"github.com/abhinavxd/libredesk/internal/template"
 	"github.com/abhinavxd/libredesk/internal/user"
-	"github.com/abhinavxd/libredesk/internal/ws"
 	"github.com/knadh/go-i18n"
 	"github.com/knadh/koanf/v2"
 	"github.com/knadh/stuffbin"
@@ -162,7 +161,6 @@ func main() {
 		messageOutgoingScanInterval = ko.MustDuration("message.message_outoing_scan_interval")
 		slaEvaluationInterval       = ko.MustDuration("sla.evaluation_interval")
 		lo                          = initLogger(appName)
-		wsHub                       = ws.NewHub()
 		rdb                         = initRedis()
 		constants                   = initConstants()
 		i18n                        = initI18n(fs)
@@ -177,6 +175,7 @@ func main() {
 		team                        = initTeam(db)
 		businessHours               = initBusinessHours(db)
 		user                        = initUser(i18n, db)
+		wsHub                       = initWS(user)
 		notifier                    = initNotifier(user)
 		automation                  = initAutomationEngine(db)
 		sla                         = initSLA(db, team, settings, businessHours)
@@ -193,6 +192,7 @@ func main() {
 	go notifier.Run(ctx)
 	go sla.Run(ctx, slaEvaluationInterval)
 	go media.DeleteUnlinkedMedia(ctx)
+	go user.MonitorAgentAvailability(ctx)
 
 	var app = &App{
 		lo:            lo,

diff --git a/cmd/middlewares.go b/cmd/middlewares.go
@@ -43,9 +43,7 @@ func tryAuth(handler fastglue.FastRequestHandler) fastglue.FastRequestHandler {
 // auth makes sure the user is logged in.
 func auth(handler fastglue.FastRequestHandler) fastglue.FastRequestHandler {
 	return func(r *fastglue.Request) error {
-		var (
-			app = r.Context.(*App)
-		)
+		var app = r.Context.(*App)
 
 		// Validate session and fetch user.
 		userSession, err := app.auth.ValidateSession(r)

diff --git a/cmd/upgrade.go b/cmd/upgrade.go
@@ -10,6 +10,7 @@ import (
 	"strings"
 
 	"github.com/abhinavxd/libredesk/internal/dbutil"
+	"github.com/abhinavxd/libredesk/internal/migrations"
 	"github.com/jmoiron/sqlx"
 	"github.com/knadh/koanf/v2"
 	"github.com/knadh/stuffbin"
@@ -28,7 +29,9 @@ type migFunc struct {
 // migList is the list of available migList ordered by the semver.
 // Each migration is a Go file in internal/migrations named after the semver.
 // The functions are named as: v0.7.0 => migrations.V0_7_0() and are idempotent.
-var migList = []migFunc{}
+var migList = []migFunc{
+	{"v0.3.0", migrations.V0_3_0},
+}
 
 // upgrade upgrades the database to the current version by running SQL migration files
 // for all version from the last known version to the current one.

diff --git a/cmd/users.go b/cmd/users.go
@@ -22,7 +22,7 @@ import (
 )
 
 const (
-	maxAvatarSizeMB = 5
+	maxAvatarSizeMB = 20
 )
 
 // handleGetUsers returns all users.
@@ -39,9 +39,7 @@ func handleGetUsers(r *fastglue.Request) error {
 
 // handleGetUsersCompact returns all users in a compact format.
 func handleGetUsersCompact(r *fastglue.Request) error {
-	var (
-		app = r.Context.(*App)
-	)
+	var app = r.Context.(*App)
 	agents, err := app.user.GetAllCompact()
 	if err != nil {
 		return r.SendErrorEnvelope(fasthttp.StatusInternalServerError, err.Error(), nil, "")
@@ -66,6 +64,19 @@ func handleGetUser(r *fastglue.Request) error {
 	return r.SendEnvelope(user)
 }
 
+// handleUpdateUserAvailability updates the current user availability.
+func handleUpdateUserAvailability(r *fastglue.Request) error {
+	var (
+		app    = r.Context.(*App)
+		auser  = r.RequestCtx.UserValue("user").(amodels.User)
+		status = string(r.RequestCtx.PostArgs().Peek("status"))
+	)
+	if err := app.user.UpdateAvailability(auser.ID, status); err != nil {
+		return sendErrorEnvelope(r, err)
+	}
+	return r.SendEnvelope("User availability updated successfully.")
+}
+
 // handleGetCurrentUserTeams returns the teams of a user.
 func handleGetCurrentUserTeams(r *fastglue.Request) error {
 	var (
@@ -228,7 +239,7 @@ func handleCreateUser(r *fastglue.Request) error {
 			Provider: notifier.ProviderEmail,
 		}); err != nil {
 			app.lo.Error("error sending notification message", "error", err)
-			return r.SendEnvelope("User created successfully, but error sending welcome email.")
+			return sendErrorEnvelope(r, envelope.NewError(envelope.GeneralError, "User created successfully, but could not send welcome email.", nil))
 		}
 	}
 	return r.SendEnvelope("User created successfully.")

diff --git a/frontend/package.json b/frontend/package.json
@@ -1,6 +1,6 @@
 {
   "name": "libredesk",
-  "version": "0.0.0",
+  "version": "0.3.0",
   "private": true,
   "type": "module",
   "scripts": {

diff --git a/frontend/src/App.vue b/frontend/src/App.vue
@@ -81,6 +81,7 @@ import { useTeamStore } from '@/stores/team'
 import { useSlaStore } from '@/stores/sla'
 import { useMacroStore } from '@/stores/macro'
 import { useTagStore } from '@/stores/tag'
+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'
@@ -118,6 +119,8 @@ const view = ref({})
 const openCreateViewForm = ref(false)
 
 initWS()
+useIdleDetection()
+
 onMounted(() => {
   initToaster()
   listenViewRefresh()
@@ -126,8 +129,10 @@ onMounted(() => {
 
 // initialize data stores
 const initStores = async () => {
+  if (!userStore.userID) {
+    await userStore.getCurrentUser()
+  }
   await Promise.allSettled([
-    userStore.getCurrentUser(),
     getUserViews(),
     conversationStore.fetchStatuses(),
     conversationStore.fetchPriorities(),

diff --git a/frontend/src/api/index.js b/frontend/src/api/index.js
@@ -169,6 +169,7 @@ const updateCurrentUser = (data) =>
 const deleteUserAvatar = () => http.delete('/api/v1/users/me/avatar')
 const getCurrentUser = () => http.get('/api/v1/users/me')
 const getCurrentUserTeams = () => http.get('/api/v1/users/me/teams')
+const updateCurrentUserAvailability = (data) => http.put('/api/v1/users/me/availability', data)
 const getTags = () => http.get('/api/v1/tags')
 const upsertTags = (uuid, data) => http.post(`/api/v1/conversations/${uuid}/tags`, data)
 const updateAssignee = (uuid, assignee_type, data) => http.put(`/api/v1/conversations/${uuid}/assignee/${assignee_type}`, data)
@@ -323,6 +324,7 @@ export default {
   uploadMedia,
   updateAssigneeLastSeen,
   updateUser,
+  updateCurrentUserAvailability,
   updateAutomationRule,
   updateAutomationRuleWeights,
   updateAutomationRulesExecutionMode,

diff --git a/frontend/src/components/sidebar/SidebarNavUser.vue b/frontend/src/components/sidebar/SidebarNavUser.vue
@@ -1,82 +1,93 @@
 <template>
-    <DropdownMenu>
-        <DropdownMenuTrigger as-child>
-            <SidebarMenuButton size="lg"
-                class="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground p-0">
-                <Avatar class="h-8 w-8 rounded-lg">
-                    <AvatarImage :src="userStore.avatar" alt="Abhinav" />
-                    <AvatarFallback class="rounded-lg">
-                        {{ userStore.getInitials }}
-                    </AvatarFallback>
-                </Avatar>
-                <div class="grid flex-1 text-left text-sm leading-tight">
-                    <span class="truncate font-semibold">{{ userStore.getFullName }}</span>
-                    <span class="truncate text-xs">{{ userStore.email }}</span>
-                </div>
-                <ChevronsUpDown class="ml-auto size-4" />
-            </SidebarMenuButton>
-        </DropdownMenuTrigger>
-        <DropdownMenuContent class="w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg" side="bottom"
-            :side-offset="4">
-            <DropdownMenuLabel class="p-0 font-normal">
-                <div class="flex items-center gap-2 px-1 py-1.5 text-left text-sm">
-                    <Avatar class="h-8 w-8 rounded-lg">
-                        <AvatarImage :src="userStore.avatar" alt="Abhinav" />
-                        <AvatarFallback class="rounded-lg">
-                            {{ userStore.getInitials }}
-                        </AvatarFallback>
-                    </Avatar>
-                    <div class="grid flex-1 text-left text-sm leading-tight">
-                        <span class="truncate font-semibold">{{ userStore.getFullName }}</span>
-                        <span class="truncate text-xs">{{ userStore.email }}</span>
-                    </div>
-                </div>
-            </DropdownMenuLabel>
-            <DropdownMenuSeparator />
-            <DropdownMenuGroup>
-                <DropdownMenuItem>
-                    <router-link to="/account" class="flex items-center">
-                        <CircleUserRound size="18" class="mr-2" />
-                        Account
-                    </router-link>
-                </DropdownMenuItem>
-            </DropdownMenuGroup>
-            <DropdownMenuSeparator />
-            <DropdownMenuItem @click="logout">
-                <LogOut size="18" class="mr-2" />
-                Log out
-            </DropdownMenuItem>
-        </DropdownMenuContent>
-    </DropdownMenu>
+  <DropdownMenu>
+    <DropdownMenuTrigger as-child>
+      <SidebarMenuButton
+        size="lg"
+        class="data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground p-0"
+      >
+        <Avatar class="h-8 w-8 rounded-lg relative overflow-visible">
+          <AvatarImage :src="userStore.avatar" alt="Abhinav" />
+          <AvatarFallback class="rounded-lg">
+            {{ userStore.getInitials }}
+          </AvatarFallback>
+          <div
+            class="absolute bottom-0 right-0 h-2.5 w-2.5 rounded-full border border-background"
+            :class="{
+              'bg-green-500': userStore.user.availability_status === 'online',
+              'bg-amber-500': userStore.user.availability_status === 'away' || userStore.user.availability_status === 'away_manual',
+              'bg-gray-400': userStore.user.availability_status === 'offline'
+            }"
+          ></div>
+        </Avatar>
+        <div class="grid flex-1 text-left text-sm leading-tight">
+          <span class="truncate font-semibold">{{ userStore.getFullName }}</span>
+          <span class="truncate text-xs">{{ userStore.email }}</span>
+        </div>
+        <ChevronsUpDown class="ml-auto size-4" />
+      </SidebarMenuButton>
+    </DropdownMenuTrigger>
+    <DropdownMenuContent
+      class="w-[--radix-dropdown-menu-trigger-width] min-w-56 rounded-lg"
+      side="bottom"
+      :side-offset="4"
+    >
+      <DropdownMenuLabel class="p-0 font-normal space-y-1">
+        <div class="flex items-center gap-2 px-1 py-1.5 text-left text-sm">
+          <Avatar class="h-8 w-8 rounded-lg">
+            <AvatarImage :src="userStore.avatar" alt="Abhinav" />
+            <AvatarFallback class="rounded-lg">
+              {{ userStore.getInitials }}
+            </AvatarFallback>
+          </Avatar>
+          <div class="grid flex-1 text-left text-sm leading-tight">
+            <span class="truncate font-semibold">{{ userStore.getFullName }}</span>
+            <span class="truncate text-xs">{{ userStore.email }}</span>
+          </div>
+        </div>
+        <div class="flex items-center gap-2 px-1 py-1.5 text-left text-sm justify-between">
+          <span class="text-muted-foreground">Away</span>
+          <Switch
+            :checked="userStore.user.availability_status === 'away' || userStore.user.availability_status === 'away_manual'"
+            @update:checked="(val) => userStore.updateUserAvailability(val ? 'away' : 'online')"
+          />
+        </div>
+      </DropdownMenuLabel>
+      <DropdownMenuSeparator />
+      <DropdownMenuGroup>
+        <DropdownMenuItem>
+          <router-link to="/account" class="flex items-center">
+            <CircleUserRound size="18" class="mr-2" />
+            Account
+          </router-link>
+        </DropdownMenuItem>
+      </DropdownMenuGroup>
+      <DropdownMenuSeparator />
+      <DropdownMenuItem @click="logout">
+        <LogOut size="18" class="mr-2" />
+        Log out
+      </DropdownMenuItem>
+    </DropdownMenuContent>
+  </DropdownMenu>
 </template>
 
 <script setup>
 import {
-    DropdownMenu,
-    DropdownMenuContent,
-    DropdownMenuGroup,
-    DropdownMenuItem,
-    DropdownMenuLabel,
-    DropdownMenuSeparator,
-    DropdownMenuTrigger,
+  DropdownMenu,
+  DropdownMenuContent,
+  DropdownMenuGroup,
+  DropdownMenuItem,
+  DropdownMenuLabel,
+  DropdownMenuSeparator,
+  DropdownMenuTrigger
 } from '@/components/ui/dropdown-menu'
-import {
-    SidebarMenuButton,
-} from '@/components/ui/sidebar'
-import {
-    Avatar,
-    AvatarFallback,
-    AvatarImage,
-} from '@/components/ui/avatar'
-import {
-    ChevronsUpDown,
-    CircleUserRound,
-    LogOut,
-} from 'lucide-vue-next'
+import { SidebarMenuButton } from '@/components/ui/sidebar'
+import { Avatar, AvatarFallback, AvatarImage } from '@/components/ui/avatar'
+import { Switch } from '@/components/ui/switch'
+import { ChevronsUpDown, CircleUserRound, LogOut } from 'lucide-vue-next'
 import { useUserStore } from '@/stores/user'
 const userStore = useUserStore()
 
 const logout = () => {
-    window.location.href = '/logout'
+  window.location.href = '/logout'
 }
-</script>
+</script>