{# Datalogger Tabs Component #}
{% if datalogger is defined %}
<div class="detail-tabs">
    <a href="{{ path('app_datalogger_detail', {id: datalogger.id}) }}" class="tab {% if activeTab == 'app_datalogger_detail' or app.request.attributes.get('_route') == 'app_datalogger_detail' %}active{% endif %}">Übersicht</a>
    <a href="{{ path('app_hats_groups', {id: datalogger.id}) }}" class="tab {% if activeTab == 'app_hats_groups' or app.request.attributes.get('_route') == 'app_hats_groups' %}active{% endif %}">Sektionen</a>
    <a href="{{ path('app_alarms', {id: datalogger.id}) }}" class="tab {% if activeTab == 'app_alarms' or app.request.attributes.get('_route') == 'app_alarms' %}active{% endif %}">
        Alarme
        {# Verwende lokale Variable vom Controller wenn vorhanden (spezifisch für diesen Datalogger) #}
        {# In Twig haben lokale Variablen (vom Controller) Vorrang vor globalen Variablen #}
        {% set dataloggerAlarmsCount = activeAlarmsCount is defined ? activeAlarmsCount : (globalActiveAlarmsCount is defined ? globalActiveAlarmsCount : 0) %}
        {% set dataloggerCriticalCount = criticalAlarmsCount is defined ? criticalAlarmsCount : (globalCriticalAlarmsCount is defined ? globalCriticalAlarmsCount : 0) %}
        {% if dataloggerAlarmsCount > 0 %}
            <span class="tab-alarm-badge {% if dataloggerCriticalCount > 0 %}tab-alarm-badge-critical{% else %}tab-alarm-badge-warning{% endif %}">{{ dataloggerAlarmsCount }}</span>
        {% endif %}
    </a>
    <a href="{{ path('app_gps', {id: datalogger.id}) }}" class="tab {% if activeTab == 'app_gps' or app.request.attributes.get('_route') == 'app_gps' %}active{% endif %}">GPS</a>
    <a href="{{ path('app_bms_charger', {id: datalogger.id}) }}" class="tab {% if activeTab == 'app_bms_charger' or app.request.attributes.get('_route') == 'app_bms_charger' %}active{% endif %}">BMS / Charger</a>
    <a href="{{ path('app_trips', {id: datalogger.id}) }}" class="tab {% if activeTab == 'app_trips' or app.request.attributes.get('_route') == 'app_trips' %}active{% endif %}">Trips</a>
    <a href="{{ path('app_hats', {id: datalogger.id}) }}" class="tab {% if activeTab == 'app_hats' or app.request.attributes.get('_route') == 'app_hats' %}active{% endif %}">HAT Sensoren</a>
</div>
{% endif %}

{# Macro für Rückwärtskompatibilität mit anderen Templates #}
{% macro renderTabs(datalogger, currentRoute) %}
    {% if datalogger is defined %}
    <div class="detail-tabs">
        <a href="{{ path('app_datalogger_detail', {id: datalogger.id}) }}" class="tab {% if currentRoute == 'app_datalogger_detail' %}active{% endif %}">Übersicht</a>
        <a href="{{ path('app_hats_groups', {id: datalogger.id}) }}" class="tab {% if currentRoute == 'app_hats_groups' %}active{% endif %}">Sektionen</a>
        <a href="{{ path('app_alarms', {id: datalogger.id}) }}" class="tab {% if currentRoute == 'app_alarms' %}active{% endif %}">
            Alarme
            {# In Macros haben wir keinen Zugriff auf Controller-Variablen, daher verwenden wir die globale Variable #}
            {% if activeAlarmsCount is defined and activeAlarmsCount > 0 %}
                <span class="tab-alarm-badge {% if criticalAlarmsCount is defined and criticalAlarmsCount > 0 %}tab-alarm-badge-critical{% else %}tab-alarm-badge-warning{% endif %}">{{ activeAlarmsCount }}</span>
            {% endif %}
        </a>
        <a href="{{ path('app_gps', {id: datalogger.id}) }}" class="tab {% if currentRoute == 'app_gps' %}active{% endif %}">GPS</a>
        <a href="{{ path('app_bms_charger', {id: datalogger.id}) }}" class="tab {% if currentRoute == 'app_bms_charger' %}active{% endif %}">BMS / Charger</a>
        <a href="{{ path('app_trips', {id: datalogger.id}) }}" class="tab {% if currentRoute == 'app_trips' %}active{% endif %}">Trips</a>
        <a href="{{ path('app_hats', {id: datalogger.id}) }}" class="tab {% if currentRoute == 'app_hats' %}active{% endif %}">HAT Sensoren</a>
    </div>
    {% endif %}
{% endmacro %}