@jhits/plugin-blog 0.0.9 → 0.0.11

package/src/views/CanvasEditor/hooks/useKeyboardShortcuts.ts

@@ -1,142 +0,0 @@
-import { useEffect } from 'react';
-import type { Block } from '../../../types/block';
-import type { EditorState } from '../../../state/types';
-
-// Generate a unique block ID
-function generateBlockId(): string {
-    if (typeof crypto !== 'undefined' && crypto.randomUUID) {
-        return crypto.randomUUID();
-    }
-    return `block-${Date.now()}-${Math.random().toString(36).substr(2, 9)}`;
-}
-
-export function useKeyboardShortcuts(
-    state: EditorState,
-    dispatch: (action: any) => void,
-    canUndo: boolean,
-    canRedo: boolean,
-    undo: () => void,
-    redo: () => void
-) {
-    useEffect(() => {
-        const handleKeyDown = (e: KeyboardEvent) => {
-            // Don't handle shortcuts if user is typing in an input/textarea/contentEditable
-            const target = e.target as HTMLElement;
-            const isEditableElement = target.tagName === 'INPUT' ||
-                target.tagName === 'TEXTAREA' ||
-                target.isContentEditable ||
-                target.closest('input, textarea, [contenteditable="true"]');
-
-            // Check for Ctrl+Z / Cmd+Z (Undo)
-            if ((e.ctrlKey || e.metaKey) && e.key === 'z' && !e.shiftKey) {
-                if (!isEditableElement) {
-                    e.preventDefault();
-                    e.stopPropagation();
-                    if (canUndo) {
-                        undo();
-                    }
-                    return;
-                }
-            }
-
-            // Check for Ctrl+Shift+Z / Cmd+Shift+Z or Ctrl+Y / Cmd+Y (Redo)
-            if (((e.ctrlKey || e.metaKey) && e.shiftKey && e.key === 'z') || ((e.ctrlKey || e.metaKey) && e.key === 'y')) {
-                if (!isEditableElement) {
-                    e.preventDefault();
-                    e.stopPropagation();
-                    if (canRedo) {
-                        redo();
-                    }
-                    return;
-                }
-            }
-
-            // Check for Ctrl+V (Windows/Linux) or Cmd+V (Mac)
-            if ((e.ctrlKey || e.metaKey) && e.key === 'v') {
-                // Don't paste if user is typing in an input/textarea/contentEditable
-                const target = e.target as HTMLElement;
-                const isEditableElement = target.tagName === 'INPUT' ||
-                    target.tagName === 'TEXTAREA' ||
-                    target.isContentEditable ||
-                    target.closest('input, textarea, [contenteditable="true"]');
-
-                if (isEditableElement) {
-                    return; // Let the browser handle paste in editable elements
-                }
-
-                // Check if there's a copied block
-                if (typeof window !== 'undefined') {
-                    const copiedBlockJson = localStorage.getItem('__BLOG_EDITOR_COPIED_BLOCK__');
-                    if (copiedBlockJson) {
-                        try {
-                            e.preventDefault();
-                            e.stopPropagation();
-
-                            const copiedBlock = JSON.parse(copiedBlockJson) as Block;
-
-                            // Clone a block with new IDs (recursive for nested blocks)
-                            const cloneBlock = (blockToClone: Block): Block => {
-                                const cloned: Block = {
-                                    ...blockToClone,
-                                    id: generateBlockId(),
-                                    data: { ...blockToClone.data },
-                                    meta: blockToClone.meta ? { ...blockToClone.meta } : undefined,
-                                };
-
-                                // Handle children if they exist
-                                if (blockToClone.children) {
-                                    if (Array.isArray(blockToClone.children) && blockToClone.children.length > 0) {
-                                        if (typeof blockToClone.children[0] === 'object') {
-                                            cloned.children = (blockToClone.children as Block[]).map(cloneBlock);
-                                        } else {
-                                            // If children are IDs, find and clone the actual blocks
-                                            const allBlocks = state.blocks;
-                                            const childIds = blockToClone.children as string[];
-                                            const childBlocks = childIds
-                                                .map((childId: string) => allBlocks.find(b => b.id === childId))
-                                                .filter((b): b is Block => b !== undefined);
-                                            cloned.children = childBlocks.map(cloneBlock);
-                                        }
-                                    }
-                                }
-
-                                return cloned;
-                            };
-
-                            const pastedBlock = cloneBlock(copiedBlock);
-
-                            // Find where to paste - use hovered block or selected block, or paste at end
-                            const hoveredBlockId = (window as any).__BLOG_EDITOR_HOVERED_BLOCK_ID__;
-                            const targetBlockId = hoveredBlockId || state.selectedBlockId;
-
-                            let pasteIndex: number | undefined;
-                            if (targetBlockId) {
-                                const targetIndex = state.blocks.findIndex(b => b.id === targetBlockId);
-                                if (targetIndex !== -1) {
-                                    pasteIndex = targetIndex + 1;
-                                }
-                            }
-
-                            // Dispatch ADD_BLOCK with the full block structure
-                            dispatch({
-                                type: 'ADD_BLOCK',
-                                payload: {
-                                    block: pastedBlock,
-                                    index: pasteIndex,
-                                    containerId: undefined
-                                }
-                            });
-                        } catch (error) {
-                            console.error('Failed to paste block:', error);
-                        }
-                    }
-                }
-            }
-        };
-
-        window.addEventListener('keydown', handleKeyDown);
-        return () => {
-            window.removeEventListener('keydown', handleKeyDown);
-        };
-    }, [state.blocks, state.selectedBlockId, dispatch, canUndo, canRedo, undo, redo]);
-}

package/src/views/CanvasEditor/hooks/usePostLoader.d.ts

@@ -1,5 +0,0 @@
-import type { BlogPost } from '../../../types/post';
-export declare function usePostLoader(postId: string | undefined, currentPostId: string | null, loadPost: (post: BlogPost) => void, resetHeroBlock: () => void): {
-    isLoadingPost: boolean;
-};
-//# sourceMappingURL=usePostLoader.d.ts.map

package/src/views/CanvasEditor/hooks/usePostLoader.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"usePostLoader.d.ts","sourceRoot":"","sources":["usePostLoader.ts"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,qBAAqB,CAAC;AAEpD,wBAAgB,aAAa,CACzB,MAAM,EAAE,MAAM,GAAG,SAAS,EAC1B,aAAa,EAAE,MAAM,GAAG,IAAI,EAC5B,QAAQ,EAAE,CAAC,IAAI,EAAE,QAAQ,KAAK,IAAI,EAClC,cAAc,EAAE,MAAM,IAAI;;EA8B7B"}

package/src/views/CanvasEditor/hooks/usePostLoader.js

@@ -1,32 +0,0 @@
-import { useEffect, useState } from 'react';
-import { apiToBlogPost } from '../../../lib/mappers/apiMapper';
-export function usePostLoader(postId, currentPostId, loadPost, resetHeroBlock) {
-    const [isLoadingPost, setIsLoadingPost] = useState(false);
-    useEffect(() => {
-        if (postId && !currentPostId) {
-            const loadPostData = async () => {
-                try {
-                    setIsLoadingPost(true);
-                    // Reset hero block before loading new post so it gets re-initialized from the new post's blocks
-                    resetHeroBlock();
-                    const response = await fetch(`/api/plugin-blog/${postId}`);
-                    if (!response.ok) {
-                        throw new Error('Failed to load post');
-                    }
-                    const apiDoc = await response.json();
-                    const blogPost = apiToBlogPost(apiDoc);
-                    loadPost(blogPost);
-                }
-                catch (error) {
-                    console.error('Failed to load post:', error);
-                    alert('Failed to load post. Please try again.');
-                }
-                finally {
-                    setIsLoadingPost(false);
-                }
-            };
-            loadPostData();
-        }
-    }, [postId, currentPostId, loadPost, resetHeroBlock]);
-    return { isLoadingPost };
-}

package/src/views/CanvasEditor/hooks/usePostLoader.ts

@@ -1,39 +0,0 @@
-import { useEffect, useState } from 'react';
-import { apiToBlogPost, type APIBlogDocument } from '../../../lib/mappers/apiMapper';
-import type { BlogPost } from '../../../types/post';
-
-export function usePostLoader(
-    postId: string | undefined,
-    currentPostId: string | null,
-    loadPost: (post: BlogPost) => void,
-    resetHeroBlock: () => void
-) {
-    const [isLoadingPost, setIsLoadingPost] = useState(false);
-
-    useEffect(() => {
-        if (postId && !currentPostId) {
-            const loadPostData = async () => {
-                try {
-                    setIsLoadingPost(true);
-                    // Reset hero block before loading new post so it gets re-initialized from the new post's blocks
-                    resetHeroBlock();
-                    const response = await fetch(`/api/plugin-blog/${postId}`);
-                    if (!response.ok) {
-                        throw new Error('Failed to load post');
-                    }
-                    const apiDoc: APIBlogDocument = await response.json();
-                    const blogPost = apiToBlogPost(apiDoc);
-                    loadPost(blogPost);
-                } catch (error) {
-                    console.error('Failed to load post:', error);
-                    alert('Failed to load post. Please try again.');
-                } finally {
-                    setIsLoadingPost(false);
-                }
-            };
-            loadPostData();
-        }
-    }, [postId, currentPostId, loadPost, resetHeroBlock]);
-
-    return { isLoadingPost };
-}

package/src/views/CanvasEditor/hooks/useRegisteredBlocks.d.ts

@@ -1,2 +0,0 @@
-export declare function useRegisteredBlocks(): import("../../..").BlockTypeDefinition[];
-//# sourceMappingURL=useRegisteredBlocks.d.ts.map

package/src/views/CanvasEditor/hooks/useRegisteredBlocks.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useRegisteredBlocks.d.ts","sourceRoot":"","sources":["useRegisteredBlocks.ts"],"names":[],"mappings":"AAGA,wBAAgB,mBAAmB,6CAmDlC"}

package/src/views/CanvasEditor/hooks/useRegisteredBlocks.js

@@ -1,47 +0,0 @@
-import { useState, useEffect } from 'react';
-import { blockRegistry } from '../../../registry/BlockRegistry';
-export function useRegisteredBlocks() {
-    const [registeredBlocks, setRegisteredBlocks] = useState(() => {
-        const initial = blockRegistry.getAll();
-        return initial;
-    });
-    // Watch for registry changes and update state
-    useEffect(() => {
-        // Check immediately
-        const checkBlocks = () => {
-            const currentBlocks = blockRegistry.getAll();
-            const hasChanged = currentBlocks.length !== registeredBlocks.length ||
-                currentBlocks.some((b, i) => { var _a; return b.type !== ((_a = registeredBlocks[i]) === null || _a === void 0 ? void 0 : _a.type); }) ||
-                registeredBlocks.some((b, i) => { var _a; return b.type !== ((_a = currentBlocks[i]) === null || _a === void 0 ? void 0 : _a.type); });
-            if (hasChanged) {
-                setRegisteredBlocks([...currentBlocks]);
-            }
-        };
-        // Initial check
-        checkBlocks();
-        // Poll for registry changes (blocks are registered asynchronously in useEffect)
-        // Use a shorter interval initially, then longer
-        let pollCount = 0;
-        const interval = setInterval(() => {
-            pollCount++;
-            checkBlocks();
-            // Stop polling after 5 seconds (25 checks at 200ms)
-            if (pollCount > 25) {
-                clearInterval(interval);
-            }
-        }, 200);
-        // Also check after delays to catch initial registrations
-        const timeouts = [
-            setTimeout(checkBlocks, 50),
-            setTimeout(checkBlocks, 100),
-            setTimeout(checkBlocks, 300),
-            setTimeout(checkBlocks, 500),
-            setTimeout(checkBlocks, 1000),
-        ];
-        return () => {
-            clearInterval(interval);
-            timeouts.forEach(clearTimeout);
-        };
-    }, [registeredBlocks.length]);
-    return registeredBlocks;
-}

package/src/views/CanvasEditor/hooks/useRegisteredBlocks.ts

@@ -1,55 +0,0 @@
-import { useState, useEffect } from 'react';
-import { blockRegistry } from '../../../registry/BlockRegistry';
-
-export function useRegisteredBlocks() {
-    const [registeredBlocks, setRegisteredBlocks] = useState(() => {
-        const initial = blockRegistry.getAll();
-        return initial;
-    });
-
-    // Watch for registry changes and update state
-    useEffect(() => {
-        // Check immediately
-        const checkBlocks = () => {
-            const currentBlocks = blockRegistry.getAll();
-            const hasChanged = currentBlocks.length !== registeredBlocks.length ||
-                currentBlocks.some((b, i) => b.type !== registeredBlocks[i]?.type) ||
-                registeredBlocks.some((b, i) => b.type !== currentBlocks[i]?.type);
-
-            if (hasChanged) {
-                setRegisteredBlocks([...currentBlocks]);
-            }
-        };
-
-        // Initial check
-        checkBlocks();
-
-        // Poll for registry changes (blocks are registered asynchronously in useEffect)
-        // Use a shorter interval initially, then longer
-        let pollCount = 0;
-        const interval = setInterval(() => {
-            pollCount++;
-            checkBlocks();
-            // Stop polling after 5 seconds (25 checks at 200ms)
-            if (pollCount > 25) {
-                clearInterval(interval);
-            }
-        }, 200);
-
-        // Also check after delays to catch initial registrations
-        const timeouts = [
-            setTimeout(checkBlocks, 50),
-            setTimeout(checkBlocks, 100),
-            setTimeout(checkBlocks, 300),
-            setTimeout(checkBlocks, 500),
-            setTimeout(checkBlocks, 1000),
-        ];
-
-        return () => {
-            clearInterval(interval);
-            timeouts.forEach(clearTimeout);
-        };
-    }, [registeredBlocks.length]);
-
-    return registeredBlocks;
-}

package/src/views/CanvasEditor/hooks/useUnsavedChanges.d.ts

@@ -1,25 +0,0 @@
-/**
- * Hook for managing unsaved changes warnings and auto-save
- */
-import type { EditorState } from '../../../state/types';
-import type { Block } from '../../../types/block';
-interface UseUnsavedChangesOptions {
-    state: EditorState;
-    isDirty: boolean;
-    onSave: (heroBlock?: Block | null) => Promise<void>;
-    heroBlock?: Block | null;
-    autoSaveEnabled?: boolean;
-    autoSaveDelay?: number;
-    postId?: string | null;
-}
-/**
- * Hook to manage unsaved changes warnings and auto-save
- */
-export declare function useUnsavedChanges({ state, isDirty, onSave, heroBlock, autoSaveEnabled: propAutoSaveEnabled, autoSaveDelay, postId, }: UseUnsavedChangesOptions): {
-    autoSaveEnabled: boolean;
-    setAutoSaveEnabled: (enabled: boolean) => void;
-    countdown: number | null;
-    saveStatus: "error" | "idle" | "saving" | "saved";
-};
-export {};
-//# sourceMappingURL=useUnsavedChanges.d.ts.map

package/src/views/CanvasEditor/hooks/useUnsavedChanges.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"useUnsavedChanges.d.ts","sourceRoot":"","sources":["useUnsavedChanges.ts"],"names":[],"mappings":"AAAA;;GAEG;AAKH,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,sBAAsB,CAAC;AAElD,UAAU,wBAAwB;IAC9B,KAAK,EAAE,WAAW,CAAC;IACnB,OAAO,EAAE,OAAO,CAAC;IACjB,MAAM,EAAE,CAAC,SAAS,CAAC,EAAE,KAAK,GAAG,IAAI,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;IACpD,SAAS,CAAC,EAAE,KAAK,GAAG,IAAI,CAAC;IACzB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,MAAM,CAAC,EAAE,MAAM,GAAG,IAAI,CAAC;CAC1B;AAKD;;GAEG;AACH,wBAAgB,iBAAiB,CAAC,EAC9B,KAAK,EACL,OAAO,EACP,MAAM,EACN,SAAS,EACT,eAAe,EAAE,mBAAmB,EACpC,aAAuC,EACvC,MAAM,GACT,EAAE,wBAAwB;;kCAoD6B,OAAO;;;EA4P9D"}

package/src/views/CanvasEditor/hooks/useUnsavedChanges.js

@@ -1,285 +0,0 @@
-/**
- * Hook for managing unsaved changes warnings and auto-save
- */
-'use client';
-import { useEffect, useRef, useCallback, useState } from 'react';
-const AUTO_SAVE_STORAGE_KEY = 'blog-editor-autosave-enabled';
-const DEFAULT_AUTO_SAVE_DELAY = 10000; // 10 seconds
-/**
- * Hook to manage unsaved changes warnings and auto-save
- */
-export function useUnsavedChanges({ state, isDirty, onSave, heroBlock, autoSaveEnabled: propAutoSaveEnabled, autoSaveDelay = DEFAULT_AUTO_SAVE_DELAY, postId, }) {
-    const autoSaveTimeoutRef = useRef(null);
-    const isSavingRef = useRef(false);
-    const lastSavedStateRef = useRef('');
-    const countdownIntervalRef = useRef(null);
-    const [countdown, setCountdown] = useState(null);
-    const [saveStatus, setSaveStatus] = useState('idle');
-    const saveStatusTimeoutRef = useRef(null);
-    const previousIsDirtyRef = useRef(false);
-    const countdownStartTimeRef = useRef(null);
-    const performAutoSaveRef = useRef(null);
-    // Get auto-save preference from localStorage
-    const getAutoSavePreference = useCallback(() => {
-        if (typeof window === 'undefined')
-            return false;
-        try {
-            const stored = localStorage.getItem(AUTO_SAVE_STORAGE_KEY);
-            if (stored !== null) {
-                return stored === 'true';
-            }
-        }
-        catch (error) {
-            console.error('[useUnsavedChanges] Failed to read auto-save preference:', error);
-        }
-        // Default to false if not set
-        return false;
-    }, []);
-    // State to track auto-save enabled status (reactive)
-    const [autoSaveEnabledState, setAutoSaveEnabledState] = useState(() => {
-        // Initialize from prop or localStorage
-        if (propAutoSaveEnabled !== undefined) {
-            return propAutoSaveEnabled;
-        }
-        return getAutoSavePreference();
-    });
-    // Sync with prop changes
-    useEffect(() => {
-        if (propAutoSaveEnabled !== undefined) {
-            setAutoSaveEnabledState(propAutoSaveEnabled);
-        }
-    }, [propAutoSaveEnabled]);
-    // Initialize from localStorage on mount (if no prop provided)
-    useEffect(() => {
-        if (propAutoSaveEnabled === undefined && typeof window !== 'undefined') {
-            const stored = getAutoSavePreference();
-            setAutoSaveEnabledState(stored);
-        }
-    }, []); // Only run on mount
-    // Set auto-save preference in localStorage and state
-    const setAutoSavePreference = useCallback((enabled) => {
-        if (typeof window === 'undefined')
-            return;
-        try {
-            localStorage.setItem(AUTO_SAVE_STORAGE_KEY, enabled.toString());
-            setAutoSaveEnabledState(enabled);
-            console.log('[useUnsavedChanges] Auto-save preference updated:', enabled);
-        }
-        catch (error) {
-            console.error('[useUnsavedChanges] Failed to save auto-save preference:', error);
-        }
-    }, []);
-    // Determine if auto-save is enabled (prop takes precedence over state)
-    const autoSaveEnabled = propAutoSaveEnabled !== undefined
-        ? propAutoSaveEnabled
-        : autoSaveEnabledState;
-    // Create a stable reference of the current state for comparison
-    const getStateSnapshot = useCallback(() => {
-        return JSON.stringify({
-            title: state.title,
-            slug: state.slug,
-            blocks: state.blocks,
-            seo: state.seo,
-            metadata: state.metadata,
-            status: state.status,
-        });
-    }, [state]);
-    // Initialize lastSavedStateRef when a post is loaded and marked as clean
-    useEffect(() => {
-        // When a post is loaded (postId exists) and isDirty is false, update the saved state reference
-        if (postId && !isDirty && lastSavedStateRef.current === '') {
-            lastSavedStateRef.current = getStateSnapshot();
-            console.log('[useUnsavedChanges] Initialized saved state reference after post load');
-        }
-        // Also update if isDirty becomes false after being true (e.g., after save or MARK_CLEAN)
-        if (!isDirty && lastSavedStateRef.current !== getStateSnapshot()) {
-            lastSavedStateRef.current = getStateSnapshot();
-        }
-    }, [postId, isDirty, getStateSnapshot]);
-    // Auto-save function
-    const performAutoSave = useCallback(async () => {
-        if (isSavingRef.current || !isDirty) {
-            return;
-        }
-        try {
-            isSavingRef.current = true;
-            setSaveStatus('saving');
-            setCountdown(null);
-            countdownStartTimeRef.current = null;
-            console.log('[useUnsavedChanges] Auto-saving...');
-            await onSave(heroBlock);
-            lastSavedStateRef.current = getStateSnapshot();
-            setSaveStatus('saved');
-            console.log('[useUnsavedChanges] Auto-save completed');
-            // Clear save status after 2 seconds
-            if (saveStatusTimeoutRef.current) {
-                clearTimeout(saveStatusTimeoutRef.current);
-            }
-            saveStatusTimeoutRef.current = setTimeout(() => {
-                setSaveStatus('idle');
-            }, 2000);
-        }
-        catch (error) {
-            console.error('[useUnsavedChanges] Auto-save failed:', error);
-            setSaveStatus('error');
-            // Clear error status after 3 seconds
-            if (saveStatusTimeoutRef.current) {
-                clearTimeout(saveStatusTimeoutRef.current);
-            }
-            saveStatusTimeoutRef.current = setTimeout(() => {
-                setSaveStatus('idle');
-            }, 3000);
-        }
-        finally {
-            isSavingRef.current = false;
-        }
-    }, [isDirty, onSave, heroBlock, getStateSnapshot]);
-    // Keep ref updated with latest function
-    useEffect(() => {
-        performAutoSaveRef.current = performAutoSave;
-    }, [performAutoSave]);
-    // Set up auto-save timer and countdown when state changes
-    useEffect(() => {
-        // Only reset countdown if isDirty changed from false to true, or if auto-save was just disabled
-        const isDirtyChanged = previousIsDirtyRef.current !== isDirty;
-        const becameDirty = !previousIsDirtyRef.current && isDirty;
-        // Update previous isDirty ref
-        previousIsDirtyRef.current = isDirty;
-        // Clear existing countdown interval
-        if (countdownIntervalRef.current) {
-            clearInterval(countdownIntervalRef.current);
-            countdownIntervalRef.current = null;
-        }
-        if (!autoSaveEnabled || !isDirty || isSavingRef.current) {
-            setCountdown(null);
-            countdownStartTimeRef.current = null;
-            // Clear timeout if auto-save is disabled or not dirty
-            if (autoSaveTimeoutRef.current) {
-                clearTimeout(autoSaveTimeoutRef.current);
-                autoSaveTimeoutRef.current = null;
-            }
-            return;
-        }
-        // Only reset countdown if:
-        // 1. isDirty just became true (new changes)
-        // 2. Or if there's no active countdown
-        const shouldResetCountdown = becameDirty || countdownStartTimeRef.current === null;
-        if (shouldResetCountdown) {
-            // Clear existing timeout
-            if (autoSaveTimeoutRef.current) {
-                clearTimeout(autoSaveTimeoutRef.current);
-            }
-            // Initialize countdown
-            const secondsRemaining = Math.ceil(autoSaveDelay / 1000);
-            setCountdown(secondsRemaining);
-            countdownStartTimeRef.current = Date.now();
-            // Set new timeout for auto-save
-            autoSaveTimeoutRef.current = setTimeout(() => {
-                if (performAutoSaveRef.current) {
-                    performAutoSaveRef.current();
-                }
-            }, autoSaveDelay);
-        }
-        else {
-            // Countdown is already running, just update it based on elapsed time
-            if (countdownStartTimeRef.current && autoSaveTimeoutRef.current) {
-                const elapsed = Date.now() - countdownStartTimeRef.current;
-                const remaining = Math.max(0, autoSaveDelay - elapsed);
-                const secondsRemaining = Math.ceil(remaining / 1000);
-                setCountdown(secondsRemaining);
-            }
-        }
-        // Update countdown every second (only if we have an active countdown)
-        if (shouldResetCountdown || countdownIntervalRef.current === null) {
-            countdownIntervalRef.current = setInterval(() => {
-                if (countdownStartTimeRef.current && autoSaveTimeoutRef.current) {
-                    const elapsed = Date.now() - countdownStartTimeRef.current;
-                    const remaining = Math.max(0, autoSaveDelay - elapsed);
-                    const secondsRemaining = Math.ceil(remaining / 1000);
-                    if (secondsRemaining <= 0) {
-                        setCountdown(null);
-                        if (countdownIntervalRef.current) {
-                            clearInterval(countdownIntervalRef.current);
-                            countdownIntervalRef.current = null;
-                        }
-                    }
-                    else {
-                        setCountdown(secondsRemaining);
-                    }
-                }
-            }, 1000);
-        }
-        return () => {
-            if (autoSaveTimeoutRef.current) {
-                clearTimeout(autoSaveTimeoutRef.current);
-            }
-            if (countdownIntervalRef.current) {
-                clearInterval(countdownIntervalRef.current);
-            }
-        };
-    }, [autoSaveEnabled, isDirty, autoSaveDelay]);
-    // Handle browser beforeunload event (page refresh/close)
-    useEffect(() => {
-        if (!isDirty) {
-            return;
-        }
-        const handleBeforeUnload = (e) => {
-            e.preventDefault();
-            // Modern browsers ignore custom messages, but we still need to set returnValue
-            e.returnValue = '';
-            return '';
-        };
-        window.addEventListener('beforeunload', handleBeforeUnload);
-        return () => {
-            window.removeEventListener('beforeunload', handleBeforeUnload);
-        };
-    }, [isDirty]);
-    // Handle link clicks (for Next.js App Router)
-    useEffect(() => {
-        if (!isDirty) {
-            return;
-        }
-        const handleLinkClick = (e) => {
-            const target = e.target;
-            const link = target.closest('a');
-            if (link && link.href) {
-                const url = new URL(link.href);
-                const currentPath = window.location.pathname;
-                // Check if navigating away from editor
-                if (!url.pathname.includes('/blog/editor') && !url.pathname.includes('/blog/new')) {
-                    const confirmed = window.confirm('You have unsaved changes. Are you sure you want to leave? Your changes will be lost.');
-                    if (!confirmed) {
-                        e.preventDefault();
-                        e.stopPropagation();
-                        return false;
-                    }
-                }
-            }
-        };
-        // Listen for clicks on links
-        document.addEventListener('click', handleLinkClick, true);
-        return () => {
-            document.removeEventListener('click', handleLinkClick, true);
-        };
-    }, [isDirty]);
-    // Cleanup on unmount
-    useEffect(() => {
-        return () => {
-            if (autoSaveTimeoutRef.current) {
-                clearTimeout(autoSaveTimeoutRef.current);
-            }
-            if (countdownIntervalRef.current) {
-                clearInterval(countdownIntervalRef.current);
-            }
-            if (saveStatusTimeoutRef.current) {
-                clearTimeout(saveStatusTimeoutRef.current);
-            }
-        };
-    }, []);
-    return {
-        autoSaveEnabled,
-        setAutoSaveEnabled: setAutoSavePreference,
-        countdown,
-        saveStatus,
-    };
-}