diff --git a/frontend/src/app/projects/project-detail/model-overview/reorder-models/reorder-models.component.html b/frontend/src/app/projects/project-detail/model-overview/reorder-models/reorder-models.component.html
index 8bab5fd39c..77966a3ef6 100644
--- a/frontend/src/app/projects/project-detail/model-overview/reorder-models/reorder-models.component.html
+++ b/frontend/src/app/projects/project-detail/model-overview/reorder-models/reorder-models.component.html
@@ -19,7 +19,7 @@ <h2>Reorder models</h2>
   >
     <div
       cdkDrag
-      *ngFor="let model of models"
+      *ngFor="let model of data.models"
       class="flex items-center border-b border-solid"
     >
       <span class="ml-[10px]"
@@ -34,12 +34,7 @@ <h2>Reorder models</h2>
   </div>
 
   <div class="flex justify-end">
-    <button
-      mat-flat-button
-      color="primary"
-      (click)="reorderModels(models, project)"
-      class=""
-    >
+    <button mat-flat-button color="primary" (click)="reorderModels()" class="">
       Save order
     </button>
   </div>
diff --git a/frontend/src/app/projects/project-detail/model-overview/reorder-models/reorder-models.component.ts b/frontend/src/app/projects/project-detail/model-overview/reorder-models/reorder-models.component.ts
index d8b7a632a3..f0fee271a8 100644
--- a/frontend/src/app/projects/project-detail/model-overview/reorder-models/reorder-models.component.ts
+++ b/frontend/src/app/projects/project-detail/model-overview/reorder-models/reorder-models.component.ts
@@ -11,46 +11,26 @@ import {
   Model,
   ModelService,
 } from 'src/app/projects/models/service/model.service';
-import {
-  Project,
-  ProjectService,
-} from 'src/app/projects/service/project.service';
+import {} from 'src/app/projects/service/project.service';
 @Component({
   selector: 'app-reorder-models',
   templateUrl: './reorder-models.component.html',
 })
 export class ReorderModelsComponent {
-  models?: Model[];
-  project?: Project;
-
   constructor(
     public modelService: ModelService,
     private dialogRef: MatDialogRef<ReorderModelsComponent>,
     private toastService: ToastService,
-    public projectService: ProjectService,
     @Inject(MAT_DIALOG_DATA)
     public data: { projectSlug: string; models: Model[] },
-  ) {
-    this.projectService.loadProjectsForRole('manager');
-    this.models = data.models;
-    this.projectService.project$.subscribe((project) => {
-      this.project = project;
-    });
-  }
+  ) {}
 
   drop(event: CdkDragDrop<Model[]>): void {
-    if (!this.models) {
-      return;
-    }
-    moveItemInArray(this.models, event.previousIndex, event.currentIndex);
+    moveItemInArray(this.data.models, event.previousIndex, event.currentIndex);
   }
 
-  async reorderModels(models?: Model[], project?: Project) {
-    if (models === undefined || project === undefined) {
-      return;
-    }
-
-    const modelsToPatch = models.map((model, index) => {
+  async reorderModels() {
+    const modelsToPatch = this.data.models.map((model, index) => {
       return {
         modelSlug: model.slug,
         patchModel: { display_order: index + 1 },
@@ -58,11 +38,11 @@ export class ReorderModelsComponent {
     });
 
     this.modelService
-      .updateModels(project.slug, modelsToPatch)
+      .updateModels(this.data.projectSlug, modelsToPatch)
       .subscribe(() => {
         this.toastService.showSuccess(
           `Model order updated`,
-          `Successfully reordered models in project ${project.slug}`,
+          `Successfully reordered models in project ${this.data.projectSlug}`,
         );
         this.dialogRef.close();
       });