@opexa/portal-components 0.0.957 → 0.0.958

package/dist/lib/components/NewsFeed/NewsFeed.js

@@ -0,0 +1,11 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { NewsFeedCarousel, } from './NewsFeedCarousel.js';
+import { NewsFeedList } from './NewsFeedList.js';
+export async function NewsFeed(props) {
+    if (props.layout === 'list') {
+        return _jsx(NewsFeedList, { ...props });
+    }
+    else {
+        return _jsx(NewsFeedCarousel, { ...props });
+    }
+}

package/dist/lib/components/NewsFeed/NewsFeedCarousel.d.ts

@@ -0,0 +1,21 @@
+import { type CSSProperties, type ReactNode } from 'react';
+import type { News as TNews } from '../../types';
+export interface NewsFeedCarouselProps {
+    layout: 'carousel';
+    newsFeed: TNews[];
+    /** @default 'News' */
+    heading?: string | ReactNode;
+    /** @default '/news' */
+    viewAllUrl?: string;
+    /**
+     * @default '/news'
+     * @example
+     * ```ts
+     * '/custom-path' // '/custom-path/123'
+     * ```
+     */
+    viewDetailsUrl?: string;
+    className?: string;
+    style?: CSSProperties;
+}
+export declare function NewsFeedCarousel(props: NewsFeedCarouselProps): import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/NewsFeed/NewsFeedCarousel.js

@@ -0,0 +1,45 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import useEmblaCarousel, {} from 'embla-carousel-react';
+import Link from 'next/link';
+import { useCallback, useEffect, useState } from 'react';
+import { twMerge } from 'tailwind-merge';
+import { ArrowLeftIcon } from '../../icons/ArrowLeftIcon.js';
+import { ArrowRightIcon } from '../../icons/ArrowRightIcon.js';
+import { ChevronRightIcon } from '../../icons/ChevronRightIcon.js';
+import { Tv03Icon } from '../../icons/Tv03Icon.js';
+import { Button } from '../../ui/Button/index.js';
+import { Empty } from '../shared/Empty.js';
+import { News } from './News.js';
+export function NewsFeedCarousel(props) {
+    const empty = props.newsFeed.length <= 0;
+    const heading = props.heading ?? 'News';
+    const viewAllUrl = props.viewAllUrl ?? '/news';
+    const viewDetailsUrl = props.viewDetailsUrl ?? '/news';
+    const [emblaRef, emblaApi] = useEmblaCarousel({
+        align: 'start',
+        slidesToScroll: 1,
+        breakpoints: {
+            '(min-width: 1024px)': {
+                slidesToScroll: 3,
+            },
+        },
+    });
+    const [prevBtnDisabled, setPrevBtnDisabled] = useState(true);
+    const [nextBtnDisabled, setNextBtnDisabled] = useState(true);
+    const onPrevButtonClick = useCallback(() => emblaApi?.scrollPrev(), [emblaApi]);
+    const onNextButtonClick = useCallback(async () => {
+        emblaApi?.scrollNext();
+    }, [emblaApi]);
+    const onSelect = useCallback((emblaApi) => {
+        setPrevBtnDisabled(!emblaApi?.canScrollPrev());
+        setNextBtnDisabled(!emblaApi?.canScrollNext());
+    }, []);
+    useEffect(() => {
+        if (!emblaApi)
+            return;
+        onSelect(emblaApi);
+        emblaApi.on('reInit', onSelect).on('select', onSelect);
+    }, [emblaApi, onSelect]);
+    return (_jsxs("div", { style: props.style, className: props.className, children: [_jsxs("div", { className: "flex items-center", children: [_jsx("h2", { className: "font-semibold text-lg", children: heading }), _jsx("div", { className: "grow" }), _jsxs("div", { className: "flex items-center justify-center gap-xl", children: [_jsxs(Link, { href: viewAllUrl, className: "flex gap-sm font-semibold text-button-tertiary-fg text-sm", children: ["See All", _jsx(ChevronRightIcon, { className: "size-5 lg:hidden" })] }), _jsxs("div", { className: "hidden lg:flex", children: [_jsx(Button, { variant: "outline", colorScheme: "gray", className: "rounded-r-none border-r-0", onClick: onPrevButtonClick, disabled: prevBtnDisabled, "aria-label": "Previous", children: _jsx(ArrowLeftIcon, { className: "size-5" }) }), _jsx(Button, { variant: "outline", colorScheme: "gray", className: "rounded-l-none", onClick: onNextButtonClick, disabled: nextBtnDisabled, "aria-label": "Next", children: _jsx(ArrowRightIcon, { className: "size-5" }) })] })] })] }), empty && (_jsx(Empty, { icon: Tv03Icon, title: "No News", message: "No news is currently available.", className: "mt-8" })), !empty && (_jsx("div", { ref: emblaRef, className: "relative mt-lg lg:overflow-hidden", children: _jsx("div", { className: twMerge('grid auto-cols-[100%] grid-flow-col gap-1.5 lg:auto-cols-[calc((100%-(1.25rem*2))/3)] lg:gap-2xl'), children: props.newsFeed.map((news) => (_jsx(News, { news: news, viewDetailsUrl: viewDetailsUrl }, news.id))) }) }))] }));
+}

package/dist/lib/components/NewsFeed/NewsFeedList.d.ts

@@ -0,0 +1,19 @@
+import type { CSSProperties, ReactNode } from 'react';
+import type { News as TNews } from '../../types';
+export interface NewsFeedListProps {
+    layout: 'list';
+    newsFeed: TNews[];
+    /** @default 'News' */
+    heading?: string | ReactNode;
+    /**
+     * @default '/news'
+     * @example
+     * ```ts
+     * '/custom-path' // '/custom-path/123'
+     * ```
+     */
+    viewDetailsUrl?: string;
+    className?: string;
+    style?: CSSProperties;
+}
+export declare function NewsFeedList(props: NewsFeedListProps): import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/NewsFeed/NewsFeedList.js

@@ -0,0 +1,10 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Tv03Icon } from '../../icons/Tv03Icon.js';
+import { Empty } from '../shared/Empty.js';
+import { News } from './News.js';
+export function NewsFeedList(props) {
+    const empty = props.newsFeed.length <= 0;
+    const heading = props.heading ?? 'News';
+    const viewDetailsUrl = props.viewDetailsUrl ?? '/news';
+    return (_jsxs("div", { style: props.style, className: props.className, children: [_jsx("h2", { className: "font-semibold text-lg", children: heading }), empty && (_jsx(Empty, { icon: Tv03Icon, title: "No News", message: "No news is currently available.", className: "mt-8" })), !empty && (_jsx("div", { className: "mt-lg grid gap-3xl lg:grid-cols-3 lg:gap-2xl", children: props.newsFeed.map((news) => (_jsx(News, { news: news, viewDetailsUrl: viewDetailsUrl }, news.id))) }))] }));
+}

package/dist/lib/components/NewsFeed/index.d.ts

@@ -0,0 +1 @@
+export * from './NewsFeed';

package/dist/lib/components/NewsFeed/index.js

@@ -0,0 +1 @@
+export * from './NewsFeed.js';

package/dist/lib/components/Onboarding/Onboarding.d.ts

@@ -0,0 +1 @@
+export declare function Onboarding(): import("react/jsx-runtime").JSX.Element | null;

package/dist/lib/components/Onboarding/Onboarding.js

@@ -0,0 +1,16 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import dynamic from 'next/dynamic';
+import { useShallow } from 'zustand/shallow';
+import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
+const OnboardingV1 = dynamic(() => import('./OnboardingV1.lazy.js').then((m) => m.Onboarding), {
+    ssr: false,
+    loading: () => null,
+});
+export function Onboarding() {
+    const touched = useGlobalStore(useShallow((ctx) => ctx.onboarding['~touched']));
+    if (!touched) {
+        return null;
+    }
+    return _jsx(OnboardingV1, {});
+}

package/dist/lib/components/Onboarding/OnboardingV1.lazy.d.ts

@@ -0,0 +1 @@
+export declare function Onboarding(): import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/Onboarding/OnboardingV1.lazy.js

@@ -0,0 +1,127 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import Image from 'next/image';
+import { useEffect, useState } from 'react';
+import { twMerge } from 'tailwind-merge';
+import { useShallow } from 'zustand/shallow';
+import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
+import firstStepBackground from '../../images/first-step-background.png';
+import fourthStepBackground from '../../images/fourth-step-background.png';
+import secondStepBackground from '../../images/second-step-background.png';
+import thirdStepBackground from '../../images/third-step-background.png';
+import { Dialog } from '../../ui/Dialog/index.js';
+import { Portal } from '../../ui/Portal/index.js';
+const AnimatedHeader = ({ text }) => {
+    if (text === '88PLAY') {
+        return (_jsx("div", { className: "relative", children: _jsxs("h1", { className: "venus-rising flex items-center font-bold text-4xl drop-shadow-lg", children: [_jsx("span", { className: "text-transparent", style: {
+                            backgroundImage: 'linear-gradient(to right, #B59440, #6A4C1A, #BD9B4D, #6A4C1A, #B99D47)',
+                            backgroundSize: '300% 100%',
+                            animation: 'gradient 8s linear infinite',
+                            backgroundClip: 'text',
+                            WebkitBackgroundClip: 'text',
+                        }, children: "88" }), _jsx("span", { className: "ml-2 text-white", children: "PLAY" })] }) }));
+    }
+    if (text === 'Secured Transactions') {
+        return (_jsx("div", { className: "relative", children: _jsxs("div", { className: "venus-rising text-center font-bold drop-shadow-lg", children: [_jsx("div", { className: "text-4xl text-transparent", style: {
+                            backgroundImage: 'linear-gradient(to right, #B59440, #6A4C1A, #BD9B4D, #6A4C1A, #B99D47)',
+                            backgroundSize: '300% 100%',
+                            animation: 'gradient 8s linear infinite',
+                            backgroundClip: 'text',
+                            WebkitBackgroundClip: 'text',
+                        }, children: "SECURED" }), _jsx("div", { className: "text-3xl text-transparent", style: {
+                            backgroundImage: 'linear-gradient(to right, #B59440, #6A4C1A, #BD9B4D, #6A4C1A, #B99D47)',
+                            backgroundSize: '300% 100%',
+                            animation: 'gradient 8s linear infinite',
+                            backgroundClip: 'text',
+                            WebkitBackgroundClip: 'text',
+                        }, children: "TRANSACTIONS" })] }) }));
+    }
+    return (_jsx("div", { className: "relative", children: _jsx("h1", { className: "venus-rising font-bold text-4xl text-transparent drop-shadow-lg", style: {
+                backgroundImage: 'linear-gradient(to right, #B59440, #6A4C1A, #BD9B4D, #6A4C1A, #B99D47)',
+                backgroundSize: '300% 100%',
+                animation: 'gradient 8s linear infinite',
+                backgroundClip: 'text',
+                WebkitBackgroundClip: 'text',
+            }, children: text }) }));
+};
+const carouselData = [
+    {
+        background: firstStepBackground,
+        headerText: '88PLAY',
+        description: 'Welcome to 88Play! your trusted PAGCOR-licensed online casino where every player is treated like a VIP and the fun never stops!',
+    },
+    {
+        background: secondStepBackground,
+        headerText: 'NEW GAMES',
+        description: 'Discover our latest casino titles, bringing you fresh excitement and more ways to win every time you play.',
+    },
+    {
+        background: thirdStepBackground,
+        headerText: 'Secured Transactions',
+        description: 'Enjoy fast, secure, and hassle-free deposits and withdrawals with trusted local payment options.',
+    },
+    {
+        background: fourthStepBackground,
+        headerText: 'Bonuses',
+        description: 'Unlock exciting rewards and exclusive promotions designed to boost your gaming experience.',
+    },
+];
+const CardStepper = ({ data }) => {
+    return (_jsxs("div", { className: "w-full", children: [_jsx("div", { className: "h-auto w-full", children: _jsx(Image, { src: data.background, alt: "Step Background", className: "h-auto w-full object-cover" }) }), _jsx("div", { className: "mt-4 flex h-auto w-full items-center justify-center", children: _jsx(AnimatedHeader, { text: data.headerText }) }), _jsx("div", { className: "mt-4 px-5 text-center text-sm text-white/50", children: data.description })] }));
+};
+const OnboardingCarousel = () => {
+    const [currentStep, setCurrentStep] = useState(0);
+    const globalStore = useGlobalStore(useShallow((ctx) => ({
+        onboarding: ctx.onboarding,
+    })));
+    const nextStep = () => {
+        setCurrentStep((prev) => (prev + 1) % carouselData.length);
+    };
+    const goToStep = (step) => {
+        setCurrentStep(step);
+    };
+    const handleContinue = () => {
+        if (currentStep === carouselData.length - 1) {
+            // Last step - close dialog
+            globalStore.onboarding.setOpen(false);
+        }
+        else {
+            // Not last step - go to next
+            nextStep();
+        }
+    };
+    const handleSkip = () => {
+        // Skip always closes dialog
+        globalStore.onboarding.setOpen(false);
+    };
+    useEffect(() => {
+        const interval = setInterval(() => {
+            setCurrentStep((prev) => (prev + 1) % carouselData.length);
+        }, 5000);
+        return () => clearInterval(interval);
+    }, []);
+    return (_jsxs("div", { className: "mb-5 w-full", children: [_jsx("div", { className: "relative overflow-hidden", children: _jsx("div", { className: "flex transition-transform duration-300 ease-in-out", style: { transform: `translateX(-${currentStep * 100}%)` }, children: carouselData.map((stepData, index) => (_jsx("div", { className: "w-full flex-shrink-0", children: _jsx(CardStepper, { data: stepData }) }, index))) }) }), _jsx("div", { className: "mt-4 flex justify-center px-5", children: _jsx("div", { className: "flex space-x-2", children: carouselData.map((_, index) => (_jsx("button", { type: "button", onClick: () => goToStep(index), className: twMerge('h-2 rounded-full transition-all duration-300', index === currentStep ? 'w-5 bg-yellow-400' : 'w-2 bg-white/30'), "aria-label": `Go to step ${index + 1}` }, index))) }) }), _jsxs("div", { className: "mt-6 flex gap-3 px-5", children: [_jsx("button", { type: "button", onClick: handleSkip, className: "flex-1 rounded-lg border border-yellow-400/50 bg-transparent py-3 font-medium text-sm text-yellow-400 hover:bg-yellow-400/10", children: "Skip" }), _jsx("button", { type: "button", onClick: handleContinue, className: "flex-1 rounded-lg bg-yellow-400 py-3 font-medium text-black text-sm hover:bg-yellow-500", children: currentStep === carouselData.length - 1 ? 'Play Now' : 'Continue' })] })] }));
+};
+export function Onboarding() {
+    const globalStore = useGlobalStore(useShallow((ctx) => ({
+        signIn: ctx.signIn,
+        signUp: ctx.signUp,
+        disclaimer: ctx.disclaimer,
+        onboarding: ctx.onboarding,
+    })));
+    return (_jsx(Dialog.Root, { open: globalStore.onboarding.open, onOpenChange: (details) => {
+            globalStore.onboarding.setOpen(details.open);
+            if (!details.open)
+                globalStore.onboarding.setAccepted(true);
+        }, lazyMount: true, unmountOnExit: true, closeOnEscape: false, closeOnInteractOutside: false, onExitComplete: () => {
+            if (globalStore.onboarding.next === 'SIGN_IN') {
+                globalStore.signIn.setOpen(true);
+            }
+            if (globalStore.onboarding.next === 'SIGN_UP') {
+                globalStore.signUp.setOpen(true);
+            }
+            if (globalStore.onboarding.next === 'DISCLAIMER') {
+                globalStore.disclaimer.setOpen(true);
+            }
+            globalStore.onboarding.setNext(null);
+        }, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "z-popover" }), _jsx(Dialog.Positioner, { className: "z-popover", children: _jsx(Dialog.Content, { className: twMerge('flex h-full w-full flex-col items-start overflow-y-auto lg:mx-auto lg:h-auto lg:max-h-[80vh] lg:w-[400px]', 'scrollbar:h-2 scrollbar:w-2 scrollbar-thumb:rounded-full scrollbar-thumb:bg-bg-quaternary scrollbar-track:bg-transparent'), children: _jsx(OnboardingCarousel, {}) }) })] }) }));
+}

package/dist/lib/components/Onboarding/index.d.ts

@@ -0,0 +1 @@
+export * from './Onboarding';

package/dist/lib/components/Onboarding/index.js

@@ -0,0 +1 @@
+export * from './Onboarding.js';

package/dist/lib/components/PortalProvider/AddSafeArea.d.ts

@@ -0,0 +1 @@
+export declare function AddSafeArea(): null;

package/dist/lib/components/PortalProvider/AddSafeArea.js

@@ -0,0 +1,24 @@
+'use client';
+import { SafeArea } from 'capacitor-plugin-safe-area';
+import { useEffect } from 'react';
+export function AddSafeArea() {
+    useEffect(() => {
+        (async () => {
+            const { insets } = await SafeArea.getSafeAreaInsets();
+            for (const [key, value] of Object.entries(insets)) {
+                document.documentElement.style.setProperty(`--safe-area-inset-${key}`, `${value}px`);
+            }
+        })();
+        // Optionally listen for changes (e.g. on rotation)
+        const listener = SafeArea.addListener('safeAreaChanged', (data) => {
+            const { insets } = data;
+            for (const [key, value] of Object.entries(insets)) {
+                document.documentElement.style.setProperty(`--safe-area-inset-${key}`, `${value}px`);
+            }
+        });
+        return () => {
+            listener.then((l) => l.remove());
+        };
+    }, []);
+    return null;
+}

package/dist/lib/components/PortalProvider/AndroidRoutingHandler.d.ts

@@ -0,0 +1 @@
+export declare const AndroidRoutingHandler: () => null;

package/dist/lib/components/PortalProvider/AndroidRoutingHandler.js

@@ -0,0 +1,22 @@
+'use client';
+import { App } from '@capacitor/app';
+import { usePathname, useRouter } from 'next/navigation';
+import { useEffect } from 'react';
+export const AndroidRoutingHandler = () => {
+    const router = useRouter();
+    const pathname = usePathname();
+    useEffect(() => {
+        App.addListener('backButton', () => {
+            if (pathname !== '/') {
+                router.back();
+            }
+            else {
+                App.exitApp(); // Exit app on Android when at root
+            }
+        });
+        return () => {
+            App.removeAllListeners();
+        };
+    }, [router, pathname]);
+    return null;
+};

package/dist/lib/components/PortalProvider/AppOnlyComponents.d.ts

@@ -0,0 +1 @@
+export declare function AppOnlyComponents(): import("react/jsx-runtime").JSX.Element | null;

package/dist/lib/components/PortalProvider/AppOnlyComponents.js

@@ -0,0 +1,21 @@
+'use client';
+import { jsx as _jsx, Fragment as _Fragment, jsxs as _jsxs } from "react/jsx-runtime";
+import { Capacitor } from '@capacitor/core';
+import { SplashScreen } from '@capacitor/splash-screen';
+import { useEffect } from 'react';
+import { Protected } from '../Protected/index.js';
+import { AddSafeArea } from './AddSafeArea.js';
+import { AndroidRoutingHandler } from './AndroidRoutingHandler.js';
+import PushNotification from './PushNotifications.js';
+export function AppOnlyComponents() {
+    const platform = Capacitor.getPlatform();
+    const isNative = platform === 'android' || platform === 'ios';
+    useEffect(() => {
+        if (isNative) {
+            SplashScreen.hide();
+        }
+    }, [isNative]);
+    if (!isNative)
+        return null;
+    return (_jsxs(_Fragment, { children: [_jsx(Protected, { children: _jsx(PushNotification, {}) }), _jsx(AndroidRoutingHandler, {}), _jsx(AddSafeArea, {})] }));
+}

package/dist/lib/components/PortalProvider/FeatureFlag.d.ts

@@ -0,0 +1 @@
+export declare function FeatureFlag(): import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/PortalProvider/FeatureFlag.js

@@ -0,0 +1,34 @@
+'use client';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { usePathname, useRouter, useSearchParams } from 'next/navigation';
+import { useCallback, useEffect } from 'react';
+import { useFeatureFlag } from '../../client/hooks/useFeatureFlag.js';
+import { Portal } from '../../ui/Portal/index.js';
+import { Presence } from '../../ui/Presence/index.js';
+export function FeatureFlag() {
+    const router = useRouter();
+    const pathname = usePathname();
+    const searchParams = useSearchParams();
+    const featureFlag = useFeatureFlag();
+    useEffect(() => {
+        if (searchParams.has('future')) {
+            featureFlag.enable();
+        }
+    }, [featureFlag, searchParams]);
+    const removeFutureParam = useCallback(() => {
+        return new Promise((resolve) => {
+            if (!searchParams.has('future'))
+                return resolve();
+            const newSearchParams = new URLSearchParams(searchParams);
+            newSearchParams.delete('future');
+            router.replace(`${pathname}?${newSearchParams.toString()}`, {
+                scroll: false,
+            });
+            setTimeout(resolve, 250);
+        });
+    }, [pathname, router, searchParams]);
+    return (_jsx(Portal, { children: _jsx(Presence, { present: featureFlag.enabled, asChild: true, children: _jsx("div", { className: "fixed bottom-3 flex w-full flex-col items-center justify-center", children: _jsxs("div", { className: "rounded-full bg-black/50 px-2 py-1 text-sm leading-none backdrop-blur-md", children: ["Experimental features are enabled.", ' ', _jsx("button", { type: "button", className: "cursor-pointer underline underline-offset-2", onClick: async () => {
+                                await removeFutureParam();
+                                await featureFlag.disable();
+                            }, children: "Disable" })] }) }) }) }));
+}

package/dist/lib/components/PortalProvider/PortalProvider.d.ts

@@ -0,0 +1,6 @@
+import { type ReactNode } from 'react';
+import { type ProvidersProps } from './Providers';
+export interface PortalProviderProps extends ProvidersProps {
+    children: ReactNode;
+}
+export declare function PortalProvider({ recaptchaSiteKey, isNonRegulated, children, }: PortalProviderProps): Promise<import("react/jsx-runtime").JSX.Element>;

package/dist/lib/components/PortalProvider/PortalProvider.js

@@ -0,0 +1,27 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { dehydrate, HydrationBoundary } from '@tanstack/react-query';
+import { Fragment, Suspense } from 'react';
+import { prefetchAccountQuery } from '../../server/utils/prefetchAccountQuery.js';
+import { prefetchPlatformQuery } from '../../server/utils/prefetchPlatformQuery.js';
+import { prefetchSessionQuery } from '../../server/utils/prefetchSessionQuery.js';
+import { prefetchWalletQuery } from '../../server/utils/prefetchWalletQuery.js';
+import { getQueryClient } from '../../utils/getQueryClient.js';
+import { AppOnlyComponents } from './AppOnlyComponents.js';
+import { FeatureFlag } from './FeatureFlag.js';
+import { Providers } from './Providers.js';
+import { SessionWatcher } from './SessionWatcher.js';
+import { SetupBtag } from './SetupBtag.js';
+import { SetupCellxpertCxd } from './SetupCellxpertCxd.js';
+import { SetupDomain } from './SetupDomain.js';
+import { Snackbar } from './Snackbar.js';
+import { SocialAccountLinkObserver } from './SocialAccountLinkObserver.js';
+export async function PortalProvider({ recaptchaSiteKey, isNonRegulated, children, }) {
+    const queryClient = getQueryClient();
+    await Promise.allSettled([
+        prefetchPlatformQuery(),
+        prefetchSessionQuery(),
+        prefetchAccountQuery(),
+        prefetchWalletQuery(),
+    ]);
+    return (_jsxs(Fragment, { children: [_jsx(Providers, { isNonRegulated: isNonRegulated, recaptchaSiteKey: recaptchaSiteKey, children: _jsxs(HydrationBoundary, { state: dehydrate(queryClient), children: [children, _jsx(SessionWatcher, {}), _jsx(Suspense, { children: _jsx(SetupDomain, {}) }), _jsx(Suspense, { children: _jsx(SetupCellxpertCxd, {}) }), _jsx(Suspense, { children: _jsx(SetupBtag, {}) }), _jsx(Suspense, { children: _jsx(AppOnlyComponents, {}) })] }) }), _jsx(Snackbar, {}), _jsx(Suspense, { children: _jsx(SocialAccountLinkObserver, {}) }), _jsx(Suspense, { children: _jsx(FeatureFlag, {}) })] }));
+}

package/dist/lib/components/PortalProvider/Providers.d.ts

@@ -0,0 +1,6 @@
+import { type PropsWithChildren } from 'react';
+export interface ProvidersProps {
+    recaptchaSiteKey?: string;
+    isNonRegulated?: boolean;
+}
+export declare function Providers({ recaptchaSiteKey, isNonRegulated, children, }: PropsWithChildren<ProvidersProps>): import("react/jsx-runtime").JSX.Element;

package/dist/lib/components/PortalProvider/Providers.js

@@ -0,0 +1,20 @@
+'use client';
+import { jsx as _jsx } from "react/jsx-runtime";
+import { QueryClientProvider } from '@tanstack/react-query';
+import { ReCaptchaProvider } from 'next-recaptcha-v3';
+import { useEffect } from 'react';
+import { useShallow } from 'zustand/shallow';
+import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
+import { getQueryClient } from '../../utils/getQueryClient.js';
+export function Providers({ recaptchaSiteKey, isNonRegulated, children, }) {
+    const queryClient = getQueryClient();
+    const setIsNonRegulated = useGlobalStore(useShallow((ctx) => ctx.setIsNonRegulated));
+    // set a global store to check if the platform is non regulated
+    // use this through out the components as a checker if we need to bypass kyc checks
+    useEffect(() => {
+        if (isNonRegulated) {
+            setIsNonRegulated(true);
+        }
+    }, [isNonRegulated, setIsNonRegulated]);
+    return (_jsx(QueryClientProvider, { client: queryClient, children: _jsx(ReCaptchaProvider, { reCaptchaKey: recaptchaSiteKey, children: children }) }));
+}

package/dist/lib/components/PortalProvider/PushNotifications.d.ts

@@ -0,0 +1,3 @@
+export declare const LOCALSTORAGE_PUSH_NOTIFICATION_TOKEN_KEY = "push-notication-token";
+export declare const PushNotification: () => null;
+export default PushNotification;

package/dist/lib/components/PortalProvider/PushNotifications.js

@@ -0,0 +1,68 @@
+'use client';
+import { App } from '@capacitor/app';
+import { Capacitor } from '@capacitor/core';
+import { PushNotifications } from '@capacitor/push-notifications';
+import { useEffect } from 'react';
+import { useSessionQuery } from '../../client/hooks/useSessionQuery.js';
+import { registerFCMDevice } from '../../services/trigger.js';
+export const LOCALSTORAGE_PUSH_NOTIFICATION_TOKEN_KEY = 'push-notication-token';
+export const PushNotification = () => {
+    const session = useSessionQuery();
+    useEffect(() => {
+        const platform = Capacitor.getPlatform();
+        if (platform === 'web')
+            return;
+        const checkAndRegister = async () => {
+            PushNotifications.requestPermissions().then((permission) => {
+                if (permission.receive === 'granted') {
+                    PushNotifications.register();
+                    console.info('✅ Push permission granted');
+                }
+                else {
+                    console.warn('⚠️ Push permission denied');
+                }
+            });
+        };
+        checkAndRegister();
+        App.addListener('resume', () => {
+            checkAndRegister();
+            console.log('App resumed - checking push notification permissions');
+        });
+        PushNotifications.addListener('registration', async ({ value }) => {
+            const pushToken = localStorage.getItem(LOCALSTORAGE_PUSH_NOTIFICATION_TOKEN_KEY);
+            if (pushToken === value) {
+                console.log('Push token already registered, skipping re-registration.');
+                return;
+            }
+            localStorage.setItem(LOCALSTORAGE_PUSH_NOTIFICATION_TOKEN_KEY, value);
+            if (session.data?.status === 'authenticated') {
+                console.log('registering push token with backend');
+                await registerFCMDevice({
+                    type: platform === 'android' ? 'ANDROID' : 'IOS',
+                    token: value,
+                }, {
+                    headers: {
+                        Authorization: `Bearer ${session.data.token}`,
+                    },
+                });
+            }
+        });
+        PushNotifications.addListener('registrationError', ({ error }) => {
+            console.error('🛑 Push registration failed:', error);
+        });
+        PushNotifications.addListener('pushNotificationReceived', (notification) => {
+            console.info('🚀 Push received');
+            console.info(JSON.stringify(notification));
+        });
+        PushNotifications.addListener('pushNotificationActionPerformed', (notification) => {
+            /* Perform some action here */
+            console.info('🚀 Push action performed');
+            console.info(JSON.stringify(notification));
+        });
+        return () => {
+            PushNotifications.removeAllListeners();
+        };
+    }, [session.data?.status, session.data?.token]);
+    return null;
+};
+export default PushNotification;

package/dist/lib/components/PortalProvider/SessionWatcher.d.ts

@@ -0,0 +1 @@
+export declare function SessionWatcher(): null;

package/dist/lib/components/PortalProvider/SessionWatcher.js

@@ -0,0 +1,40 @@
+'use client';
+import { useRouter } from 'next/navigation';
+import { useTimeout } from 'usehooks-ts';
+import { useShallow } from 'zustand/shallow';
+import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
+import { useSessionHealthQuery } from '../../client/hooks/useSessionHealthQuery.js';
+import { useSessionQuery } from '../../client/hooks/useSessionQuery.js';
+import { useSignOutMutation } from '../../client/hooks/useSignOutMutation.js';
+import { toaster } from '../../client/utils/toaster.js';
+export function SessionWatcher() {
+    const router = useRouter();
+    const sessionQuery = useSessionQuery();
+    const sessionHealthQuery = useSessionHealthQuery({
+        enabled: sessionQuery.data?.status === 'authenticated',
+        refetchInterval: 1000 * 5,
+    });
+    const { gameLaunch } = useGlobalStore(useShallow((ctx) => ({
+        gameLaunch: ctx.gameLaunch,
+    })));
+    const signOutMutation = useSignOutMutation({
+        onSuccess() {
+            if (gameLaunch.details.status === 'PLAYING') {
+                gameLaunch.setDetails({
+                    status: 'WAITING',
+                    session: null,
+                    game: null,
+                });
+            }
+            router.refresh();
+            router.push('/');
+            toaster.warning({
+                title: 'Logged Out',
+                description: 'Account accessed from a different device or browser.',
+            });
+        },
+    });
+    const healthy = sessionHealthQuery.data ?? true;
+    useTimeout(() => signOutMutation.mutate(), !healthy ? 250 : null);
+    return null;
+}

package/dist/lib/components/PortalProvider/SetupBtag.d.ts

@@ -0,0 +1 @@
+export declare function SetupBtag(): null;

package/dist/lib/components/PortalProvider/SetupBtag.js

@@ -0,0 +1,29 @@
+'use client';
+import { useSearchParams } from 'next/navigation';
+import { useTimeout } from 'usehooks-ts';
+import { z } from 'zod';
+import { useSessionQuery } from '../../client/hooks/useSessionQuery.js';
+import { useUpdateSessionMutation } from '../../client/hooks/useUpdateSessionMutation.js';
+const BtagSchema = z
+    .string()
+    .min(1)
+    .max(100)
+    .trim()
+    .optional()
+    .nullable()
+    .catch(null);
+export function SetupBtag() {
+    const query = useSessionQuery();
+    const mutation = useUpdateSessionMutation();
+    const params = useSearchParams();
+    useTimeout(() => {
+        const oldValue = query.data?.btag;
+        const newValue = BtagSchema.parse(params.get('btag'));
+        if (oldValue === newValue)
+            return;
+        if (!newValue)
+            return;
+        mutation.mutate({ btag: newValue });
+    }, query.data?.status === 'unauthenticated' ? 250 : null);
+    return null;
+}

package/dist/lib/components/PortalProvider/SetupCellxpertCxd.d.ts

@@ -0,0 +1 @@
+export declare function SetupCellxpertCxd(): null;