2022-04-15 02:24:27 +00:00
|
|
|
import { useState } from "react";
|
|
|
|
|
|
|
|
import Button from "@calcom/ui/Button";
|
|
|
|
|
|
|
|
import { ConfirmDialog } from "./confirmDialog";
|
|
|
|
|
|
|
|
interface IWipeMyCalActionButtonProps {
|
|
|
|
trpc: any;
|
2022-04-20 21:37:25 +00:00
|
|
|
bookingsEmpty: boolean;
|
2022-05-05 21:16:25 +00:00
|
|
|
bookingStatus: "upcoming" | "recurring" | "past" | "cancelled";
|
2022-04-15 02:24:27 +00:00
|
|
|
}
|
|
|
|
|
|
|
|
const WipeMyCalActionButton = (props: IWipeMyCalActionButtonProps) => {
|
2022-04-20 21:37:25 +00:00
|
|
|
const { trpc, bookingsEmpty, bookingStatus } = props;
|
2022-04-15 02:24:27 +00:00
|
|
|
const [openDialog, setOpenDialog] = useState(false);
|
2022-06-01 17:24:41 +00:00
|
|
|
const { isSuccess, isLoading, data } = trpc.useQuery([
|
|
|
|
"viewer.integrations",
|
|
|
|
{ variant: "other", onlyInstalled: undefined },
|
|
|
|
]);
|
2022-04-15 02:24:27 +00:00
|
|
|
|
2022-04-20 21:37:25 +00:00
|
|
|
if (bookingStatus !== "upcoming" || bookingsEmpty) {
|
|
|
|
return <></>;
|
|
|
|
}
|
2022-06-01 17:24:41 +00:00
|
|
|
const wipeMyCalCredentials: { credentialIds: number[] } = data?.items.find(
|
2022-04-20 21:37:25 +00:00
|
|
|
(item: { type: string }) => item.type === "wipemycal_other"
|
|
|
|
);
|
|
|
|
|
|
|
|
const [credentialId] = wipeMyCalCredentials?.credentialIds || [false];
|
|
|
|
|
2022-04-15 02:24:27 +00:00
|
|
|
return (
|
|
|
|
<div>
|
2022-04-20 21:37:25 +00:00
|
|
|
{data && isSuccess && !isLoading && credentialId && (
|
|
|
|
<>
|
|
|
|
<ConfirmDialog trpc={trpc} isOpenDialog={openDialog} setIsOpenDialog={setOpenDialog} />
|
2022-06-10 19:16:10 +00:00
|
|
|
<Button onClick={() => setOpenDialog(true)} data-testid="wipe-today-button">
|
|
|
|
Wipe Today
|
|
|
|
</Button>
|
2022-04-20 21:37:25 +00:00
|
|
|
</>
|
|
|
|
)}
|
2022-04-15 02:24:27 +00:00
|
|
|
</div>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
export { WipeMyCalActionButton };
|