npm - ss-support-widget - Versions diffs - 1.0.8 → 1.0.10 - Mend

ss-support-widget 1.0.8 → 1.0.10

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (29) hide show

package/dist/x-bot-widget.js +168 -0
package/index.html +15 -17
package/package.json +31 -29
package/readme.md +7 -7
package/src/api/service.ts +80 -0
package/src/{sse.ts → api/sse.ts} +58 -55
package/src/authentification/token.ts +57 -0
package/src/components/ChatWidget.tsx +488 -0
package/src/components/chatbot-element.tsx +53 -0
package/src/constants.ts +3 -0
package/src/containers/App.tsx +187 -0
package/src/{hooks.ts → hooks/hooks.ts} +31 -31
package/src/hooks/useSignalR.ts +222 -0
package/src/main.ts +38 -0
package/src/services/chatConfiguration.ts +11 -0
package/src/storage/session-storage.ts +53 -0
package/src/types.ts +29 -0
package/src/utils/deviceInfo.ts +13 -0
package/src/utils/script-utils.ts +11 -0
package/ss-support-widget-1.0.4.tgz +0 -0
package/tsconfig.json +13 -13
package/vite.config.ts +22 -22
package/dist/chat-bot-widget.js +0 -162
package/src/App.tsx +0 -106
package/src/ChatWidget.tsx +0 -421
package/src/MsgDelta.tsx +0 -6
package/src/element.tsx +0 -100
package/src/service.ts +0 -68
package/src/session-storage.ts +0 -17

package/index.html CHANGED Viewed

@@ -1,19 +1,17 @@
 <!doctype html>
 <html>
-  <head>
-    <meta charset="utf-8" />
-    <title>Widget test</title>
-  </head>
-  <body style="height: 100vh;">
-    <div style="height: 600px;">test</div>
-        <div style="height: 600px;">test</div>
-    <script>
-      window.ChatBotConfig = {
-        clientId: "694802ab424bd274310d61d8",
-        apiBaseUrl: "https://ai-chatbots-api.azurewebsites.net/",
-      };
-    </script>
-    <script type="module" src="/src/element.tsx"></script>
-    <!-- <script src="https://cdn.jsdelivr.net/npm/ss-support-widget@1.0.4/dist/chat-bot-widget.js"></script> -->
-  </body>
-</html>
+<head>
+  <meta charset="utf-8" />
+  <title>Widget test</title>
+  <script type="module"
+    src="http://localhost:5173/src/main.ts"
+    data-client-id="87c06405-7571-4133-b30a-c78f56678af6"></script>
+</head>
+<body>
+  <!-- <script src="https://cdn.jsdelivr.net/npm/ss-support-widget@1.0.4/dist/chat-bot-widget.js"></script> -->
+</body>
+</html>

package/package.json CHANGED Viewed

@@ -1,29 +1,31 @@
-{
-  "name": "ss-support-widget",
-  "version": "1.0.8",
-  "description": "Chatbot widget for customer support",
-  "main": "index.js",
-  "scripts": {
-    "build:script": "tsup src/element.tsx --format iife --global-name ChatBot --minify --clean --out-dir dist"
-  },
-  "keywords": [],
-  "author": "SS SRL",
-  "license": "ISC",
-  "type": "commonjs",
-  "devDependencies": {
-    "@types/react-dom": "^19.2.3",
-    "@vitejs/plugin-react": "^5.1.2",
-    "typescript": "^5.9.3",
-    "vite": "^7.2.7"
-  },
-  "dependencies": {
-    "@emotion/cache": "^11.14.0",
-    "@emotion/react": "^11.14.0",
-    "@emotion/styled": "^11.14.1",
-    "@mui/icons-material": "^7.3.6",
-    "@mui/material": "^7.3.6",
-    "react": "^19.2.3",
-    "react-dom": "^19.2.3",
-    "react-markdown": "^10.1.0"
-  }
-}
+{
+  "name": "ss-support-widget",
+  "version": "1.0.10",
+  "description": "Chatbot widget for customer support",
+  "main": "index.js",
+  "scripts": {
+    "build:script": "tsup src/main.ts --format iife --global-name ChatBot --minify --clean --out-dir dist"
+  },
+  "keywords": [],
+  "author": "SS SRL",
+  "license": "ISC",
+  "type": "commonjs",
+  "devDependencies": {
+    "@types/react-dom": "^19.2.3",
+    "@vitejs/plugin-react": "^5.1.2",
+    "typescript": "^5.9.3",
+    "vite": "^7.2.7"
+  },
+  "dependencies": {
+    "@emotion/cache": "^11.14.0",
+    "@emotion/react": "^11.14.0",
+    "@emotion/styled": "^11.14.1",
+    "@microsoft/signalr": "^10.0.0",
+    "@mui/icons-material": "^7.3.6",
+    "@mui/material": "^7.3.6",
+    "bson": "^7.0.0",
+    "react": "^19.2.3",
+    "react-dom": "^19.2.3",
+    "react-markdown": "^10.1.0"
+  }
+}

package/readme.md CHANGED Viewed

@@ -1,7 +1,7 @@
-<script>
-  window.ChatBotConfig = {
-    clientId: "abc123",
-    apiBaseUrl: "https://api.firma.ro",
-  };
-</script>
-<script src="https://cdn.firma.ro/chat-bot-widget.js" async></script>
+<script>
+  window.ChatBotConfig = {
+    clientId: "abc123",
+    apiBaseUrl: "https://api.firma.ro",
+  };
+</script>
+<script src="https://cdn.firma.ro/chat-bot-widget.js" async></script>

package/src/api/service.ts ADDED Viewed

@@ -0,0 +1,80 @@
+import { authFetch } from "../authentification/token";
+import { chatBasePath } from "../constants";
+import { Config, ConversationStatus, MsgDelta } from "../types";
+export async function getHistoryMessages(config: Config,
+    conversationId: string,
+    onSucces: (delta: MsgDelta[]) => void)
+    : Promise<void> {
+    authFetch(config.apiBaseUrl + chatBasePath + "/" + config.clientId + "/messages/", {
+        method: "GET",
+        headers: {
+            "Content-Type": "application/json",
+            "X-Conversation-Id": conversationId,
+        },
+    })
+        .then(res => {
+            if (!res.ok) {
+                throw new Error("Request failed");
+            }
+            return res.json();
+        })
+        .then(data => {
+            onSucces(data.map((d: any) => d as MsgDelta));
+        })
+        .catch(err => {
+            console.error(err);
+        });
+}
+export async function getConversationStatus(config: Config, conversationId: string)
+    : Promise<ConversationStatus> {
+    const res = await authFetch(config.apiBaseUrl + chatBasePath + "/" + config.clientId + "/conversation-status/", {
+        method: "GET",
+        headers: {
+            "Content-Type": "application/json",
+            "X-Conversation-Id": conversationId,
+        },
+    })
+    if (!res.ok) {
+        // TO DO
+    }
+    return await res.json() as ConversationStatus;
+}
+export async function getApiStatus(config: Config): Promise<boolean> {
+    const res = await authFetch(config.apiBaseUrl + "/api/health/" + config.clientId, {
+        method: "GET",
+        headers: {
+            "Content-Type": "application/json",
+        },
+    });
+    return res.ok;
+}
+type ClientActivityStatus = {
+    isActive: boolean;
+    hideForUrls: string[];
+};
+export async function getClientActivityStatus(config: Config, conversationId?: string | null): Promise<ClientActivityStatus> {
+    const res = await authFetch(config.apiBaseUrl + chatBasePath + "/" + config.clientId + "/client-activity-status", {
+        method: "GET",
+        headers: {
+            "Content-Type": "application/json",
+            ...(conversationId ? { "X-Conversation-Id": conversationId } : {}),
+        },
+    });
+    if (!res.ok) {
+        return { isActive: false, hideForUrls: [] };
+    }
+    return res.body ? await res.json() as ClientActivityStatus : { isActive: false, hideForUrls: [] };
+}

package/src/{sse.ts → api/sse.ts} RENAMED Viewed

@@ -1,55 +1,58 @@
-import { MsgDelta } from "./MsgDelta";
-type StreamArgs = {
-  url: string;
-  token?: string;
-  clientId?: string;
-  threadId?: string;
-  body: string;
-  onDelta: (delta: MsgDelta) => void;
-};
-export async function streamChat(a: StreamArgs): Promise<void> {
-  const res = await fetch(a.url, {
-    method: "POST",
-    headers: {
-      "Content-Type": "application/json",
-      ...(a.token ? { Authorization: "Bearer " + a.token } : {}),
-      ...(a.clientId ? { "X-Client-Id": a.clientId } : {}),
-      ...(a.threadId ? { "X-Thread-Id": a.threadId } : {}),
-    },
-    body: JSON.stringify(a.body),
-  });
-  if (!res.ok) {
-    throw new Error("HTTP " + res.status);
-  }
-  if (!res.body) {
-    throw new Error("ReadableStream missing");
-  }
-  const reader = res.body.getReader();
-  const decoder = new TextDecoder("utf-8");
-  let buffer = "";
-  while (true) {
-    const { value, done } = await reader.read();
-    if (done) break;
-    buffer += decoder.decode(value, { stream: true });
-    let idx;
-    while ((idx = buffer.indexOf("\n")) !== -1) {
-      const line = buffer.slice(0, idx).trim();
-      buffer = buffer.slice(idx + 1);
-      if (!line) continue;
-      const obj = JSON.parse(line) as MsgDelta;
-      a.onDelta(obj);
-    }
-  }
-  // a.onDelta({ id: "", threadId: "", text: decoder.decode() });
-}
+import { authFetch } from "../authentification/token";
+import { MsgDelta } from "../types";
+import getDeviceType from "../utils/deviceInfo";
+type StreamArgs = {
+  url: string;
+  token?: string | undefined | null;
+  clientId?: string;
+  conversationId?: string | null;
+  messageId?: string;
+  body: string;
+  onDelta: (delta: MsgDelta) => void;
+};
+export async function streamChat(a: StreamArgs): Promise<void> {
+  const res = await authFetch(a.url, {
+    method: "POST",
+    headers: {
+      "Content-Type": "application/json",
+      "X-Device-Type": getDeviceType(),
+      ...(a.clientId ? { "X-Client-Id": a.clientId } : {}),
+      ...(a.conversationId ? { "X-Conversation-Id": a.conversationId } : {}),
+      ...(a.messageId ? { "X-Message-Id": a.messageId } : {}),
+    },
+    body: JSON.stringify(a.body),
+  });
+  if (!res.ok) {
+    throw new Error("HTTP " + res.status);
+  }
+  if (!res.body) {
+    throw new Error("ReadableStream missing");
+  }
+  const reader = res.body.getReader();
+  const decoder = new TextDecoder("utf-8");
+  let buffer = "";
+  while (true) {
+    const { value, done } = await reader.read();
+    if (done) break;
+    buffer += decoder.decode(value, { stream: true });
+    let idx;
+    while ((idx = buffer.indexOf("\n")) !== -1) {
+      const line = buffer.slice(0, idx).trim();
+      buffer = buffer.slice(idx + 1);
+      if (!line) continue;
+      const obj = JSON.parse(line) as MsgDelta;
+      a.onDelta(obj);
+    }
+  }
+}

package/src/authentification/token.ts ADDED Viewed

@@ -0,0 +1,57 @@
+import { sessionBasePath } from "../constants";
+import { getChatBotConfig } from "../services/chatConfiguration";
+let refreshPromise: Promise<string> | null = null;
+export async function getSessionAccessToken(): Promise<string> {
+    const chatConfiguration = getChatBotConfig()
+    if (!refreshPromise) {
+        refreshPromise = fetch(`${chatConfiguration?.apiBaseUrl}${sessionBasePath}/${chatConfiguration?.clientId}/authorize`, {
+            method: "POST",
+            headers: {
+                "Content-Type": "application/json",
+            },
+        })
+            .then((r: Response) => {
+                if (!r.ok) {
+                    throw new Error("refresh failed");
+                }
+                return r.json();
+            })
+            .then((token: string) => {
+                if (chatConfiguration) {
+                    chatConfiguration.sessionToken = token;
+                }
+                return token;
+            })
+            .finally(() => {
+                refreshPromise = null;
+            });
+    }
+    return refreshPromise;
+}
+export async function authFetch(
+    input: RequestInfo | URL,
+    init: RequestInit = {}
+): Promise<Response> {
+    const headers = new Headers(init.headers);
+    const chatConfiguration = getChatBotConfig()
+    if (chatConfiguration?.sessionToken) {
+        headers.set("Authorization", `Bearer ${chatConfiguration?.sessionToken}`);
+    }
+    const response = await fetch(input, { ...init, headers });
+    if (response.status !== 401) {
+        return response;
+    }
+    const newToken = await getSessionAccessToken();
+    headers.set("Authorization", `Bearer ${newToken}`);
+    return fetch(input, { ...init, headers });
+}