docs: restructure api-reference to allow base path (#7954)

www/apps/api-reference/app/admin/page.tsx

@@ -0,0 +1,42 @@
+import AreaProvider from "@/providers/area"
+import AdminContentV2 from "../_mdx/admin.mdx"
+import ClientLibrariesV2 from "../_mdx/client-libraries.mdx"
+import Section from "@/components/Section"
+import Tags from "@/components/Tags"
+import DividedLayout from "@/layouts/Divided"
+import PageTitleProvider from "@/providers/page-title"
+
+const ReferencePage = async () => {
+  return (
+    <AreaProvider area={"admin"}>
+      <PageTitleProvider>
+        <h1 className="!text-h2 block lg:hidden">
+          Medusa V2 Admin API Reference
+        </h1>
+        <DividedLayout
+          mainContent={
+            <Section>
+              <h1 className="!text-h2 hidden lg:block">
+                Medusa V2 Admin API Reference
+              </h1>
+              <AdminContentV2 />
+            </Section>
+          }
+          codeContent={<ClientLibrariesV2 />}
+          className="flex-col-reverse"
+        />
+        <Tags />
+      </PageTitleProvider>
+    </AreaProvider>
+  )
+}
+
+export default ReferencePage
+
+export function generateMetadata() {
+  return {
+    title: `Medusa Admin API Reference`,
+    description: `REST API reference for the Medusa admin API. This reference includes code snippets and examples for Medusa JS Client and cURL.`,
+    metadataBase: process.env.NEXT_PUBLIC_BASE_URL,
+  }
+}

www/apps/api-reference/app/api/algolia/route.ts

@@ -1,12 +1,12 @@
 import OpenAPIParser from "@readme/openapi-parser"
 import algoliasearch from "algoliasearch"
-import type { ExpandedDocument, Operation } from "../../../../types/openapi"
+import type { ExpandedDocument, Operation } from "../../../types/openapi"
 import path from "path"
-import getPathsOfTag from "../../../../utils/get-paths-of-tag"
+import getPathsOfTag from "../../../utils/get-paths-of-tag"
-import getSectionId from "../../../../utils/get-section-id"
+import getSectionId from "../../../utils/get-section-id"
 import { NextResponse } from "next/server"
 import { JSDOM } from "jsdom"
-import getUrl from "../../../../utils/get-url"
+import getUrl from "../../../utils/get-url"
 import { capitalize } from "docs-ui"
 
 export async function GET() {

www/apps/api-reference/app/api/schema/route.ts

@@ -1,9 +1,9 @@
 import { NextResponse } from "next/server"
-import { SchemaObject } from "../../../../types/openapi"
+import { SchemaObject } from "../../../types/openapi"
 import path from "path"
 import { existsSync, promises as fs } from "fs"
 import { parseDocument } from "yaml"
-import dereference from "../../../../utils/dereference"
+import dereference from "../../../utils/dereference"
 
 export async function GET(request: Request) {
   const { searchParams } = new URL(request.url)

www/apps/api-reference/app/layout.tsx

@@ -1,6 +1,6 @@
-import "../../../globals.css"
+import "./globals.css"
 import Navbar from "@/components/Navbar"
-import Providers from "../../../../providers"
+import Providers from "../providers"
 import { WideLayout } from "docs-ui"
 import { Inter, Roboto_Mono } from "next/font/google"
 import clsx from "clsx"

www/apps/api-reference/app/store/page.tsx

@@ -0,0 +1,42 @@
+import AreaProvider from "@/providers/area"
+import StoreContentV2 from "../_mdx/store.mdx"
+import ClientLibrariesV2 from "../_mdx/client-libraries.mdx"
+import Section from "@/components/Section"
+import Tags from "@/components/Tags"
+import DividedLayout from "@/layouts/Divided"
+import PageTitleProvider from "@/providers/page-title"
+
+const ReferencePage = async () => {
+  return (
+    <AreaProvider area={"store"}>
+      <PageTitleProvider>
+        <h1 className="!text-h2 block lg:hidden">
+          Medusa V2 Store API Reference
+        </h1>
+        <DividedLayout
+          mainContent={
+            <Section>
+              <h1 className="!text-h2 hidden lg:block">
+                Medusa V2 Store API Reference
+              </h1>
+              <StoreContentV2 />
+            </Section>
+          }
+          codeContent={<ClientLibrariesV2 />}
+          className="flex-col-reverse"
+        />
+        <Tags />
+      </PageTitleProvider>
+    </AreaProvider>
+  )
+}
+
+export default ReferencePage
+
+export function generateMetadata() {
+  return {
+    title: `Medusa Store API Reference`,
+    description: `REST API reference for the Medusa store API. This reference includes code snippets and examples for Medusa JS Client and cURL.`,
+    metadataBase: process.env.NEXT_PUBLIC_BASE_URL,
+  }
+}

www/apps/api-reference/app/v2/api/[area]/page.tsx

@@ -1,65 +0,0 @@
-import AreaProvider from "@/providers/area"
-import AdminContentV2 from "../../../_mdx/admin.mdx"
-import StoreContentV2 from "../../../_mdx/store.mdx"
-import ClientLibrariesV2 from "../../../_mdx/client-libraries.mdx"
-import Section from "@/components/Section"
-import Tags from "@/components/Tags"
-import type { Area } from "@/types/openapi"
-import DividedLayout from "@/layouts/Divided"
-import { capitalize } from "docs-ui"
-import PageTitleProvider from "@/providers/page-title"
-
-type ReferencePageProps = {
-  params: {
-    area: Area
-  }
-}
-
-const ReferencePage = async ({ params: { area } }: ReferencePageProps) => {
-  return (
-    <AreaProvider area={area}>
-      <PageTitleProvider>
-        <h1 className="!text-h2 block lg:hidden">
-          Medusa V2 {capitalize(area)} API Reference
-        </h1>
-        <DividedLayout
-          mainContent={
-            <Section>
-              <h1 className="!text-h2 hidden lg:block">
-                Medusa V2 {capitalize(area)} API Reference
-              </h1>
-              {area.includes("admin") && <AdminContentV2 />}
-              {area.includes("store") && <StoreContentV2 />}
-            </Section>
-          }
-          codeContent={<ClientLibrariesV2 />}
-          className="flex-col-reverse"
-        />
-        <Tags />
-      </PageTitleProvider>
-    </AreaProvider>
-  )
-}
-
-export default ReferencePage
-
-export function generateMetadata({ params: { area } }: ReferencePageProps) {
-  return {
-    title: `Medusa ${capitalize(area)} API Reference`,
-    description: `REST API reference for the Medusa ${area} API. This reference includes code snippets and examples for Medusa JS Client and cURL.`,
-    metadataBase: process.env.NEXT_PUBLIC_BASE_URL,
-  }
-}
-
-export const dynamicParams = false
-
-export async function generateStaticParams() {
-  return [
-    {
-      area: "admin",
-    },
-    {
-      area: "store",
-    },
-  ]
-}

www/apps/api-reference/components/Navbar/index.tsx

@@ -22,7 +22,7 @@ const Navbar = () => {
     () =>
       getNavbarItems({
         basePath: config.baseUrl,
-        activePath: pathname,
+        activePath: basePathUrl(pathname),
         version: "v2",
       }),
     [pathname]
@@ -31,8 +31,8 @@ const Navbar = () => {
   return (
     <UiNavbar
       logo={{
-        light: "/images/logo-icon.png",
+        light: basePathUrl("/images/logo-icon.png"),
-        dark: "/images/logo-icon-dark.png",
+        dark: basePathUrl("/images/logo-icon-dark.png"),
       }}
       items={navbarItems}
       mobileMenuButton={{

www/apps/api-reference/components/Tags/Paths/index.tsx

@@ -43,7 +43,7 @@ const TagPaths = ({ tag, className }: TagPathsProps) => {
     paths: PathsObject
   }>(
     !Object.keys(paths).length
-      ? basePathUrl(`/tag?tagName=${tagSlugName}&area=${area}`)
+      ? basePathUrl(`/api/tag?tagName=${tagSlugName}&area=${area}`)
       : null,
     swrFetcher,
     {

www/apps/api-reference/components/Tags/Section/index.tsx

@@ -58,7 +58,7 @@ const TagSection = ({ tag }: TagSectionProps) => {
   }>(
     tag["x-associatedSchema"]
       ? basePathUrl(
-          `/schema?name=${tag["x-associatedSchema"].$ref}&area=${area}`
+          `/api/schema?name=${tag["x-associatedSchema"].$ref}&area=${area}`
         )
       : null,
     swrFetcher,

www/apps/api-reference/components/Tags/index.tsx

@@ -36,7 +36,7 @@ const Tags = () => {
 
   const { data } = useSWR<ExpandedDocument>(
     loadData && !baseSpecs
-      ? basePathUrl(`/base-specs?area=${area}&expand=${expand}`)
+      ? basePathUrl(`/api/base-specs?area=${area}&expand=${expand}`)
       : null,
     swrFetcher,
     {

www/apps/api-reference/next.config.mjs

@@ -3,7 +3,7 @@ import bundleAnalyzer from "@next/bundle-analyzer"
 
 /** @type {import('next').NextConfig} */
 const nextConfig = {
-  // basePath: process.env.NEXT_PUBLIC_BASE_PATH || "/v2",
+  basePath: process.env.NEXT_PUBLIC_BASE_PATH || "/v2/api",
   async rewrites() {
     return {
       fallback: [