Merge remote-tracking branch 'origin/fix/clean-update-lookbook' into …

…stage

app/assets/stylesheets/components/pill_button.scss

@@ -3,6 +3,7 @@
     display: flex;
     align-items: center;
     border: 1px solid var(--primary-color);
+    color: var(--primary-color) !important;
     border-radius: 32px;
     padding: 10px 20px;
     cursor: pointer;

app/components/concept_details_component.rb

@@ -10,14 +10,14 @@ class ConceptDetailsComponent < ViewComponent::Base
 
   attr_reader :concept_properties
 
-  def initialize(id:, acronym:, concept_id: nil , properties: nil, top_keys: [], bottom_keys: [], exclude_keys: [])
+  def initialize(id:, acronym:, concept_id: nil, properties: nil, top_keys: [], bottom_keys: [], exclude_keys: [])
     @acronym = acronym
     @properties = properties
     @top_keys = top_keys
     @bottom_keys = bottom_keys
     @exclude_keys = exclude_keys
     @id = id
-    @concept_id=concept_id
+    @concept_id = concept_id
 
     @concept_properties = concept_properties2hash(@properties) if @properties
   end
@@ -55,8 +55,8 @@ def row_hash_properties(properties_set, ontology_acronym, &block)
       end
 
       out << [
-        { th:  content_tag(:span, remove_owl_notation(key), title: url, 'data-controller': 'tooltip') },
-        { td: content_tag(:span, ajax_links.join.html_safe) }
+        { th: content_tag(:span, remove_owl_notation(key), title: url, 'data-controller': 'tooltip') },
+        { td: list_items_component(max_items: 5) { |r| ajax_links.map { |val| r.container { val.html_safe } } } }
       ]
     end
     out
@@ -81,7 +81,7 @@ def filter_properties(top_keys, bottom_keys, exclude_keys, concept_properties)
   private
 
   def link_to_format_modal(format, icon)
-    link_to_modal(nil, "/ontologies/#{@acronym}/#{escape(@concept_id)}/serialize/#{format}",{ id: "resource_content_#{format}", data: {show_modal_title_value: @concept_id, show_modal_size_value: 'modal-xl'}}) do
+    link_to_modal(nil, "/ontologies/#{@acronym}/#{escape(@concept_id)}/serialize/#{format}", { id: "resource_content_#{format}", data: { show_modal_title_value: @concept_id, show_modal_size_value: 'modal-xl' } }) do
       inline_svg("icons/#{icon}.svg", width: '50px', height: '50px')
     end
   end

app/components/display/empty_state_component.rb

@@ -0,0 +1,16 @@
+# frozen_string_literal: true
+
+class Display::EmptyStateComponent < ViewComponent::Base
+
+  def initialize(text: t('no_result_was_found'))
+    @text = text
+  end
+
+
+  def call
+    content_tag(:div, class:'browse-empty-illustration') do
+      inline_svg_tag('empty-box.svg') +
+      content_tag(:p, @text)
+    end.html_safe
+  end
+end

app/components/list_items_show_more_component.rb

@@ -0,0 +1,10 @@
+# frozen_string_literal: true
+class ListItemsShowMoreComponent < ViewComponent::Base
+  renders_many :containers
+
+  def initialize(max_items: 10)
+    super
+    @max_items = max_items - 1
+  end
+
+end

app/components/list_items_show_more_component/list_items_show_more_component.html.haml

@@ -0,0 +1,14 @@
+%div{data: {controller: 'reveal-component'}}
+  - containers[..@max_items].each do |item|
+    = item
+
+  - if (@max_items + 1) < containers.size
+    - Array(containers[@max_items+1..]).each do |item|
+      %span{'data-reveal-component-target': "item", class: 'd-none'}
+        = item
+    %div{'data-reveal-component-target': "showButton", 'data-action': "click->reveal-component#show" }
+      %span.btn-link
+        See more
+    %div.d-none{'data-reveal-component-target': "hideButton", 'data-action': "click->reveal-component#hide" }
+      %span.btn-link
+        See less

app/helpers/application_helper.rb

@@ -405,11 +405,8 @@ def insert_sample_text_button(text)
     end
   end
 
-  def empty_state(text = t('no_result_was_found'))
-    content_tag(:div, class:'browse-empty-illustration') do
-      inline_svg_tag('empty-box.svg') +
-      content_tag(:p, text)
-    end
+  def empty_state(text: t('no_result_was_found'))
+    render Display::EmptyStateComponent.new(text: text)
   end
 
   def ontologies_selector(id:, label: nil, name: nil, selected: nil, placeholder: nil, multiple: true, ontologies: onts_for_select)

app/helpers/components_helper.rb

@@ -25,6 +25,11 @@ def chips_component(id: , name: , label: , value: , checked: false , tooltip: ni
       check_input(id: id, name: name, value: value, label: label, checked: checked, disabled: disabled, &block)
     end
   end
+  def list_items_component(max_items:, &block)
+    render ListItemsShowMoreComponent.new(max_items: max_items) do |r|
+      capture(r, &block)
+    end
+  end
 
   def group_chip_component(id: nil, name: , object: , checked: , value: nil, title: nil, disabled: false, &block)
     title ||= object["name"]
@@ -111,7 +116,7 @@ def resolvability_check_tag(url)
   end
 
   def rounded_button_component(link)
-    render RoundedButtonComponent.new(link: link, target: '_blank',size: 'small',title: t("components.go_to_api"))
+    render RoundedButtonComponent.new(link: link, target: '_blank', size: 'small', title: t("components.go_to_api"))
   end
 
   def copy_link_to_clipboard(url, show_content: false)

app/helpers/multi_languages_helper.rb

@@ -1,4 +1,5 @@
 module MultiLanguagesHelper
+  include OntologiesHelper, ComponentsHelper
   def portal_lang
     session[:locale] || 'en'
   end
@@ -172,15 +173,15 @@ def display_in_multiple_languages(label)
                                                 closable: true)
     end
 
-
-
     label = label.to_h.reject { |key, _| %i[links context].include?(key) } if label.is_a?(OpenStruct)
 
     if label.is_a?(String)
       content_tag(:p, label)
     elsif label.is_a?(Array)
-      content_tag(:div) do
-        raw(label.map { |x| content_tag(:div, x) }.join)
+      list_items_component(max_items: show_max) do |r|
+        label.map do |x|
+          r.container { content_tag(:span, x, class: style_as_badge ? 'badge bg-secondary' : '').html_safe }
+        end
       end
     else
       content_tag(:div) do

app/helpers/ontologies_helper.rb

@@ -1,6 +1,5 @@
 require 'iso-639'
 module OntologiesHelper
-  include ApplicationHelper
   REST_URI = $REST_URL
   API_KEY = $API_KEY
   LANGUAGE_FILTERABLE_SECTIONS = %w[classes schemes collections instances properties].freeze

app/views/concepts/_details.html.haml

@@ -19,8 +19,7 @@
         - t.add_row({th: t('ontology_details.concept.synonyms')}) do |h|
           - h.td do
             %div.d-flex
-              %div.d-flex
-                = display_in_multiple_languages(@concept.synonym)
+              = display_in_multiple_languages(@concept.synonym, style_as_badge: true, show_max: 5)
               %div.synonym-change-request
                 = add_synonym_button
                 = remove_synonym_button

app/views/visits/index.html.haml

@@ -14,7 +14,7 @@
       %tbody
         - count = 0
         - @analytics.onts.each do |visits|
-          - ont = @ontologies_hash[visits[:ont].to_s]
+          - ont = @ontologies_hash[visits[:ont].to_s.split('/').last]
           - next if ont.nil?
           - count += 1
           %tr

test/components/previews/buttons/icon_with_tooltip_component_preview.rb

@@ -0,0 +1,23 @@
+class Buttons::IconWithTooltipComponentPreview < ViewComponent::Preview
+
+  # @param title text
+
+  def edit(icon: "edit.svg", title: "Edit")
+    render IconWithTooltipComponent.new(icon: icon, link: "#", title: title)
+  end
+
+  # @param title text
+
+  def delete(icon: "icons/delete.svg", title: "Delete")
+    render IconWithTooltipComponent.new(icon: icon, link: "#", title: title)
+  end
+
+
+  # @param title text
+
+  def preview(icon: "eye.svg", title: "Preview")
+    render IconWithTooltipComponent.new(icon: icon, link: "#", title: title)
+  end
+
+
+end

test/components/previews/buttons/pill_button_component_preview.rb

@@ -2,7 +2,7 @@
 
 class Buttons::PillButtonComponentPreview < ViewComponent::Preview
   # @param text text
-  def default(text: 'hello')
+  def default(text: 'Watch')
     render PillButtonComponent.new(text: text)
   end
 end

test/components/previews/display/empty_state_component_preview.rb

@@ -0,0 +1,6 @@
+class Display::EmptyStateComponentPreview < ViewComponent::Preview
+
+  def default()
+    render Display::EmptyStateComponent.new(text: 'No result was found')
+  end
+end