@micropage-sh/cli 2.0.0

package/src/commands/files.js

@@ -0,0 +1,225 @@
+'use strict';
+
+const fs = require('fs');
+const path = require('path');
+const { fn, handleAuthError } = require('../supabase');
+const { getProjectConfig } = require('../auth');
+const { formatTable, formatDate, formatBytes } = require('../utils');
+
+function safeAssetFilename(filename) {
+  if (filename == null || typeof filename !== 'string') return null;
+  const base = path.basename(String(filename).replace(/\\/g, '/'));
+  if (!base || base === '.' || base === '..') return null;
+  return base;
+}
+
+async function downloadFileBytes(fileId) {
+  const urlData = await fn.invokeGet('get-file-url', { file_id: fileId });
+  const fileUrl = urlData?.url;
+  if (!fileUrl) throw new Error('No URL in response');
+  const res = await fetch(fileUrl);
+  if (!res.ok) throw new Error(`HTTP ${res.status}`);
+  return Buffer.from(await res.arrayBuffer());
+}
+
+/**
+ * Sync remote project files to ./assets (1:1 with list-files: every row is written;
+ * optional prune removes local files not present remotely).
+ *
+ * @returns {{ downloaded: number, removed: number, skipped: number, errors: { name: string, message: string }[], totalRemote: number }}
+ */
+async function syncAssets(cwd, options = {}) {
+  const projectId = options.projectId ?? getProjectConfig(cwd)?.projectId;
+  if (projectId == null) {
+    const err = new Error(
+      'Not in a project folder. Run from a folder with .micropage/project.json',
+    );
+    err.code = 'NO_PROJECT';
+    throw err;
+  }
+
+  const data = await fn.invokeGet('list-files', { project_id: projectId });
+  const files = data?.files || [];
+  const assetsDir = path.join(cwd, 'assets');
+  fs.mkdirSync(assetsDir, { recursive: true });
+
+  const remoteBasenames = new Set();
+  let downloaded = 0;
+  let skipped = 0;
+  const errors = [];
+  const seenNames = new Set();
+
+  for (const f of files) {
+    const name = safeAssetFilename(f.filename);
+    if (!name || f.id == null) {
+      skipped += 1;
+      continue;
+    }
+    if (seenNames.has(name) && !options.quiet) {
+      console.warn(`Warning: duplicate filename in storage "${name}" — last row wins locally.`);
+    }
+    seenNames.add(name);
+    remoteBasenames.add(name);
+    try {
+      const buf = await downloadFileBytes(f.id);
+      fs.writeFileSync(path.join(assetsDir, name), buf);
+      downloaded += 1;
+      if (!options.quiet) console.log(`  ${name}`);
+    } catch (e) {
+      errors.push({ name, message: e.message || String(e) });
+    }
+  }
+
+  let removed = 0;
+  if (options.prune !== false && fs.existsSync(assetsDir)) {
+    for (const e of fs.readdirSync(assetsDir, { withFileTypes: true })) {
+      if (!e.isFile()) continue;
+      if (!remoteBasenames.has(e.name)) {
+        fs.unlinkSync(path.join(assetsDir, e.name));
+        removed += 1;
+      }
+    }
+  }
+
+  return {
+    downloaded,
+    removed,
+    skipped,
+    errors,
+    totalRemote: files.length,
+  };
+}
+
+async function syncCli(options = {}) {
+  const cwd = process.cwd();
+  try {
+    const r = await syncAssets(cwd, { quiet: options.quiet, prune: true });
+    if (r.errors.length > 0) {
+      for (const e of r.errors) {
+        console.error(`Failed to download ${e.name}: ${e.message}`);
+      }
+      process.exit(1);
+    }
+    if (!options.quiet) {
+      if (r.skipped > 0) {
+        console.warn(`Skipped ${r.skipped} remote row(s) with missing id or filename.`);
+      }
+      const parts = [`${r.downloaded} file(s) match storage`];
+      if (r.removed > 0) parts.push(`${r.removed} extra local file(s) removed`);
+      console.log(parts.join('; ') + '.');
+    }
+  } catch (err) {
+    handleAuthError(err);
+    if (err.code === 'NO_PROJECT') console.error(err.message);
+    else console.error('Sync failed:', err.message);
+    process.exit(1);
+  }
+}
+
+async function list(options = {}) {
+  const cwd = process.cwd();
+  const config = getProjectConfig(cwd);
+  if (!config?.projectId) {
+    console.error('Not in a project folder. Run from a folder with .micropage/project.json');
+    process.exit(1);
+  }
+
+  let data;
+  try {
+    data = await fn.invokeGet('list-files', { project_id: config.projectId });
+  } catch (err) {
+    handleAuthError(err);
+    console.error('Failed to list files:', err.message);
+    process.exit(1);
+  }
+
+  const files = data?.files || [];
+  if (files.length === 0) {
+    console.log('No files uploaded for this project.');
+    return;
+  }
+
+  if (options.json) {
+    console.log(JSON.stringify(files, null, 2));
+    return;
+  }
+
+  console.log(
+    `Storage: ${formatBytes(data.total_bytes || 0)} / ${data.space_available_mb || 100} MB used\n`
+  );
+
+  const rows = files.map((f) => [
+    f.filename || '-',
+    f.mime_type || '-',
+    formatBytes(f.size_bytes),
+    formatDate(f.created_at),
+  ]);
+  formatTable(rows, ['Filename', 'Type', 'Size', 'Uploaded']);
+}
+
+async function url(filename, options = {}) {
+  const cwd = process.cwd();
+  const config = getProjectConfig(cwd);
+  if (!config?.projectId) {
+    console.error('Not in a project folder. Run from a folder with .micropage/project.json');
+    process.exit(1);
+  }
+
+  // Find the file ID by listing files and matching filename
+  let data;
+  try {
+    data = await fn.invokeGet('list-files', { project_id: config.projectId });
+  } catch (err) {
+    handleAuthError(err);
+    console.error('Failed to list files:', err.message);
+    process.exit(1);
+  }
+
+  const files = data?.files || [];
+  const file = files.find((f) => f.filename === filename);
+  if (!file) {
+    console.error(`File not found: ${filename}`);
+    process.exit(1);
+  }
+
+  let urlData;
+  try {
+    urlData = await fn.invokeGet('get-file-url', { file_id: file.id });
+  } catch (err) {
+    handleAuthError(err);
+    console.error('Failed to get file URL:', err.message);
+    process.exit(1);
+  }
+
+  const fileUrl = urlData?.url;
+  if (!fileUrl) {
+    console.error('Could not retrieve URL for this file.');
+    process.exit(1);
+  }
+
+  console.log(fileUrl);
+
+  if (options.copy) {
+    try {
+      const { execSync } = require('child_process');
+      // Try xclip, xsel, wl-copy, pbcopy in order
+      const cmds = ['xclip -selection clipboard', 'xsel --clipboard --input', 'wl-copy', 'pbcopy'];
+      for (const cmd of cmds) {
+        try {
+          const [prog] = cmd.split(' ');
+          execSync(`which ${prog}`, { stdio: 'ignore' });
+          execSync(cmd, { input: fileUrl });
+          console.log('URL copied to clipboard.');
+          return;
+        } catch {
+          // try next
+        }
+      }
+      console.log('(Could not copy to clipboard – copy manually above)');
+    } catch {
+      // ignore
+    }
+  }
+}
+
+module.exports = { list, url, syncAssets, sync: syncCli };

package/src/commands/forms.js

@@ -0,0 +1,71 @@
+'use strict';
+
+const { db, handleAuthError } = require('../supabase');
+const { getProjectConfig } = require('../auth');
+const { formatTable, formatDate } = require('../utils');
+
+async function list(options = {}) {
+  const cwd = process.cwd();
+  const config = getProjectConfig(cwd);
+  if (!config?.projectId) {
+    console.error('Not in a project folder. Run from a folder with .micropage/project.json');
+    process.exit(1);
+  }
+
+  let forms;
+  try {
+    forms = await db
+      .from('forms')
+      .select('id,form_name,page_url,is_footer,created_at')
+      .eq('project_id', config.projectId)
+      .order('created_at', 'asc')
+      .get();
+  } catch (err) {
+    handleAuthError(err);
+    console.error('Failed to list forms:', err.message);
+    process.exit(1);
+  }
+
+  if (!Array.isArray(forms) || forms.length === 0) {
+    console.log('No forms found for this project.');
+    return;
+  }
+
+  // Count submissions per form_id
+  let submissions;
+  try {
+    submissions = await db
+      .from('form_submissions')
+      .select('form_id')
+      .eq('project_id', config.projectId)
+      .get();
+  } catch (err) {
+    handleAuthError(err);
+    console.error('Failed to fetch submission counts:', err.message);
+    process.exit(1);
+  }
+
+  const counts = {};
+  if (Array.isArray(submissions)) {
+    for (const s of submissions) {
+      if (s.form_id) counts[s.form_id] = (counts[s.form_id] || 0) + 1;
+    }
+  }
+
+  if (options.json) {
+    const out = forms.map((f) => ({ ...f, submission_count: counts[f.id] || 0 }));
+    console.log(JSON.stringify(out, null, 2));
+    return;
+  }
+
+  const rows = forms.map((f) => [
+    f.form_name,
+    f.page_url,
+    f.is_footer ? 'footer' : 'inline',
+    String(counts[f.id] || 0),
+    formatDate(f.created_at),
+  ]);
+  formatTable(rows, ['Form', 'Page URL', 'Type', 'Submissions', 'Created']);
+}
+
+module.exports = { list };

package/src/commands/links.js

@@ -0,0 +1,107 @@
+'use strict';
+
+const { execSync } = require('child_process');
+const { db, handleAuthError } = require('../supabase');
+const { getProjectConfig } = require('../auth');
+const { APP_URL } = require('../config');
+
+function projectUrl(domain) {
+  if (!domain) return null;
+  if (domain.startsWith('http')) return domain;
+  return `https://${domain}.pages.dev`;
+}
+
+function copyToClipboard(text) {
+  const cmds = [
+    'xclip -selection clipboard',
+    'xsel --clipboard --input',
+    'wl-copy',
+    'pbcopy',
+  ];
+  for (const cmd of cmds) {
+    const [prog] = cmd.split(' ');
+    try {
+      execSync(`which ${prog}`, { stdio: 'ignore' });
+      execSync(cmd, { input: text });
+      return true;
+    } catch {
+      // try next
+    }
+  }
+  return false;
+}
+
+async function getProject(cwd) {
+  const config = getProjectConfig(cwd);
+  if (!config?.projectId) {
+    console.error('Not in a project folder. Run from a folder with .micropage/project.json');
+    process.exit(1);
+  }
+
+  try {
+    const project = await db
+      .from('projects')
+      .select('id,name,domain')
+      .eq('id', config.projectId)
+      .single();
+    return project || config;
+  } catch (err) {
+    handleAuthError(err);
+    // Fall back to cached config
+    return config;
+  }
+}
+
+// micropage preview  – open the live site in the browser
+async function preview() {
+  const cwd = process.cwd();
+  const project = await getProject(cwd);
+  const url = projectUrl(project.domain);
+
+  if (!url) {
+    console.error('No domain set for this project. Publish first.');
+    process.exit(1);
+  }
+
+  console.log(url);
+  try {
+    const { default: open } = await import('open');
+    await open(url);
+  } catch {
+    console.log('(Could not open browser automatically)');
+  }
+}
+
+// micropage copy-link  – copy project URL to clipboard
+async function copyLink() {
+  const cwd = process.cwd();
+  const project = await getProject(cwd);
+  const url = projectUrl(project.domain);
+
+  if (!url) {
+    console.error('No domain set for this project. Publish first.');
+    process.exit(1);
+  }
+
+  console.log(url);
+  const copied = copyToClipboard(url);
+  if (copied) {
+    console.log('URL copied to clipboard.');
+  } else {
+    console.log('(Could not copy to clipboard – copy manually above)');
+  }
+}
+
+// micropage open-pricing  – open the pricing page in the browser
+async function openPricing() {
+  const url = `${APP_URL}/pricing`;
+  console.log(url);
+  try {
+    const { default: open } = await import('open');
+    await open(url);
+  } catch {
+    console.log('(Could not open browser automatically)');
+  }
+}
+
+module.exports = { preview, copyLink, openPricing };

package/src/commands/login.js

@@ -0,0 +1,255 @@
+'use strict';
+
+const http = require('http');
+const { randomBytes } = require('crypto');
+const { setSession, getSession } = require('../auth');
+const { getUserInfo, getValidAccessToken } = require('../supabase');
+const { APP_URL, SUPABASE_URL, SUPABASE_ANON_KEY } = require('../config');
+
+// Find an available ephemeral port by briefly binding to port 0.
+function getFreePort() {
+  return new Promise((resolve, reject) => {
+    const server = http.createServer();
+    server.listen(0, '127.0.0.1', () => {
+      const { port } = server.address();
+      server.close(() => resolve(port));
+    });
+    server.on('error', reject);
+  });
+}
+
+const PAGE_SHELL = (title, body) => `<!DOCTYPE html>
+<html lang="en">
+<head>
+  <meta charset="UTF-8">
+  <meta name="viewport" content="width=device-width, initial-scale=1">
+  <title>${title}</title>
+  <link rel="preconnect" href="https://fonts.googleapis.com">
+  <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+  <link href="https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600&display=swap" rel="stylesheet">
+  <style>
+    *, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
+
+    :root {
+      --login-bg: linear-gradient(160deg, #f0f2f5 0%, #e4e8ec 100%);
+      --login-card-bg: #ffffff;
+      --login-card-border: rgba(0, 0, 0, 0.06);
+      --login-card-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
+      --login-heading-color: #1a1a1a;
+      --login-text-muted: #6b7280;
+    }
+
+    @media (prefers-color-scheme: dark) {
+      :root {
+        --login-bg: linear-gradient(160deg, #1f2937 0%, #111827 100%);
+        --login-card-bg: #374151;
+        --login-card-border: rgba(255, 255, 255, 0.08);
+        --login-card-shadow: 0 8px 24px rgba(0, 0, 0, 0.4);
+        --login-heading-color: #f9fafb;
+        --login-text-muted: #9ca3af;
+      }
+    }
+
+    html, body {
+      height: 100%;
+      font-family: "Inter", system-ui, sans-serif;
+      background: var(--login-bg);
+      color: var(--login-heading-color);
+    }
+
+    .login-container {
+      min-height: 100%;
+      display: flex;
+      justify-content: center;
+      align-items: flex-start;
+      padding: 3rem 1rem;
+    }
+
+    .login-box {
+      background: var(--login-card-bg);
+      padding: 2.5rem 3rem;
+      border-radius: 12px;
+      box-shadow: var(--login-card-shadow);
+      border: 1px solid var(--login-card-border);
+      text-align: center;
+      min-width: 280px;
+      max-width: 400px;
+      width: 100%;
+    }
+
+    .app-brand {
+      font-size: 1.8rem;
+      margin-bottom: 1.5rem;
+      color: var(--login-heading-color);
+      font-weight: 300;
+    }
+    .app-brand strong { font-weight: 600; }
+
+    .login-subtitle {
+      color: var(--login-text-muted);
+      margin-bottom: 1.5rem;
+      font-size: 1rem;
+      line-height: 1.5;
+    }
+
+    .status-icon {
+      font-size: 2.5rem;
+      margin-bottom: 1rem;
+      line-height: 1;
+    }
+
+    .alert {
+      border-radius: 8px;
+      padding: 0.9rem 1.1rem;
+      font-size: 0.9rem;
+      margin-bottom: 1rem;
+    }
+    .alert-success {
+      background: #d1fae5;
+      color: #065f46;
+      border: 1px solid #6ee7b7;
+    }
+    .alert-danger {
+      background: #fee2e2;
+      color: #991b1b;
+      border: 1px solid #fca5a5;
+    }
+    @media (prefers-color-scheme: dark) {
+      .alert-success { background: #064e3b; color: #6ee7b7; border-color: #065f46; }
+      .alert-danger  { background: #7f1d1d; color: #fca5a5; border-color: #991b1b; }
+    }
+
+    .hint {
+      color: var(--login-text-muted);
+      font-size: 0.85rem;
+      margin-top: 1rem;
+    }
+    .hint code {
+      background: rgba(0,0,0,0.06);
+      border-radius: 4px;
+      padding: 0.1em 0.35em;
+      font-size: 0.9em;
+    }
+    @media (prefers-color-scheme: dark) {
+      .hint code { background: rgba(255,255,255,0.1); }
+    }
+  </style>
+</head>
+<body>
+  <div class="login-container">
+    <div class="login-box">
+      <div class="app-brand"><strong>micro</strong>page</div>
+      ${body}
+    </div>
+  </div>
+</body>
+</html>`;
+
+const SUCCESS_HTML = PAGE_SHELL(
+  'micropage CLI – authenticated',
+  `<div class="status-icon">✓</div>
+      <div class="alert alert-success">You're logged in!</div>
+      <p class="hint">Return to your terminal. You can close this tab.</p>`
+);
+
+const ERROR_HTML = (msg) => PAGE_SHELL(
+  'micropage CLI – error',
+  `<div class="status-icon">✕</div>
+      <div class="alert alert-danger">${msg}</div>
+      <p class="hint">Close this tab and run <code>micropage login</code> again.</p>`
+);
+
+async function run(options = {}) {
+  if (!options.force) {
+    const existing = getSession();
+    if (existing) {
+      try {
+        await getValidAccessToken();
+        const email = existing.user?.email || 'unknown';
+        console.log(`Already logged in as ${email}.`);
+        console.log('Use --force to re-authenticate.');
+        return;
+      } catch {
+        // Token expired or refresh failed — fall through to re-login
+      }
+    }
+  }
+
+  const state = randomBytes(16).toString('hex');
+  const port = await getFreePort();
+  const loginUrl = `${APP_URL}/cli-auth?state=${state}&port=${port}`;
+
+  let resolveLogin, rejectLogin;
+  const loginPromise = new Promise((res, rej) => {
+    resolveLogin = res;
+    rejectLogin = rej;
+  });
+
+  const server = http.createServer((req, res) => {
+    const url = new URL(req.url, `http://127.0.0.1:${port}`);
+
+    if (url.pathname !== '/callback') {
+      res.writeHead(404);
+      res.end();
+      return;
+    }
+
+    const receivedState = url.searchParams.get('state');
+    const accessToken = url.searchParams.get('access_token');
+    const refreshToken = url.searchParams.get('refresh_token');
+
+    if (!receivedState || receivedState !== state) {
+      res.writeHead(400, { 'Content-Type': 'text/html' });
+      res.end(ERROR_HTML('Invalid state parameter.'));
+      rejectLogin(new Error('State mismatch – possible security issue'));
+      return;
+    }
+
+    if (!accessToken || !refreshToken) {
+      res.writeHead(400, { 'Content-Type': 'text/html' });
+      res.end(ERROR_HTML('Missing authentication tokens.'));
+      rejectLogin(new Error('Missing tokens in callback'));
+      return;
+    }
+
+    res.writeHead(200, { 'Content-Type': 'text/html' });
+    res.end(SUCCESS_HTML);
+    resolveLogin({ access_token: accessToken, refresh_token: refreshToken });
+  });
+
+  server.listen(port, '127.0.0.1', async () => {
+    console.log('Opening browser for authentication…');
+    console.log(`If the browser does not open, visit:\n  ${loginUrl}\n`);
+
+    try {
+      const { default: open } = await import('open');
+      await open(loginUrl);
+    } catch {
+      // Browser open is best-effort; user can navigate manually.
+    }
+  });
+
+  const timeout = setTimeout(() => {
+    server.close();
+    rejectLogin(new Error('Login timed out after 5 minutes. Try again.'));
+  }, 5 * 60 * 1000);
+
+  try {
+    const { access_token, refresh_token } = await loginPromise;
+    clearTimeout(timeout);
+    server.close();
+
+    const user = await getUserInfo(access_token);
+    setSession({ access_token, refresh_token, user });
+
+    const displayName = user?.email || user?.user_metadata?.user_name || 'unknown';
+    console.log(`Logged in as ${displayName}`);
+  } catch (err) {
+    clearTimeout(timeout);
+    server.close();
+    console.error('Login failed:', err.message);
+    process.exit(1);
+  }
+}
+
+module.exports = { run };

package/src/commands/logout.js

@@ -0,0 +1,16 @@
+'use strict';
+
+const { clearSession, getSession } = require('../auth');
+
+function run() {
+  const session = getSession();
+  if (!session) {
+    console.log('Not currently logged in.');
+    return;
+  }
+  clearSession();
+  const email = session.user?.email || 'unknown';
+  console.log(`Logged out (was: ${email}).`);
+}
+
+module.exports = { run };