From e3fef3a1beae16979bbdedabdcb78569f8c929b6 Mon Sep 17 00:00:00 2001 From: ItzCrazyKns Date: Sat, 4 May 2024 14:56:54 +0530 Subject: [PATCH] feat(chat-window): add error handling --- ui/app/layout.tsx | 10 ++++++++++ ui/components/ChatWindow.tsx | 16 +++++++++++++++- ui/package.json | 1 + ui/yarn.lock | 5 +++++ 4 files changed, 31 insertions(+), 1 deletion(-) diff --git a/ui/app/layout.tsx b/ui/app/layout.tsx index cb670f5..b3f5005 100644 --- a/ui/app/layout.tsx +++ b/ui/app/layout.tsx @@ -3,6 +3,7 @@ import { Montserrat } from 'next/font/google'; import './globals.css'; import { cn } from '@/lib/utils'; import Sidebar from '@/components/Sidebar'; +import { Toaster } from 'sonner'; const montserrat = Montserrat({ weight: ['300', '400', '500', '700'], @@ -26,6 +27,15 @@ export default function RootLayout({ {children} + ); diff --git a/ui/components/ChatWindow.tsx b/ui/components/ChatWindow.tsx index f8298b1..ca08dfa 100644 --- a/ui/components/ChatWindow.tsx +++ b/ui/components/ChatWindow.tsx @@ -5,6 +5,7 @@ import { Document } from '@langchain/core/documents'; import Navbar from './Navbar'; import Chat from './Chat'; import EmptyChat from './EmptyChat'; +import { toast } from 'sonner'; export type Message = { id: string; @@ -92,17 +93,24 @@ const useSocket = (url: string) => { wsURL.search = searchParams.toString(); const ws = new WebSocket(wsURL.toString()); + ws.onopen = () => { console.log('[DEBUG] open'); setWs(ws); }; + + ws.onmessage = (e) => { + const parsedData = JSON.parse(e.data); + if (parsedData.type === 'error') { + toast.error(parsedData.data); + } + }; }; connectWs(); } return () => { - 1; ws?.close(); console.log('[DEBUG] closed'); }; @@ -150,6 +158,12 @@ const ChatWindow = () => { const messageHandler = (e: MessageEvent) => { const data = JSON.parse(e.data); + if (data.type === 'error') { + toast.error(data.data); + setLoading(false); + return; + } + if (data.type === 'sources') { sources = data.data; if (!added) { diff --git a/ui/package.json b/ui/package.json index 79cb842..0aec67d 100644 --- a/ui/package.json +++ b/ui/package.json @@ -24,6 +24,7 @@ "react-dom": "^18", "react-text-to-speech": "^0.14.5", "react-textarea-autosize": "^8.5.3", + "sonner": "^1.4.41", "tailwind-merge": "^2.2.2", "yet-another-react-lightbox": "^3.17.2", "zod": "^3.22.4" diff --git a/ui/yarn.lock b/ui/yarn.lock index 5da13f8..ec8b3d7 100644 --- a/ui/yarn.lock +++ b/ui/yarn.lock @@ -2839,6 +2839,11 @@ slash@^3.0.0: resolved "https://registry.yarnpkg.com/slash/-/slash-3.0.0.tgz#6539be870c165adbd5240220dbe361f1bc4d4634" integrity sha512-g9Q1haeby36OSStwb4ntCGGGaKsaVSjQ68fBxoQcutl5fS1vuY18H3wSt3jFyFtrkx+Kz0V1G85A4MyAdDMi2Q== +sonner@^1.4.41: + version "1.4.41" + resolved "https://registry.yarnpkg.com/sonner/-/sonner-1.4.41.tgz#ff085ae4f4244713daf294959beaa3e90f842d2c" + integrity sha512-uG511ggnnsw6gcn/X+YKkWPo5ep9il9wYi3QJxHsYe7yTZ4+cOd1wuodOUmOpFuXL+/RE3R04LczdNCDygTDgQ== + source-map-js@^1.0.2, source-map-js@^1.2.0: version "1.2.0" resolved "https://registry.yarnpkg.com/source-map-js/-/source-map-js-1.2.0.tgz#16b809c162517b5b8c3e7dcd315a2a5c2612b2af"