refactor: remove unnecessary console logs and improve user walkthrough handling

Author: Lasim

services/backend/tsconfig.json

@@ -2,7 +2,6 @@
   "compilerOptions": {
     "target": "ES2022",
     "module": "commonjs",
-    "moduleResolution": "node",
     "outDir": "dist",
     "rootDir": "src",
     "strict": true,

services/frontend/src/components/mcp-server/McpInstallationsList.vue

@@ -159,36 +159,31 @@ const cancelRemoval = () => {
 
 // Event handlers for walkthrough overlay
 const handleWalkthroughOverlayShow = () => {
-  console.log('Showing walkthrough overlay for step 1')
   showWalkthroughOverlay.value = true
   showWalkthroughBorder.value = true
   showWalkthroughHighZIndex.value = true
 }
 
 const handleWalkthroughOverlayHide = () => {
-  console.log('Hiding walkthrough overlay')
   showWalkthroughOverlay.value = false
   showWalkthroughBorder.value = false
   showWalkthroughHighZIndex.value = false
 }
 
 // Event handlers for step-specific z-index control
 const handleWalkthroughStep1Active = () => {
-  console.log('Step 1 active: MCP liste should be visible (high z-index)')
   // Step 1: MCP liste should be visible (high z-index)
   showWalkthroughHighZIndex.value = true
   showWalkthroughBorder.value = true
 }
 
 const handleWalkthroughStep2Active = () => {
-  console.log('Step 2 active: MCP liste should be hidden under overlay (no high z-index)')
   // Step 2: MCP liste should be hidden under overlay (no high z-index)
   showWalkthroughHighZIndex.value = false
   showWalkthroughBorder.value = false
 }
 
 onMounted(() => {
-  console.log('McpInstallationsList mounted - registering walkthrough event listeners')
   // Listen for walkthrough overlay events
   eventBus.on('walkthrough-overlay-show', handleWalkthroughOverlayShow)
   eventBus.on('walkthrough-overlay-hide', handleWalkthroughOverlayHide)

services/frontend/src/components/walkthrough/UserWalkthroughPopover.vue

@@ -95,7 +95,6 @@ const positionTrigger = () => {
         isPositioned.value = true
         isOpen.value = true
         
-        console.log(`Successfully positioned walkthrough popover for step ${props.step}`)
       } else {
         console.warn(`Target element '${props.targetElement}' not found for walkthrough step ${props.step}`)
         return // Stop - no infinite retries
@@ -111,7 +110,6 @@ watch(() => props.open, (newValue) => {
     isPositioned.value = false
     
     // Emit walkthrough step opened event
-    console.log(`Emitting walkthrough-step-opened for step ${props.step}`)
     eventBus.emit('walkthrough-step-opened', { step: props.step })
     // Note: walkthrough-overlay-show and step-specific events are now emitted after positioning
     
@@ -121,7 +119,6 @@ watch(() => props.open, (newValue) => {
       
       // Emit overlay events AFTER positioning to ensure all components are mounted
       setTimeout(() => {
-        console.log(`Emitting walkthrough-overlay-show for step ${props.step} (after positioning)`)
         eventBus.emit('walkthrough-overlay-show')
         
         // Also emit step-specific events with proper timing
@@ -178,7 +175,6 @@ function handleNextStep() {
     closePopover()
   } else {
     // Final step - finish walkthrough
-    console.log('User clicked finish on walkthrough step 2')
     eventBus.emit('walkthrough-finish')
     closePopover()
   }

services/frontend/src/services/globalSettingsService.ts

@@ -1,4 +1,5 @@
 import { getEnv } from '@/utils/env'
+import { UserPreferencesService } from './userPreferencesService'
 
 /**
  * Service for fetching global settings
@@ -50,12 +51,12 @@ export class GlobalSettingsService {
 
   /**
    * Get the user walkthrough visibility setting
+   * Uses user preferences for proper permissions (no 403 errors for normal users)
    */
   static async shouldShowUserWalkthrough(): Promise<boolean> {
     try {
-      const value = await this.getSetting('global.show_user_walkthrough')
-      // Convert string to boolean - 'true' becomes true, anything else becomes false
-      return value === 'true'
+      // Use UserPreferencesService for consistent architecture and proper permissions
+      return await UserPreferencesService.shouldShowWalkthrough()
     } catch (error) {
       console.error('Failed to check user walkthrough setting:', error)
       return false // Default to not showing walkthrough on error

services/frontend/src/services/userPreferencesService.ts

@@ -66,7 +66,6 @@ export class UserPreferencesService {
         throw new Error(data.error || 'Invalid response from server')
       }
 
-      console.log('Successfully fetched user preferences:', data.preferences)
       return data.preferences
 
     } catch (error) {
@@ -80,8 +79,6 @@ export class UserPreferencesService {
    */
   static async updateUserPreferences(updates: UpdateUserPreferencesInput): Promise<UserPreferences> {
     try {
-      console.log('Updating user preferences:', updates)
-
       const response = await fetch(`${this.baseUrl}/api/users/me/preferences`, {
         method: 'POST',
         headers: {
@@ -104,8 +101,6 @@ export class UserPreferencesService {
         throw new Error(data.error || 'Failed to update preferences')
       }
 
-      console.log('Successfully updated user preferences:', data.message)
-      
       // Return updated preferences by fetching them again
       return await this.getUserPreferences()
 
@@ -173,8 +168,6 @@ export class UserPreferencesService {
    */
   static async completeWalkthrough(): Promise<void> {
     try {
-      console.log('Marking walkthrough as completed via API')
-
       const response = await fetch(`${this.baseUrl}/api/users/me/preferences/walkthrough/complete`, {
         method: 'POST',
         headers: {
@@ -196,8 +189,6 @@ export class UserPreferencesService {
         throw new Error(data.error || 'Failed to complete walkthrough')
       }
 
-      console.log('Successfully completed walkthrough:', data.message)
-
     } catch (error) {
       console.error('Error completing walkthrough:', error)
       throw error
@@ -209,8 +200,6 @@ export class UserPreferencesService {
    */
   static async cancelWalkthrough(): Promise<void> {
     try {
-      console.log('Marking walkthrough as cancelled via API')
-
       const response = await fetch(`${this.baseUrl}/api/users/me/preferences/walkthrough/cancel`, {
         method: 'POST',
         headers: {
@@ -232,8 +221,6 @@ export class UserPreferencesService {
         throw new Error(data.error || 'Failed to cancel walkthrough')
       }
 
-      console.log('Successfully cancelled walkthrough:', data.message)
-
     } catch (error) {
       console.error('Error cancelling walkthrough:', error)
       throw error
@@ -308,8 +295,6 @@ export class UserPreferencesService {
    */
   static async acknowledgeNotification(notificationId: string): Promise<void> {
     try {
-      console.log('Acknowledging notification:', notificationId)
-
       const response = await fetch(`${this.baseUrl}/api/users/me/preferences/notifications/acknowledge`, {
         method: 'POST',
         headers: {
@@ -334,8 +319,6 @@ export class UserPreferencesService {
         throw new Error(data.error || 'Failed to acknowledge notification')
       }
 
-      console.log('Successfully acknowledged notification:', data.message)
-
     } catch (error) {
       console.error('Error acknowledging notification:', error)
       throw error

services/frontend/src/views/Logout.vue

@@ -35,20 +35,16 @@ const message = ref(t('logout.inProgressMessage'))
 onMounted(async () => {
   isLoading.value = true;
   message.value = t('logout.inProgressMessage');
-  console.log('Attempting to logout from backend...');
-
   try {
     // Use the UserService logout method which handles cache clearing
     await UserService.logout();
-    console.log('Logout successful');
     message.value = t('logout.successMessage') || t('logout.inProgressMessage');
   } catch (error) {
     console.error('Error during logout:', error);
     message.value = t('common.error');
   } finally {
     isLoading.value = false;
     setTimeout(() => {
-      console.log('Redirecting to login page...');
       router.push('/login');
     }, 2000); // Redirect after 2 seconds to allow user to see final message
   }

services/frontend/src/views/admin/mcp-server-catalog/edit/[id].vue

@@ -236,7 +236,6 @@ const handleSubmit = async (formData: McpServerFormData) => {
       const newEnvSchemaItems: any[] = []
       envVarsFromInstallation.forEach(envVarName => {
         if (!allExistingEnvNames.includes(envVarName)) {
-          console.log('Edit[id].vue: Auto-adding missing env var to team_env_schema:', envVarName)
           newEnvSchemaItems.push({
             name: envVarName,
             type: 'string',
@@ -247,7 +246,6 @@ const handleSubmit = async (formData: McpServerFormData) => {
             visible_to_users: true
           })
         } else {
-          console.log('Edit[id].vue: Env var already exists in configuration schema:', envVarName)
         }
       })
 
@@ -257,7 +255,6 @@ const handleSubmit = async (formData: McpServerFormData) => {
           ...finalConfigurationSchema,
           team_env_schema: [...existingTeamEnvSchema, ...newEnvSchemaItems]
         }
-        console.log('Edit[id].vue: Updated team_env_schema with', newEnvSchemaItems.length, 'new items')
       }
     }
   }

services/frontend/src/views/mcp-server/index.vue

@@ -101,7 +101,6 @@ const checkWalkthroughSetting = async (): Promise<void> => {
     const globalWalkthroughEnabled = await GlobalSettingsService.shouldShowUserWalkthrough()
     
     if (!globalWalkthroughEnabled) {
-      console.log('Walkthrough disabled globally')
       showUserWalkthrough.value = false
       return
     }
@@ -111,7 +110,6 @@ const checkWalkthroughSetting = async (): Promise<void> => {
     const isWalkthroughCompleted = userPreferences.walkthrough_completed || false
     
     if (isWalkthroughCompleted) {
-      console.log('User has already completed the walkthrough')
       showUserWalkthrough.value = false
       // Also sync to local storage for consistency
       eventBus.setState('walkthrough_completed', true)
@@ -120,7 +118,6 @@ const checkWalkthroughSetting = async (): Promise<void> => {
     
     // Step 3: Show walkthrough only if globally enabled AND user hasn't completed it
     showUserWalkthrough.value = true
-    console.log('Walkthrough enabled globally and user has not completed it yet')
     
   } catch (error) {
     console.error('Error checking walkthrough setting:', error)
@@ -214,7 +211,6 @@ const handleNotificationShow = (data: { message: string; type: string }) => {
 
 // Walkthrough event handlers
 const handleWalkthroughNextStep = (data: { fromStep: number; toStep: number }) => {
-  console.log('Walkthrough next step:', data)
   if (data.fromStep === 1 && data.toStep === 2) {
     // Hide step 1
     showUserWalkthrough.value = false
@@ -233,13 +229,9 @@ const handleWalkthroughNextStep = (data: { fromStep: number; toStep: number }) =
 
 // UPDATED: Enhanced walkthrough finish handler with API call
 const handleWalkthroughFinish = async () => {
-  console.log('Walkthrough finished - updating user preferences')
-  
   try {
-    // Step 1: Use specialized walkthrough completion endpoint
-    await UserPreferencesService.completeWalkthrough()
-    
-    console.log('Successfully completed walkthrough via API')
+    // Step 1: Use generic preference endpoint (avoids Content-Type header issue)
+    await UserPreferencesService.setUserPreference('walkthrough_completed', true)
     
     // Step 2: Update local storage for consistency
     eventBus.setState('walkthrough_completed', true)
@@ -253,8 +245,6 @@ const handleWalkthroughFinish = async () => {
     // Step 4: Emit completion event for any listening components
     eventBus.emit('walkthrough-completed')
     
-    console.log('Walkthrough completion stored in both API and local storage')
-    
     // Optional: Show success toast
     toast.success('Welcome tour completed!')