Replace native Twilio Voice SDK with WebView-based softphone

Rewrites the mobile app from a native Twilio Voice SDK integration
(Android Telecom/ConnectionService) to a thin WebView shell that loads
a standalone browser phone page from WordPress. This eliminates the
buggy Android phone account registration, fixes frequent logouts by
using 7-day WP session cookies instead of JWT tokens, and maintains
all existing call features (dialpad, queues, hold, transfer, requeue,
recording, caller ID, agent status).

Server-side:
- Add class-twp-mobile-phone-page.php: standalone /twp-phone/ endpoint
  with mobile-optimized UI, dark mode, tab navigation, and Flutter
  WebView JS bridge
- Extend auth cookie to 7 days for phone agents
- Add WP AJAX handler for FCM token registration (cookie auth)

Flutter app (v2.0.0):
- Replace 18 native files with 5-file WebView shell
- Login via wp-login.php in WebView (auto-detect redirect on success)
- Full-screen WebView with auto microphone grant for WebRTC
- FCM push notifications preserved for queue alerts
- Remove: twilio_voice, dio, provider, JWT auth, SSE, native call UI

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

mobile/lib/services/api_client.dart

@@ -1,85 +0,0 @@
-import 'package:dio/dio.dart';
-import 'package:flutter_secure_storage/flutter_secure_storage.dart';
-
-class ApiClient {
-  late final Dio dio;
-  final FlutterSecureStorage _storage = const FlutterSecureStorage();
-  VoidCallback? onForceLogout;
-
-  ApiClient() {
-    dio = Dio(BaseOptions(
-      connectTimeout: const Duration(seconds: 15),
-      receiveTimeout: const Duration(seconds: 30),
-    ));
-
-    dio.interceptors.add(InterceptorsWrapper(
-      onRequest: (options, handler) async {
-        final token = await _storage.read(key: 'access_token');
-        if (token != null) {
-          options.headers['Authorization'] = 'Bearer $token';
-        }
-        handler.next(options);
-      },
-      onError: (error, handler) async {
-        if (error.response?.statusCode == 401) {
-          final refreshed = await _tryRefreshToken();
-          if (refreshed) {
-            final opts = error.requestOptions;
-            final token = await _storage.read(key: 'access_token');
-            opts.headers['Authorization'] = 'Bearer $token';
-            try {
-              final response = await dio.fetch(opts);
-              return handler.resolve(response);
-            } catch (e) {
-              return handler.next(error);
-            }
-          } else {
-            onForceLogout?.call();
-          }
-        }
-        handler.next(error);
-      },
-    ));
-  }
-
-  Future<void> setBaseUrl(String serverUrl) async {
-    final url = serverUrl.endsWith('/')
-        ? serverUrl.substring(0, serverUrl.length - 1)
-        : serverUrl;
-    dio.options.baseUrl = '$url/wp-json/twilio-mobile/v1';
-    await _storage.write(key: 'server_url', value: url);
-  }
-
-  Future<void> restoreBaseUrl() async {
-    final url = await _storage.read(key: 'server_url');
-    if (url != null) {
-      dio.options.baseUrl = '$url/wp-json/twilio-mobile/v1';
-    }
-  }
-
-  Future<bool> _tryRefreshToken() async {
-    try {
-      final refreshToken = await _storage.read(key: 'refresh_token');
-      if (refreshToken == null) return false;
-
-      final response = await dio.post(
-        '/auth/refresh',
-        data: {'refresh_token': refreshToken},
-        options: Options(headers: {'Authorization': ''}),
-      );
-
-      if (response.statusCode == 200 && response.data['success'] == true) {
-        await _storage.write(
-            key: 'access_token', value: response.data['access_token']);
-        if (response.data['refresh_token'] != null) {
-          await _storage.write(
-              key: 'refresh_token', value: response.data['refresh_token']);
-        }
-        return true;
-      }
-    } catch (_) {}
-    return false;
-  }
-}
-
-typedef VoidCallback = void Function();

mobile/lib/services/auth_service.dart

@@ -1,108 +0,0 @@
-import 'dart:async';
-import 'dart:convert';
-import 'package:dio/dio.dart';
-import 'package:flutter_secure_storage/flutter_secure_storage.dart';
-import '../models/user.dart';
-import 'api_client.dart';
-
-class AuthService {
-  final ApiClient _api;
-  final FlutterSecureStorage _storage = const FlutterSecureStorage();
-  Timer? _refreshTimer;
-
-  AuthService(this._api);
-
-  Future<User> login(String serverUrl, String username, String password,
-      {String? fcmToken}) async {
-    await _api.setBaseUrl(serverUrl);
-
-    final response = await _api.dio.post(
-      '/auth/login',
-      data: {
-        'username': username,
-        'password': password,
-        if (fcmToken != null) 'fcm_token': fcmToken,
-      },
-      options: Options(receiveTimeout: const Duration(seconds: 60)),
-    );
-
-    final data = response.data;
-    if (data['success'] != true) {
-      throw Exception(data['message'] ?? 'Login failed');
-    }
-
-    await _storage.write(key: 'access_token', value: data['access_token']);
-    await _storage.write(key: 'refresh_token', value: data['refresh_token']);
-    await _storage.write(key: 'user_data', value: jsonEncode(data['user']));
-
-    _scheduleRefresh(data['expires_in'] as int? ?? 3600);
-
-    return User.fromJson(data['user']);
-  }
-
-  Future<User?> tryRestoreSession() async {
-    final token = await _storage.read(key: 'access_token');
-    if (token == null) return null;
-
-    await _api.restoreBaseUrl();
-    if (_api.dio.options.baseUrl.isEmpty) return null;
-
-    try {
-      final response = await _api.dio.get('/agent/status');
-      if (response.statusCode != 200) return null;
-
-      final userData = await _storage.read(key: 'user_data');
-      if (userData != null) {
-        return User.fromJson(jsonDecode(userData) as Map<String, dynamic>);
-      }
-      return null;
-    } catch (_) {
-      return null;
-    }
-  }
-
-  Future<void> refreshToken() async {
-    final refreshToken = await _storage.read(key: 'refresh_token');
-    if (refreshToken == null) throw Exception('No refresh token');
-
-    final response = await _api.dio.post('/auth/refresh', data: {
-      'refresh_token': refreshToken,
-    });
-
-    final data = response.data;
-    if (data['success'] != true) {
-      throw Exception('Token refresh failed');
-    }
-
-    await _storage.write(key: 'access_token', value: data['access_token']);
-    if (data['refresh_token'] != null) {
-      await _storage.write(key: 'refresh_token', value: data['refresh_token']);
-    }
-
-    _scheduleRefresh(data['expires_in'] as int? ?? 3600);
-  }
-
-  void _scheduleRefresh(int expiresInSeconds) {
-    _refreshTimer?.cancel();
-    // Refresh 2 minutes before expiry
-    final refreshIn = Duration(seconds: expiresInSeconds - 120);
-    if (refreshIn.isNegative) return;
-    _refreshTimer = Timer(refreshIn, () async {
-      try {
-        await refreshToken();
-      } catch (_) {}
-    });
-  }
-
-  Future<void> logout() async {
-    _refreshTimer?.cancel();
-    try {
-      await _api.dio.post('/auth/logout');
-    } catch (_) {}
-    await _storage.deleteAll();
-  }
-
-  void dispose() {
-    _refreshTimer?.cancel();
-  }
-}

mobile/lib/services/push_notification_service.dart

@@ -3,12 +3,11 @@ import 'package:firebase_core/firebase_core.dart';
 import 'package:firebase_messaging/firebase_messaging.dart';
 import 'package:flutter/foundation.dart';
 import 'package:flutter_local_notifications/flutter_local_notifications.dart';
-import 'api_client.dart';
 
 /// Notification ID for queue alerts (fixed so we can cancel it).
 const int _queueAlertNotificationId = 9001;
 
-/// Background handler — must be top-level function.
+/// Background handler -- must be top-level function.
 @pragma('vm:entry-point')
 Future<void> _firebaseMessagingBackgroundHandler(RemoteMessage message) async {
   await Firebase.initializeApp();
@@ -21,7 +20,6 @@ Future<void> _firebaseMessagingBackgroundHandler(RemoteMessage message) async {
     final plugin = FlutterLocalNotificationsPlugin();
     await plugin.cancel(_queueAlertNotificationId);
   }
-  // VoIP pushes handled natively by twilio_voice plugin.
 }
 
 /// Show an insistent queue alert notification (works from background handler too).
@@ -57,8 +55,12 @@ Future<void> _showQueueAlertNotification(Map<String, dynamic> data) async {
   );
 }
 
+/// Push notification service for queue alerts and general notifications.
+///
+/// FCM token registration is handled via the WebView JavaScript bridge
+/// instead of a REST API call. The token is exposed via [fcmToken] and
+/// injected into the web page by [PhoneScreen].
 class PushNotificationService {
-  final ApiClient _api;
   final FirebaseMessaging _messaging = FirebaseMessaging.instance;
   final FlutterLocalNotificationsPlugin _localNotifications =
       FlutterLocalNotificationsPlugin();
@@ -66,8 +68,6 @@ class PushNotificationService {
 
   String? get fcmToken => _fcmToken;
 
-  PushNotificationService(this._api);
-
   Future<void> initialize() async {
     FirebaseMessaging.onBackgroundMessage(_firebaseMessagingBackgroundHandler);
 
@@ -84,43 +84,37 @@ class PushNotificationService {
     const initSettings = InitializationSettings(android: androidSettings);
     await _localNotifications.initialize(initSettings);
 
-    // Get and register FCM token
+    // Get FCM token
     final token = await _messaging.getToken();
-    debugPrint('FCM token: ${token != null ? "${token.substring(0, 20)}..." : "NULL"}');
+    debugPrint(
+        'FCM token: ${token != null ? "${token.substring(0, 20)}..." : "NULL"}');
     if (token != null) {
       _fcmToken = token;
-      await _registerToken(token);
     } else {
-      debugPrint('FCM: Failed to get token - Firebase may not be configured correctly');
+      debugPrint(
+          'FCM: Failed to get token - Firebase may not be configured correctly');
     }
 
     // Listen for token refresh
-    _messaging.onTokenRefresh.listen(_registerToken);
+    _messaging.onTokenRefresh.listen((token) {
+      _fcmToken = token;
+    });
 
-    // Handle foreground messages (non-VoIP)
+    // Handle foreground messages
     FirebaseMessaging.onMessage.listen(_handleForegroundMessage);
   }
 
-  Future<void> _registerToken(String token) async {
-    try {
-      await _api.dio.post('/fcm/register', data: {'fcm_token': token});
-    } catch (_) {}
-  }
-
   void _handleForegroundMessage(RemoteMessage message) {
     final data = message.data;
     final type = data['type'];
 
-    // VoIP incoming_call is handled by twilio_voice natively
-    if (type == 'incoming_call') return;
-
-    // Queue alert — show insistent notification
+    // Queue alert -- show insistent notification
     if (type == 'queue_alert') {
       _showQueueAlertNotification(data);
       return;
     }
 
-    // Queue alert cancel — dismiss notification
+    // Queue alert cancel -- dismiss notification
     if (type == 'queue_alert_cancel') {
       _localNotifications.cancel(_queueAlertNotificationId);
       return;
@@ -142,7 +136,7 @@ class PushNotificationService {
     );
   }
 
-  /// Cancel any active queue alert (called when agent accepts a call in-app).
+  /// Cancel any active queue alert.
   void cancelQueueAlert() {
     _localNotifications.cancel(_queueAlertNotificationId);
   }

mobile/lib/services/sse_service.dart

@@ -1,238 +0,0 @@
-import 'dart:async';
-import 'dart:convert';
-import 'dart:math';
-import 'package:dio/dio.dart';
-import 'package:flutter/foundation.dart';
-import 'package:flutter_secure_storage/flutter_secure_storage.dart';
-import '../config/app_config.dart';
-import 'api_client.dart';
-
-class SseEvent {
-  final String event;
-  final Map<String, dynamic> data;
-
-  SseEvent({required this.event, required this.data});
-}
-
-class SseService {
-  final ApiClient _api;
-  final FlutterSecureStorage _storage = const FlutterSecureStorage();
-  final StreamController<SseEvent> _eventController =
-      StreamController<SseEvent>.broadcast();
-  final StreamController<bool> _connectionController =
-      StreamController<bool>.broadcast();
-
-  CancelToken? _cancelToken;
-  Timer? _reconnectTimer;
-  int _reconnectAttempt = 0;
-  bool _shouldReconnect = true;
-  int _sseFailures = 0;
-  Timer? _pollTimer;
-  Map<String, dynamic>? _previousPollState;
-
-  Stream<SseEvent> get events => _eventController.stream;
-  Stream<bool> get connectionState => _connectionController.stream;
-
-  SseService(this._api);
-
-  Future<void> connect() async {
-    _shouldReconnect = true;
-    _reconnectAttempt = 0;
-    _sseFailures = 0;
-    await _doConnect();
-  }
-
-  Future<void> _doConnect() async {
-    // After 2 SSE failures, fall back to polling
-    if (_sseFailures >= 2) {
-      debugPrint('SSE: falling back to polling after $_sseFailures failures');
-      _startPolling();
-      return;
-    }
-
-    _cancelToken?.cancel();
-    _cancelToken = CancelToken();
-
-    // Timer to detect if SSE stream never delivers data (Apache buffering)
-    Timer? firstDataTimer;
-    bool gotData = false;
-
-    try {
-      final token = await _storage.read(key: 'access_token');
-      debugPrint('SSE: connecting via stream (attempt ${_sseFailures + 1})');
-
-      firstDataTimer = Timer(const Duration(seconds: 8), () {
-        if (!gotData) {
-          debugPrint('SSE: no data received in 8s, cancelling');
-          _cancelToken?.cancel();
-        }
-      });
-
-      final response = await _api.dio.get(
-        '/stream/events',
-        options: Options(
-          headers: {'Authorization': 'Bearer $token'},
-          responseType: ResponseType.stream,
-          receiveTimeout: Duration.zero,
-        ),
-        cancelToken: _cancelToken,
-      );
-
-      debugPrint('SSE: connected, status=${response.statusCode}');
-      _connectionController.add(true);
-      _reconnectAttempt = 0;
-      _sseFailures = 0;
-
-      final stream = response.data.stream as Stream<List<int>>;
-      String buffer = '';
-
-      await for (final chunk in stream) {
-        if (!gotData) {
-          gotData = true;
-          firstDataTimer.cancel();
-          debugPrint('SSE: first data received');
-        }
-        buffer += utf8.decode(chunk);
-        final lines = buffer.split('\n');
-        buffer = lines.removeLast();
-
-        String? eventName;
-        String? dataStr;
-
-        for (final line in lines) {
-          if (line.startsWith('event:')) {
-            eventName = line.substring(6).trim();
-          } else if (line.startsWith('data:')) {
-            dataStr = line.substring(5).trim();
-          } else if (line.isEmpty && eventName != null && dataStr != null) {
-            try {
-              final data = jsonDecode(dataStr) as Map<String, dynamic>;
-              _eventController.add(SseEvent(event: eventName, data: data));
-            } catch (_) {}
-            eventName = null;
-            dataStr = null;
-          }
-        }
-      }
-    } catch (e) {
-      firstDataTimer?.cancel();
-      // Distinguish user-initiated cancel from timeout cancel
-      if (e is DioException && e.type == DioExceptionType.cancel) {
-        if (!gotData && _shouldReconnect) {
-          // Cancelled by our firstDataTimer — count as SSE failure
-          debugPrint('SSE: stream timed out (no data), failure ${_sseFailures + 1}');
-          _sseFailures++;
-          _connectionController.add(false);
-        } else {
-          return; // User-initiated disconnect
-        }
-      } else {
-        debugPrint('SSE: stream error: $e');
-        _sseFailures++;
-        _connectionController.add(false);
-      }
-    }
-
-    if (_shouldReconnect) {
-      _scheduleReconnect();
-    }
-  }
-
-  void _scheduleReconnect() {
-    _reconnectTimer?.cancel();
-    final delay = Duration(
-      milliseconds: min(
-        AppConfig.sseMaxReconnect.inMilliseconds,
-        AppConfig.sseReconnectBase.inMilliseconds *
-            pow(2, _reconnectAttempt).toInt(),
-      ),
-    );
-    _reconnectAttempt++;
-    _reconnectTimer = Timer(delay, _doConnect);
-  }
-
-  // Polling fallback when SSE streaming doesn't work
-  void _startPolling() {
-    _pollTimer?.cancel();
-    _previousPollState = null;
-    _poll();
-    _pollTimer = Timer.periodic(const Duration(seconds: 5), (_) => _poll());
-  }
-
-  Future<void> _poll() async {
-    if (!_shouldReconnect) return;
-    try {
-      final response = await _api.dio.get('/stream/poll');
-      final data = Map<String, dynamic>.from(response.data);
-      _connectionController.add(true);
-
-      if (_previousPollState != null) {
-        _diffAndEmit(_previousPollState!, data);
-      }
-      _previousPollState = data;
-    } catch (e) {
-      debugPrint('SSE poll error: $e');
-      _connectionController.add(false);
-    }
-  }
-
-  void _diffAndEmit(Map<String, dynamic> prev, Map<String, dynamic> curr) {
-    final prevStatus = prev['agent_status']?.toString();
-    final currStatus = curr['agent_status']?.toString();
-    if (prevStatus != currStatus) {
-      _eventController.add(SseEvent(
-        event: 'agent_status_changed',
-        data: (curr['agent_status'] as Map<String, dynamic>?) ?? {},
-      ));
-    }
-
-    final prevQueues = prev['queues'] as Map<String, dynamic>? ?? {};
-    final currQueues = curr['queues'] as Map<String, dynamic>? ?? {};
-    for (final entry in currQueues.entries) {
-      final currQueue = Map<String, dynamic>.from(entry.value);
-      final prevQueue = prevQueues[entry.key] as Map<String, dynamic>?;
-      if (prevQueue == null) {
-        _eventController.add(SseEvent(event: 'queue_added', data: currQueue));
-        continue;
-      }
-      final currCount = currQueue['waiting_count'] as int? ?? 0;
-      final prevCount = prevQueue['waiting_count'] as int? ?? 0;
-      if (currCount > prevCount) {
-        _eventController.add(SseEvent(event: 'call_enqueued', data: currQueue));
-      } else if (currCount < prevCount) {
-        _eventController.add(SseEvent(event: 'call_dequeued', data: currQueue));
-      }
-    }
-
-    final prevCall = prev['current_call']?.toString();
-    final currCall = curr['current_call']?.toString();
-    if (prevCall != currCall) {
-      if (curr['current_call'] != null && prev['current_call'] == null) {
-        _eventController.add(SseEvent(
-          event: 'call_started',
-          data: curr['current_call'] as Map<String, dynamic>,
-        ));
-      } else if (curr['current_call'] == null && prev['current_call'] != null) {
-        _eventController.add(SseEvent(
-          event: 'call_ended',
-          data: prev['current_call'] as Map<String, dynamic>,
-        ));
-      }
-    }
-  }
-
-  void disconnect() {
-    _shouldReconnect = false;
-    _reconnectTimer?.cancel();
-    _pollTimer?.cancel();
-    _pollTimer = null;
-    _cancelToken?.cancel();
-    _connectionController.add(false);
-  }
-
-  void dispose() {
-    disconnect();
-    _eventController.close();
-    _connectionController.close();
-  }
-}

mobile/lib/services/voice_service.dart

@@ -1,146 +0,0 @@
-import 'dart:async';
-import 'dart:io';
-import 'package:dio/dio.dart';
-import 'package:flutter/foundation.dart';
-import 'package:twilio_voice/twilio_voice.dart';
-import 'api_client.dart';
-
-class VoiceService {
-  final ApiClient _api;
-  Timer? _tokenRefreshTimer;
-  String? _identity;
-  String? _deviceToken;
-  StreamSubscription? _eventSubscription;
-
-  final StreamController<CallEvent> _callEventController =
-      StreamController<CallEvent>.broadcast();
-  Stream<CallEvent> get callEvents => _callEventController.stream;
-
-  VoiceService(this._api);
-
-  Future<void> initialize({String? deviceToken}) async {
-    _deviceToken = deviceToken;
-    debugPrint('VoiceService.initialize: deviceToken=${deviceToken != null ? "present (${deviceToken.length} chars)" : "NULL"}');
-
-    // Request permissions (Android telecom requires these)
-    await TwilioVoice.instance.requestMicAccess();
-    if (!kIsWeb && Platform.isAndroid) {
-      await TwilioVoice.instance.requestReadPhoneStatePermission();
-      await TwilioVoice.instance.requestReadPhoneNumbersPermission();
-      await TwilioVoice.instance.requestCallPhonePermission();
-      await TwilioVoice.instance.requestManageOwnCallsPermission();
-      // Register phone account with Android telecom
-      // (enabling is handled by dashboard UI with a user-friendly dialog)
-      await TwilioVoice.instance.registerPhoneAccount();
-    }
-
-    // Fetch token and register
-    await _fetchAndRegisterToken();
-
-    // Listen for call events (only once)
-    _eventSubscription ??= TwilioVoice.instance.callEventsListener.listen((event) {
-      if (!_callEventController.isClosed) {
-        _callEventController.add(event);
-      }
-    });
-
-    // Refresh token every 50 minutes
-    _tokenRefreshTimer?.cancel();
-    _tokenRefreshTimer = Timer.periodic(
-      const Duration(minutes: 50),
-      (_) => _fetchAndRegisterToken(),
-    );
-  }
-
-  Future<void> _fetchAndRegisterToken() async {
-    try {
-      final response = await _api.dio.get('/voice/token');
-      final data = response.data;
-      final token = data['token'] as String;
-      _identity = data['identity'] as String;
-      await TwilioVoice.instance.setTokens(
-        accessToken: token,
-        deviceToken: _deviceToken ?? 'no-fcm',
-      );
-    } catch (e) {
-      debugPrint('VoiceService._fetchAndRegisterToken error: $e');
-      if (e is DioException) debugPrint('  response: ${e.response?.data}');
-    }
-  }
-
-  String? get identity => _identity;
-
-  Future<void> answer() async {
-    await TwilioVoice.instance.call.answer();
-  }
-
-  Future<void> reject() async {
-    await TwilioVoice.instance.call.hangUp();
-  }
-
-  Future<void> hangUp() async {
-    await TwilioVoice.instance.call.hangUp();
-  }
-
-  Future<void> toggleMute(bool mute) async {
-    await TwilioVoice.instance.call.toggleMute(mute);
-  }
-
-  Future<void> toggleSpeaker(bool speaker) async {
-    await TwilioVoice.instance.call.toggleSpeaker(speaker);
-  }
-
-  Future<bool> makeCall(String to, {String? callerId}) async {
-    try {
-      final extraOptions = <String, dynamic>{};
-      if (callerId != null && callerId.isNotEmpty) {
-        extraOptions['CallerId'] = callerId;
-      }
-      debugPrint('VoiceService.makeCall: to=$to, from=$_identity, extras=$extraOptions');
-      final result = await TwilioVoice.instance.call.place(
-        to: to,
-        from: _identity ?? '',
-        extraOptions: extraOptions,
-      ) ?? false;
-      debugPrint('VoiceService.makeCall: result=$result');
-      return result;
-    } catch (e) {
-      debugPrint('VoiceService.makeCall error: $e');
-      return false;
-    }
-  }
-
-  Future<void> sendDigits(String digits) async {
-    await TwilioVoice.instance.call.sendDigits(digits);
-  }
-
-  Future<List<Map<String, dynamic>>> getQueueCalls(int queueId) async {
-    final response = await _api.dio.get('/queues/$queueId/calls');
-    return List<Map<String, dynamic>>.from(response.data['calls'] ?? []);
-  }
-
-  Future<void> acceptQueueCall(String callSid) async {
-    await _api.dio.post('/calls/$callSid/accept', data: {
-      'client_identity': _identity,
-    });
-  }
-
-  Future<void> holdCall(String callSid) async {
-    await _api.dio.post('/calls/$callSid/hold');
-  }
-
-  Future<void> unholdCall(String callSid) async {
-    await _api.dio.post('/calls/$callSid/unhold');
-  }
-
-  Future<void> transferCall(String callSid, String target) async {
-    await _api.dio.post('/calls/$callSid/transfer', data: {'target': target});
-  }
-
-  void dispose() {
-    _tokenRefreshTimer?.cancel();
-    _eventSubscription?.cancel();
-    _eventSubscription = null;
-    _callEventController.close();
-  }
-}