[ADE-200] UI fixes

[adamrefaey]

Change

This pull request introduces several updates across the codebase, focusing on improving query invalidation consistency, refactoring components for better maintainability, and enhancing the user interface. Key changes include replacing synchronous query invalidations with asynchronous ones, refactoring components to use FC (Function Component) from React, and restructuring the ReportDetailPage for better separation of concerns.

Query Invalidation Improvements:

• Updated all onSuccess callbacks in hooks like useChat, useSignIn, and ProcessingPage to use await for query invalidations, ensuring consistent behavior and preventing potential race conditions. (frontend/src/common/hooks/useChat.ts [1] [2]], frontend/src/pages/Auth/SignIn/api/useSignIn.ts [3]], frontend/src/pages/Processing/ProcessingPage.tsx [4]])

Component Refactoring:

• Replaced React.FC with FC in multiple components for consistency and brevity. This change affects components like AiAnalysisTab, AiAssistantNotice, EmergencyAlert, and others in the ReportDetail module. (frontend/src/pages/ReportDetail/components/ActionButtons.tsx [1]], AiAnalysisTab.tsx [2]], AiAssistantNotice.tsx [3]], etc.)

ReportDetailPage Enhancements:

• Moved the handleDiscard and handleNewUpload logic from ReportDetailPage to the ActionButtons component, improving separation of concerns and reducing the complexity of the page component. (frontend/src/pages/ReportDetail/ReportDetailPage.tsx [1] [2]], ActionButtons.tsx [3]])
• Introduced a new __back-button style in ReportDetailPage.scss for improved UI consistency. (frontend/src/pages/ReportDetail/ReportDetailPage.scss [frontend/src/pages/ReportDetail/ReportDetailPage.scssR28-R40])

Code Cleanup:

• Removed unused imports and redundant code from ReportDetailPage.tsx, such as the useToasts hook and the queryClient instance, which are now handled in child components. (frontend/src/pages/ReportDetail/ReportDetailPage.tsx [1] [2]])

UI Enhancements:

• Enhanced navigation in ProcessingPage by adding a from property to the history.push call, enabling better tracking of the previous page. (frontend/src/pages/Processing/ProcessingPage.tsx [frontend/src/pages/Processing/ProcessingPage.tsxL76-R81])

These changes collectively improve code maintainability, user experience, and overall performance.

Does this PR introduce a breaking change?

{...}

What needs to be documented once your changes are merged?

{...}

Additional Comments

{...}

[Copilot]

Pull Request Overview

This PR implements various UI fixes and improvements in the Report Detail pages. Key changes include updating React component declarations to use FC from the react package, refactoring event handler logic for navigation and report actions, and adding asynchronous handling to query invalidations.

Reviewed Changes

Copilot reviewed 18 out of 18 changed files in this pull request and generated no comments.

Show a summary per file

File	Description
ReportTabs.tsx	Updated component declaration to use FC.
ReportHeader.tsx	Removed the onClose prop and added internal back/close button handling with useHistory and useLocation.
OriginalReportTab.tsx	Refactored component declaration to use FC.
NormalValuesSection.tsx	Refactored component declaration to use FC.
LowConfidenceNotice.tsx	Refactored component declaration to use FC.
LabValueItem.tsx	Refactored component declaration to use FC and maintained suggestion parsing logic.
InfoCard.tsx	Refactored component declaration to use FC.
FlaggedValuesSection.tsx	Refactored component declaration to use FC.
EmergencyAlert.tsx	Refactored component declaration to use FC.
AiAssistantNotice.tsx	Refactored component declaration to use FC and included useState in the import.
AiAnalysisTab.tsx	Updated component declaration and state hooks to use the new import style.
ActionButtons.tsx	Refactored component declaration to use FC with inline implementations for report deletion actions.
ReportDetailPage.tsx	Updated component declaration, consolidated report fetching logic, and removed unused handlers.
ReportDetailPage.scss	Added new styling for the back-button.
ProcessingPage.tsx	Updated query invalidations to await asynchronous operations and enhanced history navigation.
useSignIn.ts	Updated query invalidations to use asynchronous syntax on success.
useChat.ts	Updated query invalidations to use asynchronous syntax on success.