From 5216116a1456e14384b63d39d8beddcb92198e87 Mon Sep 17 00:00:00 2001
From: Lucio Lelii <lucio.lelii@isti.cnr.it>
Date: Wed, 30 Sep 2026 10:47:10 +0200
Subject: [PATCH] feat(execution): add right-side zoom controls

---
 src/app/shared/rete-editor/rete-editor.css     | 6 ++++++
 src/app/shared/rete-editor/rete-editor.html    | 7 +++++--
 src/app/shared/rete-editor/rete-editor.spec.ts | 8 ++++++++
 3 files changed, 19 insertions(+), 2 deletions(-)

diff --git a/src/app/shared/rete-editor/rete-editor.css b/src/app/shared/rete-editor/rete-editor.css
index 54a62e9..5a1aff5 100644
--- a/src/app/shared/rete-editor/rete-editor.css
+++ b/src/app/shared/rete-editor/rete-editor.css
@@ -137,6 +137,12 @@
   left: 202px;
 }
 
+/* The execution canvas is read-only, but its graph remains navigable; keep its zoom beside it. */
+.rete-editor-toolbar--right {
+  right: 12px;
+  left: auto;
+}
+
 .rete-editor-toolbar-group {
   position: relative;
   display: inline-flex;
diff --git a/src/app/shared/rete-editor/rete-editor.html b/src/app/shared/rete-editor/rete-editor.html
index 0aaea1d..95a48b4 100644
--- a/src/app/shared/rete-editor/rete-editor.html
+++ b/src/app/shared/rete-editor/rete-editor.html
@@ -47,8 +47,11 @@
     }
   </div>
   }
-  @if (!readonly()) {
-  <div class="rete-editor-toolbar" [class.rete-editor-toolbar--with-lanes]="swimlanesEnabled && sortedLanes().length">
+  @if (!readonly() || nodeView() === 'execution') {
+  <div
+    class="rete-editor-toolbar"
+    [class.rete-editor-toolbar--with-lanes]="swimlanesEnabled && sortedLanes().length"
+    [class.rete-editor-toolbar--right]="readonly() && nodeView() === 'execution'">
     <section class="rete-editor-toolbar-group" aria-label="Zoom controls">
       <div class="rete-editor-toolbar-legend">Zoom</div>
       <button
diff --git a/src/app/shared/rete-editor/rete-editor.spec.ts b/src/app/shared/rete-editor/rete-editor.spec.ts
index 59a68a2..5da14cb 100644
--- a/src/app/shared/rete-editor/rete-editor.spec.ts
+++ b/src/app/shared/rete-editor/rete-editor.spec.ts
@@ -71,6 +71,14 @@ describe('ReteEditor', () => {
     expect(component).toBeTruthy();
   });
 
+  it('keeps zoom controls available on the right in a read-only execution graph', () => {
+    fixture.componentRef.setInput('readonly', true);
+    fixture.componentRef.setInput('nodeView', 'execution');
+    fixture.detectChanges();
+
+    expect((fixture.nativeElement as HTMLElement).querySelector('.rete-editor-toolbar--right')).not.toBeNull();
+  });
+
   it('brings both endpoints of a selected connection above unrelated nodes', async () => {
     const source = document.createElement('div');
     const target = document.createElement('div');