From 6b3a498f082111b962cf9f19d99beaf0d8b17e36 Mon Sep 17 00:00:00 2001
From: Krishna Penukonda <krishna@penukonda.me>
Date: Tue, 14 Jul 2026 05:57:32 +0000
Subject: [PATCH] fix: make full sidebar document item area clickable

The root document button already wrapped its click target around the full
item area. Apply the same pattern to individual document items within
namespaces so the entire row is clickable, not just the text.
---
 lib/unfinal_web/components/layouts.ex | 11 +++++------
 lib/unfinal_web/live/editor_live.ex   | 12 ++++++------
 2 files changed, 11 insertions(+), 12 deletions(-)

diff --git a/lib/unfinal_web/components/layouts.ex b/lib/unfinal_web/components/layouts.ex
index ce23b07..465c42a 100644
--- a/lib/unfinal_web/components/layouts.ex
+++ b/lib/unfinal_web/components/layouts.ex
@@ -65,14 +65,13 @@ defmodule UnfinalWeb.Layouts do
               class="mx-3 my-2 border-t border-stone-200/80"
             />
 
-            <div
+            <a
               :for={path <- @page_paths}
-              class="flex items-center justify-between rounded-lg px-3 py-1.5 hover:bg-white/50 hover:text-stone-950"
+              href={path}
+              class="block rounded-lg px-3 py-1.5 hover:bg-white/50 hover:text-stone-950"
             >
-              <a href={path} class="flex-1 truncate">
-                {display_page_path(path)}
-              </a>
-            </div>
+              {display_page_path(path)}
+            </a>
           </div>
         </nav>
 
diff --git a/lib/unfinal_web/live/editor_live.ex b/lib/unfinal_web/live/editor_live.ex
index f6f6708..794220d 100644
--- a/lib/unfinal_web/live/editor_live.ex
+++ b/lib/unfinal_web/live/editor_live.ex
@@ -349,12 +349,12 @@ defmodule UnfinalWeb.EditorLive do
 
               <div
                 :if={@path != @root_page_path and @path not in @page_paths}
-                class="group flex items-center justify-between rounded-lg bg-white/70 px-3 py-2 font-medium text-stone-950 shadow-sm shadow-stone-200/50"
+                class="group relative rounded-lg bg-white/70 font-medium text-stone-950 shadow-sm shadow-stone-200/50"
               >
-                <a href={@path} class="flex-1 truncate">
+                <a href={@path} class="block truncate rounded-lg px-3 py-2 pr-8">
                   {display_page_path(@path)}
                 </a>
-                <div :if={@writer?} class="relative">
+                <div :if={@writer?} class="absolute right-3 top-1/2 -translate-y-1/2">
                   <button
                     type="button"
                     phx-click="toggle_page_menu"
@@ -382,15 +382,15 @@ defmodule UnfinalWeb.EditorLive do
               <div
                 :for={path <- @page_paths}
                 class={[
-                  "group flex items-center justify-between rounded-lg px-3 py-1.5 hover:bg-white/50 hover:text-stone-950",
+                  "group relative rounded-lg hover:bg-white/50 hover:text-stone-950",
                   path == @path &&
                     "bg-white/70 font-medium text-stone-950 shadow-sm shadow-stone-200/50"
                 ]}
               >
-                <a href={path} class="flex-1 truncate">
+                <a href={path} class="block truncate rounded-lg px-3 py-1.5 pr-8">
                   {display_page_path(path)}
                 </a>
-                <div :if={@writer?} class="relative">
+                <div :if={@writer?} class="absolute right-3 top-1/2 -translate-y-1/2">
                   <button
                     type="button"
                     phx-click="toggle_page_menu"