feat: delete + deactivate for sites, zones, and trucks; harden incident API error handling

- zones: add active column (migration 20260713000005)
- sites/zones API: PATCH (toggle active) + DELETE (blocked when incidents reference it)
- trucks API: PATCH + DELETE with same pattern
- admin page: select active for sites + zones
- site-zone-manager + truck-manager: deactivate toggle + delete button per row with busyId
- incidents API: reject reports on deactivated zone/site; wrap handler in top-level try-catch so unhandled errors return JSON (not HTML)
- report-form: parse JSON separately so HTTP status code surfaces instead of generic "Something went wrong"

Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01CPf5Rc8QPx6V8KLEEgfKEQ

components/admin/truck-manager.tsx

@@ -19,6 +19,7 @@ export function TruckManager({ trucks }: Props) {
   const [truckNo, setTruckNo] = useState('')
   const [carrier, setCarrier] = useState('')
   const [submitting, setSubmitting] = useState(false)
+  const [busyId, setBusyId] = useState<string | null>(null)
   const [error, setError] = useState<string | null>(null)
 
   async function handleAdd() {
@@ -47,6 +48,31 @@ export function TruckManager({ trucks }: Props) {
     }
   }
 
+  const send = async (method: 'PATCH' | 'DELETE', payload: Record<string, unknown>) => {
+    const id = payload.id as string
+    setBusyId(id)
+    setError(null)
+    try {
+      const res = await fetch('/ims/api/admin/trucks', {
+        method,
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify(payload),
+      })
+      if (!res.ok) {
+        const data = await res.json().catch(() => ({}))
+        setError(data.error ?? 'Action failed')
+        return false
+      }
+      router.refresh()
+      return true
+    } catch {
+      setError('Network error')
+      return false
+    } finally {
+      setBusyId(null)
+    }
+  }
+
   return (
     <div className="bg-white rounded-xl shadow-sm border border-gray-200 overflow-hidden">
       <div className="px-5 py-4 border-b border-gray-100">
@@ -89,25 +115,46 @@ export function TruckManager({ trucks }: Props) {
         ) : (
           <ul className="divide-y divide-gray-100">
             {trucks.map(tk => (
-              <li key={tk.id} className="flex items-center justify-between py-2">
+              <li
+                key={tk.id}
+                className={`flex items-center justify-between py-2 transition-opacity ${!tk.active ? 'opacity-50' : ''}`}
+              >
                 <div className="flex items-center gap-3">
                   <span className="text-sm font-medium text-gray-900">{tk.truck_no}</span>
                   {tk.carrier && (
                     <span className="text-xs text-gray-500">{tk.carrier}</span>
                   )}
-                  {!tk.active && (
-                    <span className="text-xs font-medium px-2 py-0.5 rounded-full bg-gray-100 text-gray-500">
-                      Inactive
-                    </span>
-                  )}
                 </div>
-                <a
-                  href={`/ims/report?truck_id=${tk.id}`}
-                  target="_blank"
-                  className="text-xs text-blue-600 hover:underline"
-                >
-                  Report link / QR target
-                </a>
+                <div className="flex items-center gap-3">
+                  <a
+                    href={`/ims/report?truck_id=${tk.id}`}
+                    target="_blank"
+                    className="text-xs text-blue-600 hover:underline"
+                  >
+                    Report link / QR target
+                  </a>
+                  <button
+                    disabled={busyId === tk.id}
+                    onClick={() => send('PATCH', { id: tk.id, active: !tk.active })}
+                    className={`text-xs font-medium px-2 py-0.5 rounded-full border transition-colors disabled:opacity-50 ${
+                      tk.active
+                        ? 'border-green-300 text-green-700 hover:bg-green-50'
+                        : 'border-gray-300 text-gray-500 hover:bg-gray-50'
+                    }`}
+                  >
+                    {tk.active ? 'Active' : 'Deactivated'}
+                  </button>
+                  <button
+                    disabled={busyId === tk.id}
+                    onClick={async () => {
+                      if (window.confirm(`Delete truck "${tk.truck_no}"? This cannot be undone.`))
+                        await send('DELETE', { id: tk.id })
+                    }}
+                    className="text-xs text-red-600 hover:underline disabled:opacity-50"
+                  >
+                    Delete
+                  </button>
+                </div>
               </li>
             ))}
           </ul>