updates

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

@@ -20,11 +20,18 @@ export default function VehiclesPage() {
                     header: ({ column }) => <ColumnHeader column={column} title="Vehicle" />,
                     cell: ({ row }) => {
                         const r = row.original as any
-                        const display = r.name || `${r.make ?? ""} ${r.model ?? ""}`.trim() || "—"
+                        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" />
-                                <span>{display}</span>
+                                <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>
                         )
                     },
@@ -37,12 +44,43 @@ export default function VehiclesPage() {
                 {
                     accessorKey: "license_plate",
                     header: ({ column }) => <ColumnHeader column={column} title="License Plate" />,
-                    cell: ({ row }) => (row.original as any).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 }) => (row.original as any).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(),
             ]}