File size: 2,350 Bytes
f909d7c |
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 |
import React from "react";
import { Modal, Group, Button, Divider, ModalProps, Text, Image, Anchor } from "@mantine/core";
import { toast } from "react-hot-toast";
import { supabase } from "src/lib/api/supabase";
import useModal from "src/store/useModal";
export const CancelPremiumModal: React.FC<ModalProps> = ({ opened, onClose }) => {
const [cancelling, setCancelling] = React.useState(false);
const showFeedback = useModal(state => state.setVisible("review"));
const cancelSub = async () => {
try {
setCancelling(true);
const { data: user } = await supabase.auth.getSession();
if (user) {
const { error } = await supabase.functions.invoke("lemonsqueezy", {
method: "DELETE",
body: {
jwt: user.session?.access_token,
},
});
if (error) {
return toast.error(
"An error occured while cancelling subscription, please contact: [email protected]"
);
}
toast.success("Cancelled premium plan!");
showFeedback(true);
} else {
toast.error("Couldn't fetch user details, please contact: [email protected]");
}
toast.success("Cancelled premium plan!");
onClose();
} catch (err) {
console.error(err);
} finally {
setCancelling(false);
}
};
return (
<Modal title="CANCEL PREMIUM?" opened={opened} onClose={onClose} centered>
<Image py="xs" src="assets/taken.svg" mx="auto" w={200} alt="taken" />
<Text fz="sm" pb="md">
Cancellation will take effect at the end of your current billing period.
<br />
<br />
You can restart your subscription anytime.
<br />
<Anchor fz="xs" target="_blank" href="https://patreon.com/herowand">
Click here to cancel if you are Patreon member
</Anchor>
<Text size="xs" c="dimmed" mt="lg">
If you have problems with cancelling plan please contact: [email protected]
</Text>
</Text>
<Divider py="xs" />
<Group justify="right">
<Button color="dark" variant="subtle" onClick={onClose}>
Cancel
</Button>
<Button onClick={cancelSub} loading={cancelling} color="red">
QUIT SUBSCRIPTION
</Button>
</Group>
</Modal>
);
};
|