@opexa/portal-components 0.0.946 → 0.0.947
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/client/hooks/useGlobalStore.d.ts +1 -0
- package/dist/client/hooks/useGlobalStore.js +13 -0
- package/dist/components/DepositWithdrawal/Deposit/AurixPayPayMayaDeposit/AurixPayGrabPayDeposit.js +2 -21
- package/dist/components/KYC/KYCDefault/KYCDefault.d.ts +1 -0
- package/dist/components/KYC/KYCDefault/KYCDefault.js +3 -2
- package/dist/components/KYC/KYCDefault/PersonalInformation.js +7 -0
- package/dist/components/KYC/KYCDefault/useKYCDefault.d.ts +2 -1
- package/dist/components/KYC/KYCDefault/useKYCDefault.js +2 -1
- package/dist/components/KYC/KYCReview.d.ts +1 -0
- package/dist/components/KYC/KYCReview.js +20 -0
- package/dist/components/SingleSignOn/SingleSignOn.d.ts +1 -1
- package/dist/components/SingleSignOn/SingleSignOn.js +15 -7
- package/dist/handlers/index.d.ts +2 -2
- package/dist/ui/QrCode/QrCode.d.ts +25 -25
- package/dist/ui/QrCode/qrCode.recipe.d.ts +5 -5
- package/package.json +1 -1
- package/dist/assets/providers/alize.png +0 -0
- package/dist/assets/providers/bigtime-gaming.png +0 -0
- package/dist/assets/providers/bng.png +0 -0
- package/dist/assets/providers/boongo.png +0 -0
- package/dist/assets/providers/btg.png +0 -0
- package/dist/assets/providers/cq9.png +0 -0
- package/dist/assets/providers/darwin.png +0 -0
- package/dist/assets/providers/digitain.png +0 -0
- package/dist/assets/providers/evolution.png +0 -0
- package/dist/assets/providers/fantasma-games.png +0 -0
- package/dist/assets/providers/fc.png +0 -0
- package/dist/assets/providers/fp.png +0 -0
- package/dist/assets/providers/habanero.png +0 -0
- package/dist/assets/providers/hacksaw.png +0 -0
- package/dist/assets/providers/jdb.png +0 -0
- package/dist/assets/providers/jili.png +0 -0
- package/dist/assets/providers/leap.png +0 -0
- package/dist/assets/providers/live-22-metaverse.png +0 -0
- package/dist/assets/providers/netent.png +0 -0
- package/dist/assets/providers/no-limit.png +0 -0
- package/dist/assets/providers/pg.png +0 -0
- package/dist/assets/providers/pgsoft.png +0 -0
- package/dist/assets/providers/pragmatic-play.png +0 -0
- package/dist/assets/providers/realtime-gaming.png +0 -0
- package/dist/assets/providers/redtiger.png +0 -0
- package/dist/assets/providers/rtg.png +0 -0
- package/dist/assets/providers/sagaming.png +0 -0
- package/dist/client/hooks/useAiOGCashDepositMutation.d.ts +0 -4
- package/dist/client/hooks/useAiOGCashDepositMutation.js +0 -90
- package/dist/client/hooks/useAiOGrabPayDepositMutation.d.ts +0 -4
- package/dist/client/hooks/useAiOGrabPayDepositMutation.js +0 -80
- package/dist/client/hooks/useAiOPalawanPayDepositMutation.d.ts +0 -4
- package/dist/client/hooks/useAiOPalawanPayDepositMutation.js +0 -80
- package/dist/client/hooks/useAiOPayMayaDepositMutation.d.ts +0 -4
- package/dist/client/hooks/useAiOPayMayaDepositMutation.js +0 -80
- package/dist/components/Banner/Banner.client.d.ts +0 -12
- package/dist/components/Banner/Banner.client.js +0 -49
- package/dist/components/DepositWithdrawal/AiOPaymentMethods.d.ts +0 -11
- package/dist/components/DepositWithdrawal/AiOPaymentMethods.js +0 -55
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/QRPHDepositAlert.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/QRPHDepositAlert.js +0 -99
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/QRPHDepositDetails.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/QRPHDepositDetails.js +0 -17
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/QRPHDepositForm.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/QRPHDepositForm.js +0 -116
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/QRPHQRCode.d.ts +0 -3
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/QRPHQRCode.js +0 -69
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/QRPHDeposit.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/QRPHDeposit.js +0 -10
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/QRPHDepositAlert.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/QRPHDepositAlert.js +0 -99
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/QRPHDepositContext.d.ts +0 -25
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/QRPHDepositContext.js +0 -2
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/QRPHDepositDetails.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/QRPHDepositDetails.js +0 -17
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/QRPHDepositForm.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/QRPHDepositForm.js +0 -116
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/QRPHQRCode.d.ts +0 -3
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/QRPHQRCode.js +0 -69
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/useQRPHDeposit.d.ts +0 -13
- package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit__legacy/useQRPHDeposit.js +0 -85
- package/dist/components/DepositWithdrawal/Deposit__legacy/AiOGCashDeposit/AiOGCashDeposit.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/AiOGCashDeposit/AiOGCashDeposit.js +0 -173
- package/dist/components/DepositWithdrawal/Deposit__legacy/AiOGrabPayDeposit/AiOGrabPayDeposit.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/AiOGrabPayDeposit/AiOGrabPayDeposit.js +0 -171
- package/dist/components/DepositWithdrawal/Deposit__legacy/AiOPalawanPayDeposit/AiOPalawanPayDeposit.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/AiOPalawanPayDeposit/AiOPalawanPayDeposit.js +0 -171
- package/dist/components/DepositWithdrawal/Deposit__legacy/AiOPayMayaDeposit/AiOPayMayaDeposit.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/AiOPayMayaDeposit/AiOPayMayaDeposit.js +0 -171
- package/dist/components/DepositWithdrawal/Deposit__legacy/AvailablePromos.d.ts +0 -8
- package/dist/components/DepositWithdrawal/Deposit__legacy/AvailablePromos.js +0 -33
- package/dist/components/DepositWithdrawal/Deposit__legacy/Deposit.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/Deposit.js +0 -120
- package/dist/components/DepositWithdrawal/Deposit__legacy/GCashDeposit/GCashDeposit.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/GCashDeposit/GCashDeposit.js +0 -163
- package/dist/components/DepositWithdrawal/Deposit__legacy/GCashWebpayDeposit/GCashWebpayDeposit.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/GCashWebpayDeposit/GCashWebpayDeposit.js +0 -165
- package/dist/components/DepositWithdrawal/Deposit__legacy/LibanganDeposit/LibanganDeposit.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/LibanganDeposit/LibanganDeposit.js +0 -186
- package/dist/components/DepositWithdrawal/Deposit__legacy/MayaAppDeposit/MayaAppDeposit.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/MayaAppDeposit/MayaAppDeposit.js +0 -157
- package/dist/components/DepositWithdrawal/Deposit__legacy/MayaDeposit/MayaDeposit.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/MayaDeposit/MayaDeposit.js +0 -163
- package/dist/components/DepositWithdrawal/Deposit__legacy/MayaWebpayDeposit/MayaWebpayDeposit.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/MayaWebpayDeposit/MayaWebpayDeposit.js +0 -166
- package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/OnlineBankDeposit.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/OnlineBankDeposit.js +0 -10
- package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/OnlineBankDepositAlert.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/OnlineBankDepositAlert.js +0 -99
- package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/OnlineBankDepositContext.d.ts +0 -25
- package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/OnlineBankDepositContext.js +0 -2
- package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/OnlineBankDepositDetails.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/OnlineBankDepositDetails.js +0 -19
- package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/OnlineBankDepositForm.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/OnlineBankDepositForm.js +0 -115
- package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/useOnlineBankDeposit.d.ts +0 -13
- package/dist/components/DepositWithdrawal/Deposit__legacy/OnlineBankDeposit/useOnlineBankDeposit.js +0 -81
- package/dist/components/DepositWithdrawal/Deposit__legacy/PisoPayDeposit/PisoPayDeposit.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/PisoPayDeposit/PisoPayDeposit.js +0 -180
- package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/QRPHDeposit.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/QRPHDeposit.js +0 -10
- package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/QRPHDepositAlert.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/QRPHDepositAlert.js +0 -99
- package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/QRPHDepositContext.d.ts +0 -25
- package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/QRPHDepositContext.js +0 -2
- package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/QRPHDepositDetails.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/QRPHDepositDetails.js +0 -17
- package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/QRPHDepositForm.d.ts +0 -1
- package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/QRPHDepositForm.js +0 -116
- package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/QRPHQRCode.d.ts +0 -3
- package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/QRPHQRCode.js +0 -69
- package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/useQRPHDeposit.d.ts +0 -13
- package/dist/components/DepositWithdrawal/Deposit__legacy/QRPHDeposit/useQRPHDeposit.js +0 -85
- package/dist/components/DigitainLauncher/Loading.d.ts +0 -1
- package/dist/components/DigitainLauncher/Loading.js +0 -5
- package/dist/components/Jackpots/JackpotsCarousel/JackpotsCarouselItem.module.css +0 -184
- package/dist/components/Jackpots/JackpotsList/JackpotsListItem.module.css +0 -184
- package/dist/components/KYC/BasicInformation.d.ts +0 -1
- package/dist/components/KYC/BasicInformation.js +0 -101
- package/dist/components/KYC/IdentityVerification.d.ts +0 -1
- package/dist/components/KYC/IdentityVerification.js +0 -120
- package/dist/components/KYC/Indicator.d.ts +0 -1
- package/dist/components/KYC/Indicator.js +0 -8
- package/dist/components/KYC/KYC.lazy.d.ts +0 -6
- package/dist/components/KYC/KYC.lazy.js +0 -45
- package/dist/components/KYC/KYCContext.d.ts +0 -6
- package/dist/components/KYC/KYCContext.js +0 -2
- package/dist/components/KYC/KYCDefault/BasicInformation.d.ts +0 -1
- package/dist/components/KYC/KYCDefault/BasicInformation.js +0 -101
- package/dist/components/KYC/KYCVerificationStatus.d.ts +0 -1
- package/dist/components/KYC/KYCVerificationStatus.js +0 -10
- package/dist/components/KYC/KYCVerificationStatus.lazy.d.ts +0 -1
- package/dist/components/KYC/KYCVerificationStatus.lazy.js +0 -36
- package/dist/components/KYC/PersonalInformation.d.ts +0 -1
- package/dist/components/KYC/PersonalInformation.js +0 -122
- package/dist/components/KYC/useKYC.d.ts +0 -25
- package/dist/components/KYC/useKYC.js +0 -38
- package/dist/components/KYCNotRequired/KYCNotRequired.d.ts +0 -0
- package/dist/components/KYCNotRequired/KYCNotRequired.js +0 -1
- package/dist/components/PortalProvider/AndroidOnlyComponents.d.ts +0 -1
- package/dist/components/PortalProvider/AndroidOnlyComponents.js +0 -12
- package/dist/components/PortalProvider/CXDTokenObserver.d.ts +0 -1
- package/dist/components/PortalProvider/CXDTokenObserver.js +0 -30
- package/dist/components/PortalProvider/LinkGoogleAccountObserver.d.ts +0 -1
- package/dist/components/PortalProvider/LinkGoogleAccountObserver.js +0 -29
- package/dist/components/Quests/MultiWageringQuest.d.ts +0 -1
- package/dist/components/Quests/MultiWageringQuest.js +0 -111
- package/dist/components/SessionWatcher/SessionWatcher.d.ts +0 -1
- package/dist/components/SessionWatcher/SessionWatcher.js +0 -20
- package/dist/components/SessionWatcher/index.d.ts +0 -1
- package/dist/components/SessionWatcher/index.js +0 -1
- package/dist/components/SignIn/utils.d.ts +0 -8
- package/dist/components/SignIn/utils.js +0 -26
- package/dist/constants/Branches.d.ts +0 -2
- package/dist/constants/Branches.js +0 -42
- package/dist/images/game-providers/ALPHACHINKO.png +0 -0
- package/dist/images/responsible-gaming-yellow.png +0 -0
- package/dist/third-parties/FacebookPixel/FacebookPixel.d.ts +0 -4
- package/dist/third-parties/FacebookPixel/FacebookPixel.js +0 -4
- package/dist/third-parties/FacebookPixel/api.d.ts +0 -0
- package/dist/third-parties/FacebookPixel/api.js +0 -1
- package/dist/third-parties/FacebookPixel/index.d.ts +0 -1
- package/dist/third-parties/FacebookPixel/index.js +0 -1
- package/dist/third-parties/GoogleRecaptcha/GoogleRecaptcha.d.ts +0 -4
- package/dist/third-parties/GoogleRecaptcha/GoogleRecaptcha.js +0 -4
- package/dist/third-parties/GoogleRecaptcha/api.d.ts +0 -0
- package/dist/third-parties/GoogleRecaptcha/api.js +0 -1
- package/dist/third-parties/GoogleRecaptcha/index.d.ts +0 -1
- package/dist/third-parties/GoogleRecaptcha/index.js +0 -1
- package/dist/third-parties/index.d.ts +0 -2
- package/dist/third-parties/index.js +0 -2
- package/dist/utils/getLocaleInfo.d.ts +0 -79
- package/dist/utils/getLocaleInfo.js +0 -175
package/dist/components/DepositWithdrawal/Deposit__legacy/GCashWebpayDeposit/GCashWebpayDeposit.js
DELETED
|
@@ -1,165 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
-
import { zodResolver } from '@hookform/resolvers/zod';
|
|
3
|
-
import Link from 'next/link';
|
|
4
|
-
import { useEffect, useState } from 'react';
|
|
5
|
-
import { Controller, useForm } from 'react-hook-form';
|
|
6
|
-
import invariant from 'tiny-invariant';
|
|
7
|
-
import { z } from 'zod';
|
|
8
|
-
import { useShallow } from 'zustand/shallow';
|
|
9
|
-
import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
|
|
10
|
-
import { useCreateGCashWebpayDepositMutation } from '../../../../client/hooks/useCreateGCashWebpayDepositMutation.js';
|
|
11
|
-
import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
|
|
12
|
-
import { useDisclosure } from '../../../../client/hooks/useDisclosure.js';
|
|
13
|
-
import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
|
|
14
|
-
import { useMemberVerificationQuery } from '../../../../client/hooks/useMemberVerificationQuery.js';
|
|
15
|
-
import { usePaymentSettingsQuery } from '../../../../client/hooks/usePaymentSettingsQuery.js';
|
|
16
|
-
import { AlertCircleIcon } from '../../../../icons/AlertCircleIcon.js';
|
|
17
|
-
import { ChevronDownIcon } from '../../../../icons/ChevronDownIcon.js';
|
|
18
|
-
import { ChevronUpIcon } from '../../../../icons/ChevronUpIcon.js';
|
|
19
|
-
import { SpinnerIcon } from '../../../../icons/SpinnerIcon.js';
|
|
20
|
-
import { XIcon } from '../../../../icons/XIcon.js';
|
|
21
|
-
import { AlertDialog } from '../../../../ui/AlertDialog/index.js';
|
|
22
|
-
import { Button } from '../../../../ui/Button/index.js';
|
|
23
|
-
import { Field } from '../../../../ui/Field/index.js';
|
|
24
|
-
import { NumberInput } from '../../../../ui/NumberInput/index.js';
|
|
25
|
-
import { Portal } from '../../../../ui/Portal/index.js';
|
|
26
|
-
import { parseDecimal } from '../../../../utils/parseDecimal.js';
|
|
27
|
-
import { AmountChoices } from '../../AmountChoices.js';
|
|
28
|
-
import { useDepositWithdrawalPropsContext } from '../../DepositWithdrawalContext.js';
|
|
29
|
-
import { AvailablePromos } from '../AvailablePromos.js';
|
|
30
|
-
export function GCashWebpayDeposit() {
|
|
31
|
-
const depositWithdrawalProps = useDepositWithdrawalPropsContext();
|
|
32
|
-
const disclosure = useDisclosure();
|
|
33
|
-
const globalStore = useGlobalStore(useShallow((ctx) => ({
|
|
34
|
-
depositWithdrawal: ctx.depositWithdrawal,
|
|
35
|
-
kycVerificationStatus: ctx.kycVerificationStatus,
|
|
36
|
-
})));
|
|
37
|
-
const verificationQuery = useMemberVerificationQuery();
|
|
38
|
-
const verificationStatus = verificationQuery.data?.status ?? 'UNVERIFIED';
|
|
39
|
-
const [status, setStatus] = useState('waiting');
|
|
40
|
-
const createDepositMutation = useCreateGCashWebpayDepositMutation({
|
|
41
|
-
onMutate() {
|
|
42
|
-
disclosure.setOpen(true);
|
|
43
|
-
setStatus('processing');
|
|
44
|
-
},
|
|
45
|
-
onSuccess(data) {
|
|
46
|
-
invariant(data.checkoutUrl);
|
|
47
|
-
window.open(data.checkoutUrl, '_blank', 'noopener,noreferrer');
|
|
48
|
-
setStatus('success');
|
|
49
|
-
},
|
|
50
|
-
onError() {
|
|
51
|
-
setStatus('failed');
|
|
52
|
-
},
|
|
53
|
-
});
|
|
54
|
-
const depositsCountQuery = useDepositsCountQuery();
|
|
55
|
-
const depositsCount = depositsCountQuery.data ?? 0;
|
|
56
|
-
const paymentSettingsQuery = usePaymentSettingsQuery();
|
|
57
|
-
const paymentSettings = paymentSettingsQuery.data;
|
|
58
|
-
const gatewaySettings = paymentSettings?.gcashWebpayDepositGatewaySettings;
|
|
59
|
-
const maximumAmount = parseDecimal(gatewaySettings?.maximumAmount, 0);
|
|
60
|
-
const minimumAmount = depositsCount <= 0
|
|
61
|
-
? parseDecimal(paymentSettingsQuery.data?.minimumFirstDepositAmount, 0)
|
|
62
|
-
: parseDecimal(gatewaySettings?.minimumAmount, 0);
|
|
63
|
-
const promosQuery = useAvailablePromosQuery();
|
|
64
|
-
const promos = promosQuery.data ?? [];
|
|
65
|
-
const definition = z
|
|
66
|
-
.object({
|
|
67
|
-
amount: z.string().superRefine((val, ctx) => {
|
|
68
|
-
const n = parseDecimal(val, 0);
|
|
69
|
-
if (n < minimumAmount) {
|
|
70
|
-
ctx.addIssue({
|
|
71
|
-
type: 'number',
|
|
72
|
-
code: z.ZodIssueCode.too_small,
|
|
73
|
-
inclusive: true,
|
|
74
|
-
minimum: minimumAmount,
|
|
75
|
-
message: `Please enter ${minimumAmount.toLocaleString()} or more to proceed with your deposit.`,
|
|
76
|
-
});
|
|
77
|
-
}
|
|
78
|
-
if (n > maximumAmount) {
|
|
79
|
-
ctx.addIssue({
|
|
80
|
-
type: 'number',
|
|
81
|
-
code: z.ZodIssueCode.too_big,
|
|
82
|
-
inclusive: true,
|
|
83
|
-
maximum: maximumAmount,
|
|
84
|
-
message: `Maximum amount is ${maximumAmount.toLocaleString()}`,
|
|
85
|
-
});
|
|
86
|
-
}
|
|
87
|
-
}),
|
|
88
|
-
promo: z.string().optional().nullable(),
|
|
89
|
-
})
|
|
90
|
-
.superRefine((value, ctx) => {
|
|
91
|
-
const promo = promos.find((o) => o.id === value.promo);
|
|
92
|
-
const promoMinAmount = parseDecimal(promo?.minimumDepositAmount, 0);
|
|
93
|
-
const promoMaxAmount = parseDecimal(promo?.maximumDepositAmount, 0);
|
|
94
|
-
const amount = parseDecimal(value.amount, 0);
|
|
95
|
-
if (promo && amount < promoMinAmount) {
|
|
96
|
-
ctx.addIssue({
|
|
97
|
-
path: ['amount'],
|
|
98
|
-
code: z.ZodIssueCode.custom,
|
|
99
|
-
message: `Minimum amount for this promo is ${promoMinAmount.toLocaleString()}`,
|
|
100
|
-
});
|
|
101
|
-
}
|
|
102
|
-
if (promo && amount > promoMaxAmount) {
|
|
103
|
-
ctx.addIssue({
|
|
104
|
-
path: ['amount'],
|
|
105
|
-
code: z.ZodIssueCode.custom,
|
|
106
|
-
message: `Maximum amount for this promo is ${promoMaxAmount}`,
|
|
107
|
-
});
|
|
108
|
-
}
|
|
109
|
-
});
|
|
110
|
-
const form = useForm({
|
|
111
|
-
mode: 'all',
|
|
112
|
-
resolver: zodResolver(definition),
|
|
113
|
-
defaultValues: {
|
|
114
|
-
amount: '0',
|
|
115
|
-
promo: globalStore.depositWithdrawal.promo ?? null,
|
|
116
|
-
},
|
|
117
|
-
});
|
|
118
|
-
useEffect(() => {
|
|
119
|
-
if (minimumAmount) {
|
|
120
|
-
form.reset({
|
|
121
|
-
amount: minimumAmount.toString(),
|
|
122
|
-
promo: form.getValues('promo') ?? null,
|
|
123
|
-
});
|
|
124
|
-
}
|
|
125
|
-
}, [form, minimumAmount]);
|
|
126
|
-
return (_jsxs("form", { onSubmit: form.handleSubmit(async (data) => {
|
|
127
|
-
if (verificationStatus === 'PENDING' ||
|
|
128
|
-
verificationStatus === 'UNVERIFIED' ||
|
|
129
|
-
verificationStatus === 'REJECTED' ||
|
|
130
|
-
verificationStatus === 'CREATED') {
|
|
131
|
-
globalStore.kycVerificationStatus.setOpen(true);
|
|
132
|
-
return;
|
|
133
|
-
}
|
|
134
|
-
else {
|
|
135
|
-
createDepositMutation.reset();
|
|
136
|
-
createDepositMutation.mutate({
|
|
137
|
-
amount: data.amount.toString(),
|
|
138
|
-
promo: data.promo ?? undefined,
|
|
139
|
-
successRedirectionUrl: window.location.origin,
|
|
140
|
-
cancelRedirectionUrl: window.location.origin,
|
|
141
|
-
});
|
|
142
|
-
}
|
|
143
|
-
}), noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
|
|
144
|
-
o.field.onChange(details.value);
|
|
145
|
-
}, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to deposit" }), _jsxs(NumberInput.Control, { children: [_jsx(NumberInput.Input, {}), _jsx(NumberInput.IncrementTrigger, { children: _jsx(ChevronUpIcon, {}) }), _jsx(NumberInput.DecrementTrigger, { children: _jsx(ChevronDownIcon, {}) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.amount?.message })] })) }), _jsx(AmountChoices, { value: parseDecimal(form.watch('amount'), 0), onChange: (value) => {
|
|
146
|
-
form.setValue('amount', value.toString(), {
|
|
147
|
-
shouldTouch: true,
|
|
148
|
-
shouldDirty: true,
|
|
149
|
-
shouldValidate: true,
|
|
150
|
-
});
|
|
151
|
-
}, min: minimumAmount, max: maximumAmount, className: "mt-lg" }), _jsx(Controller, { control: form.control, name: "promo", render: (o) => (_jsx(AvailablePromos, { value: o.field.value, onChange: (value) => {
|
|
152
|
-
o.field.onChange(value);
|
|
153
|
-
globalStore.depositWithdrawal.setPromo(null);
|
|
154
|
-
}, className: "mt-3xl" })) }), _jsx(Button, { type: "submit", className: "mt-3xl", disabled: createDepositMutation.isPending, children: "Deposit" }), _jsxs("p", { className: "mt-lg text-text-tertiary-600 text-xs", children: ["By depositing, you agree to our", ' ', _jsx(Link, { href: depositWithdrawalProps.termsOfUseUrl ?? '/terms-of-use', onClick: () => globalStore.depositWithdrawal.setOpen(false), className: "text-text-warning-primary-600 underline underline-offset-2", children: "Terms of Use" }), ' ', "and", ' ', _jsx(Link, { href: depositWithdrawalProps.privacyPolicyUrl ?? '/privacy-policy', onClick: () => globalStore.depositWithdrawal.setOpen(false), className: "text-text-warning-primary-600 underline underline-offset-2", children: "Privacy Policy" }), "."] }), _jsx(AlertDialog.Root, { open: disclosure.open, onOpenChange: (details) => {
|
|
155
|
-
disclosure.setOpen(details.open);
|
|
156
|
-
if (!details.open) {
|
|
157
|
-
setStatus('waiting');
|
|
158
|
-
form.reset();
|
|
159
|
-
}
|
|
160
|
-
}, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(AlertDialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+2)]" }), _jsx(AlertDialog.Positioner, { className: "!z-[calc(var(--z-dialog)+3)]", children: _jsxs(AlertDialog.Content, { children: [_jsx(AlertDialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs(AlertDialog.Header, { children: [status === 'processing' && (_jsx(SpinnerIcon, { className: "size-12 text-text-brand-primary-600" })), status === 'success' && (_jsx("div", { className: "flex size-12 items-center justify-center rounded-full bg-bg-success-secondary text-text-featured-icon-light-success", children: _jsx(AlertCircleIcon, {}) })), status === 'failed' && (_jsx("div", { className: "flex size-12 items-center justify-center rounded-full bg-bg-error-secondary text-text-featured-icon-light-error", children: _jsx(AlertCircleIcon, {}) }))] }), _jsxs(AlertDialog.Body, { children: [_jsxs(AlertDialog.Title, { children: [status === 'processing' && 'Processing Deposit', status === 'success' && 'Deposit Successful', status === 'failed' && 'Deposit Failed'] }), _jsxs(AlertDialog.Description, { children: [status === 'processing' &&
|
|
161
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' && (_jsxs(_Fragment, { children: ["Your deposit has been successfully processed. ", _jsx("br", {}), " If you are not redirected automatically, click", ' ', !!createDepositMutation.data?.checkoutUrl && (_jsx("a", { href: createDepositMutation.data?.checkoutUrl, target: "_blank", rel: "noopener noreferrer", className: "text-text-brand underline underline-offset-2", children: "here" })), "."] })), status === 'failed' &&
|
|
162
|
-
'Something went wrong while processing your deposit. Please try again or contact support.'] })] }), (status === 'failed' || status === 'success') && (_jsx(AlertDialog.Footer, { children: _jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => {
|
|
163
|
-
api.setOpen(false);
|
|
164
|
-
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
|
165
|
-
}
|
package/dist/components/DepositWithdrawal/Deposit__legacy/LibanganDeposit/LibanganDeposit.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function LibanganDeposit(): import("react/jsx-runtime").JSX.Element;
|
package/dist/components/DepositWithdrawal/Deposit__legacy/LibanganDeposit/LibanganDeposit.js
DELETED
|
@@ -1,186 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
-
import { zodResolver } from '@hookform/resolvers/zod';
|
|
3
|
-
import Link from 'next/link';
|
|
4
|
-
import { useEffect, useState } from 'react';
|
|
5
|
-
import { Controller, useForm } from 'react-hook-form';
|
|
6
|
-
import invariant from 'tiny-invariant';
|
|
7
|
-
import { z } from 'zod';
|
|
8
|
-
import { useShallow } from 'zustand/shallow';
|
|
9
|
-
import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
|
|
10
|
-
import { useCreateLibanganDepositMutation } from '../../../../client/hooks/useCreateLibanganDepositMutation.js';
|
|
11
|
-
import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
|
|
12
|
-
import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
|
|
13
|
-
import { useDisclosure } from '../../../../client/hooks/useDisclosure.js';
|
|
14
|
-
import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
|
|
15
|
-
import { useMemberVerificationQuery } from '../../../../client/hooks/useMemberVerificationQuery.js';
|
|
16
|
-
import { usePaymentSettingsQuery } from '../../../../client/hooks/usePaymentSettingsQuery.js';
|
|
17
|
-
import { AlertCircleIcon } from '../../../../icons/AlertCircleIcon.js';
|
|
18
|
-
import { ChevronDownIcon } from '../../../../icons/ChevronDownIcon.js';
|
|
19
|
-
import { ChevronUpIcon } from '../../../../icons/ChevronUpIcon.js';
|
|
20
|
-
import { SpinnerIcon } from '../../../../icons/SpinnerIcon.js';
|
|
21
|
-
import { XIcon } from '../../../../icons/XIcon.js';
|
|
22
|
-
import { AlertDialog } from '../../../../ui/AlertDialog/index.js';
|
|
23
|
-
import { Button } from '../../../../ui/Button/index.js';
|
|
24
|
-
import { Field } from '../../../../ui/Field/index.js';
|
|
25
|
-
import { NumberInput } from '../../../../ui/NumberInput/index.js';
|
|
26
|
-
import { Portal } from '../../../../ui/Portal/index.js';
|
|
27
|
-
import { parseDecimal } from '../../../../utils/parseDecimal.js';
|
|
28
|
-
import { AmountChoices } from '../../AmountChoices.js';
|
|
29
|
-
import { useDepositWithdrawalPropsContext } from '../../DepositWithdrawalContext.js';
|
|
30
|
-
import { AvailablePromos } from '../AvailablePromos.js';
|
|
31
|
-
export function LibanganDeposit() {
|
|
32
|
-
const depositWithdrawalProps = useDepositWithdrawalPropsContext();
|
|
33
|
-
const disclosure = useDisclosure();
|
|
34
|
-
const globalStore = useGlobalStore(useShallow((ctx) => ({
|
|
35
|
-
depositWithdrawal: ctx.depositWithdrawal,
|
|
36
|
-
kycVerificationStatus: ctx.kycVerificationStatus,
|
|
37
|
-
})));
|
|
38
|
-
const verificationQuery = useMemberVerificationQuery();
|
|
39
|
-
const verificationStatus = verificationQuery.data?.status ?? 'UNVERIFIED';
|
|
40
|
-
const [status, setStatus] = useState('waiting');
|
|
41
|
-
const createDepositMutation = useCreateLibanganDepositMutation({
|
|
42
|
-
onMutate() {
|
|
43
|
-
disclosure.setOpen(true);
|
|
44
|
-
setStatus('processing');
|
|
45
|
-
},
|
|
46
|
-
onSuccess(data) {
|
|
47
|
-
invariant(data.checkoutUrl);
|
|
48
|
-
window.open(data.checkoutUrl, '_blank', 'noopener,noreferrer');
|
|
49
|
-
form.reset();
|
|
50
|
-
disclosure.setOpen(false);
|
|
51
|
-
},
|
|
52
|
-
onError() {
|
|
53
|
-
disclosure.setOpen(true);
|
|
54
|
-
setStatus('failed');
|
|
55
|
-
},
|
|
56
|
-
});
|
|
57
|
-
const depositQuery = useDepositQuery(createDepositMutation.data?.id, {
|
|
58
|
-
enabled: createDepositMutation.data != null,
|
|
59
|
-
refetchInterval(ctx) {
|
|
60
|
-
if (ctx.state.data?.status === 'CANCELLED' ||
|
|
61
|
-
ctx.state.data?.status === 'CONFIRMED') {
|
|
62
|
-
return false;
|
|
63
|
-
}
|
|
64
|
-
else {
|
|
65
|
-
return 2500;
|
|
66
|
-
}
|
|
67
|
-
},
|
|
68
|
-
});
|
|
69
|
-
useEffect(() => {
|
|
70
|
-
if (depositQuery.data?.status === 'CANCELLED') {
|
|
71
|
-
disclosure.setOpen(true);
|
|
72
|
-
setStatus('failed');
|
|
73
|
-
}
|
|
74
|
-
else if (depositQuery.data?.status === 'CONFIRMED') {
|
|
75
|
-
disclosure.setOpen(true);
|
|
76
|
-
setStatus('success');
|
|
77
|
-
}
|
|
78
|
-
}, [depositQuery.data?.status, disclosure]);
|
|
79
|
-
const depositsCountQuery = useDepositsCountQuery();
|
|
80
|
-
const depositsCount = depositsCountQuery.data ?? 0;
|
|
81
|
-
const paymentSettingsQuery = usePaymentSettingsQuery();
|
|
82
|
-
const paymentSettings = paymentSettingsQuery.data;
|
|
83
|
-
const gatewaySettings = paymentSettings?.libanganDepositGatewaySettings;
|
|
84
|
-
const maximumAmount = parseDecimal(gatewaySettings?.maximumAmount, 0);
|
|
85
|
-
const minimumAmount = depositsCount <= 0
|
|
86
|
-
? parseDecimal(paymentSettingsQuery.data?.minimumFirstDepositAmount, 0)
|
|
87
|
-
: parseDecimal(gatewaySettings?.minimumAmount, 0);
|
|
88
|
-
const promosQuery = useAvailablePromosQuery();
|
|
89
|
-
const promos = promosQuery.data ?? [];
|
|
90
|
-
const definition = z
|
|
91
|
-
.object({
|
|
92
|
-
amount: z.string().superRefine((val, ctx) => {
|
|
93
|
-
const n = parseDecimal(val, 0);
|
|
94
|
-
if (n < minimumAmount) {
|
|
95
|
-
ctx.addIssue({
|
|
96
|
-
type: 'number',
|
|
97
|
-
code: z.ZodIssueCode.too_small,
|
|
98
|
-
inclusive: true,
|
|
99
|
-
minimum: minimumAmount,
|
|
100
|
-
message: `Please enter ${minimumAmount.toLocaleString()} or more to proceed with your deposit.`,
|
|
101
|
-
});
|
|
102
|
-
}
|
|
103
|
-
if (n > maximumAmount) {
|
|
104
|
-
ctx.addIssue({
|
|
105
|
-
type: 'number',
|
|
106
|
-
code: z.ZodIssueCode.too_big,
|
|
107
|
-
inclusive: true,
|
|
108
|
-
maximum: maximumAmount,
|
|
109
|
-
message: `Maximum amount is ${maximumAmount.toLocaleString()}`,
|
|
110
|
-
});
|
|
111
|
-
}
|
|
112
|
-
}),
|
|
113
|
-
promo: z.string().optional().nullable(),
|
|
114
|
-
})
|
|
115
|
-
.superRefine((value, ctx) => {
|
|
116
|
-
const promo = promos.find((o) => o.id === value.promo);
|
|
117
|
-
const promoMinAmount = parseDecimal(promo?.minimumDepositAmount, 0);
|
|
118
|
-
const promoMaxAmount = parseDecimal(promo?.maximumDepositAmount, 0);
|
|
119
|
-
const amount = parseDecimal(value.amount, 0);
|
|
120
|
-
if (promo && amount < promoMinAmount) {
|
|
121
|
-
ctx.addIssue({
|
|
122
|
-
path: ['amount'],
|
|
123
|
-
code: z.ZodIssueCode.custom,
|
|
124
|
-
message: `Minimum amount for this promo is ${promoMinAmount.toLocaleString()}`,
|
|
125
|
-
});
|
|
126
|
-
}
|
|
127
|
-
if (promo && amount > promoMaxAmount) {
|
|
128
|
-
ctx.addIssue({
|
|
129
|
-
path: ['amount'],
|
|
130
|
-
code: z.ZodIssueCode.custom,
|
|
131
|
-
message: `Maximum amount for this promo is ${promoMaxAmount}`,
|
|
132
|
-
});
|
|
133
|
-
}
|
|
134
|
-
});
|
|
135
|
-
const form = useForm({
|
|
136
|
-
mode: 'all',
|
|
137
|
-
resolver: zodResolver(definition),
|
|
138
|
-
defaultValues: {
|
|
139
|
-
amount: '0',
|
|
140
|
-
promo: globalStore.depositWithdrawal.promo ?? null,
|
|
141
|
-
},
|
|
142
|
-
});
|
|
143
|
-
useEffect(() => {
|
|
144
|
-
if (minimumAmount) {
|
|
145
|
-
form.reset({
|
|
146
|
-
amount: minimumAmount.toString(),
|
|
147
|
-
promo: form.getValues('promo') ?? null,
|
|
148
|
-
});
|
|
149
|
-
}
|
|
150
|
-
}, [form, minimumAmount]);
|
|
151
|
-
return (_jsxs("form", { onSubmit: form.handleSubmit(async (data) => {
|
|
152
|
-
//handle new kyc process
|
|
153
|
-
if (verificationStatus === 'PENDING' ||
|
|
154
|
-
verificationStatus === 'UNVERIFIED' ||
|
|
155
|
-
verificationStatus === 'REJECTED' ||
|
|
156
|
-
verificationStatus === 'CREATED') {
|
|
157
|
-
globalStore.kycVerificationStatus.setOpen(true);
|
|
158
|
-
return;
|
|
159
|
-
}
|
|
160
|
-
else {
|
|
161
|
-
createDepositMutation.reset();
|
|
162
|
-
createDepositMutation.mutate({
|
|
163
|
-
amount: data.amount.toString(),
|
|
164
|
-
promo: data.promo ?? undefined,
|
|
165
|
-
redirectUrl: depositWithdrawalProps.libanganRedirectionUrl,
|
|
166
|
-
});
|
|
167
|
-
}
|
|
168
|
-
}), noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
|
|
169
|
-
o.field.onChange(details.value);
|
|
170
|
-
}, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to deposit" }), _jsxs(NumberInput.Control, { children: [_jsx(NumberInput.Input, {}), _jsx(NumberInput.IncrementTrigger, { children: _jsx(ChevronUpIcon, {}) }), _jsx(NumberInput.DecrementTrigger, { children: _jsx(ChevronDownIcon, {}) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.amount?.message })] })) }), _jsx(AmountChoices, { value: parseDecimal(form.watch('amount'), 0), onChange: (value) => {
|
|
171
|
-
form.setValue('amount', value.toString(), {
|
|
172
|
-
shouldTouch: true,
|
|
173
|
-
shouldDirty: true,
|
|
174
|
-
shouldValidate: true,
|
|
175
|
-
});
|
|
176
|
-
}, min: minimumAmount, max: maximumAmount, className: "mt-lg" }), _jsx(Controller, { control: form.control, name: "promo", render: (o) => (_jsx(AvailablePromos, { value: o.field.value, onChange: (value) => {
|
|
177
|
-
o.field.onChange(value);
|
|
178
|
-
globalStore.depositWithdrawal.setPromo(null);
|
|
179
|
-
}, className: "mt-3xl" })) }), _jsx(Button, { type: "submit", className: "mt-3xl", disabled: createDepositMutation.isPending, children: "Deposit" }), depositWithdrawalProps.hasPrivacyPolicyAndTermsOfUse && (_jsxs("p", { className: "mt-lg text-text-tertiary-600 text-xs", children: ["By depositing, you agree to our", ' ', _jsx(Link, { href: depositWithdrawalProps.termsOfUseUrl ?? '/terms-of-use', onClick: () => globalStore.depositWithdrawal.setOpen(false), className: "text-text-warning-primary-600 underline underline-offset-2", children: "Terms of Use" }), ' ', "and", ' ', _jsx(Link, { href: depositWithdrawalProps.privacyPolicyUrl ?? '/privacy-policy', onClick: () => globalStore.depositWithdrawal.setOpen(false), className: "text-text-warning-primary-600 underline underline-offset-2", children: "Privacy Policy" }), "."] })), _jsx(AlertDialog.Root, { open: disclosure.open, onOpenChange: (details) => {
|
|
180
|
-
disclosure.setOpen(details.open);
|
|
181
|
-
}, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(AlertDialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+2)]" }), _jsx(AlertDialog.Positioner, { className: "!z-[calc(var(--z-dialog)+3)]", children: _jsxs(AlertDialog.Content, { children: [_jsx(AlertDialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs(AlertDialog.Header, { children: [status === 'processing' && (_jsx(SpinnerIcon, { className: "size-12 text-text-brand-primary-600" })), status === 'success' && (_jsx("div", { className: "flex size-12 items-center justify-center rounded-full bg-bg-success-secondary text-text-featured-icon-light-success", children: _jsx(AlertCircleIcon, {}) })), status === 'failed' && (_jsx("div", { className: "flex size-12 items-center justify-center rounded-full bg-bg-error-secondary text-text-featured-icon-light-error", children: _jsx(AlertCircleIcon, {}) }))] }), _jsxs(AlertDialog.Body, { children: [_jsxs(AlertDialog.Title, { children: [status === 'processing' && 'Processing Deposit', status === 'success' && 'Deposit Successful', status === 'failed' && 'Deposit Failed'] }), _jsxs(AlertDialog.Description, { children: [status === 'processing' &&
|
|
182
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' && (_jsxs(_Fragment, { children: ["Your deposit has been successfully processed. ", _jsx("br", {}), " If you are not redirected automatically, click", ' ', !!createDepositMutation.data?.checkoutUrl && (_jsx("a", { href: createDepositMutation.data?.checkoutUrl, target: "_blank", rel: "noopener noreferrer", className: "text-text-brand underline underline-offset-2", children: "here" })), "."] })), status === 'failed' &&
|
|
183
|
-
'Something went wrong while processing your deposit. Please try again or contact support.'] })] }), (status === 'failed' || status === 'success') && (_jsx(AlertDialog.Footer, { children: _jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => {
|
|
184
|
-
api.setOpen(false);
|
|
185
|
-
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
|
186
|
-
}
|
package/dist/components/DepositWithdrawal/Deposit__legacy/MayaAppDeposit/MayaAppDeposit.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function MayaAppDeposit(): import("react/jsx-runtime").JSX.Element;
|
|
@@ -1,157 +0,0 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
|
-
import { zodResolver } from '@hookform/resolvers/zod';
|
|
3
|
-
import Link from 'next/link';
|
|
4
|
-
import { useEffect, useState } from 'react';
|
|
5
|
-
import { Controller, useForm } from 'react-hook-form';
|
|
6
|
-
import { z } from 'zod';
|
|
7
|
-
import { useShallow } from 'zustand/shallow';
|
|
8
|
-
import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
|
|
9
|
-
import { useCreateMayaAppDepositMutation } from '../../../../client/hooks/useCreateMayaAppDepositMutation.js';
|
|
10
|
-
import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
|
|
11
|
-
import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
|
|
12
|
-
import { useMemberVerificationQuery } from '../../../../client/hooks/useMemberVerificationQuery.js';
|
|
13
|
-
import { usePaymentSettingsQuery } from '../../../../client/hooks/usePaymentSettingsQuery.js';
|
|
14
|
-
import { AlertCircleIcon } from '../../../../icons/AlertCircleIcon.js';
|
|
15
|
-
import { ChevronDownIcon } from '../../../../icons/ChevronDownIcon.js';
|
|
16
|
-
import { ChevronUpIcon } from '../../../../icons/ChevronUpIcon.js';
|
|
17
|
-
import { SpinnerIcon } from '../../../../icons/SpinnerIcon.js';
|
|
18
|
-
import { XIcon } from '../../../../icons/XIcon.js';
|
|
19
|
-
import { AlertDialog } from '../../../../ui/AlertDialog/index.js';
|
|
20
|
-
import { Button } from '../../../../ui/Button/index.js';
|
|
21
|
-
import { Field } from '../../../../ui/Field/index.js';
|
|
22
|
-
import { NumberInput } from '../../../../ui/NumberInput/index.js';
|
|
23
|
-
import { Portal } from '../../../../ui/Portal/index.js';
|
|
24
|
-
import { parseDecimal } from '../../../../utils/parseDecimal.js';
|
|
25
|
-
import { AmountChoices } from '../../AmountChoices.js';
|
|
26
|
-
import { useDepositWithdrawalPropsContext } from '../../DepositWithdrawalContext.js';
|
|
27
|
-
import { AvailablePromos } from '../AvailablePromos.js';
|
|
28
|
-
export function MayaAppDeposit() {
|
|
29
|
-
const depositWithdrawalProps = useDepositWithdrawalPropsContext();
|
|
30
|
-
const globalStore = useGlobalStore(useShallow((ctx) => ({
|
|
31
|
-
depositWithdrawal: ctx.depositWithdrawal,
|
|
32
|
-
kycVerificationStatus: ctx.kycVerificationStatus,
|
|
33
|
-
})));
|
|
34
|
-
const verificationQuery = useMemberVerificationQuery();
|
|
35
|
-
const verificationStatus = verificationQuery.data?.status ?? 'UNVERIFIED';
|
|
36
|
-
const [status, setStatus] = useState('waiting');
|
|
37
|
-
const createDepositMutation = useCreateMayaAppDepositMutation({
|
|
38
|
-
onMutate() {
|
|
39
|
-
setStatus('processing');
|
|
40
|
-
},
|
|
41
|
-
onSuccess() {
|
|
42
|
-
setStatus('success');
|
|
43
|
-
form.reset();
|
|
44
|
-
},
|
|
45
|
-
onError() {
|
|
46
|
-
setStatus('failed');
|
|
47
|
-
},
|
|
48
|
-
});
|
|
49
|
-
const depositsCountQuery = useDepositsCountQuery();
|
|
50
|
-
const depositsCount = depositsCountQuery.data ?? 0;
|
|
51
|
-
const paymentSettingsQuery = usePaymentSettingsQuery();
|
|
52
|
-
const paymentSettings = paymentSettingsQuery.data;
|
|
53
|
-
const gatewaySettings = paymentSettings?.mayaAppDepositGatewaySettings;
|
|
54
|
-
const maximumAmount = parseDecimal(gatewaySettings?.maximumAmount, 0);
|
|
55
|
-
const minimumAmount = depositsCount <= 0
|
|
56
|
-
? parseDecimal(paymentSettingsQuery.data?.minimumFirstDepositAmount, 0)
|
|
57
|
-
: parseDecimal(gatewaySettings?.minimumAmount, 0);
|
|
58
|
-
const promosQuery = useAvailablePromosQuery();
|
|
59
|
-
const promos = promosQuery.data ?? [];
|
|
60
|
-
const definition = z
|
|
61
|
-
.object({
|
|
62
|
-
amount: z.string().superRefine((val, ctx) => {
|
|
63
|
-
const n = parseDecimal(val, 0);
|
|
64
|
-
if (n < minimumAmount) {
|
|
65
|
-
ctx.addIssue({
|
|
66
|
-
type: 'number',
|
|
67
|
-
code: z.ZodIssueCode.too_small,
|
|
68
|
-
inclusive: true,
|
|
69
|
-
minimum: minimumAmount,
|
|
70
|
-
message: `Please enter ${minimumAmount.toLocaleString()} or more to proceed with your deposit.`,
|
|
71
|
-
});
|
|
72
|
-
}
|
|
73
|
-
if (n > maximumAmount) {
|
|
74
|
-
ctx.addIssue({
|
|
75
|
-
type: 'number',
|
|
76
|
-
code: z.ZodIssueCode.too_big,
|
|
77
|
-
inclusive: true,
|
|
78
|
-
maximum: maximumAmount,
|
|
79
|
-
message: `Maximum amount is ${maximumAmount.toLocaleString()}`,
|
|
80
|
-
});
|
|
81
|
-
}
|
|
82
|
-
}),
|
|
83
|
-
promo: z.string().optional().nullable(),
|
|
84
|
-
})
|
|
85
|
-
.superRefine((value, ctx) => {
|
|
86
|
-
const promo = promos.find((o) => o.id === value.promo);
|
|
87
|
-
const promoMinAmount = parseDecimal(promo?.minimumDepositAmount, 0);
|
|
88
|
-
const promoMaxAmount = parseDecimal(promo?.maximumDepositAmount, 0);
|
|
89
|
-
const amount = parseDecimal(value.amount, 0);
|
|
90
|
-
if (promo && amount < promoMinAmount) {
|
|
91
|
-
ctx.addIssue({
|
|
92
|
-
path: ['amount'],
|
|
93
|
-
code: z.ZodIssueCode.custom,
|
|
94
|
-
message: `Minimum amount for this promo is ${promoMinAmount.toLocaleString()}`,
|
|
95
|
-
});
|
|
96
|
-
}
|
|
97
|
-
if (promo && amount > promoMaxAmount) {
|
|
98
|
-
ctx.addIssue({
|
|
99
|
-
path: ['amount'],
|
|
100
|
-
code: z.ZodIssueCode.custom,
|
|
101
|
-
message: `Maximum amount for this promo is ${promoMaxAmount}`,
|
|
102
|
-
});
|
|
103
|
-
}
|
|
104
|
-
});
|
|
105
|
-
const form = useForm({
|
|
106
|
-
mode: 'all',
|
|
107
|
-
resolver: zodResolver(definition),
|
|
108
|
-
defaultValues: {
|
|
109
|
-
amount: '0',
|
|
110
|
-
promo: globalStore.depositWithdrawal.promo ?? null,
|
|
111
|
-
},
|
|
112
|
-
});
|
|
113
|
-
useEffect(() => {
|
|
114
|
-
if (minimumAmount) {
|
|
115
|
-
form.reset({
|
|
116
|
-
amount: minimumAmount.toString(),
|
|
117
|
-
promo: form.getValues('promo') ?? null,
|
|
118
|
-
});
|
|
119
|
-
}
|
|
120
|
-
}, [form, minimumAmount]);
|
|
121
|
-
const handleSubmit = form.handleSubmit(async (data) => {
|
|
122
|
-
//handle new kyc process
|
|
123
|
-
if (verificationStatus === 'PENDING' ||
|
|
124
|
-
verificationStatus === 'UNVERIFIED' ||
|
|
125
|
-
verificationStatus === 'REJECTED' ||
|
|
126
|
-
verificationStatus === 'CREATED') {
|
|
127
|
-
globalStore.kycVerificationStatus.setOpen(true);
|
|
128
|
-
return;
|
|
129
|
-
}
|
|
130
|
-
else {
|
|
131
|
-
createDepositMutation.mutate({
|
|
132
|
-
amount: data.amount.toString(),
|
|
133
|
-
promo: data.promo ?? undefined,
|
|
134
|
-
});
|
|
135
|
-
}
|
|
136
|
-
});
|
|
137
|
-
return (_jsxs("form", { onSubmit: handleSubmit, noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
|
|
138
|
-
o.field.onChange(details.value);
|
|
139
|
-
}, allowMouseWheel: true, children: [_jsx(NumberInput.Label, { children: "Enter amount you want to deposit" }), _jsxs(NumberInput.Control, { children: [_jsx(NumberInput.Input, {}), _jsx(NumberInput.IncrementTrigger, { children: _jsx(ChevronUpIcon, {}) }), _jsx(NumberInput.DecrementTrigger, { children: _jsx(ChevronDownIcon, {}) })] })] }), _jsx(Field.ErrorText, { children: form.formState.errors.amount?.message })] })) }), _jsx(AmountChoices, { value: parseDecimal(form.watch('amount'), 0), onChange: (value) => {
|
|
140
|
-
form.setValue('amount', value.toString(), {
|
|
141
|
-
shouldTouch: true,
|
|
142
|
-
shouldDirty: true,
|
|
143
|
-
shouldValidate: true,
|
|
144
|
-
});
|
|
145
|
-
}, min: minimumAmount, max: maximumAmount, className: "mt-lg" }), _jsx(Controller, { control: form.control, name: "promo", render: (o) => (_jsx(AvailablePromos, { value: o.field.value, onChange: (value) => {
|
|
146
|
-
o.field.onChange(value);
|
|
147
|
-
globalStore.depositWithdrawal.setPromo(null);
|
|
148
|
-
}, className: "mt-3xl" })) }), _jsx(Button, { type: "submit", className: "mt-3xl", disabled: createDepositMutation.isPending, children: "Deposit" }), depositWithdrawalProps.hasPrivacyPolicyAndTermsOfUse && (_jsxs("p", { className: "mt-lg text-text-tertiary-600 text-xs", children: ["By depositing, you agree to our", ' ', _jsx(Link, { href: depositWithdrawalProps.termsOfUseUrl ?? '/terms-of-use', onClick: () => globalStore.depositWithdrawal.setOpen(false), className: "text-text-warning-primary-600 underline underline-offset-2", children: "Terms of Use" }), ' ', "and", ' ', _jsx(Link, { href: depositWithdrawalProps.privacyPolicyUrl ?? '/privacy-policy', onClick: () => globalStore.depositWithdrawal.setOpen(false), className: "text-text-warning-primary-600 underline underline-offset-2", children: "Privacy Policy" }), "."] })), _jsx(AlertDialog.Root, { open: status !== 'waiting', onOpenChange: (details) => {
|
|
149
|
-
if (!details.open) {
|
|
150
|
-
setStatus('waiting');
|
|
151
|
-
}
|
|
152
|
-
}, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(AlertDialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+2)]" }), _jsx(AlertDialog.Positioner, { className: "!z-[calc(var(--z-dialog)+3)]", children: _jsxs(AlertDialog.Content, { children: [_jsx(AlertDialog.CloseTrigger, { disabled: status === 'processing', children: _jsx(XIcon, {}) }), _jsxs(AlertDialog.Header, { children: [status === 'processing' && (_jsx(SpinnerIcon, { className: "size-12 text-text-brand-primary-600" })), status === 'success' && (_jsx("div", { className: "flex size-12 items-center justify-center rounded-full bg-bg-success-secondary text-text-featured-icon-light-success", children: _jsx(AlertCircleIcon, {}) })), status === 'failed' && (_jsx("div", { className: "flex size-12 items-center justify-center rounded-full bg-bg-error-secondary text-text-featured-icon-light-error", children: _jsx(AlertCircleIcon, {}) }))] }), _jsxs(AlertDialog.Body, { children: [_jsxs(AlertDialog.Title, { children: [status === 'processing' && 'Processing Deposit', status === 'success' && 'Deposit Successful', status === 'failed' && 'Deposit Failed'] }), _jsxs(AlertDialog.Description, { children: [status === 'processing' &&
|
|
153
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' && (_jsxs(_Fragment, { children: ["Your deposit has been successfully processed. ", _jsx("br", {}), " If you are not redirected automatically, click", ' ', !!createDepositMutation.data?.checkoutUrl && (_jsx("a", { href: createDepositMutation.data?.checkoutUrl, target: "_blank", rel: "noopener noreferrer", className: "text-text-brand underline underline-offset-2", children: "here" })), "."] })), status === 'failed' &&
|
|
154
|
-
'Something went wrong while processing your deposit. Please try again or contact support.'] })] }), (status === 'failed' || status === 'success') && (_jsx(AlertDialog.Footer, { children: _jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => {
|
|
155
|
-
api.setOpen(false);
|
|
156
|
-
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
|
157
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export declare function MayaDeposit(): import("react/jsx-runtime").JSX.Element;
|