From 215444e46ae19147146630bfa68585455bc7c0cf Mon Sep 17 00:00:00 2001
From: "to. sandra" <76515860+sandratoh@users.noreply.github.com>
Date: Thu, 14 Mar 2024 15:55:45 -0700
Subject: [PATCH] Open alcs and portal document inline with standardized method
 (#1513)

* Update ALCS CSP to allow file document storage source

* Rename function name and update bg color

* Update portal public documents and decision documents

* Set browser tab title when opening alcs file inline

* Change portal backend and frontend to retrieve filename from existing logic

* Rename function to match alcs

* Update alcs detail page open file logic
---
 alcs-frontend/nginx.conf                      |  2 +-
 .../application-details.component.html        |  4 +-
 .../application-details.component.ts          |  8 ++--
 .../notice-of-intent-details.component.html   | 16 +++----
 .../notice-of-intent-details.component.ts     |  4 +-
 .../notification-details.component.html       |  8 ++--
 .../notification-details.component.ts         |  6 +--
 .../application-document.service.ts           | 11 +++--
 .../application-submission.service.ts         |  1 -
 alcs-frontend/src/app/shared/utils/file.ts    | 25 +++++++----
 .../application-details.component.html        |  4 +-
 .../application-details.component.ts          |  8 ++--
 .../cove-details/cove-details.component.html  |  4 +-
 .../cove-details/cove-details.component.ts    |  8 ++--
 .../excl-details/excl-details.component.html  |  8 ++--
 .../excl-details/excl-details.component.ts    |  8 ++--
 .../incl-details/incl-details.component.html  |  8 ++--
 .../incl-details/incl-details.component.ts    |  8 ++--
 .../naru-details/naru-details.component.html  |  2 +-
 .../naru-details/naru-details.component.ts    |  8 ++--
 .../nfu-details/nfu-details.component.html    |  2 +-
 .../nfu-details/nfu-details.component.ts      |  8 ++--
 .../parcel/parcel.component.html              | 25 +++--------
 .../parcel/parcel.component.ts                |  8 ++--
 .../pfrs-details/pfrs-details.component.html  |  8 ++--
 .../pfrs-details/pfrs-details.component.ts    |  8 ++--
 .../pofo-details/pofo-details.component.html  |  6 +--
 .../pofo-details/pofo-details.component.ts    |  8 ++--
 .../roso-details/roso-details.component.html  |  6 +--
 .../roso-details/roso-details.component.ts    |  8 ++--
 .../subd-details/subd-details.component.html  |  4 +-
 .../subd-details/subd-details.component.ts    |  8 ++--
 .../tur-details/tur-details.component.html    |  4 +-
 .../tur-details/tur-details.component.ts      |  8 ++--
 .../edit-submission/files-step.partial.ts     |  8 ++--
 .../other-attachments.component.html          |  2 +-
 .../parcel-entry/parcel-entry.component.ts    |  8 ++--
 .../review-attachments.component.ts           |  8 ++--
 .../review-submit-fng.component.html          | 12 ++---
 .../review-submit-fng.component.ts            |  8 ++--
 .../review-submit.component.html              | 16 +++----
 .../review-submit/review-submit.component.ts  |  8 ++--
 .../decisions/decisions.component.html        |  8 ++--
 .../decisions/decisions.component.ts          |  8 ++--
 .../submission-documents.component.html       | 44 +++++++++----------
 .../submission-documents.component.ts         |  8 ++--
 .../lfng-review/lfng-review.component.html    | 41 ++++++++++-------
 .../lfng-review/lfng-review.component.ts      |  8 ++--
 .../view-application-submission.component.ts  |  8 ++--
 .../edit-submission/files-step.partial.ts     |  8 ++--
 .../other-attachments.component.html          |  2 +-
 .../other-attachments.component.ts            |  4 --
 .../parcel-entry/parcel-entry.component.ts    |  8 ++--
 .../additional-information.component.html     |  2 +-
 .../additional-information.component.ts       |  8 ++--
 .../notice-of-intent-details.component.html   |  6 +--
 .../notice-of-intent-details.component.ts     |  8 ++--
 .../parcel/parcel.component.html              | 25 +++--------
 .../parcel/parcel.component.ts                |  8 ++--
 .../pfrs-details/pfrs-details.component.html  |  8 ++--
 .../pfrs-details/pfrs-details.component.ts    |  8 ++--
 .../pofo-details/pofo-details.component.html  |  6 +--
 .../pofo-details/pofo-details.component.ts    |  8 ++--
 .../roso-details/roso-details.component.html  |  8 ++--
 .../roso-details/roso-details.component.ts    |  8 ++--
 .../decisions/decisions.component.html        |  8 ++--
 .../decisions/decisions.component.ts          |  8 ++--
 .../submission-documents.component.html       |  2 +-
 .../submission-documents.component.ts         |  8 ++--
 .../edit-submission/files-step.partial.ts     |  8 ++--
 .../other-attachments.component.html          |  2 +-
 .../proposal/proposal.component.html          |  2 +-
 .../notification-details.component.html       |  6 +--
 .../notification-details.component.ts         |  8 ++--
 .../proposal-details.component.html           |  4 +-
 .../proposal-details.component.ts             |  8 ++--
 .../submission-documents.component.html       | 44 +++++++++----------
 .../submission-documents.component.ts         |  8 ++--
 .../decisions/decisions.component.html        |  8 ++--
 .../decisions/decisions.component.ts          |  8 ++--
 .../submission-documents.component.html       | 44 +++++++++----------
 .../submission-documents.component.ts         |  7 +--
 .../lfng-review/lfng-review.component.html    |  2 +-
 .../lfng-review/lfng-review.component.ts      |  7 +--
 .../cove-details/cove-details.component.html  |  2 +-
 .../cove-details/cove-details.component.ts    |  9 ++--
 .../excl-details/excl-details.component.html  |  4 +-
 .../excl-details/excl-details.component.ts    |  7 +--
 .../incl-details/incl-details.component.html  |  4 +-
 .../incl-details/incl-details.component.ts    |  7 +--
 .../naru-details/naru-details.component.html  |  2 +-
 .../naru-details/naru-details.component.ts    |  7 +--
 .../nfu-details/nfu-details.component.html    |  2 +-
 .../nfu-details/nfu-details.component.ts      |  7 +--
 .../pfrs-details/pfrs-details.component.html  |  6 +--
 .../pfrs-details/pfrs-details.component.ts    |  7 +--
 .../pofo-details/pofo-details.component.html  | 28 ++++--------
 .../pofo-details/pofo-details.component.ts    |  7 +--
 .../roso-details/roso-details.component.html  |  4 +-
 .../roso-details/roso-details.component.ts    |  7 +--
 .../subd-details/subd-details.component.html  |  2 +-
 .../subd-details/subd-details.component.ts    |  7 +--
 .../tur-details/tur-details.component.html    |  2 +-
 .../tur-details/tur-details.component.ts      |  7 +--
 .../decisions/decisions.component.html        |  8 ++--
 .../decisions/decisions.component.ts          |  8 ++--
 .../submission-documents.component.html       |  2 +-
 .../submission-documents.component.ts         |  7 +--
 .../additional-information.component.ts       |  9 ++--
 .../pfrs-details/pfrs-details.component.html  |  4 +-
 .../pfrs-details/pfrs-details.component.ts    |  9 ++--
 .../pofo-details/pofo-details.component.html  | 32 ++++----------
 .../pofo-details/pofo-details.component.ts    |  9 ++--
 .../roso-details/roso-details.component.html  | 32 ++++----------
 .../roso-details/roso-details.component.ts    |  9 ++--
 .../submission-documents.component.html       |  2 +-
 .../submission-documents.component.ts         |  7 +--
 .../additional-information.component.ts       |  9 ++--
 .../application-document.service.ts           |  4 +-
 .../notice-of-intent-document.service.ts      |  4 +-
 .../notification-document.service.ts          |  4 +-
 .../file-drag-drop.component.html             |  2 +-
 .../file-drag-drop.component.ts               |  6 +--
 .../owner-dialog/owner-dialog.component.ts    |  5 ++-
 .../parcel-owners.component.html              |  2 +-
 .../parcel-owners/parcel-owners.component.ts  | 10 +++--
 portal-frontend/src/app/shared/utils/file.ts  |  8 ++--
 .../application-document.controller.spec.ts   |  1 -
 .../application-document.controller.ts        |  3 +-
 ...tice-of-intent-document.controller.spec.ts |  1 -
 .../notice-of-intent-document.controller.ts   |  3 +-
 .../notification-document.controller.spec.ts  |  1 -
 .../notification-document.controller.ts       |  3 +-
 .../application/public-application.service.ts |  4 +-
 .../public-notice-of-intent.service.ts        |  4 +-
 .../public-notification.service.ts            |  4 +-
 136 files changed, 544 insertions(+), 574 deletions(-)

diff --git a/alcs-frontend/nginx.conf b/alcs-frontend/nginx.conf
index 1da2eb30aa..6ccc98d57e 100644
--- a/alcs-frontend/nginx.conf
+++ b/alcs-frontend/nginx.conf
@@ -19,7 +19,7 @@ http {
         add_header 'X-XSS-Protection' '1; mode=block';
         add_header 'Strict-Transport-Security' 'max-age=31536000; includeSubDomains; preload';
         add_header 'Cache-control' 'no-cache';
-        add_header 'Content-Security-Policy' "default-src 'self';img-src 'self';style-src 'unsafe-inline' 'self';connect-src $ENABLED_CONNECT_SRC; font-src 'self' https://fonts.gstatic.com https://fonts.googleapis.com; base-uri 'self'; object-src 'none'; frame-src https://alcs-metabase-test.apps.silver.devops.gov.bc.ca https://alcs-metabase-prod.apps.silver.devops.gov.bc.ca;";
+        add_header 'Content-Security-Policy' "default-src 'self';img-src 'self';style-src 'unsafe-inline' 'self';connect-src $ENABLED_CONNECT_SRC; font-src 'self' https://fonts.gstatic.com https://fonts.googleapis.com; base-uri 'self'; object-src https://nrs.objectstore.gov.bc.ca; frame-src https://alcs-metabase-test.apps.silver.devops.gov.bc.ca https://alcs-metabase-prod.apps.silver.devops.gov.bc.ca https://nrs.objectstore.gov.bc.ca;";
         add_header 'Permissions-Policy' 'camera=(), geolocation=(), microphone=()';
         add_header 'Referrer-Policy' 'same-origin';
 
diff --git a/alcs-frontend/src/app/features/application/applicant-info/application-details/application-details.component.html b/alcs-frontend/src/app/features/application/applicant-info/application-details/application-details.component.html
index d2d5a050b7..aa03160e66 100644
--- a/alcs-frontend/src/app/features/application/applicant-info/application-details/application-details.component.html
+++ b/alcs-frontend/src/app/features/application/applicant-info/application-details/application-details.component.html
@@ -81,7 +81,7 @@ <h3>Primary Contact Information</h3>
       <div class="subheading2 grid-1">Authorization Letter(s)</div>
       <div class="grid-double">
         <div *ngFor="let file of authorizationLetters">
-          <a (click)="openFile(file.uuid)">{{ file.fileName }}</a>
+          <a (click)="openFile(file)">{{ file.fileName }}</a>
         </div>
       </div>
     </ng-container>
@@ -226,7 +226,7 @@ <h3>Optional Documents</h3>
 
       <ng-container *ngFor="let file of otherFiles">
         <div class="grid-1">
-          <a (click)="openFile(file.uuid)">{{ file.fileName }}</a>
+          <a (click)="openFile(file)">{{ file.fileName }}</a>
         </div>
         <div class="grid-2">
           {{ file.type?.label }}
diff --git a/alcs-frontend/src/app/features/application/applicant-info/application-details/application-details.component.ts b/alcs-frontend/src/app/features/application/applicant-info/application-details/application-details.component.ts
index 67eba7fd21..6dfaa088c0 100644
--- a/alcs-frontend/src/app/features/application/applicant-info/application-details/application-details.component.ts
+++ b/alcs-frontend/src/app/features/application/applicant-info/application-details/application-details.component.ts
@@ -47,8 +47,8 @@ export class ApplicationDetailsComponent implements OnInit, OnChanges, OnDestroy
     window.location.href = `${environment.portalUrl}/alcs/application/${this.fileNumber}/edit/${step}`;
   }
 
-  async openFile(uuid: string) {
-    await this.applicationDocumentService.download(uuid, '');
+  async openFile(file: ApplicationDocumentDto) {
+    await this.applicationDocumentService.download(file.uuid, file.fileName);
   }
 
   private async loadDocuments() {
@@ -56,10 +56,10 @@ export class ApplicationDetailsComponent implements OnInit, OnChanges, OnDestroy
     this.otherFiles = documents.filter(
       (document) =>
         document.type &&
-        [DOCUMENT_TYPE.PHOTOGRAPH, DOCUMENT_TYPE.OTHER, DOCUMENT_TYPE.PROFESSIONAL_REPORT].includes(document.type.code)
+        [DOCUMENT_TYPE.PHOTOGRAPH, DOCUMENT_TYPE.OTHER, DOCUMENT_TYPE.PROFESSIONAL_REPORT].includes(document.type.code),
     );
     this.authorizationLetters = documents.filter(
-      (document) => document.type?.code === DOCUMENT_TYPE.AUTHORIZATION_LETTER
+      (document) => document.type?.code === DOCUMENT_TYPE.AUTHORIZATION_LETTER,
     );
     this.files = documents;
   }
diff --git a/alcs-frontend/src/app/features/notice-of-intent/applicant-info/notice-of-intent-details/notice-of-intent-details.component.html b/alcs-frontend/src/app/features/notice-of-intent/applicant-info/notice-of-intent-details/notice-of-intent-details.component.html
index 5262069026..771db3e5f7 100644
--- a/alcs-frontend/src/app/features/notice-of-intent/applicant-info/notice-of-intent-details/notice-of-intent-details.component.html
+++ b/alcs-frontend/src/app/features/notice-of-intent/applicant-info/notice-of-intent-details/notice-of-intent-details.component.html
@@ -51,7 +51,7 @@ <h3>Primary Contact Information</h3>
       <div class="subheading2 grid-1">Authorization Letter(s)</div>
       <div class="grid-double">
         <div *ngFor="let file of authorizationLetters">
-          <a (click)="openFile(file.uuid)">{{ file.fileName }}</a>
+          <a (click)="openFile(file)">{{ file.fileName }}</a>
         </div>
       </div>
     </ng-container>
@@ -68,21 +68,15 @@ <h3>Land Use</h3>
     <div class="full-width">
       <h4>Land Use of Parcel(s) under Notice of Intent</h4>
     </div>
-    <div class="subheading2 grid-1">
-      Describe all agriculture that currently takes place on the parcel(s).
-    </div>
+    <div class="subheading2 grid-1">Describe all agriculture that currently takes place on the parcel(s).</div>
     <div class="grid-double">
       {{ submission.parcelsAgricultureDescription }}
     </div>
-    <div class="subheading2 grid-1">
-      Describe all agricultural improvements made to the parcel(s).
-    </div>
+    <div class="subheading2 grid-1">Describe all agricultural improvements made to the parcel(s).</div>
     <div class="grid-double">
       {{ submission.parcelsAgricultureImprovementDescription }}
     </div>
-    <div class="subheading2 grid-1">
-      Describe all other uses that currently take place on the parcel(s).
-    </div>
+    <div class="subheading2 grid-1">Describe all other uses that currently take place on the parcel(s).</div>
     <div class="grid-double">
       {{ submission.parcelsNonAgricultureUseDescription }}
     </div>
@@ -184,7 +178,7 @@ <h3>Optional Documents</h3>
           {{ file.description }}
         </div>
         <div class="grid-3">
-          <a (click)="openFile(file.uuid)">{{ file.fileName }}</a>
+          <a (click)="openFile(file)">{{ file.fileName }}</a>
         </div>
       </ng-container>
       <div *ngIf="otherFiles.length === 0" class="full-width">No optional attachments</div>
diff --git a/alcs-frontend/src/app/features/notice-of-intent/applicant-info/notice-of-intent-details/notice-of-intent-details.component.ts b/alcs-frontend/src/app/features/notice-of-intent/applicant-info/notice-of-intent-details/notice-of-intent-details.component.ts
index a49c553730..81f34cccb2 100644
--- a/alcs-frontend/src/app/features/notice-of-intent/applicant-info/notice-of-intent-details/notice-of-intent-details.component.ts
+++ b/alcs-frontend/src/app/features/notice-of-intent/applicant-info/notice-of-intent-details/notice-of-intent-details.component.ts
@@ -47,8 +47,8 @@ export class NoticeOfIntentDetailsComponent implements OnInit, OnChanges, OnDest
     window.location.href = `${environment.portalUrl}/alcs/notice-of-intent/${this.fileNumber}/edit/${step}`;
   }
 
-  async openFile(uuid: string) {
-    await this.noiDocumentService.download(uuid, '');
+  async openFile(file: NoticeOfIntentDocumentDto) {
+    await this.noiDocumentService.download(file.uuid, file.fileName);
   }
 
   private async loadDocuments() {
diff --git a/alcs-frontend/src/app/features/notification/applicant-info/notification-details/notification-details.component.html b/alcs-frontend/src/app/features/notification/applicant-info/notification-details/notification-details.component.html
index 86f34b9c41..a98da9588c 100644
--- a/alcs-frontend/src/app/features/notification/applicant-info/notification-details/notification-details.component.html
+++ b/alcs-frontend/src/app/features/notification/applicant-info/notification-details/notification-details.component.html
@@ -18,7 +18,7 @@ <h3>Transferee(s)</h3>
           <app-no-data *ngIf="!transferee.organizationName"></app-no-data>
         </div>
         <div>
-          <span *ngIf="transferee.phoneNumber">{{ transferee.phoneNumber | mask : '(000) 000-0000' }}</span>
+          <span *ngIf="transferee.phoneNumber">{{ transferee.phoneNumber | mask: '(000) 000-0000' }}</span>
         </div>
         <div>{{ transferee.email }}</div>
       </ng-container>
@@ -76,7 +76,7 @@ <h3>Purpose of SRW</h3>
     <div class="subheading2 grid-1">Upload Terms of the SRW</div>
     <div class="grid-double">
       <div *ngFor="let document of srwTerms">
-        <a (click)="openFile(document.uuid)">
+        <a (click)="openFile(document)">
           {{ document.fileName }}
         </a>
       </div>
@@ -91,7 +91,7 @@ <h3>Purpose of SRW</h3>
       <div class="subheading2">Control Number</div>
       <ng-container *ngFor="let document of surveyPlans">
         <div>
-          <a (click)="openFile(document.uuid)">
+          <a (click)="openFile(document)">
             {{ document.fileName }}
           </a>
         </div>
@@ -115,7 +115,7 @@ <h3>Optional Documents</h3>
 
       <ng-container *ngFor="let file of otherFiles">
         <div>
-          <a (click)="openFile(file.uuid)">{{ file.fileName }}</a>
+          <a (click)="openFile(file)">{{ file.fileName }}</a>
         </div>
         <div>
           {{ file.type?.label }}
diff --git a/alcs-frontend/src/app/features/notification/applicant-info/notification-details/notification-details.component.ts b/alcs-frontend/src/app/features/notification/applicant-info/notification-details/notification-details.component.ts
index 81289ff544..599e91b353 100644
--- a/alcs-frontend/src/app/features/notification/applicant-info/notification-details/notification-details.component.ts
+++ b/alcs-frontend/src/app/features/notification/applicant-info/notification-details/notification-details.component.ts
@@ -42,8 +42,8 @@ export class NotificationDetailsComponent implements OnInit, OnChanges, OnDestro
     this.$destroy.complete();
   }
 
-  async openFile(uuid: string) {
-    await this.notificationDocumentService.download(uuid, '');
+  async openFile(file: NotificationDocumentDto) {
+    await this.notificationDocumentService.download(file.uuid, file.fileName);
   }
 
   private async loadDocuments() {
@@ -53,7 +53,7 @@ export class NotificationDetailsComponent implements OnInit, OnChanges, OnDestro
     this.otherFiles = documents.filter(
       (document) =>
         document.type &&
-        [DOCUMENT_TYPE.PHOTOGRAPH, DOCUMENT_TYPE.OTHER, DOCUMENT_TYPE.PROFESSIONAL_REPORT].includes(document.type.code)
+        [DOCUMENT_TYPE.PHOTOGRAPH, DOCUMENT_TYPE.OTHER, DOCUMENT_TYPE.PROFESSIONAL_REPORT].includes(document.type.code),
     );
     this.files = documents;
   }
diff --git a/alcs-frontend/src/app/services/application/application-document/application-document.service.ts b/alcs-frontend/src/app/services/application/application-document/application-document.service.ts
index 08af097986..0b8486d93e 100644
--- a/alcs-frontend/src/app/services/application/application-document/application-document.service.ts
+++ b/alcs-frontend/src/app/services/application/application-document/application-document.service.ts
@@ -14,7 +14,10 @@ import { ApplicationDocumentDto, CreateDocumentDto, UpdateDocumentDto } from './
 export class ApplicationDocumentService {
   private url = `${environment.apiUrl}/application-document`;
 
-  constructor(private http: HttpClient, private toastService: ToastService) {}
+  constructor(
+    private http: HttpClient,
+    private toastService: ToastService,
+  ) {}
 
   async listAll(fileNumber: string) {
     return firstValueFrom(this.http.get<ApplicationDocumentDto[]>(`${this.url}/application/${fileNumber}`));
@@ -22,7 +25,7 @@ export class ApplicationDocumentService {
 
   async listByVisibility(fileNumber: string, visibilityFlags: string[]) {
     return firstValueFrom(
-      this.http.get<ApplicationDocumentDto[]>(`${this.url}/application/${fileNumber}/${visibilityFlags.join()}`)
+      this.http.get<ApplicationDocumentDto[]>(`${this.url}/application/${fileNumber}/${visibilityFlags.join()}`),
     );
   }
 
@@ -55,13 +58,13 @@ export class ApplicationDocumentService {
 
   async getReviewDocuments(fileNumber: string) {
     return firstValueFrom(
-      this.http.get<ApplicationDocumentDto[]>(`${this.url}/application/${fileNumber}/reviewDocuments`)
+      this.http.get<ApplicationDocumentDto[]>(`${this.url}/application/${fileNumber}/reviewDocuments`),
     );
   }
 
   async getApplicantDocuments(fileNumber: string) {
     return firstValueFrom(
-      this.http.get<ApplicationDocumentDto[]>(`${this.url}/application/${fileNumber}/applicantDocuments`)
+      this.http.get<ApplicationDocumentDto[]>(`${this.url}/application/${fileNumber}/applicantDocuments`),
     );
   }
 
diff --git a/alcs-frontend/src/app/services/application/application-submission/application-submission.service.ts b/alcs-frontend/src/app/services/application/application-submission/application-submission.service.ts
index cf6527bdc5..ee3bad5a7f 100644
--- a/alcs-frontend/src/app/services/application/application-submission/application-submission.service.ts
+++ b/alcs-frontend/src/app/services/application/application-submission/application-submission.service.ts
@@ -2,7 +2,6 @@ import { HttpClient } from '@angular/common/http';
 import { Injectable } from '@angular/core';
 import { firstValueFrom } from 'rxjs';
 import { environment } from '../../../../environments/environment';
-import { openFileInline } from '../../../shared/utils/file';
 import { ToastService } from '../../toast/toast.service';
 import { ApplicationSubmissionDto, CovenantTransfereeDto, UpdateApplicationSubmissionDto } from '../application.dto';
 
diff --git a/alcs-frontend/src/app/shared/utils/file.ts b/alcs-frontend/src/app/shared/utils/file.ts
index 76fc39d1d0..46fd3ee062 100644
--- a/alcs-frontend/src/app/shared/utils/file.ts
+++ b/alcs-frontend/src/app/shared/utils/file.ts
@@ -11,14 +11,21 @@ export const downloadFileFromUrl = (url: string, fileName: string) => {
 };
 
 export const openFileInline = (url: string, fileName: string) => {
-  const downloadLink = document.createElement('a');
-  downloadLink.href = url;
-  downloadLink.download = fileName;
-  downloadLink.target = '_blank';
-  if (window.webkitURL == null) {
-    downloadLink.onclick = (event: MouseEvent) => document.body.removeChild(<Node>event.target);
-    downloadLink.style.display = 'none';
-    document.body.appendChild(downloadLink);
+  const newWindow = window.open('', '_blank');
+  if (newWindow) {
+    newWindow.document.title = fileName;
+
+    const object = newWindow.document.createElement('object');
+    object.data = url;
+    object.style.borderWidth = '0';
+    object.style.width = '100%';
+    object.style.height = '100%';
+
+    newWindow.document.body.appendChild(object);
+    newWindow.document.body.style.backgroundColor = 'rgb(14, 14, 14)';
+    newWindow.document.body.style.height = '100%';
+    newWindow.document.body.style.width = '100%';
+    newWindow.document.body.style.margin = '0';
+    newWindow.document.body.style.overflow = 'hidden';
   }
-  downloadLink.click();
 };
diff --git a/portal-frontend/src/app/features/applications/application-details/application-details.component.html b/portal-frontend/src/app/features/applications/application-details/application-details.component.html
index 0a4cd6716b..542065b950 100644
--- a/portal-frontend/src/app/features/applications/application-details/application-details.component.html
+++ b/portal-frontend/src/app/features/applications/application-details/application-details.component.html
@@ -91,7 +91,7 @@ <h3>3. Primary Contact</h3>
           *ngIf="authorizationLetters.length === 0"
         ></app-no-data>
         <div *ngFor="let file of authorizationLetters">
-          <a (click)="openFile(file.uuid)">{{ file.fileName }}</a>
+          <a (click)="openFile(file)">{{ file.fileName }}</a>
         </div>
         <app-validation-error *ngIf="!needsAuthorizationLetter && authorizationLetters.length > 0">
           Authorization letters are not required, please remove them
@@ -320,7 +320,7 @@ <h3>7. Optional Documents</h3>
 
       <ng-container *ngFor="let file of otherFiles">
         <div class="grid-1">
-          <a (click)="openFile(file.uuid)">{{ file.fileName }}</a>
+          <a (click)="openFile(file)">{{ file.fileName }}</a>
         </div>
         <div class="grid-2">
           {{ file.type?.label }}
diff --git a/portal-frontend/src/app/features/applications/application-details/application-details.component.ts b/portal-frontend/src/app/features/applications/application-details/application-details.component.ts
index 5d832e1e89..9110bf9011 100644
--- a/portal-frontend/src/app/features/applications/application-details/application-details.component.ts
+++ b/portal-frontend/src/app/features/applications/application-details/application-details.component.ts
@@ -13,7 +13,7 @@ import { LocalGovernmentDto } from '../../../services/code/code.dto';
 import { CodeService } from '../../../services/code/code.service';
 import { DOCUMENT_SOURCE, DOCUMENT_TYPE } from '../../../shared/dto/document.dto';
 import { OWNER_TYPE } from '../../../shared/dto/owner.dto';
-import { openFileIframe } from '../../../shared/utils/file';
+import { openFileInline } from '../../../shared/utils/file';
 
 @Component({
   selector: 'app-application-details',
@@ -83,10 +83,10 @@ export class ApplicationDetailsComponent implements OnInit, OnDestroy {
     this.$destroy.complete();
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/applications/application-details/cove-details/cove-details.component.html b/portal-frontend/src/app/features/applications/application-details/cove-details/cove-details.component.html
index f7fde7b295..71b976e111 100644
--- a/portal-frontend/src/app/features/applications/application-details/cove-details/cove-details.component.html
+++ b/portal-frontend/src/app/features/applications/application-details/cove-details/cove-details.component.html
@@ -43,7 +43,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="proposalMap.length === 0"></app-no-data>
@@ -61,7 +61,7 @@
     <div class="subheading2 grid-1">Draft Covenant</div>
     <div class="grid-double">
       <div *ngFor="let file of srwTerms">
-        <a (click)="openFile(file.uuid)">
+        <a (click)="openFile(file)">
           {{ file.fileName }}
         </a>
       </div>
diff --git a/portal-frontend/src/app/features/applications/application-details/cove-details/cove-details.component.ts b/portal-frontend/src/app/features/applications/application-details/cove-details/cove-details.component.ts
index 26eb309cfc..2e204f1036 100644
--- a/portal-frontend/src/app/features/applications/application-details/cove-details/cove-details.component.ts
+++ b/portal-frontend/src/app/features/applications/application-details/cove-details/cove-details.component.ts
@@ -6,7 +6,7 @@ import { ApplicationSubmissionDetailedDto } from '../../../../services/applicati
 import { CovenantTransfereeDto } from '../../../../services/covenant-transferee/covenant-transferee.dto';
 import { CovenantTransfereeService } from '../../../../services/covenant-transferee/covenant-transferee.service';
 import { DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-cove-details',
@@ -52,10 +52,10 @@ export class CoveDetailsComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/applications/application-details/excl-details/excl-details.component.html b/portal-frontend/src/app/features/applications/application-details/excl-details/excl-details.component.html
index 95e668cbfd..f8f0626c14 100644
--- a/portal-frontend/src/app/features/applications/application-details/excl-details/excl-details.component.html
+++ b/portal-frontend/src/app/features/applications/application-details/excl-details/excl-details.component.html
@@ -37,7 +37,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="proposalMap.length === 0"></app-no-data>
@@ -46,7 +46,7 @@
   <div class="subheading2 grid-1">Notice of Public Hearing (Advertisement)</div>
   <div class="grid-double">
     <div *ngFor="let file of noticeOfPublicHearing">
-      <a (click)="openFile(file.uuid)">
+      <a (click)="openFile(file)">
         {{ file.fileName }}
       </a>
     </div>
@@ -56,7 +56,7 @@
   <div class="subheading2 grid-1">Proof of Signage</div>
   <div class="grid-double">
     <div *ngFor="let file of proofOfSignage">
-      <a (click)="openFile(file.uuid)">
+      <a (click)="openFile(file)">
         {{ file.fileName }}
       </a>
     </div>
@@ -66,7 +66,7 @@
   <div class="subheading2 grid-1">Report of Public Hearing</div>
   <div class="grid-double">
     <div *ngFor="let file of reportOfPublicHearing">
-      <a (click)="openFile(file.uuid)">
+      <a (click)="openFile(file)">
         {{ file.fileName }}
       </a>
     </div>
diff --git a/portal-frontend/src/app/features/applications/application-details/excl-details/excl-details.component.ts b/portal-frontend/src/app/features/applications/application-details/excl-details/excl-details.component.ts
index ccae72c74b..88ef1097f0 100644
--- a/portal-frontend/src/app/features/applications/application-details/excl-details/excl-details.component.ts
+++ b/portal-frontend/src/app/features/applications/application-details/excl-details/excl-details.component.ts
@@ -4,7 +4,7 @@ import { ApplicationDocumentService } from '../../../../services/application-doc
 import { ApplicationSubmissionDetailedDto } from '../../../../services/application-submission/application-submission.dto';
 import { ApplicationDocumentDto } from '../../../../services/application-document/application-document.dto';
 import { DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-excl-details',
@@ -52,10 +52,10 @@ export class ExclDetailsComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/applications/application-details/incl-details/incl-details.component.html b/portal-frontend/src/app/features/applications/application-details/incl-details/incl-details.component.html
index 128a661d79..039e06d6b8 100644
--- a/portal-frontend/src/app/features/applications/application-details/incl-details/incl-details.component.html
+++ b/portal-frontend/src/app/features/applications/application-details/incl-details/incl-details.component.html
@@ -27,7 +27,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="proposalMap.length === 0"></app-no-data>
@@ -52,7 +52,7 @@
     <div class="subheading2 grid-1">Notice of Public Hearing (Advertisement)</div>
     <div class="grid-double">
       <div *ngFor="let file of noticeOfPublicHearing">
-        <a (click)="openFile(file.uuid)">
+        <a (click)="openFile(file)">
           {{ file.fileName }}
         </a>
       </div>
@@ -62,7 +62,7 @@
     <div class="subheading2 grid-1">Proof of Signage</div>
     <div class="grid-double">
       <div *ngFor="let file of proofOfSignage">
-        <a (click)="openFile(file.uuid)">
+        <a (click)="openFile(file)">
           {{ file.fileName }}
         </a>
       </div>
@@ -72,7 +72,7 @@
     <div class="subheading2 grid-1">Report of Public Hearing</div>
     <div class="grid-double">
       <div *ngFor="let file of reportOfPublicHearing">
-        <a (click)="openFile(file.uuid)">
+        <a (click)="openFile(file)">
           {{ file.fileName }}
         </a>
       </div>
diff --git a/portal-frontend/src/app/features/applications/application-details/incl-details/incl-details.component.ts b/portal-frontend/src/app/features/applications/application-details/incl-details/incl-details.component.ts
index cda17dbd0d..fd26c4073e 100644
--- a/portal-frontend/src/app/features/applications/application-details/incl-details/incl-details.component.ts
+++ b/portal-frontend/src/app/features/applications/application-details/incl-details/incl-details.component.ts
@@ -6,7 +6,7 @@ import { ApplicationSubmissionDetailedDto } from '../../../../services/applicati
 import { ApplicationDocumentDto } from '../../../../services/application-document/application-document.dto';
 import { AuthenticationService } from '../../../../services/authentication/authentication.service';
 import { DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-incl-details',
@@ -72,10 +72,10 @@ export class InclDetailsComponent implements OnInit, OnDestroy {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/applications/application-details/naru-details/naru-details.component.html b/portal-frontend/src/app/features/applications/application-details/naru-details/naru-details.component.html
index a4e0460012..54da0f349d 100644
--- a/portal-frontend/src/app/features/applications/application-details/naru-details/naru-details.component.html
+++ b/portal-frontend/src/app/features/applications/application-details/naru-details/naru-details.component.html
@@ -143,7 +143,7 @@
 
     <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
     <div class="grid-double">
-      <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+      <a *ngFor="let map of proposalMap" (click)="openFile(map)">
         {{ map.fileName }}
       </a>
       <app-no-data [showRequired]="showErrors" *ngIf="proposalMap.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/applications/application-details/naru-details/naru-details.component.ts b/portal-frontend/src/app/features/applications/application-details/naru-details/naru-details.component.ts
index fc5e952eb0..6c68512e71 100644
--- a/portal-frontend/src/app/features/applications/application-details/naru-details/naru-details.component.ts
+++ b/portal-frontend/src/app/features/applications/application-details/naru-details/naru-details.component.ts
@@ -4,7 +4,7 @@ import { ApplicationDocumentDto } from '../../../../services/application-documen
 import { ApplicationDocumentService } from '../../../../services/application-document/application-document.service';
 import { ApplicationSubmissionDetailedDto } from '../../../../services/application-submission/application-submission.dto';
 import { DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-naru-details[applicationSubmission]',
@@ -42,10 +42,10 @@ export class NaruDetailsComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/applications/application-details/nfu-details/nfu-details.component.html b/portal-frontend/src/app/features/applications/application-details/nfu-details/nfu-details.component.html
index 77a9bcc71d..a87c462967 100644
--- a/portal-frontend/src/app/features/applications/application-details/nfu-details/nfu-details.component.html
+++ b/portal-frontend/src/app/features/applications/application-details/nfu-details/nfu-details.component.html
@@ -22,7 +22,7 @@
   </div>
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="proposalMap.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/applications/application-details/nfu-details/nfu-details.component.ts b/portal-frontend/src/app/features/applications/application-details/nfu-details/nfu-details.component.ts
index 4e9fdd0233..f9cb2416c4 100644
--- a/portal-frontend/src/app/features/applications/application-details/nfu-details/nfu-details.component.ts
+++ b/portal-frontend/src/app/features/applications/application-details/nfu-details/nfu-details.component.ts
@@ -4,7 +4,7 @@ import { ApplicationDocumentDto } from '../../../../services/application-documen
 import { ApplicationDocumentService } from '../../../../services/application-document/application-document.service';
 import { ApplicationSubmissionDetailedDto } from '../../../../services/application-submission/application-submission.dto';
 import { DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-nfu-details[applicationSubmission]',
@@ -34,10 +34,10 @@ export class NfuDetailsComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/applications/application-details/parcel/parcel.component.html b/portal-frontend/src/app/features/applications/application-details/parcel/parcel.component.html
index 8948b82268..0dc66f22f6 100644
--- a/portal-frontend/src/app/features/applications/application-details/parcel/parcel.component.html
+++ b/portal-frontend/src/app/features/applications/application-details/parcel/parcel.component.html
@@ -94,7 +94,7 @@ <h4>Parcel #{{ parcelInd + 1 }}</h4>
       <div *ngIf="showCertificateOfTitle" class="subheading2 grid-1">Certificate Of Title</div>
       <div *ngIf="showCertificateOfTitle" class="grid-double">
         <div *ngIf="parcel.certificateOfTitle">
-          <a (click)="onOpenFile(parcel.certificateOfTitle.uuid)">{{ parcel.certificateOfTitle.fileName }}</a>
+          <a (click)="onOpenFile(parcel.certificateOfTitle)">{{ parcel.certificateOfTitle.fileName }}</a>
         </div>
         <app-no-data
           [showRequired]="showErrors && !!parcel.validation?.isCertificateRequired"
@@ -110,16 +110,12 @@ <h5>Government Parcel Contact</h5>
             {{ parcel.owners[0].firstName }}
             <app-no-data [showRequired]="showErrors" *ngIf="!parcel.owners[0].firstName"></app-no-data>
           </div>
-          <div class="subheading2 grid-1">
-            Last Name
-          </div>
+          <div class="subheading2 grid-1">Last Name</div>
           <div class="grid-double">
             {{ parcel.owners[0].lastName }}
             <app-no-data [showRequired]="showErrors" *ngIf="!parcel.owners[0].lastName"></app-no-data>
           </div>
-          <div class="subheading2 grid-1">
-            Ministry or Department
-          </div>
+          <div class="subheading2 grid-1">Ministry or Department</div>
           <div class="grid-double">
             {{ parcel.owners[0].organizationName }}
             <app-no-data [showRequired]="showErrors" *ngIf="!parcel.owners[0].organizationName"></app-no-data>
@@ -134,9 +130,7 @@ <h5>Government Parcel Contact</h5>
             {{ parcel.owners[0].email }}
             <app-no-data [showRequired]="showErrors" *ngIf="!parcel.owners[0].email"></app-no-data>
           </div>
-          <div class="subheading2 grid-1">
-            Crown Type
-          </div>
+          <div class="subheading2 grid-1">Crown Type</div>
           <div class="grid-double">
             {{ parcel.owners[0].crownLandOwnerType === 'provincial' ? 'Provincial Crown' : '' }}
             {{ parcel.owners[0].crownLandOwnerType === 'federal' ? 'Federal Crown' : '' }}
@@ -146,17 +140,12 @@ <h5>Government Parcel Contact</h5>
         <app-no-data [showRequired]="showErrors" *ngIf="!parcel.owners[0]"></app-no-data>
       </ng-container>
 
-      <div
-        class="full-width owner-information"
-        *ngIf="parcel.ownershipTypeCode !== PARCEL_OWNERSHIP_TYPES.CROWN"
-      >
+      <div class="full-width owner-information" *ngIf="parcel.ownershipTypeCode !== PARCEL_OWNERSHIP_TYPES.CROWN">
         <div class="subheading2">Land Owner(s)</div>
         <div class="subheading2">Organization</div>
         <div class="subheading2">Phone</div>
         <div class="subheading2">Email</div>
-        <div class="subheading2">
-          Corporate Summary
-        </div>
+        <div class="subheading2">Corporate Summary</div>
         <ng-container *ngFor="let owner of parcel.owners">
           <div>{{ owner.displayName }}</div>
           <div>
@@ -166,7 +155,7 @@ <h5>Government Parcel Contact</h5>
           <div>{{ owner.phoneNumber ?? '' | mask : '(000) 000-0000' }}</div>
           <div>{{ owner.email }}</div>
           <div>
-            <a *ngIf="owner.corporateSummary" (click)="onOpenFile(owner.corporateSummary.uuid)">{{
+            <a *ngIf="owner.corporateSummary" (click)="onOpenFile(owner.corporateSummary)">{{
               owner.corporateSummary.fileName
             }}</a>
             <div class="no-data" *ngIf="!owner.corporateSummary">
diff --git a/portal-frontend/src/app/features/applications/application-details/parcel/parcel.component.ts b/portal-frontend/src/app/features/applications/application-details/parcel/parcel.component.ts
index a588acd793..3f85c02251 100644
--- a/portal-frontend/src/app/features/applications/application-details/parcel/parcel.component.ts
+++ b/portal-frontend/src/app/features/applications/application-details/parcel/parcel.component.ts
@@ -13,7 +13,7 @@ import { ApplicationParcelService } from '../../../../services/application-parce
 import { ApplicationSubmissionDetailedDto } from '../../../../services/application-submission/application-submission.dto';
 import { BaseCodeDto } from '../../../../shared/dto/base.dto';
 import { formatBooleanToYesNoString } from '../../../../shared/utils/boolean-helper';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 export class ApplicationParcelBasicValidation {
   // indicates general validity check state, including owner related information
@@ -98,10 +98,10 @@ export class ParcelComponent {
     }
   }
 
-  async onOpenFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async onOpenFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/applications/application-details/pfrs-details/pfrs-details.component.html b/portal-frontend/src/app/features/applications/application-details/pfrs-details/pfrs-details.component.html
index 73b18432a7..cb7f40503e 100644
--- a/portal-frontend/src/app/features/applications/application-details/pfrs-details/pfrs-details.component.html
+++ b/portal-frontend/src/app/features/applications/application-details/pfrs-details/pfrs-details.component.html
@@ -209,7 +209,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="proposalMap.length === 0"></app-no-data>
@@ -217,7 +217,7 @@
 
   <div class="subheading2 grid-1">Cross Sections</div>
   <div class="grid-double multiple-documents">
-    <a *ngFor="let file of crossSections" (click)="openFile(file.uuid)">
+    <a *ngFor="let file of crossSections" (click)="openFile(file)">
       {{ file.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="crossSections.length === 0"></app-no-data>
@@ -225,7 +225,7 @@
 
   <div class="subheading2 grid-1">Reclamation Plan</div>
   <div class="grid-double multiple-documents">
-    <a *ngFor="let file of reclamationPlans" (click)="openFile(file.uuid)">
+    <a *ngFor="let file of reclamationPlans" (click)="openFile(file)">
       {{ file.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="reclamationPlans.length === 0"></app-no-data>
@@ -257,7 +257,7 @@
 
   <div *ngIf="_applicationSubmission.soilHasSubmittedNotice" class="subheading2 grid-1">Notice of Work</div>
   <div *ngIf="_applicationSubmission.soilHasSubmittedNotice" class="grid-double multiple-documents">
-    <a *ngFor="let file of noticeOfWork" (click)="openFile(file.uuid)">
+    <a *ngFor="let file of noticeOfWork" (click)="openFile(file)">
       {{ file.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="noticeOfWork.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/applications/application-details/pfrs-details/pfrs-details.component.ts b/portal-frontend/src/app/features/applications/application-details/pfrs-details/pfrs-details.component.ts
index 9cc2770c6d..df615202ef 100644
--- a/portal-frontend/src/app/features/applications/application-details/pfrs-details/pfrs-details.component.ts
+++ b/portal-frontend/src/app/features/applications/application-details/pfrs-details/pfrs-details.component.ts
@@ -4,7 +4,7 @@ import { ApplicationDocumentDto } from '../../../../services/application-documen
 import { ApplicationDocumentService } from '../../../../services/application-document/application-document.service';
 import { ApplicationSubmissionDetailedDto } from '../../../../services/application-submission/application-submission.dto';
 import { DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-pfrs-details[applicationSubmission]',
@@ -48,10 +48,10 @@ export class PfrsDetailsComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/applications/application-details/pofo-details/pofo-details.component.html b/portal-frontend/src/app/features/applications/application-details/pofo-details/pofo-details.component.html
index e958c483d3..4218d96047 100644
--- a/portal-frontend/src/app/features/applications/application-details/pofo-details/pofo-details.component.html
+++ b/portal-frontend/src/app/features/applications/application-details/pofo-details/pofo-details.component.html
@@ -133,7 +133,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="proposalMap.length === 0"></app-no-data>
@@ -141,7 +141,7 @@
 
   <div class="subheading2 grid-1">Cross Sections</div>
   <div class="grid-double multiple-documents">
-    <a *ngFor="let file of crossSections" (click)="openFile(file.uuid)">
+    <a *ngFor="let file of crossSections" (click)="openFile(file)">
       {{ file.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="crossSections.length === 0"></app-no-data>
@@ -149,7 +149,7 @@
 
   <div class="subheading2 grid-1">Reclamation Plan</div>
   <div class="grid-double multiple-documents">
-    <a *ngFor="let file of reclamationPlans" (click)="openFile(file.uuid)">
+    <a *ngFor="let file of reclamationPlans" (click)="openFile(file)">
       {{ file.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="reclamationPlans.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/applications/application-details/pofo-details/pofo-details.component.ts b/portal-frontend/src/app/features/applications/application-details/pofo-details/pofo-details.component.ts
index 274f2ad0fe..7e6efd5432 100644
--- a/portal-frontend/src/app/features/applications/application-details/pofo-details/pofo-details.component.ts
+++ b/portal-frontend/src/app/features/applications/application-details/pofo-details/pofo-details.component.ts
@@ -4,7 +4,7 @@ import { ApplicationDocumentDto } from '../../../../services/application-documen
 import { ApplicationDocumentService } from '../../../../services/application-document/application-document.service';
 import { ApplicationSubmissionDetailedDto } from '../../../../services/application-submission/application-submission.dto';
 import { DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-pofo-details[applicationSubmission]',
@@ -46,10 +46,10 @@ export class PofoDetailsComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/applications/application-details/roso-details/roso-details.component.html b/portal-frontend/src/app/features/applications/application-details/roso-details/roso-details.component.html
index 30deb8ab54..083051454b 100644
--- a/portal-frontend/src/app/features/applications/application-details/roso-details/roso-details.component.html
+++ b/portal-frontend/src/app/features/applications/application-details/roso-details/roso-details.component.html
@@ -125,7 +125,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="proposalMap.length === 0"></app-no-data>
@@ -133,7 +133,7 @@
 
   <div class="subheading2 grid-1">Cross Sections</div>
   <div class="grid-double multiple-documents">
-    <a *ngFor="let file of crossSections" (click)="openFile(file.uuid)">
+    <a *ngFor="let file of crossSections" (click)="openFile(file)">
       {{ file.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="crossSections.length === 0"></app-no-data>
@@ -141,7 +141,7 @@
 
   <div class="subheading2 grid-1">Reclamation Plan</div>
   <div class="grid-double multiple-documents">
-    <a *ngFor="let file of reclamationPlans" (click)="openFile(file.uuid)">
+    <a *ngFor="let file of reclamationPlans" (click)="openFile(file)">
       {{ file.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="reclamationPlans.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/applications/application-details/roso-details/roso-details.component.ts b/portal-frontend/src/app/features/applications/application-details/roso-details/roso-details.component.ts
index 209bf3f994..03ca23a8db 100644
--- a/portal-frontend/src/app/features/applications/application-details/roso-details/roso-details.component.ts
+++ b/portal-frontend/src/app/features/applications/application-details/roso-details/roso-details.component.ts
@@ -4,7 +4,7 @@ import { ApplicationDocumentDto } from '../../../../services/application-documen
 import { ApplicationDocumentService } from '../../../../services/application-document/application-document.service';
 import { ApplicationSubmissionDetailedDto } from '../../../../services/application-submission/application-submission.dto';
 import { DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-roso-details[applicationSubmission]',
@@ -46,10 +46,10 @@ export class RosoDetailsComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/applications/application-details/subd-details/subd-details.component.html b/portal-frontend/src/app/features/applications/application-details/subd-details/subd-details.component.html
index 8f8daccc7f..a744cd42e1 100644
--- a/portal-frontend/src/app/features/applications/application-details/subd-details/subd-details.component.html
+++ b/portal-frontend/src/app/features/applications/application-details/subd-details/subd-details.component.html
@@ -42,7 +42,7 @@
   </div>
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="proposalMap.length === 0"></app-no-data>
@@ -61,7 +61,7 @@
     <div class="subheading2 grid-1">Proof of Homesite Severance Qualification</div>
     <div class="grid-double">
       <div *ngFor="let file of homesiteDocuments">
-        <a (click)="openFile(file.uuid)">
+        <a (click)="openFile(file)">
           {{ file.fileName }}
         </a>
       </div>
diff --git a/portal-frontend/src/app/features/applications/application-details/subd-details/subd-details.component.ts b/portal-frontend/src/app/features/applications/application-details/subd-details/subd-details.component.ts
index 9718f187ff..6ffc141e7e 100644
--- a/portal-frontend/src/app/features/applications/application-details/subd-details/subd-details.component.ts
+++ b/portal-frontend/src/app/features/applications/application-details/subd-details/subd-details.component.ts
@@ -5,7 +5,7 @@ import { ApplicationDocumentService } from '../../../../services/application-doc
 import { ApplicationParcelService } from '../../../../services/application-parcel/application-parcel.service';
 import { ApplicationSubmissionDetailedDto } from '../../../../services/application-submission/application-submission.dto';
 import { DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-subd-details[applicationSubmission]',
@@ -56,10 +56,10 @@ export class SubdDetailsComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/applications/application-details/tur-details/tur-details.component.html b/portal-frontend/src/app/features/applications/application-details/tur-details/tur-details.component.html
index 6660fa0b79..e33da56b0a 100644
--- a/portal-frontend/src/app/features/applications/application-details/tur-details/tur-details.component.html
+++ b/portal-frontend/src/app/features/applications/application-details/tur-details/tur-details.component.html
@@ -40,14 +40,14 @@
   </div>
   <div class="subheading2 grid-1">Proof of Serving Notice</div>
   <div class="grid-double">
-    <a *ngFor="let notice of servingNotice" (click)="openFile(notice.uuid)">
+    <a *ngFor="let notice of servingNotice" (click)="openFile(notice)">
       {{ notice.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="servingNotice.length === 0"></app-no-data>
   </div>
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let file of proposalMap" (click)="openFile(file.uuid)">
+    <a *ngFor="let file of proposalMap" (click)="openFile(file)">
       {{ file.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="proposalMap.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/applications/application-details/tur-details/tur-details.component.ts b/portal-frontend/src/app/features/applications/application-details/tur-details/tur-details.component.ts
index 5f96e46a8e..a9310b8837 100644
--- a/portal-frontend/src/app/features/applications/application-details/tur-details/tur-details.component.ts
+++ b/portal-frontend/src/app/features/applications/application-details/tur-details/tur-details.component.ts
@@ -4,7 +4,7 @@ import { ApplicationDocumentDto } from '../../../../services/application-documen
 import { ApplicationDocumentService } from '../../../../services/application-document/application-document.service';
 import { ApplicationSubmissionDetailedDto } from '../../../../services/application-submission/application-submission.dto';
 import { DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-tur-details[applicationSubmission]',
@@ -43,10 +43,10 @@ export class TurDetailsComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/applications/edit-submission/files-step.partial.ts b/portal-frontend/src/app/features/applications/edit-submission/files-step.partial.ts
index 6f26e899ba..a84cec216f 100644
--- a/portal-frontend/src/app/features/applications/edit-submission/files-step.partial.ts
+++ b/portal-frontend/src/app/features/applications/edit-submission/files-step.partial.ts
@@ -9,7 +9,7 @@ import { DOCUMENT_TYPE } from '../../../shared/dto/document.dto';
 import { FileHandle } from '../../../shared/file-drag-drop/drag-drop.directive';
 import { RemoveFileConfirmationDialogComponent } from '../alcs-edit-submission/remove-file-confirmation-dialog/remove-file-confirmation-dialog.component';
 import { StepComponent } from './step.partial';
-import { openFileIframe } from '../../../shared/utils/file';
+import { openFileInline } from '../../../shared/utils/file';
 
 @Component({
   selector: 'app-file-step',
@@ -83,10 +83,10 @@ export abstract class FilesStepComponent extends StepComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/applications/edit-submission/other-attachments/other-attachments.component.html b/portal-frontend/src/app/features/applications/edit-submission/other-attachments/other-attachments.component.html
index dbe84e3bf2..81c9d139d3 100644
--- a/portal-frontend/src/app/features/applications/edit-submission/other-attachments/other-attachments.component.html
+++ b/portal-frontend/src/app/features/applications/edit-submission/other-attachments/other-attachments.component.html
@@ -73,7 +73,7 @@ <h2>Optional Attachments</h2>
         <ng-container matColumnDef="fileName">
           <th mat-header-cell *matHeaderCellDef>File Name</th>
           <td mat-cell *matCellDef="let element">
-            <a (click)="openFile(element.uuid)">{{ element.fileName }}</a>
+            <a (click)="openFile(element)">{{ element.fileName }}</a>
           </td>
         </ng-container>
 
diff --git a/portal-frontend/src/app/features/applications/edit-submission/parcel-details/parcel-entry/parcel-entry.component.ts b/portal-frontend/src/app/features/applications/edit-submission/parcel-details/parcel-entry/parcel-entry.component.ts
index 0842b8d691..690c5d32e6 100644
--- a/portal-frontend/src/app/features/applications/edit-submission/parcel-details/parcel-entry/parcel-entry.component.ts
+++ b/portal-frontend/src/app/features/applications/edit-submission/parcel-details/parcel-entry/parcel-entry.component.ts
@@ -21,7 +21,7 @@ import { OwnerDialogComponent } from '../../../../../shared/owner-dialogs/owner-
 import { formatBooleanToString } from '../../../../../shared/utils/boolean-helper';
 import { RemoveFileConfirmationDialogComponent } from '../../../alcs-edit-submission/remove-file-confirmation-dialog/remove-file-confirmation-dialog.component';
 import { ParcelEntryConfirmationDialogComponent } from './parcel-entry-confirmation-dialog/parcel-entry-confirmation-dialog.component';
-import { openFileIframe } from '../../../../../shared/utils/file';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 export interface ParcelEntryFormData {
   uuid: string;
@@ -343,10 +343,10 @@ export class ParcelEntryComponent implements OnInit {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/applications/review-submission/review-attachments/review-attachments.component.ts b/portal-frontend/src/app/features/applications/review-submission/review-attachments/review-attachments.component.ts
index 9738bc07bd..f0156a2999 100644
--- a/portal-frontend/src/app/features/applications/review-submission/review-attachments/review-attachments.component.ts
+++ b/portal-frontend/src/app/features/applications/review-submission/review-attachments/review-attachments.component.ts
@@ -7,7 +7,7 @@ import { ToastService } from '../../../../services/toast/toast.service';
 import { DOCUMENT_SOURCE, DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
 import { FileHandle } from '../../../../shared/file-drag-drop/drag-drop.directive';
 import { ReviewApplicationFngSteps, ReviewApplicationSteps } from '../review-submission.component';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-review-attachments',
@@ -125,10 +125,10 @@ export class ReviewAttachmentsComponent implements OnInit, OnDestroy {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/applications/review-submission/review-submit-fng/review-submit-fng.component.html b/portal-frontend/src/app/features/applications/review-submission/review-submit-fng/review-submit-fng.component.html
index b39216223a..b363a806cf 100644
--- a/portal-frontend/src/app/features/applications/review-submission/review-submit-fng/review-submit-fng.component.html
+++ b/portal-frontend/src/app/features/applications/review-submission/review-submit-fng/review-submit-fng.component.html
@@ -46,7 +46,7 @@ <h4>1. Contact Information</h4>
         <div>
           <div class="subheading2">Phone Number</div>
           <div>
-            {{ _applicationReview.phoneNumber ?? '' | mask : '(000) 000-0000'  }}
+            {{ _applicationReview.phoneNumber ?? '' | mask : '(000) 000-0000' }}
             <app-no-data [showRequired]="showErrors" *ngIf="!_applicationReview.phoneNumber"></app-no-data>
           </div>
         </div>
@@ -85,7 +85,7 @@ <h4>3. Attachments</h4>
         <div>
           <div class="subheading2">Resolution Document</div>
           <div>
-            <a class="link" (click)="openFile(document.uuid)" *ngFor="let document of resolutionDocument">{{
+            <a class="link" (click)="openFile(document)" *ngFor="let document of resolutionDocument">{{
               document.fileName
             }}</a>
             <app-no-data [showRequired]="showErrors" *ngIf="resolutionDocument.length === 0"></app-no-data>
@@ -95,7 +95,7 @@ <h4>3. Attachments</h4>
           <div class="subheading2">Other Attachments (optional):</div>
           <div>
             <div class="document" *ngFor="let document of otherAttachments">
-              <a class="link" (click)="openFile(document.uuid)">{{ document.fileName }}</a>
+              <a class="link" (click)="openFile(document)">{{ document.fileName }}</a>
             </div>
             <app-no-data *ngIf="otherAttachments.length === 0"></app-no-data>
           </div>
@@ -153,7 +153,7 @@ <h4>1. Contact Information</h4>
         <div>
           <div class="subheading2">Phone Number</div>
           <div>
-            {{ _applicationReview.phoneNumber ?? '' | mask : '(000) 000-0000'  }}
+            {{ _applicationReview.phoneNumber ?? '' | mask : '(000) 000-0000' }}
             <app-no-data [showRequired]="showErrors" *ngIf="!_applicationReview.phoneNumber"></app-no-data>
           </div>
         </div>
@@ -196,7 +196,7 @@ <h4>3. Attachments</h4>
         <div>
           <div class="subheading2">Resolution Document</div>
           <div>
-            <a class="link" (click)="openFile(document.uuid)" *ngFor="let document of resolutionDocument">{{
+            <a class="link" (click)="openFile(document)" *ngFor="let document of resolutionDocument">{{
               document.fileName
             }}</a>
             <app-no-data [showRequired]="showErrors" *ngIf="resolutionDocument.length === 0"></app-no-data>
@@ -206,7 +206,7 @@ <h4>3. Attachments</h4>
           <div class="subheading2">Other Attachments (optional):</div>
           <div>
             <div *ngFor="let document of otherAttachments">
-              <a class="link" (click)="openFile(document.uuid)">{{ document.fileName }}</a>
+              <a class="link" (click)="openFile(document)">{{ document.fileName }}</a>
             </div>
             <app-no-data *ngIf="otherAttachments.length === 0"></app-no-data>
           </div>
diff --git a/portal-frontend/src/app/features/applications/review-submission/review-submit-fng/review-submit-fng.component.ts b/portal-frontend/src/app/features/applications/review-submission/review-submit-fng/review-submit-fng.component.ts
index d151847d50..548ea5f8eb 100644
--- a/portal-frontend/src/app/features/applications/review-submission/review-submit-fng/review-submit-fng.component.ts
+++ b/portal-frontend/src/app/features/applications/review-submission/review-submit-fng/review-submit-fng.component.ts
@@ -16,7 +16,7 @@ import { MOBILE_BREAKPOINT } from '../../../../shared/utils/breakpoints';
 import { ReviewApplicationFngSteps } from '../review-submission.component';
 import { ToastService } from '../../../../services/toast/toast.service';
 import { SubmitConfirmationDialogComponent } from '../submit-confirmation-dialog/submit-confirmation-dialog.component';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-review-submit-fng[stepper]',
@@ -121,10 +121,10 @@ export class ReviewSubmitFngComponent implements OnInit, OnDestroy {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/applications/review-submission/review-submit/review-submit.component.html b/portal-frontend/src/app/features/applications/review-submission/review-submit/review-submit.component.html
index 464bdc22db..69a0cee602 100644
--- a/portal-frontend/src/app/features/applications/review-submission/review-submit/review-submit.component.html
+++ b/portal-frontend/src/app/features/applications/review-submission/review-submit/review-submit.component.html
@@ -46,7 +46,7 @@ <h4>1. Contact Information</h4>
         <div>
           <div class="subheading2">Phone Number</div>
           <div>
-            {{ _applicationReview.phoneNumber ?? '' | mask : '(000) 000-0000'  }}
+            {{ _applicationReview.phoneNumber ?? '' | mask : '(000) 000-0000' }}
             <app-no-data [showRequired]="showErrors" *ngIf="!_applicationReview.phoneNumber"></app-no-data>
           </div>
         </div>
@@ -215,7 +215,7 @@ <h4>5. Attachments</h4>
         <div *ngIf="_applicationReview.isOCPDesignation || _applicationReview.isSubjectToZoning">
           <div class="subheading2">Resolution Document</div>
           <div>
-            <a class="link" (click)="openFile(document.uuid)" *ngFor="let document of resolutionDocument">{{
+            <a class="link" (click)="openFile(document)" *ngFor="let document of resolutionDocument">{{
               document.fileName
             }}</a>
             <app-no-data [showRequired]="showErrors" *ngIf="resolutionDocument.length === 0"></app-no-data>
@@ -226,7 +226,7 @@ <h4>5. Attachments</h4>
             Staff Report <span *ngIf="_applicationReview.isAuthorized === false">(optional)</span>
           </div>
           <div>
-            <a class="link" (click)="openFile(document.uuid)" *ngFor="let document of staffReport">{{
+            <a class="link" (click)="openFile(document)" *ngFor="let document of staffReport">{{
               document.fileName
             }}</a>
             <app-no-data
@@ -239,7 +239,7 @@ <h4>5. Attachments</h4>
           <div class="subheading2">Other Attachments (optional):</div>
           <div>
             <div class="document" *ngFor="let document of otherAttachments">
-              <a class="link" (click)="openFile(document.uuid)">{{ document.fileName }}</a>
+              <a class="link" (click)="openFile(document)">{{ document.fileName }}</a>
             </div>
             <app-no-data *ngIf="otherAttachments.length === 0"></app-no-data>
           </div>
@@ -297,7 +297,7 @@ <h4>1. Contact Information</h4>
         <div>
           <div class="subheading2">Phone Number</div>
           <div>
-            {{ _applicationReview.phoneNumber ?? '' | mask : '(000) 000-0000'  }}
+            {{ _applicationReview.phoneNumber ?? '' | mask : '(000) 000-0000' }}
             <app-no-data [showRequired]="showErrors" *ngIf="!_applicationReview.phoneNumber"></app-no-data>
           </div>
         </div>
@@ -467,7 +467,7 @@ <h4>5. Attachments</h4>
         <div *ngIf="_applicationReview.isOCPDesignation || _applicationReview.isSubjectToZoning">
           <div class="subheading2">Resolution Document</div>
           <div>
-            <a class="link" (click)="openFile(document.uuid)" *ngFor="let document of resolutionDocument">{{
+            <a class="link" (click)="openFile(document)" *ngFor="let document of resolutionDocument">{{
               document.fileName
             }}</a>
             <app-no-data [showRequired]="showErrors" *ngIf="resolutionDocument.length === 0"></app-no-data>
@@ -478,7 +478,7 @@ <h4>5. Attachments</h4>
             Staff Report <span *ngIf="_applicationReview.isAuthorized === false">(optional)</span>
           </div>
           <div>
-            <a class="link" (click)="openFile(document.uuid)" *ngFor="let document of staffReport">{{
+            <a class="link" (click)="openFile(document)" *ngFor="let document of staffReport">{{
               document.fileName
             }}</a>
             <app-no-data
@@ -491,7 +491,7 @@ <h4>5. Attachments</h4>
           <div class="subheading2">Other Attachments (optional):</div>
           <div>
             <div class="document" *ngFor="let document of otherAttachments">
-              <a class="link" (click)="openFile(document.uuid)">{{ document.fileName }}</a>
+              <a class="link" (click)="openFile(document)">{{ document.fileName }}</a>
             </div>
             <app-no-data *ngIf="otherAttachments.length === 0"></app-no-data>
           </div>
diff --git a/portal-frontend/src/app/features/applications/review-submission/review-submit/review-submit.component.ts b/portal-frontend/src/app/features/applications/review-submission/review-submit/review-submit.component.ts
index 36cb5a6718..784a058f99 100644
--- a/portal-frontend/src/app/features/applications/review-submission/review-submit/review-submit.component.ts
+++ b/portal-frontend/src/app/features/applications/review-submission/review-submit/review-submit.component.ts
@@ -15,7 +15,7 @@ import { DOCUMENT_SOURCE, DOCUMENT_TYPE } from '../../../../shared/dto/document.
 import { MOBILE_BREAKPOINT } from '../../../../shared/utils/breakpoints';
 import { ReviewApplicationSteps } from '../review-submission.component';
 import { SubmitConfirmationDialogComponent } from '../submit-confirmation-dialog/submit-confirmation-dialog.component';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-review-submit[stepper]',
@@ -129,10 +129,10 @@ export class ReviewSubmitComponent implements OnInit, OnDestroy {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/applications/view-submission/alc-review/decisions/decisions.component.html b/portal-frontend/src/app/features/applications/view-submission/alc-review/decisions/decisions.component.html
index 413266b969..2a2f6909c7 100644
--- a/portal-frontend/src/app/features/applications/view-submission/alc-review/decisions/decisions.component.html
+++ b/portal-frontend/src/app/features/applications/view-submission/alc-review/decisions/decisions.component.html
@@ -20,21 +20,21 @@ <h4>Decision #{{ decisions.length - index }}</h4>
       <div class="subheading2">Decision Document</div>
       <div class="document split" *ngFor="let document of decision.documents">
         <div>
-          <a (click)="openFile(document.uuid)">{{ document.fileName }}</a>
+          <a (click)="openFile(document)">{{ document.fileName }}</a>
           &nbsp;({{ document.fileSize | filesize }})
         </div>
-        <button class="center" mat-button (click)="openFile(document.uuid)">
+        <button class="center" mat-button (click)="openFile(document)">
           <mat-icon>file_download</mat-icon>
           Download
         </button>
       </div>
       <div class="document responsive left" *ngFor="let document of decision.documents">
         <div class="document-name">
-          <a (click)="openFile(document.uuid)">{{ document.fileName }}</a>
+          <a (click)="openFile(document)">{{ document.fileName }}</a>
         </div>
         <div class="split">
           <div>{{ document.fileSize | filesize }}</div>
-          <button class="center" mat-button (click)="openFile(document.uuid)">
+          <button class="center" mat-button (click)="openFile(document)">
             <mat-icon>file_download</mat-icon>
             Download
           </button>
diff --git a/portal-frontend/src/app/features/applications/view-submission/alc-review/decisions/decisions.component.ts b/portal-frontend/src/app/features/applications/view-submission/alc-review/decisions/decisions.component.ts
index 1280cc0118..d52199207e 100644
--- a/portal-frontend/src/app/features/applications/view-submission/alc-review/decisions/decisions.component.ts
+++ b/portal-frontend/src/app/features/applications/view-submission/alc-review/decisions/decisions.component.ts
@@ -1,6 +1,8 @@
 import { Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';
 import { ApplicationPortalDecisionDto } from '../../../../../services/application-decision/application-decision.dto';
 import { ApplicationDecisionService } from '../../../../../services/application-decision/application-decision.service';
+import { openFileInline } from '../../../../../shared/utils/file';
+import { ApplicationDocumentDto } from '../../../../../services/application-document/application-document.dto';
 
 @Component({
   selector: 'app-decisions[fileNumber]',
@@ -21,10 +23,10 @@ export class DecisionsComponent implements OnInit, OnChanges {
     this.loadDecisions();
   }
 
-  async openFile(uuid: string) {
-    const res = await this.decisionService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.decisionService.openFile(file.uuid);
     if (res) {
-      window.open(res.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/applications/view-submission/alc-review/submission-documents/submission-documents.component.html b/portal-frontend/src/app/features/applications/view-submission/alc-review/submission-documents/submission-documents.component.html
index 8dc409f48a..4b5d35bddf 100644
--- a/portal-frontend/src/app/features/applications/view-submission/alc-review/submission-documents/submission-documents.component.html
+++ b/portal-frontend/src/app/features/applications/view-submission/alc-review/submission-documents/submission-documents.component.html
@@ -1,43 +1,43 @@
 <h4>Application Documents</h4>
-<div class='table-container'>
-  <table mat-table [dataSource]='dataSource' matSort class='mat-elevation-z3 documents'>
-    <ng-container matColumnDef='type'>
-      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription='Sort by type'>Type</th>
-      <td mat-cell *matCellDef='let element'>
+<div class="table-container">
+  <table mat-table [dataSource]="dataSource" matSort class="mat-elevation-z3 documents">
+    <ng-container matColumnDef="type">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Sort by type">Type</th>
+      <td mat-cell *matCellDef="let element">
         {{ element.type?.label }}
       </td>
     </ng-container>
 
-    <ng-container matColumnDef='fileName'>
-      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription='Sort by name'>Document Name</th>
-      <td mat-cell *matCellDef='let element'>
-        <a (click)='openFile(element.uuid)'>{{ element.fileName }}</a>
+    <ng-container matColumnDef="fileName">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Sort by name">Document Name</th>
+      <td mat-cell *matCellDef="let element">
+        <a (click)="openFile(element)">{{ element.fileName }}</a>
       </td>
     </ng-container>
 
-    <ng-container matColumnDef='source'>
-      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription='Sort by source'>Source</th>
-      <td mat-cell *matCellDef='let element'>{{ element.source }}</td>
+    <ng-container matColumnDef="source">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Sort by source">Source</th>
+      <td mat-cell *matCellDef="let element">{{ element.source }}</td>
     </ng-container>
 
-    <ng-container matColumnDef='uploadedAt'>
-      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription='Sort by date'>Upload Date</th>
-      <td mat-cell *matCellDef='let element'>{{ element.uploadedAt | date }}</td>
+    <ng-container matColumnDef="uploadedAt">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Sort by date">Upload Date</th>
+      <td mat-cell *matCellDef="let element">{{ element.uploadedAt | date }}</td>
     </ng-container>
 
-    <ng-container matColumnDef='actions'>
+    <ng-container matColumnDef="actions">
       <th mat-header-cell *matHeaderCellDef>Actions</th>
-      <td mat-cell *matCellDef='let element'>
-        <button mat-icon-button (click)='downloadFile(element.uuid)'>
+      <td mat-cell *matCellDef="let element">
+        <button mat-icon-button (click)="downloadFile(element.uuid)">
           <mat-icon>file_download</mat-icon>
         </button>
       </td>
     </ng-container>
 
-    <tr mat-header-row *matHeaderRowDef='displayedColumns'></tr>
-    <tr mat-row *matRowDef='let row; columns: displayedColumns'></tr>
-    <tr class='mat-row' *matNoDataRow>
-      <td class='text-center' colspan='6'>Documents will be visible here once provided by ALC</td>
+    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+    <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
+    <tr class="mat-row" *matNoDataRow>
+      <td class="text-center" colspan="6">Documents will be visible here once provided by ALC</td>
     </tr>
   </table>
 </div>
diff --git a/portal-frontend/src/app/features/applications/view-submission/alc-review/submission-documents/submission-documents.component.ts b/portal-frontend/src/app/features/applications/view-submission/alc-review/submission-documents/submission-documents.component.ts
index 679fb8aa43..eb0d606fb9 100644
--- a/portal-frontend/src/app/features/applications/view-submission/alc-review/submission-documents/submission-documents.component.ts
+++ b/portal-frontend/src/app/features/applications/view-submission/alc-review/submission-documents/submission-documents.component.ts
@@ -4,7 +4,7 @@ import { MatTableDataSource } from '@angular/material/table';
 import { BehaviorSubject, Subject, takeUntil } from 'rxjs';
 import { ApplicationDocumentDto } from '../../../../../services/application-document/application-document.dto';
 import { ApplicationDocumentService } from '../../../../../services/application-document/application-document.service';
-import { openFileIframe } from '../../../../../shared/utils/file';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-submission-documents',
@@ -30,10 +30,10 @@ export class SubmissionDocumentsComponent implements OnInit, OnDestroy {
     });
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/applications/view-submission/lfng-review/lfng-review.component.html b/portal-frontend/src/app/features/applications/view-submission/lfng-review/lfng-review.component.html
index 4b275a4502..6534dad454 100644
--- a/portal-frontend/src/app/features/applications/view-submission/lfng-review/lfng-review.component.html
+++ b/portal-frontend/src/app/features/applications/view-submission/lfng-review/lfng-review.component.html
@@ -13,20 +13,29 @@ <h2>Local/First Nation Gov Review</h2>
       >
         Download PDF
       </button>
-      <button mat-flat-button color="primary" *ngIf="application && application.canEdit"
-        [routerLink]="'/application/' + application.fileNumber + '/edit'">
+      <button
+        mat-flat-button
+        color="primary"
+        *ngIf="application && application.canEdit"
+        [routerLink]="'/application/' + application.fileNumber + '/edit'"
+      >
         <div class="continue-button-content">
           <span>Continue Application</span>
           <mat-icon>keyboard_double_arrow_right</mat-icon>
         </div>
       </button>
-      <button (click)="onReview(application.fileNumber)"  mat-flat-button color="primary"
+      <button
+        (click)="onReview(application.fileNumber)"
+        mat-flat-button
+        color="primary"
         *ngIf="
-          application && application.canReview && (
-          application.status.code === SUBMISSION_STATUS.IN_REVIEW_BY_LG ||
-          application.status.code === SUBMISSION_STATUS.RETURNED_TO_LG ||
-          application.status.code === SUBMISSION_STATUS.SUBMITTED_TO_LG)
-        ">
+          application &&
+          application.canReview &&
+          (application.status.code === SUBMISSION_STATUS.IN_REVIEW_BY_LG ||
+            application.status.code === SUBMISSION_STATUS.RETURNED_TO_LG ||
+            application.status.code === SUBMISSION_STATUS.SUBMITTED_TO_LG)
+        "
+      >
         <div class="continue-button-content">
           <span
             *ngIf="
@@ -51,8 +60,8 @@ <h2>Local/First Nation Gov Review</h2>
   <div
     *ngIf="
       (application.status.code === SUBMISSION_STATUS.IN_PROGRESS ||
-      application.status.code === SUBMISSION_STATUS.WRONG_GOV ||
-      application.status.code === SUBMISSION_STATUS.INCOMPLETE) &&
+        application.status.code === SUBMISSION_STATUS.WRONG_GOV ||
+        application.status.code === SUBMISSION_STATUS.INCOMPLETE) &&
       !isTurOrCov
     "
     class="warning"
@@ -62,8 +71,8 @@ <h2>Local/First Nation Gov Review</h2>
   <div
     *ngIf="
       (application.status.code === SUBMISSION_STATUS.IN_PROGRESS ||
-      application.status.code === SUBMISSION_STATUS.WRONG_GOV ||
-      application.status.code === SUBMISSION_STATUS.INCOMPLETE ) &&
+        application.status.code === SUBMISSION_STATUS.WRONG_GOV ||
+        application.status.code === SUBMISSION_STATUS.INCOMPLETE) &&
       isTurOrCov
     "
     class="warning"
@@ -128,7 +137,7 @@ <h4>Contact Information</h4>
         <div>
           <div class="subheading2">Phone Number</div>
           <div>
-            {{ applicationReview.phoneNumber ?? '' | mask : '(000) 000-0000'  }}
+            {{ applicationReview.phoneNumber ?? '' | mask : '(000) 000-0000' }}
             <app-no-data *ngIf="!applicationReview.phoneNumber"></app-no-data>
           </div>
         </div>
@@ -275,7 +284,7 @@ <h4>Attachments</h4>
         >
           <div class="subheading2">Resolution Document</div>
           <div>
-            <a class="link" (click)="openFile(document.uuid)" *ngFor="let document of resolutionDocument">{{
+            <a class="link" (click)="openFile(document)" *ngFor="let document of resolutionDocument">{{
               document.fileName
             }}</a>
           </div>
@@ -286,7 +295,7 @@ <h4>Attachments</h4>
             Staff Report <span *ngIf="applicationReview.isAuthorized === false">(optional)</span>
           </div>
           <div>
-            <a class="link" (click)="openFile(document.uuid)" *ngFor="let document of staffReport">{{
+            <a class="link" (click)="openFile(document)" *ngFor="let document of staffReport">{{
               document.fileName
             }}</a>
           </div>
@@ -296,7 +305,7 @@ <h4>Attachments</h4>
           <div class="subheading2">Other Attachments (optional):</div>
           <div>
             <div class="document" *ngFor="let document of governmentOtherAttachments">
-              <a class="link" (click)="openFile(document.uuid)">{{ document.fileName }}</a>
+              <a class="link" (click)="openFile(document)">{{ document.fileName }}</a>
             </div>
             <app-no-data *ngIf="governmentOtherAttachments.length === 0"></app-no-data>
           </div>
diff --git a/portal-frontend/src/app/features/applications/view-submission/lfng-review/lfng-review.component.ts b/portal-frontend/src/app/features/applications/view-submission/lfng-review/lfng-review.component.ts
index ac6a36d33f..8df9eaf1a5 100644
--- a/portal-frontend/src/app/features/applications/view-submission/lfng-review/lfng-review.component.ts
+++ b/portal-frontend/src/app/features/applications/view-submission/lfng-review/lfng-review.component.ts
@@ -11,7 +11,7 @@ import {
 } from '../../../../services/application-submission/application-submission.dto';
 import { PdfGenerationService } from '../../../../services/pdf-generation/pdf-generation.service';
 import { DOCUMENT_SOURCE, DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-lfng-review',
@@ -107,10 +107,10 @@ export class LfngReviewComponent implements OnInit, OnDestroy {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/applications/view-submission/view-application-submission.component.ts b/portal-frontend/src/app/features/applications/view-submission/view-application-submission.component.ts
index a08e1fcaf1..a32b500a83 100644
--- a/portal-frontend/src/app/features/applications/view-submission/view-application-submission.component.ts
+++ b/portal-frontend/src/app/features/applications/view-submission/view-application-submission.component.ts
@@ -12,7 +12,7 @@ import {
 import { ApplicationSubmissionService } from '../../../services/application-submission/application-submission.service';
 import { PdfGenerationService } from '../../../services/pdf-generation/pdf-generation.service';
 import { ConfirmationDialogService } from '../../../shared/confirmation-dialog/confirmation-dialog.service';
-import { openFileIframe } from '../../../shared/utils/file';
+import { openFileInline } from '../../../shared/utils/file';
 
 @Component({
   selector: 'app-view-application-submission',
@@ -94,10 +94,10 @@ export class ViewApplicationSubmissionComponent implements OnInit, OnDestroy {
     this.isLoading = false;
   }
 
-  async openFile(uuid: string) {
-    const res = await this.applicationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.applicationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/notice-of-intents/edit-submission/files-step.partial.ts b/portal-frontend/src/app/features/notice-of-intents/edit-submission/files-step.partial.ts
index a407e19b5a..a63aa6399f 100644
--- a/portal-frontend/src/app/features/notice-of-intents/edit-submission/files-step.partial.ts
+++ b/portal-frontend/src/app/features/notice-of-intents/edit-submission/files-step.partial.ts
@@ -9,7 +9,7 @@ import { DOCUMENT_TYPE } from '../../../shared/dto/document.dto';
 import { FileHandle } from '../../../shared/file-drag-drop/drag-drop.directive';
 import { RemoveFileConfirmationDialogComponent } from '../../applications/alcs-edit-submission/remove-file-confirmation-dialog/remove-file-confirmation-dialog.component';
 import { StepComponent } from './step.partial';
-import { openFileIframe } from '../../../shared/utils/file';
+import { openFileInline } from '../../../shared/utils/file';
 
 @Component({
   selector: 'app-file-step',
@@ -83,10 +83,10 @@ export abstract class FilesStepComponent extends StepComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.noticeOfIntentDocumentService.openFile(uuid);
+  async openFile(file: NoticeOfIntentDocumentDto) {
+    const res = await this.noticeOfIntentDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/notice-of-intents/edit-submission/other-attachments/other-attachments.component.html b/portal-frontend/src/app/features/notice-of-intents/edit-submission/other-attachments/other-attachments.component.html
index 193d74cd18..d758146d48 100644
--- a/portal-frontend/src/app/features/notice-of-intents/edit-submission/other-attachments/other-attachments.component.html
+++ b/portal-frontend/src/app/features/notice-of-intents/edit-submission/other-attachments/other-attachments.component.html
@@ -73,7 +73,7 @@ <h2>Optional Attachments</h2>
         <ng-container matColumnDef="fileName">
           <th mat-header-cell *matHeaderCellDef>File Name</th>
           <td mat-cell *matCellDef="let element">
-            <a (click)="openFile(element.uuid)">{{ element.fileName }}</a>
+            <a (click)="openFile(element)">{{ element.fileName }}</a>
           </td>
         </ng-container>
 
diff --git a/portal-frontend/src/app/features/notice-of-intents/edit-submission/other-attachments/other-attachments.component.ts b/portal-frontend/src/app/features/notice-of-intents/edit-submission/other-attachments/other-attachments.component.ts
index 6b5c1f18eb..5af2946180 100644
--- a/portal-frontend/src/app/features/notice-of-intents/edit-submission/other-attachments/other-attachments.component.ts
+++ b/portal-frontend/src/app/features/notice-of-intents/edit-submission/other-attachments/other-attachments.component.ts
@@ -1,7 +1,6 @@
 import { Component, OnDestroy, OnInit } from '@angular/core';
 import { FormControl, FormGroup, Validators } from '@angular/forms';
 import { MatDialog } from '@angular/material/dialog';
-import { Router } from '@angular/router';
 import { takeUntil } from 'rxjs';
 import { CodeService } from '../../../../services/code/code.service';
 import {
@@ -9,7 +8,6 @@ import {
   NoticeOfIntentDocumentUpdateDto,
 } from '../../../../services/notice-of-intent-document/notice-of-intent-document.dto';
 import { NoticeOfIntentDocumentService } from '../../../../services/notice-of-intent-document/notice-of-intent-document.service';
-import { NoticeOfIntentSubmissionService } from '../../../../services/notice-of-intent-submission/notice-of-intent-submission.service';
 import { ToastService } from '../../../../services/toast/toast.service';
 import { DOCUMENT_SOURCE, DOCUMENT_TYPE, DocumentTypeDto } from '../../../../shared/dto/document.dto';
 import { FileHandle } from '../../../../shared/file-drag-drop/drag-drop.directive';
@@ -37,8 +35,6 @@ export class OtherAttachmentsComponent extends FilesStepComponent implements OnI
   showVirusError = false;
 
   constructor(
-    private router: Router,
-    private noticeOfIntentSubmissionService: NoticeOfIntentSubmissionService,
     private codeService: CodeService,
     noticeOfIntentDocumentService: NoticeOfIntentDocumentService,
     dialog: MatDialog,
diff --git a/portal-frontend/src/app/features/notice-of-intents/edit-submission/parcels/parcel-entry/parcel-entry.component.ts b/portal-frontend/src/app/features/notice-of-intents/edit-submission/parcels/parcel-entry/parcel-entry.component.ts
index bcbbe6636d..406b05d064 100644
--- a/portal-frontend/src/app/features/notice-of-intents/edit-submission/parcels/parcel-entry/parcel-entry.component.ts
+++ b/portal-frontend/src/app/features/notice-of-intents/edit-submission/parcels/parcel-entry/parcel-entry.component.ts
@@ -20,7 +20,7 @@ import { formatBooleanToString } from '../../../../../shared/utils/boolean-helpe
 import { RemoveFileConfirmationDialogComponent } from '../../../../applications/alcs-edit-submission/remove-file-confirmation-dialog/remove-file-confirmation-dialog.component';
 import { ParcelEntryConfirmationDialogComponent } from './parcel-entry-confirmation-dialog/parcel-entry-confirmation-dialog.component';
 import { scrollToElement } from '../../../../../shared/utils/scroll-helper';
-import { openFileIframe } from '../../../../../shared/utils/file';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 export interface ParcelEntryFormData {
   uuid: string;
@@ -341,10 +341,10 @@ export class ParcelEntryComponent implements OnInit {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.noticeOfIntentDocumentService.openFile(uuid);
+  async openFile(file: NoticeOfIntentDocumentDto) {
+    const res = await this.noticeOfIntentDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/additional-information/additional-information.component.html b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/additional-information/additional-information.component.html
index ef34c2f133..0e3275da11 100644
--- a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/additional-information/additional-information.component.html
+++ b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/additional-information/additional-information.component.html
@@ -84,7 +84,7 @@
 
     <div class="subheading2 grid-1">Detailed Building Plan(s)</div>
     <div class="grid-double multiple-documents">
-      <a *ngFor="let file of buildingPlans" (click)="openFile(file.uuid)">
+      <a *ngFor="let file of buildingPlans" (click)="openFile(file)">
         {{ file.fileName }}
       </a>
       <app-no-data [showRequired]="showErrors" *ngIf="buildingPlans.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/additional-information/additional-information.component.ts b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/additional-information/additional-information.component.ts
index f0f313b4b6..2febb3e18a 100644
--- a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/additional-information/additional-information.component.ts
+++ b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/additional-information/additional-information.component.ts
@@ -8,7 +8,7 @@ import {
   RESIDENTIAL_STRUCTURE_TYPES,
   STRUCTURE_TYPES,
 } from '../../edit-submission/additional-information/additional-information.component';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-additional-information',
@@ -100,10 +100,10 @@ export class AdditionalInformationComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.noticeOfIntentDocumentService.openFile(uuid);
+  async openFile(file: NoticeOfIntentDocumentDto) {
+    const res = await this.noticeOfIntentDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/notice-of-intent-details.component.html b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/notice-of-intent-details.component.html
index d56d81a163..5fefa1418d 100644
--- a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/notice-of-intent-details.component.html
+++ b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/notice-of-intent-details.component.html
@@ -42,7 +42,7 @@ <h3>2. Primary Contact</h3>
     </div>
     <div class="subheading2 grid-1">Phone</div>
     <div class="grid-double">
-      {{ primaryContact?.phoneNumber ?? '' | mask : '(000) 000-0000'  }}
+      {{ primaryContact?.phoneNumber ?? '' | mask : '(000) 000-0000' }}
       <app-no-data [showRequired]="showErrors" *ngIf="!primaryContact?.phoneNumber"></app-no-data>
       <app-validation-error *ngIf="!(primaryContact?.phoneNumber || '' | phoneValid)"
         >Invalid Format</app-validation-error
@@ -62,7 +62,7 @@ <h3>2. Primary Contact</h3>
           *ngIf="authorizationLetters.length === 0"
         ></app-no-data>
         <div *ngFor="let file of authorizationLetters">
-          <a (click)="openFile(file.uuid)">{{ file.fileName }}</a>
+          <a (click)="openFile(file)">{{ file.fileName }}</a>
         </div>
         <app-validation-error *ngIf="!needsAuthorizationLetter && authorizationLetters.length > 0">
           Authorization letters are not required, please remove them
@@ -215,7 +215,7 @@ <h3>7. Optional Documents</h3>
 
       <ng-container *ngFor="let file of otherFiles">
         <div class="grid-1">
-          <a (click)="openFile(file.uuid)">{{ file.fileName }}</a>
+          <a (click)="openFile(file)">{{ file.fileName }}</a>
         </div>
         <div class="grid-2">
           {{ file.type?.label }}
diff --git a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/notice-of-intent-details.component.ts b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/notice-of-intent-details.component.ts
index ccf3768864..47de5e77be 100644
--- a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/notice-of-intent-details.component.ts
+++ b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/notice-of-intent-details.component.ts
@@ -10,7 +10,7 @@ import { NoticeOfIntentParcelService } from '../../../services/notice-of-intent-
 import { NoticeOfIntentSubmissionDetailedDto } from '../../../services/notice-of-intent-submission/notice-of-intent-submission.dto';
 import { DOCUMENT_SOURCE, DOCUMENT_TYPE } from '../../../shared/dto/document.dto';
 import { OWNER_TYPE } from '../../../shared/dto/owner.dto';
-import { openFileIframe } from '../../../shared/utils/file';
+import { openFileInline } from '../../../shared/utils/file';
 
 @Component({
   selector: 'app-noi-details',
@@ -82,10 +82,10 @@ export class NoticeOfIntentDetailsComponent implements OnInit, OnDestroy {
     this.$destroy.complete();
   }
 
-  async openFile(uuid: string) {
-    const res = await this.noticeOfIntentDocumentService.openFile(uuid);
+  async openFile(file: NoticeOfIntentDocumentDto) {
+    const res = await this.noticeOfIntentDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/parcel/parcel.component.html b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/parcel/parcel.component.html
index 32bcc16494..85c2f464a3 100644
--- a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/parcel/parcel.component.html
+++ b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/parcel/parcel.component.html
@@ -94,7 +94,7 @@ <h4>Parcel #{{ parcelInd + 1 }}</h4>
       <div class="subheading2 grid-1">Certificate Of Title</div>
       <div class="grid-double">
         <div *ngIf="parcel.certificateOfTitle">
-          <a (click)="onOpenFile(parcel.certificateOfTitle.uuid)">{{ parcel.certificateOfTitle.fileName }}</a>
+          <a (click)="onOpenFile(parcel.certificateOfTitle)">{{ parcel.certificateOfTitle.fileName }}</a>
         </div>
         <app-no-data
           [showRequired]="showErrors && !!parcel.validation?.isCertificateRequired"
@@ -110,16 +110,12 @@ <h5>Government Parcel Contact</h5>
             {{ parcel.owners[0].firstName }}
             <app-no-data [showRequired]="showErrors" *ngIf="!parcel.owners[0].firstName"></app-no-data>
           </div>
-          <div class="subheading2 grid-1">
-            Last Name
-          </div>
+          <div class="subheading2 grid-1">Last Name</div>
           <div class="grid-double">
             {{ parcel.owners[0].lastName }}
             <app-no-data [showRequired]="showErrors" *ngIf="!parcel.owners[0].lastName"></app-no-data>
           </div>
-          <div class="subheading2 grid-1">
-            Ministry or Department
-          </div>
+          <div class="subheading2 grid-1">Ministry or Department</div>
           <div class="grid-double">
             {{ parcel.owners[0].organizationName }}
             <app-no-data [showRequired]="showErrors" *ngIf="!parcel.owners[0].organizationName"></app-no-data>
@@ -134,9 +130,7 @@ <h5>Government Parcel Contact</h5>
             {{ parcel.owners[0].email }}
             <app-no-data [showRequired]="showErrors" *ngIf="!parcel.owners[0].email"></app-no-data>
           </div>
-          <div class="subheading2 grid-1">
-            Crown Type
-          </div>
+          <div class="subheading2 grid-1">Crown Type</div>
           <div class="grid-double">
             {{ parcel.owners[0].crownLandOwnerType === 'provincial' ? 'Provincial Crown' : '' }}
             {{ parcel.owners[0].crownLandOwnerType === 'federal' ? 'Federal Crown' : '' }}
@@ -146,17 +140,12 @@ <h5>Government Parcel Contact</h5>
         <app-no-data [showRequired]="showErrors" *ngIf="!parcel.owners[0]"></app-no-data>
       </ng-container>
 
-      <div
-        class="full-width owner-information"
-        *ngIf="parcel.ownershipTypeCode !== PARCEL_OWNERSHIP_TYPES.CROWN"
-      >
+      <div class="full-width owner-information" *ngIf="parcel.ownershipTypeCode !== PARCEL_OWNERSHIP_TYPES.CROWN">
         <div class="subheading2">Land Owner(s)</div>
         <div class="subheading2">Organization</div>
         <div class="subheading2">Phone</div>
         <div class="subheading2">Email</div>
-        <div class="subheading2">
-          Corporate Summary
-        </div>
+        <div class="subheading2">Corporate Summary</div>
         <ng-container *ngFor="let owner of parcel.owners">
           <div>{{ owner.displayName }}</div>
           <div>
@@ -166,7 +155,7 @@ <h5>Government Parcel Contact</h5>
           <div>{{ owner.phoneNumber ?? '' | mask : '(000) 000-0000' }}</div>
           <div>{{ owner.email }}</div>
           <div>
-            <a *ngIf="owner.corporateSummary" (click)="onOpenFile(owner.corporateSummary.uuid)">{{
+            <a *ngIf="owner.corporateSummary" (click)="onOpenFile(owner.corporateSummary)">{{
               owner.corporateSummary.fileName
             }}</a>
             <app-no-data [showRequired]="false" *ngIf="!owner.corporateSummary"></app-no-data>
diff --git a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/parcel/parcel.component.ts b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/parcel/parcel.component.ts
index aa4fa84fd4..ece75c7afb 100644
--- a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/parcel/parcel.component.ts
+++ b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/parcel/parcel.component.ts
@@ -14,7 +14,7 @@ import { NoticeOfIntentParcelService } from '../../../../services/notice-of-inte
 import { NoticeOfIntentSubmissionDetailedDto } from '../../../../services/notice-of-intent-submission/notice-of-intent-submission.dto';
 import { BaseCodeDto } from '../../../../shared/dto/base.dto';
 import { formatBooleanToYesNoString } from '../../../../shared/utils/boolean-helper';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 export class NoticeOfIntentParcelBasicValidation {
   // indicates general validity check state, including owner related information
@@ -97,10 +97,10 @@ export class ParcelComponent {
     }
   }
 
-  async onOpenFile(uuid: string) {
-    const res = await this.noticeOfIntentDocumentService.openFile(uuid);
+  async onOpenFile(file: NoticeOfIntentDocumentDto) {
+    const res = await this.noticeOfIntentDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pfrs-details/pfrs-details.component.html b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pfrs-details/pfrs-details.component.html
index d731bf3f59..fdffe108d2 100644
--- a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pfrs-details/pfrs-details.component.html
+++ b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pfrs-details/pfrs-details.component.html
@@ -171,7 +171,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="proposalMap.length === 0"></app-no-data>
@@ -197,7 +197,7 @@
     <div class="subheading2 grid-1">Cross Sections</div>
     <div class="grid-double">
       <div *ngFor="let file of crossSections">
-        <a (click)="openFile(file.uuid)">
+        <a (click)="openFile(file)">
           {{ file.fileName }}
         </a>
       </div>
@@ -207,7 +207,7 @@
     <div class="subheading2 grid-1">Reclamation Plan</div>
     <div class="grid-double">
       <div *ngFor="let file of reclamationPlans">
-        <a (click)="openFile(file.uuid)">
+        <a (click)="openFile(file)">
           {{ file.fileName }}
         </a>
       </div>
@@ -230,7 +230,7 @@
       <div class="subheading2 grid-1">Notice of Work</div>
       <div class="grid-double">
         <div *ngFor="let file of noticeOfWorks">
-          <a (click)="openFile(file.uuid)">{{ file.fileName }}</a>
+          <a (click)="openFile(file)">{{ file.fileName }}</a>
         </div>
         <app-no-data [showRequired]="showErrors" *ngIf="noticeOfWorks.length === 0"></app-no-data>
       </div>
diff --git a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pfrs-details/pfrs-details.component.ts b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pfrs-details/pfrs-details.component.ts
index 1729791499..4d2c713dcf 100644
--- a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pfrs-details/pfrs-details.component.ts
+++ b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pfrs-details/pfrs-details.component.ts
@@ -4,7 +4,7 @@ import { NoticeOfIntentDocumentDto } from '../../../../services/notice-of-intent
 import { NoticeOfIntentDocumentService } from '../../../../services/notice-of-intent-document/notice-of-intent-document.service';
 import { NoticeOfIntentSubmissionDetailedDto } from '../../../../services/notice-of-intent-submission/notice-of-intent-submission.dto';
 import { DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-pfrs-details[noiSubmission]',
@@ -48,10 +48,10 @@ export class PfrsDetailsComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.noticeOfIntentDocumentService.openFile(uuid);
+  async openFile(file: NoticeOfIntentDocumentDto) {
+    const res = await this.noticeOfIntentDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pofo-details/pofo-details.component.html b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pofo-details/pofo-details.component.html
index 3bfb5e98b7..30236d2c68 100644
--- a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pofo-details/pofo-details.component.html
+++ b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pofo-details/pofo-details.component.html
@@ -107,7 +107,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="proposalMap.length === 0"></app-no-data>
@@ -125,7 +125,7 @@
     <div class="subheading2 grid-1">Cross Sections</div>
     <div class="grid-double">
       <div *ngFor="let file of crossSections">
-        <a (click)="openFile(file.uuid)">
+        <a (click)="openFile(file)">
           {{ file.fileName }}
         </a>
       </div>
@@ -135,7 +135,7 @@
     <div class="subheading2 grid-1">Reclamation Plan</div>
     <div class="grid-double">
       <div *ngFor="let file of reclamationPlans">
-        <a (click)="openFile(file.uuid)">
+        <a (click)="openFile(file)">
           {{ file.fileName }}
         </a>
       </div>
diff --git a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pofo-details/pofo-details.component.ts b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pofo-details/pofo-details.component.ts
index bda8999026..326cc78422 100644
--- a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pofo-details/pofo-details.component.ts
+++ b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/pofo-details/pofo-details.component.ts
@@ -4,7 +4,7 @@ import { NoticeOfIntentDocumentDto } from '../../../../services/notice-of-intent
 import { NoticeOfIntentDocumentService } from '../../../../services/notice-of-intent-document/notice-of-intent-document.service';
 import { NoticeOfIntentSubmissionDetailedDto } from '../../../../services/notice-of-intent-submission/notice-of-intent-submission.dto';
 import { DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-pofo-details[noiSubmission]',
@@ -48,10 +48,10 @@ export class PofoDetailsComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.noticeOfIntentDocumentService.openFile(uuid);
+  async openFile(file: NoticeOfIntentDocumentDto) {
+    const res = await this.noticeOfIntentDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/roso-details/roso-details.component.html b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/roso-details/roso-details.component.html
index da49f8bb95..ae08104f3f 100644
--- a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/roso-details/roso-details.component.html
+++ b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/roso-details/roso-details.component.html
@@ -106,7 +106,7 @@
   </div>
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="proposalMap.length === 0"></app-no-data>
@@ -123,7 +123,7 @@
   <ng-container *ngIf="_noiSubmission?.soilIsExtractionOrMining">
     <div class="subheading2 grid-1">Cross Sections</div>
     <div class="grid-double multiple-documents">
-      <a *ngFor="let file of crossSections" (click)="openFile(file.uuid)">
+      <a *ngFor="let file of crossSections" (click)="openFile(file)">
         {{ file.fileName }}
       </a>
       <app-no-data [showRequired]="showErrors" *ngIf="crossSections.length === 0"></app-no-data>
@@ -131,7 +131,7 @@
 
     <div class="subheading2 grid-1">Reclamation Plan</div>
     <div class="grid-double multiple-documents">
-      <a *ngFor="let file of reclamationPlans" (click)="openFile(file.uuid)">
+      <a *ngFor="let file of reclamationPlans" (click)="openFile(file)">
         {{ file.fileName }}
       </a>
       <app-no-data [showRequired]="showErrors" *ngIf="reclamationPlans.length === 0"></app-no-data>
@@ -150,7 +150,7 @@
     <ng-container *ngIf="_noiSubmission.soilHasSubmittedNotice">
       <div class="subheading2 grid-1">Notice of Work</div>
       <div class="grid-double multiple-documents">
-        <a *ngFor="let file of noticeOfWorks" (click)="openFile(file.uuid)">
+        <a *ngFor="let file of noticeOfWorks" (click)="openFile(file)">
           {{ file.fileName }}
         </a>
         <app-no-data [showRequired]="showErrors" *ngIf="noticeOfWorks.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/roso-details/roso-details.component.ts b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/roso-details/roso-details.component.ts
index 4edd97841c..880e3fda57 100644
--- a/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/roso-details/roso-details.component.ts
+++ b/portal-frontend/src/app/features/notice-of-intents/notice-of-intent-details/roso-details/roso-details.component.ts
@@ -4,7 +4,7 @@ import { NoticeOfIntentDocumentDto } from '../../../../services/notice-of-intent
 import { NoticeOfIntentDocumentService } from '../../../../services/notice-of-intent-document/notice-of-intent-document.service';
 import { NoticeOfIntentSubmissionDetailedDto } from '../../../../services/notice-of-intent-submission/notice-of-intent-submission.dto';
 import { DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-roso-details[noiSubmission]',
@@ -48,10 +48,10 @@ export class RosoDetailsComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.noticeOfIntentDocumentService.openFile(uuid);
+  async openFile(file: NoticeOfIntentDocumentDto) {
+    const res = await this.noticeOfIntentDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/decisions/decisions.component.html b/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/decisions/decisions.component.html
index 413266b969..2a2f6909c7 100644
--- a/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/decisions/decisions.component.html
+++ b/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/decisions/decisions.component.html
@@ -20,21 +20,21 @@ <h4>Decision #{{ decisions.length - index }}</h4>
       <div class="subheading2">Decision Document</div>
       <div class="document split" *ngFor="let document of decision.documents">
         <div>
-          <a (click)="openFile(document.uuid)">{{ document.fileName }}</a>
+          <a (click)="openFile(document)">{{ document.fileName }}</a>
           &nbsp;({{ document.fileSize | filesize }})
         </div>
-        <button class="center" mat-button (click)="openFile(document.uuid)">
+        <button class="center" mat-button (click)="openFile(document)">
           <mat-icon>file_download</mat-icon>
           Download
         </button>
       </div>
       <div class="document responsive left" *ngFor="let document of decision.documents">
         <div class="document-name">
-          <a (click)="openFile(document.uuid)">{{ document.fileName }}</a>
+          <a (click)="openFile(document)">{{ document.fileName }}</a>
         </div>
         <div class="split">
           <div>{{ document.fileSize | filesize }}</div>
-          <button class="center" mat-button (click)="openFile(document.uuid)">
+          <button class="center" mat-button (click)="openFile(document)">
             <mat-icon>file_download</mat-icon>
             Download
           </button>
diff --git a/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/decisions/decisions.component.ts b/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/decisions/decisions.component.ts
index 02d647de95..b533e1fdb4 100644
--- a/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/decisions/decisions.component.ts
+++ b/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/decisions/decisions.component.ts
@@ -1,6 +1,8 @@
 import { Component, Input, OnChanges, OnInit, SimpleChanges } from '@angular/core';
 import { NoticeOfIntentPortalDecisionDto } from '../../../../../services/notice-of-intent-decision/notice-of-intent-decision.dto';
 import { NoticeOfIntentDecisionService } from '../../../../../services/notice-of-intent-decision/notice-of-intent-decision.service';
+import { openFileInline } from '../../../../../shared/utils/file';
+import { ApplicationDocumentDto } from '../../../../../services/application-document/application-document.dto';
 
 @Component({
   selector: 'app-decisions[fileNumber]',
@@ -21,10 +23,10 @@ export class DecisionsComponent implements OnInit, OnChanges {
     this.loadDecisions();
   }
 
-  async openFile(uuid: string) {
-    const res = await this.decisionService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.decisionService.openFile(file.uuid);
     if (res) {
-      window.open(res.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/submission-documents/submission-documents.component.html b/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/submission-documents/submission-documents.component.html
index 4be196b160..31621a20d2 100644
--- a/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/submission-documents/submission-documents.component.html
+++ b/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/submission-documents/submission-documents.component.html
@@ -11,7 +11,7 @@ <h4>Notice of Intent Documents</h4>
     <ng-container matColumnDef="fileName">
       <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Sort by name">Document Name</th>
       <td mat-cell *matCellDef="let element">
-        <a (click)="openFile(element.uuid)">{{ element.fileName }}</a>
+        <a (click)="openFile(element)">{{ element.fileName }}</a>
       </td>
     </ng-container>
 
diff --git a/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/submission-documents/submission-documents.component.ts b/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/submission-documents/submission-documents.component.ts
index 0fb70ef5e1..d4db07b419 100644
--- a/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/submission-documents/submission-documents.component.ts
+++ b/portal-frontend/src/app/features/notice-of-intents/view-submission/alc-review/submission-documents/submission-documents.component.ts
@@ -4,7 +4,7 @@ import { MatTableDataSource } from '@angular/material/table';
 import { BehaviorSubject, Subject, takeUntil } from 'rxjs';
 import { NoticeOfIntentDocumentDto } from '../../../../../services/notice-of-intent-document/notice-of-intent-document.dto';
 import { NoticeOfIntentDocumentService } from '../../../../../services/notice-of-intent-document/notice-of-intent-document.service';
-import { openFileIframe } from '../../../../../shared/utils/file';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-submission-documents',
@@ -30,10 +30,10 @@ export class SubmissionDocumentsComponent implements OnInit, OnDestroy {
     });
   }
 
-  async openFile(uuid: string) {
-    const res = await this.noticeOfIntentDocumentService.openFile(uuid);
+  async openFile(file: NoticeOfIntentDocumentDto) {
+    const res = await this.noticeOfIntentDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/notifications/edit-submission/files-step.partial.ts b/portal-frontend/src/app/features/notifications/edit-submission/files-step.partial.ts
index 817b3a513f..d5df41de63 100644
--- a/portal-frontend/src/app/features/notifications/edit-submission/files-step.partial.ts
+++ b/portal-frontend/src/app/features/notifications/edit-submission/files-step.partial.ts
@@ -9,7 +9,7 @@ import { ToastService } from '../../../services/toast/toast.service';
 import { DOCUMENT_TYPE } from '../../../shared/dto/document.dto';
 import { FileHandle } from '../../../shared/file-drag-drop/drag-drop.directive';
 import { StepComponent } from './step.partial';
-import { openFileIframe } from '../../../shared/utils/file';
+import { openFileInline } from '../../../shared/utils/file';
 
 @Component({
   selector: 'app-file-step',
@@ -69,10 +69,10 @@ export abstract class FilesStepComponent extends StepComponent {
     }
   }
 
-  async openFile(uuid: string) {
-    const res = await this.notificationDocumentService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.notificationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/notifications/edit-submission/other-attachments/other-attachments.component.html b/portal-frontend/src/app/features/notifications/edit-submission/other-attachments/other-attachments.component.html
index 0d30b120a3..7b827e2b48 100644
--- a/portal-frontend/src/app/features/notifications/edit-submission/other-attachments/other-attachments.component.html
+++ b/portal-frontend/src/app/features/notifications/edit-submission/other-attachments/other-attachments.component.html
@@ -16,7 +16,7 @@ <h2>Optional Attachments</h2>
         <ng-container matColumnDef="fileName">
           <th mat-header-cell *matHeaderCellDef>File Name</th>
           <td mat-cell *matCellDef="let element">
-            <a (click)="openFile(element.uuid)">{{ element.fileName }}</a>
+            <a (click)="openFile(element)">{{ element.fileName }}</a>
           </td>
         </ng-container>
 
diff --git a/portal-frontend/src/app/features/notifications/edit-submission/proposal/proposal.component.html b/portal-frontend/src/app/features/notifications/edit-submission/proposal/proposal.component.html
index bda82ea373..3f8d717121 100644
--- a/portal-frontend/src/app/features/notifications/edit-submission/proposal/proposal.component.html
+++ b/portal-frontend/src/app/features/notifications/edit-submission/proposal/proposal.component.html
@@ -133,7 +133,7 @@ <h2>Purpose of SRW</h2>
       <ng-container matColumnDef="fileName">
         <th mat-header-cell *matHeaderCellDef>File Name</th>
         <td mat-cell *matCellDef="let element">
-          <a (click)="openFile(element.uuid)">{{ element.fileName }}</a>
+          <a (click)="openFile(element)">{{ element.fileName }}</a>
         </td>
       </ng-container>
 
diff --git a/portal-frontend/src/app/features/notifications/notification-details/notification-details.component.html b/portal-frontend/src/app/features/notifications/notification-details/notification-details.component.html
index cbe773ddd1..85bcff7e34 100644
--- a/portal-frontend/src/app/features/notifications/notification-details/notification-details.component.html
+++ b/portal-frontend/src/app/features/notifications/notification-details/notification-details.component.html
@@ -23,7 +23,7 @@ <h3>2. Identify Transferee(s)</h3>
           <app-no-data [showRequired]="false" *ngIf="!transferee.organizationName"></app-no-data>
         </div>
         <div>
-          <span *ngIf="transferee.phoneNumber">{{ transferee.phoneNumber | mask: '(000) 000-0000' }}</span>
+          <span *ngIf="transferee.phoneNumber">{{ transferee.phoneNumber | mask : '(000) 000-0000' }}</span>
         </div>
         <div>{{ transferee.email }}</div>
       </ng-container>
@@ -60,7 +60,7 @@ <h3>3. Primary Contact</h3>
     </div>
     <div class="subheading2 grid-1">Phone</div>
     <div class="grid-double">
-      {{ notificationSubmission.contactPhone ?? '' | mask : '(000) 000-0000'  }}
+      {{ notificationSubmission.contactPhone ?? '' | mask : '(000) 000-0000' }}
       <app-no-data [showRequired]="showErrors" *ngIf="!notificationSubmission.contactPhone"></app-no-data>
       <app-validation-error *ngIf="!(notificationSubmission.contactPhone || '' | phoneValid)"
         >Invalid Format</app-validation-error
@@ -122,7 +122,7 @@ <h3>6. Optional Attachments</h3>
 
       <ng-container *ngFor="let file of otherFiles">
         <div class="grid-1">
-          <a (click)="openFile(file.uuid)">{{ file.fileName }}</a>
+          <a (click)="openFile(file)">{{ file.fileName }}</a>
         </div>
         <div class="grid-2">
           {{ file.type?.label }}
diff --git a/portal-frontend/src/app/features/notifications/notification-details/notification-details.component.ts b/portal-frontend/src/app/features/notifications/notification-details/notification-details.component.ts
index 75155e4402..c7f1ff2c50 100644
--- a/portal-frontend/src/app/features/notifications/notification-details/notification-details.component.ts
+++ b/portal-frontend/src/app/features/notifications/notification-details/notification-details.component.ts
@@ -8,7 +8,7 @@ import { NotificationDocumentService } from '../../../services/notification-docu
 import { NotificationSubmissionDetailedDto } from '../../../services/notification-submission/notification-submission.dto';
 import { DOCUMENT_SOURCE, DOCUMENT_TYPE } from '../../../shared/dto/document.dto';
 import { OWNER_TYPE } from '../../../shared/dto/owner.dto';
-import { openFileIframe } from '../../../shared/utils/file';
+import { openFileInline } from '../../../shared/utils/file';
 
 @Component({
   selector: 'app-notification-details',
@@ -64,10 +64,10 @@ export class NotificationDetailsComponent implements OnInit, OnDestroy {
     this.$destroy.complete();
   }
 
-  async openFile(uuid: string) {
-    const res = await this.notificationDocumentService.openFile(uuid);
+  async openFile(file: NotificationDocumentDto) {
+    const res = await this.notificationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/notifications/notification-details/proposal-details/proposal-details.component.html b/portal-frontend/src/app/features/notifications/notification-details/proposal-details/proposal-details.component.html
index 2d8b725fd6..d58dafa26e 100644
--- a/portal-frontend/src/app/features/notifications/notification-details/proposal-details/proposal-details.component.html
+++ b/portal-frontend/src/app/features/notifications/notification-details/proposal-details/proposal-details.component.html
@@ -19,7 +19,7 @@
 
   <div class="subheading2 grid-1">Upload Terms of the SRW</div>
   <div class="grid-double">
-    <a *ngFor="let file of srwTerms" (click)="openFile(file.uuid)">
+    <a *ngFor="let file of srwTerms" (click)="openFile(file)">
       {{ file.fileName }}
     </a>
     <app-no-data [showRequired]="showErrors" *ngIf="srwTerms.length === 0"></app-no-data>
@@ -39,7 +39,7 @@
     <div><strong>Control Number</strong></div>
     <ng-container *ngFor="let file of surveyPlans">
       <div>
-        <a (click)="openFile(file.uuid)">{{ file.fileName }}</a>
+        <a (click)="openFile(file)">{{ file.fileName }}</a>
       </div>
       <div>
         {{ file.surveyPlanNumber }}
diff --git a/portal-frontend/src/app/features/notifications/notification-details/proposal-details/proposal-details.component.ts b/portal-frontend/src/app/features/notifications/notification-details/proposal-details/proposal-details.component.ts
index 348c6a7024..c20d99a84f 100644
--- a/portal-frontend/src/app/features/notifications/notification-details/proposal-details/proposal-details.component.ts
+++ b/portal-frontend/src/app/features/notifications/notification-details/proposal-details/proposal-details.component.ts
@@ -4,7 +4,7 @@ import { NotificationDocumentDto } from '../../../../services/notification-docum
 import { NotificationDocumentService } from '../../../../services/notification-document/notification-document.service';
 import { NotificationSubmissionDetailedDto } from '../../../../services/notification-submission/notification-submission.dto';
 import { DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
-import { openFileIframe } from '../../../../shared/utils/file';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-proposal-details[notificationSubmission]',
@@ -37,10 +37,10 @@ export class ProposalDetailsComponent {
     await this.router.navigateByUrl(`notification/${this._notificationSubmission?.fileNumber}/edit/${step}?errors=t`);
   }
 
-  async openFile(uuid: string) {
-    const res = await this.notificationDocumentService.openFile(uuid);
+  async openFile(file: NotificationDocumentDto) {
+    const res = await this.notificationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/notifications/view-submission/alc-review/submission-documents/submission-documents.component.html b/portal-frontend/src/app/features/notifications/view-submission/alc-review/submission-documents/submission-documents.component.html
index ff9838f439..e6504b1152 100644
--- a/portal-frontend/src/app/features/notifications/view-submission/alc-review/submission-documents/submission-documents.component.html
+++ b/portal-frontend/src/app/features/notifications/view-submission/alc-review/submission-documents/submission-documents.component.html
@@ -1,43 +1,43 @@
 <h4>SRW Documents</h4>
-<div class='table-container'>
-  <table mat-table [dataSource]='dataSource' matSort class='mat-elevation-z3 documents'>
-    <ng-container matColumnDef='type'>
-      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription='Sort by type'>Type</th>
-      <td mat-cell *matCellDef='let element'>
+<div class="table-container">
+  <table mat-table [dataSource]="dataSource" matSort class="mat-elevation-z3 documents">
+    <ng-container matColumnDef="type">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Sort by type">Type</th>
+      <td mat-cell *matCellDef="let element">
         {{ element.type?.label }}
       </td>
     </ng-container>
 
-    <ng-container matColumnDef='fileName'>
-      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription='Sort by name'>Document Name</th>
-      <td mat-cell *matCellDef='let element'>
-        <a (click)='openFile(element.uuid)'>{{ element.fileName }}</a>
+    <ng-container matColumnDef="fileName">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Sort by name">Document Name</th>
+      <td mat-cell *matCellDef="let element">
+        <a (click)="openFile(element)">{{ element.fileName }}</a>
       </td>
     </ng-container>
 
-    <ng-container matColumnDef='source'>
-      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription='Sort by source'>Source</th>
-      <td mat-cell *matCellDef='let element'>{{ element.source }}</td>
+    <ng-container matColumnDef="source">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Sort by source">Source</th>
+      <td mat-cell *matCellDef="let element">{{ element.source }}</td>
     </ng-container>
 
-    <ng-container matColumnDef='uploadedAt'>
-      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription='Sort by date'>Upload Date</th>
-      <td mat-cell *matCellDef='let element'>{{ element.uploadedAt | date }}</td>
+    <ng-container matColumnDef="uploadedAt">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Sort by date">Upload Date</th>
+      <td mat-cell *matCellDef="let element">{{ element.uploadedAt | date }}</td>
     </ng-container>
 
-    <ng-container matColumnDef='actions'>
+    <ng-container matColumnDef="actions">
       <th mat-header-cell *matHeaderCellDef>Actions</th>
-      <td mat-cell *matCellDef='let element'>
-        <button mat-icon-button (click)='downloadFile(element.uuid)'>
+      <td mat-cell *matCellDef="let element">
+        <button mat-icon-button (click)="downloadFile(element.uuid)">
           <mat-icon>file_download</mat-icon>
         </button>
       </td>
     </ng-container>
 
-    <tr mat-header-row *matHeaderRowDef='displayedColumns'></tr>
-    <tr mat-row *matRowDef='let row; columns: displayedColumns'></tr>
-    <tr class='mat-row' *matNoDataRow>
-      <td class='text-center' colspan='6'>Documents will be visible here once provided by ALC</td>
+    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+    <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
+    <tr class="mat-row" *matNoDataRow>
+      <td class="text-center" colspan="6">Documents will be visible here once provided by ALC</td>
     </tr>
   </table>
 </div>
diff --git a/portal-frontend/src/app/features/notifications/view-submission/alc-review/submission-documents/submission-documents.component.ts b/portal-frontend/src/app/features/notifications/view-submission/alc-review/submission-documents/submission-documents.component.ts
index 505cf75369..bd045b8df6 100644
--- a/portal-frontend/src/app/features/notifications/view-submission/alc-review/submission-documents/submission-documents.component.ts
+++ b/portal-frontend/src/app/features/notifications/view-submission/alc-review/submission-documents/submission-documents.component.ts
@@ -4,7 +4,7 @@ import { MatTableDataSource } from '@angular/material/table';
 import { BehaviorSubject, Subject, takeUntil } from 'rxjs';
 import { NotificationDocumentDto } from '../../../../../services/notification-document/notification-document.dto';
 import { NotificationDocumentService } from '../../../../../services/notification-document/notification-document.service';
-import { openFileIframe } from '../../../../../shared/utils/file';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-submission-documents',
@@ -30,10 +30,10 @@ export class SubmissionDocumentsComponent implements OnInit, OnDestroy {
     });
   }
 
-  async openFile(uuid: string) {
-    const res = await this.notificationDocumentService.openFile(uuid);
+  async openFile(file: NotificationDocumentDto) {
+    const res = await this.notificationDocumentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/public/application/alc-review/decisions/decisions.component.html b/portal-frontend/src/app/features/public/application/alc-review/decisions/decisions.component.html
index bcd9a775c9..3faa3101cb 100644
--- a/portal-frontend/src/app/features/public/application/alc-review/decisions/decisions.component.html
+++ b/portal-frontend/src/app/features/public/application/alc-review/decisions/decisions.component.html
@@ -20,21 +20,21 @@ <h4>Decision #{{ applicationDecisions.length - index }}</h4>
       <div class="subheading2">Decision Document</div>
       <div class="document split" *ngFor="let document of decision.documents">
         <div>
-          <a (click)="openFile(document.uuid)">{{ document.fileName }}</a>
+          <a (click)="openFile(document)">{{ document.fileName }}</a>
           &nbsp;({{ document.fileSize | filesize }})
         </div>
-        <button class="center" mat-button (click)="openFile(document.uuid)">
+        <button class="center" mat-button (click)="openFile(document)">
           <mat-icon>file_download</mat-icon>
           Download
         </button>
       </div>
       <div class="document responsive left" *ngFor="let document of decision.documents">
         <div class="document-name">
-          <a (click)="openFile(document.uuid)">{{ document.fileName }}</a>
+          <a (click)="openFile(document)">{{ document.fileName }}</a>
         </div>
         <div class="split">
           <div>{{ document.fileSize | filesize }}</div>
-          <button class="center" mat-button (click)="openFile(document.uuid)">
+          <button class="center" mat-button (click)="openFile(document)">
             <mat-icon>file_download</mat-icon>
             Download
           </button>
diff --git a/portal-frontend/src/app/features/public/application/alc-review/decisions/decisions.component.ts b/portal-frontend/src/app/features/public/application/alc-review/decisions/decisions.component.ts
index 2210cea9c3..ac7eee7179 100644
--- a/portal-frontend/src/app/features/public/application/alc-review/decisions/decisions.component.ts
+++ b/portal-frontend/src/app/features/public/application/alc-review/decisions/decisions.component.ts
@@ -1,6 +1,8 @@
 import { Component, Input } from '@angular/core';
 import { ApplicationPortalDecisionDto } from '../../../../../services/application-decision/application-decision.dto';
 import { ApplicationDecisionService } from '../../../../../services/application-decision/application-decision.service';
+import { openFileInline } from '../../../../../shared/utils/file';
+import { ApplicationDocumentDto } from '../../../../../services/application-document/application-document.dto';
 
 @Component({
   selector: 'app-public-decisions',
@@ -12,10 +14,10 @@ export class PublicDecisionsComponent {
 
   constructor(private decisionService: ApplicationDecisionService) {}
 
-  async openFile(uuid: string) {
-    const res = await this.decisionService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.decisionService.openFile(file.uuid);
     if (res) {
-      window.open(res.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/public/application/alc-review/submission-documents/submission-documents.component.html b/portal-frontend/src/app/features/public/application/alc-review/submission-documents/submission-documents.component.html
index 8dc409f48a..4b5d35bddf 100644
--- a/portal-frontend/src/app/features/public/application/alc-review/submission-documents/submission-documents.component.html
+++ b/portal-frontend/src/app/features/public/application/alc-review/submission-documents/submission-documents.component.html
@@ -1,43 +1,43 @@
 <h4>Application Documents</h4>
-<div class='table-container'>
-  <table mat-table [dataSource]='dataSource' matSort class='mat-elevation-z3 documents'>
-    <ng-container matColumnDef='type'>
-      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription='Sort by type'>Type</th>
-      <td mat-cell *matCellDef='let element'>
+<div class="table-container">
+  <table mat-table [dataSource]="dataSource" matSort class="mat-elevation-z3 documents">
+    <ng-container matColumnDef="type">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Sort by type">Type</th>
+      <td mat-cell *matCellDef="let element">
         {{ element.type?.label }}
       </td>
     </ng-container>
 
-    <ng-container matColumnDef='fileName'>
-      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription='Sort by name'>Document Name</th>
-      <td mat-cell *matCellDef='let element'>
-        <a (click)='openFile(element.uuid)'>{{ element.fileName }}</a>
+    <ng-container matColumnDef="fileName">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Sort by name">Document Name</th>
+      <td mat-cell *matCellDef="let element">
+        <a (click)="openFile(element)">{{ element.fileName }}</a>
       </td>
     </ng-container>
 
-    <ng-container matColumnDef='source'>
-      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription='Sort by source'>Source</th>
-      <td mat-cell *matCellDef='let element'>{{ element.source }}</td>
+    <ng-container matColumnDef="source">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Sort by source">Source</th>
+      <td mat-cell *matCellDef="let element">{{ element.source }}</td>
     </ng-container>
 
-    <ng-container matColumnDef='uploadedAt'>
-      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription='Sort by date'>Upload Date</th>
-      <td mat-cell *matCellDef='let element'>{{ element.uploadedAt | date }}</td>
+    <ng-container matColumnDef="uploadedAt">
+      <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Sort by date">Upload Date</th>
+      <td mat-cell *matCellDef="let element">{{ element.uploadedAt | date }}</td>
     </ng-container>
 
-    <ng-container matColumnDef='actions'>
+    <ng-container matColumnDef="actions">
       <th mat-header-cell *matHeaderCellDef>Actions</th>
-      <td mat-cell *matCellDef='let element'>
-        <button mat-icon-button (click)='downloadFile(element.uuid)'>
+      <td mat-cell *matCellDef="let element">
+        <button mat-icon-button (click)="downloadFile(element.uuid)">
           <mat-icon>file_download</mat-icon>
         </button>
       </td>
     </ng-container>
 
-    <tr mat-header-row *matHeaderRowDef='displayedColumns'></tr>
-    <tr mat-row *matRowDef='let row; columns: displayedColumns'></tr>
-    <tr class='mat-row' *matNoDataRow>
-      <td class='text-center' colspan='6'>Documents will be visible here once provided by ALC</td>
+    <tr mat-header-row *matHeaderRowDef="displayedColumns"></tr>
+    <tr mat-row *matRowDef="let row; columns: displayedColumns"></tr>
+    <tr class="mat-row" *matNoDataRow>
+      <td class="text-center" colspan="6">Documents will be visible here once provided by ALC</td>
     </tr>
   </table>
 </div>
diff --git a/portal-frontend/src/app/features/public/application/alc-review/submission-documents/submission-documents.component.ts b/portal-frontend/src/app/features/public/application/alc-review/submission-documents/submission-documents.component.ts
index 5364c65182..61a58bd1ce 100644
--- a/portal-frontend/src/app/features/public/application/alc-review/submission-documents/submission-documents.component.ts
+++ b/portal-frontend/src/app/features/public/application/alc-review/submission-documents/submission-documents.component.ts
@@ -5,6 +5,7 @@ import { Subject } from 'rxjs';
 import { PublicApplicationSubmissionDto } from '../../../../../services/public/public-application.dto';
 import { PublicDocumentDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-submission-documents[applicationSubmission]',
@@ -29,10 +30,10 @@ export class PublicSubmissionDocumentsComponent implements OnInit, OnDestroy {
     this.dataSource = new MatTableDataSource(this.applicationDocuments);
   }
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getApplicationDownloadFileUrl(this.applicationSubmission.fileNumber, uuid);
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, file.uuid);
     if (res) {
-      window.open(res.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/public/application/lfng-review/lfng-review.component.html b/portal-frontend/src/app/features/public/application/lfng-review/lfng-review.component.html
index de4aafdf39..27051ce4c8 100644
--- a/portal-frontend/src/app/features/public/application/lfng-review/lfng-review.component.html
+++ b/portal-frontend/src/app/features/public/application/lfng-review/lfng-review.component.html
@@ -145,7 +145,7 @@ <h4>Attachments</h4>
         <div>
           <div class="subheading2">Resolution Document</div>
           <div>
-            <a class="link" (click)="openFile(document.uuid)" *ngFor="let document of resolutionDocument">{{
+            <a class="link" (click)="openFile(document)" *ngFor="let document of resolutionDocument">{{
               document.fileName
             }}</a>
           </div>
diff --git a/portal-frontend/src/app/features/public/application/lfng-review/lfng-review.component.ts b/portal-frontend/src/app/features/public/application/lfng-review/lfng-review.component.ts
index c2a3ea1617..7846534630 100644
--- a/portal-frontend/src/app/features/public/application/lfng-review/lfng-review.component.ts
+++ b/portal-frontend/src/app/features/public/application/lfng-review/lfng-review.component.ts
@@ -7,6 +7,7 @@ import {
 import { PublicDocumentDto } from '../../../../services/public/public.dto';
 import { PublicService } from '../../../../services/public/public.service';
 import { DOCUMENT_TYPE } from '../../../../shared/dto/document.dto';
+import { openFileInline } from '../../../../shared/utils/file';
 
 @Component({
   selector: 'app-public-lfng-review',
@@ -29,10 +30,10 @@ export class PublicLfngReviewComponent implements OnInit {
     );
   }
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, uuid);
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, file.uuid);
     if (res) {
-      window.open(res.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/public/application/submission/cove-details/cove-details.component.html b/portal-frontend/src/app/features/public/application/submission/cove-details/cove-details.component.html
index e48358fe16..dd124b497e 100644
--- a/portal-frontend/src/app/features/public/application/submission/cove-details/cove-details.component.html
+++ b/portal-frontend/src/app/features/public/application/submission/cove-details/cove-details.component.html
@@ -34,7 +34,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data *ngIf="proposalMap.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/public/application/submission/cove-details/cove-details.component.ts b/portal-frontend/src/app/features/public/application/submission/cove-details/cove-details.component.ts
index f094e9c5bd..3b0287891f 100644
--- a/portal-frontend/src/app/features/public/application/submission/cove-details/cove-details.component.ts
+++ b/portal-frontend/src/app/features/public/application/submission/cove-details/cove-details.component.ts
@@ -3,6 +3,7 @@ import { PublicApplicationSubmissionDto } from '../../../../../services/public/p
 import { PublicDocumentDto, PublicOwnerDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
 import { DOCUMENT_TYPE } from '../../../../../shared/dto/document.dto';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-cove-details',
@@ -21,8 +22,10 @@ export class CoveDetailsComponent {
 
   constructor(private publicService: PublicService) {}
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getApplicationOpenFileUrl(uuid, this.applicationSubmission.fileNumber);
-    window.open(res?.url, '_blank');
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, file.uuid);
+    if (res) {
+      openFileInline(res.url, file.fileName);
+    }
   }
 }
diff --git a/portal-frontend/src/app/features/public/application/submission/excl-details/excl-details.component.html b/portal-frontend/src/app/features/public/application/submission/excl-details/excl-details.component.html
index 244752b806..262530e5f8 100644
--- a/portal-frontend/src/app/features/public/application/submission/excl-details/excl-details.component.html
+++ b/portal-frontend/src/app/features/public/application/submission/excl-details/excl-details.component.html
@@ -34,7 +34,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data *ngIf="proposalMap.length === 0"></app-no-data>
@@ -43,7 +43,7 @@
   <div class="subheading2 grid-1">Report of Public Hearing</div>
   <div class="grid-double">
     <div *ngFor="let file of reportOfPublicHearing">
-      <a (click)="openFile(file.uuid)">
+      <a (click)="openFile(file)">
         {{ file.fileName }}
       </a>
     </div>
diff --git a/portal-frontend/src/app/features/public/application/submission/excl-details/excl-details.component.ts b/portal-frontend/src/app/features/public/application/submission/excl-details/excl-details.component.ts
index a26e563831..f597ea401c 100644
--- a/portal-frontend/src/app/features/public/application/submission/excl-details/excl-details.component.ts
+++ b/portal-frontend/src/app/features/public/application/submission/excl-details/excl-details.component.ts
@@ -4,6 +4,7 @@ import { PublicApplicationSubmissionDto } from '../../../../../services/public/p
 import { PublicDocumentDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
 import { DOCUMENT_TYPE } from '../../../../../shared/dto/document.dto';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-excl-details',
@@ -25,10 +26,10 @@ export class ExclDetailsComponent {
 
   constructor(private publicService: PublicService) {}
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, uuid);
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, file.uuid);
     if (res) {
-      window.open(res?.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/public/application/submission/incl-details/incl-details.component.html b/portal-frontend/src/app/features/public/application/submission/incl-details/incl-details.component.html
index 7ea70a788a..3473c9fc28 100644
--- a/portal-frontend/src/app/features/public/application/submission/incl-details/incl-details.component.html
+++ b/portal-frontend/src/app/features/public/application/submission/incl-details/incl-details.component.html
@@ -27,7 +27,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data *ngIf="proposalMap.length === 0"></app-no-data>
@@ -48,7 +48,7 @@
     <div class="subheading2 grid-1">Report of Public Hearing</div>
     <div class="grid-double">
       <div *ngFor="let file of reportOfPublicHearing">
-        <a (click)="openFile(file.uuid)">
+        <a (click)="openFile(file)">
           {{ file.fileName }}
         </a>
         <app-no-data *ngIf="reportOfPublicHearing.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/public/application/submission/incl-details/incl-details.component.ts b/portal-frontend/src/app/features/public/application/submission/incl-details/incl-details.component.ts
index bbfc25ed99..d0b0a03bf1 100644
--- a/portal-frontend/src/app/features/public/application/submission/incl-details/incl-details.component.ts
+++ b/portal-frontend/src/app/features/public/application/submission/incl-details/incl-details.component.ts
@@ -4,6 +4,7 @@ import { PublicApplicationSubmissionDto } from '../../../../../services/public/p
 import { PublicDocumentDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
 import { DOCUMENT_TYPE } from '../../../../../shared/dto/document.dto';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-incl-details',
@@ -25,10 +26,10 @@ export class InclDetailsComponent {
 
   constructor(private router: Router, private publicService: PublicService) {}
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, uuid);
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, file.uuid);
     if (res) {
-      window.open(res?.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/public/application/submission/naru-details/naru-details.component.html b/portal-frontend/src/app/features/public/application/submission/naru-details/naru-details.component.html
index 6c7539fe04..d19c9a205e 100644
--- a/portal-frontend/src/app/features/public/application/submission/naru-details/naru-details.component.html
+++ b/portal-frontend/src/app/features/public/application/submission/naru-details/naru-details.component.html
@@ -135,7 +135,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data *ngIf="proposalMap.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/public/application/submission/naru-details/naru-details.component.ts b/portal-frontend/src/app/features/public/application/submission/naru-details/naru-details.component.ts
index 1ad7be3a22..426d98a570 100644
--- a/portal-frontend/src/app/features/public/application/submission/naru-details/naru-details.component.ts
+++ b/portal-frontend/src/app/features/public/application/submission/naru-details/naru-details.component.ts
@@ -4,6 +4,7 @@ import { PublicApplicationSubmissionDto } from '../../../../../services/public/p
 import { PublicDocumentDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
 import { DOCUMENT_TYPE } from '../../../../../shared/dto/document.dto';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-naru-details[applicationSubmission]',
@@ -20,10 +21,10 @@ export class NaruDetailsComponent {
 
   constructor(private router: Router, private publicService: PublicService) {}
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, uuid);
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, file.uuid);
     if (res) {
-      window.open(res?.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/public/application/submission/nfu-details/nfu-details.component.html b/portal-frontend/src/app/features/public/application/submission/nfu-details/nfu-details.component.html
index f79da77058..0192fa6e3c 100644
--- a/portal-frontend/src/app/features/public/application/submission/nfu-details/nfu-details.component.html
+++ b/portal-frontend/src/app/features/public/application/submission/nfu-details/nfu-details.component.html
@@ -22,7 +22,7 @@
   </div>
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data *ngIf="proposalMap.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/public/application/submission/nfu-details/nfu-details.component.ts b/portal-frontend/src/app/features/public/application/submission/nfu-details/nfu-details.component.ts
index 6fb3aaa0c8..d26d1d97ea 100644
--- a/portal-frontend/src/app/features/public/application/submission/nfu-details/nfu-details.component.ts
+++ b/portal-frontend/src/app/features/public/application/submission/nfu-details/nfu-details.component.ts
@@ -4,6 +4,7 @@ import { PublicApplicationSubmissionDto } from '../../../../../services/public/p
 import { PublicDocumentDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
 import { DOCUMENT_TYPE } from '../../../../../shared/dto/document.dto';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-nfu-details[applicationSubmission]',
@@ -21,10 +22,10 @@ export class NfuDetailsComponent {
 
   constructor(private router: Router, private publicService: PublicService) {}
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, uuid);
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, file.uuid);
     if (res) {
-      window.open(res?.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/public/application/submission/pfrs-details/pfrs-details.component.html b/portal-frontend/src/app/features/public/application/submission/pfrs-details/pfrs-details.component.html
index d8b9ad3cc9..94e04b31d9 100644
--- a/portal-frontend/src/app/features/public/application/submission/pfrs-details/pfrs-details.component.html
+++ b/portal-frontend/src/app/features/public/application/submission/pfrs-details/pfrs-details.component.html
@@ -173,7 +173,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data *ngIf="proposalMap.length === 0"></app-no-data>
@@ -181,7 +181,7 @@
 
   <div class="subheading2 grid-1">Cross Sections</div>
   <div class="grid-double">
-    <a *ngFor="let file of crossSections" (click)="openFile(file.uuid)">
+    <a *ngFor="let file of crossSections" (click)="openFile(file)">
       {{ file.fileName }}
     </a>
     <app-no-data *ngIf="crossSections.length === 0"></app-no-data>
@@ -189,7 +189,7 @@
 
   <div class="subheading2 grid-1">Reclamation Plan</div>
   <div class="grid-double">
-    <a *ngFor="let file of crossSections" (click)="openFile(file.uuid)">
+    <a *ngFor="let file of crossSections" (click)="openFile(file)">
       {{ file.fileName }}
     </a>
     <app-no-data *ngIf="crossSections.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/public/application/submission/pfrs-details/pfrs-details.component.ts b/portal-frontend/src/app/features/public/application/submission/pfrs-details/pfrs-details.component.ts
index ebe8f634d8..4abf71a849 100644
--- a/portal-frontend/src/app/features/public/application/submission/pfrs-details/pfrs-details.component.ts
+++ b/portal-frontend/src/app/features/public/application/submission/pfrs-details/pfrs-details.component.ts
@@ -4,6 +4,7 @@ import { PublicApplicationSubmissionDto } from '../../../../../services/public/p
 import { PublicDocumentDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
 import { DOCUMENT_TYPE } from '../../../../../shared/dto/document.dto';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-pfrs-details[applicationSubmission]',
@@ -23,10 +24,10 @@ export class PfrsDetailsComponent {
 
   constructor(private router: Router, private publicService: PublicService) {}
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, uuid);
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, file.uuid);
     if (res) {
-      window.open(res?.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/public/application/submission/pofo-details/pofo-details.component.html b/portal-frontend/src/app/features/public/application/submission/pofo-details/pofo-details.component.html
index 2d9e254aa8..3a11c73f05 100644
--- a/portal-frontend/src/app/features/public/application/submission/pofo-details/pofo-details.component.html
+++ b/portal-frontend/src/app/features/public/application/submission/pofo-details/pofo-details.component.html
@@ -51,18 +51,14 @@
     <div>
       {{ applicationSubmission.soilToPlaceMaximumDepth }}
       <span *ngIf="applicationSubmission.soilToPlaceMaximumDepth !== null">m</span>
-      <app-no-data
-        *ngIf="applicationSubmission.soilToPlaceMaximumDepth === null"
-      ></app-no-data>
+      <app-no-data *ngIf="applicationSubmission.soilToPlaceMaximumDepth === null"></app-no-data>
     </div>
 
     <div class="subheading2">Average Depth</div>
     <div>
       {{ applicationSubmission.soilToPlaceAverageDepth }}
       <span *ngIf="applicationSubmission.soilToPlaceAverageDepth !== null">m</span>
-      <app-no-data
-        *ngIf="applicationSubmission.soilToPlaceAverageDepth === null"
-      ></app-no-data>
+      <app-no-data *ngIf="applicationSubmission.soilToPlaceAverageDepth === null"></app-no-data>
     </div>
 
     <div></div>
@@ -72,36 +68,28 @@
     <div>
       {{ applicationSubmission.soilAlreadyPlacedVolume }}
       <span *ngIf="applicationSubmission.soilAlreadyPlacedVolume !== null">m<sup>3</sup></span>
-      <app-no-data
-        *ngIf="applicationSubmission.soilAlreadyPlacedVolume === null"
-      ></app-no-data>
+      <app-no-data *ngIf="applicationSubmission.soilAlreadyPlacedVolume === null"></app-no-data>
     </div>
 
     <div class="subheading2">Area</div>
     <div>
       {{ applicationSubmission.soilAlreadyPlacedArea }}
       <span *ngIf="applicationSubmission.soilAlreadyPlacedArea !== null">m<sup>2</sup></span>
-      <app-no-data
-        *ngIf="applicationSubmission.soilAlreadyPlacedArea === null"
-      ></app-no-data>
+      <app-no-data *ngIf="applicationSubmission.soilAlreadyPlacedArea === null"></app-no-data>
     </div>
 
     <div class="subheading2">Maximum Depth</div>
     <div>
       {{ applicationSubmission.soilAlreadyPlacedMaximumDepth }}
       <span *ngIf="applicationSubmission.soilAlreadyPlacedMaximumDepth !== null">m</span>
-      <app-no-data
-        *ngIf="applicationSubmission.soilAlreadyPlacedMaximumDepth === null"
-      ></app-no-data>
+      <app-no-data *ngIf="applicationSubmission.soilAlreadyPlacedMaximumDepth === null"></app-no-data>
     </div>
 
     <div class="subheading2">Average Depth</div>
     <div>
       {{ applicationSubmission.soilAlreadyPlacedAverageDepth }}
       <span *ngIf="applicationSubmission.soilAlreadyPlacedAverageDepth !== null">m</span>
-      <app-no-data
-        *ngIf="applicationSubmission.soilAlreadyPlacedAverageDepth === null"
-      ></app-no-data>
+      <app-no-data *ngIf="applicationSubmission.soilAlreadyPlacedAverageDepth === null"></app-no-data>
     </div>
   </div>
 
@@ -127,7 +115,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data *ngIf="proposalMap.length === 0"></app-no-data>
@@ -135,7 +123,7 @@
 
   <div class="subheading2 grid-1">Cross Sections</div>
   <div class="grid-double">
-    <a *ngFor="let file of crossSections" (click)="openFile(file.uuid)">
+    <a *ngFor="let file of crossSections" (click)="openFile(file)">
       {{ file.fileName }}
     </a>
     <app-no-data *ngIf="crossSections.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/public/application/submission/pofo-details/pofo-details.component.ts b/portal-frontend/src/app/features/public/application/submission/pofo-details/pofo-details.component.ts
index f08f625509..3aa24798a2 100644
--- a/portal-frontend/src/app/features/public/application/submission/pofo-details/pofo-details.component.ts
+++ b/portal-frontend/src/app/features/public/application/submission/pofo-details/pofo-details.component.ts
@@ -4,6 +4,7 @@ import { PublicApplicationSubmissionDto } from '../../../../../services/public/p
 import { PublicDocumentDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
 import { DOCUMENT_TYPE } from '../../../../../shared/dto/document.dto';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-pofo-details[applicationSubmission]',
@@ -23,10 +24,10 @@ export class PofoDetailsComponent {
 
   constructor(private router: Router, private publicService: PublicService) {}
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, uuid);
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, file.uuid);
     if (res) {
-      window.open(res?.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/public/application/submission/roso-details/roso-details.component.html b/portal-frontend/src/app/features/public/application/submission/roso-details/roso-details.component.html
index d532fd963d..a358a4490e 100644
--- a/portal-frontend/src/app/features/public/application/submission/roso-details/roso-details.component.html
+++ b/portal-frontend/src/app/features/public/application/submission/roso-details/roso-details.component.html
@@ -107,7 +107,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data *ngIf="proposalMap.length === 0"></app-no-data>
@@ -115,7 +115,7 @@
 
   <div class="subheading2 grid-1">Cross Sections</div>
   <div class="grid-double">
-    <a *ngFor="let file of crossSections" (click)="openFile(file.uuid)">
+    <a *ngFor="let file of crossSections" (click)="openFile(file)">
       {{ file.fileName }}
     </a>
     <app-no-data *ngIf="crossSections.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/public/application/submission/roso-details/roso-details.component.ts b/portal-frontend/src/app/features/public/application/submission/roso-details/roso-details.component.ts
index 44f33dea4a..51f664616a 100644
--- a/portal-frontend/src/app/features/public/application/submission/roso-details/roso-details.component.ts
+++ b/portal-frontend/src/app/features/public/application/submission/roso-details/roso-details.component.ts
@@ -4,6 +4,7 @@ import { PublicApplicationSubmissionDto } from '../../../../../services/public/p
 import { PublicDocumentDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
 import { DOCUMENT_TYPE } from '../../../../../shared/dto/document.dto';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-roso-details[applicationSubmission]',
@@ -23,10 +24,10 @@ export class RosoDetailsComponent {
 
   constructor(private router: Router, private publicService: PublicService) {}
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, uuid);
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, file.uuid);
     if (res) {
-      window.open(res?.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/public/application/submission/subd-details/subd-details.component.html b/portal-frontend/src/app/features/public/application/submission/subd-details/subd-details.component.html
index cb8fbe2991..ba73f0e702 100644
--- a/portal-frontend/src/app/features/public/application/submission/subd-details/subd-details.component.html
+++ b/portal-frontend/src/app/features/public/application/submission/subd-details/subd-details.component.html
@@ -38,7 +38,7 @@
   </div>
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data *ngIf="proposalMap.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/public/application/submission/subd-details/subd-details.component.ts b/portal-frontend/src/app/features/public/application/submission/subd-details/subd-details.component.ts
index 82d9e4e921..5b75bad0a7 100644
--- a/portal-frontend/src/app/features/public/application/submission/subd-details/subd-details.component.ts
+++ b/portal-frontend/src/app/features/public/application/submission/subd-details/subd-details.component.ts
@@ -4,6 +4,7 @@ import { PublicApplicationSubmissionDto } from '../../../../../services/public/p
 import { PublicDocumentDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
 import { DOCUMENT_TYPE } from '../../../../../shared/dto/document.dto';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-subd-details[applicationSubmission]',
@@ -21,10 +22,10 @@ export class SubdDetailsComponent {
 
   constructor(private router: Router, private publicService: PublicService) {}
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, uuid);
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, file.uuid);
     if (res) {
-      window.open(res?.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/public/application/submission/tur-details/tur-details.component.html b/portal-frontend/src/app/features/public/application/submission/tur-details/tur-details.component.html
index 1c51ac5f19..f483a12b85 100644
--- a/portal-frontend/src/app/features/public/application/submission/tur-details/tur-details.component.html
+++ b/portal-frontend/src/app/features/public/application/submission/tur-details/tur-details.component.html
@@ -33,7 +33,7 @@
   </div>
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let file of proposalMap" (click)="openFile(file.uuid)">
+    <a *ngFor="let file of proposalMap" (click)="openFile(file)">
       {{ file.fileName }}
     </a>
     <app-no-data *ngIf="proposalMap.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/public/application/submission/tur-details/tur-details.component.ts b/portal-frontend/src/app/features/public/application/submission/tur-details/tur-details.component.ts
index fcc8e94615..58caec09af 100644
--- a/portal-frontend/src/app/features/public/application/submission/tur-details/tur-details.component.ts
+++ b/portal-frontend/src/app/features/public/application/submission/tur-details/tur-details.component.ts
@@ -4,6 +4,7 @@ import { PublicApplicationSubmissionDto } from '../../../../../services/public/p
 import { PublicDocumentDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
 import { DOCUMENT_TYPE } from '../../../../../shared/dto/document.dto';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-tur-details[applicationSubmission]',
@@ -20,10 +21,10 @@ export class TurDetailsComponent {
 
   constructor(private router: Router, private publicService: PublicService) {}
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, uuid);
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getApplicationOpenFileUrl(this.applicationSubmission.fileNumber, file.uuid);
     if (res) {
-      window.open(res?.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/public/notice-of-intent/alc-review/decisions/decisions.component.html b/portal-frontend/src/app/features/public/notice-of-intent/alc-review/decisions/decisions.component.html
index 413266b969..2a2f6909c7 100644
--- a/portal-frontend/src/app/features/public/notice-of-intent/alc-review/decisions/decisions.component.html
+++ b/portal-frontend/src/app/features/public/notice-of-intent/alc-review/decisions/decisions.component.html
@@ -20,21 +20,21 @@ <h4>Decision #{{ decisions.length - index }}</h4>
       <div class="subheading2">Decision Document</div>
       <div class="document split" *ngFor="let document of decision.documents">
         <div>
-          <a (click)="openFile(document.uuid)">{{ document.fileName }}</a>
+          <a (click)="openFile(document)">{{ document.fileName }}</a>
           &nbsp;({{ document.fileSize | filesize }})
         </div>
-        <button class="center" mat-button (click)="openFile(document.uuid)">
+        <button class="center" mat-button (click)="openFile(document)">
           <mat-icon>file_download</mat-icon>
           Download
         </button>
       </div>
       <div class="document responsive left" *ngFor="let document of decision.documents">
         <div class="document-name">
-          <a (click)="openFile(document.uuid)">{{ document.fileName }}</a>
+          <a (click)="openFile(document)">{{ document.fileName }}</a>
         </div>
         <div class="split">
           <div>{{ document.fileSize | filesize }}</div>
-          <button class="center" mat-button (click)="openFile(document.uuid)">
+          <button class="center" mat-button (click)="openFile(document)">
             <mat-icon>file_download</mat-icon>
             Download
           </button>
diff --git a/portal-frontend/src/app/features/public/notice-of-intent/alc-review/decisions/decisions.component.ts b/portal-frontend/src/app/features/public/notice-of-intent/alc-review/decisions/decisions.component.ts
index 32abf6af5e..d0277bf4f1 100644
--- a/portal-frontend/src/app/features/public/notice-of-intent/alc-review/decisions/decisions.component.ts
+++ b/portal-frontend/src/app/features/public/notice-of-intent/alc-review/decisions/decisions.component.ts
@@ -1,6 +1,8 @@
 import { Component, Input } from '@angular/core';
 import { NoticeOfIntentPortalDecisionDto } from '../../../../../services/notice-of-intent-decision/notice-of-intent-decision.dto';
 import { NoticeOfIntentDecisionService } from '../../../../../services/notice-of-intent-decision/notice-of-intent-decision.service';
+import { openFileInline } from '../../../../../shared/utils/file';
+import { ApplicationDocumentDto } from '../../../../../services/application-document/application-document.dto';
 
 @Component({
   selector: 'app-public-decisions',
@@ -12,10 +14,10 @@ export class PublicDecisionsComponent {
 
   constructor(private decisionService: NoticeOfIntentDecisionService) {}
 
-  async openFile(uuid: string) {
-    const res = await this.decisionService.openFile(uuid);
+  async openFile(file: ApplicationDocumentDto) {
+    const res = await this.decisionService.openFile(file.uuid);
     if (res) {
-      window.open(res.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/features/public/notice-of-intent/alc-review/submission-documents/submission-documents.component.html b/portal-frontend/src/app/features/public/notice-of-intent/alc-review/submission-documents/submission-documents.component.html
index c5429a7155..d22fd2a4d6 100644
--- a/portal-frontend/src/app/features/public/notice-of-intent/alc-review/submission-documents/submission-documents.component.html
+++ b/portal-frontend/src/app/features/public/notice-of-intent/alc-review/submission-documents/submission-documents.component.html
@@ -11,7 +11,7 @@ <h4>NOI Documents</h4>
     <ng-container matColumnDef="fileName">
       <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Sort by name">Document Name</th>
       <td mat-cell *matCellDef="let element">
-        <a (click)="openFile(element.uuid)">{{ element.fileName }}</a>
+        <a (click)="openFile(element)">{{ element.fileName }}</a>
       </td>
     </ng-container>
 
diff --git a/portal-frontend/src/app/features/public/notice-of-intent/alc-review/submission-documents/submission-documents.component.ts b/portal-frontend/src/app/features/public/notice-of-intent/alc-review/submission-documents/submission-documents.component.ts
index 321c2ab75b..cc7d5dda7b 100644
--- a/portal-frontend/src/app/features/public/notice-of-intent/alc-review/submission-documents/submission-documents.component.ts
+++ b/portal-frontend/src/app/features/public/notice-of-intent/alc-review/submission-documents/submission-documents.component.ts
@@ -5,6 +5,7 @@ import { Subject } from 'rxjs';
 import { PublicNoticeOfIntentSubmissionDto } from '../../../../../services/public/public-notice-of-intent.dto';
 import { PublicDocumentDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-submission-documents',
@@ -27,10 +28,10 @@ export class PublicSubmissionDocumentsComponent implements OnInit, OnDestroy {
     this.dataSource = new MatTableDataSource(this.documents);
   }
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getNoticeOfIntentOpenFileUrl(this.submission.fileNumber, uuid);
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getNoticeOfIntentOpenFileUrl(this.submission.fileNumber, file.uuid);
     if (res) {
-      window.open(res.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/public/notice-of-intent/submission/additional-information/additional-information.component.ts b/portal-frontend/src/app/features/public/notice-of-intent/submission/additional-information/additional-information.component.ts
index a21f812bd0..7e72ef939c 100644
--- a/portal-frontend/src/app/features/public/notice-of-intent/submission/additional-information/additional-information.component.ts
+++ b/portal-frontend/src/app/features/public/notice-of-intent/submission/additional-information/additional-information.component.ts
@@ -8,6 +8,7 @@ import {
   RESIDENTIAL_STRUCTURE_TYPES,
   STRUCTURE_TYPES,
 } from '../../../../notice-of-intents/edit-submission/additional-information/additional-information.component';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-additional-information',
@@ -70,8 +71,10 @@ export class AdditionalInformationComponent implements OnInit {
     );
   }
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getNoticeOfIntentOpenFileUrl(this.noiSubmission.fileNumber, uuid);
-    window.open(res?.url, '_blank');
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getNoticeOfIntentOpenFileUrl(this.noiSubmission.fileNumber, file.uuid);
+    if (res) {
+      openFileInline(res.url, file.fileName);
+    }
   }
 }
diff --git a/portal-frontend/src/app/features/public/notice-of-intent/submission/pfrs-details/pfrs-details.component.html b/portal-frontend/src/app/features/public/notice-of-intent/submission/pfrs-details/pfrs-details.component.html
index 367d047d9a..815fdaaef6 100644
--- a/portal-frontend/src/app/features/public/notice-of-intent/submission/pfrs-details/pfrs-details.component.html
+++ b/portal-frontend/src/app/features/public/notice-of-intent/submission/pfrs-details/pfrs-details.component.html
@@ -159,7 +159,7 @@
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data *ngIf="proposalMap.length === 0"></app-no-data>
@@ -184,7 +184,7 @@
   <ng-container *ngIf="noiSubmission.soilIsExtractionOrMining || noiSubmission.soilIsAreaWideFilling">
     <div class="subheading2 grid-1">Cross Sections</div>
     <div class="grid-double">
-      <a *ngFor="let file of crossSections" (click)="openFile(file.uuid)">
+      <a *ngFor="let file of crossSections" (click)="openFile(file)">
         {{ file.fileName }}
       </a>
       <app-no-data *ngIf="crossSections.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/public/notice-of-intent/submission/pfrs-details/pfrs-details.component.ts b/portal-frontend/src/app/features/public/notice-of-intent/submission/pfrs-details/pfrs-details.component.ts
index 36e47a3c9c..d758bc38c3 100644
--- a/portal-frontend/src/app/features/public/notice-of-intent/submission/pfrs-details/pfrs-details.component.ts
+++ b/portal-frontend/src/app/features/public/notice-of-intent/submission/pfrs-details/pfrs-details.component.ts
@@ -4,6 +4,7 @@ import { PublicNoticeOfIntentSubmissionDto } from '../../../../../services/publi
 import { PublicDocumentDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
 import { DOCUMENT_TYPE } from '../../../../../shared/dto/document.dto';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-pfrs-details[noiSubmission]',
@@ -23,8 +24,10 @@ export class PfrsDetailsComponent {
 
   constructor(private router: Router, private publicService: PublicService) {}
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getNoticeOfIntentOpenFileUrl(this.noiSubmission.fileNumber, uuid);
-    window.open(res?.url, '_blank');
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getNoticeOfIntentOpenFileUrl(this.noiSubmission.fileNumber, file.uuid);
+    if (res) {
+      openFileInline(res.url, file.fileName);
+    }
   }
 }
diff --git a/portal-frontend/src/app/features/public/notice-of-intent/submission/pofo-details/pofo-details.component.html b/portal-frontend/src/app/features/public/notice-of-intent/submission/pofo-details/pofo-details.component.html
index 00a51e94a8..5409a3b115 100644
--- a/portal-frontend/src/app/features/public/notice-of-intent/submission/pofo-details/pofo-details.component.html
+++ b/portal-frontend/src/app/features/public/notice-of-intent/submission/pofo-details/pofo-details.component.html
@@ -32,9 +32,7 @@
     <div *ngIf="noiSubmission.soilProjectDuration">
       {{ noiSubmission.soilProjectDuration }}
     </div>
-    <app-no-data
-      *ngIf="!noiSubmission.soilProjectDuration"
-    ></app-no-data>
+    <app-no-data *ngIf="!noiSubmission.soilProjectDuration"></app-no-data>
   </div>
 
   <div *ngIf="noiSubmission" class="full-width soil-table">
@@ -59,18 +57,14 @@
     <div>
       {{ noiSubmission.soilToPlaceMaximumDepth }}
       <span *ngIf="noiSubmission.soilToPlaceMaximumDepth !== null">m</span>
-      <app-no-data
-        *ngIf="noiSubmission.soilToPlaceMaximumDepth === null"
-      ></app-no-data>
+      <app-no-data *ngIf="noiSubmission.soilToPlaceMaximumDepth === null"></app-no-data>
     </div>
 
     <div class="subheading2">Average Depth</div>
     <div>
       {{ noiSubmission.soilToPlaceAverageDepth }}
       <span *ngIf="noiSubmission.soilToPlaceAverageDepth !== null">m</span>
-      <app-no-data
-        *ngIf="noiSubmission.soilToPlaceAverageDepth === null"
-      ></app-no-data>
+      <app-no-data *ngIf="noiSubmission.soilToPlaceAverageDepth === null"></app-no-data>
     </div>
 
     <div></div>
@@ -80,42 +74,34 @@
     <div>
       {{ noiSubmission.soilAlreadyPlacedVolume }}
       <span *ngIf="noiSubmission.soilAlreadyPlacedVolume !== null">m<sup>3</sup></span>
-      <app-no-data
-        *ngIf="noiSubmission.soilAlreadyPlacedVolume === null"
-      ></app-no-data>
+      <app-no-data *ngIf="noiSubmission.soilAlreadyPlacedVolume === null"></app-no-data>
     </div>
 
     <div class="subheading2">Area</div>
     <div>
       {{ noiSubmission.soilAlreadyPlacedArea }}
       <span *ngIf="noiSubmission.soilAlreadyPlacedArea !== null">m<sup>2</sup></span>
-      <app-no-data
-        *ngIf="noiSubmission.soilAlreadyPlacedArea === null"
-      ></app-no-data>
+      <app-no-data *ngIf="noiSubmission.soilAlreadyPlacedArea === null"></app-no-data>
     </div>
 
     <div class="subheading2">Maximum Depth</div>
     <div>
       {{ noiSubmission.soilAlreadyPlacedMaximumDepth }}
       <span *ngIf="noiSubmission.soilAlreadyPlacedMaximumDepth !== null">m</span>
-      <app-no-data
-        *ngIf="noiSubmission.soilAlreadyPlacedMaximumDepth === null"
-      ></app-no-data>
+      <app-no-data *ngIf="noiSubmission.soilAlreadyPlacedMaximumDepth === null"></app-no-data>
     </div>
 
     <div class="subheading2">Average Depth</div>
     <div>
       {{ noiSubmission.soilAlreadyPlacedAverageDepth }}
       <span *ngIf="noiSubmission.soilAlreadyPlacedAverageDepth !== null">m</span>
-      <app-no-data
-        *ngIf="noiSubmission.soilAlreadyPlacedAverageDepth === null"
-      ></app-no-data>
+      <app-no-data *ngIf="noiSubmission.soilAlreadyPlacedAverageDepth === null"></app-no-data>
     </div>
   </div>
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data *ngIf="proposalMap.length === 0"></app-no-data>
@@ -132,7 +118,7 @@
   <ng-container *ngIf="noiSubmission.soilIsAreaWideFilling">
     <div class="subheading2 grid-1">Cross Sections</div>
     <div class="grid-double">
-      <a *ngFor="let file of crossSections" (click)="openFile(file.uuid)">
+      <a *ngFor="let file of crossSections" (click)="openFile(file)">
         {{ file.fileName }}
       </a>
       <app-no-data *ngIf="crossSections.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/public/notice-of-intent/submission/pofo-details/pofo-details.component.ts b/portal-frontend/src/app/features/public/notice-of-intent/submission/pofo-details/pofo-details.component.ts
index 04a3e7a5cf..92b7c2b089 100644
--- a/portal-frontend/src/app/features/public/notice-of-intent/submission/pofo-details/pofo-details.component.ts
+++ b/portal-frontend/src/app/features/public/notice-of-intent/submission/pofo-details/pofo-details.component.ts
@@ -4,6 +4,7 @@ import { PublicNoticeOfIntentSubmissionDto } from '../../../../../services/publi
 import { PublicDocumentDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
 import { DOCUMENT_TYPE } from '../../../../../shared/dto/document.dto';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-pofo-details[noiSubmission]',
@@ -23,8 +24,10 @@ export class PofoDetailsComponent {
 
   constructor(private router: Router, private publicService: PublicService) {}
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getNoticeOfIntentOpenFileUrl(this.noiSubmission.fileNumber, uuid);
-    window.open(res?.url, '_blank');
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getNoticeOfIntentOpenFileUrl(this.noiSubmission.fileNumber, file.uuid);
+    if (res) {
+      openFileInline(res.url, file.fileName);
+    }
   }
 }
diff --git a/portal-frontend/src/app/features/public/notice-of-intent/submission/roso-details/roso-details.component.html b/portal-frontend/src/app/features/public/notice-of-intent/submission/roso-details/roso-details.component.html
index 1dedd56018..7ff9ffeecd 100644
--- a/portal-frontend/src/app/features/public/notice-of-intent/submission/roso-details/roso-details.component.html
+++ b/portal-frontend/src/app/features/public/notice-of-intent/submission/roso-details/roso-details.component.html
@@ -32,9 +32,7 @@
     <div *ngIf="noiSubmission.soilProjectDuration">
       {{ noiSubmission.soilProjectDuration }}
     </div>
-    <app-no-data
-      *ngIf="!noiSubmission.soilProjectDuration"
-    ></app-no-data>
+    <app-no-data *ngIf="!noiSubmission.soilProjectDuration"></app-no-data>
   </div>
 
   <div class="full-width soil-table">
@@ -59,18 +57,14 @@
     <div>
       {{ noiSubmission.soilToRemoveMaximumDepth }}
       <span *ngIf="noiSubmission.soilToRemoveMaximumDepth !== null">m</span>
-      <app-no-data
-        *ngIf="noiSubmission.soilToRemoveMaximumDepth === null"
-      ></app-no-data>
+      <app-no-data *ngIf="noiSubmission.soilToRemoveMaximumDepth === null"></app-no-data>
     </div>
 
     <div class="subheading2">Average Depth</div>
     <div>
       {{ noiSubmission.soilToRemoveAverageDepth }}
       <span *ngIf="noiSubmission.soilToRemoveAverageDepth !== null">m</span>
-      <app-no-data
-        *ngIf="noiSubmission.soilToRemoveAverageDepth === null"
-      ></app-no-data>
+      <app-no-data *ngIf="noiSubmission.soilToRemoveAverageDepth === null"></app-no-data>
     </div>
 
     <div></div>
@@ -80,42 +74,34 @@
     <div>
       {{ noiSubmission.soilAlreadyRemovedVolume }}
       <span *ngIf="noiSubmission.soilAlreadyRemovedVolume !== null">m<sup>3</sup></span>
-      <app-no-data
-        *ngIf="noiSubmission.soilAlreadyRemovedVolume === null"
-      ></app-no-data>
+      <app-no-data *ngIf="noiSubmission.soilAlreadyRemovedVolume === null"></app-no-data>
     </div>
 
     <div class="subheading2">Area</div>
     <div>
       {{ noiSubmission.soilAlreadyRemovedArea }}
       <span *ngIf="noiSubmission.soilAlreadyRemovedArea !== null">m<sup>2</sup></span>
-      <app-no-data
-        *ngIf="noiSubmission.soilAlreadyRemovedArea === null"
-      ></app-no-data>
+      <app-no-data *ngIf="noiSubmission.soilAlreadyRemovedArea === null"></app-no-data>
     </div>
 
     <div class="subheading2">Maximum Depth</div>
     <div>
       {{ noiSubmission.soilAlreadyRemovedMaximumDepth }}
       <span *ngIf="noiSubmission.soilAlreadyRemovedMaximumDepth !== null">m</span>
-      <app-no-data
-        *ngIf="noiSubmission.soilAlreadyRemovedMaximumDepth === null"
-      ></app-no-data>
+      <app-no-data *ngIf="noiSubmission.soilAlreadyRemovedMaximumDepth === null"></app-no-data>
     </div>
 
     <div class="subheading2">Average Depth</div>
     <div>
       {{ noiSubmission.soilAlreadyRemovedAverageDepth }}
       <span *ngIf="noiSubmission.soilAlreadyRemovedAverageDepth !== null">m</span>
-      <app-no-data
-        *ngIf="noiSubmission.soilAlreadyRemovedAverageDepth === null"
-      ></app-no-data>
+      <app-no-data *ngIf="noiSubmission.soilAlreadyRemovedAverageDepth === null"></app-no-data>
     </div>
   </div>
 
   <div class="subheading2 grid-1">Proposal Map / Site Plan</div>
   <div class="grid-double">
-    <a *ngFor="let map of proposalMap" (click)="openFile(map.uuid)">
+    <a *ngFor="let map of proposalMap" (click)="openFile(map)">
       {{ map.fileName }}
     </a>
     <app-no-data *ngIf="proposalMap.length === 0"></app-no-data>
@@ -132,7 +118,7 @@
   <ng-container *ngIf="noiSubmission?.soilIsExtractionOrMining">
     <div class="subheading2 grid-1">Cross Sections</div>
     <div class="grid-double">
-      <a *ngFor="let file of crossSections" (click)="openFile(file.uuid)">
+      <a *ngFor="let file of crossSections" (click)="openFile(file)">
         {{ file.fileName }}
       </a>
       <app-no-data *ngIf="crossSections.length === 0"></app-no-data>
diff --git a/portal-frontend/src/app/features/public/notice-of-intent/submission/roso-details/roso-details.component.ts b/portal-frontend/src/app/features/public/notice-of-intent/submission/roso-details/roso-details.component.ts
index dbfba33f0b..38c80b0385 100644
--- a/portal-frontend/src/app/features/public/notice-of-intent/submission/roso-details/roso-details.component.ts
+++ b/portal-frontend/src/app/features/public/notice-of-intent/submission/roso-details/roso-details.component.ts
@@ -4,6 +4,7 @@ import { PublicNoticeOfIntentSubmissionDto } from '../../../../../services/publi
 import { PublicDocumentDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
 import { DOCUMENT_TYPE } from '../../../../../shared/dto/document.dto';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-roso-details[noiSubmission]',
@@ -23,8 +24,10 @@ export class RosoDetailsComponent {
 
   constructor(private router: Router, private publicService: PublicService) {}
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getNoticeOfIntentOpenFileUrl(this.noiSubmission.fileNumber, uuid);
-    window.open(res?.url, '_blank');
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getNoticeOfIntentOpenFileUrl(this.noiSubmission.fileNumber, file.uuid);
+    if (res) {
+      openFileInline(res.url, file.fileName);
+    }
   }
 }
diff --git a/portal-frontend/src/app/features/public/notification/alc-review/submission-documents/submission-documents.component.html b/portal-frontend/src/app/features/public/notification/alc-review/submission-documents/submission-documents.component.html
index 50da3b831d..1d674b50c0 100644
--- a/portal-frontend/src/app/features/public/notification/alc-review/submission-documents/submission-documents.component.html
+++ b/portal-frontend/src/app/features/public/notification/alc-review/submission-documents/submission-documents.component.html
@@ -11,7 +11,7 @@ <h4>Notification Documents</h4>
     <ng-container matColumnDef="fileName">
       <th mat-header-cell *matHeaderCellDef mat-sort-header sortActionDescription="Sort by name">Document Name</th>
       <td mat-cell *matCellDef="let element">
-        <a (click)="openFile(element.uuid)">{{ element.fileName }}</a>
+        <a (click)="openFile(element)">{{ element.fileName }}</a>
       </td>
     </ng-container>
 
diff --git a/portal-frontend/src/app/features/public/notification/alc-review/submission-documents/submission-documents.component.ts b/portal-frontend/src/app/features/public/notification/alc-review/submission-documents/submission-documents.component.ts
index 0770fff841..43115f8e63 100644
--- a/portal-frontend/src/app/features/public/notification/alc-review/submission-documents/submission-documents.component.ts
+++ b/portal-frontend/src/app/features/public/notification/alc-review/submission-documents/submission-documents.component.ts
@@ -5,6 +5,7 @@ import { Subject } from 'rxjs';
 import { PublicNotificationSubmissionDto } from '../../../../../services/public/public-notification.dto';
 import { PublicDocumentDto } from '../../../../../services/public/public.dto';
 import { PublicService } from '../../../../../services/public/public.service';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-submission-documents',
@@ -27,10 +28,10 @@ export class PublicSubmissionDocumentsComponent implements OnInit, OnDestroy {
     this.dataSource = new MatTableDataSource(this.documents);
   }
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getNotificationOpenFileUrl(this.submission.fileNumber, uuid);
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getNotificationOpenFileUrl(this.submission.fileNumber, file.uuid);
     if (res) {
-      window.open(res.url, '_blank');
+      openFileInline(res.url, file.fileName);
     }
   }
 
diff --git a/portal-frontend/src/app/features/public/notification/submission/additional-information/additional-information.component.ts b/portal-frontend/src/app/features/public/notification/submission/additional-information/additional-information.component.ts
index a21f812bd0..7e72ef939c 100644
--- a/portal-frontend/src/app/features/public/notification/submission/additional-information/additional-information.component.ts
+++ b/portal-frontend/src/app/features/public/notification/submission/additional-information/additional-information.component.ts
@@ -8,6 +8,7 @@ import {
   RESIDENTIAL_STRUCTURE_TYPES,
   STRUCTURE_TYPES,
 } from '../../../../notice-of-intents/edit-submission/additional-information/additional-information.component';
+import { openFileInline } from '../../../../../shared/utils/file';
 
 @Component({
   selector: 'app-additional-information',
@@ -70,8 +71,10 @@ export class AdditionalInformationComponent implements OnInit {
     );
   }
 
-  async openFile(uuid: string) {
-    const res = await this.publicService.getNoticeOfIntentOpenFileUrl(this.noiSubmission.fileNumber, uuid);
-    window.open(res?.url, '_blank');
+  async openFile(file: PublicDocumentDto) {
+    const res = await this.publicService.getNoticeOfIntentOpenFileUrl(this.noiSubmission.fileNumber, file.uuid);
+    if (res) {
+      openFileInline(res.url, file.fileName);
+    }
   }
 }
diff --git a/portal-frontend/src/app/services/application-document/application-document.service.ts b/portal-frontend/src/app/services/application-document/application-document.service.ts
index e5dd88c9ae..b7b69eab01 100644
--- a/portal-frontend/src/app/services/application-document/application-document.service.ts
+++ b/portal-frontend/src/app/services/application-document/application-document.service.ts
@@ -51,9 +51,7 @@ export class ApplicationDocumentService {
 
   async openFile(fileUuid: string) {
     try {
-      return await firstValueFrom(
-        this.httpClient.get<{ url: string; fileName: string }>(`${this.serviceUrl}/${fileUuid}/open`)
-      );
+      return await firstValueFrom(this.httpClient.get<{ url: string }>(`${this.serviceUrl}/${fileUuid}/open`));
     } catch (e) {
       console.error(e);
       this.toastService.showErrorToast('Failed to open the document, please try again');
diff --git a/portal-frontend/src/app/services/notice-of-intent-document/notice-of-intent-document.service.ts b/portal-frontend/src/app/services/notice-of-intent-document/notice-of-intent-document.service.ts
index 1860044eb3..40461754d6 100644
--- a/portal-frontend/src/app/services/notice-of-intent-document/notice-of-intent-document.service.ts
+++ b/portal-frontend/src/app/services/notice-of-intent-document/notice-of-intent-document.service.ts
@@ -51,9 +51,7 @@ export class NoticeOfIntentDocumentService {
 
   async openFile(fileUuid: string) {
     try {
-      return await firstValueFrom(
-        this.httpClient.get<{ url: string; fileName: string }>(`${this.serviceUrl}/${fileUuid}/open`)
-      );
+      return await firstValueFrom(this.httpClient.get<{ url: string }>(`${this.serviceUrl}/${fileUuid}/open`));
     } catch (e) {
       console.error(e);
       this.toastService.showErrorToast('Failed to open the document, please try again');
diff --git a/portal-frontend/src/app/services/notification-document/notification-document.service.ts b/portal-frontend/src/app/services/notification-document/notification-document.service.ts
index e94af3b6d5..698ecbae19 100644
--- a/portal-frontend/src/app/services/notification-document/notification-document.service.ts
+++ b/portal-frontend/src/app/services/notification-document/notification-document.service.ts
@@ -51,9 +51,7 @@ export class NotificationDocumentService {
 
   async openFile(fileUuid: string) {
     try {
-      return await firstValueFrom(
-        this.httpClient.get<{ url: string; fileName: string }>(`${this.serviceUrl}/${fileUuid}/open`)
-      );
+      return await firstValueFrom(this.httpClient.get<{ url: string }>(`${this.serviceUrl}/${fileUuid}/open`));
     } catch (e) {
       console.error(e);
       this.toastService.showErrorToast('Failed to open the document, please try again');
diff --git a/portal-frontend/src/app/shared/file-drag-drop/file-drag-drop.component.html b/portal-frontend/src/app/shared/file-drag-drop/file-drag-drop.component.html
index b1e5905ec3..6a2efffad4 100644
--- a/portal-frontend/src/app/shared/file-drag-drop/file-drag-drop.component.html
+++ b/portal-frontend/src/app/shared/file-drag-drop/file-drag-drop.component.html
@@ -7,7 +7,7 @@
         error: !!file.errorMessage && !disabled
       }"
     >
-      <a class="file-name" (click)="fileOpened(file.uuid)">{{ file.fileName }}</a>
+      <a class="file-name" (click)="fileOpened(file)">{{ file.fileName }}</a>
       <div class="file-size-cta-container">
         <div class="file-size">
           <span class="file-size-parentheses">(</span>
diff --git a/portal-frontend/src/app/shared/file-drag-drop/file-drag-drop.component.ts b/portal-frontend/src/app/shared/file-drag-drop/file-drag-drop.component.ts
index b7fc499990..0acc17688c 100644
--- a/portal-frontend/src/app/shared/file-drag-drop/file-drag-drop.component.ts
+++ b/portal-frontend/src/app/shared/file-drag-drop/file-drag-drop.component.ts
@@ -11,7 +11,7 @@ import { FileHandle } from './drag-drop.directive';
 export class FileDragDropComponent implements OnInit {
   @Output() uploadFiles: EventEmitter<FileHandle> = new EventEmitter();
   @Output() deleteFile: EventEmitter<ApplicationDocumentDto> = new EventEmitter();
-  @Output() openFile: EventEmitter<string> = new EventEmitter();
+  @Output() openFile: EventEmitter<ApplicationDocumentDto> = new EventEmitter();
   @Output() beforeFileUploadOpened: EventEmitter<void> = new EventEmitter();
 
   @Input() allowMultiple = false;
@@ -46,8 +46,8 @@ export class FileDragDropComponent implements OnInit {
     this.uploadFiles.emit($event);
   }
 
-  fileOpened(uuid: string) {
-    this.openFile.emit(uuid);
+  fileOpened(file: ApplicationDocumentDto) {
+    this.openFile.emit(file);
   }
 
   onFileUploadClicked() {
diff --git a/portal-frontend/src/app/shared/owner-dialogs/owner-dialog/owner-dialog.component.ts b/portal-frontend/src/app/shared/owner-dialogs/owner-dialog/owner-dialog.component.ts
index ca87800bdc..f4403ac5f7 100644
--- a/portal-frontend/src/app/shared/owner-dialogs/owner-dialog/owner-dialog.component.ts
+++ b/portal-frontend/src/app/shared/owner-dialogs/owner-dialog/owner-dialog.component.ts
@@ -19,6 +19,7 @@ import { ConfirmationDialogService } from '../../confirmation-dialog/confirmatio
 import { DOCUMENT_SOURCE, DOCUMENT_TYPE, DocumentTypeDto } from '../../dto/document.dto';
 import { OWNER_TYPE } from '../../dto/owner.dto';
 import { FileHandle } from '../../file-drag-drop/drag-drop.directive';
+import { openFileInline } from '../../utils/file';
 
 @Component({
   selector: 'app-owner-dialog',
@@ -240,11 +241,11 @@ export class OwnerDialogComponent {
   async openCorporateSummary() {
     if (this.pendingFile) {
       const fileURL = URL.createObjectURL(this.pendingFile);
-      window.open(fileURL, '_blank');
+      openFileInline(fileURL, this.pendingFile.name);
     } else if (this.existingUuid && this.data.existingOwner?.corporateSummary?.uuid) {
       const res = await this.data.documentService.openFile(this.data.existingOwner?.corporateSummary?.uuid);
       if (res) {
-        window.open(res.url, '_blank');
+        openFileInline(res.url, this.data.existingOwner?.corporateSummary?.fileName);
       }
     }
   }
diff --git a/portal-frontend/src/app/shared/owner-dialogs/parcel-owners/parcel-owners.component.html b/portal-frontend/src/app/shared/owner-dialogs/parcel-owners/parcel-owners.component.html
index cbe7737996..5efc61f9de 100644
--- a/portal-frontend/src/app/shared/owner-dialogs/parcel-owners/parcel-owners.component.html
+++ b/portal-frontend/src/app/shared/owner-dialogs/parcel-owners/parcel-owners.component.html
@@ -38,7 +38,7 @@
       <th mat-header-cell *matHeaderCellDef>Corporate Summary</th>
       <td mat-cell *matCellDef="let element">
         <div *ngIf="element.ownershipTypeCode !== PARCEL_OWNERSHIP_TYPES.CROWN">
-          <a *ngIf="element.corporateSummary" (click)="onOpenFile(element.corporateSummary.uuid)">{{
+          <a *ngIf="element.corporateSummary" (click)="onOpenFile(element.corporateSummary)">{{
             element.corporateSummary.fileName
           }}</a>
           <div class="no-data" *ngIf="!element.corporateSummary">
diff --git a/portal-frontend/src/app/shared/owner-dialogs/parcel-owners/parcel-owners.component.ts b/portal-frontend/src/app/shared/owner-dialogs/parcel-owners/parcel-owners.component.ts
index bddf22ec3c..1b00395ede 100644
--- a/portal-frontend/src/app/shared/owner-dialogs/parcel-owners/parcel-owners.component.ts
+++ b/portal-frontend/src/app/shared/owner-dialogs/parcel-owners/parcel-owners.component.ts
@@ -11,7 +11,9 @@ import { NoticeOfIntentOwnerService } from '../../../services/notice-of-intent-o
 import { OWNER_TYPE } from '../../dto/owner.dto';
 import { CrownOwnerDialogComponent } from '../crown-owner-dialog/crown-owner-dialog.component';
 import { OwnerDialogComponent } from '../owner-dialog/owner-dialog.component';
-import { openFileIframe } from '../../utils/file';
+import { openFileInline } from '../../utils/file';
+import { ApplicationDocumentDto } from '../../../services/application-document/application-document.dto';
+import { NoticeOfIntentDocumentDto } from '../../../services/notice-of-intent-document/notice-of-intent-document.dto';
 
 @Component({
   selector: 'app-parcel-owners[owners][fileId][submissionUuid][ownerService]',
@@ -105,10 +107,10 @@ export class ParcelOwnersComponent {
     this.onOwnerRemoved.emit(uuid);
   }
 
-  async onOpenFile(uuid: string) {
-    const res = await this.documentService.openFile(uuid);
+  async onOpenFile(file: ApplicationDocumentDto | NoticeOfIntentDocumentDto) {
+    const res = await this.documentService.openFile(file.uuid);
     if (res) {
-      openFileIframe(res);
+      openFileInline(res.url, file.fileName);
     }
   }
 }
diff --git a/portal-frontend/src/app/shared/utils/file.ts b/portal-frontend/src/app/shared/utils/file.ts
index 5aaee70e01..8b2def5875 100644
--- a/portal-frontend/src/app/shared/utils/file.ts
+++ b/portal-frontend/src/app/shared/utils/file.ts
@@ -12,19 +12,19 @@ export const openPdfFile = (fileName: string, data: any) => {
   downloadLink.click();
 };
 
-export const openFileIframe = (data: { url: string; fileName: string }) => {
+export const openFileInline = (url: string, fileName: string) => {
   const newWindow = window.open('', '_blank');
   if (newWindow) {
-    newWindow.document.title = data.fileName;
+    newWindow.document.title = fileName;
 
     const object = newWindow.document.createElement('object');
-    object.data = data.url;
+    object.data = url;
     object.style.borderWidth = '0';
     object.style.width = '100%';
     object.style.height = '100%';
 
     newWindow.document.body.appendChild(object);
-    newWindow.document.body.style.backgroundColor = 'rgb(82, 86, 89)';
+    newWindow.document.body.style.backgroundColor = 'rgb(14, 14, 14)';
     newWindow.document.body.style.height = '100%';
     newWindow.document.body.style.width = '100%';
     newWindow.document.body.style.margin = '0';
diff --git a/services/apps/alcs/src/portal/application-document/application-document.controller.spec.ts b/services/apps/alcs/src/portal/application-document/application-document.controller.spec.ts
index 420e84cfda..6d7cefb4d9 100644
--- a/services/apps/alcs/src/portal/application-document/application-document.controller.spec.ts
+++ b/services/apps/alcs/src/portal/application-document/application-document.controller.spec.ts
@@ -138,7 +138,6 @@ describe('ApplicationDocumentController', () => {
 
     expect(appDocumentService.getInlineUrl).toHaveBeenCalledTimes(1);
     expect(res.url).toEqual(fakeUrl);
-    expect(res.fileName).toEqual(mockDocument.document.fileName);
   });
 
   it('should call through for download', async () => {
diff --git a/services/apps/alcs/src/portal/application-document/application-document.controller.ts b/services/apps/alcs/src/portal/application-document/application-document.controller.ts
index 821fde6f82..09394a6491 100644
--- a/services/apps/alcs/src/portal/application-document/application-document.controller.ts
+++ b/services/apps/alcs/src/portal/application-document/application-document.controller.ts
@@ -75,8 +75,7 @@ export class ApplicationDocumentController {
 
     if (canAccessDocument) {
       const url = await this.applicationDocumentService.getInlineUrl(document);
-      const { fileName } = document.document;
-      return { url, fileName };
+      return { url };
     }
 
     throw new NotFoundException('Failed to find document');
diff --git a/services/apps/alcs/src/portal/notice-of-intent-document/notice-of-intent-document.controller.spec.ts b/services/apps/alcs/src/portal/notice-of-intent-document/notice-of-intent-document.controller.spec.ts
index 73c73b9c39..b38071e642 100644
--- a/services/apps/alcs/src/portal/notice-of-intent-document/notice-of-intent-document.controller.spec.ts
+++ b/services/apps/alcs/src/portal/notice-of-intent-document/notice-of-intent-document.controller.spec.ts
@@ -122,7 +122,6 @@ describe('NoticeOfIntentDocumentController', () => {
 
     expect(noiDocumentService.getInlineUrl).toHaveBeenCalledTimes(1);
     expect(res.url).toEqual(fakeUrl);
-    expect(res.fileName).toEqual(mockDocument.document.fileName);
   });
 
   it('should call through for download', async () => {
diff --git a/services/apps/alcs/src/portal/notice-of-intent-document/notice-of-intent-document.controller.ts b/services/apps/alcs/src/portal/notice-of-intent-document/notice-of-intent-document.controller.ts
index 5ccfe49ff8..4c287b96a2 100644
--- a/services/apps/alcs/src/portal/notice-of-intent-document/notice-of-intent-document.controller.ts
+++ b/services/apps/alcs/src/portal/notice-of-intent-document/notice-of-intent-document.controller.ts
@@ -80,8 +80,7 @@ export class NoticeOfIntentDocumentController {
     if (canAccessDocument) {
       const url =
         await this.noticeOfIntentDocumentService.getInlineUrl(document);
-      const { fileName } = document.document;
-      return { url, fileName };
+      return { url };
     }
 
     throw new NotFoundException('Failed to find document');
diff --git a/services/apps/alcs/src/portal/notification-document/notification-document.controller.spec.ts b/services/apps/alcs/src/portal/notification-document/notification-document.controller.spec.ts
index 88891e0ae8..594e79a2d2 100644
--- a/services/apps/alcs/src/portal/notification-document/notification-document.controller.spec.ts
+++ b/services/apps/alcs/src/portal/notification-document/notification-document.controller.spec.ts
@@ -140,7 +140,6 @@ describe('NotificationDocumentController', () => {
       1,
     );
     expect(res.url).toEqual(fakeUrl);
-    expect(res.fileName).toEqual(mockDocument.document.fileName);
   });
 
   it('should call through for download', async () => {
diff --git a/services/apps/alcs/src/portal/notification-document/notification-document.controller.ts b/services/apps/alcs/src/portal/notification-document/notification-document.controller.ts
index 555cde8cd6..54c990bb0a 100644
--- a/services/apps/alcs/src/portal/notification-document/notification-document.controller.ts
+++ b/services/apps/alcs/src/portal/notification-document/notification-document.controller.ts
@@ -78,8 +78,7 @@ export class NotificationDocumentController {
 
     if (canAccessDocument) {
       const url = await this.notificationDocumentService.getInlineUrl(document);
-      const { fileName } = document.document;
-      return { url, fileName };
+      return { url };
     }
 
     throw new NotFoundException('Failed to find document');
diff --git a/services/apps/alcs/src/portal/public/application/public-application.service.ts b/services/apps/alcs/src/portal/public/application/public-application.service.ts
index de67bbbdee..c12b5f003e 100644
--- a/services/apps/alcs/src/portal/public/application/public-application.service.ts
+++ b/services/apps/alcs/src/portal/public/application/public-application.service.ts
@@ -153,8 +153,6 @@ export class PublicApplicationService {
 
     const url = await this.applicationDocumentService.getInlineUrl(document);
 
-    return {
-      url,
-    };
+    return { url };
   }
 }
diff --git a/services/apps/alcs/src/portal/public/notice-of-intent/public-notice-of-intent.service.ts b/services/apps/alcs/src/portal/public/notice-of-intent/public-notice-of-intent.service.ts
index 46538b48d5..8a060b31b9 100644
--- a/services/apps/alcs/src/portal/public/notice-of-intent/public-notice-of-intent.service.ts
+++ b/services/apps/alcs/src/portal/public/notice-of-intent/public-notice-of-intent.service.ts
@@ -114,8 +114,6 @@ export class PublicNoticeOfIntentService {
 
     const url = await this.noticeOfIntentDocumentService.getInlineUrl(document);
 
-    return {
-      url,
-    };
+    return { url };
   }
 }
diff --git a/services/apps/alcs/src/portal/public/notification/public-notification.service.ts b/services/apps/alcs/src/portal/public/notification/public-notification.service.ts
index a7a9e1a119..0b8b742fcd 100644
--- a/services/apps/alcs/src/portal/public/notification/public-notification.service.ts
+++ b/services/apps/alcs/src/portal/public/notification/public-notification.service.ts
@@ -99,8 +99,6 @@ export class PublicNotificationService {
 
     const url = await this.notificationDocumentService.getInlineUrl(document);
 
-    return {
-      url,
-    };
+    return { url };
   }
 }