import { useRouter } from "next/router"; import { useForm } from "react-hook-form"; import { useLocale } from "@calcom/lib/hooks/useLocale"; import { HttpError } from "@calcom/lib/http-error"; import { trpc } from "@calcom/trpc/react"; import { Button, Dialog, DialogClose, DialogContent, DialogFooter, DialogTrigger, Form, InputField, showToast, } from "@calcom/ui"; import { FiPlus } from "@calcom/ui/components/icon"; export function NewScheduleButton({ name = "new-schedule" }: { name?: string }) { const router = useRouter(); const { t } = useLocale(); const form = useForm<{ name: string; }>(); const { register } = form; const utils = trpc.useContext(); const createMutation = trpc.viewer.availability.schedule.create.useMutation({ onSuccess: async ({ schedule }) => { await router.push("/availability/" + schedule.id); showToast(t("schedule_created_successfully", { scheduleName: schedule.name }), "success"); utils.viewer.availability.list.setData(undefined, (data) => { const newSchedule = { ...schedule, isDefault: false, availability: [] }; if (!data) return { schedules: [newSchedule], }; return { ...data, schedules: [...data.schedules, newSchedule], }; }); }, onError: (err) => { if (err instanceof HttpError) { const message = `${err.statusCode}: ${err.message}`; showToast(message, "error"); } if (err.data?.code === "UNAUTHORIZED") { const message = `${err.data.code}: You are not able to create this event`; showToast(message, "error"); } }, }); return (
{ createMutation.mutate(values); }}>
); }