prepare release (Chainlit#1081)

* prepare release
mauanga · Jun 17, 2024 · b32c872 · b32c872
1 parent 69668f2
commit b32c872
Show file tree

Hide file tree

Showing 12 changed files with 67 additions and 54 deletions.
diff --git a/CHANGELOG.md b/CHANGELOG.md
@@ -8,6 +8,20 @@ The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/).
 
 Nothing unreleased.
 
+## [1.1.302] - 2024-06-16
+
+### Added
+
+- Width and height option for the copilot bubble
+
+### Fixed
+
+- Chat profile icon in copilot should load
+
+### Removed
+
+- Running toast when an action is running
+
 ## [1.1.301] - 2024-06-14
 
 ### Fixed

diff --git a/README.md b/README.md
@@ -90,7 +90,7 @@ Full documentation is available [here](https://docs.chainlit.io). Key features:
 - [💬 Multi Modal chats](https://docs.chainlit.io/advanced-features/multi-modal)
 - [💭 Chain of Thought visualisation](https://docs.chainlit.io/concepts/step)
 - [💾 Data persistence + human feedback](https://docs.chainlit.io/data-persistence/overview)
-- [🛝 In context Prompt Playground](https://docs.chainlit.io/advanced-features/prompt-playground/overview)
+- [🐛 Debug Mode](https://docs.chainlit.io/data-persistence/enterprise#debug-mode)
 - [👤 Authentication](https://docs.chainlit.io/authentication/overview)
 
 Chainlit is compatible with all Python programs and libraries. That being said, it comes with integrations for:

diff --git a/backend/chainlit/langchain/callbacks.py b/backend/chainlit/langchain/callbacks.py
@@ -462,7 +462,7 @@ def _start_trace(self, run: Run) -> None:
         elif run.run_type == "embedding":
             step_type = "embedding"
 
-        if not self.steps:
+        if not self.steps and step_type != "llm":
             step_type = "run"
 
         disable_feedback = not self._is_annotable(run)

diff --git a/backend/chainlit/socket.py b/backend/chainlit/socket.py
@@ -21,7 +21,6 @@
     AudioChunkPayload,
     AudioEndPayload,
     MessagePayload,
-    SystemMessagePayload,
 )
 from chainlit.user_session import user_sessions
 

diff --git a/backend/chainlit/types.py b/backend/chainlit/types.py
@@ -155,11 +155,6 @@ class MessagePayload(TypedDict):
     fileReferences: Optional[List[FileReference]]
 
 
-class SystemMessagePayload(TypedDict):
-    content: str
-    metadata: Optional[Dict[str, Any]]
-
-
 class AudioChunkPayload(TypedDict):
     isStart: bool
     mimeType: str

diff --git a/backend/pyproject.toml b/backend/pyproject.toml
@@ -1,6 +1,6 @@
 [tool.poetry]
 name = "chainlit"
-version = "1.1.301"
+version = "1.1.302"
 keywords = [
     'LLM',
     'Agents',
@@ -60,7 +60,8 @@ optional = true
 [tool.poetry.group.tests.dependencies]
 openai = "^1.11.1"
 langchain = "^0.1.5"
-llama-index = "^0.10.15"
+llama-index = "^0.10.45"
+tenacity = "8.3.0" # pin until fixed https://github.com/langchain-ai/langchain/issues/22972
 transformers = "^4.30.1"
 matplotlib = "3.7.1"
 farm-haystack = "^1.18.0"

diff --git a/frontend/src/components/molecules/messages/Message.tsx b/frontend/src/components/molecules/messages/Message.tsx
@@ -3,6 +3,7 @@ import { MessageContext } from 'contexts/MessageContext';
 import { memo, useContext } from 'react';
 
 import Box from '@mui/material/Box';
+import Skeleton from '@mui/material/Skeleton';
 import Stack from '@mui/material/Stack';
 
 import { AskUploadButton } from './components/AskUploadButton';
@@ -96,9 +97,20 @@ const Message = memo(
                   />
                 </Box>
                 {forceDisplayCursor && (
-                  <Box mt={1}>
+                  <Stack
+                    direction="row"
+                    gap="1rem"
+                    alignItems="center"
+                    my={0.5}
+                    width="100%"
+                  >
+                    <Skeleton
+                      variant="circular"
+                      width="1.6rem"
+                      height="1.6rem"
+                    />
                     <BlinkingCursor />
-                  </Box>
+                  </Stack>
                 )}
               </Box>
             ) : (

diff --git a/libs/copilot/src/chat/messages/index.tsx b/libs/copilot/src/chat/messages/index.tsx
@@ -28,26 +28,7 @@ const Messages = (): JSX.Element => {
 
   const callActionWithToast = useCallback(
     (action: IAction) => {
-      const promise = callAction(action);
-      if (promise) {
-        toast.promise(promise, {
-          loading: `Running ${action.name}`,
-          success: (res) => {
-            if (res.response) {
-              return res.response;
-            } else {
-              return `${action.name} executed successfully`;
-            }
-          },
-          error: (res) => {
-            if (res.response) {
-              return res.response;
-            } else {
-              return `${action.name} failed`;
-            }
-          }
-        });
-      }
+      callAction(action);
     },
     [callAction]
   );

diff --git a/libs/copilot/src/components/ChatProfiles.tsx b/libs/copilot/src/components/ChatProfiles.tsx
@@ -1,16 +1,18 @@
 import size from 'lodash/size';
-import { useState } from 'react';
+import { useContext, useState } from 'react';
 
 import { SelectInput } from '@chainlit/app/src/components/atoms/inputs';
 import NewChatDialog from '@chainlit/app/src/components/molecules/newChatDialog';
 import {
+  ChainlitContext,
   useChatInteract,
   useChatMessages,
   useChatSession,
   useConfig
 } from '@chainlit/react-client';
 
 export default function ChatProfiles() {
+  const apiClient = useContext(ChainlitContext);
   const { config } = useConfig();
   const { chatProfile, setChatProfile } = useChatSession();
   const { firstInteraction } = useChatMessages();
@@ -43,22 +45,27 @@ export default function ChatProfiles() {
     return null;
   }
 
-  const items = config.chatProfiles.map((item) => ({
-    label: item.name,
-    value: item.name,
-    icon: item.icon ? (
-      <img
-        src={item.icon}
-        className="chat-profile-icon"
-        style={{
-          width: '24px',
-          height: '24px',
-          borderRadius: '50%',
-          objectFit: 'cover'
-        }}
-      />
-    ) : undefined
-  }));
+  const items = config.chatProfiles.map((item) => {
+    const icon = item.icon?.includes('/public')
+      ? apiClient.buildEndpoint(item.icon)
+      : item.icon;
+    return {
+      label: item.name,
+      value: item.name,
+      icon: icon ? (
+        <img
+          src={icon}
+          className="chat-profile-icon"
+          style={{
+            width: '24px',
+            height: '24px',
+            borderRadius: '50%',
+            objectFit: 'cover'
+          }}
+        />
+      ) : undefined
+    };
+  });
 
   return (
     <>

diff --git a/libs/copilot/src/popover.tsx b/libs/copilot/src/popover.tsx
@@ -9,9 +9,10 @@ import Header from 'components/Header';
 
 interface Props {
   anchorEl?: HTMLElement | null;
+  buttonHeight: string;
 }
 
-export default function PopOver({ anchorEl }: Props) {
+export default function PopOver({ anchorEl, buttonHeight }: Props) {
   const [expanded, setExpanded] = useState(false);
   return (
     <Popper
@@ -23,7 +24,7 @@ export default function PopOver({ anchorEl }: Props) {
         display: 'flex',
         flexDirection: 'column',
         inset: 'auto auto 14px -24px !important',
-        height: 'min(730px, calc(100vh - 100px))',
+        height: `min(730px, calc(100vh - ${buttonHeight} - 48px))`,
         width: expanded ? '80vw' : 'min(400px, 80vw)',
         overflow: 'hidden',
         borderRadius: '12px',

diff --git a/libs/copilot/src/types.ts b/libs/copilot/src/types.ts
@@ -9,6 +9,8 @@ export interface IWidgetConfig {
     imageUrl?: string;
     style?: {
       size?: string;
+      width?: string;
+      height?: string;
       bgcolor?: string;
       color?: string;
       bgcolorHover?: string;

diff --git a/libs/copilot/src/widget.tsx b/libs/copilot/src/widget.tsx
@@ -16,9 +16,10 @@ interface Props {
 export default function Widget({ config }: Props) {
   const [anchorEl, setAnchorEl] = useState<HTMLElement | null>();
   const customStyle = config.button?.style || {};
+  const buttonHeight = customStyle.height || customStyle.size || '60px';
   const style = {
-    width: customStyle.size || '60px',
-    height: customStyle.size || '60px',
+    width: customStyle.width || customStyle.size || '60px',
+    height: buttonHeight,
     bgcolor: customStyle.bgcolor || '#F80061',
     color: customStyle.color || 'white',
     '&:hover': {
@@ -35,7 +36,7 @@ export default function Widget({ config }: Props) {
 
   return (
     <>
-      <PopOver anchorEl={anchorEl} />
+      <PopOver anchorEl={anchorEl} buttonHeight={buttonHeight} />
       <Fab
         disableRipple
         aria-label="open copilot"