@commonpub/layer 0.4.5 → 0.4.7

package/pages/index.vue

@@ -157,6 +157,40 @@ async function handleHubJoin(hubSlug: string): Promise<void> {
         <div v-if="activeContest?.endDate" class="cpub-hero-aside">
           <CountdownTimer :target-date="activeContest.endDate" />
         </div>
+        <!-- Large textured Town Square logo — shown for Agora theme when no contest -->
+        <div v-if="!activeContest" class="cpub-hero-aside cpub-hero-logo-aside">
+          <svg class="cpub-hero-logo" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 200" aria-hidden="true">
+            <defs>
+              <filter id="cpub-hero-tex" x="-5%" y="-5%" width="110%" height="110%">
+                <feTurbulence type="fractalNoise" baseFrequency="0.04" numOctaves="4" result="noise"/>
+                <feDisplacementMap in="SourceGraphic" in2="noise" scale="2"/>
+              </filter>
+            </defs>
+            <g filter="url(#cpub-hero-tex)">
+              <rect x="18" y="18" width="72" height="72" fill="none" stroke="currentColor" stroke-width="5.5" stroke-linejoin="round"/>
+              <rect x="110" y="18" width="72" height="72" fill="none" stroke="currentColor" stroke-width="5.5" stroke-linejoin="round"/>
+              <rect x="18" y="110" width="72" height="72" fill="none" stroke="currentColor" stroke-width="5.5" stroke-linejoin="round"/>
+              <rect x="110" y="110" width="72" height="72" fill="none" stroke="currentColor" stroke-width="5.5" stroke-linejoin="round"/>
+              <rect x="90" y="90" width="20" height="20" fill="var(--accent, #3d8b5e)"/>
+              <rect x="84" y="84" width="6" height="6" fill="var(--accent, #3d8b5e)" opacity="0.6"/>
+              <rect x="110" y="84" width="6" height="6" fill="var(--accent, #3d8b5e)" opacity="0.6"/>
+              <rect x="84" y="110" width="6" height="6" fill="var(--accent, #3d8b5e)" opacity="0.6"/>
+              <rect x="110" y="110" width="6" height="6" fill="var(--accent, #3d8b5e)" opacity="0.6"/>
+              <line x1="32" y1="40" x2="76" y2="40" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" opacity="0.15"/>
+              <line x1="32" y1="52" x2="66" y2="52" stroke="var(--accent, #3d8b5e)" stroke-width="2.5" stroke-linecap="round" opacity="0.7"/>
+              <line x1="32" y1="64" x2="72" y2="64" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" opacity="0.15"/>
+              <line x1="124" y1="40" x2="168" y2="40" stroke="var(--accent, #3d8b5e)" stroke-width="2.5" stroke-linecap="round" opacity="0.7"/>
+              <line x1="124" y1="52" x2="158" y2="52" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" opacity="0.15"/>
+              <line x1="124" y1="64" x2="164" y2="64" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" opacity="0.15"/>
+              <line x1="32" y1="132" x2="76" y2="132" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" opacity="0.15"/>
+              <line x1="32" y1="144" x2="62" y2="144" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" opacity="0.15"/>
+              <line x1="32" y1="156" x2="70" y2="156" stroke="var(--accent, #3d8b5e)" stroke-width="2.5" stroke-linecap="round" opacity="0.7"/>
+              <line x1="124" y1="132" x2="168" y2="132" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" opacity="0.15"/>
+              <line x1="124" y1="144" x2="160" y2="144" stroke="var(--accent, #3d8b5e)" stroke-width="2.5" stroke-linecap="round" opacity="0.7"/>
+              <line x1="124" y1="156" x2="152" y2="156" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" opacity="0.15"/>
+            </g>
+          </svg>
+        </div>
       </div>
     </section>
 
@@ -464,6 +498,14 @@ async function handleHubJoin(hubSlug: string): Promise<void> {
 
 .cpub-hero-aside { flex-shrink: 0; }
 
+/* Hero logo — hidden by default, shown by Agora theme CSS */
+.cpub-hero-logo-aside { display: none; }
+.cpub-hero-logo {
+  width: 160px;
+  height: 160px;
+  opacity: 0.6;
+}
+
 /* ─── TABS BAR ─── */
 .cpub-tabs-bar {
   position: sticky;

package/server/api/docs/[siteSlug]/pages/[pageId].get.ts

@@ -19,13 +19,46 @@ export default defineEventHandler(async (event) => {
   const page = pages.find((p) => p.slug === pageSlug);
   if (!page) throw createError({ statusCode: 404, statusMessage: 'Page not found' });
 
-  // Render markdown to HTML with TOC extraction
-  const rendered = await renderMarkdown(page.content ?? '');
+  // Handle dual-format content: BlockTuple[] (new) or markdown string (legacy)
+  const content = page.content;
 
+  if (Array.isArray(content)) {
+    // New BlockTuple format — extract text for TOC generation
+    const headings = extractHeadingsFromBlocks(content as [string, Record<string, unknown>][]);
+    return {
+      ...page,
+      content,
+      html: null, // Client renders blocks directly
+      toc: headings,
+      frontmatter: {},
+      format: 'blocks',
+    };
+  }
+
+  // Legacy markdown format
+  const rendered = await renderMarkdown((content as string) ?? '');
   return {
     ...page,
     html: rendered.html,
     toc: rendered.toc,
     frontmatter: rendered.frontmatter,
+    format: 'markdown',
   };
 });
+
+/** Extract TOC headings from BlockTuple array */
+function extractHeadingsFromBlocks(
+  blocks: [string, Record<string, unknown>][],
+): Array<{ id: string; text: string; level: number }> {
+  const headings: Array<{ id: string; text: string; level: number }> = [];
+  for (const [type, content] of blocks) {
+    if (type === 'heading' && content.text) {
+      const text = String(content.text);
+      const level = (content.level as number) || 2;
+      // Must match BlockHeadingView.vue slugification exactly
+      const id = text.toLowerCase().replace(/[^a-z0-9]+/g, '-').replace(/^-|-$/g, '');
+      headings.push({ id, text, level });
+    }
+  }
+  return headings;
+}

package/server/api/docs/[siteSlug]/pages/index.get.ts

@@ -30,5 +30,18 @@ export default defineEventHandler(async (event) => {
     throw createError({ statusCode: 404, statusMessage: 'No version found for docs site' });
   }
 
-  return listDocsPages(db, version.id);
+  const pages = await listDocsPages(db, version.id);
+
+  // Parse content: if stored as JSON string (BlockTuple[]), parse back to array
+  return pages.map((page) => {
+    let content: string | unknown[] = page.content ?? '';
+    if (typeof content === 'string' && content.startsWith('[')) {
+      try {
+        content = JSON.parse(content);
+      } catch {
+        // Not valid JSON — keep as markdown string
+      }
+    }
+    return { ...page, content };
+  });
 });

package/server/api/docs/migrate-content.post.ts

@@ -0,0 +1,101 @@
+/**
+ * Migration endpoint: Convert docs pages from markdown (string) to BlockTuple[] (JSON).
+ *
+ * POST /api/docs/migrate-content
+ *
+ * Requires admin auth. Converts all docsPages where content is a markdown string
+ * into BlockTuple[] JSON format using markdownToBlockTuples.
+ *
+ * This is a one-time migration. After running, the content column can be altered to JSONB.
+ *
+ * Run this BEFORE altering the column type:
+ *   ALTER TABLE docs_pages ALTER COLUMN content TYPE jsonb USING content::jsonb;
+ */
+import { markdownToBlockTuples } from '@commonpub/editor';
+import { docsPages } from '@commonpub/schema';
+import { eq } from 'drizzle-orm';
+
+export default defineEventHandler(async (event) => {
+  const user = requireAuth(event);
+
+  // Only allow admins to run migration
+  if (!user.role || user.role !== 'admin') {
+    throw createError({ statusCode: 403, statusMessage: 'Admin only' });
+  }
+
+  const db = useDB();
+
+  // Fetch all pages
+  const allPages = await db.select().from(docsPages);
+
+  let converted = 0;
+  let skipped = 0;
+  let errored = 0;
+  const errors: Array<{ pageId: string; title: string; error: string }> = [];
+
+  for (const page of allPages) {
+    const content = page.content ?? '';
+
+    // Skip if already JSON (starts with [ for BlockTuple array)
+    if (typeof content === 'string' && content.startsWith('[')) {
+      try {
+        JSON.parse(content);
+        skipped++;
+        continue;
+      } catch {
+        // Not valid JSON, proceed with conversion
+      }
+    }
+
+    // Skip empty content
+    if (!content || (typeof content === 'string' && !content.trim())) {
+      // Set empty content to an empty paragraph block
+      try {
+        await db
+          .update(docsPages)
+          .set({ content: JSON.stringify([['paragraph', { html: '' }]]) })
+          .where(eq(docsPages.id, page.id));
+        converted++;
+      } catch (err: unknown) {
+        errored++;
+        errors.push({
+          pageId: page.id,
+          title: page.title,
+          error: err instanceof Error ? err.message : 'Unknown error',
+        });
+      }
+      continue;
+    }
+
+    // Convert markdown to BlockTuples
+    try {
+      const blocks = markdownToBlockTuples(content as string);
+      const jsonContent = JSON.stringify(blocks);
+
+      await db
+        .update(docsPages)
+        .set({ content: jsonContent })
+        .where(eq(docsPages.id, page.id));
+
+      converted++;
+    } catch (err: unknown) {
+      errored++;
+      errors.push({
+        pageId: page.id,
+        title: page.title,
+        error: err instanceof Error ? err.message : 'Unknown error',
+      });
+    }
+  }
+
+  return {
+    total: allPages.length,
+    converted,
+    skipped,
+    errored,
+    errors,
+    nextStep: errored === 0
+      ? 'All pages converted. You can now run: ALTER TABLE docs_pages ALTER COLUMN content TYPE jsonb USING content::jsonb;'
+      : 'Some pages failed conversion. Fix errors and re-run.',
+  };
+});

package/theme/agora-dark.css

@@ -361,3 +361,6 @@
 /* Logo switch */
 [data-theme="agora-dark"] .cpub-logo-classic { display: none !important; }
 [data-theme="agora-dark"] .cpub-logo-agora { display: flex !important; }
+
+/* Show Town Square logo in hero section */
+[data-theme="agora-dark"] .cpub-hero-logo-aside { display: flex !important; align-items: center; justify-content: center; }

package/theme/agora.css

@@ -470,3 +470,6 @@
 
 [data-theme="agora"] .cpub-logo-classic { display: none !important; }
 [data-theme="agora"] .cpub-logo-agora { display: flex !important; }
+
+/* Show Town Square logo in hero section */
+[data-theme="agora"] .cpub-hero-logo-aside { display: flex !important; align-items: center; justify-content: center; }