diff --git a/src/components/ticketmodal.tsx b/src/components/ticketmodal.tsx index 171c779..9367f0e 100644 --- a/src/components/ticketmodal.tsx +++ b/src/components/ticketmodal.tsx @@ -1,5 +1,5 @@ import React, { useEffect, useState } from "react"; -import { useLoaderData, useNavigate } from "react-router-dom"; +import { Link, useLoaderData, useNavigate } from "react-router-dom"; import { Ticket, TicketLoader } from "../types/ticket"; import { LinkColor } from "./link"; import { NameExpand } from "./nameExpand"; @@ -15,18 +15,20 @@ export const TicketModal: React.FC = ( ) => { const { tickets, round } = props; - const [ticket, setTicket] = useState(); + const [ticket, setTicket] = useState< + { ticketNum: number; round?: number } | undefined + >(); const { ticketNum } = useLoaderData() as TicketLoader; useEffect(() => { if (ticketNum && !ticket) { - setTicket(parseInt(ticketNum)); + setTicket({ ticketNum: parseInt(ticketNum) }); } - if (!ticketNum && ticket) { + if (!ticketNum && ticket && round) { setTicket(undefined); } - }, [ticket, ticketNum, setTicket]); + }, [ticket, ticketNum, setTicket, round]); const nav = useNavigate(); @@ -54,7 +56,13 @@ export const TicketModal: React.FC = (
{ - nav(`/ticket/${ticket.roundId}/${ticket.ticketId}`); + if (round) nav(`/ticket/${ticket.roundId}/${ticket.ticketId}`); + else { + setTicket({ + ticketNum: ticket.ticketId, + round: ticket.roundId, + }); + } }} > {!round && `#${ticket.roundId} `}Ticket #{ticket.ticketId} @@ -79,24 +87,40 @@ export const TicketModal: React.FC = ( { - nav("..", { relative: "path" }); + if (round) nav("..", { relative: "path" }); + else setTicket(undefined); }} className="max-h-[80%]" > - + )}
); }; -const TicketDetail = (props: { tickets: Ticket[]; ticket: number }) => { - const { tickets, ticket } = props; +const TicketDetail = (props: { + tickets: Ticket[]; + ticket: number; + round?: number; +}) => { + const { tickets, ticket, round } = props; - const relevantTickets = tickets.filter((tick) => tick.ticketId == ticket); + const relevantTickets = tickets.filter( + (tick) => tick.ticketId == ticket && round && tick.roundId == round + ); return (
+
+ + Round {round} + +
{relevantTickets.map((ticket) => (