nodeToolbar opening logic changed

This commit is contained in:
Lucas Oliveira 2023-11-18 22:18:58 -03:00
commit 829da5f1e2
2 changed files with 20 additions and 36 deletions

View file

@ -1,12 +1,5 @@
import { cloneDeep } from "lodash"; import { cloneDeep } from "lodash";
import { import { forwardRef, useContext, useEffect, useRef, useState } from "react";
ReactNode,
forwardRef,
useContext,
useEffect,
useRef,
useState,
} from "react";
import { useUpdateNodeInternals } from "reactflow"; import { useUpdateNodeInternals } from "reactflow";
import ShadTooltip from "../../components/ShadTooltipComponent"; import ShadTooltip from "../../components/ShadTooltipComponent";
import CodeAreaComponent from "../../components/codeAreaComponent"; import CodeAreaComponent from "../../components/codeAreaComponent";
@ -51,20 +44,17 @@ const EditNodeModal = forwardRef(
data, data,
setData, setData,
nodeLength, nodeLength,
children,
open, open,
onClose, setOpen,
}: { }: {
data: NodeDataType; data: NodeDataType;
setData: (data: NodeDataType) => void; setData: (data: NodeDataType) => void;
nodeLength: number; nodeLength: number;
children: ReactNode; open: boolean;
open?: boolean; setOpen: (open: boolean) => void;
onClose?: (close: boolean) => void;
}, },
ref ref
) => { ) => {
const [modalOpen, setModalOpen] = useState(open ?? false);
const updateNodeInternals = useUpdateNodeInternals(); const updateNodeInternals = useUpdateNodeInternals();
const myData = useRef(data); const myData = useRef(data);
@ -89,11 +79,10 @@ const EditNodeModal = forwardRef(
}; };
useEffect(() => { useEffect(() => {
if (modalOpen) { if (open) {
myData.current = data; // reset data to what it is on node when opening modal myData.current = data; // reset data to what it is on node when opening modal
onClose!(modalOpen);
} }
}, [modalOpen]); }, [open]);
const [errorDuplicateKey, setErrorDuplicateKey] = useState(false); const [errorDuplicateKey, setErrorDuplicateKey] = useState(false);
const [adv, setAdv] = useState<boolean | null>(null); const [adv, setAdv] = useState<boolean | null>(null);
@ -103,13 +92,15 @@ const EditNodeModal = forwardRef(
<BaseModal <BaseModal
key={data.id} key={data.id}
size="large-h-full" size="large-h-full"
open={modalOpen} open={open}
setOpen={setModalOpen} setOpen={setOpen}
onChangeOpenModal={(open) => { onChangeOpenModal={(open) => {
myData.current = data; myData.current = data;
}} }}
> >
<BaseModal.Trigger>{children}</BaseModal.Trigger> <BaseModal.Trigger>
<></>
</BaseModal.Trigger>
<BaseModal.Header description={myData.current.node?.description!}> <BaseModal.Header description={myData.current.node?.description!}>
<span className="pr-2">{myData.current.type}</span> <span className="pr-2">{myData.current.type}</span>
<Badge variant="secondary">ID: {myData.current.id}</Badge> <Badge variant="secondary">ID: {myData.current.id}</Badge>
@ -551,7 +542,7 @@ const EditNodeModal = forwardRef(
}, },
}; };
}); });
setModalOpen(false); setOpen(false);
}} }}
type="submit" type="submit"
> >

View file

@ -247,24 +247,17 @@ export default function NodeToolbarComponent({
)} )}
</SelectContent> </SelectContent>
</Select> </Select>
{showModalAdvanced && (
<EditNodeModal <EditNodeModal
data={data} data={data}
setData={setData} setData={setData}
nodeLength={nodeLength} nodeLength={nodeLength}
open={showModalAdvanced} open={showModalAdvanced}
onClose={(modal) => { setOpen={setShowModalAdvanced}
setShowModalAdvanced(modal); />
}}
>
<></>
</EditNodeModal>
)}
<ShareModal <ShareModal
open={showconfirmShare} open={showconfirmShare}
setOpen={setShowconfirmShare} setOpen={setShowconfirmShare}
is_component={true} is_component={false}
component={flowComponent!} component={flowComponent!}
/> />
</span> </span>