Sessions: edit form, soft-delete, lazy creation, chat as separate page

- Session click opens edit form (name, description, image, agent) instead of chat
- Chat is now a separate route (#chat/{id}), opened via button
- Sessions created on save, not on click
- Soft-delete for sessions (is_deleted flag)
- Delete button in session form
- Removed title double-click editing from chat
- Card images now square (aspect-ratio: 1)
- New Session as placeholder card

wwwroot/js/pages/dashboard.js

@@ -2,34 +2,41 @@
 
 registerPage('dashboard', {
   async init() {
-    // Sessions laden
+    const agents = await apiGetAgents();
+    const agentMap = {};
+    for (const a of agents) agentMap[a.agentId] = a;
+
+    // Sessions
     const sessions = await apiGetSessions();
     const grid = document.getElementById('sessionCards');
     grid.innerHTML = '';
 
     for (const s of sessions) {
+      const agent = s.agentId ? agentMap[s.agentId] : null;
       const card = document.createElement('div');
       card.className = 'card clickable';
       card.innerHTML = `
-        <div class="card-title">${escHtml(s.name || 'Unbenannt')}</div>
-        <div class="card-sub">${formatDate(s.updatedAt)}</div>
+        <div class="card-image">${s.image ? `<img src="${s.image}" alt="">` : ''}</div>
+        <div class="card-body">
+          <div class="card-title-row">
+            <span class="card-title">${esc(s.name || 'Unbenannt')}</span>
+            ${agent ? `<span class="badge">${esc(agent.name)}</span>` : ''}
+          </div>
+          ${s.description ? `<div class="card-desc">${esc(s.description)}</div>` : ''}
+        </div>
       `;
-      card.addEventListener('click', () => {
-        navigateTo('session', { id: s.sessionId });
-      });
+      card.addEventListener('click', () => navigateTo('session', { id: s.sessionId }));
       grid.appendChild(card);
     }
 
-    const newSessionBtn = document.getElementById('newSessionBtn');
-    if (newSessionBtn) {
-      newSessionBtn.addEventListener('click', async () => {
-        const session = await apiCreateSession();
-        navigateTo('session', { id: session.sessionId });
-      });
-    }
+    // Neue Session Placeholder
+    const newSession = document.createElement('div');
+    newSession.className = 'card placeholder clickable';
+    newSession.innerHTML = '<div class="card-body"><div class="card-title">+ Neue Session</div></div>';
+    newSession.addEventListener('click', () => navigateTo('session'));
+    grid.appendChild(newSession);
 
-    // Agents laden
-    const agents = await apiGetAgents();
+    // Agents
     const agentGrid = document.getElementById('agentCards');
     agentGrid.innerHTML = '';
 
@@ -37,30 +44,29 @@ registerPage('dashboard', {
       const card = document.createElement('div');
       card.className = 'card clickable';
       card.innerHTML = `
-        <div class="agent-card-avatar">${a.avatar ? `<img src="${a.avatar}" alt="">` : '?'}</div>
-        <div class="card-title">${escHtml(a.name)}</div>
-        <div class="card-sub">${escHtml(a.model || 'sonnet')}</div>
+        <div class="card-image">${a.avatar ? `<img src="${a.avatar}" alt="">` : ''}</div>
+        <div class="card-body">
+          <div class="card-title-row">
+            <span class="card-title">${esc(a.name)}</span>
+            <span class="badge">${esc(a.model)}</span>
+          </div>
+          ${a.description ? `<div class="card-desc">${esc(a.description)}</div>` : ''}
+        </div>
       `;
-      card.addEventListener('click', () => {
-        navigateTo('agent', { id: a.agentId });
-      });
+      card.addEventListener('click', () => navigateTo('agent', { id: a.agentId }));
       agentGrid.appendChild(card);
     }
 
-    // Neuer Agent Placeholder
     const placeholder = document.createElement('div');
     placeholder.className = 'card placeholder clickable';
-    placeholder.innerHTML = `
-      <div class="card-icon">+</div>
-      <div class="card-title">Neuer Agent</div>
-    `;
+    placeholder.innerHTML = '<div class="card-body"><div class="card-title">+ Neuer Agent</div></div>';
     placeholder.addEventListener('click', () => navigateTo('agent'));
     agentGrid.appendChild(placeholder);
   },
   destroy() {}
 });
 
-function escHtml(s) {
+function esc(s) {
   const d = document.createElement('div');
   d.textContent = s;
   return d.innerHTML;