feat: separate-routes

public/app.js

@@ -1,31 +1,3 @@
-// Navigation
-const navLinks = document.querySelectorAll('.nav-link');
-const pages = document.querySelectorAll('.page');
-
-navLinks.forEach(link => {
-  link.addEventListener('click', (e) => {
-    e.preventDefault();
-    const targetPage = link.dataset.page;
-    
-    // Update active nav link
-    navLinks.forEach(l => l.classList.remove('active'));
-    link.classList.add('active');
-    
-    // Show target page
-    pages.forEach(page => {
-      page.classList.remove('active');
-      if (page.id === `page-${targetPage}`) {
-        page.classList.add('active');
-      }
-    });
-    
-    // Load page data
-    if (targetPage === 'wiki') loadWiki();
-    if (targetPage === 'agents') loadAgents();
-    if (targetPage === 'usage') loadUsage();
-  });
-});
-
 // Task Dashboard
 const COLUMNS = {
   'Backlog': { title: '📋 Backlog', tasks: [] },
@@ -259,8 +231,21 @@ function escapeHtml(text) {
   return div.innerHTML;
 }
 
-// Initialize
-loadTasks();
+// Initialize based on current page
+const path = window.location.pathname;
+
+if (path === '/tasks' || path === '/') {
+  loadTasks();
+} else if (path === '/wiki') {
+  loadWiki();
+} else if (path === '/agents') {
+  loadAgents();
+} else if (path === '/usage') {
+  loadUsage();
+}
+
+// Populate agent dropdown
+populateAgentDropdown();
 
 // WebSocket for real-time updates
 const ws = new WebSocket(`ws://${window.location.host}`);
@@ -294,8 +279,3 @@ async function populateAgentDropdown() {
     console.error('Failed to load agents for dropdown:', err);
   }
 }
-
-// Populate dropdown on page load
-document.addEventListener('DOMContentLoaded', () => {
-  populateAgentDropdown();
-});