@nextblock-cms/db 0.17.0 → 0.17.1

package/supabase/migrations/00000000000038_mcp_guide_visual_refresh.sql

@@ -1,64 +0,0 @@
--- 00000000000038_mcp_guide_visual_refresh.sql
---
--- Visual refresh of the 'cortex-ai-mcp-connection-guide' post that 00000000000037
--- seeded. 037 stored the body as a plain Tiptap JSON document, which renders as a
--- wall of prose; this replaces it with the styled HTML every other seeded article
--- uses — summary cards, a prototype-vs-production comparison, a card per MCP tool
--- with its scope, numbered setup steps, terminal-style code panels, callouts, stat
--- tiles and a closing CTA — and adds a rendered architecture diagram
--- (public/images/mcp-prompt-to-production.webp, 2000x1025) as a captioned figure.
---
--- It is a separate file because 037 was already applied (and recorded) on the
--- sandbox before the redesign; Supabase matches history by version, so editing
--- 037 in place would have been skipped there silently.
---
--- Idempotent: the media row upserts on media.object_key; the body UPDATE is guarded
--- on the seeded Tiptap JSON shape (starts with the doc node and carries 037's
--- opening sentence), so once replaced — or once an editor has rewritten the post —
--- it no longer matches. The SEO grade stays 100/100 with the focus keyphrase
--- "connect Claude to NextBlock CMS" (verified with libs/utils/src/lib/seo).
---
--- After adding this file: npm run generate:migrations-bundle && npm run
--- generate:sandbox && npm run sync:create-nextblock.
-
-DO $body$
-DECLARE
-  v_en   integer;
-  v_post integer;
-BEGIN
-  SELECT id INTO v_en FROM public.languages WHERE code = 'en' LIMIT 1;
-
-  ---------------------------------------------------------------------------
-  -- 1. Media row for the inline diagram. Registered in resolveMediaUrl's bundled
-  --    keys and the text renderer's known-image map, so it is served from
-  --    public/images and optimised through next/image.
-  ---------------------------------------------------------------------------
-  INSERT INTO public.media (id, uploader_id, file_name, object_key, file_path, folder, file_type, size_bytes, description, width, height)
-  VALUES ('5c7d9e2b-1a64-4f8c-9b3e-7d2a4c6e8f10'::uuid, NULL, 'mcp-prompt-to-production.webp', 'images/mcp-prompt-to-production.webp', 'images/mcp-prompt-to-production.webp', 'images', 'image/webp', 109680, 'Diagram of the prompt-to-production flow: an AI client calls the Cortex AI MCP server at /api/mcp, which writes validated JSONB blocks to PostgreSQL that Next.js 16 publishes without a redeploy', 2000, 1025)
-  ON CONFLICT (object_key) DO UPDATE
-     SET description = COALESCE(NULLIF(public.media.description, ''), EXCLUDED.description),
-         width       = COALESCE(public.media.width, EXCLUDED.width),
-         height      = COALESCE(public.media.height, EXCLUDED.height),
-         updated_at  = now();
-
-  ---------------------------------------------------------------------------
-  -- 2. Replace the seeded Tiptap JSON body with the styled HTML version.
-  ---------------------------------------------------------------------------
-  SELECT id INTO v_post
-    FROM public.posts
-   WHERE language_id = v_en AND slug = 'cortex-ai-mcp-connection-guide'
-   ORDER BY id
-   LIMIT 1;
-
-  IF v_post IS NOT NULL THEN
-    UPDATE public.blocks
-       SET content    = $nbmcpguide2${"html_content":"<p class='text-lg leading-8 text-slate-700 dark:text-slate-300'>This guide shows you how to connect Claude to NextBlock CMS with an open standard instead of a vendor plugin. Cortex AI turns your site into a Model Context Protocol server. Claude Code, Cursor, ChatGPT, and Gemini can then read your database schema, draft page layouts, and update navigation from their own chat window. You pay for the AI subscription you already have, with no token markup in between.</p><div class='grid gap-4 md:grid-cols-3 my-10'><div class='rounded-3xl border border-sky-200/70 bg-sky-50/70 p-6 dark:border-sky-500/20 dark:bg-sky-500/10'><p class='mt-0 mb-0 text-xs font-semibold uppercase tracking-[0.22em] text-sky-700 dark:text-sky-200'>One config block</p><p class='mt-3 mb-0 text-xl font-semibold text-slate-900 dark:text-white'>Setup in minutes.</p><p class='mt-3 mb-0 text-sm text-slate-600 dark:text-slate-300'>Paste one JSON entry into Claude Code, Cursor, or VS Code. The CMS settings card writes it for you.</p></div><div class='rounded-3xl border border-indigo-200/70 bg-indigo-50/70 p-6 dark:border-indigo-500/20 dark:bg-indigo-500/10'><p class='mt-0 mb-0 text-xs font-semibold uppercase tracking-[0.22em] text-indigo-700 dark:text-indigo-200'>Your subscription</p><p class='mt-3 mb-0 text-xl font-semibold text-slate-900 dark:text-white'>No token markup.</p><p class='mt-3 mb-0 text-sm text-slate-600 dark:text-slate-300'>Claude Pro, ChatGPT Plus, Cursor, or Gemini Advanced do the thinking. NextBlock never resells tokens.</p></div><div class='rounded-3xl border border-emerald-200/70 bg-emerald-50/70 p-6 dark:border-emerald-500/20 dark:bg-emerald-500/10'><p class='mt-0 mb-0 text-xs font-semibold uppercase tracking-[0.22em] text-emerald-700 dark:text-emerald-200'>Live Drafts</p><p class='mt-3 mb-0 text-xl font-semibold text-slate-900 dark:text-white'>Nothing ships by accident.</p><p class='mt-3 mb-0 text-sm text-slate-600 dark:text-slate-300'>Every layout the agent writes lands as a draft. An editor reviews it and hits publish.</p></div></div><p>Every prompt becomes a structured database record rather than a pile of generated code. Your editors keep a visual CMS, your developers keep a clean Next.js 16 app, and nothing goes live until someone hits publish.</p><h2>The Problem with Traditional AI Web Builders</h2><p>Prompt builders such as Lovable, Bolt, and v0 are impressive on day one. You describe a page and get a working React app in minutes. The trouble starts on day two.</p><div class='grid gap-4 md:grid-cols-2 my-8'><div class='rounded-3xl border border-rose-200/70 bg-rose-50/70 p-6 dark:border-rose-500/20 dark:bg-rose-500/10'><p class='mt-0 mb-0 text-xs font-semibold uppercase tracking-[0.22em] text-rose-700 dark:text-rose-200'>Prototype tools</p><p class='mt-3 mb-0 text-xl font-semibold text-slate-900 dark:text-white'>A codebase to babysit.</p><p class='mt-3 mb-0 text-sm text-slate-600 dark:text-slate-300'>The output is disposable code with no content layer. Every headline change is another prompt or another pull request. There are no drafts, no revisions, no translations, and no SEO checks for the people who own the words.</p></div><div class='rounded-3xl border border-emerald-200/70 bg-emerald-50/70 p-6 dark:border-emerald-500/20 dark:bg-emerald-500/10'><p class='mt-0 mb-0 text-xs font-semibold uppercase tracking-[0.22em] text-emerald-700 dark:text-emerald-200'>NextBlock</p><p class='mt-3 mb-0 text-xl font-semibold text-slate-900 dark:text-white'>A website plus a CMS.</p><p class='mt-3 mb-0 text-sm text-slate-600 dark:text-slate-300'>AI scaffolds the site once, and a real CMS runs it forever. Marketing edits copy in a Notion-style editor. Engineers keep a codebase nobody has to babysit.</p></div></div><p>NextBlock takes the opposite view from the prototype tools. AI should draft the site, and people should own it. The MCP connection is how those two worlds meet.</p><h2>How Cortex AI Uses Model Context Protocol (MCP)</h2><p>Model Context Protocol is an open standard for giving AI agents tools. A client such as Claude Code lists the tools a server offers, calls them with typed arguments, and reads typed results back. Cortex AI ships that server inside your NextBlock install at <code>/api/mcp</code>.</p><figure class='my-12 overflow-hidden rounded-[2rem] border border-slate-200/80 bg-slate-950 shadow-2xl dark:border-white/10'><img src='/images/mcp-prompt-to-production.webp' alt='Diagram of the prompt-to-production flow: an AI client calls the Cortex AI MCP server at /api/mcp, which writes validated JSONB blocks to PostgreSQL that Next.js 16 publishes without a redeploy' class='w-full h-auto object-cover' /><figcaption class='border-t border-white/10 px-6 py-4 text-sm text-slate-300'>One prompt travels from your AI client, through the MCP server, into PostgreSQL as validated blocks, and out as a published page. No build step sits in between.</figcaption></figure><p>The endpoint speaks Streamable HTTP. Your client posts JSON-RPC messages over a normal HTTPS request, and the server answers in the same response. There is no long-lived SSE stream to babysit and no SDK to install on the server side. The same 29 typed tools that power the dashboard copilot are exposed over the wire, so the agent in your editor and the agent in your CMS never drift apart.</p><div class='grid gap-4 md:grid-cols-2 my-8'><div class='rounded-3xl border border-violet-200/70 bg-violet-50/70 p-6 dark:border-violet-500/20 dark:bg-violet-500/10'><p class='mt-0 mb-0 text-xs font-semibold uppercase tracking-[0.22em] text-violet-700 dark:text-violet-200'>Safety rule one</p><p class='mt-3 mb-0 text-xl font-semibold text-slate-900 dark:text-white'>Layouts stage as Live Drafts.</p><p class='mt-3 mb-0 text-sm text-slate-600 dark:text-slate-300'>Layout tools write drafts, so nothing reaches visitors until an editor publishes it.</p></div><div class='rounded-3xl border border-blue-200/70 bg-blue-50/70 p-6 dark:border-blue-500/20 dark:bg-blue-500/10'><p class='mt-0 mb-0 text-xs font-semibold uppercase tracking-[0.22em] text-blue-700 dark:text-blue-200'>Safety rule two</p><p class='mt-3 mb-0 text-xl font-semibold text-slate-900 dark:text-white'>Every token carries a scope.</p><p class='mt-3 mb-0 text-sm text-slate-600 dark:text-slate-300'>A read-only token never even sees a tool that could change data. Mutating tools are absent from its list.</p></div></div><h3>Available MCP Database Tools</h3><p>Five tool names form the public MCP contract. Each one forwards to a tested Cortex AI executor.</p><div class='grid gap-4 md:grid-cols-2 my-8'><div class='rounded-3xl border border-slate-200 bg-white p-5 shadow-sm dark:border-white/10 dark:bg-white/5'><div class='flex items-center justify-between gap-3'><code class='rounded-lg bg-violet-50 px-2.5 py-1 text-sm text-violet-700 dark:bg-violet-500/15 dark:text-violet-200'>get_database_schema</code><span class='rounded-full border px-2.5 py-0.5 text-[0.65rem] font-semibold uppercase tracking-[0.18em] border-emerald-300 text-emerald-700 dark:border-emerald-500/40 dark:text-emerald-200'>read</span></div><p class='mt-3 mb-0 text-sm text-slate-600 dark:text-slate-300'>Returns every table the agent may read or change, with columns, primary keys, and read-only flags.</p></div><div class='rounded-3xl border border-slate-200 bg-white p-5 shadow-sm dark:border-white/10 dark:bg-white/5'><div class='flex items-center justify-between gap-3'><code class='rounded-lg bg-violet-50 px-2.5 py-1 text-sm text-violet-700 dark:bg-violet-500/15 dark:text-violet-200'>generate_jsonb_layout</code><span class='rounded-full border px-2.5 py-0.5 text-[0.65rem] font-semibold uppercase tracking-[0.18em] border-amber-300 text-amber-700 dark:border-amber-500/40 dark:text-amber-200'>write</span></div><p class='mt-3 mb-0 text-sm text-slate-600 dark:text-slate-300'>Turns a prompt into a full page layout, validates each block against the NextBlock schema, and stages it as a Live Draft.</p></div><div class='rounded-3xl border border-slate-200 bg-white p-5 shadow-sm dark:border-white/10 dark:bg-white/5'><div class='flex items-center justify-between gap-3'><code class='rounded-lg bg-violet-50 px-2.5 py-1 text-sm text-violet-700 dark:bg-violet-500/15 dark:text-violet-200'>update_site_navigation</code><span class='rounded-full border px-2.5 py-0.5 text-[0.65rem] font-semibold uppercase tracking-[0.18em] border-amber-300 text-amber-700 dark:border-amber-500/40 dark:text-amber-200'>write</span></div><p class='mt-3 mb-0 text-sm text-slate-600 dark:text-slate-300'>Adds, renames, or reorders header menu items per locale.</p></div><div class='rounded-3xl border border-slate-200 bg-white p-5 shadow-sm dark:border-white/10 dark:bg-white/5'><div class='flex items-center justify-between gap-3'><code class='rounded-lg bg-violet-50 px-2.5 py-1 text-sm text-violet-700 dark:bg-violet-500/15 dark:text-violet-200'>query_site_analytics</code><span class='rounded-full border px-2.5 py-0.5 text-[0.65rem] font-semibold uppercase tracking-[0.18em] border-emerald-300 text-emerald-700 dark:border-emerald-500/40 dark:text-emerald-200'>read</span></div><p class='mt-3 mb-0 text-sm text-slate-600 dark:text-slate-300'>Reads revenue, order counts, status breakdowns, and top products over a date range.</p></div><div class='rounded-3xl border border-slate-200 bg-white p-5 shadow-sm dark:border-white/10 dark:bg-white/5'><div class='flex items-center justify-between gap-3'><code class='rounded-lg bg-violet-50 px-2.5 py-1 text-sm text-violet-700 dark:bg-violet-500/15 dark:text-violet-200'>search_stock_media</code><span class='rounded-full border px-2.5 py-0.5 text-[0.65rem] font-semibold uppercase tracking-[0.18em] border-emerald-300 text-emerald-700 dark:border-emerald-500/40 dark:text-emerald-200'>read</span></div><p class='mt-3 mb-0 text-sm text-slate-600 dark:text-slate-300'>Finds free stock photos with alt text and photographer credits ready for an image block.</p></div><div class='rounded-3xl border border-dashed border-slate-300 p-5 dark:border-white/20'><p class='mt-0 mb-0 text-sm font-semibold text-slate-900 dark:text-white'>And 24 more.</p><p class='mt-2 mb-0 text-sm text-slate-600 dark:text-slate-300'>Create posts and products, translate pages, upload media, manage themes and scripts. Three resources expose the database, block, and custom block schemas.</p></div></div><h2>Step by Step: Connect Claude to NextBlock CMS in Cursor and Claude Code</h2><p>The server is off by default because it is a remote write surface onto live content. Turning it on takes three steps.</p><div class='grid gap-4 md:grid-cols-3 my-8'><div class='rounded-3xl border border-slate-200 bg-slate-50 p-6 dark:border-white/10 dark:bg-white/5'><p class='mt-0 mb-0 font-mono text-3xl font-bold text-sky-500 dark:text-sky-300'>01</p><p class='mt-3 mb-0 text-lg font-semibold text-slate-900 dark:text-white'>Enable the server.</p><p class='mt-2 mb-0 text-sm text-slate-600 dark:text-slate-300'>Open <strong>CMS Settings → Cortex AI</strong> and switch on the MCP server access card.</p></div><div class='rounded-3xl border border-slate-200 bg-slate-50 p-6 dark:border-white/10 dark:bg-white/5'><p class='mt-0 mb-0 font-mono text-3xl font-bold text-violet-500 dark:text-violet-300'>02</p><p class='mt-3 mb-0 text-lg font-semibold text-slate-900 dark:text-white'>Mint a token.</p><p class='mt-2 mb-0 text-sm text-slate-600 dark:text-slate-300'>Pick the scope you need. Read-only is enough for planning and audits.</p></div><div class='rounded-3xl border border-slate-200 bg-slate-50 p-6 dark:border-white/10 dark:bg-white/5'><p class='mt-0 mb-0 font-mono text-3xl font-bold text-emerald-500 dark:text-emerald-300'>03</p><p class='mt-3 mb-0 text-lg font-semibold text-slate-900 dark:text-white'>Copy the config.</p><p class='mt-2 mb-0 text-sm text-slate-600 dark:text-slate-300'>The card renders one snippet each for Claude Code, Cursor, VS Code, and Claude Desktop.</p></div></div><p>Claude Code needs <code>\"type\": \"http\"</code> in the entry, or it skips the server without a warning. Cursor infers the transport from the URL and needs no type field. VS Code uses a top-level <code>servers</code> key and prompts for the token instead of storing it.</p><h3>Localhost Configuration Without a Token</h3><p>While you build, turn on <strong>Trust localhost without a token</strong> in the same settings card. A dev server on your machine then accepts loopback calls with no header at all. Standalone installs run on port 3000, and the monorepo dev server runs on port 4200.</p><p>Add this block to <code>.mcp.json</code> in your project root for Claude Code.</p><div class='my-8 overflow-hidden rounded-[2rem] border border-slate-800 bg-slate-950 shadow-2xl'><div class='flex items-center gap-2 border-b border-white/10 px-5 py-3'><span class='h-3 w-3 rounded-full bg-red-400/70'></span><span class='h-3 w-3 rounded-full bg-yellow-400/70'></span><span class='h-3 w-3 rounded-full bg-green-400/70'></span><span class='ml-3 text-xs font-mono text-slate-400'>.mcp.json</span></div><pre class='m-0 overflow-x-auto rounded-none bg-transparent px-6 py-5 text-sm leading-6 text-slate-200'><code>{\n  \"mcpServers\": {\n    \"nextblock\": {\n      \"type\": \"http\",\n      \"url\": \"http://localhost:3000/api/mcp\"\n    }\n  }\n}</code></pre></div><p>The CLI form does the same thing in one line.</p><div class='my-8 overflow-hidden rounded-[2rem] border border-slate-800 bg-slate-950 shadow-2xl'><div class='flex items-center gap-2 border-b border-white/10 px-5 py-3'><span class='h-3 w-3 rounded-full bg-red-400/70'></span><span class='h-3 w-3 rounded-full bg-yellow-400/70'></span><span class='h-3 w-3 rounded-full bg-green-400/70'></span><span class='ml-3 text-xs font-mono text-slate-400'>terminal</span></div><pre class='m-0 overflow-x-auto rounded-none bg-transparent px-6 py-5 text-sm leading-6 text-slate-200'><code>claude mcp add --transport http nextblock http://localhost:3000/api/mcp</code></pre></div><div class='rounded-3xl border border-amber-200 bg-amber-50/80 p-6 my-8 dark:border-amber-500/20 dark:bg-amber-500/10'><p class='mt-0 mb-0 text-xs font-semibold uppercase tracking-[0.22em] text-amber-700 dark:text-amber-200'>Development only</p><p class='mt-3 mb-0 text-sm text-slate-700 dark:text-slate-200'>Localhost trust is ignored in production builds, because a proxy can spoof the host header. Production always uses a token.</p></div><h3>Production Authentication via Bearer Tokens</h3><p>In production every client sends a bearer token. Tokens start with <code>nbmcp_</code>, are shown once at mint time, and are stored only as SHA-256 hashes. Revoking one is a single click, and the same value can never be minted again.</p><p>Add this to <code>.cursor/mcp.json</code> for Cursor, or drop the same entry into <code>.mcp.json</code> with a type field for Claude Code.</p><div class='my-8 overflow-hidden rounded-[2rem] border border-slate-800 bg-slate-950 shadow-2xl'><div class='flex items-center gap-2 border-b border-white/10 px-5 py-3'><span class='h-3 w-3 rounded-full bg-red-400/70'></span><span class='h-3 w-3 rounded-full bg-yellow-400/70'></span><span class='h-3 w-3 rounded-full bg-green-400/70'></span><span class='ml-3 text-xs font-mono text-slate-400'>.cursor/mcp.json</span></div><pre class='m-0 overflow-x-auto rounded-none bg-transparent px-6 py-5 text-sm leading-6 text-slate-200'><code>{\n  \"mcpServers\": {\n    \"nextblock\": {\n      \"url\": \"https://your-site.com/api/mcp\",\n      \"headers\": { \"Authorization\": \"Bearer nbmcp_your_token\" }\n    }\n  }\n}</code></pre></div><div class='rounded-3xl border border-violet-200 bg-violet-50/80 p-6 my-8 dark:border-violet-500/20 dark:bg-violet-500/10'><p class='mt-0 mb-0 text-xs font-semibold uppercase tracking-[0.22em] text-violet-700 dark:text-violet-200'>Try it</p><p class='mt-3 mb-0 text-sm text-slate-700 dark:text-slate-200'>Once the client connects, ask for something concrete. Try &ldquo;inspect the database schema and draft a pricing page with three tiers.&rdquo; The agent calls the schema tool, then the layout tool, and your CMS shows a new Live Draft ready for review.</p></div><h2>Zero-Redeploy Production Rendering</h2><p>The reason this works is where the output lands. Cortex AI writes strict JSONB block records into PostgreSQL, not HTML strings and not source files. Each block has a Zod schema, so a bad field is rejected before it is stored.</p><div class='grid gap-4 md:grid-cols-3 my-8'><div class='rounded-3xl border border-sky-200/70 bg-sky-50/70 p-6 text-center dark:border-sky-500/20 dark:bg-sky-500/10'><p class='mt-0 mb-0 text-4xl font-extrabold text-slate-900 dark:text-white'>0</p><p class='mt-2 mb-0 text-xs font-semibold uppercase tracking-[0.2em] text-sky-700 dark:text-sky-200'>Rebuilds to publish</p></div><div class='rounded-3xl border border-violet-200/70 bg-violet-50/70 p-6 text-center dark:border-violet-500/20 dark:bg-violet-500/10'><p class='mt-0 mb-0 text-4xl font-extrabold text-slate-900 dark:text-white'>1</p><p class='mt-2 mb-0 text-xs font-semibold uppercase tracking-[0.2em] text-violet-700 dark:text-violet-200'>Zod schema per block</p></div><div class='rounded-3xl border border-emerald-200/70 bg-emerald-50/70 p-6 text-center dark:border-emerald-500/20 dark:bg-emerald-500/10'><p class='mt-0 mb-0 text-4xl font-extrabold text-slate-900 dark:text-white'>100</p><p class='mt-2 mb-0 text-xs font-semibold uppercase tracking-[0.2em] text-emerald-700 dark:text-emerald-200'>Lighthouse by default</p></div></div><p>At request time Next.js 16 renders those records with Server Components and caches the result at the edge. There is no build step between publish and live, and no HTML sanitizer tax on every render. The 100/100 Lighthouse defaults you get on an empty site are the same ones you get after the agent has drafted fifty pages.</p><div class='rounded-3xl border border-slate-200 bg-slate-50 p-6 my-10 dark:border-white/10 dark:bg-white/5'><p class='mt-0 mb-0 text-xs font-semibold uppercase tracking-[0.22em] text-slate-600 dark:text-slate-300'>Next step</p><p class='mt-3 mb-0 text-xl font-semibold text-slate-900 dark:text-white'>Connect your agent today.</p><p class='mt-3 text-sm text-slate-600 dark:text-slate-300'>One license unlocks the dashboard copilot and the MCP server. Read how the block registry keeps all of it safe if you want the full picture.</p><div class='mt-5 flex flex-wrap gap-3'><a href='https://nextblock.dev/product/nextblock-cortex-ai-cortex-ai-license' class='inline-flex items-center rounded-full bg-slate-900 px-6 py-3 text-sm font-semibold text-white no-underline shadow-lg hover:bg-slate-700 dark:bg-white dark:text-slate-900 dark:hover:bg-slate-200'>Get the Cortex AI license</a><a href='/article/how-nextblock-works' class='inline-flex items-center rounded-full border border-slate-300 px-6 py-3 text-sm font-semibold text-slate-700 no-underline hover:border-slate-500 dark:border-white/20 dark:text-slate-200 dark:hover:border-white/50'>How NextBlock works</a></div></div>"}$nbmcpguide2$::jsonb,
-           updated_at = now()
-     WHERE post_id = v_post
-       AND block_type = 'text'
-       AND "order" = 0
-       AND content->>'html_content' LIKE '{"type":"doc"%'
-       AND content->>'html_content' LIKE '%This guide shows you how to connect Claude to NextBlock CMS with an open standard%';
-  END IF;
-END
-$body$;

package/supabase/migrations/00000000000039_mcp_guide_diagram_dimensions.sql

@@ -1,21 +0,0 @@
--- 00000000000039_mcp_guide_diagram_dimensions.sql
---
--- 00000000000038 registered public/images/mcp-prompt-to-production.webp at 2000x1025.
--- The rendered figure was blurry because next/image was told it displays at 768px,
--- re-encoded it as quality-60 AVIF and the browser upscaled the result to the
--- full article width. The asset is now re-rendered at 2560x1312
--- and served unoptimized (see ClientTextBlockRenderer's knownCmsImages); this
--- brings the media-library row in line with the file on disk. 038 is already
--- applied, so this is a separate file.
---
--- Idempotent: keyed by media.object_key, guarded on the values differing.
-
-UPDATE public.media
-   SET width      = 2560,
-       height     = 1312,
-       size_bytes = 156358,
-       updated_at = now()
- WHERE object_key = 'images/mcp-prompt-to-production.webp'
-   AND (width IS DISTINCT FROM 2560
-        OR height IS DISTINCT FROM 1312
-        OR size_bytes IS DISTINCT FROM 156358);

package/supabase/migrations/00000000000040_home_comparison_chart_free_cms.sql

@@ -1,81 +0,0 @@
--- 00000000000040_home_comparison_chart_free_cms.sql
---
--- Two marketing changes to the EN home page that 00000000000037 seeded:
---
---   1. The prototype-tools-versus-NextBlock block under "Why an AI Website Builder
---      CMS Beats Prototype Code" was two prose cards that did not read as a
---      comparison. It is now a seven-row comparison chart (day-one output, editing,
---      drafts and revisions, publishing, translations and SEO, AI costs, price)
---      with the NextBlock column highlighted, followed by three pricing tiles.
---   2. The pricing story is explicit everywhere the AI is mentioned: the CMS is
---      100% free and open source, forever; Cortex AI is the one paid license, and
---      it runs on the AI subscription the customer already has (no token markup).
---      The hero card, the pricing tiles and the Cortex promo all carry it.
---
--- 037 is already applied on the sandbox, so this is a separate file. Each UPDATE
--- is guarded on a phrase unique to the 037 copy (Production on day two. / A codebase to babysit. /
--- One AI Engine) that the new copy does not contain, so re-runs are no-ops and a
--- home page an editor has since customised is left alone. The page still grades
--- 100/100 with the focus keyphrase "AI website builder CMS" (libs/utils/src/lib/seo).
---
--- After adding this file: npm run generate:migrations-bundle && npm run
--- generate:sandbox && npm run sync:create-nextblock.
-
-DO $body$
-DECLARE
-  v_en   integer;
-  v_home integer;
-BEGIN
-  SELECT id INTO v_en FROM public.languages WHERE code = 'en' LIMIT 1;
-
-  SELECT id INTO v_home
-    FROM public.pages
-   WHERE slug = 'home' AND language_id = v_en
-   ORDER BY id
-   LIMIT 1;
-
-  IF v_home IS NULL THEN
-    RETURN;
-  END IF;
-
-  -- Hero: same H1; subtitle now says free and open source; right card carries the
-  -- "Free CMS. Paid AI." message; primary CTA reads "Start Free".
-  UPDATE public.blocks
-     SET content = $nbhero2${"is_hero":true,"padding":{"top":"xl","bottom":"xl"},"background":{"type":"gradient","gradient":{"type":"linear","stops":[{"color":"#020817","position":0},{"color":"#0f172a","position":50},{"color":"#1e293b","position":100}],"direction":"135deg"}},"column_gap":"xl","column_blocks":[[{"block_type":"text","content":{"html_content":"<h1 class='text-5xl md:text-6xl font-extrabold tracking-tight text-white text-center leading-tight'>Prompt to <span class='relative inline-block mx-1 group'><span class='absolute inset-0 bg-gradient-to-r from-blue-600 to-cyan-400 translate-y-1 md:translate-y-2 transform -skew-x-12 rounded-sm shadow-lg group-hover:skew-x-0 transition-transform duration-300 ease-out'></span><span class='relative text-white italic px-1'>Production</span></span>.<br class='md:hidden' /> The AI Website Builder CMS.</h1>"}},{"block_type":"text","content":{"html_content":"<p class='text-xl text-slate-300 text-center max-w-3xl mx-auto mt-4 leading-relaxed'>NextBlock is the free, open-source AI website builder CMS for teams that want more than a prototype. Point Claude Code, Cursor, or ChatGPT at your site over MCP and prompt the pages you need. You keep a live Next.js 16 and Supabase website with a visual editor your team owns on day two.</p>"}},{"block_type":"button","content":{"url":"/article/how-to-setup-nextblock","size":"lg","text":"Start Free","variant":"default","position":"center"}},{"block_type":"button","content":{"url":"/article/cortex-ai-mcp-connection-guide","size":"lg","text":"Connect Claude or Cursor","variant":"outline","position":"center"}},{"block_type":"text","content":{"html_content":"<div class='flex flex-wrap justify-center gap-6 text-sm uppercase tracking-wide text-slate-400 mt-8'><a href='https://github.com/nextblock-cms' target='_blank' rel='noopener noreferrer' class='hover:text-white transition-colors'>GitHub</a><a href='https://x.com/NextBlockCMS' target='_blank' rel='noopener noreferrer' class='hover:text-white transition-colors'>X</a><a href='https://www.linkedin.com/in/nextblock/' target='_blank' rel='noopener noreferrer' class='hover:text-white transition-colors'>LinkedIn</a><a href='https://dev.to/nextblockcms' target='_blank' rel='noopener noreferrer' class='hover:text-white transition-colors'>Dev.to</a><a href='https://www.npmjs.com/~nextblockcms' target='_blank' rel='noopener noreferrer' class='hover:text-white transition-colors'>npm</a></div>"}}],[{"block_type":"text","content":{"html_content":"<div class='p-10 border border-white/10 rounded-3xl bg-white/5 backdrop-blur-xl shadow-2xl relative overflow-hidden group'><div class='absolute inset-0 bg-gradient-to-br from-blue-500/10 to-purple-500/10 opacity-0 group-hover:opacity-100 transition-opacity duration-500'></div><div class='relative z-10'><p class='text-xs text-white uppercase tracking-widest font-semibold mb-2'>Free forever. AI optional.</p><p class='text-3xl font-bold text-white mb-2'>Free CMS. Paid AI. Your call.</p><p class='text-base text-slate-300 mb-6'>The CMS is 100% free and open source. Cortex AI is the one thing we sell, and it runs on the AI subscription you already have.</p><ul class='space-y-3 text-sm text-slate-200'><li><span class='text-blue-400 mr-2'>&#10003;</span> Unlimited pages, editors, and sites at no cost.</li><li><span class='text-blue-400 mr-2'>&#10003;</span> One Cortex AI license unlocks the copilot and the MCP server.</li><li><span class='text-blue-400 mr-2'>&#10003;</span> No token markup: your Claude or ChatGPT plan does the work.</li></ul><div class='mt-6 rounded-2xl overflow-hidden border border-white/10 shadow-lg'><div class='relative w-full aspect-video'><iframe class='absolute inset-0 h-full w-full border-0' src='https://www.youtube-nocookie.com/embed/71MyfoL4YVM?si=jtlDXV6cSC8rDgz0' title='NextBlock demo video' allow='accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share' referrerpolicy='strict-origin-when-cross-origin' loading='lazy' allowfullscreen></iframe></div></div></div></div>"}}]],"container_type":"container","responsive_columns":{"mobile":1,"tablet":1,"desktop":2},"vertical_alignment":"center"}$nbhero2$::jsonb,
-         updated_at = now()
-   WHERE page_id = v_home
-     AND block_type = 'section'
-     AND content::text LIKE '%Production on day two.%';
-
-  -- "Why" section: comparison chart + pricing tiles replace the two prose cards.
-  UPDATE public.blocks
-     SET content = $nbwhy2${"padding":{"top":"xl","bottom":"xl"},"background":{"type":"none"},"column_gap":"lg","column_blocks":[[{"block_type":"heading","content":{"level":2,"textAlign":"center","text_content":"Why an AI Website Builder CMS Beats Prototype Code."}},{"block_type":"text","content":{"html_content":"<p class='text-lg text-muted-foreground text-center max-w-3xl mx-auto mb-10'>Prompt builders like Lovable, Bolt, and v0 are great at a first draft. Then they hand you code you must host, patch, and rebuild for every copy change. NextBlock takes the same prompts and turns them into a website your whole team can run.</p>"}},{"block_type":"text","content":{"html_content":"<div class='grid gap-6 md:grid-cols-3'><div class='h-full rounded-2xl border border-slate-200 bg-white p-6 shadow-sm transition-colors hover:border-blue-300 dark:border-slate-800 dark:bg-slate-900'><div class='mb-4 flex h-10 w-10 items-center justify-center rounded-xl bg-blue-50 text-xl dark:bg-blue-950'>🧩</div><h3 class='text-lg font-bold text-foreground mb-2'>Prompt to CMS, Not Just Code.</h3><p class='text-sm text-muted-foreground leading-relaxed'>External AI agents scaffold real layouts as typed blocks. Editors then tweak copy, images, and sections in a Notion-style editor. Nobody writes a prompt or touches code to change a headline.</p></div><div class='h-full rounded-2xl border border-slate-200 bg-white p-6 shadow-sm transition-colors hover:border-blue-300 dark:border-slate-800 dark:bg-slate-900'><div class='mb-4 flex h-10 w-10 items-center justify-center rounded-xl bg-blue-50 text-xl dark:bg-blue-950'>🔌</div><h3 class='text-lg font-bold text-foreground mb-2'>Bring Your Own AI Subscription via MCP.</h3><p class='text-sm text-muted-foreground leading-relaxed'>Connect Claude Code, Cursor, ChatGPT, or Gemini straight to /api/mcp. You pay for the AI plan you already have, not a SaaS token markup.</p></div><div class='h-full rounded-2xl border border-slate-200 bg-white p-6 shadow-sm transition-colors hover:border-blue-300 dark:border-slate-800 dark:bg-slate-900'><div class='mb-4 flex h-10 w-10 items-center justify-center rounded-xl bg-blue-50 text-xl dark:bg-blue-950'>⚡</div><h3 class='text-lg font-bold text-foreground mb-2'>Zero-Redeploy JSONB Architecture.</h3><p class='text-sm text-muted-foreground leading-relaxed'>Generated blocks land in PostgreSQL as validated JSONB. Pages publish in seconds with 100/100 Lighthouse defaults and no rebuild.</p></div></div>"}},{"block_type":"text","content":{"html_content":"<div class='mt-12 overflow-hidden rounded-3xl border border-slate-200 bg-white shadow-sm dark:border-slate-800 dark:bg-slate-900'><div class='flex flex-wrap items-end justify-between gap-3 px-5 pt-6 pb-4'><div><p class='text-xs font-semibold uppercase tracking-[0.22em] text-slate-500 dark:text-slate-400'>Side by side</p><p class='mt-1 text-xl font-semibold text-foreground'>Prototype tools versus NextBlock.</p></div><p class='text-xs text-slate-500 dark:text-slate-400'>Lovable, Bolt, and v0 compared on what happens after the first prompt.</p></div><div class='overflow-x-auto'><table class='w-full min-w-[640px] border-collapse'><thead><tr class='bg-slate-50 dark:bg-slate-950/60'><th scope='col' class='px-5 py-3 text-left text-xs font-semibold uppercase tracking-[0.2em] text-slate-500 dark:text-slate-400'>What you get</th><th scope='col' class='px-5 py-3 text-left text-xs font-semibold uppercase tracking-[0.2em] text-rose-600 dark:text-rose-300'>Lovable, Bolt, v0</th><th scope='col' class='bg-emerald-50/60 px-5 py-3 text-left text-xs font-semibold uppercase tracking-[0.2em] text-emerald-700 dark:bg-emerald-500/10 dark:text-emerald-200'>NextBlock</th></tr></thead><tbody><tr class='border-t border-slate-200 dark:border-slate-800'><th scope='row' class='px-5 py-4 text-left align-top text-sm font-semibold text-foreground'>Day one</th><td class='px-5 py-4 align-top text-sm text-muted-foreground'><span class='mr-2 inline-flex h-5 w-5 items-center justify-center rounded-full bg-rose-100 text-xs font-bold text-rose-600 dark:bg-rose-500/20 dark:text-rose-300'>&#10007;</span>Prototype code you host and patch yourself.</td><td class='bg-emerald-50/60 px-5 py-4 align-top text-sm text-foreground dark:bg-emerald-500/10'><span class='mr-2 inline-flex h-5 w-5 items-center justify-center rounded-full bg-emerald-100 text-xs font-bold text-emerald-700 dark:bg-emerald-500/20 dark:text-emerald-200'>&#10003;</span>A live Next.js 16 and Supabase website.</td></tr><tr class='border-t border-slate-200 dark:border-slate-800'><th scope='row' class='px-5 py-4 text-left align-top text-sm font-semibold text-foreground'>Editing after launch</th><td class='px-5 py-4 align-top text-sm text-muted-foreground'><span class='mr-2 inline-flex h-5 w-5 items-center justify-center rounded-full bg-rose-100 text-xs font-bold text-rose-600 dark:bg-rose-500/20 dark:text-rose-300'>&#10007;</span>A new prompt or a pull request for every change.</td><td class='bg-emerald-50/60 px-5 py-4 align-top text-sm text-foreground dark:bg-emerald-500/10'><span class='mr-2 inline-flex h-5 w-5 items-center justify-center rounded-full bg-emerald-100 text-xs font-bold text-emerald-700 dark:bg-emerald-500/20 dark:text-emerald-200'>&#10003;</span>A Notion-style visual editor, no code needed.</td></tr><tr class='border-t border-slate-200 dark:border-slate-800'><th scope='row' class='px-5 py-4 text-left align-top text-sm font-semibold text-foreground'>Drafts and revisions</th><td class='px-5 py-4 align-top text-sm text-muted-foreground'><span class='mr-2 inline-flex h-5 w-5 items-center justify-center rounded-full bg-rose-100 text-xs font-bold text-rose-600 dark:bg-rose-500/20 dark:text-rose-300'>&#10007;</span>Code history only, nothing for content.</td><td class='bg-emerald-50/60 px-5 py-4 align-top text-sm text-foreground dark:bg-emerald-500/10'><span class='mr-2 inline-flex h-5 w-5 items-center justify-center rounded-full bg-emerald-100 text-xs font-bold text-emerald-700 dark:bg-emerald-500/20 dark:text-emerald-200'>&#10003;</span>Live Drafts and one-click restore of any page.</td></tr><tr class='border-t border-slate-200 dark:border-slate-800'><th scope='row' class='px-5 py-4 text-left align-top text-sm font-semibold text-foreground'>Publishing</th><td class='px-5 py-4 align-top text-sm text-muted-foreground'><span class='mr-2 inline-flex h-5 w-5 items-center justify-center rounded-full bg-rose-100 text-xs font-bold text-rose-600 dark:bg-rose-500/20 dark:text-rose-300'>&#10007;</span>Rebuild and redeploy.</td><td class='bg-emerald-50/60 px-5 py-4 align-top text-sm text-foreground dark:bg-emerald-500/10'><span class='mr-2 inline-flex h-5 w-5 items-center justify-center rounded-full bg-emerald-100 text-xs font-bold text-emerald-700 dark:bg-emerald-500/20 dark:text-emerald-200'>&#10003;</span>Instant, straight from PostgreSQL.</td></tr><tr class='border-t border-slate-200 dark:border-slate-800'><th scope='row' class='px-5 py-4 text-left align-top text-sm font-semibold text-foreground'>Translations and SEO</th><td class='px-5 py-4 align-top text-sm text-muted-foreground'><span class='mr-2 inline-flex h-5 w-5 items-center justify-center rounded-full bg-rose-100 text-xs font-bold text-rose-600 dark:bg-rose-500/20 dark:text-rose-300'>&#10007;</span>Not built in.</td><td class='bg-emerald-50/60 px-5 py-4 align-top text-sm text-foreground dark:bg-emerald-500/10'><span class='mr-2 inline-flex h-5 w-5 items-center justify-center rounded-full bg-emerald-100 text-xs font-bold text-emerald-700 dark:bg-emerald-500/20 dark:text-emerald-200'>&#10003;</span>Per-block translation and SEO graded as you type.</td></tr><tr class='border-t border-slate-200 dark:border-slate-800'><th scope='row' class='px-5 py-4 text-left align-top text-sm font-semibold text-foreground'>AI costs</th><td class='px-5 py-4 align-top text-sm text-muted-foreground'><span class='mr-2 inline-flex h-5 w-5 items-center justify-center rounded-full bg-rose-100 text-xs font-bold text-rose-600 dark:bg-rose-500/20 dark:text-rose-300'>&#10007;</span>Platform credits, bought from the tool.</td><td class='bg-emerald-50/60 px-5 py-4 align-top text-sm text-foreground dark:bg-emerald-500/10'><span class='mr-2 inline-flex h-5 w-5 items-center justify-center rounded-full bg-emerald-100 text-xs font-bold text-emerald-700 dark:bg-emerald-500/20 dark:text-emerald-200'>&#10003;</span>Your own subscription over MCP, no markup.</td></tr><tr class='border-t border-slate-200 dark:border-slate-800'><th scope='row' class='px-5 py-4 text-left align-top text-sm font-semibold text-foreground'>Price of the platform</th><td class='px-5 py-4 align-top text-sm text-muted-foreground'><span class='mr-2 inline-flex h-5 w-5 items-center justify-center rounded-full bg-rose-100 text-xs font-bold text-rose-600 dark:bg-rose-500/20 dark:text-rose-300'>&#10007;</span>A monthly plan.</td><td class='bg-emerald-50/60 px-5 py-4 align-top text-sm text-foreground dark:bg-emerald-500/10'><span class='mr-2 inline-flex h-5 w-5 items-center justify-center rounded-full bg-emerald-100 text-xs font-bold text-emerald-700 dark:bg-emerald-500/20 dark:text-emerald-200'>&#10003;</span>Free and open source, forever.</td></tr></tbody></table></div></div>"}},{"block_type":"text","content":{"html_content":"<div class='mt-10 grid gap-4 md:grid-cols-3'><div class='rounded-3xl border border-emerald-200/70 bg-emerald-50/70 p-6 dark:border-emerald-500/20 dark:bg-emerald-500/10'><p class='text-xs font-semibold uppercase tracking-[0.22em] text-emerald-700 dark:text-emerald-200'>Free forever</p><p class='mt-3 text-xl font-semibold text-foreground'>The CMS costs nothing.</p><p class='mt-3 text-sm text-muted-foreground'>The AI website builder CMS is free and open source. Unlimited pages, editors, and sites, self-hosted or on Vercel, with no plan to outgrow.</p></div><div class='rounded-3xl border border-violet-200/70 bg-violet-50/70 p-6 dark:border-violet-500/20 dark:bg-violet-500/10'><p class='text-xs font-semibold uppercase tracking-[0.22em] text-violet-700 dark:text-violet-200'>Cortex AI, when you want it</p><p class='mt-3 text-xl font-semibold text-foreground'>One license, two AI surfaces.</p><p class='mt-3 text-sm text-muted-foreground'>A paid Cortex AI license adds the dashboard copilot and the MCP server. Start without it and add it later. Your content never changes.</p></div><div class='rounded-3xl border border-sky-200/70 bg-sky-50/70 p-6 dark:border-sky-500/20 dark:bg-sky-500/10'><p class='text-xs font-semibold uppercase tracking-[0.22em] text-sky-700 dark:text-sky-200'>No token markup</p><p class='mt-3 text-xl font-semibold text-foreground'>Your plan does the work.</p><p class='mt-3 text-sm text-muted-foreground'>Cortex AI runs on the Claude, ChatGPT, Cursor, or Gemini subscription you already pay for. The license buys the connection, not the tokens.</p></div></div>"}}]],"container_type":"container","responsive_columns":{"mobile":1,"tablet":1,"desktop":1}}$nbwhy2$::jsonb,
-         updated_at = now()
-   WHERE page_id = v_home
-     AND block_type = 'section'
-     AND content::text LIKE '%A codebase to babysit.%';
-
-  -- Cortex promo: "The CMS Is Free. The AI Is the Upgrade."
-  UPDATE public.blocks
-     SET content = $nbcortexpromo2${"padding":{"top":"xl","bottom":"xl"},"background":{"type":"gradient","gradient":{"type":"linear","stops":[{"color":"#1e1b4b","position":0},{"color":"#0f172a","position":100}],"direction":"135deg"}},"column_gap":"xl","column_blocks":[[{"block_type":"text","content":{"html_content":"<p class='text-xs uppercase tracking-[0.3em] text-violet-400 font-semibold mb-4'>Now Available — Cortex AI</p><h2 class='text-4xl md:text-5xl font-bold text-white mb-6 leading-tight'>The CMS Is Free.<br/>The AI Is the Upgrade.</h2><p class='text-lg text-slate-300 max-w-2xl leading-relaxed mb-4'>NextBlock costs nothing and never will. Cortex AI is the one license we sell. It adds a copilot inside the dashboard and an MCP server outside it, so Claude Code, Cursor, ChatGPT, and Gemini can build your site.</p><p class='text-base text-slate-400 max-w-2xl leading-relaxed'>You bring the AI subscription you already pay for. The license buys the connection, never the tokens, and nothing goes live until an editor publishes it.</p>"}},{"block_type":"button","content":{"url":"/article/cortex-ai-mcp-connection-guide","size":"lg","text":"Read the MCP Setup Guide →","variant":"default","position":"left"}},{"block_type":"button","content":{"url":"https://nextblock.dev/product/nextblock-cortex-ai-cortex-ai-license","size":"lg","text":"Get a License","variant":"outline","position":"left"}}],[{"block_type":"text","content":{"html_content":"<div class='grid grid-cols-1 gap-4 sm:grid-cols-3 lg:grid-cols-1'><div class='rounded-2xl border border-violet-500/30 bg-white/5 p-6 text-center'><p class='text-3xl font-extrabold text-white'>$0</p><p class='text-xs uppercase tracking-wider text-violet-200 mt-1'>The CMS, forever</p></div><div class='rounded-2xl border border-violet-500/30 bg-white/5 p-6 text-center'><p class='text-3xl font-extrabold text-white'>1</p><p class='text-xs uppercase tracking-wider text-violet-200 mt-1'>License for copilot and MCP server</p></div><div class='rounded-2xl border border-violet-500/30 bg-white/5 p-6 text-center'><p class='text-3xl font-extrabold text-white'>0 %</p><p class='text-xs uppercase tracking-wider text-violet-200 mt-1'>Token markup</p></div></div>"}}]],"container_type":"container","responsive_columns":{"mobile":1,"tablet":1,"desktop":2},"vertical_alignment":"center"}$nbcortexpromo2$::jsonb,
-         updated_at = now()
-   WHERE page_id = v_home
-     AND block_type = 'section'
-     AND content::text LIKE '%One AI Engine%';
-END
-$body$;
-
--- The MCP guide's featured image (public/images/cortex_post.webp) was
--- replaced with a re-cut 1672x941 version after 037
--- registered it at 2664x1568. The post
--- hero reserves its box from media.width/height, so bring the row in line with the
--- file on disk. Guarded on the values differing.
-UPDATE public.media
-   SET width      = 1672,
-       height     = 941,
-       size_bytes = 503790,
-       updated_at = now()
- WHERE object_key = 'images/cortex_post.webp'
-   AND (width IS DISTINCT FROM 1672
-        OR height IS DISTINCT FROM 941
-        OR size_bytes IS DISTINCT FROM 503790);