This MR fixes critical authentication issues that prevented login on localhost and improves the developer experience with consolidated rebuild scripts and a working help modal keyboard shortcut. (#5)

# Fix authentication issues and improve developer experience

## Summary

This MR fixes critical authentication issues that prevented login on localhost and improves the developer experience with consolidated rebuild scripts and a working help modal keyboard shortcut.

## Problems Fixed

### 1. Authentication Issues
- **UntrustedHost Error**: NextAuth v5 was rejecting localhost requests with "UntrustedHost: Host must be trusted" error
- **Cookie Prefix Errors**: Cookies were being set with `__Host-` and `__Secure-` prefixes on HTTP (localhost), causing browser rejection
- **MissingCSRF Error**: CSRF token cookies were not being set correctly due to cookie configuration issues

### 2. Help Modal Keyboard Shortcut
- **Shift+? not working**: The help modal keyboard shortcut was not detecting the question mark key correctly

### 3. Developer Experience
- **Multiple rebuild scripts**: Had several overlapping rebuild scripts that were confusing
- **Unused code**: Removed unused `useSecureCookies` variable and misleading comments

## Changes Made

### Authentication Fixes (`lib/auth.ts`)
- Set `trustHost: true` to fix UntrustedHost error (required for NextAuth v5)
- Added explicit cookie configuration for HTTP (localhost) to prevent prefix errors:
  - Cookies use `secure: false` for HTTP
  - Cookie names without prefixes for HTTP
  - Let Auth.js defaults handle HTTPS (with prefixes and Secure flag)
- Removed unused `useSecureCookies` variable
- Simplified debug logging

### Help Modal Fix (`components/HelpModal.tsx`)
- Fixed keyboard shortcut detection to properly handle Shift+? (Shift+/)
- Updated help text to show correct shortcut (Shift+? instead of Ctrl+?)

### Developer Scripts
- **Consolidated rebuild scripts**: Merged `CLEAN_REBUILD.sh`, `FIX_AND_RESTART.sh`, and `start-server.sh` into single `rebuild.sh`
- **Added REBUILD.md**: Documentation for rebuild process
- Removed redundant script files

### Code Cleanup
- Removed unused `useSecureCookies` variable from `lib/auth.ts`
- Removed misleading comment from `app/api/auth/[...nextauth]/route.ts`
- Cleaned up verbose debug logging

## Technical Details

### Cookie Configuration
The fix works by explicitly configuring cookies for HTTP environments:
- **HTTP (localhost)**: Cookies without prefixes, `secure: false`
- **HTTPS (production)**: Let Auth.js defaults handle (prefixes + Secure flag)

This prevents NextAuth v5 from auto-detecting HTTPS from proxy headers and incorrectly adding cookie prefixes.

### Keyboard Shortcut
The question mark key requires Shift+/ on most keyboards. The fix now properly detects:
- `event.shiftKey && event.key === "/"`
- `event.key === "?"` (fallback)
- `event.code === "Slash" && event.shiftKey` (additional fallback)

## Testing

- ✅ Login works on localhost (http://localhost:3000)
- ✅ No cookie prefix errors in browser console
- ✅ No UntrustedHost errors in server logs
- ✅ Help modal opens/closes with Shift+?
- ✅ Rebuild script works in both dev and prod modes

## Files Changed

### Modified
- `lib/auth.ts` - Authentication configuration fixes
- `components/HelpModal.tsx` - Keyboard shortcut fix
- `app/api/auth/[...nextauth]/route.ts` - Removed misleading comment

### Added
- `rebuild.sh` - Consolidated rebuild script
- `REBUILD.md` - Rebuild documentation

## Migration Notes

No database migrations or environment variable changes required. The fix works with existing configuration.

## Related Issues

Fixes authentication issues preventing local development and testing.

Reviewed-on: #5

__tests__/components/HelpModal.test.tsx

@@ -0,0 +1,117 @@
+import { render, screen, fireEvent, act } from "@testing-library/react"
+import HelpModal from "@/components/HelpModal"
+
+describe("HelpModal", () => {
+  it("should not render initially", () => {
+    render(<HelpModal />)
+    expect(screen.queryByText("Welcome to MirrorMatch")).not.toBeInTheDocument()
+  })
+
+  it("should open when Shift+? is pressed", () => {
+    render(<HelpModal />)
+    
+    // Simulate Shift+? (Shift+/)
+    act(() => {
+      fireEvent.keyDown(window, {
+        key: "/",
+        shiftKey: true,
+        ctrlKey: false,
+        metaKey: false,
+      })
+    })
+    
+    expect(screen.getByText("Welcome to MirrorMatch")).toBeInTheDocument()
+  })
+
+  it("should close when Escape is pressed", () => {
+    render(<HelpModal />)
+    
+    // Open modal first
+    act(() => {
+      fireEvent.keyDown(window, {
+        key: "/",
+        shiftKey: true,
+        ctrlKey: false,
+        metaKey: false,
+      })
+    })
+    
+    expect(screen.getByText("Welcome to MirrorMatch")).toBeInTheDocument()
+    
+    // Close with Escape
+    act(() => {
+      fireEvent.keyDown(window, {
+        key: "Escape",
+      })
+    })
+    
+    // Modal should close
+    expect(screen.queryByText("Welcome to MirrorMatch")).not.toBeInTheDocument()
+  })
+
+  it("should not open with Ctrl+? (should require Shift only)", () => {
+    render(<HelpModal />)
+    
+    // Simulate Ctrl+? (Ctrl+Shift+/)
+    act(() => {
+      fireEvent.keyDown(window, {
+        key: "/",
+        shiftKey: true,
+        ctrlKey: true, // Should prevent opening
+        metaKey: false,
+      })
+    })
+    
+    // Modal should not open when Ctrl is also pressed
+    expect(screen.queryByText("Welcome to MirrorMatch")).not.toBeInTheDocument()
+  })
+
+  it("should toggle when Shift+? is pressed multiple times", () => {
+    render(<HelpModal />)
+    
+    // First press - should open
+    act(() => {
+      fireEvent.keyDown(window, {
+        key: "/",
+        shiftKey: true,
+        ctrlKey: false,
+        metaKey: false,
+      })
+    })
+    
+    expect(screen.getByText("Welcome to MirrorMatch")).toBeInTheDocument()
+    
+    // Second press - should close
+    act(() => {
+      fireEvent.keyDown(window, {
+        key: "/",
+        shiftKey: true,
+        ctrlKey: false,
+        metaKey: false,
+      })
+    })
+    
+    expect(screen.queryByText("Welcome to MirrorMatch")).not.toBeInTheDocument()
+  })
+
+  it("should display help content when open", () => {
+    render(<HelpModal />)
+    
+    // Open modal
+    act(() => {
+      fireEvent.keyDown(window, {
+        key: "/",
+        shiftKey: true,
+        ctrlKey: false,
+        metaKey: false,
+      })
+    })
+    
+    // Check for key content sections
+    expect(screen.getByText("What is MirrorMatch?")).toBeInTheDocument()
+    expect(screen.getByText("How to Play")).toBeInTheDocument()
+    expect(screen.getByText("Key Features")).toBeInTheDocument()
+    expect(screen.getByText("Keyboard Shortcuts")).toBeInTheDocument()
+    expect(screen.getByText("Tips")).toBeInTheDocument()
+  })
+})

__tests__/lib/activity-log.test.ts

@@ -0,0 +1,209 @@
+import { logActivity } from '@/lib/activity-log';
+import { logger } from '@/lib/logger';
+
+// Mock the logger
+jest.mock('@/lib/logger', () => ({
+  logger: {
+    info: jest.fn(),
+    debug: jest.fn(),
+    warn: jest.fn(),
+    error: jest.fn(),
+  },
+}));
+
+// Helper to create a mock Request object
+function createMockRequest(headers: Record<string, string> = {}): Request {
+  const mockHeaders = new Headers();
+  Object.entries(headers).forEach(([key, value]) => {
+    mockHeaders.set(key, value);
+  });
+
+  return {
+    headers: mockHeaders,
+  } as unknown as Request;
+}
+
+describe('activity-log', () => {
+  beforeEach(() => {
+    jest.clearAllMocks();
+  });
+
+  describe('logActivity', () => {
+    it('should create activity log with all fields', () => {
+      const mockRequest = createMockRequest({
+        'x-forwarded-for': '192.168.1.1',
+      });
+
+      const user = {
+        id: 'user-123',
+        email: 'test@example.com',
+        role: 'USER',
+      };
+
+      const details = { photoId: 'photo-456' };
+
+      const result = logActivity(
+        'PHOTO_UPLOAD',
+        '/api/photos/upload',
+        'POST',
+        user,
+        details,
+        mockRequest
+      );
+
+      expect(result).toMatchObject({
+        action: 'PHOTO_UPLOAD',
+        path: '/api/photos/upload',
+        method: 'POST',
+        userId: 'user-123',
+        userEmail: 'test@example.com',
+        userRole: 'USER',
+        ip: '192.168.1.1',
+        details: { photoId: 'photo-456' },
+      });
+      expect(result.timestamp).toBeDefined();
+    });
+
+    it('should handle unauthenticated users', () => {
+      const result = logActivity(
+        'PAGE_VIEW',
+        '/photos',
+        'GET',
+        null,
+        undefined,
+        undefined
+      );
+
+      expect(result).toMatchObject({
+        action: 'PAGE_VIEW',
+        path: '/photos',
+        method: 'GET',
+        userId: undefined,
+        userEmail: undefined,
+        userRole: undefined,
+        ip: 'unknown',
+      });
+    });
+
+    it('should extract IP from x-forwarded-for header', () => {
+      const mockRequest = createMockRequest({
+        'x-forwarded-for': '192.168.1.1, 10.0.0.1',
+      });
+
+      const result = logActivity(
+        'ACTION',
+        '/path',
+        'GET',
+        undefined,
+        undefined,
+        mockRequest
+      );
+
+      expect(result.ip).toBe('192.168.1.1');
+    });
+
+    it('should extract IP from x-real-ip header when x-forwarded-for is missing', () => {
+      const mockRequest = createMockRequest({
+        'x-real-ip': '10.0.0.1',
+      });
+
+      const result = logActivity(
+        'ACTION',
+        '/path',
+        'GET',
+        undefined,
+        undefined,
+        mockRequest
+      );
+
+      expect(result.ip).toBe('10.0.0.1');
+    });
+
+    it('should use "unknown" for IP when no headers are present', () => {
+      const mockRequest = createMockRequest();
+
+      const result = logActivity(
+        'ACTION',
+        '/path',
+        'GET',
+        undefined,
+        undefined,
+        mockRequest
+      );
+
+      expect(result.ip).toBe('unknown');
+    });
+
+    it('should call logger.info with structured data', () => {
+      const user = {
+        id: 'user-123',
+        email: 'test@example.com',
+        role: 'USER',
+      };
+
+      const details = { photoId: 'photo-456' };
+
+      logActivity(
+        'PHOTO_UPLOAD',
+        '/api/photos/upload',
+        'POST',
+        user,
+        details
+      );
+
+      expect(logger.info).toHaveBeenCalledWith(
+        'Activity: PHOTO_UPLOAD',
+        expect.objectContaining({
+          method: 'POST',
+          path: '/api/photos/upload',
+          userId: 'user-123',
+          userEmail: 'test@example.com',
+          userRole: 'USER',
+          details: { photoId: 'photo-456' },
+        })
+      );
+    });
+
+    it('should not include details in logger call when details are not provided', () => {
+      const user = {
+        id: 'user-123',
+        email: 'test@example.com',
+        role: 'USER',
+      };
+
+      logActivity(
+        'PAGE_VIEW',
+        '/photos',
+        'GET',
+        user
+      );
+
+      expect(logger.info).toHaveBeenCalledWith(
+        'Activity: PAGE_VIEW',
+        expect.objectContaining({
+          method: 'GET',
+          path: '/photos',
+          userId: 'user-123',
+          userEmail: 'test@example.com',
+          userRole: 'USER',
+        })
+      );
+
+      const callArgs = (logger.info as jest.Mock).mock.calls[0][1];
+      expect(callArgs).not.toHaveProperty('details');
+    });
+
+    it('should handle empty details object', () => {
+      const result = logActivity(
+        'ACTION',
+        '/path',
+        'GET',
+        undefined,
+        {}
+      );
+
+      expect(result.details).toEqual({});
+      expect(logger.info).toHaveBeenCalled();
+    });
+  });
+});

__tests__/lib/logger.test.ts

@@ -0,0 +1,210 @@
+import { logger, LogLevel, getLogLevel, formatLog, createLogger } from '@/lib/logger';
+
+// Mock console methods
+const originalConsole = { ...console };
+const mockConsole = {
+  log: jest.fn(),
+  warn: jest.fn(),
+  error: jest.fn(),
+};
+
+describe('Logger', () => {
+  const originalEnv = { ...process.env };
+
+  beforeEach(() => {
+    jest.clearAllMocks();
+    console.log = mockConsole.log;
+    console.warn = mockConsole.warn;
+    console.error = mockConsole.error;
+    // Reset environment variables
+    process.env = { ...originalEnv };
+    // Use type assertion to allow deletion
+    delete (process.env as { LOG_LEVEL?: string }).LOG_LEVEL;
+    delete (process.env as { LOG_FORMAT?: string }).LOG_FORMAT;
+    delete (process.env as { NODE_ENV?: string }).NODE_ENV;
+  });
+
+  afterEach(() => {
+    process.env = originalEnv;
+  });
+
+  afterEach(() => {
+    console.log = originalConsole.log;
+    console.warn = originalConsole.warn;
+    console.error = originalConsole.error;
+  });
+
+  describe('getLogLevel', () => {
+    it('should return DEBUG when LOG_LEVEL=DEBUG', () => {
+      process.env.LOG_LEVEL = 'DEBUG';
+      expect(getLogLevel()).toBe(LogLevel.DEBUG);
+    });
+
+    it('should return INFO when LOG_LEVEL=INFO', () => {
+      process.env.LOG_LEVEL = 'INFO';
+      expect(getLogLevel()).toBe(LogLevel.INFO);
+    });
+
+    it('should return WARN when LOG_LEVEL=WARN', () => {
+      process.env.LOG_LEVEL = 'WARN';
+      expect(getLogLevel()).toBe(LogLevel.WARN);
+    });
+
+    it('should return ERROR when LOG_LEVEL=ERROR', () => {
+      process.env.LOG_LEVEL = 'ERROR';
+      expect(getLogLevel()).toBe(LogLevel.ERROR);
+    });
+
+    it('should return NONE when LOG_LEVEL=NONE', () => {
+      process.env.LOG_LEVEL = 'NONE';
+      expect(getLogLevel()).toBe(LogLevel.NONE);
+    });
+
+    it('should default to DEBUG in development', () => {
+      (process.env as { NODE_ENV?: string }).NODE_ENV = 'development';
+      expect(getLogLevel()).toBe(LogLevel.DEBUG);
+    });
+
+    it('should default to INFO in production', () => {
+      (process.env as { NODE_ENV?: string }).NODE_ENV = 'production';
+      expect(getLogLevel()).toBe(LogLevel.INFO);
+    });
+
+    it('should ignore invalid LOG_LEVEL values and use defaults', () => {
+      (process.env as { LOG_LEVEL?: string }).LOG_LEVEL = 'INVALID';
+      (process.env as { NODE_ENV?: string }).NODE_ENV = 'production';
+      expect(getLogLevel()).toBe(LogLevel.INFO);
+    });
+  });
+
+  describe('formatLog', () => {
+    it('should format log in human-readable format by default', () => {
+      const result = formatLog(LogLevel.INFO, 'Test message', { key: 'value' });
+      expect(result).toContain('[INFO]');
+      expect(result).toContain('Test message');
+      expect(result).toContain('{"key":"value"}');
+    });
+
+    it('should format log as JSON when LOG_FORMAT=json', () => {
+      process.env.LOG_FORMAT = 'json';
+      const result = formatLog(LogLevel.INFO, 'Test message', { key: 'value' });
+      const parsed = JSON.parse(result);
+      expect(parsed.level).toBe('INFO');
+      expect(parsed.message).toBe('Test message');
+      expect(parsed.key).toBe('value');
+      expect(parsed.timestamp).toBeDefined();
+    });
+
+    it('should format Error objects correctly', () => {
+      const error = new Error('Test error');
+      const result = formatLog(LogLevel.ERROR, 'Error occurred', error);
+      expect(result).toContain('[ERROR]');
+      expect(result).toContain('Error occurred');
+      expect(result).toContain('Error: Error: Test error');
+    });
+
+    it('should format Error objects as JSON when LOG_FORMAT=json', () => {
+      process.env.LOG_FORMAT = 'json';
+      const error = new Error('Test error');
+      const result = formatLog(LogLevel.ERROR, 'Error occurred', error);
+      const parsed = JSON.parse(result);
+      expect(parsed.level).toBe('ERROR');
+      expect(parsed.message).toBe('Error occurred');
+      expect(parsed.error.name).toBe('Error');
+      expect(parsed.error.message).toBe('Test error');
+      expect(parsed.error.stack).toBeDefined();
+    });
+
+    it('should handle logs without context', () => {
+      const result = formatLog(LogLevel.INFO, 'Simple message');
+      expect(result).toContain('[INFO]');
+      expect(result).toContain('Simple message');
+      // Format always includes pipe separator, but no context data after it
+      expect(result).toContain('|');
+      expect(result.split('|').length).toBe(2); // timestamp | message (no context)
+    });
+  });
+
+  describe('Logger instance', () => {
+    it('should log DEBUG messages when level is DEBUG', () => {
+      process.env.LOG_LEVEL = 'DEBUG';
+      const testLogger = createLogger();
+      testLogger.debug('Debug message', { data: 'test' });
+      expect(mockConsole.log).toHaveBeenCalled();
+    });
+
+    it('should not log DEBUG messages when level is INFO', () => {
+      process.env.LOG_LEVEL = 'INFO';
+      const testLogger = createLogger();
+      testLogger.debug('Debug message');
+      expect(mockConsole.log).not.toHaveBeenCalled();
+    });
+
+    it('should log INFO messages when level is INFO', () => {
+      process.env.LOG_LEVEL = 'INFO';
+      const testLogger = createLogger();
+      testLogger.info('Info message');
+      expect(mockConsole.log).toHaveBeenCalled();
+    });
+
+    it('should log WARN messages when level is WARN', () => {
+      process.env.LOG_LEVEL = 'WARN';
+      const testLogger = createLogger();
+      testLogger.warn('Warning message');
+      expect(mockConsole.warn).toHaveBeenCalled();
+    });
+
+    it('should not log INFO messages when level is WARN', () => {
+      process.env.LOG_LEVEL = 'WARN';
+      const testLogger = createLogger();
+      testLogger.info('Info message');
+      expect(mockConsole.log).not.toHaveBeenCalled();
+    });
+
+    it('should log ERROR messages when level is ERROR', () => {
+      process.env.LOG_LEVEL = 'ERROR';
+      const testLogger = createLogger();
+      testLogger.error('Error message');
+      expect(mockConsole.error).toHaveBeenCalled();
+    });
+
+    it('should not log any messages when level is NONE', () => {
+      process.env.LOG_LEVEL = 'NONE';
+      const testLogger = createLogger();
+      testLogger.debug('Debug message');
+      testLogger.info('Info message');
+      testLogger.warn('Warning message');
+      testLogger.error('Error message');
+      expect(mockConsole.log).not.toHaveBeenCalled();
+      expect(mockConsole.warn).not.toHaveBeenCalled();
+      expect(mockConsole.error).not.toHaveBeenCalled();
+    });
+
+    it('should handle Error objects in error method', () => {
+      process.env.LOG_LEVEL = 'ERROR';
+      const testLogger = createLogger();
+      const error = new Error('Test error');
+      testLogger.error('Error occurred', error);
+      expect(mockConsole.error).toHaveBeenCalled();
+      const callArgs = mockConsole.error.mock.calls[0][0];
+      expect(callArgs).toContain('Error occurred');
+    });
+
+    it('isLevelEnabled should return correct values', () => {
+      process.env.LOG_LEVEL = 'WARN';
+      const testLogger = createLogger();
+      expect(testLogger.isLevelEnabled(LogLevel.DEBUG)).toBe(false);
+      expect(testLogger.isLevelEnabled(LogLevel.INFO)).toBe(false);
+      expect(testLogger.isLevelEnabled(LogLevel.WARN)).toBe(true);
+      expect(testLogger.isLevelEnabled(LogLevel.ERROR)).toBe(true);
+    });
+  });
+
+  describe('Default logger instance', () => {
+    it('should be available and functional', () => {
+      process.env.LOG_LEVEL = 'INFO';
+      logger.info('Test message');
+      expect(mockConsole.log).toHaveBeenCalled();
+    });
+  });
+});