Phase 3.7: paid pairing flow + returning chat + extension flip

- Backend: payment_sessions + pairing_failures tables; payment.service.js
  and pairing-failure.service.js (new); rewritten pairing.service.js
  (payment-gated blast + targeted "Curhat lagi" + cancel + fallback);
  rewritten extension.service.js (data-driven auto-approve with offline
  safeguard, charge-at-approval); pricing.service.js (extension tiers
  without free trial); mitra-status.service.js (countAvailableMitras
  cached path); 60s sweeper for stale payment sessions
- Backend routes: client.payment.routes, client.mitra-availability.routes,
  internal/failed-pairings.routes; client.chat.routes rewritten for
  payment-gated start + /returning + /cancel + /fallback-to-blast;
  internal/config.routes adds 4 new keys with Valkey invalidate publish
- client_app: mitra-availability poll, payment screen + notifier, pairing
  notifier rewrite (PairingTargetedWaiting + PairingFailed states),
  targeted-waiting overlay + bestie-unavailable dialog, "Curhat lagi"
  CTA, failed-pairing terminal, extension via payment-session
- mitra_app: PairingRequestType enum, returning-chat 20s countdown
  auto-dismiss, extension card "otomatis disetujui" copy
- control_center: 4 new config rows in Settings, Failed Pairings page
  (filter + paginate + action menu), sidebar + route registered
- Test infrastructure: Vitest backend (7/7 pass), Playwright CC (4/4
  pass), Maestro mobile scaffold (CLI install pending)
- Bugs found via Playwright + fixed: LoginPage labels not associated
  with inputs (a11y); backend internal CORS missing PATCH/PUT/DELETE
  in allow-methods (silent settings breakage in browsers since Stage 4)
- Docs: phase3.7.md PRD, phase3.7-plan.md, phase3.7-questions.md (Q&A),
  phase3.7-testing.md (E2E checklist), phase3.7-test-run-2026-05-03.md
  (today's run results)

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

mitra_app/.maestro/README.md

@@ -0,0 +1,85 @@
+# mitra_app Maestro flows
+
+End-to-end UI automation for the mitra Flutter app using [Maestro](https://maestro.mobile.dev). Single-emulator + curl-as-customer pattern — when a flow needs a customer to "do something", it's simulated via backend API calls fired from `runScript` steps.
+
+## One-time install
+
+See [client_app/.maestro/README.md](../../client_app/.maestro/README.md#one-time-install) — Maestro is a global CLI, install once and it serves both apps.
+
+You also need:
+- `adb` on your PATH (Android Studio platform-tools)
+- `jq` (`apt install jq` / `brew install jq`)
+- One Android emulator OR one connected device — **only one at a time** (per project decision)
+
+## Folder layout
+
+```
+.maestro/
+├── README.md                 # this file
+├── config.yaml               # shared env: app IDs, backend URL, test credentials
+├── flows/
+│   ├── 01_smoke.yaml
+│   ├── 02_online_offline_toggle.yaml
+│   └── 03_accept_general_blast.yaml
+└── scripts/
+    └── customer_blast_now.sh
+```
+
+## Configure for your environment
+
+Edit `.maestro/config.yaml` and fill in:
+- `BACKEND_URL` — must match the `--dart-define=API_BASE_URL=...` value the installed APK was built with
+- `TEST_CUSTOMER_ID` and `TEST_CUSTOMER_JWT` — used by the curl harness to fire blasts toward this mitra
+
+## Run a flow
+
+```bash
+maestro test mitra_app/.maestro/flows/01_smoke.yaml
+
+# all flows
+maestro test mitra_app/.maestro/flows/
+```
+
+If multiple devices are attached:
+```bash
+adb devices
+maestro --device emulator-5554 test mitra_app/.maestro/flows/01_smoke.yaml
+```
+
+## Per-machine overrides
+
+Override config.yaml values at runtime:
+
+```bash
+maestro test \
+  --env BACKEND_URL=http://192.168.99.10:3000 \
+  --env TEST_CUSTOMER_JWT=eyJhbGc... \
+  mitra_app/.maestro/flows/03_accept_general_blast.yaml
+```
+
+## Single-emulator + curl pattern
+
+This mirrors the client_app pattern. When a mitra-side flow needs the customer to act, the flow uses `runScript:` to fire the customer's API calls directly:
+
+1. Mitra app is on screen via Maestro on the only connected device
+2. `runScript: ../scripts/customer_blast_now.sh` creates + confirms a payment_session and fires a chat request as a "fake" customer
+3. The mitra app receives the blast via WS as it would from a real customer; Maestro asserts the overlay appears
+
+For the customer-side equivalent (drive customer with Maestro, simulate mitra via curl), see [`client_app/.maestro/`](../../client_app/.maestro/).
+
+## When to run mitra flows vs. client_app flows
+
+- **Default**: drive the customer side via `client_app/.maestro/`. Most Phase 3.7 assertions live there (CTA gating, payment screen, searching screen, failed-pairing terminal, "Curhat lagi" overlays).
+- **Run mitra flows when** you specifically need to assert mitra UI:
+  - Returning-chat 20s countdown actually visible + ticking
+  - Extension card copy reads "otomatis disetujui"
+  - Online/offline toggle behavior (Section J — mitra goes offline mid-session)
+  - Incoming-request overlay accept/decline buttons
+
+## Adding a new flow
+
+See [client_app/.maestro/README.md](../../client_app/.maestro/README.md#adding-a-new-flow) — same pattern.
+
+## Troubleshooting
+
+See [client_app/.maestro/README.md](../../client_app/.maestro/README.md#troubleshooting) — same checklist applies.

mitra_app/.maestro/config.yaml

@@ -0,0 +1,22 @@
+# Shared variables for all mitra_app Maestro flows.
+#
+# Override at runtime with `maestro test --env KEY=value` or by setting shell env vars.
+# See README.md for full setup + per-machine overrides.
+
+env:
+  # App identifiers
+  APP_ID_ANDROID: com.halobestie.mitra.mitra_app
+  APP_ID_IOS: com.halobestie.mitra
+
+  # Backend the app talks to — must match what the installed APK was built with.
+  BACKEND_URL: http://192.168.88.247:3000
+  BACKEND_INTERNAL_URL: http://192.168.88.247:3001
+
+  # Test mitra credentials — must exist in the mitras table on the target backend.
+  MITRA_PHONE: "+628200000001"
+  MITRA_OTP: "123456"
+
+  # If you need to drive a "second actor" (e.g., a customer creating a blast), the test
+  # flows curl the backend directly using these credentials.
+  TEST_CUSTOMER_ID: "REPLACE-WITH-A-REAL-CUSTOMER-UUID"
+  TEST_CUSTOMER_JWT: "REPLACE-WITH-A-VALID-CUSTOMER-JWT"

mitra_app/.maestro/flows/01_smoke.yaml

@@ -0,0 +1,14 @@
+# Smoke test: launch the app and assert the home screen renders.
+# Use this flow first to verify Maestro can talk to your device/emulator at all.
+#
+# Run:
+#   maestro test mitra_app/.maestro/flows/01_smoke.yaml
+#
+# Pre-req: mitra_app debug APK installed on the connected device, signed in as a mitra.
+appId: ${APP_ID_ANDROID}
+---
+- launchApp:
+    clearState: false
+- assertVisible:
+    text: "Sesi Aktif|Riwayat Chat"
+    timeout: 10000

mitra_app/.maestro/flows/02_online_offline_toggle.yaml

@@ -0,0 +1,23 @@
+# Verifies the online/offline toggle works and reflects in the UI.
+# This is independent of the customer side — pure mitra UI test.
+#
+# Run:
+#   maestro test mitra_app/.maestro/flows/02_online_offline_toggle.yaml
+appId: ${APP_ID_ANDROID}
+---
+- launchApp:
+    clearState: false
+
+# Find the toggle and capture initial state.
+- assertVisible:
+    text: "Online|Offline"
+
+# Tap the toggle — it's a Switch widget; Maestro can tap by adjacent text label.
+- tapOn:
+    text: "Online|Offline"
+
+# After flipping, the opposite label should appear within ~2s
+# (status is server-confirmed via /api/mitra/status/online or /offline).
+- assertVisible:
+    text: "Online|Offline"
+    timeout: 5000

mitra_app/.maestro/flows/03_accept_general_blast.yaml

@@ -0,0 +1,33 @@
+# Mirror of client_app's 03_payment_to_chat_happy.yaml — this drives the MITRA side
+# of the same flow. Use this when you specifically need to assert mitra-side UI
+# (the incoming overlay, accept tap behavior).
+#
+# Pre-req:
+#   1. Mitra signed in to the mitra_app and ONLINE
+#   2. TEST_CUSTOMER_ID and TEST_CUSTOMER_JWT in .maestro/config.yaml point at a real customer
+#   3. The customer has an existing confirmed payment_session ready to blast (use the
+#      seed_customer_pending_blast.sh helper)
+#
+# Run:
+#   maestro test mitra_app/.maestro/flows/03_accept_general_blast.yaml
+appId: ${APP_ID_ANDROID}
+---
+- launchApp:
+    clearState: false
+- assertVisible: "Online"   # ensure mitra is online before triggering the blast
+
+# Step 1: simulate a customer creating a confirmed payment + firing a general blast.
+# This script returns once the blast notification has been sent to this mitra.
+- runScript: ../scripts/customer_blast_now.sh
+
+# Step 2: incoming-request overlay appears on this device
+- assertVisible:
+    text: "Terima"
+    timeout: 10000
+- assertVisible: "Tolak"
+
+# Step 3: mitra accepts → overlay closes, chat opens
+- tapOn: "Terima"
+- assertVisible:
+    text: "Sesi Aktif"
+    timeout: 5000

mitra_app/.maestro/scripts/customer_blast_now.sh

@@ -0,0 +1,36 @@
+#!/usr/bin/env bash
+# Seed a confirmed payment_session for the test customer and fire a general blast.
+# Used by Maestro flows that drive the mitra side and need a customer's request to
+# arrive without running a second app.
+#
+# Reads from .maestro/config.yaml env (BACKEND_URL, TEST_CUSTOMER_ID, TEST_CUSTOMER_JWT).
+
+set -euo pipefail
+
+: "${BACKEND_URL:?BACKEND_URL must be set in .maestro/config.yaml}"
+: "${TEST_CUSTOMER_JWT:?TEST_CUSTOMER_JWT must be set in .maestro/config.yaml}"
+
+# Step 1: create a payment session (paid tier, 30 minutes)
+echo "Creating payment session..."
+ps_response=$(curl -fsSL -X POST "$BACKEND_URL/api/client/payment-sessions" \
+  -H "Authorization: Bearer $TEST_CUSTOMER_JWT" \
+  -H "Content-Type: application/json" \
+  -d '{"duration_minutes": 30}')
+payment_session_id=$(echo "$ps_response" | jq -r '.data.id')
+echo "  payment_session_id=$payment_session_id"
+
+# Step 2: confirm the payment session
+echo "Confirming payment session..."
+curl -fsSL -X POST "$BACKEND_URL/api/client/payment-sessions/$payment_session_id/confirm" \
+  -H "Authorization: Bearer $TEST_CUSTOMER_JWT" \
+  -H "Content-Type: application/json" \
+  -d '{}' > /dev/null
+
+# Step 3: fire the chat request (general blast)
+echo "Firing general blast..."
+curl -fsSL -X POST "$BACKEND_URL/api/client/chat-requests" \
+  -H "Authorization: Bearer $TEST_CUSTOMER_JWT" \
+  -H "Content-Type: application/json" \
+  -d "{\"payment_session_id\":\"$payment_session_id\",\"topic_sensitivity\":\"regular\"}" > /dev/null
+
+echo "OK — blast fired. Mitra should receive the WS event within ~1s."

mitra_app/lib/core/chat/chat_request_notifier.dart

@@ -37,12 +37,19 @@ class ChatRequestIncomingData extends ChatRequestData {
   final bool? isFreeTrial;
   final TopicSensitivity topicSensitivity;
   final DateTime? createdAt;
+  // Distinguishes general blast vs targeted "Curhat lagi" requests.
+  // Returning requests carry a server-driven confirmation window; the overlay shows a
+  // countdown but the server is the source of truth on auto-reject.
+  final PairingRequestType requestType;
+  final int? confirmationTimeoutSeconds;
   const ChatRequestIncomingData(
     this.sessionId, {
     this.durationMinutes,
     this.isFreeTrial,
     this.topicSensitivity = TopicSensitivity.regular,
     this.createdAt,
+    this.requestType = PairingRequestType.general,
+    this.confirmationTimeoutSeconds,
   });
 }
 
@@ -103,6 +110,8 @@ class ChatRequest extends _$ChatRequest {
           'is_free_trial': r['is_free_trial'],
           'topic_sensitivity': r['topic_sensitivity'],
           'created_at': r['created_at'],
+          'request_type': r['request_type'],
+          'confirmation_timeout_seconds': r['confirmation_timeout_seconds'],
         };
 
         if (state is ChatRequestIncomingData ||
@@ -118,6 +127,8 @@ class ChatRequest extends _$ChatRequest {
             createdAt: r['created_at'] != null
                 ? DateTime.tryParse(r['created_at'] as String)
                 : null,
+            requestType: PairingRequestType.fromString(r['request_type'] as String?),
+            confirmationTimeoutSeconds: r['confirmation_timeout_seconds'] as int?,
           );
         }
       }
@@ -207,6 +218,8 @@ class ChatRequest extends _$ChatRequest {
           createdAt: data['created_at'] != null
               ? DateTime.tryParse(data['created_at'] as String)
               : null,
+          requestType: PairingRequestType.fromString(data['request_type'] as String?),
+          confirmationTimeoutSeconds: data['confirmation_timeout_seconds'] as int?,
         );
       }
 
@@ -287,6 +300,8 @@ class ChatRequest extends _$ChatRequest {
         createdAt: next['created_at'] != null
             ? DateTime.tryParse(next['created_at'] as String)
             : null,
+        requestType: PairingRequestType.fromString(next['request_type'] as String?),
+        confirmationTimeoutSeconds: next['confirmation_timeout_seconds'] as int?,
       );
       validateIncomingRequest();
     } else {

mitra_app/lib/core/chat/widgets/chat_request_overlay.dart

@@ -1,3 +1,4 @@
+import 'dart:async';
 import 'package:flutter/material.dart';
 import 'package:flutter_riverpod/flutter_riverpod.dart';
 import '../chat_request_notifier.dart';
@@ -20,6 +21,13 @@ class _ChatRequestOverlayState extends ConsumerState<ChatRequestOverlay>
   late final Animation<Offset> _slideAnimation;
   bool _visible = false;
 
+  // Returning-chat countdown. Server is the source of truth on auto-reject;
+  // this is purely visual. When it hits 0 we dismiss the overlay and let the server's
+  // chat_request_closed event (or stale state) take over.
+  Timer? _countdownTimer;
+  int? _secondsRemaining;
+  String? _countdownSessionId;
+
   @override
   void initState() {
     super.initState();
@@ -35,6 +43,7 @@ class _ChatRequestOverlayState extends ConsumerState<ChatRequestOverlay>
 
   @override
   void dispose() {
+    _stopCountdown();
     _animController.dispose();
     super.dispose();
   }
@@ -47,11 +56,52 @@ class _ChatRequestOverlayState extends ConsumerState<ChatRequestOverlay>
   }
 
   void _hide() {
+    _stopCountdown();
     _animController.reverse().then((_) {
       if (mounted) setState(() => _visible = false);
     });
   }
 
+  void _startCountdown(String sessionId, int seconds) {
+    _stopCountdown();
+    _countdownSessionId = sessionId;
+    _secondsRemaining = seconds;
+    _countdownTimer = Timer.periodic(const Duration(seconds: 1), (_) {
+      if (!mounted) return;
+      final remaining = (_secondsRemaining ?? 0) - 1;
+      if (remaining <= 0) {
+        // Auto-dismiss UI only — server fires the actual auto-reject and will follow up
+        // with a chat_request_closed event. Do NOT call decline from the client here.
+        setState(() => _secondsRemaining = 0);
+        _stopCountdown();
+        _hide();
+      } else {
+        setState(() => _secondsRemaining = remaining);
+      }
+    });
+  }
+
+  void _stopCountdown() {
+    _countdownTimer?.cancel();
+    _countdownTimer = null;
+    _countdownSessionId = null;
+    _secondsRemaining = null;
+  }
+
+  void _maybeStartCountdownFor(ChatRequestIncomingData data) {
+    final timeout = data.confirmationTimeoutSeconds;
+    if (data.requestType == PairingRequestType.returning &&
+        timeout != null &&
+        timeout > 0) {
+      // Restart only if this is a different session than the one we're already counting.
+      if (_countdownSessionId != data.sessionId) {
+        _startCountdown(data.sessionId, timeout);
+      }
+    } else {
+      _stopCountdown();
+    }
+  }
+
   void _onSwipeDown(DragEndDetails details) {
     if (details.primaryVelocity != null && details.primaryVelocity! > 200) {
       final state = ref.read(chatRequestProvider);
@@ -66,7 +116,12 @@ class _ChatRequestOverlayState extends ConsumerState<ChatRequestOverlay>
   @override
   Widget build(BuildContext context) {
     ref.listen(chatRequestProvider, (prev, next) {
-      if (next is ChatRequestIncomingData || next is ChatRequestStaleData) {
+      if (next is ChatRequestIncomingData) {
+        _show();
+        _maybeStartCountdownFor(next);
+      } else if (next is ChatRequestStaleData) {
+        // Stale message replaces the active request — kill any returning-chat countdown.
+        _stopCountdown();
         _show();
       } else if (next is ChatRequestAcceptedData) {
         _hide();
@@ -137,6 +192,15 @@ class _ChatRequestOverlayState extends ConsumerState<ChatRequestOverlay>
             : '';
     final isSensitive = data.topicSensitivity == TopicSensitivity.sensitive;
     final theme = SensitivityTheme.of(data.topicSensitivity);
+    final isReturning = data.requestType == PairingRequestType.returning;
+    final showCountdown = isReturning &&
+        _countdownSessionId == data.sessionId &&
+        _secondsRemaining != null;
+    final headlineText =
+        isReturning ? 'Customer ingin chat lagi!' : 'Ada permintaan chat baru!';
+    final subtitleText = isReturning
+        ? 'Seorang customer yang pernah chat denganmu ingin lanjut.'
+        : 'Seorang customer ingin curhat denganmu.';
 
     return Container(
       decoration: BoxDecoration(
@@ -164,11 +228,15 @@ class _ChatRequestOverlayState extends ConsumerState<ChatRequestOverlay>
                   borderRadius: BorderRadius.circular(2),
                 ),
               ),
-              const Icon(Icons.chat, size: 48, color: Colors.blue),
+              Icon(
+                isReturning ? Icons.replay_circle_filled : Icons.chat,
+                size: 48,
+                color: isReturning ? Colors.deepPurple : Colors.blue,
+              ),
               const SizedBox(height: 12),
-              const Text(
-                'Ada permintaan chat baru!',
-                style: TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
+              Text(
+                headlineText,
+                style: const TextStyle(fontSize: 20, fontWeight: FontWeight.bold),
               ),
               const SizedBox(height: 4),
               if (durationText.isNotEmpty)
@@ -181,10 +249,36 @@ class _ChatRequestOverlayState extends ConsumerState<ChatRequestOverlay>
                 SensitivityBadge(sensitivity: data.topicSensitivity, fontSize: 12),
               ],
               const SizedBox(height: 8),
-              const Text(
-                'Seorang customer ingin curhat denganmu.',
-                style: TextStyle(fontSize: 14, color: Colors.grey),
+              Text(
+                subtitleText,
+                style: const TextStyle(fontSize: 14, color: Colors.grey),
               ),
+              if (showCountdown) ...[
+                const SizedBox(height: 12),
+                Container(
+                  padding: const EdgeInsets.symmetric(horizontal: 12, vertical: 6),
+                  decoration: BoxDecoration(
+                    color: Colors.orange.shade50,
+                    borderRadius: BorderRadius.circular(16),
+                    border: Border.all(color: Colors.orange.shade200),
+                  ),
+                  child: Row(
+                    mainAxisSize: MainAxisSize.min,
+                    children: [
+                      Icon(Icons.timer_outlined, size: 16, color: Colors.orange.shade800),
+                      const SizedBox(width: 6),
+                      Text(
+                        'Konfirmasi dalam ${_secondsRemaining}s',
+                        style: TextStyle(
+                          fontSize: 13,
+                          fontWeight: FontWeight.w600,
+                          color: Colors.orange.shade800,
+                        ),
+                      ),
+                    ],
+                  ),
+                ),
+              ],
               const SizedBox(height: 20),
               Row(
                 children: [

mitra_app/lib/core/constants.dart

@@ -74,6 +74,19 @@ enum TopicSensitivity {
       values.firstWhere((e) => e.value == v, orElse: () => TopicSensitivity.regular);
 }
 
+/// Pairing request type — distinguishes general blast from targeted
+/// "Curhat lagi" returning-chat requests.
+enum PairingRequestType {
+  general('general'),
+  returning('returning');
+
+  final String value;
+  const PairingRequestType(this.value);
+
+  static PairingRequestType fromString(String? v) =>
+      values.firstWhere((e) => e.value == v, orElse: () => PairingRequestType.general);
+}
+
 /// WebSocket message types
 class WsMessage {
   // Auth

mitra_app/lib/features/chat/screens/mitra_chat_screen.dart

@@ -459,6 +459,10 @@ class _MitraChatScreenState extends ConsumerState<MitraChatScreen> {
     final isResponding = extState is ExtensionRespondingData;
     final topic = TopicSensitivity.fromString(request['topic_sensitivity'] as String?);
     final isSensitive = topic == TopicSensitivity.sensitive;
+    // Extensions auto-approve on mitra non-response (server-side, with connectivity
+    // safeguards). Surface the configured timeout to the mitra so they know what
+    // "no response" means in this card.
+    final timeoutSeconds = request['timeout_seconds'] as int?;
 
     return Container(
       color: isSensitive ? SensitivityTheme.sensitive.bgTint : null,
@@ -477,6 +481,18 @@ class _MitraChatScreenState extends ConsumerState<MitraChatScreen> {
             ],
             const SizedBox(height: 8),
             Text('Customer ingin perpanjang $duration menit', textAlign: TextAlign.center),
+            if (timeoutSeconds != null) ...[
+              const SizedBox(height: 12),
+              Text(
+                'Tidak menjawab dalam $timeoutSeconds detik = otomatis disetujui',
+                textAlign: TextAlign.center,
+                style: TextStyle(
+                  fontSize: 13,
+                  color: Colors.grey.shade700,
+                  fontStyle: FontStyle.italic,
+                ),
+              ),
+            ],
             const SizedBox(height: 24),
             if (isResponding)
               const CircularProgressIndicator()