removed connection of to string and boolean

This commit is contained in:
anovazzi1 2023-03-06 17:54:40 -03:00
commit 84e87828cd

View file

@ -1,8 +1,6 @@
import { Handle, Position, useUpdateNodeInternals } from "reactflow"; import { Handle, Position, useUpdateNodeInternals } from "reactflow";
import Tooltip from "../../../../components/TooltipComponent"; import Tooltip from "../../../../components/TooltipComponent";
import { import { classNames, isValidConnection } from "../../../../utils";
isValidConnection,
} from "../../../../utils";
import { useContext, useEffect, useRef, useState } from "react"; import { useContext, useEffect, useRef, useState } from "react";
import InputComponent from "../../../../components/inputComponent"; import InputComponent from "../../../../components/inputComponent";
import ToggleComponent from "../../../../components/toggleComponent"; import ToggleComponent from "../../../../components/toggleComponent";
@ -36,14 +34,23 @@ export default function ParameterComponent({
updateNodeInternals(data.id); updateNodeInternals(data.id);
}, [data.id, position, updateNodeInternals]); }, [data.id, position, updateNodeInternals]);
const [enabled, setEnabled] = useState(data.node.template[name]?.value ?? false); const [enabled, setEnabled] = useState(
data.node.template[name]?.value ?? false
);
const { reactFlowInstance } = useContext(typesContext); const { reactFlowInstance } = useContext(typesContext);
let disabled = reactFlowInstance?.getEdges().some((e) => (e.targetHandle === id)) ?? false; let disabled =
reactFlowInstance?.getEdges().some((e) => e.targetHandle === id) ?? false;
return ( return (
<div ref={ref} className="w-full flex flex-wrap justify-between items-center bg-gray-50 dark:bg-gray-800 dark:text-white mt-1 px-5 py-2"> <div
ref={ref}
className="w-full flex flex-wrap justify-between items-center bg-gray-50 dark:bg-gray-800 dark:text-white mt-1 px-5 py-2"
>
<> <>
<div className="text-sm truncate">{title}<span className="text-red-600">{required ? " *" : ""}</span></div> <div className="text-sm truncate">
{title}
<span className="text-red-600">{required ? " *" : ""}</span>
</div>
<Tooltip title={tooltipTitle + (required ? " (required)" : "")}> <Tooltip title={tooltipTitle + (required ? " (required)" : "")}>
<Handle <Handle
type={left ? "target" : "source"} type={left ? "target" : "source"}
@ -52,10 +59,10 @@ export default function ParameterComponent({
isValidConnection={(connection) => isValidConnection={(connection) =>
isValidConnection(connection, reactFlowInstance) isValidConnection(connection, reactFlowInstance)
} }
className={ className={classNames(
(left ? "-ml-0.5 " : "-mr-0.5 ") + (left ? "-ml-0.5 " : "-mr-0.5 "),
"w-3 h-3 rounded-full border-2 bg-white dark:bg-gray-800" "w-3 h-3 rounded-full border-2 bg-white dark:bg-gray-800",left && (type==="str" || type==="bool")?"hidden":""
} )}
style={{ style={{
borderColor: color, borderColor: color,
top: position, top: position,
@ -64,16 +71,20 @@ export default function ParameterComponent({
</Tooltip> </Tooltip>
{left === true && type === "str" ? ( {left === true && type === "str" ? (
<div className="mt-2 w-full"> <div className="mt-2 w-full">
{data.node.template[name].list ? {data.node.template[name].list ? (
<InputListComponent <InputListComponent
disabled={disabled} disabled={disabled}
value={!data.node.template[name].value || data.node.template[name].value === "" ? [""] : data.node.template[name].value} value={
!data.node.template[name].value ||
data.node.template[name].value === ""
? [""]
: data.node.template[name].value
}
onChange={(t: string[]) => { onChange={(t: string[]) => {
data.node.template[name].value = t; data.node.template[name].value = t;
}} }}
/> />
: ) : data.node.template[name].multiline ? (
data.node.template[name].multiline ? (
<TextAreaComponent <TextAreaComponent
disabled={disabled} disabled={disabled}
value={data.node.template[name].value ?? ""} value={data.node.template[name].value ?? ""}
@ -81,7 +92,7 @@ export default function ParameterComponent({
data.node.template[name].value = t; data.node.template[name].value = t;
}} }}
/> />
) : ) : (
<InputComponent <InputComponent
disabled={disabled} disabled={disabled}
value={data.node.template[name].value ?? ""} value={data.node.template[name].value ?? ""}
@ -89,8 +100,7 @@ export default function ParameterComponent({
data.node.template[name].value = t; data.node.template[name].value = t;
}} }}
/> />
} )}
</div> </div>
) : left === true && type === "bool" ? ( ) : left === true && type === "bool" ? (
<div className="mt-2"> <div className="mt-2">