<.header> Alerts <:subtitle>Monitor and acknowledge system alerts
<.link patch={~p"/orgs/#{@current_organization.slug}/alerts"} class={[ "px-4 py-2 text-sm font-medium rounded-l-lg", @filter == "all" && "bg-blue-600 text-white dark:bg-blue-500", @filter != "all" && "bg-white text-zinc-700 hover:bg-zinc-50 dark:bg-zinc-900 dark:text-zinc-300 dark:hover:bg-zinc-800" ]} > All Alerts <.link patch={~p"/orgs/#{@current_organization.slug}/alerts?filter=active"} class={[ "px-4 py-2 text-sm font-medium rounded-r-lg border-l border-zinc-200 dark:border-zinc-800", @filter == "active" && "bg-blue-600 text-white dark:bg-blue-500", @filter != "active" && "bg-white text-zinc-700 hover:bg-zinc-50 dark:bg-zinc-900 dark:text-zinc-300 dark:hover:bg-zinc-800" ]} > Active Alerts
<%= if Enum.empty?(@alerts) do %>
<.icon name="hero-bell-slash" class="mx-auto h-12 w-12 text-zinc-400 dark:text-zinc-600" />

No alerts

<%= if @filter == "active" do %> There are no active alerts for this organization. <% else %> No alerts have been triggered yet. <% end %>

<% else %>
<%= for alert <- @alerts do %>
<%= case alert.alert_type do %> <% :equipment_down -> %> <.icon name="hero-exclamation-triangle" class="h-4 w-4" /> Equipment Down <% :equipment_up -> %> <.icon name="hero-check-circle" class="h-4 w-4" /> Equipment Recovered <% end %> <%= if alert.resolved_at do %> Resolved <% end %> <%= if alert.acknowledged_at do %> Acknowledged <% end %>

<.link navigate={ ~p"/orgs/#{@current_organization.slug}/equipment/#{alert.equipment.id}" } class="text-blue-600 hover:text-blue-700 dark:text-blue-400 dark:hover:text-blue-300" > {alert.equipment.name}

{alert.message}

Triggered: {Calendar.strftime(alert.triggered_at, "%Y-%m-%d %H:%M:%S UTC")}
<%= if alert.acknowledged_at do %>
Acknowledged: {Calendar.strftime(alert.acknowledged_at, "%Y-%m-%d %H:%M:%S UTC")} <%= if alert.acknowledged_by do %> by {alert.acknowledged_by.email} <% end %>
<% end %> <%= if alert.resolved_at do %>
Resolved: {Calendar.strftime(alert.resolved_at, "%Y-%m-%d %H:%M:%S UTC")}
<% end %>
Site: <.link navigate={ ~p"/orgs/#{@current_organization.slug}/sites/#{alert.equipment.site.id}" } class="text-blue-600 hover:text-blue-700 dark:text-blue-400 dark:hover:text-blue-300" > {alert.equipment.site.name}
<%= if alert.alert_type == :equipment_down && is_nil(alert.acknowledged_at) && is_nil(alert.resolved_at) do %> <.button phx-click="acknowledge" phx-value-id={alert.id} variant="primary"> <.icon name="hero-check" class="h-4 w-4" /> Acknowledge <% end %>
<% end %>
<% end %>