feat: Add confidence score to report and display low confidence notice in AI analysis tab

Author: adamrefaey

backend/src/document-processor/controllers/document-processor.controller.ts

@@ -201,6 +201,8 @@ export class DocumentProcessorController {
       // Extract lab values
       report.labValues = result.analysis.labValues || [];
 
+      report.confidence = result.analysis.metadata.confidence || 0;
+
       // Create summary from simplified explanation or diagnoses
       report.summary = result.simplifiedExplanation!;
 

backend/src/reports/models/report.model.ts

@@ -50,6 +50,9 @@ export class Report {
   @ApiProperty({ description: 'Summary of the report' })
   summary: string;
 
+  @ApiProperty({ description: 'Confidence score of the analysis (0-100)' })
+  confidence: number;
+
   @ApiProperty({
     description: 'Status of the report',
     enum: ReportStatus,

backend/src/reports/reports.service.ts

@@ -317,6 +317,7 @@ export class ReportsService {
         processingStatus: ProcessingStatus.UNPROCESSED,
         labValues: [],
         summary: '',
+        confidence: 0,
         status: ReportStatus.UNREAD,
         createdAt: new Date().toISOString(),
         updatedAt: new Date().toISOString(),

frontend/src/common/models/medicalReport.ts

@@ -51,6 +51,7 @@ export interface MedicalReport {
   processingStatus: ProcessingStatus;
   labValues: LabValue[];
   summary: string;
+  confidence: number;
   status: ReportStatus;
   filePath: string;
   originalFilename: string;

frontend/src/pages/Reports/ReportDetailPage.scss

@@ -653,6 +653,34 @@
     background-color: #435ff0;
     border-radius: 100px;
   }
+
+  // Low Confidence Notice styles
+  .low-confidence-notice {
+    margin: 0 16px 20px;
+    padding: 14px 16px;
+    display: flex;
+    align-items: flex-start;
+    border: 1px solid #dce0e9;
+    border-radius: 16px;
+    background-color: #fff;
+  }
+
+  .notice-icon {
+    color: #667091;
+    margin-right: 12px;
+    font-size: 24px;
+    display: flex;
+    align-items: center;
+    min-width: 24px;
+  }
+
+  .notice-text {
+    color: #313E4C;
+    font-size: 14px;
+    line-height: 20px;
+    font-family: 'Inter', sans-serif;
+    font-weight: 400;
+  }
 }
 
 // Media Queries for responsiveness
@@ -683,5 +711,11 @@
       margin: 20px auto 32px;
       padding: 0 16px 16px;
     }
+
+    .low-confidence-notice {
+      max-width: 600px;
+      margin-left: auto;
+      margin-right: auto;
+    }
   }
 }

frontend/src/pages/Reports/components/AiAnalysisTab.tsx

@@ -3,6 +3,7 @@ import { MedicalReport, LabValue } from '../../../common/models/medicalReport';
 import EmergencyAlert from './EmergencyAlert';
 import FlaggedValuesSection from './FlaggedValuesSection';
 import NormalValuesSection from './NormalValuesSection';
+import LowConfidenceNotice from './LowConfidenceNotice';
 
 interface AiAnalysisTabProps {
   reportData: MedicalReport;
@@ -30,11 +31,19 @@ const AiAnalysisTab: React.FC<AiAnalysisTabProps> = ({
     (value) => value.status === 'normal',
   );
 
+  // Format confidence score for display
+  const confidenceScore = reportData.confidence;
+
+  const isLowConfidence = confidenceScore < 0.75;
+
   return (
     <div className="ai-analysis-tab">
       {/* Emergency alert if needed */}
       {isEmergencyAlertVisible && hasEmergency && <EmergencyAlert />}
 
+      {/* Low confidence notice */}
+      {isLowConfidence && <LowConfidenceNotice />}
+
       {/* Flagged values section */}
       <FlaggedValuesSection
         flaggedValues={flaggedValues}

frontend/src/pages/Reports/components/LowConfidenceNotice.tsx

@@ -0,0 +1,27 @@
+import React from 'react';
+import { useTranslation } from 'react-i18next';
+import { IonIcon } from '@ionic/react';
+import { informationCircleOutline } from 'ionicons/icons';
+
+/**
+ * Component to display a notice when the confidence level is low
+ */
+const LowConfidenceNotice: React.FC = () => {
+  const { t } = useTranslation();
+
+  return (
+    <div className="low-confidence-notice">
+      <div className="notice-icon">
+        <IonIcon icon={informationCircleOutline} />
+      </div>
+      <div className="notice-text">
+        {t('reports.lowConfidence.message', {
+          defaultValue:
+            'Please note that this diagnosis is uncertain due to an incomplete report. For a more accurate interpretation, we recommend uploading another report for processing.',
+        })}
+      </div>
+    </div>
+  );
+};
+
+export default LowConfidenceNotice;