Use qs web component

.github/workflows/build.yml

@@ -10,14 +10,14 @@ concurrency:
 
 jobs:
   build:
-    runs-on: ubuntu-20.04
+    runs-on: ubuntu-latest
     steps:
       - uses: actions/checkout@v3
 
       - name: Set up ruby
         uses: ruby/setup-ruby@v1
         with:
-          ruby-version: 2.7 # can change this to 2.7 or whatever version you prefer
+          ruby-version: 3.2 # can change this to 2.7 or whatever version you prefer
 
       - name: Build Jekyll site
         uses: limjh16/jekyll-action-ts@v2

Gemfile

@@ -36,3 +36,6 @@ gem "wdm", "~> 0.1.0" if Gem.win_platform?
 
 
 gem "webrick", "~> 1.7"
+
+# Copy search-wc.js from the search-wc server
+gem "open-uri", "~> 0.4.1"

Gemfile.lock

@@ -6,6 +6,7 @@ GEM
     asciidoctor (2.0.15)
     colorator (1.1.0)
     concurrent-ruby (1.1.8)
+    date (3.3.4)
     em-websocket (0.5.2)
       eventmachine (>= 0.12.9)
       http_parser.rb (~> 0.6.0)
@@ -61,6 +62,10 @@ GEM
       jekyll (>= 3.5, < 5.0)
       jekyll-feed (~> 0.9)
       jekyll-seo-tag (~> 2.1)
+    open-uri (0.4.1)
+      stringio
+      time
+      uri
     pathutil (0.16.2)
       forwardable-extended (~> 2.6)
     public_suffix (4.0.6)
@@ -72,9 +77,13 @@ GEM
     safe_yaml (1.0.5)
     sassc (2.4.0)
       ffi (~> 1.9)
+    stringio (3.1.0)
     terminal-table (1.8.0)
       unicode-display_width (~> 1.1, >= 1.1.1)
+    time (0.3.0)
+      date
     unicode-display_width (1.7.0)
+    uri (0.13.0)
     webrick (1.7.0)
 
 PLATFORMS
@@ -88,6 +97,7 @@ DEPENDENCIES
   jekyll-feed (~> 0.6)
   jekyll-paginate-v2
   minima (~> 2.0)
+  open-uri (~> 0.4.1)
   tzinfo-data
   webrick (~> 1.7)
 

_config.yml

@@ -26,8 +26,14 @@ github_fork_url: "https://github.com/quarkusio/quarkus"
 # See https://github.com/quarkusio/search.quarkus.io/blob/main/src/main/java/io/quarkus/search/app/entity/Language.java
 language: en
 search:
+  # The script mode is direct or cached. Cached means the search script is copied from the remote service.
+  script-mode: "cached"
   # The URL of the remote search service
-  url: "https://search.quarkus.io/"
+  host: "https://search.quarkus.io"
+  # The path to the search script (relative from the search.host)
+  script-path: "/static/bundle/main.js"
+  # Where to copy the search script file for cached mode
+  cached-script-file: "assets/javascript/search-wc.js"
   # The amount of time before we give up on a pending remote search and fall back to Javascript search.
   # The search service itself is reasonably fast on a decent machine (with curl: ~100ms median, ~150ms 90th percentile).
   # but it's slower on prod machines (with curl: ~200ms median, ~400ms 90th percentile),
@@ -57,6 +63,9 @@ plugins:
   - jekyll-archives
   - jekyll-auto-authors
 
+keep_files:
+  - assets/javascripts/search-wc.js
+
 sass:
   style: compressed
 
@@ -194,7 +203,7 @@ autopages:
     data: '_data/authors.yaml' # Data file with the author details
     # Uncomment the line below to force exclude certain authors from autopage generation.
     # exclude: [ "author1", "author2" ]
-    layouts: 
+    layouts:
       - 'author.html' # We'll define this layout later
     title: 'Posts by :author'
     permalink: '/author/:author/'

_config_dev.yml

@@ -2,4 +2,15 @@
 
 # We don't want to use the production instance of search.quarkus.io for development.
 search:
-  url: "http://localhost:8080/"
+
+# Use this to directly use the local instance of search.quarkus.io
+  script-mode: "direct"
+  host: "http://localhost:8080"
+
+# Use this to copy from the local instance of search.quarkus.io
+#  script_mode: "cached"
+
+
+# Use this to copy from the production instance of search.quarkus.io
+#  script_mode: "cached"
+#  host: "https://search.quarkus.io/"

_includes/index-doc-item.html

@@ -1,17 +1,21 @@
 {% assign is_external_guide = include.url | startswith: 'http' %}
 {% if is_external_guide %}
-  {% assign guide_url = include.url %}
+{% assign guide_url = include.url %}
 {% elsif include.docversion == 'latest' %}
-  {% assign guide_url = site.baseurl | append: include.url %}
+{% assign guide_url = site.baseurl | append: include.url %}
 {% else %}
-  {% assign guide_url = site.baseurl | append: '/version/' | append: include.docversion | append: include.url %}
+{% assign guide_url = site.baseurl | append: '/version/' | append: include.docversion | append: include.url %}
 {% endif %}
-<div class="{% if include.origin == 'quarkiverse-hub' %}quarkiverse {% endif %}grid__item docs-card {{ include.class }}">
+<qs-guide type="{{ include.type | escape }}"
+          title="{{ include.title | escape }}"
+          url="{{ guide_url }}"
+          summary="{{ include.summary | markdownify }}"
+          keywords="{{ include.keywords | escape }}"
+          categories="{{ include.categories | escape }}"
+          origin="{{ include.origin | escape }}"
+>
+  <!-- WE KEEP PART OF THE CONTENT FOR SEO -->
   <h4><a href="{{ guide_url }}" {% if is_external_guide %}target="_blank" {% endif %}>{{ include.title }}</a></h4>
   <div class="description">{{ include.summary | markdownify }}</div>
-  <div class="keywords">{{ include.keywords }}</div>
-  <div class="categories">{{ include.categories }}</div>
-  {% if include.origin == 'quarkiverse-hub' -%}
-  <div class="origin">Quarkiverse Hub</div>
-  {% endif -%}
-</div>
+</qs-guide>
+