open-swarm 0.1.1743070217__py3-none-any.whl → 0.1.1743362777__py3-none-any.whl

swarm/static/rest_mode/js/modules/chatHistory.js

@@ -0,0 +1,110 @@
+ // src/swarm/static/rest_mode/js/modules/chatHistory.js
+
+import { showToast } from '../toast.js';
+import { appendRawMessage } from '../messages.js';
+import { deleteChat } from './apiService.js';
+import { debugLog } from './debugLogger.js';
+import { chatHistory, contextVariables } from './state.js';
+
+/**
+ * Truncates long messages and adds a "more..." link if needed.
+ * @param {string} content - The message content to truncate.
+ * @param {number} maxLength - The maximum length before truncation.
+ * @returns {string} - The truncated message with a "more..." link if applicable.
+ */
+function truncateMessage(content, maxLength = 50) {
+    if (content.length > maxLength) {
+        const truncated = content.slice(0, maxLength);
+        return `<span data-full-content="${content}">${truncated}... <a href="#" class="read-more">more</a></span>`;
+    }
+    return content;
+}
+
+/**
+ * Creates a new chat history entry in the sidebar.
+ * @param {string} firstMessage - The user's first message in the chat.
+ */
+export function createChatHistoryEntry(chatName, firstMessage) {
+    const chatHistoryPane = document.getElementById('chatHistoryPane');
+    if (!chatHistoryPane) {
+        debugLog('Chat history pane element not found.');
+        return;
+    }
+
+    // Create new chat history item
+    const chatItem = document.createElement('li');
+    chatItem.className = 'chat-history-item';
+
+    // Generate truncated message with "more..." link if necessary
+    const truncatedMessage = truncateMessage(firstMessage);
+
+    // Populate the chat history item
+    chatItem.innerHTML = `
+        <details>
+            <summary>${chatName}</summary>
+            <p>${truncatedMessage}</p>
+            <span class="chat-item-time">${new Date().toLocaleString()}</span>
+                <div class="chat-item-tools">
+                    <!-- Tag Buttons and Delete Button -->
+                    <div class="chat-item-tags">
+                        <button class="tag-button" aria-label="Filter by General">General</button>
+                        <button class="tag-button" aria-label="Filter by Introduction">Introduction</button>
+                        <button class="tag-button" aria-label="Filter by Welcome">Welcome</button>
+                        <button class="tag-button add-tag-btn" aria-label="Add Tag">+</button>
+                        <!-- Delete Button -->
+                        <button class="toolbar-btn delete-chat-btn" title="Delete Chat" aria-label="Delete Chat">
+                            <img src="${window.STATIC_URLS.trashIcon}" alt="Delete Chat">
+                        </button>
+                    </div>
+                </div>
+        </details>
+    `;
+
+    // Add the new chat item to the top of the list
+    const chatList = chatHistoryPane.querySelector('.chat-history-list');
+    if (chatList) {
+        chatList.prepend(chatItem); // Insert at the top
+        debugLog('New chat history entry created and added to the list.', chatItem);
+    }
+
+    // Event listener for "more..." links
+    chatItem.querySelectorAll('.read-more').forEach(link => {
+        link.addEventListener('click', (event) => {
+            event.preventDefault();
+            const parent = link.parentElement;
+            if (parent) {
+                parent.innerHTML = parent.getAttribute('data-full-content'); // Reveal full content
+            }
+        });
+    });
+
+    // Event listener for delete button
+    const deleteBtn = chatItem.querySelector('.delete-chat-btn');
+    if (deleteBtn) {
+        deleteBtn.addEventListener('click', () => deleteChat(chatItem));
+    }
+
+    // Event listener for selecting the chat item
+    chatItem.addEventListener('click', (event) => {
+        // Prevent triggering when clicking on "more..." link or delete button
+        if (event.target.classList.contains('read-more') || event.target.closest('.delete-chat-btn')) {
+            return;
+        }
+        handleChatHistoryClick(chatItem);
+    });
+}
+
+/**
+ * Handles chat history item click.
+ * @param {HTMLElement} item - The clicked chat history item.
+ */
+export function handleChatHistoryClick(item) {
+    const chatName = item.querySelector('summary').textContent.trim();
+    showToast(`Selected: "${chatName}"`, 'info');
+
+    const chatHistoryItems = document.querySelectorAll('.chat-history-pane li');
+    chatHistoryItems.forEach((i) => i.classList.remove('active'));
+    item.classList.add('active');
+
+    // Additional logic to load the selected chat can be added here
+}

swarm/static/rest_mode/js/modules/debugLogger.js

@@ -0,0 +1,14 @@
+// src/swarm/static/rest_mode/js/modules/debugLogger.js
+
+const DEBUG_MODE = true;
+
+/**
+ * Logs debug messages if debug mode is enabled.
+ * @param {string} message - The message to log.
+ * @param {any} data - Additional data to include in the log.
+ */
+export function debugLog(message, data = null) {
+    if (DEBUG_MODE) {
+        console.log(`[DEBUG] ${message}`, data);
+    }
+}

swarm/static/rest_mode/js/modules/eventHandlers.js

@@ -0,0 +1,107 @@
+// src/swarm/static/rest_mode/js/modules/eventHandlers.js
+
+import { handleLogout } from '../auth.js';
+import { toggleDebugPane, handleTechSupport } from '../debug.js';
+import { toggleSidebar } from '../sidebar.js';
+
+import { handleChatHistoryClick } from './chatHistory.js';
+import { deleteChat } from './apiService.js';
+import { handleUpload, handleVoiceRecord } from './userInteractions.js';
+import { fetchBlueprintMetadata } from './apiService.js';
+import { handleSubmit } from './messageProcessor.js';
+import { showToast } from '../toast.js';
+import { debugLog } from './debugLogger.js';
+
+/**
+ * Handles "Search" button click.
+ */
+function handleSearch() {
+    showToast("🔍 Search feature is under development.", "info");
+}
+
+/**
+ * Handles "New Chat" button click.
+ */
+function handleNewChat() {
+    showToast("📝 Starting a new chat...", "info");
+    // Implement new chat functionality as needed
+}
+
+/**
+ * Attaches event listeners to chat history items.
+ */
+function setupChatHistoryListeners() {
+    const chatHistoryItems = document.querySelectorAll('.chat-history-pane li');
+    chatHistoryItems.forEach((item) => {
+        item.removeEventListener('click', () => handleChatHistoryClick(item));
+        item.addEventListener('click', () => handleChatHistoryClick(item));
+
+        const trashCan = item.querySelector('.trash-can');
+        if (trashCan) {
+            trashCan.addEventListener('click', (e) => {
+                e.stopPropagation();
+                deleteChat(item);
+            });
+        }
+    });
+}
+
+/**
+ * Attaches event listeners to main application buttons and elements.
+ */
+function setupGlobalEventListeners() {
+    // Sidebar toggles
+    document.getElementById("settingsToggleButton")?.removeEventListener('click', () => toggleSidebar('options', true));
+    document.getElementById("settingsToggleButton")?.addEventListener('click', () => toggleSidebar('options', true));
+    document.getElementById("optionsSidebarHideBtn")?.addEventListener('click', () => toggleSidebar('options', false));
+    // Removed event listeners for chatHistoryToggleButton and leftSidebarHideBtn
+
+    // Top buttons
+    // document.getElementById("searchButton")?.addEventListener('click', handleSearch);
+    document.getElementById("newChatButton")?.addEventListener('click', handleNewChat);
+
+    // Functional buttons
+    document.getElementById("logoutButton")?.addEventListener('click', handleLogout);
+    document.getElementById("uploadButton")?.addEventListener('click', handleUpload);
+    document.getElementById("voiceRecordButton")?.addEventListener('click', handleVoiceRecord);
+    document.getElementById("submitButton")?.addEventListener("click", handleSubmit); // Attached here
+
+    // User input submission with Enter key
+    const userInput = document.getElementById("userInput");
+    userInput?.addEventListener("keypress", (e) => {
+        if (e.key === "Enter") {
+            handleSubmit();
+        }
+    });
+
+    // Debug pane toggles
+    document.getElementById("debugButton")?.addEventListener('click', toggleDebugPane);
+    document.getElementById("techSupportButtonInsideDebug")?.addEventListener('click', handleTechSupport);
+}
+
+/**
+ * Sets up all event listeners for the application.
+ */
+let eventListenersInitialized = false;
+
+export function setupEventListeners() {
+    if (eventListenersInitialized) {
+        debugLog('Event listeners are already initialized.');
+        return;
+    }
+
+    setupGlobalEventListeners();
+    setupChatHistoryListeners();
+    debugLog('All event listeners have been set up.');
+    eventListenersInitialized = true;
+}
+
+/**
+ * Initialize the application.
+ */
+export function initializeApplication() {
+    debugLog('[DEBUG] Initializing application...');
+    fetchBlueprintMetadata(); // Fetch blueprint metadata and display it
+    setupEventListeners();    // Set up event listeners
+    debugLog('[DEBUG] Application initialized.');
+}

swarm/static/rest_mode/js/modules/messageProcessor.js

@@ -0,0 +1,120 @@
+// src/swarm/static/rest_mode/js/modules/messageProcessor.js
+
+import { showToast } from '../toast.js';
+import { appendRawMessage } from '../messages.js';
+import { showLoadingIndicator, hideLoadingIndicator } from '../ui.js';
+
+import { submitMessage } from './apiService.js';
+import { debugLog } from './debugLogger.js';
+import { validateMessage } from './validation.js';
+import { chatHistory, contextVariables } from './state.js'; // Assuming state.js manages shared state
+import { createChatHistoryEntry } from './chatHistory.js';
+
+/**
+ * Processes the assistant's response and updates context variables.
+ * @param {Object} data - The response data from the server.
+ * @param {Object} contextVariables - The current context variables.
+ */
+export function processAssistantResponse(data, contextVariables) {
+    if (!data.choices || !Array.isArray(data.choices)) {
+        debugLog('Invalid response structure:', data);
+        showToast('⚠️ Invalid response from server.', 'error');
+        return;
+    }
+
+    data.choices.forEach((choice) => {
+        const rawMessage = { ...choice.message };
+
+        const role = rawMessage.role || 'assistant';
+        const content = rawMessage.content || 'No content';
+        const sender = rawMessage.sender || (role === 'user' ? 'User' : 'Assistant');
+
+        appendRawMessage(role, { content }, sender, rawMessage.metadata);
+    });
+
+    debugLog('Assistant response processed successfully.', data);
+}
+
+/**
+ * Handles user message submission.
+ * @returns {Promise<void>}
+ */
+export async function handleSubmit() {
+    const userInput = document.getElementById("userInput");
+    if (!userInput) {
+        debugLog("User input element not found.");
+        return;
+    }
+
+    const userMessageContent = userInput.value.trim();
+    if (!userMessageContent) {
+        showToast("❌ You cannot send an empty message.", "error");
+        debugLog("Empty message submission blocked.");
+        return;
+    }
+
+    // Clear input field
+    userInput.value = "";
+
+    const userMessage = {
+        role: "user",
+        content: userMessageContent,
+        sender: "User",
+        metadata: {},
+    };
+    chatHistory.push(userMessage);
+    debugLog("User message added to chat history.", userMessage);
+
+    const isFirstUserMessage = chatHistory.filter((msg) => msg.role === "user").length === 1;
+
+    // Validate the message
+    const error = validateMessage(userMessage);
+    if (error) return;
+
+    // Render the user message in the UI
+    appendRawMessage(userMessage.role, { content: userMessage.content }, userMessage.sender, userMessage.metadata);
+
+    // If it's the first user message, update the persistent message and create a new chat history entry
+    if (isFirstUserMessage) {
+        const persistentMessageElement = document.getElementById('firstUserMessage');
+        if (persistentMessageElement) {
+            persistentMessageElement.innerHTML = `<b>Persist:</b><p>User: ${userMessageContent}</p>`;
+            debugLog("Persistent message updated with the first user message.");
+        }
+        createChatHistoryEntry("New Chat", userMessageContent);
+    }
+
+    showLoadingIndicator(); // Show loading spinner
+
+    try {
+        const urlPath = window.location.pathname;
+        const modelName = urlPath.split("/").filter(Boolean).pop() || "";
+        debugLog("Submitting message to model.", { modelName, message: userMessageContent });
+
+        const response = await fetch("/v1/chat/completions", {
+            method: "POST",
+            headers: {
+                "Content-Type": "application/json",
+                "X-CSRFToken": document.querySelector('meta[name="csrf-token"]')?.getAttribute("content") || "",
+            },
+            body: JSON.stringify({
+                model: modelName,
+                messages: chatHistory,
+                context_variables: contextVariables,
+            }),
+        });
+
+        if (!response.ok) {
+            throw new Error(`HTTP Error: ${response.status}`);
+        }
+
+        const data = await response.json();
+        debugLog("Message successfully processed by the model.", data);
+        processAssistantResponse(data, contextVariables); // Ensure this matches your function signature
+    } catch (err) {
+        console.error("Error submitting message:", err);
+        showToast("⚠️ Error submitting message. Please try again.", "error");
+    } finally {
+        hideLoadingIndicator(); // Hide loading spinner
+    }
+}

swarm/static/rest_mode/js/modules/state.js

@@ -0,0 +1,7 @@
+// src/swarm/static/rest_mode/js/modules/state.js
+
+/**
+ * Shared state variables.
+ */
+export let contextVariables = { active_agent_name: null };
+export let chatHistory = [];

swarm/static/rest_mode/js/modules/userInteractions.js

@@ -0,0 +1,29 @@
+// src/swarm/static/rest_mode/js/modules/userInteractions.js
+
+import { showToast } from '../toast.js';
+import { debugLog } from './debugLogger.js';
+
+/**
+ * Handles user logout.
+ */
+export function handleLogout() {
+    showToast('🚪 You have been logged out.', 'info');
+    debugLog('User initiated logout.');
+    window.location.href = '/login';
+}
+
+/**
+ * Handles file upload.
+ */
+export function handleUpload() {
+    showToast('➕ Upload feature is under development.', 'info');
+    debugLog('User attempted to upload a file.');
+}
+
+/**
+ * Handles voice recording.
+ */
+export function handleVoiceRecord() {
+    showToast('🎤 Voice recording is under development.', 'info');
+    debugLog('User attempted to record voice.');
+}

swarm/static/rest_mode/js/modules/validation.js

@@ -0,0 +1,23 @@
+// src/swarm/static/rest_mode/js/modules/validation.js
+
+import { showToast } from '../toast.js';
+import { debugLog } from './debugLogger.js';
+
+/**
+ * Validates the user message.
+ * @param {Object} message - The message object to validate.
+ * @returns {string|null} - Error message if invalid, or null if valid.
+ */
+export function validateMessage(message) {
+    if (!message.content || message.content.trim() === '') {
+        showToast('❌ Message cannot be empty.', 'error');
+        debugLog('Validation failed: Message is empty.');
+        return 'Message cannot be empty.';
+    }
+    if (message.content.length > 5000) {
+        showToast('❌ Message too long. Please limit to 5000 characters.', 'error');
+        debugLog('Validation failed: Message too long.');
+        return 'Message too long.';
+    }
+    return null; // Valid message
+}

swarm/static/rest_mode/js/rendering.js

@@ -0,0 +1,119 @@
+/**
+ * rendering.js - Contains functions for rendering messages in the chat area,
+ * and appending raw messages to the debug panel.
+ */
+const messageContainerId = "messageHistory";
+const rawMessagesContainerId = "rawMessagesContent";
+
+/**
+ * Retrieves the current style theme.
+ * @returns {string} - The current style theme ('pastel', 'tropical', 'corporate').
+ */
+function getCurrentStyleTheme() {
+    const container = document.querySelector('.container');
+    return container?.getAttribute('data-theme-color') || 'pastel';
+}
+
+/**
+ * Renders a single message in the chat.
+ */
+export function renderMessage(role, message, sender = "", metadata = {}, isFirstUser = false) {
+    const messageHistory = document.getElementById(messageContainerId);
+    if (!messageHistory) return;
+
+    const containerDiv = document.createElement("div");
+    containerDiv.classList.add("message", role);
+    if (isFirstUser) containerDiv.classList.add("first-user");
+
+    // For our special "plus" icon on hover (to persist the message), we wrap the messageContent in a container
+    // Then on hover, show a small plus icon in the top-right corner
+    let messageContent = `<strong>${sender}:</strong> ${message.content}`;
+    
+    // If role === "assistant" and layout is "minimalist", remove boxes, etc.
+    const containerElement = document.querySelector('.container');
+    if (role === "assistant" && containerElement?.getAttribute('data-theme-layout') === 'minimalist-layout') {
+        messageContent = message.content;
+    }
+
+    // Determine trash can icon based on current style
+    const currentStyle = getCurrentStyleTheme();
+    let trashCanIcon = '';
+    if (currentStyle === 'corporate') {
+        trashCanIcon = '✖️'; // X icon
+    } else if (currentStyle === 'tropical') {
+        trashCanIcon = '🗑️'; // Emoji trashcan
+    } else { // pastel
+        trashCanIcon = '🗑️'; // Smaller slim trash can could use a different emoji or a custom SVG
+    }
+
+    containerDiv.innerHTML = `
+      <div class="message-text">
+        ${messageContent}
+      </div>
+      <span class="persist-icon" title="Persist this message to the pinned area">➕</span>
+      <span class="trash-can" title="Delete Chat">${trashCanIcon}</span>
+    `;
+
+    // Add event listener on the plus icon
+    const plusIcon = containerDiv.querySelector('.persist-icon');
+    plusIcon?.addEventListener('click', (event) => {
+        event.stopPropagation();
+        persistMessage(role, message, sender);
+    });
+
+    // Add event listener on the trash can
+    const trashCan = containerDiv.querySelector('.trash-can');
+    trashCan?.addEventListener('click', (event) => {
+        event.stopPropagation();
+        // Implement deletion logic if necessary
+        showToast("��️ Delete feature is under development.", "info");
+    });
+
+    messageHistory.appendChild(containerDiv);
+    messageHistory.scrollTop = messageHistory.scrollHeight;
+}
+
+/**
+ * Persists a message in the "first user message" container,
+ * along with any other pinned messages.
+ */
+function persistMessage(role, message, sender = "") {
+    const firstUserMessageDiv = document.getElementById("firstUserMessage");
+    if (!firstUserMessageDiv) return;
+
+    // We'll allow multiple pinned messages by just appending
+    const pinned = document.createElement("div");
+    pinned.classList.add("pinned-message");
+    pinned.innerHTML = `<small>${sender}:</small> ${message.content}`;
+
+    firstUserMessageDiv.style.display = "block";
+    firstUserMessageDiv.appendChild(pinned);
+}
+
+/**
+ * Appends raw message data to the Raw Messages pane.
+ * @param {string} role - The role of the sender.
+ * @param {object} content - The message content.
+ * @param {string} sender - The display name of the sender.
+ * @param {object} metadata - The metadata associated with the message.
+ */
+export function appendRawMessage(role, content, sender, metadata) {
+    const rawMessage = document.createElement("div");
+    rawMessage.className = "raw-message";
+
+    const rawData = {
+        role: role,
+        sender: sender || "Unknown",
+        content: content.content || "No content provided.",
+        metadata: metadata // Retain full metadata for backend processing
+    };
+
+    const pre = document.createElement("pre");
+    pre.textContent = JSON.stringify(rawData, null, 2);
+    rawMessage.appendChild(pre);
+
+    rawMessagesContent.appendChild(rawMessage);
+    rawMessagesContent.scrollTop = rawMessagesContent.scrollHeight;
+
+    console.log("Appended Raw Message:", rawData);
+}

swarm/static/rest_mode/js/settings.js

@@ -0,0 +1,130 @@
+const DEBUG_MODE = true;
+
+import { showToast } from './toast.js';
+
+export let llmConfig = {};
+
+/**
+ * Logs debug messages if debug mode is enabled.
+ * @param {string} message - The message to log.
+ * @param {any} data - Additional data to include in the log.
+ */
+export function debugLog(message, data = null) {
+    if (DEBUG_MODE) {
+        console.log(`[DEBUG] ${message}`, data);
+    }
+}
+
+/**
+ * Fetch and load LLM configuration.
+ */
+export async function loadLLMConfig() {
+    debugLog("Attempting to load LLM configuration...");
+    try {
+        const response = await fetch('/config/swarm_config.json');
+        debugLog("Received response from LLM config fetch.", { status: response.status });
+
+        if (!response.ok) throw new Error(`HTTP Error: ${response.status}`);
+        const config = await response.json();
+        debugLog("LLM configuration loaded successfully.", config);
+
+        llmConfig = config.llm || {};
+        updateLLMSettingsPane(llmConfig);
+    } catch (error) {
+        console.error("Error loading LLM config:", error);
+        showToast("⚠️ LLM settings could not be loaded. Please check the server.", "warning");
+    }
+}
+
+/**
+ * Updates the settings pane with collapsible LLM modes and toggles.
+ * @param {Object} config - The LLM configuration object.
+ */
+function updateLLMSettingsPane(config) {
+    debugLog("Updating LLM settings pane...", config);
+
+    const llmContainer = document.getElementById('llmConfiguration');
+    if (!llmContainer) {
+        console.warn("[DEBUG] LLM configuration container not found in the DOM.");
+        return;
+    }
+
+    llmContainer.innerHTML = Object.entries(config)
+        .map(([mode, details]) => {
+            const isDefault = mode === 'default';
+            const toggleHTML = `
+                <div class="svg-toggle ${isDefault ? 'disabled' : ''}" data-state="on" id="toggle-${mode}">
+                    <img src="/static/rest_mode/svg/toggle_on.svg" alt="Toggle On">
+                </div>
+            `;
+
+            const fields = Object.entries(details)
+                .map(([key, value]) => `
+                    <div class="llm-field">
+                        <label>${key}:</label>
+                        <input type="text" value="${value}" readonly>
+                    </div>
+                `)
+                .join('');
+
+            return `
+                <div class="llm-mode collapsible">
+                    <h4 class="collapsible-toggle">
+                        ${toggleHTML} ${mode.charAt(0).toUpperCase() + mode.slice(1)} Mode
+                        <span>▼</span>
+                    </h4>
+                    <div class="collapsible-content hidden">
+                        ${fields}
+                    </div>
+                </div>
+            `;
+        })
+        .join('');
+
+    initializeLLMModeToggles();
+    initializeCollapsibleSections();
+}
+
+/**
+ * Initialize toggles for LLM modes.
+ */
+function initializeLLMModeToggles() {
+    Object.keys(llmConfig).forEach((mode) => {
+        const toggle = document.getElementById(`toggle-${mode}`);
+        if (toggle && mode !== 'default') {
+            toggle.addEventListener('click', (event) => {
+                event.stopPropagation();
+                const isOn = toggle.dataset.state === 'on';
+                toggle.dataset.state = isOn ? 'off' : 'on';
+                toggle.querySelector('img').src = isOn
+                    ? '/static/rest_mode/svg/toggle_off.svg'
+                    : '/static/rest_mode/svg/toggle_on.svg';
+                showToast(`${mode.charAt(0).toUpperCase() + mode.slice(1)} Mode ${isOn ? 'disabled' : 'enabled'}`);
+            });
+        }
+    });
+}
+
+/**
+ * Initialize collapsible behavior for LLM modes and sections.
+ */
+function initializeCollapsibleSections() {
+    document.querySelectorAll('.collapsible-toggle').forEach((toggle) => {
+        toggle.addEventListener('click', () => {
+            const content = toggle.nextElementSibling;
+            if (content) {
+                content.classList.toggle('hidden');
+                const isOpen = !content.classList.contains('hidden');
+                toggle.querySelector('span').textContent = isOpen ? '▲' : '▼';
+            }
+        });
+    });
+}
+
+/**
+ * Initialize settings logic.
+ */
+document.addEventListener('DOMContentLoaded', () => {
+    debugLog("Settings page initialized.");
+    loadLLMConfig();
+});