Feature: Add search language selector (#309)

* add search language selector

* add language in the ajax request

* add flags to search select

* Merge branch 'development' into feat/multilingual

* customizing TomSelect controller

* use tomselect

* remove bootstrap select

* SelectComponent

* remove flag-icon and use his cdn instead

* use flag-icon cdn

* remove flag icon import statement

* change id for select lang

* remove << HEAD

* update tom select component to use options inner HTML text to show icons

* add lag-icons-rails and iso-639 gems to handle flags display and update code usage

* add language selector component

* remove tooltipster dependecies

* fix flag size in the summary page

* add selected argument  to LanguageSelector component

---------

Co-authored-by: Syphax Bouazzouni <[email protected]>

Gemfile

@@ -75,6 +75,8 @@ gem 'will_paginate', '~> 3.0'
 gem 'inline_svg'
 gem "lookbook", '~> 1.5.5'
 gem 'ontologies_api_client', git: 'https://github.com/ontoportal-lirmm/ontologies_api_ruby_client.git', branch: 'development'
+gem "flag-icons-rails", "~> 3.4"
+gem "iso-639", "~> 0.3.6"
 
 # Multi-Provider Authentication
 gem 'omniauth'

Gemfile.lock

@@ -162,6 +162,8 @@ GEM
       multipart-post (~> 2)
     faraday-net_http (2.1.0)
     ffi (1.15.5)
+    flag-icons-rails (3.4.6.1)
+      sass-rails
     flamegraph (0.9.5)
     globalid (1.2.0)
       activesupport (>= 6.1)
@@ -195,6 +197,7 @@ GEM
     io-console (0.6.0)
     irb (1.7.4)
       reline (>= 0.3.6)
+    iso-639 (0.3.6)
     jquery-rails (4.6.0)
       rails-dom-testing (>= 1, < 3)
       railties (>= 4.2.0)
@@ -425,6 +428,8 @@ GEM
     ruby_parser (3.20.3)
       sexp_processor (~> 4.16)
     rubyzip (2.3.2)
+    sass-rails (6.0.0)
+      sassc-rails (~> 2.1, >= 2.1.1)
     sassc (2.4.0)
       ffi (~> 1.9)
     sassc-rails (2.1.2)
@@ -526,6 +531,7 @@ DEPENDENCIES
   dalli
   debug
   ed25519 (>= 1.2, < 2.0)
+  flag-icons-rails (~> 3.4)
   flamegraph
   graphql-client
   haml (~> 5.1)
@@ -534,6 +540,7 @@ DEPENDENCIES
   iconv
   importmap-rails
   inline_svg
+  iso-639 (~> 0.3.6)
   jquery-rails
   jquery-ui-rails
   jsbundling-rails

app/assets/javascripts/application.js

@@ -30,7 +30,6 @@
 //= require_tree ./components
 //= require ontologies
 //= require projects
-//= require tooltipster.bundle.min
 //= require application_esbuild
 customElements.define('data-table-loader', DataTableLoader );
 customElements.define('data-table', DataTable );

app/assets/javascripts/bp_search.js.erb

@@ -293,6 +293,8 @@ function currentSearchParams() {
     params.require_definition = jQuery("#search_require_definition").is(":checked");
     params.exact_match = jQuery("#search_exact_match").is(":checked");
     params.categories = jQuery("#search_categories").val() || "";
+    params.lang = jQuery("#select_search_language").val() || "";
+
     return params;
 }
 
@@ -325,7 +327,8 @@ function performSearch() {
         includeNonProduction = jQuery("#search_include_non_production").is(":checked"),
         includeOnlyDefinitions = jQuery("#search_require_definition").is(":checked"),
         exactMatch = jQuery("#search_exact_match").is(":checked"),
-        categories = jQuery("#search_categories").val() || "";
+        categories = jQuery("#search_categories").val() || "",
+        language = jQuery("#select_search_language").val() || "";
 
     // Set the list of search words to be blacklisted for the ontology ownership algorithm
     blacklistSearchWordsArr = query.split(/\s+/);
@@ -336,6 +339,7 @@ function performSearch() {
         url: determineHTTPS(jQuery(document).data().bp.config.rest_url) + "/search",
         data: {
             q: query,
+            lang: language,
             include_properties: includeProps,
             include_views: includeViews,
             obsolete: includeObsolete,

app/assets/stylesheets/application.css.scss.erb

@@ -20,6 +20,7 @@
  *= require thickbox
  *= require select2
  *= require trumbowyg
+ *= require flag-icon
  *= require theme-variables
  *= require summary
  */

app/assets/stylesheets/summary.scss.erb

@@ -2,6 +2,10 @@
   display: flex;
   justify-content: center;
   flex-wrap: wrap;
+  .flag-icon{
+    width: 30px;
+    height: 30px;
+  }
 }
 
 .summary-page-center .card_title{

app/assets/stylesheets/themes/lirmm/main.scss

@@ -2,18 +2,11 @@
 @import "annotator";
 @import "app";
 @import "bootstrap_overrides";
-@import "flags32";
 @import "jqcloud";
 @import "landscape";
 @import "ontologies";
 @import "recommender";
 @import "search";
-@import "tooltipster.bundle.min";
-@import "plugins/tooltipster/sideTip/themes/tooltipster-sideTip-borderless.min";
-@import "plugins/tooltipster/sideTip/themes/tooltipster-sideTip-light.min";
-@import "plugins/tooltipster/sideTip/themes/tooltipster-sideTip-noir.min";
-@import "plugins/tooltipster/sideTip/themes/tooltipster-sideTip-punk.min";
-@import "plugins/tooltipster/sideTip/themes/tooltipster-sideTip-shadow.min";
 
 
 /************************************