Fix telegram page redirect: make first user admin and hide admin-only nav items from non-admins

Co-authored-by: xCyanGrizzly <53275238+xCyanGrizzly@users.noreply.github.com>

src/app/(auth)/register/actions.ts

@@ -21,12 +21,16 @@ export async function registerUser(input: unknown): Promise<ActionResult<{ id: s
 
   const hashedPassword = await bcrypt.hash(parsed.data.password, 10);
 
+  // First user to register becomes ADMIN (self-hosted owner)
+  const userCount = await prisma.user.count();
+  const role = userCount === 0 ? "ADMIN" : "USER";
+
   const user = await prisma.user.create({
     data: {
       name: parsed.data.name,
       email: parsed.data.email,
       hashedPassword,
-      role: "USER",
+      role,
       settings: {
         create: {
           lowStockThreshold: 10,

src/components/layout/mobile-sidebar.tsx

@@ -2,6 +2,7 @@
 
 import Link from "next/link";
 import { usePathname } from "next/navigation";
+import { useSession } from "next-auth/react";
 import {
   LayoutDashboard,
   Cylinder,
@@ -17,27 +18,17 @@ import {
   Flame,
 } from "lucide-react";
 import { cn } from "@/lib/utils";
-import { APP_NAME } from "@/lib/constants";
+import { APP_NAME, NAV_ITEMS } from "@/lib/constants";
 import { SheetHeader, SheetTitle } from "@/components/ui/sheet";
 
 const icons = { LayoutDashboard, Cylinder, Droplets, Paintbrush, Gem, FileBox, Send, ClipboardList, Building2, MapPin, Settings };
 
-const navItems = [
-  { label: "Dashboard", href: "/dashboard", icon: "LayoutDashboard" as const },
-  { label: "Filaments", href: "/filaments", icon: "Cylinder" as const },
-  { label: "Resins", href: "/resins", icon: "Droplets" as const },
-  { label: "Paints", href: "/paints", icon: "Paintbrush" as const },
-  { label: "Supplies", href: "/supplies", icon: "Gem" as const },
-  { label: "STL Files", href: "/stls", icon: "FileBox" as const },
-  { label: "Telegram", href: "/telegram", icon: "Send" as const },
-  { label: "Usage", href: "/usage", icon: "ClipboardList" as const },
-  { label: "Vendors", href: "/vendors", icon: "Building2" as const },
-  { label: "Locations", href: "/locations", icon: "MapPin" as const },
-  { label: "Settings", href: "/settings", icon: "Settings" as const },
-];
-
 export function MobileSidebar() {
   const pathname = usePathname();
+  const { data: session } = useSession();
+  const isAdmin = session?.user?.role === "ADMIN";
+
+  const visibleItems = NAV_ITEMS.filter((item) => !item.adminOnly || isAdmin);
 
   return (
     <div className="flex h-full flex-col">
@@ -48,7 +39,7 @@ export function MobileSidebar() {
         </SheetTitle>
       </SheetHeader>
       <nav className="flex-1 space-y-1 p-2">
-        {navItems.map((item) => {
+        {visibleItems.map((item) => {
           const Icon = icons[item.icon];
           const isActive = pathname.startsWith(item.href);
 

src/components/layout/sidebar.tsx

@@ -3,6 +3,7 @@
 import { useState } from "react";
 import Link from "next/link";
 import { usePathname } from "next/navigation";
+import { useSession } from "next-auth/react";
 import {
   LayoutDashboard,
   Cylinder,
@@ -20,7 +21,7 @@ import {
   PanelLeft,
 } from "lucide-react";
 import { cn } from "@/lib/utils";
-import { APP_NAME } from "@/lib/constants";
+import { APP_NAME, NAV_ITEMS } from "@/lib/constants";
 import { Button } from "@/components/ui/button";
 import { Tooltip, TooltipContent, TooltipTrigger } from "@/components/ui/tooltip";
 
@@ -38,23 +39,13 @@ const icons = {
   Settings,
 } as const;
 
-const navItems = [
-  { label: "Dashboard", href: "/dashboard", icon: "LayoutDashboard" as const },
-  { label: "Filaments", href: "/filaments", icon: "Cylinder" as const },
-  { label: "Resins", href: "/resins", icon: "Droplets" as const },
-  { label: "Paints", href: "/paints", icon: "Paintbrush" as const },
-  { label: "Supplies", href: "/supplies", icon: "Gem" as const },
-  { label: "STL Files", href: "/stls", icon: "FileBox" as const },
-  { label: "Telegram", href: "/telegram", icon: "Send" as const },
-  { label: "Usage", href: "/usage", icon: "ClipboardList" as const },
-  { label: "Vendors", href: "/vendors", icon: "Building2" as const },
-  { label: "Locations", href: "/locations", icon: "MapPin" as const },
-  { label: "Settings", href: "/settings", icon: "Settings" as const },
-];
-
 export function Sidebar() {
   const pathname = usePathname();
   const [collapsed, setCollapsed] = useState(false);
+  const { data: session } = useSession();
+  const isAdmin = session?.user?.role === "ADMIN";
+
+  const visibleItems = NAV_ITEMS.filter((item) => !item.adminOnly || isAdmin);
 
   return (
     <aside
@@ -73,7 +64,7 @@ export function Sidebar() {
 
       {/* Navigation */}
       <nav className="flex-1 space-y-1 p-2">
-        {navItems.map((item) => {
+        {visibleItems.map((item) => {
           const Icon = icons[item.icon];
           const isActive = pathname.startsWith(item.href);
 

src/lib/constants.ts

@@ -1,17 +1,17 @@
 export const APP_NAME = "Dragon's Stash";
 
 export const NAV_ITEMS = [
-  { label: "Dashboard", href: "/dashboard", icon: "LayoutDashboard" },
+  { label: "Dashboard", href: "/dashboard", icon: "LayoutDashboard", adminOnly: false },
-  { label: "Filaments", href: "/filaments", icon: "Cylinder" },
+  { label: "Filaments", href: "/filaments", icon: "Cylinder", adminOnly: false },
-  { label: "Resins", href: "/resins", icon: "Droplets" },
+  { label: "Resins", href: "/resins", icon: "Droplets", adminOnly: false },
-  { label: "Paints", href: "/paints", icon: "Paintbrush" },
+  { label: "Paints", href: "/paints", icon: "Paintbrush", adminOnly: false },
-  { label: "Supplies", href: "/supplies", icon: "Gem" },
+  { label: "Supplies", href: "/supplies", icon: "Gem", adminOnly: false },
-  { label: "STL Files", href: "/stls", icon: "FileBox" },
+  { label: "STL Files", href: "/stls", icon: "FileBox", adminOnly: false },
-  { label: "Telegram", href: "/telegram", icon: "Send" },
+  { label: "Telegram", href: "/telegram", icon: "Send", adminOnly: true },
-  { label: "Usage", href: "/usage", icon: "ClipboardList" },
+  { label: "Usage", href: "/usage", icon: "ClipboardList", adminOnly: false },
-  { label: "Vendors", href: "/vendors", icon: "Building2" },
+  { label: "Vendors", href: "/vendors", icon: "Building2", adminOnly: false },
-  { label: "Locations", href: "/locations", icon: "MapPin" },
+  { label: "Locations", href: "/locations", icon: "MapPin", adminOnly: false },
-  { label: "Settings", href: "/settings", icon: "Settings" },
+  { label: "Settings", href: "/settings", icon: "Settings", adminOnly: false },
 ] as const;
 
 export const MATERIALS = [