(() => {
const selectedId = this.selectedExecutionId();
@@ -240,6 +241,10 @@ export class TasksExecutor {
this.manualTreeSelectionId.set(selection.executionId);
}
+ toggleExecutionTree() {
+ this.executionTreeOpen.update((open) => !open);
+ }
+
private resolveExecutionById(executionId: string | null): TaskExecution | null {
if (!executionId) return null;
return this.executionDetails().find((execution) => execution.id === executionId)
diff --git a/src/app/shared/execution-tree/execution-tree.css b/src/app/shared/execution-tree/execution-tree.css
index 9892f20..e205170 100644
--- a/src/app/shared/execution-tree/execution-tree.css
+++ b/src/app/shared/execution-tree/execution-tree.css
@@ -1,5 +1,7 @@
:host {
- display: block;
+ display: flex;
+ flex: 1 1 auto;
+ min-height: 0;
}
:host(.execution-tree-empty) {
@@ -8,7 +10,9 @@
.execution-tree-shell {
display: flex;
+ flex: 1 1 auto;
flex-direction: column;
+ min-height: 0;
max-height: 100%;
overflow: hidden;
background: #ffffff;
@@ -16,16 +20,6 @@
border-radius: 8px;
}
-.execution-tree-title {
- padding: 10px 12px;
- font-size: 12px;
- font-weight: 600;
- text-transform: uppercase;
- letter-spacing: 0.04em;
- color: #64748b;
- border-bottom: 1px solid #e2e8f0;
-}
-
.execution-tree-body {
flex: 1;
overflow-y: auto;
diff --git a/src/app/shared/execution-tree/execution-tree.html b/src/app/shared/execution-tree/execution-tree.html
index c83c470..c6a3b41 100644
--- a/src/app/shared/execution-tree/execution-tree.html
+++ b/src/app/shared/execution-tree/execution-tree.html
@@ -1,7 +1,6 @@
@if (rootExecution(); as root) {
@if (hasContainerContent()) {
-
Execution tree
diff --git a/src/app/shared/nodes/task-step-node/task-step-node.css b/src/app/shared/nodes/task-step-node/task-step-node.css
index 4d7a1f0..e02aa7a 100644
--- a/src/app/shared/nodes/task-step-node/task-step-node.css
+++ b/src/app/shared/nodes/task-step-node/task-step-node.css
@@ -460,16 +460,17 @@ button.llm-node-bias-summary:focus-visible {
.llm-pill-name {
min-width: 0;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
+ white-space: normal;
+ overflow-wrap: anywhere;
+ word-break: break-word;
+ line-height: 1.15;
}
.llm-pill-context {
min-width: 0;
- overflow: hidden;
- text-overflow: ellipsis;
- white-space: nowrap;
+ white-space: normal;
+ overflow-wrap: anywhere;
+ word-break: break-word;
font-size: 9px;
line-height: 1;
font-weight: 700;
diff --git a/src/app/shared/task-execution-viewer/task-execution-viewer.css b/src/app/shared/task-execution-viewer/task-execution-viewer.css
index 1bfadca..63d5d93 100644
--- a/src/app/shared/task-execution-viewer/task-execution-viewer.css
+++ b/src/app/shared/task-execution-viewer/task-execution-viewer.css
@@ -150,17 +150,22 @@
}
.execution-aside-tab {
+ flex: 0 0 auto;
border: 0;
border-bottom: 2px solid transparent;
background: transparent;
color: #64748b;
- font-size: 12px;
+ font-size: 11px;
font-weight: 700;
- padding: 9px 9px;
+ padding: 9px 6px;
cursor: pointer;
white-space: nowrap;
}
+.execution-aside-tabs {
+ flex-wrap: nowrap;
+}
+
.execution-aside-tab-active {
border-bottom-color: #2563eb;
color: #1d4ed8;
diff --git a/src/app/shared/task-execution-viewer/task-execution-viewer.html b/src/app/shared/task-execution-viewer/task-execution-viewer.html
index 08b80ed..8cfad55 100644
--- a/src/app/shared/task-execution-viewer/task-execution-viewer.html
+++ b/src/app/shared/task-execution-viewer/task-execution-viewer.html
@@ -160,8 +160,8 @@
@if (contextAsideOpen()) {
-
-@if (flow()) {
+@if (flow() && !editingSubflow()) {
- @if (editingSubflow()) {
- Main flow: {{ flow()!.name }}
- }
Author: {{ flow()!.author }}
Created: {{ flow()!.createdAt | date:'dd/MM/yyyy HH:mm' }}
Updated: {{ flow()!.updatedAt | date:'dd/MM/yyyy HH:mm' }}
diff --git a/src/app/shared/title-toolbar/title-toolbar.spec.ts b/src/app/shared/title-toolbar/title-toolbar.spec.ts
index 793a013..b55d736 100644
--- a/src/app/shared/title-toolbar/title-toolbar.spec.ts
+++ b/src/app/shared/title-toolbar/title-toolbar.spec.ts
@@ -38,6 +38,50 @@ describe('TitleToolbar', () => {
expect(component).toBeTruthy();
});
+ it('hides parent metadata and global inputs while editing a subflow', async () => {
+ editorState.currentFlow.set({
+ ...makeFlow(),
+ description: 'Main flow description',
+ data: {
+ blocks: [],
+ containers: [{
+ id: 'container-1',
+ name: 'Container',
+ typeName: 'LoopContainer',
+ nodeFamily: 'container',
+ inputs: [],
+ outputs: [],
+ specificConfiguration: {
+ subFlow: {
+ blocks: [],
+ containers: [],
+ connections: [],
+ dependencies: [],
+ globalInputs: [{ name: 'topic', type: 'TEXT', multiple: false }],
+ lanes: []
+ }
+ }
+ }],
+ connections: [],
+ dependencies: [],
+ globalInputs: [{ name: 'rootInput', type: 'TEXT', multiple: false }],
+ lanes: []
+ }
+ });
+ editorState.openSubflow([{ containerId: 'container-1', configurationPath: 'subFlow' }]);
+
+ fixture.detectChanges();
+ await fixture.whenStable();
+
+ const host = fixture.nativeElement as HTMLElement;
+ expect(host.textContent).not.toContain('Description:');
+ expect(host.textContent).not.toContain('Global Inputs');
+ expect(host.textContent).not.toContain('Author:');
+ expect(host.textContent).not.toContain('Created:');
+ expect(host.textContent).not.toContain('Updated:');
+ expect(host.textContent).not.toContain('Main flow:');
+ });
+
describe('lanes', () => {
beforeEach(() => {
editorState.currentFlow.set(makeFlow());