fix(dashboard): resolve tutorial QA notes (clips 2–6)

- settings/company: show success toast on save (2.1)
- inspection templates: add explicit Save button (2.6)
- parts: label price fields with AED currency (3.1)
- service groups: add parts/services picker to packages (3.3)
- vehicles: add insurance (has_insurance + insurance type) field (4.2)
- appointments: add calendar view with list/calendar toggle (5.1)
- job card check-in: require department (5.4)
- job card payments: refresh job card/invoice queries so PAID shows (5.6)
- vendors: add phone + address fields (6.1)
- bill payments: surface real vendor/employee validation errors (6.4)

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

apps/dashboard/app/(authenticated)/calendar/appointment/list/page.tsx

@@ -1,14 +1,17 @@
 "use client"
 
+import { useState } from "react"
 import { useRouter } from "next/navigation"
 import { ResourcePage } from "@/shared/data-view/resource-page"
 import { ColumnHeader } from "@/shared/data-view/table-view"
 import FormDialog from "@/shared/components/form-dialog"
 import { AppointmentForm } from "@/modules/appointments/appointment-form"
+import { AppointmentsCalendarView } from "@/modules/appointments/appointments-calendar-view"
 import { APPOINTMENT_ROUTES, AppointmentStatus } from "@garage/api"
 import type { AppointmentsClient } from "@garage/api"
-import { CalendarCheck2Icon, ClipboardListIcon, ClockIcon } from "lucide-react"
+import { CalendarCheck2Icon, CalendarDaysIcon, ClipboardListIcon, ClockIcon, ListIcon } from "lucide-react"
 import { Badge } from "@/shared/components/ui/badge"
+import { Button } from "@/shared/components/ui/button"
 import { RelationLink } from "@/shared/components/relation-link"
 import { formatEnum } from "@/shared/utils/formatters"
 
@@ -22,8 +25,44 @@ const STATUS_COLORS: Record<string, string> = {
 
 export default function AppointmentsPage() {
     const router = useRouter()
+    const [view, setView] = useState<"list" | "calendar">("list")
+
+    const viewToggle = (
+        <div className="flex items-center justify-end gap-1 px-1">
+            <Button
+                type="button"
+                variant={view === "list" ? "default" : "outline"}
+                size="sm"
+                onClick={() => setView("list")}
+            >
+                <ListIcon className="me-1 size-4" /> List
+            </Button>
+            <Button
+                type="button"
+                variant={view === "calendar" ? "default" : "outline"}
+                size="sm"
+                onClick={() => setView("calendar")}
+            >
+                <CalendarDaysIcon className="me-1 size-4" /> Calendar
+            </Button>
+        </div>
+    )
+
+    if (view === "calendar") {
+        return (
+            <div className="space-y-4 p-4">
+                <div className="flex items-center justify-between">
+                    <h1 className="text-xl font-semibold">Appointments</h1>
+                    {viewToggle}
+                </div>
+                <AppointmentsCalendarView />
+            </div>
+        )
+    }
 
     return (
+        <div className="space-y-2">
+            {viewToggle}
         <ResourcePage<AppointmentsClient>
             pageTitle="Appointments"
             routeKey={APPOINTMENT_ROUTES.INDEX}
@@ -104,5 +143,6 @@ export default function AppointmentsPage() {
                 actionsColumn(),
             ]}
         />
+        </div>
     )
 }

apps/dashboard/app/(authenticated)/settings/inspection-templates/[id]/page.tsx

@@ -3,7 +3,7 @@
 import { useCallback, useEffect, useState } from "react"
 import Link from "next/link"
 import { useParams } from "next/navigation"
-import { ChevronLeft, Pencil, Plus, Trash2 } from "lucide-react"
+import { ChevronLeft, Pencil, Plus, Save, Trash2 } from "lucide-react"
 import { toast } from "sonner"
 
 import { Button } from "@/shared/components/ui/button"
@@ -44,6 +44,9 @@ export default function InspectionTemplateEditorPage() {
     const api = useAuthApi()
     const [template, setTemplate] = useState<InspectionTemplate | null>(null)
     const [loading, setLoading] = useState(true)
+    const [name, setName] = useState("")
+    const [description, setDescription] = useState("")
+    const [saving, setSaving] = useState(false)
 
     const [editing, setEditing] = useState<{
         section: InspectionTemplateSection
@@ -55,6 +58,8 @@ export default function InspectionTemplateEditorPage() {
         try {
             const res = await api.inspectionTemplates.show(id)
             setTemplate(res.data)
+            setName(res.data.name ?? "")
+            setDescription(res.data.description ?? "")
         } catch (e: any) {
             toast.error(e?.message ?? "Failed to load template")
         } finally {
@@ -74,6 +79,20 @@ export default function InspectionTemplateEditorPage() {
         }
     }
 
+    const saveTemplate = async () => {
+        if (!template) return
+        setSaving(true)
+        try {
+            const res = await api.inspectionTemplates.update(template.id, { name, description })
+            setTemplate(res.data)
+            toast.success("Template saved")
+        } catch (e: any) {
+            toast.error(e?.message ?? "Failed to save")
+        } finally {
+            setSaving(false)
+        }
+    }
+
     const addSection = async () => {
         if (!template) return
         const name = await prompt({
@@ -153,8 +172,8 @@ export default function InspectionTemplateEditorPage() {
                     <div>
                         <label className="text-xs text-muted-foreground">Name</label>
                         <Input
-                            defaultValue={template.name}
-                            onBlur={(e) => e.currentTarget.value !== template.name && updateMeta({ name: e.currentTarget.value })}
+                            value={name}
+                            onChange={(e) => setName(e.target.value)}
                         />
                     </div>
                     <div className="flex items-center gap-3 mt-5">
@@ -168,9 +187,9 @@ export default function InspectionTemplateEditorPage() {
                 <div>
                     <label className="text-xs text-muted-foreground">Description</label>
                     <Textarea
-                        defaultValue={template.description ?? ""}
+                        value={description}
                         rows={2}
-                        onBlur={(e) => e.currentTarget.value !== (template.description ?? "") && updateMeta({ description: e.currentTarget.value })}
+                        onChange={(e) => setDescription(e.target.value)}
                     />
                 </div>
             </div>
@@ -259,6 +278,13 @@ export default function InspectionTemplateEditorPage() {
                     onSaved={load}
                 />
             )}
+
+            <div className="sticky bottom-0 flex justify-end gap-2 border-t bg-background py-3">
+                <Button onClick={saveTemplate} disabled={saving}>
+                    <Save className="size-4 mr-1" />
+                    {saving ? "Saving…" : "Save"}
+                </Button>
+            </div>
         </div>
     )
 }