app-shell-1

1"use client"
2 
3import {
4  RiHome5Line,
5  RiLayoutGridLine,
6  RiBarChartBoxLine,
7  RiUserLine,
8  RiSettings3Line,
9  RiNotification3Line,
10  RiArrowUpLine,
11  RiArrowDownLine,
12  RiMoreLine,
13  RiCheckboxCircleLine,
14  RiTimeLine,
15  RiFileTextLine,
16  RiUser3Line,
17  RiLogoutBoxRLine,
18  RiPaletteLine,
19  RiGlobalLine,
20  RiShieldUserLine,
21  RiChat3Line,
22  RiErrorWarningLine,
23  RiSearchLine,
24} from "@remixicon/react"
25 
26import * as React from "react"
27import type { ReactElement } from "react"
28 
29import { Avatar, AvatarFallback, AvatarImage } from "@/components/ui/avatar"
30import { Button } from "@/components/ui/button"
31import { Badge } from "@/components/ui/badge"
32import {
33  Popover,
34  PopoverContent,
35  PopoverTrigger,
36} from "@/components/ui/popover"
37import { Separator } from "@/components/ui/separator"
38import {
39  DropdownMenu,
40  DropdownMenuContent,
41  DropdownMenuItem,
42  DropdownMenuSeparator,
43  DropdownMenuTrigger,
44} from "@/components/ui/dropdown-menu"
45import {
46  Command,
47  CommandDialog,
48  CommandEmpty,
49  CommandGroup,
50  CommandInput,
51  CommandItem,
52  CommandList,
53} from "@/components/ui/command"
54import { Kbd, KbdGroup } from "@/components/ui/kbd"
55import {
56  Progress,
57  ProgressLabel,
58  ProgressValue,
59} from "@/components/ui/progress"
60import {
61  Sidebar,
62  SidebarContent,
63  SidebarFooter,
64  SidebarGroup,
65  SidebarGroupContent,
66  SidebarGroupLabel,
67  SidebarHeader,
68  SidebarInset,
69  SidebarMenu,
70  SidebarMenuButton,
71  SidebarMenuItem,
72  SidebarProvider,
73  SidebarTrigger,
74} from "@/components/ui/sidebar"
75 
76const navItems = [
77  { label: "Dashboard", icon: RiHome5Line, active: true },
78  { label: "Projects", icon: RiLayoutGridLine, active: false },
79  { label: "Analytics", icon: RiBarChartBoxLine, active: false },
80  { label: "Team", icon: RiUserLine, active: false },
81  { label: "Settings", icon: RiSettings3Line, active: false },
82]
83 
84const workspaces = [
85  { label: "Design System", icon: RiPaletteLine },
86  { label: "Marketing Site", icon: RiGlobalLine },
87  { label: "Admin Panel", icon: RiShieldUserLine },
88]
89 
90const navCommands = [
91  ...navItems.map((item) => ({
92    label: `Go to ${item.label}`,
93    icon: item.icon,
94  })),
95  ...workspaces.map((ws) => ({ label: `Open ${ws.label}`, icon: ws.icon })),
96]
97 
98const actionCommands = [
99  { label: "Invite a teammate", icon: RiUser3Line },
100  { label: "View notifications", icon: RiNotification3Line },
101]
102 
103const stats = [
104  { label: "Total revenue", value: "$48,240", delta: "+12.5%", positive: true },
105// … truncated