cicy-desktop 2.1.69 → 2.1.71

package/workers/render.bak.20260528-2338/src/components/SidecarBanner.jsx

@@ -1,84 +0,0 @@
-import Button from "./Button.jsx";
-import Icon from "./Icon.jsx";
-import "./SidecarBanner.css";
-
-/**
- * <SidecarBanner state="..." info={...} progress={...} onInstall onCancel />
- *
- * Full-width banner shown when:
- *   missing    — cicy-code not installed yet (first-run blocker)
- *   installing — install / upgrade in progress
- *   error      — last install attempt failed
- *
- * In other states (uptodate, outdated, checking) the banner is null;
- * "outdated" surfaces inside the BackendCard's menu instead.
- */
-export default function SidecarBanner({ state, info, progress, error, onInstall, onCancel }) {
-  if (state !== "missing" && state !== "installing" && state !== "error") return null;
-
-  const isInstalling = state === "installing";
-  const isError      = state === "error";
-
-  let title, subtitle, actions;
-
-  if (state === "missing") {
-    title = "Install cicy-code to get started";
-    subtitle = info?.latest
-      ? `Latest v${info.latest} · ${info.network === "cn" ? "China mirror" : "GitHub direct"}`
-      : "Required for the local engine";
-    actions = <Button variant="primary" icon={<Icon name="download" />} onClick={onInstall}>Install</Button>;
-  } else if (isInstalling) {
-    const p = progress || {};
-    title = p.message || "Installing…";
-    const pct = typeof p.progress === "number" ? Math.round(p.progress * 100) : null;
-    subtitle = p.phase === "downloading" && p.total
-      ? `${formatBytes(p.received)} / ${formatBytes(p.total)}${p.version ? ` · v${p.version}` : ""}`
-      : (p.version ? `v${p.version}` : p.phase || "");
-    actions = <Button variant="ghost" onClick={onCancel}>Cancel</Button>;
-    return (
-      <div className="sidecar-banner is-installing">
-        <div className="sidecar-banner__head">
-          <div className="sidecar-banner__icon"><Icon name="download" size={18} /></div>
-          <div className="sidecar-banner__text">
-            <div className="sidecar-banner__title">{title}</div>
-            <div className="sidecar-banner__subtitle">{subtitle}</div>
-          </div>
-          <div className="sidecar-banner__actions">{actions}</div>
-        </div>
-        <div className={`sidecar-banner__bar ${pct == null ? "is-indeterminate" : ""}`}>
-          <div className="sidecar-banner__bar-fill" style={{ width: pct == null ? "30%" : `${pct}%` }} />
-        </div>
-        <div className="sidecar-banner__bar-meta">
-          <span>{p.phase || ""}</span>
-          <span>{pct == null ? "" : `${pct}%`}</span>
-        </div>
-      </div>
-    );
-  } else if (isError) {
-    title = "Install failed";
-    subtitle = error || "Unknown error";
-    actions = <Button variant="primary" onClick={onInstall}>Retry</Button>;
-  }
-
-  return (
-    <div className={`sidecar-banner ${isError ? "is-error" : ""}`}>
-      <div className="sidecar-banner__head">
-        <div className="sidecar-banner__icon">
-          <Icon name={isError ? "warn" : "download"} size={18} />
-        </div>
-        <div className="sidecar-banner__text">
-          <div className="sidecar-banner__title">{title}</div>
-          <div className="sidecar-banner__subtitle">{subtitle}</div>
-        </div>
-        <div className="sidecar-banner__actions">{actions}</div>
-      </div>
-    </div>
-  );
-}
-
-function formatBytes(n) {
-  if (n == null) return "?";
-  if (n < 1024) return `${n} B`;
-  if (n < 1024 * 1024) return `${(n / 1024).toFixed(1)} KB`;
-  return `${(n / (1024 * 1024)).toFixed(1)} MB`;
-}

package/workers/render.bak.20260528-2338/src/components/StatusChip.css

@@ -1,19 +0,0 @@
-.status-chip {
-  display: inline-flex;
-  align-items: center;
-  gap: var(--sp-2);
-  padding: 2px 10px;
-  border-radius: var(--r-pill);
-  font-size: var(--t-xs);
-  font-weight: 500;
-  white-space: nowrap;
-}
-.status-chip__dot {
-  width: 6px; height: 6px;
-  border-radius: 50%;
-  background: currentColor;
-  flex-shrink: 0;
-}
-.status-chip--up .status-chip__dot {
-  box-shadow: 0 0 0 3px rgba(74,222,128,0.18);
-}

package/workers/render.bak.20260528-2338/src/components/StatusChip.jsx

@@ -1,31 +0,0 @@
-import "./StatusChip.css";
-
-/**
- * <StatusChip kind="up|warn|down|unknown" label="..." />
- *
- * The single source of truth for backend status presentation.
- * Avoids the row's previous "dot + colored text + icon" triple-redundancy.
- */
-const COLORS = {
-  up:      { bg: "var(--success-soft)", fg: "var(--success)", label: "Online" },
-  warn:    { bg: "var(--warn-soft)",    fg: "var(--warn)",    label: "Degraded" },
-  down:    { bg: "var(--danger-soft)",  fg: "var(--danger)",  label: "Offline" },
-  unknown: { bg: "var(--bg-elev-2)",    fg: "var(--fg-3)",    label: "—" },
-};
-
-export default function StatusChip({ kind = "unknown", label }) {
-  const c = COLORS[kind] || COLORS.unknown;
-  return (
-    <span className={`status-chip status-chip--${kind}`} style={{ background: c.bg, color: c.fg }}>
-      <span className="status-chip__dot" />
-      {label || c.label}
-    </span>
-  );
-}
-
-export function dotKind(health) {
-  if (!health) return "unknown";
-  if (health.ok && health.status === "ok") return "up";
-  if (health.ok) return "warn";
-  return "down";
-}

package/workers/render.bak.20260528-2338/src/components/Toast.css

@@ -1,31 +0,0 @@
-.toast-stack {
-  position: fixed;
-  left: 50%;
-  bottom: var(--sp-5);
-  transform: translateX(-50%);
-  display: flex;
-  flex-direction: column;
-  gap: var(--sp-2);
-  z-index: 2000;
-  pointer-events: none;
-}
-
-.toast {
-  background: var(--bg-elev-2);
-  color: var(--fg);
-  border: 1px solid var(--hairline-2);
-  padding: var(--sp-3) var(--sp-4);
-  border-radius: var(--r-pill);
-  font-size: var(--t-sm);
-  box-shadow: var(--shadow-2);
-  animation: toast-in var(--dur-base) var(--ease);
-  max-width: 90vw;
-}
-
-.toast--error  { border-color: var(--danger); color: var(--danger); }
-.toast--success { border-color: var(--success); color: var(--success); }
-
-@keyframes toast-in {
-  from { opacity: 0; transform: translateY(8px); }
-  to   { opacity: 1; transform: translateY(0); }
-}

package/workers/render.bak.20260528-2338/src/components/Toast.jsx

@@ -1,23 +0,0 @@
-import { useEffect, useState } from "react";
-import "./Toast.css";
-
-let pushImpl = () => {};
-export function pushToast(msg, kind = "info") { pushImpl({ msg, kind, id: Date.now() + Math.random() }); }
-
-export default function Toast() {
-  const [items, setItems] = useState([]);
-  useEffect(() => {
-    pushImpl = (it) => {
-      setItems((prev) => [...prev, it]);
-      setTimeout(() => setItems((prev) => prev.filter((x) => x.id !== it.id)), 2400);
-    };
-    return () => { pushImpl = () => {}; };
-  }, []);
-  return (
-    <div className="toast-stack">
-      {items.map((it) => (
-        <div key={it.id} className={`toast toast--${it.kind}`}>{it.msg}</div>
-      ))}
-    </div>
-  );
-}

package/workers/render.bak.20260528-2338/src/components/WslSetupBanner.css

@@ -1,464 +0,0 @@
-/* ── WSL setup drawer — right-side slide-out ─────────────────────────
-   The drawer floats over the main app content so the cards stay visible
-   underneath. We keep all the `.wsl-banner__*` class names internally
-   (banner → drawer was a UX rename, not a structural rewrite) so the
-   JSX didn't need to be touched. Backdrop is intentionally near-zero
-   opacity — the install can take 10+ min and we don't want the user
-   feeling locked out of the rest of the app. */
-
-/* Subtle tint behind the drawer — pointer-events:none so users can still
-   click backend cards / tabs underneath. Pure visual cue that the drawer
-   is the focused area without actually trapping interaction. */
-.wsl-drawer-backdrop {
-  position: fixed;
-  inset: 0;
-  background: linear-gradient(to right, transparent 0%, transparent 40%, rgba(0, 0, 0, 0.10) 100%);
-  pointer-events: none;
-  z-index: 90;
-  animation: drawer-backdrop-in var(--dur-base) var(--ease);
-}
-@keyframes drawer-backdrop-in {
-  from { opacity: 0; }
-  to   { opacity: 1; }
-}
-
-.wsl-banner {
-  position: fixed;
-  top: 0;
-  right: 0;
-  height: 100vh;
-  width: min(560px, 100vw);
-  z-index: 100;
-  background: var(--bg-elev-1);
-  border-left: 1px solid var(--hairline);
-  box-shadow: -8px 0 24px rgba(0, 0, 0, 0.18);
-  padding: var(--sp-4);
-  display: flex;
-  flex-direction: column;
-  gap: var(--sp-3);
-  overflow: hidden; /* let inner sections scroll, log fills bottom */
-  scrollbar-width: thin;
-  animation: drawer-in 280ms cubic-bezier(0.16, 1, 0.3, 1);
-}
-@keyframes drawer-in {
-  from { transform: translateX(100%); }
-  to   { transform: translateX(0); }
-}
-.wsl-banner.is-error {
-  border-left: 3px solid var(--danger);
-}
-
-.wsl-banner__head {
-  display: flex;
-  align-items: flex-start;
-  gap: var(--sp-3);
-}
-
-.wsl-banner__icon {
-  width: 36px; height: 36px;
-  display: grid; place-items: center;
-  background: var(--warn-soft);
-  color: var(--warn);
-  border-radius: var(--r-sm);
-  flex-shrink: 0;
-}
-
-.wsl-banner__text { flex: 1; min-width: 0; }
-.wsl-banner__title  { font-size: var(--t-md); font-weight: 600; color: var(--fg); }
-.wsl-banner__subtitle { font-size: var(--t-xs); color: var(--fg-2); margin-top: 4px; line-height: 1.5; }
-
-.wsl-banner__cmd {
-  display: flex;
-  align-items: center;
-  justify-content: space-between;
-  gap: var(--sp-3);
-  background: var(--bg);
-  border: 1px solid var(--hairline);
-  border-radius: var(--r-sm);
-  padding: var(--sp-2) var(--sp-3);
-}
-.wsl-banner__cmd code {
-  font-family: var(--font-mono);
-  font-size: var(--t-sm);
-  color: var(--fg);
-  user-select: text;
-}
-
-.wsl-banner__link {
-  font-size: var(--t-xs);
-  color: var(--fg-3);
-  align-self: flex-start;
-}
-.wsl-banner__link:hover { color: var(--brand); }
-
-.wsl-banner__actions {
-  display: flex;
-  flex-direction: column;
-  gap: var(--sp-2);
-}
-.wsl-banner__hint {
-  font-size: var(--t-xs);
-  color: var(--fg-3);
-  line-height: 1.5;
-}
-.wsl-banner__error {
-  background: color-mix(in srgb, var(--danger) 8%, transparent);
-  border: 1px solid color-mix(in srgb, var(--danger) 30%, transparent);
-  border-radius: var(--r-sm);
-  padding: var(--sp-2) var(--sp-3);
-  color: var(--danger);
-  font-size: var(--t-xs);
-  word-break: break-word;
-}
-
-
-/* ── Agent picker — shown when phase=picking-agents ───────────────── */
-.wsl-banner__pick {
-  display: flex;
-  flex-direction: column;
-  gap: var(--sp-2);
-  padding: var(--sp-3);
-  background: var(--bg);
-  border: 1px solid var(--brand);
-  border-radius: var(--r-sm);
-  margin-top: var(--sp-2);
-}
-.wsl-banner__pick-title {
-  font-size: var(--t-sm);
-  font-weight: 600;
-  color: var(--fg);
-}
-.wsl-banner__pick-hint {
-  font-size: var(--t-xs);
-  color: var(--fg-3);
-  margin-bottom: 4px;
-}
-.wsl-banner__pick-options {
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-}
-.wsl-banner__pick-row {
-  display: flex;
-  align-items: center;
-  gap: 10px;
-  padding: 8px 10px;
-  border: 1px solid var(--hairline);
-  border-radius: var(--r-sm);
-  cursor: pointer;
-  transition: background 0.12s ease, border-color 0.12s ease;
-  user-select: none;
-}
-.wsl-banner__pick-row:hover {
-  background: color-mix(in srgb, var(--brand) 6%, transparent);
-}
-.wsl-banner__pick-row.is-checked {
-  border-color: var(--brand);
-  background: color-mix(in srgb, var(--brand) 10%, transparent);
-}
-.wsl-banner__pick-row input[type="checkbox"] {
-  accent-color: var(--brand);
-  margin: 0;
-  flex-shrink: 0;
-}
-.wsl-banner__pick-row-text { flex: 1; min-width: 0; }
-.wsl-banner__pick-row-name { font-size: var(--t-sm); font-weight: 600; color: var(--fg); }
-.wsl-banner__pick-row-desc { font-size: 11px; color: var(--fg-3); margin-top: 2px; }
-.wsl-banner__pick-confirm {
-  margin-top: var(--sp-2);
-}
-
-
-/* ── Live install progress + scrolling shell log ──────────────────────
-   The progress block becomes flex:1 so the raw shell log fills whatever
-   vertical room is left in the drawer when expanded. */
-.wsl-banner__progress {
-  display: flex;
-  flex-direction: column;
-  gap: 8px;
-  margin-top: var(--sp-2);
-  padding-top: var(--sp-3);
-  border-top: 1px solid var(--hairline);
-  flex: 1 1 0;
-  min-height: 0;
-  overflow: hidden;
-}
-.wsl-banner__progress-text {
-  display: flex;
-  justify-content: space-between;
-  align-items: baseline;
-  font-size: var(--t-sm);
-  color: var(--fg-2);
-}
-.wsl-banner__progress-pct {
-  color: var(--brand);
-  font-weight: 700;
-  font-variant-numeric: tabular-nums;
-}
-.wsl-banner__progress-bar {
-  height: 4px;
-  background: var(--bg-1, #0d1117);
-  border-radius: 999px;
-  overflow: hidden;
-  position: relative;
-}
-.wsl-banner__progress-fill {
-  height: 100%;
-  background: var(--brand);
-  border-radius: inherit;
-  transition: width 0.3s ease;
-}
-.wsl-banner__progress-bar.is-indeterminate .wsl-banner__progress-fill {
-  animation: wsl-indeterminate 1.4s infinite ease-in-out;
-  width: 30% !important;
-}
-@keyframes wsl-indeterminate {
-  0%   { transform: translateX(-100%); }
-  100% { transform: translateX(400%); }
-}
-
-/* docker-pivot simplified banner: progress bar row + agent picker */
-.wsl-banner__progress-row {
-  display: flex;
-  align-items: center;
-  gap: 12px;
-  margin-top: var(--sp-2);
-}
-.wsl-banner__progress-row .wsl-banner__progress-bar {
-  flex: 1 1 0;
-}
-.wsl-banner__progress-row .wsl-banner__progress-text {
-  font-size: var(--t-sm);
-  color: var(--fg-2);
-  font-variant-numeric: tabular-nums;
-  white-space: nowrap;
-}
-.wsl-banner__agents {
-  margin-top: var(--sp-3);
-  padding: var(--sp-3);
-  background: var(--bg-1, #0d1117);
-  border: 1px solid var(--hairline);
-  border-radius: 8px;
-  display: flex;
-  flex-direction: column;
-  gap: var(--sp-2);
-}
-.wsl-banner__agents-title {
-  font-weight: 600;
-  font-size: var(--t-md);
-}
-.wsl-banner__agents-list {
-  display: flex;
-  flex-wrap: wrap;
-  gap: var(--sp-3);
-}
-.wsl-banner__agent-row {
-  display: inline-flex;
-  align-items: center;
-  gap: 6px;
-  cursor: pointer;
-}
-.wsl-banner__log {
-  margin: 0;
-  flex: 1 1 0;          /* fill all remaining space in __progress */
-  min-height: 120px;
-  max-height: none;
-  overflow-y: auto;
-  font-family: var(--font-mono);
-  font-size: 11px;
-  line-height: 1.45;
-  color: var(--fg-3);
-  background: color-mix(in srgb, var(--bg-1, #0d1117) 80%, transparent);
-  border: 1px solid var(--hairline);
-  border-radius: 6px;
-  padding: 8px 10px;
-  white-space: pre-wrap;
-  word-break: break-word;
-  user-select: text;
-  scrollbar-width: thin;
-  scrollbar-color: var(--hairline) transparent;
-}
-.wsl-banner__log::-webkit-scrollbar { width: 10px; }
-.wsl-banner__log::-webkit-scrollbar-track { background: transparent; }
-.wsl-banner__log::-webkit-scrollbar-thumb {
-  background: color-mix(in srgb, var(--fg-3, #8b949e) 35%, transparent);
-  border-radius: 5px;
-  border: 2px solid transparent;
-  background-clip: padding-box;
-}
-.wsl-banner__log::-webkit-scrollbar-thumb:hover {
-  background: color-mix(in srgb, var(--fg-3, #8b949e) 60%, transparent);
-  background-clip: padding-box;
-}
-
-
-/* ── Step timeline — readable, structured progress ───────────────────── */
-.wsl-banner__steps {
-  margin: 0;
-  padding: 0;
-  list-style: none;
-  display: flex;
-  flex-direction: column;
-  gap: 4px;
-  font-size: var(--t-sm);
-  flex-shrink: 0;
-  max-height: 55vh;
-  overflow-y: auto;
-  scrollbar-width: thin;
-}
-.wsl-banner__step {
-  display: flex;
-  align-items: baseline;
-  gap: 8px;
-  padding: 4px 6px;
-  border-radius: 4px;
-  color: var(--fg-3);
-  transition: background 0.15s ease, color 0.15s ease;
-}
-.wsl-banner__step.is-done { color: var(--fg-2); }
-.wsl-banner__step.is-active {
-  color: var(--fg);
-  background: color-mix(in srgb, var(--brand) 8%, transparent);
-}
-.wsl-banner__step-icon {
-  display: inline-block;
-  width: 14px;
-  text-align: center;
-  font-family: var(--font-mono);
-  color: var(--fg-3);
-  flex-shrink: 0;
-}
-.wsl-banner__step.is-done .wsl-banner__step-icon { color: var(--brand); }
-.wsl-banner__step.is-active .wsl-banner__step-icon {
-  color: var(--brand);
-  animation: wsl-step-pulse 1.2s infinite ease-in-out;
-}
-@keyframes wsl-step-pulse {
-  0%, 100% { opacity: 1; }
-  50%      { opacity: 0.35; }
-}
-.wsl-banner__step-text {
-  flex: 1;
-  min-width: 0;
-  word-break: break-word;
-}
-.wsl-banner__step-pct {
-  margin-left: 6px;
-  color: var(--brand);
-  font-weight: 600;
-  font-variant-numeric: tabular-nums;
-}
-
-/* ── Raw shell log — opt-in, intentionally low-key ──────────────────── */
-.wsl-banner__rawlog {
-  display: flex;
-  flex-direction: column;
-  gap: 6px;
-  margin-top: 4px;
-  flex: 1 1 0;
-  min-height: 0;
-}
-.wsl-banner__rawlog-toggle {
-  align-self: flex-end;
-  background: transparent;
-  border: 0;
-  padding: 0;
-  font: inherit;
-  font-size: 10px;
-  color: var(--fg-3);
-  opacity: 0.55;
-  cursor: pointer;
-  user-select: none;
-  text-decoration: underline;
-  text-underline-offset: 2px;
-}
-.wsl-banner__rawlog-toggle:hover { opacity: 1; }
-
-.wsl-banner__step-label { font-weight: 500; }
-.wsl-banner__step-detail {
-  color: var(--fg-3);
-  font-size: 11px;
-}
-
-.wsl-banner__step.is-error {
-  color: var(--danger, #f87171);
-  background: color-mix(in srgb, var(--danger, #f87171) 6%, transparent);
-}
-.wsl-banner__step.is-error .wsl-banner__step-icon {
-  color: var(--danger, #f87171);
-}
-.wsl-banner__step-error {
-  display: block;
-  margin-top: 4px;
-  padding-left: 0;
-  font-size: 11px;
-  color: var(--danger, #f87171);
-  word-break: break-word;
-}
-.wsl-banner__step-retry {
-  margin-left: 8px;
-  padding: 2px 10px;
-  border: 1px solid var(--brand);
-  background: transparent;
-  color: var(--brand);
-  border-radius: 4px;
-  font: inherit;
-  font-size: 11px;
-  cursor: pointer;
-  flex-shrink: 0;
-  align-self: center;
-}
-.wsl-banner__step-retry:hover {
-  background: color-mix(in srgb, var(--brand) 10%, transparent);
-}
-.wsl-banner__step-retry:disabled {
-  opacity: 0.5;
-  cursor: default;
-}
-
-/* ── Prominent top-level failure banner — surfaces the first failed
-   step's reason at the top of the drawer so the user doesn't have to
-   scan the timeline to spot the red ✗. Includes a retry CTA. ──────── */
-.wsl-banner__failure {
-  display: flex;
-  flex-direction: column;
-  gap: var(--sp-2);
-  padding: var(--sp-3);
-  background: color-mix(in srgb, var(--danger, #f87171) 10%, transparent);
-  border: 1px solid var(--danger, #f87171);
-  border-left-width: 3px;
-  border-radius: var(--r-sm);
-}
-.wsl-banner__failure-head {
-  display: flex;
-  align-items: center;
-  gap: 8px;
-  font-size: var(--t-sm);
-  font-weight: 600;
-  color: var(--danger, #f87171);
-}
-.wsl-banner__failure-step {
-  font-size: 11px;
-  color: var(--fg-3);
-  text-transform: uppercase;
-  letter-spacing: 0.04em;
-}
-.wsl-banner__failure-msg {
-  font-family: var(--font-mono);
-  font-size: 12px;
-  color: var(--fg);
-  background: var(--bg);
-  border: 1px solid var(--hairline);
-  border-radius: var(--r-sm);
-  padding: 8px 10px;
-  white-space: pre-wrap;
-  word-break: break-word;
-  max-height: 140px;
-  overflow-y: auto;
-}
-.wsl-banner__failure-actions {
-  display: flex;
-  gap: 8px;
-  flex-wrap: wrap;
-}
-