Search code examples
angularngxs

ngxs state not updating

I have two state models, login and settings. When I update the login state the state object contains the new values, when I do the same to the settings state the action fires but no update occurs. I would like to drawerExpandedState to be saved:

Here the state

@State<SettingsStateModel>({
  name: 'settings',
  defaults: {
    tiles: [],
    drawerExpandedState: false
  }
})

Here the action:

  export class DrawerOpenState {
     static readonly type = '[Settings] drawer open state'
     constructor (public payload: { expandedState: boolean }) { }
  }

  @Action(DrawerOpenState)
  drawerOpenState(ctx: StateContext<SettingsStateModel>, expandedState: boolean) {

    ctx.setState(
      patch({ drawerExpandedState: expandedState })
    );

    // const state = ctx.getState();
    // ctx.setState({
    //   ...state,
    //   drawerExpandedState: expandedState
    // });
  }

This is how I dispatch the action:

    this.store.dispatch(new DrawerOpenState({ expandedState: drawer.expanded }))

as you can see the action fires but the state is not updated???

enter image description here

after the action DrawerOpenState I was expecting there to be a SettingsStateModel visible in Redux... any ideas?

Solution

  • I forgot to add the new State to the NgxsModule in the app.module.ts file!

    NgxsModule.forRoot([AuthState, SettingsState]) fixed my problem!