diff --git a/components/embeds/Octocat.tsx b/components/embeds/Octocat.tsx deleted file mode 100644 index 21155b76..00000000 --- a/components/embeds/Octocat.tsx +++ /dev/null @@ -1,28 +0,0 @@ -const Octocat = (props: { repo: string }) => { - return ( - - - - ); -}; - -export default Octocat; diff --git a/components/notes/List.tsx b/components/notes/List.tsx index 6a7be262..e6561b9e 100644 --- a/components/notes/List.tsx +++ b/components/notes/List.tsx @@ -1,11 +1,11 @@ import Link from "next/link"; -import Markdown from "markdown-to-jsx"; import { format } from "date-fns"; import styles from "./List.module.css"; type NoteProps = { title: string; + htmlTitle?: string; date: string; slug: string; }; @@ -29,9 +29,7 @@ const List = ({ notesByYear }) => { }} prefetch={false} > - - {note.title} - + diff --git a/components/notes/Meta.tsx b/components/notes/Meta.tsx index afb9781f..69c00050 100644 --- a/components/notes/Meta.tsx +++ b/components/notes/Meta.tsx @@ -1,6 +1,5 @@ import Link from "next/link"; import { format } from "date-fns"; -import Markdown from "markdown-to-jsx"; import Hits from "../hits/Hits"; import { DateIcon, TagIcon, EditIcon, ViewsIcon } from "../icons"; import * as config from "../../lib/config"; @@ -9,12 +8,13 @@ import styles from "./Meta.module.css"; export type Props = { title: string; + htmlTitle?: string; date: string; slug: string; tags?: string[]; }; -const Meta = ({ title, date, slug, tags = [] }: Props) => ( +const Meta = ({ title, htmlTitle = "", date, slug, tags = [] }: Props) => ( <>
@@ -62,9 +62,7 @@ const Meta = ({ title, date, slug, tags = [] }: Props) => (

- - {title} - +

diff --git a/lib/parse-notes.ts b/lib/parse-notes.ts index 61511774..041235ad 100644 --- a/lib/parse-notes.ts +++ b/lib/parse-notes.ts @@ -1,6 +1,8 @@ import fs from "fs"; import path from "path"; import matter from "gray-matter"; +import { marked } from "marked"; +import sanitizeHtml from "sanitize-html"; import { bundleMDX } from "mdx-bundler"; import readingTime from "reading-time"; import { NOTES_DIR, baseUrl } from "./config"; @@ -28,10 +30,11 @@ export const getNoteData = (slug: string) => { return { frontMatter: { ...data, + htmlTitle: sanitizeHtml(marked.parseInline(data.title), { allowedTags: ["code"] }), slug, permalink: `${baseUrl}/notes/${slug}/`, date: new Date(data.date).toISOString(), // validate/normalize the date string provided from front matter - readingTime: readingTime(content).minutes, + readingMins: Math.ceil(readingTime(content).minutes), }, content, }; @@ -39,11 +42,10 @@ export const getNoteData = (slug: string) => { export const getNote = async (slug: string) => { // https://github.com/kentcdodds/mdx-bundler#nextjs-esbuild-enoent - if (process.platform === "win32") { - process.env.ESBUILD_BINARY_PATH = path.join(process.cwd(), "node_modules", "esbuild", "esbuild.exe"); - } else { - process.env.ESBUILD_BINARY_PATH = path.join(process.cwd(), "node_modules", "esbuild", "bin", "esbuild"); - } + process.env.ESBUILD_BINARY_PATH = + process.platform === "win32" + ? path.join(process.cwd(), "node_modules", "esbuild", "esbuild.exe") + : path.join(process.cwd(), "node_modules", "esbuild", "bin", "esbuild"); const { frontMatter, content } = getNoteData(slug); const { code: mdxSource } = await bundleMDX({ diff --git a/notes/coronavirus-open-source.mdx b/notes/coronavirus-open-source.mdx index a5d29d82..b53da04f 100644 --- a/notes/coronavirus-open-source.mdx +++ b/notes/coronavirus-open-source.mdx @@ -13,7 +13,33 @@ image: "/static/images/notes/coronavirus-open-source/covid19dashboards.png" import Image from "./components/embeds/Image"; import Video from "./components/embeds/Video"; -import Octocat from "./components/embeds/Octocat"; + +export const Octocat = (props) => { + return ( + + + + ); +}; We're all quickly learning that worldwide pandemics can bring out both [the best](https://www.vox.com/culture/2020/3/13/21179293/coronavirus-italy-covid19-music-balconies-sing) and [the worst](https://twitter.com/9NewsAUS/status/1236088663093608448) of humanity. But one thing has become readily apparent to me — outside of the large teams of medical professionals risking their lives right this minute, the open source community stands alone in its ability to rapidly organize in the midst of chaos to give back to the world and, in this case, make it safer for all of us. diff --git a/package.json b/package.json index 31d6d253..690441dc 100644 --- a/package.json +++ b/package.json @@ -43,7 +43,7 @@ "html-escaper": "^3.0.3", "is-absolute-url": "^4.0.1", "is-email-like": "^2.0.0", - "markdown-to-jsx": "^7.1.5", + "marked": "^4.0.9", "mdx-bundler": "^8.0.1", "modern-normalize": "github:sindresorhus/modern-normalize#1fc6b5a86676b7ac8abc62d04d6080f92debc70f", "next": "v12.0.8-canary.19", @@ -67,6 +67,7 @@ "rehype-highlight": "^5.0.2", "rehype-slug": "^5.0.1", "remark-gfm": "^3.0.1", + "sanitize-html": "^2.6.1", "styled-jsx": "^4.0.1", "swr": "^1.1.2" }, @@ -74,10 +75,12 @@ "@jakejarvis/eslint-config": "github:jakejarvis/eslint-config#main", "@svgr/webpack": "^6.1.2", "@types/html-escaper": "^3.0.0", + "@types/marked": "^4.0.1", "@types/prop-types": "^15.7.4", "@types/react": "^17.0.38", "@types/react-dom": "^17.0.11", "@types/react-is": "^17.0.3", + "@types/sanitize-html": "^2.6.1", "autoprefixer": "^10.4.2", "cross-env": "^7.0.3", "esbuild": "^0.14.11", diff --git a/yarn.lock b/yarn.lock index b06bd06b..cca58faa 100644 --- a/yarn.lock +++ b/yarn.lock @@ -1496,6 +1496,11 @@ dependencies: "@types/node" "*" +"@types/marked@^4.0.1": + version "4.0.1" + resolved "https://registry.yarnpkg.com/@types/marked/-/marked-4.0.1.tgz#d588a7bbc4d6551c5e75249bc106ffda96ae33c5" + integrity sha512-ZigEmCWdNUU7IjZEuQ/iaimYdDHWHfTe3kg8ORfKjyGYd9RWumPoOJRQXB0bO+XLkNwzCthW3wUIQtANaEZ1ag== + "@types/mdast@^3.0.0", "@types/mdast@^3.0.3": version "3.0.10" resolved "https://registry.yarnpkg.com/@types/mdast/-/mdast-3.0.10.tgz#4724244a82a4598884cbbe9bcfd73dff927ee8af" @@ -1583,6 +1588,13 @@ resolved "https://registry.yarnpkg.com/@types/retry/-/retry-0.12.1.tgz#d8f1c0d0dc23afad6dc16a9e993a0865774b4065" integrity sha512-xoDlM2S4ortawSWORYqsdU+2rxdh4LRW9ytc3zmT37RIKQh6IHyKwwtKhKis9ah8ol07DCkZxPt8BBvPjC6v4g== +"@types/sanitize-html@^2.6.1": + version "2.6.1" + resolved "https://registry.yarnpkg.com/@types/sanitize-html/-/sanitize-html-2.6.1.tgz#970193524df719f716c5bcf8db579859c446cd17" + integrity sha512-+JLlZdJkIHdgvlFnMorJeLv5WIORNcI+jHsAoPBWMnhGx5Rbz/D1QN5D4qvmoA7fooDlEVy6zlioWSgqbU0KeQ== + dependencies: + htmlparser2 "^6.0.0" + "@types/scheduler@*": version "0.16.2" resolved "https://registry.yarnpkg.com/@types/scheduler/-/scheduler-0.16.2.tgz#1a62f89525723dde24ba1b01b092bf5df8ad4d39" @@ -2442,14 +2454,14 @@ domelementtype@^2.0.1, domelementtype@^2.2.0: resolved "https://registry.yarnpkg.com/domelementtype/-/domelementtype-2.2.0.tgz#9a0b6c2782ed6a1c7323d42267183df9bd8b1d57" integrity sha512-DtBMo82pv1dFtUmHyr48beiuq792Sxohr+8Hm9zoxklYPfa6n0Z3Byjj2IV7bmr2IyqClnqEQhfgHJJ5QF0R5A== -domhandler@^4.2.0, domhandler@^4.3.0: +domhandler@^4.0.0, domhandler@^4.2.0, domhandler@^4.3.0: version "4.3.0" resolved "https://registry.yarnpkg.com/domhandler/-/domhandler-4.3.0.tgz#16c658c626cf966967e306f966b431f77d4a5626" integrity sha512-fC0aXNQXqKSFTr2wDNZDhsEYjCiYsDWl3D01kwt25hm1YIPyDGHvvi3rw+PLqHAl/m71MaiF7d5zvBr0p5UB2g== dependencies: domelementtype "^2.2.0" -domutils@^2.8.0: +domutils@^2.5.2, domutils@^2.8.0: version "2.8.0" resolved "https://registry.yarnpkg.com/domutils/-/domutils-2.8.0.tgz#4437def5db6e2d1f5d6ee859bd95ca7d02048135" integrity sha512-w96Cjofp72M5IIhpjgobBimYEfoPjx1Vx0BSX9P30WBdZW2WIKU0T1Bd0kz2eNZ9ikjKgHbEyKx8BB6H1L3h3A== @@ -3503,6 +3515,16 @@ html-tags@^3.1.0: resolved "https://registry.yarnpkg.com/html-tags/-/html-tags-3.1.0.tgz#7b5e6f7e665e9fb41f30007ed9e0d41e97fb2140" integrity sha512-1qYz89hW3lFDEazhjW0yVAV87lw8lVkrJocr72XmBkMKsoSVJCQx3W8BXsC7hO2qAt8BoVjYjtAcZ9perqGnNg== +htmlparser2@^6.0.0: + version "6.1.0" + resolved "https://registry.yarnpkg.com/htmlparser2/-/htmlparser2-6.1.0.tgz#c4d762b6c3371a05dbe65e94ae43a9f845fb8fb7" + integrity sha512-gyyPk6rgonLFEDGoeRgQNaEUvdJ4ktTmmUh/h2t7s+M8oPpIPxgNACWa+6ESR57kXstwqPiCut0V8NRpcwgU7A== + dependencies: + domelementtype "^2.0.1" + domhandler "^4.0.0" + domutils "^2.5.2" + entities "^2.0.0" + http-cache-semantics@^4.0.0: version "4.1.0" resolved "https://registry.yarnpkg.com/http-cache-semantics/-/http-cache-semantics-4.1.0.tgz#49e91c5cbf36c9b94bcfcd71c23d5249ec74e390" @@ -4106,10 +4128,10 @@ markdown-table@^3.0.0: resolved "https://registry.yarnpkg.com/markdown-table/-/markdown-table-3.0.2.tgz#9b59eb2c1b22fe71954a65ff512887065a7bb57c" integrity sha512-y8j3a5/DkJCmS5x4dMCQL+OR0+2EAq3DOtio1COSHsmW2BGXnNCK3v12hJt1LrUz5iZH5g0LmuYOjDdI+czghA== -markdown-to-jsx@^7.1.5: - version "7.1.5" - resolved "https://registry.yarnpkg.com/markdown-to-jsx/-/markdown-to-jsx-7.1.5.tgz#caf72ad8a8c34a2bb692c4d17e44aabbe4eb19fd" - integrity sha512-YQEMMMCX3PYOWtUAQu8Fmz5/sH09s17eyQnDubwaAo8sWmnRTT1og96EFv1vL59l4nWfmtF3L91pqkuheVqRlA== +marked@^4.0.9: + version "4.0.9" + resolved "https://registry.yarnpkg.com/marked/-/marked-4.0.9.tgz#96862d67bd31b4770917f01c93e1d9b3cc73ed96" + integrity sha512-HmoFvQwFLxNESeGupeOC+6CLb5WzcCWQmqvVetsErmrI3vrZ6gBumty5IP0ynLPR0zYSoVY7ITC1GffsYIGkog== mathml-tag-names@^2.1.3: version "2.1.3" @@ -5147,6 +5169,11 @@ parse-json@^5.0.0: json-parse-even-better-errors "^2.3.0" lines-and-columns "^1.1.6" +parse-srcset@^1.0.2: + version "1.0.2" + resolved "https://registry.yarnpkg.com/parse-srcset/-/parse-srcset-1.0.2.tgz#f2bd221f6cc970a938d88556abc589caaaa2bde1" + integrity sha1-8r0iH2zJcKk42IVWq8WJyqqiveE= + path-exists@^3.0.0: version "3.0.0" resolved "https://registry.yarnpkg.com/path-exists/-/path-exists-3.0.0.tgz#ce0ebeaa5f78cb18925ea7d810d7b59b010fd515" @@ -5719,6 +5746,18 @@ safe-buffer@~5.2.0: resolved "https://registry.yarnpkg.com/safe-buffer/-/safe-buffer-5.2.1.tgz#1eaf9fa9bdb1fdd4ec75f58f9cdb4e6b7827eec6" integrity sha512-rp3So07KcdmmKbGvgaNxQSJr7bGVSVk5S9Eq1F+ppbRo70+YeaDxkw5Dd8NPN+GD6bjnYm2VuPuCXmpuYvmCXQ== +sanitize-html@^2.6.1: + version "2.6.1" + resolved "https://registry.yarnpkg.com/sanitize-html/-/sanitize-html-2.6.1.tgz#5d37c08e189c61c0631560a889b10d9d155d000e" + integrity sha512-DzjSz3H5qDntD7s1TcWCSoRPmNR8UmA+y+xZQOvWgjATe2Br9ZW73+vD3Pj6Snrg0RuEuJdXgrKvnYuiuixRkA== + dependencies: + deepmerge "^4.2.2" + escape-string-regexp "^4.0.0" + htmlparser2 "^6.0.0" + is-plain-object "^5.0.0" + parse-srcset "^1.0.2" + postcss "^8.3.11" + sax@^1.2.4: version "1.2.4" resolved "https://registry.yarnpkg.com/sax/-/sax-1.2.4.tgz#2816234e2378bddc4e5354fab5caa895df7100d9"