init

lib/webmon_web/live/website_live/form_component.ex

@@ -0,0 +1,91 @@
+defmodule WebmonWeb.WebsiteLive.FormComponent do
+  use WebmonWeb, :live_component
+
+  alias Webmon.Monitor
+
+  @impl true
+  def render(assigns) do
+    ~H"""
+    <div>
+      <.header>
+        <%= @title %>
+        <:subtitle>Use this form to manage website records in your database.</:subtitle>
+      </.header>
+
+      <.simple_form
+        for={@form}
+        id="website-form"
+        phx-target={@myself}
+        phx-change="validate"
+        phx-submit="save"
+      >
+        <.input field={@form[:name]} type="text" label="Name" />
+        <.input field={@form[:url]} type="text" label="Url" />
+        <:actions>
+          <.button phx-disable-with="Saving...">Save Website</.button>
+        </:actions>
+      </.simple_form>
+    </div>
+    """
+  end
+
+  @impl true
+  def update(%{website: website} = assigns, socket) do
+    changeset = Monitor.change_website(website)
+
+    {:ok,
+     socket
+     |> assign(assigns)
+     |> assign_form(changeset)}
+  end
+
+  @impl true
+  def handle_event("validate", %{"website" => website_params}, socket) do
+    changeset =
+      socket.assigns.website
+      |> Monitor.change_website(website_params)
+      |> Map.put(:action, :validate)
+
+    {:noreply, assign_form(socket, changeset)}
+  end
+
+  def handle_event("save", %{"website" => website_params}, socket) do
+    save_website(socket, socket.assigns.action, website_params)
+  end
+
+  defp save_website(socket, :edit, website_params) do
+    case Monitor.update_website(socket.assigns.website, website_params) do
+      {:ok, website} ->
+        notify_parent({:saved, website})
+
+        {:noreply,
+         socket
+         |> put_flash(:info, "Website updated successfully")
+         |> push_patch(to: socket.assigns.patch)}
+
+      {:error, %Ecto.Changeset{} = changeset} ->
+        {:noreply, assign_form(socket, changeset)}
+    end
+  end
+
+  defp save_website(socket, :new, website_params) do
+    case Monitor.create_website(website_params) do
+      {:ok, website} ->
+        notify_parent({:saved, website})
+
+        {:noreply,
+         socket
+         |> put_flash(:info, "Website created successfully")
+         |> push_patch(to: socket.assigns.patch)}
+
+      {:error, %Ecto.Changeset{} = changeset} ->
+        {:noreply, assign_form(socket, changeset)}
+    end
+  end
+
+  defp assign_form(socket, %Ecto.Changeset{} = changeset) do
+    assign(socket, :form, to_form(changeset))
+  end
+
+  defp notify_parent(msg), do: send(self(), {__MODULE__, msg})
+end

lib/webmon_web/live/website_live/index.ex

@@ -0,0 +1,88 @@
+defmodule WebmonWeb.WebsiteLive.Index do
+  require Logger
+  use WebmonWeb, :live_view
+
+  alias Webmon.Monitor
+  alias Webmon.Engine
+  alias Webmon.Monitor.Website
+
+  @impl true
+  def mount(_params, _session, socket) do
+    websites = Monitor.list_websites()
+
+    if connected?(socket) do
+      for website <- websites, do: monitor_website(website)
+    end
+
+    {:ok, stream(socket, :websites, websites)}
+  end
+
+  def monitor_website(website) do
+    me = self()
+    Engine.start_link(website, on_update: fn website -> send me, {:update, website} end)
+  end
+
+  @impl true
+  def handle_params(params, _url, socket) do
+    {:noreply, apply_action(socket, socket.assigns.live_action, params)}
+  end
+
+  defp apply_action(socket, :edit, %{"id" => id}) do
+    socket
+    |> assign(:page_title, "Edit Website")
+    |> assign(:website, Monitor.get_website!(id))
+  end
+
+  defp apply_action(socket, :new, _params) do
+    socket
+    |> assign(:page_title, "New Website")
+    |> assign(:website, %Website{})
+  end
+
+  defp apply_action(socket, :index, _params) do
+    socket
+    |> assign(:page_title, "Listing Websites")
+    |> assign(:website, nil)
+  end
+
+  @impl true
+  def handle_info({:update, website}, socket) do
+    {:noreply, stream_insert(socket, :websites, website)}
+  end
+
+  @impl true
+  def handle_info({WebmonWeb.WebsiteLive.FormComponent, {:saved, website}}, socket) do
+    monitor_website(website)
+    {:noreply, stream_insert(socket, :websites, website)}
+  end
+
+  @impl true
+  def handle_info(msg, socket) do
+    Logger.debug(msg)
+    {:noreply, socket}
+  end
+
+  @impl true
+  def handle_event("delete", %{"id" => id}, socket) do
+    website = Monitor.get_website!(id)
+    {:ok, _} = Monitor.delete_website(website)
+
+    {:noreply, stream_delete(socket, :websites, website)}
+  end
+
+  def website_status(%{website: %{status: {:ok, code, ping}}} = assigns) do
+    assigns = assigns
+      |> assign(:ping, ping)
+      |> assign(:code, code)
+    ~H"""
+    <span class=""><%= @ping %></span>
+    """
+  end
+
+  def website_status(%{website: _} = assigns) do
+    ~H"""
+    <span class="text-red">&mdash;</span>
+    """
+  end
+
+end

lib/webmon_web/live/website_live/index.html.heex

@@ -0,0 +1,44 @@
+<.header>
+  Listing Websites
+  <:actions>
+    <.link patch={~p"/websites/new"}>
+      <.button>New Website</.button>
+    </.link>
+  </:actions>
+</.header>
+
+<.table
+  id="websites"
+  rows={@streams.websites}
+  row_click={fn {_id, website} -> JS.navigate(~p"/websites/#{website}") end}
+>
+  <:col :let={{_id, website}} label="Name"><%= website.name %></:col>
+  <:col :let={{_id, website}} label="Url"><%= website.url %></:col>
+  <:col :let={{_id, website}} label="Status"><.website_status website={website} /></:col>
+
+  <:action :let={{_id, website}}>
+    <div class="sr-only">
+      <.link navigate={~p"/websites/#{website}"}>Show</.link>
+    </div>
+    <.link patch={~p"/websites/#{website}/edit"}>Edit</.link>
+  </:action>
+  <:action :let={{id, website}}>
+    <.link
+      phx-click={JS.push("delete", value: %{id: website.id}) |> hide("##{id}")}
+      data-confirm="Are you sure?"
+    >
+      Delete
+    </.link>
+  </:action>
+</.table>
+
+<.modal :if={@live_action in [:new, :edit]} id="website-modal" show on_cancel={JS.patch(~p"/websites")}>
+  <.live_component
+    module={WebmonWeb.WebsiteLive.FormComponent}
+    id={@website.id || :new}
+    title={@page_title}
+    action={@live_action}
+    website={@website}
+    patch={~p"/websites"}
+  />
+</.modal>

lib/webmon_web/live/website_live/show.ex

@@ -0,0 +1,21 @@
+defmodule WebmonWeb.WebsiteLive.Show do
+  use WebmonWeb, :live_view
+
+  alias Webmon.Monitor
+
+  @impl true
+  def mount(_params, _session, socket) do
+    {:ok, socket}
+  end
+
+  @impl true
+  def handle_params(%{"id" => id}, _, socket) do
+    {:noreply,
+     socket
+     |> assign(:page_title, page_title(socket.assigns.live_action))
+     |> assign(:website, Monitor.get_website!(id))}
+  end
+
+  defp page_title(:show), do: "Show Website"
+  defp page_title(:edit), do: "Edit Website"
+end

lib/webmon_web/live/website_live/show.html.heex

@@ -0,0 +1,28 @@
+<.header>
+  Website <%= @website.id %>
+  <:subtitle>This is a website record from your database.</:subtitle>
+  <:actions>
+    <.link patch={~p"/websites/#{@website}/show/edit"} phx-click={JS.push_focus()}>
+      <.button>Edit website</.button>
+    </.link>
+  </:actions>
+</.header>
+
+<.list>
+  <:item title="Name"><%= @website.name %></:item>
+  <:item title="Url"><%= @website.url %></:item>
+  <:item title="Status">...</:item>
+</.list>
+
+<.back navigate={~p"/websites"}>Back to websites</.back>
+
+<.modal :if={@live_action == :edit} id="website-modal" show on_cancel={JS.patch(~p"/websites/#{@website}")}>
+  <.live_component
+    module={WebmonWeb.WebsiteLive.FormComponent}
+    id={@website.id}
+    title={@page_title}
+    action={@live_action}
+    website={@website}
+    patch={~p"/websites/#{@website}"}
+  />
+</.modal>