Fix workflow graph nodes are not centered within a group

Context: We calculate the graph height by default by calculating the topmost/bottommost node's Y coordinate (center point) and then adding half of the default node height to it (to adjust for the center point) and then adding the default paddings and margins. The error happens when the nodes are custom -> their height does not equal the default node height. To fix this, this CL modifies the topmost/bottommost point getter function to also calculate with an offset.
PiperOrigin-RevId: 714032871

src/app/directed_acyclic_graph_raw.ts

@@ -222,7 +222,7 @@ export type EnhancedDagGroup = DagGroup&Dimension&Point&{
  * edges positions are moved based this distance.
  */
 const REVERSE_EDGE_CONTROL_DISTANCE = 200;
-type Orientation = 'center'|'right'|'left';
+type Orientation = 'center'|'right'|'left'|'bottom';
 
 /**
  * Renders the workflow DAG.
@@ -713,11 +713,10 @@ export class DagRaw implements DoCheck, OnInit, OnDestroy {
     const margin = this.getGraphMargin();
     const rightMostPointX = Math.max(
         ...this.getAllGraphItemsCoordinateForAxisAndOrientation('x', 'right'));
-    const topMostPointY =
-        Math.max(...this.getAllGraphItemsCoordinateForAxisAndOrientation('y'));
+    const topMostPointY = Math.max(
+        ...this.getAllGraphItemsCoordinateForAxisAndOrientation('y', 'bottom'));
     this.graphWidth = rightMostPointX + this.nodePad + margin['right'];
-    this.graphHeight =
-        topMostPointY + nodeHeight / 2 + this.nodePad + margin['bottom'];
+    this.graphHeight = topMostPointY + this.nodePad + margin['bottom'];
     this.graphResize.emit({width: this.graphWidth, height: this.graphHeight});
   }
 
@@ -760,12 +759,15 @@ export class DagRaw implements DoCheck, OnInit, OnDestroy {
 
   getAllGraphItemsCoordinateForAxisAndOrientation(
       dim: 'x'|'y', orient: Orientation = 'center'): number[] {
-    const {getNodeWidth, iconSpaceWidth} = this.dims;
+    const {getNodeWidth, height, iconSpaceWidth} = this.dims;
     let nodeOff = (node: CustomNode|DagNode|DagGroup) => {
       const type = this.getNodeType(node);
       if (type === 'group' || node instanceof CustomNode) {
         return (dim === 'x' ? node.width : node.height) / 2;
       }
+      if (orient === 'bottom' && dim === 'y') {
+        return node.height / 2;
+      }
       if (orient === 'center' || dim !== 'x') return 0;
       if (type === 'artifact' && this.collapsed) return iconSpaceWidth;
       return getNodeWidth(node.state, node.conditionalQuery) / 2;