@pinerohit11/testwidget 0.1.59 → 0.1.61
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/index.js +178 -167
- package/dist/index.mjs +31 -14
- package/package.json +2 -2
package/dist/index.js
CHANGED
|
@@ -60,7 +60,8 @@ __export(index_exports, {
|
|
|
60
60
|
module.exports = __toCommonJS(index_exports);
|
|
61
61
|
|
|
62
62
|
// src/app/components/RequestPayment/RequestPayment.tsx
|
|
63
|
-
var
|
|
63
|
+
var import_bootstrap_bundle_min = require("bootstrap/dist/js/bootstrap.bundle.min.js");
|
|
64
|
+
var import_react5 = __toESM(require("react"));
|
|
64
65
|
|
|
65
66
|
// src/app/components/Loader/Loader.tsx
|
|
66
67
|
var import_react2 = __toESM(require("react"));
|
|
@@ -1051,13 +1052,23 @@ var ErrorText = {
|
|
|
1051
1052
|
fractalpayclientidrequired: "Fractalpay client key is missing or empty."
|
|
1052
1053
|
};
|
|
1053
1054
|
|
|
1055
|
+
// src/app/components/Bootstrapclient.ts
|
|
1056
|
+
var import_react4 = require("react");
|
|
1057
|
+
function BootstrapClient() {
|
|
1058
|
+
(0, import_react4.useEffect)(() => {
|
|
1059
|
+
require("bootstrap/dist/js/bootstrap.bundle.min.js");
|
|
1060
|
+
}, []);
|
|
1061
|
+
return null;
|
|
1062
|
+
}
|
|
1063
|
+
var Bootstrapclient_default = BootstrapClient;
|
|
1064
|
+
|
|
1054
1065
|
// src/app/components/RequestPayment/RequestPayment.tsx
|
|
1055
1066
|
function RequestPayment(props) {
|
|
1056
1067
|
const fractalpayClientKey = props.fractalpayClientKey;
|
|
1057
|
-
const [show, setShow] = (0,
|
|
1058
|
-
const [loading, setLoading] = (0,
|
|
1059
|
-
const [errors, setErrors] = (0,
|
|
1060
|
-
const [requestDetails, setRequestDetails] = (0,
|
|
1068
|
+
const [show, setShow] = (0, import_react5.useState)(false);
|
|
1069
|
+
const [loading, setLoading] = (0, import_react5.useState)(false);
|
|
1070
|
+
const [errors, setErrors] = (0, import_react5.useState)({});
|
|
1071
|
+
const [requestDetails, setRequestDetails] = (0, import_react5.useState)({
|
|
1061
1072
|
email: "",
|
|
1062
1073
|
amount: "",
|
|
1063
1074
|
phone_number: "",
|
|
@@ -1065,7 +1076,7 @@ function RequestPayment(props) {
|
|
|
1065
1076
|
name: "",
|
|
1066
1077
|
fractalpayPublicKey: fractalpayClientKey
|
|
1067
1078
|
});
|
|
1068
|
-
const [showConfirmationModal, setShowConfirmationModal] = (0,
|
|
1079
|
+
const [showConfirmationModal, setShowConfirmationModal] = (0, import_react5.useState)(false);
|
|
1069
1080
|
const phoneNumberRegex = (value) => /^\(?\d{3}\)?[-.\s]?\d{3}[-.\s]?\d{4}$/.test(value);
|
|
1070
1081
|
const amoutRegex = /[+-]?([0-9]*[.])?[0-9]+/;
|
|
1071
1082
|
const positiveAmountRegex = /^[+]?\d+(\.\d+)?$/;
|
|
@@ -1206,7 +1217,7 @@ function RequestPayment(props) {
|
|
|
1206
1217
|
setErrors(newErrors);
|
|
1207
1218
|
return Object.keys(newErrors).length === 0;
|
|
1208
1219
|
};
|
|
1209
|
-
(0,
|
|
1220
|
+
(0, import_react5.useEffect)(() => {
|
|
1210
1221
|
if (props.amount) {
|
|
1211
1222
|
setRequestDetails((prev) => __spreadProps(__spreadValues({}, prev), { amount: props.amount }));
|
|
1212
1223
|
}
|
|
@@ -1216,7 +1227,7 @@ function RequestPayment(props) {
|
|
|
1216
1227
|
e.preventDefault();
|
|
1217
1228
|
}
|
|
1218
1229
|
};
|
|
1219
|
-
return /* @__PURE__ */
|
|
1230
|
+
return /* @__PURE__ */ import_react5.default.createElement(import_react5.default.Fragment, null, /* @__PURE__ */ import_react5.default.createElement(Bootstrapclient_default, null), /* @__PURE__ */ import_react5.default.createElement(RequestPaymentstyles_default, null), /* @__PURE__ */ import_react5.default.createElement(Loader_default, { loading }), /* @__PURE__ */ import_react5.default.createElement(import_react5.default.Fragment, null, /* @__PURE__ */ import_react5.default.createElement(import_react_bootstrap.Button, { className: "paymentBtn", onClick: handleShow }, "Request Payment"), /* @__PURE__ */ import_react5.default.createElement(
|
|
1220
1231
|
import_react_bootstrap.Modal,
|
|
1221
1232
|
{
|
|
1222
1233
|
show,
|
|
@@ -1225,8 +1236,8 @@ function RequestPayment(props) {
|
|
|
1225
1236
|
backdrop: "static",
|
|
1226
1237
|
keyboard: false
|
|
1227
1238
|
},
|
|
1228
|
-
/* @__PURE__ */
|
|
1229
|
-
/* @__PURE__ */
|
|
1239
|
+
/* @__PURE__ */ import_react5.default.createElement(import_react_bootstrap.Modal.Header, { closeButton: true }, /* @__PURE__ */ import_react5.default.createElement(import_react_bootstrap.Modal.Title, null, "Request Payment")),
|
|
1240
|
+
/* @__PURE__ */ import_react5.default.createElement(import_react_bootstrap.Modal.Body, { id: "Checkout" }, /* @__PURE__ */ import_react5.default.createElement(import_react_bootstrap.Form, null, /* @__PURE__ */ import_react5.default.createElement(import_react_bootstrap.Stack, { gap: 3 }, /* @__PURE__ */ import_react5.default.createElement("div", null, /* @__PURE__ */ import_react5.default.createElement("label", { htmlFor: "exampleFormControlInput2", className: "form-label" }, "FULL NAME *"), /* @__PURE__ */ import_react5.default.createElement(
|
|
1230
1241
|
"input",
|
|
1231
1242
|
{
|
|
1232
1243
|
className: "form-control",
|
|
@@ -1235,7 +1246,7 @@ function RequestPayment(props) {
|
|
|
1235
1246
|
"data-token": "name",
|
|
1236
1247
|
onChange: handleChange
|
|
1237
1248
|
}
|
|
1238
|
-
), errors.name && /* @__PURE__ */
|
|
1249
|
+
), errors.name && /* @__PURE__ */ import_react5.default.createElement("small", { className: "text-danger" }, errors.name)), /* @__PURE__ */ import_react5.default.createElement("div", { className: "mb-3" }, /* @__PURE__ */ import_react5.default.createElement("label", { htmlFor: "requestPhoneNumber", className: "form-label" }, "Phone Number"), /* @__PURE__ */ import_react5.default.createElement(
|
|
1239
1250
|
"input",
|
|
1240
1251
|
{
|
|
1241
1252
|
maxLength: 10,
|
|
@@ -1247,7 +1258,7 @@ function RequestPayment(props) {
|
|
|
1247
1258
|
type: "text",
|
|
1248
1259
|
"data-token": "phone_number"
|
|
1249
1260
|
}
|
|
1250
|
-
), errors.phone_number && /* @__PURE__ */
|
|
1261
|
+
), errors.phone_number && /* @__PURE__ */ import_react5.default.createElement("small", { className: "text-danger" }, errors.phone_number))), /* @__PURE__ */ import_react5.default.createElement("div", { className: "mb-3" }, /* @__PURE__ */ import_react5.default.createElement("label", { htmlFor: "exampleFormControlInput2", className: "form-label" }, "EMAIL"), /* @__PURE__ */ import_react5.default.createElement(
|
|
1251
1262
|
"input",
|
|
1252
1263
|
{
|
|
1253
1264
|
className: "form-control",
|
|
@@ -1256,7 +1267,7 @@ function RequestPayment(props) {
|
|
|
1256
1267
|
onChange: handleChange,
|
|
1257
1268
|
"data-token": "email"
|
|
1258
1269
|
}
|
|
1259
|
-
), errors.email && /* @__PURE__ */
|
|
1270
|
+
), errors.email && /* @__PURE__ */ import_react5.default.createElement("small", { className: "text-danger" }, errors.email)), /* @__PURE__ */ import_react5.default.createElement("div", { className: "mb-3" }, /* @__PURE__ */ import_react5.default.createElement("label", { htmlFor: "exampleFormControlInput2", className: "form-label" }, "AMOUNT *"), /* @__PURE__ */ import_react5.default.createElement("div", { className: "input-group" }, /* @__PURE__ */ import_react5.default.createElement("span", { className: "input-group-text" }, "$"), /* @__PURE__ */ import_react5.default.createElement(
|
|
1260
1271
|
"input",
|
|
1261
1272
|
{
|
|
1262
1273
|
"data-token": "amount",
|
|
@@ -1272,7 +1283,7 @@ function RequestPayment(props) {
|
|
|
1272
1283
|
e2.preventDefault();
|
|
1273
1284
|
}, { passive: false })
|
|
1274
1285
|
}
|
|
1275
|
-
)), errors.amount && /* @__PURE__ */
|
|
1286
|
+
)), errors.amount && /* @__PURE__ */ import_react5.default.createElement("small", { className: "text-danger" }, errors.amount)), /* @__PURE__ */ import_react5.default.createElement("div", { className: "mb-3" }, /* @__PURE__ */ import_react5.default.createElement("label", { htmlFor: "exampleFormControlInput2", className: "form-label" }, "ORDER ID"), /* @__PURE__ */ import_react5.default.createElement(
|
|
1276
1287
|
"input",
|
|
1277
1288
|
{
|
|
1278
1289
|
className: "form-control",
|
|
@@ -1281,7 +1292,7 @@ function RequestPayment(props) {
|
|
|
1281
1292
|
onChange: handleChange,
|
|
1282
1293
|
"data-token": "order_id"
|
|
1283
1294
|
}
|
|
1284
|
-
), errors.order_id && /* @__PURE__ */
|
|
1295
|
+
), errors.order_id && /* @__PURE__ */ import_react5.default.createElement("small", { className: "text-danger" }, errors.order_id)), /* @__PURE__ */ import_react5.default.createElement(
|
|
1285
1296
|
import_react_bootstrap.Button,
|
|
1286
1297
|
{
|
|
1287
1298
|
type: "button",
|
|
@@ -1290,7 +1301,7 @@ function RequestPayment(props) {
|
|
|
1290
1301
|
disabled: loading
|
|
1291
1302
|
},
|
|
1292
1303
|
loading ? "Loading..." : "Send Request"
|
|
1293
|
-
)), /* @__PURE__ */
|
|
1304
|
+
)), /* @__PURE__ */ import_react5.default.createElement("div", { className: "powerd-by-part" }, /* @__PURE__ */ import_react5.default.createElement(
|
|
1294
1305
|
"svg",
|
|
1295
1306
|
{
|
|
1296
1307
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -1298,14 +1309,14 @@ function RequestPayment(props) {
|
|
|
1298
1309
|
height: "20",
|
|
1299
1310
|
viewBox: "0 0 26 26"
|
|
1300
1311
|
},
|
|
1301
|
-
/* @__PURE__ */
|
|
1312
|
+
/* @__PURE__ */ import_react5.default.createElement(
|
|
1302
1313
|
"path",
|
|
1303
1314
|
{
|
|
1304
1315
|
fill: "currentColor",
|
|
1305
1316
|
d: "M23.633 5.028a1.074 1.074 0 0 0-.777-.366c-2.295-.06-5.199-2.514-7.119-3.477C14.551.592 13.768.201 13.18.098a1.225 1.225 0 0 0-.36.001c-.588.103-1.371.494-2.556 1.087c-1.92.962-4.824 3.416-7.119 3.476a1.08 1.08 0 0 0-.778.366a1.167 1.167 0 0 0-.291.834c.493 10.023 4.088 16.226 10.396 19.831c.164.093.346.141.527.141s.363-.048.528-.141c6.308-3.605 9.902-9.808 10.396-19.831a1.161 1.161 0 0 0-.29-.834zM18.617 8.97l-5.323 7.855c-.191.282-.491.469-.788.469c-.298 0-.629-.163-.838-.372l-3.752-3.753a.656.656 0 0 1 0-.926l.927-.929a.658.658 0 0 1 .926 0l2.44 2.44l4.239-6.257a.657.657 0 0 1 .91-.173l1.085.736a.657.657 0 0 1 .174.91z"
|
|
1306
1317
|
}
|
|
1307
1318
|
)
|
|
1308
|
-
), "Secure payments powered by Fractal", /* @__PURE__ */
|
|
1319
|
+
), "Secure payments powered by Fractal", /* @__PURE__ */ import_react5.default.createElement(
|
|
1309
1320
|
"img",
|
|
1310
1321
|
{
|
|
1311
1322
|
src: "https://ui.fractalpay.com/favicon.ico",
|
|
@@ -1313,15 +1324,15 @@ function RequestPayment(props) {
|
|
|
1313
1324
|
className: "powered-logo"
|
|
1314
1325
|
}
|
|
1315
1326
|
)))
|
|
1316
|
-
), /* @__PURE__ */
|
|
1327
|
+
), /* @__PURE__ */ import_react5.default.createElement(
|
|
1317
1328
|
import_react_bootstrap.Modal,
|
|
1318
1329
|
{
|
|
1319
1330
|
className: "payment-suc",
|
|
1320
1331
|
show: showConfirmationModal,
|
|
1321
1332
|
onHide: handleCloseConfirmationModal
|
|
1322
1333
|
},
|
|
1323
|
-
/* @__PURE__ */
|
|
1324
|
-
/* @__PURE__ */
|
|
1334
|
+
/* @__PURE__ */ import_react5.default.createElement(import_react_bootstrap.Modal.Header, { closeButton: true }),
|
|
1335
|
+
/* @__PURE__ */ import_react5.default.createElement(import_react_bootstrap.Modal.Body, null, /* @__PURE__ */ import_react5.default.createElement(
|
|
1325
1336
|
"svg",
|
|
1326
1337
|
{
|
|
1327
1338
|
width: "60",
|
|
@@ -1330,7 +1341,7 @@ function RequestPayment(props) {
|
|
|
1330
1341
|
fill: "none",
|
|
1331
1342
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1332
1343
|
},
|
|
1333
|
-
/* @__PURE__ */
|
|
1344
|
+
/* @__PURE__ */ import_react5.default.createElement(
|
|
1334
1345
|
"rect",
|
|
1335
1346
|
{
|
|
1336
1347
|
x: "0.5",
|
|
@@ -1341,14 +1352,14 @@ function RequestPayment(props) {
|
|
|
1341
1352
|
stroke: "#31B379"
|
|
1342
1353
|
}
|
|
1343
1354
|
),
|
|
1344
|
-
/* @__PURE__ */
|
|
1355
|
+
/* @__PURE__ */ import_react5.default.createElement("g", { clipPath: "url(#clip0_2659_5018)" }, /* @__PURE__ */ import_react5.default.createElement(
|
|
1345
1356
|
"path",
|
|
1346
1357
|
{
|
|
1347
1358
|
d: "M41.1778 22.248C40.7483 21.8184 40.0518 21.8184 39.6222 22.248L26.4435 35.4268L21.3778 30.3611C20.9483 29.9315 20.2518 29.9316 19.8222 30.3611C19.3926 30.7907 19.3926 31.4871 19.8222 31.9167L25.6657 37.7601C26.0951 38.1897 26.7921 38.1894 27.2213 37.7601L41.1778 23.8036C41.6074 23.3741 41.6074 22.6776 41.1778 22.248Z",
|
|
1348
1359
|
fill: "#31B379"
|
|
1349
1360
|
}
|
|
1350
1361
|
)),
|
|
1351
|
-
/* @__PURE__ */
|
|
1362
|
+
/* @__PURE__ */ import_react5.default.createElement("defs", null, /* @__PURE__ */ import_react5.default.createElement("clipPath", { id: "clip0_2659_5018" }, /* @__PURE__ */ import_react5.default.createElement(
|
|
1352
1363
|
"rect",
|
|
1353
1364
|
{
|
|
1354
1365
|
width: "22",
|
|
@@ -1357,28 +1368,28 @@ function RequestPayment(props) {
|
|
|
1357
1368
|
transform: "translate(19.5 19.0039)"
|
|
1358
1369
|
}
|
|
1359
1370
|
)))
|
|
1360
|
-
), /* @__PURE__ */
|
|
1371
|
+
), /* @__PURE__ */ import_react5.default.createElement("h2", null, "Payment link has been ", /* @__PURE__ */ import_react5.default.createElement("br", null), " sent successfully"))
|
|
1361
1372
|
)));
|
|
1362
1373
|
}
|
|
1363
1374
|
|
|
1364
1375
|
// src/app/components/RequestPayment/RequestPaymentAllInput.tsx
|
|
1365
|
-
var
|
|
1376
|
+
var import_react6 = __toESM(require("react"));
|
|
1366
1377
|
var import_react_bootstrap2 = require("react-bootstrap");
|
|
1367
1378
|
var import_react_toastify = require("react-toastify");
|
|
1368
1379
|
var import_ReactToastify = require("react-toastify/dist/ReactToastify.css");
|
|
1369
1380
|
function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1370
|
-
const [isLoading, setIsLoading] = (0,
|
|
1371
|
-
const [show, setShow] = (0,
|
|
1372
|
-
const [phoneNumber, setPhoneNumber] = (0,
|
|
1373
|
-
const [amount, setAmount] = (0,
|
|
1374
|
-
const [orderId, setOrderId] = (0,
|
|
1375
|
-
const [isValidNumber, setIsValidNumber] = (0,
|
|
1376
|
-
const [isValidAmount, setIsValidAmount] = (0,
|
|
1377
|
-
const [isValidOrderId, setIsValidOrderId] = (0,
|
|
1378
|
-
const [errorMessagephone, setErrorMessagephone] = (0,
|
|
1379
|
-
const [errorMessageamount, setErrorMessageamount] = (0,
|
|
1380
|
-
const [errorMessageorderid, setErrorMessageorderid] = (0,
|
|
1381
|
-
const [submitClicked, setSubmitClicked] = (0,
|
|
1381
|
+
const [isLoading, setIsLoading] = (0, import_react6.useState)(false);
|
|
1382
|
+
const [show, setShow] = (0, import_react6.useState)(false);
|
|
1383
|
+
const [phoneNumber, setPhoneNumber] = (0, import_react6.useState)("");
|
|
1384
|
+
const [amount, setAmount] = (0, import_react6.useState)("");
|
|
1385
|
+
const [orderId, setOrderId] = (0, import_react6.useState)("");
|
|
1386
|
+
const [isValidNumber, setIsValidNumber] = (0, import_react6.useState)(true);
|
|
1387
|
+
const [isValidAmount, setIsValidAmount] = (0, import_react6.useState)(true);
|
|
1388
|
+
const [isValidOrderId, setIsValidOrderId] = (0, import_react6.useState)(true);
|
|
1389
|
+
const [errorMessagephone, setErrorMessagephone] = (0, import_react6.useState)("");
|
|
1390
|
+
const [errorMessageamount, setErrorMessageamount] = (0, import_react6.useState)("");
|
|
1391
|
+
const [errorMessageorderid, setErrorMessageorderid] = (0, import_react6.useState)("");
|
|
1392
|
+
const [submitClicked, setSubmitClicked] = (0, import_react6.useState)(false);
|
|
1382
1393
|
const handleClose = () => setShow(false);
|
|
1383
1394
|
const handleShow = () => setShow(true);
|
|
1384
1395
|
const sendRequestPayment = () => {
|
|
@@ -1480,7 +1491,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
|
1480
1491
|
setIsValidOrderId(false);
|
|
1481
1492
|
}
|
|
1482
1493
|
};
|
|
1483
|
-
return /* @__PURE__ */
|
|
1494
|
+
return /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, /* @__PURE__ */ import_react6.default.createElement(RequestPaymentstyles_default, null), /* @__PURE__ */ import_react6.default.createElement("div", { className: " border-container" }, /* @__PURE__ */ import_react6.default.createElement("div", { className: "payment-column" }, /* @__PURE__ */ import_react6.default.createElement("label", null, "Enter Phone Number:"), /* @__PURE__ */ import_react6.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react6.default.createElement(
|
|
1484
1495
|
"input",
|
|
1485
1496
|
{
|
|
1486
1497
|
type: "text",
|
|
@@ -1490,7 +1501,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
|
1490
1501
|
maxLength: 10,
|
|
1491
1502
|
className: submitClicked && (!phoneNumber || !isValidNumber) ? "error" : ""
|
|
1492
1503
|
}
|
|
1493
|
-
), errorMessagephone && /* @__PURE__ */
|
|
1504
|
+
), errorMessagephone && /* @__PURE__ */ import_react6.default.createElement("div", { className: "error-message text-danger" }, errorMessagephone))), /* @__PURE__ */ import_react6.default.createElement("div", { className: "payment-column" }, /* @__PURE__ */ import_react6.default.createElement("label", null, "Enter Amount:"), /* @__PURE__ */ import_react6.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react6.default.createElement(
|
|
1494
1505
|
"input",
|
|
1495
1506
|
{
|
|
1496
1507
|
type: "text",
|
|
@@ -1499,7 +1510,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
|
1499
1510
|
placeholder: "Enter amount",
|
|
1500
1511
|
className: submitClicked && (!amount || !isValidAmount) ? "error" : ""
|
|
1501
1512
|
}
|
|
1502
|
-
), errorMessageamount && /* @__PURE__ */
|
|
1513
|
+
), errorMessageamount && /* @__PURE__ */ import_react6.default.createElement("div", { className: "error-message text-danger" }, errorMessageamount))), /* @__PURE__ */ import_react6.default.createElement("div", { className: "payment-column" }, /* @__PURE__ */ import_react6.default.createElement("label", null, "Enter Order ID:"), /* @__PURE__ */ import_react6.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react6.default.createElement(
|
|
1503
1514
|
"input",
|
|
1504
1515
|
{
|
|
1505
1516
|
type: "text",
|
|
@@ -1508,7 +1519,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
|
1508
1519
|
placeholder: "Enter order ID",
|
|
1509
1520
|
className: submitClicked && (!orderId || !isValidOrderId) ? "error" : ""
|
|
1510
1521
|
}
|
|
1511
|
-
), errorMessageorderid && /* @__PURE__ */
|
|
1522
|
+
), errorMessageorderid && /* @__PURE__ */ import_react6.default.createElement("div", { className: "error-message text-danger" }, errorMessageorderid))), /* @__PURE__ */ import_react6.default.createElement(
|
|
1512
1523
|
"button",
|
|
1513
1524
|
{
|
|
1514
1525
|
onClick: sendRequestPayment,
|
|
@@ -1516,7 +1527,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
|
1516
1527
|
className: "paymentBtn"
|
|
1517
1528
|
},
|
|
1518
1529
|
isLoading ? "Loading..." : "Request Payment"
|
|
1519
|
-
)), /* @__PURE__ */
|
|
1530
|
+
)), /* @__PURE__ */ import_react6.default.createElement(import_react_bootstrap2.Modal, { className: "payment-suc", show, onHide: handleClose }, /* @__PURE__ */ import_react6.default.createElement(import_react_bootstrap2.Modal.Header, { closeButton: true }), /* @__PURE__ */ import_react6.default.createElement(import_react_bootstrap2.Modal.Body, null, /* @__PURE__ */ import_react6.default.createElement(
|
|
1520
1531
|
"svg",
|
|
1521
1532
|
{
|
|
1522
1533
|
width: "60",
|
|
@@ -1525,7 +1536,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
|
1525
1536
|
fill: "none",
|
|
1526
1537
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1527
1538
|
},
|
|
1528
|
-
/* @__PURE__ */
|
|
1539
|
+
/* @__PURE__ */ import_react6.default.createElement(
|
|
1529
1540
|
"rect",
|
|
1530
1541
|
{
|
|
1531
1542
|
x: "0.5",
|
|
@@ -1536,14 +1547,14 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
|
1536
1547
|
stroke: "#31B379"
|
|
1537
1548
|
}
|
|
1538
1549
|
),
|
|
1539
|
-
/* @__PURE__ */
|
|
1550
|
+
/* @__PURE__ */ import_react6.default.createElement("g", { clipPath: "url(#clip0_2659_5018)" }, /* @__PURE__ */ import_react6.default.createElement(
|
|
1540
1551
|
"path",
|
|
1541
1552
|
{
|
|
1542
1553
|
d: "M41.1778 22.248C40.7483 21.8184 40.0518 21.8184 39.6222 22.248L26.4435 35.4268L21.3778 30.3611C20.9483 29.9315 20.2518 29.9316 19.8222 30.3611C19.3926 30.7907 19.3926 31.4871 19.8222 31.9167L25.6657 37.7601C26.0951 38.1897 26.7921 38.1894 27.2213 37.7601L41.1778 23.8036C41.6074 23.3741 41.6074 22.6776 41.1778 22.248Z",
|
|
1543
1554
|
fill: "#31B379"
|
|
1544
1555
|
}
|
|
1545
1556
|
)),
|
|
1546
|
-
/* @__PURE__ */
|
|
1557
|
+
/* @__PURE__ */ import_react6.default.createElement("defs", null, /* @__PURE__ */ import_react6.default.createElement("clipPath", { id: "clip0_2659_5018" }, /* @__PURE__ */ import_react6.default.createElement(
|
|
1547
1558
|
"rect",
|
|
1548
1559
|
{
|
|
1549
1560
|
width: "22",
|
|
@@ -1552,11 +1563,11 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
|
1552
1563
|
transform: "translate(19.5 19.0039)"
|
|
1553
1564
|
}
|
|
1554
1565
|
)))
|
|
1555
|
-
), /* @__PURE__ */
|
|
1566
|
+
), /* @__PURE__ */ import_react6.default.createElement("h1", null, "Success!"), /* @__PURE__ */ import_react6.default.createElement("h4", null, "Payment link created successfully.")), /* @__PURE__ */ import_react6.default.createElement(import_react_bootstrap2.Modal.Footer, null, /* @__PURE__ */ import_react6.default.createElement("button", { className: "paymentBtn", onClick: handleClose }, "Ok"))), /* @__PURE__ */ import_react6.default.createElement(import_react_toastify.ToastContainer, null));
|
|
1556
1567
|
}
|
|
1557
1568
|
|
|
1558
1569
|
// src/app/components/RequestPayment/RequestPaymentDynamic.tsx
|
|
1559
|
-
var
|
|
1570
|
+
var import_react7 = __toESM(require("react"));
|
|
1560
1571
|
var import_react_bootstrap3 = require("react-bootstrap");
|
|
1561
1572
|
|
|
1562
1573
|
// src/app/components/Api/createWidgetOrder.ts
|
|
@@ -1580,8 +1591,8 @@ var createWidgetOrder = (formData) => {
|
|
|
1580
1591
|
|
|
1581
1592
|
// src/app/components/RequestPayment/RequestPaymentDynamic.tsx
|
|
1582
1593
|
function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orderID }) {
|
|
1583
|
-
const [isLoading, setIsLoading] = (0,
|
|
1584
|
-
const [show, setShow] = (0,
|
|
1594
|
+
const [isLoading, setIsLoading] = (0, import_react7.useState)(false);
|
|
1595
|
+
const [show, setShow] = (0, import_react7.useState)(false);
|
|
1585
1596
|
const handleClose = () => setShow(false);
|
|
1586
1597
|
const handleShow = () => setShow(true);
|
|
1587
1598
|
const sendRequestPayment = () => {
|
|
@@ -1604,7 +1615,7 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
|
|
|
1604
1615
|
console.error("Error:", error);
|
|
1605
1616
|
});
|
|
1606
1617
|
};
|
|
1607
|
-
return /* @__PURE__ */
|
|
1618
|
+
return /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, null, /* @__PURE__ */ import_react7.default.createElement(
|
|
1608
1619
|
"button",
|
|
1609
1620
|
{
|
|
1610
1621
|
onClick: sendRequestPayment,
|
|
@@ -1612,7 +1623,7 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
|
|
|
1612
1623
|
className: "paymentBtn"
|
|
1613
1624
|
},
|
|
1614
1625
|
isLoading ? "Loading..." : "Request Payment"
|
|
1615
|
-
), /* @__PURE__ */
|
|
1626
|
+
), /* @__PURE__ */ import_react7.default.createElement(import_react_bootstrap3.Modal, { className: "payment-suc", show, onHide: handleClose }, /* @__PURE__ */ import_react7.default.createElement(import_react_bootstrap3.Modal.Header, { closeButton: true }), /* @__PURE__ */ import_react7.default.createElement(import_react_bootstrap3.Modal.Body, null, /* @__PURE__ */ import_react7.default.createElement(
|
|
1616
1627
|
"svg",
|
|
1617
1628
|
{
|
|
1618
1629
|
width: "60",
|
|
@@ -1621,7 +1632,7 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
|
|
|
1621
1632
|
fill: "none",
|
|
1622
1633
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1623
1634
|
},
|
|
1624
|
-
/* @__PURE__ */
|
|
1635
|
+
/* @__PURE__ */ import_react7.default.createElement(
|
|
1625
1636
|
"rect",
|
|
1626
1637
|
{
|
|
1627
1638
|
x: "0.5",
|
|
@@ -1632,14 +1643,14 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
|
|
|
1632
1643
|
stroke: "#31B379"
|
|
1633
1644
|
}
|
|
1634
1645
|
),
|
|
1635
|
-
/* @__PURE__ */
|
|
1646
|
+
/* @__PURE__ */ import_react7.default.createElement("g", { "clip-path": "url(#clip0_2659_5018)" }, /* @__PURE__ */ import_react7.default.createElement(
|
|
1636
1647
|
"path",
|
|
1637
1648
|
{
|
|
1638
1649
|
d: "M41.1778 22.248C40.7483 21.8184 40.0518 21.8184 39.6222 22.248L26.4435 35.4268L21.3778 30.3611C20.9483 29.9315 20.2518 29.9316 19.8222 30.3611C19.3926 30.7907 19.3926 31.4871 19.8222 31.9167L25.6657 37.7601C26.0951 38.1897 26.7921 38.1894 27.2213 37.7601L41.1778 23.8036C41.6074 23.3741 41.6074 22.6776 41.1778 22.248Z",
|
|
1639
1650
|
fill: "#31B379"
|
|
1640
1651
|
}
|
|
1641
1652
|
)),
|
|
1642
|
-
/* @__PURE__ */
|
|
1653
|
+
/* @__PURE__ */ import_react7.default.createElement("defs", null, /* @__PURE__ */ import_react7.default.createElement("clipPath", { id: "clip0_2659_5018" }, /* @__PURE__ */ import_react7.default.createElement(
|
|
1643
1654
|
"rect",
|
|
1644
1655
|
{
|
|
1645
1656
|
width: "22",
|
|
@@ -1648,15 +1659,15 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
|
|
|
1648
1659
|
transform: "translate(19.5 19.0039)"
|
|
1649
1660
|
}
|
|
1650
1661
|
)))
|
|
1651
|
-
), /* @__PURE__ */
|
|
1662
|
+
), /* @__PURE__ */ import_react7.default.createElement("h1", null, "Success!"), /* @__PURE__ */ import_react7.default.createElement("h4", null, "Payment link created successfully.")), /* @__PURE__ */ import_react7.default.createElement(import_react_bootstrap3.Modal.Footer, null, /* @__PURE__ */ import_react7.default.createElement("button", { className: "paymentBtn", onClick: handleClose }, "Ok"))));
|
|
1652
1663
|
}
|
|
1653
1664
|
|
|
1654
1665
|
// src/app/components/RequestPayment/RequestPaymentonClick.tsx
|
|
1655
|
-
var
|
|
1666
|
+
var import_react8 = __toESM(require("react"));
|
|
1656
1667
|
var import_react_bootstrap4 = require("react-bootstrap");
|
|
1657
1668
|
function RequestPaymentonClick(props) {
|
|
1658
|
-
const [isLoading, setIsLoading] = (0,
|
|
1659
|
-
const [show, setShow] = (0,
|
|
1669
|
+
const [isLoading, setIsLoading] = (0, import_react8.useState)(false);
|
|
1670
|
+
const [show, setShow] = (0, import_react8.useState)(false);
|
|
1660
1671
|
const handleClose = () => setShow(false);
|
|
1661
1672
|
const handleShow = () => setShow(true);
|
|
1662
1673
|
const { fractalpayClientKey, amount, phone_number, orderID, onSuccess, onError } = props;
|
|
@@ -1690,7 +1701,7 @@ function RequestPaymentonClick(props) {
|
|
|
1690
1701
|
console.error("Error:", error);
|
|
1691
1702
|
});
|
|
1692
1703
|
};
|
|
1693
|
-
return /* @__PURE__ */
|
|
1704
|
+
return /* @__PURE__ */ import_react8.default.createElement(import_react8.default.Fragment, null, /* @__PURE__ */ import_react8.default.createElement(RequestPaymentstyles_default, null), /* @__PURE__ */ import_react8.default.createElement(
|
|
1694
1705
|
"button",
|
|
1695
1706
|
{
|
|
1696
1707
|
onClick: sendRequestPayment,
|
|
@@ -1698,7 +1709,7 @@ function RequestPaymentonClick(props) {
|
|
|
1698
1709
|
className: "paymentBtn"
|
|
1699
1710
|
},
|
|
1700
1711
|
isLoading ? "Loading..." : "Request Payment"
|
|
1701
|
-
), /* @__PURE__ */
|
|
1712
|
+
), /* @__PURE__ */ import_react8.default.createElement(import_react_bootstrap4.Modal, { className: "payment-suc", show, onHide: handleClose }, /* @__PURE__ */ import_react8.default.createElement(import_react_bootstrap4.Modal.Header, { closeButton: true }), /* @__PURE__ */ import_react8.default.createElement(import_react_bootstrap4.Modal.Body, null, onSuccess && /* @__PURE__ */ import_react8.default.createElement(
|
|
1702
1713
|
"svg",
|
|
1703
1714
|
{
|
|
1704
1715
|
width: "60",
|
|
@@ -1707,7 +1718,7 @@ function RequestPaymentonClick(props) {
|
|
|
1707
1718
|
fill: "none",
|
|
1708
1719
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1709
1720
|
},
|
|
1710
|
-
/* @__PURE__ */
|
|
1721
|
+
/* @__PURE__ */ import_react8.default.createElement(
|
|
1711
1722
|
"rect",
|
|
1712
1723
|
{
|
|
1713
1724
|
x: "0.5",
|
|
@@ -1718,14 +1729,14 @@ function RequestPaymentonClick(props) {
|
|
|
1718
1729
|
stroke: "#31B379"
|
|
1719
1730
|
}
|
|
1720
1731
|
),
|
|
1721
|
-
/* @__PURE__ */
|
|
1732
|
+
/* @__PURE__ */ import_react8.default.createElement("g", { clipPath: "url(#clip0_2659_5018)" }, /* @__PURE__ */ import_react8.default.createElement(
|
|
1722
1733
|
"path",
|
|
1723
1734
|
{
|
|
1724
1735
|
d: "M41.1778 22.248C40.7483 21.8184 40.0518 21.8184 39.6222 22.248L26.4435 35.4268L21.3778 30.3611C20.9483 29.9315 20.2518 29.9316 19.8222 30.3611C19.3926 30.7907 19.3926 31.4871 19.8222 31.9167L25.6657 37.7601C26.0951 38.1897 26.7921 38.1894 27.2213 37.7601L41.1778 23.8036C41.6074 23.3741 41.6074 22.6776 41.1778 22.248Z",
|
|
1725
1736
|
fill: "#31B379"
|
|
1726
1737
|
}
|
|
1727
1738
|
)),
|
|
1728
|
-
/* @__PURE__ */
|
|
1739
|
+
/* @__PURE__ */ import_react8.default.createElement("defs", null, /* @__PURE__ */ import_react8.default.createElement("clipPath", { id: "clip0_2659_5018" }, /* @__PURE__ */ import_react8.default.createElement(
|
|
1729
1740
|
"rect",
|
|
1730
1741
|
{
|
|
1731
1742
|
width: "22",
|
|
@@ -1734,21 +1745,21 @@ function RequestPaymentonClick(props) {
|
|
|
1734
1745
|
transform: "translate(19.5 19.0039)"
|
|
1735
1746
|
}
|
|
1736
1747
|
)))
|
|
1737
|
-
), onSuccess ? /* @__PURE__ */
|
|
1748
|
+
), onSuccess ? /* @__PURE__ */ import_react8.default.createElement(import_react8.default.Fragment, null, /* @__PURE__ */ import_react8.default.createElement("h1", null, "Success!"), /* @__PURE__ */ import_react8.default.createElement("h4", null, onSuccess)) : /* @__PURE__ */ import_react8.default.createElement(import_react8.default.Fragment, null, /* @__PURE__ */ import_react8.default.createElement("h1", null, "Error!"), /* @__PURE__ */ import_react8.default.createElement("h4", null, onError))), /* @__PURE__ */ import_react8.default.createElement(import_react_bootstrap4.Modal.Footer, null, /* @__PURE__ */ import_react8.default.createElement("button", { className: "paymentBtn", onClick: handleClose }, "Ok"))));
|
|
1738
1749
|
}
|
|
1739
1750
|
|
|
1740
1751
|
// src/app/components/RequestPayment/RqstPaymntInputField.tsx
|
|
1741
|
-
var
|
|
1752
|
+
var import_react9 = __toESM(require("react"));
|
|
1742
1753
|
var import_react_bootstrap5 = require("react-bootstrap");
|
|
1743
1754
|
var import_react_toastify2 = require("react-toastify");
|
|
1744
1755
|
var import_ReactToastify2 = require("react-toastify/dist/ReactToastify.css");
|
|
1745
1756
|
function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
1746
|
-
const [isLoading, setIsLoading] = (0,
|
|
1747
|
-
const [show, setShow] = (0,
|
|
1748
|
-
const [phoneNumber, setPhoneNumber] = (0,
|
|
1749
|
-
const [isValidNumber, setIsValidNumber] = (0,
|
|
1750
|
-
const [errorMessage, setErrorMessage] = (0,
|
|
1751
|
-
const [submitClicked, setSubmitClicked] = (0,
|
|
1757
|
+
const [isLoading, setIsLoading] = (0, import_react9.useState)(false);
|
|
1758
|
+
const [show, setShow] = (0, import_react9.useState)(false);
|
|
1759
|
+
const [phoneNumber, setPhoneNumber] = (0, import_react9.useState)("");
|
|
1760
|
+
const [isValidNumber, setIsValidNumber] = (0, import_react9.useState)(true);
|
|
1761
|
+
const [errorMessage, setErrorMessage] = (0, import_react9.useState)("");
|
|
1762
|
+
const [submitClicked, setSubmitClicked] = (0, import_react9.useState)(false);
|
|
1752
1763
|
const handleClose = () => setShow(false);
|
|
1753
1764
|
const handleShow = () => setShow(true);
|
|
1754
1765
|
const sendRequestPayment = () => {
|
|
@@ -1811,7 +1822,7 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
|
1811
1822
|
setErrorMessage(ErrorText.phonenumbervalid);
|
|
1812
1823
|
}
|
|
1813
1824
|
};
|
|
1814
|
-
return /* @__PURE__ */
|
|
1825
|
+
return /* @__PURE__ */ import_react9.default.createElement(import_react9.default.Fragment, null, /* @__PURE__ */ import_react9.default.createElement("div", { className: "payment-container" }, /* @__PURE__ */ import_react9.default.createElement("div", { className: "input-wrapper" }, /* @__PURE__ */ import_react9.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react9.default.createElement(
|
|
1815
1826
|
"input",
|
|
1816
1827
|
{
|
|
1817
1828
|
type: "text",
|
|
@@ -1821,7 +1832,7 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
|
1821
1832
|
maxLength: 10,
|
|
1822
1833
|
className: submitClicked && (!phoneNumber || !isValidNumber) ? "error" : ""
|
|
1823
1834
|
}
|
|
1824
|
-
), errorMessage && /* @__PURE__ */
|
|
1835
|
+
), errorMessage && /* @__PURE__ */ import_react9.default.createElement("div", { className: "error-message text-danger" }, errorMessage))), /* @__PURE__ */ import_react9.default.createElement("div", { className: "button-wrapper" }, /* @__PURE__ */ import_react9.default.createElement(
|
|
1825
1836
|
"button",
|
|
1826
1837
|
{
|
|
1827
1838
|
onClick: sendRequestPayment,
|
|
@@ -1829,7 +1840,7 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
|
1829
1840
|
className: "paymentBtn"
|
|
1830
1841
|
},
|
|
1831
1842
|
isLoading ? "Loading..." : "Request Payment"
|
|
1832
|
-
))), /* @__PURE__ */
|
|
1843
|
+
))), /* @__PURE__ */ import_react9.default.createElement(import_react_bootstrap5.Modal, { className: "payment-suc", show, onHide: handleClose }, /* @__PURE__ */ import_react9.default.createElement(import_react_bootstrap5.Modal.Header, { closeButton: true }), /* @__PURE__ */ import_react9.default.createElement(import_react_bootstrap5.Modal.Body, null, /* @__PURE__ */ import_react9.default.createElement(
|
|
1833
1844
|
"svg",
|
|
1834
1845
|
{
|
|
1835
1846
|
width: "60",
|
|
@@ -1838,7 +1849,7 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
|
1838
1849
|
fill: "none",
|
|
1839
1850
|
xmlns: "http://www.w3.org/2000/svg"
|
|
1840
1851
|
},
|
|
1841
|
-
/* @__PURE__ */
|
|
1852
|
+
/* @__PURE__ */ import_react9.default.createElement(
|
|
1842
1853
|
"rect",
|
|
1843
1854
|
{
|
|
1844
1855
|
x: "0.5",
|
|
@@ -1849,14 +1860,14 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
|
1849
1860
|
stroke: "#31B379"
|
|
1850
1861
|
}
|
|
1851
1862
|
),
|
|
1852
|
-
/* @__PURE__ */
|
|
1863
|
+
/* @__PURE__ */ import_react9.default.createElement("g", { clipPath: "url(#clip0_2659_5018)" }, /* @__PURE__ */ import_react9.default.createElement(
|
|
1853
1864
|
"path",
|
|
1854
1865
|
{
|
|
1855
1866
|
d: "M41.1778 22.248C40.7483 21.8184 40.0518 21.8184 39.6222 22.248L26.4435 35.4268L21.3778 30.3611C20.9483 29.9315 20.2518 29.9316 19.8222 30.3611C19.3926 30.7907 19.3926 31.4871 19.8222 31.9167L25.6657 37.7601C26.0951 38.1897 26.7921 38.1894 27.2213 37.7601L41.1778 23.8036C41.6074 23.3741 41.6074 22.6776 41.1778 22.248Z",
|
|
1856
1867
|
fill: "#31B379"
|
|
1857
1868
|
}
|
|
1858
1869
|
)),
|
|
1859
|
-
/* @__PURE__ */
|
|
1870
|
+
/* @__PURE__ */ import_react9.default.createElement("defs", null, /* @__PURE__ */ import_react9.default.createElement("clipPath", { id: "clip0_2659_5018" }, /* @__PURE__ */ import_react9.default.createElement(
|
|
1860
1871
|
"rect",
|
|
1861
1872
|
{
|
|
1862
1873
|
width: "22",
|
|
@@ -1865,19 +1876,19 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
|
1865
1876
|
transform: "translate(19.5 19.0039)"
|
|
1866
1877
|
}
|
|
1867
1878
|
)))
|
|
1868
|
-
), /* @__PURE__ */
|
|
1879
|
+
), /* @__PURE__ */ import_react9.default.createElement("h1", null, "Success!"), /* @__PURE__ */ import_react9.default.createElement("h4", null, "Payment link created successfully.")), /* @__PURE__ */ import_react9.default.createElement(import_react_bootstrap5.Modal.Footer, null, /* @__PURE__ */ import_react9.default.createElement("button", { className: "paymentBtn", onClick: handleClose }, "Ok"))), /* @__PURE__ */ import_react9.default.createElement(import_react_toastify2.ToastContainer, null));
|
|
1869
1880
|
}
|
|
1870
1881
|
|
|
1871
1882
|
// src/app/components/Payment/Payment.tsx
|
|
1872
|
-
var
|
|
1883
|
+
var import_react11 = __toESM(require("react"));
|
|
1873
1884
|
var import_node_forge = __toESM(require("node-forge"));
|
|
1874
1885
|
var import_react_toastify3 = require("react-toastify");
|
|
1875
1886
|
var import_react_bootstrap6 = require("react-bootstrap");
|
|
1876
1887
|
|
|
1877
1888
|
// src/app/components/Payment/Paymentstyles.tsx
|
|
1878
|
-
var
|
|
1889
|
+
var import_react10 = __toESM(require("react"));
|
|
1879
1890
|
function Paymentstyles() {
|
|
1880
|
-
return /* @__PURE__ */
|
|
1891
|
+
return /* @__PURE__ */ import_react10.default.createElement("style", null, `
|
|
1881
1892
|
.paymentBtn {
|
|
1882
1893
|
background-color: black;
|
|
1883
1894
|
border: none;
|
|
@@ -2803,7 +2814,7 @@ input {
|
|
|
2803
2814
|
// src/app/components/Payment/Payment.tsx
|
|
2804
2815
|
function Payment() {
|
|
2805
2816
|
var _a;
|
|
2806
|
-
const [state, setState] = (0,
|
|
2817
|
+
const [state, setState] = (0, import_react11.useState)({
|
|
2807
2818
|
show: false,
|
|
2808
2819
|
publicKey: "",
|
|
2809
2820
|
sessionKey: "",
|
|
@@ -2814,9 +2825,9 @@ function Payment() {
|
|
|
2814
2825
|
zip: "",
|
|
2815
2826
|
amount: ""
|
|
2816
2827
|
});
|
|
2817
|
-
const [isValid, setIsValid] = (0,
|
|
2818
|
-
const [isValidMonth, setIsValidMonth] = (0,
|
|
2819
|
-
const [data, setData] = (0,
|
|
2828
|
+
const [isValid, setIsValid] = (0, import_react11.useState)(false);
|
|
2829
|
+
const [isValidMonth, setIsValidMonth] = (0, import_react11.useState)(false);
|
|
2830
|
+
const [data, setData] = (0, import_react11.useState)(null);
|
|
2820
2831
|
const handlePaymentClick = async () => {
|
|
2821
2832
|
try {
|
|
2822
2833
|
const response = await fetch(`${baseUrl}generate-session`, {
|
|
@@ -2980,7 +2991,7 @@ function Payment() {
|
|
|
2980
2991
|
}
|
|
2981
2992
|
return "";
|
|
2982
2993
|
}
|
|
2983
|
-
return /* @__PURE__ */
|
|
2994
|
+
return /* @__PURE__ */ import_react11.default.createElement(import_react11.default.Fragment, null, /* @__PURE__ */ import_react11.default.createElement(Paymentstyles, null), /* @__PURE__ */ import_react11.default.createElement("div", { className: "" }, /* @__PURE__ */ import_react11.default.createElement(
|
|
2984
2995
|
"button",
|
|
2985
2996
|
{
|
|
2986
2997
|
className: "export-btn",
|
|
@@ -2988,7 +2999,7 @@ function Payment() {
|
|
|
2988
2999
|
onClick: () => handlePaymentClick()
|
|
2989
3000
|
},
|
|
2990
3001
|
"Payment"
|
|
2991
|
-
), /* @__PURE__ */
|
|
3002
|
+
), /* @__PURE__ */ import_react11.default.createElement(
|
|
2992
3003
|
import_react_bootstrap6.Modal,
|
|
2993
3004
|
{
|
|
2994
3005
|
show: state.show,
|
|
@@ -2997,8 +3008,8 @@ function Payment() {
|
|
|
2997
3008
|
})),
|
|
2998
3009
|
centered: true
|
|
2999
3010
|
},
|
|
3000
|
-
/* @__PURE__ */
|
|
3001
|
-
/* @__PURE__ */
|
|
3011
|
+
/* @__PURE__ */ import_react11.default.createElement(import_react_bootstrap6.Modal.Header, { closeButton: true }),
|
|
3012
|
+
/* @__PURE__ */ import_react11.default.createElement(import_react_bootstrap6.Modal.Body, null, /* @__PURE__ */ import_react11.default.createElement("div", { className: "payment-popup" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "row" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "" }, /* @__PURE__ */ import_react11.default.createElement("div", { id: "Checkout", className: "inline" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "header" }, /* @__PURE__ */ import_react11.default.createElement("h1", null, "Pay")), /* @__PURE__ */ import_react11.default.createElement("form", { id: "PaymentForm", className: "payment-form" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "form-group", style: { display: "none" } }, /* @__PURE__ */ import_react11.default.createElement("label", null, "Payment amount"), /* @__PURE__ */ import_react11.default.createElement("div", { className: "input-group" }, /* @__PURE__ */ import_react11.default.createElement("span", { className: "input-group-addon" }, "$"), /* @__PURE__ */ import_react11.default.createElement(
|
|
3002
3013
|
"input",
|
|
3003
3014
|
{
|
|
3004
3015
|
type: "text",
|
|
@@ -3007,13 +3018,13 @@ function Payment() {
|
|
|
3007
3018
|
className: "form-control",
|
|
3008
3019
|
id: ""
|
|
3009
3020
|
}
|
|
3010
|
-
)), /* @__PURE__ */
|
|
3021
|
+
)), /* @__PURE__ */ import_react11.default.createElement(
|
|
3011
3022
|
"span",
|
|
3012
3023
|
{
|
|
3013
3024
|
id: "amount-error",
|
|
3014
3025
|
style: { color: "red", display: "none" }
|
|
3015
3026
|
}
|
|
3016
|
-
)), /* @__PURE__ */
|
|
3027
|
+
)), /* @__PURE__ */ import_react11.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react11.default.createElement("label", null, "Name on card"), /* @__PURE__ */ import_react11.default.createElement(
|
|
3017
3028
|
"input",
|
|
3018
3029
|
{
|
|
3019
3030
|
id: "NameOnCard",
|
|
@@ -3022,13 +3033,13 @@ function Payment() {
|
|
|
3022
3033
|
maxLength: 100,
|
|
3023
3034
|
placeholder: "Name"
|
|
3024
3035
|
}
|
|
3025
|
-
), /* @__PURE__ */
|
|
3036
|
+
), /* @__PURE__ */ import_react11.default.createElement(
|
|
3026
3037
|
"span",
|
|
3027
3038
|
{
|
|
3028
3039
|
id: "NameOnCard-error",
|
|
3029
3040
|
style: { color: "red", display: "none" }
|
|
3030
3041
|
}
|
|
3031
|
-
)), /* @__PURE__ */
|
|
3042
|
+
)), /* @__PURE__ */ import_react11.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react11.default.createElement(
|
|
3032
3043
|
"input",
|
|
3033
3044
|
{
|
|
3034
3045
|
"data-token": "card_number",
|
|
@@ -3039,7 +3050,7 @@ function Payment() {
|
|
|
3039
3050
|
placeholder: "0000 0000 0000 0000",
|
|
3040
3051
|
onChange: handleCardNumberChange
|
|
3041
3052
|
}
|
|
3042
|
-
), state.error && /* @__PURE__ */
|
|
3053
|
+
), state.error && /* @__PURE__ */ import_react11.default.createElement("div", { style: { color: "red" } }, state.error)), /* @__PURE__ */ import_react11.default.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ import_react11.default.createElement(
|
|
3043
3054
|
"input",
|
|
3044
3055
|
{
|
|
3045
3056
|
"data-token": "exp_month",
|
|
@@ -3050,14 +3061,14 @@ function Payment() {
|
|
|
3050
3061
|
maxLength: 2,
|
|
3051
3062
|
onChange: (e) => handleMonthChange(e)
|
|
3052
3063
|
}
|
|
3053
|
-
), isValidMonth && /* @__PURE__ */
|
|
3064
|
+
), isValidMonth && /* @__PURE__ */ import_react11.default.createElement(
|
|
3054
3065
|
"span",
|
|
3055
3066
|
{
|
|
3056
3067
|
id: "card_number-error",
|
|
3057
3068
|
style: { color: "red", fontSize: "15px" }
|
|
3058
3069
|
},
|
|
3059
3070
|
(_a = ErrorText) == null ? void 0 : _a.montherror
|
|
3060
|
-
)), /* @__PURE__ */
|
|
3071
|
+
)), /* @__PURE__ */ import_react11.default.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ import_react11.default.createElement(
|
|
3061
3072
|
"input",
|
|
3062
3073
|
{
|
|
3063
3074
|
"data-token": "exp_year",
|
|
@@ -3068,7 +3079,7 @@ function Payment() {
|
|
|
3068
3079
|
value: state.year,
|
|
3069
3080
|
onChange: (e) => handleYearChange(e)
|
|
3070
3081
|
}
|
|
3071
|
-
), state.yearError && /* @__PURE__ */
|
|
3082
|
+
), state.yearError && /* @__PURE__ */ import_react11.default.createElement("span", { id: "exp_year-error", style: { color: "red" } }, state.yearError)), /* @__PURE__ */ import_react11.default.createElement("div", { className: "security-code-group form-group" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react11.default.createElement(
|
|
3072
3083
|
"input",
|
|
3073
3084
|
{
|
|
3074
3085
|
"data-token": "cvv",
|
|
@@ -3079,7 +3090,7 @@ function Payment() {
|
|
|
3079
3090
|
placeholder: "CVV",
|
|
3080
3091
|
onChange: (e) => handleCVVChange(e)
|
|
3081
3092
|
}
|
|
3082
|
-
), /* @__PURE__ */
|
|
3093
|
+
), /* @__PURE__ */ import_react11.default.createElement("i", { id: "cvc", className: "fa fa-question-circle" }), state.cvvError && /* @__PURE__ */ import_react11.default.createElement("span", { id: "cvv-error", style: { color: "red" } }, state.cvvError)), /* @__PURE__ */ import_react11.default.createElement("div", { className: "cvc-preview-container two-card hide" }, /* @__PURE__ */ import_react11.default.createElement("div", { className: "amex-cvc-preview" }), /* @__PURE__ */ import_react11.default.createElement("div", { className: "visa-mc-dis-cvc-preview" }))), /* @__PURE__ */ import_react11.default.createElement("div", { className: "zip-code-group form-group" }, /* @__PURE__ */ import_react11.default.createElement("label", null, "Postal code"), /* @__PURE__ */ import_react11.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react11.default.createElement(
|
|
3083
3094
|
"input",
|
|
3084
3095
|
{
|
|
3085
3096
|
id: "ZIPCode",
|
|
@@ -3091,7 +3102,7 @@ function Payment() {
|
|
|
3091
3102
|
value: state.zip,
|
|
3092
3103
|
onChange: (e) => handleZIP(e)
|
|
3093
3104
|
}
|
|
3094
|
-
), /* @__PURE__ */
|
|
3105
|
+
), /* @__PURE__ */ import_react11.default.createElement(
|
|
3095
3106
|
"a",
|
|
3096
3107
|
{
|
|
3097
3108
|
tabIndex: 0,
|
|
@@ -3101,15 +3112,15 @@ function Payment() {
|
|
|
3101
3112
|
"data-placement": "left",
|
|
3102
3113
|
"data-content": "Enter the ZIP/Postal code for your credit card billing address."
|
|
3103
3114
|
},
|
|
3104
|
-
/* @__PURE__ */
|
|
3105
|
-
), /* @__PURE__ */
|
|
3115
|
+
/* @__PURE__ */ import_react11.default.createElement("i", { className: "fa fa-question-circle" })
|
|
3116
|
+
), /* @__PURE__ */ import_react11.default.createElement(
|
|
3106
3117
|
"span",
|
|
3107
3118
|
{
|
|
3108
3119
|
id: "ZIPCode-error",
|
|
3109
3120
|
style: { color: "red", display: "none" }
|
|
3110
3121
|
},
|
|
3111
3122
|
ErrorText.fieldrequired
|
|
3112
|
-
))), /* @__PURE__ */
|
|
3123
|
+
))), /* @__PURE__ */ import_react11.default.createElement("div", { className: "form-group top-amnt" }, /* @__PURE__ */ import_react11.default.createElement("div", null, /* @__PURE__ */ import_react11.default.createElement("label", null, "Payment amount"), /* @__PURE__ */ import_react11.default.createElement("div", { className: "amount-placeholder" }, /* @__PURE__ */ import_react11.default.createElement(
|
|
3113
3124
|
"input",
|
|
3114
3125
|
{
|
|
3115
3126
|
id: "Amount",
|
|
@@ -3121,7 +3132,7 @@ function Payment() {
|
|
|
3121
3132
|
onChange: (e) => handleAmount(e),
|
|
3122
3133
|
onBlur: handleAmountBlur
|
|
3123
3134
|
}
|
|
3124
|
-
))), /* @__PURE__ */
|
|
3135
|
+
))), /* @__PURE__ */ import_react11.default.createElement("div", { className: "card-row" }, /* @__PURE__ */ import_react11.default.createElement("span", { className: "visa" }), /* @__PURE__ */ import_react11.default.createElement("span", { className: "mastercard" }), /* @__PURE__ */ import_react11.default.createElement("span", { className: "amex" }), /* @__PURE__ */ import_react11.default.createElement("span", { className: "discover" }))), /* @__PURE__ */ import_react11.default.createElement(
|
|
3125
3136
|
"button",
|
|
3126
3137
|
{
|
|
3127
3138
|
type: "button",
|
|
@@ -3130,7 +3141,7 @@ function Payment() {
|
|
|
3130
3141
|
className: "btn btn-block btn-success submit-button"
|
|
3131
3142
|
},
|
|
3132
3143
|
"Pay"
|
|
3133
|
-
)), /* @__PURE__ */
|
|
3144
|
+
)), /* @__PURE__ */ import_react11.default.createElement("div", { className: "powerd-by-part" }, /* @__PURE__ */ import_react11.default.createElement(
|
|
3134
3145
|
"svg",
|
|
3135
3146
|
{
|
|
3136
3147
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -3138,14 +3149,14 @@ function Payment() {
|
|
|
3138
3149
|
height: "20",
|
|
3139
3150
|
viewBox: "0 0 26 26"
|
|
3140
3151
|
},
|
|
3141
|
-
/* @__PURE__ */
|
|
3152
|
+
/* @__PURE__ */ import_react11.default.createElement(
|
|
3142
3153
|
"path",
|
|
3143
3154
|
{
|
|
3144
3155
|
fill: "currentColor",
|
|
3145
3156
|
d: "M23.633 5.028a1.074 1.074 0 0 0-.777-.366c-2.295-.06-5.199-2.514-7.119-3.477C14.551.592 13.768.201 13.18.098a1.225 1.225 0 0 0-.36.001c-.588.103-1.371.494-2.556 1.087c-1.92.962-4.824 3.416-7.119 3.476a1.08 1.08 0 0 0-.778.366a1.167 1.167 0 0 0-.291.834c.493 10.023 4.088 16.226 10.396 19.831c.164.093.346.141.527.141s.363-.048.528-.141c6.308-3.605 9.902-9.808 10.396-19.831a1.161 1.161 0 0 0-.29-.834zM18.617 8.97l-5.323 7.855c-.191.282-.491.469-.788.469c-.298 0-.629-.163-.838-.372l-3.752-3.753a.656.656 0 0 1 0-.926l.927-.929a.658.658 0 0 1 .926 0l2.44 2.44l4.239-6.257a.657.657 0 0 1 .91-.173l1.085.736a.657.657 0 0 1 .174.91z"
|
|
3146
3157
|
}
|
|
3147
3158
|
)
|
|
3148
|
-
), "Secure payments powered by Fractal", /* @__PURE__ */
|
|
3159
|
+
), "Secure payments powered by Fractal", /* @__PURE__ */ import_react11.default.createElement(
|
|
3149
3160
|
"img",
|
|
3150
3161
|
{
|
|
3151
3162
|
src: "https://ui.fractalpay.com/favicon.ico",
|
|
@@ -3157,7 +3168,7 @@ function Payment() {
|
|
|
3157
3168
|
}
|
|
3158
3169
|
|
|
3159
3170
|
// src/app/components/Transaction/CompletedTransactions.tsx
|
|
3160
|
-
var
|
|
3171
|
+
var import_react13 = __toESM(require("react"));
|
|
3161
3172
|
var import_react_bootstrap7 = require("react-bootstrap");
|
|
3162
3173
|
var import_react_bs_datatable = require("react-bs-datatable");
|
|
3163
3174
|
var import_react_datepicker = __toESM(require("react-datepicker"));
|
|
@@ -3165,14 +3176,14 @@ var import_react_datepicker2 = require("react-datepicker/dist/react-datepicker.c
|
|
|
3165
3176
|
var import_react_toastify4 = require("react-toastify");
|
|
3166
3177
|
|
|
3167
3178
|
// src/app/components/Pagination/Pagination.tsx
|
|
3168
|
-
var
|
|
3179
|
+
var import_react12 = __toESM(require("react"));
|
|
3169
3180
|
function PaginationPg({ totalPages, onPageChange, current }) {
|
|
3170
|
-
const [currentPage, setCurrentPage] = (0,
|
|
3171
|
-
const [showPages, setShowPages] = (0,
|
|
3172
|
-
(0,
|
|
3181
|
+
const [currentPage, setCurrentPage] = (0, import_react12.useState)(current);
|
|
3182
|
+
const [showPages, setShowPages] = (0, import_react12.useState)(false);
|
|
3183
|
+
(0, import_react12.useEffect)(() => {
|
|
3173
3184
|
setCurrentPage(current);
|
|
3174
3185
|
}, [current]);
|
|
3175
|
-
(0,
|
|
3186
|
+
(0, import_react12.useEffect)(() => {
|
|
3176
3187
|
setTimeout(() => {
|
|
3177
3188
|
setShowPages(true);
|
|
3178
3189
|
}, 1e3);
|
|
@@ -3208,7 +3219,7 @@ function PaginationPg({ totalPages, onPageChange, current }) {
|
|
|
3208
3219
|
if (currentPage > 3) {
|
|
3209
3220
|
pageNumbers.push(renderPageNumber(1));
|
|
3210
3221
|
if (currentPage > 4) {
|
|
3211
|
-
pageNumbers.push(/* @__PURE__ */
|
|
3222
|
+
pageNumbers.push(/* @__PURE__ */ import_react12.default.createElement("li", { key: "start-break", className: "page-item disabled" }, /* @__PURE__ */ import_react12.default.createElement("span", { className: "page-link" }, "...")));
|
|
3212
3223
|
}
|
|
3213
3224
|
}
|
|
3214
3225
|
const startPage = Math.max(currentPage - 1, 1);
|
|
@@ -3218,15 +3229,15 @@ function PaginationPg({ totalPages, onPageChange, current }) {
|
|
|
3218
3229
|
}
|
|
3219
3230
|
if (currentPage < totalPages - 2) {
|
|
3220
3231
|
if (currentPage < totalPages - 3) {
|
|
3221
|
-
pageNumbers.push(/* @__PURE__ */
|
|
3232
|
+
pageNumbers.push(/* @__PURE__ */ import_react12.default.createElement("li", { key: "end-break", className: "page-item disabled" }, /* @__PURE__ */ import_react12.default.createElement("span", { className: "page-link" }, "...")));
|
|
3222
3233
|
}
|
|
3223
3234
|
pageNumbers.push(renderPageNumber(totalPages));
|
|
3224
3235
|
}
|
|
3225
3236
|
}
|
|
3226
3237
|
return pageNumbers;
|
|
3227
3238
|
};
|
|
3228
|
-
const renderPageNumber = (pageNumber) => /* @__PURE__ */
|
|
3229
|
-
return /* @__PURE__ */
|
|
3239
|
+
const renderPageNumber = (pageNumber) => /* @__PURE__ */ import_react12.default.createElement("li", { key: pageNumber, className: `page-item ${currentPage === pageNumber ? "active" : ""}` }, /* @__PURE__ */ import_react12.default.createElement("a", { className: "page-link cursor-pointer", onClick: (e) => handlePageClick(e, pageNumber) }, pageNumber));
|
|
3240
|
+
return /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, /* @__PURE__ */ import_react12.default.createElement("nav", { className: "app-pagination py-2" }, /* @__PURE__ */ import_react12.default.createElement("ul", { className: "pagination justify-content-center" }, /* @__PURE__ */ import_react12.default.createElement("li", { className: `page-item ${currentPage === 1 ? "disabled" : ""}` }, /* @__PURE__ */ import_react12.default.createElement("a", { className: "page-link cursor-pointer", onClick: handlePrevious }, /* @__PURE__ */ import_react12.default.createElement("span", null, "\u2B9C"))), showPages && getPageNumbers(), /* @__PURE__ */ import_react12.default.createElement("li", { className: `page-item ${currentPage === totalPages ? "disabled" : ""}` }, /* @__PURE__ */ import_react12.default.createElement("a", { className: "page-link cursor-pointer", onClick: handleNext }, /* @__PURE__ */ import_react12.default.createElement("span", null, "\u2B9E"))))));
|
|
3230
3241
|
}
|
|
3231
3242
|
|
|
3232
3243
|
// src/app/components/Transaction/CompletedTransactions.tsx
|
|
@@ -3264,10 +3275,10 @@ var STORY_HEADERS = [
|
|
|
3264
3275
|
}
|
|
3265
3276
|
];
|
|
3266
3277
|
function CompletedTransactions(props) {
|
|
3267
|
-
const [dataList, setDataList] = (0,
|
|
3268
|
-
const [startDate, setStartDate] = (0,
|
|
3269
|
-
const [endDate, setEndDate] = (0,
|
|
3270
|
-
const [state, setState] = (0,
|
|
3278
|
+
const [dataList, setDataList] = (0, import_react13.useState)([]);
|
|
3279
|
+
const [startDate, setStartDate] = (0, import_react13.useState)(null);
|
|
3280
|
+
const [endDate, setEndDate] = (0, import_react13.useState)(null);
|
|
3281
|
+
const [state, setState] = (0, import_react13.useState)({
|
|
3271
3282
|
page: 1,
|
|
3272
3283
|
totalPage: 0,
|
|
3273
3284
|
data: [],
|
|
@@ -3390,18 +3401,18 @@ function CompletedTransactions(props) {
|
|
|
3390
3401
|
}
|
|
3391
3402
|
}
|
|
3392
3403
|
};
|
|
3393
|
-
(0,
|
|
3404
|
+
(0, import_react13.useEffect)(() => {
|
|
3394
3405
|
fetchData(state.page, startDate, endDate);
|
|
3395
3406
|
}, [state.page]);
|
|
3396
3407
|
const handlePageChange = (pageNumber) => {
|
|
3397
3408
|
setState((prev) => __spreadProps(__spreadValues({}, prev), { page: pageNumber }));
|
|
3398
3409
|
fetchData(pageNumber, startDate, endDate);
|
|
3399
3410
|
};
|
|
3400
|
-
return /* @__PURE__ */
|
|
3411
|
+
return /* @__PURE__ */ import_react13.default.createElement(import_react13.default.Fragment, null, /* @__PURE__ */ import_react13.default.createElement("style", null, `
|
|
3401
3412
|
.react-datepicker-wrapper:first-child {
|
|
3402
3413
|
margin-right: 10px;
|
|
3403
3414
|
}
|
|
3404
|
-
`), /* @__PURE__ */
|
|
3415
|
+
`), /* @__PURE__ */ import_react13.default.createElement("div", { className: "mb-5" }, /* @__PURE__ */ import_react13.default.createElement("div", null, /* @__PURE__ */ import_react13.default.createElement("div", { style: { display: "flex" } }, /* @__PURE__ */ import_react13.default.createElement("div", { style: { display: "flex", marginRight: "10px", marginTop: "25px" } }, /* @__PURE__ */ import_react13.default.createElement(
|
|
3405
3416
|
import_react_datepicker.default,
|
|
3406
3417
|
{
|
|
3407
3418
|
selected: startDate,
|
|
@@ -3412,7 +3423,7 @@ function CompletedTransactions(props) {
|
|
|
3412
3423
|
placeholderText: "Start Date",
|
|
3413
3424
|
required: true
|
|
3414
3425
|
}
|
|
3415
|
-
), /* @__PURE__ */
|
|
3426
|
+
), /* @__PURE__ */ import_react13.default.createElement(
|
|
3416
3427
|
import_react_datepicker.default,
|
|
3417
3428
|
{
|
|
3418
3429
|
selected: endDate,
|
|
@@ -3423,7 +3434,7 @@ function CompletedTransactions(props) {
|
|
|
3423
3434
|
minDate: startDate,
|
|
3424
3435
|
placeholderText: "End Date"
|
|
3425
3436
|
}
|
|
3426
|
-
)), /* @__PURE__ */
|
|
3437
|
+
)), /* @__PURE__ */ import_react13.default.createElement("button", { className: "export-btn1", onClick: handleExport }, "Export")), /* @__PURE__ */ import_react13.default.createElement(
|
|
3427
3438
|
import_react_bs_datatable.DatatableWrapper,
|
|
3428
3439
|
{
|
|
3429
3440
|
body: dataList,
|
|
@@ -3435,20 +3446,20 @@ function CompletedTransactions(props) {
|
|
|
3435
3446
|
}
|
|
3436
3447
|
}
|
|
3437
3448
|
},
|
|
3438
|
-
/* @__PURE__ */
|
|
3439
|
-
/* @__PURE__ */
|
|
3440
|
-
/* @__PURE__ */
|
|
3449
|
+
/* @__PURE__ */ import_react13.default.createElement(import_react_bootstrap7.Row, { className: "mb-4 p-2" }, /* @__PURE__ */ import_react13.default.createElement(import_react_bootstrap7.Col, { xs: 12, sm: 6, lg: 4, className: "d-flex flex-col justify-content-lg-start align-items-center justify-content-sm-start mb-2 mb-sm-0" }, /* @__PURE__ */ import_react13.default.createElement(import_react_bs_datatable.PaginationOptions, null)), /* @__PURE__ */ import_react13.default.createElement(import_react_bootstrap7.Col, { xs: 12, lg: 4, className: "d-flex flex-col justify-content-end align-items-end" }), /* @__PURE__ */ import_react13.default.createElement(import_react_bootstrap7.Col, { xs: 12, sm: 6, lg: 4, className: "d-flex flex-col justify-content-end align-items-end" }, /* @__PURE__ */ import_react13.default.createElement(import_react_bs_datatable.Filter, null))),
|
|
3450
|
+
/* @__PURE__ */ import_react13.default.createElement(import_react_bootstrap7.Row, null, /* @__PURE__ */ import_react13.default.createElement("div", { className: "responsive-tbl" }, /* @__PURE__ */ import_react13.default.createElement(import_react_bootstrap7.Table, null, /* @__PURE__ */ import_react13.default.createElement(import_react_bs_datatable.TableHeader, null), /* @__PURE__ */ import_react13.default.createElement(import_react_bs_datatable.TableBody, null)))),
|
|
3451
|
+
/* @__PURE__ */ import_react13.default.createElement(PaginationPg, { totalPages: state.totalPage, onPageChange: handlePageChange, current: state.page })
|
|
3441
3452
|
))));
|
|
3442
3453
|
}
|
|
3443
3454
|
|
|
3444
3455
|
// src/app/components/Payment/TockenizPay.tsx
|
|
3445
|
-
var
|
|
3456
|
+
var import_react14 = __toESM(require("react"));
|
|
3446
3457
|
var import_react_bootstrap8 = require("react-bootstrap");
|
|
3447
3458
|
var import_react_toastify5 = require("react-toastify");
|
|
3448
3459
|
var import_node_forge2 = __toESM(require("node-forge"));
|
|
3449
3460
|
var import_credit_card_type = __toESM(require("credit-card-type"));
|
|
3450
3461
|
function TockenizPay() {
|
|
3451
|
-
const [state, setState] = (0,
|
|
3462
|
+
const [state, setState] = (0, import_react14.useState)({
|
|
3452
3463
|
show: false,
|
|
3453
3464
|
publicKey: "",
|
|
3454
3465
|
sessionKey: "",
|
|
@@ -3459,10 +3470,10 @@ function TockenizPay() {
|
|
|
3459
3470
|
zip: "",
|
|
3460
3471
|
amount: ""
|
|
3461
3472
|
});
|
|
3462
|
-
const [cardTypeDetail, setCardTypeDetail] = (0,
|
|
3463
|
-
const [isValid, setIsValid] = (0,
|
|
3464
|
-
const [isValidMonth, setIsValidMonth] = (0,
|
|
3465
|
-
const [data, setData] = (0,
|
|
3473
|
+
const [cardTypeDetail, setCardTypeDetail] = (0, import_react14.useState)(null);
|
|
3474
|
+
const [isValid, setIsValid] = (0, import_react14.useState)(false);
|
|
3475
|
+
const [isValidMonth, setIsValidMonth] = (0, import_react14.useState)(false);
|
|
3476
|
+
const [data, setData] = (0, import_react14.useState)(null);
|
|
3466
3477
|
const handlePaymentClick = async () => {
|
|
3467
3478
|
try {
|
|
3468
3479
|
const response = await fetch(`${baseUrl}/generate-session`, {
|
|
@@ -3674,7 +3685,7 @@ function TockenizPay() {
|
|
|
3674
3685
|
}
|
|
3675
3686
|
return "";
|
|
3676
3687
|
}
|
|
3677
|
-
return /* @__PURE__ */
|
|
3688
|
+
return /* @__PURE__ */ import_react14.default.createElement("div", null, /* @__PURE__ */ import_react14.default.createElement(import_react_toastify5.ToastContainer, null), /* @__PURE__ */ import_react14.default.createElement(
|
|
3678
3689
|
"button",
|
|
3679
3690
|
{
|
|
3680
3691
|
className: "export-btn mt-4",
|
|
@@ -3682,7 +3693,7 @@ function TockenizPay() {
|
|
|
3682
3693
|
onClick: () => handlePaymentClick()
|
|
3683
3694
|
},
|
|
3684
3695
|
"TokenizePay"
|
|
3685
|
-
), /* @__PURE__ */
|
|
3696
|
+
), /* @__PURE__ */ import_react14.default.createElement(
|
|
3686
3697
|
import_react_bootstrap8.Modal,
|
|
3687
3698
|
{
|
|
3688
3699
|
show: state.show,
|
|
@@ -3691,8 +3702,8 @@ function TockenizPay() {
|
|
|
3691
3702
|
})),
|
|
3692
3703
|
centered: true
|
|
3693
3704
|
},
|
|
3694
|
-
/* @__PURE__ */
|
|
3695
|
-
/* @__PURE__ */
|
|
3705
|
+
/* @__PURE__ */ import_react14.default.createElement(import_react_bootstrap8.Modal.Header, { closeButton: true }),
|
|
3706
|
+
/* @__PURE__ */ import_react14.default.createElement(import_react_bootstrap8.Modal.Body, null, /* @__PURE__ */ import_react14.default.createElement("div", { className: "payment-popup" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "row" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "" }, /* @__PURE__ */ import_react14.default.createElement("div", { id: "Checkout", className: "inline" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "header" }, /* @__PURE__ */ import_react14.default.createElement("h1", null, "Pay")), /* @__PURE__ */ import_react14.default.createElement("form", { id: "PaymentForm", className: "payment-form" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react14.default.createElement("label", null, "Name on card"), /* @__PURE__ */ import_react14.default.createElement(
|
|
3696
3707
|
"input",
|
|
3697
3708
|
{
|
|
3698
3709
|
id: "NameOnCard",
|
|
@@ -3701,13 +3712,13 @@ function TockenizPay() {
|
|
|
3701
3712
|
maxLength: 100,
|
|
3702
3713
|
placeholder: "Name"
|
|
3703
3714
|
}
|
|
3704
|
-
), /* @__PURE__ */
|
|
3715
|
+
), /* @__PURE__ */ import_react14.default.createElement(
|
|
3705
3716
|
"span",
|
|
3706
3717
|
{
|
|
3707
3718
|
id: "NameOnCard-error",
|
|
3708
3719
|
style: { color: "red", display: "none" }
|
|
3709
3720
|
}
|
|
3710
|
-
)), /* @__PURE__ */
|
|
3721
|
+
)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react14.default.createElement(
|
|
3711
3722
|
"input",
|
|
3712
3723
|
{
|
|
3713
3724
|
"data-token": "card_number",
|
|
@@ -3718,7 +3729,7 @@ function TockenizPay() {
|
|
|
3718
3729
|
placeholder: "0000 0000 0000 0000",
|
|
3719
3730
|
onChange: handleCardNumberChange
|
|
3720
3731
|
}
|
|
3721
|
-
), state.error && /* @__PURE__ */
|
|
3732
|
+
), state.error && /* @__PURE__ */ import_react14.default.createElement("div", { style: { color: "red" } }, state.error)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ import_react14.default.createElement(
|
|
3722
3733
|
"input",
|
|
3723
3734
|
{
|
|
3724
3735
|
"data-token": "exp_month",
|
|
@@ -3729,14 +3740,14 @@ function TockenizPay() {
|
|
|
3729
3740
|
maxLength: 2,
|
|
3730
3741
|
onChange: (e) => handleMonthChange(e)
|
|
3731
3742
|
}
|
|
3732
|
-
), isValidMonth && /* @__PURE__ */
|
|
3743
|
+
), isValidMonth && /* @__PURE__ */ import_react14.default.createElement(
|
|
3733
3744
|
"span",
|
|
3734
3745
|
{
|
|
3735
3746
|
id: "card_number-error",
|
|
3736
3747
|
style: { color: "red", fontSize: "15px" }
|
|
3737
3748
|
},
|
|
3738
3749
|
"Please write month only 1 to 12"
|
|
3739
|
-
)), /* @__PURE__ */
|
|
3750
|
+
)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ import_react14.default.createElement(
|
|
3740
3751
|
"input",
|
|
3741
3752
|
{
|
|
3742
3753
|
"data-token": "exp_year",
|
|
@@ -3747,7 +3758,7 @@ function TockenizPay() {
|
|
|
3747
3758
|
value: state.year,
|
|
3748
3759
|
onChange: (e) => handleYearChange(e)
|
|
3749
3760
|
}
|
|
3750
|
-
), state.yearError && /* @__PURE__ */
|
|
3761
|
+
), state.yearError && /* @__PURE__ */ import_react14.default.createElement("span", { id: "exp_year-error", style: { color: "red" } }, state.yearError)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "security-code-group form-group" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react14.default.createElement(
|
|
3751
3762
|
"input",
|
|
3752
3763
|
{
|
|
3753
3764
|
"data-token": "cvv",
|
|
@@ -3758,7 +3769,7 @@ function TockenizPay() {
|
|
|
3758
3769
|
placeholder: "CVV",
|
|
3759
3770
|
onChange: (e) => handleCVVChange(e)
|
|
3760
3771
|
}
|
|
3761
|
-
), /* @__PURE__ */
|
|
3772
|
+
), /* @__PURE__ */ import_react14.default.createElement("i", { id: "cvc", className: "fa fa-question-circle" }), state.cvvError && /* @__PURE__ */ import_react14.default.createElement("span", { id: "cvv-error", style: { color: "red" } }, state.cvvError)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "cvc-preview-container two-card hide" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "amex-cvc-preview" }), /* @__PURE__ */ import_react14.default.createElement("div", { className: "visa-mc-dis-cvc-preview" }))), /* @__PURE__ */ import_react14.default.createElement("div", { className: "zip-code-group form-group" }, /* @__PURE__ */ import_react14.default.createElement("label", null, "Postal code"), /* @__PURE__ */ import_react14.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react14.default.createElement(
|
|
3762
3773
|
"input",
|
|
3763
3774
|
{
|
|
3764
3775
|
id: "ZIPCode",
|
|
@@ -3770,7 +3781,7 @@ function TockenizPay() {
|
|
|
3770
3781
|
value: state.zip,
|
|
3771
3782
|
onChange: (e) => handleZIP(e)
|
|
3772
3783
|
}
|
|
3773
|
-
), /* @__PURE__ */
|
|
3784
|
+
), /* @__PURE__ */ import_react14.default.createElement(
|
|
3774
3785
|
"a",
|
|
3775
3786
|
{
|
|
3776
3787
|
tabIndex: 0,
|
|
@@ -3780,15 +3791,15 @@ function TockenizPay() {
|
|
|
3780
3791
|
"data-placement": "left",
|
|
3781
3792
|
"data-content": "Enter the ZIP/Postal code for your credit card billing address."
|
|
3782
3793
|
},
|
|
3783
|
-
/* @__PURE__ */
|
|
3784
|
-
), /* @__PURE__ */
|
|
3794
|
+
/* @__PURE__ */ import_react14.default.createElement("i", { className: "fa fa-question-circle" })
|
|
3795
|
+
), /* @__PURE__ */ import_react14.default.createElement(
|
|
3785
3796
|
"span",
|
|
3786
3797
|
{
|
|
3787
3798
|
id: "ZIPCode-error",
|
|
3788
3799
|
style: { color: "red", display: "none" }
|
|
3789
3800
|
},
|
|
3790
3801
|
"This field is required"
|
|
3791
|
-
))), /* @__PURE__ */
|
|
3802
|
+
))), /* @__PURE__ */ import_react14.default.createElement("div", { className: "form-group top-amnt" }, /* @__PURE__ */ import_react14.default.createElement("div", null, /* @__PURE__ */ import_react14.default.createElement("label", null, "Payment amount"), /* @__PURE__ */ import_react14.default.createElement("div", { className: "amount-placeholder" }, /* @__PURE__ */ import_react14.default.createElement(
|
|
3792
3803
|
"input",
|
|
3793
3804
|
{
|
|
3794
3805
|
id: "Amount",
|
|
@@ -3800,7 +3811,7 @@ function TockenizPay() {
|
|
|
3800
3811
|
onChange: (e) => handleAmount(e),
|
|
3801
3812
|
onBlur: handleAmountBlur
|
|
3802
3813
|
}
|
|
3803
|
-
))), /* @__PURE__ */
|
|
3814
|
+
))), /* @__PURE__ */ import_react14.default.createElement("div", { className: "card-row" }, /* @__PURE__ */ import_react14.default.createElement("span", { className: "visa" }), /* @__PURE__ */ import_react14.default.createElement("span", { className: "mastercard" }), /* @__PURE__ */ import_react14.default.createElement("span", { className: "amex" }), /* @__PURE__ */ import_react14.default.createElement("span", { className: "discover" }))), /* @__PURE__ */ import_react14.default.createElement(
|
|
3804
3815
|
"button",
|
|
3805
3816
|
{
|
|
3806
3817
|
type: "button",
|
|
@@ -3809,7 +3820,7 @@ function TockenizPay() {
|
|
|
3809
3820
|
className: "btn btn-block btn-success submit-button"
|
|
3810
3821
|
},
|
|
3811
3822
|
"Submit"
|
|
3812
|
-
)), /* @__PURE__ */
|
|
3823
|
+
)), /* @__PURE__ */ import_react14.default.createElement("div", { className: "powerd-by-part" }, /* @__PURE__ */ import_react14.default.createElement(
|
|
3813
3824
|
"svg",
|
|
3814
3825
|
{
|
|
3815
3826
|
xmlns: "http://www.w3.org/2000/svg",
|
|
@@ -3817,14 +3828,14 @@ function TockenizPay() {
|
|
|
3817
3828
|
height: "20",
|
|
3818
3829
|
viewBox: "0 0 26 26"
|
|
3819
3830
|
},
|
|
3820
|
-
/* @__PURE__ */
|
|
3831
|
+
/* @__PURE__ */ import_react14.default.createElement(
|
|
3821
3832
|
"path",
|
|
3822
3833
|
{
|
|
3823
3834
|
fill: "currentColor",
|
|
3824
3835
|
d: "M23.633 5.028a1.074 1.074 0 0 0-.777-.366c-2.295-.06-5.199-2.514-7.119-3.477C14.551.592 13.768.201 13.18.098a1.225 1.225 0 0 0-.36.001c-.588.103-1.371.494-2.556 1.087c-1.92.962-4.824 3.416-7.119 3.476a1.08 1.08 0 0 0-.778.366a1.167 1.167 0 0 0-.291.834c.493 10.023 4.088 16.226 10.396 19.831c.164.093.346.141.527.141s.363-.048.528-.141c6.308-3.605 9.902-9.808 10.396-19.831a1.161 1.161 0 0 0-.29-.834zM18.617 8.97l-5.323 7.855c-.191.282-.491.469-.788.469c-.298 0-.629-.163-.838-.372l-3.752-3.753a.656.656 0 0 1 0-.926l.927-.929a.658.658 0 0 1 .926 0l2.44 2.44l4.239-6.257a.657.657 0 0 1 .91-.173l1.085.736a.657.657 0 0 1 .174.91z"
|
|
3825
3836
|
}
|
|
3826
3837
|
)
|
|
3827
|
-
), "Secure payments powered by Fractal", /* @__PURE__ */
|
|
3838
|
+
), "Secure payments powered by Fractal", /* @__PURE__ */ import_react14.default.createElement(
|
|
3828
3839
|
"img",
|
|
3829
3840
|
{
|
|
3830
3841
|
src: "https://ui.fractalpay.com/favicon.ico",
|
|
@@ -3836,25 +3847,25 @@ function TockenizPay() {
|
|
|
3836
3847
|
}
|
|
3837
3848
|
|
|
3838
3849
|
// src/app/components/Payment/GetPaymentDynamic.tsx
|
|
3839
|
-
var
|
|
3850
|
+
var import_react16 = __toESM(require("react"));
|
|
3840
3851
|
var import_react_bootstrap9 = require("react-bootstrap");
|
|
3841
3852
|
|
|
3842
3853
|
// src/app/components/Loader/MyLoadingAnimation.tsx
|
|
3843
|
-
var
|
|
3854
|
+
var import_react15 = __toESM(require("react"));
|
|
3844
3855
|
function MyLoadingAnimation() {
|
|
3845
|
-
return /* @__PURE__ */
|
|
3856
|
+
return /* @__PURE__ */ import_react15.default.createElement(import_react15.default.Fragment, null, /* @__PURE__ */ import_react15.default.createElement(LoaderStyle_default, null), /* @__PURE__ */ import_react15.default.createElement("div", { className: "loading-animation" }, /* @__PURE__ */ import_react15.default.createElement("div", { className: "spinner" })));
|
|
3846
3857
|
}
|
|
3847
3858
|
|
|
3848
3859
|
// src/app/components/Payment/GetPaymentDynamic.tsx
|
|
3849
3860
|
function GetPaymentDynamic(props) {
|
|
3850
3861
|
const { amount, fractalpayClientKey, orderID } = props;
|
|
3851
|
-
const [loading, setLoading] = (0,
|
|
3852
|
-
const [show, setShow] = (0,
|
|
3853
|
-
const [iframeLoaded, setIframeLoaded] = (0,
|
|
3854
|
-
const [phoneNumber, setPhoneNumber] = (0,
|
|
3855
|
-
const [errorMessage, setErrorMessage] = (0,
|
|
3856
|
-
const [submitClicked, setSubmitClicked] = (0,
|
|
3857
|
-
const [isValidNumber, setIsValidNumber] = (0,
|
|
3862
|
+
const [loading, setLoading] = (0, import_react16.useState)(false);
|
|
3863
|
+
const [show, setShow] = (0, import_react16.useState)(false);
|
|
3864
|
+
const [iframeLoaded, setIframeLoaded] = (0, import_react16.useState)(false);
|
|
3865
|
+
const [phoneNumber, setPhoneNumber] = (0, import_react16.useState)("");
|
|
3866
|
+
const [errorMessage, setErrorMessage] = (0, import_react16.useState)("");
|
|
3867
|
+
const [submitClicked, setSubmitClicked] = (0, import_react16.useState)(false);
|
|
3868
|
+
const [isValidNumber, setIsValidNumber] = (0, import_react16.useState)(true);
|
|
3858
3869
|
const handleClose = () => {
|
|
3859
3870
|
setIframeLoaded(false);
|
|
3860
3871
|
setTimeout(() => {
|
|
@@ -3869,7 +3880,7 @@ function GetPaymentDynamic(props) {
|
|
|
3869
3880
|
console.error(ErrorText.fractalpayclientidrequired);
|
|
3870
3881
|
}
|
|
3871
3882
|
};
|
|
3872
|
-
(0,
|
|
3883
|
+
(0, import_react16.useEffect)(() => {
|
|
3873
3884
|
if (!fractalpayClientKey) {
|
|
3874
3885
|
console.error(ErrorText.fractalpayclientidrequired);
|
|
3875
3886
|
}
|
|
@@ -3892,7 +3903,7 @@ function GetPaymentDynamic(props) {
|
|
|
3892
3903
|
const handleLoad = () => {
|
|
3893
3904
|
setLoading(false);
|
|
3894
3905
|
};
|
|
3895
|
-
(0,
|
|
3906
|
+
(0, import_react16.useEffect)(() => {
|
|
3896
3907
|
const messageListener = (event) => {
|
|
3897
3908
|
var _a, _b;
|
|
3898
3909
|
const response = (_b = (_a = event == null ? void 0 : event.data) == null ? void 0 : _a.other) == null ? void 0 : _b.data;
|
|
@@ -3907,7 +3918,7 @@ function GetPaymentDynamic(props) {
|
|
|
3907
3918
|
window.removeEventListener("message", messageListener);
|
|
3908
3919
|
};
|
|
3909
3920
|
}, []);
|
|
3910
|
-
return /* @__PURE__ */
|
|
3921
|
+
return /* @__PURE__ */ import_react16.default.createElement("div", null, /* @__PURE__ */ import_react16.default.createElement("button", { className: "paymentBtn", onClick: handleShow }, "Pay"), /* @__PURE__ */ import_react16.default.createElement(import_react_bootstrap9.Modal, { show: show && iframeLoaded, id: "modal-pay", className: "modal-lg", onHide: handleClose }, /* @__PURE__ */ import_react16.default.createElement(import_react_bootstrap9.Modal.Header, { closeButton: true }), /* @__PURE__ */ import_react16.default.createElement(import_react_bootstrap9.Modal.Body, null, loading && /* @__PURE__ */ import_react16.default.createElement(MyLoadingAnimation, null), /* @__PURE__ */ import_react16.default.createElement(
|
|
3911
3922
|
"iframe",
|
|
3912
3923
|
{
|
|
3913
3924
|
src: `${baseUrl}widget-form/${amount}?fractalpay_public_key=${fractalpayClientKey}&order_id=${orderID}`,
|