@pinerohit11/testwidget 0.1.50 → 0.1.52
Sign up to get free protection for your applications and to get access to all the features.
- package/dist/index.js +330 -262
- package/dist/{index.cjs → index.mjs} +294 -298
- package/package.json +2 -4
- /package/dist/{index.d.cts → index.d.mts} +0 -0
package/dist/index.js
CHANGED
@@ -1,7 +1,12 @@
|
|
1
|
+
"use strict";
|
2
|
+
var __create = Object.create;
|
1
3
|
var __defProp = Object.defineProperty;
|
2
4
|
var __defProps = Object.defineProperties;
|
5
|
+
var __getOwnPropDesc = Object.getOwnPropertyDescriptor;
|
3
6
|
var __getOwnPropDescs = Object.getOwnPropertyDescriptors;
|
7
|
+
var __getOwnPropNames = Object.getOwnPropertyNames;
|
4
8
|
var __getOwnPropSymbols = Object.getOwnPropertySymbols;
|
9
|
+
var __getProtoOf = Object.getPrototypeOf;
|
5
10
|
var __hasOwnProp = Object.prototype.hasOwnProperty;
|
6
11
|
var __propIsEnum = Object.prototype.propertyIsEnumerable;
|
7
12
|
var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { enumerable: true, configurable: true, writable: true, value }) : obj[key] = value;
|
@@ -17,18 +22,53 @@ var __spreadValues = (a, b) => {
|
|
17
22
|
return a;
|
18
23
|
};
|
19
24
|
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);
|
20
61
|
|
21
62
|
// src/app/components/RequestPayment/RequestPayment.tsx
|
22
|
-
|
23
|
-
import axios from "axios";
|
63
|
+
var import_react4 = __toESM(require("react"));
|
24
64
|
|
25
65
|
// src/app/components/Loader/Loader.tsx
|
26
|
-
|
66
|
+
var import_react2 = __toESM(require("react"));
|
27
67
|
|
28
68
|
// src/app/components/Loader/LoaderStyle.tsx
|
29
|
-
|
69
|
+
var import_react = __toESM(require("react"));
|
30
70
|
var LoaderStyle = (props) => {
|
31
|
-
return /* @__PURE__ */
|
71
|
+
return /* @__PURE__ */ import_react.default.createElement("style", null, `
|
32
72
|
.loader {
|
33
73
|
position: fixed;
|
34
74
|
/* Fixed position to cover the viewport */
|
@@ -147,17 +187,17 @@ var LoaderStyle_default = LoaderStyle;
|
|
147
187
|
|
148
188
|
// src/app/components/Loader/Loader.tsx
|
149
189
|
var Loader = (props) => {
|
150
|
-
return /* @__PURE__ */
|
190
|
+
return /* @__PURE__ */ import_react2.default.createElement(import_react2.default.Fragment, null, /* @__PURE__ */ import_react2.default.createElement(LoaderStyle_default, null), (props == null ? void 0 : props.loading) && /* @__PURE__ */ import_react2.default.createElement("div", { className: "loader" }, /* @__PURE__ */ import_react2.default.createElement("div", { className: "lds-ellipsis" }, /* @__PURE__ */ import_react2.default.createElement("div", null), /* @__PURE__ */ import_react2.default.createElement("div", null), /* @__PURE__ */ import_react2.default.createElement("div", null), /* @__PURE__ */ import_react2.default.createElement("div", null))));
|
151
191
|
};
|
152
192
|
var Loader_default = Loader;
|
153
193
|
|
154
194
|
// src/app/components/RequestPayment/RequestPayment.tsx
|
155
|
-
|
195
|
+
var import_react_bootstrap = require("react-bootstrap");
|
156
196
|
|
157
197
|
// src/app/components/RequestPayment/RequestPaymentstyles.tsx
|
158
|
-
|
198
|
+
var import_react3 = __toESM(require("react"));
|
159
199
|
var RequestPaymentstyles = (props) => {
|
160
|
-
return /* @__PURE__ */
|
200
|
+
return /* @__PURE__ */ import_react3.default.createElement("style", null, `
|
161
201
|
.paymentBtn {
|
162
202
|
background-color: black;
|
163
203
|
border: none;
|
@@ -1011,10 +1051,10 @@ var ErrorText = {
|
|
1011
1051
|
// src/app/components/RequestPayment/RequestPayment.tsx
|
1012
1052
|
function RequestPayment(props) {
|
1013
1053
|
const fractalpayClientKey = props.fractalpayClientKey;
|
1014
|
-
const [show, setShow] = useState(false);
|
1015
|
-
const [loading, setLoading] = useState(false);
|
1016
|
-
const [errors, setErrors] = useState({});
|
1017
|
-
const [requestDetails, setRequestDetails] = useState({
|
1054
|
+
const [show, setShow] = (0, import_react4.useState)(false);
|
1055
|
+
const [loading, setLoading] = (0, import_react4.useState)(false);
|
1056
|
+
const [errors, setErrors] = (0, import_react4.useState)({});
|
1057
|
+
const [requestDetails, setRequestDetails] = (0, import_react4.useState)({
|
1018
1058
|
email: "",
|
1019
1059
|
amount: "",
|
1020
1060
|
phone_number: "",
|
@@ -1022,7 +1062,7 @@ function RequestPayment(props) {
|
|
1022
1062
|
name: "",
|
1023
1063
|
fractalpayPublicKey: fractalpayClientKey
|
1024
1064
|
});
|
1025
|
-
const [showConfirmationModal, setShowConfirmationModal] = useState(false);
|
1065
|
+
const [showConfirmationModal, setShowConfirmationModal] = (0, import_react4.useState)(false);
|
1026
1066
|
const phoneNumberRegex = (value) => /^\(?\d{3}\)?[-.\s]?\d{3}[-.\s]?\d{4}$/.test(value);
|
1027
1067
|
const amoutRegex = /[+-]?([0-9]*[.])?[0-9]+/;
|
1028
1068
|
const positiveAmountRegex = /^[+]?\d+(\.\d+)?$/;
|
@@ -1075,14 +1115,24 @@ function RequestPayment(props) {
|
|
1075
1115
|
name: requestDetails.name,
|
1076
1116
|
email: requestDetails.email
|
1077
1117
|
};
|
1078
|
-
|
1079
|
-
|
1118
|
+
const response = await fetch(`${baseUrl}create-widget-order`, {
|
1119
|
+
method: "POST",
|
1120
|
+
headers: {
|
1121
|
+
"Content-Type": "application/json"
|
1122
|
+
},
|
1123
|
+
body: JSON.stringify(formData)
|
1124
|
+
});
|
1125
|
+
if (!response.ok) {
|
1126
|
+
throw new Error("Failed to create widget order");
|
1127
|
+
}
|
1128
|
+
const data = await response.json();
|
1129
|
+
if (data) {
|
1080
1130
|
setShowConfirmationModal(true);
|
1081
1131
|
setShow(false);
|
1082
1132
|
emptyFields();
|
1083
|
-
handleSubmit(
|
1133
|
+
handleSubmit(data);
|
1084
1134
|
}
|
1085
|
-
console.log(
|
1135
|
+
console.log(data);
|
1086
1136
|
setLoading(false);
|
1087
1137
|
} catch (error) {
|
1088
1138
|
console.log(error);
|
@@ -1153,7 +1203,7 @@ function RequestPayment(props) {
|
|
1153
1203
|
setErrors(newErrors);
|
1154
1204
|
return Object.keys(newErrors).length === 0;
|
1155
1205
|
};
|
1156
|
-
useEffect(() => {
|
1206
|
+
(0, import_react4.useEffect)(() => {
|
1157
1207
|
if (props.amount) {
|
1158
1208
|
setRequestDetails((prev) => __spreadProps(__spreadValues({}, prev), { amount: props.amount }));
|
1159
1209
|
}
|
@@ -1163,8 +1213,8 @@ function RequestPayment(props) {
|
|
1163
1213
|
e.preventDefault();
|
1164
1214
|
}
|
1165
1215
|
};
|
1166
|
-
return /* @__PURE__ */
|
1167
|
-
Modal,
|
1216
|
+
return /* @__PURE__ */ import_react4.default.createElement(import_react4.default.Fragment, null, /* @__PURE__ */ import_react4.default.createElement(RequestPaymentstyles_default, null), /* @__PURE__ */ import_react4.default.createElement(Loader_default, { loading }), /* @__PURE__ */ import_react4.default.createElement(import_react4.default.Fragment, null, /* @__PURE__ */ import_react4.default.createElement("button", { className: "paymentBtn", onClick: handleShow }, "Request Payment"), /* @__PURE__ */ import_react4.default.createElement(
|
1217
|
+
import_react_bootstrap.Modal,
|
1168
1218
|
{
|
1169
1219
|
show,
|
1170
1220
|
onHide: handleClose,
|
@@ -1172,8 +1222,8 @@ function RequestPayment(props) {
|
|
1172
1222
|
backdrop: "static",
|
1173
1223
|
keyboard: false
|
1174
1224
|
},
|
1175
|
-
/* @__PURE__ */
|
1176
|
-
/* @__PURE__ */
|
1225
|
+
/* @__PURE__ */ import_react4.default.createElement(import_react_bootstrap.Modal.Header, { closeButton: true }, /* @__PURE__ */ import_react4.default.createElement(import_react_bootstrap.Modal.Title, null, "Request Payment")),
|
1226
|
+
/* @__PURE__ */ import_react4.default.createElement(import_react_bootstrap.Modal.Body, { id: "Checkout" }, /* @__PURE__ */ import_react4.default.createElement(import_react_bootstrap.Form, null, /* @__PURE__ */ import_react4.default.createElement("div", { className: "mb-3" }, /* @__PURE__ */ import_react4.default.createElement("label", { htmlFor: "exampleFormControlInput2", className: "form-label" }, "FULL NAME *"), /* @__PURE__ */ import_react4.default.createElement(
|
1177
1227
|
"input",
|
1178
1228
|
{
|
1179
1229
|
className: "form-control",
|
@@ -1182,7 +1232,7 @@ function RequestPayment(props) {
|
|
1182
1232
|
"data-token": "name",
|
1183
1233
|
onChange: handleChange
|
1184
1234
|
}
|
1185
|
-
), errors.name && /* @__PURE__ */
|
1235
|
+
), errors.name && /* @__PURE__ */ import_react4.default.createElement("small", { className: "text-danger" }, errors.name)), /* @__PURE__ */ import_react4.default.createElement("div", { className: "mb-3" }, /* @__PURE__ */ import_react4.default.createElement("label", { htmlFor: "requestPhoneNumber", className: "form-label" }, "Phone Number"), /* @__PURE__ */ import_react4.default.createElement(
|
1186
1236
|
"input",
|
1187
1237
|
{
|
1188
1238
|
maxLength: 10,
|
@@ -1194,7 +1244,7 @@ function RequestPayment(props) {
|
|
1194
1244
|
type: "text",
|
1195
1245
|
"data-token": "phone_number"
|
1196
1246
|
}
|
1197
|
-
), errors.phone_number && /* @__PURE__ */
|
1247
|
+
), errors.phone_number && /* @__PURE__ */ import_react4.default.createElement("small", { className: "text-danger" }, errors.phone_number)), /* @__PURE__ */ import_react4.default.createElement("div", { className: "mb-3" }, /* @__PURE__ */ import_react4.default.createElement("label", { htmlFor: "exampleFormControlInput2", className: "form-label" }, "EMAIL"), /* @__PURE__ */ import_react4.default.createElement(
|
1198
1248
|
"input",
|
1199
1249
|
{
|
1200
1250
|
className: "form-control",
|
@@ -1203,7 +1253,7 @@ function RequestPayment(props) {
|
|
1203
1253
|
onChange: handleChange,
|
1204
1254
|
"data-token": "email"
|
1205
1255
|
}
|
1206
|
-
), errors.email && /* @__PURE__ */
|
1256
|
+
), errors.email && /* @__PURE__ */ import_react4.default.createElement("small", { className: "text-danger" }, errors.email)), /* @__PURE__ */ import_react4.default.createElement("div", { className: "mb-3" }, /* @__PURE__ */ import_react4.default.createElement("label", { htmlFor: "exampleFormControlInput2", className: "form-label" }, "AMOUNT *"), /* @__PURE__ */ import_react4.default.createElement("div", { className: "input-group" }, /* @__PURE__ */ import_react4.default.createElement("span", { className: "input-group-text" }, "$"), /* @__PURE__ */ import_react4.default.createElement(
|
1207
1257
|
"input",
|
1208
1258
|
{
|
1209
1259
|
"data-token": "amount",
|
@@ -1219,7 +1269,7 @@ function RequestPayment(props) {
|
|
1219
1269
|
e2.preventDefault();
|
1220
1270
|
}, { passive: false })
|
1221
1271
|
}
|
1222
|
-
)), errors.amount && /* @__PURE__ */
|
1272
|
+
)), errors.amount && /* @__PURE__ */ import_react4.default.createElement("small", { className: "text-danger" }, errors.amount)), /* @__PURE__ */ import_react4.default.createElement("div", { className: "mb-3" }, /* @__PURE__ */ import_react4.default.createElement("label", { htmlFor: "exampleFormControlInput2", className: "form-label" }, "ORDER ID"), /* @__PURE__ */ import_react4.default.createElement(
|
1223
1273
|
"input",
|
1224
1274
|
{
|
1225
1275
|
className: "form-control",
|
@@ -1228,8 +1278,8 @@ function RequestPayment(props) {
|
|
1228
1278
|
onChange: handleChange,
|
1229
1279
|
"data-token": "order_id"
|
1230
1280
|
}
|
1231
|
-
), errors.order_id && /* @__PURE__ */
|
1232
|
-
Button,
|
1281
|
+
), errors.order_id && /* @__PURE__ */ import_react4.default.createElement("small", { className: "text-danger" }, errors.order_id)), /* @__PURE__ */ import_react4.default.createElement(
|
1282
|
+
import_react_bootstrap.Button,
|
1233
1283
|
{
|
1234
1284
|
type: "button",
|
1235
1285
|
className: "PayButton",
|
@@ -1237,7 +1287,7 @@ function RequestPayment(props) {
|
|
1237
1287
|
disabled: loading
|
1238
1288
|
},
|
1239
1289
|
loading ? "Loading..." : "Send Request"
|
1240
|
-
)), /* @__PURE__ */
|
1290
|
+
)), /* @__PURE__ */ import_react4.default.createElement("div", { className: "powerd-by-part" }, /* @__PURE__ */ import_react4.default.createElement(
|
1241
1291
|
"svg",
|
1242
1292
|
{
|
1243
1293
|
xmlns: "http://www.w3.org/2000/svg",
|
@@ -1245,14 +1295,14 @@ function RequestPayment(props) {
|
|
1245
1295
|
height: "20",
|
1246
1296
|
viewBox: "0 0 26 26"
|
1247
1297
|
},
|
1248
|
-
/* @__PURE__ */
|
1298
|
+
/* @__PURE__ */ import_react4.default.createElement(
|
1249
1299
|
"path",
|
1250
1300
|
{
|
1251
1301
|
fill: "currentColor",
|
1252
1302
|
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"
|
1253
1303
|
}
|
1254
1304
|
)
|
1255
|
-
), "Secure payments powered by Fractal", /* @__PURE__ */
|
1305
|
+
), "Secure payments powered by Fractal", /* @__PURE__ */ import_react4.default.createElement(
|
1256
1306
|
"img",
|
1257
1307
|
{
|
1258
1308
|
src: "https://ui.fractalpay.com/favicon.ico",
|
@@ -1260,15 +1310,15 @@ function RequestPayment(props) {
|
|
1260
1310
|
className: "powered-logo"
|
1261
1311
|
}
|
1262
1312
|
)))
|
1263
|
-
), /* @__PURE__ */
|
1264
|
-
Modal,
|
1313
|
+
), /* @__PURE__ */ import_react4.default.createElement(
|
1314
|
+
import_react_bootstrap.Modal,
|
1265
1315
|
{
|
1266
1316
|
className: "payment-suc",
|
1267
1317
|
show: showConfirmationModal,
|
1268
1318
|
onHide: handleCloseConfirmationModal
|
1269
1319
|
},
|
1270
|
-
/* @__PURE__ */
|
1271
|
-
/* @__PURE__ */
|
1320
|
+
/* @__PURE__ */ import_react4.default.createElement(import_react_bootstrap.Modal.Header, { closeButton: true }),
|
1321
|
+
/* @__PURE__ */ import_react4.default.createElement(import_react_bootstrap.Modal.Body, null, /* @__PURE__ */ import_react4.default.createElement(
|
1272
1322
|
"svg",
|
1273
1323
|
{
|
1274
1324
|
width: "60",
|
@@ -1277,7 +1327,7 @@ function RequestPayment(props) {
|
|
1277
1327
|
fill: "none",
|
1278
1328
|
xmlns: "http://www.w3.org/2000/svg"
|
1279
1329
|
},
|
1280
|
-
/* @__PURE__ */
|
1330
|
+
/* @__PURE__ */ import_react4.default.createElement(
|
1281
1331
|
"rect",
|
1282
1332
|
{
|
1283
1333
|
x: "0.5",
|
@@ -1288,14 +1338,14 @@ function RequestPayment(props) {
|
|
1288
1338
|
stroke: "#31B379"
|
1289
1339
|
}
|
1290
1340
|
),
|
1291
|
-
/* @__PURE__ */
|
1341
|
+
/* @__PURE__ */ import_react4.default.createElement("g", { clipPath: "url(#clip0_2659_5018)" }, /* @__PURE__ */ import_react4.default.createElement(
|
1292
1342
|
"path",
|
1293
1343
|
{
|
1294
1344
|
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",
|
1295
1345
|
fill: "#31B379"
|
1296
1346
|
}
|
1297
1347
|
)),
|
1298
|
-
/* @__PURE__ */
|
1348
|
+
/* @__PURE__ */ import_react4.default.createElement("defs", null, /* @__PURE__ */ import_react4.default.createElement("clipPath", { id: "clip0_2659_5018" }, /* @__PURE__ */ import_react4.default.createElement(
|
1299
1349
|
"rect",
|
1300
1350
|
{
|
1301
1351
|
width: "22",
|
@@ -1304,28 +1354,28 @@ function RequestPayment(props) {
|
|
1304
1354
|
transform: "translate(19.5 19.0039)"
|
1305
1355
|
}
|
1306
1356
|
)))
|
1307
|
-
), /* @__PURE__ */
|
1357
|
+
), /* @__PURE__ */ import_react4.default.createElement("h2", null, "Payment link has been ", /* @__PURE__ */ import_react4.default.createElement("br", null), " sent successfully"))
|
1308
1358
|
)));
|
1309
1359
|
}
|
1310
1360
|
|
1311
1361
|
// src/app/components/RequestPayment/RequestPaymentAllInput.tsx
|
1312
|
-
|
1313
|
-
|
1314
|
-
|
1315
|
-
|
1362
|
+
var import_react5 = __toESM(require("react"));
|
1363
|
+
var import_react_bootstrap2 = require("react-bootstrap");
|
1364
|
+
var import_react_toastify = require("react-toastify");
|
1365
|
+
var import_ReactToastify = require("react-toastify/dist/ReactToastify.css");
|
1316
1366
|
function RequestPaymentAllInput({ fractalpayClientKey }) {
|
1317
|
-
const [isLoading, setIsLoading] =
|
1318
|
-
const [show, setShow] =
|
1319
|
-
const [phoneNumber, setPhoneNumber] =
|
1320
|
-
const [amount, setAmount] =
|
1321
|
-
const [orderId, setOrderId] =
|
1322
|
-
const [isValidNumber, setIsValidNumber] =
|
1323
|
-
const [isValidAmount, setIsValidAmount] =
|
1324
|
-
const [isValidOrderId, setIsValidOrderId] =
|
1325
|
-
const [errorMessagephone, setErrorMessagephone] =
|
1326
|
-
const [errorMessageamount, setErrorMessageamount] =
|
1327
|
-
const [errorMessageorderid, setErrorMessageorderid] =
|
1328
|
-
const [submitClicked, setSubmitClicked] =
|
1367
|
+
const [isLoading, setIsLoading] = (0, import_react5.useState)(false);
|
1368
|
+
const [show, setShow] = (0, import_react5.useState)(false);
|
1369
|
+
const [phoneNumber, setPhoneNumber] = (0, import_react5.useState)("");
|
1370
|
+
const [amount, setAmount] = (0, import_react5.useState)("");
|
1371
|
+
const [orderId, setOrderId] = (0, import_react5.useState)("");
|
1372
|
+
const [isValidNumber, setIsValidNumber] = (0, import_react5.useState)(true);
|
1373
|
+
const [isValidAmount, setIsValidAmount] = (0, import_react5.useState)(true);
|
1374
|
+
const [isValidOrderId, setIsValidOrderId] = (0, import_react5.useState)(true);
|
1375
|
+
const [errorMessagephone, setErrorMessagephone] = (0, import_react5.useState)("");
|
1376
|
+
const [errorMessageamount, setErrorMessageamount] = (0, import_react5.useState)("");
|
1377
|
+
const [errorMessageorderid, setErrorMessageorderid] = (0, import_react5.useState)("");
|
1378
|
+
const [submitClicked, setSubmitClicked] = (0, import_react5.useState)(false);
|
1329
1379
|
const handleClose = () => setShow(false);
|
1330
1380
|
const handleShow = () => setShow(true);
|
1331
1381
|
const sendRequestPayment = () => {
|
@@ -1387,7 +1437,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1387
1437
|
}).catch((error) => {
|
1388
1438
|
setIsLoading(false);
|
1389
1439
|
console.error("Error:", error);
|
1390
|
-
toast.error(ErrorText.anerroroccured);
|
1440
|
+
import_react_toastify.toast.error(ErrorText.anerroroccured);
|
1391
1441
|
});
|
1392
1442
|
};
|
1393
1443
|
const handlePhoneNumberChange = (e) => {
|
@@ -1427,7 +1477,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1427
1477
|
setIsValidOrderId(false);
|
1428
1478
|
}
|
1429
1479
|
};
|
1430
|
-
return /* @__PURE__ */
|
1480
|
+
return /* @__PURE__ */ import_react5.default.createElement(import_react5.default.Fragment, null, /* @__PURE__ */ import_react5.default.createElement(RequestPaymentstyles_default, null), /* @__PURE__ */ import_react5.default.createElement("div", { className: " border-container" }, /* @__PURE__ */ import_react5.default.createElement("div", { className: "payment-column" }, /* @__PURE__ */ import_react5.default.createElement("label", null, "Enter Phone Number:"), /* @__PURE__ */ import_react5.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react5.default.createElement(
|
1431
1481
|
"input",
|
1432
1482
|
{
|
1433
1483
|
type: "text",
|
@@ -1437,7 +1487,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1437
1487
|
maxLength: 10,
|
1438
1488
|
className: submitClicked && (!phoneNumber || !isValidNumber) ? "error" : ""
|
1439
1489
|
}
|
1440
|
-
), errorMessagephone && /* @__PURE__ */
|
1490
|
+
), errorMessagephone && /* @__PURE__ */ import_react5.default.createElement("div", { className: "error-message text-danger" }, errorMessagephone))), /* @__PURE__ */ import_react5.default.createElement("div", { className: "payment-column" }, /* @__PURE__ */ import_react5.default.createElement("label", null, "Enter Amount:"), /* @__PURE__ */ import_react5.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react5.default.createElement(
|
1441
1491
|
"input",
|
1442
1492
|
{
|
1443
1493
|
type: "text",
|
@@ -1446,7 +1496,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1446
1496
|
placeholder: "Enter amount",
|
1447
1497
|
className: submitClicked && (!amount || !isValidAmount) ? "error" : ""
|
1448
1498
|
}
|
1449
|
-
), errorMessageamount && /* @__PURE__ */
|
1499
|
+
), errorMessageamount && /* @__PURE__ */ import_react5.default.createElement("div", { className: "error-message text-danger" }, errorMessageamount))), /* @__PURE__ */ import_react5.default.createElement("div", { className: "payment-column" }, /* @__PURE__ */ import_react5.default.createElement("label", null, "Enter Order ID:"), /* @__PURE__ */ import_react5.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react5.default.createElement(
|
1450
1500
|
"input",
|
1451
1501
|
{
|
1452
1502
|
type: "text",
|
@@ -1455,7 +1505,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1455
1505
|
placeholder: "Enter order ID",
|
1456
1506
|
className: submitClicked && (!orderId || !isValidOrderId) ? "error" : ""
|
1457
1507
|
}
|
1458
|
-
), errorMessageorderid && /* @__PURE__ */
|
1508
|
+
), errorMessageorderid && /* @__PURE__ */ import_react5.default.createElement("div", { className: "error-message text-danger" }, errorMessageorderid))), /* @__PURE__ */ import_react5.default.createElement(
|
1459
1509
|
"button",
|
1460
1510
|
{
|
1461
1511
|
onClick: sendRequestPayment,
|
@@ -1463,7 +1513,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1463
1513
|
className: "paymentBtn"
|
1464
1514
|
},
|
1465
1515
|
isLoading ? "Loading..." : "Request Payment"
|
1466
|
-
)), /* @__PURE__ */
|
1516
|
+
)), /* @__PURE__ */ import_react5.default.createElement(import_react_bootstrap2.Modal, { className: "payment-suc", show, onHide: handleClose }, /* @__PURE__ */ import_react5.default.createElement(import_react_bootstrap2.Modal.Header, { closeButton: true }), /* @__PURE__ */ import_react5.default.createElement(import_react_bootstrap2.Modal.Body, null, /* @__PURE__ */ import_react5.default.createElement(
|
1467
1517
|
"svg",
|
1468
1518
|
{
|
1469
1519
|
width: "60",
|
@@ -1472,7 +1522,7 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1472
1522
|
fill: "none",
|
1473
1523
|
xmlns: "http://www.w3.org/2000/svg"
|
1474
1524
|
},
|
1475
|
-
/* @__PURE__ */
|
1525
|
+
/* @__PURE__ */ import_react5.default.createElement(
|
1476
1526
|
"rect",
|
1477
1527
|
{
|
1478
1528
|
x: "0.5",
|
@@ -1483,14 +1533,14 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1483
1533
|
stroke: "#31B379"
|
1484
1534
|
}
|
1485
1535
|
),
|
1486
|
-
/* @__PURE__ */
|
1536
|
+
/* @__PURE__ */ import_react5.default.createElement("g", { clipPath: "url(#clip0_2659_5018)" }, /* @__PURE__ */ import_react5.default.createElement(
|
1487
1537
|
"path",
|
1488
1538
|
{
|
1489
1539
|
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",
|
1490
1540
|
fill: "#31B379"
|
1491
1541
|
}
|
1492
1542
|
)),
|
1493
|
-
/* @__PURE__ */
|
1543
|
+
/* @__PURE__ */ import_react5.default.createElement("defs", null, /* @__PURE__ */ import_react5.default.createElement("clipPath", { id: "clip0_2659_5018" }, /* @__PURE__ */ import_react5.default.createElement(
|
1494
1544
|
"rect",
|
1495
1545
|
{
|
1496
1546
|
width: "22",
|
@@ -1499,12 +1549,12 @@ function RequestPaymentAllInput({ fractalpayClientKey }) {
|
|
1499
1549
|
transform: "translate(19.5 19.0039)"
|
1500
1550
|
}
|
1501
1551
|
)))
|
1502
|
-
), /* @__PURE__ */
|
1552
|
+
), /* @__PURE__ */ import_react5.default.createElement("h1", null, "Success!"), /* @__PURE__ */ import_react5.default.createElement("h4", null, "Payment link created successfully.")), /* @__PURE__ */ import_react5.default.createElement(import_react_bootstrap2.Modal.Footer, null, /* @__PURE__ */ import_react5.default.createElement("button", { className: "paymentBtn", onClick: handleClose }, "Ok"))), /* @__PURE__ */ import_react5.default.createElement(import_react_toastify.ToastContainer, null));
|
1503
1553
|
}
|
1504
1554
|
|
1505
1555
|
// src/app/components/RequestPayment/RequestPaymentDynamic.tsx
|
1506
|
-
|
1507
|
-
|
1556
|
+
var import_react6 = __toESM(require("react"));
|
1557
|
+
var import_react_bootstrap3 = require("react-bootstrap");
|
1508
1558
|
|
1509
1559
|
// src/app/components/Api/createWidgetOrder.ts
|
1510
1560
|
var createWidgetOrder = (formData) => {
|
@@ -1527,8 +1577,8 @@ var createWidgetOrder = (formData) => {
|
|
1527
1577
|
|
1528
1578
|
// src/app/components/RequestPayment/RequestPaymentDynamic.tsx
|
1529
1579
|
function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orderID }) {
|
1530
|
-
const [isLoading, setIsLoading] =
|
1531
|
-
const [show, setShow] =
|
1580
|
+
const [isLoading, setIsLoading] = (0, import_react6.useState)(false);
|
1581
|
+
const [show, setShow] = (0, import_react6.useState)(false);
|
1532
1582
|
const handleClose = () => setShow(false);
|
1533
1583
|
const handleShow = () => setShow(true);
|
1534
1584
|
const sendRequestPayment = () => {
|
@@ -1551,7 +1601,7 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
|
|
1551
1601
|
console.error("Error:", error);
|
1552
1602
|
});
|
1553
1603
|
};
|
1554
|
-
return /* @__PURE__ */
|
1604
|
+
return /* @__PURE__ */ import_react6.default.createElement(import_react6.default.Fragment, null, /* @__PURE__ */ import_react6.default.createElement(
|
1555
1605
|
"button",
|
1556
1606
|
{
|
1557
1607
|
onClick: sendRequestPayment,
|
@@ -1559,7 +1609,7 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
|
|
1559
1609
|
className: "paymentBtn"
|
1560
1610
|
},
|
1561
1611
|
isLoading ? "Loading..." : "Request Payment"
|
1562
|
-
), /* @__PURE__ */
|
1612
|
+
), /* @__PURE__ */ import_react6.default.createElement(import_react_bootstrap3.Modal, { className: "payment-suc", show, onHide: handleClose }, /* @__PURE__ */ import_react6.default.createElement(import_react_bootstrap3.Modal.Header, { closeButton: true }), /* @__PURE__ */ import_react6.default.createElement(import_react_bootstrap3.Modal.Body, null, /* @__PURE__ */ import_react6.default.createElement(
|
1563
1613
|
"svg",
|
1564
1614
|
{
|
1565
1615
|
width: "60",
|
@@ -1568,7 +1618,7 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
|
|
1568
1618
|
fill: "none",
|
1569
1619
|
xmlns: "http://www.w3.org/2000/svg"
|
1570
1620
|
},
|
1571
|
-
/* @__PURE__ */
|
1621
|
+
/* @__PURE__ */ import_react6.default.createElement(
|
1572
1622
|
"rect",
|
1573
1623
|
{
|
1574
1624
|
x: "0.5",
|
@@ -1579,14 +1629,14 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
|
|
1579
1629
|
stroke: "#31B379"
|
1580
1630
|
}
|
1581
1631
|
),
|
1582
|
-
/* @__PURE__ */
|
1632
|
+
/* @__PURE__ */ import_react6.default.createElement("g", { "clip-path": "url(#clip0_2659_5018)" }, /* @__PURE__ */ import_react6.default.createElement(
|
1583
1633
|
"path",
|
1584
1634
|
{
|
1585
1635
|
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",
|
1586
1636
|
fill: "#31B379"
|
1587
1637
|
}
|
1588
1638
|
)),
|
1589
|
-
/* @__PURE__ */
|
1639
|
+
/* @__PURE__ */ import_react6.default.createElement("defs", null, /* @__PURE__ */ import_react6.default.createElement("clipPath", { id: "clip0_2659_5018" }, /* @__PURE__ */ import_react6.default.createElement(
|
1590
1640
|
"rect",
|
1591
1641
|
{
|
1592
1642
|
width: "22",
|
@@ -1595,15 +1645,15 @@ function RequestPaymentDynamic({ fractalpayClientKey, amount, phone_number, orde
|
|
1595
1645
|
transform: "translate(19.5 19.0039)"
|
1596
1646
|
}
|
1597
1647
|
)))
|
1598
|
-
), /* @__PURE__ */
|
1648
|
+
), /* @__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_bootstrap3.Modal.Footer, null, /* @__PURE__ */ import_react6.default.createElement("button", { className: "paymentBtn", onClick: handleClose }, "Ok"))));
|
1599
1649
|
}
|
1600
1650
|
|
1601
1651
|
// src/app/components/RequestPayment/RequestPaymentonClick.tsx
|
1602
|
-
|
1603
|
-
|
1652
|
+
var import_react7 = __toESM(require("react"));
|
1653
|
+
var import_react_bootstrap4 = require("react-bootstrap");
|
1604
1654
|
function RequestPaymentonClick(props) {
|
1605
|
-
const [isLoading, setIsLoading] =
|
1606
|
-
const [show, setShow] =
|
1655
|
+
const [isLoading, setIsLoading] = (0, import_react7.useState)(false);
|
1656
|
+
const [show, setShow] = (0, import_react7.useState)(false);
|
1607
1657
|
const handleClose = () => setShow(false);
|
1608
1658
|
const handleShow = () => setShow(true);
|
1609
1659
|
const { fractalpayClientKey, amount, phone_number, orderID, onSuccess, onError } = props;
|
@@ -1637,7 +1687,7 @@ function RequestPaymentonClick(props) {
|
|
1637
1687
|
console.error("Error:", error);
|
1638
1688
|
});
|
1639
1689
|
};
|
1640
|
-
return /* @__PURE__ */
|
1690
|
+
return /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, null, /* @__PURE__ */ import_react7.default.createElement(RequestPaymentstyles_default, null), /* @__PURE__ */ import_react7.default.createElement(
|
1641
1691
|
"button",
|
1642
1692
|
{
|
1643
1693
|
onClick: sendRequestPayment,
|
@@ -1645,7 +1695,7 @@ function RequestPaymentonClick(props) {
|
|
1645
1695
|
className: "paymentBtn"
|
1646
1696
|
},
|
1647
1697
|
isLoading ? "Loading..." : "Request Payment"
|
1648
|
-
), /* @__PURE__ */
|
1698
|
+
), /* @__PURE__ */ import_react7.default.createElement(import_react_bootstrap4.Modal, { className: "payment-suc", show, onHide: handleClose }, /* @__PURE__ */ import_react7.default.createElement(import_react_bootstrap4.Modal.Header, { closeButton: true }), /* @__PURE__ */ import_react7.default.createElement(import_react_bootstrap4.Modal.Body, null, onSuccess && /* @__PURE__ */ import_react7.default.createElement(
|
1649
1699
|
"svg",
|
1650
1700
|
{
|
1651
1701
|
width: "60",
|
@@ -1654,7 +1704,7 @@ function RequestPaymentonClick(props) {
|
|
1654
1704
|
fill: "none",
|
1655
1705
|
xmlns: "http://www.w3.org/2000/svg"
|
1656
1706
|
},
|
1657
|
-
/* @__PURE__ */
|
1707
|
+
/* @__PURE__ */ import_react7.default.createElement(
|
1658
1708
|
"rect",
|
1659
1709
|
{
|
1660
1710
|
x: "0.5",
|
@@ -1665,14 +1715,14 @@ function RequestPaymentonClick(props) {
|
|
1665
1715
|
stroke: "#31B379"
|
1666
1716
|
}
|
1667
1717
|
),
|
1668
|
-
/* @__PURE__ */
|
1718
|
+
/* @__PURE__ */ import_react7.default.createElement("g", { clipPath: "url(#clip0_2659_5018)" }, /* @__PURE__ */ import_react7.default.createElement(
|
1669
1719
|
"path",
|
1670
1720
|
{
|
1671
1721
|
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",
|
1672
1722
|
fill: "#31B379"
|
1673
1723
|
}
|
1674
1724
|
)),
|
1675
|
-
/* @__PURE__ */
|
1725
|
+
/* @__PURE__ */ import_react7.default.createElement("defs", null, /* @__PURE__ */ import_react7.default.createElement("clipPath", { id: "clip0_2659_5018" }, /* @__PURE__ */ import_react7.default.createElement(
|
1676
1726
|
"rect",
|
1677
1727
|
{
|
1678
1728
|
width: "22",
|
@@ -1681,21 +1731,21 @@ function RequestPaymentonClick(props) {
|
|
1681
1731
|
transform: "translate(19.5 19.0039)"
|
1682
1732
|
}
|
1683
1733
|
)))
|
1684
|
-
), onSuccess ? /* @__PURE__ */
|
1734
|
+
), onSuccess ? /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, null, /* @__PURE__ */ import_react7.default.createElement("h1", null, "Success!"), /* @__PURE__ */ import_react7.default.createElement("h4", null, onSuccess)) : /* @__PURE__ */ import_react7.default.createElement(import_react7.default.Fragment, null, /* @__PURE__ */ import_react7.default.createElement("h1", null, "Error!"), /* @__PURE__ */ import_react7.default.createElement("h4", null, onError))), /* @__PURE__ */ import_react7.default.createElement(import_react_bootstrap4.Modal.Footer, null, /* @__PURE__ */ import_react7.default.createElement("button", { className: "paymentBtn", onClick: handleClose }, "Ok"))));
|
1685
1735
|
}
|
1686
1736
|
|
1687
1737
|
// src/app/components/RequestPayment/RqstPaymntInputField.tsx
|
1688
|
-
|
1689
|
-
|
1690
|
-
|
1691
|
-
|
1738
|
+
var import_react8 = __toESM(require("react"));
|
1739
|
+
var import_react_bootstrap5 = require("react-bootstrap");
|
1740
|
+
var import_react_toastify2 = require("react-toastify");
|
1741
|
+
var import_ReactToastify2 = require("react-toastify/dist/ReactToastify.css");
|
1692
1742
|
function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
1693
|
-
const [isLoading, setIsLoading] =
|
1694
|
-
const [show, setShow] =
|
1695
|
-
const [phoneNumber, setPhoneNumber] =
|
1696
|
-
const [isValidNumber, setIsValidNumber] =
|
1697
|
-
const [errorMessage, setErrorMessage] =
|
1698
|
-
const [submitClicked, setSubmitClicked] =
|
1743
|
+
const [isLoading, setIsLoading] = (0, import_react8.useState)(false);
|
1744
|
+
const [show, setShow] = (0, import_react8.useState)(false);
|
1745
|
+
const [phoneNumber, setPhoneNumber] = (0, import_react8.useState)("");
|
1746
|
+
const [isValidNumber, setIsValidNumber] = (0, import_react8.useState)(true);
|
1747
|
+
const [errorMessage, setErrorMessage] = (0, import_react8.useState)("");
|
1748
|
+
const [submitClicked, setSubmitClicked] = (0, import_react8.useState)(false);
|
1699
1749
|
const handleClose = () => setShow(false);
|
1700
1750
|
const handleShow = () => setShow(true);
|
1701
1751
|
const sendRequestPayment = () => {
|
@@ -1740,7 +1790,7 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
1740
1790
|
}).catch((error) => {
|
1741
1791
|
setIsLoading(false);
|
1742
1792
|
console.error("Error:", error);
|
1743
|
-
|
1793
|
+
import_react_toastify2.toast.error(ErrorText.anerroroccured);
|
1744
1794
|
});
|
1745
1795
|
};
|
1746
1796
|
const handlePhoneNumberChange = (e) => {
|
@@ -1758,7 +1808,7 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
1758
1808
|
setErrorMessage(ErrorText.phonenumbervalid);
|
1759
1809
|
}
|
1760
1810
|
};
|
1761
|
-
return /* @__PURE__ */
|
1811
|
+
return /* @__PURE__ */ import_react8.default.createElement(import_react8.default.Fragment, null, /* @__PURE__ */ import_react8.default.createElement("div", { className: "payment-container" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "input-wrapper" }, /* @__PURE__ */ import_react8.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react8.default.createElement(
|
1762
1812
|
"input",
|
1763
1813
|
{
|
1764
1814
|
type: "text",
|
@@ -1768,7 +1818,7 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
1768
1818
|
maxLength: 10,
|
1769
1819
|
className: submitClicked && (!phoneNumber || !isValidNumber) ? "error" : ""
|
1770
1820
|
}
|
1771
|
-
), errorMessage && /* @__PURE__ */
|
1821
|
+
), errorMessage && /* @__PURE__ */ import_react8.default.createElement("div", { className: "error-message text-danger" }, errorMessage))), /* @__PURE__ */ import_react8.default.createElement("div", { className: "button-wrapper" }, /* @__PURE__ */ import_react8.default.createElement(
|
1772
1822
|
"button",
|
1773
1823
|
{
|
1774
1824
|
onClick: sendRequestPayment,
|
@@ -1776,7 +1826,7 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
1776
1826
|
className: "paymentBtn"
|
1777
1827
|
},
|
1778
1828
|
isLoading ? "Loading..." : "Request Payment"
|
1779
|
-
))), /* @__PURE__ */
|
1829
|
+
))), /* @__PURE__ */ import_react8.default.createElement(import_react_bootstrap5.Modal, { className: "payment-suc", show, onHide: handleClose }, /* @__PURE__ */ import_react8.default.createElement(import_react_bootstrap5.Modal.Header, { closeButton: true }), /* @__PURE__ */ import_react8.default.createElement(import_react_bootstrap5.Modal.Body, null, /* @__PURE__ */ import_react8.default.createElement(
|
1780
1830
|
"svg",
|
1781
1831
|
{
|
1782
1832
|
width: "60",
|
@@ -1785,7 +1835,7 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
1785
1835
|
fill: "none",
|
1786
1836
|
xmlns: "http://www.w3.org/2000/svg"
|
1787
1837
|
},
|
1788
|
-
/* @__PURE__ */
|
1838
|
+
/* @__PURE__ */ import_react8.default.createElement(
|
1789
1839
|
"rect",
|
1790
1840
|
{
|
1791
1841
|
x: "0.5",
|
@@ -1796,14 +1846,14 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
1796
1846
|
stroke: "#31B379"
|
1797
1847
|
}
|
1798
1848
|
),
|
1799
|
-
/* @__PURE__ */
|
1849
|
+
/* @__PURE__ */ import_react8.default.createElement("g", { clipPath: "url(#clip0_2659_5018)" }, /* @__PURE__ */ import_react8.default.createElement(
|
1800
1850
|
"path",
|
1801
1851
|
{
|
1802
1852
|
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",
|
1803
1853
|
fill: "#31B379"
|
1804
1854
|
}
|
1805
1855
|
)),
|
1806
|
-
/* @__PURE__ */
|
1856
|
+
/* @__PURE__ */ import_react8.default.createElement("defs", null, /* @__PURE__ */ import_react8.default.createElement("clipPath", { id: "clip0_2659_5018" }, /* @__PURE__ */ import_react8.default.createElement(
|
1807
1857
|
"rect",
|
1808
1858
|
{
|
1809
1859
|
width: "22",
|
@@ -1812,20 +1862,19 @@ function RqstPaymntInputField({ fractalpayClientKey, amount, orderID }) {
|
|
1812
1862
|
transform: "translate(19.5 19.0039)"
|
1813
1863
|
}
|
1814
1864
|
)))
|
1815
|
-
), /* @__PURE__ */
|
1865
|
+
), /* @__PURE__ */ import_react8.default.createElement("h1", null, "Success!"), /* @__PURE__ */ import_react8.default.createElement("h4", null, "Payment link created successfully.")), /* @__PURE__ */ import_react8.default.createElement(import_react_bootstrap5.Modal.Footer, null, /* @__PURE__ */ import_react8.default.createElement("button", { className: "paymentBtn", onClick: handleClose }, "Ok"))), /* @__PURE__ */ import_react8.default.createElement(import_react_toastify2.ToastContainer, null));
|
1816
1866
|
}
|
1817
1867
|
|
1818
1868
|
// src/app/components/Payment/Payment.tsx
|
1819
|
-
|
1820
|
-
|
1821
|
-
|
1822
|
-
|
1823
|
-
import { Modal as Modal6 } from "react-bootstrap";
|
1869
|
+
var import_react10 = __toESM(require("react"));
|
1870
|
+
var import_node_forge = __toESM(require("node-forge"));
|
1871
|
+
var import_react_toastify3 = require("react-toastify");
|
1872
|
+
var import_react_bootstrap6 = require("react-bootstrap");
|
1824
1873
|
|
1825
1874
|
// src/app/components/Payment/Paymentstyles.tsx
|
1826
|
-
|
1875
|
+
var import_react9 = __toESM(require("react"));
|
1827
1876
|
function Paymentstyles() {
|
1828
|
-
return /* @__PURE__ */
|
1877
|
+
return /* @__PURE__ */ import_react9.default.createElement("style", null, `
|
1829
1878
|
.paymentBtn {
|
1830
1879
|
background-color: black;
|
1831
1880
|
border: none;
|
@@ -2751,7 +2800,7 @@ input {
|
|
2751
2800
|
// src/app/components/Payment/Payment.tsx
|
2752
2801
|
function Payment() {
|
2753
2802
|
var _a;
|
2754
|
-
const [state, setState] =
|
2803
|
+
const [state, setState] = (0, import_react10.useState)({
|
2755
2804
|
show: false,
|
2756
2805
|
publicKey: "",
|
2757
2806
|
sessionKey: "",
|
@@ -2762,14 +2811,23 @@ function Payment() {
|
|
2762
2811
|
zip: "",
|
2763
2812
|
amount: ""
|
2764
2813
|
});
|
2765
|
-
const [isValid, setIsValid] =
|
2766
|
-
const [isValidMonth, setIsValidMonth] =
|
2767
|
-
const [data, setData] =
|
2814
|
+
const [isValid, setIsValid] = (0, import_react10.useState)(false);
|
2815
|
+
const [isValidMonth, setIsValidMonth] = (0, import_react10.useState)(false);
|
2816
|
+
const [data, setData] = (0, import_react10.useState)(null);
|
2768
2817
|
const handlePaymentClick = async () => {
|
2769
2818
|
try {
|
2770
|
-
const response = await
|
2771
|
-
|
2772
|
-
|
2819
|
+
const response = await fetch(`${baseUrl}generate-session`, {
|
2820
|
+
method: "POST",
|
2821
|
+
headers: {
|
2822
|
+
"Content-Type": "application/json"
|
2823
|
+
},
|
2824
|
+
body: JSON.stringify({})
|
2825
|
+
});
|
2826
|
+
if (!response.ok) {
|
2827
|
+
throw new Error("Network response was not ok");
|
2828
|
+
}
|
2829
|
+
const data2 = await response.json();
|
2830
|
+
if (data2 && data2.result === true) {
|
2773
2831
|
setState((prev) => {
|
2774
2832
|
var _a2, _b;
|
2775
2833
|
return __spreadProps(__spreadValues({}, prev), {
|
@@ -2785,12 +2843,12 @@ function Payment() {
|
|
2785
2843
|
};
|
2786
2844
|
const handleSubmitPay = async () => {
|
2787
2845
|
const track2_data = `${state.cardNumber.replace(/\s+/g, "")}=${state.year}${state.month.length > 1 ? state.month : "0" + state.month} ${state.cvv}`;
|
2788
|
-
const publicKey =
|
2846
|
+
const publicKey = import_node_forge.default.pki.publicKeyFromPem(state.publicKey);
|
2789
2847
|
const encrypted = publicKey.encrypt(track2_data, "RSA-OAEP", {
|
2790
|
-
md:
|
2791
|
-
mgf1: { md:
|
2848
|
+
md: import_node_forge.default.md.sha1.create(),
|
2849
|
+
mgf1: { md: import_node_forge.default.md.sha1.create() }
|
2792
2850
|
});
|
2793
|
-
const encryptedBase64 =
|
2851
|
+
const encryptedBase64 = import_node_forge.default.util.encode64(encrypted);
|
2794
2852
|
console.log(encryptedBase64);
|
2795
2853
|
const requestBody = {
|
2796
2854
|
enc_track2_data: encryptedBase64,
|
@@ -2799,14 +2857,16 @@ function Payment() {
|
|
2799
2857
|
};
|
2800
2858
|
const apiUrl = "https://m1ao5pku8b.execute-api.us-east-2.amazonaws.com/prod/tokenizer/tokenize";
|
2801
2859
|
try {
|
2802
|
-
const response = await
|
2860
|
+
const response = await fetch(apiUrl, {
|
2861
|
+
method: "POST",
|
2803
2862
|
headers: {
|
2804
2863
|
"x-app-session-key": state == null ? void 0 : state.sessionKey,
|
2805
2864
|
"Content-Type": "application/json"
|
2806
|
-
}
|
2865
|
+
},
|
2866
|
+
body: JSON.stringify(requestBody)
|
2807
2867
|
});
|
2808
|
-
if (
|
2809
|
-
|
2868
|
+
if (response.ok) {
|
2869
|
+
import_react_toastify3.toast.success("Payment Successful");
|
2810
2870
|
setState((prev) => __spreadProps(__spreadValues({}, prev), {
|
2811
2871
|
show: false,
|
2812
2872
|
publicKey: "",
|
@@ -2819,7 +2879,8 @@ function Payment() {
|
|
2819
2879
|
amount: ""
|
2820
2880
|
}));
|
2821
2881
|
}
|
2822
|
-
|
2882
|
+
const responseData = await response.json();
|
2883
|
+
console.log("response", responseData);
|
2823
2884
|
} catch (error) {
|
2824
2885
|
console.error("Error:", error);
|
2825
2886
|
}
|
@@ -2916,7 +2977,7 @@ function Payment() {
|
|
2916
2977
|
}
|
2917
2978
|
return "";
|
2918
2979
|
}
|
2919
|
-
return /* @__PURE__ */
|
2980
|
+
return /* @__PURE__ */ import_react10.default.createElement(import_react10.default.Fragment, null, /* @__PURE__ */ import_react10.default.createElement(Paymentstyles, null), /* @__PURE__ */ import_react10.default.createElement("div", { className: "" }, /* @__PURE__ */ import_react10.default.createElement(
|
2920
2981
|
"button",
|
2921
2982
|
{
|
2922
2983
|
className: "export-btn",
|
@@ -2924,8 +2985,8 @@ function Payment() {
|
|
2924
2985
|
onClick: () => handlePaymentClick()
|
2925
2986
|
},
|
2926
2987
|
"Payment"
|
2927
|
-
), /* @__PURE__ */
|
2928
|
-
|
2988
|
+
), /* @__PURE__ */ import_react10.default.createElement(
|
2989
|
+
import_react_bootstrap6.Modal,
|
2929
2990
|
{
|
2930
2991
|
show: state.show,
|
2931
2992
|
onHide: () => setState((prev) => __spreadProps(__spreadValues({}, prev), {
|
@@ -2933,8 +2994,8 @@ function Payment() {
|
|
2933
2994
|
})),
|
2934
2995
|
centered: true
|
2935
2996
|
},
|
2936
|
-
/* @__PURE__ */
|
2937
|
-
/* @__PURE__ */
|
2997
|
+
/* @__PURE__ */ import_react10.default.createElement(import_react_bootstrap6.Modal.Header, { closeButton: true }),
|
2998
|
+
/* @__PURE__ */ import_react10.default.createElement(import_react_bootstrap6.Modal.Body, null, /* @__PURE__ */ import_react10.default.createElement("div", { className: "payment-popup" }, /* @__PURE__ */ import_react10.default.createElement("div", { className: "row" }, /* @__PURE__ */ import_react10.default.createElement("div", { className: "" }, /* @__PURE__ */ import_react10.default.createElement("div", { id: "Checkout", className: "inline" }, /* @__PURE__ */ import_react10.default.createElement("div", { className: "header" }, /* @__PURE__ */ import_react10.default.createElement("h1", null, "Pay")), /* @__PURE__ */ import_react10.default.createElement("form", { id: "PaymentForm", className: "payment-form" }, /* @__PURE__ */ import_react10.default.createElement("div", { className: "form-group", style: { display: "none" } }, /* @__PURE__ */ import_react10.default.createElement("label", null, "Payment amount"), /* @__PURE__ */ import_react10.default.createElement("div", { className: "input-group" }, /* @__PURE__ */ import_react10.default.createElement("span", { className: "input-group-addon" }, "$"), /* @__PURE__ */ import_react10.default.createElement(
|
2938
2999
|
"input",
|
2939
3000
|
{
|
2940
3001
|
type: "text",
|
@@ -2943,13 +3004,13 @@ function Payment() {
|
|
2943
3004
|
className: "form-control",
|
2944
3005
|
id: ""
|
2945
3006
|
}
|
2946
|
-
)), /* @__PURE__ */
|
3007
|
+
)), /* @__PURE__ */ import_react10.default.createElement(
|
2947
3008
|
"span",
|
2948
3009
|
{
|
2949
3010
|
id: "amount-error",
|
2950
3011
|
style: { color: "red", display: "none" }
|
2951
3012
|
}
|
2952
|
-
)), /* @__PURE__ */
|
3013
|
+
)), /* @__PURE__ */ import_react10.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react10.default.createElement("label", null, "Name on card"), /* @__PURE__ */ import_react10.default.createElement(
|
2953
3014
|
"input",
|
2954
3015
|
{
|
2955
3016
|
id: "NameOnCard",
|
@@ -2958,13 +3019,13 @@ function Payment() {
|
|
2958
3019
|
maxLength: 100,
|
2959
3020
|
placeholder: "Name"
|
2960
3021
|
}
|
2961
|
-
), /* @__PURE__ */
|
3022
|
+
), /* @__PURE__ */ import_react10.default.createElement(
|
2962
3023
|
"span",
|
2963
3024
|
{
|
2964
3025
|
id: "NameOnCard-error",
|
2965
3026
|
style: { color: "red", display: "none" }
|
2966
3027
|
}
|
2967
|
-
)), /* @__PURE__ */
|
3028
|
+
)), /* @__PURE__ */ import_react10.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react10.default.createElement(
|
2968
3029
|
"input",
|
2969
3030
|
{
|
2970
3031
|
"data-token": "card_number",
|
@@ -2975,7 +3036,7 @@ function Payment() {
|
|
2975
3036
|
placeholder: "0000 0000 0000 0000",
|
2976
3037
|
onChange: handleCardNumberChange
|
2977
3038
|
}
|
2978
|
-
), state.error && /* @__PURE__ */
|
3039
|
+
), state.error && /* @__PURE__ */ import_react10.default.createElement("div", { style: { color: "red" } }, state.error)), /* @__PURE__ */ import_react10.default.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ import_react10.default.createElement(
|
2979
3040
|
"input",
|
2980
3041
|
{
|
2981
3042
|
"data-token": "exp_month",
|
@@ -2986,14 +3047,14 @@ function Payment() {
|
|
2986
3047
|
maxLength: 2,
|
2987
3048
|
onChange: (e) => handleMonthChange(e)
|
2988
3049
|
}
|
2989
|
-
), isValidMonth && /* @__PURE__ */
|
3050
|
+
), isValidMonth && /* @__PURE__ */ import_react10.default.createElement(
|
2990
3051
|
"span",
|
2991
3052
|
{
|
2992
3053
|
id: "card_number-error",
|
2993
3054
|
style: { color: "red", fontSize: "15px" }
|
2994
3055
|
},
|
2995
3056
|
(_a = ErrorText) == null ? void 0 : _a.montherror
|
2996
|
-
)), /* @__PURE__ */
|
3057
|
+
)), /* @__PURE__ */ import_react10.default.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ import_react10.default.createElement(
|
2997
3058
|
"input",
|
2998
3059
|
{
|
2999
3060
|
"data-token": "exp_year",
|
@@ -3004,7 +3065,7 @@ function Payment() {
|
|
3004
3065
|
value: state.year,
|
3005
3066
|
onChange: (e) => handleYearChange(e)
|
3006
3067
|
}
|
3007
|
-
), state.yearError && /* @__PURE__ */
|
3068
|
+
), state.yearError && /* @__PURE__ */ import_react10.default.createElement("span", { id: "exp_year-error", style: { color: "red" } }, state.yearError)), /* @__PURE__ */ import_react10.default.createElement("div", { className: "security-code-group form-group" }, /* @__PURE__ */ import_react10.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react10.default.createElement(
|
3008
3069
|
"input",
|
3009
3070
|
{
|
3010
3071
|
"data-token": "cvv",
|
@@ -3015,7 +3076,7 @@ function Payment() {
|
|
3015
3076
|
placeholder: "CVV",
|
3016
3077
|
onChange: (e) => handleCVVChange(e)
|
3017
3078
|
}
|
3018
|
-
), /* @__PURE__ */
|
3079
|
+
), /* @__PURE__ */ import_react10.default.createElement("i", { id: "cvc", className: "fa fa-question-circle" }), state.cvvError && /* @__PURE__ */ import_react10.default.createElement("span", { id: "cvv-error", style: { color: "red" } }, state.cvvError)), /* @__PURE__ */ import_react10.default.createElement("div", { className: "cvc-preview-container two-card hide" }, /* @__PURE__ */ import_react10.default.createElement("div", { className: "amex-cvc-preview" }), /* @__PURE__ */ import_react10.default.createElement("div", { className: "visa-mc-dis-cvc-preview" }))), /* @__PURE__ */ import_react10.default.createElement("div", { className: "zip-code-group form-group" }, /* @__PURE__ */ import_react10.default.createElement("label", null, "Postal code"), /* @__PURE__ */ import_react10.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react10.default.createElement(
|
3019
3080
|
"input",
|
3020
3081
|
{
|
3021
3082
|
id: "ZIPCode",
|
@@ -3027,7 +3088,7 @@ function Payment() {
|
|
3027
3088
|
value: state.zip,
|
3028
3089
|
onChange: (e) => handleZIP(e)
|
3029
3090
|
}
|
3030
|
-
), /* @__PURE__ */
|
3091
|
+
), /* @__PURE__ */ import_react10.default.createElement(
|
3031
3092
|
"a",
|
3032
3093
|
{
|
3033
3094
|
tabIndex: 0,
|
@@ -3037,15 +3098,15 @@ function Payment() {
|
|
3037
3098
|
"data-placement": "left",
|
3038
3099
|
"data-content": "Enter the ZIP/Postal code for your credit card billing address."
|
3039
3100
|
},
|
3040
|
-
/* @__PURE__ */
|
3041
|
-
), /* @__PURE__ */
|
3101
|
+
/* @__PURE__ */ import_react10.default.createElement("i", { className: "fa fa-question-circle" })
|
3102
|
+
), /* @__PURE__ */ import_react10.default.createElement(
|
3042
3103
|
"span",
|
3043
3104
|
{
|
3044
3105
|
id: "ZIPCode-error",
|
3045
3106
|
style: { color: "red", display: "none" }
|
3046
3107
|
},
|
3047
3108
|
ErrorText.fieldrequired
|
3048
|
-
))), /* @__PURE__ */
|
3109
|
+
))), /* @__PURE__ */ import_react10.default.createElement("div", { className: "form-group top-amnt" }, /* @__PURE__ */ import_react10.default.createElement("div", null, /* @__PURE__ */ import_react10.default.createElement("label", null, "Payment amount"), /* @__PURE__ */ import_react10.default.createElement("div", { className: "amount-placeholder" }, /* @__PURE__ */ import_react10.default.createElement(
|
3049
3110
|
"input",
|
3050
3111
|
{
|
3051
3112
|
id: "Amount",
|
@@ -3057,7 +3118,7 @@ function Payment() {
|
|
3057
3118
|
onChange: (e) => handleAmount(e),
|
3058
3119
|
onBlur: handleAmountBlur
|
3059
3120
|
}
|
3060
|
-
))), /* @__PURE__ */
|
3121
|
+
))), /* @__PURE__ */ import_react10.default.createElement("div", { className: "card-row" }, /* @__PURE__ */ import_react10.default.createElement("span", { className: "visa" }), /* @__PURE__ */ import_react10.default.createElement("span", { className: "mastercard" }), /* @__PURE__ */ import_react10.default.createElement("span", { className: "amex" }), /* @__PURE__ */ import_react10.default.createElement("span", { className: "discover" }))), /* @__PURE__ */ import_react10.default.createElement(
|
3061
3122
|
"button",
|
3062
3123
|
{
|
3063
3124
|
type: "button",
|
@@ -3066,7 +3127,7 @@ function Payment() {
|
|
3066
3127
|
className: "btn btn-block btn-success submit-button"
|
3067
3128
|
},
|
3068
3129
|
"Pay"
|
3069
|
-
)), /* @__PURE__ */
|
3130
|
+
)), /* @__PURE__ */ import_react10.default.createElement("div", { className: "powerd-by-part" }, /* @__PURE__ */ import_react10.default.createElement(
|
3070
3131
|
"svg",
|
3071
3132
|
{
|
3072
3133
|
xmlns: "http://www.w3.org/2000/svg",
|
@@ -3074,14 +3135,14 @@ function Payment() {
|
|
3074
3135
|
height: "20",
|
3075
3136
|
viewBox: "0 0 26 26"
|
3076
3137
|
},
|
3077
|
-
/* @__PURE__ */
|
3138
|
+
/* @__PURE__ */ import_react10.default.createElement(
|
3078
3139
|
"path",
|
3079
3140
|
{
|
3080
3141
|
fill: "currentColor",
|
3081
3142
|
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"
|
3082
3143
|
}
|
3083
3144
|
)
|
3084
|
-
), "Secure payments powered by Fractal", /* @__PURE__ */
|
3145
|
+
), "Secure payments powered by Fractal", /* @__PURE__ */ import_react10.default.createElement(
|
3085
3146
|
"img",
|
3086
3147
|
{
|
3087
3148
|
src: "https://ui.fractalpay.com/favicon.ico",
|
@@ -3093,28 +3154,22 @@ function Payment() {
|
|
3093
3154
|
}
|
3094
3155
|
|
3095
3156
|
// src/app/components/Transaction/CompletedTransactions.tsx
|
3096
|
-
|
3097
|
-
|
3098
|
-
|
3099
|
-
|
3100
|
-
|
3101
|
-
|
3102
|
-
TableBody,
|
3103
|
-
TableHeader
|
3104
|
-
} from "react-bs-datatable";
|
3105
|
-
import DatePicker from "react-datepicker";
|
3106
|
-
import "react-datepicker/dist/react-datepicker.css";
|
3107
|
-
import { toast as toast4 } from "react-toastify";
|
3157
|
+
var import_react12 = __toESM(require("react"));
|
3158
|
+
var import_react_bootstrap7 = require("react-bootstrap");
|
3159
|
+
var import_react_bs_datatable = require("react-bs-datatable");
|
3160
|
+
var import_react_datepicker = __toESM(require("react-datepicker"));
|
3161
|
+
var import_react_datepicker2 = require("react-datepicker/dist/react-datepicker.css");
|
3162
|
+
var import_react_toastify4 = require("react-toastify");
|
3108
3163
|
|
3109
3164
|
// src/app/components/Pagination/Pagination.tsx
|
3110
|
-
|
3165
|
+
var import_react11 = __toESM(require("react"));
|
3111
3166
|
function PaginationPg({ totalPages, onPageChange, current }) {
|
3112
|
-
const [currentPage, setCurrentPage] =
|
3113
|
-
const [showPages, setShowPages] =
|
3114
|
-
|
3167
|
+
const [currentPage, setCurrentPage] = (0, import_react11.useState)(current);
|
3168
|
+
const [showPages, setShowPages] = (0, import_react11.useState)(false);
|
3169
|
+
(0, import_react11.useEffect)(() => {
|
3115
3170
|
setCurrentPage(current);
|
3116
3171
|
}, [current]);
|
3117
|
-
|
3172
|
+
(0, import_react11.useEffect)(() => {
|
3118
3173
|
setTimeout(() => {
|
3119
3174
|
setShowPages(true);
|
3120
3175
|
}, 1e3);
|
@@ -3150,7 +3205,7 @@ function PaginationPg({ totalPages, onPageChange, current }) {
|
|
3150
3205
|
if (currentPage > 3) {
|
3151
3206
|
pageNumbers.push(renderPageNumber(1));
|
3152
3207
|
if (currentPage > 4) {
|
3153
|
-
pageNumbers.push(/* @__PURE__ */
|
3208
|
+
pageNumbers.push(/* @__PURE__ */ import_react11.default.createElement("li", { key: "start-break", className: "page-item disabled" }, /* @__PURE__ */ import_react11.default.createElement("span", { className: "page-link" }, "...")));
|
3154
3209
|
}
|
3155
3210
|
}
|
3156
3211
|
const startPage = Math.max(currentPage - 1, 1);
|
@@ -3160,15 +3215,15 @@ function PaginationPg({ totalPages, onPageChange, current }) {
|
|
3160
3215
|
}
|
3161
3216
|
if (currentPage < totalPages - 2) {
|
3162
3217
|
if (currentPage < totalPages - 3) {
|
3163
|
-
pageNumbers.push(/* @__PURE__ */
|
3218
|
+
pageNumbers.push(/* @__PURE__ */ import_react11.default.createElement("li", { key: "end-break", className: "page-item disabled" }, /* @__PURE__ */ import_react11.default.createElement("span", { className: "page-link" }, "...")));
|
3164
3219
|
}
|
3165
3220
|
pageNumbers.push(renderPageNumber(totalPages));
|
3166
3221
|
}
|
3167
3222
|
}
|
3168
3223
|
return pageNumbers;
|
3169
3224
|
};
|
3170
|
-
const renderPageNumber = (pageNumber) => /* @__PURE__ */
|
3171
|
-
return /* @__PURE__ */
|
3225
|
+
const renderPageNumber = (pageNumber) => /* @__PURE__ */ import_react11.default.createElement("li", { key: pageNumber, className: `page-item ${currentPage === pageNumber ? "active" : ""}` }, /* @__PURE__ */ import_react11.default.createElement("a", { className: "page-link cursor-pointer", onClick: (e) => handlePageClick(e, pageNumber) }, pageNumber));
|
3226
|
+
return /* @__PURE__ */ import_react11.default.createElement(import_react11.default.Fragment, null, /* @__PURE__ */ import_react11.default.createElement("nav", { className: "app-pagination py-2" }, /* @__PURE__ */ import_react11.default.createElement("ul", { className: "pagination justify-content-center" }, /* @__PURE__ */ import_react11.default.createElement("li", { className: `page-item ${currentPage === 1 ? "disabled" : ""}` }, /* @__PURE__ */ import_react11.default.createElement("a", { className: "page-link cursor-pointer", onClick: handlePrevious }, /* @__PURE__ */ import_react11.default.createElement("span", null, "\u2B9C"))), showPages && getPageNumbers(), /* @__PURE__ */ import_react11.default.createElement("li", { className: `page-item ${currentPage === totalPages ? "disabled" : ""}` }, /* @__PURE__ */ import_react11.default.createElement("a", { className: "page-link cursor-pointer", onClick: handleNext }, /* @__PURE__ */ import_react11.default.createElement("span", null, "\u2B9E"))))));
|
3172
3227
|
}
|
3173
3228
|
|
3174
3229
|
// src/app/components/Transaction/CompletedTransactions.tsx
|
@@ -3206,10 +3261,10 @@ var STORY_HEADERS = [
|
|
3206
3261
|
}
|
3207
3262
|
];
|
3208
3263
|
function CompletedTransactions(props) {
|
3209
|
-
const [dataList, setDataList] =
|
3210
|
-
const [startDate, setStartDate] =
|
3211
|
-
const [endDate, setEndDate] =
|
3212
|
-
const [state, setState] =
|
3264
|
+
const [dataList, setDataList] = (0, import_react12.useState)([]);
|
3265
|
+
const [startDate, setStartDate] = (0, import_react12.useState)(null);
|
3266
|
+
const [endDate, setEndDate] = (0, import_react12.useState)(null);
|
3267
|
+
const [state, setState] = (0, import_react12.useState)({
|
3213
3268
|
page: 1,
|
3214
3269
|
totalPage: 0,
|
3215
3270
|
data: [],
|
@@ -3297,9 +3352,9 @@ function CompletedTransactions(props) {
|
|
3297
3352
|
};
|
3298
3353
|
const handleExport = async () => {
|
3299
3354
|
if (!startDate) {
|
3300
|
-
|
3355
|
+
import_react_toastify4.toast.error("Start date required");
|
3301
3356
|
} else if (!endDate) {
|
3302
|
-
|
3357
|
+
import_react_toastify4.toast.error("End date required");
|
3303
3358
|
} else {
|
3304
3359
|
setState((prev) => __spreadProps(__spreadValues({}, prev), { csvData: true }));
|
3305
3360
|
try {
|
@@ -3332,19 +3387,19 @@ function CompletedTransactions(props) {
|
|
3332
3387
|
}
|
3333
3388
|
}
|
3334
3389
|
};
|
3335
|
-
|
3390
|
+
(0, import_react12.useEffect)(() => {
|
3336
3391
|
fetchData(state.page, startDate, endDate);
|
3337
3392
|
}, [state.page]);
|
3338
3393
|
const handlePageChange = (pageNumber) => {
|
3339
3394
|
setState((prev) => __spreadProps(__spreadValues({}, prev), { page: pageNumber }));
|
3340
3395
|
fetchData(pageNumber, startDate, endDate);
|
3341
3396
|
};
|
3342
|
-
return /* @__PURE__ */
|
3397
|
+
return /* @__PURE__ */ import_react12.default.createElement(import_react12.default.Fragment, null, /* @__PURE__ */ import_react12.default.createElement("style", null, `
|
3343
3398
|
.react-datepicker-wrapper:first-child {
|
3344
3399
|
margin-right: 10px;
|
3345
3400
|
}
|
3346
|
-
`), /* @__PURE__ */
|
3347
|
-
|
3401
|
+
`), /* @__PURE__ */ import_react12.default.createElement("div", { className: "mb-5" }, /* @__PURE__ */ import_react12.default.createElement("div", null, /* @__PURE__ */ import_react12.default.createElement("div", { style: { display: "flex" } }, /* @__PURE__ */ import_react12.default.createElement("div", { style: { display: "flex", marginRight: "10px", marginTop: "25px" } }, /* @__PURE__ */ import_react12.default.createElement(
|
3402
|
+
import_react_datepicker.default,
|
3348
3403
|
{
|
3349
3404
|
selected: startDate,
|
3350
3405
|
onChange: handleStartDateChange,
|
@@ -3354,8 +3409,8 @@ function CompletedTransactions(props) {
|
|
3354
3409
|
placeholderText: "Start Date",
|
3355
3410
|
required: true
|
3356
3411
|
}
|
3357
|
-
), /* @__PURE__ */
|
3358
|
-
|
3412
|
+
), /* @__PURE__ */ import_react12.default.createElement(
|
3413
|
+
import_react_datepicker.default,
|
3359
3414
|
{
|
3360
3415
|
selected: endDate,
|
3361
3416
|
onChange: handleEndDateChange,
|
@@ -3365,8 +3420,8 @@ function CompletedTransactions(props) {
|
|
3365
3420
|
minDate: startDate,
|
3366
3421
|
placeholderText: "End Date"
|
3367
3422
|
}
|
3368
|
-
)), /* @__PURE__ */
|
3369
|
-
DatatableWrapper,
|
3423
|
+
)), /* @__PURE__ */ import_react12.default.createElement("button", { className: "export-btn1", onClick: handleExport }, "Export")), /* @__PURE__ */ import_react12.default.createElement(
|
3424
|
+
import_react_bs_datatable.DatatableWrapper,
|
3370
3425
|
{
|
3371
3426
|
body: dataList,
|
3372
3427
|
headers: STORY_HEADERS,
|
@@ -3377,21 +3432,20 @@ function CompletedTransactions(props) {
|
|
3377
3432
|
}
|
3378
3433
|
}
|
3379
3434
|
},
|
3380
|
-
/* @__PURE__ */
|
3381
|
-
/* @__PURE__ */
|
3382
|
-
/* @__PURE__ */
|
3435
|
+
/* @__PURE__ */ import_react12.default.createElement(import_react_bootstrap7.Row, { className: "mb-4 p-2" }, /* @__PURE__ */ import_react12.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_react12.default.createElement(import_react_bs_datatable.PaginationOptions, null)), /* @__PURE__ */ import_react12.default.createElement(import_react_bootstrap7.Col, { xs: 12, lg: 4, className: "d-flex flex-col justify-content-end align-items-end" }), /* @__PURE__ */ import_react12.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_react12.default.createElement(import_react_bs_datatable.Filter, null))),
|
3436
|
+
/* @__PURE__ */ import_react12.default.createElement(import_react_bootstrap7.Row, null, /* @__PURE__ */ import_react12.default.createElement("div", { className: "responsive-tbl" }, /* @__PURE__ */ import_react12.default.createElement(import_react_bootstrap7.Table, null, /* @__PURE__ */ import_react12.default.createElement(import_react_bs_datatable.TableHeader, null), /* @__PURE__ */ import_react12.default.createElement(import_react_bs_datatable.TableBody, null)))),
|
3437
|
+
/* @__PURE__ */ import_react12.default.createElement(PaginationPg, { totalPages: state.totalPage, onPageChange: handlePageChange, current: state.page })
|
3383
3438
|
))));
|
3384
3439
|
}
|
3385
3440
|
|
3386
3441
|
// src/app/components/Payment/TockenizPay.tsx
|
3387
|
-
|
3388
|
-
|
3389
|
-
|
3390
|
-
|
3391
|
-
|
3392
|
-
import creditCardType from "credit-card-type";
|
3442
|
+
var import_react13 = __toESM(require("react"));
|
3443
|
+
var import_react_bootstrap8 = require("react-bootstrap");
|
3444
|
+
var import_react_toastify5 = require("react-toastify");
|
3445
|
+
var import_node_forge2 = __toESM(require("node-forge"));
|
3446
|
+
var import_credit_card_type = __toESM(require("credit-card-type"));
|
3393
3447
|
function TockenizPay() {
|
3394
|
-
const [state, setState] =
|
3448
|
+
const [state, setState] = (0, import_react13.useState)({
|
3395
3449
|
show: false,
|
3396
3450
|
publicKey: "",
|
3397
3451
|
sessionKey: "",
|
@@ -3402,15 +3456,24 @@ function TockenizPay() {
|
|
3402
3456
|
zip: "",
|
3403
3457
|
amount: ""
|
3404
3458
|
});
|
3405
|
-
const [cardTypeDetail, setCardTypeDetail] =
|
3406
|
-
const [isValid, setIsValid] =
|
3407
|
-
const [isValidMonth, setIsValidMonth] =
|
3408
|
-
const [data, setData] =
|
3459
|
+
const [cardTypeDetail, setCardTypeDetail] = (0, import_react13.useState)(null);
|
3460
|
+
const [isValid, setIsValid] = (0, import_react13.useState)(false);
|
3461
|
+
const [isValidMonth, setIsValidMonth] = (0, import_react13.useState)(false);
|
3462
|
+
const [data, setData] = (0, import_react13.useState)(null);
|
3409
3463
|
const handlePaymentClick = async () => {
|
3410
3464
|
try {
|
3411
|
-
const response = await
|
3412
|
-
|
3413
|
-
|
3465
|
+
const response = await fetch(`${baseUrl}/generate-session`, {
|
3466
|
+
method: "POST",
|
3467
|
+
headers: {
|
3468
|
+
"Content-Type": "application/json"
|
3469
|
+
},
|
3470
|
+
body: JSON.stringify({})
|
3471
|
+
});
|
3472
|
+
if (!response.ok) {
|
3473
|
+
throw new Error("Network response was not ok");
|
3474
|
+
}
|
3475
|
+
const data2 = await response.json();
|
3476
|
+
if (data2 && data2.result === true) {
|
3414
3477
|
setState((prev) => {
|
3415
3478
|
var _a, _b;
|
3416
3479
|
return __spreadProps(__spreadValues({}, prev), {
|
@@ -3425,16 +3488,16 @@ function TockenizPay() {
|
|
3425
3488
|
}
|
3426
3489
|
};
|
3427
3490
|
const handleSubmitPay = async () => {
|
3428
|
-
var _a, _b, _c
|
3491
|
+
var _a, _b, _c;
|
3429
3492
|
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}`;
|
3430
|
-
const publicKey =
|
3493
|
+
const publicKey = import_node_forge2.default.pki.publicKeyFromPem(state.publicKey);
|
3431
3494
|
const encrypted = publicKey.encrypt(track2_data, "RSA-OAEP", {
|
3432
|
-
md:
|
3495
|
+
md: import_node_forge2.default.md.sha1.create(),
|
3433
3496
|
mgf1: {
|
3434
|
-
md:
|
3497
|
+
md: import_node_forge2.default.md.sha1.create()
|
3435
3498
|
}
|
3436
3499
|
});
|
3437
|
-
const encryptedBase64 =
|
3500
|
+
const encryptedBase64 = import_node_forge2.default.util.encode64(encrypted);
|
3438
3501
|
console.log(encryptedBase64);
|
3439
3502
|
const requestBody = {
|
3440
3503
|
enc_track2_data: encryptedBase64,
|
@@ -3442,33 +3505,37 @@ function TockenizPay() {
|
|
3442
3505
|
algorithm: "RSAES_OAEP_SHA_1"
|
3443
3506
|
};
|
3444
3507
|
try {
|
3445
|
-
const response = await
|
3508
|
+
const response = await fetch(
|
3446
3509
|
"https://m1ao5pku8b.execute-api.us-east-2.amazonaws.com/prod/tokenizer/tokenize",
|
3447
|
-
requestBody,
|
3448
3510
|
{
|
3511
|
+
method: "POST",
|
3449
3512
|
headers: {
|
3450
3513
|
"x-app-session-key": state == null ? void 0 : state.sessionKey,
|
3451
3514
|
"Content-Type": "application/json"
|
3452
|
-
}
|
3515
|
+
},
|
3516
|
+
body: JSON.stringify(requestBody)
|
3453
3517
|
}
|
3454
3518
|
);
|
3455
|
-
if (
|
3456
|
-
|
3457
|
-
|
3458
|
-
show: false,
|
3459
|
-
publicKey: "",
|
3460
|
-
sessionKey: "",
|
3461
|
-
cardNumber: "",
|
3462
|
-
year: "",
|
3463
|
-
month: "",
|
3464
|
-
cvv: "",
|
3465
|
-
zip: "",
|
3466
|
-
amount: ""
|
3467
|
-
}));
|
3519
|
+
if (!response.ok) {
|
3520
|
+
const errorData = await response.json();
|
3521
|
+
throw new Error(((_c = errorData == null ? void 0 : errorData.data) == null ? void 0 : _c.message) || "Request failed");
|
3468
3522
|
}
|
3469
|
-
|
3523
|
+
const responseData = await response.json();
|
3524
|
+
import_react_toastify5.toast.success("Payment Successful");
|
3525
|
+
setState((prev) => __spreadProps(__spreadValues({}, prev), {
|
3526
|
+
show: false,
|
3527
|
+
publicKey: "",
|
3528
|
+
sessionKey: "",
|
3529
|
+
cardNumber: "",
|
3530
|
+
year: "",
|
3531
|
+
month: "",
|
3532
|
+
cvv: "",
|
3533
|
+
zip: "",
|
3534
|
+
amount: ""
|
3535
|
+
}));
|
3536
|
+
console.log("response", responseData);
|
3470
3537
|
} catch (error) {
|
3471
|
-
|
3538
|
+
import_react_toastify5.toast.error((error == null ? void 0 : error.message) || "An error occurred");
|
3472
3539
|
console.error("Error:", error);
|
3473
3540
|
}
|
3474
3541
|
};
|
@@ -3500,9 +3567,9 @@ function TockenizPay() {
|
|
3500
3567
|
e.preventDefault();
|
3501
3568
|
e.stopPropagation();
|
3502
3569
|
const { value } = e.target;
|
3503
|
-
let cardtyp =
|
3570
|
+
let cardtyp = (0, import_credit_card_type.default)(value)[0];
|
3504
3571
|
const formattedValue = formatCreditCardNumber(value, cardtyp == null ? void 0 : cardtyp.type);
|
3505
|
-
setCardTypeDetail(
|
3572
|
+
setCardTypeDetail((0, import_credit_card_type.default)(value)[0]);
|
3506
3573
|
console.log(formattedValue);
|
3507
3574
|
if (value.match(/[a-zA-Z]/)) {
|
3508
3575
|
setState((prev) => __spreadProps(__spreadValues({}, prev), {
|
@@ -3604,7 +3671,7 @@ function TockenizPay() {
|
|
3604
3671
|
}
|
3605
3672
|
return "";
|
3606
3673
|
}
|
3607
|
-
return /* @__PURE__ */
|
3674
|
+
return /* @__PURE__ */ import_react13.default.createElement("div", null, /* @__PURE__ */ import_react13.default.createElement(import_react_toastify5.ToastContainer, null), /* @__PURE__ */ import_react13.default.createElement(
|
3608
3675
|
"button",
|
3609
3676
|
{
|
3610
3677
|
className: "export-btn mt-4",
|
@@ -3612,8 +3679,8 @@ function TockenizPay() {
|
|
3612
3679
|
onClick: () => handlePaymentClick()
|
3613
3680
|
},
|
3614
3681
|
"TokenizePay"
|
3615
|
-
), /* @__PURE__ */
|
3616
|
-
|
3682
|
+
), /* @__PURE__ */ import_react13.default.createElement(
|
3683
|
+
import_react_bootstrap8.Modal,
|
3617
3684
|
{
|
3618
3685
|
show: state.show,
|
3619
3686
|
onHide: () => setState((prev) => __spreadProps(__spreadValues({}, prev), {
|
@@ -3621,8 +3688,8 @@ function TockenizPay() {
|
|
3621
3688
|
})),
|
3622
3689
|
centered: true
|
3623
3690
|
},
|
3624
|
-
/* @__PURE__ */
|
3625
|
-
/* @__PURE__ */
|
3691
|
+
/* @__PURE__ */ import_react13.default.createElement(import_react_bootstrap8.Modal.Header, { closeButton: true }),
|
3692
|
+
/* @__PURE__ */ import_react13.default.createElement(import_react_bootstrap8.Modal.Body, null, /* @__PURE__ */ import_react13.default.createElement("div", { className: "payment-popup" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "row" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "" }, /* @__PURE__ */ import_react13.default.createElement("div", { id: "Checkout", className: "inline" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "header" }, /* @__PURE__ */ import_react13.default.createElement("h1", null, "Pay")), /* @__PURE__ */ import_react13.default.createElement("form", { id: "PaymentForm", className: "payment-form" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react13.default.createElement("label", null, "Name on card"), /* @__PURE__ */ import_react13.default.createElement(
|
3626
3693
|
"input",
|
3627
3694
|
{
|
3628
3695
|
id: "NameOnCard",
|
@@ -3631,13 +3698,13 @@ function TockenizPay() {
|
|
3631
3698
|
maxLength: 100,
|
3632
3699
|
placeholder: "Name"
|
3633
3700
|
}
|
3634
|
-
), /* @__PURE__ */
|
3701
|
+
), /* @__PURE__ */ import_react13.default.createElement(
|
3635
3702
|
"span",
|
3636
3703
|
{
|
3637
3704
|
id: "NameOnCard-error",
|
3638
3705
|
style: { color: "red", display: "none" }
|
3639
3706
|
}
|
3640
|
-
)), /* @__PURE__ */
|
3707
|
+
)), /* @__PURE__ */ import_react13.default.createElement("div", { className: "form-group" }, /* @__PURE__ */ import_react13.default.createElement(
|
3641
3708
|
"input",
|
3642
3709
|
{
|
3643
3710
|
"data-token": "card_number",
|
@@ -3648,7 +3715,7 @@ function TockenizPay() {
|
|
3648
3715
|
placeholder: "0000 0000 0000 0000",
|
3649
3716
|
onChange: handleCardNumberChange
|
3650
3717
|
}
|
3651
|
-
), state.error && /* @__PURE__ */
|
3718
|
+
), state.error && /* @__PURE__ */ import_react13.default.createElement("div", { style: { color: "red" } }, state.error)), /* @__PURE__ */ import_react13.default.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ import_react13.default.createElement(
|
3652
3719
|
"input",
|
3653
3720
|
{
|
3654
3721
|
"data-token": "exp_month",
|
@@ -3659,14 +3726,14 @@ function TockenizPay() {
|
|
3659
3726
|
maxLength: 2,
|
3660
3727
|
onChange: (e) => handleMonthChange(e)
|
3661
3728
|
}
|
3662
|
-
), isValidMonth && /* @__PURE__ */
|
3729
|
+
), isValidMonth && /* @__PURE__ */ import_react13.default.createElement(
|
3663
3730
|
"span",
|
3664
3731
|
{
|
3665
3732
|
id: "card_number-error",
|
3666
3733
|
style: { color: "red", fontSize: "15px" }
|
3667
3734
|
},
|
3668
3735
|
"Please write month only 1 to 12"
|
3669
|
-
)), /* @__PURE__ */
|
3736
|
+
)), /* @__PURE__ */ import_react13.default.createElement("div", { className: "expiry-date-group form-group" }, /* @__PURE__ */ import_react13.default.createElement(
|
3670
3737
|
"input",
|
3671
3738
|
{
|
3672
3739
|
"data-token": "exp_year",
|
@@ -3677,7 +3744,7 @@ function TockenizPay() {
|
|
3677
3744
|
value: state.year,
|
3678
3745
|
onChange: (e) => handleYearChange(e)
|
3679
3746
|
}
|
3680
|
-
), state.yearError && /* @__PURE__ */
|
3747
|
+
), state.yearError && /* @__PURE__ */ import_react13.default.createElement("span", { id: "exp_year-error", style: { color: "red" } }, state.yearError)), /* @__PURE__ */ import_react13.default.createElement("div", { className: "security-code-group form-group" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react13.default.createElement(
|
3681
3748
|
"input",
|
3682
3749
|
{
|
3683
3750
|
"data-token": "cvv",
|
@@ -3688,7 +3755,7 @@ function TockenizPay() {
|
|
3688
3755
|
placeholder: "CVV",
|
3689
3756
|
onChange: (e) => handleCVVChange(e)
|
3690
3757
|
}
|
3691
|
-
), /* @__PURE__ */
|
3758
|
+
), /* @__PURE__ */ import_react13.default.createElement("i", { id: "cvc", className: "fa fa-question-circle" }), state.cvvError && /* @__PURE__ */ import_react13.default.createElement("span", { id: "cvv-error", style: { color: "red" } }, state.cvvError)), /* @__PURE__ */ import_react13.default.createElement("div", { className: "cvc-preview-container two-card hide" }, /* @__PURE__ */ import_react13.default.createElement("div", { className: "amex-cvc-preview" }), /* @__PURE__ */ import_react13.default.createElement("div", { className: "visa-mc-dis-cvc-preview" }))), /* @__PURE__ */ import_react13.default.createElement("div", { className: "zip-code-group form-group" }, /* @__PURE__ */ import_react13.default.createElement("label", null, "Postal code"), /* @__PURE__ */ import_react13.default.createElement("div", { className: "input-container" }, /* @__PURE__ */ import_react13.default.createElement(
|
3692
3759
|
"input",
|
3693
3760
|
{
|
3694
3761
|
id: "ZIPCode",
|
@@ -3700,7 +3767,7 @@ function TockenizPay() {
|
|
3700
3767
|
value: state.zip,
|
3701
3768
|
onChange: (e) => handleZIP(e)
|
3702
3769
|
}
|
3703
|
-
), /* @__PURE__ */
|
3770
|
+
), /* @__PURE__ */ import_react13.default.createElement(
|
3704
3771
|
"a",
|
3705
3772
|
{
|
3706
3773
|
tabIndex: 0,
|
@@ -3710,15 +3777,15 @@ function TockenizPay() {
|
|
3710
3777
|
"data-placement": "left",
|
3711
3778
|
"data-content": "Enter the ZIP/Postal code for your credit card billing address."
|
3712
3779
|
},
|
3713
|
-
/* @__PURE__ */
|
3714
|
-
), /* @__PURE__ */
|
3780
|
+
/* @__PURE__ */ import_react13.default.createElement("i", { className: "fa fa-question-circle" })
|
3781
|
+
), /* @__PURE__ */ import_react13.default.createElement(
|
3715
3782
|
"span",
|
3716
3783
|
{
|
3717
3784
|
id: "ZIPCode-error",
|
3718
3785
|
style: { color: "red", display: "none" }
|
3719
3786
|
},
|
3720
3787
|
"This field is required"
|
3721
|
-
))), /* @__PURE__ */
|
3788
|
+
))), /* @__PURE__ */ import_react13.default.createElement("div", { className: "form-group top-amnt" }, /* @__PURE__ */ import_react13.default.createElement("div", null, /* @__PURE__ */ import_react13.default.createElement("label", null, "Payment amount"), /* @__PURE__ */ import_react13.default.createElement("div", { className: "amount-placeholder" }, /* @__PURE__ */ import_react13.default.createElement(
|
3722
3789
|
"input",
|
3723
3790
|
{
|
3724
3791
|
id: "Amount",
|
@@ -3730,7 +3797,7 @@ function TockenizPay() {
|
|
3730
3797
|
onChange: (e) => handleAmount(e),
|
3731
3798
|
onBlur: handleAmountBlur
|
3732
3799
|
}
|
3733
|
-
))), /* @__PURE__ */
|
3800
|
+
))), /* @__PURE__ */ import_react13.default.createElement("div", { className: "card-row" }, /* @__PURE__ */ import_react13.default.createElement("span", { className: "visa" }), /* @__PURE__ */ import_react13.default.createElement("span", { className: "mastercard" }), /* @__PURE__ */ import_react13.default.createElement("span", { className: "amex" }), /* @__PURE__ */ import_react13.default.createElement("span", { className: "discover" }))), /* @__PURE__ */ import_react13.default.createElement(
|
3734
3801
|
"button",
|
3735
3802
|
{
|
3736
3803
|
type: "button",
|
@@ -3739,7 +3806,7 @@ function TockenizPay() {
|
|
3739
3806
|
className: "btn btn-block btn-success submit-button"
|
3740
3807
|
},
|
3741
3808
|
"Submit"
|
3742
|
-
)), /* @__PURE__ */
|
3809
|
+
)), /* @__PURE__ */ import_react13.default.createElement("div", { className: "powerd-by-part" }, /* @__PURE__ */ import_react13.default.createElement(
|
3743
3810
|
"svg",
|
3744
3811
|
{
|
3745
3812
|
xmlns: "http://www.w3.org/2000/svg",
|
@@ -3747,14 +3814,14 @@ function TockenizPay() {
|
|
3747
3814
|
height: "20",
|
3748
3815
|
viewBox: "0 0 26 26"
|
3749
3816
|
},
|
3750
|
-
/* @__PURE__ */
|
3817
|
+
/* @__PURE__ */ import_react13.default.createElement(
|
3751
3818
|
"path",
|
3752
3819
|
{
|
3753
3820
|
fill: "currentColor",
|
3754
3821
|
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"
|
3755
3822
|
}
|
3756
3823
|
)
|
3757
|
-
), "Secure payments powered by Fractal", /* @__PURE__ */
|
3824
|
+
), "Secure payments powered by Fractal", /* @__PURE__ */ import_react13.default.createElement(
|
3758
3825
|
"img",
|
3759
3826
|
{
|
3760
3827
|
src: "https://ui.fractalpay.com/favicon.ico",
|
@@ -3766,25 +3833,25 @@ function TockenizPay() {
|
|
3766
3833
|
}
|
3767
3834
|
|
3768
3835
|
// src/app/components/Payment/GetPaymentDynamic.tsx
|
3769
|
-
|
3770
|
-
|
3836
|
+
var import_react15 = __toESM(require("react"));
|
3837
|
+
var import_react_bootstrap9 = require("react-bootstrap");
|
3771
3838
|
|
3772
3839
|
// src/app/components/Loader/MyLoadingAnimation.tsx
|
3773
|
-
|
3840
|
+
var import_react14 = __toESM(require("react"));
|
3774
3841
|
function MyLoadingAnimation() {
|
3775
|
-
return /* @__PURE__ */
|
3842
|
+
return /* @__PURE__ */ import_react14.default.createElement(import_react14.default.Fragment, null, /* @__PURE__ */ import_react14.default.createElement(LoaderStyle_default, null), /* @__PURE__ */ import_react14.default.createElement("div", { className: "loading-animation" }, /* @__PURE__ */ import_react14.default.createElement("div", { className: "spinner" })));
|
3776
3843
|
}
|
3777
3844
|
|
3778
3845
|
// src/app/components/Payment/GetPaymentDynamic.tsx
|
3779
3846
|
function GetPaymentDynamic(props) {
|
3780
3847
|
const { amount, fractalpayClientKey, orderID } = props;
|
3781
|
-
const [loading, setLoading] =
|
3782
|
-
const [show, setShow] =
|
3783
|
-
const [iframeLoaded, setIframeLoaded] =
|
3784
|
-
const [phoneNumber, setPhoneNumber] =
|
3785
|
-
const [errorMessage, setErrorMessage] =
|
3786
|
-
const [submitClicked, setSubmitClicked] =
|
3787
|
-
const [isValidNumber, setIsValidNumber] =
|
3848
|
+
const [loading, setLoading] = (0, import_react15.useState)(false);
|
3849
|
+
const [show, setShow] = (0, import_react15.useState)(false);
|
3850
|
+
const [iframeLoaded, setIframeLoaded] = (0, import_react15.useState)(false);
|
3851
|
+
const [phoneNumber, setPhoneNumber] = (0, import_react15.useState)("");
|
3852
|
+
const [errorMessage, setErrorMessage] = (0, import_react15.useState)("");
|
3853
|
+
const [submitClicked, setSubmitClicked] = (0, import_react15.useState)(false);
|
3854
|
+
const [isValidNumber, setIsValidNumber] = (0, import_react15.useState)(true);
|
3788
3855
|
const handleClose = () => {
|
3789
3856
|
setIframeLoaded(false);
|
3790
3857
|
setTimeout(() => {
|
@@ -3799,7 +3866,7 @@ function GetPaymentDynamic(props) {
|
|
3799
3866
|
console.error("Fractalpay client key is missing or empty.");
|
3800
3867
|
}
|
3801
3868
|
};
|
3802
|
-
|
3869
|
+
(0, import_react15.useEffect)(() => {
|
3803
3870
|
if (!fractalpayClientKey) {
|
3804
3871
|
console.error("Fractalpay client key is missing or empty.");
|
3805
3872
|
}
|
@@ -3822,7 +3889,7 @@ function GetPaymentDynamic(props) {
|
|
3822
3889
|
const handleLoad = () => {
|
3823
3890
|
setLoading(false);
|
3824
3891
|
};
|
3825
|
-
|
3892
|
+
(0, import_react15.useEffect)(() => {
|
3826
3893
|
const messageListener = (event) => {
|
3827
3894
|
var _a, _b;
|
3828
3895
|
const response = (_b = (_a = event == null ? void 0 : event.data) == null ? void 0 : _a.other) == null ? void 0 : _b.data;
|
@@ -3837,7 +3904,7 @@ function GetPaymentDynamic(props) {
|
|
3837
3904
|
window.removeEventListener("message", messageListener);
|
3838
3905
|
};
|
3839
3906
|
}, []);
|
3840
|
-
return /* @__PURE__ */
|
3907
|
+
return /* @__PURE__ */ import_react15.default.createElement("div", null, /* @__PURE__ */ import_react15.default.createElement("button", { className: "paymentBtn", onClick: handleShow }, "Pay"), /* @__PURE__ */ import_react15.default.createElement(import_react_bootstrap9.Modal, { show: show && iframeLoaded, id: "modal-pay", className: "modal-lg", onHide: handleClose }, /* @__PURE__ */ import_react15.default.createElement(import_react_bootstrap9.Modal.Header, { closeButton: true }), /* @__PURE__ */ import_react15.default.createElement(import_react_bootstrap9.Modal.Body, null, loading && /* @__PURE__ */ import_react15.default.createElement(MyLoadingAnimation, null), /* @__PURE__ */ import_react15.default.createElement(
|
3841
3908
|
"iframe",
|
3842
3909
|
{
|
3843
3910
|
src: `${baseUrl}widget-form/${amount}?fractalpay_public_key=${fractalpayClientKey}&order_id=${orderID}`,
|
@@ -3848,7 +3915,8 @@ function GetPaymentDynamic(props) {
|
|
3848
3915
|
}
|
3849
3916
|
))));
|
3850
3917
|
}
|
3851
|
-
export
|
3918
|
+
// Annotate the CommonJS export names for ESM import in node:
|
3919
|
+
0 && (module.exports = {
|
3852
3920
|
CompletedTransactions,
|
3853
3921
|
GetPaymentDynamic,
|
3854
3922
|
Payment,
|
@@ -3858,4 +3926,4 @@ export {
|
|
3858
3926
|
RequestPaymentonClick,
|
3859
3927
|
RqstPaymntInputField,
|
3860
3928
|
TockenizPay
|
3861
|
-
};
|
3929
|
+
});
|