{# TechHand Remote Support shell nav. portal_capabilities None = show all (unknown / old server). #}
{% set cap = portal_capabilities %}
{% set cap_ok = cap is not none %}
<nav class="navbar" role="navigation" aria-label="Main">
  <div class="navbar-top">
    <div class="container">
      <div class="navbar-brand-wrap">
        <a href="{{ url_for('index') }}" class="navbar-brand" title="TechHand Remote Support home">
          <img class="brand-icon" src="{{ url_for('static', filename='img/icon-256.png') }}" alt="" width="28" height="28">
          <span class="brand-name"><b>Tech</b>Hand<span class="brand-sub">Remote Support</span></span>
        </a>
        <span class="connection-status {% if ui_connected %}connection-status-connected{% else %}connection-status-disconnected{% endif %}" aria-live="polite" title="Connection status">
          <i class="fas fa-circle" aria-hidden="true"></i>
          <span class="connection-status-text">{% if ui_connected %}Connected{% else %}Disconnected{% endif %}</span>
        </span>
      </div>
      <div class="navbar-user">
        <span class="user-name">{% if ui_configured %}{{ config.client_name or 'Client' }}{% else %}Not configured{% endif %}</span>
        <a href="{{ url_for('setup') }}" class="nav-link-compact" title="Setup"><i class="fas fa-sliders-h"></i></a>
      </div>
    </div>
  </div>
  <div class="navbar-bottom">
    <div class="container navbar-bottom-inner">
      <button type="button" class="navbar-menu-btn" id="navbarMenuBtn" aria-expanded="false" aria-controls="nav-drawer" aria-label="Open menu" title="Open menu">
        <i class="fas fa-bars" aria-hidden="true"></i>
      </button>
      <div id="navbarPageActions" class="navbar-page-actions" aria-hidden="true"></div>
      <div class="nav-links-row" id="nav-links-row">
        <a href="{{ url_for('index') }}" class="nav-link {% if request.endpoint == 'index' %}active{% endif %}" title="Home">
          <i class="fas fa-home" aria-hidden="true"></i><span>Home</span>
        </a>
        <div class="nav-dropdown" data-dropdown="local">
          <button type="button" class="nav-dropdown-trigger" id="nav-dropdown-local" aria-expanded="false" aria-haspopup="true" aria-controls="nav-dropdown-panel-local">
            <span>Local</span>
            <i class="fas fa-chevron-down nav-dropdown-chevron" aria-hidden="true"></i>
          </button>
          <div class="nav-dropdown-panel" id="nav-dropdown-panel-local" aria-hidden="true">
            <a href="{{ url_for('scan_page') }}" class="nav-dropdown-link" title="Network scan"><i class="fas fa-search"></i><span>Scan</span></a>
            <a href="{{ url_for('status_page') }}" class="nav-dropdown-link" title="Sync status"><i class="fas fa-chart-line"></i><span>Status</span></a>
          </div>
        </div>
        <div class="nav-dropdown" data-dropdown="org">
          <button type="button" class="nav-dropdown-trigger" id="nav-dropdown-org" aria-expanded="false" aria-haspopup="true" aria-controls="nav-dropdown-panel-org">
            <span>Organization</span>
            <i class="fas fa-chevron-down nav-dropdown-chevron" aria-hidden="true"></i>
          </button>
          <div class="nav-dropdown-panel" id="nav-dropdown-panel-org" aria-hidden="true">
            {% if portal_session_ready %}
              {% if not cap_ok or cap.get('summary', true) %}
              <a href="{{ url_for('organization_hub') }}" class="nav-dropdown-link"><i class="fas fa-building"></i><span>Overview</span></a>
              {% endif %}
              {% if not cap_ok or cap.get('tickets_read', true) %}
              <a href="{{ url_for('organization_tickets_page') }}" class="nav-dropdown-link"><i class="fas fa-ticket-alt"></i><span>Tickets</span></a>
              {% endif %}
              {% if not cap_ok or cap.get('docs_read', true) %}
              <a href="{{ url_for('organization_documents_page') }}" class="nav-dropdown-link"><i class="fas fa-book"></i><span>Documents</span></a>
              {% endif %}
              {% if not cap_ok or cap.get('vault_read', true) %}
              <a href="{{ url_for('organization_vault_page') }}" class="nav-dropdown-link"><i class="fas fa-lock"></i><span>Vault</span></a>
              {% endif %}
              {% if not cap_ok or cap.get('assets_read', true) %}
              <a href="{{ url_for('organization_assets_page') }}" class="nav-dropdown-link"><i class="fas fa-server"></i><span>Assets</span></a>
              <a href="{{ url_for('organization_networks_page') }}" class="nav-dropdown-link"><i class="fas fa-network-wired"></i><span>Networks</span></a>
              {% endif %}
              {% if not cap_ok or cap.get('training_read', true) %}
              <a href="{{ url_for('organization_training_page') }}" class="nav-dropdown-link"><i class="fas fa-graduation-cap"></i><span>Training</span></a>
              {% endif %}
              {% if not cap_ok or cap.get('ai_chat', true) %}
              <a href="{{ url_for('organization_ai_page') }}" class="nav-dropdown-link"><i class="fas fa-robot"></i><span>Org AI</span></a>
              {% endif %}
              {% if not cap_ok or cap.get('machine_context', true) %}
              <a href="{{ url_for('organization_machine_page') }}" class="nav-dropdown-link"><i class="fas fa-microchip"></i><span>Machine context</span></a>
              {% endif %}
              {% if not cap_ok or cap.get('owner_reports_read', true) %}
              <a href="{{ url_for('organization_owner_reports_page') }}" class="nav-dropdown-link"><i class="fas fa-file-invoice-dollar"></i><span>Owner reports</span></a>
              {% endif %}
              {% if not cap_ok or cap.get('apikeys_read', true) %}
              <a href="{{ url_for('organization_api_keys_page') }}" class="nav-dropdown-link"><i class="fas fa-key"></i><span>API keys</span></a>
              {% endif %}
            {% else %}
              <a href="{{ url_for('setup', need_portal='1') }}" class="nav-dropdown-link"><i class="fas fa-plug"></i><span>Sign in &amp; org key</span></a>
            {% endif %}
          </div>
        </div>
        <a href="{{ url_for('setup') }}" class="nav-link {% if request.endpoint == 'setup' %}active{% endif %}" title="Setup">
          <i class="fas fa-cog" aria-hidden="true"></i><span>Setup</span>
        </a>
      </div>
      <div class="navbar-bottom-title-area" id="navbarBottomTitleArea" aria-hidden="true"></div>
    </div>
  </div>
</nav>

<div class="nav-drawer-backdrop" id="navDrawerBackdrop" aria-hidden="true"></div>
<div class="nav-drawer" id="nav-drawer" role="dialog" aria-modal="true" aria-label="Navigation menu" aria-hidden="true">
  <div class="nav-drawer-header">
    <span class="nav-drawer-title">Menu</span>
    <button type="button" class="nav-drawer-close" id="navDrawerClose" aria-label="Close menu">
      <i class="fas fa-times" aria-hidden="true"></i>
    </button>
  </div>
  <div class="nav-drawer-links">
    <a href="{{ url_for('index') }}" class="nav-drawer-link"><i class="fas fa-home"></i><span>Home</span></a>
    <a href="{{ url_for('scan_page') }}" class="nav-drawer-link"><i class="fas fa-search"></i><span>Scan</span></a>
    <a href="{{ url_for('status_page') }}" class="nav-drawer-link"><i class="fas fa-chart-line"></i><span>Status</span></a>
    {% if portal_session_ready %}
      {% if not cap_ok or cap.get('summary', true) %}
      <a href="{{ url_for('organization_hub') }}" class="nav-drawer-link"><i class="fas fa-building"></i><span>Org overview</span></a>
      {% endif %}
      {% if not cap_ok or cap.get('tickets_read', true) %}
      <a href="{{ url_for('organization_tickets_page') }}" class="nav-drawer-link"><i class="fas fa-ticket-alt"></i><span>Tickets</span></a>
      {% endif %}
      {% if not cap_ok or cap.get('docs_read', true) %}
      <a href="{{ url_for('organization_documents_page') }}" class="nav-drawer-link"><i class="fas fa-book"></i><span>Documents</span></a>
      {% endif %}
      {% if not cap_ok or cap.get('vault_read', true) %}
      <a href="{{ url_for('organization_vault_page') }}" class="nav-drawer-link"><i class="fas fa-lock"></i><span>Vault</span></a>
      {% endif %}
      {% if not cap_ok or cap.get('assets_read', true) %}
      <a href="{{ url_for('organization_assets_page') }}" class="nav-drawer-link"><i class="fas fa-server"></i><span>Assets</span></a>
      {% endif %}
      {% if not cap_ok or cap.get('training_read', true) %}
      <a href="{{ url_for('organization_training_page') }}" class="nav-drawer-link"><i class="fas fa-graduation-cap"></i><span>Training</span></a>
      {% endif %}
      {% if not cap_ok or cap.get('ai_chat', true) %}
      <a href="{{ url_for('organization_ai_page') }}" class="nav-drawer-link"><i class="fas fa-robot"></i><span>Org AI</span></a>
      {% endif %}
      {% if not cap_ok or cap.get('machine_context', true) %}
      <a href="{{ url_for('organization_machine_page') }}" class="nav-drawer-link"><i class="fas fa-microchip"></i><span>Machine context</span></a>
      {% endif %}
      {% if not cap_ok or cap.get('owner_reports_read', true) %}
      <a href="{{ url_for('organization_owner_reports_page') }}" class="nav-drawer-link"><i class="fas fa-file-invoice-dollar"></i><span>Owner reports</span></a>
      {% endif %}
      {% if not cap_ok or cap.get('apikeys_read', true) %}
      <a href="{{ url_for('organization_api_keys_page') }}" class="nav-drawer-link"><i class="fas fa-key"></i><span>API keys</span></a>
      {% endif %}
    {% else %}
      <a href="{{ url_for('setup', need_portal='1') }}" class="nav-drawer-link"><i class="fas fa-plug"></i><span>Organization portal setup</span></a>
    {% endif %}
    <a href="{{ url_for('setup') }}" class="nav-drawer-link"><i class="fas fa-sliders-h"></i><span>Setup</span></a>
  </div>
</div>