134 lines
3.8 KiB
TypeScript
134 lines
3.8 KiB
TypeScript
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
|
|
id={`removeRun${runIndex}`}
|
|
variant="ghost"
|
|
shape="square"
|
|
onClick={() => removeRun(runIndex)}
|
|
>
|
|
<BsXLg
|
|
size={22}
|
|
strokeWidth={2}
|
|
/>
|
|
</DangerButton>
|
|
<TertiaryButton
|
|
id={`copyDiscordString${runIndex}`}
|
|
variant="ghost"
|
|
shape="square"
|
|
onClick={() => copyDiscordStringToClipBoard(runIndex)}
|
|
>
|
|
<BsDiscord
|
|
size={22}
|
|
/>
|
|
</TertiaryButton>
|
|
</div>
|
|
</td>
|
|
</tr>
|
|
))
|
|
}
|
|
</tbody>
|
|
);
|
|
} |