State & Data Flow

Application state in the Provision Portal UI is managed with Angular signals and the @ngrx/signals Signal Store — there is no NgRx @ngrx/store/effects setup.

Building blocks

Mechanism Role

@ngrx/signals Signal Store

Collection state with async methods — e.g. UserStore (models/store/user.store.ts) holds the paged user list, loading flag, and paging state, and exposes load, updatePage, updateSize, addUser, deleteByIds via rxMethod.

Plain signal services

Simple shared state — ServerService (server config + app version signals), MenuStateService (menu open / pinned).

Component signals

Local view state inside standalone components (signal, computed).

Data flow (high level)

  1. A component calls a store method (e.g. userStore.load()) or a service method.

  2. In the Signal Store, an rxMethod sets isLoading, calls the backend through the service, and `patchState`s the result (or clears loading on error).

  3. Components read state via the store’s signals and render it; changes propagate reactively.

Server config as shared state

ServerService fetches ui/server/configuration once and caches it in a readonly signal (and sessionStorage). Guards and components read this signal to drive feature flags — for example the Deactivate Service page is gated on deactivateService.enable.

Subscription lifecycle

Components with manual subscriptions extend BaseComponent, which exposes a destroy$ subject and completes it in ngOnDestroy; those components use takeUntil(this.destroy$) for teardown. Signal Store `rxMethod`s manage their own subscription lifecycle.

Related pages