@opexa/portal-components 0.0.796 → 0.0.797

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 (41) hide show
  1. package/dist/components/AccountInfo/GoogleDisconnect.d.ts +7 -0
  2. package/dist/components/AccountInfo/GoogleDisconnect.js +11 -0
  3. package/dist/components/DepositWithdrawal/Deposit/GCashWebpayDeposit /GCashWebpayDeposit .d.ts +1 -0
  4. package/dist/components/DepositWithdrawal/Deposit/GCashWebpayDeposit /GCashWebpayDeposit .js +191 -0
  5. package/dist/components/Jackpots/Jackpots.module.css +0 -2
  6. package/dist/components/Jackpots/JackpotsCarouselNext/JackpotsCarousel.d.ts +1 -0
  7. package/dist/components/Jackpots/JackpotsCarouselNext/JackpotsCarouselItem.js +2 -2
  8. package/dist/components/Jackpots/JackpotsCarouselNext/JackpotsCarouselStageItem.js +3 -9
  9. package/dist/components/Jackpots/JackpotsListNext/JackpotMultiStageDesktop.js +1 -7
  10. package/dist/components/Jackpots/JackpotsListNext/JackpotsListItemDesktop.js +1 -1
  11. package/dist/components/KYC/KYCVerificationStatus.lazy.js +4 -7
  12. package/dist/components/PortalProvider/CXDTokenObserver.js +11 -11
  13. package/dist/icons/LinkBrokenIcon.d.ts +2 -0
  14. package/dist/icons/LinkBrokenIcon.js +4 -0
  15. package/dist/ui/Menu/Menu.d.ts +144 -144
  16. package/dist/ui/Menu/menu.recipe.d.ts +8 -8
  17. package/dist/ui/QrCode/QrCode.d.ts +25 -25
  18. package/dist/ui/QrCode/qrCode.recipe.d.ts +5 -5
  19. package/package.json +1 -1
  20. package/dist/components/Banner/Banner.client.d.ts +0 -12
  21. package/dist/components/Banner/Banner.client.js +0 -49
  22. package/dist/components/PortalProvider/AndroidOnlyComponents.d.ts +0 -1
  23. package/dist/components/PortalProvider/AndroidOnlyComponents.js +0 -12
  24. package/dist/components/SignIn/utils.d.ts +0 -8
  25. package/dist/components/SignIn/utils.js +0 -26
  26. package/dist/constants/Branches.d.ts +0 -2
  27. package/dist/constants/Branches.js +0 -42
  28. package/dist/third-parties/FacebookPixel/FacebookPixel.d.ts +0 -4
  29. package/dist/third-parties/FacebookPixel/FacebookPixel.js +0 -4
  30. package/dist/third-parties/FacebookPixel/api.d.ts +0 -0
  31. package/dist/third-parties/FacebookPixel/api.js +0 -1
  32. package/dist/third-parties/FacebookPixel/index.d.ts +0 -1
  33. package/dist/third-parties/FacebookPixel/index.js +0 -1
  34. package/dist/third-parties/GoogleRecaptcha/GoogleRecaptcha.d.ts +0 -4
  35. package/dist/third-parties/GoogleRecaptcha/GoogleRecaptcha.js +0 -4
  36. package/dist/third-parties/GoogleRecaptcha/api.d.ts +0 -0
  37. package/dist/third-parties/GoogleRecaptcha/api.js +0 -1
  38. package/dist/third-parties/GoogleRecaptcha/index.d.ts +0 -1
  39. package/dist/third-parties/GoogleRecaptcha/index.js +0 -1
  40. package/dist/third-parties/index.d.ts +0 -2
  41. package/dist/third-parties/index.js +0 -2
@@ -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
+ }
@@ -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
+ }
@@ -154,7 +154,6 @@
154
154
 
155
155
  .scrollArea::-webkit-scrollbar-track {
156
156
  background: var(--color-jackpot-table-scrollbar-track);
157
- border-radius: 9999px;
158
157
  }
159
158
 
160
159
  .scrollArea::-webkit-scrollbar-corner {
@@ -163,7 +162,6 @@
163
162
 
164
163
  .scrollArea::-webkit-scrollbar-thumb {
165
164
  background-color: var(--color-jackpot-table-scrollbar-thumb);
166
- border-radius: 9999px;
167
165
  }
168
166
 
169
167
  @keyframes waveColor {
@@ -4,6 +4,7 @@ export interface ClassNameEntries {
4
4
  root?: string;
5
5
  itemRoot?: string;
6
6
  jackpotAmountRoot?: string;
7
+ jackpotNameRoot?: string;
7
8
  jackpotBadgeRoot?: string;
8
9
  jackpotTurnoverRoot?: string;
9
10
  jackpotTurnoverIcon?: string;
@@ -131,7 +131,7 @@ export function JackpotsCarouselItem({ style, className, viewAllUrl, animate = t
131
131
  if (jackpot.status === 'DISABLED' && jackpot.drawing !== true) {
132
132
  return null;
133
133
  }
134
- return (_jsxs("div", { ref: ref, className: twMerge('relative flex w-full shrink-0 rounded-2xl border border-border-primary bg-bg-tertiary p-3 text-center lg:gap-4 lg:p-5', className?.itemRoot), style: style, children: [_jsxs("div", { className: "relative z-1 flex flex-1 flex-col", children: [_jsx("div", { className: "flex h-full flex-col justify-between", children: _jsx("div", { className: "flex w-full justify-between", children: _jsxs("div", { className: "flex w-full flex-col", children: [_jsxs("div", { className: "relative flex w-full justify-between", children: [_jsxs("div", { children: [isPayingOut ? (_jsxs("div", { className: "flex w-fit items-center gap-1 rounded-full border border-utility-success-200 bg-utility-success-50 px-2 py-0.5 font-medium text-utility-success-700 text-xs", children: [_jsx("span", { className: "full size-1.5 animate-pulse rounded bg-utility-success-500" }), "Paying Out"] })) : (_jsxs("div", { className: "flex w-fit items-center gap-1 rounded-full border border-utility-blue-200 bg-utility-blue-50 px-2 py-0.5 font-medium text-utility-blue-700 text-xs", children: [_jsx(ArrowNarrowUpRightIcon, { className: "size-3.5 text-utility-blue-500" }), "Accumulating"] })), _jsx("div", { className: "mt-1 text-left font-medium text-lg text-text-primary-900 lg:mt-5 lg:text-2xl", children: jackpot.name }), _jsx("div", { className: twMerge('mt-1.5 w-fit rounded-md bg-bg-primary px-2 py-1 font-bold text-2xl text-brand-400 lg:mt-2 lg:text-4xl', className?.jackpotAmountRoot), children: formatNumber(jackpotAmount, {
134
+ return (_jsxs("div", { ref: ref, className: twMerge('relative flex max-h-[360px] w-full shrink-0 rounded-2xl border border-border-primary bg-bg-tertiary p-3 text-center lg:gap-4 lg:p-5', className?.itemRoot), style: style, children: [_jsxs("div", { className: "relative z-1 flex flex-1 flex-col", children: [_jsx("div", { className: "flex h-full flex-col justify-between", children: _jsx("div", { className: "flex w-full justify-between", children: _jsxs("div", { className: "flex w-full flex-col", children: [_jsxs("div", { className: "relative flex w-full justify-between", children: [_jsxs("div", { className: 'flex-1', children: [isPayingOut ? (_jsxs("div", { className: "flex w-fit items-center gap-1 rounded-full border border-utility-success-200 bg-utility-success-50 px-2 py-0.5 font-medium text-utility-success-700 text-xs", children: [_jsx("span", { className: "full size-1.5 animate-pulse rounded bg-utility-success-500" }), "Paying Out"] })) : (_jsxs("div", { className: "flex w-fit items-center gap-1 rounded-full border border-utility-blue-200 bg-utility-blue-50 px-2 py-0.5 font-medium text-utility-blue-700 text-xs", children: [_jsx(ArrowNarrowUpRightIcon, { className: "size-3.5 text-utility-blue-500" }), "Accumulating"] })), _jsx("div", { className: twMerge('mt-1 text-left font-medium text-lg text-text-primary-900 lg:mt-5 lg:max-w-[calc(100%-40px)] lg:truncate lg:text-2xl', className?.jackpotNameRoot), children: jackpot.name }), _jsx("div", { className: twMerge('mt-1.5 w-fit rounded-md bg-bg-primary px-2 py-1 font-bold text-2xl text-brand-400 lg:mt-2 lg:text-4xl', className?.jackpotAmountRoot), children: formatNumber(jackpotAmount, {
135
135
  currency: localeInfo.currency.code,
136
136
  minDecimalPlaces: 2,
137
137
  maxDecimalPlaces: 2,
@@ -167,7 +167,7 @@ export function JackpotsCarouselItem({ style, className, viewAllUrl, animate = t
167
167
  currency: localeInfo.currency.code,
168
168
  compact: true,
169
169
  })} Play now for your chance to win big! 🔥`
170
- : getAccumulatingJackpotDescription(Number(jackpot?.pool) ?? 0, Number(jackpot?.maximumJackpotPoolLimit) ?? 0) })] })] }), _jsxs("div", { className: twMerge('z-1 hidden flex-1 space-y-4 lg:block', className?.recentPayoutsRoot), children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex gap-2", children: [_jsx(Image, { width: 24, height: 24, src: leaderboard, alt: "leaderboardIcon", className: "size-full h-auto w-6" }), _jsx("div", { className: "font-semibold text-lg text-text-primary-900", children: jackpotPayouts.length ? 'Recent payouts' : 'Starting soon!' })] }), _jsxs(Link, { className: "flex font-semibold text-button-tertiary-fg text-sm", href: viewAllUrl ?? '/jackpots', children: ["See details", _jsx(ChevronRightIcon, { className: "size-5" })] })] }), _jsx("div", { className: twMerge('max-h-[17rem] overflow-y-scroll rounded-xl', styles.scrollArea), children: _jsx("div", { className: 'rounded-xl border-gray-200', children: _jsxs("table", { className: "w-full", children: [_jsx("thead", { children: _jsx("tr", { className: twMerge('h-8 whitespace-nowrap bg-bg-secondary text-left font-medium text-text-tertiary-600 text-xs', className?.recentPayoutsTableHeadRow), children: [
170
+ : getAccumulatingJackpotDescription(Number(jackpot?.pool) ?? 0, Number(jackpot?.maximumJackpotPoolLimit) ?? 0) })] })] }), _jsxs("div", { className: twMerge('z-1 hidden flex-1 space-y-4 lg:block', className?.recentPayoutsRoot), children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex gap-2", children: [_jsx(Image, { width: 24, height: 24, src: leaderboard, alt: "leaderboardIcon", className: "size-full h-auto w-6" }), _jsx("div", { className: "font-semibold text-lg text-text-primary-900", children: jackpotPayouts.length ? 'Recent payouts' : 'Starting soon!' })] }), _jsxs(Link, { className: "flex font-semibold text-button-tertiary-fg text-sm", href: viewAllUrl ?? '/jackpots', children: ["See details", _jsx(ChevronRightIcon, { className: "size-5" })] })] }), _jsx("div", { className: twMerge('max-h-[17.2rem] overflow-y-scroll rounded-xl', styles.scrollArea), children: _jsx("div", { className: "rounded-xl border-gray-200", children: _jsxs("table", { className: "w-full", children: [_jsx("thead", { children: _jsx("tr", { className: twMerge('h-8 whitespace-nowrap bg-bg-secondary text-left font-medium text-text-tertiary-600 text-xs', className?.recentPayoutsTableHeadRow), children: [
171
171
  'Player',
172
172
  'Game Provider',
173
173
  'Multiplier',
@@ -22,7 +22,6 @@ import firstPlace from '../../../images/first-place.png';
22
22
  import leaderboard from '../../../images/leaderboard.png';
23
23
  import { formatNumber } from '../../../utils/formatNumber.js';
24
24
  import { maskFirstLast } from '../../../utils/mask.js';
25
- import { parseDecimal } from '../../../utils/parseDecimal.js';
26
25
  import styles from '../Jackpots.module.css';
27
26
  import { useJackpotsCarouselItemContext } from './JackpotsCarouselContext.js';
28
27
  export function JackpotsCarouselStageItem({ style, className, viewAllUrl, animate = true, customJackpotStageChest, medalImage, jackpotProfileShape = 'oval', }) {
@@ -105,11 +104,11 @@ export function JackpotsCarouselStageItem({ style, className, viewAllUrl, animat
105
104
  if (jackpot.status === 'DISABLED' && jackpot.drawing !== true) {
106
105
  return null;
107
106
  }
108
- return (_jsxs("div", { ref: ref, className: twMerge('relative flex w-full shrink-0 rounded-2xl border border-border-primary bg-bg-tertiary p-3 text-center lg:gap-4 lg:p-5', className?.itemRoot, isBlucky && styles['animate-multi-stage-gradient-blucky']), style: style, children: [_jsxs("div", { className: "relative z-1 flex flex-1 flex-col", children: [_jsx("div", { className: "flex h-full flex-col justify-between", children: _jsx("div", { className: "flex w-full justify-between", children: _jsxs("div", { className: "flex w-full flex-col", children: [_jsxs("div", { className: "relative flex w-full justify-between", children: [_jsxs("div", { children: [_jsxs("div", { className: "flex gap-2.5", children: [_jsxs("div", { className: twMerge('flex w-fit items-center gap-1 rounded-full border border-[#3F100B] bg-[#CDA95B] px-2 py-0.5 font-medium text-[#1D0201] text-xs', className?.jackpotBadgeRoot), children: [_jsx(Flag05Icon, { className: "size-3.5 text-[inherit]" }), "Stage ", jackpot.stage, ' '] }), jackpot.status !== 'CLOSED' ? (_jsxs("div", { className: "flex w-fit items-center gap-1 rounded-full border border-utility-blue-200 bg-utility-blue-50 px-2 py-0.5 font-medium text-utility-blue-700 text-xs", children: [_jsx(ArrowNarrowUpRightIcon, { className: "size-3.5 text-utility-blue-500" }), "In Progress"] })) : (_jsxs("div", { className: "flex w-fit items-center gap-1 rounded-full border border-utility-success-200 bg-utility-success-50 px-2 py-0.5 font-medium text-utility-success-700 text-xs", children: [_jsx(CheckCircleBrokenIcon, { className: "size-3.5 text-utility-success-500" }), "Completed"] }))] }), _jsx("div", { className: "mt-1 text-left font-medium text-lg text-text-primary-900 lg:mt-5 lg:text-2xl", children: jackpot.name }), _jsx("div", { className: twMerge('mt-1.5 w-fit rounded-md bg-bg-primary px-2 py-1 font-bold text-2xl text-brand-400 lg:mt-2 lg:text-4xl', className?.jackpotAmountRoot), children: formatNumber(jackpot.stages?.[jackpot.stage - 1]?.jackpotPayout, {
107
+ return (_jsxs("div", { ref: ref, className: twMerge('relative flex max-h-[360px] w-full shrink-0 rounded-2xl border border-border-primary bg-bg-tertiary p-3 text-center lg:gap-4 lg:p-5', className?.itemRoot, isBlucky && styles['animate-multi-stage-gradient-blucky']), style: style, children: [_jsxs("div", { className: "relative z-1 flex flex-1 flex-col", children: [_jsx("div", { className: "flex h-full flex-col justify-between", children: _jsx("div", { className: "flex w-full justify-between", children: _jsxs("div", { className: "flex w-full flex-col", children: [_jsxs("div", { className: "relative flex w-full justify-between", children: [_jsxs("div", { className: 'flex-1', children: [_jsxs("div", { className: "flex gap-2.5", children: [_jsxs("div", { className: twMerge('flex w-fit items-center gap-1 rounded-full border border-[#3F100B] bg-[#CDA95B] px-2 py-0.5 font-medium text-[#1D0201] text-xs', className?.jackpotBadgeRoot), children: [_jsx(Flag05Icon, { className: "size-3.5 text-[inherit]" }), "Stage ", jackpot.stage, ' '] }), jackpot.status !== 'CLOSED' ? (_jsxs("div", { className: "flex w-fit items-center gap-1 rounded-full border border-utility-blue-200 bg-utility-blue-50 px-2 py-0.5 font-medium text-utility-blue-700 text-xs", children: [_jsx(ArrowNarrowUpRightIcon, { className: "size-3.5 text-utility-blue-500" }), "In Progress"] })) : (_jsxs("div", { className: "flex w-fit items-center gap-1 rounded-full border border-utility-success-200 bg-utility-success-50 px-2 py-0.5 font-medium text-utility-success-700 text-xs", children: [_jsx(CheckCircleBrokenIcon, { className: "size-3.5 text-utility-success-500" }), "Completed"] }))] }), _jsx("div", { className: twMerge('mt-1 text-left font-medium text-lg text-text-primary-900 lg:mt-5 lg:max-w-[calc(100%-40px)] lg:truncate lg:text-2xl', className?.jackpotNameRoot), children: jackpot.name }), _jsx("div", { className: twMerge('mt-1.5 w-fit rounded-md bg-bg-primary px-2 py-1 font-bold text-2xl text-brand-400 lg:mt-2 lg:text-4xl', className?.jackpotAmountRoot), children: formatNumber(jackpot.stages?.[jackpot.stage - 1]?.jackpotPayout, {
109
108
  currency: localeInfo.currency.code,
110
109
  minDecimalPlaces: 2,
111
110
  maxDecimalPlaces: 2,
112
- }) }), _jsxs("div", { className: twMerge('mt-[0.625rem] flex w-fit items-center gap-1 rounded-full border border-[#932F19] bg-[#511C10] py-[0.125rem] pr-[0.5rem] pl-[0.375rem] text-[#F7B27A] text-xs', className?.jackpotTurnoverRoot), children: [_jsx(Target04Icon, { className: twMerge('size-3.5 text-[#EF6820]', className?.jackpotTurnoverIcon) }), _jsxs("p", { children: ["Turnover Target:", ' ', formatNumber(jackpot.stages?.[jackpot.stage - 1]?.targetTurnover, {
111
+ }) }), _jsxs("div", { className: twMerge('mt-[0.625rem] flex w-fit items-center gap-1 rounded-full border border-[#932F19] bg-[#511C10] py-[0.125rem] pr-[0.5rem] pl-[0.375rem] text-[#F7B27A] text-xs lg:hidden', className?.jackpotTurnoverRoot), children: [_jsx(Target04Icon, { className: twMerge('size-3.5 text-[#EF6820]', className?.jackpotTurnoverIcon) }), _jsxs("p", { children: ["Turnover Target:", ' ', formatNumber(jackpot.stages?.[jackpot.stage - 1]?.targetTurnover, {
113
112
  currency: localeInfo.currency.code,
114
113
  minDecimalPlaces: 2,
115
114
  maxDecimalPlaces: 2,
@@ -120,7 +119,7 @@ export function JackpotsCarouselStageItem({ style, className, viewAllUrl, animat
120
119
  currency: localeInfo.currency.code,
121
120
  minDecimalPlaces: 2,
122
121
  maxDecimalPlaces: 2,
123
- }) })] })] })) : (_jsxs("div", { className: twMerge('flex flex-row gap-[8.5px]', medalImage?.wrapper), children: [_jsx(Image, { width: 66, height: 87, src: medalImage?.image || firstPlace, alt: "firstPlace", className: "size-full h-auto w-[4.125rem] mix-blend-luminosity" }), _jsxs("div", { className: "flex flex-col gap-1 text-left", children: [_jsx(PayoutBadge, {}), _jsx("div", { className: "font-semibold", children: "No winners yet" }), _jsx("div", { className: "text-text-secondary-700 text-xs", children: "You could be the first to win the jackpot!" })] })] })) })] }) }) }), _jsxs("div", { className: "lg:mt-4", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "font-semibold text-sm text-text-primary-900", children: ["Stage ", jackpot.stage, " Progress"] }), isCompleted ? 100 : currStageProgressPercentage, "%"] }), _jsx(Progress.Root, { className: "h-2 w-full rounded-full bg-bg-primary lg:h-4", max: 100, value: isCompleted ? 100 : currStageProgressPercentage, "aria-valuenow": currStageProgressPercentage, "aria-valuemax": 100, "aria-label": "Jackpot progress", children: _jsx(Progress.Track, { className: twMerge('h-full overflow-hidden rounded-full bg-bg-primary', className?.progressBarTrack), children: _jsx(Progress.Range, { className: "relative h-full overflow-hidden rounded-full bg-brand-500 pl-1.5", children: _jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-start pl-1.5", "aria-hidden": "true", children: arrowImages }) }) }) })] })] }), _jsxs("div", { className: twMerge('z-1 hidden flex-1 space-y-4 lg:block', className?.recentPayoutsRoot), children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex gap-2", children: [_jsx(Image, { width: 24, height: 24, src: leaderboard, alt: "leaderboardIcon", className: "size-full h-auto w-6" }), _jsx("div", { className: "font-semibold text-lg text-text-primary-900", children: "Stages" })] }), _jsxs(Link, { className: "flex font-semibold text-button-tertiary-fg text-sm", href: viewAllUrl ?? '/jackpots', children: ["See details", _jsx(ChevronRightIcon, { className: "size-5" })] })] }), _jsx(OverallProgressBar, {}), _jsx("div", { className: twMerge('max-h-[17rem] overflow-y-scroll', styles.scrollArea), children: _jsx("div", { className: "overflow-hidden rounded-xl border-gray-200", children: _jsxs("table", { className: "w-full", children: [_jsx("thead", { children: _jsx("tr", { className: twMerge('h-8 whitespace-nowrap bg-bg-secondary text-left font-medium text-text-tertiary-600 text-xs', className?.recentPayoutsTableHeadRow), children: [
122
+ }) })] })] })) : (_jsxs("div", { className: twMerge('flex flex-row gap-[8.5px]', medalImage?.wrapper), children: [_jsx(Image, { width: 66, height: 87, src: medalImage?.image || firstPlace, alt: "firstPlace", className: "size-full h-auto w-[4.125rem] mix-blend-luminosity" }), _jsxs("div", { className: "flex flex-col gap-1 text-left", children: [_jsx(PayoutBadge, {}), _jsx("div", { className: "font-semibold", children: "No winners yet" }), _jsx("div", { className: "text-text-secondary-700 text-xs", children: "You could be the first to win the jackpot!" })] })] })) })] }) }) }), _jsxs("div", { className: "lg:mt-4", children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "font-semibold text-sm text-text-primary-900", children: ["Stage ", jackpot.stage, " Progress"] }), isCompleted ? 100 : currStageProgressPercentage, "%"] }), _jsx(Progress.Root, { className: "h-2 w-full rounded-full bg-bg-primary lg:h-4", max: 100, value: isCompleted ? 100 : currStageProgressPercentage, "aria-valuenow": currStageProgressPercentage, "aria-valuemax": 100, "aria-label": "Jackpot progress", children: _jsx(Progress.Track, { className: twMerge('h-full overflow-hidden rounded-full bg-bg-primary', className?.progressBarTrack), children: _jsx(Progress.Range, { className: "relative h-full overflow-hidden rounded-full bg-brand-500 pl-1.5", children: _jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-start pl-1.5", "aria-hidden": "true", children: arrowImages }) }) }) })] })] }), _jsxs("div", { className: twMerge('z-1 hidden flex-1 space-y-4 lg:block', className?.recentPayoutsRoot), children: [_jsxs("div", { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex gap-2", children: [_jsx(Image, { width: 24, height: 24, src: leaderboard, alt: "leaderboardIcon", className: "size-full h-auto w-6" }), _jsx("div", { className: "font-semibold text-lg text-text-primary-900", children: "Stages" })] }), _jsxs(Link, { className: "flex font-semibold text-button-tertiary-fg text-sm", href: viewAllUrl ?? '/jackpots', children: ["See details", _jsx(ChevronRightIcon, { className: "size-5" })] })] }), _jsx(OverallProgressBar, {}), _jsx("div", { className: twMerge('max-h-[13.7rem] overflow-y-scroll rounded-xl', styles.scrollArea), children: _jsx("div", { className: "rounded-xl border-gray-200", children: _jsxs("table", { className: "w-full", children: [_jsx("thead", { children: _jsx("tr", { className: twMerge('h-8 whitespace-nowrap bg-bg-secondary text-left font-medium text-text-tertiary-600 text-xs', className?.recentPayoutsTableHeadRow), children: [
124
123
  'Stage',
125
124
  'Player',
126
125
  'Turnover Target',
@@ -145,8 +144,3 @@ export function JackpotsCarouselStageItem({ style, className, viewAllUrl, animat
145
144
  : '-' })] }, i)))
146
145
  : Array.from({ length: 10 }).map((_, i) => (_jsx("tr", { className: twMerge('bg-bg-primary text-sm text-text-secondary-700', className?.recentPayoutsTableBodyRow), children: Array.from({ length: 5 }).map((_, j) => (_jsx("td", { className: twMerge('h-12 border-border-secondary border-t-2', className?.recentPayoutsTableBodyData), children: "-" }, j))) }, i))) })] }) }) })] }), isPayingOut && animate && (_jsx("div", { className: twMerge(styles['light-rays'], 'absolute top-safe-area-inset-top right-0 rounded-2xl [--light-rays-top:25%] lg:[--light-rays-top:9.375rem]') }))] }));
147
146
  }
148
- function getPercentage(value, total) {
149
- const v = parseDecimal(value, 0);
150
- const t = parseDecimal(total, 0);
151
- return t === 0 ? 0 : (v / t) * 100;
152
- }
@@ -15,7 +15,6 @@ import firstPlace from '../../../images/first-place.png';
15
15
  import leaderboard from '../../../images/leaderboard.png';
16
16
  import { formatNumber } from '../../../utils/formatNumber.js';
17
17
  import { maskFirstLast } from '../../../utils/mask.js';
18
- import { parseDecimal } from '../../../utils/parseDecimal.js';
19
18
  import styles from '../Jackpots.module.css';
20
19
  import { useJackpotsListItemContext } from './JackpotsListContext.js';
21
20
  import { JackpotsListItemGameProviders } from './JackpotsListItemGameProviders.js';
@@ -69,7 +68,7 @@ export function JackpotMultiStageDesktop({ animate = true, customJackpotChestIma
69
68
  const OverallProgressBar = () => {
70
69
  return (_jsxs("div", { className: "mt-3 lg:mt-4", children: [_jsxs("div", { className: "mb-[0.3125rem] flex items-center justify-between font-semibold text-sm text-text-primary-900", children: [_jsx("p", { children: "Overall Progress" }), overallPercentage, "%"] }), _jsx(Progress.Root, { className: "h-2 w-full rounded-full bg-bg-primary lg:h-4", max: 100, value: overallPercentage, children: _jsx(Progress.Track, { className: twMerge('h-full overflow-hidden rounded-full bg-bg-primary', className?.progressBarTrack), children: _jsx(Progress.Range, { className: "relative h-full overflow-hidden rounded-full bg-brand-500 pl-1.5", children: _jsx("div", { className: "pointer-events-none absolute inset-0 flex items-center justify-start pl-1.5", "aria-hidden": "true", children: arrowImages }) }) }) })] }));
71
70
  };
72
- const RecentPayoutsTable = () => (_jsx("div", { className: twMerge('max-h-[17rem] overflow-y-scroll', styles.scrollArea), children: _jsx("div", { className: "overflow-hidden rounded-xl border-gray-200", children: _jsxs("table", { className: "w-full", children: [_jsx("thead", { children: _jsx("tr", { className: twMerge('h-8 whitespace-nowrap bg-bg-secondary text-left font-medium text-text-tertiary-600 text-xs', className?.recentPayoutsTableHeadRow), children: ['Stage', 'Player', 'Turnover Target', 'Prize', 'Timestamp'].map((header) => (_jsx("th", { className: "px-4", children: header }, header))) }) }), _jsx("tbody", { children: jackpot.stages
71
+ const RecentPayoutsTable = () => (_jsx("div", { className: twMerge('max-h-[17rem] overflow-y-scroll rounded-xl', styles.scrollArea), children: _jsx("div", { className: 'rounded-xl border-gray-200', children: _jsxs("table", { className: "w-full", children: [_jsx("thead", { children: _jsx("tr", { className: twMerge('h-8 whitespace-nowrap bg-bg-secondary text-left font-medium text-text-tertiary-600 text-xs', className?.recentPayoutsTableHeadRow), children: ['Stage', 'Player', 'Turnover Target', 'Prize', 'Timestamp'].map((header) => (_jsx("th", { className: "px-4", children: header }, header))) }) }), _jsx("tbody", { children: jackpot.stages
73
72
  ? jackpot.stages.map((j, i) => (_jsxs("tr", { className: twMerge('whitespace-nowrap bg-bg-primary text-left text-sm text-text-secondary-700', className?.recentPayoutsTableBodyRow), children: [_jsx("td", { className: twMerge('h-12 border-border-secondary border-t-2 px-4', className?.recentPayoutsTableBodyData), children: i + 1 }), _jsx("td", { className: twMerge('h-12 border-border-secondary border-t-2 px-4', className?.recentPayoutsTableBodyData), children: j.member?.name
74
73
  ? maskFirstLast(j.member.name, {
75
74
  firstCharsCount: 3,
@@ -109,8 +108,3 @@ export function JackpotMultiStageDesktop({ animate = true, customJackpotChestIma
109
108
  button: className?.recentPayoutsJackpotRulesButton,
110
109
  } })] }), _jsx(OverallProgressBar, {}), _jsx(RecentPayoutsTable, {})] }), isPayingOut && animate && (_jsx("div", { className: twMerge(styles['light-rays'], 'absolute top-safe-area-inset-top right-0 rounded-2xl') }))] }), Boolean(filteredGameProviders.length) && (_jsx(JackpotsListItemGameProviders, { gameProviders: filteredGameProviders }))] }));
111
110
  }
112
- function getPercentage(value, total) {
113
- const v = parseDecimal(value, 0);
114
- const t = parseDecimal(total, 0);
115
- return t === 0 ? 0 : (v / t) * 100;
116
- }
@@ -78,7 +78,7 @@ export function JackpotsListItemDesktop({ animate = true, customJackpotChestImag
78
78
  compact: true,
79
79
  })} Play now for your chance to win big! 🔥`
80
80
  : getAccumulatingJackpotDescription(Number(jackpot?.pool) ?? 0, Number(jackpot?.maximumJackpotPoolLimit) ?? 0) })] }));
81
- const RecentPayoutsTable = () => (_jsx("div", { className: twMerge('max-h-[17rem] overflow-y-scroll', styles.scrollArea), children: _jsx("div", { className: "overflow-hidden rounded-xl border-gray-200", children: _jsxs("table", { className: "w-full", children: [_jsx("thead", { children: _jsx("tr", { className: twMerge('h-8 whitespace-nowrap bg-bg-secondary text-left font-medium text-text-tertiary-600 text-xs', className?.recentPayoutsTableHeadRow), children: [
81
+ const RecentPayoutsTable = () => (_jsx("div", { className: twMerge('max-h-[17rem] overflow-y-scroll rounded-xl', styles.scrollArea), children: _jsx("div", { className: 'rounded-xl border-gray-200', children: _jsxs("table", { className: "w-full", children: [_jsx("thead", { children: _jsx("tr", { className: twMerge('h-8 whitespace-nowrap bg-bg-secondary text-left font-medium text-text-tertiary-600 text-xs', className?.recentPayoutsTableHeadRow), children: [
82
82
  'Player',
83
83
  'Game Provider',
84
84
  'Multiplier',
@@ -19,18 +19,15 @@ export function KYCVerificationStatus() {
19
19
  const icons = status === 'PENDING' ? bellIcon : alertIcon;
20
20
  return (_jsx(Dialog.Root, { open: globalStore.kycVerificationStatus.open, onOpenChange: (details) => {
21
21
  globalStore.kycVerificationStatus.setOpen(details.open);
22
- }, closeOnEscape: false, closeOnInteractOutside: false, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+3)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+4)] flex items-center justify-center", children: _jsx(Dialog.Content, { className: "mx-auto h-fit w-[450px] overflow-y-auto rounded-lg bg-bg-primary", children: _jsxs("div", { className: "p-3xl text-center", children: [_jsx("div", { className: "mb-3xl grid h-[200px] w-full place-items-center rounded-xl bg-radial from-40% from-button-primary-bg to-bg-brand-solid", children: _jsx(Image, { src: icons, alt: "icon", className: "w-60 object-contain", draggable: false, width: 120, height: 120 }) }), _jsxs("h1", { className: "font-semibold text-lg text-white", children: [status === 'PENDING' && 'Verification in Progress', status === 'REJECTED' && 'Verification Rejected', status === 'UNVERIFIED' ||
23
- (status === 'CREATED' && 'Verification Required')] }), _jsxs("p", { className: "mb-4xl text-[#94969C] text-base", children: [status === 'PENDING' &&
22
+ }, closeOnEscape: false, closeOnInteractOutside: false, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+3)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+4)] flex items-center justify-center", children: _jsx(Dialog.Content, { className: "mx-auto h-fit w-[450px] overflow-y-auto rounded-lg bg-bg-primary", children: _jsxs("div", { className: "p-3xl text-center", children: [_jsx("div", { className: "mb-3xl grid h-[200px] w-full place-items-center rounded-xl bg-radial from-40% from-button-primary-bg to-bg-brand-solid", children: _jsx(Image, { src: icons, alt: "icon", className: "w-60 object-contain", draggable: false, width: 120, height: 120 }) }), _jsxs("h1", { className: "font-semibold text-lg text-white", children: [status === 'PENDING' && 'Verification in Progress', status === 'REJECTED' && 'Verification Rejected', status === 'UNVERIFIED' && 'Verification Required'] }), _jsxs("p", { className: "mb-4xl text-[#94969C] text-base", children: [status === 'PENDING' &&
24
23
  `Your account verification is still under review. Please wait
25
24
  until it's approved before you can continue playing or
26
25
  depositing.`, status === 'REJECTED' &&
27
- 'Your account verification was not approved. Please resubmit your verification to regain full access.', status === 'UNVERIFIED' ||
28
- (status === 'CREATED' &&
29
- 'Your account is not yet verified. Please complete the verification process to continue playing or depositing.')] }), _jsxs(Button, { variant: "solid", className: twMerge('mb-2 w-full', status === 'PENDING' && 'hidden'), onClick: () => {
26
+ 'Your account verification was not approved. Please resubmit your verification to regain full access.', status === 'UNVERIFIED' &&
27
+ 'Your account is not yet verified. Please complete the verification process to continue playing or depositing.'] }), _jsxs(Button, { variant: "solid", className: twMerge('mb-2 w-full', status === 'PENDING' && 'hidden'), onClick: () => {
30
28
  globalStore.kycVerificationStatus.setOpen(false);
31
29
  globalStore.kyc.setOpen(true);
32
- }, children: [status === 'REJECTED' && 'Resubmit Verification', status === 'UNVERIFIED' ||
33
- (status === 'CREATED' && 'Verify Now')] }), _jsx(Button, { type: "button", variant: "outline", onClick: () => {
30
+ }, children: [status === 'REJECTED' && 'Resubmit Verification', status === 'UNVERIFIED' && 'Verify Now'] }), _jsx(Button, { type: "button", variant: "outline", onClick: () => {
34
31
  globalStore.kycVerificationStatus.setOpen(false);
35
32
  }, children: "Close" })] }) }) })] }) }));
36
33
  }
@@ -1,30 +1,30 @@
1
1
  'use client';
2
2
  import { addHours } from 'date-fns';
3
3
  import { clamp } from 'lodash-es';
4
+ import { useSearchParams } from 'next/navigation';
4
5
  import { useLocalStorage, useTimeout } from 'usehooks-ts';
5
6
  import { useAccountQuery } from '../../client/hooks/useAccountQuery.js';
6
7
  export function CXDTokenObserver() {
7
- const { data: account } = useAccountQuery();
8
- const accountCxd = {
9
- cxd: account?.cellxpertDetails?.cxd,
10
- };
11
- const [cxd, setCxd, removeCxd] = useLocalStorage('cxd', null);
8
+ const searchParams = useSearchParams();
9
+ const cxdToken = searchParams.get('cxd');
10
+ const accountQuery = useAccountQuery();
11
+ const account = accountQuery.data;
12
+ const [cxd, setCxd, removeCxd] = useLocalStorage('WebPortalCellxpertCxd', null);
12
13
  const now = new Date();
14
+ const shouldTimeoutRun = cxdToken && account;
13
15
  const removeCxdUntilInMs = cxd?.timestamp
14
16
  ? clamp(cxd.timestamp - now.getTime(), 0, Infinity)
15
17
  : 0;
16
18
  useTimeout(() => {
17
- const isSame = cxd?.cxd === accountCxd.cxd;
19
+ const isSame = cxd?.cxd === cxdToken;
18
20
  if (!isSame) {
19
21
  const extendedTimestamp = addHours(new Date(), 6).getTime();
20
22
  setCxd({
21
- cxd: accountCxd.cxd,
23
+ cxd: cxdToken,
22
24
  timestamp: extendedTimestamp,
23
25
  });
24
26
  }
25
- }, account ? 100 : null);
26
- useTimeout(() => {
27
- removeCxd();
28
- }, account ? removeCxdUntilInMs : null);
27
+ }, shouldTimeoutRun ? 100 : null);
28
+ useTimeout(() => removeCxd(), shouldTimeoutRun ? removeCxdUntilInMs : null);
29
29
  return null;
30
30
  }
@@ -0,0 +1,2 @@
1
+ import type { ComponentPropsWithRef } from 'react';
2
+ export declare function LinkBrokenIcon(props: ComponentPropsWithRef<'svg'>): import("react/jsx-runtime").JSX.Element;
@@ -0,0 +1,4 @@
1
+ import { jsx as _jsx } from "react/jsx-runtime";
2
+ export function LinkBrokenIcon(props) {
3
+ return (_jsx("svg", { xmlns: "http://www.w3.org/2000/svg", width: "24", height: "24", viewBox: "0 0 24 24", fill: "none", ...props, children: _jsx("path", { d: "M8.5 15.5L15.5 8.49998M9 4V2M15 20V22M4 9H2M20 15H22M4.91421 4.91421L3.5 3.5M19.0858 19.0857L20.5 20.4999M12 17.6568L9.87871 19.7781C8.31662 21.3402 5.78396 21.3402 4.22186 19.7781C2.65976 18.216 2.65976 15.6833 4.22186 14.1212L6.34318 11.9999M17.6569 11.9999L19.7782 9.87859C21.3403 8.31649 21.3403 5.78383 19.7782 4.22174C18.2161 2.65964 15.6835 2.65964 14.1214 4.22174L12 6.34306", stroke: "#FEDF89", "stroke-width": "2", "stroke-linecap": "round", "stroke-linejoin": "round" }) }));
4
+ }