Initial project push.

theme/js/dashboard.js

@@ -0,0 +1,61 @@
+function updateStats(pageviews, sessions) {
+  document.getElementById('total-pageviews').textContent = pageviews.toLocaleString();
+  document.getElementById('total-sessions').textContent = sessions.toLocaleString();
+}
+
+// Example: How to populate the table
+function updateTable(data) {
+  const tbody = document.getElementById('table-body');
+
+  if (data.length === 0) {
+    tbody.innerHTML = `
+      <tr>
+        <td colspan="5" class="empty-state">
+          <span class="material-symbols-outlines">inbox</span>
+          <div>No data available</div>
+        </td>
+      </tr>
+    `;
+    return;
+  }
+  tbody.innerHTML = data.map(row => `
+    <tr>
+    <td class="url-cell" title="${row.url}">${row.url}</td>
+    <td class="number-cell">${row.pageviews.toLocaleString()}</td>
+    <td class="number-cell">${row.uniquePageviews.toLocaleString()}</td>
+    <td class="number-cell">${row.sessions.toLocaleString()}</td>
+    <td class="number-cell">${row.sessionDuration}</td>
+    </tr>
+  `).join('');
+}
+
+// Example usage with sample data (you'll replace this with API calls)
+setTimeout(() => {
+  // Update stats
+  updateStats(15234, 8456);
+
+  // Update table
+  updateTable([
+    {
+      url: '/home',
+      pageviews: 5234,
+      uniquePageviews: 4521,
+      sessions: 3456,
+      sessionDuration: '3m 24s'
+    },
+    {
+      url: '/about',
+      pageviews: 2345,
+      uniquePageviews: 2100,
+      sessions: 1876,
+      sessionDuration: '2m 15s'
+    },
+    {
+      url: '/products',
+      pageviews: 1876,
+      uniquePageviews: 1654,
+      sessions: 1234,
+      sessionDuration: '4m 02s'
+    }
+  ]);
+}, 1500);