From da11fe08b075cf05e01cdfdc930df6692aa761b9 Mon Sep 17 00:00:00 2001
From: Yue-Long <yue-long.he@unep-wcmc.org>
Date: Mon, 23 Sep 2024 12:03:31 +0100
Subject: [PATCH] feat: add 2 more tabs

---
 app/controllers/concerns/tabs.rb              | 16 +++---
 app/controllers/oecm_controller.rb            | 11 ++--
 app/controllers/wdpa_controller.rb            |  4 +-
 app/views/oecm/index.html.erb                 |  3 +-
 .../_tabs-thematic-area-database.html.erb     | 51 +++++++++----------
 app/views/wdpa/index.html.erb                 |  3 +-
 6 files changed, 47 insertions(+), 41 deletions(-)

diff --git a/app/controllers/concerns/tabs.rb b/app/controllers/concerns/tabs.rb
index a687ac609..e5f47aa2b 100644
--- a/app/controllers/concerns/tabs.rb
+++ b/app/controllers/concerns/tabs.rb
@@ -2,14 +2,18 @@ module Concerns::Tabs
   extend ActiveSupport::Concern
   included do
     include Comfy::CmsHelper
-    
-    def get_tabs total_tabs
-      tabs = []
 
+    def get_tabs(total_tabs, skip_tabs_with_empty_content = false)
+      tabs = []
       total_tabs.times do |i|
+        id = i + 1
+        content_id = "tab-content-#{id}"
+        content = cms_fragment_content(content_id, @cms_page)
+        next if skip_tabs_with_empty_content == true && (content.nil? == true || content.empty? == true)
         tab = {
-          id: i+1,
-          title: cms_fragment_content(:"tab-title-#{i+1}", @cms_page)
+          id: id,
+          title: cms_fragment_content(:"tab-title-#{i + 1}", @cms_page),
+          content_id: content_id
         }
 
         tabs << tab
@@ -17,4 +21,4 @@ def get_tabs total_tabs
       tabs
     end
   end
-end
\ No newline at end of file
+end
diff --git a/app/controllers/oecm_controller.rb b/app/controllers/oecm_controller.rb
index bed538861..e7f42fef7 100644
--- a/app/controllers/oecm_controller.rb
+++ b/app/controllers/oecm_controller.rb
@@ -5,14 +5,15 @@ class OecmController < ApplicationController
   def index
     @oecm_coverage_percentage = GlobalStatistic.global_oecms_pas_coverage_percentage
 
-    @download_options = helpers.download_options(['csv', 'shp', 'gdb', 'esri_oecm'], 'general', 'oecm')
+    @download_options = helpers.download_options(%w[csv shp gdb esri_oecm], 'general', 'oecm')
 
     @config_search_areas = {
       id: 'oecm',
       placeholder: I18n.t('global.placeholder.search-oecm')
     }.to_json
 
-    @tabs = get_tabs(3).to_json
+    @tabs_list = get_tabs(5, true)
+    @tabs = @tabs_list.to_json
 
     @map = {
       overlays: MapOverlaysSerializer.new(oecm_overlays, map_yml).serialize,
@@ -21,7 +22,7 @@ def index
       point_query_services: oecm_services_for_point_query
     }
     @map_options = {
-      map: { center: [-100,0] }
+      map: { center: [-100, 0] }
     }
     @filters = { db_type: ['oecm'] }
   end
@@ -30,9 +31,9 @@ def index
 
   def oecm_overlays
     overlays(['oecm'], {
-      'oecm': {
+      oecm: {
         isToggleable: false
       }
     })
   end
-end
\ No newline at end of file
+end
diff --git a/app/controllers/wdpa_controller.rb b/app/controllers/wdpa_controller.rb
index 87ff52b22..5f29c9c4b 100644
--- a/app/controllers/wdpa_controller.rb
+++ b/app/controllers/wdpa_controller.rb
@@ -13,8 +13,8 @@ def index
     }.to_json
 
     @filters = { db_type: ['wdpa'] }
-
-    @tabs = get_tabs(3).to_json
+    @tabs_list = get_tabs(5, true)
+    @tabs = @tabs_list.to_json
 
     @map = {
       overlays: MapOverlaysSerializer.new(wdpa_overlays, map_yml).serialize,
diff --git a/app/views/oecm/index.html.erb b/app/views/oecm/index.html.erb
index adc3ee12c..1d185b65e 100644
--- a/app/views/oecm/index.html.erb
+++ b/app/views/oecm/index.html.erb
@@ -17,7 +17,8 @@
   ga_id: "Slug: #{@cms_page.slug}",
   map: @map,
   map_options: @map_options,
-  tabs: @tabs
+  tabs_json: @tabs,
+  tabs_list: @tabs_list,
 } %>
 
 <section class="container spacer-small--top">
diff --git a/app/views/partials/tabs/_tabs-thematic-area-database.html.erb b/app/views/partials/tabs/_tabs-thematic-area-database.html.erb
index 708723233..e24a1cc38 100644
--- a/app/views/partials/tabs/_tabs-thematic-area-database.html.erb
+++ b/app/views/partials/tabs/_tabs-thematic-area-database.html.erb
@@ -2,36 +2,35 @@
   class="tabs--hero"
   ga-id="<%= ga_id %>"
   preselected-tab="<%= params[:tab] %>"
-  :tab-triggers="<%= tabs %>"
+  :tab-triggers="<%= tabs_json %>"
 >
   <template slot-scope="slotProps">
-    <tab-target :id="1" :selected-id="slotProps.selectedId">
-      <section class="container--medium">
-        <%= cms_fragment_render("tab-content-1") %>
-      </section>
-
-      <section class="spacer-large--bottom">
-        <%= render partial: "partials/search/protected-areas", locals: { config: config_search } %>
-      </section>
-
-      <section class="map-section">
-        <%= render partial: "partials/maps/main", locals: {
+    <%# If the senario are more complicated then you will need to render each tab by yourself so you have more freedom to change content in each tab %>
+    <% tabs_list.each do |tab|%>
+      <% @tab_element_id = tab[:id].to_json %>
+      <% @thematic_area_database_tab_cms_content = cms_fragment_render(tab[:content_id]) %>
+      <% if tab[:id] == 1 %>
+        <tab-target :id=<%= @tab_element_id %> :selected-id="slotProps.selectedId">
+          <section class="container--medium">
+            <%= @thematic_area_database_tab_cms_content %>
+          </section>
+          <section class="spacer-large--bottom">
+            <%= render partial: "partials/search/protected-areas", locals: { config: config_search } %>
+          </section>
+          <section class="map-section">
+            <%= render partial: "partials/maps/main", locals: {
           map: map,
           map_options: local_assigns.has_key?(:map_options) ? map_options : nil
         } %>
-      </section>
-    </tab-target>
-
-    <tab-target :id="2" :selected-id="slotProps.selectedId">
-      <section class="container--medium">
-        <%= cms_fragment_render("tab-content-2") %>
-      </section>
-    </tab-target>
-
-    <tab-target :id="3" :selected-id="slotProps.selectedId">
-      <section class="container--medium">
-        <%= cms_fragment_render("tab-content-3") %>
-      </section>
-    </tab-target>
+          </section>
+        </tab-target>
+      <% else %>
+        <tab-target :id=<%= @tab_element_id %> :selected-id="slotProps.selectedId">
+          <section class="container--medium">
+            <%= @thematic_area_database_tab_cms_content %>
+          </section>
+        </tab-target>
+      <% end %>
+    <% end %>
   </template>
 </tabs>
\ No newline at end of file
diff --git a/app/views/wdpa/index.html.erb b/app/views/wdpa/index.html.erb
index efb2652b3..f29c2a5bf 100644
--- a/app/views/wdpa/index.html.erb
+++ b/app/views/wdpa/index.html.erb
@@ -16,7 +16,8 @@
   config_search: @config_search_areas,
   ga_id: "Slug: #{@cms_page.slug}",
   map: @map,
-  tabs: @tabs
+  tabs_json: @tabs,
+  tabs_list: @tabs_list,
 } %>
 
 <section class="container spacer-small--top">