4f:I[707087,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/1o6_421saitt-.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"RegistryDependencies"] 50:I[314491,["/_next/static/immutable/chunks/3arlv5bvukoo2.js","/_next/static/immutable/chunks/39v64hmfyo-sr.js","/_next/static/immutable/chunks/2nvof3-29tvc3.js","/_next/static/immutable/chunks/3tjobt77z_9dj.js","/_next/static/immutable/chunks/04j_o97cgxn2x.js","/_next/static/immutable/chunks/3upr08c9vtj8w.js","/_next/static/immutable/chunks/1ww0328si-u8x.js","/_next/static/immutable/chunks/11mfl5ymqld9-.js","/_next/static/immutable/chunks/2xxcqy6ppds3l.js","/_next/static/immutable/chunks/1o6_421saitt-.js","/_next/static/immutable/chunks/31nn7jwsjvqii.js","/_next/static/immutable/chunks/43_s7jweyypoh.js","/_next/static/immutable/chunks/0p6vao205o1jc.js","/_next/static/immutable/chunks/1_kyvgkyokw92.js","/_next/static/immutable/chunks/1lo-zn37dolb5.js","/_next/static/immutable/chunks/1v8k6yxw1rg0u.js"],"FilesView"] 51:T6b8,import { AppSidebar } from "@/registry/base-vega/blocks/sidebar-09/components/app-sidebar" import { Breadcrumb, BreadcrumbItem, BreadcrumbLink, BreadcrumbList, BreadcrumbPage, BreadcrumbSeparator, } from "@/registry/base-vega/ui/breadcrumb" import { Separator } from "@/registry/base-vega/ui/separator" import { SidebarInset, SidebarProvider, SidebarTrigger, } from "@/registry/base-vega/ui/sidebar" export default function Page() { return (

All Inboxes Inbox

{Array.from({ length: 24 }).map((_, index) => (

))}

) } 52:T27a5,"use client" import * as React from "react" import { NavUser } from "@/registry/base-vega/blocks/sidebar-09/components/nav-user" import { Label } from "@/registry/base-vega/ui/label" import { Sidebar, SidebarContent, SidebarFooter, SidebarGroup, SidebarGroupContent, SidebarHeader, SidebarInput, SidebarMenu, SidebarMenuButton, SidebarMenuItem, useSidebar, } from "@/registry/base-vega/ui/sidebar" import { Switch } from "@/registry/base-vega/ui/switch" import { IconPlaceholder } from "@/app/(create)/components/icon-placeholder" // This is sample data const data = { user: { name: "shadcn", email: "m@example.com", avatar: "/avatars/shadcn.jpg", }, navMain: [ { title: "Inbox", url: "#", icon: ( ), isActive: true, }, { title: "Drafts", url: "#", icon: ( ), isActive: false, }, { title: "Sent", url: "#", icon: ( ), isActive: false, }, { title: "Junk", url: "#", icon: ( ), isActive: false, }, { title: "Trash", url: "#", icon: ( ), isActive: false, }, ], mails: [ { name: "William Smith", email: "williamsmith@example.com", subject: "Meeting Tomorrow", date: "09:34 AM", teaser: "Hi team, just a reminder about our meeting tomorrow at 10 AM.\nPlease come prepared with your project updates.", }, { name: "Alice Smith", email: "alicesmith@example.com", subject: "Re: Project Update", date: "Yesterday", teaser: "Thanks for the update. The progress looks great so far.\nLet's schedule a call to discuss the next steps.", }, { name: "Bob Johnson", email: "bobjohnson@example.com", subject: "Weekend Plans", date: "2 days ago", teaser: "Hey everyone! I'm thinking of organizing a team outing this weekend.\nWould you be interested in a hiking trip or a beach day?", }, { name: "Emily Davis", email: "emilydavis@example.com", subject: "Re: Question about Budget", date: "2 days ago", teaser: "I've reviewed the budget numbers you sent over.\nCan we set up a quick call to discuss some potential adjustments?", }, { name: "Michael Wilson", email: "michaelwilson@example.com", subject: "Important Announcement", date: "1 week ago", teaser: "Please join us for an all-hands meeting this Friday at 3 PM.\nWe have some exciting news to share about the company's future.", }, { name: "Sarah Brown", email: "sarahbrown@example.com", subject: "Re: Feedback on Proposal", date: "1 week ago", teaser: "Thank you for sending over the proposal. I've reviewed it and have some thoughts.\nCould we schedule a meeting to discuss my feedback in detail?", }, { name: "David Lee", email: "davidlee@example.com", subject: "New Project Idea", date: "1 week ago", teaser: "I've been brainstorming and came up with an interesting project concept.\nDo you have time this week to discuss its potential impact and feasibility?", }, { name: "Olivia Wilson", email: "oliviawilson@example.com", subject: "Vacation Plans", date: "1 week ago", teaser: "Just a heads up that I'll be taking a two-week vacation next month.\nI'll make sure all my projects are up to date before I leave.", }, { name: "James Martin", email: "jamesmartin@example.com", subject: "Re: Conference Registration", date: "1 week ago", teaser: "I've completed the registration for the upcoming tech conference.\nLet me know if you need any additional information from my end.", }, { name: "Sophia White", email: "sophiawhite@example.com", subject: "Team Dinner", date: "1 week ago", teaser: "To celebrate our recent project success, I'd like to organize a team dinner.\nAre you available next Friday evening? Please let me know your preferences.", }, ], } export function AppSidebar({ ...props }: React.ComponentProps) { // Note: I'm using state to show active item. // IRL you should use the url/router. const [activeItem, setActiveItem] = React.useState(data.navMain[0]) const [mails, setMails] = React.useState(data.mails) const { setOpen } = useSidebar() return ( {/* This is the first sidebar */} {/* We disable collapsible and adjust width to icon. */} {/* This will make the sidebar appear as icons. */} } >

Acme Inc Enterprise

{data.navMain.map((item) => ( { setActiveItem(item) const mail = data.mails.sort(() => Math.random() - 0.5) setMails( mail.slice( 0, Math.max(5, Math.floor(Math.random() * 10) + 1) ) ) setOpen(true) }} isActive={activeItem?.title === item.title} className="px-2.5 md:px-2" > {item.icon} {item.title} ))} {/* This is the second sidebar */} {/* We disable collapsible and let it fill remaining space */}

{activeItem?.title}

Unreads

{mails.map((mail) => (

{mail.name}{" "} {mail.date}

{mail.subject} {mail.teaser} ))} ) } 53:T129c,"use client" import { Avatar, AvatarFallback, AvatarImage, } from "@/registry/base-vega/ui/avatar" import { DropdownMenu, DropdownMenuContent, DropdownMenuGroup, DropdownMenuItem, DropdownMenuLabel, DropdownMenuSeparator, DropdownMenuTrigger, } from "@/registry/base-vega/ui/dropdown-menu" import { SidebarMenu, SidebarMenuButton, SidebarMenuItem, useSidebar, } from "@/registry/base-vega/ui/sidebar" import { IconPlaceholder } from "@/app/(create)/components/icon-placeholder" export function NavUser({ user, }: { user: { name: string email: string avatar: string } }) { const { isMobile } = useSidebar() return ( } > CN

{user.name} {user.email}

Upgrade to Pro Account Billing Notifications Log out ) } 4e:["$","div",null,{"className":"mt-3 flex min-h-0 min-w-0 flex-1 flex-col gap-3","children":[["$","div",null,{"className":"flex shrink-0 items-start gap-3","children":[["$","div",null,{"className":"flex max-h-28 min-w-0 flex-1 flex-wrap items-center gap-2 overflow-y-auto","children":[null,["$","$L4f",null,{"namespace":"@catalogs","registryDependencies":["sidebar","breadcrumb","separator","collapsible","dropdown-menu","avatar","switch","label"]}]]}],null]}],["$","$L50",null,{"files":[{"path":"registry/base-vega/blocks/sidebar-09/page.tsx","content":"$51","type":"registry:page","target":"app/dashboard/page.tsx"},{"path":"registry/base-vega/blocks/sidebar-09/components/app-sidebar.tsx","content":"$52","type":"registry:component"},{"path":"registry/base-vega/blocks/sidebar-09/components/nav-user.tsx","content":"$53","type":"registry:component"}],"className":"h-[70svh] min-h-80"}]]}]