From 07dd5269921d61b95240604689eca279316b1b30 Mon Sep 17 00:00:00 2001
From: khalilcodes <khalilali.j@gmail.com>
Date: Mon, 13 Jun 2022 22:50:03 +0300
Subject: [PATCH] [site/links][m]: add logic for next links

---
 site/components/Anchor.js | 46 +++++++++++++++++++++++++++++++--------
 1 file changed, 37 insertions(+), 9 deletions(-)

diff --git a/site/components/Anchor.js b/site/components/Anchor.js
index f239f93..9ef5df3 100644
--- a/site/components/Anchor.js
+++ b/site/components/Anchor.js
@@ -1,5 +1,6 @@
+import { useEffect, useState } from "react"
+import Link from 'next/link';
 import { Tooltip } from './Tooltip';
-
 /**
  * Component for adding previews on hovering over anchor tags with relative paths
  */
@@ -8,17 +9,44 @@ export const Anchor = (props) => {
   const pathIsRelative = (path) => {
     return path &&
       path.indexOf("http:") !== 0 &&
-      path.indexOf("https:") !== 0 &&
-      path.indexOf("#") !== 0
+      path.indexOf("https:") !== 0
   }
 
-  if (pathIsRelative(props.href)) {
+  const href = props.href.endsWith(".md")
+    ? props.href.replace(".md", "")
+    : props.href;
+
+  const [ path, setPath ] = useState(href)
+
+  useEffect(() => {
+    let isMount = true
+    if (isMount) {
+      const link = document.createElement("a")
+      link.href = href
+      setPath(link.pathname)
+    }
+    return () => {
+      setPath(href)
+      isMount = false
+    }
+  },[])
+
+  if (pathIsRelative(href)) {
+    if (href.indexOf("#") !== 0) {
+      return (
+        <Tooltip {...props} href={href} render={ tooltipTriggerProps => (
+          <Link href={path}>
+            <a {...tooltipTriggerProps} href={path} />
+          </Link>
+        )}
+        />
+      )
+    }
     return (
-      <Tooltip {...props} render={ tooltipTriggerProps => (
-        <a {...tooltipTriggerProps} />
-      )}
-      />
+      <Link href={href}>
+        <a {...props} />
+      </Link>
     )
   }
-  return <a {...props} />;
+  return <a target="_blank" rel="noopener" {...props} />;
 };