<.header> {t("Network Map")} {t("Experimental")} <:subtitle>{t("Visual topology of your network infrastructure")} <:actions> <.button phx-click="refresh_topology" disabled={@loading}> <.icon name="hero-arrow-path" class="h-5 w-5" /> Refresh
<%= if @loading do %>
<.icon name="hero-arrow-path" class="h-12 w-12 text-gray-400 animate-spin mx-auto" />

Loading network topology...

<% else %>
<.icon name="hero-server" class="h-6 w-6 text-gray-400" />
{t("Total Devices")}
{@topology.stats.total_devices}
<.icon name="hero-check-circle" class="h-6 w-6 text-green-400" />
{t("Added Devices")}
{@topology.stats.added_devices}
<.icon name="hero-magnifying-glass" class="h-6 w-6 text-blue-400" />
{t("Discovered")}
{@topology.stats.discovered_devices}
<.icon name="hero-link" class="h-6 w-6 text-purple-400" />
{t("Connections")}
{@topology.stats.total_links}

{t("Topology Visualization")}

{t("Click and drag to pan, scroll to zoom, click nodes for details")}

Last updated: <.timestamp datetime={@topology.last_updated} timezone={@timezone} />
<%!-- Device roles --%>
Roles:
Router
Switch
Wireless
Firewall
Server
Unknown
Discovered
<%!-- Link confidence --%>
Links:
High confidence
Medium confidence
Low confidence
<%= if @topology.stats.total_devices == 0 do %>
<.icon name="hero-map" class="mx-auto h-12 w-12 text-gray-400 dark:text-gray-500" />

{t("No network topology available")}

{t("Add devices with SNMP enabled to start building your network map.")}

{t("The topology is automatically discovered via LLDP and CDP protocols.")}

<.button navigate={~p"/devices/new"} variant="primary"> <.icon name="hero-plus" class="h-5 w-5" /> Add Your First Device
<% end %> <% end %>