Revamp bookings page

This commit is contained in:
Bailey Pumfleet 2021-06-30 15:14:10 +01:00
parent 3aa1e1716d
commit 80898ea706

View file

@ -2,6 +2,7 @@ import Head from "next/head";
import prisma from "../../lib/prisma"; import prisma from "../../lib/prisma";
import { getSession, useSession } from "next-auth/client"; import { getSession, useSession } from "next-auth/client";
import Shell from "../../components/Shell"; import Shell from "../../components/Shell";
import dayjs from "dayjs";
export default function Bookings({ bookings }) { export default function Bookings({ bookings }) {
const [session, loading] = useSession(); const [session, loading] = useSession();
@ -27,43 +28,39 @@ export default function Bookings({ bookings }) {
<th <th
scope="col" scope="col"
className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"> className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
Title Person
</th> </th>
<th <th
scope="col" scope="col"
className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"> className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
Description Event
</th> </th>
<th {/* <th
scope="col" scope="col"
className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider"> className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
Name Date
</th> </th> */}
<th
scope="col"
className="px-6 py-3 text-left text-xs font-medium text-gray-500 uppercase tracking-wider">
Email
</th>
<th scope="col" className="relative px-6 py-3"> <th scope="col" className="relative px-6 py-3">
<span className="sr-only">Edit</span> <span className="sr-only">Actions</span>
</th> </th>
</tr> </tr>
</thead> </thead>
<tbody className="bg-white divide-y divide-gray-200"> <tbody className="bg-white divide-y divide-gray-200">
{bookings.map((booking) => ( {bookings.map((booking) => (
<tr key={booking.uid}> <tr key={booking.id}>
<td className="px-6 py-4 whitespace-nowrap text-sm font-medium text-gray-900"> <td className="px-6 py-4 whitespace-nowrap">
{booking.title} <div className="text-sm font-medium text-gray-900">{booking.attendees[0].name}</div>
<div className="text-sm text-gray-500">{booking.attendees[0].email}</div>
</td> </td>
<td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500"> <td className="px-6 py-4 whitespace-nowrap">
{booking.description} <div className="text-sm text-gray-900">{booking.title}</div>
</td> <div className="text-sm text-gray-500">{booking.description}</div>
<td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
{booking.attendees[0].name}
</td>
<td className="px-6 py-4 whitespace-nowrap text-sm text-gray-500">
{booking.attendees[0].email}
</td> </td>
{/* <td className="px-6 py-4 whitespace-nowrap">
<div className="text-sm text-gray-500">
{dayjs(booking.startTime).format("D MMMM YYYY HH:mm")}
</div>
</td> */}
<td className="px-6 py-4 whitespace-nowrap text-right text-sm font-medium"> <td className="px-6 py-4 whitespace-nowrap text-right text-sm font-medium">
<a <a
href={window.location.href + "/../reschedule/" + booking.uid} href={window.location.href + "/../reschedule/" + booking.uid}
@ -115,6 +112,9 @@ export async function getServerSideProps(context) {
description: true, description: true,
attendees: true, attendees: true,
}, },
orderBy: {
startTime: "desc",
},
}); });
return { props: { bookings } }; return { props: { bookings } };