chg: [website] Improved display of the date for the combined sightings.

website/web/templates/bundles/bundle.html

@@ -2,6 +2,7 @@
 {% block head %}
 {{ super() }}
 <script src="{{ url_for('static', filename='js/pretty-print-json.min.js') }}"></script>
+<script src="{{ url_for('static', filename='js/luxon.min.js') }}"></script>
 <script src="{{ url_for('static', filename='js/utils.js') }}"></script>
 <link rel="stylesheet" href="{{ url_for('static', filename='css/pretty-print-json.css') }}" />
 {% endblock %}
@@ -101,7 +102,9 @@ <h2>Combined sightings</h2>
         row.appendChild(typeCell);
 
         const dateCell = document.createElement("td");
-        dateCell.textContent = new Date(sighting.creation_timestamp).toLocaleString();
+        dateCell.classList.add('datetime');
+        dateCell.textContent = sighting.creation_timestamp;
+        dateCell.title = sighting.creation_timestamp;
         row.appendChild(dateCell);
 
         tableBody.appendChild(row);
@@ -124,6 +127,14 @@ <h2>Combined sightings</h2>
                     // Add each sighting as a row in the table
                     sightingData.data.forEach(sighting => addRowToTable(sighting));
                 })
+                .then(_ => {
+                    var DateTime = luxon.DateTime;
+                    elements = document.getElementsByClassName("datetime");
+                    Array.prototype.forEach.call(elements, function(element) {
+                      element.textContent = DateTime.fromISO(element.title).toRelative();
+
+                    });
+                })
                 .catch(error => console.error("Error fetching sighting:", error));
         });
     })