import React, { useState } from "react"; import { DragDropContext, Droppable, Draggable } from "react-beautiful-dnd"; import "./App.css"; const finalSpaceCharacters = [ { id: "gary", name: "Gary Goodspeed", thumb: "/images/gary.png", }, { id: "cato", name: "Little Cato", thumb: "/images/cato.png", }, { id: "kvn", name: "KVN", thumb: "/images/kvn.png", }, { id: "mooncake", name: "Mooncake", thumb: "/images/mooncake.png", }, { id: "quinn", name: "Quinn Ergon", thumb: "/images/quinn.png", }, ]; function Testt() { const [characters, updateCharacters] = useState(finalSpaceCharacters); function handleOnDragEnd(result) { if (!result.destination) return; const items = Array.from(characters); const [reorderedItem] = items.splice(result.source.index, 1); items.splice(result.destination.index, 0, reorderedItem); updateCharacters(items); } return (
{name}
Images from{" "} Final Space Wiki