@opexa/portal-components 0.0.370 → 0.0.372

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

@@ -0,0 +1 @@
+export declare function useIdle(timeout: number): boolean;

package/dist/client/hooks/useIdle.js

@@ -0,0 +1,35 @@
+'use client';
+import { useCallback, useEffect, useState } from 'react';
+const IDLE_EVENTS = [
+    'scroll',
+    'resize',
+    'keydown',
+    'mousedown',
+    'touchstart',
+    'mousemove',
+];
+export function useIdle(timeout) {
+    const [isIdle, setIsIdle] = useState(false);
+    const handleWorkerMessage = useCallback(() => {
+        setIsIdle(true);
+    }, []);
+    useEffect(() => {
+        const worker = new Worker('/idle-worker.js');
+        worker.onmessage = handleWorkerMessage;
+        const handleActivity = () => {
+            setIsIdle(false);
+            worker.postMessage({ command: 'reset', idleTime: timeout });
+        };
+        worker.postMessage({ command: 'start', idleTime: timeout });
+        for (const event of IDLE_EVENTS) {
+            window.addEventListener(event, handleActivity);
+        }
+        return () => {
+            worker.terminate();
+            for (const event of IDLE_EVENTS) {
+                window.removeEventListener(event, handleActivity);
+            }
+        };
+    }, [timeout, handleWorkerMessage]);
+    return isIdle;
+}

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

@@ -0,0 +1 @@
+export declare function useIdleLogout(timer?: number): void;

package/dist/client/hooks/useIdleLogout.js

@@ -0,0 +1,82 @@
+'use client';
+import { useRouter } from 'next/navigation';
+import { useEffect, useRef } from 'react';
+import { toaster } from '../utils/toaster.js';
+import { useIdle } from './useIdle.js';
+import { useSessionQuery } from './useSessionQuery.js';
+import { useSignOutMutation } from './useSignOutMutation.js';
+const IDLE_TIMESTAMP_KEY = 'idle-logout-timestamp';
+const DEFAULT_IDLE_TIMER = 1000 * 60 * 15; // 15 minutes
+export function useIdleLogout(timer = DEFAULT_IDLE_TIMER) {
+    const router = useRouter();
+    const sessionQuery = useSessionQuery();
+    const logoutInitiated = useRef(false);
+    const isLoggingOut = useRef(false);
+    const signOutMutation = useSignOutMutation({
+        onSuccess: () => {
+            router.refresh();
+            localStorage.removeItem(IDLE_TIMESTAMP_KEY);
+        },
+        onError: () => {
+            isLoggingOut.current = false;
+        },
+    });
+    const isIdle = useIdle(timer);
+    const sessionStatusRef = useRef(sessionQuery.data?.status);
+    sessionStatusRef.current = sessionQuery.data?.status;
+    useEffect(() => {
+        const handleUnload = () => {
+            if (sessionStatusRef.current === 'authenticated' && !isLoggingOut.current) {
+                localStorage.setItem(IDLE_TIMESTAMP_KEY, Date.now().toString());
+            }
+        };
+        if (sessionQuery.data?.status === 'authenticated') {
+            const lastActivityTimestamp = localStorage.getItem(IDLE_TIMESTAMP_KEY);
+            if (lastActivityTimestamp) {
+                localStorage.removeItem(IDLE_TIMESTAMP_KEY);
+                const timeElapsed = Date.now() - parseInt(lastActivityTimestamp, 10);
+                if (timeElapsed > timer) {
+                    if (!logoutInitiated.current) {
+                        logoutInitiated.current = true;
+                        setTimeout(() => {
+                            toaster.warning({
+                                title: 'You have been away for a while.',
+                                description: 'You have been logged out for inactivity.',
+                            });
+                            isLoggingOut.current = true;
+                            signOutMutation.mutate();
+                        }, 0);
+                    }
+                    return;
+                }
+            }
+            window.addEventListener('beforeunload', handleUnload);
+        }
+        else {
+            localStorage.removeItem(IDLE_TIMESTAMP_KEY);
+        }
+        return () => {
+            window.removeEventListener('beforeunload', handleUnload);
+            handleUnload();
+        };
+    }, [sessionQuery.data?.status, signOutMutation, timer]);
+    useEffect(() => {
+        if (isIdle && sessionQuery.data?.status === 'authenticated') {
+            if (logoutInitiated.current) {
+                return;
+            }
+            logoutInitiated.current = true;
+            setTimeout(() => {
+                toaster.warning({
+                    title: 'You have been idle for a while.',
+                    description: 'You will be logged out for inactivity.',
+                });
+                isLoggingOut.current = true;
+                signOutMutation.mutate();
+            }, 0);
+        }
+        else {
+            logoutInitiated.current = false;
+        }
+    }, [isIdle, sessionQuery.data?.status, signOutMutation]);
+}

package/dist/components/DepositWithdrawal/Deposit/PisoPayDeposit/PisoPayDeposit.js

@@ -164,7 +164,7 @@ export function PisoPayDeposit() {
                     promo: data.promo,
                 }),
             });
-        }), noValidate: true, children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Enter amount you want to withdraw" }), _jsx(Field.Input, { type: "number", ...form.register('amount') }), _jsx(Field.ErrorText, { children: form.formState.errors.amount?.message })] }), _jsx(AmountChoices, { value: parseDecimal(form.watch('amount').trim().replace(/,/g, ''), 0), onChange: (value) => {
+        }), noValidate: true, children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Enter the amount you want to deposit" }), _jsx(Field.Input, { type: "number", ...form.register('amount') }), _jsx(Field.ErrorText, { children: form.formState.errors.amount?.message })] }), _jsx(AmountChoices, { value: parseDecimal(form.watch('amount').trim().replace(/,/g, ''), 0), onChange: (value) => {
                     form.setValue('amount', value.toString(), {
                         shouldTouch: true,
                         shouldDirty: true,

package/dist/components/DepositWithdrawal/Deposit/QRPHDeposit/QRPHDepositForm.js

@@ -103,7 +103,7 @@ export function QRPHDepositForm() {
     }, [form, minimumAmount]);
     if (context.view !== 'form')
         return null;
-    return (_jsxs("form", { onSubmit: form.handleSubmit(context.generateQRCode), noValidate: true, children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Enter amount you want to withdraw" }), _jsx(Field.Input, { type: "number", ...form.register('amount') }), _jsx(Field.ErrorText, { children: form.formState.errors.amount?.message })] }), _jsx(AmountChoices, { value: parseDecimal(form.watch('amount'), 0), onChange: (value) => {
+    return (_jsxs("form", { onSubmit: form.handleSubmit(context.generateQRCode), noValidate: true, children: [_jsxs(Field.Root, { invalid: !!form.formState.errors.amount, className: "mt-3xl", children: [_jsx(Field.Label, { children: "Enter the amount you want to deposit" }), _jsx(Field.Input, { type: "number", ...form.register('amount') }), _jsx(Field.ErrorText, { children: form.formState.errors.amount?.message })] }), _jsx(AmountChoices, { value: parseDecimal(form.watch('amount'), 0), onChange: (value) => {
                     form.setValue('amount', value.toString(), {
                         shouldTouch: true,
                         shouldDirty: true,

package/dist/components/IdleLogout/IdleLogout.d.ts

@@ -0,0 +1,7 @@
+export interface IdleLogoutProps {
+    /**
+     * Idle timer in milliseconds before logout. Defaults to 15 minutes (900000 ms).
+     */
+    timer?: number;
+}
+export declare function IdleLogout({ timer }: IdleLogoutProps): null;

package/dist/components/IdleLogout/IdleLogout.js

@@ -0,0 +1,6 @@
+'use client';
+import { useIdleLogout } from '../../client/hooks/useIdleLogout.js';
+export function IdleLogout({ timer }) {
+    useIdleLogout(timer);
+    return null;
+}

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

@@ -268,8 +268,8 @@ export function SignUpDefaultForm() {
                                         }
                                     }, {
                                         until: (ok) => ok,
-                                        maxAttempt: 5,
-                                        interval: 300,
+                                        maxAttempt: 8,
+                                        interval: 250,
                                     });
                                     await pollUpdateAccount();
                                 }

package/package.json

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