import React, { PropTypes } from 'react'
import Todo from './Todo'

const TodoList = ({ todos, onTodoClick, onSelect }) => (
  <ul>
    {todos.map(todo =>
      <Todo
        key={todo.id}
        {...todo}  {/*children, completed, onClick, text */}
        onClick={() => onTodoClick(todo.id)}
      >
        <input type="checkbox" onClick={() => onSelect(todo.id)} />
      </Todo>
    )}
  </ul>
) // theoretically I could put that checkbox outside <Todo> and put it same .map !!!

TodoList.propTypes = {
  todos: PropTypes.arrayOf(PropTypes.shape({
    id: PropTypes.number.isRequired,
    completed: PropTypes.bool.isRequired,
    text: PropTypes.string.isRequired
  }).isRequired).isRequired,
  onTodoClick: PropTypes.func.isRequired
}
console.log(TodoList);
export default TodoList

now the folder structure: components$ ls
App.js  Footer.js  Link.js  Todo.js  TodoList.js

drwxrwxr-x   2 roberto roberto  4096 máj 15 12:14 actions
drwxrwxr-x   2 roberto roberto  4096 jún 15 13:58 components
drwxrwxr-x   2 roberto roberto  4096 jún 15 13:44 containers
.....

and I import it as
import TodoList from '../components/TodoList'