- Replace API calls with cached auth state from middleware in useAuthorization
- Add fallback to session cache and watchers for auth state updates
- Change initialization from async to synchronous for better performance
- Add DuplicateNotificationBanner component
- Implement authorization middleware and composables for role checking
- Add groups/roles support to authentication and session management
- Create admin dashboard pages and API endpoints
- Add audit logging utility for tracking user actions
- Enhance expense page with role-based access control
- Improve session caching with authorization state management
- Replace iframe embed with full-featured berth status dashboard
- Add BerthDetailsModal and BerthStatusBadge components
- Implement search, filtering, and multiple view modes
- Add berth management API endpoints (get-by-id, update)
- Include measurement conversion utilities and type definitions
- Provide status summaries and visual berth overview
## **Critical Fix for 500 Error:**
### **Issue:**
- useUnifiedAuth.ts was still calling useOidcAuth() which no longer exists
- This was causing the 500 error when dashboard tried to load
- Error: 'useOidcAuth is not defined'
### **Solution:**
- Replaced useOidcAuth() with useCustomAuth() in unified auth
- Updated logout logic to use custom Keycloak auth
- Maintained dual auth support (Directus + Keycloak)
### **Files Changed:**
- composables/useUnifiedAuth.ts - Updated to use custom auth system
## **Next Step:**
Need to resolve TypeScript import issue for useCustomAuth composable
## **Fixed 404 Error:**
### **Issue:**
- Keycloak was redirecting to /auth/keycloak/callback
- But our server endpoint was at /api/auth/keycloak/callback
- This caused a 404 Page Not Found error
### **Solution:**
- Updated useCustomAuth.ts redirect URI to include /api prefix
- Updated server callback endpoint to match the new path
- Both client and server now use: /api/auth/keycloak/callback
### **Files Changed:**
- composables/useCustomAuth.ts - Updated login redirect URI
- server/api/auth/keycloak/callback.ts - Updated token exchange redirect URI
## **Result:**
Now when users click 'Login with SSO':
1. Redirect to Keycloak
2. Keycloak redirects back to /api/auth/keycloak/callback
3. Server handles the callback properly
4. User gets authenticated and redirected to dashboard
The 404 error should be resolved and SSO login should work!
DEBUGGING: Add comprehensive console logging to track authentication flow
## Changes Made:
### 1. Configuration Updates (nuxt.config.ts)
- Temporarily enabled keycloakDebug: true for production
- Allows detailed logging to troubleshoot authentication issues
### 2. Enhanced Error Logging (composables/useKeycloak.ts)
- Added [KEYCLOAK] prefixed console logs throughout login flow
- Enhanced error reporting with message, stack, and name details
- Added logging for initialization status and redirect URIs
- TypeScript-safe error handling with instanceof checks
## Debug Information Now Available:
- Keycloak initialization status
- Login function execution tracking
- Redirect URI generation details
- Authentication state monitoring
- Detailed error messages with stack traces
This will help identify exactly where the authentication process is failing
and provide actionable debugging information in the browser console.
Ready for container rebuild and testing.
CRITICAL FIX: Resolve SSO login endless loading and CORS errors
## Issues Resolved:
### 1. CORS Policy Violations
- Disabled checkLoginIframe (causes cross-origin iframe errors)
- Removed silentCheckSsoRedirectUri (blocked by modern browsers)
- Disabled checkLoginIframeInterval to prevent 3rd party cookie checks
### 2. Cross-Domain Compatibility
- Set responseMode to 'query' for better proxy compatibility
- Configured standard flow instead of implicit
- Added proper timeout handling (messageReceiveTimeout: 10000)
- Enhanced debug logging for troubleshooting
### 3. Redirect URI Consistency
- Fixed login() to use proper baseUrl for redirect URIs
- Ensures HTTPS URLs in production environment
- Consistent URL generation across initialization and login
### 4. Browser Security Compliance
- Disabled enableLogging to reduce console noise
- Removed iframe-based features that modern browsers block
- Maintained PKCE (S256) for security while fixing compatibility
## Technical Details:
The previous errors were caused by Keycloak trying to use:
- /protocol/openid-connect/3p-cookies/step1.html
- /protocol/openid-connect/login-status-iframe.html
These are blocked by browsers' cross-origin policies when the app and
Keycloak are on different domains (client.portnimara.dev vs auth.portnimara.dev).
This fix disables these problematic features while maintaining full OAuth
functionality and security. The SSO login should now work without endless
loading issues.
- Disable Keycloak integration in authentication middleware
- Update useUnifiedAuth to only use Directus authentication
- Rebuild login page with only Directus auth form
- Remove all Keycloak references that were causing JavaScript errors
- This restores the application to working state with Directus auth only
Application should now load and function normally. Keycloak can be re-enabled later once issues are resolved.
- Add proper SSR guards and error handling
- Make authentication middleware more defensive
- Add null checks in useUnifiedAuth composable
- Prevent JavaScript errors from breaking page load
- Prioritize Directus auth over Keycloak for stability
- Remove problematic nuxt-openid-connect module that was causing OAuth issues
- Install and implement official keycloak-js adapter for better reliability
- Create new useKeycloak composable with proper token management
- Update useUnifiedAuth to work with new Keycloak implementation
- Fix authentication middleware to support both auth methods
- Update login page to use new Keycloak login function
- Clean up configuration and remove deprecated OIDC settings
- This should resolve all the HTTP/HTTPS redirect and token exchange issues
- Add full PWA configuration with manifest and service worker
- Create PWAInstallBanner component with mobile detection
- Implement install banner on login page (shows below login form)
- Add usePWA composable for reusable PWA functionality
- Configure offline support with Workbox caching strategies
- Add PWA initialization plugin
- Update app name to 'Port Nimara Portal' throughout
- Use circular logo in install banner and instructions
- Banner shows only once and hides if already installed
- Support both Android (direct install) and iOS (manual instructions)
- Add comprehensive documentation for PWA implementation
Features:
- Mobile-only install banner with dismissal tracking
- Standalone mode detection to hide banner when installed
- Platform-specific installation instructions
- Offline functionality with API caching
- Auto-updating service worker
- Native app-like experience when installed
Matt
Ron