Production Deployment Fixes and Enhancements #3

Merged

ilia merged 38 commits from dev into main 2026-01-04 16:37:35 -05:00

Conversation 0 Commits 38 Files Changed 19 +590 -93

ilia commented 2026-01-04 16:30:33 -05:00

Owner

Copy Link

Merge Request: Production Deployment Fixes and Enhancements

Summary

This MR includes critical fixes for production deployment, authentication improvements, file upload serving, and monitoring capabilities. All changes have been tested and are ready for production.

🐛 Critical Fixes

1. Authentication & Session Management

• Fixed TypeScript error in session callback (lib/auth.ts)
  • Removed return null that caused build failures
  • Session callback now always returns a valid session object
• Fixed login redirect loop (app/login/page.tsx)
  • Changed from router.push() to window.location.href for full page reload
  • Ensures session cookie is available before middleware checks
• Created proper middleware (proxy.ts)
  • Next.js 16 requires proxy.ts instead of middleware.ts
  • Fixed authentication checks in Edge runtime
  • Explicitly specifies cookie name for getToken

2. Build & Deployment

• Fixed Prisma initialization (lib/prisma.ts)
  • Made Prisma client initialization lazy to fix build without DATABASE_URL
  • Uses Proxy pattern for on-demand initialization
  • Prevents build failures when DATABASE_URL not set

3. File Upload & Serving

• Fixed photo upload serving (app/api/uploads/[filename]/route.ts)
  • Created dedicated API route to serve uploaded files
  • Files now served via /api/uploads/[filename] instead of static /uploads/
  • Ensures files are accessible regardless of filesystem location
  • Added file existence verification and proper error handling
• Updated upload routes to use new API endpoint
  • app/api/photos/upload/route.ts - Updated to use /api/uploads/ URLs
  • app/api/photos/upload-multiple/route.ts - Updated to use /api/uploads/ URLs
• Fixed photo display components
  • components/PhotoThumbnail.tsx - Uses regular img tag for uploads
  • components/PhotoImage.tsx - Uses regular img tag for uploads
  • Avoids Next.js Image component issues with dynamically uploaded files

4. Middleware & Route Protection

• Updated proxy middleware (proxy.ts)
  • Added /uploads and /api/uploads to public routes
  • Added comprehensive activity logging
  • Improved error handling and logging

✨ New Features

Activity Logging

• Created activity logging utility (lib/activity-log.ts)
  • Structured logging for user actions
  • Tracks: page visits, photo uploads, guess submissions
  • Includes user info, IP, timestamps, and action details
• Added activity logging to key routes
  • proxy.ts - Logs all page visits and API calls
  • app/api/photos/upload/route.ts - Logs photo uploads
  • app/api/photos/[photoId]/guess/route.ts - Logs guess submissions

Monitoring

• Activity monitoring commands
  • Watch logs: sudo journalctl -u app-backend -f | grep -E "\[ACTIVITY\]|\[PHOTO_UPLOAD\]|\[GUESS_SUBMIT\]"
  • Filter by user, action type, or time range

📝 Documentation Updates

• README.md

  • Added deployment notes section
  • Added file upload details and troubleshooting
  • Added activity monitoring commands
  • Added database query examples
  • Updated troubleshooting section

• ARCHITECTURE.md

  • Updated middleware references (proxy.ts instead of middleware.ts)
  • Added activity logging documentation
  • Updated photo upload flow with file upload details
  • Added file serving architecture
  • Updated guess submission flow

• CLEANUP.md (new)

  • Created cleanup checklist for future improvements
  • Documents debug code and verbose logging
  • Provides recommendations for optimization

🔧 Technical Changes

Files Modified

• lib/auth.ts - Fixed session callback return type
• app/login/page.tsx - Fixed redirect to use full page reload
• proxy.ts - Created/updated middleware with activity logging
• lib/prisma.ts - Made initialization lazy
• app/api/photos/upload/route.ts - Updated file serving, added logging
• app/api/photos/upload-multiple/route.ts - Updated file serving
• components/PhotoThumbnail.tsx - Fixed image display
• components/PhotoImage.tsx - Fixed image display

Files Created

• app/api/uploads/[filename]/route.ts - File serving API route
• lib/activity-log.ts - Activity logging utility
• CLEANUP.md - Cleanup checklist

✅ Testing

• Authentication flow tested (login, session persistence)
• Photo upload tested (file and URL uploads)
• Photo display tested (uploaded files visible to all users)
• Guess submission tested
• Build tested (no TypeScript errors)
• Middleware tested (route protection working)
• Activity logging verified

🚀 Deployment Notes

Environment Variables Required

• NODE_ENV=production
• NEXTAUTH_URL - Production domain
• NEXTAUTH_SECRET - Secret key
• AUTH_TRUST_HOST=true (if using reverse proxy)
• DATABASE_URL - Production database connection

Post-Deployment

1. Verify public/uploads/ directory exists and has write permissions
2. Test photo upload and verify files are accessible
3. Monitor activity logs to ensure logging is working
4. Verify authentication flow works correctly

Monitoring

• Watch activity logs: sudo journalctl -u app-backend -f | grep -E "\[ACTIVITY\]|\[PHOTO_UPLOAD\]|\[GUESS_SUBMIT\]"
• Check for errors: sudo journalctl -u app-backend --since "1 hour ago" | grep -i error

🔄 Breaking Changes

None - All changes are backward compatible. Existing photos with /uploads/ URLs may need to be updated to /api/uploads/ if files are not accessible, but the system will continue to work.

📋 Migration Notes

For Existing Photos

• Photos uploaded before this change use /uploads/ URLs
• New photos use /api/uploads/ URLs
• Old photos will continue to work if files exist in public/uploads/
• Consider migrating old photo URLs if needed (optional)

🎯 Next Steps (Future)

See CLEANUP.md for recommended cleanup tasks:

• Reduce verbose logging in production
• Add log levels (DEBUG, INFO, WARN, ERROR)
• Protect debug endpoints
• Optimize activity logging

---

Ready for Production: ✅ Yes
Breaking Changes: ❌ No
Requires Migration: ⚠️ Optional (old photo URLs)

# Merge Request: Production Deployment Fixes and Enhancements ## Summary This MR includes critical fixes for production deployment, authentication improvements, file upload serving, and monitoring capabilities. All changes have been tested and are ready for production. ## 🐛 Critical Fixes ### 1. Authentication & Session Management - **Fixed TypeScript error in session callback** (`lib/auth.ts`) - Removed `return null` that caused build failures - Session callback now always returns a valid session object - **Fixed login redirect loop** (`app/login/page.tsx`) - Changed from `router.push()` to `window.location.href` for full page reload - Ensures session cookie is available before middleware checks - **Created proper middleware** (`proxy.ts`) - Next.js 16 requires `proxy.ts` instead of `middleware.ts` - Fixed authentication checks in Edge runtime - Explicitly specifies cookie name for `getToken` ### 2. Build & Deployment - **Fixed Prisma initialization** (`lib/prisma.ts`) - Made Prisma client initialization lazy to fix build without DATABASE_URL - Uses Proxy pattern for on-demand initialization - Prevents build failures when DATABASE_URL not set ### 3. File Upload & Serving - **Fixed photo upload serving** (`app/api/uploads/[filename]/route.ts`) - Created dedicated API route to serve uploaded files - Files now served via `/api/uploads/[filename]` instead of static `/uploads/` - Ensures files are accessible regardless of filesystem location - Added file existence verification and proper error handling - **Updated upload routes** to use new API endpoint - `app/api/photos/upload/route.ts` - Updated to use `/api/uploads/` URLs - `app/api/photos/upload-multiple/route.ts` - Updated to use `/api/uploads/` URLs - **Fixed photo display components** - `components/PhotoThumbnail.tsx` - Uses regular `img` tag for uploads - `components/PhotoImage.tsx` - Uses regular `img` tag for uploads - Avoids Next.js Image component issues with dynamically uploaded files ### 4. Middleware & Route Protection - **Updated proxy middleware** (`proxy.ts`) - Added `/uploads` and `/api/uploads` to public routes - Added comprehensive activity logging - Improved error handling and logging ## ✨ New Features ### Activity Logging - **Created activity logging utility** (`lib/activity-log.ts`) - Structured logging for user actions - Tracks: page visits, photo uploads, guess submissions - Includes user info, IP, timestamps, and action details - **Added activity logging to key routes** - `proxy.ts` - Logs all page visits and API calls - `app/api/photos/upload/route.ts` - Logs photo uploads - `app/api/photos/[photoId]/guess/route.ts` - Logs guess submissions ### Monitoring - **Activity monitoring commands** - Watch logs: `sudo journalctl -u app-backend -f | grep -E "\[ACTIVITY\]|\[PHOTO_UPLOAD\]|\[GUESS_SUBMIT\]"` - Filter by user, action type, or time range ## 📝 Documentation Updates - **README.md** - Added deployment notes section - Added file upload details and troubleshooting - Added activity monitoring commands - Added database query examples - Updated troubleshooting section - **ARCHITECTURE.md** - Updated middleware references (proxy.ts instead of middleware.ts) - Added activity logging documentation - Updated photo upload flow with file upload details - Added file serving architecture - Updated guess submission flow - **CLEANUP.md** (new) - Created cleanup checklist for future improvements - Documents debug code and verbose logging - Provides recommendations for optimization ## 🔧 Technical Changes ### Files Modified - `lib/auth.ts` - Fixed session callback return type - `app/login/page.tsx` - Fixed redirect to use full page reload - `proxy.ts` - Created/updated middleware with activity logging - `lib/prisma.ts` - Made initialization lazy - `app/api/photos/upload/route.ts` - Updated file serving, added logging - `app/api/photos/upload-multiple/route.ts` - Updated file serving - `components/PhotoThumbnail.tsx` - Fixed image display - `components/PhotoImage.tsx` - Fixed image display ### Files Created - `app/api/uploads/[filename]/route.ts` - File serving API route - `lib/activity-log.ts` - Activity logging utility - `CLEANUP.md` - Cleanup checklist ## ✅ Testing - [x] Authentication flow tested (login, session persistence) - [x] Photo upload tested (file and URL uploads) - [x] Photo display tested (uploaded files visible to all users) - [x] Guess submission tested - [x] Build tested (no TypeScript errors) - [x] Middleware tested (route protection working) - [x] Activity logging verified ## 🚀 Deployment Notes ### Environment Variables Required - `NODE_ENV=production` - `NEXTAUTH_URL` - Production domain - `NEXTAUTH_SECRET` - Secret key - `AUTH_TRUST_HOST=true` (if using reverse proxy) - `DATABASE_URL` - Production database connection ### Post-Deployment 1. Verify `public/uploads/` directory exists and has write permissions 2. Test photo upload and verify files are accessible 3. Monitor activity logs to ensure logging is working 4. Verify authentication flow works correctly ### Monitoring - Watch activity logs: `sudo journalctl -u app-backend -f | grep -E "\[ACTIVITY\]|\[PHOTO_UPLOAD\]|\[GUESS_SUBMIT\]"` - Check for errors: `sudo journalctl -u app-backend --since "1 hour ago" | grep -i error` ## 🔄 Breaking Changes **None** - All changes are backward compatible. Existing photos with `/uploads/` URLs may need to be updated to `/api/uploads/` if files are not accessible, but the system will continue to work. ## 📋 Migration Notes ### For Existing Photos - Photos uploaded before this change use `/uploads/` URLs - New photos use `/api/uploads/` URLs - Old photos will continue to work if files exist in `public/uploads/` - Consider migrating old photo URLs if needed (optional) ## 🎯 Next Steps (Future) See `CLEANUP.md` for recommended cleanup tasks: - Reduce verbose logging in production - Add log levels (DEBUG, INFO, WARN, ERROR) - Protect debug endpoints - Optimize activity logging --- **Ready for Production:** ✅ Yes **Breaking Changes:** ❌ No **Requires Migration:** ⚠️ Optional (old photo URLs)

ilia added 37 commits 2026-01-04 16:30:34 -05:00

fix: Resolve linting and TypeScript errors ... 90c5a9a4df

- Replace 'any' types with proper Prisma types
- Use PhotoUncheckedCreateInput for photo creation
- Use Prisma.PhotoWhereInput for where clauses
- Add proper type assertions for photo fields
- Fix Photo import error by using Prisma namespace

fix: Resolve TypeScript and linting errors for CI ... f4461b277c

- Remove Prisma namespace imports (not available in Prisma 7)
- Use type assertions with eslint-disable for Prisma type issues
- Fix console.error calls to avoid format string warnings
- Sanitize file extensions to address path traversal warnings
- Add comments explaining server-side filename generation safety

fix: Improve navigation component styling and functionality ... 21fc9f33fb

- Add relative positioning to navigation elements for better stacking context
- Ensure side menu closes when navigating to Upload and Leaderboard links
- Adjust z-index values for side menu and overlay to improve layering

chore: Update CI configuration to include DATABASE_URL for Prisma Client generation ... c16b38522c

- Add DATABASE_URL environment variable to ensure Prisma can generate types using the same connection string as the build step

fix: Enhance CI workflow to improve skip logic and compatibility ... 44cd5f5e0b

- Default to not skipping CI unless specified
- Set outputs in both modern and legacy formats for broader runner compatibility
- Refactor skip condition checks for consistency across jobs

fix: Refine CI skip logic for improved clarity and compatibility ... 4200975c78

- Default to 'false' for skip output to enhance runner compatibility
- Update skip condition checks to use boolean values for consistency
- Ensure CI is only skipped when explicitly indicated in branch name or commit message

chore: Update CI workflow to include Prisma Client generation and improve skip logic ... cbf49bf306

- Add step to generate Prisma Client with DATABASE_URL for consistent type generation
- Clean up skip logic by removing unnecessary comments and legacy output formats
- Ensure CI skip checks are clear and maintain compatibility across runners

chore: Remove outdated Prisma typings and update client output path ... 24889c0373

- Delete fallback TypeScript typings for Prisma client to streamline type generation
- Update Prisma client output path for better compatibility with current project structure

chore: Clean up TypeScript configuration by removing outdated Prisma client path ... 67914fcdc9

- Remove the obsolete path mapping for Prisma client in tsconfig.json to streamline the configuration

chore: Update CI workflow to include a trigger comment ... 49715f558f

- Add a comment to clarify the CI trigger mechanism for better understanding

chore: Update Prisma client output path for improved project structure ... 62cbcb8c26

- Set the output path for the Prisma client to align with the current project directory structure, enhancing compatibility and organization.

chore: Add postinstall script for Prisma client generation and remove outdated client symlink ... 2169e5d184

- Introduce a postinstall script to automatically generate the Prisma client after installation
- Remove the outdated symlink for the Prisma client to streamline project structure and avoid confusion

feat: Add global error boundary component ... 04185b3d62

- Introduced a minimal global error boundary to handle errors during prerendering.
- Provides a simple UI for error display and a retry action without relying on contexts.

Merge remote-tracking branch 'gitea/main' into dev 6f280a796e

Merge pull request 'feat: Add global error boundary component' (#2) from buildfix into dev ... 8e3a583123

Reviewed-on: #2

chore: Update package.json to manage @tailwindcss/postcss dependency ... 70c4c6ea9e

- Added @tailwindcss/postcss to dependencies for improved styling capabilities.
- Removed it from devDependencies to streamline package management.

feat: Enhance authentication error handling and secret validation ... af2faf8f41

- Added validation for NEXTAUTH_SECRET to ensure it is set before authentication.
- Wrapped the authorization logic in a try-catch block to handle potential errors gracefully and log them for debugging.

feat: Enable host trust for authentication and update example environment configuration ... 888ffef8e3

- Set AUTH_TRUST_HOST to true in env.example for improved security.
- Updated NextAuth configuration to trust the host during authentication.

feat: Enhance session management in authentication ... c0a1ed146f

- Added email and name to the token during the sign-in process for improved user context.
- Updated session callback to ensure session.user is populated with token data, including id, email, name, and role, while maintaining existing session data.
- Added a warning for non-production environments when the token is missing or invalid.

feat: Implement session debugging and cookie management in API ... ea7da85d5e

- Added a new API route for session management that retrieves session information and cookie data.
- Enhanced error handling to provide detailed error messages in case of failures.
- Updated login page to support callback URLs for redirection after successful login.
- Introduced debug logging for session creation and token validation in non-production environments.

feat: Improve session handling and cookie management in API ... 9457f08580

- Enhanced the GET request handler to better manage session tokens from both request headers and Next.js cookie store.
- Added detailed error handling for authentication failures and improved logging for debugging purposes.
- Updated cookie management to provide clearer insights into session token presence and accessibility.
- Ensured secure cookie handling is enforced in production environments.

feat: Enhance session logging in authentication ... fcd1d372b7

- Updated session callback to include user role in the logging output for better context during session creation.
- Improved logging for missing or invalid tokens by adding token ID and email to the warning message.
- Removed conditional logging for non-production environments to ensure consistent logging across all environments.

feat: Enhance logging and session handling in PhotosPage ... f2efa772d6

- Added detailed logging for session information in the PhotosPage component to aid in debugging.
- Included console logs for session presence and user details, as well as a log for redirection to the login page when no session is found.
- Updated session callback in auth.ts to include additional session details for improved context during authentication.

feat: Improve session validation and logging in PhotosPage ... a465e39a4d

- Added additional logging to track session and user details, enhancing debugging capabilities.
- Implemented checks for both session existence and user presence, redirecting to the login page as necessary.
- Improved session information output for better context during page rendering.

feat: Enhance JWT callback logging in authentication ... 7a191257e3

- Added additional details to the JWT callback logging, including token ID, email, name, and role for improved debugging and context during authentication.
- Enhanced visibility into token state when no user is present, aiding in troubleshooting authentication issues.

test b7c789b536

feat: Add debug logging for authentication process in session route ... 83c30b5bd1

- Introduced console logs to track the authentication call and its results, including session presence and user details.
- Enhanced error logging to capture and display authentication errors for improved debugging.

refactor: Simplify session.user handling in authentication ... 98fe3513dd

- Removed unnecessary check for session.user existence, ensuring it is always populated with token data.
- Updated comments to clarify session return behavior when token validation fails, allowing NextAuth to manage invalid tokens.

refactor: Update login redirection method for session handling ... f9bfa5febb

- Replaced router.push with window.location.href to ensure a full page reload after login, allowing the session cookie to be read correctly before authentication checks.
- Updated comments to clarify the reason for this change in the login flow.

feat: Add middleware for authentication and role-based access control ... 395869c6c0

- Implemented a new middleware to handle authentication checks and enforce role-based access for protected routes.
- Added debug logging to track token presence and user details for improved troubleshooting.
- Configured middleware to match all request paths except for static files and specific assets.

refactor: Replace middleware implementation with proxy function ... 014bb983ad

- Deleted the old middleware file and integrated its functionality into the proxy function for streamlined authentication and role-based access control.
- Updated debug logging to enhance visibility into token presence and user details during the authentication process.
- Adjusted middleware configuration to match all request paths while excluding static files and specific assets.

refactor: Rename middleware function to proxy for clarity ... b25e1cab2d

- Updated the function name from middleware to proxy to better reflect its purpose in handling requests.
- Ensured consistency in naming conventions across the codebase.

refactor: Implement lazy initialization for Prisma client ... b060459f60

- Introduced a lazy initialization function for the Prisma client to optimize resource usage by only initializing when first accessed.
- Enhanced error handling for parsing Prisma Postgres connection strings, providing clearer error messages and logging for debugging.
- Updated the export to use a Proxy for lazy loading, improving performance and maintaining the existing interface.

refactor: Enhance token handling and debug logging in proxy function ... 76cd2782ec

- Explicitly specified the cookie name for token retrieval to align with NextAuth configuration.
- Improved debug logging to include cookie presence checks and detailed cookie information for better troubleshooting.
- Updated comments for clarity on the changes made to token handling and logging.

refactor: Update proxy and image components to support uploads ... 7ced408041

- Modified the proxy function to allow access to the "/uploads" route alongside existing public routes.
- Enhanced PhotoImage and PhotoThumbnail components to handle local uploads by treating them similarly to external URLs.
- Updated comments to clarify the changes made regarding uploads and public folder handling.

feat: Implement user activity logging and upload handling ... 91adbab487

- Enhanced the proxy function to log user activity for both authenticated and unauthenticated requests, capturing details such as IP address, user agent, and referer.
- Introduced a new utility for logging activities, allowing for structured tracking of user actions across various routes.
- Updated photo upload and guess submission routes to log relevant user activity, improving visibility into user interactions.
- Added a script to watch user activity logs in real-time for easier monitoring.

docs: Update architecture and README for file uploads and activity logging ... 889acd0bbd

- Revised architecture documentation to reflect changes in file upload handling, including new API routes and activity logging features.
- Updated README with deployment notes, file upload instructions, and monitoring activity logs.
- Clarified the use of `proxy.ts` for route protection in Next.js 16 and detailed the logging of user activities for both authenticated and unauthenticated requests.

ilia added 1 commit 2026-01-04 16:33:30 -05:00

refactor: Update activity log details type for improved type safety ... 01480586ff

- Changed the type of `details` in the ActivityLog interface and logActivity function from `Record<string, any>` to `Record<string, unknown>` to enhance type safety and clarity.
- Updated the proxy function in Prisma client to use `keyof PrismaClient` for property access, improving type inference and reducing reliance on `any`.

ilia merged commit dfc2ee978d into main 2026-01-04 16:37:35 -05:00

ilia referenced this issue from a commit 2026-01-04 16:37:35 -05:00

Production Deployment Fixes and Enhancements (#3)

Sign in to join this conversation.

Reviewers

No Reviewers

Labels

No items

No Label

Milestone

No items

No Milestone

Projects

Clear projects

No project

Assignees

Clear assignees

ilia

No Assignees

1 Participants

Notifications

Subscribe

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: ilia/mirror_match#3

No description provided.