Feat: Create a conversation #3221 (#9269)

### What problem does this PR solve?

Feat: Create a conversation #3221

### Type of change


- [x] New Feature (non-breaking change which adds functionality)

web/src/pages/home/chat-list.tsx

@@ -2,9 +2,9 @@ import { useFetchDialogList } from '@/hooks/use-chat-request';
 import { ApplicationCard } from './application-card';
 
 export function ChatList() {
-  const { data } = useFetchDialogList(true);
+  const { data } = useFetchDialogList();
 
-  return data
+  return data.dialogs
     .slice(0, 10)
     .map((x) => (
       <ApplicationCard

web/src/pages/next-chats/chat/index.tsx

@@ -1,6 +1,7 @@
 import { PageHeader } from '@/components/page-header';
 import { Button } from '@/components/ui/button';
 import { useNavigatePage } from '@/hooks/logic-hooks/navigate-hooks';
+import { useFetchDialog } from '@/hooks/use-chat-request';
 import { EllipsisVertical } from 'lucide-react';
 import { AppSettings } from './app-settings';
 import { ChatBox } from './chat-box';
@@ -8,10 +9,11 @@ import { Sessions } from './sessions';
 
 export default function Chat() {
   const { navigateToChatList } = useNavigatePage();
+  useFetchDialog();
 
   return (
     <section className="h-full flex flex-col">
-      <PageHeader back={navigateToChatList} title="Chat app 01">
+      <PageHeader>
         <div className="flex items-center gap-2">
           <Button variant={'icon'} size={'icon'}>
             <EllipsisVertical />

web/src/pages/next-chats/hooks/use-rename-chat.ts

@@ -1,8 +1,33 @@
 import { useSetModalState } from '@/hooks/common-hooks';
 import { useSetDialog } from '@/hooks/use-chat-request';
 import { IDialog } from '@/interfaces/database/chat';
+import { isEmpty } from 'lodash';
 import { useCallback, useState } from 'react';
 
+const InitialData = {
+  name: '',
+  icon: '',
+  language: 'English',
+  prompt_config: {
+    empty_response: '',
+    prologue: '你好！ 我是你的助理，有什么可以帮到你的吗？',
+    quote: true,
+    keyword: false,
+    tts: false,
+    system:
+      '你是一个智能助手，请总结知识库的内容来回答问题，请列举知识库中的数据详细回答。当所有知识库内容都与问题无关时，你的回答必须包括“知识库中未找到您要的答案！”这句话。回答需要考虑聊天历史。\n        以下是知识库：\n        {knowledge}\n        以上是知识库。',
+    refine_multiturn: false,
+    use_kg: false,
+    reasoning: false,
+    parameters: [{ key: 'knowledge', optional: false }],
+  },
+  llm_id: '',
+  llm_setting: {},
+  similarity_threshold: 0.2,
+  vector_similarity_weight: 0.30000000000000004,
+  top_n: 8,
+};
+
 export const useRenameChat = () => {
   const [chat, setChat] = useState<IDialog>({} as IDialog);
   const {
@@ -14,10 +39,11 @@ export const useRenameChat = () => {
 
   const onChatRenameOk = useCallback(
     async (name: string) => {
-      const ret = await setDialog({
-        ...chat,
+      const nextChat = {
+        ...(isEmpty(chat) ? InitialData : chat),
         name,
-      });
+      };
+      const ret = await setDialog(nextChat);
 
       if (ret === 0) {
         hideChatRenameModal();
@@ -27,19 +53,26 @@ export const useRenameChat = () => {
   );
 
   const handleShowChatRenameModal = useCallback(
-    async (record: IDialog) => {
-      setChat(record);
+    (record?: IDialog) => {
+      if (record) {
+        setChat(record);
+      }
       showChatRenameModal();
     },
     [showChatRenameModal],
   );
 
+  const handleHideModal = useCallback(() => {
+    hideChatRenameModal();
+    setChat({} as IDialog);
+  }, [hideChatRenameModal]);
+
   return {
     chatRenameLoading: loading,
     initialChatName: chat?.name,
     onChatRenameOk,
     chatRenameVisible,
-    hideChatRenameModal,
+    hideChatRenameModal: handleHideModal,
     showChatRenameModal: handleShowChatRenameModal,
   };
 };

web/src/pages/next-chats/index.tsx

@@ -11,7 +11,7 @@ import { ChatCard } from './chat-card';
 import { useRenameChat } from './hooks/use-rename-chat';
 
 export default function ChatList() {
-  const { data: chatList, setPagination, pagination } = useFetchDialogList();
+  const { data, setPagination, pagination } = useFetchDialogList();
   const { t } = useTranslation();
   const {
     initialChatName,
@@ -29,11 +29,15 @@ export default function ChatList() {
     [setPagination],
   );
 
+  const handleShowCreateModal = useCallback(() => {
+    showChatRenameModal();
+  }, [showChatRenameModal]);
+
   return (
     <section className="flex flex-col w-full flex-1">
       <div className="px-8 pt-8">
         <ListFilterBar title="Chat apps">
-          <Button>
+          <Button onClick={handleShowCreateModal}>
             <Plus className="size-2.5" />
             {t('chat.createChat')}
           </Button>
@@ -41,7 +45,7 @@ export default function ChatList() {
       </div>
       <div className="flex-1 overflow-auto">
         <div className="flex flex-wrap gap-4 px-8">
-          {chatList.map((x) => {
+          {data.dialogs.map((x) => {
             return (
               <ChatCard
                 key={x.id}
@@ -65,6 +69,7 @@ export default function ChatList() {
           onOk={onChatRenameOk}
           initialName={initialChatName}
           loading={chatRenameLoading}
+          title={initialChatName || t('chat.createChat')}
         ></RenameDialog>
       )}
     </section>