@opexa/portal-components 0.0.719 → 0.0.721

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.
Files changed (60) hide show
  1. package/dist/client/hooks/useAiOGCashDepositMutation.js +3 -3
  2. package/dist/client/hooks/useAiOGrabPayDepositMutation.js +4 -4
  3. package/dist/client/hooks/useAiOPalawanPayDepositMutation.js +4 -4
  4. package/dist/client/hooks/useAiOPayMayaDepositMutation.js +4 -4
  5. package/dist/components/DepositWithdrawal/Deposit/AiOGCashDeposit/AiOGCashDeposit.js +7 -28
  6. package/dist/components/DepositWithdrawal/Deposit/AiOGrabPayDeposit/AiOGrabPayDeposit.js +7 -28
  7. package/dist/components/DepositWithdrawal/Deposit/AiOPalawanPayDeposit/AiOPalawanPayDeposit.js +7 -28
  8. package/dist/components/DepositWithdrawal/Deposit/AiOPayMayaDeposit/AiOPayMayaDeposit.js +4 -27
  9. package/dist/components/Jackpots/JackpotsList/JackpotsList.d.ts +5 -14
  10. package/dist/components/Jackpots/JackpotsList/JackpotsListItemGameProviders.d.ts +7 -1
  11. package/dist/components/Jackpots/JackpotsList/JackpotsListItemGameProviders.js +2 -11
  12. package/dist/components/Jackpots/JackpotsList/useJackpotsListItemData.d.ts +9 -1
  13. package/dist/components/Jackpots/JackpotsList/useJackpotsListItemData.js +9 -1
  14. package/dist/ui/Carousel/Carousel.d.ts +45 -45
  15. package/dist/ui/Carousel/carousel.recipe.d.ts +5 -5
  16. package/dist/ui/Checkbox/Checkbox.d.ts +23 -23
  17. package/dist/ui/Checkbox/checkbox.recipe.d.ts +3 -3
  18. package/dist/ui/Combobox/Combobox.d.ts +42 -42
  19. package/dist/ui/Combobox/combobox.recipe.d.ts +3 -3
  20. package/dist/ui/DatePicker/DatePicker.d.ts +72 -72
  21. package/dist/ui/DatePicker/datePicker.recipe.d.ts +3 -3
  22. package/dist/ui/Menu/Menu.d.ts +144 -144
  23. package/dist/ui/Menu/menu.recipe.d.ts +8 -8
  24. package/dist/ui/Progress/Progress.d.ts +27 -27
  25. package/dist/ui/Progress/progress.recipe.d.ts +3 -3
  26. package/dist/ui/SegmentGroup/SegmentGroup.d.ts +18 -18
  27. package/dist/ui/SegmentGroup/segmentGroup.recipe.d.ts +3 -3
  28. package/dist/ui/Select/Select.d.ts +45 -45
  29. package/dist/ui/Select/select.recipe.d.ts +3 -3
  30. package/dist/ui/Table/Table.d.ts +21 -21
  31. package/dist/ui/Table/table.anatomy.d.ts +1 -1
  32. package/dist/ui/Table/table.recipe.d.ts +3 -3
  33. package/dist/ui/Tabs/Tabs.d.ts +15 -15
  34. package/dist/ui/Tabs/tabs.recipe.d.ts +3 -3
  35. package/package.json +1 -1
  36. package/dist/components/AccountInfo/GoogleDisconnect.d.ts +0 -7
  37. package/dist/components/AccountInfo/GoogleDisconnect.js +0 -11
  38. package/dist/components/DepositWithdrawal/Deposit/GCashWebpayDeposit /GCashWebpayDeposit .d.ts +0 -1
  39. package/dist/components/DepositWithdrawal/Deposit/GCashWebpayDeposit /GCashWebpayDeposit .js +0 -191
  40. package/dist/components/DigitainLauncher/Loading.d.ts +0 -1
  41. package/dist/components/DigitainLauncher/Loading.js +0 -5
  42. package/dist/components/KYC/BasicInformation.d.ts +0 -1
  43. package/dist/components/KYC/BasicInformation.js +0 -101
  44. package/dist/components/KYC/IdentityVerification.d.ts +0 -1
  45. package/dist/components/KYC/IdentityVerification.js +0 -120
  46. package/dist/components/KYC/Indicator.d.ts +0 -1
  47. package/dist/components/KYC/Indicator.js +0 -8
  48. package/dist/components/KYC/KYC.lazy.d.ts +0 -6
  49. package/dist/components/KYC/KYC.lazy.js +0 -45
  50. package/dist/components/KYC/KYCContext.d.ts +0 -6
  51. package/dist/components/KYC/KYCContext.js +0 -2
  52. package/dist/components/KYC/PersonalInformation.d.ts +0 -1
  53. package/dist/components/KYC/PersonalInformation.js +0 -122
  54. package/dist/components/KYC/useKYC.d.ts +0 -25
  55. package/dist/components/KYC/useKYC.js +0 -38
  56. package/dist/components/PortalProvider/CXDTokenObserver.d.ts +0 -1
  57. package/dist/components/PortalProvider/CXDTokenObserver.js +0 -30
  58. package/dist/icons/LinkBrokenIcon.d.ts +0 -2
  59. package/dist/icons/LinkBrokenIcon.js +0 -4
  60. package/dist/images/responsible-gaming-yellow.png +0 -0
@@ -2,6 +2,7 @@ import { ObjectId } from '@opexa/object-id';
2
2
  import { useMutation } from '@tanstack/react-query';
3
3
  import { clamp } from 'lodash-es';
4
4
  import invariant from 'tiny-invariant';
5
+ import { OPEXAPAY_ENDPOINT } from '../../constants/index.js';
5
6
  import { ObjectType } from '../../services/ObjectType.js';
6
7
  import { createAiOGCashDeposit, getDeposit, } from '../../services/wallet.js';
7
8
  import { createPoll } from '../../utils/createPoll.js';
@@ -10,7 +11,6 @@ import { getCreateAiOGCashDepositMutationKey } from '../../utils/mutationKeys.js
10
11
  import { parseDecimal } from '../../utils/parseDecimal.js';
11
12
  import { getAvailableQuestsQueryKey, getDepositsCountQueryKey, } from '../../utils/queryKeys.js';
12
13
  import { getSession } from '../services/getSession.js';
13
- import { OPEXAPAY_ENDPOINT } from '../../constants/index.js';
14
14
  export const useCreateAiOGCashDepositMutation = (config) => {
15
15
  const queryClient = getQueryClient();
16
16
  const mutation = useMutation({
@@ -45,10 +45,10 @@ export const useCreateAiOGCashDepositMutation = (config) => {
45
45
  });
46
46
  }, {
47
47
  until(res) {
48
- return !!res?.checkoutUrl;
48
+ return (!!res?.checkoutUrl || !!res?.error || res?.status === 'FAILED');
49
49
  },
50
50
  interval: 1000,
51
- maxAttempt: 5,
51
+ maxAttempt: 20,
52
52
  });
53
53
  const res = await poll();
54
54
  if (!res?.checkoutUrl) {
@@ -2,15 +2,15 @@ import { ObjectId } from '@opexa/object-id';
2
2
  import { useMutation } from '@tanstack/react-query';
3
3
  import { clamp } from 'lodash-es';
4
4
  import invariant from 'tiny-invariant';
5
+ import { OPEXAPAY_ENDPOINT } from '../../constants/index.js';
5
6
  import { ObjectType } from '../../services/ObjectType.js';
6
- import { createAiOGrabPayDeposit, getDeposit } from '../../services/wallet.js';
7
+ import { createAiOGrabPayDeposit, getDeposit, } from '../../services/wallet.js';
7
8
  import { createPoll } from '../../utils/createPoll.js';
8
9
  import { getQueryClient } from '../../utils/getQueryClient.js';
9
10
  import { getCreateAiOGrabPayDepositMutationKey } from '../../utils/mutationKeys.js';
10
11
  import { parseDecimal } from '../../utils/parseDecimal.js';
11
12
  import { getAvailableQuestsQueryKey, getDepositsCountQueryKey, } from '../../utils/queryKeys.js';
12
13
  import { getSession } from '../services/getSession.js';
13
- import { OPEXAPAY_ENDPOINT } from '../../constants/index.js';
14
14
  export const useCreateAiOGrabPayDepositMutation = (config) => {
15
15
  const queryClient = getQueryClient();
16
16
  const mutation = useMutation({
@@ -45,10 +45,10 @@ export const useCreateAiOGrabPayDepositMutation = (config) => {
45
45
  });
46
46
  }, {
47
47
  until(res) {
48
- return !!res?.checkoutUrl;
48
+ return (!!res?.checkoutUrl || !!res?.error || res?.status === 'FAILED');
49
49
  },
50
50
  interval: 1000,
51
- maxAttempt: 5,
51
+ maxAttempt: 20,
52
52
  });
53
53
  const res = await poll();
54
54
  if (!res?.checkoutUrl) {
@@ -2,15 +2,15 @@ import { ObjectId } from '@opexa/object-id';
2
2
  import { useMutation } from '@tanstack/react-query';
3
3
  import { clamp } from 'lodash-es';
4
4
  import invariant from 'tiny-invariant';
5
+ import { OPEXAPAY_ENDPOINT } from '../../constants/index.js';
5
6
  import { ObjectType } from '../../services/ObjectType.js';
6
- import { createAiOPalawanPayDeposit, getDeposit } from '../../services/wallet.js';
7
+ import { createAiOPalawanPayDeposit, getDeposit, } from '../../services/wallet.js';
7
8
  import { createPoll } from '../../utils/createPoll.js';
8
9
  import { getQueryClient } from '../../utils/getQueryClient.js';
9
10
  import { getCreateAiOPalawanPayDepositMutationKey } from '../../utils/mutationKeys.js';
10
11
  import { parseDecimal } from '../../utils/parseDecimal.js';
11
12
  import { getAvailableQuestsQueryKey, getDepositsCountQueryKey, } from '../../utils/queryKeys.js';
12
13
  import { getSession } from '../services/getSession.js';
13
- import { OPEXAPAY_ENDPOINT } from '../../constants/index.js';
14
14
  export const useCreateAiOPalawanPayDepositMutation = (config) => {
15
15
  const queryClient = getQueryClient();
16
16
  const mutation = useMutation({
@@ -45,10 +45,10 @@ export const useCreateAiOPalawanPayDepositMutation = (config) => {
45
45
  });
46
46
  }, {
47
47
  until(res) {
48
- return !!res?.checkoutUrl;
48
+ return (!!res?.checkoutUrl || !!res?.error || res?.status === 'FAILED');
49
49
  },
50
50
  interval: 1000,
51
- maxAttempt: 5,
51
+ maxAttempt: 20,
52
52
  });
53
53
  const res = await poll();
54
54
  if (!res?.checkoutUrl) {
@@ -2,15 +2,15 @@ import { ObjectId } from '@opexa/object-id';
2
2
  import { useMutation } from '@tanstack/react-query';
3
3
  import { clamp } from 'lodash-es';
4
4
  import invariant from 'tiny-invariant';
5
+ import { OPEXAPAY_ENDPOINT } from '../../constants/index.js';
5
6
  import { ObjectType } from '../../services/ObjectType.js';
6
- import { createAiOPayMayaDeposit, getDeposit } from '../../services/wallet.js';
7
+ import { createAiOPayMayaDeposit, getDeposit, } from '../../services/wallet.js';
7
8
  import { createPoll } from '../../utils/createPoll.js';
8
9
  import { getQueryClient } from '../../utils/getQueryClient.js';
9
10
  import { getCreateAiOPayMayaDepositMutationKey } from '../../utils/mutationKeys.js';
10
11
  import { parseDecimal } from '../../utils/parseDecimal.js';
11
12
  import { getAvailableQuestsQueryKey, getDepositsCountQueryKey, } from '../../utils/queryKeys.js';
12
13
  import { getSession } from '../services/getSession.js';
13
- import { OPEXAPAY_ENDPOINT } from '../../constants/index.js';
14
14
  export const useCreateAiOPayMayaDepositMutation = (config) => {
15
15
  const queryClient = getQueryClient();
16
16
  const mutation = useMutation({
@@ -45,10 +45,10 @@ export const useCreateAiOPayMayaDepositMutation = (config) => {
45
45
  });
46
46
  }, {
47
47
  until(res) {
48
- return !!res?.checkoutUrl;
48
+ return (!!res?.checkoutUrl || !!res?.error || res?.status === 'FAILED');
49
49
  },
50
50
  interval: 1000,
51
- maxAttempt: 5,
51
+ maxAttempt: 20,
52
52
  });
53
53
  const res = await poll();
54
54
  if (!res?.checkoutUrl) {
@@ -8,7 +8,6 @@ import { z } from 'zod';
8
8
  import { useShallow } from 'zustand/shallow';
9
9
  import { useCreateAiOGCashDepositMutation } from '../../../../client/hooks/useAiOGCashDepositMutation.js';
10
10
  import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
11
- import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
12
11
  import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
13
12
  import { useDisclosure } from '../../../../client/hooks/useDisclosure.js';
14
13
  import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
@@ -46,36 +45,11 @@ export function AiOGCashDeposit() {
46
45
  onSuccess(data) {
47
46
  invariant(data.checkoutUrl);
48
47
  window.open(data.checkoutUrl, '_blank', 'noopener,noreferrer');
49
- form.reset();
50
- disclosure.setOpen(false);
51
48
  },
52
49
  onError() {
53
- disclosure.setOpen(true);
54
50
  setStatus('failed');
55
51
  },
56
52
  });
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
53
  const depositsCountQuery = useDepositsCountQuery();
80
54
  const depositsCount = depositsCountQuery.data ?? 0;
81
55
  const paymentSettingsQuery = usePaymentSettingsQuery();
@@ -149,7 +123,6 @@ export function AiOGCashDeposit() {
149
123
  }
150
124
  }, [form, minimumAmount]);
151
125
  return (_jsxs("form", { onSubmit: form.handleSubmit(async (data) => {
152
- //handle new kyc process
153
126
  if (verificationStatus === 'PENDING' ||
154
127
  verificationStatus === 'UNVERIFIED' ||
155
128
  verificationStatus === 'REJECTED' ||
@@ -162,7 +135,9 @@ export function AiOGCashDeposit() {
162
135
  createDepositMutation.mutate({
163
136
  amount: data.amount.toString(),
164
137
  promo: data.promo ?? undefined,
165
- redirectUrl: window.location.origin,
138
+ redirectUrl: window.location.origin.includes('localhost')
139
+ ? 'https://uat.powerplay.ph'
140
+ : window.location.origin,
166
141
  });
167
142
  }
168
143
  }), noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
@@ -181,6 +156,10 @@ export function AiOGCashDeposit() {
181
156
  globalStore.depositWithdrawal.setPromo(null);
182
157
  }, 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
158
  disclosure.setOpen(details.open);
159
+ if (!details.open) {
160
+ setStatus('waiting');
161
+ form.reset();
162
+ }
184
163
  }, 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
164
  "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
165
  '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: () => {
@@ -8,7 +8,6 @@ import { z } from 'zod';
8
8
  import { useShallow } from 'zustand/shallow';
9
9
  import { useCreateAiOGrabPayDepositMutation } from '../../../../client/hooks/useAiOGrabPayDepositMutation.js';
10
10
  import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
11
- import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
12
11
  import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
13
12
  import { useDisclosure } from '../../../../client/hooks/useDisclosure.js';
14
13
  import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
@@ -46,36 +45,11 @@ export function AiOGrabPayDeposit() {
46
45
  onSuccess(data) {
47
46
  invariant(data.checkoutUrl);
48
47
  window.open(data.checkoutUrl, '_blank', 'noopener,noreferrer');
49
- form.reset();
50
- disclosure.setOpen(false);
51
48
  },
52
49
  onError() {
53
- disclosure.setOpen(true);
54
50
  setStatus('failed');
55
51
  },
56
52
  });
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
53
  const depositsCountQuery = useDepositsCountQuery();
80
54
  const depositsCount = depositsCountQuery.data ?? 0;
81
55
  const paymentSettingsQuery = usePaymentSettingsQuery();
@@ -149,7 +123,6 @@ export function AiOGrabPayDeposit() {
149
123
  }
150
124
  }, [form, minimumAmount]);
151
125
  return (_jsxs("form", { onSubmit: form.handleSubmit(async (data) => {
152
- //handle new kyc process
153
126
  if (verificationStatus === 'PENDING' ||
154
127
  verificationStatus === 'UNVERIFIED' ||
155
128
  verificationStatus === 'REJECTED' ||
@@ -162,7 +135,9 @@ export function AiOGrabPayDeposit() {
162
135
  createDepositMutation.mutate({
163
136
  amount: data.amount.toString(),
164
137
  promo: data.promo ?? undefined,
165
- redirectUrl: window.location.origin,
138
+ redirectUrl: window.location.origin.includes('localhost')
139
+ ? 'https://uat.powerplay.ph'
140
+ : window.location.origin,
166
141
  });
167
142
  }
168
143
  }), noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
@@ -181,6 +156,10 @@ export function AiOGrabPayDeposit() {
181
156
  globalStore.depositWithdrawal.setPromo(null);
182
157
  }, 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
158
  disclosure.setOpen(details.open);
159
+ if (!details.open) {
160
+ setStatus('waiting');
161
+ form.reset();
162
+ }
184
163
  }, 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
164
  "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
165
  '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: () => {
@@ -8,7 +8,6 @@ import { z } from 'zod';
8
8
  import { useShallow } from 'zustand/shallow';
9
9
  import { useCreateAiOPalawanPayDepositMutation } from '../../../../client/hooks/useAiOPalawanPayDepositMutation.js';
10
10
  import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
11
- import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
12
11
  import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
13
12
  import { useDisclosure } from '../../../../client/hooks/useDisclosure.js';
14
13
  import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
@@ -46,36 +45,11 @@ export function AiOPalawanPayDeposit() {
46
45
  onSuccess(data) {
47
46
  invariant(data.checkoutUrl);
48
47
  window.open(data.checkoutUrl, '_blank', 'noopener,noreferrer');
49
- form.reset();
50
- disclosure.setOpen(false);
51
48
  },
52
49
  onError() {
53
- disclosure.setOpen(true);
54
50
  setStatus('failed');
55
51
  },
56
52
  });
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
53
  const depositsCountQuery = useDepositsCountQuery();
80
54
  const depositsCount = depositsCountQuery.data ?? 0;
81
55
  const paymentSettingsQuery = usePaymentSettingsQuery();
@@ -149,7 +123,6 @@ export function AiOPalawanPayDeposit() {
149
123
  }
150
124
  }, [form, minimumAmount]);
151
125
  return (_jsxs("form", { onSubmit: form.handleSubmit(async (data) => {
152
- //handle new kyc process
153
126
  if (verificationStatus === 'PENDING' ||
154
127
  verificationStatus === 'UNVERIFIED' ||
155
128
  verificationStatus === 'REJECTED' ||
@@ -162,7 +135,9 @@ export function AiOPalawanPayDeposit() {
162
135
  createDepositMutation.mutate({
163
136
  amount: data.amount.toString(),
164
137
  promo: data.promo ?? undefined,
165
- redirectUrl: window.location.origin,
138
+ redirectUrl: window.location.origin.includes('localhost')
139
+ ? 'https://uat.powerplay.ph'
140
+ : window.location.origin,
166
141
  });
167
142
  }
168
143
  }), noValidate: true, children: [_jsx(Controller, { control: form.control, name: "amount", render: (o) => (_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, children: [_jsxs(NumberInput.Root, { min: 0, step: 1, value: o.field.value, onValueChange: (details) => {
@@ -181,6 +156,10 @@ export function AiOPalawanPayDeposit() {
181
156
  globalStore.depositWithdrawal.setPromo(null);
182
157
  }, 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
158
  disclosure.setOpen(details.open);
159
+ if (!details.open) {
160
+ setStatus('waiting');
161
+ form.reset();
162
+ }
184
163
  }, 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
164
  "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
165
  '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: () => {
@@ -8,7 +8,6 @@ import { z } from 'zod';
8
8
  import { useShallow } from 'zustand/shallow';
9
9
  import { useCreateAiOPayMayaDepositMutation } from '../../../../client/hooks/useAiOPayMayaDepositMutation.js';
10
10
  import { useAvailablePromosQuery } from '../../../../client/hooks/useAvailablePromosQuery.js';
11
- import { useDepositQuery } from '../../../../client/hooks/useDepositQuery.js';
12
11
  import { useDepositsCountQuery } from '../../../../client/hooks/useDepositsCountQuery.js';
13
12
  import { useDisclosure } from '../../../../client/hooks/useDisclosure.js';
14
13
  import { useGlobalStore } from '../../../../client/hooks/useGlobalStore.js';
@@ -46,36 +45,11 @@ export function AiOPayMayaDeposit() {
46
45
  onSuccess(data) {
47
46
  invariant(data.checkoutUrl);
48
47
  window.open(data.checkoutUrl, '_blank', 'noopener,noreferrer');
49
- form.reset();
50
- disclosure.setOpen(false);
51
48
  },
52
49
  onError() {
53
- disclosure.setOpen(true);
54
50
  setStatus('failed');
55
51
  },
56
52
  });
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
53
  const depositsCountQuery = useDepositsCountQuery();
80
54
  const depositsCount = depositsCountQuery.data ?? 0;
81
55
  const paymentSettingsQuery = usePaymentSettingsQuery();
@@ -149,7 +123,6 @@ export function AiOPayMayaDeposit() {
149
123
  }
150
124
  }, [form, minimumAmount]);
151
125
  return (_jsxs("form", { onSubmit: form.handleSubmit(async (data) => {
152
- //handle new kyc process
153
126
  if (verificationStatus === 'PENDING' ||
154
127
  verificationStatus === 'UNVERIFIED' ||
155
128
  verificationStatus === 'REJECTED' ||
@@ -181,6 +154,10 @@ export function AiOPayMayaDeposit() {
181
154
  globalStore.depositWithdrawal.setPromo(null);
182
155
  }, 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
156
  disclosure.setOpen(details.open);
157
+ if (!details.open) {
158
+ setStatus('waiting');
159
+ form.reset();
160
+ }
184
161
  }, 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
162
  "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
163
  '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: () => {
@@ -1,6 +1,6 @@
1
1
  import { type ImageProps } from 'next/image';
2
2
  import type { CSSProperties, ReactNode } from 'react';
3
- import type { GameProvider, GameProviderData } from '../../../types';
3
+ import type { GameProvider } from '../../../types';
4
4
  export interface ClassNameEntries {
5
5
  root?: string;
6
6
  itemRoot?: string;
@@ -35,19 +35,10 @@ export interface JackpotsListProps {
35
35
  heading?: string | ReactNode;
36
36
  className?: string | ClassNameEntries;
37
37
  style?: CSSProperties | StyleEntries;
38
- gameProviders: GameProvider[];
39
- gameProviderImages?: Partial<Record<GameProvider, ImageProps['src']>>;
40
- /**
41
- * @default '/providers/<slug>'
42
- * @example
43
- * ```ts
44
- * '/bingo/:slug' // '/bingo/jili'
45
- * '/bingo/:id' // '/bingo/JILI'
46
- * // or using a function
47
- * ({slug}) => `/bingo/${slug}`
48
- * ```
49
- */
50
- viewGamesUrl?: string | ((gameProvider: GameProviderData) => string);
38
+ gameProviders?: Partial<Record<GameProvider, {
39
+ redirectUrl: string;
40
+ image?: ImageProps['src'];
41
+ }>>;
51
42
  animate?: boolean;
52
43
  customJackpotChestImage?: {
53
44
  image: {
@@ -1,5 +1,11 @@
1
+ import { type ImageProps } from 'next/image';
1
2
  import type { GameProviderData } from '../../../types';
3
+ interface JackpotGameProvider extends GameProviderData {
4
+ redirectUrl: string;
5
+ providedLogo?: ImageProps['src'];
6
+ }
2
7
  export interface JackpotsListItemGameProvidersProps {
3
- gameProviders: GameProviderData[];
8
+ gameProviders: JackpotGameProvider[];
4
9
  }
5
10
  export declare function JackpotsListItemGameProviders({ gameProviders, }: JackpotsListItemGameProvidersProps): import("react/jsx-runtime").JSX.Element;
11
+ export {};
@@ -1,24 +1,16 @@
1
1
  import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
2
2
  import useEmblaCarousel from 'embla-carousel-react';
3
3
  import { isString } from 'lodash-es';
4
- import Image from 'next/image';
4
+ import Image, {} from 'next/image';
5
5
  import Link from 'next/link';
6
6
  import { useCallback, useEffect, useState } from 'react';
7
7
  import { twMerge } from 'tailwind-merge';
8
8
  import { ArrowLeftIcon } from '../../../icons/ArrowLeftIcon.js';
9
9
  import { ArrowRightIcon } from '../../../icons/ArrowRightIcon.js';
10
10
  import { Button } from '../../../ui/Button/index.js';
11
- import { callIfFn } from '../../../utils/callIfFn.js';
12
11
  import { useJackpotsListPropsContext } from './JackpotsListContext.js';
13
12
  export function JackpotsListItemGameProviders({ gameProviders, }) {
14
13
  const jackpotsProps = useJackpotsListPropsContext();
15
- const viewGamesUrl = (data) => {
16
- return jackpotsProps.viewGamesUrl
17
- ? callIfFn(jackpotsProps.viewGamesUrl, data)
18
- .replace(':id', data.id)
19
- .replace(':slug', data.slug)
20
- : `/providers/${data.slug}`;
21
- };
22
14
  const classNames = isString(jackpotsProps.className)
23
15
  ? { root: jackpotsProps.className }
24
16
  : (jackpotsProps.className ?? {});
@@ -49,6 +41,5 @@ export function JackpotsListItemGameProviders({ gameProviders, }) {
49
41
  emblaApi.on('select', onSelect);
50
42
  emblaApi.on('reInit', onSelect);
51
43
  }, [emblaApi, onSelect]);
52
- return (_jsxs("div", { className: twMerge('p-4 pb-8', classNames.providerRoot), children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("div", { className: twMerge('font-semibold text-lg text-text-primary-900', classNames.providerHeading), children: "Jackpot Game Providers" }), _jsxs("div", { className: "hidden lg:flex", children: [_jsx(Button, { disabled: !canScrollPrev, onClick: scrollPrev, variant: "outline", colorScheme: "gray", className: twMerge('rounded-r-none border-r-0', classNames.providerNavigationButton), "aria-label": "Previous", children: _jsx(ArrowLeftIcon, { className: "size-5" }) }), _jsxs(Button, { disabled: !canScrollNext, onClick: scrollNext, variant: "outline", colorScheme: "gray", className: twMerge('rounded-l-none', classNames.providerNavigationButton), "aria-label": "Next", children: [_jsx("span", { className: "sr-only", children: "Next" }), _jsx(ArrowRightIcon, { className: "size-5" })] })] })] }), _jsx("div", { className: "relative mt-3 overflow-hidden", ref: emblaRef, children: _jsx("div", { className: "flex gap-3.5", children: gameProviders.map((provider) => (_jsx(Link, { href: viewGamesUrl(provider), className: twMerge('min-w-27.5 rounded-md bg-brand-800 lg:bg-bg-primary-900', classNames.providerThumbnailRoot), children: _jsx(Image, { src: jackpotsProps.gameProviderImages?.[provider.id] ??
53
- provider.logo, alt: "provider", className: twMerge('size-full', classNames.providerThumbnailImage), width: 300, height: 150 }) }, provider.slug))) }) })] }));
44
+ return (_jsxs("div", { className: twMerge('p-4 pb-8', classNames.providerRoot), children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsx("div", { className: twMerge('font-semibold text-lg text-text-primary-900', classNames.providerHeading), children: "Jackpot Game Providers" }), _jsxs("div", { className: "hidden lg:flex", children: [_jsx(Button, { disabled: !canScrollPrev, onClick: scrollPrev, variant: "outline", colorScheme: "gray", className: twMerge('rounded-r-none border-r-0', classNames.providerNavigationButton), "aria-label": "Previous", children: _jsx(ArrowLeftIcon, { className: "size-5" }) }), _jsxs(Button, { disabled: !canScrollNext, onClick: scrollNext, variant: "outline", colorScheme: "gray", className: twMerge('rounded-l-none', classNames.providerNavigationButton), "aria-label": "Next", children: [_jsx("span", { className: "sr-only", children: "Next" }), _jsx(ArrowRightIcon, { className: "size-5" })] })] })] }), _jsx("div", { className: "relative mt-3 overflow-hidden", ref: emblaRef, children: _jsx("div", { className: "flex gap-3.5", children: gameProviders.map((provider) => (_jsx(Link, { href: provider.redirectUrl, className: twMerge('min-w-27.5 rounded-md bg-brand-800 lg:bg-bg-primary-900', classNames.providerThumbnailRoot), children: _jsx(Image, { src: provider.providedLogo ?? provider.logo, alt: "provider", className: twMerge('size-full', classNames.providerThumbnailImage), width: 300, height: 150 }) }, provider.slug))) }) })] }));
54
45
  }
@@ -1,8 +1,16 @@
1
+ import type { GameProvider } from '../../../types';
1
2
  export declare function useJackpotsListItemData(): {
2
3
  rootRef: (node?: Element | null) => void;
3
4
  jackpotPayouts: import("../../../types").JackpotPayout[];
4
5
  topJackpotPayout: import("../../../types").JackpotPayout;
5
- filteredGameProviders: import("../../../types").GameProviderData[];
6
+ filteredGameProviders: {
7
+ redirectUrl: string;
8
+ providedLogo: string | import("next/dist/shared/lib/get-img-props").StaticImport | undefined;
9
+ id: GameProvider;
10
+ slug: string;
11
+ logo: import("next/image").ImageProps["src"];
12
+ name: string;
13
+ }[];
6
14
  localeInfo: import("../../../utils/getLocaleInfo").LocaleInfo;
7
15
  isPayingOut: boolean;
8
16
  jackpotAmount: string;
@@ -12,7 +12,15 @@ import { useJackpotsListItemContext, useJackpotsListPropsContext, } from './Jack
12
12
  export function useJackpotsListItemData() {
13
13
  const jackpotsListProps = useJackpotsListPropsContext();
14
14
  const jackpot = useJackpotsListItemContext();
15
- const gameProviders = jackpotsListProps.gameProviders.map((provider) => GAME_PROVIDER_DATA[provider]);
15
+ const gameProviders = Object.entries(jackpotsListProps.gameProviders ?? {}).map(([key, cfg]) => {
16
+ const id = key;
17
+ const base = GAME_PROVIDER_DATA[id];
18
+ return {
19
+ ...base,
20
+ redirectUrl: cfg.redirectUrl,
21
+ providedLogo: cfg.image,
22
+ };
23
+ });
16
24
  const [rootRef, inView] = useIntersectionObserver({
17
25
  threshold: 0.25,
18
26
  });