clawfire 0.5.0 → 0.6.0

package/dist/dev.js

@@ -1756,7 +1756,29 @@ function generateDashboardHtml(options) {
       <div id="service-grid" style="display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:12px;"></div>
     </div>
 
-    <!-- Section 2: Config Overview -->
+    <!-- Section 2: Deploy -->
+    <div style="margin-bottom:32px;">
+      <h2 style="font-size:18px;font-weight:700;color:#f97316;margin-bottom:16px;">Deploy</h2>
+      <div style="display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:12px;">
+        <div style="padding:16px;border-radius:8px;border:1px solid #2a2a2a;background:#141414;">
+          <div style="display:flex;align-items:center;gap:8px;margin-bottom:8px;">
+            <span style="font-size:16px;">&#127760;</span>
+            <span style="font-weight:600;color:#e5e5e5;">Hosting</span>
+          </div>
+          <div style="font-size:13px;color:#a3a3a3;margin-bottom:12px;">Deploy your app to Firebase Hosting</div>
+          <button id="deploy-hosting-btn" onclick="deployHosting()" style="padding:8px 20px;background:#3b82f6;color:#fff;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;">
+            Deploy Hosting
+          </button>
+          <div id="deploy-hosting-status" style="display:none;margin-top:10px;font-size:13px;padding:10px 14px;border-radius:6px;"></div>
+          <div id="deploy-hosting-url" style="display:none;margin-top:8px;padding:10px 14px;border-radius:6px;background:#0a1a0a;border:1px solid #22c55e;">
+            <div style="font-size:11px;color:#a3a3a3;margin-bottom:4px;">Live URL</div>
+            <a id="deploy-hosting-link" href="#" target="_blank" style="color:#22c55e;font-family:monospace;font-size:14px;text-decoration:none;word-break:break-all;"></a>
+          </div>
+        </div>
+      </div>
+    </div>
+
+    <!-- Section 3: Config Overview -->
     <div style="margin-bottom:32px;">
       <div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;">
         <h2 style="font-size:18px;font-weight:700;color:#f97316;">Config Overview</h2>
@@ -1780,7 +1802,7 @@ function generateDashboardHtml(options) {
       </div>
     </div>
 
-    <!-- Section 3: Environment Variables -->
+    <!-- Section 4: Environment Variables -->
     <div style="margin-bottom:32px;">
       <div style="display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;">
         <h2 style="font-size:18px;font-weight:700;color:#f97316;">Environment Variables</h2>
@@ -2380,16 +2402,22 @@ function generateDashboardHtml(options) {
     var statusColors = { configured: '#22c55e', placeholder: '#eab308', missing: '#666' };
     var statusLabels = { configured: 'Ready', placeholder: 'Needs Setup', missing: 'Not Configured' };
 
+    var enableableServices = { 'Hosting': 'hosting', 'Firestore': 'firestore', 'Storage': 'storage' };
     data.services.forEach(function(svc) {
       var card = document.createElement('div');
       card.style.cssText = 'padding:16px;border-radius:8px;border:1px solid #2a2a2a;background:#141414;';
+      var enableBtn = '';
+      if (svc.status === 'missing' && enableableServices[svc.name]) {
+        enableBtn = '<button onclick="enableService(\\'' + enableableServices[svc.name] + '\\')" style="margin-top:8px;padding:4px 12px;background:#f97316;color:#000;border:none;border-radius:4px;font-size:11px;font-weight:600;cursor:pointer;">Enable</button>';
+      }
       card.innerHTML =
         '<div style="display:flex;align-items:center;gap:8px;margin-bottom:6px;">' +
           '<span style="width:8px;height:8px;border-radius:50%;background:' + statusColors[svc.status] + ';display:inline-block;"></span>' +
           '<span style="font-weight:600;color:#e5e5e5;">' + svc.name + '</span>' +
         '</div>' +
         '<div style="font-size:12px;color:' + statusColors[svc.status] + ';">' + statusLabels[svc.status] + '</div>' +
-        (svc.detail ? '<div style="font-size:11px;color:#666;margin-top:4px;">' + svc.detail + '</div>' : '');
+        (svc.detail ? '<div style="font-size:11px;color:#666;margin-top:4px;">' + svc.detail + '</div>' : '') +
+        enableBtn;
       grid.appendChild(card);
     });
 
@@ -2574,6 +2602,67 @@ function generateDashboardHtml(options) {
     });
   }
 
+  // \u2500\u2500\u2500 Deploy Hosting \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
+  window.deployHosting = function() {
+    var btn = document.getElementById('deploy-hosting-btn');
+    var status = document.getElementById('deploy-hosting-status');
+    var urlBox = document.getElementById('deploy-hosting-url');
+    btn.disabled = true;
+    btn.textContent = 'Deploying...';
+    status.textContent = 'Deploying to Firebase Hosting... This may take up to 2 minutes.';
+    status.style.cssText = 'display:block;margin-top:10px;font-size:13px;padding:10px 14px;border-radius:6px;background:#0a0a1a;border:1px solid #3b82f6;color:#3b82f6;';
+    urlBox.style.display = 'none';
+
+    fetch(API + '/__dev/deploy/hosting', { method: 'POST' })
+    .then(function(r) { return r.json(); })
+    .then(function(data) {
+      if (data.success) {
+        status.textContent = data.message;
+        status.style.cssText = 'display:block;margin-top:10px;font-size:13px;padding:10px 14px;border-radius:6px;background:#0a1a0a;border:1px solid #22c55e;color:#22c55e;';
+        if (data.url) {
+          var link = document.getElementById('deploy-hosting-link');
+          link.href = data.url;
+          link.textContent = data.url;
+          urlBox.style.display = 'block';
+        }
+      } else {
+        status.textContent = data.message;
+        status.style.cssText = 'display:block;margin-top:10px;font-size:13px;padding:10px 14px;border-radius:6px;background:#1c0808;border:1px solid #ef4444;color:#ef4444;';
+      }
+      btn.disabled = false;
+      btn.textContent = 'Deploy Hosting';
+      // Refresh firebase status
+      fetch(API + '/__dev/firebase-status').then(function(r) { return r.json(); }).then(function(d) { renderFirebaseStatus(d); }).catch(function(){});
+    })
+    .catch(function(err) {
+      status.textContent = 'Error: ' + err.message;
+      status.style.cssText = 'display:block;margin-top:10px;font-size:13px;padding:10px 14px;border-radius:6px;background:#1c0808;border:1px solid #ef4444;color:#ef4444;';
+      btn.disabled = false;
+      btn.textContent = 'Deploy Hosting';
+    });
+  };
+
+  // \u2500\u2500\u2500 Enable Service \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
+  window.enableService = function(service) {
+    fetch(API + '/__dev/enable-service', {
+      method: 'POST',
+      headers: { 'Content-Type': 'application/json' },
+      body: JSON.stringify({ service: service })
+    })
+    .then(function(r) { return r.json(); })
+    .then(function(data) {
+      if (data.success) {
+        // Refresh firebase status to show updated service cards
+        fetch(API + '/__dev/firebase-status').then(function(r) { return r.json(); }).then(function(d) { renderFirebaseStatus(d); }).catch(function(){});
+      } else {
+        alert('Failed to enable ' + service + ': ' + data.message);
+      }
+    })
+    .catch(function(err) {
+      alert('Error: ' + err.message);
+    });
+  };
+
   // \u2500\u2500\u2500 Environment Variables \u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500\u2500
   function renderEnvVars(data) {
     envData = data.variables || [];
@@ -3043,6 +3132,113 @@ var FirebaseSetup = class {
     this.saveState({ webAppId: appId, webAppDisplayName: displayName });
     return { success: true, message: `Web app "${displayName}" selected.` };
   }
+  // ─── Deploy ─────────────────────────────────────────────────────────
+  async deployHosting() {
+    const firebaseJsonPath = resolve5(this.projectDir, "firebase.json");
+    if (!existsSync6(firebaseJsonPath)) {
+      return { success: false, message: "firebase.json not found. Enable hosting first." };
+    }
+    try {
+      const config = JSON.parse(readFileSync4(firebaseJsonPath, "utf-8"));
+      if (!config.hosting) {
+        return { success: false, message: "Hosting not configured in firebase.json. Click Enable first." };
+      }
+    } catch {
+      return { success: false, message: "Invalid firebase.json." };
+    }
+    try {
+      const output = await this.execTimeout(
+        "firebase",
+        ["deploy", "--only", "hosting", "--json"],
+        12e4
+        // 2 min timeout
+      );
+      let url = "";
+      try {
+        const data = JSON.parse(output);
+        if (data?.result) {
+          for (const key of Object.keys(data.result)) {
+            if (key.startsWith("hosting") && typeof data.result[key] === "object") {
+              url = data.result[key]?.url || data.result[key]?.site?.url || "";
+              if (url) break;
+            }
+          }
+        }
+      } catch {
+        const urlMatch = output.match(/https:\/\/[a-z0-9-]+\.web\.app/i);
+        if (urlMatch) url = urlMatch[0];
+      }
+      if (!url) {
+        const state = this.loadState();
+        if (state.projectId) {
+          url = `https://${state.projectId}.web.app`;
+        }
+      }
+      return { success: true, url: url || void 0, message: "Hosting deployed successfully!" };
+    } catch (err) {
+      const msg = err instanceof Error ? err.message : "Unknown error";
+      return { success: false, message: `Deploy failed: ${msg}` };
+    }
+  }
+  // ─── Service Enable ────────────────────────────────────────────────
+  enableService(service) {
+    const firebaseJsonPath = resolve5(this.projectDir, "firebase.json");
+    let config = {};
+    if (existsSync6(firebaseJsonPath)) {
+      try {
+        config = JSON.parse(readFileSync4(firebaseJsonPath, "utf-8"));
+      } catch {
+        config = {};
+      }
+    }
+    switch (service) {
+      case "hosting": {
+        if (!config.hosting) {
+          config.hosting = {
+            public: "public",
+            ignore: ["firebase.json", "**/.*", "**/node_modules/**"],
+            rewrites: [{ source: "**", destination: "/index.html" }]
+          };
+        }
+        break;
+      }
+      case "firestore": {
+        if (!config.firestore) {
+          config.firestore = {
+            rules: "firestore.rules",
+            indexes: "firestore.indexes.json"
+          };
+        }
+        const rulesPath = resolve5(this.projectDir, "firestore.rules");
+        if (!existsSync6(rulesPath)) {
+          writeFileSync2(
+            rulesPath,
+            "rules_version = '2';\nservice cloud.firestore {\n  match /databases/{database}/documents {\n    match /{document=**} {\n      allow read, write: if request.auth != null;\n    }\n  }\n}\n"
+          );
+        }
+        const indexesPath = resolve5(this.projectDir, "firestore.indexes.json");
+        if (!existsSync6(indexesPath)) {
+          writeFileSync2(indexesPath, JSON.stringify({ indexes: [], fieldOverrides: [] }, null, 2) + "\n");
+        }
+        break;
+      }
+      case "storage": {
+        if (!config.storage) {
+          config.storage = { rules: "storage.rules" };
+        }
+        const storageRulesPath = resolve5(this.projectDir, "storage.rules");
+        if (!existsSync6(storageRulesPath)) {
+          writeFileSync2(
+            storageRulesPath,
+            "rules_version = '2';\nservice firebase.storage {\n  match /b/{bucket}/o {\n    match /{allPaths=**} {\n      allow read, write: if request.auth != null;\n    }\n  }\n}\n"
+          );
+        }
+        break;
+      }
+    }
+    writeFileSync2(firebaseJsonPath, JSON.stringify(config, null, 2) + "\n", "utf-8");
+    return { success: true, message: `${service} enabled in firebase.json.` };
+  }
   // ─── Helpers ───────────────────────────────────────────────────────
   execTimeout(command, args, timeoutMs) {
     return new Promise((resolve7, reject) => {
@@ -3324,8 +3520,8 @@ var DevServer = class {
       onSetupRoutes: options.onSetupRoutes || (() => {
       })
     };
-    this.routesDir = resolve6(this.options.projectDir, "app/routes");
-    this.schemasDir = resolve6(this.options.projectDir, "app/schemas");
+    this.routesDir = resolve6(this.options.projectDir, "functions/routes");
+    this.schemasDir = resolve6(this.options.projectDir, "functions/schemas");
     this.publicDir = resolve6(this.options.projectDir, "public");
     this.pagesDir = resolve6(this.options.projectDir, "app/pages");
     this.componentsDir = resolve6(this.options.projectDir, "app/components");
@@ -3565,7 +3761,23 @@ function switchTab(tab) {
     // Lazy-load dashboard data on first click
     if (window._loadDashboard) window._loadDashboard();
   }
+  // Persist active tab across reloads (auto-fill writes config \u2192 watcher reloads page)
+  try { localStorage.setItem('clawfire-active-tab', tab); } catch(e) {}
 }
+// Restore saved tab on page load
+(function() {
+  try {
+    var saved = localStorage.getItem('clawfire-active-tab');
+    if (saved === 'dashboard') {
+      var fn = function() { switchTab('dashboard'); };
+      if (document.readyState === 'loading') {
+        document.addEventListener('DOMContentLoaded', fn);
+      } else {
+        fn();
+      }
+    }
+  } catch(e) {}
+})();
 </script>`;
     const liveReloadScript = `
 <script>
@@ -3871,7 +4083,7 @@ ${liveReloadScript}
     }
     console.log("");
     if (watching) {
-      const watchDirs = ["app/routes/", "app/schemas/", "public/"];
+      const watchDirs = ["functions/routes/", "functions/schemas/", "public/"];
       if (pagesActive) watchDirs.push("app/pages/", "app/components/");
       console.log(`  \x1B[35mHot Reload\x1B[0m : \x1B[32mON\x1B[0m`);
       console.log(`  \x1B[2mWatching: ${watchDirs.join(", ")}\x1B[0m`);
@@ -4044,6 +4256,35 @@ ${liveReloadScript}
       });
       return;
     }
+    if (url.pathname === "/__dev/deploy/hosting" && req.method === "POST") {
+      this.firebaseSetup.deployHosting().then((result) => {
+        clearFirebaseStatusCache();
+        sendJson(result);
+      }).catch((err) => sendJson({ success: false, message: err instanceof Error ? err.message : "Failed" }, 500));
+      return;
+    }
+    if (url.pathname === "/__dev/enable-service" && req.method === "POST") {
+      let body = "";
+      req.on("data", (chunk) => {
+        body += chunk;
+      });
+      req.on("end", () => {
+        try {
+          const data = JSON.parse(body);
+          const service = data.service;
+          if (!service || !["hosting", "firestore", "storage"].includes(service)) {
+            sendJson({ success: false, message: "Invalid service. Use: hosting, firestore, storage" }, 400);
+            return;
+          }
+          const result = this.firebaseSetup.enableService(service);
+          clearFirebaseStatusCache();
+          sendJson(result);
+        } catch {
+          sendJson({ success: false, message: "Invalid JSON body" }, 400);
+        }
+      });
+      return;
+    }
     if (url.pathname === "/__dev/setup/select-web-app" && req.method === "POST") {
       let body = "";
       req.on("data", (chunk) => {