version: added to header

Author: gusnips

.github/workflows/github-pages-deploy.yml

@@ -1,5 +1,5 @@
 #!/usr/bin/env bun
-import { readdirSync, writeFileSync } from "fs";
+import { readdirSync, readFileSync, writeFileSync } from "fs";
 import { basename, extname } from "path";
 
 interface DocMetadata {
@@ -16,12 +16,14 @@ interface ExampleMetadata {
 }
 
 interface ContentMetadata {
+  version: string;
   docs: DocMetadata[];
   examples: ExampleMetadata[];
 }
 
 const DOCS_SOURCE = "node_modules/@falai/agent/docs";
 const EXAMPLES_SOURCE = "node_modules/@falai/agent/examples";
+const PACKAGE_JSON = "node_modules/@falai/agent/package.json";
 const OUTPUT_FILE = "src/content-metadata.json";
 
 function slugify(filename: string): string {
@@ -79,10 +81,22 @@ function generateExamplesMetadata(): ExampleMetadata[] {
     .sort((a, b) => a.title.localeCompare(b.title));
 }
 
+function getPackageVersion(): string {
+  try {
+    const packageJson = JSON.parse(readFileSync(PACKAGE_JSON, "utf-8"));
+    return packageJson.version || "unknown";
+  } catch (error) {
+    console.warn("⚠️  Could not read package version", error);
+    return "unknown";
+  }
+}
+
 function generateMetadata() {
   console.log("📝 Generating content metadata...");
 
+  const version = getPackageVersion();
   const metadata: ContentMetadata = {
+    version,
     docs: generateDocsMetadata(),
     examples: generateExamplesMetadata(),
   };
@@ -92,6 +106,7 @@ function generateMetadata() {
   console.log(
     `✅ Generated metadata for ${metadata.docs.length} docs and ${metadata.examples.length} examples`
   );
+  console.log(`📦 Package version: ${version}`);
   console.log(`📄 Written to ${OUTPUT_FILE}`);
 }
 

scripts/generate-content-metadata.ts

@@ -91,6 +91,26 @@ code {
   font-size: 1.75rem;
 }
 
+.logo-text {
+  display: flex;
+  flex-direction: column;
+  gap: 0.125rem;
+}
+
+.version-badge {
+  font-size: 0.625rem;
+  font-weight: 600;
+  color: var(--text-muted);
+  text-transform: uppercase;
+  letter-spacing: 0.05em;
+  padding: 0.125rem 0.375rem;
+  background-color: var(--bg-tertiary);
+  border-radius: 4px;
+  border: 1px solid var(--border-color);
+  align-self: flex-start;
+  margin-top: 0.125rem;
+}
+
 .header-nav {
   display: flex;
   gap: 2rem;

src/App.css

@@ -1,12 +1,16 @@
 import { Link } from "react-router-dom";
+import contentMetadata from "../content-metadata.json";
 
 export function Header() {
   return (
     <header className="header">
       <div className="header-content">
         <Link to="/" className="logo">
           <span className="logo-icon">🤖</span>
-          <span className="logo-text">@falai/agent</span>
+          <span className="logo-text">
+            @falai/agent
+            <span className="version-badge">v{contentMetadata.version}</span>
+          </span>
         </Link>
         <nav className="header-nav">
           <Link to="/#-quick-start">Quick Start</Link>