V4.8.14 dev (#3234)

* feat: rewrite chat context (#3176) * feat: add app auto execute (#3115) * feat: add app auto execute * auto exec configtion * chatting animation * change icon * fix * fix * fix link * feat: add chat context to all chatbox * perf: loading ui --------- Co-authored-by: heheer <heheer@sealos.io> * app auto exec (#3179) * add chat records loaded state (#3184) * perf: chat store reset storage (#3186) * perf: chat store reset storage * perf: auto exec code * chore: workflow ui (#3175) * chore: workflow ui * fix * change icon color config * change popover to mymenu * 4.8.14 test (#3189) * update doc * fix: token check * perf: icon button * update doc * feat: share page support configuration Whether to allow the original view (#3194) * update doc * perf: fix index (#3206) * perf: i18n * perf: Add service entry (#3226) * 4.8.14 test (#3228) * fix: ai log * fix: text splitter * fix: reference unselect & user form description & simple to advance (#3229) * fix: reference unselect & user form description & simple to advance * change abort position * perf * perf: code (#3232) * perf: code * update doc * fix: create btn permission (#3233) * update doc * fix: refresh chatbox listener * perf: check invalid reference * perf: check invalid reference * update doc * fix: ui props --------- Co-authored-by: heheer <heheer@sealos.io>
2025-07-23 21:13:50 +00:00 · 2024-11-26 12:02:58 +08:00
parent 7e1d31b5a9
commit 8aa6b53760
221 changed files with 3831 additions and 2737 deletions
--- a/projects/app/src/pages/chat/team.tsx
+++ b/projects/app/src/pages/chat/team.tsx
@@ -1,9 +1,8 @@
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 import NextHead from '@/components/common/NextHead';
-import { delChatRecordById, getTeamChatInfo } from '@/web/core/chat/api';
+import { getTeamChatInfo } from '@/web/core/chat/api';
 import { useRouter } from 'next/router';
 import { Box, Flex, Drawer, DrawerOverlay, DrawerContent, useTheme } from '@chakra-ui/react';
-import { useToast } from '@fastgpt/web/hooks/useToast';
 import SideBar from '@/components/SideBar';
 import PageContainer from '@/components/PageContainer';
 import { getMyTokensApps } from '@/web/core/chat/api';
@@ -25,10 +24,16 @@ import { InitChatResponse } from '@/global/core/chat/api';
 import { defaultChatData, GetChatTypeEnum } from '@/global/core/chat/constants';
 import { AppTypeEnum } from '@fastgpt/global/core/app/constants';
 import { getNanoid } from '@fastgpt/global/common/string/tools';
-import { useChat } from '@/components/core/chat/ChatContainer/useChat';

 import dynamic from 'next/dynamic';
 import { useSystem } from '@fastgpt/web/hooks/useSystem';
+import ChatItemContextProvider, { ChatItemContext } from '@/web/core/chat/context/chatItemContext';
+import ChatRecordContextProvider, {
+  ChatRecordContext
+} from '@/web/core/chat/context/chatRecordContext';
+import { useChatStore } from '@/web/core/chat/context/useChatStore';
+import { useMount } from 'ahooks';
+import { ChatSourceEnum } from '@fastgpt/global/core/chat/constants';
 const CustomPluginRunBox = dynamic(() => import('./components/CustomPluginRunBox'));

 type Props = { appId: string; chatId: string; teamId: string; teamToken: string };
@@ -38,51 +43,59 @@ const Chat = ({ myApps }: { myApps: AppListItemType[] }) => {
  const router = useRouter();
  const {
    teamId = '',
-    appId = '',
-    chatId = '',
+    appId: appIdQuery = '',
    teamToken,
    ...customVariables
  } = router.query as Props & {
    [key: string]: string;
  };

-  const { toast } = useToast();
  const theme = useTheme();
  const { isPc } = useSystem();

+  const { outLinkAuthData, appId, chatId } = useChatStore();
+
+  const isOpenSlider = useContextSelector(ChatContext, (v) => v.isOpenSlider);
+  const onCloseSlider = useContextSelector(ChatContext, (v) => v.onCloseSlider);
+  const forbidLoadChat = useContextSelector(ChatContext, (v) => v.forbidLoadChat);
+  const onChangeChatId = useContextSelector(ChatContext, (v) => v.onChangeChatId);
+  const onUpdateHistoryTitle = useContextSelector(ChatContext, (v) => v.onUpdateHistoryTitle);
+
+  const resetVariables = useContextSelector(ChatItemContext, (v) => v.resetVariables);
+  const setChatBoxData = useContextSelector(ChatItemContext, (v) => v.setChatBoxData);
+
+  const chatRecords = useContextSelector(ChatRecordContext, (v) => v.chatRecords);
+  const totalRecordsCount = useContextSelector(ChatRecordContext, (v) => v.totalRecordsCount);
+
+  // get chat app info
  const [chatData, setChatData] = useState<InitChatResponse>(defaultChatData);
+  const { loading: isLoading } = useRequest2(
+    async () => {
+      if (!appId || forbidLoadChat.current) return;

-  const {
-    onUpdateHistoryTitle,
-    onUpdateHistory,
-    onClearHistories,
-    onDelHistory,
-    isOpenSlider,
-    onCloseSlider,
-    forbidLoadChat,
-    onChangeChatId
-  } = useContextSelector(ChatContext, (v) => v);
+      const res = await getTeamChatInfo({ teamId, appId, chatId, teamToken });

-  const params = useMemo(() => {
-    return {
-      appId,
-      chatId,
-      teamId,
-      teamToken,
-      type: GetChatTypeEnum.team
-    };
-  }, [appId, chatId, teamId, teamToken]);
-  const {
-    ChatBoxRef,
-    variablesForm,
-    pluginRunTab,
-    setPluginRunTab,
-    resetVariables,
-    chatRecords,
-    ScrollData,
-    setChatRecords,
-    totalRecordsCount
-  } = useChat(params);
+      setChatData(res);
+      setChatBoxData(res);
+      // reset chat records
+      resetVariables({
+        variables: res.variables
+      });
+    },
+    {
+      manual: false,
+      refreshDeps: [teamId, teamToken, appId, chatId],
+      onError(e: any) {
+        console.log(e);
+        if (chatId) {
+          onChangeChatId();
+        }
+      },
+      onFinally() {
+        forbidLoadChat.current = false;
+      }
+    }
+  );

  const startChat = useCallback(
    async ({
@@ -143,58 +156,9 @@ const Chat = ({ myApps }: { myApps: AppListItemType[] }) => {
    ]
  );

-  // get chat app info
-  const { loading: isLoading } = useRequest2(
-    async () => {
-      if (!appId || forbidLoadChat.current) return;
-
-      const res = await getTeamChatInfo({ teamId, appId, chatId, teamToken });
-      setChatData(res);
-
-      // reset chat records
-      resetVariables({
-        variables: res.variables
-      });
-    },
-    {
-      manual: false,
-      refreshDeps: [teamId, teamToken, appId, chatId],
-      onError(e: any) {
-        console.log(e);
-        if (chatId) {
-          onChangeChatId('');
-        }
-      },
-      onFinally() {
-        forbidLoadChat.current = false;
-      }
-    }
-  );
-
  const RenderHistoryList = useMemo(() => {
    const Children = (
-      <ChatHistorySlider
-        appId={appId}
-        appName={chatData.app.name}
-        appAvatar={chatData.app.avatar}
-        confirmClearText={t('common:core.chat.Confirm to clear history')}
-        onDelHistory={(e) => onDelHistory({ ...e, appId, teamId, teamToken })}
-        onClearHistory={() => {
-          onClearHistories({ appId, teamId, teamToken });
-        }}
-        onSetHistoryTop={(e) => {
-          onUpdateHistory({ ...e, teamId, teamToken, appId });
-        }}
-        onSetCustomTitle={async (e) => {
-          onUpdateHistory({
-            appId,
-            chatId: e.chatId,
-            customTitle: e.title,
-            teamId,
-            teamToken
-          });
-        }}
-      />
+      <ChatHistorySlider confirmClearText={t('common:core.chat.Confirm to clear history')} />
    );

    return isPc || !appId ? (
@@ -211,20 +175,7 @@ const Chat = ({ myApps }: { myApps: AppListItemType[] }) => {
        <DrawerContent maxWidth={'75vw'}>{Children}</DrawerContent>
      </Drawer>
    );
-  }, [
-    appId,
-    chatData.app.avatar,
-    chatData.app.name,
-    isOpenSlider,
-    isPc,
-    onClearHistories,
-    onCloseSlider,
-    onDelHistory,
-    onUpdateHistory,
-    t,
-    teamId,
-    teamToken
-  ]);
+  }, [appId, isOpenSlider, isPc, onCloseSlider, t]);

  const loading = isLoading;

@@ -261,41 +212,19 @@ const Chat = ({ myApps }: { myApps: AppListItemType[] }) => {
            <Box flex={1}>
              {chatData.app.type === AppTypeEnum.plugin ? (
                <CustomPluginRunBox
-                  pluginInputs={chatData.app.pluginInputs}
-                  variablesForm={variablesForm}
-                  histories={chatRecords}
-                  setHistories={setChatRecords}
-                  appId={chatData.appId}
-                  tab={pluginRunTab}
-                  setTab={setPluginRunTab}
+                  appId={appId}
+                  chatId={chatId}
+                  outLinkAuthData={outLinkAuthData}
                  onNewChat={() => onChangeChatId(getNanoid())}
                  onStartChat={startChat}
                />
              ) : (
                <ChatBox
-                  ref={ChatBoxRef}
-                  ScrollData={ScrollData}
-                  chatHistories={chatRecords}
-                  setChatHistories={setChatRecords}
-                  variablesForm={variablesForm}
-                  appAvatar={chatData.app.avatar}
-                  userAvatar={chatData.userAvatar}
-                  chatConfig={chatData.app?.chatConfig}
+                  appId={appId}
+                  chatId={chatId}
+                  outLinkAuthData={outLinkAuthData}
                  feedbackType={'user'}
                  onStartChat={startChat}
-                  onDelMessage={({ contentId }) =>
-                    delChatRecordById({
-                      contentId,
-                      appId: chatData.appId,
-                      chatId,
-                      teamId,
-                      teamToken
-                    })
-                  }
-                  appId={chatData.appId}
-                  chatId={chatId}
-                  teamId={teamId}
-                  teamToken={teamToken}
                  chatType="team"
                  showRawSource
                  showNodeStatus
@@ -311,9 +240,8 @@ const Chat = ({ myApps }: { myApps: AppListItemType[] }) => {

 const Render = (props: Props) => {
  const { teamId, appId, teamToken } = props;
-  const { t } = useTranslation();
-  const { toast } = useToast();
  const router = useRouter();
+  const { source, chatId, setSource, setAppId, setOutLinkAuthData } = useChatStore();

  const { data: myApps = [], runAsync: loadMyApps } = useRequest2(
    async () => {
@@ -323,34 +251,61 @@ const Render = (props: Props) => {
      return [];
    },
    {
-      manual: false
+      manual: true
    }
  );

  // 初始化聊天框
-  useEffect(() => {
-    (async () => {
-      if (appId || myApps.length === 0) return;
+  useMount(async () => {
+    setSource('team');

-      router.replace({
-        query: {
-          ...router.query,
-          appId: myApps[0]._id,
-          chatId: ''
-        }
-      });
-    })();
-  }, [appId, loadMyApps, myApps, router, t, toast]);
+    const apps = await loadMyApps();
+
+    if (appId || apps.length === 0) return;
+
+    router.replace({
+      query: {
+        ...router.query,
+        appId: apps[0]._id
+      }
+    });
+  });
+  // Watch appId
+  useEffect(() => {
+    setAppId(appId);
+  }, [appId, setAppId]);
+  useEffect(() => {
+    setOutLinkAuthData({
+      teamId,
+      teamToken
+    });
+    return () => {
+      setOutLinkAuthData({});
+    };
+  }, [teamId, teamToken, setOutLinkAuthData]);

  const contextParams = useMemo(() => {
    return { teamId, appId, teamToken };
  }, [teamId, appId, teamToken]);
+  const chatRecordProviderParams = useMemo(() => {
+    return {
+      appId,
+      chatId,
+      teamId,
+      teamToken,
+      type: GetChatTypeEnum.team
+    };
+  }, [appId, chatId, teamId, teamToken]);

-  return (
+  return source === ChatSourceEnum.team ? (
    <ChatContextProvider params={contextParams}>
-      <Chat {...props} myApps={myApps} />
+      <ChatItemContextProvider>
+        <ChatRecordContextProvider params={chatRecordProviderParams}>
+          <Chat {...props} myApps={myApps} />
+        </ChatRecordContextProvider>
+      </ChatItemContextProvider>
    </ChatContextProvider>
-  );
+  ) : null;
 };

 export async function getServerSideProps(context: any) {