diff options
author | lonkaars <l.leblansch@gmail.com> | 2021-04-12 10:25:43 +0200 |
---|---|---|
committer | lonkaars <l.leblansch@gmail.com> | 2021-04-12 10:25:43 +0200 |
commit | 822d1ee1be99b7d96740585ddd1174b94916335d (patch) | |
tree | 7005e359d7f62dede5f3eabe02becec37d8bfe57 /pages/post | |
parent | 7f7e14bd9dce02e6ced663fd527a5750cd13f920 (diff) |
dprint formatter :tada:
Diffstat (limited to 'pages/post')
-rw-r--r-- | pages/post/[id].tsx | 123 |
1 files changed, 62 insertions, 61 deletions
diff --git a/pages/post/[id].tsx b/pages/post/[id].tsx index b68b790..c0d4e9d 100644 --- a/pages/post/[id].tsx +++ b/pages/post/[id].tsx @@ -1,14 +1,14 @@ -import { ReactNode } from 'react'; import ReactMarkdownWithHTML from 'react-markdown/with-html'; import { readdirSync, readFileSync } from 'fs'; import { join } from 'path'; +import { ReactNode } from 'react'; import gfm from 'remark-gfm'; -import Seperator from '../../components/seperator'; import Navbar from '../../components/navbar'; +import Seperator from '../../components/seperator'; // import Button from '../../components/button'; -import Image from '../../components/image'; import Chapters, { chapter } from '../../components/chapters'; +import Image from '../../components/image'; import Tags from '../../components/tag'; export interface ArticleMeta { @@ -21,70 +21,72 @@ export interface ArticleMeta { id?: string; } -export function RenderedArticle(props: { content: string }) { +export function RenderedArticle(props: { content: string; }) { return <ReactMarkdownWithHTML - plugins={[gfm]} - allowDangerousHtml - children={props.content} - renderers={{ - image: Image, - thematicBreak: Seperator, - heading: Heading, - }}/>; + plugins={[gfm]} + allowDangerousHtml + children={props.content} + renderers={{ + image: Image, + thematicBreak: Seperator, + heading: Heading, + }} + />; } var headingLevel = (input: string) => input?.match(/^[#]+/)[0]?.length || 0; -var sectionID = (input: string) => input - .replace(/[()\[\]{}!@#$%^&*<>?,./\;':"\\|=+]/g, "") - .replace(/\s/g, "-") - .toLowerCase(); +var sectionID = (input: string) => + input + .replace(/[()\[\]{}!@#$%^&*<>?,./\;':"\\|=+]/g, '') + .replace(/\s/g, '-') + .toLowerCase(); function Heading(props: { children?: ReactNode; level?: number; }) { - var HeadingTag = "h" + props.level as keyof JSX.IntrinsicElements; - return <HeadingTag id={sectionID(props.children[0].props.children)} children={props.children}/> + var HeadingTag = 'h' + props.level as keyof JSX.IntrinsicElements; + return <HeadingTag id={sectionID(props.children[0].props.children)} children={props.children} />; } export default function Post(props: { - content: string, - meta: ArticleMeta + content: string; + meta: ArticleMeta; }) { return <div> - <div className="centeredPage"> - <div className="titleWrapper"> + <div className='centeredPage'> + <div className='titleWrapper'> <h1>{props.meta.title}</h1> - <p className="subtile">{props.meta.subtitle}</p> - { props.meta.tags && <Tags tags={props.meta.tags}/> } + <p className='subtile'>{props.meta.subtitle}</p> + {props.meta.tags && <Tags tags={props.meta.tags} />} </div> - <div className="navAreaWrapper"> - <div className="sticky"> - <Navbar/> - <Chapters chapters={props.meta.chapters}/> + <div className='navAreaWrapper'> + <div className='sticky'> + <Navbar /> + <Chapters chapters={props.meta.chapters} /> </div> </div> - <div className="contentWrapper"> - <RenderedArticle content={props.content}/> + <div className='contentWrapper'> + <RenderedArticle content={props.content} /> </div> </div> - </div> + </div>; } var parseTag = { - "title": (val: string) => val, - "subtitle": (val: string) => val, - "author": (val: string) => val, - "tags": (val: string) => val.split(",").map(i => i.trim()), - "date": (val: string) => new Date(val).toDateString(), -} + 'title': (val: string) => val, + 'subtitle': (val: string) => val, + 'author': (val: string) => val, + 'tags': (val: string) => val.split(',').map(i => i.trim()), + 'date': (val: string) => new Date(val).toDateString(), +}; function parseMeta(file: Array<string>): ArticleMeta { var meta: ArticleMeta = {}; file.forEach(line => { - if (!line.startsWith("[meta]: ")) return; + if (!line.startsWith('[meta]: ')) return; var tags = line.match(/\[meta\]:\s+\<(.+?)\>\s+\((.+?)\)/); if (!tags || !tags[1] || !tags[2]) return; if (!parseTag.hasOwnProperty(tags[1])) return; @@ -98,7 +100,7 @@ function parseToCRecursive(headings: Array<string>): Array<chapter> { interface WIPchapter extends chapter { unparsedChildren?: Array<string>; } - var children: Array<WIPchapter> = [] + var children: Array<WIPchapter> = []; var lowestLevel = headingLevel(headings[0]); var currentChildIndex = -1; @@ -108,44 +110,44 @@ function parseToCRecursive(headings: Array<string>): Array<chapter> { var chapterName = headings[i].match(/^[#]+\s+(.+)/)[1]; children.push({ name: chapterName, - sectionLink: "#" + sectionID(chapterName), + sectionLink: '#' + sectionID(chapterName), unparsedChildren: [], }); currentChildIndex += 1; } else { - children[currentChildIndex].unparsedChildren.push(headings[i]) + children[currentChildIndex].unparsedChildren.push(headings[i]); } } children.map(child => { - child.children = parseToCRecursive(child.unparsedChildren) + child.children = parseToCRecursive(child.unparsedChildren); delete child.unparsedChildren; - return child - }) + return child; + }); return children as Array<chapter>; } function parseToC(file: Array<string>): Array<chapter> { - var fileAsStr = file.join("\n"); - fileAsStr = fileAsStr.replace(/```.*?```/gs, ""); // filter out code blocks from table of contents - var fileAsArr = fileAsStr.split("\n"); - var chapterStrings = fileAsArr.filter(line => line.startsWith("#")); + var fileAsStr = file.join('\n'); + fileAsStr = fileAsStr.replace(/```.*?```/gs, ''); // filter out code blocks from table of contents + var fileAsArr = fileAsStr.split('\n'); + var chapterStrings = fileAsArr.filter(line => line.startsWith('#')); return parseToCRecursive(chapterStrings); } function preprocessor(fileContent: string) { - var fileAsArr = fileContent.split("\n"); + var fileAsArr = fileContent.split('\n'); var meta = parseMeta(fileAsArr); meta.chapters = parseToC(fileAsArr); - var result = fileAsArr.join("\n").trim() - return { meta, result } + var result = fileAsArr.join('\n').trim(); + return { meta, result }; } -export function getStaticProps(props: {params: { id: string }}) { - var filename = join("posts/", props.params.id + ".md") - var filecontent = readFileSync(filename).toString().trim() +export function getStaticProps(props: { params: { id: string; }; }) { + var filename = join('posts/', props.params.id + '.md'); + var filecontent = readFileSync(filename).toString().trim(); var parsed = preprocessor(filecontent); parsed.meta.id = props.params.id; @@ -155,21 +157,20 @@ export function getStaticProps(props: {params: { id: string }}) { content: parsed.result, meta: parsed.meta, }, - } + }; } export function getStaticPaths() { - var files = readdirSync("posts").filter(f => f.endsWith(".md")); + var files = readdirSync('posts').filter(f => f.endsWith('.md')); return { paths: files.map((f) => { return { params: { - id: f.substr(0, f.length - 3) - } - } + id: f.substr(0, f.length - 3), + }, + }; }), fallback: false, - } + }; } - |