jamdesk 1.0.0

package/vendored/app/api/og/route.tsx

@@ -0,0 +1,167 @@
+import { ImageResponse } from '@vercel/og';
+import { NextRequest } from 'next/server';
+
+export const runtime = 'edge';
+
+/**
+ * OG Image Generator
+ *
+ * Generates branded Open Graph images for documentation sites.
+ *
+ * Query Parameters:
+ * - title: Page title (required)
+ * - description: Page description (optional)
+ * - section: Section/group name (optional, e.g., "Get Started")
+ * - siteName: Site name (optional, defaults to "Documentation")
+ * - logo: URL to the project's logo (optional)
+ * - theme: "light" or "dark" (optional, defaults to "dark")
+ *
+ * Example:
+ * /api/og?title=Introduction&section=Get%20Started&siteName=Acme%20Docs&logo=https://...
+ */
+export async function GET(request: NextRequest) {
+  const searchParams = request.nextUrl.searchParams;
+
+  const title = searchParams.get('title') || 'Documentation';
+  const description = searchParams.get('description') || '';
+  const section = searchParams.get('section') || '';
+  const siteName = searchParams.get('siteName') || 'Documentation';
+  const logo = searchParams.get('logo') || '';
+  const theme = searchParams.get('theme') || 'dark';
+
+  const isDark = theme === 'dark';
+
+  // Colors based on theme
+  const bgColor = isDark ? '#0f0f23' : '#ffffff';
+  const textColor = isDark ? '#ffffff' : '#1a1a2e';
+  const mutedColor = isDark ? '#a0a0b0' : '#666680';
+  const accentColor = '#8B5CF6'; // Jamdesk purple
+  const gradientStart = isDark ? '#1a1a3e' : '#f8f8fc';
+  const gradientEnd = isDark ? '#0f0f23' : '#ffffff';
+
+  return new ImageResponse(
+    (
+      <div
+        style={{
+          height: '100%',
+          width: '100%',
+          display: 'flex',
+          flexDirection: 'column',
+          padding: '60px',
+          background: `linear-gradient(135deg, ${gradientStart} 0%, ${gradientEnd} 100%)`,
+          fontFamily: 'system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif',
+        }}
+      >
+        {/* Top bar with logo and site name */}
+        <div
+          style={{
+            display: 'flex',
+            alignItems: 'center',
+            marginBottom: '40px',
+          }}
+        >
+          {logo && (
+            <img
+              src={logo}
+              alt=""
+              width={40}
+              height={40}
+              style={{
+                marginRight: '16px',
+                borderRadius: '8px',
+              }}
+            />
+          )}
+          <span
+            style={{
+              fontSize: '24px',
+              fontWeight: 600,
+              color: mutedColor,
+              textTransform: 'uppercase',
+              letterSpacing: '0.05em',
+            }}
+          >
+            {siteName}
+          </span>
+        </div>
+
+        {/* Section badge */}
+        {section && (
+          <div
+            style={{
+              display: 'flex',
+              marginBottom: '20px',
+            }}
+          >
+            <span
+              style={{
+                fontSize: '18px',
+                fontWeight: 500,
+                color: accentColor,
+                padding: '8px 16px',
+                background: isDark ? 'rgba(139, 92, 246, 0.15)' : 'rgba(139, 92, 246, 0.1)',
+                borderRadius: '20px',
+              }}
+            >
+              {section}
+            </span>
+          </div>
+        )}
+
+        {/* Main title */}
+        <div
+          style={{
+            display: 'flex',
+            flex: 1,
+            flexDirection: 'column',
+            justifyContent: 'center',
+          }}
+        >
+          <h1
+            style={{
+              fontSize: title.length > 40 ? '52px' : '64px',
+              fontWeight: 700,
+              color: textColor,
+              lineHeight: 1.2,
+              margin: 0,
+              maxWidth: '900px',
+            }}
+          >
+            {title}
+          </h1>
+
+          {description && (
+            <p
+              style={{
+                fontSize: '28px',
+                color: mutedColor,
+                marginTop: '24px',
+                lineHeight: 1.4,
+                maxWidth: '800px',
+              }}
+            >
+              {description.length > 120
+                ? description.substring(0, 120) + '...'
+                : description}
+            </p>
+          )}
+        </div>
+
+        {/* Bottom accent bar */}
+        <div
+          style={{
+            display: 'flex',
+            height: '6px',
+            background: `linear-gradient(90deg, ${accentColor} 0%, #C4B5FD 50%, #A78BFA 100%)`,
+            borderRadius: '3px',
+            marginTop: '40px',
+          }}
+        />
+      </div>
+    ),
+    {
+      width: 1200,
+      height: 630,
+    }
+  );
+}

package/vendored/app/api/r2/[project]/[...path]/route.ts

@@ -0,0 +1,214 @@
+/**
+ * R2 Proxy API Route
+ *
+ * Fetches project files from Cloudflare R2 and streams them to the client.
+ * This is called by middleware for all project subdomains.
+ *
+ * This route only runs on Vercel in production (ISR mode).
+ */
+
+import { NextRequest, NextResponse } from 'next/server';
+import { getFileFromR2 } from '@/lib/r2';
+
+export const runtime = 'nodejs'; // Use Node.js runtime for AWS SDK
+export const dynamic = 'force-dynamic'; // Always run dynamically
+
+// Dynamic route params type for Next.js 15+
+type RouteParams = {
+  params: Promise<{ project: string; path: string[] }>;
+};
+
+// Content type mapping with proper charset
+const CONTENT_TYPES: Record<string, string> = {
+  html: 'text/html; charset=utf-8',
+  css: 'text/css; charset=utf-8',
+  js: 'application/javascript; charset=utf-8',
+  json: 'application/json; charset=utf-8',
+  png: 'image/png',
+  jpg: 'image/jpeg',
+  jpeg: 'image/jpeg',
+  gif: 'image/gif',
+  svg: 'image/svg+xml; charset=utf-8',
+  webp: 'image/webp',
+  woff: 'font/woff',
+  woff2: 'font/woff2',
+  ttf: 'font/ttf',
+  txt: 'text/plain; charset=utf-8',
+  mdx: 'text/markdown; charset=utf-8',
+  xml: 'application/xml; charset=utf-8',
+  ico: 'image/x-icon',
+  map: 'application/json',
+};
+
+function getContentType(filePath: string): string {
+  const ext = filePath.split('.').pop()?.toLowerCase() || '';
+  return CONTENT_TYPES[ext] || 'application/octet-stream';
+}
+
+// Cache headers - long cache for immutable assets, shorter for HTML
+function getCacheControl(filePath: string): string {
+  const isImmutable = filePath.includes('/_next/') || filePath.includes('/static/');
+  return isImmutable
+    ? 'public, max-age=31536000, immutable'  // 1 year for hashed assets
+    : 'public, max-age=3600, s-maxage=86400'; // 1 hour client, 1 day CDN for HTML
+}
+
+export async function GET(
+  request: NextRequest,
+  { params }: RouteParams
+) {
+  const { project, path } = await params;
+  const filePath = '/' + (path?.join('/') || 'index.html');
+
+  try {
+    const stream = await getFileFromR2(project, filePath);
+
+    if (!stream) {
+      // Try to serve the project's 404 page instead of plain text
+      const notFoundPage = await getFileFromR2(project, '/404.html');
+
+      if (notFoundPage) {
+        return new NextResponse(notFoundPage as any, {
+          status: 404,
+          headers: {
+            'Content-Type': 'text/html; charset=utf-8',
+            'Cache-Control': 'no-cache',
+          },
+        });
+      }
+
+      // Fallback to simple 404 if project's 404.html doesn't exist
+      return new NextResponse(get404Html(project), {
+        status: 404,
+        headers: {
+          'Content-Type': 'text/html; charset=utf-8',
+          'Cache-Control': 'no-cache',
+        },
+      });
+    }
+
+    // Raw MDX source: prevent indexing and embedding
+    const isMdx = filePath.endsWith('.mdx');
+
+    return new NextResponse(stream as any, {
+      status: 200,
+      headers: {
+        'Content-Type': getContentType(filePath),
+        'Cache-Control': getCacheControl(filePath),
+        ...(isMdx && {
+          'Content-Disposition': 'inline',
+          'X-Robots-Tag': 'noindex, nofollow',
+          'X-Frame-Options': 'DENY',
+          'Content-Security-Policy': "default-src 'none'",
+        }),
+      },
+    });
+  } catch (error) {
+    console.error(`[R2 API] Error fetching ${project}${filePath}:`, error);
+    return new NextResponse(get500Html(), {
+      status: 500,
+      headers: {
+        'Content-Type': 'text/html; charset=utf-8',
+        'Cache-Control': 'no-cache',
+      },
+    });
+  }
+}
+
+// Jamdesk favicon as inline SVG data URI (fallback when project favicon unavailable)
+const JAMDESK_FAVICON = "data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32' fill='none'><rect x='3' y='7' width='14' height='19' rx='2.5' fill='%23C4B5FD' fill-opacity='0.9'/><rect x='8' y='4' width='14' height='19' rx='2.5' fill='%23A78BFA' fill-opacity='0.85'/><rect x='13' y='9' width='14' height='19' rx='2.5' fill='%238B5CF6' fill-opacity='0.9'/></svg>";
+
+// Simple fallback 404 page if project's 404.html doesn't exist
+function get404Html(project: string): string {
+  return `<!DOCTYPE html>
+<html>
+<head>
+  <title>Page Not Found</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="icon" id="favicon" type="image/svg+xml" href="/_jd/branding/favicon.svg">
+  <script>
+    // Try project favicon, fall back to Jamdesk
+    var link = document.getElementById('favicon');
+    var img = new Image();
+    img.onerror = function() { link.href = "${JAMDESK_FAVICON}"; };
+    img.src = link.href;
+  </script>
+  <style>
+    body {
+      font-family: system-ui, -apple-system, sans-serif;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      min-height: 100vh;
+      margin: 0;
+      background: #0f172a;
+      color: #f8fafc;
+    }
+    .container { text-align: center; padding: 2rem; }
+    h1 { font-size: 4rem; margin: 0 0 1rem; font-weight: 700; }
+    p { color: #94a3b8; font-size: 1.125rem; margin: 0 0 2rem; }
+    a {
+      color: #3b82f6;
+      text-decoration: none;
+      padding: 0.75rem 1.5rem;
+      border: 1px solid #3b82f6;
+      border-radius: 0.5rem;
+      display: inline-block;
+      transition: all 0.2s;
+    }
+    a:hover { background: #3b82f6; color: white; }
+  </style>
+</head>
+<body>
+  <div class="container">
+    <h1>404</h1>
+    <p>The page you're looking for doesn't exist.</p>
+    <a href="/">Go Home</a>
+  </div>
+</body>
+</html>`;
+}
+
+// Simple fallback 500 page (uses inline favicon since server errored)
+function get500Html(): string {
+  return `<!DOCTYPE html>
+<html>
+<head>
+  <title>Server Error</title>
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <link rel="icon" type="image/svg+xml" href="${JAMDESK_FAVICON}">
+  <style>
+    body {
+      font-family: system-ui, -apple-system, sans-serif;
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      min-height: 100vh;
+      margin: 0;
+      background: #0f172a;
+      color: #f8fafc;
+    }
+    .container { text-align: center; padding: 2rem; }
+    h1 { font-size: 4rem; margin: 0 0 1rem; font-weight: 700; }
+    p { color: #94a3b8; font-size: 1.125rem; margin: 0 0 2rem; }
+    a {
+      color: #3b82f6;
+      text-decoration: none;
+      padding: 0.75rem 1.5rem;
+      border: 1px solid #3b82f6;
+      border-radius: 0.5rem;
+      display: inline-block;
+      transition: all 0.2s;
+    }
+    a:hover { background: #3b82f6; color: white; }
+  </style>
+</head>
+<body>
+  <div class="container">
+    <h1>500</h1>
+    <p>Something went wrong. Please try again later.</p>
+    <a href="/">Go Home</a>
+  </div>
+</body>
+</html>`;
+}

package/vendored/app/api/revalidate/route.ts

@@ -0,0 +1,76 @@
+/**
+ * Revalidation API Route
+ *
+ * POST /api/revalidate
+ *
+ * Triggers on-demand cache revalidation for ISR pages.
+ * Called by the build service after uploading new content to R2.
+ *
+ * Request body:
+ * {
+ *   "project": "acme",           // Project to revalidate
+ *   "paths": ["/intro", "/api"], // Specific paths (optional)
+ *   "tags": ["docs"],            // Cache tags (optional)
+ *   "all": true                  // Revalidate everything (optional)
+ * }
+ *
+ * Headers:
+ * - x-revalidate-secret: Secret token for authentication
+ */
+
+import { NextRequest, NextResponse } from 'next/server';
+import { revalidatePath, revalidateTag } from 'next/cache';
+import {
+  validateRevalidateSecret,
+  parseRevalidateRequest,
+  executeRevalidation,
+  buildSuccessResponse,
+  buildErrorResponse,
+} from '@/lib/revalidation-helpers';
+
+export async function POST(request: NextRequest) {
+  // Verify secret
+  const secret = request.headers.get('x-revalidate-secret');
+
+  if (!validateRevalidateSecret(secret)) {
+    return NextResponse.json(
+      buildErrorResponse('Unauthorized'),
+      { status: 401 }
+    );
+  }
+
+  try {
+    // Parse request body
+    const body = await request.json();
+    const parsedRequest = parseRevalidateRequest(body);
+
+    // Execute revalidation with Next.js functions
+    const result = await executeRevalidation(
+      parsedRequest,
+      revalidatePath,
+      revalidateTag
+    );
+
+    return NextResponse.json(buildSuccessResponse(result));
+  } catch (error) {
+    console.error('Revalidation error:', error);
+    return NextResponse.json(
+      buildErrorResponse('Revalidation failed', (error as Error).message),
+      { status: 500 }
+    );
+  }
+}
+
+/**
+ * GET /api/revalidate
+ *
+ * Health check endpoint for the revalidation API.
+ */
+export async function GET() {
+  return NextResponse.json({
+    status: 'ok',
+    endpoint: '/api/revalidate',
+    method: 'POST',
+    description: 'Trigger on-demand cache revalidation',
+  });
+}

package/vendored/app/globals.css

@@ -0,0 +1,37 @@
+@import "tailwindcss";
+
+/*
+ * Light/Dark mode image utilities
+ * These utilities enable showing different images based on theme.
+ * Usage in MDX:
+ *   <img className="block dark:hidden" src="/light.png" noStyle />
+ *   <img className="hidden dark:block" src="/dark.png" noStyle />
+ *
+ * Note: Using !important to override .prose img { display: block } styles
+ */
+img.block { display: block !important; }
+img.hidden { display: none !important; }
+img.inline { display: inline !important; }
+img.inline-block { display: inline-block !important; }
+
+/* Dark mode variants - when .dark class is on <html> */
+.dark img.dark\:block, .dark .dark\:block { display: block !important; }
+.dark img.dark\:hidden, .dark .dark\:hidden { display: none !important; }
+.dark img.dark\:inline, .dark .dark\:inline { display: inline !important; }
+.dark img.dark\:inline-block, .dark .dark\:inline-block { display: inline-block !important; }
+
+/* Shiki handles syntax highlighting via CSS variables - no theme import needed */
+
+/* Import base shared styles */
+@import "../themes/base.css";
+
+/*
+ * Theme loading strategy:
+ * - Jam theme (default): loaded here via @import
+ * - Other themes: loaded dynamically via <style> tag in layout.tsx
+ *
+ * This means jam's CSS is always present, but jam-specific styles (like the
+ * background gradient) are scoped to body[data-theme="jam"] so they don't
+ * affect other themes.
+ */
+@import "../themes/jam/variables.css";