import {useState} from 'react'; import Head from 'next/head'; import prisma from '../../lib/prisma'; import {useRouter} from 'next/router'; import dayjs from 'dayjs'; import {CalendarIcon, ClockIcon, XIcon} from '@heroicons/react/solid'; import isSameOrBefore from 'dayjs/plugin/isSameOrBefore'; import isBetween from 'dayjs/plugin/isBetween'; import utc from 'dayjs/plugin/utc'; import timezone from 'dayjs/plugin/timezone'; import {collectPageParameters, telemetryEventTypes, useTelemetry} from "../../lib/telemetry"; dayjs.extend(isSameOrBefore); dayjs.extend(isBetween); dayjs.extend(utc); dayjs.extend(timezone); function classNames(...classes) { return classes.filter(Boolean).join(' ') } export default function Type(props) { // Get router variables const router = useRouter(); const { uid } = router.query; const [is24h, setIs24h] = useState(false); const [loading, setLoading] = useState(false); const [error, setError] = useState(null); const telemetry = useTelemetry(); const cancellationHandler = async (event) => { setLoading(true); let payload = { uid: uid }; telemetry.withJitsu(jitsu => jitsu.track(telemetryEventTypes.bookingCancelled, collectPageParameters())); const res = await fetch( '/api/cancel', { body: JSON.stringify(payload), headers: { 'Content-Type': 'application/json' }, method: 'POST' } ); if(res.status >= 200 && res.status < 300) { router.push('/cancel/success?user=' + props.user.username + '&title=' + props.eventType.title); } else { setLoading(false); setError("An error with status code " + res.status + " occurred. Please try again later."); } } return (
Cancel {props.booking.title} | {props.user.name || props.user.username} | Calendso
); } export async function getServerSideProps(context) { const booking = await prisma.booking.findFirst({ where: { uid: context.query.uid, }, select: { id: true, title: true, description: true, startTime: true, endTime: true, attendees: true, eventType: true, user: { select: { id: true, username: true, name: true, } } } }); // Workaround since Next.js has problems serializing date objects (see https://github.com/vercel/next.js/issues/11993) const bookingObj = Object.assign({}, booking, { startTime: booking.startTime.toString(), endTime: booking.endTime.toString() }); return { props: { user: booking.user, eventType: booking.eventType, booking: bookingObj }, } }