Pass attendees to BookingListItem

SS/confirm-attendee
Joe Au-Yeung 2022-04-28 09:41:16 -04:00
parent 8240ca033c
commit b8be4899ee
3 changed files with 19 additions and 6 deletions

View File

@ -1,6 +1,6 @@
import { BanIcon, CheckIcon, ClockIcon, XIcon, PencilAltIcon } from "@heroicons/react/outline";
import { PaperAirplaneIcon } from "@heroicons/react/outline";
import { BookingStatus } from "@prisma/client";
import { BookingStatus, Attendee } from "@prisma/client";
import dayjs from "dayjs";
import { useState } from "react";
import { useMutation } from "react-query";
@ -20,7 +20,12 @@ import TableActions, { ActionType } from "@components/ui/TableActions";
type BookingItem = inferQueryOutput<"viewer.bookings">["bookings"][number];
function BookingListItem(booking: BookingItem) {
type BookingListItemProps = {
booking: BookingItem;
attendee?: Attendee;
};
function BookingListItem<BookingListItemProps>(booking: BookingItem, attendee: Attendee) {
// Get user so we can determine 12/24 hour format preferences
const query = useMeQuery();
const user = query.data;

View File

@ -562,7 +562,7 @@ export default async function handler(req: NextApiRequest, res: NextApiResponse)
name: invitee[0].name,
timeZone: invitee[0].timeZone,
locale: invitee[0].language.locale,
status: eventType.requiresConfirmation && eventType.price ? "pending" : "accepted",
status: eventType.requiresConfirmation && eventType.price ? "PENDING" : "ACCEPTED",
},
},
},

View File

@ -65,9 +65,17 @@ export default function Bookings() {
<tbody className="divide-y divide-gray-200 bg-white" data-testid="bookings">
{query.data.pages.map((page, index) => (
<Fragment key={index}>
{page.bookings.map((booking) => (
<BookingListItem key={booking.id} {...booking} />
))}
{page.bookings.map((booking) => {
if (booking.attendees.some((attendee) => attendee.status === "PENDING")) {
booking.attendees.map((attendee) => {
return (
<BookingListItem key={booking.id} {...booking} attendee={attendee} />
);
});
} else {
return <BookingListItem key={booking.id} {...booking} />;
}
})}
</Fragment>
))}
</tbody>