@aravindc26/velu 0.11.5 → 0.11.9

package/src/cli.ts

@@ -1,5 +1,5 @@
 import { resolve, join, dirname, delimiter } from "node:path";
-import { existsSync, mkdirSync, writeFileSync, readdirSync, copyFileSync, cpSync, rmSync } from "node:fs";
+import { existsSync, mkdirSync, writeFileSync, readdirSync, copyFileSync, cpSync, rmSync, renameSync, readFileSync } from "node:fs";
 import { spawn } from "node:child_process";
 import { fileURLToPath } from "node:url";
 
@@ -214,7 +214,20 @@ function prepareRuntimeOutDir(docsOutDir: string): string {
   const runtimeOutDir = join(PACKAGE_ROOT, ".velu-out");
   if (samePath(docsOutDir, runtimeOutDir)) return runtimeOutDir;
 
-  rmSync(runtimeOutDir, { recursive: true, force: true });
+  try {
+    rmSync(runtimeOutDir, { recursive: true, force: true });
+  } catch {
+    // On Windows the directory may be locked by a previous dev-server process.
+    // Rename it aside so we can proceed; the stale copy is cleaned up later.
+    const stale = `${runtimeOutDir}-stale-${Date.now()}`;
+    try {
+      renameSync(runtimeOutDir, stale);
+      // Best-effort async cleanup — ignore errors if still locked.
+      try { rmSync(stale, { recursive: true, force: true }); } catch {}
+    } catch {
+      // If even rename fails, try to overwrite in place.
+    }
+  }
   cpSync(docsOutDir, runtimeOutDir, { recursive: true, force: true });
   return runtimeOutDir;
 }
@@ -261,11 +274,153 @@ function exportMarkdownRoutes(outDir: string) {
   console.log(`📝 Exported ${copied} markdown files to static route paths`);
 }
 
+function collectStaticRoutePaths(distDir: string): string[] {
+  const routes = new Set<string>();
+
+  function walk(relDir: string) {
+    const absDir = join(distDir, relDir);
+    const entries = readdirSync(absDir, { withFileTypes: true });
+
+    for (const entry of entries) {
+      if (!entry.isDirectory()) continue;
+      const childRel = relDir ? join(relDir, entry.name) : entry.name;
+      if (existsSync(join(distDir, childRel, "index.html"))) {
+        const normalized = childRel.replace(/\\/g, "/").replace(/^\/+|\/+$/g, "");
+        if (
+          normalized.length > 0 &&
+          !normalized.startsWith("_next") &&
+          !normalized.startsWith("_not-found") &&
+          normalized !== "404" &&
+          !normalized.startsWith("pagefind")
+        ) {
+          routes.add(`/${normalized}`);
+        }
+      }
+      walk(childRel);
+    }
+  }
+
+  walk("");
+  return Array.from(routes).sort((a, b) => a.localeCompare(b));
+}
+
+function collectMarkdownPaths(distDir: string): string[] {
+  const markdownPaths = new Set<string>();
+
+  function walk(relDir: string) {
+    const absDir = join(distDir, relDir);
+    const entries = readdirSync(absDir, { withFileTypes: true });
+    for (const entry of entries) {
+      const relPath = relDir ? join(relDir, entry.name) : entry.name;
+      if (entry.isDirectory()) {
+        walk(relPath);
+        continue;
+      }
+      if (!entry.isFile()) continue;
+      if (!entry.name.toLowerCase().endsWith(".md")) continue;
+      const normalized = relPath.replace(/\\/g, "/").replace(/^\/+/, "");
+      markdownPaths.add(`/${normalized}`);
+    }
+  }
+
+  walk("");
+  return Array.from(markdownPaths).sort((a, b) => a.localeCompare(b));
+}
+
+function addStaticRouteCompatibility(outDir: string) {
+  const distDir = join(outDir, "dist");
+  if (!existsSync(distDir)) return;
+
+  const routes = collectStaticRoutePaths(distDir);
+  if (routes.length === 0) return;
+
+  let aliasCount = 0;
+  for (const route of routes) {
+    const rel = route.replace(/^\/+/, "");
+    const src = join(distDir, rel, "index.html");
+    const htmlAlias = join(distDir, `${rel}.html`);
+    if (existsSync(src) && !existsSync(htmlAlias)) {
+      copyFileSync(src, htmlAlias);
+      aliasCount += 1;
+    }
+  }
+
+  const fallbackPath = join(distDir, "404.html");
+  if (existsSync(fallbackPath)) {
+    const html = readFileSync(fallbackPath, "utf-8");
+    if (!html.includes("velu-noslash-fallback")) {
+      const script = [
+        '<script id="velu-noslash-fallback">',
+        "(function(){",
+        "  try {",
+        `    var routes = new Set(${JSON.stringify(routes)});`,
+        "    var path = (window.location && window.location.pathname ? window.location.pathname : '/').replace(/\\/+$/, '');",
+        "    if (!path || path === '/') return;",
+        "    if (/\\.[a-zA-Z0-9]+$/.test(path)) return;",
+        "    if (!routes.has(path)) return;",
+        "    var search = window.location.search || '';",
+        "    var hash = window.location.hash || '';",
+        "    window.location.replace(path + '/' + search + hash);",
+        "  } catch (_) {}",
+        "})();",
+        "</script>",
+      ].join("");
+      const patched = html.includes("</body>") ? html.replace("</body>", `${script}</body>`) : `${html}\n${script}\n`;
+      writeFileSync(fallbackPath, patched, "utf-8");
+    }
+  }
+
+  const redirectsPath = join(distDir, "_redirects");
+  const existingRedirects = existsSync(redirectsPath) ? readFileSync(redirectsPath, "utf-8") : "";
+  const existingLines = new Set(existingRedirects.split(/\r?\n/).map((line) => line.trim()).filter(Boolean));
+  const redirectLines = routes.map((route) => `${route}  ${route}/  301`);
+  let redirectAdded = 0;
+  for (const line of redirectLines) {
+    if (existingLines.has(line)) continue;
+    existingLines.add(line);
+    redirectAdded += 1;
+  }
+  if (redirectAdded > 0) {
+    const merged = Array.from(existingLines).join("\n") + "\n";
+    writeFileSync(redirectsPath, merged, "utf-8");
+  }
+
+  const mdPaths = collectMarkdownPaths(distDir);
+  if (mdPaths.length > 0) {
+    const headersPath = join(distDir, "_headers");
+    let mergedHeaders = existsSync(headersPath) ? readFileSync(headersPath, "utf-8") : "";
+    let headerAdded = 0;
+
+    for (const mdPath of mdPaths) {
+      const block = [
+        mdPath,
+        "  Content-Type: text/markdown; charset=utf-8",
+        "  Content-Disposition: inline",
+        "  X-Content-Type-Options: nosniff",
+        "",
+      ].join("\n");
+      if (mergedHeaders.includes(block)) continue;
+      if (mergedHeaders.length > 0 && !mergedHeaders.endsWith("\n")) mergedHeaders += "\n";
+      if (mergedHeaders.length > 0) mergedHeaders += "\n";
+      mergedHeaders += block;
+      headerAdded += 1;
+    }
+
+    if (headerAdded > 0) {
+      writeFileSync(headersPath, mergedHeaders.replace(/\n{3,}/g, "\n\n").trimEnd() + "\n", "utf-8");
+    }
+    console.log(`📄 Added inline markdown headers for ${mdPaths.length} .md routes`);
+  }
+
+  console.log(`🔁 Added static compatibility for ${routes.length} routes (${aliasCount} .html aliases, ${redirectAdded} redirects)`);
+}
+
 async function buildSite(docsDir: string) {
   const docsOutDir = await generateProject(docsDir);
   const runtimeOutDir = prepareRuntimeOutDir(docsOutDir);
   await buildStatic(runtimeOutDir, docsDir);
   exportMarkdownRoutes(runtimeOutDir);
+  addStaticRouteCompatibility(runtimeOutDir);
 
   if (!samePath(docsOutDir, runtimeOutDir)) {
     const docsDistDir = join(docsOutDir, "dist");

package/src/engine/app/(docs)/[...slug]/layout.tsx

@@ -4,6 +4,7 @@ import type { LinkItemType } from 'fumadocs-ui/layouts/shared';
 import { baseOptions } from '@/lib/layout.shared';
 import { source } from '@/lib/source';
 import {
+  getDropdownOptions,
   getIconLibrary,
   getLanguages,
   getVersionOptions,
@@ -15,6 +16,7 @@ import {
 import { SidebarLinks } from '@/components/sidebar-links';
 import { ProductSwitcher } from '@/components/product-switcher';
 import { VeluIcon } from '@/components/icon';
+import { HeaderTabLink } from '@/components/header-tab-link';
 
 interface LayoutParams {
   slug?: string[];
@@ -41,6 +43,26 @@ interface PageTreeFolderNode {
   children?: unknown[];
 }
 
+function withTrailingSlashUrl(url: string): string {
+  const trimmed = url.trim();
+  if (trimmed.length === 0) return trimmed;
+  if (/^(https?:|mailto:|tel:|#)/i.test(trimmed)) return trimmed;
+
+  const hashIndex = trimmed.indexOf('#');
+  const queryIndex = trimmed.indexOf('?');
+  const endIndex = [hashIndex, queryIndex].filter((index) => index >= 0).sort((a, b) => a - b)[0] ?? trimmed.length;
+  const path = trimmed.slice(0, endIndex);
+  const suffix = trimmed.slice(endIndex);
+
+  if (!path.startsWith('/')) return trimmed;
+  if (path === '/' || path.endsWith('/')) return `${path}${suffix}`;
+
+  const lastSegment = path.split('/').filter(Boolean).pop() ?? '';
+  if (lastSegment.includes('.')) return trimmed;
+
+  return `${path}/${suffix}`;
+}
+
 function resolveLocale(slugInput: string[] | undefined): string {
   const languages = getLanguages();
   const defaultLanguage = languages[0] ?? 'en';
@@ -122,6 +144,10 @@ function renderIconsInTree<T>(node: T, iconLibrary: 'fontawesome' | 'lucide' | '
       out[key] = <VeluIcon name={value} iconType={iconType} library={iconLibrary} fallback={false} />;
       continue;
     }
+    if (key === 'url' && typeof value === 'string') {
+      out[key] = withTrailingSlashUrl(value);
+      continue;
+    }
     out[key] = renderIconsInTree(value, iconLibrary);
   }
   return out as T;
@@ -198,12 +224,54 @@ function normalizePath(value: string): string {
   return value.replace(/^\/+|\/+$/g, '').toLowerCase();
 }
 
+function normalizeSidebarTabUrl(url: string): string {
+  const trimmed = url.trim();
+  if (trimmed.length <= 1) return trimmed;
+  return trimmed.endsWith('/') ? trimmed.slice(0, -1) : trimmed;
+}
+
 function basename(value: string): string {
   const normalized = normalizePath(value);
   const parts = normalized.split('/').filter(Boolean);
   return parts[parts.length - 1] ?? normalized;
 }
 
+function collectPageUrls(tree: unknown, out: Set<string> = new Set<string>()): Set<string> {
+  if (!tree || typeof tree !== 'object') return out;
+
+  const node = tree as {
+    type?: string;
+    url?: unknown;
+    external?: unknown;
+    index?: { url?: unknown };
+    children?: unknown[];
+  };
+
+  if (node.type === 'page' && node.external !== true && typeof node.url === 'string' && node.url.length > 0) {
+    out.add(normalizeSidebarTabUrl(node.url));
+  }
+
+  if (node.type === 'folder' && typeof node.index?.url === 'string' && node.index.url.length > 0) {
+    out.add(normalizeSidebarTabUrl(node.index.url));
+  }
+
+  if (Array.isArray(node.children)) {
+    for (const child of node.children) collectPageUrls(child, out);
+  }
+
+  return out;
+}
+
+function doesUrlBelongToTab(url: string, tabSlug: string): boolean {
+  const normalizedUrl = normalizePath(url);
+  const normalizedTab = normalizePath(tabSlug);
+  if (!normalizedUrl || !normalizedTab) return false;
+  return normalizedUrl === normalizedTab
+    || normalizedUrl.startsWith(`${normalizedTab}/`)
+    || normalizedUrl.includes(`/${normalizedTab}/`)
+    || normalizedUrl.endsWith(`/${normalizedTab}`);
+}
+
 function resolveMenuTargetUrl(menuPages: string[], tabUrls: Set<string>): string | undefined {
   const urls = Array.from(tabUrls);
   if (urls.length === 0) return undefined;
@@ -247,6 +315,49 @@ function resolveMenuLinksForTab(
   return best;
 }
 
+function withPrefixedPath(url: string, prefix?: string): string {
+  const normalizedPrefix = (prefix ?? '').trim().replace(/^\/+|\/+$/g, '');
+  if (!normalizedPrefix) return url;
+  if (/^(https?:|mailto:|tel:|#)/i.test(url)) return url;
+
+  const hashIndex = url.indexOf('#');
+  const queryIndex = url.indexOf('?');
+  const endIndex = [hashIndex, queryIndex].filter((index) => index >= 0).sort((a, b) => a - b)[0] ?? url.length;
+  const path = url.slice(0, endIndex);
+  const suffix = url.slice(endIndex);
+  if (!path.startsWith('/')) return url;
+
+  const prefixed = path === '/'
+    ? `/${normalizedPrefix}`
+    : path.startsWith(`/${normalizedPrefix}/`) || path === `/${normalizedPrefix}`
+      ? path
+      : `/${normalizedPrefix}${path}`;
+
+  return `${prefixed}${suffix}`;
+}
+
+function resolveRequestPathPrefix(
+  slugInput: string[] | undefined,
+  tabs: Array<{ url: string }>,
+): string | undefined {
+  const slug = (slugInput ?? []).map((segment) => segment.trim().toLowerCase()).filter(Boolean);
+  if (slug.length < 2) return undefined;
+
+  const tabRoots = new Set(
+    tabs
+      .map((tab) => normalizePath(tab.url).split('/').filter(Boolean)[0] ?? '')
+      .map((segment) => segment.toLowerCase())
+      .filter((segment) => segment.length > 0),
+  );
+
+  const first = slug[0] ?? '';
+  const second = slug[1] ?? '';
+  if (!first || !second) return undefined;
+  if (tabRoots.has(first)) return undefined;
+  if (tabRoots.has(second)) return first;
+  return undefined;
+}
+
 function scopeTreeToTab<T extends { children?: unknown[] }>(
   tree: T,
   tabSlug?: string,
@@ -317,22 +428,69 @@ function scopeTreeToTab<T extends { children?: unknown[] }>(
   return { ...tree, children: scopedChildren } as T;
 }
 
+function flattenSingleRootFolder<T extends { children?: unknown[] }>(tree: T): T {
+  const topChildren = Array.isArray(tree.children) ? tree.children : [];
+  if (topChildren.length === 0) return tree;
+
+  const rootFolders = topChildren.filter((child) => {
+    const node = child as PageTreeFolderNode;
+    return node?.type === 'folder' && node.root === true;
+  }) as PageTreeFolderNode[];
+
+  if (rootFolders.length !== 1) return tree;
+  const rootFolder = rootFolders[0];
+  const rootChildren = Array.isArray(rootFolder.children) ? rootFolder.children : [];
+  if (rootChildren.length === 0) return tree;
+
+  const nonRootChildren = topChildren.filter((child) => child !== rootFolder);
+  return { ...tree, children: [...rootChildren, ...nonRootChildren] } as T;
+}
+
 export default async function SlugLayout({ children, params }: SlugLayoutProps) {
   const resolvedParams = await params;
   const locale = resolveLocale(resolvedParams.slug);
+  const localePageTree = source.getPageTree(locale);
   const versions = getVersionOptions();
   const products = getProductOptions();
+  const dropdowns = getDropdownOptions();
   const iconLibrary = getIconLibrary();
   const currentVersion = resolveCurrentVersion(resolvedParams.slug, versions);
   const currentProduct = resolveCurrentProduct(resolvedParams.slug, products);
   const { containerSlug, tabSlug: currentTabSlug } = resolveTabContext(resolvedParams.slug);
   const activePrefix = currentVersion?.slug ?? currentProduct?.slug;
-  const containerScopedTree = filterTreeBySlugPrefix(source.getPageTree(locale), activePrefix);
+  const containerScopedTree = filterTreeBySlugPrefix(localePageTree, activePrefix);
   const rawTree = scopeTreeToTab(containerScopedTree, currentTabSlug, containerSlug);
-  const navbarTabs = buildNavbarTabs(source.getPageTree(locale)) ?? [];
+  const activeTree = dropdowns.length > 0 ? flattenSingleRootFolder(rawTree) : rawTree;
+  const navbarTabs = buildNavbarTabs(localePageTree) ?? [];
+  const allPageUrls = collectPageUrls(localePageTree);
+  const requestPathPrefix = resolveRequestPathPrefix(resolvedParams.slug, navbarTabs);
   const tabMenuDefinitions = getTabMenuDefinitions();
-  const tree = renderIconsInTree(rawTree, iconLibrary);
+  const tree = renderIconsInTree(activeTree, iconLibrary);
   const base = baseOptions();
+  const dropdownTabs = dropdowns.map((dropdown) => {
+    const defaultUrl = withTrailingSlashUrl(dropdown.defaultPath);
+    const matchingUrls = Array.from(allPageUrls).filter((url) => (
+      doesUrlBelongToTab(url, dropdown.slug)
+      || dropdown.tabSlugs.some((tabSlug) => doesUrlBelongToTab(url, tabSlug))
+    ));
+    const urls = new Set<string>(matchingUrls);
+    urls.add(normalizeSidebarTabUrl(defaultUrl));
+
+    return {
+      url: defaultUrl,
+      urls,
+      title: dropdown.dropdown,
+      description: dropdown.description,
+      icon: dropdown.icon ? (
+        <VeluIcon
+          name={dropdown.icon}
+          iconType={dropdown.iconType}
+          library={iconLibrary}
+          fallback={false}
+        />
+      ) : undefined,
+    };
+  });
   const headerTabLinks: LinkItemType[] = navbarTabs
     .map((tab): LinkItemType | null => {
       const tabText = typeof tab.title === 'string' ? tab.title : '';
@@ -347,22 +505,27 @@ export default async function SlugLayout({ children, params }: SlugLayoutProps)
         return {
           type: 'menu',
           text: tabText,
-          url: tab.url,
+          url: withTrailingSlashUrl(withPrefixedPath(tab.url, requestPathPrefix)),
           active: 'nested-url',
           secondary: false,
           items: menuLinks.map((item) => ({
             text: item.text,
-            url: item.url,
+            url: withTrailingSlashUrl(withPrefixedPath(item.url, requestPathPrefix)),
             active: 'nested-url',
           })),
         };
       }
 
       return {
-        text: tabText,
-        url: tab.url,
-        active: 'nested-url',
+        type: 'custom',
         secondary: false,
+        children: (
+          <HeaderTabLink
+            text={tabText}
+            href={withTrailingSlashUrl(withPrefixedPath(tab.url, requestPathPrefix))}
+            urls={Array.from(tab.urls).map((url) => withTrailingSlashUrl(withPrefixedPath(url, requestPathPrefix)))}
+          />
+        ),
       };
     })
     .filter((link): link is LinkItemType => link !== null);
@@ -371,12 +534,15 @@ export default async function SlugLayout({ children, params }: SlugLayoutProps)
     <DocsLayout
       tree={tree}
       sidebar={{
+        tabs: dropdownTabs.length > 0 ? dropdownTabs : undefined,
         collapsible: true,
-        banner: products.length > 1 ? (
-          <div className="velu-sidebar-banner">
-            <ProductSwitcher products={products} iconLibrary={iconLibrary} />
-          </div>
-        ) : undefined,
+        banner: products.length > 1
+          ? (
+            <div className="velu-sidebar-banner">
+              <ProductSwitcher products={products} iconLibrary={iconLibrary} />
+            </div>
+          )
+          : undefined,
         footer: ({ className, children, ...props }: any) => (
           <div
             className={['velu-sidebar-footer-shell', className].filter(Boolean).join(' ')}

package/src/engine/app/(docs)/[...slug]/page.tsx

@@ -1,6 +1,6 @@
 import type { Metadata } from 'next';
 import { notFound } from 'next/navigation';
-import { readFile } from 'node:fs/promises';
+import { readFile, stat } from 'node:fs/promises';
 import { join } from 'node:path';
 import { parse as parseYaml } from 'yaml';
 import { createRelativeLink } from 'fumadocs-ui/mdx';
@@ -14,13 +14,26 @@ import { getMDXComponents } from '@/mdx-components';
 import { source } from '@/lib/source';
 import { VeluManualApiPlayground } from '@/components/manual-api-playground';
 import { VeluOpenAPI, VeluOpenAPISchema } from '@/components/openapi';
-import { getApiConfig, getLanguages, getVersionOptions, getProductOptions, getSeoConfig, getSiteName, getSiteOrigin } from '@/lib/velu';
+import {
+  getApiConfig,
+  getContextualOptions,
+  getFooterSocials,
+  getLanguages,
+  getMetadataConfig,
+  getVersionOptions,
+  getProductOptions,
+  getSeoConfig,
+  getSiteDescription,
+  getSiteName,
+  getSiteOrigin,
+} from '@/lib/velu';
 import { CopyPageButton } from '@/components/copy-page';
 import { ChangelogFilters } from '@/components/changelog-filters';
 import { VeluImageZoomFallback } from '@/components/image-zoom-fallback';
 import { OpenApiTocSync } from '@/components/openapi-toc-sync';
 import { TocExamples } from '@/components/toc-examples';
 import { PageFeedback } from '@/components/page-feedback';
+import { VeluIcon } from '@/components/icon';
 import { parseChangelogFromMarkdown, parseFrontmatterBoolean } from '@/lib/changelog';
 
 interface RouteParams {
@@ -58,7 +71,12 @@ interface InlineApiDoc {
   method: string;
 }
 
-async function loadMarkdownForSlug(slug: string[], locale: string, hasI18n: boolean): Promise<string | undefined> {
+interface LoadedMarkdown {
+  content: string;
+  modifiedAt?: Date;
+}
+
+async function loadMarkdownForSlug(slug: string[], locale: string, hasI18n: boolean): Promise<LoadedMarkdown | undefined> {
   const rel = slug.join('/');
   const docsRoots = [
     join(process.cwd(), 'content', 'docs'),
@@ -71,7 +89,12 @@ async function loadMarkdownForSlug(slug: string[], locale: string, hasI18n: bool
 
   for (const filePath of paths) {
     try {
-      return await readFile(filePath, 'utf-8');
+      const content = await readFile(filePath, 'utf-8');
+      const stats = await stat(filePath).catch(() => null);
+      return {
+        content,
+        modifiedAt: stats?.mtime,
+      };
     } catch {
       // ignore and continue
     }
@@ -80,6 +103,14 @@ async function loadMarkdownForSlug(slug: string[], locale: string, hasI18n: bool
   return undefined;
 }
 
+function formatLastModifiedDate(value: Date): string {
+  return new Intl.DateTimeFormat('en-US', {
+    month: 'long',
+    day: 'numeric',
+    year: 'numeric',
+  }).format(value);
+}
+
 function resolveLocaleSlug(slugInput: string[] | undefined) {
   const languages = getLanguages();
   const defaultLanguage = languages[0] ?? 'en';
@@ -215,6 +246,13 @@ function normalizeDocPath(value: string): string {
   return collapsed;
 }
 
+function withTrailingSlashPath(path: string): string {
+  if (!path.startsWith('/')) return path;
+  if (path === '/' || path.endsWith('/')) return path;
+  if (/\.[a-zA-Z0-9]+$/.test(path)) return path;
+  return `${path}/`;
+}
+
 function toAbsoluteMetaUrl(origin: string, value: string): string {
   const trimmed = value.trim();
   if (!trimmed) return trimmed;
@@ -548,9 +586,11 @@ function buildInlineApiDoc(
 
 export default async function Page({ params }: PageProps) {
   const resolvedParams = await params;
+  const metadataConfig = getMetadataConfig();
   const { locale, pageSlug } = resolveLocaleSlug(resolvedParams.slug);
   const { locale: filterLocale, version, product } = resolveContextFromSlug(resolvedParams.slug);
   const hasI18n = getLanguages().length > 1;
+  const footerSocials = getFooterSocials();
 
   const page = hasI18n ? source.getPage(pageSlug, locale) : source.getPage(pageSlug);
 
@@ -559,7 +599,11 @@ export default async function Page({ params }: PageProps) {
   const pageDataRecord = (page.data as unknown) as Record<string, unknown>;
   const MDX = pageDataRecord.body as any;
   if (typeof MDX !== 'function') notFound();
-  const sourceMarkdown = await loadMarkdownForSlug(pageSlug, locale, hasI18n);
+  const loadedMarkdown = await loadMarkdownForSlug(pageSlug, locale, hasI18n);
+  const sourceMarkdown = loadedMarkdown?.content;
+  const lastModifiedLabel = metadataConfig.timestamp && loadedMarkdown?.modifiedAt
+    ? formatLastModifiedDate(loadedMarkdown.modifiedAt)
+    : undefined;
   const dataMarkdown = typeof pageDataRecord.processedMarkdown === 'string'
     ? String(pageDataRecord.processedMarkdown)
     : undefined;
@@ -614,7 +658,7 @@ export default async function Page({ params }: PageProps) {
   const pageUrl = (typeof sourcePageUrl === 'string' && sourcePageUrl.trim())
     ? sourcePageUrl
     : (fallbackPath === '' ? '/' : fallbackPath);
-  const rssHref = `${pageUrl.replace(/\/$/, '') || ''}/rss.xml`;
+  const rssHref = `${withTrailingSlashPath(pageUrl).replace(/\/$/, '') || ''}/rss.xml`;
   const shouldReplaceTocWithApiExample = !hasExplicitApiRendering && Boolean(inlineApiDoc) && playgroundDisplay === 'interactive';
   const shouldShowOpenApiExampleInToc = !hasExplicitApiRendering && !parsedApiFrontmatter && Boolean(parsedOpenApiFrontmatter);
   const hasApiTocRail = shouldReplaceTocWithApiExample || shouldShowOpenApiExampleInToc;
@@ -673,7 +717,7 @@ export default async function Page({ params }: PageProps) {
             {isDeprecatedPage ? <span className="velu-pill velu-pill-deprecated velu-page-deprecated-badge">Deprecated</span> : null}
           </div>
           <div className="velu-title-actions">
-            <CopyPageButton />
+            <CopyPageButton options={getContextualOptions()} mcpUrl={getSiteOrigin() + '/mcp'} />
             {showRssButton ? (
               <a className="velu-rss-button" href={rssHref} aria-label="Subscribe to this changelog RSS feed">
                 <svg viewBox="0 0 24 24" fill="none" stroke="currentColor" strokeWidth="2" strokeLinecap="round" strokeLinejoin="round" aria-hidden="true">
@@ -686,6 +730,9 @@ export default async function Page({ params }: PageProps) {
           </div>
         </div>
         {page.data.description ? <DocsDescription>{page.data.description}</DocsDescription> : null}
+        {lastModifiedLabel ? (
+          <p className="velu-page-last-updated">Last updated {lastModifiedLabel}</p>
+        ) : null}
         <DocsBody>
           {!hasExplicitApiRendering && inlineApiDoc && playgroundDisplay === 'interactive' ? (
             <VeluOpenAPI
@@ -741,7 +788,7 @@ export default async function Page({ params }: PageProps) {
           {(previousPage || nextPage) ? (
             <div className={['velu-page-nav-grid', previousPage && nextPage ? 'velu-page-nav-grid-two' : 'velu-page-nav-grid-one'].join(' ')}>
               {previousPage ? (
-                <a href={previousPage.url} className="velu-page-nav-card">
+                <a href={withTrailingSlashPath(previousPage.url)} className="velu-page-nav-card">
                   <p className="velu-page-nav-title">{previousPage.data.title}</p>
                   <p className="velu-page-nav-meta">
                     <svg viewBox="0 0 24 24" aria-hidden="true"><path d="M15 18l-6-6 6-6" /></svg>
@@ -750,7 +797,7 @@ export default async function Page({ params }: PageProps) {
                 </a>
               ) : null}
               {nextPage ? (
-                <a href={nextPage.url} className="velu-page-nav-card velu-page-nav-card-next">
+                <a href={withTrailingSlashPath(nextPage.url)} className="velu-page-nav-card velu-page-nav-card-next">
                   <p className="velu-page-nav-title">{nextPage.data.title}</p>
                   <p className="velu-page-nav-meta velu-page-nav-meta-next">
                     <span>{nextPage.data.description ?? 'Next'}</span>
@@ -763,7 +810,34 @@ export default async function Page({ params }: PageProps) {
         </section>
       </div>
       <footer className="velu-footer">
-        Powered by <a href="https://getvelu.com" target="_blank" rel="noopener noreferrer">Velu</a>
+        {footerSocials.length > 0 ? (
+          <div className="velu-footer-socials" aria-label="Social links">
+            {footerSocials.map((social) => (
+              <a
+                key={`${social.key}:${social.href}`}
+                href={social.href}
+                target="_blank"
+                rel="noopener noreferrer"
+                className="velu-footer-social-link"
+                aria-label={social.label}
+                title={social.label}
+              >
+                <VeluIcon
+                  name={social.icon}
+                  iconType={social.iconType}
+                  library="fontawesome"
+                  className="velu-footer-social-icon"
+                  fallback={false}
+                />
+              </a>
+            ))}
+          </div>
+        ) : (
+          <span />
+        )}
+        <div className="velu-footer-powered">
+          Powered by <a href="https://getvelu.com" target="_blank" rel="noopener noreferrer">Velu</a>
+        </div>
       </footer>
     </DocsPage>
   );
@@ -797,7 +871,8 @@ export async function generateMetadata({ params }: PageProps): Promise<Metadata>
 
   if (!page) notFound();
 
-  const sourceMarkdown = await loadMarkdownForSlug(pageSlug, locale, hasI18n);
+  const loadedMarkdown = await loadMarkdownForSlug(pageSlug, locale, hasI18n);
+  const sourceMarkdown = loadedMarkdown?.content;
   const pageDataRecord = (page.data as unknown) as Record<string, unknown>;
   const dataMarkdown = typeof pageDataRecord.processedMarkdown === 'string'
     ? String(pageDataRecord.processedMarkdown)
@@ -828,7 +903,7 @@ export async function generateMetadata({ params }: PageProps): Promise<Metadata>
     || (mergedMetatags.robots ?? '').toLowerCase().includes('none');
   const titleOverride = mergedMetatags.title?.trim();
   const resolvedTitle = titleOverride || `${page.data.title} - ${siteName}`;
-  const resolvedDescription = (mergedMetatags.description?.trim() || page.data.description || '').trim() || undefined;
+  const resolvedDescription = (mergedMetatags.description?.trim() || page.data.description || getSiteDescription() || '').trim() || undefined;
   const generatedSocialImage = buildGeneratedOgImagePath(pageUrl);
   const fallbackImage = mergedMetatags['og:image']
     || mergedMetatags['twitter:image']