dingxingGiteaAdmin/dingxing
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

docs(skills): 添加 Better Auth 最佳实践与安全配置指南

Browse Source
This commit is contained in:
asgerzhou
2026-07-17 15:59:38 +08:00
commit 57628c04d6
72 changed files with 14239 additions and 0 deletions
Download Patch File Download Diff File Expand all files Collapse all files
src/components/app-sidebar.tsx
+223
View File
@@ -0,0 +1,223 @@
"use client";
import * as React from "react";
import Link from "next/link";
import { usePathname, useRouter } from "next/navigation";
import {
LayoutDashboard,
Users,
Settings,
ChevronRight,
LogOut,
ChevronsUpDown,
CloudUpload,
} from "lucide-react";
import {
Sidebar,
SidebarContent,
SidebarGroup,
SidebarGroupLabel,
SidebarHeader,
SidebarMenu,
SidebarMenuButton,
SidebarMenuItem,
SidebarMenuSub,
SidebarMenuSubButton,
SidebarMenuSubItem,
SidebarFooter,
SidebarRail,
} from "@/components/ui/sidebar";
import {
Collapsible,
CollapsibleContent,
CollapsibleTrigger,
} from "@/components/ui/collapsible";
import {
Avatar,
AvatarFallback,
AvatarImage,
} from "@/components/ui/avatar";
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuTrigger,
} from "@/components/ui/dropdown-menu";
import { authClient } from "@/lib/auth-client";
type NavItem = {
title: string;
url: string;
icon: React.ComponentType<{ className?: string }>;
items?: { title: string; url: string }[];
};
const navData: NavItem[] = [
{ title: "仪表盘", url: "/admin", icon: LayoutDashboard },
{
title: "用户管理",
url: "/admin/users",
icon: Users,
items: [
{ title: "用户列表", url: "/admin/users" },
{ title: "角色管理", url: "/admin/users/roles" },
],
},
{ title: "文件管理", url: "/admin/uploads", icon: CloudUpload },
{ title: "设置", url: "/admin/settings", icon: Settings },
];
type SidebarUser = {
name: string;
email: string;
image?: string | null;
};
export function AppSidebar({
user,
...props
}: React.ComponentProps<typeof Sidebar> & { user?: SidebarUser }) {
const pathname = usePathname();
const router = useRouter();
const isActive = (url: string) =>
url === "/admin" ? pathname === url : pathname.startsWith(url);
return (
<Sidebar collapsible="icon" {...props}>
<SidebarHeader>
<SidebarMenu>
<SidebarMenuItem>
<SidebarMenuButton
size="lg"
tooltip="鼎星管理后台"
render={<Link href="/admin" />}
>
<div className="flex aspect-square size-8 items-center justify-center rounded-lg bg-primary text-primary-foreground">
<span className="text-sm font-bold">DX</span>
</div>
<div className="grid flex-1 text-left text-sm leading-tight">
<span className="truncate font-semibold">鼎星管理后台</span>
<span className="truncate text-xs text-muted-foreground">
Admin Console
</span>
</div>
</SidebarMenuButton>
</SidebarMenuItem>
</SidebarMenu>
</SidebarHeader>
<SidebarContent>
<SidebarGroup>
<SidebarGroupLabel>管理</SidebarGroupLabel>
<SidebarMenu>
{navData.map((item) =>
item.items ? (
<Collapsible
key={item.title}
defaultOpen={item.items.some((sub) => isActive(sub.url))}
className="group/collapsible [&[data-open]>li>button>svg:last-child]:rotate-90"
>
<SidebarMenuItem>
<CollapsibleTrigger
render={<SidebarMenuButton tooltip={item.title} />}
>
<item.icon className="size-4" />
<span>{item.title}</span>
<ChevronRight className="ml-auto transition-transform duration-200" />
</CollapsibleTrigger>
<CollapsibleContent>
<SidebarMenuSub>
{item.items.map((sub) => (
<SidebarMenuSubItem key={sub.url}>
<SidebarMenuSubButton
render={<Link href={sub.url} />}
isActive={isActive(sub.url)}
>
<span>{sub.title}</span>
</SidebarMenuSubButton>
</SidebarMenuSubItem>
))}
</SidebarMenuSub>
</CollapsibleContent>
</SidebarMenuItem>
</Collapsible>
) : (
<SidebarMenuItem key={item.title}>
<SidebarMenuButton
isActive={isActive(item.url)}
tooltip={item.title}
render={<Link href={item.url} />}
>
<item.icon className="size-4" />
<span>{item.title}</span>
</SidebarMenuButton>
</SidebarMenuItem>
)
)}
</SidebarMenu>
</SidebarGroup>
</SidebarContent>
<SidebarFooter>
<SidebarMenu>
<SidebarMenuItem>
<DropdownMenu>
<DropdownMenuTrigger
render={<SidebarMenuButton size="lg" />}
>
<Avatar className="size-8">
<AvatarImage src={user?.image ?? ""} alt={user?.name ?? ""} />
<AvatarFallback className="text-xs">
{user?.name?.charAt(0) ?? "U"}
</AvatarFallback>
</Avatar>
<div className="grid flex-1 text-left text-sm leading-tight">
<span className="truncate font-semibold">
{user?.name ?? "用户"}
</span>
<span className="truncate text-xs text-muted-foreground">
{user?.email}
</span>
</div>
<ChevronsUpDown className="ml-auto size-4" />
</DropdownMenuTrigger>
<DropdownMenuContent
side="top"
align="start"
className="w-[--radix-dropdown-menu-trigger-width] min-w-56"
>
<DropdownMenuLabel>
<div className="flex flex-col">
<span className="text-sm font-medium">
{user?.name ?? "用户"}
</span>
<span className="text-xs text-muted-foreground">
{user?.email}
</span>
</div>
</DropdownMenuLabel>
<DropdownMenuSeparator />
<DropdownMenuItem
onClick={async () => {
await authClient.signOut();
router.push("/login");
router.refresh();
}}
>
<LogOut className="size-4" />
退出登录
</DropdownMenuItem>
</DropdownMenuContent>
</DropdownMenu>
</SidebarMenuItem>
</SidebarMenu>
</SidebarFooter>
<SidebarRail />
</Sidebar>
);
}