10472 story

web-client/src/presenter/actions/PDFPreviewTab/loadPdfForTabAction.ts

@@ -0,0 +1,47 @@
+export const loadPdfForTabAction = ({
+  applicationContext,
+  props,
+  router,
+}: ActionProps) => {
+  const { file } = props;
+  const isBase64Encoded = typeof file === 'string' && file.startsWith('data');
+
+  return new Promise((resolve, reject) => {
+    const reader = applicationContext.getFileReaderInstance();
+
+    if (!reader) {
+      reject(new Error('FileReader instance is null'));
+      return;
+    }
+
+    reader.onload = () => {
+      let binaryFile;
+      if (isBase64Encoded) {
+        const base64File = reader.result.replace(/[^,]+,/, '');
+        binaryFile = atob(base64File);
+      } else {
+        binaryFile = reader.result;
+      }
+
+      try {
+        const pdfDataUri = router.createObjectURL(
+          new Blob([binaryFile], { type: 'application/pdf' }),
+        );
+        window.open(pdfDataUri, '_blank');
+        resolve();
+      } catch (err) {
+        reject(err);
+      }
+    };
+
+    reader.onerror = function (err) {
+      reject(err);
+    };
+
+    if (isBase64Encoded) {
+      reader.readAsDataURL(file);
+    } else {
+      reader.readAsArrayBuffer(file);
+    }
+  });
+};

web-client/src/presenter/actions/getPDFForPreviewTabAction.ts

@@ -0,0 +1,21 @@
+import { state } from '@web-client/presenter/app.cerebral';
+
+export const getPDFForPreviewTabAction = async ({
+  applicationContext,
+  get,
+  props,
+}: ActionProps) => {
+  if (props.file.name) {
+    return props;
+  }
+  const { docketEntryId } = props.file;
+  const docketNumber = get(state.caseDetail.docketNumber);
+
+  const pdfObj = await applicationContext
+    .getUseCases()
+    .loadPDFForPreviewInteractor(applicationContext, {
+      docketEntryId,
+      docketNumber,
+    });
+  return { file: pdfObj };
+};

web-client/src/presenter/actions/openCaseDocumentDownloadUrlAction.ts

@@ -1,11 +1,5 @@
 import { state } from '@web-client/presenter/app.cerebral';
 
-/**
- * opens the document in a new tab
- * @param {object} providers the providers object
- * @param {object} providers.props the cerebral props object
- * @param {object} providers.store the cerebral store object used for clearing alertError, alertSuccess
- */
 export const openCaseDocumentDownloadUrlAction = async ({
   applicationContext,
   props,

web-client/src/presenter/computeds/fileDocumentHelper.ts

@@ -119,6 +119,7 @@ export const fileDocumentHelper = (
     supportingDocumentTypeList,
     ...showSecondaryProperties,
     ...supportingDocumentFlags,
+    docketNumber: caseDetail.docketNumber,
   };
 
   if (form.hasSupportingDocuments) {

web-client/src/presenter/presenter.ts

@@ -233,6 +233,7 @@ import { loadDefaultDraftViewerDocumentToDisplaySequence } from './sequences/Doc
 import { loadDefaultViewerCorrespondenceSequence } from './sequences/loadDefaultViewerCorrespondenceSequence';
 import { loadMoreCaseDeadlinesSequence } from './sequences/loadMoreCaseDeadlinesSequence';
 import { loadMorePendingItemsSequence } from './sequences/loadMorePendingItemsSequence';
+import { loadPdfForTabSequence } from './sequences/PDFPreviewTab/loadPdfForTabSequence';
 import { loadPdfSequence } from './sequences/PDFPreviewModal/loadPdfSequence';
 import { navigateBackSequence } from './sequences/navigateBackSequence';
 import { navigateToCaseDetailFromPaperServiceSequence } from './sequences/navigateToCaseDetailFromPaperServiceSequence';
@@ -975,6 +976,7 @@ export const presenterSequences = {
     loadMoreCaseDeadlinesSequence as unknown as Function,
   loadMorePendingItemsSequence:
     loadMorePendingItemsSequence as unknown as Function,
+  loadPdfForTabSequence: loadPdfForTabSequence as unknown as Function,
   loadPdfSequence: loadPdfSequence as unknown as Function,
   navigateBackSequence: navigateBackSequence as unknown as Function,
   navigateToCaseDetailFromPaperServiceSequence:

web-client/src/presenter/sequences/PDFPreviewTab/loadPdfForTabSequence.ts

@@ -0,0 +1,9 @@
+import { getPDFForPreviewTabAction } from '../../actions/getPDFForPreviewTabAction';
+import { loadPdfForTabAction } from '../../actions/PDFPreviewTab/loadPdfForTabAction';
+
+import { showProgressSequenceDecorator } from '../../utilities/showProgressSequenceDecorator';
+
+export const loadPdfForTabSequence = showProgressSequenceDecorator([
+  getPDFForPreviewTabAction,
+  loadPdfForTabAction,
+]);

web-client/src/views/DocketRecord/DocumentViewerDocument.tsx

@@ -207,12 +207,12 @@ export const DocumentViewerDocument = connect(
                 link
                 icon="file-pdf"
                 iconColor="white"
-                onClick={() =>
-                  openCaseDocumentDownloadUrlSequence({
+                onClick={() => {
+                  return openCaseDocumentDownloadUrlSequence({
                     docketEntryId: viewerDocumentToDisplay.docketEntryId,
                     docketNumber: caseDetail.docketNumber,
-                  })
-                }
+                  });
+                }}
               >
                 View Full PDF
               </Button>

web-client/src/views/PDFPreviewButton.tsx

@@ -9,7 +9,9 @@ import { state } from '@web-client/presenter/app.cerebral';
 import React from 'react';
 
 const pdfPreviewButtonDeps = {
-  openPdfPreviewModalSequence: sequences.openPdfPreviewModalSequence,
+  loadPdfForTabSequence: sequences.loadPdfForTabSequence,
+  openCaseDocumentDownloadUrlSequence:
+    sequences.openCaseDocumentDownloadUrlSequence,
   pdfPreviewModalHelper: state.pdfPreviewModalHelper,
   showModal: state.modal.showModal,
 };
@@ -30,7 +32,7 @@ export const PDFPreviewButton = connect<
   function PDFPreviewButton({
     file,
     id,
-    openPdfPreviewModalSequence,
+    loadPdfForTabSequence,
     pdfPreviewModalHelper,
     shouldAbbreviateTitle = false,
     shouldWrapText = true,
@@ -72,7 +74,7 @@ export const PDFPreviewButton = connect<
           <Button
             {...buttonProps}
             onClick={() => {
-              return openPdfPreviewModalSequence({ file, modalId });
+              return loadPdfForTabSequence({ file });
             }}
           >
             {displayTitle}