authscape 1.0.288 → 1.0.291

package/index.js

@@ -460,7 +460,7 @@ function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len
 function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i["return"] && (_r = _i["return"](), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
 function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 // remove before merging back
-//import { FileUploader, apiService, NextImage } from 'authscape';
+// import { FileUploader, apiService, NextImage } from 'authscape';
 
 var DocumentManager = function DocumentManager(_ref) {
   var loadedUser = _ref.loadedUser,
@@ -932,7 +932,7 @@ var DocumentManager = function DocumentManager(_ref) {
           fontSize: 11
         }
       }, file.lastUpdated)));
-    })), files != null && files.documentAndFiles != null && zeroStateView != null && /*#__PURE__*/_react["default"].createElement(_material.Box, null, zeroStateView(segment)));
+    })), files != null && files.documentAndFiles != null && zeroStateView != null && /*#__PURE__*/_react["default"].createElement(_material.Box, null, zeroStateView(segment, files.documentAndFiles)));
   })), (files.documentSegments.length == 0 || folderParent != null) && /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(_material.Grid, {
     container: true,
     spacing: 2
@@ -2826,22 +2826,13 @@ function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" =
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
-exports.StripePayment = void 0;
+exports["default"] = StripePayment;
 var _react = _interopRequireWildcard(require("react"));
 var _reactStripeJs = require("@stripe/react-stripe-js");
 var _stripeJs = require("@stripe/stripe-js");
-var _Box = _interopRequireDefault(require("@mui/material/Box"));
-var _Dialog = _interopRequireDefault(require("@mui/material/Dialog"));
-var _DialogActions = _interopRequireDefault(require("@mui/material/DialogActions"));
-var _DialogContent = _interopRequireDefault(require("@mui/material/DialogContent"));
-var _DialogTitle = _interopRequireDefault(require("@mui/material/DialogTitle"));
-var _IconButton = _interopRequireDefault(require("@mui/material/IconButton"));
-var _Close = _interopRequireDefault(require("@mui/icons-material/Close"));
-var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
-var _Select = _interopRequireDefault(require("@mui/material/Select"));
-var _MenuItem = _interopRequireDefault(require("@mui/material/MenuItem"));
-var _Grid = _interopRequireDefault(require("@mui/material/Grid"));
 var _PaymentRounded = _interopRequireDefault(require("@mui/icons-material/PaymentRounded"));
+var _Typography = _interopRequireDefault(require("@mui/material/Typography"));
+var _material = require("@mui/material");
 var _excluded = ["children", "value", "index"];
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
@@ -2861,6 +2852,9 @@ function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 var CheckoutForm = function CheckoutForm(_ref) {
   var payButtonText = _ref.payButtonText,
     clientSecret = _ref.clientSecret,
+    currentUser = _ref.currentUser,
+    paymentMethodType = _ref.paymentMethodType,
+    walletId = _ref.walletId,
     onResponse = _ref.onResponse,
     amount = _ref.amount;
   var _useState = (0, _react.useState)(false),
@@ -2875,7 +2869,7 @@ var CheckoutForm = function CheckoutForm(_ref) {
     setErrorMessage = _useState4[1];
   var handleSubmit = /*#__PURE__*/function () {
     var _ref2 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee(event) {
-      var _yield$stripe$confirm, error, response, setupIntent, _yield$stripe$confirm2, _error, _response, paymentIntent;
+      var _yield$stripe$confirm, error, response, setupIntent, addPaymentMethodResponse, _response, _yield$stripe$confirm2, _error, _response2, paymentIntent;
       return _regeneratorRuntime().wrap(function _callee$(_context) {
         while (1) switch (_context.prev = _context.next) {
           case 0:
@@ -2890,8 +2884,8 @@ var CheckoutForm = function CheckoutForm(_ref) {
             }
             return _context.abrupt("return");
           case 4:
-            if (!(amount == null)) {
-              _context.next = 35;
+            if (!(amount == null || currentUser != null)) {
+              _context.next = 47;
               break;
             }
             _context.next = 7;
@@ -2915,7 +2909,7 @@ var CheckoutForm = function CheckoutForm(_ref) {
             // details incomplete)
             setIsPaymentProcessing(false);
             setErrorMessage(error.message);
-            _context.next = 33;
+            _context.next = 45;
             break;
           case 14:
             // Your customer will be redirected to your `return_url`. For some payment
@@ -2929,29 +2923,63 @@ var CheckoutForm = function CheckoutForm(_ref) {
             response = _context.sent;
             setupIntent = response.setupIntent;
             _context.t0 = setupIntent.status;
-            _context.next = _context.t0 === 'succeeded' ? 22 : _context.t0 === 'processing' ? 24 : _context.t0 === 'requires_payment_method' ? 27 : 30;
+            _context.next = _context.t0 === 'succeeded' ? 22 : _context.t0 === 'processing' ? 36 : _context.t0 === 'requires_payment_method' ? 39 : 42;
             break;
           case 22:
-            // need to store the payment intent with the customer if they are logged in... currentUser
-            onResponse("succeeded", setupIntent.id, setupIntent.payment_method);
-            return _context.abrupt("break", 33);
+            _context.next = 24;
+            return apiService().post("/Payment/AddPaymentMethod", {
+              walletId: walletId,
+              paymentMethodType: paymentMethodType,
+              stripePaymentMethod: setupIntent.payment_method
+            });
           case 24:
+            addPaymentMethodResponse = _context.sent;
+            if (!(addPaymentMethodResponse != null && addPaymentMethodResponse.status == 200)) {
+              _context.next = 34;
+              break;
+            }
+            onResponse("succeeded", setupIntent.id, setupIntent.payment_method);
+            if (!(amount != null)) {
+              _context.next = 32;
+              break;
+            }
+            _context.next = 30;
+            return apiService().post("/Payment/Charge", {
+              paymentMethodType: paymentMethodType,
+              walletPaymentMethodId: addPaymentMethodResponse.data,
+              amount: amount
+            });
+          case 30:
+            _response = _context.sent;
+            if (_response != null && _response.status == 200) {
+              onResponse("paid", _response.data.stripePaymentIntentId);
+            } else {
+              onResponse("failed", null);
+            }
+          case 32:
+            _context.next = 35;
+            break;
+          case 34:
+            onResponse("failed", null);
+          case 35:
+            return _context.abrupt("break", 45);
+          case 36:
             onResponse("processing", setupIntent.id, setupIntent.payment_method);
             setIsPaymentProcessing(false);
-            return _context.abrupt("break", 33);
-          case 27:
+            return _context.abrupt("break", 45);
+          case 39:
             onResponse("requires_payment_method", null);
             setIsPaymentProcessing(false);
-            return _context.abrupt("break", 33);
-          case 30:
+            return _context.abrupt("break", 45);
+          case 42:
             onResponse("failed", null);
             setIsPaymentProcessing(false);
-            return _context.abrupt("break", 33);
-          case 33:
-            _context.next = 69;
+            return _context.abrupt("break", 45);
+          case 45:
+            _context.next = 81;
             break;
-          case 35:
-            _context.next = 37;
+          case 47:
+            _context.next = 49;
             return stripe.confirmPayment({
               //`Elements` instance that was used to create the Payment Element
               elements: elements,
@@ -2960,11 +2988,11 @@ var CheckoutForm = function CheckoutForm(_ref) {
                 return_url: process.env.websiteBaseUri + '/confirmPayment?redirectUrl=' + encodeURIComponent(window.location.search)
               }
             });
-          case 37:
+          case 49:
             _yield$stripe$confirm2 = _context.sent;
             _error = _yield$stripe$confirm2.error;
             if (!_error) {
-              _context.next = 44;
+              _context.next = 56;
               break;
             }
             // This point will only be reached if there is an immediate error when
@@ -2972,50 +3000,50 @@ var CheckoutForm = function CheckoutForm(_ref) {
             // details incomplete)
             setIsPaymentProcessing(false);
             setErrorMessage(_error.message);
-            _context.next = 69;
+            _context.next = 81;
             break;
-          case 44:
+          case 56:
             // Your customer will be redirected to your `return_url`. For some payment
             // methods like iDEAL, your customer will be redirected to an intermediate
             // site first to authorize the payment, then redirected to the `return_url`.
-            _response = null;
+            _response2 = null;
             if (!(amount == null)) {
-              _context.next = 51;
+              _context.next = 63;
               break;
             }
-            _context.next = 48;
+            _context.next = 60;
             return stripe.retrieveSetupIntent(clientSecret);
-          case 48:
-            _response = _context.sent;
-            _context.next = 54;
+          case 60:
+            _response2 = _context.sent;
+            _context.next = 66;
             break;
-          case 51:
-            _context.next = 53;
+          case 63:
+            _context.next = 65;
             return stripe.retrievePaymentIntent(clientSecret);
-          case 53:
-            _response = _context.sent;
-          case 54:
-            paymentIntent = _response.paymentIntent;
+          case 65:
+            _response2 = _context.sent;
+          case 66:
+            paymentIntent = _response2.paymentIntent;
             _context.t1 = paymentIntent.status;
-            _context.next = _context.t1 === 'succeeded' ? 58 : _context.t1 === 'processing' ? 60 : _context.t1 === 'requires_payment_method' ? 63 : 66;
+            _context.next = _context.t1 === 'succeeded' ? 70 : _context.t1 === 'processing' ? 72 : _context.t1 === 'requires_payment_method' ? 75 : 78;
             break;
-          case 58:
+          case 70:
             // need to store the payment intent with the customer if they are logged in... currentUser
             onResponse("succeeded", paymentIntent.id);
-            return _context.abrupt("break", 69);
-          case 60:
+            return _context.abrupt("break", 81);
+          case 72:
             onResponse("processing", paymentIntent.id);
             setIsPaymentProcessing(false);
-            return _context.abrupt("break", 69);
-          case 63:
+            return _context.abrupt("break", 81);
+          case 75:
             onResponse("requires_payment_method", null);
             setIsPaymentProcessing(false);
-            return _context.abrupt("break", 69);
-          case 66:
+            return _context.abrupt("break", 81);
+          case 78:
             onResponse("failed", null);
             setIsPaymentProcessing(false);
-            return _context.abrupt("break", 69);
-          case 69:
+            return _context.abrupt("break", 81);
+          case 81:
           case "end":
             return _context.stop();
         }
@@ -3027,7 +3055,7 @@ var CheckoutForm = function CheckoutForm(_ref) {
   }();
   return /*#__PURE__*/_react["default"].createElement("form", {
     onSubmit: handleSubmit
-  }, /*#__PURE__*/_react["default"].createElement(_reactStripeJs.PaymentElement, null), /*#__PURE__*/_react["default"].createElement(Button, {
+  }, /*#__PURE__*/_react["default"].createElement(_reactStripeJs.PaymentElement, null), /*#__PURE__*/_react["default"].createElement(_material.Button, {
     startIcon: /*#__PURE__*/_react["default"].createElement(_PaymentRounded["default"], null),
     type: "submit",
     fullWidth: true,
@@ -3037,28 +3065,49 @@ var CheckoutForm = function CheckoutForm(_ref) {
       marginTop: 2,
       padding: 2
     }
-  }, payButtonText), errorMessage && /*#__PURE__*/_react["default"].createElement("div", null, errorMessage));
+  }, payButtonText != null ? payButtonText : amount != null ? "Pay Now" : "Add Payment Method"), errorMessage && /*#__PURE__*/_react["default"].createElement("div", null, errorMessage));
 };
-var StripePayment = function StripePayment() {
+function StripePayment(_ref3) {
+  var loadedUser = _ref3.loadedUser,
+    _ref3$amount = _ref3.amount,
+    amount = _ref3$amount === void 0 ? null : _ref3$amount,
+    _ref3$priceId = _ref3.priceId,
+    priceId = _ref3$priceId === void 0 ? null : _ref3$priceId,
+    _ref3$stripeCustomerI = _ref3.stripeCustomerId,
+    stripeCustomerId = _ref3$stripeCustomerI === void 0 ? null : _ref3$stripeCustomerI,
+    logOffUserName = _ref3.logOffUserName,
+    _ref3$invoiceId = _ref3.invoiceId,
+    invoiceId = _ref3$invoiceId === void 0 ? null : _ref3$invoiceId,
+    logOffEmail = _ref3.logOffEmail,
+    _ref3$paymentMethodTy = _ref3.paymentMethodType,
+    paymentMethodType = _ref3$paymentMethodTy === void 0 ? 3 : _ref3$paymentMethodTy,
+    currentUser = _ref3.currentUser,
+    onResponse = _ref3.onResponse,
+    _ref3$payButtonText = _ref3.payButtonText,
+    payButtonText = _ref3$payButtonText === void 0 ? null : _ref3$payButtonText;
   var stripePromise = (0, _stripeJs.loadStripe)(process.env.stripePublicKey);
   var _useState5 = (0, _react.useState)(null),
     _useState6 = _slicedToArray(_useState5, 2),
     options = _useState6[0],
     setOptions = _useState6[1];
-  var _useState7 = (0, _react.useState)(0),
+  var _useState7 = (0, _react.useState)(null),
     _useState8 = _slicedToArray(_useState7, 2),
-    value = _useState8[0],
-    setValue = _useState8[1];
-  var _useState9 = (0, _react.useState)([]),
+    walletId = _useState8[0],
+    setWalletId = _useState8[1];
+  var _useState9 = (0, _react.useState)(0),
     _useState10 = _slicedToArray(_useState9, 2),
-    paymentMethods = _useState10[0],
-    setPaymentMethods = _useState10[1];
-  var _useState11 = (0, _react.useState)(null),
+    value = _useState10[0],
+    setValue = _useState10[1];
+  var _useState11 = (0, _react.useState)([]),
     _useState12 = _slicedToArray(_useState11, 2),
-    paymentMethod = _useState12[0],
-    setPaymentMethod = _useState12[1];
+    paymentMethods = _useState12[0],
+    setPaymentMethods = _useState12[1];
+  var _useState13 = (0, _react.useState)(null),
+    _useState14 = _slicedToArray(_useState13, 2),
+    paymentMethod = _useState14[0],
+    setPaymentMethod = _useState14[1];
   var paymentMethodOpened = /*#__PURE__*/function () {
-    var _ref3 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
+    var _ref4 = _asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee2() {
       var response, responsePayments;
       return _regeneratorRuntime().wrap(function _callee2$(_context2) {
         while (1) switch (_context2.prev = _context2.next) {
@@ -3070,11 +3119,10 @@ var StripePayment = function StripePayment() {
             }
             _context2.next = 4;
             return apiService().post("/Payment/ConnectCustomerNoAuth", {
-              paymentRequestType: paymentRequestType,
+              paymentMethodType: paymentMethodType,
               amount: amount,
               priceId: priceId,
               name: logOffUserName,
-              typeOfPayment: 1,
               email: logOffEmail,
               stripeCustomerId: stripeCustomerId
             });
@@ -3085,25 +3133,25 @@ var StripePayment = function StripePayment() {
           case 7:
             _context2.next = 9;
             return apiService().post("/Payment/ConnectCustomer", {
-              paymentRequestType: paymentRequestType,
+              paymentMethodType: paymentMethodType,
               amount: amount,
               priceId: priceId,
-              typeOfPayment: 1,
               stripeCustomerId: stripeCustomerId
             });
           case 9:
             response = _context2.sent;
           case 10:
             if (!(response != null && response.status == 200)) {
-              _context2.next = 16;
+              _context2.next = 17;
               break;
             }
             setOptions({
-              clientSecret: response.data
+              clientSecret: response.data.clientSecret
             });
-            _context2.next = 14;
-            return apiService().get("/Payment/GetPaymentMethods");
-          case 14:
+            setWalletId(response.data.walletId);
+            _context2.next = 15;
+            return apiService().get("/Payment/GetPaymentMethods?paymentMethodType=" + paymentMethodType);
+          case 15:
             responsePayments = _context2.sent;
             if (responsePayments != null && responsePayments.status == 200) {
               if (responsePayments.data.length > 0) {
@@ -3111,21 +3159,21 @@ var StripePayment = function StripePayment() {
               }
               setPaymentMethods(responsePayments.data);
             }
-          case 16:
+          case 17:
           case "end":
             return _context2.stop();
         }
       }, _callee2);
     }));
     return function paymentMethodOpened() {
-      return _ref3.apply(this, arguments);
+      return _ref4.apply(this, arguments);
     };
   }();
   (0, _react.useEffect)(function () {
-    if (isOpen) {
+    if (loadedUser) {
       paymentMethodOpened();
     }
-  }, [isOpen]);
+  }, [loadedUser]);
   var handleChange = function handleChange(event, newValue) {
     setValue(newValue);
   };
@@ -3135,10 +3183,10 @@ var StripePayment = function StripePayment() {
       'aria-controls': "simple-tabpanel-".concat(index)
     };
   }
-  var PaymentMethod = function PaymentMethod(_ref4) {
-    var paymentMethod = _ref4.paymentMethod,
-      clicked = _ref4.clicked;
-    return /*#__PURE__*/_react["default"].createElement(_Box["default"], {
+  var PaymentMethod = function PaymentMethod(_ref5) {
+    var paymentMethod = _ref5.paymentMethod,
+      clicked = _ref5.clicked;
+    return /*#__PURE__*/_react["default"].createElement(_material.Box, {
       fullWidth: true,
       sx: {
         height: 160,
@@ -3177,7 +3225,7 @@ var StripePayment = function StripePayment() {
         fontSize: 18,
         color: "white"
       }
-    }, "* * * * \xA0 * * * * \xA0 * * * * \xA0 ", paymentMethod.last4), /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
+    }, "* * * * \xA0 * * * * \xA0 * * * * \xA0 ", paymentMethod.last4), /*#__PURE__*/_react["default"].createElement(_material.Grid, {
       container: true,
       spacing: 1,
       sx: {
@@ -3186,7 +3234,7 @@ var StripePayment = function StripePayment() {
         marginLeft: 0,
         width: "100%"
       }
-    }, /*#__PURE__*/_react["default"].createElement(_Grid["default"], {
+    }, /*#__PURE__*/_react["default"].createElement(_material.Grid, {
       item: true,
       xs: 12,
       sx: {
@@ -3225,36 +3273,85 @@ var StripePayment = function StripePayment() {
       hidden: value !== index,
       id: "simple-tabpanel-".concat(index),
       "aria-labelledby": "simple-tab-".concat(index)
-    }, other), value === index && /*#__PURE__*/_react["default"].createElement(_Box["default"], {
+    }, other), value === index && /*#__PURE__*/_react["default"].createElement(_material.Box, {
       sx: {
         p: 3
       }
     }, /*#__PURE__*/_react["default"].createElement(_Typography["default"], null, children)));
   }
   var PaymentContent = function PaymentContent() {
-    return /*#__PURE__*/_react["default"].createElement(_Box["default"], {
+    return /*#__PURE__*/_react["default"].createElement(_material.Box, {
       sx: {
         width: '100%'
       }
-    }, /*#__PURE__*/_react["default"].createElement(_Box["default"], {
+    }, currentUser == null && /*#__PURE__*/_react["default"].createElement(_material.Box, {
+      mt: 4
+    }, /*#__PURE__*/_react["default"].createElement(_material.Grid, {
+      container: true,
+      spacing: 2
+    }, /*#__PURE__*/_react["default"].createElement(_material.Grid, {
+      item: true,
+      xs: 6
+    }, /*#__PURE__*/_react["default"].createElement(_material.TextField, {
+      id: "outlined-basic",
+      label: "First Name",
+      variant: "outlined",
+      fullWidth: true
+    })), /*#__PURE__*/_react["default"].createElement(_material.Grid, {
+      item: true,
+      xs: 6
+    }, /*#__PURE__*/_react["default"].createElement(_material.TextField, {
+      id: "outlined-basic",
+      label: "Last Name",
+      variant: "outlined",
+      fullWidth: true
+    })), /*#__PURE__*/_react["default"].createElement(_material.Grid, {
+      item: true,
+      xs: 12
+    }, /*#__PURE__*/_react["default"].createElement(_material.TextField, {
+      id: "outlined-basic",
+      label: "Email",
+      variant: "outlined",
+      fullWidth: true
+    }))), options != null && process.env.stripePublicKey != null && /*#__PURE__*/_react["default"].createElement(_reactStripeJs.Elements, {
+      stripe: stripePromise,
+      options: options
+    }, /*#__PURE__*/_react["default"].createElement(CheckoutForm, {
+      payButtonText: payButtonText,
+      clientSecret: options != null ? options.clientSecret : null,
+      onResponse: onResponse,
+      paymentMethodType: paymentMethodType,
+      currentUser: currentUser,
+      walletId: walletId,
+      amount: amount
+    }))), currentUser != null && /*#__PURE__*/_react["default"].createElement(_material.Box, null, /*#__PURE__*/_react["default"].createElement(_material.Box, {
       sx: {
         borderBottom: 1,
         borderColor: 'divider'
       }
-    }), paymentMethods.length > 0 && /*#__PURE__*/_react["default"].createElement(TabPanel, {
+    }, /*#__PURE__*/_react["default"].createElement(_material.Tabs, {
+      value: value,
+      onChange: handleChange,
+      "aria-label": "basic tabs example"
+    }, /*#__PURE__*/_react["default"].createElement(_material.Tab, _extends({
+      label: "Add Payment Method"
+    }, a11yProps(0))), paymentMethods.length > 0 && /*#__PURE__*/_react["default"].createElement(_material.Tab, _extends({
+      label: "Existing Payment Method"
+    }, a11yProps(1))))), paymentMethods.length > 0 && /*#__PURE__*/_react["default"].createElement(TabPanel, {
       value: value,
       index: 1
-    }, /*#__PURE__*/_react["default"].createElement(_Select["default"], {
+    }, /*#__PURE__*/_react["default"].createElement(_material.Select, {
       sx: {
         marginTop: 4
       },
       fullWidth: true,
+      id: "demo-simple-select",
       value: paymentMethod,
       onChange: function onChange(val) {
         setPaymentMethod(val.target.value);
       }
     }, paymentMethods != null && paymentMethods.map(function (paymentMethod, index) {
-      return /*#__PURE__*/_react["default"].createElement(_MenuItem["default"], {
+      return /*#__PURE__*/_react["default"].createElement(_material.MenuItem, {
         key: index,
         value: paymentMethod.id,
         fullWidth: true,
@@ -3265,10 +3362,49 @@ var StripePayment = function StripePayment() {
         paymentMethod: paymentMethod,
         clicked: function clicked() {}
       }));
-    }))), /*#__PURE__*/_react["default"].createElement(TabPanel, {
+    })), amount != null && /*#__PURE__*/_react["default"].createElement(_material.Button, {
+      startIcon: /*#__PURE__*/_react["default"].createElement(_PaymentRounded["default"], null),
+      type: "submit",
+      variant: "contained",
+      disabled: paymentMethod == null,
+      sx: {
+        marginTop: 2
+      },
+      onClick: /*#__PURE__*/_asyncToGenerator( /*#__PURE__*/_regeneratorRuntime().mark(function _callee3() {
+        var response;
+        return _regeneratorRuntime().wrap(function _callee3$(_context3) {
+          while (1) switch (_context3.prev = _context3.next) {
+            case 0:
+              if (!(invoiceId != null)) {
+                _context3.next = 3;
+                break;
+              }
+              _context3.next = 7;
+              break;
+            case 3:
+              _context3.next = 5;
+              return apiService().post("/Payment/Charge", {
+                paymentMethodType: paymentMethodType,
+                walletPaymentMethodId: paymentMethod,
+                amount: amount
+              });
+            case 5:
+              response = _context3.sent;
+              if (response != null && response.status == 200) {
+                onResponse("paid", response.data.stripePaymentIntentId);
+              }
+
+              // setIsLoading(false);
+            case 7:
+            case "end":
+              return _context3.stop();
+          }
+        }, _callee3);
+      }))
+    }, payButtonText != null ? payButtonText : "Pay Now")), /*#__PURE__*/_react["default"].createElement(TabPanel, {
       value: value,
       index: 0
-    }, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_Box["default"], {
+    }, /*#__PURE__*/_react["default"].createElement("div", null, /*#__PURE__*/_react["default"].createElement(_material.Box, {
       mt: 4
     }, options != null && process.env.stripePublicKey != null && /*#__PURE__*/_react["default"].createElement(_reactStripeJs.Elements, {
       stripe: stripePromise,
@@ -3277,32 +3413,14 @@ var StripePayment = function StripePayment() {
       payButtonText: payButtonText,
       clientSecret: options != null ? options.clientSecret : null,
       onResponse: onResponse,
+      paymentMethodType: paymentMethodType,
+      walletId: walletId,
+      currentUser: currentUser,
       amount: amount
-    }))))));
+    })))))));
   };
-  return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, isModal && /*#__PURE__*/_react["default"].createElement(_Dialog["default"], {
-    fullWidth: true,
-    maxWidth: "sm",
-    open: isOpen,
-    onClose: function onClose() {
-      return onModalClose();
-    }
-  }, /*#__PURE__*/_react["default"].createElement(_DialogTitle["default"], null, title, /*#__PURE__*/_react["default"].createElement(_IconButton["default"], {
-    "aria-label": "close",
-    onClick: function onClick() {
-      onModalClose();
-    },
-    sx: {
-      position: 'absolute',
-      right: 8,
-      top: 8,
-      color: function color(theme) {
-        return theme.palette.grey[500];
-      }
-    }
-  }, /*#__PURE__*/_react["default"].createElement(_Close["default"], null))), /*#__PURE__*/_react["default"].createElement(_DialogContent["default"], null, description, /*#__PURE__*/_react["default"].createElement(PaymentContent, null)), /*#__PURE__*/_react["default"].createElement(_DialogActions["default"], null)), !isModal && /*#__PURE__*/_react["default"].createElement(PaymentContent, null));
-};
-exports.StripePayment = StripePayment;
+  return /*#__PURE__*/_react["default"].createElement(PaymentContent, null);
+}
 "use strict";
 
 Object.defineProperty(exports, "__esModule", {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "authscape",
-  "version": "1.0.288",
+  "version": "1.0.291",
   "description": "",
   "main": "index.js",
   "scripts": {

package/src/components/DocumentManager.js

@@ -22,7 +22,7 @@ import LockRoundedIcon from '@mui/icons-material/LockRounded';
 import Tooltip from '@mui/material/Tooltip';
 
 // remove before merging back
-//import { FileUploader, apiService, NextImage } from 'authscape';
+// import { FileUploader, apiService, NextImage } from 'authscape';
 
 export const DocumentManager = ({loadedUser, setIsLoading, viewDocumentType = 1, disablePreview = false, openToFolderId = null, xs=12, sm=6, md=4, lg=2, overrideLockMessage = "The directory cannot be removed.", zeroStateView = null, fieldId1 = null, fieldId2 = null, fieldId3 = null}) => {
 
@@ -401,11 +401,12 @@ export const DocumentManager = ({loadedUser, setIsLoading, viewDocumentType = 1,
                     ))}
                 </Grid>
 
-
-                {(files != null && files.documentAndFiles != null && zeroStateView != null) &&
+                {(files != null && 
+                    files.documentAndFiles != null && 
+                    zeroStateView != null) &&
                     
                     <Box>
-                    {zeroStateView(segment)}
+                    {zeroStateView(segment, files.documentAndFiles)}
                     </Box>
                 }
 
@@ -463,6 +464,7 @@ export const DocumentManager = ({loadedUser, setIsLoading, viewDocumentType = 1,
 
               ))}
             </Grid>
+            
 
             {(files != null && files.documentAndFiles != null && zeroStateView != null) &&
               

package/src/components/stripe/StripePayment.js

@@ -1,47 +1,37 @@
 import React, {useEffect, useState} from 'react';
 import {Elements, useStripe, useElements, PaymentElement} from '@stripe/react-stripe-js';
 import {loadStripe} from '@stripe/stripe-js';
-import Box from '@mui/material/Box';
-import Dialog from '@mui/material/Dialog';
-import DialogActions from '@mui/material/DialogActions';
-import DialogContent from '@mui/material/DialogContent';
-import DialogTitle from '@mui/material/DialogTitle';
-import IconButton from '@mui/material/IconButton';
-import CloseIcon from '@mui/icons-material/Close';
-import Typography from '@mui/material/Typography';
-import Select from '@mui/material/Select';
-import MenuItem from '@mui/material/MenuItem';
-import Grid from '@mui/material/Grid';
 import PaymentRoundedIcon from '@mui/icons-material/PaymentRounded';
+import Typography from '@mui/material/Typography';
+import { Select, Grid, MenuItem, Box, Button, Tab, Tabs, TextField } from '@mui/material';
 
-
-const CheckoutForm = ({payButtonText, clientSecret, onResponse, amount}) => {
+  const CheckoutForm = ({payButtonText, clientSecret, currentUser, paymentMethodType, walletId, onResponse, amount}) => {
 
     const [isPaymentProcessing, setIsPaymentProcessing] = useState(false);
-  
+
     const stripe = useStripe();
     const elements = useElements();
-  
+
     const [errorMessage, setErrorMessage] = useState(null);
-  
+
     const handleSubmit = async (event) => {
-  
+
       setIsPaymentProcessing(true);
-  
+
       // We don't want to let default form submission happen here,
       // which would refresh the page.
       event.preventDefault();
-  
+
       if (!stripe || !elements) {
         // Stripe.js has not yet loaded.
         // Make sure to disable form submission until Stripe.js has loaded.
-  
+
         //setIsPaymentProcessing(false);
         return;
       }
-  
-  
-      if (amount == null)
+
+
+      if (amount == null || currentUser != null)
       {
         const {error} = await stripe.confirmSetup({
           //`Elements` instance that was used to create the Payment Element
@@ -68,14 +58,51 @@ const CheckoutForm = ({payButtonText, clientSecret, onResponse, amount}) => {
           let response = null;
     
           response = await stripe.retrieveSetupIntent(clientSecret);
-  
+
           let setupIntent = response.setupIntent;
     
           switch (setupIntent.status) {
             case 'succeeded':
     
               // need to store the payment intent with the customer if they are logged in... currentUser
-              onResponse("succeeded", setupIntent.id, setupIntent.payment_method);
+
+              let addPaymentMethodResponse = await apiService().post("/Payment/AddPaymentMethod", {
+                walletId: walletId,
+                paymentMethodType: paymentMethodType,
+                stripePaymentMethod: setupIntent.payment_method
+              });
+
+              if (addPaymentMethodResponse != null && addPaymentMethodResponse.status == 200)
+              {
+                onResponse("succeeded", setupIntent.id, setupIntent.payment_method);
+
+
+                if (amount != null)
+                {
+                  // charge the customer
+                  let response = await apiService().post("/Payment/Charge", {
+
+                      paymentMethodType: paymentMethodType,
+                      walletPaymentMethodId: addPaymentMethodResponse.data,
+                      amount: amount
+                  });
+                  
+                  if (response != null && response.status == 200)
+                  {
+                      onResponse("paid", response.data.stripePaymentIntentId);
+                  }
+                  else
+                  {
+                    onResponse("failed", null);
+                  }
+                }
+                
+              }
+              else
+              {
+                onResponse("failed", null);
+              }
+              
               break;
     
             case 'processing':
@@ -94,7 +121,7 @@ const CheckoutForm = ({payButtonText, clientSecret, onResponse, amount}) => {
               break;
           }
         }
-  
+
       }
       else
       {
@@ -153,25 +180,26 @@ const CheckoutForm = ({payButtonText, clientSecret, onResponse, amount}) => {
               setIsPaymentProcessing(false);
               break;
           }
-  
+
           
         }
       }
     };
-  
+
     return (
       <form onSubmit={handleSubmit}>
         <PaymentElement />
-        <Button startIcon={<PaymentRoundedIcon/>} type="submit" fullWidth={true} variant="contained" disabled={(!stripe || isPaymentProcessing)} sx={{marginTop:2, padding:2}}>{payButtonText}</Button>
+        <Button startIcon={<PaymentRoundedIcon/>} type="submit" fullWidth={true} variant="contained" disabled={(!stripe || isPaymentProcessing)} sx={{marginTop:2, padding:2}}>{payButtonText != null ? payButtonText : (amount != null ? "Pay Now" : "Add Payment Method")}</Button>
         {errorMessage && <div>{errorMessage}</div>}
       </form>
     )
   };
 
-export const StripePayment = () => {
+  export default function StripePayment({loadedUser, amount = null, priceId = null, stripeCustomerId = null, logOffUserName, invoiceId = null, logOffEmail, paymentMethodType = 3, currentUser, onResponse, payButtonText = null}) {
 
     const stripePromise = loadStripe(process.env.stripePublicKey);
     const [options, setOptions] = useState(null);
+    const [walletId, setWalletId] = useState(null);
     const [value, setValue] = useState(0);
     const [paymentMethods, setPaymentMethods] = useState([]);
     const [paymentMethod, setPaymentMethod] = useState(null);
@@ -182,11 +210,10 @@ export const StripePayment = () => {
         if (currentUser == null)
         {
             response = await apiService().post("/Payment/ConnectCustomerNoAuth", {
-                paymentRequestType: paymentRequestType,
+                paymentMethodType: paymentMethodType,
                 amount: amount,
                 priceId: priceId,
                 name: logOffUserName,
-                typeOfPayment: 1,
                 email: logOffEmail,
                 stripeCustomerId: stripeCustomerId
             });
@@ -194,10 +221,9 @@ export const StripePayment = () => {
         else
         {
             response = await apiService().post("/Payment/ConnectCustomer", {
-                paymentRequestType: paymentRequestType,
+                paymentMethodType: paymentMethodType,
                 amount: amount,
                 priceId: priceId,
-                typeOfPayment: 1,
                 stripeCustomerId: stripeCustomerId
             });
         }
@@ -206,10 +232,13 @@ export const StripePayment = () => {
         if (response != null && response.status == 200)
         {
             setOptions({
-                clientSecret: response.data,
+                clientSecret: response.data.clientSecret
             });
 
-            let responsePayments = await apiService().get("/Payment/GetPaymentMethods");
+            setWalletId(response.data.walletId);
+
+            let responsePayments = await apiService().get("/Payment/GetPaymentMethods?paymentMethodType=" + paymentMethodType);
+
             if (responsePayments != null && responsePayments.status == 200)
             {
                 if (responsePayments.data.length > 0)
@@ -223,12 +252,12 @@ export const StripePayment = () => {
 
     useEffect(() => {
 
-        if (isOpen)
+        if (loadedUser)
         {
             paymentMethodOpened();
         }
 
-    }, [isOpen]);
+    }, [loadedUser]);
 
     const handleChange = (event, newValue) => {
         setValue(newValue);
@@ -292,114 +321,126 @@ export const StripePayment = () => {
     const PaymentContent = () => {
         return (            
             <Box sx={{ width: '100%' }}>
-                <Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
-                    {/* <Tabs value={value} onChange={handleChange} aria-label="basic tabs example">
-                        <Tab label="Add Payment Method" {...a11yProps(0)} />
-                        {paymentMethods.length > 0 &&
-                            <Tab label="Existing Payment Method" {...a11yProps(1)} />
+
+                {currentUser == null &&
+                
+                    <Box mt={4}>
+
+                        <Grid container spacing={2}>
+                            <Grid item xs={6}>
+                                <TextField id="outlined-basic" label="First Name" variant="outlined" fullWidth={true} />
+                            </Grid>
+                            <Grid item xs={6}>
+                                <TextField id="outlined-basic" label="Last Name" variant="outlined" fullWidth={true} />
+                            </Grid>
+
+                            <Grid item xs={12}>
+                                <TextField id="outlined-basic" label="Email" variant="outlined" fullWidth={true} />
+                            </Grid>
+                        </Grid>
+
+                        {(options != null && process.env.stripePublicKey != null) &&
+                            <Elements stripe={stripePromise} options={options}>
+                                <CheckoutForm payButtonText={payButtonText} clientSecret={options != null ? options.clientSecret : null} onResponse={onResponse} paymentMethodType={paymentMethodType} currentUser={currentUser} walletId={walletId} amount={amount} />
+                            </Elements>
                         }
-                    </Tabs> */}
-                </Box>
-                {paymentMethods.length > 0 &&
-                <TabPanel value={value} index={1}>
-
-                    <Select
-                        sx={{marginTop:4}}
-                        fullWidth={true}
-                        value={paymentMethod}
-                        onChange={(val) => {
-                            setPaymentMethod(val.target.value);
-                        }}>
-                            {paymentMethods != null && paymentMethods.map((paymentMethod, index) => {
-                                return (
-                                <MenuItem key={index} value={paymentMethod.id} fullWidth={true} sx={{width:"100%"}}>
-                                    <PaymentMethod paymentMethod={paymentMethod} clicked={() => {
-                                    }} />
-                                </MenuItem>)
-                            })}
-                    </Select>
-
-                    {/* <Button startIcon={<PaymentRoundedIcon/>} type="submit" variant="contained" disabled={paymentMethod == null} sx={{marginTop:2}} onClick={async () => {
-
-                        if (invoiceId != null)
-                        {
-                            setIsLoading(true);
-                            let response = await apiService().post("/Invoices/PayInvoice", {
-                                InvoiceId: invoiceId,
-                                WalletId: paymentMethod
-                            });
-                            setIsLoading(false);
-
-                            if (response != null && response.status == 200)
-                            {
-                                window.location.reload();
+                    </Box>
+                }
+
+                {currentUser != null &&
+                <Box>
+                    <Box sx={{ borderBottom: 1, borderColor: 'divider' }}>
+                        <Tabs value={value} onChange={handleChange} aria-label="basic tabs example">
+                            <Tab label="Add Payment Method" {...a11yProps(0)} />
+                            {paymentMethods.length > 0 &&
+                                <Tab label="Existing Payment Method" {...a11yProps(1)} />
                             }
-                            else
+                        </Tabs>
+                    </Box>
+                    {paymentMethods.length > 0 &&
+                    <TabPanel value={value} index={1}>
+
+                        <Select
+                            sx={{marginTop:4}}
+                            fullWidth={true}
+                            id="demo-simple-select"
+                            value={paymentMethod}
+                            onChange={(val) => {
+                                setPaymentMethod(val.target.value);
+                            }}>
+                                {paymentMethods != null && paymentMethods.map((paymentMethod, index) => {
+                                    return (
+                                    <MenuItem key={index} value={paymentMethod.id} fullWidth={true} sx={{width:"100%"}}>
+                                        <PaymentMethod paymentMethod={paymentMethod} clicked={() => {
+                                        }} />
+                                    </MenuItem>)
+                                })}
+                        </Select>
+
+                        {amount != null &&
+                        <Button startIcon={<PaymentRoundedIcon/>} type="submit" variant="contained" disabled={paymentMethod == null} sx={{marginTop:2}} onClick={async () => {
+
+                            if (invoiceId != null)
                             {
-                                alert("We had an issue with the payment method");
+                                // setIsLoading(true);
+                                // let response = await apiService().post("/Invoices/PayInvoice", {
+                                //     InvoiceId: invoiceId,
+                                //     WalletId: walletId
+                                // });
+                                // setIsLoading(false);
+
+                                // if (response != null && response.status == 200)
+                                // {
+                                //     window.location.reload();
+                                // }
+                                // else
+                                // {
+                                //     alert("We had an issue with the payment method");
+                                // }
                             }
-                        }
+                            else {
+                                // setIsLoading(true);
 
-                    }}>{payButtonText}</Button> */}
+                                let response = await apiService().post("/Payment/Charge", {
 
-                </TabPanel>
-                }
+                                    paymentMethodType: paymentMethodType,
+                                    walletPaymentMethodId: paymentMethod,
+                                    amount: amount
+                                });
+                                
+                                if (response != null && response.status == 200)
+                                {
+                                    onResponse("paid", response.data.stripePaymentIntentId);
+                                }
 
-                <TabPanel value={value} index={0}>
-                    <div>
-                        <Box mt={4} >
-                            {(options != null && process.env.stripePublicKey != null) &&
-                                <Elements stripe={stripePromise} options={options}>
-                                    <CheckoutForm payButtonText={payButtonText} clientSecret={options != null ? options.clientSecret : null} onResponse={onResponse} amount={amount} />
-                                </Elements>
+                                // setIsLoading(false);
                             }
-                        </Box>
-                    </div>
-                </TabPanel>
+
+                        }}>{payButtonText != null ? payButtonText : "Pay Now"}</Button>
+                        }
+
+                    </TabPanel>
+                    }
+
+                    <TabPanel value={value} index={0}>
+                        <div>
+                            <Box mt={4}>
+
+                                {(options != null && process.env.stripePublicKey != null) &&
+                                    <Elements stripe={stripePromise} options={options}>
+                                        <CheckoutForm payButtonText={payButtonText} clientSecret={options != null ? options.clientSecret : null} onResponse={onResponse} paymentMethodType={paymentMethodType} walletId={walletId} currentUser={currentUser} amount={amount} />
+                                    </Elements>
+                                }
+                            </Box>
+                        </div>
+                    </TabPanel>
+                </Box>
+                }
             </Box>
         )
     }
 
     return (
-        <>
-            {isModal &&
-            <Dialog
-                fullWidth={true}
-                maxWidth={"sm"}
-                open={isOpen}
-                onClose={() => onModalClose()}>
-                <DialogTitle>{title}
-                
-                    <IconButton
-                        aria-label="close"
-                        onClick={() => {
-                            
-                            onModalClose();
-                        }}
-                        sx={{
-                            position: 'absolute',
-                            right: 8,
-                            top: 8,
-                            color: (theme) => theme.palette.grey[500],
-                        }}>
-                        <CloseIcon />
-                    </IconButton>
-                </DialogTitle>
-                <DialogContent>
-                    {description}
-                    <PaymentContent />
-                </DialogContent>
-                <DialogActions>
-                </DialogActions>
-            </Dialog>
-            }
-
-            {!isModal &&
-                <PaymentContent />
-            }
-
-        </>
+        <PaymentContent />
     )
-
-
-}
+}