✨feature: Make index page a grid of domains and tests in cards

views/domain-cards.ejs

@@ -0,0 +1,45 @@
+<%
+// Helper function to format date
+function formatDate(dateString) {
+  let date = new Date(dateString);
+  return date.toLocaleString('en-US', {
+    year: 'numeric',
+    month: 'long',
+    day: 'numeric',
+    hour: '2-digit',
+    minute: '2-digit'
+  });
+}
+
+// Group data by unique domain_name
+let groupedDomains = {};
+data.forEach(item => {
+  let domain = item.domain_name?.trim();
+  if (!domain) return;
+  if (!groupedDomains[domain]) {
+    groupedDomains[domain] = [];
+  }
+  groupedDomains[domain].push(item);
+});
+%>
+
+<div class="card-container grid gap-6 grid-cols-1 md:grid-cols-3 lg:grid-cols-4">
+  <% Object.keys(groupedDomains).forEach(domain => { %>
+    <% // Sort entries by created_at descending and limit to 5
+      let sortedEntries=groupedDomains[domain]
+      .sort((a, b) => new Date(b.created_at) - new Date(a.created_at))
+      .slice(0, 5);
+    %>
+    <div class="card w-fit bg-base-100 card-lg shadow-sm">
+      <div class="card-body">
+        <h2 class="card-title"><%= domain %></h2>
+        <% sortedEntries.forEach(entry => { %>
+          <div class="flex">
+            <p class="w-fit px-4 font-normal"><%= entry.id %></p>
+            <p class="flex-grow-1 font-normal"><%= formatDate(entry.created_at) %></p>
+          </div>
+        <% }) %>
+      </div>
+    </div>
+  <% }) %>
+</div>