diff --git a/src/app/child-dev-project/attendance/add-day-attendance/roll-call-setup/roll-call-setup.component.ts b/src/app/child-dev-project/attendance/add-day-attendance/roll-call-setup/roll-call-setup.component.ts
index 587bb96f18..91715bb309 100644
--- a/src/app/child-dev-project/attendance/add-day-attendance/roll-call-setup/roll-call-setup.component.ts
+++ b/src/app/child-dev-project/attendance/add-day-attendance/roll-call-setup/roll-call-setup.component.ts
@@ -9,7 +9,6 @@ import { AttendanceService } from "../../attendance.service";
 import { Note } from "../../../notes/model/note";
 import { EntityMapperService } from "../../../../core/entity/entity-mapper/entity-mapper.service";
 import { RecurringActivity } from "../../model/recurring-activity";
-import { NoteDetailsComponent } from "../../../notes/note-details/note-details.component";
 import { FormDialogService } from "../../../../core/form-dialog/form-dialog.service";
 import { AlertService } from "../../../../core/alerts/alert.service";
 import { AlertDisplay } from "../../../../core/alerts/alert-display";
@@ -197,7 +196,7 @@ export class RollCallSetupComponent implements OnInit {
     }
 
     this.formDialog
-      .openFormPopup(newNote, [], NoteDetailsComponent)
+      .openView(newNote, "NoteDetails")
       .afterClosed()
       .subscribe((createdNote: Note) => {
         if (createdNote) {
diff --git a/src/app/child-dev-project/attendance/add-day-attendance/roll-call/roll-call.component.ts b/src/app/child-dev-project/attendance/add-day-attendance/roll-call/roll-call.component.ts
index 9d295c5eb2..aef7c9428e 100644
--- a/src/app/child-dev-project/attendance/add-day-attendance/roll-call/roll-call.component.ts
+++ b/src/app/child-dev-project/attendance/add-day-attendance/roll-call/roll-call.component.ts
@@ -18,7 +18,6 @@ import { EntityMapperService } from "../../../../core/entity/entity-mapper/entit
 import { Child } from "../../../children/model/child";
 import { LoggingService } from "../../../../core/logging/logging.service";
 import { sortByAttribute } from "../../../../utils/utils";
-import { NoteDetailsComponent } from "../../../notes/note-details/note-details.component";
 import { FormDialogService } from "../../../../core/form-dialog/form-dialog.service";
 import { NgClass, NgForOf, NgIf } from "@angular/common";
 import { MatProgressBarModule } from "@angular/material/progress-bar";
@@ -263,7 +262,7 @@ export class RollCallComponent implements OnChanges {
   }
 
   showDetails() {
-    this.formDialog.openFormPopup(this.eventEntity, [], NoteDetailsComponent);
+    this.formDialog.openView(this.eventEntity, "NoteDetails");
   }
 
   async includeInactive() {
diff --git a/src/app/child-dev-project/attendance/attendance-calendar/attendance-calendar.component.ts b/src/app/child-dev-project/attendance/attendance-calendar/attendance-calendar.component.ts
index d4082dd081..e1067e4a1b 100644
--- a/src/app/child-dev-project/attendance/attendance-calendar/attendance-calendar.component.ts
+++ b/src/app/child-dev-project/attendance/attendance-calendar/attendance-calendar.component.ts
@@ -16,7 +16,6 @@ import moment, { Moment } from "moment";
 import { EventAttendance } from "../model/event-attendance";
 import { EntityMapperService } from "../../../core/entity/entity-mapper/entity-mapper.service";
 import { FormDialogService } from "../../../core/form-dialog/form-dialog.service";
-import { NoteDetailsComponent } from "../../notes/note-details/note-details.component";
 import {
   AverageAttendanceStats,
   calculateAverageAttendance,
@@ -217,6 +216,6 @@ export class AttendanceCalendarComponent implements OnChanges {
   }
 
   showEventDetails(selectedEvent: Note) {
-    this.formDialog.openFormPopup(selectedEvent, [], NoteDetailsComponent);
+    this.formDialog.openView(selectedEvent, "NoteDetails");
   }
 }
diff --git a/src/app/child-dev-project/attendance/attendance-details/attendance-details.component.ts b/src/app/child-dev-project/attendance/attendance-details/attendance-details.component.ts
index ac5950ac1a..97845a1ff7 100644
--- a/src/app/child-dev-project/attendance/attendance-details/attendance-details.component.ts
+++ b/src/app/child-dev-project/attendance/attendance-details/attendance-details.component.ts
@@ -1,6 +1,5 @@
 import { Component, Inject, Input } from "@angular/core";
 import { ActivityAttendance } from "../model/activity-attendance";
-import { NoteDetailsComponent } from "../../notes/note-details/note-details.component";
 import { Note } from "../../notes/model/note";
 import { calculateAverageAttendance } from "../model/calculate-average-event-attendance";
 import { FormFieldConfig } from "../../../core/common-components/entity-form/FormConfig";
@@ -68,6 +67,6 @@ export class AttendanceDetailsComponent {
   }
 
   showEventDetails(event: EventNote) {
-    this.formDialog.openFormPopup(event, [], NoteDetailsComponent);
+    this.formDialog.openView(event, "NoteDetails");
   }
 }
diff --git a/src/app/child-dev-project/notes/dashboard-widgets/important-notes-dashboard/important-notes-dashboard.component.ts b/src/app/child-dev-project/notes/dashboard-widgets/important-notes-dashboard/important-notes-dashboard.component.ts
index 0aaf1d6c1b..54ad4370ea 100644
--- a/src/app/child-dev-project/notes/dashboard-widgets/important-notes-dashboard/important-notes-dashboard.component.ts
+++ b/src/app/child-dev-project/notes/dashboard-widgets/important-notes-dashboard/important-notes-dashboard.component.ts
@@ -2,7 +2,6 @@ import { Component, Input } from "@angular/core";
 import { Note } from "../../model/note";
 import { DynamicComponent } from "../../../../core/config/dynamic-components/dynamic-component.decorator";
 import { FormDialogService } from "../../../../core/form-dialog/form-dialog.service";
-import { NoteDetailsComponent } from "../../note-details/note-details.component";
 import { DashboardListWidgetComponent } from "../../../../core/dashboard/dashboard-list-widget/dashboard-list-widget.component";
 import { MatTableModule } from "@angular/material/table";
 import { DatePipe, NgStyle } from "@angular/common";
@@ -37,6 +36,6 @@ export class ImportantNotesDashboardComponent extends DashboardWidget {
   }
 
   openNote(note: Note) {
-    this.formDialog.openFormPopup(note, [], NoteDetailsComponent);
+    this.formDialog.openView(note, "NoteDetails");
   }
 }
diff --git a/src/app/child-dev-project/notes/notes-related-to-entity/notes-related-to-entity.component.ts b/src/app/child-dev-project/notes/notes-related-to-entity/notes-related-to-entity.component.ts
index 854d2fee0e..f7b0dc6d19 100644
--- a/src/app/child-dev-project/notes/notes-related-to-entity/notes-related-to-entity.component.ts
+++ b/src/app/child-dev-project/notes/notes-related-to-entity/notes-related-to-entity.component.ts
@@ -1,6 +1,5 @@
 import { Component } from "@angular/core";
 import { Note } from "../model/note";
-import { NoteDetailsComponent } from "../note-details/note-details.component";
 import { ChildrenService } from "../../children/children.service";
 import { FormDialogService } from "../../../core/form-dialog/form-dialog.service";
 import { DynamicComponent } from "../../../core/config/dynamic-components/dynamic-component.decorator";
@@ -129,6 +128,6 @@ export class NotesRelatedToEntityComponent extends RelatedEntitiesComponent<Note
   }
 
   showNoteDetails(note: Note) {
-    this.formDialog.openFormPopup(note, [], NoteDetailsComponent);
+    this.formDialog.openView(note, "NoteDetails");
   }
 }