70 lines
2.0 KiB
TypeScript
70 lines
2.0 KiB
TypeScript
|
import { useState } from "react";
|
||
|
import { useMutation } from "react-query";
|
||
|
|
||
|
import showToast from "@calcom/lib/notification";
|
||
|
import { ButtonBaseProps } from "@calcom/ui/Button";
|
||
|
import { Dialog } from "@calcom/ui/Dialog";
|
||
|
|
||
|
import DeleteStripeDialogContent from "@components/dialog/DeleteStripeDialogContent";
|
||
|
|
||
|
export default function DisconnectiStripeIntegration(props: {
|
||
|
/** Integration credential id */
|
||
|
id: number;
|
||
|
render: (renderProps: ButtonBaseProps) => JSX.Element;
|
||
|
onOpenChange: (isOpen: boolean) => unknown | Promise<unknown>;
|
||
|
}) {
|
||
|
const [modalOpen, setModalOpen] = useState(false);
|
||
|
const mutation = useMutation(
|
||
|
async (action: string) => {
|
||
|
const res = await fetch("/api/integrations", {
|
||
|
method: "DELETE",
|
||
|
body: JSON.stringify({ id: props.id, action }),
|
||
|
headers: {
|
||
|
"Content-Type": "application/json",
|
||
|
},
|
||
|
});
|
||
|
if (!res.ok) {
|
||
|
throw new Error("Something went wrong");
|
||
|
}
|
||
|
return res.json();
|
||
|
},
|
||
|
{
|
||
|
async onSettled() {
|
||
|
await props.onOpenChange(modalOpen);
|
||
|
},
|
||
|
onSuccess(data) {
|
||
|
showToast(data.message, "success");
|
||
|
setModalOpen(false);
|
||
|
},
|
||
|
}
|
||
|
);
|
||
|
return (
|
||
|
<>
|
||
|
<Dialog open={modalOpen} onOpenChange={setModalOpen}>
|
||
|
<DeleteStripeDialogContent
|
||
|
variety="warning"
|
||
|
title="Disconnect Stripe Integration"
|
||
|
cancelAllBookingsBtnText="Cancel all bookings"
|
||
|
removeBtnText="Remove payment"
|
||
|
cancelBtnText="Cancel"
|
||
|
onConfirm={() => {
|
||
|
mutation.mutate("cancel");
|
||
|
}}
|
||
|
onRemove={() => {
|
||
|
mutation.mutate("remove");
|
||
|
}}>
|
||
|
If you have unpaid and unconfirmed bookings, you must choose to cancel them or remove the required
|
||
|
payment field.
|
||
|
</DeleteStripeDialogContent>
|
||
|
</Dialog>
|
||
|
{props.render({
|
||
|
onClick() {
|
||
|
setModalOpen(true);
|
||
|
},
|
||
|
disabled: modalOpen,
|
||
|
loading: mutation.isLoading,
|
||
|
})}
|
||
|
</>
|
||
|
);
|
||
|
}
|