props doesn't accept HttpErrorResponse

[dev054]

Minimal reproduction of the bug/regression with instructions:

I want to pass the HttpError through an action and so I do the following:

export const someFail = createAction(
  '[Feature] Some fail',
  props<HttpErrorResponse>(),
);

... however it doesn't compile:

Expected behavior:

props accept HttpErrorResponse.

Versions of NgRx, Angular, Node, affected browser(s) and operating system(s):

Ngrx 10, Angular 11.

Other information:

I would be willing to submit a PR to fix this issue

[x] Yes (Assistance is provided if you need help submitting a pull request)
[ ] No

[markostanimirovic]

@dev054
HttpErrorResponse extends HttpResponseBase:

export abstract class HttpResponseBase {
    /**
     * Type of the response, narrowed to either the full response or the header.
     */
    readonly type: HttpEventType.Response | HttpEventType.ResponseHeader;
}

However, HttpResponseBase contains the type property, which is not allowed.

Try this:

const a = createAction('a', props<{ error: HttpErrorResponse }>());

[alex-okrushko]

Thanks @markostanimirovic 👍

I wonder if we could make it clearer in the docs, e.g. don't do this (code example) and do with a prop name instead (code example).

[timdeschryver]

Fyi, I'm going to steal this and going to create a lint rule for this add eslint-plugin-ngrx.

[timdeschryver]

@dev054 do you think it would be more clear if we would change the error message?
If so, do you have a proposition?

[david-shortman]

Does this succinctly describe the problem?

interface with "type" property not allowed because it conflicts with the action's type

The docsite could also note the list of illegal generic arguments for props/ the type of the creator function argument.

[timdeschryver]

@david-shortman you can add a note to the docs if you still want to do that.

[david-shortman]

I think the other problem is that the error shows up in a list of messages about overloads.
Since props is meant specifically to be used with createAction, I think it would be helpful to move the NotAllowedCheck to the props interface.