import Head from "next/head";
import Link from "next/link";
import prisma, { whereAndSelect } from "../lib/prisma";
import { useEffect, useState } from "react";
import { useRouter } from "next/router";
import { CheckIcon } from "@heroicons/react/outline";
import { CalendarIcon, ClockIcon, LocationMarkerIcon } from "@heroicons/react/solid";
import dayjs from "dayjs";
import utc from "dayjs/plugin/utc";
import toArray from "dayjs/plugin/toArray";
import timezone from "dayjs/plugin/timezone";
import { createEvent } from "ics";
import { getEventName } from "../lib/event";
import Theme from "@components/Theme";
dayjs.extend(utc);
dayjs.extend(toArray);
dayjs.extend(timezone);
export default function Success(props) {
const router = useRouter();
const { location, name } = router.query;
const [is24h, setIs24h] = useState(false);
const [date, setDate] = useState(dayjs.utc(router.query.date));
const { isReady } = Theme(props.user.theme);
useEffect(() => {
setDate(date.tz(localStorage.getItem("timeOption.preferredTimeZone") || dayjs.tz.guess()));
setIs24h(!!localStorage.getItem("timeOption.is24hClock"));
}, []);
const eventName = getEventName(name, props.eventType.title, props.eventType.eventName);
function eventLink(): string {
const optional = {};
if (location) {
optional["location"] = location;
}
const event = createEvent({
start: date
.utc()
.toArray()
.slice(0, 6)
.map((v, i) => (i === 1 ? v + 1 : v)),
startInputType: "utc",
title: eventName,
description: props.eventType.description,
duration: { minutes: props.eventType.length },
...optional,
});
if (event.error) {
throw event.error;
}
return encodeURIComponent(event.value);
}
return (
isReady && (
Booking Confirmed | {eventName} | Calendso
Booking confirmed
You are scheduled in with {props.user.name || props.user.username}.
{eventName}
{props.eventType.length} minutes
{location && (
{location}
)}
{date.format((is24h ? "H:mm" : "h:mma") + ", dddd DD MMMM YYYY")}
{!props.user.hideBranding && (
)}
)
);
}
export async function getServerSideProps(context) {
const user = context.query.user
? await whereAndSelect(
prisma.user.findFirst,
{
username: context.query.user,
},
["username", "name", "bio", "avatar", "eventTypes", "hideBranding", "theme"]
)
: null;
if (!user) {
return {
notFound: true,
};
}
const eventType = await whereAndSelect(
prisma.eventType.findUnique,
{
id: parseInt(context.query.type),
},
["id", "title", "description", "length", "eventName"]
);
return {
props: {
user,
eventType,
},
};
}