fix simple snapshot init & auto excute when change app (#3293)

projects/app/src/components/core/chat/ChatContainer/ChatBox/index.tsx

@@ -845,7 +845,15 @@ const ChatBox = ({
         hideInUI: true
       });
     }
-  }, [isReady, chatStarted, autoExecute?.open, chatRecords, isChatRecordsLoaded]);
+  }, [
+    chatStarted,
+    chatRecords,
+    isChatRecordsLoaded,
+    sendPrompt,
+    isReady,
+    autoExecute.open,
+    autoExecute.defaultPrompt
+  ]);
 
   // output data
   useImperativeHandle(ChatBoxRef, () => ({

projects/app/src/pages/app/detail/components/SimpleApp/Edit.tsx

 import React from 'react';
 import { Box } from '@chakra-ui/react';
-import { useLocalStorageState, useMount } from 'ahooks';
+import { useDebounceEffect, useLocalStorageState, useMount } from 'ahooks';
 import { useDatasetStore } from '@/web/core/dataset/store/dataset';
 import { appWorkflow2Form } from '@fastgpt/global/core/app/utils';
 
@@ -62,12 +62,23 @@ const Edit = ({
   const { appDetail } = useContextSelector(AppContext, (v) => v);
   const { t } = useTranslation();
 
-  // 旧的编辑记录，直接重置到新的变量中
+  // Reset old edit history to new variables
   const [oldPast, setOldPast] = useLocalStorageState<SimpleAppSnapshotType[]>(
     `${appDetail._id}-past-simple`,
     {}
   );
 
+  // Save snapshot to local
+  useDebounceEffect(
+    () => {
+      saveSnapshot({
+        appForm
+      });
+    },
+    [appForm],
+    { wait: 500 }
+  );
+
   // Init app form
   useMount(() => {
     // show selected dataset

projects/app/src/pages/app/detail/components/SimpleApp/Header.tsx

@@ -9,7 +9,6 @@ import { useRouter } from 'next/router';
 import RouteTab from '../RouteTab';
 import { useTranslation } from 'next-i18next';
 import { AppSimpleEditFormType } from '@fastgpt/global/core/app/type';
-import { AppTypeEnum } from '@fastgpt/global/core/app/constants';
 import { form2AppWorkflow } from '@/web/core/app/utils';
 import { TabEnum } from '../context';
 import MyIcon from '@fastgpt/web/components/common/Icon';

projects/app/src/pages/app/detail/components/SimpleApp/index.tsx

@@ -23,16 +23,6 @@ const SimpleEdit = () => {
   );
 
   const [appForm, setAppForm] = useState(getDefaultAppForm());
-  // Save snapshot to local
-  useDebounceEffect(
-    () => {
-      saveSnapshot({
-        appForm
-      });
-    },
-    [appForm],
-    { wait: 500 }
-  );
 
   useBeforeunload({
     tip: t('common:core.common.tip.leave page')

projects/app/src/pages/app/detail/components/SimpleApp/useSnapshots.tsx

@@ -34,11 +34,9 @@ export const compareSimpleAppSnapshot = (
         questionGuide: appForm1.chatConfig?.questionGuide || false,
         ttsConfig: appForm1.chatConfig?.ttsConfig || undefined,
         whisperConfig: appForm1.chatConfig?.whisperConfig || undefined,
-        scheduledTriggerConfig: appForm1.chatConfig?.scheduledTriggerConfig || undefined,
         chatInputGuide: appForm1.chatConfig?.chatInputGuide || undefined,
         fileSelectConfig: appForm1.chatConfig?.fileSelectConfig || undefined,
-        instruction: appForm1.chatConfig?.instruction || '',
-        autoExecute: appForm1.chatConfig?.autoExecute || undefined
+        instruction: appForm1.chatConfig?.instruction || ''
       },
       {
         welcomeText: appForm2.chatConfig?.welcomeText || '',
@@ -46,11 +44,9 @@ export const compareSimpleAppSnapshot = (
         questionGuide: appForm2.chatConfig?.questionGuide || false,
         ttsConfig: appForm2.chatConfig?.ttsConfig || undefined,
         whisperConfig: appForm2.chatConfig?.whisperConfig || undefined,
-        scheduledTriggerConfig: appForm2.chatConfig?.scheduledTriggerConfig || undefined,
         chatInputGuide: appForm2.chatConfig?.chatInputGuide || undefined,
         fileSelectConfig: appForm2.chatConfig?.fileSelectConfig || undefined,
-        instruction: appForm2.chatConfig?.instruction || '',
-        autoExecute: appForm2.chatConfig?.autoExecute || undefined
+        instruction: appForm2.chatConfig?.instruction || ''
       }
     )
   ) {
@@ -58,7 +54,7 @@ export const compareSimpleAppSnapshot = (
     return false;
   }
 
-  return isEqual(appForm1, appForm2);
+  return isEqual({ ...appForm1, chatConfig: undefined }, { ...appForm2, chatConfig: undefined });
 };
 
 export const useSimpleAppSnapshots = (appId: string) => {

projects/app/src/pages/chat/index.tsx

@@ -63,15 +63,20 @@ const Chat = ({ myApps }: { myApps: AppListItemType[] }) => {
 
   // Load chat init data
   const [chatData, setChatData] = useState<InitChatResponse>(defaultChatData);
-  const { loading: isLoading } = useRequest2(
+  const { loading } = useRequest2(
     async () => {
       if (!appId || forbidLoadChat.current) return;
 
       const res = await getInitChatInfo({ appId, chatId });
       res.userAvatar = userInfo?.avatar;
 
-      setChatData(res);
-      setChatBoxData(res);
+      // Wait for state update to complete
+      await new Promise((resolve) => {
+        setChatData(res);
+        setChatBoxData(res);
+        setTimeout(resolve, 0);
+      });
+
       // reset chat variables
       resetVariables({
         variables: res.variables
@@ -136,8 +141,6 @@ const Chat = ({ myApps }: { myApps: AppListItemType[] }) => {
     },
     [chatId, appId, onUpdateHistoryTitle, forbidLoadChat]
   );
-  const loading = isLoading;
-
   const RenderHistorySlider = useMemo(() => {
     const Children = (
       <ChatHistorySlider confirmClearText={t('common:core.chat.Confirm to clear history')} />
@@ -210,6 +213,7 @@ const Chat = ({ myApps }: { myApps: AppListItemType[] }) => {
                   feedbackType={'user'}
                   onStartChat={onStartChat}
                   chatType={'chat'}
+                  isReady={!loading}
                   showRawSource
                   showNodeStatus
                 />

projects/app/src/pages/chat/share.tsx

@@ -88,7 +88,7 @@ const OutLink = (props: Props) => {
 
   const initSign = useRef(false);
   const [chatData, setChatData] = useState<InitChatResponse>(defaultChatData);
-  const { data, loading: isLoading } = useRequest2(
+  const { data, loading } = useRequest2(
     async () => {
       const shareId = outLinkAuthData.shareId;
       const outLinkUid = outLinkAuthData.outLinkUid;
@@ -100,8 +100,12 @@ const OutLink = (props: Props) => {
         outLinkUid
       });
 
-      setChatData(res);
-      setChatBoxData(res);
+      await new Promise((resolve) => {
+        setChatData(res);
+        setChatBoxData(res);
+        setTimeout(resolve, 0);
+      });
+
       resetVariables({
         variables: res.variables
       });
@@ -231,8 +235,6 @@ const OutLink = (props: Props) => {
     );
   }, [isOpenSlider, isPc, onCloseSlider, showHistory, t]);
 
-  const loading = isLoading;
-
   return (
     <>
       <NextHead title={props.appName || 'AI'} desc={props.appIntro} icon={props.appAvatar} />
@@ -280,6 +282,7 @@ const OutLink = (props: Props) => {
                   feedbackType={'user'}
                   onStartChat={startChat}
                   chatType="share"
+                  isReady={!loading}
                   showRawSource={showRawSource}
                   showNodeStatus={showNodeStatus}
                 />

projects/app/src/pages/chat/team.tsx

@@ -69,14 +69,17 @@ const Chat = ({ myApps }: { myApps: AppListItemType[] }) => {
 
   // get chat app info
   const [chatData, setChatData] = useState<InitChatResponse>(defaultChatData);
-  const { loading: isLoading } = useRequest2(
+  const { loading } = useRequest2(
     async () => {
       if (!appId || forbidLoadChat.current) return;
 
       const res = await getTeamChatInfo({ teamId, appId, chatId, teamToken });
 
-      setChatData(res);
-      setChatBoxData(res);
+      await new Promise((resolve) => {
+        setChatData(res);
+        setChatBoxData(res);
+        setTimeout(resolve, 0);
+      });
       // reset chat records
       resetVariables({
         variables: res.variables
@@ -177,8 +180,6 @@ const Chat = ({ myApps }: { myApps: AppListItemType[] }) => {
     );
   }, [appId, isOpenSlider, isPc, onCloseSlider, t]);
 
-  const loading = isLoading;
-
   return (
     <Flex h={'100%'}>
       <NextHead title={chatData.app.name} icon={chatData.app.avatar}></NextHead>
@@ -226,6 +227,7 @@ const Chat = ({ myApps }: { myApps: AppListItemType[] }) => {
                   feedbackType={'user'}
                   onStartChat={startChat}
                   chatType="team"
+                  isReady={!loading}
                   showRawSource
                   showNodeStatus
                 />