feat: allow sending toast notifications

Chainlit · Jan 17, 2025 · 6eb4f4f · 6eb4f4f
1 parent 32d7fd8
commit 6eb4f4f
Show file tree

Hide file tree

Showing 4 changed files with 43 additions and 1 deletion.
diff --git a/frontend/vite.config.ts b/frontend/vite.config.ts
@@ -9,10 +9,11 @@ export default defineConfig({
   plugins: [react(), tsconfigPaths(), svgr()],
   resolve: {
     alias: {
-      "@": path.resolve(__dirname, "./src"),
+      '@': path.resolve(__dirname, './src'),
       // To prevent conflicts with packages in @chainlit/react-client, we need to specify the resolution paths for these dependencies.
       react: path.resolve(__dirname, './node_modules/react'),
       'usehooks-ts': path.resolve(__dirname, './node_modules/usehooks-ts'),
+      sonner: path.resolve(__dirname, './node_modules/sonner'),
       lodash: path.resolve(__dirname, './node_modules/lodash'),
       recoil: path.resolve(__dirname, './node_modules/recoil')
     }

diff --git a/libs/react-client/package.json b/libs/react-client/package.json
@@ -55,6 +55,7 @@
     "jwt-decode": "^3.1.2",
     "lodash": "^4.17.21",
     "socket.io-client": "^4.7.2",
+    "sonner": "^1.7.1",
     "swr": "^2.2.2",
     "uuid": "^9.0.0"
   },

diff --git a/libs/react-client/pnpm-lock.yaml b/libs/react-client/pnpm-lock.yaml
diff --git a/libs/react-client/src/useChatSession.ts b/libs/react-client/src/useChatSession.ts
@@ -7,6 +7,7 @@ import {
   useSetRecoilState
 } from 'recoil';
 import io from 'socket.io-client';
+import { toast } from 'sonner';
 import {
   actionState,
   askUserState,
@@ -333,6 +334,31 @@ const useChatSession = () => {
           window.parent.postMessage(data, '*');
         }
       });
+
+      socket.on('toast', (data: { type: string; message: string }) => {
+        if (!data.message) {
+          console.warn('No message received for toast.');
+          return;
+        }
+
+        switch (data.type) {
+          case 'info':
+            toast.info(data.message);
+            break;
+          case 'error':
+            toast.error(data.message);
+            break;
+          case 'success':
+            toast.success(data.message);
+            break;
+          case 'warning':
+            toast.warning(data.message);
+            break;
+          default:
+            toast(data.message);
+            break;
+        }
+      });
     },
     [setSession, sessionId, idToResume, chatProfile]
   );