@gobolt/genesis 0.3.3 → 0.3.4

package/dist/components/Chat/Chat.d.ts

@@ -13,6 +13,7 @@ export interface ChatProps {
     messageHistory: Array<Message>;
     title?: string;
     isSimulated?: boolean;
+    authToken?: string;
 }
 declare const Chat: FC<ChatProps>;
 export default Chat;

package/dist/components/Chat/__stories__/Chat.stories.d.ts

@@ -14,6 +14,8 @@ declare const meta: {
 };
 export default meta;
 type Story = StoryObj<typeof meta>;
-export declare const Default: Story;
+export declare const local: Story;
+export declare const remote: Story;
 export declare const WithMessageHistory: Story;
 export declare const WithTitle: Story;
+export declare const Remote: Story;

package/dist/index.cjs

@@ -75386,7 +75386,8 @@ const Chat = ({
   isOpen = false,
   messageHistory = [],
   title = null,
-  isSimulated = false
+  isSimulated = false,
+  authToken
 }) => {
   const [isChatOpen, setIsChatOpen] = React.useState(isOpen);
   const [message2, setMessage] = React.useState("");
@@ -75402,104 +75403,131 @@ const Chat = ({
     if (isSimulated) return;
     const socketUrlToUse = window.location.hostname === "localhost" && window.location.port === "6006" ? "http://localhost:3000" : socketUrl;
     console.log("Connecting to socket server at:", socketUrlToUse);
-    socketRef.current = lookup(socketUrlToUse, {
-      transports: ["polling", "websocket"],
-      reconnection: true,
-      reconnectionAttempts: 5,
-      reconnectionDelay: 1e3,
-      withCredentials: true,
-      forceNew: true,
-      autoConnect: true,
-      timeout: 1e4
-    });
-    const socket = socketRef.current;
-    socket.on("connect", () => {
-      console.log("Socket connected successfully");
-      setServerError("");
-      setServerStatus("ready");
-      serverReadyRef.current = true;
-    });
-    socket.on("connect_error", (error2) => {
-      console.error("Socket connection error:", error2);
-      setServerError(`Connection error: ${error2.message}`);
-      setServerStatus("error");
-      serverReadyRef.current = false;
-      setMessages((prev2) => prev2.filter((msg) => !msg.isThinking));
-      setIsLocked(false);
-    });
-    socket.on("disconnect", (reason) => {
-      console.log("Socket disconnected:", reason);
-      setServerError(`Disconnected: ${reason}`);
-      setServerStatus("error");
-      serverReadyRef.current = false;
-      setMessages((prev2) => prev2.filter((msg) => !msg.isThinking));
-      setIsLocked(false);
-    });
-    socket.on("new connection", () => {
-      console.log("New connection established");
-    });
-    socket.on("server-ready", () => {
-      console.log("Server is ready");
-      setServerError("");
-      setServerStatus("ready");
-      serverReadyRef.current = true;
-    });
-    socket.on("message", (newMessage) => {
-      setMessages((prev2) => {
-        if (newMessage.sender === "bot") {
-          if (newMessage.content === "Processing your message...") {
-            const hasThinkingMessage = prev2.some((msg) => msg.isThinking);
-            if (hasThinkingMessage) {
-              return prev2;
+    const validateToken = async () => {
+      try {
+        const response = await fetch(
+          "https://www.googleapis.com/oauth2/v2/userinfo",
+          {
+            headers: {
+              Authorization: `Bearer ${authToken}`
             }
-            return [...prev2, { ...newMessage, isThinking: true }];
           }
-          const thinkingMessage = prev2.find((msg) => msg.isThinking);
-          if (thinkingMessage) {
-            return prev2.map(
-              (msg) => msg.isThinking ? { ...newMessage, isThinking: false } : msg
+        );
+        if (!response.ok) {
+          throw new Error("Invalid token");
+        }
+        socketRef.current = lookup(socketUrlToUse, {
+          transports: ["polling", "websocket"],
+          reconnection: true,
+          reconnectionAttempts: 5,
+          reconnectionDelay: 1e3,
+          withCredentials: true,
+          forceNew: true,
+          autoConnect: true,
+          timeout: 1e4,
+          auth: {
+            token: authToken,
+            type: "Bearer"
+          }
+        });
+        const socket = socketRef.current;
+        socket.on("connect", () => {
+          console.log("Socket connected successfully");
+          setServerError("");
+          setServerStatus("ready");
+          serverReadyRef.current = true;
+        });
+        socket.on("connect_error", (error2) => {
+          console.error("Socket connection error:", error2);
+          setServerError(`Connection error: ${error2.message}`);
+          setServerStatus("error");
+          serverReadyRef.current = false;
+          setMessages((prev2) => prev2.filter((msg) => !msg.isThinking));
+          setIsLocked(false);
+        });
+        socket.on("disconnect", (reason) => {
+          console.log("Socket disconnected:", reason);
+          setServerError(`Disconnected: ${reason}`);
+          setServerStatus("error");
+          serverReadyRef.current = false;
+          setMessages((prev2) => prev2.filter((msg) => !msg.isThinking));
+          setIsLocked(false);
+        });
+        socket.on("new connection", () => {
+          console.log("New connection established");
+        });
+        socket.on("server-ready", () => {
+          console.log("Server is ready");
+          setServerError("");
+          setServerStatus("ready");
+          serverReadyRef.current = true;
+        });
+        socket.on("message", (newMessage) => {
+          setMessages((prev2) => {
+            if (newMessage.sender === "bot") {
+              if (newMessage.content === "Processing your message...") {
+                const hasThinkingMessage = prev2.some((msg) => msg.isThinking);
+                if (hasThinkingMessage) {
+                  return prev2;
+                }
+                return [...prev2, { ...newMessage, isThinking: true }];
+              }
+              const thinkingMessage = prev2.find((msg) => msg.isThinking);
+              if (thinkingMessage) {
+                return prev2.map(
+                  (msg) => msg.isThinking ? { ...newMessage, isThinking: false } : msg
+                );
+              }
+              return [...prev2, { ...newMessage, isThinking: false }];
+            }
+            const lastUserMsg = [...prev2].reverse().find((msg) => msg.sender === "user");
+            if (lastUserMsg && lastUserMsg.content === newMessage.content) {
+              return prev2;
+            }
+            return [...prev2, newMessage];
+          });
+          setIsLocked(false);
+        });
+        socket.on("update-bot-message", (updatedData) => {
+          console.log("Received bot message update:", updatedData);
+          setMessages(
+            (prev2) => prev2.map(
+              (message22) => message22.id === updatedData.id ? { ...updatedData } : message22
+            )
+          );
+        });
+        socket.on("error", (error2) => {
+          console.error("Socket error:", error2);
+          setServerError("Server error occurred");
+        });
+        socket.onAny((eventName, ...args) => {
+          console.log(`Socket event received: ${eventName}`, args);
+        });
+        const timeoutId = setTimeout(() => {
+          if (!serverReadyRef.current) {
+            console.log("Server status check failed");
+            setServerError(
+              "Server status check failed - please check the server"
             );
+            setServerStatus("error");
+            setMessages((prev2) => prev2.filter((msg) => !msg.isThinking));
+            setIsLocked(false);
           }
-          return [...prev2, { ...newMessage, isThinking: false }];
-        }
-        const lastUserMsg = [...prev2].reverse().find((msg) => msg.sender === "user");
-        if (lastUserMsg && lastUserMsg.content === newMessage.content) {
-          return prev2;
-        }
-        return [...prev2, newMessage];
-      });
-      setIsLocked(false);
-    });
-    socket.on("update-bot-message", (updatedData) => {
-      console.log("Received bot message update:", updatedData);
-      setMessages(
-        (prev2) => prev2.map(
-          (message22) => message22.id === updatedData.id ? { ...updatedData } : message22
-        )
-      );
-    });
-    socket.on("error", (error2) => {
-      console.error("Socket error:", error2);
-      setServerError("Server error occurred");
-    });
-    socket.onAny((eventName, ...args) => {
-      console.log(`Socket event received: ${eventName}`, args);
-    });
-    const timeoutId = setTimeout(() => {
-      if (!serverReadyRef.current) {
-        console.log("Server status check failed");
-        setServerError("Server status check failed - please check the server");
+        }, 2e3);
+        return () => {
+          console.log("Disconnecting socket");
+          socket.disconnect();
+          clearTimeout(timeoutId);
+        };
+      } catch (error2) {
+        console.error("Token validation error:", error2);
+        setServerError("Authentication error: Invalid token");
         setServerStatus("error");
-        setMessages((prev2) => prev2.filter((msg) => !msg.isThinking));
-        setIsLocked(false);
+        serverReadyRef.current = false;
       }
-    }, 2e3);
-    return () => {
-      console.log("Disconnecting socket");
-      socket.disconnect();
-      clearTimeout(timeoutId);
     };
-  }, [isSimulated, socketUrl]);
+    validateToken();
+  }, [isSimulated, socketUrl, authToken]);
   React.useEffect(() => {
     if (messageListRef.current) {
       messageListRef.current.scrollTo({

package/dist/index.js

@@ -75368,7 +75368,8 @@ const Chat = ({
   isOpen = false,
   messageHistory = [],
   title = null,
-  isSimulated = false
+  isSimulated = false,
+  authToken
 }) => {
   const [isChatOpen, setIsChatOpen] = useState(isOpen);
   const [message2, setMessage] = useState("");
@@ -75384,104 +75385,131 @@ const Chat = ({
     if (isSimulated) return;
     const socketUrlToUse = window.location.hostname === "localhost" && window.location.port === "6006" ? "http://localhost:3000" : socketUrl;
     console.log("Connecting to socket server at:", socketUrlToUse);
-    socketRef.current = lookup(socketUrlToUse, {
-      transports: ["polling", "websocket"],
-      reconnection: true,
-      reconnectionAttempts: 5,
-      reconnectionDelay: 1e3,
-      withCredentials: true,
-      forceNew: true,
-      autoConnect: true,
-      timeout: 1e4
-    });
-    const socket = socketRef.current;
-    socket.on("connect", () => {
-      console.log("Socket connected successfully");
-      setServerError("");
-      setServerStatus("ready");
-      serverReadyRef.current = true;
-    });
-    socket.on("connect_error", (error2) => {
-      console.error("Socket connection error:", error2);
-      setServerError(`Connection error: ${error2.message}`);
-      setServerStatus("error");
-      serverReadyRef.current = false;
-      setMessages((prev2) => prev2.filter((msg) => !msg.isThinking));
-      setIsLocked(false);
-    });
-    socket.on("disconnect", (reason) => {
-      console.log("Socket disconnected:", reason);
-      setServerError(`Disconnected: ${reason}`);
-      setServerStatus("error");
-      serverReadyRef.current = false;
-      setMessages((prev2) => prev2.filter((msg) => !msg.isThinking));
-      setIsLocked(false);
-    });
-    socket.on("new connection", () => {
-      console.log("New connection established");
-    });
-    socket.on("server-ready", () => {
-      console.log("Server is ready");
-      setServerError("");
-      setServerStatus("ready");
-      serverReadyRef.current = true;
-    });
-    socket.on("message", (newMessage) => {
-      setMessages((prev2) => {
-        if (newMessage.sender === "bot") {
-          if (newMessage.content === "Processing your message...") {
-            const hasThinkingMessage = prev2.some((msg) => msg.isThinking);
-            if (hasThinkingMessage) {
-              return prev2;
+    const validateToken = async () => {
+      try {
+        const response = await fetch(
+          "https://www.googleapis.com/oauth2/v2/userinfo",
+          {
+            headers: {
+              Authorization: `Bearer ${authToken}`
             }
-            return [...prev2, { ...newMessage, isThinking: true }];
           }
-          const thinkingMessage = prev2.find((msg) => msg.isThinking);
-          if (thinkingMessage) {
-            return prev2.map(
-              (msg) => msg.isThinking ? { ...newMessage, isThinking: false } : msg
+        );
+        if (!response.ok) {
+          throw new Error("Invalid token");
+        }
+        socketRef.current = lookup(socketUrlToUse, {
+          transports: ["polling", "websocket"],
+          reconnection: true,
+          reconnectionAttempts: 5,
+          reconnectionDelay: 1e3,
+          withCredentials: true,
+          forceNew: true,
+          autoConnect: true,
+          timeout: 1e4,
+          auth: {
+            token: authToken,
+            type: "Bearer"
+          }
+        });
+        const socket = socketRef.current;
+        socket.on("connect", () => {
+          console.log("Socket connected successfully");
+          setServerError("");
+          setServerStatus("ready");
+          serverReadyRef.current = true;
+        });
+        socket.on("connect_error", (error2) => {
+          console.error("Socket connection error:", error2);
+          setServerError(`Connection error: ${error2.message}`);
+          setServerStatus("error");
+          serverReadyRef.current = false;
+          setMessages((prev2) => prev2.filter((msg) => !msg.isThinking));
+          setIsLocked(false);
+        });
+        socket.on("disconnect", (reason) => {
+          console.log("Socket disconnected:", reason);
+          setServerError(`Disconnected: ${reason}`);
+          setServerStatus("error");
+          serverReadyRef.current = false;
+          setMessages((prev2) => prev2.filter((msg) => !msg.isThinking));
+          setIsLocked(false);
+        });
+        socket.on("new connection", () => {
+          console.log("New connection established");
+        });
+        socket.on("server-ready", () => {
+          console.log("Server is ready");
+          setServerError("");
+          setServerStatus("ready");
+          serverReadyRef.current = true;
+        });
+        socket.on("message", (newMessage) => {
+          setMessages((prev2) => {
+            if (newMessage.sender === "bot") {
+              if (newMessage.content === "Processing your message...") {
+                const hasThinkingMessage = prev2.some((msg) => msg.isThinking);
+                if (hasThinkingMessage) {
+                  return prev2;
+                }
+                return [...prev2, { ...newMessage, isThinking: true }];
+              }
+              const thinkingMessage = prev2.find((msg) => msg.isThinking);
+              if (thinkingMessage) {
+                return prev2.map(
+                  (msg) => msg.isThinking ? { ...newMessage, isThinking: false } : msg
+                );
+              }
+              return [...prev2, { ...newMessage, isThinking: false }];
+            }
+            const lastUserMsg = [...prev2].reverse().find((msg) => msg.sender === "user");
+            if (lastUserMsg && lastUserMsg.content === newMessage.content) {
+              return prev2;
+            }
+            return [...prev2, newMessage];
+          });
+          setIsLocked(false);
+        });
+        socket.on("update-bot-message", (updatedData) => {
+          console.log("Received bot message update:", updatedData);
+          setMessages(
+            (prev2) => prev2.map(
+              (message22) => message22.id === updatedData.id ? { ...updatedData } : message22
+            )
+          );
+        });
+        socket.on("error", (error2) => {
+          console.error("Socket error:", error2);
+          setServerError("Server error occurred");
+        });
+        socket.onAny((eventName, ...args) => {
+          console.log(`Socket event received: ${eventName}`, args);
+        });
+        const timeoutId = setTimeout(() => {
+          if (!serverReadyRef.current) {
+            console.log("Server status check failed");
+            setServerError(
+              "Server status check failed - please check the server"
             );
+            setServerStatus("error");
+            setMessages((prev2) => prev2.filter((msg) => !msg.isThinking));
+            setIsLocked(false);
           }
-          return [...prev2, { ...newMessage, isThinking: false }];
-        }
-        const lastUserMsg = [...prev2].reverse().find((msg) => msg.sender === "user");
-        if (lastUserMsg && lastUserMsg.content === newMessage.content) {
-          return prev2;
-        }
-        return [...prev2, newMessage];
-      });
-      setIsLocked(false);
-    });
-    socket.on("update-bot-message", (updatedData) => {
-      console.log("Received bot message update:", updatedData);
-      setMessages(
-        (prev2) => prev2.map(
-          (message22) => message22.id === updatedData.id ? { ...updatedData } : message22
-        )
-      );
-    });
-    socket.on("error", (error2) => {
-      console.error("Socket error:", error2);
-      setServerError("Server error occurred");
-    });
-    socket.onAny((eventName, ...args) => {
-      console.log(`Socket event received: ${eventName}`, args);
-    });
-    const timeoutId = setTimeout(() => {
-      if (!serverReadyRef.current) {
-        console.log("Server status check failed");
-        setServerError("Server status check failed - please check the server");
+        }, 2e3);
+        return () => {
+          console.log("Disconnecting socket");
+          socket.disconnect();
+          clearTimeout(timeoutId);
+        };
+      } catch (error2) {
+        console.error("Token validation error:", error2);
+        setServerError("Authentication error: Invalid token");
         setServerStatus("error");
-        setMessages((prev2) => prev2.filter((msg) => !msg.isThinking));
-        setIsLocked(false);
+        serverReadyRef.current = false;
       }
-    }, 2e3);
-    return () => {
-      console.log("Disconnecting socket");
-      socket.disconnect();
-      clearTimeout(timeoutId);
     };
-  }, [isSimulated, socketUrl]);
+    validateToken();
+  }, [isSimulated, socketUrl, authToken]);
   useEffect(() => {
     if (messageListRef.current) {
       messageListRef.current.scrollTo({

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gobolt/genesis",
-  "version": "0.3.3",
+  "version": "0.3.4",
   "description": "genesis design system",
   "author": "gobolt",
   "license": "MIT",