diff --git a/client/homebrew/brewRenderer/brewRenderer.jsx b/client/homebrew/brewRenderer/brewRenderer.jsx
index e9e3da8a6..3108176b4 100644
--- a/client/homebrew/brewRenderer/brewRenderer.jsx
+++ b/client/homebrew/brewRenderer/brewRenderer.jsx
@@ -128,23 +128,14 @@ const BrewRenderer = (props)=>{
 		rawPages = props.text.split(/^\\page$/gm);
 	}
 
-	// update centerPage (aka "current page") and pass it up to parent components
-	useEffect(()=>{
-		props.onPageChange(state.centerPage);
-	}, [state.centerPage]);
-
 	const handlePageVisibilityChange = useCallback((pageNum, isVisible)=>{
 		setState((prevState)=>{
 			const updatedVisiblePages = new Set(prevState.visiblePages);
-			if(isVisible){
-				updatedVisiblePages.add(pageNum);
-			} else {
-				updatedVisiblePages.delete(pageNum);
-			}
-			const pages = Array.from(updatedVisiblePages);
+			isVisible ? updatedVisiblePages.add(pageNum) : updatedVisiblePages.delete(pageNum);
 
-			return { ...prevState,
-				visiblePages : _.sortBy(pages)
+			return {
+				...prevState,
+				visiblePages : [...updatedVisiblePages].sort((a, b)=>a - b)
 			};
 		});
 	}, []);
@@ -154,7 +145,9 @@ const BrewRenderer = (props)=>{
 			...prevState,
 			centerPage : pageNum,
 		}));
-	}, []);
+
+		props.onPageChange(pageNum);
+	}, [props.onPageChange]);
 
 	const isInView = (index)=>{
 		if(!state.isMounted)
diff --git a/client/homebrew/brewRenderer/toolBar/toolBar.jsx b/client/homebrew/brewRenderer/toolBar/toolBar.jsx
index 89c341345..5fa9f0588 100644
--- a/client/homebrew/brewRenderer/toolBar/toolBar.jsx
+++ b/client/homebrew/brewRenderer/toolBar/toolBar.jsx
@@ -66,7 +66,7 @@ const ToolBar = ({ displayOptions, onDisplayOptionsChange, visiblePages, totalPa
 			} else {
 				minDimRatio = [...pages].reduce((minRatio, page)=>Math.min(minRatio, iframeWidth / page.offsetWidth, iframeHeight / page.offsetHeight), Infinity);
 			}
-			console.log(minDimRatio)
+			console.log(minDimRatio);
 
 			desiredZoom = minDimRatio * 100;
 		}
@@ -249,14 +249,14 @@ const ToolBar = ({ displayOptions, onDisplayOptionsChange, visiblePages, totalPa
 					title='Next Page(s)'
 					onClick={()=>{
 						// if there are multiple pages in a 'row' and they are in 'view',
-						// then the 'max'/last page in view will always be the same, and 
+						// then the 'max'/last page in view will always be the same, and
 						// the other pages will always be the same (since the viewport doesn't change).
-						// So this needs to scroll to the 'max', then see what is newly in view, 
+						// So this needs to scroll to the 'max', then see what is newly in view,
 						// and if the same pages are visible, do it again but +1.
-						const start = _.max(visiblePages); 
+						const start = _.max(visiblePages);
 						scrollToPage(start);
 						if(start === _.max(visiblePages)){
-							scrollToPage(start + 1)
+							scrollToPage(start + 1);
 						};
 					}}
 					disabled={pageNum >= totalPages}