From 334b8f4facb89db306c73c17a603afd05f9b45cb Mon Sep 17 00:00:00 2001
From: Sinan997 <sinanozturk997@gmail.com>
Date: Mon, 1 Apr 2024 10:16:00 +0300
Subject: [PATCH 1/8] use new control flow in account components

---
 .../change-password.component.html            | 30 +++---
 .../forgot-password.component.html            | 57 +++++------
 .../lib/components/login/login.component.html | 18 ++--
 .../manage-profile.component.html             | 86 ++++++++--------
 .../personal-settings.component.html          | 26 ++---
 .../register/register.component.html          | 99 ++++++++++---------
 .../reset-password.component.html             | 78 +++++++--------
 7 files changed, 198 insertions(+), 196 deletions(-)

diff --git a/npm/ng-packs/packages/account/src/lib/components/change-password/change-password.component.html b/npm/ng-packs/packages/account/src/lib/components/change-password/change-password.component.html
index 154b8cfba8..074b6d53ac 100644
--- a/npm/ng-packs/packages/account/src/lib/components/change-password/change-password.component.html
+++ b/npm/ng-packs/packages/account/src/lib/components/change-password/change-password.component.html
@@ -1,18 +1,20 @@
 <form [formGroup]="form" (ngSubmit)="onSubmit()" [mapErrorsFn]="mapErrorsFn" validateOnSubmit class="abp-md-form">
-  <div *ngIf="!hideCurrentPassword" class="mb-3 form-group">
-    <label for="current-password" class="form-label">{{
-      'AbpIdentity::DisplayName:CurrentPassword' | abpLocalization
-    }}</label
-    ><span> * </span
-    ><input
-      type="password"
-      id="current-password"
-      class="form-control"
-      formControlName="password"
-      autofocus
-      autocomplete="current-password"
-    />
-  </div>
+  @if (!hideCurrentPassword) {
+    <div class="mb-3 form-group">
+      <label for="current-password" class="form-label">{{
+        'AbpIdentity::DisplayName:CurrentPassword' | abpLocalization
+      }}</label
+      ><span> * </span
+      ><input
+        type="password"
+        id="current-password"
+        class="form-control"
+        formControlName="password"
+        autofocus
+        autocomplete="current-password"
+      />
+    </div>
+  }
   <div class="mb-3 form-group">
     <label for="new-password" class="form-label">{{
       'AbpIdentity::DisplayName:NewPassword' | abpLocalization
diff --git a/npm/ng-packs/packages/account/src/lib/components/forgot-password/forgot-password.component.html b/npm/ng-packs/packages/account/src/lib/components/forgot-password/forgot-password.component.html
index 7fd02e7a0b..248faae625 100644
--- a/npm/ng-packs/packages/account/src/lib/components/forgot-password/forgot-password.component.html
+++ b/npm/ng-packs/packages/account/src/lib/components/forgot-password/forgot-password.component.html
@@ -1,35 +1,30 @@
 <h4>{{ 'AbpAccount::ForgotPassword' | abpLocalization }}</h4>
 
-<form
-  *ngIf="!isEmailSent; else emailSentTemplate"
-  [formGroup]="form"
-  (ngSubmit)="onSubmit()"
-  validateOnSubmit
->
-  <p>{{ 'AbpAccount::SendPasswordResetLink_Information' | abpLocalization }}</p>
-  <div class="mb-3 form-group">
-    <label for="input-email-address" class="form-label">{{
-      'AbpAccount::EmailAddress' | abpLocalization
-    }}</label
-    ><span> * </span>
-    <input type="email" id="input-email-address" class="form-control" formControlName="email" />
-  </div>
-  <abp-button
-    class="d-block"
-    buttonClass="mt-2 mb-3 btn btn-primary btn-block"
-    [loading]="inProgress"
-    buttonType="submit"
-    [disabled]="form?.invalid"
-  >
-    {{ 'AbpAccount::Submit' | abpLocalization }}
-  </abp-button>
-  <a routerLink="/account/login"
-    ><i class="fa fa-long-arrow-left me-1" aria-hidden="true"></i
-    >{{ 'AbpAccount::Login' | abpLocalization }}</a
-  >
-</form>
-
-<ng-template #emailSentTemplate>
+@if (!isEmailSent) {
+  <form [formGroup]="form" (ngSubmit)="onSubmit()" validateOnSubmit>
+    <p>{{ 'AbpAccount::SendPasswordResetLink_Information' | abpLocalization }}</p>
+    <div class="mb-3 form-group">
+      <label for="input-email-address" class="form-label">{{
+        'AbpAccount::EmailAddress' | abpLocalization
+      }}</label
+      ><span> * </span>
+      <input type="email" id="input-email-address" class="form-control" formControlName="email" />
+    </div>
+    <abp-button
+      class="d-block"
+      buttonClass="mt-2 mb-3 btn btn-primary btn-block"
+      [loading]="inProgress"
+      buttonType="submit"
+      [disabled]="form?.invalid"
+    >
+      {{ 'AbpAccount::Submit' | abpLocalization }}
+    </abp-button>
+    <a routerLink="/account/login"
+      ><i class="fa fa-long-arrow-left me-1" aria-hidden="true"></i
+      >{{ 'AbpAccount::Login' | abpLocalization }}</a
+    >
+  </form>
+} @else {
   <p>
     {{ 'AbpAccount::PasswordResetMailSentMessage' | abpLocalization }}
   </p>
@@ -40,4 +35,4 @@
       {{ 'AbpAccount::BackToLogin' | abpLocalization }}
     </button>
   </a>
-</ng-template>
+}
diff --git a/npm/ng-packs/packages/account/src/lib/components/login/login.component.html b/npm/ng-packs/packages/account/src/lib/components/login/login.component.html
index 6e288bd1ce..4919253456 100644
--- a/npm/ng-packs/packages/account/src/lib/components/login/login.component.html
+++ b/npm/ng-packs/packages/account/src/lib/components/login/login.component.html
@@ -1,10 +1,12 @@
 <h4>{{ 'AbpAccount::Login' | abpLocalization }}</h4>
-<strong *ngIf="isSelfRegistrationEnabled">
-  {{ 'AbpAccount::AreYouANewUser' | abpLocalization }}
-  <a class="text-decoration-none" routerLink="/account/register" queryParamsHandling="preserve">{{
-    'AbpAccount::Register' | abpLocalization
-  }}</a>
-</strong>
+@if (isSelfRegistrationEnabled) {
+  <strong>
+    {{ 'AbpAccount::AreYouANewUser' | abpLocalization }}
+    <a class="text-decoration-none" routerLink="/account/register" queryParamsHandling="preserve">{{
+      'AbpAccount::Register' | abpLocalization
+    }}</a>
+  </strong>
+}
 <form [formGroup]="form" (ngSubmit)="onSubmit()" validateOnSubmit class="mt-4">
   <div class="mb-3 form-group">
     <label for="login-input-user-name-or-email-address" class="form-label">{{
@@ -20,7 +22,9 @@
     />
   </div>
   <div class="mb-3 form-group">
-    <label for="login-input-password" class="form-label">{{ 'AbpAccount::Password' | abpLocalization }}</label>
+    <label for="login-input-password" class="form-label">{{
+      'AbpAccount::Password' | abpLocalization
+    }}</label>
     <input
       class="form-control"
       type="password"
diff --git a/npm/ng-packs/packages/account/src/lib/components/manage-profile/manage-profile.component.html b/npm/ng-packs/packages/account/src/lib/components/manage-profile/manage-profile.component.html
index 19758029e5..6eff5e9ed6 100644
--- a/npm/ng-packs/packages/account/src/lib/components/manage-profile/manage-profile.component.html
+++ b/npm/ng-packs/packages/account/src/lib/components/manage-profile/manage-profile.component.html
@@ -1,22 +1,20 @@
 <div id="AbpContentToolbar"></div>
-<div class="card border-0 shadow-sm min-h-400" [abpLoading]="!(profile$ | async)?.userName" >
+<div class="card border-0 shadow-sm min-h-400" [abpLoading]="!(profile$ | async)?.userName">
   <div class="card-body">
     <div class="row">
       <div class="col-12 col-md-3">
         <ul class="nav flex-column nav-pills" id="nav-tab" role="tablist">
-          <li
-            *ngIf="!hideChangePasswordTab && (profile$ | async)"
-            class="nav-item"
-            (click)="selectedTab = 0"
-          >
-            <a
-              class="nav-link"
-              [ngClass]="{ active: selectedTab === 0 }"
-              role="tab"
-              href="javascript:void(0)"
-              >{{ 'AbpUi::ChangePassword' | abpLocalization }}</a
-            >
-          </li>
+          @if (!hideChangePasswordTab && (profile$ | async)) {
+            <li class="nav-item" (click)="selectedTab = 0">
+              <a
+                class="nav-link"
+                [ngClass]="{ active: selectedTab === 0 }"
+                role="tab"
+                href="javascript:void(0)"
+                >{{ 'AbpUi::ChangePassword' | abpLocalization }}</a
+              >
+            </li>
+          }
           <li class="nav-item mb-2" (click)="selectedTab = 1">
             <a
               class="nav-link"
@@ -28,34 +26,40 @@
           </li>
         </ul>
       </div>
-      <div *ngIf="profile$ | async" class="col-12 col-md-9">
-        <div class="tab-content" *ngIf="selectedTab === 0" [@fadeIn]>
-          <div class="tab-pane active" role="tabpanel">
-            <h4>
-              {{ 'AbpIdentity::ChangePassword' | abpLocalization }}
-              <hr />
-            </h4>
-            <abp-change-password-form
-              *abpReplaceableTemplate="{
-                componentKey: changePasswordKey
-              }"
-            ></abp-change-password-form>
-          </div>
+      @if (profile$ | async) {
+        <div class="col-12 col-md-9">
+          @if (selectedTab === 0) {
+            <div class="tab-content" [@fadeIn]>
+              <div class="tab-pane active" role="tabpanel">
+                <h4>
+                  {{ 'AbpIdentity::ChangePassword' | abpLocalization }}
+                  <hr />
+                </h4>
+                <abp-change-password-form
+                  *abpReplaceableTemplate="{
+                    componentKey: changePasswordKey
+                  }"
+                ></abp-change-password-form>
+              </div>
+            </div>
+          }
+          @if (selectedTab === 1) {
+            <div class="tab-content" [@fadeIn]>
+              <div class="tab-pane active" role="tabpanel">
+                <h4>
+                  {{ 'AbpIdentity::PersonalSettings' | abpLocalization }}
+                  <hr />
+                </h4>
+                <abp-personal-settings-form
+                  *abpReplaceableTemplate="{
+                    componentKey: personalSettingsKey
+                  }"
+                ></abp-personal-settings-form>
+              </div>
+            </div>
+          }
         </div>
-        <div class="tab-content" *ngIf="selectedTab === 1" [@fadeIn]>
-          <div class="tab-pane active" role="tabpanel">
-            <h4>
-              {{ 'AbpIdentity::PersonalSettings' | abpLocalization }}
-              <hr />
-            </h4>
-            <abp-personal-settings-form
-              *abpReplaceableTemplate="{
-                componentKey: personalSettingsKey
-              }"
-            ></abp-personal-settings-form>
-          </div>
-        </div>
-      </div>
+      }
     </div>
   </div>
 </div>
diff --git a/npm/ng-packs/packages/account/src/lib/components/personal-settings/personal-settings.component.html b/npm/ng-packs/packages/account/src/lib/components/personal-settings/personal-settings.component.html
index 0dbb5a4ce0..e77bb8f071 100644
--- a/npm/ng-packs/packages/account/src/lib/components/personal-settings/personal-settings.component.html
+++ b/npm/ng-packs/packages/account/src/lib/components/personal-settings/personal-settings.component.html
@@ -1,12 +1,14 @@
-<form [formGroup]="form"   *ngIf="form"  (ngSubmit)="submit()" validateOnSubmit class="abp-md-form">
-  <abp-extensible-form [selectedRecord]="selected"></abp-extensible-form>
-
-  <abp-button
-    buttonType="submit"
-    iconClass="fa fa-check"
-    buttonClass="btn btn-primary color-white"
-    [loading]="inProgress"
-  >
-    {{ 'AbpIdentity::Save' | abpLocalization }}</abp-button
-  >
-</form>
+@if (form) {
+  <form [formGroup]="form" (ngSubmit)="submit()" validateOnSubmit class="abp-md-form">
+    <abp-extensible-form [selectedRecord]="selected"></abp-extensible-form>
+  
+    <abp-button
+      buttonType="submit"
+      iconClass="fa fa-check"
+      buttonClass="btn btn-primary color-white"
+      [loading]="inProgress"
+    >
+      {{ 'AbpIdentity::Save' | abpLocalization }}</abp-button
+    >
+  </form>
+}
diff --git a/npm/ng-packs/packages/account/src/lib/components/register/register.component.html b/npm/ng-packs/packages/account/src/lib/components/register/register.component.html
index 33a564003e..efea7c2bcf 100644
--- a/npm/ng-packs/packages/account/src/lib/components/register/register.component.html
+++ b/npm/ng-packs/packages/account/src/lib/components/register/register.component.html
@@ -5,53 +5,54 @@
     'AbpAccount::Login' | abpLocalization
   }}</a>
 </strong>
-<form
-  *ngIf="isSelfRegistrationEnabled"
-  [formGroup]="form"
-  (ngSubmit)="onSubmit()"
-  validateOnSubmit
-  class="mt-4"
->
-  <div class="mb-3 form-group">
-    <label for="input-user-name" class="form-label">{{
-      'AbpAccount::UserName' | abpLocalization
-    }}</label
-    ><span> * </span
-    ><input
-      autofocus
-      type="text"
-      id="input-user-name"
-      class="form-control"
-      formControlName="username"
-      autocomplete="username"
-    />
-  </div>
-  <div class="mb-3 form-group">
-    <label for="input-email-address" class="form-label">{{
-      'AbpAccount::EmailAddress' | abpLocalization
-    }}</label
-    ><span> * </span
-    ><input type="email" id="input-email-address" class="form-control" formControlName="email" />
-  </div>
-  <div class="mb-3 form-group">
-    <label for="input-password" class="form-label">{{
-      'AbpAccount::Password' | abpLocalization
-    }}</label
-    ><span> * </span
-    ><input
-      type="password"
-      id="input-password"
-      class="form-control"
-      formControlName="password"
-      autocomplete="current-password"
-    />
-  </div>
-  <abp-button
-    [loading]="inProgress"
-    buttonType="submit"
-    name="Action"
-    buttonClass="btn-block btn-lg mt-3 btn btn-primary"
+@if (isSelfRegistrationEnabled) {
+  <form
+    [formGroup]="form"
+    (ngSubmit)="onSubmit()"
+    validateOnSubmit
+    class="mt-4"
   >
-    {{ 'AbpAccount::Register' | abpLocalization }}
-  </abp-button>
-</form>
+    <div class="mb-3 form-group">
+      <label for="input-user-name" class="form-label">{{
+        'AbpAccount::UserName' | abpLocalization
+      }}</label
+      ><span> * </span
+      ><input
+        autofocus
+        type="text"
+        id="input-user-name"
+        class="form-control"
+        formControlName="username"
+        autocomplete="username"
+      />
+    </div>
+    <div class="mb-3 form-group">
+      <label for="input-email-address" class="form-label">{{
+        'AbpAccount::EmailAddress' | abpLocalization
+      }}</label
+      ><span> * </span
+      ><input type="email" id="input-email-address" class="form-control" formControlName="email" />
+    </div>
+    <div class="mb-3 form-group">
+      <label for="input-password" class="form-label">{{
+        'AbpAccount::Password' | abpLocalization
+      }}</label
+      ><span> * </span
+      ><input
+        type="password"
+        id="input-password"
+        class="form-control"
+        formControlName="password"
+        autocomplete="current-password"
+      />
+    </div>
+    <abp-button
+      [loading]="inProgress"
+      buttonType="submit"
+      name="Action"
+      buttonClass="btn-block btn-lg mt-3 btn btn-primary"
+    >
+      {{ 'AbpAccount::Register' | abpLocalization }}
+    </abp-button>
+  </form>
+}
diff --git a/npm/ng-packs/packages/account/src/lib/components/reset-password/reset-password.component.html b/npm/ng-packs/packages/account/src/lib/components/reset-password/reset-password.component.html
index 8777254cfd..cfcb5ffdfa 100644
--- a/npm/ng-packs/packages/account/src/lib/components/reset-password/reset-password.component.html
+++ b/npm/ng-packs/packages/account/src/lib/components/reset-password/reset-password.component.html
@@ -1,46 +1,40 @@
 <h4>{{ 'AbpAccount::ResetPassword' | abpLocalization }}</h4>
 
-<form
-  *ngIf="!isPasswordReset; else passwordResetTemplate"
-  [formGroup]="form"
-  [mapErrorsFn]="mapErrorsFn"
-  (ngSubmit)="onSubmit()"
-  validateOnSubmit
->
-  <p>{{ 'AbpAccount::ResetPassword_Information' | abpLocalization }}</p>
-  <div class="mb-3 form-group">
-    <label for="input-password" class="form-label">{{
-      'AbpAccount::Password' | abpLocalization
-    }}</label
-    ><span> * </span>
-    <input type="password" id="input-password" class="form-control" formControlName="password" />
-  </div>
-  <div class="mb-3 form-group">
-    <label for="input-confirm-password" class="form-label">{{
-      'AbpAccount::ConfirmPassword' | abpLocalization
-    }}</label
-    ><span> * </span>
-    <input
-      type="password"
-      id="input-confirm-password"
-      class="form-control"
-      formControlName="confirmPassword"
-    />
-  </div>
-  <button class="me-2 btn btn-outline-primary" type="button" routerLink="/account/login">
-    {{ 'AbpAccount::Cancel' | abpLocalization }}
-  </button>
-  <abp-button
-    buttonType="submit"
-    buttonClass="me-2 btn btn-primary"
-    [loading]="inProgress"
-    (click)="onSubmit()"
-  >
-    {{ 'AbpAccount::Submit' | abpLocalization }}
-  </abp-button>
-</form>
-
-<ng-template #passwordResetTemplate>
+@if (!isPasswordReset) {
+  <form [formGroup]="form" [mapErrorsFn]="mapErrorsFn" (ngSubmit)="onSubmit()" validateOnSubmit>
+    <p>{{ 'AbpAccount::ResetPassword_Information' | abpLocalization }}</p>
+    <div class="mb-3 form-group">
+      <label for="input-password" class="form-label">{{
+        'AbpAccount::Password' | abpLocalization
+      }}</label
+      ><span> * </span>
+      <input type="password" id="input-password" class="form-control" formControlName="password" />
+    </div>
+    <div class="mb-3 form-group">
+      <label for="input-confirm-password" class="form-label">{{
+        'AbpAccount::ConfirmPassword' | abpLocalization
+      }}</label
+      ><span> * </span>
+      <input
+        type="password"
+        id="input-confirm-password"
+        class="form-control"
+        formControlName="confirmPassword"
+      />
+    </div>
+    <button class="me-2 btn btn-outline-primary" type="button" routerLink="/account/login">
+      {{ 'AbpAccount::Cancel' | abpLocalization }}
+    </button>
+    <abp-button
+      buttonType="submit"
+      buttonClass="me-2 btn btn-primary"
+      [loading]="inProgress"
+      (click)="onSubmit()"
+    >
+      {{ 'AbpAccount::Submit' | abpLocalization }}
+    </abp-button>
+  </form>
+} @else {
   <p>
     {{ 'AbpAccount::YourPasswordIsSuccessfullyReset' | abpLocalization }}
   </p>
@@ -50,4 +44,4 @@
       {{ 'AbpAccount::BackToLogin' | abpLocalization }}
     </button>
   </a>
-</ng-template>
+}

From e0eaea6af504531713859f29cba77ca01d92f9ba Mon Sep 17 00:00:00 2001
From: Sinan997 <sinanozturk997@gmail.com>
Date: Mon, 1 Apr 2024 10:58:22 +0300
Subject: [PATCH 2/8] use new control flow in `components` package

---
 .../extensible-form-prop.component.html       | 33 +++++----
 .../components/page/src/page.component.html   | 70 +++++++++----------
 .../src/lib/components/tree.component.html    | 37 +++++-----
 3 files changed, 70 insertions(+), 70 deletions(-)

diff --git a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.html b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.html
index 1f8833f929..c419da1b6f 100644
--- a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.html
+++ b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.html
@@ -1,4 +1,7 @@
-<ng-container [ngSwitch]="getComponent(prop)" *abpPermission="prop.permission; runChangeDetection: false">
+<ng-container
+  [ngSwitch]="getComponent(prop)"
+  *abpPermission="prop.permission; runChangeDetection: false"
+>
   <ng-template ngSwitchCase="template">
     <ng-container *ngComponentOutlet="prop.template; injector: injectorForCustomComponent">
     </ng-container>
@@ -50,9 +53,7 @@
         class="form-select form-control"
       >
         @for (option of options$ | async; track option.value) {
-          <option
-            [ngValue]="option.value"
-          >
+          <option [ngValue]="option.value">
             {{ option.key }}
           </option>
         }
@@ -69,12 +70,11 @@
         multiple="multiple"
         class="form-select form-control"
       >
-        <option
-          *ngFor="let option of options$ | async; trackBy: track.by('value')"
-          [ngValue]="option.value"
-        >
-          {{ option.key }}
-        </option>
+        @for (options of options$ | asnyc; track option.value) {
+          <option [ngValue]="option.value">
+            {{ option.key }}
+          </option>
+        }
       </select>
     </ng-template>
 
@@ -160,9 +160,7 @@
     </ng-template>
 
     @if (prop.formText) {
-    <small class="text-muted d-block">{{
-      prop.formText | abpLocalization
-    }}</small>
+      <small class="text-muted d-block">{{ prop.formText | abpLocalization }}</small>
     }
   </div>
 </ng-container>
@@ -171,12 +169,17 @@
   <label [htmlFor]="prop.id" [ngClass]="classes || 'form-label'">
     @if (prop.displayTextResolver) {
       {{ prop.displayTextResolver(data) | abpLocalization }}
-    }@else{
+    } @else {
       {{ prop.displayName | abpLocalization }}
     }
     {{ asterisk }}
     @if (prop.tooltip) {
-      <i [ngbTooltip]="prop.tooltip.text | abpLocalization" [placement]="prop.tooltip.placement || 'auto'"  container="body" class="bi bi-info-circle"></i>
+      <i
+        [ngbTooltip]="prop.tooltip.text | abpLocalization"
+        [placement]="prop.tooltip.placement || 'auto'"
+        container="body"
+        class="bi bi-info-circle"
+      ></i>
     }
   </label>
 </ng-template>
diff --git a/npm/ng-packs/packages/components/page/src/page.component.html b/npm/ng-packs/packages/components/page/src/page.component.html
index 5a4a5cc66c..ee32f2e5e2 100644
--- a/npm/ng-packs/packages/components/page/src/page.component.html
+++ b/npm/ng-packs/packages/components/page/src/page.component.html
@@ -1,41 +1,37 @@
-<div class="row entry-row" *ngIf="shouldRenderRow">
-  <ng-container *ngIf="customTitle; else defaultTitleTemplate">
-    <ng-content select="abp-page-title-container"></ng-content>
-  </ng-container>
+@if (shouldRenderRow) {
+  <div class="row entry-row">
+    @if (customTitle) {
+      <ng-content select="abp-page-title-container"></ng-content>
+    } @else {
+      @if (title) {
+        <div class="col-auto" *abpPagePart="pageParts.title">
+          <h1 class="content-header-title">
+            {{ title }}
+          </h1>
+        </div>
+      }
+    }
 
-  <ng-container *ngIf="customBreadcrumb; else defaultBreadcrumbTemplate">
-    <ng-content select="abp-page-breadcrumb-container"></ng-content>
-  </ng-container>
+    @if (customBreadcrumb) {
+      <ng-content select="abp-page-breadcrumb-container"></ng-content>
+    } @else {
+      @if (breadcrumb) {
+        <div class="col-lg-auto ps-lg-0" *abpPagePart="pageParts.breadcrumb">
+          <abp-breadcrumb></abp-breadcrumb>
+        </div>
+      }
+    }
 
-  <ng-container *ngIf="customToolbar; else defaultPageToolbarTemplate">
-    <ng-content select="abp-page-toolbar-container"></ng-content>
-  </ng-container>
-</div>
+    @if (customToolbar) {
+      <ng-content select="abp-page-toolbar-container"></ng-content>
+    } @else {
+      @if (toolbarVisible) {
+        <div class="col" *abpPagePart="pageParts.toolbar; context: toolbarData">
+          <abp-page-toolbar [record]="toolbarData"></abp-page-toolbar>
+        </div>
+      }
+    }
+  </div>
+}
 
 <ng-content></ng-content>
-
-<ng-template #defaultTitleTemplate>
-  <ng-container *ngIf="title">
-    <div class="col-auto" *abpPagePart="pageParts.title">
-      <h1 class="content-header-title">
-        {{ title }}
-      </h1>
-    </div>
-  </ng-container>
-</ng-template>
-
-<ng-template #defaultBreadcrumbTemplate>
-  <ng-container *ngIf="breadcrumb">
-    <div class="col-lg-auto ps-lg-0" *abpPagePart="pageParts.breadcrumb">
-      <abp-breadcrumb></abp-breadcrumb>
-    </div>
-  </ng-container>
-</ng-template>
-
-<ng-template #defaultPageToolbarTemplate>
-  <ng-container *ngIf="toolbarVisible">
-    <div class="col" *abpPagePart="pageParts.toolbar; context: toolbarData">
-      <abp-page-toolbar [record]="toolbarData"></abp-page-toolbar>
-    </div>
-  </ng-container>
-</ng-template>
diff --git a/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.html b/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.html
index ea0d6b1459..b670b0ed48 100644
--- a/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.html
+++ b/npm/ng-packs/packages/components/tree/src/lib/components/tree.component.html
@@ -32,25 +32,26 @@
         ></ng-container>
       </div>
 
-      <div
-        #dropdown="ngbDropdown"
-        *ngIf="menu"
-        class="d-inline-block ms-1"
-        ngbDropdown
-        placement="bottom"
-        container="body"
-        (abpInit)="initDropdown(node.key, dropdown)"
-      >
-        <i
-          class="fas fa-caret-down text-muted"
-          ngbDropdownToggle
-          [class.dropdown-toggle]="false"
-          aria-hidden="true"
-        ></i>
-        <div ngbDropdownMenu>
-          <ng-template *ngTemplateOutlet="menu; context: { $implicit: node }"></ng-template>
+      @if (menu) {
+        <div
+          #dropdown="ngbDropdown"
+          class="d-inline-block ms-1"
+          ngbDropdown
+          placement="bottom"
+          container="body"
+          (abpInit)="initDropdown(node.key, dropdown)"
+        >
+          <i
+            class="fas fa-caret-down text-muted"
+            ngbDropdownToggle
+            [class.dropdown-toggle]="false"
+            aria-hidden="true"
+          ></i>
+          <div ngbDropdownMenu>
+            <ng-template *ngTemplateOutlet="menu; context: { $implicit: node }"></ng-template>
+          </div>
         </div>
-      </div>
+      }
     </ng-template>
 
     <ng-template #defaultNodeTemplate let-node>

From 0c887d072f33ba3790530e33b26870b79e618bfc Mon Sep 17 00:00:00 2001
From: Sinan997 <sinanozturk997@gmail.com>
Date: Mon, 1 Apr 2024 11:20:04 +0300
Subject: [PATCH 3/8] use new control flow in `core` package

---
 .../components/dynamic-layout.component.ts    | 66 ++++++++-----------
 1 file changed, 28 insertions(+), 38 deletions(-)

diff --git a/npm/ng-packs/packages/core/src/lib/components/dynamic-layout.component.ts b/npm/ng-packs/packages/core/src/lib/components/dynamic-layout.component.ts
index 5118f7ec42..cc95c02118 100644
--- a/npm/ng-packs/packages/core/src/lib/components/dynamic-layout.component.ts
+++ b/npm/ng-packs/packages/core/src/lib/components/dynamic-layout.component.ts
@@ -1,49 +1,41 @@
-import {
-  Component,
-  inject,
-  isDevMode,
-  OnInit,
-  Optional,
-  SkipSelf,
-  Type
-} from '@angular/core';
-import {ActivatedRoute, Router} from '@angular/router';
-import {eLayoutType} from '../enums/common';
-import {ABP} from '../models';
-import {ReplaceableComponents} from '../models/replaceable-components';
-import {LocalizationService} from '../services/localization.service';
-import {ReplaceableComponentsService} from '../services/replaceable-components.service';
-import {RouterEvents} from '../services/router-events.service';
-import {RoutesService} from '../services/routes.service';
-import {SubscriptionService} from '../services/subscription.service';
-import {findRoute, getRoutePath} from '../utils/route-utils';
-import {TreeNode} from '../utils/tree-utils';
-import {DYNAMIC_LAYOUTS_TOKEN} from "../tokens/dynamic-layout.token";
+import { Component, inject, isDevMode, OnInit, Optional, SkipSelf, Type } from '@angular/core';
+import { ActivatedRoute, Router } from '@angular/router';
+import { eLayoutType } from '../enums/common';
+import { ABP } from '../models';
+import { ReplaceableComponents } from '../models/replaceable-components';
+import { LocalizationService } from '../services/localization.service';
+import { ReplaceableComponentsService } from '../services/replaceable-components.service';
+import { RouterEvents } from '../services/router-events.service';
+import { RoutesService } from '../services/routes.service';
+import { SubscriptionService } from '../services/subscription.service';
+import { findRoute, getRoutePath } from '../utils/route-utils';
+import { TreeNode } from '../utils/tree-utils';
+import { DYNAMIC_LAYOUTS_TOKEN } from '../tokens/dynamic-layout.token';
 
 @Component({
   selector: 'abp-dynamic-layout',
   template: `
-    <ng-container *ngIf="isLayoutVisible" [ngComponentOutlet]="layout"></ng-container> `,
+    @if (isLayoutVisible) {
+      <ng-container [ngComponentOutlet]="layout"></ng-container>
+    }
+  `,
   providers: [SubscriptionService],
 })
 export class DynamicLayoutComponent implements OnInit {
   layout?: Type<any>;
   layoutKey?: eLayoutType;
-  readonly layouts = inject(DYNAMIC_LAYOUTS_TOKEN)
+  readonly layouts = inject(DYNAMIC_LAYOUTS_TOKEN);
   isLayoutVisible = true;
 
   private readonly router = inject(Router);
   private readonly route = inject(ActivatedRoute);
   private readonly routes = inject(RoutesService);
-  private localizationService = inject(LocalizationService)
-  private replaceableComponents = inject(ReplaceableComponentsService)
-  private subscription = inject(SubscriptionService)
-  private routerEvents = inject(RouterEvents)
-
+  private localizationService = inject(LocalizationService);
+  private replaceableComponents = inject(ReplaceableComponentsService);
+  private subscription = inject(SubscriptionService);
+  private routerEvents = inject(RouterEvents);
 
-  constructor(
-    @Optional() @SkipSelf() dynamicLayoutComponent: DynamicLayoutComponent,
-  ) {
+  constructor(@Optional() @SkipSelf() dynamicLayoutComponent: DynamicLayoutComponent) {
     if (dynamicLayoutComponent) {
       if (isDevMode()) console.warn('DynamicLayoutComponent must be used only in AppComponent.');
       return;
@@ -56,7 +48,7 @@ export class DynamicLayoutComponent implements OnInit {
     if (this.layout) {
       return;
     }
-    this.getLayout()
+    this.getLayout();
   }
 
   private checkLayoutOnNavigationEnd() {
@@ -64,11 +56,9 @@ export class DynamicLayoutComponent implements OnInit {
     this.subscription.addOne(navigationEnd$, () => this.getLayout());
   }
 
-
   private getLayout() {
     let expectedLayout = this.getExtractedLayout();
 
-
     if (!expectedLayout) expectedLayout = eLayoutType.empty;
 
     if (this.layoutKey === expectedLayout) return;
@@ -84,7 +74,7 @@ export class DynamicLayoutComponent implements OnInit {
   }
 
   private getExtractedLayout() {
-    const routeData = (this.route.snapshot.data || {});
+    const routeData = this.route.snapshot.data || {};
     let expectedLayout = routeData['layout'] as eLayoutType;
 
     if (expectedLayout) {
@@ -92,7 +82,7 @@ export class DynamicLayoutComponent implements OnInit {
     }
 
     let node = findRoute(this.routes, getRoutePath(this.router));
-    node = {parent: node} as TreeNode<ABP.Route>;
+    node = { parent: node } as TreeNode<ABP.Route>;
 
     while (node.parent) {
       node = node.parent;
@@ -108,12 +98,12 @@ export class DynamicLayoutComponent implements OnInit {
   showLayoutNotFoundError(layoutName: string) {
     let message = `Layout ${layoutName} not found.`;
     if (layoutName === 'account') {
-      message = 'Account layout not found. Please check your configuration. If you are using LeptonX, please make sure you have added "AccountLayoutModule.forRoot()" to your app.module configuration.';
+      message =
+        'Account layout not found. Please check your configuration. If you are using LeptonX, please make sure you have added "AccountLayoutModule.forRoot()" to your app.module configuration.';
     }
     console.warn(message);
   }
 
-
   private listenToLanguageChange() {
     this.subscription.addOne(this.localizationService.languageChange$, () => {
       this.isLayoutVisible = false;

From 5b48fe651d526d0ed55c0c12eafa436d7353f2a6 Mon Sep 17 00:00:00 2001
From: Sinan997 <sinanozturk997@gmail.com>
Date: Mon, 1 Apr 2024 14:13:17 +0300
Subject: [PATCH 4/8] use new control flow in `feature-management` package

---
 .../extensible-form-prop.component.html       | 171 ++++++++++-
 .../feature-management.component.html         | 280 +++++++++---------
 2 files changed, 317 insertions(+), 134 deletions(-)

diff --git a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.html b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.html
index c419da1b6f..452ac38d09 100644
--- a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.html
+++ b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.html
@@ -1,4 +1,171 @@
-<ng-container
+<ng-container *abpPermission="prop.permission; runChangeDetection: false">
+  @switch (getComponent(prop)) {
+    @case ('template') {
+      <ng-container *ngComponentOutlet="prop.template; injector: injectorForCustomComponent">
+      </ng-container>
+    }
+  }
+
+  <div [ngClass]="containerClassName" class="mb-2">
+    @switch (getComponent(prop)) {
+      @case ('input') {
+        <ng-template [ngTemplateOutlet]="label"></ng-template>
+        <input
+          #field
+          [id]="prop.id"
+          [formControlName]="prop.name"
+          [autocomplete]="prop.autocomplete"
+          [type]="getType(prop)"
+          [abpDisabled]="disabled"
+          [readonly]="readonly"
+          class="form-control"
+        />
+      }
+
+      @case ('hidden') {
+        <input [formControlName]="prop.name" type="hidden" />
+      }
+
+      @case ('checkbox') {
+        <div class="form-check" validationTarget>
+          <input
+            #field
+            [id]="prop.id"
+            [formControlName]="prop.name"
+            [abpDisabled]="disabled"
+            type="checkbox"
+            class="form-check-input"
+          />
+          <ng-template
+            [ngTemplateOutlet]="label"
+            [ngTemplateOutletContext]="{ $implicit: 'form-check-label' }"
+          ></ng-template>
+        </div>
+      }
+
+      @case ('select') {
+        <ng-template [ngTemplateOutlet]="label"></ng-template>
+        <select
+          #field
+          [id]="prop.id"
+          [formControlName]="prop.name"
+          [abpDisabled]="disabled"
+          class="form-select form-control"
+        >
+          @for (option of options$ | async; track option.value) {
+            <option [ngValue]="option.value">
+              {{ option.key }}
+            </option>
+          }
+        </select>
+      }
+
+      @case ('multiselect') {
+        <ng-template [ngTemplateOutlet]="label"></ng-template>
+        <select
+          #field
+          [id]="prop.id"
+          [formControlName]="prop.name"
+          [abpDisabled]="disabled"
+          multiple="multiple"
+          class="form-select form-control"
+        >
+          @for (options of options$ | asnyc; track option.value) {
+            <option [ngValue]="option.value">
+              {{ option.key }}
+            </option>
+          }
+        </select>
+      }
+
+      @case ('typeahead') {
+        <ng-template [ngTemplateOutlet]="label"></ng-template>
+        <div #typeahead class="position-relative" validationStyle validationTarget>
+          <input
+            #field
+            [id]="prop.id"
+            [autocomplete]="prop.autocomplete"
+            [abpDisabled]="disabled"
+            [ngbTypeahead]="search"
+            [editable]="false"
+            [inputFormatter]="typeaheadFormatter"
+            [resultFormatter]="typeaheadFormatter"
+            [ngModelOptions]="{ standalone: true }"
+            [(ngModel)]="typeaheadModel"
+            (selectItem)="setTypeaheadValue($event.item)"
+            (blur)="setTypeaheadValue(typeaheadModel)"
+            [class.is-invalid]="typeahead.classList.contains('is-invalid')"
+            class="form-control"
+          />
+          <input [formControlName]="prop.name" type="hidden" />
+        </div>
+      }
+
+      @case ('date') {
+        <ng-template [ngTemplateOutlet]="label"></ng-template>
+        <input
+          [id]="prop.id"
+          [formControlName]="prop.name"
+          (click)="datepicker.open()"
+          (keyup.space)="datepicker.open()"
+          ngbDatepicker
+          #datepicker="ngbDatepicker"
+          type="text"
+          class="form-control"
+        />
+      }
+      @case ('time') {
+        <ng-template [ngTemplateOutlet]="label"></ng-template>
+        <ngb-timepicker [formControlName]="prop.name"></ngb-timepicker>
+      }
+
+      @case ('dateTime') {
+        <ng-template [ngTemplateOutlet]="label"></ng-template>
+        <abp-extensible-date-time-picker [prop]="prop" [meridian]="meridian$ | async" />
+      }
+
+      @case ('textarea') {
+        <ng-template [ngTemplateOutlet]="label"></ng-template>
+        <textarea
+          #field
+          [id]="prop.id"
+          [formControlName]="prop.name"
+          [abpDisabled]="disabled"
+          [readonly]="readonly"
+          class="form-control"
+        ></textarea>
+      }
+
+      @case ('passwordinputgroup') {
+        <ng-template [ngTemplateOutlet]="label"></ng-template>
+        <div class="input-group form-group" validationTarget>
+          <input
+            class="form-control"
+            [id]="prop.id"
+            [formControlName]="prop.name"
+            [abpShowPassword]="showPassword"
+          />
+          <button class="btn btn-secondary" type="button" (click)="showPassword = !showPassword">
+            <i
+              class="fa"
+              aria-hidden="true"
+              [ngClass]="{
+                'fa-eye-slash': !showPassword,
+                'fa-eye': showPassword
+              }"
+            ></i>
+          </button>
+        </div>
+      }
+    }
+
+    @if (prop.formText) {
+      <small class="text-muted d-block">{{ prop.formText | abpLocalization }}</small>
+    }
+  </div>
+</ng-container>
+
+<!-- <ng-container
   [ngSwitch]="getComponent(prop)"
   *abpPermission="prop.permission; runChangeDetection: false"
 >
@@ -163,7 +330,7 @@
       <small class="text-muted d-block">{{ prop.formText | abpLocalization }}</small>
     }
   </div>
-</ng-container>
+</ng-container> -->
 
 <ng-template #label let-classes>
   <label [htmlFor]="prop.id" [ngClass]="classes || 'form-label'">
diff --git a/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.html b/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.html
index a3324960e0..f1bc85ac3d 100644
--- a/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.html
+++ b/npm/ng-packs/packages/feature-management/src/lib/components/feature-management/feature-management.component.html
@@ -1,145 +1,161 @@
-<abp-modal *ngIf="visible" [(visible)]="visible" [busy]="modalBusy" [options]="{ size: 'lg' }">
-  <ng-template #abpHeader>
-    <h3>{{ 'AbpFeatureManagement::Features' | abpLocalization }}</h3>
-  </ng-template>
+@if (visible) {
+  <abp-modal [(visible)]="visible" [busy]="modalBusy" [options]="{ size: 'lg' }">
+    <ng-template #abpHeader>
+      <h3>{{ 'AbpFeatureManagement::Features' | abpLocalization }}</h3>
+    </ng-template>
 
-  <ng-template #abpBody>
-    <div class="row">
-      <ng-container *ngIf="groups.length">
-        <div class="col-md-4">
-          <ul
-            ngbNav
-            #nav="ngbNav"
-            [(activeId)]="selectedGroupDisplayName"
-            class="nav-pills"
-            orientation="vertical"
-          >
-            <li
-              *ngFor="let group of groups; trackBy: track.by('name')"
-              [ngbNavItem]="group.displayName"
+    <ng-template #abpBody>
+      <div class="row">
+        @if (groups.length) {
+          <div class="col-md-4">
+            <ul
+              ngbNav
+              #nav="ngbNav"
+              [(activeId)]="selectedGroupDisplayName"
+              class="nav-pills"
+              orientation="vertical"
             >
-              <a ngbNavLink>{{ group.displayName }}</a>
-              <ng-template ngbNavContent>
-                <h4>{{ selectedGroupDisplayName }}</h4>
-                <hr class="mt-2 mb-3" />
+              @for (group of groups; track group.name) {
+                <li [ngbNavItem]="group.displayName">
+                  <a ngbNavLink>{{ group.displayName }}</a>
+                  <ng-template ngbNavContent>
+                    <h4>{{ selectedGroupDisplayName }}</h4>
+                    <hr class="mt-2 mb-3" />
 
-                <div
-                  class="mt-2"
-                  *ngFor="
-                    let feature of features[group.name];
-                    let i = index;
-                    trackBy: track.by('id')
-                  "
-                  [ngStyle]="feature.style"
-                  [ngSwitch]="feature.valueType?.name"
-                  (keyup.enter)="save()"
-                >
-                  <ng-container *ngSwitchCase="valueTypes.ToggleStringValueType">
-                    <div class="form-check">
-                      <input
-                        class="form-check-input"
-                        type="checkbox"
-                        [id]="feature.name"
-                        [(ngModel)]="feature.value"
-                        (ngModelChange)="onCheckboxClick($event, feature)"
-                      />
+                    @for (feature of features[group.name]; track feature.id; let i = $index) {
+                      <div class="mt-2" [ngStyle]="feature.style" (keyup.enter)="save()">
+                        @switch (feature.valueType?.name) {
+                          @case (valueTypes.ToggleStringValueType) {
+                            <div class="form-check">
+                              <input
+                                class="form-check-input"
+                                type="checkbox"
+                                [id]="feature.name"
+                                [(ngModel)]="feature.value"
+                                (ngModelChange)="onCheckboxClick($event, feature)"
+                              />
 
-                      <label class="form-check-label" [htmlFor]="feature.name">{{
-                        feature.displayName
-                      }}</label>
-                      <ng-container
-                        *ngTemplateOutlet="descTmp; context: { $implicit: feature.description }"
-                      ></ng-container>
-                    </div>
-                  </ng-container>
-                  <ng-container *ngSwitchCase="valueTypes.FreeTextStringValueType">
-                    <div class="mb-3 form-group">
-                      <label [htmlFor]="feature.name" class="form-label">{{
-                        feature.displayName
-                      }}</label>
-                      <input
-                        class="form-control"
-                        type="text"
-                        [id]="feature.name"
-                        [(ngModel)]="feature.value"
-                        [abpFeatureManagementFreeText]="feature"
-                      />
+                              <label class="form-check-label" [htmlFor]="feature.name">{{
+                                feature.displayName
+                              }}</label>
+                              <ng-container
+                                *ngTemplateOutlet="
+                                  descTmp;
+                                  context: { $implicit: feature.description }
+                                "
+                              ></ng-container>
+                            </div>
+                          }
+                          @case (valueTypes.FreeTextStringValueType) {
+                            <div class="mb-3 form-group">
+                              <label [htmlFor]="feature.name" class="form-label">{{
+                                feature.displayName
+                              }}</label>
+                              <input
+                                class="form-control"
+                                type="text"
+                                [id]="feature.name"
+                                [(ngModel)]="feature.value"
+                                [abpFeatureManagementFreeText]="feature"
+                              />
 
-                      <ng-container
-                        *ngTemplateOutlet="descTmp; context: { $implicit: feature.description }"
-                      ></ng-container>
-                    </div>
-                  </ng-container>
-                  <ng-container *ngSwitchCase="valueTypes.SelectionStringValueType">
-                    <ng-container *ngIf="feature.valueType.itemSource?.items?.length">
-                      <div class="mb-3 form-group">
-                        <label [htmlFor]="feature.name" class="form-label">{{
-                          feature.displayName
-                        }}</label>
-                        <select class="form-select" [id]="feature.name" [(ngModel)]="feature.value">
-                          <option
-                            *ngFor="
-                              let item of feature.valueType.itemSource?.items;
-                              trackBy: track.by('value')
-                            "
-                            [ngValue]="item.value"
-                          >
-                            {{
-                              item.displayText?.resourceName + '::' + item.displayText?.name
-                                | abpLocalization
-                            }}
-                          </option>
-                        </select>
-                        <ng-container
-                          *ngTemplateOutlet="descTmp; context: { $implicit: feature.description }"
-                        ></ng-container>
+                              <ng-container
+                                *ngTemplateOutlet="
+                                  descTmp;
+                                  context: { $implicit: feature.description }
+                                "
+                              ></ng-container>
+                            </div>
+                          }
+                          @case (valueTypes.SelectionStringValueType) {
+                            @if (feature.valueType.itemSource?.items?.length) {
+                                <div class="mb-3 form-group">
+                                  <label [htmlFor]="feature.name" class="form-label">{{
+                                    feature.displayName
+                                  }}</label>
+                                  <select
+                                    class="form-select"
+                                    [id]="feature.name"
+                                    [(ngModel)]="feature.value"
+                                  >
+                                    @for (
+                                      item of feature.valueType.itemSource?.items;
+                                      track item.value
+                                    ) {
+                                      <option [ngValue]="item.value">
+                                        {{
+                                          item.displayText?.resourceName +
+                                            '::' +
+                                            item.displayText?.name | abpLocalization
+                                        }}
+                                      </option>
+                                    }
+                                  </select>
+                                  <ng-container
+                                    *ngTemplateOutlet="
+                                      descTmp;
+                                      context: { $implicit: feature.description }
+                                    "
+                                  ></ng-container>
+                                </div>
+                            }
+                          }
+                          @default {
+                            {{ feature.displayName }}
+                          }
+                        }
                       </div>
-                    </ng-container>
-                  </ng-container>
-                  <ng-container *ngSwitchDefault>{{ feature.displayName }}</ng-container>
-                </div>
-              </ng-template>
-            </li>
-          </ul>
-        </div>
+                    }
+                  </ng-template>
+                </li>
+              }
+            </ul>
+          </div>
 
-        <ng-template #descTmp let-description>
-          <small *ngIf="description" class="d-block form-text text-muted">{{ description }}</small>
-        </ng-template>
+          <ng-template #descTmp let-description>
+            @if (description) {
+              <small class="d-block form-text text-muted">{{ description }}</small>
+            }
+          </ng-template>
 
-        <div class="col-md-8"><div class="py-0" [ngbNavOutlet]="nav"></div></div>
-      </ng-container>
+          <div class="col-md-8"><div class="py-0" [ngbNavOutlet]="nav"></div></div>
+        }
 
-      <div class="col" *ngIf="!groups.length">
-        {{ 'AbpFeatureManagement::NoFeatureFoundMessage' | abpLocalization }}
+        @if (!groups.length) {
+          <div class="col">
+            {{ 'AbpFeatureManagement::NoFeatureFoundMessage' | abpLocalization }}
+          </div>
+        }
       </div>
-    </div>
-  </ng-template>
+    </ng-template>
 
-  <ng-template #abpFooter>
-    <button abpClose type="button" class="btn btn-link">
-      {{ 'AbpFeatureManagement::Cancel' | abpLocalization }}
-    </button>
+    <ng-template #abpFooter>
+      <button abpClose type="button" class="btn btn-link">
+        {{ 'AbpFeatureManagement::Cancel' | abpLocalization }}
+      </button>
 
-    <abp-button
-      *ngIf="groups.length"
-      iconClass="fa fa-refresh"
-      buttonClass="btn btn-outline-primary"
-      [disabled]="modalBusy"
-      (click)="resetToDefault()"
-      aria-hidden="true"
-    >
-      {{ 'AbpFeatureManagement::ResetToDefault' | abpLocalization }}
-    </abp-button>
+      @if (groups.length) {
+        <abp-button
+          iconClass="fa fa-refresh"
+          buttonClass="btn btn-outline-primary"
+          [disabled]="modalBusy"
+          (click)="resetToDefault()"
+          aria-hidden="true"
+        >
+          {{ 'AbpFeatureManagement::ResetToDefault' | abpLocalization }}
+        </abp-button>
+      }
 
-    <abp-button
-      *ngIf="groups.length"
-      iconClass="fa fa-check"
-      [disabled]="modalBusy"
-      (click)="save()"
-      aria-hidden="true"
-    >
-      {{ 'AbpFeatureManagement::Save' | abpLocalization }}
-    </abp-button>
-  </ng-template>
-</abp-modal>
+      @if (groups.length) {
+        <abp-button
+          iconClass="fa fa-check"
+          [disabled]="modalBusy"
+          (click)="save()"
+          aria-hidden="true"
+        >
+          {{ 'AbpFeatureManagement::Save' | abpLocalization }}
+        </abp-button>
+      }
+    </ng-template>
+  </abp-modal>
+}

From efdc7139261f5a48a16ef8107d6dc40c913e740d Mon Sep 17 00:00:00 2001
From: Sinan997 <sinanozturk997@gmail.com>
Date: Mon, 1 Apr 2024 14:28:58 +0300
Subject: [PATCH 5/8] remove comment lines and fix typo

---
 .../extensible-form-prop.component.html       | 169 +-----------------
 1 file changed, 1 insertion(+), 168 deletions(-)

diff --git a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.html b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.html
index 452ac38d09..e565a0ac86 100644
--- a/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.html
+++ b/npm/ng-packs/packages/components/extensible/src/lib/components/extensible-form/extensible-form-prop.component.html
@@ -70,7 +70,7 @@
           multiple="multiple"
           class="form-select form-control"
         >
-          @for (options of options$ | asnyc; track option.value) {
+          @for (option of options$ | async; track option.value) {
             <option [ngValue]="option.value">
               {{ option.key }}
             </option>
@@ -165,173 +165,6 @@
   </div>
 </ng-container>
 
-<!-- <ng-container
-  [ngSwitch]="getComponent(prop)"
-  *abpPermission="prop.permission; runChangeDetection: false"
->
-  <ng-template ngSwitchCase="template">
-    <ng-container *ngComponentOutlet="prop.template; injector: injectorForCustomComponent">
-    </ng-container>
-  </ng-template>
-
-  <div [ngClass]="containerClassName" class="mb-2">
-    <ng-template ngSwitchCase="input">
-      <ng-template [ngTemplateOutlet]="label"></ng-template>
-      <input
-        #field
-        [id]="prop.id"
-        [formControlName]="prop.name"
-        [autocomplete]="prop.autocomplete"
-        [type]="getType(prop)"
-        [abpDisabled]="disabled"
-        [readonly]="readonly"
-        class="form-control"
-      />
-    </ng-template>
-
-    <ng-template ngSwitchCase="hidden">
-      <input [formControlName]="prop.name" type="hidden" />
-    </ng-template>
-
-    <ng-template ngSwitchCase="checkbox">
-      <div class="form-check" validationTarget>
-        <input
-          #field
-          [id]="prop.id"
-          [formControlName]="prop.name"
-          [abpDisabled]="disabled"
-          type="checkbox"
-          class="form-check-input"
-        />
-        <ng-template
-          [ngTemplateOutlet]="label"
-          [ngTemplateOutletContext]="{ $implicit: 'form-check-label' }"
-        ></ng-template>
-      </div>
-    </ng-template>
-
-    <ng-template ngSwitchCase="select">
-      <ng-template [ngTemplateOutlet]="label"></ng-template>
-      <select
-        #field
-        [id]="prop.id"
-        [formControlName]="prop.name"
-        [abpDisabled]="disabled"
-        class="form-select form-control"
-      >
-        @for (option of options$ | async; track option.value) {
-          <option [ngValue]="option.value">
-            {{ option.key }}
-          </option>
-        }
-      </select>
-    </ng-template>
-
-    <ng-template ngSwitchCase="multiselect">
-      <ng-template [ngTemplateOutlet]="label"></ng-template>
-      <select
-        #field
-        [id]="prop.id"
-        [formControlName]="prop.name"
-        [abpDisabled]="disabled"
-        multiple="multiple"
-        class="form-select form-control"
-      >
-        @for (options of options$ | asnyc; track option.value) {
-          <option [ngValue]="option.value">
-            {{ option.key }}
-          </option>
-        }
-      </select>
-    </ng-template>
-
-    <ng-template ngSwitchCase="typeahead">
-      <ng-template [ngTemplateOutlet]="label"></ng-template>
-      <div #typeahead class="position-relative" validationStyle validationTarget>
-        <input
-          #field
-          [id]="prop.id"
-          [autocomplete]="prop.autocomplete"
-          [abpDisabled]="disabled"
-          [ngbTypeahead]="search"
-          [editable]="false"
-          [inputFormatter]="typeaheadFormatter"
-          [resultFormatter]="typeaheadFormatter"
-          [ngModelOptions]="{ standalone: true }"
-          [(ngModel)]="typeaheadModel"
-          (selectItem)="setTypeaheadValue($event.item)"
-          (blur)="setTypeaheadValue(typeaheadModel)"
-          [class.is-invalid]="typeahead.classList.contains('is-invalid')"
-          class="form-control"
-        />
-        <input [formControlName]="prop.name" type="hidden" />
-      </div>
-    </ng-template>
-
-    <ng-template ngSwitchCase="date">
-      <ng-template [ngTemplateOutlet]="label"></ng-template>
-      <input
-        [id]="prop.id"
-        [formControlName]="prop.name"
-        (click)="datepicker.open()"
-        (keyup.space)="datepicker.open()"
-        ngbDatepicker
-        #datepicker="ngbDatepicker"
-        type="text"
-        class="form-control"
-      />
-    </ng-template>
-
-    <ng-template ngSwitchCase="time">
-      <ng-template [ngTemplateOutlet]="label"></ng-template>
-      <ngb-timepicker [formControlName]="prop.name"></ngb-timepicker>
-    </ng-template>
-
-    <ng-template ngSwitchCase="dateTime">
-      <ng-template [ngTemplateOutlet]="label"></ng-template>
-      <abp-extensible-date-time-picker [prop]="prop" [meridian]="meridian$ | async" />
-    </ng-template>
-
-    <ng-template ngSwitchCase="textarea">
-      <ng-template [ngTemplateOutlet]="label"></ng-template>
-      <textarea
-        #field
-        [id]="prop.id"
-        [formControlName]="prop.name"
-        [abpDisabled]="disabled"
-        [readonly]="readonly"
-        class="form-control"
-      ></textarea>
-    </ng-template>
-
-    <ng-template ngSwitchCase="passwordinputgroup">
-      <ng-template [ngTemplateOutlet]="label"></ng-template>
-      <div class="input-group form-group" validationTarget>
-        <input
-          class="form-control"
-          [id]="prop.id"
-          [formControlName]="prop.name"
-          [abpShowPassword]="showPassword"
-        />
-        <button class="btn btn-secondary" type="button" (click)="showPassword = !showPassword">
-          <i
-            class="fa"
-            aria-hidden="true"
-            [ngClass]="{
-              'fa-eye-slash': !showPassword,
-              'fa-eye': showPassword
-            }"
-          ></i>
-        </button>
-      </div>
-    </ng-template>
-
-    @if (prop.formText) {
-      <small class="text-muted d-block">{{ prop.formText | abpLocalization }}</small>
-    }
-  </div>
-</ng-container> -->
-
 <ng-template #label let-classes>
   <label [htmlFor]="prop.id" [ngClass]="classes || 'form-label'">
     @if (prop.displayTextResolver) {

From 295c07c095d373ca188967d0838ef6e87251b0af Mon Sep 17 00:00:00 2001
From: Sinan997 <sinanozturk997@gmail.com>
Date: Mon, 1 Apr 2024 17:13:45 +0300
Subject: [PATCH 6/8] use new control flow in `identity`,
 `permission-management`, `tenant-management`,`setting-management`,
 `theme-basic`, `theme-shared` packages

---
 .../lib/components/users/users.component.html |  77 ++++++-----
 .../permission-management.component.html      |  95 +++++++-------
 .../setting-management.component.html         |  10 +-
 .../components/tenants/tenants.component.html |  24 ++--
 .../account-layout.component.html             |  13 +-
 .../auth-wrapper/auth-wrapper.component.html  |  29 ++--
 .../tenant-box/tenant-box.component.html      |   4 +-
 .../application-layout.component.html         |  14 +-
 .../src/lib/components/logo/logo.component.ts |  22 ++--
 .../nav-items/current-user.component.html     | 124 +++++++++---------
 .../nav-items/languages.component.ts          |  60 ++++-----
 .../nav-items/nav-items.component.html        |  24 ++--
 .../page-alert-container.component.html       |  32 ++---
 .../components/routes/routes.component.html   |  47 ++++---
 .../validation-error.component.ts             |   8 +-
 .../breadcrumb-items.component.html           |  29 ++--
 .../components/checkbox/checkbox.component.ts |   8 +-
 .../confirmation/confirmation.component.html  |  89 +++++++------
 .../form-input/form-input.component.ts        |   8 +-
 .../http-error-wrapper.component.html         |  47 ++++---
 .../lib/components/modal/modal.component.html |  40 +++---
 .../toast-container.component.html            |  11 +-
 .../lib/components/toast/toast.component.html |   8 +-
 23 files changed, 432 insertions(+), 391 deletions(-)

diff --git a/npm/ng-packs/packages/identity/src/lib/components/users/users.component.html b/npm/ng-packs/packages/identity/src/lib/components/users/users.component.html
index 7d36566114..5085f1d120 100644
--- a/npm/ng-packs/packages/identity/src/lib/components/users/users.component.html
+++ b/npm/ng-packs/packages/identity/src/lib/components/users/users.component.html
@@ -26,46 +26,45 @@
     </ng-template>
 
     <ng-template #abpBody>
-      <ng-template #loaderRef>
-        <div class="text-center"><i class="fa fa-pulse fa-spinner" aria-hidden="true"></i></div>
-      </ng-template>
-
-      <form *ngIf="form; else loaderRef" [formGroup]="form" (ngSubmit)="save()">
-        <ul ngbNav #nav="ngbNav" class="nav-tabs">
-          <li ngbNavItem>
-            <a ngbNavLink>{{ 'AbpIdentity::UserInformations' | abpLocalization }}</a>
-            <ng-template ngbNavContent>
-              <abp-extensible-form [selectedRecord]="selected"></abp-extensible-form>
-            </ng-template>
-          </li>
+      @if (form) {
+        <form [formGroup]="form" (ngSubmit)="save()">
+          <ul ngbNav #nav="ngbNav" class="nav-tabs">
+            <li ngbNavItem>
+              <a ngbNavLink>{{ 'AbpIdentity::UserInformations' | abpLocalization }}</a>
+              <ng-template ngbNavContent>
+                <abp-extensible-form [selectedRecord]="selected"></abp-extensible-form>
+              </ng-template>
+            </li>
 
-          <li ngbNavItem>
-            <a ngbNavLink>{{ 'AbpIdentity::Roles' | abpLocalization }}</a>
-            <ng-template ngbNavContent>
-              <div
-                *ngFor="let roleGroup of roleGroups; let i = index; trackBy: trackByFn"
-                class="form-check mb-2"
-              >
-                <abp-checkbox
-                  *abpReplaceableTemplate="{
-                    inputs: {
-                      checkboxId: 'roles-' + i,
-                      label: roles[i].name,
-                      formControl: roleGroup.controls[roles[i].name]
-                    },
-                    componentKey: inputKey
-                  }"
-                  [checkboxId]="'roles-' + i"
-                  [formControl]="roleGroup.controls[roles[i].name]"
-                  [label]="roles[i].name"
-                >
-                </abp-checkbox>
-              </div>
-            </ng-template>
-          </li>
-        </ul>
-        <div class="mt-2 fade-in-top" [ngbNavOutlet]="nav"></div>
-      </form>
+            <li ngbNavItem>
+              <a ngbNavLink>{{ 'AbpIdentity::Roles' | abpLocalization }}</a>
+              <ng-template ngbNavContent>
+                @for (roleGroup of roleGroups; track $index; let i = $index) {
+                  <div class="form-check mb-2">
+                    <abp-checkbox
+                      *abpReplaceableTemplate="{
+                        inputs: {
+                          checkboxId: 'roles-' + i,
+                          label: roles[i].name,
+                          formControl: roleGroup.controls[roles[i].name]
+                        },
+                        componentKey: inputKey
+                      }"
+                      [checkboxId]="'roles-' + i"
+                      [formControl]="roleGroup.controls[roles[i].name]"
+                      [label]="roles[i].name"
+                    >
+                    </abp-checkbox>
+                  </div>
+                }
+              </ng-template>
+            </li>
+          </ul>
+          <div class="mt-2 fade-in-top" [ngbNavOutlet]="nav"></div>
+        </form>
+      } @else {
+        <div class="text-center"><i class="fa fa-pulse fa-spinner" aria-hidden="true"></i></div>
+      }
     </ng-template>
 
     <ng-template #abpFooter>
diff --git a/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.html b/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.html
index 384070d2e7..19d9f0fa78 100644
--- a/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.html
+++ b/npm/ng-packs/packages/permission-management/src/lib/components/permission-management.component.html
@@ -1,5 +1,5 @@
-<abp-modal [(visible)]="visible" [busy]="modalBusy" [options]="{ size: 'lg' ,scrollable:false }">
-  <ng-container *ngIf="data.entityDisplayName || entityDisplayName">
+<abp-modal [(visible)]="visible" [busy]="modalBusy" [options]="{ size: 'lg', scrollable: false }">
+  @if (data.entityDisplayName || entityDisplayName) {
     <ng-template #abpHeader>
       <h4>
         {{ 'AbpPermissionManagement::Permissions' | abpLocalization }} -
@@ -28,23 +28,28 @@
           <hr class="mt-2 mb-2" />
           <div class="overflow-auto">
             <ul class="nav nav-pills flex-column">
-              <li *ngFor="let group of data.groups; trackBy: trackByFn" class="nav-item">
-                <a
-                  *ngIf="{ assignedCount: getAssignedCount(group.name) } as count"
-                  class="nav-link pointer"
-                  [class.active]="selectedGroup?.name === group?.name"
-                  (click)="onChangeGroup(group)"
-                  (select)="setDisabled(group.permissions)"
-                >
-                  <div [class.font-weight-bold]="count.assignedCount">
-                    {{ group?.displayName }}
-                    <span *ngIf="count.assignedCount > 0">({{ count.assignedCount }})</span>
-                  </div>
-                </a>
-              </li>
+              @for (group of data.groups; track $index) {
+                <li class="nav-item">
+                  @if ({ assignedCount: getAssignedCount(group.name) }; as count) {
+                    <a
+                      class="nav-link pointer"
+                      [class.active]="selectedGroup?.name === group?.name"
+                      (click)="onChangeGroup(group)"
+                      (select)="setDisabled(group.permissions)"
+                    >
+                      <div [class.font-weight-bold]="count.assignedCount">
+                        {{ group?.displayName }}
+                        @if (count.assignedCount > 0) {
+                          <span>({{ count.assignedCount }})</span>
+                        }
+                      </div>
+                    </a>
+                  }
+                </li>
+              }
             </ul>
           </div>
-         </div>
+        </div>
 
         <div class="col-md-8 scroll-in-modal">
           <div class="ps-1">
@@ -64,32 +69,34 @@
               }}</label>
             </div>
             <hr class="my-2" />
-            <div
-              *ngFor="let permission of selectedGroupPermissions; let i = index; trackBy: trackByFn"
-              [ngStyle]="permission.style"
-              class="form-check mb-2"
-            >
-              <input
-                #permissionCheckbox
-                type="checkbox"
-                [checked]="getChecked(permission.name)"
-                [value]="getChecked(permission.name)"
-                [attr.id]="permission.name"
-                class="form-check-input"
-                [disabled]="isGrantedByOtherProviderName(permission.grantedProviders)"
-                (click)="onClickCheckbox(permission, permissionCheckbox.value)"
-              />
-              <label class="form-check-label" [attr.for]="permission.name"
-                >{{ permission.displayName }}
-                <ng-container *ngIf="!hideBadges">
-                  <span
-                    *ngFor="let provider of permission.grantedProviders"
-                    class="badge bg-light text-dark"
-                    >{{ provider.providerName }}: {{ provider.providerKey }}</span
-                  >
-                </ng-container>
-              </label>
-            </div>
+            @for (permission of selectedGroupPermissions; track $index; let i = $index) {
+              <div
+                [ngStyle]="permission.style"
+                class="form-check mb-2"
+              >
+                <input
+                  #permissionCheckbox
+                  type="checkbox"
+                  [checked]="getChecked(permission.name)"
+                  [value]="getChecked(permission.name)"
+                  [attr.id]="permission.name"
+                  class="form-check-input"
+                  [disabled]="isGrantedByOtherProviderName(permission.grantedProviders)"
+                  (click)="onClickCheckbox(permission, permissionCheckbox.value)"
+                />
+                <label class="form-check-label" [attr.for]="permission.name"
+                  >{{ permission.displayName }}
+                  @if (!hideBadges) {
+                    @for (provider of permission.grantedProviders; track $index) {
+                      <span
+                        class="badge bg-light text-dark"
+                        >{{ provider.providerName }}: {{ provider.providerKey }}</span
+                      >
+                    }
+                  }
+                </label>
+              </div>
+            }
           </div>
         </div>
       </div>
@@ -102,5 +109,5 @@
         'AbpIdentity::Save' | abpLocalization
       }}</abp-button>
     </ng-template>
-  </ng-container>
+  }
 </abp-modal>
diff --git a/npm/ng-packs/packages/setting-management/src/lib/components/setting-management.component.html b/npm/ng-packs/packages/setting-management/src/lib/components/setting-management.component.html
index d099de1674..bac95a135c 100644
--- a/npm/ng-packs/packages/setting-management/src/lib/components/setting-management.component.html
+++ b/npm/ng-packs/packages/setting-management/src/lib/components/setting-management.component.html
@@ -23,11 +23,13 @@
             </ul>
           </div>
           <div class="col-12 col-md-9">
-            <div *ngIf="settings.length" class="tab-content">
-              <div class="tab-pane fade show active" [id]="selected.name + '-tab'" role="tabpanel">
-                <ng-container *ngComponentOutlet="selected.component"></ng-container>
+            @if (settings.length) {
+              <div class="tab-content">
+                <div class="tab-pane fade show active" [id]="selected.name + '-tab'" role="tabpanel">
+                  <ng-container *ngComponentOutlet="selected.component"></ng-container>
+                </div>
               </div>
-            </div>
+            }
           </div>
         </div>
       </div>
diff --git a/npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.html b/npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.html
index 1be0edefbc..b914bdf15b 100644
--- a/npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.html
+++ b/npm/ng-packs/packages/tenant-management/src/lib/components/tenants/tenants.component.html
@@ -1,6 +1,4 @@
 <abp-page [title]="'AbpTenantManagement::Tenants' | abpLocalization" [toolbar]="data.items">
-
-
   <div id="wrapper" class="card">
     <div class="card-body">
       <div id="data-tables-table-filter" class="data-tables-filter mb-3">
@@ -26,8 +24,8 @@
     <ng-template #abpHeader>
       <h3>
         {{
-        (selected?.id ? 'AbpTenantManagement::Edit' : 'AbpTenantManagement::NewTenant')
-          | abpLocalization
+          (selected?.id ? 'AbpTenantManagement::Edit' : 'AbpTenantManagement::NewTenant')
+            | abpLocalization
         }}
       </h3>
     </ng-template>
@@ -44,20 +42,20 @@
       </button>
       <abp-button iconClass="fa fa-check" (click)="save()" [disabled]="tenantForm?.invalid">{{
         'AbpTenantManagement::Save' | abpLocalization
-        }}</abp-button>
+      }}</abp-button>
     </ng-template>
   </abp-modal>
 
   <abp-feature-management
     *abpReplaceableTemplate="{
-    inputs: {
-      providerName: { value: 'T' },
-      providerKey: { value: providerKey },
-      visible: { value: visibleFeatures, twoWay: true }
-    },
-    outputs: { visibleChange: $any(onVisibleFeaturesChange) },
-    componentKey: featureManagementKey
-  }"
+      inputs: {
+        providerName: { value: 'T' },
+        providerKey: { value: providerKey },
+        visible: { value: visibleFeatures, twoWay: true }
+      },
+      outputs: { visibleChange: $any(onVisibleFeaturesChange) },
+      componentKey: featureManagementKey
+    }"
     [(visible)]="visibleFeatures"
     providerName="T"
     [providerKey]="providerKey"
diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.html b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.html
index 076cf83c7f..a27790c939 100644
--- a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.html
+++ b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/account-layout.component.html
@@ -20,12 +20,13 @@
     >
       <ng-container *ngTemplateOutlet="!service.smallScreen ? navigations : null"></ng-container>
 
-      <div
-        *ngIf="service.smallScreen"
-        [@collapseWithMargin]="service.isCollapsed ? 'collapsed' : 'expanded'"
-      >
-        <ng-container *ngTemplateOutlet="navigations"></ng-container>
-      </div>
+      @if (service.smallScreen) {
+        <div
+          [@collapseWithMargin]="service.isCollapsed ? 'collapsed' : 'expanded'"
+        >
+          <ng-container *ngTemplateOutlet="navigations"></ng-container>
+        </div>
+      }
 
       <ng-template #navigations>
         <abp-routes
diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.html b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.html
index 5a4e2e6039..b32078abe4 100644
--- a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.html
+++ b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/auth-wrapper/auth-wrapper.component.html
@@ -1,27 +1,24 @@
 <div class="row">
   <div class="mx-auto col col-md-5">
-    <ng-container *ngIf="(service.isMultiTenancyEnabled$ | async) && service.isTenantBoxVisible">
+    @if ((service.isMultiTenancyEnabled$ | async) && service.isTenantBoxVisible) {
       <abp-tenant-box
         *abpReplaceableTemplate="{ componentKey: service.tenantBoxKey }"
       ></abp-tenant-box>
-    </ng-container>
+    }
 
     <div class="abp-account-container">
-      <div
-        *ngIf="service.enableLocalLogin$ | async; else disableLocalLoginTemplate"
-        class="card mt-3 shadow-sm rounded"
-      >
-        <div class="card-body p-5">
-          <ng-content></ng-content>
+      @if (service.enableLocalLogin$ | async) {
+        <div class="card mt-3 shadow-sm rounded">
+          <div class="card-body p-5">
+            <ng-content></ng-content>
+          </div>
         </div>
-      </div>
+      } @else {
+        <div class="alert alert-warning">
+          <strong>{{ 'AbpAccount::InvalidLoginRequest' | abpLocalization }}</strong>
+          {{ 'AbpAccount::ThereAreNoLoginSchemesConfiguredForThisClient' | abpLocalization }}
+        </div>
+      }
     </div>
   </div>
 </div>
-
-<ng-template #disableLocalLoginTemplate>
-  <div class="alert alert-warning">
-    <strong>{{ 'AbpAccount::InvalidLoginRequest' | abpLocalization }}</strong>
-    {{ 'AbpAccount::ThereAreNoLoginSchemesConfiguredForThisClient' | abpLocalization }}
-  </div>
-</ng-template>
diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.html b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.html
index 9e1466310d..309f4fee83 100644
--- a/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.html
+++ b/npm/ng-packs/packages/theme-basic/src/lib/components/account-layout/tenant-box/tenant-box.component.html
@@ -1,4 +1,4 @@
-<ng-container *ngIf="(service.currentTenant$ | async) || { name: '' } as currentTenant">
+@if ((service.currentTenant$ | async) || { name: '' }; as currentTenant) {
   <div class="card shadow-sm rounded mb-3">
     <div class="card-body px-5">
       <div class="row">
@@ -62,4 +62,4 @@
       </abp-button>
     </ng-template>
   </abp-modal>
-</ng-container>
+}
diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/application-layout/application-layout.component.html b/npm/ng-packs/packages/theme-basic/src/lib/components/application-layout/application-layout.component.html
index c41cfb3d31..d27bc23ceb 100644
--- a/npm/ng-packs/packages/theme-basic/src/lib/components/application-layout/application-layout.component.html
+++ b/npm/ng-packs/packages/theme-basic/src/lib/components/application-layout/application-layout.component.html
@@ -13,12 +13,18 @@
     >
       <span class="navbar-toggler-icon"></span>
     </button>
-    <div class="navbar-collapse" [class.overflow-hidden]="service.smallScreen" id="main-navbar-collapse">
+    <div
+      class="navbar-collapse"
+      [class.overflow-hidden]="service.smallScreen"
+      id="main-navbar-collapse"
+    >
       <ng-container *ngTemplateOutlet="!service.smallScreen ? navigations : null"></ng-container>
 
-      <div *ngIf="service.smallScreen" [@collapseWithMargin]="service.isCollapsed ? 'collapsed' : 'expanded'">
-        <ng-container *ngTemplateOutlet="navigations"></ng-container>
-      </div>
+      @if (service.smallScreen) {
+        <div [@collapseWithMargin]="service.isCollapsed ? 'collapsed' : 'expanded'">
+          <ng-container *ngTemplateOutlet="navigations"></ng-container>
+        </div>
+      }
 
       <ng-template #navigations>
         <abp-routes
diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts
index 95a532435b..68d2c8c065 100644
--- a/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts
+++ b/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts
@@ -5,18 +5,18 @@ import { Component } from '@angular/core';
   selector: 'abp-logo',
   template: `
     <a class="navbar-brand" routerLink="/">
-      <img
-        *ngIf="appInfo.logoUrl; else appName"
-        [src]="appInfo.logoUrl"
-        [alt]="appInfo.name"
-        width="100%"
-        height="auto"
-      />
+      @if (appInfo.logoUrl) {
+        <img
+          *ngIf="appInfo.logoUrl"
+          [src]="appInfo.logoUrl"
+          [alt]="appInfo.name"
+          width="100%"
+          height="auto"
+        />
+      } @else {
+        {{ appInfo.name }}
+      }
     </a>
-
-    <ng-template #appName>
-      {{ appInfo.name }}
-    </ng-template>
   `,
 })
 export class LogoComponent {
diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.html b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.html
index 8dab9ea8fd..7837bf5b0a 100644
--- a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.html
+++ b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.html
@@ -1,65 +1,65 @@
-<ng-template #loginBtn>
-  <a role="button" class="nav-link pointer" (click)="navigateToLogin()">{{
-    'AbpAccount::Login' | abpLocalization
-  }}</a>
-</ng-template>
-<div
-  *ngIf="(currentUser$ | async)?.isAuthenticated; else loginBtn"
-  ngbDropdown
-  class="dropdown"
-  #currentUserDropdown="ngbDropdown"
-  display="static"
->
-  <a
-    ngbDropdownToggle
-    class="nav-link"
-    href="javascript:void(0)"
-    role="button"
-    id="dropdownMenuLink"
-    data-toggle="dropdown"
-    aria-haspopup="true"
-    aria-expanded="false"
-  >
-    <small *ngIf="(selectedTenant$ | async)?.name as tenantName"
-      ><i>{{ tenantName }}</i
-      >\</small
-    >
-    <strong>{{ (currentUser$ | async)?.userName }}</strong>
-  </a>
+@if ((currentUser$ | async)?.isAuthenticated) {
   <div
-    class="dropdown-menu dropdown-menu-end border-0 shadow-sm"
-    aria-labelledby="dropdownMenuLink"
-    [class.d-block]="smallScreen && currentUserDropdown.isOpen()"
+    *ngIf="(currentUser$ | async)?.isAuthenticated"
+    ngbDropdown
+    class="dropdown"
+    #currentUserDropdown="ngbDropdown"
+    display="static"
   >
-    <ng-container *ngFor="let item of userMenu.items$ | async; trackBy: trackByFn">
-      <ng-container *abpVisible="!item.visible || item.visible(item)">
-        <li class="nav-item d-flex align-items-center" *abpPermission="item.requiredPolicy">
-          <ng-container
-            *ngIf="item.component; else htmlTemplate"
-            [ngComponentOutlet]="item.component"
-            [ngComponentOutletInjector]="item | toInjector"
-          ></ng-container>
-
-          <ng-template #htmlTemplate>
-            <div
-              *ngIf="item.html; else textTemplate"
-              [innerHTML]="item.html"
-              (click)="item.action ? item.action() : null"
-            ></div>
-          </ng-template>
-
-          <ng-template #textTemplate>
-            <a
-              *ngIf="item.textTemplate"
-              (click)="item.action ? item.action() : null"
-              class="dropdown-item pointer"
-            >
-              <i *ngIf="item.textTemplate.icon" class="me-1 {{ item.textTemplate.icon }}"></i>
-              {{ item.textTemplate.text | abpLocalization }}</a
-            >
-          </ng-template>
-        </li>
-      </ng-container>
-    </ng-container>
+    <a
+      ngbDropdownToggle
+      class="nav-link"
+      href="javascript:void(0)"
+      role="button"
+      id="dropdownMenuLink"
+      data-toggle="dropdown"
+      aria-haspopup="true"
+      aria-expanded="false"
+    >
+      @if ((selectedTenant$ | async)?.name; as tenantName) {
+        <small
+          ><i>{{ tenantName }}</i
+          >\</small
+        >
+      }
+      <strong>{{ (currentUser$ | async)?.userName }}</strong>
+    </a>
+    <div
+      class="dropdown-menu dropdown-menu-end border-0 shadow-sm"
+      aria-labelledby="dropdownMenuLink"
+      [class.d-block]="smallScreen && currentUserDropdown.isOpen()"
+    >
+      @for (item of userMenu.items$ | async; track $index) {
+        <ng-container *abpVisible="!item.visible || item.visible(item)">
+          <li class="nav-item d-flex align-items-center" *abpPermission="item.requiredPolicy">
+            @if (item.component) {
+              <ng-container
+                [ngComponentOutlet]="item.component"
+                [ngComponentOutletInjector]="item | toInjector"
+              ></ng-container>
+            } @else {
+              @if (item.html) {
+                <div [innerHTML]="item.html" (click)="item.action ? item.action() : null"></div>
+              } @else {
+                @if (item.textTemplate) {
+                  <a (click)="item.action ? item.action() : null" class="dropdown-item pointer">
+                    @if (item.textTemplate.icon) {
+                      <i class="me-1 {{ item.textTemplate.icon }}"></i>
+                    }
+                    {{ item.textTemplate.text | abpLocalization }}</a
+                  >
+                }
+              }
+            }
+          </li>
+        </ng-container>
+      }
+    </div>
   </div>
-</div>
+} @else {
+  <ng-template #loginBtn>
+    <a role="button" class="nav-link pointer" (click)="navigateToLogin()">{{
+      'AbpAccount::Login' | abpLocalization
+    }}</a>
+  </ng-template>
+}
diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts
index 9dd27b28e1..bc98729274 100644
--- a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts
+++ b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/languages.component.ts
@@ -6,39 +6,36 @@ import { map } from 'rxjs/operators';
 @Component({
   selector: 'abp-languages',
   template: `
-    <div
-      *ngIf="((dropdownLanguages$ | async)?.length || 0) > 0"
-      class="dropdown"
-      ngbDropdown
-      #languageDropdown="ngbDropdown"
-      display="static"
-    >
-      <a
-        ngbDropdownToggle
-        class="nav-link"
-        href="javascript:void(0)"
-        role="button"
-        id="dropdownMenuLink"
-        data-toggle="dropdown"
-        aria-haspopup="true"
-        aria-expanded="false"
-      >
-        {{ defaultLanguage$ | async }}
-      </a>
-      <div
-        class="dropdown-menu dropdown-menu-end border-0 shadow-sm"
-        aria-labelledby="dropdownMenuLink"
-        [class.d-block]="smallScreen && languageDropdown.isOpen()"
-      >
+    @if (((dropdownLanguages$ | async)?.length || 0) > 0) {
+      <div class="dropdown" ngbDropdown #languageDropdown="ngbDropdown" display="static">
         <a
-          *ngFor="let lang of dropdownLanguages$ | async"
+          ngbDropdownToggle
+          class="nav-link"
           href="javascript:void(0)"
-          class="dropdown-item"
-          (click)="onChangeLang(lang.cultureName || '')"
-          >{{ lang?.displayName }}</a
+          role="button"
+          id="dropdownMenuLink"
+          data-toggle="dropdown"
+          aria-haspopup="true"
+          aria-expanded="false"
         >
+          {{ defaultLanguage$ | async }}
+        </a>
+        <div
+          class="dropdown-menu dropdown-menu-end border-0 shadow-sm"
+          aria-labelledby="dropdownMenuLink"
+          [class.d-block]="smallScreen && languageDropdown.isOpen()"
+        >
+          @for (lang of dropdownLanguages$ | async; track $index) {
+            <a
+              href="javascript:void(0)"
+              class="dropdown-item"
+              (click)="onChangeLang(lang.cultureName || '')"
+              >{{ lang?.displayName }}</a
+            >
+          }
+        </div>
       </div>
-    </div>
+    }
   `,
 })
 export class LanguagesComponent {
@@ -69,7 +66,10 @@ export class LanguagesComponent {
     return this.sessionState.getLanguage();
   }
 
-  constructor(private sessionState: SessionStateService, private configState: ConfigStateService) {}
+  constructor(
+    private sessionState: SessionStateService,
+    private configState: ConfigStateService,
+  ) {}
 
   onChangeLang(cultureName: string) {
     this.sessionState.setLanguage(cultureName);
diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/nav-items.component.html b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/nav-items.component.html
index 67db85efd4..c5e54a62f2 100644
--- a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/nav-items.component.html
+++ b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/nav-items.component.html
@@ -1,18 +1,16 @@
 <ul class="navbar-nav">
-  <ng-container *ngFor="let item of navItems.items$ | async; trackBy: trackByFn">
-    <ng-container  *abpVisible="!item.visible || item.visible(item)">
+  @for (item of navItems.items$ | async; track $index) {
+    <ng-container *abpVisible="!item.visible || item.visible(item)">
       <li class="nav-item d-flex align-items-center" *abpPermission="item.requiredPolicy">
-        <ng-container 
-        
-          *ngIf="item.component; else htmlTemplate" 
-          [ngComponentOutlet]="item.component"
-          [ngComponentOutletInjector]="item | toInjector"
-        ></ng-container>
-        
-        <ng-template #htmlTemplate>
+        @if (item.component) {
+          <ng-container
+            [ngComponentOutlet]="item.component"
+            [ngComponentOutletInjector]="item | toInjector"
+          ></ng-container>
+        } @else {
           <div [innerHTML]="item.html" (click)="item.action ? item.action() : null"></div>
-        </ng-template>
+        }
       </li>
     </ng-container>
-  </ng-container>
-</ul>
\ No newline at end of file
+  }
+</ul>
diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.html b/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.html
index 914e803f95..86e9d40177 100644
--- a/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.html
+++ b/npm/ng-packs/packages/theme-basic/src/lib/components/page-alert-container/page-alert-container.component.html
@@ -1,24 +1,26 @@
-<ng-container *ngFor="let alert of service.alerts$ | async; let i = index">
+@for (alert of service.alerts$ | async; track i; let i = $index) {
   <div
     class="alert alert-{{ alert.type }} fade show"
     [ngClass]="{ 'alert-dismissible fade show': alert.dismissible }"
     role="alert"
   >
-    <h4
-      class="alert-heading"
-      *ngIf="alert.title"
-      [innerHTML]="alert.title | abpSafeHtml | abpLocalization: alert.titleLocalizationParams"
-    ></h4>
+    @if (alert.title) {
+      <h4
+        class="alert-heading"
+        [innerHTML]="alert.title | abpSafeHtml | abpLocalization: alert.titleLocalizationParams"
+      ></h4>
+    }
     <span
       [innerHTML]="alert.message | abpSafeHtml | abpLocalization: alert.messageLocalizationParams"
     ></span>
-    <button
-      *ngIf="alert.dismissible"
-      type="button"
-      class="btn-close"
-      data-dismiss="alert"
-      aria-label="Close"
-      (click)="service.remove(i)"
-    ></button>
+    @if (alert.dismissible) {
+      <button
+        type="button"
+        class="btn-close"
+        data-dismiss="alert"
+        aria-label="Close"
+        (click)="service.remove(i)"
+      ></button>
+    }
   </div>
-</ng-container>
+}
diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/routes/routes.component.html b/npm/ng-packs/packages/theme-basic/src/lib/components/routes/routes.component.html
index c3a7aa46f4..e537c26f34 100644
--- a/npm/ng-packs/packages/theme-basic/src/lib/components/routes/routes.component.html
+++ b/npm/ng-packs/packages/theme-basic/src/lib/components/routes/routes.component.html
@@ -1,22 +1,25 @@
 <ul class="navbar-nav">
-  <ng-container
-    *ngFor="let route of routesService.visible$ | async; trackBy: trackByFn"
-    [ngTemplateOutlet]="isDropdown(route) ? dropdownLink : defaultLink"
-    [ngTemplateOutletContext]="{ $implicit: route }"
-  >
-  </ng-container>
+  @for (route of routesService.visible$ | async; track $index) {
+    <ng-container
+      [ngTemplateOutlet]="isDropdown(route) ? dropdownLink : defaultLink"
+      [ngTemplateOutletContext]="{ $implicit: route }"
+    >
+    </ng-container>
+  }
 
   <ng-template #defaultLink let-route>
     <li class="nav-item" *abpPermission="route.requiredPolicy">
-      <a class="nav-link" [routerLink]="[route.path]"
-        ><i *ngIf="route.iconClass" [ngClass]="route.iconClass"></i>
-        {{ route.name | abpLocalization }}</a
-      >
+      <a class="nav-link" [routerLink]="[route.path]">
+        @if (route.iconClass) {
+          <i [ngClass]="route.iconClass"></i>
+        }
+        {{ route.name | abpLocalization }}
+      </a>
     </li>
   </ng-template>
 
   <ng-template #dropdownLink let-route>
-    <ng-container *ngIf="route.children?.length">
+    @if (route.children?.length) {
       <li
         class="nav-item dropdown"
         display="static"
@@ -34,7 +37,9 @@
           aria-expanded="false"
           href="javascript:void(0)"
         >
-          <i *ngIf="route.iconClass" [ngClass]="route.iconClass"></i>
+          @if (route.iconClass) {
+            <i [ngClass]="route.iconClass"></i>
+          }
           {{ route.name | abpLocalization }}
         </a>
         <div
@@ -48,27 +53,29 @@
           ></ng-container>
         </div>
       </li>
-    </ng-container>
+    }
   </ng-template>
 
   <ng-template #forTemplate let-route>
-    <ng-container *ngFor="let child of route.children">
+    @for (child of route.children; track $index) {
       <ng-template
         [ngTemplateOutlet]="child.children?.length ? dropdownChild : defaultChild"
         [ngTemplateOutletContext]="{ $implicit: child }"
       ></ng-template>
-    </ng-container>
+    }
   </ng-template>
 
   <ng-template #defaultChild let-child>
-    <ng-container *ngIf="child.path">
+    @if (child.path) {
       <div class="dropdown-submenu" *abpPermission="child.requiredPolicy">
         <a class="dropdown-item" [routerLink]="[child.path]" (click)="closeDropdown()">
-          <i *ngIf="child.iconClass" [ngClass]="child.iconClass"></i>
+          @if (child.iconClass) {
+            <i [ngClass]="child.iconClass"></i>
+          }
           {{ child.name | abpLocalization }}</a
         >
       </div>
-    </ng-container>
+    }
   </ng-template>
 
   <ng-template #dropdownChild let-child>
@@ -87,7 +94,9 @@
           role="button"
           class="btn d-block text-start dropdown-toggle"
         >
-          <i *ngIf="child.iconClass" [ngClass]="child.iconClass"></i>
+          @if (child.iconClass) {
+            <i [ngClass]="child.iconClass"></i>
+          }
           {{ child.name | abpLocalization }}
         </a>
       </div>
diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/validation-error/validation-error.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/validation-error/validation-error.component.ts
index e1532ba743..f9a5b8de6d 100644
--- a/npm/ng-packs/packages/theme-basic/src/lib/components/validation-error/validation-error.component.ts
+++ b/npm/ng-packs/packages/theme-basic/src/lib/components/validation-error/validation-error.component.ts
@@ -4,9 +4,11 @@ import { Validation, ValidationErrorComponent as ErrorComponent } from '@ngx-val
 @Component({
   selector: 'abp-validation-error',
   template: `
-    <div class="invalid-feedback" *ngFor="let error of abpErrors; trackBy: trackByFn">
-      {{ error.message | abpLocalization: error.interpoliteParams }}
-    </div>
+    @for (error of abpErrors; track $index) {
+      <div class="invalid-feedback" >
+        {{ error.message | abpLocalization: error.interpoliteParams }}
+      </div>
+    }
   `,
   changeDetection: ChangeDetectionStrategy.OnPush,
   encapsulation: ViewEncapsulation.None,
diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/breadcrumb-items/breadcrumb-items.component.html b/npm/ng-packs/packages/theme-shared/src/lib/components/breadcrumb-items/breadcrumb-items.component.html
index 598f3638a5..4b2dbf611d 100644
--- a/npm/ng-packs/packages/theme-shared/src/lib/components/breadcrumb-items/breadcrumb-items.component.html
+++ b/npm/ng-packs/packages/theme-shared/src/lib/components/breadcrumb-items/breadcrumb-items.component.html
@@ -1,18 +1,17 @@
-<ol class="breadcrumb" *ngIf="items.length">
-  <li class="breadcrumb-item">
-    <a routerLink="/"><i class="fa fa-home" aria-hidden="true"></i> </a>
-  </li>
-  <li
-    *ngFor="let item of items; let last = last"
-    class="breadcrumb-item"
-    [class.active]="last"
-    aria-current="page"
-  >
-    <ng-container
-      *ngTemplateOutlet="item.path ? linkTemplate : textTemplate; context: { $implicit: item }"
-    ></ng-container>
-  </li>
-</ol>
+@if (items.length) {
+  <ol class="breadcrumb">
+    <li class="breadcrumb-item">
+      <a routerLink="/"><i class="fa fa-home" aria-hidden="true"></i> </a>
+    </li>
+    @for (item of items; track $index; let last = $last) {
+      <li class="breadcrumb-item" [class.active]="last" aria-current="page">
+        <ng-container
+          *ngTemplateOutlet="item.path ? linkTemplate : textTemplate; context: { $implicit: item }"
+        ></ng-container>
+      </li>
+    }
+  </ol>
+}
 
 <ng-template #linkTemplate let-item>
   <a [routerLink]="item.path"> {{ item.name | abpLocalization }}</a>
diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/checkbox/checkbox.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/checkbox/checkbox.component.ts
index 89766ce992..9f10b2317f 100644
--- a/npm/ng-packs/packages/theme-shared/src/lib/components/checkbox/checkbox.component.ts
+++ b/npm/ng-packs/packages/theme-shared/src/lib/components/checkbox/checkbox.component.ts
@@ -16,9 +16,11 @@ import { NG_VALUE_ACCESSOR } from '@angular/forms';
         (blur)="checkboxBlur.next()"
         (focus)="checkboxFocus.next()"
       />
-      <label *ngIf="label" [ngClass]="labelClass" [for]="checkboxId">
-        {{ label | abpLocalization }}
-      </label>
+      @if (label) {
+        <label [ngClass]="labelClass" [for]="checkboxId">
+          {{ label | abpLocalization }}
+        </label>
+      }
     </div>
   `,
   providers: [
diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/confirmation/confirmation.component.html b/npm/ng-packs/packages/theme-shared/src/lib/components/confirmation/confirmation.component.html
index 1ec6dcb9be..ef3ce65819 100644
--- a/npm/ng-packs/packages/theme-shared/src/lib/components/confirmation/confirmation.component.html
+++ b/npm/ng-packs/packages/theme-shared/src/lib/components/confirmation/confirmation.component.html
@@ -1,42 +1,51 @@
-<div class="confirmation" *ngIf="confirmation$ | async as data">
-  <div
-    class="confirmation-backdrop"
-    (click)="data.options?.dismissible ? close(dismiss) : null"
-  ></div>
-  <div class="confirmation-dialog">
-    <div class="icon-container" [ngClass]="data.severity" *ngIf="data.severity || isCustomIconExists(data)">
-      <div  [outerHTML]="data.options.iconTemplate" *ngIf="isIconTemplateExits(data); else iconHolder" ></div>
-       <ng-template #iconHolder>
-         <i class="icon" [ngClass]="getIconClass(data)"></i>
-       </ng-template>
-    </div>
-    <div class="content">
-      <h1
-        class="title"
-        *ngIf="data.title"
-        [innerHTML]="data.title | abpLocalization: data.options?.titleLocalizationParams"
-      ></h1>
-      <p
-        class="message"
-        *ngIf="data.message"
-        [innerHTML]="data.message | abpLocalization: data.options?.messageLocalizationParams"
-      ></p>
-    </div>
-    <div class="footer">
-      <button
-        id="cancel"
-        class="btn btn-outline-primary me-2"
-        [innerHTML]="data.options?.cancelText || 'AbpUi::Cancel' | abpLocalization"
-        *ngIf="!data?.options?.hideCancelBtn"
-        (click)="close(reject)"
-      ></button>
-      <button
-        id="confirm"
-        class="btn btn-primary"
-        [innerHTML]="data.options?.yesText || 'AbpUi::Yes' | abpLocalization"
-        *ngIf="!data?.options?.hideYesBtn"
-        (click)="close(confirm)"
-      ></button>
+@if (confirmation$ | async; as data) {
+  <div class="confirmation">
+    <div
+      class="confirmation-backdrop"
+      (click)="data.options?.dismissible ? close(dismiss) : null"
+    ></div>
+    <div class="confirmation-dialog">
+      @if (data.severity || isCustomIconExists(data)) {
+        <div class="icon-container" [ngClass]="data.severity">
+          @if (isIconTemplateExits(data)) {
+            <div [outerHTML]="data.options.iconTemplate"></div>
+          } @else {
+            <i class="icon" [ngClass]="getIconClass(data)"></i>
+          }
+        </div>
+      }
+      <div class="content">
+        @if (data.title) {
+          <h1
+            class="title"
+            [innerHTML]="data.title | abpLocalization: data.options?.titleLocalizationParams"
+          ></h1>
+        }
+        @if (data.message) {
+          <p
+            class="message"
+            [innerHTML]="data.message | abpLocalization: data.options?.messageLocalizationParams"
+          ></p>
+        }
+      </div>
+      <div class="footer">
+        @if (!data?.options?.hideCancelBtn) {
+          <button
+            id="cancel"
+            class="btn btn-outline-primary me-2"
+            [innerHTML]="data.options?.cancelText || 'AbpUi::Cancel' | abpLocalization"
+            (click)="close(reject)"
+          ></button>
+        }
+        @if (!data?.options?.hideYesBtn) {
+          <button
+            id="confirm"
+            class="btn btn-primary"
+            [innerHTML]="data.options?.yesText || 'AbpUi::Yes' | abpLocalization"
+            (click)="close(confirm)"
+          ></button>
+        }
+      </div>
     </div>
   </div>
-</div>
+}
diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/form-input/form-input.component.ts b/npm/ng-packs/packages/theme-shared/src/lib/components/form-input/form-input.component.ts
index d759163a0d..fd5f579b5d 100644
--- a/npm/ng-packs/packages/theme-shared/src/lib/components/form-input/form-input.component.ts
+++ b/npm/ng-packs/packages/theme-shared/src/lib/components/form-input/form-input.component.ts
@@ -6,9 +6,11 @@ import { NG_VALUE_ACCESSOR } from '@angular/forms';
   selector: 'abp-form-input',
   template: `
     <div class="mb-3">
-      <label *ngIf="label" [ngClass]="labelClass" [for]="inputId">
-        {{ label | abpLocalization }}
-      </label>
+      @if (label) {
+        <label [ngClass]="labelClass" [for]="inputId">
+          {{ label | abpLocalization }}
+        </label>
+      }
       <input
         type="text"
         [id]="inputId"
diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/http-error-wrapper/http-error-wrapper.component.html b/npm/ng-packs/packages/theme-shared/src/lib/components/http-error-wrapper/http-error-wrapper.component.html
index cb3adb0e17..34885d1164 100644
--- a/npm/ng-packs/packages/theme-shared/src/lib/components/http-error-wrapper/http-error-wrapper.component.html
+++ b/npm/ng-packs/packages/theme-shared/src/lib/components/http-error-wrapper/http-error-wrapper.component.html
@@ -4,32 +4,31 @@
   class="error"
   [style.backgroundColor]="backgroundColor"
 >
-  <button
-    *ngIf="!hideCloseIcon"
-    id="abp-close-button"
-    type="button"
-    class="btn-close me-2"
-    (click)="destroy()"
-  ></button>
+  @if (!hideCloseIcon) {
+    <button id="abp-close-button" type="button" class="btn-close me-2" (click)="destroy()"></button>
+  }
 
-  <div *ngIf="!customComponent" class="row centered">
-    <div class="col-md-12">
-      <div class="error-template">
-        <h1>{{ statusText }} {{ title | abpLocalization }}</h1>
-        <div class="error-details">
-          {{ details | abpLocalization }}
-        </div>
-        <div class="error-actions">
-          <a
-            *ngIf="isHomeShow"
-            (click)="destroy()"
-            routerLink="/"
-            class="btn btn-primary btn-md mt-2"
-            ><span class="glyphicon glyphicon-home"></span>
-            {{ { key: '::Menu:Home', defaultValue: 'Home' } | abpLocalization }}
-          </a>
+  @if (!customComponent) {
+    <div class="row centered">
+      <div class="col-md-12">
+        <div class="error-template">
+          <h1>{{ statusText }} {{ title | abpLocalization }}</h1>
+          <div class="error-details">
+            {{ details | abpLocalization }}
+          </div>
+          <div class="error-actions">
+            @if (isHomeShow) {
+              <a
+                (click)="destroy()"
+                routerLink="/"
+                class="btn btn-primary btn-md mt-2"
+                ><span class="glyphicon glyphicon-home"></span>
+                {{ { key: '::Menu:Home', defaultValue: 'Home' } | abpLocalization }}
+              </a>
+            }
+          </div>
         </div>
       </div>
     </div>
-  </div>
+  }
 </div>
diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/modal/modal.component.html b/npm/ng-packs/packages/theme-shared/src/lib/components/modal/modal.component.html
index 82c27d2518..cdf6728fca 100644
--- a/npm/ng-packs/packages/theme-shared/src/lib/components/modal/modal.component.html
+++ b/npm/ng-packs/packages/theme-shared/src/lib/components/modal/modal.component.html
@@ -1,21 +1,27 @@
 <ng-content></ng-content>
 
 <ng-template #modalContent let-modal>
-  <div *ngIf="abpHeader" id="abp-modal-header" class="modal-header abp-modal-header">
-    <ng-container *ngTemplateOutlet="abpHeader"></ng-container>
-    ​
-    <button
-      id="abp-modal-close-button"
-      type="button"
-      class="btn-sm btn-close"
-      aria-label="Close"
-      (click)="modal.dismiss()"
-    ></button>
-  </div>
-  <div *ngIf="abpBody" id="abp-modal-body" class="modal-body">
-    <ng-container *ngTemplateOutlet="abpBody"></ng-container>
-  </div>
-  <div *ngIf="abpFooter" id="abp-modal-footer" class="modal-footer">
-    <ng-container *ngTemplateOutlet="abpFooter"></ng-container>
-  </div>
+  @if (abpHeader) {
+    <div id="abp-modal-header" class="modal-header abp-modal-header">
+      <ng-container *ngTemplateOutlet="abpHeader"></ng-container>
+      ​
+      <button
+        id="abp-modal-close-button"
+        type="button"
+        class="btn-sm btn-close"
+        aria-label="Close"
+        (click)="modal.dismiss()"
+      ></button>
+    </div>
+  }
+  @if (abpBody) {
+    <div id="abp-modal-body" class="modal-body">
+      <ng-container *ngTemplateOutlet="abpBody"></ng-container>
+    </div>
+  }
+  @if (abpFooter) {
+    <div id="abp-modal-footer" class="modal-footer">
+      <ng-container *ngTemplateOutlet="abpFooter"></ng-container>
+    </div>
+  }
 </ng-template>
diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/toast-container/toast-container.component.html b/npm/ng-packs/packages/theme-shared/src/lib/components/toast-container/toast-container.component.html
index a58fecc9e6..70fdaa5ebd 100644
--- a/npm/ng-packs/packages/theme-shared/src/lib/components/toast-container/toast-container.component.html
+++ b/npm/ng-packs/packages/theme-shared/src/lib/components/toast-container/toast-container.component.html
@@ -7,9 +7,10 @@
   [style.display]="toasts.length ? 'flex' : 'none'"
   [@toastInOut]="toasts.length"
 >
-  <abp-toast
-    [toast]="toast"
-    *ngFor="let toast of toasts; trackBy: trackByFunc"
-    (remove)="remove($event)"
-  ></abp-toast>
+  @for (toast of toasts; track toast.options?.id) {
+    <abp-toast
+      [toast]="toast"
+      (remove)="remove($event)"
+    ></abp-toast>
+  }
 </div>
diff --git a/npm/ng-packs/packages/theme-shared/src/lib/components/toast/toast.component.html b/npm/ng-packs/packages/theme-shared/src/lib/components/toast/toast.component.html
index 5e6902ed27..0f123fdadd 100644
--- a/npm/ng-packs/packages/theme-shared/src/lib/components/toast/toast.component.html
+++ b/npm/ng-packs/packages/theme-shared/src/lib/components/toast/toast.component.html
@@ -3,9 +3,11 @@
     <i class="fa icon" [ngClass]="iconClass" aria-hidden="true"></i>
   </div>
   <div class="abp-toast-content">
-    <button class="abp-toast-close-button" (click)="close()" *ngIf="toast.options?.closable">
-      <i class="fa fa-times" aria-hidden="true"></i>
-    </button>
+    @if (toast.options?.closable) {
+      <button class="abp-toast-close-button" (click)="close()">
+        <i class="fa fa-times" aria-hidden="true"></i>
+      </button>
+    }
     <div class="abp-toast-title">
       {{ toast.title | abpLocalization: toast.options?.titleLocalizationParams }}
     </div>

From bf3775d297b098f2ff9d57b56fc06aac85626f97 Mon Sep 17 00:00:00 2001
From: Sinan997 <sinanozturk997@gmail.com>
Date: Tue, 2 Apr 2024 10:28:38 +0300
Subject: [PATCH 7/8] update control flow template and update their favicons
 with new angular icon

---
 .../dev-app/src/app/home/home.component.html  |  42 ++++++-----
 .../angular/src/app/home/home.component.html  |   5 +-
 .../app-nolayers/angular/src/favicon.ico      | Bin 102968 -> 1406 bytes
 .../angular/src/app/home/home.component.html  |  68 ++++++++++--------
 templates/app/angular/src/favicon.ico         | Bin 102968 -> 1406 bytes
 5 files changed, 63 insertions(+), 52 deletions(-)

diff --git a/npm/ng-packs/apps/dev-app/src/app/home/home.component.html b/npm/ng-packs/apps/dev-app/src/app/home/home.component.html
index 230f11f60a..387f0d9968 100644
--- a/npm/ng-packs/apps/dev-app/src/app/home/home.component.html
+++ b/npm/ng-packs/apps/dev-app/src/app/home/home.component.html
@@ -10,17 +10,18 @@
 
     <p class="lead px-lg-5 mx-lg-5">{{ '::LongWelcomeMessage' | abpLocalization }}</p>
 
-    <abp-button
-      *ngIf="!hasLoggedIn"
-      [loading]="loading"
-      (click)="login()"
-      [disabled]="loading"
-      class="px-4 ml-1"
-      role="button"
-      iconClass="fa fa-sign-in"
-    >
-      {{ 'AbpAccount::Login' | abpLocalization }}
-    </abp-button>
+    @if (!hasLoggedIn) {
+      <abp-button
+        [loading]="loading"
+        (click)="login()"
+        [disabled]="loading"
+        class="px-4 ml-1"
+        role="button"
+        iconClass="fa fa-sign-in"
+      >
+        {{ 'AbpAccount::Login' | abpLocalization }}
+      </abp-button>
+    }
   </div>
   <div class="my-3 text-center">
     <h3>Let's improve your application!</h3>
@@ -299,17 +300,14 @@
         {{ context.title }}
       </h5>
       <p [innerHTML]="context.description"></p>
-      <ng-container
-        *ngIf="context.customTemplate"
-        [ngTemplateOutlet]="context.customTemplate"
-      ></ng-container>
-      <a
-        *ngFor="let link of context.links"
-        [href]="link.href"
-        target="_blank"
-        class="btn btn-link px-1"
-        >{{ link.label }} <i class="fas fa-chevron-right" aria-hidden="true"></i
-      ></a>
+      @if (context.customTemplate) {
+        <ng-container [ngTemplateOutlet]="context.customTemplate"></ng-container>
+      }
+      @for (link of context.links; track $index) {
+        <a [href]="link.href" target="_blank" class="btn btn-link px-1"
+          >{{ link.label }} <i class="fas fa-chevron-right" aria-hidden="true"></i
+        ></a>
+      }
     </div>
   </div>
 </ng-template>
diff --git a/templates/app-nolayers/angular/src/app/home/home.component.html b/templates/app-nolayers/angular/src/app/home/home.component.html
index 5336e56c18..76ca024561 100644
--- a/templates/app-nolayers/angular/src/app/home/home.component.html
+++ b/templates/app-nolayers/angular/src/app/home/home.component.html
@@ -7,9 +7,10 @@
     </div>
     <div class="card-body">
       @if(!hasLoggedIn){
-        <button class="btn btn-primary mb-2" (click)="login()">{{ 'AbpUi::Login' | abpLocalization }}</button>
+        <button class="btn btn-primary mb-2" (click)="login()">
+          {{ 'AbpUi::Login' | abpLocalization }}
+        </button>
       }
-      
       <p>{{ '::Welcome_Text' | abpLocalization }}</p>
     </div>
   </div>
diff --git a/templates/app-nolayers/angular/src/favicon.ico b/templates/app-nolayers/angular/src/favicon.ico
index 39695854d21146f87f3c65b27b9baef29b609255..3a4e8ddfccec21df09d5b32644857347d8e8e794 100644
GIT binary patch
literal 1406
zcmV-^1%djBP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH1o=rsK~#7FtyfQP
z8$}d<Z=E=Cq?EPFg%camO5BoMK;@D(tw<b!l6->LoJbIgO-~@II4Xq`#1)X-u>A?@
zNNth>jn_BCCFaH<h~)!-x2hCxVtXEMcGo7c*UoO#cd&P7-^}~>d%u}M2q_2mc6AiE
z1VGFDsyTxM1}aKXv_&;(teFr(FpTnHVkZxX8$(n~At<|Ote4?cJFx%$PDTOT4x&q<
zl}H+&89{VIW#B;H)lh*=eoPJ1BOuEbv8fd!ZNU{X;=6#hsh*8SR|#Oo@sh}D0_{y2
zYX-lj83!e7LxJ7b{N^K|IsvvU)mCQwKnI1?{OMxZU$@6_V>FuM!9jI4TO`txCl3sn
z4Mm}2Vq?Aw6V>J`>$CSK_Lqt9iJZ%0x$o@7(nUR`^U!$vTg{G+9S<=sMH@k-a{kuC
zRR`??(t{KU(aBz0V68Kk$BLPWgPgAeBxoCmGzcJVZn>AY9_sTF?Fa^h5QSj#^RfNR
zB?lU}AEh`w%V8GcOh_<tq_E}pT>?@5N5BUs4CIXZM0FoQ)(e&(yy!Ib^_$6G)(rHF
zT@(hQ3p&E-{;7-`dwizrfI!gU8e%J?dkdPq-xQ*v_u!jZ1!<}400Yk#$yW-ZCjYn$
zJsH6K2bJ~eeQrT+W!-l!;r}IIr7H=;-#+@Jp2`bHpJYA93WF!RW$R?12G<bo@0z<7
z%{Vv^n3+FXUy)<kiGw15KT)}JU7HRQwgE~J2#o_XcJgJlq8HRAHI`+{<sdVk7U9U*
zfIiST&!zFRJ+Ln@p?&+&aff;Xi4dvSpAWjMCJpmG!R_o2*-%Ugf?VECI_=xt3n-$j
z@Rv#;GGa=-WL&MNcxG4F_|<a}iup#e%N-5|^y9i3`{N6fdn3WfG6&jauyV>Wv6HX5
z3+So3nzs@bjg8OB#bJoZ$iF{LraSXoe^@^J&8kp~_MW{L&&&7bt#9U9NU2UXc*C(I
z<;I%lB{a9Jh26TwDVsZ7zfrpTalJqw{yzHoX3oh5mx6nI1IgVBnEx%o8xxG%kMq`w
zB@IUu?hb<T^FqAjlz>w=0}<3e`t`+hgv8e9owx*4wKoF2P*)dDGdUEnLDbH8Y0;SV
zQg_q;uC@u&`C{DQ(QIG%47hu#x=u*axW*l1@~G<od7$BssTN|2Gh*<I!9c4%y%RT_
zhy`roDJ)A}x?C8|dtmfag&i?D>M}cNvfc|$@oS{OjNEH@f4B%v=egs6i5Gj;X(7@{
ziKN`(xu+lkA3^4V%fQvxSVk7N(_-j55ls2xfKZXq`pC0)Z<L(qeU4x<Dra$VO%n6A
zahHlol=>7rcEr{IZXnmG7T6^SYn-F66datn4#+xleJ(A;X>+)mBc1kJL~dXUKh$-j
z_=ZVDc?cm$q6^aQiD)zmvTijWLxVS}2o&_~x_VT+nGNa$>*byoUoZDLP@aujPv22z
z*<{Y)YVX8L0)8L78fartcgORb$dU)HepSA-0P3u_)e~U9NM@XDMdn_Pw5zHCa2AEX
zXc)iq)r_-|K3t2N&ir(JNg)rUoIyVD)H*fql|UDh<d6Sk2$kWtB9xIwa)9k>$B`fs
z_-3^5Q@sKKwrmOBMiZutY&_5*M}dHH_-Q<W2v-5k#3m$y8kZ94ZYU+WQ=cQ319Wg$
z4=jf>m{{y{cpS#Kl>Y!-?<(hZvj8vv000hUSV?A0O#mtY000O800000007cclK=n!
M07*qoM6N<$g6uww1^@s6

literal 102968
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
Kp#2tJdH+9GLJime

diff --git a/templates/app/angular/src/app/home/home.component.html b/templates/app/angular/src/app/home/home.component.html
index 703bc00e58..ae7477b50a 100644
--- a/templates/app/angular/src/app/home/home.component.html
+++ b/templates/app/angular/src/app/home/home.component.html
@@ -2,39 +2,51 @@
   <div class="p-5 text-center">
     <div class="d-inline-block bg-success text-white p-1 h5 rounded mb-4" role="alert">
       <h5 class="m-1">
-        <i class="fas fa-rocket" aria-hidden="true"></i> Congratulations, <strong>MyProjectName</strong> is
-        successfully running!
+        <i class="fas fa-rocket" aria-hidden="true"></i> Congratulations,
+        <strong>MyProjectName</strong> is successfully running!
       </h5>
     </div>
     <h1>{{ '::Welcome' | abpLocalization }}</h1>
 
     <p class="lead px-lg-5 mx-lg-5">{{ '::LongWelcomeMessage' | abpLocalization }}</p>
 
-    <a *ngIf="!hasLoggedIn" (click)="login()" class="px-4 btn btn-primary ms-1" role="button"
-    ><i class="fa fa-sign-in" aria-hidden="true"></i> {{ 'AbpAccount::Login' | abpLocalization }}</a
-    >
+    @if(!hasLoggedIn){
+      <a (click)="login()" class="px-4 btn btn-primary ms-1" role="button"
+        ><i class="fa fa-sign-in" aria-hidden="true"></i>
+        {{ 'AbpAccount::Login' | abpLocalization }}</a
+      >
+    }
   </div>
   <div class="card">
     <div class="card-body">
       <div class="row">
         <div class="col-md-auto text-center">
-          <img src="https://abp.io/assets/png/mastering-abp-framework.webp" style="max-width: 400px;"
-               class="w-100 mb-5 my-md-3">
+          <img
+            src="https://abp.io/assets/png/mastering-abp-framework.webp"
+            style="max-width: 400px"
+            class="w-100 mb-5 my-md-3"
+          />
         </div>
         <div class="col-md d-flex align-items-center">
           <div class="pe-0 pe-md-4">
             <small class="text-uppercase text-muted">THE OFFICIAL GUIDE</small>
             <h2 class="mb-4">Mastering ABP Framework</h2>
-            <p class="mb-4">Written by the creator of the ABP Framework, this book will help you gain a complete
-              understanding of the framework and modern web application development techniques.</p>
+            <p class="mb-4">
+              Written by the creator of the ABP Framework, this book will help you gain a complete
+              understanding of the framework and modern web application development techniques.
+            </p>
             <div class="mb-4">
-              <a href="https://www.amazon.com/gp/product/B097Z2DM8Q/ref=dbs_a_def_rwt_hsch_vapi_tkin_p1_i0"
-                 class="btn btn-success mb-1">
+              <a
+                href="https://www.amazon.com/gp/product/B097Z2DM8Q/ref=dbs_a_def_rwt_hsch_vapi_tkin_p1_i0"
+                class="btn btn-success mb-1"
+              >
                 Buy on Amazon US
               </a>
               &nbsp;
-              <a href="https://www.packtpub.com/product/mastering-abp-framework/9781801079242"
-                 class="btn btn-primary mb-1">
+              <a
+                href="https://www.packtpub.com/product/mastering-abp-framework/9781801079242"
+                class="btn btn-primary mb-1"
+              >
                 Buy on PACKT
               </a>
             </div>
@@ -297,13 +309,16 @@
   <div class="mb-5 text-center">
     <p class="align-middle">
       <a href="https://twitter.com/abpframework" target="_blank" class="mx-2"
-      ><i class="fa fa-twitter" aria-hidden="true"></i><span class="text-secondary"> Abp Framework</span></a
+        ><i class="fa fa-twitter" aria-hidden="true"></i
+        ><span class="text-secondary"> Abp Framework</span></a
       >
       <a href="https://twitter.com/abpcommercial" target="_blank" class="mx-2"
-      ><i class="fa fa-twitter" aria-hidden="true"></i><span class="text-secondary"> Abp Commercial</span></a
+        ><i class="fa fa-twitter" aria-hidden="true"></i
+        ><span class="text-secondary"> Abp Commercial</span></a
       >
       <a href="https://github.com/abpframework/abp" target="_blank" class="mx-2"
-      ><i class="fa fa-github" aria-hidden="true"></i><span class="text-secondary"> abpframework</span></a
+        ><i class="fa fa-github" aria-hidden="true"></i
+        ><span class="text-secondary"> abpframework</span></a
       >
     </p>
   </div>
@@ -313,20 +328,17 @@
   <div class="col-lg-4 border-start">
     <div class="p-4">
       <h5 class="mb-3">
-        <i class="fas fa-cubes text-secondary d-block my-3 fa-2x" aria-hidden="true"></i> {{ context.title }}
+        <i class="fas fa-cubes text-secondary d-block my-3 fa-2x" aria-hidden="true"></i>
+        {{ context.title }}
       </h5>
       <p [innerHTML]="context.description"></p>
-      <ng-container
-        *ngIf="context.customTemplate"
-        [ngTemplateOutlet]="context.customTemplate"
-      ></ng-container>
-      <a
-        *ngFor="let link of context.links"
-        [href]="link.href"
-        target="_blank"
-        class="btn btn-link px-1"
-      >{{ link.label }} <i class="fas fa-chevron-right" aria-hidden="true"></i
+      @if (context.customTemplate) {
+      <ng-container [ngTemplateOutlet]="context.customTemplate"></ng-container>
+      } @for (link of context.links; track $index) {
+      <a [href]="link.href" target="_blank" class="btn btn-link px-1"
+        >{{ link.label }} <i class="fas fa-chevron-right" aria-hidden="true"></i
       ></a>
+      }
     </div>
   </div>
 </ng-template>
@@ -338,7 +350,7 @@
         <i class="fas fa-plus d-block mb-3 fa- 2x text-secondary" aria-hidden="true"></i>
         <span [innerHTML]="context.title"></span>
         <a [href]="context.href" target="_blank" class="d-block mt-2 btn btn-sm btn-link"
-        >Details <i class="fas fa-chevron-right" aria-hidden="true"></i
+          >Details <i class="fas fa-chevron-right" aria-hidden="true"></i
         ></a>
       </h6>
     </div>
diff --git a/templates/app/angular/src/favicon.ico b/templates/app/angular/src/favicon.ico
index 39695854d21146f87f3c65b27b9baef29b609255..3a4e8ddfccec21df09d5b32644857347d8e8e794 100644
GIT binary patch
literal 1406
zcmV-^1%djBP)<h;3K|Lk000e1NJLTq001BW001Be1^@s6b9#F800009a7bBm000XU
z000XU0RWnu7ytkO0drDELIAGL9O(c600d`2O+f$vv5yP<VFdsH1o=rsK~#7FtyfQP
z8$}d<Z=E=Cq?EPFg%camO5BoMK;@D(tw<b!l6->LoJbIgO-~@II4Xq`#1)X-u>A?@
zNNth>jn_BCCFaH<h~)!-x2hCxVtXEMcGo7c*UoO#cd&P7-^}~>d%u}M2q_2mc6AiE
z1VGFDsyTxM1}aKXv_&;(teFr(FpTnHVkZxX8$(n~At<|Ote4?cJFx%$PDTOT4x&q<
zl}H+&89{VIW#B;H)lh*=eoPJ1BOuEbv8fd!ZNU{X;=6#hsh*8SR|#Oo@sh}D0_{y2
zYX-lj83!e7LxJ7b{N^K|IsvvU)mCQwKnI1?{OMxZU$@6_V>FuM!9jI4TO`txCl3sn
z4Mm}2Vq?Aw6V>J`>$CSK_Lqt9iJZ%0x$o@7(nUR`^U!$vTg{G+9S<=sMH@k-a{kuC
zRR`??(t{KU(aBz0V68Kk$BLPWgPgAeBxoCmGzcJVZn>AY9_sTF?Fa^h5QSj#^RfNR
zB?lU}AEh`w%V8GcOh_<tq_E}pT>?@5N5BUs4CIXZM0FoQ)(e&(yy!Ib^_$6G)(rHF
zT@(hQ3p&E-{;7-`dwizrfI!gU8e%J?dkdPq-xQ*v_u!jZ1!<}400Yk#$yW-ZCjYn$
zJsH6K2bJ~eeQrT+W!-l!;r}IIr7H=;-#+@Jp2`bHpJYA93WF!RW$R?12G<bo@0z<7
z%{Vv^n3+FXUy)<kiGw15KT)}JU7HRQwgE~J2#o_XcJgJlq8HRAHI`+{<sdVk7U9U*
zfIiST&!zFRJ+Ln@p?&+&aff;Xi4dvSpAWjMCJpmG!R_o2*-%Ugf?VECI_=xt3n-$j
z@Rv#;GGa=-WL&MNcxG4F_|<a}iup#e%N-5|^y9i3`{N6fdn3WfG6&jauyV>Wv6HX5
z3+So3nzs@bjg8OB#bJoZ$iF{LraSXoe^@^J&8kp~_MW{L&&&7bt#9U9NU2UXc*C(I
z<;I%lB{a9Jh26TwDVsZ7zfrpTalJqw{yzHoX3oh5mx6nI1IgVBnEx%o8xxG%kMq`w
zB@IUu?hb<T^FqAjlz>w=0}<3e`t`+hgv8e9owx*4wKoF2P*)dDGdUEnLDbH8Y0;SV
zQg_q;uC@u&`C{DQ(QIG%47hu#x=u*axW*l1@~G<od7$BssTN|2Gh*<I!9c4%y%RT_
zhy`roDJ)A}x?C8|dtmfag&i?D>M}cNvfc|$@oS{OjNEH@f4B%v=egs6i5Gj;X(7@{
ziKN`(xu+lkA3^4V%fQvxSVk7N(_-j55ls2xfKZXq`pC0)Z<L(qeU4x<Dra$VO%n6A
zahHlol=>7rcEr{IZXnmG7T6^SYn-F66datn4#+xleJ(A;X>+)mBc1kJL~dXUKh$-j
z_=ZVDc?cm$q6^aQiD)zmvTijWLxVS}2o&_~x_VT+nGNa$>*byoUoZDLP@aujPv22z
z*<{Y)YVX8L0)8L78fartcgORb$dU)HepSA-0P3u_)e~U9NM@XDMdn_Pw5zHCa2AEX
zXc)iq)r_-|K3t2N&ir(JNg)rUoIyVD)H*fql|UDh<d6Sk2$kWtB9xIwa)9k>$B`fs
z_-3^5Q@sKKwrmOBMiZutY&_5*M}dHH_-Q<W2v-5k#3m$y8kZ94ZYU+WQ=cQ319Wg$
z4=jf>m{{y{cpS#Kl>Y!-?<(hZvj8vv000hUSV?A0O#mtY000O800000007cclK=n!
M07*qoM6N<$g6uww1^@s6

literal 102968
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
Kp#2tJdH+9GLJime


From 21a1cf4200c97d7937729fbfa86c5473de138d15 Mon Sep 17 00:00:00 2001
From: Sinan997 <sinanozturk997@gmail.com>
Date: Wed, 3 Apr 2024 17:18:56 +0300
Subject: [PATCH 8/8] remove duplicated *ngIf structural directive

---
 .../theme-basic/src/lib/components/logo/logo.component.ts        | 1 -
 .../src/lib/components/nav-items/current-user.component.html     | 1 -
 2 files changed, 2 deletions(-)

diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts b/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts
index 68d2c8c065..9930102edf 100644
--- a/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts
+++ b/npm/ng-packs/packages/theme-basic/src/lib/components/logo/logo.component.ts
@@ -7,7 +7,6 @@ import { Component } from '@angular/core';
     <a class="navbar-brand" routerLink="/">
       @if (appInfo.logoUrl) {
         <img
-          *ngIf="appInfo.logoUrl"
           [src]="appInfo.logoUrl"
           [alt]="appInfo.name"
           width="100%"
diff --git a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.html b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.html
index 7837bf5b0a..2559e52161 100644
--- a/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.html
+++ b/npm/ng-packs/packages/theme-basic/src/lib/components/nav-items/current-user.component.html
@@ -1,6 +1,5 @@
 @if ((currentUser$ | async)?.isAuthenticated) {
   <div
-    *ngIf="(currentUser$ | async)?.isAuthenticated"
     ngbDropdown
     class="dropdown"
     #currentUserDropdown="ngbDropdown"