Get types done at App.tsx and fixed handle position

This commit is contained in:
Lucas Oliveira 2024-01-05 18:13:51 -03:00
commit 6a6d11447b
8 changed files with 58 additions and 26 deletions

View file

@ -6,7 +6,7 @@ import React, {
useRef,
useState,
} from "react";
import { Handle, Position, useUpdateNodeInternals } from "reactflow";
import { Handle, Position } from "reactflow";
import ShadTooltip from "../../../../components/ShadTooltipComponent";
import CodeAreaComponent from "../../../../components/codeAreaComponent";
import DictComponent from "../../../../components/dictComponent";
@ -69,8 +69,6 @@ export default function ParameterComponent({
const refHtml = useRef<HTMLDivElement & ReactNode>(null);
const infoHtml = useRef<HTMLDivElement & ReactNode>(null);
const setErrorData = useAlertStore((state) => state.setErrorData);
const updateNodeInternals = useUpdateNodeInternals();
const [position, setPosition] = useState(0);
const { tabId, flows } = useContext(FlowsContext);
const nodes = useFlowStore((state) => state.nodes);
const edges = useFlowStore((state) => state.edges);
@ -78,18 +76,6 @@ export default function ParameterComponent({
const flow = flows.find((flow) => flow.id === tabId)?.data?.nodes ?? null;
// Update component position
useEffect(() => {
if (ref.current && ref.current.offsetTop && ref.current.clientHeight) {
setPosition(ref.current.offsetTop + ref.current.clientHeight / 2);
updateNodeInternals(data.id);
}
}, [data.id, ref, ref.current, ref.current?.offsetTop, updateNodeInternals]);
useEffect(() => {
updateNodeInternals(data.id);
}, [data.id, position, updateNodeInternals]);
const groupedEdge = useRef(null);
const { setFilterEdge } = useContext(typesContext);
@ -300,7 +286,6 @@ export default function ParameterComponent({
)}
style={{
borderColor: color,
top: position,
}}
onClick={() => {
setFilterEdge(groupedEdge.current);
@ -313,7 +298,7 @@ export default function ParameterComponent({
) : (
<div
ref={ref}
className="mt-1 flex w-full flex-wrap items-center justify-between bg-muted px-5 py-2"
className="mt-1 flex w-full flex-wrap items-center justify-between relative bg-muted px-5 py-2"
>
<>
<div
@ -373,7 +358,6 @@ export default function ParameterComponent({
)}
style={{
borderColor: color,
top: position,
}}
onClick={() => {
setFilterEdge(groupedEdge.current);