diff --git a/src/components/EditorCanvas/Relationship.jsx b/src/components/EditorCanvas/Relationship.jsx index 6d91f91..1f7e5b1 100644 --- a/src/components/EditorCanvas/Relationship.jsx +++ b/src/components/EditorCanvas/Relationship.jsx @@ -1,6 +1,5 @@ import { useEffect, useState, useRef } from "react"; import { Cardinality, ObjectType, Tab } from "../../data/constants"; -import { RELATIONSHIP_EDITING } from "../../data/customEvents"; import { calcPath } from "../../utils/calcPath"; import { useDiagram, useSettings, useLayout, useSelect } from "../../hooks"; import { cn } from "../../utils/cn"; @@ -14,28 +13,8 @@ export default function Relationship({ data }) { const pathRef = useRef(); useEffect(() => { - const handleEditing = (event) => { - setEditing(event.detail.id === data.id); - }; - - document.addEventListener(RELATIONSHIP_EDITING, handleEditing); - return () => { - document.removeEventListener(RELATIONSHIP_EDITING, handleEditing); - }; - }, [data.id]); - - useEffect(() => { - const handleClickAway = (event) => { - if (pathRef.current && !pathRef.current.contains(event.target)) { - setEditing(false); - } - }; - - document.addEventListener("mousedown", handleClickAway); - return () => { - document.removeEventListener("mousedown", handleClickAway); - }; - }, [pathRef]); + setEditing(data.id === selectedElement.id); + }, [data.id, selectedElement.id]); let cardinalityStart = "1"; let cardinalityEnd = "1"; diff --git a/src/components/EditorSidePanel/RelationshipsTab/RelationshipsTab.jsx b/src/components/EditorSidePanel/RelationshipsTab/RelationshipsTab.jsx index ba452f3..99f80d7 100644 --- a/src/components/EditorSidePanel/RelationshipsTab/RelationshipsTab.jsx +++ b/src/components/EditorSidePanel/RelationshipsTab/RelationshipsTab.jsx @@ -4,7 +4,6 @@ import Empty from "../Empty"; import SearchBar from "./SearchBar"; import RelationshipInfo from "./RelationshipInfo"; import { ObjectType } from "../../../data/constants"; -import { RELATIONSHIP_EDITING } from "../../../data/customEvents"; import { useTranslation } from "react-i18next"; export default function RelationshipsTab() { @@ -24,20 +23,14 @@ export default function RelationshipsTab() { } keepDOM lazyRender - onChange={(k) => { - const newId = parseInt(k); - const event = new CustomEvent(RELATIONSHIP_EDITING, { - detail: { id: newId }, - }); - document.dispatchEvent(event); - + onChange={(k) => setSelectedElement((prev) => ({ ...prev, open: true, - id: newId, + id: parseInt(k), element: ObjectType.RELATIONSHIP, - })); - }} + })) + } accordion > {relationships.length <= 0 ? ( diff --git a/src/data/customEvents.js b/src/data/customEvents.js deleted file mode 100644 index c6829e7..0000000 --- a/src/data/customEvents.js +++ /dev/null @@ -1 +0,0 @@ -export const RELATIONSHIP_EDITING = "relationship-editing";