update

src/app/domains/pos/layouts/layout.component.html

@@ -25,8 +25,11 @@
           <!-- [ngStyle]="{ transform: 'scale(1.' + pullDistance() * 10 + ')' }" -->
         </div>
       }
+      {{ isAuth() }}
       @if (isAuth()) {
-        <router-outlet></router-outlet>
+        @defer (when isAuth()) {
+          <router-outlet></router-outlet>
+        }
       } @else {
         @defer (when !isAuth()) {
           <pos-pages-layout />

src/app/domains/pos/layouts/layout.component.ts

@@ -1,6 +1,7 @@
 import { CommonModule } from '@angular/common';
-import { Component, computed, signal } from '@angular/core';
-import { RouterOutlet } from '@angular/router';
+import { Component, computed, inject, signal } from '@angular/core';
+import { NavigationEnd, Router, RouterOutlet } from '@angular/router';
+import { filter } from 'rxjs';
 import { PosSplashComponent } from '../components/splash.component';
 import { PosPagesLayoutComponent } from './pagesLayout/layout.component';
 
@@ -10,14 +11,23 @@ import { PosPagesLayoutComponent } from './pagesLayout/layout.component';
   imports: [PosSplashComponent, PosPagesLayoutComponent, RouterOutlet, CommonModule],
 })
 export class PosLayoutComponent {
+  private readonly router = inject(Router);
+
   showSplash = signal(true);
-  isAuth = computed(() => window.location.pathname === '/auth');
+  private readonly currentUrl = signal(this.router.url);
+  isAuth = computed(() => this.currentUrl() === '/auth');
 
   private touchStartY = 0;
   private pulling = false;
   pullDistance = signal(0);
   readonly pullThreshold = 80;
 
+  constructor() {
+    this.router.events
+      .pipe(filter((event) => event instanceof NavigationEnd))
+      .subscribe(() => this.currentUrl.set(this.router.url));
+  }
+
   onSplashCompleted() {
     this.showSplash.set(false);
   }