From aef61220b09bd6a2ddc16ac23abf9611e0395b08 Mon Sep 17 00:00:00 2001 From: yosoof3 Date: Thu, 9 May 2024 23:05:47 -0400 Subject: [PATCH] feat: format + fix a bit of admin panel rah --- src/app/(main)/admin/page.tsx | 91 +++--- src/app/globals.css | 2 +- src/components/navbar.tsx | 526 +++++++++++++++++++--------------- 3 files changed, 343 insertions(+), 276 deletions(-) diff --git a/src/app/(main)/admin/page.tsx b/src/app/(main)/admin/page.tsx index 45bf69e..640d49a 100644 --- a/src/app/(main)/admin/page.tsx +++ b/src/app/(main)/admin/page.tsx @@ -1,45 +1,58 @@ -import { Card, CardContent, CardDescription, CardHeader, CardTitle } from "@/components/ui/card"; +import { + Card, + CardContent, + CardDescription, + CardHeader, + CardTitle, +} from "@/components/ui/card"; import { getAuthSession } from "@/lib/auth"; import { db, image, session, user } from "@/lib/drizzle/db"; import { Container, Users } from "lucide-react"; export default async function AdminPage() { - const userSession = await getAuthSession(); - const { users, sessions } = await db.transaction(async (tx) => { - const users = await tx.select().from(user); - const sessions = await tx.query.session.findMany({ - with: { user: true }, - }); - return { users, sessions }; - }); - const activeUsers = sessions.map((s) => s.user); - return ( -
-

Welcome, {userSession.user?.name}

-
- - - Sessions - - - -
{sessions.length}
-

- {activeUsers.length} user{activeUsers.length === 1 ? "" : "s"} active -

- - - - - Users - - - -
{users.length}
-

{users.filter((u) => u.isAdmin).length} admins

- - -
-
- ); + const userSession = await getAuthSession(); + const { users, sessions } = await db.transaction(async (tx) => { + const users = await tx.select().from(user); + const sessions = await tx.query.session.findMany({ + with: { user: true }, + }); + return { users, sessions }; + }); + const activeUsers = sessions.map((s) => s.user); + return ( +
+

+ Welcome, {userSession.user?.name} +

+
+ + + Sessions + + + +
{sessions.length}
+

+ {activeUsers.length} user{activeUsers.length === 1 ? "" : "s"}{" "} + active +

+ + + + + Users + + + +
{users.length}
+

+ {users.filter((u) => u.isAdmin).length > 1 + ? `There are ${users.filter((u) => u.isAdmin).length} admins` + : `There is ${users.filter((u) => u.isAdmin).length} admin`} +

+ + +
+
+ ); } diff --git a/src/app/globals.css b/src/app/globals.css index bb02bb1..4c6231f 100644 --- a/src/app/globals.css +++ b/src/app/globals.css @@ -146,4 +146,4 @@ body { @apply bg-background text-foreground; } -} +} \ No newline at end of file diff --git a/src/components/navbar.tsx b/src/components/navbar.tsx index dc59772..2b78bb9 100644 --- a/src/components/navbar.tsx +++ b/src/components/navbar.tsx @@ -3,254 +3,308 @@ import packageJson from "@/../package.json"; import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"; import { Button } from "@/components/ui/button"; import { - Dialog, - DialogContent, - DialogDescription, - DialogFooter, - DialogHeader, - DialogTitle, + Dialog, + DialogContent, + DialogDescription, + DialogFooter, + DialogHeader, + DialogTitle, } from "@/components/ui/dialog"; import { - DropdownMenu, - DropdownMenuContent, - DropdownMenuItem, - DropdownMenuLabel, - DropdownMenuPortal, - DropdownMenuSeparator, - DropdownMenuSub, - DropdownMenuSubContent, - DropdownMenuSubTrigger, - DropdownMenuTrigger, + DropdownMenu, + DropdownMenuContent, + DropdownMenuItem, + DropdownMenuLabel, + DropdownMenuPortal, + DropdownMenuSeparator, + DropdownMenuSub, + DropdownMenuSubContent, + DropdownMenuSubTrigger, + DropdownMenuTrigger, } from "@/components/ui/dropdown-menu"; import { - NavigationMenu, - NavigationMenuItem, - NavigationMenuLink, - NavigationMenuList, - navigationMenuTriggerStyle, + NavigationMenu, + NavigationMenuItem, + NavigationMenuLink, + NavigationMenuList, + navigationMenuTriggerStyle, } from "@/components/ui/navigation-menu"; -import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip"; +import { + Tooltip, + TooltipContent, + TooltipProvider, + TooltipTrigger, +} from "@/components/ui/tooltip"; import type { SelectUser } from "@/lib/drizzle/schema"; import { cn } from "@/lib/utils"; -import { Book, ComputerIcon, Globe, Info, LogOut, Settings, Sparkles, SwatchBook, User } from "lucide-react"; +import { + Book, + ComputerIcon, + Globe, + Info, + LogOut, + Settings, + Sparkles, + SwatchBook, + User, +} from "lucide-react"; import type { Route } from "next"; import type { Session } from "next-auth"; import { useTheme } from "next-themes"; import Link from "next/link"; import { Fragment, useState } from "react"; -export default function Navigation({ dbUser, session }: { dbUser: SelectUser; session: Session | null }) { - const { name, email, image } = session?.user || {}; - const [open, setDialogOpen] = useState(false); - const { themes, setTheme } = useTheme(); - const navigationItems: { - icon: React.ReactNode; - label: string; - href: Route; - adminOnly: boolean; - }[] = [ - { - icon: , - label: "Dashboard", - href: "/", - adminOnly: false, - }, - { - label: "Admin", - href: "/admin", - icon: , - adminOnly: true, - }, - ]; - const projectsUsed = [ - { - name: "noVNC", - url: "https://github.com/noVNC/noVNC", - }, - { - name: "shadcn/ui", - url: "https://ui.shadcn.com/", - }, - ]; - const developers = ["incognitotgt", "yosoof3"]; - return ( - + ); }