XeNote/pages/notes/index.tsx
Triston Armstrong fd51f273f4 Change a lot of things (see description)
- removes tailwind (was cool but dont need it)
- reworks a lot of the html
- utilize a no css... library? css file? idk
- add a few details
- rework the navigation on the built notes pages
- write a bunch of tailwind like css classes
- ... maybe some more, too lazy
2024-01-06 21:04:57 -06:00

60 lines
1.7 KiB
TypeScript

import Layout from "components/Layout";
import Util from 'lib/utils'
import FolderTree from "components/FolderTree";
import MDContent, { type LinkType } from "components/MDContent";
import Head from "next/head";
export interface HomeProps {
content: string
tree: Record<string, unknown>
flattenNodes: unknown[]
backLinks: LinkType[]
}
// This trick is to dynamically load component that interact with window object (browser only)
export default function Home({ content, tree, flattenNodes, backLinks }: HomeProps) {
return (
<Layout>
<Head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/kimeiga/bahunya/dist/bahunya.min.css" />
</Head>
<div className=''>
<nav className="">
<FolderTree tree={tree} flattenNodes={flattenNodes} />
</nav>
<MDContent content={content} backLinks={backLinks} />
</div>
</Layout>
);
}
export function getStaticProps() {
const { nodes, edges }: { nodes: unknown[], edges: unknown[] } = Util.constructGraphData()
const tree = Util.convertObject(Util.getDirectoryData());
const contentData = Util.getSinglePost("index");
const flattenNodes = Util.getFlattenArray(tree)
const listOfEdges = edges
.filter((anEdge) => (
anEdge as { target: string }).target === "index"
)
const internalLinks = listOfEdges.map(
anEdge => nodes
.find(
aNode => (
aNode as { slug: string }).slug === (anEdge as { source: string }).source))
.filter(
element => element !== undefined)
const backLinks = [...new Set(internalLinks)]
return {
props: {
content: contentData.data,
tree: tree,
flattenNodes: flattenNodes,
backLinks: backLinks
},
};
}