fix: vision(#623): disinto-chat conversation history persistence (#710)

docker/chat/server.py

@@ -3,16 +3,16 @@
 disinto-chat server — minimal HTTP backend for Claude chat UI.
 
 Routes:
-    GET /chat/auth/verify    → Caddy forward_auth callback (returns 200+X-Forwarded-User or 401)
+    GET /chat/auth/verify    -> Caddy forward_auth callback (returns 200+X-Forwarded-User or 401)
-    GET /chat/login          → 302 to Forgejo OAuth authorize
+    GET /chat/login          -> 302 to Forgejo OAuth authorize
-    GET /chat/oauth/callback → exchange code for token, validate user, set session
+    GET /chat/oauth/callback -> exchange code for token, validate user, set session
-    GET /chat/               → serves index.html (session required)
+    GET /chat/               -> serves index.html (session required)
-    GET /chat/static/*       → serves static assets (session required)
+    GET /chat/static/*       -> serves static assets (session required)
-    POST /chat               → spawns `claude --print` with user message (session required)
+    POST /chat               -> spawns `claude --print` with user message (session required)
-    GET /ws                  → reserved for future streaming upgrade (returns 501)
+    GET /ws                  -> reserved for future streaming upgrade (returns 501)
 
 OAuth flow:
-    1. User hits any /chat/* route without a valid session cookie → 302 /chat/login
+    1. User hits any /chat/* route without a valid session cookie -> 302 /chat/login
     2. /chat/login redirects to Forgejo /login/oauth/authorize
     3. Forgejo redirects back to /chat/oauth/callback with ?code=...&state=...
     4. Server exchanges code for access token, fetches /api/v1/user
@@ -25,6 +25,7 @@ The claude binary is expected to be mounted from the host at /usr/local/bin/clau
 import datetime
 import json
 import os
+import re
 import secrets
 import subprocess
 import sys
@@ -56,7 +57,7 @@ CHAT_MAX_REQUESTS_PER_HOUR = int(os.environ.get("CHAT_MAX_REQUESTS_PER_HOUR", 60
 CHAT_MAX_REQUESTS_PER_DAY = int(os.environ.get("CHAT_MAX_REQUESTS_PER_DAY", 500))
 CHAT_MAX_TOKENS_PER_DAY = int(os.environ.get("CHAT_MAX_TOKENS_PER_DAY", 1000000))
 
-# Allowed users — disinto-admin always allowed; CSV allowlist extends it
+# Allowed users - disinto-admin always allowed; CSV allowlist extends it
 _allowed_csv = os.environ.get("DISINTO_CHAT_ALLOWED_USERS", "")
 ALLOWED_USERS = {"disinto-admin"}
 if _allowed_csv:
@@ -68,16 +69,22 @@ SESSION_COOKIE = "disinto_chat_session"
 # Session TTL: 24 hours
 SESSION_TTL = 24 * 60 * 60
 
-# In-memory session store: token → {"user": str, "expires": float}
+# Chat history directory (bind-mounted from host)
+CHAT_HISTORY_DIR = os.environ.get("CHAT_HISTORY_DIR", "/var/lib/chat/history")
+
+# Regex for valid conversation_id (12-char hex, no slashes)
+CONVERSATION_ID_PATTERN = re.compile(r"^[0-9a-f]{12}$")
+
+# In-memory session store: token -> {"user": str, "expires": float}
 _sessions = {}
 
-# Pending OAuth state tokens: state → expires (float)
+# Pending OAuth state tokens: state -> expires (float)
 _oauth_states = {}
 
 # Per-user rate limiting state (#711)
-# user → list of request timestamps (for sliding-window hourly/daily caps)
+# user -> list of request timestamps (for sliding-window hourly/daily caps)
 _request_log = {}
-# user → {"tokens": int, "date": "YYYY-MM-DD"}
+# user -> {"tokens": int, "date": "YYYY-MM-DD"}
 _daily_tokens = {}
 
 # MIME types for static files
@@ -119,7 +126,7 @@ def _validate_session(cookie_header):
             session = _sessions.get(token)
             if session and session["expires"] > time.time():
                 return session["user"]
-            # Expired — clean up
+            # Expired - clean up
             _sessions.pop(token, None)
             return None
     return None
@@ -180,6 +187,10 @@ def _fetch_user(access_token):
         return None
 
 
+# =============================================================================
+# Rate Limiting Functions (#711)
+# =============================================================================
+
 def _check_rate_limit(user):
     """Check per-user rate limits. Returns (allowed, retry_after, reason) (#711).
 
@@ -284,6 +295,134 @@ def _parse_stream_json(output):
     return "".join(text_parts), total_tokens
 
 
+# =============================================================================
+# Conversation History Functions (#710)
+# =============================================================================
+
+def _generate_conversation_id():
+    """Generate a new conversation ID (12-char hex string)."""
+    return secrets.token_hex(6)
+
+
+def _validate_conversation_id(conv_id):
+    """Validate that conversation_id matches the required format."""
+    return bool(CONVERSATION_ID_PATTERN.match(conv_id))
+
+
+def _get_user_history_dir(user):
+    """Get the history directory path for a user."""
+    return os.path.join(CHAT_HISTORY_DIR, user)
+
+
+def _get_conversation_path(user, conv_id):
+    """Get the full path to a conversation file."""
+    user_dir = _get_user_history_dir(user)
+    return os.path.join(user_dir, f"{conv_id}.ndjson")
+
+
+def _ensure_user_dir(user):
+    """Ensure the user's history directory exists."""
+    user_dir = _get_user_history_dir(user)
+    os.makedirs(user_dir, exist_ok=True)
+    return user_dir
+
+
+def _write_message(user, conv_id, role, content):
+    """Append a message to a conversation file in NDJSON format."""
+    conv_path = _get_conversation_path(user, conv_id)
+    _ensure_user_dir(user)
+
+    record = {
+        "ts": time.strftime("%Y-%m-%dT%H:%M:%SZ", time.gmtime()),
+        "user": user,
+        "role": role,
+        "content": content,
+    }
+
+    with open(conv_path, "a", encoding="utf-8") as f:
+        f.write(json.dumps(record, ensure_ascii=False) + "\n")
+
+
+def _read_conversation(user, conv_id):
+    """Read all messages from a conversation file."""
+    conv_path = _get_conversation_path(user, conv_id)
+    messages = []
+
+    if not os.path.exists(conv_path):
+        return None
+
+    try:
+        with open(conv_path, "r", encoding="utf-8") as f:
+            for line in f:
+                line = line.strip()
+                if line:
+                    try:
+                        messages.append(json.loads(line))
+                    except json.JSONDecodeError:
+                        # Skip malformed lines
+                        continue
+    except IOError:
+        return None
+
+    return messages
+
+
+def _list_user_conversations(user):
+    """List all conversation files for a user with first message preview."""
+    user_dir = _get_user_history_dir(user)
+    conversations = []
+
+    if not os.path.exists(user_dir):
+        return conversations
+
+    try:
+        for filename in os.listdir(user_dir):
+            if not filename.endswith(".ndjson"):
+                continue
+
+            conv_id = filename[:-7]  # Remove .ndjson extension
+            if not _validate_conversation_id(conv_id):
+                continue
+
+            conv_path = os.path.join(user_dir, filename)
+            messages = _read_conversation(user, conv_id)
+
+            if messages:
+                first_msg = messages[0]
+                preview = first_msg.get("content", "")[:50]
+                if len(first_msg.get("content", "")) > 50:
+                    preview += "..."
+                conversations.append({
+                    "id": conv_id,
+                    "created_at": first_msg.get("ts", ""),
+                    "preview": preview,
+                    "message_count": len(messages),
+                })
+            else:
+                # Empty conversation file
+                conversations.append({
+                    "id": conv_id,
+                    "created_at": "",
+                    "preview": "(empty)",
+                    "message_count": 0,
+                })
+    except OSError:
+        pass
+
+    # Sort by created_at descending
+    conversations.sort(key=lambda x: x["created_at"] or "", reverse=True)
+    return conversations
+
+
+def _delete_conversation(user, conv_id):
+    """Delete a conversation file."""
+    conv_path = _get_conversation_path(user, conv_id)
+    if os.path.exists(conv_path):
+        os.remove(conv_path)
+        return True
+    return False
+
+
 class ChatHandler(BaseHTTPRequestHandler):
     """HTTP request handler for disinto-chat with Forgejo OAuth."""
 
@@ -314,14 +453,14 @@ class ChatHandler(BaseHTTPRequestHandler):
 
         Returns True if the request may proceed, False if a 403 was sent.
         When X-Forwarded-User is absent (forward_auth removed from Caddy),
-        the request is rejected — fail-closed by design.
+        the request is rejected - fail-closed by design.
         """
         forwarded = self.headers.get("X-Forwarded-User")
         if not forwarded:
             rid = self.headers.get("X-Request-Id", "-")
             print(
                 f"WARN: missing X-Forwarded-User for session_user={session_user} "
-                f"req_id={rid} — fail-closed (#709)",
+                f"req_id={rid} - fail-closed (#709)",
                 file=sys.stderr,
             )
             self.send_error_page(403, "Forbidden: missing forwarded-user header")
@@ -356,6 +495,27 @@ class ChatHandler(BaseHTTPRequestHandler):
             self.handle_oauth_callback(parsed.query)
             return
 
+        # Conversation list endpoint: GET /chat/history
+        if path == "/chat/history":
+            user = self._require_session()
+            if not user:
+                return
+            if not self._check_forwarded_user(user):
+                return
+            self.handle_conversation_list(user)
+            return
+
+        # Single conversation endpoint: GET /chat/history/<id>
+        if path.startswith("/chat/history/"):
+            user = self._require_session()
+            if not user:
+                return
+            if not self._check_forwarded_user(user):
+                return
+            conv_id = path[len("/chat/history/"):]
+            self.handle_conversation_get(user, conv_id)
+            return
+
         # Serve index.html at root
         if path in ("/", "/chat", "/chat/"):
             user = self._require_session()
@@ -389,6 +549,16 @@ class ChatHandler(BaseHTTPRequestHandler):
         parsed = urlparse(self.path)
         path = parsed.path
 
+        # New conversation endpoint (session required)
+        if path == "/chat/new":
+            user = self._require_session()
+            if not user:
+                return
+            if not self._check_forwarded_user(user):
+                return
+            self.handle_new_conversation(user)
+            return
+
         # Chat endpoint (session required)
         if path in ("/chat", "/chat/"):
             user = self._require_session()
@@ -403,7 +573,7 @@ class ChatHandler(BaseHTTPRequestHandler):
         self.send_error_page(404, "Not found")
 
     def handle_auth_verify(self):
-        """Caddy forward_auth callback — validate session and return X-Forwarded-User (#709).
+        """Caddy forward_auth callback - validate session and return X-Forwarded-User (#709).
 
         Caddy calls this endpoint for every /chat/* request.  If the session
         cookie is valid the endpoint returns 200 with the X-Forwarded-User
@@ -597,6 +767,7 @@ class ChatHandler(BaseHTTPRequestHandler):
             body_str = body.decode("utf-8")
             params = parse_qs(body_str)
             message = params.get("message", [""])[0]
+            conv_id = params.get("conversation_id", [None])[0]
         except (UnicodeDecodeError, KeyError):
             self.send_error_page(400, "Invalid message format")
             return
@@ -605,15 +776,28 @@ class ChatHandler(BaseHTTPRequestHandler):
             self.send_error_page(400, "Empty message")
             return
 
+        # Get user from session
+        user = _validate_session(self.headers.get("Cookie"))
+        if not user:
+            self.send_error_page(401, "Unauthorized")
+            return
+
         # Validate Claude binary exists
         if not os.path.exists(CLAUDE_BIN):
             self.send_error_page(500, "Claude CLI not found")
             return
 
+        # Generate new conversation ID if not provided
+        if not conv_id or not _validate_conversation_id(conv_id):
+            conv_id = _generate_conversation_id()
+
         # Record request for rate limiting (#711)
         _record_request(user)
 
         try:
+            # Save user message to history
+            _write_message(user, conv_id, "user", message)
+
             # Spawn claude --print with stream-json for token tracking (#711)
             proc = subprocess.Popen(
                 [CLAUDE_BIN, "--print", "--output-format", "stream-json", message],
@@ -637,7 +821,7 @@ class ChatHandler(BaseHTTPRequestHandler):
             # Parse stream-json for text and token usage (#711)
             response, total_tokens = _parse_stream_json(raw_output)
 
-            # Track token usage — does not block *this* request (#711)
+            # Track token usage - does not block *this* request (#711)
             if total_tokens > 0:
                 _record_tokens(user, total_tokens)
                 print(
@@ -649,17 +833,93 @@ class ChatHandler(BaseHTTPRequestHandler):
             if not response:
                 response = raw_output
 
+            # Save assistant response to history
+            _write_message(user, conv_id, "assistant", response)
+
             self.send_response(200)
-            self.send_header("Content-Type", "text/plain; charset=utf-8")
+            self.send_header("Content-Type", "application/json; charset=utf-8")
-            self.send_header("Content-Length", len(response.encode("utf-8")))
             self.end_headers()
-            self.wfile.write(response.encode("utf-8"))
+            self.wfile.write(json.dumps({
+                "response": response,
+                "conversation_id": conv_id,
+            }, ensure_ascii=False).encode("utf-8"))
 
         except FileNotFoundError:
             self.send_error_page(500, "Claude CLI not found")
         except Exception as e:
             self.send_error_page(500, f"Error: {e}")
 
+    # =======================================================================
+    # Conversation History Handlers
+    # =======================================================================
+
+    def handle_conversation_list(self, user):
+        """List all conversations for the logged-in user."""
+        conversations = _list_user_conversations(user)
+
+        self.send_response(200)
+        self.send_header("Content-Type", "application/json; charset=utf-8")
+        self.end_headers()
+        self.wfile.write(json.dumps(conversations, ensure_ascii=False).encode("utf-8"))
+
+    def handle_conversation_get(self, user, conv_id):
+        """Get a specific conversation for the logged-in user."""
+        # Validate conversation_id format
+        if not _validate_conversation_id(conv_id):
+            self.send_error_page(400, "Invalid conversation ID")
+            return
+
+        messages = _read_conversation(user, conv_id)
+
+        if messages is None:
+            self.send_error_page(404, "Conversation not found")
+            return
+
+        self.send_response(200)
+        self.send_header("Content-Type", "application/json; charset=utf-8")
+        self.end_headers()
+        self.wfile.write(json.dumps(messages, ensure_ascii=False).encode("utf-8"))
+
+    def handle_conversation_delete(self, user, conv_id):
+        """Delete a specific conversation for the logged-in user."""
+        # Validate conversation_id format
+        if not _validate_conversation_id(conv_id):
+            self.send_error_page(400, "Invalid conversation ID")
+            return
+
+        if _delete_conversation(user, conv_id):
+            self.send_response(204)  # No Content
+            self.end_headers()
+        else:
+            self.send_error_page(404, "Conversation not found")
+
+    def handle_new_conversation(self, user):
+        """Create a new conversation and return its ID."""
+        conv_id = _generate_conversation_id()
+        self.send_response(200)
+        self.send_header("Content-Type", "application/json; charset=utf-8")
+        self.end_headers()
+        self.wfile.write(json.dumps({"conversation_id": conv_id}, ensure_ascii=False).encode("utf-8"))
+
+    def do_DELETE(self):
+        """Handle DELETE requests."""
+        parsed = urlparse(self.path)
+        path = parsed.path
+
+        # Delete conversation endpoint
+        if path.startswith("/chat/history/"):
+            user = self._require_session()
+            if not user:
+                return
+            if not self._check_forwarded_user(user):
+                return
+            conv_id = path[len("/chat/history/"):]
+            self.handle_conversation_delete(user, conv_id)
+            return
+
+        # 404 for unknown paths
+        self.send_error_page(404, "Not found")
+
 
 def main():
     """Start the HTTP server."""
@@ -671,11 +931,11 @@ def main():
         print(f"OAuth enabled (client_id={CHAT_OAUTH_CLIENT_ID[:8]}...)", file=sys.stderr)
         print(f"Allowed users: {', '.join(sorted(ALLOWED_USERS))}", file=sys.stderr)
     else:
-        print("WARNING: CHAT_OAUTH_CLIENT_ID not set — OAuth disabled", file=sys.stderr)
+        print("WARNING: CHAT_OAUTH_CLIENT_ID not set - OAuth disabled", file=sys.stderr)
     if FORWARD_AUTH_SECRET:
         print("forward_auth secret configured (#709)", file=sys.stderr)
     else:
-        print("WARNING: FORWARD_AUTH_SECRET not set — verify endpoint unrestricted", file=sys.stderr)
+        print("WARNING: FORWARD_AUTH_SECRET not set - verify endpoint unrestricted", file=sys.stderr)
     print(
         f"Rate limits (#711): {CHAT_MAX_REQUESTS_PER_HOUR}/hr, "
         f"{CHAT_MAX_REQUESTS_PER_DAY}/day, "

docker/chat/ui/index.html

@@ -17,7 +17,93 @@
             color: #eaeaea;
             min-height: 100vh;
             display: flex;
+        }
+        /* Sidebar styles */
+        .sidebar {
+            width: 280px;
+            background: #16213e;
+            border-right: 1px solid #0f3460;
+            display: flex;
             flex-direction: column;
+            height: 100vh;
+            position: fixed;
+            left: 0;
+            top: 0;
+            z-index: 100;
+        }
+        .sidebar-header {
+            padding: 1rem;
+            border-bottom: 1px solid #0f3460;
+        }
+        .sidebar-header h1 {
+            font-size: 1.25rem;
+            font-weight: 600;
+            margin-bottom: 0.5rem;
+        }
+        .new-chat-btn {
+            width: 100%;
+            background: #e94560;
+            color: white;
+            border: none;
+            border-radius: 6px;
+            padding: 0.75rem 1rem;
+            font-size: 0.9rem;
+            font-weight: 600;
+            cursor: pointer;
+            transition: background 0.2s;
+        }
+        .new-chat-btn:hover {
+            background: #d63447;
+        }
+        .new-chat-btn:disabled {
+            background: #555;
+            cursor: not-allowed;
+        }
+        .conversations-list {
+            flex: 1;
+            overflow-y: auto;
+            padding: 0.5rem;
+        }
+        .conversation-item {
+            padding: 0.75rem 1rem;
+            border-radius: 6px;
+            cursor: pointer;
+            margin-bottom: 0.25rem;
+            transition: background 0.2s;
+            border: 1px solid transparent;
+        }
+        .conversation-item:hover {
+            background: #1a1a2e;
+        }
+        .conversation-item.active {
+            background: #0f3460;
+            border-color: #e94560;
+        }
+        .conversation-item .preview {
+            font-size: 0.875rem;
+            white-space: nowrap;
+            overflow: hidden;
+            text-overflow: ellipsis;
+            opacity: 0.9;
+        }
+        .conversation-item .meta {
+            font-size: 0.75rem;
+            opacity: 0.6;
+            margin-top: 0.25rem;
+        }
+        .conversation-item .message-count {
+            float: right;
+            font-size: 0.7rem;
+            background: #0f3460;
+            padding: 0.125rem 0.5rem;
+            border-radius: 10px;
+        }
+        .main-content {
+            margin-left: 280px;
+            display: flex;
+            flex-direction: column;
+            width: 100%;
+            height: 100vh;
         }
         header {
             background: #16213e;
@@ -119,30 +205,201 @@
         .loading {
             opacity: 0.6;
         }
+        .empty-state {
+            display: flex;
+            flex-direction: column;
+            align-items: center;
+            justify-content: center;
+            height: 100%;
+            color: #888;
+            text-align: center;
+        }
+        .empty-state p {
+            margin-top: 1rem;
+        }
+        /* Responsive sidebar toggle */
+        .sidebar-toggle {
+            display: none;
+            position: fixed;
+            top: 1rem;
+            left: 1rem;
+            z-index: 200;
+            background: #e94560;
+            color: white;
+            border: none;
+            border-radius: 6px;
+            padding: 0.5rem;
+            cursor: pointer;
+        }
+        @media (max-width: 768px) {
+            .sidebar {
+                transform: translateX(-100%);
+                transition: transform 0.3s;
+            }
+            .sidebar.open {
+                transform: translateX(0);
+            }
+            .sidebar-toggle {
+                display: block;
+            }
+            .main-content {
+                margin-left: 0;
+            }
+        }
     </style>
 </head>
 <body>
-    <header>
+    <button class="sidebar-toggle" id="sidebar-toggle">☰</button>
-        <h1>disinto-chat</h1>
+    <aside class="sidebar" id="sidebar">
-    </header>
+        <div class="sidebar-header">
-    <main>
+            <h1>disinto-chat</h1>
-        <div id="messages">
+            <button class="new-chat-btn" id="new-chat-btn">+ New Chat</button>
-            <div class="message system">
-                <div class="role">system</div>
-                <div class="content">Welcome to disinto-chat. Type a message to start chatting with Claude.</div>
-            </div>
         </div>
-        <form class="input-area">
+        <div class="conversations-list" id="conversations-list">
-            <textarea name="message" placeholder="Type your message..." required></textarea>
+            <!-- Conversations will be loaded here -->
-            <button type="submit" id="send-btn">Send</button>
+        </div>
-        </form>
+    </aside>
-    </main>
+    <div class="main-content">
+        <header>
+            <h1>disinto-chat</h1>
+        </header>
+        <main>
+            <div id="messages">
+                <div class="message system">
+                    <div class="role">system</div>
+                    <div class="content">Welcome to disinto-chat. Type a message to start chatting with Claude.</div>
+                </div>
+            </div>
+            <form class="input-area" id="chat-form">
+                <textarea name="message" placeholder="Type your message..." required></textarea>
+                <button type="submit" id="send-btn">Send</button>
+            </form>
+        </main>
+    </div>
 
     <script>
+        // State
+        let currentConversationId = null;
+        let conversations = [];
+
+        // DOM elements
         const messagesDiv = document.getElementById('messages');
         const sendBtn = document.getElementById('send-btn');
         const textarea = document.querySelector('textarea');
+        const conversationsList = document.getElementById('conversations-list');
+        const newChatBtn = document.getElementById('new-chat-btn');
+        const sidebar = document.getElementById('sidebar');
+        const sidebarToggle = document.getElementById('sidebar-toggle');
 
+        // Load conversations list
+        async function loadConversations() {
+            try {
+                const response = await fetch('/chat/history');
+                if (response.ok) {
+                    conversations = await response.json();
+                    renderConversationsList();
+                }
+            } catch (error) {
+                console.error('Failed to load conversations:', error);
+            }
+        }
+
+        // Render conversations list
+        function renderConversationsList() {
+            conversationsList.innerHTML = '';
+
+            if (conversations.length === 0) {
+                conversationsList.innerHTML = '<div style="padding: 1rem; color: #888; text-align: center; font-size: 0.875rem;">No conversations yet</div>';
+                return;
+            }
+
+            conversations.forEach(conv => {
+                const item = document.createElement('div');
+                item.className = 'conversation-item';
+                if (conv.id === currentConversationId) {
+                    item.classList.add('active');
+                }
+                item.dataset.conversationId = conv.id;
+
+                const previewDiv = document.createElement('div');
+                previewDiv.className = 'preview';
+                previewDiv.textContent = conv.preview || '(empty)';
+
+                const metaDiv = document.createElement('div');
+                metaDiv.className = 'meta';
+                const date = conv.created_at ? new Date(conv.created_at).toLocaleDateString() : '';
+                metaDiv.innerHTML = `${date} <span class="message-count">${conv.message_count || 0} msg${conv.message_count !== 1 ? 's' : ''}</span>`;
+
+                item.appendChild(previewDiv);
+                item.appendChild(metaDiv);
+
+                item.addEventListener('click', () => loadConversation(conv.id));
+                conversationsList.appendChild(item);
+            });
+        }
+
+        // Load a specific conversation
+        async function loadConversation(convId) {
+            // Clear messages
+            messagesDiv.innerHTML = '';
+
+            // Update active state in sidebar
+            document.querySelectorAll('.conversation-item').forEach(item => {
+                item.classList.remove('active');
+            });
+            document.querySelector(`[data-conversation-id="${convId}"]`)?.classList.add('active');
+
+            if (convId === currentConversationId) {
+                return;
+            }
+
+            currentConversationId = convId;
+
+            try {
+                const response = await fetch(`/chat/history/${convId}`);
+                if (response.ok) {
+                    const messages = await response.json();
+                    if (messages && messages.length > 0) {
+                        messages.forEach(msg => {
+                            addMessage(msg.role, msg.content);
+                        });
+                    } else {
+                        addSystemMessage('This conversation is empty');
+                    }
+                } else {
+                    addSystemMessage('Failed to load conversation');
+                }
+            } catch (error) {
+                console.error('Failed to load conversation:', error);
+                addSystemMessage('Error loading conversation');
+            }
+
+            // Close sidebar on mobile
+            if (window.innerWidth <= 768) {
+                sidebar.classList.remove('open');
+            }
+        }
+
+        // Create a new conversation
+        async function createNewConversation() {
+            try {
+                const response = await fetch('/chat/new', { method: 'POST' });
+                if (response.ok) {
+                    const data = await response.json();
+                    currentConversationId = data.conversation_id;
+                    messagesDiv.innerHTML = '';
+                    addSystemMessage('New conversation started');
+                    await loadConversations();
+                } else {
+                    addSystemMessage('Failed to create new conversation');
+                }
+            } catch (error) {
+                console.error('Failed to create new conversation:', error);
+                addSystemMessage('Error creating new conversation');
+            }
+        }
+
+        // Add message to display
         function addMessage(role, content, streaming = false) {
             const msgDiv = document.createElement('div');
             msgDiv.className = `message ${role}`;
@@ -155,6 +412,17 @@
             return msgDiv.querySelector('.content');
         }
 
+        function addSystemMessage(content) {
+            const msgDiv = document.createElement('div');
+            msgDiv.className = 'message system';
+            msgDiv.innerHTML = `
+                <div class="role">system</div>
+                <div class="content">${escapeHtml(content)}</div>
+            `;
+            messagesDiv.appendChild(msgDiv);
+            messagesDiv.scrollTop = messagesDiv.scrollHeight;
+        }
+
         function escapeHtml(text) {
             const div = document.createElement('div');
             div.textContent = text;
@@ -162,7 +430,7 @@
         }
 
         // Send message handler
-        sendBtn.addEventListener('click', async () => {
+        async function sendMessage() {
             const message = textarea.value.trim();
             if (!message) return;
 
@@ -175,10 +443,16 @@
             addMessage('user', message);
             textarea.value = '';
 
+            // If no conversation ID, create one
+            if (!currentConversationId) {
+                await createNewConversation();
+            }
+
             try {
                 // Use fetch with URLSearchParams for application/x-www-form-urlencoded
                 const params = new URLSearchParams();
                 params.append('message', message);
+                params.append('conversation_id', currentConversationId);
 
                 const response = await fetch('/chat', {
                     method: 'POST',
@@ -192,31 +466,55 @@
                     throw new Error(`HTTP ${response.status}`);
                 }
 
-                // Read the response as text and add assistant message
+                // Read the response as JSON (now returns JSON with response and conversation_id)
-                const content = await response.text();
+                const data = await response.json();
-                addMessage('assistant', content);
+                addMessage('assistant', data.response);
 
             } catch (error) {
-                addMessage('system', `Error: ${error.message}`);
+                addSystemMessage(`Error: ${error.message}`);
             } finally {
                 textarea.disabled = false;
                 sendBtn.disabled = false;
                 sendBtn.textContent = 'Send';
                 textarea.focus();
                 messagesDiv.scrollTop = messagesDiv.scrollHeight;
-            }
-        });
 
-        // Handle Enter key in textarea
+                // Refresh conversations list
+                await loadConversations();
+            }
+        }
+
+        // Event listeners
+        sendBtn.addEventListener('click', sendMessage);
+
+        newChatBtn.addEventListener('click', createNewConversation);
+
         textarea.addEventListener('keydown', (e) => {
             if (e.key === 'Enter' && !e.shiftKey) {
                 e.preventDefault();
-                sendBtn.click();
+                sendMessage();
+            }
+        });
+
+        // Sidebar toggle for mobile
+        sidebarToggle.addEventListener('click', () => {
+            sidebar.classList.toggle('open');
+        });
+
+        // Close sidebar when clicking outside on mobile
+        document.addEventListener('click', (e) => {
+            if (window.innerWidth <= 768) {
+                if (!sidebar.contains(e.target) && !sidebarToggle.contains(e.target)) {
+                    sidebar.classList.remove('open');
+                }
             }
         });
 
         // Initial focus
         textarea.focus();
+
+        // Load conversations on page load
+        loadConversations();
     </script>
 </body>
 </html>

lib/generators.sh

@@ -499,6 +499,8 @@ services:
       - CLAUDE_BIN_PLACEHOLDER:/usr/local/bin/claude:ro
       # Throwaway named volume for chat config (isolated from host ~/.claude)
       - chat-config:/var/chat/config
+      # Chat history persistence: per-user NDJSON files on bind-mounted host volume
+      - ${CHAT_HISTORY_DIR:-./state/chat-history}:/var/lib/chat/history
     environment:
       CHAT_HOST: "0.0.0.0"
       CHAT_PORT: "8080"
@@ -523,6 +525,7 @@ volumes:
   project-repos:
   caddy_data:
   chat-config:
+  chat-history:
 
 networks:
   disinto-net: