actually generate doc index for real this time

packages/docs/app/routes/docs.tsx

@@ -0,0 +1,36 @@
+import type { LoaderFunction } from "remix"
+import { Link, Outlet, useLoaderData } from "remix"
+import { SideNav } from "~/components/side-nav"
+import { SidebarLayout } from "~/components/sidebar-layout"
+import type { ContentIndexEntry } from "~/create-index.server"
+import { createContentIndex } from "~/create-index.server"
+import { linkClass } from "~/styles"
+
+type LoaderData = ContentIndexEntry[]
+
+export const loader: LoaderFunction = async () => {
+  const data: LoaderData = await createContentIndex("app/routes/docs/guides")
+  return data
+}
+
+export default function Docs() {
+  const data: LoaderData = useLoaderData()
+  return (
+    <SidebarLayout
+      sidebar={
+        <SideNav heading="Guides">
+          {data.map(({ title, route }) => (
+            <Link className={linkClass} key={route} to={route}>
+              {title}
+            </Link>
+          ))}
+        </SideNav>
+      }
+      body={
+        <section className="prose max-w-none prose-invert prose-h1:font-light flex-1 prose-h1:mb-4 prose-p:my-4 prose-pre:text-[15px] prose-pre:font-monospace prose-h2:font-light h-[200vh]">
+          <Outlet />
+        </section>
+      }
+    />
+  )
+}