refactor: migrate chat lock state to useFlowStore (#6166)

* 🔧 (frontend): remove unused lockChat and setLockChat props from ChatViewWrapper and ChatView components
♻️ (frontend): refactor ChatMessage component to use useFlowStore for lockChat state management instead of passing it as a prop

* 🔧 (chat-message.tsx): Remove unused variables setLockChat and lockChat
♻️ (chat-message.tsx): Refactor code to use isBuilding state instead of setLockChat and lockChat variables
♻️ (new-modal.tsx): Refactor code to remove setLockChat function and references
♻️ (flowStore.ts): Refactor code to remove setLockChat function and lockChat variable
♻️ (components/index.ts): Refactor code to remove setLockChat function and lockChat variable
♻️ (flow/index.ts): Refactor code to remove setLockChat function and lockChat variable
♻️ (buildUtils.ts): Refactor code to remove setLockChat function and references

* ♻️ (chat-view.tsx): refactor variable name 'lockChat' to 'isBuilding' for better clarity and semantics in the code.

* 🔧 (chat-view.tsx, chat-input.tsx, button-send-wrapper.tsx, text-area-wrapper.tsx, upload-file-button.tsx, use-focus-unlock.ts, use-upload.ts, chat-message.tsx, index.ts): Remove lockChat variable and replace it with isBuilding variable to improve code readability and consistency.

* ♻️ (button-send-wrapper.tsx): remove unnecessary disabled prop from Button component to improve code readability and maintainability
This commit is contained in:
Cristhian Zanforlin Lousa 2025-02-11 13:39:56 -03:00 • committed by GitHub
commit e1e9d7baef
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
15 changed files with 37 additions and 111 deletions

View file

@ -19,8 +19,6 @@ export const ChatViewWrapper = ({
messagesFetched, messagesFetched,
sessionId, sessionId,
sendMessage, sendMessage,
lockChat,
setLockChat,
canvasOpen, canvasOpen,
setOpen, setOpen,
}: ChatViewWrapperProps) => { }: ChatViewWrapperProps) => {
@ -93,8 +91,6 @@ export const ChatViewWrapper = ({
<ChatView <ChatView
focusChat={sessionId} focusChat={sessionId}
sendMessage={sendMessage} sendMessage={sendMessage}
lockChat={lockChat}
setLockChat={setLockChat}
visibleSession={visibleSession} visibleSession={visibleSession}
closeChat={ closeChat={
!canvasOpen !canvasOpen

View file

@ -30,8 +30,6 @@ const MemoizedChatMessage = memo(ChatMessage, (prevProps, nextProps) => {
export default function ChatView({ export default function ChatView({
sendMessage, sendMessage,
lockChat,
setLockChat,
visibleSession, visibleSession,
focusChat, focusChat,
closeChat, closeChat,
@ -51,6 +49,8 @@ export default function ChatView({
(state) => state.displayLoadingMessage, (state) => state.displayLoadingMessage,
); );
const isBuilding = useFlowStore((state) => state.isBuilding);
const inputTypes = inputs.map((obj) => obj.type); const inputTypes = inputs.map((obj) => obj.type);
const updateFlowPool = useFlowStore((state) => state.updateFlowPool); const updateFlowPool = useFlowStore((state) => state.updateFlowPool);
const setChatValueStore = useUtilityStore((state) => state.setChatValueStore); const setChatValueStore = useUtilityStore((state) => state.setChatValueStore);
@ -99,7 +99,7 @@ export default function ChatView({
return new Date(a.timestamp).getTime() - new Date(b.timestamp).getTime(); return new Date(a.timestamp).getTime() - new Date(b.timestamp).getTime();
}); });
if (messages.length === 0 && !lockChat && chatInputNode && isTabHidden) { if (messages.length === 0 && !isBuilding && chatInputNode && isTabHidden) {
setChatValueStore( setChatValueStore(
chatInputNode.data.node.template["input_value"].value ?? "", chatInputNode.data.node.template["input_value"].value ?? "",
); );
@ -164,12 +164,10 @@ export default function ChatView({
> >
<div ref={messagesRef} className="chat-message-div"> <div ref={messagesRef} className="chat-message-div">
{chatHistory && {chatHistory &&
(lockChat || chatHistory?.length > 0 ? ( (isBuilding || chatHistory?.length > 0 ? (
<> <>
{chatHistory?.map((chat, index) => ( {chatHistory?.map((chat, index) => (
<MemoizedChatMessage <MemoizedChatMessage
setLockChat={setLockChat}
lockChat={lockChat}
chat={chat} chat={chat}
lastMessage={chatHistory.length - 1 === index} lastMessage={chatHistory.length - 1 === index}
key={`${chat.id}-${index}`} key={`${chat.id}-${index}`}
@ -224,7 +222,6 @@ export default function ChatView({
<div className="m-auto w-full max-w-[768px] md:w-5/6"> <div className="m-auto w-full max-w-[768px] md:w-5/6">
<ChatInput <ChatInput
noInput={!inputTypes.includes("ChatInput")} noInput={!inputTypes.includes("ChatInput")}
lockChat={lockChat}
sendMessage={({ repeat, files }) => { sendMessage={({ repeat, files }) => {
sendMessage({ repeat, files }); sendMessage({ repeat, files });
track("Playground Message Sent"); track("Playground Message Sent");

View file

@ -26,7 +26,6 @@ import UploadFileButton from "./components/upload-file-button";
import useAutoResizeTextArea from "./hooks/use-auto-resize-text-area"; import useAutoResizeTextArea from "./hooks/use-auto-resize-text-area";
import useFocusOnUnlock from "./hooks/use-focus-unlock"; import useFocusOnUnlock from "./hooks/use-focus-unlock";
export default function ChatInput({ export default function ChatInput({
lockChat,
sendMessage, sendMessage,
inputRef, inputRef,
noInput, noInput,
@ -39,10 +38,10 @@ export default function ChatInput({
const setErrorData = useAlertStore((state) => state.setErrorData); const setErrorData = useAlertStore((state) => state.setErrorData);
const { validateFileSize } = useFileSizeValidator(setErrorData); const { validateFileSize } = useFileSizeValidator(setErrorData);
const stopBuilding = useFlowStore((state) => state.stopBuilding); const stopBuilding = useFlowStore((state) => state.stopBuilding);
const isBuilding = useFlowStore((state) => state.isBuilding);
const chatValue = useUtilityStore((state) => state.chatValueStore); const chatValue = useUtilityStore((state) => state.chatValueStore);
useFocusOnUnlock(lockChat, inputRef); useFocusOnUnlock(isBuilding, inputRef);
useAutoResizeTextArea(chatValue, inputRef); useAutoResizeTextArea(chatValue, inputRef);
const { mutate } = usePostUploadFile(); const { mutate } = usePostUploadFile();
@ -134,7 +133,7 @@ export default function ChatInput({
return () => { return () => {
document.removeEventListener("paste", handleFileChange); document.removeEventListener("paste", handleFileChange);
}; };
}, [handleFileChange, currentFlowId, lockChat]); }, [handleFileChange, currentFlowId, isBuilding]);
const send = () => { const send = () => {
sendMessage({ sendMessage({
@ -147,7 +146,7 @@ export default function ChatInput({
const checkSendingOk = (event: React.KeyboardEvent<HTMLTextAreaElement>) => { const checkSendingOk = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {
return ( return (
event.key === "Enter" && event.key === "Enter" &&
!lockChat && !isBuilding &&
!event.shiftKey && !event.shiftKey &&
!event.nativeEvent.isComposing !event.nativeEvent.isComposing
); );
@ -168,7 +167,7 @@ export default function ChatInput({
return ( return (
<div className="flex h-full w-full flex-col items-center justify-center"> <div className="flex h-full w-full flex-col items-center justify-center">
<div className="flex w-full flex-col items-center justify-center gap-3 rounded-md border border-input bg-muted p-2 py-4"> <div className="flex w-full flex-col items-center justify-center gap-3 rounded-md border border-input bg-muted p-2 py-4">
{!lockChat ? ( {!isBuilding ? (
<Button <Button
data-testid="button-send" data-testid="button-send"
className="font-semibold" className="font-semibold"
@ -214,9 +213,9 @@ export default function ChatInput({
<div className="flex w-full flex-col-reverse"> <div className="flex w-full flex-col-reverse">
<div className="flex w-full flex-col rounded-md border border-input p-4 hover:border-muted-foreground focus:border-[1.75px] has-[:focus]:border-primary"> <div className="flex w-full flex-col rounded-md border border-input p-4 hover:border-muted-foreground focus:border-[1.75px] has-[:focus]:border-primary">
<TextAreaWrapper <TextAreaWrapper
isBuilding={isBuilding}
checkSendingOk={checkSendingOk} checkSendingOk={checkSendingOk}
send={send} send={send}
lockChat={lockChat}
noInput={noInput} noInput={noInput}
chatValue={chatValue} chatValue={chatValue}
CHAT_INPUT_PLACEHOLDER={CHAT_INPUT_PLACEHOLDER} CHAT_INPUT_PLACEHOLDER={CHAT_INPUT_PLACEHOLDER}
@ -239,9 +238,9 @@ export default function ChatInput({
))} ))}
</div> </div>
<div className="flex w-full items-end justify-between"> <div className="flex w-full items-end justify-between">
<div className={lockChat ? "cursor-not-allowed" : ""}> <div className={isBuilding ? "cursor-not-allowed" : ""}>
<UploadFileButton <UploadFileButton
lockChat={lockChat} isBuilding={isBuilding}
fileInputRef={fileInputRef} fileInputRef={fileInputRef}
handleFileChange={handleFileChange} handleFileChange={handleFileChange}
handleButtonClick={handleButtonClick} handleButtonClick={handleButtonClick}
@ -250,7 +249,6 @@ export default function ChatInput({
<div className=""> <div className="">
<ButtonSendWrapper <ButtonSendWrapper
send={send} send={send}
lockChat={lockChat}
noInput={noInput} noInput={noInput}
chatValue={chatValue} chatValue={chatValue}
files={files} files={files}

View file

@ -16,7 +16,6 @@ const BUTTON_STATES = {
type ButtonSendWrapperProps = { type ButtonSendWrapperProps = {
send: () => void; send: () => void;
lockChat: boolean;
noInput: boolean; noInput: boolean;
chatValue: string; chatValue: string;
files: FilePreviewType[]; files: FilePreviewType[];
@ -24,7 +23,6 @@ type ButtonSendWrapperProps = {
const ButtonSendWrapper = ({ const ButtonSendWrapper = ({
send, send,
lockChat,
noInput, noInput,
chatValue, chatValue,
files, files,
@ -32,10 +30,9 @@ const ButtonSendWrapper = ({
const stopBuilding = useFlowStore((state) => state.stopBuilding); const stopBuilding = useFlowStore((state) => state.stopBuilding);
const isBuilding = useFlowStore((state) => state.isBuilding); const isBuilding = useFlowStore((state) => state.isBuilding);
const showStopButton = lockChat || files.some((file) => file.loading); const showStopButton = isBuilding || files.some((file) => file.loading);
const showPlayButton = !lockChat && noInput;
const showSendButton = const showSendButton =
!(lockChat || files.some((file) => file.loading)) && !noInput; !(isBuilding || files.some((file) => file.loading)) && !noInput;
const getButtonState = () => { const getButtonState = () => {
if (showStopButton) return BUTTON_STATES.SHOW_STOP; if (showStopButton) return BUTTON_STATES.SHOW_STOP;
@ -58,7 +55,6 @@ const ButtonSendWrapper = ({
return ( return (
<Button <Button
className={buttonClasses} className={buttonClasses}
disabled={lockChat && !isBuilding}
onClick={handleClick} onClick={handleClick}
unstyled unstyled
data-testid={showStopButton ? "button-stop" : "button-send"} data-testid={showStopButton ? "button-stop" : "button-send"}

View file

@ -6,7 +6,7 @@ import { classNames } from "../../../../../../utils/utils";
const TextAreaWrapper = ({ const TextAreaWrapper = ({
checkSendingOk, checkSendingOk,
send, send,
lockChat, isBuilding,
noInput, noInput,
chatValue, chatValue,
CHAT_INPUT_PLACEHOLDER, CHAT_INPUT_PLACEHOLDER,
@ -36,10 +36,10 @@ const TextAreaWrapper = ({
"form-input block w-full border-0 custom-scroll focus:border-ring rounded-none shadow-none focus:ring-0 p-0 sm:text-sm !bg-transparent"; "form-input block w-full border-0 custom-scroll focus:border-ring rounded-none shadow-none focus:ring-0 p-0 sm:text-sm !bg-transparent";
useEffect(() => { useEffect(() => {
if (!lockChat && !noInput) { if (!isBuilding && !noInput) {
inputRef.current?.focus(); inputRef.current?.focus();
} }
}, [lockChat, noInput]); }, [isBuilding, noInput]);
return ( return (
<Textarea <Textarea
@ -51,7 +51,7 @@ const TextAreaWrapper = ({
}} }}
rows={1} rows={1}
ref={inputRef} ref={inputRef}
disabled={lockChat || noInput} disabled={isBuilding || noInput}
style={{ style={{
resize: "none", resize: "none",
bottom: `${inputRef?.current?.scrollHeight}px`, bottom: `${inputRef?.current?.scrollHeight}px`,

View file

@ -6,7 +6,7 @@ const UploadFileButton = ({
fileInputRef, fileInputRef,
handleFileChange, handleFileChange,
handleButtonClick, handleButtonClick,
lockChat, isBuilding,
}) => { }) => {
return ( return (
<ShadTooltip <ShadTooltip
@ -16,16 +16,16 @@ const UploadFileButton = ({
> >
<div> <div>
<input <input
disabled={lockChat} disabled={isBuilding}
type="file" type="file"
ref={fileInputRef} ref={fileInputRef}
style={{ display: "none" }} style={{ display: "none" }}
onChange={handleFileChange} onChange={handleFileChange}
/> />
<Button <Button
disabled={lockChat} disabled={isBuilding}
className={`flex h-[32px] w-[32px] items-center justify-center rounded-md bg-muted font-bold transition-all ${ className={`flex h-[32px] w-[32px] items-center justify-center rounded-md bg-muted font-bold transition-all ${
lockChat isBuilding
? "cursor-not-allowed" ? "cursor-not-allowed"
: "text-muted-foreground hover:text-primary" : "text-muted-foreground hover:text-primary"
}`} }`}

View file

@ -1,14 +1,14 @@
import { useEffect } from "react"; import { useEffect } from "react";
const useFocusOnUnlock = ( const useFocusOnUnlock = (
lockChat: boolean, isBuilding: boolean,
inputRef: React.RefObject<HTMLInputElement>, inputRef: React.RefObject<HTMLInputElement>,
) => { ) => {
useEffect(() => { useEffect(() => {
if (!lockChat && inputRef.current) { if (!isBuilding && inputRef.current) {
inputRef.current.focus(); inputRef.current.focus();
} }
}, [lockChat, inputRef]); }, [isBuilding, inputRef]);
return inputRef; return inputRef;
}; };

View file

@ -1,3 +1,4 @@
import useFlowStore from "@/stores/flowStore";
import { AxiosResponse } from "axios"; import { AxiosResponse } from "axios";
import { useEffect } from "react"; import { useEffect } from "react";
import ShortUniqueId from "short-unique-id"; import ShortUniqueId from "short-unique-id";
@ -16,12 +17,12 @@ const useUpload = (
) => Promise<AxiosResponse<UploadFileTypeAPI>>, ) => Promise<AxiosResponse<UploadFileTypeAPI>>,
currentFlowId: string, currentFlowId: string,
setFiles: any, setFiles: any,
lockChat: boolean,
) => { ) => {
const setErrorData = useAlertStore((state) => state.setErrorData); const setErrorData = useAlertStore((state) => state.setErrorData);
const isBuilding = useFlowStore((state) => state.isBuilding);
useEffect(() => { useEffect(() => {
const handlePaste = (event: ClipboardEvent): void => { const handlePaste = (event: ClipboardEvent): void => {
if (lockChat) { if (isBuilding) {
return; return;
} }
const items = event.clipboardData?.items; const items = event.clipboardData?.items;
@ -57,7 +58,7 @@ const useUpload = (
return () => { return () => {
document.removeEventListener("paste", handlePaste); document.removeEventListener("paste", handlePaste);
}; };
}, [uploadFile, currentFlowId, lockChat]); }, [uploadFile, currentFlowId, isBuilding]);
return null; return null;
}; };

View file

@ -6,6 +6,7 @@ import { ENABLE_DATASTAX_LANGFLOW } from "@/customization/feature-flags";
import useFlowsManagerStore from "@/stores/flowsManagerStore"; import useFlowsManagerStore from "@/stores/flowsManagerStore";
import useFlowStore from "@/stores/flowStore"; import useFlowStore from "@/stores/flowStore";
import { useUtilityStore } from "@/stores/utilityStore"; import { useUtilityStore } from "@/stores/utilityStore";
import { ChatMessageType } from "@/types/chat";
import Convert from "ansi-to-html"; import Convert from "ansi-to-html";
import { useEffect, useRef, useState } from "react"; import { useEffect, useRef, useState } from "react";
import Robot from "../../../../../assets/robot.png"; import Robot from "../../../../../assets/robot.png";
@ -27,10 +28,8 @@ import { convertFiles } from "./helpers/convert-files";
export default function ChatMessage({ export default function ChatMessage({
chat, chat,
lockChat,
lastMessage, lastMessage,
updateChat, updateChat,
setLockChat,
closeChat, closeChat,
}: chatMessagePropsType): JSX.Element { }: chatMessagePropsType): JSX.Element {
const convert = new Convert({ newline: true }); const convert = new Convert({ newline: true });
@ -49,11 +48,13 @@ export default function ChatMessage({
const chatMessageRef = useRef(chatMessage); const chatMessageRef = useRef(chatMessage);
const [editMessage, setEditMessage] = useState(false); const [editMessage, setEditMessage] = useState(false);
const [showError, setShowError] = useState(false); const [showError, setShowError] = useState(false);
const isBuilding = useFlowStore((state) => state.isBuilding);
useEffect(() => { useEffect(() => {
const chatMessageString = chat.message ? chat.message.toString() : ""; const chatMessageString = chat.message ? chat.message.toString() : "";
setChatMessage(chatMessageString); setChatMessage(chatMessageString);
}, [chat]); chatMessageRef.current = chatMessage;
}, [chat, isBuilding]);
const playgroundScrollBehaves = useUtilityStore( const playgroundScrollBehaves = useUtilityStore(
(state) => state.playgroundScrollBehaves, (state) => state.playgroundScrollBehaves,
@ -61,10 +62,6 @@ export default function ChatMessage({
const setPlaygroundScrollBehaves = useUtilityStore( const setPlaygroundScrollBehaves = useUtilityStore(
(state) => state.setPlaygroundScrollBehaves, (state) => state.setPlaygroundScrollBehaves,
); );
// Sync ref with state
useEffect(() => {
chatMessageRef.current = chatMessage;
}, [chatMessage]);
// The idea now is that chat.stream_url MAY be a URL if we should stream the output of the chat // The idea now is that chat.stream_url MAY be a URL if we should stream the output of the chat
// probably the message is empty when we have a stream_url // probably the message is empty when we have a stream_url
@ -103,21 +100,17 @@ export default function ChatMessage({
useEffect(() => { useEffect(() => {
if (streamUrl && !isStreaming) { if (streamUrl && !isStreaming) {
setLockChat(true);
streamChunks(streamUrl) streamChunks(streamUrl)
.then(() => { .then(() => {
setLockChat(false);
if (updateChat) { if (updateChat) {
updateChat(chat, chatMessageRef.current); updateChat(chat, chatMessageRef.current);
} }
}) })
.catch((error) => { .catch((error) => {
console.error(error); console.error(error);
setLockChat(false);
}); });
} }
}, [streamUrl, chatMessage]); }, [streamUrl, chatMessage]);
useEffect(() => { useEffect(() => {
return () => { return () => {
eventSource.current?.close(); eventSource.current?.close();
@ -320,7 +313,7 @@ export default function ChatMessage({
contentBlocks={chat.content_blocks} contentBlocks={chat.content_blocks}
isLoading={ isLoading={
chatMessage === "" && chatMessage === "" &&
lockChat && isBuilding &&
chat.properties?.state === "partial" chat.properties?.state === "partial"
} }
state={chat.properties?.state} state={chat.properties?.state}
@ -360,7 +353,7 @@ export default function ChatMessage({
} }
className="flex w-full flex-col" className="flex w-full flex-col"
> >
{chatMessage === "" && lockChat ? ( {chatMessage === "" && isBuilding && lastMessage ? (
<IconComponent <IconComponent
name="MoreHorizontal" name="MoreHorizontal"
className="h-8 w-8 animate-pulse" className="h-8 w-8 animate-pulse"

View file

@ -113,8 +113,7 @@ export default function IOModal({
const buildFlow = useFlowStore((state) => state.buildFlow); const buildFlow = useFlowStore((state) => state.buildFlow);
const setIsBuilding = useFlowStore((state) => state.setIsBuilding); const setIsBuilding = useFlowStore((state) => state.setIsBuilding);
const lockChat = useFlowStore((state) => state.lockChat);
const setLockChat = useFlowStore((state) => state.setLockChat);
const isBuilding = useFlowStore((state) => state.isBuilding); const isBuilding = useFlowStore((state) => state.isBuilding);
const messages = useMessagesStore((state) => state.messages); const messages = useMessagesStore((state) => state.messages);
const [sessions, setSessions] = useState<string[]>( const [sessions, setSessions] = useState<string[]>(
@ -147,8 +146,6 @@ export default function IOModal({
files?: string[]; files?: string[];
}): Promise<void> => { }): Promise<void> => {
if (isBuilding) return; if (isBuilding) return;
setIsBuilding(true);
setLockChat(true);
setChatValue(""); setChatValue("");
for (let i = 0; i < repeat; i++) { for (let i = 0; i < repeat; i++) {
await buildFlow({ await buildFlow({
@ -157,24 +154,12 @@ export default function IOModal({
files: files, files: files,
silent: true, silent: true,
session: sessionId, session: sessionId,
setLockChat,
}).catch((err) => { }).catch((err) => {
console.error(err); console.error(err);
setLockChat(false);
}); });
} }
// refetch();
setLockChat(false);
}, },
[ [isBuilding, setIsBuilding, chatValue, chatInput?.id, sessionId, buildFlow],
isBuilding,
setIsBuilding,
setLockChat,
chatValue,
chatInput?.id,
sessionId,
buildFlow,
],
); );
useEffect(() => { useEffect(() => {
@ -331,8 +316,6 @@ export default function IOModal({
messagesFetched={messagesFetched} messagesFetched={messagesFetched}
sessionId={sessionId} sessionId={sessionId}
sendMessage={sendMessage} sendMessage={sendMessage}
lockChat={lockChat}
setLockChat={setLockChat}
canvasOpen={canvasOpen} canvasOpen={canvasOpen}
setOpen={setOpen} setOpen={setOpen}
/> />

View file

@ -14,8 +14,6 @@ export type ChatViewWrapperProps = {
messagesFetched: boolean; messagesFetched: boolean;
sessionId: string; sessionId: string;
sendMessage: (options: { repeat: number; files?: string[] }) => Promise<void>; sendMessage: (options: { repeat: number; files?: string[] }) => Promise<void>;
lockChat: boolean;
setLockChat: (locked: boolean) => void;
canvasOpen: boolean | undefined; canvasOpen: boolean | undefined;
setOpen: (open: boolean) => void; setOpen: (open: boolean) => void;
}; };

View file

@ -49,7 +49,6 @@ import useAlertStore from "./alertStore";
import { useDarkStore } from "./darkStore"; import { useDarkStore } from "./darkStore";
import useFlowsManagerStore from "./flowsManagerStore"; import useFlowsManagerStore from "./flowsManagerStore";
import { useGlobalVariablesStore } from "./globalVariablesStore/globalVariables"; import { useGlobalVariablesStore } from "./globalVariablesStore/globalVariables";
import { useMessagesStore } from "./messagesStore";
import { useTypesStore } from "./typesStore"; import { useTypesStore } from "./typesStore";
// this is our useStore hook that we can use in our components to get parts of the store and call actions // this is our useStore hook that we can use in our components to get parts of the store and call actions
@ -101,11 +100,6 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
set({ componentsToUpdate: outdatedNodes }); set({ componentsToUpdate: outdatedNodes });
}, },
onFlowPage: false, onFlowPage: false,
lockChat: false,
setLockChat: (lockChat) => {
useMessagesStore.setState({ displayLoadingMessage: lockChat });
set({ lockChat });
},
setOnFlowPage: (FlowPage) => set({ onFlowPage: FlowPage }), setOnFlowPage: (FlowPage) => set({ onFlowPage: FlowPage }),
flowState: undefined, flowState: undefined,
flowBuildStatus: {}, flowBuildStatus: {},
@ -120,7 +114,6 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
); );
set({ isBuilding: false }); set({ isBuilding: false });
get().revertBuiltStatusFromBuilding(); get().revertBuiltStatusFromBuilding();
get().setLockChat(false);
useAlertStore.getState().setErrorData({ useAlertStore.getState().setErrorData({
title: "Build stopped", title: "Build stopped",
}); });
@ -595,7 +588,6 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
input_value, input_value,
files, files,
silent, silent,
setLockChat,
session, session,
}: { }: {
startNodeId?: string; startNodeId?: string;
@ -603,11 +595,9 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
input_value?: string; input_value?: string;
files?: string[]; files?: string[];
silent?: boolean; silent?: boolean;
setLockChat?: (lock: boolean) => void;
session?: string; session?: string;
}) => { }) => {
get().setIsBuilding(true); get().setIsBuilding(true);
get().setLockChat(true);
const currentFlow = useFlowsManagerStore.getState().currentFlow; const currentFlow = useFlowsManagerStore.getState().currentFlow;
const setSuccessData = useAlertStore.getState().setSuccessData; const setSuccessData = useAlertStore.getState().setSuccessData;
const setErrorData = useAlertStore.getState().setErrorData; const setErrorData = useAlertStore.getState().setErrorData;
@ -627,7 +617,6 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
} }
if (error) { if (error) {
get().setIsBuilding(false); get().setIsBuilding(false);
get().setLockChat(false);
throw new Error("Invalid components"); throw new Error("Invalid components");
} }
@ -734,7 +723,6 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
flowId: currentFlow!.id, flowId: currentFlow!.id,
startNodeId, startNodeId,
stopNodeId, stopNodeId,
setLockChat,
onGetOrderSuccess: () => { onGetOrderSuccess: () => {
if (!silent) { if (!silent) {
setNoticeData({ title: "Running components" }); setNoticeData({ title: "Running components" });
@ -759,7 +747,6 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
false, false,
); );
get().setIsBuilding(false); get().setIsBuilding(false);
get().setLockChat(false);
}, },
onBuildUpdate: handleBuildUpdate, onBuildUpdate: handleBuildUpdate,
onBuildError: (title: string, list: string[], elementList) => { onBuildError: (title: string, list: string[], elementList) => {
@ -779,7 +766,6 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
); );
setErrorData({ list, title }); setErrorData({ list, title });
get().setIsBuilding(false); get().setIsBuilding(false);
get().setLockChat(false);
get().buildController.abort(); get().buildController.abort();
}, },
onBuildStart: (elementList) => { onBuildStart: (elementList) => {
@ -807,7 +793,6 @@ const useFlowStore = create<FlowStoreType>((set, get) => ({
logBuilds: get().onFlowPage, logBuilds: get().onFlowPage,
}); });
get().setIsBuilding(false); get().setIsBuilding(false);
get().setLockChat(false);
get().revertBuiltStatusFromBuilding(); get().revertBuiltStatusFromBuilding();
}, },
getFlow: () => { getFlow: () => {

View file

@ -505,7 +505,6 @@ export type ChatInputType = {
inputRef: { inputRef: {
current: any; current: any;
}; };
lockChat: boolean;
noInput: boolean; noInput: boolean;
sendMessage: ({ sendMessage: ({
repeat, repeat,
@ -593,9 +592,7 @@ export type codeAreaModalPropsType = {
export type chatMessagePropsType = { export type chatMessagePropsType = {
chat: ChatMessageType; chat: ChatMessageType;
lockChat: boolean;
lastMessage: boolean; lastMessage: boolean;
setLockChat: (lock: boolean) => void;
updateChat: ( updateChat: (
chat: ChatMessageType, chat: ChatMessageType,
message: string, message: string,
@ -772,8 +769,6 @@ export type chatViewProps = {
repeat: number; repeat: number;
files?: string[]; files?: string[];
}) => void; }) => void;
lockChat: boolean;
setLockChat: (lock: boolean) => void;
visibleSession?: string; visibleSession?: string;
focusChat?: string; focusChat?: string;
closeChat?: () => void; closeChat?: () => void;
@ -794,15 +789,11 @@ export type toolbarSelectItemProps = {
}; };
export type clearChatPropsType = { export type clearChatPropsType = {
lockChat: boolean;
setLockChat: (lock: boolean) => void;
setChatHistory: (chatHistory: ChatMessageType) => void; setChatHistory: (chatHistory: ChatMessageType) => void;
method: string; method: string;
}; };
export type handleSelectPropsType = { export type handleSelectPropsType = {
event: string; event: string;
lockChat: boolean;
setLockChat: (lock: boolean) => void;
setChatHistory: (chatHistory: ChatMessageType) => void; setChatHistory: (chatHistory: ChatMessageType) => void;
}; };

View file

@ -145,10 +145,8 @@ export type FlowStoreType = {
input_value, input_value,
files, files,
silent, silent,
setLockChat,
session, session,
}: { }: {
setLockChat?: (lock: boolean) => void;
startNodeId?: string; startNodeId?: string;
stopNodeId?: string; stopNodeId?: string;
input_value?: string; input_value?: string;
@ -184,8 +182,6 @@ export type FlowStoreType = {
buildId?: string, buildId?: string,
) => void; ) => void;
getNodePosition: (nodeId: string) => { x: number; y: number }; getNodePosition: (nodeId: string) => { x: number; y: number };
setLockChat: (lock: boolean) => void;
lockChat: boolean;
updateFreezeStatus: (nodeIds: string[], freeze: boolean) => void; updateFreezeStatus: (nodeIds: string[], freeze: boolean) => void;
currentFlow: FlowType | undefined; currentFlow: FlowType | undefined;
setCurrentFlow: (flow: FlowType | undefined) => void; setCurrentFlow: (flow: FlowType | undefined) => void;

View file

@ -14,7 +14,6 @@ import { VertexLayerElementType } from "../types/zustand/flow";
import { isStringArray, tryParseJson } from "./utils"; import { isStringArray, tryParseJson } from "./utils";
type BuildVerticesParams = { type BuildVerticesParams = {
setLockChat?: (lock: boolean) => void;
flowId: string; // Assuming FlowType is the type for your flow flowId: string; // Assuming FlowType is the type for your flow
input_value?: any; // Replace any with the actual type if it's not any input_value?: any; // Replace any with the actual type if it's not any
files?: string[]; files?: string[];
@ -66,7 +65,6 @@ function getInactiveVertexData(vertexId: string): VertexBuildTypeAPI {
export async function updateVerticesOrder( export async function updateVerticesOrder(
flowId: string, flowId: string,
setLockChat?: (lock: boolean) => void,
startNodeId?: string | null, startNodeId?: string | null,
stopNodeId?: string | null, stopNodeId?: string | null,
nodes?: Node[], nodes?: Node[],
@ -94,7 +92,6 @@ export async function updateVerticesOrder(
list: [error.response?.data?.detail ?? "Unknown Error"], list: [error.response?.data?.detail ?? "Unknown Error"],
}); });
useFlowStore.getState().setIsBuilding(false); useFlowStore.getState().setIsBuilding(false);
setLockChat && setLockChat(false);
throw new Error("Invalid components"); throw new Error("Invalid components");
} }
// orderResponse.data.ids, // orderResponse.data.ids,
@ -154,7 +151,6 @@ export async function buildFlowVertices({
nodes, nodes,
edges, edges,
logBuilds, logBuilds,
setLockChat,
session, session,
}: BuildVerticesParams) { }: BuildVerticesParams) {
const inputs = {}; const inputs = {};
@ -226,7 +222,6 @@ export async function buildFlowVertices({
return true; return true;
} catch (e) { } catch (e) {
useFlowStore.getState().setIsBuilding(false); useFlowStore.getState().setIsBuilding(false);
setLockChat && setLockChat(false);
return false; return false;
} }
} }
@ -381,7 +376,6 @@ export async function buildVertices({
onValidateNodes, onValidateNodes,
nodes, nodes,
edges, edges,
setLockChat,
}: BuildVerticesParams) { }: BuildVerticesParams) {
// if startNodeId and stopNodeId are provided // if startNodeId and stopNodeId are provided
// something is wrong // something is wrong
@ -390,7 +384,6 @@ export async function buildVertices({
} }
let verticesOrderResponse = await updateVerticesOrder( let verticesOrderResponse = await updateVerticesOrder(
flowId, flowId,
setLockChat,
startNodeId, startNodeId,
stopNodeId, stopNodeId,
nodes, nodes,
@ -401,7 +394,6 @@ export async function buildVertices({
onValidateNodes(verticesOrderResponse.verticesToRun); onValidateNodes(verticesOrderResponse.verticesToRun);
} catch (e) { } catch (e) {
useFlowStore.getState().setIsBuilding(false); useFlowStore.getState().setIsBuilding(false);
setLockChat && setLockChat(false);
return; return;
} }
} }