Skip to content
Permalink
Browse files

Use redux-starter-kit on visibilityFilter

  • Loading branch information...
magarcia committed Jan 24, 2019
1 parent 1b81c14 commit ae78e0aacd4827786a63f29db4d6f4e0a2079422
@@ -1,9 +1,9 @@
import * as types from '../constants/ActionTypes'
import { createAction } from "redux-starter-kit";
import * as types from "../constants/ActionTypes";

export const addTodo = text => ({ type: types.ADD_TODO, text })
export const deleteTodo = id => ({ type: types.DELETE_TODO, id })
export const editTodo = (id, text) => ({ type: types.EDIT_TODO, id, text })
export const completeTodo = id => ({ type: types.COMPLETE_TODO, id })
export const completeAllTodos = () => ({ type: types.COMPLETE_ALL_TODOS })
export const clearCompleted = () => ({ type: types.CLEAR_COMPLETED })
export const setVisibilityFilter = filter => ({ type: types.SET_VISIBILITY_FILTER, filter})
export const addTodo = text => ({ type: types.ADD_TODO, text });
export const deleteTodo = id => ({ type: types.DELETE_TODO, id });
export const editTodo = (id, text) => ({ type: types.EDIT_TODO, id, text });
export const completeTodo = id => ({ type: types.COMPLETE_TODO, id });
export const completeAllTodos = () => ({ type: types.COMPLETE_ALL_TODOS });
export const clearCompleted = () => ({ type: types.CLEAR_COMPLETED });
@@ -1,7 +1,6 @@
export const ADD_TODO = 'ADD_TODO'
export const DELETE_TODO = 'DELETE_TODO'
export const EDIT_TODO = 'EDIT_TODO'
export const COMPLETE_TODO = 'COMPLETE_TODO'
export const COMPLETE_ALL_TODOS = 'COMPLETE_ALL_TODOS'
export const CLEAR_COMPLETED = 'CLEAR_COMPLETED'
export const SET_VISIBILITY_FILTER = 'SET_VISIBILITY_FILTER'
export const ADD_TODO = "ADD_TODO";
export const DELETE_TODO = "DELETE_TODO";
export const EDIT_TODO = "EDIT_TODO";
export const COMPLETE_TODO = "COMPLETE_TODO";
export const COMPLETE_ALL_TODOS = "COMPLETE_ALL_TODOS";
export const CLEAR_COMPLETED = "CLEAR_COMPLETED";
@@ -1,18 +1,20 @@
import { connect } from 'react-redux'
import { setVisibilityFilter } from '../actions'
import Link from '../components/Link'
import { connect } from "react-redux";
import { visibilityFilter } from "../ducks";
import Link from "../components/Link";

const { setVisibilityFilter } = visibilityFilter.actions;

const mapStateToProps = (state, ownProps) => ({
active: ownProps.filter === state.visibilityFilter
})
});

const mapDispatchToProps = (dispatch, ownProps) => ({
setFilter: () => {
dispatch(setVisibilityFilter(ownProps.filter))
dispatch(setVisibilityFilter(ownProps.filter));
}
})
});

export default connect(
mapStateToProps,
mapDispatchToProps
)(Link)
)(Link);
@@ -0,0 +1 @@
export * from "./visibilityFilter";
@@ -0,0 +1,10 @@
import { createSlice } from "redux-starter-kit";
import { SHOW_ALL } from "../constants/TodoFilters";

export const visibilityFilter = createSlice({
slice: "visibilityFilter",
initialState: SHOW_ALL,
reducers: {
setVisibilityFilter: (state, action) => action.payload
}
});
@@ -1,10 +1,10 @@
import { combineReducers } from 'redux'
import todos from './todos'
import visibilityFilter from './visibilityFilter'
import { combineReducers } from "redux";
import todos from "./todos";
import { visibilityFilter } from "../ducks";

const rootReducer = combineReducers({
todos,
visibilityFilter
})
visibilityFilter: visibilityFilter.reducer
});

export default rootReducer
export default rootReducer;

This file was deleted.

@@ -1,31 +1,33 @@
import { createSelector } from 'reselect'
import { SHOW_ALL, SHOW_COMPLETED, SHOW_ACTIVE } from '../constants/TodoFilters'
import { createSelector } from "redux-starter-kit";
import { visibilityFilter } from "../ducks";
import {
SHOW_ALL,
SHOW_COMPLETED,
SHOW_ACTIVE
} from "../constants/TodoFilters";

const getVisibilityFilter = state => state.visibilityFilter
const getTodos = state => state.todos
const { getVisibilityFilter } = visibilityFilter.selectors;

const getTodos = state => state.todos;

export const getVisibleTodos = createSelector(
[getVisibilityFilter, getTodos],
(visibilityFilter, todos) => {
switch (visibilityFilter) {
case SHOW_ALL:
return todos
return todos;
case SHOW_COMPLETED:
return todos.filter(t => t.completed)
return todos.filter(t => t.completed);
case SHOW_ACTIVE:
return todos.filter(t => !t.completed)
return todos.filter(t => !t.completed);
default:
throw new Error('Unknown filter: ' + visibilityFilter)
throw new Error("Unknown filter: " + visibilityFilter);
}
}
)
);

export const getCompletedTodoCount = createSelector(
[getTodos],
todos => (
todos.reduce((count, todo) =>
todo.completed ? count + 1 : count,
0
)
)
)
todos =>
todos.reduce((count, todo) => (todo.completed ? count + 1 : count), 0)
);

0 comments on commit ae78e0a

Please sign in to comment.
You can’t perform that action at this time.