Merge multiple QR code documentation files into a single comprehensive guide
that accurately reflects the current implementation. The consolidated guide:
- Combines information from qr-code-implementation-guide.mdc,
qr-code-handling-rule.mdc, and camera-implementation.md
- Clarifies the relationship between ContactQRScanView and ContactQRScanShowView
- Streamlines build configuration documentation
- Adds detailed sections on error handling, security, and best practices
- Improves organization and readability of implementation details
- Removes redundant information while preserving critical details
This change improves documentation maintainability and provides a single
source of truth for QR code implementation details.
- Add CameraState type and CameraStateListener interface for standardized state handling
- Implement camera state tracking in WebInlineQRScanner:
- Add state management properties and methods
- Update state transitions during camera operations
- Add proper error state handling for different scenarios
- Enhance QR scanner UI with improved state feedback:
- Add color-coded status indicators
- Implement state-specific messages and notifications
- Add user-friendly error notifications for common issues
- Improve error handling with specific states for:
- Camera in use by another application
- Permission denied
- Camera not found
- General errors
This change improves the user experience by providing clear visual
feedback about the camera's state and better error handling with
actionable notifications.
- Remove redundant Advanced heading from advanced settings section\n- Make clickable text more descriptive (Show/Hide Advanced Settings)\n- Add cursor-pointer class for better UX\n- Make section heading screen-reader only for accessibility
- Add ARIA annotations and roles to AccountViewView for better screen reader support
- Add role="tooltip" to API server description
- Improve input control accessibility with proper ARIA attributes
- Add descriptive labels and aria-labels for interactive elements
- Create comprehensive README.md for Playwright test suite
- Document test structure and organization
- Add setup instructions and prerequisites
- Include troubleshooting guide and contribution guidelines
- Link to related documentation
This change improves accessibility compliance and makes the test suite
more maintainable for contributors.
- Updated ImageMethodDialog.vue to accept an isRegistered prop and show "Register to Upload a Photo" message instead of upload UI when not registered.
- Updated AccountViewView.vue to pass isRegistered to ImageMethodDialog and replace all profile photo add/upload buttons with the same message for unregistered users.
- Ensures consistent UX and prevents unregistered users from accessing any photo upload features.
- Updated WebPlatformService.takePicture() to use getUserMedia for webcam capture on desktop browsers, providing a live video preview and capture button in an overlay.
- Retained file input with capture attribute for mobile browsers and as a fallback if webcam access fails.
- Ensured interface and factory pattern compatibility; no changes required in PhotoDialog.vue or PlatformServiceFactory.
- Added a stub for writeAndShareFile to satisfy the PlatformService interface on web.
- Removed QR code border
- Changed QR code size to eliminate whitespace baked into image
- Removed scanning frame
- Removed camera selector button
- Restyled camera stop buttons in both web and Capacitor for consistency
- Added iOS safe area to Capacitor camera overlay
Dynamic padding to clear certain iOS UI elements such as the notch, dynamic island and gesture bar, to ensure they don't overlap with our own UI elements.
- Add jsQR library for QR code detection and scanning
- Implement WebInlineQRScanner class with comprehensive camera handling
- Add detailed logging throughout scanner lifecycle
- Include error handling and cleanup procedures
- Add blur detection for QR codes
- Implement FPS throttling for performance optimization
- Add device compatibility checks and permission handling
The scanner now provides:
- Camera stream management
- QR code detection with blur prevention
- Performance optimized scanning (15 FPS target)
- Detailed logging for debugging
- Proper cleanup of resources
- Add proper type annotation for onDetect result parameter
- Fix indentation and line wrapping in template
- Remove unused WebInlineQRScanner import
- Clean up button attribute ordering
- Fix whitespace and formatting issues
- Remove unused empty divs
- Add detailed macOS build procedure for Electron app
- Include instructions for Intel and Universal builds
- Add code signing and notarization requirements
- Document running instructions for .app, .dmg, and .zip formats
- Add security warning handling instructions
- Enhance electron build configuration with proper asset handling
- Add comprehensive logging and error tracking
- Implement CSP headers for security
- Fix module exports for logger compatibility
- Update TypeScript and Vite configs for better build support
- Improve development workflow with better dev tools integration
- Replace all console.log statements with appropriate logger methods in QRScannerDialog.vue
- Replace console.log statements with logger methods in WebDialogQRScanner.ts
- Fix TypeScript type for failsafeTimeout from 'any' to 'unknown'
- Update LogCollector.ts to use 'unknown' type instead of 'any'
- Add eslint-disable comments for console overrides in LogCollector
This change improves logging consistency across the application by using the centralized logger utility, which provides better error handling, log persistence, and environment-aware logging.
- Update QRScannerDialog.vue to handle both array and object detection results in onDetect fallback logic (supports vue-qrcode-reader returning arrays).
- Ensure dialog closes and scan is processed for all detection result shapes.
- Use arrow function for close() to guarantee correct binding with vue-facing-decorator.
- Add enhanced logging for all dialog lifecycle and close/cleanup events.
- In WebDialogQRScanner, use direct mount result (not $refs) for dialogComponent to ensure correct instance.
- Add sessionId and improved logging for dialog open/close/cleanup lifecycle.
Matt Raymer
trentlarson