bingocode 1.1.101 → 1.1.102

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "bingocode",
-  "version": "1.1.101",
+  "version": "1.1.102",
   "type": "module",
   "bin": {
     "claude": "bin/claude-win.cjs",

package/src/manager/CliMenuManager.tsx

@@ -73,8 +73,8 @@ async function buildSpawnEnv(): Promise<NodeJS.ProcessEnv> {
 }
 
 // Top height: Home fits LogoV2 + Toolbar, other pages more compact
-const TOP_H_HOME = Number(process.env.CLI_TOP_H_HOME || 9);
-const TOP_H_COMPACT = Number(process.env.CLI_TOP_H_COMPACT || 6);
+const TOP_H_HOME = Number(process.env.CLI_TOP_H_HOME || 10);
+const TOP_H_COMPACT = Number(process.env.CLI_TOP_H_COMPACT || 7);
 // Bottom bar height
 const BOTTOM_H = Number(process.env.CLI_BOTTOM_H || 3);
 
@@ -91,13 +91,13 @@ const i18nMap = {
       about: 'Bingo CLI - Version Info & About',
       aboutContent: [
         'Bingo is an AI assistant terminal client.',
-        'Author: leanchy (Email: leanchy07@outlook.com)',
-        'Github: github.com/leanchy/bingo-claude-code-offline-installer',
         '1. API Config: Press "P" or select "API Config" to set up your keys.',
         '2. Model Slots: Configure specific models in the Provider panel.',
         '3. Background Service: Bingo runs a local server to manage sessions.',
         '4. Start Chat: Run `bingocode` or `claude` in any terminal to start.',
       ].join('\n'),
+      author: 'Author: leanchy (Email: leanchy07@outlook.com)',
+      github: 'Github: github.com/leanchy/bingo-claude-code-offline-installer',
       mark: '→ Mark Session',
       unmark: '→ Unmark Session',
       tipsSimple: 'L Lang | ESC Back | ←→ Menu | ↩ Enter | ? Help',
@@ -119,13 +119,13 @@ const i18nMap = {
     about: 'Bingo CLI Terminal - Version Info & About',
     aboutContent: [
       'Bingo is an AI assistant terminal client.',
-      'Author: leanchy (Email: leanchy07@outlook.com)',
-      'Github: github.com/leanchy/bingo-claude-code-offline-installer',
       '1. API Config: Press "P" or select "API Config" to set up your keys.',
       '2. Model Slots: Configure specific models in the Provider panel.',
       '3. Background Service: Bingo runs a local server to manage sessions.',
       '4. Start Chat: Run `bingocode` or `claude` in any terminal to start.',
     ].join('\n'),
+    author: 'Author: leanchy (Email: leanchy07@outlook.com)',
+    github: 'Github: github.com/leanchy/bingo-claude-code-offline-installer',
     mark: '→ Mark Session',
     unmark: '→ Unmark Session',
     tipsSimple: 'L Lang | ESC Back | ←→ Menu | ↩ Enter | ? Help',
@@ -305,7 +305,7 @@ export const CliMenuManager: React.FC = () => {
   const [showHelp, setShowHelp] = useState(false);
 
   // Keyboard navigation for lists
-  const [listOffset, setListOffset] = useState(0);
+  const [historyHighlightIndex, setHistoryHighlightIndex] = useState(0);
 
   // Quick Resume (R)
   const [quickResumeRequested, setQuickResumeRequested] = useState(false);
@@ -571,6 +571,7 @@ export const CliMenuManager: React.FC = () => {
       setHistoryCursor(null);
       setSessionMessages([]);
       setMsgsPage(0);
+      setHistoryHighlightIndex(0);
       setSettingsOffset(0);
       return;
     }
@@ -611,30 +612,22 @@ export const CliMenuManager: React.FC = () => {
     // History shortcuts
     if (!showHelp && page === 'history') {
       if (historyMenuStage === 'list') {
-        const HIST_VISIBLE = MID_H - 2;
-        if (key.downArrow || input === 'j' || input === '\u001b[B') {
-          // Internal SelectInput handles cursor, we just need to track offset for ScrollBar
-          setListOffset(o => Math.min(o + 1, Math.max(0, groupedHistoryItems.length - HIST_VISIBLE)));
-        }
-        if (key.upArrow || input === 'k' || input === '\u001b[A') {
-          setListOffset(o => Math.max(0, o - 1));
-        }
         if (input === 'q') {
           setPage(null);
           setHistoryMenuStage('list');
           setSelectedHistory(null);
           setHistoryCursor(null);
-          setListOffset(0);
+          setHistoryHighlightIndex(0);
           return;
         }
         if (input === 'j' && historyHasMore) {
           setHistoryCursor(historyList[historyList.length - 1]?.id || null);
-          setListOffset(0);
+          setHistoryHighlightIndex(0);
           return;
         }
         if (input === 'k') {
           setHistoryCursor(null);
-          setListOffset(0);
+          setHistoryHighlightIndex(0);
           return;
         }
       } else if (historyMenuStage === 'window') {
@@ -934,12 +927,23 @@ export const CliMenuManager: React.FC = () => {
     // Home: WelcomeV2 (58 cols wide)
     if (page === null) {
       const WELCOME_W = 58;
-      const leftPad = Math.max(0, Math.floor((VIEW_W - WELCOME_W) / 2));
       return (
         <Box flexDirection="column" width={VIEW_W} height={MID_H}>
           <Box flexDirection="row" width={VIEW_W} flexGrow={1}>
-            <Box width={leftPad} flexShrink={0} />
-            <WelcomeV2 />
+            <Box paddingX={2}>
+              <WelcomeV2 />
+            </Box>
+            <Box flexGrow={1} flexDirection="column" alignItems="flex-end" paddingRight={4} paddingTop={1}>
+              <Box borderStyle="classic" borderColor="gray" paddingX={1} flexDirection="column">
+                <Text color="cyan" bold>Version Info</Text>
+                <Text> </Text>
+                <Text dimColor>v1.1.101</Text>
+                <Text dimColor>Stable Release</Text>
+                <Text> </Text>
+                <Text color="gray">Arch: {process.arch}</Text>
+                <Text color="gray">Node: {process.version}</Text>
+              </Box>
+            </Box>
           </Box>
           {!apiUrl && !bootErr && (
             <StateDisplay type="loading" message="Starting server..." />
@@ -1145,16 +1149,21 @@ export const CliMenuManager: React.FC = () => {
 
     // About
     if (page === 'about') {
+      const i18n = i18nMap[lang] as any;
       return (
-        <Box width={VIEW_W} height={MID_H} flexDirection="column">
-          <Text color="cyan" bold>{i18nMap[lang].about}</Text>
-          <Box marginTop={1} flexDirection="column">
-            <Text>{(i18nMap[lang] as any).aboutContent}</Text>
+        <Box width={VIEW_W} height={MID_H} flexDirection="column" paddingX={1}>
+          <Box flexGrow={1} flexDirection="column">
+            <Text color="cyan" bold>{i18n.about}</Text>
+            <Box marginTop={1} flexDirection="column">
+              <Text>{i18n.aboutContent}</Text>
+            </Box>
+            <Box marginTop={1}>
+              <Hint>API Base: {apiUrl}</Hint>
+            </Box>
           </Box>
-          <Box marginTop={1}>
-            <Hint>
-              API Base: {apiUrl}
-            </Hint>
+          <Box borderStyle="classic" borderColor="gray" paddingX={1} flexDirection="column" marginTop={1}>
+            <Text dimColor size="small">{i18n.author}</Text>
+            <Text dimColor size="small">{i18n.github}</Text>
           </Box>
         </Box>
       );

package/src/manager/CliMenuUi.tsx

@@ -266,16 +266,36 @@ export const TopBar: React.FC<{
   compactLogo: React.ReactNode;
   toolbar?: React.ReactNode;
   ip?: string;
-}> = 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} />}
+}> = 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}>
+          {isHome ? (
+            <Box flexDirection="column">
+              <Text bold color="cyan">Welcome Bingo</Text>
+              <Text bold color="cyan">Code</Text>
+            </Box>
+          ) : (
+            <Text bold color="cyan">Bingo Code</Text>
+          )}
+          {ip ? (
+            <Box marginTop={1}>
+              <Text color="gray" dimColor>IP: {ip.replace(':','\n   ')}</Text>
+            </Box>
+          ) : null}
+        </Box>
+
+        {/* Center/Right Section: Logo + Toolbar (Dynamic) */}
+        <Box flexGrow={1} flexDirection="column">
+           {toolbar}
+        </Box>
       </Box>
-      {toolbar ? <Box>{toolbar}</Box> : <Box><Hint dim>{ready ? '' : '…'}</Hint></Box>}
-    </Box>
-  </Panel>
-));
+    </Panel>
+  );
+});
 
 // InfoPair (Label fixed width for column alignment)
 export const InfoPair: React.FC<{ label: string; value: string; labelColor?: string; valueColor?: string; labelWidth?: number }> = memo(({