@ridit/lens 0.3.6 → 0.3.8

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ridit/lens",
-  "version": "0.3.6",
+  "version": "0.3.8",
   "description": "Know Your Codebase.",
   "author": "Ridit Jangra <riditjangra09@gmail.com> (https://ridit.space)",
   "license": "MIT",

package/src/commands/chat.tsx

@@ -1,23 +1,17 @@
 import React from "react";
-import { Box, Text } from "ink";
-import figures from "figures";
-import { existsSync } from "fs";
-import path from "path";
+import { Box } from "ink";
 import { ChatRunner } from "../components/chat/ChatRunner";
-import { ACCENT } from "../colors";
 
-export const ChatCommand = ({ path: inputPath }: { path: string }) => {
-  const resolvedPath = path.resolve(inputPath);
-
-  if (!existsSync(resolvedPath)) {
-    return (
-      <Box marginTop={1}>
-        <Text color="red">
-          {figures.cross} Path not found: {resolvedPath}
-        </Text>
-      </Box>
-    );
-  }
-
-  return <ChatRunner repoPath={resolvedPath} />;
-};
+export function ChatCommand({
+  path,
+  autoForce = false,
+}: {
+  path: string;
+  autoForce?: boolean;
+}) {
+  return (
+    <Box flexDirection="column">
+      <ChatRunner repoPath={path} autoForce={autoForce} />
+    </Box>
+  );
+}

package/src/components/chat/ChatMessage.tsx

@@ -1,7 +1,9 @@
 import React from "react";
 import { Box, Text } from "ink";
+import figures from "figures";
 import { ACCENT, GREEN, RED } from "../../colors";
 import type { Message } from "../../types/chat";
+import type { DiffLine } from "../repo/DiffViewer";
 
 function InlineText({ text }: { text: string }) {
   const parts = text.split(/(`[^`]+`|\*\*[^*]+\*\*)/g);
@@ -170,10 +172,12 @@ export function StaticMessage({ msg }: { msg: Message }) {
   if (msg.type === "plan") {
     return (
       <Box flexDirection="column" marginBottom={1}>
-        <Box gap={1}>
-          <Text color={ACCENT}>*</Text>
-          <MessageBody content={msg.content} />
-        </Box>
+        {msg.content ? (
+          <Box gap={1}>
+            <Text color={ACCENT}>*</Text>
+            <MessageBody content={msg.content} />
+          </Box>
+        ) : null}
         <Box marginLeft={2} gap={1}>
           <Text color={msg.applied ? GREEN : "gray"}>
             {msg.applied ? "✓" : "·"}
@@ -182,6 +186,44 @@ export function StaticMessage({ msg }: { msg: Message }) {
             {msg.applied ? "changes applied" : "changes skipped"}
           </Text>
         </Box>
+        {msg.applied && msg.diffLines && msg.diffLines.length > 0 && (
+          <Box flexDirection="column" marginLeft={2} marginTop={0}>
+            {msg.patches.map((patch, fi) => (
+              <Box key={patch.path} flexDirection="column">
+                <Text bold color={fi % 2 === 0 ? "cyan" : "magenta"}>
+                  {figures.bullet} {patch.path}
+                  {patch.isNew ? " (new)" : ""}
+                </Text>
+                {(msg.diffLines![fi] ?? []).map((line: DiffLine, li: number) => {
+                  const prefix =
+                    line.type === "added"
+                      ? "+"
+                      : line.type === "removed"
+                        ? "-"
+                        : " ";
+                  const color =
+                    line.type === "added"
+                      ? "green"
+                      : line.type === "removed"
+                        ? "red"
+                        : "gray";
+                  const lineNumStr =
+                    line.lineNum === -1
+                      ? "   "
+                      : String(line.lineNum).padStart(3, " ");
+                  return (
+                    <Box key={li}>
+                      <Text color="gray">{lineNumStr} </Text>
+                      <Text color={color}>
+                        {prefix} {line.content}
+                      </Text>
+                    </Box>
+                  );
+                })}
+              </Box>
+            ))}
+          </Box>
+        )}
       </Box>
     );
   }

package/src/components/chat/ChatOverlays.tsx

@@ -1,7 +1,7 @@
-import React from "react";
-import { Box, Static, Text } from "ink";
+import React, { useState, useEffect } from "react";
+import { Box, Static, Text, useStdout } from "ink";
 import Spinner from "ink-spinner";
-import TextInput from "ink-text-input";
+import { TextArea } from "./TextArea";
 import { ACCENT, GREEN, RED } from "../../colors";
 import { DiffViewer } from "../repo/DiffViewer";
 import { StaticMessage } from "./ChatMessage";
@@ -24,11 +24,6 @@ function Hint({ text }: { text: string }) {
   );
 }
 
-// ── PermissionPrompt ──────────────────────────────────────────────────────────
-//
-// Works with both the old explicit ToolCall union and the new generic
-// { type, _label, _display } shape produced by the plugin system.
-
 export function PermissionPrompt({
   tool,
   onDecide,
@@ -40,7 +35,6 @@ export function PermissionPrompt({
   let label: string;
   let value: string;
 
-  // Generic plugin tool shape
   if ("_label" in tool) {
     const iconMap: Record<string, string> = {
       run: "$",
@@ -61,7 +55,6 @@ export function PermissionPrompt({
     label = tool._label;
     value = tool._display;
   } else {
-    // Legacy explicit ToolCall union
     if (tool.type === "shell") {
       icon = "$";
       label = "run";
@@ -134,25 +127,37 @@ export function InputBox({
   onSubmit: (v: string) => void;
   inputKey?: number;
 }) {
+  const { stdout } = useStdout();
+  const [cols, setCols] = useState(stdout?.columns ?? 80);
+
+  useEffect(() => {
+    const handler = () => setCols(stdout?.columns ?? 80);
+    stdout?.on("resize", handler);
+    return () => {
+      stdout?.off("resize", handler);
+    };
+  }, [stdout]);
+
+  const rule = "─".repeat(Math.max(1, cols));
+
   return (
-    <Box
-      marginTop={1}
-      borderBottom
-      borderTop
-      borderRight={false}
-      borderLeft={false}
-      borderColor={"gray"}
-      borderStyle="single"
-    >
+    <Box flexDirection="column" marginTop={1}>
+      <Text color="gray" dimColor>
+        {rule}
+      </Text>
       <Box gap={1}>
         <Text color={ACCENT}>{">"}</Text>
-        <TextInput
+        <TextArea
           key={inputKey}
           value={value}
           onChange={onChange}
           onSubmit={onSubmit}
+          placeholder="ask anything..."
         />
       </Box>
+      <Text color="gray" dimColor>
+        {rule}
+      </Text>
     </Box>
   );
 }
@@ -196,7 +201,7 @@ export function ShortcutBar({
   return (
     <Box gap={3} marginTop={0}>
       <Text color="gray" dimColor>
-        enter send · ^v paste · ^c exit
+        enter send · ctrl+enter newline · ctrl+del del word · ^f force · ^c exit
       </Text>
       {forceApprove ? (
         <Text color={RED}>⚡⚡ force-all</Text>
@@ -244,7 +249,7 @@ export function CloningView({
       <History committed={committed} />
       <Box gap={1} marginTop={1}>
         <Text color={ACCENT}>
-          <Spinner />
+          <Spinner type="line" />
         </Text>
         <Text color="gray">cloning </Text>
         <Text color={ACCENT}>{stage.repoUrl}</Text>

package/src/components/chat/ChatRunner.tsx

@@ -4,11 +4,11 @@ import Spinner from "ink-spinner";
 import { useState } from "react";
 import path from "path";
 import os from "os";
-import TextInput from "ink-text-input";
+import { TextArea } from "./TextArea";
 import { ACCENT } from "../../colors";
 import { ProviderPicker } from "../provider/ProviderPicker";
 import { startCloneRepo } from "../../utils/repo";
-import { useThinkingPhrase } from "../../utils/thinking";
+import { useThinkingPhrase, useThinkingTip, useThinkingTimer } from "../../utils/thinking";
 import { walkDir, applyPatches, toCloneUrl } from "../../utils/chat";
 import { appendMemory } from "../../utils/memory";
 import { getChatNameSuggestions, saveChat } from "../../utils/chatHistory";
@@ -136,7 +136,7 @@ function ForceAllWarning({
           esc
         </Text>
         <Text color="gray"> to cancel: </Text>
-        <TextInput
+        <TextArea
           value={input}
           onChange={setInput}
           onSubmit={(v) => onConfirm(v.trim().toLowerCase() === "yes")}
@@ -147,9 +147,18 @@ function ForceAllWarning({
   );
 }
 
-export const ChatRunner = ({ repoPath }: { repoPath: string }) => {
-  const chat = useChat(repoPath);
-  const thinkingPhrase = useThinkingPhrase(chat.stage.type === "thinking");
+export const ChatRunner = ({
+  repoPath,
+  autoForce = false,
+}: {
+  repoPath: string;
+  autoForce?: boolean;
+}) => {
+  const chat = useChat(repoPath, autoForce);
+  const isThinking = chat.stage.type === "thinking";
+  const thinkingPhrase = useThinkingPhrase(isThinking);
+  const thinkingTip = useThinkingTip(isThinking);
+  const thinkingTimer = useThinkingTimer(isThinking);
 
   const handleStageKey = (input: string, key: any) => {
     const { stage } = chat;
@@ -321,10 +330,14 @@ export const ChatRunner = ({ repoPath }: { repoPath: string }) => {
           if (msg?.type === "plan") {
             chat.applyPatchesAndContinue(msg.patches);
             const applied: Message = { ...msg, applied: true };
-            chat.setAllMessages((prev) =>
-              prev.map((m, i) => (i === chat.pendingMsgIndex ? applied : m)),
+            const updatedAll = chat.allMessages.map((m, i) =>
+              i === chat.pendingMsgIndex ? applied : m,
             );
+            chat.setAllMessages(updatedAll);
             chat.setCommitted((prev) => [...prev, applied]);
+            chat.setPendingMsgIndex(null);
+            chat.continueAfterChanges(updatedAll, msg.content || "code changes");
+            return;
           }
         }
         chat.setPendingMsgIndex(null);
@@ -352,6 +365,26 @@ export const ChatRunner = ({ repoPath }: { repoPath: string }) => {
     }
   };
 
+  useInput(
+    (input, key) => {
+      if (!(key.ctrl && input === "f")) return;
+      if (chat.forceApprove) {
+        chat.setForceApprove(false);
+        chat.setAutoApprove(false);
+        const msg: Message = {
+          role: "assistant",
+          content: "Force-all mode OFF — tools will ask for permission again.",
+          type: "text",
+        };
+        chat.setCommitted((prev) => [...prev, msg]);
+        chat.setAllMessages((prev: Message[]) => [...prev, msg]);
+      } else {
+        chat.setShowForceWarning(true);
+      }
+    },
+    { isActive: chat.stage.type === "idle" },
+  );
+
   const chatInput = useChatInput(
     chat.stage,
     chat.showTimeline,
@@ -408,7 +441,7 @@ export const ChatRunner = ({ repoPath }: { repoPath: string }) => {
       <Box gap={1} marginTop={1}>
         <Text color={ACCENT}>*</Text>
         <Text color={ACCENT}>
-          <Spinner />
+          <Spinner type="arc" />
         </Text>
         <Text color="gray" dimColor>
           indexing codebase…
@@ -476,12 +509,19 @@ export const ChatRunner = ({ repoPath }: { repoPath: string }) => {
       )}
 
       {!chat.showForceWarning && stage.type === "thinking" && (
-        <Box gap={1}>
-          <Text color={ACCENT}>●</Text>
-          <TypewriterText text={thinkingPhrase} />
-          <Text color="gray" dimColor>
-            · esc cancel
-          </Text>
+        <Box flexDirection="column">
+          <Box gap={1}>
+            <Text color={ACCENT}>●</Text>
+            <TypewriterText text={thinkingPhrase} />
+            <Text color="gray" dimColor>
+              {thinkingTimer ? `· ${thinkingTimer} ` : ""}· esc cancel
+            </Text>
+          </Box>
+          <Box marginLeft={2}>
+            <Text color="gray" dimColor>
+              tip: {thinkingTip}
+            </Text>
+          </Box>
         </Box>
       )}
 

package/src/components/chat/TextArea.tsx

@@ -0,0 +1,177 @@
+import React, { useState, useEffect } from "react";
+import { Text, useInput } from "ink";
+import chalk from "chalk";
+
+function isWordChar(ch: string): boolean {
+  return /[\w]/.test(ch);
+}
+
+function wordBoundaryLeft(text: string, pos: number): number {
+  if (pos <= 0) return 0;
+  let i = pos - 1;
+
+  while (i > 0 && !isWordChar(text[i]!)) i--;
+
+  while (i > 0 && isWordChar(text[i - 1]!)) i--;
+  return i;
+}
+
+function wordBoundaryRight(text: string, pos: number): number {
+  const len = text.length;
+  if (pos >= len) return len;
+  let i = pos;
+
+  while (i < len && isWordChar(text[i]!)) i++;
+
+  while (i < len && !isWordChar(text[i]!)) i++;
+  return i;
+}
+
+export interface TextAreaProps {
+  value: string;
+  onChange: (value: string) => void;
+  onSubmit: (value: string) => void;
+  focus?: boolean;
+  placeholder?: string;
+}
+
+export function TextArea({
+  value,
+  onChange,
+  onSubmit,
+  focus = true,
+  placeholder = "",
+}: TextAreaProps) {
+  const [cursor, setCursor] = useState(value.length);
+  const [prevValue, setPrevValue] = useState(value);
+
+  if (value !== prevValue) {
+    setPrevValue(value);
+    const lenDiff = Math.abs(value.length - prevValue.length);
+    if (cursor > value.length || lenDiff > 1) {
+      setCursor(value.length);
+    }
+  }
+
+  useInput(
+    (input, key) => {
+      if (key.upArrow || key.downArrow) return;
+      if (key.tab || (key.shift && key.tab)) return;
+      if (key.ctrl && input === "c") return;
+
+      const isShiftEnter =
+        (key.return && key.shift) ||
+        input === "\x1b[27;2;13~" ||
+        input === "\x1b[13;2u";
+
+      if (key.return && !key.meta && !key.shift && !isShiftEnter) {
+        onSubmit(value);
+        return;
+      }
+
+      if (isShiftEnter) {
+        const next = value.slice(0, cursor) + "\n" + value.slice(cursor);
+        onChange(next);
+        setCursor((c) => c + 1);
+        return;
+      }
+
+      if (key.leftArrow && key.ctrl) {
+        setCursor(wordBoundaryLeft(value, cursor));
+        return;
+      }
+
+      if (key.rightArrow && key.ctrl) {
+        setCursor(wordBoundaryRight(value, cursor));
+        return;
+      }
+
+      if (key.leftArrow) {
+        setCursor((c) => Math.max(0, c - 1));
+        return;
+      }
+
+      if (key.rightArrow) {
+        setCursor((c) => Math.min(value.length, c + 1));
+        return;
+      }
+
+      if (key.ctrl && input === "a") {
+        const lineStart = value.lastIndexOf("\n", cursor - 1) + 1;
+        setCursor(lineStart);
+        return;
+      }
+
+      if (key.ctrl && input === "e") {
+        const lineEnd = value.indexOf("\n", cursor);
+        setCursor(lineEnd === -1 ? value.length : lineEnd);
+        return;
+      }
+
+      if (key.ctrl && input === "u") {
+        const lineStart = value.lastIndexOf("\n", cursor - 1) + 1;
+        onChange(value.slice(0, lineStart) + value.slice(cursor));
+        setCursor(lineStart);
+        return;
+      }
+
+      if (key.ctrl && input === "k") {
+        const lineEnd = value.indexOf("\n", cursor);
+        onChange(
+          value.slice(0, cursor) + (lineEnd === -1 ? "" : value.slice(lineEnd)),
+        );
+        return;
+      }
+
+      if (key.ctrl && input === "f") return;
+
+      if ((key.ctrl && key.delete) || input === "\x1b[3;5~") {
+        const to = wordBoundaryLeft(value, cursor);
+        onChange(value.slice(0, to) + value.slice(cursor));
+        setCursor(to);
+        return;
+      }
+
+      if (key.backspace || key.delete) {
+        if (cursor > 0) {
+          onChange(value.slice(0, cursor - 1) + value.slice(cursor));
+          setCursor((c) => c - 1);
+        }
+        return;
+      }
+
+      if (key.escape) return;
+
+      if (input) {
+        const next = value.slice(0, cursor) + input + value.slice(cursor);
+        onChange(next);
+        setCursor((c) => c + input.length);
+      }
+    },
+    { isActive: focus },
+  );
+
+  if (value.length === 0 && placeholder) {
+    return (
+      <Text>
+        {chalk.inverse(placeholder[0] ?? " ")}
+        {placeholder.length > 1 ? chalk.gray(placeholder.slice(1)) : ""}
+      </Text>
+    );
+  }
+
+  let rendered = "";
+  for (let i = 0; i < value.length; i++) {
+    const ch = value[i]!;
+    if (i === cursor) {
+      rendered += ch === "\n" ? chalk.inverse(" ") + "\n" : chalk.inverse(ch);
+    } else {
+      rendered += ch;
+    }
+  }
+  if (cursor === value.length) {
+    rendered += chalk.inverse(" ");
+  }
+
+  return <Text>{rendered}</Text>;
+}