Redux with discriminated unions

redux.tsx

import { List } from "immutable";
import * as React from "react";
import { connect } from "react-redux";
import { Action, Dispatch } from "redux";

export enum ActionKind {
  AddTodo = "ADD_TODO",
  RemoveTodo = "REMOVE_TODO"
}

export interface SimpleAction<TType, TValue> extends Action {
    readonly type: TType;
    readonly value: TValue;
}

export const addTodo = (message: string) => ({ type: ActionKind.AddTodo, value: message });
export const removeTodo = (index: number) => ({ type: ActionKind.RemoveTodo, value: index });

export type TodoAction = SimpleAction<ActionKind.AddTodo, string> | SimpleAction<ActionKind.RemoveTodo, number>;

export function reduce(state: List<string> = List(), action: TodoAction) {
  switch (action.type) {
    case ActionKind.AddTodo: return state.push(action.value);
    case ActionKind.RemoveTodo: return state.remove(action.value);
    default: return state;
  }
}

interface PropsFromDispatch {
  addTodo(message: string): void;
  removeTodo(index: number): void;
}

interface PropsFromState {
  todos: List<string>;
}

function mapStateToProps(state: List<string>): PropsFromState {
  return { todos: state };
}

function mapDispatchToProps(dispatch: Dispatch<List<string>>): PropsFromDispatch {
  return {
    addTodo: (message: string) => dispatch(addTodo(message)),
    removeTodo: (index: number) => dispatch(removeTodo(index))
  };
}

class MyConnectableComponent extends React.Component<PropsFromDispatch & PropsFromState> {
  render() {
    const todoItems = this.props.todos.map((t, i) => <li key={i}>{t}</li>);
    return <ul>{todoItems}</ul>;
  }
}

export const MyComponent = connect(mapStateToProps, mapDispatchToProps)(MyConnectableComponent);