From e355621bbf6110056b4ead37503f5a59c621c90e Mon Sep 17 00:00:00 2001
From: "G.Ambatte" <sean@robertson-family.nz>
Date: Mon, 29 Aug 2022 20:39:16 +1200
Subject: [PATCH] Load from local storage working without errors

---
 .../pages/basePages/listPage/listPage.jsx     | 29 ++++++++++++-------
 1 file changed, 18 insertions(+), 11 deletions(-)

diff --git a/client/homebrew/pages/basePages/listPage/listPage.jsx b/client/homebrew/pages/basePages/listPage/listPage.jsx
index 25603255c..776d16ec7 100644
--- a/client/homebrew/pages/basePages/listPage/listPage.jsx
+++ b/client/homebrew/pages/basePages/listPage/listPage.jsx
@@ -24,17 +24,11 @@ const ListPage = createClass({
 		};
 	},
 	getInitialState : function() {
-		let brewCollection = [];
-
-		if(typeof window !== 'undefined') {
-			brewCollection = this.props.brewCollection.map((brewGroup)=>{
-				const localVisibility = localStorage.getItem(`${USERPAGE_KEY_PREFIX}-${brewGroup.class}`) ?? 'true';
-				if(brewGroup.visible != (localVisibility=='true')) {
-					brewGroup.visible = (localVisibility=='true');
-				};
-				return brewGroup;
-			});
-		}
+		// HIDE ALL GROUPS UNTIL LOADED
+		const brewCollection = this.props.brewCollection.map((brewGroup)=>{
+			brewGroup.visible = false;
+			return brewGroup;
+		});
 
 		return {
 			sortType       : 'alpha',
@@ -44,9 +38,22 @@ const ListPage = createClass({
 			brewCollection : brewCollection
 		};
 	},
+
 	componentDidMount : function() {
 		// SAVE TO LOCAL STORAGE WHEN LEAVING PAGE
 		window.onbeforeunload = this.saveToLocalStorage;
+
+		// LOAD FROM LOCAL STORAGE
+		if(typeof window !== 'undefined') {
+			const brewCollection = this.props.brewCollection.map((brewGroup)=>{
+				const localVisibility = (localStorage.getItem(`${USERPAGE_KEY_PREFIX}-${brewGroup.class}`) ?? 'true')=='true';
+				brewGroup.visible = (brewGroup.visible != localVisibility ? localVisibility : brewGroup.visible);
+				return brewGroup;
+			});
+			this.setState({
+				brewCollection : brewCollection
+			});
+		};
 	},
 
 	componentWillUnmount : function() {