@oxyhq/services 6.9.13 → 6.9.15

package/src/ui/utils/storageHelpers.js

@@ -0,0 +1,114 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getStorageKeys = exports.STORAGE_KEY_PREFIX = exports.createPlatformStorage = exports.isReactNative = void 0;
+/**
+ * Create an in-memory storage implementation used as a safe fallback.
+ */
+const MEMORY_STORAGE = () => {
+    const store = new Map();
+    return {
+        async getItem(key) {
+            return store.get(key) ?? null;
+        },
+        async setItem(key, value) {
+            store.set(key, value);
+        },
+        async removeItem(key) {
+            store.delete(key);
+        },
+        async clear() {
+            store.clear();
+        },
+    };
+};
+/**
+ * Create a web storage implementation backed by `localStorage`.
+ * Falls back to in-memory storage when unavailable.
+ */
+const createWebStorage = () => {
+    if (typeof window === 'undefined' || typeof window.localStorage === 'undefined') {
+        return MEMORY_STORAGE();
+    }
+    return {
+        async getItem(key) {
+            try {
+                return window.localStorage.getItem(key);
+            }
+            catch {
+                return null;
+            }
+        },
+        async setItem(key, value) {
+            try {
+                window.localStorage.setItem(key, value);
+            }
+            catch {
+                // Ignore quota or access issues for now.
+            }
+        },
+        async removeItem(key) {
+            try {
+                window.localStorage.removeItem(key);
+            }
+            catch {
+                // Ignore failures.
+            }
+        },
+        async clear() {
+            try {
+                window.localStorage.clear();
+            }
+            catch {
+                // Ignore failures.
+            }
+        },
+    };
+};
+let asyncStorageInstance = null;
+/**
+ * Lazily import React Native AsyncStorage implementation.
+ */
+const createNativeStorage = async () => {
+    if (asyncStorageInstance) {
+        return asyncStorageInstance;
+    }
+    try {
+        const asyncStorageModule = await import('@react-native-async-storage/async-storage');
+        asyncStorageInstance = asyncStorageModule.default;
+        return asyncStorageInstance;
+    }
+    catch (error) {
+        if (__DEV__) {
+            console.error('Failed to import AsyncStorage:', error);
+        }
+        throw new Error('AsyncStorage is required in React Native environment');
+    }
+};
+/**
+ * Detect whether the current runtime is React Native.
+ */
+const isReactNative = () => typeof navigator !== 'undefined' && navigator.product === 'ReactNative';
+exports.isReactNative = isReactNative;
+/**
+ * Create a platform-appropriate storage implementation.
+ * Defaults to in-memory storage when no platform storage is available.
+ */
+const createPlatformStorage = async () => {
+    if ((0, exports.isReactNative)()) {
+        return createNativeStorage();
+    }
+    return createWebStorage();
+};
+exports.createPlatformStorage = createPlatformStorage;
+exports.STORAGE_KEY_PREFIX = 'oxy_session';
+/**
+ * Produce strongly typed storage key names for the supplied prefix.
+ *
+ * @param prefix - Storage key prefix
+ */
+const getStorageKeys = (prefix = exports.STORAGE_KEY_PREFIX) => ({
+    activeSessionId: `${prefix}_active_session_id`,
+    sessionIds: `${prefix}_session_ids`,
+    language: `${prefix}_language`,
+});
+exports.getStorageKeys = getStorageKeys;

package/src/ui/utils/themeUtils.d.ts

@@ -0,0 +1,10 @@
+/**
+ * Theme Utility Functions
+ *
+ * Re-exports from shared module for cleaner internal imports.
+ * External consumers should use '@oxyhq/services/shared' directly.
+ *
+ * @module ui/utils/themeUtils
+ */
+export { normalizeTheme, normalizeColorScheme, getOppositeTheme, systemPrefersDarkMode, getSystemColorScheme, } from '@oxyhq/core';
+export type { ThemeValue } from '@oxyhq/core';

package/src/ui/utils/themeUtils.js

@@ -0,0 +1,17 @@
+"use strict";
+/**
+ * Theme Utility Functions
+ *
+ * Re-exports from shared module for cleaner internal imports.
+ * External consumers should use '@oxyhq/services/shared' directly.
+ *
+ * @module ui/utils/themeUtils
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getSystemColorScheme = exports.systemPrefersDarkMode = exports.getOppositeTheme = exports.normalizeColorScheme = exports.normalizeTheme = void 0;
+var core_1 = require("@oxyhq/core");
+Object.defineProperty(exports, "normalizeTheme", { enumerable: true, get: function () { return core_1.normalizeTheme; } });
+Object.defineProperty(exports, "normalizeColorScheme", { enumerable: true, get: function () { return core_1.normalizeColorScheme; } });
+Object.defineProperty(exports, "getOppositeTheme", { enumerable: true, get: function () { return core_1.getOppositeTheme; } });
+Object.defineProperty(exports, "systemPrefersDarkMode", { enumerable: true, get: function () { return core_1.systemPrefersDarkMode; } });
+Object.defineProperty(exports, "getSystemColorScheme", { enumerable: true, get: function () { return core_1.getSystemColorScheme; } });

package/src/ui/utils/userUtils.d.ts

@@ -0,0 +1,28 @@
+/**
+ * User display name and date formatting utilities
+ */
+/**
+ * Formats a date string to a readable format (e.g., "Feb 21, 2025")
+ */
+export declare const formatDate: (dateString: string | undefined | null | Date) => string;
+/**
+ * Gets a display name from user data
+ */
+export declare const getDisplayName: (user: {
+    name?: {
+        full?: string;
+        first?: string;
+        last?: string;
+    };
+    username?: string;
+} | null | undefined) => string;
+/**
+ * Gets a short display name (first name or username)
+ */
+export declare const getShortDisplayName: (user: {
+    name?: {
+        first?: string;
+        full?: string;
+    };
+    username?: string;
+} | null | undefined) => string;

package/src/ui/utils/userUtils.js

@@ -0,0 +1,54 @@
+"use strict";
+/**
+ * User display name and date formatting utilities
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getShortDisplayName = exports.getDisplayName = exports.formatDate = void 0;
+/**
+ * Formats a date string to a readable format (e.g., "Feb 21, 2025")
+ */
+const formatDate = (dateString) => {
+    if (!dateString)
+        return '';
+    try {
+        const date = dateString instanceof Date ? dateString : new Date(dateString);
+        if (Number.isNaN(date.getTime()))
+            return '';
+        return date.toLocaleDateString('en-US', {
+            month: 'short',
+            day: 'numeric',
+            year: 'numeric',
+        });
+    }
+    catch {
+        return '';
+    }
+};
+exports.formatDate = formatDate;
+/**
+ * Gets a display name from user data
+ */
+const getDisplayName = (user) => {
+    if (!user)
+        return 'User';
+    const fullName = user.name?.full;
+    if (fullName)
+        return fullName;
+    const firstLast = [user.name?.first, user.name?.last].filter(Boolean).join(' ').trim();
+    if (firstLast)
+        return firstLast;
+    return user.username || 'User';
+};
+exports.getDisplayName = getDisplayName;
+/**
+ * Gets a short display name (first name or username)
+ */
+const getShortDisplayName = (user) => {
+    if (!user)
+        return 'User';
+    const firstName = user.name?.first || user.name?.full?.split(' ')[0];
+    if (firstName)
+        return firstName;
+    return user.username || 'User';
+};
+exports.getShortDisplayName = getShortDisplayName;

package/src/utils/hookUtils.d.ts

@@ -0,0 +1,101 @@
+/**
+ * React hook utilities for common patterns and state management
+ */
+/**
+ * Hook for managing async operations with loading, error, and data states
+ */
+export declare function useAsync<T>(asyncFn: () => Promise<T>, deps?: React.DependencyList): {
+    data: T | null;
+    loading: boolean;
+    error: Error | null;
+    execute: () => Promise<T>;
+};
+/**
+ * Hook for managing async operations that execute on mount
+ */
+export declare function useAsyncEffect<T>(asyncFn: () => Promise<T>, deps?: React.DependencyList): {
+    data: T | null;
+    loading: boolean;
+    error: Error | null;
+};
+/**
+ * Hook for debounced values
+ */
+export declare function useDebounce<T>(value: T, delay: number): T;
+/**
+ * Hook for throttled values
+ */
+export declare function useThrottle<T>(value: T, delay: number): T;
+/**
+ * Hook for previous value
+ */
+export declare function usePrevious<T>(value: T): T | undefined;
+/**
+ * Hook for boolean state with toggle
+ */
+export declare function useToggle(initialValue?: boolean): {
+    value: boolean;
+    toggle: () => void;
+    setTrue: () => void;
+    setFalse: () => void;
+    setValue: import("react").Dispatch<import("react").SetStateAction<boolean>>;
+};
+/**
+ * Hook for counter state
+ */
+export declare function useCounter(initialValue?: number): {
+    count: number;
+    increment: () => void;
+    decrement: () => void;
+    reset: () => void;
+    setValue: (value: number) => void;
+};
+/**
+ * Hook for local storage (platform-safe)
+ */
+export declare function useLocalStorage<T>(key: string, initialValue: T): readonly [T, (value: T | ((val: T) => T)) => void];
+/**
+ * Hook for session storage (platform-safe)
+ */
+export declare function useSessionStorage<T>(key: string, initialValue: T): readonly [T, (value: T | ((val: T) => T)) => void];
+/**
+ * Hook for window size (platform-safe)
+ */
+export declare function useWindowSize(): {
+    width: number;
+    height: number;
+};
+/**
+ * Hook for scroll position (platform-safe)
+ */
+export declare function useScrollPosition(): number;
+/**
+ * Hook for online/offline status (platform-safe)
+ */
+export declare function useOnlineStatus(): boolean;
+/**
+ * Hook for media queries (platform-safe)
+ */
+export declare function useMediaQuery(query: string): boolean;
+/**
+ * Hook for keyboard events (platform-safe)
+ */
+export declare function useKeyPress(targetKey: string): boolean;
+/**
+ * Hook for click outside detection (platform-safe)
+ */
+export declare function useClickOutside(ref: React.RefObject<HTMLElement>, handler: () => void): void;
+/**
+ * Hook for form validation
+ */
+export declare function useFormValidation<T extends Record<string, unknown>>(initialValues: T, validationSchema: (values: T) => Partial<Record<keyof T, string>>): {
+    values: T;
+    errors: Partial<Record<keyof T, string>>;
+    touched: Partial<Record<keyof T, boolean>>;
+    isValid: boolean;
+    setValue: (field: keyof T, value: T[keyof T]) => void;
+    setTouchedField: (field: keyof T) => void;
+    setValues: import("react").Dispatch<import("react").SetStateAction<T>>;
+    setErrors: import("react").Dispatch<import("react").SetStateAction<Partial<Record<keyof T, string>>>>;
+    setTouched: import("react").Dispatch<import("react").SetStateAction<Partial<Record<keyof T, boolean>>>>;
+};

package/src/utils/hookUtils.js

@@ -0,0 +1,373 @@
+"use strict";
+/**
+ * React hook utilities for common patterns and state management
+ */
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useAsync = useAsync;
+exports.useAsyncEffect = useAsyncEffect;
+exports.useDebounce = useDebounce;
+exports.useThrottle = useThrottle;
+exports.usePrevious = usePrevious;
+exports.useToggle = useToggle;
+exports.useCounter = useCounter;
+exports.useLocalStorage = useLocalStorage;
+exports.useSessionStorage = useSessionStorage;
+exports.useWindowSize = useWindowSize;
+exports.useScrollPosition = useScrollPosition;
+exports.useOnlineStatus = useOnlineStatus;
+exports.useMediaQuery = useMediaQuery;
+exports.useKeyPress = useKeyPress;
+exports.useClickOutside = useClickOutside;
+exports.useFormValidation = useFormValidation;
+const react_1 = require("react");
+// Platform detection for SSR/Node.js/React Native safety
+const isBrowser = typeof window !== 'undefined';
+const hasLocalStorage = isBrowser && typeof window.localStorage !== 'undefined';
+const hasSessionStorage = isBrowser && typeof window.sessionStorage !== 'undefined';
+const hasNavigator = typeof navigator !== 'undefined';
+/**
+ * Hook for managing async operations with loading, error, and data states
+ */
+function useAsync(asyncFn, deps = []) {
+    const [data, setData] = (0, react_1.useState)(null);
+    const [loading, setLoading] = (0, react_1.useState)(false);
+    const [error, setError] = (0, react_1.useState)(null);
+    // biome-ignore lint/correctness/useExhaustiveDependencies: asyncFn is intentionally excluded — this is a mount-only pattern where the callback identity should not cause re-creation
+    const execute = (0, react_1.useCallback)(async () => {
+        setLoading(true);
+        setError(null);
+        try {
+            const result = await asyncFn();
+            setData(result);
+            return result;
+        }
+        catch (err) {
+            const error = err instanceof Error ? err : new Error(String(err));
+            setError(error);
+            throw error;
+        }
+        finally {
+            setLoading(false);
+        }
+    }, deps);
+    return { data, loading, error, execute };
+}
+/**
+ * Hook for managing async operations that execute on mount
+ */
+function useAsyncEffect(asyncFn, deps = []) {
+    const [data, setData] = (0, react_1.useState)(null);
+    const [loading, setLoading] = (0, react_1.useState)(true);
+    const [error, setError] = (0, react_1.useState)(null);
+    // biome-ignore lint/correctness/useExhaustiveDependencies: asyncFn is intentionally excluded — this is a mount-only pattern where the callback identity should not trigger re-execution
+    (0, react_1.useEffect)(() => {
+        let mounted = true;
+        const execute = async () => {
+            try {
+                const result = await asyncFn();
+                if (mounted) {
+                    setData(result);
+                    setLoading(false);
+                }
+            }
+            catch (err) {
+                if (mounted) {
+                    const error = err instanceof Error ? err : new Error(String(err));
+                    setError(error);
+                    setLoading(false);
+                }
+            }
+        };
+        execute();
+        return () => {
+            mounted = false;
+        };
+    }, deps);
+    return { data, loading, error };
+}
+/**
+ * Hook for debounced values
+ */
+function useDebounce(value, delay) {
+    const [debouncedValue, setDebouncedValue] = (0, react_1.useState)(value);
+    (0, react_1.useEffect)(() => {
+        const handler = setTimeout(() => {
+            setDebouncedValue(value);
+        }, delay);
+        return () => {
+            clearTimeout(handler);
+        };
+    }, [value, delay]);
+    return debouncedValue;
+}
+/**
+ * Hook for throttled values
+ */
+function useThrottle(value, delay) {
+    const [throttledValue, setThrottledValue] = (0, react_1.useState)(value);
+    const lastRun = (0, react_1.useRef)(Date.now());
+    (0, react_1.useEffect)(() => {
+        const handler = setTimeout(() => {
+            if (Date.now() - lastRun.current >= delay) {
+                setThrottledValue(value);
+                lastRun.current = Date.now();
+            }
+        }, delay - (Date.now() - lastRun.current));
+        return () => {
+            clearTimeout(handler);
+        };
+    }, [value, delay]);
+    return throttledValue;
+}
+/**
+ * Hook for previous value
+ */
+function usePrevious(value) {
+    const ref = (0, react_1.useRef)(undefined);
+    (0, react_1.useEffect)(() => {
+        ref.current = value;
+    });
+    return ref.current;
+}
+/**
+ * Hook for boolean state with toggle
+ */
+function useToggle(initialValue = false) {
+    const [value, setValue] = (0, react_1.useState)(initialValue);
+    const toggle = (0, react_1.useCallback)(() => setValue(v => !v), []);
+    const setTrue = (0, react_1.useCallback)(() => setValue(true), []);
+    const setFalse = (0, react_1.useCallback)(() => setValue(false), []);
+    return { value, toggle, setTrue, setFalse, setValue };
+}
+/**
+ * Hook for counter state
+ */
+function useCounter(initialValue = 0) {
+    const [count, setCount] = (0, react_1.useState)(initialValue);
+    const increment = (0, react_1.useCallback)(() => setCount(c => c + 1), []);
+    const decrement = (0, react_1.useCallback)(() => setCount(c => c - 1), []);
+    const reset = (0, react_1.useCallback)(() => setCount(initialValue), [initialValue]);
+    const setValue = (0, react_1.useCallback)((value) => setCount(value), []);
+    return { count, increment, decrement, reset, setValue };
+}
+/**
+ * Hook for local storage (platform-safe)
+ */
+function useLocalStorage(key, initialValue) {
+    const [storedValue, setStoredValue] = (0, react_1.useState)(() => {
+        if (!hasLocalStorage)
+            return initialValue;
+        try {
+            const item = window.localStorage.getItem(key);
+            return item ? JSON.parse(item) : initialValue;
+        }
+        catch {
+            // Silently fail and return initial value
+            return initialValue;
+        }
+    });
+    const setValue = (0, react_1.useCallback)((value) => {
+        try {
+            const valueToStore = value instanceof Function ? value(storedValue) : value;
+            setStoredValue(valueToStore);
+            if (hasLocalStorage) {
+                window.localStorage.setItem(key, JSON.stringify(valueToStore));
+            }
+        }
+        catch {
+            // Silently fail - storage might be full or blocked
+        }
+    }, [key, storedValue]);
+    return [storedValue, setValue];
+}
+/**
+ * Hook for session storage (platform-safe)
+ */
+function useSessionStorage(key, initialValue) {
+    const [storedValue, setStoredValue] = (0, react_1.useState)(() => {
+        if (!hasSessionStorage)
+            return initialValue;
+        try {
+            const item = window.sessionStorage.getItem(key);
+            return item ? JSON.parse(item) : initialValue;
+        }
+        catch {
+            // Silently fail and return initial value
+            return initialValue;
+        }
+    });
+    const setValue = (0, react_1.useCallback)((value) => {
+        try {
+            const valueToStore = value instanceof Function ? value(storedValue) : value;
+            setStoredValue(valueToStore);
+            if (hasSessionStorage) {
+                window.sessionStorage.setItem(key, JSON.stringify(valueToStore));
+            }
+        }
+        catch {
+            // Silently fail - storage might be full or blocked
+        }
+    }, [key, storedValue]);
+    return [storedValue, setValue];
+}
+/**
+ * Hook for window size (platform-safe)
+ */
+function useWindowSize() {
+    const [windowSize, setWindowSize] = (0, react_1.useState)({
+        width: isBrowser ? window.innerWidth : 0,
+        height: isBrowser ? window.innerHeight : 0,
+    });
+    (0, react_1.useEffect)(() => {
+        if (!isBrowser)
+            return;
+        const handleResize = () => {
+            setWindowSize({
+                width: window.innerWidth,
+                height: window.innerHeight,
+            });
+        };
+        window.addEventListener('resize', handleResize);
+        return () => window.removeEventListener('resize', handleResize);
+    }, []);
+    return windowSize;
+}
+/**
+ * Hook for scroll position (platform-safe)
+ */
+function useScrollPosition() {
+    const [scrollPosition, setScrollPosition] = (0, react_1.useState)(0);
+    (0, react_1.useEffect)(() => {
+        if (!isBrowser)
+            return;
+        const handleScroll = () => {
+            setScrollPosition(window.pageYOffset);
+        };
+        window.addEventListener('scroll', handleScroll);
+        return () => window.removeEventListener('scroll', handleScroll);
+    }, []);
+    return scrollPosition;
+}
+/**
+ * Hook for online/offline status (platform-safe)
+ */
+function useOnlineStatus() {
+    const [isOnline, setIsOnline] = (0, react_1.useState)(hasNavigator ? navigator.onLine : true);
+    (0, react_1.useEffect)(() => {
+        if (!isBrowser)
+            return;
+        const handleOnline = () => setIsOnline(true);
+        const handleOffline = () => setIsOnline(false);
+        window.addEventListener('online', handleOnline);
+        window.addEventListener('offline', handleOffline);
+        return () => {
+            window.removeEventListener('online', handleOnline);
+            window.removeEventListener('offline', handleOffline);
+        };
+    }, []);
+    return isOnline;
+}
+/**
+ * Hook for media queries (platform-safe)
+ */
+function useMediaQuery(query) {
+    const [matches, setMatches] = (0, react_1.useState)(false);
+    (0, react_1.useEffect)(() => {
+        if (!isBrowser)
+            return;
+        const media = window.matchMedia(query);
+        if (media.matches !== matches) {
+            setMatches(media.matches);
+        }
+        const listener = () => setMatches(media.matches);
+        media.addEventListener('change', listener);
+        return () => media.removeEventListener('change', listener);
+    }, [matches, query]);
+    return matches;
+}
+/**
+ * Hook for keyboard events (platform-safe)
+ */
+function useKeyPress(targetKey) {
+    const [keyPressed, setKeyPressed] = (0, react_1.useState)(false);
+    (0, react_1.useEffect)(() => {
+        if (!isBrowser)
+            return;
+        const downHandler = ({ key }) => {
+            if (key === targetKey) {
+                setKeyPressed(true);
+            }
+        };
+        const upHandler = ({ key }) => {
+            if (key === targetKey) {
+                setKeyPressed(false);
+            }
+        };
+        window.addEventListener('keydown', downHandler);
+        window.addEventListener('keyup', upHandler);
+        return () => {
+            window.removeEventListener('keydown', downHandler);
+            window.removeEventListener('keyup', upHandler);
+        };
+    }, [targetKey]);
+    return keyPressed;
+}
+/**
+ * Hook for click outside detection (platform-safe)
+ */
+function useClickOutside(ref, handler) {
+    (0, react_1.useEffect)(() => {
+        if (!isBrowser)
+            return;
+        const listener = (event) => {
+            if (!ref.current || ref.current.contains(event.target)) {
+                return;
+            }
+            handler();
+        };
+        document.addEventListener('mousedown', listener);
+        document.addEventListener('touchstart', listener);
+        return () => {
+            document.removeEventListener('mousedown', listener);
+            document.removeEventListener('touchstart', listener);
+        };
+    }, [ref, handler]);
+}
+/**
+ * Hook for form validation
+ */
+function useFormValidation(initialValues, validationSchema) {
+    const [values, setValues] = (0, react_1.useState)(initialValues);
+    const [errors, setErrors] = (0, react_1.useState)({});
+    const [touched, setTouched] = (0, react_1.useState)({});
+    const validate = (0, react_1.useCallback)((valuesToValidate) => {
+        return validationSchema(valuesToValidate);
+    }, [validationSchema]);
+    const setValue = (0, react_1.useCallback)((field, value) => {
+        setValues(prev => ({ ...prev, [field]: value }));
+        if (touched[field]) {
+            const newErrors = validate({ ...values, [field]: value });
+            setErrors(prev => ({ ...prev, [field]: newErrors[field] }));
+        }
+    }, [values, touched, validate]);
+    const setTouchedField = (0, react_1.useCallback)((field) => {
+        setTouched(prev => ({ ...prev, [field]: true }));
+        const newErrors = validate(values);
+        setErrors(prev => ({ ...prev, [field]: newErrors[field] }));
+    }, [values, validate]);
+    const isValid = (0, react_1.useMemo)(() => {
+        const validationErrors = validate(values);
+        return Object.keys(validationErrors).length === 0;
+    }, [values, validate]);
+    return {
+        values,
+        errors,
+        touched,
+        isValid,
+        setValue,
+        setTouchedField,
+        setValues,
+        setErrors,
+        setTouched
+    };
+}