mirror of
https://github.com/naturalcrit/homebrewery.git
synced 2026-09-20 14:32:57 +00:00
Merge pull request #5014 from naturalcrit/new/edit/Home-Move-unsavedChange-checker-to-common-hook
New/edit/home move unsaved change checker to common hook
This commit is contained in:
@@ -78,15 +78,6 @@ const EditPage = (props)=>{
|
||||
const lastSavedBrew = useRef(_.cloneDeep(props.brew));
|
||||
const saveTimeout = useRef(null);
|
||||
const warnUnsavedTimeout = useRef(null);
|
||||
const unsavedChangesRef = useRef(unsavedChanges); // Similarly, onBeforeUnload lives outside React and needs ref to unsavedChanges
|
||||
|
||||
useEffect(()=>{
|
||||
unsavedChangesRef.current = unsavedChanges;
|
||||
});
|
||||
|
||||
const handleSplitMove = ()=>{
|
||||
editorRef.current?.update();
|
||||
};
|
||||
|
||||
const updateBrew = (newData)=>setCurrentBrew((prevBrew)=>({
|
||||
...prevBrew,
|
||||
@@ -326,6 +317,7 @@ const EditPage = (props)=>{
|
||||
};
|
||||
|
||||
const {
|
||||
handleSplitMove,
|
||||
handleBrewChange
|
||||
} = useCommonEditPageFunctions({
|
||||
saveGoogle,
|
||||
@@ -344,11 +336,12 @@ const EditPage = (props)=>{
|
||||
autoSaveEnabled,
|
||||
setAutoSaveEnabled,
|
||||
setWarnUnsavedChanges,
|
||||
unsavedChangesRef,
|
||||
unsavedChanges,
|
||||
setUnsavedChanges,
|
||||
trySave,
|
||||
sandbox,
|
||||
lastSavedBrew
|
||||
lastSavedBrew,
|
||||
editorRef
|
||||
});
|
||||
|
||||
return (
|
||||
|
||||
@@ -65,11 +65,6 @@ const HomePage =(props)=>{
|
||||
const editorRef = useRef(null);
|
||||
const lastSavedBrew = useRef(_.cloneDeep(props.brew));
|
||||
const warnUnsavedTimeout = useRef(null);
|
||||
const unsavedChangesRef = useRef(unsavedChanges);
|
||||
|
||||
useEffect(()=>{
|
||||
unsavedChangesRef.current = unsavedChanges;
|
||||
}, [unsavedChanges]);
|
||||
|
||||
const save = ()=>{
|
||||
request.post('/api')
|
||||
@@ -84,10 +79,6 @@ const HomePage =(props)=>{
|
||||
});
|
||||
};
|
||||
|
||||
const handleSplitMove = ()=>{
|
||||
editorRef.current.update();
|
||||
};
|
||||
|
||||
const resetWarnUnsavedTimer = ()=>{
|
||||
setTimeout(()=>setWarnUnsavedChanges(false), UNSAVED_WARNING_POPUP_TIMEOUT); // Hide the warning after 4 seconds
|
||||
clearTimeout(warnUnsavedTimeout.current);
|
||||
@@ -151,6 +142,7 @@ const HomePage =(props)=>{
|
||||
};
|
||||
|
||||
const {
|
||||
handleSplitMove,
|
||||
handleBrewChange
|
||||
} = useCommonEditPageFunctions({
|
||||
setError,
|
||||
@@ -168,10 +160,11 @@ const HomePage =(props)=>{
|
||||
autoSaveEnabled,
|
||||
setAutoSaveEnabled,
|
||||
setWarnUnsavedChanges,
|
||||
unsavedChangesRef,
|
||||
unsavedChanges,
|
||||
setUnsavedChanges,
|
||||
sandbox,
|
||||
lastSavedBrew
|
||||
lastSavedBrew,
|
||||
editorRef
|
||||
});
|
||||
|
||||
return (
|
||||
|
||||
@@ -66,7 +66,6 @@ const NewPage = (props)=>{
|
||||
const lastSavedBrew = useRef(_.cloneDeep(props.brew));
|
||||
// const saveTimeout = useRef(null);
|
||||
const warnUnsavedTimeout = useRef(null);
|
||||
const unsavedChangesRef = useRef(unsavedChanges); // Similarly, onBeforeUnload lives outside React and needs ref to unsavedChanges
|
||||
|
||||
useEffect(()=>{
|
||||
loadBrew();
|
||||
@@ -101,14 +100,6 @@ const NewPage = (props)=>{
|
||||
window.history.replaceState({}, window.location.title, '/new/');
|
||||
};
|
||||
|
||||
useEffect(()=>{
|
||||
unsavedChangesRef.current = unsavedChanges;
|
||||
});
|
||||
|
||||
const handleSplitMove = ()=>{
|
||||
editorRef.current.update();
|
||||
};
|
||||
|
||||
const resetWarnUnsavedTimer = ()=>{
|
||||
setTimeout(()=>setWarnUnsavedChanges(false), UNSAVED_WARNING_POPUP_TIMEOUT); // Hide the warning after 4 seconds
|
||||
clearTimeout(warnUnsavedTimeout.current);
|
||||
@@ -205,6 +196,7 @@ const NewPage = (props)=>{
|
||||
);
|
||||
|
||||
const {
|
||||
handleSplitMove,
|
||||
handleBrewChange
|
||||
} = useCommonEditPageFunctions({
|
||||
setError,
|
||||
@@ -222,11 +214,12 @@ const NewPage = (props)=>{
|
||||
autoSaveEnabled,
|
||||
setAutoSaveEnabled,
|
||||
setWarnUnsavedChanges,
|
||||
unsavedChangesRef,
|
||||
unsavedChanges,
|
||||
setUnsavedChanges,
|
||||
trySave,
|
||||
sandbox,
|
||||
lastSavedBrew
|
||||
lastSavedBrew,
|
||||
editorRef
|
||||
});
|
||||
|
||||
return (
|
||||
|
||||
@@ -24,16 +24,18 @@ export default function useCommonEditPageFunctions(dependencies) {
|
||||
trySave = ()=>{},
|
||||
sandbox,
|
||||
saveGoogle = false,
|
||||
unsavedChangesRef,
|
||||
unsavedChanges,
|
||||
setUnsavedChanges,
|
||||
lastSavedBrew
|
||||
lastSavedBrew,
|
||||
editorRef
|
||||
} = dependencies;
|
||||
|
||||
const unsavedChangesRef = useRef(unsavedChanges); // onBeforeUnload lives outside React and needs ref to unsavedChanges
|
||||
|
||||
//==--------- Page setup ----------==//
|
||||
useEffect(()=>{
|
||||
const autoSavePref = !sandbox && JSON.parse(localStorage.getItem(AUTOSAVE_KEY) ?? true);
|
||||
setAutoSaveEnabled(autoSavePref);
|
||||
console.log(autoSavePref)
|
||||
setWarnUnsavedChanges(!autoSavePref);
|
||||
setHTMLErrors(hbfm.validate(currentBrew.text));
|
||||
fetchThemeBundle(setError, setThemeBundle, currentBrew.renderer, currentBrew.theme);
|
||||
@@ -63,10 +65,14 @@ export default function useCommonEditPageFunctions(dependencies) {
|
||||
useEffect(()=>{
|
||||
const hasChange = !_.isEqual(currentBrew, lastSavedBrew.current);
|
||||
setUnsavedChanges(hasChange);
|
||||
unsavedChangesRef.current = hasChange;
|
||||
|
||||
if(autoSaveEnabled) trySave(false, hasChange, saveGoogle);
|
||||
}, [currentBrew]);
|
||||
|
||||
const handleSplitMove = ()=>{
|
||||
editorRef.current.update();
|
||||
};
|
||||
|
||||
const handleBrewChange = (field)=>(value, subfield)=>{ //'text', 'style', 'snippets', 'metadata'
|
||||
if(subfield == 'renderer' || subfield == 'theme')
|
||||
@@ -92,6 +98,7 @@ export default function useCommonEditPageFunctions(dependencies) {
|
||||
};
|
||||
|
||||
return {
|
||||
handleSplitMove,
|
||||
handleBrewChange
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user