Typescript Connected Component

gistfile1.txt

interface TodosFindResponse {
 promiseData?: TodoEntity[];
 promiseError?: object;
 loaded: boolean;
}
interface AddedTodosState {
 addedTodos: TodoEntity[];
 addTodoToState: (todo: TodoEntity) => void;
}
interface SearchFilterState {
 searchText: string;
 setSearchText: (text: string) => void;
}
type TodosListDataProps = TodosFindResponse & 
                          UrlState & 
                          AddedTodosState;
const selectFilteredTodos = createSelector<TodosListDataProps, TodoEntity[], string, TodoEntity[], TodoEntity[]>(
 props => props.promiseData || [],
 props => props.searchText || '',
 props => props.addedTodos,
 (todos, searchText, addedTodos) => (
  (searchText.length > 0) 
   ? todos.filter(todo => todo.text.includes(searchText)) 
   : todos
 ).concat(addedTodos)
);
// map from TodosListDataProps to TodosSearchProps
const selectSearchProps = (props: TodosListDataProps): TodosSearchProps => ({
 searchText: props.searchText,
 setSearchText: props.setSearchText
});
// map from TodosListDataProps to TodosListProps
const TodosListPage = compose<TodosListProps, {}>(
 withPromise<TodoEntity[]>(() => TodosService.find()),
 withState<AddedTodosState>('addedTodos', 'addTodoToState', []),
 withState<SearchFilterState>('searchText', 'setSearchText', ''),
 mapProps<TodosListProps, TodosListDataProps>(props => ({
  addTodo: (todo: TodoEntity) => TodosService.create(todo)
   .then(addedTodo => props.addTodoToState(addedTodo)),
  todos: selectFilteredTodos(props),
  search: selectSearchProps(props)
 })
)(TodosList);

Typescript Connected Comp

interface TodosFindResponse {
 promiseData?: TodoEntity[];
 promiseError?: object;
 loaded: boolean;
}
interface AddedTodosState {
 addedTodos: TodoEntity[];
 addTodoToState: (todo: TodoEntity) => void;
}
interface SearchFilterState {
 searchText: string;
 setSearchText: (text: string) => void;
}
type TodosListDataProps = TodosFindResponse & 
                          UrlState & 
                          AddedTodosState;
const selectFilteredTodos = createSelector<TodosListDataProps, TodoEntity[], string, TodoEntity[], TodoEntity[]>(
 props => props.promiseData || [],
 props => props.searchText || '',
 props => props.addedTodos,
 (todos, searchText, addedTodos) => (
  (searchText.length > 0) 
   ? todos.filter(todo => todo.text.includes(searchText)) 
   : todos
 ).concat(addedTodos)
);
// map from TodosListDataProps to TodosSearchProps
const selectSearchProps = (props: TodosListDataProps): TodosSearchProps => ({
 searchText: props.searchText,
 setSearchText: props.setSearchText
});
// map from TodosListDataProps to TodosListProps
const TodosListPage = compose<TodosListProps, {}>(
 withPromise<TodoEntity[]>(() => TodosService.find()),
 withState<AddedTodosState>('addedTodos', 'addTodoToState', []),
 withState<SearchFilterState>('searchText', 'setSearchText', ''),
 mapProps<TodosListProps, TodosListDataProps>(props => ({
  addTodo: (todo: TodoEntity) => TodosService.create(todo)
   .then(addedTodo => props.addTodoToState(addedTodo)),
  todos: selectFilteredTodos(props),
  search: selectSearchProps(props)
 })
)(TodosList);