Set specific package versions

homepage/homepage/app/api-reference/[package]/page.tsx

@@ -1,4 +1,5 @@
 import { PackageDocs } from "@/components/docs/packageDocs";
+import { requestProject } from "@/components/docs/requestProject";
 import { packages } from "@/lib/packages";
 import { notFound } from "next/navigation";
 
@@ -6,12 +7,14 @@ interface Props {
   params: { package: string };
 }
 
-export default function Page({ params }: Props) {
+export default async function Page({ params }: Props) {
   if (!packages.map((p) => p.name).includes(params.package)) {
     return notFound();
   }
 
-  return <PackageDocs package={params.package} />;
+  const project = await requestProject(params.package as any);
+
+  return <PackageDocs project={project} package={params.package} />;
 }
 
 export async function generateMetadata({ params }: Props) {

homepage/homepage/app/api-reference/layout.tsx

@@ -1,5 +1,6 @@
 import { ApiNav } from "@/components/docs/ApiNav";
 import DocsLayout from "@/components/docs/DocsLayout";
+import { requestProjects } from "@/components/docs/requestProject";
 import { Prose } from "gcmp-design-system/src/app/components/molecules/Prose";
 
 export const metadata = {
@@ -8,13 +9,15 @@ export const metadata = {
     "API references for packages like jazz-tools, jazz-react, and more.",
 };
 
-export default function Layout({
+export default async function Layout({
   children,
 }: {
   children: React.ReactNode;
 }) {
+  const projects = await requestProjects();
+
   return (
-    <DocsLayout nav={<ApiNav />}>
+    <DocsLayout nav={<ApiNav projects={projects} />}>
       <Prose className="py-8 [&_*]:scroll-mt-[8rem]">{children}</Prose>
     </DocsLayout>
   );

homepage/homepage/components/docs/ApiNav.tsx

@@ -1,22 +1,24 @@
-import { SideNav } from "@/components/SideNav";
 import { SideNavHeader } from "@/components/SideNavHeader";
 import { SideNavItem } from "@/components/SideNavItem";
-import { docNavigationItems } from "@/lib/docNavigationItems";
 import { packages } from "@/lib/packages";
 import { clsx } from "clsx";
 import { ChevronRight, PackageIcon } from "lucide-react";
 import Link from "next/link";
-import { twMerge } from "tailwind-merge";
-import { requestProject } from "./requestProject";
+import { ProjectReflection } from "typedoc";
+
+export function ApiNav({
+  className,
+  projects,
+}: { className?: string; projects: ProjectReflection[] }) {
+  if (!projects?.length) return;
 
-export function ApiNav({ className }: { className?: string }) {
   return (
     <div className={clsx(className, "text-sm space-y-5")}>
       <SideNavHeader href="/api-reference">API Reference</SideNavHeader>
       <ul className="space-y-5">
-        {packages.map(({ name }) => (
-          <li key={name}>
-            <PackageNavItem package={name} />
+        {projects.map((project, index) => (
+          <li key={project.name}>
+            <PackageNavItem package={packages[index].name} project={project} />
           </li>
         ))}
       </ul>
@@ -24,13 +26,13 @@ export function ApiNav({ className }: { className?: string }) {
   );
 }
 
-export async function PackageNavItem({
+export function PackageNavItem({
   package: packageName,
+  project,
 }: {
   package: string;
+  project: ProjectReflection;
 }) {
-  let project = await requestProject(packageName as any);
-
   return (
     <>
       <SideNavItem

homepage/homepage/components/docs/packageDocs.tsx

@@ -2,13 +2,13 @@ import { PackageIcon, Type } from "lucide-react";
 import {
   CommentDisplayPart,
   DeclarationReflection,
+  ProjectReflection,
   ReflectionKind,
   SignatureReflection,
   SomeType,
   TypeContext,
   TypeParameterReflection,
 } from "typedoc";
-import { requestProject } from "./requestProject";
 import {
   ClassOrInterface,
   DocComment,
@@ -18,15 +18,13 @@ import {
   PropDecl,
 } from "./tags";
 
-export async function PackageDocs({
+export function PackageDocs({
   package: packageName,
+  project,
 }: {
   package: string;
+  project: ProjectReflection;
 }) {
-  let project = await requestProject(packageName as any);
-
-  // console.dir(project, {depth: 10});
-
   return (
     <>
       <h2 className="flex items-center gap-2">

homepage/homepage/components/docs/requestProject.ts

@@ -21,3 +21,16 @@ export async function requestProject(
   const deserializer = new Deserializer({} as any);
   return deserializer.reviveProject(docs[packageName], packageName);
 }
+
+export async function requestProjects(): Promise<ProjectReflection[]> {
+  const projectNames = Object.keys(docs) as (keyof typeof docs)[];
+
+  const projects = await Promise.all(
+    projectNames.map(async (name) => {
+      const project = await requestProject(name);
+      return project;
+    }),
+  );
+
+  return projects;
+}

homepage/homepage/package.json

@@ -38,7 +38,7 @@
     "next": "14.2.15",
     "next-themes": "^0.2.1",
     "qrcode": "^1.5.4",
-    "react": "^18",
+    "react": "18",
     "react-dom": "^18",
     "rehype-slug": "^6.0.0",
     "shiki": "^0.14.6",
@@ -51,12 +51,12 @@
     "@biomejs/biome": "1.9.4",
     "@types/geojson": "^7946.0.14",
     "@types/node": "^20",
-    "@types/react": "^18",
+    "@types/react": "18",
     "@types/react-dom": "^18",
     "autoprefixer": "^10",
     "postcss": "^8",
     "tailwindcss": "^3",
     "typedoc": "^0.25.13",
-    "typescript": "^5.3.3"
+    "typescript": "5.3.3"
   }
 }

homepage/pnpm-lock.yaml

@@ -251,7 +251,7 @@ importers:
         specifier: ^1.5.4
         version: 1.5.4
       react:
-        specifier: ^18
+        specifier: '18'
         version: 18.3.1
       react-dom:
         specifier: ^18
@@ -264,7 +264,7 @@ importers:
         version: 0.14.7
       shiki-twoslash:
         specifier: ^3.1.2
-        version: 3.1.2(typescript@5.4.5)
+        version: 3.1.2(typescript@5.3.3)
       tailwind-merge:
         specifier: ^1.14.0
         version: 1.14.0
@@ -285,7 +285,7 @@ importers:
         specifier: ^20
         version: 20.12.11
       '@types/react':
-        specifier: ^18
+        specifier: '18'
         version: 18.3.1
       '@types/react-dom':
         specifier: ^18
@@ -301,10 +301,10 @@ importers:
         version: 3.4.3
       typedoc:
         specifier: ^0.25.13
-        version: 0.25.13(typescript@5.4.5)
+        version: 0.25.13(typescript@5.3.3)
       typescript:
-        specifier: ^5.3.3
-        version: 5.4.5
+        specifier: 5.3.3
+        version: 5.3.3
 
 packages:
 
@@ -2605,6 +2605,11 @@ packages:
     peerDependencies:
       typescript: 4.6.x || 4.7.x || 4.8.x || 4.9.x || 5.0.x || 5.1.x || 5.2.x || 5.3.x || 5.4.x
 
+  typescript@5.3.3:
+    resolution: {integrity: sha512-pXWcraxM0uxAS+tN0AG/BF2TyqmHO014Z070UsJ+pFvYuRSq8KH8DmWpnbXe0pEPDHXZV3FcAbJkijJ5oNEnWw==}
+    engines: {node: '>=14.17'}
+    hasBin: true
+
   typescript@5.4.5:
     resolution: {integrity: sha512-vcI4UpRgg81oIRUFwR0WSIHKt11nJ7SAVlYNIu+QpqeyXP+gpQJy/Z4+F0aGxSE4MqwjyXvW/TzgkLAx2AGHwQ==}
     engines: {node: '>=14.17'}
@@ -5953,6 +5958,16 @@ snapshots:
 
   shebang-regex@3.0.0: {}
 
+  shiki-twoslash@3.1.2(typescript@5.3.3):
+    dependencies:
+      '@typescript/twoslash': 3.1.0
+      '@typescript/vfs': 1.3.4
+      fenceparser: 1.1.1
+      shiki: 0.10.1
+      typescript: 5.3.3
+    transitivePeerDependencies:
+      - supports-color
+
   shiki-twoslash@3.1.2(typescript@5.4.5):
     dependencies:
       '@typescript/twoslash': 3.1.0
@@ -6136,6 +6151,14 @@ snapshots:
 
   tslib@2.8.1: {}
 
+  typedoc@0.25.13(typescript@5.3.3):
+    dependencies:
+      lunr: 2.3.9
+      marked: 4.3.0
+      minimatch: 9.0.4
+      shiki: 0.14.7
+      typescript: 5.3.3
+
   typedoc@0.25.13(typescript@5.4.5):
     dependencies:
       lunr: 2.3.9
@@ -6144,6 +6167,8 @@ snapshots:
       shiki: 0.14.7
       typescript: 5.4.5
 
+  typescript@5.3.3: {}
+
   typescript@5.4.5: {}
 
   undici-types@5.26.5: {}