imcp 0.0.17 → 0.0.18

package/dist/web/public/js/onboard/formProcessor.js

@@ -172,14 +172,26 @@ export async function submitForm(event, activeTab, currentSelectedCategoryData =
       showToast('No existing category selected or category data is missing.', 'error');
       return;
     }
-    const newServersData = formDataToFeedConfiguration(formElement, true, currentSelectedCategoryData);
 
-    feedConfiguration = JSON.parse(JSON.stringify(currentSelectedCategoryData)); // Deep clone
+    // Get the complete state of servers and their requirements from the current form.
+    // The `true` flag for `forExistingCategoryTab` tells formDataToFeedConfiguration
+    // to only process server data and not category-level fields from this form.
+    // It should return ALL servers currently in this form, including modified adhoc and new ones.
+    const formDerivedData = formDataToFeedConfiguration(formElement, true, currentSelectedCategoryData);
 
-    feedConfiguration.mcpServers = (feedConfiguration.mcpServers || []).concat(newServersData.mcpServers || []);
+    // Start with a deep clone of the original category data (for name, description, etc.)
+    feedConfiguration = JSON.parse(JSON.stringify(currentSelectedCategoryData));
 
+    // Replace the mcpServers list entirely with what was parsed from the form.
+    // This ensures that the list reflects the current state of the form (original read-only, modified adhoc, new).
+    feedConfiguration.mcpServers = formDerivedData.mcpServers || [];
+
+    // Merge requirements: start with original requirements, then add any new ones from the form.
+    // `formDerivedData.requirements` should ideally only contain requirements introduced by
+    // servers in the current form that are not already in `currentSelectedCategoryData.requirements`.
+    // The existing logic for merging requirements seems okay if `formDerivedData.requirements` is correctly populated.
     const existingReqKeys = new Set((feedConfiguration.requirements || []).map(r => `${r.type}|${r.name}|${r.version}`));
-    (newServersData.requirements || []).forEach(newReq => {
+    (formDerivedData.requirements || []).forEach(newReq => {
       const reqKey = `${newReq.type}|${newReq.name}|${newReq.version}`;
       if (!existingReqKeys.has(reqKey)) {
         feedConfiguration.requirements.push(newReq);
@@ -193,7 +205,7 @@ export async function submitForm(event, activeTab, currentSelectedCategoryData =
   }
 
   try {
-    const response = await fetch('/api/categories/onboard', {
+      const response = await fetch('/api/categories/onboard', {
       method: 'POST',
       headers: { 'Content-Type': 'application/json' },
       body: JSON.stringify({
@@ -208,7 +220,7 @@ export async function submitForm(event, activeTab, currentSelectedCategoryData =
     }
 
     const result = await response.json();
-    console.log('Form submitted successfully:', result);
+    // console.log('Form submitted successfully:', result);
     showToast('Form submitted successfully! See console for operation details.', 'success');
   } catch (error) {
     console.error('Error submitting form:', error);
@@ -327,6 +339,15 @@ export function formDataToFeedConfiguration(formElement, forExistingCategoryTab
     mcpServers: []
   };
 
+  let serversListId;
+  if (formElement.id === 'onboardForm') {
+    serversListId = 'serversList';
+  } else if (formElement.id === 'onboardServerForm') {
+    serversListId = 'existingCategoryServersList';
+  } else {
+    console.warn('[formDataToFeedConfiguration] Could not determine serversListId from formElement.id:', formElement.id);
+  }
+
   if (!forExistingCategoryTab) {
     feedConfiguration.name = currentFormData.get('name') || '';
     feedConfiguration.displayName = currentFormData.get('displayName') || '';
@@ -420,8 +441,13 @@ export function formDataToFeedConfiguration(formElement, forExistingCategoryTab
     }
   }
 
-  serverDataMap.forEach(serverRaw => {
+  // console.log('[formDataToFeedConfiguration] serverDataMap keys before processing:', Array.from(serverDataMap.keys())); // DEBUG
+  // console.log('[formDataToFeedConfiguration] serverDataMap size:', serverDataMap.size); // DEBUG
+
+  // Process servers found in the form data (new/adhoc or edited original servers)
+  serverDataMap.forEach((serverRaw, serverIndex) => {
     let mcpServer;
+    // ... (existing logic to build mcpServer from serverRaw)
     if (serverRaw.mode === 'sse') {
       mcpServer = {
         name: serverRaw.name,
@@ -436,7 +462,7 @@ export function formDataToFeedConfiguration(formElement, forExistingCategoryTab
           requirements: []
         }
       };
-    } else {
+    } else { // stdio or other modes
       mcpServer = {
         name: serverRaw.name,
         description: serverRaw.description,
@@ -446,7 +472,7 @@ export function formDataToFeedConfiguration(formElement, forExistingCategoryTab
         installation: {
           command: serverRaw.installation.command,
           args: serverRaw.installation.args || [],
-          env: {}
+          env: {} // Initialize env
         },
         dependencies: {
           requirements: []
@@ -466,7 +492,7 @@ export function formDataToFeedConfiguration(formElement, forExistingCategoryTab
       if (Object.keys(envVars).length > 0) {
         mcpServer.installation.env = envVars;
       } else {
-        delete mcpServer.installation.env;
+        delete mcpServer.installation.env; // Clean up if no env vars
       }
     }
 
@@ -500,6 +526,7 @@ export function formDataToFeedConfiguration(formElement, forExistingCategoryTab
             assetName: reqRaw.registry.local.assetName,
           };
         }
+        // Clean up empty registry objects
         if (fullRequirementConfig.registry.githubRelease && !fullRequirementConfig.registry.githubRelease.repository) delete fullRequirementConfig.registry.githubRelease;
         if (fullRequirementConfig.registry.artifacts && !fullRequirementConfig.registry.artifacts.registryUrl) delete fullRequirementConfig.registry.artifacts;
         if (fullRequirementConfig.registry.local && !fullRequirementConfig.registry.local.localPath) delete fullRequirementConfig.registry.local;
@@ -514,17 +541,103 @@ export function formDataToFeedConfiguration(formElement, forExistingCategoryTab
 
       const reqKey = `${reqRaw.type}|${reqRaw.name}|${reqRaw.version}`;
       if (!globalRequirementsMap.has(reqKey)) {
-        const { order, ...reqConfigForGlobal } = fullRequirementConfig;
+        const { order, ...reqConfigForGlobal } = fullRequirementConfig; // Exclude order for global list
         globalRequirementsMap.set(reqKey, reqConfigForGlobal);
       }
     });
     if (mcpServer.dependencies.requirements.length === 0) {
-      delete mcpServer.dependencies;
+      delete mcpServer.dependencies; // Clean up if no requirements
+    }
+
+    // Attempt to retrieve and add systemTags from the DOM element,
+    // ONLY if we are in the 'Create Server in Existing Category' tab context.
+    // For 'Create New Category' tab, systemTags should not be assigned from DOM.
+    if (formElement.id === 'onboardServerForm' && serversListId) {
+      const selector = `#${serversListId} .server-item[data-index="${serverIndex}"]`;
+      const serverItemElement = document.querySelector(selector);
+      if (serverItemElement && serverItemElement.dataset.systemTags) {
+        try {
+          mcpServer.systemTags = JSON.parse(serverItemElement.dataset.systemTags);
+        } catch (e) {
+          console.error(`[formDataToFeedConfiguration] Error parsing systemTags for server index ${serverIndex} ('${mcpServer.name}') on ${formElement.id}:`, e, serverItemElement.dataset.systemTags);
+          mcpServer.systemTags = { parseError: true };
+        }
+      }
+      // If no dataset.systemTags or not onboardServerForm, mcpServer.systemTags remains undefined.
+    } else {
+      // Ensure systemTags is not carried over if not in the correct context or not present in dataset
+      delete mcpServer.systemTags;
     }
 
     feedConfiguration.mcpServers.push(mcpServer);
   });
 
+
+  // If processing for an existing category, ensure original non-adhoc servers are included
+  // if they weren't picked up by the form (e.g., because they were read-only and disabled).
+  if (forExistingCategoryTab && baseCategoryData && Array.isArray(baseCategoryData.mcpServers)) {
+    baseCategoryData.mcpServers.forEach(originalServer => {
+      // Check if this original server (by name) is already in our processed list.
+      // We use name as the primary identifier for existing servers.
+      const isAlreadyProcessed = feedConfiguration.mcpServers.some(
+        processedServer => processedServer.name === originalServer.name
+      );
+
+      if (!isAlreadyProcessed && (!originalServer.systemTags || originalServer.systemTags.adhoc !== 'true')) {
+        // This original server was not in the form data (likely read-only) and is not adhoc. Add it.
+        // Ensure its requirements are also added to the global list if not already present.
+        feedConfiguration.mcpServers.push(JSON.parse(JSON.stringify(originalServer))); // Add a clone
+
+        if (originalServer.dependencies && Array.isArray(originalServer.dependencies.requirements)) {
+          originalServer.dependencies.requirements.forEach(req => {
+            // We need the full requirement definition for the global map.
+            // This might require looking up the full definition from baseCategoryData.requirements
+            // if originalServer.dependencies.requirements only has name/version/order.
+            // For simplicity here, we assume baseCategoryData.requirements contains full definitions.
+            const originalGlobalReq = baseCategoryData.requirements?.find(
+              gReq => gReq.name === req.name && gReq.type && gReq.version === req.version // Type might not be in server's dep list
+            );
+
+            if (originalGlobalReq) {
+               const reqKey = `${originalGlobalReq.type}|${originalGlobalReq.name}|${originalGlobalReq.version}`;
+               if (!globalRequirementsMap.has(reqKey)) {
+                   globalRequirementsMap.set(reqKey, JSON.parse(JSON.stringify(originalGlobalReq)));
+               }
+            } else {
+                // Fallback if full definition not found, add what we have, though type might be missing.
+                // This part might need refinement based on actual structure of baseCategoryData.requirements
+                // and how server-specific dependencies link to global ones.
+                // The current server-specific req usually has name, version, order. Type is global.
+                // We need to find the type from the global requirements list.
+                // This logic assumes that if a server has a dependency, its full definition (including type)
+                // must exist in the global `baseCategoryData.requirements`.
+
+                // Let's find the type from baseCategoryData.requirements based on name and version
+                const matchingGlobalReqForType = baseCategoryData.requirements?.find(
+                    gReq => gReq.name === req.name && gReq.version === req.version
+                );
+                if (matchingGlobalReqForType && matchingGlobalReqForType.type) {
+                    const reqKey = `${matchingGlobalReqForType.type}|${req.name}|${req.version}`;
+                    if (!globalRequirementsMap.has(reqKey)) {
+                        // Construct a basic global requirement if not found, though ideally it should exist.
+                        globalRequirementsMap.set(reqKey, {
+                            name: req.name,
+                            version: req.version,
+                            type: matchingGlobalReqForType.type
+                            // Other fields like alias, registry would be missing here if not in matchingGlobalReqForType
+                        });
+                    }
+                } else {
+                    console.warn(`Could not find full global requirement definition (or type) for ${req.name} v${req.version} from original server ${originalServer.name}`);
+                }
+            }
+          });
+        }
+      }
+    });
+  }
+
+
   feedConfiguration.requirements = Array.from(globalRequirementsMap.values());
 
   // Validate the entire configuration
@@ -668,47 +781,95 @@ export function populateForm(feedConfig, formId = 'onboardForm', renderServersAs
   clearEnvCountersForTab(serversListId);
   clearServerRequirementCountersForTab(serversListId);
 
-  (feedConfig.mcpServers || []).forEach((server) => {
+  (feedConfig.mcpServers || []).forEach((serverData) => { // Renamed 'server' to 'serverData' for clarity
     // Get the correct current index for this tab before adding the server
     const currentServerIndex = getServerCounter(serversListId);
     // window.addServer will increment the counter for serversListId internally
-    window.addServer(serversListId, renderServersAsReadOnly, server);
-
+    // It also returns the server item, but we'll query it again for safety after DOM manipulation.
+    window.addServer(serversListId, renderServersAsReadOnly, serverData);
+
+    // After addServer, the server item should exist in the DOM.
+    const serverItem = currentForm.querySelector(`#${serversListId} .server-item[data-index="${currentServerIndex}"]`);
+
+    if (serverItem) {
+      if (formId === 'onboardServerForm') {
+        if (serverData.systemTags?.adhoc === "true") {
+          // Case 1: JSON data explicitly marks it as adhoc. Respect this.
+          serverItem.dataset.systemTags = JSON.stringify(serverData.systemTags);
+          // console.log(`[populateForm] Server ${serverData.name || currentServerIndex} in ${formId} retains adhoc status from JSON.`);
+        } else {
+          // Case 2: JSON data does NOT explicitly mark it adhoc.
+          // Check if it was an original server from the category.
+          // state.originalServerNamesForFormPopulation is set when toggling from JSON to Form view for an existing category.
+          if (state.originalServerNamesForFormPopulation && serverData.name && state.originalServerNamesForFormPopulation.has(serverData.name)) {
+            // It's an original server from the category, now treated as adhoc because it passed through JSON view.
+            serverItem.dataset.systemTags = JSON.stringify({ adhoc: "true" });
+            // console.log(`[populateForm] Original server ${serverData.name} in ${formId} marked as adhoc after JSON view.`);
+          } else {
+            // It's a new server (not in original list) and JSON didn't mark it adhoc.
+            // Or, it's an original server but its JSON representation explicitly removed/lacked adhoc tag.
+            // Ensure it's NOT adhoc.
+            // If serverData.systemTags exists but doesn't have adhoc:true, preserve those other tags.
+            if (serverData.systemTags && Object.keys(serverData.systemTags).length > 0) {
+                const newTags = { ...serverData.systemTags };
+                delete newTags.adhoc; // Ensure adhoc is not true
+                if (Object.keys(newTags).length > 0) {
+                    serverItem.dataset.systemTags = JSON.stringify(newTags);
+                } else {
+                    delete serverItem.dataset.systemTags;
+                }
+            } else {
+                delete serverItem.dataset.systemTags;
+            }
+            // console.log(`[populateForm] Server ${serverData.name || currentServerIndex} in ${formId} is NOT marked adhoc.`);
+          }
+        }
+      } else {
+        // For 'onboardForm' (Create Category tab), or if serverData had systemTags not making it adhoc.
+        // If serverData has systemTags, reflect them. Otherwise, ensure no systemTags.
+        if (serverData.systemTags) {
+          serverItem.dataset.systemTags = JSON.stringify(serverData.systemTags);
+        } else {
+          delete serverItem.dataset.systemTags;
+        }
+      }
+    }
+    // Continue with populating fields using serverData
     const serverNameInput = currentForm.querySelector(`[name="servers[${currentServerIndex}].name"]`);
-    if (serverNameInput) serverNameInput.value = server.name || '';
+    if (serverNameInput) serverNameInput.value = serverData.name || '';
 
     const modeInput = currentForm.querySelector(`[name="servers[${currentServerIndex}].mode"]`);
     if (modeInput) {
-      modeInput.value = server.mode || 'stdio';
+      modeInput.value = serverData.mode || 'stdio';
       if (typeof window.renderInstallationConfig === 'function') {
-        window.renderInstallationConfig(currentServerIndex, serversListId, server.mode || 'stdio', renderServersAsReadOnly, server.installation);
+        window.renderInstallationConfig(currentServerIndex, serversListId, serverData.mode || 'stdio', renderServersAsReadOnly, serverData.installation);
       }
     }
     const descInput = currentForm.querySelector(`[name="servers[${currentServerIndex}].description"]`);
-    if (descInput) descInput.value = server.description || '';
+    if (descInput) descInput.value = serverData.description || '';
 
-    if (server.schemas) {
+    if (serverData.schemas) {
       const schemaPathEl = document.getElementById(`schema-path-${currentServerIndex}`);
-      if (schemaPathEl) schemaPathEl.value = server.schemas;
+      if (schemaPathEl) schemaPathEl.value = serverData.schemas;
     }
-    if (server.repository) {
+    if (serverData.repository) {
       const repoInput = currentForm.querySelector(`[name="servers[${currentServerIndex}].repository"]`);
-      if (repoInput) repoInput.value = server.repository;
+      if (repoInput) repoInput.value = serverData.repository;
     }
 
-    if (server.installation) {
-      if (server.mode === 'sse') {
+    if (serverData.installation) {
+      if (serverData.mode === 'sse') {
         const urlInput = currentForm.querySelector(`[name="servers[${currentServerIndex}].installation.url"]`);
-        if (urlInput) urlInput.value = server.installation.url || '';
+        if (urlInput) urlInput.value = serverData.installation.url || '';
       } else {
         const cmdInput = currentForm.querySelector(`[name="servers[${currentServerIndex}].installation.command"]`);
-        if (cmdInput) cmdInput.value = server.installation.command || '';
-        if (server.installation.args && Array.isArray(server.installation.args)) {
+        if (cmdInput) cmdInput.value = serverData.installation.command || '';
+        if (serverData.installation.args && Array.isArray(serverData.installation.args)) {
           const argsInput = currentForm.querySelector(`[name="servers[${currentServerIndex}].installation.args"]`);
-          if (argsInput) argsInput.value = server.installation.args.join(', ');
+          if (argsInput) argsInput.value = serverData.installation.args.join(', ');
         }
-        if (server.installation.env) {
-          Object.entries(server.installation.env).forEach(([envName, envConfig]) => {
+        if (serverData.installation.env) {
+          Object.entries(serverData.installation.env).forEach(([envName, envConfig]) => {
             const currentEnvIndex = window.addEnvVariable(currentServerIndex, serversListId, renderServersAsReadOnly);
 
             const nameInput = currentForm.querySelector(`[name="servers[${currentServerIndex}].installation.env[${currentEnvIndex}].name"]`);
@@ -730,8 +891,12 @@ export function populateForm(feedConfig, formId = 'onboardForm', renderServersAs
       }
     }
 
-    if (server.dependencies && server.dependencies.requirements) {
-      server.dependencies.requirements.forEach((depReq) => {
+    if (serverData.dependencies && serverData.dependencies.requirements) {
+      // Determine if this server's requirements should be effectively read-only
+      const serverIsEffectivelyReadOnlyForReqs = renderServersAsReadOnly && !(serverData.systemTags?.adhoc === 'true');
+      // console.log(`[populateForm] Server: ${serverData.name}, Adhoc: ${serverData.systemTags?.adhoc === 'true'}, renderServersAsReadOnly: ${renderServersAsReadOnly}, Calculated serverIsEffectivelyReadOnlyForReqs: ${serverIsEffectivelyReadOnlyForReqs}`); // DEBUG
+
+      serverData.dependencies.requirements.forEach((depReq) => {
         // Find requirement by name only, as requested.
         const fullReq = (feedConfig.requirements || []).find(r => r.name === depReq.name);
         if (!fullReq) {
@@ -739,7 +904,8 @@ export function populateForm(feedConfig, formId = 'onboardForm', renderServersAs
           return;
         }
 
-        const currentReqIndex = window.addServerRequirement(currentServerIndex, serversListId, renderServersAsReadOnly);
+        // Pass serverIsEffectivelyReadOnlyForReqs to addServerRequirement
+        const currentReqIndex = window.addServerRequirement(currentServerIndex, serversListId, serverIsEffectivelyReadOnlyForReqs);
 
         currentForm.querySelector(`[name="servers[${currentServerIndex}].requirements[${currentReqIndex}].name"]`).value = fullReq.name || '';
         currentForm.querySelector(`[name="servers[${currentServerIndex}].requirements[${currentReqIndex}].type"]`).value = fullReq.type || '';

package/dist/web/public/js/onboard/index.js

@@ -293,11 +293,11 @@ document.addEventListener('DOMContentLoaded', async () => {
   //   addRequirementBtn.addEventListener('click', addRequirement); // addRequirement from uiHandlers.js
   // }
 
-  const addServerBtnNewCategory = document.getElementById('addServerBtn'); // For "Create New Category" tab
+  const addServerBtnNewCategory = document.getElementById('addServerBtnNewCategory'); // For "Create New Category" tab
   if (addServerBtnNewCategory) {
     // addServer in uiHandlers defaults serversListId to 'serversList', which is correct for this button.
     // It also defaults isReadOnly to false.
-    addServerBtnNewCategory.addEventListener('click', () => addServer());
+    addServerBtnNewCategory.addEventListener('click', () => window.addServer('serversList', false, null));
   }
 
   const addServerBtnExistingCategory = document.getElementById('addServerToExistingCategoryBtn'); // For "Create Server in Existing Category" tab

package/dist/web/public/js/onboard/publishHandler.js

@@ -22,6 +22,11 @@ export async function handlePublish(event, activeTab, currentSelectedCategoryDat
     const { panelId, contentId, formId, validateButtonId, publishButtonId } = getElementIdsByTab(activeTab);
 
     const statusContentElement = document.getElementById(contentId);
+    // Ensure the progress toggle listener is attached when handlePublish is called
+    if (typeof ensureProgressToggleListener === 'function') { // Check if imported correctly
+      ensureProgressToggleListener(statusContentElement);
+    }
+  
     const onboardForm = document.getElementById(formId);
     const validateButton = document.getElementById(validateButtonId);
     const publishButton = document.getElementById(publishButtonId);
@@ -48,21 +53,10 @@ export async function handlePublish(event, activeTab, currentSelectedCategoryDat
     if (forExistingCategoryTab && currentSelectedCategoryData) {
         finalFeedConfiguration = JSON.parse(JSON.stringify(currentSelectedCategoryData)); // Deep clone
 
-        // Merge MCP Servers
-        finalFeedConfiguration.mcpServers = (finalFeedConfiguration.mcpServers || []).concat(newServersData.mcpServers || []);
-
-        // Merge Requirements (ensuring uniqueness)
-        const existingReqKeys = new Set((finalFeedConfiguration.requirements || []).map(r => `${r.type}|${r.name}|${r.version}`));
-        (newServersData.requirements || []).forEach(newReq => {
-            const reqKey = `${newReq.type}|${newReq.name}|${newReq.version}`;
-            if (!existingReqKeys.has(reqKey)) {
-                if (!finalFeedConfiguration.requirements) {
-                    finalFeedConfiguration.requirements = [];
-                }
-                finalFeedConfiguration.requirements.push(newReq);
-                existingReqKeys.add(reqKey);
-            }
-        });
+        // Replace MCP Servers and Requirements with the current state from the form (newServersData)
+        // This aligns with the logic in handleValidation
+        finalFeedConfiguration.mcpServers = newServersData.mcpServers || [];
+        finalFeedConfiguration.requirements = newServersData.requirements || [];
     } else {
         finalFeedConfiguration = newServersData;
     }
@@ -87,11 +81,18 @@ export async function handlePublish(event, activeTab, currentSelectedCategoryDat
 
         if (result.success && result.data) {
             updateOperationDisplay(result.data, statusContentElement);
-            const categoryName = result.data.onboardingId || finalFeedConfiguration.name;
+            const categoryName = finalFeedConfiguration.name; // Use the original category name for polling
+            const operationTypeForPolling = 'FULL_ONBOARDING'; // Publish always initiates 'FULL_ONBOARDING'
             const initialStatus = result.data.status;
 
-            if (categoryName && initialStatus !== 'COMPLETED' && initialStatus !== 'FAILED' && initialStatus !== 'succeeded') {
-                pollingIntervalId = setInterval(() => pollOperationStatus(categoryName, contentId, validateButtonId, publishButtonId, 'publish'), POLLING_INTERVAL);
+            if (categoryName && typeof initialStatus === 'string' && initialStatus.toUpperCase() !== 'COMPLETED' && initialStatus.toUpperCase() !== 'FAILED' && initialStatus.toUpperCase() !== 'SUCCEEDED') {
+                pollingIntervalId = setInterval(async () => {
+                    const shouldContinue = await pollOperationStatus(categoryName, contentId, validateButtonId, publishButtonId, 'publish', operationTypeForPolling);
+                    if (!shouldContinue) {
+                        clearInterval(pollingIntervalId);
+                        pollingIntervalId = null;
+                    }
+                }, POLLING_INTERVAL);
             } else {
                 // Restore buttons to their original state fully
                 publishButton.disabled = false;
@@ -100,15 +101,22 @@ export async function handlePublish(event, activeTab, currentSelectedCategoryDat
                 validateButton.disabled = false;
                 validateButton.innerHTML = "<i class='bx bx-check-shield mr-2'></i>Validate";
                 validateButton.classList.remove('opacity-50');
-                if (result.data.status === 'COMPLETED' || result.data.status === 'succeeded') {
+                if (initialStatus.toUpperCase() === 'COMPLETED' || initialStatus.toUpperCase() === 'SUCCEEDED') {
                     showToast(result.data.message || 'Publish successful!', 'success');
-                } else if (result.data.status === 'FAILED') {
+                } else if (initialStatus.toUpperCase() === 'FAILED') {
                     showToast(result.data.errorMessage || result.data.message || 'Publish failed.', 'error');
                 }
             }
         } else {
-            statusContentElement.innerHTML = `<p class="text-red-500">Publish request failed: ${result.error || result.message || 'Unknown error'}</p>`;
-            showToast(result.error || result.message || 'Publish request failed.', 'error');
+            // Handle cases where result.success is false or result.data is missing
+            const errorMessage = (result.data && result.data.message) || result.error || result.message || 'Publish request failed: Unknown error';
+            if (result.data) { // If data is present (even if success is false), update display
+                updateOperationDisplay(result.data, statusContentElement);
+            } else {
+                statusContentElement.innerHTML = `<p class="text-red-500">${errorMessage}</p>`;
+            }
+            showToast(errorMessage, 'error');
+            
             // Restore buttons to their original state fully
             publishButton.disabled = false;
             publishButton.innerHTML = "<i class='bx bx-cloud-upload mr-2'></i>Publish";

package/dist/web/public/js/onboard/templates.js

@@ -10,31 +10,24 @@
  * @returns {string} HTML string for the server item.
  */
 export const serverTemplate = (serverIndex, isReadOnly = false, serverData = null, serversListId = 'serversList') => {
-  const disabledAttr = isReadOnly ? 'disabled' : '';
-  const readOnlyClasses = isReadOnly ? 'bg-gray-100 cursor-not-allowed opacity-70' : '';
-  const hideButtonClass = isReadOnly ? 'hidden' : ''; // Class to hide buttons
+  const isServerAdhoc = serverData?.systemTags?.adhoc === 'true';
+  // Server is fully editable if the category isn't read-only OR if the server itself is adhoc.
+  const makeServerFullyEditable = !isReadOnly || isServerAdhoc;
+  // DEBUG: console.log(`[serverTemplate] ServerIndex: ${serverIndex}, isContextReadOnly(isReadOnly): ${isReadOnly}, isServerAdhoc: ${isServerAdhoc}, makeServerFullyEditable: ${makeServerFullyEditable}, flag for addReq/addEnv: ${!makeServerFullyEditable}`);
 
-  // Determine which serversListId this server belongs to by checking the active tab's form
-  // This is a bit of a hack; ideally, addServer in uiHandlers would pass this.
-  // For now, assume 'serversList' or 'existingCategoryServersList' based on context where addServer is called.
-  // The onclick handlers for removeServer, addServerRequirement, addEnvVariable will need to be updated
-  // in uiHandlers.js to correctly pass the serversListId if they are to be generic.
-  // For now, the template will use the serverIndex, and the global functions will need to know the context.
-  // Let's assume the global functions are called with context from index.js or uiHandlers.js.
-  // The onclicks in the template will call the global functions which are now context-aware.
-  // e.g. onclick="removeServer(${serverIndex}, 'serversList')" - this needs to be dynamic.
-  // For simplicity, let's assume the global functions in uiHandlers.js will determine the active list.
-  // Or, the functions like removeServer are already modified to accept serversListId.
-  // The `addServer` in `uiHandlers.js` is called with `serversListId`.
-  // The buttons here call global functions. These global functions (removeServer, addEnvVariable, etc.)
-  // will need to be aware of the active serversListId.
-  // This can be done by having uiHandlers.js set a global 'activeServersListId' or by modifying
-  // each function to accept it and ensuring the HTML onclicks pass it.
-  // The latter is cleaner. The `onclick` in HTML should be `removeServer(${serverIndex}, 'CURRENT_LIST_ID')`.
-  // This means `uiHandlers.addServer` needs to inject the correct `serversListId` into these onclicks.
+  const disabledAttr = makeServerFullyEditable ? '' : 'disabled';
+  const readOnlyClasses = makeServerFullyEditable ? '' : 'bg-gray-100 cursor-not-allowed opacity-70';
+  
+  // "Remove Server" button should be hidden if the server is NOT fully editable.
+  // A server is fully editable if the context isn't read-only OR if it's an adhoc server.
+  const hideRemoveServerButtonClass = !makeServerFullyEditable ? 'hidden' : '';
+  // Other action buttons (add dependency, add env var) also respect makeServerFullyEditable.
+  const hideActionButtonsClass = !makeServerFullyEditable ? 'hidden' : '';
 
-  // For now, let's keep the onclicks simple and assume uiHandlers.js functions will manage context.
-  // The `action-button-in-server` class is added to buttons that should be hidden in read-only mode.
+
+  // Note: The 'serversListId' parameter is crucial for ensuring that actions (like removeServer, addEnvVariable)
+  // are correctly scoped to the server list in the current tab (e.g., 'serversList' or 'existingCategoryServersList').
+  // The onclick handlers in this template dynamically include this 'serversListId'.
 
   return `
   <div class="server-item p-4 border border-gray-300 rounded-lg mb-6 bg-white shadow" data-index="${serverIndex}">
@@ -43,13 +36,13 @@ export const serverTemplate = (serverIndex, isReadOnly = false, serverData = nul
          aria-expanded="false" aria-controls="${serversListId}-server-content-${serverIndex}"
          onclick="window.toggleSectionContent('${serversListId}-server-content-${serverIndex}', this.querySelector('i.toggle-icon'), this)"
          onkeydown="if(event.key==='Enter' || event.key===' ') { window.toggleSectionContent('${serversListId}-server-content-${serverIndex}', this.querySelector('i.toggle-icon'), this); event.preventDefault(); }">
-        <h3 id="${serversListId}-server-title-${serverIndex}" class="text-lg font-semibold text-gray-800">MCP Server #${serverIndex + 1} ${isReadOnly ? '(Read-only)' : ''}</h3>
-        <div class="flex items-center">
-          <button type="button" onclick="event.stopPropagation(); removeServer(${serverIndex}, '${serversListId}')"
-            class="action-button-in-server p-1.5 text-sm text-red-600 hover:text-red-800 hover:bg-red-50 rounded-md flex items-center mr-2 ${hideButtonClass}" title="Remove Server">
-            <i class='bx bx-trash text-lg'></i>
-          </button>
-          <i class='bx bxs-chevron-down text-xl toggle-icon'></i>
+       <h3 id="${serversListId}-server-title-${serverIndex}" class="text-lg font-semibold text-gray-800">MCP Server #${serverIndex + 1}${isServerAdhoc ? ' <span class="text-sm text-blue-600 ml-1">(Adhoc - Editable)</span>' : ''}</h3>
+       <div class="flex items-center">
+         <button type="button" onclick="event.stopPropagation(); removeServer(${serverIndex}, '${serversListId}')"
+           class="action-button-in-server p-1.5 text-sm text-red-600 hover:text-red-800 hover:bg-red-50 rounded-md flex items-center mr-2 ${hideRemoveServerButtonClass}" title="Remove Server">
+           <i class='bx bx-trash text-lg'></i>
+         </button>
+         <i class='bx bxs-chevron-down text-xl toggle-icon'></i>
         </div>
     </div>
     <div id="${serversListId}-server-content-${serverIndex}" class="collapsible-content server-content-scrollable hidden" role="region" aria-labelledby="${serversListId}-server-title-${serverIndex}">
@@ -77,15 +70,15 @@ export const serverTemplate = (serverIndex, isReadOnly = false, serverData = nul
       </div>
        <div class="md:col-span-2 flex gap-x-4 items-end">
         <div class="flex-grow">
-          <label class="block text-sm font-medium text-gray-700 mb-1">Schema File Path</label>
+          <label class="block text-sm font-medium text-gray-700 mb-1">Schema File Path
+            <span class="text-xs text-gray-500 ml-1" title="Optional for listing available tools, please fill full path of the schema file">
+              <i class='bx bx-info-circle'></i> Optional
+            </span>
+          </label>
           <input type="text" name="servers[${serverIndex}].schemas" id="schema-path-${serverIndex}" ${disabledAttr}
             class="w-full px-3 py-2 text-sm border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 ${readOnlyClasses}"
-            placeholder="e.g., ./schemas/my_server_schema.json">
+            placeholder="e.g., /Users/xxx/schemas/my_server_schema.json">
         </div>
-        <button type="button" onclick="browseLocalSchema(${serverIndex}, '${serversListId}')" ${disabledAttr}
-            class="action-button-in-server px-4 py-2 text-sm bg-gray-100 hover:bg-gray-200 border border-gray-300 rounded-lg whitespace-nowrap ${hideButtonClass} ${isReadOnly ? 'opacity-50 cursor-not-allowed' : ''}">
-            Browse Local
-        </button>
         </div>
       <div class="md:col-span-2">
         <label class="block text-sm font-medium text-gray-700 mb-1">Repository URL</label>
@@ -109,8 +102,8 @@ export const serverTemplate = (serverIndex, isReadOnly = false, serverData = nul
         <div id="server-requirements-list-${serverIndex}" class="space-y-4">
             <!-- Server requirements will be populated here by serverRequirementTemplate -->
         </div>
-        <button type="button" onclick="addServerRequirement(${serverIndex}, '${serversListId}', ${isReadOnly})"
-            class="action-button-in-server mt-3 px-3 py-1.5 text-sm border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-100 flex items-center ${hideButtonClass}">
+        <button type="button" onclick="addServerRequirement(${serverIndex}, '${serversListId}', ${!makeServerFullyEditable})"
+            class="action-button-in-server mt-3 px-3 py-1.5 text-sm border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-100 flex items-center ${hideActionButtonsClass}">
             <i class='bx bx-plus mr-1'></i> Add Dependency
         </button>
       </div>
@@ -147,8 +140,8 @@ export const serverTemplate = (serverIndex, isReadOnly = false, serverData = nul
         <div id="envVarsContainer_${serverIndex}" class="space-y-3">
           <!-- Environment variables will be added here by envVariableTemplate -->
         </div>
-        <button type="button" onclick="addEnvVariable(${serverIndex}, '${serversListId}', ${isReadOnly})"
-          class="action-button-in-server mt-3 px-3 py-1.5 text-sm border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-100 flex items-center ${hideButtonClass}">
+        <button type="button" onclick="addEnvVariable(${serverIndex}, '${serversListId}', ${!makeServerFullyEditable})"
+          class="action-button-in-server mt-3 px-3 py-1.5 text-sm border border-gray-300 rounded-lg text-gray-700 hover:bg-gray-100 flex items-center ${hideActionButtonsClass}">
           <i class='bx bx-plus mr-1'></i> Add Environment Variable
         </button>
       </div>
@@ -217,6 +210,7 @@ export const envVariableTemplate = (serverIndex, envIndex, isReadOnly = false, s
  * @returns {string} HTML string for the server requirement item.
  */
 export const serverRequirementTemplate = (serverIndex, reqIndex, isReadOnly = false, serversListId = 'serversList') => {
+  // DEBUG: console.log(`[serverRequirementTemplate] ServerIndex: ${serverIndex}, ReqIndex: ${reqIndex}, isReadOnly received: ${isReadOnly}`);
   const disabledAttr = isReadOnly ? 'disabled' : '';
   const readOnlyClasses = isReadOnly ? 'bg-gray-100 cursor-not-allowed opacity-70' : '';
   const hideButtonClass = isReadOnly ? 'hidden' : '';