@opexa/portal-components 0.0.273 → 0.0.275

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

@@ -0,0 +1,2 @@
+import type { Query } from '../../types';
+export declare const useSessionHealthQuery: Query<boolean>;

package/dist/client/hooks/useSessionHealthQuery.js

@@ -0,0 +1,29 @@
+import { useQuery } from '@tanstack/react-query';
+import invariant from 'tiny-invariant';
+import { getSessionHealth } from '../../services/auth.js';
+import { getSessionHealthQueryKey } from '../../utils/queryKeys.js';
+import { getSession } from '../services/getSession.js';
+import { useSessionQuery } from './useSessionQuery.js';
+export const useSessionHealthQuery = (config) => {
+    const sessionQuery = useSessionQuery();
+    return useQuery({
+        gcTime: 1000 * 2,
+        staleTime: 1000,
+        ...config,
+        enabled: config?.enabled === false
+            ? false
+            : sessionQuery.data?.status === 'authenticated',
+        queryKey: getSessionHealthQueryKey(),
+        queryFn: async ({ signal }) => {
+            const session = await getSession({ signal });
+            invariant(session.status === 'authenticated');
+            const ok = await getSessionHealth({
+                signal,
+                headers: {
+                    Authorization: `Bearer ${session.token}`,
+                },
+            });
+            return ok;
+        },
+    });
+};

package/dist/components/KYC/KYCReminder.lazy.js

@@ -13,6 +13,7 @@ export function KYCReminder(props) {
     const globalStore = useGlobalStore(useShallow((ctx) => ({
         kyc: ctx.kyc,
         kycReminder: ctx.kycReminder,
+        messages: ctx.messages,
     })));
     const { data: session, isLoading: sessionLoading } = useSessionQuery();
     const { data: account, isLoading: accountLoading } = useAccountQuery();
@@ -26,6 +27,7 @@ export function KYCReminder(props) {
         Boolean(verification?.status === 'APPROVED');
     const hasMissingData = !isBasicInfoCompleted || !isUploadCompleted || !isVerified;
     return (_jsx(Dialog.Root, { open: globalStore.kycReminder.open &&
+            !globalStore.messages.open &&
             !sessionLoading &&
             !accountLoading &&
             !verificationLoading &&

package/dist/components/Messages/MessagesPopup.js

@@ -31,6 +31,7 @@ export function MessagesPopup() {
         gameLaunch: ctx.gameLaunch,
         depositWithdrawal: ctx.depositWithdrawal,
         kycReminder: ctx.kycReminder,
+        signIn: ctx.signIn,
     })));
     const markMessageAsReadMutation = useMarkMessageAsReadMutation();
     const [paused, setPaused] = useState(false);
@@ -72,6 +73,7 @@ export function MessagesPopup() {
             !globalStore.account__mobile.open &&
             !globalStore.kyc.open &&
             !globalStore.kycReminder.open &&
+            !globalStore.signIn.open &&
             !paused,
         refetchInterval: disclosure.open ? undefined : 1000 * 10,
     });
@@ -90,10 +92,10 @@ export function MessagesPopup() {
         if (messages.length <= 0)
             return;
         disclosure.setOpen(true);
-    }, disclosure.open || paused ? null : 2500);
+    }, !disclosure.open && !paused ? 2500 : null);
     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] overflow-y-auto", children: [_jsx(Dialog.CloseTrigger, { children: _jsx(XIcon, {}) }), _jsxs(Carousel.Root, { page: index, onPageChange: (details) => {
+        }, 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] overflow-y-auto 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, autoplay: false, 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(action.url, {
                                                                 questsPageUrl,

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

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

package/dist/components/SessionWatcher/SessionWatcher.js

@@ -0,0 +1,20 @@
+'use client';
+import { useRouter } from 'next/navigation';
+import { useCallback, useEffect } from 'react';
+import { useSessionHealthQuery } from '../../client/hooks/useSessionHealthQuery.js';
+import { useSignOutMutation } from '../../client/hooks/useSignOutMutation.js';
+export function SessionWatcher() {
+    const router = useRouter();
+    const query = useSessionHealthQuery({ refetchInterval: 1000 * 5 });
+    const healthy = query.data ?? true;
+    const mutation = useSignOutMutation();
+    const signOut = useCallback(async () => {
+        await mutation.mutateAsync();
+        router.refresh();
+    }, [mutation, router]);
+    useEffect(() => {
+        if (!healthy)
+            signOut();
+    }, [healthy, signOut]);
+    return null;
+}

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

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

package/dist/components/SessionWatcher/index.js

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

package/dist/handlers/index.d.ts

@@ -18,14 +18,14 @@ export declare const GET: (req: NextRequest, { params }: Context) => Promise<Nex
     __error?: unknown;
 } | {
     ok: true;
-    data: Record<string, unknown>;
+    data: import("../types").Session;
 }> | 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/server/utils/prefetchSessionHealthQuery.d.ts

@@ -0,0 +1 @@
+export declare const prefetchSessionHealthQuery: () => Promise<void>;

package/dist/server/utils/prefetchSessionHealthQuery.js

@@ -0,0 +1,24 @@
+import { cache } from 'react';
+import { getSessionHealth } from '../../services/auth.js';
+import { getQueryClient } from '../../utils/getQueryClient.js';
+import { log } from '../../utils/log.js';
+import { getSessionHealthQueryKey } from '../../utils/queryKeys.js';
+import { getSession } from '../services/getSession.js';
+export const prefetchSessionHealthQuery = cache(async () => {
+    const session = await getSession();
+    if (session.status === 'unauthenticated')
+        return;
+    await getQueryClient()
+        .prefetchQuery({
+        queryKey: getSessionHealthQueryKey(),
+        queryFn: async ({ signal }) => {
+            return await getSessionHealth({
+                signal,
+                headers: {
+                    Authorization: `Bearer ${session.token}`,
+                },
+            });
+        },
+    })
+        .catch(() => log.text("'prefetchSessionHealthQuery' failed", 'error'));
+});

package/dist/services/auth.d.ts

@@ -69,7 +69,7 @@ export interface RefreshSessionMutation extends Omit<CreateSessionTwoFactorAuthD
 }
 export declare function refreshSession(options?: HttpRequestOptions): Promise<RefreshSessionMutation>;
 export declare function destroySession(options?: HttpRequestOptions): Promise<void>;
-export declare function verifySession(options?: HttpRequestOptions): Promise<boolean>;
+export declare function getSessionHealth(options?: HttpRequestOptions): Promise<boolean>;
 export interface SendVerificationCodeInput {
     strict?: boolean;
     channel: 'SMS' | 'EMAIL';

package/dist/services/auth.js

@@ -126,14 +126,13 @@ export async function destroySession(options) {
         /* ignore */
     }
 }
-export async function verifySession(options) {
+export async function getSessionHealth(options) {
     try {
-        const res = await httpRequest(`${AUTH_ENDPOINT}/session`, options);
-        return res.ok;
+        await httpRequest(`${AUTH_ENDPOINT}/session`, options);
+        return true;
     }
     catch {
-        /* Assume session is still valid for unknown errors like Network */
-        return true;
+        return false;
     }
 }
 export async function sendVerificationCode(input, options) {

package/dist/utils/queryKeys.d.ts

@@ -45,3 +45,4 @@ export declare const getOnboardingStatusQueryKey: () => QueryKey;
 export declare const getRecommendedGamesQueryKey: () => QueryKey;
 export declare const getFileQueryKey: (id: string) => QueryKey;
 export declare const getSiteQueryKey: () => QueryKey;
+export declare const getSessionHealthQueryKey: () => QueryKey;

package/dist/utils/queryKeys.js

@@ -42,3 +42,4 @@ export const getOnboardingStatusQueryKey = () => [PARENT_KEY, 'onboardingStatus'
 export const getRecommendedGamesQueryKey = () => [PARENT_KEY, 'recommendedGames'].filter(Boolean);
 export const getFileQueryKey = (id) => [PARENT_KEY, 'file', id].filter(Boolean);
 export const getSiteQueryKey = () => [PARENT_KEY, 'site', SITE_ID].filter(Boolean);
+export const getSessionHealthQueryKey = () => [PARENT_KEY, 'sessionHealth'].filter(Boolean);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@opexa/portal-components",
-  "version": "0.0.273",
+  "version": "0.0.275",
   "exports": {
     "./ui/*": {
       "types": "./dist/ui/*/index.d.ts",