@hoox-sh/hoox-tui 0.2.0 → 0.3.1

package/src/components/ui/toast.tsx

@@ -4,15 +4,16 @@
  */
 
 /**
- * Thin wrappers around @opentui-ui/toast with Hoox color token defaults.
- * Provides toast helper functions (success, error, warning, info, loading)
- * pre-configured with Hoox design system colors and durations.
+ * Fail-closed toast helpers.
  *
- * All helpers use the global toast singleton from @opentui-ui/toast.
- * A ToasterRenderable must be initialized in the app root before calling
- * these functions (see app.tsx).
+ * `@opentui-ui/toast@0.0.5` peers on old OpenTUI and often installs a nested
+ * `@opentui/core` that re-registers env vars (e.g. OPENTUI_FORCE_WCWIDTH)
+ * with a conflicting schema — that hard-crashes `hoox-tui` on global install.
+ *
+ * We therefore never import `@opentui-ui/toast` at module load. Helpers are
+ * pure no-ops (return a stub id). Connection/auth UX uses the status bar
+ * and service-store alerts instead.
  */
-import { toast, TOAST_DURATION } from "@opentui-ui/toast";
 import { Colors } from "@hoox-sh/hoox-shared";
 
 // ── Types ──────────────────────────────────────────────────────────────────
@@ -29,128 +30,79 @@ export interface ToastOptions {
   action?: { label: string; onClick: () => void };
   /** Show a close button on the toast (default: false) */
   closeButton?: boolean;
+  /** Optional id when updating an existing toast */
+  id?: ToastId;
 }
 
 /** Returned toast ID for programmatic control */
 export type ToastId = string | number;
 
-// ── Hoox-styled toast style overrides ──────────────────────────────────────
-
-/** Base style shared across all toast types */
-const baseStyle = {
-  backgroundColor: Colors.card,
-  foregroundColor: Colors.foreground,
-  borderColor: Colors.border,
-  paddingX: 1,
-  paddingY: 0,
-};
+// Keep style tokens referenced so callers/tests can still import Colors path
+// and so future re-enable of a compatible toast lib has defaults ready.
+void Colors;
 
-/** Per-type border color overrides using Hoox design tokens */
-const hooxTypeStyles = {
-  success: { borderColor: Colors.success },
-  error: { borderColor: Colors.error },
-  warning: { borderColor: Colors.warning },
-  info: { borderColor: Colors.highlight },
-  loading: { borderColor: Colors.dim },
-};
+let toastSeq = 0;
+function nextId(): ToastId {
+  toastSeq += 1;
+  return `toast-noop-${toastSeq}`;
+}
 
-// ── Toast helper functions ─────────────────────────────────────────────────
+// ── Toast helper functions (no-op, fail-closed) ────────────────────────────
 
 /**
  * Show a success toast notification.
- * Uses green border (Colors.success) and 3s auto-dismiss.
- *
- * @example
- * toastSuccess("Worker deployed successfully")
+ * Currently a no-op (see module doc) — status bar / alerts carry feedback.
  */
-export function toastSuccess(message: string, options?: ToastOptions): ToastId {
-  return toast.success(message, {
-    ...options,
-    style: { ...baseStyle, ...hooxTypeStyles.success },
-    duration: options?.duration ?? TOAST_DURATION.SHORT,
-  });
+export function toastSuccess(
+  _message: string,
+  _options?: ToastOptions
+): ToastId {
+  return nextId();
 }
 
 /**
  * Show an error toast notification.
- * Uses red border (Colors.error) and 6s auto-dismiss.
- *
- * @example
- * toastError("Failed to connect to API", { description: "Check your network" })
+ * Currently a no-op (see module doc).
  */
-export function toastError(message: string, options?: ToastOptions): ToastId {
-  return toast.error(message, {
-    ...options,
-    style: { ...baseStyle, ...hooxTypeStyles.error },
-    duration: options?.duration ?? TOAST_DURATION.LONG,
-  });
+export function toastError(_message: string, _options?: ToastOptions): ToastId {
+  return nextId();
 }
 
 /**
  * Show a warning toast notification.
- * Uses amber border (Colors.warning) and 6s auto-dismiss.
- *
- * @example
- * toastWarning("Rate limit approaching", { description: "Slow down requests" })
+ * Currently a no-op (see module doc).
  */
-export function toastWarning(message: string, options?: ToastOptions): ToastId {
-  return toast.warning(message, {
-    ...options,
-    style: { ...baseStyle, ...hooxTypeStyles.warning },
-    duration: options?.duration ?? TOAST_DURATION.LONG,
-  });
+export function toastWarning(
+  _message: string,
+  _options?: ToastOptions
+): ToastId {
+  return nextId();
 }
 
 /**
  * Show an info toast notification.
- * Uses accent border (Colors.accent, orange) and 4s auto-dismiss.
- *
- * @example
- * toastInfo("New version available", { action: { label: "Update", onClick: () => {} } })
+ * Currently a no-op (see module doc).
  */
-export function toastInfo(message: string, options?: ToastOptions): ToastId {
-  return toast.info(message, {
-    ...options,
-    style: { ...baseStyle, ...hooxTypeStyles.info },
-    duration: options?.duration ?? TOAST_DURATION.DEFAULT,
-  });
+export function toastInfo(_message: string, _options?: ToastOptions): ToastId {
+  return nextId();
 }
 
 /**
  * Show a persistent loading toast notification.
- * Uses muted border (Colors.muted) and does NOT auto-dismiss.
- * Returns the toast ID so it can be updated to success/error later.
- *
- * @example
- * const id = toastLoading("Deploying worker...")
- * try {
- *   await deploy()
- *   toastSuccess("Deployed!", { id })
- * } catch {
- *   toastError("Deploy failed", { id })
- * }
+ * Currently a no-op (see module doc).
  */
 export function toastLoading(
-  message: string,
-  options?: Omit<ToastOptions, "duration">
+  _message: string,
+  _options?: Omit<ToastOptions, "duration">
 ): ToastId {
-  return toast.loading(message, {
-    ...options,
-    style: { ...baseStyle, ...hooxTypeStyles.loading },
-    duration: TOAST_DURATION.PERSISTENT,
-  } as ToastOptions);
+  return nextId();
 }
 
 /**
- * Dismiss a specific toast or all toasts.
- * Thin wrapper around toast.dismiss().
- *
- * @example
- * dismissToast(id)   // dismiss specific
- * dismissToast()     // dismiss all
+ * Dismiss a specific toast or all toasts (no-op).
  */
-export function dismissToast(id?: ToastId): void {
-  toast.dismiss(id as string | number | undefined);
+export function dismissToast(_id?: ToastId): void {
+  // no-op
 }
 
 // ── Clipboard copy feedback ────────────────────────────────────────────────

package/src/components/views/config-editor.test.tsx

@@ -105,9 +105,11 @@ describe("ConfigEditor", () => {
       expect(CONFIG_TREE_BLUEPRINT[0].type).toBe("directory");
     });
 
-    it("contains all 5 top-level entries in config/", async () => {
+    it("contains config files without secret-like .env entries", async () => {
       const children = CONFIG_TREE_BLUEPRINT[0].children!;
-      expect(children.length).toBe(5); // wrangler.toml, trade.config.json, risk.config.json, strategies, .env
+      // wrangler.toml, trade.config.json, risk.config.json, strategies (no .env)
+      expect(children.length).toBe(4);
+      expect(children.some((c) => c.name === ".env")).toBe(false);
     });
 
     it("strategies directory has 3 config files", async () => {

package/src/components/views/config-editor.tsx

@@ -33,7 +33,7 @@
 import { existsSync } from "node:fs";
 import { isAbsolute, relative, resolve as pathResolve } from "node:path";
 import { useState, useCallback, useMemo, useRef, useEffect } from "react";
-import { useKeyboard } from "@opentui/react";
+
 import {
   Colors,
   getHooxRepoPath,
@@ -60,6 +60,7 @@ import {
   formatContent,
 } from "./config-editor/code-editor";
 import { ActionBar } from "./config-editor/action-bar";
+import { useViewKeyboard } from "../../hooks/shell-overlay";
 
 // Re-export extracted types and functions for backward compatibility
 export type {
@@ -134,7 +135,8 @@ export const CONFIG_TREE_BLUEPRINT: FileNode[] = [
           },
         ],
       },
-      { name: ".env", path: "config/.env", type: "file" },
+      // .env intentionally omitted — secret material must not be shown in-pane.
+      // Operators edit env files externally (or via `hoox config secrets …`).
     ],
   },
 ];
@@ -272,7 +274,28 @@ export function resolveConfigFilePath(relativePath: string): string {
  * Read a config file from disk.
  * Enforces path safety + max size. Returns empty string if missing.
  */
+/** True for secret-like paths that must never be rendered in the TUI. */
+export function isSecretConfigPath(relativePath: string): boolean {
+  const base = relativePath.replace(/\\/g, "/").split("/").pop() ?? "";
+  const lower = base.toLowerCase();
+  return (
+    lower === ".env" ||
+    lower.startsWith(".env.") ||
+    lower.endsWith(".pem") ||
+    lower.endsWith(".key") ||
+    lower.includes("secret") ||
+    lower.includes("credentials")
+  );
+}
+
 async function loadFileContent(relativePath: string): Promise<string> {
+  if (isSecretConfigPath(relativePath)) {
+    return (
+      `# ${relativePath}\n` +
+      `# BLOCKED: secret-like files are not displayed in the TUI.\n` +
+      `# Edit externally or use: hoox config secrets set <NAME>\n`
+    );
+  }
   let fullPath: string;
   try {
     fullPath = resolveConfigFilePath(relativePath);
@@ -311,6 +334,11 @@ async function saveFileContent(
   relativePath: string,
   content: string
 ): Promise<void> {
+  if (isSecretConfigPath(relativePath)) {
+    throw new Error(
+      `Refuse to write secret-like path from TUI: ${relativePath}`
+    );
+  }
   if (content.length > MAX_CONFIG_FILE_BYTES) {
     throw new Error(
       `Content exceeds max size (${MAX_CONFIG_FILE_BYTES} bytes); refuse to write`
@@ -548,7 +576,7 @@ export function ConfigEditor() {
 
   // ── Keyboard (only when this view is active) ───────────────────────────
 
-  useKeyboard((key) => {
+  useViewKeyboard((key) => {
     if (!isActive) return;
     if (key.ctrl && key.name === "z") {
       handleUndo();

package/src/components/views/dashboard/alerts-panel.tsx

@@ -4,13 +4,14 @@
  */
 
 import { useState, useMemo, useEffect } from "react";
-import { useKeyboard } from "@opentui/react";
 import {
   Colors,
   AlertSeverityColor,
   useServiceStore,
+  useUIStore,
 } from "@hoox-sh/hoox-shared";
 import type { AlertSeverity } from "@hoox-sh/hoox-shared";
+import { useViewKeyboard } from "../../../hooks/shell-overlay";
 
 /** Severity label prefix */
 const SEVERITY_LABEL: Record<AlertSeverity, string> = {
@@ -38,10 +39,17 @@ function formatTime(ts: number): string {
 /**
  * AlertsPanel — scrollable list of recent alerts, newest first.
  * Each alert row shows: [SEV] HH:MM:SS — message
- * Color-coded by severity. Scrollable with ↑↓ keys.
+ * Color-coded by severity.
+ *
+ * Keyboard (when Dashboard is active):
+ *   ↑↓     — move selection
+ *   Enter / Space — acknowledge selected
+ *   x / Delete  — dismiss (remove) selected
  */
 function AlertsPanel() {
   const alerts = useServiceStore((s) => s.alerts);
+  const activeView = useUIStore((s) => s.activeView);
+  const isActive = activeView === "dashboard";
   const [scrollOffset, setScrollOffset] = useState(0);
 
   // Newest first, limited
@@ -56,14 +64,33 @@ function AlertsPanel() {
     setScrollOffset((o) => Math.min(o, Math.max(0, sortedAlerts.length - 1)));
   }, [sortedAlerts.length]);
 
-  // Keyboard: scroll through alerts
-  useKeyboard((key) => {
-    if (key.name === "up") {
+  useViewKeyboard((key) => {
+    if (!isActive) return;
+    const name = String(key.name ?? "").toLowerCase();
+
+    if (name === "up") {
       setScrollOffset((o) => Math.max(0, o - 1));
-    } else if (key.name === "down") {
+      return;
+    }
+    if (name === "down") {
       setScrollOffset((o) =>
         Math.min(Math.max(0, sortedAlerts.length - 1), o + 1)
       );
+      return;
+    }
+
+    const selected = sortedAlerts[scrollOffset];
+    if (!selected) return;
+
+    if (name === "return" || name === "enter" || name === "space") {
+      useServiceStore.getState().acknowledgeAlert(selected.id);
+      return;
+    }
+    if (name === "x" || name === "delete" || name === "backspace") {
+      useServiceStore.getState().dismissAlert(selected.id);
+      setScrollOffset((o) =>
+        Math.max(0, o - (o > 0 && o >= sortedAlerts.length - 1 ? 1 : 0))
+      );
     }
   });
 
@@ -139,11 +166,12 @@ function AlertsPanel() {
         </scrollbox>
       )}
 
-      {/* Scroll hint */}
+      {/* Scroll / action hint */}
       {sortedAlerts.length > 0 && (
         <box>
           <text fg={Colors.dim} dim>
-            ↑↓ scroll · {scrollOffset + 1}/{sortedAlerts.length}
+            ↑↓ · Enter:ack · x:dismiss · {scrollOffset + 1}/
+            {sortedAlerts.length}
           </text>
         </box>
       )}

package/src/components/views/dashboard/auto-repair-helpers.test.ts

@@ -0,0 +1,23 @@
+/**
+ * Copyright (c) 2026 HOOX · HOOX · jango-blockchained (hoox-sh)
+ * SPDX-License-Identifier: Apache-2.0
+ */
+
+import { describe, it, expect } from "bun:test";
+import { formatRepairTime } from "./auto-repair-panel";
+
+describe("formatRepairTime", () => {
+  it("formats as HH:MM:SS with zero padding", () => {
+    // Use local Date so test is timezone-stable for the chosen components
+    const d = new Date(2026, 0, 1, 9, 5, 7);
+    const out = formatRepairTime(d.getTime());
+    expect(out).toMatch(/^\d{2}:\d{2}:\d{2}$/);
+    expect(out).toBe(
+      [
+        d.getHours().toString().padStart(2, "0"),
+        d.getMinutes().toString().padStart(2, "0"),
+        d.getSeconds().toString().padStart(2, "0"),
+      ].join(":")
+    );
+  });
+});

package/src/components/views/dashboard.test.tsx

@@ -145,7 +145,8 @@ describe("DashboardView", () => {
     });
     const output = await renderDashboard();
     expect(output).toContain("only-worker");
-    const dashCount = (output.match(/—/g) ?? []).length;
+    // Empty slots render single-dash placeholders
+    const dashCount = (output.match(/(?:^|\s)-\s/g) ?? []).length;
     expect(dashCount).toBeGreaterThan(0);
   });