dojosリストの見た目を整理＆dojo数1件時は単数形で表示

Author: nacchan99

app/controllers/home_controller.rb

@@ -1,7 +1,13 @@
 class HomeController < ApplicationController
   def show
-    @dojo_count        = Dojo.active_dojos_count
-    @regions_and_dojos = Dojo.group_by_region_on_active
-    @prefectures_and_dojos = Dojo.group_by_prefecture_on_active
+  @dojo_count = Dojo.active_dojos_count
+  @regions_and_dojos = Dojo.group_by_region_on_active
+  @prefectures_and_dojos = Dojo.group_by_prefecture_on_active.transform_values do |dojos|
+    count = dojos.pluck(:counter).sum
+    {
+      dojos: dojos,
+      label: "#{count} Dojo#{'s' if count != 1}"
+    }
+    end
   end
-end
+end

app/views/shared/_dojos.html+smartphone.erb

@@ -1,37 +1,42 @@
 <div id="accordion" class="panel-group" aria-multiselectable="true" role="tablist">
- <% if @prefectures_and_dojos.present? %>
+  <% if @prefectures_and_dojos.present? %>
+    <% @prefectures_and_dojos.each_with_index do |(prefecture, data), index| %>
 
-  <% @prefectures_and_dojos.each_with_index do |(prefecture, dojos), index| %>
-    <div class="panel panel-default">
-      <div class="panel-heading" id="heading<%= index %>" role="tab">
-        <h4 class="panel-title">
-          <a data-toggle="collapse"
-             href="#collapse<%= index %>" role="button">
-            <i class="fa fa-chevron-right" aria-hidden="true"></i>
-            <%= prefecture %>
-            - <%= dojos.pluck(:counter).sum %> Dojos
-          </a>
-        </h4>
-      </div>
-      <div class="panel-collapse collapse" id="collapse<%= index %>" role="tabpanel">
-        <div class="panel-body grayscale-bg dojo-flex">
-          <%= render partial: 'shared/dojo', collection: dojos %>
+      <div class="panel panel-default">
+        <div class="panel-heading" id="heading<%= index %>" role="tab">
+          <h4 class="panel-title">
+            <a data-toggle="collapse" href="#collapse<%= index %>" role="button">
+              <i class="fa fa-chevron-right" aria-hidden="true"></i>
+              <%= prefecture %> - <%= data[:label] %>
+            </a>
+          </h4>
+        </div>
+        <div class="panel-collapse collapse" id="collapse<%= index %>" role="tabpanel">
+          <div class="panel-body grayscale-bg dojo-flex">
+            <%= render partial: 'shared/dojo', collection: data[:dojos] %>
+          </div>
         </div>
       </div>
-    </div>
-  <% end %>
 
-<% end %>
+    <% end %>
+  <% end %>
 </div>
 
 <script>
   $(document).ready(function() {
     $('.collapse').on('shown.bs.collapse', function() {
-      $(this).parent().find(".fa-chevron-right").removeClass("fa-chevron-right").addClass("fa-chevron-down");
+      $(this)
+        .parent()
+        .find(".fa-chevron-right")
+        .removeClass("fa-chevron-right")
+        .addClass("fa-chevron-down");
     });
-  
     $('.collapse').on('hidden.bs.collapse', function() {
-      $(this).parent().find(".fa-chevron-down").removeClass("fa-chevron-down").addClass("fa-chevron-right");
+      $(this)
+        .parent()
+        .find(".fa-chevron-down")
+        .removeClass("fa-chevron-down")
+        .addClass("fa-chevron-right");
     });
   });
-</script> 
+</script>