Added DocWrapper and Link component to address link issues

components/Accordion.jsx

@@ -24,10 +24,10 @@ const Accordion = ({ children, title = "More" }) => {
       if (!detailsElement.open) {
         // 3. Then open it
         detailsElement.open = true;
-        // 4. and scroll into view and focus
-        targetElement.focus();
-        targetElement.scrollIntoView({ behavior: "smooth", block: "center" });
       }
+      // 4. and scroll into view and focus
+      targetElement.focus();
+      targetElement.scrollIntoView({ behavior: "smooth", block: "center" });
     }
   }
 

components/DocWrapper.jsx

@@ -0,0 +1,24 @@
+import React from "react"
+import { useEffect } from "react"
+
+const DocWrapper = ({children})=>{
+
+   useEffect(()=>{
+    let hash = location.hash.substring(1);
+    // Remove scroll restoration when there is a hash of length > 0.
+    if (hash.length!==0 && "scrollRestoration" in history) {
+      history.scrollRestoration = "manual"
+    }
+    // Check if the hash type is a Docusauraus link or a reference link within document.
+    let isDocusaurusLink = (hash.substring(0,4) !== "link")
+    let targetElement;
+    targetElement = document.getElementById(hash)
+    if(!targetElement)return
+    if(isDocusaurusLink)
+    targetElement.scrollIntoView(true)
+   },[])
+
+   return <>{children}</>
+}
+
+export default DocWrapper

components/Link.jsx

@@ -0,0 +1,14 @@
+import React from "react"
+
+const Link = ({hash,title}) =>{
+
+    const handleLink=(event)=>{
+        //manually change hash to trigger hashChange event.
+        window.location.hash  = "#";
+        window.location.hash = hash;
+      }
+      
+    return <a onClick={handleLink} className="navlink">{title}</a>
+}
+
+export default Link