graham/towerops
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Fix admin layout to use proper Phoenix component pattern

Browse source 
The admin layout was incorrectly defined as a separate .html.heex file
using @inner_content. Phoenix components should use render_slot(@inner_block).

Moved admin layout definition into layouts.ex as a proper function
component, matching the pattern used by app/1 and authenticated/1 layouts.
This commit is contained in:
Graham McIntire 2026-01-06 13:04:22 -06:00
parent 354e500405
commit 20101201c6
No known key found for this signature in database
2 changed files with 65 additions and 37 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

65
lib/towerops_web/components/layouts.ex
View file

@ -302,4 +302,69 @@ defmodule ToweropsWeb.Layouts do
</div>
"""
end
@doc """
Renders the admin layout.
Use this for admin pages that require superuser access.
## Examples
<Layouts.admin flash={@flash}>
<h1>Admin Content</h1>
</Layouts.admin>
"""
attr :flash, :map, required: true, doc: "the map of flash messages"
slot :inner_block, required: true
def admin(assigns) do
~H"""
<main class="min-h-screen bg-zinc-50 dark:bg-zinc-950">
<nav class="bg-white border-b border-zinc-200 dark:border-zinc-800 dark:bg-zinc-900">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex justify-between h-16">
<div class="flex">
<.link
navigate={~p"/admin"}
class="flex items-center text-xl font-bold text-zinc-900 dark:text-zinc-100"
>
Towerops Admin
</.link>
<div class="hidden sm:ml-6 sm:flex sm:space-x-8">
<.link
navigate={~p"/admin/users"}
class="inline-flex items-center px-1 pt-1 text-sm font-medium text-zinc-700 hover:text-zinc-900 dark:text-zinc-300 dark:hover:text-zinc-100"
>
Users
</.link>
<.link
navigate={~p"/admin/organizations"}
class="inline-flex items-center px-1 pt-1 text-sm font-medium text-zinc-700 hover:text-zinc-900 dark:text-zinc-300 dark:hover:text-zinc-100"
>
Organizations
</.link>
</div>
</div>
<div class="flex items-center">
<.link
navigate={~p"/orgs"}
class="text-sm text-zinc-600 hover:text-zinc-900 dark:text-zinc-400 dark:hover:text-zinc-100"
>
Back to App
</.link>
</div>
</div>
</div>
</nav>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
{render_slot(@inner_block)}
</div>
</main>
<.flash_group flash={@flash} />
"""
end
end

37
lib/towerops_web/components/layouts/admin.html.heex
View file

@ -1,37 +0,0 @@
<main class="min-h-screen bg-zinc-50">
<nav class="bg-white border-b border-zinc-200">
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8">
<div class="flex justify-between h-16">
<div class="flex">
<.link navigate={~p"/admin"} class="flex items-center text-xl font-bold text-zinc-900">
Towerops Admin
</.link>
<div class="hidden sm:ml-6 sm:flex sm:space-x-8">
<.link
navigate={~p"/admin/users"}
class="inline-flex items-center px-1 pt-1 text-sm font-medium text-zinc-700 hover:text-zinc-900"
>
Users
</.link>
<.link
navigate={~p"/admin/organizations"}
class="inline-flex items-center px-1 pt-1 text-sm font-medium text-zinc-700 hover:text-zinc-900"
>
Organizations
</.link>
</div>
</div>
<div class="flex items-center">
<.link navigate={~p"/orgs"} class="text-sm text-zinc-600 hover:text-zinc-900">
Back to App
</.link>
</div>
</div>
</div>
</nav>
<div class="max-w-7xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
<.flash_group flash={@flash} />
{@inner_content}
</div>
</main>