@pinerohit11/testwidget 0.1.47 → 0.1.49
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/{index.mjs → index.cjs} +305 -252
- package/dist/index.js +269 -288
- package/package.json +3 -2
- /package/dist/{index.d.mts → index.d.cts} +0 -0
package/dist/index.js
CHANGED
@@ -1,12 +1,7 @@
|
|
1
|
-
"use strict";
|
2
|
-
var __create = Object.create;
|
3
1
|
var __defProp = Object.defineProperty;
|
4
2
|
var __defProps = Object.defineProperties;
|
5
|
-
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
6
3
|
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
7
|
-
var __getOwnPropNames = Object.getOwnPropertyNames;
|
8
4
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
9
|
-
var __getProtoOf = Object.getPrototypeOf;
|
10
5
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
11
6
|
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
12
7
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
@@ -22,54 +17,18 @@ var __spreadValues = (a, b) => {
|
|
22
17
|
return a;
|
23
18
|
};
|
24
19
|
var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
|
25
|
-
var __export = (target, all) => {
|
26
|
-
for (var name in all)
|
27
|
-
__defProp(target, name, { get: all[name], enumerable: true });
|
28
|
-
};
|
29
|
-
var __copyProps = (to, from, except, desc) => {
|
30
|
-
if (from && typeof from === "object" || typeof from === "function") {
|
31
|
-
for (let key of __getOwnPropNames(from))
|
32
|
-
if (!__hasOwnProp.call(to, key) && key !== except)
|
33
|
-
__defProp(to, key, { get: () => from[key], enumerable: !(desc = __getOwnPropDesc(from, key)) || desc.enumerable });
|
34
|
-
}
|
35
|
-
return to;
|
36
|
-
};
|
37
|
-
var __toESM = (mod, isNodeMode, target) => (target = mod != null ? __create(__getProtoOf(mod)) : {}, __copyProps(
|
38
|
-
// If the importer is in node compatibility mode or this is not an ESM
|
39
|
-
// file that has been converted to a CommonJS file using a Babel-
|
40
|
-
// compatible transform (i.e. "__esModule" has not been set), then set
|
41
|
-
// "default" to the CommonJS "module.exports" for node compatibility.
|
42
|
-
isNodeMode || !mod || !mod.__esModule ? __defProp(target, "default", { value: mod, enumerable: true }) : target,
|
43
|
-
mod
|
44
|
-
));
|
45
|
-
var __toCommonJS = (mod) => __copyProps(__defProp({}, "__esModule", { value: true }), mod);
|
46
|
-
|
47
|
-
// src/app/index.ts
|
48
|
-
var app_exports = {};
|
49
|
-
__export(app_exports, {
|
50
|
-
CompletedTransactions: () => CompletedTransactions,
|
51
|
-
GetPaymentDynamic: () => GetPaymentDynamic,
|
52
|
-
Payment: () => Payment,
|
53
|
-
RequestPayment: () => RequestPayment,
|
54
|
-
RequestPaymentAllInput: () => RequestPaymentAllInput,
|
55
|
-
RequestPaymentDynamic: () => RequestPaymentDynamic,
|
56
|
-
RequestPaymentonClick: () => RequestPaymentonClick,
|
57
|
-
RqstPaymntInputField: () => RqstPaymntInputField,
|
58
|
-
TockenizPay: () => TockenizPay
|
59
|
-
});
|
60
|
-
module.exports = __toCommonJS(app_exports);
|
61
20
|
|
62
21
|
// src/app/components/RequestPayment/RequestPayment.tsx
|
63
|
-
|
64
|
-
|
22
|
+
import React4, { useState, useEffect } from "react";
|
23
|
+
import axios from "axios";
|
65
24
|
|
66
25
|
// src/app/components/Loader/Loader.tsx
|
67
|
-
|
26
|
+
import React2 from "react";
|
68
27
|
|
69
28
|
// src/app/components/Loader/LoaderStyle.tsx
|
70
|
-
|
29
|
+
import React from "react";
|
71
30
|
var LoaderStyle = (props) => {
|
72
|
-
return /* @__PURE__ */
|
31
|
+
return /* @__PURE__ */ React.createElement("style", null, `
|
73
32
|
.loader {
|
74
33
|
position: fixed;
|
75
34
|
/* Fixed position to cover the viewport */
|
@@ -188,17 +147,17 @@ var LoaderStyle_default = LoaderStyle;
|
|
188
147
|
|
189
148
|
// src/app/components/Loader/Loader.tsx
|
190
149
|
var Loader = (props) => {
|
191
|
-
return /* @__PURE__ */
|
150
|
+
return /* @__PURE__ */ React2.createElement(React2.Fragment, null, /* @__PURE__ */ React2.createElement(LoaderStyle_default, null), (props == null ? void 0 : props.loading) && /* @__PURE__ */ React2.createElement("div", { className: "loader" }, /* @__PURE__ */ React2.createElement("div", { className: "lds-ellipsis" }, /* @__PURE__ */ React2.createElement("div", null), /* @__PURE__ */ React2.createElement("div", null), /* @__PURE__ */ React2.createElement("div", null), /* @__PURE__ */ React2.createElement("div", null))));
|
192
151
|
};
|
193
152
|
var Loader_default = Loader;
|
194
153
|
|
195
154
|
// src/app/components/RequestPayment/RequestPayment.tsx
|
196
|
-
|
155
|
+
import { Button, Form, Modal } from "react-bootstrap";
|
197
156
|
|
198
157
|
// src/app/components/RequestPayment/RequestPaymentstyles.tsx
|
199
|
-
|
158
|
+
import React3 from "react";
|
200
159
|
var RequestPaymentstyles = (props) => {
|
201
|
-
return /* @__PURE__ */
|
160
|
+
return /* @__PURE__ */ React3.createElement("style", null, `
|
202
161
|
.paymentBtn {
|
203
162
|
background-color: black;
|
204
163
|
border: none;
|
@@ -1052,10 +1011,10 @@ var ErrorText = {
|
|
1052
1011
|
// src/app/components/RequestPayment/RequestPayment.tsx
|
1053
1012
|
function RequestPayment(props) {
|
1054
1013
|
const fractalpayClientKey = props.fractalpayClientKey;
|
1055
|
-
const [show, setShow] =
|
1056
|
-
const [loading, setLoading] =
|
1057
|
-
const [errors, setErrors] =
|
1058
|
-
const [requestDetails, setRequestDetails] =
|
1014
|
+
const [show, setShow] = useState(false);
|
1015
|
+
const [loading, setLoading] = useState(false);
|
1016
|
+
const [errors, setErrors] = useState({});
|
1017
|
+
const [requestDetails, setRequestDetails] = useState({
|
1059
1018
|
email: "",
|
1060
1019
|
amount: "",
|
1061
1020
|
phone_number: "",
|
@@ -1063,7 +1022,7 @@ function RequestPayment(props) {
|
|
1063
1022
|
name: "",
|
1064
1023
|
fractalpayPublicKey: fractalpayClientKey
|
1065
1024
|
});
|
1066
|
-
const [showConfirmationModal, setShowConfirmationModal] =
|
1025
|
+
const [showConfirmationModal, setShowConfirmationModal] = useState(false);
|
1067
1026
|
const phoneNumberRegex = (value) => /^\(?\d{3}\)?[-.\s]?\d{3}[-.\s]?\d{4}$/.test(value);
|
1068
1027
|
const amoutRegex = /[+-]?([0-9]*[.])?[0-9]+/;
|
1069
1028
|
const positiveAmountRegex = /^[+]?\d+(\.\d+)?$/;
|
@@ -1116,7 +1075,7 @@ function RequestPayment(props) {
|
|
1116
1075
|
name: requestDetails.name,
|
1117
1076
|
email: requestDetails.email
|
1118
1077
|
};
|
1119
|
-
let response = await
|
1078
|
+
let response = await axios.post(`${baseUrl}create-widget-order`, formData);
|
1120
1079
|
if ((response == null ? void 0 : response.status) === 200) {
|
1121
1080
|
setShowConfirmationModal(true);
|
1122
1081
|
setShow(false);
|
@@ -1194,7 +1153,7 @@ function RequestPayment(props) {
|
|
1194
1153
|
setErrors(newErrors);
|
1195
1154
|
return Object.keys(newErrors).length === 0;
|
1196
1155
|
};
|
1197
|
-
|
1156
|
+
useEffect(() => {
|
1198
1157
|
if (props.amount) {
|
1199
1158
|
setRequestDetails((prev) => __spreadProps(__spreadValues({}, prev), { amount: props.amount }));
|
1200
1159
|
}
|
@@ -1204,8 +1163,8 @@ function RequestPayment(props) {
|
|
1204
1163
|
e.preventDefault();
|
1205
1164
|
}
|
1206
1165
|
};
|
1207
|
-
return /* @__PURE__ */
|
1208
|
-
|
1166
|
+
return /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement(RequestPaymentstyles_default, null), /* @__PURE__ */ React4.createElement(Loader_default, { loading }), /* @__PURE__ */ React4.createElement(React4.Fragment, null, /* @__PURE__ */ React4.createElement("button", { className: "paymentBtn", onClick: handleShow }, "Request Payment"), /* @__PURE__ */ React4.createElement(
|
1167
|
+
Modal,
|
1209
1168
|
{
|
1210
1169
|
show,
|
1211
1170
|
onHide: handleClose,
|
@@ -1213,8 +1172,8 @@ function RequestPayment(props) {
|
|
1213
1172
|
backdrop: "static",
|
1214
1173
|
keyboard: false
|
1215
1174
|
},
|
1216
|
-
/* @__PURE__ */
|
1217
|
-
/* @__PURE__ */
|
1175
|
+
/* @__PURE__ */ React4.createElement(Modal.Header, { closeButton: true }, /* @__PURE__ */ React4.createElement(Modal.Title, null, "Request Payment")),
|
1176
|
+
/* @__PURE__ */ React4.createElement(Modal.Body, { id: "Checkout" }, /* @__PURE__ */ React4.createElement(Form, null, /* @__PURE__ */ React4.createElement("div", { className: "mb-3" }, /* @__PURE__ */ React4.createElement("label", { htmlFor: "exampleFormControlInput2", className: "form-label" }, "FULL NAME *"), /* @__PURE__ */ React4.createElement(
|
1218
1177
|
"input",
|
1219
1178
|
{
|
1220
1179
|
className: "form-control",
|
@@ -1223,7 +1182,7 @@ function RequestPayment(props) {
|
|
1223
1182
|
"data-token": "name",
|
1224
1183
|
onChange: handleChange
|
1225
1184
|
}
|
1226
|
-
), errors.name && /* @__PURE__ */
|
1185
|
+
), errors.name && /* @__PURE__ */ React4.createElement("small", { className: "text-danger" }, errors.name)), /* @__PURE__ */ React4.createElement("div", { className: "mb-3" }, /* @__PURE__ */ React4.createElement("label", { htmlFor: "requestPhoneNumber", className: "form-label" }, "Phone Number"), /* @__PURE__ */ React4.createElement(
|
1227
1186
|
"input",
|
1228
1187
|
{
|
1229
1188
|
maxLength: 10,
|
@@ -1235,7 +1194,7 @@ function RequestPayment(props) {
|
|
1235
1194
|
type: "text",
|
1236
1195
|
"data-token": "phone_number"
|
1237
1196
|
}
|
1238
|
-
), errors.phone_number && /* @__PURE__ */
|
1197
|
+
), errors.phone_number && /* @__PURE__ */ React4.createElement("small", { className: "text-danger" }, errors.phone_number)), /* @__PURE__ */ React4.createElement("div", { className: "mb-3" }, /* @__PURE__ */ React4.createElement("label", { htmlFor: "exampleFormControlInput2", className: "form-label" }, "EMAIL"), /* @__PURE__ */ React4.createElement(
|
1239
1198
|
"input",
|
1240
1199
|
{
|
1241
1200
|
className: "form-control",
|
@@ -1244,7 +1203,7 @@ function RequestPayment(props) {
|
|
1244
1203
|
onChange: handleChange,
|
1245
1204
|
"data-token": "email"
|
1246
1205
|
}
|
1247
|
-
), errors.email && /* @__PURE__ */
|
1206
|
+
), errors.email && /* @__PURE__ */ React4.createElement("small", { className: "text-danger" }, errors.email)), /* @__PURE__ */ React4.createElement("div", { className: "mb-3" }, /* @__PURE__ */ React4.createElement("label", { htmlFor: "exampleFormControlInput2", className: "form-label" }, "AMOUNT *"), /* @__PURE__ */ React4.createElement("div", { className: "input-group" }, /* @__PURE__ */ React4.createElement("span", { className: "input-group-text" }, "$"), /* @__PURE__ */ React4.createElement(
|
1248
1207
|
"input",
|
1249
1208
|
{
|
1250
1209
|
"data-token": "amount",
|
@@ -1260,7 +1219,7 @@ function RequestPayment(props) {
|
|
1260
1219
|
e2.preventDefault();
|
1261
1220
|
}, { passive: false })
|
1262
1221
|
}
|
1263
|
-
)), errors.amount && /* @__PURE__ */
|
1222
|
+
)), errors.amount && /* @__PURE__ */ React4.createElement("small", { className: "text-danger" }, errors.amount)), /* @__PURE__ */ React4.createElement("div", { className: "mb-3" }, /* @__PURE__ */ React4.createElement("label", { htmlFor: "exampleFormControlInput2", className: "form-label" }, "ORDER ID"), /* @__PURE__ */ React4.createElement(
|
1264
1223
|
"input",
|
1265
1224
|
{
|
1266
1225
|
className: "form-control",
|
@@ -1269,8 +1228,8 @@ function RequestPayment(props) {
|
|
1269
1228
|
onChange: handleChange,
|
1270
1229
|
"data-token": "order_id"
|
1271
1230
|
}
|
1272
|
-
), errors.order_id && /* @__PURE__ */
|
1273
|
-
|
1231
|
+
), errors.order_id && /* @__PURE__ */ React4.createElement("small", { className: "text-danger" }, errors.order_id)), /* @__PURE__ */ React4.createElement(
|
1232
|
+
Button,
|
1274
1233
|
{
|
1275
1234
|
type: "button",
|
1276
1235
|
className: "PayButton",
|
@@ -1278,7 +1237,7 @@ function RequestPayment(props) {
|
|
1278
1237
|
disabled: loading
|
1279
1238
|
},
|
1280
1239
|
loading ? "Loading..." : "Send Request"
|
1281
|
-
)), /* @__PURE__ */
|
1240
|
+
)), /* @__PURE__ */ React4.createElement("div", { className: "powerd-by-part" }, /* @__PURE__ */ React4.createElement(
|
1282
1241
|
"svg",
|
1283
1242
|
{
|
1284
1243
|
xmlns: "http://www.w3.org/2000/svg",
|
@@ -1286,14 +1245,14 @@ function RequestPayment(props) {
|
|
1286
1245
|
height: "20",
|
1287
1246
|
viewBox: "0 0 26 26"
|
1288
1247
|
},
|
1289
|
-
/* @__PURE__ */
|
1248
|
+
/* @__PURE__ */ React4.createElement(
|
1290
1249
|
"path",
|
1291
1250
|
{
|
1292
1251
|
fill: "currentColor",
|
1293
1252
|
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"
|
1294
1253
|
}
|
1295
1254
|
)
|
1296
|
-
), "Secure payments powered by Fractal", /* @__PURE__ */
|
1255
|
+
), "Secure payments powered by Fractal", /* @__PURE__ */ React4.createElement(
|
1297
1256
|
"img",
|
1298
1257
|
{
|
1299
1258
|
src: "https://ui.fractalpay.com/favicon.ico",
|
@@ -1301,15 +1260,15 @@ function RequestPayment(props) {
|
|
1301
1260
|
className: "powered-logo"
|
1302
1261
|
}
|
1303
1262
|
)))
|
1304
|
-
), /* @__PURE__ */
|
1305
|
-
|
1263
|
+
), /* @__PURE__ */ React4.createElement(
|
1264
|
+
Modal,
|
1306
1265
|
{
|
1307
1266
|
className: "payment-suc",
|
1308
1267
|
show: showConfirmationModal,
|
1309
1268
|
onHide: handleCloseConfirmationModal
|
1310
1269
|
},
|
1311
|
-
/* @__PURE__ */
|
1312
|
-
/* @__PURE__ */
|
1270
|
+
/* @__PURE__ */ React4.createElement(Modal.Header, { closeButton: true }),
|
1271
|
+
/* @__PURE__ */ React4.createElement(Modal.Body, null, /* @__PURE__ */ React4.createElement(
|
1313
1272
|
"svg",
|
1314
1273
|
{
|
1315
1274
|
width: "60",
|
@@ -1318,7 +1277,7 @@ function RequestPayment(props) {
|
|
1318
1277
|
fill: "none",
|
1319
1278
|
xmlns: "http://www.w3.org/2000/svg"
|
1320
1279
|
},
|
1321
|
-
/* @__PURE__ */
|
1280
|
+
/* @__PURE__ */ React4.createElement(
|
1322
1281
|
"rect",
|
1323
1282
|
{
|
1324
1283
|
x: "0.5",
|
@@ -1329,14 +1288,14 @@ function RequestPayment(props) {
|
|
1329
1288
|
stroke: "#31B379"
|
1330
1289
|
}
|
1331
1290
|
),
|
1332
|
-
/* @__PURE__ */
|
1291
|
+
/* @__PURE__ */ React4.createElement("g", { clipPath: "url(#clip0_2659_5018)" }, /* @__PURE__ */ React4.createElement(
|
1333
1292
|
"path",
|
1334
1293
|
{
|
1335
1294
|
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",
|
1336
1295
|
fill: "#31B379"
|
1337
1296
|
}
|
1338
1297
|
)),
|
1339
|
-
/* @__PURE__ */
|
1298
|
+
/* @__PURE__ */ React4.createElement("defs", null, /* @__PURE__ */ React4.createElement("clipPath", { id: "clip0_2659_5018" }, /* @__PURE__ */ React4.createElement(
|
1340
1299
|
"rect",
|
1341
1300
|
{
|
1342
1301
|
width: "22",
|
@@ -1345,28 +1304,28 @@ function RequestPayment(props) {
|
|
1345
1304
|
transform: "translate(19.5 19.0039)"
|
1346
1305
|
}
|
1347
1306
|
)))
|
1348
|
-
), /* @__PURE__ */
|
1307
|
+
), /* @__PURE__ */ React4.createElement("h2", null, "Payment link has been ", /* @__PURE__ */ React4.createElement("br", null), " sent successfully"))
|
1349
1308
|
)));
|
1350
1309
|
}
|
1351
1310
|
|
1352
1311
|
// src/app/components/RequestPayment/RequestPaymentAllInput.tsx
|
1353
|
-
|
1354
|
-
|
1355
|
-
|
1356
|
-
|
1312
|
+
import React5, { useState as useState2 } from "react";
|
1313
|
+
import { Modal as Modal2 } from "react-bootstrap";
|
1314
|
+
import { toast, ToastContainer } from "react-toastify";
|
1315
|
+
import "react-toastify/dist/ReactToastify.css";
|
1357
1316
|
function RequestPaymentAllInput({ fractalpayClientKey }) {
|
1358
|
-
const [isLoading, setIsLoading] = (
|
1359
|
-
const [show, setShow] = (
|
1360
|
-
const [phoneNumber, setPhoneNumber] = (
|
1361
|
-
const [amount, setAmount] = (
|
1362
|
-
const [orderId, setOrderId] = (
|
1363
|
-
const [isValidNumber, setIsValidNumber] = (
|
1364
|
-
const [isValidAmount, setIsValidAmount] = (
|
1365
|
-
const [isValidOrderId, setIsValidOrderId] = (
|
1366
|
-
const [errorMessagephone, setErrorMessagephone] = (
|
1367
|
-
const [errorMessageamount, setErrorMessageamount] = (
|
1368
|
-
const [errorMessageorderid, setErrorMessageorderid] = (
|
1369
|
-
const [submitClicked, setSubmitClicked] = (
|
1317
|
+
const [isLoading, setIsLoading] = useState2(false);
|
1318
|
+
const [show, setShow] = useState2(false);
|
1319
|
+
const [phoneNumber, setPhoneNumber] = useState2("");
|
1320
|
+
const [amount, setAmount] = useState2("");
|
1321
|
+
const [orderId, setOrderId] = useState2("");
|
1322
|
+
const [isValidNumber, setIsValidNumber] = useState2(true);
|
1323
|
+
const [isValidAmount, setIsValidAmount] = useState2(true);
|
1324
|
+
const [isValidOrderId, setIsValidOrderId] = useState2(true);
|
1325
|
+
const [errorMessagephone, setErrorMessagephone] = useState2("");
|
1326
|
+
const [errorMessageamount, setErrorMessageamount] = useState2("");
|
1327
|
+
const [errorMessageorderid, setErrorMessageorderid] = useState2("");
|
1328
|
+
const [submitClicked, setSubmitClicked] = useState2(false);
|
1370
1329
|
const handleClose = () => setShow(false);
|
1371
1330
|
const handleShow = () => setShow(true);
|
1372
1331
|
const sendRequestPayment = () => {
|
@@ -1428,7 +1387,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1428
1387
|
}).catch((error) => {
|
1429
1388
|
setIsLoading(false);
|
1430
1389
|
console.error("Error:", error);
|
1431
|
-
|
1390
|
+
toast.error(ErrorText.anerroroccured);
|
1432
1391
|
});
|
1433
1392
|
};
|
1434
1393
|
const handlePhoneNumberChange = (e) => {
|
@@ -1468,7 +1427,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1468
1427
|
setIsValidOrderId(false);
|
1469
1428
|
}
|
1470
1429
|
};
|
1471
|
-
return /* @__PURE__ */
|
1430
|
+
return /* @__PURE__ */ React5.createElement(React5.Fragment, null, /* @__PURE__ */ React5.createElement(RequestPaymentstyles_default, null), /* @__PURE__ */ React5.createElement("div", { className: " border-container" }, /* @__PURE__ */ React5.createElement("div", { className: "payment-column" }, /* @__PURE__ */ React5.createElement("label", null, "Enter Phone Number:"), /* @__PURE__ */ React5.createElement("div", { className: "input-container" }, /* @__PURE__ */ React5.createElement(
|
1472
1431
|
"input",
|
1473
1432
|
{
|
1474
1433
|
type: "text",
|
@@ -1478,7 +1437,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1478
1437
|
maxLength: 10,
|
1479
1438
|
className: submitClicked && (!phoneNumber || !isValidNumber) ? "error" : ""
|
1480
1439
|
}
|
1481
|
-
), errorMessagephone && /* @__PURE__ */
|
1440
|
+
), errorMessagephone && /* @__PURE__ */ React5.createElement("div", { className: "error-message text-danger" }, errorMessagephone))), /* @__PURE__ */ React5.createElement("div", { className: "payment-column" }, /* @__PURE__ */ React5.createElement("label", null, "Enter Amount:"), /* @__PURE__ */ React5.createElement("div", { className: "input-container" }, /* @__PURE__ */ React5.createElement(
|
1482
1441
|
"input",
|
1483
1442
|
{
|
1484
1443
|
type: "text",
|
@@ -1487,7 +1446,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1487
1446
|
placeholder: "Enter amount",
|
1488
1447
|
className: submitClicked && (!amount || !isValidAmount) ? "error" : ""
|
1489
1448
|
}
|
1490
|
-
), errorMessageamount && /* @__PURE__ */
|
1449
|
+
), errorMessageamount && /* @__PURE__ */ React5.createElement("div", { className: "error-message text-danger" }, errorMessageamount))), /* @__PURE__ */ React5.createElement("div", { className: "payment-column" }, /* @__PURE__ */ React5.createElement("label", null, "Enter Order ID:"), /* @__PURE__ */ React5.createElement("div", { className: "input-container" }, /* @__PURE__ */ React5.createElement(
|
1491
1450
|
"input",
|
1492
1451
|
{
|
1493
1452
|
type: "text",
|
@@ -1496,7 +1455,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1496
1455
|
placeholder: "Enter order ID",
|
1497
1456
|
className: submitClicked && (!orderId || !isValidOrderId) ? "error" : ""
|
1498
1457
|
}
|
1499
|
-
), errorMessageorderid && /* @__PURE__ */
|
1458
|
+
), errorMessageorderid && /* @__PURE__ */ React5.createElement("div", { className: "error-message text-danger" }, errorMessageorderid))), /* @__PURE__ */ React5.createElement(
|
1500
1459
|
"button",
|
1501
1460
|
{
|
1502
1461
|
onClick: sendRequestPayment,
|
@@ -1504,7 +1463,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1504
1463
|
className: "paymentBtn"
|
1505
1464
|
},
|
1506
1465
|
isLoading ? "Loading..." : "Request Payment"
|
1507
|
-
)), /* @__PURE__ */
|
1466
|
+
)), /* @__PURE__ */ React5.createElement(Modal2, { className: "payment-suc", show, onHide: handleClose }, /* @__PURE__ */ React5.createElement(Modal2.Header, { closeButton: true }), /* @__PURE__ */ React5.createElement(Modal2.Body, null, /* @__PURE__ */ React5.createElement(
|
1508
1467
|
"svg",
|
1509
1468
|
{
|
1510
1469
|
width: "60",
|
@@ -1513,7 +1472,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1513
1472
|
fill: "none",
|
1514
1473
|
xmlns: "http://www.w3.org/2000/svg"
|
1515
1474
|
},
|
1516
|
-
/* @__PURE__ */
|
1475
|
+
/* @__PURE__ */ React5.createElement(
|
1517
1476
|
"rect",
|
1518
1477
|
{
|
1519
1478
|
x: "0.5",
|
@@ -1524,14 +1483,14 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1524
1483
|
stroke: "#31B379"
|
1525
1484
|
}
|
1526
1485
|
),
|
1527
|
-
/* @__PURE__ */
|
1486
|
+
/* @__PURE__ */ React5.createElement("g", { clipPath: "url(#clip0_2659_5018)" }, /* @__PURE__ */ React5.createElement(
|
1528
1487
|
"path",
|
1529
1488
|
{
|
1530
1489
|
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",
|
1531
1490
|
fill: "#31B379"
|
1532
1491
|
}
|
1533
1492
|
)),
|
1534
|
-
/* @__PURE__ */
|
1493
|
+
/* @__PURE__ */ React5.createElement("defs", null, /* @__PURE__ */ React5.createElement("clipPath", { id: "clip0_2659_5018" }, /* @__PURE__ */ React5.createElement(
|
1535
1494
|
"rect",
|
1536
1495
|
{
|
1537
1496
|
width: "22",
|
@@ -1540,12 +1499,12 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1540
1499
|
transform: "translate(19.5 19.0039)"
|
1541
1500
|
}
|
1542
1501
|
)))
|
1543
|
-
), /* @__PURE__ */
|
1502
|
+
), /* @__PURE__ */ React5.createElement("h1", null, "Success!"), /* @__PURE__ */ React5.createElement("h4", null, "Payment link created successfully.")), /* @__PURE__ */ React5.createElement(Modal2.Footer, null, /* @__PURE__ */ React5.createElement("button", { className: "paymentBtn", onClick: handleClose }, "Ok"))), /* @__PURE__ */ React5.createElement(ToastContainer, null));
|
1544
1503
|
}
|
1545
1504
|
|
1546
1505
|
// src/app/components/RequestPayment/RequestPaymentDynamic.tsx
|
1547
|
-
|
1548
|
-
|
1506
|
+
import React6, { useState as useState3 } from "react";
|
1507
|
+
import { Modal as Modal3 } from "react-bootstrap";
|
1549
1508
|
|
1550
1509
|
// src/app/components/Api/createWidgetOrder.ts
|
1551
1510
|
var createWidgetOrder = (formData) => {
|
@@ -1569,8 +1528,8 @@ var createWidgetOrder = (formData) => {
|
|
1569
1528
|
// src/app/components/RequestPayment/RequestPaymentDynamic.tsx
|
1570
1529
|
function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orderID }) {
|
1571
1530
|
console.log("props", { fractalpayClientKey, amount, phone_number, orderID });
|
1572
|
-
const [isLoading, setIsLoading] = (
|
1573
|
-
const [show, setShow] = (
|
1531
|
+
const [isLoading, setIsLoading] = useState3(false);
|
1532
|
+
const [show, setShow] = useState3(false);
|
1574
1533
|
const handleClose = () => setShow(false);
|
1575
1534
|
const handleShow = () => setShow(true);
|
1576
1535
|
const sendRequestPayment = () => {
|
@@ -1593,7 +1552,7 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
|
|
1593
1552
|
console.error("Error:", error);
|
1594
1553
|
});
|
1595
1554
|
};
|
1596
|
-
return /* @__PURE__ */
|
1555
|
+
return /* @__PURE__ */ React6.createElement(React6.Fragment, null, /* @__PURE__ */ React6.createElement(
|
1597
1556
|
"button",
|
1598
1557
|
{
|
1599
1558
|
onClick: sendRequestPayment,
|
@@ -1601,7 +1560,7 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
|
|
1601
1560
|
className: "paymentBtn"
|
1602
1561
|
},
|
1603
1562
|
isLoading ? "Loading..." : "Request Payment"
|
1604
|
-
), /* @__PURE__ */
|
1563
|
+
), /* @__PURE__ */ React6.createElement(Modal3, { className: "payment-suc", show, onHide: handleClose }, /* @__PURE__ */ React6.createElement(Modal3.Header, { closeButton: true }), /* @__PURE__ */ React6.createElement(Modal3.Body, null, /* @__PURE__ */ React6.createElement(
|
1605
1564
|
"svg",
|
1606
1565
|
{
|
1607
1566
|
width: "60",
|
@@ -1610,7 +1569,7 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
|
|
1610
1569
|
fill: "none",
|
1611
1570
|
xmlns: "http://www.w3.org/2000/svg"
|
1612
1571
|
},
|
1613
|
-
/* @__PURE__ */
|
1572
|
+
/* @__PURE__ */ React6.createElement(
|
1614
1573
|
"rect",
|
1615
1574
|
{
|
1616
1575
|
x: "0.5",
|
@@ -1621,14 +1580,14 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
|
|
1621
1580
|
stroke: "#31B379"
|
1622
1581
|
}
|
1623
1582
|
),
|
1624
|
-
/* @__PURE__ */
|
1583
|
+
/* @__PURE__ */ React6.createElement("g", { "clip-path": "url(#clip0_2659_5018)" }, /* @__PURE__ */ React6.createElement(
|
1625
1584
|
"path",
|
1626
1585
|
{
|
1627
1586
|
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",
|
1628
1587
|
fill: "#31B379"
|
1629
1588
|
}
|
1630
1589
|
)),
|
1631
|
-
/* @__PURE__ */
|
1590
|
+
/* @__PURE__ */ React6.createElement("defs", null, /* @__PURE__ */ React6.createElement("clipPath", { id: "clip0_2659_5018" }, /* @__PURE__ */ React6.createElement(
|
1632
1591
|
"rect",
|
1633
1592
|
{
|
1634
1593
|
width: "22",
|
@@ -1637,15 +1596,15 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
|
|
1637
1596
|
transform: "translate(19.5 19.0039)"
|
1638
1597
|
}
|
1639
1598
|
)))
|
1640
|
-
), /* @__PURE__ */
|
1599
|
+
), /* @__PURE__ */ React6.createElement("h1", null, "Success!"), /* @__PURE__ */ React6.createElement("h4", null, "Payment link created successfully.")), /* @__PURE__ */ React6.createElement(Modal3.Footer, null, /* @__PURE__ */ React6.createElement("button", { className: "paymentBtn", onClick: handleClose }, "Ok"))));
|
1641
1600
|
}
|
1642
1601
|
|
1643
1602
|
// src/app/components/RequestPayment/RequestPaymentonClick.tsx
|
1644
|
-
|
1645
|
-
|
1603
|
+
import React7, { useState as useState4 } from "react";
|
1604
|
+
import { Modal as Modal4 } from "react-bootstrap";
|
1646
1605
|
function RequestPaymentonClick(props) {
|
1647
|
-
const [isLoading, setIsLoading] = (
|
1648
|
-
const [show, setShow] = (
|
1606
|
+
const [isLoading, setIsLoading] = useState4(false);
|
1607
|
+
const [show, setShow] = useState4(false);
|
1649
1608
|
const handleClose = () => setShow(false);
|
1650
1609
|
const handleShow = () => setShow(true);
|
1651
1610
|
const { fractalpayClientKey, amount, phone_number, orderID, onSuccess, onError } = props;
|
@@ -1679,7 +1638,7 @@ function RequestPaymentonClick(props) {
|
|
1679
1638
|
console.error("Error:", error);
|
1680
1639
|
});
|
1681
1640
|
};
|
1682
|
-
return /* @__PURE__ */
|
1641
|
+
return /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement(RequestPaymentstyles_default, null), /* @__PURE__ */ React7.createElement(
|
1683
1642
|
"button",
|
1684
1643
|
{
|
1685
1644
|
onClick: sendRequestPayment,
|
@@ -1687,7 +1646,7 @@ function RequestPaymentonClick(props) {
|
|
1687
1646
|
className: "paymentBtn"
|
1688
1647
|
},
|
1689
1648
|
isLoading ? "Loading..." : "Request Payment"
|
1690
|
-
), /* @__PURE__ */
|
1649
|
+
), /* @__PURE__ */ React7.createElement(Modal4, { className: "payment-suc", show, onHide: handleClose }, /* @__PURE__ */ React7.createElement(Modal4.Header, { closeButton: true }), /* @__PURE__ */ React7.createElement(Modal4.Body, null, onSuccess && /* @__PURE__ */ React7.createElement(
|
1691
1650
|
"svg",
|
1692
1651
|
{
|
1693
1652
|
width: "60",
|
@@ -1696,7 +1655,7 @@ function RequestPaymentonClick(props) {
|
|
1696
1655
|
fill: "none",
|
1697
1656
|
xmlns: "http://www.w3.org/2000/svg"
|
1698
1657
|
},
|
1699
|
-
/* @__PURE__ */
|
1658
|
+
/* @__PURE__ */ React7.createElement(
|
1700
1659
|
"rect",
|
1701
1660
|
{
|
1702
1661
|
x: "0.5",
|
@@ -1707,14 +1666,14 @@ function RequestPaymentonClick(props) {
|
|
1707
1666
|
stroke: "#31B379"
|
1708
1667
|
}
|
1709
1668
|
),
|
1710
|
-
/* @__PURE__ */
|
1669
|
+
/* @__PURE__ */ React7.createElement("g", { clipPath: "url(#clip0_2659_5018)" }, /* @__PURE__ */ React7.createElement(
|
1711
1670
|
"path",
|
1712
1671
|
{
|
1713
1672
|
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",
|
1714
1673
|
fill: "#31B379"
|
1715
1674
|
}
|
1716
1675
|
)),
|
1717
|
-
/* @__PURE__ */
|
1676
|
+
/* @__PURE__ */ React7.createElement("defs", null, /* @__PURE__ */ React7.createElement("clipPath", { id: "clip0_2659_5018" }, /* @__PURE__ */ React7.createElement(
|
1718
1677
|
"rect",
|
1719
1678
|
{
|
1720
1679
|
width: "22",
|
@@ -1723,21 +1682,21 @@ function RequestPaymentonClick(props) {
|
|
1723
1682
|
transform: "translate(19.5 19.0039)"
|
1724
1683
|
}
|
1725
1684
|
)))
|
1726
|
-
), onSuccess ? /* @__PURE__ */
|
1685
|
+
), onSuccess ? /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement("h1", null, "Success!"), /* @__PURE__ */ React7.createElement("h4", null, onSuccess)) : /* @__PURE__ */ React7.createElement(React7.Fragment, null, /* @__PURE__ */ React7.createElement("h1", null, "Error!"), /* @__PURE__ */ React7.createElement("h4", null, onError))), /* @__PURE__ */ React7.createElement(Modal4.Footer, null, /* @__PURE__ */ React7.createElement("button", { className: "paymentBtn", onClick: handleClose }, "Ok"))));
|
1727
1686
|
}
|
1728
1687
|
|
1729
1688
|
// src/app/components/RequestPayment/RqstPaymntInputField.tsx
|
1730
|
-
|
1731
|
-
|
1732
|
-
|
1733
|
-
|
1689
|
+
import React8, { useState as useState5 } from "react";
|
1690
|
+
import { Modal as Modal5 } from "react-bootstrap";
|
1691
|
+
import { toast as toast2, ToastContainer as ToastContainer2 } from "react-toastify";
|
1692
|
+
import "react-toastify/dist/ReactToastify.css";
|
1734
1693
|
function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
1735
|
-
const [isLoading, setIsLoading] = (
|
1736
|
-
const [show, setShow] = (
|
1737
|
-
const [phoneNumber, setPhoneNumber] = (
|
1738
|
-
const [isValidNumber, setIsValidNumber] = (
|
1739
|
-
const [errorMessage, setErrorMessage] = (
|
1740
|
-
const [submitClicked, setSubmitClicked] = (
|
1694
|
+
const [isLoading, setIsLoading] = useState5(false);
|
1695
|
+
const [show, setShow] = useState5(false);
|
1696
|
+
const [phoneNumber, setPhoneNumber] = useState5("");
|
1697
|
+
const [isValidNumber, setIsValidNumber] = useState5(true);
|
1698
|
+
const [errorMessage, setErrorMessage] = useState5("");
|
1699
|
+
const [submitClicked, setSubmitClicked] = useState5(false);
|
1741
1700
|
const handleClose = () => setShow(false);
|
1742
1701
|
const handleShow = () => setShow(true);
|
1743
1702
|
const sendRequestPayment = () => {
|
@@ -1782,7 +1741,7 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
1782
1741
|
}).catch((error) => {
|
1783
1742
|
setIsLoading(false);
|
1784
1743
|
console.error("Error:", error);
|
1785
|
-
|
1744
|
+
toast2.error(ErrorText.anerroroccured);
|
1786
1745
|
});
|
1787
1746
|
};
|
1788
1747
|
const handlePhoneNumberChange = (e) => {
|
@@ -1800,7 +1759,7 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
1800
1759
|
setErrorMessage(ErrorText.phonenumbervalid);
|
1801
1760
|
}
|
1802
1761
|
};
|
1803
|
-
return /* @__PURE__ */
|
1762
|
+
return /* @__PURE__ */ React8.createElement(React8.Fragment, null, /* @__PURE__ */ React8.createElement("div", { className: "payment-container" }, /* @__PURE__ */ React8.createElement("div", { className: "input-wrapper" }, /* @__PURE__ */ React8.createElement("div", { className: "input-container" }, /* @__PURE__ */ React8.createElement(
|
1804
1763
|
"input",
|
1805
1764
|
{
|
1806
1765
|
type: "text",
|
@@ -1810,7 +1769,7 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
1810
1769
|
maxLength: 10,
|
1811
1770
|
className: submitClicked && (!phoneNumber || !isValidNumber) ? "error" : ""
|
1812
1771
|
}
|
1813
|
-
), errorMessage && /* @__PURE__ */
|
1772
|
+
), errorMessage && /* @__PURE__ */ React8.createElement("div", { className: "error-message text-danger" }, errorMessage))), /* @__PURE__ */ React8.createElement("div", { className: "button-wrapper" }, /* @__PURE__ */ React8.createElement(
|
1814
1773
|
"button",
|
1815
1774
|
{
|
1816
1775
|
onClick: sendRequestPayment,
|
@@ -1818,7 +1777,7 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
1818
1777
|
className: "paymentBtn"
|
1819
1778
|
},
|
1820
1779
|
isLoading ? "Loading..." : "Request Payment"
|
1821
|
-
))), /* @__PURE__ */
|
1780
|
+
))), /* @__PURE__ */ React8.createElement(Modal5, { className: "payment-suc", show, onHide: handleClose }, /* @__PURE__ */ React8.createElement(Modal5.Header, { closeButton: true }), /* @__PURE__ */ React8.createElement(Modal5.Body, null, /* @__PURE__ */ React8.createElement(
|
1822
1781
|
"svg",
|
1823
1782
|
{
|
1824
1783
|
width: "60",
|
@@ -1827,7 +1786,7 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
1827
1786
|
fill: "none",
|
1828
1787
|
xmlns: "http://www.w3.org/2000/svg"
|
1829
1788
|
},
|
1830
|
-
/* @__PURE__ */
|
1789
|
+
/* @__PURE__ */ React8.createElement(
|
1831
1790
|
"rect",
|
1832
1791
|
{
|
1833
1792
|
x: "0.5",
|
@@ -1838,14 +1797,14 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
1838
1797
|
stroke: "#31B379"
|
1839
1798
|
}
|
1840
1799
|
),
|
1841
|
-
/* @__PURE__ */
|
1800
|
+
/* @__PURE__ */ React8.createElement("g", { clipPath: "url(#clip0_2659_5018)" }, /* @__PURE__ */ React8.createElement(
|
1842
1801
|
"path",
|
1843
1802
|
{
|
1844
1803
|
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",
|
1845
1804
|
fill: "#31B379"
|
1846
1805
|
}
|
1847
1806
|
)),
|
1848
|
-
/* @__PURE__ */
|
1807
|
+
/* @__PURE__ */ React8.createElement("defs", null, /* @__PURE__ */ React8.createElement("clipPath", { id: "clip0_2659_5018" }, /* @__PURE__ */ React8.createElement(
|
1849
1808
|
"rect",
|
1850
1809
|
{
|
1851
1810
|
width: "22",
|
@@ -1854,20 +1813,20 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
1854
1813
|
transform: "translate(19.5 19.0039)"
|
1855
1814
|
}
|
1856
1815
|
)))
|
1857
|
-
), /* @__PURE__ */
|
1816
|
+
), /* @__PURE__ */ React8.createElement("h1", null, "Success!"), /* @__PURE__ */ React8.createElement("h4", null, "Payment link created successfully.")), /* @__PURE__ */ React8.createElement(Modal5.Footer, null, /* @__PURE__ */ React8.createElement("button", { className: "paymentBtn", onClick: handleClose }, "Ok"))), /* @__PURE__ */ React8.createElement(ToastContainer2, null));
|
1858
1817
|
}
|
1859
1818
|
|
1860
1819
|
// src/app/components/Payment/Payment.tsx
|
1861
|
-
|
1862
|
-
|
1863
|
-
|
1864
|
-
|
1865
|
-
|
1820
|
+
import React10, { useState as useState6 } from "react";
|
1821
|
+
import axios2 from "axios";
|
1822
|
+
import forge from "node-forge";
|
1823
|
+
import { toast as toast3 } from "react-toastify";
|
1824
|
+
import { Modal as Modal6 } from "react-bootstrap";
|
1866
1825
|
|
1867
1826
|
// src/app/components/Payment/Paymentstyles.tsx
|
1868
|
-
|
1827
|
+
import React9 from "react";
|
1869
1828
|
function Paymentstyles() {
|
1870
|
-
return /* @__PURE__ */
|
1829
|
+
return /* @__PURE__ */ React9.createElement("style", null, `
|
1871
1830
|
.paymentBtn {
|
1872
1831
|
background-color: black;
|
1873
1832
|
border: none;
|
@@ -2793,7 +2752,7 @@ input {
|
|
2793
2752
|
// src/app/components/Payment/Payment.tsx
|
2794
2753
|
function Payment() {
|
2795
2754
|
var _a;
|
2796
|
-
const [state, setState] = (
|
2755
|
+
const [state, setState] = useState6({
|
2797
2756
|
show: false,
|
2798
2757
|
publicKey: "",
|
2799
2758
|
sessionKey: "",
|
@@ -2804,12 +2763,12 @@ function Payment() {
|
|
2804
2763
|
zip: "",
|
2805
2764
|
amount: ""
|
2806
2765
|
});
|
2807
|
-
const [isValid, setIsValid] = (
|
2808
|
-
const [isValidMonth, setIsValidMonth] = (
|
2809
|
-
const [data, setData] = (
|
2766
|
+
const [isValid, setIsValid] = useState6(false);
|
2767
|
+
const [isValidMonth, setIsValidMonth] = useState6(false);
|
2768
|
+
const [data, setData] = useState6(null);
|
2810
2769
|
const handlePaymentClick = async () => {
|
2811
2770
|
try {
|
2812
|
-
const response = await
|
2771
|
+
const response = await axios2.post(`${baseUrl}generate-session`, {});
|
2813
2772
|
const data2 = response.data;
|
2814
2773
|
if (data2 && (data2 == null ? void 0 : data2.result) === true) {
|
2815
2774
|
setState((prev) => {
|
@@ -2827,12 +2786,12 @@ function Payment() {
|
|
2827
2786
|
};
|
2828
2787
|
const handleSubmitPay = async () => {
|
2829
2788
|
const track2_data = `${state.cardNumber.replace(/\s+/g, "")}=${state.year}${state.month.length > 1 ? state.month : "0" + state.month} ${state.cvv}`;
|
2830
|
-
const publicKey =
|
2789
|
+
const publicKey = forge.pki.publicKeyFromPem(state.publicKey);
|
2831
2790
|
const encrypted = publicKey.encrypt(track2_data, "RSA-OAEP", {
|
2832
|
-
md:
|
2833
|
-
mgf1: { md:
|
2791
|
+
md: forge.md.sha1.create(),
|
2792
|
+
mgf1: { md: forge.md.sha1.create() }
|
2834
2793
|
});
|
2835
|
-
const encryptedBase64 =
|
2794
|
+
const encryptedBase64 = forge.util.encode64(encrypted);
|
2836
2795
|
console.log(encryptedBase64);
|
2837
2796
|
const requestBody = {
|
2838
2797
|
enc_track2_data: encryptedBase64,
|
@@ -2841,14 +2800,14 @@ function Payment() {
|
|
2841
2800
|
};
|
2842
2801
|
const apiUrl = "https://m1ao5pku8b.execute-api.us-east-2.amazonaws.com/prod/tokenizer/tokenize";
|
2843
2802
|
try {
|
2844
|
-
const response = await
|
2803
|
+
const response = await axios2.post(apiUrl, requestBody, {
|
2845
2804
|
headers: {
|
2846
2805
|
"x-app-session-key": state == null ? void 0 : state.sessionKey,
|
2847
2806
|
"Content-Type": "application/json"
|
2848
2807
|
}
|
2849
2808
|
});
|
2850
2809
|
if ((response == null ? void 0 : response.status) === 200) {
|
2851
|
-
|
2810
|
+
toast3.success("Payment Successful");
|
2852
2811
|
setState((prev) => __spreadProps(__spreadValues({}, prev), {
|
2853
2812
|
show: false,
|
2854
2813
|
publicKey: "",
|
@@ -2958,7 +2917,7 @@ function Payment() {
|
|
2958
2917
|
}
|
2959
2918
|
return "";
|
2960
2919
|
}
|
2961
|
-
return /* @__PURE__ */
|
2920
|
+
return /* @__PURE__ */ React10.createElement(React10.Fragment, null, /* @__PURE__ */ React10.createElement(Paymentstyles, null), /* @__PURE__ */ React10.createElement("div", { className: "" }, /* @__PURE__ */ React10.createElement(
|
2962
2921
|
"button",
|
2963
2922
|
{
|
2964
2923
|
className: "export-btn",
|
@@ -2966,8 +2925,8 @@ function Payment() {
|
|
2966
2925
|
onClick: () => handlePaymentClick()
|
2967
2926
|
},
|
2968
2927
|
"Payment"
|
2969
|
-
), /* @__PURE__ */
|
2970
|
-
|
2928
|
+
), /* @__PURE__ */ React10.createElement(
|
2929
|
+
Modal6,
|
2971
2930
|
{
|
2972
2931
|
show: state.show,
|
2973
2932
|
onHide: () => setState((prev) => __spreadProps(__spreadValues({}, prev), {
|
@@ -2975,8 +2934,8 @@ function Payment() {
|
|
2975
2934
|
})),
|
2976
2935
|
centered: true
|
2977
2936
|
},
|
2978
|
-
/* @__PURE__ */
|
2979
|
-
/* @__PURE__ */
|
2937
|
+
/* @__PURE__ */ React10.createElement(Modal6.Header, { closeButton: true }),
|
2938
|
+
/* @__PURE__ */ React10.createElement(Modal6.Body, null, /* @__PURE__ */ React10.createElement("div", { className: "payment-popup" }, /* @__PURE__ */ React10.createElement("div", { className: "row" }, /* @__PURE__ */ React10.createElement("div", { className: "" }, /* @__PURE__ */ React10.createElement("div", { id: "Checkout", className: "inline" }, /* @__PURE__ */ React10.createElement("div", { className: "header" }, /* @__PURE__ */ React10.createElement("h1", null, "Pay")), /* @__PURE__ */ React10.createElement("form", { id: "PaymentForm", className: "payment-form" }, /* @__PURE__ */ React10.createElement("div", { className: "form-group", style: { display: "none" } }, /* @__PURE__ */ React10.createElement("label", null, "Payment amount"), /* @__PURE__ */ React10.createElement("div", { className: "input-group" }, /* @__PURE__ */ React10.createElement("span", { className: "input-group-addon" }, "$"), /* @__PURE__ */ React10.createElement(
|
2980
2939
|
"input",
|
2981
2940
|
{
|
2982
2941
|
type: "text",
|
@@ -2985,13 +2944,13 @@ function Payment() {
|
|
2985
2944
|
className: "form-control",
|
2986
2945
|
id: ""
|
2987
2946
|
}
|
2988
|
-
)), /* @__PURE__ */
|
2947
|
+
)), /* @__PURE__ */ React10.createElement(
|
2989
2948
|
"span",
|
2990
2949
|
{
|
2991
2950
|
id: "amount-error",
|
2992
2951
|
style: { color: "red", display: "none" }
|
2993
2952
|
}
|
2994
|
-
)), /* @__PURE__ */
|
2953
|
+
)), /* @__PURE__ */ React10.createElement("div", { className: "form-group" }, /* @__PURE__ */ React10.createElement("label", null, "Name on card"), /* @__PURE__ */ React10.createElement(
|
2995
2954
|
"input",
|
2996
2955
|
{
|
2997
2956
|
id: "NameOnCard",
|
@@ -3000,13 +2959,13 @@ function Payment() {
|
|
3000
2959
|
maxLength: 100,
|
3001
2960
|
placeholder: "Name"
|
3002
2961
|
}
|
3003
|
-
), /* @__PURE__ */
|
2962
|
+
), /* @__PURE__ */ React10.createElement(
|
3004
2963
|
"span",
|
3005
2964
|
{
|
3006
2965
|
id: "NameOnCard-error",
|
3007
2966
|
style: { color: "red", display: "none" }
|
3008
2967
|
}
|
3009
|
-
)), /* @__PURE__ */
|
2968
|
+
)), /* @__PURE__ */ React10.createElement("div", { className: "form-group" }, /* @__PURE__ */ React10.createElement(
|
3010
2969
|
"input",
|
3011
2970
|
{
|
3012
2971
|
"data-token": "card_number",
|
@@ -3017,7 +2976,7 @@ function Payment() {
|
|
3017
2976
|
placeholder: "0000 0000 0000 0000",
|
3018
2977
|
onChange: handleCardNumberChange
|
3019
2978
|
}
|
3020
|
-
), state.error && /* @__PURE__ */
|
2979
|
+
), state.error && /* @__PURE__ */ React10.createElement("div", { style: { color: "red" } }, state.error)), /* @__PURE__ */ React10.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ React10.createElement(
|
3021
2980
|
"input",
|
3022
2981
|
{
|
3023
2982
|
"data-token": "exp_month",
|
@@ -3028,14 +2987,14 @@ function Payment() {
|
|
3028
2987
|
maxLength: 2,
|
3029
2988
|
onChange: (e) => handleMonthChange(e)
|
3030
2989
|
}
|
3031
|
-
), isValidMonth && /* @__PURE__ */
|
2990
|
+
), isValidMonth && /* @__PURE__ */ React10.createElement(
|
3032
2991
|
"span",
|
3033
2992
|
{
|
3034
2993
|
id: "card_number-error",
|
3035
2994
|
style: { color: "red", fontSize: "15px" }
|
3036
2995
|
},
|
3037
2996
|
(_a = ErrorText) == null ? void 0 : _a.montherror
|
3038
|
-
)), /* @__PURE__ */
|
2997
|
+
)), /* @__PURE__ */ React10.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ React10.createElement(
|
3039
2998
|
"input",
|
3040
2999
|
{
|
3041
3000
|
"data-token": "exp_year",
|
@@ -3046,7 +3005,7 @@ function Payment() {
|
|
3046
3005
|
value: state.year,
|
3047
3006
|
onChange: (e) => handleYearChange(e)
|
3048
3007
|
}
|
3049
|
-
), state.yearError && /* @__PURE__ */
|
3008
|
+
), state.yearError && /* @__PURE__ */ React10.createElement("span", { id: "exp_year-error", style: { color: "red" } }, state.yearError)), /* @__PURE__ */ React10.createElement("div", { className: "security-code-group form-group" }, /* @__PURE__ */ React10.createElement("div", { className: "input-container" }, /* @__PURE__ */ React10.createElement(
|
3050
3009
|
"input",
|
3051
3010
|
{
|
3052
3011
|
"data-token": "cvv",
|
@@ -3057,7 +3016,7 @@ function Payment() {
|
|
3057
3016
|
placeholder: "CVV",
|
3058
3017
|
onChange: (e) => handleCVVChange(e)
|
3059
3018
|
}
|
3060
|
-
), /* @__PURE__ */
|
3019
|
+
), /* @__PURE__ */ React10.createElement("i", { id: "cvc", className: "fa fa-question-circle" }), state.cvvError && /* @__PURE__ */ React10.createElement("span", { id: "cvv-error", style: { color: "red" } }, state.cvvError)), /* @__PURE__ */ React10.createElement("div", { className: "cvc-preview-container two-card hide" }, /* @__PURE__ */ React10.createElement("div", { className: "amex-cvc-preview" }), /* @__PURE__ */ React10.createElement("div", { className: "visa-mc-dis-cvc-preview" }))), /* @__PURE__ */ React10.createElement("div", { className: "zip-code-group form-group" }, /* @__PURE__ */ React10.createElement("label", null, "Postal code"), /* @__PURE__ */ React10.createElement("div", { className: "input-container" }, /* @__PURE__ */ React10.createElement(
|
3061
3020
|
"input",
|
3062
3021
|
{
|
3063
3022
|
id: "ZIPCode",
|
@@ -3069,7 +3028,7 @@ function Payment() {
|
|
3069
3028
|
value: state.zip,
|
3070
3029
|
onChange: (e) => handleZIP(e)
|
3071
3030
|
}
|
3072
|
-
), /* @__PURE__ */
|
3031
|
+
), /* @__PURE__ */ React10.createElement(
|
3073
3032
|
"a",
|
3074
3033
|
{
|
3075
3034
|
tabIndex: 0,
|
@@ -3079,15 +3038,15 @@ function Payment() {
|
|
3079
3038
|
"data-placement": "left",
|
3080
3039
|
"data-content": "Enter the ZIP/Postal code for your credit card billing address."
|
3081
3040
|
},
|
3082
|
-
/* @__PURE__ */
|
3083
|
-
), /* @__PURE__ */
|
3041
|
+
/* @__PURE__ */ React10.createElement("i", { className: "fa fa-question-circle" })
|
3042
|
+
), /* @__PURE__ */ React10.createElement(
|
3084
3043
|
"span",
|
3085
3044
|
{
|
3086
3045
|
id: "ZIPCode-error",
|
3087
3046
|
style: { color: "red", display: "none" }
|
3088
3047
|
},
|
3089
3048
|
ErrorText.fieldrequired
|
3090
|
-
))), /* @__PURE__ */
|
3049
|
+
))), /* @__PURE__ */ React10.createElement("div", { className: "form-group top-amnt" }, /* @__PURE__ */ React10.createElement("div", null, /* @__PURE__ */ React10.createElement("label", null, "Payment amount"), /* @__PURE__ */ React10.createElement("div", { className: "amount-placeholder" }, /* @__PURE__ */ React10.createElement(
|
3091
3050
|
"input",
|
3092
3051
|
{
|
3093
3052
|
id: "Amount",
|
@@ -3099,7 +3058,7 @@ function Payment() {
|
|
3099
3058
|
onChange: (e) => handleAmount(e),
|
3100
3059
|
onBlur: handleAmountBlur
|
3101
3060
|
}
|
3102
|
-
))), /* @__PURE__ */
|
3061
|
+
))), /* @__PURE__ */ React10.createElement("div", { className: "card-row" }, /* @__PURE__ */ React10.createElement("span", { className: "visa" }), /* @__PURE__ */ React10.createElement("span", { className: "mastercard" }), /* @__PURE__ */ React10.createElement("span", { className: "amex" }), /* @__PURE__ */ React10.createElement("span", { className: "discover" }))), /* @__PURE__ */ React10.createElement(
|
3103
3062
|
"button",
|
3104
3063
|
{
|
3105
3064
|
type: "button",
|
@@ -3108,7 +3067,7 @@ function Payment() {
|
|
3108
3067
|
className: "btn btn-block btn-success submit-button"
|
3109
3068
|
},
|
3110
3069
|
"Pay"
|
3111
|
-
)), /* @__PURE__ */
|
3070
|
+
)), /* @__PURE__ */ React10.createElement("div", { className: "powerd-by-part" }, /* @__PURE__ */ React10.createElement(
|
3112
3071
|
"svg",
|
3113
3072
|
{
|
3114
3073
|
xmlns: "http://www.w3.org/2000/svg",
|
@@ -3116,14 +3075,14 @@ function Payment() {
|
|
3116
3075
|
height: "20",
|
3117
3076
|
viewBox: "0 0 26 26"
|
3118
3077
|
},
|
3119
|
-
/* @__PURE__ */
|
3078
|
+
/* @__PURE__ */ React10.createElement(
|
3120
3079
|
"path",
|
3121
3080
|
{
|
3122
3081
|
fill: "currentColor",
|
3123
3082
|
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"
|
3124
3083
|
}
|
3125
3084
|
)
|
3126
|
-
), "Secure payments powered by Fractal", /* @__PURE__ */
|
3085
|
+
), "Secure payments powered by Fractal", /* @__PURE__ */ React10.createElement(
|
3127
3086
|
"img",
|
3128
3087
|
{
|
3129
3088
|
src: "https://ui.fractalpay.com/favicon.ico",
|
@@ -3135,23 +3094,28 @@ function Payment() {
|
|
3135
3094
|
}
|
3136
3095
|
|
3137
3096
|
// src/app/components/Transaction/CompletedTransactions.tsx
|
3138
|
-
|
3139
|
-
|
3140
|
-
|
3141
|
-
|
3142
|
-
|
3143
|
-
|
3144
|
-
|
3097
|
+
import React12, { useEffect as useEffect3, useState as useState8 } from "react";
|
3098
|
+
import { Col, Row, Table } from "react-bootstrap";
|
3099
|
+
import {
|
3100
|
+
DatatableWrapper,
|
3101
|
+
Filter,
|
3102
|
+
PaginationOptions,
|
3103
|
+
TableBody,
|
3104
|
+
TableHeader
|
3105
|
+
} from "react-bs-datatable";
|
3106
|
+
import DatePicker from "react-datepicker";
|
3107
|
+
import "react-datepicker/dist/react-datepicker.css";
|
3108
|
+
import { toast as toast4 } from "react-toastify";
|
3145
3109
|
|
3146
3110
|
// src/app/components/Pagination/Pagination.tsx
|
3147
|
-
|
3111
|
+
import React11, { useState as useState7, useEffect as useEffect2 } from "react";
|
3148
3112
|
var PaginationPgComp = ({ totalPages, onPageChange, current }) => {
|
3149
|
-
const [currentPage, setCurrentPage] = (
|
3150
|
-
const [showPages, setShowPages] = (
|
3151
|
-
(
|
3113
|
+
const [currentPage, setCurrentPage] = useState7(current);
|
3114
|
+
const [showPages, setShowPages] = useState7(false);
|
3115
|
+
useEffect2(() => {
|
3152
3116
|
setCurrentPage(current);
|
3153
3117
|
}, [current]);
|
3154
|
-
(
|
3118
|
+
useEffect2(() => {
|
3155
3119
|
setTimeout(() => {
|
3156
3120
|
setShowPages(true);
|
3157
3121
|
}, 1e3);
|
@@ -3187,7 +3151,7 @@ var PaginationPgComp = ({ totalPages, onPageChange, current }) => {
|
|
3187
3151
|
if (currentPage > 3) {
|
3188
3152
|
pageNumbers.push(renderPageNumber(1));
|
3189
3153
|
if (currentPage > 4) {
|
3190
|
-
pageNumbers.push(/* @__PURE__ */
|
3154
|
+
pageNumbers.push(/* @__PURE__ */ React11.createElement("li", { key: "start-break", className: "page-item disabled" }, /* @__PURE__ */ React11.createElement("span", { className: "page-link" }, "...")));
|
3191
3155
|
}
|
3192
3156
|
}
|
3193
3157
|
const startPage = Math.max(currentPage - 1, 1);
|
@@ -3197,17 +3161,17 @@ var PaginationPgComp = ({ totalPages, onPageChange, current }) => {
|
|
3197
3161
|
}
|
3198
3162
|
if (currentPage < totalPages - 2) {
|
3199
3163
|
if (currentPage < totalPages - 3) {
|
3200
|
-
pageNumbers.push(/* @__PURE__ */
|
3164
|
+
pageNumbers.push(/* @__PURE__ */ React11.createElement("li", { key: "end-break", className: "page-item disabled" }, /* @__PURE__ */ React11.createElement("span", { className: "page-link" }, "...")));
|
3201
3165
|
}
|
3202
3166
|
pageNumbers.push(renderPageNumber(totalPages));
|
3203
3167
|
}
|
3204
3168
|
}
|
3205
3169
|
return pageNumbers;
|
3206
3170
|
};
|
3207
|
-
const renderPageNumber = (pageNumber) => /* @__PURE__ */
|
3208
|
-
return /* @__PURE__ */
|
3171
|
+
const renderPageNumber = (pageNumber) => /* @__PURE__ */ React11.createElement("li", { key: pageNumber, className: `page-item ${currentPage === pageNumber ? "active" : ""}` }, /* @__PURE__ */ React11.createElement("a", { className: "page-link cursor-pointer", onClick: (e) => handlePageClick(e, pageNumber) }, pageNumber));
|
3172
|
+
return /* @__PURE__ */ React11.createElement(React11.Fragment, null, /* @__PURE__ */ React11.createElement("nav", { className: "app-pagination py-2" }, /* @__PURE__ */ React11.createElement("ul", { className: "pagination justify-content-center" }, /* @__PURE__ */ React11.createElement("li", { className: `page-item ${currentPage === 1 ? "disabled" : ""}` }, /* @__PURE__ */ React11.createElement("a", { className: "page-link cursor-pointer", onClick: handlePrevious }, /* @__PURE__ */ React11.createElement("span", null, "\u2B9C"))), showPages && getPageNumbers(), /* @__PURE__ */ React11.createElement("li", { className: `page-item ${currentPage === totalPages ? "disabled" : ""}` }, /* @__PURE__ */ React11.createElement("a", { className: "page-link cursor-pointer", onClick: handleNext }, /* @__PURE__ */ React11.createElement("span", null, "\u2B9E"))))));
|
3209
3173
|
};
|
3210
|
-
var PaginationPg =
|
3174
|
+
var PaginationPg = React11.memo(PaginationPgComp);
|
3211
3175
|
|
3212
3176
|
// src/app/components/Transaction/CompletedTransactions.tsx
|
3213
3177
|
var STORY_HEADERS = [
|
@@ -3244,10 +3208,10 @@ var STORY_HEADERS = [
|
|
3244
3208
|
}
|
3245
3209
|
];
|
3246
3210
|
function CompletedTransactions(props) {
|
3247
|
-
const [dataList, setDataList] = (
|
3248
|
-
const [startDate, setStartDate] = (
|
3249
|
-
const [endDate, setEndDate] = (
|
3250
|
-
const [state, setState] = (
|
3211
|
+
const [dataList, setDataList] = useState8([]);
|
3212
|
+
const [startDate, setStartDate] = useState8(null);
|
3213
|
+
const [endDate, setEndDate] = useState8(null);
|
3214
|
+
const [state, setState] = useState8({
|
3251
3215
|
page: 1,
|
3252
3216
|
totalPage: 0,
|
3253
3217
|
data: [],
|
@@ -3283,13 +3247,22 @@ function CompletedTransactions(props) {
|
|
3283
3247
|
const fetchData = async (newPage, startDate2, endDate2) => {
|
3284
3248
|
var _a, _b;
|
3285
3249
|
try {
|
3286
|
-
const response = await
|
3287
|
-
|
3288
|
-
|
3289
|
-
|
3290
|
-
|
3250
|
+
const response = await fetch(`${baseUrl}get-complete-request-payments`, {
|
3251
|
+
method: "POST",
|
3252
|
+
headers: {
|
3253
|
+
"Content-Type": "application/json"
|
3254
|
+
},
|
3255
|
+
body: JSON.stringify({
|
3256
|
+
fractalpayPublicKey: props.fractalpayClientKey,
|
3257
|
+
page: newPage,
|
3258
|
+
dateStart: startDate2 ? formatDate(startDate2) : "",
|
3259
|
+
dateEnd: endDate2 ? formatDate(endDate2) : ""
|
3260
|
+
})
|
3291
3261
|
});
|
3292
|
-
|
3262
|
+
if (!response.ok) {
|
3263
|
+
throw new Error(`HTTP error! status: ${response.status}`);
|
3264
|
+
}
|
3265
|
+
const data = await response.json();
|
3293
3266
|
setState((prev) => {
|
3294
3267
|
var _a2;
|
3295
3268
|
return __spreadProps(__spreadValues({}, prev), { totalPage: (_a2 = data == null ? void 0 : data.data) == null ? void 0 : _a2.totalPage });
|
@@ -3325,23 +3298,32 @@ function CompletedTransactions(props) {
|
|
3325
3298
|
setEndDate(date);
|
3326
3299
|
};
|
3327
3300
|
const handleExport = async () => {
|
3328
|
-
var _a;
|
3329
3301
|
if (!startDate) {
|
3330
|
-
|
3302
|
+
toast4.error("Start date required");
|
3331
3303
|
} else if (!endDate) {
|
3332
|
-
|
3304
|
+
toast4.error("End date required");
|
3333
3305
|
} else {
|
3334
3306
|
setState((prev) => __spreadProps(__spreadValues({}, prev), { csvData: true }));
|
3335
3307
|
try {
|
3336
|
-
const response = await
|
3337
|
-
|
3338
|
-
|
3339
|
-
|
3340
|
-
|
3308
|
+
const response = await fetch(`${baseUrl}get-complete-request-payments`, {
|
3309
|
+
method: "POST",
|
3310
|
+
headers: {
|
3311
|
+
"Content-Type": "application/json"
|
3312
|
+
},
|
3313
|
+
body: JSON.stringify({
|
3314
|
+
fractalpayPublicKey: props.fractalpayClientKey,
|
3315
|
+
dateStart: startDate ? formatDate(startDate) : "",
|
3316
|
+
dateEnd: endDate ? formatDate(endDate) : "",
|
3317
|
+
isExport: true
|
3318
|
+
})
|
3341
3319
|
});
|
3342
|
-
if (response.
|
3320
|
+
if (!response.ok) {
|
3321
|
+
throw new Error(`HTTP error! status: ${response.status}`);
|
3322
|
+
}
|
3323
|
+
const data = await response.json();
|
3324
|
+
if (data.status) {
|
3343
3325
|
const link = document.createElement("a");
|
3344
|
-
link.href = `${
|
3326
|
+
link.href = `${data == null ? void 0 : data.data}`;
|
3345
3327
|
link.target = "_blank";
|
3346
3328
|
document.body.appendChild(link);
|
3347
3329
|
link.click();
|
@@ -3352,19 +3334,19 @@ function CompletedTransactions(props) {
|
|
3352
3334
|
}
|
3353
3335
|
}
|
3354
3336
|
};
|
3355
|
-
(
|
3337
|
+
useEffect3(() => {
|
3356
3338
|
fetchData(state.page, startDate, endDate);
|
3357
3339
|
}, [state.page]);
|
3358
3340
|
const handlePageChange = (pageNumber) => {
|
3359
3341
|
setState((prev) => __spreadProps(__spreadValues({}, prev), { page: pageNumber }));
|
3360
3342
|
fetchData(pageNumber, startDate, endDate);
|
3361
3343
|
};
|
3362
|
-
return /* @__PURE__ */
|
3344
|
+
return /* @__PURE__ */ React12.createElement(React12.Fragment, null, /* @__PURE__ */ React12.createElement("style", null, `
|
3363
3345
|
.react-datepicker-wrapper:first-child {
|
3364
3346
|
margin-right: 10px;
|
3365
3347
|
}
|
3366
|
-
`), /* @__PURE__ */
|
3367
|
-
|
3348
|
+
`), /* @__PURE__ */ React12.createElement("div", { className: "mb-5" }, /* @__PURE__ */ React12.createElement("div", null, /* @__PURE__ */ React12.createElement("div", { style: { display: "flex" } }, /* @__PURE__ */ React12.createElement("div", { style: { display: "flex", marginRight: "10px", marginTop: "25px" } }, /* @__PURE__ */ React12.createElement(
|
3349
|
+
DatePicker,
|
3368
3350
|
{
|
3369
3351
|
selected: startDate,
|
3370
3352
|
onChange: handleStartDateChange,
|
@@ -3374,8 +3356,8 @@ function CompletedTransactions(props) {
|
|
3374
3356
|
placeholderText: "Start Date",
|
3375
3357
|
required: true
|
3376
3358
|
}
|
3377
|
-
), /* @__PURE__ */
|
3378
|
-
|
3359
|
+
), /* @__PURE__ */ React12.createElement(
|
3360
|
+
DatePicker,
|
3379
3361
|
{
|
3380
3362
|
selected: endDate,
|
3381
3363
|
onChange: handleEndDateChange,
|
@@ -3385,8 +3367,8 @@ function CompletedTransactions(props) {
|
|
3385
3367
|
minDate: startDate,
|
3386
3368
|
placeholderText: "End Date"
|
3387
3369
|
}
|
3388
|
-
)), /* @__PURE__ */
|
3389
|
-
|
3370
|
+
)), /* @__PURE__ */ React12.createElement("button", { className: "export-btn1", onClick: handleExport }, "Export")), /* @__PURE__ */ React12.createElement(
|
3371
|
+
DatatableWrapper,
|
3390
3372
|
{
|
3391
3373
|
body: dataList,
|
3392
3374
|
headers: STORY_HEADERS,
|
@@ -3397,21 +3379,21 @@ function CompletedTransactions(props) {
|
|
3397
3379
|
}
|
3398
3380
|
}
|
3399
3381
|
},
|
3400
|
-
/* @__PURE__ */
|
3401
|
-
/* @__PURE__ */
|
3402
|
-
/* @__PURE__ */
|
3382
|
+
/* @__PURE__ */ React12.createElement(Row, { className: "mb-4 p-2" }, /* @__PURE__ */ React12.createElement(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__ */ React12.createElement(PaginationOptions, null)), /* @__PURE__ */ React12.createElement(Col, { xs: 12, lg: 4, className: "d-flex flex-col justify-content-end align-items-end" }), /* @__PURE__ */ React12.createElement(Col, { xs: 12, sm: 6, lg: 4, className: "d-flex flex-col justify-content-end align-items-end" }, /* @__PURE__ */ React12.createElement(Filter, null))),
|
3383
|
+
/* @__PURE__ */ React12.createElement(Row, null, /* @__PURE__ */ React12.createElement("div", { className: "responsive-tbl" }, /* @__PURE__ */ React12.createElement(Table, null, /* @__PURE__ */ React12.createElement(TableHeader, null), /* @__PURE__ */ React12.createElement(TableBody, null)))),
|
3384
|
+
/* @__PURE__ */ React12.createElement(PaginationPg, { totalPages: state.totalPage, onPageChange: handlePageChange, current: state.page })
|
3403
3385
|
))));
|
3404
3386
|
}
|
3405
3387
|
|
3406
3388
|
// src/app/components/Payment/TockenizPay.tsx
|
3407
|
-
|
3408
|
-
|
3409
|
-
|
3410
|
-
|
3411
|
-
|
3412
|
-
|
3389
|
+
import React13, { useState as useState9 } from "react";
|
3390
|
+
import { Modal as Modal7 } from "react-bootstrap";
|
3391
|
+
import { toast as toast5, ToastContainer as ToastContainer3 } from "react-toastify";
|
3392
|
+
import axios3 from "axios";
|
3393
|
+
import forge2 from "node-forge";
|
3394
|
+
import creditCardType from "credit-card-type";
|
3413
3395
|
function TockenizPay() {
|
3414
|
-
const [state, setState] = (
|
3396
|
+
const [state, setState] = useState9({
|
3415
3397
|
show: false,
|
3416
3398
|
publicKey: "",
|
3417
3399
|
sessionKey: "",
|
@@ -3422,13 +3404,13 @@ function TockenizPay() {
|
|
3422
3404
|
zip: "",
|
3423
3405
|
amount: ""
|
3424
3406
|
});
|
3425
|
-
const [cardTypeDetail, setCardTypeDetail] = (
|
3426
|
-
const [isValid, setIsValid] = (
|
3427
|
-
const [isValidMonth, setIsValidMonth] = (
|
3428
|
-
const [data, setData] = (
|
3407
|
+
const [cardTypeDetail, setCardTypeDetail] = useState9(null);
|
3408
|
+
const [isValid, setIsValid] = useState9(false);
|
3409
|
+
const [isValidMonth, setIsValidMonth] = useState9(false);
|
3410
|
+
const [data, setData] = useState9(null);
|
3429
3411
|
const handlePaymentClick = async () => {
|
3430
3412
|
try {
|
3431
|
-
const response = await
|
3413
|
+
const response = await axios3.post(`${baseUrl}/generate-session`, {});
|
3432
3414
|
const data2 = response.data;
|
3433
3415
|
if (data2 && (data2 == null ? void 0 : data2.result) === true) {
|
3434
3416
|
setState((prev) => {
|
@@ -3447,14 +3429,14 @@ function TockenizPay() {
|
|
3447
3429
|
const handleSubmitPay = async () => {
|
3448
3430
|
var _a, _b, _c, _d, _e;
|
3449
3431
|
let track2_data = `${(_a = state == null ? void 0 : state.cardNumber) == null ? void 0 : _a.replaceAll(" ", "")}=${state.year}${((_b = state == null ? void 0 : state.month) == null ? void 0 : _b.length) > 1 ? state == null ? void 0 : state.month : "0" + (state == null ? void 0 : state.month)} ${state.cvv}`;
|
3450
|
-
const publicKey =
|
3432
|
+
const publicKey = forge2.pki.publicKeyFromPem(state.publicKey);
|
3451
3433
|
const encrypted = publicKey.encrypt(track2_data, "RSA-OAEP", {
|
3452
|
-
md:
|
3434
|
+
md: forge2.md.sha1.create(),
|
3453
3435
|
mgf1: {
|
3454
|
-
md:
|
3436
|
+
md: forge2.md.sha1.create()
|
3455
3437
|
}
|
3456
3438
|
});
|
3457
|
-
const encryptedBase64 =
|
3439
|
+
const encryptedBase64 = forge2.util.encode64(encrypted);
|
3458
3440
|
console.log(encryptedBase64);
|
3459
3441
|
const requestBody = {
|
3460
3442
|
enc_track2_data: encryptedBase64,
|
@@ -3462,7 +3444,7 @@ function TockenizPay() {
|
|
3462
3444
|
algorithm: "RSAES_OAEP_SHA_1"
|
3463
3445
|
};
|
3464
3446
|
try {
|
3465
|
-
const response = await
|
3447
|
+
const response = await axios3.post(
|
3466
3448
|
"https://m1ao5pku8b.execute-api.us-east-2.amazonaws.com/prod/tokenizer/tokenize",
|
3467
3449
|
requestBody,
|
3468
3450
|
{
|
@@ -3473,7 +3455,7 @@ function TockenizPay() {
|
|
3473
3455
|
}
|
3474
3456
|
);
|
3475
3457
|
if ((response == null ? void 0 : response.status) === 200) {
|
3476
|
-
|
3458
|
+
toast5.success("Payment Successful");
|
3477
3459
|
setState((prev) => __spreadProps(__spreadValues({}, prev), {
|
3478
3460
|
show: false,
|
3479
3461
|
publicKey: "",
|
@@ -3488,7 +3470,7 @@ function TockenizPay() {
|
|
3488
3470
|
}
|
3489
3471
|
console.log("response", response);
|
3490
3472
|
} catch (error) {
|
3491
|
-
|
3473
|
+
toast5.error((_e = (_d = (_c = error == null ? void 0 : error.response) == null ? void 0 : _c.data) == null ? void 0 : _d.data) == null ? void 0 : _e.message);
|
3492
3474
|
console.error("Error:", error);
|
3493
3475
|
}
|
3494
3476
|
};
|
@@ -3520,9 +3502,9 @@ function TockenizPay() {
|
|
3520
3502
|
e.preventDefault();
|
3521
3503
|
e.stopPropagation();
|
3522
3504
|
const { value } = e.target;
|
3523
|
-
let cardtyp = (
|
3505
|
+
let cardtyp = creditCardType(value)[0];
|
3524
3506
|
const formattedValue = formatCreditCardNumber(value, cardtyp == null ? void 0 : cardtyp.type);
|
3525
|
-
setCardTypeDetail((
|
3507
|
+
setCardTypeDetail(creditCardType(value)[0]);
|
3526
3508
|
console.log(formattedValue);
|
3527
3509
|
if (value.match(/[a-zA-Z]/)) {
|
3528
3510
|
setState((prev) => __spreadProps(__spreadValues({}, prev), {
|
@@ -3625,7 +3607,7 @@ function TockenizPay() {
|
|
3625
3607
|
return "";
|
3626
3608
|
}
|
3627
3609
|
console.log("===================cardtype===============", cardTypeDetail);
|
3628
|
-
return /* @__PURE__ */
|
3610
|
+
return /* @__PURE__ */ React13.createElement("div", null, /* @__PURE__ */ React13.createElement(ToastContainer3, null), /* @__PURE__ */ React13.createElement(
|
3629
3611
|
"button",
|
3630
3612
|
{
|
3631
3613
|
className: "export-btn mt-4",
|
@@ -3633,8 +3615,8 @@ function TockenizPay() {
|
|
3633
3615
|
onClick: () => handlePaymentClick()
|
3634
3616
|
},
|
3635
3617
|
"TokenizePay"
|
3636
|
-
), /* @__PURE__ */
|
3637
|
-
|
3618
|
+
), /* @__PURE__ */ React13.createElement(
|
3619
|
+
Modal7,
|
3638
3620
|
{
|
3639
3621
|
show: state.show,
|
3640
3622
|
onHide: () => setState((prev) => __spreadProps(__spreadValues({}, prev), {
|
@@ -3642,8 +3624,8 @@ function TockenizPay() {
|
|
3642
3624
|
})),
|
3643
3625
|
centered: true
|
3644
3626
|
},
|
3645
|
-
/* @__PURE__ */
|
3646
|
-
/* @__PURE__ */
|
3627
|
+
/* @__PURE__ */ React13.createElement(Modal7.Header, { closeButton: true }),
|
3628
|
+
/* @__PURE__ */ React13.createElement(Modal7.Body, null, /* @__PURE__ */ React13.createElement("div", { className: "payment-popup" }, /* @__PURE__ */ React13.createElement("div", { className: "row" }, /* @__PURE__ */ React13.createElement("div", { className: "" }, /* @__PURE__ */ React13.createElement("div", { id: "Checkout", className: "inline" }, /* @__PURE__ */ React13.createElement("div", { className: "header" }, /* @__PURE__ */ React13.createElement("h1", null, "Pay")), /* @__PURE__ */ React13.createElement("form", { id: "PaymentForm", className: "payment-form" }, /* @__PURE__ */ React13.createElement("div", { className: "form-group" }, /* @__PURE__ */ React13.createElement("label", null, "Name on card"), /* @__PURE__ */ React13.createElement(
|
3647
3629
|
"input",
|
3648
3630
|
{
|
3649
3631
|
id: "NameOnCard",
|
@@ -3652,13 +3634,13 @@ function TockenizPay() {
|
|
3652
3634
|
maxLength: 100,
|
3653
3635
|
placeholder: "Name"
|
3654
3636
|
}
|
3655
|
-
), /* @__PURE__ */
|
3637
|
+
), /* @__PURE__ */ React13.createElement(
|
3656
3638
|
"span",
|
3657
3639
|
{
|
3658
3640
|
id: "NameOnCard-error",
|
3659
3641
|
style: { color: "red", display: "none" }
|
3660
3642
|
}
|
3661
|
-
)), /* @__PURE__ */
|
3643
|
+
)), /* @__PURE__ */ React13.createElement("div", { className: "form-group" }, /* @__PURE__ */ React13.createElement(
|
3662
3644
|
"input",
|
3663
3645
|
{
|
3664
3646
|
"data-token": "card_number",
|
@@ -3669,7 +3651,7 @@ function TockenizPay() {
|
|
3669
3651
|
placeholder: "0000 0000 0000 0000",
|
3670
3652
|
onChange: handleCardNumberChange
|
3671
3653
|
}
|
3672
|
-
), state.error && /* @__PURE__ */
|
3654
|
+
), state.error && /* @__PURE__ */ React13.createElement("div", { style: { color: "red" } }, state.error)), /* @__PURE__ */ React13.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ React13.createElement(
|
3673
3655
|
"input",
|
3674
3656
|
{
|
3675
3657
|
"data-token": "exp_month",
|
@@ -3680,14 +3662,14 @@ function TockenizPay() {
|
|
3680
3662
|
maxLength: 2,
|
3681
3663
|
onChange: (e) => handleMonthChange(e)
|
3682
3664
|
}
|
3683
|
-
), isValidMonth && /* @__PURE__ */
|
3665
|
+
), isValidMonth && /* @__PURE__ */ React13.createElement(
|
3684
3666
|
"span",
|
3685
3667
|
{
|
3686
3668
|
id: "card_number-error",
|
3687
3669
|
style: { color: "red", fontSize: "15px" }
|
3688
3670
|
},
|
3689
3671
|
"Please write month only 1 to 12"
|
3690
|
-
)), /* @__PURE__ */
|
3672
|
+
)), /* @__PURE__ */ React13.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ React13.createElement(
|
3691
3673
|
"input",
|
3692
3674
|
{
|
3693
3675
|
"data-token": "exp_year",
|
@@ -3698,7 +3680,7 @@ function TockenizPay() {
|
|
3698
3680
|
value: state.year,
|
3699
3681
|
onChange: (e) => handleYearChange(e)
|
3700
3682
|
}
|
3701
|
-
), state.yearError && /* @__PURE__ */
|
3683
|
+
), state.yearError && /* @__PURE__ */ React13.createElement("span", { id: "exp_year-error", style: { color: "red" } }, state.yearError)), /* @__PURE__ */ React13.createElement("div", { className: "security-code-group form-group" }, /* @__PURE__ */ React13.createElement("div", { className: "input-container" }, /* @__PURE__ */ React13.createElement(
|
3702
3684
|
"input",
|
3703
3685
|
{
|
3704
3686
|
"data-token": "cvv",
|
@@ -3709,7 +3691,7 @@ function TockenizPay() {
|
|
3709
3691
|
placeholder: "CVV",
|
3710
3692
|
onChange: (e) => handleCVVChange(e)
|
3711
3693
|
}
|
3712
|
-
), /* @__PURE__ */
|
3694
|
+
), /* @__PURE__ */ React13.createElement("i", { id: "cvc", className: "fa fa-question-circle" }), state.cvvError && /* @__PURE__ */ React13.createElement("span", { id: "cvv-error", style: { color: "red" } }, state.cvvError)), /* @__PURE__ */ React13.createElement("div", { className: "cvc-preview-container two-card hide" }, /* @__PURE__ */ React13.createElement("div", { className: "amex-cvc-preview" }), /* @__PURE__ */ React13.createElement("div", { className: "visa-mc-dis-cvc-preview" }))), /* @__PURE__ */ React13.createElement("div", { className: "zip-code-group form-group" }, /* @__PURE__ */ React13.createElement("label", null, "Postal code"), /* @__PURE__ */ React13.createElement("div", { className: "input-container" }, /* @__PURE__ */ React13.createElement(
|
3713
3695
|
"input",
|
3714
3696
|
{
|
3715
3697
|
id: "ZIPCode",
|
@@ -3721,7 +3703,7 @@ function TockenizPay() {
|
|
3721
3703
|
value: state.zip,
|
3722
3704
|
onChange: (e) => handleZIP(e)
|
3723
3705
|
}
|
3724
|
-
), /* @__PURE__ */
|
3706
|
+
), /* @__PURE__ */ React13.createElement(
|
3725
3707
|
"a",
|
3726
3708
|
{
|
3727
3709
|
tabIndex: 0,
|
@@ -3731,15 +3713,15 @@ function TockenizPay() {
|
|
3731
3713
|
"data-placement": "left",
|
3732
3714
|
"data-content": "Enter the ZIP/Postal code for your credit card billing address."
|
3733
3715
|
},
|
3734
|
-
/* @__PURE__ */
|
3735
|
-
), /* @__PURE__ */
|
3716
|
+
/* @__PURE__ */ React13.createElement("i", { className: "fa fa-question-circle" })
|
3717
|
+
), /* @__PURE__ */ React13.createElement(
|
3736
3718
|
"span",
|
3737
3719
|
{
|
3738
3720
|
id: "ZIPCode-error",
|
3739
3721
|
style: { color: "red", display: "none" }
|
3740
3722
|
},
|
3741
3723
|
"This field is required"
|
3742
|
-
))), /* @__PURE__ */
|
3724
|
+
))), /* @__PURE__ */ React13.createElement("div", { className: "form-group top-amnt" }, /* @__PURE__ */ React13.createElement("div", null, /* @__PURE__ */ React13.createElement("label", null, "Payment amount"), /* @__PURE__ */ React13.createElement("div", { className: "amount-placeholder" }, /* @__PURE__ */ React13.createElement(
|
3743
3725
|
"input",
|
3744
3726
|
{
|
3745
3727
|
id: "Amount",
|
@@ -3751,7 +3733,7 @@ function TockenizPay() {
|
|
3751
3733
|
onChange: (e) => handleAmount(e),
|
3752
3734
|
onBlur: handleAmountBlur
|
3753
3735
|
}
|
3754
|
-
))), /* @__PURE__ */
|
3736
|
+
))), /* @__PURE__ */ React13.createElement("div", { className: "card-row" }, /* @__PURE__ */ React13.createElement("span", { className: "visa" }), /* @__PURE__ */ React13.createElement("span", { className: "mastercard" }), /* @__PURE__ */ React13.createElement("span", { className: "amex" }), /* @__PURE__ */ React13.createElement("span", { className: "discover" }))), /* @__PURE__ */ React13.createElement(
|
3755
3737
|
"button",
|
3756
3738
|
{
|
3757
3739
|
type: "button",
|
@@ -3760,7 +3742,7 @@ function TockenizPay() {
|
|
3760
3742
|
className: "btn btn-block btn-success submit-button"
|
3761
3743
|
},
|
3762
3744
|
"Submit"
|
3763
|
-
)), /* @__PURE__ */
|
3745
|
+
)), /* @__PURE__ */ React13.createElement("div", { className: "powerd-by-part" }, /* @__PURE__ */ React13.createElement(
|
3764
3746
|
"svg",
|
3765
3747
|
{
|
3766
3748
|
xmlns: "http://www.w3.org/2000/svg",
|
@@ -3768,14 +3750,14 @@ function TockenizPay() {
|
|
3768
3750
|
height: "20",
|
3769
3751
|
viewBox: "0 0 26 26"
|
3770
3752
|
},
|
3771
|
-
/* @__PURE__ */
|
3753
|
+
/* @__PURE__ */ React13.createElement(
|
3772
3754
|
"path",
|
3773
3755
|
{
|
3774
3756
|
fill: "currentColor",
|
3775
3757
|
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"
|
3776
3758
|
}
|
3777
3759
|
)
|
3778
|
-
), "Secure payments powered by Fractal", /* @__PURE__ */
|
3760
|
+
), "Secure payments powered by Fractal", /* @__PURE__ */ React13.createElement(
|
3779
3761
|
"img",
|
3780
3762
|
{
|
3781
3763
|
src: "https://ui.fractalpay.com/favicon.ico",
|
@@ -3787,25 +3769,25 @@ function TockenizPay() {
|
|
3787
3769
|
}
|
3788
3770
|
|
3789
3771
|
// src/app/components/Payment/GetPaymentDynamic.tsx
|
3790
|
-
|
3791
|
-
|
3772
|
+
import React15, { useEffect as useEffect4, useState as useState10 } from "react";
|
3773
|
+
import { Modal as Modal8 } from "react-bootstrap";
|
3792
3774
|
|
3793
3775
|
// src/app/components/Loader/MyLoadingAnimation.tsx
|
3794
|
-
|
3776
|
+
import React14 from "react";
|
3795
3777
|
function MyLoadingAnimation() {
|
3796
|
-
return /* @__PURE__ */
|
3778
|
+
return /* @__PURE__ */ React14.createElement(React14.Fragment, null, /* @__PURE__ */ React14.createElement(LoaderStyle_default, null), /* @__PURE__ */ React14.createElement("div", { className: "loading-animation" }, /* @__PURE__ */ React14.createElement("div", { className: "spinner" })));
|
3797
3779
|
}
|
3798
3780
|
|
3799
3781
|
// src/app/components/Payment/GetPaymentDynamic.tsx
|
3800
3782
|
function GetPaymentDynamic(props) {
|
3801
3783
|
const { amount, fractalpayClientKey, orderID } = props;
|
3802
|
-
const [loading, setLoading] = (
|
3803
|
-
const [show, setShow] = (
|
3804
|
-
const [iframeLoaded, setIframeLoaded] = (
|
3805
|
-
const [phoneNumber, setPhoneNumber] = (
|
3806
|
-
const [errorMessage, setErrorMessage] = (
|
3807
|
-
const [submitClicked, setSubmitClicked] = (
|
3808
|
-
const [isValidNumber, setIsValidNumber] = (
|
3784
|
+
const [loading, setLoading] = useState10(false);
|
3785
|
+
const [show, setShow] = useState10(false);
|
3786
|
+
const [iframeLoaded, setIframeLoaded] = useState10(false);
|
3787
|
+
const [phoneNumber, setPhoneNumber] = useState10("");
|
3788
|
+
const [errorMessage, setErrorMessage] = useState10("");
|
3789
|
+
const [submitClicked, setSubmitClicked] = useState10(false);
|
3790
|
+
const [isValidNumber, setIsValidNumber] = useState10(true);
|
3809
3791
|
const handleClose = () => {
|
3810
3792
|
setIframeLoaded(false);
|
3811
3793
|
setTimeout(() => {
|
@@ -3820,7 +3802,7 @@ function GetPaymentDynamic(props) {
|
|
3820
3802
|
console.error("Fractalpay client key is missing or empty.");
|
3821
3803
|
}
|
3822
3804
|
};
|
3823
|
-
(
|
3805
|
+
useEffect4(() => {
|
3824
3806
|
if (!fractalpayClientKey) {
|
3825
3807
|
console.error("Fractalpay client key is missing or empty.");
|
3826
3808
|
}
|
@@ -3843,7 +3825,7 @@ function GetPaymentDynamic(props) {
|
|
3843
3825
|
const handleLoad = () => {
|
3844
3826
|
setLoading(false);
|
3845
3827
|
};
|
3846
|
-
(
|
3828
|
+
useEffect4(() => {
|
3847
3829
|
const messageListener = (event) => {
|
3848
3830
|
var _a, _b;
|
3849
3831
|
const response = (_b = (_a = event == null ? void 0 : event.data) == null ? void 0 : _a.other) == null ? void 0 : _b.data;
|
@@ -3858,7 +3840,7 @@ function GetPaymentDynamic(props) {
|
|
3858
3840
|
window.removeEventListener("message", messageListener);
|
3859
3841
|
};
|
3860
3842
|
}, []);
|
3861
|
-
return /* @__PURE__ */
|
3843
|
+
return /* @__PURE__ */ React15.createElement("div", null, /* @__PURE__ */ React15.createElement("button", { className: "paymentBtn", onClick: handleShow }, "Pay"), /* @__PURE__ */ React15.createElement(Modal8, { show: show && iframeLoaded, id: "modal-pay", className: "modal-lg", onHide: handleClose }, /* @__PURE__ */ React15.createElement(Modal8.Header, { closeButton: true }), /* @__PURE__ */ React15.createElement(Modal8.Body, null, loading && /* @__PURE__ */ React15.createElement(MyLoadingAnimation, null), /* @__PURE__ */ React15.createElement(
|
3862
3844
|
"iframe",
|
3863
3845
|
{
|
3864
3846
|
src: `${baseUrl}widget-form/${amount}?fractalpay_public_key=${fractalpayClientKey}&order_id=${orderID}`,
|
@@ -3869,8 +3851,7 @@ function GetPaymentDynamic(props) {
|
|
3869
3851
|
}
|
3870
3852
|
))));
|
3871
3853
|
}
|
3872
|
-
|
3873
|
-
0 && (module.exports = {
|
3854
|
+
export {
|
3874
3855
|
CompletedTransactions,
|
3875
3856
|
GetPaymentDynamic,
|
3876
3857
|
Payment,
|
@@ -3880,4 +3861,4 @@ function GetPaymentDynamic(props) {
|
|
3880
3861
|
RequestPaymentonClick,
|
3881
3862
|
RqstPaymntInputField,
|
3882
3863
|
TockenizPay
|
3883
|
-
}
|
3864
|
+
};
|