Update

frontend/src/components/ResultsPanel.tsx

@@ -1,5 +1,5 @@
 import { useState } from "react";
-import { FileTextIcon, Loader2Icon } from "lucide-react";
+import { DownloadIcon, FileTextIcon, Loader2Icon } from "lucide-react";
 import { ImageWithFallback } from "./ImageWithFallback";
 import { ReportModal } from "./ReportModal";
 import axios from "axios";
@@ -55,6 +55,18 @@ export function ResultsPanel({ uploadedImage, result, loading }: ResultsPanelPro
     confidence,
   } = (result || {}) as any;
 
+  const handleDownload = () => {
+    if (annotated_image_url) {
+      const link = document.createElement("a");
+      link.href = annotated_image_url;
+      link.download = "analysis_result.jpg";
+      // For Firefox it is necessary to add the link to the DOM
+      document.body.appendChild(link);
+      link.click();
+      link.remove();
+    }
+  };
+
   
 
   return (
@@ -88,22 +100,92 @@ export function ResultsPanel({ uploadedImage, result, loading }: ResultsPanelPro
         </div>
       )}
 
-    {/* Summary Section */}
-    {summary && (
-      <div className="bg-gray-50 p-4 rounded-lg mb-6">
-        <h3 className="text-lg font-semibold text-gray-800 mb-2">
-          AI Summary
-        </h3>
-        <p className="text-gray-700 text-sm leading-relaxed">
-          <strong>Abnormal Cells:</strong> {summary.abnormal_cells} <br />
-          <strong>Normal Cells:</strong> {summary.normal_cells} <br />
-          <strong>Average Confidence:</strong> {summary.avg_confidence?.toFixed(2)}% <br />
-        </p>
-        <div className="mt-3 text-gray-800 text-sm italic border-t pt-2">
-          {summary.ai_interpretation || "No AI interpretation available."}
+    {/* Summary Section - model-specific rendering (colposcopy, cytology, histopathology) */}
+    {summary && (() => {
+      const model = (model_used || "").toString();
+      const isColpo = /colpo|colposcopy/i.test(model);
+      const isCyto = /cyto|cytology/i.test(model);
+      const isHistoLike = /mwt|cin|histopath/i.test(model);
+
+      // helper values
+      const abnormalCount = Number(summary.abnormal_cells) || 0;
+      const pred = (summary.prediction || summary.result || "").toString().toLowerCase();
+      const isAbnormal = abnormalCount > 0 || /abnormal|positive|high-grade|malignant/.test(pred);
+
+      // Colposcopy: show only Abnormal / Normal (based on abnormal_cells count or prediction)
+      if (isColpo) {
+        return (
+          <div className="bg-gray-50 p-4 rounded-lg mb-6">
+            <h3 className="text-lg font-semibold text-gray-800 mb-2">AI Summary</h3>
+            <p className="text-gray-700 text-sm">
+              <strong>Result:</strong> {isAbnormal ? "Abnormal" : "Normal"}
+            </p>
+            <div className="mt-3 text-gray-800 text-sm italic border-t pt-2">
+              {summary.ai_interpretation || "No AI interpretation available."}
+            </div>
+          </div>
+        );
+      }
+
+      // Cytology: keep existing detailed summary (abnormal/normal counts + avg confidence + interpretation)
+      if (isCyto) {
+        return (
+          <div className="bg-gray-50 p-4 rounded-lg mb-6">
+            <h3 className="text-lg font-semibold text-gray-800 mb-2">AI Summary</h3>
+            <p className="text-gray-700 text-sm leading-relaxed">
+              {typeof summary.abnormal_cells !== 'undefined' && (
+                <><strong>Abnormal Cells:</strong> {summary.abnormal_cells} <br /></>
+              )}
+              {typeof summary.normal_cells !== 'undefined' && (
+                <><strong>Normal Cells:</strong> {summary.normal_cells} <br /></>
+              )}
+              {typeof summary.avg_confidence !== 'undefined' && (
+                <><strong>Average Confidence:</strong> {summary.avg_confidence?.toFixed(2)}% <br /></>
+              )}
+            </p>
+            <div className="mt-3 text-gray-800 text-sm italic border-t pt-2">
+              {summary.ai_interpretation || "No AI interpretation available."}
+            </div>
+          </div>
+        );
+      }
+
+      // Histopathology / CIN / MWT: show average confidence prominently + interpretation
+      if (isHistoLike) {
+        return (
+          <div className="bg-gray-50 p-4 rounded-lg mb-6">
+            <h3 className="text-lg font-semibold text-gray-800 mb-2">AI Summary</h3>
+            <p className="text-gray-700 text-sm leading-relaxed">
+              <strong>Average Confidence:</strong> {typeof summary.avg_confidence !== 'undefined' ? `${summary.avg_confidence?.toFixed(2)}%` : "-"}
+            </p>
+            <div className="mt-3 text-gray-800 text-sm italic border-t pt-2">
+              {summary.ai_interpretation || "No AI interpretation available."}
+            </div>
+          </div>
+        );
+      }
+
+      // Fallback: render only the fields that exist to avoid empty labels
+      return (
+        <div className="bg-gray-50 p-4 rounded-lg mb-6">
+          <h3 className="text-lg font-semibold text-gray-800 mb-2">AI Summary</h3>
+          <p className="text-gray-700 text-sm leading-relaxed">
+            {typeof summary.abnormal_cells !== 'undefined' && (
+              <><strong>Abnormal Cells:</strong> {summary.abnormal_cells} <br /></>
+            )}
+            {typeof summary.normal_cells !== 'undefined' && (
+              <><strong>Normal Cells:</strong> {summary.normal_cells} <br /></>
+            )}
+            {typeof summary.avg_confidence !== 'undefined' && (
+              <><strong>Average Confidence:</strong> {summary.avg_confidence?.toFixed(2)}% <br /></>
+            )}
+          </p>
+          <div className="mt-3 text-gray-800 text-sm italic border-t pt-2">
+            {summary.ai_interpretation || "No AI interpretation available."}
+          </div>
         </div>
-      </div>
-    )}
+      );
+    })()}
 
     {/* Detection list */}
     {detections && detections.length > 0 && (
@@ -192,6 +274,15 @@ export function ResultsPanel({ uploadedImage, result, loading }: ResultsPanelPro
     {/* Show only when not loading and we have analysis data (summary or confidence) */}
     {!isLoading && (summary || confidence) && (
       <div className="flex items-center justify-end mb-6">
+        {annotated_image_url && (
+          <button
+            onClick={handleDownload}
+            className="flex items-center gap-2 mr-3 bg-gradient-to-r from-teal-700 via-teal-600 to-teal-700 text-white px-4 py-2 rounded-lg hover:opacity-90 transition-all"
+          >
+            <DownloadIcon className="w-4 h-4" />
+            Download Image
+          </button>
+        )}
         <button
           onClick={() => setShowReportModal(true)}
           className="flex items-center gap-2 bg-gradient-to-r from-teal-700 via-teal-600 to-teal-700 text-white px-4 py-2 rounded-lg hover:opacity-90 transition-all"