import React from 'react';
import Button from './Button';

export default function(props) {
  const latest = props.latest || [];
  const latestElements = latest.map(item => {
    const created = new Date(item.created);
    const hrefId = `#item-${item.id}`;
    return (
      <li key={item.id}>
        <a href={hrefId} onClick={() => props.onSelect(item)}>{created.toLocaleString()}</a>
        <span>    </span>
        <Button onClick={() => props.onRemove(item)}>Remove</Button>
      </li>
    );
  });

  return (
    <div>
      <h4>Vergangene Briefe:</h4>
      <ul>{latestElements}</ul>
    </div>
  );
}
