From 8ddc6d7a77a111e49246757b6d2f5c7a90497dad Mon Sep 17 00:00:00 2001 From: Shamil Siddique <43869372+shamilsdq@users.noreply.github.com> Date: Tue, 23 Apr 2024 09:35:36 +0530 Subject: [PATCH] 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 --- README.md | 2 +- demo/index.html | 2 +- dev/init.js | 18 ++++++++++++------ package-lock.json | 4 ++-- package.json | 2 +- src/main.js | 19 +++++++++---------- 6 files changed, 26 insertions(+), 21 deletions(-) diff --git a/README.md b/README.md index 70bdab4..baab5a2 100644 --- 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 index 2527c18..2c98653 100644 --- a/demo/index.html +++ b/demo/index.html @@ -15,7 +15,7 @@ - +
diff --git a/dev/init.js b/dev/init.js index c0488a7..de24cde 100644 --- 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 index 58fb891..f7067e5 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "tarka-chat", - "version": "2.4.2", + "version": "2.4.4", "lockfileVersion": 3, "requires": true, "packages": { "": { "name": "tarka-chat", - "version": "2.4.2", + "version": "2.4.4", "dependencies": { "@ctrl/tinycolor": "^4.0.2", "lottie-web": "^5.12.2", diff --git a/package.json b/package.json index f698fc8..d01bba9 100644 --- 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 index 1d99a6e..76dae8b 100644 --- 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) {