piotrwitek / typesafe-actions

Typesafe utilities for "action-creators" in Redux / Flux Architecture
https://codesandbox.io/s/github/piotrwitek/typesafe-actions/tree/master/codesandbox
MIT License
2.41k stars 99 forks source link

Type error with rxjs and connected-react-router #228

Open sneljo1 opened 4 years ago

sneljo1 commented 4 years ago

Description

I am encountering several Type errors when use router actions from connected-react-router. Someone else already made an issue over at connected-react-router. But I believe it to be an issue with the ActionType, since this is being used to type the epics. It still works but it throws an error.

This is the full output from Typescript, it's always pretty similar.

  Overload 1 of 20, '(...args: (SchedulerLike | CallHistoryMethodAction<[string, PoorMansUnknown?]>)[]): Observable<CallHistoryMethodAction<[string, PoorMansUnknown?]>>', gave the following error.
    Argument of type 'PayloadAction<PlaylistActionTypes.SEARCH, { query?: string | null | undefined; tag?: string | undefined; refresh: boolean; } & PlaylistIdentifier>' is not assignable to parameter of type 'SchedulerLike | CallHistoryMethodAction<[string, PoorMansUnknown?]>'.
      Type 'PayloadAction<PlaylistActionTypes.SEARCH, { query?: string | null | undefined; tag?: string | undefined; refresh: boolean; } & PlaylistIdentifier>' is not assignable to type 'CallHistoryMethodAction<[string, PoorMansUnknown?]>'.
        Types of property 'type' are incompatible.
          Type 'PlaylistActionTypes.SEARCH' is not assignable to type '"@@router/CALL_HISTORY_METHOD"'.
  Overload 2 of 20, '(...args: CallHistoryMethodAction<[string, PoorMansUnknown?]>[]): Observable<CallHistoryMethodAction<[string, PoorMansUnknown?]>>', gave the following error.
    Argument of type 'PayloadAction<PlaylistActionTypes.SEARCH, { query?: string | null | undefined; tag?: string | undefined; refresh: boolean; } & PlaylistIdentifier>' is not assignable to parameter of type 'CallHistoryMethodAction<[string, PoorMansUnknown?]>'.ts(2769)

Mandatory info

How to Reproduce

CodeSandbox Link

https://codesandbox.io/s/react-redux-typescript-realworld-app-4c0fj

Please check the loadDataOnAppStart.

Expected behavior

Adding routeractions in Epics should not throw any errors.

Suggested solution(s)

Project Dependencies

These are my dependencies, not the one in the sandbox. But it has similar behavior.

tsconfig.json

```ts { "compilerOptions": { "target": "es5", "module": "commonjs", "lib": [ "dom", "es2015", "es2016", "es2017" ], "allowJs": true, "experimentalDecorators": true, "removeComments": true, "preserveConstEnums": true, "esModuleInterop": true, "noImplicitAny": true, "noImplicitReturns": true, "suppressImplicitAnyIndexErrors": true, "strictPropertyInitialization": false, "strictNullChecks": true, "noImplicitThis": true, "importHelpers": true, "noEmitHelpers": true, "moduleResolution": "node", "pretty": true, "strict": false, "jsx": "react", "typeRoots": [ "./types", "node_modules/@types" ], "sourceRoot": "/", "baseUrl": ".", "paths": { "@common/*": [ "src/common/*" ], "@main/*": [ "src/main/*" ], "@renderer/*": [ "src/renderer/*" ], "@assets/*": [ "src/assets/*" ], "@types": [ "src/types/index" ] }, // prod "sourceMap": true }, "include": [ "src" ], "exclude": [ "node_modules", "dist", "./types", "**/*.babel.js" ], "formatCodeOptions": { "indentSize": 4, "tabSize": 4 } } ```

Environment (optional)