Use more ES6 syntaxes in the examples (reduxjs#1965)

* Style todos-with-undo examples

* style todos example

* style tree-view example

* style universal example

Author: ChrisJamesC

examples/todos-with-undo/src/actions/index.js

@@ -1,22 +1,16 @@
 let nextTodoId = 0
-export const addTodo = (text) => {
-  return {
-    type: 'ADD_TODO',
-    id: nextTodoId++,
-    text
-  }
-}
+export const addTodo = (text) => ({
+  type: 'ADD_TODO',
+  id: nextTodoId++,
+  text
+})
 
-export const setVisibilityFilter = (filter) => {
-  return {
-    type: 'SET_VISIBILITY_FILTER',
-    filter
-  }
-}
+export const setVisibilityFilter = (filter) => ({
+  type: 'SET_VISIBILITY_FILTER',
+  filter
+})
 
-export const toggleTodo = (id) => {
-  return {
-    type: 'TOGGLE_TODO',
-    id
-  }
-}
+export const toggleTodo = (id) => ({
+  type: 'TOGGLE_TODO',
+  id
+})

examples/todos-with-undo/src/containers/FilterLink.js

@@ -2,19 +2,15 @@ import { connect } from 'react-redux'
 import { setVisibilityFilter } from '../actions'
 import Link from '../components/Link'
 
-const mapStateToProps = (state, ownProps) => {
-  return {
-    active: ownProps.filter === state.visibilityFilter
-  }
-}
+const mapStateToProps = (state, ownProps) => ({
+  active: ownProps.filter === state.visibilityFilter
+})
 
-const mapDispatchToProps = (dispatch, ownProps) => {
-  return {
-    onClick: () => {
-      dispatch(setVisibilityFilter(ownProps.filter))
-    }
+const mapDispatchToProps = (dispatch, ownProps) => ({
+  onClick: () => {
+    dispatch(setVisibilityFilter(ownProps.filter))
   }
-}
+})
 
 const FilterLink = connect(
   mapStateToProps,

examples/todos-with-undo/src/containers/UndoRedo.js

@@ -13,19 +13,15 @@ let UndoRedo = ({ canUndo, canRedo, onUndo, onRedo }) => (
   </p>
 )
 
-const mapStateToProps = (state) => {
-  return {
-    canUndo: state.todos.past.length > 0,
-    canRedo: state.todos.future.length > 0
-  }
-}
+const mapStateToProps = (state) => ({
+  canUndo: state.todos.past.length > 0,
+  canRedo: state.todos.future.length > 0
+})
 
-const mapDispatchToProps = (dispatch) => {
-  return {
-    onUndo: () => dispatch(UndoActionCreators.undo()),
-    onRedo: () => dispatch(UndoActionCreators.redo())
-  }
-}
+const mapDispatchToProps = ({
+  onUndo: UndoActionCreators.undo,
+  onRedo: UndoActionCreators.redo
+})
 
 UndoRedo = connect(
   mapStateToProps,

examples/todos-with-undo/src/containers/VisibleTodoList.js

@@ -15,19 +15,13 @@ const getVisibleTodos = (todos, filter) => {
   }
 }
 
-const mapStateToProps = (state) => {
-  return {
-    todos: getVisibleTodos(state.todos.present, state.visibilityFilter)
-  }
-}
+const mapStateToProps = (state) => ({
+  todos: getVisibleTodos(state.todos.present, state.visibilityFilter)
+})
 
-const mapDispatchToProps = (dispatch) => {
-  return {
-    onTodoClick: (id) => {
-      dispatch(toggleTodo(id))
-    }
-  }
-}
+const mapDispatchToProps = ({
+  onTodoClick: toggleTodo
+})
 
 const VisibleTodoList = connect(
   mapStateToProps,

examples/todos/src/actions/index.js

@@ -1,22 +1,16 @@
 let nextTodoId = 0
-export const addTodo = (text) => {
-  return {
-    type: 'ADD_TODO',
-    id: nextTodoId++,
-    text
-  }
-}
+export const addTodo = (text) => ({
+  type: 'ADD_TODO',
+  id: nextTodoId++,
+  text
+})
 
-export const setVisibilityFilter = (filter) => {
-  return {
-    type: 'SET_VISIBILITY_FILTER',
-    filter
-  }
-}
+export const setVisibilityFilter = (filter) => ({
+  type: 'SET_VISIBILITY_FILTER',
+  filter
+})
 
-export const toggleTodo = (id) => {
-  return {
-    type: 'TOGGLE_TODO',
-    id
-  }
-}
+export const toggleTodo = (id) => ({
+  type: 'TOGGLE_TODO',
+  id
+})

examples/todos/src/containers/FilterLink.js

@@ -2,19 +2,15 @@ import { connect } from 'react-redux'
 import { setVisibilityFilter } from '../actions'
 import Link from '../components/Link'
 
-const mapStateToProps = (state, ownProps) => {
-  return {
-    active: ownProps.filter === state.visibilityFilter
-  }
-}
+const mapStateToProps = (state, ownProps) => ({
+  active: ownProps.filter === state.visibilityFilter
+})
 
-const mapDispatchToProps = (dispatch, ownProps) => {
-  return {
-    onClick: () => {
-      dispatch(setVisibilityFilter(ownProps.filter))
-    }
+const mapDispatchToProps = (dispatch, ownProps) => ({
+  onClick: () => {
+    dispatch(setVisibilityFilter(ownProps.filter))
   }
-}
+})
 
 const FilterLink = connect(
   mapStateToProps,

examples/todos/src/containers/VisibleTodoList.js

@@ -15,19 +15,13 @@ const getVisibleTodos = (todos, filter) => {
   }
 }
 
-const mapStateToProps = (state) => {
-  return {
-    todos: getVisibleTodos(state.todos, state.visibilityFilter)
-  }
-}
+const mapStateToProps = (state) => ({
+  todos: getVisibleTodos(state.todos, state.visibilityFilter)
+})
 
-const mapDispatchToProps = (dispatch) => {
-  return {
-    onTodoClick: (id) => {
-      dispatch(toggleTodo(id))
-    }
-  }
-}
+const mapDispatchToProps =  ({
+  onTodoClick: toggleTodo
+})
 
 const VisibleTodoList = connect(
   mapStateToProps,

examples/tree-view/src/actions/index.js

@@ -4,40 +4,30 @@ export const DELETE_NODE = 'DELETE_NODE'
 export const ADD_CHILD = 'ADD_CHILD'
 export const REMOVE_CHILD = 'REMOVE_CHILD'
 
-export function increment(nodeId) {
-  return {
-    type: INCREMENT,
-    nodeId
-  }
-}
+export const increment = (nodeId) => ({
+  type: INCREMENT,
+  nodeId
+})
 
 let nextId = 0
-export function createNode() {
-  return {
-    type: CREATE_NODE,
-    nodeId: `new_${nextId++}`
-  }
-}
+export const createNode = () => ({
+  type: CREATE_NODE,
+  nodeId: `new_${nextId++}`
+})
 
-export function deleteNode(nodeId) {
-  return {
-    type: DELETE_NODE,
-    nodeId
-  }
-}
+export const deleteNode = (nodeId) => ({
+  type: DELETE_NODE,
+  nodeId
+})
 
-export function addChild(nodeId, childId) {
-  return {
-    type: ADD_CHILD,
-    nodeId,
-    childId
-  }
-}
+export const addChild = (nodeId, childId) => ({
+  type: ADD_CHILD,
+  nodeId,
+  childId
+})
 
-export function removeChild(nodeId, childId) {
-  return {
-    type: REMOVE_CHILD,
-    nodeId,
-    childId
-  }
-}
+export const removeChild = (nodeId, childId) => ({
+  type: REMOVE_CHILD,
+  nodeId,
+  childId
+})

examples/tree-view/src/containers/Node.js

@@ -44,12 +44,11 @@ export class Node extends Component {
           +
         </button>
         {' '}
-        {typeof parentId !== 'undefined' ?
+        {typeof parentId !== 'undefined' &&
           <a href="#" onClick={this.handleRemoveClick}
              style={{ color: 'lightgray', textDecoration: 'none' }}>
             ×
-          </a> :
-          null
+          </a>
         }
         <ul>
           {childIds.map(this.renderChild)}

examples/tree-view/src/reducers/index.js

@@ -1,6 +1,6 @@
 import { INCREMENT, ADD_CHILD, REMOVE_CHILD, CREATE_NODE, DELETE_NODE } from '../actions'
 
-function childIds(state, action) {
+const childIds = (state, action) => {
   switch (action.type) {
     case ADD_CHILD:
       return [ ...state, action.childId ]
@@ -11,7 +11,7 @@ function childIds(state, action) {
   }
 }
 
-function node(state, action) {
+const node = (state, action) => {
   switch (action.type) {
     case CREATE_NODE:
       return {
@@ -35,19 +35,19 @@ function node(state, action) {
   }
 }
 
-function getAllDescendantIds(state, nodeId) {
-  return state[nodeId].childIds.reduce((acc, childId) => (
+const getAllDescendantIds = (state, nodeId) => (
+  state[nodeId].childIds.reduce((acc, childId) => (
     [ ...acc, childId, ...getAllDescendantIds(state, childId) ]
   ), [])
-}
+)
 
-function deleteMany(state, ids) {
+const deleteMany = (state, ids) => {
   state = { ...state }
   ids.forEach(id => delete state[id])
   return state
 }
 
-export default function (state = {}, action) {
+export default (state = {}, action) => {
   const { nodeId } = action
   if (typeof nodeId === 'undefined') {
     return state

examples/universal/common/actions/index.js

@@ -2,41 +2,31 @@ export const SET_COUNTER = 'SET_COUNTER'
 export const INCREMENT_COUNTER = 'INCREMENT_COUNTER'
 export const DECREMENT_COUNTER = 'DECREMENT_COUNTER'
 
-export function set(value) {
-  return {
-    type: SET_COUNTER,
-    payload: value
-  }
-}
+export const set = (value) => ({
+  type: SET_COUNTER,
+  payload: value
+})
 
-export function increment() {
-  return {
-    type: INCREMENT_COUNTER
-  }
-}
+export const increment = () => ({
+  type: INCREMENT_COUNTER
+})
 
-export function decrement() {
-  return {
-    type: DECREMENT_COUNTER
-  }
-}
+export const decrement = () => ({
+  type: DECREMENT_COUNTER
+})
 
-export function incrementIfOdd() {
-  return (dispatch, getState) => {
-    const { counter } = getState()
+export const incrementIfOdd = () => (dispatch, getState) => {
+  const { counter } = getState()
 
-    if (counter % 2 === 0) {
-      return
-    }
-
-    dispatch(increment())
+  if (counter % 2 === 0) {
+    return
   }
+
+  dispatch(increment())
 }
 
-export function incrementAsync(delay = 1000) {
-  return dispatch => {
-    setTimeout(() => {
-      dispatch(increment())
-    }, delay)
-  }
+export const incrementAsync = (delay = 1000) => dispatch => {
+  setTimeout(() => {
+    dispatch(increment())
+  }, delay)
 }