From 96b55ea5b4ff8fbb6a664e79ddf44310e363d00c Mon Sep 17 00:00:00 2001
From: David <david@Davids-MacBook-Neo.local>
Date: Thu, 22 Oct 2026 12:58:31 +0200
Subject: [PATCH] Job cards screen: drop the open-jobs list, add vehicle search
 fallback

Co-Authored-By: Claude Sonnet 5.5 <noreply@anthropic.com>
---
 components/JobScanner.tsx | 17 ++++++-----------
 1 file changed, 6 insertions(+), 11 deletions(-)

diff --git a/components/JobScanner.tsx b/components/JobScanner.tsx
index 81807c5..ea57fe7 100644
--- a/components/JobScanner.tsx
+++ b/components/JobScanner.tsx
@@ -1,7 +1,7 @@
 'use client';
 import { useEffect, useRef, useState } from 'react';
 import { useRouter } from 'next/navigation';
-import { AlertTriangle, CheckCircle2, Play, Square, Wrench, X } from 'lucide-react';
+import { AlertTriangle, CheckCircle2, Play, Square, X } from 'lucide-react';
 import { BadgeCamera } from './BadgeCamera';
 import { SearchPicker } from './SearchPicker';
 import { clockTime } from '@/lib/clock-display';
@@ -90,16 +90,11 @@ export function JobScanner({ assets, mechanics, open }: { assets: Asset[]; mecha
     {!asset ? <>
       <div className="mt-4"><BadgeCamera onDecode={onDecode} paused={busy} hint="Scan the vehicle QR to start or finish a job"/></div>
       {unknownScan && <p role="alert" className="plant-clock-warning mt-3">That QR is not a vehicle in the plant register ({unknownScan}).</p>}
-      <div className="plant-clock-panel mt-5 p-4 sm:p-5">
-        <h2 className="text-base font-semibold flex items-center gap-2"><Wrench size={16}/>Jobs open now</h2>
-        {open.length === 0 ? <p className="text-sm text-text-muted mt-3">No jobs running. Scan a vehicle to start one.</p>
-        : <ul className="divide-y divide-border mt-2">{open.map(j => {
-            const a = assetById(j.asset);
-            return <li key={j.id}><button type="button" disabled={!a} onClick={() => a && choose(a)} className="w-full min-h-[56px] py-3 flex items-center gap-3 text-left">
-              <span className="min-w-0 flex-1"><span className="block text-sm font-semibold">{a?.code ?? 'Unknown vehicle'} <span className="font-normal text-text-muted">· {a?.name}</span></span>
-                <span className="block text-xs text-text-muted">{j.mechanic} · started {clockTime(j.startedAt.replace(' ', 'T'))} · {formatMinutes(minutesBetween(j.startedAt, now))}</span></span>
-              <span className="plant-clock-status shrink-0">Finish</span></button></li>;
-          })}</ul>}
+      <div className="mt-4">
+        <label htmlFor="vehicle-find" className="block text-sm font-medium">QR not scanning? Search for the vehicle</label>
+        <SearchPicker id="vehicle-find" placeholder="Type the vehicle code or name…" value=""
+          onChange={id => { const found = assetById(id); if (found) { setMessage(null); choose(found); } }}
+          options={assets.map(a => ({ id: a.id, label: a.code, sub: a.name }))}/>
       </div>
     </> : !job ? <form onSubmit={start} className="plant-clock-panel mt-4 p-4 sm:p-5">
       <div className="flex items-start justify-between gap-3">