feat: Paddle Direct — 1-click OCR without deskew/dewarp/crop

New 2-step mode (Upload → PaddleOCR+Overlay) alongside the existing
7-step pipeline. Backend endpoint runs PaddleOCR on the original image
and clusters words into rows/cells directly. Frontend adds a mode
toggle and PaddleDirectStep component.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

admin-lehrer/app/(admin)/ai/ocr-overlay/page.tsx

@@ -10,11 +10,13 @@ import { StepCrop } from '@/components/ocr-pipeline/StepCrop'
 import { StepRowDetection } from '@/components/ocr-pipeline/StepRowDetection'
 import { StepWordRecognition } from '@/components/ocr-pipeline/StepWordRecognition'
 import { OverlayReconstruction } from '@/components/ocr-overlay/OverlayReconstruction'
-import { OVERLAY_PIPELINE_STEPS, DOCUMENT_CATEGORIES, dbStepToOverlayUi, type PipelineStep, type SessionListItem, type DocumentCategory } from './types'
+import { PaddleDirectStep } from '@/components/ocr-overlay/PaddleDirectStep'
+import { OVERLAY_PIPELINE_STEPS, PADDLE_DIRECT_STEPS, DOCUMENT_CATEGORIES, dbStepToOverlayUi, type PipelineStep, type SessionListItem, type DocumentCategory } from './types'
 
 const KLAUSUR_API = '/klausur-api'
 
 export default function OcrOverlayPage() {
+  const [mode, setMode] = useState<'pipeline' | 'paddle-direct'>('pipeline')
   const [currentStep, setCurrentStep] = useState(0)
   const [sessionId, setSessionId] = useState<string | null>(null)
   const [sessionName, setSessionName] = useState<string>('')
@@ -61,17 +63,32 @@ export default function OcrOverlayPage() {
       setSessionName(data.name || data.filename || '')
       setActiveCategory(data.document_category || undefined)
 
-      // Map DB step to overlay UI step
-      const dbStep = data.current_step || 1
-      const uiStep = dbStepToOverlayUi(dbStep)
+      // Check if this session was processed with paddle_direct
+      const isPaddleDirect = data.word_result?.ocr_engine === 'paddle_direct'
 
-      setSteps(
-        OVERLAY_PIPELINE_STEPS.map((s, i) => ({
-          ...s,
-          status: i < uiStep ? 'completed' : i === uiStep ? 'active' : 'pending',
-        })),
-      )
-      setCurrentStep(uiStep)
+      if (isPaddleDirect) {
+        setMode('paddle-direct')
+        setSteps(
+          PADDLE_DIRECT_STEPS.map((s, i) => ({
+            ...s,
+            status: i < 1 ? 'completed' : i === 1 ? 'active' : 'pending',
+          })),
+        )
+        setCurrentStep(1)
+      } else {
+        setMode('pipeline')
+        // Map DB step to overlay UI step
+        const dbStep = data.current_step || 1
+        const uiStep = dbStepToOverlayUi(dbStep)
+
+        setSteps(
+          OVERLAY_PIPELINE_STEPS.map((s, i) => ({
+            ...s,
+            status: i < uiStep ? 'completed' : i === uiStep ? 'active' : 'pending',
+          })),
+        )
+        setCurrentStep(uiStep)
+      }
     } catch (e) {
       console.error('Failed to open session:', e)
     }
@@ -84,12 +101,13 @@ export default function OcrOverlayPage() {
       if (sessionId === sid) {
         setSessionId(null)
         setCurrentStep(0)
-        setSteps(OVERLAY_PIPELINE_STEPS.map((s, i) => ({ ...s, status: i === 0 ? 'active' : 'pending' })))
+        const baseSteps = mode === 'paddle-direct' ? PADDLE_DIRECT_STEPS : OVERLAY_PIPELINE_STEPS
+        setSteps(baseSteps.map((s, i) => ({ ...s, status: i === 0 ? 'active' : 'pending' })))
       }
     } catch (e) {
       console.error('Failed to delete session:', e)
     }
-  }, [sessionId])
+  }, [sessionId, mode])
 
   const renameSession = useCallback(async (sid: string, newName: string) => {
     try {
@@ -140,7 +158,8 @@ export default function OcrOverlayPage() {
   const handleNext = () => {
     if (currentStep >= steps.length - 1) {
       // Last step completed — return to session list
-      setSteps(OVERLAY_PIPELINE_STEPS.map((s, i) => ({ ...s, status: i === 0 ? 'active' : 'pending' })))
+      const baseSteps = mode === 'paddle-direct' ? PADDLE_DIRECT_STEPS : OVERLAY_PIPELINE_STEPS
+      setSteps(baseSteps.map((s, i) => ({ ...s, status: i === 0 ? 'active' : 'pending' })))
       setCurrentStep(0)
       setSessionId(null)
       loadSessions()
@@ -168,7 +187,8 @@ export default function OcrOverlayPage() {
     setSessionId(null)
     setSessionName('')
     setCurrentStep(0)
-    setSteps(OVERLAY_PIPELINE_STEPS.map((s, i) => ({ ...s, status: i === 0 ? 'active' : 'pending' })))
+    const baseSteps = mode === 'paddle-direct' ? PADDLE_DIRECT_STEPS : OVERLAY_PIPELINE_STEPS
+    setSteps(baseSteps.map((s, i) => ({ ...s, status: i === 0 ? 'active' : 'pending' })))
   }
 
   const stepNames: Record<number, string> = {
@@ -206,6 +226,16 @@ export default function OcrOverlayPage() {
   }, [sessionId, goToStep])
 
   const renderStep = () => {
+    if (mode === 'paddle-direct') {
+      switch (currentStep) {
+        case 0:
+          return <StepOrientation sessionId={sessionId} onNext={handleOrientationComplete} />
+        case 1:
+          return <PaddleDirectStep sessionId={sessionId} onNext={handleNext} />
+        default:
+          return null
+      }
+    }
     switch (currentStep) {
       case 0:
         return <StepOrientation sessionId={sessionId} onNext={handleOrientationComplete} />
@@ -410,11 +440,47 @@ export default function OcrOverlayPage() {
         </div>
       )}
 
+      {/* Mode Toggle */}
+      <div className="flex items-center gap-1 bg-gray-100 dark:bg-gray-800 rounded-lg p-1 w-fit">
+        <button
+          onClick={() => {
+            if (mode === 'pipeline') return
+            setMode('pipeline')
+            setCurrentStep(0)
+            setSessionId(null)
+            setSteps(OVERLAY_PIPELINE_STEPS.map((s, i) => ({ ...s, status: i === 0 ? 'active' : 'pending' })))
+          }}
+          className={`px-3 py-1.5 text-xs font-medium rounded-md transition-colors ${
+            mode === 'pipeline'
+              ? 'bg-white dark:bg-gray-700 text-gray-700 dark:text-gray-200 shadow-sm'
+              : 'text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-300'
+          }`}
+        >
+          Pipeline (7 Schritte)
+        </button>
+        <button
+          onClick={() => {
+            if (mode === 'paddle-direct') return
+            setMode('paddle-direct')
+            setCurrentStep(0)
+            setSessionId(null)
+            setSteps(PADDLE_DIRECT_STEPS.map((s, i) => ({ ...s, status: i === 0 ? 'active' : 'pending' })))
+          }}
+          className={`px-3 py-1.5 text-xs font-medium rounded-md transition-colors ${
+            mode === 'paddle-direct'
+              ? 'bg-white dark:bg-gray-700 text-gray-700 dark:text-gray-200 shadow-sm'
+              : 'text-gray-500 dark:text-gray-400 hover:text-gray-700 dark:hover:text-gray-300'
+          }`}
+        >
+          Paddle Direct (2 Schritte)
+        </button>
+      </div>
+
       <PipelineStepper
         steps={steps}
         currentStep={currentStep}
         onStepClick={handleStepClick}
-        onReprocess={sessionId ? reprocessFromStep : undefined}
+        onReprocess={mode === 'pipeline' && sessionId ? reprocessFromStep : undefined}
       />
 
       <div className="min-h-[400px]">{renderStep()}</div>

admin-lehrer/app/(admin)/ai/ocr-overlay/types.ts

@@ -48,6 +48,15 @@ export const OVERLAY_UI_TO_DB: Record<number, number> = {
   6: 9,  // reconstruction
 }
 
+/**
+ * 2-step pipeline for Paddle Direct mode.
+ * Upload → PaddleOCR+Overlay (skips deskew/dewarp/crop/rows)
+ */
+export const PADDLE_DIRECT_STEPS: PipelineStep[] = [
+  { id: 'orientation', name: 'Upload', icon: '📤', status: 'pending' },
+  { id: 'paddle-direct', name: 'PaddleOCR + Overlay', icon: '⚡', status: 'pending' },
+]
+
 /** Map from DB step to overlay UI step index */
 export function dbStepToOverlayUi(dbStep: number): number {
   // DB: 1=start, 2=orient, 3=deskew, 4=dewarp, 5=crop, 6=columns, 7=rows, 8=words, 9=recon, 10=gt