@opexa/portal-components 0.0.395 → 0.0.397

package/dist/client/hooks/useSignUpMutation.js

@@ -3,6 +3,7 @@ import { registerMemberAccountViaMobile, } from '../../services/account.js';
 import { getSignUpMutationKey } from '../../utils/mutationKeys.js';
 import { getSession } from '../services/getSession.js';
 export const useSignUpMutation = (config) => {
+    const cellxpertCxd = config?.meta?.cellxpertCxd;
     return useMutation({
         ...config,
         mutationKey: getSignUpMutationKey(),
@@ -13,8 +14,8 @@ export const useSignUpMutation = (config) => {
                 ...(session.btag && {
                     btag: session.btag,
                 }),
-                ...(session.cellxpertCxd && {
-                    cellxpertCxd: session.cellxpertCxd,
+                ...(cellxpertCxd && {
+                    cellxpertCxd,
                 }),
             }, {
                 headers: {

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

@@ -1,4 +1,11 @@
+export interface ClassNameEntries {
+    root?: string;
+    walletActions?: string;
+    withdrawButton?: string;
+    depositButton?: string;
+}
 export interface AccountProps {
+    className?: string | ClassNameEntries;
     /**
      * @default '0px'
      * @example

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

@@ -1,5 +1,6 @@
 'use client';
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { isString } from 'lodash-es';
 import Image from 'next/image';
 import Link from 'next/link';
 import { useRouter } from 'next/navigation';
@@ -54,26 +55,34 @@ export function Account(props) {
     const [mobileOffsetTop, desktopOffsetTop] = Array.isArray(props.offsetTop)
         ? props.offsetTop
         : [props.offsetTop ?? '0px', props.offsetTop ?? '0px'];
-    return (_jsxs(AccountPropsContext, { value: Object.assign({}, defaultAccountProps, props), children: [_jsx(Drawer.Root, { open: globalStore.account__mobile.open, onOpenChange: (details) => {
+    const classNames = isString(props.className)
+        ? { root: props.className }
+        : (props.className ?? {});
+    const contextValue = {
+        ...defaultAccountProps,
+        ...props,
+        className: props.className ?? undefined,
+    };
+    return (_jsxs(AccountPropsContext, { value: contextValue, children: [_jsx(Drawer.Root, { open: globalStore.account__mobile.open, onOpenChange: (details) => {
                     globalStore.account__mobile.setOpen(details.open);
-                }, lazyMount: true, unmountOnExit: true, children: _jsx(Portal, { children: _jsx(Drawer.Positioner, { children: _jsxs(Drawer.Content, { className: twMerge('relative', 'flex', 'flex-col', 'top-[var(--offset-top-mobile)]', 'h-[calc(100%-var(--offset-top-mobile))]', 'w-full', 'px-xl', 'py-6', 'lg:top-[var(--offset-top-desktop)]', 'lg:h-[calc(100%-var(--offset-top-desktop))]', 'overflow-auto'), style: {
+                }, lazyMount: true, unmountOnExit: true, children: _jsx(Portal, { children: _jsx(Drawer.Positioner, { children: _jsxs(Drawer.Content, { className: twMerge('relative', 'flex', 'flex-col', 'top-[var(--offset-top-mobile)]', 'h-[calc(100%-var(--offset-top-mobile))]', 'w-full', 'px-xl', 'py-6', 'lg:top-[var(--offset-top-desktop)]', 'lg:h-[calc(100%-var(--offset-top-desktop))]', 'overflow-auto', classNames.root), style: {
                                 ['--offset-top-mobile']: mobileOffsetTop,
                                 ['--offset-top-desktop']: desktopOffsetTop,
-                            }, children: [_jsx(Profile, {}), _jsx(Wallet, {}), _jsx(Links, { router: router })] }) }) }) }), _jsx(Popover.Root, { open: globalStore.account.open, onOpenChange: (details) => {
+                            }, children: [_jsx(Profile, {}), _jsx(Wallet, { classNames: classNames }), _jsx(Links, { router: router })] }) }) }) }), _jsx(Popover.Root, { open: globalStore.account.open, onOpenChange: (details) => {
                     globalStore.account.setOpen(details.open);
                 }, lazyMount: true, unmountOnExit: true, positioning: {
                     placement: 'bottom',
                     strategy: 'fixed',
                 }, ids: {
                     trigger: 'opexa-portal-components:account-trigger',
-                }, children: _jsx(Portal, { children: _jsx(Popover.Positioner, { children: _jsxs(Popover.Content, { className: "relative z-popover w-[23.438rem] ui-closed:animate-fade-out ui-open:animate-fade-in overflow-hidden rounded-xl border border-border-primary bg-bg-primary p-xl", children: [_jsx(Profile, {}), _jsx(Wallet, {}), _jsx(Links, { router: router })] }) }) }) })] }));
+                }, children: _jsx(Portal, { children: _jsx(Popover.Positioner, { children: _jsxs(Popover.Content, { className: "relative z-popover w-[23.438rem] ui-closed:animate-fade-out ui-open:animate-fade-in overflow-hidden rounded-xl border border-border-primary bg-bg-primary p-xl", children: [_jsx(Profile, {}), _jsx(Wallet, { classNames: classNames }), _jsx(Links, { router: router })] }) }) }) })] }));
 }
 function Profile() {
     const accountQuery = useAccountQuery();
     const account = accountQuery.data;
     return (_jsxs("div", { className: "flex shrink-0 items-center gap-lg", children: [_jsx(Image, { src: avatarPlaceholder, alt: "", width: 48, height: 48, className: "size-12" }), _jsxs("div", { className: "grow", children: [_jsx("p", { className: "font-semibold text-text-secondary-700 leading-tight", children: account?.name }), _jsxs("div", { className: "flex", children: [_jsxs("p", { className: "grow items-center text-text-tertiary-600 leading-tight", children: ["ID: ", account?.id] }), _jsxs(Badge.Root, { colorScheme: account?.verified ? 'success' : 'danger', className: "self-start", children: [_jsx(Badge.Indicator, {}), _jsx(Badge.Label, { children: account?.verified ? 'Verified' : 'Unverified' })] })] })] })] }));
 }
-function Wallet() {
+function Wallet({ classNames }) {
     const localeInfo = useLocaleInfo();
     const walletQuery = useWalletQuery({
         refetchInterval: 1000,
@@ -95,12 +104,12 @@ function Wallet() {
                                         }) })] }), _jsxs("div", { children: [_jsx("p", { className: "text-2xs text-text-secondary-700", children: "Bonus Balance" }), _jsx("p", { className: "text-medium text-text-primary-brand", children: formatNumber(bonusBalance, {
                                             currency: localeInfo?.currency.code,
                                             minDecimalPlaces: 2,
-                                        }) })] })] })] }), ' ', _jsxs("div", { className: "mt-3 flex gap-lg", children: [_jsx(Button, { size: "xs", variant: "outline", onClick: () => {
+                                        }) })] })] })] }), ' ', _jsxs("div", { className: twMerge('mt-3 flex gap-lg', classNames.walletActions), children: [_jsx(Button, { size: "xs", variant: "outline", className: classNames.withdrawButton, onClick: () => {
                             globalStore.depositWithdrawal.setOpen(true);
                             globalStore.depositWithdrawal.setTab('WITHDRAWAL');
                             globalStore.profile.setOpen(false);
                             globalStore.mobileProfile.setOpen(false);
-                        }, children: "Withdraw" }), _jsx(Button, { size: "xs", onClick: () => {
+                        }, children: "Withdraw" }), _jsx(Button, { size: "xs", className: classNames.depositButton, onClick: () => {
                             globalStore.depositWithdrawal.setOpen(true);
                             globalStore.depositWithdrawal.setTab('DEPOSIT');
                             globalStore.profile.setOpen(false);

package/dist/components/PortalProvider/CXDTokenObserver.js

@@ -1,30 +1,30 @@
 'use client';
 import { addHours } from 'date-fns';
 import { clamp } from 'lodash-es';
+import { useSearchParams } from 'next/navigation';
 import { useLocalStorage, useTimeout } from 'usehooks-ts';
 import { useAccountQuery } from '../../client/hooks/useAccountQuery.js';
 export function CXDTokenObserver() {
-    const { data: account } = useAccountQuery();
-    const accountCxd = {
-        cxd: account?.cellxpertDetails?.cxd,
-    };
-    const [cxd, setCxd, removeCxd] = useLocalStorage('cxd', null);
+    const searchParams = useSearchParams();
+    const cxdToken = searchParams.get('cxd');
+    const accountQuery = useAccountQuery();
+    const account = accountQuery.data;
+    const [cxd, setCxd, removeCxd] = useLocalStorage('WebPortalCellxpertCxd', null);
     const now = new Date();
+    const shouldTimeoutRun = cxdToken && account;
     const removeCxdUntilInMs = cxd?.timestamp
         ? clamp(cxd.timestamp - now.getTime(), 0, Infinity)
         : 0;
     useTimeout(() => {
-        const isSame = cxd?.cxd === accountCxd.cxd;
+        const isSame = cxd?.cxd === cxdToken;
         if (!isSame) {
             const extendedTimestamp = addHours(new Date(), 6).getTime();
             setCxd({
-                cxd: accountCxd.cxd,
+                cxd: cxdToken,
                 timestamp: extendedTimestamp,
             });
         }
-    }, account ? 100 : null);
-    useTimeout(() => {
-        removeCxd();
-    }, account ? removeCxdUntilInMs : null);
+    }, shouldTimeoutRun ? 100 : null);
+    useTimeout(() => removeCxd(), shouldTimeoutRun ? removeCxdUntilInMs : null);
     return null;
 }

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

@@ -1,4 +1,4 @@
-import type { PropsWithChildren } from 'react';
+import { type PropsWithChildren } from 'react';
 export interface ProvidersProps {
     recaptchaSiteKey?: string;
 }

package/dist/components/PortalProvider/Providers.js

@@ -2,9 +2,10 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { QueryClientProvider } from '@tanstack/react-query';
 import { ReCaptchaProvider } from 'next-recaptcha-v3';
+import { Suspense } from 'react';
 import { getQueryClient } from '../../utils/getQueryClient.js';
 import { CXDTokenObserver } from './CXDTokenObserver.js';
 export function Providers({ recaptchaSiteKey, children, }) {
     const queryClient = getQueryClient();
-    return (_jsxs(QueryClientProvider, { client: queryClient, children: [_jsx(CXDTokenObserver, {}), _jsx(ReCaptchaProvider, { reCaptchaKey: recaptchaSiteKey, children: children })] }));
+    return (_jsxs(QueryClientProvider, { client: queryClient, children: [_jsx(Suspense, { children: _jsx(CXDTokenObserver, {}) }), _jsx(ReCaptchaProvider, { reCaptchaKey: recaptchaSiteKey, children: children })] }));
 }

package/dist/components/SignUp/SignUpDefault/SignUpDefaultForm.js

@@ -59,7 +59,9 @@ export function SignUpDefaultForm() {
         responsibleGaming: ctx.responsibleGaming,
     })));
     const search = useSearchParams();
-    const signUpMutation = useSignUpMutation();
+    const signUpMutation = useSignUpMutation({
+        meta: { cellxpertCxd: search.get('cxd') },
+    });
     const signInMutation = useSignInMutation();
     const updateAccountMutation = useUpdateAccountMutation();
     const sendVerificationCodeMutation = useSendVerificationCodeMutation();

package/dist/components/SignUp/SignUpKYC/SignUpKYCForm.js

@@ -67,7 +67,9 @@ export function SignUpKYCForm() {
     })));
     const dialog = useDialogContext();
     const search = useSearchParams();
-    const signUpMutation = useSignUpMutation();
+    const signUpMutation = useSignUpMutation({
+        meta: { cellxpertCxd: search.get('cxd') },
+    });
     const signInMutation = useSignInMutation();
     const updateAccountMutation = useUpdateAccountMutation();
     const sendVerificationCodeMutation = useSendVerificationCodeMutation();

package/dist/constants/StorageKey.d.ts

@@ -2,5 +2,4 @@ export declare const ACCESS_TOKEN_COOKIE_NAME: string;
 export declare const REFRESH_TOKEN_COOKIE_NAME: string;
 export declare const DOMAIN_COOKIE_NAME: string;
 export declare const BTAG_COOKIE_NAME: string;
-export declare const CELLXPERT_CXD_COOKIE_NAME: string;
 export declare const FEATURE_FLAG_LOCAL_STORAGE_KEY: string;

package/dist/constants/StorageKey.js

@@ -2,5 +2,4 @@ export const ACCESS_TOKEN_COOKIE_NAME = 'WebPortalAuthAccessToken';
 export const REFRESH_TOKEN_COOKIE_NAME = 'WebPortalAuthRefreshToken';
 export const DOMAIN_COOKIE_NAME = 'WebPortalDomain';
 export const BTAG_COOKIE_NAME = 'WebPortalBtag';
-export const CELLXPERT_CXD_COOKIE_NAME = 'WebPortalCellxpertCxd';
 export const FEATURE_FLAG_LOCAL_STORAGE_KEY = 'WebPortalFeatureFlag';

package/dist/handlers/getSession.js

@@ -1,13 +1,12 @@
 import { addMinutes } from 'date-fns';
 import { NextResponse } from 'next/server';
-import { ACCESS_TOKEN_COOKIE_NAME, BTAG_COOKIE_NAME, CELLXPERT_CXD_COOKIE_NAME, DOMAIN_COOKIE_NAME, REFRESH_TOKEN_COOKIE_NAME, } from '../constants/index.js';
+import { ACCESS_TOKEN_COOKIE_NAME, BTAG_COOKIE_NAME, DOMAIN_COOKIE_NAME, REFRESH_TOKEN_COOKIE_NAME, } from '../constants/index.js';
 import { refreshSession } from '../services/auth.js';
 export async function getSession(request) {
     const accessToken = request.cookies.get(ACCESS_TOKEN_COOKIE_NAME)?.value;
     const refreshToken = request.cookies.get(REFRESH_TOKEN_COOKIE_NAME)?.value;
     const domain = request.cookies.get(DOMAIN_COOKIE_NAME)?.value;
     const btag = request.cookies.get(BTAG_COOKIE_NAME)?.value;
-    const cellxpertCxd = request.cookies.get(CELLXPERT_CXD_COOKIE_NAME)?.value;
     if (!refreshToken) {
         const response = NextResponse.json({
             ok: true,
@@ -15,7 +14,6 @@ export async function getSession(request) {
                 status: 'unauthenticated',
                 domain,
                 btag,
-                cellxpertCxd,
             },
         });
         response.cookies.delete(ACCESS_TOKEN_COOKIE_NAME);
@@ -58,7 +56,6 @@ export async function getSession(request) {
                     status: 'unauthenticated',
                     domain,
                     btag,
-                    cellxpertCxd,
                 },
             });
             response.cookies.delete(REFRESH_TOKEN_COOKIE_NAME);

package/dist/handlers/index.d.ts

@@ -6,26 +6,26 @@ interface Context {
     params: Promise<Params>;
 }
 export declare const GET: (req: NextRequest, { params }: Context) => Promise<NextResponse<{
-    ok: true;
-    data?: never;
-} | {
     ok: false;
     message: string;
     __error?: unknown;
+} | {
+    ok: true;
+    data: import("../types").Session;
 }> | NextResponse<{
+    ok: true;
+    data?: never;
+} | {
     ok: false;
     message: string;
     __error?: unknown;
-} | {
-    ok: true;
-    data: Record<string, unknown>;
 }> | NextResponse<{
     ok: false;
     message: string;
     __error?: unknown;
 } | {
     ok: true;
-    data: import("../types").Session;
+    data: Record<string, unknown>;
 }>>;
 export declare const DELETE: (req: NextRequest, { params }: Context) => Promise<NextResponse<{
     ok: true;

package/dist/handlers/patchSession.js

@@ -1,7 +1,7 @@
-import { addDays, addHours } from 'date-fns';
+import { addDays } from 'date-fns';
 import { NextResponse } from 'next/server';
 import { z } from 'zod';
-import { BTAG_COOKIE_NAME, CELLXPERT_CXD_COOKIE_NAME, DOMAIN_COOKIE_NAME, } from '../constants/index.js';
+import { BTAG_COOKIE_NAME, DOMAIN_COOKIE_NAME } from '../constants/index.js';
 const UpdateSessionDefinition = z.object({
     domain: z.string().optional().nullable(),
     btag: z.string().optional().nullable(),
@@ -24,13 +24,6 @@ export async function patchSession(request) {
             sameSite: 'strict',
         });
     }
-    if (parsed.data.cellxpertCxd) {
-        response.cookies.set(CELLXPERT_CXD_COOKIE_NAME, parsed.data.cellxpertCxd, {
-            expires: addHours(new Date(), 6),
-            httpOnly: true,
-            sameSite: 'strict',
-        });
-    }
     if (parsed.data.btag) {
         response.cookies.set(BTAG_COOKIE_NAME, parsed.data.btag, {
             expires: addDays(new Date(), 30),