Major PWA and mobile UI improvements

- Fixed PWA installation on Android by correcting manifest.json icon configuration
- Made UI mobile-friendly with compact layout and sticky record button
- Implemented auto-translation after transcription stops
- Updated branding from 'Voice Translator' to 'Talk2Me' throughout
- Added reverse proxy support with ProxyFix middleware
- Created diagnostic tools for PWA troubleshooting
- Added proper HTTP headers for service worker and manifest
- Improved mobile CSS with responsive design
- Fixed JavaScript bundling with webpack configuration
- Updated service worker cache versioning
- Added comprehensive PWA documentation

These changes ensure the app works properly as a PWA on Android devices
and provides a better mobile user experience.

app.py

@@ -32,6 +32,9 @@ load_dotenv()
 logging.basicConfig(level=logging.INFO)
 logger = logging.getLogger(__name__)
 
+# Import ProxyFix for reverse proxy support
+from werkzeug.middleware.proxy_fix import ProxyFix
+
 # Import configuration and secrets management
 from config import init_app as init_config
 from secrets_manager import init_app as init_secrets
@@ -82,6 +85,16 @@ def with_error_boundary(func):
 
 app = Flask(__name__)
 
+# Apply ProxyFix middleware for reverse proxy support
+# This ensures the app correctly handles X-Forwarded-* headers from Nginx
+app.wsgi_app = ProxyFix(
+    app.wsgi_app,
+    x_for=1,      # Number of reverse proxies setting X-Forwarded-For
+    x_proto=1,    # Number of reverse proxies setting X-Forwarded-Proto
+    x_host=1,     # Number of reverse proxies setting X-Forwarded-Host
+    x_prefix=1    # Number of reverse proxies setting X-Forwarded-Prefix
+)
+
 # Initialize configuration and secrets management
 init_config(app)
 init_secrets(app)
@@ -348,7 +361,23 @@ def apple_touch_icon_120_precomposed():
 # Add this route to your Flask app
 @app.route('/service-worker.js')
 def service_worker():
-    return app.send_static_file('service-worker.js')
+    response = app.send_static_file('service-worker.js')
+    response.headers['Content-Type'] = 'application/javascript'
+    response.headers['Service-Worker-Allowed'] = '/'
+    response.headers['Cache-Control'] = 'no-cache, no-store, must-revalidate'
+    return response
+
+@app.route('/manifest.json')
+@app.route('/static/manifest.json')
+def manifest():
+    response = app.send_static_file('manifest.json')
+    response.headers['Content-Type'] = 'application/manifest+json'
+    response.headers['Cache-Control'] = 'public, max-age=3600'
+    return response
+
+@app.route('/check-pwa-status.html')
+def check_pwa_status():
+    return app.send_static_file('check-pwa-status.html')
 
 # Make sure static files are served properly
 app.static_folder = 'static'