From 949bafa8773894bd644070217d6cb8eea4433705 Mon Sep 17 00:00:00 2001
From: Googler <noreply@google.com>
Date: Thu, 19 Dec 2024 00:18:46 -0800
Subject: [PATCH] Show execution count as a group label if exists

### Why
This is for rendering a custom group label for displaying execution count per execution node, especially for async runs with large number of nodes.

### Testing
* Screenshot: https://screenshot.googleplex.com/7t9pqYsdpRSAbiA

PiperOrigin-RevId: 707809922
---
 src/app/directed_acyclic_graph_raw.ng.html | 7 ++++---
 src/app/directed_acyclic_graph_raw.ts      | 8 +++++---
 2 files changed, 9 insertions(+), 6 deletions(-)

diff --git a/src/app/directed_acyclic_graph_raw.ng.html b/src/app/directed_acyclic_graph_raw.ng.html
index 3e0fd10..3bf4fb3 100644
--- a/src/app/directed_acyclic_graph_raw.ng.html
+++ b/src/app/directed_acyclic_graph_raw.ng.html
@@ -385,15 +385,16 @@
         This causes the DAG to open up, fade-in the label before hiding it,
         which looks very glitchy
       -->
-      <span *ngIf="group.treatAsLoop" class="fade-in" [attr.aria-hidden]="isGroupExpanded(group)">
-        <span class="iteration-counter"> {{ getIterationsFor(group).length }} iterations </span>
-      </span>
       @if (showGroupLabel(group)) {
         <div class="group-label">
           <span class="fade-in">
             <span> {{ group.groupLabel }} </span>
           </span>
         </div>
+      } @else if (group.treatAsLoop) {
+        <span class="fade-in" [attr.aria-hidden]="isGroupExpanded(group)">
+          <span class="iteration-counter"> {{ getIterationsFor(group).length }} iterations </span>
+        </span>
       }
       <button
         class="expand-toggle"
diff --git a/src/app/directed_acyclic_graph_raw.ts b/src/app/directed_acyclic_graph_raw.ts
index fa5dd94..f829644 100644
--- a/src/app/directed_acyclic_graph_raw.ts
+++ b/src/app/directed_acyclic_graph_raw.ts
@@ -460,13 +460,15 @@ export class DagRaw implements DoCheck, OnInit, OnDestroy {
   }
 
   showGroupLabel(group: DagGroup) {
-    if (group.treatAsLoop || !group.groupLabel) return false;
+    if (!group.groupLabel) return false;
     if (this.isGroupExpanded(group) && group.hasControlNode &&
         !group.hideControlNodeOnExpand) {
-      return false
+      return false;
     }
-    return true
+
+    return true;
   }
+
   broadcastIterChange(
       group: DagGroup, iterationNode: GroupIterationRecord['iterationNode']) {
     (group as any)._cachedSelection = iterationNode;