@retrivora-ai/rag-engine 1.9.1 → 1.9.2

package/dist/server.mjs

@@ -519,6 +519,82 @@ var init_PostgreSQLProvider = __esm({
   }
 });
 
+// src/utils/synonyms.ts
+function resolveMetadataValue(meta, uiKey) {
+  var _a;
+  const synonyms = (_a = FIELD_SYNONYMS[uiKey]) != null ? _a : [];
+  const keys = Object.keys(meta);
+  const systemKeys = ["namespace", "filename", "filesize", "filetype", "docid", "uploadedat", "dimension", "chunkindex"];
+  let match = keys.find((k) => k.toLowerCase() === uiKey.toLowerCase());
+  if (match !== void 0) return meta[match];
+  match = keys.find((k) => synonyms.map((s) => s.toLowerCase()).includes(k.toLowerCase()));
+  if (match !== void 0) return meta[match];
+  const isBlacklisted = (kl) => {
+    return systemKeys.includes(kl) || kl.startsWith("option1") || kl.startsWith("option2") || kl.startsWith("option3");
+  };
+  match = keys.find((k) => {
+    const kl = k.toLowerCase();
+    if (isBlacklisted(kl)) return false;
+    return kl.includes(uiKey.toLowerCase());
+  });
+  if (match !== void 0) return meta[match];
+  match = keys.find((k) => {
+    const kl = k.toLowerCase();
+    if (isBlacklisted(kl)) return false;
+    return synonyms.some((sk) => kl.includes(sk.toLowerCase()) || sk.toLowerCase().includes(kl));
+  });
+  return match !== void 0 ? meta[match] : void 0;
+}
+var FIELD_SYNONYMS;
+var init_synonyms = __esm({
+  "src/utils/synonyms.ts"() {
+    "use strict";
+    FIELD_SYNONYMS = {
+      name: ["product", "item", "title", "label", "heading", "subject", "product name", "item name"],
+      price: ["cost", "amount", "msrp", "price", "rate", "value", "price_usd", "variant price"],
+      brand: ["manufacturer", "vendor", "make", "company", "brand_name", "supplier"],
+      image: [
+        "imageUrl",
+        "thumbnail",
+        "img",
+        "url",
+        "photo",
+        "picture",
+        "media",
+        "image_url",
+        "main_image",
+        "product_image",
+        "thumb",
+        "image src",
+        "variant image"
+      ],
+      stock: [
+        "inventory",
+        "quantity",
+        "count",
+        "availability",
+        "stock_level",
+        "inStock",
+        "is_available",
+        "in stock",
+        "status",
+        "variant inventory qty"
+      ],
+      category: [
+        "product_category",
+        "product category",
+        "category_name",
+        "category name",
+        "department",
+        "collection",
+        "type"
+      ],
+      description: ["summary", "content", "body", "text", "info", "details", "body (html)", "seo description"],
+      link: ["url", "href", "product_url", "page_url", "link"]
+    };
+  }
+});
+
 // src/providers/vectordb/MultiTablePostgresProvider.ts
 var MultiTablePostgresProvider_exports = {};
 __export(MultiTablePostgresProvider_exports, {
@@ -530,6 +606,7 @@ var init_MultiTablePostgresProvider = __esm({
   "src/providers/vectordb/MultiTablePostgresProvider.ts"() {
     "use strict";
     init_BaseVectorProvider();
+    init_synonyms();
     MultiTablePostgresProvider = class extends BaseVectorProvider {
       constructor(config) {
         var _a, _b, _c;
@@ -610,8 +687,13 @@ var init_MultiTablePostgresProvider = __esm({
             }
             tableName = tableName.replace(/[^a-z0-9_]/gi, "_").toLowerCase() || this.uploadTable;
             const firstMeta = fileDocs[0].metadata || {};
-            const systemKeys = ["fileName", "fileSize", "fileType", "uploadedAt", "dimension", "chunkIndex", "id", "namespace", "content", "metadata", "embedding"];
-            const csvHeaders = Object.keys(firstMeta).filter((k) => !systemKeys.includes(k) && !systemKeys.includes(k.toLowerCase()));
+            let csvHeaders = [];
+            if (Array.isArray(firstMeta.csvHeaders)) {
+              csvHeaders = firstMeta.csvHeaders;
+            } else {
+              const systemKeys = ["fileName", "fileSize", "fileType", "uploadedAt", "dimension", "chunkIndex", "id", "namespace", "content", "metadata", "embedding", "docId", "docid", "chunkId", "chunkid", "csvHeaders", "csvheaders"];
+              csvHeaders = Object.keys(firstMeta).filter((k) => !systemKeys.includes(k) && !systemKeys.includes(k.toLowerCase()));
+            }
             const columnDefs = csvHeaders.map((h) => `"${h}" TEXT`).join(",\n          ");
             const createTableSql = `
           CREATE TABLE IF NOT EXISTS "${tableName}" (
@@ -704,10 +786,26 @@ var init_MultiTablePostgresProvider = __esm({
         };
         const dynamicKeywordQuery = getDynamicKeywordQuery();
         const tableLimit = Math.max(topK, 50);
+        const metadataFilters = _filter == null ? void 0 : _filter.metadata;
         const queryPromises = this.tables.map(async (table) => {
           try {
             let sqlQuery = "";
             let params = [];
+            let whereClause = "";
+            const filterParams = [];
+            if (metadataFilters && Object.keys(metadataFilters).length > 0) {
+              const conditions = Object.entries(metadataFilters).map(([key, val]) => {
+                var _a3;
+                filterParams.push(String(val));
+                const baseOffset = queryText && dynamicKeywordQuery ? 2 : 1;
+                const paramIdx = baseOffset + filterParams.length;
+                const synonyms = (_a3 = FIELD_SYNONYMS[key]) != null ? _a3 : [];
+                const keysToCheck = [key, ...synonyms];
+                const coalesceExprs = keysToCheck.map((k) => `LOWER(metadata->>'${k}')`);
+                return `COALESCE(${coalesceExprs.join(", ")}) = LOWER($${paramIdx})`;
+              });
+              whereClause = `WHERE ${conditions.join(" AND ")}`;
+            }
             if (queryText && dynamicKeywordQuery) {
               const hasEntityHints = entityHints.length > 0;
               const exactNameScoreExpr = hasEntityHints ? `+ (
@@ -724,19 +822,21 @@ var init_MultiTablePostgresProvider = __esm({
              COALESCE(ts_rank(to_tsvector('english', (to_jsonb(t) - 'embedding')::text), to_tsquery('english', $2)), 0) AS keyword_score,
              ((1 - (embedding <=> $1::vector)) + (COALESCE(ts_rank(to_tsvector('english', (to_jsonb(t) - 'embedding')::text), to_tsquery('english', $2)), 0) * 2.0) ${exactNameScoreExpr}) AS hybrid_score
             FROM "${table}" t
+            ${whereClause}
             ORDER BY hybrid_score DESC
             LIMIT ${tableLimit}
           `;
-              params = [vectorLiteral, dynamicKeywordQuery];
+              params = [vectorLiteral, dynamicKeywordQuery, ...filterParams];
             } else {
               sqlQuery = `
             SELECT *, 
             (1 - (embedding <=> $1::vector)) AS hybrid_score
             FROM "${table}" t
+            ${whereClause}
             ORDER BY hybrid_score DESC
             LIMIT ${tableLimit}
           `;
-              params = [vectorLiteral];
+              params = [vectorLiteral, ...filterParams];
             }
             const result = await this.pool.query(sqlQuery, params);
             if (result.rowCount && result.rowCount > 0) {
@@ -4361,7 +4461,8 @@ var QueryProcessor = class {
     const fieldValuePatterns = [
       new RegExp(`\\b${fieldPattern}\\s*(?:=|:)\\s*["']?${valuePattern}["']?(?=[?.!,]|$)`, "gi"),
       new RegExp(`\\b${fieldPattern}\\s+(?:is|are|was|were|equals?|equal to|named|called)\\s+["']?${valuePattern}["']?(?=[?.!,]|$)`, "gi"),
-      new RegExp(`\\bwith\\s+${fieldPattern}\\s+["']?${valuePattern}["']?(?=[?.!,]|$)`, "gi")
+      new RegExp(`\\bwith\\s+${fieldPattern}\\s+["']?${valuePattern}["']?(?=[?.!,]|$)`, "gi"),
+      new RegExp(`\\b(?:under|in|for|from|of)\\s+${fieldPattern}\\s+["']?${valuePattern}["']?(?=[?.!,]|$)`, "gi")
     ];
     for (const pattern of fieldValuePatterns) {
       for (const match of question.matchAll(pattern)) {
@@ -4595,73 +4696,8 @@ var LLMRouter = class {
   }
 };
 
-// src/utils/synonyms.ts
-var FIELD_SYNONYMS = {
-  name: ["product", "item", "title", "label", "heading", "subject", "product name", "item name"],
-  price: ["cost", "amount", "msrp", "price", "rate", "value", "price_usd"],
-  brand: ["manufacturer", "vendor", "make", "company", "brand_name", "supplier"],
-  image: [
-    "imageUrl",
-    "thumbnail",
-    "img",
-    "url",
-    "photo",
-    "picture",
-    "media",
-    "image_url",
-    "main_image",
-    "product_image",
-    "thumb"
-  ],
-  stock: [
-    "inventory",
-    "quantity",
-    "count",
-    "availability",
-    "stock_level",
-    "inStock",
-    "is_available",
-    "in stock",
-    "status"
-  ],
-  category: [
-    "product_category",
-    "product category",
-    "category_name",
-    "category name",
-    "department",
-    "collection"
-  ],
-  description: ["summary", "content", "body", "text", "info", "details"],
-  link: ["url", "href", "product_url", "page_url", "link"]
-};
-function resolveMetadataValue(meta, uiKey) {
-  var _a;
-  const synonyms = (_a = FIELD_SYNONYMS[uiKey]) != null ? _a : [];
-  const keys = Object.keys(meta);
-  const systemKeys = ["namespace", "filename", "filesize", "filetype", "docid", "uploadedat", "dimension", "chunkindex"];
-  let match = keys.find((k) => k.toLowerCase() === uiKey.toLowerCase());
-  if (match !== void 0) return meta[match];
-  match = keys.find((k) => synonyms.map((s) => s.toLowerCase()).includes(k.toLowerCase()));
-  if (match !== void 0) return meta[match];
-  const isBlacklisted = (kl) => {
-    return systemKeys.includes(kl) || kl.startsWith("option1") || kl.startsWith("option2") || kl.startsWith("option3");
-  };
-  match = keys.find((k) => {
-    const kl = k.toLowerCase();
-    if (isBlacklisted(kl)) return false;
-    return kl.includes(uiKey.toLowerCase());
-  });
-  if (match !== void 0) return meta[match];
-  match = keys.find((k) => {
-    const kl = k.toLowerCase();
-    if (isBlacklisted(kl)) return false;
-    return synonyms.some((sk) => kl.includes(sk.toLowerCase()) || sk.toLowerCase().includes(kl));
-  });
-  return match !== void 0 ? meta[match] : void 0;
-}
-
 // src/utils/UITransformer.ts
+init_synonyms();
 var UITransformer = class {
   // ─── Public Entry Points ─────────────────────────────────────────────────
   /**
@@ -4958,7 +4994,7 @@ RULES:
   }
   // ─── Transform Helpers ────────────────────────────────────────────────────
   static transformToProductCarousel(data, config, trainedSchema) {
-    const products = data.map((item) => this.extractProductInfo(item, config, trainedSchema)).filter((p) => p !== null);
+    const products = data.map((item) => this.extractProductInfo(item, config, trainedSchema)).filter((p) => p !== null).slice(0, 15);
     return {
       type: "product_carousel",
       title: "Recommended Products",
@@ -5917,14 +5953,16 @@ Given these metadata keys from a database: [${keys.join(", ")}]
 Identify which keys best correspond to these standard UI properties:
 ${propertyList}
 
-Return ONLY a JSON object where the keys are the UI properties and the values are the matching database keys. 
+Return ONLY a valid JSON object where the keys are the UI properties and the values are the EXACT matching database keys from the list above. 
 If no good match is found for a property, omit it.
 
 Example:
 {
-  "name": "Product_Title",
-  "price": "MSRP_USD",
-  "brand": "VendorName"
+  "name": "Title",
+  "price": "Variant Price",
+  "brand": "Vendor",
+  "image": "Image Src",
+  "stock": "Variant Inventory Qty"
 }
 `;
     try {
@@ -6215,7 +6253,10 @@ var Pipeline = class {
       upsertBatchOptions
     );
     if (upsertResult.errors.length > 0) {
-      console.warn(`[Pipeline] Ingestion: ${upsertResult.errors.length} batches failed`);
+      console.warn(`[Pipeline] Ingestion: ${upsertResult.errors.length} batches failed. Error details:`);
+      upsertResult.errors.forEach((err, idx) => {
+        console.warn(`  Batch ${idx + 1} Error: ${err.error.message || String(err.error)}`);
+      });
     }
     return upsertResult.totalProcessed;
   }
@@ -6330,8 +6371,9 @@ var Pipeline = class {
           this.embeddingCache.set(cacheKey, queryVector);
         }
         const graphData = (strategyResult === "graph" || strategyResult === "both") && this.graphDB && ((_j = this.config.rag) == null ? void 0 : _j.useGraphRetrieval) ? yield new __await(this.graphDB.query(searchQuery)) : void 0;
+        const hasMetadataFilter = filter.metadata && Object.keys(filter.metadata).length > 0;
         const hasNumericPredicates = Array.isArray(filter.__numericPredicates) && filter.__numericPredicates.length > 0;
-        const wantsExhaustiveList = hasNumericPredicates || /\b(list|all|show|provide|give|get)\b/i.test(question);
+        const wantsExhaustiveList = hasNumericPredicates || hasMetadataFilter || /\b(list|all|show|provide|give|get|browse|find|search|display)\b/i.test(question);
         const retrievalLimit = wantsExhaustiveList ? Math.max(topK * 20, 100) : topK * 2;
         const rawSources = (strategyResult === "vector" || strategyResult === "both") && queryVector && queryVector.length > 0 ? yield new __await(this.vectorDB.query(queryVector, retrievalLimit, ns, filter)) : [];
         const retrieveEnd = performance.now();
@@ -6339,15 +6381,27 @@ var Pipeline = class {
         const retrieveMs = retrieveEnd - embedStart;
         const rerankStart = performance.now();
         const structuredSources = this.applyStructuredFilters(rawSources, filter);
-        let sources = hasNumericPredicates ? structuredSources : structuredSources.filter((m) => m.score >= scoreThreshold);
+        let fullSources = hasNumericPredicates ? structuredSources : structuredSources.filter((m) => m.score >= scoreThreshold);
+        const rerankLimit = wantsExhaustiveList ? retrievalLimit : topK;
         if (!hasNumericPredicates && ((_k = this.config.rag) == null ? void 0 : _k.useReranking)) {
-          sources = yield new __await(this.reranker.rerank(sources, question, topK));
+          fullSources = yield new __await(this.reranker.rerank(fullSources, question, rerankLimit));
         } else if (!wantsExhaustiveList) {
-          sources = sources.slice(0, topK);
+          fullSources = fullSources.slice(0, topK);
         }
         const rerankMs = performance.now() - rerankStart;
-        let context = sources.length ? sources.map((m, i) => `[Source ${i + 1}]
+        let context = fullSources.length ? fullSources.map((m, i) => `[Source ${i + 1}]
 ${m.content}`).join("\n\n---\n\n") : "No relevant context found.";
+        let displayCount = 15;
+        if (hasMetadataFilter) {
+          displayCount = fullSources.length;
+        } else {
+          const highlyRelevant = fullSources.filter((m) => m.score >= 0.4);
+          displayCount = Math.max(highlyRelevant.length, topK);
+          if (displayCount > 15) {
+            displayCount = 15;
+          }
+        }
+        const sources = [...fullSources].sort((a, b) => b.score - a.score).slice(0, displayCount);
         if (graphData && graphData.nodes.length > 0) {
           const graphContext = graphData.nodes.map(
             (n) => `Entity: ${n.label} (${n.id})${n.properties ? " - " + JSON.stringify(n.properties) : ""}`
@@ -6360,7 +6414,18 @@ ${context}`;
         }
         const allMetadataKeys = Array.from(new Set(sources.flatMap((s) => Object.keys(s.metadata || {}))));
         const trainedSchemaPromise = allMetadataKeys.length > 0 ? SchemaMapper.train(this.llmProvider, ns, allMetadataKeys).catch(() => void 0) : Promise.resolve(void 0);
-        const restrictionSuffix = "\n\n(IMPORTANT: Use plain text only. NEVER generate tables, HTML figures, or text charts. The UI renders requested charts separately, so NEVER say you cannot create, display, draw, render, or provide a chart/visualization. If listing products, use simple bullet points or comma-separated names. NEVER use plus signs (+) to separate product names, category names, or list items. For product description/detail questions, provide customer-facing prose only and do NOT list internal catalog fields such as Handle, Body (HTML), Vendor, Type, Tags, Published, Option, Variant, SKU, or raw metadata labels. You CAN use numbers for years/counts like 2006 or 5800, but NEVER put a dollar sign ($) before them.)";
+        const uiTransformationPromise = trainedSchemaPromise.then(
+          (trainedSchema) => this.generateUiTransformation(
+            question,
+            sources,
+            trainedSchema,
+            hasNumericPredicates
+          )
+        ).catch((uiError) => {
+          console.warn("[Pipeline] UI transformation failed concurrently:", uiError);
+          return UITransformer.transform(question, sources, this.config);
+        });
+        const restrictionSuffix = "\n\n(IMPORTANT: Format your response beautifully using rich Markdown! Use bolding for emphasis, headings (##) for structure, bullet points for lists, and proper line breaks between paragraphs to make it highly readable. However, NEVER generate Markdown tables, HTML figures, or text charts (the UI renders requested charts separately, so NEVER say you cannot create, display, draw, render, or provide a chart/visualization). If listing products, use simple markdown bullet points or comma-separated names. NEVER use plus signs (+) to separate product names, category names, or list items. For product description/detail questions, provide customer-facing prose only and do NOT list internal catalog fields such as Handle, Body (HTML), Vendor, Type, Tags, Published, Option, Variant, SKU, or raw metadata labels. You CAN use numbers for years/counts like 2006 or 5800, but NEVER put a dollar sign ($) before them.)";
         const hardenedHistory = [...history];
         const userQuestion = { role: "user", content: question + restrictionSuffix };
         const messages = [...hardenedHistory, userQuestion];
@@ -6430,19 +6495,7 @@ ${context}`;
           tokens,
           timestamp: (/* @__PURE__ */ new Date()).toISOString()
         };
-        let uiTransformation;
-        try {
-          const trainedSchema = yield new __await(trainedSchemaPromise);
-          uiTransformation = yield new __await(this.generateUiTransformation(
-            question,
-            sources,
-            trainedSchema,
-            hasNumericPredicates
-          ));
-        } catch (uiError) {
-          console.warn("[Pipeline] UI transformation failed before metadata yield:", uiError);
-          uiTransformation = UITransformer.transform(question, sources, this.config);
-        }
+        const uiTransformation = yield new __await(uiTransformationPromise);
         yield {
           reply: "",
           sources,
@@ -7176,15 +7229,24 @@ function createStreamHandler(configOrPlugin) {
       });
     }
     const encoder = new TextEncoder();
+    let isActive = true;
     const stream = new ReadableStream({
       async start(controller) {
         var _a;
-        const enqueue = (text) => controller.enqueue(encoder.encode(text));
+        const enqueue = (text) => {
+          if (!isActive) return;
+          try {
+            controller.enqueue(encoder.encode(text));
+          } catch (err) {
+            console.warn("[createStreamHandler] Failed to enqueue (stream already closed):", err);
+          }
+        };
         try {
           const pipelineStream = plugin.chatStream(message, history, namespace);
           try {
             for (var iter = __forAwait(pipelineStream), more, temp, error; more = !(temp = await iter.next()).done; more = false) {
               const chunk = temp.value;
+              if (!isActive) break;
               if (typeof chunk === "string") {
                 enqueue(sseTextFrame(chunk));
               } else {
@@ -7222,12 +7284,27 @@ function createStreamHandler(configOrPlugin) {
             }
           }
         } catch (streamError) {
-          const errorMessage = streamError instanceof Error ? streamError.message : String(streamError);
-          console.error("[createStreamHandler] Stream error:", streamError);
-          enqueue(sseErrorFrame(errorMessage));
+          if (isActive) {
+            const errorMessage = streamError instanceof Error ? streamError.message : String(streamError);
+            console.error("[createStreamHandler] Stream error:", streamError);
+            try {
+              enqueue(sseErrorFrame(errorMessage));
+            } catch (e) {
+            }
+          }
         } finally {
-          controller.close();
+          if (isActive) {
+            isActive = false;
+            try {
+              controller.close();
+            } catch (e) {
+            }
+          }
         }
+      },
+      cancel(reason) {
+        isActive = false;
+        console.log("[createStreamHandler] Stream connection closed by client:", reason);
       }
     });
     return new Response(stream, { headers: SSE_HEADERS });
@@ -7288,6 +7365,7 @@ function createUploadHandler(configOrPlugin) {
           if (parsed.data && parsed.data.length > 0) {
             let i = 0;
             let lastRowData = null;
+            const csvCols = Object.keys(parsed.data[0]);
             for (const row of parsed.data) {
               i++;
               const rowData = row;
@@ -7309,12 +7387,14 @@ function createUploadHandler(configOrPlugin) {
               documents.push({
                 docId: `${file.name}-row-${i}`,
                 content: contentParts.join(", "),
-                metadata: __spreadValues(__spreadValues({
+                metadata: __spreadValues(__spreadProps(__spreadValues({
                   fileName: file.name,
                   fileSize: file.size,
                   fileType: file.type,
                   uploadedAt: (/* @__PURE__ */ new Date()).toISOString()
-                }, dimension ? { dimension } : {}), rowData)
+                }, dimension ? { dimension } : {}), {
+                  csvHeaders: csvCols
+                }), rowData)
               });
             }
           }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@retrivora-ai/rag-engine",
-  "version": "1.9.1",
+  "version": "1.9.2",
   "description": "Retrivora AI is a plug-and-play AI engine for RAG chat experiences — generic vector DB + LLM provider, embeddable or standalone.",
   "author": "Abhinav Alkuchi",
   "license": "MIT",

package/src/components/ChatWindow.tsx

@@ -71,7 +71,7 @@ export function ChatWindow({
   const windowRef = useRef<HTMLDivElement>(null);
   const bottomRef = useRef<HTMLDivElement>(null);
   const inputRef = useRef<HTMLTextAreaElement>(null);
-  const { messages, send, clear, isLoading, error } = useRagChat(projectId, {
+  const { messages, send, clear, isLoading, error, stop } = useRagChat(projectId, {
     namespace: projectId,
   });
 
@@ -492,19 +492,29 @@ export function ChatWindow({
             </button>
           )}
 
-          <button
-            onClick={sendMessage}
-            disabled={!input.trim() || isLoading}
-            className="flex-shrink-0 w-9 h-9 rounded-xl flex items-center justify-center transition-all disabled:opacity-30 disabled:cursor-not-allowed hover:scale-105 active:scale-95 shadow-md"
-            style={{
-              background:
-                input.trim() && !isLoading
-                  ? `linear-gradient(135deg, ${ui.primaryColor}, ${ui.accentColor})`
-                  : 'rgba(148, 163, 184, 0.2)', // slate-400/20 for light mode disabled
-            }}
-          >
-            <ArrowUp className="w-4 h-4 text-white" />
-          </button>
+          {isLoading ? (
+            <button
+              onClick={stop}
+              className="flex-shrink-0 w-9 h-9 rounded-xl flex items-center justify-center transition-all hover:scale-105 active:scale-95 shadow-md bg-rose-500 hover:bg-rose-600 text-white cursor-pointer"
+              title="Stop generating"
+            >
+              <div className="w-3.5 h-3.5 bg-white rounded-[2px]" />
+            </button>
+          ) : (
+            <button
+              onClick={sendMessage}
+              disabled={!input.trim()}
+              className="flex-shrink-0 w-9 h-9 rounded-xl flex items-center justify-center transition-all disabled:opacity-30 disabled:cursor-not-allowed hover:scale-105 active:scale-95 shadow-md"
+              style={{
+                background:
+                  input.trim()
+                    ? `linear-gradient(135deg, ${ui.primaryColor}, ${ui.accentColor})`
+                    : 'rgba(148, 163, 184, 0.2)', // slate-400/20 for light mode disabled
+              }}
+            >
+              <ArrowUp className="w-4 h-4 text-white" />
+            </button>
+          )}
         </div>
         <p className="text-center text-[10px] text-slate-400 dark:text-white/20 mt-2">
           Press Enter to send · Shift+Enter for new line

package/src/components/MessageBubble.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import React from 'react';
-import { Bot, User, ChevronDown, ChevronRight, Activity } from 'lucide-react';
+import { Bot, User, ChevronDown, ChevronRight, Activity, Copy, Check } from 'lucide-react';
 import ReactMarkdown from 'react-markdown';
 import { MessageBubbleProps, Product, UITransformationResponse } from '../types';
 import { SourceCard } from './SourceCard';
@@ -61,6 +61,17 @@ export function MessageBubble({
 
   const [showSources, setShowSources] = React.useState(false);
   const [showTrace, setShowTrace] = React.useState(false);
+  const [copied, setCopied] = React.useState(false);
+
+  const handleCopy = React.useCallback(async () => {
+    try {
+      await navigator.clipboard.writeText(message.content);
+      setCopied(true);
+      setTimeout(() => setCopied(false), 2000);
+    } catch (err) {
+      console.error('Failed to copy text:', err);
+    }
+  }, [message.content]);
 
   const structuredContent = React.useMemo(
     () => isUser ? { payload: null, text: message.content } : extractStructuredPayload(message.content),
@@ -187,7 +198,7 @@ export function MessageBubble({
       <div className={`flex flex-col gap-1 min-w-0 ${isCompact ? 'max-w-[94%]' : isMedium ? 'max-w-[92%]' : 'max-w-[90%]'} ${isUser ? 'items-end' : 'items-start'}`}>
         {/* Bubble */}
         <div
-          className={`relative ${isCompact ? 'px-3 py-2.5 text-[13px]' : 'px-4 py-3 text-sm'} rounded-2xl leading-relaxed shadow-sm dark:shadow-lg ${isUser
+          className={`relative group ${isCompact ? 'px-3 py-2.5 text-[13px]' : 'px-4 py-3 text-sm'} rounded-2xl leading-relaxed shadow-sm dark:shadow-lg ${isUser
             ? 'text-white rounded-tr-sm'
             : 'bg-white dark:bg-white/5 border border-slate-200 dark:border-white/10 text-slate-800 dark:text-white/90 rounded-tl-sm'
             }`}
@@ -195,6 +206,20 @@ export function MessageBubble({
             isUser ? { background: `linear-gradient(135deg, ${primaryColor}, ${accentColor})` } : {}
           }
         >
+          {/* Floating Copy Button for completed assistant messages */}
+          {!isUser && !isStreaming && message.content && (
+            <button
+              onClick={handleCopy}
+              className={`absolute top-2 right-2 p-1.5 rounded-lg border transition-all duration-200 cursor-pointer ${
+                copied
+                  ? 'bg-emerald-500/10 border-emerald-500/20 text-emerald-500 dark:text-emerald-400'
+                  : 'bg-slate-500/5 hover:bg-slate-500/10 border-slate-200 dark:border-white/10 text-slate-400 dark:text-white/30 hover:text-slate-600 dark:hover:text-white/60'
+              } opacity-0 group-hover:opacity-100 backdrop-blur-sm shadow-sm scale-95 group-hover:scale-100`}
+              title={copied ? "Copied!" : "Copy response"}
+            >
+              {copied ? <Check className="w-3.5 h-3.5" /> : <Copy className="w-3.5 h-3.5" />}
+            </button>
+          )}
           {isStreaming && !message.content ? (
             <span className="flex items-center gap-1 py-1">
               <span className="w-1.5 h-1.5 rounded-full bg-slate-400 dark:bg-white/60 animate-bounce [animation-delay:0ms]" />
@@ -240,11 +265,21 @@ export function MessageBubble({
           if (isUser || structuredContent.payload || !message.uiTransformation) return null;
           const ui = message.uiTransformation as UITransformationResponse;
           const textContent = (ui.data as { content?: string })?.content ?? '';
+          
+          const isNegativeOrFallbackText =
+            textContent.toLowerCase().includes('cannot answer') ||
+            textContent.toLowerCase().includes('no relevant data') ||
+            textContent.toLowerCase().includes('no data available') ||
+            (typeof ui.title === 'string' && ui.title.toLowerCase().includes('no data')) ||
+            (typeof ui.description === 'string' && ui.description.toLowerCase().includes('no relevant data'));
+
           const shouldShow =
-            ui.type === 'table' ||
-            !['text', 'table'].includes(ui.type) ||
-            (ui.type === 'text' && !hasRichUI && allProducts.length === 0 && textContent &&
-              !processedMarkdown.toLowerCase().includes(textContent.trim().toLowerCase()));
+            !isNegativeOrFallbackText &&
+            (ui.type === 'table' ||
+             !['text', 'table'].includes(ui.type) ||
+             (ui.type === 'text' && !hasRichUI && allProducts.length === 0 && textContent &&
+              !processedMarkdown.toLowerCase().includes(textContent.trim().toLowerCase())));
+              
           if (!shouldShow) return null;
           return (
             <div className="w-full mt-3">

package/src/components/ProductCard.tsx

@@ -47,7 +47,7 @@ export function ProductCard({ product, primaryColor = '#6366f1', onAddToCart }:
             className="object-cover group-hover:scale-105 transition-transform duration-500"
           />
         ) : (
-          <div className="text-slate-400 dark:text-white/20 cursor-pointer" onClick={() => onAddToCart?.(product)}>
+          <div className="text-slate-400 dark:text-white/20">
             <ShoppingCart className="w-12 h-12" />
           </div>
         )}
@@ -68,8 +68,8 @@ export function ProductCard({ product, primaryColor = '#6366f1', onAddToCart }:
           </h3>
           {product.price && (
             <span className="text-sm font-bold" style={{ color: primaryColor }}>
-              {typeof product.price === 'number'
-                ? `$${product.price}`
+              {typeof product.price === 'number' 
+                ? `$${product.price}` 
                 : (String(product.price).match(/^[\d.]/) ? `$${product.price}` : product.price)}
             </span>
           )}
@@ -84,7 +84,7 @@ export function ProductCard({ product, primaryColor = '#6366f1', onAddToCart }:
         <div className="mt-2 flex gap-2">
           <button
             onClick={() => onAddToCart?.(product)}
-            className="flex-1 py-2 px-3 rounded-lg text-[11px] font-medium text-white shadow-sm hover:opacity-90 transition-opacity flex items-center justify-center gap-1.5 cursor-pointer"
+            className="flex-1 py-2 px-3 rounded-lg text-[11px] font-medium text-white shadow-sm hover:opacity-90 transition-opacity flex items-center justify-center gap-1.5"
             style={{ background: primaryColor }}
           >
             <ShoppingCart className="w-3 h-3" />