add admin UX quick wins: nav guard, block descriptions, input labels
All checks were successful
deploy / deploy (push) Successful in 1m16s

- rename "Providers" to "Print providers" in sidebar (#110)
- add LiveView navigation guard to EditorKeyboard hook — intercepts
  link clicks in capture phase when editor has unsaved changes (#103)
- add description field to all 26 block types, shown as subtitle in
  block picker; filter searches descriptions too (#104)
- add visible column headers (Label / Path) and proper sr-only labels
  with for attributes on nav editor inputs (#106)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
jamey
2026-02-28 20:11:13 +00:00
parent f4bf9c13e6
commit 32cd642110
6 changed files with 94 additions and 7 deletions

View File

@@ -416,7 +416,8 @@ defmodule BerrypodWeb.BlockEditorComponents do
filtered =
assigns.allowed_blocks
|> Enum.filter(fn {_type, def} ->
filter == "" or String.contains?(String.downcase(def.name), filter)
filter == "" or String.contains?(String.downcase(def.name), filter) or
String.contains?(String.downcase(Map.get(def, :description, "")), filter)
end)
|> Enum.sort_by(fn {_type, def} -> def.name end)
@@ -454,7 +455,10 @@ defmodule BerrypodWeb.BlockEditorComponents do
class="block-picker-item"
>
<.icon name={def.icon} class="size-5" />
<span>{def.name}</span>
<span class="block-picker-item-name">{def.name}</span>
<span :if={def[:description]} class="block-picker-item-desc">
{def.description}
</span>
</button>
<p :if={@filtered_blocks == []} class="block-picker-empty">

View File

@@ -91,7 +91,7 @@
navigate={~p"/admin/providers"}
class={admin_nav_active?(@current_path, "/admin/providers")}
>
<.icon name="hero-link" class="size-5" /> Providers
<.icon name="hero-link" class="size-5" /> Print providers
</.link>
</li>
<li>

View File

@@ -158,13 +158,19 @@ defmodule BerrypodWeb.Admin.Navigation do
</h3>
<div class="space-y-2">
<div :if={@items != []} class="nav-editor-labels" aria-hidden="true">
<span>Label</span>
<span>Path</span>
</div>
<div
:for={{item, idx} <- Enum.with_index(@items)}
class="nav-editor-item"
>
<div class="nav-editor-fields">
<label class="sr-only" for={"nav-#{@section}-#{idx}-label"}>Label</label>
<input
type="text"
id={"nav-#{@section}-#{idx}-label"}
value={item["label"]}
placeholder="Label"
phx-blur="update_item"
@@ -173,8 +179,10 @@ defmodule BerrypodWeb.Admin.Navigation do
phx-value-field="label"
class="admin-input nav-editor-input"
/>
<label class="sr-only" for={"nav-#{@section}-#{idx}-href"}>Path</label>
<input
type="text"
id={"nav-#{@section}-#{idx}-href"}
value={item["href"]}
placeholder="/path"
phx-blur="update_item"