From ad630cfbfe84e3627804e4d9e0f7af394a79d61c Mon Sep 17 00:00:00 2001
From: AustinMroz <austin@comfy.org>
Date: Mon, 8 Dec 2025 21:47:16 -0800
Subject: [PATCH] Add label to open subgraph button (#7244)
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Also
- Updates button icon and text color
- Removes the subgraphNode icon, so that space available for node title
is not reduced.

| Before | After |
| ------ | ----- |
| <img width="360" alt="before"
src="https://github.com/user-attachments/assets/e63593d6-2dad-4779-aed5-e0c1e544fb17"
/>| <img width="360" alt="after"
src="https://github.com/user-attachments/assets/b1ad034b-dc1a-4ce0-8ca1-b78acdf8ab0e"
/>|

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7244-Add-label-to-open-subgraph-button-2c36d73d3650815a8602dce456350b39)
by [Unito](https://www.unito.io)
---
 .../extensions/vueNodes/components/NodeHeader.vue    | 12 +++++++-----
 1 file changed, 7 insertions(+), 5 deletions(-)

diff --git a/src/renderer/extensions/vueNodes/components/NodeHeader.vue b/src/renderer/extensions/vueNodes/components/NodeHeader.vue
index bb1273e81c..debb358d62 100644
--- a/src/renderer/extensions/vueNodes/components/NodeHeader.vue
+++ b/src/renderer/extensions/vueNodes/components/NodeHeader.vue
@@ -38,7 +38,6 @@
           </IconButton>
         </div>
 
-        <div v-if="isSubgraphNode" class="icon-[comfy--workflow] size-4" />
         <div v-if="isApiNode" class="icon-[lucide--dollar-sign] size-4" />
 
         <!-- Node Title -->
@@ -76,13 +75,16 @@
           v-tooltip.top="enterSubgraphTooltipConfig"
           type="transparent"
           data-testid="subgraph-enter-button"
-          class="size-5"
+          class="ml-2 text-node-component-header h-5"
           @click.stop="handleEnterSubgraph"
           @dblclick.stop
         >
-          <i
-            class="icon-[lucide--picture-in-picture] size-5 text-node-component-header-icon"
-          ></i>
+          <div
+            class="min-w-max rounded-sm bg-node-component-surface px-1 py-0.5 text-xs flex items-center gap-1"
+          >
+            {{ $t('g.edit') }}
+            <i class="icon-[lucide--scaling] size-5"></i>
+          </div>
         </IconButton>
       </div>
     </div>