UNPKG

bananas-commerce-admin

Version:

What's this, an admin for apes?

49 lines 3.61 kB
import React, { useState } from "react"; import { Box, Typography } from "@mui/material"; import Button from "@mui/material/Button"; import Dialog from "@mui/material/Dialog"; import DialogActions from "@mui/material/DialogActions"; import DialogContent from "@mui/material/DialogContent"; import DialogContentText from "@mui/material/DialogContentText"; import DialogTitle from "@mui/material/DialogTitle"; import FormControl from "@mui/material/FormControl"; import FormControlLabel from "@mui/material/FormControlLabel"; import Radio from "@mui/material/Radio"; import RadioGroup from "@mui/material/RadioGroup"; import { useI18n } from "../../../contexts/I18nContext"; import CancelSubscriptionButton from "./CancelSubscriptionButton"; export const SubscriptionsDialogOptions = ["cancel", "end"]; export const SubscriptionsDialogContent = ({ option, setOption, }) => { const handleChange = (event) => { if (!SubscriptionsDialogOptions.includes(event.target.value)) { throw Error("Invalid option"); } setOption(event.target.value); }; return (React.createElement(FormControl, null, React.createElement(RadioGroup, { name: "radio-buttons-group", sx: { display: "flex", gap: 2 }, value: option, onChange: handleChange }, React.createElement(Box, null, React.createElement(FormControlLabel, { control: React.createElement(Radio, null), label: "Cancel", value: "cancel" }), React.createElement(Typography, { sx: { ml: 4, color: "text.secondary" } }, "Subscription will end on the end date of the subscription. End date is by default the next expiry date of an subscription. A cancelled subscription can be resumed until the End date is passed.")), React.createElement(Box, null, React.createElement(FormControlLabel, { control: React.createElement(Radio, null), label: "Immediate cancellation", value: "end" }), React.createElement(Typography, { sx: { ml: 4, color: "text.secondary" } }, "Subscription will end immediately. The subscription cannot be resumed."))))); }; export const SubscriptionsDialog = ({ open, setOpen, subscriptionId, refresh, }) => { const [option, setOption] = useState("cancel"); const { t } = useI18n(); const handleClose = () => setOpen(false); return (React.createElement(React.Fragment, null, React.createElement(Dialog, { "aria-describedby": "alert-dialog-description", "aria-labelledby": "alert-dialog-title", open: open, sx: { "& .MuiPaper-rounded": { borderRadius: 3 } }, onClose: handleClose }, React.createElement(DialogTitle, { id: "alert-dialog-title", sx: { p: 3 } }, t("Cancel subscription")), React.createElement(DialogContent, { sx: { p: 3 } }, React.createElement(DialogContentText, { id: "alert-dialog-description", pb: 2 }, "Choose how you want to cancel the subscription."), React.createElement(SubscriptionsDialogContent, { option: option, setOption: setOption })), React.createElement(DialogActions, { sx: { px: 3, py: 3 } }, React.createElement(Button, { onClick: handleClose }, "Close"), React.createElement(CancelSubscriptionButton, { handleClose: handleClose, operation: option === "end" ? "subscription.subscription:end" : "subscription.subscription:cancel", refresh: refresh, subscriptionId: subscriptionId, variant: "text" }, t("Cancel subscription")))))); }; export default SubscriptionsDialog; //# sourceMappingURL=SubscriptionsDialog.js.map