Commit 3b052779 by Xianquan Committed by GitHub

fix: isolate agent v2 chat preview state (#7005)

parent d2579656
...@@ -587,7 +587,7 @@ export const useChatGenerate = ({ ...@@ -587,7 +587,7 @@ export const useChatGenerate = ({
resumedChatTargetRef.current = `${appId}:${chatId}`; resumedChatTargetRef.current = `${appId}:${chatId}`;
setChatBoxData((state) => setChatBoxData((state) =>
state.chatId === chatId state.appId === appId && state.chatId === chatId
? { ? {
...state, ...state,
title: temporaryHistoryTitle, title: temporaryHistoryTitle,
...@@ -693,7 +693,7 @@ export const useChatGenerate = ({ ...@@ -693,7 +693,7 @@ export const useChatGenerate = ({
finishChatGenerateStatus({ finishChatGenerateStatus({
status: ChatGenerateStatusEnum.done, status: ChatGenerateStatusEnum.done,
finishedInActiveChat, finishedInActiveChat,
shouldUpdateChatBoxData: (state) => state.chatId === chatId shouldUpdateChatBoxData: (state) => state.appId === appId && state.chatId === chatId
}); });
} catch (err: any) { } catch (err: any) {
if (isAbortByLeave(err)) { if (isAbortByLeave(err)) {
...@@ -727,7 +727,7 @@ export const useChatGenerate = ({ ...@@ -727,7 +727,7 @@ export const useChatGenerate = ({
finishChatGenerateStatus({ finishChatGenerateStatus({
status: ChatGenerateStatusEnum.error, status: ChatGenerateStatusEnum.error,
finishedInActiveChat, finishedInActiveChat,
shouldUpdateChatBoxData: (state) => state.chatId === chatId shouldUpdateChatBoxData: (state) => state.appId === appId && state.chatId === chatId
}); });
} }
......
...@@ -83,6 +83,12 @@ const ChatTest = ({ appForm, setAppForm, setRenderEdit, form2WorkflowFn }: Props ...@@ -83,6 +83,12 @@ const ChatTest = ({ appForm, setAppForm, setRenderEdit, form2WorkflowFn }: Props
setRenderEdit(!datasetCiteData); setRenderEdit(!datasetCiteData);
}, [datasetCiteData, setRenderEdit]); }, [datasetCiteData, setRenderEdit]);
useEffect(() => {
setActiveTab('chat_debug');
setCiteModalData(undefined);
setRenderEdit(true);
}, [appDetail._id, chatId, setActiveTab, setCiteModalData, setRenderEdit]);
const { ChatContainer, restartChat } = useChatTest({ const { ChatContainer, restartChat } = useChatTest({
...workflowData, ...workflowData,
chatConfig: appForm.chatConfig, chatConfig: appForm.chatConfig,
......
...@@ -10,6 +10,7 @@ import AppContextProvider, { AppContext } from '@/pageComponents/app/detail/cont ...@@ -10,6 +10,7 @@ import AppContextProvider, { AppContext } from '@/pageComponents/app/detail/cont
import { AppTypeEnum } from '@fastgpt/global/core/app/constants'; import { AppTypeEnum } from '@fastgpt/global/core/app/constants';
import { useChatStore } from '@/web/core/chat/context/useChatStore'; import { useChatStore } from '@/web/core/chat/context/useChatStore';
import { TabEnum } from '@/pageComponents/app/detail/context'; import { TabEnum } from '@/pageComponents/app/detail/context';
import { ChatSourceEnum } from '@fastgpt/global/core/chat/constants';
const SimpleEdit = dynamic(() => import('@/pageComponents/app/detail/Edit/SimpleApp')); const SimpleEdit = dynamic(() => import('@/pageComponents/app/detail/Edit/SimpleApp'));
const AgentEdit = dynamic(() => import('@/pageComponents/app/detail/Edit/ChatAgent')); const AgentEdit = dynamic(() => import('@/pageComponents/app/detail/Edit/ChatAgent'));
...@@ -19,35 +20,45 @@ const MCPTools = dynamic(() => import('@/pageComponents/app/detail/Edit/MCPTools ...@@ -19,35 +20,45 @@ const MCPTools = dynamic(() => import('@/pageComponents/app/detail/Edit/MCPTools
const HTTPTools = dynamic(() => import('@/pageComponents/app/detail/Edit/HTTPTools')); const HTTPTools = dynamic(() => import('@/pageComponents/app/detail/Edit/HTTPTools'));
const AppDetail = () => { const AppDetail = () => {
const { setAppId, setSource } = useChatStore(); const { appId: storeAppId, source, setAppId, setSource } = useChatStore();
const appId = useContextSelector(AppContext, (e) => e.appId);
const appDetail = useContextSelector(AppContext, (e) => e.appDetail); const appDetail = useContextSelector(AppContext, (e) => e.appDetail);
const route2Tab = useContextSelector(AppContext, (e) => e.route2Tab); const route2Tab = useContextSelector(AppContext, (e) => e.route2Tab);
const isCurrentAppLoaded = !!appDetail._id && appDetail._id === appId;
const isChatStoreReady = source === ChatSourceEnum.test && storeAppId === appDetail._id;
useEffect(() => { useEffect(() => {
setSource('test'); setSource(ChatSourceEnum.test);
if (appDetail._id) { if (isCurrentAppLoaded) {
setAppId(appDetail._id); setAppId(appDetail._id);
if (!appDetail.permission.hasWritePer) { if (!appDetail.permission.hasWritePer) {
route2Tab(TabEnum.logs); route2Tab(TabEnum.logs);
} }
} }
}, [appDetail._id]); }, [
appDetail._id,
appDetail.permission.hasWritePer,
isCurrentAppLoaded,
route2Tab,
setAppId,
setSource
]);
return ( return (
<> <>
<NextHead title={appDetail.name} icon={appDetail.avatar}></NextHead> <NextHead title={appDetail.name} icon={appDetail.avatar}></NextHead>
<Box h={'100%'} position={'relative'} bg={'myGray.25'}> <Box h={'100%'} position={'relative'} bg={'myGray.25'}>
{!appDetail._id ? ( {!isCurrentAppLoaded || !isChatStoreReady ? (
<Loading fixed={false} /> <Loading fixed={false} />
) : ( ) : (
<> <>
{appDetail.type === AppTypeEnum.simple && <SimpleEdit />} {appDetail.type === AppTypeEnum.simple && <SimpleEdit key={appDetail._id} />}
{appDetail.type === AppTypeEnum.chatAgent && <AgentEdit />} {appDetail.type === AppTypeEnum.chatAgent && <AgentEdit key={appDetail._id} />}
{appDetail.type === AppTypeEnum.workflow && <Workflow />} {appDetail.type === AppTypeEnum.workflow && <Workflow key={appDetail._id} />}
{appDetail.type === AppTypeEnum.workflowTool && <Plugin />} {appDetail.type === AppTypeEnum.workflowTool && <Plugin key={appDetail._id} />}
{appDetail.type === AppTypeEnum.mcpToolSet && <MCPTools />} {appDetail.type === AppTypeEnum.mcpToolSet && <MCPTools key={appDetail._id} />}
{appDetail.type === AppTypeEnum.httpToolSet && <HTTPTools />} {appDetail.type === AppTypeEnum.httpToolSet && <HTTPTools key={appDetail._id} />}
</> </>
)} )}
</Box> </Box>
......
...@@ -32,14 +32,19 @@ const logger = getLogger(LogCategories.MODULE.CHAT.ITEM); ...@@ -32,14 +32,19 @@ const logger = getLogger(LogCategories.MODULE.CHAT.ITEM);
const Chat = () => { const Chat = () => {
const { isPc } = useSystem(); const { isPc } = useSystem();
const { appId } = useChatStore(); const { appId, chatId } = useChatStore();
const datasetCiteData = useContextSelector(ChatItemContext, (v) => v.datasetCiteData); const datasetCiteData = useContextSelector(ChatItemContext, (v) => v.datasetCiteData);
const setCiteModalData = useContextSelector(ChatItemContext, (v) => v.setCiteModalData); const setCiteModalData = useContextSelector(ChatItemContext, (v) => v.setCiteModalData);
const resetChatItemUIState = useContextSelector(ChatItemContext, (v) => v.resetUIState);
const collapse = useContextSelector(ChatPageContext, (v) => v.collapse); const collapse = useContextSelector(ChatPageContext, (v) => v.collapse);
const pane = useContextSelector(ChatPageContext, (v) => v.pane); const pane = useContextSelector(ChatPageContext, (v) => v.pane);
useEffect(() => {
resetChatItemUIState();
}, [appId, chatId, resetChatItemUIState]);
return ( return (
<Flex h={'100%'}> <Flex h={'100%'}>
{/* Side bar */} {/* Side bar */}
......
...@@ -206,8 +206,8 @@ const ChatContextProvider = ({ ...@@ -206,8 +206,8 @@ const ChatContextProvider = ({
const onUpdateHistoryTitle = useCallback( const onUpdateHistoryTitle = useCallback(
({ chatId, newTitle }: { chatId: string; newTitle: string }) => { ({ chatId, newTitle }: { chatId: string; newTitle: string }) => {
const { chatId: currentChatId } = useChatStore.getState(); const { appId: currentAppId, chatId: currentChatId } = useChatStore.getState();
if (chatId !== currentChatId) return; if (currentAppId !== historyAppId || chatId !== currentChatId) return;
setHistories((state) => setHistories((state) =>
upsertHistoryTitle({ upsertHistoryTitle({
......
...@@ -94,6 +94,7 @@ type ChatItemContextType = { ...@@ -94,6 +94,7 @@ type ChatItemContextType = {
setCiteModalData: React.Dispatch<React.SetStateAction<QuoteDataType | undefined>>; setCiteModalData: React.Dispatch<React.SetStateAction<QuoteDataType | undefined>>;
isVariableVisible: boolean; isVariableVisible: boolean;
setIsVariableVisible: React.Dispatch<React.SetStateAction<boolean>>; setIsVariableVisible: React.Dispatch<React.SetStateAction<boolean>>;
resetUIState: () => void;
} & ContextProps; } & ContextProps;
export const ChatItemContext = createContext<ChatItemContextType>({ export const ChatItemContext = createContext<ChatItemContextType>({
...@@ -128,6 +129,9 @@ export const ChatItemContext = createContext<ChatItemContextType>({ ...@@ -128,6 +129,9 @@ export const ChatItemContext = createContext<ChatItemContextType>({
isVariableVisible: true, isVariableVisible: true,
setIsVariableVisible: function (value: React.SetStateAction<boolean>): void { setIsVariableVisible: function (value: React.SetStateAction<boolean>): void {
throw new Error('Function not implemented.'); throw new Error('Function not implemented.');
},
resetUIState: function (): void {
throw new Error('Function not implemented.');
} }
}); });
...@@ -205,6 +209,12 @@ const ChatItemContextProvider = ({ ...@@ -205,6 +209,12 @@ const ChatItemContextProvider = ({
const [datasetCiteData, setCiteModalData] = useState<QuoteDataType>(); const [datasetCiteData, setCiteModalData] = useState<QuoteDataType>();
const resetUIState = useCallback(() => {
setCiteModalData(undefined);
setIsVariableVisible(true);
setPluginRunTab(PluginRunBoxTabEnum.input);
}, []);
const contextValue = useMemo(() => { const contextValue = useMemo(() => {
return { return {
chatBoxData, chatBoxData,
...@@ -228,7 +238,8 @@ const ChatItemContextProvider = ({ ...@@ -228,7 +238,8 @@ const ChatItemContextProvider = ({
datasetCiteData, datasetCiteData,
setCiteModalData, setCiteModalData,
isVariableVisible, isVariableVisible,
setIsVariableVisible setIsVariableVisible,
resetUIState
}; };
}, [ }, [
chatBoxData, chatBoxData,
...@@ -248,7 +259,8 @@ const ChatItemContextProvider = ({ ...@@ -248,7 +259,8 @@ const ChatItemContextProvider = ({
datasetCiteData, datasetCiteData,
setCiteModalData, setCiteModalData,
isVariableVisible, isVariableVisible,
setIsVariableVisible setIsVariableVisible,
resetUIState
]); ]);
return <ChatItemContext.Provider value={contextValue}>{children}</ChatItemContext.Provider>; return <ChatItemContext.Provider value={contextValue}>{children}</ChatItemContext.Provider>;
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or sign in to comment