Fix missing text message with upload (#54)

* Fixed missing text when upload is attached * Updated dev init * 2.4.4 * Added upcoming new version in README and demo
tarkalabs · Apr 23, 2024 · 8ddc6d7 · 8ddc6d7
1 parent b2f6d55
commit 8ddc6d7
Show file tree

Hide file tree

Showing 6 changed files with 26 additions and 21 deletions.
diff --git a/README.md b/README.md
@@ -154,7 +154,7 @@ Link: https://tarkalabs.github.io/tarka-chat/demo/
 
 - v1.0 : https://d1fmfone96g0x2.cloudfront.net/tarka-chat-1.0.umd.js
 - v2.3 : https://d1fmfone96g0x2.cloudfront.net/tarka-chat-2.3.1.umd.js
-- v2.4 : https://d1fmfone96g0x2.cloudfront.net/tarka-chat-2.4.0.umd.js
+- v2.4 : https://d1fmfone96g0x2.cloudfront.net/tarka-chat-2.4.4.umd.js
 
 
 # Dev notes

diff --git a/demo/index.html b/demo/index.html
@@ -15,7 +15,7 @@
     <script src="https://code.highcharts.com/highcharts.js"></script>
     <script src="https://code.highcharts.com/modules/exporting.js"></script>
     <!-- Include this javscript -->
-    <script src="https://d1fmfone96g0x2.cloudfront.net/tarka-chat-2.2.1.umd.js"></script>
+    <script src="https://d1fmfone96g0x2.cloudfront.net/tarka-chat-2.4.4.umd.js"></script>
   </head>
   <body>
     <div class="container">

diff --git a/dev/init.js b/dev/init.js
@@ -38,8 +38,11 @@ async function sendMessage(message, optionalFiles) {
 
   // after getting response use any one of the following to simulate different types of responses
   let textResponse =
-    "This is a **markdown** __enabled__ text response \n * First \n * Second";
-  let textObjResponse = { type: "text", message: "hi tehreee" };
+    "This is a **markdown** __enabled__ text response \n * First list item \n * Second list item";
+  let textObjResponse = {
+    type: "text",
+    message: `Received user message ${message}`,
+  };
   let fileObjResponse = {
     type: "file",
     name: "tarka trends",
@@ -99,9 +102,9 @@ async function sendMessage(message, optionalFiles) {
   };
   let arrayResponse = [
     { requestId: "request-id" },
-    { type: "text", message: "Message **One**" },
-    { type: "text", message: "Message 2" },
-    { type: "text", message: "Message 3" },
+    textObjResponse,
+    tableObjResponse,
+    textResponse,
   ];
   return Promise.resolve(arrayResponse);
 }
@@ -118,6 +121,7 @@ const chat = TarkaChat.init({
   greeting: "Hello. How can I assist you today?",
   themeColor: "#F0DAFB",
   selectorId: "tarkachatbot",
+  enableUpload: true,
   uploadTypes: UPLOAD_TYPES,
   generateUploadPreview: generateImageThumbnail,
   preChatRenderer: getPreChatScreen,
@@ -129,4 +133,6 @@ const chat = TarkaChat.init({
   expand: true,
 });
 
-// chat.toggle(), chat.isOpen()
+if (!chat.isOpen()) {
+  chat.toggle();
+}
diff --git a/package-lock.json b/package-lock.json
diff --git a/package.json b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "tarka-chat",
   "private": true,
-  "version": "2.4.3",
+  "version": "2.4.4",
   "type": "module",
   "repository": {
     "type": "git",

diff --git a/src/main.js b/src/main.js
@@ -15,7 +15,7 @@ import {
 
 const INITIAL_STATE = false;
 
-const AVAILABLE_DATA_TYPES = [
+const AVAILABLE_TYPES = [
   "text",
   "file",
   "image",
@@ -335,14 +335,10 @@ export default {
     wrapper.setAttribute("data-payload", JSON.stringify(data));
 
     if (Array.isArray(data)) {
-      data
-        .filter(
-          (d) =>
-            typeof data === "string" || AVAILABLE_DATA_TYPES.includes(d.type),
-        )
-        .forEach((d) => {
-          wrapper.appendChild(this.createNodeByType(d));
-        });
+      data.forEach((item) => {
+        if (typeof item === "string" || AVAILABLE_TYPES.includes(item.type))
+          wrapper.appendChild(this.createNodeByType(item));
+      });
     } else if (typeof data === "string" || typeof data === "object") {
       wrapper.appendChild(this.createNodeByType(data));
     }
@@ -385,7 +381,10 @@ export default {
 
   updateReportIcon() {
     const incomingMessages = document.querySelectorAll(".message.incoming");
-    if (this.reportMessage && this.reportMessage.reportType === "ONLY_LAST_MESSAGE") {
+    if (
+      this.reportMessage &&
+      this.reportMessage.reportType === "ONLY_LAST_MESSAGE"
+    ) {
       incomingMessages.forEach((message, index) => {
         const reportIcon = message.querySelector(".report-icon");
         if (index !== incomingMessages.length - 1 && !!reportIcon) {