Move "unsaved changes" check to common hook

This commit is contained in:
Trevor Buckner
2026-09-11 23:21:21 -04:00
parent b116730925
commit b9ae2cd16c
4 changed files with 22 additions and 25 deletions
+3 -8
View File
@@ -84,6 +84,7 @@ const EditPage = (props)=>{
const { const {
handleBrewChange handleBrewChange
} = useCommonEditPageFunctions({ } = useCommonEditPageFunctions({
saveGoogle,
setError, setError,
setThemeBundle, setThemeBundle,
HTMLErrors, HTMLErrors,
@@ -101,8 +102,9 @@ const EditPage = (props)=>{
setWarnUnsavedChanges, setWarnUnsavedChanges,
trySaveRef, trySaveRef,
unsavedChangesRef, unsavedChangesRef,
setUnsavedChanges,
sandbox, sandbox,
saveGoogle lastSavedBrew
}); });
useEffect(()=>{ useEffect(()=>{
@@ -110,13 +112,6 @@ const EditPage = (props)=>{
unsavedChangesRef.current = unsavedChanges; unsavedChangesRef.current = unsavedChanges;
}); });
useEffect(()=>{
const hasChange = !_.isEqual(currentBrew, lastSavedBrew.current);
setUnsavedChanges(hasChange);
if(autoSaveEnabled) trySave(false, hasChange, saveGoogle);
}, [currentBrew]);
const handleSplitMove = ()=>{ const handleSplitMove = ()=>{
editorRef.current?.update(); editorRef.current?.update();
}; };
+3 -8
View File
@@ -88,7 +88,9 @@ const HomePage =(props)=>{
setWarnUnsavedChanges, setWarnUnsavedChanges,
trySaveRef, trySaveRef,
unsavedChangesRef, unsavedChangesRef,
sandbox setUnsavedChanges,
sandbox,
lastSavedBrew
}); });
useEffect(()=>{ useEffect(()=>{
@@ -108,13 +110,6 @@ const HomePage =(props)=>{
}); });
}; };
useEffect(()=>{
const hasChange = !_.isEqual(currentBrew, lastSavedBrew.current);
setUnsavedChanges(hasChange);
if(autoSaveEnabled) trySave(false, hasChange);
}, [currentBrew]);
const handleSplitMove = ()=>{ const handleSplitMove = ()=>{
editorRef.current.update(); editorRef.current.update();
}; };
+3 -8
View File
@@ -93,7 +93,9 @@ const NewPage = (props)=>{
setWarnUnsavedChanges, setWarnUnsavedChanges,
trySaveRef, trySaveRef,
unsavedChangesRef, unsavedChangesRef,
sandbox setUnsavedChanges,
sandbox,
lastSavedBrew
}); });
const loadBrew = ()=>{ const loadBrew = ()=>{
@@ -125,13 +127,6 @@ const NewPage = (props)=>{
window.history.replaceState({}, window.location.title, '/new/'); window.history.replaceState({}, window.location.title, '/new/');
}; };
useEffect(()=>{
const hasChange = !_.isEqual(currentBrew, lastSavedBrew.current);
setUnsavedChanges(hasChange);
if(autoSaveEnabled) trySave(false, hasChange);
}, [currentBrew]);
useEffect(()=>{ useEffect(()=>{
trySaveRef.current = trySave; trySaveRef.current = trySave;
unsavedChangesRef.current = unsavedChanges; unsavedChangesRef.current = unsavedChanges;
@@ -1,5 +1,6 @@
import React, { useState, useEffect, useRef } from 'react'; import React, { useState, useEffect, useRef } from 'react';
import { printCurrentBrew, fetchThemeBundle } from '@shared/helpers.js'; import { printCurrentBrew, fetchThemeBundle } from '@shared/helpers.js';
import _ from 'lodash';
const AUTOSAVE_KEY = 'HB_editor_autoSaveOn'; const AUTOSAVE_KEY = 'HB_editor_autoSaveOn';
@@ -23,7 +24,9 @@ export default function useCommonEditPageFunctions(dependencies) {
trySaveRef, trySaveRef,
sandbox, sandbox,
saveGoogle = false, saveGoogle = false,
unsavedChangesRef unsavedChangesRef,
setUnsavedChanges,
lastSavedBrew
} = dependencies; } = dependencies;
//==--------- Page setup ----------==// //==--------- Page setup ----------==//
@@ -56,6 +59,15 @@ export default function useCommonEditPageFunctions(dependencies) {
}; };
}, []); }, []);
//======----- Check for unsaved changes and autosave if enabled -----======
useEffect(()=>{
const hasChange = !_.isEqual(currentBrew, lastSavedBrew.current);
setUnsavedChanges(hasChange);
if(autoSaveEnabled) trySaveRef.current(false, hasChange, saveGoogle);
}, [currentBrew]);
const handleBrewChange = (field)=>(value, subfield)=>{ //'text', 'style', 'snippets', 'metadata' const handleBrewChange = (field)=>(value, subfield)=>{ //'text', 'style', 'snippets', 'metadata'
if(subfield == 'renderer' || subfield == 'theme') if(subfield == 'renderer' || subfield == 'theme')
fetchThemeBundle(setError, setThemeBundle, value.renderer, value.theme); fetchThemeBundle(setError, setThemeBundle, value.renderer, value.theme);