Map Component

map-component.js

const Item = ({ title, completed, check, style, className }) => (
  <li className={className}>
    <span>{check} ({String(completed)}) </span>
    <span style={style}>{title}</span>
  </li>
)
const map = item => ({
  ...item,
  check: item.completed? 'o' : 'x',
  style: item.completed? { color: 'gree' } : { color: 'red' },
})
const TodoList = () => (
  <ul>
    <MapArray from={todoList} map={map}>
      <Item className="todo__item" />
    </MapArray>
  </ul>
)