jyapayne/langflow
1
0
Fork 0
Code Issues Pull requests Projects Releases 1 Packages Wiki Activity Actions

🐛 fix(formModal): fix keysValue state initialization to prevent undefined error

Browse source 
✨ feat(formModal): add support for memory_keys in input variables accordion to display memory keys in chat form modal
This commit is contained in:
Lucas Oliveira 2023-06-27 20:58:01 -03:00
commit 8c721b0b8e
1 changed files with 123 additions and 101 deletions
Download patch file Download diff file Expand all files Collapse all files

34
src/frontend/src/modals/formModal/index.tsx
View file

@ -5,7 +5,16 @@ import { alertContext } from "../../contexts/alertContext";
import { validateNodes } from "../../utils";
import { typesContext } from "../../contexts/typesContext";
import ChatMessage from "./chatMessage";
import { X, MessagesSquare, Eraser, TerminalSquare, MessageCircle, MessageSquareDashed, MessageSquare, Variable } from "lucide-react";
import {
X,
MessagesSquare,
Eraser,
TerminalSquare,
MessageCircle,
MessageSquareDashed,
MessageSquare,
Variable,
} from "lucide-react";
import { sendAllProps } from "../../types/api";
import { ChatMessageType } from "../../types/chat";
import ChatInput from "./chatInput";
@ -74,8 +83,10 @@ export default function FormModal({
}, [open]);
useEffect(() => {
id.current = flow.id;
setKeysValue(Array(tabsState[flow.id].formKeysData.input_keys.length).fill(""));
}, [flow.id]);
setKeysValue(
Array(tabsState[flow.id].formKeysData.input_keys.length).fill("")
);
}, [flow.id, tabsState[flow.id], tabsState[flow.id].formKeysData]);
var isStream = false;
@ -316,7 +327,7 @@ export default function FormModal({
setLockChat(true);
// Message variable makes a object with the keys being the names from tabsState[flow.id].formKeysData.input_keys and the values being the keysValue of the correspondent index
let keys = tabsState[flow.id].formKeysData.input_keys; // array of keys
let values = keysValue.map((k, i) => i == chatKey ? chatValue : k); // array of values
let values = keysValue.map((k, i) => (i == chatKey ? chatValue : k)); // array of values
let message = keys.reduce((object, key, index) => {
object[key] = values[index];
return object;
@ -361,6 +372,7 @@ export default function FormModal({
return (
<Dialog open={open} onOpenChange={setModalOpen}>
<DialogTrigger className="hidden"></DialogTrigger>
{tabsState[flow.id].formKeysData && (
<DialogContent className="min-w-[80vw]">
<DialogHeader>
<DialogTitle className="flex items-center">
@ -391,12 +403,21 @@ export default function FormModal({
<Label htmlFor="airplane-mode">From Chat</Label>
<ToggleShadComponent
enabled={chatKey === k}
setEnabled={(value) => handleOnCheckedChange(value, k)}
setEnabled={(value) =>
handleOnCheckedChange(value, k)
}
size="small"
disabled={false}
/>
</div>
<Textarea value={keysValue[k]} onChange={(e) => setKeysValue({...keysValue, [k]: e.target.value})} disabled={chatKey === k} placeholder="Enter text..."></Textarea>
<Textarea
value={keysValue[k]}
onChange={(e) =>
setKeysValue({ ...keysValue, [k]: e.target.value })
}
disabled={chatKey === k}
placeholder="Enter text..."
></Textarea>
</div>
</AccordionContent>
</AccordionItem>
@ -463,6 +484,7 @@ export default function FormModal({
</div>
</div>
</DialogContent>
)}
</Dialog>
);
}