Merged PR 1674: #4462 Cursor Should Select Searchbox on Initial Navigation

#4462 Cursor Should Select Searchbox on Initial Navigation

apps/shared/shell/src/lib/side-menu/side-menu.component.html

@@ -5,10 +5,11 @@
   <nav class="side-menu-group-nav">
     <a
       class="side-menu-group-item"
-      (click)="closeSideMenu(); resetBranch(); focusSearchBox()"
+      (click)="closeSideMenu(); resetBranch()"
       [routerLink]="productRoutePath$ | async"
       sharedRegexRouterLinkActive="active"
       sharedRegexRouterLinkActiveTest="^\/kunde\/\d*\/product"
+      (isActiveChange)="focusSearchBox()"
     >
       <div class="side-menu-group-item-icon">
         <shared-icon icon="import-contacts"></shared-icon>
@@ -20,12 +21,12 @@
       <a
         *ngIf="customerSearchRoute$ | async; let customerSearchRoute"
         class="side-menu-group-item"
-        (click)="closeSideMenu(); focusSearchBox()"
+        (click)="closeSideMenu()"
         [routerLink]="customerSearchRoute.path"
         [queryParams]="customerSearchRoute.queryParams"
         sharedRegexRouterLinkActive="active"
         sharedRegexRouterLinkActiveTest="^\/kunde\/\d*\/customer"
-        (isActiveChange)="customerActive($event)"
+        (isActiveChange)="customerActive($event); focusSearchBox()"
       >
         <span class="side-menu-group-item-icon">
           <shared-icon icon="person"></shared-icon>
@@ -46,11 +47,12 @@
         <a
           *ngIf="customerSearchRoute$ | async; let customerSearchRoute"
           class="side-menu-group-item"
-          (click)="closeSideMenu(); focusSearchBox()"
+          (click)="closeSideMenu()"
           [routerLink]="customerSearchRoute.path"
           [queryParams]="customerSearchRoute.queryParams"
           sharedRegexRouterLinkActive="active"
           sharedRegexRouterLinkActiveTest="^\/kunde\/\d*\/customer\/(\(search|search)"
+          (isActiveChange)="focusSearchBox()"
         >
           <span class="side-menu-group-item-icon"></span>
           <span class="side-menu-group-item-label">
@@ -60,7 +62,7 @@
         <a
           *ngIf="customerCreateRoute$ | async; let customerCreateRoute"
           class="side-menu-group-item"
-          (click)="closeSideMenu(); focusSearchBox()"
+          (click)="closeSideMenu()"
           [routerLink]="customerCreateRoute.path"
           [queryParams]="customerCreateRoute.queryParams"
           sharedRegexRouterLinkActive="active"
@@ -77,10 +79,11 @@
     <a
       *ifRole="'Store'"
       class="side-menu-group-item"
-      (click)="closeSideMenu(); focusSearchBox()"
+      (click)="closeSideMenu()"
       [routerLink]="pickUpShelfOutRoutePath$ | async"
       sharedRegexRouterLinkActive="active"
       sharedRegexRouterLinkActiveTest="^\/kunde\/\d*\/pickup-shelf"
+      (isActiveChange)="focusSearchBox()"
     >
       <span class="side-menu-group-item-icon">
         <shared-icon icon="unarchive"></shared-icon>
@@ -93,9 +96,10 @@
     <a
       *ifRole="'CallCenter'"
       class="side-menu-group-item"
-      (click)="closeSideMenu(); resetBranch(); focusSearchBox()"
+      (click)="closeSideMenu(); resetBranch()"
       [routerLink]="customerOrdersRoutePath$ | async"
       routerLinkActive="active"
+      (isActiveChange)="focusSearchBox()"
     >
       <span class="side-menu-group-item-icon">
         <shared-icon icon="deployed-code"></shared-icon>
@@ -115,10 +119,11 @@
     <a
       *ngIf="taskCalenderNavigation$ | async; let taskCalenderNavigation"
       class="side-menu-group-item"
-      (click)="closeSideMenu(); focusSearchBox()"
+      (click)="closeSideMenu()"
       [routerLink]="taskCalenderNavigation.path"
       [queryParams]="taskCalenderNavigation.queryParams"
       routerLinkActive="active"
+      (isActiveChange)="focusSearchBox()"
     >
       <span class="side-menu-group-item-icon">
         <shared-icon icon="event-available"></shared-icon>
@@ -146,13 +151,13 @@
     <div class="side-menu-group-sub-item-wrapper">
       <a
         class="side-menu-group-item"
-        (click)="closeSideMenu(); focusSearchBox()"
+        (click)="closeSideMenu()"
         *ngIf="pickUpShelfInRoutePath$ | async; let pickUpShelfInNavigation"
         [routerLink]="pickUpShelfInNavigation.path"
         [queryParams]="pickUpShelfInNavigation.queryParams"
         sharedRegexRouterLinkActive="active"
         sharedRegexRouterLinkActiveTest="^\/filiale\/(pickup-shelf|goods\/in)"
-        (isActiveChange)="shelfActive($event)"
+        (isActiveChange)="shelfActive($event); focusSearchBox()"
       >
         <span class="side-menu-group-item-icon">
           <shared-icon icon="isa-abholfach"></shared-icon>
@@ -173,10 +178,11 @@
         <a
           class="side-menu-group-item"
           *ngIf="pickUpShelfInListRoutePath$ | async; let pickUpShelfInListNavigation"
-          (click)="closeSideMenu(); focusSearchBox()"
+          (click)="closeSideMenu()"
           [routerLink]="pickUpShelfInListNavigation.path"
           [queryParams]="pickUpShelfInListNavigation.queryParams"
           routerLinkActive="active"
+          (isActiveChange)="focusSearchBox()"
         >
           <span class="side-menu-group-item-icon"></span>
           <span class="side-menu-group-item-label">
@@ -185,7 +191,7 @@
         </a>
         <a
           class="side-menu-group-item"
-          (click)="closeSideMenu(); focusSearchBox()"
+          (click)="closeSideMenu()"
           [routerLink]="['/filiale', 'goods', 'in', 'reservation']"
           routerLinkActive="active"
         >
@@ -196,7 +202,7 @@
         </a>
         <a
           class="side-menu-group-item"
-          (click)="closeSideMenu(); focusSearchBox()"
+          (click)="closeSideMenu()"
           [routerLink]="['/filiale', 'goods', 'in', 'cleanup']"
           routerLinkActive="active"
         >
@@ -207,7 +213,7 @@
         </a>
         <a
           class="side-menu-group-item"
-          (click)="closeSideMenu(); focusSearchBox()"
+          (click)="closeSideMenu()"
           [routerLink]="['/filiale', 'goods', 'in', 'preview']"
           routerLinkActive="active"
         >
@@ -218,7 +224,7 @@
         </a>
         <a
           class="side-menu-group-item"
-          (click)="closeSideMenu(); focusSearchBox()"
+          (click)="closeSideMenu()"
           [routerLink]="['/filiale', 'goods', 'in', 'list']"
           routerLinkActive="active"
         >
@@ -253,6 +259,7 @@
       [routerLink]="packageInspectionNavigation.path"
       [queryParams]="packageInspectionNavigation.queryParams"
       routerLinkActive="active"
+      (isActiveChange)="focusSearchBox()"
     >
       <span class="side-menu-group-item-icon">
         <shared-icon icon="clipboard-check-outline"></shared-icon>

apps/shared/shell/src/lib/side-menu/side-menu.component.ts

@@ -247,7 +247,7 @@ export class ShellSideMenuComponent {
   }
 
   focusSearchBox() {
-    this._document.getElementById('searchbox')?.focus();
+    setTimeout(() => this._document.getElementById('searchbox')?.focus(), 0);
   }
 
   async createProcess() {