Sidebar active-page auto-expand doesn't sync the +/- toggle icon with visible children

[jstirnaman]

Describe the issue

In the left sidebar nav tree, ancestor sections auto-expanded on page load (to
reveal the active page) show a mismatched toggle icon: the section displays
"+" (collapsed-looking) while its children are actually visible. Clicking the
icon then flips it to "-" (expanded-looking) while the children collapse —
the opposite of what the icon communicates.

Root cause

layouts/partials/sidebar.html, in the inline auto-expand script (~line
116-144), walks up from the active page's <li> to open every ancestor
ul.children:

var node = active.parentElement;
while (node && node.id !== 'nav-tree') {
  if (node.tagName === 'UL' && node.classList.contains('children')) {
    node.classList.add('open');
    var t = node.previousElementSibling;
    if (t && t.classList.contains('children-toggle')) t.classList.add('open');
  }
  node = node.parentElement;
}

node.previousElementSibling assumes .children-toggle immediately precedes
ul.children. But per layouts/partials/sidebar/nested-menu.html (lines
40-48), the markup order inside each <li> is:

<a class="children-toggle">...</a>
<a href="...">Name</a>
<ul class="children">...</ul>

So ul.children's previousElementSibling is the plain link <a>, not
.children-toggle — the t.classList.contains('children-toggle') check is
always false for every ancestor level, and the toggle icon never gets .open
added, even though ul.children does.

This only affects ancestor levels reached via the while loop. The
"own children" case a few lines above (128-132) is unaffected because it
queries the toggle directly: active.querySelector(':scope > .children-toggle').

Then assets/js/content-interactions.js's click handler
(leftNavInteractions()) toggles .open on both the icon and its sibling
.children together, so a click on a mismatched section flips the icon to
match its stale pre-click state instead of syncing to the actual (now
opposite) visibility — inverting the icon on every subsequent click for that
section.

Suggested fix

In the while loop, look up the toggle the same way the "own children" block
does, instead of relying on sibling order, e.g.:

var t = node.parentElement.querySelector(':scope > .children-toggle');

Relevant URLs

• https://test2.docs.influxdata.com/pr-preview/pr-7754/influxdb3/core/plugins/library/official/state-change/
• Selector from repro: #nav-tree > li:nth-child(5) > ul > li:nth-child(2) > ul > li:nth-child(2) > a.children-toggle
• layouts/partials/sidebar.html (auto-expand script)
• layouts/partials/sidebar/nested-menu.html (menu item markup order)
• assets/js/content-interactions.js (leftNavInteractions())