XeNote/pages/notes/index.tsx

58 lines
1.7 KiB
TypeScript
Raw Normal View History

2024-01-07 18:05:04 +00:00
import Layout from 'components/Layout'
2023-12-31 15:35:22 +00:00
import Util from 'lib/utils'
2024-01-07 18:05:04 +00:00
import FolderTree from 'components/FolderTree'
import MDContent, { type LinkType } from 'components/MDContent'
import Head from 'next/head'
2020-12-01 03:28:42 +00:00
2023-12-31 21:25:23 +00:00
export interface HomeProps {
2023-12-31 15:35:22 +00:00
content: string
tree: Record<string, unknown>
flattenNodes: unknown[]
2023-12-31 21:25:23 +00:00
backLinks: LinkType[]
2023-12-31 15:35:22 +00:00
}
// This trick is to dynamically load component that interact with window object (browser only)
2023-12-31 15:35:22 +00:00
export default function Home({ content, tree, flattenNodes, backLinks }: HomeProps) {
2023-12-24 04:26:19 +00:00
return (
<Layout>
<Head>
<link rel="stylesheet" href="https://cdn.jsdelivr.net/gh/kimeiga/bahunya/dist/bahunya.min.css" />
2024-01-07 04:12:23 +00:00
<body style={{ margin: 0, padding: 0 }} />
</Head>
2024-01-07 04:12:23 +00:00
<div className='flex gap-1 w-full'>
<nav className="">
2023-12-24 04:26:19 +00:00
<FolderTree tree={tree} flattenNodes={flattenNodes} />
</nav>
2023-12-30 16:49:39 +00:00
<MDContent content={content} backLinks={backLinks} />
2023-12-24 04:26:19 +00:00
</div>
2024-01-07 04:12:23 +00:00
</Layout >
2024-01-07 18:05:04 +00:00
)
2020-11-28 15:45:01 +00:00
}
2023-12-26 02:25:55 +00:00
2020-11-28 15:45:01 +00:00
export function getStaticProps() {
2023-12-31 15:35:22 +00:00
const { nodes, edges }: { nodes: unknown[], edges: unknown[] } = Util.constructGraphData()
2024-01-07 18:05:04 +00:00
const tree = Util.convertObject(Util.getDirectoryData())
const contentData = Util.getSinglePost('index')
const flattenNodes = Util.getFlattenArray(tree)
2023-12-31 15:35:22 +00:00
const listOfEdges = edges
.filter((anEdge) => (
2024-01-07 18:05:04 +00:00
anEdge as { target: string }).target === 'index'
2023-12-31 15:35:22 +00:00
)
const internalLinks = listOfEdges.map(
anEdge => nodes
.find(
aNode => (
aNode as { slug: string }).slug === (anEdge as { source: string }).source))
.filter(
element => element !== undefined)
2023-12-24 04:26:19 +00:00
const backLinks = [...new Set(internalLinks)]
2022-04-18 16:18:26 +00:00
2023-12-24 04:26:19 +00:00
return {
props: {
content: contentData.data,
2024-01-07 18:05:04 +00:00
tree,
flattenNodes,
backLinks
}
}
2020-11-28 15:45:01 +00:00
}