Merge pull request #178 from life-itself/170-next-links
[site/components]: add support for next links in markdown
This commit is contained in:
commit
9411ba2270
|
|
@ -1,5 +1,6 @@
|
||||||
|
import { useEffect, useState } from "react"
|
||||||
|
import Link from 'next/link';
|
||||||
import { Tooltip } from './Tooltip';
|
import { Tooltip } from './Tooltip';
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Component for adding previews on hovering over anchor tags with relative paths
|
* Component for adding previews on hovering over anchor tags with relative paths
|
||||||
*/
|
*/
|
||||||
|
|
@ -8,17 +9,44 @@ export const Anchor = (props) => {
|
||||||
const pathIsRelative = (path) => {
|
const pathIsRelative = (path) => {
|
||||||
return path &&
|
return path &&
|
||||||
path.indexOf("http:") !== 0 &&
|
path.indexOf("http:") !== 0 &&
|
||||||
path.indexOf("https:") !== 0 &&
|
path.indexOf("https:") !== 0
|
||||||
path.indexOf("#") !== 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 (
|
return (
|
||||||
<Tooltip {...props} render={ tooltipTriggerProps => (
|
<Link href={href}>
|
||||||
<a {...tooltipTriggerProps} />
|
<a {...props} />
|
||||||
)}
|
</Link>
|
||||||
/>
|
|
||||||
)
|
)
|
||||||
}
|
}
|
||||||
return <a {...props} />;
|
return <a target="_blank" rel="noopener" {...props} />;
|
||||||
};
|
};
|
||||||
|
|
|
||||||
|
|
@ -117,7 +117,7 @@ export const Tooltip = ({ render, ...props }) => {
|
||||||
if (filePath.includes('notes')) {
|
if (filePath.includes('notes')) {
|
||||||
return
|
return
|
||||||
}
|
}
|
||||||
const page = allOtherPages.find(p => p._raw.sourceFilePath === filePath)
|
const page = allOtherPages.find(p => p._raw.flattenedPath === filePath)
|
||||||
content = documentExtract(page.body.raw);
|
content = documentExtract(page.body.raw);
|
||||||
} catch {
|
} catch {
|
||||||
return
|
return
|
||||||
|
|
|
||||||
Loading…
Reference in New Issue