@churchapps/apphelper-donations
Version:
Donation components for ChurchApps AppHelper
27 lines • 4.07 kB
JavaScript
"use client";
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
import { useState } from "react";
import { DateHelper, CurrencyHelper } from "@churchapps/helpers";
import { Locale } from "../helpers";
import { Table, TableBody, TableRow, TableCell, Dialog, DialogTitle, DialogContent, DialogActions, Button } from "@mui/material";
export const DonationPreviewModal = (props) => {
const donationType = { once: "One-time Donation", recurring: "Recurring Donation" };
const [isLoading, setLoading] = useState(false);
const handleClick = () => {
setLoading(true);
let message = "Thank you for your donation.";
if (props.donationType === "recurring")
message = "Recurring donation created. " + message;
props.handleDonate(message);
};
const formatInterval = () => {
const count = props.donation.interval.interval_count;
const interval = props.donation.interval.interval;
const result = `${count} ${interval}`;
return count > 1 ? result + "s" : result;
};
return (_jsxs(Dialog, { open: props.show, onClose: props.onHide, "aria-labelledby": "donation-preview-title", "aria-describedby": "donation-preview-content", children: [_jsx(DialogTitle, { id: "donation-preview-title", children: "Donation Preview" }), _jsx(DialogContent, { id: "donation-preview-content", children: _jsx(Table, { children: _jsxs(TableBody, { children: [_jsxs(TableRow, { children: [_jsxs(TableCell, { children: [Locale.label("person.name"), ":"] }), _jsx(TableCell, { children: props.donation.person.name })] }), _jsxs(TableRow, { children: [_jsxs(TableCell, { children: [Locale.label("donation.preview.method"), ":"] }), _jsx(TableCell, { className: "capitalize", children: props.paymentMethodName })] }), _jsxs(TableRow, { children: [_jsxs(TableCell, { children: [Locale.label("donation.preview.type"), ":"] }), _jsx(TableCell, { children: donationType[props.donationType] })] }), props.donationType === "once"
&& _jsxs(TableRow, { children: [_jsxs(TableCell, { children: [Locale.label("donation.preview.date"), ":"] }), _jsx(TableCell, { children: DateHelper.formatHtml5Date(new Date(props.donation.billing_cycle_anchor)) })] }), _jsxs(TableRow, { children: [_jsxs(TableCell, { children: [Locale.label("donation.preview.weekly"), ":"] }), _jsx(TableCell, { children: props.donation.notes })] }), props.donationType === "recurring"
&& _jsxs(_Fragment, { children: [_jsxs(TableRow, { children: [_jsxs(TableCell, { children: [Locale.label("donation.preview.startingOn"), ":"] }), _jsx(TableCell, { children: DateHelper.formatHtml5Date(new Date(props.donation.billing_cycle_anchor)) })] }), _jsxs(TableRow, { children: [_jsxs(TableCell, { children: [Locale.label("donation.preview.every"), ":"] }), _jsx(TableCell, { className: "capitalize", children: formatInterval() })] })] }), _jsxs(TableRow, { children: [_jsxs(TableCell, { children: [Locale.label("donation.preview.funds"), ":"] }), _jsx(TableCell, { children: props.donation.funds.map((fund, i) => _jsxs("p", { children: [CurrencyHelper.formatCurrency(fund.amount), " - ", fund.name] }, i)) })] }), props.payFee > 0 && _jsxs(TableRow, { children: [_jsxs(TableCell, { children: [Locale.label("donation.preview.fee"), ":"] }), _jsx(TableCell, { children: CurrencyHelper.formatCurrency(props.payFee) })] }), _jsxs(TableRow, { children: [_jsxs(TableCell, { children: [Locale.label("donation.preview.total"), ":"] }), _jsx(TableCell, { children: _jsx("h4", { children: CurrencyHelper.formatCurrency(props.donation.amount) }) })] })] }) }) }), _jsxs(DialogActions, { children: [_jsx(Button, { onClick: props.onHide, variant: "outlined", "aria-label": "cancel-button", children: Locale.label("donation.common.cancel") }), _jsx(Button, { onClick: handleClick, variant: "contained", "aria-label": "donate-button", disabled: isLoading, children: Locale.label("donation.preview.donate") })] })] }));
};
//# sourceMappingURL=DonationPreviewModal.js.map