Update nextjs (#550)

src/components/Heading.jsx

@@ -1,5 +1,6 @@
 import { useEffect, useRef } from 'react'
 import Link from 'next/link'
+import { useRouter } from 'next/router'
 import { useInView } from 'framer-motion'
 
 import { useSectionStore } from '@/components/SectionProvider'
@@ -39,9 +40,12 @@ function Eyebrow({ tag, label }) {
 }
 
 function Anchor({ id, inView, children }) {
+  const router = useRouter()
+  const pathname = router.pathname
+
   return (
     <Link
-      href={`#${id}`}
+      href={`${pathname}#${id}`}
       className="group text-inherit no-underline hover:text-inherit"
     >
       {inView && (

src/components/Layout.jsx

@@ -220,7 +220,7 @@ export function Layout({ children, title, tableOfContents }) {
                   className="dark:hover:text-slate-300 dark:text-slate-400 text-slate-500 hover:text-slate-700 font-normal'"
               >
                 <FontAwesomeIcon icon={faPaperclip} style={iconStyle} className="icon pr-1" />
-                <text>Copy link</text>
+                <span>Copy link</span>
               </button>
             </li>
             <li key="edit-on-github">
@@ -230,7 +230,7 @@ export function Layout({ children, title, tableOfContents }) {
                   style={{display: "flex", alignItems: 'center'}}
               >
                 <FontAwesomeIcon icon={faGithub} style={iconStyle} className="icon pr-1" />
-                <text>Edit on Github</text>
+                <span>Edit on Github</span>
               </Link>
             </li>
           </ol>