Merge pull request #73 from ModusCreateOrg/ADE-31-reports-page

[ADE-31] Reports and reports details page

Author: GuidoBR

frontend/src/common/api/__tests__/reportService.test.ts

@@ -19,12 +19,12 @@ vi.mock('axios', () => ({
 // Mock dynamic imports to handle the service functions
 vi.mock('../reportService', async (importOriginal) => {
   const actual = await importOriginal() as typeof ReportServiceModule;
-  
+
   // Create a new object with the same properties as the original
   return {
     // Keep the ReportError class
     ReportError: actual.ReportError,
-    
+
     // Mock the API functions
     uploadReport: async (file: File, onProgress?: (progress: number) => void) => {
       try {
@@ -38,36 +38,36 @@ vi.mock('../reportService', async (importOriginal) => {
         return response.data;
       } catch (error) {
         // Properly wrap the error in a ReportError
-        throw new actual.ReportError(error instanceof Error 
+        throw new actual.ReportError(error instanceof Error
           ? `Failed to upload report: ${error.message}`
           : 'Failed to upload report');
       }
     },
-    
+
     // Mock fetchLatestReports
     fetchLatestReports: async (limit = 3) => {
       try {
         const response = await axios.get(`/api/reports/latest?limit=${limit}`);
         return response.data;
       } catch (error) {
-        throw new actual.ReportError(error instanceof Error 
+        throw new actual.ReportError(error instanceof Error
           ? `Failed to fetch latest reports: ${error.message}`
           : 'Failed to fetch latest reports');
       }
     },
-    
+
     // Mock fetchAllReports
     fetchAllReports: async () => {
       try {
         const response = await axios.get(`/api/reports`);
         return response.data;
       } catch (error) {
-        throw new actual.ReportError(error instanceof Error 
+        throw new actual.ReportError(error instanceof Error
           ? `Failed to fetch all reports: ${error.message}`
           : 'Failed to fetch all reports');
       }
     },
-    
+
     // Keep other functions as is
     markReportAsRead: actual.markReportAsRead,
     getAuthConfig: actual.getAuthConfig,
@@ -92,28 +92,26 @@ const mockReports = [
     title: 'heart-report',
     status: ReportStatus.UNREAD,
     category: ReportCategory.HEART,
-    documentUrl: 'http://example.com/heart-report.pdf',
     date: '2024-03-24',
   },
   {
     id: '2',
     title: 'brain-scan',
     status: ReportStatus.UNREAD,
     category: ReportCategory.NEUROLOGICAL,
-    documentUrl: 'http://example.com/brain-scan.pdf',
     date: '2024-03-24',
   }
 ];
 
 describe('reportService', () => {
   const mockFile = new File(['test content'], 'test-report.pdf', { type: 'application/pdf' });
   let progressCallback: (progress: number) => void;
-  
+
   beforeEach(() => {
     vi.resetAllMocks();
     progressCallback = vi.fn();
   });
-  
+
   describe('uploadReport', () => {
     beforeEach(() => {
       // Mock axios.post for successful response
@@ -124,23 +122,22 @@ describe('reportService', () => {
           status: ReportStatus.UNREAD,
           category: ReportCategory.GENERAL,
           date: '2024-05-10',
-          documentUrl: 'http://example.com/test-report.pdf'
         }
       });
     });
-    
+
     test('should upload file successfully', async () => {
       const report = await uploadReport(mockFile, progressCallback);
-      
+
       // Check the returned data matches our expectations
       expect(report).toBeDefined();
       expect(report.title).toBe('test-report');
       expect(report.status).toBe(ReportStatus.UNREAD);
-      
+
       // Check the progress callback was called
       expect(progressCallback).toHaveBeenCalled();
     });
-    
+
     test('should determine category based on filename', async () => {
       // Mock response for heart file
       (axios.post as ReturnType<typeof vi.fn>).mockResolvedValueOnce({
@@ -150,14 +147,13 @@ describe('reportService', () => {
           status: ReportStatus.UNREAD,
           category: ReportCategory.HEART,
           date: '2024-05-10',
-          documentUrl: 'http://example.com/heart-report.pdf'
         }
       });
-      
+
       const heartFile = new File(['test'], 'heart-report.pdf', { type: 'application/pdf' });
       const heartReport = await uploadReport(heartFile);
       expect(heartReport.category).toBe(ReportCategory.HEART);
-      
+
       // Mock response for neurological file
       (axios.post as ReturnType<typeof vi.fn>).mockResolvedValueOnce({
         data: {
@@ -166,27 +162,26 @@ describe('reportService', () => {
           status: ReportStatus.UNREAD,
           category: ReportCategory.NEUROLOGICAL,
           date: '2024-05-10',
-          documentUrl: 'http://example.com/brain-scan.pdf'
         }
       });
-      
+
       const neuroFile = new File(['test'], 'brain-scan.pdf', { type: 'application/pdf' });
       const neuroReport = await uploadReport(neuroFile);
       expect(neuroReport.category).toBe(ReportCategory.NEUROLOGICAL);
     });
-    
+
     test('should handle upload without progress callback', async () => {
       const report = await uploadReport(mockFile);
       expect(report).toBeDefined();
       expect(report.title).toBe('test-report');
     });
-    
+
     test('should throw ReportError on upload failure', async () => {
       // Mock axios.post to fail
       (axios.post as ReturnType<typeof vi.fn>).mockRejectedValueOnce(
         new Error('API request failed')
       );
-      
+
       await expect(uploadReport(mockFile, progressCallback))
         .rejects
         .toThrow(ReportError);
@@ -203,30 +198,30 @@ describe('reportService', () => {
 
     test('should fetch latest reports with default limit', async () => {
       const reports = await fetchLatestReports();
-      
+
       expect(axios.get).toHaveBeenCalled();
       expect(reports).toHaveLength(2);
       expect(reports[0]).toEqual(expect.objectContaining({
         id: expect.any(String),
         title: expect.any(String)
       }));
     });
-    
+
     test('should fetch latest reports with custom limit', async () => {
       const limit = 1;
       (axios.get as ReturnType<typeof vi.fn>).mockResolvedValue({
         data: mockReports.slice(0, 1)
       });
-      
+
       const reports = await fetchLatestReports(limit);
-      
+
       expect(axios.get).toHaveBeenCalled();
       expect(reports).toHaveLength(1);
     });
-    
+
     test('should throw ReportError on fetch failure', async () => {
       (axios.get as ReturnType<typeof vi.fn>).mockRejectedValue(new Error('Network error'));
-      
+
       await expect(fetchLatestReports())
         .rejects
         .toThrow(ReportError);
@@ -242,14 +237,14 @@ describe('reportService', () => {
 
     test('should fetch all reports', async () => {
       const reports = await fetchAllReports();
-      
+
       expect(axios.get).toHaveBeenCalled();
       expect(reports).toEqual(mockReports);
     });
-    
+
     test('should throw ReportError on fetch failure', async () => {
       (axios.get as ReturnType<typeof vi.fn>).mockRejectedValue(new Error('Network error'));
-      
+
       await expect(fetchAllReports())
         .rejects
         .toThrow(ReportError);
@@ -262,25 +257,25 @@ describe('reportService', () => {
         ...mockReports[0],
         status: ReportStatus.READ
       };
-      
+
       (axios.patch as ReturnType<typeof vi.fn>).mockResolvedValue({
         data: updatedReport
       });
     });
 
     test('should mark a report as read', async () => {
       const updatedReport = await markReportAsRead('1');
-      
+
       expect(axios.patch).toHaveBeenCalled();
       expect(updatedReport.status).toBe(ReportStatus.READ);
     });
-    
+
     test('should throw error when report not found', async () => {
       (axios.patch as ReturnType<typeof vi.fn>).mockRejectedValue(new Error('Report not found'));
-      
+
       await expect(markReportAsRead('non-existent-id'))
         .rejects
         .toThrow(ReportError);
     });
   });
-}); 
+});

frontend/src/common/api/reportService.ts

@@ -66,7 +66,7 @@ export const uploadReport = async (
 
     // Send the report metadata to the API
     const response = await axios.post(
-      `${API_URL}/api/reports`, 
+      `${API_URL}/api/reports`,
       {
         filePath: s3Key,
       },
@@ -142,3 +142,37 @@ export const markReportAsRead = async (reportId: string): Promise<MedicalReport>
     throw new ReportError('Failed to mark report as read');
   }
 };
+
+/**
+ * Toggles the bookmark status of a report.
+ * @param reportId - ID of the report to toggle bookmark status
+ * @param isBookmarked - Boolean indicating if the report should be bookmarked or not
+ * @returns Promise with the updated report
+ */
+export const toggleReportBookmark = async (reportId: string, isBookmarked: boolean): Promise<MedicalReport> => {
+  try {
+    await axios.patch(`${API_URL}/api/reports/${reportId}/bookmark`, {
+      bookmarked: isBookmarked
+    }, await getAuthConfig());
+
+    // In a real implementation, this would return the response from the API
+    // return response.data;
+
+    // For now, we'll mock the response
+    const report = mockReports.find(r => r.id === reportId);
+
+    if (!report) {
+      throw new Error(`Report with ID ${reportId} not found`);
+    }
+
+    // Update the bookmark status
+    report.bookmarked = isBookmarked;
+
+    return { ...report };
+  } catch (error) {
+    if (axios.isAxiosError(error)) {
+      throw new ReportError(`Failed to toggle bookmark status: ${error.message}`);
+    }
+    throw new ReportError('Failed to toggle bookmark status');
+  }
+};

frontend/src/common/components/Router/TabNavigation.tsx

@@ -16,6 +16,8 @@ import ProfilePage from 'pages/Account/components/Profile/ProfilePage';
 import DiagnosticsPage from 'pages/Account/components/Diagnostics/DiagnosticsPage';
 import ChatPage from 'pages/Chat/ChatPage';
 import UploadPage from 'pages/Upload/UploadPage';
+import ReportDetailPage from 'pages/Reports/ReportDetailPage';
+import ReportsListPage from 'pages/Reports/ReportsListPage';
 
 /**
  * The `TabNavigation` component provides a router outlet for all of the
@@ -82,6 +84,12 @@ const TabNavigation = (): JSX.Element => {
           <Route exact path="/tabs/upload">
             <UploadPage />
           </Route>
+          <Route exact path="/tabs/reports">
+            <ReportsListPage />
+          </Route>
+          <Route exact path="/tabs/reports/:reportId">
+            <ReportDetailPage />
+          </Route>
           <Route exact path="/">
             <Redirect to="/tabs/home" />
           </Route>
@@ -96,7 +104,7 @@ const TabNavigation = (): JSX.Element => {
               fixedWidth
             />
           </IonTabButton>
-          <IonTabButton className="ls-tab-navigation__bar-button" tab="reports" href="/reports">
+          <IonTabButton className="ls-tab-navigation__bar-button" tab="reports" href="/tabs/reports">
             <Icon
               className="ls-tab-navigation__bar-button-icon"
               icon="fileLines"

frontend/src/common/components/Router/__tests__/TabNavigation.test.tsx

@@ -222,7 +222,7 @@ describe('TabNavigation', () => {
     expect(screen.getByTestId('mock-ion-tab-button-home')).toHaveAttribute('data-href', '/tabs/home');
 
     // Check for analytics tab button
-    expect(screen.getByTestId('mock-ion-tab-button-reports')).toHaveAttribute('data-href', '/reports');
+    expect(screen.getByTestId('mock-ion-tab-button-reports')).toHaveAttribute('data-href', '/tabs/reports');
 
     // Check for chat tab button
     expect(screen.getByTestId('mock-ion-tab-button-chat')).toHaveAttribute('data-href', '/tabs/chat');

frontend/src/common/models/medicalReport.ts

@@ -15,17 +15,38 @@ export enum ReportCategory {
  * Status of a medical report.
  */
 export enum ReportStatus {
-  READ = 'read',
-  UNREAD = 'unread'
+  READ = 'READ',
+  UNREAD = 'UNREAD'
+}
+
+/**
+ * Interface for report lab values.
+ */
+export interface LabValue {
+  name: string;
+  value: string;
+  unit: string;
+  normalRange: string;
+  status: 'normal' | 'high' | 'low';
+  isCritical: boolean;
+  conclusion: string;
+  suggestions: string;
 }
 
 /**
  * Interface representing a medical report.
  */
 export interface MedicalReport {
   id: string;
+  userId: string;
   title: string;
-  category: ReportCategory;
-  createdAt: string; // ISO date string
+  category: ReportCategory | string;
+  bookmarked: boolean;
+  isProcessed: boolean;
+  labValues: LabValue[];
+  summary: string;
   status: ReportStatus;
-} 
+  filePath: string;
+  createdAt: string; // ISO date string
+  updatedAt: string; // ISO date string
+}

frontend/src/common/utils/i18n/index.ts

@@ -19,7 +19,7 @@ i18n
     // languages, namespaces, and resources
     supportedLngs: ['en', 'es', 'fr'],
     fallbackLng: 'en',
-    ns: ['account', 'auth', 'common', 'errors', 'home', 'user'],
+    ns: ['account', 'auth', 'common', 'errors', 'home', 'report', 'user'],
     defaultNS: 'common',
     resources: { en, es, fr },