Fix: the new summary page bugs (#371)

* update language field component to have a better display of not valid ISO links

* fix the error page image not displaying the good color

* fix turbo frame error text extraction from the new errors pages

* fix summary links section display to use link component

* catch remaining  cases when @concept is nil in the ontology viewer

* fix ontology subscribe button  error message not showing

* show a better  error message when no classes found

* fix the concept  dates list view to use the correct alert component

* add '.svg' to the LinkText components icons

* fix new ontology form error not displaying when acronym is already used

* fix concept details, inSchemes and In Collection chips with no margin

* not show narrower row in concept details

app/assets/stylesheets/components/regular_button.scss

@@ -118,7 +118,7 @@
 }
 
 .primary-button-icon path {
-    fill: white;
+    fill: white !important;
 }
 
 

app/assets/stylesheets/ontologies.scss

@@ -1,9 +1,6 @@
 $ont-metadata-bg-color: #e2ebf0;
 $widget-table-border-color: #EFEFEF;
 
-svg path {
-  fill: var(--primary-color);
-}
 
 .ontologies.show .gutter {
   background-repeat: no-repeat;

app/assets/stylesheets/ontology_viewer.scss

@@ -1,3 +1,8 @@
+.ontology-viewer{
+  svg path {
+    fill: var(--primary-color);
+  }
+}
 .ontologies-tabs-container {
   & > .tabs-container {
     justify-content: center;

app/assets/stylesheets/summary.scss.erb

@@ -99,7 +99,7 @@
 
 
 .disabled-icon svg path {
-  fill: rgba(0, 0, 0, 0.1);
+  fill: rgba(0, 0, 0, 0.1) !important;
 }
 
 .normal_text {

app/components/external_link_text_component.rb

@@ -3,6 +3,6 @@
 class ExternalLinkTextComponent < LinkTextComponent
 
   def initialize(text:)
-    super(text: text, icon: 'icons/external-link')
+    super(text: text, icon: 'icons/external-link.svg')
   end
 end

app/components/internal_link_text_component.rb

@@ -2,6 +2,6 @@
 
 class InternalLinkTextComponent < LinkTextComponent
   def initialize(text:)
-    super(text: text, icon: 'icons/internal-link')
+    super(text: text, icon: 'icons/internal-link.svg')
   end
 end

app/components/language_field_component.rb

@@ -13,11 +13,7 @@ def initialize(value:, label: nil)
   end
 
   def lang_code
-    if @lang_code
-      @lang_code = 'gb' if @lang_code.eql?('en')
-      @lang_code
-    else
-      @value
-    end
+    @lang_code = 'gb' if @lang_code.eql?('en')
+    @lang_code
   end
 end

app/components/language_field_component/language_field_component.html.haml

@@ -5,4 +5,4 @@
       %div.ml-1
         = @label
 - else
-  = render ChipButtonComponent.new(text: @value)
+  = render ChipButtonComponent.new(text: @value ?  @value.split('/').last : 'NO-LANG')

app/components/link_field_component.rb

@@ -2,9 +2,10 @@
 
 class LinkFieldComponent < ViewComponent::Base
 
-  def initialize(value:)
+  def initialize(value:, raw: false)
     super
     @value = value
+    @raw = raw
   end
 
 

app/components/link_field_component/link_field_component.html.haml

@@ -1,5 +1,5 @@
 - if internal_link?
-  = render ChipButtonComponent.new(url: @value.to_s.sub("data.", ""), text: @value.to_s.split("/").last, type: "clickable")
+  = render ChipButtonComponent.new(url: @value.to_s.sub("data.", ""), text: @raw ? @value : @value.to_s.split("/").last, type: "clickable")
 - elsif @value.to_s =~ /\A#{URI::regexp(%w[http https])}\z/
   = render ChipButtonComponent.new(url: @value.to_s, text:  @value.to_s, type: "clickable")
 - else

app/components/ontology_subscribe_button_component/ontology_subscribe_button_component_controller.js

@@ -23,9 +23,15 @@ export default class extends Controller {
             type: "POST",
             url: url,
             dataType: "json",
-            success: () => {
+            success: (data) => {
                 // Change subbed value on a element
                 this.#hideSpinner()
+
+                if(!data.updated_sub){
+                    this.#showError()
+                    return
+                }
+
                 let linkElement = $(this.element);
                 this.isSubbedValue = !isSubbed
 

app/components/popup_link_text_component.rb

@@ -3,7 +3,7 @@
 class PopupLinkTextComponent < LinkTextComponent
 
   def initialize(text:)
-    super(text: text, icon: 'icons/popup-link')
+    super(text: text, icon: 'icons/popup-link.svg')
   end
 
 end

app/components/tree_infinite_scroll_component/tree_infinite_scroll_component.html.haml

@@ -11,5 +11,5 @@
 
   - c.error do
     %div.text-wrap
-      = render AlertMessageComponent.new(id: "#{@id}_view_alert") do
+      = render Display::AlertComponent.new(type:'info') do
         = error

app/controllers/application_controller.rb

@@ -486,7 +486,8 @@ def get_class(params)
         @roots = @ontology.explore.roots(concept_schemes: params[:concept_schemes])        
         if @roots.nil? || @roots.empty?
           LOG.add :debug, "Missing @roots for #{@ontology.acronym}"
-          @concept = @ontology.explore.classes.collection.first.explore.self(full: true)
+          classes = @ontology.explore.classes.collection
+          @concept = classes.first.explore.self(full: true) if classes.first
           return
         end
 

app/controllers/ontologies_controller.rb

@@ -101,7 +101,7 @@ def classes
 
     @current_purl = @concept.purl if $PURL_ENABLED
 
-    unless @concept.id == 'bp_fake_root'
+    unless @concept.nil? || @concept.id == 'bp_fake_root'
       @notes = @concept.explore.notes
     end
 

app/helpers/application_helper.rb

@@ -294,12 +294,9 @@ def help_tooltip(content, html_attribs = {}, icon = 'fas fa-question-circle', cs
   end
 
   def error_message_text
+    return @errors if @errors.is_a?(String)
     @errors = @errors[:error] if @errors && @errors[:error]
-    if @errors.is_a?(String)
-      @errors
-    else
-      "Errors in fields #{@errors.keys.join(', ')}"
-    end
+    "Errors in fields #{@errors.keys.join(', ')}"
   end
 
   def error_message_alert
@@ -485,7 +482,7 @@ def subscribed_to_ontology?(ontology_acronym, user)
     return false if user.subscription.nil? or user.subscription.empty?
     user.subscription.each do |sub|
       #sub = {ontology: ontology_acronym, notification_type: "NOTES"}
-      sub_ont_acronym = sub[:ontology].split('/').last # make sure we get the acronym, even if it's a full URI
+      sub_ont_acronym = sub[:ontology] ?  sub[:ontology].split('/').last : nil #  make sure we get the acronym, even if it's a full URI
       return true if sub_ont_acronym == ontology_acronym
     end
     return false

app/helpers/concepts_helper.rb

@@ -19,6 +19,8 @@ def exclude_relation?(relation_to_check, ontology = nil)
   end
 
   def get_concept_id(params, concept, root)
+    return nil if concept.nil?
+
     if concept_id_param_exist?(params)
       concept.nil? ? '' : concept.id
     elsif !root.children.first.nil?

app/helpers/inputs_helper.rb

@@ -52,6 +52,7 @@ def input_label(label, name)
   end
 
   def attribute_error(attr)
+    return '' if @errors.is_a?(String)
     return '' unless @errors && @errors[attr.to_sym]
 
     errors = @errors[attr.to_sym]

app/helpers/mappings_helper.rb

@@ -37,7 +37,6 @@ def translation?(relation_array)
         false
       end
     else
-      LOG.add :error, "Warning: Mapping relation is not an array"
       false
     end
   end

app/views/concepts/_details.html.haml

@@ -4,10 +4,10 @@
 
 
   = render ConceptDetailsComponent.new(id:'concept-details', acronym: @ontology.acronym,
-              properties: @concept.properties,
-              top_keys: %w[description comment],
-              bottom_keys: %w[disjoint subclass is_a has_part],
-              exclude_keys: schemes_keys + label_xl_set + ['inScheme']) do |c|
+                properties: @concept.properties,
+                top_keys: %w[description comment],
+                bottom_keys: %w[disjoint subclass is_a has_part],
+                exclude_keys: schemes_keys + label_xl_set + ['inScheme', 'narrower']) do |c|
 
     - c.header(stripped: true) do |t|
       - t.add_row({th: t('ontology_details.concept.id')}, {td:@concept.id})
@@ -36,15 +36,15 @@
         - unless @concept.memberOf.nil?  || @concept.memberOf.empty?
           - t.add_row({th: t('ontology_details.concept.member_of')}) do |h|
             - h.td do
-              %div.my-1
-                - @concept.memberOf.each do |v|
+              - @concept.memberOf.each do |v|
+                %span.m-1
                   = raw get_link_for_collection_ajax(v, @ontology.acronym, '_blank')
 
         - unless @concept.inScheme.nil?  || @concept.inScheme.empty?
           - t.add_row({th: t('ontology_details.concept.in_schemes')}) do |h|
             - h.td do
-              %div.my-1
-                - @concept.inScheme.each do |v|
+              - @concept.inScheme.each do |v|
+                %span.m-1
                   = raw get_link_for_scheme_ajax(v, @ontology.acronym, '_blank')
 
         - t.add_row({th: t('ontology_details.concept.type')} , {td: @concept.type})

app/views/concepts/_show.html.haml

@@ -1,6 +1,6 @@
 = render TurboFrameComponent.new(id: 'concept_show', data: {controller:'labels-ajax-container', 'action': 'turbo:before-fetch-request->labels-ajax-container#abortAll', 'labels-ajax-container-label-ajax-outlet': '#concept_show a[data-controller="label-ajax"]'}) do
   - if @concept.id.eql?("bp_fake_root")
-    %div{:style => "padding: 100px 0; font-size: larger; font-weight: bold; text-align: center;"}
+    = render Display::AlertComponent.new do
       Use the "Jump To" to find a class and display details, visualization, notes, and mappings
   - else
     = render TabsContainerComponent.new(type:'outline') do |c|

app/views/errors/internal_server_error.html.haml

@@ -1,6 +1,6 @@
-.d-flex.align-items-center.flex-column.position-relative
+.d-flex.align-items-center.flex-column.position-relative.error-page
   = inline_svg("errors/agroportal.svg")
-  .position-absolute.text-center{style: "top: 425px; font-size: 30px; font-weight: 800; color: #263238;"}
+  %h1.position-absolute.text-center{style: "top: 425px; font-size: 30px; font-weight: 800; color: #263238;"}
     %div
       We're sorry but something has gone wrong.
     %div

app/views/errors/not_found.html.haml

@@ -1,6 +1,6 @@
-.d-flex.align-items-center.flex-column.position-relative
+.d-flex.align-items-center.flex-column.position-relative.error-page
     = inline_svg("errors/agroportal.svg") 
-    .position-absolute{style: "top: 442px; font-size: 30px; font-weight: 800; color: #263238;"}
+    %h1.position-absolute{style: "top: 442px; font-size: 30px; font-weight: 800; color: #263238;"}
         = @error_message || "Page not found"
     .buttons.d-flex.justify-content-center.mt-3
         %div{style: "width: 216px;"}

app/views/layouts/_ontology_viewer.html.haml

@@ -3,7 +3,7 @@
 
 
 = render :partial =>'layouts/header'
-%div#bd.bg-white
+%div#bd.bg-white.ontology-viewer
   :javascript
     // Javascript History HTML5 API
     if ( typeof JSON === 'undefined' ) {

app/views/ontologies/sections/_metadata.html.haml

@@ -21,7 +21,10 @@
           = render ChipButtonComponent.new(type: "static",'data-controller':' tooltip', title: '', class: 'text-truncate', style: 'max-width: 280px; display:block; line-height: unset') do
             = display_agent(v, link: false)
 
-      = properties_dropdown('link','Links','Metadata properties that highlight the links enabling access to datasets, downloading semantic resources, etc', @links_properties)
+      = properties_dropdown('link','Links','Metadata properties that highlight the links enabling access to datasets, downloading semantic resources, etc', @links_properties)  do |values|
+        = horizontal_list_container(values) do |v|
+          = render LinkFieldComponent.new(value: v, raw: true)
+
 
       = properties_dropdown('projects_section','Projects and usage information','Details pertaining to the utilization of the ontology.', nil) do |c|
         - c.row do

app/views/ontologies/sections/_widgets.html.haml

@@ -134,7 +134,7 @@
                             %code uri
                             put the complete URI of the class (e.g.,
                             = succeed ")" do
-                              %a.external.free{:href => @ontology.explore.classes["collection"].first.id, :rel => "nofollow", :title => "/visualize/39478/Common_Neoplasm"}
+                              %a.external.free{:href => @ontology.explore.classes["collection"].first&.id, :rel => "nofollow", :title => "/visualize/39478/Common_Neoplasm"}
                                 = @ontology.explore.classes["collection"].first.id
                           %li
                             %code shortid

app/views/ontologies/sections/visualize.html.haml

@@ -1,5 +1,5 @@
 =  render TurboFrameComponent.new(id: "classes", data: {"turbo-frame-target": "frame"} ) do
-  - unless @error
+  - unless @error || @concept.nil?
     - @title = "#{@ontology.name} - #{@concept.prefLabel}"
     - @new_term_request_ontologies
     - @enable_ontolobridge = !$NEW_TERM_REQUEST_ONTOLOGIES.nil? && $NEW_TERM_REQUEST_ONTOLOGIES.include?(@ontology.acronym)
@@ -14,9 +14,9 @@
       %input{:name => "search[ontologies][]", :type => "hidden", :value => @ontology.acronym}/
       = hidden_field :search, :search_type, :value=>"contains"
       = hidden_field :search, :keyword, :value=>"",:id=>"search_keyword"
-  - else # found an error
-    = "<div id=\"error\"><h2>#{@error}</h2></div>"
-
+  - else
+    = render Display::AlertComponent.new(type: 'danger') do
+      =  @concept.nil? ? 'No class/concept found' : @error
   :javascript
     $(document).ready(function() {
     const ontology_acronym = "#{@ontology.acronym}"