Merge pull request #1 from brichet/add_chat_model

Add a model to the chat panel

jupyter_chat/handlers.py

@@ -150,11 +150,13 @@ async def on_message(self, message):
             return
 
         # message broadcast to chat clients
-        chat_message_id = str(uuid.uuid4())
+        if not chat_request.id:
+            chat_request.id = str(uuid.uuid4())
+
         chat_message = ChatMessage(
-            id=chat_message_id,
+            id=chat_request.id,
             time=time.time(),
-            body=chat_request.prompt,
+            body=chat_request.body,
             sender=self.chat_client,
         )
 

jupyter_chat/models.py

@@ -8,7 +8,8 @@
 
 # the type of message used to chat with the agent
 class ChatRequest(BaseModel):
-    prompt: str
+    body: str
+    id: str
 
 
 class ChatUser(BaseModel):

package.json

@@ -60,7 +60,10 @@
         "@jupyterlab/rendermime": "^4.0.5",
         "@jupyterlab/services": "^7.0.5",
         "@jupyterlab/ui-components": "^4.0.5",
-        "@mui/icons-material": "5.11.0",
+        "@lumino/coreutils": "^2.1.2",
+        "@lumino/disposable": "^2.1.2",
+        "@lumino/signaling": "^2.1.2",
+        "@mui/icons-material": "^5.11.0",
         "@mui/material": "^5.11.0",
         "react": "^18.2.0",
         "react-dom": "^18.2.0"

src/components/chat-input.tsx

@@ -10,15 +10,7 @@ import {
 } from '@mui/material';
 import SendIcon from '@mui/icons-material/Send';
 
-type ChatInputProps = {
-  value: string;
-  onChange: (newValue: string) => unknown;
-  onSend: () => unknown;
-  sendWithShiftEnter: boolean;
-  sx?: SxProps<Theme>;
-};
-
-export function ChatInput(props: ChatInputProps): JSX.Element {
+export function ChatInput(props: ChatInput.IProps): JSX.Element {
   function handleKeyDown(event: React.KeyboardEvent<HTMLInputElement>) {
     if (
       event.key === 'Enter' &&
@@ -77,3 +69,19 @@ export function ChatInput(props: ChatInputProps): JSX.Element {
     </Box>
   );
 }
+
+/**
+ * The chat input namespace.
+ */
+export namespace ChatInput {
+  /**
+   * The properties of the react element.
+   */
+  export interface IProps {
+    value: string;
+    onChange: (newValue: string) => unknown;
+    onSend: () => unknown;
+    sendWithShiftEnter: boolean;
+    sx?: SxProps<Theme>;
+  }
+}

src/components/chat-messages.tsx

@@ -4,14 +4,14 @@ import type { SxProps, Theme } from '@mui/material';
 import React, { useState, useEffect } from 'react';
 
 import { RendermimeMarkdown } from './rendermime-markdown';
-import { ChatService } from '../services';
+import { IChatMessage, IUser } from '../types';
 
 type ChatMessagesProps = {
   rmRegistry: IRenderMimeRegistry;
-  messages: ChatService.IChatMessage[];
+  messages: IChatMessage[];
 };
 
-export type ChatMessageHeaderProps = ChatService.IUser & {
+export type ChatMessageHeaderProps = IUser & {
   timestamp: string;
   sx?: SxProps<Theme>;
 };