@churchapps/apphelper-donations
Version:
Donation components for ChurchApps AppHelper
60 lines • 4.72 kB
JavaScript
"use client";
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useState, useEffect } from "react";
import { ApiHelper } from "@churchapps/helpers";
import { Locale } from "../helpers";
import { InputBox } from "@churchapps/apphelper";
import { FormControl, Grid, InputLabel, MenuItem, Select } from "@mui/material";
import { DonationHelper } from "../helpers";
;
export const RecurringDonationsEdit = (props) => {
const [editSubscription, setEditSubscription] = useState(props.editSubscription);
const [interval, setInterval] = useState("one_month");
const handleCancel = () => { props.subscriptionUpdated(); };
const handleSave = () => {
const sub = { ...editSubscription };
const pmFound = props.paymentMethods.find((pm) => pm.id === sub.id);
if (!pmFound) {
const pm = props.paymentMethods[0];
sub.default_payment_method = pm.type === "card" ? pm.id : null;
sub.default_source = pm.type === "bank" ? pm.id : null;
}
ApiHelper.post("/subscriptions", [sub], "GivingApi").then(() => props.subscriptionUpdated(Locale.label("donation.donationForm.recurringUpdated")));
};
const handleDelete = () => {
const conf = window.confirm(Locale.label("donation.donationForm.confirmDelete"));
if (!conf)
return;
const promises = [];
promises.push(ApiHelper.delete("/subscriptions/" + props.editSubscription.id, "GivingApi"));
promises.push(ApiHelper.delete("/subscriptionfunds/subscription/" + props.editSubscription.id, "GivingApi"));
Promise.all(promises).then(() => props.subscriptionUpdated(Locale.label("donation.donationForm.cancelled")));
};
const handleChange = (e) => {
const sub = { ...editSubscription };
const value = e.target.value;
switch (e.target.name) {
case "method":
const pm = props.paymentMethods.find((pm) => pm.id === value);
sub.default_payment_method = pm.type === "card" ? value : null;
sub.default_source = pm.type === "bank" ? value : null;
break;
case "interval":
setInterval(value);
const inter = DonationHelper.getInterval(value);
sub.plan.interval_count = inter.interval_count;
sub.plan.interval = inter.interval;
break;
}
setEditSubscription(sub);
};
const getFields = () => (_jsx(_Fragment, { children: _jsxs(Grid, { container: true, spacing: 3, children: [_jsx(Grid, { size: { xs: 12, md: 6 }, children: _jsxs(FormControl, { fullWidth: true, children: [_jsx(InputLabel, { children: Locale.label("donation.donationForm.method") }), _jsx(Select, { label: Locale.label("donation.donationForm.method"), name: "method", "aria-label": "method", value: editSubscription.default_payment_method || editSubscription.default_source, className: "capitalize", onChange: handleChange, children: props.paymentMethods.map((paymentMethod, i) => _jsxs(MenuItem, { value: paymentMethod.id, children: [paymentMethod.name, " ****", paymentMethod.last4] }, i)) })] }) }), _jsx(Grid, { size: { xs: 12, md: 6 }, children: _jsxs(FormControl, { fullWidth: true, children: [_jsx(InputLabel, { children: Locale.label("donation.donationForm.frequency") }), _jsxs(Select, { label: Locale.label("donation.donationForm.frequency"), name: "interval", "aria-label": "interval", value: interval, onChange: handleChange, children: [_jsx(MenuItem, { value: "one_week", children: Locale.label("donation.donationForm.weekly") }), _jsx(MenuItem, { value: "two_week", children: Locale.label("donation.donationForm.biWeekly") }), _jsx(MenuItem, { value: "one_month", children: Locale.label("donation.donationForm.monthly") }), _jsx(MenuItem, { value: "three_month", children: Locale.label("donation.donationForm.quarterly") }), _jsx(MenuItem, { value: "one_year", children: Locale.label("donation.donationForm.annually") })] })] }) })] }) }));
useEffect(() => {
if (props.editSubscription) {
const keyName = DonationHelper.getIntervalKeyName(props.editSubscription.plan.interval_count, props.editSubscription.plan.interval);
setInterval(keyName);
}
}, [props.editSubscription]);
return (_jsx(InputBox, { "aria-label": "person-details-box", headerIcon: "person", headerText: Locale.label("donation.donationForm.editRecurring"), ariaLabelSave: "save-button", ariaLabelDelete: "delete-button", cancelFunction: handleCancel, deleteFunction: handleDelete, saveFunction: handleSave, children: getFields() }));
};
//# sourceMappingURL=RecurringDonationsEdit.js.map