The action-typed from shakyshane

Return type of `createMsg`

I was looking around to see what people do for creating types for actions and reducers and found my way to your repo. I'm not actually using Redux, just React's useReducer hook, and noticed the return type on createMsg seems loose. In your examples/ts/index.ts, for example, the type of Msg("Token", "123456") is the following:

{ type: "Token"; payload: string | undefined; } | { type: "Token"; payload?: undefined; }

If the reducer is, say, function(state: /*...*/, action: Actions /* from the example */) it won't take the produced action:

Argument of type '{ type: "Token"; payload: string | undefined; } | { type: "Token"; payload?: undefined; }' is not assignable to parameter of type '{ type: "SignedIn"; payload: { firstname: string; lastname: string; }; } | { type: "Token"; payload: string; } | { type: "SignOut"; }'.
  Type '{ type: "Token"; payload: string | undefined; }' is not assignable to type '{ type: "SignedIn"; payload: { firstname: string; lastname: string; }; } | { type: "Token"; payload: string; } | { type: "SignOut"; }'.
    Type '{ type: "Token"; payload: string | undefined; }' is not assignable to type '{ type: "Token"; payload: string; }'.
      Types of property 'payload' are incompatible.
        Type 'string | undefined' is not assignable to type 'string'.
          Type 'undefined' is not assignable to type 'string'.

After much fumbling around, I did come up up with this (renamed parameters just for my personal understanding during fumble-time), though I don't know if it works for all use cases:

export function createMsg<ActionDef extends {[index: string]: any}>() {
	function create<Name extends keyof ActionDef>(type: Name, ...args: ActionDef[Name] extends undefined ? [] : [never]): {type: Name}
	function create<Name extends keyof ActionDef>(type: Name, payload: ActionDef[Name]): {type: Name, payload: ActionDef[Name]};
	function create<Name extends keyof ActionDef>(type: Name, payload?: ActionDef[Name]) {
		if (payload) return {type, payload};
		else return {type};
	}
	return create;
}

I was wondering if you had any suggestions for a better solution?

shakyshane / action-typed Goto Github PK

action-typed's People

Contributors

Stargazers

Watchers

action-typed's Issues

Return type of `createMsg`

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent