Question

For libraries like NGRX - Actions or NGXS - Actions when creating an action you create an interface or class like so:

bar-action.ts

export class Foo {
  static type: string = 'bar-foo';
}
// etc classes

They are simply imported in angular:

import { Foo } from './bar-actions';

All great until you want to do something a class named Reset or DefaultSettings where you can get a class name collision on actions (Rare but possible).

Each is also imported individually so if you have 20 foos (following example) the import can get long, unwieldy and is actually fairly common.

import { Foo1, Foo2, Foo3, Foo4, Foo5, Foo6, Foo7, Foo8 ... Foo20 } from './bar-actions';

this.store.dispatch(new Foo1());
/// etc
this.store.dispatch(new Foo20());

I've started to use namespaces to alleviate these possible problems and I think it's a bit easier to read (at the minor cost of verbosity).

bar-action.ts

export namespace Bar {
  export class FooX {
    static type: string = 'bar-foo';
  }
}
import { Bar } from './bar-actions';

this.store.dispatch(new Bar.Foo1());
/// etc
this.store.dispatch(new Bar.Foo20());

Am I possibly missing something here that could cause greater difficulty down the road?

Was it helpful?

Solution

NGXS docs page explicitly recommends using namespaces to group actions so I guess there're no significant problems that arise from using this approach (at least from lib authors' perspective).

Licensed under: CC-BY-SA with attribution
scroll top