Improve onboarding: redirect to site page after creation

- After creating a site, redirect to site detail page instead of list
- Show helpful empty state on site page with instructions to add equipment
- Flash message guides user to add their first device
This commit is contained in:
Graham McIntire 2026-01-04 12:22:50 -06:00
parent d09d64f7bd
commit 50e7fa13af
No known key found for this signature in database
2 changed files with 23 additions and 4 deletions

View file

@ -63,11 +63,11 @@ defmodule ToweropsWeb.SiteLive.Form do
site_params = Map.put(site_params, "organization_id", socket.assigns.organization.id)
case Sites.create_site(site_params) do
{:ok, _site} ->
{:ok, site} ->
{:noreply,
socket
|> put_flash(:info, "Site created successfully")
|> push_navigate(to: ~p"/orgs/#{socket.assigns.organization.slug}/sites")}
|> put_flash(:info, "Site created successfully! Now add your first device.")
|> push_navigate(to: ~p"/orgs/#{socket.assigns.organization.slug}/sites/#{site.id}")}
{:error, %Ecto.Changeset{} = changeset} ->
{:noreply, assign(socket, :form, to_form(changeset))}

View file

@ -80,7 +80,26 @@
</div>
<%= if @equipment == [] do %>
<p class="text-sm text-zinc-600 dark:text-zinc-400">No equipment at this site yet.</p>
<div class="rounded-lg border-2 border-dashed border-zinc-300 bg-zinc-50 p-8 text-center dark:border-zinc-700 dark:bg-zinc-900">
<.icon name="hero-server" class="mx-auto h-12 w-12 text-zinc-400 dark:text-zinc-600" />
<h4 class="mt-4 text-base font-semibold text-zinc-900 dark:text-zinc-100">
Add your first device
</h4>
<p class="mt-2 text-sm text-zinc-600 dark:text-zinc-400">
Start monitoring by adding network equipment to this site.
</p>
<p class="mt-1 text-sm text-zinc-600 dark:text-zinc-400">
You can add routers, switches, servers, or any device with an IP address.
</p>
<div class="mt-6">
<.button
navigate={~p"/orgs/#{@current_organization.slug}/equipment/new?site_id=#{@site.id}"}
variant="primary"
>
<.icon name="hero-plus" class="h-5 w-5" /> Add Equipment
</.button>
</div>
</div>
<% else %>
<div class="space-y-3">
<div