@opexa/portal-components 0.0.828 → 0.0.830

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

@@ -0,0 +1,5 @@
+export type BypassDomainConfig = {
+    domain: string;
+    isBypass: boolean;
+};
+export declare function useBypassKycChecker(bypassDomains: BypassDomainConfig[] | undefined): boolean;

package/dist/client/hooks/useBypassKycChecker.js

@@ -0,0 +1,14 @@
+'use client';
+import { useMemo } from 'react';
+export function useBypassKycChecker(bypassDomains) {
+    const isBypassKyc = useMemo(() => {
+        if (typeof window === 'undefined' ||
+            !bypassDomains ||
+            bypassDomains.length === 0) {
+            return false;
+        }
+        const host = window.location.hostname;
+        return bypassDomains.some(({ domain, isBypass }) => isBypass && host === domain);
+    }, [bypassDomains]);
+    return isBypassKyc;
+}

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/QRPHDepositContext.d.ts

@@ -1,6 +1,6 @@
 export declare const QRPHDepositContext: (props: {
     value: {
-        status: "confirmed" | "failed" | "idle" | "generating-qr-code" | "qr-code-generated";
+        status: "idle" | "confirmed" | "failed" | "generating-qr-code" | "qr-code-generated";
         deposit: import("../../../../types").Deposit | null;
         generateQRCode: (input: import("./useQRPHDeposit").GenerateQRCodeInput) => Promise<void>;
         regenerateQRCode: () => Promise<void>;
@@ -9,7 +9,7 @@ export declare const QRPHDepositContext: (props: {
 } & {
     children?: import("react").ReactNode | undefined;
 }) => React.ReactNode, useQRPHDepositContext: () => {
-    status: "confirmed" | "failed" | "idle" | "generating-qr-code" | "qr-code-generated";
+    status: "idle" | "confirmed" | "failed" | "generating-qr-code" | "qr-code-generated";
     deposit: import("../../../../types").Deposit | null;
     generateQRCode: (input: import("./useQRPHDeposit").GenerateQRCodeInput) => Promise<void>;
     regenerateQRCode: () => Promise<void>;

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/useQRPHDeposit.d.ts

@@ -5,7 +5,7 @@ export interface GenerateQRCodeInput {
     promo?: string | null;
 }
 export declare function useQRPHDeposit(): {
-    status: "confirmed" | "failed" | "idle" | "generating-qr-code" | "qr-code-generated";
+    status: "idle" | "confirmed" | "failed" | "generating-qr-code" | "qr-code-generated";
     deposit: Deposit | null;
     generateQRCode: (input: GenerateQRCodeInput) => Promise<void>;
     regenerateQRCode: () => Promise<void>;

package/dist/components/DepositWithdrawal/DepositWithdrawal.lazy.d.ts

@@ -1,3 +1,4 @@
+import { type BypassDomainConfig } from '../../client/hooks/useBypassKycChecker';
 export interface DepositWithdrawalProps {
     /** @default "/terms-of-use" */
     termsOfUseUrl?: string;
@@ -8,6 +9,9 @@ export interface DepositWithdrawalProps {
     allowUnverifiedAccounts?: boolean;
     libanganRedirectionUrl?: string;
     hasPrivacyPolicyAndTermsOfUse?: boolean;
-    bypassDepositKycCheck?: boolean;
+    bypassDomains?: BypassDomainConfig[];
+}
+export interface ExtendedDepositWithdrawalProps extends DepositWithdrawalProps {
+    bypassDepositKycCheck: boolean;
 }
 export declare function DepositWithdrawal(props: DepositWithdrawalProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/DepositWithdrawal/DepositWithdrawal.lazy.js

@@ -4,6 +4,7 @@ import { useEffect } from 'react';
 import { z } from 'zod';
 import { useShallow } from 'zustand/shallow';
 import { useBonusesQuery } from '../../client/hooks/useBonusesQuery.js';
+import { useBypassKycChecker, } from '../../client/hooks/useBypassKycChecker.js';
 import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
 import { useLocaleInfo } from '../../client/hooks/useLocaleInfo.js';
 import { useWalletQuery } from '../../client/hooks/useWalletQuery.js';
@@ -19,10 +20,12 @@ import { DepositWithdrawalPropsProvider } from './DepositWithdrawalContext.js';
 import { HasPendingBonuses } from './HasPendingBonuses.js';
 import { Withdrawal } from './Withdrawal/Withdrawal.js';
 export function DepositWithdrawal(props) {
+    const bypassDepositKycCheck = useBypassKycChecker(props.bypassDomains);
     const { hasPrivacyPolicyAndTermsOfUse = true, ...restProps } = props;
     const mergedProps = {
         ...restProps,
         hasPrivacyPolicyAndTermsOfUse,
+        bypassDepositKycCheck,
     };
     const globalStore = useGlobalStore(useShallow((ctx) => ({
         depositWithdrawal: ctx.depositWithdrawal,

package/dist/components/DepositWithdrawal/DepositWithdrawalContext.d.ts

@@ -1,6 +1,6 @@
-import type { DepositWithdrawalProps } from './DepositWithdrawal.lazy';
+import type { ExtendedDepositWithdrawalProps } from './DepositWithdrawal.lazy';
 export declare const DepositWithdrawalPropsProvider: (props: {
-    value: DepositWithdrawalProps;
+    value: ExtendedDepositWithdrawalProps;
 } & {
     children?: import("react").ReactNode | undefined;
-}) => React.ReactNode, useDepositWithdrawalPropsContext: () => DepositWithdrawalProps;
+}) => React.ReactNode, useDepositWithdrawalPropsContext: () => ExtendedDepositWithdrawalProps;

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

@@ -1,4 +1,5 @@
 import { type ReactNode } from 'react';
+import { type BypassDomainConfig } from '../../client/hooks/useBypassKycChecker';
 interface ClassNameEntries {
     root?: string;
     thumbnailRoot?: string;
@@ -8,7 +9,7 @@ export interface FavoriteGamesProps {
     className?: string | ClassNameEntries;
     /** @default 'Favorite Games' */
     heading?: string | ReactNode;
-    bypassKycCheck?: boolean;
+    bypassDomains?: BypassDomainConfig[];
 }
 export declare function FavoriteGames__client(props: FavoriteGamesProps): import("react/jsx-runtime").JSX.Element | null;
 export {};

package/dist/components/FavoriteGames/FavoriteGames.client.js

@@ -6,6 +6,7 @@ import Image from 'next/image';
 import { useCallback, useEffect, useState } from 'react';
 import { twMerge } from 'tailwind-merge';
 import { useAccountQuery } from '../../client/hooks/useAccountQuery.js';
+import { useBypassKycChecker, } from '../../client/hooks/useBypassKycChecker.js';
 import { useFavoriteGamesQuery } from '../../client/hooks/useFavoriteGamesQuery.js';
 import { useFeatureFlag } from '../../client/hooks/useFeatureFlag.js';
 import { useSessionQuery } from '../../client/hooks/useSessionQuery.js';
@@ -18,6 +19,7 @@ import { Button } from '../../ui/Button/index.js';
 import { getGameImageUrl } from '../../utils/getGameImageUrl.js';
 import { GameLaunchTrigger } from '../GameLaunch/index.js';
 export function FavoriteGames__client(props) {
+    const isBypass = useBypassKycChecker(props.bypassDomains);
     const [emblaRef, emblaApi] = useEmblaCarousel({
         align: 'start',
         slidesToScroll: 3,
@@ -50,7 +52,7 @@ export function FavoriteGames__client(props) {
     const classNames = isString(props.className)
         ? { root: props.className }
         : (props.className ?? {});
-    return (_jsxs("div", { className: classNames.root, children: [_jsxs("div", { className: "flex items-center", children: [_jsx("h2", { className: "font-semibold text-lg", children: props.heading ?? 'Favorite Games' }), _jsx("div", { className: "grow" }), _jsx("div", { className: "flex items-center justify-center gap-xl", children: _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" }) })] }) })] }), _jsx("div", { ref: emblaRef, className: "relative mt-lg lg:overflow-hidden", children: _jsx("div", { className: twMerge('grid auto-cols-[calc((100%-(0.375rem*2))/3)] grid-flow-col grid-rows-1 gap-sm lg:auto-cols-[calc((100%-(0.5rem*5))/6)] lg:gap-md'), children: games.map((game) => (_jsx(Item, { bypassKycCheck: props.bypassKycCheck, game: game, className: {
+    return (_jsxs("div", { className: classNames.root, children: [_jsxs("div", { className: "flex items-center", children: [_jsx("h2", { className: "font-semibold text-lg", children: props.heading ?? 'Favorite Games' }), _jsx("div", { className: "grow" }), _jsx("div", { className: "flex items-center justify-center gap-xl", children: _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" }) })] }) })] }), _jsx("div", { ref: emblaRef, className: "relative mt-lg lg:overflow-hidden", children: _jsx("div", { className: twMerge('grid auto-cols-[calc((100%-(0.375rem*2))/3)] grid-flow-col grid-rows-1 gap-sm lg:auto-cols-[calc((100%-(0.5rem*5))/6)] lg:gap-md'), children: games.map((game) => (_jsx(Item, { bypassKycCheck: isBypass, game: game, className: {
                             thumbnailRoot: classNames.thumbnailRoot,
                             thumbnailTitle: classNames.thumbnailTitle,
                         } }, game.id))) }) })] }));

package/dist/components/Games/GamesCarousel.client.d.ts

@@ -1,5 +1,6 @@
 import type { ImageProps } from 'next/image';
 import { type ReactNode } from 'react';
+import { type BypassDomainConfig } from '../../client/hooks/useBypassKycChecker';
 import type { GamesInput__Next } from '../../services/cmsPortal';
 import type { GameProvider } from '../../types';
 interface ClassNameEntries {
@@ -24,7 +25,7 @@ export interface GamesCarouselProps {
     sort?: GamesInput__Next['sort'];
     className?: string | ClassNameEntries;
     fallbackThumbnails?: Partial<Record<GameProvider, ImageProps['src']>>;
-    bypassKycCheck?: boolean;
+    bypassDomains?: BypassDomainConfig[];
 }
 export declare function GamesCarousel__client(props: GamesCarouselProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Games/GamesCarousel.client.js

@@ -5,6 +5,7 @@ import { isString } from 'lodash-es';
 import Link from 'next/link';
 import { useCallback, useEffect, useState } from 'react';
 import { twMerge } from 'tailwind-merge';
+import { useBypassKycChecker, } from '../../client/hooks/useBypassKycChecker.js';
 import { useGamesQuery } from '../../client/hooks/useGamesQuery.js';
 import { ArrowLeftIcon } from '../../icons/ArrowLeftIcon.js';
 import { ArrowRightIcon } from '../../icons/ArrowRightIcon.js';
@@ -16,6 +17,7 @@ import { Empty } from '../shared/Empty.js';
 import { Game } from './Game.js';
 import { GameContext, GamesPropsContext } from './GamesContext.js';
 export function GamesCarousel__client(props) {
+    const isBypass = useBypassKycChecker(props.bypassDomains);
     const numOfRows = props.numOfRows ?? 1;
     const gamesQuery = useGamesQuery({
         first: (numOfRows + 1) * 6,
@@ -63,7 +65,7 @@ export function GamesCarousel__client(props) {
                             ? 'grid-rows-3'
                             : numOfRows === 2
                                 ? 'grid-rows-2'
-                                : 'grid-rows-1'), children: games.map((game) => (_jsx(GameContext, { value: game, children: _jsx(Game, { bypassKycCheck: props.bypassKycCheck, badge: props.badge, className: {
+                                : 'grid-rows-1'), children: games.map((game) => (_jsx(GameContext, { value: game, children: _jsx(Game, { bypassKycCheck: isBypass, badge: props.badge, className: {
                                     root: classNames.thumbnailRoot,
                                     title: classNames.thumbnailTitle,
                                 } }) }, game.id))) }) }))] }) }));

package/dist/components/Games/GamesList.client.d.ts

@@ -1,5 +1,6 @@
 import type { ImageProps } from 'next/image';
 import type { ReactNode } from 'react';
+import { type BypassDomainConfig } from '../../client/hooks/useBypassKycChecker';
 import type { GamesInput__Next } from '../../services/cmsPortal';
 import type { GameProvider } from '../../types';
 interface ClassNameEntries {
@@ -24,7 +25,7 @@ export interface GamesListProps {
     className?: string | ClassNameEntries;
     pagination?: 'lazy-load' | 'paginated';
     fallbackThumbnails?: Partial<Record<GameProvider, ImageProps['src']>>;
-    bypassKycCheck?: boolean;
+    bypassDomains?: BypassDomainConfig[];
 }
 export declare function GamesList__client(props: GamesListProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/Games/GamesList.client.js

@@ -4,6 +4,7 @@ import { isString, noop } from 'lodash-es';
 import Link from 'next/link';
 import { useEffect, useState } from 'react';
 import { twMerge } from 'tailwind-merge';
+import { useBypassKycChecker, } from '../../client/hooks/useBypassKycChecker.js';
 import { useGamesQuery } from '../../client/hooks/useGamesQuery.js';
 import { useInfiniteQueryHelper } from '../../client/hooks/useInfiniteQueryHelper.js';
 import { ChevronLeftIcon } from '../../icons/ChevronLeftIcon.js';
@@ -16,6 +17,7 @@ import { Game } from './Game.js';
 import { GameContext, GamesPropsContext } from './GamesContext.js';
 import { GamesPagination } from './GamesPagination.js';
 export function GamesList__client(props) {
+    const isBypass = useBypassKycChecker(props.bypassDomains);
     const { pagination = 'lazy-load' } = props;
     const perPage = props.first ?? 24;
     const { loading, availableRows, totalRows, totalAvailableRows, hasNextPage, next, } = useInfiniteQueryHelper(useGamesQuery, {
@@ -50,7 +52,7 @@ export function GamesList__client(props) {
                                 ? props.heading.replaceAll('OneAPI', '')
                                 : (props.heading ?? 'Games') }), props.viewGameProvidersUrl && (_jsxs(Link, { href: props.viewGameProvidersUrl, className: "order-1 flex items-center gap-sm font-semibold text-button-tertiary-fg text-lg lg:order-none lg:text-sm", children: [_jsx(ChevronLeftIcon, { className: "size-5" }), "Back to all Providers"] }))] }), totalRows <= 0 && (_jsx(Empty, { icon: loading ? SpinnerIcon : GamingPad01Icon, title: loading ? 'Just a moment' : 'No games', message: loading
                         ? 'Fetching latest games...'
-                        : 'No game is currently available. Please check back later', className: "mt-lg" })), totalRows >= 1 && (_jsxs(_Fragment, { children: [_jsx("div", { className: "mt-lg grid grid-cols-3 gap-1.5 lg:grid-cols-6 lg:gap-2.5", children: (pagination === 'paginated' ? paginatedRows : availableRows).map((game) => (_jsx(GameContext, { value: game, children: _jsx(Game, { bypassKycCheck: props.bypassKycCheck, badge: props.badge, className: {
+                        : 'No game is currently available. Please check back later', className: "mt-lg" })), totalRows >= 1 && (_jsxs(_Fragment, { children: [_jsx("div", { className: "mt-lg grid grid-cols-3 gap-1.5 lg:grid-cols-6 lg:gap-2.5", children: (pagination === 'paginated' ? paginatedRows : availableRows).map((game) => (_jsx(GameContext, { value: game, children: _jsx(Game, { bypassKycCheck: isBypass, badge: props.badge, className: {
                                         root: classNames.thumbnailRoot,
                                         title: classNames.thumbnailTitle,
                                     } }) }, game.id))) }), _jsx("div", { className: "mt-2xl flex flex-col items-center lg:mt-3xl", children: pagination === 'paginated' && totalRows > 0 ? (_jsx(GamesPagination, { currentPage: currentPage, totalPages: totalPages, onPageChange: (page) => {

package/dist/components/GamesSearch/GamesSearch.d.ts

@@ -1,3 +1,4 @@
+import { type BypassDomainConfig } from '../../client/hooks/useBypassKycChecker';
 import type { GamesInput__Next } from '../../services/cmsPortal';
 export interface ClassNameEntries {
     root?: string;
@@ -11,7 +12,7 @@ interface GamesSearchProps {
     sort?: GamesInput__Next['sort'];
     className?: string | ClassNameEntries;
     placeholder?: string;
-    bypassKycCheck?: boolean;
+    bypassDomains?: BypassDomainConfig[];
 }
 export declare function GamesSearch(props: GamesSearchProps): import("react/jsx-runtime").JSX.Element;
 export {};

package/dist/components/GamesSearch/GamesSearch.js

@@ -5,6 +5,7 @@ import { isString } from 'lodash-es';
 import Image from 'next/image';
 import { useState } from 'react';
 import { twMerge } from 'tailwind-merge';
+import { useBypassKycChecker, } from '../../client/hooks/useBypassKycChecker.js';
 import { useGamesQuery } from '../../client/hooks/useGamesQuery.js';
 import { SearchLgIcon } from '../../icons/SearchLgIcon.js';
 import { Button } from '../../ui/Button/index.js';
@@ -14,6 +15,7 @@ import { Presence } from '../../ui/Presence/index.js';
 import { getGameImageUrl } from '../../utils/getGameImageUrl.js';
 import { GameLaunchTrigger } from '../GameLaunch/index.js';
 export function GamesSearch(props) {
+    const isBypass = useBypassKycChecker(props.bypassDomains);
     const [search, setSearch] = useState('');
     const gamesQuery = useGamesQuery({
         first: props.first ?? 18,
@@ -44,7 +46,7 @@ export function GamesSearch(props) {
                                         api.setInputValue('');
                                         api.focus();
                                     }, children: "Clear" }));
-                            } })] }), _jsx(Portal, { children: _jsx(Combobox.Context, { children: (api) => (_jsxs(_Fragment, { children: [_jsx(Presence, { present: api.open, children: _jsx("div", { className: "fixed inset-0 z-40 bg-black/50 backdrop-blur-sm", onClick: () => api.setOpen(false) }) }), _jsx(Combobox.Positioner, { children: search.trim().length > 0 && (_jsx(Combobox.Content, { className: "z-50 max-h-[33.25rem] overflow-y-auto p-0", children: search.length >= 1 && search.length <= 2 ? (_jsx(Alert, { message: "Search requires at least 3 characters." })) : (_jsxs(_Fragment, { children: [games.length <= 0 && (_jsx(Alert, { message: "No results found" })), games.length > 0 && (_jsxs("div", { className: "p-xl", children: [_jsx(Combobox.Context, { children: (api) => (_jsx("div", { className: "grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5", children: games.map((game) => (_jsxs(GameLaunchTrigger, { bypassKycCheck: props.bypassKycCheck, game: game, onClick: () => {
+                            } })] }), _jsx(Portal, { children: _jsx(Combobox.Context, { children: (api) => (_jsxs(_Fragment, { children: [_jsx(Presence, { present: api.open, children: _jsx("div", { className: "fixed inset-0 z-40 bg-black/50 backdrop-blur-sm", onClick: () => api.setOpen(false) }) }), _jsx(Combobox.Positioner, { children: search.trim().length > 0 && (_jsx(Combobox.Content, { className: "z-50 max-h-[33.25rem] overflow-y-auto p-0", children: search.length >= 1 && search.length <= 2 ? (_jsx(Alert, { message: "Search requires at least 3 characters." })) : (_jsxs(_Fragment, { children: [games.length <= 0 && (_jsx(Alert, { message: "No results found" })), games.length > 0 && (_jsxs("div", { className: "p-xl", children: [_jsx(Combobox.Context, { children: (api) => (_jsx("div", { className: "grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5", children: games.map((game) => (_jsxs(GameLaunchTrigger, { bypassKycCheck: isBypass, game: game, onClick: () => {
                                                                         api.setOpen(false);
                                                                     }, className: twMerge('block w-full shadow-sm', classNames.thumbnailRoot), children: [_jsx(Image, { src: getGameImageUrl({
                                                                                 reference: game.reference,

package/dist/components/MixpanelTracking/get-utm.d.ts

@@ -0,0 +1,18 @@
+export declare function getUTMParams(): {
+    utm_source: string;
+    utm_medium: string;
+    utm_campaign: string;
+    fbclid: string;
+    cxd: string;
+    gclid: string;
+};
+export declare function getSourceData(): {
+    utm_source: string;
+    utm_medium: string;
+    utm_campaign: string;
+    fbclid: string;
+    cxd: string;
+    gclid: string;
+    referrer: string;
+    source: string;
+};

package/dist/components/MixpanelTracking/get-utm.js

@@ -0,0 +1,44 @@
+export function getUTMParams() {
+    const params = new URLSearchParams(window.location.search);
+    return {
+        utm_source: params.get('utm_source') || 'unknown',
+        utm_medium: params.get('utm_medium') || 'unknown',
+        utm_campaign: params.get('utm_campaign') || 'unknown',
+        fbclid: params.get('fbclid') || 'unknown',
+        cxd: params.get('cxd') || 'unknown',
+        gclid: params.get('gclid') || 'unknown',
+    };
+}
+export function getSourceData() {
+    const urlParams = new URLSearchParams(window.location.search);
+    const utmSource = urlParams.get('utm_source');
+    const utmMedium = urlParams.get('utm_medium');
+    const utmCampaign = urlParams.get('utm_campaign');
+    const fbclid = urlParams.get('fbclid');
+    const cxd = urlParams.get('cxd');
+    const gclid = urlParams.get('gclid');
+    const referrer = document.referrer || 'direct';
+    let source = 'direct';
+    if (utmSource)
+        source = utmSource;
+    else if (fbclid)
+        source = 'facebook';
+    else if (gclid)
+        source = 'google';
+    else if (referrer.includes('facebook'))
+        source = 'facebook';
+    else if (referrer.includes('google'))
+        source = 'google';
+    else if (referrer !== 'direct')
+        source = referrer;
+    return {
+        utm_source: utmSource || 'none',
+        utm_medium: utmMedium || 'none',
+        utm_campaign: utmCampaign || 'none',
+        fbclid: fbclid || 'none',
+        cxd: cxd || 'none',
+        gclid: gclid || 'none',
+        referrer,
+        source,
+    };
+}

package/dist/components/MixpanelTracking/index.d.ts

@@ -0,0 +1,5 @@
+export interface MixpanelTrackingProps {
+    mixpanelId: string;
+}
+export declare const MixpanelTracking: ({ mixpanelId }: MixpanelTrackingProps) => null;
+export default MixpanelTracking;

package/dist/components/MixpanelTracking/index.js

@@ -0,0 +1,109 @@
+'use client';
+import { Capacitor } from '@capacitor/core';
+import mixpanel from 'mixpanel-browser';
+import { useEffect, useRef } from 'react';
+import { useAccountQuery } from '../../client/hooks/useAccountQuery.js';
+import { useDepositsCountQuery } from '../../client/hooks/useDepositsCountQuery.js';
+import { useSessionQuery } from '../../client/hooks/useSessionQuery.js';
+import { getSourceData, getUTMParams } from './get-utm.js';
+export const MixpanelTracking = ({ mixpanelId }) => {
+    const initializedRef = useRef(false);
+    const session = useSessionQuery();
+    const btag = session.data?.btag;
+    const isAuthenticated = session.data?.status === 'authenticated';
+    const accountQuery = useAccountQuery();
+    const account = accountQuery.data;
+    const kycStatus = account?.verificationStatus;
+    const depositCountQuery = useDepositsCountQuery();
+    const depositTotalCount = depositCountQuery.data;
+    useEffect(() => {
+        if (initializedRef.current)
+            return;
+        initializedRef.current = true;
+        console.log('MIXPANEL ID:', mixpanelId);
+        mixpanel.init(mixpanelId, {
+            autocapture: false,
+            autotrack: false,
+            record_sessions_percent: 0,
+            persistence: 'localStorage',
+        });
+        const distinctId = mixpanel.get_distinct_id();
+        mixpanel.identify(distinctId);
+        const { source, utm_source, utm_medium, utm_campaign, referrer } = getSourceData();
+        mixpanel.people.set({
+            platform: Capacitor.getPlatform() === 'android'
+                ? 'Android'
+                : Capacitor.getPlatform() === 'ios'
+                    ? 'iOS'
+                    : 'Web',
+            first_seen: new Date().toISOString(),
+            source,
+            utm_source,
+            utm_medium,
+            utm_campaign,
+            referrer,
+            isLoggedIn: isAuthenticated,
+            lastLoggedIn: isAuthenticated ? new Date().toISOString() : null,
+        });
+        if (typeof window !== 'undefined') {
+            const SESSION_KEY = 'last_mixpanel_session_tracked';
+            const ONE_DAY = 24 * 60 * 60 * 1000;
+            const last = window.localStorage.getItem(SESSION_KEY);
+            const now = Date.now();
+            const oneDayPassed = last && now - new Date(last).getTime() >= ONE_DAY;
+            if (!last || oneDayPassed) {
+                const isWeb = !Capacitor.getPlatform().includes('android') &&
+                    !Capacitor.getPlatform().includes('ios');
+                const resolvedSource = isWeb
+                    ? window.location.pathname
+                    : Capacitor.getPlatform().includes('android')
+                        ? 'android'
+                        : Capacitor.getPlatform().includes('ios')
+                            ? 'ios'
+                            : 'mobile web';
+                mixpanel.track('Session Start', {
+                    ...getUTMParams(),
+                    source: resolvedSource,
+                    referrer: (typeof document !== 'undefined' && document.referrer) || 'direct',
+                    btag: btag || 'organic',
+                });
+                window.localStorage.setItem(SESSION_KEY, new Date().toISOString());
+            }
+        }
+    }, [isAuthenticated, btag, mixpanelId]);
+    useEffect(() => {
+        if (!initializedRef.current)
+            return;
+        if (!isAuthenticated)
+            return;
+        mixpanel.people.set({
+            isLoggedIn: true,
+            lastLoggedIn: new Date().toISOString(),
+        });
+    }, [isAuthenticated]);
+    useEffect(() => {
+        if (depositTotalCount == null)
+            return;
+        mixpanel.people.set({
+            totalDeposits: depositTotalCount,
+        });
+    }, [depositTotalCount]);
+    useEffect(() => {
+        if (!kycStatus)
+            return;
+        mixpanel.people.set({
+            kycStatus,
+        });
+    }, [kycStatus]);
+    useEffect(() => {
+        if (!account)
+            return;
+        mixpanel.people.set({
+            email: account.emailAddress,
+            name: account.realName,
+            username: account.name,
+        });
+    }, [account]);
+    return null;
+};
+export default MixpanelTracking;

package/dist/components/Search/Search.lazy.d.ts

@@ -1,4 +1,5 @@
 import { type ImageProps } from 'next/image';
+import { type BypassDomainConfig } from '../../client/hooks/useBypassKycChecker';
 import type { GameProvider, GameProviderData, GameType } from '../../types';
 export interface ClassNameEntries {
     root?: string;
@@ -26,6 +27,6 @@ export interface SearchProps {
     viewGamesUrl?: string | ((gameProvider: GameProviderData) => string);
     gameProviderImages?: Partial<Record<GameProvider, ImageProps['src']>>;
     placeholder?: string;
-    bypassKycCheck?: boolean;
+    bypassDomains?: BypassDomainConfig[];
 }
 export declare function Search(props: SearchProps): import("react/jsx-runtime").JSX.Element;

package/dist/components/Search/Search.lazy.js

@@ -7,6 +7,7 @@ import { useEffect, useRef, useState } from 'react';
 import { twMerge } from 'tailwind-merge';
 import { useDebounceCallback } from 'usehooks-ts';
 import { useShallow } from 'zustand/shallow';
+import { useBypassKycChecker, } from '../../client/hooks/useBypassKycChecker.js';
 import { useControllableState } from '../../client/hooks/useControllableState.js';
 import { useGamesQuery } from '../../client/hooks/useGamesQuery.js';
 import { useGlobalStore } from '../../client/hooks/useGlobalStore.js';
@@ -29,6 +30,7 @@ function lookup(value, compare) {
         .includes(compare.toLowerCase().replace(/\s+/g, ''));
 }
 export function Search(props) {
+    const isBypass = useBypassKycChecker(props.bypassDomains);
     const globalStore = useGlobalStore(useShallow((ctx) => ({
         search: ctx.search,
     })));
@@ -77,7 +79,7 @@ export function Search(props) {
                                                 }, children: "Clear" }) })] }) }), _jsx("div", { className: "flex max-h-[85dvh] min-h-0 flex-1 flex-col", children: _jsx("div", { className: "mt-2xl p-xl pb-3xl lg:mt-2 lg:max-h-[41rem] lg:overflow-y-auto lg:rounded-xl lg:border lg:border-border-primary lg:bg-bg-primary", children: search.length <= 0 ? (_jsx(Alert, { message: "Search for your favorite game or provider." })) : search.length === 1 ? (_jsx(Alert, { message: "Search requires at least 2 characters." })) : (_jsxs(_Fragment, { children: [empty && _jsx(Alert, { message: "No results found" }), !empty && (_jsxs(_Fragment, { children: [gameProviders.length > 0 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "font-semibold text-lg", children: "Providers" }), _jsx("div", { className: "mt-3.5 mb-3xl grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5", children: gameProviders.map((provider) => (_jsx(Link, { href: viewGamesUrl(provider), "aria-label": `View ${provider.name} games`, className: twMerge('flex h-14 w-full items-center rounded-md bg-brand-800', classNames.providerThumbnailRoot), onClick: () => {
                                                                         globalStore.search.setOpen(false);
                                                                     }, children: _jsx(Image, { src: props.gameProviderImages?.[provider.id] ??
-                                                                            provider.logo, alt: "", width: 100, height: 50, className: twMerge('mx-auto h-auto w-full', classNames.providerThumbnailImage) }) }, provider.id))) })] })), games.length > 0 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "font-semibold text-lg", children: "Games" }), _jsx("div", { className: "mt-3.5 grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5", children: games.map((game) => (_jsxs(GameLaunchTrigger, { bypassKycCheck: props.bypassKycCheck, game: game, className: twMerge('block w-full shadow-sm', classNames.gameThumbnailRoot), onClick: () => {
+                                                                            provider.logo, alt: "", width: 100, height: 50, className: twMerge('mx-auto h-auto w-full', classNames.providerThumbnailImage) }) }, provider.id))) })] })), games.length > 0 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "font-semibold text-lg", children: "Games" }), _jsx("div", { className: "mt-3.5 grid grid-cols-3 gap-1.5 lg:grid-cols-9 lg:gap-3.5", children: games.map((game) => (_jsxs(GameLaunchTrigger, { bypassKycCheck: isBypass, game: game, className: twMerge('block w-full shadow-sm', classNames.gameThumbnailRoot), onClick: () => {
                                                                         globalStore.search.setOpen(false);
                                                                     }, children: [_jsx(Image, { src: getGameImageUrl({
                                                                                 reference: game.reference,

package/dist/next.config.js

@@ -21,6 +21,9 @@ export const config = {
     },
     poweredByHeader: false,
     reactStrictMode: false,
+    compiler: {
+        removeConsole: process.env.NODE_ENV === 'production',
+    },
 };
 export function extendConfig(userConfig) {
     return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opexa/portal-components",
-  "version": "0.0.828",
+  "version": "0.0.830",
   "exports": {
     "./ui/*": {
       "types": "./dist/ui/*/index.d.ts",
@@ -103,6 +103,7 @@
     "is-mobile": "^5.0.0",
     "latest": "^0.2.0",
     "lodash-es": "^4.17.21",
+    "mixpanel-browser": "^2.71.0",
     "next-recaptcha-v3": "^1.5.2",
     "qrcode": "^1.5.4",
     "tailwind-merge": "^3.3.1",