update: auto-save arrangements

npm/ng-packs/packages/theme-basic/src/lib/components/routes/routes.component.html

@@ -1,78 +1,109 @@
 <ul class="navbar-nav">
   @for (route of routesService.visible$ | async; track $index) {
-  <ng-container [ngTemplateOutlet]="isDropdown(route) ? dropdownLink : defaultLink"
+    <ng-container
-    [ngTemplateOutletContext]="{ $implicit: route }" />
+      [ngTemplateOutlet]="isDropdown(route) ? dropdownLink : defaultLink"
+      [ngTemplateOutletContext]="{ $implicit: route }"
+    />
   }
 
   <ng-template #defaultLink let-route>
     <li class="nav-item" *abpPermission="route.requiredPolicy">
       <a class="nav-link" [routerLink]="[route.path]">
         @if (route.iconClass) {
-        <i [ngClass]="route.iconClass"></i>
+          <i [ngClass]="route.iconClass"></i>
         }
-        {{ route.name | abpAsyncLocalization | async}}
+        {{ route.name | abpAsyncLocalization | async }}
       </a>
     </li>
   </ng-template>
 
   <ng-template #dropdownLink let-route>
     @if (route.children?.length) {
-    <li class="nav-item dropdown" display="static" *abpPermission="route.requiredPolicy" (click)="
+      <li
+        class="nav-item dropdown"
+        display="static"
+        *abpPermission="route.requiredPolicy"
+        (click)="
           rootDropdownExpand[route.name]
             ? (rootDropdownExpand[route.name] = false)
             : (rootDropdownExpand[route.name] = true)
-        ">
+        "
-      <a class="nav-link dropdown-toggle" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false"
+      >
-        href="javascript:void(0)">
+        <a
-        @if (route.iconClass) {
+          class="nav-link dropdown-toggle"
-        <i [ngClass]="route.iconClass"></i>
+          data-toggle="dropdown"
-        }
+          aria-haspopup="true"
-        {{ route.name | abpAsyncLocalization | async }}
+          aria-expanded="false"
-      </a>
+          href="javascript:void(0)"
-      <div #routeContainer class="dropdown-menu border-0 shadow-sm"
+        >
-        (click)="$event.preventDefault(); $event.stopPropagation()"
+          @if (route.iconClass) {
-        [class.d-block]="smallScreen && rootDropdownExpand[route.name]">
+            <i [ngClass]="route.iconClass"></i>
-        <ng-container *ngTemplateOutlet="forTemplate; context: { $implicit: route }" />
+          }
-      </div>
+          {{ route.name | abpAsyncLocalization | async }}
-    </li>
+        </a>
+        <div
+          #routeContainer
+          class="dropdown-menu border-0 shadow-sm"
+          (click)="$event.preventDefault(); $event.stopPropagation()"
+          [class.d-block]="smallScreen && rootDropdownExpand[route.name]"
+        >
+          <ng-container *ngTemplateOutlet="forTemplate; context: { $implicit: route }" />
+        </div>
+      </li>
     }
   </ng-template>
 
   <ng-template #forTemplate let-route>
     @for (child of route.children; track $index) {
-    <ng-template [ngTemplateOutlet]="child.children?.length ? dropdownChild : defaultChild"
+      <ng-template
-      [ngTemplateOutletContext]="{ $implicit: child }" />
+        [ngTemplateOutlet]="child.children?.length ? dropdownChild : defaultChild"
+        [ngTemplateOutletContext]="{ $implicit: child }"
+      />
     }
   </ng-template>
 
   <ng-template #defaultChild let-child>
     @if (child.path) {
-    <div class="dropdown-submenu" *abpPermission="child.requiredPolicy">
+      <div class="dropdown-submenu" *abpPermission="child.requiredPolicy">
-      <a class="dropdown-item" [routerLink]="[child.path]" (click)="closeDropdown()">
+        <a class="dropdown-item" [routerLink]="[child.path]" (click)="closeDropdown()">
-        @if (child.iconClass) {
+          @if (child.iconClass) {
-        <i [ngClass]="child.iconClass"></i>
+            <i [ngClass]="child.iconClass"></i>
-        }
+          }
-        {{ child.name | abpLocalization }}</a>
+          {{ child.name | abpLocalization }}</a
-    </div>
+        >
+      </div>
     }
   </ng-template>
 
   <ng-template #dropdownChild let-child>
-    <div class="dropdown-submenu" ngbDropdown #dropdownSubmenu="ngbDropdown" placement="right-top" [autoClose]="true"
+    <div
-      *abpPermission="child.requiredPolicy">
+      class="dropdown-submenu"
+      ngbDropdown
+      #dropdownSubmenu="ngbDropdown"
+      placement="right-top"
+      [autoClose]="true"
+      *abpPermission="child.requiredPolicy"
+    >
       <div ngbDropdownToggle [class.dropdown-toggle]="false">
-        <a abpEllipsis="210px" [abpEllipsisEnabled]="!smallScreen" role="button"
+        <a
-          class="btn d-block text-start dropdown-toggle">
+          abpEllipsis="210px"
+          [abpEllipsisEnabled]="!smallScreen"
+          role="button"
+          class="btn d-block text-start dropdown-toggle"
+        >
           @if (child.iconClass) {
-          <i [ngClass]="child.iconClass"></i>
+            <i [ngClass]="child.iconClass"></i>
           }
           {{ child.name | abpLocalization }}
         </a>
       </div>
-      <div #childrenContainer class="dropdown-menu dropdown-menu-start border-0 shadow-sm"
+      <div
-        [class.d-block]="smallScreen && dropdownSubmenu.isOpen()">
+        #childrenContainer
+        class="dropdown-menu dropdown-menu-start border-0 shadow-sm"
+        [class.d-block]="smallScreen && dropdownSubmenu.isOpen()"
+      >
         <ng-container *ngTemplateOutlet="forTemplate; context: { $implicit: child }" />
       </div>
     </div>
   </ng-template>
-</ul>
+</ul>