Graham McIntire
c86ca57864
Dynamically update page title emoji when device/alert status changes: - Add PubSub broadcasts when alerts are created/resolved - Create StatusTitleComponent LiveComponent to subscribe to alert changes - Add StatusTitle JavaScript hook to update document.title in real-time - Subscribe to organization:alerts channel on LiveView mount - Push emoji update events when alert status changes This provides immediate visual feedback in browser tabs when critical/warning/healthy status changes without requiring page refresh.
41 lines
1.2 KiB
Elixir
41 lines
1.2 KiB
Elixir
defmodule ToweropsWeb.Live.Components.StatusTitleComponent do
|
|
@moduledoc """
|
|
LiveComponent that subscribes to organization alert changes and updates the page title emoji.
|
|
"""
|
|
use ToweropsWeb, :live_component
|
|
|
|
alias ToweropsWeb.Helpers.StatusHelpers
|
|
|
|
def mount(socket) do
|
|
{:ok, socket}
|
|
end
|
|
|
|
def update(%{organization_id: org_id}, socket) do
|
|
if connected?(socket) do
|
|
Phoenix.PubSub.subscribe(Towerops.PubSub, "organization:#{org_id}:alerts")
|
|
end
|
|
|
|
{:ok, assign(socket, :organization_id, org_id)}
|
|
end
|
|
|
|
def handle_info({:alert_changed, _org_id}, socket) do
|
|
# Get the organization from the parent socket
|
|
org_id = socket.assigns.organization_id
|
|
organization = Towerops.Organizations.get_organization!(org_id)
|
|
|
|
if organization do
|
|
emoji = StatusHelpers.status_emoji(organization)
|
|
# Push event to JavaScript hook to update the browser title
|
|
{:noreply, push_event(socket, "update_status_emoji", %{emoji: emoji})}
|
|
else
|
|
{:noreply, socket}
|
|
end
|
|
end
|
|
|
|
def render(assigns) do
|
|
~H"""
|
|
<div id="status-title-watcher" phx-hook="StatusTitle" phx-target={@myself} style="display: none;">
|
|
</div>
|
|
"""
|
|
end
|
|
end
|