From c18352c8c6f1f984f86746a00747340eba731553 Mon Sep 17 00:00:00 2001 From: Josh Vlk Date: Sun, 12 Apr 2026 15:16:39 -0400 Subject: [PATCH] feat: split API overview page out of MdxRoute into ApiOverviewRoute --- app/routes.res | 12 ++--- app/routes/ApiOverviewRoute.res | 84 ++++++++++++++++++++++++++++++++ app/routes/ApiOverviewRoute.resi | 9 ++++ app/routes/MdxRoute.res | 56 ++------------------- 4 files changed, 100 insertions(+), 61 deletions(-) create mode 100644 app/routes/ApiOverviewRoute.res create mode 100644 app/routes/ApiOverviewRoute.resi diff --git a/app/routes.res b/app/routes.res index 86220d2bb..db86b1ff5 100644 --- a/app/routes.res +++ b/app/routes.res @@ -47,11 +47,6 @@ let blogArticleRoutes = route(path, "./routes/BlogArticleRoute.jsx", ~options={id: path}) ) -let docsGuidelinesRoutes = - MdxFile.scanPaths( - ~dir="markdown-pages/docs/guidelines", - ~alias="docs/guidelines", - )->Array.map(path => route(path, "./routes/DocsGuidelinesRoute.jsx", ~options={id: path})) let communityRoutes = MdxFile.scanPaths(~dir="markdown-pages/community", ~alias="community")->Array.map(path => route(path, "./routes/CommunityRoute.jsx", ~options={id: path}) @@ -63,8 +58,9 @@ let mdxRoutes = mdxRoutes("./routes/MdxRoute.jsx")->Array.filter(r => ->Option.map(path => path === "blog" || String.startsWith(path, "blog/") || - path === "docs/guidelines" || - String.startsWith(path, "docs/guidelines/") || + path === "community" || + String.startsWith(path, "community/") || + path === "docs/manual/api" || path === "community" || String.startsWith(path, "community/") ) @@ -80,6 +76,7 @@ let default = [ route("blog", "./routes/BlogRoute.jsx", ~options={id: "blog-index"}), route("blog/archived", "./routes/BlogRoute.jsx", ~options={id: "blog-archived"}), route("docs", "./routes/DocsOverview.jsx", ~options={id: "docs-overview"}), + route("docs/manual/api", "./routes/ApiOverviewRoute.jsx", ~options={id: "api-overview"}), route("docs/manual/api/stdlib", "./routes/ApiRoute.jsx", ~options={id: "api-stdlib"}), route("docs/manual/api/introduction", "./routes/ApiRoute.jsx", ~options={id: "api-intro"}), route("docs/manual/api/belt", "./routes/ApiRoute.jsx", ~options={id: "api-belt"}), @@ -88,7 +85,6 @@ let default = [ ...beltRoutes, ...domRoutes, ...blogArticleRoutes, - ...docsGuidelinesRoutes, ...communityRoutes, ...mdxRoutes, route("*", "./routes/NotFoundRoute.jsx"), diff --git a/app/routes/ApiOverviewRoute.res b/app/routes/ApiOverviewRoute.res new file mode 100644 index 000000000..6f99da626 --- /dev/null +++ b/app/routes/ApiOverviewRoute.res @@ -0,0 +1,84 @@ +type loaderData = { + compiledMdx: CompiledMdx.t, + title: string, + description: string, +} + +let loader: ReactRouter.Loader.t = async ({request}) => { + let {pathname} = WebAPI.URL.make(~url=request.url) + let filePath = MdxFile.resolveFilePath( + (pathname :> string), + ~dir="markdown-pages/docs/manual", + ~alias="docs/manual", + ) + + let raw = await Node.Fs.readFile(filePath, "utf-8") + let {frontmatter}: MarkdownParser.result = MarkdownParser.parseSync(raw) + + let description = switch frontmatter { + | Object(dict) => + switch dict->Dict.get("description") { + | Some(String(s)) => s + | _ => "" + } + | _ => "" + } + + let compiledMdx = await MdxFile.compileMdx(raw, ~filePath, ~remarkPlugins=Mdx.plugins) + + { + compiledMdx, + title: "API | ReScript API", + description, + } +} + +let default = () => { + let {pathname} = ReactRouter.useLocation() + let {compiledMdx, title, description} = ReactRouter.useLoaderData() + + let breadcrumbs = list{ + {Url.name: "Docs", href: `/docs/manual/api`}, + {Url.name: "API", href: `/docs/manual/api`}, + } + + let sidebarContent = + + + <> + + + + + + +
+ +
+ + +} diff --git a/app/routes/ApiOverviewRoute.resi b/app/routes/ApiOverviewRoute.resi new file mode 100644 index 000000000..58597e9a5 --- /dev/null +++ b/app/routes/ApiOverviewRoute.resi @@ -0,0 +1,9 @@ +type loaderData = { + compiledMdx: CompiledMdx.t, + title: string, + description: string, +} + +let loader: ReactRouter.Loader.t + +let default: unit => React.element diff --git a/app/routes/MdxRoute.res b/app/routes/MdxRoute.res index 49c8ae1c8..889a7c890 100644 --- a/app/routes/MdxRoute.res +++ b/app/routes/MdxRoute.res @@ -146,9 +146,7 @@ let loader: ReactRouter.Loader.t = async ({request}) => { res } else { let categories = { - if pathname == "/docs/manual/api" { - [] - } else if pathname->String.includes("docs/manual") { + if pathname->String.includes("docs/manual") { await manualTableOfContents() } else if pathname->String.includes("docs/react") { await reactTableOfContents() @@ -221,8 +219,6 @@ let loader: ReactRouter.Loader.t = async ({request}) => { let path = (pathname :> string) let title = if path->String.includes("docs/react") { "ReScript React" - } else if path->String.includes("docs/manual/api") { - "ReScript API" } else if path->String.includes("docs/manual") { "ReScript Language Manual" } else { @@ -232,11 +228,7 @@ let loader: ReactRouter.Loader.t = async ({request}) => { title } - let title = if pathname == "/docs/manual/api" { - "API" - } else { - mdx.attributes.title - } + let title = mdx.attributes.title let res: loaderData = { __raw: mdx.__raw, @@ -261,49 +253,7 @@ let default = () => { let {entries, categories, title} = loaderData <> - {if (pathname :> string) == "/docs/manual/api" { - let breadcrumbs = list{ - {Url.name: "Docs", href: `/docs/manual/api`}, - {name: "API", href: `/docs/manual/api`}, - } - let sidebarContent = - - - <> - Nullable.getOr("ReScript API")} /> - - - - - -
{component()}
- - - } else if ( + {if ( (pathname :> string)->String.includes("docs/manual") || (pathname :> string)->String.includes("docs/react") || (pathname :> string)->String.includes("docs/guidelines")