updates

graphql-editor · Jan 17, 2024 · d6bc176 · d6bc176
1 parent 8e83720
commit d6bc176
Show file tree

Hide file tree

Showing 3 changed files with 18 additions and 33 deletions.
diff --git a/packages/editor/src/Relation/PanZoom/LinesDiagram/LinesDiagram.tsx b/packages/editor/src/Relation/PanZoom/LinesDiagram/LinesDiagram.tsx
@@ -137,7 +137,9 @@ export const LinesDiagram = React.forwardRef<
         x: -nodeX * s + size.width / 2.0,
         y: -nodeY * s + size.height / 2.0,
       };
-      setTransform(transformTo.x, transformTo.y, s, 200, "easeOut");
+      setTimeout(() => {
+        setTransform(transformTo.x, transformTo.y, s, 200, "easeOut");
+      }, 250);
     }
   };
 
@@ -228,7 +230,7 @@ export const LinesDiagram = React.forwardRef<
         );
       }
     }
-  }, [props.loading, focusMode]);
+  }, [props.loading, focusMode, activeNode]);
 
   const transformEffect = (
     state: ReactZoomPanPinchState,

diff --git a/packages/editor/src/Relation/PanZoom/LinesDiagram/Node/Field/index.tsx b/packages/editor/src/Relation/PanZoom/LinesDiagram/Node/Field/index.tsx
@@ -39,12 +39,14 @@ type FieldProps = Pick<GrafFieldProps, "node"> & {
 };
 
 export const Field: React.FC<FieldProps> = ({ node }) => {
-  const { parentTypes, setSelectedNodeId, getParentOfField } = useTreesState();
+  const { parentTypes, setSelectedNodeId, getParentOfField, focusMode } =
+    useTreesState();
   const { setEditMode, printPreviewActive } = useRelationsState();
   const {
     setTypeRelatedNodesToFocusedNode,
     typeRelatedToFocusedNode,
     focusedNodes,
+    filteredFocusedNodes,
   } = useRelationNodesState();
   const nodeClick = useCallback(
     (n: ParserField) => {
@@ -54,24 +56,18 @@ export const Field: React.FC<FieldProps> = ({ node }) => {
           setEditMode(parent.id);
           return;
         }
-        setTypeRelatedNodesToFocusedNode(parent);
-        const alreadyExistsInTypeRelatedToFocusedNode =
-          typeRelatedToFocusedNode.find((el) => el.id === parent.id);
-        const alreadyExistsInFocusedNodes = focusedNodes?.find(
-          (el) => el.id === parent.id
-        );
-        if (
-          alreadyExistsInFocusedNodes ||
-          alreadyExistsInTypeRelatedToFocusedNode
-        ) {
-          setSelectedNodeId({
-            source: "relation",
-            value: {
-              id: parent.id,
-              name: parent.name,
-            },
-          });
+        const isFocus = !!(focusMode && filteredFocusedNodes);
+        if (isFocus) {
+          setTypeRelatedNodesToFocusedNode(parent);
         }
+
+        setSelectedNodeId({
+          source: "relation",
+          value: {
+            id: parent.id,
+            name: parent.name,
+          },
+        });
       }
     },
     [typeRelatedToFocusedNode, focusedNodes]

diff --git a/packages/editor/src/state/containers/relationNodes.tsx b/packages/editor/src/state/containers/relationNodes.tsx
@@ -140,19 +140,6 @@ const useRelationNodes = createContainer(() => {
     [focusedNodes, typeRelatedToFocusedNode]
   );
 
-  useEffect(() => {
-    if (typeRelatedToFocusedNode.length) {
-      setSelectedNodeId({
-        source: "relation",
-        value: {
-          id: typeRelatedToFocusedNode[typeRelatedToFocusedNode.length - 1].id,
-          name: typeRelatedToFocusedNode[typeRelatedToFocusedNode.length - 1]
-            .name,
-        },
-      });
-    }
-  }, [typeRelatedToFocusedNode]);
-
   const filteredTypeRelatedToFocusedNode = useMemo(() => {
     return typeRelatedToFocusedNode?.filter((el) => {
       const foundNode = nodesVisibilityArr.find((el2) => el2.id === el.id);