cosmolo 0.3.9 → 0.5.0

package/README.md

@@ -24,6 +24,7 @@ a canonical "just add Markdown and go" story without asking you to leave.
 | Component in Markdown | Yes (.svx) | Yes (.mdx) | Yes | No |
 | Config-driven categories | Yes | No | No | No |
 | Headless CMS (JSON API) | Yes | Manual | Manual | Manual |
+| DB migration path | `migrate:db` | No | No | Manual |
 | Learning curve | SvelteKit only | Astro concepts | Vue + Nuxt | SvelteKit only |
 
 **Core principles:**
@@ -53,7 +54,7 @@ bun generate:article
 bun dev
 ```
 
-`cosmolo init` asks two questions — which mode (full UI or server-only) and which adapter (SSG or serverless) — then copies the appropriate route files into your project.
+`cosmolo init` asks two questions — which mode (Full or Slim) and which adapter (SSG, Cloudflare, or Serverless) — then copies the appropriate route files into your project.
 
 ---
 
@@ -272,6 +273,160 @@ Prompts for key (slug), label, and description. Appends the new entry to `config
 
 ---
 
+## Cloudflare
+
+Cosmolo works with any SvelteKit-compatible deployment platform, but it is purpose-built
+around the Cloudflare stack. SvelteKit and Cloudflare Workers are an unusually good fit —
+edge-native rendering, zero cold starts, globally distributed infrastructure, and a generous
+free tier. Cosmolo's CLI removes the usual setup friction so you can go from `init` to
+deployed in minutes.
+
+### One-command Cloudflare setup
+
+```bash
+bunx cosmolo init   # choose "Cloudflare" when prompted for adapter
+```
+
+This single command generates everything needed to deploy:
+
+| Generated file | Purpose |
+|---|---|
+| `svelte.config.js` | Pre-configured with `adapter-cloudflare` |
+| `wrangler.toml` | Project name, `nodejs_compat`, D1 template commented out |
+| `src/app.d.ts` | `App.Platform` with `Env`, `CfProperties`, `ExecutionContext` |
+| `.github/workflows/deploy.yml` | Optional — push-to-`main` deploy via `wrangler-action` |
+
+After init, two commands to go live:
+
+```bash
+bun install && bun add -D @sveltejs/adapter-cloudflare @cloudflare/workers-types
+bun run deploy   # bun run build + wrangler pages deploy
+```
+
+If you opted in to GitHub Actions during init, pushing to `main` triggers the deploy automatically.
+
+### Cloudflare services
+
+| Command | What it sets up |
+|---|---|
+| `cosmolo migrate:db` → option 3 | **D1** — Drizzle schema, CRUD helpers (`getArticlesByCategory`, `getArticlesByTag`, …), D1-backed `+page.server.ts` route files |
+| `cosmolo setup:r2` | **R2** — `wrangler.toml` binding, `src/lib/r2.ts` helper, `/assets/[...key]` edge serving route |
+
+Each command is self-contained — run only the ones you need.
+
+---
+
+## Database Migration
+
+When a file-based Cosmolo site outgrows Markdown — multiple writers, mobile editing,
+a growing team — `migrate:db` converts your content to a database without rewriting
+your application code.
+
+DB support is optional. File-based sites continue to work exactly as before.
+Migration is a one-time operation when you're ready to scale.
+
+```bash
+bunx cosmolo migrate:db
+```
+
+The command is interactive and offers three paths:
+
+| Option | Description |
+|---|---|
+| **1 — Export SQL files** | Generates `cosmolo-migration/*.sql` (CREATE TABLE + INSERT for all articles and categories). Works with any relational database. |
+| **2 — Execute directly** | Executes the same SQL against a local SQLite database. Set `DATABASE_URL=./mysite.db` before running. |
+| **3 — Drizzle + Cloudflare D1** | Full setup: generates Drizzle schema, CRUD helpers, `wrangler.toml` D1 binding, and `drizzle.config.ts`. Runs preflight checks before writing anything. |
+
+### What gets migrated
+
+- **Articles** — all frontmatter fields plus the raw Markdown body. Subdirectory-organized files (e.g. `articles/2024/post.md`) are handled automatically; the slug becomes `2024/post`.
+- **Categories** — from `config/categories.json`
+- **Draft articles** — included in the DB with `draft = 1`; the generated `getArticles()` helper filters them out automatically
+
+### Option 3 — Drizzle + Cloudflare D1
+
+After a preflight check (drizzle installed, wrangler.toml, table conflicts), the following files are generated:
+
+```
+drizzle/schema.ts                            ← Drizzle schema for articles and categories tables
+src/lib/db/articles.ts                       ← getArticles, getArticlesByCategory, getArticlesByTag,
+                                               getArticle, parseArticle, createArticle, updateArticle, deleteArticle
+src/lib/db/categories.ts                     ← getCategories, getCategory, createCategory, updateCategory, deleteCategory
+wrangler.toml                                ← [[d1_databases]] binding added (merged if file exists)
+drizzle.config.ts                            ← drizzle-kit config (dialect: sqlite)
+.dev.vars.example                            ← Cloudflare environment variable reference
+```
+
+Optionally (prompted during setup), the existing `+page.server.ts` route files are replaced with D1-backed versions that read from `platform.env.DB` instead of the Cosmolo virtual module:
+
+```
+src/routes/+page.server.ts                   ← Home page — getArticles + getCategories from D1
+src/routes/articles/[slug]/+page.server.ts   ← Article — getArticle from D1, Markdown rendered with marked
+src/routes/categories/[slug]/+page.server.ts ← Category — getArticlesByCategory from D1
+src/routes/tags/[tag]/+page.server.ts        ← Tag — getArticlesByTag from D1 (json_each query)
+```
+
+The command prints step-by-step instructions after generation:
+1. `bunx wrangler d1 create <db-name>` and copy the `database_id` into `wrangler.toml`
+2. `bunx drizzle-kit generate` to create SQL migration files
+3. `bunx wrangler d1 migrations apply <db-name> --local` to apply locally
+4. Run Option 1 to export seed SQL, then `wrangler d1 execute` to import your articles
+5. `bun add -d @cloudflare/workers-types` for TypeScript support
+6. Add `interface Platform { env: { DB: D1Database } }` to `src/app.d.ts`
+
+### SSR requirement
+
+DB-backed content requires a server-capable adapter. Content in D1 is resolved at
+request time, so `adapter-static` (SSG) is not compatible.
+
+Switch to `adapter-cloudflare` for Cloudflare Pages, or `adapter-node` for a
+self-hosted server:
+
+```diff
+- import adapter from '@sveltejs/adapter-static';
++ import adapter from '@sveltejs/adapter-cloudflare';
+```
+
+The upside: content edits take effect immediately — no rebuild or redeploy needed.
+
+---
+
+## R2 Asset Storage
+
+Add Cloudflare R2 object storage for article images and other binary assets:
+
+```bash
+bunx cosmolo setup:r2
+```
+
+The command asks for a bucket name and binding name, then generates:
+
+```
+src/lib/r2.ts                          ← getR2Asset(bucket, key) helper
+src/routes/assets/[...key]/+server.ts  ← Edge route — serves files directly from R2
+wrangler.toml                          ← [[r2_buckets]] binding appended
+```
+
+After setup:
+
+```bash
+# 1. Create the bucket
+bunx wrangler r2 bucket create <bucket-name>
+
+# 2. Upload an asset
+bunx wrangler r2 object put <bucket-name>/images/photo.jpg --file ./static/images/photo.jpg
+
+# 3. Reference it in templates as /assets/images/photo.jpg
+```
+
+Add the binding type to `src/app.d.ts` (one line):
+
+```ts
+interface Platform { env: { ASSETS: R2Bucket } }
+```
+
+---
+
 ## Headless CMS
 
 Cosmolo can expose your content as static JSON endpoints, making it usable as a
@@ -325,7 +480,7 @@ bun add -D vite @sveltejs/kit
 **1. Create `cosmolo.config.ts`** in your project root
 
 ```typescript
-import { resolveConfig } from 'cosmolo';
+import { resolveConfig } from 'cosmolo/plugin';
 
 export default resolveConfig({
   articlesDir: 'src/content/articles',    // default
@@ -373,10 +528,11 @@ The command asks two questions:
 
 **Adapter**
 
-| Adapter | Effect |
+| Adapter | Generated files |
 |---|---|
-| **SSG** (`adapter-static`) | Also creates `src/routes/+layout.ts` with `export const prerender = true` |
-| **Serverless / SSR** | No layout file — routes render on demand |
+| **SSG** (`adapter-static`) | `svelte.config.js` (adapter-static) + `src/routes/+layout.ts` (`prerender = true`) |
+| **Cloudflare** (`adapter-cloudflare`) | `svelte.config.js` (adapter-cloudflare) + `wrangler.toml` + `src/app.d.ts` (`Platform` type). Optionally `.github/workflows/deploy.yml`. |
+| **Serverless** | No extra files — bring your own adapter (Vercel, Node, etc.) |
 
 If any target file already exists, the command lists every conflict and exits without
 writing anything.

package/dist/cli/index.js

@@ -7,14 +7,22 @@ switch (cmd) {
     case 'generate':
         await (await import('./generate.js')).main();
         break;
+    case 'migrate:db':
+        await (await import('./migrate.js')).main();
+        break;
+    case 'setup:r2':
+        await (await import('./setup/r2.js')).main();
+        break;
     default: {
         const isUnknown = Boolean(cmd);
         if (isUnknown)
             console.error(`Unknown command: ${cmd}\n`);
         console.log('Usage: cosmolo <command>\n');
         console.log('Commands:');
-        console.log('  init                             Scaffold routes into an existing SvelteKit project');
+        console.log('  init                             Scaffold routes and config into a SvelteKit project');
         console.log('  generate [article|page|category] Create content files');
+        console.log('  migrate:db                       Migrate file-based content to a database (D1)');
+        console.log('  setup:r2                         Add Cloudflare R2 bucket for asset storage');
         process.exit(isUnknown ? 1 : 0);
     }
 }

package/dist/cli/init.js

@@ -36,7 +36,21 @@ function destPath(relativePath, projectRoot) {
         .replace(/^lib\//, 'src/lib/');
     return path.join(projectRoot, mapped);
 }
-function injectPackageScripts(projectRoot) {
+function readProjectName(projectRoot) {
+    const pkgPath = path.join(projectRoot, 'package.json');
+    if (fs.existsSync(pkgPath)) {
+        try {
+            const pkg = JSON.parse(fs.readFileSync(pkgPath, 'utf-8'));
+            if (typeof pkg.name === 'string' && pkg.name)
+                return pkg.name;
+        }
+        catch {
+            // fall through
+        }
+    }
+    return 'my-cosmolo-site';
+}
+function injectPackageScripts(projectRoot, adapter) {
     const pkgPath = path.join(projectRoot, 'package.json');
     if (!fs.existsSync(pkgPath))
         return;
@@ -49,6 +63,9 @@ function injectPackageScripts(projectRoot) {
         'generate:page': 'cosmolo generate page',
         'generate:category': 'cosmolo generate category',
     };
+    if (adapter === 'cloudflare') {
+        scripts['deploy'] = 'bun run build && bunx wrangler pages deploy .svelte-kit/cloudflare';
+    }
     for (const [key, val] of Object.entries(scripts)) {
         if (!pkg.scripts[key]) {
             pkg.scripts[key] = val;
@@ -64,6 +81,40 @@ function injectPackageScripts(projectRoot) {
         console.log('  updated  package.json (added cosmolo dependency + generate:* scripts)');
     }
 }
+function svelteConfigContent(adapter) {
+    const pkg = adapter === 'ssg' ? '@sveltejs/adapter-static' : '@sveltejs/adapter-cloudflare';
+    return (`import adapter from '${pkg}';\n` +
+        `import { vitePreprocess } from '@sveltejs/vite-plugin-svelte';\n\n` +
+        `/** @type {import('@sveltejs/kit').Config} */\n` +
+        `const config = {\n` +
+        `\tpreprocess: vitePreprocess(),\n` +
+        `\tkit: {\n` +
+        `\t\tadapter: adapter(),\n` +
+        `\t},\n` +
+        `};\n\n` +
+        `export default config;\n`);
+}
+function githubActionsContent(projectName) {
+    return (`name: Deploy to Cloudflare Pages\n\n` +
+        `on:\n` +
+        `  push:\n` +
+        `    branches: [main]\n\n` +
+        `jobs:\n` +
+        `  deploy:\n` +
+        `    runs-on: ubuntu-latest\n` +
+        `    permissions:\n` +
+        `      contents: read\n` +
+        `      deployments: write\n` +
+        `    steps:\n` +
+        `      - uses: actions/checkout@v4\n` +
+        `      - uses: oven-sh/setup-bun@v2\n` +
+        `      - run: bun install --frozen-lockfile\n` +
+        `      - run: bun run build\n` +
+        `      - uses: cloudflare/wrangler-action@v3\n` +
+        `        with:\n` +
+        `          apiToken: \${{ secrets.CF_API_TOKEN }}\n` +
+        `          command: pages deploy .svelte-kit/cloudflare --project-name=${projectName}\n`);
+}
 // ─── main ─────────────────────────────────────────────────────────────────────
 export async function main() {
     const PROJECT_ROOT = process.cwd();
@@ -82,15 +133,16 @@ export async function main() {
     const mode = modeRaw === '1' ? 'full' : 'slim';
     // ── Adapter selection ───────────────────────────────────────────────────
     console.log('\nChoose your deployment adapter:\n');
-    console.log('  1) SSG              — @sveltejs/adapter-static (Cloudflare Pages static, GitHub Pages, etc.)');
-    console.log('  2) Serverless/SSR   — Cloudflare Workers, Vercel, Node, etc.\n');
+    console.log('  1) SSG         — @sveltejs/adapter-static (GitHub Pages, Cloudflare Pages static, etc.)');
+    console.log('  2) Cloudflare  — @sveltejs/adapter-cloudflare (Workers / Pages SSR)');
+    console.log('  3) Serverless  — Vercel, Node, etc.\n');
     let adapterRaw = '';
-    while (!['1', '2'].includes(adapterRaw)) {
-        adapterRaw = (await ask(rl, 'Adapter [1/2]: ')).trim();
-        if (!['1', '2'].includes(adapterRaw))
-            console.log('  Please enter 1 or 2.');
+    while (!['1', '2', '3'].includes(adapterRaw)) {
+        adapterRaw = (await ask(rl, 'Adapter [1/2/3]: ')).trim();
+        if (!['1', '2', '3'].includes(adapterRaw))
+            console.log('  Please enter 1, 2, or 3.');
     }
-    const isSSG = adapterRaw === '1';
+    const adapter = adapterRaw === '1' ? 'ssg' : adapterRaw === '2' ? 'cloudflare' : 'serverless';
     // ── Collect files ───────────────────────────────────────────────────────
     const sharedFiles = collectFiles(path.join(TEMPLATE_DIR, 'shared'));
     const fullFiles = mode === 'full' ? collectFiles(path.join(TEMPLATE_DIR, 'full')) : [];
@@ -100,6 +152,16 @@ export async function main() {
     ];
     const layoutTsPath = path.join(PROJECT_ROOT, 'src/routes/+layout.ts');
     const layoutTsContent = 'export const prerender = true;\n';
+    const wranglerTomlPath = path.join(PROJECT_ROOT, 'wrangler.toml');
+    const appDtsPath = path.join(PROJECT_ROOT, 'src/app.d.ts');
+    const svelteConfigPath = path.join(PROJECT_ROOT, 'svelte.config.js');
+    const ghaWorkflowPath = path.join(PROJECT_ROOT, '.github', 'workflows', 'deploy.yml');
+    // ── GitHub Actions prompt (Cloudflare only, before conflict detection) ──
+    let generateGha = false;
+    if (adapter === 'cloudflare') {
+        const ans = (await ask(rl, '\nGenerate GitHub Actions deploy workflow? [y/N]: ')).toLowerCase();
+        generateGha = ans === 'y';
+    }
     // ── Conflict detection ──────────────────────────────────────────────────
     const conflicts = [];
     for (const [, rel] of allFiles) {
@@ -107,8 +169,21 @@ export async function main() {
         if (fs.existsSync(dest))
             conflicts.push(path.relative(PROJECT_ROOT, dest));
     }
-    if (isSSG && fs.existsSync(layoutTsPath)) {
-        conflicts.push(path.relative(PROJECT_ROOT, layoutTsPath));
+    if (adapter === 'ssg') {
+        if (fs.existsSync(layoutTsPath))
+            conflicts.push(path.relative(PROJECT_ROOT, layoutTsPath));
+        if (fs.existsSync(svelteConfigPath))
+            conflicts.push('svelte.config.js');
+    }
+    if (adapter === 'cloudflare') {
+        if (fs.existsSync(wranglerTomlPath))
+            conflicts.push('wrangler.toml');
+        if (fs.existsSync(appDtsPath))
+            conflicts.push('src/app.d.ts');
+        if (fs.existsSync(svelteConfigPath))
+            conflicts.push('svelte.config.js');
+        if (generateGha && fs.existsSync(ghaWorkflowPath))
+            conflicts.push('.github/workflows/deploy.yml');
     }
     if (conflicts.length > 0) {
         console.log('\nThe following files already exist:\n');
@@ -133,27 +208,104 @@ export async function main() {
         copyFile(src, dest);
         console.log(`  created  ${path.relative(PROJECT_ROOT, dest)}`);
     }
-    if (isSSG) {
+    if (adapter === 'ssg') {
         writeFile(layoutTsPath, layoutTsContent);
         console.log(`  created  src/routes/+layout.ts`);
+        writeFile(svelteConfigPath, svelteConfigContent('ssg'));
+        console.log(`  created  svelte.config.js`);
     }
-    injectPackageScripts(PROJECT_ROOT);
+    if (adapter === 'cloudflare') {
+        writeFile(svelteConfigPath, svelteConfigContent('cloudflare'));
+        console.log(`  created  svelte.config.js`);
+        const projectName = readProjectName(PROJECT_ROOT);
+        const wranglerToml = [
+            `name = "${projectName}"`,
+            `compatibility_date = "${new Date().toISOString().slice(0, 10)}"`,
+            `compatibility_flags = ["nodejs_compat"]`,
+            ``,
+            `# Uncomment to add Cloudflare D1 (run: bunx cosmolo migrate:db)`,
+            `# [[d1_databases]]`,
+            `# binding = "DB"`,
+            `# database_name = "${projectName}-db"`,
+            `# database_id   = ""  # fill in after: bunx wrangler d1 create ${projectName}-db`,
+        ].join('\n') + '\n';
+        writeFile(wranglerTomlPath, wranglerToml);
+        console.log(`  created  wrangler.toml`);
+        const appDts = [
+            `// See https://svelte.dev/docs/kit/types#app.d.ts`,
+            `// Install @cloudflare/workers-types for full type support:`,
+            `//   bun add -D @cloudflare/workers-types`,
+            `declare global {`,
+            `\tnamespace App {`,
+            `\t\tinterface Platform {`,
+            `\t\t\tenv: Env;`,
+            `\t\t\tcf: CfProperties;`,
+            `\t\t\tctx: ExecutionContext;`,
+            `\t\t}`,
+            `\t}`,
+            `}`,
+            ``,
+            `export {};`,
+        ].join('\n') + '\n';
+        writeFile(appDtsPath, appDts);
+        console.log(`  created  src/app.d.ts`);
+        if (generateGha) {
+            writeFile(ghaWorkflowPath, githubActionsContent(projectName));
+            console.log(`  created  .github/workflows/deploy.yml`);
+        }
+    }
+    injectPackageScripts(PROJECT_ROOT, adapter);
     // ── Next steps ──────────────────────────────────────────────────────────
     console.log('\nDone! Next steps:\n');
     console.log('  1. Run:              bun install');
-    if (isSSG) {
+    if (adapter === 'ssg') {
         console.log('  2. Install adapter:  bun add -D @sveltejs/adapter-static');
+        if (mode === 'full') {
+            console.log('  3. Install sass:     bun add -D sass  (SCSS used in Svelte templates)');
+            console.log('  4. Run:              bun dev');
+        }
+        else {
+            console.log('  3. Add your own +page.svelte files for each route.');
+            console.log('  4. Run:              bun dev');
+        }
     }
-    else {
-        console.log('  2. Install adapter:  bun add -D @sveltejs/adapter-cloudflare  (or your adapter)');
-    }
-    if (mode === 'full') {
-        console.log('  3. Install sass:     bun add -D sass  (SCSS used in Svelte templates)');
-        console.log('  4. Run:              bun dev');
+    else if (adapter === 'cloudflare') {
+        console.log('  2. Install adapter:  bun add -D @sveltejs/adapter-cloudflare');
+        console.log('  3. Install types:    bun add -D @cloudflare/workers-types');
+        if (generateGha) {
+            console.log('  4. Add secret to GitHub repo:  CF_API_TOKEN  (Cloudflare API token)');
+            if (mode === 'full') {
+                console.log('  5. Install sass:     bun add -D sass  (SCSS used in Svelte templates)');
+                console.log('  6. Push to main — GitHub Actions will build and deploy automatically.');
+            }
+            else {
+                console.log('  5. Add your own +page.svelte files for each route.');
+                console.log('  6. Push to main — GitHub Actions will build and deploy automatically.');
+            }
+        }
+        else {
+            if (mode === 'full') {
+                console.log('  4. Install sass:     bun add -D sass  (SCSS used in Svelte templates)');
+                console.log('  5. Run:              bunx wrangler dev  (or bun dev for local Vite)');
+                console.log('  6. Deploy:           bun run deploy');
+            }
+            else {
+                console.log('  4. Add your own +page.svelte files for each route.');
+                console.log('  5. Run:              bunx wrangler dev  (or bun dev for local Vite)');
+                console.log('  6. Deploy:           bun run deploy');
+            }
+        }
     }
     else {
-        console.log('  3. Add your own +page.svelte files for each route.');
-        console.log('  4. Run:              bun dev');
+        console.log('  2. Install adapter:  bun add -D @sveltejs/adapter-vercel  (or your adapter)');
+        if (mode === 'full') {
+            console.log('  3. Install sass:     bun add -D sass  (SCSS used in Svelte templates)');
+            console.log('  4. Run:              bun dev');
+        }
+        else {
+            console.log('  3. Add your own +page.svelte files for each route.');
+            console.log('  4. Run:              bun dev');
+        }
     }
     console.log('\n  See https://github.com/alcogy/cosmolo for full documentation.\n');
 }

package/dist/cli/migrate/drizzle-setup.d.ts

@@ -0,0 +1,2 @@
+import type { ResolvedCosmoloConfig } from '../../types.js';
+export declare function drizzleSetup(_config: ResolvedCosmoloConfig): Promise<void>;