From 8f04be1903c87e79e5c693cae6bb688a14032e81 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?C=C3=A9dric=20Bonhomme?= <cedric@cedricbonhomme.org>
Date: Wed, 13 Nov 2024 09:28:34 +0100
Subject: [PATCH] chg: [website] Added a function in order to provide a small
 description about the vulnerabilities listed in the bundle page.

---
 website/web/static/js/utils.js            |  6 +++
 website/web/templates/bundles/bundle.html | 53 ++++++++++++++++++++++-
 2 files changed, 58 insertions(+), 1 deletion(-)

diff --git a/website/web/static/js/utils.js b/website/web/static/js/utils.js
index db91b89..c72e256 100644
--- a/website/web/static/js/utils.js
+++ b/website/web/static/js/utils.js
@@ -71,6 +71,12 @@ function formatMarkdownOutput() {
   });
 }
 
+function truncateString(str, maxLength) {
+  if (str.length > maxLength) {
+      return str.slice(0, maxLength) + "...";
+  }
+  return str;
+}
 
 function findCVEIdentifiers(text) {
   // Regex pattern to match CVE identifiers (e.g., CVE-2021-34527)
diff --git a/website/web/templates/bundles/bundle.html b/website/web/templates/bundles/bundle.html
index 4b2fa64..a8f22b9 100644
--- a/website/web/templates/bundles/bundle.html
+++ b/website/web/templates/bundles/bundle.html
@@ -40,7 +40,7 @@ <h2>Description</h2>
 <h2>Vulnerabilities included in this bundle</h2>
 <ul class="list-group">
   {% for vuln in bundle.related_vulnerabilities %}
-  <li class="list-group-item"><a href="{{ url_for('home_bp.vulnerability_view', vulnerability_id=vuln) }}">{{ vuln }}</a></li>
+  <li class="list-group-item list-group-item-related" vuln-id="{{ vuln }}"><a href="{{ url_for('home_bp.vulnerability_view', vulnerability_id=vuln) }}">{{ vuln }}</a>: <span class="vuln-description"></span></li>
   {% endfor %}
 </ul>
 {% if bundle.meta %}
@@ -139,6 +139,8 @@ <h2>Combined sightings</h2>
         });
     })
     .catch(error => console.error("Error fetching bundle:", error));
+
+    fetchAndAppendVulnerabilityTitles();
 });
 
   function copyCurrentPageURL() {
@@ -148,6 +150,55 @@ <h2>Combined sightings</h2>
       }).catch(err => {
         console.error('Failed to copy: ', err);
       });
+  }
+
+  async function fetchAndAppendVulnerabilityTitles() {
+    // Select all list items with the class `list-group-item-related`
+    const listItems = document.querySelectorAll('.list-group-item-related');
+
+    // Iterate through each list item
+    for (const listItem of listItems) {
+      // Get the vulnerability ID from the `vuln-id` attribute
+      const vulnId = listItem.getAttribute('vuln-id');
+
+      try {
+        // Make a GET request to fetch the vulnerability data
+        const response = await fetch(`/vulnerability/${vulnId}`);
+        if (!response.ok) throw new Error(`Failed to fetch data for ${vulnId}`);
+
+        // Parse the JSON response
+        const data = await response.json();
+
+        // Retrieve the title from the response (CVE)
+        let description = data?.containers?.cna?.title;
+        // If description is not found, try to get the English description from descriptions
+        if (!description) {
+          const descriptions = data?.containers?.cna?.descriptions || [];
+          const englishDescription = descriptions.find(desc => desc.lang === "en");
+          description = englishDescription ? englishDescription.value : null;
+        }
+        // If description still not found, maybe it's GHSA security advisory
+        if (!description) {
+          description = data?.details || null;
+        }
+        // Final fallback try to find a description in a CSAF security advisory
+        if (!description) {
+          description = data?.document?.title || "No description available.";
+        }
+
+        if (description) {
+          const span = listItem.querySelector('span')
+          if (span) {
+            span.textContent = truncateString(description, 120);
+          } else {
+            console.warn(`No span found inside list item for ${vulnId}`);
+          }
+        }
+      } catch (error) {
+        console.error(`Error fetching data for ${vulnId}:`, error);
+      }
     }
+  }
+
 </script>
 {% endblock %}