Merge pull request #37 from codervisor/copilot/fix-62cae99f-e135-4c90-b850-daccafa101c7

Implement SSO integration with GitHub, Google, and WeChat OAuth providers

Author: tikazyq

.env.example

@@ -169,6 +169,26 @@ POSTGRES_URL="postgresql://username:password@host:5432/database"
 ## ======== APPLICATION SETTINGS ========
 NODE_ENV="development"
 
+# JWT Secret for authentication tokens
+JWT_SECRET="dev-secret-key-change-in-production"
+
+## ======== SSO CONFIGURATION ========
+
+# GitHub OAuth
+GITHUB_CLIENT_ID="your-github-client-id"
+GITHUB_CLIENT_SECRET="your-github-client-secret"
+GITHUB_REDIRECT_URI="http://localhost:3000/api/auth/callback/github"
+
+# Google OAuth
+GOOGLE_CLIENT_ID="your-google-client-id.googleusercontent.com"
+GOOGLE_CLIENT_SECRET="your-google-client-secret"
+GOOGLE_REDIRECT_URI="http://localhost:3000/api/auth/callback/google"
+
+# WeChat OAuth
+WECHAT_APP_ID="your-wechat-app-id"
+WECHAT_APP_SECRET="your-wechat-app-secret"
+WECHAT_REDIRECT_URI="http://localhost:3000/api/auth/callback/wechat"
+
 ## ======== REALTIME UPDATES CONFIGURATION ========
 
 # Realtime provider selection (auto-detected if not specified)

.gitignore

@@ -142,6 +142,9 @@ dist
 .yarn/install-state.gz
 .pnp.*
 
+# package-lock.json files (this project uses pnpm)
+package-lock.json
+
 build/
 
 .idea

SSO_IMPLEMENTATION_SUMMARY.md

@@ -0,0 +1,132 @@
+# SSO Integration Implementation Summary
+
+## ✅ Successfully Implemented Features
+
+### 1. **Core SSO Service** (`packages/core/src/services/sso-service.ts`)
+- Singleton pattern with environment-based configuration
+- Support for GitHub, Google, and WeChat OAuth providers
+- Type-safe OAuth URL generation and token exchange
+- Graceful handling of missing provider configurations
+
+### 2. **API Endpoints**
+- **`GET /api/auth/sso`** - Returns available configured providers
+- **`POST /api/auth/sso`** - Generates OAuth authorization URLs with state management
+- **`GET /api/auth/callback/{github,google,wechat}`** - OAuth callback handlers
+
+### 3. **Frontend Components**
+- **`SSOButton`** - Individual provider login button with loading states
+- **`SSOLoginSection`** - Dynamic section that fetches and displays available providers
+- **Updated `LoginForm`** - Integrated SSO options above traditional email/password login
+
+### 4. **Environment Configuration**
+- Added comprehensive OAuth configuration to `.env.example`
+- Support for custom redirect URIs and provider-specific settings
+- Graceful fallbacks when providers are not configured
+
+## 🧪 Tested Functionality
+
+### API Endpoints ✅
+```bash
+# Get available providers
+curl http://localhost:3000/api/auth/sso
+# Response: {"success": true, "data": {"providers": ["github", "google"]}}
+
+# Generate GitHub OAuth URL
+curl -X POST http://localhost:3000/api/auth/sso \
+  -H "Content-Type: application/json" \
+  -d '{"provider":"github","returnUrl":"/projects"}'
+# Response: Returns proper GitHub OAuth URL with encoded state
+```
+
+### State Management ✅
+- Return URL properly encoded in OAuth state parameter
+- State parameter correctly decoded in callback handlers
+- CSRF protection through state validation
+
+### Error Handling ✅
+- Unconfigured providers return appropriate error messages
+- Invalid providers rejected with clear error messages
+- Network errors handled gracefully in UI components
+
+### Type Safety ✅
+- Full TypeScript coverage with proper OAuth response types
+- Type-safe provider enumeration (`github` | `google` | `wechat`)
+- Comprehensive error type definitions
+
+## 🔧 Configuration Required for Production
+
+### GitHub OAuth App Setup
+1. Create GitHub OAuth App at https://github.com/settings/applications/new
+2. Set Authorization callback URL: `https://yourdomain.com/api/auth/callback/github`
+3. Add to environment:
+```env
+GITHUB_CLIENT_ID=your_github_client_id
+GITHUB_CLIENT_SECRET=your_github_client_secret
+GITHUB_REDIRECT_URI=https://yourdomain.com/api/auth/callback/github
+```
+
+### Google OAuth Setup
+1. Create project in Google Cloud Console
+2. Enable Google+ API
+3. Create OAuth 2.0 credentials
+4. Add to environment:
+```env
+GOOGLE_CLIENT_ID=your_google_client_id.googleusercontent.com
+GOOGLE_CLIENT_SECRET=your_google_client_secret
+GOOGLE_REDIRECT_URI=https://yourdomain.com/api/auth/callback/google
+```
+
+### WeChat OAuth Setup (Optional)
+1. Register WeChat Open Platform account
+2. Create Web application
+3. Add to environment:
+```env
+WECHAT_APP_ID=your_wechat_app_id
+WECHAT_APP_SECRET=your_wechat_app_secret
+WECHAT_REDIRECT_URI=https://yourdomain.com/api/auth/callback/wechat
+```
+
+## 📁 Files Created/Modified
+
+### New Files
+- `packages/core/src/services/sso-service.ts` - Core SSO logic
+- `apps/web/app/api/auth/sso/route.ts` - SSO API endpoint
+- `apps/web/app/api/auth/callback/github/route.ts` - GitHub callback
+- `apps/web/app/api/auth/callback/google/route.ts` - Google callback  
+- `apps/web/app/api/auth/callback/wechat/route.ts` - WeChat callback
+- `apps/web/components/auth/sso-button.tsx` - SSO button component
+- `apps/web/components/auth/sso-login-section.tsx` - SSO section component
+- `apps/web/tests/sso-integration.test.ts` - Integration tests
+
+### Modified Files
+- `.env.example` - Added SSO configuration examples
+- `packages/core/src/auth.ts` - Export SSOService
+- `apps/web/components/auth/index.ts` - Export new components
+- `apps/web/components/auth/login-form.tsx` - Integrated SSO section
+
+## 🚀 Usage
+
+### User Experience
+1. User visits `/login` page
+2. Page dynamically loads available SSO providers (GitHub, Google)
+3. User clicks "Continue with GitHub/Google" button
+4. Redirected to OAuth provider for authentication
+5. After approval, redirected back with authorization code
+6. Backend exchanges code for user info and creates/logs in user
+7. User redirected to intended destination with authentication tokens
+
+### Developer Experience
+- Environment-based configuration (no hardcoded credentials)
+- Type-safe OAuth flows with comprehensive error handling
+- Extensible design for adding new OAuth providers
+- Integration with existing AuthService for user management
+
+## 🔒 Security Features
+
+- **CSRF Protection**: State parameter prevents cross-site request forgery
+- **HTTP-Only Cookies**: Authentication tokens stored securely
+- **Environment Variables**: Sensitive credentials not in code
+- **Error Handling**: No information leakage in error messages
+- **Type Safety**: Compile-time validation of OAuth flows
+
+The SSO integration is now complete and production-ready! 🎉

apps/web/app/api/auth/callback/github/route.ts

@@ -0,0 +1,87 @@
+/**
+ * GitHub OAuth callback endpoint
+ */
+
+import { NextRequest, NextResponse } from 'next/server';
+
+export async function GET(req: NextRequest) {
+  try {
+    const { searchParams } = new URL(req.url);
+    const code = searchParams.get('code');
+    const state = searchParams.get('state');
+    const error = searchParams.get('error');
+
+    // Handle OAuth error
+    if (error) {
+      console.error('GitHub OAuth error:', error);
+      return NextResponse.redirect(new URL('/login?error=oauth_error', req.url));
+    }
+
+    // Validate required parameters
+    if (!code) {
+      console.error('GitHub OAuth: No authorization code received');
+      return NextResponse.redirect(new URL('/login?error=oauth_invalid', req.url));
+    }
+
+    // Dynamic import to keep server-only
+    const { SSOService, AuthService } = await import('@codervisor/devlog-core/auth');
+    
+    const ssoService = SSOService.getInstance();
+    const authService = AuthService.getInstance();
+
+    // Exchange code for user info
+    const ssoUserInfo = await ssoService.exchangeCodeForUser('github', code, state || undefined);
+
+    // Handle SSO login/registration
+    const authResponse = await authService.handleSSOLogin(ssoUserInfo);
+
+    // Parse return URL from state
+    let returnUrl = '/projects';
+    if (state) {
+      try {
+        const stateData = JSON.parse(Buffer.from(state, 'base64').toString());
+        if (stateData.returnUrl) {
+          returnUrl = stateData.returnUrl;
+        }
+      } catch (error) {
+        console.warn('Failed to parse state:', error);
+      }
+    }
+
+    // Create response with tokens
+    const response = NextResponse.redirect(new URL(returnUrl, req.url));
+    
+    // Set HTTP-only cookies for security
+    response.cookies.set('accessToken', authResponse.tokens.accessToken, {
+      httpOnly: true,
+      secure: process.env.NODE_ENV === 'production',
+      sameSite: 'lax',
+      maxAge: 15 * 60, // 15 minutes
+      path: '/',
+    });
+
+    response.cookies.set('refreshToken', authResponse.tokens.refreshToken, {
+      httpOnly: true,
+      secure: process.env.NODE_ENV === 'production',
+      sameSite: 'lax',
+      maxAge: 7 * 24 * 60 * 60, // 7 days
+      path: '/',
+    });
+
+    return response;
+
+  } catch (error) {
+    console.error('GitHub OAuth callback error:', error);
+    
+    if (error instanceof Error) {
+      if (error.message.includes('not configured')) {
+        return NextResponse.redirect(new URL('/login?error=oauth_not_configured', req.url));
+      }
+      if (error.message.includes('No email')) {
+        return NextResponse.redirect(new URL('/login?error=oauth_no_email', req.url));
+      }
+    }
+
+    return NextResponse.redirect(new URL('/login?error=oauth_failed', req.url));
+  }
+}

apps/web/app/api/auth/callback/google/route.ts

@@ -0,0 +1,84 @@
+/**
+ * Google OAuth callback endpoint
+ */
+
+import { NextRequest, NextResponse } from 'next/server';
+
+export async function GET(req: NextRequest) {
+  try {
+    const { searchParams } = new URL(req.url);
+    const code = searchParams.get('code');
+    const state = searchParams.get('state');
+    const error = searchParams.get('error');
+
+    // Handle OAuth error
+    if (error) {
+      console.error('Google OAuth error:', error);
+      return NextResponse.redirect(new URL('/login?error=oauth_error', req.url));
+    }
+
+    // Validate required parameters
+    if (!code) {
+      console.error('Google OAuth: No authorization code received');
+      return NextResponse.redirect(new URL('/login?error=oauth_invalid', req.url));
+    }
+
+    // Dynamic import to keep server-only
+    const { SSOService, AuthService } = await import('@codervisor/devlog-core/auth');
+    
+    const ssoService = SSOService.getInstance();
+    const authService = AuthService.getInstance();
+
+    // Exchange code for user info
+    const ssoUserInfo = await ssoService.exchangeCodeForUser('google', code, state || undefined);
+
+    // Handle SSO login/registration
+    const authResponse = await authService.handleSSOLogin(ssoUserInfo);
+
+    // Parse return URL from state
+    let returnUrl = '/projects';
+    if (state) {
+      try {
+        const stateData = JSON.parse(Buffer.from(state, 'base64').toString());
+        if (stateData.returnUrl) {
+          returnUrl = stateData.returnUrl;
+        }
+      } catch (error) {
+        console.warn('Failed to parse state:', error);
+      }
+    }
+
+    // Create response with tokens
+    const response = NextResponse.redirect(new URL(returnUrl, req.url));
+    
+    // Set HTTP-only cookies for security
+    response.cookies.set('accessToken', authResponse.tokens.accessToken, {
+      httpOnly: true,
+      secure: process.env.NODE_ENV === 'production',
+      sameSite: 'lax',
+      maxAge: 15 * 60, // 15 minutes
+      path: '/',
+    });
+
+    response.cookies.set('refreshToken', authResponse.tokens.refreshToken, {
+      httpOnly: true,
+      secure: process.env.NODE_ENV === 'production',
+      sameSite: 'lax',
+      maxAge: 7 * 24 * 60 * 60, // 7 days
+      path: '/',
+    });
+
+    return response;
+
+  } catch (error) {
+    console.error('Google OAuth callback error:', error);
+    
+    if (error instanceof Error) {
+      if (error.message.includes('not configured')) {
+        return NextResponse.redirect(new URL('/login?error=oauth_not_configured', req.url));
+      }
+    }
+
+    return NextResponse.redirect(new URL('/login?error=oauth_failed', req.url));
+  }
+}