fix: use structured report_json and show on-page autofill status

backend/app.py

@@ -411,7 +411,8 @@ Do NOT include any other keys. Do NOT wrap in markdown. Return raw JSON only."""
             # Return as JSON object (not string) so it's properly encoded by FastAPI
             return JSONResponse({
                 "status": "success",
-                "report": cleaned_text,  # Return the cleaned JSON string
+                "report": cleaned_text,  # Backward-compatible JSON string
+                "report_json": parsed_json,  # Structured payload for robust frontend mapping
                 "model": used_model
             })
         except json.JSONDecodeError as je:

src/pages/ReportPage.tsx

@@ -79,6 +79,7 @@ export function ReportPage({
   const [showCompletionModal, setShowCompletionModal] = useState(false);
   const [isGenerating, setIsGenerating] = useState(false);
   const [aiError, setAiError] = useState<string | null>(null);
+  const [aiStatus, setAiStatus] = useState<string | null>(null);
   const imageBucketsRef = useRef(imageBuckets);
   const reportContentRef = useRef<HTMLDivElement>(null);
   const patientId = sessionStore.get().patientInfo?.id;
@@ -156,6 +157,7 @@ export function ReportPage({
   const generateWithAI = async () => {
     setIsGenerating(true);
     setAiError(null);
+    setAiStatus(null);
 
     try {
       const session = sessionStore.get();
@@ -206,6 +208,27 @@ export function ReportPage({
         throw new Error('Invalid response from backend');
       }
 
+      // Prefer structured JSON from backend when available.
+      if (data.report_json && typeof data.report_json === 'object') {
+        const parsed = data.report_json as Record<string, string>;
+        const updatedFormData = {
+          examQuality: String(parsed.examQuality || '').trim(),
+          transformationZone: String(parsed.transformationZone || '').trim(),
+          acetowL: String(parsed.acetowL || '').trim(),
+          nativeFindings: String(parsed.nativeFindings || '').trim(),
+          aceticFindings: String(parsed.aceticFindings || '').trim(),
+          colposcopicFindings: String(parsed.colposcopicFindings || '').trim(),
+          treatmentPlan: String(parsed.treatmentPlan || '').trim(),
+          followUp: String(parsed.followUp || '').trim(),
+          biopsySites: String(parsed.biopsySites || '').trim(),
+          biopsyNotes: String(parsed.biopsyNotes || '').trim(),
+        };
+
+        setFormData(prev => ({ ...prev, ...updatedFormData }));
+        setAiStatus('Report generated and fields auto-filled successfully.');
+        return;
+      }
+
       // Get the report text - it should be a JSON string
       let reportText: string = String(data.report).trim();
       let parsed: Record<string, string> = {};
@@ -311,14 +334,15 @@ export function ReportPage({
       // Show success feedback
       if (missingKeys.length === 0) {
         setAiError(null);
+        setAiStatus('Report generated and fields auto-filled successfully.');
       } else {
-        setAiError(`✓ Report generated! Some fields were missing: ${missingKeys.join(', ')}`);
+        setAiStatus(`Report generated. Some fields were missing: ${missingKeys.join(', ')}`);
       }
 
     } catch (err: any) {
       console.error('Gemini error:', err);
       const msg = err?.message || err?.toString() || 'Unknown error';
-      setAiError(`❌ AI generation failed: ${msg}. Please check the console logs for details.`);
+      setAiError(`AI generation failed: ${msg}`);
     } finally {
       setIsGenerating(false);
     }
@@ -568,6 +592,9 @@ export function ReportPage({
                 {aiError && (
                   <p className="text-sm text-red-600 bg-red-50 border border-red-200 rounded-lg px-3 py-2">{aiError}</p>
                 )}
+                {aiStatus && !aiError && (
+                  <p className="text-sm text-green-700 bg-green-50 border border-green-200 rounded-lg px-3 py-2">{aiStatus}</p>
+                )}
               </div>
             </div>
           </div>