@ceedcv-maya/shared-hooks-react 0.7.0 → 0.9.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ceedcv-maya/shared-hooks-react",
-  "version": "0.7.0",
+  "version": "0.9.0",
   "type": "module",
   "main": "src/index.ts",
   "types": "src/index.ts",

package/src/index.ts

@@ -1,2 +1,3 @@
 export { useAutoSave, type SaveStatus, type UseAutoSaveResult } from './useAutoSave';
+export { useFlushOnPageLeave } from './useFlushOnPageLeave';
 export { useFilterState, type FilterRecord, type UseFilterStateResult } from './useFilterState';

package/src/useAutoSave.ts

@@ -14,11 +14,12 @@ export interface UseAutoSaveResult {
  * Hook de autoguardado con debounce unificado.
  * Reutilizable en WizardStep2Blocks, TemplateEditor y DocumentWizard.
  *
- * @param saveFn  Función async que realiza el guardado.
+ * @param saveFn  Función async que realiza el guardado. Devuelve `false` si no hubo
+ *                persistencia real (sin cambios); cualquier otro valor marca éxito.
  * @param delay   Milisegundos de debounce (por defecto 1500ms).
  */
 export function useAutoSave(
-  saveFn: () => Promise<void>,
+  saveFn: () => Promise<boolean | void>,
   delay = 1500,
 ): UseAutoSaveResult {
   const [saveStatus, setSaveStatus] = useState<SaveStatus>('idle');
@@ -32,7 +33,11 @@ export function useAutoSave(
   const executeSave = useCallback(async () => {
     setSaveStatus('saving');
     try {
-      await saveFnRef.current();
+      const persisted = await saveFnRef.current();
+      if (persisted === false) {
+        setSaveStatus('idle');
+        return;
+      }
       setLastSaved(new Date());
       setSaveStatus('saved');
       if (savedClearRef.current) clearTimeout(savedClearRef.current);

package/src/useFlushOnPageLeave.ts

@@ -0,0 +1,35 @@
+import { useEffect, useRef } from 'react';
+
+/**
+ * Ejecuta `flush` cuando el usuario oculta la pestaña o navega fuera
+ * (cambio de app, cerrar pestaña, etc.). Complementa el debounce del autoguardado.
+ */
+export function useFlushOnPageLeave(
+  flush: () => void | Promise<void>,
+  enabled = true,
+): void {
+  const flushRef = useRef(flush);
+  flushRef.current = flush;
+
+  useEffect(() => {
+    if (!enabled) return;
+
+    const run = () => {
+      void flushRef.current();
+    };
+
+    const onVisibility = () => {
+      if (document.visibilityState === 'hidden') {
+        run();
+      }
+    };
+
+    document.addEventListener('visibilitychange', onVisibility);
+    window.addEventListener('pagehide', run);
+
+    return () => {
+      document.removeEventListener('visibilitychange', onVisibility);
+      window.removeEventListener('pagehide', run);
+    };
+  }, [enabled]);
+}