bananas-commerce-admin
Version:
What's this, an admin for apes?
63 lines • 3.7 kB
JavaScript
import React from "react";
import { useState } from "react";
import FormControlLabel from "@mui/material/FormControlLabel";
import Switch from "@mui/material/Switch";
import Typography from "@mui/material/Typography";
import Card from "../../../components/Card";
import CardActions from "../../../components/Card/CardActions";
import CardCancelButton from "../../../components/Card/CardCancelButton";
import CardContent from "../../../components/Card/CardContent";
import CardFieldNumber from "../../../components/Card/CardFieldNumber";
import CardFieldSelect from "../../../components/Card/CardFieldSelect";
import CardHeader from "../../../components/Card/CardHeader";
import CardRow from "../../../components/Card/CardRow";
import CardSaveButton from "../../../components/Card/CardSaveButton";
import LabeledValue from "../../../components/LabeledValue";
import { useApi } from "../../../contexts/ApiContext";
import { useCardContext } from "../../../contexts/CardContext";
import { useI18n } from "../../../contexts/I18nContext";
import { useUser } from "../../../contexts/UserContext";
import { hasPermission } from "../../../util/has_permission";
const RecurringSwitch = ({ isRecurring, onToggle }) => {
const { isEditing } = useCardContext();
const { t } = useI18n();
return isEditing ? (React.createElement(FormControlLabel, { control: React.createElement(Switch, { checked: isRecurring, onChange: (_, checked) => onToggle(checked) }), label: React.createElement(Typography, { color: "textSecondary", variant: "subtitle2" }, t("Recurring")), labelPlacement: "top" })) : (React.createElement(LabeledValue, { label: t("Recurring"), value: isRecurring ? "Yes" : "No" }));
};
const SubscriptionPlanCard = ({ data, refresh }) => {
const [isRecurring, setIsRecurring] = useState(Boolean(data.periodicity != null));
const api = useApi();
const { t } = useI18n();
const { user } = useUser();
const handleSave = async (formData) => {
const action = api.operations["subscription.contrib:article-plan-update"];
const response = await action.call({
params: { code: data.code },
body: formData,
});
if (response.ok) {
refresh();
return t("Plan updated successfully.");
}
else {
console.error("[ARTICLE_SUBSCRIPTION_PLAN]", response);
throw new Error("updating plan.");
}
};
return (React.createElement(Card, { isEditable: hasPermission(user, "subscription.change_subscription"), onSubmit: handleSave },
React.createElement(CardHeader, { title: "Subscription Plan" }),
React.createElement(CardContent, null,
React.createElement(CardRow, null,
React.createElement(RecurringSwitch, { isRecurring: isRecurring, onToggle: setIsRecurring }),
React.createElement(CardFieldNumber, { disabled: !isRecurring, formName: "nth", label: t("Frequency"), min: 1, required: false, value: data.nth }),
React.createElement(CardFieldSelect, { disabled: !isRecurring, formName: "periodicity", label: t("Periodicity"), options: [
{ label: "MONTH", id: "MONTH" },
{ label: "DAY", id: "DAY" },
], required: false, value: isRecurring
? { label: data.periodicity ?? "", id: data.periodicity ?? "" }
: undefined }))),
React.createElement(CardActions, null,
React.createElement(CardCancelButton, null),
React.createElement(CardSaveButton, null))));
};
export default SubscriptionPlanCard;
//# sourceMappingURL=ArticleSubscriptionPlan.js.map