refactor: move docs into docs/ root folder

astro.config.ts

@@ -48,6 +48,7 @@ export default defineConfig({
     resolve: {
       alias: {
         "~": resolve(__dirname, "./src"),
+        "@docs": resolve(__dirname, "./docs"),
         "@pages": resolve(__dirname, "./src/pages"),
         "@assets": resolve(__dirname, "./src/assets"),
         "@scripts": resolve(__dirname, "./src/scripts"),

docs/discord-experiments-api/experiments.md

@@ -1,7 +1,6 @@
 ---
 title: Experiments
 description: How to fetch experiments from the API
-layout: ../../../layouts/docs/ItemLayout.astro
 ---
 
 # Experiments

docs/discord-experiments-api/introduction.md

@@ -1,7 +1,6 @@
 ---
 title: Introduction
 description: Introduction to the Discord Experiments API
-layout: ../../../layouts/docs/ItemLayout.astro
 ---
 
 # Introduction

src/components/widgets/docs/LeftSidebar.astro

@@ -34,7 +34,6 @@ const getLinkClasses = (link: Sidebar) => {
       />
     </button>
   </div>
-  <!--<nav aria-labelledby="grid-left" class="w-64 border-r p-4">-->
   <nav
     id="sidebar"
     aria-labelledby="grid-left"

src/components/widgets/docs/RightSidebar.astro

@@ -1,13 +1,15 @@
 ---
 import TableOfContents from "./TableOfContents.astro";
 const { item } = Astro.props;
+
+const headings = item.getHeadings();
 ---
 
 {
-  item.headings.length > 1 && (
+  headings.length > 1 && (
     <nav aria-labelledby="grid-right" class="invisible md:visible">
       <div class="px-8">
-        <TableOfContents headings={item.headings} />
+        <TableOfContents headings={headings} />
       </div>
     </nav>
   )

src/layouts/docs/ItemLayout.astro

@@ -4,13 +4,13 @@ import RightSidebar from "@components/widgets/docs/RightSidebar.astro";
 import Navbar from "@components/widgets/Navbar.astro";
 import Layout from "@layouts/Layout.astro";
 
-const item = Astro.props;
+const { item } = Astro.props;
 const currentPage = new URL(Astro.request.url).pathname;
 ---
 
 <Layout
-  title={`Docs - ${item.content.title}`}
-  description={item.content.description}
+  title={`Docs - ${item.frontmatter.title}`}
+  description={item.frontmatter.description}
   url={`https://xhyrom.dev${item.url}`}
 >
   <Navbar />

src/pages/docs/[category]/[id].astro

@@ -0,0 +1,29 @@
+---
+import ItemLayout from "@layouts/docs/ItemLayout.astro";
+
+export async function getStaticPaths() {
+  const docs = await Astro.glob("@docs/**/*.md");
+
+  return docs.map((doc) => {
+    const path = doc.file.split("/docs/")[1];
+    const [categoryId, docId] = path.split("/");
+
+    return {
+      params: {
+        category: categoryId,
+        id: docId.replace(".md", ""),
+      },
+      props: {
+        ...doc,
+        url: `/docs/${categoryId}/${docId.replace(".md", "")}`,
+      },
+    };
+  });
+}
+
+const item = Astro.props;
+---
+
+<ItemLayout item={item}>
+  <div set:html={item.compiledContent()} />
+</ItemLayout>

tsconfig.json

@@ -4,6 +4,7 @@
     "baseUrl": ".",
     "paths": {
       "~/*": ["src/*"],
+      "@docs/*": ["docs/*"],
       "@pages/*": ["src/pages/*"],
       "@assets/*": ["src/assets"],
       "@scripts/*": ["src/scripts"],