feat(webui): remove affordance for custom registries (MCP-1064)

Add a Remove action to the Repositories page registry selector for
custom/unverified (user-added) registries, the Web UI match for the
DELETE /api/v1/registries/{id} backend path landed in #592.

- Remove (trash) button rendered only on custom/unverified registries;
  built-in official/trusted registries offer no removal.
- Confirms before removing, noting that upstream servers already added
  from the source are unaffected; refreshes the registry list on success
  and drops the removed source from the active selection.
- New api.removeRegistrySource() mirrors the addRegistrySource
  structured-error pattern, mapping registry_not_found (404),
  registry_shadows_builtin (409), and registries_locked (403) to
  actionable messages.
- Docs: document the Web UI remove surface in docs/registries.md.

Related #592

Author: Dumbris

docs/registries.md

@@ -104,10 +104,14 @@ Equivalent surfaces:
 
 - **REST:** `DELETE /api/v1/registries/{id}` → `{ "registry": { … } }` echoing the removed entry.
 - **CLI:** `mcpproxy registry remove <id>`.
+- **Web UI:** the **Repositories** page registry selector shows a **Remove** (trash)
+  action on each **Third-party · unverified** registry only — built-in defaults
+  offer no removal. It confirms first (noting that upstream servers already added
+  from the source are unaffected), then refreshes the list on success.
 
 Errors share a stable code across surfaces: `registry_not_found` (404),
 `registry_shadows_builtin` (409, built-in cannot be removed),
-`registries_locked` (403).
+`registries_locked` (403). The Web UI maps each code to an actionable message.
 
 ### Enterprise: `registries_locked` (stub)
 

frontend/src/services/api.ts

@@ -44,6 +44,18 @@ export interface AddRegistrySourceResult {
   code?: string
 }
 
+// MCP-1064 / MCP-1057: result of removing a *custom/unverified registry source*
+// (DELETE /registries/{id}). Carries the stable error `code`
+// (registry_not_found | registry_shadows_builtin | registries_locked) so the UI
+// can render an actionable message. Removing a source does not touch upstream
+// servers already added from it.
+export interface RemoveRegistrySourceResult {
+  success: boolean
+  registry?: RegistrySummary
+  error?: string
+  code?: string
+}
+
 class APIService {
   private baseUrl = ''
   private apiKey = ''
@@ -730,6 +742,49 @@ class APIService {
     }
   }
 
+  // MCP-1064 / MCP-1057: remove a user-added custom/unverified registry source.
+  // Mirrors the structured-error pattern of addRegistrySource so the UI can
+  // branch on the stable `code` (registry_not_found | registry_shadows_builtin
+  // | registries_locked). Built-in official/trusted registries cannot be
+  // removed (the backend refuses them with registry_shadows_builtin), so the UI
+  // only offers this on custom sources. Removing a source leaves any upstream
+  // servers already added from it untouched.
+  async removeRegistrySource(registryId: string): Promise<RemoveRegistrySourceResult> {
+    const headers: Record<string, string> = {}
+    if (this.apiKey) headers['X-API-Key'] = this.apiKey
+
+    try {
+      const response = await fetch(`${this.baseUrl}/api/v1/registries/${encodeURIComponent(registryId)}`, {
+        method: 'DELETE',
+        headers
+      })
+
+      const payload: any = await response.json().catch(() => ({}))
+
+      if (!response.ok) {
+        if (response.status === 401 || response.status === 403) {
+          // registries_locked is a 403 policy decision, not an auth failure —
+          // only emit the auth-error path for a missing/invalid key.
+          if (payload?.code !== 'registries_locked') {
+            this.emitAuthError(payload?.error || `HTTP ${response.status}`, response.status)
+          }
+        }
+        return {
+          success: false,
+          error: payload?.error || `HTTP ${response.status}: ${response.statusText}`,
+          code: payload?.code
+        }
+      }
+
+      return { success: true, registry: payload?.data?.registry }
+    } catch (error) {
+      return {
+        success: false,
+        error: error instanceof Error ? error.message : 'Unknown error'
+      }
+    }
+  }
+
   // Spec 070 (CN-001): add a server to upstream by *reference* — the server
   // re-derives and validates the config from the registry entry. The client no
   // longer splits install_cmd / chooses protocol (that client-side parsing was

frontend/src/views/Repositories.vue

@@ -46,8 +46,8 @@
                   <button type="button" class="link link-primary text-xs" data-test="registry-select-all" @click="selectAllRegistries">All</button>
                   <button type="button" class="link text-xs" data-test="registry-clear-all" @click="clearRegistries">Clear</button>
                 </li>
-                <li v-for="registry in registries" :key="registry.id">
-                  <label class="label cursor-pointer justify-start gap-3 py-2">
+                <li v-for="registry in registries" :key="registry.id" class="flex flex-row items-center">
+                  <label class="label cursor-pointer justify-start gap-3 py-2 flex-1">
                     <input
                       type="checkbox"
                       class="checkbox checkbox-sm"
@@ -57,6 +57,20 @@
                     />
                     <span class="text-sm">{{ registry.name }}<span v-if="isCustomRegistry(registry)" class="opacity-60"> — unverified</span></span>
                   </label>
+                  <!-- MCP-1064: only custom/unverified (user-added) registries can be removed. -->
+                  <button
+                    v-if="isCustomRegistry(registry)"
+                    type="button"
+                    class="btn btn-ghost btn-xs text-error shrink-0"
+                    :data-test="`registry-remove-${registry.id}`"
+                    :title="`Remove ${registry.name}`"
+                    :aria-label="`Remove ${registry.name}`"
+                    @click.stop.prevent="openRemoveRegistry(registry)"
+                  >
+                    <svg class="w-4 h-4" fill="none" stroke="currentColor" viewBox="0 0 24 24">
+                      <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M19 7l-.867 12.142A2 2 0 0116.138 21H7.862a2 2 0 01-1.995-1.858L5 7m5 4v6m4-6v6m1-10V4a1 1 0 00-1-1h-4a1 1 0 00-1 1v3M4 7h16" />
+                    </svg>
+                  </button>
                 </li>
               </ul>
             </div>
@@ -436,6 +450,52 @@
       </form>
     </dialog>
 
+    <!-- Remove custom registry confirmation (MCP-1064) -->
+    <dialog :open="removeTarget !== null" class="modal" data-test="registry-remove-dialog">
+      <div class="modal-box">
+        <h3 class="font-bold text-lg">Remove registry</h3>
+        <div class="text-sm py-3 space-y-2">
+          <p>
+            Remove the custom registry
+            <strong>{{ removeTarget?.name || removeTarget?.id }}</strong>
+            from your discovery sources?
+          </p>
+          <p class="text-base-content/70">
+            This only removes the source. Upstream servers you already added from it
+            stay configured and are not affected.
+          </p>
+        </div>
+
+        <div v-if="removeError" class="alert alert-error text-sm" data-test="registry-remove-error">
+          <span>{{ removeError }}</span>
+        </div>
+
+        <div class="modal-action">
+          <button
+            type="button"
+            class="btn btn-ghost"
+            data-test="registry-remove-cancel"
+            @click="cancelRemoveRegistry"
+          >
+            Cancel
+          </button>
+          <button
+            type="button"
+            class="btn btn-error"
+            data-test="registry-remove-confirm"
+            :disabled="removingRegistry"
+            @click="confirmRemoveRegistry"
+          >
+            <span v-if="removingRegistry" class="loading loading-spinner loading-xs"></span>
+            <span v-else>Remove</span>
+          </button>
+        </div>
+      </div>
+      <form method="dialog" class="modal-backdrop">
+        <button @click="cancelRemoveRegistry">close</button>
+      </form>
+    </dialog>
+
     <!-- Success Toast -->
     <div v-if="showSuccessToast" class="toast toast-end" data-test="registry-add-success">
       <div class="alert alert-success">
@@ -494,6 +554,12 @@ const addRegistryError = ref<string | null>(null)
 const addingRegistry = ref(false)
 const showThirdPartyWarning = ref(false)
 
+// Remove-custom-registry state (MCP-1064). removeTarget !== null drives the
+// confirmation dialog; only custom/unverified registries are ever offered here.
+const removeTarget = ref<Registry | null>(null)
+const removingRegistry = ref(false)
+const removeError = ref<string | null>(null)
+
 let searchDebounceTimer: ReturnType<typeof setTimeout> | null = null
 
 // A registry is "custom/unverified" (third-party) when its provenance says so,
@@ -889,6 +955,66 @@ async function doAddRegistry() {
   }
 }
 
+// --- Remove custom registry source (MCP-1064 / backend MCP-1057) ---
+
+function openRemoveRegistry(registry: Registry) {
+  removeTarget.value = registry
+  removeError.value = null
+}
+
+function cancelRemoveRegistry() {
+  if (removingRegistry.value) return
+  removeTarget.value = null
+  removeError.value = null
+}
+
+// Map the backend's stable remove error codes to actionable messages.
+function removeRegistryErrorMessage(code: string | undefined, fallback: string | undefined): string {
+  switch (code) {
+    case 'registry_not_found':
+      return 'That registry no longer exists — it may have already been removed.'
+    case 'registry_shadows_builtin':
+      return 'Built-in registries cannot be removed.'
+    case 'registries_locked':
+      return 'Removing registries is locked by an administrator on this instance.'
+    default:
+      return fallback || 'Failed to remove registry.'
+  }
+}
+
+async function confirmRemoveRegistry() {
+  const target = removeTarget.value
+  if (!target || removingRegistry.value) return
+
+  removingRegistry.value = true
+  removeError.value = null
+
+  try {
+    const result = await api.removeRegistrySource(target.id)
+
+    if (result.success) {
+      // Drop it from the active selection so we stop searching a now-gone
+      // source, then refresh the list so the entry disappears. Re-search only
+      // when it had been selected, to avoid clobbering current results.
+      const wasSelected = selectedRegistries.value.includes(target.id)
+      if (wasSelected) {
+        selectedRegistries.value = selectedRegistries.value.filter(id => id !== target.id)
+      }
+      removeTarget.value = null
+      await loadRegistries()
+      if (wasSelected) handleRegistryChange()
+      showToast(`Removed registry "${target.name || target.id}". Servers already added from it are unaffected.`)
+      return
+    }
+
+    removeError.value = removeRegistryErrorMessage(result.code, result.error)
+  } catch (err) {
+    removeError.value = 'Failed to remove registry: ' + (err as Error).message
+  } finally {
+    removingRegistry.value = false
+  }
+}
+
 function copyToClipboard(text: string) {
   navigator.clipboard.writeText(text)
   showToast('Installation command copied to clipboard!')

frontend/tests/unit/registry-remove-source.spec.ts

@@ -0,0 +1,110 @@
+import { describe, it, expect, beforeEach, afterEach, vi } from 'vitest'
+import api from '@/services/api'
+
+// MCP-1064 (follows MCP-1057 backend remove path): the Web UI removes a
+// *custom/unverified* registry source through DELETE /api/v1/registries/{id}.
+// The client surfaces the slim RegistrySummary on success and exposes the
+// stable cross-surface error `code` (registry_not_found | registry_shadows_builtin
+// | registries_locked) so the UI can render an actionable message. Removing a
+// source does NOT touch upstream servers already added from it.
+
+describe('api.removeRegistrySource', () => {
+  beforeEach(() => {
+    api.setAPIKey('test-key')
+  })
+
+  afterEach(() => {
+    vi.restoreAllMocks()
+    api.clearAPIKey()
+  })
+
+  it('DELETEs the encoded registry id and returns the removed registry summary', async () => {
+    const fetchMock = vi.fn().mockResolvedValue({
+      ok: true,
+      status: 200,
+      json: async () => ({
+        success: true,
+        data: {
+          registry: {
+            id: 'acme-registry',
+            name: 'Acme Registry',
+            url: 'https://acme.example/registry',
+            provenance: 'custom/unverified',
+            trusted: false
+          }
+        },
+        request_id: 'req-1'
+      })
+    })
+    vi.stubGlobal('fetch', fetchMock)
+
+    const result = await api.removeRegistrySource('acme-registry')
+
+    expect(result.success).toBe(true)
+    expect(result.registry?.id).toBe('acme-registry')
+    expect(result.registry?.provenance).toBe('custom/unverified')
+
+    const [calledUrl, calledInit] = fetchMock.mock.calls[0]
+    expect(calledUrl).toBe('/api/v1/registries/acme-registry')
+    expect(calledInit.method).toBe('DELETE')
+    expect((calledInit.headers as Record<string, string>)['X-API-Key']).toBe('test-key')
+  })
+
+  it('percent-encodes a namespaced registry id in the path', async () => {
+    const fetchMock = vi.fn().mockResolvedValue({
+      ok: true,
+      status: 200,
+      json: async () => ({ success: true, data: { registry: { id: 'acme/inc' } } })
+    })
+    vi.stubGlobal('fetch', fetchMock)
+
+    await api.removeRegistrySource('acme/inc')
+
+    expect(fetchMock.mock.calls[0][0]).toBe('/api/v1/registries/acme%2Finc')
+  })
+
+  it('surfaces registry_not_found (404) as a structured error', async () => {
+    const fetchMock = vi.fn().mockResolvedValue({
+      ok: false,
+      status: 404,
+      statusText: 'Not Found',
+      json: async () => ({ success: false, error: 'no such registry', code: 'registry_not_found' })
+    })
+    vi.stubGlobal('fetch', fetchMock)
+
+    const result = await api.removeRegistrySource('ghost')
+
+    expect(result.success).toBe(false)
+    expect(result.code).toBe('registry_not_found')
+  })
+
+  it('surfaces registry_shadows_builtin (409 — built-in cannot be removed)', async () => {
+    const fetchMock = vi.fn().mockResolvedValue({
+      ok: false,
+      status: 409,
+      statusText: 'Conflict',
+      json: async () => ({ success: false, error: 'built-in registry', code: 'registry_shadows_builtin' })
+    })
+    vi.stubGlobal('fetch', fetchMock)
+
+    const result = await api.removeRegistrySource('official')
+
+    expect(result.success).toBe(false)
+    expect(result.code).toBe('registry_shadows_builtin')
+  })
+
+  it('surfaces registries_locked (403) without emitting an auth error', async () => {
+    const fetchMock = vi.fn().mockResolvedValue({
+      ok: false,
+      status: 403,
+      statusText: 'Forbidden',
+      json: async () => ({ success: false, error: 'locked', code: 'registries_locked' })
+    })
+    vi.stubGlobal('fetch', fetchMock)
+
+    const result = await api.removeRegistrySource('acme')
+
+    expect(result.success).toBe(false)
+    expect(result.code).toBe('registries_locked')
+  })
+})