@opexa/portal-components 0.0.155 → 0.0.158

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

@@ -1,2 +1,3 @@
+import { type BonusesInput } from '../../services/wallet';
 import type { Bonus, Query } from '../../types';
-export declare const useBonusesQuery: Query<Bonus[]>;
+export declare const useBonusesQuery: Query<Bonus[], BonusesInput>;

package/dist/client/hooks/useBonusesQuery.js

@@ -5,7 +5,7 @@ import { getQueryClient } from '../../utils/getQueryClient.js';
 import { getBonusesCountQueryKey, getBonusesQueryKey, } from '../../utils/queryKeys.js';
 import { getSession } from '../services/getSession.js';
 import { useSessionQuery } from './useSessionQuery.js';
-export const useBonusesQuery = (config) => {
+export const useBonusesQuery = (input, config) => {
     const queryClient = getQueryClient();
     const sessionQuery = useSessionQuery();
     const query = useQuery({
@@ -14,11 +14,11 @@ export const useBonusesQuery = (config) => {
         enabled: config?.enabled === false
             ? false
             : sessionQuery.data?.status === 'authenticated',
-        queryKey: getBonusesQueryKey(),
+        queryKey: getBonusesQueryKey(input),
         queryFn: async ({ signal }) => {
             const session = await getSession();
             invariant(session.status === 'authenticated');
-            const bonuses = await getBonuses({
+            const bonuses = await getBonuses(input, {
                 signal,
                 headers: {
                     Authorization: `Bearer ${session.token}`,

package/dist/client/hooks/useMarkMessageAsReadMutation.js

@@ -44,7 +44,11 @@ export const useMarkMessageAsReadMutation = (config) => {
                     })),
                 };
             });
-            queryClient.setQueryData(getUnreadMessagesCountQueryKey(), (prev) => {
+            queryClient.setQueriesData({
+                queryKey: getUnreadMessagesCountQueryKey(),
+                exact: false,
+                type: 'all',
+            }, (prev) => {
                 return prev && prev > 0 ? prev - 1 : 0;
             });
             return id;

package/dist/client/hooks/useMessagesQuery.js

@@ -7,6 +7,7 @@ import { useSessionQuery } from './useSessionQuery.js';
 export const useMessagesQuery = (input, config) => {
     const sessionQuery = useSessionQuery();
     const query = useInfiniteQuery({
+        staleTime: 1000 * 2,
         ...config,
         enabled: config?.enabled === false
             ? false

package/dist/client/hooks/useUnreadMessagesCountQuery.js

@@ -7,6 +7,7 @@ import { useSessionQuery } from './useSessionQuery.js';
 export const useUnreadMessagesCountQuery = (input, config) => {
     const sessionQuery = useSessionQuery();
     const query = useQuery({
+        staleTime: 1000 * 2,
         ...config,
         enabled: config?.enabled === false
             ? false

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

@@ -1,10 +1,9 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { isAfter } from 'date-fns';
 import { clamp } from 'lodash-es';
 import Image from 'next/image';
 import Link from 'next/link';
-import { useState } from 'react';
+import { usePathname, useRouter, useSearchParams } from 'next/navigation';
 import { z } from 'zod';
 import { useShallow } from 'zustand/shallow';
 import { useBonusesQuery } from '../../client/hooks/useBonusesQuery.js';
@@ -23,32 +22,45 @@ import { Button } from '../../ui/Button/index.js';
 import { Popover } from '../../ui/Popover/index.js';
 import { Progress } from '../../ui/Progress/index.js';
 import { SegmentGroup } from '../../ui/SegmentGroup/index.js';
-import { capitalize } from '../../utils/capitalize.js';
 import { formatNumber } from '../../utils/formatNumber.js';
 import { parseDecimal } from '../../utils/parseDecimal.js';
 import { ClaimSpotBonus } from './ClaimSpotBonus.js';
-const TABS = ['ALL', 'ACTIVE', 'CASHBACKS'];
+const TabSchema = z
+    .enum(['all', 'active', 'cashbacks'])
+    .optional()
+    .nullable()
+    .catch('all')
+    .transform((v) => v ?? 'all');
 export function Bonuses__client(props) {
-    const [tab, setTab] = useState(TABS[0]);
+    const router = useRouter();
+    const pathname = usePathname();
+    const searchParams = useSearchParams();
+    const tab = TabSchema.parse(searchParams.get('tab'));
+    const setTab = (tab) => {
+        const params = new URLSearchParams(searchParams.toString());
+        params.set('tab', tab);
+        router.push(`${pathname}?${params.toString()}`);
+    };
     const bonusesQuery = useBonusesQuery({
+        ...(tab === 'active' && {
+            filter: {
+                expiration: {
+                    greaterThanOrEqual: new Date(),
+                },
+            },
+        }),
+    }, {
         refetchInterval: 5000,
+        enabled: tab !== 'cashbacks',
     });
     const cashbackBonusesQuery = useCashbackBonusesQuery({
         refetchInterval: 5000,
     });
-    const bonuses = tab === 'CASHBACKS'
-        ? []
-        : (bonusesQuery.data ?? []).filter((bonus) => {
-            return tab === 'ACTIVE' ? (new Date(), bonus.expiration) : true;
-        });
-    const cashbackBonuses = (cashbackBonusesQuery.data ?? []).filter((bonus) => {
-        return tab === 'ACTIVE'
-            ? isAfter(new Date(), bonus.cashback.activationEndDateTime)
-            : true;
-    });
+    const bonuses = bonusesQuery.data ?? [];
+    const cashbackBonuses = cashbackBonusesQuery.data ?? [];
     return (_jsxs(_Fragment, { children: [_jsxs("div", { className: props.className, children: [_jsx("h2", { className: "text-lg font-semibold", children: props.heading ?? 'Rewards' }), _jsxs(SegmentGroup.Root, { value: tab, onValueChange: (details) => {
-                            setTab(z.enum(TABS).parse(details.value));
-                        }, className: "mt-3", children: [TABS.map((value) => (_jsxs(SegmentGroup.Item, { value: value, children: [_jsx(SegmentGroup.ItemText, { children: capitalize(value) }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }, value))), _jsx(SegmentGroup.Indicator, {})] }), _jsxs("div", { className: "mt-3xl grid gap-3xl lg:mt-lg lg:grid-cols-3", children: [tab === 'ALL' && _jsx(SpotBonus, {}), tab !== 'CASHBACKS' && (_jsx(_Fragment, { children: bonuses.map((bonus) => (_jsx(Bonus, { data: bonus, viewDetailsUrl: props.viewBonusDetailsUrl ?? '/rewards' }, bonus.id))) })), cashbackBonuses.map((cashbackBonus) => (_jsx(CashbackBonus, { data: cashbackBonus }, cashbackBonus.id)))] })] }), _jsx(ClaimSpotBonus, {})] }));
+                            setTab(TabSchema.parse(details.value));
+                        }, className: "mt-3", children: [_jsxs(SegmentGroup.Item, { value: "all", children: [_jsx(SegmentGroup.ItemText, { children: "All" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), _jsxs(SegmentGroup.Item, { value: "active", children: [_jsx(SegmentGroup.ItemText, { children: "Active" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), _jsxs(SegmentGroup.Item, { value: "cashbacks", children: [_jsx(SegmentGroup.ItemText, { children: "Cashbacks" }), _jsx(SegmentGroup.ItemControl, {}), _jsx(SegmentGroup.ItemHiddenInput, {})] }), _jsx(SegmentGroup.Indicator, {})] }), _jsxs("div", { className: "mt-3xl grid gap-3xl lg:mt-lg lg:grid-cols-3", children: [tab === 'all' && _jsx(SpotBonus, {}), bonuses.map((bonus) => (_jsx(Bonus, { data: bonus, viewDetailsUrl: props.viewBonusDetailsUrl ?? '/rewards' }, bonus.id))), cashbackBonuses.map((cashbackBonus) => (_jsx(CashbackBonus, { data: cashbackBonus }, cashbackBonus.id)))] })] }), _jsx(ClaimSpotBonus, {})] }));
 }
 function Bonus(props) {
     const bonus = props.data;

package/dist/components/Bonuses/Bonuses.js

@@ -1,8 +1,9 @@
 import { jsx as _jsx } from "react/jsx-runtime";
+import { Suspense } from 'react';
 import { prefetchBonusesQuery } from '../../server/utils/prefetchBonusesQuery.js';
 import { prefetchCashbacksQuery } from '../../server/utils/prefetchCashbacksQuery.js';
 import { Bonuses__client } from './Bonuses.client.js';
 export async function Bonuses(props) {
     await Promise.allSettled([prefetchBonusesQuery(), prefetchCashbacksQuery()]);
-    return _jsx(Bonuses__client, { ...props });
+    return (_jsx(Suspense, { fallback: null, children: _jsx(Bonuses__client, { ...props }) }));
 }

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/OnlineBankDepositContext.d.ts

@@ -1,6 +1,6 @@
 export declare const OnlineBankDepositContext: (props: {
     value: {
-        view: "form" | "vca";
+        view: "vca" | "form";
         status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
         verify: () => void;
         reset: () => void;
@@ -13,7 +13,7 @@ export declare const OnlineBankDepositContext: (props: {
 } & {
     children?: import("react").ReactNode | undefined;
 }) => React.ReactNode, useOnlineBankDepositContext: () => {
-    view: "form" | "vca";
+    view: "vca" | "form";
     status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;

package/dist/components/DepositWithdrawal/Deposit/OnlineBankDeposit/useOnlineBankDeposit.d.ts

@@ -1,7 +1,7 @@
 import type { Deposit } from '../../../../types';
 export type UseOnlineBankDepositReturn = ReturnType<typeof useOnlineBankDeposit>;
 export declare function useOnlineBankDeposit(): {
-    view: "form" | "vca";
+    view: "vca" | "form";
     status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;

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

@@ -1,6 +1,6 @@
 export declare const QRPHDepositContext: (props: {
     value: {
-        view: "form" | "qrCode";
+        view: "qrCode" | "form";
         status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
         verify: () => void;
         reset: () => void;
@@ -13,7 +13,7 @@ export declare const QRPHDepositContext: (props: {
 } & {
     children?: import("react").ReactNode | undefined;
 }) => React.ReactNode, useQRPHDepositContext: () => {
-    view: "form" | "qrCode";
+    view: "qrCode" | "form";
     status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;

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

@@ -1,7 +1,7 @@
 import type { Deposit } from '../../../../types';
 export type UseQRPHDepositReturn = ReturnType<typeof useQRPHDeposit>;
 export declare function useQRPHDeposit(): {
-    view: "form" | "qrCode";
+    view: "qrCode" | "form";
     status: "waiting" | "processing" | "failed" | "verification-waiting" | "verification-processing" | "verification-failed" | "verification-success";
     verify: () => void;
     reset: () => void;

package/dist/components/KYC/CaptureSelfie.js

@@ -10,9 +10,8 @@ import { Button } from '../../ui/Button/index.js';
 import { Dialog } from '../../ui/Dialog/index.js';
 import { onMobileDevice } from '../../utils/onMobileDevice.js';
 import { useKYCContext } from './KYCContext.js';
-import { loadFaceApiModels } from './loadModels.js';
 import PersonOverlayDesktop from './PersonOverlayDesktop.js';
-import { dataURLtoBlob, resizeFile } from './utils.js';
+import { dataURLtoBlob, loadFaceApiModels, resizeFile } from './utils.js';
 export function CaptureSelfie() {
     const kyc = useKYCContext();
     const { mutate, isPending } = useUploadImageFileMutation();

package/dist/components/KYC/KYC.js

@@ -11,5 +11,5 @@ const Component = dynamic(() => import('./KYC.lazy.js').then((m) => m.KYC), {
 });
 export function KYC(props) {
     const touched = useGlobalStore(useShallow((ctx) => ctx.kyc['~touched']));
-    return (_jsxs(_Fragment, { children: [touched && _jsx(Component, { ...props }), _jsx(AutoOpen, {}), _jsx(Script, { src: "https://docs.opencv.org/4.7.0/opencv.js", async: true }), _jsx(Script, { src: "https://cdn.jsdelivr.net/gh/ColonelParrot/jscanify@master/src/jscanify.min.js", strategy: "afterInteractive" })] }));
+    return (_jsxs(_Fragment, { children: [touched && _jsx(Component, { ...props }), _jsx(AutoOpen, {}), _jsx(Script, { src: "https://docs.opencv.org/4.7.0/opencv.js", defer: true }), _jsx(Script, { src: "https://cdn.jsdelivr.net/gh/ColonelParrot/jscanify@master/src/jscanify.min.js", defer: true })] }));
 }

package/dist/components/KYC/utils.d.ts

@@ -1,3 +1,4 @@
+export declare function loadFaceApiModels(): Promise<void>;
 export declare function dataURLtoBlob(dataURL: string): Blob;
 export declare const resizeFile: (file: File) => Promise<unknown>;
 export declare const MAX_FILE_SIZE = 10;

package/dist/components/KYC/utils.js

@@ -1,4 +1,13 @@
+import * as faceapi from 'face-api.js';
 import Resizer from 'react-image-file-resizer';
+export async function loadFaceApiModels() {
+    const MODEL_URL = '/models';
+    await Promise.all([
+        faceapi.nets.tinyFaceDetector.loadFromUri(MODEL_URL),
+        faceapi.nets.faceLandmark68Net.loadFromUri(MODEL_URL),
+        faceapi.nets.faceRecognitionNet.loadFromUri(MODEL_URL),
+    ]);
+}
 export function dataURLtoBlob(dataURL) {
     const parts = dataURL.split(';base64,');
     const contentType = parts[0].split(':')[1];

package/dist/components/Messages/Messages.lazy.js

@@ -27,7 +27,7 @@ const TABS = ['ALL', 'UNREAD'];
 export function Messages(props) {
     const globalStore = useGlobalStore(useShallow((ctx) => ({ messages: ctx.messages })));
     const unreadMessagesCountQuery = useUnreadMessagesCountQuery({}, {
-        refetchInterval: globalStore.messages.open ? 5_000 : 10_000,
+        refetchInterval: globalStore.messages.open ? 5000 : 10000,
     });
     const unreadMessagesCount = unreadMessagesCountQuery.data ?? 0;
     const messagesQuery = useMessagesQuery({
@@ -41,7 +41,7 @@ export function Messages(props) {
         }),
     }, {
         enabled: globalStore.messages.open,
-        refetchInterval: 5_000,
+        refetchInterval: 10000,
     });
     const messages = messagesQuery.data?.pages.flatMap((page) => page.edges.map((e) => e.node)) ?? [];
     const [mobileOffsetTop, desktopOffsetTop] = Array.isArray(props.offsetTop)

package/dist/components/Messages/MessagesPopup.js

@@ -29,22 +29,24 @@ export function MessagesPopup() {
         depositWithdrawal: ctx.depositWithdrawal,
     })));
     const markMessageAsReadMutation = useMarkMessageAsReadMutation();
-    const [paused, setPaused] = useState(false);
-    useInterval(() => setPaused(false), paused ? 1000 * 30 : null);
     const disclosure = useDisclosure({
         onOpenChange(open) {
             if (open) {
                 const message = messages.at(0);
-                if (!message || message.markedAsRead)
+                if (!message)
+                    return;
+                if (message.markedAsRead)
                     return;
                 markMessageAsReadMutation.mutate(message.id);
             }
             else {
                 setPaused(true);
-                setPage(1);
+                setIndex_(0);
             }
         },
     });
+    const [paused, setPaused] = useState(false);
+    useInterval(() => setPaused(false), paused ? 1000 * 30 : null);
     const messagesQuery = useMessagesQuery({
         first: 10,
         filter: {
@@ -62,10 +64,19 @@ export function MessagesPopup() {
             !globalStore.message.open &&
             !globalStore.kyc.open &&
             !paused,
-        refetchInterval: disclosure.open ? undefined : 10_000,
+        refetchInterval: disclosure.open ? undefined : 10000,
     });
     const messages = messagesQuery.data?.pages.flatMap((page) => page.edges.map((edge) => edge.node)) ?? [];
-    const [page, setPage] = useState(1);
+    const [index, setIndex_] = useState(0);
+    const setIndex = (newIndex) => {
+        setIndex_(newIndex);
+        const message = messages.at(newIndex);
+        if (!message)
+            return;
+        if (message.markedAsRead)
+            return;
+        markMessageAsReadMutation.mutate(message.id);
+    };
     useEffect(() => {
         if (messages.length > 0) {
             disclosure.setOpen(true);
@@ -73,14 +84,8 @@ export function MessagesPopup() {
     }, [disclosure, messages.length, paused]);
     return (_jsx(Dialog.Root, { open: disclosure.open, onOpenChange: (details) => {
             disclosure.setOpen(details.open);
-        }, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+3)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+4)] flex items-center justify-center", children: _jsxs(Dialog.Content, { className: "min-h-auto mx-auto min-w-[21.438rem] max-w-[21.438rem] rounded-xl p-3xl lg:min-w-[25rem] lg:max-w-[25rem]", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs(Carousel.Root, { page: page, onPageChange: (details) => {
-                                    setPage(details.page);
-                                    const message = messages.at(details.page - 1);
-                                    if (!message)
-                                        return;
-                                    if (message.markedAsRead)
-                                        return;
-                                    markMessageAsReadMutation.mutate(message.id);
+        }, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, { className: "!z-[calc(var(--z-dialog)+3)]" }), _jsx(Dialog.Positioner, { className: "!z-[calc(var(--z-dialog)+4)] flex items-center justify-center", children: _jsxs(Dialog.Content, { className: "min-h-auto mx-auto min-w-[21.438rem] max-w-[21.438rem] rounded-xl p-3xl lg:min-w-[25rem] lg:max-w-[25rem]", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs(Carousel.Root, { page: index, onPageChange: (details) => {
+                                    setIndex(details.page);
                                 }, slideCount: messages.length, allowMouseDrag: true, children: [_jsx(Carousel.ItemGroup, { children: messages.map((message, index) => (_jsxs(Carousel.Item, { index: index, className: "select-none", children: [_jsx("div", { className: "bg-bg-brand-secondary text-text-brand mx-auto flex size-12 items-center justify-center rounded-full", children: _jsx(MessageIcon, { type: message.icon, className: "size-6" }) }), _jsx("h2", { className: "mt-lg text-center text-lg font-semibold xl:mt-xl", children: message.title }), message.content && (_jsx("div", { dangerouslySetInnerHTML: { __html: message.content }, className: "text-text-secondary-700 mt-xs pb-5 text-center text-sm" })), message.image && (_jsx("div", { className: "mt-5 pb-5", children: _jsx(Image, { src: message.image, alt: "", width: 400, height: 250, loading: "lazy", unoptimized: true, className: "h-auto w-full rounded-sm" }) })), message.actions.length ? (_jsx("div", { className: "mt-3xl flex flex-col gap-2 text-center lg:mt-4xl", children: message.actions.map((action, index) => (_jsx(Button, { asChild: true, children: _jsx(Link, { href: normalizeActionUrl(transactionsPageUrl, action.url), onClick: () => {
                                                                 disclosure.setOpen(false);
                                                             }, children: action.name }) }, index))) })) : null] }, message.id))) }), _jsxs(Carousel.Control, { className: "mt-5 flex items-center lg:mt-3xl", children: [_jsxs(Carousel.PrevTrigger, { className: "text-text-quarterary-500 hidden items-center gap-md font-semibold disabled:invisible lg:flex", children: [_jsx(ChevronLeftIcon, { className: "size-5" }), "Back"] }), _jsx(Carousel.IndicatorGroup, { className: "flex grow justify-center gap-xs", children: messages.map((message, index) => (_jsx(Carousel.Indicator, { index: index, className: "bg-bg-quaternary ui-current:bg-brand-400 size-2.5 rounded-full transition-all duration-150 ui-current:w-5" }, message.id))) }), _jsxs(Carousel.NextTrigger, { className: "text-text-quarterary-500 hidden items-center gap-md font-semibold disabled:invisible lg:flex", children: ["Next", _jsx(ChevronRightIcon, { className: "size-5" })] })] })] })] }) })] }) }));

package/dist/components/News/News.js

@@ -4,7 +4,7 @@ import Link from 'next/link';
 import { ChevronLeftIcon } from '../../icons/ChevronLeftIcon.js';
 import { Prose } from '../../ui/Prose/index.js';
 export function News(props) {
-    return (_jsxs("div", { style: props.style, className: props.className, children: [_jsxs(Link, { href: props.viewAllUrl ?? '/news', className: "text-button-secondary-fg flex items-center gap-lg text-lg font-semibold", children: [_jsx(ChevronLeftIcon, { className: "size-6" }), "Back to all News"] }), _jsx(Image, { src: props.news.image, alt: "", width: 1024, height: 600, priority: true, className: "mt-3xl block h-auto w-full rounded-xl lg:mt-6" }), _jsx("p", { className: "text-brand-400 mt-xl text-sm font-semibold lg:mt-6", children: props.news.category }), _jsx("h2", { className: "mt-xl text-2xl font-semibold lg:mt-6", children: props.news.title }), _jsx(Prose, { className: "mt-xl lg:mt-6", dangerouslySetInnerHTML: {
+    return (_jsxs("div", { style: props.style, className: props.className, children: [_jsxs(Link, { href: props.viewAllUrl ?? '/news', className: "text-button-secondary-fg flex items-center gap-lg text-lg font-semibold", children: [_jsx(ChevronLeftIcon, { className: "size-6" }), "Back to all News"] }), _jsx(Image, { src: props.news.image, alt: "", width: 1024, height: 600, priority: true, unoptimized: true, className: "mt-3xl block h-auto w-full rounded-xl lg:mt-6" }), _jsx("p", { className: "text-brand-400 mt-xl text-sm font-semibold lg:mt-6", children: props.news.category }), _jsx("h2", { className: "mt-xl text-2xl font-semibold lg:mt-6", children: props.news.title }), _jsx(Prose, { className: "mt-xl lg:mt-6", dangerouslySetInnerHTML: {
                     __html: props.news.content,
                 } })] }));
 }

package/dist/components/PortalProvider/PortalProvider.js

@@ -9,6 +9,7 @@ import { FacebookPixel, GoogleRecaptcha } from '../../third-parties/index.js';
 import { getQueryClient } from '../../utils/getQueryClient.js';
 import { Providers } from './Providers.js';
 import { Snackbar } from './Snackbar.js';
+import { WebVitals } from './WebVitals.js';
 export async function PortalProvider({ children, facebookPixelId, googleAnalyticsId, googleTagManagerId, googleRecaptchaSiteKey, }) {
     const queryClient = getQueryClient();
     await Promise.allSettled([
@@ -17,5 +18,5 @@ export async function PortalProvider({ children, facebookPixelId, googleAnalytic
         prefetchAccountQuery(),
         prefetchWalletQuery(),
     ]);
-    return (_jsxs(_Fragment, { children: [_jsx(Providers, { children: _jsx(HydrationBoundary, { state: dehydrate(queryClient), children: children }) }), _jsx(Snackbar, {}), facebookPixelId && _jsx(FacebookPixel, { fbId: facebookPixelId }), googleAnalyticsId && _jsx(GoogleAnalytics, { gaId: googleAnalyticsId }), googleTagManagerId && _jsx(GoogleTagManager, { gtmId: googleTagManagerId }), googleRecaptchaSiteKey && (_jsx(GoogleRecaptcha, { siteKey: googleRecaptchaSiteKey }))] }));
+    return (_jsxs(_Fragment, { children: [_jsx(WebVitals, {}), _jsx(Providers, { children: _jsx(HydrationBoundary, { state: dehydrate(queryClient), children: children }) }), _jsx(Snackbar, {}), facebookPixelId && _jsx(FacebookPixel, { fbId: facebookPixelId }), googleAnalyticsId && _jsx(GoogleAnalytics, { gaId: googleAnalyticsId }), googleTagManagerId && _jsx(GoogleTagManager, { gtmId: googleTagManagerId }), googleRecaptchaSiteKey && (_jsx(GoogleRecaptcha, { siteKey: googleRecaptchaSiteKey }))] }));
 }

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

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

package/dist/components/PortalProvider/WebVitals.js

@@ -0,0 +1,8 @@
+'use client';
+import { useReportWebVitals } from 'next/web-vitals';
+export function WebVitals() {
+    useReportWebVitals((metric) => {
+        console.log(metric);
+    });
+    return null;
+}

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

@@ -70,10 +70,10 @@ export function Search(props) {
         }, lazyMount: true, unmountOnExit: true, children: _jsxs(Portal, { children: [_jsx(Dialog.Backdrop, {}), _jsx(Dialog.Positioner, { children: _jsxs(Dialog.Content, { className: "bg-bg-primary lg:min-h-auto mx-auto min-h-full w-full pt-xl lg:mt-[132px] lg:max-w-[1136px] lg:bg-unset lg:pt-0", children: [_jsx(Dialog.Context, { children: (api) => (_jsxs("div", { className: "flex items-center justify-between px-4 lg:hidden", children: [_jsx(Image, { src: props.logo, alt: "", width: 200, height: 40, className: "h-8 w-auto" }), _jsx(IconButton, { size: "sm", colorScheme: "gray", onClick: () => api.setOpen(false), children: _jsx(XIcon, { className: "text-text-quinary size-6" }) })] })) }), _jsx("div", { className: "flex justify-end", children: _jsx(Dialog.Context, { children: (api) => (_jsx("button", { type: "button", onClick: () => api.setOpen(false), className: "hidden size-9 items-center justify-center rounded-md bg-white/20 lg:flex", children: _jsx(XIcon, { className: "size-5 text-white" }) })) }) }), _jsx("div", { className: "mt-2xl px-4 lg:mt-xl lg:px-0", children: _jsxs("div", { className: "relative", children: [_jsx(SearchLgIcon, { className: "text-text-quinary pointer-events-none absolute left-3.5 top-1/2 size-5 -translate-y-1/2" }), _jsx(DebouncedInput, { ref: inputRef, value: search, onChange: setSearch }), _jsx(Presence, { present: search.length > 0, asChild: true, lazyMount: true, children: _jsx("button", { type: "button", className: "text-text-secondary-700 absolute right-3.5 top-1/2 -translate-y-1/2 font-semibold", onClick: () => {
                                                     setSearch('');
                                                     inputRef.current?.focus();
-                                                }, children: "Clear" }) })] }) }), _jsx("div", { className: "lg:bg-bg-primary lg:border-border-primary mt-2xl p-xl pb-3xl lg:mt-2 lg:max-h-[41rem] lg:overflow-y-auto lg:rounded-xl lg:border", children: search.length <= 0 ? (_jsx(Alert, { message: "Search for your favorite game or provider." })) : search.length >= 1 && search.length <= 2 ? (_jsx(Alert, { message: "Search requires at least 3 characters." })) : (_jsxs(_Fragment, { children: [empty && _jsx(Alert, { message: "No results found" }), !empty && (_jsxs(_Fragment, { children: [gameProviders.length > 0 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "text-lg font-semibold", children: "Providers" }), _jsx("div", { className: "mt-3.5 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('bg-gray-800 flex h-14 w-full items-center rounded-md', classNames.providerThumbnailRoot), onClick: () => {
+                                                }, children: "Clear" }) })] }) }), _jsx("div", { className: "lg:bg-bg-primary lg:border-border-primary mt-2xl p-xl pb-3xl lg:mt-2 lg:max-h-[41rem] lg:overflow-y-auto lg:rounded-xl lg:border", children: search.length <= 0 ? (_jsx(Alert, { message: "Search for your favorite game or provider." })) : search.length >= 1 && search.length <= 2 ? (_jsx(Alert, { message: "Search requires at least 3 characters." })) : (_jsxs(_Fragment, { children: [empty && _jsx(Alert, { message: "No results found" }), !empty && (_jsxs(_Fragment, { children: [gameProviders.length > 0 && (_jsxs(_Fragment, { children: [_jsx("h2", { className: "text-lg font-semibold", children: "Providers" }), _jsx("div", { className: "mb-3xl mt-3.5 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('bg-gray-800 flex h-14 w-full items-center rounded-md', 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: "mt-3xl text-lg font-semibold", 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, { 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: "text-lg font-semibold", 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, { 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/constants/EnvVar.d.ts

@@ -3,3 +3,4 @@ export declare const PLATFORM_ID: string;
 export declare const PLATFORM_CODE: string;
 export declare const ENVIRONMENT: "production" | "development";
 export declare const BYPASS_RECAPTCHA: boolean;
+export declare const DOMAIN: string;

package/dist/constants/EnvVar.js

@@ -26,3 +26,8 @@ export const BYPASS_RECAPTCHA = z
     .transform(Boolean)
     .catch(false)
     .parse(process.env.NEXT_PUBLIC_BYPASS_RECAPTCHA);
+export const DOMAIN = z
+    .string()
+    .url('Environment variable "NEXT_PUBLIC_DOMAIN" must be a valid URL')
+    .catch('http://localhost')
+    .parse(process.env.NEXT_PUBLIC_DOMAIN);

package/dist/handlers.js

@@ -1,7 +1,7 @@
 import { addDays, addMinutes, subMinutes } from 'date-fns';
 import { NextResponse } from 'next/server';
 import { z } from 'zod';
-import { ACCESS_TOKEN_COOKIE_NAME, BYPASS_RECAPTCHA, PLATFORM_CODE, RECAPTCHA_HEADER_KEY, REFRESH_TOKEN_COOKIE_NAME, } from './constants/index.js';
+import { ACCESS_TOKEN_COOKIE_NAME, PLATFORM_CODE, RECAPTCHA_HEADER_KEY, REFRESH_TOKEN_COOKIE_NAME, } from './constants/index.js';
 import { authenticate, createSession, destroySession, refreshSession, } from './services/auth.js';
 const CreateSessionDefinition = z.union([
     z.object({
@@ -172,9 +172,6 @@ export const POST = async (request, { params }) => {
                     ...(recaptcha && {
                         [RECAPTCHA_HEADER_KEY]: recaptcha,
                     }),
-                    ...(BYPASS_RECAPTCHA && {
-                        'Test-Pass': '',
-                    }),
                 },
             });
             if (res.authenticator) {

package/dist/server/utils/prefetchBonusesQuery.d.ts

@@ -1 +1,2 @@
-export declare const prefetchBonusesQuery: () => Promise<void>;
+import { type BonusesInput } from '../../services/wallet';
+export declare const prefetchBonusesQuery: (input?: BonusesInput) => Promise<void>;

package/dist/server/utils/prefetchBonusesQuery.js

@@ -3,15 +3,15 @@ import { getQueryClient } from '../../utils/getQueryClient.js';
 import { log } from '../../utils/log.js';
 import { getBonusesQueryKey } from '../../utils/queryKeys.js';
 import { getSession } from '../services/getSession.js';
-export const prefetchBonusesQuery = async () => {
+export const prefetchBonusesQuery = async (input) => {
     const session = await getSession();
     if (session.status === 'unauthenticated')
         return;
     await getQueryClient()
         .prefetchQuery({
-        queryKey: getBonusesQueryKey(),
+        queryKey: getBonusesQueryKey(input),
         queryFn: async ({ signal }) => {
-            return await getBonuses({
+            return await getBonuses(input, {
                 signal,
                 headers: {
                     Authorization: `Bearer ${session.token}`,

package/dist/services/graphqlRequest.js

@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
-import { BYPASS_RECAPTCHA, ENVIRONMENT, PLATFORM_CODE, PLATFORM_ID, RECAPTCHA_HEADER_KEY, SITE_ID, TEST_PASS_HEADER_KEY, } from '../constants/index.js';
+import { BYPASS_RECAPTCHA, DOMAIN, ENVIRONMENT, PLATFORM_CODE, PLATFORM_ID, RECAPTCHA_HEADER_KEY, SITE_ID, TEST_PASS_HEADER_KEY, } from '../constants/index.js';
 export async function graphqlRequest(url, query, variables, options) {
     const headers = new Headers();
     headers.set('Role', 'MEMBER');
@@ -9,6 +9,7 @@ export async function graphqlRequest(url, query, variables, options) {
     headers.set('Environment', ENVIRONMENT);
     headers.set('Accept', 'application/json');
     headers.set('Content-Type', 'application/json');
+    headers.set('Domain', DOMAIN);
     new Headers(options?.headers).forEach((value, key) => {
         headers.set(key, value);
     });
@@ -113,6 +114,7 @@ export async function graphqlUpload(url, query, variables, options) {
     headers.set('Platform-ID', PLATFORM_ID);
     headers.set('Platform-Code', PLATFORM_CODE);
     headers.set('Environment', ENVIRONMENT);
+    headers.set('Domain', DOMAIN);
     headers.delete('Content-Type');
     if (BYPASS_RECAPTCHA) {
         headers.set(TEST_PASS_HEADER_KEY, '');

package/dist/services/httpRequest.js

@@ -1,5 +1,5 @@
 import { z } from 'zod';
-import { BYPASS_RECAPTCHA, ENVIRONMENT, PLATFORM_CODE, PLATFORM_ID, RECAPTCHA_HEADER_KEY, SITE_ID, TEST_PASS_HEADER_KEY, } from '../constants/index.js';
+import { BYPASS_RECAPTCHA, DOMAIN, ENVIRONMENT, PLATFORM_CODE, PLATFORM_ID, RECAPTCHA_HEADER_KEY, SITE_ID, TEST_PASS_HEADER_KEY, } from '../constants/index.js';
 export async function httpRequest(url, opts = {}) {
     const headers = new Headers(opts.headers);
     headers.set('Role', 'MEMBER');
@@ -7,6 +7,7 @@ export async function httpRequest(url, opts = {}) {
     headers.set('Platform-ID', PLATFORM_ID);
     headers.set('Platform-Code', PLATFORM_CODE);
     headers.set('Environment', ENVIRONMENT);
+    headers.set('Domain', DOMAIN);
     new Headers(opts.headers).forEach((value, key) => {
         headers.set(key, value);
     });
@@ -44,6 +45,7 @@ httpRequest.json = async (url, opts = {}) => {
     headers.set('Platform-Code', PLATFORM_CODE);
     headers.set('Accept', 'application/json');
     headers.set('Content-Type', 'application/json');
+    headers.set('Domain', DOMAIN);
     new Headers(opts.headers).forEach((value, key) => {
         headers.set(key, value);
     });

package/dist/services/queries.d.ts

@@ -47,7 +47,7 @@ export declare const CASHBACK_FRAGMENT = "\n  \n  fragment FileFragment on File
 export declare const CASHBACKS = "\n  \n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  fragment CashbackFragment on Cashback {\n    id\n    name\n    banner {\n      ...FileFragment\n    }\n    minimumCashback\n    maximumMonthlyCashback\n    status\n    description\n    activationStartDateTime\n    activationEndDateTime\n    turnoverContributionPercentagePerGameProvider\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  query Cashbacks {\n    cashbacks {\n      ...CashbackFragment\n    }\n  }\n";
 export declare const CASHBACK = "\n  \n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  fragment CashbackFragment on Cashback {\n    id\n    name\n    banner {\n      ...FileFragment\n    }\n    minimumCashback\n    maximumMonthlyCashback\n    status\n    description\n    activationStartDateTime\n    activationEndDateTime\n    turnoverContributionPercentagePerGameProvider\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  query Cashback($id: ObjectId!) {\n    node(id: $id) {\n      ... on Cashback {\n        ...CashbackFragment\n      }\n    }\n  }\n";
 export declare const BONUS_FRAGMENT = "\n  \n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  fragment PromoFragment on Promo {\n    id\n    type\n    name\n    banner {\n      ...FileFragment\n    }\n    status\n    description\n    maximumBonusAmount\n    minimumBonusAmount\n    maximumDepositAmount\n    minimumDepositAmount\n    activationStartDateTime\n    turnoverRequirementContributionPercentagePerGameProvider\n    activationEndDateTime\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  fragment BonusFragment on Bonus {\n    id\n    promo {\n      ...PromoFragment\n    }\n    deposit {\n      type\n      amount\n      netAmount\n      fee\n      status\n      reference\n      dateTimeCreated\n      dateTimeLastUpdated\n    }\n    amount\n    balance\n    turnoverRequirement\n    currentTurnoverRequirementContribution\n    currentTurnoverRequirementContributionPercentage\n    turnoverRequirementContributionPercentagePerGameProvider\n    enabledGameProviders\n    expiration\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n";
-export declare const BONUSES = "\n  \n  \n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  fragment PromoFragment on Promo {\n    id\n    type\n    name\n    banner {\n      ...FileFragment\n    }\n    status\n    description\n    maximumBonusAmount\n    minimumBonusAmount\n    maximumDepositAmount\n    minimumDepositAmount\n    activationStartDateTime\n    turnoverRequirementContributionPercentagePerGameProvider\n    activationEndDateTime\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  fragment BonusFragment on Bonus {\n    id\n    promo {\n      ...PromoFragment\n    }\n    deposit {\n      type\n      amount\n      netAmount\n      fee\n      status\n      reference\n      dateTimeCreated\n      dateTimeLastUpdated\n    }\n    amount\n    balance\n    turnoverRequirement\n    currentTurnoverRequirementContribution\n    currentTurnoverRequirementContributionPercentage\n    turnoverRequirementContributionPercentagePerGameProvider\n    enabledGameProviders\n    expiration\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  query Bonuses {\n    bonuses {\n      ...BonusFragment\n    }\n  }\n";
+export declare const BONUSES = "\n  \n  \n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  fragment PromoFragment on Promo {\n    id\n    type\n    name\n    banner {\n      ...FileFragment\n    }\n    status\n    description\n    maximumBonusAmount\n    minimumBonusAmount\n    maximumDepositAmount\n    minimumDepositAmount\n    activationStartDateTime\n    turnoverRequirementContributionPercentagePerGameProvider\n    activationEndDateTime\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  fragment BonusFragment on Bonus {\n    id\n    promo {\n      ...PromoFragment\n    }\n    deposit {\n      type\n      amount\n      netAmount\n      fee\n      status\n      reference\n      dateTimeCreated\n      dateTimeLastUpdated\n    }\n    amount\n    balance\n    turnoverRequirement\n    currentTurnoverRequirementContribution\n    currentTurnoverRequirementContributionPercentage\n    turnoverRequirementContributionPercentagePerGameProvider\n    enabledGameProviders\n    expiration\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  query Bonuses($filter: BonusFilterInput) {\n    bonuses(filter: $filter) {\n      ...BonusFragment\n    }\n  }\n";
 export declare const BONUS_IDS = "\n  query BonusIds {\n    bonuses {\n      id\n    }\n  }\n";
 export declare const BONUS_BALANCES = "\n  query BonusesBalance {\n    bonuses {\n      balance\n    }\n  }\n";
 export declare const BONUS = "\n  \n  \n  \n  fragment FileFragment on File {\n    id\n    url\n    status\n  }\n\n\n  fragment PromoFragment on Promo {\n    id\n    type\n    name\n    banner {\n      ...FileFragment\n    }\n    status\n    description\n    maximumBonusAmount\n    minimumBonusAmount\n    maximumDepositAmount\n    minimumDepositAmount\n    activationStartDateTime\n    turnoverRequirementContributionPercentagePerGameProvider\n    activationEndDateTime\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  fragment BonusFragment on Bonus {\n    id\n    promo {\n      ...PromoFragment\n    }\n    deposit {\n      type\n      amount\n      netAmount\n      fee\n      status\n      reference\n      dateTimeCreated\n      dateTimeLastUpdated\n    }\n    amount\n    balance\n    turnoverRequirement\n    currentTurnoverRequirementContribution\n    currentTurnoverRequirementContributionPercentage\n    turnoverRequirementContributionPercentagePerGameProvider\n    enabledGameProviders\n    expiration\n    dateTimeCreated\n    dateTimeLastUpdated\n  }\n\n\n  query Bonus($id: ObjectId!) {\n    node(id: $id) {\n      ... on Bonus {\n        ...BonusFragment\n      }\n    }\n  }\n";

package/dist/services/queries.js

@@ -1187,8 +1187,8 @@ export const BONUS_FRAGMENT = /* GraphQL */ `
 export const BONUSES = /* GraphQL */ `
   ${BONUS_FRAGMENT}
 
-  query Bonuses {
-    bonuses {
+  query Bonuses($filter: BonusFilterInput) {
+    bonuses(filter: $filter) {
       ...BonusFragment
     }
   }

package/dist/services/wallet.d.ts

@@ -1,5 +1,5 @@
 import type { Simplify, SimplifyDeep } from 'type-fest';
-import type { Bonus, Cashback, CashbackBonus, Deposit, EnumFilterField, FavoriteGame, GameSession, InstapayBank, MayaSession, PointsWallet, Promo, PromoType, Wallet } from '../types';
+import type { Bonus, Cashback, CashbackBonus, DateFilterField, Deposit, EnumFilterField, FavoriteGame, GameSession, InstapayBank, MayaSession, ObjectIdFilterField, PointsWallet, Promo, PromoType, Wallet } from '../types';
 import { type GraphQLRequestOptions } from './graphqlRequest';
 export interface PromosQuery {
     promos: Promo[];
@@ -407,10 +407,18 @@ export interface ValidateMayaSessionMutation {
     validateMayaSession: boolean;
 }
 export declare const validateMayaSession: (options?: GraphQLRequestOptions) => Promise<void>;
+interface BonusesQueryVariables {
+    filter?: {
+        promo?: ObjectIdFilterField;
+        expiration?: DateFilterField;
+        dateTimeCreated?: DateFilterField;
+    };
+}
+export type BonusesInput = SimplifyDeep<BonusesQueryVariables>;
 export interface BonusesQuery {
     bonuses?: Bonus[] | null;
 }
-export declare const getBonuses: (options?: GraphQLRequestOptions) => Promise<Bonus[]>;
+export declare const getBonuses: (input?: BonusesInput, options?: GraphQLRequestOptions) => Promise<Bonus[]>;
 export interface BonusIdsQuery {
     bonuses?: {
         id: string;
@@ -474,3 +482,4 @@ export interface FavoriteGamesQuery {
     favoriteGames: FavoriteGame[];
 }
 export declare const getFavoriteGames: (options?: GraphQLRequestOptions) => Promise<FavoriteGame[]>;
+export {};

package/dist/services/wallet.js

@@ -330,8 +330,8 @@ export const validateMayaSession = async (options) => {
         throw error;
     }
 };
-export const getBonuses = cache(async (options) => {
-    const res = await graphqlRequest(WALLET_GRAPHQL_ENDPOINT, BONUSES, undefined, options);
+export const getBonuses = cache(async (input, options) => {
+    const res = await graphqlRequest(WALLET_GRAPHQL_ENDPOINT, BONUSES, input, options);
     return res.bonuses ?? [];
 });
 export const getBonusesCount = cache(async (options) => {