Move "unsaved changes" check to common hook

client/homebrew/utils/commonEditPageFunctions.js

@@ -1,5 +1,6 @@
 import React, { useState, useEffect, useRef } from 'react';
 import { printCurrentBrew, fetchThemeBundle } from '@shared/helpers.js';
+import _                                      from 'lodash';
 
 const AUTOSAVE_KEY = 'HB_editor_autoSaveOn';
 
@@ -23,7 +24,9 @@ export default function useCommonEditPageFunctions(dependencies) {
 		trySaveRef,
 		sandbox,
 		saveGoogle = false,
-		unsavedChangesRef
+		unsavedChangesRef,
+		setUnsavedChanges,
+		lastSavedBrew
 	} = dependencies;
 
 	//==--------- 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'
 		if(subfield == 'renderer' || subfield == 'theme')
 			fetchThemeBundle(setError, setThemeBundle, value.renderer, value.theme);