Skip to content

Commit

Permalink
Extract SaveSearchComponent
Browse files Browse the repository at this point in the history
This will enable downstream apps to easily set the css classes on the button
  • Loading branch information
jcoyne committed Dec 11, 2024
1 parent fed880a commit 2603ae6
Show file tree
Hide file tree
Showing 3 changed files with 48 additions and 25 deletions.
25 changes: 25 additions & 0 deletions app/components/spotlight/save_search_component.html.erb
Original file line number Diff line number Diff line change
@@ -0,0 +1,25 @@
<%= button %>
<div class="modal fade" id="save-modal" tabindex="-1" role="dialog" aria-labelledby="save-modal-label" aria-hidden="true">
<div class="modal-dialog">
<%= bootstrap_form_for form_path, html: { novalidate: true } do |f| %>
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="save-modal-label"><%= t(:'spotlight.saved_search.label') %></h4>
<button type="button" class="blacklight-modal-close close btn-close" data-dismiss="modal" data-bs-dismiss="modal" aria-label="<%= t('blacklight.modal.close') %>">
<span aria-hidden="true" class="visually-hidden">&times;</span>
</button>
</div>
<div class="modal-body">
<%= f.text_field :title, label: t(:'spotlight.saved_search.title') %>
<%= label_tag :id, t(:'spotlight.saved_search.id'), class: 'col-form-label' %>
<%= select_tag :id, options_for_select(current_exhibit.searches.map { |s| [s.full_title, s.id] }), include_blank: true, class: 'form-control' %>
<%= render Blacklight::HiddenSearchStateComponent.new(params: search_state.params_for_search.except(:qt, :page)) %>
</div>
<div class="modal-footer d-flex flex-row-reverse justify-content-start">
<%= f.submit nil, class: 'btn btn-primary' %>
<button type="button" class="btn btn-link" data-dismiss="modal" data-bs-dismiss="modal"><%= t :cancel %></button>
</div>
</div>
<% end %>
</div>
</div>
22 changes: 22 additions & 0 deletions app/components/spotlight/save_search_component.rb
Original file line number Diff line number Diff line change
@@ -0,0 +1,22 @@
# frozen_string_literal: true

module Spotlight
# Displays the "Save this search" button and modal
class SaveSearchComponent < ViewComponent::Base
def initialize(button_classes: 'btn btn-secondary')
@button_classes = button_classes
super
end

attr_reader :button_classes

def button
button_tag t(:'spotlight.saved_search.label'), id: 'save-this-search', class: button_classes,
data: { toggle: 'modal', 'bs-toggle': 'modal', target: '#save-modal', 'bs-target': '#save-modal' }
end

def form_path
[helpers.spotlight, helpers.current_exhibit, Spotlight::Search.new]
end
end
end
26 changes: 1 addition & 25 deletions app/views/catalog/_save_search.html.erb
Original file line number Diff line number Diff line change
@@ -1,25 +1 @@
<%= button_tag t(:'spotlight.saved_search.label'), id: "save-this-search", class: 'btn btn-secondary', data: { toggle: "modal", "bs-toggle": "modal", target: "#save-modal", "bs-target": "#save-modal" } %>
<div class="modal fade" id="save-modal" tabindex="-1" role="dialog" aria-labelledby="save-modal-label" aria-hidden="true">
<div class="modal-dialog">
<%= bootstrap_form_for [spotlight, current_exhibit, Spotlight::Search.new], html: { novalidate: true } do |f| %>
<div class="modal-content">
<div class="modal-header">
<h4 class="modal-title" id="save-modal-label"><%= t(:'spotlight.saved_search.label') %></h4>
<button type="button" class="blacklight-modal-close close btn-close" data-dismiss="modal" data-bs-dismiss="modal" aria-label="<%= t('blacklight.modal.close') %>">
<span aria-hidden="true" class="visually-hidden">&times;</span>
</button>
</div>
<div class="modal-body">
<%= f.text_field :title, label: t(:'spotlight.saved_search.title') %>
<%= label_tag :id, t(:'spotlight.saved_search.id'), class: 'col-form-label' %>
<%= select_tag :id, options_for_select(current_exhibit.searches.map { |s| [s.full_title, s.id] }), include_blank: true, class: 'form-control' %>
<%= render Blacklight::HiddenSearchStateComponent.new(params: search_state.params_for_search.except(:qt, :page)) %>
</div>
<div class="modal-footer d-flex flex-row-reverse justify-content-start">
<%= f.submit nil, class: 'btn btn-primary' %>
<button type="button" class="btn btn-link" data-dismiss="modal" data-bs-dismiss="modal"><%= t :cancel %></button>
</div>
</div>
<% end %>
</div>
</div>
<%= render Spotlight::SaveSearchComponent.new %>

0 comments on commit 2603ae6

Please sign in to comment.