Change to new control flow syntax

jhipster · Nov 21, 2023 · 591e14c · 591e14c
1 parent 3ab46d0
commit 591e14c
Show file tree

Hide file tree

Showing 6 changed files with 82 additions and 30 deletions.
diff --git a/generators/app/__snapshots__/generator.spec.mjs.snap b/generators/app/__snapshots__/generator.spec.mjs.snap
@@ -488,7 +488,7 @@ exports[`SubGenerator app of ionic JHipster blueprint > run > should succeed 1`]
   ".husky/pre-commit": {
     "stateCleared": "modified",
   },
-  ".lintstagedrc.cjs": {
+  ".lintstagedrc.js": {
     "stateCleared": "modified",
   },
   ".prettierignore": {
@@ -1000,7 +1000,7 @@ exports[`SubGenerator app of ionic JHipster blueprint > with custom ionic path >
   ".husky/pre-commit": {
     "stateCleared": "modified",
   },
-  ".lintstagedrc.cjs": {
+  ".lintstagedrc.js": {
     "stateCleared": "modified",
   },
   ".prettierignore": {

diff --git a/generators/ionic/resources/base/src/app/pages/entities/entities.page.html b/generators/ionic/resources/base/src/app/pages/entities/entities.page.html
@@ -6,10 +6,14 @@
 
 <ion-content class="ion-padding">
   <ion-list>
-    <ion-item *ngFor="let entity of entities" (click)="openPage(entity)">
+  @for (let entity of entities) {
+    <ion-item (click)="openPage(entity)">
       <h2>{{entity.name}}</h2>
     </ion-item>
+  }
   </ion-list>
 
-  <div *ngIf="entities.length === 0">{{ 'EMPTY_ENTITIES_MESSAGE' | translate }}</div>
+@if (entities.length === 0) {
+  <div>{{ 'EMPTY_ENTITIES_MESSAGE' | translate }}</div>
+}
 </ion-content>
diff --git a/generators/ionic/templates/src/app/pages/entities/_entity-detail.html.ejs b/generators/ionic/templates/src/app/pages/entities/_entity-detail.html.ejs
@@ -38,21 +38,25 @@
                 <%_ if (fields[idx].fieldIsEnum) { _%>
                 <span id="<%= fieldName %>-content">{{<%= entityInstance %>.<%= fieldName %>}}</span>
                 <%_ } else if (['byte[]', 'ByteBuffer'].includes(fieldType) && fieldTypeBlobContent === 'image') { _%>
-                <div id="<%= fieldName %>-content" *ngIf="<%= entityInstance %>.<%= fieldName %>">
+            @if (<%= entityInstance %>.<%= fieldName %>) {
+                <div id="<%= fieldName %>-content">
                     <a (click)="openFile(<%= entityInstance %>.<%= fieldName %>ContentType, <%= entityInstance %>.<%= fieldName %>)">
                         <img [src]="'data:' + <%=entityInstance %>.<%= fieldName %>ContentType + ';base64,' + <%= entityInstance %>.<%= fieldName %>" style="max-width: 100%;" alt="<%=entityInstance %> image"/>
                     </a>
                     {{<%= entityInstance %>.<%= fieldName %>ContentType}}, {{byteSize(<%= entityInstance %>.<%= fieldName %>)}}
                 </div>
+            }
                 <%_ } else if (['Instant', 'ZonedDateTime'].includes(fieldType)) { _%>
                 <span id="<%= fieldName %>-content">{{<%=entityInstance %>.<%= fieldName %> | date:'medium'}}</span>
                 <%_ } else if (fieldType === 'LocalDate') { _%>
                 <span id="<%= fieldName %>-content">{{<%=entityInstance %>.<%= fieldName %> | date:'mediumDate'}}</span>
                 <%_ } else if (['byte[]', 'ByteBuffer'].includes(fieldType) && fieldTypeBlobContent === 'any') { _%>
-                <div id="<%= fieldName %>-content" *ngIf="<%= entityInstance %>.<%= fieldName %>">
+            @if (<%= entityInstance %>.<%= fieldName %>) {
+                <div id="<%= fieldName %>-content">
                     <a (click)="openFile(<%= entityInstance %>.<%= fieldName %>ContentType, <%= entityInstance %>.<%= fieldName %>)" jhiTranslate="entity.action.open">open</a>
                     {{<%= entityInstance %>.<%= fieldName %>ContentType}}, {{byteSize(<%= entityInstance %>.<%= fieldName %>)}}
                 </div>
+            }
                 <%_ } else { _%>
                 <span id="<%= fieldName %>-content">{{<%= entityInstance %>.<%= fieldName %>}}</span>
                 <%_ } _%>
@@ -78,9 +82,11 @@
             <%_ if (otherEntityName === 'user') { _%>
                 <%_ if (relationshipType === 'many-to-many') { _%>
             <div item-content>
-                <span *ngFor="let <%= relationshipFieldName %> of <%= entityInstance %>.<%= relationshipFieldNamePlural %>; let last = last">
+            @for (<%= relationshipFieldName %> of <%= entityInstance %>.<%= relationshipFieldNamePlural %>; let last = $last) {
+                <span>
                     {{<%= relationshipFieldName %>.<%= otherEntityField %>}}{{last ? '' : ', '}}
                 </span>
+            }
             </div>
                 <%_ } else { _%>
                     <%_ if (dto === 'no') { _%>
@@ -92,19 +98,25 @@
             <%_ } else { _%>
                 <%_ if (relationshipType === 'many-to-many') { _%>
             <div item-content>
-                <span *ngFor="let <%= relationshipFieldName %> of <%= entityInstance %>.<%= relationshipFieldNamePlural %>; let last = last">
+            @for (<%= relationshipFieldName %> of <%= entityInstance %>.<%= relationshipFieldNamePlural %>; let last = $last) {
+                <span>
                     <a>{{<%= relationshipFieldName %>.<%= otherEntityField %>}}</a>{{last ? '' : ', '}}
                 </span>
+            }
             </div>
                 <%_ } else { _%>
                     <%_ if (dto === 'no') { _%>
-            <div item-content *ngIf="<%= entityInstance + '.' + relationshipFieldName %>">
+        @if (<%= entityInstance + '.' + relationshipFieldName %>) {
+            <div item-content>
                 <a>{{<%= entityInstance + "." + relationshipFieldName + "?." + otherEntityField %>}}</a>
             </div>
+        }
                     <%_ } else { _%>
-            <div item-content *ngIf="<%= entityInstance + '.' + relationshipFieldName + "Id" %>">
+        @if (<%= entityInstance + '.' + relationshipFieldName + "Id" %>) {
+            <div item-content>
                 <a>{{<%= entityInstance + "." + relationshipFieldName + otherEntityFieldCapitalized %>}}</a>
             </div>
+        }
                     <%_ } _%>
                 <%_ } _%>
             <%_ } _%>

diff --git a/generators/ionic/templates/src/app/pages/entities/_entity-update.html.ejs b/generators/ionic/templates/src/app/pages/entities/_entity-update.html.ejs
@@ -28,16 +28,20 @@ _%>
 
         <ion-buttons slot="end">
             <ion-button [disabled]="!isReadyToSave" (click)="save()" color="primary">
-              <span *ngIf="platform.is('ios')">{{'DONE_BUTTON' | translate}}</span>
-              <ion-icon name="checkmark" *ngIf="!platform.is('ios')"></ion-icon>
+            @if (platform.is('ios')) {
+                <span>{{'DONE_BUTTON' | translate}}</span>
+            } else {
+                <ion-icon name="checkmark"></ion-icon>
+            }
             </ion-button>
         </ion-buttons>
     </ion-toolbar>
 </ion-header>
 
 
 <ion-content class="ion-padding">
-    <form *ngIf="form" name="form" [formGroup]="form" (ngSubmit)="save()">
+@if (form) {
+    <form name="form" [formGroup]="form" (ngSubmit)="save()">
         <ion-list>
             <ion-item [hidden]="!form.id">
                 <ion-label>ID</ion-label>
@@ -79,9 +83,12 @@ _%>
                 <%_ } else if (['byte[]', 'ByteBuffer'].includes(fieldType) && fieldTypeBlobContent !== 'text') { _%>
                 <div>
                     <%_ if (fieldTypeBlobContent === 'image') { _%>
-                    <img [src]="'data:' + <%=entityInstance %>.<%=fieldName%>ContentType + ';base64,' + <%=entityInstance %>.<%=fieldName%>" style="max-height: 100px;" *ngIf="<%= entityInstance %>?.<%= fieldName %>" alt="<%=entityInstance %> image"/>
+                @if (<%= entityInstance %>?.<%= fieldName %>) {
+                    <img [src]="'data:' + <%=entityInstance %>.<%=fieldName%>ContentType + ';base64,' + <%=entityInstance %>.<%=fieldName%>" style="max-height: 100px;" alt="<%=entityInstance %> image"/>
+                }
                     <%_ } _%>
-                    <div *ngIf="<%= entityInstance %>.<%= fieldName %>">
+                @if (<%= entityInstance %>.<%= fieldName %>) {
+                    <div>
                         <p>{{<%= entityInstance %>.<%= fieldName %>ContentType}}, {{byteSize(<%= entityInstance %>.<%= fieldName %>)}}</p>
                         <%_ if (fieldTypeBlobContent === 'image') { _%>
                         <ion-button color="danger" (click)="clearInputImage('<%= fieldName %>', '<%= fieldName %>ContentType', 'fileImage')">
@@ -93,13 +100,18 @@ _%>
                         </ion-button>
                         <%_ } _%>
                     </div>
+                }
                     <%_ if (fieldTypeBlobContent === 'image') { _%>
-                    <input *ngIf="!useCameraCapacitor" type="file" data-cy="<%= fieldName %>" #fileInput style="display: none"
+                @if (!useCameraCapacitor) {
+                    <input type="file" data-cy="<%= fieldName %>" #fileInput style="display: none"
                            (change)="setFileData($event, '<%= fieldName %>', true)" accept="image/*"/>
-                    <ion-button *ngIf="!<%= entityInstance %>?.<%= fieldName %>" (click)="getPicture('<%= fieldName %>')" data-cy="<%= fieldName %>-take-photo">
+                }
+                @if (!<%= entityInstance %>?.<%= fieldName %>) {
+                    <ion-button (click)="getPicture('<%= fieldName %>')" data-cy="<%= fieldName %>-take-photo">
                         <ion-icon name="add-circle" slot="start"></ion-icon>
                         {{ 'ITEM_CREATE_CHOOSE_IMAGE' | translate }}
                     </ion-button>
+                }
                     <%_ } else { _%>
                     <input type="file" data-cy="<%= fieldName %>" (change)="setFileData($event, '<%= fieldName %>', false)"/>
                     <%_ } _%>
@@ -138,18 +150,25 @@ _%>
                 <%_ if (!relationshipRequired) { _%>
                     <ion-select-option [value]="null"></ion-select-option>
                 <%_ } else { _%>
-                    <ion-select-option *ngIf="!form.value.<%= relationshipName %>" [value]="null" selected></ion-select-option>
+                @if (!form.value.<%= relationshipName %>) {
+                    <ion-select-option [value]="null" selected></ion-select-option>
+                }
                 <%_ } _%>
-                    <ion-select-option [value]="<%=otherEntityName %>Option" *ngFor="let <%=otherEntityName %>Option of <%=otherEntityNamePlural%>; trackBy: track<%=otherEntityNameCapitalized %>ById">{{<%=otherEntityName %>Option.<%=otherEntityField %>}}</ion-select-option>
+                @for (<%=otherEntityName %>Option of <%=otherEntityNamePlural%>; track track<%=otherEntityNameCapitalized %>ById) {
+                    <ion-select-option [value]="<%=otherEntityName %>Option">{{<%=otherEntityName %>Option.<%=otherEntityField %>}}</ion-select-option>
                 </ion-select>
                 <%_ } else { _%>
                 <ion-select id="field_<%= relationshipName %>" formControlName="<%= relationshipName %>Id" [compareWith]="compare<%=otherEntityNameCapitalized %>"<% if (relationshipRequired) { %> required<% } %>>
                 <%_ if (!relationshipRequired) { _%>
                     <ion-select-option [value]="null"></ion-select-option>
                 <%_ } else { _%>
-                    <ion-select-option *ngIf="!form.value.<%= relationshipName %>Id" [value]="null" selected></ion-select-option>
+                @if (!form.value.<%= relationshipName %>Id) }
+                    <ion-select-option [value]="null" selected></ion-select-option>
+                }
                 <%_ } _%>
-                    <ion-select-option [value]="<%=otherEntityName %>Option.id" *ngFor="let <%=otherEntityName %>Option of <%=otherEntityNamePlural%>; trackBy: track<%=otherEntityNameCapitalized %>ById">{{<%=otherEntityName %>Option.<%=otherEntityField %>}}</ion-select-option>
+                @for (let <%=otherEntityName %>Option of <%=otherEntityNamePlural%>; track track<%=otherEntityNameCapitalized %>ById) {
+                    <ion-select-option [value]="<%=otherEntityName %>Option.id">{{<%=otherEntityName %>Option.<%=otherEntityField %>}}</ion-select-option>
+                }
                 </ion-select>
                 <%_ } _%>
             </ion-item>
@@ -161,26 +180,36 @@ _%>
                 <%_ if (!relationshipRequired) { _%>
                     <ion-select-option [value]="null"></ion-select-option>
                 <%_ } else { _%>
-                    <ion-select-option *ngIf="!form.value.<%= relationshipName %>" [value]="null" selected></ion-select-option>
+                @if (!form.value.<%= relationshipName %>) {
+                    <ion-select-option [value]="null" selected></ion-select-option>
+                }
                 <%_ } _%>
-                    <ion-select-option [value]="<%=otherEntityName %>Option.id === <%= entityInstance %>.<%=relationshipFieldName %>?.id ? <%= entityInstance %>.<%=relationshipFieldName %> : <%=otherEntityName %>Option" *ngFor="let <%=otherEntityName %>Option of <%=relationshipFieldNamePlural.toLowerCase() %>; trackBy: track<%=otherEntityNameCapitalized %>ById">{{<%=otherEntityName %>Option.<%=otherEntityField %>}}</ion-select-option>
+                @for (<%=otherEntityName %>Option of <%=relationshipFieldNamePlural.toLowerCase() %>; track track<%=otherEntityNameCapitalized %>ById) {
+                    <ion-select-option [value]="<%=otherEntityName %>Option.id === <%= entityInstance %>.<%=relationshipFieldName %>?.id ? <%= entityInstance %>.<%=relationshipFieldName %> : <%=otherEntityName %>Option">{{<%=otherEntityName %>Option.<%=otherEntityField %>}}</ion-select-option>
+                }
                 </ion-select>
                 <%_ } else { _%>
                 <ion-select id="field_<%= relationshipName %>" formControlName="<%= relationshipName %>Id" [compareWith]="compare<%=otherEntityNameCapitalized %>"<% if (relationshipRequired) { %> required<% } %>>
                 <%_ if (!relationshipRequired) { _%>
                     <ion-select-option [value]="null"></ion-select-option>
                 <%_ } else { _%>
-                    <ion-select-option *ngIf="!form.value.<%= relationshipName %>Id" [value]="null" selected></ion-select-option>
+                @if (!form.value.<%= relationshipName %>Id) {
+                    <ion-select-option [value]="null" selected></ion-select-option>
+                }
                 <%_ } _%>
-                    <ion-select-option [value]="<%=otherEntityName %>Option.id" *ngFor="let <%=otherEntityName %>Option of <%=relationshipFieldNamePlural.toLowerCase() %>; trackBy: track<%=otherEntityNameCapitalized %>ById">{{<%=otherEntityName %>Option.<%=otherEntityField %>}}</ion-select-option>
+                @for (<%=otherEntityName %>Option of <%=relationshipFieldNamePlural.toLowerCase() %>; track track<%=otherEntityNameCapitalized %>ById) {
+                    <ion-select-option [value]="<%=otherEntityName %>Option.id">{{<%=otherEntityName %>Option.<%=otherEntityField %>}}</ion-select-option>
+                }
                 </ion-select>
                 <%_ } _%>
             </ion-item>
             <%_ } else if (relationshipType === 'many-to-many' && relationships[idx].ownerSide === true) { _%>
             <ion-item>
                 <ion-label><%= relationshipNameHumanized %></ion-label>
                 <ion-select id="field_<%= relationshipName %>" multiple="true" formControlName="<%= relationshipFieldNamePlural %>" [compareWith]="compare<%=otherEntityNameCapitalized %>"<% if (relationshipRequired) { %> required<% } %>>
-                    <ion-select-option [value]="<%=otherEntityName %>Option" *ngFor="let <%=otherEntityName %>Option of <%=otherEntityNamePlural.toLowerCase() %>; trackBy: track<%=otherEntityNameCapitalized %>ById">{{<%=otherEntityName %>Option.<%=otherEntityField %>}}</ion-select-option>
+                @for (<%=otherEntityName %>Option of <%=otherEntityNamePlural.toLowerCase() %>; track track<%=otherEntityNameCapitalized %>ById) {
+                    <ion-select-option [value]="<%=otherEntityName %>Option">{{<%=otherEntityName %>Option.<%=otherEntityField %>}}</ion-select-option>
+                }
                 </ion-select>
             </ion-item>
             <%_ } _%>
@@ -197,4 +226,5 @@ _%>
             <%_ } _%>
         </ion-list>
     </form>
+}
 </ion-content>
diff --git a/generators/ionic/templates/src/app/pages/entities/_entity.html.ejs b/generators/ionic/templates/src/app/pages/entities/_entity.html.ejs
@@ -33,7 +33,8 @@
     </ion-refresher>
 
     <ion-list>
-        <ion-item-sliding *ngFor="let <%=entityInstance %> of <%=entityInstancePlural %>; trackBy: trackId" #slidingItem>
+    @for (<%=entityInstance %> of <%=entityInstancePlural %>; trackBy: trackId) {
+        <ion-item-sliding #slidingItem>
             <ion-item (click)="view(<%= entityInstance %>)">
               <ion-label text-wrap>
               <%_ for (idx in fields) {
@@ -42,9 +43,11 @@
                 const fieldType = fields[idx].fieldType;
                 const fieldTypeBlobContent = fields[idx].fieldTypeBlobContent; _%>
                 <%_ if (['byte[]', 'ByteBuffer'].includes(fieldType) && fieldTypeBlobContent === 'image') { _%>
-                <ion-avatar<% if (idx === 0) { %>item-start<% } %> *ngIf="<%= entityInstance %>.<%= fieldName %>">
+              @if (<%= entityInstance %>.<%= fieldName %>) {
+                <ion-avatar<% if (idx === 0) { %>item-start<% } %>>
                     <img [src]="'data:' + <%=entityInstance %>.<%=fieldName%>ContentType + ';base64,' + <%=entityInstance %>.<%=fieldName%>" />
                 </ion-avatar>
+              }
                 <%_ } else if (fields[idx].fieldIsEnum) { _%>
                 <!-- todo: special handling for translating enum - {{'<%= fieldType %>.' + <%= entityInstance %>.<%= fieldName %>}}" -->
                 <p>{{<%=entityInstance %>.<%=fieldName%>}}</p>
@@ -71,12 +74,15 @@
                 </ion-item-option>
             </ion-item-options>
         </ion-item-sliding>
+    }
     </ion-list>
-    <ion-item *ngIf="!<%=entityInstancePlural %>?.length">
+@if (!<%=entityInstancePlural %>?.length) {
+    <ion-item>
         <ion-label>
             No <%= entityClassPluralHumanized %> found.
         </ion-label>
     </ion-item>
+}
 
     <ion-fab vertical="bottom" horizontal="end" slot="fixed">
         <ion-fab-button (click)="new()">

diff --git a/generators/server/__snapshots__/generator.spec.mjs.snap b/generators/server/__snapshots__/generator.spec.mjs.snap
@@ -20,7 +20,7 @@ exports[`SubGenerator server of ionic JHipster blueprint > run > should succeed
   ".husky/pre-commit": {
     "stateCleared": "modified",
   },
-  ".lintstagedrc.cjs": {
+  ".lintstagedrc.js": {
     "stateCleared": "modified",
   },
   ".mvn/jvm.config": {