[PRMT-257] Remove reload of Lloyd George between fullscreen change (#647)

Author: adamwhitingnhs

app/src/components/blocks/_lloydGeorge/lloydGeorgeViewRecordStage/LloydGeorgeViewRecordStage.tsx

@@ -1,4 +1,4 @@
-import { Dispatch, SetStateAction } from 'react';
+import { Dispatch, SetStateAction, useEffect, useRef } from 'react';
 import { Button, ChevronLeftIcon } from 'nhsuk-react-components';
 import { DOWNLOAD_STAGE } from '../../../../types/generic/downloadStage';
 import LloydGeorgeRecordDetails from '../lloydGeorgeRecordDetails/LloydGeorgeRecordDetails';
@@ -72,6 +72,19 @@ function LloydGeorgeViewRecordStage({
     const pageHeader = 'Available records';
     useTitle({ pageTitle: pageHeader });
 
+    const mounted = useRef(false);
+
+    useEffect(() => {
+        const onPageLoad = async () => {
+            resetDocState();
+            refreshRecord();
+        };
+        if (!mounted.current) {
+            onPageLoad();
+            mounted.current = true;
+        }
+    }, [refreshRecord, resetDocState]);
+
     const menuClass = showMenu ? '--menu' : '--upload';
 
     return (
@@ -142,9 +155,7 @@ function LloydGeorgeViewRecordStage({
                                 fullScreenHandler={setFullScreen}
                                 detailsElement={<RecordDetails {...recordDetailsProps} />}
                                 isFullScreen={session.isFullscreen!}
-                                refreshRecord={refreshRecord}
-                                pdfObjectUrl={pdfObjectUrl}
-                                resetDocStage={resetDocState}
+                                pdfObjectUrl={hasRecordInStorage ? pdfObjectUrl : ''}
                                 recordLinks={recordLinksToShow}
                                 setStage={setStage}
                                 showMenu={showMenu}
@@ -157,9 +168,7 @@ function LloydGeorgeViewRecordStage({
                         fullScreenHandler={setFullScreen}
                         detailsElement={<RecordDetails {...recordDetailsProps} />}
                         isFullScreen={session.isFullscreen!}
-                        refreshRecord={refreshRecord}
-                        pdfObjectUrl={pdfObjectUrl}
-                        resetDocStage={resetDocState}
+                        pdfObjectUrl={hasRecordInStorage ? pdfObjectUrl : ''}
                     />
                 )}
             </div>

app/src/components/generic/recordCard/RecordCard.test.tsx

@@ -38,9 +38,7 @@ describe('RecordCard Component', () => {
         fullScreenHandler: mockFullScreenHandler,
         detailsElement: <div>Mock Details Element</div>,
         isFullScreen: false,
-        refreshRecord: vi.fn(),
         pdfObjectUrl: 'https://test.com',
-        resetDocStage: vi.fn(),
     };
 
     beforeEach(() => {
@@ -61,14 +59,6 @@ describe('RecordCard Component', () => {
             expect(screen.getByText('Mock Details Element')).toBeInTheDocument();
         });
 
-        it('calls refreshRecord on mount', async () => {
-            const mockRefreshRecord = vi.fn();
-            render(<RecordCard {...props} refreshRecord={mockRefreshRecord} />);
-            await waitFor(() => {
-                expect(mockRefreshRecord).toHaveBeenCalledTimes(1);
-            });
-        });
-
         it('renders the "View in full screen" button when recordUrl is set', async () => {
             mockGetLloydGeorgeRecord.mockResolvedValue(buildLgSearchResult());
 

app/src/components/generic/recordCard/RecordCard.tsx

@@ -1,5 +1,5 @@
 import { Card } from 'nhsuk-react-components';
-import { Dispatch, ReactNode, SetStateAction, useEffect, useRef } from 'react';
+import { Dispatch, ReactNode, SetStateAction } from 'react';
 import PdfViewer from '../pdfViewer/PdfViewer';
 import { LGRecordActionLink } from '../../../types/blocks/lloydGeorgeActions';
 import { LG_RECORD_STAGE } from '../../../types/blocks/lloydGeorgeStages';
@@ -10,9 +10,7 @@ export type Props = {
     fullScreenHandler: (clicked: true) => void;
     detailsElement: ReactNode;
     isFullScreen: boolean;
-    refreshRecord: () => void;
     pdfObjectUrl: string;
-    resetDocStage: () => void;
     recordLinks?: Array<LGRecordActionLink>;
     setStage?: Dispatch<SetStateAction<LG_RECORD_STAGE>>;
     showMenu?: boolean;
@@ -24,25 +22,10 @@ function RecordCard({
     detailsElement,
     isFullScreen,
     pdfObjectUrl,
-    refreshRecord,
-    resetDocStage,
     recordLinks = [],
     setStage = () => {},
     showMenu = false,
 }: Props) {
-    const mounted = useRef(false);
-
-    useEffect(() => {
-        const onPageLoad = async () => {
-            resetDocStage();
-            await refreshRecord();
-        };
-        if (!mounted.current) {
-            onPageLoad();
-            mounted.current = true;
-        }
-    }, [refreshRecord, resetDocStage]);
-
     const Record = () => {
         return pdfObjectUrl ? <PdfViewer fileUrl={pdfObjectUrl} /> : null;
     };
@@ -75,7 +58,6 @@ function RecordCard({
                                 data-testid="full-screen-btn"
                                 onClick={() => {
                                     fullScreenHandler(true);
-                                    resetDocStage();
                                 }}
                             >
                                 View in full screen