Group manage registrants header actions into dropdowns (#1568)

* Group manage registrants header actions into dropdowns

The action bar had grown to 7 flat, undifferentiated links with no
hierarchy. Collapse them into two scoped dropdowns plus one link so the
header stays usable as more form entry points get added:

- Forms: Add registrant, Public registration, Scholarship version
- Bulk actions: Send reminder, Download CSV
- Edit event sits apart on the right since it acts on the event, not
  the registrants

Also drops the redundant "View" link (duplicated the back link) and
relabels for clarity ("Edit" -> "Edit event", "New registration" ->
"Add registrant").

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* Surface Add registrant as primary button outside Forms dropdown

Adding a registrant is the primary action on this page, so burying it in
a dropdown hurt discoverability. Pull it out as a primary-outline button
(matching the New event registration button on the registrations index).

The Forms dropdown now holds only the two public-form links, which makes
its label accurate; it renders only when a registration form exists
(otherwise both items would be gated away, leaving an empty menu).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* Match index convention: primary action far right, design-system buttons

Reorder the header so emphasis increases left to right and ends on the
primary action, matching the new/add button placement on the index pages
(event_registrations, organizations, events all put the primary button
far right):

  Edit event   Forms ▾   Bulk actions ▾        Add registrant

Also swap the two dropdown triggers from ad-hoc classes to the btn
design-system variant (btn-utility-outline) so their height, radius,
padding, and shadow match the primary button instead of sitting shorter,
and drop the now-unneeded Edit event divider.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* Add rel=noopener noreferrer to target=_blank form links

Prevent reverse-tabnabbing on the public-form links opened in a new
tab, matching the existing convention in _videoconference_link.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* Carry as_visitor and scholarship_form gating into forms menu

Main added as_visitor: true to the public-registration links and gated
the scholarship link on event.scholarship_form. Those lived on the
inline links this branch replaced with the Forms dropdown, so the
rebase dropped them — reapply them inside _forms_menu.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* Hide Forms dropdown when no registration or scholarship form exists

Gate each form link on its own form's presence and the whole dropdown
on either being present, so admins do not see an empty Forms menu (or
a broken public-registration link) when neither form is configured.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* Always show Forms dropdown; offer Select a form when none configured

When neither a registration nor scholarship form is configured, the
Forms menu now links to the event edit forms section instead of
hiding, so admins always have a path to set one up.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* Add base-form management link to Forms dropdown

Give admins a way to reach the form configuration from the Forms menu:
Change base form when one is set, Enable forms when none is.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* Rename Forms menu to Form actions; expand form section on anchor

Rename the _forms_menu partial to _form_actions_menu and relabel the
trigger 'Form actions' to better describe what it does (open public
forms, change/enable the base form).

Add a reveal-section Stimulus controller so the Change base form /
Enable forms links land on the event edit page with the Registration
Form section expanded and scrolled into view, rather than collapsed or
off-screen.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>

* Potential fix for pull request finding

Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

---------

Co-authored-by: Claude Opus 4.8 <noreply@anthropic.com>
Co-authored-by: Copilot Autofix powered by AI <175728472+Copilot@users.noreply.github.com>

Author: 3 people

AGENTS.md

@@ -71,7 +71,7 @@ This codebase (Rails 8.1)
 | Directory | Purpose |
 |---|---|
 | `app/frontend/entrypoints/` | Vite entry points (application.js, application.css) |
-| `app/frontend/javascript/controllers/` | Stimulus controllers (34) |
+| `app/frontend/javascript/controllers/` | Stimulus controllers (35) |
 | `app/frontend/javascript/rhino/` | Rich text editor customizations (mentions, grid) |
 | `app/frontend/stylesheets/` | Tailwind CSS and component styles |
 
@@ -272,6 +272,7 @@ end
 - `prefetch_lazy` — Prefetch lazy-loaded content
 - `print_options` — Print options toggle for analytics
 - `remote_select` — AJAX-powered select dropdown
+- `reveal_section` — Expand a collapsible section and scroll to it when loaded via matching URL hash
 - `rhino_source` — Rich text editor integration
 - `searchable_checkbox` — TomSelect checkbox-style multi-select
 - `searchable_select` — Tom Select autocomplete

app/frontend/javascript/controllers/index.js

@@ -75,6 +75,9 @@ application.register("prefetch-lazy", PrefetchLazyController)
 import PrintOptionsController from "./print_options_controller"
 application.register("print-options", PrintOptionsController)
 
+import RevealSectionController from "./reveal_section_controller"
+application.register("reveal-section", RevealSectionController)
+
 import RhinoSourceController from "./rhino_source_controller"
 application.register("rhino-source", RhinoSourceController)
 

app/frontend/javascript/controllers/reveal_section_controller.js

@@ -0,0 +1,25 @@
+import { Controller } from "@hotwired/stimulus"
+
+// Expands a collapsible section and scrolls it into view when the page loads
+// with a matching URL hash — e.g. when linked from another page so the user
+// lands on the section already open rather than collapsed or scrolled past.
+//
+//   <div data-controller="dropdown reveal-section"
+//        data-reveal-section-anchor-value="registration_form_section"
+//        data-reveal-section-target="toggle"> ... the toggle button
+//        data-reveal-section-target="content"> ... the collapsible body
+//
+// The toggle target is clicked (reusing the dropdown controller) only when the
+// content is currently hidden, keeping the dropdown's open/closed state honest.
+export default class extends Controller {
+  static targets = ["toggle", "content"]
+  static values = { anchor: String }
+
+  connect() {
+    if (window.location.hash.slice(1) !== this.anchorValue) return
+    if (this.hasContentTarget && this.contentTarget.classList.contains("hidden")) {
+      this.toggleTarget.click()
+    }
+    this.element.scrollIntoView({ behavior: "smooth", block: "start" })
+  }
+}

app/views/events/_bulk_actions_menu.html.erb

@@ -0,0 +1,18 @@
+<% dropdown_id = "bulk-actions-menu-#{SecureRandom.hex(4)}" %>
+<% item_class = "block px-4 py-2 text-sm text-gray-700 hover:bg-gray-50" %>
+<div data-controller="dropdown" class="relative">
+  <button type="button"
+          data-action="dropdown#toggle"
+          data-dropdown-payload-param='[{"<%= dropdown_id %>":"hidden"}]'
+          class="btn btn-utility-outline">
+    <span>Bulk actions</span>
+    <i class="fa-solid fa-chevron-down w-3 h-3 text-gray-400"></i>
+  </button>
+
+  <div id="<%= dropdown_id %>"
+       data-dropdown-target="content"
+       class="hidden absolute right-0 z-10 mt-1 bg-white border border-gray-200 rounded-md shadow-lg py-1 min-w-[180px]">
+    <%= link_to "Send reminder", preview_reminder_event_path(@event), class: item_class %>
+    <%= link_to "Download CSV", manage_event_path(@event, format: :csv), class: item_class, data: { turbo_frame: "_top" } %>
+  </div>
+</div>

app/views/events/_form.html.erb

@@ -318,18 +318,21 @@
     </div>
 
     <% if allowed_to?(:manage?, @event) %>
-      <div class="admin-only registration-form-section" data-controller="dropdown">
+      <div class="admin-only registration-form-section"
+           data-controller="dropdown reveal-section"
+           data-reveal-section-anchor-value="registration_form_section">
         <button
           type="button"
           id="registration_form_button"
           class="flex items-center justify-between cursor-pointer w-full bg-gray-500 text-white hover:bg-gray-300 px-3 py-2 rounded-t-md"
           data-action="dropdown#toggle"
+          data-reveal-section-target="toggle"
           data-dropdown-payload-param='[{"registration_form_section":"hidden"}, {"registration_form_arrow":"rotate-180"}, {"registration_form_button":"rounded-t-md rounded-md"}]'>
           Registration Form
           <i id="registration_form_arrow" class="fa-solid fa-chevron-down w-4 h-4 transition-transform duration-300 rotate-180"></i>
         </button>
 
-        <div id="registration_form_section" class="border border-gray-300 p-4 rounded-b-md">
+        <div id="registration_form_section" class="border border-gray-300 p-4 rounded-b-md" data-reveal-section-target="content">
           <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
             <div>
               <p class="text-sm mb-2">

app/views/events/_form_actions_menu.html.erb

@@ -0,0 +1,28 @@
+<% dropdown_id = "form-actions-menu-#{SecureRandom.hex(4)}" %>
+<% item_class = "block px-4 py-2 text-sm text-gray-700 hover:bg-gray-50" %>
+<div data-controller="dropdown" class="relative">
+  <button type="button"
+          data-action="dropdown#toggle"
+          data-dropdown-payload-param='[{"<%= dropdown_id %>":"hidden"}]'
+          class="btn btn-utility-outline">
+    <span>Form actions</span>
+    <i class="fa-solid fa-chevron-down w-3 h-3 text-gray-400"></i>
+  </button>
+
+  <div id="<%= dropdown_id %>"
+       data-dropdown-target="content"
+       class="hidden absolute right-0 z-10 mt-1 bg-white border border-gray-200 rounded-md shadow-lg py-1 min-w-[180px]">
+    <% if @event.event_forms.registration.exists? || @event.scholarship_form %>
+      <% if @event.event_forms.registration.exists? %>
+        <%= link_to "Public registration", new_event_public_registration_path(@event, as_visitor: true), class: item_class, target: "_blank", rel: "noopener noreferrer" %>
+      <% end %>
+      <% if @event.scholarship_form %>
+        <%= link_to "Scholarship version", new_event_public_registration_path(@event, scholarship_requested: true, as_visitor: true), class: item_class, target: "_blank", rel: "noopener noreferrer" %>
+      <% end %>
+      <div class="my-1 border-t border-gray-100"></div>
+      <%= link_to "Change base form", edit_event_path(@event, anchor: "registration_form_section"), class: item_class %>
+    <% else %>
+      <%= link_to "Enable forms", edit_event_path(@event, anchor: "registration_form_section"), class: item_class %>
+    <% end %>
+  </div>
+</div>

app/views/events/manage.html.erb

@@ -10,20 +10,15 @@
         <%= @event.title %>
       </p>
     </div>
-    <div class="flex gap-2">
-      <%= link_to "Send reminder", preview_reminder_event_path(@event), class: "text-sm text-gray-500 hover:text-gray-700 px-2 py-1" %>
-      <%= link_to "Download CSV", manage_event_path(@event, format: :csv), class: "text-sm text-gray-500 hover:text-gray-700 px-2 py-1", data: { turbo_frame: "_top" } %>
-      <%= link_to "View", event_path(@event), class: "text-sm text-gray-500 hover:text-gray-700 px-2 py-1" %>
+    <div class="flex items-center gap-2">
       <% if allowed_to?(:edit?, @event) %>
-        <%= link_to "Edit", edit_event_path(@event), class: "text-sm text-gray-500 hover:text-gray-700 px-2 py-1" %>
-        <%= link_to "New registration", new_event_registration_path(event_id: @event.id, return_to: "manage"), class: "text-sm text-gray-500 hover:text-gray-700 px-2 py-1" %>
-        <% if @event.event_forms.registration.exists? %>
-          <%= link_to "Public registration", new_event_public_registration_path(@event, as_visitor: true), class: "text-sm text-gray-500 hover:text-gray-700 px-2 py-1", target: "_blank" %>
-          <% if @event.scholarship_form %>
-            <%= link_to "Scholarship version", new_event_public_registration_path(@event, scholarship_requested: true, as_visitor: true), class: "text-sm text-gray-500 hover:text-gray-700 px-2 py-1", target: "_blank" %>
-          <% end %>
-        <% end %>
+        <%= link_to "Edit event", edit_event_path(@event), class: "text-sm text-gray-500 hover:text-gray-700 px-2 py-1" %>
+        <%= render "form_actions_menu" %>
       <% end %>
+      <%= render "bulk_actions_menu" %>
+<% if allowed_to?(:new?, EventRegistration) %>
+  <%= link_to "Add registrant", new_event_registration_path(event_id: @event.id, return_to: "manage"), class: "admin-only bg-blue-100 btn btn-primary-outline" %>
+<% end %>
     </div>
   </div>