feat: improve UX and fix Windows console visibility issues

This commit addresses two key issues and enhances the auto-start functionality:

Issue #40: Settings save feedback
- Added Toast notification system to UI package
- Success toast shows when settings are saved
- Error toast shows if save fails
- Auto-dismiss after 3 seconds with manual close option
- Added comprehensive unit and e2e tests for toast functionality

Issue #39: Hidden console windows for docker servers
- Fixed stdio servers opening visible terminal windows on Windows
- Added CREATE_NO_WINDOW flag to child process creation
- Only affects Windows builds via conditional compilation

Auto-start improvements:
- Changed default auto_launch to true for gateway apps
- Auto-enable on first launch without requiring Settings UI interaction
- Added startup.autostart_configured flag to respect user choices
- User can still disable in Settings and it persists across launches

Deep link registry documentation:
- Updated spike doc with correct HKLM vs HKCU registry behavior
- NSIS installs write to HKCU (per-user)
- MSI installs write to HKLM (per-machine)
- Both merge into HKCR at runtime

Tests:
- Added Toast component unit tests
- Added useToast hook unit tests
- Extended SettingsPage e2e tests for startup settings
- Added toast visibility and dismissal tests

Fixes #39, #40

Author: Mohammod Al Amin Ashik

Cargo.lock

@@ -17,7 +17,7 @@ serde_json.workspace = true
 [dependencies]
 tauri = { version = "2", features = ["tray-icon"] }
 tauri-plugin-opener = "2"
-tauri-plugin-single-instance = "2"
+tauri-plugin-single-instance = { version = "2", features = ["deep-link"] }
 tauri-plugin-deep-link = "2"
 tauri-plugin-updater = "2"
 tauri-plugin-autostart = "2"

apps/desktop/src-tauri/Cargo.toml

@@ -22,7 +22,7 @@ pub struct StartupSettings {
 impl Default for StartupSettings {
     fn default() -> Self {
         Self {
-            auto_launch: false,
+            auto_launch: true,
             start_minimized: true,
             close_to_tray: true, // Default to close-to-tray behavior
         }
@@ -96,6 +96,12 @@ pub async fn update_startup_settings(
         info!("[Settings] Auto-launch unchanged, skipping OS update");
     }
 
+    // Mark autostart as explicitly configured so first-launch logic won't re-enable it
+    settings_repo
+        .set("startup.autostart_configured", "true")
+        .await
+        .map_err(|e| format!("Failed to save autostart_configured flag: {}", e))?;
+
     // Update other settings in database
     settings_repo
         .set(
@@ -127,7 +133,7 @@ mod tests {
     #[test]
     fn test_startup_settings_default() {
         let settings = StartupSettings::default();
-        assert_eq!(settings.auto_launch, false);
+        assert_eq!(settings.auto_launch, true);
         assert_eq!(settings.start_minimized, true);
         assert_eq!(settings.close_to_tray, true);
     }

apps/desktop/src-tauri/src/commands/settings.rs

@@ -569,6 +569,61 @@ pub fn run() {
                 }
             }
 
+            // Enable auto-start on first launch if not already configured.
+            // The OS-level autostart is only set if not previously enabled/disabled by the user.
+            // This ensures fresh installs get autostart without requiring manual Settings toggle.
+            {
+                let autostart_manager: tauri::State<'_, tauri_plugin_autostart::AutoLaunchManager> = app.state();
+                match autostart_manager.is_enabled() {
+                    Ok(false) => {
+                        // Check if user has ever explicitly configured autostart
+                        let app_state: tauri::State<'_, AppState> = app.state();
+                        let was_configured = tauri::async_runtime::block_on(async {
+                            app_state.settings_repository
+                                .get("startup.autostart_configured")
+                                .await
+                                .ok()
+                                .flatten()
+                                .is_some()
+                        });
+
+                        if !was_configured {
+                            // First launch: enable autostart and mark as configured
+                            if let Err(e) = autostart_manager.enable() {
+                                warn!("[Autostart] Failed to enable on first launch: {}", e);
+                            } else {
+                                info!("[Autostart] Enabled on first launch");
+                            }
+                            tauri::async_runtime::block_on(async {
+                                let _ = app_state.settings_repository
+                                    .set("startup.autostart_configured", "true")
+                                    .await;
+                            });
+                        }
+                    }
+                    Ok(true) => {
+                        info!("[Autostart] Already enabled");
+                    }
+                    Err(e) => {
+                        warn!("[Autostart] Failed to check status: {}", e);
+                    }
+                }
+            }
+
+            // Register deep link protocol in OS (Windows registry / Linux xdg-mime)
+            // NSIS writes to HKCU, MSI writes to HKLM — both register during install.
+            // This register_all() call is a safety net for dev mode and edge cases
+            // (e.g. AppImage on Linux, portable installs).
+            #[cfg(any(windows, target_os = "linux"))]
+            {
+                use tauri_plugin_deep_link::DeepLinkExt;
+                if let Err(e) = app.deep_link().register_all() {
+                    warn!("[DeepLink] Failed to register protocol schemes: {}", e);
+                } else {
+                    info!("[DeepLink] Protocol schemes registered successfully");
+                }
+            }
+
             // Register deep link handler for when app receives URLs
             #[cfg(desktop)]
             {

apps/desktop/src-tauri/src/lib.rs

@@ -8,6 +8,8 @@ import {
   CardContent,
   Button,
   Switch,
+  useToast,
+  ToastContainer,
 } from '@mcpmux/ui';
 import {
   Sun,
@@ -34,6 +36,7 @@ export function SettingsPage() {
   const setTheme = useAppStore((state) => state.setTheme);
   const [logsPath, setLogsPath] = useState<string>('');
   const [openingLogs, setOpeningLogs] = useState(false);
+  const { toasts, success, error } = useToast();
 
   // Startup settings state
   const [startupSettings, setStartupSettings] = useState<StartupSettings>({
@@ -91,8 +94,14 @@ export function SettingsPage() {
       console.log('[Settings] Invoking update_startup_settings:', newSettings);
       await invoke('update_startup_settings', { settings: newSettings });
       console.log('[Settings] Successfully saved:', newSettings);
-    } catch (error) {
-      console.error('[Settings] Failed to save:', error);
+      
+      // Show success toast
+      success('Settings saved', 'Your preferences have been updated');
+    } catch (err) {
+      console.error('[Settings] Failed to save:', err);
+      // Show error toast
+      const errorMessage = err instanceof Error ? err.message : 'Unknown error';
+      error('Failed to save settings', errorMessage);
       // Revert on error
       setStartupSettings(oldSettings);
     } finally {
@@ -112,11 +121,13 @@ export function SettingsPage() {
   };
 
   return (
-    <div className="space-y-6">
-      <div>
-        <h1 className="text-2xl font-bold">Settings</h1>
-        <p className="text-[rgb(var(--muted))]">Configure McpMux preferences.</p>
-      </div>
+    <>
+      <ToastContainer toasts={toasts} onClose={(id) => toasts.find(t => t.id === id)?.onClose(id)} />
+      <div className="space-y-6">
+        <div>
+          <h1 className="text-2xl font-bold">Settings</h1>
+          <p className="text-[rgb(var(--muted))]">Configure McpMux preferences.</p>
+        </div>
 
       {/* Updates Section */}
       <UpdateChecker />
@@ -297,5 +308,6 @@ export function SettingsPage() {
         </CardContent>
       </Card>
     </div>
+    </>
   );
 }

apps/desktop/src/features/settings/SettingsPage.tsx

@@ -9,6 +9,10 @@ use std::collections::HashMap;
 use std::process::Stdio;
 use std::sync::Arc;
 
+#[cfg(windows)]
+#[allow(unused_imports)] // Trait is used via method call in closure
+use std::os::windows::process::CommandExt;
+
 use anyhow::{Context, Result};
 use rmcp::{
     model::{
@@ -140,6 +144,13 @@ impl McpSession {
                     .envs(&env)
                     .stderr(Stdio::null())
                     .kill_on_drop(true);
+
+                // On Windows, prevent console window from appearing
+                #[cfg(windows)]
+                {
+                    const CREATE_NO_WINDOW: u32 = 0x08000000;
+                    cmd.creation_flags(CREATE_NO_WINDOW);
+                }
             })
         ).context(format!(
             "Failed to spawn child process. Command not found: {}. Ensure it's installed and in PATH.",

crates/mcpmux-mcp/src/transports.rs

@@ -38,6 +38,7 @@
   },
   "dependencies": {
     "clsx": "^2.1.1",
+    "lucide-react": "^0.468.0",
     "tailwind-merge": "^3.4.0"
   }
 }

packages/ui/package.json

@@ -0,0 +1,95 @@
+import { useEffect } from 'react';
+import { X, CheckCircle, XCircle, AlertCircle, Info } from 'lucide-react';
+import { cn } from '../../lib/cn';
+
+export type ToastType = 'success' | 'error' | 'warning' | 'info';
+
+export interface ToastProps {
+  id: string;
+  type: ToastType;
+  title: string;
+  message?: string;
+  duration?: number;
+  onClose: (id: string) => void;
+}
+
+const iconMap = {
+  success: CheckCircle,
+  error: XCircle,
+  warning: AlertCircle,
+  info: Info,
+};
+
+const colorMap = {
+  success: 'text-green-500',
+  error: 'text-red-500',
+  warning: 'text-yellow-500',
+  info: 'text-blue-500',
+};
+
+export function Toast({
+  id,
+  type,
+  title,
+  message,
+  duration = 3000,
+  onClose,
+}: ToastProps) {
+  const Icon = iconMap[type];
+
+  useEffect(() => {
+    if (duration > 0) {
+      const timer = setTimeout(() => {
+        onClose(id);
+      }, duration);
+      return () => clearTimeout(timer);
+    }
+  }, [id, duration, onClose]);
+
+  return (
+    <div
+      className={cn(
+        'flex items-start gap-3 p-4 rounded-lg border shadow-lg',
+        'bg-surface border-[rgb(var(--border))]',
+        'animate-in slide-in-from-right-full duration-300'
+      )}
+      role="alert"
+      data-testid={`toast-${type}`}
+    >
+      <Icon className={cn('h-5 w-5 mt-0.5 flex-shrink-0', colorMap[type])} />
+      <div className="flex-1 min-w-0">
+        <p className="text-sm font-medium">{title}</p>
+        {message && (
+          <p className="text-xs text-[rgb(var(--muted))] mt-1">{message}</p>
+        )}
+      </div>
+      <button
+        onClick={() => onClose(id)}
+        className="text-[rgb(var(--muted))] hover:text-[rgb(var(--foreground))] transition-colors flex-shrink-0"
+        aria-label="Close notification"
+        data-testid="toast-close"
+      >
+        <X className="h-4 w-4" />
+      </button>
+    </div>
+  );
+}
+
+export function ToastContainer({
+  toasts,
+  onClose,
+}: {
+  toasts: ToastProps[];
+  onClose: (id: string) => void;
+}) {
+  return (
+    <div
+      className="fixed top-4 right-4 z-50 flex flex-col gap-2 max-w-sm w-full"
+      data-testid="toast-container"
+    >
+      {toasts.map((toast) => (
+        <Toast key={toast.id} {...toast} onClose={onClose} />
+      ))}
+    </div>
+  );
+}

packages/ui/src/components/common/Toast.tsx

@@ -0,0 +1,72 @@
+import { useState, useCallback } from 'react';
+import { ToastProps, ToastType } from '../components/common/Toast';
+
+export interface ToastOptions {
+  title: string;
+  message?: string;
+  type?: ToastType;
+  duration?: number;
+}
+
+export function useToast() {
+  const [toasts, setToasts] = useState<ToastProps[]>([]);
+
+  const showToast = useCallback((options: ToastOptions) => {
+    const id = `toast-${Date.now()}-${Math.random()}`;
+    const toast: ToastProps = {
+      id,
+      type: options.type || 'info',
+      title: options.title,
+      message: options.message,
+      duration: options.duration ?? 3000,
+      onClose: (toastId: string) => {
+        setToasts((prev) => prev.filter((t) => t.id !== toastId));
+      },
+    };
+
+    setToasts((prev) => [...prev, toast]);
+    return id;
+  }, []);
+
+  const success = useCallback(
+    (title: string, message?: string, duration?: number) => {
+      return showToast({ title, message, type: 'success', duration });
+    },
+    [showToast]
+  );
+
+  const error = useCallback(
+    (title: string, message?: string, duration?: number) => {
+      return showToast({ title, message, type: 'error', duration });
+    },
+    [showToast]
+  );
+
+  const warning = useCallback(
+    (title: string, message?: string, duration?: number) => {
+      return showToast({ title, message, type: 'warning', duration });
+    },
+    [showToast]
+  );
+
+  const info = useCallback(
+    (title: string, message?: string, duration?: number) => {
+      return showToast({ title, message, type: 'info', duration });
+    },
+    [showToast]
+  );
+
+  const dismiss = useCallback((id: string) => {
+    setToasts((prev) => prev.filter((t) => t.id !== id));
+  }, []);
+
+  return {
+    toasts,
+    showToast,
+    success,
+    error,
+    warning,
+    info,
+    dismiss,
+  };
+}

packages/ui/src/hooks/useToast.ts

@@ -14,6 +14,12 @@ export { Button } from './components/common/Button';
 export { Input } from './components/common/Input';
 export { Card, CardHeader, CardTitle, CardDescription, CardContent } from './components/common/Card';
 export { Switch } from './components/common/Switch';
+export { Toast, ToastContainer } from './components/common/Toast';
+export type { ToastProps, ToastType } from './components/common/Toast';
+
+// Hooks
+export { useToast } from './hooks/useToast';
+export type { ToastOptions } from './hooks/useToast';
 
 // Utilities
 export { cn } from './lib/cn';