@f5-sales-demo/docs-theme 4.4.7 → 4.4.9

package/canonical-route-middleware.ts

@@ -1,7 +1,8 @@
 import fs from 'node:fs';
 import { defineRouteMiddleware } from '@astrojs/starlight/route-data';
 import type { ProviderPage } from './src/utils/canonical-provider.ts';
-import { collectionNavigation, providerSections } from './src/utils/canonical-provider.ts';
+import { collectionNavigation } from './src/utils/canonical-provider.ts';
+import { stagedProviderSections } from './src/utils/provider-sections.ts';
 
 let providerNavigation: { collections: Record<string, ProviderPage[]> };
 export const onRequest = defineRouteMiddleware(async (context, next) => {
@@ -12,7 +13,7 @@ export const onRequest = defineRouteMiddleware(async (context, next) => {
     providerNavigation ||= JSON.parse(fs.readFileSync(process.env.PROVIDER_NAVIGATION || '', 'utf8'));
     const metadata = entry.data.xcsh_docs;
     const base = import.meta.env.BASE_URL;
-    const sections = providerSections.map((section) => ({
+    const sections = stagedProviderSections().map((section) => ({
       type: 'link' as const,
       label: section.label,
       href: `${base.replace(/\/$/, '')}/${section.path}/`,

package/components/ProviderReference.astro

@@ -1,6 +1,9 @@
 ---
 import { CardGrid } from '@astrojs/starlight/components';
-import { providerSections } from '../src/utils/canonical-provider';
+import { stagedProviderSections } from '../src/utils/provider-sections';
+
+const providerSections = stagedProviderSections();
+
 import LinkCard from './LinkCard.astro';
 
 const { entry } = Astro.locals.starlightRoute;

package/config.ts

@@ -32,6 +32,7 @@ import {
 import { sidebarTranslations } from './src/i18n/translations.ts';
 import remarkMermaid from './src/plugins/remark-mermaid.mjs';
 import { providerMegaMenu } from './src/utils/canonical-provider.ts';
+import { stagedProviderSections } from './src/utils/provider-sections.ts';
 import { resolveMegaMenuIcon } from './src/utils/resolve-icon.ts';
 import providerSharedAssets from './src/utils/share-provider-assets.mjs';
 import { buildSubcategorySidebar } from './src/utils/subcategory-sidebar.ts';
@@ -712,7 +713,11 @@ export function createF5xcDocsConfig(options: F5xcDocsConfigOptions = {}) {
       console.warn('[docs-theme] OPENAPI_SPECS_CONFIG contains invalid JSON; skipping OpenAPI plugin.', e);
     }
   }
-  const megaMenuItems = options.megaMenuItems || (canonicalProvider ? providerMegaMenu(base) : defaultMegaMenuItems);
+  const megaMenuItems =
+    options.megaMenuItems ||
+    (canonicalProvider
+      ? providerMegaMenu(base, stagedProviderSections(canonicalProvider.manifest))
+      : defaultMegaMenuItems);
   const head = options.head || (canonicalProvider ? [] : defaultHead);
   const logo = options.logo || { src: '@f5-sales-demo/docs-theme/assets/f5-distributed-cloud.svg' };
   const additionalRemarkPlugins = options.additionalRemarkPlugins || [];

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@f5-sales-demo/docs-theme",
-  "version": "4.4.7",
+  "version": "4.4.9",
   "description": "F5 Distributed Cloud branded Starlight documentation theme",
   "type": "module",
   "engines": {

package/src/utils/availability.test.ts

@@ -0,0 +1,25 @@
+import { expect, it } from 'vitest';
+import { availableProviderSections } from './canonical-provider';
+
+it('omits missing historical setup while retaining existing type families', () => {
+  const paths = [
+    'documentation/resources/demo/index.md',
+    'documentation/data-sources/demo/index.md',
+    'documentation/actions/demo/index.md',
+    'documentation/ephemeral-resources/demo/index.md',
+    'documentation/guides/example/index.md',
+  ];
+  expect(availableProviderSections(paths).map((section) => section.path)).toEqual([
+    'guides',
+    'resources',
+    'data-sources',
+    'actions',
+    'ephemeral-resources',
+  ]);
+  expect(availableProviderSections([...paths, 'documentation/provider/setup/index.md'])[0].path).toBe('provider/setup');
+});
+it('does not infer setup from a different provider page or an unrelated folder', () => {
+  expect(
+    availableProviderSections(['documentation/provider/index.md', 'documentation/resources-other/example.md']),
+  ).toEqual([]);
+});

package/src/utils/canonical-provider.ts

@@ -8,6 +8,23 @@ export const providerSections = [
   { label: 'Ephemeral resources', path: 'ephemeral-resources', icon: 'random' },
 ];
 
+export function availableProviderSections(paths: string[]) {
+  const slugs = paths
+    .filter((path) => path.startsWith('documentation/') && /\.mdx?$/.test(path))
+    .map((path) =>
+      path
+        .slice('documentation/'.length)
+        .replace(/(^|\/)index\.mdx?$/, '')
+        .replace(/\.mdx?$/, '')
+        .replace(/\/$/, ''),
+    );
+  return providerSections.filter((section) =>
+    section.path === 'provider/setup'
+      ? slugs.includes(section.path)
+      : slugs.some((slug) => slug === section.path || slug.startsWith(`${section.path}/`)),
+  );
+}
+
 export interface ProviderPage {
   id: string;
   collection_id: string;
@@ -54,7 +71,7 @@ export function collectionNavigation(pages: ProviderPage[], collection: string,
   return (children.get(null) || []).map((page) => tree(page));
 }
 
-export function providerMegaMenu(base: string) {
+export function providerMegaMenu(base: string, sections = providerSections) {
   return [
     {
       label: 'Provider documentation',
@@ -64,7 +81,7 @@ export function providerMegaMenu(base: string) {
         categories: [
           {
             title: 'Terraform xcsh',
-            items: providerSections.map((section) => ({
+            items: sections.map((section) => ({
               label: section.label,
               href: `${base.replace(/\/$/, '')}/${section.path}/`,
             })),

package/src/utils/compact-scopes.mjs

@@ -0,0 +1,20 @@
+import { readdir, readFile, writeFile } from 'node:fs/promises';
+import { join } from 'node:path';
+export async function compactProviderScopes(root) {
+  const files = (await readdir(root, { recursive: true })).filter((name) => /\.(html|css|js)$/.test(name));
+  const names = new Set();
+  for (const file of files) {
+    const text = await readFile(join(root, file), 'utf8');
+    for (const match of text.matchAll(/\bastro-[a-z0-9]{8}\b/g)) names.add(match[0]);
+  }
+  const aliases = new Map([...names].sort().map((name, index) => [name, `f5p${index.toString(36)}`]));
+  let savedBytes = 0;
+  for (const file of files) {
+    const path = join(root, file);
+    const text = await readFile(path, 'utf8');
+    const compact = text.replace(/\bastro-[a-z0-9]{8}\b/g, (name) => aliases.get(name));
+    savedBytes += Buffer.byteLength(text) - Buffer.byteLength(compact);
+    if (text !== compact) await writeFile(path, compact);
+  }
+  return { aliases: aliases.size, savedBytes };
+}

package/src/utils/compact-scopes.test.ts

@@ -0,0 +1,22 @@
+import { mkdtemp, readFile, rm, writeFile } from 'node:fs/promises';
+import { tmpdir } from 'node:os';
+import { join } from 'node:path';
+import { expect, it } from 'vitest';
+import { compactProviderScopes } from './compact-scopes.mjs';
+
+it('keeps generated scope selectors consistent across HTML CSS and JS', async () => {
+  const root = await mkdtemp(join(tmpdir(), 'provider-scope-'));
+  try {
+    await writeFile(join(root, 'page.html'), '<div class="astro-abcdefgh">Reference</div>');
+    await writeFile(join(root, 'page.css'), '.astro-abcdefgh{color:red}');
+    await writeFile(join(root, 'page.js'), 'document.querySelector(".astro-abcdefgh")');
+    const result = await compactProviderScopes(root);
+    expect(result.aliases).toBe(1);
+    expect(await readFile(join(root, 'page.html'), 'utf8')).toBe('<div class="f5p0">Reference</div>');
+    expect(await readFile(join(root, 'page.css'), 'utf8')).toBe('.f5p0{color:red}');
+    expect(await readFile(join(root, 'page.js'), 'utf8')).toContain('.f5p0');
+    expect((await compactProviderScopes(root)).savedBytes).toBe(0);
+  } finally {
+    await rm(root, { recursive: true, force: true });
+  }
+});

package/src/utils/provider-sections.ts

@@ -0,0 +1,17 @@
+import fs from 'node:fs';
+import { availableProviderSections } from './canonical-provider.ts';
+
+const sectionsByManifest = new Map<string, ReturnType<typeof availableProviderSections>>();
+export function stagedProviderSections(manifest = process.env.CANONICAL_MANIFEST || '') {
+  if (!manifest) throw new Error('Canonical provider navigation requires a manifest');
+  let sections = sectionsByManifest.get(manifest);
+  if (!sections) {
+    const data = JSON.parse(fs.readFileSync(manifest, 'utf8'));
+    if (!data.files || typeof data.files !== 'object' || Array.isArray(data.files)) {
+      throw new Error('Canonical provider manifest requires file receipts');
+    }
+    sections = availableProviderSections(Object.keys(data.files));
+    sectionsByManifest.set(manifest, sections);
+  }
+  return sections;
+}

package/src/utils/share-provider-assets.mjs

@@ -2,6 +2,7 @@ import { createHash } from 'node:crypto';
 import { mkdir, readdir, readFile, writeFile } from 'node:fs/promises';
 import { join, posix } from 'node:path';
 import { fileURLToPath } from 'node:url';
+import { compactProviderScopes } from './compact-scopes.mjs';
 
 const hash = (value) => createHash('sha256').update(value).digest('hex').slice(0, 24);
 // Input is Astro-generated HTML. Keep each asset's original execution position
@@ -69,7 +70,8 @@ export async function shareProviderAssets(root, base = '/') {
     await writeFile(join(assetRoot, name), body);
     assetBytes += Buffer.byteLength(body);
   }
-  return { pages: files.length, assets: assets.size, savedBytes: saved - assetBytes };
+  const scopes = await compactProviderScopes(root);
+  return { pages: files.length, assets: assets.size, savedBytes: saved - assetBytes + scopes.savedBytes };
 }
 
 export default function providerSharedAssets() {