Now FSA compliant

npm install --save redux-ts

Store Builder

import { StoreBuilder } from 'redux-ts'const store = new StoreBuilder<StoreState>()                        .withInitialState({test:true})                        .withReducer("reducer", reducer)                        .withDevTools() // enable chrome devtools                        .build();}

Actions

import { createAction } from 'redux-ts'interface LoginPayload {  username: string  password: string}interface SetTokenPayload {  token?: string}export const Login = createAction<LoginPayload>('Login')export const Logout = createAction('Logout')export const SetToken = createAction<SetTokenPayload>('SetToken')

Reducers

import { ReducerBuilder } from 'redux-ts'import { Login, Logout, SetToken } from '../actions'import { push } from 'react-router-redux'const tokenKey = 'auth'export interface AuthState {  token?: string}export const authReducer = new ReducerBuilder<AuthState>()  .init({    token: localStorage.getItem(tokenKey) || undefined,  })  .handle(Login, (state, action, dispatch) => {    const { username, password } = action.payload    fetch(`https://server.com/login?u=${username}&p=${password}`)      .then(x => x.json())      .then(data => {        /*        * When server respond with token, another action is dispatching.        */        dispatch(SetToken(data.token))        dispatch(push('/dashboard'))      })    return state  })  .handle(Logout, (state, action, dispatch) => {    dispatch(SetToken({ token: undefined }))    dispatch(push('/dashboard'))    return state  })  .handle(SetToken, (state, action) => {    const token = action.payload.token    if (token) {      localStorage.setItem(tokenKey, token)    } else {      localStorage.removeItem(tokenKey)    }    return {      ...state,      token,    }  })

Connect

import * as React from 'react'import { ChangeTheme } from '../actions/layout.actions'import { Logout } from '../actions/auth.actions'import { connect } from 'react-redux'import { mapDispatchToProps, StateToProps } from 'redux-ts'const mapStoreToProps: StateToProps<StoreState> = map => mapconst storeProps = mapStoreToProps(store => ({  useDarkTheme: !!store.layout.useDarkTheme,}))const dispatchProps = mapDispatchToProps({  Logout,  ChangeTheme,})type MainProps = ReturnType<typeof dispatchProps> & ReturnType<typeof storeProps>const MainContainer: React.SFC<MainProps> = ({ children, useDarkTheme, Logout, ChangeTheme }) => {  const appBarRightElement = (    <div style={{ display: 'inline-block' }}>      <Toggle        onToggle={ChangeTheme}        label={useDarkTheme: 'dark' : 'light'}        toggled={useDarkTheme}      />      <FlatButton onClick={Logout} label="logout" />    </div>  )    return (    <div>      <AppBar iconElementRight={appBarRightElement}/>      {children}    </div>  )}export const Main = connect(storeProps, dispatchProps)(MainContainer)

Example

License