Merge pull request #26 from upstateinteractive/feat/ngrx

feat/ngrx

Author: manfredsteyer

libs/ddd/src/schematics/domain/index.ts

@@ -1,27 +1,41 @@
-import { 
-  chain, 
-  externalSchematic, 
-  Rule, 
-  apply, 
-  url, 
-  template, 
-  move, 
+import {
+  chain,
+  externalSchematic,
+  Rule,
+  apply,
+  url,
+  template,
+  move,
   mergeWith,
   noop,
 } from '@angular-devkit/schematics';
 
 import { strings } from '@angular-devkit/core';
 import { DomainOptions } from './schema';
-import { addDomainToLintingRules } from '../utils/update-linting-rules';
+import {
+  addDomainToLintingRules,
+  addNgrxImportsToApp,
+  addNgRxToPackageJson,
+} from '../rules';
 
-export default function(options: DomainOptions): Rule {
+export default function (options: DomainOptions): Rule {
   const libFolder = strings.dasherize(options.name);
 
   const templateSource = apply(url('./files'), [
     template({}),
-    move(`libs/${libFolder}/domain/src/lib`)
+    move(`libs/${libFolder}/domain/src/lib`),
   ]);
 
+  const appFolderName = strings.dasherize(options.name);
+  const appPath = `apps/${appFolderName}/src/app`;
+  const appModulePath = `${appPath}/app.module.ts`;
+
+  if (options.ngrx && !options.addApp) {
+    throw new Error(
+      `The 'ngrx' option may only be used when the 'addApp' option is used.`
+    )
+  }
+
   return chain([
     externalSchematic('@nrwl/angular', 'lib', {
       name: 'domain',
@@ -34,12 +48,25 @@ export default function(options: DomainOptions): Rule {
     }),
     addDomainToLintingRules(options.name),
     mergeWith(templateSource),
-    (!options.addApp) ? 
-      noop() : 
-      externalSchematic('@nrwl/angular', 'app', {
-        name: options.name,
-        tags: `domain:${options.name},type:app`,
-        style: 'scss',
-      }),
+    !options.addApp
+      ? noop()
+      : externalSchematic('@nrwl/angular', 'app', {
+          name: options.name,
+          tags: `domain:${options.name},type:app`,
+          style: 'scss',
+        }),
+    options.addApp && options.ngrx
+      ? chain([
+          externalSchematic('@ngrx/schematics', 'store', {
+            project: options.name,
+            root: true,
+            minimal: true,
+            module: 'app.module.ts',
+            name: 'state',
+          }),
+          addNgrxImportsToApp(appModulePath),
+          addNgRxToPackageJson(),
+        ])
+      : noop(),
   ]);
 }

libs/ddd/src/schematics/domain/schema.json

@@ -18,15 +18,23 @@
       "x-prompt": "Would you like to add an associated application?",
       "default": false
     },
+    "ngrx": {
+      "type": "boolean",
+      "default": false,
+      "description": "Add ngrx for the associated app (addApp required)",
+      "x-prompt": "Would you like to add NgRx to your associated application?"
+    },
     "type": {
       "type": "string",
-      "enum": [
-        "internal",
-        "buildable",
-        "publishable"
-      ],
+      "enum": ["internal", "buildable", "publishable"],
       "description": "A type to determine if and how to build the library.",
       "default": "buildable"
+    },
+    "ngrx": {
+      "type": "boolean",
+      "default": false,
+      "description": "Add ngrx for the domain",
+      "x-prompt": "Would you like to add NgRx to your domain?"
     }
   },
   "required": ["name"]

libs/ddd/src/schematics/domain/schema.ts

@@ -14,6 +14,10 @@ export interface DomainOptions {
    * Add an app for the domain?
    */
   addApp?: boolean;
+  /**
+   * Add ngrx for the associated app (addApp required)
+   */
+  ngrx?: boolean;
   /**
    * A type to determine if and how to build the library.
    */

libs/ddd/src/schematics/feature/files/forDomainWithNgrx/+state/__entity@dasherize__/__entity@dasherize__.actions.ts

@@ -0,0 +1,16 @@
+import { createAction, props } from '@ngrx/store';
+import { <%= classify(entity) %> } from '../../entities/<%= dasherize(entity) %>';
+
+export const load<%= classify(entity) %> = createAction(
+  '[<%= classify(entity) %>] Load <%= classify(entity) %>'
+);
+
+export const load<%= classify(entity) %>Success = createAction(
+  '[<%= classify(entity) %>] Load <%= classify(entity) %> Success',
+  props<{ <%= camelize(entity) %>: <%= classify(entity) %>[] }>()
+);
+
+export const load<%= classify(entity) %>Failure = createAction(
+  '[<%= classify(entity) %>] Load <%= classify(entity) %> Failure',
+  props<{ error: any }>()
+);

libs/ddd/src/schematics/feature/files/forDomainWithNgrx/+state/__entity@dasherize__/__entity@dasherize__.effects.ts

@@ -0,0 +1,30 @@
+import { Injectable } from '@angular/core';
+import { createEffect, Actions, ofType } from '@ngrx/effects';
+import { catchError, map, switchMap } from 'rxjs/operators';
+import { of } from 'rxjs';
+import * as <%= classify(entity) %>Actions from './<%= dasherize(entity) %>.actions';
+import { <%= classify(entity) %>DataService } from '../../infrastructure/<%= dasherize(entity) %>.data.service';
+
+@Injectable()
+export class <%= classify(entity) %>Effects {
+  load<%= classify(entity) %>$ = createEffect(() =>
+    this.actions$.pipe(
+      ofType(<%= classify(entity) %>Actions.load<%= classify(entity) %>),
+      switchMap((action) =>
+        this.<%=camelize(entity)%>DataService.load().pipe(
+          map((<%= camelize(entity) %>) =>
+            <%= classify(entity) %>Actions.load<%= classify(entity) %>Success({ <%= camelize(entity) %> })
+          ),
+          catchError((error) =>
+            of(<%= classify(entity) %>Actions.load<%= classify(entity) %>Failure({ error }))
+          )
+        )
+      )
+    )
+  );
+
+ constructor(
+   private actions$: Actions,
+   private <%=camelize(entity)%>DataService: <%= classify(entity) %>DataService
+  ) { }
+}

libs/ddd/src/schematics/feature/files/forDomainWithNgrx/+state/__entity@dasherize__/__entity@dasherize__.reducer.ts

@@ -0,0 +1,41 @@
+import { createReducer, on, Action } from '@ngrx/store';
+import { EntityState, EntityAdapter, createEntityAdapter } from '@ngrx/entity';
+
+import * as <%= classify(entity) %>Actions from './<%= dasherize(entity) %>.actions';
+import { <%= classify(entity) %> } from '../../entities/<%= dasherize(entity) %>';
+
+export const <%= classify(entity).toUpperCase() %>_FEATURE_KEY = '<%= camelize(entity) %>';
+
+export interface State extends EntityState<<%= classify(entity) %>> {
+  selectedId ?: string | number;          // which <%= classify(entity) %> record has been selected
+  loaded      : boolean;                  // has the <%= classify(entity) %> list been loaded
+  error      ?: string | null;            // last known error (if any)
+}
+
+export interface <%= classify(entity) %>PartialState {
+  readonly [<%= classify(entity).toUpperCase() %>_FEATURE_KEY]: State;
+}
+
+export const <%= camelize(entity) %>Adapter: EntityAdapter<<%= classify(entity) %>> = createEntityAdapter<<%= classify(entity) %>>();
+
+export const initialState: State = <%= camelize(entity) %>Adapter.getInitialState({
+  // set initial required properties
+  loaded : false
+});
+
+const <%= camelize(entity) %>Reducer = createReducer(
+  initialState,
+  on(<%= classify(entity) %>Actions.load<%= classify(entity) %>,
+    state => ({ ...state, loaded: false, error: null })
+  ),
+  on(<%= classify(entity) %>Actions.load<%= classify(entity) %>Success,
+    (state, { <%= camelize(entity) %> }) => <%= camelize(entity) %>Adapter.upsertMany(<%= camelize(entity) %>, { ...state, loaded: true })
+  ),
+  on(<%= classify(entity) %>Actions.load<%= classify(entity) %>Failure,
+    (state, { error }) => ({ ...state, error })
+  ),
+);
+
+export function reducer(state: State | undefined, action: Action) {
+  return <%= camelize(entity) %>Reducer(state, action);
+}

libs/ddd/src/schematics/feature/files/forDomainWithNgrx/+state/__entity@dasherize__/__entity@dasherize__.selectors.ts

@@ -0,0 +1,38 @@
+import { createFeatureSelector, createSelector } from '@ngrx/store';
+import { <%= classify(entity).toUpperCase() %>_FEATURE_KEY, State, <%= classify(entity) %>PartialState, <%= camelize(entity) %>Adapter } from './<%= dasherize(entity) %>.reducer';
+
+// Lookup the '<%= classify(entity) %>' feature state managed by NgRx
+export const get<%= classify(entity) %>State = createFeatureSelector<<%= classify(entity) %>PartialState, State>(<%= camelize(entity).toUpperCase() %>_FEATURE_KEY);
+
+const { selectAll, selectEntities } = <%= camelize(entity) %>Adapter.getSelectors();
+
+export const get<%= classify(entity) %>Loaded = createSelector(
+  get<%= classify(entity) %>State,
+  (state: State) => state.loaded
+);
+
+export const get<%= classify(entity) %>Error = createSelector(
+  get<%= classify(entity) %>State,
+  (state: State) => state.error
+);
+
+export const getAll<%= classify(entity) %> = createSelector(
+  get<%= classify(entity) %>State,
+  (state: State) => selectAll(state)
+);
+
+export const get<%= classify(entity) %>Entities = createSelector(
+  get<%= classify(entity) %>State,
+  (state: State) => selectEntities(state)
+);
+
+export const getSelectedId = createSelector(
+  get<%= classify(entity) %>State,
+  (state: State) => state.selectedId
+);
+
+export const getSelected = createSelector(
+  get<%= classify(entity) %>Entities,
+  getSelectedId,
+  (entities, selectedId) => selectedId && entities[selectedId]
+);

libs/ddd/src/schematics/feature/files/forDomainWithNgrx/application/__name@dasherize__.facade.ts

@@ -0,0 +1,19 @@
+import { Injectable } from '@angular/core';
+
+import { select, Store, Action } from '@ngrx/store';
+
+import * as from<%= classify(entity) %> from '../+state/<%= dasherize(entity) %>/<%= dasherize(entity) %>.reducer';
+import * as <%= classify(entity) %>Selectors from '../+state/<%= dasherize(entity) %>/<%= dasherize(entity) %>.selectors';
+
+@Injectable({ providedIn: 'root' })
+export class <%= classify(name) %>Facade {
+  loaded$ = this.store.pipe(select(<%= classify(entity) %>Selectors.get<%= classify(entity) %>Loaded));
+  <%= camelize(entity) %>List$ = this.store.pipe(select(<%= classify(entity) %>Selectors.getAll<%= classify(entity) %>));
+  selected<%= classify(entity) %>$ = this.store.pipe(select(<%= classify(entity) %>Selectors.getSelected));
+
+  constructor(private store: Store<from<%= classify(entity) %>.<%= classify(entity) %>PartialState>) { }
+
+  dispatch(action: Action) {
+    this.store.dispatch(action);
+  }
+}

libs/ddd/src/schematics/feature/files/forDomainWithNgrx/entities/__entity@dasherize__.ts

@@ -0,0 +1,5 @@
+export interface <%=classify(entity)%> {
+    id: number;
+    name: string;
+    description: string;
+}

libs/ddd/src/schematics/feature/files/forDomainWithNgrx/infrastructure/__entity@dasherize__.data.service.ts

@@ -0,0 +1,28 @@
+import {Injectable} from '@angular/core';
+import {HttpClient, HttpHeaders, HttpParams} from '@angular/common/http';
+import {Observable, of} from 'rxjs';
+import {<%=classify(entity)%>} from '../entities/<%=dasherize(entity)%>';
+
+@Injectable({ providedIn: 'root' })
+export class <%=classify(entity)%>DataService {
+
+    constructor(private http: HttpClient) {
+    }
+
+    load(): Observable<<%=classify(entity)%>[]> {
+
+        // Uncomment if needed
+        /*
+        const url = '...';
+        const params = new HttpParams().set('param', 'value');
+        const headers = new HttpHeaders().set('Accept', 'application/json');
+        return this.http.get<<%=classify(entity)%>[]>(url, {params, headers});
+        */
+        
+        return of([
+            {id: 1, name: 'Lorem ipsum', description: 'Lorem ipsum dolor sit amet'},
+            {id: 2, name: 'At vero eos', description: 'At vero eos et accusam et justo duo dolores'},
+            {id: 3, name: 'Duis autem', description: 'Duis autem vel eum iriure dolor in hendrerit'},
+        ]);
+      }
+}