Extract spellcheck component

.rubocop.yml

@@ -45,6 +45,11 @@ Layout/LineLength:
 Naming/HeredocDelimiterNaming:
   Enabled: false
 
+Naming/MethodParameterName:
+  AllowedNames:
+    - id
+    - q
+
 Naming/PredicateName:
   ForbiddenPrefixes:
     - is_

app/components/blacklight/response/spellcheck_component.html.erb

@@ -0,0 +1,7 @@
+<div id="spell">
+  <h3 class="suggest">
+    <em>
+      <%= t('blacklight.did_you_mean', options: safe_join(@options.map { |word| link_to_query(word) }, " #{t('blacklight.or')} ")).html_safe %>
+    </em>
+  </h3>
+</div>

app/components/blacklight/response/spellcheck_component.rb

@@ -0,0 +1,20 @@
+# frozen_string_literal: true
+
+module Blacklight
+  module Response
+    class SpellcheckComponent < ViewComponent::Base
+      def initialize(response:, options: nil)
+        @response = response
+        @options = options || @response&.spelling&.words
+      end
+
+      def link_to_query(query)
+        @view_context.link_to_query(query)
+      end
+
+      def render?
+        @options.any? && @view_context.should_show_spellcheck_suggestions?(@response)
+      end
+    end
+  end
+end

app/components/blacklight/search_bar_component.html.erb

@@ -0,0 +1,29 @@
+<%= form_tag @url, method: @method, class: @classes.join(' '), role: 'search', 'aria-label' => t('blacklight.search.form.submit') do %>
+  <%= render_hash_as_hidden_fields(@params) %>
+  <% if @search_fields.length > 1 %>
+    <label for="search_field" class="sr-only"><%= t('blacklight.search.form.search_field.label') %></label>
+  <% end %>
+  <div class="input-group">
+    <% if @search_fields.length > 1 %>
+        <%= select_tag(:search_field,
+                       options_for_select(@search_fields, h(@search_field)),
+                       title: t('blacklight.search.form.search_field.title'),
+                       id: "#{@prefix}search_field",
+                       class: "custom-select search-field") %>
+    <% elsif @search_fields.length == 1 %>
+      <%= hidden_field_tag :search_field, search_fields.first.last %>
+    <% end %>
+
+    <label for="<%= @prefix %>q" class="sr-only"><%= t('blacklight.search.form.search.label') %></label>
+    <%= text_field_tag :q, @q, placeholder: t('blacklight.search.form.search.placeholder'), class: "search-q q form-control rounded-#{@search_fields.length > 1 ? '0' : 'left'}", id: "#{@prefix}q", autocomplete: @autocomplete_path.present? ? "off" : "", autofocus: @autofocus, data: { autocomplete_enabled: @autocomplete_path.present?, autocomplete_path: @autocomplete_path }  %>
+
+    <%= content %>
+
+    <span class="input-group-append">
+      <button type="submit" class="btn btn-primary search-btn" id="<%= @prefix %>search">
+        <span class="submit-search-text"><%= t('blacklight.search.form.submit') %></span>
+        <%= blacklight_icon :search, aria_hidden: true %>
+      </button>
+    </span>
+  </div>
+<% end %>

app/components/blacklight/search_bar_component.rb

@@ -0,0 +1,45 @@
+# frozen_string_literal: true
+
+module Blacklight
+  class SearchBarComponent < ::ViewComponent::Base
+    # rubocop:disable Metrics/ParameterLists
+    def initialize(url:, params:, classes: [], presenter: nil, prefix: '', method: 'GET', q: nil, search_field: nil, search_fields: [], autocomplete_path: nil, autofocus: nil)
+      @url = url
+      @q = q || params[:q]
+      @search_field = search_field || params[:search_field]
+      @params = params.except(:q, :search_field, :utf8, :page)
+      @prefix = prefix
+      @classes = classes
+      @presenter = presenter
+      @method = method
+      @autocomplete_path = autocomplete_path
+      @autofocus = autofocus
+      @search_fields = search_fields
+    end
+    # rubocop:enable Metrics/ParameterLists
+
+    def autocomplete_path
+      return nil unless presenter.autocomplete_enabled?
+
+      @autocomplete_path
+    end
+
+    def autofocus
+      if @autofocus.nil?
+        presenter.autofocus?
+      else
+        @autofocus
+      end
+    end
+
+    private
+
+    def presenter
+      @presenter ||= blacklight_config.index.search_bar_presenter_class.new(controller, blacklight_config)
+    end
+
+    def blacklight_config
+      @view_context.blacklight_config
+    end
+  end
+end

app/views/catalog/_did_you_mean.html.erb

@@ -1,5 +1 @@
-<% if should_show_spellcheck_suggestions? @response %>
-  <div id="spell">
-    <h3 class="suggest"><em><%= t('blacklight.did_you_mean', :options => safe_join(@response.spelling.words.map { |word| link_to_query(word) }, " #{t('blacklight.or')} ")).html_safe %></em></h3>
-  </div>
-<% end %>
+<%= render(Blacklight::Response::SpellcheckComponent.new(response: @response)) %>

app/views/catalog/_search_form.html.erb

@@ -1,27 +1,6 @@
-<%= form_tag search_action_url, method: :get, class: 'search-query-form', role: 'search', 'aria-label' => t('blacklight.search.form.submit') do %>
-  <%= render_hash_as_hidden_fields(search_state.params_for_search.except(:q, :search_field, :qt, :page, :utf8)) %>
-  <% if search_fields.length > 1 %>
-    <label for="search_field" class="sr-only"><%= t('blacklight.search.form.search_field.label') %></label>
-  <% end %>
-  <div class="input-group">
-    <% if search_fields.length > 1 %>
-        <%= select_tag(:search_field,
-                       options_for_select(search_fields, h(params[:search_field])),
-                       title: t('blacklight.search.form.search_field.title'),
-                       id: "search_field",
-                       class: "custom-select search-field") %>
-    <% elsif search_fields.length == 1 %>
-      <%= hidden_field_tag :search_field, search_fields.first.last %>
-    <% end %>
-
-    <label for="q" class="sr-only"><%= t('blacklight.search.form.search.label') %></label>
-    <%= text_field_tag :q, params[:q], placeholder: t('blacklight.search.form.search.placeholder'), class: "search-q q form-control rounded-#{search_fields.length > 1 ? '0' : 'left'}", id: "q", autocomplete: presenter.autocomplete_enabled? ? "off" : "", autofocus: presenter.autofocus?, data: { autocomplete_enabled: presenter.autocomplete_enabled?, autocomplete_path: search_action_path(action: :suggest) }  %>
-
-    <span class="input-group-append">
-      <button type="submit" class="btn btn-primary search-btn" id="search">
-        <span class="submit-search-text"><%= t('blacklight.search.form.submit') %></span>
-        <%= blacklight_icon :search, aria_hidden: true %>
-      </button>
-    </span>
-  </div>
-<% end %>
+<%= render(Blacklight::SearchBarComponent.new(
+      url: search_action_url,
+      params: search_state.params_for_search.except(:qt),
+      search_fields: search_fields,
+      presenter: presenter,
+      autocomplete_path: search_action_path(action: :suggest))) %>