@opexa/portal-components 0.0.808 → 0.0.810
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/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/components/Banner/Banner.client.d.ts +12 -0
- package/dist/components/Banner/Banner.client.js +49 -0
- package/dist/components/DepositWithdrawal/AiOPaymentMethods.d.ts +11 -0
- package/dist/components/DepositWithdrawal/AiOPaymentMethods.js +55 -0
- package/dist/components/DepositWithdrawal/Deposit/AiOGCashDeposit/AiOGCashDeposit.js +54 -10
- package/dist/components/DepositWithdrawal/Deposit/AiOGrabPayDeposit/AiOGrabPayDeposit.js +54 -10
- package/dist/components/DepositWithdrawal/Deposit/AiOPalawanPayDeposit/AiOPalawanPayDeposit.js +54 -10
- package/dist/components/DepositWithdrawal/Deposit/AiOPayMayaDeposit/AiOPayMayaDeposit.js +54 -10
- package/dist/components/DepositWithdrawal/Deposit/GCashDeposit/GCashDeposit.js +54 -9
- package/dist/components/DepositWithdrawal/Deposit/GCashWebpayDeposit/GCashWebpayDeposit.js +54 -9
- package/dist/components/DepositWithdrawal/Deposit/LibanganDeposit/LibanganDeposit.js +49 -25
- package/dist/components/DepositWithdrawal/Deposit/MayaDeposit/MayaDeposit.js +54 -9
- package/dist/components/DepositWithdrawal/Deposit/MayaWebpayDeposit/MayaWebpayDeposit.js +54 -9
- package/dist/components/DepositWithdrawal/Deposit/PisoPayDeposit/PisoPayDeposit.js +54 -10
- package/dist/components/DepositWithdrawal/DepositWithdrawal.lazy.js +2 -5
- package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/AiOGCashDeposit/AiOGCashDeposit.js +10 -54
- package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/AiOGrabPayDeposit/AiOGrabPayDeposit.js +10 -54
- package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/AiOPalawanPayDeposit/AiOPalawanPayDeposit.js +10 -54
- package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/AiOPayMayaDeposit/AiOPayMayaDeposit.js +10 -54
- package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/GCashDeposit/GCashDeposit.js +9 -54
- package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/GCashWebpayDeposit/GCashWebpayDeposit.js +9 -54
- package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/LibanganDeposit/LibanganDeposit.js +25 -49
- package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/MayaDeposit/MayaDeposit.js +9 -54
- package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/MayaWebpayDeposit/MayaWebpayDeposit.js +9 -54
- package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/PisoPayDeposit/PisoPayDeposit.js +10 -54
- package/dist/components/DepositWithdrawal/HasPendingBonuses.d.ts +2 -2
- package/dist/components/DepositWithdrawal/HasPendingBonuses.js +1 -2
- package/dist/components/DigitainLauncher/Loading.d.ts +1 -0
- package/dist/components/DigitainLauncher/Loading.js +5 -0
- package/dist/components/DigitainLauncher/utils.js +1 -1
- package/dist/components/Jackpots/JackpotsCarousel/JackpotsCarouselItem.module.css +184 -0
- package/dist/components/Jackpots/JackpotsList/JackpotsListItem.module.css +184 -0
- package/dist/components/KYC/BasicInformation.d.ts +1 -0
- package/dist/components/KYC/BasicInformation.js +101 -0
- package/dist/components/KYC/IdentityVerification.d.ts +1 -0
- package/dist/components/KYC/IdentityVerification.js +120 -0
- package/dist/components/KYC/Indicator.d.ts +1 -0
- package/dist/components/KYC/Indicator.js +8 -0
- package/dist/components/KYC/KYC.lazy.d.ts +6 -0
- package/dist/components/KYC/KYC.lazy.js +45 -0
- package/dist/components/KYC/KYCContext.d.ts +6 -0
- package/dist/components/KYC/KYCContext.js +2 -0
- package/dist/components/KYC/KYCDefault/BasicInformation.d.ts +1 -0
- package/dist/components/KYC/KYCDefault/BasicInformation.js +101 -0
- package/dist/components/KYC/KYCVerificationStatus.d.ts +1 -0
- package/dist/components/KYC/KYCVerificationStatus.js +10 -0
- package/dist/components/KYC/KYCVerificationStatus.lazy.d.ts +1 -0
- package/dist/components/KYC/KYCVerificationStatus.lazy.js +36 -0
- package/dist/components/KYC/PersonalInformation.d.ts +1 -0
- package/dist/components/KYC/PersonalInformation.js +122 -0
- package/dist/components/KYC/useKYC.d.ts +25 -0
- package/dist/components/KYC/useKYC.js +38 -0
- package/dist/components/KYCNotRequired/KYCNotRequired.d.ts +0 -0
- package/dist/components/KYCNotRequired/KYCNotRequired.js +1 -0
- package/dist/components/PortalProvider/AndroidOnlyComponents.d.ts +1 -0
- package/dist/components/PortalProvider/AndroidOnlyComponents.js +12 -0
- package/dist/components/PortalProvider/CXDTokenObserver.d.ts +1 -0
- package/dist/components/PortalProvider/CXDTokenObserver.js +30 -0
- package/dist/components/PortalProvider/LinkGoogleAccountObserver.d.ts +1 -0
- package/dist/components/PortalProvider/LinkGoogleAccountObserver.js +29 -0
- package/dist/components/Quests/MultiWageringQuest.d.ts +1 -0
- package/dist/components/Quests/MultiWageringQuest.js +111 -0
- package/dist/components/SessionWatcher/SessionWatcher.d.ts +1 -0
- package/dist/components/SessionWatcher/SessionWatcher.js +20 -0
- package/dist/components/SessionWatcher/index.d.ts +1 -0
- package/dist/components/SessionWatcher/index.js +1 -0
- package/dist/components/SignIn/utils.d.ts +8 -0
- package/dist/components/SignIn/utils.js +26 -0
- package/dist/constants/Branches.d.ts +2 -0
- package/dist/constants/Branches.js +42 -0
- 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 +4 -0
- package/dist/third-parties/FacebookPixel/FacebookPixel.js +4 -0
- package/dist/third-parties/FacebookPixel/api.d.ts +0 -0
- package/dist/third-parties/FacebookPixel/api.js +1 -0
- package/dist/third-parties/FacebookPixel/index.d.ts +1 -0
- package/dist/third-parties/FacebookPixel/index.js +1 -0
- package/dist/third-parties/GoogleRecaptcha/GoogleRecaptcha.d.ts +4 -0
- package/dist/third-parties/GoogleRecaptcha/GoogleRecaptcha.js +4 -0
- package/dist/third-parties/GoogleRecaptcha/api.d.ts +0 -0
- package/dist/third-parties/GoogleRecaptcha/api.js +1 -0
- package/dist/third-parties/GoogleRecaptcha/index.d.ts +1 -0
- package/dist/third-parties/GoogleRecaptcha/index.js +1 -0
- package/dist/third-parties/index.d.ts +2 -0
- package/dist/third-parties/index.js +2 -0
- package/dist/ui/AlertDialog/AlertDialog.d.ts +88 -88
- package/dist/ui/AlertDialog/alertDialog.recipe.d.ts +8 -8
- package/dist/ui/Avatar/Avatar.d.ts +9 -9
- package/dist/ui/Avatar/avatar.recipe.d.ts +3 -3
- package/dist/ui/Checkbox/Checkbox.d.ts +23 -23
- package/dist/ui/Checkbox/checkbox.recipe.d.ts +3 -3
- package/dist/ui/Clipboard/Clipboard.d.ts +18 -18
- package/dist/ui/Clipboard/clipboard.recipe.d.ts +3 -3
- package/dist/ui/Collapsible/Collapsible.d.ts +20 -20
- package/dist/ui/Collapsible/collapsible.recipe.d.ts +5 -5
- package/dist/ui/Combobox/Combobox.d.ts +42 -42
- package/dist/ui/Combobox/combobox.recipe.d.ts +3 -3
- package/dist/ui/DatePicker/DatePicker.d.ts +72 -72
- package/dist/ui/DatePicker/datePicker.recipe.d.ts +3 -3
- package/dist/ui/Dialog/Dialog.d.ts +33 -33
- package/dist/ui/Dialog/dialog.recipe.d.ts +3 -3
- package/dist/ui/Drawer/Drawer.d.ts +33 -33
- package/dist/ui/Drawer/drawer.recipe.d.ts +3 -3
- package/dist/ui/Menu/Menu.d.ts +144 -144
- package/dist/ui/Menu/menu.recipe.d.ts +8 -8
- package/dist/ui/NumberInput/NumberInput.d.ts +24 -24
- package/dist/ui/NumberInput/numberInput.recipe.d.ts +3 -3
- package/dist/ui/Popover/Popover.d.ts +154 -154
- package/dist/ui/Popover/popover.recipe.d.ts +14 -14
- package/dist/ui/QrCode/QrCode.d.ts +25 -25
- package/dist/ui/QrCode/qrCode.recipe.d.ts +5 -5
- package/dist/ui/Select/Select.d.ts +45 -45
- package/dist/ui/Select/select.recipe.d.ts +3 -3
- package/dist/ui/Table/Table.d.ts +21 -21
- package/dist/ui/Table/table.anatomy.d.ts +1 -1
- package/dist/ui/Table/table.recipe.d.ts +3 -3
- package/dist/ui/Tabs/Tabs.d.ts +15 -15
- package/dist/ui/Tabs/tabs.recipe.d.ts +3 -3
- package/dist/ui/Tooltip/Tooltip.d.ts +30 -30
- package/dist/ui/Tooltip/tooltip.recipe.d.ts +5 -5
- package/package.json +1 -1
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/AiOGCashDeposit/AiOGCashDeposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/AiOGrabPayDeposit/AiOGrabPayDeposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/AiOPalawanPayDeposit/AiOPalawanPayDeposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/AiOPayMayaDeposit/AiOPayMayaDeposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/AvailablePromos.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/AvailablePromos.js +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/Deposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/Deposit.js +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/GCashDeposit/GCashDeposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/GCashWebpayDeposit/GCashWebpayDeposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/LibanganDeposit/LibanganDeposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/MayaAppDeposit/MayaAppDeposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/MayaAppDeposit/MayaAppDeposit.js +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/MayaDeposit/MayaDeposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/MayaWebpayDeposit/MayaWebpayDeposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/OnlineBankDeposit/OnlineBankDeposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/OnlineBankDeposit/OnlineBankDeposit.js +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/OnlineBankDeposit/OnlineBankDepositAlert.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/OnlineBankDeposit/OnlineBankDepositAlert.js +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/OnlineBankDeposit/OnlineBankDepositContext.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/OnlineBankDeposit/OnlineBankDepositContext.js +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/OnlineBankDeposit/OnlineBankDepositDetails.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/OnlineBankDeposit/OnlineBankDepositDetails.js +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/OnlineBankDeposit/OnlineBankDepositForm.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/OnlineBankDeposit/OnlineBankDepositForm.js +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/OnlineBankDeposit/useOnlineBankDeposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/OnlineBankDeposit/useOnlineBankDeposit.js +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/PisoPayDeposit/PisoPayDeposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/QRPHDeposit/QRPHDeposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/QRPHDeposit/QRPHDeposit.js +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/QRPHDeposit/QRPHDepositAlert.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/QRPHDeposit/QRPHDepositAlert.js +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/QRPHDeposit/QRPHDepositContext.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/QRPHDeposit/QRPHDepositContext.js +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/QRPHDeposit/QRPHDepositDetails.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/QRPHDeposit/QRPHDepositDetails.js +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/QRPHDeposit/QRPHDepositForm.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/QRPHDeposit/QRPHDepositForm.js +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/QRPHDeposit/QRPHQRCode.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/QRPHDeposit/QRPHQRCode.js +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/QRPHDeposit/useQRPHDeposit.d.ts +0 -0
- /package/dist/components/DepositWithdrawal/{Deposit__next → Deposit__legacy}/QRPHDeposit/useQRPHDeposit.js +0 -0
|
@@ -4,10 +4,12 @@ import Link from 'next/link';
|
|
|
4
4
|
import { useEffect, useState } from 'react';
|
|
5
5
|
import { Controller, useForm } from 'react-hook-form';
|
|
6
6
|
import invariant from 'tiny-invariant';
|
|
7
|
+
import { useBoolean } from 'usehooks-ts';
|
|
7
8
|
import { z } from 'zod';
|
|
8
9
|
import { useShallow } from 'zustand/shallow';
|
|
9
10
|
import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
|
|
10
11
|
import { useCreateMayaWebpayDepositMutation } from '../../../../client/hooks/useCreateMayaWebpayDepositMutation.js';
|
|
12
|
+
import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
|
|
11
13
|
import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
|
|
12
14
|
import { useDisclosure } from '../../../../client/hooks/useDisclosure.js';
|
|
13
15
|
import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
|
|
@@ -16,6 +18,7 @@ import { usePaymentSettingsQuery } from '../../../../client/hooks/usePaymentSett
|
|
|
16
18
|
import { AlertCircleIcon } from '../../../../icons/AlertCircleIcon.js';
|
|
17
19
|
import { ChevronDownIcon } from '../../../../icons/ChevronDownIcon.js';
|
|
18
20
|
import { ChevronUpIcon } from '../../../../icons/ChevronUpIcon.js';
|
|
21
|
+
import { RefreshCcw01Icon } from '../../../../icons/RefreshCcw01Icon.js';
|
|
19
22
|
import { SpinnerIcon } from '../../../../icons/SpinnerIcon.js';
|
|
20
23
|
import { XIcon } from '../../../../icons/XIcon.js';
|
|
21
24
|
import { AlertDialog } from '../../../../ui/AlertDialog/index.js';
|
|
@@ -29,7 +32,13 @@ import { useDepositWithdrawalPropsContext } from '../../DepositWithdrawalContext
|
|
|
29
32
|
import { AvailablePromos } from '../AvailablePromos.js';
|
|
30
33
|
export function MayaWebpayDeposit() {
|
|
31
34
|
const depositWithdrawalProps = useDepositWithdrawalPropsContext();
|
|
32
|
-
const disclosure = useDisclosure(
|
|
35
|
+
const disclosure = useDisclosure({
|
|
36
|
+
onOpenChange(open) {
|
|
37
|
+
if (!open) {
|
|
38
|
+
form.reset();
|
|
39
|
+
}
|
|
40
|
+
},
|
|
41
|
+
});
|
|
33
42
|
const globalStore = useGlobalStore(useShallow((ctx) => ({
|
|
34
43
|
depositWithdrawal: ctx.depositWithdrawal,
|
|
35
44
|
kycVerificationStatus: ctx.kycVerificationStatus,
|
|
@@ -51,6 +60,26 @@ export function MayaWebpayDeposit() {
|
|
|
51
60
|
setStatus('failed');
|
|
52
61
|
},
|
|
53
62
|
});
|
|
63
|
+
const warn = useBoolean();
|
|
64
|
+
const depositQuery = useDepositQuery(createDepositMutation.data?.id, {
|
|
65
|
+
enabled: !warn.value && status === 'success',
|
|
66
|
+
refetchInterval: (ctx) => ctx.state.data?.status === 'CONFIRMED' ||
|
|
67
|
+
ctx.state.data?.status === 'REJECTED' ||
|
|
68
|
+
ctx.state.data?.status === 'CANCELLED'
|
|
69
|
+
? false
|
|
70
|
+
: 1000,
|
|
71
|
+
});
|
|
72
|
+
useEffect(() => {
|
|
73
|
+
if (depositQuery.data?.status === 'CONFIRMED') {
|
|
74
|
+
setStatus('confirmed');
|
|
75
|
+
return;
|
|
76
|
+
}
|
|
77
|
+
if (depositQuery.data?.status === 'REJECTED' ||
|
|
78
|
+
depositQuery.data?.status === 'CANCELLED') {
|
|
79
|
+
setStatus('failed');
|
|
80
|
+
return;
|
|
81
|
+
}
|
|
82
|
+
}, [depositQuery.data?.status]);
|
|
54
83
|
const depositsCountQuery = useDepositsCountQuery();
|
|
55
84
|
const depositsCount = depositsCountQuery.data ?? 0;
|
|
56
85
|
const paymentSettingsQuery = usePaymentSettingsQuery();
|
|
@@ -154,13 +183,29 @@ export function MayaWebpayDeposit() {
|
|
|
154
183
|
globalStore.depositWithdrawal.setPromo(null);
|
|
155
184
|
}, 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) => {
|
|
156
185
|
disclosure.setOpen(details.open);
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
},
|
|
162
|
-
|
|
163
|
-
|
|
186
|
+
}, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, onExitComplete: () => {
|
|
187
|
+
setStatus('waiting');
|
|
188
|
+
form.reset();
|
|
189
|
+
warn.setFalse();
|
|
190
|
+
}, 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.Context, { children: (api) => (_jsx("button", { type: "button", className: "absolute top-2.5 right-2.5 flex icon:size-6 size-11 items-center justify-center text-text-quinary", onClick: () => {
|
|
191
|
+
if (status === 'success' && !warn.value) {
|
|
192
|
+
warn.setTrue();
|
|
193
|
+
}
|
|
194
|
+
else {
|
|
164
195
|
api.setOpen(false);
|
|
165
|
-
}
|
|
196
|
+
}
|
|
197
|
+
}, children: _jsx(XIcon, {}) })) }), _jsxs(AlertDialog.Header, { children: [status === 'processing' && (_jsx(SpinnerIcon, { className: "size-12 text-text-brand-primary-600" })), status === 'success' && !warn.value && (_jsx("div", { className: "flex size-12 items-center justify-center rounded-full bg-bg-brand-secondary text-text-featured-icon-light-brand", children: _jsx(RefreshCcw01Icon, {}) })), status === 'success' && warn.value && (_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, {}) })), status === 'confirmed' && (_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' &&
|
|
198
|
+
!warn.value &&
|
|
199
|
+
'Didn’t see the payment window?', status === 'success' && warn.value && (_jsx(_Fragment, { children: "Are you sure you want to close this\u00A0window?" })), status === 'confirmed' && 'Deposit Successful', status === 'failed' && 'Deposit Failed'] }), _jsxs(AlertDialog.Description, { children: [status === 'processing' &&
|
|
200
|
+
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
201
|
+
!warn.value &&
|
|
202
|
+
'Sometimes the payment pop up doesn’t appear right away. Don’t worry, just click the button below to reopen it and continue your deposit.', status === 'success' &&
|
|
203
|
+
warn.value &&
|
|
204
|
+
'Closing this window might cancel your current deposit. Do you want to continue?', status === 'confirmed' &&
|
|
205
|
+
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
206
|
+
'Something went wrong while processing your deposit. Please try again or contact support.'] })] }), (status === 'failed' ||
|
|
207
|
+
status === 'success' ||
|
|
208
|
+
status === 'confirmed') && (_jsxs(AlertDialog.Footer, { children: [status === 'success' && !warn.value && (_jsx(Button, { asChild: true, children: _jsx("a", { href: createDepositMutation.data?.checkoutUrl ?? '', target: "_blank", rel: "noopener noreferrer", children: "Try Again" }) })), status === 'success' && warn.value && (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", onClick: () => {
|
|
209
|
+
warn.setFalse();
|
|
210
|
+
}, children: "Go back" }), _jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => api.setOpen(false), children: "Continue" })) })] })), status !== 'success' && (_jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => api.setOpen(false), children: "Ok" })) }))] }))] }) })] }) })] }));
|
|
166
211
|
}
|
|
@@ -5,16 +5,19 @@ import Link from 'next/link';
|
|
|
5
5
|
import { useEffect, useState } from 'react';
|
|
6
6
|
import { Controller, useForm } from 'react-hook-form';
|
|
7
7
|
import invariant from 'tiny-invariant';
|
|
8
|
+
import { useBoolean } from 'usehooks-ts';
|
|
8
9
|
import { z } from 'zod';
|
|
9
10
|
import { useShallow } from 'zustand/shallow';
|
|
10
11
|
import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
|
|
11
12
|
import { useCreatePisoPayDepositMutation } from '../../../../client/hooks/useCreatePisoPayDepositMutation.js';
|
|
13
|
+
import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
|
|
12
14
|
import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
|
|
13
15
|
import { useDisclosure } from '../../../../client/hooks/useDisclosure.js';
|
|
14
16
|
import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
|
|
15
17
|
import { useMemberVerificationQuery } from '../../../../client/hooks/useMemberVerificationQuery.js';
|
|
16
18
|
import { usePaymentSettingsQuery } from '../../../../client/hooks/usePaymentSettingsQuery.js';
|
|
17
19
|
import { AlertCircleIcon } from '../../../../icons/AlertCircleIcon.js';
|
|
20
|
+
import { RefreshCcw01Icon } from '../../../../icons/RefreshCcw01Icon.js';
|
|
18
21
|
import { SpinnerIcon } from '../../../../icons/SpinnerIcon.js';
|
|
19
22
|
import { XIcon } from '../../../../icons/XIcon.js';
|
|
20
23
|
import { ObjectType } from '../../../../services/ObjectType.js';
|
|
@@ -27,11 +30,16 @@ import { parseDecimal } from '../../../../utils/parseDecimal.js';
|
|
|
27
30
|
import { getDepositsCountQueryKey } from '../../../../utils/queryKeys.js';
|
|
28
31
|
import { AmountChoices } from '../../AmountChoices.js';
|
|
29
32
|
import { useDepositWithdrawalPropsContext } from '../../DepositWithdrawalContext.js';
|
|
30
|
-
import { explainError } from '../../utils.js';
|
|
31
33
|
import { AvailablePromos } from '../AvailablePromos.js';
|
|
32
34
|
export function PisoPayDeposit() {
|
|
33
35
|
const depositWithdrawalProps = useDepositWithdrawalPropsContext();
|
|
34
|
-
const disclosure = useDisclosure(
|
|
36
|
+
const disclosure = useDisclosure({
|
|
37
|
+
onOpenChange(open) {
|
|
38
|
+
if (!open) {
|
|
39
|
+
form.reset();
|
|
40
|
+
}
|
|
41
|
+
},
|
|
42
|
+
});
|
|
35
43
|
const globalStore = useGlobalStore(useShallow((ctx) => ({
|
|
36
44
|
depositWithdrawal: ctx.depositWithdrawal,
|
|
37
45
|
kycVerificationStatus: ctx.kycVerificationStatus,
|
|
@@ -55,6 +63,26 @@ export function PisoPayDeposit() {
|
|
|
55
63
|
setStatus('failed');
|
|
56
64
|
},
|
|
57
65
|
});
|
|
66
|
+
const warn = useBoolean();
|
|
67
|
+
const depositQuery = useDepositQuery(createDepositMutation.data?.id, {
|
|
68
|
+
enabled: !warn.value && status === 'success',
|
|
69
|
+
refetchInterval: (ctx) => ctx.state.data?.status === 'CONFIRMED' ||
|
|
70
|
+
ctx.state.data?.status === 'REJECTED' ||
|
|
71
|
+
ctx.state.data?.status === 'CANCELLED'
|
|
72
|
+
? false
|
|
73
|
+
: 1000,
|
|
74
|
+
});
|
|
75
|
+
useEffect(() => {
|
|
76
|
+
if (depositQuery.data?.status === 'CONFIRMED') {
|
|
77
|
+
setStatus('confirmed');
|
|
78
|
+
return;
|
|
79
|
+
}
|
|
80
|
+
if (depositQuery.data?.status === 'REJECTED' ||
|
|
81
|
+
depositQuery.data?.status === 'CANCELLED') {
|
|
82
|
+
setStatus('failed');
|
|
83
|
+
return;
|
|
84
|
+
}
|
|
85
|
+
}, [depositQuery.data?.status]);
|
|
58
86
|
const depositsCountQuery = useDepositsCountQuery();
|
|
59
87
|
const depositsCount = depositsCountQuery.data ?? 0;
|
|
60
88
|
const paymentSettingsQuery = usePaymentSettingsQuery();
|
|
@@ -168,13 +196,29 @@ export function PisoPayDeposit() {
|
|
|
168
196
|
globalStore.depositWithdrawal.setPromo(null);
|
|
169
197
|
}, 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) => {
|
|
170
198
|
disclosure.setOpen(details.open);
|
|
171
|
-
|
|
172
|
-
|
|
173
|
-
|
|
174
|
-
|
|
175
|
-
},
|
|
176
|
-
|
|
177
|
-
|
|
199
|
+
}, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, onExitComplete: () => {
|
|
200
|
+
setStatus('waiting');
|
|
201
|
+
form.reset();
|
|
202
|
+
warn.setFalse();
|
|
203
|
+
}, 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.Context, { children: (api) => (_jsx("button", { type: "button", className: "absolute top-2.5 right-2.5 flex icon:size-6 size-11 items-center justify-center text-text-quinary", onClick: () => {
|
|
204
|
+
if (status === 'success' && !warn.value) {
|
|
205
|
+
warn.setTrue();
|
|
206
|
+
}
|
|
207
|
+
else {
|
|
178
208
|
api.setOpen(false);
|
|
179
|
-
}
|
|
209
|
+
}
|
|
210
|
+
}, children: _jsx(XIcon, {}) })) }), _jsxs(AlertDialog.Header, { children: [status === 'processing' && (_jsx(SpinnerIcon, { className: "size-12 text-text-brand-primary-600" })), status === 'success' && !warn.value && (_jsx("div", { className: "flex size-12 items-center justify-center rounded-full bg-bg-brand-secondary text-text-featured-icon-light-brand", children: _jsx(RefreshCcw01Icon, {}) })), status === 'success' && warn.value && (_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, {}) })), status === 'confirmed' && (_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' &&
|
|
211
|
+
!warn.value &&
|
|
212
|
+
'Didn’t see the payment window?', status === 'success' && warn.value && (_jsx(_Fragment, { children: "Are you sure you want to close this\u00A0window?" })), status === 'confirmed' && 'Deposit Successful', status === 'failed' && 'Deposit Failed'] }), _jsxs(AlertDialog.Description, { children: [status === 'processing' &&
|
|
213
|
+
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
214
|
+
!warn.value &&
|
|
215
|
+
'Sometimes the payment pop up doesn’t appear right away. Don’t worry, just click the button below to reopen it and continue your deposit.', status === 'success' &&
|
|
216
|
+
warn.value &&
|
|
217
|
+
'Closing this window might cancel your current deposit. Do you want to continue?', status === 'confirmed' &&
|
|
218
|
+
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
219
|
+
'Something went wrong while processing your deposit. Please try again or contact support.'] })] }), (status === 'failed' ||
|
|
220
|
+
status === 'success' ||
|
|
221
|
+
status === 'confirmed') && (_jsxs(AlertDialog.Footer, { children: [status === 'success' && !warn.value && (_jsx(Button, { asChild: true, children: _jsx("a", { href: createDepositMutation.data?.checkoutUrl ?? '', target: "_blank", rel: "noopener noreferrer", children: "Try Again" }) })), status === 'success' && warn.value && (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", onClick: () => {
|
|
222
|
+
warn.setFalse();
|
|
223
|
+
}, children: "Go back" }), _jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => api.setOpen(false), children: "Continue" })) })] })), status !== 'success' && (_jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => api.setOpen(false), children: "Ok" })) }))] }))] }) })] }) })] }));
|
|
180
224
|
}
|
|
@@ -4,7 +4,6 @@ import { useEffect } from 'react';
|
|
|
4
4
|
import { z } from 'zod';
|
|
5
5
|
import { useShallow } from 'zustand/shallow';
|
|
6
6
|
import { useBonusesQuery } from '../../client/hooks/useBonusesQuery.js';
|
|
7
|
-
import { useFeatureFlag } from '../../client/hooks/useFeatureFlag.js';
|
|
8
7
|
import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
|
|
9
8
|
import { useLocaleInfo } from '../../client/hooks/useLocaleInfo.js';
|
|
10
9
|
import { useWalletQuery } from '../../client/hooks/useWalletQuery.js';
|
|
@@ -16,12 +15,10 @@ import { Portal } from '../../ui/Portal/index.js';
|
|
|
16
15
|
import { Tabs } from '../../ui/Tabs/index.js';
|
|
17
16
|
import { formatNumber } from '../../utils/formatNumber.js';
|
|
18
17
|
import { Deposit } from './Deposit/Deposit.js';
|
|
19
|
-
import { Deposit as Deposit__next } from './Deposit__next/Deposit.js';
|
|
20
18
|
import { DepositWithdrawalPropsProvider } from './DepositWithdrawalContext.js';
|
|
21
|
-
import HasPendingBonuses from './HasPendingBonuses.js';
|
|
19
|
+
import { HasPendingBonuses } from './HasPendingBonuses.js';
|
|
22
20
|
import { Withdrawal } from './Withdrawal/Withdrawal.js';
|
|
23
21
|
export function DepositWithdrawal(props) {
|
|
24
|
-
const featureFlag = useFeatureFlag();
|
|
25
22
|
const { hasPrivacyPolicyAndTermsOfUse = true, ...restProps } = props;
|
|
26
23
|
const mergedProps = {
|
|
27
24
|
...restProps,
|
|
@@ -60,5 +57,5 @@ export function DepositWithdrawal(props) {
|
|
|
60
57
|
minDecimalPlaces: 2,
|
|
61
58
|
}) }), _jsxs(Tabs.Root, { value: globalStore.depositWithdrawal.tab, onValueChange: (details) => {
|
|
62
59
|
globalStore.depositWithdrawal.setTab(z.enum(['DEPOSIT', 'WITHDRAWAL']).parse(details.value));
|
|
63
|
-
}, lazyMount: true, unmountOnExit: true, className: "mt-3xl space-y-4xl", children: [_jsxs(Tabs.List, { className: "w-full", children: [_jsx(Tabs.Trigger, { value: "DEPOSIT", className: "grow", children: "Deposit" }), _jsx(Tabs.Trigger, { value: "WITHDRAWAL", className: "grow", children: "Withdrawal" }), _jsx(Tabs.Indicator, {})] }), _jsx(Tabs.Content, { value: "DEPOSIT", className: "space-y-3xl", children:
|
|
60
|
+
}, lazyMount: true, unmountOnExit: true, className: "mt-3xl space-y-4xl", children: [_jsxs(Tabs.List, { className: "w-full", children: [_jsx(Tabs.Trigger, { value: "DEPOSIT", className: "grow", children: "Deposit" }), _jsx(Tabs.Trigger, { value: "WITHDRAWAL", className: "grow", children: "Withdrawal" }), _jsx(Tabs.Indicator, {})] }), _jsx(Tabs.Content, { value: "DEPOSIT", className: "space-y-3xl", children: _jsx(Deposit, {}) }), _jsx(Tabs.Content, { value: "WITHDRAWAL", className: "space-y-3xl", children: _jsx(Withdrawal, {}) })] })] })] }) })] }) }) }), _jsx(HasPendingBonuses, {})] }));
|
|
64
61
|
}
|
|
@@ -4,12 +4,10 @@ import Link from 'next/link';
|
|
|
4
4
|
import { useEffect, useState } from 'react';
|
|
5
5
|
import { Controller, useForm } from 'react-hook-form';
|
|
6
6
|
import invariant from 'tiny-invariant';
|
|
7
|
-
import { useBoolean } from 'usehooks-ts';
|
|
8
7
|
import { z } from 'zod';
|
|
9
8
|
import { useShallow } from 'zustand/shallow';
|
|
10
9
|
import { useCreateAiOGCashDepositMutation } from '../../../../client/hooks/useAiOGCashDepositMutation.js';
|
|
11
10
|
import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
|
|
12
|
-
import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
|
|
13
11
|
import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
|
|
14
12
|
import { useDisclosure } from '../../../../client/hooks/useDisclosure.js';
|
|
15
13
|
import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
|
|
@@ -18,7 +16,6 @@ import { usePaymentSettingsQuery } from '../../../../client/hooks/usePaymentSett
|
|
|
18
16
|
import { AlertCircleIcon } from '../../../../icons/AlertCircleIcon.js';
|
|
19
17
|
import { ChevronDownIcon } from '../../../../icons/ChevronDownIcon.js';
|
|
20
18
|
import { ChevronUpIcon } from '../../../../icons/ChevronUpIcon.js';
|
|
21
|
-
import { RefreshCcw01Icon } from '../../../../icons/RefreshCcw01Icon.js';
|
|
22
19
|
import { SpinnerIcon } from '../../../../icons/SpinnerIcon.js';
|
|
23
20
|
import { XIcon } from '../../../../icons/XIcon.js';
|
|
24
21
|
import { AlertDialog } from '../../../../ui/AlertDialog/index.js';
|
|
@@ -31,16 +28,11 @@ import { parseDecimal } from '../../../../utils/parseDecimal.js';
|
|
|
31
28
|
import { getDepositsCountQueryKey } from '../../../../utils/queryKeys.js';
|
|
32
29
|
import { AmountChoices } from '../../AmountChoices.js';
|
|
33
30
|
import { useDepositWithdrawalPropsContext } from '../../DepositWithdrawalContext.js';
|
|
31
|
+
import { explainError } from '../../utils.js';
|
|
34
32
|
import { AvailablePromos } from '../AvailablePromos.js';
|
|
35
33
|
export function AiOGCashDeposit() {
|
|
36
34
|
const depositWithdrawalProps = useDepositWithdrawalPropsContext();
|
|
37
|
-
const disclosure = useDisclosure(
|
|
38
|
-
onOpenChange(open) {
|
|
39
|
-
if (!open) {
|
|
40
|
-
form.reset();
|
|
41
|
-
}
|
|
42
|
-
},
|
|
43
|
-
});
|
|
35
|
+
const disclosure = useDisclosure();
|
|
44
36
|
const globalStore = useGlobalStore(useShallow((ctx) => ({
|
|
45
37
|
depositWithdrawal: ctx.depositWithdrawal,
|
|
46
38
|
kycVerificationStatus: ctx.kycVerificationStatus,
|
|
@@ -66,26 +58,6 @@ export function AiOGCashDeposit() {
|
|
|
66
58
|
setStatus('failed');
|
|
67
59
|
},
|
|
68
60
|
});
|
|
69
|
-
const warn = useBoolean();
|
|
70
|
-
const depositQuery = useDepositQuery(createDepositMutation.data?.id, {
|
|
71
|
-
enabled: !warn.value && status === 'success',
|
|
72
|
-
refetchInterval: (ctx) => ctx.state.data?.status === 'CONFIRMED' ||
|
|
73
|
-
ctx.state.data?.status === 'REJECTED' ||
|
|
74
|
-
ctx.state.data?.status === 'CANCELLED'
|
|
75
|
-
? false
|
|
76
|
-
: 1000,
|
|
77
|
-
});
|
|
78
|
-
useEffect(() => {
|
|
79
|
-
if (depositQuery.data?.status === 'CONFIRMED') {
|
|
80
|
-
setStatus('confirmed');
|
|
81
|
-
return;
|
|
82
|
-
}
|
|
83
|
-
if (depositQuery.data?.status === 'REJECTED' ||
|
|
84
|
-
depositQuery.data?.status === 'CANCELLED') {
|
|
85
|
-
setStatus('failed');
|
|
86
|
-
return;
|
|
87
|
-
}
|
|
88
|
-
}, [depositQuery.data?.status]);
|
|
89
61
|
const depositsCountQuery = useDepositsCountQuery();
|
|
90
62
|
const depositsCount = depositsCountQuery.data ?? 0;
|
|
91
63
|
const paymentSettingsQuery = usePaymentSettingsQuery();
|
|
@@ -189,29 +161,13 @@ export function AiOGCashDeposit() {
|
|
|
189
161
|
globalStore.depositWithdrawal.setPromo(null);
|
|
190
162
|
}, 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) => {
|
|
191
163
|
disclosure.setOpen(details.open);
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
}, 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.
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
}
|
|
200
|
-
else {
|
|
164
|
+
if (!details.open) {
|
|
165
|
+
setStatus('waiting');
|
|
166
|
+
form.reset();
|
|
167
|
+
}
|
|
168
|
+
}, 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' &&
|
|
169
|
+
"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' &&
|
|
170
|
+
explainError(createDepositMutation?.error?.name)] })] }), (status === 'failed' || status === 'success') && (_jsx(AlertDialog.Footer, { children: _jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => {
|
|
201
171
|
api.setOpen(false);
|
|
202
|
-
}
|
|
203
|
-
}, children: _jsx(XIcon, {}) })) }), _jsxs(AlertDialog.Header, { children: [status === 'processing' && (_jsx(SpinnerIcon, { className: "size-12 text-text-brand-primary-600" })), status === 'success' && !warn.value && (_jsx("div", { className: "flex size-12 items-center justify-center rounded-full bg-bg-brand-secondary text-text-featured-icon-light-brand", children: _jsx(RefreshCcw01Icon, {}) })), status === 'success' && warn.value && (_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, {}) })), status === 'confirmed' && (_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' &&
|
|
204
|
-
!warn.value &&
|
|
205
|
-
'Didn’t see the payment window?', status === 'success' && warn.value && (_jsx(_Fragment, { children: "Are you sure you want to close this\u00A0window?" })), status === 'confirmed' && 'Deposit Successful', status === 'failed' && 'Deposit Failed'] }), _jsxs(AlertDialog.Description, { children: [status === 'processing' &&
|
|
206
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
207
|
-
!warn.value &&
|
|
208
|
-
'Sometimes the payment pop up doesn’t appear right away. Don’t worry, just click the button below to reopen it and continue your deposit.', status === 'success' &&
|
|
209
|
-
warn.value &&
|
|
210
|
-
'Closing this window might cancel your current deposit. Do you want to continue?', status === 'confirmed' &&
|
|
211
|
-
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
212
|
-
'Something went wrong while processing your deposit. Please try again or contact support.'] })] }), (status === 'failed' ||
|
|
213
|
-
status === 'success' ||
|
|
214
|
-
status === 'confirmed') && (_jsxs(AlertDialog.Footer, { children: [status === 'success' && !warn.value && (_jsx(Button, { asChild: true, children: _jsx("a", { href: createDepositMutation.data?.checkoutUrl ?? '', target: "_blank", rel: "noopener noreferrer", children: "Try Again" }) })), status === 'success' && warn.value && (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", onClick: () => {
|
|
215
|
-
warn.setFalse();
|
|
216
|
-
}, children: "Go back" }), _jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => api.setOpen(false), children: "Continue" })) })] })), status !== 'success' && (_jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => api.setOpen(false), children: "Ok" })) }))] }))] }) })] }) })] }));
|
|
172
|
+
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
|
217
173
|
}
|
|
@@ -4,12 +4,10 @@ import Link from 'next/link';
|
|
|
4
4
|
import { useEffect, useState } from 'react';
|
|
5
5
|
import { Controller, useForm } from 'react-hook-form';
|
|
6
6
|
import invariant from 'tiny-invariant';
|
|
7
|
-
import { useBoolean } from 'usehooks-ts';
|
|
8
7
|
import { z } from 'zod';
|
|
9
8
|
import { useShallow } from 'zustand/shallow';
|
|
10
9
|
import { useCreateAiOGrabPayDepositMutation } from '../../../../client/hooks/useAiOGrabPayDepositMutation.js';
|
|
11
10
|
import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
|
|
12
|
-
import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
|
|
13
11
|
import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
|
|
14
12
|
import { useDisclosure } from '../../../../client/hooks/useDisclosure.js';
|
|
15
13
|
import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
|
|
@@ -18,7 +16,6 @@ import { usePaymentSettingsQuery } from '../../../../client/hooks/usePaymentSett
|
|
|
18
16
|
import { AlertCircleIcon } from '../../../../icons/AlertCircleIcon.js';
|
|
19
17
|
import { ChevronDownIcon } from '../../../../icons/ChevronDownIcon.js';
|
|
20
18
|
import { ChevronUpIcon } from '../../../../icons/ChevronUpIcon.js';
|
|
21
|
-
import { RefreshCcw01Icon } from '../../../../icons/RefreshCcw01Icon.js';
|
|
22
19
|
import { SpinnerIcon } from '../../../../icons/SpinnerIcon.js';
|
|
23
20
|
import { XIcon } from '../../../../icons/XIcon.js';
|
|
24
21
|
import { AlertDialog } from '../../../../ui/AlertDialog/index.js';
|
|
@@ -31,16 +28,11 @@ import { parseDecimal } from '../../../../utils/parseDecimal.js';
|
|
|
31
28
|
import { getDepositsCountQueryKey } from '../../../../utils/queryKeys.js';
|
|
32
29
|
import { AmountChoices } from '../../AmountChoices.js';
|
|
33
30
|
import { useDepositWithdrawalPropsContext } from '../../DepositWithdrawalContext.js';
|
|
31
|
+
import { explainError } from '../../utils.js';
|
|
34
32
|
import { AvailablePromos } from '../AvailablePromos.js';
|
|
35
33
|
export function AiOGrabPayDeposit() {
|
|
36
34
|
const depositWithdrawalProps = useDepositWithdrawalPropsContext();
|
|
37
|
-
const disclosure = useDisclosure(
|
|
38
|
-
onOpenChange(open) {
|
|
39
|
-
if (!open) {
|
|
40
|
-
form.reset();
|
|
41
|
-
}
|
|
42
|
-
},
|
|
43
|
-
});
|
|
35
|
+
const disclosure = useDisclosure();
|
|
44
36
|
const globalStore = useGlobalStore(useShallow((ctx) => ({
|
|
45
37
|
depositWithdrawal: ctx.depositWithdrawal,
|
|
46
38
|
kycVerificationStatus: ctx.kycVerificationStatus,
|
|
@@ -64,26 +56,6 @@ export function AiOGrabPayDeposit() {
|
|
|
64
56
|
setStatus('failed');
|
|
65
57
|
},
|
|
66
58
|
});
|
|
67
|
-
const warn = useBoolean();
|
|
68
|
-
const depositQuery = useDepositQuery(createDepositMutation.data?.id, {
|
|
69
|
-
enabled: !warn.value && status === 'success',
|
|
70
|
-
refetchInterval: (ctx) => ctx.state.data?.status === 'CONFIRMED' ||
|
|
71
|
-
ctx.state.data?.status === 'REJECTED' ||
|
|
72
|
-
ctx.state.data?.status === 'CANCELLED'
|
|
73
|
-
? false
|
|
74
|
-
: 1000,
|
|
75
|
-
});
|
|
76
|
-
useEffect(() => {
|
|
77
|
-
if (depositQuery.data?.status === 'CONFIRMED') {
|
|
78
|
-
setStatus('confirmed');
|
|
79
|
-
return;
|
|
80
|
-
}
|
|
81
|
-
if (depositQuery.data?.status === 'REJECTED' ||
|
|
82
|
-
depositQuery.data?.status === 'CANCELLED') {
|
|
83
|
-
setStatus('failed');
|
|
84
|
-
return;
|
|
85
|
-
}
|
|
86
|
-
}, [depositQuery.data?.status]);
|
|
87
59
|
const depositsCountQuery = useDepositsCountQuery();
|
|
88
60
|
const depositsCount = depositsCountQuery.data ?? 0;
|
|
89
61
|
const paymentSettingsQuery = usePaymentSettingsQuery();
|
|
@@ -187,29 +159,13 @@ export function AiOGrabPayDeposit() {
|
|
|
187
159
|
globalStore.depositWithdrawal.setPromo(null);
|
|
188
160
|
}, 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) => {
|
|
189
161
|
disclosure.setOpen(details.open);
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
}, 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.
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
}
|
|
198
|
-
else {
|
|
162
|
+
if (!details.open) {
|
|
163
|
+
setStatus('waiting');
|
|
164
|
+
form.reset();
|
|
165
|
+
}
|
|
166
|
+
}, 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' &&
|
|
167
|
+
"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' &&
|
|
168
|
+
explainError(createDepositMutation?.error?.name)] })] }), (status === 'failed' || status === 'success') && (_jsx(AlertDialog.Footer, { children: _jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => {
|
|
199
169
|
api.setOpen(false);
|
|
200
|
-
}
|
|
201
|
-
}, children: _jsx(XIcon, {}) })) }), _jsxs(AlertDialog.Header, { children: [status === 'processing' && (_jsx(SpinnerIcon, { className: "size-12 text-text-brand-primary-600" })), status === 'success' && !warn.value && (_jsx("div", { className: "flex size-12 items-center justify-center rounded-full bg-bg-brand-secondary text-text-featured-icon-light-brand", children: _jsx(RefreshCcw01Icon, {}) })), status === 'success' && warn.value && (_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, {}) })), status === 'confirmed' && (_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' &&
|
|
202
|
-
!warn.value &&
|
|
203
|
-
'Didn’t see the payment window?', status === 'success' && warn.value && (_jsx(_Fragment, { children: "Are you sure you want to close this\u00A0window?" })), status === 'confirmed' && 'Deposit Successful', status === 'failed' && 'Deposit Failed'] }), _jsxs(AlertDialog.Description, { children: [status === 'processing' &&
|
|
204
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
205
|
-
!warn.value &&
|
|
206
|
-
'Sometimes the payment pop up doesn’t appear right away. Don’t worry, just click the button below to reopen it and continue your deposit.', status === 'success' &&
|
|
207
|
-
warn.value &&
|
|
208
|
-
'Closing this window might cancel your current deposit. Do you want to continue?', status === 'confirmed' &&
|
|
209
|
-
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
210
|
-
'Something went wrong while processing your deposit. Please try again or contact support.'] })] }), (status === 'failed' ||
|
|
211
|
-
status === 'success' ||
|
|
212
|
-
status === 'confirmed') && (_jsxs(AlertDialog.Footer, { children: [status === 'success' && !warn.value && (_jsx(Button, { asChild: true, children: _jsx("a", { href: createDepositMutation.data?.checkoutUrl ?? '', target: "_blank", rel: "noopener noreferrer", children: "Try Again" }) })), status === 'success' && warn.value && (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", onClick: () => {
|
|
213
|
-
warn.setFalse();
|
|
214
|
-
}, children: "Go back" }), _jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => api.setOpen(false), children: "Continue" })) })] })), status !== 'success' && (_jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => api.setOpen(false), children: "Ok" })) }))] }))] }) })] }) })] }));
|
|
170
|
+
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
|
215
171
|
}
|
|
@@ -4,12 +4,10 @@ import Link from 'next/link';
|
|
|
4
4
|
import { useEffect, useState } from 'react';
|
|
5
5
|
import { Controller, useForm } from 'react-hook-form';
|
|
6
6
|
import invariant from 'tiny-invariant';
|
|
7
|
-
import { useBoolean } from 'usehooks-ts';
|
|
8
7
|
import { z } from 'zod';
|
|
9
8
|
import { useShallow } from 'zustand/shallow';
|
|
10
9
|
import { useCreateAiOPalawanPayDepositMutation } from '../../../../client/hooks/useAiOPalawanPayDepositMutation.js';
|
|
11
10
|
import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
|
|
12
|
-
import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
|
|
13
11
|
import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
|
|
14
12
|
import { useDisclosure } from '../../../../client/hooks/useDisclosure.js';
|
|
15
13
|
import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
|
|
@@ -18,7 +16,6 @@ import { usePaymentSettingsQuery } from '../../../../client/hooks/usePaymentSett
|
|
|
18
16
|
import { AlertCircleIcon } from '../../../../icons/AlertCircleIcon.js';
|
|
19
17
|
import { ChevronDownIcon } from '../../../../icons/ChevronDownIcon.js';
|
|
20
18
|
import { ChevronUpIcon } from '../../../../icons/ChevronUpIcon.js';
|
|
21
|
-
import { RefreshCcw01Icon } from '../../../../icons/RefreshCcw01Icon.js';
|
|
22
19
|
import { SpinnerIcon } from '../../../../icons/SpinnerIcon.js';
|
|
23
20
|
import { XIcon } from '../../../../icons/XIcon.js';
|
|
24
21
|
import { AlertDialog } from '../../../../ui/AlertDialog/index.js';
|
|
@@ -31,16 +28,11 @@ import { parseDecimal } from '../../../../utils/parseDecimal.js';
|
|
|
31
28
|
import { getDepositsCountQueryKey } from '../../../../utils/queryKeys.js';
|
|
32
29
|
import { AmountChoices } from '../../AmountChoices.js';
|
|
33
30
|
import { useDepositWithdrawalPropsContext } from '../../DepositWithdrawalContext.js';
|
|
31
|
+
import { explainError } from '../../utils.js';
|
|
34
32
|
import { AvailablePromos } from '../AvailablePromos.js';
|
|
35
33
|
export function AiOPalawanPayDeposit() {
|
|
36
34
|
const depositWithdrawalProps = useDepositWithdrawalPropsContext();
|
|
37
|
-
const disclosure = useDisclosure(
|
|
38
|
-
onOpenChange(open) {
|
|
39
|
-
if (!open) {
|
|
40
|
-
form.reset();
|
|
41
|
-
}
|
|
42
|
-
},
|
|
43
|
-
});
|
|
35
|
+
const disclosure = useDisclosure();
|
|
44
36
|
const globalStore = useGlobalStore(useShallow((ctx) => ({
|
|
45
37
|
depositWithdrawal: ctx.depositWithdrawal,
|
|
46
38
|
kycVerificationStatus: ctx.kycVerificationStatus,
|
|
@@ -64,26 +56,6 @@ export function AiOPalawanPayDeposit() {
|
|
|
64
56
|
setStatus('failed');
|
|
65
57
|
},
|
|
66
58
|
});
|
|
67
|
-
const warn = useBoolean();
|
|
68
|
-
const depositQuery = useDepositQuery(createDepositMutation.data?.id, {
|
|
69
|
-
enabled: !warn.value && status === 'success',
|
|
70
|
-
refetchInterval: (ctx) => ctx.state.data?.status === 'CONFIRMED' ||
|
|
71
|
-
ctx.state.data?.status === 'REJECTED' ||
|
|
72
|
-
ctx.state.data?.status === 'CANCELLED'
|
|
73
|
-
? false
|
|
74
|
-
: 1000,
|
|
75
|
-
});
|
|
76
|
-
useEffect(() => {
|
|
77
|
-
if (depositQuery.data?.status === 'CONFIRMED') {
|
|
78
|
-
setStatus('confirmed');
|
|
79
|
-
return;
|
|
80
|
-
}
|
|
81
|
-
if (depositQuery.data?.status === 'REJECTED' ||
|
|
82
|
-
depositQuery.data?.status === 'CANCELLED') {
|
|
83
|
-
setStatus('failed');
|
|
84
|
-
return;
|
|
85
|
-
}
|
|
86
|
-
}, [depositQuery.data?.status]);
|
|
87
59
|
const depositsCountQuery = useDepositsCountQuery();
|
|
88
60
|
const depositsCount = depositsCountQuery.data ?? 0;
|
|
89
61
|
const paymentSettingsQuery = usePaymentSettingsQuery();
|
|
@@ -187,29 +159,13 @@ export function AiOPalawanPayDeposit() {
|
|
|
187
159
|
globalStore.depositWithdrawal.setPromo(null);
|
|
188
160
|
}, 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) => {
|
|
189
161
|
disclosure.setOpen(details.open);
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
}, 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.
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
}
|
|
198
|
-
else {
|
|
162
|
+
if (!details.open) {
|
|
163
|
+
setStatus('waiting');
|
|
164
|
+
form.reset();
|
|
165
|
+
}
|
|
166
|
+
}, 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' &&
|
|
167
|
+
"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' &&
|
|
168
|
+
explainError(createDepositMutation?.error?.name)] })] }), (status === 'failed' || status === 'success') && (_jsx(AlertDialog.Footer, { children: _jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => {
|
|
199
169
|
api.setOpen(false);
|
|
200
|
-
}
|
|
201
|
-
}, children: _jsx(XIcon, {}) })) }), _jsxs(AlertDialog.Header, { children: [status === 'processing' && (_jsx(SpinnerIcon, { className: "size-12 text-text-brand-primary-600" })), status === 'success' && !warn.value && (_jsx("div", { className: "flex size-12 items-center justify-center rounded-full bg-bg-brand-secondary text-text-featured-icon-light-brand", children: _jsx(RefreshCcw01Icon, {}) })), status === 'success' && warn.value && (_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, {}) })), status === 'confirmed' && (_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' &&
|
|
202
|
-
!warn.value &&
|
|
203
|
-
'Didn’t see the payment window?', status === 'success' && warn.value && (_jsx(_Fragment, { children: "Are you sure you want to close this\u00A0window?" })), status === 'confirmed' && 'Deposit Successful', status === 'failed' && 'Deposit Failed'] }), _jsxs(AlertDialog.Description, { children: [status === 'processing' &&
|
|
204
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
205
|
-
!warn.value &&
|
|
206
|
-
'Sometimes the payment pop up doesn’t appear right away. Don’t worry, just click the button below to reopen it and continue your deposit.', status === 'success' &&
|
|
207
|
-
warn.value &&
|
|
208
|
-
'Closing this window might cancel your current deposit. Do you want to continue?', status === 'confirmed' &&
|
|
209
|
-
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
210
|
-
'Something went wrong while processing your deposit. Please try again or contact support.'] })] }), (status === 'failed' ||
|
|
211
|
-
status === 'success' ||
|
|
212
|
-
status === 'confirmed') && (_jsxs(AlertDialog.Footer, { children: [status === 'success' && !warn.value && (_jsx(Button, { asChild: true, children: _jsx("a", { href: createDepositMutation.data?.checkoutUrl ?? '', target: "_blank", rel: "noopener noreferrer", children: "Try Again" }) })), status === 'success' && warn.value && (_jsxs(_Fragment, { children: [_jsx(Button, { variant: "outline", onClick: () => {
|
|
213
|
-
warn.setFalse();
|
|
214
|
-
}, children: "Go back" }), _jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => api.setOpen(false), children: "Continue" })) })] })), status !== 'success' && (_jsx(AlertDialog.Context, { children: (api) => (_jsx(Button, { onClick: () => api.setOpen(false), children: "Ok" })) }))] }))] }) })] }) })] }));
|
|
170
|
+
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
|
215
171
|
}
|