{% macro render_nodes(nodes, kind) -%}
<ul class="inventory-tree-list">
  {% for node in nodes %}
  <li>
    {% set href = '/inventory/locations/' ~ node.id if kind == 'location' else '/inventory/assets/' ~ node.id %}
    {% if node.children %}
    <details class="inventory-tree-branch"{% if node.expanded %} open{% endif %}>
      <summary><a class="inventory-tree-node{% if node.selected %} is-selected{% endif %}" href="{{ href }}"{% if node.selected %} aria-current="page"{% endif %}><span>{{ node.name }}</span><span class="inventory-tree-meta">{{ node.label }}</span></a></summary>
      {{ render_nodes(node.children, kind) }}
    </details>
    {% else %}
    <a class="inventory-tree-node{% if node.selected %} is-selected{% endif %}" href="{{ href }}"{% if node.selected %} aria-current="page"{% endif %}><span>{{ node.name }}</span><span class="inventory-tree-meta">{{ node.label }}</span></a>
    {% endif %}
  </li>
  {% endfor %}
</ul>
{%- endmacro %}
{% macro render_tree_panel(panel_class) -%}
<nav class="inventory-tree-panel {{ panel_class }}" aria-label="Inventory hierarchy">
  <a class="inventory-tree-section{% if inventory_tree.selected_kind == 'overview' %} is-selected{% endif %}" href="/inventory"{% if inventory_tree.selected_kind == 'overview' %} aria-current="page"{% endif %}>Overview</a>
  <h2 class="inventory-tree-heading">Physical Locations</h2>
  {% if inventory_tree.locations %}{{ render_nodes(inventory_tree.locations, 'location') }}{% else %}<p class="inventory-tree-empty">No active locations</p>{% endif %}
  <h2 class="inventory-tree-heading"><a class="inventory-tree-section{% if inventory_tree.selected_kind == 'topology' %} is-selected{% endif %}" href="/inventory/topology"{% if inventory_tree.selected_kind == 'topology' %} aria-current="page"{% endif %}>Infrastructure</a></h2>
  {% if inventory_tree.assets %}{{ render_nodes(inventory_tree.assets, 'asset') }}{% else %}<p class="inventory-tree-empty">No active assets</p>{% endif %}
</nav>
{%- endmacro %}
<aside class="inventory-sidebar" data-inventory-tree>
  {{ render_tree_panel('inventory-tree-desktop') }}
  <details class="inventory-tree-disclosure">
    <summary class="inventory-tree-toggle">Browse inventory</summary>
    {{ render_tree_panel('inventory-tree-mobile') }}
  </details>
</aside>