Nx: Alternative way of typing actions for dataPersistence when using NGRX 8

[ramarivera]

Expected Behavior

I can type action parameters on a less verbose way using ngrx 8 action creators creators.

Current Behavior

In order to be able to type my actions, so I can use their payload on the run/onError methods, I need to do ReturnType<typeof createCategoryDefinition> where createCategoryDefinition is

import { createAction, props } from '@ngrx/store';

export const createCategoryDefinition = createAction(
  '[Category Definitions/API] create category definition',
  props<{ creationData: CategoryDefinitionCreationData }>()
);

@Effect()
  createCategoryDefinitionEffect$ = this.dataPersistence.fetch<ReturnType<typeof createCategoryDefinition>>(
    createCategoryDefinition.type,
    {
      run: action => {
        return this.categoryDefinitionService
          .createCategoryDefinition(action.creationData)
          .pipe(
            map(categoryDefinition => createCategoryDefinitionSuccess({ categoryDefinition}))
          );
      },

      onError: (action, error) => {
        return createCategoryDefinitionFailure({ error });
      },
    }
  );

Is there maybe some other way to leverage typescript to ease the typing of said actions?

Context

Latest version of NX.
Version 8.x of NGRX.

[brandonroberts]

@ramarivera I'm working an update to the ngrx schematics to support action creators https://github.com/nrwl/nx/pull/1550

[ramarivera]

Awesome!! Is there something someone (me maybe) could help you with at this point?

[yinonov]

any progress on this?

[mehrad-rafigh]

This has been release with Nx 8.3. Take a look here
https://blog.nrwl.io/updated-schematics-for-ngrx-and-improved-logging-in-nx-8-3-2b00c8ef6123

TLDR:
Run in your angular project ng g @nrwl/angular:ngrx user --syntax=creators
@brandonroberts I think we can close this issue.

[brandonroberts]

Thanks @mehrad-rafigh

[ramarivera]

I tested the new schematics, but I have to either add the ReturnType<typeof actionCreator> to the generic argument for dataPersistence.fetch or add it to the id, run and onError callbacks.

````
@Injectable()
export class ProductsEffects {
loadProducts$ = createEffect(() =>
this.dataPersistence.fetch(ProductsActions.loadProducts, {
run: (
action: ReturnType,
state: ProductsPartialState
) => {
// Your custom service 'load' logic goes here. For now just return a success action...
return ProductsActions.loadProductsSuccess({ products: [] });
},

  onError: (action: ReturnType<typeof ProductsActions.loadProducts>, error) => {
    console.error('Error', error);
    return ProductsActions.loadProductsFailure({ error });
  },
})

);
```

Isn't there a way fetch can pull the action type form the ActionCreator parameter?