import React from 'react';
import { SortableContainer } from 'react-sortable-hoc';
import SortableItem from './SortableItem';

export default SortableContainer(function SortableList({ items, current, onItemContextMenu, updateName }) {
  return (
    <ul>
      {items.map((value, index) => (
        <SortableItem
          key={`item-${value.id}`}
          index={index}
          value={value}
          active={current === value.id}
          onContextMenu={onItemContextMenu}
          updateName={updateName}
        />
      ))}
    </ul>
  );
});
