Standardize (but also add consistent) headers on the admin (#18936)

* feat: update rubocop to fix some erb_lint errors

* standardize and add headers

* feat: update gemfile

* feat: revert change

* feat: rename gdpr delete requests to gdpr actions

* feat: remove the margin for consistency

* feat: add a skeleton for the api/v1/followers/users spec

* feat: add the operation block

* feat: add two global schema parameters

* feat: add a 'sort' parameter

* feat: add a successful response

* feat: add an unauthorized response

* feat: generate the json

* fix: indentation

* fix: oops remove the spec

app/views/admin/comments/index.html.erb

@@ -1,3 +1,5 @@
+<h1 class="crayons-title">Comments</h1>
+
 <%= paginate @comments %>
 
 <div class="flex flex-col gap-2">

app/views/admin/display_ads/index.html.erb

@@ -1,3 +1,5 @@
+<h1 class="crayons-title mb-3">Display Ads</h1>
+
 <div
   data-controller="confirmation-modal"
   data-confirmation-modal-root-selector-value="#confirmation-modal-root"
@@ -6,7 +8,7 @@
   data-confirmation-modal-size-value="m">
   <nav class="flex mb-4" aria-label="Display Ads navigation">
     <%= form_tag(admin_display_ads_path, method: "get") do %>
-     <%= text_field_tag(:search, params[:search], aria: { label: "Search" }, class: "crayons-header--search-input crayons-textfield", placeholder: "Search") %>
+     <%= text_field_tag(:search, params[:search], aria: { label: "Search" }, class: "crayons-header--search-input crayons-textfield", placeholder: "Search", autocomplete: "off") %>
     <% end %>
     <div class="ml-auto">
       <div class="justify-end">

app/views/admin/gdpr_delete_requests/index.html.erb

@@ -1,11 +1,11 @@
 <%= javascript_packs_with_chunks_tag "admin/users/gdprDeleteRequests", defer: true %>
 <div id="gdpr-delete-requests-content" class="crayons-card overflow-admin-main-layout-padding p-4 m:p-0">
   <header class="flex flex-col l:flex-row justify-between l:items-center p-0 m:p-7 pb-4">
-    <h1 class="crayons-title ml-3 l:ml-0">Members<span class="screen-reader-only"> (GDPR Delete Requests)</span></h1>
+    <h1 class="crayons-title ml-3 l:ml-0">GDPR Actions</h1>
     <%= form_with url: admin_gdpr_delete_requests_path, method: :get, local: true, class: "grow-1 mb-3 m:mb-0" do |f| %>
       <div class="hidden m:flex flex-col m:flex-row justify-between p-3 xl:px-0">
         <div class="flex grow-1 justify-end">
-          <%= paginate @gdpr_delete_requests, theme: "admin", scope: @gdpr_delete_requests, label: "Paginate GDPR delete requests", context: "top" %>
+          <%= paginate @gdpr_delete_requests, theme: "admin", scope: @gdpr_delete_requests, label: "Paginate GDPR actions", context: "top" %>
         </div>
         <%= render "admin/users/controls/search_field", f: f, placeholder: "Search members...", aria_label: "Search members by email or username", context: "large" %>
       </div>
@@ -64,14 +64,14 @@
 
   <% if @gdpr_delete_requests.empty? %>
     <div class="align-center flex flex-col my-auto py-7" id="empty-state-message-id">
-      <p class="fs-xl fw-normal mb-2">Awesome! All GDPR delete requests have been completed.</p>
+      <p class="fs-xl fw-normal mb-2">Awesome! All GDPR actions have been completed.</p>
       <p class="color-secondary">Check back again when you delete a member.</p>
     </div>
   <% end %>
   <!-- Large layout end -->
 
   <div class="flex justify-end p-4 m:px-7">
-    <%= paginate @gdpr_delete_requests, theme: "admin", scope: @gdpr_delete_requests, label: "Paginate GDPR delete requests", context: "bottom" %>
+    <%= paginate @gdpr_delete_requests, theme: "admin", scope: @gdpr_delete_requests, label: "Paginate GDPR actions", context: "bottom" %>
   </div>
 </div>
 <div id="gdpr-confirm-delete-modal" class="hidden">

app/views/admin/html_variants/index.html.erb

@@ -1,3 +1,5 @@
+<h1 class="crayons-title mb-3">HTML Variants</h1>
+
 <nav class="flex mb-4" aria-label="Sponsorships navigation">
   <div class="crayons-tabs">
     <%= link_to "Leaderboard", admin_html_variants_path, class: "crayons-tabs__item #{'crayons-tabs__item--current' if params[:state].blank?}" %>

app/views/admin/invitations/index.html.erb

@@ -2,7 +2,7 @@
 <div id="member-index-content" class="crayons-card overflow-admin-main-layout-padding p-0">
   <header class="flex flex-col p-4 xl:p-7 pb-4">
     <div class="flex flex-col l:flex-row justify-between l:items-center">
-      <h1 class="crayons-title ml-3 xl:ml-0">Members<span class="screen-reader-only"> (Invitations)</span></h1>
+      <h1 class="crayons-title">Invited Members<span class="screen-reader-only"> (Invitations)</span></h1>
     </div>
 
     <!-- Small screen layout start -->

app/views/admin/moderator_actions/index.html.erb

@@ -1,3 +1,4 @@
+<h1 class="crayons-title mb-3">Moderator Actions</h1>
 <div class="mb-6">
   <%= search_form_for @q, url: admin_moderator_actions_path, class: "inline-flex" do |f| %>
     <%= f.label :user_username_cont, "User", class: "screen-reader-only" %>

app/views/admin/mods/index.html.erb

@@ -1,13 +1,15 @@
+<h1 class="crayons-title mb-3">Mods</h1>
+
 <div class="mb-6 flex items-center flex-col m:flex-row">
   <ul class="crayons-navigation crayons-navigation--horizontal">
     <li>
       <a href="<%= admin_mods_path %>" class="crayons-navigation__item <%= "crayons-navigation__item--current" if params[:state].blank? %>">General Community</a>
     </li>
     <li>
-      <a href="<%= admin_mods_path(state: :tag_moderator) %>" class="crayons-navigation__item <%= "crayons-navigation__item--current" if params[:state] == 'tag_moderator' %>">Tag Mods</a>
+      <a href="<%= admin_mods_path(state: :tag_moderator) %>" class="crayons-navigation__item <%= "crayons-navigation__item--current" if params[:state] == "tag_moderator" %>">Tag Mods</a>
     </li>
     <li>
-      <a href="<%= admin_mods_path(state: :potential) %>" class="crayons-navigation__item <%= "crayons-navigation__item--current" if params[:state] == 'potential' %>">Potential Mods</a>
+      <a href="<%= admin_mods_path(state: :potential) %>" class="crayons-navigation__item <%= "crayons-navigation__item--current" if params[:state] == "potential" %>">Potential Mods</a>
     </li>
   </ul>
 

app/views/admin/navigation_links/index.html.erb

@@ -1,5 +1,5 @@
 <header class="mb-4">
-  <h1 class="crayons-title mb-0">Navigation</h1>
+  <h1 class="crayons-title mb-0">Navigation Links</h1>
   <p class="color-secondary">Configure the left sidebar navigation links that will appear at <a href="<%= app_url %>" class="c-link c-link--branded"><%= app_url %></a>.</p>
 </header>
 

app/views/admin/organizations/index.html.erb

@@ -1,6 +1,8 @@
+<h1 class="crayons-title mb-3">Organizations</h1>
+
 <%= form_tag(admin_organizations_path, method: "get") do %>
   <div class="inline-flex">
-    <%= search_field_tag(:search, params[:search], aria: { label: "Search" }, class: "crayons-textfield") %>
+    <%= search_field_tag(:search, params[:search], aria: { label: "Search" }, class: "crayons-textfield", autocomplete: "off") %>
     <%= submit_tag("Search", class: "crayons-btn ml-2") %>
   </div>
 <% end %>

app/views/admin/podcasts/index.html.erb

@@ -1,6 +1,8 @@
+<h1 class="crayons-title mb-3">Podcasts</h1>
+
 <%= form_tag(admin_podcasts_path, method: "get") do %>
   <div class="inline-flex">
-    <%= text_field_tag(:search, params[:search], aria: { label: "Search" }, class: "crayons-textfield") %>
+    <%= text_field_tag(:search, params[:search], aria: { label: "Search" }, class: "crayons-textfield", autocomplete: "off") %>
     <%= submit_tag("Search", class: "crayons-btn ml-2") %>
   </div>
 <% end %>

app/views/admin/privileged_reactions/index.html.erb

@@ -1,3 +1,5 @@
+<h1 class="crayons-title mb-3">Priviledged Reactions</h1>
+
 <div class="mb-6">
   <%= search_form_for @q, url: admin_privileged_reactions_path, class: "inline-flex" do |f| %>
     <%= f.search_field :user_username_cont, aria: { label: "Search" }, placeholder: "User", class: "crayons-textfield" %>

app/views/admin/profile_fields/index.html.erb

@@ -1,4 +1,5 @@
 <main id="profileFields">
+  <h1 class="crayons-title mb-3">Profile Fields</h1>
   <div class="crayons-notice mb-4">
     <p>
       To get started, add a group. Then you can add fields to each group. Groups and fields will show up in this same order on the user's profile page.

app/views/admin/tags/edit.html.erb

@@ -1,6 +1,6 @@
 <header class="flex mb-6 items-center">
   <div>
-    <h2 class="crayons-title">#<%= @tag.accessible_name %></h2>
+    <h1 class="crayons-title">#<%= @tag.accessible_name %></h2>
     <p>Tagged <%= @tag.taggings_count %> times</p>
   </div>
 

app/views/admin/tags/index.html.erb

@@ -1,3 +1,5 @@
+<h1 class="crayons-title mb-3">Tags</h1>
+
 <div class="flex items-center mb-6">
   <div class="crayons-tabs">
     <div>

app/views/admin/tags/new.html.erb

@@ -1,4 +1,4 @@
 <div class="crayons-card p-6">
-  <h4 class="mb-4">New Tag</h4>
+  <h1 class="crayons-title mb-3">New Tag</h1>
   <%= render "form", tag: @tag, badges_for_options: @badges_for_options %>
 </div>

cypress/e2e/seededFlows/adminFlows/users/gdprDeleteRequests.spec.js

@@ -8,7 +8,7 @@ describe('GDPR Delete Requests', () => {
   });
 
   it('confirms deletion of user', () => {
-    cy.findByRole('heading', { name: 'Members (GDPR Delete Requests)' });
+    cy.findByRole('heading', { name: 'GDPR Actions' });
     cy.findByRole('button', {
       name: 'Confirm user gdpr_delete_user deleted',
     }).click();
@@ -28,7 +28,7 @@ describe('GDPR Delete Requests', () => {
   });
 
   it('displays an empty state when there are no users to be confirmed as deleted', () => {
-    cy.findByRole('heading', { name: 'Members (GDPR Delete Requests)' });
+    cy.findByRole('heading', { name: 'GDPR Actions' });
     cy.findByRole('button', {
       name: 'Confirm user gdpr_delete_user deleted',
     }).click();
@@ -39,13 +39,13 @@ describe('GDPR Delete Requests', () => {
 
     cy.findByRole('button', { name: 'Yes, mark as deleted' }).click();
 
-    cy.findByText(
-      'Awesome! All GDPR delete requests have been completed.',
-    ).should('exist');
+    cy.findByText('Awesome! All GDPR actions have been completed.').should(
+      'exist',
+    );
   });
 
   it('Cancels marking a user as deleted', () => {
-    cy.findByRole('heading', { name: 'Members (GDPR Delete Requests)' });
+    cy.findByRole('heading', { name: 'GDPR Actions' });
     cy.findByRole('button', {
       name: 'Confirm user gdpr_delete_user deleted',
     })