dtSpark 1.1.0a2__py3-none-any.whl → 1.1.0a6__py3-none-any.whl

dtSpark/web/static/js/actions.js

@@ -624,7 +624,8 @@ async function loadModels() {
         const response = await fetch('/api/models');
         if (!response.ok) throw new Error('Failed to load models');
 
-        availableModels = await response.json();
+        const data = await response.json();
+        availableModels = data.models || data;
 
         const select = document.getElementById('actionModel');
         select.innerHTML = '<option value="">Select a model...</option>';

dtSpark/web/static/js/chat.js

@@ -50,8 +50,6 @@ async function loadChatHistory(conversationId) {
  * @param {string} timestamp - Message timestamp (optional)
  */
 function appendMessage(role, content, timestamp = null) {
-    const messagesContainer = document.getElementById('chat-messages');
-
     // Check if content contains tool results
     if (content.startsWith('[TOOL_RESULTS]')) {
         appendToolResults(content, timestamp);
@@ -107,7 +105,7 @@ function appendRegularMessage(role, content, timestamp = null) {
     messageDiv.className = `chat-message ${role}`;
 
     // Generate unique ID for the copy button
-    const copyBtnId = 'copy-btn-' + Date.now() + '-' + Math.random().toString(36).substr(2, 9);
+    const copyBtnId = 'copy-btn-' + Date.now() + '-' + Math.random().toString(36).substring(2, 11);
 
     // Create message header with copy icon
     const header = document.createElement('div');
@@ -308,8 +306,8 @@ function removeStatus(idOrElement) {
         document.getElementById(idOrElement) :
         idOrElement;
 
-    if (element && element.parentNode) {
-        element.parentNode.removeChild(element);
+    if (element?.parentNode) {
+        element.remove();
     }
 }
 
@@ -360,7 +358,7 @@ function updateStreamingMessage(content, messageElement = null) {
         messageElement.className = 'chat-message assistant';
 
         // Generate unique ID for the copy button
-        const copyBtnId = 'stream-copy-btn-' + Date.now() + '-' + Math.random().toString(36).substr(2, 9);
+        const copyBtnId = 'stream-copy-btn-' + Date.now() + '-' + Math.random().toString(36).substring(2, 11);
 
         messageElement.innerHTML = `
             <div class="message-header d-flex justify-content-between align-items-center">
@@ -463,7 +461,7 @@ function showToast(message, type = 'info') {
     const toast = document.createElement('div');
     toast.id = toastId;
     toast.className = 'toast';
-    toast.setAttribute('role', 'alert');
+    toast.role = 'alert';
 
     let bgClass = 'bg-primary';
     if (type === 'success') bgClass = 'bg-success';
@@ -550,7 +548,7 @@ async function showToolPermissionDialog(requestId, toolName, toolDescription) {
     const buttons = modalElement.querySelectorAll('.permission-btn');
     buttons.forEach(button => {
         button.addEventListener('click', async () => {
-            const response = button.getAttribute('data-response');
+            const response = button.dataset.response;
 
             // Send response to server
             try {

dtSpark/web/static/js/main.js

@@ -74,7 +74,7 @@ if (typeof marked !== 'undefined') {
 
         // Handle mermaid diagrams
         if (lang === 'mermaid') {
-            const id = 'mermaid-' + Math.random().toString(36).substr(2, 9);
+            const id = 'mermaid-' + Math.random().toString(36).substring(2, 11);
             return `<div class="mermaid-container"><pre class="mermaid" id="${id}">${escapeHtmlForMermaid(code)}</pre></div>`;
         }
 
@@ -157,7 +157,7 @@ async function copySvgToClipboard(svgElement, button) {
         bgRect.setAttribute('width', '100%');
         bgRect.setAttribute('height', '100%');
         bgRect.setAttribute('fill', '#1a1a1a');
-        svgClone.insertBefore(bgRect, svgClone.firstChild);
+        svgClone.prepend(bgRect);
 
         // Serialise SVG to string
         const serializer = new XMLSerializer();
@@ -255,7 +255,7 @@ async function renderMermaidDiagrams(container) {
 
     for (const block of mermaidBlocks) {
         try {
-            const id = block.id || 'mermaid-' + Math.random().toString(36).substr(2, 9);
+            const id = block.id || 'mermaid-' + Math.random().toString(36).substring(2, 11);
             const code = block.textContent;
 
             // Render the diagram
@@ -287,7 +287,7 @@ async function renderMermaidDiagrams(container) {
                 }
             };
 
-            block.parentNode.replaceChild(wrapper, block);
+            block.replaceWith(wrapper);
         } catch (e) {
             console.error('Mermaid rendering error:', e);
             // Show error message in the block
@@ -370,9 +370,9 @@ function showToast(message, type = 'info') {
     // Create toast
     const toast = document.createElement('div');
     toast.className = `toast align-items-center text-white bg-${type === 'error' ? 'danger' : type} border-0`;
-    toast.setAttribute('role', 'alert');
-    toast.setAttribute('aria-live', 'assertive');
-    toast.setAttribute('aria-atomic', 'true');
+    toast.role = 'alert';
+    toast.ariaLive = 'assertive';
+    toast.ariaAtomic = 'true';
 
     toast.innerHTML = `
         <div class="d-flex">
@@ -432,7 +432,7 @@ function downloadFile(content, filename, mimeType = 'text/plain') {
     link.download = filename;
     document.body.appendChild(link);
     link.click();
-    document.body.removeChild(link);
+    link.remove();
     URL.revokeObjectURL(url);
 }
 

dtSpark/web/static/js/sse-client.js

@@ -17,151 +17,159 @@ async function sendMessageWithSSE(conversationId, message) {
     let streamingMessageElement = null;
     let accumulatedContent = '';
 
-    try {
-        // Create EventSource for SSE
-        const encodedMessage = encodeURIComponent(message);
-        const eventSource = new EventSource(
-            `/api/stream/chat?message=${encodedMessage}&conversation_id=${conversationId}`
-        );
-
-        // Handle different event types
-        eventSource.addEventListener('status', (event) => {
-            const data = JSON.parse(event.data);
-            console.log('Status:', data);
-
-            // Update typing indicator with status
-            if (typingIndicator && typingIndicator.parentNode) {
-                const statusText = data.message || '';
-                typingIndicator.querySelector('.visually-hidden').nextSibling.textContent = statusText;
-            }
-        });
+    return new Promise((resolve) => {
+        try {
+            // Create EventSource for SSE
+            const encodedMessage = encodeURIComponent(message);
+            const eventSource = new EventSource(
+                `/api/stream/chat?message=${encodedMessage}&conversation_id=${conversationId}`
+            );
+
+            // Handle different event types
+            eventSource.addEventListener('status', (event) => {
+                const data = JSON.parse(event.data);
+                console.log('Status:', data);
+
+                // Update typing indicator with status
+                if (typingIndicator && typingIndicator.parentNode) {
+                    const statusText = data.message || '';
+                    typingIndicator.querySelector('.visually-hidden').nextSibling.textContent = statusText;
+                }
+            });
 
-        eventSource.addEventListener('response', (event) => {
-            const data = JSON.parse(event.data);
-            console.log('Received response event:', data);
+            eventSource.addEventListener('response', (event) => {
+                const data = JSON.parse(event.data);
+                console.log('Received response event:', data);
 
-            // Hide typing indicator on first response
-            if (typingIndicator && typingIndicator.parentNode) {
-                console.log('Hiding typing indicator');
-                hideTypingIndicator();
-                typingIndicator = null;  // Clear reference after hiding
-            }
+                // Hide typing indicator on first response
+                if (typingIndicator && typingIndicator.parentNode) {
+                    console.log('Hiding typing indicator');
+                    hideTypingIndicator();
+                    typingIndicator = null;  // Clear reference after hiding
+                }
 
-            if (data.type === 'text') {
-                if (data.final) {
-                    // Final response - this is the main assistant response after tool execution
-                    console.log('Final response received, content length:', data.content ? data.content.length : 0);
-                    accumulatedContent += data.content;
-                    console.log('Accumulated content:', accumulatedContent);
-
-                    // Ensure we have content before displaying
-                    if (accumulatedContent.trim().length > 0) {
-                        streamingMessageElement = updateStreamingMessage(
-                            accumulatedContent,
-                            streamingMessageElement
-                        );
-                        console.log('Updated streaming message element:', streamingMessageElement);
+                if (data.type === 'text') {
+                    if (data.final) {
+                        // Final response - this is the main assistant response after tool execution
+                        console.log('Final response received, content length:', data.content ? data.content.length : 0);
+                        accumulatedContent += data.content;
+                        console.log('Accumulated content:', accumulatedContent);
+
+                        // Ensure we have content before displaying
+                        if (accumulatedContent.trim().length > 0) {
+                            streamingMessageElement = updateStreamingMessage(
+                                accumulatedContent,
+                                streamingMessageElement
+                            );
+                            console.log('Updated streaming message element:', streamingMessageElement);
+                        } else {
+                            console.warn('No content to display');
+                        }
+                        eventSource.close();
+                        resolve();
                     } else {
-                        console.warn('No content to display');
+                        // Non-final response - text that appears with tool calls
+                        // Display immediately as a separate message
+                        console.log('Non-final response, appending:', data.content);
+                        appendMessage('assistant', data.content);
                     }
-                    eventSource.close();
-                } else {
-                    // Non-final response - text that appears with tool calls
-                    // Display immediately as a separate message
-                    console.log('Non-final response, appending:', data.content);
-                    appendMessage('assistant', data.content);
                 }
-            }
-        });
-
-        eventSource.addEventListener('tool_start', (event) => {
-            const data = JSON.parse(event.data);
-            appendToolCall(data.tool_name, data.input);
-        });
-
-        eventSource.addEventListener('tool_complete', (event) => {
-            const data = JSON.parse(event.data);
-            // Display tool result
-            appendToolResult(data.tool_use_id, { content: data.content });
-        });
+            });
+
+            eventSource.addEventListener('tool_start', (event) => {
+                const data = JSON.parse(event.data);
+                appendToolCall(data.tool_name, data.input);
+            });
+
+            eventSource.addEventListener('tool_complete', (event) => {
+                const data = JSON.parse(event.data);
+                // Display tool result
+                appendToolResult(data.tool_use_id, { content: data.content });
+            });
+
+            eventSource.addEventListener('tool_error', (event) => {
+                const data = JSON.parse(event.data);
+                appendToolResult(data.tool_name, { error: data.error });
+            });
+
+            eventSource.addEventListener('permission_request', (event) => {
+                const data = JSON.parse(event.data);
+                console.log('Permission request received:', data);
+
+                // Show permission modal/dialog
+                showToolPermissionDialog(data.request_id, data.tool_name, data.tool_description);
+            });
+
+            eventSource.addEventListener('progress', (event) => {
+                const data = JSON.parse(event.data);
+                // Update progress (if we want to show a progress bar)
+                console.log('Progress:', data);
+            });
+
+            eventSource.addEventListener('complete', (event) => {
+                // Stream complete
+                console.log('Stream complete');
+                eventSource.close();
 
-        eventSource.addEventListener('tool_error', (event) => {
-            const data = JSON.parse(event.data);
-            appendToolResult(data.tool_name, { error: data.error });
-        });
+                // Hide typing indicator if still visible
+                if (typingIndicator && typingIndicator.parentNode) {
+                    console.log('Hiding typing indicator on complete');
+                    hideTypingIndicator();
+                    typingIndicator = null;
+                }
 
-        eventSource.addEventListener('permission_request', (event) => {
-            const data = JSON.parse(event.data);
-            console.log('Permission request received:', data);
+                resolve();
+            });
 
-            // Show permission modal/dialog
-            showToolPermissionDialog(data.request_id, data.tool_name, data.tool_description);
-        });
+            eventSource.addEventListener('error', (event) => {
+                console.error('SSE error:', event);
+                const data = JSON.parse(event.data);
 
-        eventSource.addEventListener('progress', (event) => {
-            const data = JSON.parse(event.data);
-            // Update progress (if we want to show a progress bar)
-            console.log('Progress:', data);
-        });
+                // Hide typing indicator
+                if (typingIndicator && typingIndicator.parentNode) {
+                    console.log('Hiding typing indicator on error');
+                    hideTypingIndicator();
+                    typingIndicator = null;
+                }
 
-        eventSource.addEventListener('complete', (event) => {
-            // Stream complete
-            console.log('Stream complete');
-            eventSource.close();
+                // Show error message
+                appendMessage('system', `Error: ${data.message}`);
 
-            // Hide typing indicator if still visible
-            if (typingIndicator && typingIndicator.parentNode) {
-                console.log('Hiding typing indicator on complete');
-                hideTypingIndicator();
-                typingIndicator = null;
-            }
-        });
+                eventSource.close();
+                resolve();
+            });
 
-        eventSource.addEventListener('error', (event) => {
-            console.error('SSE error:', event);
-            const data = JSON.parse(event.data);
+            eventSource.onerror = (error) => {
+                console.error('EventSource failed:', error);
 
-            // Hide typing indicator
-            if (typingIndicator && typingIndicator.parentNode) {
-                console.log('Hiding typing indicator on error');
-                hideTypingIndicator();
-                typingIndicator = null;
-            }
+                // Hide typing indicator
+                if (typingIndicator && typingIndicator.parentNode) {
+                    console.log('Hiding typing indicator on connection error');
+                    hideTypingIndicator();
+                    typingIndicator = null;
+                }
 
-            // Show error message
-            appendMessage('system', `Error: ${data.message}`);
+                // If we haven't received any content, show error
+                if (!streamingMessageElement) {
+                    appendMessage('system', 'Connection error. Please try again.');
+                }
 
-            eventSource.close();
-        });
+                eventSource.close();
+                resolve();
+            };
 
-        eventSource.onerror = (error) => {
-            console.error('EventSource failed:', error);
+        } catch (error) {
+            console.error('Error sending message:', error);
 
             // Hide typing indicator
-            if (typingIndicator && typingIndicator.parentNode) {
-                console.log('Hiding typing indicator on connection error');
+            if (typingIndicator) {
                 hideTypingIndicator();
-                typingIndicator = null;
-            }
-
-            // If we haven't received any content, show error
-            if (!streamingMessageElement) {
-                appendMessage('system', 'Connection error. Please try again.');
             }
 
-            eventSource.close();
-        };
-
-    } catch (error) {
-        console.error('Error sending message:', error);
-
-        // Hide typing indicator
-        if (typingIndicator) {
-            hideTypingIndicator();
+            showToast('Failed to send message', 'error');
+            resolve();
         }
-
-        showToast('Failed to send message', 'error');
-    }
+    });
 }
 
 /**

dtSpark/web/templates/actions.html

@@ -53,7 +53,7 @@
                     <tbody id="actions-tbody">
                         <tr>
                             <td colspan="9" class="text-center text-muted py-4">
-                                <div class="spinner-border spinner-border-sm" role="status"></div>
+                                <output class="spinner-border spinner-border-sm"></output>
                                 Loading actions...
                             </td>
                         </tr>
@@ -85,7 +85,7 @@
                     <tbody id="runs-tbody">
                         <tr>
                             <td colspan="7" class="text-center text-muted py-4">
-                                <div class="spinner-border spinner-border-sm" role="status"></div>
+                                <output class="spinner-border spinner-border-sm"></output>
                                 Loading recent runs...
                             </td>
                         </tr>
@@ -172,7 +172,7 @@
 
                     <!-- Tool Permissions -->
                     <div class="mb-3">
-                        <label class="form-label">Tool Permissions</label>
+                        <span class="form-label d-block">Tool Permissions</span>
                         <div class="card">
                             <div class="card-body" style="max-height: 200px; overflow-y: auto;">
                                 <div id="toolPermissions">
@@ -374,14 +374,14 @@
                         <div class="alert alert-success mb-0">
                             <i class="bi bi-check-circle-fill"></i>
                             Action created successfully!
-                            <a href="#" id="viewCreatedAction" onclick="viewCreatedAction(); return false;">View action details</a>
+                            <button type="button" id="viewCreatedAction" class="btn btn-link p-0 align-baseline" onclick="viewCreatedAction();">View action details</button>
                         </div>
                     </div>
                 </div>
 
                 <!-- Loading Indicator -->
                 <div id="aiCreateLoading" class="d-none text-center py-4">
-                    <div class="spinner-border text-primary" role="status"></div>
+                    <output class="spinner-border text-primary"></output>
                     <p class="mt-2 text-muted">AI is thinking...</p>
                 </div>
             </div>

dtSpark/web/templates/base.html

@@ -53,11 +53,13 @@
                             <i class="bi bi-plus-circle"></i> New
                         </a>
                     </li>
+                    {% if actions_enabled %}
                     <li class="nav-item">
                         <a class="nav-link" href="/actions">
                             <i class="bi bi-robot"></i> Actions
                         </a>
                     </li>
+                    {% endif %}
                 </ul>
                 <ul class="navbar-nav">
                     <li class="nav-item">
@@ -89,5 +91,16 @@
     <script src="/static/js/main.js"></script>
 
     {% block extra_scripts %}{% endblock %}
+
+    {% if heartbeat_enabled %}
+    <!-- Browser heartbeat - auto-shutdown when browser closes -->
+    <script>
+    setInterval(() => {
+        fetch('/api/heartbeat', { method: 'POST' }).catch(() => {});
+    }, {{ heartbeat_interval_ms }});
+    // Send initial heartbeat immediately
+    fetch('/api/heartbeat', { method: 'POST' }).catch(() => {});
+    </script>
+    {% endif %}
 </body>
 </html>