init

apps/dashboard/app/(authenticated)/sales/customers/page.tsx

@@ -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 '@garage/api'
+import type { CustomersClient } from '@garage/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}
+                />
+            )}
+        />
+    )
+}

apps/dashboard/app/(authenticated)/sales/inspections/page.tsx

@@ -0,0 +1,65 @@
+"use client"
+
+import { ResourcePage } from "@/shared/data-view/resource-page"
+import { ColumnHeader } from "@/shared/data-view/table-view"
+import { InspectionForm } from "@/modules/inspections/inspection-form"
+import { INSPECTION_ROUTES } from "@garage/api"
+import type { InspectionsClient } from "@garage/api"
+
+export default function InspectionsPage() {
+    return (
+        <ResourcePage<InspectionsClient>
+            pageTitle="Inspections"
+            title="Inspection"
+            routeKey={INSPECTION_ROUTES.INDEX}
+            getClient={(api) => api.inspections}
+            columns={({ actionsColumn }) => [
+                {
+                    accessorKey: "title",
+                    header: ({ column }) => <ColumnHeader column={column} title="Title" />,
+                },
+                {
+                    accessorKey: "customer",
+                    header: ({ column }) => <ColumnHeader column={column} title="Customer" />,
+                    cell: ({ row }) => {
+                        const c = (row.original as any).customer
+                        return c ? `${c.first_name ?? ""} ${c.last_name ?? ""}`.trim() : "—"
+                    },
+                },
+                {
+                    accessorKey: "vehicle",
+                    header: ({ column }) => <ColumnHeader column={column} title="Vehicle" />,
+                    cell: ({ row }) => {
+                        const v = (row.original as any).vehicle
+                        return v ? `${v.make ?? ""} ${v.model ?? ""}`.trim() : "—"
+                    },
+                },
+                {
+                    accessorKey: "inspection_category",
+                    header: ({ column }) => <ColumnHeader column={column} title="Category" />,
+                    cell: ({ row }) => (row.original as any).inspection_category?.name ?? "—",
+                },
+                {
+                    accessorKey: "status",
+                    header: ({ column }) => <ColumnHeader column={column} title="Status" />,
+                    cell: ({ row }) => {
+                        const status = (row.original as any).status
+                        return (
+                            <span className={status === "completed" ? "text-green-600" : "text-yellow-600"}>
+                                {status ?? "—"}
+                            </span>
+                        )
+                    },
+                },
+                actionsColumn(),
+            ]}
+            renderForm={({ resourceId, initialData, onSuccess }) => (
+                <InspectionForm
+                    resourceId={resourceId}
+                    initialData={initialData}
+                    onSuccess={onSuccess}
+                />
+            )}
+        />
+    )
+}

apps/dashboard/app/(authenticated)/sales/vehicles/page.tsx

@@ -0,0 +1,98 @@
+"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 '@garage/api'
+import type { VehiclesClient } from '@garage/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 make = r.make ?? ""
+                        const model = r.model ?? ""
+                        const display = r.name || `${make} ${model}`.trim() || "—"
+                        return (
+                            <div className="flex items-center gap-2">
+                                <CarIcon className="h-4 w-4 text-muted-foreground" />
+                                <div>
+                                    <span className="font-medium">{display}</span>
+                                    {r.sub_model && (
+                                        <span className="ml-1 text-xs text-muted-foreground">{r.sub_model}</span>
+                                    )}
+                                </div>
+                            </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 }) => {
+                        const val = (row.original as any).license_plate
+                        return val
+                            ? <span className="font-mono text-xs">{val}</span>
+                            : "—"
+                    },
+                },
+                {
+                    accessorKey: "vin_number",
+                    header: ({ column }) => <ColumnHeader column={column} title="VIN" />,
+                    cell: ({ row }) => {
+                        const val = (row.original as any).vin_number
+                        return val
+                            ? <span className="max-w-30 truncate block font-mono text-xs">{val}</span>
+                            : "—"
+                    },
+                },
+                {
+                    accessorKey: "engine_size",
+                    header: ({ column }) => <ColumnHeader column={column} title="Engine" />,
+                    cell: ({ row }) => (row.original as any).engine_size ?? "—",
+                },
+                {
+                    accessorKey: "mileage",
+                    header: ({ column }) => <ColumnHeader column={column} title="Mileage" />,
+                    cell: ({ row }) => {
+                        const val = (row.original as any).mileage
+                        return val != null ? `${Number(val).toLocaleString()} mi` : "—"
+                    },
+                },
+                {
+                    accessorKey: "created_at",
+                    header: ({ column }) => <ColumnHeader column={column} title="Created" />,
+                    cell: ({ row }) => {
+                        const val = (row.original as any).created_at
+                        return val ? new Date(val).toLocaleDateString() : "—"
+                    },
+                },
+                actionsColumn(),
+            ]}
+            renderForm={({ resourceId, initialData, onSuccess }) => (
+                <VehicleForm
+                    resourceId={resourceId}
+                    initialData={initialData}
+                    onSuccess={onSuccess}
+                />
+            )}
+        />
+    )
+}