Skip to content

Commit

Permalink
feat: Stream the greetings of the agent dialogue infiniflow#3355 (inf…
Browse files Browse the repository at this point in the history
…iniflow#3490)

### What problem does this PR solve?

feat: Stream the greetings of the agent dialogue infiniflow#3355

### Type of change


- [x] New Feature (non-breaking change which adds functionality)
  • Loading branch information
cike8899 authored Nov 19, 2024
1 parent e4280be commit 16fbe99
Show file tree
Hide file tree
Showing 2 changed files with 17 additions and 176 deletions.
177 changes: 15 additions & 162 deletions web/src/pages/flow/chat/hooks.ts
Original file line number Diff line number Diff line change
Expand Up @@ -2,104 +2,25 @@ import { MessageType } from '@/constants/chat';
import { useFetchFlow } from '@/hooks/flow-hooks';
import {
useHandleMessageInputChange,
useScrollToBottom,
useSelectDerivedMessages,
useSendMessageWithSse,
} from '@/hooks/logic-hooks';
import { IAnswer, Message } from '@/interfaces/database/chat';
import { IMessage } from '@/pages/chat/interface';
import { Message } from '@/interfaces/database/chat';
import api from '@/utils/api';
import { buildMessageUuid } from '@/utils/chat';
import { message } from 'antd';
import trim from 'lodash/trim';
import { useCallback, useEffect, useState } from 'react';
import { useCallback, useEffect } from 'react';
import { useParams } from 'umi';
import { v4 as uuid } from 'uuid';
import { receiveMessageError } from '../utils';

const antMessage = message;

export const useSelectCurrentMessages = () => {
const { id: id } = useParams();
const [currentMessages, setCurrentMessages] = useState<IMessage[]>([]);

const { data: flowDetail, loading } = useFetchFlow();
const messages = flowDetail.dsl.messages;
const reference = flowDetail.dsl.reference;

const ref = useScrollToBottom(currentMessages);

const addNewestQuestion = useCallback(
(message: Message, answer: string = '') => {
setCurrentMessages((pre) => {
return [
...pre,
{
...message,
id: buildMessageUuid(message),
},
{
role: MessageType.Assistant,
content: answer,
id: buildMessageUuid({ ...message, role: MessageType.Assistant }),
},
];
});
},
[],
);

const addNewestAnswer = useCallback((answer: IAnswer) => {
setCurrentMessages((pre) => {
return [
...pre.slice(0, -1),
{
role: MessageType.Assistant,
content: answer.answer,
reference: answer.reference,
id: buildMessageUuid({
id: answer.id,
role: MessageType.Assistant,
}),
},
];
});
}, []);

const removeLatestMessage = useCallback(() => {
setCurrentMessages((pre) => {
const nextMessages = pre?.slice(0, -2) ?? [];
return nextMessages;
return [...pre, ...nextMessages];
});
}, []);

useEffect(() => {
if (id) {
const nextMessages = messages.map((x) => ({ ...x, id: uuid() }));
setCurrentMessages(nextMessages);
}
}, [messages, id]);

return {
currentMessages,
reference,
addNewestQuestion,
removeLatestMessage,
addNewestAnswer,
ref,
loading,
};
};

export const useSelectNextMessages = () => {
const { id: id } = useParams();
const { data: flowDetail, loading } = useFetchFlow();
const messages = flowDetail.dsl.messages;
const reference = flowDetail.dsl.reference;
const {
derivedMessages,
setDerivedMessages,
ref,
addNewestQuestion,
addNewestAnswer,
Expand All @@ -108,13 +29,6 @@ export const useSelectNextMessages = () => {
removeMessagesAfterCurrentMessage,
} = useSelectDerivedMessages();

useEffect(() => {
if (id) {
const nextMessages = messages.map((x) => ({ ...x, id: uuid() }));
setDerivedMessages(nextMessages);
}
}, [messages, id, setDerivedMessages]);

return {
reference,
loading,
Expand All @@ -128,76 +42,6 @@ export const useSelectNextMessages = () => {
};
};

export const useSendMessage = (
addNewestQuestion: (message: Message, answer?: string) => void,
removeLatestMessage: () => void,
addNewestAnswer: (answer: IAnswer) => void,
) => {
const { id: flowId } = useParams();
const { handleInputChange, value, setValue } = useHandleMessageInputChange();
const { refetch } = useFetchFlow();

const { send, answer, done } = useSendMessageWithSse(api.runCanvas);

const sendMessage = useCallback(
async (message: Message) => {
const params: Record<string, unknown> = {
id: flowId,
};
if (message.content) {
params.message = message.content;
params.message_id = message.id;
}
const res = await send(params);

if (receiveMessageError(res)) {
antMessage.error(res?.data?.message);

// cancel loading
setValue(message.content);
removeLatestMessage();
} else {
refetch(); // pull the message list after sending the message successfully
}
},
[flowId, removeLatestMessage, setValue, send, refetch],
);

const handleSendMessage = useCallback(
async (message: Message) => {
sendMessage(message);
},
[sendMessage],
);

useEffect(() => {
if (answer.answer) {
addNewestAnswer(answer);
}
}, [answer, addNewestAnswer]);

const handlePressEnter = useCallback(() => {
if (trim(value) === '') return;
const id = uuid();
if (done) {
setValue('');
handleSendMessage({ id, content: value.trim(), role: MessageType.User });
}
addNewestQuestion({
content: value,
id,
role: MessageType.User,
});
}, [addNewestQuestion, handleSendMessage, done, setValue, value]);

return {
handlePressEnter,
handleInputChange,
value,
loading: !done,
};
};

export const useSendNextMessage = () => {
const {
reference,
Expand All @@ -211,7 +55,6 @@ export const useSendNextMessage = () => {
} = useSelectNextMessages();
const { id: flowId } = useParams();
const { handleInputChange, value, setValue } = useHandleMessageInputChange();
const { refetch } = useFetchFlow();

const { send, answer, done } = useSendMessageWithSse(api.runCanvas);

Expand All @@ -232,11 +75,9 @@ export const useSendNextMessage = () => {
// cancel loading
setValue(message.content);
removeLatestMessage();
} else {
refetch(); // pull the message list after sending the message successfully
}
},
[flowId, removeLatestMessage, setValue, send, refetch],
[flowId, removeLatestMessage, setValue, send],
);

const handleSendMessage = useCallback(
Expand Down Expand Up @@ -266,6 +107,18 @@ export const useSendNextMessage = () => {
});
}, [addNewestQuestion, handleSendMessage, done, setValue, value]);

const fetchPrologue = useCallback(async () => {
// fetch prologue
const sendRet = await send({ id: flowId });
if (receiveMessageError(sendRet)) {
message.error(sendRet?.data?.message);
}
}, [flowId, send]);

useEffect(() => {
fetchPrologue();
}, [fetchPrologue]);

return {
handlePressEnter,
handleInputChange,
Expand Down
16 changes: 2 additions & 14 deletions web/src/pages/flow/hooks.tsx
Original file line number Diff line number Diff line change
Expand Up @@ -16,9 +16,8 @@ import {
ModelVariableType,
settledModelVariableMap,
} from '@/constants/knowledge';
import { useFetchModelId, useSendMessageWithSse } from '@/hooks/logic-hooks';
import { useFetchModelId } from '@/hooks/logic-hooks';
import { Variable } from '@/interfaces/database/chat';
import api from '@/utils/api';
import { useDebounceEffect } from 'ahooks';
import { FormInstance, message } from 'antd';
import { DefaultOptionType } from 'antd/es/select';
Expand Down Expand Up @@ -78,7 +77,6 @@ import {
generateNodeNamesWithIncreasingIndex,
generateSwitchHandleText,
getNodeDragHandle,
receiveMessageError,
replaceIdWithText,
} from './utils';

Expand Down Expand Up @@ -448,11 +446,8 @@ export const useGetBeginNodeDataQuery = () => {
};

export const useSaveGraphBeforeOpeningDebugDrawer = (show: () => void) => {
const { id } = useParams();
const { saveGraph, loading } = useSaveGraph();
const { resetFlow } = useResetFlow();
const { refetch } = useFetchFlow();
const { send } = useSendMessageWithSse(api.runCanvas);

const handleRun = useCallback(
async (nextNodes?: Node[]) => {
Expand All @@ -463,17 +458,10 @@ export const useSaveGraphBeforeOpeningDebugDrawer = (show: () => void) => {
// After resetting, all previous messages will be cleared.
if (resetRet?.code === 0) {
show();
// fetch prologue
const sendRet = await send({ id });
if (receiveMessageError(sendRet)) {
message.error(sendRet?.data?.message);
} else {
refetch();
}
}
}
},
[saveGraph, resetFlow, send, id, refetch, show],
[saveGraph, resetFlow, show],
);

return { handleRun, loading };
Expand Down

0 comments on commit 16fbe99

Please sign in to comment.