How to track changes in ngrx/signals store in a component

I have signal store

export const Store = signalStore(
withState(initialState),
withMethods((store, userService = inject(UserService)) => ({
getUser: rxMethod<string>(
pipe(
switchMap((id) => {
return userService.get(id).pipe(
tapResponse({
next: (user) => patchState(store, { user }),
error: console.error,
})
);
})
)
),
}))
);


In component i use like

public getUser(id: string): void{
this.store.getUser(id)
}


How can I track inside the component when the api call is completed, show notification for example?

Is it good practice to create status to track this api call?

type ArticlesState = {
user: IUser;
status: 'fulfilled' | 'loading' | 'error'
};


and handle it

getUser: rxMethod<string>(
pipe(
tap(() => patchState(store, { status: 'loading'}),
switchMap((id) => {
return userService.get(id).pipe(
tapResponse({
next: (user) => patchState(store, { user, status: 'ful1filled' }),
error: console.error,
})
);
})
)
),

Continue reading...