Feature: Associate categories inputs with their parents in selecting/deselecting

app/helpers/application_helper.rb

@@ -452,4 +452,21 @@ def categories_select(id: nil, name: nil, selected: 'None')
     render Input::SelectComponent.new(id: id, name: name, value: categories_for_select, selected: selected, multiple: true)
   end
 
+  def categories_with_children(categories)
+    parent_to_children = Hash.new { |hash, key| hash[key] = [] }
+    categories.each do |category|
+      next unless category.parentCategory
+      category.parentCategory.each do |parent_id|
+        parent_acronym = id_to_acronym(parent_id)
+        child_acronym = id_to_acronym(category.id)
+        parent_to_children[parent_acronym] << child_acronym
+      end
+    end
+    parent_to_children
+  end
+
+  def id_to_acronym(id)
+    id.split('/').last
+  end
+
 end

app/helpers/ontologies_helper.rb

@@ -814,9 +814,10 @@ def browse_taxonomy_tooltip(taxonomy_type)
   def browse_chip_filter(key:, object:, values:, countable: true, count: nil)
     title = (key.to_s.eql?("categories") || key.to_s.eql?("groups")) ? nil : ''
     checked = values.any? { |obj| [link_last_part(object["id"]), link_last_part(object["value"])].include?(obj) }
-
-    group_chip_component(name: key, object: object, checked: checked, title: title) do |c|
-      c.count { browse_chip_count_badge(key: key, id: object["id"], count: count) } if countable
+    content_tag(:div, (key.to_s.eql?("categories") ? { 'data-action' => 'click->parent-categories-selector#check' } : {})) do
+      group_chip_component(name: key, object: object, checked: checked, title: title) do |c|
+        c.count { browse_chip_count_badge(key: key, id: object["id"], count: count) } if countable
+      end
     end
   end
 

app/helpers/submission_inputs_helper.rb

@@ -1,7 +1,7 @@
 module SubmissionInputsHelper
 
   class SubmissionMetadataInput
-    include MetadataHelper
+    include MetadataHelper, ApplicationHelper
 
     def initialize(attribute_key:, attr_metadata:, submission: nil, label: nil)
       @attribute_key = attribute_key
@@ -128,14 +128,17 @@ def ontology_administered_by_input(ontology = @ontology, users_list = @user_sele
 
   def ontology_categories_input(ontology = @ontology, categories = @categories)
     categories ||= LinkedData::Client::Models::Category.all(display_links: false, display_context: false)
+    categories_children = categories_with_children(categories)
 
     render Input::InputFieldComponent.new(name: '', label: 'Categories') do
-      content_tag(:div, class: 'upload-ontology-chips-container') do
+      content_tag(:div, class: 'upload-ontology-chips-container', 'data-controller': 'parent-categories-selector', 'data-parent-categories-selector-categories-children-value': "#{categories_children.to_json}", 'data-parent-categories-selector-target': "chips") do
         hidden_field_tag('ontology[hasDomain][]') +
-          categories.map do |category|
+        categories.map do |category|
+          content_tag(:div, 'data-action': 'click->parent-categories-selector#check') do
             category_chip_component(id: category[:acronym], name: "ontology[hasDomain][]",
                                     object: category, value: category[:id],
                                     checked: ontology.hasDomain&.any? { |x| x.eql?(category[:id]) })
+            end
           end.join.html_safe
       end
     end

app/javascript/controllers/index.js

@@ -100,3 +100,6 @@ application.register('mappings', MappingsController)
 
 import ConceptsJsonButtonController from "./concepts_json_button_controller.js"
 application.register('concepts-json', ConceptsJsonButtonController)
+
+import ParentCategoriesSelectorController from "./parent_categories_selector_controller.js"
+application.register('parent-categories-selector', ParentCategoriesSelectorController)

app/javascript/controllers/parent_categories_selector_controller.js

@@ -0,0 +1,31 @@
+import { Controller } from "@hotwired/stimulus"
+
+// Connects to data-controller="parent-categories-selector"
+export default class extends Controller {
+    static targets = ['chips']
+    static values = { categoriesChildren: Object}
+
+    check(event){
+        const input = event.currentTarget.querySelector('input')
+        const allInputs = this.chipsTarget.querySelectorAll('input')
+        const parents = this.categoriesChildrenValue
+        if(this.#id_to_acronym(input.value) in parents){
+            const parentChildren = parents[this.#id_to_acronym(input.value)]
+            allInputs.forEach(i => {
+                if(parentChildren.includes(this.#id_to_acronym(i.value))){
+                    if(input.checked){
+                        i.checked = true;
+                        i.dispatchEvent(new Event('change', { bubbles: true })); 
+                    } else {
+                        i.checked = false;
+                        i.dispatchEvent(new Event('change', { bubbles: true })); 
+                    }
+                }
+            });
+        }
+    }
+
+    #id_to_acronym(id){
+        return id.split('/').pop();
+    }
+}

app/views/ontologies/browser/browse.html.haml

@@ -44,15 +44,16 @@
             %div.browse-filter
               = switch_input(id:'filter-views', name:'views', checked: @show_views, label: t("ontologies.browser.show_ontology_views"))
               = switch_input(id:'filter-retired', name:'retired',checked: @show_retired , label: t("ontologies.browser.show_retired_ontologies"))
-
-            - @filters.each do |key, values|
-              %div{ id: "#{key}_filter_container", data:{controller: "browse_filters show-filter-count",
-                  action: "change->show-filter-count#updateCount
-                           change->browse-filters#dispatchFilterEvent"}}
-                - objects, checked_values, count = values
-                = dropdown_component(id: "browse-#{key}-filter", is_open: count.positive?) do |d|
-                  - d.title { browse_filter_section_header(key: key, count: count)}
-                  = browse_filter_section_body(key: key, checked_values: checked_values, objects: objects)
+            %div{'data-controller': 'parent-categories-selector', 'data-parent-categories-selector-categories-children-value': "#{categories_with_children(@categories).to_json}"}
+              - @filters.each do |key, values|
+                %div{ id: "#{key}_filter_container", data:{controller: "browse_filters show-filter-count", 
+                    action: "change->show-filter-count#updateCount
+                            change->browse-filters#dispatchFilterEvent"}}
+                  %div{key.eql?(:categories) ? {'data-parent-categories-selector-target': "chips"} : {}}
+                    - objects, checked_values, count = values
+                    = dropdown_component(id: "browse-#{key}-filter", is_open: count.positive?) do |d|
+                      - d.title { browse_filter_section_header(key: key, count: count)}
+                      = browse_filter_section_body(key: key, checked_values: checked_values, objects: objects)
 
             - if federation_enabled?
               %div{ data:{action: "change->browse-filters#federationChange"}}
@@ -61,6 +62,7 @@
                   .px-1.browse-federation-input-chips
                     = federation_input_chips(name: "portals")
 
+
         .browse-second-row
           .browse-search-bar
             .browse-search-container