AW-7266 NG0956: The configured tracking expression (track by identity) caused re-creation of the entire collection

projects/common-map/src/fm-map/components/aol/layer-list/layer-list.component.html

@@ -2,7 +2,7 @@
   @if (itemLayers.length > 0) {
     <div class="layerlist">
       <div class="list-group">
-        @for (itemLayer of itemLayers; track itemLayer) {
+        @for (itemLayer of itemLayers; track itemLayer.item.code) {
           <div class="list-group-item list-group-item-action p-2 text-truncate" [ngClass]="{'active' : selectedLayer==itemLayer}">
             <div (click)="handleSelectLayer($event,itemLayer)"  [title]="itemLayer.item.name">{{itemLayer.item.name}}</div>
             @if (selectedLayer==itemLayer && !baseLayers) {

projects/common-map/src/fm-map/components/aol/layer-values/layer-values.component.html

@@ -7,7 +7,7 @@
           <div class="lonlat pb-2 "><span class="font-weight-bold">{{lonlat$}}</span><i class="ms-2 fal fa-copy" (click)="copyToClipboard()"></i> </div>
           @if (layers.length>0 ) {
             <ul class="value-list p-0 mb-0">
-              @for (layerValue of layers; track layerValue) {
+              @for (layerValue of layers; track $index) {
                 <li class="border-top pt-1 pb-1 value">
                   <div>{{layerValue.layerName}}</div>
                   <div>{{layerValue.date|date}}</div>

projects/common-map/src/fm-map/components/feature-list-cropfield/feature-list-cropfield.component.html

@@ -7,7 +7,7 @@
       @if (features; as features) {
         <div>
           <div class="cropfields">
-            @for (feature of features; track feature) {
+            @for (feature of features; track $index) {
               <div class="row m-0 ps-3 pe-3" [ngClass]="{'selected':isFeatureSelected(feature)}" (click)="handleFeatureClick(feature)" (mouseenter)="handleFeatureMouseEnter(feature)" (mouseleave)="handleFeatureMouseLeave(feature)">
                 <fm-map-feature-list-feature-container [feature]="feature"></fm-map-feature-list-feature-container>
               </div>

projects/common-map/src/fm-map/components/feature-list-croppingscheme/feature-list-croppingscheme.component.html

@@ -5,7 +5,7 @@
     @if (features; as features) {
       <div>
         <div class="farms">
-          @for (feature of features; track feature) {
+          @for (feature of features; track $index) {
             <div class="row m-0 ps-3 pe-3"[ngClass]="{'selected':isFeatureSelected(feature)}" (click)="handleFeatureClick(feature)" (mouseenter)="handleFeatureMouseEnter(feature)" (mouseleave)="handleFeatureMouseLeave(feature)">
               <fm-map-feature-list-feature-container [feature]="feature"></fm-map-feature-list-feature-container>
             </div>

projects/common-map/src/fm-map/components/feature-list-observation/feature-list-observation.component.html

@@ -7,7 +7,7 @@
       @if (features; as features) {
         <div>
           <div class="cropfields">
-            @for (feature of features; track feature) {
+            @for (feature of features; track $index) {
               <div class="row m-0 ps-3 pe-3" [ngClass]="{'selected':isFeatureSelected(feature)}" (click)="handleFeatureClick(feature)" (mouseenter)="handleFeatureMouseEnter(feature)" (mouseleave)="handleFeatureMouseLeave(feature)">
                 <fm-map-feature-list-feature-container [feature]="feature"></fm-map-feature-list-feature-container>
               </div>

projects/common-map/src/fm-map/components/feature-list/feature-list.component.html

@@ -1,7 +1,7 @@
 @if (features; as features) {
   <div>
     <fm-back-button></fm-back-button>
-    @for (feature of features; track feature) {
+    @for (feature of features; track $index) {
       <div class="row m-0 ps-3 pe-3" [ngClass]="{'selected':isFeatureSelected(feature)}" (click)="handleFeatureClick(feature)" (mouseenter)="handleFeatureMouseEnter(feature)" (mouseleave)="handleFeatureMouseLeave(feature)">
         <fm-map-feature-list-feature-container [feature]="feature"></fm-map-feature-list-feature-container>
       </div>

projects/common-map/src/fm-map/components/item-list/item-list.component.html

@@ -1,6 +1,6 @@
 @if (items; as items) {
   <div class="widget-container pt-0">
-    @for (item of items; track item) {
+    @for (item of items; track item.code) {
       <div class="widget" (click)="handleItemClick(item)">
         <div class="content">
           <fm-map-item-list-item-container [item]="item" class="item-container"></fm-map-item-list-item-container>

projects/common-map/src/fm-map/components/item-widget-list/item-widget-list.component.html

@@ -1,6 +1,6 @@
 @if (widgets; as widgets) {
   <div class="widget-container pt-0">
-    @for (widget of widgets; track widget) {
+    @for (widget of widgets; track widget.item.code) {
       <div class="widget">
         <div class="content">
           <ng-template #widgetTemplate></ng-template>

projects/common-map/src/fm-map/components/legend/legend.component.html

@@ -25,7 +25,7 @@
         }
       </td>
     </tr>
-    @for (entry of layer.renderer.colorMap.entries; track entry; let i = $index) {
+    @for (entry of layer.renderer.colorMap.entries; track $index; let i = $index) {
       <tr>
         <td class="legend-items"><span [style.background-color]="getAlphaHex(entry.color)" [style.border-color]="getHex(entry.color)"class="color"></span></td>
         <td class="legend-items-text">@if (!entry.label) {

projects/common-map/src/fm-map/components/selected-item-geotiff/selected-item-geotiff.component.html

@@ -16,7 +16,7 @@
               @if (layers.length>1) {
                 <div>
                   <select (change)="onLayerChanged($event.target.value)">
-                    @for (l of layers; track l) {
+                    @for (l of layers; track l.index) {
                       <option [value]="l.index"  [selected]="itemLayer.layerIndex == l.index">{{l.name}}</option>
                     }
                   </select>

projects/common-map/src/fm-map/components/selected-item-shape/selected-item-shape.component.html

@@ -16,7 +16,7 @@
               @if (layers.length>1) {
                 <div>
                   <select (change)="onLayerChanged($event.target.value)">
-                    @for (l of layers; track l) {
+                    @for (l of layers; track l.index) {
                       <option [value]="l.index" [selected]="itemLayer.layerIndex == l.index">{{l.name}}</option>
                     }
                   </select>

projects/common-map/src/fm-map/components/selected-item-temporal/selected-item-temporal.component.html

@@ -36,7 +36,7 @@
               @if (layers.length>1) {
                 <div>
                   <select (change)="onLayerChanged($event.target.value)">
-                    @for (l of layers; track l) {
+                    @for (l of layers; track l.index) {
                       <option [value]="l.index"  [selected]="itemLayer.layerIndex == l.index">{{l.name}}</option>
                     }
                   </select>

projects/common/src/fm/components/gradient-select/gradient-select.component.html

@@ -11,7 +11,7 @@
     <div class="gradient-list" [ngClass]="{'visible':listVisible}">
       @if (gradientItems) {
         <ul>
-          @for (item of gradientItems; track item) {
+          @for (item of gradientItems; track item.code) {
             <li (click)="handleSelect(item)" [ngClass]="{'bg-primary':isSelected(item),'text-white':isSelected(item)} ">
               <div>{{item?.name}}</div>
               <div><fm-gradient [gradientItem]="item"></fm-gradient></div>

projects/common/src/fm/components/resumable-file-upload/resumable-file-upload.component.html

@@ -13,7 +13,7 @@
       <div [ngClass]="{'minimized': uploadService.isMinimized }">
         <div class="card-block p-3">
           <ul class="list-unstyled">
-            @for (file of uploadService.files; track file) {
+            @for (file of uploadService.files; track $index) {
               <li class="upload-file busy" [ngClass]="{'done': file.success,'busy':file.success == false,'error': file.error }">
                 @if (file.success == false) {
                   <div><span class="file-name" [attr.title]="file?.fileName">{{file.fileName}}</span><span class="fal fa-times" title="Cancel" (click)="uploadService.cancelFile(file)"></span><span class="fal fa-check"></span></div>

projects/common/src/fm/components/tag-input/tag-input.component.html

@@ -1,5 +1,5 @@
 <div class="tags">
-  @for (tag of tags; track tag) {
+  @for (tag of tags; track $index) {
     <span class="tag rounded bg-primary text-white"><span>{{tag}}</span> <i
   (click)="handleDeleteTag(tag)" class="fal fa-times" aria-hidden="true"></i></span>
   }<input