Improve notification display on CLI when source is HTML (#1756)

Author: hillary-mutisya

ts/packages/dispatcher/package.json

@@ -60,6 +60,7 @@
     "exifreader": "^4.30.1",
     "file-size": "^1.0.0",
     "glob": "^10.3.12",
+    "html-to-text": "^9.0.5",
     "image-memory": "workspace:*",
     "knowledge-processor": "workspace:*",
     "knowpro": "workspace:*",
@@ -76,6 +77,7 @@
     "@types/debug": "^4.1.12",
     "@types/file-size": "^1.0.3",
     "@types/glob": "^8.1.0",
+    "@types/html-to-text": "^9.0.4",
     "@types/jest": "^29.5.7",
     "@types/proper-lockfile": "^4.1.4",
     "@types/ws": "^8.5.10",

ts/packages/dispatcher/src/helpers/console.ts

@@ -19,6 +19,7 @@ import { createInterface } from "readline/promises";
 import fs from "fs";
 import readline from "readline";
 import open from "open";
+import { convert } from "html-to-text";
 
 function displayPadEnd(content: string, length: number): string {
     // Account for full width characters
@@ -120,9 +121,16 @@ function createConsoleClientIO(rl?: readline.promises.Interface): ClientIO {
     ): void {
         const time = new Date(timestamp).toLocaleTimeString();
 
-        // Format the notification with timestamp and source
         const header = chalk.dim(`[${time}] ${source}:`);
-        const content = formatDisplayContent(data);
+
+        let content: string;
+        if (isHtmlContent(data)) {
+            const htmlContent = extractHtmlString(data);
+            content = convertHtmlToText(htmlContent);
+        } else {
+            content = formatDisplayContent(data);
+        }
+
         const formattedMessage = `${header}\n  ${content}`;
 
         displayContent(formattedMessage);
@@ -268,6 +276,77 @@ function initializeConsole(rl?: readline.promises.Interface) {
     readline.emitKeypressEvents(process.stdin);
 }
 
+function isHtmlContent(data: string | DisplayContent): boolean {
+    if (typeof data === "object" && data !== null && "type" in data) {
+        return data.type === "html";
+    }
+    if (typeof data === "string") {
+        return /<[^>]+>/.test(data);
+    }
+    if (typeof data === "object" && data !== null && "content" in data) {
+        const content = data.content;
+        if (typeof content === "string") {
+            return /<[^>]+>/.test(content);
+        }
+    }
+    return false;
+}
+
+function extractHtmlString(data: string | DisplayContent): string {
+    if (typeof data === "string") {
+        return data;
+    }
+    if (typeof data === "object" && data !== null && "content" in data) {
+        if (typeof data.content === "string") {
+            return data.content;
+        }
+    }
+    return String(data);
+}
+
+function convertHtmlToText(html: string): string {
+    try {
+        const result = convert(html, {
+            wordwrap: 80,
+            preserveNewlines: false,
+            selectors: [
+                {
+                    selector: "div",
+                    format: "block",
+                    options: { leadingLineBreaks: 1, trailingLineBreaks: 1 },
+                },
+                {
+                    selector: "p",
+                    format: "block",
+                    options: { leadingLineBreaks: 1, trailingLineBreaks: 1 },
+                },
+                {
+                    selector: 'div[style*="font-weight: 600"]',
+                    format: "block",
+                    options: { leadingLineBreaks: 1, trailingLineBreaks: 1 },
+                },
+                {
+                    selector: "a",
+                    format: "inline",
+                    options: {
+                        linkBrackets: false,
+                        hideLinkHrefIfSameAsText: true,
+                        ignoreHref: true,
+                    },
+                },
+            ],
+        });
+
+        return result.replace(/\n{3,}/g, "\n\n").trim();
+    } catch (error) {
+        console.warn("HTML-to-text conversion failed:", error);
+        return extractHtmlString(html)
+            .replace(/<[^>]*>/g, " ")
+            .replace(/\s+/g, " ")
+            .trim();
+    }
+}
+
 function formatDisplayContent(content: string | DisplayContent): string {
     if (typeof content === "string") {
         return content;