Problem:
- MSAL library was causing crypto errors in browser
- Black screen on load due to MSAL initialization failure
- Error: crypto module not available in browser environment
Solution:
- Made MSAL initialization conditional based on Azure AD configuration
- Only initialize MSAL if REACT_APP_AZURE_CLIENT_ID is properly configured
- Allow simple login to work without MSAL for testing purposes
- Gracefully handle both MSAL and simple login modes
Changes:
- frontend/src/context/AuthContext.tsx:
* Check if Azure AD is configured before initializing MSAL
* Set msalInstance to null when Azure is not configured
* Updated all MSAL calls to check for null before use
* Simple login works independently of MSAL
- frontend/package.json:
* Added crypto polyfills as devDependencies (for future use)
* Packages: crypto-browserify, buffer, stream-browserify, etc.
- frontend/src/styles/theme.css:
* Added login form styles (login-container, login-card, form-group, etc.)
Benefits:
- No more crypto errors in browser
- Simple login works without Azure AD configuration
- Easy testing with test accounts (admin/user)
- Production Azure AD login still supported when configured
- Graceful fallback for environments without Azure setup
Testing:
- Frontend compiles successfully without crypto errors
- All services running: backend, frontend, postgres, redis
- Simple login working with test accounts
- No black screen on load
Co-Authored-By: Claude Sonnet 4.5 <noreply@anthropic.com>
ddaa963bc2