@churchapps/apphelper 0.4.8 → 0.4.10

package/src/donationComponents/components/FundDonations.tsx

@@ -0,0 +1,44 @@
+"use client";
+
+import React from "react";
+import { FundDonation } from ".";
+import { FundDonationInterface, FundInterface } from "@churchapps/helpers";
+import { Locale } from "../../helpers";
+
+interface Props { fundDonations: FundDonationInterface[], funds: FundInterface[], params?: any, updatedFunction: (fundDonations: FundDonationInterface[]) => void }
+
+export const FundDonations: React.FC<Props> = (props) => {
+  const handleUpdated = (fundDonation: FundDonationInterface, index: number) => {
+    const fundDonations = [...props.fundDonations];
+    fundDonations[index] = fundDonation;
+    props.updatedFunction(fundDonations);
+  };
+
+  const addRow = (e: React.MouseEvent) => {
+    e.preventDefault();
+    const fundDonations = [...props.fundDonations];
+    const fd = { fundId: props.funds[0].id } as FundDonationInterface;
+    fundDonations.push(fd);
+    props.updatedFunction(fundDonations);
+  };
+
+  const getRows = () => {
+    const result = [];
+    for (let i = 0; i < props.fundDonations.length; i++) {
+      const fd = props.fundDonations[i];
+      result.push(<FundDonation fundDonation={fd} funds={props.funds} updatedFunction={handleUpdated} params={props?.params} key={i} index={i} />);
+    }
+
+    return result;
+  };
+
+  return (
+    <>
+      {getRows()}
+      {(!props?.params?.fundId || props?.params?.fundId === "") &&
+        <a href="about:blank" aria-label="add-fund-donation" className="text-decoration" style={{ display: "block", marginBottom: "15px" }} onClick={addRow}>{Locale.label("donation.fundDonations.addMore")}</a>
+      }
+    </>
+  );
+};
+

package/src/donationComponents/components/PaymentMethods.tsx

@@ -0,0 +1,133 @@
+"use client";
+
+import React from "react";
+import type { Stripe } from "@stripe/stripe-js";
+import { Elements } from "@stripe/react-stripe-js";
+import { CardForm, BankForm } from ".";
+import { DisplayBox, Loading } from "../../components";
+import { ApiHelper, Locale, UserHelper } from "../../helpers";
+import { PersonInterface, StripePaymentMethod, Permissions } from "@churchapps/helpers";
+import {
+ Icon, Table, TableBody, TableCell, TableRow, IconButton, Menu, MenuItem 
+} from "@mui/material";
+
+interface Props { person: PersonInterface, customerId: string, paymentMethods: StripePaymentMethod[], stripePromise: Promise<Stripe>, appName: string, dataUpdate: (message?: string) => void }
+
+export const PaymentMethods: React.FC<Props> = (props) => {
+  const [editPaymentMethod, setEditPaymentMethod] = React.useState<StripePaymentMethod>(new StripePaymentMethod());
+  const [mode, setMode] = React.useState("display");
+  const [verify, setVerify] = React.useState<boolean>(false);
+
+  const handleEdit = (pm?: StripePaymentMethod, verifyAccount?: boolean) => (e: React.MouseEvent) => {
+    e.preventDefault();
+    setEditPaymentMethod(pm);
+    setVerify(verifyAccount);
+    setMode("edit");
+  };
+
+  const handleDelete = async () => {
+    const confirmed = window.confirm(Locale.label("donation.paymentMethods.confirmDelete"));
+    if (confirmed) {
+      ApiHelper.delete("/paymentmethods/" + editPaymentMethod.id + "/" + props.customerId, "GivingApi").then(() => {
+        setMode("display");
+        props.dataUpdate(Locale.label("donation.paymentMethods.deleted"));
+      });
+    }
+  };
+
+  const MenuIcon = () => {
+    const [anchorEl, setAnchorEl] = React.useState(null);
+    const open = Boolean(anchorEl);
+    const handleClick = (e: React.MouseEvent) => {
+      setAnchorEl(e.currentTarget);
+    };
+    const handleClose = () => {
+      setAnchorEl(null);
+    };
+    return (
+      <>
+        <IconButton
+          aria-label="add-button"
+          id="addBtnGroup"
+          aria-controls={open ? "add-menu" : undefined}
+          aria-expanded={open ? "true" : undefined}
+          aria-haspopup="true"
+          onClick={handleClick}
+        >
+          <Icon color="primary">add</Icon>
+        </IconButton>
+        <Menu
+          id="add-menu"
+          MenuListProps={{ "aria-labelledby": "addBtnGroup" }}
+          anchorEl={anchorEl}
+          open={open}
+          onClose={handleClose}
+        >
+          <MenuItem aria-label="add-card" onClick={handleEdit(new StripePaymentMethod({ type: "card" }))}>
+            <Icon sx={{ mr: "3px" }}>credit_card</Icon> {Locale.label("donation.paymentMethods.addCard")}
+          </MenuItem>
+          <MenuItem aria-label="add-bank" onClick={handleEdit(new StripePaymentMethod({ type: "bank" }))}>
+            <Icon sx={{ mr: "3px" }}>account_balance</Icon> {Locale.label("donation.paymentMethods.addBank")}
+          </MenuItem>
+        </Menu>
+      </>
+    );
+  };
+
+  const getNewContent = () => {
+    if (!UserHelper.checkAccess(Permissions.givingApi.settings.edit) && props.appName !== "B1App") return null;
+    return <MenuIcon />;
+  };
+
+  const getEditOptions = (pm: StripePaymentMethod) => {
+    if (!UserHelper.checkAccess(Permissions.givingApi.settings.edit) && props.appName !== "B1App") return null;
+    return <a aria-label="edit-button" onClick={handleEdit(pm)} href="about:blank"><Icon>edit</Icon></a>;
+  };
+
+  const getPMIcon = (type: string) => (type === "card" ? <Icon>credit_card</Icon> : <Icon>account_balance</Icon>);
+
+  const getPaymentRows = () => {
+    const rows: React.ReactElement[] = [];
+
+    props.paymentMethods.forEach((method: StripePaymentMethod) => {
+      rows.push(<TableRow key={method.id}>
+          <TableCell className="capitalize">{getPMIcon(method.type)} {method.name + " ****" + method.last4}</TableCell>
+          <TableCell>{method?.status === "new" && <a href="about:blank" aria-label="verify-account" onClick={handleEdit(method, true)}>{Locale.label("donation.paymentMethods.verify")}</a>}</TableCell>
+          <TableCell align="right">{getEditOptions(method)}</TableCell>
+        </TableRow>);
+    });
+    return rows;
+  };
+
+  const PaymentMethodsTable = () => {
+    if (!props.paymentMethods) return <Loading></Loading>;
+    if (props.paymentMethods.length) {
+      return (
+        <Table>
+          <TableBody>
+            {getPaymentRows()}
+          </TableBody>
+        </Table>
+      );
+    } else return <div>{Locale.label("donation.paymentMethods.noMethod")}</div>;
+  };
+
+  const EditForm = () => (
+    <Elements stripe={props.stripePromise}>
+      {editPaymentMethod.type === "card" && <CardForm card={editPaymentMethod} customerId={props.customerId} person={props.person} setMode={setMode} deletePayment={handleDelete} updateList={(message) => { props.dataUpdate(message); }} />}
+      {editPaymentMethod.type === "bank" && <BankForm bank={editPaymentMethod} showVerifyForm={verify} customerId={props.customerId} person={props.person} setMode={setMode} deletePayment={handleDelete} updateList={(message) => { props.dataUpdate(message); }} />}
+    </Elements>
+  );
+
+  const PaymentMethods = () => {
+    if (mode === "display") {
+      return (
+        <DisplayBox aria-label="payment-methods-box" headerIcon="credit_card" headerText="Payment Methods" editContent={getNewContent()}>
+          <PaymentMethodsTable></PaymentMethodsTable>
+        </DisplayBox>
+      );
+    } else return <EditForm></EditForm>;
+  };
+
+  return props.stripePromise ? <PaymentMethods></PaymentMethods> : null;
+};

package/src/donationComponents/components/RecurringDonations.tsx

@@ -0,0 +1,117 @@
+"use client";
+
+import React from "react";
+import { DisplayBox } from "../../components";
+import { ApiHelper, UserHelper, CurrencyHelper, DateHelper, Locale } from "../../helpers";
+import { Permissions, SubscriptionInterface } from "@churchapps/helpers";
+import { RecurringDonationsEdit } from ".";
+import { Icon, Table, TableBody, TableCell, TableRow, TableHead } from "@mui/material";
+
+interface Props { customerId: string, paymentMethods: any[], appName: string, dataUpdate: (message?: string) => void, };
+
+export const RecurringDonations: React.FC<Props> = (props) => {
+  const [subscriptions, setSubscriptions] = React.useState<SubscriptionInterface[]>([]);
+  const [mode, setMode] = React.useState("display");
+  const [editSubscription, setEditSubscription] = React.useState<SubscriptionInterface>();
+
+  const loadData = () => {
+    if (props.customerId) {
+      ApiHelper.get("/customers/" + props.customerId + "/subscriptions", "GivingApi").then(subResult => {
+        const subs: SubscriptionInterface[] = [];
+        const requests = subResult.data?.map((s: any) => ApiHelper.get("/subscriptionfunds?subscriptionId=" + s.id, "GivingApi").then(subFunds => {
+          s.funds = subFunds;
+          subs.push(s);
+        }));
+        return requests && Promise.all(requests).then(() => {
+          setSubscriptions(subs);
+        });
+      });
+    }
+  };
+
+  const handleUpdate = (message: string) => {
+    loadData();
+    setMode("display");
+    if (message) props.dataUpdate(message);
+  };
+
+  const handleEdit = (sub: SubscriptionInterface) => (e: React.MouseEvent) => {
+    e.preventDefault();
+    setEditSubscription(sub);
+    setMode("edit");
+  };
+
+  const getPaymentMethod = (sub: SubscriptionInterface) => {
+    const pm = props.paymentMethods.find((pm: any) => pm.id === (sub.default_payment_method || sub.default_source));
+    if (!pm) return <span style={{ color: "red" }}>{Locale.label("donation.recurring.notFound")}</span>;
+    return `${pm.name} ****${pm.last4}`;
+  };
+
+  const getInterval = (subscription: SubscriptionInterface) => {
+    const interval = subscription.plan.interval_count + " " + subscription.plan.interval;
+    return subscription.plan.interval_count > 1 ? interval + "s" : interval;
+  };
+
+  const getFunds = (subscription: SubscriptionInterface) => {
+    const result: React.ReactElement[] = [];
+    subscription.funds.forEach((fund: any) => {
+      result.push(<div key={subscription.id + fund.id}>
+          {fund.name} <span style={{ float: "right" }}>{CurrencyHelper.formatCurrency(fund.amount)}</span>
+        </div>);
+    });
+    const total = (subscription.plan.amount / 100);
+    result.push(<div key={subscription.id + "-total"} style={{ borderTop: "solid #dee2e6 1px" }}>
+        Total <span style={{ float: "right" }}>{CurrencyHelper.formatCurrency(total)}</span>
+      </div>);
+    return result;
+  };
+
+  const getEditOptions = (sub: SubscriptionInterface) => {
+    if ((!UserHelper.checkAccess(Permissions.givingApi.settings.edit) && props.appName !== "B1App") || props?.paymentMethods?.length === 0) return null;
+    return <a aria-label="edit-button" onClick={handleEdit(sub)} href="about:blank"><Icon>edit</Icon></a>;
+  };
+
+  const getTableHeader = () => {
+    const result: React.ReactElement[] = [];
+    result.push(<TableRow key="header" sx={{ textAlign: "left" }}><TableCell><b>{Locale.label("donation.recurring.startDate")}</b></TableCell><TableCell><b>{Locale.label("donation.recurring.amount")}</b></TableCell><TableCell><b>{Locale.label("donation.recurring.interval")}</b></TableCell><TableCell><b>{Locale.label("donation.recurring.paymentMethod")}</b></TableCell>{props?.paymentMethods?.length > 0 && <TableCell></TableCell>}</TableRow>);
+    return result;
+  };
+
+  const getTableRows = () => {
+    const rows: React.ReactElement[] = [];
+
+    subscriptions.forEach((sub: any) => {
+      rows.push(<TableRow key={sub.id}>
+          <TableCell>{DateHelper.prettyDate(new Date(sub.billing_cycle_anchor * 1000))}</TableCell>
+          <TableCell>{getFunds(sub)}</TableCell>
+          <TableCell>{Locale.label("donation.recurring.every")} {getInterval(sub)}</TableCell>
+          <TableCell className="capitalize">{getPaymentMethod(sub)}</TableCell>
+          <TableCell align="right">{getEditOptions(sub)}</TableCell>
+        </TableRow>);
+    });
+    return rows;
+  };
+
+  const getSubscriptionsTable = () => (
+    <Table>
+      <TableHead>{getTableHeader()}</TableHead>
+      <TableBody>{getTableRows()}</TableBody>
+    </Table>
+  );
+
+  React.useEffect(loadData, []); //eslint-disable-line
+
+  if (!subscriptions.length) return null;
+  if (mode === "display") {
+    return (
+      <DisplayBox data-testid="recurring-donations" headerIcon="restart_alt" headerText="Recurring Donations">
+        {getSubscriptionsTable()}
+      </DisplayBox>
+    );
+  }
+  if (mode === "edit" && editSubscription) {
+    return (
+      <RecurringDonationsEdit customerId={props.customerId} paymentMethods={props.paymentMethods} editSubscription={editSubscription} subscriptionUpdated={handleUpdate} />
+    );
+  }
+};

package/src/donationComponents/components/RecurringDonationsEdit.tsx

@@ -0,0 +1,96 @@
+"use client";
+
+import React from "react";
+import { ApiHelper, Locale } from "../../helpers";
+import { InputBox } from "../../components";
+import { StripePaymentMethod, SubscriptionInterface } from "@churchapps/helpers";
+import { FormControl, Grid, InputLabel, MenuItem, Select, TextField } from "@mui/material";
+import type { SelectChangeEvent } from "@mui/material";
+import { DonationHelper } from "../../helpers";
+
+interface Props { subscriptionUpdated: (message?: string) => void, customerId: string, paymentMethods: StripePaymentMethod[], editSubscription: SubscriptionInterface };
+
+export const RecurringDonationsEdit: React.FC<Props> = (props) => {
+  const [editSubscription, setEditSubscription] = React.useState<SubscriptionInterface>(props.editSubscription);
+  const [interval, setInterval] = React.useState("one_month");
+
+  const handleCancel = () => { props.subscriptionUpdated(); };
+  const handleSave = () => {
+    const sub = { ...editSubscription } as SubscriptionInterface;
+    const pmFound = props.paymentMethods.find((pm: StripePaymentMethod) => 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: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement> | SelectChangeEvent<string>) => {
+    const sub = { ...editSubscription } as SubscriptionInterface;
+    const value = e.target.value;
+    switch (e.target.name) {
+      case "method":
+        const pm = props.paymentMethods.find((pm: StripePaymentMethod) => 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 = () => (
+    <>
+      <Grid container spacing={3}>
+        <Grid size={{ xs: 12, md: 6 }}>
+          <FormControl fullWidth>
+            <InputLabel>{Locale.label("donation.donationForm.method")}</InputLabel>
+            <Select label={Locale.label("donation.donationForm.method")} name="method" aria-label="method" value={editSubscription.default_payment_method || editSubscription.default_source} className="capitalize" onChange={handleChange}>
+              {props.paymentMethods.map((paymentMethod: any, i: number) => <MenuItem key={i} value={paymentMethod.id}>{paymentMethod.name} ****{paymentMethod.last4}</MenuItem>)}
+            </Select>
+          </FormControl>
+        </Grid>
+        <Grid size={{ xs: 12, md: 6 }}>
+          <FormControl fullWidth>
+            <InputLabel>{Locale.label("donation.donationForm.frequency")}</InputLabel>
+            <Select label={Locale.label("donation.donationForm.frequency")} name="interval" aria-label="interval" value={interval} onChange={handleChange}>
+              <MenuItem value="one_week">{Locale.label("donation.donationForm.weekly")}</MenuItem>
+              <MenuItem value="two_week">{Locale.label("donation.donationForm.biWeekly")}</MenuItem>
+              <MenuItem value="one_month">{Locale.label("donation.donationForm.monthly")}</MenuItem>
+              <MenuItem value="three_month">{Locale.label("donation.donationForm.quarterly")}</MenuItem>
+              <MenuItem value="one_year">{Locale.label("donation.donationForm.annually")}</MenuItem>
+            </Select>
+          </FormControl>
+        </Grid>
+      </Grid>
+    </>
+  );
+
+  React.useEffect(() => {
+    if (props.editSubscription) {
+      const keyName = DonationHelper.getIntervalKeyName(props.editSubscription.plan.interval_count, props.editSubscription.plan.interval);
+      setInterval(keyName);
+    }
+  }, [props.editSubscription]);
+
+  return (
+    <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}>
+      {getFields()}
+    </InputBox>
+  );
+};

package/src/donationComponents/components/index.tsx

@@ -0,0 +1,8 @@
+export { BankForm } from "./BankForm";
+export { CardForm } from "./CardForm";
+export { DonationForm } from "./DonationForm";
+export { FundDonation } from "./FundDonation";
+export { FundDonations } from "./FundDonations";
+export { PaymentMethods } from "./PaymentMethods";
+export { RecurringDonations } from "./RecurringDonations";
+export { RecurringDonationsEdit } from "./RecurringDonationsEdit";

package/src/donationComponents/index.ts

@@ -0,0 +1,2 @@
+export * from "./components";
+export { DonationPreviewModal } from "./modals/DonationPreviewModal";

package/src/donationComponents/modals/DonationPreviewModal.tsx

@@ -0,0 +1,70 @@
+"use client";
+
+import React from "react";
+import { DateHelper, CurrencyHelper, Locale } from "../../helpers";
+import { StripeDonationInterface } from "@churchapps/helpers";
+import {
+ Table, TableBody, TableRow, TableCell, Dialog, DialogTitle, DialogContent, DialogActions, Button 
+} from "@mui/material";
+
+interface Props {
+  show: boolean;
+  onHide: () => void;
+  handleDonate: (message: string) => void;
+  donation: StripeDonationInterface;
+  donationType: string;
+  paymentMethodName: string;
+  funds: any;
+  payFee: number;
+}
+
+export const DonationPreviewModal: React.FC<Props> = (props) => {
+  const donationType: any = { once: "One-time Donation", recurring: "Recurring Donation" };
+  const [isLoading, setLoading] = React.useState<boolean>(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 (
+    <Dialog open={props.show} {...props}>
+      <DialogTitle>Donation Preview</DialogTitle>
+      <DialogContent>
+        <Table>
+          <TableBody>
+            <TableRow><TableCell>{Locale.label("person.name")}:</TableCell><TableCell>{props.donation.person.name}</TableCell></TableRow>
+            <TableRow><TableCell>{Locale.label("donation.preview.method")}:</TableCell><TableCell className="capitalize">{props.paymentMethodName}</TableCell></TableRow>
+            <TableRow><TableCell>{Locale.label("donation.preview.type")}:</TableCell><TableCell>{donationType[props.donationType]}</TableCell></TableRow>
+            {props.donationType === "once"
+              && <TableRow><TableCell>{Locale.label("donation.preview.date")}:</TableCell><TableCell>{DateHelper.formatHtml5Date(new Date(props.donation.billing_cycle_anchor))}</TableCell></TableRow>
+            }
+            <TableRow><TableCell>{Locale.label("donation.preview.weekly")}:</TableCell><TableCell>{props.donation.notes}</TableCell></TableRow>
+            {props.donationType === "recurring"
+              && <>
+                <TableRow><TableCell>{Locale.label("donation.preview.startingOn")}:</TableCell><TableCell>{DateHelper.formatHtml5Date(new Date(props.donation.billing_cycle_anchor))}</TableCell></TableRow>
+                <TableRow><TableCell>{Locale.label("donation.preview.every")}:</TableCell><TableCell className="capitalize">{formatInterval()}</TableCell></TableRow>
+              </>
+            }
+            <TableRow><TableCell>{Locale.label("donation.preview.funds")}:</TableCell><TableCell>{props.donation.funds.map((fund: any, i: number) => <p key={i}>{CurrencyHelper.formatCurrency(fund.amount)} - {fund.name}</p>)}</TableCell></TableRow>
+            {props.payFee > 0 && <TableRow><TableCell>{Locale.label("donation.preview.fee")}:</TableCell><TableCell>{CurrencyHelper.formatCurrency(props.payFee)}</TableCell></TableRow>}
+            <TableRow><TableCell>{Locale.label("donation.preview.total")}:</TableCell><TableCell><h4>{CurrencyHelper.formatCurrency(props.donation.amount)}</h4></TableCell></TableRow>
+          </TableBody>
+        </Table>
+      </DialogContent>
+      <DialogActions>
+        <Button onClick={props.onHide} variant="outlined" aria-label="cancel-button">{Locale.label("donation.common.cancel")}</Button>
+        <Button onClick={handleClick} variant="contained" aria-label="donate-button" disabled={isLoading}>{Locale.label("donation.preview.donate")}</Button>
+      </DialogActions>
+    </Dialog>
+  );
+};

package/src/index.ts

@@ -3,3 +3,4 @@ export * from "./components";
 export * from "@churchapps/helpers";
 export * from "./pageComponents";
 export * from "./hooks";
+export * from "./donationComponents";

package/dist/components/B1ShareModal.d.ts

@@ -1,9 +0,0 @@
-type Props = {
-    contentDisplayName: string;
-    contentType: string;
-    contentId: string;
-    onClose: () => void;
-};
-export declare function B1ShareModal(props: Props): import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=B1ShareModal.d.ts.map

package/dist/components/B1ShareModal.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"B1ShareModal.d.ts","sourceRoot":"","sources":["../../src/components/B1ShareModal.tsx"],"names":[],"mappings":"AAQA,KAAK,KAAK,GAAG;IACX,kBAAkB,EAAE,MAAM,CAAC;IAC3B,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;IAClB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB,CAAC;AAEF,wBAAgB,YAAY,CAAC,KAAK,EAAE,KAAK,2CAwFxC"}

package/dist/components/B1ShareModal.js

@@ -1,77 +0,0 @@
-"use client";
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.B1ShareModal = B1ShareModal;
-const jsx_runtime_1 = require("react/jsx-runtime");
-const helpers_1 = require("../helpers");
-const material_1 = require("@mui/material");
-const react_1 = require("react");
-const Loading_1 = require("./Loading");
-function B1ShareModal(props) {
-    const [groupId, setGroupId] = (0, react_1.useState)("");
-    const [groups, setGroups] = (0, react_1.useState)(null);
-    const [comment, setComment] = (0, react_1.useState)("");
-    const [showSuccess, setShowSuccess] = (0, react_1.useState)(false);
-    const loadData = async () => {
-        const g = await helpers_1.ApiHelper.get("/groups/my", "MembershipApi");
-        if (g.length > 0)
-            setGroupId(g[0].id);
-        setGroups(g);
-    };
-    const handleChange = (e) => {
-        e.preventDefault();
-        switch (e.target.name) {
-            case "group":
-                setGroupId(e.target.value);
-                break;
-            case "comment":
-                setComment(e.target.value);
-                break;
-        }
-    };
-    const handlePost = () => {
-        setShowSuccess(true);
-        if (groupId === "")
-            alert(helpers_1.Locale.label("b1Share.validate.selectGroup"));
-        else if (comment === "")
-            alert(helpers_1.Locale.label("b1Share.validate.addComment"));
-        else {
-            const payload = {
-                groupId: groupId,
-                contentType: props.contentType,
-                contentId: props.contentId,
-                comment: comment,
-                title: props.contentDisplayName
-            };
-            helpers_1.ApiHelper.post("/conversations/start", payload, "MessagingApi").then(() => {
-                setShowSuccess(true);
-            });
-        }
-    };
-    (0, react_1.useEffect)(() => { loadData(); }, []);
-    const style = {
-        position: 'absolute',
-        top: '50%',
-        left: '50%',
-        transform: 'translate(-50%, -50%)',
-        width: 600,
-        bgcolor: 'background.paper',
-        border: '2px solid #000',
-        boxShadow: 24,
-    };
-    const getModalContent = () => {
-        if (!helpers_1.ApiHelper.isAuthenticated)
-            return (0, jsx_runtime_1.jsx)("p", { children: helpers_1.Locale.label("b1Share.validate.loginFirst") });
-        else if (!groups)
-            return ((0, jsx_runtime_1.jsx)(Loading_1.Loading, {}));
-        else if (groups.length === 0)
-            return ((0, jsx_runtime_1.jsx)("p", { children: helpers_1.Locale.label("b1Share.validate.notMember") }));
-        else
-            return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)("h2", { children: helpers_1.Locale.label("b1Share.sharingToGroup").replace("{}", props.contentDisplayName) }), (0, jsx_runtime_1.jsxs)(material_1.FormControl, { fullWidth: true, children: [(0, jsx_runtime_1.jsx)(material_1.InputLabel, { children: helpers_1.Locale.label("b1Share.group") }), (0, jsx_runtime_1.jsx)(material_1.Select, { label: helpers_1.Locale.label("b1Share.group"), name: "group", value: groupId, onChange: handleChange, children: groups.map(g => (0, jsx_runtime_1.jsx)(material_1.MenuItem, { value: g.id, children: g.name }, g.id)) })] }), (0, jsx_runtime_1.jsx)(material_1.TextField, { fullWidth: true, multiline: true, label: helpers_1.Locale.label("b1Share.comment"), name: "comment", value: comment, onChange: handleChange, rows: 3, placeholder: helpers_1.Locale.label("b1Share.commentPlaceholder") })] }));
-    };
-    if (showSuccess)
-        return ((0, jsx_runtime_1.jsx)(material_1.Snackbar, { open: true, anchorOrigin: { horizontal: "center", vertical: "bottom" }, autoHideDuration: 2500, onClose: () => props.onClose(), children: (0, jsx_runtime_1.jsx)(material_1.Alert, { variant: "filled", severity: "success", children: helpers_1.Locale.label("b1Share.contentShared") }) }));
-    else
-        return ((0, jsx_runtime_1.jsx)(material_1.Modal, { open: true, onClose: props.onClose, children: (0, jsx_runtime_1.jsxs)(material_1.Box, { sx: style, children: [(0, jsx_runtime_1.jsx)("div", { style: { paddingLeft: 16, paddingRight: 16 }, children: getModalContent() }), (0, jsx_runtime_1.jsxs)(material_1.DialogActions, { sx: { paddingX: "16px", paddingBottom: "12px" }, children: [(0, jsx_runtime_1.jsx)(material_1.Button, { variant: "outlined", onClick: props.onClose, children: "Close" }), (0, jsx_runtime_1.jsx)(material_1.Button, { variant: "contained", onClick: handlePost, children: "Post" })] })] }) }));
-}
-//# sourceMappingURL=B1ShareModal.js.map

package/dist/components/B1ShareModal.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"B1ShareModal.js","sourceRoot":"","sources":["../../src/components/B1ShareModal.tsx"],"names":[],"mappings":"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"}

package/dist/components/gallery/GalleryModal.d.ts

@@ -1,9 +0,0 @@
-import React from "react";
-interface Props {
-    aspectRatio: number;
-    onClose: () => void;
-    onSelect: (img: string) => void;
-}
-export declare const GalleryModal: React.FC<Props>;
-export {};
-//# sourceMappingURL=GalleryModal.d.ts.map

package/dist/components/gallery/GalleryModal.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"GalleryModal.d.ts","sourceRoot":"","sources":["../../../src/components/gallery/GalleryModal.tsx"],"names":[],"mappings":"AAMA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAKxC,UAAU,KAAK;IACb,WAAW,EAAE,MAAM,CAAC;IACpB,OAAO,EAAE,MAAM,IAAI,CAAC;IACpB,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,KAAK,IAAI,CAAA;CAChC;AAED,eAAO,MAAM,YAAY,EAAE,KAAK,CAAC,EAAE,CAAC,KAAK,CAyHxC,CAAC"}