import { Draggable } from "@hello-pangea/dnd";

export default function Task({
  task,
  index,
}: {
  task: {
    id: string;
    content: string;
  };
  index: number;
}) {
  return (
    <Draggable draggableId={task.id} index={index}>
      {(provided) => (
        <div
          className="border w-fit p-2"
          {...provided.dragHandleProps}
          {...provided.draggableProps}
          ref={provided.innerRef}
        >
          {task.content}
        </div>
      )}
    </Draggable>
  );
}