From f452815839f7e21c8b05f54e06562f5c924edbe8 Mon Sep 17 00:00:00 2001
From: romeonicholas <nicholas.romeo@code.berlin>
Date: Wed, 29 Nov 2023 11:09:21 +0100
Subject: [PATCH] fix: Update for loop of models to Angular 17 format

---
 .../reorder-models-dialog.component.html      | 26 +++++++++----------
 1 file changed, 12 insertions(+), 14 deletions(-)

diff --git a/frontend/src/app/projects/project-detail/model-overview/reorder-models-dialog/reorder-models-dialog.component.html b/frontend/src/app/projects/project-detail/model-overview/reorder-models-dialog/reorder-models-dialog.component.html
index 77966a3ef6..5612eab6bb 100644
--- a/frontend/src/app/projects/project-detail/model-overview/reorder-models-dialog/reorder-models-dialog.component.html
+++ b/frontend/src/app/projects/project-detail/model-overview/reorder-models-dialog/reorder-models-dialog.component.html
@@ -17,20 +17,18 @@ <h2>Reorder models</h2>
     (cdkDropListDropped)="drop($event)"
     class="my-[15px] rounded border border-solid"
   >
-    <div
-      cdkDrag
-      *ngFor="let model of data.models"
-      class="flex items-center border-b border-solid"
-    >
-      <span class="ml-[10px]"
-        ><mat-icon class="mt-[10px] text-sm">reorder</mat-icon></span
-      >
-      <span class="mr-[10px] truncate"
-        ><span>{{ model.name }} ({{ model.tool.name }}</span>
-        <span *ngIf="model.version"> - {{ model.version.name }}</span>
-        <span>)</span></span
-      >
-    </div>
+    @for (model of data.models; track model.name) {
+      <div cdkDrag class="flex items-center border-b border-solid">
+        <span class="ml-[10px]"
+          ><mat-icon class="mt-[10px] text-sm">reorder</mat-icon></span
+        >
+        <span class="mr-[10px] truncate"
+          ><span>{{ model.name }} ({{ model.tool.name }}</span>
+          <span *ngIf="model.version"> - {{ model.version.name }}</span>
+          <span>)</span></span
+        >
+      </div>
+    }
   </div>
 
   <div class="flex justify-end">