Add progressive enhancement JS for active_language
This commit is contained in:
		@@ -47,3 +47,7 @@ a:hover {
 | 
			
		||||
  display: inline;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
#active_language_submit_tag {
 | 
			
		||||
  display: none;
 | 
			
		||||
}
 | 
			
		||||
 | 
			
		||||
 
 | 
			
		||||
@@ -3,6 +3,6 @@ module ActiveLanguageHelper
 | 
			
		||||
  def active_language_select_tag
 | 
			
		||||
    languages = Language.all.to_a.delete_if {|language| language.name == "English" }
 | 
			
		||||
    options = options_from_collection_for_select(languages, "id", "name", cookies[:active_language_id] || 1)
 | 
			
		||||
    select_tag "active_language_id", options
 | 
			
		||||
    select_tag "active_language_id", options, { id: "active_language_select_tag" }
 | 
			
		||||
  end
 | 
			
		||||
end
 | 
			
		||||
 
 | 
			
		||||
@@ -1,3 +1,10 @@
 | 
			
		||||
// Configure your import map in config/importmap.rb. Read more: https://github.com/rails/importmap-rails
 | 
			
		||||
import "@hotwired/turbo-rails"
 | 
			
		||||
import "controllers"
 | 
			
		||||
 | 
			
		||||
let switchLanguageForm = document.querySelector("#active_language_form");
 | 
			
		||||
let switchLanguageSelectTag = document.querySelector("#active_language_select_tag");
 | 
			
		||||
 | 
			
		||||
switchLanguageSelectTag.addEventListener("change", (event) => {
 | 
			
		||||
  switchLanguageForm.submit();
 | 
			
		||||
});
 | 
			
		||||
 
 | 
			
		||||
@@ -8,6 +8,14 @@
 | 
			
		||||
 | 
			
		||||
    <%= stylesheet_link_tag "application", "data-turbo-track": "reload" %>
 | 
			
		||||
    <%= javascript_importmap_tags %>
 | 
			
		||||
 | 
			
		||||
    <noscript>
 | 
			
		||||
      <style type="text/css">
 | 
			
		||||
        #active_language_submit_tag {
 | 
			
		||||
          display: inline !important;
 | 
			
		||||
        }
 | 
			
		||||
      </style>
 | 
			
		||||
    </noscript>
 | 
			
		||||
  </head>
 | 
			
		||||
 | 
			
		||||
  <body>
 | 
			
		||||
@@ -19,9 +27,9 @@
 | 
			
		||||
            <pre style="display: inline;">|</pre>
 | 
			
		||||
            <%= link_to "Languages", admin_languages_path %>
 | 
			
		||||
            <pre style="display: inline;">|</pre>
 | 
			
		||||
            <%= form_tag '/set_active_language', class: "d-inline" do %>
 | 
			
		||||
            <%= form_tag '/set_active_language', class: "d-inline", id: "active_language_form" do %>
 | 
			
		||||
              <%= active_language_select_tag %>
 | 
			
		||||
              <%= submit_tag "Switch Language" %>
 | 
			
		||||
              <%= submit_tag "Switch Language", id: "active_language_submit_tag" %>
 | 
			
		||||
            <% end %>
 | 
			
		||||
          <% end %>
 | 
			
		||||
        </div>
 | 
			
		||||
 
 | 
			
		||||
@@ -25,7 +25,10 @@ RSpec.describe ActiveLanguageHelper, type: :helper do
 | 
			
		||||
 | 
			
		||||
    it "should not contain an English option" do
 | 
			
		||||
      expect(@tag).to_not include("English")
 | 
			
		||||
      
 | 
			
		||||
    end
 | 
			
		||||
 | 
			
		||||
    it "should include css id #active_language_select_tag" do
 | 
			
		||||
      expect(@tag).to have_selector(%(select[id="active_language_select_tag"]))
 | 
			
		||||
    end
 | 
			
		||||
  end
 | 
			
		||||
end
 | 
			
		||||
 
 | 
			
		||||
		Reference in New Issue
	
	Block a user