<.link patch={~p"/network-map?tab=added"} class={[ "whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm", if @active_tab == "added" do "border-blue-500 text-blue-600 dark:text-blue-400" else "border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 dark:text-gray-400 dark:hover:text-gray-300" end ]} > {t("Added Devices")} <.link patch={~p"/network-map?tab=all"} class={[ "whitespace-nowrap py-4 px-1 border-b-2 font-medium text-sm", if @active_tab == "all" do "border-blue-500 text-blue-600 dark:text-blue-400" else "border-transparent text-gray-500 hover:text-gray-700 hover:border-gray-300 dark:text-gray-400 dark:hover:text-gray-300" end ]} > {t("All Devices")} {@topology.stats.discovered_devices}

{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} />

<%= if @selected_node_detail do %>

{t("Node Details")}

{@selected_node_detail.name}

<%= if @selected_node_detail.type == :discovered do %> {t("Discovered")} <% end %>

<%= if @selected_node_detail.ip_address do %>

<.icon name="hero-globe-alt" class="h-4 w-4 text-gray-400 mr-2 flex-shrink-0" /> {@selected_node_detail.ip_address}

<% end %> <%= if @selected_node_detail.site_name do %>

<.icon name="hero-map-pin" class="h-4 w-4 text-gray-400 mr-2 flex-shrink-0" /> {@selected_node_detail.site_name}

<% end %> <%= if @selected_node_detail.manufacturer do %>

<.icon name="hero-building-office" class="h-4 w-4 text-gray-400 mr-2 flex-shrink-0" /> {@selected_node_detail.manufacturer}

<% end %>

<.icon name="hero-tag" class="h-4 w-4 text-gray-400 mr-2 flex-shrink-0" /> {@selected_node_detail.role}

<%= if @selected_node_detail.status && @selected_node_detail.status != :unknown do %>

{@selected_node_detail.status}

<% end %>

<%= if @selected_node_detail[:is_wireless] do %>

RF Stats

Clients

<.icon name="hero-wifi" class="h-4 w-4 text-purple-500" /> {@selected_node_detail[:client_count] || 0}

Signal

"text-green-600 dark:text-green-400" "degraded" -> "text-yellow-600 dark:text-yellow-400" "critical" -> "text-red-600 dark:text-red-400" _ -> "text-gray-500 dark:text-gray-400" end ]}> {@selected_node_detail[:signal_health] || "N/A"}

<%= if @selected_node_detail[:snr] do %>

SNR

= 25 -> "text-green-600 dark:text-green-400" @selected_node_detail.snr >= 15 -> "text-yellow-600 dark:text-yellow-400" true -> "text-red-600 dark:text-red-400" end ]}> {@selected_node_detail.snr} dB

<% end %>

<% end %> <%= if length(@selected_node_detail.connections) > 0 do %>

{t("Connections")} ({length(@selected_node_detail.connections)})

<%= for conn <- @selected_node_detail.connections do %>

{conn.device_name}

<%= if conn.interface do %>

{conn.interface}

<% end %>

{conn.link_type} 0.9 -> "text-green-600 dark:text-green-400" conn.confidence >= 0.5 -> "text-yellow-600 dark:text-yellow-400" true -> "text-gray-500 dark:text-gray-400" end ]}> {trunc(conn.confidence * 100)}%

<% end %>

<% end %> <%= if @selected_node_detail.type == :managed do %>

<.link navigate={~p"/devices/#{@selected_node_detail.id}"} class="flex items-center justify-center w-full px-3 py-2 text-sm font-medium text-blue-600 dark:text-blue-400 bg-blue-50 dark:bg-blue-400/10 rounded-md hover:bg-blue-100 dark:hover:bg-blue-400/20" > <.icon name="hero-arrow-top-right-on-square" class="h-4 w-4 mr-1.5" /> {t("View Device")} <%!-- RF Links button hidden (TOW-44) — keep code intact <%= if @selected_node_detail[:is_wireless] do %> <.link navigate={~p"/devices/#{@selected_node_detail.id}?tab=rf"} class="flex items-center justify-center w-full px-3 py-2 text-sm font-medium text-purple-600 dark:text-purple-400 bg-purple-50 dark:bg-purple-400/10 rounded-md hover:bg-purple-100 dark:hover:bg-purple-400/20" > <.icon name="hero-signal" class="h-4 w-4 mr-1.5" /> {t("View RF Links")} <% end %> --%>

<% end %>

<%!-- Device roles --%>

Roles:

Router

Switch

AP / Wireless

Firewall

Server

Unknown

Discovered

<%!-- RF Link health legend hidden (TOW-44) — keep code intact

RF Links:

Good signal

Degraded

Critical

--%> <%!-- Link types --%>

Link types:

LLDP/CDP

MAC/ARP inferred

Line thickness = bandwidth capacity

{t("Topology Visualization")}

{t("Node Details")}

{@selected_node_detail.name}

RF Stats

{t("Connections")} ({length(@selected_node_detail.connections)})

{t("No network topology available")}