imcp 0.1.7 → 0.1.8-dev

package/src/web/public/js/modal/installation.js

@@ -1,266 +0,0 @@
-// import { delayedAppendInstallLoadingMessage } from './messageQueue.js'; // No longer used directly for steps
-import { showInstallLoadingModal, updateOverallInstallStatus, addInstallationStep } from './loadingModal.js';
-import { showToast } from '../notifications.js';
-
-/**
- * Handle bulk client installations
- * @param {string} categoryName - The category name
- * @param {string} serverName - The server name
- * @param {string[]} targets - Target clients
- * @param {Object} envVars - Environment variables
- * @param {string} installingMessage - Installation message
- * @param {Object} serverData - Server data
- * @param {Object} serverInstallOptions - Server installation options
- */
-export async function handleBulkClientInstall(categoryName, serverName, targets, envVars = {}, installingMessage = "Starting installation...", serverData = null, serverInstallOptions = null) {
-    console.log('[LoadingModal] handleBulkClientInstall called', { categoryName, serverName, targets, envVars, serverInstallOptions });
-    // Hide install modal, show loading modal
-    const installModal = document.getElementById('installModal');
-    console.log('[LoadingModal] installModal:', installModal);
-    if (installModal) installModal.style.display = "none";
-
-    // Store category and server name for potential refresh
-    if (categoryName) {
-        localStorage.setItem('lastSelectedCategory', categoryName);
-    }
-    if (serverName) {
-        localStorage.setItem('lastSelectedServerName', serverName);
-    }
-
-    // If serverData is provided, extract the installing message from it (latest status)
-    if (serverData?.data?.installationStatus?.serversStatus) {
-        const serverStatuses = serverData.data.installationStatus.serversStatus;
-        const serverStatus = serverStatuses[serverName] || { installedStatus: {} };
-        if (targets?.length > 0) {
-            const target = targets[0];
-            const msg = serverStatus.installedStatus?.[target]?.message;
-            if (msg) installingMessage = msg;
-        }
-        // Append the installing message for user visibility
-        if (installingMessage && installingMessage !== "Starting installation...") {
-            delayedAppendInstallLoadingMessage(installingMessage);
-        }
-    }
-
-    showInstallLoadingModal(`Installing ${serverName}`); // Pass initial server name
-    // delayedAppendInstallLoadingMessage(installingMessage); // Old way
-
-    try {
-        // delayedAppendInstallLoadingMessage("Installing, please wait..."); // Old way
-
-        // Use serverInstallOptions if provided, otherwise build the traditional options
-        const requestBody = {
-            serverList: {
-                [serverName]: serverInstallOptions || {
-                    targetClients: targets,
-                    env: envVars
-                }
-            }
-        };
-
-        const response = await fetch(`/api/categories/${categoryName}/install`, {
-            method: 'POST',
-            headers: {
-                'Content-Type': 'application/json',
-                'Accept': 'application/json'
-            },
-            body: JSON.stringify(requestBody)
-        });
-
-        console.log('[LoadingModal] fetch install response:', response);
-
-        if (!response.ok) {
-            const errorData = await response.text();
-            // delayedAppendInstallLoadingMessage(`<span style="color:#f59e0b;">Failed: ${errorData || response.statusText}</span>`); // Old way
-            updateOverallInstallStatus('failed', `Installation request failed: ${errorData || response.statusText}`);
-            console.error('[LoadingModal] Failed:', errorData || response.statusText);
-            throw new Error(`Installation failed: ${errorData || response.statusText}`);
-        }
-
-        const result = await response.json();
-        console.log('[LoadingModal] install result:', result);
-        if (!result.success) {
-            // delayedAppendInstallLoadingMessage(`<span style="color:#f59e0b;">${result.error || 'Operation failed'}</span>`); // Old way
-            updateOverallInstallStatus('failed', result.error || 'Installation operation failed to start.');
-            console.error('[LoadingModal] Error:', result.error || 'Operation failed');
-            throw new Error(result.error || 'Installation failed');
-        }
-
-        // Start polling for install status
-        pollNewInstallStatus(categoryName, serverName, 2000); // New polling
-    } catch (error) {
-        console.error('[LoadingModal] Error applying configuration:', error);
-        // delayedAppendInstallLoadingMessage(`<span style="color:red;">Error: ${error.message}</span>`); // Old way
-        updateOverallInstallStatus('failed', `Error: ${error.message}`);
-    }
-}
-
-/**
- * Poll install status using the new API endpoint for detailed steps.
- * @param {string} categoryName - The category name
- * @param {string} serverName - The server name
- * @param {number} interval - Polling interval in milliseconds
- */
-async function pollNewInstallStatus(categoryName, serverName, interval = 2000) {
-    let completionMessageSent = false;
-    const startTime = Date.now();
-    const maxTimeout = 10 * 60 * 1000; // 10 minutes
-
-    while (Date.now() - startTime < maxTimeout && !completionMessageSent) {
-        try {
-            const resp = await fetch(`/api/categories/${categoryName}/servers/${serverName}/installation/status`);
-            if (resp.ok) {
-                const result = await resp.json();
-                if (result.success && result.data) {
-                    const { steps, overallStatus, error } = result.data;
-
-                    updateOverallInstallStatus(overallStatus, error || `Installation ${overallStatus}`);
-
-                    // Always update or insert each step, so UI stays in sync with backend
-                    steps.forEach(step => {
-                        addInstallationStep(step.name, step.message, step.status, step.timestamp);
-                    });
-
-                    if (overallStatus === 'completed' || overallStatus === 'failed') {
-                        completionMessageSent = true;
-                        // The hideInstallLoadingModal will be called by the user or after a timeout.
-                        // We can add a "Close" button or auto-close logic here if needed.
-                        // For now, just stop polling.
-                        // Ensure final status is displayed
-                        const finalMessage = overallStatus === 'completed' ?
-                            `Installation completed successfully for ${serverName}.` :
-                            `Installation failed for ${serverName}`;
-                        updateOverallInstallStatus(overallStatus, finalMessage);
-                        return;
-                    }
-                } else if (!result.success && resp.status === 404) {
-                    // Still waiting for the status file to be created.
-                    updateOverallInstallStatus('in-progress', `Waiting for installation to start for ${serverName}...`);
-                } else if (!result.success) {
-                    updateOverallInstallStatus('failed', `Error fetching status: ${result.error || 'Unknown error'}`);
-                    completionMessageSent = true; // Stop polling on error
-                    return;
-                }
-            } else if (resp.status === 404) {
-                updateOverallInstallStatus('in-progress', `Installation status not yet available for ${serverName}. Retrying...`);
-            } else {
-                const errorText = await resp.text();
-                updateOverallInstallStatus('failed', `Error fetching status: ${errorText || resp.statusText}`);
-                completionMessageSent = true; // Stop polling on error
-                return;
-            }
-        } catch (error) {
-            console.error('[LoadingModal] Error polling new install status:', error);
-            updateOverallInstallStatus('failed', `Error polling status: ${error.message}`);
-            completionMessageSent = true; // Stop polling on error
-            return;
-        }
-        await new Promise(resolve => setTimeout(resolve, interval));
-    }
-
-    if (!completionMessageSent) {
-        updateOverallInstallStatus('failed', `Operation timed out for ${serverName} - Please check logs or refresh.`);
-    }
-}
-
-/**
- * Handle client uninstallation for multiple targets
- * @param {string} categoryName - The category name
- * @param {Object} serverList - List of servers to uninstall
- * @param {string[]} targets - Target clients
- */
-export async function uninstallTools(categoryName, serverList, targets) {
-
-    console.log('[LoadingModal] uninstallTools called', { categoryName, serverList, targets });
-    // Store category and server name for potential refresh
-    if (categoryName) {
-        console.log('[LoadingModal] Setting lastSelectedCategory:', categoryName);
-        localStorage.setItem('lastSelectedCategory', categoryName);
-    }
-
-    // Get selected targets from window.selectedClients or the provided targets
-    const selectedTargets = window.selectedClients || (Array.isArray(targets) ? targets : [targets]);
-
-    // Validate selected targets
-    if (!selectedTargets || selectedTargets.length === 0) {
-        showToast('Please select at least one client to uninstall.', 'error');
-        return;
-    }
-
-    // Ensure showInstallLoadingModal is called if not already visible,
-    // or ensure overall status is updated if it is.
-    // For simplicity, we assume the modal is shown by the caller (e.g., modalSetup.js)
-    // Add uninstall started step
-    if (typeof addInstallationStep === 'function') {
-        addInstallationStep(
-            'Uninstalling',
-            `Uninstallation process started for ${Object.keys(serverList).join(', ')}`,
-            'in-progress',
-            new Date().toISOString()
-        );
-    }
-    updateOverallInstallStatus('in-progress', `Starting uninstallation for ${Object.keys(serverList).join(', ')}...`);
-
-    try {
-        const serverListKeys = Object.keys(serverList);
-        serverListKeys.forEach(server => {
-            console.log('[LoadingModal] Setting lastSelectedServerName:', server);
-            localStorage.setItem('lastSelectedServerName', server);
-        });
-
-        const response = await fetch(`/api/categories/${categoryName}/uninstall`, {
-            method: 'POST',
-            headers: { 'Content-Type': 'application/json' },
-            body: JSON.stringify({
-                serverList: serverList,
-                options: {
-                    targets: selectedTargets,
-                    removeData: true
-                }
-            })
-        });
-
-        if (!response.ok) {
-            const errorData = await response.text();
-            updateOverallInstallStatus('failed', `Uninstallation request failed: ${errorData || response.statusText}`);
-            throw new Error(`Uninstallation failed: ${errorData || response.statusText}`);
-        }
-
-        const result = await response.json();
-        if (!result.success) {
-            updateOverallInstallStatus('failed', `Uninstallation failed: ${result.error || 'Operation failed'}`);
-            throw new Error(result.error || 'Uninstallation failed');
-        }
-
-        // Add uninstall finished step with 1s delay before updating overall status
-        if (typeof addInstallationStep === 'function') {
-            await new Promise(resolve => setTimeout(resolve, 1000));
-            addInstallationStep(
-                'Uninstalling',
-                `Uninstallation process finished for ${Object.keys(serverList).join(', ')}`,
-                'completed',
-                new Date().toISOString()
-            );
-            await new Promise(resolve => setTimeout(resolve, 1000));
-            addInstallationStep(
-                'Uninstall Finished',
-                `Uninstallation finished for ${Object.keys(serverList).join(', ')}`,
-                'completed',
-                new Date().toISOString()
-            );
-        }
-        await new Promise(resolve => setTimeout(resolve, 1000));
-        updateOverallInstallStatus('completed', `Successfully uninstalled from ${selectedTargets.join(', ')}.`);
-        window.selectedClients = []; // Clear selected clients
-
-    } catch (error) {
-        console.error('Error uninstalling tools:', error);
-        // The status should have been updated by the specific error handlers above.
-        // If an error occurs before those, update status here.
-        const overallStatusTextEl = document.getElementById('overallStatusText'); // Check if element exists
-        if (overallStatusTextEl && overallStatusTextEl.textContent.startsWith('Starting uninstallation')) {
-            updateOverallInstallStatus('failed', `Error uninstalling tools: ${error.message}`);
-        }
-        showToast(`Error uninstalling tools: ${error.message}`, 'error');
-    }
-}

package/src/web/public/js/modal/loadingModal.js

@@ -1,182 +0,0 @@
-// import { delayedAppendInstallLoadingMessage } from './messageQueue.js'; // Not directly used here anymore for appending
-
-const ICONS = {
-    IN_PROGRESS: '<div class="status-spinner"></div>',
-    COMPLETED: '<div class="status-icon-circled icon-check-container"><span class="status-icon icon-check">✓</span></div>',
-    FAILED: '<span class="status-icon icon-cross">✗</span>', // Assuming cross doesn't need a circle for now
-    CANCELED: '<span class="status-icon icon-minus">–</span>', // Simple minus for canceled
-};
-
-let overallStatusIconEl, overallStatusTextEl, installStepDetailsListEl;
-
-/**
- * Display the installation loading modal and prepare it for messages.
- * @param {string} [initialOperationText='Installing'] - The initial overall operation text.
- */
-export function showInstallLoadingModal(initialOperationText = 'Installing') {
-    const loadingModal = document.getElementById('installLoadingModal');
-    // Assuming modal-content is the direct child where content should be placed.
-    const modalContent = loadingModal ? loadingModal.querySelector('.modal-content') : null;
-
-    if (loadingModal && modalContent) {
-        modalContent.innerHTML = `
-            <button id="installLoadingModalCloseBtn" class="modal-close-btn">&times;</button>
-            <div class="installation-status-header">
-                <div id="overallStatusIconContainer" class="overall-status-icon">
-                    ${ICONS.IN_PROGRESS}
-                </div>
-                <h3 id="overallStatusText" class="overall-status-text">${initialOperationText}...</h3>
-            </div>
-            <div class="installation-steps-container">
-                <ul id="installStepDetailsList" class="install-step-details-list"></ul>
-            </div>
-        `;
-
-        overallStatusIconEl = modalContent.querySelector('#overallStatusIconContainer');
-        overallStatusTextEl = modalContent.querySelector('#overallStatusText');
-        installStepDetailsListEl = modalContent.querySelector('#installStepDetailsList');
-
-        const closeButton = modalContent.querySelector('#installLoadingModalCloseBtn');
-        if (closeButton) {
-            closeButton.addEventListener('click', hideInstallLoadingModal);
-        }
-
-        loadingModal.style.display = 'block';
-    } else {
-        console.error('[LoadingModal] Required elements not found: #installLoadingModal or .modal-content');
-    }
-}
-
-/**
- * Updates the overall status display in the loading modal.
- * @param {'in-progress' | 'completed' | 'failed'} status - The overall status.
- * @param {string} message - The message to display for the overall status.
- */
-export function updateOverallInstallStatus(status, message) {
-    if (!overallStatusIconEl || !overallStatusTextEl) {
-        // console.warn('[LoadingModal] Overall status elements not initialized or found.');
-        return;
-    }
-
-    let iconHtml = ICONS.IN_PROGRESS;
-    let statusClass = 'in-progress';
-
-    switch (status) {
-        case 'completed':
-            iconHtml = ICONS.COMPLETED;
-            statusClass = 'completed';
-            break;
-        case 'failed':
-            iconHtml = ICONS.FAILED;
-            statusClass = 'failed';
-            break;
-        case 'in-progress':
-        default:
-            // iconHtml and statusClass already set
-            break;
-    }
-
-    overallStatusIconEl.innerHTML = iconHtml;
-    overallStatusIconEl.className = `overall-status-icon ${statusClass}`; // Update class for styling
-    overallStatusTextEl.textContent = message || (status.charAt(0).toUpperCase() + status.slice(1));
-}
-
-/**
- * Adds a step to the installation details list.
- * @param {string} stepName - The name/title of the step.
- * @param {string} message - The message associated with the step.
- * @param {'pending'|'in-progress'|'completed'|'failed'|'canceled'} status - The status of the step.
- * @param {string} timestamp - ISO timestamp string for the step.
- */
-export function addInstallationStep(stepName, message, status, timestamp) {
-    if (!installStepDetailsListEl) {
-        return;
-    }
-
-    // Use stepName as a unique identifier for the step
-    const stepId = `install-step-${stepName.replace(/[^a-zA-Z0-9_-]/g, '_')}`;
-    let listItem = document.getElementById(stepId);
-
-    let statusClass = '';
-    let stepIcon = '';
-
-    switch (status) {
-        case 'completed':
-            statusClass = 'success';
-            stepIcon = '<span class="step-icon icon-check-small">✓</span>';
-            break;
-        case 'failed':
-            statusClass = 'error';
-            stepIcon = '<span class="step-icon icon-cross-small">✗</span>';
-            break;
-        case 'canceled':
-            statusClass = 'canceled';
-            stepIcon = '<span class="step-icon icon-minus-small">–</span>';
-            break;
-        case 'in-progress':
-        case 'pending':
-        default:
-            statusClass = 'in-progress';
-            stepIcon = '<div class="status-spinner step-spinner"></div>';
-            break;
-    }
-
-    let timeString = '';
-    if (timestamp) {
-        try {
-            timeString = new Date(timestamp).toLocaleTimeString([], { hour: '2-digit', minute: '2-digit', second: '2-digit', hour12: false });
-        } catch (e) { /* ignore */ }
-    }
-
-    const innerHTML = `
-        ${stepIcon}
-        <div class="step-info">
-            <span class="step-name">${stepName}</span>
-            <span class="step-message">${message || (
-                status === 'completed' ? 'Completed' :
-                status === 'failed' ? 'Failed' :
-                status === 'canceled' ? 'Canceled' :
-                'In Progress'
-            )}</span>
-        </div>
-        <span class="step-timestamp">${timeString}</span>
-    `;
-
-    if (listItem) {
-        // Update existing step
-        listItem.className = `step-detail-item ${statusClass}`;
-        listItem.innerHTML = innerHTML;
-    } else {
-        // Create new step
-        listItem = document.createElement('li');
-        listItem.id = stepId;
-        listItem.className = `step-detail-item ${statusClass}`;
-        listItem.innerHTML = innerHTML;
-        installStepDetailsListEl.appendChild(listItem);
-        // Scroll to the bottom of the list
-        installStepDetailsListEl.scrollTop = installStepDetailsListEl.scrollHeight;
-    }
-}
-
-
-/**
- * Hide the install loading modal.
- */
-export function hideInstallLoadingModal() {
-    console.log('[LoadingModal] Hiding installation modal');
-    const loadingModal = document.getElementById('installLoadingModal');
-    if (loadingModal) {
-        loadingModal.style.display = 'none';
-
-        // Clear references to avoid stale elements if modal is reshown
-        overallStatusIconEl = null;
-        overallStatusTextEl = null;
-        installStepDetailsListEl = null;
-
-        // Dispatch an event to signal that the main modal content should be refreshed
-        document.dispatchEvent(new CustomEvent('refreshMainModalContent'));
-        console.log('[LoadingModal] Dispatched refreshMainModalContent event.');
-    } else {
-        console.error('[LoadingModal] loading modal DOM not found');
-    }
-}