<.breadcrumb items={[ %{label: "Dashboard", navigate: ~p"/dashboard"}, %{label: "Settings", navigate: ~p"/orgs/#{@organization.slug}/settings"}, %{label: "Integrations", navigate: ~p"/orgs/#{@organization.slug}/settings/integrations"}, %{label: "Preseem"} ]} />

{t("Network Insights")}

{t("Proactive network health observations generated from Preseem data analysis.")}

<%!-- Filter bar --%>
<%!-- Status filter tabs --%> <%!-- Urgency filter --%>
Urgency: <.link id="filter-urgency-all" patch={ ~p"/orgs/#{@organization.slug}/settings/integrations/preseem/insights?#{%{status: @filter_status}}" } class={[ "rounded-md px-2 py-1 text-xs font-medium", if(is_nil(@filter_urgency), do: "bg-gray-200 text-gray-800 dark:bg-white/20 dark:text-white", else: "text-gray-500 hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-white/10" ) ]} > {t("All")} <.link id="filter-urgency-critical" patch={ ~p"/orgs/#{@organization.slug}/settings/integrations/preseem/insights?#{%{status: @filter_status, urgency: "critical"}}" } class={[ "rounded-md px-2 py-1 text-xs font-medium", if(@filter_urgency == "critical", do: "bg-red-100 text-red-800 dark:bg-red-900/30 dark:text-red-400", else: "text-gray-500 hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-white/10" ) ]} > {t("Critical")} <.link id="filter-urgency-warning" patch={ ~p"/orgs/#{@organization.slug}/settings/integrations/preseem/insights?#{%{status: @filter_status, urgency: "warning"}}" } class={[ "rounded-md px-2 py-1 text-xs font-medium", if(@filter_urgency == "warning", do: "bg-yellow-100 text-yellow-800 dark:bg-yellow-900/30 dark:text-yellow-400", else: "text-gray-500 hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-white/10" ) ]} > {t("Warning")} <.link id="filter-urgency-info" patch={ ~p"/orgs/#{@organization.slug}/settings/integrations/preseem/insights?#{%{status: @filter_status, urgency: "info"}}" } class={[ "rounded-md px-2 py-1 text-xs font-medium", if(@filter_urgency == "info", do: "bg-blue-100 text-blue-800 dark:bg-blue-900/30 dark:text-blue-400", else: "text-gray-500 hover:bg-gray-100 dark:text-gray-400 dark:hover:bg-white/10" ) ]} > {t("Info")}
<%!-- Bulk actions bar --%> <%= if any_selected?(@selected_ids) do %>
{MapSet.size(@selected_ids)} selected
<% end %> <%!-- Insights list --%>
<%= if @insights == [] do %>
<.icon name="hero-light-bulb" class="mx-auto h-12 w-12 text-gray-400 dark:text-gray-500" />

{t("No insights found")}

<%= cond do %> <% @filter_status == "dismissed" -> %> {t("No dismissed insights.")} <% @filter_urgency != nil -> %> No {@filter_urgency} insights right now. <% true -> %> {t("No active insights. Your network is looking healthy!")} <% end %>

<% else %> <%!-- Select all bar --%>
<%!-- Checkbox --%>
<%!-- Urgency badge --%> {insight.urgency} <%!-- Type badge --%> {String.replace(insight.type, "_", " ")}

{insight.title}

<%= if insight.description do %>

{insight.description}

<% end %> <%= if insight.llm_summary do %>

{t("Summary")}

{insight.llm_summary}

<%= if insight.recommended_action do %>

{t("Recommended action:")} {insight.recommended_action}

<% end %>

AI-generated{if insight.llm_model, do: " ยท " <> insight.llm_model, else: ""}

<% end %>
<%!-- Access point --%> <%= if insight.preseem_access_point do %> <.icon name="hero-signal" class="h-3.5 w-3.5" /> {insight.preseem_access_point.name} <% end %> <%!-- Linked device --%> <%= if insight.device do %> <.link navigate={~p"/devices/#{insight.device.id}"} class="flex items-center gap-1 text-indigo-600 hover:text-indigo-800 dark:text-indigo-400 dark:hover:text-indigo-300" > <.icon name="hero-server" class="h-3.5 w-3.5" /> {insight.device.name || "Device"} <% end %> <%!-- Timestamp --%> <.icon name="hero-clock" class="h-3.5 w-3.5" /> {ToweropsWeb.TimeHelpers.format_datetime( insight.inserted_at, @current_scope.timezone, @current_scope.time_format )}
<%!-- Dismiss button --%> <%= if insight.status == "active" do %> <% end %>
<% end %>