feat(schematics): Use createActionGroup in schematics (#3791)

ngrx · Apr 21, 2023 · f6ce20f · f6ce20f
1 parent cdaeeb6
commit f6ce20f
Show file tree

Hide file tree

Showing 10 changed files with 59 additions and 90 deletions.
diff --git a/...matics/src/action/files/__name@dasherize@if-flat__/__name@dasherize__.actions.ts.template b/...matics/src/action/files/__name@dasherize@if-flat__/__name@dasherize__.actions.ts.template
@@ -1,15 +1,10 @@
-import { createAction, props } from '@ngrx/store';
+import { createActionGroup, emptyProps, props } from '@ngrx/store';
 
-export const <%= prefix %><%= classify(name) %>s = createAction(
-  '[<%= classify(name) %>] <%= classify(prefix) %> <%= classify(name) %>s'
-);
-
-<% if (api) { %>export const <%= prefix %><%= classify(name) %>sSuccess = createAction(
-  '[<%= classify(name) %>] <%= classify(prefix) %> <%= classify(name) %>s Success',
-  props<{ data: unknown }>()
-);<% } %>
-
-<% if (api) { %>export const <%= prefix %><%= classify(name) %>sFailure = createAction(
-  '[<%= classify(name) %>] <%= classify(prefix) %> <%= classify(name) %>s Failure',
-  props<{ error: unknown }>()
-);<% } %>
+export const <%= classify(name) %>Actions = createActionGroup({
+  source: '<%= classify(name) %>',
+  events: {
+    '<%= classify(prefix) %> <%= classify(name) %>s': emptyProps(),
+    <% if (api) { %>'<%= classify(prefix) %> <%= classify(name) %>s Success': props<{ data: unknown }>(),<% } %>
+    <% if (api) { %>'<%= classify(prefix) %> <%= classify(name) %>s Failure': props<{ error: unknown }>(),<% } %>
+  }
+});
diff --git a/modules/schematics/src/action/index.spec.ts b/modules/schematics/src/action/index.spec.ts
@@ -82,8 +82,11 @@ describe('Action Schematic', () => {
       `${projectPath}/src/app/foo.actions.ts`
     );
 
-    expect(fileContent).toMatch(/export const loadFoos = createAction\(/);
-    expect(fileContent).toMatch(/\[Foo\] Load Foos'/);
+    expect(fileContent).toMatch(
+      /export const FooActions = createActionGroup\(/
+    );
+    expect(fileContent).toMatch(new RegExp(`source: 'Foo'`));
+    expect(fileContent).toMatch(/Load Foos'/);
   });
 
   it('should create success/error actions when the api flag is set', async () => {
@@ -97,10 +100,13 @@ describe('Action Schematic', () => {
       `${projectPath}/src/app/foo.actions.ts`
     );
 
-    expect(fileContent).toMatch(/export const loadFoos = createAction\(/);
-    expect(fileContent).toMatch(/\[Foo\] Load Foos Success/);
+    expect(fileContent).toMatch(
+      /export const FooActions = createActionGroup\(/
+    );
+    expect(fileContent).toMatch(new RegExp(`source: 'Foo'`));
+    expect(fileContent).toMatch(/Load Foos Success/);
     expect(fileContent).toMatch(/props<{ data: unknown }>\(\)/);
-    expect(fileContent).toMatch(/\[Foo\] Load Foos Failure/);
+    expect(fileContent).toMatch(/Load Foos Failure/);
     expect(fileContent).toMatch(/props<{ error: unknown }>\(\)/);
   });
 
@@ -121,10 +127,11 @@ describe('Action Schematic', () => {
         `${projectPath}/src/app/foo.actions.ts`
       );
       expect(fileContent).toMatch(
-        new RegExp(`export const ${prefix}Foos = createAction`)
+        new RegExp(`export const FooActions = createActionGroup`)
       );
+      expect(fileContent).toMatch(new RegExp(`source: 'Foo'`));
       expect(fileContent).toMatch(
-        new RegExp(`'\\[Foo] ${capitalize(prefix)} Foos'`)
+        new RegExp(`'${capitalize(prefix)} Foos': emptyProps\\(\\),`)
       );
     }
   );
@@ -158,7 +165,7 @@ describe('Action Schematic', () => {
       );
 
       expect(fileContent).toMatch(
-        /export const loadFoosSuccess = createAction\(\r?\n?\s*'\[Foo\] Load Foos Success'\r?\n?\s*,/
+        /'Load Foos Success': props<\{ data: unknown }>\(\),/
       );
     });
 
@@ -176,7 +183,7 @@ describe('Action Schematic', () => {
       );
 
       expect(fileContent).toMatch(
-        /export const loadFoosFailure = createAction\(\r?\n?\s*'\[Foo\] Load Foos Failure'\r?\n?\s*,/
+        /'Load Foos Failure': props<\{ error: unknown }>\(\),/
       );
     });
   });

diff --git a/...matics/src/effect/files/__name@dasherize@if-flat__/__name@dasherize__.effects.ts.template b/...matics/src/effect/files/__name@dasherize@if-flat__/__name@dasherize__.effects.ts.template
@@ -2,10 +2,10 @@ import { Injectable } from '@angular/core';
 import { Actions, <%= effectMethod %><% if (feature) { %>, ofType<% } %> } from '@ngrx/effects';
 <% if (feature && api) { %>import { catchError, map, concatMap } from 'rxjs/operators';
 import { Observable, EMPTY, of } from 'rxjs';
-import * as <%= classify(name) %>Actions from '<%= featurePath(group, flat, "actions", dasherize(name)) %><%= dasherize(name) %>.actions';<% } %>
+import { <%= classify(name) %>Actions } from '<%= featurePath(group, flat, "actions", dasherize(name)) %><%= dasherize(name) %>.actions';<% } %>
 <% if (feature && !api) { %>import { concatMap } from 'rxjs/operators';
 import { Observable, EMPTY } from 'rxjs';
-import * as <%= classify(name) %>Actions from '<%= featurePath(group, flat, "actions", dasherize(name)) %><%= dasherize(name) %>.actions';<% } %>
+import { <%= classify(name) %>Actions } from '<%= featurePath(group, flat, "actions", dasherize(name)) %><%= dasherize(name) %>.actions';<% } %>
 
 @Injectable()
 export class <%= classify(name) %>Effects {

diff --git a/modules/schematics/src/effect/index.spec.ts b/modules/schematics/src/effect/index.spec.ts
@@ -279,7 +279,7 @@ describe('Effect Schematic', () => {
 
       import { concatMap } from 'rxjs/operators';
       import { Observable, EMPTY } from 'rxjs';
-      import * as FooActions from '../../actions/foo/foo.actions';
+      import { FooActions } from '../../actions/foo/foo.actions';
 
       @Injectable()
       export class FooEffects {
@@ -313,7 +313,7 @@ describe('Effect Schematic', () => {
 
       import { concatMap } from 'rxjs/operators';
       import { Observable, EMPTY } from 'rxjs';
-      import * as FooActions from './foo.actions';
+      import { FooActions } from './foo.actions';
 
       @Injectable()
       export class FooEffects {
@@ -370,7 +370,7 @@ describe('Effect Schematic', () => {
       import { Actions, createEffect, ofType } from '@ngrx/effects';
       import { catchError, map, concatMap } from 'rxjs/operators';
       import { Observable, EMPTY, of } from 'rxjs';
-      import * as FooActions from './foo.actions';
+      import { FooActions } from './foo.actions';
 
 
       @Injectable()
@@ -409,7 +409,7 @@ describe('Effect Schematic', () => {
 
       import { concatMap } from 'rxjs/operators';
       import { Observable, EMPTY } from 'rxjs';
-      import * as FooActions from './foo.actions';
+      import { FooActions } from './foo.actions';
 
       @Injectable()
       export class FooEffects {
@@ -447,7 +447,7 @@ describe('Effect Schematic', () => {
       import { Actions, createEffect, ofType } from '@ngrx/effects';
       import { catchError, map, concatMap } from 'rxjs/operators';
       import { Observable, EMPTY, of } from 'rxjs';
-      import * as FooActions from './foo.actions';
+      import { FooActions } from './foo.actions';
 
 
       @Injectable()
@@ -470,7 +470,7 @@ describe('Effect Schematic', () => {
         constructor(private actions$: Actions) {}
       }
       "
-    `);
+`);
   });
 
   it('should inject the effect service correctly', async () => {
@@ -501,7 +501,7 @@ describe('Effect Schematic', () => {
       import { Actions, createEffect, ofType } from '@ngrx/effects';
       import { catchError, map, concatMap } from 'rxjs/operators';
       import { Observable, EMPTY, of } from 'rxjs';
-      import * as FooActions from './foo.actions';
+      import { FooActions } from './foo.actions';
 
 
       @Injectable()

diff --git a/...ity/files/__name@dasherize@if-flat__/__name@dasherize@group-actions__.actions.ts.template b/...ity/files/__name@dasherize@if-flat__/__name@dasherize@group-actions__.actions.ts.template
@@ -1,53 +1,20 @@
-import { createAction, props } from '@ngrx/store';
+import { createActionGroup, emptyProps, props } from '@ngrx/store';
 import { Update } from '@ngrx/entity';
 
 import { <%= classify(name) %> } from '<%= featurePath(group, flat, "models", dasherize(name)) %><%= dasherize(name) %>.model';
 
-export const load<%= classify(name) %>s = createAction(
-  '[<%= classify(name) %>/API] Load <%= classify(name) %>s', 
-  props<{ <%= camelize(name) %>s: <%= classify(name) %>[] }>()
-);
-
-export const add<%= classify(name) %> = createAction(
-  '[<%= classify(name) %>/API] Add <%= classify(name) %>',
-  props<{ <%= camelize(name) %>: <%= classify(name) %> }>()
-);
-
-export const upsert<%= classify(name) %> = createAction(
-  '[<%= classify(name) %>/API] Upsert <%= classify(name) %>',
-  props<{ <%= camelize(name) %>: <%= classify(name) %> }>()
-);
-
-export const add<%= classify(name) %>s = createAction(
-  '[<%= classify(name) %>/API] Add <%= classify(name) %>s',
-  props<{ <%= camelize(name) %>s: <%= classify(name) %>[] }>()
-);
-
-export const upsert<%= classify(name) %>s = createAction(
-  '[<%= classify(name) %>/API] Upsert <%= classify(name) %>s',
-  props<{ <%= camelize(name) %>s: <%= classify(name) %>[] }>()
-);
-
-export const update<%= classify(name) %> = createAction(
-  '[<%= classify(name) %>/API] Update <%= classify(name) %>',
-  props<{ <%= camelize(name) %>: Update<<%= classify(name) %>> }>()
-);
-
-export const update<%= classify(name) %>s = createAction(
-  '[<%= classify(name) %>/API] Update <%= classify(name) %>s',
-  props<{ <%= camelize(name) %>s: Update<<%= classify(name) %>>[] }>()
-);
-
-export const delete<%= classify(name) %> = createAction(
-  '[<%= classify(name) %>/API] Delete <%= classify(name) %>',
-  props<{ id: string }>()
-);
-
-export const delete<%= classify(name) %>s = createAction(
-  '[<%= classify(name) %>/API] Delete <%= classify(name) %>s',
-  props<{ ids: string[] }>()
-);
-
-export const clear<%= classify(name) %>s = createAction(
-  '[<%= classify(name) %>/API] Clear <%= classify(name) %>s'
-);
+export const <%= classify(name) %>Actions = createActionGroup({
+  source: '<%= classify(name) %>/API',
+  events: {
+    'Load <%= classify(name) %>s': props<{ <%= camelize(name) %>s: <%= classify(name) %>[] }>(),
+    'Add <%= classify(name) %>': props<{ <%= camelize(name) %>: <%= classify(name) %> }>(),
+    'Upsert <%= classify(name) %>': props<{ <%= camelize(name) %>: <%= classify(name) %> }>(),
+    'Add <%= classify(name) %>s': props<{ <%= camelize(name) %>: <%= classify(name) %>[] }>(),
+    'Upsert <%= classify(name) %>s': props<{ <%= camelize(name) %>: <%= classify(name) %>[] }>(),
+    'Update <%= classify(name) %>': props<{ <%= camelize(name) %>: Update<<%= classify(name) %>> }>(),
+    'Update <%= classify(name) %>s': props<{ <%= camelize(name) %>s: Update<<%= classify(name) %>>[] }>(),
+    'Delete <%= classify(name) %>': props<{ id: string }>(),
+    'Delete <%= classify(name) %>s': props<{ ids: string[] }>(),
+    'Clear <%= classify(name) %>s': emptyProps(),
+  }
+});
diff --git a/...ty/files/__name@dasherize@if-flat__/__name@dasherize@group-reducers__.reducer.ts.template b/...ty/files/__name@dasherize@if-flat__/__name@dasherize@group-reducers__.reducer.ts.template
@@ -1,7 +1,7 @@
 import { createFeature, createReducer, on } from '@ngrx/store';
 import { EntityState, EntityAdapter, createEntityAdapter } from '@ngrx/entity';
 import { <%= classify(name) %> } from '<%= featurePath(group, flat, "models", dasherize(name)) %><%= dasherize(name) %>.model';
-import * as <%= classify(name) %>Actions from '<%= featurePath(group, flat, "actions", dasherize(name)) %><%= dasherize(name) %>.actions';
+import { <%= classify(name) %>Actions } from '<%= featurePath(group, flat, "actions", dasherize(name)) %><%= dasherize(name) %>.actions';
 
 export const <%= pluralize(name) %>FeatureKey = '<%= pluralize(name) %>';
 

diff --git a/modules/schematics/src/entity/index.spec.ts b/modules/schematics/src/entity/index.spec.ts
@@ -215,8 +215,10 @@ describe('Entity Schematic', () => {
     const fileContent = tree.readContent(
       `${projectPath}/src/app/foo.actions.ts`
     );
-    expect(fileContent).toMatch(/export const loadFoos = createAction\(/);
-    expect(fileContent).toMatch(/\[Foo\/API\] Load Foos'/);
+    expect(fileContent).toMatch(
+      /export const FooActions = createActionGroup\(/
+    );
+    expect(fileContent).toMatch(/'Load Foos'/);
     expect(fileContent).toMatch(/props<\{ foos: Foo\[\] }>\(\)/);
   });
 
@@ -230,7 +232,7 @@ describe('Entity Schematic', () => {
       `${projectPath}/src/app/foo.reducer.ts`
     );
     expect(fileContent).toMatch(
-      /import \* as FooActions from '\.\/foo.actions';/
+      /import { FooActions } from '\.\/foo.actions';/
     );
     expect(fileContent).toMatch(/on\(FooActions.addFoo,/);
     expect(fileContent).toMatch(

diff --git a/modules/schematics/src/feature/index.spec.ts b/modules/schematics/src/feature/index.spec.ts
@@ -225,9 +225,7 @@ describe('Feature Schematic', () => {
     expect(fileContent).toMatch(
       /import { Observable, EMPTY, of } from 'rxjs';/
     );
-    expect(fileContent).toMatch(
-      /import \* as FooActions from '.\/foo.actions';/
-    );
+    expect(fileContent).toMatch(/import { FooActions } from '.\/foo.actions';/);
 
     expect(fileContent).toMatch(/export class FooEffects/);
     expect(fileContent).toMatch(/loadFoos\$ = createEffect\(\(\) => {/);

diff --git a/...atics/src/reducer/files/__name@dasherize@if-flat__/__name@dasherize__.reducer.ts.template b/...atics/src/reducer/files/__name@dasherize@if-flat__/__name@dasherize__.reducer.ts.template
@@ -1,5 +1,5 @@
 import {<% if(feature) { %> createFeature,<% } %> createReducer, on } from '@ngrx/store';
-import * as <%= classify(name) %>Actions from '<%= featurePath(group, flat, "actions", dasherize(name)) %><%= dasherize(name) %>.actions';
+import { <%= classify(name) %>Actions } from '<%= featurePath(group, flat, "actions", dasherize(name)) %><%= dasherize(name) %>.actions';
 
 export const <%= camelize(name) %>FeatureKey = '<%= camelize(name) %>';
 

diff --git a/modules/schematics/src/reducer/index.spec.ts b/modules/schematics/src/reducer/index.spec.ts
@@ -245,7 +245,7 @@ describe('Reducer Schematic', () => {
     );
 
     expect(content).toMatch(
-      /import \* as FooActions from '..\/..\/actions\/foo\/foo.actions';/
+      /import { FooActions } from '..\/..\/actions\/foo\/foo.actions';/
     );
   });
-Original file line number
+Diff line change
@@ Expand Up / @@ -245,7 +245,7 @@ describe('Reducer Schematic', () => { @@
         );
         expect(content).toMatch(
-          /import \* as FooActions from '..\/..\/actions\/foo\/foo.actions';/
+          /import { FooActions } from '..\/..\/actions\/foo\/foo.actions';/
         );
       });
@@ Expand Down @@