Map Component

map-component.js

const completedStyle = { color: 'green' }
const uncompletedStyle = { color: 'red' }
const Item = ({ title, completed }) => (
  <li>
    <span>{completed ? 'o' : 'x'} </span>
    <span style={completed ? completedStyle : uncompletedStyle}>{title}</span>
  </li>
)
const TodoList = () => (
  <ul>
    <MapArray from={todoList}>
      <Item />
    </MapArray>
  </ul>
)