edit mode redux conversion

src/actions/actionTypes.js

@@ -1 +1,6 @@
+// stuff
 export const RECEIVE_STUFF = 'RECEIVE_STUFF'
+
+// edit
+export const EDIT_MODE_ENABLED = 'EDIT_MODE_ENABLED'
+export const EDIT_MODE_DISABLED = 'EDIT_MODE_DISABLED'

src/actions/edit.action.js

@@ -0,0 +1,17 @@
+import * as actionTypes from './actionTypes'
+
+function editModeEnabled() {
+  return { type: actionTypes.EDIT_MODE_ENABLED, payload: true }
+}
+
+function editModeDisabled() {
+  return { type: actionTypes.EDIT_MODE_DISABLED, payload: false }
+}
+
+export function enableEditMode() {
+  return dispatch => dispatch(editModeEnabled())
+}
+
+export function disableEditMode() {
+  return dispatch => dispatch(editModeDisabled())
+}

src/actions/index.js

@@ -1,3 +1,4 @@
 import { fetchStuff } from './stuff.action'
+import { enableEditMode, disableEditMode } from './edit.action'
 
-export { fetchStuff }
+export { fetchStuff, enableEditMode, disableEditMode }

src/components/App.js

@@ -6,7 +6,8 @@ import {
   MapTimeline,
   NavBar,
   Login,
-  StuffList
+  StuffList,
+  Edit
 } from './'
 import { Api, storage } from './../utils'
 import './../styles/App.css'
@@ -259,6 +260,7 @@ class App extends Component {
           toggleSidebar={this.toggleSidebar}
         />
         <StuffList />
+        <Edit />
         {showLogin && (
           <Login setLogin={this.setLogin} setShowLogin={this.setShowLogin} />
         )}

src/components/Edit.component.js

@@ -0,0 +1,14 @@
+import React, { Component } from 'react'
+
+export default class Edit extends Component {
+  render() {
+    const { isEditing, enableEditMode, disableEditMode } = this.props
+    return (
+      <div>
+        <button onClick={isEditing ? disableEditMode : enableEditMode}>
+          {isEditing ? 'disableEditMode' : 'enableEditMode'}
+        </button>
+      </div>
+    )
+  }
+}

src/components/Edit.container.js

@@ -0,0 +1,22 @@
+import { connect } from 'react-redux'
+import { bindActionCreators } from 'redux'
+import { enableEditMode, disableEditMode } from './../actions'
+import Edit from './Edit.component'
+
+function mapStateToProps(state) {
+  return {
+    isEditing: state.edit.isEditing
+  }
+}
+
+function mapDispatchToProps(dispatch) {
+  return bindActionCreators(
+    {
+      enableEditMode,
+      disableEditMode
+    },
+    dispatch
+  )
+}
+
+export default connect(mapStateToProps, mapDispatchToProps)(Edit)

src/components/index.js

@@ -15,6 +15,7 @@ import Interval from './Interval.component'
 import Icon from './Icon.component'
 import Login from './Login.component'
 import StuffList from './StuffList.container'
+import Edit from './Edit.container'
 
 export {
   App,
@@ -33,5 +34,6 @@ export {
   Interval,
   Icon,
   Login,
-  StuffList
+  StuffList,
+  Edit
 }

src/reducers/edit.reducer.js

@@ -0,0 +1,15 @@
+import initialState from './initialState'
+import { EDIT_MODE_ENABLED, EDIT_MODE_DISABLED } from '../actions/actionTypes'
+
+export default function edit(state = initialState.edit, action) {
+  switch (action.type) {
+    case EDIT_MODE_ENABLED:
+    case EDIT_MODE_DISABLED:
+      return {
+        ...state,
+        isEditing: action.payload
+      }
+    default:
+      return state
+  }
+}

src/reducers/initialState.js

@@ -1,5 +1,8 @@
 const initialState = {
-  stuff: []
+  stuff: [],
+  edit: {
+    isEditing: false
+  }
 }
 
 export default initialState

src/reducers/rootReducer.js

@@ -1,9 +1,11 @@
 import { combineReducers } from 'redux'
 import { routerReducer } from 'react-router-redux'
 import stuff from './stuff.reducer'
+import edit from './edit.reducer'
 
 const rootReducer = combineReducers({
   stuff,
+  edit,
   router: routerReducer
 })