diff --git a/.gitignore b/.gitignore index dc4e505..b43ce62 100644 --- a/.gitignore +++ b/.gitignore @@ -1,2 +1,3 @@ #node modules -node_modules/ \ No newline at end of file +node_modules/ +.vscode/ diff --git a/src/actions/todoAction.js b/src/actions/todoAction.js new file mode 100644 index 0000000..4dc8e0d --- /dev/null +++ b/src/actions/todoAction.js @@ -0,0 +1,11 @@ +import { ADD_TODO, REMOVE_TODO } from '../constants/todo.constants'; + +export const addTodo = data => ({ + type: ADD_TODO, + payload: data +}); + +export const removeTodo = data => ({ + type: REMOVE_TODO, + payload: data +}); diff --git a/src/components/form/Form.jsx b/src/components/form/Form.jsx index 05594ff..32efed8 100644 --- a/src/components/form/Form.jsx +++ b/src/components/form/Form.jsx @@ -52,13 +52,13 @@ export class Form extends React.Component { /> + ) + + renderItems = () => ( + this.props.todoList.map(item => +
  • + {item} + +
    • ) + ) + + render() { + return ( +
    + {this.btnAdd()} + +
    + ); + } +} diff --git a/src/constants/todo.constants.js b/src/constants/todo.constants.js new file mode 100644 index 0000000..aad8dc5 --- /dev/null +++ b/src/constants/todo.constants.js @@ -0,0 +1,4 @@ +export const ADD_TODO = 'ADD_TODO'; +export const REMOVE_TODO = 'REMOVE_TODO'; + +export const TODO_LIST = 'TODO_LIST'; diff --git a/src/containers/Favorites.js b/src/containers/Favorites.js index d402151..c262f05 100644 --- a/src/containers/Favorites.js +++ b/src/containers/Favorites.js @@ -5,12 +5,13 @@ import { setToInitialState } from '../actions/favoritesAction.js'; import { getPropertyData } from '../actions/propertyActions.js'; import { FAVORITES } from '../constants/favorites.constants.js'; +import { getFromLocalStorage } from '../utils.js'; const mapStateToProps = ({ favorites }) => ({ searchResults: favorites.data, totalResults: favorites.data.length, - listOfFavorites: JSON.parse(localStorage.getItem(FAVORITES)) + listOfFavorites: getFromLocalStorage(FAVORITES) }); const mapDispatchToProps = { diff --git a/src/containers/TodoList.js b/src/containers/TodoList.js new file mode 100644 index 0000000..d1b603d --- /dev/null +++ b/src/containers/TodoList.js @@ -0,0 +1,23 @@ +import { connect } from 'react-redux'; + +import { TodoList } from '../components/todolist/TodoList.jsx'; + +import { addTodo, removeTodo } from '../actions/todoAction'; + +const mapStateToProps = ({ + todos: { + todoList + } +}) => ({ + todoList +}); + +const mapDispatchToProps = { + addTodo, + removeTodo +}; + +export default connect( + mapStateToProps, + mapDispatchToProps +)(TodoList); diff --git a/src/index.js b/src/index.js index 3fe1af3..d79cbff 100644 --- a/src/index.js +++ b/src/index.js @@ -7,25 +7,25 @@ import Locations from './containers/Locations'; import RealtyList from './containers/RealtyList'; import PropertyDetails from './containers/propertyDetails'; import Favorites from './containers/Favorites'; +import TodoList from './containers/TodoList'; import store from './store/configureStore'; import { RECENT_SEARCHES } from './constants/location.constants'; import { FAVORITES } from './constants/favorites.constants'; +import { TODO_LIST } from './constants/todo.constants'; -if (!localStorage.getItem(RECENT_SEARCHES)) { - localStorage.recentSearches = JSON.stringify([]); -} - -if (!localStorage.getItem(FAVORITES)) { - localStorage[FAVORITES] = JSON.stringify([]); -} +import { setInitialStateOfLocalStorage } from './utils.js'; +setInitialStateOfLocalStorage(RECENT_SEARCHES); +setInitialStateOfLocalStorage(FAVORITES); +setInitialStateOfLocalStorage(TODO_LIST); render( + diff --git a/src/reducers/favoritesReducer.js b/src/reducers/favoritesReducer.js index da2a477..8dfc9b1 100644 --- a/src/reducers/favoritesReducer.js +++ b/src/reducers/favoritesReducer.js @@ -1,9 +1,9 @@ import { SET_TO_FAVORITES, FAVORITES, SET_TO_INITIAL_STATE } from '../constants/favorites.constants.js'; -import { saveToLocalStorage } from '../utils.js'; +import { saveToLocalStorage, getFromLocalStorage } from '../utils.js'; const initialState = { - data: JSON.parse(localStorage.getItem(FAVORITES)) + data: getFromLocalStorage(FAVORITES) }; export const favoritesReducer = (state = initialState, action) => { @@ -23,7 +23,7 @@ export const favoritesReducer = (state = initialState, action) => { case SET_TO_INITIAL_STATE: return { - data: JSON.parse(localStorage.getItem(FAVORITES)) + data: getFromLocalStorage(FAVORITES) }; default: return state; diff --git a/src/reducers/locationReducer.js b/src/reducers/locationReducer.js index e9c8495..582e971 100644 --- a/src/reducers/locationReducer.js +++ b/src/reducers/locationReducer.js @@ -1,5 +1,7 @@ import { FETCH_LOCATIONS, FETCH_LOCATIONS_SUCCESS, FETCH_LOCATIONS_ERROR, RECENT_SEARCHES, FETCH_MY_LOCATION_SUCCESS, SET_TO_INITIAL_STATE } from '../constants/location.constants'; +import { getFromLocalStorage } from '../utils.js'; + const initialState = { fetching: false, fetched: false, @@ -7,7 +9,7 @@ const initialState = { locations: [], title: 'Recent searches:', searchedValue: '', - recentSearches: JSON.parse(localStorage.getItem(RECENT_SEARCHES)) || [] + recentSearches: getFromLocalStorage(RECENT_SEARCHES) || [] }; export const locationsReducer = (state = initialState, { @@ -59,7 +61,7 @@ export const locationsReducer = (state = initialState, { locations: [], title: 'Recent searches:', searchedValue: '', - recentSearches: JSON.parse(localStorage.getItem(RECENT_SEARCHES)) || [] + recentSearches: getFromLocalStorage(RECENT_SEARCHES) || [] }; default: return state; diff --git a/src/reducers/todoReducer.js b/src/reducers/todoReducer.js new file mode 100644 index 0000000..9da6b6a --- /dev/null +++ b/src/reducers/todoReducer.js @@ -0,0 +1,39 @@ +import { ADD_TODO, REMOVE_TODO, TODO_LIST } from '../constants/todo.constants.js'; + +import { + saveToLocalStorage, + getFromLocalStorage, + deleteFromLocalStorage +} from '../utils.js'; + +const initialState = { + todoList: getFromLocalStorage(TODO_LIST) +}; + +export const todoListReducer = (state = initialState, action) => { + switch (action.type) { + case ADD_TODO: + + saveToLocalStorage(TODO_LIST, state.todoList, action.payload); + + return { + ...state, + todoList: [ + ...state.todoList, + action.payload + ] + }; + + case REMOVE_TODO: + + deleteFromLocalStorage(TODO_LIST, state.todoList, action.payload); + + return { + ...state, + todoList: [...state.todoList.filter(todo => todo !== action.payload)] + }; + + default: return state; + + } +}; diff --git a/src/store/combineReducers.js b/src/store/combineReducers.js index 3f86171..e42706e 100644 --- a/src/store/combineReducers.js +++ b/src/store/combineReducers.js @@ -3,12 +3,14 @@ import { locationsReducer } from '../reducers/locationReducer'; import { realtyReducer } from '../reducers/realtyReducer'; import { propertyReducer } from '../reducers/PropertyReducer'; import { favoritesReducer } from '../reducers/favoritesReducer'; +import { todoListReducer } from '../reducers/todoReducer'; const rootReducer = combineReducers({ locations: locationsReducer, realty: realtyReducer, property: propertyReducer, - favorites: favoritesReducer + favorites: favoritesReducer, + todos: todoListReducer }); export default rootReducer; diff --git a/src/utils.js b/src/utils.js index 87b3664..e8c9d80 100644 --- a/src/utils.js +++ b/src/utils.js @@ -8,5 +8,19 @@ export function saveToLocalStorage(constant, state, payload) { } export function getFromLocalStorage(constant) { - JSON.parse(localStorage.getItem(constant)); + return JSON.parse(localStorage.getItem(constant)); +} + +export function deleteFromLocalStorage(constant, state, payload) { + const stringifyData = JSON.stringify([ + ...state.filter(todo => todo !== payload) + ]); + + localStorage.setItem(constant, stringifyData); +} + +export function setInitialStateOfLocalStorage(constant) { + if (!localStorage.getItem(constant)) { + localStorage[constant] = JSON.stringify([]); + } }