Example

function-composition.jsx

import {compose} from 'redux'
import {store} from './store.js'

const pickSelectedUser = props => {
  const {selectedName, users} = props
  const foundUser = users.find(user => user.name === selectedName)
  
  return foundUser.id
}

const deleteUser = userId => event => {
  event.preventDefault()
  store.dispatch({
    type: `DELETE_USER`,
    userId,
  })
}

// The compose function creates a new function that accepts a parameter.
// The parameter will be passed throw the functions from down to top.
// Each function will change the value and pass it to the next function
// By changing value it was not meant a mutation
const handleClick = compose(
  deleteUser,
  pickSelectedUser,
)

const Confirm = props => (
  <div>
    <h1>Are you sure to delete?</h1>
    <button onClick={handleClick(props)}>
      Delete
    </button>
  </div
)