Store: [Feature Request] Remove action class concept

Created on 14 Aug 2018  路  3Comments  路  Source: ngxs/store

Feature Request?

Is it possible to get rid of the concept with the action in a separate class and set the type and the payload directly in the decorator?

Something like this

@Action(type: string, (payload: T) => payload)

Most helpful comment

@amcdnl @markwhitfeld It would be nice to remove an extra file auth.actions.ts (boilerplate)

Add a new decorator Dispatcher, Dispatch

import { State, Selector, Dispatcher } from '@ngxs/store';

export class AuthStateModel {
  public authData: Authentication;
}

@State<AuthStateModel>({
  name: 'authStore',
  defaults: {
    authData: null
  }
})
export class AuthState {

  @Selector()
  public static getAuthData(state: AuthStateModel) {
    return state.authData;
  }

  @Dispatcher()
  public static updateAuth({ patchState }: StateContext<AuthStateModel>, payload: Authentication) {
    patchState({ authData: payload });
  }

}


Thus, we will have typed actions and everything is obvious

````ts

export class LoginComponent {

ngOnInit() {
const authData = { newValue };
this.store.action(AuthState.updateAuth).dispatch(authData);
}

}

````

````ts

import { Dispatch, DispatchSubject } from '@ngxs/store';

export class LoginComponent {

@Dispatch(AuthState.updateAuth)
updateAuth: DispatchSubject;

ngOnInit() {
const authData = { newValue };
this.updateAuth.dispatch(authData);
}

}

````

All 3 comments

@amcdnl @markwhitfeld It would be nice to remove an extra file auth.actions.ts (boilerplate)

Add a new decorator Dispatcher, Dispatch

import { State, Selector, Dispatcher } from '@ngxs/store';

export class AuthStateModel {
  public authData: Authentication;
}

@State<AuthStateModel>({
  name: 'authStore',
  defaults: {
    authData: null
  }
})
export class AuthState {

  @Selector()
  public static getAuthData(state: AuthStateModel) {
    return state.authData;
  }

  @Dispatcher()
  public static updateAuth({ patchState }: StateContext<AuthStateModel>, payload: Authentication) {
    patchState({ authData: payload });
  }

}


Thus, we will have typed actions and everything is obvious

````ts

export class LoginComponent {

ngOnInit() {
const authData = { newValue };
this.store.action(AuthState.updateAuth).dispatch(authData);
}

}

````

````ts

import { Dispatch, DispatchSubject } from '@ngxs/store';

export class LoginComponent {

@Dispatch(AuthState.updateAuth)
updateAuth: DispatchSubject;

ngOnInit() {
const authData = { newValue };
this.updateAuth.dispatch(authData);
}

}

````

Hmmm... This is a very interesting idea. Did you get this idea from anywhere?
@amcdnl I would be interested to get your take on this idea (from the comment, not the issue description) with the @Dispatcher and @Dispatch

Was this page helpful?
0 / 5 - 0 ratings

Related issues

sanchezcarlosjr picture sanchezcarlosjr  路  40Comments

amjmhs picture amjmhs  路  21Comments

xmlking picture xmlking  路  29Comments

internalsystemerror picture internalsystemerror  路  33Comments

markwhitfeld picture markwhitfeld  路  41Comments