fix/COMPASS-9664 fix default height calc (#105)

Author: paula-stacho

src/components/edge/floating-edge.test.tsx

@@ -57,7 +57,7 @@ describe('floating-edge', () => {
       expect(path).toHaveAttribute('id', 'orders-to-employees');
       expect(path).toHaveAttribute(
         'd',
-        'M269.5 180L289.5 180L 386.5,180Q 391.5,180 391.5,185L 391.5,295Q 391.5,300 386.5,300L371.5 300',
+        'M267 197.5L267 217.5L 267,240Q 267,245 272,245L 354,245Q 359,245 359,250L359 272.5L359 292.5',
       );
     });
   });

src/components/edge/self-referencing-edge.test.tsx

@@ -53,7 +53,7 @@ describe('self-referencing-edge', () => {
       renderComponent();
       const path = screen.getByTestId('self-referencing-edge-employees-to-employees');
       expect(path).toHaveAttribute('id', 'employees-to-employees');
-      expect(path).toHaveAttribute('d', 'M422,292.5L422,262.5L584,262.5L584,350.5L551.5,350.5');
+      expect(path).toHaveAttribute('d', 'M422,292.5L422,262.5L584,262.5L584,355.5L551.5,355.5');
     });
   });
 

src/utilities/apply-layout.test.ts

@@ -64,14 +64,14 @@ describe('apply-layout', () => {
         ...nodes[1],
         position: {
           x: 12,
-          y: 76, // 12 + 44 (0 fields height) + 2*10 (padding)
+          y: 86, // 12 + 44 (0 fields height) + 2*10 (padding) + 10 (extra padding)
         },
       }),
       expect.objectContaining({
         ...nodes[2],
         position: {
           x: 12,
-          y: 140, // 76 + 44 (0 fields height) + 2*10 (padding)
+          y: 160, // 86 + 44 (0 fields height) + 2*10 (padding) + 10 (extra padding)
         },
       }),
     ]);
@@ -94,14 +94,14 @@ describe('apply-layout', () => {
         ...nodesWithOneField[1],
         position: {
           x: 12,
-          y: 94, // 12 + 62 (1 field height) + 2*10 (padding)
+          y: 104, // 12 + 62 (1 field height) + 2*10 (padding) + 10 (extra padding)
         },
       }),
       expect.objectContaining({
         ...nodesWithOneField[2],
         position: {
           x: 12,
-          y: 176, // 94 + 62 (1 field height) + 2*10 (padding)
+          y: 196, // 104 + 62 (1 field height) + 2*10 (padding) + 10 (extra padding)
         },
       }),
     ]);
@@ -124,14 +124,14 @@ describe('apply-layout', () => {
         ...baseNodes[1],
         position: {
           x: 12,
-          y: 94, // 12 + 62 (default height) + 2*10 (padding)
+          y: 104, // 12 + 62 (default height) + 2*10 (padding) + 10 (extra padding)
         },
       }),
       expect.objectContaining({
         ...baseNodes[2],
         position: {
           x: 12,
-          y: 176, // 94 + 62 (default height) + 2*10 (padding)
+          y: 196, // 104 + 62 (default height) + 2*10 (padding) + 10 (extra padding)
         },
       }),
     ]);
@@ -188,7 +188,7 @@ describe('apply-layout', () => {
         id: '1',
         position: {
           x: 12,
-          y: 76,
+          y: 86,
         },
       }),
       expect.objectContaining({
@@ -208,7 +208,7 @@ describe('apply-layout', () => {
         id: '3',
         position: {
           x: 12,
-          y: 220,
+          y: 240,
         },
       }),
     ]);

src/utilities/get-edge-params.test.ts

@@ -10,12 +10,12 @@ describe('get-edge-params', () => {
         { ...EMPLOYEES_NODE, data: { title: EMPLOYEES_NODE.title, fields: EMPLOYEES_NODE.fields } },
       );
       expect(result).toEqual({
-        sourcePos: 'right',
-        sx: 269.5,
-        sy: 180,
-        targetPos: 'right',
-        tx: 371.5,
-        ty: 300,
+        sourcePos: 'bottom',
+        sx: 267,
+        sy: 197.5,
+        targetPos: 'top',
+        tx: 359,
+        ty: 292.5,
       });
     });
   });

src/utilities/get-edge-params.ts

@@ -54,13 +54,13 @@ const getEdgePosition = (node: InternalNode, intersectionPoint: XYPosition) => {
   if (px <= nx + 1) {
     return Position.Left;
   }
-  if (px >= nx + (n.measured?.width ?? 0) - 1) {
+  if (px >= nx + (getNodeWidth(n) - 1)) {
     return Position.Right;
   }
   if (py <= ny + 1) {
     return Position.Top;
   }
-  if (py >= n.y + (n.measured?.height ?? 0) - 1) {
+  if (py >= n.y + (getNodeHeight(n) - 1)) {
     return Position.Bottom;
   }
 

src/utilities/node-dimensions.ts

@@ -1,4 +1,5 @@
-import type { BaseNode } from '@/types';
+import type { BaseNode, NodeProps } from '@/types';
+import { InternalNode } from '@/types/internal';
 
 import {
   DEFAULT_FIELD_HEIGHT,
@@ -7,11 +8,23 @@ import {
   DEFAULT_NODE_WIDTH,
 } from './constants';
 
-export const getNodeHeight = <N extends BaseNode>(node: N) => {
+export const getNodeHeight = <N extends BaseNode | NodeProps | InternalNode>(node: N) => {
   if ('height' in node && typeof node.height === 'number') return node.height;
   if ('measured' in node && node.measured?.height) return node.measured.height;
-  const fieldCount = !('fields' in node) || !Array.isArray(node.fields) ? 1 : node.fields.length;
-  return DEFAULT_NODE_HEADER_HEIGHT + DEFAULT_FIELD_PADDING * 2 + fieldCount * DEFAULT_FIELD_HEIGHT;
+
+  let fieldCount = 1;
+  if ('fields' in node && Array.isArray(node.fields)) {
+    fieldCount = node.fields.length;
+  }
+  if ('data' in node) {
+    let internalNode = node as InternalNode;
+    if (internalNode.data?.fields && Array.isArray(internalNode.data.fields)) {
+      fieldCount = internalNode.data.fields.length;
+    }
+  }
+  const calculatedHeight =
+    DEFAULT_NODE_HEADER_HEIGHT + DEFAULT_FIELD_PADDING * 2 + fieldCount * DEFAULT_FIELD_HEIGHT + 10;
+  return calculatedHeight;
 };
 
 export const getNodeWidth = <N extends BaseNode>(node: N) => {