Raid Instance Creator working

2025-03-15 12:20:05 -04:00
parent cff5e098b8
commit 56236fd2ac
32 changed files with 1524 additions and 20 deletions
--- a/src/ui/raidInstance/creator/RaidInstanceCreatorTableBody.tsx
+++ b/src/ui/raidInstance/creator/RaidInstanceCreatorTableBody.tsx
@@ -0,0 +1,132 @@
+import DangerButton from "@/components/button/DangerButton";
+import TertiaryButton from "@/components/button/TertiaryButton";
+import { PersonCharacter } from "@/interface/PersonCharacter";
+import { RaidInstance } from "@/interface/RaidInstance";
+import { useRaidInstanceContext } from "@/providers/RaidInstanceLayoutProvider";
+import { getPersonCharactersFromXrefs } from "@/util/PersonCharacterUtil";
+import moment from "moment";
+import { BsDiscord, BsXLg } from "react-icons/bs";
+
+
+export default function RaidInstanceCreatorTableBody({
+	onClickBodyCell
+}:{
+	onClickBodyCell: (run: number, slot: number) => void;
+}){
+	const {
+		raidInstance, setRaidInstance,
+		people,
+		personCharacterXrefs, setPersonCharacterXrefs,
+		personCharacters,
+		selectedClassGroups
+	} = useRaidInstanceContext();
+
+
+	const characterGrid: (PersonCharacter | null)[][] = getPersonCharactersFromXrefs(personCharacterXrefs, personCharacters, raidInstance);
+
+
+	const removeRun = (runNumber: number) => {
+		const newXrefs = personCharacterXrefs.filter((xref) => xref.groupNumber !== runNumber)?.map((xref) => {return {...xref, groupNumber: xref.groupNumber >= runNumber ? xref.groupNumber - 1 : xref.groupNumber}});
+		setPersonCharacterXrefs(newXrefs);
+		setRaidInstance({...raidInstance, numberRuns: (raidInstance?.numberRuns ?? 1) - 1} as RaidInstance);
+	}
+
+	const copyDiscordStringToClipBoard = (run: number) => {
+		let discordString = "";
+		//Instance name
+		discordString += `${raidInstance?.raidInstanceName}\n`;
+
+		//Start time
+		discordString += moment(raidInstance?.raidStartDate).format("MM/DD/YYYY HH:mm") + " - ";
+		//End time
+		discordString += moment(raidInstance?.raidEndDate).format("MM/DD/YYYY HH:mm") + "\n";
+
+		//Characters
+		characterGrid[run].forEach((ch, index) => {
+			const person = people.find((p) => p.personId === ch?.personId);
+			if(person){
+				//Discord ID / name
+				discordString += (person.discordId && (person.discordId !== "")) ? "@" + person.discordId : person.personName;
+				discordString += ": ";
+				//Character Name
+				discordString += ch?.characterName;
+			}
+			else{
+				const classGroup = selectedClassGroups[index];
+				//Class Group
+				discordString += classGroup?.classGroupName ?? "Any Class";
+				discordString += ": ";
+				//Any
+				discordString += "None";
+			}
+			discordString += "\n";
+		});
+
+		navigator.clipboard.writeText(discordString);
+	}
+
+
+	return (
+		<tbody
+			id="instanceTableBody"
+		>
+			{
+				characterGrid.map((run, runIndex) => (
+					<tr
+						key={runIndex}
+					>
+						{
+							run.map((ch, chIndex) => (
+								<td
+									key={chIndex}
+									className="px-4 py-2 border-2 cursor-default"
+									onClick={() => onClickBodyCell(runIndex, chIndex)}
+								>
+									<div
+										className="flex flex-row justify-start flex-nowrap"
+									>
+										{
+											ch?.gameClassId &&
+											<img
+												className="mr-2 max-h-8 max-w-8"
+												src={`${import.meta.env.VITE_ICON_URL}/gameClass/id/${ch.gameClassId}`}
+											/>
+										}
+										{ch ? ch.characterName : "None"}
+									</div>
+								</td>
+							))
+						}
+						<td
+							className="pl-2"
+						>
+							<div
+								className="flex flex-row justify-center items-center cursor-pointer p-2 space-x-2"
+							>
+								<DangerButton
+									variant="ghost"
+									shape="square"
+									onClick={() => removeRun(runIndex)}
+								>
+									<BsXLg
+										size={22}
+										strokeWidth={2}
+									/>
+								</DangerButton>
+								<TertiaryButton
+									variant="ghost"
+									shape="square"
+									onClick={() => copyDiscordStringToClipBoard(runIndex)}
+								>
+									<BsDiscord
+										size={22}
+									/>
+								</TertiaryButton>
+							</div>
+						</td>
+					</tr>
+				))
+			}
+		</tbody>
+	);
+}