From 1e3ee637ad9b21b2f078d8410281987adb51020e Mon Sep 17 00:00:00 2001
From: Oliver Walters <oliver.henry.walters@gmail.com>
Date: Fri, 19 Jun 2026 03:30:02 +0000
Subject: [PATCH] Add connecting lines

---
 .../src/components/nav/NavigationTree.tsx     | 42 +++++++++++--------
 1 file changed, 25 insertions(+), 17 deletions(-)

diff --git a/src/frontend/src/components/nav/NavigationTree.tsx b/src/frontend/src/components/nav/NavigationTree.tsx
index 5afb3e7a0a..dbcba80ee8 100644
--- a/src/frontend/src/components/nav/NavigationTree.tsx
+++ b/src/frontend/src/components/nav/NavigationTree.tsx
@@ -286,22 +286,24 @@ export default function NavigationTree({
             }
           }}
         >
-          <Space w={15 * (payload.level - 1)} />
-          <ActionIcon
-            size='sm'
-            variant='transparent'
-            aria-label={`nav-tree-toggle-${payload.node.value}}`}
-          >
-            {isLoading ? (
-              <Loader size='xs' />
-            ) : hasChildren ? (
-              payload.expanded ? (
-                <IconChevronDown />
-              ) : (
-                <IconChevronRight />
-              )
-            ) : null}
-          </ActionIcon>
+          <Space w={25 * (payload.level - 1)} />
+          {(isLoading || hasChildren || payload.expanded) && (
+            <ActionIcon
+              size='sm'
+              variant='transparent'
+              aria-label={`nav-tree-toggle-${payload.node.value}}`}
+            >
+              {isLoading ? (
+                <Loader size='xs' />
+              ) : hasChildren ? (
+                payload.expanded ? (
+                  <IconChevronDown />
+                ) : (
+                  <IconChevronRight />
+                )
+              ) : null}
+            </ActionIcon>
+          )}
           <HoverCard
             width={260}
             shadow='md'
@@ -400,7 +402,13 @@ export default function NavigationTree({
             {t`No results found`}
           </Alert>
         ) : (
-          <Tree data={data} tree={treeState} renderNode={renderNode} />
+          <Tree
+            data={data}
+            tree={treeState}
+            renderNode={renderNode}
+            withLines
+            levelOffset={25}
+          />
         )}
       </Stack>
     </Drawer>