npm - imcp - Versions diffs - 0.1.5 → 0.1.6 - Mend

imcp 0.1.5 → 0.1.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (186) hide show

package/.github/ISSUE_TEMPLATE/JitAccess.yml +28 -0
package/.github/acl/access.yml +20 -0
package/.github/compliance/inventory.yml +5 -0
package/.github/policies/jit.yml +19 -0
package/.github/workflows/build.yml +28 -0
package/.roo/rules-code/rules.md +88 -0
package/docs/ONBOARDING_PAGE_DESIGN.md +260 -0
package/docs/Telemetry.md +136 -0
package/memory-bank/activeContext.md +26 -0
package/memory-bank/decisionLog.md +91 -0
package/memory-bank/productContext.md +41 -0
package/memory-bank/progress.md +35 -0
package/memory-bank/systemPatterns.md +10 -0
package/package.json +1 -5
package/src/cli/commands/install.ts +139 -0
package/src/cli/commands/list.ts +113 -0
package/src/cli/commands/pull.ts +16 -0
package/src/cli/commands/serve.ts +39 -0
package/src/cli/commands/uninstall.ts +64 -0
package/src/cli/index.ts +82 -0
package/src/core/installers/clients/BaseClientInstaller.ts +341 -0
package/src/core/installers/clients/ClientInstaller.ts +222 -0
package/src/core/installers/clients/ClientInstallerFactory.ts +43 -0
package/src/core/installers/clients/ClineInstaller.ts +35 -0
package/src/core/installers/clients/ExtensionInstaller.ts +165 -0
package/src/core/installers/clients/GithubCopilotInstaller.ts +79 -0
package/src/core/installers/clients/MSRooCodeInstaller.ts +32 -0
package/src/core/installers/index.ts +11 -0
package/src/core/installers/requirements/BaseInstaller.ts +85 -0
package/src/core/installers/requirements/CommandInstaller.ts +231 -0
package/src/core/installers/requirements/GeneralInstaller.ts +133 -0
package/src/core/installers/requirements/InstallerFactory.ts +114 -0
package/src/core/installers/requirements/NpmInstaller.ts +271 -0
package/src/core/installers/requirements/NugetInstaller.ts +203 -0
package/src/core/installers/requirements/PipInstaller.ts +207 -0
package/src/core/installers/requirements/RequirementInstaller.ts +42 -0
package/src/core/loaders/ConfigurationLoader.ts +298 -0
package/src/core/loaders/ConfigurationProvider.ts +462 -0
package/src/core/loaders/InstallOperationManager.ts +367 -0
package/src/core/loaders/ServerSchemaLoader.ts +117 -0
package/src/core/loaders/ServerSchemaProvider.ts +99 -0
package/src/core/loaders/SystemSettingsManager.ts +278 -0
package/src/core/metadatas/constants.ts +122 -0
package/src/core/metadatas/recordingConstants.ts +65 -0
package/src/core/metadatas/types.ts +202 -0
package/src/core/onboard/FeedOnboardService.ts +501 -0
package/src/core/onboard/OnboardProcessor.ts +356 -0
package/src/core/onboard/OnboardStatus.ts +60 -0
package/src/core/onboard/OnboardStatusManager.ts +416 -0
package/src/core/validators/FeedValidator.ts +135 -0
package/src/core/validators/IServerValidator.ts +21 -0
package/src/core/validators/SSEServerValidator.ts +43 -0
package/src/core/validators/ServerValidatorFactory.ts +51 -0
package/src/core/validators/StdioServerValidator.ts +313 -0
package/src/index.ts +44 -0
package/src/services/InstallationService.ts +102 -0
package/src/services/MCPManager.ts +249 -0
package/src/services/RequirementService.ts +627 -0
package/src/services/ServerService.ts +161 -0
package/src/services/TelemetryService.ts +59 -0
package/src/utils/UpdateCheckTracker.ts +86 -0
package/src/utils/adoUtils.ts +293 -0
package/src/utils/clientUtils.ts +72 -0
package/src/utils/feedUtils.ts +31 -0
package/src/utils/githubAuth.ts +212 -0
package/src/utils/githubUtils.ts +164 -0
package/src/utils/logger.ts +195 -0
package/src/utils/macroExpressionUtils.ts +104 -0
package/src/utils/osUtils.ts +700 -0
package/src/utils/versionUtils.ts +114 -0
package/src/web/contract/serverContract.ts +74 -0
package/src/web/public/css/detailsWidget.css +235 -0
package/src/web/public/css/modal.css +757 -0
package/src/web/public/css/notifications.css +101 -0
package/src/web/public/css/onboard.css +107 -0
package/src/web/public/css/serverCategoryList.css +120 -0
package/src/web/public/css/serverDetails.css +139 -0
package/src/web/public/index.html +359 -0
package/src/web/public/js/api.js +132 -0
package/src/web/public/js/detailsWidget.js +264 -0
package/src/web/public/js/flights/flights.js +127 -0
package/src/web/public/js/modal/index.js +52 -0
package/src/web/public/js/modal/installModal.js +162 -0
package/src/web/public/js/modal/installation.js +266 -0
package/src/web/public/js/modal/loadingModal.js +182 -0
package/src/web/public/js/modal/modalSetup.js +595 -0
package/src/web/public/js/modal/modalUtils.js +37 -0
package/src/web/public/js/modal/versionUtils.js +20 -0
package/src/web/public/js/modal.js +42 -0
package/src/web/public/js/notifications.js +137 -0
package/src/web/public/js/onboard/formProcessor.js +1037 -0
package/src/web/public/js/onboard/index.js +374 -0
package/src/web/public/js/onboard/publishHandler.js +172 -0
package/src/web/public/js/onboard/state.js +76 -0
package/src/web/public/js/onboard/templates.js +342 -0
package/src/web/public/js/onboard/uiHandlers.js +1076 -0
package/src/web/public/js/onboard/validationHandlers.js +493 -0
package/src/web/public/js/serverCategoryDetails.js +364 -0
package/src/web/public/js/serverCategoryList.js +241 -0
package/src/web/public/js/settings.js +314 -0
package/src/web/public/modal.html +84 -0
package/src/web/public/onboard.html +296 -0
package/src/web/public/settings.html +135 -0
package/src/web/public/styles.css +277 -0
package/src/web/server.ts +478 -0
package/tsconfig.json +18 -0
package/wiki/Installation.md +3 -0
package/wiki/Publish.md +3 -0
package/dist/cli/commands/install.js.map +0 -1
package/dist/cli/commands/list.js.map +0 -1
package/dist/cli/commands/pull.js.map +0 -1
package/dist/cli/commands/serve.js.map +0 -1
package/dist/cli/commands/start.js.map +0 -1
package/dist/cli/commands/sync.js.map +0 -1
package/dist/cli/commands/uninstall.js.map +0 -1
package/dist/cli/index.js.map +0 -1
package/dist/core/ConfigurationLoader.js.map +0 -1
package/dist/core/ConfigurationProvider.js.map +0 -1
package/dist/core/InstallationService.js.map +0 -1
package/dist/core/MCPManager.js.map +0 -1
package/dist/core/RequirementService.js.map +0 -1
package/dist/core/ServerSchemaLoader.js.map +0 -1
package/dist/core/ServerSchemaProvider.js.map +0 -1
package/dist/core/constants.js.map +0 -1
package/dist/core/installers/BaseInstaller.js.map +0 -1
package/dist/core/installers/ClientInstaller.js.map +0 -1
package/dist/core/installers/CommandInstaller.js.map +0 -1
package/dist/core/installers/GeneralInstaller.js.map +0 -1
package/dist/core/installers/InstallerFactory.js.map +0 -1
package/dist/core/installers/NpmInstaller.js.map +0 -1
package/dist/core/installers/PipInstaller.js.map +0 -1
package/dist/core/installers/RequirementInstaller.js.map +0 -1
package/dist/core/installers/clients/BaseClientInstaller.js.map +0 -1
package/dist/core/installers/clients/ClientInstaller.js.map +0 -1
package/dist/core/installers/clients/ClientInstallerFactory.js.map +0 -1
package/dist/core/installers/clients/ClineInstaller.js.map +0 -1
package/dist/core/installers/clients/ExtensionInstaller.js.map +0 -1
package/dist/core/installers/clients/GithubCopilotInstaller.js.map +0 -1
package/dist/core/installers/clients/MSRooCodeInstaller.js.map +0 -1
package/dist/core/installers/index.js.map +0 -1
package/dist/core/installers/requirements/BaseInstaller.js.map +0 -1
package/dist/core/installers/requirements/CommandInstaller.js.map +0 -1
package/dist/core/installers/requirements/GeneralInstaller.js.map +0 -1
package/dist/core/installers/requirements/InstallerFactory.js.map +0 -1
package/dist/core/installers/requirements/NpmInstaller.js.map +0 -1
package/dist/core/installers/requirements/NugetInstaller.js.map +0 -1
package/dist/core/installers/requirements/PipInstaller.js.map +0 -1
package/dist/core/installers/requirements/RequirementInstaller.js.map +0 -1
package/dist/core/loaders/ConfigurationLoader.js.map +0 -1
package/dist/core/loaders/ConfigurationProvider.js.map +0 -1
package/dist/core/loaders/InstallOperationManager.js.map +0 -1
package/dist/core/loaders/ServerSchemaLoader.js.map +0 -1
package/dist/core/loaders/ServerSchemaProvider.js.map +0 -1
package/dist/core/loaders/SystemSettingsManager.js.map +0 -1
package/dist/core/metadatas/constants.js.map +0 -1
package/dist/core/metadatas/recordingConstants.js.map +0 -1
package/dist/core/metadatas/types.js.map +0 -1
package/dist/core/onboard/FeedOnboardService.js.map +0 -1
package/dist/core/onboard/OnboardProcessor.js.map +0 -1
package/dist/core/onboard/OnboardStatus.js.map +0 -1
package/dist/core/onboard/OnboardStatusManager.js.map +0 -1
package/dist/core/types.js.map +0 -1
package/dist/core/validators/FeedValidator.js.map +0 -1
package/dist/core/validators/IServerValidator.js.map +0 -1
package/dist/core/validators/SSEServerValidator.js.map +0 -1
package/dist/core/validators/ServerValidatorFactory.js.map +0 -1
package/dist/core/validators/StdioServerValidator.js.map +0 -1
package/dist/index.js.map +0 -1
package/dist/services/InstallRequestValidator.js.map +0 -1
package/dist/services/InstallationService.js.map +0 -1
package/dist/services/MCPManager.js.map +0 -1
package/dist/services/RequirementService.js.map +0 -1
package/dist/services/ServerService.js.map +0 -1
package/dist/services/TelemetryService.js.map +0 -1
package/dist/utils/UpdateCheckTracker.js.map +0 -1
package/dist/utils/adoUtils.js.map +0 -1
package/dist/utils/clientUtils.js.map +0 -1
package/dist/utils/feedUtils.js.map +0 -1
package/dist/utils/githubAuth.js.map +0 -1
package/dist/utils/githubUtils.js.map +0 -1
package/dist/utils/logger.js.map +0 -1
package/dist/utils/macroExpressionUtils.js.map +0 -1
package/dist/utils/osUtils.js.map +0 -1
package/dist/utils/versionUtils.js.map +0 -1
package/dist/web/contract/serverContract.js.map +0 -1
package/dist/web/server.js.map +0 -1

package/src/web/public/onboard.html ADDED Viewed

@@ -0,0 +1,296 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Onboard MCP Category - IMCP</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link href="https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css" rel="stylesheet">
+    <!-- Bootstrap CSS is likely not needed if primarily using Tailwind -->
+    <!-- <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet"> -->
+    <link rel="stylesheet" href="styles.css">
+    <link rel="stylesheet" href="css/onboard.css">
+    <!-- Highlight.js for JSON syntax highlighting -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/styles/default.min.css">
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.9.0/highlight.min.js"></script>
+    <link rel="stylesheet" href="css/modal.css">
+    <link rel="stylesheet" href="css/notifications.css">
+    <script type="module">
+        import flights, { getFlightQueryParameters } from './js/flights/flights.js';
+        if (!flights.enableOnboard) {
+            // Preserve flight params when redirecting
+            window.location.href = `index.html${getFlightQueryParameters()}`;
+        }
+        document.addEventListener('DOMContentLoaded', () => {
+            const flightQueryString = getFlightQueryParameters();
+            const backToServerLink = document.querySelector('a[href="index.html"]');
+            if (backToServerLink) {
+                backToServerLink.href = `index.html${flightQueryString}`;
+            }
+            // Update cancel buttons in forms
+            const cancelButtons = document.querySelectorAll('button[onclick="window.location.href=\'index.html\'"]');
+            cancelButtons.forEach(button => {
+                button.onclick = () => { window.location.href = `index.html${flightQueryString}`; };
+            });
+            const jsonEditorCancelButton = document.querySelector('#jsonEditorActionsContainer button[onclick="window.location.href=\'index.html\'"]');
+             if (jsonEditorCancelButton) {
+                jsonEditorCancelButton.onclick = () => { window.location.href = `index.html${flightQueryString}`; };
+            }
+        });
+    </script>
+</head>
+<body class="bg-gray-50 min-h-screen">
+    <div class="alert-container"></div>
+    <div class="container mx-auto px-4 py-6">
+        <div class="flex items-center justify-between mb-8">
+            <h1 class="text-3xl font-bold text-gray-900 flex items-center">
+                <i class='bx bx-server mr-3 text-blue-600'></i>
+                Publish MCP Server
+            </h1>
+            <a href="index.html" class="text-gray-600 hover:text-gray-900 flex items-center">
+                <i class='bx bx-arrow-back mr-2'></i>
+                Server List
+            </a>
+        </div>
+        <div class="bg-white rounded-xl shadow-sm border border-gray-100 p-6 max-w-6xl mx-auto">
+            <!-- Tab Navigation -->
+            <div class="mb-6 border-b border-gray-200">
+                <nav class="flex space-x-8" aria-label="Tabs">
+                    <button id="tab-create-category" class="py-2 px-4 text-blue-600 border-b-2 border-blue-600 font-semibold focus:outline-none" type="button">
+                        Add New Server Category
+                    </button>
+                    <button id="tab-create-server" class="py-2 px-4 text-gray-600 border-b-2 border-transparent hover:text-blue-600 hover:border-blue-600 font-semibold focus:outline-none" type="button">
+                        Add New Server in Existing Category
+                    </button>
+                </nav>
+                <!-- View Mode Toggle Switch -->
+                <div class="flex justify-end mt-2 mb-4">
+                    <label for="viewModeToggle" class="flex items-center cursor-pointer">
+                        <span class="mr-3 text-sm font-medium text-gray-700">Form View</span>
+                        <div class="relative">
+                            <input type="checkbox" id="viewModeToggle" class="sr-only peer">
+                            <div class="w-10 h-6 bg-gray-200 rounded-full peer peer-focus:ring-2 peer-focus:ring-blue-300 peer-checked:bg-blue-600 peer-checked:after:translate-x-full peer-checked:after:border-white after:content-[''] after:absolute after:top-0.5 after:left-[2px] after:bg-white after:border-gray-300 after:border after:rounded-full after:h-5 after:w-5 after:transition-all"></div>
+                        </div>
+                        <span class="ml-3 text-sm font-medium text-gray-700">JSON View</span>
+                    </label>
+                </div>
+            </div>
+            <!-- Tab Panels -->
+            <div id="panel-create-category">
+                <form id="onboardForm" class="space-y-6">
+                    <!-- Basic Information -->
+                    <div class="space-y-4">
+                        <h2 onclick="toggleSectionContent('basicInformationContent', this.querySelector('.toggle-icon'))" class="text-xl font-semibold text-gray-900 flex items-center justify-between mb-4 cursor-pointer">
+                            <span class="flex items-center">
+                                <i class='bx bx-info-circle mr-2 text-blue-600'></i>
+                                Basic Information
+                            </span>
+                            <i class='bx bx-chevron-down toggle-icon text-xl text-gray-500'></i>
+                        </h2>
+                        <div id="basicInformationContent" class="grid grid-cols-1 md:grid-cols-2 gap-4 p-6 bg-white rounded-lg border border-gray-200 shadow-sm">
+                            <div>
+                                <label class="block text-sm font-medium text-gray-700 mb-1">Category Name*</label>
+                                <input type="text" name="name" required
+                                    class="w-full px-3 py-1.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+                                    placeholder="e.g., ai-coder-tools">
+                            </div>
+                            <div>
+                                <label class="block text-sm font-medium text-gray-700 mb-1">Display Name*</label>
+                                <input type="text" name="displayName" required
+                                    class="w-full px-3 py-1.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+                                    placeholder="e.g., Coder Tools">
+                            </div>
+                            <div class="md:col-span-2">
+                                <label class="block text-sm font-medium text-gray-700 mb-1">Description*</label>
+                                <textarea name="description" rows="3" required
+                                    class="w-full px-3 py-1.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+                                    placeholder="Describe the purpose and capabilities of this server category"></textarea>
+                            </div>
+                            <div class="md:col-span-2">
+                                <label class="block text-sm font-medium text-gray-700 mb-1">Repository URL</label>
+                                <input type="url" name="repository"
+                                    class="w-full px-3 py-1.5 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+                                    placeholder="e.g., https://github.com/organization/repository">
+                            </div>
+                        </div>
+                    </div>
+                    <!-- MCP Servers -->
+                    <div class="space-y-4">
+                        <div class="flex justify-between items-center mb-4">
+                            <h2 class="text-xl font-semibold text-gray-900 flex items-center">
+                                <i class='bx bx-server mr-2 text-blue-600'></i>
+                                MCP Servers
+                            </h2>
+                            <button type="button" id="addServerBtnNewCategory"
+                                class="px-4 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600 flex items-center text-sm">
+                                <i class='bx bx-plus mr-2'></i>
+                                Add MCP Server
+                            </button>
+                        </div>
+                        <div id="serversList" class="space-y-4">
+                            <!-- Server configurations will be added here dynamically by serverTemplate -->
+                        </div>
+                    </div>
+                    <div class="flex justify-end space-x-4 pt-6 border-t">
+                        <button type="button" onclick="window.location.href='index.html'"
+                            class="px-6 py-2.5 border border-gray-300 rounded-lg text-gray-600 hover:bg-gray-50">
+                            Cancel
+                        </button>
+                        <button type="button" id="validateButtonNewCategory"
+                            class="px-6 py-2.5 bg-green-500 text-white rounded-lg hover:bg-green-600 flex items-center">
+                            <i class='bx bx-check-shield mr-2'></i>
+                            Validate
+                        </button>
+                        <button type="submit" id="publishButtonNewCategory"
+                            class="px-6 py-2.5 bg-blue-600 text-white rounded-lg hover:bg-blue-700 flex items-center">
+                            <i class='bx bxs-cloud-upload mr-2'></i>
+                            Publish
+                        </button>
+                    </div>
+                    <!-- Validation Status Panel -->
+                    <div id="validationStatusPanelNewCategory" class="hidden p-6 bg-gray-50 rounded-lg border border-gray-200">
+                        <h3 onclick="toggleSectionContent('validationStatusContentNewCategory', this.querySelector('.toggle-icon'))" class="cursor-pointer text-lg font-semibold text-gray-800 mb-3 flex items-center justify-between">
+                            <span class="flex items-center">
+                                <i class='bx bx-analyse mr-2 text-blue-600'></i>Validation Status
+                            </span>
+                            <i class='bx bx-chevron-down toggle-icon text-xl text-gray-500'></i>
+                        </h3>
+                        <div id="validationStatusContentNewCategory" class="text-sm text-gray-700 space-y-2">
+                            <!-- Validation messages will be displayed here -->
+                        </div>
+                    </div>
+                </form>
+            </div>
+            <div id="panel-create-server" class="hidden">
+                <form id="onboardServerForm" class="space-y-6">
+                    <!-- Select Existing Category -->
+                    <div class="space-y-4">
+                        <h2 class="text-xl font-semibold text-gray-900 flex items-center mb-4">
+                            <i class='bx bx-category mr-2 text-blue-600'></i>
+                            Select Server Category
+                        </h2>
+                        <select id="existingCategorySelect" name="categoryName" required
+                            class="w-full px-3 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500">
+                            <option value="">Loading categories...</option>
+                        </select>
+                    </div>
+                    <!-- Basic Information (Read-only after category selection) -->
+                    <div id="existingCategoryBasicInfoContainer" class="hidden space-y-4">
+                        <h2 onclick="toggleSectionContent('existingCategoryBasicInformationContent', this.querySelector('.toggle-icon'))" class="text-xl font-semibold text-gray-900 flex items-center justify-between mb-4 cursor-pointer">
+                            <span class="flex items-center">
+                                <i class='bx bx-info-circle mr-2 text-blue-600'></i>
+                                Basic Information (Read-only)
+                            </span>
+                            <i class='bx bx-chevron-down toggle-icon text-xl text-gray-500'></i>
+                        </h2>
+                        <div id="existingCategoryBasicInformationContent" class="grid grid-cols-1 md:grid-cols-2 gap-4 p-6 bg-white rounded-lg border border-gray-200 shadow-sm">
+                            <div>
+                                <label class="block text-sm font-medium text-gray-700 mb-1">Category Name</label>
+                                <input type="text" name="name" readonly class="w-full px-3 py-1.5 border border-gray-300 rounded-lg bg-gray-100 cursor-not-allowed">
+                            </div>
+                            <div>
+                                <label class="block text-sm font-medium text-gray-700 mb-1">Display Name</label>
+                                <input type="text" name="displayName" readonly class="w-full px-3 py-1.5 border border-gray-300 rounded-lg bg-gray-100 cursor-not-allowed">
+                            </div>
+                            <div class="md:col-span-2">
+                                <label class="block text-sm font-medium text-gray-700 mb-1">Description</label>
+                                <textarea name="description" rows="3" readonly class="w-full px-3 py-1.5 border border-gray-300 rounded-lg bg-gray-100 cursor-not-allowed"></textarea>
+                            </div>
+                            <div class="md:col-span-2">
+                                <label class="block text-sm font-medium text-gray-700 mb-1">Repository URL</label>
+                                <input type="url" name="repository" readonly class="w-full px-3 py-1.5 border border-gray-300 rounded-lg bg-gray-100 cursor-not-allowed">
+                            </div>
+                        </div>
+                    </div>
+                    <!-- MCP Servers (Existing read-only, new ones editable) -->
+                    <div id="existingCategoryMcpServersContainer" class="hidden space-y-4">
+                        <div class="flex justify-between items-center mb-4">
+                            <h2 class="text-xl font-semibold text-gray-900 flex items-center">
+                                <i class='bx bx-server mr-2 text-blue-600'></i>
+                                MCP Servers
+                            </h2>
+                            <button type="button" id="addServerToExistingCategoryBtn"
+                                class="px-4 py-2 bg-blue-500 text-white rounded-lg hover:bg-blue-600 flex items-center text-sm">
+                                <i class='bx bx-plus mr-2'></i>
+                                Add MCP Server
+                            </button>
+                        </div>
+                        <div id="existingCategoryServersList" class="space-y-4">
+                            <!-- Server configurations will be added here: existing ones read-only, new ones editable -->
+                        </div>
+                    </div>
+                    <!-- Action Buttons -->
+                    <div class="flex justify-end space-x-4 pt-6 border-t">
+                        <button type="button" onclick="window.location.href='index.html'"
+                            class="px-6 py-2.5 border border-gray-300 rounded-lg text-gray-600 hover:bg-gray-50">
+                            Cancel
+                        </button>
+                        <button type="button" id="validateButtonExistingCategory"
+                            class="px-6 py-2.5 bg-green-500 text-white rounded-lg hover:bg-green-600 flex items-center">
+                            <i class='bx bx-check-shield mr-2'></i>
+                            Validate
+                        </button>
+                        <button type="submit" id="publishButtonExistingCategory"
+                            class="px-6 py-2.5 bg-blue-600 text-white rounded-lg hover:bg-blue-700 flex items-center">
+                            <i class='bx bxs-cloud-upload mr-2'></i>
+                            Publish
+                        </button>
+                    </div>
+                    <!-- Validation Status Panel -->
+                    <div id="validationStatusPanelExistingCategory" class="hidden p-6 bg-gray-50 rounded-lg border border-gray-200">
+                         <h3 onclick="toggleSectionContent('validationStatusContentExistingCategoryTab', this.querySelector('.toggle-icon'))" class="cursor-pointer text-lg font-semibold text-gray-800 mb-3 flex items-center justify-between">
+                            <span class="flex items-center">
+                                <i class='bx bx-analyse mr-2 text-blue-600'></i>Validation Status
+                            </span>
+                            <i class='bx bx-chevron-down toggle-icon text-xl text-gray-500'></i>
+                        </h3>
+                        <div id="validationStatusContentExistingCategoryTab" class="text-sm text-gray-700 space-y-2">
+                            <!-- Validation messages will be displayed here -->
+                        </div>
+                    </div>
+                </form>
+            </div>
+            <!-- JSON Editor Panel -->
+            <div id="panel-json-editor" class="hidden">
+                <h2 class="text-xl font-semibold text-gray-900 flex items-center mb-4">
+                    <i class='bx bx-code-alt mr-2 text-blue-600'></i>
+                    Edit Configuration as JSON
+                </h2>
+                <div class="relative">
+                     <button type="button" onclick="copyJsonToClipboard()" title="Copy JSON to clipboard"
+                        class="absolute top-2 right-2 z-10 px-3 py-1.5 text-xs bg-gray-200 hover:bg-gray-300 text-gray-700 rounded-md flex items-center">
+                        <i class='bx bx-copy mr-1'></i> Copy
+                    </button>
+                    <textarea id="jsonEditorTextarea" rows="20"
+                        class="w-full px-3 py-2 font-mono text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500"
+                        placeholder="JSON configuration will appear here..."></textarea>
+                </div>
+                <div id="jsonEditorActionsContainer" class="flex justify-end space-x-4 pt-6 border-t mt-6">
+                    <!-- "Apply JSON to Form" button removed -->
+                    <button type="button" onclick="window.location.href='index.html'"
+                        class="px-6 py-2.5 border border-gray-300 rounded-lg text-gray-600 hover:bg-gray-50">
+                        Cancel
+                    </button>
+                    <button type="button" id="saveJsonButton"
+                        class="px-6 py-2.5 bg-blue-600 text-white rounded-lg hover:bg-blue-700 flex items-center">
+                        <i class='bx bxs-cloud-upload mr-2'></i>
+                        Publish JSON
+                    </button>
+                </div>
+            </div>
+    </div>
+    <script src="js/onboard/index.js" type="module"></script>
+    <!-- Highlight.js script can be removed if not using <pre><code> for JSON -->
+</body>
+</html>

package/src/web/public/settings.html ADDED Viewed

@@ -0,0 +1,135 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>IMCP System Settings</title>
+    <script src="https://cdn.tailwindcss.com"></script>
+    <link href="https://unpkg.com/boxicons@2.1.4/css/boxicons.min.css" rel="stylesheet">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/css/bootstrap.min.css" rel="stylesheet">
+    <link href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.7.2/font/bootstrap-icons.css" rel="stylesheet">
+    <link rel="stylesheet" href="styles.css">
+    <link rel="stylesheet" href="css/notifications.css">
+    <style>
+        .form-label {
+            font-weight: 600;
+            color: #374151; /* text-gray-700 */
+        }
+        .form-input {
+            border-color: #D1D5DB; /* border-gray-300 */
+            transition: all 0.15s ease-in-out;
+        }
+        .form-input:focus {
+            border-color: #3B82F6; /* focus:border-blue-500 */
+            box-shadow: 0 0 0 0.2rem rgba(59, 130, 246, 0.25); /* focus:ring-blue-200 focus:ring-opacity-50 */
+        }
+        .btn-primary {
+            background-color: #2563EB; /* bg-blue-600 */
+            border-color: #2563EB;
+        }
+        .btn-primary:hover {
+            background-color: #1D4ED8; /* hover:bg-blue-700 */
+            border-color: #1D4ED8;
+        }
+        .btn-secondary {
+            background-color: #6B7280; /* bg-gray-500 */
+            border-color: #6B7280;
+            color: white;
+        }
+        .btn-secondary:hover {
+            background-color: #4B5563; /* hover:bg-gray-600 */
+            border-color: #4B5563;
+        }
+        .toast-container {
+            z-index: 1090; /* Ensure toast is above other elements */
+        }
+    </style>
+</head>
+<body class="bg-gray-50 min-h-screen">
+    <div class="container mx-auto px-4 py-6">
+        <div class="flex items-center justify-between mb-8">
+            <h1 class="text-3xl font-bold text-gray-900 flex items-center">
+                <a href="index.html" class="flex items-center text-gray-900 hover:text-blue-600 transition-colors">
+                    <i class='bx bx-left-arrow-alt mr-3 text-blue-600'></i>
+                    System Settings
+                </a>
+            </h1>
+        </div>
+        <div class="bg-white rounded-xl shadow-sm border border-gray-100 p-6 lg:p-8">
+            <form id="settingsForm">
+                <!-- Paths Section -->
+                <h2 class="text-xl font-semibold text-gray-800 mb-3">Path Configurations</h2>
+                <fieldset class="border border-gray-300 p-4 rounded-md mb-6">
+                    <!-- Python Environments Section -->
+                    <div class="mb-4">
+                        <h3 class="text-lg font-semibold text-gray-800 mb-2">Python Environments</h3>
+                        <div id="pythonEnvsContainer" class="space-y-3 mb-3">
+                            <!-- Python environments will be dynamically added here -->
+                            <p class="text-gray-500" id="pythonEnvsLoadingMsg">Loading Python environments...</p>
+                        </div>
+                        <button type="button" id="addPythonEnvButton" class="btn btn-outline-primary btn-sm mb-4 flex items-center">
+                            <i class='bx bx-plus mr-1'></i>Add Python Environment
+                        </button>
+                    </div>
+                    <!-- Other path configurations -->
+                    <div class="grid grid-cols-1 md:grid-cols-2 gap-6">
+                        <div>
+                            <label for="nodePath" class="form-label block mb-2">Node.js Path</label>
+                            <input type="text" id="nodePath" name="nodePath" class="form-input form-control w-full px-3 py-2 rounded-md" placeholder="e.g., /usr/local/bin/node or C:/Program Files/nodejs/node.exe">
+                        </div>
+                        <div>
+                            <label for="browserPath" class="form-label block mb-2">Browser Executable Path</label>
+                            <input type="text" id="browserPath" name="browserPath" class="form-input form-control w-full px-3 py-2 rounded-md" placeholder="e.g., /usr/bin/google-chrome or C:/Program Files/Google/Chrome/Application/chrome.exe">
+                        </div>
+                    </div>
+                </fieldset>
+                <!-- User Configurations Section -->
+                <div class="flex items-center mb-3">
+                    <h2 class="text-xl font-semibold text-gray-800 mr-2">User Configurations</h2>
+                    <p class="text-sm text-gray-500 flex items-center">
+                        <i class='bx bx-help-circle mr-1 text-gray-400'></i>
+                        Stored and used for mcp server installation environments.
+                    </p>
+                </div>
+                <fieldset class="border border-gray-300 p-4 rounded-md mb-6">
+                    <div id="userConfigurationsContainer" class="space-y-3">
+                        <!-- User configs will be dynamically added here -->
+                        <p class="text-gray-500" id="userConfigLoadingMsg">Loading user configurations...</p>
+                    </div>
+                    <button type="button" id="addUserConfigButton" class="btn btn-outline-primary btn-sm mt-3 flex items-center">
+                        <i class='bx bx-plus mr-1'></i>Add User Configuration
+                    </button>
+                </fieldset>
+                <!-- System Environment Variables Section -->
+                <div class="mb-6">
+                    <h2 class="text-xl font-semibold text-gray-800 mb-2 py-2">System Environment Variables</h2>
+                    <div id="systemEnvironments" class="max-h-96 overflow-y-auto bg-white p-2 rounded-lg border border-gray-200">
+                        <p class="text-gray-500">Loading environment variables...</p>
+                    </div>
+                </div>
+                <div class="flex justify-end gap-4 mt-8">
+                    <button type="button" id="cancelButton" class="btn btn-secondary px-6 py-2.5 rounded-md font-medium">Cancel</button>
+                    <button type="submit" id="setupButton" class="btn btn-primary px-6 py-2.5 rounded-md font-medium flex items-center">
+                        <i class='bx bx-save mr-2'></i>Save Settings
+                    </button>
+                </div>
+            </form>
+        </div>
+    </div>
+    <!-- Toast Notification Container -->
+    <div class="toast-container position-fixed top-0 end-0 p-3">
+        <!-- Toasts will be appended here -->
+    </div>
+    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script>
+    <script src="js/settings.js" type="module"></script>
+</body>
+</html>