required fields validation added
This commit is contained in:
parent
2a0547279c
commit
ba61a9533a
4 changed files with 29 additions and 12 deletions
|
|
@ -4,15 +4,17 @@ import {
|
||||||
PaperAirplaneIcon,
|
PaperAirplaneIcon,
|
||||||
XMarkIcon,
|
XMarkIcon,
|
||||||
} from "@heroicons/react/24/outline";
|
} from "@heroicons/react/24/outline";
|
||||||
import { useState } from "react";
|
import { useContext, useState } from "react";
|
||||||
import { sendAll } from "../../controllers/NodesServices";
|
import { sendAll } from "../../controllers/NodesServices";
|
||||||
|
import { alertContext } from "../../contexts/alertContext";
|
||||||
|
|
||||||
const _ = require("lodash");
|
const _ = require("lodash");
|
||||||
|
|
||||||
export default function Chat({ nodes, edges }) {
|
export default function Chat({ reactFlowInstance }) {
|
||||||
const [open, setOpen] = useState(true);
|
const [open, setOpen] = useState(true);
|
||||||
const [chatValue, setChatValue] = useState("");
|
const [chatValue, setChatValue] = useState("");
|
||||||
const [chatHistory, setChatHistory] = useState([]);
|
const [chatHistory, setChatHistory] = useState([]);
|
||||||
|
const {setErrorData} = useContext(alertContext);
|
||||||
const addChatHistory = (message, isSend) => {
|
const addChatHistory = (message, isSend) => {
|
||||||
setChatHistory((old) => {
|
setChatHistory((old) => {
|
||||||
let newChat = _.cloneDeep(old);
|
let newChat = _.cloneDeep(old);
|
||||||
|
|
@ -20,6 +22,12 @@ export default function Chat({ nodes, edges }) {
|
||||||
return newChat;
|
return newChat;
|
||||||
});
|
});
|
||||||
};
|
};
|
||||||
|
function validateNodes(){
|
||||||
|
if(reactFlowInstance.getNodes().some((n) => (n.data.node && Object.keys(n.data.node.template).some((t: any) => (n.data.node.template[t].required && !reactFlowInstance.getEdges().some((e) => (e.sourceHandle.split('|')[1] === t && e.sourceHandle.split('|')[2] === n.id))))))){
|
||||||
|
return false;
|
||||||
|
}
|
||||||
|
return true;
|
||||||
|
}
|
||||||
return (
|
return (
|
||||||
<>
|
<>
|
||||||
<Transition
|
<Transition
|
||||||
|
|
@ -80,14 +88,19 @@ export default function Chat({ nodes, edges }) {
|
||||||
<div className="absolute inset-y-0 right-0 flex items-center pr-3">
|
<div className="absolute inset-y-0 right-0 flex items-center pr-3">
|
||||||
<button
|
<button
|
||||||
onClick={() => {
|
onClick={() => {
|
||||||
let message = chatValue;
|
if(validateNodes()){
|
||||||
setChatValue("");
|
let message = chatValue;
|
||||||
addChatHistory(message, true);
|
setChatValue("");
|
||||||
sendAll({
|
addChatHistory(message, true);
|
||||||
message,
|
sendAll({
|
||||||
nodes,
|
message,
|
||||||
edges,
|
nodes: reactFlowInstance.getNodes(),
|
||||||
}).then((r) => {addChatHistory(r, false)});
|
edges: reactFlowInstance.getEdges(),
|
||||||
|
}).then((r) => {addChatHistory(r, false)});
|
||||||
|
} else {
|
||||||
|
setErrorData({title: 'Error sending message', list:['There are required fields not filled yet.']})
|
||||||
|
}
|
||||||
|
|
||||||
}}
|
}}
|
||||||
>
|
>
|
||||||
<PaperAirplaneIcon
|
<PaperAirplaneIcon
|
||||||
|
|
|
||||||
|
|
@ -6,5 +6,5 @@ export async function getAll() {
|
||||||
|
|
||||||
export async function sendAll(data) {
|
export async function sendAll(data) {
|
||||||
console.log(data);
|
console.log(data);
|
||||||
return await axios.post("http://localhost:5003/send", JSON.stringify(data));
|
return await axios.post("http://localhost:5003/load", data);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
|
|
@ -71,6 +71,7 @@ export default function ExtraSidebar() {
|
||||||
onDragStart(event, {
|
onDragStart(event, {
|
||||||
type: 'elements',
|
type: 'elements',
|
||||||
name: 'str',
|
name: 'str',
|
||||||
|
types,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
|
|
@ -89,6 +90,7 @@ export default function ExtraSidebar() {
|
||||||
onDragStart(event, {
|
onDragStart(event, {
|
||||||
type: 'elements',
|
type: 'elements',
|
||||||
name: 'chatInput',
|
name: 'chatInput',
|
||||||
|
types,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
|
|
@ -107,6 +109,7 @@ export default function ExtraSidebar() {
|
||||||
onDragStart(event, {
|
onDragStart(event, {
|
||||||
type: 'elements',
|
type: 'elements',
|
||||||
name: 'chatOutput',
|
name: 'chatOutput',
|
||||||
|
types,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
|
|
@ -125,6 +128,7 @@ export default function ExtraSidebar() {
|
||||||
onDragStart(event, {
|
onDragStart(event, {
|
||||||
type: 'elements',
|
type: 'elements',
|
||||||
name: 'bool',
|
name: 'bool',
|
||||||
|
types,
|
||||||
})
|
})
|
||||||
}
|
}
|
||||||
>
|
>
|
||||||
|
|
|
||||||
|
|
@ -99,7 +99,7 @@ export default function FlowPage() {
|
||||||
<Background />
|
<Background />
|
||||||
<Controls></Controls>
|
<Controls></Controls>
|
||||||
</ReactFlow>
|
</ReactFlow>
|
||||||
<Chat nodes={nodes} edges={edges}/>
|
<Chat reactFlowInstance={reactFlowInstance}/>
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
|
||||||
Loading…
Add table
Add a link
Reference in a new issue