feat(backend): add installation_type field for OAuth installations

Lasim · Lasim · commit c79f52a98679 · 2025-11-21T21:07:49.000+01:00
diff --git a/services/backend/api-spec.json b/services/backend/api-spec.json
@@ -23950,14 +23950,23 @@
                     "maxLength": 100,
                     "description": "Custom name for this installation (optional)"
                   },
+                  "installation_type": {
+                    "type": "string",
+                    "enum": [
+                      "global",
+                      "team"
+                    ],
+                    "description": "Installation type - required for OAuth installations"
+                  },
                   "team_config": {
                     "type": "object",
                     "additionalProperties": true,
                     "description": "Team-level configuration for installation (optional)"
                   }
                 },
                 "required": [
-                  "server_id"
+                  "server_id",
+                  "installation_type"
                 ],
                 "additionalProperties": false
               }
diff --git a/services/backend/api-spec.yaml b/services/backend/api-spec.yaml
@@ -17030,12 +17030,19 @@ paths:
                   minLength: 1
                   maxLength: 100
                   description: Custom name for this installation (optional)
+                installation_type:
+                  type: string
+                  enum:
+                    - global
+                    - team
+                  description: Installation type - required for OAuth installations
                 team_config:
                   type: object
                   additionalProperties: true
                   description: Team-level configuration for installation (optional)
               required:
                 - server_id
+                - installation_type
               additionalProperties: false
         required: true
       parameters:
diff --git a/services/backend/src/routes/mcp/installations/authorize.ts b/services/backend/src/routes/mcp/installations/authorize.ts
@@ -242,7 +242,7 @@ export default async function authorizeRoute(server: FastifyInstance) {
         server_id: mcpServer.id,
         created_by: userId,
         installation_name: body.installation_name || mcpServer.name,
-        installation_type: 'global',
+        installation_type: body.installation_type,
         team_args: null,
         team_env: body.team_config ? JSON.stringify(body.team_config) : null,
         team_headers: null,
diff --git a/services/backend/src/routes/mcp/installations/schemas.ts b/services/backend/src/routes/mcp/installations/schemas.ts
@@ -222,13 +222,18 @@ export const OAUTH_AUTHORIZE_REQUEST_SCHEMA = {
       maxLength: 100,
       description: 'Custom name for this installation (optional)'
     },
+    installation_type: {
+      type: 'string',
+      enum: ['global', 'team'],
+      description: 'Installation type - required for OAuth installations'
+    },
     team_config: {
       type: 'object',
       additionalProperties: true,
       description: 'Team-level configuration for installation (optional)'
     }
   },
-  required: ['server_id'],
+  required: ['server_id', 'installation_type'],
   additionalProperties: false
 } as const;
 
@@ -713,6 +718,7 @@ export interface ClientConfigSuccessResponse {
 export interface OAuthAuthorizeRequest {
   server_id: string;
   installation_name?: string;
+  installation_type: 'global' | 'team';
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
   team_config?: Record<string, any>;
 }
diff --git a/services/frontend/src/components/mcp-server/wizard/McpServerInstallWizard.vue b/services/frontend/src/components/mcp-server/wizard/McpServerInstallWizard.vue
@@ -2,7 +2,7 @@
 /* eslint-disable @typescript-eslint/no-explicit-any */
 import { ref, computed, onMounted, onUnmounted } from 'vue'
 import { useI18n } from 'vue-i18n'
-import { useRoute } from 'vue-router'
+import { useRoute, useRouter } from 'vue-router'
 import { Button } from '@/components/ui/button'
 import { DsProgressSteps, type ProgressStep } from '@/components/ui/ds-progress-steps'
 import { toast } from 'vue-sonner'
@@ -34,6 +34,7 @@ const emit = defineEmits<{
 
 const { t } = useI18n()
 const route = useRoute()
+const router = useRouter()
 const eventBus = useEventBus()
 
 // Form data interface
@@ -97,17 +98,17 @@ const progressSteps = computed<ProgressStep[]>(() => {
   const wizardSteps = [
     {
       id: 1,
+      title: t('mcpInstallations.wizard.steps.selectPlatform'),
+      description: t('mcpInstallations.wizard.platform.helpText')
+    },
+    {
+      id: 2,
       title: requiresOAuth.value
         ? 'OAuth Authorization'
         : t('mcpInstallations.wizard.steps.configureEnvironment'),
       description: requiresOAuth.value
         ? 'Authorize access to your account'
         : t('mcpInstallations.wizard.environment.helpText')
-    },
-    {
-      id: 2,
-      title: t('mcpInstallations.wizard.steps.selectPlatform'),
-      description: t('mcpInstallations.wizard.platform.helpText')
     }
   ]
 
@@ -270,10 +271,16 @@ const submitInstallation = async () => {
     const response = await McpInstallationService.createInstallation(currentTeamId.value, installationData)
 
     if (response.success) {
-      emit('complete', {
-        ...installationData,
-        id: response.data.id
+      // Show success toast
+      toast.success('Installation successful', {
+        description: `${formData.value.server.server_data?.name || 'MCP server'} has been installed.`
       })
+
+      // Emit event to refresh installation list
+      eventBus.emit('mcp-installations-updated')
+
+      // Redirect to installation list
+      router.push('/mcp-server')
     } else {
       throw new Error(response.message || 'Failed to create installation')
     }
@@ -380,8 +387,7 @@ const handleOAuthAuthorization = async () => {
     const authorizationData = {
       server_id: formData.value.server.server_id,
       installation_name: formData.value.server.server_data?.name || 'Unknown Server',
-      team_args: formData.value.environment.team_args,
-      team_env: formData.value.environment.team_env
+      installation_type: formData.value.platform.installation_type
     }
 
     // Call backend to start OAuth flow
@@ -447,27 +453,22 @@ const handleOAuthMessage = (event: MessageEvent) => {
 
   // Handle success message
   if (event.data.type === 'oauth_success') {
-    const { installation_id } = event.data
-
     // Close popup if still open
     if (oauthPopup.value && !oauthPopup.value.closed) {
       oauthPopup.value.close()
     }
     oauthPopup.value = null
 
-    // Store installation_id in platform data
-    formData.value.platform.installation_id = installation_id
-
     // Show success toast
-    toast.success('Authorization successful', {
-      description: `Connected to ${formData.value.server.server_data?.name || 'MCP server'}. Choose your platform to continue.`
+    toast.success('Installation successful', {
+      description: `${formData.value.server.server_data?.name || 'MCP server'} has been installed and connected.`
     })
 
-    // Auto-advance to next step (Platform Selection)
-    currentStep.value++
-
     // Emit event to refresh installation list
     eventBus.emit('mcp-installations-updated')
+
+    // Redirect to installation list
+    router.push('/mcp-server')
   }
 
   // Handle error message
@@ -627,25 +628,13 @@ onUnmounted(() => {
         :completed-steps="completedSteps"
         max-width="max-w-3xl"
       >
-        <!-- Step 1 Content: Environment Variables OR OAuth Authorization -->
+        <!-- Step 1 Content: Platform Selection -->
         <template #step-content-0>
-          <!-- OAuth Authorization Step (if OAuth required) -->
-          <OAuthAuthorizationStep
-            v-if="requiresOAuth"
-            :server-data="formData.server.server_data"
-            :is-authorizing="isSubmitting"
-            @authorize="handleOAuthAuthorization"
-          />
-
-          <!-- Environment Variables Step (if OAuth NOT required) -->
-          <EnvironmentVariablesStep
-            v-else
-            v-model="formData.environment"
-            :server-data="formData.server.server_data"
-            @validation-change="handleValidationChange"
+          <PlatformSelectionStep
+            v-model="formData.platform.installation_type"
           />
 
-          <!-- Navigation Buttons -->
+          <!-- Navigation Buttons for Platform Step -->
           <div class="flex items-center justify-between mt-6">
             <Button variant="outline" @click="previousStep">
               {{ t('navigation.previous') }}
@@ -658,21 +647,33 @@ onUnmounted(() => {
 
               <Button
                 @click="nextStep"
-                :disabled="!canProceedFromEnvironment"
+                :disabled="!formData.platform.installation_type"
               >
                 {{ t('navigation.next') }}
               </Button>
             </div>
           </div>
         </template>
 
-        <!-- Platform Selection Step Content -->
+        <!-- Step 2 Content: Environment Variables OR OAuth Authorization -->
         <template #step-content-1>
-          <PlatformSelectionStep
-            v-model="formData.platform.installation_type"
+          <!-- OAuth Authorization Step (if OAuth required) -->
+          <OAuthAuthorizationStep
+            v-if="requiresOAuth"
+            :server-data="formData.server.server_data"
+            :is-authorizing="isSubmitting"
+            @authorize="handleOAuthAuthorization"
           />
 
-          <!-- Navigation Buttons for Platform Step -->
+          <!-- Environment Variables Step (if OAuth NOT required) -->
+          <EnvironmentVariablesStep
+            v-else
+            v-model="formData.environment"
+            :server-data="formData.server.server_data"
+            @validation-change="handleValidationChange"
+          />
+
+          <!-- Navigation Buttons -->
           <div class="flex items-center justify-between mt-6">
             <Button variant="outline" @click="previousStep">
               {{ t('navigation.previous') }}
@@ -683,7 +684,20 @@ onUnmounted(() => {
                 {{ t('navigation.cancel') }}
               </Button>
 
+              <!-- OAuth: "Authorize & Install" button -->
+              <Button
+                v-if="requiresOAuth"
+                @click="handleOAuthAuthorization"
+                :loading="isSubmitting"
+                :loading-text="t('mcpInstallations.wizard.authorizing')"
+                :disabled="!formData.platform.installation_type"
+              >
+                {{ t('mcpInstallations.wizard.authorizeAndInstall') }}
+              </Button>
+
+              <!-- Non-OAuth: "Install" button -->
               <Button
+                v-else
                 @click="submitInstallation"
                 :disabled="!canSubmit"
                 :loading="isSubmitting"
diff --git a/services/frontend/src/i18n/locales/en/mcp-installations.ts b/services/frontend/src/i18n/locales/en/mcp-installations.ts
@@ -81,6 +81,8 @@ export default {
     description: 'Follow the steps below to install a new MCP server for your team',
     installing: 'Installing...',
     install: 'Install Server',
+    authorizing: 'Authorizing...',
+    authorizeAndInstall: 'Authorize & Install',
 
     steps: {
       selectServer: 'Select Server',
