bingocode 1.1.109 → 1.1.111

package/src/manager/CliMenuUi.tsx

@@ -266,29 +266,16 @@ export const TopBar: React.FC<{
   compactLogo: React.ReactNode;
   toolbar?: React.ReactNode;
   ip?: string;
-}> = memo(({ ready, page, width = 80, height = 5, homeLogo, compactLogo, toolbar, ip }) => {
-  const isHome = page === null;
-  return (
-    <Panel width={width} height={height} borderStyle="round" paddingX={1} paddingY={0}>
-      <Box width={width - 4} flexDirection="row" alignItems="flex-start">
-        {/* Left Section: Welcome Text & IP */}
-        <Box flexDirection="column" width={20} marginRight={2}>
-              <Text bold color="cyan">{isHome ? 'Welcome Bingo\nCode' : 'Bingo Code'}</Text>
-          {ip ? (
-            <Box marginTop={1}>
-              <Text color="green">IP: {ip.replace(' ','\n    ')}</Text>
-            </Box>
-          ) : null}
-        </Box>
-
-        {/* Center/Right Section: Logo + Toolbar (Dynamic) */}
-        <Box flexGrow={1} flexDirection="column">
-           {toolbar}
-        </Box>
+}> = memo(({ ready, page, width = 80, height = 5, homeLogo, compactLogo, toolbar, ip }) => (
+  <Panel width={width} height={height} borderStyle="round" paddingX={1} paddingY={0}>
+    <Box width={width - 2} flexDirection="row" justifyContent="space-between" alignItems="center">
+      <Box>
+        {ready ? (page === null ? homeLogo : compactLogo) : <FallbackTop ip={ip} />}
       </Box>
-    </Panel>
-  );
-});
+      {toolbar ? <Box>{toolbar}</Box> : <Box><Hint dim>{ready ? '' : '…'}</Hint></Box>}
+    </Box>
+  </Panel>
+));
 
 // InfoPair (Label fixed width for column alignment)
 export const InfoPair: React.FC<{ label: string; value: string; labelColor?: string; valueColor?: string; labelWidth?: number }> = memo(({

package/src/manager/TopToolbar.tsx

@@ -1,137 +1,111 @@
-//@C:M ID=M.UI.TopToolbar;K=M;V=1.3;P=top toolbar;D=CLI;M=cli;S=ui
-import React, { memo, useMemo } from 'react';
-import { Box, Text } from 'ink';
-import { Chip } from './CliMenuUi.tsx';
-import { useTheme } from '../components/design-system/ThemeProvider.tsx';
-import { getGlobalConfig, getCurrentProjectConfig } from '../utils/config.ts';
-import { getCwd } from '../utils/cwd.js';
-import type { ClawdPose } from '../components/LogoV2/Clawd.tsx';
-import { Clawd } from '../components/LogoV2/Clawd.tsx';
-import { AnimatedClawd } from '../components/LogoV2/AnimatedClawd.tsx';
-
-import fs from 'fs';
-import path from 'path';
-import os from 'os';
-
-type Props = {
-  ready: boolean;
-  page: string | null;
-  animEnabled: boolean;
-  tipsEnabled: boolean;
-};
-
-function countLeases(): number {
-  try {
-    const LEASES_DIR = path.join(os.homedir(), '.claude-cli', 'runtime', 'leases');
-    if (!fs.existsSync(LEASES_DIR)) return 0;
-    const files = fs.readdirSync(LEASES_DIR);
-    let alive = 0;
-    for (const f of files) {
-      try {
-        const p = path.join(LEASES_DIR, f);
-        const raw = fs.readFileSync(p, 'utf-8');
-        const data = JSON.parse(raw);
-        if (data?.pid) {
-          try {
-            process.kill(data.pid, 0);
-            alive++;
-          } catch {
-            // PID not alive
-          }
-        }
-      } catch {}
-    }
-    return alive;
-  } catch {
-    return 0;
-  }
-}
-
-function basename(p: string) {
-  if (!p) return '';
-  const parts = p.split(/[/\\]/).filter(Boolean);
-  return parts[parts.length - 1] || p;
-}
-
-/**
- * Compact 1/6 size Mini-Clawd mascot string.
- * Approx 3x2 characters.
- */
-const MiniClawd = () => (
-  <Box flexDirection="column" marginRight={1}>
-    <Text color="cyan">▟█▙</Text>
-    <Text color="cyan">▜██</Text>
-  </Box>
-);
-
-export const TopToolbar: React.FC<Props> = memo(({ ready, page, animEnabled, tipsEnabled }) => {
-  const [theme] = useTheme();
-
-  // Polling for window count
-  const [windowCount, setWindowCount] = React.useState(0);
-  React.useEffect(() => {
-    const update = () => setWindowCount(countLeases());
-    update();
-    const id = setInterval(update, 10000); // 10s poll
-    return () => clearInterval(id);
-  }, []);
-
-  // Only read config when ready
-  const { projectName } = useMemo(() => {
-    if (!ready) {
-      return { projectName: '' };
-    }
-    const _cwd = getCwd();
-    let _projectName = '';
-    try {
-      const prj = getCurrentProjectConfig();
-      _projectName = (prj && (prj.name || prj.projectName || prj.id)) || (typeof _cwd === 'string' ? basename(_cwd) : '');
-    } catch {
-      _projectName = typeof _cwd === 'string' ? basename(_cwd) : '';
-    }
-    return { projectName: _projectName };
-  }, [ready]);
-
-  // Theme name
-  const themeLabel = String(theme || (ready ? (getGlobalConfig()?.theme ?? 'system') : '…'));
-
-  // Static Clawd pose
-  const clawdPose: ClawdPose = useMemo(() => {
-    if (!ready) return 'default';
-    if (page === null) return animEnabled ? 'arms-up' : 'default';
-    return tipsEnabled ? 'look-left' : 'look-right';
-  }, [ready, page, animEnabled, tipsEnabled]);
-
-  const uiTone = (String(theme) === 'dark') ? 'accent' : (String(theme) === 'highContrast' ? 'warning' : 'info');
-
-  return (
-    <Box flexDirection="row" width="100%" alignItems="flex-start" justifyContent="space-between">
-      {/* Left: Main Mascot + Compact Grid */}
-      <Box alignItems="flex-start">
-        <Box marginRight={2}>
-          {animEnabled ? <AnimatedClawd /> : <Clawd pose={clawdPose} />}
-        </Box>
-
-        {/* Visual Window Grid (Mini-mascots 1/6 size) */}
-        <Box flexDirection="row" flexWrap="wrap" maxWidth={40}>
-          {Array.from({ length: windowCount }).map((_, i) => (
-            <MiniClawd key={i} />
-          ))}
-        </Box>
-      </Box>
-
-      {/* Right: Status Info Chips (Vertical Stack) */}
-      <Box flexDirection="column" alignItems="flex-end">
-        <Chip label="Theme" value={themeLabel} tone="accent" />
-        <Chip label="Project" value={projectName || '—'} tone="info" />
-        <Chip
-          label="UI"
-          value={tipsEnabled ? 'Tips On' : 'Tips Off'}
-          tone={uiTone as any}
-        />
-      </Box>
-    </Box>
-  );
-});
-
-export default TopToolbar;
+//@C:M ID=M.UI.TopToolbar;K=M;V=1.2;P=top toolbar;D=CLI;M=cli;S=ui
+import React, { memo, useMemo } from 'react';
+import { Box } from 'ink';
+import { Chip, ChipRow } from './CliMenuUi.tsx';
+import { useTheme } from '../components/design-system/ThemeProvider.js';
+import { getGlobalConfig, getCurrentProjectConfig, isPathTrusted, checkHasTrustDialogAccepted } from '../utils/config.ts';
+import { getCwd } from '../utils/cwd.js';
+// Update: Import respectively according to the new interface
+import type { ClawdPose } from '../components/LogoV2/Clawd.tsx';
+import { Clawd } from '../components/LogoV2/Clawd.tsx';
+import { AnimatedClawd } from '../components/LogoV2/AnimatedClawd.tsx';
+
+type Props = {
+  ready: boolean;
+  page: string | null;
+  animEnabled: boolean;
+  tipsEnabled: boolean;
+};
+
+function basename(p: string) {
+  if (!p) return '';
+  const parts = p.split(/[/\\]/).filter(Boolean);
+  return parts[parts.length - 1] || p;
+}
+function ellipsisPath(p: string, keep = 2) {
+  if (!p) return '';
+  const parts = p.split(/[/\\]/).filter(Boolean);
+  if (parts.length <= keep) return p;
+  return '…/' + parts.slice(-keep).join('/');
+}
+
+//@C:F ID=F.UI.TopToolbar;K=F;V=1.2;P=toolbar;D=CLI;M=cli;S=ui;In=Props;Out=JSX.Element
+export const TopToolbar: React.FC<Props> = memo(({ ready, page, animEnabled, tipsEnabled }) => {
+  const [theme] = useTheme();
+
+  // Only read config and trust status when ready
+  const { cwd, trustAccepted, trustedPath, projectName } = useMemo(() => {
+    if (!ready) {
+      return { cwd: '', trustAccepted: undefined as undefined|boolean, trustedPath: undefined as undefined|boolean, projectName: '' };
+    }
+    const _cwd = getCwd();
+    const _trustAccepted = checkHasTrustDialogAccepted();
+    const _trustedPath = isPathTrusted(_cwd);
+    let _projectName = '';
+    try {
+      const prj = getCurrentProjectConfig();
+      _projectName = (prj && (prj.name || prj.projectName || prj.id)) || basename(_cwd);
+    } catch {
+      _projectName = basename(_cwd);
+    }
+    return { cwd: _cwd, trustAccepted: _trustAccepted, trustedPath: _trustedPath, projectName: _projectName };
+  }, [ready]);
+
+  const compact = page !== null;
+  const cwdShort = useMemo(() => ellipsisPath(cwd, compact ? 2 : 3), [cwd, compact]);
+
+  // Theme name
+  const themeLabel = String(theme || (ready ? (getGlobalConfig()?.theme ?? 'system') : '…'));
+
+  // Static Clawd pose
+  const clawdPose: ClawdPose = useMemo(() => {
+    if (!ready) return 'default';
+    if (page === null) return animEnabled ? 'arms-up' : 'default';
+    return tipsEnabled ? 'look-left' : 'look-right';
+  }, [ready, page, animEnabled, tipsEnabled]);
+
+  const uiTone = (String(theme) === 'dark') ? 'accent' : (String(theme) === 'highContrast' ? 'warning' : 'info');
+
+  return (
+    <Box flexDirection="column" minHeight={3}>
+      <ChipRow>
+        {/* Left: Clawd + Core Status */}
+        <Box>
+          <Box marginRight={2}>
+            {animEnabled ? <AnimatedClawd /> : <Clawd pose={clawdPose} />}
+          </Box>
+
+          <Chip label="Theme" value={themeLabel} tone="accent" />
+          <Chip label="Project" value={projectName || '—'} tone="info" />
+          <Chip label="CWD" value={cwdShort || '—'} tone="subtle" />
+          {trustedPath === undefined || trustAccepted === undefined ? (
+            <Chip label="Trust" value="…" tone="subtle" />
+          ) : trustedPath && trustAccepted ? (
+            <Chip label="Trust" value="✅ Trusted" tone="success" />
+          ) : (
+            <Chip label="Trust" value="🔒 Untrusted" tone="warning" />
+          )}
+        </Box>
+
+        {/* Right: UI Status merged display */}
+        <Box>
+          <Chip
+            label="UI"
+            value={`Anim ${animEnabled ? 'On' : 'Off'} · Tips ${tipsEnabled ? 'On' : 'Off'}`}
+            tone={uiTone as any}
+          />
+        </Box>
+      </ChipRow>
+
+      {!compact && (
+        <ChipRow>
+          <Box>
+            <Chip label="Shortcuts" value="N New · R Resume · P Provider · G Theme · ? Help" tone="subtle" />
+          </Box>
+        </ChipRow>
+      )}
+    </Box>
+  );
+});
+
+export default TopToolbar;