diff --git a/site/components/Content.js b/site/components/Content.js index 19e783a..d809bdf 100644 --- a/site/components/Content.js +++ b/site/components/Content.js @@ -1,4 +1,5 @@ import { useState, useEffect } from 'react' +import { useRouter } from 'next/router' import {unified} from 'unified' import rehypeParse from 'rehype-parse' import find from 'unist-util-find' @@ -10,6 +11,7 @@ const textStyles = (theme) => ({ background: theme === 'light' ? '#fff' : '#000', }) + const display = (data, theme) => { return (
{ ) } +const getAbsolutePath = ({ currentPath, basePath, relativePath }) => { + console.log({ currentPath, basePath, relativePath }); + const absolutePath = currentPath.slice(1).split("/") + absolutePath.pop(); // remove current page name + absolutePath.unshift(basePath); + absolutePath.push(relativePath); + console.log(absolutePath); + return absolutePath.join("/"); +} + export const Content = (props) => { const [state, setState] = useState({ data: "", isLoaded: false, }) + const router = useRouter(); + useEffect(async () => { - // const path = `/concepts/${props.value}`; - // console.log(path) - const path = "http://localhost:3000/concepts/bitcoin"; - fetch(path).then((response) => { + const basePath = "http://localhost:3000"; + const currentPath = router.asPath; + const relativePath = props.value.split(".")[0]; // temp remove .md + const absolutePath = getAbsolutePath({ currentPath, basePath, relativePath }); + console.log(absolutePath); + fetch(absolutePath).then((response) => { if (response.status !== 200) { console.log(`Looks like there was a problem. Status Code: ${response.status}`) return @@ -51,7 +67,6 @@ export const Content = (props) => { const p = find(main, (node) => { return node.tagName === "p" }) - // console.log(toString(p)) setState({ data: toString(p), isLoaded: true,