website/src/components/drawer.jsx

59 lines
1.8 KiB
JavaScript

import { graphql, StaticQuery } from "gatsby"
import React from "react"
import { Link } from "gatsby"
import { node2slug } from "../utils"
function ChildrenNodes({nodes, parent}) {
const filtered = nodes.filter(it => {
return it.frontmatter.parent === parent
})
if (filtered.length < 1) return <></>
if (parent === null) {
return <>{filtered.map(it => {
return <li>
<Link to={node2slug(it)}>{it.frontmatter.title}</Link>
<ChildrenNodes nodes={nodes} parent={it.frontmatter.title} />
</li>
})}</>
}
return <a><details>{filtered.map(it => {
return <li>
<Link to={node2slug(it)}>{it.frontmatter.title}</Link>
<ChildrenNodes nodes={nodes} parent={it.frontmatter.title} />
</li>
})}</details></a>
}
const Drawer = () => (
<ul className="menu p-4 overflow-y-auto w-80 bg-base-100 text-base-content">
<li><Link to="/">Home</Link></li>
<li><Link to="/repos">Repositories</Link></li>
<div className="divider">Docs</div>
<li><a href="https://recloudstream.github.io/dokka/">Dokka</a></li>
<li><Link to="/docs">Documentation</Link></li>
<StaticQuery
query={graphql`
query {
allMarkdownRemark(sort: {fields: frontmatter___order}) {
nodes {
frontmatter {
title
order
parent
}
fileAbsolutePath
}
}
}
`}
render={data => (
<ChildrenNodes nodes={Array.from(data.allMarkdownRemark.nodes)} parent={null} />
)}
/>
</ul>)
export default Drawer