redux-state-sync/example_immutable/src/containers/VisibleTodoList.js

A middleware for redux to sync state in different tabs

import { connect } from 'react-redux';
import { toggleTodo } from '../actions';
import TodoList from '../components/TodoList';

const getVisibleTodos = (todos, filter) => {
    switch (filter) {
        case 'SHOW_COMPLETED':
            return todos.filter(t => t.get('completed'));
        case 'SHOW_ACTIVE':
            return todos.filter(t => !t.get('completed'));
        case 'SHOW_ALL':
        default:
            return todos;
    }
};

const mapStateToProps = state => ({
    todos: getVisibleTodos(state.get('todos'), state.get('visibilityFilter')),
});

const mapDispatchToProps = dispatch => ({
    toggleTodo: id => dispatch(toggleTodo(id)),
});

export default connect(mapStateToProps, mapDispatchToProps)(TodoList);