From 40a947e2ea33b43989cd7e8dd449f8cf9952e10c Mon Sep 17 00:00:00 2001 From: Tuan Cao Date: Sun, 17 Apr 2022 20:04:58 +0700 Subject: [PATCH] Improve mapping slug to filepath, to reduce error when build up graph (WIP 2) --- components/MDContent.js | 5 +-- lib/node.js | 8 +++- lib/transformer.js | 44 ++++------------------ lib/utils.js | 82 ++++++++++++++++++----------------------- pages/note/[id].js | 9 ++--- 5 files changed, 56 insertions(+), 92 deletions(-) diff --git a/components/MDContent.js b/components/MDContent.js index 36b57c1..380dee5 100644 --- a/components/MDContent.js +++ b/components/MDContent.js @@ -28,7 +28,7 @@ function BackLinks({linkList}) { ); } -function MDContent({content, fileNames, backLinks, handleOpenNewContent}) { +function MDContent({content, backLinks, handleOpenNewContent}) { function handleInternalLinkClick() { //Processing fetching @@ -36,8 +36,7 @@ function MDContent({content, fileNames, backLinks, handleOpenNewContent}) { //TODO: handle clicking on internal link, go fetching md content from file then passing it up to parent handleOpenNewContent(content) } - - const router = useRouter(); + useRouter(); return (
diff --git a/lib/node.js b/lib/node.js index b79bd25..0d55d40 100644 --- a/lib/node.js +++ b/lib/node.js @@ -4,7 +4,13 @@ import fs from "fs" export const Node = { isFile:function(filename){ - return fs.lstatSync(filename).isFile() + try { + return fs.lstatSync(filename).isFile() + } catch (err) { + console.log(err) + return false + } + }, getFullPath:function(folderPath){ return fs.readdirSync(folderPath).map(fn => path.join(folderPath, fn)) diff --git a/lib/transformer.js b/lib/transformer.js index e2afd14..b9839d0 100644 --- a/lib/transformer.js +++ b/lib/transformer.js @@ -1,6 +1,4 @@ import matter from 'gray-matter' -import path from 'path' -import fs from "fs" import unified from "unified"; import markdown from "remark-parse"; import {wikiLinkPlugin} from "remark-wiki-link"; @@ -9,11 +7,7 @@ import frontmatter from "remark-frontmatter"; import externalLinks from "remark-external-links"; import highlight from "remark-highlight.js"; import {Node} from "./node"; -import {getAllFilePaths, toSlug} from "./utils"; -path.join(process.cwd(), 'posts'); -const isFile = fileName => { - return fs.lstatSync(fileName).isFile() -} +import {getAllMarkdownFiles, toFilePath, toSlug} from "./utils"; export const Transformer = { haveFrontMatter: function (content) { @@ -38,10 +32,10 @@ export const Transformer = { pageResolver: function (pageName) { - const allFileNames = getAllFilePaths() + const allFileNames = getAllMarkdownFiles() const result = allFileNames.find(aFile => { let parseFileNameFromPath = Transformer.parseFileNameFromPath(aFile); - return parseFileNameFromPath === pageName + return Transformer.normalizeFileName(parseFileNameFromPath) === Transformer.normalizeFileName(pageName) } ) @@ -53,7 +47,7 @@ export const Transformer = { return (result !== undefined && result.length > 0) ? [toSlug(result)] : ["/"] }, hrefTemplate: function (permalink) { - permalink = Transformer.normalizeFileName(permalink) + // permalink = Transformer.normalizeFileName(permalink) permalink = permalink.replace("ç", "c").replace("ı", "i").replace("ş", "s") return `/note/${permalink}`; }, getHtmlContent: function (content) { @@ -97,12 +91,9 @@ export const Transformer = { return content } const indexOfSecond = content.indexOf("---", (indexOfFirst + 1)); - const frontPart = content.slice(0, indexOfSecond); + content.slice(0, indexOfSecond); const contentPart = content.slice(indexOfSecond); - const processedContent = contentPart.split("---").join("") - //console.log("preprocess", indexOfFirst, indexOfSecond) - //return frontPart.concat(processedContent) - return processedContent + return contentPart.split("---").join("") }, /* Normalize File Names */ @@ -110,7 +101,7 @@ export const Transformer = { let processedFileName = filename.replace(".md", ""); processedFileName = processedFileName.replace('(', '').replace(')', '') processedFileName = processedFileName.split(" ").join("-") - // processedFileName = processedFileName.toLowerCase() + processedFileName = processedFileName.toLowerCase() const conversionLetters = [ ["ç", "c"], ["ş", "s"], ["ı", "i"], ["ü", "u"], ["ö", "o"], ["ğ", "g"], ["Ç", "C"], ["Ş", "S"], ["İ", "I"], ["Ü", "U"], ["Ö", "O"], ["Ğ", "G"] @@ -129,26 +120,7 @@ export const Transformer = { const parsedFileFromPath = filepath.split("/")[filepath.split("/").length - 1] return parsedFileFromPath.replace(".md", "") }, - /* Pair provided and existing Filenames*/ - pairCurrentFile: function (provided, listOfFilePaths) { - //console.log(provided, ListOfFilePaths) - const providedSanitizedFileName = Transformer.normalizeFileName(provided); - - // Map file paths and return true if it pairs with provided - const possibleFilePath = listOfFilePaths.filter(possibleFilePath => { - const possibleFileName = Transformer.parseFileNameFromPath(possibleFilePath); - const possibleSanitizedFileName = Transformer.normalizeFileName(possibleFileName) - //console.log("----", providedSanitizedFileName, possibleSanitizedFileName) - - //console.log("---", possibleSanitizedFileName, providedSanitizedFileName) - return providedSanitizedFileName === possibleSanitizedFileName; - - }) - console.log("p---", possibleFilePath) - return possibleFilePath[0] - }, - getInternalLinks: function (aFilePath) { // const filePaths = Node.getFiles(postsDirectory); // const currentFilePath = Transformer.pairCurrentFile(aFilePath, filePaths) @@ -170,7 +142,7 @@ export const Transformer = { const canonicalSlug = Transformer.pageResolver(pageName)[0] const backLink = { - title: canonicalSlug, + title: Transformer.parseFileNameFromPath(toFilePath(canonicalSlug)), slug: canonicalSlug, shortSummary: canonicalSlug } diff --git a/lib/utils.js b/lib/utils.js index da46607..437d724 100644 --- a/lib/utils.js +++ b/lib/utils.js @@ -9,15 +9,14 @@ const dirTree = require("directory-tree"); const postsDirectory = path.join(process.cwd(), 'posts') -export function getContent(filename) { - let {currentFilePath} = getFileNames(filename); - //console.log("currentFilePath: ", currentFilePath) +export function getContent(slug) { + let currentFilePath = toFilePath(slug) if (currentFilePath === undefined || currentFilePath == null) return null return Node.readFileSync(currentFilePath) } -export function getShortSummary(filename) { - const content = getContent(filename) +export function getShortSummary(slug) { + const content = getContent(slug) if (content === undefined || content === null) { return } @@ -29,38 +28,14 @@ export function getShortSummary(filename) { } -export function getAllFilePaths() { +export function getAllMarkdownFiles() { return Node.getFiles(postsDirectory) } - -export function getFileNames(filename) { - let filePaths = Node.getFiles(postsDirectory); - const fileNames = filePaths.map(f => Transformer.parseFileNameFromPath(f)) - //console.log("\t filenames: ",fileNames, "\n") - - // IF filename is not sidebar.md THEN Exclude sidebar.md from file list - let currentFilePath; - if (filename === "sidebar") { - //console.log(111) - currentFilePath = path.join(postsDirectory, "/sidebar.md") - } else if (filename === "index") { - //console.log(222) - currentFilePath = path.join(postsDirectory, "/index.md") - } else { - //TODO remove reference to index/sidebar md - filePaths = filePaths.filter(f => !(f.endsWith("sidebar.md") && f.endsWith("index.md"))) - //console.log("\tDirectory is scanning to find corresponding filename") - currentFilePath = toFilePath(filename) - //console.log("\tScan is finished. Founded filepath", currentFilePath, "\n") - } - return {fileNames, currentFilePath}; -} - -export function getSinglePost(filename) { - console.log("\n\nFile is scanning: ", filename) +export function getSinglePost(slug) { + console.log("\n\nFile is scanning: ", slug) // List of filenames that will provide existing links to wikilink - let {fileNames, currentFilePath} = getFileNames(filename); + let currentFilePath = slug !== "index" ? toFilePath(slug) : path.join(process.cwd(), 'posts') + "/index.md" //console.log("currentFilePath: ", currentFilePath) var fileContent = Node.readFileSync(currentFilePath) @@ -70,7 +45,7 @@ export function getSinglePost(filename) { const [htmlContent] = Transformer.getHtmlContent(fileContent) //console.log("hrmlcontents and backlinks") return { - id: filename, + id: slug, ...currentFileFrontMatter, data: htmlContent, } @@ -79,11 +54,23 @@ export function getSinglePost(filename) { export function toFilePath(slug) { // Construct file name from slug of /notes/abcxyz - return postsDirectory + slug - .replaceAll('__','/') - .replaceAll('--',' ') - .replaceAll('ambersand','&') - + ".md" + let filePath ; + + if (slug === '/') { + filePath = path.join(process.cwd(), 'posts') + "/index.md" + } else { + filePath = postsDirectory + slug + .replaceAll('__','/') + .replaceAll('--',' ') + .replaceAll('ambersand','&') + + ".md"; + } + + if (Node.isFile(filePath)) { + return filePath + } else { + return null + } } @@ -102,24 +89,24 @@ export function toSlug(filePath) { export function constructBackLinks() { - const filePaths = getContentPaths() + const filePaths = getAllMarkdownFiles(); const edges = [] const nodes = [] filePaths.forEach(filename => { - const {currentFilePath} = getFileNames(filename) - const internalLinks = Transformer.getInternalLinks(currentFilePath) + // const {currentFilePath} = getFileNames(filename) + const internalLinks = Transformer.getInternalLinks(filename) internalLinks.forEach(aLink => { if (aLink.slug === null || aLink.slug.length === 0) return const anEdge = { - source: filename, + source: toSlug(filename), target: aLink.slug, } edges.push(anEdge) if (nodes.findIndex(aNode => aNode.slug === aLink.slug) === -1) { - // aLink.shortSummary = getShortSummary(aLink.slug) + aLink.shortSummary = getShortSummary(aLink.slug) console.log(aLink.shortSummary) nodes.push(aLink) } @@ -184,7 +171,7 @@ export function getGraphData(currentNodeId) { } -export function getContentPaths() { +export function getAllSlugs() { //console.log("\n\nAll Posts are scanning") // Get file names under /posts const filePaths = Node.getFiles(postsDirectory).filter(f => !(f.endsWith("index") || f.endsWith("sidebar"))) @@ -201,7 +188,10 @@ let _counter = 0; export function convertObject(thisObject) { const children = [] - let routerPath = getContentPaths().find(fileName => fileName === Transformer.normalizeFileName(thisObject.name)) || null + let routerPath = getAllSlugs().find(slug => { + const fileName = Transformer.parseFileNameFromPath(toFilePath(slug)) + return Transformer.normalizeFileName(fileName) === Transformer.normalizeFileName(thisObject.name) + }) || null routerPath = routerPath ? '/note/' + routerPath : null const newObject = { name: thisObject.name, diff --git a/pages/note/[id].js b/pages/note/[id].js index 7c26f6b..ebfb800 100644 --- a/pages/note/[id].js +++ b/pages/note/[id].js @@ -1,11 +1,11 @@ import Head from "next/head"; import Layout from "../../components/layout"; import { - getContentPaths, + getAllSlugs, getSinglePost, convertObject, getDirectoryData, - constructBackLinks, getFileNames, getGraphData + constructBackLinks, getGraphData } from "../../lib/utils"; import FolderTree from "../../components/FolderTree"; import {getFlattenArray} from "../../lib/utils"; @@ -39,7 +39,7 @@ export default function Home({note, backLinks, fileNames, tree, flattenNodes, gr } export async function getStaticPaths() { - const allPostsData = getContentPaths(); + const allPostsData = getAllSlugs(); const paths = allPostsData.map(p => ({params: {id: p}})) return { @@ -54,8 +54,6 @@ export function getStaticProps({params}) { const note = getSinglePost(params.id); const tree = convertObject(getDirectoryData()); const flattenNodes = getFlattenArray(tree) - // const fileNames = getAllFileNames() - const { fileNames} = getFileNames(params.id) const listOfEdges = edges.filter(anEdge => anEdge.target === params.id) const internalLinks = listOfEdges.map(anEdge => nodes.find(aNode => aNode.slug === anEdge.source)).filter(element => element !== undefined) @@ -66,7 +64,6 @@ export function getStaticProps({params}) { note, tree: tree, flattenNodes: flattenNodes, - fileNames: fileNames, backLinks: internalLinks, graphData: graphData },