From 6456c22c61dbb93234987fc09e486637b57df512 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?V=C3=ADctor=20Losada=20Hern=C3=A1ndez?=
 <losada.hernandez.victor@gmail.com>
Date: Wed, 9 Oct 2024 21:33:26 +0200
Subject: [PATCH] testing mutation Observer, don't review this yet

---
 client/homebrew/brewRenderer/brewRenderer.jsx | 39 +++++++++++++++----
 1 file changed, 32 insertions(+), 7 deletions(-)

diff --git a/client/homebrew/brewRenderer/brewRenderer.jsx b/client/homebrew/brewRenderer/brewRenderer.jsx
index 7c5ac3a1b..8d63c1e0c 100644
--- a/client/homebrew/brewRenderer/brewRenderer.jsx
+++ b/client/homebrew/brewRenderer/brewRenderer.jsx
@@ -16,8 +16,8 @@ const Frame = require('react-frame-component').default;
 const dedent = require('dedent-tabs').default;
 const { printCurrentBrew } = require('../../../shared/helpers.js');
 
-const DOMPurify = require('dompurify');
-const purifyConfig = { FORCE_BODY: true, SANITIZE_DOM: false };
+//const DOMPurify = require('dompurify');
+//const purifyConfig = { FORCE_BODY: true, SANITIZE_DOM: false };
 
 const PAGE_HEIGHT = 1056;
 
@@ -77,17 +77,42 @@ const BrewRenderer = (props)=>{
 		rawPages = props.text.split(/^\\page$/gm);
 	}
 
-	useEffect(() => {
+	useEffect(()=>{
+		const iframeDoc = document.getElementById('brewRenderer');
+		const hash = window.location.hash;
+		console.log(hash);
+		if(hash && iframeDoc) {
+		  const anchor = iframeDoc.querySelector(hash);
+
+			if(anchor) {
+				anchor.scrollIntoView();
+			} else {
+				// Use MutationObserver to wait for the element if it's not immediately available
+				const observer = new MutationObserver((mutations, obs)=>{
+				const anchorElement = iframeDoc.querySelector(hash);
+				if(anchorElement) {
+					anchorElement.scrollIntoView();
+					obs.disconnect(); // Stop observing once the element is found
+				}
+				});
+
+				observer.observe(iframeDoc, {
+					childList : true,
+					subtree   : true,
+				});
+			}
+		}
+		/*
 		const elementId = window.location.hash.slice(1);
-		if (elementId && state.isMounted) {
+		if(elementId && state.isMounted) {
 			const element = document.getElementById(elementId);
 			element.scrollIntoView({ block: 'start' });
 		}
-		
-		return () => {
+		*/
+		return ()=>{
 			window.removeEventListener('resize', updateSize);
 		};
-	}, [state.isMounted]);
+	}, []);
 
 	const updateSize = ()=>{
 		setState((prevState)=>({