WIP - Complex Typings - #90

FWIW I see the value in this PR. Do you think it's possible to make this approach work? Right now manually specifying props outside VS inside connect() is cumbersome.

@timpur

timpur commented Sep 21, 2018

Copy link

Copy Markdown

Author

@developit , ive been using it and its been really handy !!

I think i just need a expert at complex typings or i do allot more learning my self :P.

Over the last month ive learn allot more TS stuff and i might redo this PR and hopefully out of that, i get a more polished solution.

@chrstntdd

chrstntdd commented Sep 25, 2018

Copy link

Copy Markdown

It looks like you're way ahead of the use case I'm looking to support right now. I'm trying to fully type all actions in unistore and I'm stuck at how to type the factory function for actions and get that same type information in the component using a single Actions type.

It looks like your Action and BoundAction types are somewhat related to this use case, no?

// home.tsx
import React from 'react';
import { connect } from 'unistore'
import { actions, Actions } from '@/state'
type Props = {} & Actions // <---
type State = {}
class Home extends React.Component<Props, State> {
 componentDidMount() {
 this.props.fetchResource({ key: 'value' }); // <-- TS complains since I'm "missing" the first arg
 }
 render() {
 return <div>Home</div>;
 }
}
export default connect('', actions)(Home);

// @/state.ts
import createStore, { Store } from 'unistore';
import otherActions, { OtherActionType } from '../../';
type RootState = {
 readonly email: string;
 readonly username: string;
};
const initialState: RootState = {
 email: '',
 username: ''
};
type GlobalStore = Store<RootState>;
type Actions = OtherActionType & { signUp: (state: RootState, { key: string }) => void }
export const actions = (store: GlobalStore): Actions => ({
 async fetchResource(_, { key }) => {
 // ...
 },
 ...otherActions(store)
})

Navigation Menu

WIP - Complex Typings - #90