initialize

2026-03-26 03:49:05 +03:00
parent e9211a4aba
commit 5dc54ffd00
146 changed files with 12078 additions and 146 deletions
@@ -0,0 +1,12 @@
+import { LoginForm } from "@/modules/auth/login-form";
+
+ 
+export default function Page() {
+  return (
+    <div className="flex min-h-svh w-full items-center justify-center p-6 md:p-10">
+      <div className="w-full max-w-sm">
+        <LoginForm />
+      </div>
+    </div>
+  )
+}
@@ -0,0 +1,218 @@
+"use client"
+
+import type { NavGroup } from "@/base/types/navigation"
+import {
+  AlarmClockIcon,
+  AwardIcon,
+  BanknoteArrowDownIcon,
+  BarChart3Icon,
+  BellRingIcon,
+  BookIcon,
+  BriefcaseBusinessIcon,
+  Building2Icon,
+  CalendarCheck2Icon,
+  CalendarDaysIcon,
+  LayoutDashboardIcon,
+  ClipboardListIcon,
+  UsersIcon,
+  CalendarIcon,
+  CarIcon,
+  ClipboardCheckIcon,
+  Clock3Icon,
+  ClockIcon,
+  GemIcon,
+  GitBranchIcon,
+  HandCoinsIcon,
+  ListIcon,
+  ListTodoIcon,
+  MegaphoneIcon,
+  PackageIcon,
+  PhoneCallIcon,
+  PlugZapIcon,
+  ReceiptIcon,
+  ReceiptTextIcon,
+  SettingsIcon,
+  ShoppingBasketIcon,
+  CircleDollarSign,
+  StarIcon,
+  StoreIcon,
+  TimerIcon,
+  UserCogIcon,
+  WalletIcon,
+  WrenchIcon,
+  ShoppingCartIcon,
+} from "lucide-react"
+import Image from "next/image"
+import { DashboardLayout } from "@/base/components/layout/dashboard"
+import { useAuth } from "@/shared/hooks/use-auth"
+
+const navGroups: NavGroup[] = [
+  {
+    items: [
+      {
+        title: "Dashboard",
+        href: "/",
+        icon: <LayoutDashboardIcon />,
+      },
+      {
+        title: "Job Cards",
+        href: "/sales/workorder/list",
+        icon: <ClipboardListIcon />,
+      },
+      {
+        title: "Customer & Vehicles",
+        href: "/customer_vehicles",
+        icon: <UsersIcon />,
+      },
+      {
+        title: "Reports",
+        href: "/reports",
+        icon: <BarChart3Icon />,
+      },
+    ],
+  },
+  {
+    label: "Management",
+    items: [
+      {
+        title: "Calendars",
+        href: "/calendars",
+        icon: <CalendarIcon />,
+        items: [
+          { title: "Work Schedule", href: "/calendar/work_schedule/list", icon: <Clock3Icon /> },
+          { title: "Appointments", href: "/calendar/appointment/list", icon: <CalendarCheck2Icon /> },
+        ],
+      },
+      {
+        title: "Sales",
+        href: "/sales",
+        icon: <CircleDollarSign />,
+        items: [
+          { title: "Customers", href: "/sales/customers", icon: <UsersIcon /> },
+          { title: "Vehicles", href: "/sales/vehicles", icon: <CarIcon /> },
+          { title: "Inspections", href: "/sales/inspections", icon: <ClipboardCheckIcon /> },
+          { title: "Estimates", href: "/sales/estimate", icon: <ReceiptTextIcon /> },
+          { title: "Job Cards", href: "/sales/workorder/list", icon: <ClipboardListIcon /> },
+          { title: "Invoices", href: "/sales/invoice", icon: <ReceiptIcon /> },
+          { title: "Payments Received", href: "/sales/payment_received", icon: <HandCoinsIcon /> },
+          { title: "Credit Notes", href: "/sales/credit_notes", icon: <ReceiptTextIcon /> },
+        ],
+      },
+      {
+        title: "Purchases",
+        href: "/purchases",
+        icon: <ShoppingCartIcon />,
+        items: [
+          { title: "Vendors", href: "/purchase/vendor", icon: <StoreIcon /> },
+          { title: "Expenses", href: "/purchase/expense", icon: <WalletIcon /> },
+          { title: "Purchase Orders", href: "/purchase/purchase_order", icon: <ShoppingBasketIcon /> },
+          { title: "Bills", href: "/purchase/bill", icon: <ReceiptIcon /> },
+          { title: "Payments Made", href: "/purchase/payments_made", icon: <BanknoteArrowDownIcon /> },
+          { title: "Vendor Credits", href: "/purchase/vendor_credit", icon: <ReceiptTextIcon /> },
+        ],
+      },
+      {
+        title: "CRM",
+        href: "/crm",
+        icon: <BriefcaseBusinessIcon />,
+        items: [
+          { title: "Leads", href: "/crm/leads/list", icon: <GemIcon /> },
+          { title: "Calls", href: "/crm/calls_follow_up/list", icon: <PhoneCallIcon /> },
+          { title: "Tasks", href: "/crm/tasks/list", icon: <ListTodoIcon /> },
+        ],
+      },
+      {
+        title: "Marketing",
+        href: "/marketing",
+        icon: <MegaphoneIcon />,
+        items: [
+          { title: "Service Reminders", href: "/marketing/service_reminder/list", icon: <AlarmClockIcon /> },
+          { title: "Rating & Reviews", href: "/marketing/rating_review", icon: <StarIcon /> },
+          { title: "Google Business Reviews", href: "/marketing/google_rating_review", icon: <AwardIcon /> },
+        ],
+      },
+      {
+        title: "Accountants",
+        href: "/accountants",
+        icon: <BookIcon />,
+        items: [
+          { title: "Manual Journals", href: "/accountants/manual_journal", icon: <BookIcon /> },
+          { title: "Chart of Accounts", href: "/accountants/chart_of_account", icon: <GitBranchIcon /> },
+        ],
+      },
+      {
+        title: "Employees",
+        href: "/productivity",
+        icon: <UserCogIcon />,
+        items: [
+          { title: "Employees", href: "/productivity/employees", icon: <UsersIcon /> },
+          { title: "Time Clocks", href: "/productivity/time_clocks", icon: <TimerIcon /> },
+          { title: "Time Sheets", href: "/productivity/timesheet", icon: <ClockIcon /> },
+          { title: "Payroll", href: "/productivity/payroll", icon: <WalletIcon /> },
+          { title: "Payments Made", href: "/productivity/employee_payments_made", icon: <HandCoinsIcon /> },
+          { title: "Shop Calendars", href: "/productivity/shop_calendars", icon: <CalendarDaysIcon /> },
+          { title: "Shop Timing", href: "/productivity/shop_timings", icon: <Clock3Icon /> },
+          { title: "Holidays", href: "/productivity/holidays", icon: <CalendarIcon /> },
+        ],
+      },
+      {
+        title: "Items",
+        href: "/items",
+        icon: <PackageIcon />,
+        items: [
+          { title: "Services", href: "/items/services", icon: <WrenchIcon /> },
+          { title: "Parts", href: "/items/parts", icon: <WrenchIcon /> },
+          { title: "Expense Item", href: "/items/expense_item", icon: <WalletIcon /> },
+          { title: "Service Group", href: "/items/service_group", icon: <PackageIcon /> },
+          { title: "Inspections", href: "/items/inspection", icon: <ClipboardCheckIcon /> },
+          { title: "Inventory Adjustments", href: "/items/adjustment", icon: <ListIcon /> },
+        ],
+      },
+      {
+        title: "Settings",
+        href: "/setting",
+        icon: <SettingsIcon />,
+        items: [
+          { title: "Company", href: "/setting/company", icon: <Building2Icon /> },
+          { title: "Shop Types", href: "/setting/shop_type", icon: <CarIcon /> },
+          { title: "Tax & Rates", href: "/setting/tax_rates", icon: <ReceiptTextIcon /> },
+          { title: "Configurations", href: "/setting/configurations/preferences/sales", icon: <SettingsIcon /> },
+          { title: "Templates", href: "/setting/templates", icon: <ClipboardListIcon /> },
+          { title: "Integrations", href: "/setting/integrations/providers", icon: <PlugZapIcon /> },
+          { title: "Master", href: "/setting/master/body_type", icon: <ListIcon /> },
+        ],
+      },
+    ],
+  },
+]
+
+function Logo() {
+  return (
+    <div className="flex items-center gap-2">
+        <Image alt="Logo" src={'/assets/logo.png'} height={200} width={200}/>
+    </div>
+  )
+}
+
+export default function AuthenticatedLayout({
+  children,
+}: {
+  children: React.ReactNode
+}) {
+  const { user } = useAuth()
+
+  const userInfo = user
+    ? {
+        name: user.name,
+        email: user.email,
+        initials: user.name.charAt(0).toUpperCase(),
+      }
+    : undefined
+
+  return (
+    <DashboardLayout navGroups={navGroups} logo={<Logo />} user={userInfo}>
+      {children}
+    </DashboardLayout>
+  )
+}
+
@@ -0,0 +1,14 @@
+import { DashboardHeader } from "@/base/components/layout/dashboard";
+import DashboardPage from "@/base/components/layout/dashboard/dashboard-page";
+export default function page() {
+  return (
+    <DashboardPage header={<DashboardHeader />} >
+      <div className="space-y-6">
+        <h1 className="text-2xl font-bold tracking-tight">Dashboard</h1>
+        <p className="text-muted-foreground">
+          Welcome to your dashboard. Select an item from the sidebar to get started.
+        </p>
+      </div>
+    </DashboardPage>
+  )
+}
@@ -0,0 +1,54 @@
+"use client"
+
+import { ResourcePage } from '@/shared/data-view/resource-page'
+import { ColumnHeader } from '@/shared/data-view/table-view'
+import { CustomerForm } from '@/modules/customers/customer-form'
+import { CUSTOMER_ROUTES } from '@repo/api'
+import type { CustomersClient } from '@repo/api'
+import { Building2Icon,   UserIcon } from 'lucide-react'
+
+export default function CustomersPage() {
+    return (
+        <ResourcePage<CustomersClient>
+            pageTitle='Customers'
+            title="Customer"
+            routeKey={CUSTOMER_ROUTES.INDEX}
+            getClient={(api) => api.customers}
+            columns={({ actionsColumn }) => [
+
+                {
+                    accessorKey: "first_name",
+                    header: ({ column }) => <ColumnHeader column={column} title="Customer" />,
+                    cell: ({ row }) => {
+                        const customerName = row.original.first_name
+                        const isCompany = row.original.customer_type?.name?.toLocaleLowerCase() === "company";
+                        const companyName = row.original.company_name 
+                        const name = isCompany && companyName ? `${customerName} (${row.original.last_name})` : customerName
+                    
+                    return (<div className="flex items-center gap-2">
+                            {isCompany ? <Building2Icon className="text-muted-foreground" /> : <UserIcon className="text-muted-foreground" />}
+                            <span>{name}</span>
+                        </div>
+                        )
+                    },
+                },
+                {
+                    accessorKey: "email",
+                    header: ({ column }) => <ColumnHeader column={column} title="Email" />,
+                },
+                {
+                    accessorKey: "phone",
+                    header: ({ column }) => <ColumnHeader column={column} title="Phone" />,
+                },
+                actionsColumn(),
+            ]}
+            renderForm={({ resourceId, initialData, onSuccess }) => (
+                <CustomerForm
+                    resourceId={resourceId}
+                    initialData={initialData}
+                    onSuccess={onSuccess}
+                />
+            )}
+        />
+    )
+}
@@ -0,0 +1,58 @@
+"use client"
+
+import { ResourcePage } from '@/shared/data-view/resource-page'
+import { ColumnHeader } from '@/shared/data-view/table-view'
+import { VehicleForm } from '@/modules/vehicles/vehicle-form'
+import { VEHICLE_ROUTES } from '@repo/api'
+import type { VehiclesClient } from '@repo/api'
+import { CarIcon } from 'lucide-react'
+
+export default function VehiclesPage() {
+    return (
+        <ResourcePage<VehiclesClient>
+            pageTitle="Vehicles"
+            title="Vehicle"
+            routeKey={VEHICLE_ROUTES.INDEX}
+            getClient={(api) => api.vehicles}
+            columns={({ actionsColumn }) => [
+                {
+                    accessorKey: "name",
+                    header: ({ column }) => <ColumnHeader column={column} title="Vehicle" />,
+                    cell: ({ row }) => {
+                        const r = row.original as any
+                        const display = r.name || `${r.make ?? ""} ${r.model ?? ""}`.trim() || "—"
+                        return (
+                            <div className="flex items-center gap-2">
+                                <CarIcon className="h-4 w-4 text-muted-foreground" />
+                                <span>{display}</span>
+                            </div>
+                        )
+                    },
+                },
+                {
+                    accessorKey: "year",
+                    header: ({ column }) => <ColumnHeader column={column} title="Year" />,
+                    cell: ({ row }) => (row.original as any).year ?? "—",
+                },
+                {
+                    accessorKey: "license_plate",
+                    header: ({ column }) => <ColumnHeader column={column} title="License Plate" />,
+                    cell: ({ row }) => (row.original as any).license_plate ?? "—",
+                },
+                {
+                    accessorKey: "mileage",
+                    header: ({ column }) => <ColumnHeader column={column} title="Mileage" />,
+                    cell: ({ row }) => (row.original as any).mileage ?? "—",
+                },
+                actionsColumn(),
+            ]}
+            renderForm={({ resourceId, initialData, onSuccess }) => (
+                <VehicleForm
+                    resourceId={resourceId}
+                    initialData={initialData}
+                    onSuccess={onSuccess}
+                />
+            )}
+        />
+    )
+}
@@ -0,0 +1,54 @@
+"use client"
+
+import { ResourcePage } from "@/shared/data-view/resource-page"
+import { ColumnHeader } from "@/shared/data-view/table-view"
+import { ShopTypeForm } from "@/modules/settings/shop-type/shop-type-form"
+import { SHOP_TYPE_ROUTES } from "@repo/api"
+import type { ShopTypesClient } from "@repo/api"
+import { CheckIcon, XIcon } from "lucide-react"
+
+export default function ShopTypesPage() {
+    return (
+        <ResourcePage<ShopTypesClient>
+            pageTitle="Shop Types"
+            title="Shop Type"
+            routeKey={SHOP_TYPE_ROUTES.INDEX}
+            getClient={(api) => api.shopTypes}
+            columns={({ actionsColumn }) => [
+                {
+                    accessorKey: "title",
+                    header: ({ column }) => <ColumnHeader column={column} title="Title" />,
+                },
+                {
+                    accessorKey: "shop_type",
+                    header: ({ column }) => <ColumnHeader column={column} title="Type" />,
+                },
+                {
+                    accessorKey: "note",
+                    header: ({ column }) => <ColumnHeader column={column} title="Note" />,
+                    cell: ({ row }) => (
+                        <span className="text-muted-foreground line-clamp-1">
+                            {(row.original as any).note ?? "—"}
+                        </span>
+                    ),
+                },
+                {
+                    accessorKey: "is_default",
+                    header: ({ column }) => <ColumnHeader column={column} title="Default" />,
+                    cell: ({ row }) =>
+                        (row.original as any).is_default
+                            ? <CheckIcon className="h-4 w-4 text-green-600" />
+                            : <XIcon className="h-4 w-4 text-muted-foreground" />,
+                },
+                actionsColumn(),
+            ]}
+            renderForm={({ resourceId, initialData, onSuccess }) => (
+                <ShopTypeForm
+                    resourceId={resourceId}
+                    initialData={initialData}
+                    onSuccess={onSuccess}
+                />
+            )}
+        />
+    )
+}
@@ -5,125 +5,175 @@
@custom-variant dark (&:is(.dark *));

@theme inline {
-    --font-heading: var(--font-sans);
-    --font-sans: var(--font-sans);
-    --color-sidebar-ring: var(--sidebar-ring);
-    --color-sidebar-border: var(--sidebar-border);
-    --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
-    --color-sidebar-accent: var(--sidebar-accent);
-    --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
-    --color-sidebar-primary: var(--sidebar-primary);
-    --color-sidebar-foreground: var(--sidebar-foreground);
-    --color-sidebar: var(--sidebar);
-    --color-chart-5: var(--chart-5);
-    --color-chart-4: var(--chart-4);
-    --color-chart-3: var(--chart-3);
-    --color-chart-2: var(--chart-2);
-    --color-chart-1: var(--chart-1);
-    --color-ring: var(--ring);
-    --color-input: var(--input);
-    --color-border: var(--border);
-    --color-destructive: var(--destructive);
-    --color-accent-foreground: var(--accent-foreground);
-    --color-accent: var(--accent);
-    --color-muted-foreground: var(--muted-foreground);
-    --color-muted: var(--muted);
-    --color-secondary-foreground: var(--secondary-foreground);
-    --color-secondary: var(--secondary);
-    --color-primary-foreground: var(--primary-foreground);
-    --color-primary: var(--primary);
-    --color-popover-foreground: var(--popover-foreground);
-    --color-popover: var(--popover);
-    --color-card-foreground: var(--card-foreground);
-    --color-card: var(--card);
-    --color-foreground: var(--foreground);
-    --color-background: var(--background);
-    --radius-sm: calc(var(--radius) * 0.6);
-    --radius-md: calc(var(--radius) * 0.8);
-    --radius-lg: var(--radius);
-    --radius-xl: calc(var(--radius) * 1.4);
-    --radius-2xl: calc(var(--radius) * 1.8);
-    --radius-3xl: calc(var(--radius) * 2.2);
-    --radius-4xl: calc(var(--radius) * 2.6);
+  --font-heading: var(--font-sans);
+  --font-sans: var(--font-sans);
+  --color-sidebar-ring: var(--sidebar-ring);
+  --color-sidebar-border: var(--sidebar-border);
+  --color-sidebar-accent-foreground: var(--sidebar-accent-foreground);
+  --color-sidebar-accent: var(--sidebar-accent);
+  --color-sidebar-primary-foreground: var(--sidebar-primary-foreground);
+  --color-sidebar-primary: var(--sidebar-primary);
+  --color-sidebar-foreground: var(--sidebar-foreground);
+  --color-sidebar: var(--sidebar);
+  --color-chart-5: var(--chart-5);
+  --color-chart-4: var(--chart-4);
+  --color-chart-3: var(--chart-3);
+  --color-chart-2: var(--chart-2);
+  --color-chart-1: var(--chart-1);
+  --color-ring: var(--ring);
+  --color-input: var(--input);
+  --color-border: var(--border);
+  --color-destructive: var(--destructive);
+  --color-accent-foreground: var(--accent-foreground);
+  --color-accent: var(--accent);
+  --color-muted-foreground: var(--muted-foreground);
+  --color-muted: var(--muted);
+  --color-secondary-foreground: var(--secondary-foreground);
+  --color-secondary: var(--secondary);
+  --color-primary-foreground: var(--primary-foreground);
+  --color-primary: var(--primary);
+  --color-popover-foreground: var(--popover-foreground);
+  --color-popover: var(--popover);
+  --color-card-foreground: var(--card-foreground);
+  --color-card: var(--card);
+  --color-foreground: var(--foreground);
+  --color-background: var(--background);
+  --radius-sm: calc(var(--radius) * 0.6);
+  --radius-md: calc(var(--radius) * 0.8);
+  --radius-lg: var(--radius);
+  --radius-xl: calc(var(--radius) * 1.4);
+  --radius-2xl: calc(var(--radius) * 1.8);
+  --radius-3xl: calc(var(--radius) * 2.2);
+  --radius-4xl: calc(var(--radius) * 2.6);
+
+  --shadow-glow : 0 0 10px var(--primary);
 }

 :root {
-    --background: oklch(1 0 0);
-    --foreground: oklch(0.145 0 0);
-    --card: oklch(1 0 0);
-    --card-foreground: oklch(0.145 0 0);
-    --popover: oklch(1 0 0);
-    --popover-foreground: oklch(0.145 0 0);
-    --primary: oklch(0.205 0 0);
-    --primary-foreground: oklch(0.985 0 0);
-    --secondary: oklch(0.97 0 0);
-    --secondary-foreground: oklch(0.205 0 0);
-    --muted: oklch(0.97 0 0);
-    --muted-foreground: oklch(0.556 0 0);
-    --accent: oklch(0.97 0 0);
-    --accent-foreground: oklch(0.205 0 0);
-    --destructive: oklch(0.577 0.245 27.325);
-    --border: oklch(0.922 0 0);
-    --input: oklch(0.922 0 0);
-    --ring: oklch(0.708 0 0);
-    --chart-1: oklch(0.87 0 0);
-    --chart-2: oklch(0.556 0 0);
-    --chart-3: oklch(0.439 0 0);
-    --chart-4: oklch(0.371 0 0);
-    --chart-5: oklch(0.269 0 0);
-    --radius: 0.625rem;
-    --sidebar: oklch(0.985 0 0);
-    --sidebar-foreground: oklch(0.145 0 0);
-    --sidebar-primary: oklch(0.205 0 0);
-    --sidebar-primary-foreground: oklch(0.985 0 0);
-    --sidebar-accent: oklch(0.97 0 0);
-    --sidebar-accent-foreground: oklch(0.205 0 0);
-    --sidebar-border: oklch(0.922 0 0);
-    --sidebar-ring: oklch(0.708 0 0);
+  --background: oklch(96.416% 0.00011 271.152);
+  --foreground: oklch(0.062 0 0);
+  --card: oklch(0.975 0 0);
+  --card-foreground: oklch(0.281 0 0);
+  --popover: oklch(1 0 0);
+  --popover-foreground: oklch(0.145 0 0);
+  --primary: oklch(0.577 0.245 27.325);
+  --primary-foreground: oklch(0.985 0 0);
+  --secondary: oklch(0.97 0 0);
+  --secondary-foreground: oklch(0.205 0 0);
+  --muted: oklch(0.949 0 0);
+  --muted-foreground: oklch(0.6 0 0);
+  --accent: oklch(0.97 0 0);
+  --accent-foreground: oklch(0.205 0 0);
+  --destructive: oklch(0.577 0.245 27.325);
+  --border: oklch(0.922 0 0);
+  --input: oklch(0.922 0 0);
+  --ring: oklch(0.708 0 0);
+  --chart-1: oklch(0.87 0 0);
+  --chart-2: oklch(0.556 0 0);
+  --chart-3: oklch(0.439 0 0);
+  --chart-4: oklch(0.371 0 0);
+  --chart-5: oklch(0.269 0 0);
+  --radius: 0.625rem;
+  --sidebar: oklch(0.985 0 0);
+  --sidebar-foreground: oklch(0.145 0 0);
+  --sidebar-primary: oklch(0.205 0 0);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.97 0 0);
+  --sidebar-accent-foreground: oklch(0.205 0 0);
+  --sidebar-border: oklch(0.922 0 0);
+  --sidebar-ring: oklch(0.708 0 0);
 }

 .dark {
-    --background: oklch(0.145 0 0);
-    --foreground: oklch(0.985 0 0);
-    --card: oklch(0.205 0 0);
-    --card-foreground: oklch(0.985 0 0);
-    --popover: oklch(0.205 0 0);
-    --popover-foreground: oklch(0.985 0 0);
-    --primary: oklch(0.922 0 0);
-    --primary-foreground: oklch(0.205 0 0);
-    --secondary: oklch(0.269 0 0);
-    --secondary-foreground: oklch(0.985 0 0);
-    --muted: oklch(0.269 0 0);
-    --muted-foreground: oklch(0.708 0 0);
-    --accent: oklch(0.269 0 0);
-    --accent-foreground: oklch(0.985 0 0);
-    --destructive: oklch(0.704 0.191 22.216);
-    --border: oklch(1 0 0 / 10%);
-    --input: oklch(1 0 0 / 15%);
-    --ring: oklch(0.556 0 0);
-    --chart-1: oklch(0.87 0 0);
-    --chart-2: oklch(0.556 0 0);
-    --chart-3: oklch(0.439 0 0);
-    --chart-4: oklch(0.371 0 0);
-    --chart-5: oklch(0.269 0 0);
-    --sidebar: oklch(0.205 0 0);
-    --sidebar-foreground: oklch(0.985 0 0);
-    --sidebar-primary: oklch(0.488 0.243 264.376);
-    --sidebar-primary-foreground: oklch(0.985 0 0);
-    --sidebar-accent: oklch(0.269 0 0);
-    --sidebar-accent-foreground: oklch(0.985 0 0);
-    --sidebar-border: oklch(1 0 0 / 10%);
-    --sidebar-ring: oklch(0.556 0 0);
+  --background: oklch(0.145 0 0);
+  --foreground: oklch(0.985 0 0);
+  --card: oklch(0.205 0 0);
+  --card-foreground: oklch(0.985 0 0);
+  --popover: oklch(0.205 0 0);
+  --popover-foreground: oklch(0.985 0 0);
+  --primary: oklch(75.417% 0.14818 18.15);
+  --primary-foreground: oklch(0.985 0 0);
+  --secondary: oklch(0.269 0 0);
+  --secondary-foreground: oklch(0.985 0 0);
+  --muted: oklch(0.269 0 0);
+  --muted-foreground: oklch(0.708 0 0);
+  --accent: oklch(0.269 0 0);
+  --accent-foreground: oklch(0.985 0 0);
+  --destructive: oklch(0.704 0.191 22.216);
+  --border: oklch(1 0 0 / 10%);
+  --input: oklch(1 0 0 / 15%);
+  --ring: oklch(0.556 0 0);
+  --chart-1: oklch(0.87 0 0);
+  --chart-2: oklch(0.556 0 0);
+  --chart-3: oklch(0.439 0 0);
+  --chart-4: oklch(0.371 0 0);
+  --chart-5: oklch(0.269 0 0);
+  --sidebar: oklch(0.205 0 0);
+  --sidebar-foreground: oklch(0.985 0 0);
+  --sidebar-primary: oklch(0.488 0.243 264.376);
+  --sidebar-primary-foreground: oklch(0.985 0 0);
+  --sidebar-accent: oklch(0.269 0 0);
+  --sidebar-accent-foreground: oklch(0.985 0 0);
+  --sidebar-border: oklch(1 0 0 / 10%);
+  --sidebar-ring: oklch(0.556 0 0);
 }

@layer base {
  * {
    @apply border-border outline-ring/50;
-    }
+  }
+
  body {
    @apply bg-background text-foreground;
-    }
+  }
+
  html {
    @apply font-sans;
-    }
+  }
+}
+
+
+@layer utilities {
+  .dashboard-nav-item {
+    @apply 
+    relative
+    overflow-hidden
+    data-active:bg-primary/10
+    data-active:text-primary
+    data-active:hover:text-primary
+    data-active:hover:bg-primary/15
+    transition-all
+    duration-300;
+  }
+
+  /* Accent bar — only in expanded mode */
+  /* .dashboard-nav-item:not([data-collapsed="true"])::after {
+    content: "";
+    position: absolute;
+    inset-inline-end: 0.25rem;
+    height: 80%;
+    border-radius: var(--radius-md);
+    z-index: 10;
+    box-shadow: 0 0 6px var(--primary);
+  }
+
+  .dashboard-nav-item:not([data-collapsed="true"])[data-active="true"]::after {
+    width: 0.25rem;
+    background-color: var(--primary);
+  } */
+
+  /* Collapsed mode: icon centered, no bar */
+  .dashboard-nav-item[data-collapsed="true"] {
+    @apply justify-center;
+  }
+
+  .dashboard-nav-sub-item {
+    @apply
+    transition-colors
+    duration-200
+    data-active:text-primary
+    data-active:font-medium
+    data-active:bg-primary/5
+    hover:text-primary/80;
+  }
 }
@@ -1,10 +1,14 @@
-import { Geist, Geist_Mono, Inter } from "next/font/google"
+import { Geist_Mono, Inter } from "next/font/google"

 import "./globals.css"
-import { ThemeProvider } from "@/components/theme-provider"
-import { cn } from "@/lib/utils";
+import { QueryProvider } from "@/shared/components/query-provider"
+import { ThemeProvider } from "@/shared/components/theme-provider"
+import { Toaster } from "@/shared/components/ui/sonner"
+import { ConfirmDialog } from "@/shared/components/confirm-dialog"
+import { NuqsAdapter } from "nuqs/adapters/next/app"
+import { cn } from "@/shared/lib/utils"

-const inter = Inter({subsets:['latin'],variable:'--font-sans'})
+const inter = Inter({ subsets: ["latin"], variable: "--font-sans" })

 const fontMono = Geist_Mono({
  subsets: ["latin"],
@@ -23,7 +27,13 @@ export default function RootLayout({
      className={cn("antialiased", fontMono.variable, "font-sans", inter.variable)}
    >
      <body>
-        <ThemeProvider>{children}</ThemeProvider>
+        <NuqsAdapter>
+          <ThemeProvider>
+            <QueryProvider>{children}</QueryProvider>
+            <Toaster />
+            <ConfirmDialog />
+          </ThemeProvider>
+        </NuqsAdapter>
      </body>
    </html>
  )
@@ -1,19 +0,0 @@
-import { Button } from "@/components/ui/button"
-
-export default function Page() {
-  return (
-    <div className="flex min-h-svh p-6">
-      <div className="flex max-w-md min-w-0 flex-col gap-4 text-sm leading-loose">
-        <div>
-          <h1 className="font-medium">Project ready!</h1>
-          <p>You may now add components and start building.</p>
-          <p>We&apos;ve already added the button component for you.</p>
-          <Button className="mt-2">Button</Button>
-        </div>
-        <div className="font-mono text-xs text-muted-foreground">
-          (Press <kbd>d</kbd> to toggle dark mode)
-        </div>
-      </div>
-    </div>
-  )
-}