From 074235f0bb99dfc117a7072565b41161ebf2e709 Mon Sep 17 00:00:00 2001
From: Justin Parker <jparkerweb@gmail.com>
Date: Thu, 7 Nov 2024 16:38:04 -0800
Subject: [PATCH] truncate long JSON results in web ui, and still allow for
 full download

---
 CHANGELOG.md         |  4 ++++
 embeddingUtils.js    |  4 +++-
 package.json         |  2 +-
 webui/package.json   |  2 +-
 webui/public/main.js | 34 +++++++++++++++++++++++++++++++---
 5 files changed, 40 insertions(+), 6 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 3ac37ad..5ef2332 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -2,6 +2,10 @@
 
 All notable changes to this project will be documented in this file.
 
+## [2.2.3] - 2024-11-07
+### Added
+- Web UI adjustments for display of truncated JSON results on screen but still allowing download of full results.
+
 ## [2.2.2] - 2024-11-07
 ### Added
 - Web UI css adjustments for smaller screens
diff --git a/embeddingUtils.js b/embeddingUtils.js
index c62ef5f..7b02b93 100644
--- a/embeddingUtils.js
+++ b/embeddingUtils.js
@@ -24,7 +24,9 @@ export async function initializeEmbeddingUtils(onnxEmbeddingModel, onnxEmbedding
 // -- Function to generate embeddings --
 // -------------------------------------
 export async function createEmbedding(text) {
-    if (embeddingCache.has(text)) return embeddingCache.get(text);
+    if (embeddingCache.has(text)) {
+        return embeddingCache.get(text);
+    }
 
     const embeddings = await generateEmbedding(text, { pooling: 'mean', normalize: true });
     embeddingCache.set(text, embeddings.data);
diff --git a/package.json b/package.json
index 71dee4d..69ac305 100644
--- a/package.json
+++ b/package.json
@@ -1,6 +1,6 @@
 {
   "name": "semantic-chunking",
-  "version": "2.2.2",
+  "version": "2.2.3",
   "description": "Semantically create chunks from large texts. Useful for workflows involving large language models (LLMs).",
   "repository": {
     "type": "git",
diff --git a/webui/package.json b/webui/package.json
index be12018..ad7e90b 100644
--- a/webui/package.json
+++ b/webui/package.json
@@ -1,6 +1,6 @@
 {
   "name": "semantic-chunking-webui",
-  "version": "1.1.2",
+  "version": "1.1.3",
   "type": "module",
   "description": "Web UI for semantic-chunking library",
   "main": "server.js",
diff --git a/webui/public/main.js b/webui/public/main.js
index 77f47a3..388efe9 100644
--- a/webui/public/main.js
+++ b/webui/public/main.js
@@ -185,10 +185,37 @@ form.addEventListener('submit', async (e) => {
         // Create code element and set content safely
         const codeElement = document.createElement('code');
         codeElement.className = 'language-json';
-        codeElement.textContent = JSON.stringify(result, null, 2);
+
+        // Format the JSON string
+        const formattedJson = JSON.stringify(result, null, 2);
+        const lines = formattedJson.split('\n');
+
+        // Store full result for download
+        resultsJson.dataset.fullResult = formattedJson;
+
+        // Truncate if more than 1000 lines
+        if (lines.length > 1000) {
+            const truncatedLines = [
+                ...lines.slice(0, 1000),
+                '\n',
+                '// ...',
+                '// ...',
+                '// ⚠️🚨 Notice: Data Truncated for Display 🚨⚠️',
+                '// The full result is too large to display here.',
+                '// Please use the download button to get the entire result.',
+                '// ...',
+                '// ...',
+            ];
+            codeElement.textContent = truncatedLines.join('\n');
+        } else {
+            codeElement.textContent = formattedJson;
+        }
+
         resultsJson.textContent = ''; // Clear existing content
         resultsJson.appendChild(codeElement);
-        hljs.highlightElement(codeElement);
+        if (!data.returnEmbedding) {
+            hljs.highlightElement(codeElement);
+        }
 
         // Enable download button if we have results
         downloadButton.disabled = false;
@@ -216,7 +243,8 @@ form.addEventListener('submit', async (e) => {
         
         // Enable download
         downloadButton.onclick = () => {
-            const blob = new Blob([JSON.stringify(result, null, 2)], { type: 'application/json' });
+            const fullData = resultsJson.dataset.fullResult;
+            const blob = new Blob([fullData], { type: 'application/json' });
             const url = URL.createObjectURL(blob);
             const a = document.createElement('a');
             a.href = url;