From bf4bb3d9173b10ce2b1a00c812d612d7c6be8802 Mon Sep 17 00:00:00 2001
From: kodi <kodi@lab.local>
Date: Fri, 13 Mar 2026 12:09:40 +0100
Subject: [PATCH] focus balk onder aan paneel

---
 .../test_ui_smoke_golden.cpython-313.pyc      | Bin 22593 -> 22740 bytes
 .../tests/golden/test_ui_smoke_golden.py      |   2 ++
 webui/html/app.js                             |  20 ++++++++++++++++++
 webui/html/base.css                           |  14 ++++++++++++
 webui/html/index.html                         |   2 ++
 5 files changed, 38 insertions(+)

diff --git a/webui/backend/tests/golden/__pycache__/test_ui_smoke_golden.cpython-313.pyc b/webui/backend/tests/golden/__pycache__/test_ui_smoke_golden.cpython-313.pyc
index d92435555f0c12db11b0535d2f0f9f86757590b2..308f19ee66d2d00d2a5f671dce8f15a6af3997f9 100644
GIT binary patch
delta 298
zcmX@Of$_>lM&8f7yj%=Gu>1Yy%zqns|1&dj2yEtK+08XMmQ`f(1$}|ZZ~0Uv$5{$b
z7B>(Ci`f_mfawGSfz7r26-<*Qg*+zLXbMdB70LlioE3s7IAF{-`M;3+<Y-GVmf(y~
z=E;GU3PQn|q0FXCAR8GN6d3dwg0m)j3AZz5Z@wgajZs@9GsRXZCpE1^H!VN8v{*MM
zGcQ%CN)#kol$oA^EWCM{=yG<(rJMa^XEILaRN$YyTZw=3bGdIUtoPZa;_Wv-QeLIO
zIB9dQk3JV$6(g(p_lnJj!h9Kxf>;<`8E0@@m(aW@q4|XY%>9tX!N9`PQFWPF@&*e}
TyKj?ktN#aP1{SFzF`zR6l=)r!

delta 195
zcmcbzk@4ULM&8f7yj%=GAozB3=G2Y6|CyN%@Ned0+08XMS6F27T|Se^v8*DKR~ra`
z>GKeJb1r`e)8ylt5W#9=2t6N2`wHcNHR_uPfa#Ayp)C3g!5Nb$3AZz5Zk7_c#<*El
zY$-cq`{u*4GZ{Bm$$w*Ey{9Y{FTJ@`Wt9fwgv|=R`dn-kjI8G0OE!mw`!b3JurRtZ
X&fvH%p?Oh4^9uu*`yp-ejtCh5xj#Rw

diff --git a/webui/backend/tests/golden/test_ui_smoke_golden.py b/webui/backend/tests/golden/test_ui_smoke_golden.py
index 58fa5d5..d6b1369 100644
--- a/webui/backend/tests/golden/test_ui_smoke_golden.py
+++ b/webui/backend/tests/golden/test_ui_smoke_golden.py
@@ -46,6 +46,8 @@ class UiSmokeGoldenTest(unittest.TestCase):
         self.assertIn('id="right-pane"', body)
         self.assertIn('id="left-items"', body)
         self.assertIn('id="right-items"', body)
+        self.assertIn('id="left-focus-line"', body)
+        self.assertIn('id="right-focus-line"', body)
         self.assertIn('id="function-bar"', body)
         self.assertIn('id="settings-btn"', body)
         self.assertIn('id="rename-btn"', body)
diff --git a/webui/html/app.js b/webui/html/app.js
index 8e1ac4a..6d9e6be 100644
--- a/webui/html/app.js
+++ b/webui/html/app.js
@@ -910,6 +910,24 @@ function scrollCurrentRowIntoView(pane) {
   }
 }
 
+function updatePaneFocusLine(pane) {
+  const model = paneState(pane);
+  const focusLine = document.getElementById(`${pane}-focus-line`);
+  if (!focusLine) {
+    return;
+  }
+  if (!Array.isArray(model.visibleItems) || model.currentRowIndex < 0 || model.currentRowIndex >= model.visibleItems.length) {
+    focusLine.textContent = "—";
+    return;
+  }
+  const item = model.visibleItems[model.currentRowIndex];
+  if (!item) {
+    focusLine.textContent = "—";
+    return;
+  }
+  focusLine.textContent = item.isParent ? "../" : (item.name || "—");
+}
+
 function renderPaneItems(pane) {
   const model = paneState(pane);
   const items = document.getElementById(`${pane}-items`);
@@ -917,6 +935,7 @@ function renderPaneItems(pane) {
 
   if (!Array.isArray(model.visibleItems) || model.visibleItems.length === 0) {
     model.currentRowIndex = -1;
+    updatePaneFocusLine(pane);
     updateActionButtons();
     return;
   }
@@ -1039,6 +1058,7 @@ function renderPaneItems(pane) {
     }
     items.append(row);
   });
+  updatePaneFocusLine(pane);
   updateActionButtons();
 }
 
diff --git a/webui/html/base.css b/webui/html/base.css
index b35ea41..c115314 100644
--- a/webui/html/base.css
+++ b/webui/html/base.css
@@ -112,6 +112,20 @@ h1 {
   background: var(--color-surface);
 }
 
+.pane-focus-line {
+  flex: 0 0 auto;
+  min-height: 24px;
+  padding: 5px 8px 3px 8px;
+  border-top: 1px solid var(--color-border);
+  background: var(--color-surface-elevated);
+  color: var(--color-text-muted);
+  font-size: 12px;
+  line-height: 1.25;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+
 .toolbar {
   display: flex;
   flex-wrap: wrap;
diff --git a/webui/html/index.html b/webui/html/index.html
index b507507..bbb7d91 100644
--- a/webui/html/index.html
+++ b/webui/html/index.html
@@ -45,6 +45,7 @@
           </div>
           <ul id="left-items" class="list"></ul>
         </div>
+        <div id="left-focus-line" class="pane-focus-line" aria-live="polite">—</div>
       </section>
 
       <section class="panel pane" id="right-pane" data-pane="right">
@@ -64,6 +65,7 @@
           </div>
           <ul id="right-items" class="list"></ul>
         </div>
+        <div id="right-focus-line" class="pane-focus-line" aria-live="polite">—</div>
       </section>
     </main>