<.header> Network Map Experimental <:subtitle>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" />
Total Devices
{@topology.stats.total_devices}
<.icon name="hero-check-circle" class="h-6 w-6 text-green-400" />
Added Devices
{@topology.stats.added_devices}
<.icon name="hero-magnifying-glass" class="h-6 w-6 text-blue-400" />
Discovered
{@topology.stats.discovered_devices}
<.icon name="hero-link" class="h-6 w-6 text-purple-400" />
Connections
{@topology.stats.total_links}
<.icon name="hero-squares-2x2" class="h-6 w-6 text-orange-400" />
Subnets
{@topology.stats.total_subnets}

Topology Visualization

Click and drag to pan, scroll to zoom, click nodes for details

Last updated: <.timestamp datetime={@topology.last_updated} timezone={@timezone} />
Router
Switch
Wireless
Server
Unknown
Discovered (Not Added)
Active Link
<%= 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" />

No network topology available

Add devices with SNMP enabled to start building your network map.

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 %>