{% from "partials/components.html" import collapse %}
<div id="services-by-host">
{% call collapse("Services by Host", id="services-by-host-collapse", checked=expanded|default(true)) %}
    {% for host_name, host_services in services_by_host.items() | sort %}
    <h4 class="font-semibold mt-3 mb-1">
        {{ host_name }}
        {% if host_name in hosts %}
        <code class="text-xs ml-2 opacity-60">{{ hosts[host_name].address }}</code>
        {% endif %}
    </h4>
    <ul class="menu menu-horizontal bg-base-200 rounded-box mb-2">
        {% for svc in host_services | sort %}
        <li><a href="/service/{{ svc }}">{{ svc }}</a></li>
        {% endfor %}
    </ul>
    {% else %}
    <p class="text-base-content/60 italic">No services currently running.</p>
    {% endfor %}
{% endcall %}
</div>