Added warning box for EOL versions (#2378)

Author: mnocon

docs/css/custom.css

@@ -592,3 +592,11 @@ div.pills {
     font-weight: bolder;
     padding-bottom: 4px;
 }
+
+#older-versions {
+    cursor: pointer;
+}
+
+[hidden] {
+    display: none !important;
+}

docs/js/custom.js

@@ -3,13 +3,21 @@ let jquery = jQuery;
 
 $(document).ready(function() {
     // replace edit url
-    var branchName = 'master',
-        branchNameRegexp = /\/en\/([a-z0-9-_.]*)\//g.exec(document.location.href);
+    let branchName = 'master';
+    const branchNameRegexp = /\/en\/([a-z0-9-_.]*)\//g.exec(document.location.href);
+    const eolVersions = window.eol_versions ?? [];
 
     if (branchNameRegexp !== null && branchNameRegexp.hasOwnProperty(1) && branchNameRegexp[1].length) {
         branchName = branchNameRegexp[1];
     }
 
+    // Show warning box for versions that have reached End Of Life
+    if (eolVersions.includes(branchName)) {
+        const warningBox = document.querySelector('#eol-warning-box');
+
+        warningBox.hidden = false;
+    }
+
     $('.md-content a.md-icon').each(function() {
         $(this).attr(
             'href',
@@ -37,7 +45,7 @@ $(document).ready(function() {
     var update = setInterval(function() {
         let ready = false, version = '';
         if ($('readthedocs-flyout').length) {
-            $('dl.versions', $('readthedocs-flyout').prop('shadowRoot')).appendTo('.version-switcher .switcher__list');
+            $('dl.versions', $('readthedocs-flyout').prop('shadowRoot')).prependTo('.version-switcher .switcher__list');
             $('readthedocs-flyout').remove();
             version = $('.switcher__list dl.versions dd strong a').text();
             ready = true;
@@ -61,6 +69,27 @@ $(document).ready(function() {
             if ('master' !== (vl = $('.rst-other-versions.switcher__list dl.versions')).find('dd:first').text()) {
                 vl.find('dd').each(function() {$(this).detach().prependTo(vl)});
             }
+
+            const allVersions = [...document.querySelectorAll('.switcher__list .versions dd')];
+            const olderVersions = document.querySelector('#older-versions');
+
+            if (eolVersions.includes(branchName)) {
+                olderVersions.hidden = false;
+            }
+
+            allVersions
+                .filter((versionNode) => eolVersions.includes(versionNode.textContent))
+                .forEach((versionNode) => {
+                    versionNode.hidden = true;
+                });
+
+            olderVersions.addEventListener('click', (event) => {
+                event.stopPropagation();
+                allVersions.forEach((versionNode) => {
+                    versionNode.hidden = false;
+                });
+                olderVersions.hidden = true;
+            });
         }
     }, 300);
     setTimeout(function() {

mkdocs.yml

@@ -394,6 +394,9 @@ extra:
   product_name_connect: 'Ibexa Connect'
   product_name_cloud: 'Ibexa Cloud'
   product_name_oss: 'Ibexa OSS'
+
+  eol_versions: ['2.5']
+
   # Global variables - latest tag versions
   latest_tag_2_5: '2.5.32'
   latest_tag_3_3: '3.3.37'

theme/main.html

@@ -1,6 +1,7 @@
 {% extends "base.html" %}
   {% block extrahead %}
     <meta name="google-site-verification" content="zttxcBm_blrd3kCAsNlGZqvzga_-8ovH4IxSHw2l5OQ" />
+    <script>window.eol_versions = {{ config.extra.eol_versions|tojson }};</script>
     <!-- Google Tag Manager --> <script>(function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer','GTM-KKQR5LG');</script> <!-- End Google Tag Manager -->
   {% endblock %}
     {% block site_nav %}
@@ -57,6 +58,7 @@
             {% endif %}
           </div>
           {% endif %}
+          {% include "partials/eol_warning.html" %}
           {{ page.content }}
           {% include "partials/tags.html" %}
         </div>

theme/partials/eol_warning.html

@@ -0,0 +1,5 @@
+<div id="eol-warning-box" class="admonition caution" hidden>
+    <div class="admonition-title">
+        This documentation is for a version that has reached its <a href="https://support.ibexa.co/Public/service-life">End Of Life</a>. Such versions are no longer supported and don't receive security updates. Consider <a href="https://doc.ibexa.co/en/latest/update_and_migration/update_ibexa_dxp/">updating to a newer version</a>.
+    </div>
+</div>

theme/partials/version_switcher.html

@@ -5,5 +5,6 @@
         </div>
     </div>
     <div class="rst-other-versions switcher__list">
+        <dd id="older-versions" hidden><a>Older versions</a></dd>
     </div>
 </div>