From 446b6bd864f065f0ae0088264f65e6fb01df380e Mon Sep 17 00:00:00 2001
From: Jonathon Leight <jonathon.leight@jleight.com>
Date: Tue, 7 Jul 2026 21:39:35 -0400
Subject: [PATCH] Better modal scrolling

---
 internal/core/endpoints_repeater_test.go      |  9 ++++++++
 internal/core/templates/share.html            |  2 +-
 internal/core/templates/share_invite_new.html | 16 +++++++-------
 internal/core/templates/share_org_limits.html | 22 +++++++++----------
 internal/web/templates/org_access.html        |  2 +-
 5 files changed, 30 insertions(+), 21 deletions(-)

diff --git a/internal/core/endpoints_repeater_test.go b/internal/core/endpoints_repeater_test.go
index f3f4b06..6d94a01 100644
--- a/internal/core/endpoints_repeater_test.go
+++ b/internal/core/endpoints_repeater_test.go
@@ -232,6 +232,11 @@ func TestRepeaterOrgLimitsPosts(t *testing.T) {
 	if !strings.Contains(frag, "Manage access") || !strings.Contains(frag, `name="cmd"`) || !strings.Contains(frag, `name="include"`) {
 		t.Fatalf("manage-access fragment missing expected content:\n%s", frag)
 	}
+	// Footer buttons live outside the form (referencing it via form=) so the modal
+	// body can scroll with header/footer pinned; guard that structure.
+	if !strings.Contains(frag, `form="org-access-form"`) {
+		t.Fatal("manage-access footer button should reference the form via form= (scrollable body)")
+	}
 	if strings.Contains(frag, "back-link") {
 		t.Fatal("limits fragment should be modal chrome, not a full page")
 	}
@@ -389,6 +394,10 @@ func TestCreateInviteWithCommands(t *testing.T) {
 	if !strings.Contains(frag, `name="description"`) || !strings.Contains(frag, `name="cmd"`) {
 		t.Fatalf("new-invite fragment missing expected fields:\n%s", frag)
 	}
+	// Footer button references the form via form= so the modal body scrolls.
+	if !strings.Contains(frag, `form="new-invite-form"`) {
+		t.Fatal("new-invite footer button should reference the form via form= (scrollable body)")
+	}
 	if strings.Contains(frag, "back-link") {
 		t.Fatal("new-invite fragment should be modal chrome, not a full page")
 	}
diff --git a/internal/core/templates/share.html b/internal/core/templates/share.html
index bfd056f..b29c8bc 100644
--- a/internal/core/templates/share.html
+++ b/internal/core/templates/share.html
@@ -113,7 +113,7 @@
 <!-- Shared modals; the People "Create single-use link" button and each org's
      "Manage access" button load their fragments here via htmx. -->
 <div class="modal modal-blur fade" id="invite-modal" tabindex="-1" aria-hidden="true">
-  <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
+  <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable modal-lg" role="document">
     <div class="modal-content" id="invite-modal-content"></div>
   </div>
 </div>
diff --git a/internal/core/templates/share_invite_new.html b/internal/core/templates/share_invite_new.html
index d022f31..90ed29f 100644
--- a/internal/core/templates/share_invite_new.html
+++ b/internal/core/templates/share_invite_new.html
@@ -6,8 +6,8 @@
   <h5 class="modal-title">Create single-use link</h5>
   <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
 </div>
-<form method="post" action="/repeaters/{{.Repeater.PublicID}}/share/link">
-  <div class="modal-body">
+<div class="modal-body">
+  <form method="post" action="/repeaters/{{.Repeater.PublicID}}/share/link" id="new-invite-form">
     <div class="mb-3">
       <label class="form-label" for="share_description">Description <span class="text-secondary">(optional)</span></label>
       <input type="text" class="form-control" id="share_description" name="description" placeholder="e.g. for Bob's modem" maxlength="100">
@@ -17,10 +17,10 @@
       afterwards. Risky commands can take over or brick the node; grant them only with care.
     </p>
     {{template "command-grid" .}}
-  </div>
-  <div class="modal-footer">
-    <button type="button" class="btn btn-link link-secondary" data-bs-dismiss="modal">Cancel</button>
-    <button type="submit" class="btn btn-primary">Create link</button>
-  </div>
-</form>
+  </form>
+</div>
+<div class="modal-footer">
+  <button type="button" class="btn btn-link link-secondary" data-bs-dismiss="modal">Cancel</button>
+  <button type="submit" form="new-invite-form" class="btn btn-primary">Create link</button>
+</div>
 {{end}}
diff --git a/internal/core/templates/share_org_limits.html b/internal/core/templates/share_org_limits.html
index f73cf9d..d25c338 100644
--- a/internal/core/templates/share_org_limits.html
+++ b/internal/core/templates/share_org_limits.html
@@ -8,8 +8,8 @@
   <h5 class="modal-title">Manage access — {{.Org.Name}}</h5>
   <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
 </div>
-<form method="post" action="/repeaters/{{.Repeater.PublicID}}/orgs/{{.Org.Slug}}/limits">
-  <div class="modal-body">
+<div class="modal-body">
+  <form method="post" action="/repeaters/{{.Repeater.PublicID}}/orgs/{{.Org.Slug}}/limits" id="org-access-form">
     <label class="form-check form-switch mb-3">
       <input class="form-check-input" type="checkbox" name="include" value="1" {{if not .Excluded}}checked{{end}}>
       <span class="form-check-label"><strong>Shared with {{.Org.Name}}</strong></span>
@@ -38,13 +38,13 @@
       admins; <span class="badge bg-azure-lt">Members</span> to everyone.
     </p>
     {{template "command-grid" .}}
-  </div>
-  <div class="modal-footer">
-    {{if .Restricted}}
-    <button type="submit" name="clear" value="1" class="btn btn-link link-secondary me-auto">Remove restriction (allow all)</button>
-    {{end}}
-    <button type="button" class="btn btn-link link-secondary" data-bs-dismiss="modal">Cancel</button>
-    <button type="submit" class="btn btn-primary">Save</button>
-  </div>
-</form>
+  </form>
+</div>
+<div class="modal-footer">
+  {{if .Restricted}}
+  <button type="submit" form="org-access-form" name="clear" value="1" class="btn btn-link link-secondary me-auto">Remove restriction (allow all)</button>
+  {{end}}
+  <button type="button" class="btn btn-link link-secondary" data-bs-dismiss="modal">Cancel</button>
+  <button type="submit" form="org-access-form" class="btn btn-primary">Save</button>
+</div>
 {{end}}
diff --git a/internal/web/templates/org_access.html b/internal/web/templates/org_access.html
index e943c23..3d007a5 100644
--- a/internal/web/templates/org_access.html
+++ b/internal/web/templates/org_access.html
@@ -29,7 +29,7 @@
      their org-limits fragment into via htmx. */}}
 {{define "limits-modal-shell"}}
 <div class="modal modal-blur fade" id="limits-modal" tabindex="-1" aria-hidden="true">
-  <div class="modal-dialog modal-dialog-centered modal-lg" role="document">
+  <div class="modal-dialog modal-dialog-centered modal-dialog-scrollable modal-lg" role="document">
     <div class="modal-content" id="limits-modal-content"></div>
   </div>
 </div>