Fix executing class

src/lib/components/BlockContainer.svelte

@@ -41,6 +41,7 @@
 <div class="container {container.attrs.direction} {container.attrs.classes} {classes.join(' ')}"
      class:selected={$uiState.uiEditMode !== "disabled" && $layoutState.currentSelection.includes(container.id)}
      class:root-container={zIndex === 0}
+     class:is-executing={container.isNodeExecuting}
      class:container-edit-outline={$uiState.uiEditMode === "widgets" && zIndex > 1}>
     <Block>
         {#if container.attrs.showTitle}
@@ -70,7 +71,6 @@
             >
             {#each children.filter(item => item.id !== SHADOW_PLACEHOLDER_ITEM_ID) as item(item.id)}
                 <div class="animation-wrapper"
-                     class:is-executing={item.isNodeExecuting}
                      animate:flip={{duration:flipDurationMs}}>
                     <WidgetContainer dragItem={item} zIndex={zIndex+1} />
                     {#if item[SHADOW_ITEM_MARKER_PROPERTY_NAME]}

src/lib/components/WidgetContainer.svelte

@@ -15,22 +15,20 @@
  let widgetState: WidgetUIState | null = null;
  let showHandles: boolean = false;
 
- $: if (dragItem) {
-     if (!$layoutState.allItems[dragItem.id]) {
-         dragItem = null;
-         widget = null;
-         widgetState = null;
-         container = null;
-     }
-     else if (dragItem.type === "container") {
-         container = dragItem as ContainerLayout;
-         widget = null;
-     }
-     else if (dragItem.type === "widget") {
-         widget = dragItem as WidgetLayout;
-         widgetState = nodeState.findWidgetByName(widget.nodeId, widget.widgetName)
-         container = null;
-     }
+ $: if (!dragItem || !$layoutState.allItems[dragItem.id]) {
+     dragItem = null;
+     container = null;
+     widget = null;
+     widgetState = null;
+ }
+ else if (dragItem.type === "container") {
+     container = dragItem as ContainerLayout;
+     widget = null;
+ }
+ else if (dragItem.type === "widget") {
+     widget = dragItem as WidgetLayout;
+     widgetState = nodeState.findWidgetByName(widget.nodeId, widget.widgetName)
+     container = null;
  }
 
  $: showHandles = $uiState.uiEditMode === "widgets" // TODO
@@ -38,8 +36,8 @@
                && !$layoutState.isMenuOpen
 
 
- $: if ($queueState && widget) {
-     widget.isNodeExecuting = $queueState.runningNodeId === widget.nodeId;
+ $: if ($queueState && dragItem) {
+     dragItem.isNodeExecuting = $queueState.runningNodeId === dragItem.nodeId;
  }
 </script>
 
@@ -51,10 +49,6 @@
         class:selected={$uiState.uiEditMode !== "disabled" && $layoutState.currentSelection.includes(widget.id)}
         class:is-executing={$queueState.runningNodeId && $queueState.runningNodeId == widget.attrs.associatedNode}
         >
-        {#if widget.attrs.associatedNode}
-            {@const node = $nodeState[widget.attrs.associatedNode].node}
-            <span class="node-type">({node.type})</span>
-        {/if}
         <svelte:component this={getComponentForWidgetState(widgetState)} item={widgetState} />
     </div>
     {#if showHandles}

src/lib/stores/layoutState.ts

@@ -265,6 +265,7 @@ function nodeRemoved(node: LGraphNode) {
     let delContainers = []
 
     // Remove widget from all children lists
+  // TODO just use parent.children
     for (const entry of Object.values(state.allItems)) {
         if (entry.children?.length === 0 && isAssociatedContainer(entry.dragItem))
             delContainers.push(entry.dragItem.id)