From 0b0570fa549ed88d9573821cefe24ca9845430e4 Mon Sep 17 00:00:00 2001 From: archer <545436317@qq.com> Date: Wed, 30 Aug 2023 14:31:15 +0800 Subject: [PATCH] perf: mark icon show --- client/src/components/ChatBox/index.tsx | 135 ++++++++++-------- .../components/AdEdit/components/ChatTest.tsx | 1 + .../app/detail/components/BasicEdit/index.tsx | 1 + .../src/pages/app/detail/components/Logs.tsx | 5 +- client/src/pages/chat/index.tsx | 1 + client/src/pages/chat/share.tsx | 1 + client/src/service/utils/chat/saveChat.ts | 20 ++- 7 files changed, 89 insertions(+), 75 deletions(-) diff --git a/client/src/components/ChatBox/index.tsx b/client/src/components/ChatBox/index.tsx index 1e8bf258483..082fca1b9a6 100644 --- a/client/src/components/ChatBox/index.tsx +++ b/client/src/components/ChatBox/index.tsx @@ -75,6 +75,12 @@ export type ComponentRef = { scrollToBottom: (behavior?: 'smooth' | 'auto') => void; }; +enum FeedbackTypeEnum { + user = 'user', + admin = 'admin', + hidden = 'hidden' +} + const VariableLabel = ({ required = false, children @@ -128,7 +134,9 @@ const ChatAvatar = ({ src, type }: { src?: string; type: 'Human' | 'AI' }) => { const ChatBox = ( { - isLogs = false, + feedbackType = FeedbackTypeEnum.hidden, + showMarkIcon = false, + showVoiceIcon = true, showEmptyIntro = false, chatId, appAvatar, @@ -139,7 +147,9 @@ const ChatBox = ( onStartChat, onDelMessage }: { - isLogs?: boolean; + feedbackType?: `${FeedbackTypeEnum}`; + showMarkIcon?: boolean; + showVoiceIcon?: boolean; showEmptyIntro?: boolean; chatId?: string; appAvatar?: string; @@ -428,7 +438,7 @@ const ChatBox = ( const controlContainerStyle = { className: 'control', color: 'myGray.400', - display: isLogs ? 'flex' : ['flex', 'none'], + display: feedbackType === FeedbackTypeEnum.admin ? 'flex' : ['flex', 'none'], pl: 1, mt: 2 }; @@ -544,7 +554,9 @@ const ChatBox = ( label: item.value, value: item.value }))} - value={getValues(item.key)} + {...register(item.key, { + required: item.required + })} onchange={(e) => { setValue(item.key, e); setRefresh(!refresh); @@ -664,7 +676,7 @@ const ChatBox = ( /> )} - {!isLogs && hasVoiceApi && ( + {showVoiceIcon && hasVoiceApi && ( )} {/* admin mark icon */} - {isLogs && ( + {showMarkIcon && ( )} - {/* user feed back icon */} - {item.dataId && - (isLogs ? ( - - - setReadFeedbackData({ - chatItemId: item.dataId || '', - content: item.userFeedback || '', - isMarked: !!item.adminFeedback - }) - } - /> - - ) : ( - + + setReadFeedbackData({ + chatItemId: item.dataId || '', + content: item.userFeedback || '', + isMarked: !!item.adminFeedback + }) } - > - { - if (!item.dataId) return; - setChatHistory((state) => - state.map((chatItem) => - chatItem.dataId === item.dataId - ? { ...chatItem, userFeedback: undefined } - : chatItem - ) - ); - try { - userUpdateChatFeedback({ chatItemId: item.dataId }); - } catch (error) {} - } + /> + + )} + {feedbackType === FeedbackTypeEnum.user && ( + + { + if (!item.dataId) return; + setChatHistory((state) => + state.map((chatItem) => + chatItem.dataId === item.dataId + ? { ...chatItem, userFeedback: undefined } + : chatItem + ) + ); + try { + userUpdateChatFeedback({ chatItemId: item.dataId }); + } catch (error) {} } - : { - _hover: { color: '#FB7C3C' }, - onClick: () => setFeedbackId(item.dataId) - })} - name={'badLight'} - /> - - ))} + } + : { + _hover: { color: '#FB7C3C' }, + onClick: () => setFeedbackId(item.dataId) + })} + name={'badLight'} + /> + + )} {/* chatting status */} {statusBoxData && index === chatHistory.length - 1 && ( @@ -796,7 +807,7 @@ const ChatBox = ( responseData={item.responseData} /> {/* admin mark content */} - {isLogs && item.adminFeedback && ( + {showMarkIcon && item.adminFeedback && ( diff --git a/client/src/pages/app/detail/components/AdEdit/components/ChatTest.tsx b/client/src/pages/app/detail/components/AdEdit/components/ChatTest.tsx index 40a22f1c294..c43691b96dd 100644 --- a/client/src/pages/app/detail/components/AdEdit/components/ChatTest.tsx +++ b/client/src/pages/app/detail/components/AdEdit/components/ChatTest.tsx @@ -113,6 +113,7 @@ const ChatTest = ( ref={ChatBoxRef} appAvatar={app.avatar} userAvatar={userInfo?.avatar} + showMarkIcon {...getSpecialModule(modules)} onStartChat={startChat} onDelMessage={() => {}} diff --git a/client/src/pages/app/detail/components/BasicEdit/index.tsx b/client/src/pages/app/detail/components/BasicEdit/index.tsx index ceb9e895d64..203ad5ae791 100644 --- a/client/src/pages/app/detail/components/BasicEdit/index.tsx +++ b/client/src/pages/app/detail/components/BasicEdit/index.tsx @@ -639,6 +639,7 @@ const ChatTest = ({ appId }: { appId: string }) => { ref={ChatBoxRef} appAvatar={appDetail.avatar} userAvatar={userInfo?.avatar} + showMarkIcon {...getSpecialModule(modules)} onStartChat={startChat} onDelMessage={() => {}} diff --git a/client/src/pages/app/detail/components/Logs.tsx b/client/src/pages/app/detail/components/Logs.tsx index 63682a84469..41acfc5df37 100644 --- a/client/src/pages/app/detail/components/Logs.tsx +++ b/client/src/pages/app/detail/components/Logs.tsx @@ -287,13 +287,14 @@ function DetailLogsModal({ {}} /> diff --git a/client/src/pages/chat/index.tsx b/client/src/pages/chat/index.tsx index ae42e5f1501..5a9d06e8a52 100644 --- a/client/src/pages/chat/index.tsx +++ b/client/src/pages/chat/index.tsx @@ -362,6 +362,7 @@ const Chat = ({ appId, chatId }: { appId: string; chatId: string }) => { appAvatar={chatData.app.avatar} userAvatar={userInfo?.avatar} variableModules={chatData.app.variableModules} + feedbackType={'user'} welcomeText={chatData.app.welcomeText} onUpdateVariable={(e) => {}} onStartChat={startChat} diff --git a/client/src/pages/chat/share.tsx b/client/src/pages/chat/share.tsx index 1cc7401ec89..d1d5c2bd876 100644 --- a/client/src/pages/chat/share.tsx +++ b/client/src/pages/chat/share.tsx @@ -226,6 +226,7 @@ const OutLink = ({ shareId, chatId }: { shareId: string; chatId: string }) => { userAvatar={shareChatData.userAvatar} variableModules={shareChatData.app.variableModules} welcomeText={shareChatData.app.welcomeText} + feedbackType={'user'} onUpdateVariable={(e) => { setShareChatData((state) => ({ ...state, diff --git a/client/src/service/utils/chat/saveChat.ts b/client/src/service/utils/chat/saveChat.ts index 6b3d8b7e855..6394a51df3c 100644 --- a/client/src/service/utils/chat/saveChat.ts +++ b/client/src/service/utils/chat/saveChat.ts @@ -55,17 +55,15 @@ export async function saveChat({ ]); } else { promise.push( - ...[ - Chat.create({ - chatId, - userId, - appId, - variables, - title: content[0].value.slice(0, 20), - source, - shareId - }) - ] + Chat.create({ + chatId, + userId, + appId, + variables, + title: content[0].value.slice(0, 20), + source, + shareId + }) ); }