feat: fixed the issue where chat greetings could not appear (#95)

web/src/pages/chat/chat-configuration-modal/index.tsx

@@ -28,8 +28,8 @@ const segmentedMap = {
 };
 
 const layout = {
-  labelCol: { span: 6 },
-  wrapperCol: { span: 18 },
+  labelCol: { span: 7 },
+  wrapperCol: { span: 17 },
 };
 
 const validateMessages = {

web/src/pages/chat/chat-configuration-modal/prompt-engine.tsx

@@ -162,8 +162,13 @@ const PromptEngine = (
         <Input.TextArea autoSize={{ maxRows: 8, minRows: 5 }} />
       </Form.Item>
       <Divider></Divider>
-      <SimilaritySlider></SimilaritySlider>
-      <Form.Item<FieldType> label="Top n" name={'top_n'} initialValue={0}>
+      <SimilaritySlider isTooltipShown></SimilaritySlider>
+      <Form.Item<FieldType>
+        label="Top n"
+        name={'top_n'}
+        initialValue={8}
+        tooltip={'xxx'}
+      >
         <Slider max={30} />
       </Form.Item>
       <section className={classNames(styles.variableContainer)}>

web/src/pages/chat/chat-container/index.less

@@ -1,7 +1,8 @@
 .chatContainer {
-  padding: 0 24px 24px;
+  padding: 0 0 24px 24px;
   .messageContainer {
     overflow-y: auto;
+    padding-right: 24px;
   }
 }
 

web/src/pages/chat/chat-container/index.tsx

@@ -145,7 +145,7 @@ const MessageItem = ({
             <AssistantIcon></AssistantIcon>
           )}
           <Flex vertical gap={8} flex={1}>
-            <b>{isAssistant ? 'Resume Assistant' : 'You'}</b>
+            <b>{isAssistant ? '' : userInfo.nickname}</b>
             <div className={styles.messageText}>
               <Markdown
                 rehypePlugins={[rehypeWrapReference]}

web/src/pages/chat/hooks.ts

@@ -124,6 +124,14 @@ export const useSelectPromptConfigParameters = (): VariableTableDataType[] => {
   return finalParameters;
 };
 
+export const useSelectCurrentDialog = () => {
+  const currentDialog: IDialog = useSelector(
+    (state: any) => state.chatModel.currentDialog,
+  );
+
+  return currentDialog;
+};
+
 export const useRemoveDialog = () => {
   const dispatch = useDispatch();
 
@@ -404,6 +412,8 @@ export const useSelectCurrentConversation = () => {
   const conversation: IClientConversation = useSelector(
     (state: any) => state.chatModel.currentConversation,
   );
+  const dialog = useSelectCurrentDialog();
+  const { conversationId } = useGetChatSearchParams();
 
   const addNewestConversation = useCallback((message: string) => {
     setCurrentConversation((pre) => {
@@ -421,13 +431,30 @@ export const useSelectCurrentConversation = () => {
     });
   }, []);
 
-  useEffect(() => {
-    console.info('useSelectCurrentConversation: 1', currentConversation);
-  }, [currentConversation]);
+  const addPrologue = useCallback(() => {
+    if (conversationId === '') {
+      const prologue = dialog.prompt_config?.prologue;
+
+      const nextMessage = {
+        role: MessageType.Assistant,
+        content: prologue,
+        id: uuid(),
+      } as IMessage;
+
+      setCurrentConversation({
+        id: '',
+        dialog_id: dialog.id,
+        reference: [],
+        message: [nextMessage],
+      } as any);
+    }
+  }, [conversationId, dialog]);
 
   useEffect(() => {
-    console.info('useSelectCurrentConversation: 2', conversation);
+    addPrologue();
+  }, [addPrologue]);
 
+  useEffect(() => {
     setCurrentConversation(conversation);
   }, [conversation]);
 
@@ -472,7 +499,6 @@ export const useScrollToBottom = (currentConversation: IClientConversation) => {
 
 export const useFetchConversationOnMount = () => {
   const { conversationId } = useGetChatSearchParams();
-  const setCurrentConversation = useSetCurrentConversation();
   const fetchConversation = useFetchConversation();
   const { currentConversation, addNewestConversation } =
     useSelectCurrentConversation();
@@ -481,10 +507,8 @@ export const useFetchConversationOnMount = () => {
   const fetchConversationOnMount = useCallback(() => {
     if (isConversationIdExist(conversationId)) {
       fetchConversation(conversationId);
-    } else {
-      setCurrentConversation({} as IClientConversation);
     }
-  }, [fetchConversation, setCurrentConversation, conversationId]);
+  }, [fetchConversation, conversationId]);
 
   useEffect(() => {
     fetchConversationOnMount();

web/src/pages/chat/index.less

@@ -1,5 +1,6 @@
 .chatWrapper {
   height: 100%;
+  width: 100%;
 
   .chatAppWrapper {
     width: 288px;