display UI guidance for the A-11 v2 form

* visibility into form logos * radio buttons for exclusive logo options * update seeds * update gems
GSA · Aug 2, 2024 · ef98f08 · ef98f08
1 parent 4976c0e
commit ef98f08
Show file tree

Hide file tree

Showing 23 changed files with 285 additions and 75 deletions.
diff --git a/Gemfile.lock b/Gemfile.lock
@@ -105,7 +105,7 @@ GEM
     aes_key_wrap (1.1.0)
     ast (2.4.2)
     aws-eventstream (1.3.0)
-    aws-partitions (1.958.0)
+    aws-partitions (1.961.0)
     aws-record (2.13.1)
       aws-sdk-dynamodb (~> 1, >= 1.85.0)
     aws-sdk-core (3.201.3)
@@ -119,7 +119,7 @@ GEM
     aws-sdk-kms (1.88.0)
       aws-sdk-core (~> 3, >= 3.201.0)
       aws-sigv4 (~> 1.5)
-    aws-sdk-rails (4.0.2)
+    aws-sdk-rails (4.0.3)
       actionmailbox (>= 7.0.0)
       aws-record (~> 2)
       aws-sdk-s3 (~> 1, >= 1.123.0)
@@ -128,9 +128,9 @@ GEM
       aws-sdk-sns (~> 1, >= 1.61.0)
       aws-sdk-sqs (~> 1, >= 1.56.0)
       aws-sessionstore-dynamodb (~> 2)
-      concurrent-ruby (>= 1.3.1)
+      concurrent-ruby (~> 1.3, >= 1.3.1)
       railties (>= 7.0.0)
-    aws-sdk-s3 (1.156.0)
+    aws-sdk-s3 (1.157.0)
       aws-sdk-core (~> 3, >= 3.201.0)
       aws-sdk-kms (~> 1)
       aws-sigv4 (~> 1.5)
@@ -150,7 +150,7 @@ GEM
       aws-sdk-dynamodb (~> 1, >= 1.85.0)
       rack (>= 2, < 4)
       rack-session (>= 1, < 3)
-    aws-sigv4 (1.9.0)
+    aws-sigv4 (1.9.1)
       aws-eventstream (~> 1, >= 1.0.2)
     base64 (0.2.0)
     bcrypt (3.1.20)
@@ -205,7 +205,7 @@ GEM
       responders
       warden (~> 1.2.3)
     diff-lcs (1.5.1)
-    docile (1.4.0)
+    docile (1.4.1)
     dotenv (3.1.2)
     drb (2.2.1)
     erubi (1.13.0)
@@ -215,7 +215,7 @@ GEM
     factory_bot_rails (6.4.3)
       factory_bot (~> 6.4)
       railties (>= 5.0.0)
-    faraday (2.10.0)
+    faraday (2.10.1)
       faraday-net_http (>= 2.0, < 3.2)
       logger
     faraday-follow_redirects (0.3.0)
@@ -332,12 +332,12 @@ GEM
       net-protocol
     newrelic_rpm (9.12.0)
     nio4r (2.7.3)
-    nokogiri (1.16.6)
+    nokogiri (1.16.7)
       mini_portile2 (~> 2.8.2)
       racc (~> 1.4)
-    nokogiri (1.16.6-arm64-darwin)
+    nokogiri (1.16.7-arm64-darwin)
       racc (~> 1.4)
-    nokogiri (1.16.6-x86_64-darwin)
+    nokogiri (1.16.7-x86_64-darwin)
       racc (~> 1.4)
     oauth2 (2.0.9)
       faraday (>= 0.17.3, < 3.0)
@@ -367,7 +367,7 @@ GEM
     parser (3.3.4.0)
       ast (~> 2.4.1)
       racc
-    pg (1.5.6)
+    pg (1.5.7)
     pry (0.14.2)
       coderay (~> 1.1)
       method_source (~> 1.0)
@@ -376,7 +376,7 @@ GEM
     public_suffix (6.0.1)
     puma (6.4.2)
       nio4r (~> 2.0)
-    racc (1.8.0)
+    racc (1.8.1)
     rack (3.1.7)
     rack-cors (2.0.2)
       rack (>= 2.0.0)
@@ -449,7 +449,7 @@ GEM
     responders (3.1.1)
       actionpack (>= 5.2)
       railties (>= 5.2)
-    rexml (3.3.2)
+    rexml (3.3.4)
       strscan
     rolify (6.0.1)
     rspec-core (3.13.0)
@@ -471,7 +471,7 @@ GEM
     rspec-support (3.13.1)
     rspec_junit_formatter (0.6.0)
       rspec-core (>= 2, < 4, != 2.12.0)
-    rubocop (1.65.0)
+    rubocop (1.65.1)
       json (~> 2.3)
       language_server-protocol (>= 3.17.0)
       parallel (~> 1.10)
@@ -532,7 +532,7 @@ GEM
     sprockets (4.2.1)
       concurrent-ruby (~> 1.0)
       rack (>= 2.2.4, < 4)
-    sprockets-rails (3.5.1)
+    sprockets-rails (3.5.2)
       actionpack (>= 6.1)
       activesupport (>= 6.1)
       sprockets (>= 3.0.0)
@@ -568,7 +568,7 @@ GEM
     websocket-extensions (0.1.5)
     xpath (3.2.0)
       nokogiri (~> 1.8)
-    zeitwerk (2.6.16)
+    zeitwerk (2.6.17)
 
 PLATFORMS
   arm64-darwin-23

diff --git a/app/assets/stylesheets/site.scss b/app/assets/stylesheets/site.scss
@@ -359,8 +359,11 @@ tbody tr:hover td {
 }
 .section-header {
   background: #71767A;
-  min-height: 50px;
-  padding: 8px 0px 0px 0px;
+}
+.form-builder {
+  .section-header {
+    padding: 8px 0px 0px 0px;
+  }
 }
 .fba-instructions .instructions {
   display: inline-block;

diff --git a/app/controllers/admin/forms_controller.rb b/app/controllers/admin/forms_controller.rb
@@ -120,6 +120,17 @@ def update_success_text
 
     def update_display_logo
       ensure_form_manager(form: @form)
+      if params[:form][:logo_kind] == "square"
+        @form.update({
+          display_header_square_logo: true,
+          display_header_logo: false
+        })
+      elsif params[:form][:logo_kind] == "banner"
+        @form.update({
+          display_header_square_logo: false,
+          display_header_logo: true
+        })
+      end
       @form.update(form_logo_params)
     end
 
@@ -203,6 +214,8 @@ def permissions
     end
 
     def questions
+      @form.warn_about_not_too_many_questions
+      @form.ensure_a11_v2_format if @form.kind == "a11_v2"
       ensure_form_manager(form: @form) unless @form.template?
       @questions = @form.ordered_questions
     end
@@ -479,12 +492,11 @@ def form_params
         :notification_emails,
         :notification_frequency,
         :logo,
+        :logo_kind,
         :modal_button_text,
         :success_text_heading,
         :success_text,
         :instructions,
-        :display_header_logo,
-        :display_header_square_logo,
         :whitelist_url,
         :whitelist_url_1,
         :whitelist_url_2,
@@ -544,8 +556,6 @@ def form_params
     def form_logo_params
       params.require(:form).permit(
         :logo,
-        :display_header_logo,
-        :display_header_square_logo,
       )
     end
 

diff --git a/app/controllers/admin/reporting_controller.rb b/app/controllers/admin/reporting_controller.rb
@@ -390,5 +390,9 @@ def form_whitelist
       @forms = Form.all.order(:created_at).includes(:organization)
     end
 
+    def form_logos
+      @forms = Form.where("logo IS NOT NULL")
+    end
+
   end
 end
diff --git a/app/mailers/user_mailer.rb b/app/mailers/user_mailer.rb
@@ -128,11 +128,13 @@ def submissions_digest(form_id, days_ago)
   def account_deactivation_scheduled_notification(email, active_days)
     return unless ENV['ENABLE_EMAIL_NOTIFICATIONS'] == 'true'
 
+    @email = email
     @active_days = active_days
     set_logo
 
-    mail subject: "Your account is scheduled to be deactivated in #{@active_days} days due to inactivity",
-      to: email
+    mail subject: "Touchpoints account to be deactivated in #{@active_days} days",
+      to: email,
+      bcc: UserMailer.touchpoints_team
   end
 
   # Subject can be set in your I18n file at config/locales/en.yml

diff --git a/app/models/form.rb b/app/models/form.rb
@@ -573,6 +573,47 @@ def organization_has_form_approval_enabled?
     organization.form_approval_enabled
   end
 
+  # use this validator to provide soft UI guidance, rather than strong model validation
+  def ensure_a11_v2_format
+    # ensure the form has the 4 required questions
+    required_elements = ["answer_01", "answer_02", "answer_03", "answer_04"]
+    unless contains_elements?(questions.collect(&:answer_field), required_elements)
+      errors.add(:base, "The A-11 v2 form must have questions for #{required_elements.to_sentence}")
+    end
+
+    # ensure the positive indicators include ease and effectiveness
+    question_2 = self.ordered_questions.find { |q| q.answer_field == "answer_02" }
+    question_options = question_2.question_options
+
+    question_option_values = question_options.collect(&:value)
+    required_options = ["effectiveness", "ease"]
+    missing_options = required_options - question_option_values
+    if missing_options.any?
+      errors.add(:base, "The question options for Question 2 must include: #{missing_options.join(', ')}")
+    end
+
+    # ensure the positive indicators include ease and effectiveness
+    question_3 = self.ordered_questions.find { |q| q.answer_field == "answer_03" }
+    question_options = question_3.question_options
+
+    question_option_values = question_options.collect(&:value)
+    required_options = ["effectiveness", "ease"]
+    missing_options = required_options - question_option_values
+    if missing_options.any?
+      errors.add(:base, "The question options for Question 3 must include: #{missing_options.join(', ')}")
+    end
+  end
+
+  def warn_about_not_too_many_questions
+    if questions.size > 12
+      errors.add(:base, "Touchpoints supports a maximum of 20 questions. There are currently #{questions_count} questions. Fewer questions tend to yield higher response rates.")
+    end
+  end
+
+  def contains_elements?(array, required_elements)
+    (required_elements & array).length == required_elements.length
+  end
+
 
   private
 

diff --git a/app/views/admin/collections/index.html.erb b/app/views/admin/collections/index.html.erb
@@ -120,7 +120,7 @@
   <tbody>
     <% @collections.each do |collection| %>
       <tr>
-        <td><%= collection.organization.name %></td>
+        <td><%= render "admin/organizations/badge", organization: collection.organization %></td>
         <td><%= collection.service_provider ? collection.service_provider.name : "SPECIFY THIS COLLECTION'S SERVICE PROVIDER" %></td>
         <td><%= link_to collection.name, admin_collection_path(collection) %></td>
         <td><%= collection.omb_cx_reporting_collections.size %></td>

diff --git a/app/views/admin/cscrm_data_collections2/index.html.erb b/app/views/admin/cscrm_data_collections2/index.html.erb
@@ -107,7 +107,7 @@
           <%= link_to "View" , admin_cscrm_data_collections2_path(cscrm_data_collection) %>
         </td>
         <td>
-          <%= cscrm_data_collection.organization.name %>
+          <%= render "admin/organizations/badge", organization: cscrm_data_collection.organization %>
         </td>
         <td>
           <%= cscrm_data_collection.year %>

diff --git a/app/views/admin/forms/_logo_display.html.erb b/app/views/admin/forms/_logo_display.html.erb
@@ -1,17 +1,4 @@
 <div id="display-logo-div">
-  <%- if form.errors.any? %>
-  <div id="error_explanation">
-    <div class="usa-alert usa-alert--error">
-      <div class="usa-alert__body">
-        <h3 class="usa-alert__heading">Error</h3>
-        <p class="usa-alert__text">
-          Logo upload failed, please try again with a valid image file
-        </p>
-      </div>
-    </div>
-  </div>
-  <% end %>
-
   <%= form_with(model: form, url: update_display_logo_admin_form_url(form, format: :js), html: { multipart: :true }, local: false) do |f| %>
     <div class="grid-row grid-gap-md">
       <div class="grid-col-12">
@@ -25,23 +12,20 @@
 
         <fieldset class="usa-fieldset">
           <legend class="usa-sr-only">Display Organization Tag Logo</legend>
-          <div class="usa-checkbox">
-            <%= f.check_box :display_header_logo, class: "usa-checkbox__input" %>
-            <%= f.label :display_header_logo, "Display small banner (320px wide by 80px tall) logo?", class: "usa-checkbox__label" %>
+          <div class="usa-radio">
+            <%= f.radio_button :logo_kind, "banner", class: "usa-radio__input usa-radio__input--tile", checked: form.display_header_logo %>
+            <%= f.label :logo_kind, "Display small banner (320px wide by 80px tall) logo?", class: "usa-radio__label", value: "banner" %>
           </div>
-        </fieldset>
-        <fieldset class="usa-fieldset">
-          <legend class="usa-sr-only">Display Organization Tag Logo</legend>
-          <div class="usa-checkbox">
-            <%= f.check_box :display_header_square_logo, class: "usa-checkbox__input" %>
-            <%= f.label :display_header_square_logo, "Display square (80px wide by 80px tall) logo?", class: "usa-checkbox__label" %>
+          <div class="usa-radio">
+            <%= f.radio_button :logo_kind, "square", class: "usa-radio__input usa-radio__input--tile", checked: form.display_header_square_logo %>
+            <%= f.label :logo_kind, "Display square (80px wide by 80px tall) logo?", class: "usa-radio__label", value: "square" %>
           </div>
         </fieldset>
       </div>
     </div>
-    <br>
-    <%= f.submit "Update logo", class: "usa-button usa-button-outline" %>
-    <br>
+
+    <%= f.submit "Update logo display", class: "usa-button usa-button-outline margin-top-1" %>
+
     <%- if form.logo.present? %>
       <%- if form.display_header_logo %>
         <p>

diff --git a/app/views/admin/forms/questions.html.erb b/app/views/admin/forms/questions.html.erb
@@ -17,20 +17,27 @@
 <%= render 'admin/forms/step_indicator', form: @form %>
 <div class="grid-row grid-gap-lg margin-bottom-2">
   <div class="desktop:grid-col-8">
-    <%- if @form.questions.size > 12 %>
-    <div class="usa-alert usa-alert--warning">
-      <div class="usa-alert__body">
-        <p class="usa-alert__text">
-          Touchpoints supports a maximum of 20 questions.
-          There are currently
-          <%= @form.questions_count %> questions.
-          <br>
-          Fewer questions tend to get better engagement.
-        </p>
+    <%- if @form.errors.any? %>
+    <div class="grid-row grid-gap-md">
+      <div class="grid-col-12">
+        <div id="error_explanation" class="margin-bottom-2">
+          <div class="usa-alert usa-alert--error">
+            <div class="usa-alert__body">
+              <h3 class="usa-alert__heading">This form needs attention:</h3>
+              <p class="usa-alert__text">
+                <ul>
+                <% @form.errors.full_messages.each do |message| %>
+                  <li><%= message %></li>
+                <% end %>
+                </ul>
+              </p>
+            </div>
+          </div>
+        </div>
       </div>
     </div>
-    <br>
     <% end %>
+
     <div class="touchpoint-form form-builder">
       <div class="inner-wrapper">
         <%= render partial: "components/forms/edit/builder", locals: { touchpoint: @touchpoint, form: @form, questions: @form.ordered_questions } %>