@dashadmin/dash-utils 1.3.73 → 1.3.74-srcfree.2

package/src/hooks/useCapacitorKeyboard.ts

@@ -1,213 +0,0 @@
-import { useEffect, useState, useCallback } from 'react';
-
-export interface KeyboardState {
-    isKeyboardOpen: boolean;
-    keyboardHeight: number;
-}
-
-export interface UseCapacitorKeyboardOptions {
-    /** Disable accessory bar for cleaner UI */
-    disableAccessoryBar?: boolean;
-    /** Resize mode: 'body', 'ionic', 'native', 'none' */
-    resizeMode?: 'body' | 'ionic' | 'native' | 'none';
-    /** Enable debug logging */
-    debug?: boolean;
-}
-
-/**
- * Check if Capacitor Keyboard plugin is available
- */
-export const isCapacitorKeyboardAvailable = (): boolean => {
-    const hasCapacitor = !!(window as any)?.Capacitor?.Plugins?.Keyboard;
-    const hasCapacitorKeyboard = !!(window as any)?.CapacitorKeyboard;
-    return hasCapacitor || hasCapacitorKeyboard;
-};
-
-/**
- * Get Capacitor Keyboard instance from window
- */
-export const getCapacitorKeyboard = () => {
-    return (window as any)?.Capacitor?.Plugins?.Keyboard || (window as any)?.CapacitorKeyboard;
-};
-
-/**
- * Hook for Capacitor keyboard detection and management
- * Handles both Capacitor native keyboard and fallback viewport-based detection
- *
- * @param options - Configuration options
- * @returns Keyboard state and utility functions
- */
-export const useCapacitorKeyboard = (options: UseCapacitorKeyboardOptions = {}) => {
-    const {
-        disableAccessoryBar = true,
-        resizeMode = 'body',
-        debug = false
-    } = options;
-
-    const [keyboardState, setKeyboardState] = useState<KeyboardState>({
-        isKeyboardOpen: false,
-        keyboardHeight: 0,
-    });
-
-    const log = useCallback((message: string, data?: any) => {
-        if (debug) {
-            console.log(`[useCapacitorKeyboard] ${message}`, data || '');
-        }
-    }, [debug]);
-
-    // Hide keyboard programmatically
-    const hideKeyboard = useCallback(async () => {
-        if (isCapacitorKeyboardAvailable()) {
-            const Keyboard = getCapacitorKeyboard();
-            if (Keyboard?.hide) {
-                try {
-                    log('Hiding keyboard...');
-                    await Keyboard.hide();
-                } catch (error) {
-                    log('Error hiding keyboard:', error);
-                }
-            }
-        }
-    }, [log]);
-
-    // Show keyboard programmatically
-    const showKeyboard = useCallback(async () => {
-        if (isCapacitorKeyboardAvailable()) {
-            const Keyboard = getCapacitorKeyboard();
-            if (Keyboard?.show) {
-                try {
-                    log('Showing keyboard...');
-                    await Keyboard.show();
-                } catch (error) {
-                    log('Error showing keyboard:', error);
-                }
-            }
-        }
-    }, [log]);
-
-    // Configure Capacitor Keyboard
-    useEffect(() => {
-        const configureKeyboard = async () => {
-            if (isCapacitorKeyboardAvailable()) {
-                const Keyboard = getCapacitorKeyboard();
-                if (Keyboard) {
-                    try {
-                        log('Configuring Capacitor Keyboard...');
-
-                        if (Keyboard.setAccessoryBarVisible) {
-                            await Keyboard.setAccessoryBarVisible({ isVisible: !disableAccessoryBar });
-                        }
-
-                        if (Keyboard.setResizeMode) {
-                            await Keyboard.setResizeMode({ mode: resizeMode });
-                        }
-
-                        log('Capacitor Keyboard configured successfully');
-                    } catch (error) {
-                        log('Error configuring Capacitor Keyboard:', error);
-                    }
-                }
-            }
-        };
-
-        configureKeyboard();
-    }, [disableAccessoryBar, resizeMode, log]);
-
-    // Setup keyboard listeners
-    useEffect(() => {
-        if (isCapacitorKeyboardAvailable()) {
-            const Keyboard = getCapacitorKeyboard();
-
-            if (Keyboard) {
-                log('Using Capacitor Keyboard API');
-
-                const handleKeyboardWillShow = (info: any) => {
-                    log('Keyboard will show', { height: info.keyboardHeight });
-                    setKeyboardState({
-                        isKeyboardOpen: true,
-                        keyboardHeight: info.keyboardHeight,
-                    });
-                };
-
-                const handleKeyboardDidShow = (info: any) => {
-                    setKeyboardState({
-                        isKeyboardOpen: true,
-                        keyboardHeight: info.keyboardHeight,
-                    });
-                };
-
-                const handleKeyboardWillHide = () => {
-                    log('Keyboard will hide');
-                    setKeyboardState({
-                        isKeyboardOpen: false,
-                        keyboardHeight: 0,
-                    });
-                };
-
-                const handleKeyboardDidHide = () => {
-                    setKeyboardState({
-                        isKeyboardOpen: false,
-                        keyboardHeight: 0,
-                    });
-                };
-
-                Keyboard.addListener('keyboardWillShow', handleKeyboardWillShow);
-                Keyboard.addListener('keyboardDidShow', handleKeyboardDidShow);
-                Keyboard.addListener('keyboardWillHide', handleKeyboardWillHide);
-                Keyboard.addListener('keyboardDidHide', handleKeyboardDidHide);
-
-                return () => {
-                    Keyboard.removeAllListeners?.();
-                };
-            }
-        }
-
-        // Fallback: viewport-based detection for web
-        log('Using fallback viewport-based keyboard detection');
-
-        let previousViewportHeight = window.visualViewport?.height || window.innerHeight;
-
-        const handleResize = () => {
-            const viewportHeight = window.visualViewport?.height || window.innerHeight;
-            const screenHeight = window.screen.height;
-
-            // If viewport is significantly smaller than screen, keyboard is likely open
-            const keyboardThreshold = screenHeight * 0.75;
-            const keyboardOpen = viewportHeight < keyboardThreshold;
-
-            if (keyboardOpen !== keyboardState.isKeyboardOpen) {
-                const estimatedKeyboardHeight = keyboardOpen ? screenHeight - viewportHeight : 0;
-                log(keyboardOpen ? 'Keyboard opened (fallback)' : 'Keyboard closed (fallback)', {
-                    height: estimatedKeyboardHeight
-                });
-                setKeyboardState({
-                    isKeyboardOpen: keyboardOpen,
-                    keyboardHeight: estimatedKeyboardHeight,
-                });
-            }
-
-            previousViewportHeight = viewportHeight;
-        };
-
-        window.addEventListener('resize', handleResize);
-        if (window.visualViewport) {
-            window.visualViewport.addEventListener('resize', handleResize);
-        }
-
-        return () => {
-            window.removeEventListener('resize', handleResize);
-            if (window.visualViewport) {
-                window.visualViewport.removeEventListener('resize', handleResize);
-            }
-        };
-    }, [log, keyboardState.isKeyboardOpen]);
-
-    return {
-        ...keyboardState,
-        hideKeyboard,
-        showKeyboard,
-        isCapacitorAvailable: isCapacitorKeyboardAvailable(),
-    };
-};
-
-export default useCapacitorKeyboard;

package/src/hooks/useDeviceStorageSync.ts

@@ -1,70 +0,0 @@
-import { useEffect } from 'react';
-
-/**
- * Hook to sync device storage (Electron store) with localStorage
- * Useful for Electron apps to maintain state persistence
- */
-export const useDeviceStorageSync = () => {
-    useEffect(() => {
-        const syncDeviceStoreToLocalStorage = async () => {
-            const electronStore = (window as any).electronStore;
-            if (electronStore && electronStore.getAll) {
-                // Sync logic can be implemented here if needed
-                // Currently placeholder for future implementation
-                console.log('[useDeviceStorageSync] Electron store detected');
-            }
-        };
-        syncDeviceStoreToLocalStorage();
-    }, []);
-};
-
-/**
- * Sync all data from Electron store to localStorage
- * Call this on app initialization
- */
-export const syncDeviceStoreToLocalStorage = async (): Promise<void> => {
-    const electronStore = (window as any).electronStore;
-    if (electronStore && electronStore.getAll) {
-        try {
-            const allData = await electronStore.getAll();
-            if (allData && typeof allData === 'object') {
-                for (const [key, value] of Object.entries(allData)) {
-                    window.localStorage.setItem(key, JSON.stringify(value));
-                }
-                console.log('[syncDeviceStoreToLocalStorage] Synced electron-store to localStorage');
-            }
-        } catch (err) {
-            console.error('[syncDeviceStoreToLocalStorage] Failed to sync:', err);
-        }
-    }
-};
-
-/**
- * Sync all data from localStorage to Electron store
- * Call this after auth changes or important state updates
- */
-export const syncLocalStorageToDeviceStore = async (): Promise<void> => {
-    const electronStore = (window as any).electronStore;
-    if (electronStore && electronStore.set) {
-        try {
-            for (let i = 0; i < window.localStorage.length; i++) {
-                const key = window.localStorage.key(i);
-                if (key) {
-                    const value = window.localStorage.getItem(key);
-                    if (value !== null) {
-                        try {
-                            await electronStore.set(key, JSON.parse(value));
-                        } catch {
-                            await electronStore.set(key, value);
-                        }
-                    }
-                }
-            }
-            console.log('[syncLocalStorageToDeviceStore] Synced localStorage to electron-store');
-        } catch (err) {
-            console.error('[syncLocalStorageToDeviceStore] Failed to sync:', err);
-        }
-    }
-};
-
-export default useDeviceStorageSync;

package/src/hooks/useDraggable.ts

@@ -1,133 +0,0 @@
-import { useState, useCallback, useEffect } from 'react';
-
-export interface DraggablePosition {
-    x: number;
-    y: number;
-}
-
-export interface UseDraggableOptions {
-    /** Initial position */
-    initialPosition?: DraggablePosition;
-    /** Minimum X position (default: 0) */
-    minX?: number;
-    /** Minimum Y position (default: 0) */
-    minY?: number;
-    /** Maximum X position (default: window.innerWidth - elementWidth) */
-    maxX?: number;
-    /** Maximum Y position (default: window.innerHeight - elementHeight) */
-    maxY?: number;
-    /** Element width for boundary calculation */
-    elementWidth?: number;
-    /** Element height for boundary calculation */
-    elementHeight?: number;
-    /** Callback when position changes */
-    onPositionChange?: (position: DraggablePosition) => void;
-    /** Callback when drag starts */
-    onDragStart?: () => void;
-    /** Callback when drag ends */
-    onDragEnd?: () => void;
-}
-
-export interface UseDraggableReturn {
-    position: DraggablePosition;
-    isDragging: boolean;
-    handleMouseDown: (e: React.MouseEvent) => void;
-    setPosition: (position: DraggablePosition) => void;
-}
-
-/**
- * Hook for making elements draggable
- * Handles mouse events and position calculations
- */
-export const useDraggable = (options: UseDraggableOptions = {}): UseDraggableReturn => {
-    const {
-        initialPosition = { x: 0, y: 0 },
-        minX = 0,
-        minY = 0,
-        maxX,
-        maxY,
-        elementWidth = 400,
-        elementHeight = 200,
-        onPositionChange,
-        onDragStart,
-        onDragEnd,
-    } = options;
-
-    const [position, setPosition] = useState<DraggablePosition>(initialPosition);
-    const [isDragging, setIsDragging] = useState(false);
-    const [dragOffset, setDragOffset] = useState({ x: 0, y: 0 });
-
-    // Calculate boundaries
-    const getMaxX = useCallback(() => {
-        if (maxX !== undefined) return maxX;
-        return typeof window !== 'undefined' ? window.innerWidth - elementWidth : 1000;
-    }, [maxX, elementWidth]);
-
-    const getMaxY = useCallback(() => {
-        if (maxY !== undefined) return maxY;
-        return typeof window !== 'undefined' ? window.innerHeight - elementHeight : 800;
-    }, [maxY, elementHeight]);
-
-    // Handle mouse down - start dragging
-    const handleMouseDown = useCallback((e: React.MouseEvent) => {
-        // Only start drag if clicking on an element with .drag-handle class
-        if ((e.target as HTMLElement).closest('.drag-handle')) {
-            e.preventDefault();
-            setIsDragging(true);
-            setDragOffset({
-                x: e.clientX - position.x,
-                y: e.clientY - position.y,
-            });
-            onDragStart?.();
-        }
-    }, [position, onDragStart]);
-
-    // Handle mouse move
-    const handleMouseMove = useCallback((e: MouseEvent) => {
-        if (isDragging) {
-            e.preventDefault();
-            const newX = Math.max(minX, Math.min(getMaxX(), e.clientX - dragOffset.x));
-            const newY = Math.max(minY, Math.min(getMaxY(), e.clientY - dragOffset.y));
-            const newPosition = { x: newX, y: newY };
-            setPosition(newPosition);
-            onPositionChange?.(newPosition);
-        }
-    }, [isDragging, dragOffset, minX, minY, getMaxX, getMaxY, onPositionChange]);
-
-    // Handle mouse up - stop dragging
-    const handleMouseUp = useCallback(() => {
-        if (isDragging) {
-            setIsDragging(false);
-            onDragEnd?.();
-        }
-    }, [isDragging, onDragEnd]);
-
-    // Add/remove event listeners
-    useEffect(() => {
-        if (isDragging) {
-            document.addEventListener('mousemove', handleMouseMove);
-            document.addEventListener('mouseup', handleMouseUp);
-            document.body.style.userSelect = 'none';
-
-            return () => {
-                document.removeEventListener('mousemove', handleMouseMove);
-                document.removeEventListener('mouseup', handleMouseUp);
-                document.body.style.userSelect = '';
-            };
-        }
-    }, [isDragging, handleMouseMove, handleMouseUp]);
-
-    // Update position when initialPosition changes
-    useEffect(() => {
-        setPosition(initialPosition);
-    }, [initialPosition.x, initialPosition.y]);
-
-    return {
-        position,
-        isDragging,
-        handleMouseDown,
-        setPosition,
-    };
-};
-
-export default useDraggable;

package/src/hooks/useMenuStateInit.ts

@@ -1,85 +0,0 @@
-/**
- * Menu State Initialization Hook
- *
- * Hook to initialize menu/navigation state from localStorage
- * and sync it with Redux store.
- */
-import { useEffect } from 'react';
-import { useDispatch } from 'react-redux';
-import { dashStorage } from '../utils/dashDtorage';
-
-/**
- * Options for the useMenuStateInit hook
- */
-export interface UseMenuStateInitOptions {
-    /** Storage key for nav expanded state */
-    navExpandedKey?: string;
-    /** Storage key for nav size */
-    navSizeKey?: string;
-    /** Redux action creator for setting nav expanded */
-    setNavExpandedAction?: (isExpanded: boolean) => any;
-    /** Redux action creator for setting nav size */
-    setNavSizeAction?: (size: string) => any;
-}
-
-/**
- * Default options
- */
-const defaultOptions: UseMenuStateInitOptions = {
-    navExpandedKey: 'dashNavExpanded',
-    navSizeKey: 'dashNavSize',
-};
-
-/**
- * Hook to initialize menu state from localStorage
- * Reads persisted navigation state and dispatches Redux actions
- */
-export const useMenuStateInit = (options: UseMenuStateInitOptions = {}) => {
-    const dispatch = useDispatch();
-    const {
-        navExpandedKey = defaultOptions.navExpandedKey!,
-        setNavExpandedAction
-    } = options;
-
-    useEffect(() => {
-        if (!setNavExpandedAction) return;
-
-        try {
-            const savedNavState = dashStorage.getItem(navExpandedKey);
-            if (savedNavState !== null) {
-                const isExpanded = savedNavState === 'true';
-                dispatch(setNavExpandedAction(isExpanded));
-            }
-        } catch (e) {
-            console.error('Error accessing localStorage:', e);
-        }
-    }, [dispatch, navExpandedKey, setNavExpandedAction]);
-};
-
-/**
- * Initialize menu state without Redux (returns state)
- * Useful for initial state setup
- */
-export const getInitialMenuState = (navExpandedKey: string = 'dashNavExpanded') => {
-    try {
-        const savedNavState = dashStorage.getItem(navExpandedKey);
-        return savedNavState !== null ? savedNavState === 'true' : true;
-    } catch (e) {
-        console.error('Error accessing localStorage:', e);
-        return true;
-    }
-};
-
-/**
- * Get initial nav size from localStorage
- */
-export const getInitialNavSize = (navSizeKey: string = 'dashNavSize') => {
-    try {
-        return dashStorage.getItem(navSizeKey) || 'small';
-    } catch (e) {
-        console.error('Error accessing localStorage:', e);
-        return 'small';
-    }
-};
-
-export default useMenuStateInit;

package/src/hooks/useMobileDetection.ts

@@ -1,165 +0,0 @@
-import { useEffect, useState, useCallback } from 'react';
-
-export interface MobileDetectionState {
-    isMobile: boolean;
-    isAndroid: boolean;
-    isIOS: boolean;
-    isWebView: boolean;
-    screenWidth: number;
-}
-
-export interface UseMobileDetectionOptions {
-    /** Screen width threshold to consider as mobile (default: 700) */
-    mobileBreakpoint?: number;
-    /** Enable debug logging */
-    debug?: boolean;
-}
-
-/**
- * Check if the current environment is a mobile device
- * Based on body classes and screen width
- */
-export const checkMobileDevice = (mobileBreakpoint: number = 700): boolean => {
-    // Check body classes for mobile devices
-    const bodyClasses = document.body.className;
-    const hasMobileClass = bodyClasses.includes('webview') ||
-                          bodyClasses.includes('android') ||
-                          bodyClasses.includes('ios') ||
-                          bodyClasses.includes('mobile');
-
-    // Check screen width
-    const screenWidth = window.innerWidth;
-    const isSmallScreen = screenWidth < mobileBreakpoint;
-
-    // Consider mobile if either condition is true
-    return hasMobileClass || isSmallScreen;
-};
-
-/**
- * Check if running in a WebView
- */
-export const isWebView = (): boolean => {
-    const userAgent = navigator.userAgent.toLowerCase();
-    return (/(webview|wv)/.test(userAgent) ||
-    /android.*(wv|.net)/.test(userAgent) || /iphone|ipod|ipad.*applewebkit(?!.*safari)/i.test(userAgent));
-};
-
-/**
- * Check if running on Android
- */
-export const isAndroid = (): boolean => {
-    return /android/i.test(navigator.userAgent.toLowerCase());
-};
-
-/**
- * Check if running on iOS
- */
-export const isIOS = (): boolean => {
-    return /iphone|ipad|ipod/i.test(navigator.userAgent.toLowerCase());
-};
-
-/**
- * Check if running on Windows
- */
-export const isWindows = (): boolean => {
-    try {
-        // Check Node.js process (for Electron)
-        const nodeProcess = (globalThis as any).process;
-        if (nodeProcess?.platform === 'win32') return true;
-
-        return navigator.userAgent.toLowerCase().includes('windows');
-    } catch (error) {
-        return false;
-    }
-};
-
-/**
- * Check if running on macOS
- */
-export const isMacOS = (): boolean => {
-    try {
-        // Check Node.js process (for Electron)
-        const nodeProcess = (globalThis as any).process;
-        if (nodeProcess?.platform === 'darwin') return true;
-
-        return /macintosh|mac os x/i.test(navigator.userAgent.toLowerCase());
-    } catch (error) {
-        return false;
-    }
-};
-
-/**
- * Check if running on Linux
- */
-export const isLinux = (): boolean => {
-    try {
-        // Check Node.js process (for Electron)
-        const nodeProcess = (globalThis as any).process;
-        if (nodeProcess?.platform === 'linux') return true;
-
-        return /linux/i.test(navigator.userAgent.toLowerCase());
-    } catch (error) {
-        return false;
-    }
-};
-
-/**
- * Hook for detecting mobile devices and platform information
- *
- * @param options - Configuration options
- * @returns Mobile detection state
- */
-export const useMobileDetection = (options: UseMobileDetectionOptions = {}) => {
-    const { mobileBreakpoint = 700, debug = false } = options;
-
-    const [state, setState] = useState<MobileDetectionState>(() => ({
-        isMobile: checkMobileDevice(mobileBreakpoint),
-        isAndroid: isAndroid(),
-        isIOS: isIOS(),
-        isWebView: isWebView(),
-        screenWidth: window.innerWidth,
-    }));
-
-    const log = useCallback((message: string, data?: any) => {
-        if (debug) {
-            console.log(`[useMobileDetection] ${message}`, data || '');
-        }
-    }, [debug]);
-
-    useEffect(() => {
-        const handleResize = () => {
-            const newState: MobileDetectionState = {
-                isMobile: checkMobileDevice(mobileBreakpoint),
-                isAndroid: isAndroid(),
-                isIOS: isIOS(),
-                isWebView: isWebView(),
-                screenWidth: window.innerWidth,
-            };
-
-            // Only update if something changed
-            if (newState.isMobile !== state.isMobile || newState.screenWidth !== state.screenWidth) {
-                log('Mobile detection state changed', newState);
-                setState(newState);
-            }
-        };
-
-        window.addEventListener('resize', handleResize);
-
-        // Also listen to orientation changes
-        window.addEventListener('orientationchange', handleResize);
-
-        return () => {
-            window.removeEventListener('resize', handleResize);
-            window.removeEventListener('orientationchange', handleResize);
-        };
-    }, [mobileBreakpoint, state.isMobile, state.screenWidth, log]);
-
-    // Initial detection logging
-    useEffect(() => {
-        log('Initial mobile detection', state);
-    }, []);
-
-    return state;
-};
-
-export default useMobileDetection;