piotrwitek / typesafe-actions

Typesafe utilities for "action-creators" in Redux / Flux Architecture

Home Page:https://codesandbox.io/s/github/piotrwitek/typesafe-actions/tree/master/codesandbox

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

createAsyncAction incorrect ReturnType for an array with 2 elements whose types are known

egonm12 opened this issue · comments

Description

The return type of my async actions are not as expected. When I want my payload shape to be [string, string] it somehow returns payload: string; meta: string. This is not the case when I would do [string, string, string]. In that case payload is of type [string, string, string].

How to Reproduce

import { createAsyncAction } from "typesafe-actions";

const myAsyncActions = createAsyncAction(
  "FETCH_BEGIN",
  "FETCH_SUCCESS",
  "FETCH_FAILURE",
)<[string, string], undefined, undefined>()

type MyType = ReturnType<typeof myAsyncActions.request>;

Expected behavior

MyType = {
  type: "FETCH_BEGIN";
  payload: [string, string]
}

Actual behavior

MyType = {
  type: "FETCH_BEGIN";
  payload: string;
  meta: string;
}

Suggested solution(s)

Not looked into possible solutions yet

Project Dependencies

  • Typesafe-Actions Version: ^5.1.0
  • TypeScript Version:^3.6.3
  • tsconfig.json:
{
  "compilerOptions": {
      "experimentalDecorators": true,
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "baseUrl": ".",
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "noEmit": true,
    "jsx": "preserve",
    "isolatedModules": true
  },
  "include": [
    "src",
    "node_modules/eslint-plugin-react/lib/types.d.ts"
  ]
}

It's by design to allow a way to define both payload and meta.
If you want to use a tuple as type argument please use payload + meta syntax:

const myAsyncActions = createAsyncAction(
  'FETCH_BEGIN',
  'FETCH_SUCCESS',
  'FETCH_FAILURE'
)<[[string, string], undefined], undefined, undefined>();