feat!: use local route for local router store

[LayZeeDK]

This change in implementation will make the local router store more closely match ActivatedRoute while the global router store matches NgRx Router Store selectors. Through complex route configurations, the router store implementations are exercised to identify edge case differences between them and any breaking changes introduced to the local router store.

Features

• LocalRouterStore matches ActivatedRoute more closely
  • Use ActivatedRoute to serialize the router state for the local router store implementation (LocalRouterStore)
  • LocalRouterStore.currentRoute$ matches ActivatedRoute.snapshot

Testing

• Use Spectactular (15.0) feature harnesses
• Compare LocalRouterStore selectors to ActivatedRoute observables
• Compare GlobalRouterStore selectors to NgRx Router Store selectors and Router#events
• Cover nested and componentless routes with route data
• Cover nested and componentless routes with route parameters
• Cover route fragment
• Cover current route for nested routes
• Cover nested route URLs
• Cover nested route titles

BREAKING CHANGES

BEFORE:

(Router Component Store <=0.3.2)

// URL: /parent/child/grandchild

@Component({
  /* (...) */
  providers: [provideLocalRouterStore()],
})
export class ChildComponent implements OnInit {
  #route = inject(ActivatedRoute);
  #routerStore = inject(RouterStore);

  ngOnInit() {
    const currentRouteSnapshot = this.#route.snapshot;
    console.log(currentRouteSnapshot.routeConfig.path);
    // -> "child"
    console.log(currentRouteSnapshot.url[0].path);
    // -> "child"

    firstValueFrom(this.#routerStore.currentRoute$)
      .then(currentRoute => {
        console.log(currentRoute.routeConfig.path);
        // -> "grandchild"
        console.log(currentRoute.url[0].path);
        // -> "grandchild"
      });
  }
}

AFTER:

(Router Component Store >0.3.2)

// URL: /parent/child/grandchild

@Component({
  /* (...) */
  providers: [provideLocalRouterStore()],
})
export class ChildComponent implements OnInit {
  #route = inject(ActivatedRoute);
  #routerStore = inject(RouterStore);

  ngOnInit() {
    const currentRouteSnapshot = this.#route.snapshot;
    console.log(currentRouteSnapshot.routeConfig.path);
    // -> "child"
    console.log(currentRouteSnapshot.url[0].path);
    // -> "child"

    firstValueFrom(this.#routerStore.currentRoute$)
      .then(currentRoute => {
        console.log(currentRoute.routeConfig.path);
        // -> "child"
        console.log(currentRoute.url[0].path);
        // -> "child"
      });
  }
}