feat: Delete decks from the ship map configuration

Ollixx/issue239

Author: alexanderson1993

client/app/data/plugins/deck.ts

@@ -65,7 +65,11 @@ export const deck = t.router({
 		}),
 	delete: t.procedure
 		.input(
-			z.object({ pluginId: z.string(), shipId: z.string(), index: z.number() }),
+			z.object({
+				pluginId: z.string(),
+				shipId: z.string(),
+				deckId: z.string(),
+			}),
 		)
 		.send(({ ctx, input }) => {
 			inputAuth(ctx);
@@ -75,7 +79,10 @@ export const deck = t.router({
 			);
 			if (!ship) return;
 
-			ship.removeDeck(input.index);
+			const deckIndex = ship.decks.findIndex(
+				(deck) => deck.name === input.deckId,
+			);
+			ship.removeDeck(deckIndex);
 
 			pubsub.publish.plugin.ship.get({
 				pluginId: input.pluginId,

client/app/routes/config+/$pluginId.ships+/$shipId+/shipMap.$deckName/route.tsx

@@ -258,32 +258,6 @@ export default function DeckConfig() {
 					>
 						{addingEdges ? "Done Adding Edges" : "Add Edges"}
 					</Button>
-					<Button
-						onClick={async (event) => {
-							event.preventDefault();
-							event.stopPropagation();
-							const deckname = await prompt({
-								header: "Change the current deck's name",
-								body: "Give this deck a distinct name",
-								defaultValue: deck.name,
-								inputProps: { className: "input-error" },
-							});
-							if (typeof deckname === "string") {
-								const result = await q.plugin.ship.deck.update.netSend({
-									pluginId,
-									shipId,
-									deckId: deck.name,
-									newName: deckname,
-								});
-								if (result) {
-									deck.name = deckname;
-									navigate(`../${result.name}`);
-								}
-							}
-						}}
-					>
-						Rename Deck
-					</Button>
 				</div>
 				<div>
 					{addingNodes && <p>Click on map to add node</p>}

client/app/routes/config+/$pluginId.ships+/$shipId+/shipMap/route.tsx

@@ -3,6 +3,7 @@ import { useNavigate, useParams, Outlet } from "@remix-run/react";
 import type { DragEndEvent } from "@dnd-kit/core";
 import { q } from "@client/context/AppContext";
 import { SortableList } from "@client/components/ui/SortableItem";
+import { useConfirm, usePrompt } from "@thorium/ui/AlertDialog";
 
 export default function ShipMap() {
 	const { pluginId, shipId, deckName } = useParams() as {
@@ -11,6 +12,8 @@ export default function ShipMap() {
 		deckName: string;
 	};
 	const navigate = useNavigate();
+	const confirm = useConfirm();
+	const prompt = usePrompt();
 	const [data] = q.plugin.ship.get.useNetRequest({ pluginId, shipId });
 
 	async function handleDragEnd({
@@ -53,6 +56,62 @@ export default function ShipMap() {
 				>
 					Add Deck
 				</Button>
+				<div className="grid gap-2 grid-cols-2 mt-2">
+					<Button
+						className=""
+						disabled={deckName && deckName.length > 0 ? false : true}
+						title={
+							deckName && deckName.length > 0
+								? ""
+								: "Select a deck to be able to rename it"
+						}
+						onClick={async (event) => {
+							event.preventDefault();
+							event.stopPropagation();
+							const deckname = await prompt({
+								header: "Change the current deck's name",
+								body: "Give this deck a distinct name",
+								defaultValue: deckName,
+								inputProps: { className: "input-error" },
+							});
+							if (typeof deckname === "string") {
+								const result = await q.plugin.ship.deck.update.netSend({
+									pluginId,
+									shipId,
+									deckId: deckName,
+									newName: deckname,
+								});
+								if (result) {
+									navigate(`${result.name}`);
+								}
+							}
+						}}
+					>
+						Rename Deck
+					</Button>
+					<Button
+						className="btn-error"
+						disabled={deckName ? false : true}
+						onClick={async (event) => {
+							event.preventDefault();
+							event.stopPropagation();
+							if (
+								await confirm({
+									header: `Are you sure you want to delete deck '${deckName}'?`,
+								})
+							) {
+								await q.plugin.ship.deck.delete.netSend({
+									pluginId,
+									shipId,
+									deckId: deckName,
+								});
+								navigate(`.`);
+							}
+						}}
+					>
+						Delete Deck
+					</Button>
+				</div>
 			</div>
 			<Outlet />
 		</>

server/src/inputs/__test__/shipDecksPlugin.test.ts

@@ -39,10 +39,12 @@ describe("ship decks plugin input", () => {
 			mockDataContext.server.plugins[0].aspects.ships[0].decks.length,
 		).toEqual(2);
 
+		const deckIndexToDelete =
+			mockDataContext.server.plugins[0].aspects.ships[0].decks[0].name;
 		await router.plugin.ship.deck.delete({
 			pluginId: "Test Plugin",
 			shipId: "Test Template",
-			index: 0,
+			deckId: deckIndexToDelete,
 		});
 
 		expect(