first commit

docs/2024-02-14/auth_setup.md

@@ -0,0 +1,150 @@
+# Authentication System Setup
+
+## Overview
+This document outlines the setup of the authentication system, including both social and regular authentication.
+
+## Backend Changes
+
+### 1. Package Installation
+```bash
+pip install django-allauth==0.65.1 dj-rest-auth==6.0.0 djangorestframework==3.15.2 django-cors-headers==4.5.0
+```
+
+### 2. Configuration Files Modified
+- thrillwiki/settings.py
+  - Added authentication apps
+  - Configured REST Framework
+  - Added CORS settings
+  - Added social auth providers
+  - Updated redirect URLs
+
+- thrillwiki/urls.py
+  - Added dj-rest-auth URLs
+  - Added social auth URLs
+
+### 3. New Files Created
+- accounts/adapters.py
+  - Custom social account adapter
+  - Handles missing emails
+  - Sets profile pictures from social providers
+
+### 4. Modified Files
+- accounts/views.py
+  - Added email collection endpoint
+  - Updated authentication views
+- accounts/urls.py
+  - Added new authentication endpoints
+
+## Frontend Changes
+
+### 1. Package Installation
+```bash
+npm install react-router-dom@6 axios@latest @react-oauth/google@latest
+```
+
+### 2. New Components Created
+- src/contexts/AuthContext.tsx
+- src/contexts/AuthProvider.tsx
+- src/pages/Login.tsx
+- src/pages/DiscordRedirect.tsx
+- src/pages/EmailRequired.tsx
+
+### 3. New Assets
+- public/google-icon.svg
+- public/discord-icon.svg
+
+### 4. Modified Files
+- src/App.tsx
+  - Added Google OAuth provider
+  - Added new routes
+- src/api/client.ts
+  - Added authentication endpoints
+  - Added token handling
+
+## Development Environment Setup
+
+### Backend Setup
+1. Create .env file:
+```env
+DJANGO_SECRET_KEY=your_secret_key
+DEBUG=True
+ALLOWED_HOSTS=localhost,127.0.0.1
+CORS_ALLOWED_ORIGINS=http://localhost:5173
+
+# OAuth Credentials
+GOOGLE_OAUTH2_CLIENT_ID=your_google_client_id
+GOOGLE_OAUTH2_CLIENT_SECRET=your_google_client_secret
+DISCORD_CLIENT_ID=your_discord_client_id
+DISCORD_CLIENT_SECRET=your_discord_client_secret
+
+# Database
+DB_NAME=thrillwiki
+DB_USER=postgres
+DB_PASSWORD=postgres
+DB_HOST=localhost
+DB_PORT=5432
+```
+
+2. Run migrations:
+```bash
+python manage.py makemigrations
+python manage.py migrate
+```
+
+### Frontend Setup
+1. Create .env file:
+```env
+VITE_API_URL=http://localhost:8000
+VITE_GOOGLE_CLIENT_ID=your_google_client_id
+VITE_DISCORD_CLIENT_ID=your_discord_client_id
+```
+
+2. Install dependencies:
+```bash
+cd frontend
+npm install
+```
+
+## Testing Instructions
+
+### Backend Testing
+1. Start Django development server:
+```bash
+python manage.py runserver
+```
+
+2. Test endpoints:
+- Regular auth: http://localhost:8000/api/auth/login/
+- Social auth: http://localhost:8000/api/auth/google/login/
+- User info: http://localhost:8000/api/auth/user/
+
+### Frontend Testing
+1. Start Vite development server:
+```bash
+cd frontend
+npm run dev
+```
+
+2. Test flows:
+- Regular login: http://localhost:5173/login
+- Google login: Click "Continue with Google"
+- Discord login: Click "Continue with Discord"
+- Protected route: http://localhost:5173/settings
+
+## Testing Checklist
+- [ ] Regular login/registration
+- [ ] Google OAuth flow
+- [ ] Discord OAuth flow
+- [ ] Email collection for social auth
+- [ ] Profile picture import
+- [ ] Protected route access
+- [ ] Token persistence
+- [ ] Error handling
+- [ ] Logout functionality
+
+## Notes
+- Ensure all OAuth credentials are properly set up in Google Cloud Console and Discord Developer Portal
+- Test all flows in incognito mode to avoid cached credentials
+- Verify CSRF protection is working
+- Check token expiration handling
+- Test error scenarios (network issues, invalid credentials)