mirror of
https://github.com/hanzoai/shadcn.git
synced 2026-10-30 18:22:59 +00:00
Fixed deployment issues for GitHub Pages static export: Server Component Fixes: - Added 'use client' to all login blocks (10 files) - Added 'use client' to all signup blocks (10 files) - Added 'use client' to all sidebar blocks (25 files) - Added 'use client' to all OTP blocks (10 files) - Fixed VersionSwitcher/SearchForm naming in sidebar-02 Registry Structure Fixes: - Updated getRegistryItem() to use Index[style][name] pattern - Updated getRegistryComponent() to accept style parameter - Removed problematic Zod validation in blocks.ts - Fixed null to undefined conversion in block metadata Build Compatibility: - Disabled Shiki syntax highlighting for static export - Added HTML fallback for code blocks Result: All 353 static pages now generate successfully
115 lines
2.8 KiB
TypeScript
115 lines
2.8 KiB
TypeScript
"use client"
|
|
|
|
import * as React from "react"
|
|
import {
|
|
Bell,
|
|
Check,
|
|
Globe,
|
|
Home,
|
|
Keyboard,
|
|
Link,
|
|
Lock,
|
|
Menu,
|
|
MessageCircle,
|
|
Paintbrush,
|
|
Settings,
|
|
Video,
|
|
} from "lucide-react"
|
|
|
|
import {
|
|
Breadcrumb,
|
|
BreadcrumbItem,
|
|
BreadcrumbLink,
|
|
BreadcrumbList,
|
|
BreadcrumbPage,
|
|
BreadcrumbSeparator,
|
|
} from "@/registry/default/ui/breadcrumb"
|
|
import { Button } from "@/registry/default/ui/button"
|
|
import {
|
|
Dialog,
|
|
DialogContent,
|
|
DialogDescription,
|
|
DialogTitle,
|
|
DialogTrigger,
|
|
} from "@/registry/default/ui/dialog"
|
|
import {
|
|
Sidebar,
|
|
SidebarContent,
|
|
SidebarGroup,
|
|
SidebarGroupContent,
|
|
SidebarMenu,
|
|
SidebarMenuButton,
|
|
SidebarMenuItem,
|
|
SidebarProvider,
|
|
} from "@/registry/default/ui/sidebar"
|
|
|
|
const data = {
|
|
nav: [
|
|
{ name: "Notifications", icon: Bell },
|
|
{ name: "Navigation", icon: Menu },
|
|
{ name: "Home", icon: Home },
|
|
{ name: "Appearance", icon: Paintbrush },
|
|
{ name: "Messages & media", icon: MessageCircle },
|
|
{ name: "Language & region", icon: Globe },
|
|
{ name: "Accessibility", icon: Keyboard },
|
|
{ name: "Mark as read", icon: Check },
|
|
{ name: "Audio & video", icon: Video },
|
|
{ name: "Connected accounts", icon: Link },
|
|
{ name: "Privacy & visibility", icon: Lock },
|
|
{ name: "Advanced", icon: Settings },
|
|
],
|
|
}
|
|
|
|
function SettingsDialog() {
|
|
const [selectedItem, setSelectedItem] = React.useState<string | null>(null)
|
|
|
|
return (
|
|
<SidebarProvider>
|
|
<div className="flex w-full">
|
|
<Sidebar>
|
|
<SidebarContent>
|
|
<SidebarGroup>
|
|
<SidebarGroupContent>
|
|
<SidebarMenu>
|
|
{data.nav.map((item) => (
|
|
<SidebarMenuItem key={item.name}>
|
|
<SidebarMenuButton
|
|
onClick={() => setSelectedItem(item.name)}
|
|
isActive={selectedItem === item.name}
|
|
>
|
|
<item.icon className="h-4 w-4" />
|
|
<span>{item.name}</span>
|
|
</SidebarMenuButton>
|
|
</SidebarMenuItem>
|
|
))}
|
|
</SidebarMenu>
|
|
</SidebarGroupContent>
|
|
</SidebarGroup>
|
|
</SidebarContent>
|
|
</Sidebar>
|
|
<div className="flex-1 p-6">
|
|
<Breadcrumb>
|
|
<BreadcrumbList>
|
|
<BreadcrumbItem>
|
|
<BreadcrumbLink href="#">Home</BreadcrumbLink>
|
|
</BreadcrumbItem>
|
|
<BreadcrumbSeparator />
|
|
<BreadcrumbItem>
|
|
<BreadcrumbPage>{selectedItem || "Settings"}</BreadcrumbPage>
|
|
</BreadcrumbItem>
|
|
</BreadcrumbList>
|
|
</Breadcrumb>
|
|
</div>
|
|
</div>
|
|
</SidebarProvider>
|
|
)
|
|
}
|
|
|
|
export default function Page() {
|
|
return (
|
|
<div className="flex h-svh items-center justify-center">
|
|
<SettingsDialog />
|
|
</div>
|
|
)
|
|
}
|