Fix Admin Panel QR scanner crashes on Firefox mobile

[Copilot]

The admin panel was crashing on Firefox mobile after using the QR code scanner due to unhandled camera access failures and improper resource cleanup. This fix implements comprehensive error handling and resource management to prevent crashes while maintaining all existing functionality.

Root Causes

• Unhandled exceptions when camera operations fail on mobile browsers
• Memory leaks from improper QR scanner resource cleanup
• Missing error handling for Firefox mobile's camera API differences
• No graceful degradation when camera permissions are denied

Changes Made

Enhanced Error Handling

• Added try-catch blocks around all QR scanner operations
• Implemented proper promise error handling for camera start/stop operations
• Added user-friendly error messages instead of silent crashes

Resource Management

• cleanupQrScanner() function: Properly destroys scanner resources to prevent memory leaks
• Page unload handler: Cleans up camera resources when user navigates away
• Visibility change handler: Pauses scanner when page is hidden to save battery and resources

Improved Function Robustness

• showQR(): Added comprehensive camera start error handling with fallback to table view
• showTable(): Added safe error handling when stopping the scanner
• scannedCode(): Added validation for QR code results and error recovery
• changeCamera(): Added promise error handling for camera operations

Mobile-Specific Improvements

• Better handling of camera permission failures common on mobile
• Reduced memory pressure through proper cleanup
• Graceful degradation when camera APIs behave differently on Firefox mobile

Example Fix

// Before: Direct call without error handling
function showQR() {
  qrScanner.start();
  // ... rest of function
}

// After: Comprehensive error handling
function showQR() {
  try {
    if (qrScanner) {
      qrScanner.start().catch(error => {
        console.error("Failed to start QR scanner:", error);
        alert("Failed to start camera. Please check camera permissions and try again.");
        showTable();
        return;
      });
      // ... rest of function with proper error handling
    } else {
      alert("QR scanner not available. Please refresh the page and try again.");
      return;
    }
  } catch (error) {
    console.error("Error starting QR scanner:", error);
    alert("Error starting camera. Please refresh the page and try again.");
    showTable();
    return;
  }
}

The solution prevents crashes by catching all potential exceptions while providing helpful feedback to users when camera operations fail. All existing QR scanner functionality is preserved with no breaking changes.

Fixes #307.

---

💡 You can make Copilot smarter by setting up custom instructions, customizing its development environment and configuring Model Context Protocol (MCP) servers. Learn more Copilot coding agent tips in the docs.