97 lines
2.6 KiB
TypeScript
97 lines
2.6 KiB
TypeScript
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 { Plus } from "@calcom/ui/components/icon";
|
|
|
|
export function NewScheduleButton({
|
|
name = "new-schedule",
|
|
fromEventType,
|
|
}: {
|
|
name?: string;
|
|
fromEventType?: boolean;
|
|
}) {
|
|
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}${fromEventType ? "?fromEventType=true" : ""}`);
|
|
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 (
|
|
<Dialog name={name} clearQueryParamsOnClose={["copy-schedule-id"]}>
|
|
<DialogTrigger asChild>
|
|
<Button variant="fab" data-testid={name} StartIcon={Plus}>
|
|
{t("new")}
|
|
</Button>
|
|
</DialogTrigger>
|
|
<DialogContent title={t("add_new_schedule")}>
|
|
<Form
|
|
form={form}
|
|
handleSubmit={(values) => {
|
|
createMutation.mutate(values);
|
|
}}>
|
|
<InputField
|
|
label={t("name")}
|
|
type="text"
|
|
id="name"
|
|
required
|
|
placeholder={t("default_schedule_name")}
|
|
{...register("name")}
|
|
/>
|
|
<DialogFooter>
|
|
<DialogClose />
|
|
<Button type="submit" loading={createMutation.isLoading}>
|
|
{t("continue")}
|
|
</Button>
|
|
</DialogFooter>
|
|
</Form>
|
|
</DialogContent>
|
|
</Dialog>
|
|
);
|
|
}
|