From 372f16b010168558e381d8f7190aae436d76bb0b Mon Sep 17 00:00:00 2001
From: Saahil <neon@saahild.com>
Date: Fri, 26 Jul 2024 14:45:33 -0400
Subject: [PATCH] Make Hashrouter auto switch inline

---
 src/components/HashRouter/index.tsx | 16 +++++++++++++---
 src/index.tsx                       |  2 --
 src/scripts/hashevent.ts            | 25 -------------------------
 3 files changed, 13 insertions(+), 30 deletions(-)
 delete mode 100644 src/scripts/hashevent.ts

diff --git a/src/components/HashRouter/index.tsx b/src/components/HashRouter/index.tsx
index 467ce9e8..25122dd6 100644
--- a/src/components/HashRouter/index.tsx
+++ b/src/components/HashRouter/index.tsx
@@ -1,12 +1,22 @@
 // writing my own hashRouter 
 
+import { useEffect, useState } from "react"
+
 export function HashRouter({ children }: any) {
+  const [hash, setHash] = useState(window.location.hash)
   if(process.env.NODE_ENV !== "production")  console.log(children)
     if(!Array.isArray(children)) children = [children]
-    debugger;
+  useEffect(() => {
+    const ev = () => {
+      setHash(window.location.hash)
+    }
+    window.addEventListener('hashchange', ev)
+    return () => window.removeEventListener('hashchange', ev)
+  })
+    // debugger;
   const child = children.find((child:any) => {
-if(process.env.NODE_ENV !== "production") console.log('script', child.props, window.location.hash, child.props.route == window.location.hash, (window.location.hash.length < 2 && child.props.index))    
-  return  child.props.path == window.location.hash || (window.location.hash.length < 2 && child.props.index) || child.props.path == "*"
+if(process.env.NODE_ENV !== "production") console.log('script', child.props, window.location.hash, child.props.route == hash, (hash.length < 2 && child.props.index))    
+  return  child.props.path == hash || (hash.length < 2 && child.props.index) || child.props.path == "*"
 })
  // console.log('child', child)
     if(child) return child.props.component;
diff --git a/src/index.tsx b/src/index.tsx
index a90db5d4..8a93a3f4 100644
--- a/src/index.tsx
+++ b/src/index.tsx
@@ -8,7 +8,6 @@ import Background from './bg/main';
 import { injectOneko } from './scripts/oneko';
 import Navbar from './components/navbar';
 import { runTitle } from './scripts/title';
-import { startEvent } from './scripts/hashevent';
 import { listenForEasterEgg } from './scripts/oneko_easteregg';
 import Footer from './components/footer';
 import Ackee from './Ackee';
@@ -22,7 +21,6 @@ const root = ReactDOM.createRoot(
 document.title = "Saahild.com"
 injectOneko();
 runTitle()
-startEvent()
 listenForEasterEgg()
 document.title = 'React App';
 root.render(
diff --git a/src/scripts/hashevent.ts b/src/scripts/hashevent.ts
deleted file mode 100644
index 5deaf10e..00000000
--- a/src/scripts/hashevent.ts
+++ /dev/null
@@ -1,25 +0,0 @@
-let interId:any = null
-function hashEvent() {
-window.location.reload() // ;-;
-}
-export function startEvent() {
-    if ("onhashchange" in window) {
-        window.addEventListener('hashchange', hashEvent)
-   }
-   else {
-    //@ts-ignore
-       var prevHash = window.location.hash;
-       //@ts-ignore
-    interId = window.setInterval(function () {
-          if (window.location.hash != prevHash) {
-         hashEvent()
-          }
-       }, 100);
-   }
-
-}
-
-export function stopEvent() {
-    if(interId) clearInterval(interId)
-        window.removeEventListener('hashchange', hashEvent)
-}