yo

src/app/(dashboard)/users/page.tsx

@@ -63,7 +63,7 @@ export default function UsersPage() {
               <UsersIcon className="h-5 w-5 text-amber-600 dark:text-amber-400" />
             </div>
             <div>
-              <p className="text-2xl font-bold">{users.filter((u) => u.role === "sales").length}</p>
+              <p className="text-2xl font-bold">{users.filter((u) => u.role === "sales_user").length}</p>
               <p className="text-xs text-muted-foreground">Sales</p>
             </div>
           </div>

src/components/layout/topbar.tsx

@@ -41,7 +41,7 @@ export function Topbar({ onMenuClick }: TopbarProps) {
 
   useEffect(() => { setMounted(true) }, [])
   if (!user) return null
-  const initials = (user.firstName[0] + user.lastName[0]).toUpperCase()
+  const initials = user.name.split(" ").map((n) => n[0]).join("")
 
   return (
     <header className="sticky top-0 z-20 flex h-16 items-center gap-4 border-b bg-background px-4 lg:px-6">
@@ -119,13 +119,13 @@ export function Topbar({ onMenuClick }: TopbarProps) {
                 <AvatarImage src={user.avatar} />
                 <AvatarFallback>{initials}</AvatarFallback>
               </Avatar>
-              <span className="hidden text-sm font-medium md:inline-block">{user.firstName} {user.lastName}</span>
+              <span className="hidden text-sm font-medium md:inline-block">{user.name}</span>
             </Button>
           </DropdownMenuTrigger>
           <DropdownMenuContent align="end" className="w-56">
             <DropdownMenuLabel className="font-normal">
               <div className="flex flex-col space-y-1">
-                <p className="text-sm font-medium">{user.firstName} {user.lastName}</p>
+                <p className="text-sm font-medium">{user.name}</p>
                 <p className="text-xs text-muted-foreground">{user.email}</p>
                 <Badge variant="secondary" className="mt-1 w-fit text-xs capitalize">{user.role}</Badge>
               </div>

src/components/users/user-form-dialog.tsx

@@ -55,7 +55,7 @@ export function UserFormDialog({ open, onOpenChange, user }: UserFormDialogProps
     defaultValues: {
       name: "",
       email: "",
-      role: "sales",
+      role: "sales_user",
       active: true,
     },
   })
@@ -69,7 +69,7 @@ export function UserFormDialog({ open, onOpenChange, user }: UserFormDialogProps
         active: user.active,
       })
     } else {
-      form.reset({ name: "", email: "", role: "sales", active: true })
+      form.reset({ name: "", email: "", role: "sales_user", active: true })
     }
   }, [user, form])
 
@@ -130,8 +130,10 @@ export function UserFormDialog({ open, onOpenChange, user }: UserFormDialogProps
                       </SelectTrigger>
                     </FormControl>
                     <SelectContent>
+                      <SelectItem value="super_admin">Super Admin</SelectItem>
                       <SelectItem value="admin">Admin</SelectItem>
-                      <SelectItem value="sales">Sales</SelectItem>
+                      <SelectItem value="sales_user">Sales</SelectItem>
+                      <SelectItem value="developer">Developer</SelectItem>
                     </SelectContent>
                   </Select>
                   <FormMessage />

src/data/users.ts

@@ -1,4 +1,4 @@
-import { User } from "@/types"
+import { User, UserRole } from "@/types"
 
 export const users: User[] = [
   {
@@ -14,7 +14,7 @@ export const users: User[] = [
     id: "u2",
     name: "Marcus Johnson",
     email: "marcus@coastalit.com",
-    role: "sales",
+    role: "sales_user",
     active: true,
     avatar: "https://ui-avatars.com/api/?name=Marcus+Johnson&background=2563eb&color=fff&size=128",
     createdAt: "2025-02-01T09:00:00Z",
@@ -23,7 +23,7 @@ export const users: User[] = [
     id: "u3",
     name: "Emily Rodriguez",
     email: "emily@coastalit.com",
-    role: "sales",
+    role: "sales_user",
     active: true,
     avatar: "https://ui-avatars.com/api/?name=Emily+Rodriguez&background=3b82f6&color=fff&size=128",
     createdAt: "2025-02-15T10:00:00Z",
@@ -32,7 +32,7 @@ export const users: User[] = [
     id: "u4",
     name: "David Kim",
     email: "david@coastalit.com",
-    role: "sales",
+    role: "sales_user",
     active: true,
     avatar: "https://ui-avatars.com/api/?name=David+Kim&background=60a5fa&color=fff&size=128",
     createdAt: "2025-03-01T08:00:00Z",
@@ -41,7 +41,7 @@ export const users: User[] = [
     id: "u5",
     name: "Jessica Patel",
     email: "jessica@coastalit.com",
-    role: "sales",
+    role: "sales_user",
     active: false,
     avatar: "https://ui-avatars.com/api/?name=Jessica+Patel&background=93c5fd&color=fff&size=128",
     createdAt: "2025-03-10T09:00:00Z",
@@ -50,7 +50,7 @@ export const users: User[] = [
     id: "u6",
     name: "Alex Thompson",
     email: "alex@coastalit.com",
-    role: "sales",
+    role: "sales_user",
     active: true,
     avatar: "https://ui-avatars.com/api/?name=Alex+Thompson&background=1d4ed8&color=fff&size=128",
     createdAt: "2025-04-01T08:00:00Z",
@@ -59,7 +59,7 @@ export const users: User[] = [
     id: "u7",
     name: "Rachel Williams",
     email: "rachel@coastalit.com",
-    role: "sales",
+    role: "sales_user",
     active: true,
     avatar: "https://ui-avatars.com/api/?name=Rachel+Williams&background=2563eb&color=fff&size=128",
     createdAt: "2025-04-15T10:00:00Z",
@@ -79,7 +79,7 @@ export function getUserById(id: string): User | undefined {
   return users.find((u) => u.id === id)
 }
 
-export function getUsersByRole(role: "admin" | "sales"): User[] {
+export function getUsersByRole(role: UserRole): User[] {
   return users.filter((u) => u.role === role)
 }
 

src/lib/auth.ts

@@ -156,9 +156,7 @@ export async function isAccountLocked(user: {
 }
 
 export function mapDbUserToSessionUser(dbUser: Record<string, unknown>): SessionUser {
-  const roleName = dbUser.role_name as string
-  const mappedRole =
-    roleName === "SUPER_ADMIN" || roleName === "ADMIN" ? "admin" : "sales"
+  const roleName = (dbUser.role_name as string).toLowerCase()
 
   return {
     id: dbUser.id as string,
@@ -166,7 +164,7 @@ export function mapDbUserToSessionUser(dbUser: Record<string, unknown>): Session
     email: dbUser.email as string,
     firstName: dbUser.first_name as string,
     lastName: dbUser.last_name as string,
-    role: mappedRole,
+    role: roleName,
     avatar: `https://ui-avatars.com/api/?name=${encodeURIComponent(
       `${dbUser.first_name}+${dbUser.last_name}`
     )}&background=1d4ed8&color=fff&size=128`,

src/types/index.ts

@@ -1,5 +1,5 @@
 export type LeadStatus = "open" | "contacted" | "pending" | "closed" | "ignored"
-export type UserRole = "admin" | "sales"
+export type UserRole = "super_admin" | "admin" | "sales_user" | "developer"
 
 export interface User {
   id: string