chore: add admin menu to user button by the role in user info of session

src/components/icons/icons.tsx

@@ -22,6 +22,7 @@ import {
   LayoutGridIcon,
   LayoutPanelLeftIcon,
   Loader2Icon,
+  LockKeyholeIcon,
   type LucideIcon,
   MailCheckIcon,
   MailIcon,
@@ -118,6 +119,8 @@ export const Icons = {
   workflow: WorkflowIcon,
   squareChartGantt: SquareChartGanttIcon,
 
+  admin: LockKeyholeIcon,
+
   github: FaBrandsGitHub,
   google: FaBrandsGoogle,
   twitter: FaBrandsXTwitter,

src/components/layout/user-button.tsx

@@ -36,6 +36,8 @@ export function UserButton() {
   //   );
   // }
 
+  const isAdmin = user?.role === "admin";
+
   const handleSignOut = async () => {
     await authClient.signOut({
       fetchOptions: {
@@ -110,6 +112,22 @@ export function UserButton() {
                   </li>
                 );
               })}
+
+              {isAdmin && (
+                <li
+                  key='admin'
+                  className="rounded-lg text-foreground hover:bg-muted"
+                >
+                  <a href="/admin"
+                    onClick={closeDrawer}
+                    className="flex w-full items-center gap-3 px-2.5 py-2"
+                  >
+                    <Icons.admin className="size-4" />
+                    <p className="text-sm">Admin</p>
+                  </a>
+                </li>
+              )}
+
               <li
                 key="logout"
                 className="rounded-lg text-foreground hover:bg-muted"
@@ -175,8 +193,23 @@ export function UserButton() {
           );
         })}
 
-        <DropdownMenuSeparator />
+        {isAdmin && (
+          <DropdownMenuItem
+            key="admin"
+            asChild
+            className="cursor-pointer"
+            onClick={() => {
+              router.push("/admin");
+            }}
+          >
+            <div className="flex items-center space-x-2.5">
+              <Icons.admin className="size-4" />
+              <p className="text-sm">Admin</p>
+            </div>
+          </DropdownMenuItem>
+        )}
 
+        <DropdownMenuSeparator />
         <DropdownMenuItem
           className="cursor-pointer"
           onSelect={async (event) => {

src/lib/auth-client.ts

@@ -4,6 +4,7 @@ import { adminClient } from "better-auth/client/plugins";
 export const authClient = createAuthClient({
   baseURL: process.env.NEXT_PUBLIC_APP_URL!,
   plugins: [
+    // https://www.better-auth.com/docs/plugins/admin#add-the-client-plugin
     adminClient(),
   ]
 })

src/lib/auth.ts

@@ -1,10 +1,10 @@
 import { betterAuth } from "better-auth";
 import { drizzleAdapter } from "better-auth/adapters/drizzle";
-import db from "@/db/index";
 import { user, session, account, verification } from "@/db/schema";
 import { siteConfig } from "@/config/site";
 import { resend } from "@/lib/email/resend";
-import { admin, customSession } from "better-auth/plugins";
+import { admin } from "better-auth/plugins";
+import db from "@/db/index";
 
 const from = process.env.BETTER_AUTH_EMAIL || "delivered@resend.dev";
 
@@ -82,7 +82,6 @@ export const auth = betterAuth({
 	},
   plugins: [
     // https://www.better-auth.com/docs/plugins/admin
-    // user role and user banned status
     admin(),
   ]
 });