Updated with review comments.

Author: dlabaj

src/__tests__/pages/api/__tests__/[version]/icons/[iconName].test.ts

@@ -28,7 +28,7 @@ function createFetchMock(): typeof fetch {
         json: () => Promise.resolve(mockIconsIndex),
       } as Response)
     }
-    const match = url.match(/\/iconsSvgs\/([^/]+)\.json/)
+    const match = url.match(/\/api\/[^/]+\/icons\/([^/]+)\.json/)
     if (match) {
       const setId = match[1]
       const svgs = mockIconSvgs[setId] ?? {}

src/pages/api/[version]/icons/[iconName].ts

@@ -49,7 +49,7 @@ export const GET: APIRoute = async ({ params, url, locals }) => {
     )
   }
 
-  const svgs = await fetchIconSvgs(url, 'pf', assetsFetch)
+  const svgs = await fetchIconSvgs(url, version, 'pf', assetsFetch)
   const svg = svgs?.[reactName] ?? null
 
   if (!svg) {

src/pages/api/[version]/icons/[setId].json.ts

@@ -0,0 +1,42 @@
+import type { APIRoute, GetStaticPaths } from 'astro'
+import { getVersionsFromIndexFile } from '../../../../utils/apiIndex/get'
+import { createJsonResponse } from '../../../../utils/apiHelpers'
+import { getIconSvgsForSet } from '../../../../utils/icons/reactIcons'
+
+/**
+ * Prerender at build time so this doesn't run in the Cloudflare Worker.
+ * getIconSvgsForSet() reads from @patternfly/react-icons/dist/static (Node fs).
+ * Serves JSON of all icon SVGs for a set (e.g. /api/v5/icons/pf.json).
+ */
+export const prerender = true
+
+export const getStaticPaths: GetStaticPaths = async () => {
+  const versions = await getVersionsFromIndexFile()
+  return versions.flatMap((version) => [
+    { params: { version, setId: 'pf' } },
+  ])
+}
+
+export const GET: APIRoute = async ({ params }) => {
+  const { version, setId } = params
+  if (!version) {
+    return createJsonResponse(
+      { error: 'Version parameter is required' },
+      400,
+    )
+  }
+  if (!setId) {
+    return createJsonResponse({ error: 'Set ID is required' }, 400)
+  }
+
+  try {
+    const svgs = await getIconSvgsForSet(setId)
+    return createJsonResponse(svgs)
+  } catch (error) {
+    const details = error instanceof Error ? error.message : String(error)
+    return createJsonResponse(
+      { error: 'Failed to load icon SVGs', details },
+      500,
+    )
+  }
+}

src/pages/iconsSvgs/[setId].json.ts

@@ -52,6 +52,45 @@ export async function getApiIndex(): Promise<ApiIndex> {
   }
 }
 
+/**
+ * Reads only the versions array from the API index file.
+ * Use this when the full index may not be generated yet or has a minimal structure
+ * (e.g. during getStaticPaths for icon routes). Does not validate examples/css.
+ *
+ * @returns Promise resolving to array of version strings (e.g., ['v5', 'v6'])
+ * @throws Error if the index file is missing or has no valid "versions" array
+ */
+export async function getVersionsFromIndexFile(): Promise<string[]> {
+  const outputDir = await getOutputDir()
+  const indexPath = join(outputDir, 'apiIndex.json')
+
+  try {
+    const content = await readFile(indexPath, 'utf-8')
+    const parsed = JSON.parse(content)
+
+    if (!parsed.versions || !Array.isArray(parsed.versions)) {
+      throw new Error(
+        `Invalid API index structure at ${indexPath}: missing or invalid "versions" array`,
+      )
+    }
+
+    return parsed.versions
+  } catch (error) {
+    if ((error as NodeJS.ErrnoException).code === 'ENOENT') {
+      throw new Error(
+        `API index file not found at ${indexPath}. ` +
+          'Please run the build process to generate the index.',
+      )
+    }
+    if (error instanceof SyntaxError) {
+      throw new Error(
+        `API index contains invalid JSON at ${indexPath}. Please rebuild to regenerate the index file.`,
+      )
+    }
+    throw error
+  }
+}
+
 /**
  * Gets all available documentation versions
  *

src/utils/apiIndex/get.ts

@@ -40,15 +40,17 @@ export async function fetchIconsIndex(
  * On Cloudflare, pass assetsFetch so the Worker loads the asset via ASSETS binding.
  *
  * @param url - The URL object from the API route context
+ * @param version - Docs version (e.g. "v5")
  * @param setId - Icon set id (e.g. "pf")
  * @param assetsFetch - Optional; when provided (e.g. locals.runtime.env.ASSETS.fetch on Cloudflare), use it to fetch the asset
  */
 export async function fetchIconSvgs(
   url: URL,
+  version: string,
   setId: string,
   assetsFetch?: AssetsFetcher,
 ): Promise<Record<string, string> | null> {
-  const iconsSvgsUrl = new URL(`/iconsSvgs/${setId}.json`, url.origin)
+  const iconsSvgsUrl = new URL(`/api/${version}/icons/${setId}.json`, url.origin)
   const response = assetsFetch
     ? await assetsFetch(new Request(iconsSvgsUrl))
     : await fetch(iconsSvgsUrl)