strapi-plugin-payone-provider 1.6.5 → 1.6.7
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.well-known/.gitkeep +3 -0
- package/.well-known/apple-developer-merchant-id-domain-association.txt +1 -0
- package/admin/src/pages/App/components/AppTabs.jsx +31 -16
- package/admin/src/pages/App/components/ApplePayBtn.jsx +63 -28
- package/admin/src/pages/App/components/ConfigurationPanel.jsx +189 -10
- package/admin/src/pages/App/components/DocsPanel.jsx +864 -194
- package/admin/src/pages/App/components/HistoryPanel.jsx +73 -46
- package/admin/src/pages/App/components/PaymentActionsPanel.jsx +8 -2
- package/admin/src/pages/App/components/TransactionHistoryItem.jsx +232 -87
- package/admin/src/pages/App/components/paymentActions/ApplePayPanel.jsx +45 -1
- package/admin/src/pages/App/components/paymentActions/PaymentResult.jsx +74 -30
- package/admin/src/pages/App/index.jsx +1 -0
- package/admin/src/pages/hooks/usePaymentActions.js +4 -0
- package/admin/src/pages/hooks/useSettings.js +26 -1
- package/admin/src/pages/hooks/useTransactionHistory.js +2 -3
- package/admin/src/pages/utils/paymentUtils.js +64 -6
- package/package.json +1 -1
- package/server/bootstrap.js +9 -3
- package/server/controllers/payone.js +14 -1
- package/server/services/applePayService.js +103 -93
- package/server/services/paymentService.js +56 -13
- package/server/services/transactionService.js +37 -14
- package/server/utils/paymentMethodParams.js +89 -19
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import React, { useState } from
|
|
1
|
+
import React, { useState } from "react";
|
|
2
2
|
import {
|
|
3
3
|
Box,
|
|
4
4
|
Card,
|
|
@@ -8,41 +8,36 @@ import {
|
|
|
8
8
|
Typography,
|
|
9
9
|
Badge,
|
|
10
10
|
Button,
|
|
11
|
-
} from
|
|
12
|
-
import {
|
|
13
|
-
ChevronDownIcon,
|
|
14
|
-
ChevronUpIcon,
|
|
15
|
-
} from './icons';
|
|
11
|
+
} from "@strapi/design-system";
|
|
12
|
+
import { ChevronDownIcon, ChevronUpIcon } from "./icons";
|
|
16
13
|
const TransactionHistoryItem = ({ transaction }) => {
|
|
17
14
|
const [isExpanded, setIsExpanded] = useState(false);
|
|
18
15
|
|
|
19
|
-
|
|
20
16
|
const getStatusColor = (status) => {
|
|
21
17
|
switch (status) {
|
|
22
|
-
case
|
|
23
|
-
return
|
|
24
|
-
case
|
|
25
|
-
return
|
|
26
|
-
case
|
|
27
|
-
return
|
|
18
|
+
case "APPROVED":
|
|
19
|
+
return "success";
|
|
20
|
+
case "ERROR":
|
|
21
|
+
return "danger";
|
|
22
|
+
case "PENDING":
|
|
23
|
+
return "warning";
|
|
28
24
|
default:
|
|
29
|
-
return
|
|
25
|
+
return "neutral";
|
|
30
26
|
}
|
|
31
27
|
};
|
|
32
28
|
|
|
33
|
-
|
|
34
29
|
const getPaymentMethodName = (clearingtype, wallettype) => {
|
|
35
30
|
switch (clearingtype) {
|
|
36
|
-
case
|
|
37
|
-
return
|
|
38
|
-
case
|
|
39
|
-
return
|
|
40
|
-
case
|
|
41
|
-
return wallettype ===
|
|
42
|
-
case
|
|
43
|
-
return
|
|
31
|
+
case "cc":
|
|
32
|
+
return "Credit Card";
|
|
33
|
+
case "sb":
|
|
34
|
+
return "Online Banking";
|
|
35
|
+
case "wlt":
|
|
36
|
+
return wallettype === "PPE" ? "PayPal" : "Wallet";
|
|
37
|
+
case "elv":
|
|
38
|
+
return "Direct Debit (SEPA)";
|
|
44
39
|
default:
|
|
45
|
-
return
|
|
40
|
+
return "Unknown";
|
|
46
41
|
}
|
|
47
42
|
};
|
|
48
43
|
|
|
@@ -51,25 +46,25 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
51
46
|
};
|
|
52
47
|
|
|
53
48
|
const formatDate = (dateString) => {
|
|
54
|
-
return new Date(dateString).toLocaleString(
|
|
55
|
-
year:
|
|
56
|
-
month:
|
|
57
|
-
day:
|
|
58
|
-
hour:
|
|
59
|
-
minute:
|
|
49
|
+
return new Date(dateString).toLocaleString("de-DE", {
|
|
50
|
+
year: "numeric",
|
|
51
|
+
month: "2-digit",
|
|
52
|
+
day: "2-digit",
|
|
53
|
+
hour: "2-digit",
|
|
54
|
+
minute: "2-digit",
|
|
60
55
|
});
|
|
61
56
|
};
|
|
62
57
|
|
|
63
58
|
const getCardTypeName = (cardtype) => {
|
|
64
59
|
switch (cardtype) {
|
|
65
|
-
case
|
|
66
|
-
return
|
|
67
|
-
case
|
|
68
|
-
return
|
|
69
|
-
case
|
|
70
|
-
return
|
|
60
|
+
case "V":
|
|
61
|
+
return "Visa";
|
|
62
|
+
case "M":
|
|
63
|
+
return "Mastercard";
|
|
64
|
+
case "A":
|
|
65
|
+
return "American Express";
|
|
71
66
|
default:
|
|
72
|
-
return cardtype ||
|
|
67
|
+
return cardtype || "Unknown";
|
|
73
68
|
}
|
|
74
69
|
};
|
|
75
70
|
|
|
@@ -80,10 +75,13 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
80
75
|
hasRadius
|
|
81
76
|
shadow="filterShadow"
|
|
82
77
|
style={{
|
|
83
|
-
marginBottom:
|
|
78
|
+
marginBottom: "16px",
|
|
84
79
|
}}
|
|
85
80
|
>
|
|
86
|
-
<CardBody
|
|
81
|
+
<CardBody
|
|
82
|
+
padding={6}
|
|
83
|
+
style={{ display: "flex", flexDirection: "column", gap: "6px" }}
|
|
84
|
+
>
|
|
87
85
|
{/* Main Values in Column Format */}
|
|
88
86
|
<Stack spacing={3} marginBottom={4}>
|
|
89
87
|
{/* Reference */}
|
|
@@ -111,11 +109,16 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
111
109
|
Method:
|
|
112
110
|
</Typography>
|
|
113
111
|
<Typography variant="pi" textColor="neutral800">
|
|
114
|
-
{getPaymentMethodName(
|
|
112
|
+
{getPaymentMethodName(
|
|
113
|
+
transaction.raw_request?.clearingtype,
|
|
114
|
+
transaction.raw_request?.wallettype
|
|
115
|
+
)}
|
|
115
116
|
</Typography>
|
|
116
117
|
{transaction.txid && (
|
|
117
118
|
<>
|
|
118
|
-
<Typography variant="pi" textColor="neutral500"
|
|
119
|
+
<Typography variant="pi" textColor="neutral500">
|
|
120
|
+
•
|
|
121
|
+
</Typography>
|
|
119
122
|
<Typography variant="pi" textColor="neutral600">
|
|
120
123
|
TX: {transaction.txid}
|
|
121
124
|
</Typography>
|
|
@@ -128,7 +131,12 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
128
131
|
<Typography variant="pi" textColor="neutral600" fontWeight="medium">
|
|
129
132
|
Amount:
|
|
130
133
|
</Typography>
|
|
131
|
-
<Typography
|
|
134
|
+
<Typography
|
|
135
|
+
variant="pi"
|
|
136
|
+
fontWeight="bold"
|
|
137
|
+
textColor="primary600"
|
|
138
|
+
fontSize={2}
|
|
139
|
+
>
|
|
132
140
|
{formatAmount(transaction.amount, transaction.currency)}
|
|
133
141
|
</Typography>
|
|
134
142
|
<Badge
|
|
@@ -140,26 +148,36 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
140
148
|
</Flex>
|
|
141
149
|
</Stack>
|
|
142
150
|
|
|
143
|
-
|
|
144
|
-
|
|
145
151
|
{/* Expand/Collapse Button */}
|
|
146
152
|
<Flex justifyContent="center">
|
|
147
153
|
<Button
|
|
148
154
|
size="S"
|
|
149
155
|
onClick={() => setIsExpanded(!isExpanded)}
|
|
150
|
-
startIcon={
|
|
156
|
+
startIcon={
|
|
157
|
+
isExpanded ? (
|
|
158
|
+
<ChevronUpIcon size={16} />
|
|
159
|
+
) : (
|
|
160
|
+
<ChevronDownIcon size={16} />
|
|
161
|
+
)
|
|
162
|
+
}
|
|
151
163
|
className="payment-button payment-button-primary"
|
|
152
164
|
>
|
|
153
|
-
{isExpanded ?
|
|
165
|
+
{isExpanded ? "Hide Details" : "Show Details"}
|
|
154
166
|
</Button>
|
|
155
167
|
</Flex>
|
|
156
168
|
|
|
157
169
|
{/* Expanded Details */}
|
|
158
170
|
{isExpanded && (
|
|
159
|
-
<
|
|
171
|
+
<Flex
|
|
172
|
+
marginTop={4}
|
|
173
|
+
style={{
|
|
174
|
+
animation: "fadeIn 0.3s ease-out",
|
|
175
|
+
gap: "32px",
|
|
176
|
+
}}
|
|
177
|
+
>
|
|
160
178
|
<Stack spacing={4}>
|
|
161
179
|
{/* Error Message */}
|
|
162
|
-
{transaction.status ===
|
|
180
|
+
{transaction.status === "ERROR" && (
|
|
163
181
|
<Box
|
|
164
182
|
marginBottom={4}
|
|
165
183
|
padding={3}
|
|
@@ -167,11 +185,16 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
167
185
|
hasRadius
|
|
168
186
|
className="payment-alert"
|
|
169
187
|
style={{
|
|
170
|
-
border:
|
|
171
|
-
borderColor:
|
|
188
|
+
border: "1px solid",
|
|
189
|
+
borderColor: "var(--strapi-colors-danger200)",
|
|
172
190
|
}}
|
|
173
191
|
>
|
|
174
|
-
<Typography
|
|
192
|
+
<Typography
|
|
193
|
+
variant="pi"
|
|
194
|
+
fontWeight="bold"
|
|
195
|
+
textColor="danger600"
|
|
196
|
+
marginBottom={1}
|
|
197
|
+
>
|
|
175
198
|
Error: {transaction.error_message}
|
|
176
199
|
</Typography>
|
|
177
200
|
{transaction.customer_message && (
|
|
@@ -184,22 +207,35 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
184
207
|
{/* Customer Information */}
|
|
185
208
|
<Box>
|
|
186
209
|
<Flex alignItems="center" gap={2} marginBottom={3}>
|
|
187
|
-
<Typography
|
|
210
|
+
<Typography
|
|
211
|
+
variant="pi"
|
|
212
|
+
fontWeight="bold"
|
|
213
|
+
textColor="neutral800"
|
|
214
|
+
>
|
|
188
215
|
Customer Information
|
|
189
216
|
</Typography>
|
|
190
217
|
</Flex>
|
|
191
218
|
<Box paddingLeft={4}>
|
|
192
219
|
<Stack spacing={2}>
|
|
193
220
|
<Flex justifyContent="space-between" gap={3}>
|
|
194
|
-
<Typography
|
|
221
|
+
<Typography
|
|
222
|
+
variant="pi"
|
|
223
|
+
textColor="neutral600"
|
|
224
|
+
fontWeight="medium"
|
|
225
|
+
>
|
|
195
226
|
Name:
|
|
196
227
|
</Typography>
|
|
197
228
|
<Typography variant="pi" textColor="neutral800">
|
|
198
|
-
{transaction.raw_request?.firstname}
|
|
229
|
+
{transaction.raw_request?.firstname}{" "}
|
|
230
|
+
{transaction.raw_request?.lastname}
|
|
199
231
|
</Typography>
|
|
200
232
|
</Flex>
|
|
201
233
|
<Flex justifyContent="space-between" gap={3}>
|
|
202
|
-
<Typography
|
|
234
|
+
<Typography
|
|
235
|
+
variant="pi"
|
|
236
|
+
textColor="neutral600"
|
|
237
|
+
fontWeight="medium"
|
|
238
|
+
>
|
|
203
239
|
Email:
|
|
204
240
|
</Typography>
|
|
205
241
|
<Typography variant="pi" textColor="neutral800">
|
|
@@ -207,7 +243,11 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
207
243
|
</Typography>
|
|
208
244
|
</Flex>
|
|
209
245
|
<Flex justifyContent="space-between" gap={3}>
|
|
210
|
-
<Typography
|
|
246
|
+
<Typography
|
|
247
|
+
variant="pi"
|
|
248
|
+
textColor="neutral600"
|
|
249
|
+
fontWeight="medium"
|
|
250
|
+
>
|
|
211
251
|
Phone:
|
|
212
252
|
</Typography>
|
|
213
253
|
<Typography variant="pi" textColor="neutral800">
|
|
@@ -215,15 +255,25 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
215
255
|
</Typography>
|
|
216
256
|
</Flex>
|
|
217
257
|
<Flex justifyContent="space-between" gap={3}>
|
|
218
|
-
<Typography
|
|
258
|
+
<Typography
|
|
259
|
+
variant="pi"
|
|
260
|
+
textColor="neutral600"
|
|
261
|
+
fontWeight="medium"
|
|
262
|
+
>
|
|
219
263
|
Address:
|
|
220
264
|
</Typography>
|
|
221
265
|
<Typography variant="pi" textColor="neutral800">
|
|
222
|
-
{transaction.raw_request?.street},
|
|
266
|
+
{transaction.raw_request?.street},{" "}
|
|
267
|
+
{transaction.raw_request?.zip}{" "}
|
|
268
|
+
{transaction.raw_request?.city}
|
|
223
269
|
</Typography>
|
|
224
270
|
</Flex>
|
|
225
271
|
<Flex justifyContent="space-between" gap={3}>
|
|
226
|
-
<Typography
|
|
272
|
+
<Typography
|
|
273
|
+
variant="pi"
|
|
274
|
+
textColor="neutral600"
|
|
275
|
+
fontWeight="medium"
|
|
276
|
+
>
|
|
227
277
|
Country:
|
|
228
278
|
</Typography>
|
|
229
279
|
<Typography variant="pi" textColor="neutral800">
|
|
@@ -237,25 +287,40 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
237
287
|
{/* Payment Method Details */}
|
|
238
288
|
<Box>
|
|
239
289
|
<Flex alignItems="center" gap={2} marginBottom={3}>
|
|
240
|
-
<Typography
|
|
290
|
+
<Typography
|
|
291
|
+
variant="pi"
|
|
292
|
+
fontWeight="bold"
|
|
293
|
+
textColor="neutral800"
|
|
294
|
+
>
|
|
241
295
|
Payment Method Details
|
|
242
296
|
</Typography>
|
|
243
297
|
</Flex>
|
|
244
298
|
<Box paddingLeft={4}>
|
|
245
299
|
<Stack spacing={2}>
|
|
246
300
|
<Flex justifyContent="space-between" gap={3}>
|
|
247
|
-
<Typography
|
|
301
|
+
<Typography
|
|
302
|
+
variant="pi"
|
|
303
|
+
textColor="neutral600"
|
|
304
|
+
fontWeight="medium"
|
|
305
|
+
>
|
|
248
306
|
Type:
|
|
249
307
|
</Typography>
|
|
250
308
|
<Typography variant="pi" textColor="neutral800">
|
|
251
|
-
{getPaymentMethodName(
|
|
309
|
+
{getPaymentMethodName(
|
|
310
|
+
transaction.raw_request?.clearingtype,
|
|
311
|
+
transaction.raw_request?.wallettype
|
|
312
|
+
)}
|
|
252
313
|
</Typography>
|
|
253
314
|
</Flex>
|
|
254
315
|
|
|
255
|
-
{transaction.raw_request?.clearingtype ===
|
|
316
|
+
{transaction.raw_request?.clearingtype === "cc" && (
|
|
256
317
|
<>
|
|
257
318
|
<Flex justifyContent="space-between" gap={3}>
|
|
258
|
-
<Typography
|
|
319
|
+
<Typography
|
|
320
|
+
variant="pi"
|
|
321
|
+
textColor="neutral600"
|
|
322
|
+
fontWeight="medium"
|
|
323
|
+
>
|
|
259
324
|
Card Type:
|
|
260
325
|
</Typography>
|
|
261
326
|
<Typography variant="pi" textColor="neutral800">
|
|
@@ -263,15 +328,24 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
263
328
|
</Typography>
|
|
264
329
|
</Flex>
|
|
265
330
|
<Flex justifyContent="space-between" gap={3}>
|
|
266
|
-
<Typography
|
|
331
|
+
<Typography
|
|
332
|
+
variant="pi"
|
|
333
|
+
textColor="neutral600"
|
|
334
|
+
fontWeight="medium"
|
|
335
|
+
>
|
|
267
336
|
Card Number:
|
|
268
337
|
</Typography>
|
|
269
338
|
<Typography variant="pi" textColor="neutral800">
|
|
270
|
-
**** **** ****
|
|
339
|
+
**** **** ****{" "}
|
|
340
|
+
{transaction.raw_request?.cardpan?.slice(-4)}
|
|
271
341
|
</Typography>
|
|
272
342
|
</Flex>
|
|
273
343
|
<Flex justifyContent="space-between" gap={3}>
|
|
274
|
-
<Typography
|
|
344
|
+
<Typography
|
|
345
|
+
variant="pi"
|
|
346
|
+
textColor="neutral600"
|
|
347
|
+
fontWeight="medium"
|
|
348
|
+
>
|
|
275
349
|
Expiry:
|
|
276
350
|
</Typography>
|
|
277
351
|
<Typography variant="pi" textColor="neutral800">
|
|
@@ -281,21 +355,30 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
281
355
|
</>
|
|
282
356
|
)}
|
|
283
357
|
|
|
284
|
-
{transaction.raw_request?.clearingtype ===
|
|
285
|
-
|
|
286
|
-
<
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
358
|
+
{transaction.raw_request?.clearingtype === "wlt" &&
|
|
359
|
+
transaction.raw_request?.wallettype && (
|
|
360
|
+
<Flex justifyContent="space-between" gap={3}>
|
|
361
|
+
<Typography
|
|
362
|
+
variant="pi"
|
|
363
|
+
textColor="neutral600"
|
|
364
|
+
fontWeight="medium"
|
|
365
|
+
>
|
|
366
|
+
Wallet Type:
|
|
367
|
+
</Typography>
|
|
368
|
+
<Typography variant="pi" textColor="neutral800">
|
|
369
|
+
{transaction.raw_request.wallettype}
|
|
370
|
+
</Typography>
|
|
371
|
+
</Flex>
|
|
372
|
+
)}
|
|
294
373
|
|
|
295
|
-
{transaction.raw_request?.clearingtype ===
|
|
374
|
+
{transaction.raw_request?.clearingtype === "sb" && (
|
|
296
375
|
<>
|
|
297
376
|
<Flex justifyContent="space-between" gap={3}>
|
|
298
|
-
<Typography
|
|
377
|
+
<Typography
|
|
378
|
+
variant="pi"
|
|
379
|
+
textColor="neutral600"
|
|
380
|
+
fontWeight="medium"
|
|
381
|
+
>
|
|
299
382
|
Bank Transfer Type:
|
|
300
383
|
</Typography>
|
|
301
384
|
<Typography variant="pi" textColor="neutral800">
|
|
@@ -303,7 +386,11 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
303
386
|
</Typography>
|
|
304
387
|
</Flex>
|
|
305
388
|
<Flex justifyContent="space-between" gap={3}>
|
|
306
|
-
<Typography
|
|
389
|
+
<Typography
|
|
390
|
+
variant="pi"
|
|
391
|
+
textColor="neutral600"
|
|
392
|
+
fontWeight="medium"
|
|
393
|
+
>
|
|
307
394
|
Bank Country:
|
|
308
395
|
</Typography>
|
|
309
396
|
<Typography variant="pi" textColor="neutral800">
|
|
@@ -318,13 +405,22 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
318
405
|
|
|
319
406
|
{/* Technical Details */}
|
|
320
407
|
<Box>
|
|
321
|
-
<Typography
|
|
408
|
+
<Typography
|
|
409
|
+
variant="pi"
|
|
410
|
+
fontWeight="bold"
|
|
411
|
+
textColor="neutral800"
|
|
412
|
+
marginBottom={3}
|
|
413
|
+
>
|
|
322
414
|
Technical Details
|
|
323
415
|
</Typography>
|
|
324
416
|
<Box paddingLeft={4}>
|
|
325
417
|
<Stack spacing={2}>
|
|
326
418
|
<Flex justifyContent="space-between" gap={3}>
|
|
327
|
-
<Typography
|
|
419
|
+
<Typography
|
|
420
|
+
variant="pi"
|
|
421
|
+
textColor="neutral600"
|
|
422
|
+
fontWeight="medium"
|
|
423
|
+
>
|
|
328
424
|
Request Type:
|
|
329
425
|
</Typography>
|
|
330
426
|
<Typography variant="pi" textColor="neutral800">
|
|
@@ -332,7 +428,11 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
332
428
|
</Typography>
|
|
333
429
|
</Flex>
|
|
334
430
|
<Flex justifyContent="space-between" gap={3}>
|
|
335
|
-
<Typography
|
|
431
|
+
<Typography
|
|
432
|
+
variant="pi"
|
|
433
|
+
textColor="neutral600"
|
|
434
|
+
fontWeight="medium"
|
|
435
|
+
>
|
|
336
436
|
Mode:
|
|
337
437
|
</Typography>
|
|
338
438
|
<Typography variant="pi" textColor="neutral800">
|
|
@@ -340,7 +440,11 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
340
440
|
</Typography>
|
|
341
441
|
</Flex>
|
|
342
442
|
<Flex justifyContent="space-between" gap={3}>
|
|
343
|
-
<Typography
|
|
443
|
+
<Typography
|
|
444
|
+
variant="pi"
|
|
445
|
+
textColor="neutral600"
|
|
446
|
+
fontWeight="medium"
|
|
447
|
+
>
|
|
344
448
|
IP Address:
|
|
345
449
|
</Typography>
|
|
346
450
|
<Typography variant="pi" textColor="neutral800">
|
|
@@ -348,7 +452,11 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
348
452
|
</Typography>
|
|
349
453
|
</Flex>
|
|
350
454
|
<Flex justifyContent="space-between" gap={3}>
|
|
351
|
-
<Typography
|
|
455
|
+
<Typography
|
|
456
|
+
variant="pi"
|
|
457
|
+
textColor="neutral600"
|
|
458
|
+
fontWeight="medium"
|
|
459
|
+
>
|
|
352
460
|
Language:
|
|
353
461
|
</Typography>
|
|
354
462
|
<Typography variant="pi" textColor="neutral800">
|
|
@@ -356,7 +464,11 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
356
464
|
</Typography>
|
|
357
465
|
</Flex>
|
|
358
466
|
<Flex justifyContent="space-between" gap={3}>
|
|
359
|
-
<Typography
|
|
467
|
+
<Typography
|
|
468
|
+
variant="pi"
|
|
469
|
+
textColor="neutral600"
|
|
470
|
+
fontWeight="medium"
|
|
471
|
+
>
|
|
360
472
|
Customer Present:
|
|
361
473
|
</Typography>
|
|
362
474
|
<Typography variant="pi" textColor="neutral800">
|
|
@@ -367,7 +479,40 @@ const TransactionHistoryItem = ({ transaction }) => {
|
|
|
367
479
|
</Box>
|
|
368
480
|
</Box>
|
|
369
481
|
</Stack>
|
|
370
|
-
|
|
482
|
+
|
|
483
|
+
<Stack spacing={4}>
|
|
484
|
+
<Typography variant="pi" fontWeight="bold" textColor="neutral800">
|
|
485
|
+
Raw Body
|
|
486
|
+
</Typography>
|
|
487
|
+
<Box
|
|
488
|
+
padding={4}
|
|
489
|
+
background="neutral100"
|
|
490
|
+
hasRadius
|
|
491
|
+
style={{
|
|
492
|
+
border: "1px solid",
|
|
493
|
+
borderColor: "var(--strapi-colors-neutral200)",
|
|
494
|
+
overflow: "auto",
|
|
495
|
+
maxHeight: "500px",
|
|
496
|
+
maxWidth: "800px",
|
|
497
|
+
}}
|
|
498
|
+
>
|
|
499
|
+
<pre
|
|
500
|
+
style={{
|
|
501
|
+
margin: 0,
|
|
502
|
+
padding: 0,
|
|
503
|
+
fontFamily: "monospace",
|
|
504
|
+
fontSize: "13px",
|
|
505
|
+
lineHeight: "1.5",
|
|
506
|
+
color: "Highlight",
|
|
507
|
+
whiteSpace: "pre-wrap",
|
|
508
|
+
wordBreak: "break-word",
|
|
509
|
+
}}
|
|
510
|
+
>
|
|
511
|
+
{JSON.stringify(transaction?.body || {}, null, 2)}
|
|
512
|
+
</pre>
|
|
513
|
+
</Box>
|
|
514
|
+
</Stack>
|
|
515
|
+
</Flex>
|
|
371
516
|
)}
|
|
372
517
|
</CardBody>
|
|
373
518
|
</Card>
|
|
@@ -4,11 +4,30 @@ import PaymentMethodSelector from "./PaymentMethodSelector";
|
|
|
4
4
|
import AuthorizationForm from "./AuthorizationForm";
|
|
5
5
|
|
|
6
6
|
const ApplePayOnlyPanel = ({
|
|
7
|
+
paymentAmount,
|
|
8
|
+
setPaymentAmount,
|
|
9
|
+
authReference,
|
|
10
|
+
setAuthReference,
|
|
11
|
+
isProcessingPayment,
|
|
12
|
+
onAuthorization,
|
|
7
13
|
paymentMethod,
|
|
14
|
+
settings,
|
|
15
|
+
setGooglePayToken,
|
|
8
16
|
setPaymentMethod,
|
|
9
17
|
captureMode,
|
|
10
18
|
setCaptureMode,
|
|
11
19
|
onNavigateToConfig,
|
|
20
|
+
isLiveMode,
|
|
21
|
+
setCardcvc2,
|
|
22
|
+
cardtype,
|
|
23
|
+
setCardtype,
|
|
24
|
+
cardpan,
|
|
25
|
+
setCardpan,
|
|
26
|
+
cardexpiredate,
|
|
27
|
+
setCardexpiredate,
|
|
28
|
+
cardcvc2,
|
|
29
|
+
applePayToken,
|
|
30
|
+
setApplePayToken,
|
|
12
31
|
}) => {
|
|
13
32
|
return (
|
|
14
33
|
<Box
|
|
@@ -42,7 +61,32 @@ const ApplePayOnlyPanel = ({
|
|
|
42
61
|
captureMode={captureMode}
|
|
43
62
|
setCaptureMode={setCaptureMode}
|
|
44
63
|
onNavigateToConfig={onNavigateToConfig}
|
|
45
|
-
isLiveMode={
|
|
64
|
+
isLiveMode={isLiveMode}
|
|
65
|
+
/>
|
|
66
|
+
|
|
67
|
+
<hr className="payment-divider" />
|
|
68
|
+
|
|
69
|
+
<AuthorizationForm
|
|
70
|
+
paymentAmount={paymentAmount}
|
|
71
|
+
setPaymentAmount={setPaymentAmount}
|
|
72
|
+
authReference={authReference}
|
|
73
|
+
setAuthReference={setAuthReference}
|
|
74
|
+
isProcessingPayment={isProcessingPayment}
|
|
75
|
+
onAuthorization={onAuthorization}
|
|
76
|
+
paymentMethod={paymentMethod}
|
|
77
|
+
settings={settings}
|
|
78
|
+
setGooglePayToken={setGooglePayToken}
|
|
79
|
+
applePayToken={applePayToken}
|
|
80
|
+
setApplePayToken={setApplePayToken}
|
|
81
|
+
cardtype={cardtype}
|
|
82
|
+
setCardtype={setCardtype}
|
|
83
|
+
cardpan={cardpan}
|
|
84
|
+
setCardpan={setCardpan}
|
|
85
|
+
cardexpiredate={cardexpiredate}
|
|
86
|
+
setCardexpiredate={setCardexpiredate}
|
|
87
|
+
cardcvc2={cardcvc2}
|
|
88
|
+
setCardcvc2={setCardcvc2}
|
|
89
|
+
isLiveMode={isLiveMode}
|
|
46
90
|
/>
|
|
47
91
|
</Box>
|
|
48
92
|
);
|