Refactors feedback form.

app/controllers/feedback_forms_controller.rb

@@ -1,49 +1,22 @@
 # frozen_string_literal: true
 
 class FeedbackFormsController < ApplicationController
-  EMAIL_PRESENT_MESSAGE = 'You have filled in a field that makes you appear as a spammer.  Please follow the directions for the individual form fields.'
-  MESSAGE_BLANK_MESSAGE = 'A message is required'
-  RECAPTCHA_MESSAGE = 'You must pass the reCAPTCHA challenge'
-
-  # The client handles rendering flash in this case, so clear it on the server
-  # side to prevent it from rendering on the next request.
-  after_action :discard_flash!, only: :create, if: -> { request.xhr? }
-
-  def new
-    return render :new_frame if params[:frame] == 'true'
-
-    render :new
-  end
+  def new; end
 
   def create
-    if validate
+    if pass_captcha?
       FeedbackMailer.submit_feedback(params, request.remote_ip).deliver_now
       flash[:success] = 'Thank you! Your feedback has been sent.'
+    else
+      flash[:error] = 'You must pass the reCAPTCHA challenge'
     end
 
-    respond_to do |format|
-      format.json do
-        render json: flash
-      end
-      format.html do
-        redirect_to params[:url]
-      end
-    end
+    redirect_to params[:url]
   end
 
   protected
 
-  def validate
-    errors = []
-    errors << MESSAGE_BLANK_MESSAGE if params[:message].blank?
-    errors << EMAIL_PRESENT_MESSAGE if params[:email_address].present?
-    errors << RECAPTCHA_MESSAGE if current_user.blank? && !verify_recaptcha
-
-    flash[:error] = errors.join('<br/>') unless errors.empty?
-    flash[:error].nil?
-  end
-
-  def discard_flash!
-    flash.discard
+  def pass_captcha?
+    current_user.present? || verify_recaptcha
   end
 end

app/javascript/application.js

@@ -1,5 +1,4 @@
 // Configure your import map in config/importmap.rb. Read more: https://github.com/rails/importmap-rails
 import "controllers"
 import 'bootstrap';
-import 'feedback_form';
 import "@hotwired/turbo-rails"

app/javascript/controllers/feedback_controller.js

@@ -0,0 +1,10 @@
+import { Controller } from '@hotwired/stimulus'
+
+export default class extends Controller {
+  static targets = ['form']
+
+  connect() {
+    this.formTarget['user_agent'].value = navigator.userAgent
+    this.formTarget['viewport'].value = `width: ${window.innerWidth} height: ${innerHeight}`
+  }
+}

app/views/feedback_forms/new.html.erb

@@ -1 +1,53 @@
-<%= render 'shared/feedback_forms/form' %>
+<turbo-frame id="feedback-form-frame">
+  <div class="row justify-content-md-center">
+    <div class="col-sm-6 my-3">
+      <%= form_tag feedback_form_path, method: :post, class:"form-horizontal feedback-form", role:"form", data: { turbo: false, controller: 'feedback', feedback_target: 'form' } do %>
+        <div class="row">
+          <div class="col-sm-12 px-4 mb-2">
+            <div class="alert alert-info" role="alert">
+              Reporting from: <span class="reporting-from-field"><%= request.referer %></span>
+              <%= hidden_field_tag :url, request.referer, class:"reporting-from-field" %>
+            </div>
+          </div>
+        </div>
+        <%= hidden_field_tag :user_agent %>
+        <%= hidden_field_tag :viewport %>
+        <div class="mx-3">
+          <div class="form-group row mb-3">
+            <%= label_tag(:message, 'Message', class: "col-sm-3 col-form-label text-end") %>
+            <div class="col-sm-9">
+              <%= text_area_tag :message, "", rows:"5", class:"form-control", required: true %>
+            </div>
+          </div>
+          <div class="form-group row mb-3">
+            <%= label_tag(:name, 'Your name', class: "col-sm-3 col-form-label text-end") %>
+            <div class="col-sm-9">
+              <%= text_field_tag :name, "", class:"form-control", required: true %>
+            </div>
+          </div>
+          <div class="form-group row mb-3">
+            <%= label_tag(:to, 'Your email', class: "col-sm-3 col-form-label text-end") %>
+            <div class="col-sm-9">
+              <%= email_field_tag :to, "", class:"form-control", required: true %>
+            </div>
+          </div>
+          <% if current_user.blank? %>
+            <div class="form-group row mb-3">
+              <div class="offset-sm-3 col-sm-9">
+                <%= recaptcha_tags %>
+
+                <p>(Stanford users can avoid this Captcha by logging in.)</p>
+              </div>
+            </div>
+          <% end %>
+          <div class="form-group row">
+            <div class="offset-sm-3 col-sm-9">
+              <button type="submit" class="btn btn-primary">Send</button>
+              <%= button_tag "Cancel", type: 'button', class: 'btn btn-link', data: { bs_toggle: 'collapse', bs_target: '#feedback-form' }, aria: { expanded: false, controls: 'feedback-form' }  %>
+            </div>
+          </div>
+        </div>
+      <% end %>
+    </div>
+  </div>
+</turbo-frame>

app/views/shared/_top_navbar.html.erb

@@ -6,15 +6,15 @@
       <%= image_tag "sul-logo-stacked.svg", class: "d-block d-sm-none", alt: "", height: 25 %>
     <% end %>
     <div class="header-links">
-      <%= link_to feedback_path, class: 'first', data: { bs_toggle: 'collapse', bs_target: '#feedback-form' } do %>
+      <%= link_to '#feedback-form', class: 'first', data: { bs_toggle: 'collapse', bs_target: '#feedback-form' } do %>
         Feedback
       <% end if show_feedback_form? %>
     </div>
   </header>
 </div>
 <% if show_feedback_form? %>
-<div id="feedback-form" class="feedback-form-container collapse">
-  <turbo-frame id="feedback-form-frame" src="<%= new_feedback_form_path(frame: true) %>" loading="lazy">
-  </turbo-frame>
-</div>
+  <div id="feedback-form" class="feedback-form-container collapse">
+    <turbo-frame id="feedback-form-frame" src="<%= new_feedback_form_path %>" loading="lazy">
+    </turbo-frame>
+  </div>
 <% end %>

config/importmap.rb

@@ -1,7 +1,6 @@
 # Pin npm packages by running ./bin/importmap
 
 pin "application", preload: true
-pin "jquery", to: "https://ga.jspm.io/npm:[email protected]/dist/jquery.js"
 pin "bootstrap", to: "https://ga.jspm.io/npm:[email protected]/dist/js/bootstrap.esm.js"
 pin "@popperjs/core", to: "https://ga.jspm.io/npm:@popperjs/[email protected]/lib/index.js"
 pin "@hotwired/stimulus", to: "stimulus.min.js", preload: true