generator-jhipster 7.6.0 → 7.8.1

package/generators/client/templates/angular/src/main/webapp/app/admin/health/health.component.spec.ts.ejs

@@ -51,8 +51,8 @@ describe('HealthComponent', () => {
     it('should get badge class', () => {
       const upBadgeClass = comp.getBadgeClass('UP');
       const downBadgeClass = comp.getBadgeClass('DOWN');
-      expect(upBadgeClass).toEqual('badge-success');
-      expect(downBadgeClass).toEqual('badge-danger');
+      expect(upBadgeClass).toEqual('bg-success');
+      expect(downBadgeClass).toEqual('bg-danger');
     });
   });
 

package/generators/client/templates/angular/src/main/webapp/app/admin/health/health.component.ts.ejs

@@ -39,9 +39,9 @@ export class HealthComponent implements OnInit {
 
   getBadgeClass(statusState: HealthStatus): string {
     if (statusState === 'UP') {
-      return 'badge-success';
+      return 'bg-success';
     }
-    return 'badge-danger';
+    return 'bg-danger';
   }
 
   refresh(): void {

package/generators/client/templates/angular/src/main/webapp/app/admin/health/modal/health-modal.component.html.ejs

@@ -25,7 +25,7 @@
     <%_ } _%>
   </h4>
 
-  <button aria-label="Close" data-dismiss="modal" class="close" type="button" (click)="dismiss()">
+  <button aria-label="Close" data-dismiss="modal" class="btn-close" type="button" (click)="dismiss()">
     <span aria-hidden="true">&times;</span>
   </button>
 </div>
@@ -38,14 +38,14 @@
       <table class="table table-striped" aria-describedby="showHealthLabel">
         <thead>
           <tr>
-            <th scope="col" class="text-left" <%= jhiPrefix %>Translate="health.details.name">Name</th>
-            <th scope="col" class="text-left" <%= jhiPrefix %>Translate="health.details.value">Value</th>
+            <th scope="col" class="text-start" <%= jhiPrefix %>Translate="health.details.name">Name</th>
+            <th scope="col" class="text-start" <%= jhiPrefix %>Translate="health.details.value">Value</th>
           </tr>
         </thead>
         <tbody>
           <tr *ngFor="let healthDetail of health.value.details! | keyvalue">
-            <td class="text-left">{{ healthDetail.key }}</td>
-            <td class="text-left">{{ readableValue(healthDetail.value) }}</td>
+            <td class="text-start">{{ healthDetail.key }}</td>
+            <td class="text-start">{{ readableValue(healthDetail.value) }}</td>
           </tr>
         </tbody>
       </table>
@@ -54,5 +54,5 @@
 </div>
 
 <div class="modal-footer">
-  <button data-dismiss="modal" class="btn btn-secondary float-left" type="button" (click)="dismiss()">Done</button>
+  <button data-dismiss="modal" class="btn btn-secondary float-start" type="button" (click)="dismiss()">Done</button>
 </div>

package/generators/client/templates/angular/src/main/webapp/app/admin/logs/logs.component.html.ejs

@@ -32,59 +32,61 @@
       </tr>
     </thead>
 
-    <tr *ngFor="let logger of filteredAndOrderedLoggers">
-      <td>
-        <small>{{ logger.name | slice: 0:140 }}</small>
-      </td>
-      <td>
-        <button
-          (click)="changeLevel(logger.name, 'TRACE')"
-          [ngClass]="logger.level === 'TRACE' ? 'btn-primary' : 'btn-light'"
-          class="btn btn-sm"
-        >
-          TRACE
-        </button>
+    <tbody>
+      <tr *ngFor="let logger of filteredAndOrderedLoggers">
+        <td>
+          <small>{{ logger.name | slice: 0:140 }}</small>
+        </td>
+        <td>
+          <button
+            (click)="changeLevel(logger.name, 'TRACE')"
+            [ngClass]="logger.level === 'TRACE' ? 'btn-primary' : 'btn-light'"
+            class="btn btn-sm"
+          >
+            TRACE
+          </button>
 
-        <button
-          (click)="changeLevel(logger.name, 'DEBUG')"
-          [ngClass]="logger.level === 'DEBUG' ? 'btn-success' : 'btn-light'"
-          class="btn btn-sm"
-        >
-          DEBUG
-        </button>
+          <button
+            (click)="changeLevel(logger.name, 'DEBUG')"
+            [ngClass]="logger.level === 'DEBUG' ? 'btn-success' : 'btn-light'"
+            class="btn btn-sm"
+          >
+            DEBUG
+          </button>
 
-        <button
-          (click)="changeLevel(logger.name, 'INFO')"
-          [ngClass]="logger.level === 'INFO' ? 'btn-info' : 'btn-light'"
-          class="btn btn-sm"
-        >
-          INFO
-        </button>
+          <button
+            (click)="changeLevel(logger.name, 'INFO')"
+            [ngClass]="logger.level === 'INFO' ? 'btn-info' : 'btn-light'"
+            class="btn btn-sm"
+          >
+            INFO
+          </button>
 
-        <button
-          (click)="changeLevel(logger.name, 'WARN')"
-          [ngClass]="logger.level === 'WARN' ? 'btn-warning' : 'btn-light'"
-          class="btn btn-sm"
-        >
-          WARN
-        </button>
+          <button
+            (click)="changeLevel(logger.name, 'WARN')"
+            [ngClass]="logger.level === 'WARN' ? 'btn-warning' : 'btn-light'"
+            class="btn btn-sm"
+          >
+            WARN
+          </button>
 
-        <button
-          (click)="changeLevel(logger.name, 'ERROR')"
-          [ngClass]="logger.level === 'ERROR' ? 'btn-danger' : 'btn-light'"
-          class="btn btn-sm"
-        >
-          ERROR
-        </button>
+          <button
+            (click)="changeLevel(logger.name, 'ERROR')"
+            [ngClass]="logger.level === 'ERROR' ? 'btn-danger' : 'btn-light'"
+            class="btn btn-sm"
+          >
+            ERROR
+          </button>
 
-        <button
-          (click)="changeLevel(logger.name, 'OFF')"
-          [ngClass]="logger.level === 'OFF' ? 'btn-secondary' : 'btn-light'"
-          class="btn btn-sm"
-        >
-          OFF
-        </button>
-      </td>
-    </tr>
+          <button
+            (click)="changeLevel(logger.name, 'OFF')"
+            [ngClass]="logger.level === 'OFF' ? 'btn-secondary' : 'btn-light'"
+            class="btn btn-sm"
+          >
+            OFF
+          </button>
+        </td>
+      </tr>
+    </tbody>
   </table>
 </div>

package/generators/client/templates/angular/src/main/webapp/app/admin/metrics/blocks/metrics-cache/metrics-cache.component.html.ejs

@@ -23,32 +23,32 @@
     <thead>
       <tr>
         <th scope="col" <%= jhiPrefix %>Translate="metrics.cache.cachename">Cache name</th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.cache.hits">Cache Hits</th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.cache.misses">Cache Misses</th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.cache.gets">Cache Gets</th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.cache.puts">Cache Puts</th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.cache.removals">Cache Removals</th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.cache.evictions">Cache Evictions</th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.cache.hitPercent">Cache Hit %</th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.cache.missPercent">Cache Miss %</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.cache.hits">Cache Hits</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.cache.misses">Cache Misses</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.cache.gets">Cache Gets</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.cache.puts">Cache Puts</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.cache.removals">Cache Removals</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.cache.evictions">Cache Evictions</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.cache.hitPercent">Cache Hit %</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.cache.missPercent">Cache Miss %</th>
       </tr>
     </thead>
     <tbody>
       <tr *ngFor="let entry of cacheMetrics | keyvalue">
         <td>{{ entry.key }}</td>
-        <td class="text-right">{{ entry.value['cache.gets.hit'] }}</td>
-        <td class="text-right">{{ entry.value['cache.gets.miss'] }}</td>
-        <td class="text-right">{{ entry.value['cache.gets.hit'] + entry.value['cache.gets.miss'] }}</td>
-        <td class="text-right">{{ entry.value['cache.puts'] }}</td>
-        <td class="text-right">{{ entry.value['cache.removals'] }}</td>
-        <td class="text-right">{{ entry.value['cache.evictions'] }}</td>
-        <td class="text-right">
+        <td class="text-end">{{ entry.value['cache.gets.hit'] }}</td>
+        <td class="text-end">{{ entry.value['cache.gets.miss'] }}</td>
+        <td class="text-end">{{ entry.value['cache.gets.hit'] + entry.value['cache.gets.miss'] }}</td>
+        <td class="text-end">{{ entry.value['cache.puts'] }}</td>
+        <td class="text-end">{{ entry.value['cache.removals'] }}</td>
+        <td class="text-end">{{ entry.value['cache.evictions'] }}</td>
+        <td class="text-end">
           {{
             filterNaN((100 * entry.value['cache.gets.hit']) / (entry.value['cache.gets.hit'] + entry.value['cache.gets.miss']))
               | number: '1.0-4'
           }}
         </td>
-        <td class="text-right">
+        <td class="text-end">
           {{
             filterNaN((100 * entry.value['cache.gets.miss']) / (entry.value['cache.gets.hit'] + entry.value['cache.gets.miss']))
               | number: '1.0-4'

package/generators/client/templates/angular/src/main/webapp/app/admin/metrics/blocks/metrics-datasource/metrics-datasource.component.html.ejs

@@ -26,49 +26,49 @@
           <span <%= jhiPrefix %>Translate="metrics.datasource.usage">Connection Pool Usage</span> (active: {{ datasourceMetrics.active.value }},
           min: {{ datasourceMetrics.min.value }}, max: {{ datasourceMetrics.max.value }}, idle: {{ datasourceMetrics.idle.value }})
         </th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.datasource.count">Count</th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.datasource.mean">Mean</th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.servicesstats.table.min">Min</th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p50">p50</th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p75">p75</th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p95">p95</th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p99">p99</th>
-        <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.datasource.max">Max</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.datasource.count">Count</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.datasource.mean">Mean</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.servicesstats.table.min">Min</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p50">p50</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p75">p75</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p95">p95</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p99">p99</th>
+        <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.datasource.max">Max</th>
       </tr>
     </thead>
     <tbody>
       <tr>
         <td>Acquire</td>
-        <td class="text-right">{{ datasourceMetrics.acquire.count }}</td>
-        <td class="text-right">{{ filterNaN(datasourceMetrics.acquire.mean) | number: '1.0-2' }}</td>
-        <td class="text-right">{{ datasourceMetrics.acquire['0.0'] | number: '1.0-3' }}</td>
-        <td class="text-right">{{ datasourceMetrics.acquire['0.5'] | number: '1.0-3' }}</td>
-        <td class="text-right">{{ datasourceMetrics.acquire['0.75'] | number: '1.0-3' }}</td>
-        <td class="text-right">{{ datasourceMetrics.acquire['0.95'] | number: '1.0-3' }}</td>
-        <td class="text-right">{{ datasourceMetrics.acquire['0.99'] | number: '1.0-3' }}</td>
-        <td class="text-right">{{ filterNaN(datasourceMetrics.acquire.max) | number: '1.0-2' }}</td>
+        <td class="text-end">{{ datasourceMetrics.acquire.count }}</td>
+        <td class="text-end">{{ filterNaN(datasourceMetrics.acquire.mean) | number: '1.0-2' }}</td>
+        <td class="text-end">{{ datasourceMetrics.acquire['0.0'] | number: '1.0-3' }}</td>
+        <td class="text-end">{{ datasourceMetrics.acquire['0.5'] | number: '1.0-3' }}</td>
+        <td class="text-end">{{ datasourceMetrics.acquire['0.75'] | number: '1.0-3' }}</td>
+        <td class="text-end">{{ datasourceMetrics.acquire['0.95'] | number: '1.0-3' }}</td>
+        <td class="text-end">{{ datasourceMetrics.acquire['0.99'] | number: '1.0-3' }}</td>
+        <td class="text-end">{{ filterNaN(datasourceMetrics.acquire.max) | number: '1.0-2' }}</td>
       </tr>
       <tr>
         <td>Creation</td>
-        <td class="text-right">{{ datasourceMetrics.creation.count }}</td>
-        <td class="text-right">{{ filterNaN(datasourceMetrics.creation.mean) | number: '1.0-2' }}</td>
-        <td class="text-right">{{ datasourceMetrics.creation['0.0'] | number: '1.0-3' }}</td>
-        <td class="text-right">{{ datasourceMetrics.creation['0.5'] | number: '1.0-3' }}</td>
-        <td class="text-right">{{ datasourceMetrics.creation['0.75'] | number: '1.0-3' }}</td>
-        <td class="text-right">{{ datasourceMetrics.creation['0.95'] | number: '1.0-3' }}</td>
-        <td class="text-right">{{ datasourceMetrics.creation['0.99'] | number: '1.0-3' }}</td>
-        <td class="text-right">{{ filterNaN(datasourceMetrics.creation.max) | number: '1.0-2' }}</td>
+        <td class="text-end">{{ datasourceMetrics.creation.count }}</td>
+        <td class="text-end">{{ filterNaN(datasourceMetrics.creation.mean) | number: '1.0-2' }}</td>
+        <td class="text-end">{{ datasourceMetrics.creation['0.0'] | number: '1.0-3' }}</td>
+        <td class="text-end">{{ datasourceMetrics.creation['0.5'] | number: '1.0-3' }}</td>
+        <td class="text-end">{{ datasourceMetrics.creation['0.75'] | number: '1.0-3' }}</td>
+        <td class="text-end">{{ datasourceMetrics.creation['0.95'] | number: '1.0-3' }}</td>
+        <td class="text-end">{{ datasourceMetrics.creation['0.99'] | number: '1.0-3' }}</td>
+        <td class="text-end">{{ filterNaN(datasourceMetrics.creation.max) | number: '1.0-2' }}</td>
       </tr>
       <tr>
         <td>Usage</td>
-        <td class="text-right">{{ datasourceMetrics.usage.count }}</td>
-        <td class="text-right">{{ filterNaN(datasourceMetrics.usage.mean) | number: '1.0-2' }}</td>
-        <td class="text-right">{{ datasourceMetrics.usage['0.0'] | number: '1.0-3' }}</td>
-        <td class="text-right">{{ datasourceMetrics.usage['0.5'] | number: '1.0-3' }}</td>
-        <td class="text-right">{{ datasourceMetrics.usage['0.75'] | number: '1.0-3' }}</td>
-        <td class="text-right">{{ datasourceMetrics.usage['0.95'] | number: '1.0-3' }}</td>
-        <td class="text-right">{{ datasourceMetrics.usage['0.99'] | number: '1.0-3' }}</td>
-        <td class="text-right">{{ filterNaN(datasourceMetrics.usage.max) | number: '1.0-2' }}</td>
+        <td class="text-end">{{ datasourceMetrics.usage.count }}</td>
+        <td class="text-end">{{ filterNaN(datasourceMetrics.usage.mean) | number: '1.0-2' }}</td>
+        <td class="text-end">{{ datasourceMetrics.usage['0.0'] | number: '1.0-3' }}</td>
+        <td class="text-end">{{ datasourceMetrics.usage['0.5'] | number: '1.0-3' }}</td>
+        <td class="text-end">{{ datasourceMetrics.usage['0.75'] | number: '1.0-3' }}</td>
+        <td class="text-end">{{ datasourceMetrics.usage['0.95'] | number: '1.0-3' }}</td>
+        <td class="text-end">{{ datasourceMetrics.usage['0.99'] | number: '1.0-3' }}</td>
+        <td class="text-end">{{ filterNaN(datasourceMetrics.usage.max) | number: '1.0-2' }}</td>
       </tr>
     </tbody>
   </table>

package/generators/client/templates/angular/src/main/webapp/app/admin/metrics/blocks/metrics-endpoints-requests/metrics-endpoints-requests.component.html.ejs

@@ -24,8 +24,8 @@
       <tr>
         <th scope="col">Method</th>
         <th scope="col">Endpoint url</th>
-        <th scope="col" class="text-right">Count</th>
-        <th scope="col" class="text-right">Mean</th>
+        <th scope="col" class="text-end">Count</th>
+        <th scope="col" class="text-end">Mean</th>
       </tr>
     </thead>
     <tbody>
@@ -33,8 +33,8 @@
         <tr *ngFor="let method of entry.value | keyvalue">
           <td>{{ method.key }}</td>
           <td>{{ entry.key }}</td>
-          <td class="text-right">{{ method.value!.count }}</td>
-          <td class="text-right">{{ method.value!.mean | number: '1.0-3' }}</td>
+          <td class="text-end">{{ method.value!.count }}</td>
+          <td class="text-end">{{ method.value!.mean | number: '1.0-3' }}</td>
         </tr>
       </ng-container>
     </tbody>

package/generators/client/templates/angular/src/main/webapp/app/admin/metrics/blocks/metrics-garbagecollector/metrics-garbagecollector.component.html.ejs

@@ -69,11 +69,11 @@
   <div id="garbageCollectorMetrics" class="col-md-4">
     <div class="row" *ngIf="garbageCollectorMetrics">
       <div class="col-md-9">Classes loaded</div>
-      <div class="col-md-3 text-right">{{ garbageCollectorMetrics.classesLoaded }}</div>
+      <div class="col-md-3 text-end">{{ garbageCollectorMetrics.classesLoaded }}</div>
     </div>
     <div class="row" *ngIf="garbageCollectorMetrics">
       <div class="col-md-9">Classes unloaded</div>
-      <div class="col-md-3 text-right">{{ garbageCollectorMetrics.classesUnloaded }}</div>
+      <div class="col-md-3 text-end">{{ garbageCollectorMetrics.classesUnloaded }}</div>
     </div>
   </div>
 
@@ -82,27 +82,27 @@
       <thead>
         <tr>
           <th scope="col"></th>
-          <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.servicesstats.table.count">Count</th>
-          <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.servicesstats.table.mean">Mean</th>
-          <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.servicesstats.table.min">Min</th>
-          <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p50">p50</th>
-          <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p75">p75</th>
-          <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p95">p95</th>
-          <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p99">p99</th>
-          <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.servicesstats.table.max">Max</th>
+          <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.servicesstats.table.count">Count</th>
+          <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.servicesstats.table.mean">Mean</th>
+          <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.servicesstats.table.min">Min</th>
+          <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p50">p50</th>
+          <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p75">p75</th>
+          <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p95">p95</th>
+          <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.servicesstats.table.p99">p99</th>
+          <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.servicesstats.table.max">Max</th>
         </tr>
       </thead>
       <tbody>
         <tr>
           <td>jvm.gc.pause</td>
-          <td class="text-right">{{ garbageCollectorMetrics['jvm.gc.pause'].count }}</td>
-          <td class="text-right">{{ garbageCollectorMetrics['jvm.gc.pause'].mean | number: '1.0-3' }}</td>
-          <td class="text-right">{{ garbageCollectorMetrics['jvm.gc.pause']['0.0'] | number: '1.0-3' }}</td>
-          <td class="text-right">{{ garbageCollectorMetrics['jvm.gc.pause']['0.5'] | number: '1.0-3' }}</td>
-          <td class="text-right">{{ garbageCollectorMetrics['jvm.gc.pause']['0.75'] | number: '1.0-3' }}</td>
-          <td class="text-right">{{ garbageCollectorMetrics['jvm.gc.pause']['0.95'] | number: '1.0-3' }}</td>
-          <td class="text-right">{{ garbageCollectorMetrics['jvm.gc.pause']['0.99'] | number: '1.0-3' }}</td>
-          <td class="text-right">{{ garbageCollectorMetrics['jvm.gc.pause'].max | number: '1.0-3' }}</td>
+          <td class="text-end">{{ garbageCollectorMetrics['jvm.gc.pause'].count }}</td>
+          <td class="text-end">{{ garbageCollectorMetrics['jvm.gc.pause'].mean | number: '1.0-3' }}</td>
+          <td class="text-end">{{ garbageCollectorMetrics['jvm.gc.pause']['0.0'] | number: '1.0-3' }}</td>
+          <td class="text-end">{{ garbageCollectorMetrics['jvm.gc.pause']['0.5'] | number: '1.0-3' }}</td>
+          <td class="text-end">{{ garbageCollectorMetrics['jvm.gc.pause']['0.75'] | number: '1.0-3' }}</td>
+          <td class="text-end">{{ garbageCollectorMetrics['jvm.gc.pause']['0.95'] | number: '1.0-3' }}</td>
+          <td class="text-end">{{ garbageCollectorMetrics['jvm.gc.pause']['0.99'] | number: '1.0-3' }}</td>
+          <td class="text-end">{{ garbageCollectorMetrics['jvm.gc.pause'].max | number: '1.0-3' }}</td>
         </tr>
       </tbody>
     </table>

package/generators/client/templates/angular/src/main/webapp/app/admin/metrics/blocks/metrics-modal-threads/metrics-modal-threads.component.html.ejs

@@ -19,34 +19,34 @@
 <div class="modal-header">
   <h4 class="modal-title" <%= jhiPrefix %>Translate="metrics.jvm.threads.dump.title">Threads dump</h4>
 
-  <button type="button" class="close" (click)="dismiss()">&times;</button>
+  <button type="button" class="btn-close" (click)="dismiss()">&times;</button>
 </div>
 
 <div class="modal-body">
   <div class="mb-3">
-    <span class="badge badge-primary hand" (click)="threadStateFilter = undefined">
+    <span class="badge bg-primary hand" (click)="threadStateFilter = undefined">
       <fa-icon *ngIf="threadStateFilter === undefined" icon="check"></fa-icon>
-      All&nbsp;<span class="badge badge-pill badge-default">{{ threadDumpAll }}</span>
+      All&nbsp;<span class="badge rounded-pill bg-default">{{ threadDumpAll }}</span>
     </span>
 
-    <span class="badge badge-success hand" (click)="threadStateFilter = ThreadState.Runnable">
+    <span class="badge bg-success hand" (click)="threadStateFilter = ThreadState.Runnable">
       <fa-icon *ngIf="threadStateFilter === ThreadState.Runnable" icon="check"></fa-icon>
-      Runnable&nbsp;<span class="badge badge-pill badge-default">{{ threadDumpRunnable }}</span>
+      Runnable&nbsp;<span class="badge rounded-pill bg-default">{{ threadDumpRunnable }}</span>
     </span>
 
-    <span class="badge badge-info hand" (click)="threadStateFilter = ThreadState.Waiting">
+    <span class="badge bg-info hand" (click)="threadStateFilter = ThreadState.Waiting">
       <fa-icon *ngIf="threadStateFilter === ThreadState.Waiting" icon="check"></fa-icon>
-      Waiting&nbsp;<span class="badge badge-pill badge-default">{{ threadDumpWaiting }}</span>
+      Waiting&nbsp;<span class="badge rounded-pill bg-default">{{ threadDumpWaiting }}</span>
     </span>
 
-    <span class="badge badge-warning hand" (click)="threadStateFilter = ThreadState.TimedWaiting">
+    <span class="badge bg-warning hand" (click)="threadStateFilter = ThreadState.TimedWaiting">
       <fa-icon *ngIf="threadStateFilter === ThreadState.TimedWaiting" icon="check"></fa-icon>
-      Timed Waiting&nbsp;<span class="badge badge-pill badge-default">{{ threadDumpTimedWaiting }}</span>
+      Timed Waiting&nbsp;<span class="badge rounded-pill bg-default">{{ threadDumpTimedWaiting }}</span>
     </span>
 
-    <span class="badge badge-danger hand" (click)="threadStateFilter = ThreadState.Blocked">
+    <span class="badge bg-danger hand" (click)="threadStateFilter = ThreadState.Blocked">
       <fa-icon *ngIf="threadStateFilter === ThreadState.Blocked" icon="check"></fa-icon>
-      Blocked&nbsp;<span class="badge badge-pill badge-default">{{ threadDumpBlocked }}</span>
+      Blocked&nbsp;<span class="badge rounded-pill bg-default">{{ threadDumpBlocked }}</span>
     </span>
   </div>
 
@@ -96,5 +96,5 @@
   </div>
 </div>
 <div class="modal-footer">
-  <button type="button" class="btn btn-secondary float-left" data-dismiss="modal" (click)="dismiss()">Done</button>
+  <button type="button" class="btn btn-secondary float-start" data-dismiss="modal" (click)="dismiss()">Done</button>
 </div>

package/generators/client/templates/angular/src/main/webapp/app/admin/metrics/blocks/metrics-modal-threads/metrics-modal-threads.component.ts.ejs

@@ -56,13 +56,13 @@ export class MetricsModalThreadsComponent implements OnInit {
 
   getBadgeClass(threadState: ThreadState): string {
     if (threadState === ThreadState.Runnable) {
-      return 'badge-success';
+      return 'bg-success';
     } else if (threadState === ThreadState.Waiting) {
-      return 'badge-info';
+      return 'bg-info';
     } else if (threadState === ThreadState.TimedWaiting) {
-      return 'badge-warning';
+      return 'bg-warning';
     } else if (threadState === ThreadState.Blocked) {
-      return 'badge-danger';
+      return 'bg-danger';
     }
     return '';
   }

package/generators/client/templates/angular/src/main/webapp/app/admin/metrics/blocks/metrics-request/metrics-request.component.html.ejs

@@ -23,8 +23,8 @@
     <tr>
       <th scope="col" <%= jhiPrefix %>Translate="metrics.jvm.http.table.code">Code</th>
       <th scope="col" <%= jhiPrefix %>Translate="metrics.jvm.http.table.count">Count</th>
-      <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.jvm.http.table.mean">Mean</th>
-      <th scope="col" class="text-right" <%= jhiPrefix %>Translate="metrics.jvm.http.table.max">Max</th>
+      <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.jvm.http.table.mean">Mean</th>
+      <th scope="col" class="text-end" <%= jhiPrefix %>Translate="metrics.jvm.http.table.max">Max</th>
     </tr>
   </thead>
   <tbody>
@@ -35,10 +35,10 @@
           <span>{{ entry.value.count }}</span>
         </ngb-progressbar>
       </td>
-      <td class="text-right">
+      <td class="text-end">
         {{ filterNaN(entry.value.mean) | number: '1.0-2' }}
       </td>
-      <td class="text-right">{{ entry.value.max | number: '1.0-2' }}</td>
+      <td class="text-end">{{ entry.value.max | number: '1.0-2' }}</td>
     </tr>
   </tbody>
 </table>

package/generators/client/templates/angular/src/main/webapp/app/admin/metrics/blocks/metrics-system/metrics-system.component.html.ejs

@@ -21,17 +21,17 @@
 <ng-container *ngIf="!updating && systemMetrics">
   <div class="row">
     <div class="col-md-4">Uptime</div>
-    <div class="col-md-8 text-right">{{ convertMillisecondsToDuration(systemMetrics['process.uptime']) }}</div>
+    <div class="col-md-8 text-end">{{ convertMillisecondsToDuration(systemMetrics['process.uptime']) }}</div>
   </div>
 
   <div class="row">
     <div class="col-md-4">Start time</div>
-    <div class="col-md-8 text-right">{{ systemMetrics['process.start.time'] | date: 'full' }}</div>
+    <div class="col-md-8 text-end">{{ systemMetrics['process.start.time'] | date: 'full' }}</div>
   </div>
 
   <div class="row">
     <div class="col-md-9">Process CPU usage</div>
-    <div class="col-md-3 text-right">{{ 100 * systemMetrics['process.cpu.usage'] | number: '1.0-2' }} %</div>
+    <div class="col-md-3 text-end">{{ 100 * systemMetrics['process.cpu.usage'] | number: '1.0-2' }} %</div>
   </div>
 
   <ngb-progressbar [value]="100 * systemMetrics['process.cpu.usage']" [striped]="true" [animated]="false" type="success">
@@ -40,7 +40,7 @@
 
   <div class="row">
     <div class="col-md-9">System CPU usage</div>
-    <div class="col-md-3 text-right">{{ 100 * systemMetrics['system.cpu.usage'] | number: '1.0-2' }} %</div>
+    <div class="col-md-3 text-end">{{ 100 * systemMetrics['system.cpu.usage'] | number: '1.0-2' }} %</div>
   </div>
 
   <ngb-progressbar [value]="100 * systemMetrics['system.cpu.usage']" [striped]="true" [animated]="false" type="success">
@@ -49,21 +49,21 @@
 
   <div class="row">
     <div class="col-md-9">System CPU count</div>
-    <div class="col-md-3 text-right">{{ systemMetrics['system.cpu.count'] }}</div>
+    <div class="col-md-3 text-end">{{ systemMetrics['system.cpu.count'] }}</div>
   </div>
 
   <div class="row">
     <div class="col-md-9">System 1m Load average</div>
-    <div class="col-md-3 text-right">{{ systemMetrics['system.load.average.1m'] | number: '1.0-2' }}</div>
+    <div class="col-md-3 text-end">{{ systemMetrics['system.load.average.1m'] | number: '1.0-2' }}</div>
   </div>
 
   <div class="row">
     <div class="col-md-9">Process files max</div>
-    <div class="col-md-3 text-right">{{ systemMetrics['process.files.max'] | number: '1.0-0' }}</div>
+    <div class="col-md-3 text-end">{{ systemMetrics['process.files.max'] | number: '1.0-0' }}</div>
   </div>
 
   <div class="row">
     <div class="col-md-9">Process files open</div>
-    <div class="col-md-3 text-right">{{ systemMetrics['process.files.open'] | number: '1.0-0' }}</div>
+    <div class="col-md-3 text-end">{{ systemMetrics['process.files.open'] | number: '1.0-0' }}</div>
   </div>
 </ng-container>

package/generators/client/templates/angular/src/main/webapp/app/admin/metrics/metrics.component.html.ejs

@@ -20,7 +20,7 @@
   <h2>
     <span id="metrics-page-heading" <%= jhiPrefix %>Translate="metrics.title" data-cy="metricsPageHeading">Application Metrics</span>
 
-    <button class="btn btn-primary float-right" (click)="refresh()">
+    <button class="btn btn-primary float-end" (click)="refresh()">
       <fa-icon icon="sync"></fa-icon> <span <%= jhiPrefix %>Translate="metrics.refresh.button">Refresh</span>
     </button>
   </h2>

package/generators/client/templates/angular/src/main/webapp/app/admin/user-management/delete/user-management-delete-dialog.component.html.ejs

@@ -20,7 +20,7 @@
   <div class="modal-header">
     <h4 class="modal-title" <%= jhiPrefix %>Translate="entity.delete.title">Confirm delete operation</h4>
 
-    <button type="button" class="close" data-dismiss="modal" aria-hidden="true" (click)="cancel()">&times;</button>
+    <button type="button" class="btn-close" data-dismiss="modal" aria-hidden="true" (click)="cancel()">&times;</button>
   </div>
 
   <div class="modal-body">

package/generators/client/templates/angular/src/main/webapp/app/admin/user-management/detail/user-management-detail.component.html.ejs

@@ -16,7 +16,7 @@
  See the License for the specific language governing permissions and
  limitations under the License.
 -%>
-<div class="row justify-content-center">
+<div class="d-flex justify-content-center">
   <div class="col-8">
     <div *ngIf="user">
       <h2>
@@ -27,8 +27,8 @@
         <dt><span <%= jhiPrefix %>Translate="userManagement.login">Login</span></dt>
         <dd>
           <span>{{ user.login }}</span>
-          <span *ngIf="user.activated" class="badge badge-success" <%= jhiPrefix %>Translate="userManagement.activated">Activated</span>
-          <span *ngIf="!user.activated" class="badge badge-danger" <%= jhiPrefix %>Translate="userManagement.deactivated">Deactivated</span>
+          <span *ngIf="user.activated" class="badge bg-success" <%= jhiPrefix %>Translate="userManagement.activated">Activated</span>
+          <span *ngIf="!user.activated" class="badge bg-danger" <%= jhiPrefix %>Translate="userManagement.deactivated">Deactivated</span>
         </dd>
 
         <dt><span <%= jhiPrefix %>Translate="userManagement.firstName">First Name</span></dt>
@@ -61,7 +61,7 @@
         <dd>
           <ul class="list-unstyled">
             <li *ngFor="let authority of user.authorities">
-              <span class="badge badge-info">{{ authority }}</span>
+              <span class="badge bg-info">{{ authority }}</span>
             </li>
           </ul>
         </dd>