@opexa/portal-components 0.0.707 → 0.0.709
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/components/AccountInfo/GoogleDisconnect.d.ts +7 -0
- package/dist/components/AccountInfo/GoogleDisconnect.js +11 -0
- package/dist/components/DepositWithdrawal/Deposit/AiOGCashDeposit/AiOGCashDeposit.js +3 -4
- package/dist/components/DepositWithdrawal/Deposit/AiOGrabPayDeposit/AiOGrabPayDeposit.js +3 -4
- package/dist/components/DepositWithdrawal/Deposit/AiOPalawanPayDeposit/AiOPalawanPayDeposit.js +3 -4
- package/dist/components/DepositWithdrawal/Deposit/AiOPayMayaDeposit/AiOPayMayaDeposit.js +3 -4
- package/dist/components/DepositWithdrawal/Deposit/GCashDeposit/GCashDeposit.js +2 -3
- package/dist/components/DepositWithdrawal/Deposit/GCashWebpayDeposit/GCashWebpayDeposit.js +2 -3
- package/dist/components/DepositWithdrawal/Deposit/GCashWebpayDeposit /GCashWebpayDeposit .d.ts +1 -0
- package/dist/components/DepositWithdrawal/Deposit/GCashWebpayDeposit /GCashWebpayDeposit .js +191 -0
- package/dist/components/DepositWithdrawal/Deposit/LibanganDeposit/LibanganDeposit.js +2 -3
- package/dist/components/DepositWithdrawal/Deposit/MayaAppDeposit/MayaAppDeposit.js +2 -3
- package/dist/components/DepositWithdrawal/Deposit/MayaDeposit/MayaDeposit.js +2 -3
- package/dist/components/DepositWithdrawal/Deposit/PisoPayDeposit/PisoPayDeposit.js +2 -3
- package/dist/components/DigitainLauncher/Loading.d.ts +1 -0
- package/dist/components/DigitainLauncher/Loading.js +5 -0
- package/dist/components/Disclaimer/DisclaimerV2.js +22 -1
- package/dist/components/Disclaimer/useDisclaimer.d.ts +4 -1
- package/dist/components/Disclaimer/useDisclaimer.js +11 -11
- 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/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/PortalProvider/CXDTokenObserver.d.ts +1 -0
- package/dist/components/PortalProvider/CXDTokenObserver.js +30 -0
- package/dist/components/SignIn/MobileNumberSignIn.js +4 -0
- package/dist/components/SignIn/NameAndPasswordSignIn.js +7 -0
- package/dist/components/SignIn/SignIn.lazy.d.ts +1 -0
- package/dist/icons/LinkBrokenIcon.d.ts +2 -0
- package/dist/icons/LinkBrokenIcon.js +4 -0
- package/dist/images/responsible-gaming-yellow.png +0 -0
- package/dist/ui/AlertDialog/AlertDialog.d.ts +55 -55
- package/dist/ui/AlertDialog/alertDialog.recipe.d.ts +5 -5
- package/dist/ui/Badge/Badge.d.ts +12 -12
- package/dist/ui/Badge/badge.anatomy.d.ts +1 -1
- package/dist/ui/Badge/badge.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/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/Field/Field.d.ts +21 -21
- package/dist/ui/Field/field.recipe.d.ts +3 -3
- package/dist/ui/NumberInput/NumberInput.d.ts +24 -24
- package/dist/ui/NumberInput/numberInput.recipe.d.ts +3 -3
- package/dist/ui/PasswordInput/PasswordInput.d.ts +18 -18
- package/dist/ui/PasswordInput/passwordInput.recipe.d.ts +3 -3
- package/dist/ui/PinInput/PinInput.d.ts +12 -12
- package/dist/ui/PinInput/pinInput.recipe.d.ts +3 -3
- package/dist/ui/Progress/Progress.d.ts +27 -27
- package/dist/ui/Progress/progress.recipe.d.ts +3 -3
- package/dist/ui/SegmentGroup/SegmentGroup.d.ts +18 -18
- package/dist/ui/SegmentGroup/segmentGroup.recipe.d.ts +3 -3
- package/dist/ui/Select/Select.d.ts +45 -45
- package/dist/ui/Select/select.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/package.json +1 -1
|
@@ -0,0 +1,7 @@
|
|
|
1
|
+
import { type UseDisclosureReturn } from '../../client/hooks/useDisclosure';
|
|
2
|
+
interface GoogleDisconnectProps {
|
|
3
|
+
onConfirmAction?: (ctx: UseDisclosureReturn) => React.ReactNode;
|
|
4
|
+
children?: (ctx: UseDisclosureReturn) => React.ReactNode;
|
|
5
|
+
}
|
|
6
|
+
export declare function GoogleDisconnect(props: GoogleDisconnectProps): import("react/jsx-runtime").JSX.Element;
|
|
7
|
+
export {};
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
3
|
+
import { useDisclosure, } from '../../client/hooks/useDisclosure.js';
|
|
4
|
+
import { LinkBrokenIcon } from '../../icons/LinkBrokenIcon.js';
|
|
5
|
+
import { XIcon } from '../../icons/XIcon.js';
|
|
6
|
+
import { Dialog } from '../../ui/Dialog/index.js';
|
|
7
|
+
import { Portal } from '../../ui/Portal/index.js';
|
|
8
|
+
export function GoogleDisconnect(props) {
|
|
9
|
+
const disclosure = useDisclosure();
|
|
10
|
+
return (_jsxs(_Fragment, { children: [props.children?.(disclosure), _jsx(Dialog.Root, { lazyMount: true, unmountOnExit: true, open: disclosure.open, onOpenChange: (details) => disclosure.setOpen(details.open), closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+1)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+2)] flex items-center justify-center", children: _jsxs(Dialog.Content, { className: "mx-auto min-h-auto max-w-[25rem] overflow-y-auto rounded-xl p-6", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs("div", { className: "flex flex-col ", children: [_jsx("div", { className: "mx-auto flex size-12 items-center justify-center rounded-full bg-bg-brand-secondary text-text-brand", children: _jsx(LinkBrokenIcon, {}) }), _jsx("h2", { className: "mb-1 text-center font-semibold text-lg xl:mt-xl", children: "Disconnect Google Account" }), _jsx("p", { className: "text-center text-sm text-text-tertiary-600 leading-2xl", children: "Are you sure you want to disconnect your Google account? This may affect your ability to log in or sync data." })] }), _jsx("div", { className: "pt-6", children: props.onConfirmAction?.(disclosure) })] }) })] }) })] }));
|
|
11
|
+
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { zodResolver } from '@hookform/resolvers/zod';
|
|
3
3
|
import Link from 'next/link';
|
|
4
4
|
import { useEffect, useState } from 'react';
|
|
@@ -6,6 +6,7 @@ import { Controller, useForm } from 'react-hook-form';
|
|
|
6
6
|
import invariant from 'tiny-invariant';
|
|
7
7
|
import { z } from 'zod';
|
|
8
8
|
import { useShallow } from 'zustand/shallow';
|
|
9
|
+
import { useCreateAiOGCashDepositMutation } from '../../../../client/hooks/useAiOGCashDepositMutation.js';
|
|
9
10
|
import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
|
|
10
11
|
import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
|
|
11
12
|
import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
|
|
@@ -27,7 +28,6 @@ import { parseDecimal } from '../../../../utils/parseDecimal.js';
|
|
|
27
28
|
import { AmountChoices } from '../../AmountChoices.js';
|
|
28
29
|
import { useDepositWithdrawalPropsContext } from '../../DepositWithdrawalContext.js';
|
|
29
30
|
import { AvailablePromos } from '../AvailablePromos.js';
|
|
30
|
-
import { useCreateAiOGCashDepositMutation } from '../../../../client/hooks/useAiOGCashDepositMutation.js';
|
|
31
31
|
export function AiOGCashDeposit() {
|
|
32
32
|
const depositWithdrawalProps = useDepositWithdrawalPropsContext();
|
|
33
33
|
const disclosure = useDisclosure();
|
|
@@ -182,8 +182,7 @@ export function AiOGCashDeposit() {
|
|
|
182
182
|
}, 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) => {
|
|
183
183
|
disclosure.setOpen(details.open);
|
|
184
184
|
}, lazyMount: true, unmountOnExit: true, 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' &&
|
|
185
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
186
|
-
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
185
|
+
"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' &&
|
|
187
186
|
'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: () => {
|
|
188
187
|
api.setOpen(false);
|
|
189
188
|
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { zodResolver } from '@hookform/resolvers/zod';
|
|
3
3
|
import Link from 'next/link';
|
|
4
4
|
import { useEffect, useState } from 'react';
|
|
@@ -6,6 +6,7 @@ import { Controller, useForm } from 'react-hook-form';
|
|
|
6
6
|
import invariant from 'tiny-invariant';
|
|
7
7
|
import { z } from 'zod';
|
|
8
8
|
import { useShallow } from 'zustand/shallow';
|
|
9
|
+
import { useCreateAiOGrabPayDepositMutation } from '../../../../client/hooks/useAiOGrabPayDepositMutation.js';
|
|
9
10
|
import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
|
|
10
11
|
import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
|
|
11
12
|
import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
|
|
@@ -27,7 +28,6 @@ import { parseDecimal } from '../../../../utils/parseDecimal.js';
|
|
|
27
28
|
import { AmountChoices } from '../../AmountChoices.js';
|
|
28
29
|
import { useDepositWithdrawalPropsContext } from '../../DepositWithdrawalContext.js';
|
|
29
30
|
import { AvailablePromos } from '../AvailablePromos.js';
|
|
30
|
-
import { useCreateAiOGrabPayDepositMutation } from '../../../../client/hooks/useAiOGrabPayDepositMutation.js';
|
|
31
31
|
export function AiOGrabPayDeposit() {
|
|
32
32
|
const depositWithdrawalProps = useDepositWithdrawalPropsContext();
|
|
33
33
|
const disclosure = useDisclosure();
|
|
@@ -182,8 +182,7 @@ export function AiOGrabPayDeposit() {
|
|
|
182
182
|
}, 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) => {
|
|
183
183
|
disclosure.setOpen(details.open);
|
|
184
184
|
}, lazyMount: true, unmountOnExit: true, 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' &&
|
|
185
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
186
|
-
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
185
|
+
"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' &&
|
|
187
186
|
'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: () => {
|
|
188
187
|
api.setOpen(false);
|
|
189
188
|
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
package/dist/components/DepositWithdrawal/Deposit/AiOPalawanPayDeposit/AiOPalawanPayDeposit.js
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { zodResolver } from '@hookform/resolvers/zod';
|
|
3
3
|
import Link from 'next/link';
|
|
4
4
|
import { useEffect, useState } from 'react';
|
|
@@ -6,6 +6,7 @@ import { Controller, useForm } from 'react-hook-form';
|
|
|
6
6
|
import invariant from 'tiny-invariant';
|
|
7
7
|
import { z } from 'zod';
|
|
8
8
|
import { useShallow } from 'zustand/shallow';
|
|
9
|
+
import { useCreateAiOPalawanPayDepositMutation } from '../../../../client/hooks/useAiOPalawanPayDepositMutation.js';
|
|
9
10
|
import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
|
|
10
11
|
import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
|
|
11
12
|
import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
|
|
@@ -27,7 +28,6 @@ import { parseDecimal } from '../../../../utils/parseDecimal.js';
|
|
|
27
28
|
import { AmountChoices } from '../../AmountChoices.js';
|
|
28
29
|
import { useDepositWithdrawalPropsContext } from '../../DepositWithdrawalContext.js';
|
|
29
30
|
import { AvailablePromos } from '../AvailablePromos.js';
|
|
30
|
-
import { useCreateAiOPalawanPayDepositMutation } from '../../../../client/hooks/useAiOPalawanPayDepositMutation.js';
|
|
31
31
|
export function AiOPalawanPayDeposit() {
|
|
32
32
|
const depositWithdrawalProps = useDepositWithdrawalPropsContext();
|
|
33
33
|
const disclosure = useDisclosure();
|
|
@@ -182,8 +182,7 @@ export function AiOPalawanPayDeposit() {
|
|
|
182
182
|
}, 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) => {
|
|
183
183
|
disclosure.setOpen(details.open);
|
|
184
184
|
}, lazyMount: true, unmountOnExit: true, 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' &&
|
|
185
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
186
|
-
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
185
|
+
"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' &&
|
|
187
186
|
'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: () => {
|
|
188
187
|
api.setOpen(false);
|
|
189
188
|
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { zodResolver } from '@hookform/resolvers/zod';
|
|
3
3
|
import Link from 'next/link';
|
|
4
4
|
import { useEffect, useState } from 'react';
|
|
@@ -6,6 +6,7 @@ import { Controller, useForm } from 'react-hook-form';
|
|
|
6
6
|
import invariant from 'tiny-invariant';
|
|
7
7
|
import { z } from 'zod';
|
|
8
8
|
import { useShallow } from 'zustand/shallow';
|
|
9
|
+
import { useCreateAiOPayMayaDepositMutation } from '../../../../client/hooks/useAiOPayMayaDepositMutation.js';
|
|
9
10
|
import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
|
|
10
11
|
import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
|
|
11
12
|
import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
|
|
@@ -27,7 +28,6 @@ import { parseDecimal } from '../../../../utils/parseDecimal.js';
|
|
|
27
28
|
import { AmountChoices } from '../../AmountChoices.js';
|
|
28
29
|
import { useDepositWithdrawalPropsContext } from '../../DepositWithdrawalContext.js';
|
|
29
30
|
import { AvailablePromos } from '../AvailablePromos.js';
|
|
30
|
-
import { useCreateAiOPayMayaDepositMutation } from '../../../../client/hooks/useAiOPayMayaDepositMutation.js';
|
|
31
31
|
export function AiOPayMayaDeposit() {
|
|
32
32
|
const depositWithdrawalProps = useDepositWithdrawalPropsContext();
|
|
33
33
|
const disclosure = useDisclosure();
|
|
@@ -182,8 +182,7 @@ export function AiOPayMayaDeposit() {
|
|
|
182
182
|
}, 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) => {
|
|
183
183
|
disclosure.setOpen(details.open);
|
|
184
184
|
}, lazyMount: true, unmountOnExit: true, 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' &&
|
|
185
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
186
|
-
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
185
|
+
"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' &&
|
|
187
186
|
'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: () => {
|
|
188
187
|
api.setOpen(false);
|
|
189
188
|
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { zodResolver } from '@hookform/resolvers/zod';
|
|
3
3
|
import Link from 'next/link';
|
|
4
4
|
import { useEffect, useState } from 'react';
|
|
@@ -181,8 +181,7 @@ export function GCashDeposit() {
|
|
|
181
181
|
}, 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) => {
|
|
182
182
|
disclosure.setOpen(details.open);
|
|
183
183
|
}, lazyMount: true, unmountOnExit: true, 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' &&
|
|
184
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
185
|
-
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
184
|
+
"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' &&
|
|
186
185
|
'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: () => {
|
|
187
186
|
api.setOpen(false);
|
|
188
187
|
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { zodResolver } from '@hookform/resolvers/zod';
|
|
3
3
|
import Link from 'next/link';
|
|
4
4
|
import { useEffect, useState } from 'react';
|
|
@@ -183,8 +183,7 @@ export function GCashWebpayDeposit() {
|
|
|
183
183
|
}, 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) => {
|
|
184
184
|
disclosure.setOpen(details.open);
|
|
185
185
|
}, lazyMount: true, unmountOnExit: true, 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' &&
|
|
186
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
187
|
-
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
186
|
+
"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' &&
|
|
188
187
|
'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: () => {
|
|
189
188
|
api.setOpen(false);
|
|
190
189
|
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
package/dist/components/DepositWithdrawal/Deposit/GCashWebpayDeposit /GCashWebpayDeposit .d.ts
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function GCashWebpayDeposit(): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,191 @@
|
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs } 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 { 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 GCashWebpayDeposit() {
|
|
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 = useCreateGCashWebpayDepositMutation({
|
|
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?.gcashWebpayDepositGatewaySettings;
|
|
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: `Minimum amount is ${minimumAmount.toLocaleString()}`,
|
|
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
|
+
successRedirectionUrl: window.location.origin,
|
|
166
|
+
cancelRedirectionUrl: window.location.origin,
|
|
167
|
+
});
|
|
168
|
+
}
|
|
169
|
+
}), 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) => {
|
|
170
|
+
o.field.onChange(details.value);
|
|
171
|
+
}, formatOptions: {
|
|
172
|
+
maximumFractionDigits: 2,
|
|
173
|
+
minimumFractionDigits: 0,
|
|
174
|
+
}, 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) => {
|
|
175
|
+
form.setValue('amount', value.toString(), {
|
|
176
|
+
shouldTouch: true,
|
|
177
|
+
shouldDirty: true,
|
|
178
|
+
shouldValidate: true,
|
|
179
|
+
});
|
|
180
|
+
}, min: minimumAmount, max: maximumAmount, className: "mt-lg" }), _jsx(Controller, { control: form.control, name: "promo", render: (o) => (_jsx(AvailablePromos, { value: o.field.value, onChange: (value) => {
|
|
181
|
+
o.field.onChange(value);
|
|
182
|
+
globalStore.depositWithdrawal.setPromo(null);
|
|
183
|
+
}, 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) => {
|
|
184
|
+
disclosure.setOpen(details.open);
|
|
185
|
+
}, lazyMount: true, unmountOnExit: true, 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' &&
|
|
186
|
+
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
187
|
+
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
188
|
+
'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: () => {
|
|
189
|
+
api.setOpen(false);
|
|
190
|
+
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
|
191
|
+
}
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { zodResolver } from '@hookform/resolvers/zod';
|
|
3
3
|
import Link from 'next/link';
|
|
4
4
|
import { useEffect, useState } from 'react';
|
|
@@ -182,8 +182,7 @@ export function LibanganDeposit() {
|
|
|
182
182
|
}, 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) => {
|
|
183
183
|
disclosure.setOpen(details.open);
|
|
184
184
|
}, lazyMount: true, unmountOnExit: true, 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' &&
|
|
185
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
186
|
-
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
185
|
+
"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' &&
|
|
187
186
|
'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: () => {
|
|
188
187
|
api.setOpen(false);
|
|
189
188
|
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { zodResolver } from '@hookform/resolvers/zod';
|
|
3
3
|
import Link from 'next/link';
|
|
4
4
|
import { useEffect, useState } from 'react';
|
|
@@ -153,8 +153,7 @@ export function MayaAppDeposit() {
|
|
|
153
153
|
setStatus('waiting');
|
|
154
154
|
}
|
|
155
155
|
}, lazyMount: true, unmountOnExit: true, 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' &&
|
|
156
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
157
|
-
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
156
|
+
"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' &&
|
|
158
157
|
'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: () => {
|
|
159
158
|
api.setOpen(false);
|
|
160
159
|
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { zodResolver } from '@hookform/resolvers/zod';
|
|
3
3
|
import Link from 'next/link';
|
|
4
4
|
import { useEffect, useState } from 'react';
|
|
@@ -181,8 +181,7 @@ export function MayaDeposit() {
|
|
|
181
181
|
}, 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) => {
|
|
182
182
|
disclosure.setOpen(details.open);
|
|
183
183
|
}, lazyMount: true, unmountOnExit: true, 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' &&
|
|
184
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
185
|
-
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
184
|
+
"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' &&
|
|
186
185
|
'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: () => {
|
|
187
186
|
api.setOpen(false);
|
|
188
187
|
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
1
|
+
import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
|
|
2
2
|
import { zodResolver } from '@hookform/resolvers/zod';
|
|
3
3
|
import { ObjectId } from '@opexa/object-id';
|
|
4
4
|
import Link from 'next/link';
|
|
@@ -190,8 +190,7 @@ export function PisoPayDeposit() {
|
|
|
190
190
|
}, 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) => {
|
|
191
191
|
disclosure.setOpen(details.open);
|
|
192
192
|
}, lazyMount: true, unmountOnExit: true, 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' &&
|
|
193
|
-
"We're verifying your account and amount. Please hold a moment.", status === 'success' &&
|
|
194
|
-
'Your deposit has been successfully processed.', status === 'failed' &&
|
|
193
|
+
"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' &&
|
|
195
194
|
'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: () => {
|
|
196
195
|
api.setOpen(false);
|
|
197
196
|
}, children: status === 'failed' ? 'Try Again' : 'Ok' })) }) }))] }) })] }) })] }));
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
export declare function Loading(): import("react/jsx-runtime").JSX.Element;
|
|
@@ -0,0 +1,5 @@
|
|
|
1
|
+
'use client';
|
|
2
|
+
import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
3
|
+
export function Loading() {
|
|
4
|
+
return (_jsx("div", { className: "flex h-[calc(100vh-400px)] w-full items-center justify-center px-4", children: _jsxs("div", { className: "flex flex-col items-center space-y-4", children: [_jsx("div", { className: "h-10 w-10 animate-spin rounded-full border-4 border-blue-500 border-t-transparent" }), _jsx("p", { className: "font-medium text-gray-700 text-lg", children: "Loading Sports Book\u2026" })] }) }));
|
|
5
|
+
}
|
|
@@ -5,6 +5,8 @@ import { useState } from 'react';
|
|
|
5
5
|
import { twMerge } from 'tailwind-merge';
|
|
6
6
|
import { useShallow } from 'zustand/shallow';
|
|
7
7
|
import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
|
|
8
|
+
import { useSignOutMutation } from '../../client/hooks/useSignOutMutation.js';
|
|
9
|
+
import { BIOMETRIC_STORAGE_KEY } from '../../client/utils/biometric.js';
|
|
8
10
|
import { AlertCircleIcon } from '../../icons/AlertCircleIcon.js';
|
|
9
11
|
import { CheckIcon } from '../../icons/CheckIcon.js';
|
|
10
12
|
import pagcorLogo from '../../images/pagcor2.png';
|
|
@@ -15,13 +17,31 @@ import { Dialog } from '../../ui/Dialog/index.js';
|
|
|
15
17
|
import { Portal } from '../../ui/Portal/index.js';
|
|
16
18
|
import { useDisclaimer } from './useDisclaimer.js';
|
|
17
19
|
export function DisclaimerV2(props) {
|
|
18
|
-
const disclaimer = useDisclaimer(
|
|
20
|
+
const disclaimer = useDisclaimer({
|
|
21
|
+
showInLogin: true,
|
|
22
|
+
});
|
|
19
23
|
const globalStore = useGlobalStore(useShallow((ctx) => ({
|
|
20
24
|
termsOfUse: ctx.termsOfUse,
|
|
21
25
|
responsibleGaming: ctx.responsibleGaming,
|
|
22
26
|
})));
|
|
23
27
|
const checked = globalStore.termsOfUse.accepted && globalStore.responsibleGaming.accepted;
|
|
24
28
|
const [showWarning, setShowWarning] = useState(false);
|
|
29
|
+
const signOutMutation = useSignOutMutation({
|
|
30
|
+
onSuccess() {
|
|
31
|
+
// Clear everything except the 'biometric' entry
|
|
32
|
+
const keep = new Set([BIOMETRIC_STORAGE_KEY]);
|
|
33
|
+
for (let i = 0; i < localStorage.length;) {
|
|
34
|
+
const key = localStorage.key(i);
|
|
35
|
+
if (key && !keep.has(key)) {
|
|
36
|
+
localStorage.removeItem(key);
|
|
37
|
+
}
|
|
38
|
+
else {
|
|
39
|
+
i++;
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
sessionStorage.clear();
|
|
43
|
+
},
|
|
44
|
+
});
|
|
25
45
|
return (_jsx(Dialog.Root, { open: disclaimer.open, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: "flex h-full scrollbar:h-2 scrollbar:w-2 w-full flex-col items-start gap-y-4 overflow-y-auto scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent p-3xl lg:mx-auto lg:h-auto lg:max-h-[80vh] lg:w-[400px] lg:rounded-xl", children: [_jsx(Image, { src: props.logo, alt: `${props.siteName} logo`, width: 200, height: 100, className: "mx-auto h-auto w-[120px]", draggable: false }), _jsxs("div", { className: "flex w-full items-center justify-center gap-3xl", children: [_jsx(Image, { src: props.pagcorLogo ?? pagcorLogo, alt: "PAGCOR logo", height: 43, width: 88, className: "h-[43px] w-auto shrink-0", draggable: false, unoptimized: true }), _jsx(Image, { src: props.responsibleGamingLogo ?? responsibleGamingLogo, alt: "Responsible Gaming logo", height: 50, width: 186, className: "h-[50px] w-auto shrink-0", draggable: false, unoptimized: true })] }), _jsx("div", { className: "text-sm", children: "The following individuals are prohibited from registering or participating in this online gaming platform." }), _jsx("div", { className: "w-full grow", children: _jsxs(Dialog.Description, { className: "space-y-4 text-sm", children: [_jsxs("ul", { className: "space-y-1.5 text-left", children: [_jsxs("li", { className: "flex gap-4", children: [_jsx(Circle, {}), "Persons below the legal gambling age of 21."] }), _jsxs("li", { className: "flex gap-4", children: [_jsx(Circle, {}), "Any government official or employee directly involved in the operations of the government or its agencies."] }), _jsxs("li", { className: "flex gap-4", children: [_jsx(Circle, {}), "Member of the Armed Forces of the Philippines, including the Army, Navy, Air Force and the Philippine National Police."] }), _jsxs("li", { className: "flex gap-4", children: [_jsx(Circle, {}), "Individuals listed in PAGCOR's National Database of Restricted Persons (NDRP)"] }), _jsxs("li", { className: "flex gap-4", children: [_jsx(Circle, {}), "Holders of a valid Gaming Employment License (GEL)"] })] }), _jsxs(Checkbox.Root, { checked: checked, onCheckedChange: (e) => {
|
|
26
46
|
if (e.checked === 'indeterminate')
|
|
27
47
|
return;
|
|
@@ -36,6 +56,7 @@ export function DisclaimerV2(props) {
|
|
|
36
56
|
globalStore.responsibleGaming.setNext('DISCLAIMER');
|
|
37
57
|
disclaimer.close();
|
|
38
58
|
}, children: "Responsible Gaming" })] }), _jsx(Checkbox.HiddenInput, {})] }), showWarning && (_jsxs("div", { className: twMerge('mt-2 flex max-w-full items-center gap-2 break-words rounded-md text-text-error-primary text-xs'), role: "alert", "aria-live": "assertive", children: [_jsx(AlertCircleIcon, { className: "size-5 text-text-error-primary" }), "Please agree to ", props.siteName, "'s Terms of Use and Responsible Gaming to proceed."] })), _jsx("div", { children: "Funds or credits in the account of any individual found ineligible to participate will be forfeited and turned over to the government as required by law" })] }) }), _jsxs("div", { className: "mt-4 flex w-full gap-3", children: [_jsx(Button, { type: "button", onClick: () => {
|
|
59
|
+
signOutMutation.mutate();
|
|
39
60
|
if (props.redirectUrlOnNoConsent) {
|
|
40
61
|
window.location.href = props.redirectUrlOnNoConsent;
|
|
41
62
|
}
|