Fix: Taxonomy empty list (#858)

* fix nil parentCategory issue in nest_categories_children method

* add empty illustration if a taxonomy list is empty

* remove random code in taxonomy index view file

* treat the case when a category is deleted while keeping its id as a parent for a certain category

* use empty_state helper in taxonomies page

* internationalize no taxonomy is created

* use current_user_admin? helper in taxonomies page

* use regular button helper in taxonomies page

* remove added code just to test in taxonomy page

app/assets/stylesheets/taxonomy.scss

@@ -109,4 +109,23 @@
     background-color: var(--primary-color);
 }
 
+.taxonomy-empty-illustration{
+    display: flex;
+    flex-direction: column;
+    align-items: center;
+    justify-content: center;
+    width: 100%;
+    .browse-empty-illustration {
+        margin-top: 40px;
+    }
+}
+
+
+.taxonomy-empty-illustration-text{
+    color: var(--gray-color);
+
+}
+.taxonomy-empty-illustration-button{
+    width: 168px;
+}
 

app/controllers/taxonomy_controller.rb

@@ -32,8 +32,9 @@ def nest_categories_children(categories)
       category_index[category[:id]] = category
     end
     categories.each do |category|
-      category[:parentCategory].each do |parent_id|
+      category[:parentCategory]&.each do |parent_id|
         parent = category_index[parent_id]
+        next if parent.nil?
         parent[:children] ||= []
         parent[:children] << category
       end

app/helpers/components_helper.rb

@@ -274,8 +274,8 @@ def properties_dropdown(id, title, tooltip, properties, is_open: false, &block)
     end
   end
 
-  def regular_button(id, value, variant: "secondary", state: "regular", size: "slim", &block)
-    render Buttons::RegularButtonComponent.new(id:id, value: value, variant: variant, state: state, size: size) do |btn|
+  def regular_button(id, value, variant: "secondary", state: "regular", size: "slim", href: nil, &block)
+    render Buttons::RegularButtonComponent.new(id:id, value: value, variant: variant, state: state, size: size, href: href) do |btn|
       capture(btn, &block) if block_given?
     end
   end

app/views/taxonomy/_taxonomies.html.haml

@@ -1,10 +1,17 @@
 .taxonomy-section
-    - pairs, impairs = taxonomies.each_with_index.partition { |_, index| index.even? }
-    - taxonomies_first_row = pairs.map(&:first)
-    - taxonomies_second_row = impairs.map(&:first)
-    .first-row
-        - taxonomies_first_row.each do |taxonomy|
-            = render Display::TaxonomyCardComponent.new(taxonomy: taxonomy, ontologies_names: @ontologies_names)
-    .second-row
-        - taxonomies_second_row.each do |taxonomy|
-            = render Display::TaxonomyCardComponent.new(taxonomy: taxonomy, ontologies_names: @ontologies_names)
+    - if taxonomies.blank?
+        .taxonomy-empty-illustration
+            = empty_state(t('taxonomy.no_taxonomy_created', type: type))
+            - if current_user_admin?
+                .taxonomy-empty-illustration-button
+                    = regular_button('create-taxonomy', "Create #{type}", variant: "secondary", size: "slim", href: "/admin?section=#{type}")
+    - else
+        - pairs, impairs = taxonomies.each_with_index.partition { |_, index| index.even? }
+        - taxonomies_first_row = pairs.map(&:first)
+        - taxonomies_second_row = impairs.map(&:first)
+        .first-row
+            - taxonomies_first_row.each do |taxonomy|
+                = render Display::TaxonomyCardComponent.new(taxonomy: taxonomy, ontologies_names: @ontologies_names)
+        .second-row
+            - taxonomies_second_row.each do |taxonomy|
+                = render Display::TaxonomyCardComponent.new(taxonomy: taxonomy, ontologies_names: @ontologies_names)

app/views/taxonomy/index.html.haml

@@ -10,11 +10,11 @@
         = render TabsContainerComponent.new do |c|
             - c.item(title: 'Groups', selected: !@category_section_active)
             - c.item_content do
-                = render partial: '/taxonomy/taxonomies', locals: { taxonomies: @groups }
+                = render partial: '/taxonomy/taxonomies', locals: { taxonomies: @groups, type: 'groups' }
 
             - c.item(title: 'Categories', selected: @category_section_active)
             - c.item_content do
-                = render partial: '/taxonomy/taxonomies', locals: { taxonomies: @categories }
+                = render partial: '/taxonomy/taxonomies', locals: { taxonomies: @categories, type: 'categories' }
 :javascript
     document.getElementById('categories_tab').addEventListener('click', function(event) {
         window.history.pushState({ path: '/categories' }, '', '/categories');

config/locales/en.yml

@@ -1480,7 +1480,7 @@ en:
     groups_and_categories: Groups and Categories
     description: "In %{portal}, ontologies are organized in groups and tagged with categories. Typically, groups associate ontologies from the same project or organization for better identification of the provenance. Whereas categories are about subjects/topics and enable to classify ontologies. As of 2016, %{portal}'s categories were established in cooperation with FAO AIMS. In 2024, we moved to UNESCO Thesaurus (https://vocabularies.unesco.org). Groups and categories, along with other metadata, can be used on the “Browse” page of %{portal} to filter out the list of ontologies."
     show_sub_categories: Show sub categories
-
+    no_taxonomy_created: "No %{type} are created yet"
   federation:
     results_from_external_portals: Results from external portals
     not_responding: is not responding.

config/locales/fr.yml

@@ -1516,6 +1516,8 @@ fr:
     groups_and_categories: Groupes et Catégories
     description: "Dans %{portal}, les ontologies sont organisées en groupes et étiquetées avec des catégories. Typiquement, les groupes associent des ontologies provenant du même projet ou de la même organisation pour une meilleure identification de la provenance. Tandis que les catégories concernent des sujets/thématiques et permettent de classifier les ontologies. En 2016, les catégories d'%{portal} ont été établies en coopération avec FAO AIMS. En 2024, nous sommes passés au Thésaurus de l'UNESCO (https://vocabularies.unesco.org). Les groupes et les catégories, ainsi que d'autres métadonnées, peuvent être utilisés sur la page “Parcourir” d'%{portal} pour filtrer la liste des ontologies."
     show_sub_categories: Afficher les sous-catégories
+    no_taxonomy_created: "Aucun %{type} n'a encore été créé"
+
   federation:
     results_from_external_portals: Résultats provenant de portails externes
     not_responding: ne répond pas.