@opexa/portal-components 0.0.243 → 0.0.245

package/dist/client/hooks/useCamera.js

@@ -1,11 +1,11 @@
 import { isBoolean, isFunction, isObject } from 'lodash-es';
-import { useCallback, useMemo, useRef, useState, } from 'react';
+import { useCallback, useEffect, useMemo, useRef, useState, } from 'react';
 import invariant from 'tiny-invariant';
 import { useMediaQuery } from 'usehooks-ts';
 export function useCamera(options = {}) {
     const { transform, validate, ...constraints } = options;
     const videoRef = useRef(null);
-    const stream = useRef(null);
+    const streamRef = useRef(null);
     const [data, setData] = useState(null);
     const [error, setError] = useState(null);
     const [loading, setLoading] = useState(false);
@@ -51,7 +51,7 @@ export function useCamera(options = {}) {
                 },
             });
             node.srcObject = result;
-            stream.current = result;
+            streamRef.current = result;
             setMirror(!isObject(constraints.video)
                 ? true
                 : constraints.video.facingMode === 'environment'
@@ -92,7 +92,7 @@ export function useCamera(options = {}) {
         setLoading(false);
         setSnapping(false);
         return new Promise((resolve) => {
-            stream.current?.getTracks().forEach((track) => track.stop());
+            streamRef.current?.getTracks().forEach((track) => track.stop());
             videoRef.current?.pause();
             resolve();
         });
@@ -218,8 +218,17 @@ export function useCamera(options = {}) {
             boxSizing: 'border-box',
             background: 'transparent',
             transform: mirror ? 'scaleX(-1)' : 'none',
+            pointerEvents: 'none',
         },
     }), [mirror]);
+    useEffect(() => {
+        return () => {
+            setData(null);
+            setError(null);
+            setLoading(false);
+            setSnapping(false);
+        };
+    }, []);
     return {
         snap,
         open,

package/dist/client/hooks/useFeatureFlag.d.ts

@@ -4,12 +4,9 @@ export interface UseFeatureFlagReturn {
     disable(): Promise<void>;
 }
 export declare function useFeatureFlag(): UseFeatureFlagReturn;
-interface FeatureFlagEventDetail {
-    enabled: boolean;
-}
-type FeatureFlagEvent = CustomEvent<FeatureFlagEventDetail>;
 interface EventsMap {
-    'web-portal::feature-flag': FeatureFlagEvent;
+    'web-portal::feature-flag-enabled': CustomEvent;
+    'web-portal::feature-flag-disabled': CustomEvent;
 }
 type Listener<K extends keyof EventsMap> = (this: Window, event: EventsMap[K]) => void;
 declare global {

package/dist/client/hooks/useFeatureFlag.js

@@ -1,52 +1,37 @@
-'use client';
-import { useEffect, useState } from 'react';
+import { useCallback, useEffect, useState } from 'react';
 import { FEATURE_FLAG_LOCAL_STORAGE_KEY } from '../../constants/index.js';
-const event = new CustomEvent('web-portal::feature-flag', {
-    detail: {
-        enabled: false,
-    },
-    bubbles: true,
-    cancelable: false,
-});
 export function useFeatureFlag() {
     const [enabled, setEnabled] = useState(false);
-    function enable() {
+    const enable = useCallback(() => {
         return new Promise((resolve) => {
-            const event = new CustomEvent('web-portal::feature-flag', {
-                detail: {
-                    enabled: true,
-                },
-                bubbles: true,
-                cancelable: false,
-            });
-            window.dispatchEvent(event);
+            localStorage.setItem(FEATURE_FLAG_LOCAL_STORAGE_KEY, '');
+            window.dispatchEvent(FEATURE_FLAG_ENABLED_EVENT);
             resolve();
         });
-    }
-    function disable() {
+    }, []);
+    const disable = useCallback(() => {
         return new Promise((resolve) => {
-            window.dispatchEvent(event);
+            localStorage.removeItem(FEATURE_FLAG_LOCAL_STORAGE_KEY);
+            window.dispatchEvent(FEATURE_FLAG_DISABLED_EVENT);
             resolve();
         });
-    }
+    }, []);
     useEffect(() => {
-        if (localStorage.getItem(FEATURE_FLAG_LOCAL_STORAGE_KEY) != null) {
-            setEnabled(true);
-        }
+        setEnabled(localStorage.getItem(FEATURE_FLAG_LOCAL_STORAGE_KEY) != null);
     }, []);
     useEffect(() => {
-        const handle = (event) => {
-            if (event.detail.enabled) {
-                setEnabled(true);
-                localStorage.setItem(FEATURE_FLAG_LOCAL_STORAGE_KEY, '');
-            }
-            else {
-                setEnabled(false);
-                localStorage.removeItem(FEATURE_FLAG_LOCAL_STORAGE_KEY);
-            }
+        function handleEnabled() {
+            setEnabled(true);
+        }
+        function handleDisabled() {
+            setEnabled(false);
+        }
+        window.addEventListener('web-portal::feature-flag-enabled', handleEnabled);
+        window.addEventListener('web-portal::feature-flag-disabled', handleDisabled);
+        return () => {
+            window.removeEventListener('web-portal::feature-flag-enabled', handleEnabled);
+            window.removeEventListener('web-portal::feature-flag-disabled', handleDisabled);
         };
-        window.addEventListener('web-portal::feature-flag', handle);
-        return () => window.removeEventListener('web-portal::feature-flag', handle);
     }, []);
     return {
         enabled,
@@ -54,3 +39,11 @@ export function useFeatureFlag() {
         disable,
     };
 }
+const FEATURE_FLAG_DISABLED_EVENT = new CustomEvent('web-portal::feature-flag-disabled', {
+    bubbles: true,
+    cancelable: false,
+});
+const FEATURE_FLAG_ENABLED_EVENT = new CustomEvent('web-portal::feature-flag-enabled', {
+    bubbles: true,
+    cancelable: false,
+});

package/dist/client/hooks/useInfiniteQueryHelper.js

@@ -20,7 +20,7 @@ export function useInfiniteQueryHelper(useQuery, variables) {
     const rows = availablePages.at(page - 1) ?? [];
     const totalRows = query.data?.pages.at(-1)?.totalCount ?? 0;
     const totalPages = Math.ceil(totalRows / pageSize);
-    const hasNextPage = query.data?.pages.at(-1)?.pageInfo.hasNextPage ?? false;
+    const hasNextPage = page < totalPages;
     const hasPrevPage = page > 1;
     const next = async () => {
         if (!hasNextPage) {

package/dist/components/Account/Account.lazy.js

@@ -2,6 +2,7 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import Image from 'next/image';
 import Link from 'next/link';
+import { useRouter } from 'next/navigation';
 import { twMerge } from 'tailwind-merge';
 import { useShallow } from 'zustand/shallow';
 import { useAccountQuery } from '../../client/hooks/useAccountQuery.js';
@@ -45,6 +46,7 @@ const defaultAccountProps = {
 };
 const recipe = accountRecipe();
 export function Account(props) {
+    const router = useRouter();
     const globalStore = useGlobalStore(useShallow((ctx) => ({
         account: ctx.account,
         account__mobile: ctx.account__mobile,
@@ -57,14 +59,14 @@ export function Account(props) {
                 }, lazyMount: true, unmountOnExit: true, children: _jsx(Portal, { children: _jsx(Drawer.Positioner, { children: _jsxs(Drawer.Content, { className: twMerge('relative', 'flex', 'flex-col', 'top-[var(--offset-top-mobile)]', 'h-[calc(100%-var(--offset-top-mobile))]', 'w-full', 'px-xl', 'py-6', 'lg:top-[var(--offset-top-desktop)]', 'lg:h-[calc(100%-var(--offset-top-desktop))]'), style: {
                                 ['--offset-top-mobile']: mobileOffsetTop,
                                 ['--offset-top-desktop']: desktopOffsetTop,
-                            }, children: [_jsx(Profile, {}), _jsx(Wallet, {}), _jsx(Links, {})] }) }) }) }), _jsx(Popover.Root, { open: globalStore.account.open, onOpenChange: (details) => {
+                            }, children: [_jsx(Profile, {}), _jsx(Wallet, {}), _jsx(Links, { router: router })] }) }) }) }), _jsx(Popover.Root, { open: globalStore.account.open, onOpenChange: (details) => {
                     globalStore.account.setOpen(details.open);
                 }, lazyMount: true, unmountOnExit: true, positioning: {
                     placement: 'bottom',
                     strategy: 'fixed',
                 }, ids: {
                     trigger: 'opexa-portal-components:account-trigger',
-                }, children: _jsx(Portal, { children: _jsx(Popover.Positioner, { children: _jsxs(Popover.Content, { className: "border-border-primary bg-bg-primary relative z-popover w-[23.438rem] overflow-hidden rounded-xl border p-xl ui-open:animate-fade-in ui-closed:animate-fade-out", children: [_jsx(Profile, {}), _jsx(Wallet, {}), _jsx(Links, {})] }) }) }) })] }));
+                }, children: _jsx(Portal, { children: _jsx(Popover.Positioner, { children: _jsxs(Popover.Content, { className: "border-border-primary bg-bg-primary relative z-popover w-[23.438rem] overflow-hidden rounded-xl border p-xl ui-open:animate-fade-in ui-closed:animate-fade-out", children: [_jsx(Profile, {}), _jsx(Wallet, {}), _jsx(Links, { router: router })] }) }) }) })] }));
 }
 function Profile() {
     const accountQuery = useAccountQuery();
@@ -105,7 +107,7 @@ function Wallet() {
                             globalStore.mobileProfile.setOpen(false);
                         }, children: "Deposit" })] })] }));
 }
-function Links() {
+function Links({ router }) {
     const accountProps = useAccountPropsContext();
     const globalStore = useGlobalStore(useShallow((ctx) => ({
         account: ctx.account,
@@ -116,6 +118,7 @@ function Links() {
         onSuccess() {
             localStorage.clear();
             sessionStorage.clear();
+            router.replace('/');
         },
     });
     const unreadMessagesCountQuery = useUnreadMessagesCountQuery({}, { refetchInterval: 5000 });

package/dist/components/AccountInfo/AccountInfo.js

@@ -87,7 +87,7 @@ function PersonalInfo() {
                             ? data.birthDay
                             : undefined,
                     });
-                }), children: [_jsxs("div", { className: "px-4 py-5 lg:px-3xl lg:py-5", children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.realName, readOnly: !!account?.realName, children: [_jsx(Field.Label, { children: "Real name" }), _jsx(Field.Input, { ...form.register('realName') }), _jsx(Field.ErrorText, { children: form.formState.errors.realName?.message })] }), _jsxs(Field.Root, { className: "mt-6", invalid: !!form.formState.errors.birthDay, readOnly: !!account?.birthDay, children: [_jsx(Field.Label, { children: "Date of birth" }), _jsx(Field.Input, { type: "date", ...form.register('birthDay') }), _jsx(Field.ErrorText, { children: form.formState.errors.birthDay?.message })] })] }), form.formState.isDirty && (_jsxs("div", { className: "border-border-secondary flex justify-end gap-lg border-t px-xl py-lg lg:px-3xl lg:py-xl", children: [_jsx(Button, { size: "sm", variant: "outline", fullWidth: false, disabled: updateAccountMutation.isPending, onClick: () => form.reset(), children: "Cancel" }), _jsx(Button, { type: "submit", size: "sm", fullWidth: false, disabled: !form.formState.isValid || updateAccountMutation.isPending, children: "Save Changes" })] }))] })] }));
+                }), children: [_jsxs("div", { className: "px-4 py-5 lg:px-3xl lg:py-5", children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.realName, readOnly: !!account?.realName, children: [_jsx(Field.Label, { children: "Full name" }), _jsx(Field.Input, { ...form.register('realName') }), _jsx(Field.ErrorText, { children: form.formState.errors.realName?.message })] }), _jsxs(Field.Root, { className: "mt-6", invalid: !!form.formState.errors.birthDay, readOnly: !!account?.birthDay, children: [_jsx(Field.Label, { children: "Date of birth" }), _jsx(Field.Input, { type: "date", ...form.register('birthDay') }), _jsx(Field.ErrorText, { children: form.formState.errors.birthDay?.message })] })] }), form.formState.isDirty && (_jsxs("div", { className: "border-border-secondary flex justify-end gap-lg border-t px-xl py-lg lg:px-3xl lg:py-xl", children: [_jsx(Button, { size: "sm", variant: "outline", fullWidth: false, disabled: updateAccountMutation.isPending, onClick: () => form.reset(), children: "Cancel" }), _jsx(Button, { type: "submit", size: "sm", fullWidth: false, disabled: !form.formState.isValid || updateAccountMutation.isPending, children: "Save Changes" })] }))] })] }));
 }
 function ContactInfo() {
     const localeInfo = useLocaleInfo();

package/dist/components/AccountVerification/AccountVerification.js

@@ -13,6 +13,7 @@ import { FaceIdIcon } from '../../icons/FaceIdIcon.js';
 import { FileCheck02Icon } from '../../icons/FileCheck02Icon.js';
 import { FileSearch02Icon } from '../../icons/FileSearch02Icon.js';
 import { FileX02Icon } from '../../icons/FileX02Icon.js';
+import { Spinner02Icon } from '../../icons/Spinner02Icon.js';
 import { Button } from '../../ui/Button/index.js';
 export function AccountVerification(props) {
     const globalStore = useGlobalStore(useShallow((ctx) => ({
@@ -28,8 +29,10 @@ export function AccountVerification(props) {
     const empty = verification == null;
     const pending = verification?.status === 'PENDING';
     const success = verification?.status === 'VERIFIED' || verification?.status === 'APPROVED';
-    const failed = verification?.status === 'REJECTED' ||
-        verification?.status === 'UNVERIFIED';
+    const failed = verification?.status === 'REJECTED';
+    if (verificationQuery.isLoading) {
+        return _jsx(Spinner02Icon, { className: "text-text-brand-primary-600 size-5" });
+    }
     return (_jsxs("div", { className: props.className, children: [_jsxs("div", { className: "flex items-start gap-8", children: [_jsxs("div", { className: "grow", children: [_jsx("h2", { className: "text-text-secondary-700 text-sm font-semibold", children: "Verify your identity" }), _jsx("p", { className: "text-text-tertiary-600 text-sm", children: "Complete personal verification to unlock all features and enhance account security." })] }), _jsx(ark.svg, { asChild: true, className: twMerge('size-6', profileCompletion?.accountVerification
                             ? 'text-text-success-primary'
                             : 'text-text-warning-primary'), children: profileCompletion?.accountVerification ? (_jsx(CheckVerified02Icon, {})) : (_jsx(AlertCircleIcon, {})) })] }), _jsxs("div", { className: "shadow-xs border-border-secondary bg-bg-primary-alt mt-5 rounded-xl border", children: [_jsx("div", { className: "px-4 py-5", children: _jsxs("ul", { className: "space-y-lg", children: [_jsxs("li", { className: "text-text-secondary-700 icon:size-6 icon:text-text-nav-item-button-icon flex items-center gap-lg", children: [_jsx(FileCheck02Icon, {}), "Basic Information"] }), _jsxs("li", { className: "text-text-secondary-700 icon:size-6 icon:text-text-nav-item-button-icon flex items-center gap-lg", children: [_jsx(CreditCard02Icon, {}), "Government ID"] }), _jsxs("li", { className: "text-text-secondary-700 icon:size-6 icon:text-text-nav-item-button-icon flex items-center gap-lg", children: [_jsx(FaceIdIcon, {}), "Facial Verification"] })] }) }), !isKycCompleted && (_jsx("div", { className: "border-border-secondary flex justify-end border-t px-4 py-3 lg:py-xl", children: _jsx(Button, { size: "sm", className: "w-full lg:w-fit", onClick: () => globalStore.kyc.setOpen(true), children: "Verify Now" }) }))] }), success && _jsx(VerificationSuccess, {}), pending && _jsx(VerificationInProgress, {}), failed && _jsx(VerificationFailed, {}), empty && _jsx(VerificationNotSubmitted, {})] }));

package/dist/components/Banner/Banner.js

@@ -2,6 +2,7 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import emblaCarouselAutoplay from 'embla-carousel-autoplay';
 import useEmblaCarousel, {} from 'embla-carousel-react';
+import isMobile from 'is-mobile';
 import Image from 'next/image';
 import Link from 'next/link';
 import { Fragment, useEffect, useState } from 'react';
@@ -30,7 +31,7 @@ export function Banner(props) {
         };
     }, [emblaApi]);
     return (_jsxs("div", { className: twMerge('relative', props.className), children: [_jsx("div", { ref: emblaRef, className: "overflow-hidden", children: _jsx("div", { className: "flex gap-2", children: props.banners.map((banner, index) => {
-                        const img = (_jsx(Image, { src: banner.src, alt: "", width: 1200, height: 300, className: "block h-auto w-full rounded-xl", priority: index === 0 }));
+                        const img = (_jsx(Image, { src: banner.src, alt: "", width: isMobile() ? 400 : 1200, height: isMobile() ? 225 : 300, className: "block h-auto w-full", priority: index === 0 }));
                         return (_jsx(Fragment, { children: !banner.redirectUrl ? (_jsx("div", { className: "w-full shrink-0", children: img })) : (_jsx(Link, { href: banner.redirectUrl, className: "block w-full shrink-0", "aria-label": `Open ${banner.redirectUrl}`, children: img })) }, index));
                     }) }) }), _jsx("div", { className: "absolute bottom-lg left-1/2 flex w-fit -translate-x-1/2 gap-2", children: props.banners.map((_, index) => (_jsx("button", { type: "button", className: "ui-active:bg-brand-500 bg-gray-300 size-3 shrink-0 rounded-full border border-white transition-all duration-300 ui-active:w-9", onClick: () => {
                         emblaApi?.scrollTo(index);

package/dist/components/BetRecords/BetRecords.client.d.ts

@@ -16,5 +16,9 @@ export interface BetRecordsProps {
      */
     gameProvidersGroup?: Partial<Record<GameType, GameProvider[]>>;
     className?: string;
+    placeholder?: {
+        gameProvider?: string;
+        status?: string;
+    };
 }
 export declare function BetRecords__client(props: BetRecordsProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/BetRecords/BetRecords.client.js

@@ -137,7 +137,7 @@ export function BetRecords__client(props) {
                             });
                         }, lazyMount: true, deselectable: true, positioning: {
                             sameWidth: true,
-                        }, children: [_jsxs(Select.Trigger, { className: "w-full lg:w-[14rem]", children: [_jsx(Select.ValueText, { placeholder: "Game Vendor" }), _jsx(Select.Context, { children: (api) => (_jsx(_Fragment, { children: api.value.length ? (_jsx(Select.ClearTrigger, { asChild: true, children: _jsx("span", { onClick: (e) => {
+                        }, children: [_jsxs(Select.Trigger, { className: "w-full lg:w-[14rem]", children: [_jsx(Select.ValueText, { placeholder: props.placeholder?.gameProvider ?? 'Game Vendor' }), _jsx(Select.Context, { children: (api) => (_jsx(_Fragment, { children: api.value.length ? (_jsx(Select.ClearTrigger, { asChild: true, children: _jsx("span", { onClick: (e) => {
                                                         e.stopPropagation();
                                                     }, children: "Clear" }) })) : (_jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })) })) })] }), _jsx(Portal, { children: _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: _jsx(Select.ItemGroup, { children: providerCollection.items.map((provider) => (_jsxs(Select.Item, { item: provider, children: [_jsx(Select.ItemText, { children: provider.name }), _jsx(Select.ItemIndicator, { asChild: true, children: _jsx(CheckIcon, {}) })] }, provider.id))) }) }) }) })] }), _jsxs(Select.Root, { collection: statusCollection, value: state.status ? [state.status] : [], onValueChange: (details) => {
                             const value = z
@@ -149,7 +149,7 @@ export function BetRecords__client(props) {
                             });
                         }, lazyMount: true, deselectable: true, positioning: {
                             sameWidth: true,
-                        }, children: [_jsxs(Select.Trigger, { className: "w-full lg:w-[14rem]", children: [_jsx(Select.ValueText, { placeholder: "Status" }), _jsx(Select.Context, { children: (api) => (_jsx(_Fragment, { children: api.value.length ? (_jsx(Select.ClearTrigger, { asChild: true, children: _jsx("span", { onClick: (e) => {
+                        }, children: [_jsxs(Select.Trigger, { className: "w-full lg:w-[14rem]", children: [_jsx(Select.ValueText, { placeholder: props.placeholder?.status ?? 'Status' }), _jsx(Select.Context, { children: (api) => (_jsx(_Fragment, { children: api.value.length ? (_jsx(Select.ClearTrigger, { asChild: true, children: _jsx("span", { onClick: (e) => {
                                                         e.stopPropagation();
                                                     }, children: "Clear" }) })) : (_jsx(Select.Indicator, { asChild: true, children: _jsx(ChevronDownIcon, {}) })) })) })] }), _jsx(Portal, { children: _jsx(Select.Positioner, { children: _jsx(Select.Content, { children: _jsx(Select.ItemGroup, { children: statusCollection.items.map((status) => (_jsxs(Select.Item, { item: status, children: [_jsx(Select.ItemText, { children: capitalize(status, {
                                                             delimiter: capitalize.delimiters.UNDERSCORE,

package/dist/components/Bonuses/Bonuses.client.js

@@ -102,22 +102,27 @@ function CashbackBonus(props) {
             });
         },
     });
-    const balance = parseDecimal(bonus.balance, 0);
-    const total = parseDecimal(bonus.total, 0);
+    const currentAccumulatedCashbackAmount = parseDecimal(bonus.balance, 0);
+    const totalAccumulatedCashbackAmount = parseDecimal(bonus.total, 0);
     const minimumCashback = parseDecimal(props.data.cashback.minimumCashback, 0);
-    const maximumMonthlyCashback = parseDecimal(props.data.cashback.maximumMonthlyCashback, 0);
-    const disabled = balance <= 0 || total > maximumMonthlyCashback || balance < minimumCashback;
+    const maximumMonthlyCashbackLimit = parseDecimal(props.data.cashback.maximumMonthlyCashback, 0);
+    const hasNoCashback = currentAccumulatedCashbackAmount <= 0;
+    const hasReachedOrExceededMonthlyLimit = totalAccumulatedCashbackAmount >= maximumMonthlyCashbackLimit;
+    const belowMinimumCashbackThreshold = currentAccumulatedCashbackAmount < minimumCashback;
+    const disabled = hasNoCashback ||
+        hasReachedOrExceededMonthlyLimit ||
+        belowMinimumCashbackThreshold;
     return (_jsxs("div", { className: "border-border-primary bg-bg-tertiary flex flex-col overflow-hidden rounded-2xl border", children: [cashback.banner?.url ? (_jsx(Image, { src: cashback.banner.url, alt: "", width: 400, height: 200, className: "h-[11.25rem] w-full object-cover" })) : (_jsx("div", { style: {
                     background: 'radial-gradient(75.21% 75.21% at 50% 50%, rgba(249, 163, 8, 0.3) 0%, rgba(0, 0, 0, 0) 100%), var(--color-bg-primary-alt)',
-                }, children: _jsx(Image, { src: moneyOnHand, alt: "", className: "mx-auto h-[11.25rem] w-auto shrink-0 object-cover", draggable: false, width: 600, height: 600 }) })), _jsxs("div", { className: "flex grow flex-col px-xl py-3xl", children: [_jsx("p", { className: "line-clamp-1 text-center text-xl font-semibold text-white", children: cashback.name }), _jsx("h2", { className: "mt-2 text-center text-3xl font-semibold text-white", children: formatNumber(bonus.balance, {
+                }, children: _jsx(Image, { src: moneyOnHand, alt: "", className: "mx-auto h-[11.25rem] w-auto shrink-0 object-cover", draggable: false, width: 600, height: 600 }) })), _jsxs("div", { className: "flex grow flex-col px-xl py-3xl", children: [_jsx("p", { className: "line-clamp-1 text-center text-xl font-semibold text-white", children: cashback.name }), _jsx("h2", { className: "mt-2 text-center text-3xl font-semibold text-white", children: formatNumber(currentAccumulatedCashbackAmount, {
                             currency: localeInfo.currency.code,
                         }) }), _jsx("div", { className: "text-text-secondary-700 mt-2 line-clamp-1 text-center text-sm", dangerouslySetInnerHTML: {
                             __html: cashback.description,
                         } }), _jsx("div", { className: "grow" }), disabled ? (_jsxs(Popover.Root, { lazyMount: true, unmountOnExit: true, positioning: {
                             placement: 'top',
-                        }, children: [_jsx(Button, { size: "sm", className: "mt-6", "aria-disabled": true, asChild: true, children: _jsx(Popover.Trigger, { children: "Claim" }) }), _jsx(Popover.Positioner, { children: _jsxs(Popover.Content, { className: "bg-bg-quaternary rounded-md px-2.5 py-2 text-sm font-medium", children: [_jsx(Popover.Arrow, { className: "arrow-bg-bg-quaternary arrow-size-3", children: _jsx(Popover.ArrowTip, {}) }), "You need", ' ', formatNumber(minimumCashback - balance, {
-                                            currency: localeInfo.currency.code,
-                                        }), ' ', "to claim this cashback."] }) })] })) : (_jsx(Button, { size: "sm", className: "mt-6", disabled: claimCashbackBonusMutation.isPending || disabled, onClick: () => {
+                        }, children: [_jsx(Button, { size: "sm", className: "mt-6", "aria-disabled": true, asChild: true, children: _jsx(Popover.Trigger, { children: "Claim" }) }), _jsx(Popover.Positioner, { children: _jsxs(Popover.Content, { className: "bg-bg-quaternary rounded-md px-2.5 py-2 text-sm font-medium", children: [_jsx(Popover.Arrow, { className: "arrow-bg-bg-quaternary arrow-size-3", children: _jsx(Popover.ArrowTip, {}) }), hasReachedOrExceededMonthlyLimit ? (_jsx(_Fragment, { children: "You've claimed the maximum cashback for this month." })) : (_jsxs(_Fragment, { children: ["You need", ' ', formatNumber(minimumCashback - currentAccumulatedCashbackAmount, {
+                                                    currency: localeInfo.currency.code,
+                                                }), ' ', "to claim this cashback."] }))] }) })] })) : (_jsx(Button, { size: "sm", className: "mt-6", disabled: claimCashbackBonusMutation.isPending || disabled, onClick: () => {
                             claimCashbackBonusMutation.mutate(bonus.id);
                         }, children: "Claim" }))] })] }));
 }

package/dist/components/GameLaunch/GameLaunchTrigger.js

@@ -6,6 +6,8 @@ import { useCreateGameSessionMutation } from '../../client/hooks/useCreateGameSe
 import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
 import { useSessionQuery } from '../../client/hooks/useSessionQuery.js';
 import { toaster } from '../../client/utils/toaster.js';
+import { GAMES_AVAILABLE_3PM_TO_3AM } from '../../utils/gamesAvailable3pmTo3am.js';
+import { isBetween3amAnd3pm } from '../../utils/isBetween3amAnd3pm.js';
 export function GameLaunchTrigger(props) {
     const sessionQuery = useSessionQuery();
     const createGameSessionMutation = useCreateGameSessionMutation();
@@ -25,6 +27,11 @@ export function GameLaunchTrigger(props) {
             : globalStore.gameLaunch.details.status === 'WAITING'
                 ? 'closed'
                 : 'open', ...props, disabled: disabled, onClick: async (e) => {
+            // prevent game launch for games that are only available between 3 PM and 3 AM
+            if (!isBetween3amAnd3pm() &&
+                GAMES_AVAILABLE_3PM_TO_3AM.includes(props.game.name)) {
+                return;
+            }
             if (sessionQuery.data?.status === 'unauthenticated') {
                 globalStore.signIn.setOpen(true);
                 return props.onClick?.(e);

package/dist/components/GameProviders/GameProvidersCarousel.js

@@ -37,8 +37,8 @@ export function GameProvidersCarousel(props) {
     const viewGamesUrl = (data) => {
         return props.viewGamesUrl
             ? callIfFn(props.viewGamesUrl, data)
-                .replace(':id', data.id)
-                .replace(':slug', data.slug)
+                .replace(':id', data?.id)
+                .replace(':slug', data?.slug)
             : `/providers/${data.slug}`;
     };
     const gameProviders = props.gameProviders.map((provider) => GAME_PROVIDER_DATA[provider]);