From d52700c645c80590c7073366f4bd20643e400c19 Mon Sep 17 00:00:00 2001 From: heheer Date: Wed, 19 Mar 2025 11:57:30 +0800 Subject: [PATCH] add external variable debug (#4204) * add external variable debug * fix ui * plugin variables --- packages/web/i18n/en/common.json | 2 + packages/web/i18n/zh-CN/common.json | 2 + packages/web/i18n/zh-Hant/common.json | 2 + .../ChatBox/components/VariableInput.tsx | 217 +++++++++++++++--- .../ChatBox/components/VariablePopover.tsx | 98 ++++++++ .../core/chat/ChatContainer/ChatBox/index.tsx | 55 ++++- .../PluginRunBox/components/RenderInput.tsx | 66 +++--- .../components/renderPluginInput.tsx | 18 +- .../app/detail/SimpleApp/ChatTest.tsx | 12 +- .../WorkflowComponents/Flow/ChatTest.tsx | 6 +- .../Flow/hooks/useDebug.tsx | 41 +++- .../nodes/NodePluginIO/InputTypeConfig.tsx | 21 +- .../pageComponents/app/detail/useChatTest.tsx | 2 +- .../src/pageComponents/chat/ChatHeader.tsx | 12 +- .../web/core/chat/context/chatItemContext.tsx | 16 +- 15 files changed, 473 insertions(+), 97 deletions(-) create mode 100644 projects/app/src/components/core/chat/ChatContainer/ChatBox/components/VariablePopover.tsx diff --git a/packages/web/i18n/en/common.json b/packages/web/i18n/en/common.json index cd36d6a6a..9ec8e914b 100644 --- a/packages/web/i18n/en/common.json +++ b/packages/web/i18n/en/common.json @@ -430,6 +430,8 @@ "core.chat.Start Chat": "Start Chat", "core.chat.Type a message": "Enter a Question, Press [Enter] to Send / Press [Ctrl(Alt/Shift) + Enter] for New Line", "core.chat.Unpin": "Unpin", + "core.chat.Variable_Visiable_in_test": "This variable is not visible in the login-free link", + "core.chat.Visiable_in_test": "Custom variables are not visible in login-free links", "core.chat.You need to a chat app": "You Do Not Have an Available App", "core.chat.error.Chat error": "Chat Error", "core.chat.error.Messages empty": "API Content is Empty, Possibly Due to Text Being Too Long", diff --git a/packages/web/i18n/zh-CN/common.json b/packages/web/i18n/zh-CN/common.json index 52445499c..451ccf4cd 100644 --- a/packages/web/i18n/zh-CN/common.json +++ b/packages/web/i18n/zh-CN/common.json @@ -433,6 +433,8 @@ "core.chat.Start Chat": "开始对话", "core.chat.Type a message": "输入问题，发送 [Enter]/换行 [Ctrl(Alt/Shift) + Enter]", "core.chat.Unpin": "取消置顶", + "core.chat.Variable_Visiable_in_test": "该变量在免登录链接中不可见", + "core.chat.Visiable_in_test": "自定义变量在免登录链接中不可见", "core.chat.You need to a chat app": "你没有可用的应用", "core.chat.error.Chat error": "对话出现异常", "core.chat.error.Messages empty": "接口内容为空，可能文本超长了~", diff --git a/packages/web/i18n/zh-Hant/common.json b/packages/web/i18n/zh-Hant/common.json index fff2a0c78..53c122b7e 100644 --- a/packages/web/i18n/zh-Hant/common.json +++ b/packages/web/i18n/zh-Hant/common.json @@ -429,6 +429,8 @@ "core.chat.Start Chat": "開始對話", "core.chat.Type a message": "輸入問題，按 [Enter] 傳送 / 按 [Ctrl(Alt/Shift) + Enter] 換行", "core.chat.Unpin": "取消釘選", + "core.chat.Variable_Visiable_in_test": "該變量在免登錄鏈接中不可見", + "core.chat.Visiable_in_test": "自定義變量在免登錄鏈接中不可見", "core.chat.You need to a chat app": "您沒有可用的應用程式", "core.chat.error.Chat error": "對話發生錯誤", "core.chat.error.Messages empty": "API 內容為空，可能是文字過長", diff --git a/projects/app/src/components/core/chat/ChatContainer/ChatBox/components/VariableInput.tsx b/projects/app/src/components/core/chat/ChatContainer/ChatBox/components/VariableInput.tsx index 69593c36d..5d06bdd5f 100644 --- a/projects/app/src/components/core/chat/ChatContainer/ChatBox/components/VariableInput.tsx +++ b/projects/app/src/components/core/chat/ChatContainer/ChatBox/components/VariableInput.tsx @@ -1,20 +1,26 @@ -import React, { useEffect } from 'react'; +import React, { useEffect, useMemo } from 'react'; import { Controller, UseFormReturn } from 'react-hook-form'; import { useTranslation } from 'next-i18next'; -import { Box, Button, Card, Textarea } from '@chakra-ui/react'; +import { Box, Button, Card, Flex, Switch, Textarea } from '@chakra-ui/react'; import ChatAvatar from './ChatAvatar'; import { MessageCardStyle } from '../constants'; -import { VariableInputEnum } from '@fastgpt/global/core/workflow/constants'; +import { + VariableInputEnum, + WorkflowIOValueTypeEnum +} from '@fastgpt/global/core/workflow/constants'; import MySelect from '@fastgpt/web/components/common/MySelect'; import MyIcon from '@fastgpt/web/components/common/Icon'; import { ChatBoxInputFormType } from '../type.d'; import { useContextSelector } from 'use-context-selector'; -import { ChatBoxContext } from '../Provider'; import QuestionTip from '@fastgpt/web/components/common/MyTooltip/QuestionTip'; import { VariableItemType } from '@fastgpt/global/core/app/type'; import MyTextarea from '@/components/common/Textarea/MyTextarea'; import MyNumberInput from '@fastgpt/web/components/common/Input/NumberInput'; import { ChatItemContext } from '@/web/core/chat/context/chatItemContext'; +import { ChatBoxContext } from '../Provider'; +import dynamic from 'next/dynamic'; + +const JsonEditor = dynamic(() => import('@fastgpt/web/components/common/Textarea/JsonEditor')); export const VariableInputItem = ({ item, @@ -108,23 +114,118 @@ export const VariableInputItem = ({ ); }; +export const ExternalVariableInputItem = ({ + item, + variablesForm, + showTag = false +}: { + item: VariableItemType; + variablesForm: UseFormReturn; + showTag?: boolean; +}) => { + const { t } = useTranslation(); + const { register, control } = variablesForm; + + return ( + + + {item.label} + {item.required && ( + + * + + )} + {item.description && } + {showTag && ( + + + {t('common:core.chat.Variable_Visiable_in_test')} + + )} + + { + if (item.valueType === WorkflowIOValueTypeEnum.boolean) { + return value !== undefined; + } + return !!value; + } + }} + render={({ field: { onChange, value } }) => { + if (item.valueType === WorkflowIOValueTypeEnum.string) { + return ( + + ); + } + if (item.valueType === WorkflowIOValueTypeEnum.number) { + return ; + } + if (item.valueType === WorkflowIOValueTypeEnum.boolean) { + return ; + } + return ; + }} + /> + + ); +}; + const VariableInput = ({ chatForm, - chatStarted + chatStarted, + showExternalVariables = false }: { - chatStarted: boolean; chatForm: UseFormReturn; + chatStarted: boolean; + showExternalVariables?: boolean; }) => { const { t } = useTranslation(); const appAvatar = useContextSelector(ChatItemContext, (v) => v.chatBoxData?.app?.avatar); const variablesForm = useContextSelector(ChatItemContext, (v) => v.variablesForm); const variableList = useContextSelector(ChatBoxContext, (v) => v.variableList); + const allVariableList = useContextSelector(ChatBoxContext, (v) => v.allVariableList); + + const externalVariableList = useMemo( + () => + allVariableList.filter((item) => + showExternalVariables ? item.type === VariableInputEnum.custom : false + ), + [allVariableList, showExternalVariables] + ); const { getValues, setValue, handleSubmit: handleSubmitChat } = variablesForm; useEffect(() => { - variableList.forEach((item) => { + allVariableList.forEach((item) => { const val = getValues(`variables.${item.key}`); if (item.defaultValue !== undefined && (val === undefined || val === null || val === '')) { setValue(`variables.${item.key}`, item.defaultValue); @@ -135,34 +236,80 @@ const VariableInput = ({ return ( - - - {variableList.map((item) => ( - - ))} - {!chatStarted && ( - - - - )} - - + {externalVariableList.length > 0 && ( + + + + + {t('common:core.chat.Visiable_in_test')} + + {externalVariableList.map((item) => ( + + ))} + {variableList.length === 0 && !chatStarted && ( + + + + )} + + + )} + + {variableList.length > 0 && ( + + + {variableList.map((item) => ( + + ))} + {!chatStarted && ( + + + + )} + + + )} ); }; diff --git a/projects/app/src/components/core/chat/ChatContainer/ChatBox/components/VariablePopover.tsx b/projects/app/src/components/core/chat/ChatContainer/ChatBox/components/VariablePopover.tsx new file mode 100644 index 000000000..d75ada0ab --- /dev/null +++ b/projects/app/src/components/core/chat/ChatContainer/ChatBox/components/VariablePopover.tsx @@ -0,0 +1,98 @@ +import { Box, Button, Flex } from '@chakra-ui/react'; +import MyPopover from '@fastgpt/web/components/common/MyPopover'; +import { useTranslation } from 'next-i18next'; +import MyIcon from '@fastgpt/web/components/common/Icon'; +import { useContextSelector } from 'use-context-selector'; +import { ChatItemContext } from '@/web/core/chat/context/chatItemContext'; +import { VariableInputEnum } from '@fastgpt/global/core/workflow/constants'; +import { useEffect } from 'react'; +import { ExternalVariableInputItem, VariableInputItem } from './VariableInput'; +import MyDivider from '@fastgpt/web/components/common/MyDivider'; + +const VariablePopover = ({ + showExternalVariables = false +}: { + showExternalVariables?: boolean; +}) => { + const { t } = useTranslation(); + const variablesForm = useContextSelector(ChatItemContext, (v) => v.variablesForm); + const variables = useContextSelector( + ChatItemContext, + (v) => v.chatBoxData?.app?.chatConfig?.variables ?? [] + ); + const variableList = variables.filter((item) => item.type !== VariableInputEnum.custom); + const externalVariableList = variables.filter((item) => + showExternalVariables ? item.type === VariableInputEnum.custom : false + ); + + const hasExternalVariable = externalVariableList.length > 0; + const hasVariable = variableList.length > 0; + + const { getValues, setValue } = variablesForm; + + useEffect(() => { + variables.forEach((item) => { + const val = getValues(`variables.${item.key}`); + if (item.defaultValue !== undefined && (val === undefined || val === null || val === '')) { + setValue(`variables.${item.key}`, item.defaultValue); + } + }); + }, [variables]); + + return ( + }> + {t('common:core.module.Variable')} + + } + > + {({ onClose }) => ( + + {hasExternalVariable && ( + + + + {t('common:core.chat.Visiable_in_test')} + + {externalVariableList.map((item) => ( + + ))} + + )} + {hasExternalVariable && hasVariable && } + {hasVariable && ( + + {variableList.map((item) => ( + + ))} + + )} + + + + + )} + + ); +}; + +export default VariablePopover; diff --git a/projects/app/src/components/core/chat/ChatContainer/ChatBox/index.tsx b/projects/app/src/components/core/chat/ChatContainer/ChatBox/index.tsx index 993f88f7e..0dc4c5bd2 100644 --- a/projects/app/src/components/core/chat/ChatContainer/ChatBox/index.tsx +++ b/projects/app/src/components/core/chat/ChatContainer/ChatBox/index.tsx @@ -65,6 +65,7 @@ import { ChatRecordContext } from '@/web/core/chat/context/chatRecordContext'; import { ChatItemContext } from '@/web/core/chat/context/chatItemContext'; import TimeBox from './components/TimeBox'; import MyBox from '@fastgpt/web/components/common/MyBox'; +import { VariableInputEnum } from '@fastgpt/global/core/workflow/constants'; const ResponseTags = dynamic(() => import('./components/ResponseTags')); const FeedbackModal = dynamic(() => import('./components/FeedbackModal')); @@ -103,7 +104,8 @@ const ChatBox = ({ showVoiceIcon = true, showEmptyIntro = false, active = true, - onStartChat + onStartChat, + chatType }: Props) => { const ScrollContainerRef = useRef(null); const { t } = useTranslation(); @@ -129,6 +131,8 @@ const ChatBox = ({ const chatBoxData = useContextSelector(ChatItemContext, (v) => v.chatBoxData); const ChatBoxRef = useContextSelector(ChatItemContext, (v) => v.ChatBoxRef); const variablesForm = useContextSelector(ChatItemContext, (v) => v.variablesForm); + const setIsVariableVisible = useContextSelector(ChatItemContext, (v) => v.setIsVariableVisible); + const chatRecords = useContextSelector(ChatRecordContext, (v) => v.chatRecords); const setChatRecords = useContextSelector(ChatRecordContext, (v) => v.setChatRecords); const isChatRecordsLoaded = useContextSelector(ChatRecordContext, (v) => v.isChatRecordsLoaded); @@ -150,6 +154,12 @@ const ChatBox = ({ // Workflow running, there are user input or selection const isInteractive = useMemo(() => checkIsInteractiveByHistories(chatRecords), [chatRecords]); + const externalVariableList = useMemo(() => { + if (chatType === 'chat') { + return allVariableList.filter((item) => item.type === VariableInputEnum.custom); + } + return []; + }, [allVariableList, chatType]); // compute variable input is finish. const chatForm = useForm({ defaultValues: { @@ -162,7 +172,9 @@ const ChatBox = ({ const chatStartedWatch = watch('chatStarted'); const chatStarted = chatBoxData?.appId === appId && - (chatStartedWatch || chatRecords.length > 0 || variableList.length === 0); + (chatStartedWatch || + chatRecords.length > 0 || + [...variableList, ...externalVariableList].length === 0); // 滚动到底部 const scrollToBottom = useMemoizedFn((behavior: 'smooth' | 'auto' = 'smooth', delay = 0) => { @@ -891,6 +903,33 @@ const ChatBox = ({ } })); + // Visibility check + useEffect(() => { + const checkVariableVisibility = () => { + if (!ScrollContainerRef.current) return; + const container = ScrollContainerRef.current; + const variableInput = container.querySelector('#variable-input'); + if (!variableInput) return; + + const containerRect = container.getBoundingClientRect(); + const elementRect = variableInput.getBoundingClientRect(); + + setIsVariableVisible( + elementRect.bottom > containerRect.top && elementRect.top < containerRect.bottom + ); + }; + + const container = ScrollContainerRef.current; + if (container) { + container.addEventListener('scroll', checkVariableVisibility); + checkVariableVisibility(); + + return () => { + container.removeEventListener('scroll', checkVariableVisibility); + }; + } + }, [setIsVariableVisible]); + const RenderRecords = useMemo(() => { return ( } {!!welcomeText && } {/* variable input */} - {!!variableList?.length && ( - + {(!!variableList?.length || !!externalVariableList?.length) && ( + + + )} {/* chat history */} @@ -1006,7 +1051,9 @@ const ChatBox = ({ chatForm, chatRecords, chatStarted, + chatType, delOneMessage, + externalVariableList?.length, isChatting, onAddUserDislike, onAddUserLike, diff --git a/projects/app/src/components/core/chat/ChatContainer/PluginRunBox/components/RenderInput.tsx b/projects/app/src/components/core/chat/ChatContainer/PluginRunBox/components/RenderInput.tsx index 240a5a381..b20212532 100644 --- a/projects/app/src/components/core/chat/ChatContainer/PluginRunBox/components/RenderInput.tsx +++ b/projects/app/src/components/core/chat/ChatContainer/PluginRunBox/components/RenderInput.tsx @@ -18,6 +18,7 @@ import { ChatBoxInputFormType } from '../../ChatBox/type'; import { FlowNodeInputItemType } from '@fastgpt/global/core/workflow/type/io'; import { ChatItemContext } from '@/web/core/chat/context/chatItemContext'; import { ChatRecordContext } from '@/web/core/chat/context/chatRecordContext'; +import { FlowNodeInputTypeEnum } from '@fastgpt/global/core/workflow/node/constant'; const RenderInput = () => { const { t } = useTranslation(); @@ -213,36 +214,43 @@ const RenderInput = () => { )} {/* Filed */} - {formatPluginInputs.map((input) => { - return ( - { - if (!input.required) return true; - if (input.valueType === WorkflowIOValueTypeEnum.boolean) { - return value !== undefined; + {formatPluginInputs + .filter((input) => { + if (outLinkAuthData && Object.keys(outLinkAuthData).length > 0) { + return input.renderTypeList[0] !== FlowNodeInputTypeEnum.customVariable; + } + return true; + }) + .map((input) => { + return ( + { + if (!input.required) return true; + if (input.valueType === WorkflowIOValueTypeEnum.boolean) { + return value !== undefined; + } + return !!value; } - return !!value; - } - }} - render={({ field: { onChange, value } }) => { - return ( - - ); - }} - /> - ); - })} + }} + render={({ field: { onChange, value } }) => { + return ( + + ); + }} + /> + ); + })} {/* Run Button */} {onStartChat && onNewChat && ( diff --git a/projects/app/src/components/core/chat/ChatContainer/PluginRunBox/components/renderPluginInput.tsx b/projects/app/src/components/core/chat/ChatContainer/PluginRunBox/components/renderPluginInput.tsx index 665a1a6f0..ba28be3ef 100644 --- a/projects/app/src/components/core/chat/ChatContainer/PluginRunBox/components/renderPluginInput.tsx +++ b/projects/app/src/components/core/chat/ChatContainer/PluginRunBox/components/renderPluginInput.tsx @@ -157,9 +157,6 @@ const RenderPluginInput = ({ const { llmModelList } = useSystemStore(); const render = (() => { - if (inputType === FlowNodeInputTypeEnum.customVariable) { - return null; - } if (inputType === FlowNodeInputTypeEnum.select && input.list) { return ( @@ -246,6 +243,21 @@ const RenderPluginInput = ({ {t(input.label as any)} {input.description && } + {inputType === FlowNodeInputTypeEnum.customVariable && ( + + + {t('common:core.chat.Variable_Visiable_in_test')} + + )} )} diff --git a/projects/app/src/pageComponents/app/detail/SimpleApp/ChatTest.tsx b/projects/app/src/pageComponents/app/detail/SimpleApp/ChatTest.tsx index 7a4b2dabb..a1611b7a8 100644 --- a/projects/app/src/pageComponents/app/detail/SimpleApp/ChatTest.tsx +++ b/projects/app/src/pageComponents/app/detail/SimpleApp/ChatTest.tsx @@ -1,4 +1,4 @@ -import { Box, Flex, IconButton } from '@chakra-ui/react'; +import { Box, Button, Flex, IconButton } from '@chakra-ui/react'; import { useTranslation } from 'next-i18next'; import React, { useEffect, useMemo } from 'react'; import MyTooltip from '@fastgpt/web/components/common/MyTooltip'; @@ -10,12 +10,14 @@ import { form2AppWorkflow } from '@/web/core/app/utils'; import { useContextSelector } from 'use-context-selector'; import { AppContext } from '../context'; import { useChatTest } from '../useChatTest'; +import { useDatasetStore } from '@/web/core/dataset/store/dataset'; import ChatItemContextProvider, { ChatItemContext } from '@/web/core/chat/context/chatItemContext'; import ChatRecordContextProvider from '@/web/core/chat/context/chatRecordContext'; import { useChatStore } from '@/web/core/chat/context/useChatStore'; import MyBox from '@fastgpt/web/components/common/MyBox'; import { cardStyles } from '../constants'; import ChatQuoteList from '@/pageComponents/chat/ChatQuoteList'; +import VariablePopover from '@/components/core/chat/ChatContainer/ChatBox/components/VariablePopover'; type Props = { appForm: AppSimpleEditFormType; @@ -27,6 +29,8 @@ const ChatTest = ({ appForm, setRenderEdit }: Props) => { const { appDetail } = useContextSelector(AppContext, (v) => v); const quoteData = useContextSelector(ChatItemContext, (v) => v.quoteData); const setQuoteData = useContextSelector(ChatItemContext, (v) => v.setQuoteData); + // form2AppWorkflow dependent allDatasets + const isVariableVisible = useContextSelector(ChatItemContext, (v) => v.isVariableVisible); const [workflowData, setWorkflowData] = useSafeState({ nodes: appDetail.modules || [], @@ -62,10 +66,12 @@ const ChatTest = ({ appForm, setRenderEdit }: Props) => { {...cardStyles} boxShadow={'3'} > - - + + {t('app:chat_debug')} + {!isVariableVisible && } + { const quoteData = useContextSelector(ChatItemContext, (v) => v.quoteData); const setQuoteData = useContextSelector(ChatItemContext, (v) => v.setQuoteData); + const isVariableVisible = useContextSelector(ChatItemContext, (v) => v.isVariableVisible); const chatRecords = useContextSelector(ChatRecordContext, (v) => v.chatRecords); return ( @@ -115,10 +117,12 @@ const ChatTest = ({ isOpen, nodes = [], edges = [], onClose }: Props) => { bg={'myGray.25'} borderBottom={'1px solid #F4F4F7'} > - + {t('common:core.chat.Run test')} + {!isVariableVisible && } + { const appDetail = useContextSelector(AppContext, (v) => v.appDetail); - const filteredVar = useMemo(() => { - const variables = appDetail.chatConfig?.variables; - return variables?.filter((item) => item.type !== VariableInputEnum.custom) || []; + const { filteredVar, customVar, variables } = useMemo(() => { + const variables = appDetail.chatConfig?.variables || []; + return { + filteredVar: variables.filter((item) => item.type !== VariableInputEnum.custom) || [], + customVar: variables.filter((item) => item.type === VariableInputEnum.custom) || [], + variables + }; }, [appDetail.chatConfig?.variables]); const [defaultGlobalVariables, setDefaultGlobalVariables] = useState>( - filteredVar.reduce( + variables.reduce( (acc, item) => { acc[item.key] = item.defaultValue; return acc; @@ -241,7 +248,7 @@ export const useDebug = () => { px={0} > - {filteredVar.length > 0 && ( + {variables.length > 0 && ( gap={3} ml={-2} @@ -256,6 +263,14 @@ export const useDebug = () => { /> )} + {customVar.map((item) => ( + + ))} {filteredVar.map((item) => ( { ); }, [ - defaultGlobalVariables, - filteredVar, - onStartNodeDebug, - runtimeEdges, - runtimeNodeId, runtimeNodes, - t + runtimeEdges, + defaultGlobalVariables, + t, + variables.length, + customVar, + filteredVar, + runtimeNodeId, + onStartNodeDebug ]); return { diff --git a/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/nodes/NodePluginIO/InputTypeConfig.tsx b/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/nodes/NodePluginIO/InputTypeConfig.tsx index bb8367dfa..ffa5071e5 100644 --- a/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/nodes/NodePluginIO/InputTypeConfig.tsx +++ b/projects/app/src/pageComponents/app/detail/WorkflowComponents/Flow/nodes/NodePluginIO/InputTypeConfig.tsx @@ -297,8 +297,10 @@ const InputTypeConfig = ({ {t('common:core.module.Default Value')} - - {inputType === FlowNodeInputTypeEnum.numberInput && ( + + {(inputType === FlowNodeInputTypeEnum.numberInput || + (inputType === VariableInputEnum.custom && + valueType === WorkflowIOValueTypeEnum.number)) && ( )} {(inputType === FlowNodeInputTypeEnum.input || - inputType === VariableInputEnum.custom) && ( + (inputType === VariableInputEnum.custom && + valueType === WorkflowIOValueTypeEnum.string)) && ( )} - {inputType === FlowNodeInputTypeEnum.JSONEditor && ( + {(inputType === FlowNodeInputTypeEnum.JSONEditor || + (inputType === VariableInputEnum.custom && + ![ + WorkflowIOValueTypeEnum.number, + WorkflowIOValueTypeEnum.string, + WorkflowIOValueTypeEnum.boolean + ].includes(valueType))) && ( )} - {inputType === FlowNodeInputTypeEnum.switch && ( + {(inputType === FlowNodeInputTypeEnum.switch || + (inputType === VariableInputEnum.custom && + valueType === WorkflowIOValueTypeEnum.boolean)) && ( )} {inputType === FlowNodeInputTypeEnum.select && ( diff --git a/projects/app/src/pageComponents/app/detail/useChatTest.tsx b/projects/app/src/pageComponents/app/detail/useChatTest.tsx index a6602702e..222ae0c48 100644 --- a/projects/app/src/pageComponents/app/detail/useChatTest.tsx +++ b/projects/app/src/pageComponents/app/detail/useChatTest.tsx @@ -140,7 +140,7 @@ export const useChatTest = ({ appId={appId} chatId={chatId} showMarkIcon - chatType="chat" + chatType={'chat'} onStartChat={startChat} /> ) diff --git a/projects/app/src/pageComponents/chat/ChatHeader.tsx b/projects/app/src/pageComponents/chat/ChatHeader.tsx index 008c09bb5..1b5eb0b31 100644 --- a/projects/app/src/pageComponents/chat/ChatHeader.tsx +++ b/projects/app/src/pageComponents/chat/ChatHeader.tsx @@ -22,6 +22,7 @@ import { import { getMyApps } from '@/web/core/app/api'; import SelectOneResource from '@/components/common/folder/SelectOneResource'; import { ChatItemContext } from '@/web/core/chat/context/chatItemContext'; +import VariablePopover from '@/components/core/chat/ChatContainer/ChatBox/components/VariablePopover'; const ChatHeader = ({ history, @@ -38,7 +39,10 @@ const ChatHeader = ({ const { isPc } = useSystem(); const chatData = useContextSelector(ChatItemContext, (v) => v.chatBoxData); + const isVariableVisible = useContextSelector(ChatItemContext, (v) => v.isVariableVisible); const isPlugin = chatData.app.type === AppTypeEnum.plugin; + const router = useRouter(); + const isChat = router.pathname === '/chat'; return isPc && isPlugin ? null : ( )} - {/* control */} - {!isPlugin && } + + {!isVariableVisible && } + + {/* control */} + {!isPlugin && } + ); }; diff --git a/projects/app/src/web/core/chat/context/chatItemContext.tsx b/projects/app/src/web/core/chat/context/chatItemContext.tsx index 3193d7eeb..b924627c0 100644 --- a/projects/app/src/web/core/chat/context/chatItemContext.tsx +++ b/projects/app/src/web/core/chat/context/chatItemContext.tsx @@ -74,6 +74,8 @@ type ChatItemContextType = { quoteData?: QuoteDataType; setQuoteData: React.Dispatch>; + isVariableVisible: boolean; + setIsVariableVisible: React.Dispatch>; } & ContextProps; export const ChatItemContext = createContext({ @@ -97,6 +99,10 @@ export const ChatItemContext = createContext({ quoteData: undefined, setQuoteData: function (value: React.SetStateAction): void { throw new Error('Function not implemented.'); + }, + isVariableVisible: true, + setIsVariableVisible: function (value: React.SetStateAction): void { + throw new Error('Function not implemented.'); } }); @@ -116,6 +122,8 @@ const ChatItemContextProvider = ({ const ChatBoxRef = useRef(null); const variablesForm = useForm(); const [quoteData, setQuoteData] = useState(); + const [isVariableVisible, setIsVariableVisible] = useState(true); + const [chatBoxData, setChatBoxData] = useState({ ...defaultChatData }); @@ -172,7 +180,9 @@ const ChatItemContextProvider = ({ showNodeStatus, quoteData, - setQuoteData + setQuoteData, + isVariableVisible, + setIsVariableVisible }; }, [ chatBoxData, @@ -187,7 +197,9 @@ const ChatItemContextProvider = ({ // isShowFullText, showNodeStatus, quoteData, - setQuoteData + setQuoteData, + isVariableVisible, + setIsVariableVisible ]); return {children};