jvcs 1.6.2 → 1.6.4

package/controllers/diff-engine/ui.js

@@ -1,143 +1,81 @@
 const blessed = require("blessed");
 const aiAnalyzer = require("./aiAnalyzer");
-const { marked } = require("marked");
-const { TerminalRenderer } = require("marked-terminal");
-
-marked.setOptions({
-    renderer: TerminalRenderer
-});
 
 function startUI(state) {
     const screen = blessed.screen({
         smartCSR: true,
         title: "JVCS Diff Viewer"
-    })
+    });
 
     // ---------------------------------------
-    // HEADER
+    // UI COMPONENTS
     // ---------------------------------------
     const header = blessed.box({
-        top: 0,
-        height: 1,
-        width: "100%",
+        top: 0, height: 1, width: "100%",
         content: ` JVCS DIFF VIEW (${state.mode}) | ↑↓ Navigate | Enter Open | Esc Back | Tab Switch | Q Quit `,
-        style: {
-            fg: "white",
-            bg: "blue",
-            bold: true,
-            underline: true
-        },
+        style: { fg: "white", bg: "blue", bold: true, underline: true },
         tags: true
-    })
-    screen.append(header)
+    });
+    screen.append(header);
 
-    // ---------------------------------------
-    // FILE LIST VIEW
-    // ---------------------------------------
     const fileList = blessed.list({
-        top: 1,
-        left: 0,
-        width: "100%",
-        height: "100%-1",
-        keys: true,
-        vi: true,
-        border: "line",
+        top: 1, left: 0, width: "100%", height: "100%-1",
+        keys: true, vi: true, border: "line",
         label: " Changed Files ",
-        style: {
-            selected: { bg: "blue" },
-            item: { fg: "white" }
-        },
+        style: { selected: { bg: "blue" }, item: { fg: "white" } },
         tags: true
-    })
-    screen.append(fileList)
+    });
+    screen.append(fileList);
 
-    function renderFileList() {
-        const items = state.files.map(file => {
-            let statusColored
-            switch(file.status) {
-                case "added": statusColored = `{green-fg}${file.status.toUpperCase()}{/green-fg}`; break
-                case "deleted": statusColored = `{red-fg}${file.status.toUpperCase()}{/red-fg}`; break
-                case "modified": statusColored = `{yellow-fg}${file.status.toUpperCase()}{/yellow-fg}`; break
-                default: statusColored = file.status.toUpperCase()
-            }
-            return `${statusColored}  ${file.path}`
-        })
-        fileList.setItems(items)
-        fileList.select(state.selectedIndex)
-        fileList.focus()
-        screen.render()
-    }
+    const panelOptions = {
+        top: 1, height: "100%-1", border: "line",
+        scrollable: true, alwaysScroll: true, keys: true, vi: true,
+        scrollbar: { ch: "│", track: { bg: "black" }, style: { bg: "yellow" } },
+        padding: { left: 1, right: 1 }, tags: true
+    };
+
+    const leftBox = blessed.box({ ...panelOptions, left: 0, width: "33%", label: " LEFT " });
+    const rightBox = blessed.box({ ...panelOptions, left: "33%", width: "34%", label: " RIGHT " });
+    const aiBox = blessed.box({ ...panelOptions, left: "67%", width: "33%", label: " AI ANALYSIS " });
 
     // ---------------------------------------
-    // FILE VIEW (3 PANELS)
+    // HELPERS
     // ---------------------------------------
-    const leftBox = blessed.box({
-        top: 1,
-        left: 0,
-        width: "33%",
-        height: "100%-1",
-        border: "line",
-        label: " LEFT ",
-        scrollable: true,
-        alwaysScroll: true,
-        keys: true,
-        vi: true,
-        scrollbar: { ch: "│", track: { bg: "black" }, style: { bg: "yellow" } },
-        padding: { left: 1, right: 1 },
-        tags: true
-    })
-
-    const rightBox = blessed.box({
-        top: 1,
-        left: "33%",
-        width: "34%",
-        height: "100%-1",
-        border: "line",
-        label: " RIGHT ",
-        scrollable: true,
-        alwaysScroll: true,
-        keys: true,
-        vi: true,
-        scrollbar: { ch: "│", track: { bg: "black" }, style: { bg: "yellow" } },
-        padding: { left: 1, right: 1 },
-        tags: true
-    })
-
-    const aiBox = blessed.box({
-        top: 1,
-        left: "67%",
-        width: "33%",
-        height: "100%-1",
-        border: "line",
-        label: " AI ANALYSIS ",
-        scrollable: true,
-        alwaysScroll: true,
-        keys: true,
-        vi: true,
-        scrollbar: { ch: "│", track: { bg: "black" }, style: { bg: "yellow" } },
-        padding: { left: 1, right: 1 },
-        tags: true
-    })
+    function stripMarkdown(text) {
+        return text
+            .replace(/#{1,6}\s/g, "")            // Remove headers
+            .replace(/\*\*(.*?)\*\*/g, "$1")      // Bold to text
+            .replace(/\*(.*?)\*/g, "$1")          // Italics to text
+            .replace(/`(.*?)`/g, "$1")            // Code ticks to text
+            .replace(/\[(.*?)\]\(.*?\)/g, "$1")   // Links to text
+            .replace(/^>\s/gm, "")                // Blockquotes
+            .replace(/^- /gm, "• ");              // List markers to bullets
+    }
 
     function colorDiffContent(content, type) {
+        if (!content) return "";
         return content.split("\n").map(line => {
-            if(type === "added") return `{green-fg}+ ${line}{/green-fg}`
-            if(type === "removed") return `{red-fg}- ${line}{/red-fg}`
-            return `  ${line}`
-        }).join("\n")
+            if(type === "added") return `{green-fg}+ ${line}{/green-fg}`;
+            if(type === "removed") return `{red-fg}- ${line}{/red-fg}`;
+            return `  ${line}`;
+        }).join("\n");
     }
 
+    // ---------------------------------------
+    // RENDER LOGIC
+    // ---------------------------------------
     async function renderFileView() {
-        const file = state.getCurrentFile()
-        if (!file) return
-
-        leftBox.setContent(colorDiffContent(file.leftContent, "removed"))
-        rightBox.setContent(colorDiffContent(file.rightContent, "added"))
+        const file = state.getCurrentFile();
+        if (!file) return;
 
+        leftBox.setContent(colorDiffContent(file.leftContent, "removed"));
+        rightBox.setContent(colorDiffContent(file.rightContent, "added"));
         aiBox.setContent("AI Analysis: Loading...");
-        screen.append(leftBox)
-        screen.append(rightBox)
-        screen.append(aiBox)
+
+        screen.append(leftBox);
+        screen.append(rightBox);
+        screen.append(aiBox);
+        
         updateActiveTabHighlight();
         screen.render();
 
@@ -147,85 +85,46 @@ function startUI(state) {
                 leftContent: file.leftContent,
                 rightContent: file.rightContent,
                 mode: state.mode
-            })
+            });
 
-            const parsed = marked(aiSummary); // Markdown → terminal-friendly text
-            aiBox.setContent(parsed);
-            screen.render()
+            // Convert to clean text for terminal
+            aiBox.setContent(stripMarkdown(aiSummary));
+            screen.render();
         }
         catch(error) {
-            aiBox.setContent(`AI Analysis failed: ${error.message || error}`);
-            screen.render()
+            aiBox.setContent(`{red-fg}AI Analysis failed: ${error.message || error}{/red-fg}`);
+            screen.render();
         }
     }
 
-    function destroyFileView() {
-        leftBox.detach()
-        rightBox.detach()
-        aiBox.detach()
-        screen.render()
-    }
-
     function updateActiveTabHighlight() {
-        leftBox.style.border.fg = state.activeTab === 0 ? "yellow" : "grey"
-        rightBox.style.border.fg = state.activeTab === 1 ? "yellow" : "grey"
-        aiBox.style.border.fg = state.activeTab === 2 ? "yellow" : "grey"
-
-        if(state.activeTab === 0) leftBox.focus()
-        else if(state.activeTab === 1) rightBox.focus()
-        else aiBox.focus()
-
-        screen.render()
+        leftBox.style.border.fg = state.activeTab === 0 ? "yellow" : "grey";
+        rightBox.style.border.fg = state.activeTab === 1 ? "yellow" : "grey";
+        aiBox.style.border.fg = state.activeTab === 2 ? "yellow" : "grey";
+        if(state.activeTab === 0) leftBox.focus();
+        else if(state.activeTab === 1) rightBox.focus();
+        else aiBox.focus();
+        screen.render();
     }
 
     // ---------------------------------------
-    // KEYBOARD CONTROLS
+    // INPUT HANDLING
     // ---------------------------------------
-    screen.key(["q", "C-c"], () => process.exit(0))
-
-    // Navigate list
-    fileList.key(["up"], () => {
-        if(state.selectedIndex > 0) {
-            state.selectFile(state.selectedIndex - 1)
-            renderFileList()
-        }
-    })
-    fileList.key(["down"], () => {
-        if(state.selectedIndex < state.files.length - 1) {
-            state.selectFile(state.selectedIndex + 1)
-            renderFileList()
-        }
-    })
-
-    // Enter → Open file view
-    fileList.key(["enter"], async () => {
-        state.goToFileView()
-        fileList.detach()
-        await renderFileView()
-    })
-
-    // ESC → Back to list
-    screen.key(["escape"], () => {
-        if(state.screen === "FILE_VIEW") {
-            state.goToListView()
-            destroyFileView()
-            screen.append(fileList)
-            renderFileList()
-        }
-    })
+    screen.key(["q", "C-c"], () => process.exit(0));
+    fileList.key(["up"], () => { if(state.selectedIndex > 0) { state.selectFile(state.selectedIndex - 1); renderFileList(); }});
+    fileList.key(["down"], () => { if(state.selectedIndex < state.files.length - 1) { state.selectFile(state.selectedIndex + 1); renderFileList(); }});
+    fileList.key(["enter"], async () => { state.goToFileView(); fileList.detach(); await renderFileView(); });
+    screen.key(["escape"], () => { if(state.screen === "FILE_VIEW") { state.goToListView(); leftBox.detach(); rightBox.detach(); aiBox.detach(); screen.append(fileList); renderFileList(); }});
+    screen.key(["tab"], () => { if(state.screen === "FILE_VIEW") { state.switchTab((state.activeTab + 1) % 3); updateActiveTabHighlight(); }});
 
-    // TAB → switch active panel
-    screen.key(["tab"], () => {
-        if(state.screen === "FILE_VIEW") {
-            state.switchTab((state.activeTab + 1) % 3)
-            updateActiveTabHighlight()
-        }
-    })
+    function renderFileList() {
+        fileList.setItems(state.files.map(f => `${f.status === "added" ? "{green-fg}" : f.status === "deleted" ? "{red-fg}" : "{yellow-fg}"}${f.status.toUpperCase()}{/} ${f.path}`));
+        fileList.select(state.selectedIndex);
+        fileList.focus();
+        screen.render();
+    }
 
-    // ---------------------------------------
-    // INITIAL RENDER
-    // ---------------------------------------
-    renderFileList()
+    renderFileList();
 }
 
-module.exports = startUI
+module.exports = startUI;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "jvcs",
-  "version": "1.6.2",
+  "version": "1.6.4",
   "bin": {
     "jvcs": "index.js"
   },
@@ -16,6 +16,7 @@
     "googleapis": "^164.1.0",
     "inquirer": "^8.2.7",
     "marked": "^15.0.12",
+    "marked-plaintext": "^0.0.2",
     "marked-terminal": "^7.3.0",
     "minimatch": "^10.2.4",
     "uuid": "^13.0.0",