feat: cleanup routes

src/app/(dashboard)/dashboard/layout.tsx

@@ -1,13 +1,13 @@
 import { redirect } from "next/navigation"
 
-import { getStoresByUserId } from "@/lib/actions/store"
+import { getStoresByUserId } from "@/lib/queries/store"
 import { getCachedUser, getUserPlanMetrics } from "@/lib/queries/user"
 
-import { DashboardHeader } from "./_components/dashboard-header"
-import { DashboardSidebar } from "./_components/dashboard-sidebar"
-import { DashboardSidebarSheet } from "./_components/dashboard-sidebar-sheet"
-import { SidebarProvider } from "./_components/sidebar-provider"
-import { StoreSwitcher } from "./_components/store-switcher"
+import { SidebarProvider } from "../../../components/layouts/sidebar-provider"
+import { DashboardHeader } from "../store/[storeId]/_components/dashboard-header"
+import { DashboardSidebar } from "../store/[storeId]/_components/dashboard-sidebar"
+import { DashboardSidebarSheet } from "../store/[storeId]/_components/dashboard-sidebar-sheet"
+import { StoreSwitcher } from "../store/[storeId]/_components/store-switcher"
 
 export default async function DashboardLayout({
   children,
@@ -24,7 +24,10 @@ export default async function DashboardLayout({
   return (
     <SidebarProvider>
       <div className="grid min-h-screen w-full lg:grid-cols-[17.5rem_1fr]">
-        <DashboardSidebar className="top-0 z-30 hidden flex-col gap-4 border-r border-border/60 lg:sticky lg:block">
+        <DashboardSidebar
+          storeId="storeId"
+          className="top-0 z-30 hidden flex-col gap-4 border-r border-border/60 lg:sticky lg:block"
+        >
           <StoreSwitcher
             userId={user.id}
             storesPromise={storesPromise}
@@ -34,7 +37,7 @@ export default async function DashboardLayout({
         <div className="flex flex-col">
           <DashboardHeader user={user}>
             <DashboardSidebarSheet className="lg:hidden">
-              <DashboardSidebar>
+              <DashboardSidebar storeId="storeId">
                 <StoreSwitcher
                   userId={user.id}
                   storesPromise={storesPromise}

src/app/(dashboard)/dashboard/stores/_components/create-store-dialog.tsx → src/app/(dashboard)/store/[storeId]/_components/create-store-dialog.tsx

@@ -7,7 +7,7 @@ import { HoverCardPortal } from "@radix-ui/react-hover-card"
 import { useForm, type UseFormReturn } from "react-hook-form"
 import { toast } from "sonner"
 
-import { addStore } from "@/lib/actions/store"
+import { createStore } from "@/lib/actions/store"
 import { type getUserPlanMetrics } from "@/lib/queries/user"
 import { cn } from "@/lib/utils"
 import {
@@ -85,7 +85,7 @@ export function CreateStoreDialog({
   async function onSubmit(input: CreateStoreSchema) {
     setLoading(true)
 
-    const { data, error } = await addStore({ ...input, userId })
+    const { data, error } = await createStore({ ...input, userId })
 
     if (error) {
       toast.error(error)

src/app/(dashboard)/dashboard/_components/dashboard-sidebar-sheet.tsx → src/app/(dashboard)/store/[storeId]/_components/dashboard-sidebar-sheet.tsx

@@ -13,7 +13,7 @@ import {
 } from "@/components/ui/sheet"
 import { Icons } from "@/components/icons"
 
-import { useSidebar } from "./sidebar-provider"
+import { useSidebar } from "../../../../../components/layouts/sidebar-provider"
 
 export interface DashboardSidebarSheetProps
   extends React.ComponentPropsWithRef<typeof SheetTrigger>,

src/app/(dashboard)/dashboard/_components/dashboard-sidebar.tsx → src/app/(dashboard)/store/[storeId]/_components/dashboard-sidebar.tsx

@@ -1,22 +1,62 @@
+"use client"
+
 import * as React from "react"
 import Link from "next/link"
+import { useSelectedLayoutSegments } from "next/navigation"
+import { type SidebarNavItem } from "@/types"
 
-import { dashboardConfig } from "@/config/dashboard"
 import { siteConfig } from "@/config/site"
 import { cn } from "@/lib/utils"
 import { ScrollArea } from "@/components/ui/scroll-area"
 import { Icons } from "@/components/icons"
 import { SidebarNav } from "@/components/layouts/sidebar-nav"
 
 interface DashboardSidebarProps extends React.HTMLAttributes<HTMLElement> {
+  storeId: string
   children: React.ReactNode
 }
 
 export function DashboardSidebar({
+  storeId,
   children,
   className,
   ...props
 }: DashboardSidebarProps) {
+  const segments = useSelectedLayoutSegments()
+
+  const sidebarNav: SidebarNavItem[] = [
+    {
+      title: "Dashboard",
+      href: `/store/${storeId}`,
+      icon: "dashboard",
+      active: segments.length === 0,
+    },
+    {
+      title: "Orders",
+      href: `/store/${storeId}/orders`,
+      icon: "cart",
+      active: segments.includes("orders"),
+    },
+    {
+      title: "Products",
+      href: `/store/${storeId}/products`,
+      icon: "product",
+      active: segments.includes("products"),
+    },
+    {
+      title: "Analytics",
+      href: `/store/${storeId}/analytics`,
+      icon: "analytics",
+      active: segments.includes("analytics"),
+    },
+    {
+      title: "Settings",
+      href: `/store/${storeId}/settings`,
+      icon: "settings",
+      active: segments.includes("settings"),
+    },
+  ]
+
   return (
     <aside className={cn("h-screen w-full", className)} {...props}>
       <div className="hidden h-[3.55rem] items-center border-b border-border/60 px-4 lg:flex lg:px-6">
@@ -32,7 +72,7 @@ export function DashboardSidebar({
         {children}
       </div>
       <ScrollArea className="h-[calc(100vh-8rem)] px-3 py-2.5 lg:px-5">
-        <SidebarNav items={dashboardConfig.sidebarNav} className="p-1 pt-4" />
+        <SidebarNav items={sidebarNav} className="p-1 pt-4" />
       </ScrollArea>
     </aside>
   )

src/app/(dashboard)/dashboard/_components/store-switcher.tsx → src/app/(dashboard)/store/[storeId]/_components/store-switcher.tsx

@@ -10,7 +10,7 @@ import {
   PlusCircledIcon,
 } from "@radix-ui/react-icons"
 
-import { type getStoresByUserId } from "@/lib/actions/store"
+import { type getStoresByUserId } from "@/lib/queries/store"
 import { type getUserPlanMetrics } from "@/lib/queries/user"
 import { cn } from "@/lib/utils"
 import { Button } from "@/components/ui/button"
@@ -31,7 +31,7 @@ import {
 } from "@/components/ui/popover"
 import { RateLimitAlert } from "@/components/rate-limit-alert"
 
-import { CreateStoreDialog } from "../stores/_components/create-store-dialog"
+import { CreateStoreDialog } from "./create-store-dialog"
 
 interface StoreSwitcherProps
   extends React.ComponentPropsWithoutRef<typeof PopoverTrigger> {

src/app/(dashboard)/store/[storeId]/layout.tsx

@@ -0,0 +1,64 @@
+import { redirect } from "next/navigation"
+
+import { getStoresByUserId } from "@/lib/queries/store"
+import { getCachedUser, getUserPlanMetrics } from "@/lib/queries/user"
+
+import { SidebarProvider } from "../../../../components/layouts/sidebar-provider"
+import { DashboardHeader } from "./_components/dashboard-header"
+import { DashboardSidebar } from "./_components/dashboard-sidebar"
+import { DashboardSidebarSheet } from "./_components/dashboard-sidebar-sheet"
+import { StoreSwitcher } from "./_components/store-switcher"
+
+interface DashboardStoreLayoutProps {
+  params: {
+    storeId: string
+  }
+  children: React.ReactNode
+}
+
+export default async function DashboardStoreLayout({
+  children,
+  params,
+}: DashboardStoreLayoutProps) {
+  const storeId = decodeURIComponent(params.storeId)
+
+  const user = await getCachedUser()
+
+  if (!user) {
+    redirect("/signin")
+  }
+
+  const storesPromise = getStoresByUserId({ userId: user.id })
+  const planMetricsPromise = getUserPlanMetrics({ userId: user.id })
+
+  return (
+    <SidebarProvider>
+      <div className="grid min-h-screen w-full lg:grid-cols-[17.5rem_1fr]">
+        <DashboardSidebar
+          storeId={storeId}
+          className="top-0 z-30 hidden flex-col gap-4 border-r border-border/60 lg:sticky lg:block"
+        >
+          <StoreSwitcher
+            userId={user.id}
+            storesPromise={storesPromise}
+            planMetricsPromise={planMetricsPromise}
+          />
+        </DashboardSidebar>
+        <div className="flex flex-col">
+          <DashboardHeader user={user}>
+            <DashboardSidebarSheet className="lg:hidden">
+              <DashboardSidebar storeId={storeId}>
+                <StoreSwitcher
+                  userId={user.id}
+                  storesPromise={storesPromise}
+                  planMetricsPromise={planMetricsPromise}
+                />
+              </DashboardSidebar>
+            </DashboardSidebarSheet>
+          </DashboardHeader>
+          <main className="flex-1 overflow-hidden px-6">{children}</main>
+        </div>
+      </div>
+    </SidebarProvider>
+  )
+}