openclacky 1.3.1 → 1.3.3

data/lib/clacky/web/features/tasks/view.js

@@ -0,0 +1,241 @@
+// ── Tasks · view — rendering, DOM event wiring ─────────────────────────────
+//
+// Owns everything that touches the DOM: the task table, sidebar label, panel
+// wiring. Reads data through TasksStore.state and reacts to store events via
+// Tasks.on(...). Calls store actions; never fetches data itself.
+//
+// Augments the `Tasks` facade with the UI methods other modules invoke
+// (onPanelShow / renderSection / renderTable).
+//
+// Depends on: TasksStore, I18n/Router, global $ / escapeHtml helpers.
+// ───────────────────────────────────────────────────────────────────────────
+
+const TasksView = (() => {
+
+  function _humanCron(cron) {
+    if (!cron) return cron;
+    const parts = cron.trim().split(/\s+/);
+    if (parts.length !== 5) return cron;
+    const [min, hour, dom, month, dow] = parts;
+
+    const isAny = v => v === "*";
+    const isNum = v => /^\d+$/.test(v);
+    const pad   = n => String(n).padStart(2, "0");
+
+    const lang = (typeof I18n !== "undefined" && I18n.lang()) || "zh";
+    const isZh = lang === "zh";
+
+    const dowNames = isZh
+      ? ["周日","周一","周二","周三","周四","周五","周六"]
+      : ["Sun","Mon","Tue","Wed","Thu","Fri","Sat"];
+
+    const monthNames = isZh
+      ? ["1月","2月","3月","4月","5月","6月","7月","8月","9月","10月","11月","12月"]
+      : ["Jan","Feb","Mar","Apr","May","Jun","Jul","Aug","Sep","Oct","Nov","Dec"];
+
+    const timeStr = (isNum(hour) && isNum(min)) ? `${pad(hour)}:${pad(min)}` : null;
+
+    if (min.startsWith("*/") && isAny(hour) && isAny(dom) && isAny(month) && isAny(dow)) {
+      const n = min.slice(2);
+      return isZh ? `每 ${n} 分钟` : `Every ${n} min`;
+    }
+    if ((isAny(min) || isNum(min)) && hour.startsWith("*/") && isAny(dom) && isAny(month) && isAny(dow)) {
+      const n = hour.slice(2);
+      return isZh ? `每 ${n} 小时` : `Every ${n} hr`;
+    }
+    if (isAny(min) && isAny(hour) && isAny(dom) && isAny(month) && isAny(dow)) {
+      return isZh ? "每分钟" : "Every minute";
+    }
+    if (isNum(min) && isAny(hour) && isAny(dom) && isAny(month) && isAny(dow)) {
+      return isZh ? `每小时 :${pad(min)}` : `Hourly at :${pad(min)}`;
+    }
+    if (timeStr && isAny(dom) && isAny(month) && isNum(dow)) {
+      const d = dowNames[parseInt(dow, 10)] || dow;
+      return isZh ? `每${d} ${timeStr}` : `${d} ${timeStr}`;
+    }
+    if (timeStr && isAny(dom) && isAny(month) && dow === "1-5") {
+      return isZh ? `工作日 ${timeStr}` : `Weekdays ${timeStr}`;
+    }
+    if (timeStr && isAny(dom) && isAny(month) && (dow === "0,6" || dow === "6,0")) {
+      return isZh ? `周末 ${timeStr}` : `Weekends ${timeStr}`;
+    }
+    if (timeStr && isAny(dom) && isAny(month) && isAny(dow)) {
+      return isZh ? `每天 ${timeStr}` : `Daily ${timeStr}`;
+    }
+    if (timeStr && isNum(dom) && isAny(month) && isAny(dow)) {
+      return isZh ? `每月 ${dom} 日 ${timeStr}` : `Monthly day ${dom} ${timeStr}`;
+    }
+    if (timeStr && isNum(dom) && isNum(month) && isAny(dow)) {
+      const m = monthNames[parseInt(month, 10) - 1] || month;
+      return isZh ? `${m}${dom}日 ${timeStr}` : `${m} ${dom} ${timeStr}`;
+    }
+
+    return cron;
+  }
+
+  function _renderTaskRow(t) {
+    const row = document.createElement("div");
+    row.className = "task-card";
+    row.dataset.name = t.name;
+
+    const isPaused = t.scheduled && t.enabled === false;
+    row.classList.toggle("task-card-paused", isPaused);
+
+    const schedLabel = t.scheduled
+      ? `<span class="task-card-cron" title="${escapeHtml(t.cron)}">${escapeHtml(_humanCron(t.cron))}</span>`
+      : `<span class="task-card-cron task-card-cron-manual">${I18n.t("tasks.manual")}</span>`;
+
+    const pausedBadge = isPaused
+      ? `<span class="task-card-badge task-card-badge-paused">${I18n.t("tasks.paused")}</span>`
+      : "";
+
+    const content = t.content || "";
+    const isTruncated = content.trim().length > 0;
+    const previewText = escapeHtml(content.replace(/\s+/g, " ").trim()) || escapeHtml(I18n.t("tasks.empty"));
+
+    const toggleBtnHtml = t.scheduled ? (isPaused
+      ? `<button class="task-action-btn task-btn-toggle task-btn-resume">
+           <svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
+             <polygon points="6 3 20 12 6 21 6 3"/>
+           </svg>
+           <span>${I18n.t("tasks.btn.resume")}</span>
+         </button>`
+      : `<button class="task-action-btn task-btn-toggle task-btn-pause">
+           <svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
+             <rect x="6" y="4" width="4" height="16" rx="1"/>
+             <rect x="14" y="4" width="4" height="16" rx="1"/>
+           </svg>
+           <span>${I18n.t("tasks.btn.pause")}</span>
+         </button>`
+    ) : "";
+
+    row.innerHTML = `
+      <div class="task-card-main">
+        <div class="task-card-icon">
+          <svg xmlns="http://www.w3.org/2000/svg" width="18" height="18" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.75" stroke-linecap="round" stroke-linejoin="round">
+            <circle cx="12" cy="12" r="10"/>
+            <polyline points="12 6 12 12 16 14"/>
+          </svg>
+        </div>
+        <div class="task-card-info">
+          <div class="task-card-title-row">
+            <span class="task-card-name">${escapeHtml(t.name)}</span>
+            ${pausedBadge}
+            ${schedLabel}
+          </div>
+          <div class="task-card-preview${isTruncated ? " task-card-preview-expandable" : ""}">${previewText}</div>
+        </div>
+        <div class="task-card-actions">
+          <button class="task-run-btn task-btn-run" title="${I18n.t("tasks.btn.run")}">
+            <svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
+              <polygon points="6 3 20 12 6 21 6 3"/>
+            </svg>
+            <span>${I18n.t("tasks.btn.run")}</span>
+          </button>
+          ${toggleBtnHtml}
+          <button class="task-action-btn task-btn-edit">
+            <svg xmlns="http://www.w3.org/2000/svg" width="11" height="11" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
+              <path d="M17 3a2.85 2.83 0 1 1 4 4L7.5 20.5 2 22l1.5-5.5Z"/>
+              <path d="m15 5 4 4"/>
+            </svg>
+            <span>${I18n.t("tasks.btn.edit")}</span>
+          </button>
+          <button class="task-action-btn task-btn-del">
+            <svg xmlns="http://www.w3.org/2000/svg" width="13" height="13" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2.5" stroke-linecap="round" stroke-linejoin="round">
+              <path d="M3 6h18"/><path d="M19 6l-1 14H6L5 6"/><path d="M8 6V4h8v2"/>
+            </svg>
+            <span>${I18n.t("tasks.btn.delete")}</span>
+          </button>
+        </div>
+      </div>
+      ${isTruncated ? `<div class="task-card-detail" hidden><pre class="task-card-detail-content">${escapeHtml(content)}</pre></div>` : ""}`;
+
+    row.querySelector(".task-btn-run").addEventListener("click", e => {
+      e.stopPropagation();
+      Tasks.run(t.name);
+    });
+
+    if (isTruncated) {
+      const previewEl = row.querySelector(".task-card-preview");
+      const detailEl  = row.querySelector(".task-card-detail");
+      previewEl.addEventListener("click", e => {
+        e.stopPropagation();
+        const expanded = !detailEl.hidden;
+        detailEl.hidden = expanded;
+        row.classList.toggle("task-card-expanded", !expanded);
+      });
+    }
+    const toggleBtn = row.querySelector(".task-btn-toggle");
+    if (toggleBtn) {
+      toggleBtn.addEventListener("click", e => {
+        e.stopPropagation();
+        Tasks.toggleEnabled(t.name, isPaused);
+      });
+    }
+    row.querySelector(".task-btn-edit").addEventListener("click", e => {
+      e.stopPropagation();
+      Tasks.editInSession(t.name);
+    });
+    row.querySelector(".task-btn-del").addEventListener("click", e => {
+      e.stopPropagation();
+      Tasks.delete(t.name);
+    });
+
+    return row;
+  }
+
+  function _renderTable() {
+    const table = $("task-list-table");
+    if (!table) return;
+    table.innerHTML = "";
+
+    const tasks = TasksStore.state.tasks;
+    if (tasks.length === 0) {
+      const empty = document.createElement("div");
+      empty.className = "task-table-empty";
+      empty.innerHTML = `
+        <p>${I18n.t("tasks.noScheduled")}</p>
+        <button class="task-create-btn" id="btn-create-task-empty">
+          <svg xmlns="http://www.w3.org/2000/svg" width="16" height="16" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" class="icon-sm">
+            <path d="M5 12h14"/>
+            <path d="M12 5v14"/>
+          </svg> ${I18n.t("tasks.btn.createTask")}
+        </button>`;
+      table.appendChild(empty);
+      const btn = table.querySelector("#btn-create-task-empty");
+      if (btn) btn.addEventListener("click", () => Tasks.createInSession());
+      return;
+    }
+
+    tasks.forEach(t => table.appendChild(_renderTaskRow(t)));
+  }
+
+  function _renderSection() {
+    const labelEl = $("tasks-sidebar-label");
+    if (!labelEl) return;
+    labelEl.textContent = I18n.t("sidebar.tasks");
+  }
+
+  function _subscribe() {
+    Tasks.on("tasks:changed", () => {
+      _renderSection();
+      if (Router.current === "tasks") _renderTable();
+    });
+  }
+
+  const viewApi = {
+    renderSection: _renderSection,
+    renderTable: _renderTable,
+
+    onPanelShow() {
+      Tasks.load();
+      const btn = $("btn-create-task");
+      if (btn) btn.onclick = () => Tasks.createInSession();
+    },
+  };
+
+  return { init: _subscribe, api: viewApi };
+})();
+
+Object.assign(Tasks, TasksView.api);
+TasksView.init();

data/lib/clacky/web/features/trash/store.js

@@ -0,0 +1,242 @@
+// ── Trash · store — recycle-bin data (files + sessions) + network ──────────
+//
+// Owns the file-trash and session-trash lists/totals plus every network call:
+// load, restore, delete, and bulk empty (by age / all / orphans). Mutates local
+// state optimistically and emits change events. It never renders.
+//
+// The orphan heuristic lives here (state classification, not presentation).
+// Emits mirror to the extension bus via Clacky.ext.emit.
+//
+// `Trash` stays the single public facade.
+//
+// Depends on: Sessions, Clacky.ext.
+// ───────────────────────────────────────────────────────────────────────────
+
+const TrashStore = (() => {
+  let _files          = [];
+  let _totals         = { count: 0, size: 0 };
+  let _sessions       = [];
+  let _sessionTotals  = { count: 0, size: 0 };
+  let _loading        = false;
+
+  const _listeners = {};
+
+  function _on(event, handler) {
+    (_listeners[event] ||= []).push(handler);
+    return () => {
+      const list = _listeners[event];
+      const i = list ? list.indexOf(handler) : -1;
+      if (i >= 0) list.splice(i, 1);
+    };
+  }
+
+  function _emit(event, payload) {
+    (_listeners[event] || []).forEach((h) => h(payload));
+    if (window.Clacky && Clacky.ext) Clacky.ext.emit(event, payload);
+  }
+
+  function _isOrphanRoot(root) {
+    root = root || "";
+    return /^\/(?:var\/folders|tmp|private\/var\/folders)\b/.test(root) ||
+           /\/d\d{8}-\d+-[a-z0-9]+(?:\/|$)/.test(root);
+  }
+
+  const state = {
+    get files()         { return _files; },
+    get totals()        { return _totals; },
+    get sessions()      { return _sessions; },
+    get sessionTotals() { return _sessionTotals; },
+    orphanCount() { return _files.filter(f => _isOrphanRoot(f.project_root)).length; },
+    isOrphan(file) { return _isOrphanRoot(file.project_root); },
+  };
+
+  const Trash = {
+    on: _on,
+    state,
+
+    async loadFiles() {
+      if (_loading) return;
+      _loading = true;
+      _emit("trash:filesLoading");
+      try {
+        const res  = await fetch("/api/trash");
+        const data = await res.json();
+        if (!res.ok) throw new Error(data.error || "Load failed");
+        _files  = data.files  || [];
+        _totals = { count: data.total_count || 0, size: data.total_size || 0 };
+        _emit("trash:filesChanged");
+      } catch (e) {
+        console.error("[Trash] load files failed", e);
+        _emit("trash:filesError", { message: e.message });
+      } finally {
+        _loading = false;
+      }
+    },
+
+    async loadSessions() {
+      if (_loading) return;
+      _loading = true;
+      _emit("trash:sessionsLoading");
+      try {
+        const res  = await fetch("/api/trash/sessions");
+        const data = await res.json();
+        if (!res.ok) throw new Error(data.error || "Load failed");
+        _sessions      = data.sessions || [];
+        _sessionTotals = { count: data.count || 0, size: data.total_size || 0 };
+        _emit("trash:sessionsChanged");
+      } catch (e) {
+        console.error("[Trash] load sessions failed", e);
+        _emit("trash:sessionsError", { message: e.message });
+      } finally {
+        _loading = false;
+      }
+    },
+
+    async restoreFile(file) {
+      try {
+        const res = await fetch("/api/trash/restore", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({
+            project_root:  file.project_root,
+            original_path: file.original_path
+          })
+        });
+        const data = await res.json();
+        if (!res.ok || !data.ok) return { ok: false, error: data.error || res.statusText };
+        _removeFileLocal(file);
+        _emit("trash:filesChanged");
+        return { ok: true };
+      } catch (e) {
+        return { ok: false, error: e.message };
+      }
+    },
+
+    async deleteFile(file) {
+      const url = "/api/trash?" + new URLSearchParams({
+        project: file.project_root,
+        file:    file.original_path
+      }).toString();
+      try {
+        const res  = await fetch(url, { method: "DELETE" });
+        const data = await res.json();
+        if (!res.ok || !data.ok) return { ok: false, error: data.error || res.statusText };
+        _removeFileLocal(file);
+        _emit("trash:filesChanged");
+        return { ok: true };
+      } catch (e) {
+        return { ok: false, error: e.message };
+      }
+    },
+
+    async restoreSession(session) {
+      try {
+        const res = await fetch("/api/trash/sessions/restore", {
+          method: "POST",
+          headers: { "Content-Type": "application/json" },
+          body: JSON.stringify({ session_id: session.session_id })
+        });
+        const data = await res.json();
+        if (!res.ok || !data.ok) return { ok: false, error: data.error || res.statusText };
+        _removeSessionLocal(session);
+        _emit("trash:sessionsChanged");
+        const restored = data.session;
+        if (restored && typeof Sessions !== "undefined") {
+          Sessions.add(restored);
+          Sessions.renderList();
+        }
+        return { ok: true, session: restored };
+      } catch (e) {
+        return { ok: false, error: e.message };
+      }
+    },
+
+    async deleteSession(session) {
+      try {
+        const res  = await fetch(`/api/trash/sessions/${encodeURIComponent(session.session_id)}`, { method: "DELETE" });
+        const data = await res.json();
+        if (!res.ok || !data.ok) return { ok: false, error: data.error || res.statusText };
+        _removeSessionLocal(session);
+        _emit("trash:sessionsChanged");
+        return { ok: true };
+      } catch (e) {
+        return { ok: false, error: e.message };
+      }
+    },
+
+    countMatching(items, daysOld) {
+      if (!Array.isArray(items)) return 0;
+      if (!daysOld || daysOld <= 0) return items.length;
+      const cutoff = Date.now() - daysOld * 86400000;
+      return items.filter(it => {
+        const t = Date.parse(it.deleted_at || "");
+        return !isNaN(t) && t < cutoff;
+      }).length;
+    },
+
+    async emptyFilesBulk(daysOld) {
+      const url = "/api/trash?" + new URLSearchParams({ days_old: String(daysOld) }).toString();
+      try {
+        const res  = await fetch(url, { method: "DELETE" });
+        const data = await res.json();
+        if (!res.ok || !data.ok) return { ok: false, error: data.error || res.statusText };
+        await Trash.loadFiles();
+        return { ok: true, deleted_count: data.deleted_count || 0, freed_size: data.freed_size || 0 };
+      } catch (e) {
+        return { ok: false, error: e.message };
+      }
+    },
+
+    async emptySessionsBulk(daysOld) {
+      const url = "/api/trash/sessions?" + new URLSearchParams({ days_old: String(daysOld) }).toString();
+      try {
+        const res  = await fetch(url, { method: "DELETE" });
+        const data = await res.json();
+        if (!res.ok || !data.ok) return { ok: false, error: data.error || res.statusText };
+        await Trash.loadSessions();
+        return { ok: true, deleted_count: data.deleted_count || 0 };
+      } catch (e) {
+        return { ok: false, error: e.message };
+      }
+    },
+
+    orphans() {
+      return _files.filter(f => _isOrphanRoot(f.project_root));
+    },
+
+    async deleteOneFileRaw(file) {
+      const url = "/api/trash?" + new URLSearchParams({
+        project: file.project_root,
+        file:    file.original_path
+      }).toString();
+      try {
+        const r = await fetch(url, { method: "DELETE" });
+        const d = await r.json();
+        return { ok: r.ok && !!d.ok, freed_size: d.freed_size || 0 };
+      } catch (_e) {
+        return { ok: false, freed_size: 0 };
+      }
+    },
+  };
+
+  function _removeFileLocal(file) {
+    _files = _files.filter(f =>
+      !(f.project_root === file.project_root && f.original_path === file.original_path));
+    _totals = {
+      count: Math.max(0, _totals.count - 1),
+      size:  Math.max(0, _totals.size - (file.file_size || 0))
+    };
+  }
+
+  function _removeSessionLocal(session) {
+    _sessions = _sessions.filter(s => s.session_id !== session.session_id);
+    _sessionTotals = {
+      count: Math.max(0, _sessionTotals.count - 1),
+      size:  Math.max(0, _sessionTotals.size - (session.file_size || 0))
+    };
+  }
+
+  return Trash;
+})();
+
+const Trash = TrashStore;